/* =========================================================
   SALONE AURORA — stile comune a tutte le pagine
   Layout: intestazione con menu, un "inizio" diverso per ogni
   pagina, una chiusura diversa per ogni pagina, piè di pagina comune.
   ========================================================= */
:root{
  --plum:#3E1E36;      /* inchiostro, testi e fondi scuri */
  --plum-2:#5A2E4F;
  --mauve:#A45C7F;     /* accento */
  --gold:#B8935A;      /* filetti e cornici */
  --blush:#F7EFEE;     /* fondo */
  --petal:#EDDDDD;     /* fondo alternato */
  --muted:#6F5A67;
  --line:#E0CFD2;
  --on-dark:#D9C2CE;
  --wa:#1F8F4E;
  --display:"Italiana","Didot","Bodoni 72",Georgia,serif;
  --body:"Jost",system-ui,sans-serif;
  --maxw:1120px;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--plum);background:var(--blush);font-size:17px;line-height:1.65}
a{color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--mauve);outline-offset:3px;border-radius:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:20px}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.05;text-wrap:balance}
h2{font-size:clamp(40px,5.5vw,64px)}
.sub{margin-top:12px;color:var(--muted);font-size:18px;max-width:36em}
section{padding-block:88px}
.alt{background:var(--petal)}
.dark{background:var(--plum);color:var(--on-dark)}
.dark h1,.dark h2,.dark h3{color:#fff}
.dark .sub{color:var(--on-dark)}

.demo-bar{background:var(--plum);color:#E6D3DC;font-size:13px;text-align:center;padding:7px 12px}
.demo-bar a{color:#fff;font-weight:600}

/* ---------- Intestazione e menu ---------- */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(247,239,238,.95);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.logo{text-decoration:none;display:flex;flex-direction:column;line-height:1}
.logo b{font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.02em}
.logo small{font-size:11px;letter-spacing:.18em;color:var(--muted);margin-top:4px}
nav.main{display:flex;align-items:center;gap:26px}
nav.main a.lnk{text-decoration:none;font-size:15px;color:var(--muted);padding-block:4px;border-bottom:1px solid transparent}
nav.main a.lnk:hover{color:var(--plum)}
nav.main a.lnk[aria-current="page"]{color:var(--plum);border-bottom-color:var(--gold)}
.menu-btn{display:none;align-items:center;gap:8px;font:inherit;font-size:15px;background:none;border:1.5px solid var(--plum);border-radius:999px;padding:8px 16px;color:var(--plum);cursor:pointer}
.menu-btn svg{width:18px;height:18px}
.menu-panel{border-top:1px solid var(--line);background:var(--blush)}
.menu-panel .wrap{display:grid;padding-block:8px 20px}
.menu-panel a{font-family:var(--display);font-size:34px;text-decoration:none;padding:6px 0;border-bottom:1px solid var(--line)}
.menu-panel a[aria-current="page"]{color:var(--mauve)}
@media (max-width:860px){
  nav.main{display:none}
  .menu-btn{display:inline-flex}
}
@media (min-width:861px){ .menu-panel{display:none!important} }

/* ---------- Bottoni ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:500;font-size:16px;text-decoration:none;
     padding:13px 24px;border-radius:999px;border:1.5px solid var(--plum);cursor:pointer;transition:background .2s ease,color .2s ease}
.btn svg{width:19px;height:19px;flex:none}
.btn.solid{background:var(--plum);color:#fff}
.btn.solid:hover{background:var(--plum-2)}
.btn.ghost{background:transparent;color:var(--plum)}
.btn.ghost:hover{background:var(--plum);color:#fff}
.btn.wa{background:var(--wa);border-color:var(--wa);color:#fff}
.btn.wa:hover{background:#197A42}
.btn.light{background:#fff;border-color:#fff;color:var(--plum)}
.btn.light:hover{background:var(--petal)}
.btn.small{padding:9px 18px;font-size:15px}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}

/* ---------- Foto con segnaposto ---------- */
.ph{position:relative;overflow:hidden;background:repeating-linear-gradient(135deg,#EAD9DB 0 14px,#E3CFD2 14px 28px);
    display:grid;place-items:center;color:var(--muted);font-weight:500;font-size:15px;text-align:center}
.ph > span{background:rgba(255,255,255,.85);padding:6px 12px;border-radius:999px}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph figcaption{position:absolute;left:12px;bottom:12px;background:#fff;border-radius:999px;padding:4px 12px;font-size:14px;font-weight:500;color:var(--plum)}

/* =========================================================
   INIZI DI PAGINA (uno diverso per ogni pagina)
   ========================================================= */

/* Home: nome gigante + specchio ad arco */
.hero-home{padding-block:56px 72px}
.hero-home .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero-home h1{font-size:clamp(64px,11vw,148px);letter-spacing:-.01em;line-height:.9}
.hero-home h1 span{display:block;font-size:.38em;letter-spacing:.06em;color:var(--mauve);margin-bottom:.35em}
.tagline{margin-top:22px;font-size:20px;color:var(--muted);max-width:28em}
.today{margin-top:26px;display:flex;align-items:center;gap:10px;font-size:15px;color:var(--muted)}
.today i{width:9px;height:9px;border-radius:50%;background:#4CAF7A;flex:none}
.today.closed i{background:#C9A0A0}
.mirror{position:relative;justify-self:center;width:min(100%,430px)}
.mirror .frame{position:relative;aspect-ratio:3/4.3;max-width:100%;border-radius:999px 999px 18px 18px;padding:12px;
               background:linear-gradient(160deg,#D8BC8C,var(--gold) 45%,#8E6D3B);box-shadow:0 30px 60px -30px rgba(62,30,54,.55)}
.mirror .glass{position:relative;width:100%;height:100%;border-radius:999px 999px 10px 10px;overflow:hidden}
.mirror .note{position:absolute;right:-8px;bottom:36px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 14px;font-size:14px;line-height:1.35;box-shadow:0 10px 30px -12px rgba(62,30,54,.35)}
.mirror .note b{display:block;font-family:var(--display);font-size:22px;font-weight:400}
@media (max-width:860px){
  .hero-home{padding-block:36px 56px}
  .hero-home .grid{grid-template-columns:1fr;gap:40px}
  .mirror{width:min(100%,340px)}
  .mirror .note{right:0}
}

/* Listino: fascia scura con la parola grande e i due capitoli */
.hero-listino{background:var(--plum);color:var(--on-dark);padding-block:64px 56px;position:relative;overflow:hidden}
.hero-listino h1{font-size:clamp(72px,13vw,170px);color:#fff;line-height:.85}
.hero-listino p{margin-top:18px;max-width:34em;font-size:18px}
.hero-listino .chapters{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.hero-listino .chapters a{border:1px solid var(--gold);color:#F3E6EC;border-radius:999px;padding:8px 18px;text-decoration:none;font-size:15px}
.hero-listino .chapters a:hover{background:var(--gold);color:var(--plum)}
.hero-listino .scissors{position:absolute;right:-30px;top:50%;transform:translateY(-50%);width:min(40vw,380px);opacity:.14;color:var(--gold)}

/* Lavori: titolo a sinistra, filtri a destra */
.hero-lavori{padding-block:56px 16px}
.hero-lavori .top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.hero-lavori h1{font-size:clamp(56px,9vw,112px);line-height:.9}
.filters{display:flex;flex-wrap:wrap;gap:8px}
.filters button{font:inherit;font-size:15px;background:transparent;border:1.5px solid var(--line);border-radius:999px;padding:8px 16px;color:var(--plum);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--plum);border-color:var(--plum);color:#fff}

/* Chi siamo: citazione grande + foto del salone */
.hero-about{padding-block:64px 80px}
.hero-about .grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero-about .kicker{color:var(--mauve);font-size:15px;letter-spacing:.14em}
.hero-about blockquote{font-family:var(--display);font-size:clamp(40px,5.6vw,72px);line-height:1.02;margin-top:14px;text-wrap:balance}
.hero-about p{margin-top:24px;color:var(--muted);max-width:32em}
.hero-about .since{display:flex;align-items:baseline;gap:12px;margin-top:28px}
.hero-about .since b{font-family:var(--display);font-weight:400;font-size:64px;color:var(--gold);line-height:1}
.hero-about .since span{color:var(--muted);font-size:15px;max-width:14em;line-height:1.4}
.hero-about .ph{aspect-ratio:4/5;border-radius:20px;border:8px solid #fff;box-shadow:0 30px 60px -34px rgba(62,30,54,.6);max-width:100%}
@media (max-width:860px){ .hero-about .grid{grid-template-columns:1fr} .hero-about .ph{max-width:420px} }

/* Prenota: intestazione compatta, il modulo arriva subito */
.hero-book{background:var(--plum);color:var(--on-dark);padding-block:48px 120px}
.hero-book h1{font-size:clamp(52px,8vw,96px);color:#fff}
.hero-book p{margin-top:10px;max-width:34em;font-size:18px}
.book-lift{margin-top:-96px;padding-block:0 88px}

/* =========================================================
   CONTENUTI
   ========================================================= */

/* Punti forti in home */
.strengths{margin-top:44px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.strength{padding-top:20px;border-top:1px solid var(--gold);display:flex;flex-direction:column;gap:8px}
.strength h3{font-size:34px}
.strength p{color:var(--muted);flex:1}
.strength a{align-self:flex-start;font-weight:500;color:var(--mauve);text-decoration:none;border-bottom:1px solid currentColor}
@media (max-width:860px){ .strengths{grid-template-columns:1fr} }
.review-slot{margin-top:28px;border:1.5px dashed var(--line);border-radius:18px;padding:24px;background:#fff;color:var(--muted);max-width:640px}
.review-slot .stars{color:var(--gold);font-size:22px;letter-spacing:2px}

/* Listino */
.price-cols{display:grid;grid-template-columns:1fr 1fr;gap:28px 64px}
.price-cols h2{font-size:clamp(34px,4vw,44px);color:var(--mauve);padding-bottom:10px;border-bottom:1px solid var(--gold);margin-bottom:6px;scroll-margin-top:90px}
.price-cols ul{list-style:none}
.price-cols li a{display:flex;align-items:baseline;gap:10px;padding:13px 0;border-bottom:1px dashed var(--line);text-decoration:none;transition:padding .2s ease,color .2s ease}
.price-cols li a:hover{padding-left:8px;color:var(--mauve)}
.price-cols .name{min-width:0}
.price-cols .name small{display:block;font-size:14px;color:var(--muted)}
.price-cols .dots{flex:1;border-bottom:1px dotted #C9B3BA;transform:translateY(-5px);min-width:20px}
.price-cols .eur{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.price-cols .eur small{font-weight:400;color:var(--muted);font-size:13px;margin-right:3px}
.price-hint{margin-top:18px;font-size:15px;color:var(--muted)}
@media (max-width:760px){ .price-cols{grid-template-columns:1fr} }
.bridal{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:32px}
.bridal .ring{width:84px;height:84px;border-radius:50%;border:2px solid var(--gold);display:grid;place-items:center;font-family:var(--display);font-size:40px;color:var(--gold)}
.bridal h2{font-size:clamp(34px,4vw,48px)}
.bridal p{color:var(--muted);margin-top:6px;max-width:36em}
.bridal .price{font-family:var(--display);font-size:44px;white-space:nowrap}
.bridal .price small{font-family:var(--body);font-size:14px;color:var(--muted);display:block;text-align:right}
@media (max-width:760px){ .bridal{grid-template-columns:1fr;text-align:left} .bridal .price small{text-align:left} }

/* Galleria lavori */
.mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mosaic figure{border-radius:16px;aspect-ratio:3/4}
.mosaic figure.wide{grid-column:span 2;aspect-ratio:auto}
.mosaic figure[hidden]{display:none}
@media (max-width:760px){ .mosaic{grid-template-columns:1fr 1fr} .mosaic figure.wide{grid-column:1/-1;aspect-ratio:4/3} }

/* Team e valori */
.team{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.member{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:start;padding-top:18px;border-top:1px solid var(--gold)}
.mono{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:30px;background:var(--plum);color:#F2E3EA}
.member h3{font-family:var(--body);font-weight:600;font-size:19px;line-height:1.3}
.member .role{color:var(--mauve);font-size:15px}
.member p{color:var(--muted);font-size:15px;margin-top:6px}
.values{margin-top:40px;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.values li{display:grid;gap:6px}
.values svg{width:34px;height:34px;color:var(--gold)}
.values b{font-weight:600;font-size:18px;color:#fff}
.values span{font-size:15px}
@media (max-width:860px){ .team,.values{grid-template-columns:1fr} }

/* Prenotazione */
.book-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
form.booking{background:#fff;color:var(--plum);border-radius:22px;padding:28px;display:grid;gap:18px;box-shadow:0 30px 60px -30px rgba(62,30,54,.45)}
.field{display:grid;gap:6px}
.field > label,.field > .lbl{font-weight:500;font-size:15px}
.field select,.field input[type=text]{font:inherit;font-size:16px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--plum);width:100%}
.field select:focus,.field input[type=text]:focus{outline:none;border-color:var(--mauve)}
.days{display:flex;flex-wrap:wrap;gap:8px}
.days label{cursor:pointer;position:relative}
.days input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.days span{display:inline-block;padding:8px 14px;border:1.5px solid var(--line);border-radius:999px;font-size:15px;transition:all .15s ease}
.days input:checked + span{background:var(--plum);border-color:var(--plum);color:#fff}
.days input:focus-visible + span{outline:2px solid var(--mauve);outline-offset:2px}
form.booking .btn{width:100%}
.form-note{font-size:13px;color:var(--muted);text-align:center}
.side-info{padding-top:120px;display:grid;gap:28px}
.how{list-style:none;display:grid;gap:22px;counter-reset:h}
.how li{display:grid;grid-template-columns:40px 1fr;gap:14px;counter-increment:h}
.how li::before{content:counter(h);width:40px;height:40px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;font-family:var(--display);font-size:22px;color:var(--gold)}
.how b{display:block;font-weight:500}
.how span{color:var(--muted);font-size:15px}
@media (max-width:860px){ .book-grid{grid-template-columns:1fr} .side-info{padding-top:0} }

.hours{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.hours td{padding:10px 0;border-bottom:1px solid var(--line)}
.hours td:last-child{text-align:right;color:var(--muted)}
.hours tr.closed td:last-child{color:#B07A7A}
.contact-grid{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.contact-lines{margin-top:24px;display:grid;gap:6px}
.contact-lines a{font-size:20px;text-decoration:none}
.contact-lines a:hover{color:var(--mauve)}
.map{border-radius:20px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;max-width:100%;background:var(--petal)}
.map iframe{width:100%;height:100%;border:0;display:block}
.map-link{display:grid;place-items:center;text-align:center;text-decoration:none;color:var(--muted);background:repeating-linear-gradient(135deg,#EAD9DB 0 14px,#E3CFD2 14px 28px)}
.map-link b{color:var(--plum)}
@media (max-width:760px){ .contact-grid{grid-template-columns:1fr} }

/* =========================================================
   CHIUSURE DI PAGINA (una diversa per ogni pagina)
   ========================================================= */
.end-cta{text-align:center}
.end-cta h2{max-width:14ch;margin-inline:auto}
.end-cta .sub{margin-inline:auto}
.end-cta .cta{justify-content:center}
.end-split{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center}
@media (max-width:760px){ .end-split{grid-template-columns:1fr} }
.insta{display:flex;align-items:center;gap:14px;font-family:var(--display);font-size:clamp(30px,4vw,44px);color:#fff;text-decoration:none}
.insta svg{width:44px;height:44px;flex:none;color:var(--gold)}

/* ---------- Piè di pagina comune ---------- */
footer.site{background:#2E1528;color:#BFA6B4;font-size:15px;padding-block:56px 30px}
footer.site .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px}
footer.site .brand b{font-family:var(--display);font-weight:400;font-size:40px;color:#fff;display:block;line-height:1}
footer.site h3{font-family:var(--body);font-size:13px;font-weight:600;letter-spacing:.14em;color:#E8CFA3;margin-bottom:12px}
footer.site ul{list-style:none;display:grid;gap:6px}
footer.site a{text-decoration:none}
footer.site a:hover{color:#fff}
footer.site .legal{margin-top:40px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:13px}
@media (max-width:760px){ footer.site .cols{grid-template-columns:1fr} }

/* ---------- Barra fissa su telefono ---------- */
.mobile-bar{display:none}
@media (max-width:640px){
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--plum);box-shadow:0 -4px 16px rgba(62,30,54,.2)}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 8px;font-weight:500;text-decoration:none;color:#fff}
  .mobile-bar a svg{width:19px;height:19px}
  .mobile-bar .m-book{background:var(--wa)}
  body{padding-bottom:56px}
}

/* ---------- Animazioni ---------- */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none}
.js .hero-in{opacity:0;transform:translateY(20px);animation:heroIn 1s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--d,0ms)}
@keyframes heroIn{to{opacity:1;transform:none}}
.js .mirror .glass{clip-path:inset(100% 0 0 0 round 999px 999px 10px 10px);animation:dawn 1.4s cubic-bezier(.6,.05,.2,1) .35s forwards}
@keyframes dawn{to{clip-path:inset(0 0 0 0 round 999px 999px 10px 10px)}}
.js .mirror .note{opacity:0;transform:translateY(10px);animation:heroIn .8s ease 1.5s forwards}
.js .hero-listino .scissors{animation:snip 1.6s cubic-bezier(.3,.7,.2,1) .2s both}
@keyframes snip{from{opacity:0;transform:translateY(-50%) rotate(-25deg)}to{opacity:.14;transform:translateY(-50%) rotate(0)}}
@media (prefers-reduced-motion:reduce){
  .js .reveal{transform:none;transition:opacity .9s ease;transition-delay:var(--d,0ms)}
  .js .hero-in,.js .mirror .note{transform:none;animation:fade .9s ease forwards;animation-delay:var(--d,0ms)}
  .js .mirror .glass{clip-path:none;animation:none}
  .js .hero-listino .scissors{animation:none}
  html{scroll-behavior:auto}
}
@keyframes fade{to{opacity:1}}

/* ---------- Tocco e tablet (iPhone, iPad) ---------- */
@media (hover:none){ .btn:hover{transform:none!important;box-shadow:none!important} }
@media (pointer:coarse){
  nav.main a.lnk{padding-block:12px}
  .menu-btn{min-height:44px}
  .strength a{display:inline-block;padding-block:10px}
  .contact-lines a{display:inline-block;padding-block:6px}
}
@media (max-width:640px){ .logo small{font-size:12px;letter-spacing:.12em} }
/* iPad verticale: due colonne dove c'è spazio */
@media (min-width:700px) and (max-width:860px){
  .hero-home .grid{grid-template-columns:1.1fr .9fr;gap:32px}
  .hero-home h1{font-size:96px}
  .mirror{width:100%}
  .strengths{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .team{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
  .member{grid-template-columns:1fr}
}

/* iOS: niente zoom automatico sui campi */
@media (max-width:1180px){input:not([type=radio]):not([type=checkbox]),select,textarea{font-size:16px}}