/* ═══════════════════════════════════════════════════════════════
   salernotourguide.com — design system v4 (.st scope)
   Concept: "The Harbor Ledger" — the honest logbook of Salerno port.
   Editorial serif with italic accents · numbered chapters · stat chips ·
   a live "where the boats go" switcher · sailing-times route line.
   Fonts: Fraunces (display, italics carry the voice) · Figtree (UI/text)
   ═══════════════════════════════════════════════════════════════ */

@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/figtree-latin.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/fraunces-latin.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400 700;font-display:swap;src:url(/assets/fonts/fraunces-italic-latin.woff2) format('woff2')}

.st{
  --ink:#0f2733;             /* deep tyrrhenian ink */
  --ink-2:#16394a;
  --ink-soft:#4c6472;
  --ink-faint:#8fa5af;
  --sea:#0c7489;             /* harbor teal */
  --sea-deep:#075e6f;
  --sea-tint:#e8f4f5;
  --lemon:#f4b942;           /* amalfi lemon */
  --lemon-deep:#c78f1b;
  --lemon-tint:#fdf4dd;
  --terra:#e2603c;           /* vietri terracotta — booking contrast */
  --terra-deep:#c74e2d;
  --terra-tint:#fdefe9;
  --paper:#fbfaf7;           /* warm paper base */
  --sand:#f3efe5;            /* sand surface */
  --line:#e6e2d6;
  --line-cool:#d9e5e6;
  --white:#ffffff;
  --r-xl:24px; --r-lg:16px; --r-md:12px;
  --sh-1:0 1px 2px rgba(15,39,51,.05),0 5px 16px rgba(15,39,51,.07);
  --sh-2:0 2px 5px rgba(15,39,51,.07),0 20px 48px rgba(15,39,51,.14);
  --sh-cta:0 10px 26px rgba(12,116,137,.34);
  --ease:cubic-bezier(.16,1,.3,1);
  --serif:'Fraunces',Georgia,serif;
  --sans:'Figtree','Helvetica Neue',sans-serif;
  --wrap:1240px;
  font-family:var(--sans);
  color:var(--ink);
  font-size:16.5px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.st *,.st *::before,.st *::after{box-sizing:border-box;margin:0;padding:0}
.st img{display:block;max-width:100%}
.st a{color:inherit;text-decoration:none}
.st button{font-family:inherit;cursor:pointer}
.st ::selection{background:var(--lemon);color:var(--ink)}
.st :focus-visible{outline:2.5px solid var(--sea);outline-offset:3px;border-radius:6px}
@media(prefers-reduced-motion:reduce){.st *,.st *::before,.st *::after{animation:none!important;transition:none!important}}

/* ---------- layout — sections carry quiet color fields ---------- */
.st .st-wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;position:relative;z-index:1}
.st .st-sec{padding:96px 0;position:relative;overflow:hidden;background:
  radial-gradient(680px 420px at -6% 2%,rgba(226,96,60,.05),transparent 60%),
  radial-gradient(760px 460px at 107% 98%,rgba(12,116,137,.07),transparent 62%),
  var(--paper)}
.st .st-sec--sand{background:
  radial-gradient(720px 440px at 106% -8%,rgba(12,116,137,.08),transparent 60%),
  radial-gradient(640px 400px at -8% 106%,rgba(244,185,66,.14),transparent 60%),
  var(--sand)}
.st .st-sec--white{background:
  radial-gradient(640px 380px at 104% 0%,rgba(244,185,66,.09),transparent 58%),
  var(--white)}
.st .st-sec--ink{background:
  radial-gradient(700px 420px at 108% -10%,rgba(244,185,66,.12),transparent 60%),
  radial-gradient(640px 420px at -8% 110%,rgba(12,116,137,.3),transparent 62%),
  linear-gradient(168deg,var(--ink) 0%,var(--ink-2) 100%);color:#dcebee}
/* oversized outlined watermark words */
.st .st-wm{position:absolute;top:18px;right:-8px;z-index:0;font-family:var(--serif);font-style:italic;font-weight:700;font-size:clamp(64px,9.5vw,148px);line-height:1;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px rgba(12,116,137,.13);pointer-events:none;user-select:none}
.st .st-sec--sand .st-wm{-webkit-text-stroke-color:rgba(226,96,60,.13)}
.st .st-sec--ink .st-wm{-webkit-text-stroke-color:rgba(244,185,66,.14)}
@media(max-width:760px){.st .st-wm{font-size:60px;top:10px}}

/* ---------- type ---------- */
.st h1,.st h2,.st h3{font-family:var(--serif);color:var(--ink);text-wrap:balance}
.st .st-sec--ink h2,.st .st-sec--ink h3{color:#f6f3ea}
.st h2{font-weight:600;font-size:clamp(28px,3.7vw,46px);line-height:1.1;letter-spacing:-.012em;margin-bottom:16px}
.st h2 .st-it,.st h1 .st-it{font-style:italic;font-weight:500;color:var(--sea-deep)}
.st .st-sec--ink h2 .st-it{color:var(--lemon)}
.st h3{font-weight:600;font-size:21px}
.st .st-lede{font-size:clamp(16px,1.32vw,18.5px);color:var(--ink-soft);max-width:62ch}
.st .st-sec--ink .st-lede{color:#a8c4cc}
.st em{font-style:italic}

/* chapter head — "Where The Boats Go · 02" over a rule */
.st .st-chap{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.st .st-chap::after{content:"";flex:1;height:1px;background:var(--line)}
.st .st-sec--ink .st-chap::after{background:rgba(255,255,255,.16)}
.st .st-chap span{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--sea-deep);white-space:nowrap}
.st .st-sec--ink .st-chap span{color:var(--lemon)}
.st .st-chap b{font-family:var(--serif);font-style:italic;font-weight:500;font-size:15px;color:var(--ink-faint)}
.st .st-sechead{margin-bottom:46px}
.st .st-center{text-align:center}
.st .st-center .st-chap{justify-content:center}
.st .st-center .st-chap::after{display:none}
.st .st-center .st-lede{margin-left:auto;margin-right:auto}

/* ---------- stat chip DNA (value + label) ---------- */
.st .st-facts{display:flex;flex-wrap:wrap;gap:10px}
.st .st-fact{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:74px;padding:10px 14px;background:var(--white);border:1px solid var(--line);border-radius:14px;text-align:center}
.st .st-fact b{font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.1;color:var(--ink)}
.st .st-fact span{font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--ink-faint);margin-top:3px}
.st .st-fact--sea{background:var(--sea-tint);border-color:rgba(12,116,137,.2)}
.st .st-fact--sea b{color:var(--sea-deep)}

/* small tags */
.st .st-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-radius:999px;padding:6px 13px;white-space:nowrap}
.st .st-tag--sea{background:var(--sea-tint);color:var(--sea-deep)}
.st .st-tag--lemon{background:var(--lemon-tint);color:var(--lemon-deep)}
.st .st-tag--terra{background:var(--terra-tint);color:var(--terra)}
.st .st-tag--line{border:1px solid var(--line);background:var(--white);color:var(--ink-soft)}
.st .st-tag--fill{background:var(--ink);color:#fff}

/* ---------- buttons ---------- */
.st .st-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:15px;padding:15px 28px;border-radius:14px;border:1.5px solid transparent;background:var(--sea);color:#fff;box-shadow:var(--sh-cta);transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s}
.st .st-btn:hover{transform:translateY(-2px);background:var(--sea-deep);box-shadow:0 14px 32px rgba(12,116,137,.4)}
.st .st-btn--lemon{background:var(--lemon);color:var(--ink);box-shadow:0 10px 26px rgba(244,185,66,.4)}
.st .st-btn--lemon:hover{background:#eaa92a;box-shadow:0 14px 32px rgba(244,185,66,.5)}
.st .st-btn--line{background:var(--white);color:var(--ink);border-color:var(--line);box-shadow:var(--sh-1)}
.st .st-btn--line:hover{background:var(--white);border-color:var(--ink);box-shadow:var(--sh-2)}
.st .st-btn--ghostink{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.35);box-shadow:none;backdrop-filter:blur(6px)}
.st .st-btn--ghostink:hover{background:rgba(255,255,255,.2)}
.st .st-tlink{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14.5px;color:var(--sea-deep);transition:gap .3s var(--ease)}
.st .st-tlink:hover{gap:13px}
.st .st-tlink::after{content:"→"}

/* booking button — high contrast terracotta gradient + shine sweep */
.st .st-btn--book{background:linear-gradient(100deg,var(--terra) 10%,#ef8340 90%);color:#fff;border:0;box-shadow:0 10px 26px rgba(226,96,60,.42);position:relative;overflow:hidden}
.st .st-btn--book::before{content:"";position:absolute;top:-40%;bottom:-40%;left:-70%;width:36%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);transition:left .55s var(--ease)}
.st .st-btn--book:hover::before{left:130%}
.st .st-btn--book::after{content:"→";display:inline-block;transition:transform .3s var(--ease)}
.st .st-btn--book:hover{box-shadow:0 16px 38px rgba(226,96,60,.55);transform:translateY(-2px)}
.st .st-btn--book:hover::after{transform:translateX(5px)}
.st .st-btn:active{transform:translateY(0) scale(.96)}

/* inline content links */
.st .st-alink{color:var(--terra);font-weight:600;background-image:linear-gradient(var(--terra),var(--terra));background-size:0% 1.5px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .35s var(--ease),color .25s}
.st .st-alink:hover{background-size:100% 1.5px;color:var(--terra-deep)}
.st .st-sec--ink .st-alink{color:var(--lemon)}
.st .st-sec--ink .st-alink{background-image:linear-gradient(var(--lemon),var(--lemon))}

/* ---------- media plates ---------- */
.st .st-plate{position:relative;overflow:hidden;background:var(--sand);border-radius:var(--r-lg)}
.st .st-plate img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.st .st-plate:hover img{transform:scale(1.04)}
.st .st-ptag{position:absolute;top:14px;left:14px;z-index:2;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.94);color:var(--ink);padding:7px 14px;border-radius:999px;box-shadow:0 2px 12px rgba(0,0,0,.16);backdrop-filter:blur(4px)}
.st .st-ptag--sea{background:var(--sea);color:#fff}
.st .st-ptag--lemon{background:var(--lemon);color:var(--ink)}

/* reveal */
.st .st-rv{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.st .st-rv.st-in{opacity:1;transform:none}
.st .st-rv.st-d1{transition-delay:.09s}.st .st-rv.st-d2{transition-delay:.18s}.st .st-rv.st-d3{transition-delay:.27s}

/* ---------- NAV (fixed — always at the very top) ---------- */
.st .st-nav{position:fixed;top:0;left:0;right:0;z-index:80;background:rgba(251,250,247,.92);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:background .45s var(--ease),border-color .4s,box-shadow .4s}
.st .st-nav.st-scrolled{border-bottom-color:var(--line);box-shadow:0 6px 24px rgba(15,39,51,.07)}
/* transparent over full-bleed hero */
.st .st-nav.st-over{background:transparent;backdrop-filter:none;border-bottom-color:rgba(255,255,255,.14);box-shadow:none}
.st .st-nav.st-over .st-nav__links a{color:rgba(255,255,255,.85)}
.st .st-nav.st-over .st-nav__links a:hover{color:var(--lemon)}
.st .st-nav.st-over .st-brand__name{color:#fff}
.st .st-nav.st-over .st-brand__sub{color:rgba(255,255,255,.6)}
.st .st-nav.st-over .st-nav__burger span,.st .st-nav.st-over .st-nav__burger span::before,.st .st-nav.st-over .st-nav__burger span::after{background:#fff}
.st .st-nav__inner{max-width:var(--wrap);margin:0 auto;padding:13px 24px;display:flex;align-items:center;gap:24px}
.st .st-brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.st .st-brand__mark{width:42px;height:42px;flex:none;border-radius:50%;background:url("/assets/logo.svg") center/contain no-repeat;font-size:0;color:transparent;box-shadow:0 5px 14px rgba(12,116,137,.32)}
.st .st-brand__name{font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.05}
.st .st-brand__sub{font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint)}
.st .st-nav__links{display:flex;gap:16px;align-items:center;list-style:none;white-space:nowrap}
.st .st-nav__links a{font-size:13.5px;font-weight:600;color:var(--ink-soft);transition:color .3s}
.st .st-nav__links a:hover{color:var(--sea-deep)}
.st .st-nav__cta{padding:11px 20px;font-size:13.5px;border-radius:999px}
.st .st-nav__burger{display:none;background:none;border:0;width:42px;height:42px;position:relative;border-radius:10px}
.st .st-nav__burger span,.st .st-nav__burger span::before,.st .st-nav__burger span::after{content:"";display:block;position:absolute;left:10px;right:10px;height:2px;border-radius:2px;background:var(--ink);transition:.2s}
.st .st-nav__burger span{top:20px}
.st .st-nav__burger span::before{top:-7px}
.st .st-nav__burger span::after{top:7px}

/* ---------- HERO: full-bleed switching backdrop ---------- */
.st .st-hero{position:relative;padding:140px 0 0;min-height:96vh;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;color:#fff;background:var(--ink)}
.st .st-hero__bg{position:absolute;inset:0;background-position:center;background-size:cover;opacity:0;transition:opacity .9s var(--ease);will-change:opacity}
.st .st-hero__bg.st-show{opacity:1}
/* film grain — quiet texture, no motion */
.st .st-grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/></svg>")}
/* one-time entrance choreography */
@keyframes st-enter{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.st .st-hero .st-anim{animation:st-enter .85s var(--ease) backwards}
.st .st-hero .st-a1{animation-delay:.05s}
.st .st-hero .st-a2{animation-delay:.16s}
.st .st-hero .st-a3{animation-delay:.27s}
.st .st-hero .st-a4{animation-delay:.38s}
.st .st-hero .st-a5{animation-delay:.49s}
.st .st-hero .st-a6{animation-delay:.62s}
@media(prefers-reduced-motion:reduce){.st .st-hero .st-anim{animation:none}}
.st .st-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(9,26,36,.82) 0%,rgba(9,26,36,.55) 44%,rgba(9,26,36,.22) 75%,rgba(9,26,36,.45) 100%),linear-gradient(180deg,rgba(9,26,36,.5) 0%,transparent 26%,transparent 62%,rgba(9,26,36,.72) 100%);pointer-events:none}
.st .st-hero>.st-wrap{position:relative;z-index:2;width:100%}
.st .st-hero__grid{display:grid;grid-template-columns:minmax(0,6.6fr) minmax(0,5.4fr);gap:52px;align-items:center;padding-bottom:24px}
.st .st-live{display:inline-flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:8px 16px;backdrop-filter:blur(6px);margin-bottom:22px}
.st .st-live i{width:8px;height:8px;border-radius:50%;background:#3fd58a;animation:st-pulse 2s infinite}
@keyframes st-pulse{0%,100%{box-shadow:0 0 0 0 rgba(63,213,138,.55)}60%{box-shadow:0 0 0 7px rgba(63,213,138,0)}}
.st .st-hero h1{font-weight:600;font-size:clamp(38px,4.9vw,64px);line-height:1.06;letter-spacing:-.016em;margin-bottom:18px;color:#fff;text-shadow:0 2px 24px rgba(9,26,36,.35)}
.st .st-hero h1 .st-it{font-style:italic;font-weight:500;color:var(--lemon)}
.st .st-hero__sub{font-size:clamp(16px,1.4vw,18.5px);color:rgba(255,255,255,.85);max-width:54ch;margin-bottom:22px}
.st .st-hero__proof{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin-bottom:26px;font-size:13.5px;font-weight:600;color:#fff}
.st .st-hero__proof .st-stars{color:var(--lemon);letter-spacing:1.5px}
.st .st-hero__proof .st-mut{color:rgba(255,255,255,.6);font-weight:500}
.st .st-hero__ctas{display:flex;flex-wrap:wrap;gap:14px}

/* hero right: switching tour card (photo + book) — deep, still, precise */
.st .st-htour{position:relative;z-index:2;background:rgba(251,250,247,.98);border-radius:var(--r-lg);overflow:hidden;backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 16px 36px rgba(0,0,0,.32),0 44px 100px rgba(0,0,0,.42);outline:1px solid rgba(255,255,255,.3);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.st .st-htour:hover{transform:translateY(-5px);box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 22px 46px rgba(0,0,0,.36),0 56px 120px rgba(0,0,0,.46)}
.st .st-htour::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(15,39,51,.06)}
.st .st-htour__media{position:relative;aspect-ratio:16/9;background:var(--ink-2);overflow:hidden}
.st .st-htour__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s var(--ease)}
.st .st-htour__media img.st-show{opacity:1}
.st .st-htour__flag{position:absolute;top:12px;left:12px;z-index:2}
.st .st-dcard{display:none;padding:18px 20px 20px;color:var(--ink)}
.st .st-dcard.st-on{display:block;animation:st-pop .5s var(--ease)}
@keyframes st-pop{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.st .st-dcard__top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:4px}
.st .st-dcard__top h3{font-size:18.5px;line-height:1.25}
.st .st-dcard__price{text-align:right;line-height:1.1;flex:none}
.st .st-dcard__price em{display:block;font-style:normal;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-dcard__price b{font-family:var(--serif);font-size:23px;font-weight:700;color:var(--terra)}
.st .st-dcard__meta{font-size:12.5px;color:var(--ink-soft);margin-bottom:6px}
.st .st-dcard__meta .st-stars{color:var(--lemon-deep);font-weight:700}
.st .st-dcard>p{font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:13px}
.st .st-dcard__ctas{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.st .st-dcard__ctas .st-btn{padding:13px 22px;font-size:13.5px}
.st .st-dcard__hub{font-size:12.5px;font-weight:700;color:var(--sea-deep);border-bottom:1.5px dashed rgba(7,94,111,.4)}
.st .st-dcard__hub:hover{color:var(--terra);border-color:var(--terra)}
.st .st-dcard__note{font-size:10.5px;color:var(--ink-faint);margin-top:9px}

/* dock bar — creative switcher pinned to hero bottom, boat sails to the pick */
.st .st-dockbar{position:relative;z-index:3;margin-top:52px;background:rgba(8,22,31,.72);border-top:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px)}
.st .st-dockbar__hint{text-align:center;padding:11px 16px 0;font-size:10px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:rgba(244,185,66,.85)}
.st .st-dockbar__hint i{font-style:normal;margin-left:6px;color:var(--lemon)}
.st .st-dockbar__inner{max-width:var(--wrap);margin:0 auto;padding:0 24px;position:relative}
.st .st-dockbar__rail{position:absolute;top:-1px;left:24px;right:24px;height:3px;background:linear-gradient(90deg,var(--sea),var(--lemon));border-radius:3px;opacity:.55}
.st .st-boat{position:absolute;top:-17px;left:10%;width:34px;height:26px;transform:translateX(-50%);transition:left .6s var(--ease);filter:drop-shadow(0 4px 10px rgba(0,0,0,.4));pointer-events:none;animation:st-bob 3.2s ease-in-out infinite}
@keyframes st-bob{0%,100%{margin-top:0}50%{margin-top:-4px}}
.st .st-boat svg{width:100%;height:100%}
.st .st-dockbar__tiles{display:grid;grid-template-columns:repeat(5,1fr)}
.st .st-dtile{padding:15px 10px 13px;border:0;background:transparent;text-align:center;color:rgba(255,255,255,.72);cursor:pointer;transition:.28s var(--ease);position:relative}
.st .st-dtile::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--lemon);transform:scaleX(0);transition:transform .3s var(--ease)}
.st .st-dtile+.st-dtile::before{content:"";position:absolute;left:0;top:24%;bottom:24%;width:1px;background:rgba(255,255,255,.12)}
.st .st-dtile b{display:block;font-family:var(--serif);font-size:17px;font-weight:700;color:rgba(255,255,255,.85);transition:color .28s}
.st .st-dtile span{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:rgba(255,255,255,.45)}
.st .st-dtile i{font-style:normal;display:block;font-size:11.5px;font-weight:700;color:rgba(244,185,66,.75);margin-top:2px;transition:color .28s}
.st .st-dtile:hover{background:rgba(255,255,255,.05)}
.st .st-dtile:hover b{color:#fff}
.st .st-dtile.st-on{background:linear-gradient(180deg,transparent,rgba(244,185,66,.1))}
.st .st-dtile.st-on::after{transform:scaleX(1)}
.st .st-dtile.st-on b{color:var(--lemon)}
.st .st-dtile.st-on i{color:var(--lemon)}

/* wave separators */
.st .st-wavesep{display:block;width:100%;height:56px;margin:-1px 0;background:var(--ink)}
.st .st-wavesep svg{display:block;width:100%;height:100%}
.st .st-wavesep--tofinal{background:var(--sand)}

/* sub navigation (section anchors, fixed under main nav) */
.st .st-subnav{position:fixed;top:66px;left:0;right:0;z-index:70;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 6px 20px rgba(15,39,51,.06);opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s .35s}
.st .st-subnav.st-show{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .35s var(--ease)}
.st .st-subnav__inner{max-width:var(--wrap);margin:0 auto;padding:0 24px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.st .st-subnav__inner::-webkit-scrollbar{display:none}
.st .st-subnav a{flex:none;font-size:12.5px;font-weight:700;color:var(--ink-soft);padding:12px 14px;border-bottom:2.5px solid transparent;transition:.25s;white-space:nowrap}
.st .st-subnav a:hover{color:var(--sea-deep)}
.st .st-subnav a.st-on{color:var(--terra);border-bottom-color:var(--terra)}

/* back to top */
.st .st-totop{position:fixed;right:18px;bottom:90px;z-index:84;width:48px;height:48px;border-radius:50%;border:0;background:var(--ink);color:var(--lemon);box-shadow:0 10px 28px rgba(15,39,51,.35);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transform:translateY(14px);transition:.35s var(--ease)}
.st .st-totop.st-show{opacity:1;pointer-events:auto;transform:none}
.st .st-totop:hover{background:var(--terra);color:#fff;transform:translateY(-3px)}
.st .st-totop svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* GYG widget cards */
.st .st-widgetcard{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:26px 28px;position:relative;overflow:hidden}
.st .st-widgetcard::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--terra),var(--lemon))}
.st .st-widgetcard__head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.st .st-widgetcard__head h3{font-size:20px}
.st .st-widgetcard__head h3 .st-it{font-style:italic;color:var(--terra)}
.st .st-widgetcard__head span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-widgetcard [data-gyg-widget]{min-height:120px}

/* tour matchmaker */
.st .st-match{background:var(--ink);border-radius:var(--r-xl);padding:38px 38px 34px;color:#dcebee;position:relative;overflow:hidden;margin-top:52px}
.st .st-match::before{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(244,185,66,.18),transparent 65%)}
.st .st-match::after{content:"";position:absolute;left:-100px;bottom:-140px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(12,116,137,.28),transparent 65%)}
.st .st-match>*{position:relative;z-index:1}
.st .st-match h3{color:#fff;font-size:clamp(21px,2.4vw,28px);margin-bottom:6px}
.st .st-match h3 .st-it{font-style:italic;color:var(--lemon)}
.st .st-match__sub{font-size:13.5px;color:#a8c4cc;margin-bottom:20px}
.st .st-match__chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px}
.st .st-mchip{border:1.5px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);border-radius:999px;padding:10px 18px;font-size:13.5px;font-weight:600;color:#fff;transition:.25s var(--ease)}
.st .st-mchip:hover{border-color:var(--lemon);transform:translateY(-2px)}
.st .st-mchip.st-on{background:var(--lemon);border-color:var(--lemon);color:var(--ink)}
.st .st-mres{display:none;background:rgba(251,250,247,.97);color:var(--ink);border-radius:var(--r-lg);padding:20px 22px;box-shadow:0 18px 44px rgba(0,0,0,.35)}
.st .st-mres.st-on{display:flex;gap:18px;align-items:center;animation:st-pop .5s var(--ease)}
.st .st-mres__img{width:120px;aspect-ratio:1/1;border-radius:12px;overflow:hidden;flex:none}
.st .st-mres__img img{width:100%;height:100%;object-fit:cover}
.st .st-mres__body{flex:1}
.st .st-mres__body .st-why{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--terra);display:block;margin-bottom:4px}
.st .st-mres__body h4{font-family:var(--serif);font-size:17.5px;margin-bottom:4px}
.st .st-mres__body p{font-size:12.5px;color:var(--ink-soft);margin-bottom:10px}
.st .st-mres__body .st-mprice{font-family:var(--serif);font-weight:700;color:var(--terra);margin-right:12px}
.st .st-mres__ctas{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.st .st-mres__ctas .st-btn{padding:11px 18px;font-size:12.5px}

/* scroll cue */
.st .st-cue{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.st .st-cue i{width:1.5px;height:38px;background:rgba(255,255,255,.25);overflow:hidden;position:relative}
.st .st-cue i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--lemon);animation:st-cuedrop 2.2s var(--ease) infinite}
@keyframes st-cuedrop{0%{transform:translateY(0)}70%,100%{transform:translateY(200%)}}

/* moving destination ticker */
.st .st-tick{background:var(--ink);border-top:1px solid rgba(255,255,255,.08);padding:14px 0;overflow:hidden;position:relative}
.st .st-tick__track{display:flex;gap:0;width:max-content;animation:st-tick 38s linear infinite}
.st .st-tick:hover .st-tick__track{animation-play-state:paused}
@keyframes st-tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.st .st-tick a{display:inline-flex;align-items:center;gap:22px;padding:0 22px;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#8fb0bc;white-space:nowrap;transition:color .25s}
.st .st-tick a:hover{color:var(--lemon)}
.st .st-tick a::after{content:"◆";font-size:7px;color:var(--terra)}

/* animated stat counters band */
.st .st-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.st .st-stat{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 20px;text-align:center;box-shadow:var(--sh-1);position:relative;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.st .st-stat:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.st .st-stat::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--sea),var(--lemon))}
.st .st-stat b{display:block;font-family:var(--serif);font-weight:700;font-size:36px;line-height:1;color:var(--sea-deep)}
.st .st-stat b i{font-style:normal;font-size:19px;color:var(--terra)}
.st .st-stat span{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:8px;line-height:1.45}
.st .st-stat a{color:var(--terra);font-weight:700}

/* widget grid: three availability widgets */
.st .st-widgetgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st .st-widgetgrid .st-widgetcard{padding:20px}
.st .st-widgetgrid .st-widgetcard h4{font-family:var(--serif);font-size:16.5px;margin-bottom:3px}
.st .st-widgetgrid .st-widgetcard .st-wprice{font-size:12px;font-weight:700;color:var(--terra);display:block;margin-bottom:12px}

/* ---------- WAYS (key decision, region-card style) ---------- */
.st .st-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:44px}
.st .st-way{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column;position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.st .st-way:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.st .st-way--win{border-color:rgba(12,116,137,.35)}
.st .st-way__photo{aspect-ratio:16/9;overflow:hidden;position:relative}
.st .st-way__photo img{width:100%;height:100%;object-fit:cover}
.st .st-way__body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1;gap:14px}
.st .st-way h3{font-size:23px}
.st .st-way h3 .st-it{font-style:italic;font-weight:500;color:var(--sea-deep)}
.st .st-way__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.st .st-way__stats .st-fact{padding:9px 6px;min-width:0;border-radius:12px;background:var(--paper)}
.st .st-way ul{list-style:none;display:grid;gap:8px;font-size:13.5px;color:var(--ink-soft)}
.st .st-way li{padding-left:24px;position:relative}
.st .st-way li::before{content:"";position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:50%;background:var(--sea-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23075e6f" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>') center/8px no-repeat}
.st .st-way li.st-con::before{background:var(--terra-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23e26d4f" stroke-width="3.4" stroke-linecap="round"><path d="M18 6L6 18M6 6l12 12"/></svg>') center/8px no-repeat}
.st .st-way__for{font-size:13px;color:var(--ink-soft);border-top:1px dashed var(--line);padding-top:13px}
.st .st-way__for strong{color:var(--ink)}
.st .st-way__flag{position:absolute;top:14px;left:14px;z-index:2}
.st .st-takeaway{text-align:center;font-family:var(--serif);font-size:clamp(18px,2vw,24px);font-weight:500;margin-bottom:46px}
.st .st-takeaway .st-it{font-style:italic;color:var(--sea-deep)}

/* sailing route line */
.st .st-route{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-1);padding:34px 36px 30px}
.st .st-route__head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.st .st-route__head h3{font-size:20px}
.st .st-route__head h3 .st-it{font-style:italic;font-weight:500;color:var(--sea-deep)}
.st .st-route__head span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-route__line{position:relative;height:5px;border-radius:999px;background:linear-gradient(90deg,var(--sea) 0%,var(--sea) 58%,var(--lemon) 100%);margin:0 8px 8px}
.st .st-route__line::after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);border:7px solid transparent;border-left:10px solid var(--lemon)}
.st .st-route__stops{display:flex;justify-content:space-between}
.st .st-stop{flex:1;text-align:center;position:relative;padding-top:16px}
.st .st-stop::before{content:"";position:absolute;top:-16px;left:50%;transform:translate(-50%,-50%);width:13px;height:13px;border-radius:50%;background:var(--white);border:3.5px solid var(--sea);box-shadow:0 2px 8px rgba(12,116,137,.28)}
.st .st-stop--origin::before{background:var(--lemon);border-color:var(--lemon-deep);width:17px;height:17px}
.st .st-stop b{display:block;font-family:var(--serif);font-size:14.5px;font-weight:700}
.st .st-stop span{font-size:11px;color:var(--ink-faint);font-weight:700;letter-spacing:.04em}

/* ---------- TOURS: filter bar + cards ---------- */
.st .st-filterbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.st .st-fchip{border:1.5px solid var(--line);background:var(--white);border-radius:999px;padding:9px 17px;font-size:13px;font-weight:600;color:var(--ink-soft);transition:.25s var(--ease);box-shadow:var(--sh-1)}
.st .st-fchip small{font-weight:700;color:var(--ink-faint);margin-left:5px}
.st .st-fchip:hover{border-color:var(--sea);color:var(--sea-deep)}
.st .st-fchip.st-on{background:var(--ink);border-color:var(--ink);color:#fff}
.st .st-fchip.st-on small{color:rgba(255,255,255,.6)}
.st .st-sort{margin-left:auto;display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink-faint);font-weight:600}
.st .st-sort select{font-family:inherit;font-size:13px;font-weight:600;color:var(--ink);border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;background:var(--white);cursor:pointer}
.st .st-count{font-size:13px;color:var(--ink-faint);margin-bottom:22px}
.st .st-count b{color:var(--ink)}
.st .st-tours{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st .st-tour{border:1px solid var(--line);background:var(--white);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column;position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.st .st-tour:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.st .st-tour.st-hide{display:none}
.st .st-tour__badge{position:absolute;top:14px;left:14px;z-index:3}
.st .st-tour__photo{aspect-ratio:16/10;overflow:hidden;background:var(--sand);display:block}
.st .st-tour__photo img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.st .st-tour:hover .st-tour__photo img{transform:scale(1.05)}
.st .st-tour__body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.st .st-tour h3{font-size:18px;line-height:1.3;min-height:46.8px;margin-bottom:10px}
.st .st-tour__meta{display:flex;flex-wrap:wrap;gap:6px;min-height:26px;margin-bottom:14px}
.st .st-tour__meta .st-tag{font-size:10px;padding:5px 10px}
.st .st-tour__price{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:13px;margin-bottom:14px}
.st .st-tour__price .st-fromp{font-family:var(--serif);font-weight:700;font-size:21px}
.st .st-tour__price .st-fromp em{font-style:normal;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink-faint);margin-right:6px}
.st .st-tour__price .st-rate{font-size:12.5px;font-weight:700}
.st .st-tour__price .st-rate .st-stars{color:var(--lemon-deep)}
.st .st-tour__price .st-rate .st-rn{color:var(--ink-faint);font-weight:500}
.st .st-tour .st-btn{margin-top:auto;width:100%;font-size:13.5px;padding:12px 16px;border-radius:12px}
.st .st-tour__ctas{display:flex;gap:8px;margin-top:auto}
.st .st-tour__ctas .st-btn{margin-top:0;width:auto;flex:1;font-size:12.5px;padding:12px 8px;border-radius:12px}
.st .st-tour__ctas .st-btn--line{border-color:var(--line-strong)}

/* how to book — 4 steps */
.st .st-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}
.st .st-step{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 20px;box-shadow:var(--sh-1);position:relative}
.st .st-step i{font-style:normal;font-family:var(--serif);font-style:italic;font-weight:700;font-size:30px;color:var(--lemon-deep);display:block;margin-bottom:8px}
.st .st-step b{display:block;font-size:14.5px;margin-bottom:4px}
.st .st-step span{font-size:12.5px;color:var(--ink-soft);line-height:1.5}

/* ---------- HUBS ---------- */
.st .st-hubs{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.st .st-hub{border:1px solid var(--line);background:var(--white);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column;position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.st .st-hub:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.st .st-hub__photo{aspect-ratio:16/10;overflow:hidden;position:relative;background:var(--sand)}
.st .st-hub__photo img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.st .st-hub:hover .st-hub__photo img{transform:scale(1.05)}
.st .st-hub__count{position:absolute;top:12px;left:12px;z-index:2}
.st .st-hub__body{padding:17px 19px 19px;display:flex;flex-direction:column;flex:1}
.st .st-hub h3{font-size:18.5px;margin-bottom:5px}
.st .st-hub p{font-size:13px;color:var(--ink-soft);line-height:1.5;margin-bottom:13px}
.st .st-hub .st-tlink{margin-top:auto;font-size:13px}

/* ---------- comparison table ---------- */
.st .st-tablecard{border:1px solid var(--line);border-radius:var(--r-xl);background:var(--white);box-shadow:var(--sh-1);overflow:hidden}
.st .st-tablewrap{overflow-x:auto}
.st .st-table{width:100%;border-collapse:collapse;font-size:14px;min-width:860px}
.st .st-table th{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;text-align:left;padding:15px 18px;background:var(--sand);color:var(--ink-soft);border-bottom:1px solid var(--line)}
.st .st-table td{padding:16px 18px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-soft)}
.st .st-table tr:last-child td{border-bottom:0}
.st .st-table tr:hover td{background:var(--sea-tint)}
.st .st-table .st-t-name{font-weight:700;min-width:230px}
.st .st-table .st-t-name a{color:var(--terra);border-bottom:1.5px solid rgba(226,96,60,.35);transition:.25s}
.st .st-table .st-t-name a::after{content:" ↗";font-size:11px}
.st .st-table .st-t-name a:hover{color:var(--terra-deep);border-bottom-color:var(--terra-deep)}
.st .st-table .st-t-book .st-btn{padding:9px 15px;font-size:11px;border-radius:10px;white-space:nowrap}
.st .st-table .st-t-name .st-tag{margin-top:7px;font-size:10px}
.st .st-table .st-t-price{font-family:var(--serif);font-weight:700;font-size:17px;white-space:nowrap;color:var(--ink)}
.st .st-table .st-t-rating{white-space:nowrap;font-weight:700;font-size:13px}
.st .st-table .st-t-rating .st-stars{color:var(--lemon-deep)}
.st .st-table .st-t-rating .st-rn{color:var(--ink-faint);font-weight:500}
.st .st-tablenote{font-size:13px;color:var(--ink-soft);margin-top:16px}
.st .st-tablenote b{color:var(--sea-deep)}

/* ---------- features ---------- */
.st .st-feature{display:grid;grid-template-columns:minmax(0,10fr) minmax(0,9fr);gap:58px;align-items:center;padding:50px 0;position:relative}
.st .st-feature+.st-feature{border-top:1px solid var(--line)}
.st .st-feature__media{position:relative}
.st .st-feature__media::after{content:"";position:absolute;z-index:0;width:230px;height:230px;border-radius:50%;right:-60px;top:-50px;background:radial-gradient(circle,rgba(12,116,137,.16),transparent 65%)}
.st .st-feature:nth-of-type(2) .st-feature__media::after{background:radial-gradient(circle,rgba(226,96,60,.15),transparent 65%);right:auto;left:-60px}
.st .st-feature:nth-of-type(3) .st-feature__media::after{background:radial-gradient(circle,rgba(244,185,66,.2),transparent 65%)}
.st .st-feature__media .st-plate,.st .st-feature__media .st-second{z-index:1}
.st .st-feature__no{position:absolute;top:6px;right:0;font-family:var(--serif);font-style:italic;font-weight:700;font-size:74px;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(12,116,137,.28);pointer-events:none}
.st .st-feature__media .st-plate{aspect-ratio:4/3;box-shadow:var(--sh-2);border-radius:var(--r-xl)}
.st .st-feature__media .st-second{position:relative;z-index:2;width:70%;aspect-ratio:16/10;margin:-70px 0 0 auto;border-radius:14px;border:5px solid var(--paper);box-shadow:0 18px 40px rgba(15,39,51,.2);overflow:hidden;background:var(--sand)}
.st .st-feature__media .st-second img{width:100%;height:100%;object-fit:cover}
.st .st-feature--flip .st-feature__media{order:2}
.st .st-feature--flip .st-feature__media .st-second{margin:-70px auto 0 0}
.st .st-feature__body{position:relative}
.st .st-feature__body .st-tag{display:inline-flex}
.st .st-feature__body h2{font-size:clamp(24px,2.9vw,36px)}
.st .st-feature__body>p{color:var(--ink-soft);font-size:15.5px}
.st .st-feature__facts{margin:20px 0 24px}
.st .st-feature__facts .st-fact{background:var(--white)}

/* ---------- cruise band ---------- */
.st .st-cruise{display:grid;grid-template-columns:auto 1fr auto;gap:34px;align-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-xl);padding:36px 40px;backdrop-filter:blur(6px)}
.st .st-cruise__icon{width:64px;height:64px;border-radius:50% 50% 50% 8px;background:rgba(244,185,66,.14);display:flex;align-items:center;justify-content:center}
.st .st-cruise__icon svg{width:32px;height:32px;stroke:var(--lemon);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.st .st-cruise h3{font-size:24px}
.st .st-cruise h3 .st-it{font-style:italic;color:var(--lemon)}
.st .st-cruise p{font-size:14.5px;color:#a8c4cc;max-width:640px;margin-top:8px}
.st .st-cruise p a{color:var(--lemon);font-weight:700;border-bottom:1px solid rgba(244,185,66,.4)}

/* ---------- knows ---------- */
.st .st-knows{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st .st-know{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px;box-shadow:var(--sh-1);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.st .st-know:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.st .st-know i{font-style:italic;font-family:var(--serif);font-weight:700;font-size:15px;color:var(--terra);display:block;margin-bottom:9px}
.st .st-know h3{font-size:17.5px;margin-bottom:7px}
.st .st-know p{font-size:13.5px;color:var(--ink-soft);line-height:1.55}

/* ---------- tiers ---------- */
.st .st-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st .st-tier{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-1);padding:28px;display:flex;flex-direction:column;position:relative}
.st .st-tier--hot{border-color:rgba(12,116,137,.35);box-shadow:var(--sh-2)}
.st .st-tier__flag{position:absolute;top:-13px;left:24px}
.st .st-tier__label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--ink-faint);margin-bottom:5px}
.st .st-tier__price{font-family:var(--serif);font-weight:700;font-size:31px;margin-bottom:16px}
.st .st-tier__price small{font-size:13px;color:var(--ink-soft);font-weight:500}
.st .st-tier ul{list-style:none;display:grid;gap:10px;font-size:13.5px;margin-bottom:18px}
.st .st-tier li{padding-left:24px;position:relative;color:var(--ink-soft)}
.st .st-tier li::before{content:"";position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:50%;background:var(--lemon-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23c78f1b" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>') center/8px no-repeat}
.st .st-tier__note{margin-top:auto;font-size:12.5px;color:var(--ink-soft);border-top:1px dashed var(--line);padding-top:13px;font-style:italic}

/* ---------- seasons ---------- */
.st .st-seasons{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.st .st-season{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:22px;position:relative;overflow:hidden}
.st .st-season::before{content:"";position:absolute;top:0;left:0;right:0;height:5px}
.st .st-season--spring::before{background:linear-gradient(90deg,#43a06d,#9ed7b4)}
.st .st-season--summer::before{background:linear-gradient(90deg,var(--lemon),var(--terra))}
.st .st-season--autumn::before{background:linear-gradient(90deg,#d07a3a,#eec27f)}
.st .st-season--winter::before{background:linear-gradient(90deg,#3a6fd0,#8fb4ea)}
.st .st-season__months{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--ink-faint);display:block;margin-bottom:5px}
.st .st-season h3{font-size:20px;margin-bottom:3px}
.st .st-season .st-temp{font-family:var(--serif);font-style:italic;font-size:13.5px;color:var(--sea-deep);display:block;margin-bottom:9px}
.st .st-season p{font-size:13px;color:var(--ink-soft);line-height:1.55;margin-bottom:13px}
.st .st-season .st-tag{font-size:9.5px}

/* ---------- itinerary ---------- */
.st .st-days{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.st .st-day{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:var(--r-lg);padding:26px;backdrop-filter:blur(4px)}
.st .st-day__chip{display:inline-flex;background:rgba(244,185,66,.16);color:var(--lemon);border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;padding:6px 14px;margin-bottom:13px}
.st .st-day h3{font-size:21px;margin-bottom:11px}
.st .st-day h3 .st-it{font-style:italic;color:var(--lemon)}
.st .st-day p{font-size:13.5px;color:#a8c4cc;line-height:1.65}
.st .st-day p b{color:#fff;font-weight:600}

/* ---------- FAQ ---------- */
.st .st-faq{max-width:840px;margin:0 auto}
.st .st-faqbar{display:flex;justify-content:space-between;align-items:center;gap:14px;max-width:840px;margin:0 auto 18px;font-size:13px;color:var(--ink-faint)}
.st .st-faqbar button{border:1.5px solid var(--line);background:var(--white);border-radius:999px;padding:8px 16px;font-size:12.5px;font-weight:700;color:var(--ink-soft);transition:.25s}
.st .st-faqbar button:hover{border-color:var(--sea);color:var(--sea-deep)}
.st .st-faq details{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:12px;box-shadow:var(--sh-1);overflow:hidden;transition:box-shadow .3s}
.st .st-faq details[open]{box-shadow:var(--sh-2);border-color:rgba(12,116,137,.3)}
.st .st-faq summary{cursor:pointer;padding:20px 60px 20px 25px;font-weight:700;font-size:16px;list-style:none;position:relative;line-height:1.45}
.st .st-faq summary::-webkit-details-marker{display:none}
.st .st-faq summary::after{content:"";position:absolute;right:21px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--sea-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23075e6f" stroke-width="2.6" stroke-linecap="round"><path d="M12 5v14M5 12h14"/></svg>') center/13px no-repeat;transition:transform .3s var(--ease)}
.st .st-faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.st .st-faq .st-faq__a{padding:0 25px 23px;color:var(--ink-soft);font-size:14.5px}
.st .st-faq .st-faq__a a{color:var(--sea-deep);font-weight:700;border-bottom:1px solid rgba(7,94,111,.3)}

/* ---------- final ---------- */
.st .st-final{text-align:center}
.st .st-final h2{max-width:740px;margin:0 auto 16px;font-size:clamp(30px,4vw,50px)}
.st .st-final .st-lede{margin:0 auto 34px}

/* ---------- footer ---------- */
.st .st-footer{background:#0b1e28;color:#8ba6b1;padding:72px 0 40px}
.st .st-footer h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:#eef4ee;margin-bottom:18px}
.st .st-footer__related{margin-bottom:52px}
.st .st-pills{display:flex;flex-wrap:wrap;gap:9px}
.st .st-pill{font-size:12px;font-weight:600;padding:8px 15px;border-radius:999px;border:1px solid rgba(255,255,255,.16);color:#a5bfc9;transition:.25s}
.st .st-pill:hover{border-color:var(--lemon);color:var(--lemon)}
.st .st-footer__cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:42px;margin-bottom:46px}
.st .st-footer__brand{font-family:var(--serif);font-weight:700;font-size:22px;color:#fff;margin-bottom:12px;display:block}
.st .st-footer__brand .st-it{font-style:italic;color:var(--lemon)}
.st .st-footer__cols p{font-size:13.5px;max-width:320px}
.st .st-footer__cols ul{list-style:none;display:grid;gap:10px;font-size:13.5px}
.st .st-footer__cols ul a{color:#8ba6b1;transition:color .25s}
.st .st-footer__cols ul a:hover{color:var(--lemon)}
.st .st-footer__legal{border-top:1px solid rgba(255,255,255,.1);padding-top:26px;font-size:12px;display:grid;gap:10px}
.st .st-footer__legal .st-disclosure{color:#5c7b88;max-width:880px}

/* ---------- sticky booking bar ---------- */
.st .st-sticky{position:fixed;left:0;right:0;bottom:0;z-index:85;background:rgba(251,250,247,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line);box-shadow:0 -10px 34px rgba(15,39,51,.1);transform:translateY(112%);transition:transform .5s var(--ease)}
.st .st-sticky.st-show{transform:none}
.st .st-sticky__inner{max-width:var(--wrap);margin:0 auto;padding:11px 24px;display:flex;align-items:center;gap:18px}
.st .st-sticky__title{font-family:var(--serif);font-weight:700;font-size:15.5px;line-height:1.2}
.st .st-sticky__meta{font-size:12.5px;color:var(--ink-soft);margin-top:2px}
.st .st-sticky__meta .st-stars{color:var(--lemon-deep);font-weight:700}
.st .st-sticky__price{margin-left:auto;text-align:right;line-height:1.15}
.st .st-sticky__price .st-fr{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-sticky__price .st-amt{font-family:var(--serif);font-weight:700;font-size:19px;white-space:nowrap}
.st .st-sticky .st-btn{padding:12px 24px;font-size:14px;border-radius:999px}

/* ═══════════ INNER PAGES: hub & tour components ═══════════ */

/* page hero — dark full-bleed variant (tour pages) */
.st .st-phero--dark{background:var(--ink);color:#e9f1f3;position:relative}
.st .st-phero--dark::before{content:"";position:absolute;inset:0;background:var(--phero-img) center/cover no-repeat;opacity:.32;filter:saturate(.8)}
.st .st-phero--dark::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(9,26,36,.86) 0%,rgba(9,26,36,.6) 46%,rgba(9,26,36,.3) 100%),linear-gradient(180deg,rgba(9,26,36,.4),transparent 30%,rgba(9,26,36,.55) 100%)}
.st .st-phero--dark>.st-wrap{position:relative;z-index:2}
.st .st-phero--dark h1{color:#fff}
.st .st-phero--dark h1 .st-it{color:var(--lemon)}
.st .st-phero--dark .st-lede{color:rgba(255,255,255,.85)}
.st .st-phero--dark .st-crumbs{color:rgba(255,255,255,.55)}
.st .st-phero--dark .st-crumbs a{color:#9fd6de}
.st .st-phero--dark .st-crumbs i{color:rgba(255,255,255,.3)}
.st .st-phero--dark .st-fact{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
.st .st-phero--dark .st-fact b{color:#fff}
.st .st-phero--dark .st-fact span{color:rgba(255,255,255,.55)}
.st .st-phero--dark .st-fact--sea{background:rgba(244,185,66,.14);border-color:rgba(244,185,66,.4)}
.st .st-phero--dark .st-fact--sea b{color:var(--lemon)}
.st .st-phero--dark .st-wm{-webkit-text-stroke-color:rgba(255,255,255,.09)}

/* ═══ "LA ROTTA" hero — cinematic title card + harbor-master's ledger sheet ═══ */
.st .st-vhero{position:relative;background:var(--paper);overflow:hidden}
.st .st-vhero__film{position:relative;padding:130px 0 96px;min-height:min(560px,72svh);display:flex;flex-direction:column;justify-content:flex-end}
.st .st-vhero__bg{position:absolute;inset:0;background:var(--vhero-img) center 35%/cover no-repeat}
.st .st-vhero__bg::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,39,51,.74) 0%,rgba(15,39,51,.38) 38%,rgba(15,39,51,.68) 100%)}
.st .st-vhero__bg::after{content:"";position:absolute;inset:0;opacity:.09;mix-blend-mode:overlay;background: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='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.st .st-vhero__inner{position:relative;z-index:2;max-width:var(--wrap);width:100%;margin:0 auto;padding:0 24px;color:#fff}
.st .st-vhero .st-crumbs{color:rgba(255,255,255,.72)}
.st .st-vhero .st-crumbs a{color:rgba(255,255,255,.72)}
.st .st-vhero .st-crumbs a:hover{color:var(--lemon)}
.st .st-vhero .st-crumbs i{color:rgba(255,255,255,.35)}
.st .st-vhero__badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.st .st-vhero__badge{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.35);color:#fff;background:rgba(15,39,51,.28);backdrop-filter:blur(4px)}
.st .st-vhero__badge--gold{background:var(--lemon);border-color:var(--lemon);color:var(--ink)}
.st .st-vhero__kicker{font-family:var(--sans);font-weight:600;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--lemon);margin:0 0 12px}
.st .st-vhero h1{font-family:var(--serif);font-weight:550;font-size:clamp(36px,5.2vw,70px);line-height:1.05;letter-spacing:-.01em;margin:0;max-width:17ch;color:#fff;text-shadow:0 2px 30px rgba(15,39,51,.45)}
.st .st-vhero h1 .st-it{font-style:italic;font-weight:450;color:var(--lemon)}
.st .st-vhero__lede{max-width:62ch;font-size:clamp(14.5px,1.25vw,16.5px);line-height:1.65;color:rgba(255,255,255,.88);margin:16px 0 0}
/* the ledger sheet */
.st .st-sheet{position:relative;z-index:3;max-width:var(--wrap);width:calc(100% - 40px);margin:-72px auto 0;background:var(--paper);border:1px solid #d8d2c2;border-radius:24px;box-shadow:0 30px 60px -30px rgba(15,39,51,.5);padding:8px 26px 6px;overflow:hidden}
.st .st-sheet::before{content:"";position:absolute;inset:0;background:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;opacity:.3;pointer-events:none}
.st .st-srow{position:relative;padding:18px 0;border-top:1px dashed #d8d2c2}
.st .st-srow:first-child{border-top:0}
.st .st-snum{font-family:var(--serif);font-style:italic;font-weight:500;font-size:13px;color:var(--sea);letter-spacing:.08em;display:block;margin-bottom:8px}
.st .st-sfare{display:flex;flex-wrap:wrap;align-items:center;gap:16px 30px}
.st .st-sprice{display:flex;align-items:baseline;gap:12px}
.st .st-sprice .st-was{position:relative;font-family:var(--serif);font-weight:500;font-size:26px;color:#a9b6bd}
.st .st-sprice .st-was::after{content:"";position:absolute;left:-4px;right:-4px;top:52%;height:2.5px;background:var(--terra);transform:rotate(-6deg);border-radius:2px}
.st .st-sprice .st-arr{color:var(--sea);font-size:20px}
.st .st-sprice .st-from{font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#5c7482}
.st .st-sprice .st-amt{font-family:var(--serif);font-weight:700;font-size:clamp(40px,4vw,54px);line-height:1;color:var(--ink)}
.st .st-sctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.st .st-sghost{font-weight:600;font-size:14.5px;color:var(--sea-deep);border:1.5px solid #c4dde0;padding:13px 22px;border-radius:999px;background:#fff;transition:.2s}
.st .st-sghost:hover{border-color:var(--sea);background:var(--sea-tint);color:var(--sea-deep)}
.st .st-sbullets{width:100%;display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;padding:0;list-style:none}
.st .st-sbullets li{font-size:13.5px;color:#3d5563;display:flex;gap:7px;align-items:center}
.st .st-sbullets li::before{content:"✓";color:var(--sea);font-weight:700}
.st .st-sspecs{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
.st .st-sspec{padding:12px 18px 12px 0}
.st .st-sspec .st-k{font-family:var(--sans);font-weight:600;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:#8a9aa4;display:block;margin-top:4px}
.st .st-sspec .st-v{font-family:var(--serif);font-weight:600;font-size:20px;color:var(--ink)}
.st .st-sfine{font-size:12px;color:#8a9aa4;padding:12px 0 14px;margin:0;border-top:1px dashed #d8d2c2}
.st .st-stagno{position:absolute;top:18px;right:0;font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--sea-deep);border:1px solid #c4dde0;background:var(--sea-tint);border-radius:6px;padding:5px 10px;display:none}
.st .st-scamps{display:grid;grid-template-columns:1fr;gap:10px}
.st .st-scamp{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid #d8d2c2;border-radius:16px;background:#fff;box-shadow:0 6px 16px -12px rgba(15,39,51,.3);transition:border-color .15s,background .15s,transform .15s}
.st .st-scamp .st-ico{font-size:24px;line-height:1}
.st .st-scamp .st-tx{display:flex;flex-direction:column;gap:2px}
.st .st-scamp b{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--ink)}
.st .st-scamp .st-p{font-family:var(--sans);font-weight:600;font-size:13px;color:var(--terra-deep)}
.st .st-scamp .st-go{margin-left:auto;font-weight:700;font-size:16px;color:var(--sea-deep)}
.st .st-scamp:hover{border-color:var(--sea);background:var(--sea-tint);transform:translateY(-2px);text-decoration:none}
.st .st-vhero__below{height:44px}
@media(min-width:900px){
  .st .st-sheet{padding:8px 40px 6px;margin-top:-84px}
  .st .st-sspecs{grid-template-columns:repeat(5,1fr)}
  .st .st-sspec+.st-sspec{border-left:1px dashed #d8d2c2;padding-left:18px}
  .st .st-stagno{display:block}
  .st .st-scamps{grid-template-columns:repeat(3,1fr)}
}

/* centered field-notes */
.st .st-notes--center{margin-left:auto;margin-right:auto}

/* booking panel as a boarding pass — the design move */
.st .st-phero--dark .st-phero__grid{align-items:start}
.st .st-hbook--pass{padding:0;border:0;border-radius:18px;transform:translateY(-6px)}
.st .st-hbook--pass::before{display:none}
.st .st-pass__route{display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:#fff;padding:14px 22px;border-radius:18px 18px 0 0}
.st .st-pass__route b{font-family:var(--serif);font-size:16px;letter-spacing:.04em}
.st .st-pass__route b i{font-style:normal;color:var(--lemon);margin:0 7px}
.st .st-pass__route span{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:rgba(255,255,255,.55)}
.st .st-hbook--pass .st-pass__main{padding:18px 22px 6px}
.st .st-pass__tear{position:relative;height:1px;border-top:2px dashed var(--line-strong);margin:12px 0}
.st .st-pass__tear::before,.st .st-pass__tear::after{content:"";position:absolute;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--ink)}
.st .st-pass__tear::before{left:-11px}
.st .st-pass__tear::after{right:-11px}
.st .st-hbook--pass .st-pass__foot{padding:4px 22px 18px}
.st .st-pass__code{height:34px;margin:12px 0 8px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 5px,var(--ink) 5px 6px,transparent 6px 10px,var(--ink) 10px 13px,transparent 13px 16px);border-radius:2px;opacity:.85}
@media(max-width:960px){.st .st-hbook--pass{transform:none}.st .st-pass__tear::before,.st .st-pass__tear::after{background:var(--ink)}}

/* camp strip — hub hero bottom anchors */
.st .st-campstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px;position:relative;z-index:2}
.st .st-camp-tile{display:flex;align-items:center;gap:16px;background:rgba(251,250,247,.97);border-radius:16px;padding:16px 20px;box-shadow:0 20px 50px rgba(0,0,0,.35);color:var(--ink);transition:transform .3s var(--ease),box-shadow .3s var(--ease);position:relative;overflow:hidden}
.st .st-camp-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--sea)}
.st .st-camp-tile:nth-child(2)::before{background:var(--terra)}
.st .st-camp-tile:nth-child(3)::before{background:var(--lemon)}
.st .st-camp-tile:hover{transform:translateY(-5px);box-shadow:0 28px 60px rgba(0,0,0,.45);text-decoration:none}
.st .st-camp-tile i{font-style:normal;font-size:26px;flex:none}
.st .st-camp-tile b{display:block;font-family:var(--serif);font-size:17px;line-height:1.15}
.st .st-camp-tile span{font-size:11.5px;font-weight:700;color:var(--ink-soft)}
.st .st-camp-tile em{font-style:normal;margin-left:auto;font-family:var(--serif);font-weight:700;color:var(--terra);white-space:nowrap}
.st .st-camp-tile u{position:absolute;right:14px;bottom:8px;text-decoration:none;font-size:11px;font-weight:700;color:var(--sea-deep)}

/* mini tour rows inside camp sections */
.st .st-minitours{display:grid;gap:12px;margin-top:20px}
.st .st-minitour{display:grid;grid-template-columns:auto 1fr auto auto;gap:16px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:12px 16px;box-shadow:var(--sh-1);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.st .st-minitour:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
.st .st-minitour img{width:74px;height:56px;object-fit:cover;border-radius:10px}
.st .st-minitour b{display:block;font-size:14.5px;line-height:1.3}
.st .st-minitour small{font-size:11.5px;color:var(--ink-soft)}
.st .st-minitour .st-mt-price{text-align:right;line-height:1.15}
.st .st-minitour .st-mt-price b{font-family:var(--serif);font-size:18px;color:var(--terra)}
.st .st-minitour .st-mt-price span{font-size:10.5px;font-weight:700;color:var(--lemon-deep);white-space:nowrap}
.st .st-minitour .st-btn{padding:10px 16px;font-size:12px;border-radius:11px}
@media(max-width:700px){
  .st .st-campstrip{grid-template-columns:1fr}
  .st .st-minitour{grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:14px 16px;padding:14px 16px}
  .st .st-minitour img{width:92px;height:70px}
  .st .st-minitour b{font-size:15.5px}
  .st .st-minitour .st-mt-price{text-align:left;margin-top:2px}
  .st .st-minitour .st-mt-price b{font-size:19px}
  .st .st-minitour .st-btn{grid-column:2;justify-self:stretch;padding:13px 18px;font-size:13.5px;margin-top:6px}
}

/* post-FAQ booking band — booking in ≤2 clicks */
.st .st-ctaband{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;background:linear-gradient(100deg,var(--ink),var(--ink-2));border-radius:var(--r-xl);padding:26px 30px;color:#e9f1f3;position:relative;overflow:hidden;box-shadow:var(--sh-2)}
.st .st-ctaband::before{content:"";position:absolute;right:-90px;top:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(244,185,66,.22),transparent 65%)}
.st .st-ctaband>*{position:relative}
.st .st-ctaband b{font-family:var(--serif);font-size:20px;display:block;color:#fff}
.st .st-ctaband span{font-size:13px;color:#a8c4cc}
.st .st-ctaband__btns{display:flex;gap:12px;flex-wrap:wrap}

/* page hero (light, under fixed nav) */
.st .st-phero{padding:138px 0 44px;position:relative;overflow:hidden;background:
  radial-gradient(720px 440px at 106% -8%,rgba(12,116,137,.09),transparent 60%),
  radial-gradient(640px 400px at -8% 106%,rgba(244,185,66,.15),transparent 60%),
  var(--sand)}
.st .st-crumbs{display:flex;flex-wrap:wrap;gap:7px;font-size:12px;font-weight:600;color:var(--ink-faint);margin-bottom:18px}
.st .st-crumbs a{color:var(--sea-deep)}
.st .st-crumbs a:hover{color:var(--terra)}
.st .st-crumbs i{font-style:normal;color:var(--line-strong)}
.st .st-phero h1{font-family:var(--serif);font-weight:600;font-size:clamp(30px,4.2vw,52px);line-height:1.08;letter-spacing:-.014em;margin-bottom:14px}
.st .st-phero h1 .st-it{font-style:italic;font-weight:500;color:var(--sea-deep)}
.st .st-phero .st-lede{margin-bottom:20px}
.st .st-phero__facts{display:flex;flex-wrap:wrap;gap:10px}

/* photo collage */
.st .st-collage{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:min(46vw,430px);margin-top:36px}
.st .st-collage .st-plate:first-child{grid-row:1/3}
.st .st-collage .st-plate{border-radius:var(--r-lg);box-shadow:var(--sh-1)}

/* tour layout: content + sticky booking rail */
.st .st-tgrid{display:grid;grid-template-columns:minmax(0,7.6fr) minmax(0,4.4fr);gap:44px;align-items:start}
.st .st-tside{position:sticky;top:104px}
.st .st-tbook{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:24px;position:relative;overflow:hidden}
.st .st-tbook::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--terra),var(--lemon))}
.st .st-tbook__price{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.st .st-tbook__price b{font-family:var(--serif);font-weight:700;font-size:34px}
.st .st-tbook__price s{color:var(--ink-faint);font-size:16px}
.st .st-tbook__price em{font-style:normal;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-tbook__rate{font-size:13px;font-weight:700;margin-bottom:14px}
.st .st-tbook__rate .st-stars{color:var(--lemon-deep)}
.st .st-tbook__rate .st-rn{color:var(--ink-faint);font-weight:500}
.st .st-tbook ul{list-style:none;display:grid;gap:8px;font-size:13px;color:var(--ink-soft);margin-bottom:16px}
.st .st-tbook li{padding-left:23px;position:relative}
.st .st-tbook li::before{content:"";position:absolute;left:0;top:3px;width:15px;height:15px;border-radius:50%;background:var(--sea-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23075e6f" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>') center/8px no-repeat}
.st .st-tbook .st-btn{width:100%;margin-bottom:10px}
.st .st-tbook__alt{display:block;text-align:center;font-size:12.5px;font-weight:700;color:var(--sea-deep)}
.st .st-tbook__note{font-size:11px;color:var(--ink-faint);text-align:center;margin-top:10px}

/* honest alert */
.st .st-halert{display:flex;gap:14px;background:var(--lemon-tint);border:1px solid rgba(199,143,27,.35);border-left:4px solid var(--lemon-deep);border-radius:var(--r-md);padding:16px 18px;font-size:13.5px;color:var(--ink-soft)}
.st .st-halert b{color:var(--ink)}
.st .st-halert .st-hicon{flex:none;font-family:var(--serif);font-style:italic;font-weight:700;color:var(--lemon-deep)}

/* includes / not included */
.st .st-inc{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.st .st-inc h3{font-size:17px;margin-bottom:12px}
.st .st-inc ul{list-style:none;display:grid;gap:9px;font-size:14px;color:var(--ink-soft)}
.st .st-inc li{padding-left:25px;position:relative}
.st .st-inc .st-inc-y li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--sea-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23075e6f" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>') center/9px no-repeat}
.st .st-inc .st-inc-n li::before{content:"";position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:var(--terra-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23e2603c" stroke-width="3.4" stroke-linecap="round"><path d="M18 6L6 18M6 6l12 12"/></svg>') center/9px no-repeat}

/* how it works — day timeline */
.st .st-hiw{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:hiw}
.st .st-hiw__step{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh-1);position:relative;counter-increment:hiw}
.st .st-hiw__step::before{content:counter(hiw,decimal-leading-zero);font-family:var(--serif);font-style:italic;font-weight:700;font-size:26px;color:var(--terra);display:block;margin-bottom:8px}
.st .st-hiw__step b{display:block;font-size:14.5px;margin-bottom:4px}
.st .st-hiw__step span{font-size:12.5px;color:var(--ink-soft);line-height:1.5}
.st .st-hiw__step .st-time{position:absolute;top:18px;right:16px;font-size:10px;letter-spacing:.1em;font-weight:700;color:var(--sea-deep);background:var(--sea-tint);border-radius:999px;padding:4px 9px}

/* reviews */
.st .st-revhead{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;margin-bottom:28px}
.st .st-revscore{text-align:center;background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-1);padding:22px 30px}
.st .st-revscore b{font-family:var(--serif);font-weight:700;font-size:44px;line-height:1;display:block}
.st .st-revscore .st-stars{color:var(--lemon-deep);letter-spacing:2px}
.st .st-revscore span{display:block;font-size:12px;color:var(--ink-faint);margin-top:4px}
.st .st-revbars{display:grid;gap:10px;max-width:420px}
.st .st-revbar{display:grid;grid-template-columns:120px 1fr 36px;gap:12px;align-items:center;font-size:12.5px;color:var(--ink-soft)}
.st .st-revbar i{font-style:normal;height:7px;border-radius:999px;background:var(--sand);position:relative;overflow:hidden;display:block}
.st .st-revbar i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w,80%);background:linear-gradient(90deg,var(--sea),var(--lemon));border-radius:999px}
.st .st-revbar b{font-weight:700;color:var(--ink)}
.st .st-revs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.st .st-rev{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh-1);display:flex;flex-direction:column}
.st .st-rev__stars{color:var(--lemon-deep);font-size:13px;letter-spacing:2px;margin-bottom:9px}
.st .st-rev p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;flex:1}
.st .st-rev p::before{content:"“";font-family:var(--serif);font-size:26px;color:var(--terra);line-height:0;margin-right:3px}
.st .st-rev__who{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:12px;color:var(--ink-faint)}
.st .st-rev__who i{font-style:normal;width:30px;height:30px;border-radius:50%;background:var(--sea-tint);color:var(--sea-deep);display:flex;align-items:center;justify-content:center;font-weight:700}
.st .st-rev__who b{color:var(--ink)}

/* gallery row */
.st .st-gal{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.st .st-gal .st-plate{aspect-ratio:1/1;border-radius:var(--r-md)}

/* field notes prose */
.st .st-notes{max-width:780px}
.st .st-notes p{font-size:16px;color:var(--ink-soft);line-height:1.75;margin-bottom:18px}
.st .st-notes p:first-of-type::first-letter{font-family:var(--serif);font-style:italic;font-weight:700;font-size:52px;float:left;line-height:.8;margin:6px 10px 0 0;color:var(--terra)}
.st .st-notes p b,.st .st-notes p strong{color:var(--ink)}

/* hero booking panel — price + book inside page hero */
.st .st-phero__grid{display:grid;grid-template-columns:minmax(0,7.4fr) minmax(0,4.6fr);gap:44px;align-items:center}
.st .st-hbook{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-2);padding:22px 24px;position:relative;overflow:hidden}
.st .st-hbook::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--terra),var(--lemon))}
.st .st-hbook__price{display:flex;align-items:baseline;gap:10px}
.st .st-hbook__price b{font-family:var(--serif);font-weight:700;font-size:34px}
.st .st-hbook__price s{color:var(--ink-faint);font-size:16px}
.st .st-hbook__price em{font-style:normal;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink-faint)}
.st .st-hbook__rate{font-size:13px;font-weight:700;margin:2px 0 12px}
.st .st-hbook__rate .st-stars{color:var(--lemon-deep)}
.st .st-hbook__rate .st-rn{color:var(--ink-faint);font-weight:500}
.st .st-hbook ul{list-style:none;display:grid;gap:7px;font-size:12.5px;color:var(--ink-soft);margin-bottom:14px}
.st .st-hbook li{padding-left:21px;position:relative}
.st .st-hbook li::before{content:"";position:absolute;left:0;top:3px;width:14px;height:14px;border-radius:50%;background:var(--sea-tint) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23075e6f" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>') center/8px no-repeat}
.st .st-hbook .st-btn{width:100%;margin-bottom:9px;padding:14px 20px}
.st .st-hbook__links{display:flex;justify-content:center;gap:16px;font-size:12px;font-weight:700}
.st .st-hbook__links a{color:var(--sea-deep);border-bottom:1.5px dashed rgba(7,94,111,.4)}
.st .st-hbook__links a:hover{color:var(--terra);border-color:var(--terra)}
.st .st-hbook__note{font-size:10.5px;color:var(--ink-faint);text-align:center;margin-top:9px}

/* micro-fact tiles ("good to know" density) */
.st .st-micro{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.st .st-micro__tile{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 20px 19px;box-shadow:var(--sh-1);font-size:12.5px;color:var(--ink-soft);line-height:1.55;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.st .st-micro__tile:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.st .st-micro__tile b{display:block;font-family:var(--serif);font-weight:700;font-size:15px;color:var(--ink);margin:0 0 7px}
.st .st-micro__tile i{font-style:normal;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50% 50% 50% 8px;background:var(--sea-tint);border:1px solid rgba(12,116,137,.16);font-size:18px;margin-bottom:14px}

/* sea temperature / month strip */
.st .st-seatemp{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.st .st-seatemp__m{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 8px;text-align:center;box-shadow:var(--sh-1);position:relative;overflow:hidden}
.st .st-seatemp__m::before{content:"";position:absolute;bottom:0;left:0;right:0;height:var(--h,30%);background:linear-gradient(180deg,rgba(12,116,137,.12),rgba(12,116,137,.22));z-index:0}
.st .st-seatemp__m>*{position:relative}
.st .st-seatemp__m b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.st .st-seatemp__m i{font-style:normal;display:block;font-family:var(--serif);font-weight:700;font-size:19px;color:var(--sea-deep);margin:4px 0 2px}
.st .st-seatemp__m span{font-size:10px;font-weight:700;color:var(--ink-soft)}
.st .st-seatemp__m.st-best{border-color:var(--lemon);outline:2px solid rgba(244,185,66,.35)}

/* vibe pills (hub) */
.st .st-vibes{display:flex;flex-wrap:wrap;gap:9px}
.st .st-vibe{font-size:13px;font-weight:700;padding:10px 17px;border-radius:999px;border:1.5px solid var(--line-strong);background:var(--white);color:var(--ink-soft);box-shadow:var(--sh-1);transition:.25s var(--ease)}
.st .st-vibe:hover{border-color:var(--terra);color:var(--terra);transform:translateY(-2px)}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .st .st-hubs{grid-template-columns:repeat(2,1fr)}
  .st .st-tours{grid-template-columns:repeat(2,1fr)}
  .st .st-stats{grid-template-columns:repeat(2,1fr)}
  .st .st-widgetgrid{grid-template-columns:1fr!important}
}
@media(max-width:960px){
  .st .st-phero__grid{grid-template-columns:1fr;gap:28px}
  .st .st-micro{grid-template-columns:repeat(2,1fr)!important}
  .st .st-seatemp{grid-template-columns:repeat(4,1fr)!important}
  .st .st-tgrid{grid-template-columns:1fr}
  .st .st-tside{position:static}
  .st .st-collage{grid-template-columns:1fr 1fr;grid-template-rows:auto;height:auto}
  .st .st-collage .st-plate{aspect-ratio:16/10}
  .st .st-collage .st-plate:first-child{grid-column:1/3;grid-row:auto}
  .st .st-hiw{grid-template-columns:repeat(2,1fr)}
  .st .st-revs{grid-template-columns:1fr}
  .st .st-revhead{grid-template-columns:1fr;gap:20px}
  .st .st-inc{grid-template-columns:1fr}
  .st .st-gal{grid-template-columns:repeat(2,1fr)}
  .st .st-phero{padding-top:118px}
  .st .st-hero{padding:118px 0 0;min-height:0}
  .st .st-hero__grid{grid-template-columns:1fr;gap:34px;align-items:start;padding-bottom:34px}
  .st .st-cue{display:none}
  .st .st-dockbar{margin-top:10px}
  .st .st-dockbar__tiles{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:14px 0}
  .st .st-dockbar__tiles::-webkit-scrollbar{display:none}
  .st .st-dtile{flex:0 0 auto;min-width:128px}
  .st .st-boat{display:none}
  .st .st-subnav{top:57px}
  .st .st-stats{grid-template-columns:1fr 1fr}
  .st .st-match{padding:28px 22px 26px}
  .st .st-mres.st-on{flex-direction:column;align-items:flex-start}
  .st .st-mres__img{width:100%;aspect-ratio:16/8}
  .st .st-subnav{top:57px}
  .st .st-totop{right:12px;bottom:82px;width:44px;height:44px}
  .st .st-ways{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto;margin-bottom:44px}
  .st .st-feature{grid-template-columns:1fr;gap:38px}
  .st .st-feature--flip .st-feature__media{order:0}
  .st .st-knows{grid-template-columns:repeat(2,1fr)}
  .st .st-tiers{grid-template-columns:1fr;max-width:540px;margin-left:auto;margin-right:auto}
  .st .st-seasons{grid-template-columns:repeat(2,1fr)}
  .st .st-days{grid-template-columns:1fr}
  .st .st-cruise{grid-template-columns:1fr;gap:20px}
  .st .st-nav__links{display:none}
  .st .st-nav__links.st-open{display:flex;position:absolute;top:100%;left:0;right:0;height:calc(100dvh - 66px);background:linear-gradient(170deg,var(--paper) 62%,var(--sea-tint));flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:30px 28px;overflow:auto;border-top:1px solid var(--line);box-shadow:0 30px 60px rgba(15,39,51,.18)}
  .st .st-nav__links.st-open::before{content:"Where to?";font-family:var(--serif);font-style:italic;font-size:15px;color:var(--terra);letter-spacing:.04em;margin-bottom:14px}
  .st .st-nav__links.st-open li{width:100%;max-width:340px;text-align:center}
  .st .st-nav__links.st-open a{display:block;font-family:var(--serif);font-size:23px;font-weight:600;color:var(--ink);padding:11px 0;border-bottom:1px solid var(--line)}
  .st .st-nav__links.st-open a:hover{color:var(--terra)}
  .st .st-nav__cta{display:none}
  .st .st-nav__burger{display:block}
  /* menu open: force solid bar + burger becomes an X */
  .st .st-nav.st-menuopen{background:var(--paper);backdrop-filter:blur(14px);border-bottom-color:var(--line)}
  .st .st-nav.st-menuopen .st-brand__name{color:var(--ink)}
  .st .st-nav.st-menuopen .st-brand__sub{color:var(--ink-faint)}
  .st .st-nav.st-menuopen .st-nav__burger span{background:transparent}
  .st .st-nav.st-menuopen .st-nav__burger span::before{top:0;transform:rotate(45deg);background:var(--ink)}
  .st .st-nav.st-menuopen .st-nav__burger span::after{top:0;transform:rotate(-45deg);background:var(--ink)}
  .st .st-footer__cols{grid-template-columns:1fr 1fr}
  .st .st-route__stops{flex-wrap:wrap;gap:16px}
  .st .st-stop{flex:1 1 26%}
  .st .st-route__line{display:none}
  .st .st-stop::before{position:static;display:block;margin:0 auto 8px;transform:none}
  .st .st-sort{margin-left:0;width:100%}
}
@media(max-width:640px){
  .st .st-sec{padding:60px 0}
  .st .st-hubs{grid-template-columns:1fr}
  .st .st-tours{grid-template-columns:1fr}
  .st .st-knows{grid-template-columns:1fr}
  .st .st-seasons{grid-template-columns:1fr}
  .st .st-steps{grid-template-columns:1fr}
  .st .st-stats{grid-template-columns:1fr}
  .st .st-hero__ctas .st-btn{width:100%}
  .st .st-sticky__meta{display:none}
  .st .st-sticky__title{font-size:13.5px}
  .st .st-table{min-width:760px}
  .st .st-dcard__top{flex-direction:column;gap:4px}
  .st .st-dcard__price{text-align:left}
  .st .st-dcard__ctas .st-btn{width:100%}

  /* Month/temperature strip: at phone widths 4–8 equal columns collapse to
     ~32–80px each and the labels get clipped. Turn it into a horizontal
     scroll strip (same pattern as .st-dockbar__tiles above) so every month
     stays legible and the user swipes instead of squinting. */
  .st .st-seatemp{display:flex!important;grid-template-columns:none!important;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;margin:0 -20px;padding:2px 20px 10px}
  .st .st-seatemp::-webkit-scrollbar{display:none}
  .st .st-seatemp__m{flex:0 0 auto;min-width:78px;scroll-snap-align:start}

  /* Fact tiles: two 156px columns still squeeze a serif heading + sentence.
     One per row below 560 reads properly. */
  .st .st-micro{grid-template-columns:1fr!important}

  /* Review histogram: the 120px label column eats a third of a 325px row. */
  .st .st-revbar{grid-template-columns:84px 1fr 30px!important;gap:8px}
}

/* Long unbroken words (common in the IT/ES copy) pushing past card edges. */
.st .st-micro__tile,.st .st-minitour b,.st .st-minitour small,
.st .st-tour h3,.st .st-scamp,.st .st-tier li{overflow-wrap:anywhere}

/* while the mobile menu is open: hide floating UI so nothing overlaps */
body.st-uihide .st-sticky{display:none!important}
body.st-uihide .st-totop{display:none!important}
body.st-uihide .st-subnav{display:none!important}

/* Kadence belt-and-suspenders */
#masthead,.site-header,#colophon,.site-footer{display:none!important}

/* sortable comparison table headers */
.st .st-table th.st-th-sort{cursor:pointer;user-select:none;white-space:nowrap;transition:color .15s}
.st .st-table th.st-th-sort:hover{color:var(--ink)}
.st .st-table th.st-th-sort::after{content:"\2195";margin-left:6px;opacity:.4;font-size:11px}
.st .st-table th.st-th-sort.st-asc::after{content:"\2191";opacity:1;color:var(--sea-deep)}
.st .st-table th.st-th-sort.st-desc::after{content:"\2193";opacity:1;color:var(--sea-deep)}

/* ---------- LCP: hero h1 slides in without ever being transparent ----------
   The h1 is the homepage LCP element. st-enter starts at opacity:0 and, with
   `backwards` fill, applies that before the .16s delay elapses — so the browser
   had no contentful paint to record until the reveal finished (~1s of LCP).
   Override the animation-NAME only: the h1 keeps st-enter's duration, easing,
   delay (.16s from .st-a2) and stagger position, but runs a transform-only
   keyframe. Text paints at opacity 1 immediately; LCP fires on that paint even
   while the element is still mid-translate. Motion preserved, delay gone.
   Specificity 0,3,1 beats .st .st-hero .st-anim (0,3,0), so this wins on
   specificity as well as source order. prefers-reduced-motion is still honoured
   by the global `animation:none!important` rule near the top of this file. */
@keyframes st-enter-move{from{transform:translateY(26px)}to{transform:none}}
.st .st-hero h1.st-anim{animation-name:st-enter-move}

/* ---------- NAV DROPDOWNS + LANGUAGE SWITCHER (v6) ----------
   Replaces the v5 flat row (7 links + CTA) and the v5 two-pill language
   switcher. The row is now:

     [brand]  Destinations ▾   Guides ▾   [All Tours]   [🇬🇧 English ▾]

   WHY THIS FITS — arithmetic at the tightest desktop width, 961px.
   .st-nav__inner is max-width 1240 with 24px side padding, so at a 961px
   viewport the usable row is 961 - 48 = 913px, and .st-nav__inner's gap is
   24px between each of its 4 visible children (burger is display:none here).

   The v5 row measured, at 13.5px/600 Figtree:
     brand 221 + 24 + links 530 + 24 + CTA 103 = 902 of 913  → 11px of slack.
   The 530 was 7 labels (62 characters) + 6 x 16px gaps = 434 + 96, i.e. the
   labels ran at 434/62 = 7.0px per character. That constant is what the new
   widths below are derived from — same font, same size, same weight.

     Destinations  12 chars x 7.0 = 84 + caret 9 + gap 5 + padding 20 = 118
     Guides         6 chars x 7.0 = 42 + caret 9 + gap 5 + padding 20 =  76
     .st-nav__links = 118 + gap 16 + 76                               = 210
     lang trigger   flag 16 + gap 6 + "English" 7 x 6.5 (12.5px) 46
                    + gap 5 + caret 9 + padding 20 + border 2         = 104

     brand 221 + links 210 + CTA 103 + lang 104 + 3 gaps x 24 = 710 of 913
                                                      → 203px of slack.

   Two submenus are 320px narrower than the seven links they replace, which
   is what pays for the switcher. "All Tours" survives at every width >= 961px
   with room to spare, so v5's 1080px and 1179px concession breakpoints are
   deleted rather than re-tuned. Below 960px the burger is unchanged and the
   CTA is still hidden by the existing rule in the 960px block above.

   Panels are position:absolute and the triggers are shorter than the 42px
   brand mark that sets the bar height, so nothing here reflows the nav: CLS 0.

   ADDING A LANGUAGE: append one <li> to .st-lang__panel. Nothing here is
   hard-coded to two languages. */

/* ── dropdown triggers (Destinations / Guides) ── */
.st .st-dd{position:relative}
.st .st-dd__btn{display:flex;align-items:center;gap:5px;padding:8px 10px;background:none;border:0;border-radius:999px;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;cursor:pointer;transition:color .3s}
.st .st-dd__btn:hover,.st .st-dd__btn[aria-expanded="true"]{color:var(--sea-deep)}
.st .st-dd__car{width:9px;height:6px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--ease)}
.st .st-dd__btn[aria-expanded="true"] .st-dd__car{transform:rotate(180deg)}

/* ── dropdown panels ── */
.st .st-dd__panel{display:none;position:absolute;top:calc(100% + 12px);left:0;z-index:90;min-width:296px;padding:8px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.st .st-dd__panel.st-open{display:block}
.st .st-dd__panel ul{list-style:none;margin:0;padding:0}
.st .st-nav__links .st-dd__panel a{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:9px 12px;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--ink-soft);transition:background .2s,color .2s}
.st .st-nav__links .st-dd__panel a:hover{background:var(--sea-tint);color:var(--sea-deep)}
.st .st-dd__p{flex:none;font-size:11.5px;font-weight:700;color:var(--ink-faint);letter-spacing:.02em}
.st .st-nav__links .st-dd__panel a:hover .st-dd__p{color:var(--sea-deep)}

/* ── language switcher ── */
.st .st-lang{position:relative;flex:none}
.st .st-lang__btn{display:flex;align-items:center;gap:6px;padding:6px 10px;background:none;border:1px solid var(--line);border-radius:999px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;cursor:pointer;transition:color .3s,border-color .3s}
.st .st-lang__btn:hover{color:var(--sea-deep);border-color:var(--line-cool)}
/* Tiny inline SVG, never an emoji flag: Windows ships no flag glyphs, so
   🇬🇧 degrades to the letters "GB" for a large share of visitors. */
.st .st-flag{width:16px;height:11px;flex:none;border-radius:2px;box-shadow:0 0 0 1px rgba(15,39,51,.16)}
.st .st-lang__panel{display:none;position:absolute;top:calc(100% + 12px);right:0;z-index:90;min-width:184px;padding:8px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.st .st-lang__panel.st-open{display:block}
.st .st-lang__panel ul{list-style:none;margin:0;padding:0}
.st .st-lang__opt{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;font-size:13px;font-weight:600;color:var(--ink-soft);transition:background .2s,color .2s}
.st .st-lang__opt:hover{background:var(--sea-tint);color:var(--sea-deep)}
/* A language whose twin of THIS page does not exist yet: shown, greyed, inert.
   Never a link — a /it/ URL that 404s is worse than no switcher at all. */
.st .st-lang__opt.st-off,.st .st-lang__opt.st-off:hover{background:none;color:var(--ink-faint);cursor:default}
.st .st-lang__opt.st-off .st-flag{opacity:.45}
.st .st-lang__soon{margin-left:auto;padding-left:10px;font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}

/* ── transparent-over-hero: triggers go white, panels stay on paper ── */
.st .st-nav.st-over .st-dd__btn{color:rgba(255,255,255,.85)}
.st .st-nav.st-over .st-dd__btn:hover,.st .st-nav.st-over .st-dd__btn[aria-expanded="true"]{color:var(--lemon)}
.st .st-nav.st-over .st-lang__btn{color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.3)}
.st .st-nav.st-over .st-lang__btn:hover{color:var(--lemon);border-color:rgba(255,255,255,.55)}
/* The panel keeps its paper surface over the hero, so its links must not take
   the white from `.st .st-nav.st-over .st-nav__links a` (0,4,1). These are
   (0,5,1) and win on specificity, not source order. */
.st .st-nav.st-over .st-nav__links .st-dd__panel a{color:var(--ink-soft)}
.st .st-nav.st-over .st-nav__links .st-dd__panel a:hover{color:var(--sea-deep)}

/* ── burger open: the bar is solid paper again, so the triggers are ink.
   Same specificity as the .st-over rules above (0,4,0) — these win by coming
   later, which is the same trick v5 used for the pills. ── */
.st .st-nav.st-menuopen .st-dd__btn{color:var(--ink)}
.st .st-nav.st-menuopen .st-lang__btn{color:var(--ink-soft);border-color:var(--line)}

@media(max-width:960px){
  /* Inside the burger sheet the panels are expandable sections, not floating
     overlays: position:static so they push the sheet's own scroll instead of
     covering it. The sheet is an overlay, so this still costs 0 CLS. */
  .st .st-nav__links.st-open .st-dd{width:100%}
  .st .st-nav__links.st-open .st-dd__btn{width:100%;justify-content:center;padding:11px 0;border-radius:0;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:23px;font-weight:600;color:var(--ink)}
  .st .st-nav__links.st-open .st-dd__btn:hover,.st .st-nav__links.st-open .st-dd__btn[aria-expanded="true"]{color:var(--terra)}
  .st .st-nav__links.st-open .st-dd__car{width:12px;height:8px}
  .st .st-nav__links.st-open .st-dd__panel{position:static;min-width:0;padding:4px 0 12px;background:none;border:0;box-shadow:none}
  .st .st-nav__links.st-open .st-dd__panel li{max-width:none;text-align:left}
  /* beats `.st .st-nav__links.st-open a` (0,3,1) at (0,4,1) */
  .st .st-nav__links.st-open .st-dd__panel a{font-family:var(--sans);font-size:15px;font-weight:600;color:var(--ink-soft);padding:8px 10px;border-bottom:0}
  .st .st-nav__links.st-open .st-dd__panel a:hover{background:none;color:var(--terra)}
}
@media(max-width:640px){
  /* At 360px the bar has 312px: brand 221 + burger 42 + 2 gaps 48 = 311. The
     switcher cannot stay in it, so it moves into the open sheet — v5's rule,
     kept, because the burger JS and z-order already depend on this shape. */
  .st .st-nav__inner .st-lang{display:none}
  .st .st-nav.st-menuopen .st-lang{display:flex;justify-content:center;position:absolute;top:calc(100% + 20px);left:0;right:0}
  .st .st-nav.st-menuopen .st-lang__btn{font-size:14px;padding:8px 14px}
  .st .st-nav.st-menuopen .st-lang__panel{left:50%;right:auto;transform:translateX(-50%)}
}

/* ═══════════════════════════════════════════════════════════════
   v7 — back-to-top vs booking bar · sticky row · burger · panel links
   ═══════════════════════════════════════════════════════════════ */

/* ── BUG 1: the back-to-top button can no longer sit under the booking bar ──
   The old geometry was two hard-coded guesses about how tall .st-sticky would
   turn out to be: .st-totop{bottom:90px}, and 82px at <=960. Nothing enforced
   either number. .st-sticky is auto-height — 11px padding x2 plus whatever the
   title wraps to — so a long title grows the bar past the guess, and at
   z-index 85 vs 84 it paints straight over the button. The Italian title wraps
   to four lines and exposed it; any long title in any language does the same.

   The offset is now DERIVED from the bar's measured height, not guessed:
   st-main.js writes --st-sticky-h (= sticky.offsetHeight) onto <html> from
   remeasure() — on load, on resize/rotate, and once the webfont settles. Those
   are the only moments the height can change, because the bar's content is
   static markup, so this costs no per-scroll layout reads.

   The class does the switching, because the bar only *occupies* the bottom of
   the screen when it carries .st-show: body.st-stickyon is toggled from the
   very same scroll handler. With the bar hidden (top of page, or parked near
   the footer) the button drops back to its own 18px margin instead of floating
   above an empty strip.

   Degradation: with JS off, --st-sticky-h is unset and .st-stickyon is never
   added, so the button stays at bottom:18px — and the bar stays translateY(112%)
   off-screen, since .st-show is JS-driven too. They cannot collide.

   body.st-uihide (mobile menu open) already display:none's BOTH the bar and the
   button, so that path is untouched by any of this. */
.st .st-totop{bottom:18px}
body.st-stickyon .st-totop{bottom:calc(var(--st-sticky-h,72px) + 14px)}

/* ── BUG 2: the sticky bar stays one tidy row ──
   .st-sticky__inner is a flex row of [text][price][CTA]. The text block had no
   flex/min-width, so with min-width:auto it refused to shrink below its content
   and squeezed the price and CTA; the title had no cap on its line count.

   - the text block shrinks (min-width:0 defeats the automatic minimum size)
   - the title is clamped to 2 lines, so the bar's height is bounded by design
     and not just by whatever copy someone pastes in
   - price and CTA are flex:none — they are never the thing that gives way
   - the CTA cannot wrap and holds a 44px tap target

   -webkit-line-clamp + display:-webkit-box is the standard-in-practice tool:
   prefixed, but shipped in every engine (Chrome/Edge, Safari, Firefox 68+).
   The unprefixed line-clamp is included for engines that have moved on. In an
   engine supporting neither, the title simply wraps as it does today and the
   Bug 1 mechanism above still keeps the button clear of the bar. */
.st .st-sticky__inner{gap:14px}
.st .st-sticky__inner>div:first-child{flex:1 1 auto;min-width:0}
.st .st-sticky__title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.st .st-sticky__meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st .st-sticky__price{flex:none}
.st .st-sticky .st-btn{flex:none;white-space:nowrap;min-height:44px}
@media(max-width:640px){
  .st .st-sticky .st-btn{padding:12px 18px}
}

/* ── BUG 3: the burger reads as a button ──
   REAL CAUSE — it is not the cascade collision with line 167 that it looks
   like. Lines 902-904 (.st-menuopen) and line 167 (.st-over) tie on specificity
   (0,4,2 for the pseudo-elements, 0,4,1 for the span) and 902-904 come later,
   so the menu-open X wins the background and IS painted var(--ink) on paper.
   That was verified before touching anything.

   The bug is geometry. Line 178 sets left:10px;right:10px on the span AND on
   span::before/::after in one rule. The span is position:absolute, which makes
   it the containing block for its own pseudo-elements — and the span is only
   42-10-10 = 22px wide. So the pseudo-elements resolve left:10px;right:10px
   against that 22px box and come out 22-10-10 = 2px wide, by 2px tall: two
   dots, not two bars. Closed, the burger is one real 22px bar with a 2x2 dot
   floating 7px above and below it — exactly the "loose symbols" report. Open,
   the span goes transparent and both dots stack at top:0 under opposite
   rotations, landing on the same spot: one faint dot where the X should be,
   exactly the screenshot. The white-on-paper theory would have made the whole
   X vanish; a single dot is the signature of the containing-block bug.

   Fix the geometry at the source — the bars span the full width of the span. */
.st .st-nav__burger span::before,.st .st-nav__burger span::after{left:0;right:0}

/* ...then give it an affordance. 42x42 and box-sizing:border-box are inherited
   from line 177 / line 46, so the border is drawn inside the existing box: the
   tap target stays 42px and nothing changes size. `display` is deliberately NOT
   set here — line 897 (display:block at <=960) is earlier in the file at equal
   specificity, and restating it here would strip the burger's desktop
   display:none. */
.st .st-nav__burger{background:var(--white);border:1.5px solid var(--line);border-radius:12px;box-shadow:var(--sh-1);transition:background .25s,border-color .25s,box-shadow .25s}
.st .st-nav__burger:hover{border-color:var(--sea);box-shadow:var(--sh-2)}
/* Over the hero the pill must be glass, not paper: line 167 forces the bars to
   #fff there, and white bars on a white pill would be invisible — the collision
   the owner suspected, which only becomes real once the pill exists. */
.st .st-nav.st-over .st-nav__burger{background:rgba(15,39,51,.38);border-color:rgba(255,255,255,.55);box-shadow:none;backdrop-filter:blur(6px)}
/* Menu open the bar is solid paper again and the X is ink (902-904), so the
   pill goes back to paper. Same specificity (0,3,0) as the st-over rule above
   and placed after it, so when a menu is opened at the top of a hero page and
   both classes are on the nav, this one wins — the same ordering trick used by
   the .st-menuopen dropdown rules further up. */
.st .st-nav.st-menuopen .st-nav__burger{background:var(--white);border-color:var(--line);box-shadow:var(--sh-1);backdrop-filter:none}
/* `.st :focus-visible` already rings it in --sea; teal on a dark hero photo is
   weak, so the over-hero ring is lemon. (0,5,0) beats the global (0,2,0). */
.st .st-nav.st-over .st-nav__burger:focus-visible{outline-color:var(--lemon)}

/* ── ADDITION 4: homepage-anchor footer row inside each dropdown panel ──
   A second <ul> after the panel's main list, ruled off from it. These are
   "/#id", never "#id": off the homepage a bare "#id" is a dead link.
   st-main.js only smooth-scrolls a "/#id" when it is actually on the homepage,
   so everywhere else the browser just navigates.

   Desktop panels are position:absolute and the mobile sheet is an overlay, so
   two extra rows reflow nothing: CLS stays 0.

   In the burger sheet, `.st .st-nav__links.st-open .st-dd__panel a` (0,4,1)
   deliberately still wins the type here, so these read as ordinary sheet rows
   with the separator above them. */
.st .st-dd__more{margin-top:6px;padding-top:6px;border-top:1px solid var(--line)}
.st .st-nav.st-over .st-nav__links .st-dd__more a,
.st .st-nav__links .st-dd__more a{font-size:12.5px;font-weight:700;color:var(--sea-deep)}
.st .st-nav__links .st-dd__more a:hover{background:var(--sea-tint);color:var(--sea-deep)}

/* ═══════════════════════════════════════════════════════════════
   GDPR cookie-consent banner (Google Consent Mode v2)
   Injected by st-main.js on first visit, inside a .st wrapper so the palette
   tokens resolve. position:fixed → it OVERLAYS content and never reflows the
   document, so CLS stays 0 even though a deferred script mounts it after first
   paint. z-index 95 clears the booking bar (85) and back-to-top (84); once a
   choice is made the banner removes itself and the booking bar owns the bottom
   again. Buttons are real <button>s (focusable, keyboard-operable via the global
   :focus-visible ring); the only ways to dismiss it are Accept or Reject.
   The global `.st *` prefers-reduced-motion rule (top of file) zeroes the
   slide-in animation — fine here, since the banner's resting state is already
   fully visible; the keyframe only enhances.
   ═══════════════════════════════════════════════════════════════ */
.st .st-consent{position:fixed;left:0;right:0;bottom:0;z-index:95;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 22px;padding:14px 20px;background:rgba(15,39,51,.97);backdrop-filter:blur(10px);border-top:1px solid rgba(244,185,66,.42);box-shadow:0 -10px 34px rgba(15,39,51,.22);color:#dcebee;animation:st-consent-in .4s var(--ease)}
@keyframes st-consent-in{from{transform:translateY(100%)}to{transform:none}}
.st .st-consent__txt{flex:1 1 380px;min-width:0;margin:0;font-size:13px;line-height:1.5;color:#cde0e6}
.st .st-consent__link{color:var(--lemon);font-weight:700;border-bottom:1px solid rgba(244,185,66,.45)}
.st .st-consent__link:hover{color:#f8c96a;border-bottom-color:#f8c96a}
.st .st-consent__btns{display:flex;gap:10px;flex:none}
.st .st-consent__btn{font-family:inherit;font-weight:700;font-size:13px;padding:10px 20px;border-radius:999px;border:1.5px solid transparent;transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s}
.st .st-consent__btn--yes{background:var(--lemon);color:var(--ink)}
.st .st-consent__btn--yes:hover{background:#f8c96a;transform:translateY(-2px)}
.st .st-consent__btn--no{background:transparent;color:#cde0e6;border-color:rgba(255,255,255,.35)}
.st .st-consent__btn--no:hover{border-color:#fff;color:#fff}
/* Match the booking bar / back-to-top: hidden while the mobile menu sheet is open. */
body.st-uihide .st-consent{display:none!important}
@media(max-width:560px){.st .st-consent{gap:10px 14px}.st .st-consent__btns{flex:1 1 100%;justify-content:flex-end}}
