:root{
  /* ---- design tokens (Phase 1) ---- */
  --color-ink:#101A1A;
  --color-deep:#12352F;
  --color-accent:#D8892B;
  --color-accent-light:#E7A855;
  --color-cream:#F7F4EE;
  --color-white:#FFFFFF;
  --color-muted:#66706D;
  --color-line:#DDD9D0;

  /* legacy aliases kept so existing inline homepage styles still resolve */
  --navy-900:var(--color-ink);
  --navy-800:var(--color-deep);
  --navy-700:#1B463C;
  --orange-500:var(--color-accent);
  --orange-400:var(--color-accent-light);
  --cream-50:var(--color-cream);
  --sky-400:#5FA8D3;
  --white:var(--color-white);
  --line:rgba(16,26,26,0.14);

  /* spacing scale */
  --sp-1:8px; --sp-2:12px; --sp-3:16px; --sp-4:24px; --sp-5:32px;
  --sp-6:48px; --sp-7:64px; --sp-8:80px; --sp-9:96px; --sp-10:128px;

  /* radius + shadow */
  --radius-sm:4px; --radius-md:8px; --radius-lg:12px;
  --shadow-sm:0 1px 2px rgba(16,26,26,0.06);
  --shadow-md:0 4px 16px rgba(16,26,26,0.08);

  --container-max:1240px;
  --transition-fast:180ms ease;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html, body{ overflow-x:hidden; width:100%; }
body{
  margin:0;
  background:var(--color-cream);
  color:var(--color-ink);
  font-family:'Work Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:'DM Serif Display', serif; margin:0; font-weight:400; }
.mono{ font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em; }
a{ color:inherit; }
img{ max-width:100%; display:block; }

/* ---------- NAV ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:var(--color-deep);
  border-bottom:1px solid rgba(255,255,255,0.1);
}
.nav-inner{
  max-width:var(--container-max); margin:0 auto; padding:18px var(--sp-4);
  display:flex; align-items:center; justify-content:space-between;
}
.brand{ display:flex; align-items:center; gap:10px; color:var(--color-white); text-decoration:none; }
.brand-mark{
  width:34px; height:34px; border-radius:50%;
  background:var(--color-accent);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.brand-mark svg{ width:19px; height:19px; }
.brand-name{ font-size:16px; font-weight:600; line-height:1.1; font-family:'Work Sans', sans-serif; }
.brand-name span{ display:block; font-family:'Work Sans',sans-serif; font-size:10.5px; font-weight:500; color:var(--color-accent-light); letter-spacing:0.08em; margin-top:2px; }
nav ul{ list-style:none; display:flex; gap:32px; margin:0; padding:0; }
nav a{ color:rgba(255,255,255,0.78); text-decoration:none; font-size:14px; font-weight:500; transition:color var(--transition-fast); }
nav a:hover, nav a:focus-visible{ color:var(--color-accent-light); }
.nav-cta{
  background:var(--color-accent); color:var(--color-ink) !important; font-weight:600;
  padding:10px 20px; border-radius:var(--radius-md); font-size:13.5px;
}
.nav-toggle{ display:none; }
.desktop-only{ display:flex; align-items:center; gap:28px; }
.mobile-menu{ display:none; }

/* ---------- BUTTONS ---------- */
.btn-primary{
  background:var(--color-ink); color:var(--color-white); text-decoration:none;
  padding:14px 26px; border-radius:var(--radius-md); font-weight:600; font-size:14px;
  display:inline-block; border:1px solid var(--color-ink); cursor:pointer;
  transition:background var(--transition-fast), border-color var(--transition-fast);
}
.btn-primary:hover{ background:var(--color-deep); border-color:var(--color-deep); }
.btn-ghost{
  background:transparent;
  border:1px solid var(--color-ink); color:var(--color-ink); text-decoration:none;
  padding:14px 26px; border-radius:var(--radius-md); font-weight:600; font-size:14px;
  display:inline-block; transition:background var(--transition-fast), color var(--transition-fast);
}
.btn-ghost:hover{ background:var(--color-ink); color:var(--color-white); }
.btn-ghost.on-dark{ border-color:rgba(255,255,255,0.45); color:var(--color-white); }
.btn-ghost.on-dark:hover{ background:rgba(255,255,255,0.12); color:var(--color-white); }

/* ---------- BREADCRUMB ---------- */
.breadcrumb{
  max-width:var(--container-max); margin:0 auto; padding:20px var(--sp-4) 0;
  font-family:'Work Sans',sans-serif; font-size:13px; color:var(--color-muted); letter-spacing:0.01em;
}
.breadcrumb a{ color:var(--color-deep); text-decoration:none; }
.breadcrumb a:hover{ color:var(--color-accent); }

/* ---------- PAGE HERO (destination/rwanda banner) ---------- */
.page-hero{
  background:var(--color-deep);
  padding:64px var(--sp-4) 72px;
  position:relative;
  overflow:hidden;
}
.page-hero-inner{ max-width:var(--container-max); margin:0 auto; position:relative; }
.page-kicker{
  font-family:'Work Sans',sans-serif; font-size:12.5px; color:var(--color-accent-light);
  letter-spacing:0.1em; text-transform:uppercase; margin-bottom:16px; display:inline-block; font-weight:600;
}
.page-hero h1{ color:var(--color-white); font-size:clamp(2.5rem,6vw,4.5rem); line-height:1.05; font-weight:400; }
.page-hero p.hook{ color:rgba(255,255,255,0.72); font-size:17px; max-width:560px; margin-top:18px; line-height:1.6; font-family:'Work Sans',sans-serif; }
.page-hero-meta{ display:flex; gap:var(--sp-4); margin-top:var(--sp-5); flex-wrap:wrap; }
.page-hero-meta .k{ font-family:'Work Sans',sans-serif; font-size:11px; color:var(--color-accent-light); letter-spacing:0.08em; text-transform:uppercase; font-weight:600; }
.page-hero-meta .v{ color:var(--color-white); font-weight:600; font-size:15px; margin-top:6px; font-family:'Work Sans',sans-serif; }
.page-hero-cta{ margin-top:var(--sp-5); display:flex; gap:var(--sp-2); flex-wrap:wrap; }
.page-hero-media{
  margin-top:var(--sp-5); aspect-ratio:21/9; border-radius:var(--radius-lg);
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.14);
  display:flex; align-items:center; justify-content:center; text-align:center; padding:28px;
}
.page-hero-media-note{ color:rgba(255,255,255,0.45); font-size:13.5px; line-height:1.6; max-width:340px; font-family:'Work Sans',sans-serif; }
@media (max-width:600px){ .page-hero-media{ aspect-ratio:4/3; } }
.page-hero-media.has-img{ position:relative; overflow:hidden; padding:0; display:block; }
.page-hero-media.has-img img,
.dest-card .band.has-img img,
.guide-card .band.has-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.dest-card .band.has-img, .guide-card .band.has-img{ position:relative; overflow:hidden; padding:0; display:block; }

/* ---------- EXPLORE MORE (prev/next destination) ---------- */
.explore-more{
  display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3);
  border-top:1px solid var(--color-line); padding-top:var(--sp-4); flex-wrap:wrap;
}
.explore-more a{
  font-family:'Work Sans',sans-serif; font-weight:600; font-size:14.5px; text-decoration:none;
  color:var(--color-ink); display:inline-flex; align-items:center; gap:6px;
}
.explore-more a:hover{ color:var(--color-accent); }
.explore-more .all-link{ color:var(--color-muted); font-weight:500; }

/* ---------- SECTION SHELL ---------- */
section{ padding:80px var(--sp-4); }
.section-inner{ max-width:var(--container-max); margin:0 auto; }
.section-head{ margin-bottom:var(--sp-5); max-width:620px; }
.section-kicker{
  font-family:'Work Sans',sans-serif; font-size:12.5px; color:var(--color-ink);
  letter-spacing:0.08em; text-transform:uppercase; margin-bottom:12px; font-weight:600;
  display:inline-flex; align-items:center; gap:8px;
}
.section-kicker::before{ content:""; width:14px; height:2px; background:var(--color-accent); display:inline-block; flex-shrink:0; }
.dark-band .section-kicker{ color:var(--color-accent-light); }
.section-head h2{ font-size:clamp(2rem,4vw,2.75rem); color:var(--color-ink); line-height:1.15; font-weight:400; }
.section-head p{ margin-top:16px; color:var(--color-muted); font-size:16px; line-height:1.6; font-family:'Work Sans',sans-serif; }
.prose{ color:var(--color-muted); font-size:16px; line-height:1.75; max-width:760px; font-family:'Work Sans',sans-serif; }
.prose + .prose{ margin-top:var(--sp-3); }

/* ---------- CARDS GRID (places / foods / safaris) ---------- */
.cards-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-4); }
.info-card{
  background:var(--color-white); border:1px solid var(--color-line); border-radius:var(--radius-lg);
  padding:28px 26px; position:relative; box-shadow:var(--shadow-sm);
}
.info-card .num{
  font-family:'Work Sans',sans-serif; font-size:12px; color:var(--color-accent);
  letter-spacing:0.04em; margin-bottom:14px; display:block; font-weight:600;
}
.info-card h3{ font-size:18px; color:var(--color-ink); font-weight:600; font-family:'Work Sans',sans-serif; }
.info-card p{ margin-top:10px; color:var(--color-muted); font-size:14.5px; line-height:1.6; font-family:'Work Sans',sans-serif; }
.info-card .icon-ring{
  width:44px; height:44px; border-radius:50%; background:var(--color-deep);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
}
.info-card .icon-ring svg{ width:20px; height:20px; }
@media (max-width:900px){ .cards-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .cards-grid{ grid-template-columns:1fr; } }

/* ---------- DARK BAND (used for Rwanda safari section etc) ---------- */
.dark-band{ background:var(--color-ink); }
.dark-band .section-head h2{ color:var(--color-white); }
.dark-band .section-head p{ color:rgba(255,255,255,0.6); }
.dark-band .info-card{ background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.14); box-shadow:none; }
.dark-band .info-card h3{ color:var(--color-white); }
.dark-band .info-card p{ color:rgba(255,255,255,0.6); }

/* ---------- DESTINATION HUB / RWANDA TEASER CARDS ---------- */
.dest-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:var(--sp-4); }
.dest-card{
  background:var(--color-white); border:1px solid var(--color-line); border-radius:var(--radius-lg);
  overflow:hidden; text-decoration:none; color:inherit; display:block;
  transition:transform var(--transition-fast), box-shadow var(--transition-fast);
  box-shadow:var(--shadow-sm);
}
.dest-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.dest-card .band{
  height:170px; background:var(--color-deep);
  display:flex; align-items:center; justify-content:center; position:relative;
  padding:16px; text-align:center;
}
.dest-card .band-note{ color:rgba(255,255,255,0.4); font-size:11px; line-height:1.5; font-family:'Work Sans',sans-serif; }
.dest-card .body{ padding:20px 22px; }
.dest-card h3{ font-size:17px; color:var(--color-ink); font-family:'Work Sans',sans-serif; font-weight:600; }
.dest-card p{ margin-top:6px; font-family:'Work Sans',sans-serif; font-size:11.5px; color:var(--color-muted); letter-spacing:0.04em; text-transform:uppercase; font-weight:600; }
@media (max-width:480px){ .dest-grid{ grid-template-columns:1fr; } }

/* ---------- CTA BAND ---------- */
.cta-band{
  background:var(--color-deep); border-radius:var(--radius-lg); padding:48px 44px;
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap;
}
.cta-band h3{ color:var(--color-white); font-size:26px; font-weight:400; }
.cta-band p{ color:rgba(255,255,255,0.6); margin-top:10px; font-size:14.5px; font-family:'Work Sans',sans-serif; }

/* ---------- FORM CONTROLS (global) ---------- */
input, select, textarea{
  font-family:'Work Sans',sans-serif; font-size:15px; color:var(--color-ink);
  background:var(--color-white); border:1px solid var(--color-line); border-radius:var(--radius-md);
  padding:12px 14px; line-height:1.4; width:100%; transition:border-color var(--transition-fast);
}
label{ font-family:'Work Sans',sans-serif; font-size:13.5px; font-weight:600; color:var(--color-ink); display:block; margin-bottom:6px; }
input:focus, select:focus, textarea:focus{
  outline:none; border-color:var(--color-accent);
  box-shadow:0 0 0 3px rgba(216,137,43,0.18);
}

/* ---------- FOOTER ---------- */
footer{
  background:var(--color-ink); color:rgba(255,255,255,0.55);
  padding:28px var(--sp-4); text-align:center; font-size:13px;
  border-top:1px solid rgba(255,255,255,0.1);
}
footer strong{ color:rgba(255,255,255,0.8); }
footer a{ color:rgba(255,255,255,0.7); text-decoration:underline; }

/* ---------- mobile nav ---------- */
@media (max-width:820px){
  .desktop-only{ display:none; }
  .nav-toggle{
    display:flex; background:none; border:none; color:var(--color-white);
    font-size:22px; cursor:pointer; align-items:center; justify-content:center;
    width:44px; height:44px; padding:0; margin:-8px -10px -8px 0;
  }
  .mobile-menu{
    display:none; flex-direction:column; gap:2px;
    background:var(--color-deep); padding:8px var(--sp-4) 18px; border-top:1px solid rgba(255,255,255,0.1);
  }
  .mobile-menu.open{ display:flex; }
  .mobile-menu a{ color:rgba(255,255,255,0.85); text-decoration:none; padding:12px 0; font-size:15px; border-bottom:1px solid rgba(255,255,255,0.08); }
  .mobile-menu .nav-cta{ margin-top:10px; text-align:center; }
}

@media (max-width:380px){
  section{ padding:56px var(--sp-3); }
  .page-hero{ padding:44px var(--sp-3) 48px; }
  .nav-inner{ padding:12px var(--sp-3); }
  .cta-band{ padding:28px 22px; flex-direction:column; align-items:flex-start; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}

/* ---------- SERVICE ROWS (Services page) ---------- */
.service-rows{ border-top:1px solid var(--color-line); }
.service-row{
  display:grid; grid-template-columns:60px 1fr auto; gap:var(--sp-4); align-items:start;
  padding:var(--sp-5) 0; border-bottom:1px solid var(--color-line);
}
.service-row .num{ font-family:'Work Sans',sans-serif; font-weight:600; color:var(--color-accent); font-size:14px; padding-top:4px; }
.service-row h3{ font-size:20px; color:var(--color-ink); font-weight:600; font-family:'Work Sans',sans-serif; }
.service-row .subtitle{ color:var(--color-ink); font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin-top:4px; font-family:'Work Sans',sans-serif; display:inline-flex; align-items:center; gap:6px; }
.service-row .subtitle::before{ content:""; width:10px; height:2px; background:var(--color-accent); display:inline-block; }
.service-row p{ margin-top:10px; color:var(--color-muted); font-size:15px; line-height:1.6; max-width:560px; font-family:'Work Sans',sans-serif; }
.service-row .go{ color:var(--color-accent); font-weight:600; font-size:14px; text-decoration:none; white-space:nowrap; padding-top:6px; }
.service-row .go:hover{ text-decoration:underline; }
@media (max-width:640px){
  .service-row{ grid-template-columns:36px 1fr; }
  .service-row .go{ grid-column:2; margin-top:12px; }
}

/* ---------- GUIDE CARDS (Travel Guides) ---------- */
.guide-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-4); }
.guide-card{
  background:var(--color-white); border:1px solid var(--color-line); border-radius:var(--radius-lg);
  overflow:hidden; text-decoration:none; color:inherit; display:block; box-shadow:var(--shadow-sm);
  transition:transform var(--transition-fast), box-shadow var(--transition-fast);
}
.guide-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.guide-card .band{
  height:140px; background:var(--color-deep); display:flex; align-items:center; justify-content:center;
  padding:16px; text-align:center;
}
.guide-card .band-note{ color:rgba(255,255,255,0.4); font-size:11px; line-height:1.5; font-family:'Work Sans',sans-serif; }
.guide-card .body{ padding:22px; }
.guide-card .cat{ font-family:'Work Sans',sans-serif; font-size:11.5px; color:var(--color-ink); letter-spacing:0.06em; text-transform:uppercase; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.guide-card .cat::before{ content:""; width:10px; height:2px; background:var(--color-accent); display:inline-block; }
.guide-card h3{ font-size:17px; color:var(--color-ink); font-weight:600; margin-top:8px; font-family:'Work Sans',sans-serif; line-height:1.35; }
.guide-card p{ margin-top:8px; color:var(--color-muted); font-size:14px; line-height:1.55; font-family:'Work Sans',sans-serif; }
.guide-card .go{ margin-top:12px; color:var(--color-accent); font-weight:600; font-size:13.5px; display:block; }
@media (max-width:900px){ .guide-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .guide-grid{ grid-template-columns:1fr; } }

/* ---------- IATA TRUST BLOCK (shared pages) ---------- */
.iata-trust{ display:flex; align-items:center; gap:var(--sp-4); }
.iata-trust .badge{
  flex-shrink:0; width:76px; height:76px; border-radius:50%;
  background:var(--color-accent); color:var(--color-ink);
  display:flex; align-items:center; justify-content:center;
  font-family:'Work Sans',sans-serif; font-weight:700; font-size:14px; letter-spacing:0.02em;
}
.iata-trust h3{ font-size:20px; color:var(--color-white); font-weight:600; font-family:'Work Sans',sans-serif; }
.iata-trust p{ margin-top:8px; color:rgba(255,255,255,0.65); font-size:14.5px; line-height:1.6; font-family:'Work Sans',sans-serif; }
@media (max-width:600px){ .iata-trust{ flex-direction:column; text-align:center; } }

.article-body{ max-width:720px; margin:0 auto; }
.article-body h2{ font-size:1.6rem; color:var(--color-ink); margin-top:var(--sp-6); font-weight:400; }
.article-body p{ color:var(--color-muted); font-size:16px; line-height:1.8; margin-top:var(--sp-3); font-family:'Work Sans',sans-serif; }
.article-body ul{ margin-top:var(--sp-3); padding-left:20px; color:var(--color-muted); font-size:16px; line-height:1.8; font-family:'Work Sans',sans-serif; }
.article-body li{ margin-bottom:8px; }
.article-placeholder{
  border:1px dashed var(--color-line); border-radius:var(--radius-md); padding:var(--sp-4);
  color:var(--color-muted); font-size:14.5px; font-style:italic; margin-top:var(--sp-3);
}

/* Two-image comparison layout */
.page-hero-media.compare{ display:grid; grid-template-columns:1fr 1fr; aspect-ratio:auto; gap:2px; }
.compare-item{ position:relative; margin:0; overflow:hidden; aspect-ratio:7/6; }
.compare-item img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.compare-item figcaption{ position:absolute; left:0; right:0; bottom:0; padding:28px 16px 12px; color:#fff; font-family:'Work Sans',sans-serif; font-weight:600; font-size:14px; letter-spacing:0.04em; background:linear-gradient(to top, rgba(16,26,26,0.75), rgba(16,26,26,0)); }
@media (max-width:600px){ .page-hero-media.compare{ grid-template-columns:1fr; } .compare-item{ aspect-ratio:16/10; } }
.dest-card .band.split, .guide-card .band.split{ display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.dest-card .band.split img, .guide-card .band.split img{ position:static; min-width:0; }

footer .footer-links{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px 20px; margin-bottom:14px; }
footer .footer-links a{ color:inherit; opacity:.85; text-decoration:none; font-size:13.5px; }
footer .footer-links a:hover{ opacity:1; text-decoration:underline; }