/* =====================================================
HT COUNTRIES SYSTEM
===================================================== */

/* =====================================================
LAYOUT OVERRIDE FOR COUNTRY PAGES
===================================================== */

.single-ht_country .main-content,
.single-ht_country .media-main-content{
width:100%!important;
max-width:100%!important;
flex:0 0 100%!important;
}

.single-ht_country .vc_sidebar{
display:none!important;
}

.single-ht_country .container,
.single-ht_country .content-area{
max-width:1280px;
width:100%;
margin:0 auto;
}

/* =====================================================
COUNTRIES ARCHIVE / INDEX
===================================================== */

.ht-countries-page{
margin:0 0 30px;
padding-top:20px;
}

.ht-countries-page-title{
font-size:28px;
font-weight:700;
margin:0 0 20px 0;
line-height:1.2;
}

.ht-countries-filters{
display:flex;
flex-wrap:wrap;
gap:10px;
margin:0 0 30px;
}

.ht-countries-filters a{
display:inline-block;
padding:8px 16px;
background:#f5f5f5;
border-radius:20px;
font-size:14px;
text-decoration:none;
color:#333;
border:1px solid #ddd;
transition:all .2s ease;
}

.ht-countries-filters a:hover,
.ht-countries-filters a.active{
background:#1d4f91;
color:#fff;
border-color:#1d4f91;
}

.ht-countries-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
gap:20px;
}

.ht-country-archive-card{
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:10px;
overflow:hidden;
transition:all .2s ease;
}

.ht-country-archive-card:hover{
transform:translateY(-3px);
box-shadow:0 8px 22px rgba(0,0,0,0.08);
}

.ht-country-archive-link{
display:block;
text-decoration:none;
color:inherit;
}

.ht-country-archive-image{
padding:22px;
text-align:center;
background:#f7f7f7;
border-bottom:1px solid #e2e2e2;
}

.ht-country-archive-image img{
max-height:80px;
width:auto;
margin:0 auto;
display:block;
}

.ht-country-archive-content{
padding:16px;
text-align:center;
}

.ht-country-archive-title{
font-size:18px;
font-weight:700;
margin:0 0 6px;
line-height:1.3;
color:#1d4f91;
}

.ht-country-archive-region{
font-size:13px;
font-weight:600;
color:#666;
margin:0 0 6px;
}

.ht-country-archive-count{
font-size:13px;
color:#777;
}

/* =====================================================
COUNTRY PAGE WRAPPER
===================================================== */

.ht-country-single-wrap{
margin:0 auto 40px auto;
max-width:1280px;
padding:20px;
box-sizing:border-box;
}

.ht-country-single{
width:100%;
max-width:none;
}

/* =====================================================
HEADER
===================================================== */

.ht-country-header{
display:grid;
grid-template-columns:2fr 1fr;
gap:32px;
margin:0 0 34px;
align-items:stretch;
}

.ht-country-header-main{
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:12px;
padding:24px 28px;
display:flex;
flex-direction:column;
justify-content:flex-start;
align-items:flex-start;
}

.ht-country-breadcrumbs{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:6px;
font-size:12px;
line-height:1.3;
color:#666;
margin:0 0 18px;
}

.ht-country-breadcrumbs a{
color:#1d4f91;
text-decoration:none;
}

.ht-country-breadcrumb-sep{
color:#999;
}

.ht-country-breadcrumb-flag{
display:inline-flex;
align-items:center;
margin-right:6px;
}

.ht-country-breadcrumb-flag img{
width:18px;
height:auto;
border-radius:2px;
display:block;
}

.ht-country-breadcrumb-current{
color:#111;
font-weight:600;
}

.ht-country-brand{
margin:0 0 18px;
}

.ht-country-brand img{
max-width:260px;
width:100%;
height:auto;
display:block;
}

.ht-country-header-text{
width:100%;
}

.ht-country-name{
font-size:34px;
font-weight:700;
line-height:1.1;
margin:0 0 12px;
color:#111;
}

.ht-country-meta{
display:flex;
flex-wrap:wrap;
gap:18px;
font-size:14px;
line-height:1.4;
color:#555;
margin:0;
align-items:center;
}

.ht-country-meta span{
display:inline-flex;
align-items:center;
}

.ht-country-meta a{
color:#1d4f91;
font-weight:600;
text-decoration:none;
}

.ht-country-meta a:hover{
text-decoration:underline;
}

/* sponsor */

.ht-country-header-sponsor{
display:flex;
height:100%;
}

.ht-country-sponsor-link{
display:block;
width:100%;
height:100%;
text-decoration:none;
color:inherit;
}

.ht-country-sponsor-card{
background:#f7f7f7;
border:1px solid #e0e0e0;
border-radius:12px;
padding:18px;
text-align:center;
display:flex;
flex-direction:column;
justify-content:center;
box-shadow:0 6px 20px rgba(0,0,0,0.06);
height:100%;
}

.ht-country-sponsor-image{
margin:0 0 12px;
}

.ht-country-sponsor-image img{
width:100%;
max-width:270px;
aspect-ratio:1/1;
object-fit:cover;
display:block;
margin:0 auto;
border-radius:8px;
}

.ht-country-sponsor-name{
font-size:16px;
font-weight:700;
line-height:1.3;
color:#111;
margin:0 0 8px;
}

.ht-country-sponsor-message{
font-size:13px;
line-height:1.5;
color:#555;
}

/* =====================================================
COMMON SECTION HEADINGS
===================================================== */

.ht-country-summary h2,
.ht-country-dashboard h2,
.ht-country-projects h2,
.ht-country-strategy h2,
.ht-country-finance h2,
.ht-country-coverage h2{
font-size:24px;
font-weight:700;
line-height:1.2;
color:#111;
margin:0 0 16px;
}

/* =====================================================
COUNTRY OVERVIEW
===================================================== */

.ht-country-summary{
margin:0 0 34px;
font-size:15px;
line-height:1.8;
color:#333;
}

.ht-country-summary p{
margin:0 0 16px;
}

/* =====================================================
DASHBOARD
===================================================== */

.single-ht_country .ht-country-dashboard{
margin:0 0 34px;
}

.single-ht_country .ht-country-dashboard-head{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:20px;
align-items:start;
margin:0 0 14px;
}

.single-ht_country .ht-country-dashboard-topline{
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:flex-end;
align-items:center;
}

.single-ht_country .ht-country-dashboard-topline span{
display:inline-flex;
align-items:center;
padding:10px 14px;
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:8px;
font-size:13px;
line-height:1.3;
color:#444;
box-shadow:0 2px 8px rgba(0,0,0,0.03);
}

.single-ht_country .ht-country-dashboard-topline strong{
color:#111;
margin-right:4px;
}

.single-ht_country .ht-country-dashboard-topline a{
color:#1d4f91;
text-decoration:none;
font-weight:700;
}

.single-ht_country .ht-country-dashboard-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:16px;
}

.single-ht_country .ht-country-stat-card{
position:relative;
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:10px;
padding:18px 16px 18px 72px;
min-height:118px;
box-shadow:0 2px 8px rgba(0,0,0,0.03);
}

.single-ht_country .ht-country-stat-icon{
position:absolute;
top:18px;
left:18px;
width:40px;
height:40px;
border-radius:10px;
background:#eef4fb;
}

.single-ht_country .ht-country-stat-icon:before{
display:block;
width:100%;
height:100%;
text-align:center;
font-size:20px;
line-height:40px;
color:#1d4f91;
}

.single-ht_country .ht-country-stat-card-population .ht-country-stat-icon:before{content:"👥";}
.single-ht_country .ht-country-stat-card-gdp .ht-country-stat-icon:before{content:"£";}
.single-ht_country .ht-country-stat-card-roads .ht-country-stat-icon:before{content:"🛣";}
.single-ht_country .ht-country-stat-card-rail .ht-country-stat-icon:before{content:"🚆";}
.single-ht_country .ht-country-stat-card-ports .ht-country-stat-icon:before{content:"⚓";}
.single-ht_country .ht-country-stat-card-airports .ht-country-stat-icon:before{content:"✈";}
.single-ht_country .ht-country-stat-card-construction .ht-country-stat-icon:before{content:"🏗";}
.single-ht_country .ht-country-stat-card-exports .ht-country-stat-icon:before{content:"📦";}

.single-ht_country .ht-country-stat-label{
display:block;
font-size:12px;
font-weight:700;
line-height:1.3;
color:#666;
margin:0 0 6px;
}

.single-ht_country .ht-country-stat-value{
display:block;
font-size:24px;
font-weight:700;
line-height:1.2;
color:#111;
word-break:break-word;
}

.single-ht_country .ht-country-stat-value.small{
font-size:18px;
line-height:1.35;
}

.single-ht_country .ht-country-stat-value small{
font-size:12px;
font-weight:600;
color:#777;
margin-left:4px;
}

/* =====================================================
PROJECTS + COVERAGE
===================================================== */

.ht-country-projects,
.ht-country-coverage{
margin:0 0 34px;
}

.ht-country-coverage{
border-top:1px solid #e5e5e5;
padding-top:30px;
}

.ht-country-coverage-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:20px;
}

.ht-country-coverage-card{
display:block;
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:10px;
overflow:hidden;
text-decoration:none;
transition:all .2s ease;
}

.ht-country-coverage-card:hover{
transform:translateY(-3px);
box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.ht-country-coverage-image{
width:100%;
overflow:hidden;
}

.ht-country-coverage-image img{
width:100%;
height:180px;
object-fit:cover;
display:block;
}

.ht-country-coverage-content{
padding:16px;
}

.ht-country-coverage-title{
display:block;
font-size:16px;
font-weight:700;
line-height:1.4;
color:#1d4f91;
margin:0 0 6px;
}

.ht-country-coverage-date{
display:block;
font-size:12px;
line-height:1.3;
color:#777;
margin:0 0 8px;
}

.ht-country-coverage-excerpt{
display:block;
font-size:13px;
line-height:1.5;
color:#444;
}

/* =====================================================
STRATEGY BOXES
===================================================== */

.ht-country-strategy{
margin:0 0 34px;
}

.ht-country-strategy-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:20px;
}

.ht-country-strategy-card{
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:12px;
padding:22px;
box-shadow:0 2px 8px rgba(0,0,0,0.03);
}

.ht-country-strategy-card h3{
font-size:20px;
font-weight:700;
line-height:1.2;
color:#111;
margin:0 0 12px;
}

.ht-country-strategy-text,
.ht-country-strategy-text p{
font-size:15px;
line-height:1.7;
color:#333;
margin:0 0 12px;
}

/* =====================================================
FINANCE BOX
===================================================== */

.ht-country-finance{
margin:0 0 34px;
}

.ht-country-finance-block{
background:#f7f7f7;
border:1px solid #e2e2e2;
border-radius:12px;
padding:24px;
box-shadow:0 2px 8px rgba(0,0,0,0.03);
min-height:90px;
}

.ht-country-finance-text,
.ht-country-finance-text p{
font-size:15px;
line-height:1.75;
color:#333;
margin:0 0 14px;
}

/* =====================================================
BUTTONS
===================================================== */

.ht-country-readmore{
margin-top:28px;
margin-bottom:14px;
text-align:left;
}

.ht-country-btn{
display:inline-block;
background:#2c6aa0 !important;
color:#fff !important;
padding:10px 18px;
border-radius:6px;
text-decoration:none !important;
font-weight:700;
font-size:14px;
line-height:1.2;
border:none;
box-shadow:none;
}

.ht-country-btn:hover{
opacity:.92;
text-decoration:none !important;
}

/* =====================================================
RESPONSIVE
===================================================== */

@media (max-width:1100px){

.ht-country-header{
grid-template-columns:1fr;
}

.single-ht_country .ht-country-dashboard-head{
grid-template-columns:1fr;
}

.single-ht_country .ht-country-dashboard-topline{
justify-content:flex-start;
}

.single-ht_country .ht-country-dashboard-grid,
.ht-country-coverage-grid,
.ht-country-strategy-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}

}

@media (max-width:768px){

.ht-country-single-wrap{
padding-left:15px;
padding-right:15px;
}

.ht-country-name{
font-size:28px;
}

.ht-country-brand img{
max-width:220px;
}

.single-ht_country .ht-country-dashboard-grid,
.ht-country-coverage-grid,
.ht-country-strategy-grid{
grid-template-columns:1fr;
}

.single-ht_country .ht-country-dashboard-topline span{
width:100%;
}

.ht-country-readmore{
text-align:center;
}

}