/* MODELLO "COMMERCIALE MULTI-SEDE" — ricalca hiatusspa.com */
:root{
  --bg:#fff;--az:#e4eaf6;--az2:#d3def2;--btn:#9fbbe8;--ink:#1a174b;--muted:#5b5a7a;--coral:#ff7f6b;
  --acc:var(--ink);--accInk:#fff;--line:rgba(26,23,75,.15);
  --serif:'Gloock',Georgia,serif;--sans:'Figtree',system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);--pad:clamp(16px,3.4vw,48px);--sab:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--sans);overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{max-width:1360px;margin:0 auto;padding:0 var(--pad)}
.h{font:400 clamp(32px,4vw,54px)/1.08 var(--serif);letter-spacing:-.01em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;border-radius:999px;background:var(--btn);border:1px solid var(--ink);color:var(--ink);font:600 14px var(--sans);text-decoration:none;cursor:pointer;transition:background .3s,color .3s}
.btn.ghost{background:transparent}
.btn.dark{background:var(--ink);color:#fff}
@media (hover:hover) and (pointer:fine){.btn:hover{background:var(--ink);color:#fff}.btn.dark:hover{background:var(--btn);color:var(--ink)}}
.badge-c{display:inline-block;background:var(--coral);color:#fff;font:700 11px var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;border-radius:999px}

/* barra promo + header su una riga */
.promo{background:var(--ink);color:#fff;text-align:center;font-size:13.5px;padding:9px var(--pad)}
.promo a{font-weight:700}
.hdr{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.hdr .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;height:74px}
.hdr nav{display:flex;gap:22px;font-size:14.5px;font-weight:500}
.hdr nav a{text-decoration:none}
.logo{font:400 26px var(--serif);letter-spacing:.32em;text-decoration:none;white-space:nowrap}
.hdr .r{display:flex;gap:10px;justify-content:flex-end;align-items:center}
.sel{font:500 14px var(--sans);color:var(--ink);background:var(--az);border:1px solid var(--line);border-radius:999px;padding:11px 16px;max-width:190px}
.burger{display:none;background:none;border:0;font:600 14px var(--sans);color:var(--ink);cursor:pointer}

/* hero in riquadro con box sovrapposto */
.hero{padding:var(--pad) 0 clamp(70px,10vh,120px)}
.frame{position:relative;border-radius:28px;overflow:hidden;height:min(78vh,760px);background:var(--az2)}
.frame img{width:100%;height:100%;object-fit:cover}
.frame::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,23,75,.45),transparent 60%)}
.frame h1{position:absolute;z-index:2;left:clamp(22px,4vw,60px);bottom:clamp(30px,6vw,70px);color:#fff;font:400 clamp(46px,7vw,110px)/.98 var(--serif);max-width:9ch}
.welcome{position:relative;z-index:3;margin:-150px clamp(16px,4vw,60px) 0 auto;width:min(440px,calc(100% - 32px));background:#fff;border-radius:22px;padding:30px;box-shadow:0 30px 60px -30px rgba(26,23,75,.35)}
.welcome h2{font:400 30px/1.1 var(--serif);margin:12px 0 10px}
.welcome p{color:var(--muted);font-size:15px}
.welcome .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}

/* abbonamento */
.club{background:var(--az);border-radius:28px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);overflow:hidden}
.club .tx{padding:clamp(28px,5vw,70px)}
.club .h{margin:14px 0 14px}
.club .price{font:400 clamp(54px,6vw,84px)/1 var(--serif);margin:24px 0 6px}
.club .price small{font:500 16px var(--sans);color:var(--muted)}
.club ul{list-style:none;padding:0;margin:20px 0 28px;display:grid;gap:10px}
.club li{display:flex;gap:10px;align-items:baseline}
.club li::before{content:"✓";font-weight:700}
.club figure{min-height:340px}
.club figure img{width:100%;height:100%;object-fit:cover}
.strip-club{background:var(--az2);padding:22px 0}
.strip-club .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.strip-club b{font:400 24px var(--serif)}

/* sedi a carosello */
.sec{padding:clamp(80px,11vh,130px) 0}
.sec .top{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:34px;flex-wrap:wrap}
.arrows{display:flex;gap:8px}
.arrows button{width:46px;height:46px;border-radius:50%;border:1px solid var(--ink);background:#fff;color:var(--ink);font-size:18px;cursor:pointer}
.car{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.car::-webkit-scrollbar{display:none}
.sede{flex:0 0 clamp(270px,30vw,420px);scroll-snap-align:start}
.sede figure{aspect-ratio:4/3;border-radius:20px;overflow:hidden}
.sede img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
@media (hover:hover) and (pointer:fine){.sede:hover img{transform:scale(1.05)}}
.sede h3{font:400 26px var(--serif);margin:16px 0 2px}
.sede p{color:var(--muted);font-size:14.5px}
.sede .stato{display:inline-flex;gap:6px;align-items:center;font-size:13px;font-weight:600;margin-top:8px}
.sede .stato i{width:8px;height:8px;border-radius:50%;background:#2fa36b}
.sede .stato.chiuso i{background:#c0392b}

/* promozioni */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pc{background:var(--az);border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.pc figure{aspect-ratio:16/11;overflow:hidden;position:relative}
.pc figure img{width:100%;height:100%;object-fit:cover}
.pc .badge-c{position:absolute;left:14px;top:14px}
.pc .in{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.pc h3{font:400 24px/1.15 var(--serif)}
.pc p{color:var(--muted);font-size:15px;flex:1}
.pc .btn{align-self:flex-start;margin-top:8px}

/* prenota */
.book{background:var(--ink);color:#fff;border-radius:28px;padding:clamp(28px,5vw,70px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,80px);--ink:#fff;--line:rgba(255,255,255,.3);--acc:var(--btn);--accInk:#1a174b}
.book .h{color:#fff}
.book p{opacity:.75}
.book .q{font:600 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;opacity:.7;margin:20px 0 10px}
.book .q:first-child{margin-top:0}
.book .btn{margin-top:24px;background:var(--btn);color:#1a174b;border-color:var(--btn)}

/* griglia social */
.ig{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ig a{aspect-ratio:1;overflow:hidden;border-radius:12px;position:relative}
.ig img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
@media (hover:hover) and (pointer:fine){.ig a:hover img{transform:scale(1.06)}}

footer{background:var(--az);padding:clamp(60px,9vh,100px) 0 calc(30px + var(--sab));margin-top:clamp(80px,11vh,130px)}
footer .cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:30px;font-size:14.5px}
footer .cols b{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px}
footer .cols a{display:block;text-decoration:none;color:var(--muted);margin-bottom:6px}
footer .bot{margin-top:50px;padding-top:20px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

.mnav{display:none}
@media (max-width:960px){
  .hdr .wrap{grid-template-columns:auto 1fr auto;height:64px}
  .hdr nav,.hdr .sel{display:none}
  .burger{display:block}
  .logo{font-size:20px;letter-spacing:.24em;justify-self:center}
  .hdr .r .btn{padding:10px 16px;font-size:13px}
  .mnav{display:block;position:fixed;inset:auto 0 0;z-index:49;background:#fff;border-top:1px solid var(--line);padding:16px var(--pad) calc(16px + var(--sab));transform:translateY(105%);transition:transform .5s var(--ease)}
  .menu-open .mnav{transform:none}
  .mnav a{display:block;font:400 26px/1.6 var(--serif);text-decoration:none}
  .frame{height:62vh}
  .welcome{margin-top:-40px}
  .frame h1{bottom:66px}
  .club,.book{grid-template-columns:minmax(0,1fr)}
  .club figure{min-height:240px}
  .cards{grid-template-columns:minmax(0,1fr)}
  .ig{grid-template-columns:repeat(2,minmax(0,1fr))}
  footer .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
