:root{
  /* Navy, white and amber (see DESIGN.md). Navy carries the brand, blue marks
     links and selected states, gold is reserved for the buttons that book.
     The blues all share the navy's hue so they read as one family.
     The older --green/--gold/--teal names are kept so every existing call
     site still resolves; only the values underneath changed. */
  --green:#2360B5;
  --green-dark:#1A4C92;
  --green-tint:#EEF3FA;
  --gold:#F3B94A;
  --on-dark:#FFFFFF;
  --on-dark-soft:#C5CCD6;
  --on-dark-faint:#8C97A6;
  --ink:#10233F;
  --ink-soft:#34455F;
  --muted:#5F6F86;
  --line:#DEE5EF;
  --bg:#F5F8FC;
  --surface:#FFFFFF;
  --white:#FFFFFF;
  --teal:#173B6C;
  --teal-dark:#0E2A4F;
  --teal-tint:#EEF3FA;
  --radius:14px;
  --radius-sm:10px;
  --shadow-sm:0 2px 10px rgba(16,35,63,.07);
  --shadow-md:0 14px 34px rgba(16,35,63,.13);
  --shadow-green:0 12px 26px -10px rgba(243,185,74,.9);
  --ease:cubic-bezier(.16,1,.3,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --ink-fixed:#0B2242;
  --accent:#2360B5;
  --accent-hover:#1A4C92;
  --signal:#2360B5;
  --icon-stroke:#2360B5;
  --cta:#F3B94A;
  --cta-hover:#F6C76B;
  --cta-press:#DFA436;
  --font-display:'Manrope','Segoe UI',system-ui,sans-serif;
  --font-body:'Source Sans 3','Segoe UI',system-ui,sans-serif;
  --font-mono:'Source Sans 3','Segoe UI',system-ui,sans-serif;
  color-scheme:light;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
/* a faint grain on the sand background — paper texture instead of a flat
   fill; white cards and panels sit on top of it untextured, by design,
   so the grain only ever shows through the sand "bands" between them */
body{font-family:var(--font-body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;transition:background-color .25s var(--ease),color .25s var(--ease)}
h1,h2,h3,.h2,.brand-text strong,.checkout-tracker-num,.checkout-step-num{font-family:var(--font-display)}
img,svg{display:block;max-width:100%}
a{color:var(--accent)}
a:hover{color:var(--accent-hover)}
h1,h2,h3{letter-spacing:-0.015em;text-wrap:balance}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
section[id]{scroll-margin-top:132px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.skip-link{position:absolute;left:-999px;top:auto;background:var(--ink-fixed);color:var(--on-dark);padding:12px 18px;border-radius:10px;z-index:2000}
.skip-link:focus{left:16px;top:16px}
svg[stroke="#0D5A3B"]{stroke:var(--icon-stroke)}

/* header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:100;background:color-mix(in srgb, var(--white) 92%, transparent);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .25s var(--ease),background-color .25s var(--ease)}
.site-header.scrolled{box-shadow:var(--shadow-sm)}
.header-inner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand-logo{height:38px;width:38px;object-fit:contain;display:block;flex-shrink:0;border-radius:10px;transition:background-color .25s var(--ease),padding .25s var(--ease)}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-text strong{font-weight:800;font-size:20px;letter-spacing:-0.01em}
.brand-text span{font-size:12.5px;color:var(--muted)}
.nav-toggle{position:absolute;opacity:0;pointer-events:none}
.nav-burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;cursor:pointer;flex-shrink:0}
.nav-burger:hover{background:var(--green-tint)}
.site-nav{display:flex;align-items:center;gap:28px}
/* Language picker and dark-mode toggle sit at the far right edge, past
   the nav links, matching the reference layout — reordered visually via
   flex order rather than moving them in the HTML, so the mobile burger
   menu's own structure (which relies on nav-toggle/nav-burger/nav-links
   staying adjacent) is untouched. */
.nav-links{order:1}
.lang-picker{order:2}

/* Any page with a full-bleed hero photo (homepage and every service/fleet
   detail page): the header floats transparently over the hero, absolutely
   positioned so the image runs behind it edge to edge, until the visitor
   scrolls past it, then it becomes the same solid sticky bar every other
   page already uses. Pages with no hero image keep the solid header always. */
body.page-hero-overlay .site-header{position:absolute;top:0;left:0;right:0;background:transparent;border-bottom-color:transparent;backdrop-filter:none}
body.page-hero-overlay .site-header.scrolled{position:fixed;background:color-mix(in srgb, var(--white) 92%, transparent);backdrop-filter:saturate(180%) blur(10px);border-bottom-color:var(--line)}
body.page-hero-overlay .site-header:not(.scrolled) .nav-links a:not(.btn){color:var(--on-dark)}
body.page-hero-overlay .site-header:not(.scrolled) .brand-text strong,
body.page-hero-overlay .site-header:not(.scrolled) .brand-text span{color:var(--on-dark)}
body.page-hero-overlay .site-header:not(.scrolled) .brand-logo{background:rgba(255,255,255,.92);padding:5px}
body.page-hero-overlay .site-header:not(.scrolled) .nav-burger svg path{stroke:#fff}
body.page-hero-overlay .site-header:not(.scrolled) .lang-picker-trigger{border-color:rgba(255,255,255,.4);color:var(--on-dark)}
body.page-hero-overlay .site-header:not(.scrolled) .lang-picker-trigger:hover{background:rgba(255,255,255,.16)}

.nav-links{display:flex;align-items:center;gap:28px;font-size:16px}
.nav-links a{text-decoration:none;font-weight:600;color:var(--ink);position:relative;padding:4px 0}
.nav-links a:not(.btn)::after{content:'';position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:var(--gold);transition:right .25s var(--ease)}
.nav-links a:not(.btn):hover::after{right:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;text-decoration:none;border-radius:10px;min-height:46px;box-sizing:border-box;border:0;transition:transform .2s var(--spring),box-shadow .2s var(--ease),background-color .15s var(--ease);cursor:pointer;font-family:inherit;font-size:16px}
.btn:hover{transform:scale(1.01)}
.btn:active{transform:scale(.98);transition-duration:.07s}
.btn-primary{background:var(--cta);color:var(--ink);padding:12px 22px}
.btn-primary:hover{background:var(--cta-hover);color:var(--ink);box-shadow:var(--shadow-green)}
.btn-primary:active{background:var(--cta-press)}
.btn-gold{background:var(--cta);color:var(--ink);padding:14px 24px;font-size:17px}
.btn-gold:hover{background:var(--cta-hover);color:var(--ink);box-shadow:var(--shadow-green)}
.btn-gold:active{background:var(--cta-press)}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);padding:12px 20px}
.btn-ghost:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
.btn-ghost:active{background:var(--green-tint)}
.btn-ghost-light{background:transparent;color:var(--on-dark);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);padding:12px 20px}
.btn-ghost-light:hover{color:var(--on-dark);box-shadow:inset 0 0 0 1.5px #FFFFFF;background:rgba(255,255,255,.08)}
.btn-ghost-light:active{background:rgba(255,255,255,.16)}
.btn-sm{min-height:38px;padding:9px 16px;font-size:14.5px}

/* hero — a full-bleed dusk-at-sea GRADIENT (no stock photography anywhere
   on the site, by design) used by the homepage and every service/fleet
   detail page; see body.page-hero-overlay above, which lets the header
   float transparently on top of it until scrolled. The section is a
   direct child of <main>, outside any .wrap, so the color always reaches
   both edges of the viewport; text content inside is capped to the
   site's normal .wrap width and left-aligned within it. .hero-scrim
   draws a thin horizon line with a soft brass "sun" glow low on it —
   the one recurring motif of the coastal palette — instead of a photo. */
.hero-section{position:relative}
.hero-scrim{display:none}
.hero-content{position:relative;z-index:2;display:flex;flex-direction:column;gap:20px;max-width:1180px;padding:130px 0 56px}
.eyebrow{display:block;color:var(--accent);font-size:13px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;width:fit-content}
.eyebrow-on-dark{color:var(--gold)}
.hero-h1-light{font-family:var(--font-display);font-size:48px;line-height:1.1;font-weight:800;letter-spacing:-.025em;color:var(--on-dark);max-width:760px}
.hero-lede-light{font-size:18.5px;line-height:1.55;color:rgba(255,255,255,.82);max-width:38em}
.page-hero{min-height:52vh;display:flex;align-items:flex-end;background:var(--teal-dark)}
.page-hero .hero-content{padding-top:176px;padding-bottom:64px;gap:18px}
.page-hero .hero-h1-light{font-size:44px}
.page-hero-crumb{font-size:13px;font-weight:600;color:rgba(255,255,255,.68)}
.page-hero-crumb a{color:rgba(255,255,255,.85);text-decoration:none}
.page-hero-crumb a:hover{text-decoration:underline}
@media (min-width:861px){.page-hero{min-height:max(52vh,440px)}}
@media (max-width:860px){.hero-photo{min-height:560px}.page-hero{min-height:480px}.page-hero .hero-content{padding-top:142px;padding-bottom:48px}.page-hero .hero-h1-light{font-size:32px}}
.hero-cta{display:flex;gap:24px;flex-wrap:wrap;align-items:center}
.link-cta{font-weight:700;font-size:15.5px;padding:12px 0;text-decoration:none;display:inline-flex;align-items:center;gap:6px;color:var(--ink-soft)}
.link-cta svg{transition:transform .2s var(--ease)}
.link-cta:hover svg{transform:translateX(4px)}
.link-cta:hover{color:var(--accent)}

/* front search bar */

.ticket{background:#fff;border:1px solid #DEE5EF;border-radius:14px;padding:8px;box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:0;box-sizing:border-box}
.calc-bar-fields{display:flex;align-items:stretch;min-height:80px}
.calc-field[hidden]{display:none}
.calc-seg{display:flex;align-items:center;gap:12px;padding:0 20px;min-width:0;box-sizing:border-box}
.calc-seg[data-seg="from"],.calc-seg[data-seg="to"]{flex:23 1 0}
.calc-seg[data-seg="date"]{flex:18 1 0}
.calc-seg-pax{flex:9 1 0;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px}
.calc-seg-icon{flex-shrink:0;color:var(--muted);display:flex}
.calc-seg-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto;cursor:pointer}
.calc-seg-label{font-size:12.5px;color:var(--muted);font-weight:600;line-height:1.2}
.calc-seg-select,.calc-seg-input,.calc-seg-date{border:none;background:none;padding:0;margin:0;font-family:inherit;font-size:15.5px;font-weight:700;color:var(--ink);width:100%;min-height:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;color-scheme:light}
.calc-seg-select{cursor:pointer}
.calc-seg-input{font-weight:500;cursor:text}
#fromPointInput{cursor:pointer}
.calc-seg-input::placeholder{color:var(--muted);font-weight:500}
.calc-seg-select:focus,.calc-seg-input:focus,.calc-seg-date:focus{outline:none}
.calc-seg-date{cursor:pointer;font-family:var(--font-mono)}
.calc-divider{width:1px;align-self:center;height:56%;background:#DEE5EF;flex-shrink:0}
/* the "ticket stub" perforation — a dashed tear between the trip details
   and the price-reveal button, with two notches punched to the hero's
   own teal background so the card reads like it's been torn from it */
.calc-seg-date::-webkit-calendar-picker-indicator{opacity:.45}
.calc-bar-submit{white-space:nowrap;padding:0 22px;align-self:stretch;height:auto;flex:13 1 0;border-radius:10px;margin:0;display:flex;align-items:center;justify-content:center;gap:8px}

.to-point-wrap{position:relative}
.to-point-panel{position:absolute;top:calc(100% + 14px);left:-20px;right:auto;width:320px;z-index:60;background:#fff;border:1px solid #DEE5EF;border-radius:10px;box-shadow:var(--shadow-md);padding:8px;max-height:320px;overflow-y:auto}
.to-point-panel[hidden]{display:none}
.to-point-panel-header{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted);padding:6px 10px}
.to-point-option{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;border-radius:10px;padding:10px;font-family:inherit;font-size:14.5px;font-weight:600;color:var(--ink);text-align:left;cursor:pointer}
.to-point-option:hover{background:#EEF3FA}
.to-point-option-icon{flex-shrink:0;width:28px;height:28px;border-radius:50%;background:#EEF3FA;color:var(--accent);display:flex;align-items:center;justify-content:center}
.to-point-empty{padding:14px 10px;font-size:13.5px;color:var(--muted)}
.calc-return-btn{display:flex;align-items:center;justify-content:center;gap:8px;flex:13 1 0;padding:0 16px;border:none;background:transparent;color:var(--ink);font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.calc-return-btn svg{color:var(--muted)}
.calc-return-btn[aria-pressed="true"]{color:var(--accent)}
.calc-return-btn[aria-pressed="true"] svg{transform:rotate(45deg);color:var(--accent)}
.calc-return-btn[hidden]{display:none}
.pax-stepper{display:flex;align-items:center;gap:14px;border:none;padding:0;min-height:0}
.pax-step-btn{width:22px;height:22px;border-radius:50%;border:1.5px solid #DEE5EF;background:#fff;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);font-weight:700;flex-shrink:0;padding:0}
.pax-step-btn:hover{border-color:#2360B5;color:var(--accent)}
.pax-step-btn:disabled{opacity:.35;cursor:not-allowed}
.pax-step-btn:disabled:hover{border-color:#DEE5EF;color:var(--ink)}
.pax-stepper-value{font-family:var(--font-mono);font-weight:700;font-size:15px;color:var(--ink);min-width:14px;text-align:center}
.hero-rating-stars{color:var(--gold);letter-spacing:1px;font-size:15px}

.field{display:flex;flex-direction:column;gap:6px;font-size:14.5px;font-weight:600}
.field select,.field input{font-family:inherit;font-size:16px;color:var(--ink-fixed);background:#fff;border:2px solid #fff;border-radius:10px;padding:10px 12px;min-height:44px;box-sizing:border-box;width:100%;color-scheme:light}
.field select:focus,.field input:focus{border-color:var(--gold)}
.field input:user-invalid{border-color:#D64545}
.field-err{font-size:13px;color:#FFD9D9;display:none}
.field.err .field-err{display:block}
.field.err select,.field.err input{border-color:#FF8A80}
.pax-row{display:flex;gap:8px;flex-wrap:wrap}
.pax-btn{min-width:44px;min-height:44px;border-radius:10px;border:2px solid rgba(255,255,255,.7);background:transparent;color:var(--on-dark);font-family:inherit;font-weight:700;font-size:17px;cursor:pointer;transition:border-color .15s var(--ease),background-color .15s var(--ease),color .15s var(--ease)}
.pax-btn:hover{border-color:var(--gold)}
.pax-btn.selected{border-color:var(--gold);background:var(--gold);color:var(--ink-fixed);font-weight:800}
.luggage-note{font-size:13.5px;color:var(--muted);line-height:1.4;display:none}
.luggage-note.show{display:block}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.check-row{display:flex;gap:20px;flex-wrap:wrap;font-size:14.5px}
.check-row label{display:flex;align-items:center;gap:9px;min-height:44px}
.check-row input[type=checkbox]{width:21px;height:21px;accent-color:var(--gold)}
.setup-warning{background:#FFF4D6;border:1px solid #E8C874;color:#5C4A0A;font-size:13.5px;line-height:1.5;padding:10px 14px;border-radius:10px;display:none}
.setup-warning.show{display:block}

/* essential-facts panel */
.facts-panel{display:flex;flex-direction:column;gap:24px}
.facts-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;padding-bottom:24px;border-bottom:1px solid var(--line)}
.facts-updated{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted);white-space:nowrap}
.facts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.facts-item{padding:20px 24px 20px 0;display:flex;flex-direction:column;gap:6px}
.facts-item:not(:nth-last-child(-n+3)){border-bottom:1px solid var(--line)}
.facts-item:nth-child(3n+1){padding-left:0}
.facts-item span{font-size:13.5px;color:var(--muted)}
.facts-item strong{font-size:16px;font-weight:700;color:var(--ink)}

/* generic sections */
.section{padding:80px 0}
.section-tight{padding:56px 0}
.section-alt{background:var(--surface)}
.section-dark{background:var(--teal-dark);color:var(--on-dark)}
.eyebrow-sm{color:var(--accent);font-size:13px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.h2{font-size:34px;line-height:1.15;font-weight:800;letter-spacing:-.02em;margin-top:8px}
.h2-light{color:var(--on-dark)}
.section-intro{display:flex;flex-direction:column;gap:10px;max-width:42em;margin-bottom:40px}
.lede{font-size:18px;line-height:1.55;color:var(--ink-soft)}
.lede-light{color:var(--on-dark-soft)}

/* entrance animation: CSS-only and self-completing, never depends on JS or scroll position */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.reveal{animation:fadeUp .35s var(--ease) both}
@media (prefers-reduced-motion:reduce){.reveal{animation:none;opacity:1;transform:none} html{scroll-behavior:auto}}

.icon-badge{width:52px;height:52px;border-radius:10px;background:var(--green-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}



/* two-col / photo */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.photo-frame{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);position:relative;background:var(--green-tint)}
.photo-frame img{width:100%;height:100%;object-fit:cover}

.fee-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:28px}
.fee-item{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.5;color:var(--ink-soft);background:var(--white);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.fee-item strong{color:var(--ink)}
.fee-item [data-price-night-surcharge],.fee-item [data-price-return-discount]{font-family:var(--font-mono);font-weight:700;color:var(--accent)}


/* occasions (weddings / schools / business) */
/* Service cards are always dark-surfaced, regardless of the site's own
   light/dark theme toggle — same deliberate exception as the booking bar
   staying always-white. Colors below are fixed, not theme variables. */
/* Service cards are icon + color, never a stock photo — a deliberate
   choice, not a placeholder. Always a fixed dark espresso surface
   regardless of the site's own light/dark toggle, same exception as the
   booking bar staying always-white. */
.occasion-card{background:#10233F;border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:16px;overflow:hidden;text-decoration:none;color:inherit;transition:border-color .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease)}
/* a service card with a photo behind it (script.js, service cards): the photo under a dark shade */
.occasion-card.has-photo{position:relative;isolation:isolate}
.occasion-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:var(--card-show,.45);transition:transform .6s var(--ease)}
.occasion-card.has-photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(16,35,63,.35) 0%,rgba(16,35,63,.82) 55%,rgba(16,35,63,.92) 100%)}
.occasion-card.has-photo:hover .occasion-bg{transform:scale(1.05)}
.occasion-card.has-photo .occasion-icon{background:rgba(16,35,63,.55)}
@media (prefers-reduced-motion:reduce){.occasion-card.has-photo:hover .occasion-bg{transform:none}}

.occasion-card:hover{border-color:rgba(255,255,255,.2);box-shadow:0 16px 36px rgba(0,0,0,.35);transform:translateY(-3px)}
@media (prefers-reduced-motion:reduce){.occasion-card:hover{transform:none}}
.occasion-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.occasion-icon{width:52px;height:52px;border-radius:10px;background:rgba(243,185,74,.14);display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.occasion-card-body{display:flex;flex-direction:column;gap:12px;flex:1}
.occasion-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.occasion-card h3{font-family:var(--font-display);font-size:21px;font-weight:600;color:var(--on-dark);line-height:1.25}
.occasion-card p{font-size:15px;line-height:1.6;color:rgba(255,255,255,.62);flex:1}
.occasion-arrow{flex-shrink:0;width:34px;height:34px;border-radius:50%;border:1px solid rgba(243,185,74,.4);display:flex;align-items:center;justify-content:center;color:var(--gold);transition:background .25s var(--ease),color .25s var(--ease)}
.occasion-card:hover .occasion-arrow{background:#F3B94A;color:var(--ink)}
.occasion-wa-link{align-self:flex-start;font-size:14px;font-weight:700;color:var(--gold);text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.occasion-wa-link:hover{text-decoration:underline}
.occasion-card .trip-price{color:var(--gold)}
.occasion-card ul{list-style:none;display:flex;flex-direction:column;gap:6px;font-size:14.5px;color:rgba(255,255,255,.7)}
.occasion-card ul li{display:flex;gap:8px;align-items:flex-start}
.occasion-card ul li svg{flex-shrink:0;margin-top:3px}

/* service / vehicle detail pages */
.check-list{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:15.5px;color:var(--ink-soft)}
.check-list li{display:flex;gap:10px;align-items:flex-start}
.check-list li svg{flex-shrink:0;margin-top:2px;color:var(--accent)}
.related-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.related-card{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:18px 20px;display:flex;flex-direction:column;gap:4px;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.related-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.related-card span{font-size:12.5px;font-weight:700;color:var(--accent)}
.related-card strong{font-size:16px;color:var(--ink)}
@media (max-width:860px){.related-strip{grid-template-columns:1fr}}

/* faq — a plain divided list, no card chrome, CSS-only +/× indicator */
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;font-weight:700;font-size:16px;padding:18px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--accent)}
.faq-ind{position:relative;width:16px;height:16px;flex-shrink:0}
.faq-ind::before,.faq-ind::after{content:"";position:absolute;background:var(--accent);border-radius:1px}
.faq-ind::before{left:0;top:7px;width:16px;height:2px}
.faq-ind::after{left:7px;top:0;width:2px;height:16px;transition:transform .25s var(--ease),opacity .25s var(--ease)}
.faq-item[open] .faq-ind::after{transform:rotate(90deg);opacity:0}
.faq-item p{margin:0 0 18px;font-size:15px;line-height:1.55;color:var(--ink-soft)}


/* footer */
footer{background:var(--ink-fixed);color:var(--on-dark-soft);padding:56px 0 0;position:relative;overflow:hidden}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1.3fr 1fr 1fr;gap:28px;font-size:15px;line-height:1.8;padding-bottom:40px}
.footer-col[hidden]{display:none}
.footer-brand strong{font-weight:800;font-size:20px;color:var(--on-dark);display:block;margin-bottom:6px}
.footer-col h3,.footer-col h4{color:var(--on-dark);font-size:14px;margin-bottom:8px}
.footer-col a{color:var(--on-dark-soft);text-decoration:none;display:block;padding:1px 0;line-height:1.5}
.footer-col .cookie-manage-trigger{display:block;padding:1px 0;line-height:1.5;color:var(--on-dark-soft);font-size:inherit;font-weight:inherit;text-decoration:none}
.footer-col .cookie-manage-trigger:hover{color:var(--gold)}
.footer-col a:hover{color:var(--gold)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:13.5px;color:var(--on-dark-faint);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.footer-bottom a{color:var(--on-dark-faint)}
.footer-bottom a:hover{color:var(--gold)}
.footer-bottom .business-identity{flex-basis:100%}
/* photo credits (script.js, photo credits): a small line in the corner of a credited photo, and all in the footer */
.photo-credit{position:absolute;right:8px;bottom:6px;z-index:5;max-width:calc(100% - 16px);padding:1px 4px;color:rgba(255,255,255,.78);font-size:9.5px;font-weight:500;line-height:1.3;letter-spacing:.01em;text-decoration:none;text-shadow:0 0 3px rgba(0,0,0,.75),0 1px 2px rgba(0,0,0,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.8;transition:opacity .2s ease}
.photo-credit:hover,a.photo-credit:focus-visible{opacity:1;color:#fff;text-decoration:underline}
.hero-section > .photo-credit{right:max(12px,env(safe-area-inset-right,0px));bottom:8px;max-width:min(46%,420px)}
@media (max-width:760px){.hero-section.has-slides > .photo-credit{bottom:62px;max-width:calc(100% - 32px)}}
.trip-card picture,.trip-card .slider,.trip-gallery picture{position:relative}
.occasion-card > .photo-credit{z-index:1}
.footer-credits{flex-basis:100%;margin:0;font-size:11px;line-height:1.6;color:var(--on-dark-faint);opacity:.75}
.footer-credits a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* back to top */
.to-top{position:fixed;right:20px;bottom:20px;width:48px;height:48px;border-radius:50%;background:var(--green);color:var(--on-dark);border:none;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s var(--ease),visibility .25s var(--ease),transform .25s var(--spring);z-index:90}
.cookie-float-btn.cookie-manage-trigger{position:fixed;left:20px;bottom:20px;width:48px;height:48px;border-radius:50%;background:var(--ink-fixed);color:var(--on-dark);border:none;padding:0;align-self:auto;text-decoration:none;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);cursor:pointer;z-index:900}
.cookie-float-btn.cookie-manage-trigger:hover{background:var(--green-dark);color:var(--on-dark)}
.to-top.show{opacity:1;visibility:visible;transform:none}

/* cookie consent banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;max-width:640px;margin:0 auto;background:var(--ink-fixed);color:#E6E9EE;border-radius:10px;padding:20px 22px;box-shadow:0 20px 50px rgba(0,0,0,.35);z-index:1000;display:none;gap:10px;flex-direction:column}
.cookie-banner.show{display:flex}
.cookie-banner-title{font-size:16px;font-weight:800;color:var(--on-dark)}
.cookie-banner p{font-size:14.5px;line-height:1.5;color:var(--on-dark-soft)}
.cookie-banner a{color:var(--gold)}
.cookie-actions{display:flex;gap:12px;flex-wrap:wrap}
.cookie-actions .btn{padding:10px 18px;min-height:40px;font-size:14.5px}
.cookie-actions .btn-ghost{color:var(--on-dark);border-color:rgba(255,255,255,.4)}
.cookie-actions .btn-ghost:hover{color:var(--gold);border-color:var(--gold)}
.cookie-manage-trigger{align-self:flex-start;background:none;border:none;padding:0;font:inherit;font-size:13.5px;font-weight:700;color:var(--on-dark-soft);text-decoration:underline;cursor:pointer}
.cookie-manage-trigger:hover{color:var(--gold)}

/* cookie preferences modal */
.cookie-modal{position:fixed;inset:0;z-index:1001;display:flex;align-items:center;justify-content:center;padding:20px}
.cookie-modal[hidden]{display:none}
.cookie-modal-backdrop{position:absolute;inset:0;background:rgba(16,35,63,.55)}
.cookie-modal-panel{position:relative;background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-md);width:100%;max-width:480px;max-height:min(640px,85vh);display:flex;flex-direction:column;overflow:hidden}
.cookie-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line);flex-shrink:0}
.cookie-modal-header h2{font-size:19px;font-weight:800;color:var(--ink)}
.cookie-modal-close{width:32px;height:32px;border-radius:50%;border:none;background:var(--bg);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.cookie-modal-body{overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:14px}
.cookie-modal-intro{font-size:14px;line-height:1.55;color:var(--muted)}
.cookie-modal-intro a{color:var(--accent)}
.cookie-category{border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.cookie-category-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:700;font-size:14.5px;color:var(--ink)}
.cookie-category p{font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:6px}
.cookie-toggle-label{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;cursor:pointer}
.cookie-toggle{position:relative;display:inline-block;width:38px;height:22px;flex-shrink:0}
.cookie-toggle input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.cookie-toggle-knob{position:absolute;inset:0;background:var(--line);border-radius:10px;transition:background-color .15s var(--ease)}
.cookie-toggle-knob::before{content:"";position:absolute;left:2px;top:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .15s var(--ease)}
.cookie-toggle input:checked ~ .cookie-toggle-knob{background:var(--accent)}
.cookie-toggle input:checked ~ .cookie-toggle-knob::before{transform:translateX(16px)}
.cookie-toggle-locked .cookie-toggle-knob{background:var(--accent);opacity:.6}
.cookie-toggle-locked .cookie-toggle-knob::before{transform:translateX(16px)}
.cookie-modal-footer{display:flex;flex-wrap:wrap;gap:10px;padding:16px 22px;border-top:1px solid var(--line);flex-shrink:0}
.cookie-modal-footer .btn{padding:9px 16px;min-height:38px;font-size:13.5px}

/* legal pages (privacy / terms) */
.legal{max-width:760px;margin:0 auto;padding:64px 32px 96px}
.legal h1{font-size:38px;font-weight:800;margin-bottom:8px}
.legal .updated{color:var(--muted);font-size:14.5px;margin-bottom:36px}
.legal h2{font-size:22px;font-weight:800;margin:36px 0 12px}
.legal h3{font-size:16.5px;font-weight:800;margin:22px 0 4px;color:var(--ink)}
.legal p,.legal li{font-size:16.5px;line-height:1.7;color:var(--ink-soft)}
.legal ul,.legal ol{padding-left:22px;display:flex;flex-direction:column;gap:8px;margin-top:8px}
.legal a{font-weight:600}

/* 404 page */
.error-page{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:64px 24px;text-align:center}
.error-inner{max-width:520px;display:flex;flex-direction:column;align-items:center;gap:18px}
.error-code{font-size:96px;font-weight:800;color:var(--accent);line-height:1}
.error-links{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:8px}

/* language switcher — Google Website Translator does the actual
   translating, but nothing of its own UI is ever shown: its widget
   renders its own default-locale label (e.g. "Επιλογή γλώσσας" instead
   of English, if the visitor's OS/browser is set to Greek), which reads
   as broken rather than multilingual. It's visually hidden but still
   functional; the globe/flag menu below drives it programmatically. */
.lang-switcher{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
/* Google's current Website Translator widget injects its top banner and
   tooltip popups as <iframe class="skiptranslate">, under an obfuscated
   per-build class (e.g. "VIpgJd-ZVi9od-ORHb-OEVmcd") that changes between
   versions — skiptranslate is the one marker Google has kept stable for
   over a decade specifically so its own injected UI can be targeted, so
   that's what's used here instead of a versioned class name. The classic
   .goog-te-banner-frame selector is kept too, for older widget builds. */
iframe.skiptranslate,
.goog-te-banner-frame{display:none !important}
body{top:0 !important}
.goog-text-highlight{background:none !important;box-shadow:none !important}

.lang-picker{position:relative;flex-shrink:0}
.lang-picker-trigger{display:flex;align-items:center;gap:6px;background:none;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-family:inherit;font-size:13.5px;font-weight:700;color:var(--ink);cursor:pointer;transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.lang-picker-trigger:hover{border-color:var(--accent)}
.lang-picker-trigger svg:first-child{flex-shrink:0}
.lang-picker-trigger svg:last-child{flex-shrink:0;transition:transform .15s var(--ease)}
.lang-picker-trigger[aria-expanded="true"] svg:last-child{transform:rotate(180deg)}
.lang-picker-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:50;background:var(--ink-fixed);border:1px solid rgba(255,255,255,.12);border-radius:10px;box-shadow:var(--shadow-md);padding:8px;min-width:170px;display:flex;flex-direction:column;gap:1px}
.lang-picker-menu[hidden]{display:none}
.lang-picker-option{display:flex;align-items:center;width:100%;background:none;border:none;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:13.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--on-dark);text-align:left;cursor:pointer}
.lang-picker-option:hover{background:rgba(255,255,255,.1)}
.lang-picker-option.active{color:var(--gold)}

/* theme toggle */

/* scroll-spy active nav link */
.nav-links a.active:not(.btn){color:var(--accent)}
.nav-links a.active:not(.btn)::after{right:0;background:var(--accent)}

/* mobile sticky CTA bar */
.mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:95;display:none;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:color-mix(in srgb, var(--white) 94%, transparent);backdrop-filter:blur(10px);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(0,0,0,.08);transform:translateY(100%);transition:transform .3s var(--ease)}
.mobile-cta.show{transform:none}
.mobile-cta .btn{width:100%}
@media (max-width:640px){.mobile-cta{display:block}}

/* animated price number */
/* smooth FAQ expand (height animated by script.js; this is the no-JS fallback) */
.faq-item .faq-body-inner{overflow:hidden;transition:max-height .3s var(--ease)}
@media (prefers-reduced-motion:reduce){.faq-item .faq-body-inner{transition:none}}

/* checkout page (booking.html) — a dedicated page, not a popup */
.checkout-header .header-inner{justify-content:space-between}
.checkout-header-actions{display:flex;align-items:center;gap:18px}
.checkout-secure{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--muted)}
.checkout-wrap{padding:40px 0 100px;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:start}
.checkout-title{font-size:30px;font-weight:800;margin-bottom:20px}
.checkout-tracker{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.checkout-tracker-step{display:flex;align-items:center;gap:8px;background:none;border:none;padding:0;font:inherit;font-size:14.5px;font-weight:700;color:var(--muted);cursor:default}
.checkout-tracker-num{width:26px;height:26px;flex-shrink:0;border-radius:50%;background:var(--bg);border:2px solid var(--line);color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800}
.checkout-tracker-step.done{color:var(--ink);cursor:pointer}
.checkout-tracker-step.done .checkout-tracker-num{background:var(--green);border-color:var(--green);color:var(--on-dark)}
.checkout-tracker-step.open{color:var(--ink)}
.checkout-tracker-step.open .checkout-tracker-num{background:var(--ink-fixed);border-color:var(--ink-fixed);color:var(--on-dark)}
.checkout-tracker-line{flex:1;height:2px;background:var(--line);min-width:16px}
.checkout-steps{display:flex;flex-direction:column;gap:16px}

.checkout-step{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.checkout-step-header{width:100%;display:flex;align-items:center;gap:14px;padding:20px 22px;background:transparent;border:none;text-align:left;font-family:inherit;cursor:pointer;color:var(--ink)}
.checkout-step-num{width:30px;height:30px;flex-shrink:0;border-radius:50%;background:var(--ink-fixed);color:var(--on-dark);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800}
.checkout-step.done .checkout-step-num{background:var(--green)}
.checkout-step-title{font-size:18px;font-weight:800;flex-shrink:0}
.checkout-step-summary{flex:1;font-size:14.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.checkout-step-edit{font-size:14px;font-weight:700;color:var(--accent);flex-shrink:0}
.checkout-step:not(.open) .checkout-step-body{display:none}
.checkout-step:not(.done):not(.open) .checkout-step-header{cursor:default}
.checkout-step.locked .checkout-step-header{opacity:.5;cursor:not-allowed}
.checkout-step-body{padding:0 22px 24px;display:flex;flex-direction:column;gap:22px}
.checkout-step-body .grid-2{gap:16px}
.checkout-step-body .field{gap:7px}
.checkout-type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.checkout-type-card{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:18px 10px;border:2px solid var(--line);border-radius:10px;background:transparent;cursor:pointer;font-family:inherit;color:var(--ink);transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.checkout-type-card:hover{border-color:var(--accent)}
.checkout-type-card.selected{border-color:var(--green);background:var(--green-tint)}
.checkout-type-card .icon-badge{margin:0}
.checkout-type-card span{font-weight:700;font-size:14px}
.checkout-field-err{display:none;font-size:13px;color:#D64545;margin-top:-8px}
.checkout-field-err.show{display:block}
.checkout-recap{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.checkout-recap strong{color:var(--ink)}
.checkout-step-body .field select,.checkout-step-body .field input{background:var(--white);border-color:var(--line);color:var(--ink)}
.checkout-step-body .field select:focus,.checkout-step-body .field input:focus{border-color:var(--accent)}
.checkout-step-body .pax-btn{border-color:var(--line);color:var(--ink)}
.checkout-step-body .check-row label{color:var(--ink)}
.checkout-travelers{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:20px 22px;display:flex;flex-direction:column;gap:18px}
.checkout-travelers:empty{display:none}
.checkout-travelers-label{font-size:13px;font-weight:700;color:var(--ink);}
.phone-field{display:flex;gap:8px}
.phone-field select{flex:0 0 158px;min-width:0}
.phone-field input{flex:1;min-width:0}

.checkout-sub{display:flex;flex-direction:column;gap:22px}
.checkout-sub[hidden]{display:none}
.checkout-pickup{display:flex;flex-direction:column;gap:16px}
.pickup-card{border:2px solid var(--line);border-radius:10px;padding:22px;display:flex;flex-direction:column;gap:18px;transition:border-color .15s var(--ease)}
.pickup-card.selected{border-color:var(--green)}
.pickup-card .pickup-details{display:flex;flex-direction:column;gap:16px;padding-top:2px}
.pickup-card:not(.selected) .pickup-details{display:none}
.pickup-option{display:flex;align-items:center;gap:10px;background:none;border:none;padding:0;font:inherit;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;text-align:left}
.pickup-option-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative}
.pickup-option.selected .pickup-option-dot{border-color:var(--green)}
.pickup-option.selected .pickup-option-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--green)}

.currency-top-link{border:1px solid var(--line);border-radius:10px;padding:7px 12px;font-size:14px}

.checkout-success{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:40px 32px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.checkout-success[hidden]{display:none}

.checkout-summary-card{position:sticky;top:130px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-sm)}
.checkout-summary-photo{aspect-ratio:16/10;border-radius:10px;overflow:hidden;background:var(--green-tint)}
.checkout-summary-photo img{width:100%;height:100%;object-fit:cover}
.checkout-summary-title{font-size:19px;font-weight:800}
.checkout-summary-rows{display:flex;flex-direction:column;gap:8px;font-size:14.5px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
.checkout-summary-row{display:flex;justify-content:space-between;gap:12px;color:var(--ink-soft)}
.checkout-summary-total{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;font-size:22px}
.checkout-summary-total span:last-child{font-family:var(--font-mono);color:var(--green)}
.checkout-price-toggle{width:100%;background:none;border:none;padding:0;font-family:inherit;color:inherit;cursor:default;text-align:left}
.checkout-price-toggle.has-details{cursor:pointer}
.checkout-price-toggle-amount{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);color:var(--green)}
.checkout-price-toggle .chev{display:none;transition:transform .2s var(--ease);flex-shrink:0}
.checkout-price-toggle.has-details .chev{display:block}
.checkout-price-toggle[aria-expanded="true"] .chev{transform:rotate(180deg)}
.checkout-price-details{display:flex;flex-direction:column;gap:6px;font-size:13.5px;padding-top:2px;margin-top:-6px}
.checkout-price-details[hidden]{display:none}
.checkout-price-details .checkout-summary-row{color:var(--ink-soft)}
.checkout-reviews{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:13.5px;font-weight:600;text-decoration:none}
.checkout-reviews:hover{text-decoration:underline;color:var(--ink)}
.checkout-reviews .hero-rating-stars{font-size:14px}
.checkout-reviews.adt-viator{margin-top:6px}
.checkout-trust{list-style:none;display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--ink-soft)}
.checkout-trust li{display:flex;align-items:center;gap:8px}
.checkout-pay-icons{display:flex;flex-wrap:wrap;gap:8px}
.checkout-support{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:14px;font-size:14px}
.checkout-support a{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:600}

/* billing step */
.billing-fields{display:flex;flex-direction:column;gap:16px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:20px 22px}
.terms-check{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;color:var(--ink)}
.terms-check input{width:20px;height:20px;flex-shrink:0;margin-top:2px;accent-color:var(--gold)}
.terms-check a{color:var(--accent)}
.fineprint{font-size:13.5px;line-height:1.55;color:var(--muted);margin:8px 0 0 30px}
.fineprint a{color:var(--accent)}

.pay-options{display:flex;flex-direction:column;gap:12px}
.pay-option{display:flex;align-items:center;justify-content:space-between;gap:14px;border:2px solid var(--line);border-radius:10px;padding:16px 18px;cursor:pointer;transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.pay-option:hover{border-color:var(--accent)}
.pay-option.selected{border-color:var(--green);background:var(--green-tint)}
.pay-option input{position:absolute;opacity:0;width:0;height:0}
.pay-option-main{display:flex;align-items:flex-start;gap:12px;min-width:0}
.pay-option-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative;margin-top:2px}
.pay-option.selected .pay-option-dot{border-color:var(--green)}
.pay-option.selected .pay-option-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--green)}
.pay-option-text{display:flex;flex-direction:column;gap:3px}
.pay-option-text strong{font-size:15.5px}
.pay-option-sub{font-size:13.5px;color:var(--muted);font-weight:400}
.pay-option-price{font-family:var(--font-mono);font-weight:700;font-size:15.5px;white-space:nowrap;text-align:right;flex-shrink:0}
.pay-option-price small{display:block;font-weight:600;font-size:11.5px;color:var(--muted);}
@media (max-width:520px){
  .pay-option{flex-direction:column;align-items:flex-start}
  .pay-option-price{text-align:left}
}

#paypalPayBlock{display:flex;flex-direction:column;gap:12px}
#paypalPayBlock[hidden]{display:none}
.paypal-pay-hint{font-size:13.5px;color:var(--muted);margin:0}
#paypalButtonContainer{max-width:420px}

.currency-link{background:none;border:none;padding:0;font:inherit;font-size:14.5px;font-weight:700;color:var(--accent);text-decoration:underline;cursor:pointer}
.currency-modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:20px}
.currency-modal[hidden]{display:none}
.currency-modal-backdrop{position:absolute;inset:0;background:rgba(16,35,63,.55)}
.currency-modal-panel{position:relative;background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-md);width:100%;max-width:420px;max-height:min(600px,80vh);display:flex;flex-direction:column;overflow:hidden}
.currency-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line);flex-shrink:0}
.currency-modal-header h2{font-size:19px;font-weight:800;color:var(--ink)}
.currency-modal-close{width:32px;height:32px;border-radius:50%;border:none;background:var(--bg);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.currency-modal-list{overflow-y:auto;padding:6px 8px}
.currency-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:none;background:transparent;text-align:left;font-family:inherit;cursor:pointer;border-radius:10px;color:var(--ink)}
.currency-row:hover{background:var(--bg)}
.currency-row-name{font-weight:600;font-size:15px}
.currency-row-code{color:var(--muted);font-weight:400}
.currency-row-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative}
.currency-row.selected .currency-row-dot{border-color:var(--green)}
.currency-row.selected .currency-row-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--green)}
.currency-modal-note{font-size:12.5px;color:var(--muted);line-height:1.5;padding:14px 22px;border-top:1px solid var(--line);flex-shrink:0}
@media (max-width:520px){.currency-modal-panel{max-height:85vh}}

@media (max-width:900px){
  .checkout-wrap{grid-template-columns:1fr;padding-top:24px}
  .checkout-summary-card{position:static;order:-1}
}
@media (max-width:640px){
  .checkout-type-grid{grid-template-columns:1fr}
  .checkout-step-body{padding:0 16px 20px}
  .checkout-step-header{padding:16px}
  .checkout-step-summary{display:none}
  .checkout-secure{display:none}
  .checkout-step-body .grid-2{grid-template-columns:1fr}
  .checkout-header-actions{gap:8px}
  .currency-top-link{padding:6px 8px;font-size:13px}
  .lang-picker-trigger{padding:8px}
  .lang-picker-trigger span{display:none}
}

@media (max-width:860px){
  .two{grid-template-columns:minmax(0,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .wrap{padding:0 20px}
  .hero-h1-light{font-size:36px !important}
  .hero-content{padding:110px 0 44px}
  .calc-bar-fields{flex-direction:column;min-height:0}
  .calc-seg{flex:1 1 auto !important;padding:12px 16px;width:100%}
  .calc-divider{width:100%;height:1px;align-self:stretch}
  .calc-return-btn{justify-content:flex-start}
  .calc-bar-submit{flex:1 1 auto !important;margin-top:8px;min-height:50px}
  .facts-grid{grid-template-columns:1fr}
  .facts-item{padding:16px 0;border-bottom:1px solid var(--line) !important}
  .facts-item:last-child{border-bottom:none !important}
  .faq-grid{grid-template-columns:1fr}
  .h2{font-size:30px}
  .nav-links{position:absolute;top:calc(100% + 1px);left:0;right:0;background:var(--white);flex-direction:column;align-items:stretch;gap:4px;padding:12px 4px 20px;box-shadow:var(--shadow-md);border-bottom-left-radius:3px;border-bottom-right-radius:3px;border:1px solid var(--line);border-top:none;display:none}
  .nav-links a{padding:12px 8px}
  .nav-toggle:checked ~ .nav-links{display:flex}
  .nav-burger{display:flex}
}
@media (max-width:520px){
  .footer-grid{grid-template-columns:1fr}
  .error-code{font-size:64px}
}
@media (max-width:640px){
  footer{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .to-top{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .cookie-float-btn{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}

/* ==========================================================================
   Homepage components (see DESIGN.md). Structure follows what established
   Greek transfer operators use: photo hero with the booking card beside the
   headline, a licence and trust row under it, route cards with a "from"
   price, fleet specs, and plain tables for prices.
   ========================================================================== */
[id]{scroll-margin-top:132px}
/* The header button is a plain outline. Gold is kept for the buttons inside the page, where the visitor decides. */
.nav-links a.btn{background:transparent;color:var(--ink);padding:10px 16px;min-height:42px;box-shadow:inset 0 0 0 1.5px var(--ink)}
.nav-links a.btn:hover{background:var(--ink);color:var(--on-dark);box-shadow:inset 0 0 0 1.5px var(--ink)}
.nav-links a.btn:active{background:var(--teal-dark);color:var(--on-dark)}
@media (min-width:861px){
  body.page-hero-overlay .site-header:not(.scrolled) .nav-links a.btn{color:var(--on-dark);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7)}
  body.page-hero-overlay .site-header:not(.scrolled) .nav-links a.btn:hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px #fff}
}
/* On a phone the menu opens as a white panel, so its links are dark even while the header sits over the photo. */
@media (max-width:860px){
  body.page-hero-overlay .site-header:not(.scrolled) .nav-links a:not(.btn){color:var(--ink)}
}
.nav-links a{white-space:nowrap}
.brand-text span{white-space:nowrap}
.nav-phone{white-space:nowrap}
.more{font-size:15px;font-weight:700;color:var(--accent);text-decoration:none;white-space:nowrap}
.more::after{content:"\2192";display:inline-block;margin-left:.4em;transition:transform .2s var(--ease)}
.more:hover::after,a:hover > .more::after{transform:translateX(4px)}
.stars{color:var(--gold);letter-spacing:2px}

/* hero */
.hp-hero{position:relative;background:#0E2A4F;color:var(--on-dark);padding:168px 0 76px}
.hp-hero-bg{position:absolute;inset:0;display:block;overflow:hidden}
.hp-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:72% 42%}
.hp-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,66,.95) 0%,rgba(11,34,66,.86) 46%,rgba(11,34,66,.48) 100%)}
/* when the owner has set a strength for the picture: fade the picture itself by that amount, and keep only a lighter shade behind the words */
.hp-hero.own-strength .hp-hero-bg img{opacity:var(--bg-show,.5)}
.hp-hero.own-strength .hp-hero-bg::after{background:linear-gradient(90deg,rgba(11,34,66,.74) 0%,rgba(11,34,66,.4) 55%,rgba(11,34,66,0) 100%)}
.hp-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 420px;grid-template-areas:"top card" "bottom card";column-gap:56px;align-items:start}
.hp-top{grid-area:top;align-self:end}
.hp-bottom{grid-area:bottom}
.book-card{grid-area:card;align-self:center}
.hp-kicker{font-size:13.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
.hp-h1{font-family:var(--font-display);font-size:clamp(2.15rem,4.3vw,3.5rem);line-height:1.08;font-weight:800;letter-spacing:-.025em;margin-top:14px}
.hp-lede{font-size:18.5px;line-height:1.6;color:rgba(255,255,255,.88);max-width:33em;margin-top:18px}
.hp-checks{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;margin-top:26px;max-width:36em}
.hp-checks li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.4;font-weight:600}
.hp-checks svg{flex-shrink:0;margin-top:1px;color:var(--gold)}
.hp-rating{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:28px;font-size:15px;color:rgba(255,255,255,.88)}
.hp-rating .stars{font-size:17px}
.hp-rating a{color:var(--on-dark);font-weight:700}
.hp-rating .adt-viator{flex-basis:100%;margin-top:-4px}

/* booking card: always a white surface, whatever the site theme */
.book-card{background:#fff;color:var(--ink);border-radius:16px;padding:22px;box-shadow:0 24px 60px rgba(11,34,66,.45)}
.book-card-title{font-family:var(--font-display);font-size:21px;font-weight:800;letter-spacing:-.01em;color:var(--ink);margin-bottom:14px}
.book-card .ticket{border:1px solid #DEE5EF;padding:0;border-radius:12px}
.book-card .calc-bar-fields{flex-direction:column;min-height:0}
.book-card .calc-seg{flex:1 1 auto;width:100%;padding:12px 14px}
.book-card .calc-divider{width:100%;height:1px;align-self:stretch}
.book-card .calc-return-btn{flex:none;width:100%;padding:14px;justify-content:flex-start}
.book-card .calc-seg-pax{flex-direction:row;align-items:center;justify-content:space-between}
.book-card .calc-bar-submit{flex:none;width:calc(100% - 20px);margin:10px;min-height:52px;border-radius:10px}
.book-card .to-point-panel{left:0;right:0;width:auto;top:calc(100% + 10px)}
.book-card .luggage-note{padding:0 14px 12px}
.book-card-note{font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:12px}

/* trust row */
.trust-bar{background:var(--white);border-bottom:1px solid var(--line)}
.trust-bar-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:22px 0}
.trust-item{display:flex;gap:12px;align-items:center}
.trust-item svg{flex-shrink:0;color:var(--icon-stroke)}
.trust-item strong{display:block;font-size:15.5px;font-weight:700;color:var(--ink)}
.trust-item span{display:block;font-size:13.5px;color:var(--muted)}

/* cards */
.card{background:var(--white);border:1px solid var(--line);border-radius:14px;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
a.card{text-decoration:none;color:inherit}
a.card:hover,.card.lift:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:transparent}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}

.route-card{padding:22px;display:flex;flex-direction:column;gap:12px}
.route-card-title{font-family:var(--font-display);font-size:18.5px;font-weight:700;line-height:1.25;color:var(--ink)}
.route-card-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14.5px;color:var(--muted)}
.route-card-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
.route-card-price small{display:block;font-size:12.5px;color:var(--muted)}
.route-card-price strong{font-family:var(--font-display);font-size:27px;font-weight:800;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums}

.steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.step{position:relative}
.step-num{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#0E2A4F;color:var(--on-dark);font-family:var(--font-display);font-weight:800;font-size:18px}
.step:not(:last-child)::after{content:"";position:absolute;top:21px;left:58px;right:-18px;border-top:2px dashed var(--line)}
.step h3{font-size:19px;font-weight:700;margin-top:16px}
.step p{font-size:15.5px;line-height:1.6;color:var(--ink-soft);margin-top:6px}

.board{background:#0E2A4F;border-radius:14px;padding:22px 24px;color:var(--on-dark);font-variant-numeric:tabular-nums;box-shadow:var(--shadow-md)}
.board-head{display:flex;justify-content:space-between;gap:16px;font-size:13px;color:#9EAABA;margin-bottom:8px}
.board-row{display:grid;grid-template-columns:1.1fr 2fr .8fr 1fr;gap:10px;padding:13px 0;border-top:1px solid rgba(255,255,255,.12);font-size:14.5px;font-weight:600}
.board-status{text-align:right;color:var(--gold)}
.board-status.ok{color:#7EE2A8}

.svc-card{padding:26px;display:flex;flex-direction:column;gap:12px}
.svc-icon{width:48px;height:48px;border-radius:12px;background:var(--green-tint);color:var(--icon-stroke);display:flex;align-items:center;justify-content:center}
.svc-card h3{font-size:19px;font-weight:700;color:var(--ink)}
.svc-card p{font-size:15.5px;line-height:1.6;color:var(--ink-soft);flex:1}

.spec-list{border-top:1px solid var(--line);margin-top:22px}
.spec-list > div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.spec-list dt{font-size:14.5px;color:var(--muted)}
.spec-list dd{font-size:15.5px;line-height:1.45;font-weight:600;color:var(--ink)}
.photo-caption{font-size:13.5px;color:var(--muted);margin-top:10px}

.table-wrap{overflow-x:auto;background:var(--white);border:1px solid var(--line);border-radius:14px}
.fare{width:100%;border-collapse:collapse}
.fare{min-width:560px}
.fare th,.fare td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.5;vertical-align:top}
.fare tbody tr:last-child th,.fare tbody tr:last-child td{border-bottom:0}
.fare thead th{font-size:13px;font-weight:700;color:var(--muted);background:var(--bg);white-space:nowrap}
.fare tbody th{font-weight:700;color:var(--ink)}
.fare td,.fare thead th:not(:first-child){text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.fare td{font-weight:700;color:var(--ink)}
.fare tbody tr{cursor:pointer;transition:background-color .15s var(--ease)}
.fare tbody tr:hover{background:var(--green-tint)}
.fineprint{font-size:13.5px;line-height:1.55;color:var(--muted);max-width:60em;margin-top:14px}

.trip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.trip-card{overflow:hidden;display:flex;flex-direction:column}
.trip-card picture{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--green-tint)}
.trip-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.trip-card:hover img{transform:scale(1.05)}
.trip-card-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.trip-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.trip-card-title{font-family:var(--font-display);font-size:19px;font-weight:700;line-height:1.25;color:var(--ink)}
.trip-card-price{font-family:var(--font-display);font-size:20px;font-weight:800;white-space:nowrap;color:var(--ink);font-variant-numeric:tabular-nums}
.trip-card-desc{font-size:15px;line-height:1.55;color:var(--ink-soft);flex:1}
.trip-quick{margin-top:22px;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:4px 20px}
.trip-quick:empty{display:none}
.trip-row{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto;gap:6px 16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.trip-row:last-child{border-bottom:0}
.trip-row picture{width:56px;height:56px;border-radius:10px;overflow:hidden;display:block}
.trip-row img{width:100%;height:100%;object-fit:cover}
.trip-row-title{display:block;font-weight:700;font-size:16.5px;color:var(--ink)}
.trip-row-desc{display:block;font-size:14.5px;line-height:1.45;color:var(--muted);margin-top:2px}
.trip-row .trip-card-price{font-size:17px}

/* tabs without script: radio + label + panel */
.tabs{display:flex;flex-wrap:wrap;gap:8px}
.tabs > input{position:absolute;opacity:0;pointer-events:none}
.tabs > label{order:1;padding:11px 18px;border-radius:10px;border:1px solid var(--line);background:var(--white);font-size:15px;font-weight:700;color:var(--ink-soft);cursor:pointer;transition:background-color .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease)}
.tabs > label:hover{border-color:var(--accent);color:var(--accent)}
.tabs > input:checked + label{background:#0E2A4F;border-color:#0E2A4F;color:var(--on-dark)}
.tabs > input:focus-visible + label{outline:3px solid var(--accent);outline-offset:2px}
.tab-panel{order:2;width:100%;display:none;margin-top:14px;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:28px}
#tabLand:checked ~ .tab-panel[data-tab="land"],#tabFacts:checked ~ .tab-panel[data-tab="facts"],#tabMeet:checked ~ .tab-panel[data-tab="meet"],#tabLocal:checked ~ .tab-panel[data-tab="local"]{display:block}
.tab-panel p{font-size:16.5px;line-height:1.65;color:var(--ink-soft);max-width:46em}
.tab-panel p + p{margin-top:14px}
.info-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:44px}
.info-list > div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}
.info-list dt{font-size:14.5px;color:var(--muted)}
.info-list dd{font-size:15.5px;line-height:1.45;font-weight:600;color:var(--ink)}
.meet-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.meet-grid h3{font-size:18px;font-weight:700;color:var(--ink)}
.meet-grid p{font-size:15.5px;margin-top:6px}

.promise-list{list-style:none;display:grid;gap:18px}
.promise-list li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px}
.promise-list svg{color:var(--icon-stroke);margin-top:2px}
.promise-list strong{display:block;font-size:17px;font-weight:700;color:var(--ink)}
.promise-list span{display:block;font-size:15.5px;line-height:1.55;color:var(--ink-soft);margin-top:2px}
.prose p{font-size:17px;line-height:1.65;color:var(--ink-soft)}
.prose p + p{margin-top:14px}

.review-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:22px 0 28px}
.review-score{font-family:var(--font-display);font-size:54px;font-weight:800;line-height:1;color:var(--ink)}
.review-head .stars{font-size:20px}
.review-head p{font-size:15px;color:var(--muted);margin-top:4px}
.review-card{padding:24px;display:flex;flex-direction:column;gap:12px}
.review-card blockquote{font-size:16.5px;line-height:1.6;color:var(--ink)}
.review-card cite{font-style:normal;font-size:14px;color:var(--muted);margin-top:auto}

.faq-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;align-items:start}
.faq-item{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:0 20px}
.faq-item summary{font-size:16.5px;padding:18px 0}

.cta-band{background:linear-gradient(135deg,#0E2A4F 0%,#173B6C 100%);color:var(--on-dark);padding:72px 0}
.cta-band-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 48px;align-items:center}
.cta-band h2{font-family:var(--font-display);font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:800;line-height:1.15;letter-spacing:-.02em;max-width:20em}
.cta-band p{font-size:17px;line-height:1.55;color:rgba(255,255,255,.82);margin-top:12px;max-width:34em}
.cta-band-actions{display:flex;gap:14px;flex-wrap:wrap}

@media (max-width:1060px){
  .hp-hero-grid{grid-template-columns:minmax(0,1fr) 380px;column-gap:36px}
}
@media (max-width:900px){
  .hp-hero{padding:142px 0 48px}
  .hp-hero-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "card" "bottom";row-gap:28px}
  .hp-checks{margin-top:0}
  .hp-hero-bg::after{background:rgba(11,34,66,.88)}
  .hp-hero.own-strength .hp-hero-bg::after{background:rgba(11,34,66,.6)}
  .trust-bar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3,.trip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .meet-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .info-list{grid-template-columns:minmax(0,1fr)}
  .cta-band-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .hp-checks{grid-template-columns:minmax(0,1fr)}
  .trust-bar-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .grid-3,.trip-grid,.steps{grid-template-columns:minmax(0,1fr)}
  .step::after{display:none}
  .faq-grid{grid-template-columns:minmax(0,1fr)}
  .spec-list > div{grid-template-columns:118px minmax(0,1fr)}
  .tab-panel{padding:20px}
  .trip-row{grid-template-columns:56px minmax(0,1fr) auto}
  .trip-row .more{display:none}
  .book-card{padding:18px}
  .cta-band{padding:52px 0}
}
@media (max-width:520px){
  .site-nav{gap:8px}
  .brand-text span{display:none}
  .header-inner{gap:10px}
}
.page-hero .hero-content{width:100%;max-width:1120px;box-sizing:border-box;padding-left:32px;padding-right:32px}
@media (max-width:860px){.page-hero .hero-content{padding-left:20px;padding-right:20px}}

/* header strip: live Athens time, plus the WhatsApp number on wider screens */
.topstrip{font-size:13.5px;border-bottom:1px solid var(--line);color:var(--muted)}
.topstrip-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px}
.topstrip-now{display:flex;align-items:center;flex-wrap:wrap;gap:2px 18px;min-width:0}
.athens-clock{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.athens-weather{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.athens-weather[hidden]{display:none}
.athens-weather-icon{display:inline-flex}
.athens-weather-temp{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
body.page-hero-overlay .site-header:not(.scrolled) .athens-weather-temp{color:var(--on-dark)}
.athens-clock svg{flex-shrink:0}
.athens-clock-time{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.athens-clock-date::before,.athens-clock-diff::before{content:"\00B7";margin-right:7px}
.athens-clock-date:empty,.athens-clock-diff:empty{display:none}
.topstrip-contact{color:inherit;font-weight:600;text-decoration:none;white-space:nowrap}
.topstrip-contact:hover{color:var(--accent)}
body.page-hero-overlay .site-header:not(.scrolled) .topstrip{border-bottom-color:rgba(255,255,255,.16);color:rgba(255,255,255,.8)}
body.page-hero-overlay .site-header:not(.scrolled) .athens-clock-time{color:var(--on-dark)}
body.page-hero-overlay .site-header:not(.scrolled) .topstrip-contact:hover{color:var(--on-dark)}
@media (min-width:861px){.nav-phone{display:none}}
@media (max-width:640px){
  .topstrip{font-size:12.5px}
  .topstrip-inner{min-height:30px}
  .topstrip-contact{display:none}
  .athens-weather-text{display:none}
  .topstrip-now{gap:2px 14px}
  /* a long month plus a long time difference drops to a second line instead of pushing the page wide */
  .athens-clock{flex-wrap:wrap;gap:0 7px}
}
@media (max-width:400px){.athens-clock-date{display:none}}

/* day-trip cards: the corner arrow that opens a trip's information page */
.trip-card-wrap{position:relative;display:flex}
/* Sliding photos: a trip card's photos and the trip page's background pictures (script.js, slideTo) */
.slider{display:block;overflow:hidden;position:relative}
.slides{display:flex;height:100%;transition:transform .45s var(--ease)}
.slides > *{flex:0 0 100%;min-width:0}
.slider.is-dragging .slides{transition:none}
.has-slides{touch-action:pan-y pinch-zoom}
.trip-card .slider{aspect-ratio:4/3;background:var(--green-tint)}
.trip-hero-bg .slider{height:100%}
/* in a photo frame (the vehicle page): the arrows at its sides, the dots along its bottom */
.photo-frame .slider{height:100%}
.photo-frame .slides > picture{display:block;height:100%}
.photo-frame > .slide-nav{position:absolute;inset:0;justify-content:space-between;padding:0 12px}
.photo-frame > .slide-nav .slide-dots{position:absolute;left:0;right:0;bottom:14px;justify-content:center}
.page-gallery{margin-top:48px}
/* the vehicle page with its photo hidden: the words take the whole width */
.two.no-photo{grid-template-columns:minmax(0,1fr)}
/* a page's ticked list and facts table wait for its wording file, as the rest of its wording does */
html:not(.adt-page-ready) :is(#pageFeatures,#pageFacts) :is(span,strong){animation:adt-skeleton 1.2s linear 3}
.slide-nav{display:flex;align-items:center;gap:10px;pointer-events:none;z-index:3}
.slide-arrow{pointer-events:auto;display:flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 3px 10px rgba(11,34,66,.28);cursor:pointer;transition:transform .2s var(--spring),background-color .2s var(--ease),opacity .2s var(--ease)}
.slide-arrow:hover{background:#fff;transform:scale(1.08)}
.slide-arrow:active{transform:scale(.94)}
.slide-arrow:focus-visible{outline:3px solid var(--cta);outline-offset:2px}
.slide-dots{display:flex;gap:6px}
.slide-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 0 1px rgba(11,34,66,.25);transition:background-color .2s var(--ease),transform .2s var(--ease)}
.slide-dot.is-on{background:#fff;transform:scale(1.3)}
[data-slider-drag]{cursor:grab}
[data-slider-drag] a,[data-slider-drag] button{cursor:pointer}
.is-grabbing,.is-grabbing *{cursor:grabbing;user-select:none;-webkit-user-select:none}
/* on a card: the arrows at the photo's sides, the dots along its bottom */
.trip-card-wrap > .slide-nav{position:absolute;top:0;left:0;right:0;aspect-ratio:4/3;justify-content:space-between;padding:0 10px}
.trip-card-wrap > .slide-nav .slide-dots{position:absolute;left:0;right:0;bottom:12px;justify-content:center}
/* behind a trip page's title: see-through arrows at the band's left and right edges, the dots along its
   bottom; on a phone, where the edges hold the buttons and the cookie button, one row in the middle
   of the bottom: arrow, dots, arrow */
.hero-nav{position:absolute;top:0;bottom:0;left:0;right:0;justify-content:space-between;padding:0 max(16px,calc((100% - 1180px)/2 - 30px))}
.hero-nav .slide-arrow{width:48px;height:48px;background:rgba(255,255,255,.16);color:#fff;box-shadow:none;border:1px solid rgba(255,255,255,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero-nav .slide-arrow:hover{background:rgba(255,255,255,.3)}
.hero-nav .slide-dots{position:absolute;left:0;right:0;bottom:18px;justify-content:center}
.has-slides > .hero-content{padding-bottom:64px}
@media (max-width:760px){
  .hero-nav{top:auto;bottom:12px;height:40px;padding:0 16px;justify-content:center;gap:12px}
  .hero-nav .slide-arrow{width:40px;height:40px}
  .hero-nav .slide-dots{position:static}
  .has-slides > .hero-content{padding-bottom:68px}
}
@media (prefers-reduced-motion:reduce){.slides,.slide-arrow,.slide-dot{transition:none}}
.trip-card-wrap > .trip-card{flex:1;min-width:0}
.trip-info{position:absolute;top:12px;right:12px;z-index:2;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--ink);box-shadow:0 4px 14px rgba(11,34,66,.3);text-decoration:none;transition:background-color .2s var(--ease),transform .2s var(--spring)}
.trip-info:hover{background:var(--cta);transform:scale(1.08)}
.trip-info:active{background:var(--cta-press);transform:scale(.96)}
.trip-info:focus-visible{outline:3px solid var(--cta);outline-offset:2px}
.trip-card-wrap:has(.trip-card:hover) .trip-info{transform:translateY(-3px)}
.trip-row-wrap{position:relative;border-bottom:1px solid var(--line)}
.trip-row-wrap:last-child{border-bottom:0}
.trip-row-wrap > .trip-row{border-bottom:0}
.trip-row-wrap.has-info > .trip-row{padding-right:52px}
.trip-row-wrap .trip-info{top:50%;right:0;width:40px;height:40px;margin-top:-20px;box-shadow:none;border:1px solid var(--line)}

/* day-trip information page (trip.html): one fixed template, filled in from data/daytrips.json */
.trip-hero .hero-content{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:48px;align-items:center}
.trip-hero-text{display:flex;flex-direction:column;gap:18px;min-width:0}
/* optional background picture, blended into the navy: solid behind the text, fading to let the photo show on the right and melting into the page colour at the bottom */
.trip-hero-bg{position:absolute;inset:0;overflow:hidden}
.trip-hero-bg img{width:100%;height:100%;object-fit:cover;display:block;opacity:var(--bg-show,.45)}
/* the picture is faded into the navy behind it by --bg-show; this layer only keeps the side with the words dark enough to read */
.has-bg > .trip-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,42,79,.74) 0%,rgba(14,42,79,.4) 55%,rgba(14,42,79,0) 100%)}
@media (max-width:760px){.has-bg > .trip-hero-bg::after{background:rgba(14,42,79,.6)}}
.trip-hero-photo{background:rgba(255,255,255,.08)}
.trip-hero-photo[hidden]{display:none}
.trip-hero .hero-content.no-photo{grid-template-columns:minmax(0,1fr)}
.trip-hero-photo picture{display:block;width:100%;height:100%}
.trip-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:start}
.trip-main{display:flex;flex-direction:column;gap:36px;min-width:0}
.trip-h3{font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--ink);margin-bottom:14px}
.trip-aside{position:sticky;top:130px;padding:26px;display:flex;flex-direction:column;gap:4px}
.trip-aside-label{font-size:14.5px;color:var(--muted)}
.trip-aside-price{font-family:var(--font-display);font-size:40px;font-weight:800;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums}
.trip-aside-note{font-size:14.5px;color:var(--ink-soft)}
.trip-aside .spec-list{margin:18px 0 20px}
.trip-aside .spec-list > div{grid-template-columns:86px minmax(0,1fr)}
.trip-plan{list-style:none;counter-reset:plan;max-width:46em}
.trip-plan li{position:relative;counter-increment:plan;padding:0 0 28px 62px;min-height:72px}
.trip-plan li:last-child{padding-bottom:0;min-height:44px}
.trip-plan li::before{content:counter(plan);position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#0E2A4F;color:var(--on-dark);font-family:var(--font-display);font-weight:800;font-size:18px}
.trip-plan li:not(:last-child)::after{content:"";position:absolute;left:21px;top:50px;bottom:6px;border-left:2px dashed var(--line)}
.trip-plan h3{font-size:19px;font-weight:700;padding-top:9px}
.trip-plan p{font-size:16px;line-height:1.6;color:var(--ink-soft);margin-top:4px}
.trip-lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 56px}
.cross-list li svg{color:var(--muted)}
.trip-notes{margin-top:36px;padding:22px 24px;background:var(--green-tint);border-radius:14px}
.trip-notes .trip-h3{margin-bottom:8px}
.trip-notes .prose p{font-size:16px}
.trip-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.trip-gallery picture{display:block;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--green-tint)}
.trip-gallery img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:960px){
  .trip-hero .hero-content{grid-template-columns:minmax(0,1fr) 320px;gap:32px}
  .trip-layout{grid-template-columns:minmax(0,1fr);gap:36px}
  .trip-aside{position:static}
}
@media (max-width:760px){
  .trip-hero .hero-content{grid-template-columns:minmax(0,1fr)}
  .trip-hero-photo{max-width:520px}
  .trip-lists{grid-template-columns:minmax(0,1fr)}
  .trip-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.icon-img{object-fit:contain;flex-shrink:0;vertical-align:middle}

/* ---- Loading placeholders (skeletons) ----
   While a page's saved wording is on its way, each piece of text shows as a soft shimmering bar of its
   own size, and the parts the script builds (trip cards, prices, the footer's trips) show placeholder
   shapes. Everything is drawn by the animation alone, so if the script never runs the page simply
   shows its built-in words when the animation ends (3.6 s). */
:root{--sk-a:rgba(130,146,170,.16);--sk-b:rgba(130,146,170,.34);
  /* one rounded bar per line of text (1lh = one line); older browsers show one block instead */
  --sk-lines:linear-gradient(to bottom,transparent 0 16%,#000 16% 84%,transparent 84% 100%) 0 0/100% 1lh repeat-y}
@keyframes adt-skeleton{
  0%{color:transparent;-webkit-text-fill-color:transparent;background-image:linear-gradient(90deg,var(--sk-a) 0%,var(--sk-b) 50%,var(--sk-a) 100%);background-size:200% 100%;background-position:100% 0;border-radius:6px;-webkit-mask:var(--sk-lines);mask:var(--sk-lines)}
  100%{color:transparent;-webkit-text-fill-color:transparent;background-image:linear-gradient(90deg,var(--sk-a) 0%,var(--sk-b) 50%,var(--sk-a) 100%);background-size:200% 100%;background-position:-100% 0;border-radius:6px;-webkit-mask:var(--sk-lines);mask:var(--sk-lines)}
}
@keyframes adt-skeleton-hide{0%,100%{visibility:hidden}}
@keyframes adt-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}
html:not(.adt-text-ready) :is([data-t],[data-th],[data-tn]),
html:not(.adt-trip-ready) [data-trip-text]{animation:adt-skeleton 1.2s linear 3}
html:not(.adt-text-ready) :is([data-t],[data-th],[data-tn]) *,
html:not(.adt-trip-ready) [data-trip-text] *{animation:adt-skeleton-hide 3.6s step-end 1}
.sk{display:block;background-image:linear-gradient(90deg,var(--sk-a) 0%,var(--sk-b) 50%,var(--sk-a) 100%);background-size:200% 100%;animation:adt-shimmer 1.2s linear infinite;border-radius:8px}
.sk-line{height:.85em;margin:.45em 0;width:100%}
.sk-line.w70{width:70%}.sk-line.w60{width:60%}.sk-line.w45{width:45%}
.sk-card{background:var(--surface);background-image:none;animation:none;border:1px solid var(--line);border-radius:var(--radius);padding:0 18px 18px;overflow:hidden}
.sk-img{height:180px;margin:0 -18px 14px;border-radius:0}
.sk-row{display:flex;align-items:center;gap:14px;background:none;animation:none;padding:10px 0}
.sk-row .sk-line{margin:0}
.sk-thumb{width:56px;height:56px;flex:0 0 56px;border-radius:10px}
.sk-route{background:var(--surface);background-image:none;animation:none;border:1px solid var(--line);border-radius:var(--radius);padding:18px;min-height:96px}
.sk-rows td{padding:12px 10px}
.sk-on-dark{--sk-a:rgba(255,255,255,.08);--sk-b:rgba(255,255,255,.2)}
.sk-fill{position:absolute;inset:0;border-radius:inherit}
@media (prefers-reduced-motion:reduce){.sk{animation:none}html:not(.adt-text-ready) :is([data-t],[data-th],[data-tn]){animation-duration:3.6s;animation-iteration-count:1}}

/* ---- Page loader ----
   On the first page of a visit, a short branded screen covers the page while it gets ready, then
   fades away as soon as the wording is in place (html.adt-text-ready). Later pages of the same visit
   skip it (html.adt-seen) and open straight onto their placeholders. With no script at all it still
   leaves after 4 seconds. */
#adt-loader{position:fixed;inset:0;z-index:2147483000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:radial-gradient(120% 90% at 50% 35%,#16325a 0%,var(--ink-fixed) 60%,#07172d 100%);color:var(--on-dark);
  animation:adt-loader-out .45s ease 4s forwards}
.adt-seen #adt-loader{display:none}
.adt-text-ready #adt-loader{opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s;animation:none}
.adt-text-ready #adt-loader .adt-loader-mark{transform:scale(1.08);transition:transform .45s cubic-bezier(.16,1,.3,1)}
.adt-loader-mark{position:relative;width:88px;height:88px;display:grid;place-items:center;border-radius:22px;background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.08);animation:adt-loader-pop .6s cubic-bezier(.34,1.56,.64,1) both}
.adt-loader-mark img{width:64px;height:64px;animation:adt-loader-dash 1.6s cubic-bezier(.65,0,.35,1) .35s infinite}
.adt-loader-ring{position:absolute;inset:-10px;border-radius:30px;border:2px solid var(--gold);opacity:0;animation:adt-loader-ring 1.6s ease-out .35s infinite}
.adt-loader-name{font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:.02em;opacity:0;animation:adt-loader-fade .5s ease .15s forwards}
.adt-loader-bar{position:relative;width:140px;height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.adt-loader-bar span{position:absolute;inset:0;width:45%;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:adt-loader-run 1.1s cubic-bezier(.65,0,.35,1) infinite}
@keyframes adt-loader-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes adt-loader-dash{0%,100%{transform:translateX(0)}45%{transform:translateX(5px)}55%{transform:translateX(5px)}}
@keyframes adt-loader-ring{0%{opacity:.7;transform:scale(.9)}100%{opacity:0;transform:scale(1.25)}}
@keyframes adt-loader-fade{to{opacity:.95}}
@keyframes adt-loader-run{from{transform:translateX(-110%)}to{transform:translateX(250%)}}
@keyframes adt-loader-out{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){.adt-loader-mark,.adt-loader-mark img,.adt-loader-ring,.adt-loader-bar span{animation:none}.adt-loader-name{opacity:.95;animation:none}}
