/* ============================================================= */
/*  BASE — variabili, reset, tipografia, layout, bottoni          */
/* ============================================================= */
:root{
  --ink:#0E3A4F;        /* mare profondo — testo principale */
  --sea:#1B8CA3;        /* turchese — accento */
  --sea-deep:#146378;
  --shallow:#8FCBD1;    /* acqua bassa — tocchi chiari */
  --sand:#F6F1E7;       /* sabbia calcarea — sfondo */
  --shell:#FDFBF6;      /* conchiglia — card */
  --muted:#5C6E73;      /* testo secondario */
  --hairline:#DED7C6;
  --maxw:1180px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,sans-serif;
  color:var(--ink);
  background:var(--sand);
  line-height:1.7;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}

/* ---- tipografia ---- */
h1,h2,h3{font-family:'Cormorant',Georgia,serif;font-weight:300;line-height:1.08;letter-spacing:.01em}
.eyebrow{
  font-size:.72rem;font-weight:500;letter-spacing:.28em;text-transform:uppercase;
  color:var(--sea);margin-bottom:1.1rem;
}
.lede{font-size:1.18rem;color:var(--muted);font-weight:300;max-width:52ch}

/* ---- motivo firma: la linea d'acqua ---- */
.waterline{
  height:2px;border:none;
  background:linear-gradient(90deg,var(--shallow),var(--sea),var(--sea-deep),var(--ink));
  opacity:.65;
}

/* ---- layout ---- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1.25rem,5vw,3rem)}
section{padding:clamp(4.5rem,9vw,8rem) 0}

/* ---- bottoni (condivisi tra hero e prenota) ---- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.85rem 1.7rem;border-radius:999px;font-size:.9rem;letter-spacing:.04em;font-weight:500;
  transition:transform .2s,box-shadow .2s,background .2s;
}
.btn-primary{background:var(--sand);color:var(--ink)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.25)}
.btn-ghost{border:1px solid rgba(253,251,246,.55);color:var(--sand)}
.btn-ghost:hover{background:rgba(253,251,246,.12)}
.btn-wa{background:#25D366;color:#fff}
.btn-wa:hover{background:#1ebe5a;transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.25)}
.btn svg{flex:none}

/* ---- pulsante WhatsApp flottante (riusa lo stile .btn.btn-wa della hero) ---- */
.floating-wa{
  position:fixed;right:1.4rem;bottom:1.4rem;z-index:55;white-space:nowrap;
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(14px);
  transition:opacity .3s ease,transform .3s ease,visibility .3s;
}
.floating-wa.show{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
@media(max-width:520px){.floating-wa{right:1rem;bottom:1rem}}

/* ---- accessibilità / motion ---- */
*:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(max-width:520px){.btn{justify-content:center}}