/* ============================================================
   NIC BOAT CLUB — Design System "Diario di bordo" · 2026
   Palette: verde lago #1F3A3D · foschia #8FB4B3 · crema #F4EFE3
            terracotta #A6512F · oro sole #D9A441
   Font: Fraunces (display) · Public Sans (body) · IBM Plex Mono (dati)
   ============================================================ */

:root {
  --ink: #1F3A3D;
  --ink-deep: #16292B;
  --ink-soft: #2C4B4E;
  --mist: #8FB4B3;
  --mist-soft: #B8D0CF;
  --cream: #F4EFE3;
  --cream-warm: #EFE7D4;
  --paper: #FAF7EE;
  --terra: #A6512F;
  --terra-soft: #C4714E;
  --gold: #D9A441;
  --gold-soft: #E8C77E;

  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Public Sans", "Helvetica Neue", sans-serif;
  --font-mono: "IBM Plex Mono", "SF Mono", monospace;

  --radius: 14px;
  --radius-sm: 8px;
  --shadow-card: 0 2px 6px rgba(31,58,61,.08), 0 14px 34px rgba(31,58,61,.10);
  --shadow-float: 0 24px 60px rgba(22,41,43,.28);
  --border-log: 1px dashed rgba(31,58,61,.32);
  --ease-out: cubic-bezier(.22,1,.36,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--ink);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* Grain texture over everything */
body::before {
  content:""; position:fixed; inset:0; z-index:2000; pointer-events:none;
  opacity:.05; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection { background: var(--gold); color: var(--ink-deep); }

h1,h2,h3 { font-family: var(--font-display); font-weight: 560; line-height: 1.08; letter-spacing:-.015em; }
.mono { font-family: var(--font-mono); }

a { color: inherit; }
button { font-family: inherit; cursor: pointer; }
img, svg { max-width:100%; display:block; }

.wrap { width:min(1180px, 92vw); margin-inline:auto; }

/* ---------- shared atoms ---------- */
.eyebrow {
  font-family: var(--font-mono); font-size:.72rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--terra); display:flex; align-items:center; gap:.7rem;
}
.eyebrow::before { content:""; width:34px; height:1px; background:var(--terra); flex:none; }
.dark .eyebrow, .on-dark .eyebrow { color: var(--gold); }
.dark .eyebrow::before, .on-dark .eyebrow::before { background: var(--gold); }

.btn {
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-mono); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase;
  padding:.95rem 1.6rem; border-radius:999px; border:1.5px solid transparent;
  text-decoration:none; transition: transform .25s var(--ease-out), box-shadow .25s, background .25s, color .25s;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--terra); color: var(--cream); box-shadow: 0 10px 24px rgba(166,81,47,.35); }
.btn-primary:hover { background:#B75C37; }
.btn-gold { background: var(--gold); color: var(--ink-deep); box-shadow: 0 10px 24px rgba(217,164,65,.35); }
.btn-ghost { border-color: currentColor; background:transparent; color:inherit; }
.btn-sm { padding:.55rem 1.05rem; font-size:.72rem; }

.stamp {
  display:inline-block; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.18em;
  text-transform:uppercase; padding:.3rem .65rem; border:1.5px solid currentColor; border-radius:4px;
  transform:rotate(-2deg);
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position:sticky; top:0; z-index:900;
  background: rgba(31,58,61,.92); backdrop-filter: blur(14px);
  color: var(--cream); border-bottom:1px solid rgba(244,239,227,.14);
}
.site-header .wrap { display:flex; align-items:center; gap:2rem; padding:.8rem 0; }
.brand { display:flex; align-items:center; gap:.75rem; text-decoration:none; }
.brand-mark {
  width:42px; height:42px; border-radius:50%; flex:none; object-fit:cover;
  background:#fff; box-shadow:0 0 0 2px rgba(217,164,65,.55), 0 3px 8px rgba(0,0,0,.3);
}
.brand-name { font-family:var(--font-display); font-size:1.12rem; line-height:1.05; }
.brand-sub { font-family:var(--font-mono); font-size:.58rem; letter-spacing:.24em; text-transform:uppercase; color:var(--mist); }
.main-nav { display:flex; gap:1.6rem; margin-left:auto; }
.main-nav a {
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
  text-decoration:none; color:var(--mist-soft); transition:color .2s;
}
.main-nav a:hover { color:var(--gold); }
.header-cta { white-space:nowrap; }
.wa-ico { width:16px; height:16px; flex:none; }

/* lang switcher */
.lang-switch { position:relative; }
.lang-btn {
  display:flex; align-items:center; gap:.45rem; background:rgba(244,239,227,.08);
  border:1px solid rgba(244,239,227,.22); border-radius:999px; color:var(--cream);
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; padding:.5rem .9rem;
}
.lang-menu {
  position:absolute; right:0; top:calc(100% + 8px); background:var(--paper); color:var(--ink);
  border-radius:var(--radius-sm); box-shadow:var(--shadow-float); overflow:hidden; min-width:160px;
  opacity:0; transform:translateY(-6px); pointer-events:none; transition:.22s var(--ease-out);
}
.lang-switch.open .lang-menu { opacity:1; transform:none; pointer-events:auto; }
.lang-menu button {
  display:flex; width:100%; gap:.6rem; align-items:center; padding:.65rem 1rem;
  background:none; border:none; font-family:var(--font-mono); font-size:.78rem; letter-spacing:.06em;
}
.lang-menu button:hover { background:var(--cream-warm); }
.lang-menu button.active { color:var(--terra); font-weight:600; }

/* nav mobile */
.nav-toggle {
  display:none; background:none; border:1.5px solid rgba(244,239,227,.3); color:var(--cream);
  width:38px; height:38px; border-radius:10px; font-size:1.05rem; flex:none;
}
.mobile-menu {
  display:none; position:absolute; left:0; right:0; top:100%;
  background:var(--ink-deep); border-bottom:1px solid rgba(217,164,65,.35);
  flex-direction:column; padding:.6rem 4vw 1.1rem;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  font-family:var(--font-mono); font-size:.85rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--cream); text-decoration:none; padding:.85rem .2rem;
  border-bottom:1px dashed rgba(143,180,179,.25);
}
.mobile-menu a:active { color:var(--gold); }
@media (max-width: 900px) {
  .main-nav { display:none; }
  .nav-toggle { display:grid; place-items:center; margin-left:0; }
  .brand { margin-right:auto; }
  .header-cta span.label { display:none; }
  .header-cta { padding:.6rem; border-radius:50%; }
  .header-cta .wa-ico { width:19px; height:19px; }
  .site-header .wrap { gap:.55rem; }
  .brand-name { font-size:1rem; white-space:nowrap; }
  .brand-sub { display:none; }
  .brand-mark { width:36px; height:36px; }
  .lang-btn { padding:.45rem .7rem; }
}

/* barra CTA fissa su mobile */
.mobile-cta {
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:1200;
  background:rgba(22,41,43,.96); backdrop-filter:blur(12px);
  border-top:1px solid rgba(217,164,65,.4);
  padding:.65rem 4vw calc(.65rem + env(safe-area-inset-bottom)); gap:.7rem;
}
.mobile-cta .btn { flex:1; justify-content:center; padding:.85rem 1rem; }
@media (max-width: 760px) {
  .mobile-cta { display:flex; }
  body { padding-bottom:76px; }
  .toast { bottom:88px; }
}

/* header compatto allo scroll */
.site-header .wrap { transition:padding .3s var(--ease-out); }
.site-header.scrolled .wrap { padding:.45rem 0; }

/* accessibilità */
:focus-visible { outline:2px solid var(--gold); outline-offset:2px; border-radius:4px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal, .sr { opacity:1; transform:none; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position:relative; background:
    radial-gradient(1100px 500px at 78% -10%, rgba(217,164,65,.16), transparent 60%),
    linear-gradient(178deg, var(--ink) 0%, var(--ink-deep) 82%);
  color:var(--cream); overflow:hidden;
}
.hero .wrap { position:relative; z-index:3; padding:6.5rem 0 9rem; }
.hero-coords {
  position:absolute; top:2rem; right:0; font-family:var(--font-mono); font-size:.68rem;
  letter-spacing:.2em; color:var(--mist); writing-mode:vertical-rl; opacity:.75;
}
.hero h1 {
  font-size:clamp(2.9rem, 7vw, 5.6rem); max-width:13ch; margin:1.4rem 0 1.6rem;
}
.hero h1 em { font-style:italic; color:var(--gold); }
.hero-sub { max-width:52ch; font-size:1.08rem; color:var(--mist-soft); margin-bottom:2.4rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:1rem; }
.hero-trust { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; color:var(--mist); margin-top:1.1rem; }
.hero-trust::before { content:"✓ "; color:var(--gold); }

.hero-stats {
  margin-top:3.6rem; display:flex; flex-wrap:wrap; gap:0;
  border-top:1px dashed rgba(143,180,179,.4);
}
.hero-stat { padding:1.2rem 2.2rem 1.2rem 0; margin-right:2.2rem; border-right:1px dashed rgba(143,180,179,.28); }
.hero-stat:last-child { border-right:none; }
.hero-stat .num { font-family:var(--font-mono); font-size:1.6rem; color:var(--gold); }
.hero-stat .lbl { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--mist); }

/* animated water */
.hero-water { position:absolute; left:0; right:0; bottom:-2px; z-index:2; }
.hero-water svg { width:100%; height:130px; }
.wave { animation: drift 9s linear infinite; }
.wave.w2 { animation-duration:14s; animation-direction:reverse; opacity:.5; }
.wave.w3 { animation-duration:20s; opacity:.3; }
@keyframes drift { from { transform:translateX(0);} to { transform:translateX(-260px);} }

.hero-boat {
  position:absolute; right:6vw; bottom:96px; z-index:2; width:min(300px,30vw);
  animation: bob 5.2s ease-in-out infinite; filter:drop-shadow(0 18px 24px rgba(0,0,0,.35));
}
@keyframes bob { 0%,100%{transform:translateY(0) rotate(-1.2deg);} 50%{transform:translateY(-9px) rotate(1.4deg);} }

.reveal { opacity:0; transform:translateY(26px); animation:rise .9s var(--ease-out) forwards; }
.reveal.d1{animation-delay:.12s} .reveal.d2{animation-delay:.24s} .reveal.d3{animation-delay:.38s} .reveal.d4{animation-delay:.52s}
@keyframes rise { to { opacity:1; transform:none; } }

/* marquee */
.marquee { background:var(--gold); color:var(--ink-deep); overflow:hidden; padding:.7rem 0; border-block:2px solid var(--ink-deep); }
.marquee-track { display:flex; gap:3rem; width:max-content; animation:marq 30s linear infinite; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.2em; text-transform:uppercase; white-space:nowrap; }
.marquee-track span::after { content:"✦"; margin-left:3rem; opacity:.55; }
@keyframes marq { to { transform:translateX(-50%);} }

/* ============================================================
   SECTIONS
   ============================================================ */
section { padding:6rem 0; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; margin-bottom:3.2rem; flex-wrap:wrap; }
.section-head h2 { font-size:clamp(2rem,4.4vw,3.2rem); max-width:18ch; margin-top:1rem; }
.section-head p.lead { max-width:44ch; color:var(--ink-soft); }

/* ---- Storia ---- */
.storia { background:var(--paper); position:relative; }
.storia-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap:4rem; align-items:start; }
@media (max-width:900px){ .storia-grid{grid-template-columns:1fr;} }
.log-entries { display:flex; flex-direction:column; gap:0; border-left:var(--border-log); }
.log-entry { position:relative; padding:1.4rem 0 1.4rem 2rem; border-bottom:var(--border-log); }
.log-entry:last-child { border-bottom:none; }
.log-entry::before {
  content:""; position:absolute; left:-7px; top:1.9rem; width:13px; height:13px; border-radius:50%;
  background:var(--gold); border:3px solid var(--paper); box-shadow:0 0 0 1.5px var(--terra);
}
.log-entry .when { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.18em; color:var(--terra); text-transform:uppercase; }
.log-entry h3 { font-size:1.3rem; margin:.35rem 0 .4rem; }
.log-entry p { color:var(--ink-soft); font-size:.95rem; max-width:52ch; }

.crew-card {
  background:var(--ink); color:var(--cream); border-radius:var(--radius); padding:2.2rem;
  transform:rotate(1.1deg); box-shadow:var(--shadow-float); position:sticky; top:110px;
}
.crew-card h3 { color:var(--gold); font-size:1.4rem; margin-bottom:1.2rem; }
.crew-row { display:flex; gap:1rem; align-items:center; padding:.85rem 0; border-bottom:1px dashed rgba(143,180,179,.3); }
.crew-row:last-of-type { border-bottom:none; }
.crew-avatar {
  width:48px; height:48px; border-radius:50%; flex:none; display:grid; place-items:center;
  font-family:var(--font-display); font-size:1.2rem; color:var(--ink-deep);
  background:linear-gradient(135deg, var(--mist), var(--mist-soft));
}
.crew-row:nth-child(3) .crew-avatar { background:linear-gradient(135deg,var(--gold),var(--gold-soft)); }
.crew-row:nth-child(4) .crew-avatar { background:linear-gradient(135deg,var(--terra-soft),var(--gold-soft)); }
.crew-row .role { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mist); }

/* ---- Flotta ---- */
.flotta { background:var(--cream); }
.fleet-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; }
@media (max-width:1000px){ .fleet-grid{grid-template-columns:1fr; max-width:560px; margin-inline:auto;} }
.boat-card {
  background:var(--paper); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-card);
  display:flex; flex-direction:column; transition:transform .35s var(--ease-out), box-shadow .35s;
}
.boat-card:hover { transform:translateY(-8px) rotate(-.4deg); box-shadow:var(--shadow-float); }
.boat-photo { position:relative; aspect-ratio:4/2.7; overflow:hidden; }
.boat-photo svg { width:100%; height:100%; }
.photo-note {
  position:absolute; left:.8rem; bottom:.8rem; background:rgba(250,247,238,.92); color:var(--ink-soft);
  font-family:var(--font-mono); font-size:.56rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.3rem .6rem; border-radius:4px; border:1px dashed var(--terra);
}
.boat-flag {
  position:absolute; top:.9rem; right:-.4rem; background:var(--terra); color:var(--cream);
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase;
  padding:.35rem .9rem .35rem .7rem; clip-path:polygon(0 0,100% 0,100% 100%,0 100%,8px 50%);
}
.boat-flag.gold { background:var(--gold); color:var(--ink-deep); }
.boat-body { padding:1.6rem 1.6rem 1.8rem; display:flex; flex-direction:column; flex:1; }
.boat-body h3 { font-size:1.7rem; }
.boat-body h3 small { font-family:var(--font-mono); font-size:.66rem; letter-spacing:.14em; color:var(--terra); display:block; margin-top:.2rem; text-transform:uppercase; font-weight:400; }
.spec-table { width:100%; border-collapse:collapse; margin:1.1rem 0 1.2rem; font-family:var(--font-mono); font-size:.76rem; }
.spec-table td { padding:.42rem 0; border-bottom:1px dashed rgba(31,58,61,.2); }
.spec-table td:last-child { text-align:right; font-weight:600; }
.price-rows { margin-bottom:1.4rem; }
.price-row { display:flex; justify-content:space-between; align-items:baseline; font-family:var(--font-mono); font-size:.8rem; padding:.3rem 0; }
.price-row .season { font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
.price-row strong { color:var(--terra); font-size:1rem; }
.boat-body .btn { margin-top:auto; justify-content:center; }

/* ============================================================
   CALENDARIO — il "logbook"
   ============================================================ */
.calendario { background:var(--ink); color:var(--cream); position:relative; overflow:hidden; }
.calendario::before {
  content:""; position:absolute; inset:0; opacity:.06; pointer-events:none;
  background-image:repeating-linear-gradient(0deg, transparent 0 34px, var(--mist) 34px 35px);
}
.calendario .section-head h2 { color:var(--cream); }
.calendario .section-head p.lead { color:var(--mist-soft); }

.logbook {
  background:var(--paper); color:var(--ink); border-radius:var(--radius);
  box-shadow:var(--shadow-float); position:relative; z-index:2;
  display:grid; grid-template-columns: 1.45fr 1fr; min-height:620px; overflow:hidden;
}
@media (max-width:980px){ .logbook{grid-template-columns:1fr;} }
.logbook::after { /* spine */
  content:""; position:absolute; left:calc(59.18% - 1px); top:0; bottom:0; width:2px;
  background:repeating-linear-gradient(0deg, var(--terra) 0 8px, transparent 8px 16px); opacity:.35;
}
@media (max-width:980px){ .logbook::after{display:none;} }

.logbook-left { padding:2rem 2.2rem 2.4rem; }
.logbook-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.4rem; flex-wrap:wrap; }
.logbook-title { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; color:var(--terra); }

.boat-tabs { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1.3rem; }
.boat-tab {
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.5rem 1rem; border-radius:999px; border:1.5px solid var(--ink); background:transparent; color:var(--ink);
  transition:.2s;
}
.boat-tab.active { background:var(--ink); color:var(--gold); }
.boat-tab:hover:not(.active) { background:rgba(31,58,61,.08); }

.month-nav { display:flex; align-items:center; gap:.8rem; }
.month-nav button {
  width:34px; height:34px; border-radius:50%; border:1.5px solid var(--ink); background:none;
  font-size:1rem; display:grid; place-items:center; transition:.2s;
}
.month-nav button:hover:not(:disabled) { background:var(--ink); color:var(--gold); }
.month-nav button:disabled { opacity:.25; cursor:default; }
.month-label { font-family:var(--font-display); font-size:1.5rem; min-width:9.5ch; text-align:center; font-style:italic; }

.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.cal-dow { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; text-align:center; color:var(--terra); padding-bottom:.4rem; }
.cal-day {
  aspect-ratio:1/.92; border:1px dashed rgba(31,58,61,.3); border-radius:var(--radius-sm);
  background:none; padding:.35rem .45rem; display:flex; flex-direction:column; justify-content:space-between;
  font-family:var(--font-mono); transition:.18s; position:relative; color:var(--ink);
}
.cal-day .n { font-size:.82rem; }
.cal-day .ticks { display:flex; gap:3px; }
.cal-day .tick { width:100%; height:5px; border-radius:2px; flex:1; }
.tick.free { background:var(--mist); }
.tick.pending { background:var(--gold); }
.tick.booked { background:var(--terra); }
.tick.closed { background:rgba(31,58,61,.22); }
.tick.past { background:rgba(31,58,61,.1); }
.cal-day:not(:disabled):hover { border-style:solid; border-color:var(--terra); transform:translateY(-2px); background:#fff; box-shadow:0 6px 14px rgba(31,58,61,.12); }
.cal-day.selected { border-style:solid; border-color:var(--terra); background:#fff; box-shadow:0 6px 14px rgba(166,81,47,.22); }
.cal-day.selected::after { content:"✦"; position:absolute; top:2px; right:5px; color:var(--terra); font-size:.6rem; }
.cal-day:disabled { opacity:.38; cursor:default; }
.cal-day.other { visibility:hidden; }
.cal-day.today { border:1.5px solid var(--gold); border-style:solid; }
.cal-day.today .n::after { content:"●"; font-size:.45rem; color:var(--gold); margin-left:3px; vertical-align:2px; }

/* suggerimento "primo giorno libero" */
.next-free {
  display:inline-flex; align-items:center; gap:.55rem; margin-top:1.1rem;
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase;
  background:rgba(217,164,65,.16); border:1.5px dashed var(--gold); color:var(--ink);
  padding:.6rem 1rem; border-radius:999px; transition:.2s;
}
.next-free:hover { background:var(--gold); color:var(--ink-deep); transform:translateY(-2px); }
.next-free strong { color:var(--terra); }
.next-free:hover strong { color:var(--ink-deep); }
.day-full-msg { font-family:var(--font-mono); font-size:.72rem; color:var(--terra); margin-top:.9rem; letter-spacing:.06em; }

.cal-legend { display:flex; flex-wrap:wrap; gap:1.2rem; margin-top:1.2rem; font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
.cal-legend span { display:flex; align-items:center; gap:.45rem; }
.cal-legend i { width:14px; height:6px; border-radius:2px; display:inline-block; }

/* right page: day detail */
.logbook-right { background:var(--cream-warm); padding:2rem 2.2rem 2.4rem; display:flex; flex-direction:column; }
.day-placeholder { margin:auto; text-align:center; color:var(--ink-soft); max-width:26ch; }
.day-placeholder .compass { font-size:2.6rem; display:block; margin-bottom:1rem; animation:spin 14s linear infinite; }
@keyframes spin { to{transform:rotate(360deg);} }
.day-head { border-bottom:2px solid var(--ink); padding-bottom:1rem; margin-bottom:1.2rem; }
.day-head .d { font-family:var(--font-mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--terra); }
.day-head h3 { font-size:1.7rem; font-style:italic; }

.slot-list { display:flex; flex-direction:column; gap:.9rem; }
.slot-ticket {
  display:flex; align-items:center; gap:1rem; background:var(--paper);
  border-radius:var(--radius-sm); padding:1rem 1.1rem; position:relative;
  border:1px solid rgba(31,58,61,.14); box-shadow:0 3px 10px rgba(31,58,61,.07);
}
.slot-ticket::before, .slot-ticket::after {
  content:""; position:absolute; width:14px; height:14px; border-radius:50%;
  background:var(--cream-warm); top:50%; transform:translateY(-50%);
  border:1px solid rgba(31,58,61,.14);
}
.slot-ticket::before { left:-8px; border-left-color:transparent; }
.slot-ticket::after { right:-8px; border-right-color:transparent; }
.slot-info { flex:1; }
.slot-name { font-family:var(--font-display); font-size:1.05rem; }
.slot-time { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; color:var(--ink-soft); }
.slot-price { font-family:var(--font-mono); font-weight:600; color:var(--terra); white-space:nowrap; }
.slot-ticket .btn { flex:none; }
.slot-ticket.is-busy { opacity:.62; }
.slot-status {
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  padding:.3rem .6rem; border-radius:4px; white-space:nowrap;
}
.slot-status.booked { background:rgba(166,81,47,.14); color:var(--terra); }
.slot-status.pending { background:rgba(217,164,65,.2); color:#8a6511; }
.slot-status.closed { background:rgba(31,58,61,.12); color:var(--ink-soft); }

.day-note { margin-top:auto; padding-top:1.4rem; font-size:.78rem; color:var(--ink-soft); font-family:var(--font-mono); }

/* ============================================================
   BOOKING MODAL
   ============================================================ */
.modal-backdrop {
  position:fixed; inset:0; z-index:1500; background:rgba(22,41,43,.62); backdrop-filter:blur(6px);
  display:grid; place-items:center; padding:1.2rem; opacity:0; pointer-events:none; transition:.3s;
}
.modal-backdrop.open { opacity:1; pointer-events:auto; }
.modal {
  background:var(--paper); border-radius:var(--radius); width:min(560px,100%); max-height:92vh; overflow:auto;
  box-shadow:var(--shadow-float); transform:translateY(24px) scale(.97); transition:.35s var(--ease-out);
}
.modal-backdrop.open .modal { transform:none; }
.modal-head { background:var(--ink); color:var(--cream); padding:1.6rem 2rem; position:relative; }
.modal-head h3 { color:var(--gold); font-size:1.5rem; }
.modal-head .sub { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--mist); margin-top:.3rem; }
.modal-close { position:absolute; top:1.1rem; right:1.1rem; background:none; border:1.5px solid var(--mist); color:var(--mist); width:32px; height:32px; border-radius:50%; }
.modal-body { padding:1.8rem 2rem 2rem; }
.booking-summary {
  font-family:var(--font-mono); font-size:.78rem; border:var(--border-log); border-radius:var(--radius-sm);
  padding:1rem 1.2rem; margin-bottom:1.5rem; background:var(--cream);
}
.booking-summary div { display:flex; justify-content:space-between; padding:.25rem 0; }
.booking-summary .tot { border-top:1px solid var(--ink); margin-top:.4rem; padding-top:.55rem; font-weight:600; color:var(--terra); }
.field { margin-bottom:1.1rem; }
.field label { display:block; font-family:var(--font-mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:.4rem; }
.field input, .field select, .field textarea {
  width:100%; padding:.8rem 1rem; border:1.5px solid rgba(31,58,61,.3); border-radius:var(--radius-sm);
  background:#fff; font-family:var(--font-body); font-size:.95rem; color:var(--ink); transition:border-color .2s;
}
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color:var(--terra); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.modal-actions { display:flex; flex-direction:column; gap:.7rem; margin-top:1.5rem; }
.modal-actions .btn { justify-content:center; }
.modal-fine { font-size:.72rem; color:var(--ink-soft); text-align:center; margin-top:1rem; font-family:var(--font-mono); }

.booking-done { text-align:center; padding:1rem 0; }
.booking-done .big { font-size:3rem; }
.booking-done h4 { font-family:var(--font-display); font-size:1.5rem; margin:.6rem 0; }
.booking-done p { color:var(--ink-soft); font-size:.92rem; max-width:38ch; margin-inline:auto; }

/* ============================================================
   ITINERARI
   ============================================================ */
.itinerari { background:var(--cream); }
.route-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; }
@media (max-width:1000px){ .route-grid{grid-template-columns:1fr; max-width:560px; margin-inline:auto;} }
.route-card {
  border-radius:var(--radius); overflow:hidden; background:var(--ink); color:var(--cream);
  display:flex; flex-direction:column; box-shadow:var(--shadow-card);
  transition:transform .35s var(--ease-out);
}
.route-card:hover { transform:translateY(-8px); }
.route-card:nth-child(2) { background:var(--terra); }
.route-card:nth-child(2) .route-log { border-color:rgba(244,239,227,.35); }
.route-card:nth-child(3) { background:#3E5C5E; }
.route-map { aspect-ratio:16/8; position:relative; }
.route-map svg { width:100%; height:100%; }
.route-body { padding:1.6rem 1.7rem 1.9rem; flex:1; display:flex; flex-direction:column; }
.route-body h3 { color:var(--gold-soft); font-size:1.45rem; margin-bottom:.3rem; }
.route-card:nth-child(2) .route-body h3 { color:var(--cream); }
.route-body .meta { font-family:var(--font-mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; opacity:.8; margin-bottom:1rem; }
.route-body p { font-size:.9rem; opacity:.88; margin-bottom:1.2rem; }
.route-log { border-top:1px dashed rgba(143,180,179,.4); margin-top:auto; padding-top:1rem; font-family:var(--font-mono); font-size:.72rem; }
.route-log div { display:flex; justify-content:space-between; padding:.24rem 0; }
.route-log .wp::before { content:"◆ "; color:var(--gold); font-size:.6rem; }

/* dashed route line animation */
.route-path { stroke-dasharray:6 7; animation:dashmove 2.4s linear infinite; }
@keyframes dashmove { to { stroke-dashoffset:-26; } }

/* ============================================================
   RECENSIONI
   ============================================================ */
.recensioni { background:var(--paper); overflow:hidden; }
.rating-hero { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; margin-bottom:3rem; }
.rating-big { font-family:var(--font-display); font-size:4.6rem; line-height:1; color:var(--terra); font-style:italic; }
.rating-meta .stars { color:var(--gold); font-size:1.4rem; letter-spacing:.15em; }
.rating-meta .src { font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-top:.3rem; }
.review-rows {
  display:flex; flex-direction:column; gap:1.4rem;
  mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
.review-row { display:flex; gap:1.4rem; width:max-content; animation:marq 70s linear infinite; }
.review-row.reverse { animation-direction:reverse; animation-duration:84s; }
.review-rows:hover .review-row { animation-play-state:paused; }
.review-card {
  width:340px; flex:none; background:var(--cream); border-radius:var(--radius);
  padding:1.5rem 1.6rem; border:1px solid rgba(31,58,61,.12); box-shadow:0 4px 12px rgba(31,58,61,.06);
  display:flex; flex-direction:column; gap:.7rem;
}
.review-top { display:flex; justify-content:space-between; align-items:center; }
.review-top .who { font-family:var(--font-display); font-size:1.02rem; }
.review-lang { font-family:var(--font-mono); font-size:.58rem; letter-spacing:.14em; border:1px solid var(--mist); color:var(--ink-soft); border-radius:4px; padding:.15rem .45rem; }
.review-stars { color:var(--gold); font-size:.85rem; letter-spacing:.1em; }
.review-card p { font-size:.88rem; color:var(--ink-soft); }
.review-when { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--terra); margin-top:auto; }

/* ============================================================
   INFO + FOOTER
   ============================================================ */
.info-pratiche { background:var(--cream-warm); }
.faq-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem; }
@media (max-width:800px){ .faq-grid{grid-template-columns:1fr;} }
.faq-item { background:var(--paper); border-radius:var(--radius-sm); padding:1.5rem 1.7rem; border-left:4px solid var(--gold); }
.faq-item h3 { font-size:1.08rem; margin-bottom:.5rem; }
.faq-item p { font-size:.9rem; color:var(--ink-soft); }

.site-footer { background:var(--ink-deep); color:var(--mist-soft); padding:5rem 0 2.5rem; position:relative; overflow:hidden; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:3rem; margin-bottom:3.5rem; }
@media (max-width:800px){ .footer-grid{grid-template-columns:1fr;} }
.site-footer h3 { color:var(--cream); font-size:1.9rem; max-width:16ch; }
.site-footer h4 { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
.footer-list { list-style:none; display:flex; flex-direction:column; gap:.55rem; font-size:.9rem; }
.footer-list a { text-decoration:none; transition:color .2s; }
.footer-list a:hover { color:var(--gold); }
.footer-list .mono { font-size:.8rem; }
.footer-bottom { border-top:1px dashed rgba(143,180,179,.25); padding-top:1.6rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-family:var(--font-mono); font-size:.66rem; letter-spacing:.1em; color:var(--mist); }
.footer-bottom a { color:var(--gold); }

.todo-tag {
  display:inline-block; font-family:var(--font-mono); font-size:.58rem; letter-spacing:.12em;
  background:rgba(217,164,65,.18); color:var(--gold); border:1px dashed var(--gold);
  padding:.15rem .5rem; border-radius:4px; text-transform:uppercase;
}

/* toast */
.toast {
  position:fixed; bottom:1.4rem; left:50%; transform:translate(-50%, 20px); z-index:1800;
  background:var(--ink); color:var(--cream); font-family:var(--font-mono); font-size:.78rem;
  padding:.9rem 1.5rem; border-radius:999px; box-shadow:var(--shadow-float);
  opacity:0; pointer-events:none; transition:.35s var(--ease-out);
  border:1px solid rgba(217,164,65,.5);
}
.toast.show { opacity:1; transform:translate(-50%,0); }

/* scroll reveal */
.sr { opacity:0; transform:translateY(30px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.sr.in { opacity:1; transform:none; }

/* ============================================================
   ADMIN — "Quaderno del gestore"
   ============================================================ */
body.admin { background:var(--ink-deep); color:var(--cream); }
.admin-shell { display:grid; grid-template-columns:250px 1fr; min-height:100vh; }
@media (max-width:900px){ .admin-shell{grid-template-columns:1fr;} .admin-side{position:static;} }
.admin-side {
  background:var(--ink); border-right:1px dashed rgba(143,180,179,.25); padding:1.8rem 1.4rem;
  display:flex; flex-direction:column; gap:.4rem; position:sticky; top:0; height:100vh;
}
@media (max-width:900px){ .admin-side{height:auto; flex-direction:row; flex-wrap:wrap; align-items:center;} }
.admin-side .brand { margin-bottom:2rem; }
@media (max-width:900px){ .admin-side .brand{margin-bottom:0; margin-right:auto;} }
.admin-nav-btn {
  display:flex; align-items:center; gap:.8rem; width:100%; text-align:left;
  background:none; border:none; color:var(--mist-soft); font-family:var(--font-mono);
  font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; padding:.85rem 1rem; border-radius:var(--radius-sm);
  transition:.2s; border-left:3px solid transparent;
}
@media (max-width:900px){ .admin-nav-btn{width:auto;} }
.admin-nav-btn:hover { color:var(--cream); background:rgba(244,239,227,.06); }
.admin-nav-btn.active { color:var(--gold); background:rgba(217,164,65,.1); border-left-color:var(--gold); }
.admin-nav-btn .badge {
  margin-left:auto; background:var(--terra); color:var(--cream); font-size:.62rem;
  min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; padding:0 .35rem;
}
.admin-side .back-site { margin-top:auto; font-size:.68rem; color:var(--mist); text-decoration:none; font-family:var(--font-mono); letter-spacing:.1em; }
.admin-side .back-site:hover { color:var(--gold); }

.admin-main { padding:2.4rem 3rem 4rem; }
@media (max-width:900px){ .admin-main{padding:1.6rem 1.2rem 3rem;} }
.admin-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:2.2rem; flex-wrap:wrap; }
.admin-head h1 { font-size:2.3rem; color:var(--cream); }
.admin-head h1 em { color:var(--gold); font-style:italic; }
.admin-head .date { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mist); }

.stat-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-bottom:2.4rem; }
@media (max-width:900px){ .stat-cards{grid-template-columns:repeat(2,1fr);} }
.stat-card { background:var(--ink); border:1px dashed rgba(143,180,179,.3); border-radius:var(--radius-sm); padding:1.3rem 1.4rem; }
.stat-card .v { font-family:var(--font-mono); font-size:1.9rem; color:var(--gold); }
.stat-card .k { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase; color:var(--mist); }

.panel { background:var(--paper); color:var(--ink); border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-float); }
.panel + .panel { margin-top:1.6rem; }
.panel h2 { font-size:1.5rem; margin-bottom:1.4rem; }

/* requests list */
.req-item {
  display:grid; grid-template-columns:auto 1fr auto; gap:1.2rem; align-items:center;
  border:1px solid rgba(31,58,61,.14); border-left:5px solid var(--gold); border-radius:var(--radius-sm);
  padding:1.1rem 1.3rem; margin-bottom:1rem; background:var(--cream);
}
.req-item.st-confermata { border-left-color:var(--mist); opacity:.85; }
.req-item.st-annullata, .req-item.st-rifiutata { border-left-color:rgba(31,58,61,.3); opacity:.6; }
.req-item.st-proposta { border-left-color:var(--terra); }
.req-avatar { width:44px; height:44px; border-radius:50%; background:var(--ink); color:var(--gold); display:grid; place-items:center; font-family:var(--font-display); }
.req-info .name { font-family:var(--font-display); font-size:1.06rem; }
.req-info .detail { font-family:var(--font-mono); font-size:.7rem; color:var(--ink-soft); letter-spacing:.05em; margin-top:.2rem; }
.req-info .note { font-size:.8rem; color:var(--ink-soft); font-style:italic; margin-top:.3rem; }
.req-actions { display:flex; gap:.5rem; flex-wrap:wrap; justify-content:flex-end; }
.req-btn {
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.5rem .85rem; border-radius:999px; border:1.5px solid; background:none; transition:.2s;
}
.req-btn.ok { border-color:var(--ink); color:var(--ink); }
.req-btn.ok:hover { background:var(--ink); color:var(--gold); }
.req-btn.no { border-color:var(--terra); color:var(--terra); }
.req-btn.no:hover { background:var(--terra); color:var(--cream); }
.req-btn.alt { border-color:var(--gold); color:#8a6511; }
.req-btn.alt:hover { background:var(--gold); color:var(--ink-deep); }
.st-pill { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; padding:.3rem .7rem; border-radius:4px; }
.st-pill.richiesta { background:rgba(217,164,65,.2); color:#8a6511; }
.st-pill.confermata { background:rgba(143,180,179,.28); color:var(--ink); }
.st-pill.rifiutata, .st-pill.annullata { background:rgba(31,58,61,.12); color:var(--ink-soft); }
.st-pill.proposta { background:rgba(166,81,47,.15); color:var(--terra); }
@media (max-width:760px){ .req-item{grid-template-columns:1fr;} .req-actions{justify-content:flex-start;} }

/* admin calendar */
.admin-cal-controls { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; margin-bottom:1.4rem; }
.slot-grid-table { width:100%; border-collapse:collapse; font-family:var(--font-mono); font-size:.7rem; }
.slot-grid-table th { text-align:left; padding:.5rem .4rem; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--terra); border-bottom:2px solid var(--ink); }
.slot-grid-table td { padding:.35rem .4rem; border-bottom:1px dashed rgba(31,58,61,.18); }
.slot-cell {
  width:100%; border:none; border-radius:4px; padding:.45rem .3rem; font-family:var(--font-mono);
  font-size:.6rem; letter-spacing:.06em; text-transform:uppercase; transition:.15s;
}
.slot-cell.free { background:rgba(143,180,179,.3); color:var(--ink); }
.slot-cell.free:hover { background:var(--mist); }
.slot-cell.closed { background:rgba(31,58,61,.75); color:var(--cream); }
.slot-cell.booked { background:var(--terra); color:var(--cream); cursor:default; }
.slot-cell.pending { background:var(--gold); color:var(--ink-deep); cursor:default; }
.slot-cell.past { background:rgba(31,58,61,.07); color:rgba(31,58,61,.4); cursor:default; }

/* fleet admin */
.fleet-row {
  display:grid; grid-template-columns:auto 1fr repeat(4,110px) auto; gap:1rem; align-items:center;
  padding:1rem 1.2rem; border:1px solid rgba(31,58,61,.14); border-radius:var(--radius-sm);
  margin-bottom:.9rem; background:var(--cream);
}
@media (max-width:900px){ .fleet-row{grid-template-columns:1fr 1fr; } }
.fleet-row .b-name { font-family:var(--font-display); font-size:1.1rem; }
.fleet-row .b-spec { font-family:var(--font-mono); font-size:.64rem; color:var(--ink-soft); }
.fleet-row input[type=number] {
  width:100%; padding:.5rem .6rem; border:1.5px solid rgba(31,58,61,.3); border-radius:6px;
  font-family:var(--font-mono); font-size:.78rem; background:#fff;
}
.fleet-row .price-lbl { font-size:.54rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); font-family:var(--font-mono); display:block; margin-bottom:.25rem; }

/* ============================================================
   MOBILE — hero compatta: testo subito visibile
   (in fondo al file per vincere sulle regole base)
   ============================================================ */
@media (max-width: 760px) {
  .hero { padding:1rem 0 0; }
  .hero .wrap { padding:2.6rem 0 7.5rem; }
  .hero-coords { display:none; }
  .hero h1 { margin:1rem 0 1.2rem; }
  .hero-sub { margin-bottom:1.8rem; }
  .hero-stats { margin-top:2.2rem; }
  .hero-stat { padding:.9rem 1.4rem .9rem 0; margin-right:1.4rem; }
  .hero-boat { width:150px; bottom:80px; }
}