/* =====================================================================
   ET VOYAJ — BLOCKS · CALM PASS
   Loads AFTER skin-blocks.css and only changes COLOUR VALUES and
   colour ROLES. No layout, type or copy is touched.

   The three brand colours stay. What changes is:
   1. CHROMA — the logo colours are ink colours (small marks, buttons).
      Large fields use the same hue at lower chroma, so a full-bleed
      navy reads as the same navy without buzzing.
   2. ROLE — navy = surface, gold = accent, red = punctuation.
      Red never sits on navy except on ONE element: the primary button.
   3. COUNT — one accent per section, not three. Labels and index
      numerals go quiet (navy/mute); the accent is spent once.
   4. The royal-blue (#123a99) glows and the metal gradients on type
      are removed — they were reading as a fourth and fifth colour.
   ===================================================================== */

:root{
 /* paper — a hair less yellow so the navy blocks land softer */
 --p0:#faf8f4; --p1:#f4f0e8; --p2:#ece6da; --p3:#e0d8c8;

 /* the block — same navy family, field chroma pulled down */
 --blue:#1b2c4e; --blue-lo:#131f39; --blue-hi:#2c4270; --blue-lt:#a2b3d4;
 --ink:#1e2c4a; --body:#4c5468; --mute:rgba(30,44,74,.6);

 /* the sun — one gold for paper (legible), one for navy (soft) */
 --gold:#8d6e35; --gold-mid:#ab8848; --gold-lt:#c4a469;
 --gold-sun:#d7bb85; --gold-pale:#e7d3aa;
 --gold-grad:none;

 /* the signature — deepened so it stops fluorescing */
 --red:#a5201f; --red-hi:#bd3a33; --red-soft:rgba(165,32,31,.1);

 --hair:rgba(30,44,74,.14); --hair-light:rgba(255,255,255,.2);
}

/* photography: full colour, no extra punch (the page has enough) */
.voices .ph,.map-detail .photo .img,.frame-ph,.svc .preview .ph{ filter:saturate(1.02) contrast(1.02); }

/* ---- hairlines between paper sections: neutral, not brown ---- */
.intro,.pullquote,.logos,.voices,.home-programs,.megamenu,
.marquee-strip,.stats .hdr,.stat{ border-color:var(--hair) !important; }
.marquee-strip{ border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
.svc-list,.voices .panel,.story .timeline,.home-programs .hp-index{ border-top-color:rgba(30,44,74,.5); }
.svc{ border-bottom-color:rgba(30,44,74,.16); }
.story .tl-item,.home-programs .hp-row{ border-bottom-color:rgba(30,44,74,.15); }

/* ============ NAV ============ */
.nav.nav-dark{ background:rgba(27,44,78,.86); border-bottom-color:rgba(215,187,133,.28); }
.nav.nav-light,.nav.nav-beige{ border-bottom-color:var(--hair); }
.nav.nav-light .cta:hover,.nav.nav-beige .cta:hover{ background:var(--blue); border-color:var(--blue); }

/* ============ HERO — one navy block, gold is the only accent ============ */
.hero .bg{
 background:
  radial-gradient(120% 95% at 76% 34%, rgba(44,66,112,.75) 0%, rgba(44,66,112,0) 60%),
  radial-gradient(90% 80% at 8% 96%, rgba(16,26,50,.8) 0%, rgba(16,26,50,0) 62%),
  var(--blue);
}
.hero .photo{ opacity:.075; }
.hero .grain{ opacity:.1; }
/* no metal gradient on display type — one flat, soft gold */
.hero h1 .it{ background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--gold-sun); }
.hero .meta{ border-top-color:rgba(255,255,255,.22); }
.hero .meta .item .k{ color:rgba(255,255,255,.55); }
.hero .meta .item .v .it{ color:var(--gold-sun); }
.hero .sidecol .dot{ background:var(--gold-sun); }
.hero-slate{ background:rgba(16,26,50,.55); border-color:rgba(255,255,255,.14); }
.hero-slate .rec{ color:var(--gold-sun); }
.hero-slate .rec .dot{ background:var(--gold-sun); box-shadow:0 0 8px rgba(215,187,133,.45); }
.hero-slate .k{ color:rgba(215,187,133,.85); }

/* the seal: gold only, no red glint on navy */
.hero .fwrap.seal{
 background:
  radial-gradient(circle at 50% 50%, rgba(215,187,133,0) 0 45.2%, rgba(215,187,133,.4) 45.2% 45.8%, rgba(215,187,133,0) 45.9%),
  radial-gradient(circle at 50% 50%, rgba(16,26,50,.5) 0 45.4%, rgba(16,26,50,0) 45.8%);
}
.hero .f-glow{ background:radial-gradient(circle at 50% 50%, rgba(215,187,133,.14), transparent 66%); }
.seal .kh-faint2{ stroke:rgba(215,187,133,.16); }
.seal .kh-ray{ stroke:rgba(215,187,133,.1); }
.seal .kh-gold{ stroke:rgba(215,187,133,.85); stroke-width:1.6; }
.seal .kh-soft{ stroke:rgba(215,187,133,.34); }
.seal .kh-diamond{ fill:rgba(255,255,255,.07); stroke:rgba(215,187,133,.7); }
.seal .kh-starfill{ fill:rgba(215,187,133,.16); stroke:rgba(215,187,133,.7); }
.seal .kh-core{ fill:#efdcb2; filter:drop-shadow(0 0 10px rgba(215,187,133,.5)); }
.seal .kh-ember{ fill:rgba(215,187,133,.7); }
.seal .kh-coreglow{ opacity:.25; } .seal .kh-bloom{ opacity:.28; }
.seal stop{ stop-color:var(--gold-sun); } .seal stop:first-child{ stop-color:#f2e2c0; }

/* ============ MARQUEE — the one red line on paper, kept ============ */
.marquee-strip{ background:var(--p1); color:var(--ink); }
.marquee-track .it{ color:var(--red); }
.marquee-track .star{ color:var(--gold-mid); }

/* ============ INTRO — navy heading, red italic, gold swash ============ */
.intro .midcol h2 .ul::after{ background:var(--gold-lt); opacity:.5; }
.intro .leftcol .num .it{ color:var(--gold-mid); }
.intro .rightcol .sig{ color:var(--ink); }

/* ============ STATS — numerals in navy; gold is the suffix only ============ */
.stats{ background:var(--p2); }
.stats::before{ background:radial-gradient(ellipse at 100% 0%, rgba(255,255,255,.55), transparent 58%); }
.stats .hdr h3{ color:var(--gold); }
.stat .big{ background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--ink); }
.stat .big .suffix{ color:var(--gold-mid); }

/* ============ SERVICES ============ */
.svc:hover,.svc.is-active{ background:var(--blue); }
.svc:hover .n,.svc.is-active .n,
.svc:hover .name .it,.svc.is-active .name .it,
.svc:hover .arr,.svc.is-active .arr{ color:var(--gold-sun); }
.svc .preview .ph{ background:linear-gradient(135deg,var(--blue-hi),var(--blue-lo)); }

/* ============ DESTINATIONS — second block, gold only ============ */
.destinations::before{ background:radial-gradient(ellipse at 78% 18%, rgba(44,66,112,.7), transparent 60%),radial-gradient(ellipse at 6% 94%, rgba(16,26,50,.75), transparent 60%); }
.dest-head .label,.dest-head h2 .it,.dest-head .all-link{ color:var(--gold-sun); }
.dest-head .all-link{ border-bottom-color:rgba(215,187,133,.7); }
.map-wrap .country{ fill:rgba(255,255,255,.055); stroke:rgba(215,187,133,.42); }
.map-wrap:hover .country{ stroke:rgba(215,187,133,.7); }
.map-wrap .compass{ fill:rgba(215,187,133,.75); }
.map-wrap .water-label{ fill:rgba(162,179,212,.55); }
/* pins were red on navy — the loudest clash on the page */
.map-pin::before{ background:var(--gold-sun); }
.map-pin::after{ border-color:rgba(215,187,133,.7); }
.map-pin:hover::before,.map-pin.active::before{ background:#fff; }
.map-pin:hover .pin-label,.map-pin.active .pin-label{ color:var(--gold-sun); }
.map-wrap .journey-path{ stroke:rgba(215,187,133,.9); }
.map-detail .photo .scrim{ background:linear-gradient(180deg,rgba(16,26,50,.04) 0%,transparent 38%,rgba(16,26,50,.78) 100%); }
.map-detail .photo .marker,.map-detail .body .tag,.map-detail .body .row .k,
.map-detail .body .ask,.map-foot .hint,.map-foot .legend .dot{ color:var(--gold-sun); }
.map-foot .legend .dot{ background:var(--gold-sun); }
.map-detail .body .ask{ border-bottom-color:rgba(215,187,133,.7); }
.map-detail .stack{ background:var(--blue-lo); border-top-color:rgba(215,187,133,.4); }

/* ============ STORY ============ */
.story{ background:var(--p1); }
.story::before{ color:rgba(30,44,74,.07); }
.story .narrative p .drop{ color:var(--ink); } .story .narrative p .drop .it{ color:var(--gold-mid); }
.story .tl-item .yr .it{ color:var(--gold-mid); }

/* ============ PULLQUOTE + LOGOS ============ */
.pullquote .portrait{ background:linear-gradient(160deg,var(--gold-pale),#b89158 45%,var(--blue-lo)); }
.pullquote .quote .open{ color:rgba(196,164,105,.75); }
.logos .row .lg:hover{ color:var(--gold); }

/* ============ VOICES ============ */
.voices{ background:var(--p0); }
.voices .hdr .counter .cur{ color:var(--gold-mid); }
.voices .panel .open{ color:rgba(196,164,105,.7); }
.voices .panel .author .avatar{ background:linear-gradient(135deg,var(--gold-lt),var(--blue)); }
.voices .panel .dots .d.active::after{ background:var(--gold-mid); }
.voices .thumb.active .mini::before{ border-color:var(--gold-sun); }

/* ============ PROGRAMS ============ */
.home-programs{ background:var(--p2); }
.home-programs::before{ color:rgba(30,44,74,.055); }
.home-programs .rt-stop i{ background:rgba(30,44,74,.6); }
.home-programs .rt-stop.end-stop i{ background:var(--gold-mid); box-shadow:0 0 0 4px rgba(171,136,72,.14); }
.home-programs .hp-row:hover .rt-stop i{ background:var(--gold-mid); }
.home-programs .hp-arr{ color:var(--gold-mid); }
.home-programs .hp-row.is-active .hp-name .it,
.home-programs .hp-row.is-active .hp-num,
.home-programs .hp-row.is-active .hp-arr{ color:var(--gold-sun); }

/* ============ CTA + FOOTER — closing block ============ */
section.cta::before{ background:radial-gradient(ellipse 70% 55% at 50% 0%, rgba(44,66,112,.6), transparent 66%),radial-gradient(ellipse 60% 50% at 50% 104%, rgba(215,187,133,.1), transparent 62%); }
section.cta h2 .it,section.cta .lede::before,.cta-foot .marq{ color:var(--gold-sun); }
section.cta .lede::before{ background:rgba(215,187,133,.8); }
/* the one deliberate red-on-navy moment on the page */
.btn-primary{ background:var(--red); border-color:var(--red); color:#fff; }
.btn-primary:hover{ background:#fff; border-color:#fff; color:var(--blue); }
.btn-ghost{ border-color:rgba(255,255,255,.3); }
.btn-ghost:hover{ border-color:var(--gold-sun); color:var(--gold-sun); }
.cta-foot{ border-top-color:rgba(255,255,255,.18); }

.site-footer{ background:var(--blue-lo); }
.site-footer::before{ background:radial-gradient(ellipse at 90% 0%, rgba(215,187,133,.08), transparent 58%),radial-gradient(ellipse at 0% 100%, rgba(44,66,112,.5), transparent 58%); }
.footer-mark .wordmark .it,.footer-mark .tagline .em,.footer-col h5,
.footer-col ul li a:hover,.footer-col ul li a::before,.footer-brief h5,
.footer-brief .input button,.footer-mid .offices .o strong,
.footer-mid .langs a.active,.footer-legal .marq{ color:var(--gold-sun); }
.footer-brief{ border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.03); }
.brief-btn{ border-color:rgba(215,187,133,.8); color:var(--gold-sun); }
.brief-btn:hover{ background:var(--gold-sun); color:var(--blue); }
.footer-mid .socials a:hover{ background:var(--gold-sun); border-color:var(--gold-sun); color:var(--blue); }

/* ============ MEGAMENU + MOBILE MENU ============ */
.megamenu{ border-bottom-color:var(--hair); }
.megamenu .listing a{ border-top-color:var(--hair); }
.megamenu .listing a:hover{ color:var(--gold); }
.megamenu .lead h4 .it{ color:var(--red); }
.mobile-menu::before{ background:radial-gradient(ellipse 70% 55% at 80% 100%, rgba(215,187,133,.14), transparent 62%),radial-gradient(ellipse 70% 55% at 10% 0%, rgba(16,26,50,.85), transparent 62%); }
.mobile-menu .mm-cta .mm-dot{ background:var(--gold-sun); box-shadow:0 0 0 3px rgba(215,187,133,.22); }
.mobile-menu .mm-social-row a:hover{ background:var(--gold-sun); border-color:var(--gold-sun); color:var(--blue); }
.mobile-menu .mm-group.open .mm-toggle{ border-color:rgba(215,187,133,.7); }

/* ============ SPLASH ============ */
.splash-door{ background:var(--blue); }
.splash-door::before{ background:repeating-linear-gradient(45deg, transparent 0 27px, rgba(215,187,133,.045) 27px 28px),repeating-linear-gradient(-45deg, transparent 0 27px, rgba(215,187,133,.045) 27px 28px); }
.splash-door--left,.splash-door--right{ border-color:rgba(215,187,133,.16); }
.splash-geo .gl{ stroke:rgba(215,187,133,.34); }
.splash-geo .gl.bright{ stroke:rgba(215,187,133,.7); }
.splash-glow{ background:radial-gradient(circle, rgba(215,187,133,.1) 0%, transparent 68%); }
.splash-skip:hover{ color:var(--gold-sun); }

/* ---- quiet supporting text on the navy blocks ---- */
.hero .label,.hero .sidecol,.hero .scroll,.trust-strip,.ta-label{ color:rgba(255,255,255,.72); }
.hero .caption,.map-pin .pin-label{ color:rgba(255,255,255,.55); }
