/* =========================================================
   IL TOCCO INVISIBILE — sistema di design "Atlantide"
   Palette: blu oceano profondo + oro antico
   Versione 2 — niente animazioni, contrasto testo a prova di errore
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Jost:wght@300;400;500;600&display=swap');

:root{
  /* colore */
  --abyss:   #061826;
  --deep:    #0c3350;
  --deep-2:  #124a68;
  --teal:    #0f4a48;
  --teal-2:  #17615d;
  --gold:    #c8a35c;
  --gold-2:  #e6cd8f;
  --gold-dim: rgba(200,163,92,0.35);
  --foam:    #f3efe4;
  --foam-2:  #e9e2d0;
  --ink:     #0b2131;
  --aqua:    #7fc2b8;

  /* tipografia */
  --f-display: 'Cinzel', serif;
  --f-quote:   'Cormorant Garamond', serif;
  --f-body:    'Jost', sans-serif;

  --maxw: 1120px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--foam);
  color:var(--ink);
  font-family:var(--f-body);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{
  font-family:var(--f-display);
  font-weight:600;
  letter-spacing:.04em;
  margin:0 0 .6em;
  color:var(--deep);
}
p{ margin:0 0 1.1em; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }
.section{ padding:96px 0; }
.section.tight{ padding:64px 0; }

/* =========================================================
   SISTEMA DI CONTRASTO — regola unica e a prova di errore.
   Qualunque sezione/blocco marcato come "scuro" rende chiaro
   TUTTO il testo al suo interno (titoli, paragrafi, liste),
   cosi non capita piu che un titolo resti blu scuro su sfondo
   blu scuro. Le classi di accento (oro, prezzi, pulsanti...)
   sono dichiarate PIU IN BASSO in questo file e vincono sempre
   su questa regola generale.
   ========================================================= */
.on-dark, .on-dark *,
.on-teal, .on-teal *,
.hero, .hero *,
.site-header, .site-header *{
  color:var(--foam);
}

.on-dark{ background:linear-gradient(160deg,var(--abyss),var(--deep) 55%,var(--deep-2)); }
.on-teal{ background:linear-gradient(160deg,var(--abyss),var(--teal) 60%,var(--teal-2)); }

.eyebrow{
  font-family:var(--f-display);
  font-size:.72rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--gold);
  display:block;
  margin-bottom:.9em;
}
.lede{
  font-family:var(--f-quote);
  font-style:italic;
  font-size:1.35rem;
  color:var(--deep-2);
  line-height:1.55;
}
.on-dark .lede, .on-teal .lede, .hero .lede{ color:var(--gold-2); }

/* ---------- sigillo di Atlantide (elemento firma) ---------- */
.sigil{ display:block; }
.sigil circle, .sigil path, .sigil line{
  fill:none; stroke:var(--gold); stroke-width:1;
}
.sigil-divider{
  display:flex; align-items:center; justify-content:center;
  gap:18px; margin:2.4em 0; opacity:.9;
}
.sigil-divider .bar{ height:1px; width:56px; background:var(--gold-dim); }

/* ---------- header / nav ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(6,24,38,0.96);
  border-bottom:1px solid var(--gold-dim);
}
.nav{
  max-width:var(--maxw); margin:0 auto; padding:14px 28px;
  display:flex; align-items:center; justify-content:space-between;
}
.brand{
  display:flex; align-items:center; gap:12px;
}
.brand-logo{
  width:40px; height:40px; object-fit:contain; flex-shrink:0;
  background:radial-gradient(circle at 35% 30%, #fff, var(--foam-2));
  border:1px solid var(--gold-dim); border-radius:50%;
  padding:5px; box-shadow:0 2px 8px rgba(0,0,0,0.25);
}
.footer-logo{
  width:56px; height:56px; object-fit:contain; margin-bottom:14px;
  background:radial-gradient(circle at 35% 30%, #fff, var(--foam-2));
  border:1px solid var(--gold-dim); border-radius:50%;
  padding:7px; box-shadow:0 2px 8px rgba(0,0,0,0.25);
}
.brand .word{ font-family:var(--f-display); font-size:1.02rem; letter-spacing:.18em; text-transform:uppercase; }
.brand .word small{ display:block; font-family:var(--f-quote); font-style:italic; font-size:.7rem; letter-spacing:.02em; color:var(--gold-2); text-transform:none; margin-top:2px; }

.navlinks{ display:flex; align-items:center; gap:28px; list-style:none; margin:0; padding:0; }
.navlinks a{
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--foam-2); position:relative; padding-bottom:4px;
}
.navlinks a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:left;
  transition:transform .3s ease;
}
.navlinks a:hover::after, .navlinks a.active::after{ transform:scaleX(1); }
.navlinks a.active{ color:var(--gold-2); }

/* ---------- menu a tendina "Chi sono" > "Certificazioni" ---------- */
.has-dropdown{ position:relative; }
.caret{ font-size:.6em; margin-left:4px; opacity:.7; cursor:pointer; }
.dropdown{
  list-style:none; margin:0; padding:10px 0;
  position:absolute; top:100%; left:50%; transform:translate(-50%,-6px);
  min-width:190px; background:rgba(6,24,38,0.98); border:1px solid var(--gold-dim);
  opacity:0; visibility:hidden; transition:.2s ease; z-index:60;
}
.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown{
  opacity:1; visibility:visible; transform:translate(-50%,0);
}
.dropdown a{
  display:block; padding:10px 20px; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--foam-2); white-space:nowrap;
}
.dropdown a::after{ display:none; }
.dropdown a:hover, .dropdown a.active{ color:var(--gold-2); }

@media (max-width: 860px){
  .dropdown{
    position:static; opacity:1; visibility:visible; transform:none;
    background:none; border:none; padding:0; min-width:0;
    max-height:0; overflow:hidden; transition:max-height .25s ease;
  }
  .has-dropdown.open .dropdown{ max-height:200px; padding:6px 0 2px 18px; }
  .caret{ padding:6px 10px; margin-left:2px; }
}

.nav-toggle{
  display:none; background:none; border:1px solid var(--gold-dim); color:var(--foam);
  width:40px; height:36px; border-radius:2px; cursor:pointer;
}

@media (max-width: 860px){
  .nav-toggle{ display:block; }
  .navlinks{
    position:fixed; inset:60px 0 0 0; background:rgba(6,24,38,0.98);
    flex-direction:column; align-items:flex-start; padding:32px 28px; gap:22px;
    transform:translateY(-8px); opacity:0; pointer-events:none; transition:.25s ease;
  }
  .navlinks.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
}

/* ---------- hero (statico, nessuna animazione) ---------- */
.hero{
  position:relative;
  padding:120px 0 100px;
  background:
    radial-gradient(60% 50% at 18% 20%, rgba(200,163,92,0.12), transparent 60%),
    radial-gradient(70% 60% at 85% 90%, rgba(127,194,184,0.12), transparent 60%),
    linear-gradient(160deg,var(--abyss) 0%, var(--deep) 55%, var(--deep-2) 100%);
}
.hero-inner{ position:relative; max-width:760px; }
.hero .sigil-mark{ width:64px; height:64px; margin-bottom:26px; object-fit:contain; }
.hero h1{ font-size:clamp(2.1rem, 4.4vw, 3.4rem); line-height:1.15; }
.hero .lede{ margin-top:18px; max-width:600px; }
.page-hero{ padding:150px 0 80px; }
.page-hero h1{ font-size:clamp(1.9rem,3.6vw,2.7rem); }

.hero-watermark{
  position:absolute; right:-60px; top:50%; transform:translateY(-50%);
  width:420px; height:420px; opacity:.14; object-fit:contain;
}
@media (max-width:760px){ .hero-watermark{ width:280px; height:280px; right:-120px; } }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-display); font-size:.74rem; letter-spacing:.2em; text-transform:uppercase;
  padding:15px 30px; border:1px solid var(--gold); color:var(--gold-2);
  background:transparent; cursor:pointer; transition:.25s ease;
}
.btn:hover{ background:var(--gold); color:var(--abyss); }
.btn.solid{ background:var(--gold); color:var(--abyss); }
.btn.solid:hover{ background:var(--gold-2); border-color:var(--gold-2); }
.btn.on-light{ border-color:var(--deep-2); color:var(--deep); }
.btn.on-light:hover{ background:var(--deep); color:var(--foam); border-color:var(--deep); }
.btn-row{ display:flex; gap:16px; flex-wrap:wrap; margin-top:34px; }

/* ---------- cards / grids ---------- */
.grid{ display:grid; gap:28px; }
.grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.grid.cols-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:820px){ .grid.cols-2, .grid.cols-3{ grid-template-columns:1fr; } }

.card{
  background:#fff; border:1px solid #e6ddc7; padding:34px 30px;
  position:relative;
}
.card img{ width:100%; display:block; transition:opacity .2s ease; }
.card a:hover img{ opacity:.85; }
.card::before{
  content:""; position:absolute; top:0; left:0; width:36px; height:2px; background:var(--gold);
}
.card h3{ font-size:1.05rem; color:var(--deep); margin-bottom:.5em; }
.card .meta{ font-family:var(--f-display); font-size:.68rem; letter-spacing:.18em; color:var(--gold); text-transform:uppercase; display:block; margin-bottom:1em;}
.card p{ font-size:.94rem; color:#3c4c58; }

.card.on-dark-card{
  background:rgba(255,255,255,0.05); border:1px solid var(--gold-dim);
}
.card.on-dark-card h3{ color:var(--foam); }
.card.on-dark-card p{ color:var(--foam-2); }
.card.on-dark-card .meta{ color:var(--gold-2); }

.card.featured{
  border:1px solid var(--gold); background:linear-gradient(180deg,#fff,#fbf6ea);
}
.card.featured h3, .card.featured .price-tag, .card.featured p:not(.meta){ color:var(--deep); }

/* ---------- lista con marcatore sigillo ---------- */
ul.sigil-list{ list-style:none; margin:0; padding:0; }
ul.sigil-list li{
  position:relative; padding-left:30px; margin-bottom:.85em; font-size:.97rem;
}
ul.sigil-list li::before{
  content:""; position:absolute; left:0; top:.5em; width:9px; height:9px;
  border:1px solid var(--gold); border-radius:50%;
}

/* ---------- fasi lunari ---------- */
.moon-path{ display:grid; gap:22px; }
.moon-step{
  display:grid; grid-template-columns:64px 1fr; gap:22px; align-items:start;
  padding:22px 0; border-bottom:1px solid var(--gold-dim);
}
.moon-step:last-child{ border-bottom:none; }
.moon-step .icon{ font-size:1.9rem; text-align:center; }
.moon-step h4{ color:var(--gold-2) !important; font-size:.95rem; letter-spacing:.1em; margin-bottom:.3em; }
.moon-step p{ color:var(--foam-2) !important; font-size:.94rem; margin:0; }

/* ---------- banner promo (colori brillanti) ---------- */
.promo-banner{
  background:linear-gradient(120deg,#ff7a5c,#ffb45c);
  border-radius:8px; padding:26px 28px; text-align:center;
  box-shadow:0 16px 34px rgba(255,122,92,0.35);
}
.promo-banner-tag{
  display:inline-block; background:rgba(255,255,255,0.25); color:#fff;
  font-family:var(--f-display); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  padding:6px 16px; border-radius:20px; margin-bottom:12px;
}
.promo-banner-text{ color:#fff; font-size:1.05rem; margin:0 0 6px; font-weight:500; }
.promo-banner-price{
  color:#fff; font-family:var(--f-display); font-size:2rem; margin:0; letter-spacing:.03em;
}
.promo-banner-price span{ font-size:.9rem; font-family:var(--f-body); opacity:.9; }

/* ---------- prezzi ---------- */
.price-tag{
  font-family:var(--f-display); font-size:1.3rem; color:var(--gold); letter-spacing:.05em;
}
.menu-list{ list-style:none; margin:0; padding:0; }
.menu-list li{
  display:grid; grid-template-columns:auto 1fr 34px 62px; align-items:baseline; gap:10px;
  padding:14px 0; border-bottom:1px dashed #d8cba8;
}
.menu-list li:last-child{ border-bottom:none; }
.menu-list-name{ color:var(--deep); font-family:var(--f-display); font-size:.92rem; letter-spacing:.02em; }
.menu-list-dots{
  border-bottom:2px dotted #c9c0a8; height:0; margin-bottom:5px;
}
.menu-list-time{ color:#9aa5ac; font-size:.78rem; text-align:right; }
.menu-list .price-tag{ font-size:1.05rem; text-align:right; }
@media (max-width:480px){
  .menu-list li{ grid-template-columns:1fr 30px 54px; }
  .menu-list-name{ font-size:.82rem; grid-column:1 / -1; }
  .menu-list-dots{ display:none; }
}
.price-row-time{ color:#7a8894; font-size:.85rem; }

/* ---------- quote block ---------- */
.quote-block{
  text-align:center; max-width:760px; margin:0 auto; padding:0 20px;
}
.quote-block p{ font-family:var(--f-quote); font-style:italic; font-size:1.5rem; color:var(--gold-2) !important; line-height:1.5; }

/* ---------- tag-line (etichetta con bordo) ---------- */
.tag-line{
  display:inline-block; border:1px solid var(--gold-dim); padding:6px 14px;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold) !important; margin-bottom:1.2em;
}

/* ---------- footer ---------- */
.site-footer{
  background:var(--abyss); color:var(--foam-2); padding:64px 0 28px;
  border-top:1px solid var(--gold-dim);
}
.site-footer, .site-footer *{ color:var(--foam-2); }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px; margin-bottom:46px; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr; gap:32px; } }
.footer-grid h4{ color:var(--gold-2) !important; font-size:.78rem; letter-spacing:.2em; margin-bottom:1em; }
.footer-grid a:hover{ color:var(--gold-2) !important; }
.social-row{ display:flex; flex-wrap:wrap; gap:14px; margin-top:14px; }
.social-row a{
  border:1px solid var(--gold-dim); width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:.8rem;
}
.social-row a:hover{ border-color:var(--gold); color:var(--gold-2) !important; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.08); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:.76rem; color:rgba(243,239,228,0.5) !important;
}

/* ---------- scheda fissa Collaborazioni (lato destro) ---------- */
.collab-float{
  position:fixed; right:0; top:52%; transform:translateY(-50%);
  z-index:59;
  background:linear-gradient(160deg,var(--deep),var(--deep-2));
  color:var(--foam) !important;
  border:1px solid var(--gold-dim); border-right:none;
  border-radius:8px 0 0 8px;
  padding:16px 10px;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  box-shadow:-6px 8px 20px rgba(6,24,38,0.25);
  text-decoration:none;
  transition:.2s ease;
}
.collab-float:hover{ padding-right:16px; background:linear-gradient(160deg,var(--abyss),var(--deep)); }
.collab-float .collab-icon{ font-size:1.1rem; }
.collab-float .collab-text{
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-family:var(--f-display); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-2) !important;
}
@media (max-width:760px){
  .collab-float{ top:auto; bottom:88px; transform:none; padding:10px 7px; }
  .collab-float .collab-text{ font-size:.6rem; }
}

/* ---------- whatsapp float ---------- */
.wa-float{
  position:fixed; right:22px; bottom:42px; z-index:60;
  background:var(--gold); color:var(--abyss) !important; font-family:var(--f-display);
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  padding:14px 20px; border-radius:30px; display:flex; align-items:center; gap:10px;
  box-shadow:0 8px 24px rgba(0,0,0,0.25);
}
.wa-float:hover{ background:var(--gold-2); }

/* ---------- calendario prenotazioni ---------- */
.booking-calendar{
  max-width:340px; margin:20px auto 0; background:#fff;
  border:1px solid #e6ddc7; border-radius:6px; padding:22px;
  box-shadow:0 12px 30px rgba(6,24,38,0.1);
}
.booking-calendar-header{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:16px;
}
.booking-calendar-header button{
  background:none; border:1px solid var(--gold-dim); border-radius:4px;
  width:30px; height:30px; cursor:pointer; color:var(--deep); font-size:1rem; line-height:1;
}
.booking-calendar-header button:disabled{ opacity:.3; cursor:default; }
.booking-calendar-title{
  font-family:var(--f-display); color:var(--deep); font-size:.85rem;
  letter-spacing:.08em; text-transform:uppercase;
}
.booking-calendar-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; text-align:center; }
.booking-calendar-grid .dow{ font-size:.68rem; color:#9aa5ac; padding-bottom:6px; font-family:var(--f-display); }
.booking-calendar-grid button.day{
  aspect-ratio:1; border:none; background:var(--foam-2); border-radius:4px;
  cursor:pointer; font-size:.82rem; color:var(--deep); transition:.15s ease;
}
.booking-calendar-grid button.day:hover{ background:var(--gold); color:#fff; }
.booking-calendar-grid button.day:disabled{ background:none; color:#d5cfc0; cursor:default; }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
@media (max-width:820px){ .two-col{ grid-template-columns:1fr; } }

.photo-frame img{
  width:100%; max-width:340px; margin:0 auto; display:block; border-radius:3px;
  border:1px solid var(--gold-dim);
  box-shadow:0 22px 44px rgba(6,24,38,0.28);
}
.photo-frame .meta{ text-align:center; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}
