/* Beauty Fam Hairstyle — style.css
   Copia del design del kit (Design/kit/design-computer.png a 1440 px, design-telefono.png a 390 px).
   Font: Newsreader (titoli) e Figtree (testi), Herr Von Muellerhoff (firma, raddrizzata con skewX) — Google Fonts, licenza OFL, serviti dal sito.
   Icone: Lucide (licenza ISC), sprite SVG inline in pagina. */

@font-face{font-family:"Newsreader";src:url("/assets/fonts/newsreader.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"Figtree";src:url("/assets/fonts/figtree.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Firma";src:url("/assets/fonts/herr-von-muellerhoff.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  /* colori misurati col contagocce sul design */
  --nero:#0B0B0B;
  --avorio:#FAF8F6;
  --avorio-2:#F7F7F5;
  --bianco:#FFFFFF;
  --carta:#FBFAF7;            /* card recensioni */
  --rosa:#FCA4B8;             /* pulsanti */
  --rosa-hover:#F890A8;
  --rosa-testo:#EC8FAA;       /* «Scopri di più» */
  --testo-pulsante:#2A0710;   /* testo bordeaux scurissimo dei pulsanti rosa */
  --oro:#E2C9AB;              /* seconda riga del titolo */
  --beige:#E9D6BB;            /* «Vieni a trovarci» */
  --beige-hover:#E1C9A8;
  --verde-card:#C8D1C3;
  --rosa-card:#F9BBCD;
  --crema-card:#E5DDD4;
  --marrone:#221715;          /* fondo dei pannelli texture */
  --inchiostro:#0A0A0A;       /* titoli scuri */
  --inchiostro-2:#222222;     /* titoli card */
  --grigio:#3E3E3C;           /* testo grigio dei paragrafi (salone, lavori, servizi, footer) */
  --grigio-oeco:#4F574B;      /* descrizione sulla card verde */
  --grigio-matrix:#623945;    /* descrizione sulla card rosa */
  --grigio-annes:#544D46;     /* descrizione sulla card crema */
  --testo-recensioni:#161616; /* testo delle card recensioni, quasi nero */
  --grigio-chiaro:#CFC7C3;    /* testo chiaro su fondo scuro */
  --grigio-chiaro-2:#C4C4C4;
  --bianco-testo:#FBFBFB;     /* sottotitolo della hero */
  --nero-banda:#0D0D0D;       /* fondo fascia recensioni e cta */
  --nero-testata-m:#141414;   /* testata da telefono */
  --filetto:#E9E7E2;
  --stelle:#F2BF32;
  --ombra:0 2px 12px rgba(20,14,10,.07);
  --ombra-hover:0 14px 30px rgba(20,14,10,.13);
  --r:6px;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --firma:"Firma",cursive;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--avorio);color:var(--inchiostro);font-family:var(--sans);font-size:18px;line-height:1.4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--rosa);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--rosa);color:var(--testo-pulsante);font-weight:700;padding:10px 16px;border-radius:var(--r);text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.ic{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.solo-m{display:none!important}
.box{max-width:1440px;margin:0 auto;position:relative}

/* ---------- Pulsanti ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:16px;border-radius:var(--r);font-family:var(--sans);font-weight:700;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;line-height:1;white-space:nowrap;transition:background-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease)}
.btn .ic{width:26px;height:26px;stroke-width:2.2}
.btn-rosa{background:var(--rosa);color:var(--testo-pulsante);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.btn-rosa:hover{background:var(--rosa-hover);transform:translateY(-2px);box-shadow:0 10px 22px rgba(252,164,184,.28)}
.btn-linea{border:2px solid rgba(255,255,255,.85);color:#fff}
.btn-linea:hover{background:#fff;color:var(--nero);transform:translateY(-2px)}
.btn-beige{background:var(--beige);color:var(--inchiostro)}
.btn-beige:hover{background:var(--beige-hover);transform:translateY(-2px);box-shadow:0 10px 22px rgba(160,130,90,.18)}
.btn:active{transform:translateY(0)}

/* ---------- Header ---------- */
.hdr{position:absolute;top:0;left:0;right:0;z-index:30;background:var(--nero);height:82px}
.hdr .box{height:82px;display:flex;align-items:center;padding:0 40px 0 clamp(40px,6.1vw,88px)}
.logo{display:block;flex:none}
.logo img{width:clamp(200px,17.4vw,250px);height:auto}
.nav{flex:1;display:flex;justify-content:center;padding-top:6px}
.nav ul{display:flex;gap:clamp(24px,2.57vw,37px)}
.nav a{display:block;position:relative;color:#E2E2E2;text-decoration:none;font-size:19px;font-weight:550;line-height:24px;padding:4px 0;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:#fff;border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav a:hover{color:#fff}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav a[aria-current="page"]{color:#fff}
.btn-hdr{width:202px;height:51px;font-size:14.5px;gap:14px;flex:none}
.btn-hdr .ic{width:23px;height:23px}
.burger{display:none;width:48px;height:48px;align-items:center;justify-content:center;color:#fff;margin-right:-6px}
.burger .ic{width:36px;height:26px;stroke-width:3.2}
.burger .ic-x{display:none}
.burger[aria-expanded="true"] .ic-menu{display:none}
.burger[aria-expanded="true"] .ic-x{display:block}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--nero);color:#fff;height:842px;overflow:hidden}
.hero-media{position:absolute;top:60px;bottom:0;left:10.28%;width:91.94%}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:100% 0}
.hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#0B0B0B 0%,#0B0B0B 14%,rgba(11,11,11,.9) 22%,rgba(11,11,11,.66) 34%,rgba(11,11,11,.3) 46%,rgba(11,11,11,.06) 56%,rgba(11,11,11,0) 62%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(11,11,11,0),rgba(11,11,11,.35))}
.hero .box{z-index:2;height:100%;padding:180px 0 0 68px}
.occhiello{font-size:20.8px;line-height:26px;letter-spacing:.12em;text-transform:uppercase;color:#E9E9E8;font-weight:400}
.hero h1{margin-top:23px;font-family:var(--serif);font-weight:500;font-size:86px;line-height:75px;letter-spacing:-.005em;color:#fff}
.hero h1 span{display:block;color:var(--oro)}
.hero-p{margin-top:10px;font-size:26.4px;line-height:31.5px;font-weight:500;color:var(--bianco-testo);max-width:480px}
.hero-cta{display:flex;gap:28px;margin-top:25px}
.hero-cta .btn{height:62px;font-size:16.8px}
.hero-cta .btn-rosa{width:238px}
.hero-cta .btn-linea{width:270px;font-size:17px}
.vantaggi{display:flex;gap:0;margin:42px 0 0 -1px}
.vantaggi li{display:flex;flex:none;align-items:center;gap:19px;font-size:17px;line-height:23px;font-weight:600;color:#E6E6E6}
.vantaggi li:nth-child(1){width:200px;gap:17px}
.vantaggi li:nth-child(2){width:187.7px;gap:19px}
.vantaggi li:nth-child(3){width:199.8px;gap:18px}
.vantaggi li:nth-child(4){gap:21px}
.vantaggi .ic{width:39px;height:39px;stroke-width:1.9}
.firma{position:absolute;z-index:2;left:76px;top:709px;font-family:var(--firma);font-size:60px;line-height:50px;color:rgba(255,255,255,.86);transform:rotate(-13deg) skewX(12deg);transform-origin:0 0;white-space:nowrap;pointer-events:none}
.firma span{display:block}
.firma span:nth-child(2){margin-left:24px}
.firma span:nth-child(3){margin-left:20px}
.firma .ic{display:inline-block;width:31.5px;height:31.5px;stroke-width:1.3;vertical-align:-8px;margin-left:6px;transform:skewX(-12deg) rotate(13deg)}

/* ---------- Servizi ---------- */
.servizi{background:var(--avorio);padding:20px 0 19px}
.titolo{font-family:var(--serif);font-weight:400;color:var(--inchiostro);letter-spacing:-.005em}
.servizi .titolo{text-align:center;font-size:37px;line-height:40px}
.servizi .sotto{text-align:center;margin-top:0;font-size:19.4px;line-height:20px;color:var(--grigio)}
.serv-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;padding:0 38px;margin-top:15px}
.serv-card a{display:flex;flex-direction:column;height:100%;background:var(--bianco);border-radius:var(--r);box-shadow:var(--ombra);text-decoration:none;color:inherit;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.serv-foto{position:relative;aspect-ratio:216/220;overflow:hidden;background:#e9e6e2}
.serv-foto img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.serv-corpo{position:relative;display:block;padding:20px 11px 8px 18px;min-height:86px}
.serv-t{display:block;font-family:var(--serif);font-weight:600;font-size:15.7px;line-height:20px;letter-spacing:.01em;text-transform:uppercase;color:var(--inchiostro-2)}
.serv-piu{display:inline-flex;align-items:center;margin-top:18px;font-size:15.7px;line-height:20px;font-weight:600;color:var(--rosa-testo)}
.serv-piu .freccia{display:inline-block;margin-left:5px;transition:transform .3s var(--ease)}
.serv-corpo .ic-tondo{position:absolute;right:11px;bottom:4px;width:27px;height:27px;color:#555;stroke-width:1.3;transition:transform .3s var(--ease),color .3s}
.serv-corpo .ic-chev{display:none}
.serv-card a:hover{transform:translateY(-6px);box-shadow:var(--ombra-hover)}
.serv-card a:hover .serv-foto img{transform:scale(1.06)}
.serv-card a:hover .freccia{transform:translateX(4px)}
.serv-card a:hover .ic-tondo{transform:translateX(3px);color:var(--inchiostro)}

/* ---------- Colori ---------- */
.colori{display:grid;grid-template-columns:36.94% 300fr 293fr 315fr;height:435px;background:var(--marrone)}
.col-intro{position:relative;overflow:hidden;color:#fff;padding:89px 0 0 68px}
.col-intro>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.col-intro::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(18,10,8,.45),rgba(18,10,8,.05) 70%)}
.col-intro>*:not(img){position:relative;z-index:1}
.col-intro .titolo{color:#fff;font-size:38.3px;line-height:44px}
.col-intro p{margin-top:18px;font-size:21.6px;line-height:27.5px;color:var(--grigio-chiaro)}
.col-lista{display:none}
.col-intro .btn{margin-top:23px;width:324px;height:66px;font-size:17.3px}
.prodotti{display:contents}
.prod{position:relative;overflow:hidden;padding:33px 8px 0 43px}
.prod-oeco{background:var(--verde-card);--desc:var(--grigio-oeco);--bx:67px}
.prod-matrix{background:var(--rosa-card);padding-left:45px;--desc:var(--grigio-matrix);--desc-fs:19.4px;--bx:60px}
.prod-annes{background:var(--crema-card);padding-left:56px;--desc:var(--grigio-annes);--desc-fs:19.4px;--bx:64px}
.prod h3{position:relative;z-index:1;font-family:var(--serif);font-weight:400;font-size:27px;line-height:30px;color:var(--inchiostro);letter-spacing:.01em}
.prod-sub{position:relative;z-index:1;font-size:22.3px;line-height:24px;font-weight:700;color:var(--inchiostro)}
.prod-desc{position:relative;z-index:1;margin-top:17px;font-size:var(--desc-fs,17.6px);line-height:25px;color:var(--desc)}
/* mensola chiara in basso e muro che scurisce appena sopra (come nel design) */
.prod::before{content:"";position:absolute;left:0;right:0;bottom:30px;height:70px;z-index:0;background:linear-gradient(180deg,rgba(70,45,35,0),rgba(70,45,35,.075))}
.prod::after{content:"";position:absolute;left:0;right:0;bottom:0;height:30px;z-index:0;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.3) 55%,rgba(255,255,255,.5));box-shadow:0 -1px 0 rgba(255,255,255,.35)}
.prod img{position:absolute;z-index:1;left:var(--bx);bottom:6px;transition:transform .8s var(--ease);filter:drop-shadow(0 6px 10px rgba(40,25,20,.16))}
.prod:hover img{transform:translateY(-6px) scale(1.02)}

/* ---------- Salone ---------- */
.salone{background:var(--avorio)}
.salone .box{display:grid;grid-template-columns:418px 1fr;padding:20px 39px 0 68px}
.sal-testo{padding-top:11px}
.salone .titolo{font-size:39.5px;line-height:43px}
.salone p{margin-top:4px;font-size:21px;line-height:24px;color:var(--grigio)}
.salone .btn{margin-top:11px;width:270px;height:57px;font-size:17px;gap:20px}
.salone .btn .ic{width:28px;height:28px;stroke-width:1.7}
.sal-foto{border-radius:4px;overflow:hidden;height:284px;background:#ddd}
.sal-foto img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.sal-foto:hover img{transform:scale(1.03)}

/* ---------- Lavori ---------- */
.lavori{background:var(--avorio);padding:18px 0 18px}
.lav-testa{padding:0 55px 0 68px;position:relative}
.lavori .titolo{font-size:37.3px;line-height:42px}
.lavori .sotto{margin-top:-2px;font-size:19.7px;line-height:22px;color:var(--grigio)}
.ig-link{position:absolute;right:55px;top:10px;display:flex;align-items:center;gap:15px;text-decoration:none;font-size:15.4px;font-weight:700;text-transform:uppercase;letter-spacing:.005em;color:#292826}
.ig-link svg{width:40px;height:40px;transition:transform .3s var(--ease)}
.ig-link:hover svg{transform:rotate(-8deg) scale(1.06)}
.ig-link:hover span{text-decoration:underline;text-underline-offset:4px}
.carosello{position:relative}
.lavori .carosello{margin-top:14px;padding:0 75px 0 68px}
.traccia{display:flex;gap:15px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
.traccia::-webkit-scrollbar{display:none}
.lav-traccia li{flex:0 0 var(--lw,247px);height:178px;border-radius:5px;overflow:hidden;scroll-snap-align:start;background:#e6e3df}
/* larghezze delle miniature come nel design (235/244/247/259/253) */
.lav-traccia li:nth-child(5n+1){--lw:235px}
.lav-traccia li:nth-child(5n+2){--lw:244px}
.lav-traccia li:nth-child(5n+4){--lw:259px}
.lav-traccia li:nth-child(5n+5){--lw:253px}
.lav-traccia img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transition:transform .7s var(--ease)}
.lav-traccia li:hover img{transform:scale(1.05)}
.frecce{position:absolute;top:50%;width:44px;height:64px;margin-top:-32px;display:flex;align-items:center;justify-content:center;color:var(--nero);transition:opacity .25s,transform .25s var(--ease)}
.frecce .ic{width:40px;height:40px;stroke-width:1.9}
.frecce.prec{left:15px}
.frecce.succ{right:14px}
.lavori .frecce{width:56px}
.lavori .frecce .ic{width:56px;height:56px;stroke-width:1.6}
.lavori .frecce.prec{left:6px}
.lavori .frecce.succ{right:10px}
.frecce:hover{transform:scale(1.12)}
.frecce[disabled]{opacity:.4;cursor:default;transform:none}

/* ---------- Recensioni ---------- */
.recensioni{position:relative;background:var(--nero-banda);color:#fff;height:237px;overflow:hidden}
.recensioni>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.recensioni::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(13,13,13,0) 0,rgba(13,13,13,.3) 130px,var(--nero-banda) 265px,var(--nero-banda) calc(100% - 160px),rgba(13,13,13,.72) 100%)}
.recensioni .box{z-index:2;height:100%;padding:16px 0 0}
.rec-testa{display:flex;justify-content:space-between;align-items:flex-start;padding:0 113px 0 122px}
.recensioni .titolo{color:#fff;font-size:36px;line-height:40px}
.recensioni .sotto{font-size:21px;line-height:22px;color:var(--grigio-chiaro-2)}
.voto{display:grid;grid-template-columns:auto auto auto;grid-template-rows:auto auto;column-gap:16px;align-items:center;text-decoration:none;color:#fff;margin-top:-2px}
.google{grid-row:1;font-family:var(--sans);font-weight:500;font-size:39.5px;line-height:40px;letter-spacing:-.07em}
.google span:nth-child(1),.google span:nth-child(4){color:#4285F4}
.google span:nth-child(2),.google span:nth-child(6){color:#EA4335}
.google span:nth-child(3){color:#FBBC05}
.google span:nth-child(5){color:#34A853}
.voto-n{grid-row:1;font-size:27px;line-height:30px;font-weight:500}
.stelle{grid-row:1;display:flex;gap:3px;margin-left:14px}
.stelle .ic{width:25px;height:25px;fill:var(--stelle);stroke:var(--stelle);stroke-width:1}
.voto-sub{grid-row:2;grid-column:3;justify-self:center;margin-left:14px;font-size:14.5px;line-height:18px;color:#B0B0B0}
.voto:hover .voto-sub{color:#fff;text-decoration:underline;text-underline-offset:3px}
.rec-car{margin-top:11px;padding:0 93px 0 106px}
.rec-traccia{gap:20px}
.rec-traccia li{flex:0 0 400px;scroll-snap-align:start;transition:opacity .35s var(--ease),transform .35s var(--ease)}
.rec-traccia blockquote{display:flex;flex-direction:column;height:128px;background:var(--carta);color:var(--testo-recensioni);border-radius:var(--r);padding:18px 18px 11px 22px}
.rec-traccia blockquote p{position:relative;padding-left:24px;font-size:19px;line-height:22.5px;font-weight:500;color:var(--testo-recensioni)}
.rec-traccia blockquote p .ic{position:absolute;left:0;top:3px;width:16px;height:16px;color:#2a2a2a}
.rec-traccia footer{margin-top:auto;display:flex;align-items:center;gap:10px;font-size:19px;line-height:22px;color:#3A3A39}
.rec-traccia footer .ic{width:16px;height:16px;stroke-width:2;color:var(--testo-recensioni)}
.rec-traccia footer small{font-size:15px;color:#8a8a88}
.recensioni .frecce{color:#fff;width:62px}
.recensioni .frecce.prec{left:22px}
.recensioni .frecce.succ{right:22px}
.recensioni .frecce .ic{width:62px;height:62px;stroke-width:1.3}
.rec-traccia.ruota li{opacity:0;transform:translateX(-10px)}

/* ---------- CTA telefono ---------- */
.cta-m{display:none}

/* ---------- Footer ---------- */
.ftr{background:var(--avorio);color:var(--grigio)}
.ftr-griglia{display:grid;grid-template-columns:327fr 244fr 422fr 371fr;padding:21px 38px 0;min-height:245px}
.ftr-col{padding-top:0}
.ftr-col+.ftr-col{border-left:1px solid var(--filetto);margin:6px 0 5px;padding-top:0}
.ftr-marchio{padding:0 0 0 13px!important}
.ftr-marchio img{width:230px;height:auto;margin:-4px 0 0 14px}
.ftr-marchio p{margin-top:24px;font-size:21px;line-height:32px;color:var(--grigio)}
.ftr-marchio p span{display:block}
.ftr-link{padding-left:38px!important}
.ftr-contatti{padding-left:57px!important}
.ftr-orari{padding-left:32px!important}
.ftr-h{font-family:var(--sans);font-size:20.6px;line-height:26px;font-weight:700;color:var(--inchiostro);margin-top:-6px}
.ftr-link ul{margin-top:3px}
.ftr-link li{font-size:21px;line-height:26px}
.ftr-link a{display:inline-block;vertical-align:top;font-size:21px;line-height:26px;color:var(--grigio);text-decoration:none;transition:color .2s,transform .25s var(--ease)}
.ftr-link a:hover{color:var(--inchiostro);transform:translateX(3px)}
.ftr-lista li{display:flex;align-items:center;gap:28px;min-height:38px;font-size:20.4px;line-height:24px}
.ftr-lista .ic{width:23px;height:23px;color:var(--inchiostro);stroke-width:2.2}
.ftr-lista a{text-decoration:none;color:var(--grigio);transition:color .2s}
.ftr-lista a:hover{color:var(--inchiostro);text-decoration:underline;text-underline-offset:3px}
.orari{display:flex;gap:24px;margin-top:9px}
.orari>.ic{width:25px;height:25px;color:var(--inchiostro);stroke-width:2.2;margin-top:4px}
.orari dl{display:grid;grid-template-columns:105px auto;row-gap:0;font-size:20.7px;line-height:30px;color:var(--grigio)}
.orari dt,.orari dd{margin:0}
.ftr-fondo{display:flex;align-items:center;gap:24px;margin:0 38px;border-top:1px solid var(--filetto);height:62px;padding-bottom:8px}
.copyright{font-size:16.7px;color:#5C5C5A;margin-right:auto}
.credit{font-size:14px;color:#8a8987;margin-right:auto}
.credit a{color:#5d5c5a;text-decoration:underline;text-underline-offset:2px}
.credit a:hover{color:var(--inchiostro)}
.legale{display:flex;align-items:center;gap:22px;font-size:18.3px;color:#5C5C5A;position:relative;top:0}
.legale a{text-decoration:none;color:inherit}
.legale a:hover{color:var(--inchiostro);text-decoration:underline;text-underline-offset:3px}
.legale .sep{width:1px;height:20px;background:#cfcdc8}
.social{display:flex;align-items:center;gap:21px;margin-left:20px}
.social a{display:flex;align-items:center;justify-content:center;color:var(--nero);transition:transform .25s var(--ease)}
.social a:hover{transform:translateY(-2px)}
.social .s-ig .ic{width:33px;height:33px;stroke-width:2.1}
.social .s-fb{width:32px;height:32px;color:var(--nero)}
.social .s-fb .ic{width:32px;height:32px}

/* ---------- Banner cookie ---------- */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:14px;align-items:center;justify-content:center;padding:9px 16px;font-size:13.5px;line-height:1.35;background:var(--nero);color:#e9e9e8;border-top:1px solid #222;opacity:0;visibility:hidden;transform:translateY(100%);transition:transform .45s var(--ease),opacity .45s var(--ease),visibility 0s linear .45s}
.cookie.vis{opacity:.97;visibility:visible;transform:none;transition:transform .45s var(--ease),opacity .45s var(--ease),visibility 0s}
.cookie[hidden]{display:none}
.cookie a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.cookie button{display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:#fff;opacity:.75;flex:none}
.cookie button:hover{opacity:1}
.cookie .ic{width:18px;height:18px;stroke-width:2}
.cookie .ck-corto{display:none}

/* ---------- Pagine interne (privacy, 404) ---------- */
.pagina{background:var(--avorio);padding:150px 68px 70px}
.pagina .box{max-width:860px}
.pagina h1{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1.05;color:var(--inchiostro)}
.pagina h2{font-family:var(--serif);font-weight:500;font-size:28px;line-height:1.2;margin-top:38px;color:var(--inchiostro)}
.pagina p,.pagina li{font-size:18px;line-height:1.6;color:#4f4f4d;margin-top:12px}
.pagina ul{list-style:disc;padding-left:22px}
.pagina a{color:var(--inchiostro);text-underline-offset:3px}
.pagina .agg{margin-top:8px;color:var(--grigio);font-size:16px}
.p404 .btn{height:60px;padding:0 30px;font-size:16px}
.p404 .azioni{display:flex;flex-wrap:wrap;gap:18px;margin-top:34px}
.p404 .btn-scuro{background:var(--nero);color:#fff}
.p404 .btn-scuro:hover{background:#2a2a2a;transform:translateY(-2px)}

/* ---------- Movimento ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* ================= Tra 1180 e 1439 ================= */
@media (max-width:1439px){
  .serv-t{font-size:clamp(13.5px,1.09vw,15.7px)}
}

/* ================= Tablet (768–1179) ================= */
@media (max-width:1179px){
  .hdr .box{padding:0 28px 0 40px}
  .nav{position:absolute;top:82px;left:0;right:0;background:var(--nero);display:none;padding:10px 40px 28px;border-top:1px solid #1d1d1d}
  .nav.aperto{display:block}
  .nav ul{flex-direction:column;gap:0}
  .nav a{font-size:22px;line-height:28px;padding:12px 0;border-bottom:1px solid #1f1f1f}
  .nav a::after{display:none}
  .btn-hdr{margin-left:auto;margin-right:18px}
  .burger{display:inline-flex}
  .hero h1{font-size:72px;line-height:64px}
  .hero-p{font-size:23px;line-height:29px}
  .vantaggi{flex-wrap:wrap;gap:22px 30px;max-width:620px;margin-left:0}
  .vantaggi li:nth-child(n){width:auto;gap:19px}
  .firma{display:none}
  .serv-grid{grid-template-columns:repeat(3,1fr);gap:18px;padding:0 28px}
  .serv-t{font-size:15.7px}
  .colori{grid-template-columns:repeat(3,1fr);height:auto}
  .col-intro{grid-column:1/-1;padding:56px 40px 48px}
  .prod{height:445px}
  .prod img{left:0;right:0;margin:0 auto}
  .salone .box{grid-template-columns:1fr 1.4fr;gap:32px;padding:30px 28px 0}
  .lav-testa{padding:0 28px}
  .ig-link{right:28px}
  .lavori .carosello{padding:0 56px}
  .frecce.prec{left:6px}
  .frecce.succ{right:6px}
  .recensioni{height:auto;padding-bottom:28px}
  .rec-testa{flex-direction:column;gap:14px;padding:0 56px}
  .voto{margin-top:0}
  .rec-car{padding:0 56px}
  .recensioni .frecce.prec{left:4px}
  .recensioni .frecce.succ{right:4px}
  .ftr-griglia{grid-template-columns:1fr 1fr;row-gap:32px;padding:32px 28px 24px}
  .ftr-col+.ftr-col{border-left:0;margin:0}
  .ftr-link{padding-left:0!important}
  .ftr-contatti{padding-left:13px!important}
  .ftr-orari{padding-left:0!important}
  .ftr-fondo{flex-wrap:wrap;height:auto;padding:16px 0 70px;margin:0 28px;gap:12px 22px}
  .credit{order:5;width:100%;margin-right:0}
}

/* Tablet stretto: foto sopra, testo sotto (come da telefono, più grande) */
@media (min-width:768px) and (max-width:1023px){
  .hero{height:auto;padding-bottom:48px}
  .hero-media{position:relative;display:block;top:auto;left:0;right:0;width:auto;height:470px;margin-top:82px}
  .hero-media img{object-position:62% 0}
  .hero::before{background:linear-gradient(180deg,rgba(11,11,11,0) 0,rgba(11,11,11,0) 330px,rgba(11,11,11,.8) 470px,#0B0B0B 560px)}
  .hero::after{display:none}
  .hero .box{height:auto;margin-top:-96px;padding:0 40px}
  .hero h1{font-size:66px;line-height:60px}
  .firma{display:none}
  .lav-testa .ig-link{position:static;margin-top:12px;display:inline-flex}
}
@media (min-width:1024px) and (max-width:1179px){
  .hero-media{left:22%;right:-5.5%;width:auto}
  .hero::before{background:linear-gradient(90deg,#0B0B0B 0%,#0B0B0B 30%,rgba(11,11,11,.85) 40%,rgba(11,11,11,.45) 52%,rgba(11,11,11,0) 64%)}
  .hero h1{font-size:68px;line-height:62px}
  .lav-testa .ig-link{top:6px}
}

/* ================= Telefono (< 768) — design-telefono.png a 390 px ================= */
@media (max-width:767px){
  body{font-size:17px}
  .solo-d{display:none!important}
  .solo-m{display:revert!important}
  /* testata alta 145 px come nel design (i primi ~30 px sono la fascia della notch), logo e hamburger dove stanno nel design */
  .hdr,.hdr .box{height:145px}
  .hdr{background:var(--nero-testata-m)}
  .hdr .box{padding:29px 14px 0 71px;justify-content:flex-start}
  .logo img{width:220px}
  .btn-hdr{display:none}
  .burger{position:absolute;right:18px;top:58px;margin:0}
  .burger .ic{width:36px;height:26px;stroke-width:3.4}
  .nav{top:145px;padding:6px 23px 24px}
  .nav a{font-size:21px}
  .nav .nav-prenota{display:flex!important;margin-top:20px;height:56px;width:100%;font-size:16px;line-height:1;padding:0;border-bottom:0;color:var(--testo-pulsante)}
  .nav .nav-prenota:hover{color:var(--testo-pulsante)}

  .hero{height:858px}
  .hero-media{top:145px;left:0;right:0;width:auto;bottom:auto;height:360px}
  .hero-media img{object-position:0 0}
  .hero::before{background:linear-gradient(180deg,rgba(11,11,11,0) 0,rgba(11,11,11,0) 323px,rgba(11,11,11,.75) 418px,#0B0B0B 493px)}
  .hero::after{display:none}
  .hero .box{padding:435px 18px 0 23px}
  .occhiello{font-size:18.2px;line-height:20px;font-weight:600;letter-spacing:.062em}
  .hero h1{margin-top:10px;font-size:46.2px;line-height:46px}
  .hero-p{margin-top:6.5px;font-size:24.4px;line-height:28px;max-width:none}
  .hero-cta{margin-top:16.5px}
  .hero-cta .btn-rosa{width:228px;height:59px;font-size:17.5px;gap:22px}
  .hero-cta .btn-linea{display:none}
  .vantaggi{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:25px 0 0 -5px;max-width:none}
  .vantaggi li,.vantaggi li:nth-child(n){width:auto;flex-direction:column;gap:5px;text-align:center;font-size:16.2px;line-height:22px;font-weight:600}
  .vantaggi li:nth-child(4){display:none}
  .vantaggi .ic{width:38px;height:38px;stroke-width:2}

  .servizi{position:relative;z-index:2;margin-top:-4px;border-radius:4px 4px 0 0;padding:16px 0 18px}
  .servizi .titolo{font-size:30.9px;line-height:36px}
  .serv-grid{grid-template-columns:1fr 1fr;gap:12px 16px;padding:0 19px 0 18px;margin-top:8px}
  .serv-card.ordine-6{order:6}
  .serv-card a{border-radius:5px;box-shadow:0 2px 9px rgba(0,0,0,.14),0 0 2px rgba(0,0,0,.06)}
  .serv-foto{aspect-ratio:169/110}
  .serv-foto img{object-position:50% var(--py,35%)}
  .serv-corpo{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 9px 0 12px}
  .serv-t{font-family:var(--sans);font-weight:600;font-size:16.8px;line-height:20px;letter-spacing:0;text-transform:none;color:var(--inchiostro)}
  .serv-piu,.serv-corpo .ic-tondo{display:none}
  .serv-corpo .ic-chev{display:block;width:21px;height:21px;stroke-width:2.2;color:var(--inchiostro)}
  .serv-card.senza-chev .ic-chev{display:none}
  .serv-card.senza-chev .serv-t{white-space:nowrap}

  .colori{display:block;background:var(--nero)}
  .col-intro{padding:22.5px 0 32px;text-align:left}
  .col-intro>img,.col-intro::after{display:none}
  .col-intro .titolo{font-size:33.8px;line-height:39px;padding-left:37px}
  .col-intro>p{display:none}
  .col-lista{display:block;margin:6px 0 0 43px}
  .col-lista li{display:grid;grid-template-columns:46px 36px 82px 1fr;align-items:center;height:55.5px;font-size:19px}
  .col-lista .ic{grid-column:1;width:46px;height:46px;stroke-width:1.25;color:#fff}
  .col-lista b{grid-column:3;font-weight:700;color:#fff}
  .col-lista span{grid-column:4;color:#BDBAB6}
  .col-intro .btn{display:flex;margin:8.5px 0 0 62px;width:276px;height:59px;font-size:17.6px}
  .prodotti{display:none;padding:4px 0 26px}
  .prodotti.aperto{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 18px 26px;scrollbar-width:none}
  .prodotti.aperto::-webkit-scrollbar{display:none}
  .prodotti.aperto .prod{flex:0 0 80%;height:440px;border-radius:8px;scroll-snap-align:center;padding:28px 12px 0 26px}
  .prodotti.aperto .prod img{width:auto;height:250px;bottom:4px;left:0;right:0;margin:0 auto}
  .prodotti.aperto .prod-desc br{display:none}

  .salone{position:relative;z-index:2;margin-top:-4px;border-radius:4px 4px 0 0}
  .salone .box{display:grid;grid-template-columns:1fr;padding:20px 20px 0;gap:0}
  .sal-testo{display:contents}
  .salone .titolo{grid-row:1;text-align:center;font-size:30.3px;line-height:36px}
  .salone p{display:none}
  .sal-foto{grid-row:2;grid-column:1;margin-top:6px;height:172px;border-radius:5px}
  .salone .btn{grid-row:2;grid-column:1;align-self:end;justify-self:center;margin:0 0 7px;width:290px;height:61px;font-size:17.2px;z-index:1;box-shadow:0 4px 14px rgba(0,0,0,.22)}

  .lavori{padding:27px 0 17px}
  .lav-testa{padding:0 20px;text-align:center}
  .lavori .titolo{font-size:30.3px;line-height:36px}
  .lavori .carosello{margin-top:11px;padding:0 19px 0 20px}
  .lav-traccia{gap:5px;padding:0;border-radius:5px}
  .lav-traccia li{flex:0 0 var(--lw,90px);height:123px;border-radius:5px}
  .lav-traccia li:nth-child(4n+1){--lw:84px}
  .lav-traccia li:nth-child(4n+2){--lw:90px}
  .lav-traccia li:nth-child(4n+3){--lw:95px}
  .lav-traccia li:nth-child(4n+4){--lw:88px}
  .lavori .frecce{width:24px;height:40px;margin-top:-20px;background:#fff;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.18);z-index:1}
  .lavori .frecce .ic{width:22px;height:22px;stroke-width:2.2}
  .lavori .frecce.prec{left:11px}
  .lavori .frecce.succ{right:11px}

  .recensioni{display:none}

  .cta-m{display:block;position:relative;background:var(--nero-banda);color:#fff;height:212px;overflow:hidden}
  .cta-m>img{position:absolute;right:0;top:0;width:46%;height:100%;object-fit:cover;object-position:50% 50%;z-index:0}
  .cta-m::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--nero-banda) 0,var(--nero-banda) 62%,rgba(13,13,13,.55) 71%,rgba(13,13,13,.12) 80%,rgba(13,13,13,0) 86%)}
  .cta-m .box{z-index:2;padding:26px 20px 0 28px}
  .cta-m .titolo{color:#fff;font-size:36.5px;line-height:41px}
  .cta-m .btn{margin-top:18px;width:251px;height:62px;font-size:17.5px;gap:24px}

  .ftr{color:var(--grigio)}
  .ftr-griglia{display:block;padding:16px 0 0;min-height:0}
  .ftr-marchio{padding:0!important;text-align:center}
  .ftr-marchio img{width:183px;margin:13px auto 13px}
  .ftr-marchio p{margin-top:3px;padding-left:93px;text-align:left;font-size:20px;line-height:39px}
  .ftr-marchio p span:first-child{display:none}
  .ftr-link{display:none}
  .ftr-col+.ftr-col{border:0;margin:0}
  .ftr-contatti,.ftr-orari{padding:0 0 0 42px!important}
  .ftr-h{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .ftr-lista li{gap:30px;min-height:39px;font-size:20px}
  .ftr-lista li.indirizzo{display:none}
  .ftr-lista .ic{width:22px;height:22px}
  .orari{gap:26px;margin-top:2px}
  .orari dl{grid-template-columns:121px auto;font-size:20px;line-height:31px}
  .ftr-fondo{display:grid;grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:50px;row-gap:12px;margin:40px 20px 0;padding:0 0 14px;border-top:0;height:auto}
  .copyright{display:none}
  .credit{grid-row:2;grid-column:1/-1;text-align:center;margin:0;font-size:13.5px;width:auto;order:0}
  .legale{grid-row:1;grid-column:1;font-size:18.3px;gap:14px;top:0;left:12px}
  .social{grid-row:1;grid-column:2;margin-left:0;gap:20px;position:relative;left:12px}
  .cookie{font-size:12px;padding:7px 10px;gap:8px;justify-content:space-between}
  .cookie .ck-lungo{display:none}
  .cookie .ck-corto{display:inline}

  .pagina{padding:180px 20px 50px}
  .pagina h1{font-size:38px}
}
@media (max-width:767px) and (prefers-reduced-motion:no-preference){
  .serv-card a:hover{transform:none}
}