/* Visit Locals — Cinematic Motion System v1 */
:root { --vl-ease: cubic-bezier(.22,1,.36,1); --vl-ink:#1F3D2B; --vl-gold:#38BDF8; }
html { scroll-behavior:smooth; }
body { overflow-x:hidden; }

/* Smooth page entrance */
body.vl-ready main { opacity:1; }
body:not(.vl-ready) main { opacity:0; }
body.vl-ready main { transition:opacity .65s ease; }

/* Header glass movement */
header { transition: background-color .45s ease, box-shadow .45s ease, backdrop-filter .45s ease, transform .45s var(--vl-ease); }
header.vl-scrolled { background:rgba(244,237,224,.82)!important; box-shadow:0 10px 35px rgba(31,61,43,.09)!important; backdrop-filter:blur(18px) saturate(1.15)!important; }
header.vl-scrolled img { transform:scale(.94); transition:transform .45s var(--vl-ease); }

/* Scroll reveal */
.vl-reveal { opacity:0; transform:translate3d(0,28px,0); transition:opacity .8s ease, transform .9s var(--vl-ease); }
.vl-reveal.vl-visible { opacity:1; transform:none; }
.vl-reveal.vl-delay-1 { transition-delay:.08s; }
.vl-reveal.vl-delay-2 { transition-delay:.16s; }
.vl-reveal.vl-delay-3 { transition-delay:.24s; }

/* Cinematic sections */
.vl-cinematic { position:relative!important; isolation:isolate; overflow:hidden!important; background:#1F3D2B!important; }
.vl-cinematic::before { content:""; position:absolute; inset:-2.5%; z-index:1; background-image:var(--vl-bg); background-size:cover; background-position:center; transform:translate3d(var(--vl-move-x,0px),var(--vl-move-y,0px),0) scale(1.065); transform-origin:center; transition:transform 1.2s var(--vl-ease), filter 1s ease; filter:saturate(1.02) contrast(1.04); will-change:transform; pointer-events:none; }
.vl-cinematic::after { content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(110deg, rgba(31,61,43,.86) 0%, rgba(31,61,43,.62) 42%, rgba(31,61,43,.30) 100%); pointer-events:none; }
.vl-cinematic > :not(.absolute) { position:relative; z-index:3; }
.vl-cinematic.vl-light::after { background:linear-gradient(110deg,rgba(31,61,43,.82),rgba(31,61,43,.55) 55%,rgba(31,61,43,.28)); }
.vl-cinematic.vl-business::after { background:linear-gradient(110deg,rgba(31,61,43,.90) 0%,rgba(31,61,43,.72) 48%,rgba(31,61,43,.42) 100%); }
.vl-cinematic.vl-business h1, .vl-cinematic.vl-business h2, .vl-cinematic.vl-business p, .vl-cinematic.vl-business .text-primary, .vl-cinematic.vl-business .text-on-surface-variant { color:#fff!important; }
.vl-cinematic.vl-business .border-surface-container-highest { border-color:rgba(255,255,255,.22)!important; }
.vl-cinematic.vl-business .text-tertiary { color:#38BDF8!important; }
.vl-cinematic.vl-business a.border { color:#fff!important; border-color:rgba(255,255,255,.42)!important; }
.vl-cinematic.vl-visible::before { transform:translate3d(var(--vl-move-x,0px),var(--vl-move-y,0px),0) scale(1.035); }

/* Background visual depth on selected content sections */
.vl-atmospheric { position:relative!important; isolation:isolate; overflow:hidden!important; }
.vl-atmospheric::before { content:""; position:absolute; inset:0; z-index:-2; background-image:var(--vl-bg); background-size:cover; background-position:center; opacity:.11; transform:scale(1.03); transition:transform 1.6s var(--vl-ease), opacity .8s ease; }
.vl-atmospheric::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(244,237,224,.88),rgba(244,237,224,.97)); }
.vl-atmospheric.vl-visible::before { transform:scale(1); opacity:.17; }

/* Hero carousel */
.vl-hero-carousel { position:absolute; inset:0; z-index:0; overflow:hidden; background:#1F3D2B; }
.vl-hero-slide { position:absolute; inset:0; opacity:0; transform:scale(1.06); transition:opacity 1.25s ease, transform 7s var(--vl-ease); background-size:cover; background-position:center; }
.vl-hero-slide.is-active { opacity:1; transform:scale(1); }
.vl-hero-carousel::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(31,61,43,.88),rgba(31,61,43,.42) 52%,rgba(31,61,43,.18)),linear-gradient(0deg,rgba(31,61,43,.82),rgba(31,61,43,.08) 62%); }
.vl-carousel-controls { position:absolute; right:clamp(18px,4vw,64px); bottom:clamp(20px,4vw,54px); z-index:3; display:flex; align-items:center; gap:10px; }
.vl-carousel-btn { width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.11);color:#fff;backdrop-filter:blur(10px);display:grid;place-items:center;cursor:pointer;transition:transform .3s var(--vl-ease),background .3s ease,border-color .3s ease; }
.vl-carousel-btn:hover { transform:translateY(-2px) scale(1.04); background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.65); }
.vl-carousel-progress { min-width:96px;height:3px;background:rgba(255,255,255,.25);overflow:hidden;border-radius:99px; }
.vl-carousel-progress span { display:block;height:100%;width:0;background:#38BDF8;animation:vl-progress 6.5s linear infinite; }
@keyframes vl-progress { from{width:0} to{width:100%} }
.vl-carousel-label { color:rgba(255,255,255,.86);font:600 10px/1.2 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase; }

/* Home visual journal */
.vl-visual-journal { position:relative; overflow:hidden; background:#1F3D2B; color:#fff; }
.vl-visual-journal::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 15% 15%,rgba(56,189,248,.22),transparent 30%),radial-gradient(circle at 85% 80%,rgba(3,105,161,.24),transparent 34%); }
.vl-journal-track { display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:rgba(56,189,248,.65) rgba(255,255,255,.10); padding:8px 2px 18px; }
.vl-journal-track::-webkit-scrollbar { display:block; height:7px; }
.vl-journal-track::-webkit-scrollbar-track { background:rgba(255,255,255,.10); border-radius:999px; }
.vl-journal-track::-webkit-scrollbar-thumb { background:rgba(56,189,248,.65); border-radius:999px; }
.vl-journal-card { flex:0 0 min(74vw,420px); height:440px; scroll-snap-align:start; border-radius:20px; overflow:hidden; position:relative; background:#1F3D2B; box-shadow:0 18px 55px rgba(0,0,0,.25); }
.vl-journal-card img { width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--vl-ease),filter .6s ease; }
.vl-journal-card::after { content:""; position:absolute;inset:0;background:linear-gradient(0deg,rgba(31,61,43,.92),rgba(31,61,43,.02) 65%); }
.vl-journal-card:hover img { transform:scale(1.065); filter:saturate(1.08); }
.vl-journal-copy { position:absolute;left:24px;right:24px;bottom:24px;z-index:2; }
.vl-journal-copy span { font:600 10px/1.2 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#38BDF8; }
.vl-journal-copy h3 { margin:.5rem 0 0;font:400 32px/1.08 'Newsreader',serif; }
.vl-journal-copy p { margin:.65rem 0 0;color:rgba(255,255,255,.75);font:400 13px/1.65 'Plus Jakarta Sans',sans-serif; }
.vl-journal-nav { display:flex;gap:8px; }

/* Buttons/cards feel more alive */
.vl-hover-panel,.vl-hover-card,.vl-hover-mini { transition:transform .55s var(--vl-ease),box-shadow .55s ease,background-color .45s ease,border-color .45s ease; }
.vl-hover-panel:hover { transform:translateY(-8px); }
.vl-hover-card:hover { transform:translateY(-8px) scale(1.008); }

/* Image micro motion */
main img:not(.vl-static) { transition:transform .8s var(--vl-ease),filter .5s ease; }
.vl-image-hover:hover { transform:scale(1.035); filter:saturate(1.06); }


/* Visible site scrollbar — the original prototype globally hid it. */
html { scrollbar-width:thin; scrollbar-color:#38BDF8 #EAE0CC; }
body { scrollbar-gutter:stable; }
::-webkit-scrollbar { display:block!important; width:10px; height:10px; }
::-webkit-scrollbar-track { background:#EAE0CC; }
::-webkit-scrollbar-thumb { background:#38BDF8; border-radius:999px; border:2px solid #EAE0CC; }
::-webkit-scrollbar-thumb:hover { background:#0369A1; }

/* Respect reduced-motion */
@media (prefers-reduced-motion:reduce) {
  html{scroll-behavior:auto}.vl-reveal{opacity:1;transform:none;transition:none}.vl-cinematic::before,.vl-atmospheric::before{transform:none;transition:none}.vl-hero-slide{transition:none}.vl-journal-card img{transition:none}.vl-carousel-progress span{animation:none;width:100%}
}

@media (max-width:768px) {
  .vl-journal-card { flex-basis:82vw;height:380px; }
  .vl-carousel-controls { right:18px;bottom:18px; }
  .vl-carousel-label { display:none; }
}


/* V5 — editorial polish: luminous navigation + richer light surfaces */
:root {
  --vl-paper: #F4EDE0;
  --vl-paper-2: #EAE0CC;
  --vl-paper-3: #F4EDE0;
  --vl-line: rgba(3,105,161,.68);
  --vl-line-glow: rgba(56,189,248,.72);
}

/* Luminous menu-line interaction inspired by the reference site's hover language. */
header nav a {
  position:relative;
  isolation:isolate;
  padding-left:.15rem!important;
  padding-right:.15rem!important;
  transition:color .35s ease, transform .35s var(--vl-ease), text-shadow .35s ease!important;
}
header nav a::before {
  content:"";
  position:absolute;
  left:50%;
  bottom:-8px;
  width:0;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#38BDF8 20%,#EAE0CC 50%,#38BDF8 80%,transparent);
  box-shadow:0 0 7px rgba(56,189,248,.75),0 0 15px rgba(56,189,248,.34);
  transform:translateX(-50%);
  transition:width .45s var(--vl-ease), opacity .35s ease;
  opacity:0;
}
header nav a::after {
  content:"";
  position:absolute;
  left:0;
  bottom:-8px;
  width:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#F4EDE0,transparent);
  filter:blur(.35px);
  opacity:0;
  transform:translateX(-115%);
  pointer-events:none;
}
header nav a:hover,
header nav a:focus-visible {
  color:#0369A1!important;
  transform:translateY(-1px);
  text-shadow:0 0 12px rgba(56,189,248,.22);
}
header nav a:hover::before,
header nav a:focus-visible::before,
header nav a.active::before,
header nav a[aria-current="page"]::before {
  width:100%;
  opacity:1;
}
header nav a:hover::after,
header nav a:focus-visible::after {
  width:58%;
  opacity:1;
  animation:vl-nav-light-sweep .72s var(--vl-ease) forwards;
}
@keyframes vl-nav-light-sweep {
  0% { transform:translateX(-115%); opacity:0; }
  18% { opacity:1; }
  100% { transform:translateX(190%); opacity:0; }
}

/* More premium paper tones: warm, layered, not a flat #F4EDE0 field. */
body {
  background:
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.72), transparent 30%),
    linear-gradient(135deg,var(--vl-paper),#F4EDE0 46%,var(--vl-paper-2));
  color:#1F3D2B;
}
main.bg-background, main.w-full.bg-background { background:transparent!important; }
main > div > section.vl-soft-surface-a { background:linear-gradient(135deg,#F4EDE0 0%,#EAE0CC 100%)!important; }
main > div > section.vl-soft-surface-b { background:linear-gradient(135deg,#EAE0CC 0%,#F4EDE0 100%)!important; }
.vl-soft-surface-a::after,.vl-soft-surface-b::after { opacity:.92; }

/* Give white cards a little separation from the paper instead of letting them disappear. */
.vl-page-explore .bg-surface,
.vl-page-experience .bg-surface,
.vl-page-insight .bg-surface,
.vl-page-partner .bg-surface,
.vl-page-business .bg-surface {
  box-shadow:0 12px 35px rgba(3,105,161,.075);
}

/* Explore V5: stronger hierarchy and a more editorial hero/search tray. */
.vl-page-explore .vl-explore-hero {
  min-height:680px;
  box-shadow:0 24px 70px rgba(31,61,43,.18);
}
.vl-page-explore .vl-explore-hero > div {
  position:relative;
}
.vl-page-explore .vl-explore-hero .rounded-xl.shadow-xl {
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 22px 55px rgba(31,61,43,.24)!important;
}
.vl-page-explore .vl-explore-hero h1 {
  text-shadow:0 5px 28px rgba(0,0,0,.24);
}
.vl-page-explore .vl-explore-hero + section,
.vl-page-explore .vl-explore-hero ~ section {
  scroll-margin-top:100px;
}

/* Make the long Explore page feel intentionally layered. */
.vl-page-explore main section:not(.vl-explore-hero) {
  border-top:1px solid rgba(3,105,161,.07);
}

@media (max-width: 1279px) {
  header nav a::before, header nav a::after { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  header nav a::after { animation:none!important; }
}


/* V6 — richer chromatic paper + Explore motion correction */
:root {
  --vl-navy: #1F3D2B;
  --vl-blue: #1F3D2B;
  --vl-blue-glow: #2E5A40;
  --vl-rose: #c98791;
  --vl-coral: #d98262;
  --vl-saffron: #38BDF8;
  --vl-paper-warm: #F4EDE0;
}

/* Replace flat light fields with restrained geometric color compositions.
   Inspired by tactile editorial paper blocks, but kept within the Visit Locals palette. */
main > div > section.vl-soft-surface-a,
main > div > section.vl-soft-surface-b {
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#F4EDE0!important;
}
main > div > section.vl-soft-surface-a::before,
main > div > section.vl-soft-surface-b::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(148deg, rgba(56,189,248,.24) 0 23%, transparent 23% 100%),
    linear-gradient(32deg, transparent 0 63%, rgba(201,135,145,.18) 63% 82%, transparent 82%),
    linear-gradient(118deg, transparent 0 72%, rgba(31,61,43,.10) 72% 100%),
    radial-gradient(circle at 8% 88%, rgba(217,130,98,.12), transparent 25%),
    linear-gradient(135deg,#F4EDE0 0%,#EAE0CC 100%);
  transform:scale(1.03);
}
main > div > section.vl-soft-surface-b::before {
  background:
    linear-gradient(28deg, rgba(31,61,43,.12) 0 19%, transparent 19% 100%),
    linear-gradient(156deg, transparent 0 57%, rgba(56,189,248,.22) 57% 78%, transparent 78%),
    linear-gradient(92deg, transparent 0 73%, rgba(201,135,145,.16) 73% 100%),
    radial-gradient(circle at 88% 12%, rgba(217,130,98,.13), transparent 24%),
    linear-gradient(135deg,#EAE0CC 0%,#F4EDE0 100%);
}
main > div > section.vl-soft-surface-a::after,
main > div > section.vl-soft-surface-b::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.30),transparent 58%);
}

/* Subtle paper grain without an external image. */
main > div > section.vl-soft-surface-a,
main > div > section.vl-soft-surface-b {
  background-image:
    radial-gradient(rgba(31,61,43,.035) .7px, transparent .7px),
    linear-gradient(135deg,#F4EDE0,#EAE0CC);
  background-size:9px 9px,100% 100%;
}

/* Explore: use the sharper local 16:9 image layer and visibly animate it. */
.vl-page-explore .vl-explore-hero::before { background-image:none!important; }
.vl-page-explore .vl-explore-hero .vl-explore-bg {
  z-index:1!important;
  opacity:1!important;
  background-size:cover!important;
  background-position:center!important;
  transform:translate3d(var(--vl-explore-x,0px),var(--vl-explore-y,0px),0) scale(1.09)!important;
  filter:saturate(1.08) contrast(1.05);
  animation:vl-explore-drift 15s ease-in-out infinite alternate;
  transition:transform 1s var(--vl-ease),filter .7s ease;
  will-change:transform;
}
.vl-page-explore .vl-explore-hero .vl-explore-bg::after { content:""; position:absolute; inset:0; }
@keyframes vl-explore-drift {
  0% { background-position:47% 50%; }
  100% { background-position:53% 48%; }
}
.vl-page-explore .vl-explore-hero:hover .vl-explore-bg { filter:saturate(1.12) contrast(1.07); }

/* V6 header light sweep — deep navy instead of gold. */
header nav a::before {
  background:linear-gradient(90deg,transparent,#1F3D2B 20%,#2E5A40 50%,#1F3D2B 80%,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.62),0 0 15px rgba(31,61,43,.24)!important;
}
header nav a::after {
  background:linear-gradient(90deg,transparent,#1F3D2B,#9FB8A8,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.45)!important;
}
header nav a:hover,
header nav a:focus-visible { color:#1F3D2B!important; text-shadow:0 0 12px rgba(31,61,43,.20)!important; }

@media (prefers-reduced-motion:reduce) {
  .vl-page-explore .vl-explore-hero .vl-explore-bg { animation:none!important; transform:scale(1.05)!important; }
}

/* V7 — Warm Sage / Lightweight Editorial Backgrounds
   Replace the V6 geometric paper compositions with solid, warm surfaces.
   Keep cinematic photography only where it adds real visual value (hero/image sections). */
:root {
  --vl-sage: #EAE0CC;
  --vl-sage-2: #F4EDE0;
  --vl-ivory: #F4EDE0;
  --vl-warm: #EAE0CC;
  --vl-navy: #1F3D2B;
  --vl-deep-blue: #1F3D2B;
  --vl-sage-border: rgba(3,105,161,.14);
}

html { background:var(--vl-ivory)!important; }
body {
  background:var(--vl-sage)!important;
  color:#25251f;
}

/* Solid light sections — no layered gradients or geometric pseudo artwork. */
main > div > section.vl-soft-surface-a,
main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-a,
main section.vl-soft-surface-b {
  background:var(--vl-sage)!important;
  background-image:none!important;
  border-top:1px solid var(--vl-sage-border);
}

main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-b {
  background:var(--vl-ivory)!important;
}

/* Remove the decorative image/shape layers that made V6 heavier. */
main > div > section.vl-soft-surface-a::before,
main > div > section.vl-soft-surface-a::after,
main > div > section.vl-soft-surface-b::before,
main > div > section.vl-soft-surface-b::after {
  display:none!important;
}

/* Atmospheric imagery is disabled on ordinary content sections. */
.vl-atmospheric:not(.vl-cinematic)::before,
.vl-atmospheric:not(.vl-cinematic)::after {
  display:none!important;
}
.vl-atmospheric:not(.vl-cinematic) {
  background:var(--vl-sage)!important;
}

/* Cards stay light but gain a little definition against the sage canvas. */
.vl-page-explore .bg-surface,
.vl-page-experience .bg-surface,
.vl-page-insight .bg-surface,
.vl-page-partner .bg-surface,
.vl-page-business .bg-surface {
  background:#F4EDE0!important;
  border:1px solid rgba(3,105,161,.10);
  box-shadow:0 10px 30px rgba(3,105,161,.055)!important;
}

/* Warm orange is reserved as a restrained accent rather than a full background. */
.vl-page-explore .vl-explore-hero + section,
.vl-page-experience .vl-explore-hero + section {
  border-top-color:rgba(56,189,248,.18);
}

/* Keep the dark-blue navigation light sweep from V6. */
header nav a::before {
  background:linear-gradient(90deg,transparent,#1F3D2B 20%,#2E5A40 50%,#1F3D2B 80%,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.48),0 0 13px rgba(31,61,43,.18)!important;
}
header nav a::after {
  background:linear-gradient(90deg,transparent,#1F3D2B,#9FB8A8,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.35)!important;
}
header nav a:hover,
header nav a:focus-visible {
  color:#1F3D2B!important;
  text-shadow:0 0 10px rgba(31,61,43,.14)!important;
}

/* Use a calmer scrollbar that belongs to the new palette. */
html { scrollbar-color:#708061 #EAE0CC!important; }
::-webkit-scrollbar-track { background:#EAE0CC!important; }
::-webkit-scrollbar-thumb { background:#708061!important; border-color:#EAE0CC!important; }
::-webkit-scrollbar-thumb:hover { background:#536544!important; }

/* Reduce non-essential visual work on light sections. */
.vl-page-explore .vl-explore-hero .vl-explore-bg {
  animation-duration:20s!important;
}

@media (prefers-reduced-motion:reduce) {
  .vl-atmospheric:not(.vl-cinematic)::before,
  .vl-atmospheric:not(.vl-cinematic)::after { display:none!important; }
}

/* V9 — Mobile reliability + carousel control correction */
@media (max-width: 768px) {
  /* Never let the cinematic entrance animation leave mobile looking blank if
     JavaScript is delayed by the browser/network. */
  body main,
  body:not(.vl-ready) main {
    opacity: 1 !important;
    transition: none !important;
  }

  /* Mobile should reveal cards immediately; IntersectionObserver is a nice
     enhancement on desktop, not a prerequisite for seeing the content. */
  main .vl-reveal,
  main .vl-reveal.vl-delay-1,
  main .vl-reveal.vl-delay-2,
  main .vl-reveal.vl-delay-3 {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  /* Keep the Home hero controls entirely inside the viewport. */
  .vl-hero-carousel .vl-carousel-controls {
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
    width: auto !important;
    transform: none !important;
    justify-content: flex-end !important;
    gap: 8px !important;
  }

  .vl-hero-carousel .vl-carousel-progress {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 120px !important;
  }

  .vl-hero-carousel .vl-carousel-btn {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
  }

  /* Cards must be visibly and directly tappable. */
  .experience-card {
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  .experience-card .group-hover\\:scale-105,
  .experience-card img {
    transform: none !important;
  }

  /* Give mobile cards a comfortable tap target without relying on hover. */
  .experience-card button {
    min-height: 44px;
  }
}

/* V8 — Warm Comfort Blue + mobile experience-card interaction */
:root{
  --vl-blue-paper:#EAE0CC;
  --vl-blue-ivory:#F4EDE0;
  --vl-blue-warm:#F4EDE0;
  --vl-blue-border:rgba(31,61,43,.14);
  --vl-blue-accent:#2E5A40;
  --vl-blue-deep:#1F3D2B;
}

html{background:var(--vl-blue-ivory)!important;}
body{background:var(--vl-blue-paper)!important;color:#1F3D2B;}

main > div > section.vl-soft-surface-a,
main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-a,
main section.vl-soft-surface-b{
  background:var(--vl-blue-paper)!important;
  background-image:none!important;
  border-top:1px solid var(--vl-blue-border);
}
main > div > section.vl-soft-surface-b,
main section.vl-soft-surface-b{background:var(--vl-blue-ivory)!important;}

main > div > section.vl-soft-surface-a::before,
main > div > section.vl-soft-surface-a::after,
main > div > section.vl-soft-surface-b::before,
main > div > section.vl-soft-surface-b::after{display:none!important;}

.vl-atmospheric:not(.vl-cinematic)::before,
.vl-atmospheric:not(.vl-cinematic)::after{display:none!important;}
.vl-atmospheric:not(.vl-cinematic){background:var(--vl-blue-paper)!important;}

.vl-page-explore .bg-surface,
.vl-page-experience .bg-surface,
.vl-page-insight .bg-surface,
.vl-page-partner .bg-surface,
.vl-page-business .bg-surface{
  background:#FBF8F2!important;
  border-color:var(--vl-blue-border)!important;
  box-shadow:0 10px 30px rgba(31,61,43,.055)!important;
}

/* Warm/deep blue header sweep */
header nav a::before{
  background:linear-gradient(90deg,transparent,#1F3D2B 20%,#2E5A40 50%,#1F3D2B 80%,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.46),0 0 13px rgba(31,61,43,.16)!important;
}
header nav a::after{
  background:linear-gradient(90deg,transparent,#1F3D2B,#9FB8A8,transparent)!important;
  box-shadow:0 0 7px rgba(31,61,43,.32)!important;
}
header nav a:hover,
header nav a:focus-visible{color:#1F3D2B!important;text-shadow:0 0 10px rgba(31,61,43,.13)!important;}

html{scrollbar-color:#9FB8A8 #EAE0CC!important;}
::-webkit-scrollbar-track{background:#EAE0CC!important;}
::-webkit-scrollbar-thumb{background:#9FB8A8!important;border-color:#EAE0CC!important;}
::-webkit-scrollbar-thumb:hover{background:#2E5A40!important;}

/* Make experience cards reliably tappable on touch devices. */
.experience-card{
  position:relative;
  z-index:1;
  pointer-events:auto!important;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.experience-card img,
.experience-card .absolute,
.experience-card h3,
.experience-card p{pointer-events:none;}
.experience-card button{pointer-events:auto;position:relative;z-index:4;}

@media (max-width:767px){
  .experience-card{cursor:pointer;transform:none!important;}
  .experience-card:active{transform:scale(.992)!important;}
  #quote-modal{align-items:flex-start!important;padding:12px!important;padding-top:max(12px,env(safe-area-inset-top))!important;}
  #quote-modal > div{width:100%!important;max-width:none!important;margin:12px 0!important;max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;}
  #quote-modal > div > button{position:sticky!important;top:0;float:right;z-index:30;background:rgba(255,255,255,.96);}
}

@media (prefers-reduced-motion:reduce){
  .experience-card:active{transform:none!important;}
}

/* CMS Insight author metadata: reading time left, CMS author right. */
.vl-cms-author-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;}

/* V10 — Remove filled active navigation block; keep the active page clean. */
header nav a.active,
header nav a[aria-current="page"] {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
}

/* Keep the existing thin blue active indicator from vl-cinematic.css. */
header nav a.active::before,
header nav a[aria-current="page"]::before {
  background: linear-gradient(90deg, transparent, #1F3D2B 20%, #2E5A40 50%, #1F3D2B 80%, transparent) !important;
}

/* Visit Locals — Home v15 visual layer
   Loaded last on the home page only. Pure CSS: nothing here blocks content from showing. */
:root{
  --vl-ink:#1F3D2B; --vl-ink-2:#1F3D2B; --vl-gold:#38BDF8; --vl-gold-2:#38BDF8; --vl-gold-3:#38BDF8;
  --vl-green:#0369A1; --vl-mint:#7DD3FC; --vl-ease:cubic-bezier(.22,1,.36,1);
  --vl-card-shadow:0 1px 2px rgba(31,61,43,.06),0 12px 32px -12px rgba(31,61,43,.18);
  --vl-card-shadow-hover:0 2px 6px rgba(31,61,43,.08),0 28px 60px -18px rgba(31,61,43,.32);
}

/* ---------- Speed: never hide the page while scripts load ---------- */
body:not(.vl-ready) main, body.vl-ready main{opacity:1!important;transition:none!important}

/* ---------- Header ---------- */
header.fixed{background:rgba(244,237,224,.86)!important;border-bottom:1px solid rgba(31,61,43,.06)}
@media (min-width:640px){header .font-display-lg{letter-spacing:.06em}}

/* ---------- Hero ---------- */
.vl-hero{isolation:isolate;background:var(--vl-ink)}
.vl-hero-inner{min-height:min(860px,calc(100svh - 80px));min-height:max(640px,min(860px,calc(100svh - 80px)))}
.vl-hero .vl-hero-carousel{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--vl-ink)}
.vl-hero .vl-hero-slide{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.08);transition:opacity 1.4s ease,transform 8s var(--vl-ease)}
.vl-hero .vl-hero-slide.is-active{opacity:1;transform:scale(1)}
.vl-hero .vl-hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
.vl-hero .vl-hero-carousel::after{content:"";position:absolute;inset:0;z-index:2;
  background:
    radial-gradient(120% 90% at 0% 100%,rgba(31,61,43,.92) 0%,rgba(31,61,43,.55) 45%,rgba(31,61,43,0) 75%),
    linear-gradient(90deg,rgba(31,61,43,.78) 0%,rgba(31,61,43,.38) 48%,rgba(31,61,43,.08) 100%),
    linear-gradient(0deg,rgba(31,61,43,.85) 0%,rgba(31,61,43,0) 40%),
    linear-gradient(180deg,rgba(31,61,43,.45) 0%,rgba(31,61,43,0) 22%)}
.vl-hero-grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.14;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.vl-hero h1{font-size:clamp(44px,7.2vw,96px)!important;line-height:.98!important;letter-spacing:-.025em!important;text-shadow:0 8px 40px rgba(31,61,43,.35)}
.vl-hero h1 .italic{display:inline-block;padding-right:.08em;
  background:linear-gradient(100deg,#7DD3FC 0%,#38BDF8 35%,#E0F2FE 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.vl-hero .vl-hero-copy p{font-size:clamp(17px,1.5vw,21px)!important;line-height:1.6!important;color:rgba(244,237,224,.86)!important;max-width:38rem}
.vl-hero .vl-hero-copy a{border-radius:999px!important;padding:1rem 1.6rem!important}
.vl-hero .vl-hero-copy a:first-child{background:linear-gradient(135deg,#0369A1,#0369A1)!important;box-shadow:0 12px 30px -10px rgba(3,105,161,.75),inset 0 1px 0 rgba(255,255,255,.18)!important}
.vl-hero .vl-hero-copy a:first-child:hover{box-shadow:0 18px 40px -12px rgba(3,105,161,.9),inset 0 1px 0 rgba(255,255,255,.2)!important}
.vl-hero .vl-hero-copy a:last-child{border:1px solid rgba(244,237,224,.38)}
.vl-hero .vl-hero-copy a:last-child:hover{border-color:rgba(244,237,224,.7)}

/* Entrance — CSS only, plays once, starts with first paint */
@keyframes vl-rise{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .vl-hero .vl-hero-copy>*{animation:vl-rise .9s var(--vl-ease) both}
  .vl-hero .vl-hero-copy>*:nth-child(2){animation-delay:.12s}
  .vl-hero .vl-hero-copy>*:nth-child(3){animation-delay:.22s}
  .vl-hero .vl-hero-stats{animation:vl-rise 1s var(--vl-ease) .34s both}
}

/* Trust bar: glass panel with hairline dividers */
.vl-hero .vl-hero-stats{background:linear-gradient(135deg,rgba(244,237,224,.12),rgba(244,237,224,.05))!important;border:1px solid rgba(244,237,224,.16);
  border-radius:20px!important;padding:1.1rem 1.25rem!important;box-shadow:0 20px 50px -20px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);margin-bottom:3.25rem}
.vl-hero .vl-hero-stats>div{padding:.25rem .5rem}
@media (min-width:640px){.vl-hero .vl-hero-stats>div+div{border-left:1px solid rgba(244,237,224,.14);padding-left:1.25rem}}
.vl-hero .vl-hero-stats .material-symbols-outlined{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:22px!important;
  background:rgba(125,211,252,.12);border:1px solid rgba(125,211,252,.22);color:#E0F2FE!important}
.vl-hero .vl-hero-stats .font-headline-sm{font-family:Newsreader,Georgia,serif;font-size:26px!important;line-height:1.1!important;font-weight:500!important}
.vl-hero .vl-hero-stats .text-surface-variant{color:rgba(244,237,224,.66)!important;letter-spacing:.1em!important}

@media (max-width:639px){
  .vl-hero .vl-hero-stats{gap:.9rem 1rem!important;padding:1rem!important}
  .vl-hero .vl-hero-stats>div{padding:0;gap:.6rem!important}
  .vl-hero .vl-hero-stats .material-symbols-outlined{width:34px;height:34px;border-radius:10px;font-size:18px!important;flex:0 0 34px}
  .vl-hero .vl-hero-stats .font-headline-sm{font-size:19px!important}
  .vl-hero .vl-hero-stats .text-surface-variant{font-size:9px!important;letter-spacing:.08em!important}
  .vl-hero .vl-hero-copy a{padding:.85rem 1.3rem!important}
}
/* Carousel controls — above the copy layer so they are actually clickable */
.vl-hero-controls{position:absolute;z-index:20;--vl-pad:1.5rem;left:calc(max(0px,(100% - 80rem)/2) + var(--vl-pad));bottom:52px;display:flex;align-items:center;gap:10px}
.vl-hero-caption{order:5;display:inline-flex;align-items:center;gap:8px;margin-left:8px;color:rgba(244,237,224,.9);font:500 12px/1 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.06em}
.vl-hero-caption [data-vl-caption]{display:inline-block}
.vl-hero-caption [data-vl-caption].is-in{animation:vl-rise .6s var(--vl-ease) both}
.vl-hero-caption-dot{width:7px;height:7px;border-radius:50%;background:var(--vl-gold-3);box-shadow:0 0 0 4px rgba(56,189,248,.18)}
.vl-hero-controls .vl-carousel-label{order:-2;color:rgba(255,255,255,.7);font:600 10px/1.2 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em}
.vl-hero-controls .vl-carousel-progress{order:-1;width:96px;height:2px;background:rgba(255,255,255,.22);overflow:hidden;border-radius:99px}
.vl-hero-controls .vl-carousel-progress span{display:block;height:100%;width:0;background:var(--vl-gold-3);animation:vl-progress 6.5s linear infinite}
.vl-hero-controls .vl-carousel-btn{width:40px;height:40px}
.vl-hero-controls .vl-carousel-btn .material-symbols-outlined{font-size:20px}
@media (max-width:640px){
  .vl-hero-controls{bottom:46px}
  .vl-hero-controls .vl-carousel-label{display:none}
  .vl-hero-controls .vl-carousel-progress{width:56px}
  .vl-hero .vl-hero-stats{margin-bottom:3.5rem}
}
@media (min-width:768px){.vl-hero-controls{--vl-pad:3rem}}
@media (min-width:1024px){.vl-hero-controls{--vl-pad:6rem}}
@media (prefers-reduced-motion:reduce){.vl-hero .vl-hero-slide{transition:opacity .4s ease;transform:none!important}.vl-hero-controls .vl-carousel-progress span{animation:none;width:100%}}

/* ---------- Section rhythm ---------- */
.vl-eyebrow{display:inline-flex!important;align-items:center;gap:.75rem;color:#0369A1!important;letter-spacing:.2em!important}
.vl-eyebrow::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--vl-gold),rgba(56,189,248,.2))}
main h2.font-display-md{font-size:clamp(32px,4.2vw,52px)!important;line-height:1.06!important;letter-spacing:-.02em!important}
section#sovereign-business .vl-eyebrow, .bg-primary .vl-eyebrow{color:var(--vl-gold-3)!important}

/* ---------- Gateway cards (travel / business) ---------- */
.vl-gate{border:1px solid rgba(31,61,43,.07);box-shadow:var(--vl-card-shadow)!important;transition:transform .5s var(--vl-ease),box-shadow .5s ease!important;border-radius:24px!important}
.vl-gate:hover{transform:translateY(-6px);box-shadow:var(--vl-card-shadow-hover)!important}
.vl-gate-media{position:relative;height:210px;margin:-2rem -2rem 1.75rem;overflow:hidden}
@media (min-width:768px){.vl-gate-media{margin:-2.5rem -2.5rem 2rem;height:240px}}
.vl-gate-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--vl-ease)}
.vl-gate:hover .vl-gate-media img{transform:scale(1.06)}
.vl-gate-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,61,43,0) 45%,rgba(244,237,224,.95) 100%)}
.vl-gate-dark .vl-gate-media::after{background:linear-gradient(180deg,rgba(31,61,43,.05) 35%,var(--vl-ink) 100%)}
.vl-gate h2{font-size:clamp(30px,3vw,40px)!important;line-height:1.1!important}
.vl-gate-dark{background:radial-gradient(120% 80% at 100% 100%,rgba(3,105,161,.28),transparent 55%),var(--vl-ink)!important}

/* ---------- Search tray ---------- */
#guide-search-input{border:1px solid rgba(31,61,43,.1);border-radius:999px!important;padding-top:.95rem!important;padding-bottom:.95rem!important;box-shadow:inset 0 1px 2px rgba(31,61,43,.05)!important;transition:box-shadow .3s ease,border-color .3s ease}
#guide-search-input:focus{border-color:rgba(3,105,161,.5);box-shadow:0 0 0 4px rgba(125,211,252,.25)!important}
#home-archive-search{border-radius:999px!important;padding-left:1.75rem!important;padding-right:1.75rem!important}
#home-archive-search + * , #guide-search-input{font-size:15px}
section button[onclick^="filterByTag"]{border:1px solid rgba(31,61,43,.08);background:rgba(255,255,255,.65)!important;transition:all .25s ease}
section button[onclick^="filterByTag"]:hover{background:var(--vl-ink)!important;color:#fff!important;transform:translateY(-1px)}

/* ---------- Experience cards ---------- */
#experiences .category-btn{border-radius:999px!important}
#experiences .category-btn.bg-primary{box-shadow:0 6px 16px -6px rgba(31,61,43,.6)}
#experiences .flex.flex-wrap.items-center.gap-2.p-1\.5{border-radius:999px!important;background:rgba(255,255,255,.6)!important;border:1px solid rgba(31,61,43,.07)}
.experience-card{border-radius:22px!important;border-color:rgba(31,61,43,.07)!important;box-shadow:var(--vl-card-shadow)!important;transition:transform .5s var(--vl-ease),box-shadow .5s ease!important}
@media (hover:hover){.experience-card:hover{transform:translateY(-6px)!important;box-shadow:var(--vl-card-shadow-hover)!important}}
.experience-card>div:first-child{position:relative;border-radius:22px 22px 0 0!important}
.experience-card>div:first-child::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(31,61,43,.18) 0%,rgba(31,61,43,0) 30%,rgba(31,61,43,0) 62%,rgba(31,61,43,.42) 100%)}
.experience-card>div:first-child>.absolute{z-index:2}
.experience-card img{transition:transform 1.1s var(--vl-ease)!important}
@media (hover:hover){.experience-card:hover img{transform:scale(1.07)!important}}
.experience-card h3{font-size:23px!important;line-height:1.2!important;letter-spacing:-.01em}
.experience-card button{border-radius:999px!important;padding-left:1.1rem!important;padding-right:1.1rem!important}
.experience-card .pt-4{border-top:1px dashed rgba(31,61,43,.12);margin-top:.5rem}
@media (max-width:767px){
  #experiences .flex.flex-wrap.items-center.gap-2.p-1\.5{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-right:-1.5rem;border-radius:999px 0 0 999px!important}
  #experiences .flex.flex-wrap.items-center.gap-2.p-1\.5::-webkit-scrollbar{display:none!important}
  #experiences .category-btn{white-space:nowrap;flex:0 0 auto}
}
#experience-show-more{border-radius:999px!important;border:1px solid rgba(31,61,43,.12)}

/* ---------- Destinations bento ---------- */
.vl-dest{border-radius:24px!important;border:0!important;box-shadow:var(--vl-card-shadow)!important;transition:transform .55s var(--vl-ease),box-shadow .55s ease!important}
.vl-dest:hover{box-shadow:var(--vl-card-shadow-hover)!important}
.vl-dest>img{position:absolute;inset:0;transition:transform 1.4s var(--vl-ease)!important}
.vl-dest:hover>img{transform:scale(1.07)!important}
.vl-dest>.bg-gradient-to-t{background:linear-gradient(0deg,rgba(31,61,43,.92) 0%,rgba(31,61,43,.45) 42%,rgba(31,61,43,0) 72%)!important}
.vl-dest h3{font-size:30px!important;line-height:1.1!important}
.vl-dest-feature h3{font-size:clamp(36px,4vw,56px)!important}
.vl-dest-feature p{-webkit-line-clamp:3!important;max-width:30rem;font-size:15px!important;line-height:1.6!important}
.vl-dest-wide h3{font-size:clamp(34px,3.6vw,48px)!important}
.vl-dest-wide p{max-width:36rem}
.vl-dest .text-secondary-fixed .material-symbols-outlined{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(244,237,224,.14);border:1px solid rgba(244,237,224,.25)}
.vl-dest:hover .text-secondary-fixed .material-symbols-outlined{background:var(--vl-gold-3);color:var(--vl-ink)}
@media (min-width:1024px){.vl-dest-feature{min-height:calc(48rem + 1.5rem)}}

/* ---------- Pillars / how it works ---------- */
.vl-hover-card.bg-surface-container{background:rgba(255,255,255,.72)!important;border:1px solid rgba(31,61,43,.06);border-radius:22px!important;box-shadow:var(--vl-card-shadow)!important}
.vl-hover-card .w-12.h-12{border-radius:14px!important;background:linear-gradient(135deg,#E0F2FE,#E0F2FE)!important;box-shadow:inset 0 0 0 1px rgba(3,105,161,.12)}
.vl-hover-panel.bg-surface-container-low{background:rgba(255,255,255,.66)!important;border:1px solid rgba(31,61,43,.06);border-radius:24px!important}
.vl-hover-mini .w-9.h-9{background:linear-gradient(135deg,#1F3D2B,#1F3D2B)!important;box-shadow:0 0 0 4px rgba(56,189,248,.18)}

/* ---------- Business section: depth on navy ---------- */
#sovereign-business{position:relative;isolation:isolate;overflow:hidden;
  background:radial-gradient(60% 50% at 0% 0%,rgba(56,189,248,.16),transparent 60%),radial-gradient(50% 50% at 100% 100%,rgba(3,105,161,.22),transparent 60%),var(--vl-ink)!important}
#sovereign-business::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.07;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%2338BDF8' stroke-width='1'%3E%3Cpath d='M32 4l28 28-28 28L4 32z'/%3E%3Ccircle cx='32' cy='32' r='9'/%3E%3Cpath d='M32 0v8M32 56v8M0 32h8M56 32h8'/%3E%3C/g%3E%3C/svg%3E");background-size:64px 64px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%)}
#sovereign-business .business-service-card{border-radius:22px!important;background:linear-gradient(180deg,#F4EDE0,#EAE0CC)!important;border:1px solid rgba(244,237,224,.6)}
#sovereign-business .lg\:col-span-5.bg-primary-container{border:1px solid rgba(244,237,224,.1);border-radius:24px!important;background:linear-gradient(160deg,#1F3D2B,#1F3D2B)!important}

/* ---------- Inquiry ---------- */
#inquiry form, #inquiry .rounded-xl.shadow-xl, #inquiry .bg-surface-container-lowest{border-radius:24px!important}
#inquiry input, #inquiry select, #inquiry textarea{border-radius:12px!important}

/* ---------- Visual journal ---------- */
.vl-journal-card{border-radius:24px}

/* ---------- Focus visibility ---------- */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible{outline:2px solid var(--vl-gold);outline-offset:3px;border-radius:8px}

/* ---------- Mobile corrections ---------- */
@media (max-width:639px){
  header .font-display-lg{font-size:18px!important;white-space:nowrap}
  header .font-label-md.text-\[10px\]{font-size:9px!important}
}
/* The older V9 mobile rule forced every experience card visible, which broke the
   "show 10 + Show more" logic and the category filters on phones. Respect the JS state again. */
@media (max-width:768px){
  .experience-card[style*="display: none"]{display:none!important}
}

/* Smoother page-to-page navigation (Chrome/Edge/Safari 18+) */
html{scroll-padding-top:96px}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
.experience-card[data-vl-new] .text-secondary.font-semibold{color:#0369A1!important}
/* Filter tabs sit under the section heading on one line (6 tabs now) */
@media (min-width:768px){
  #experiences > div > .flex.flex-col.md\:flex-row{flex-direction:column!important;align-items:flex-start!important}
  #experiences .flex.flex-wrap.items-center.gap-2.p-1\.5{flex-wrap:wrap;border-radius:22px!important}
  #experiences .category-btn{white-space:nowrap}
}
@media (min-width:768px){#experiences .category-btn{padding-left:.8rem!important;padding-right:.8rem!important}#experiences .flex.flex-wrap.items-center.gap-2.p-1\.5{max-width:none!important;width:auto!important;flex:0 0 auto}}
/* Visit Locals palette v18 — forest green (main) · cream (second) · sky blue (accent).
   Appended after the colour-remapped layers; values here are final and are not remapped. */
:root{--vl-green:#1F3D2B;--vl-green-deep:#16301F;--vl-cream:#F4EDE0;--vl-sky:#38BDF8;--vl-sky-deep:#0284C7}
html{background:var(--vl-cream)!important}
body{background:var(--vl-cream)!important;color:#1d2a22}

/* Header: forest green bar, cream type, sky accents */
header.fixed, header.fixed.vl-scrolled{background:rgba(31,61,43,.97)!important;border-bottom:1px solid rgba(244,237,224,.08)!important;box-shadow:0 8px 28px rgba(22,48,31,.18)!important}
header.fixed .text-primary, header.fixed .text-on-surface, header.fixed .text-on-surface-variant,
header.fixed nav a, header.fixed button:not(.vl-language-option), header.fixed .vl-current-language,
header.fixed .vl-desktop-nav-link{color:var(--vl-cream)!important}
header.fixed .text-tertiary{color:var(--vl-sky)!important}
header.fixed nav a:hover, header.fixed nav a:focus-visible, header.fixed nav a[aria-current="page"]{color:#fff!important;text-shadow:none!important}
header.fixed nav a::before{background:linear-gradient(90deg,transparent,var(--vl-sky) 20%,#bae6fd 50%,var(--vl-sky) 80%,transparent)!important;box-shadow:0 0 8px rgba(56,189,248,.55)!important}
header.fixed .vl-mobile-menu-button:hover{background:rgba(244,237,224,.1)}
header.fixed a[href="/"] img{background:#fff;border-radius:50%}
.vl-language-menu .vl-language-option{color:#1d2a22!important}

/* Footer: forest green */
footer{background:var(--vl-green)!important;color:rgba(244,237,224,.85)!important;border-top:0!important}
footer h1,footer h2,footer h3,footer h4,footer h5,footer p,footer span,footer li,footer small,footer div,footer a{color:rgba(244,237,224,.82)!important;border-color:rgba(244,237,224,.14)!important}
footer .text-primary, footer h3, footer h4, footer strong{color:var(--vl-cream)!important}
footer a:hover{color:var(--vl-sky)!important}
footer img{background:#fff;border-radius:50%}

/* Accent buttons: sky with deep-green type (readable) */
.bg-secondary, a.bg-secondary, button.bg-secondary{color:#fff}
.vl-wa-trigger{background:var(--vl-sky-deep)!important}
.vl-wa-trigger:hover{background:#0369A1!important}
.vl-music-button{background:var(--vl-cream)!important;color:var(--vl-green)!important}
::selection{background:#bae6fd;color:#16301F}

/* Readability: accent text on cream uses the deeper sky; on green it uses the bright/light sky */
.text-secondary{color:#0369A1!important}
:is(.bg-primary,.bg-primary-container,.vl-cinematic,.vl-hero,footer,header,.vl-visual-journal,#sovereign-business,.vl-gate-dark) .text-secondary{color:#7DD3FC!important}
.bg-secondary, a.bg-secondary, button.bg-secondary{background-color:#38BDF8!important;color:#16301F!important}
.bg-secondary *, .bg-secondary .text-on-secondary, .text-on-secondary.bg-secondary{color:#16301F!important}
.bg-secondary:hover{background-color:#7DD3FC!important}
.text-on-tertiary-container{color:#16301F!important}
.text-outline{color:#5c5b66!important}
.vl-wa-trigger{background:#0369A1!important}
.vl-wa-trigger:hover{background:#075985!important}
/* Home hero primary button: bright sky, deep green label */
.vl-hero .vl-hero-copy a:first-child{background:linear-gradient(135deg,#7DD3FC,#38BDF8)!important;color:#16301F!important;box-shadow:0 12px 30px -10px rgba(56,189,248,.65)!important}
.vl-hero .vl-hero-copy a:first-child *{color:#16301F!important}
.text-on-tertiary-fixed{color:#16301F!important}