:root{
  --dest-accent:#217A4F;
  --dest-text:#2c2c2c;
  --dest-muted:#666;
  --dest-border:#e9e9e9;

  /* type scale helpers */
  --fs-hero: clamp(28px, 4vw + 1rem, 48px);
  --fs-intro-title: clamp(24px, 3.2vw + .5rem, 48px);
  --fs-intro-desc: clamp(15px, 1.3vw + .4rem, 18px);
  --fs-card-title: clamp(16px, 1.2vw + .6rem, 20px);
  --fs-small: clamp(12px, .6vw + .45rem, 14px);
  --radius: 10px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Poppins",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--dest-text);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* container */
.dest-container{max-width:1400px;margin:0 auto;padding:0 24px;}
@media (max-width:640px){ .dest-container{padding:0 16px;} }

/* ===== HERO ===== */
.dest-hero{
  position:relative;
  height:680px;
  background-size:cover;
  background-position:center;
  color:#fff;
}
.dest-hero::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.38));
}
.dest-hero .inner{
  position:relative; z-index:2;
  max-width:1400px; margin:0 auto; padding:0 24px;
  height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
}
.dest-hero h1{
  font-size:var(--fs-hero);
  font-weight:700; line-height:1.12; margin:0 0 10px;
}
.dest-hero .breadcrumb{
  font-size:var(--fs-small); opacity:.95;
}
.dest-hero .breadcrumb a{color:#fff;text-decoration:none;opacity:.9;}
.dest-hero .breadcrumb .active{font-weight:700;}

@media (max-width:1024px){
  .dest-hero{height:540px;}
}
@media (max-width:640px){
  .dest-hero{height:420px;}
  .dest-hero::after{background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.5));}
}

/* ===== INTRO + SEPARATOR ===== */
.dest-intro{padding:56px 0 20px;text-align:center;}
.dest-intro .intro-title{
  font-size:var(--fs-intro-title);
  font-weight:600; margin:0 0 12px; color:var(--dest-text);
  line-height:1.18;
}
.dest-intro .intro-desc{
  max-width:980px; margin:0 auto;
  font-size:var(--fs-intro-desc);
  font-weight:300; line-height:1.8; color:var(--dest-muted);
}
.dest-sep{height:1px;background:#efefef;margin:20px auto;width:100%;}

/* ===== CARDS ===== */
.dest-section{padding:12px 0 72px;}
.continent-card{
  border:1px solid var(--dest-border);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 8px 30px rgba(0,0,0,.04);
  overflow:hidden;
  margin-bottom:28px;
}
.continent-card .grid{
  display:grid;
  grid-template-columns:319px 1fr;
  align-items:stretch;
  gap:0;
}
@media (max-width:980px){
  .continent-card .grid{grid-template-columns:1fr;}
}

/* media block */
.card-media{
  position:relative; align-self:stretch; min-height:383px; overflow:hidden;
}
.card-media img{
  width:100%; height:100%; object-fit:cover; transition:transform .35s ease;
}
.continent-card:hover .card-media img{transform:scale(1.06);}
@media (max-width:980px){ .card-media{min-height:300px;} }
@media (max-width:640px){ .card-media{min-height:220px;} }

/* body */
.card-body{
  padding:22px 26px;
  display:flex; flex-direction:column; justify-content:flex-start; align-items:flex-start; text-align:left;
}
.card-head{
  display:flex; align-items:center; gap:10px; margin-bottom:8px; color:var(--dest-text);
}
.card-head .name{
  font-size:var(--fs-card-title);
  font-weight:700; text-decoration:none; color:var(--dest-text);
}

/* subtitle */
.card-subttl,
h5.sans.font-14.text-uppercase.text-gray{
  font-size:var(--fs-small);
  font-weight:500; color:#707070; text-transform:uppercase; letter-spacing:.04em; margin:0 0 12px;
}

/* ===== COUNTRY LIST (3 columns of lined rows) ===== */
.country-list-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 28px;                 /* no row gap to keep the line continuous */
  width:100%;
  max-width:1007px;           /* requested width; stays left-aligned */
}
@media (max-width:1200px){
  .country-list-grid{gap:0 22px;}
}
@media (max-width:1100px){
  .country-list-grid{grid-template-columns:repeat(2,1fr); max-width:100%;}
}
@media (max-width:640px){
  .country-list-grid{grid-template-columns:1fr; max-width:100%;}
}

.country-item{ position:relative; }
.country-item .row{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px;
  padding:10px 0; border-bottom:1px solid #efefef;
}
.country-item .link{
  display:flex; align-items:center; gap:10px;
  color:var(--dest-accent); text-decoration:none; font-weight:600; font-size:var(--fs-small);
}
.country-item .link .fa-globe{ color:var(--dest-accent); opacity:.9; }

/* Toggle arrow (touch-friendly) */
.country-item .toggle{
  border:0; background:transparent; cursor:pointer; line-height:1;
  padding:8px; margin:-8px; /* bigger hit area without shifting layout */
  min-width:40px; min-height:40px; display:flex; align-items:center; justify-content:center;
}
.country-item .toggle i{ color:var(--dest-accent); transition:transform .2s ease; font-size:16px; }
.country-item.open .toggle i{ transform:rotate(180deg); }

/* cities dropdown */
.cities-list{ display:none; padding:8px 0 12px 26px; }
.country-item.open .cities-list{ display:block; }
.cities-list a{
  display:flex; align-items:center; gap:8px; padding:8px 0;
  color:var(--dest-text); text-decoration:none; font-size:var(--fs-small);
}
.cities-list a:hover{ color:var(--dest-accent); }

/* ===== UTILITIES ===== */
.sans{font-family:"Poppins",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;}
.font-14{font-size:14px;}
.text-uppercase{text-transform:uppercase;letter-spacing:.04em;}
.text-gray{color:#707070;}
.text-red{color:var(--dest-accent)!important;}
.float-right{float:right;}

/* ===== RESPONSIVE POLISH ===== */
@media (max-width:980px){
  .card-body{padding:18px 20px;}
}
@media (max-width:640px){
  .dest-intro{padding:36px 0 12px;}
  .card-body{padding:16px;}
  .card-subttl{margin-bottom:8px;}
  .dest-section{padding:8px 0 56px;}
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important; transition:none!important; scroll-behavior:auto!important;}
}
