/* Roxy Estetic — fedele al design di Claude Design (design_handoff_roxy_estetic).
   Punti di rottura: telefono < 640, tablet 640–899, computer ≥ 900. */

@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/cormorant-garamond.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 700;font-display:swap;src:url(../fonts/cormorant-garamond-italic.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/manrope.woff2) format('woff2')}

:root{
  --malva:#9a6e85;--malva-scuro:#715062;--marrone:#3d2b26;--testo2:#5a4640;--nota:#7a6560;
  --crema:#fbf6ef;--sabbia:#f3ebe0;--sabbia2:#e7dccd;--sabbia3:#d9cbb9;
  --cipria:#f0e3e5;--cipria2:#f7eef0;--cipria3:#e6d0d7;
  --rd:'Cormorant Garamond',Georgia,serif;--rb:'Manrope',system-ui,sans-serif;
  --gutter:clamp(16px,4vw,40px);--edge:clamp(22px,4.4vw,56px);
  --ht:.75;--hp:.65;
}
@media (max-width:899px){:root{--ht:1}}
@media (max-width:639px){:root{--ht:1.15}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--marrone);font-family:var(--rb);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:var(--marrone);text-decoration:none}
a:hover{color:var(--malva)}
button{font:inherit}
h1,h2,h3,p,figure,blockquote,dl,dd,ul,ol{margin:0}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
[data-track]{scrollbar-width:none}
[data-track]::-webkit-scrollbar{display:none}
:focus-visible{outline:2px solid var(--malva);outline-offset:3px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.nw{white-space:nowrap}
.html-lock{overflow:hidden}

/* ---------- Testi ricorrenti ---------- */
.eyebrow{font-size:11px;font-weight:500;letter-spacing:.18em;color:var(--malva-scuro);white-space:nowrap}
.eyebrow--wide{letter-spacing:.22em}
.h2{font-family:var(--rd);font-weight:400;font-size:clamp(32px,3.6vw,52px);line-height:1.05;letter-spacing:-.01em;text-wrap:balance}
.h2--s{font-size:clamp(30px,3.2vw,46px);line-height:1.08}
.h2 i,.h1 i{font-weight:400}
.lead{max-width:500px;font-size:14px;line-height:1.75;color:var(--testo2)}
.stack{display:flex;flex-direction:column;gap:16px}
.stack--14{gap:14px}

/* ---------- Pulsanti ---------- */
.btn{display:inline-block;white-space:nowrap;text-align:center;border:1px solid currentColor;background:transparent;padding:14px 26px;font-family:var(--rb);font-size:11px;letter-spacing:.16em;line-height:1.3;cursor:pointer;color:var(--marrone)}
.btn--malva{background:var(--malva);border-color:var(--malva);color:#fff}
.btn--malva:hover{background:var(--malva-scuro);border-color:var(--malva-scuro);color:#fff}
.btn--light{border-color:#fff;color:#fff}
.btn--light:hover{background:#fff;color:var(--marrone)}
.btn--line{border-color:var(--marrone);color:var(--marrone);padding:14px 22px;letter-spacing:.14em}
.btn--line:hover{background:var(--marrone);color:#fff}
.btn--s{padding:12px 20px;letter-spacing:.14em}
.btn--xs{padding:12px 18px;letter-spacing:.14em}
.btn--m{padding:13px 22px;letter-spacing:.14em}
.btn--full{display:block;width:100%;padding:16px 26px}

/* ---------- Foto: il trattamento che le fa parlare con la palette ---------- */
.ph{position:relative;overflow:hidden;background:var(--marrone)}
.ph img,.ph video{width:100%;height:100%;object-fit:cover;filter:saturate(.85) sepia(var(--sep,.12)) contrast(1.06) brightness(var(--br,.9))}
.ph::after{content:"";position:absolute;inset:0;background:var(--malva-scuro);mix-blend-mode:soft-light;opacity:var(--veil,.4);pointer-events:none}
.arch{border-radius:999px 999px 0 0}

/* ---------- Intestazione ---------- */
.hd{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(251,246,239,.72);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);transition:background-color .35s;color:var(--marrone);--ink:var(--marrone);--logo:var(--malva)}
.js .hd.is-top{background:rgba(61,43,38,.22);--ink:#fff;--logo:#fff}
.hd__in{max-width:1240px;margin:0 auto;height:64px;padding:0 clamp(16px,3vw,40px);display:flex;justify-content:space-between;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:12px;white-space:nowrap;font-family:var(--rd);font-size:19px;letter-spacing:.24em;color:var(--logo,var(--malva));transition:color .35s}
.logo:hover{color:var(--logo,var(--malva))}
.logo img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.hd__nav{display:flex;gap:26px;white-space:nowrap;font-size:11px;letter-spacing:.14em}
.hd__nav a{color:var(--ink);transition:color .35s,opacity .2s}
.hd__nav a:hover{color:var(--ink);opacity:.7}
.hd__right{display:flex;align-items:center;gap:8px}
.hd__book{white-space:nowrap;border:1px solid var(--ink);background:transparent;color:var(--ink);padding:9px 16px;font-size:11px;letter-spacing:.14em;cursor:pointer;transition:color .35s,border-color .35s,background-color .2s}
.hd__book:hover{background:var(--marrone);border-color:var(--marrone);color:#fff}
.burger{width:44px;height:44px;margin-right:-10px;border:0;background:transparent;cursor:pointer;display:none;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.burger span{display:block;width:22px;height:1px;background:var(--ink);transition:background-color .35s}
@media (max-width:899px){.hd__nav{display:none}.burger{display:flex}}
@media (max-width:639px){.hd__book{display:none}}

/* Intestazione della pagina privacy: sempre chiara, ferma in alto */
.hd--plain{position:sticky;background:rgba(251,246,239,.9);border-bottom:1px solid var(--sabbia2)}
.hd__back{white-space:nowrap;font-size:11px;letter-spacing:.14em;color:var(--marrone);padding:14px 0}
@media (max-width:639px){.hd__back-long{display:none}}

/* ---------- Menu a pannello (telefono e tablet) ---------- */
.menu{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--crema);color:var(--marrone);overflow-y:auto}
.menu[open]{display:flex;flex-direction:column}
.menu::backdrop{background:transparent}
.menu__top{height:64px;flex:0 0 auto;padding:0 clamp(16px,3vw,40px);display:flex;justify-content:space-between;align-items:center}
.menu .logo{--logo:var(--malva)}
.x{width:44px;height:44px;margin-right:-10px;border:0;background:transparent;color:var(--marrone);font-size:26px;font-weight:300;line-height:1;cursor:pointer}
.menu__nav{flex:1 0 auto;padding:clamp(24px,6svh,56px) clamp(22px,5vw,56px);display:flex;flex-direction:column;border-top:1px solid var(--sabbia2)}
.menu__nav a{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--sabbia2);font-family:var(--rd);font-size:clamp(30px,6vw,44px);line-height:1.1;color:var(--marrone)}
.menu__nav a span:first-child{white-space:nowrap}
.menu__nav a span+span{font-family:var(--rb);font-size:11px;color:var(--malva-scuro)}
.menu__foot{flex:0 0 auto;padding:24px clamp(22px,5vw,56px) 32px;display:flex;flex-direction:column;gap:14px;font-size:13px;line-height:1.6;color:var(--testo2)}
.menu__foot>span{display:flex;flex-direction:column}

/* ---------- Barra in basso (solo telefono) ---------- */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(251,246,239,.86);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);border-top:1px solid var(--sabbia2)}
.bar a,.bar button{display:flex;align-items:center;justify-content:center;height:46px;font-size:11px;letter-spacing:.14em;white-space:nowrap;cursor:pointer}
.bar a{border:1px solid var(--marrone);color:var(--marrone)}
.bar button{border:1px solid var(--malva);background:var(--malva);color:#fff}
@media (max-width:639px){.bar.is-on{display:grid}}

/* ---------- Finestra «Prenota» ---------- */
.book{width:calc(100% - 40px);max-width:440px;max-height:calc(100svh - 40px);margin:auto;padding:clamp(28px,5vw,44px);border:0;background:var(--crema);color:var(--marrone);box-shadow:0 20px 60px rgba(43,30,26,.3);overflow-y:auto}
.book[open]{display:flex;flex-direction:column;gap:22px}
.book::backdrop{background:rgba(43,30,26,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.book .x{position:absolute;top:12px;right:12px;margin:0;font-size:22px}
.book__kicker{font-family:var(--rd);font-style:italic;font-size:19px;color:var(--malva)}
.book h2{font-family:var(--rd);font-weight:400;font-size:clamp(28px,4vw,36px);line-height:1.1}
.book__list{display:flex;flex-direction:column;border-top:1px solid var(--sabbia2)}
.book__list a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--sabbia2)}
.book__list a>span:first-child{flex:1;display:flex;flex-direction:column;gap:2px}
.book__list small{font-size:10px;font-weight:500;letter-spacing:.18em;color:var(--malva-scuro)}
.book__list b{font-weight:400;white-space:nowrap;font-size:16px}
.book__note{font-size:12px;line-height:1.6;color:var(--testo2)}

/* ---------- Aperture ---------- */
.hero{position:relative;overflow:hidden;color:#fff;background:var(--marrone)}
.hero>.ph{position:absolute;inset:0}
.hero>.ph img{--sep:.14;--br:.88}
.hero>.ph{--veil:.5}
.hero__shade{position:absolute;inset:0}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--cipria)}
.crumbs a{color:var(--cipria)}
.crumbs a:hover{color:#fff}
.h1{font-family:var(--rd);font-weight:400;font-size:clamp(38px,5.4vw,72px);line-height:1;letter-spacing:-.015em;text-wrap:balance}
.hero i{color:var(--cipria)}

/* Home: apertura editoriale */
.hero--home{height:100svh;min-height:640px;max-height:1000px}
.hero--home img{object-position:50% 45%}
.hero--home .hero__shade{background:linear-gradient(90deg,rgba(43,30,26,.55) 0%,rgba(43,30,26,.1) 55%,rgba(43,30,26,.35) 100%),linear-gradient(180deg,rgba(43,30,26,0) 45%,rgba(43,30,26,.55) 100%)}
.hero__top{position:absolute;top:calc(64px + clamp(16px,2.4vw,28px));left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.hero__top h1{white-space:nowrap;font-size:clamp(10px,1vw,12px);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--cipria)}
.hero__top i{white-space:nowrap;font-family:var(--rd);font-size:clamp(17px,1.6vw,20px);color:var(--cipria)}
.hero__body{position:absolute;left:var(--edge);right:var(--edge);top:calc(64px + clamp(56px,7vw,88px));bottom:clamp(24px,4vw,52px);display:flex;flex-direction:column}
.hero__sp1{flex:calc(1 - var(--hp)) 1 0px}
.hero__sp2{flex:var(--hp) 1 0px}
.hero__title{font-family:var(--rd);font-weight:400;font-size:calc(clamp(34px,6.6vw,84px) * var(--ht));line-height:.98;letter-spacing:-.015em;text-wrap:balance;max-width:min(760px,calc(100% - 320px))}
.hero__info{position:absolute;right:0;bottom:0;width:260px;display:flex;flex-direction:column;gap:14px;font-size:13px;line-height:1.5}
.hero__info>span{display:flex;flex-direction:column}
.hero__info>span span+span{color:var(--sabbia)}
@media (max-width:899px){
  .hero--home img{object-position:62% 50%}
  .hero--home .hero__shade{background:linear-gradient(180deg,rgba(43,30,26,.35) 0%,rgba(43,30,26,.05) 35%,rgba(43,30,26,.7) 100%)}
  .hero__title{max-width:100%}
  .hero__info{position:static;width:auto;margin-top:clamp(20px,3vw,40px);flex:0 0 auto}
}
@media (min-width:640px) and (max-width:899px){.hero--home{height:72svh;min-height:600px}}
@media (max-width:639px){.hero--home img{object-position:68% 50%}.hero__info{gap:10px}}

/* Pagine interne: apertura con briciole */
.hero--page .hero__shade{background:linear-gradient(180deg,rgba(43,30,26,.2) 25%,rgba(43,30,26,.72) 100%)}
.hero--list{height:68svh;min-height:480px;max-height:720px}
.hero--list .hero__shade{background:linear-gradient(180deg,rgba(43,30,26,.2) 20%,rgba(43,30,26,.7) 100%)}
.hero--service{height:78svh;min-height:540px;max-height:820px}
.hero__content{position:absolute;left:var(--edge);right:var(--edge);bottom:clamp(32px,5vw,64px);display:flex;flex-direction:column;gap:16px;max-width:860px}
.hero--list .hero__content{max-width:820px}
.hero__lead{max-width:560px;font-size:15px;line-height:1.7;color:var(--sabbia)}
.hero__kicker{font-size:11px;font-weight:500;letter-spacing:.18em;color:var(--cipria)}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}

/* ---------- Home: trattamenti ad arco ---------- */
.tr{padding:clamp(64px,11svh,128px) 0 clamp(64px,10svh,120px);display:flex;flex-direction:column;align-items:center;gap:clamp(36px,6svh,64px);text-align:center}
.tr__head{display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 20px}
.tr__wrap{position:relative;width:100%;max-width:1160px;margin:0 auto}
.tr__track{display:flex;gap:56px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 clamp(20px,5vw,56px);scroll-padding:0 clamp(20px,5vw,56px)}
.tr__card{flex:0 0 calc((100% - 168px) / 4);scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:12px}
.tr__card .ph{width:100%;aspect-ratio:2/3}
.tr__card img{transition:scale 1.2s var(--ease-soft)}
.tr__card:hover img{scale:1.05}
.tr__card h3{margin-top:14px;font-family:var(--rd);font-weight:400;font-size:clamp(20px,1.8vw,23px);line-height:1.15;white-space:nowrap}
.tr__card p{max-width:240px;font-size:13px;line-height:1.7;color:var(--nota);text-wrap:pretty}
.dots-nav{display:none;align-items:center;gap:8px}
.arrow{width:44px;height:44px;border:0;background:transparent;color:var(--malva-scuro);font-family:var(--rd);font-size:22px;line-height:1;cursor:pointer}
.dots{display:flex;gap:4px}
.dots button{width:28px;height:28px;border:0;background:transparent;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dots button span{display:block;width:6px;height:6px;border-radius:3px;background:var(--cipria3);transition:width .3s,background-color .3s}
.dots button[aria-current="true"] span{width:20px;background:var(--malva)}
@media (min-width:640px) and (max-width:899px){
  .tr__track{gap:32px}
  .tr__card{flex-basis:calc((100% - 96px) / 4)}
}
@media (max-width:639px){
  .tr__track{gap:0;padding:0;scroll-padding:0}
  .tr__card{flex-basis:100%}
  .tr__card .ph{width:min(100%,250px)}
  .dots-nav{display:flex}
  .tr__all{display:none}
}

/* ---------- Citazione ---------- */
.cit{position:relative;overflow:hidden;background:var(--cipria);padding:clamp(96px,13vw,180px) clamp(24px,8vw,120px);display:flex;justify-content:center;text-align:center}
.cit__in{position:relative;max-width:1200px;display:flex;flex-direction:column;align-items:center;gap:clamp(16px,2vw,24px)}
.cit__a{font-family:var(--rd);font-weight:400;font-size:clamp(22px,2.9vw,40px);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
.cit__b{max-width:520px;font-family:var(--rd);font-style:italic;font-weight:400;font-size:clamp(19px,1.7vw,24px);line-height:1.4;color:var(--malva);text-wrap:balance}
@media (min-width:900px){.cit__a{white-space:nowrap}}

/* ---------- Chi sono ---------- */
.chi{max-width:1240px;margin:0 auto;padding:clamp(72px,9vw,120px) var(--gutter);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,88px);align-items:center}
.chi__vid{width:min(100%,460px);aspect-ratio:4/5;--veil:.3}
.chi__vid video{filter:saturate(.88) sepia(.12) contrast(1.04) brightness(.95)}
.chi .lead{margin-bottom:12px}
.points{max-width:560px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:24px 40px}
.points>div{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:1px solid var(--sabbia2)}
.points b{font-family:var(--rd);font-weight:400;font-size:22px;line-height:1.15}
.points span{font-size:13px;line-height:1.65;color:var(--testo2)}
.points a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:639px){.chi{grid-template-columns:minmax(0,1fr)}}

/* ---------- Recensioni ---------- */
.rev{background:#fff;padding:clamp(72px,9vw,120px) var(--gutter)}
.rev__in{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.rev__in>.stack .btn{align-self:flex-start;margin-top:8px}
.rev__right{display:flex;flex-direction:column;gap:18px;min-width:0}
.rev__track{display:flex;justify-content:flex-end;gap:min(56px,4.4vw);overflow-x:auto;scroll-snap-type:x mandatory}
.rev__card{flex:0 0 min(228px,17.8vw);scroll-snap-align:start;background:var(--cipria);color:var(--marrone);aspect-ratio:19/25;padding:clamp(18px,1.8vw,24px);display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.rev__stars{letter-spacing:.2em;font-size:13px;color:var(--malva-scuro)}
.rev__card blockquote{font-family:var(--rd);font-style:italic;font-size:clamp(16px,1.4vw,19px);line-height:1.35}
.rev__card figcaption{white-space:nowrap;font-size:11px;font-weight:500;letter-spacing:.14em;color:var(--malva-scuro)}
.rev__nav{display:none;justify-content:space-between;align-items:center;gap:12px}
.rev__nav .sq{width:44px;height:44px;border:1px solid var(--malva);background:transparent;color:var(--malva-scuro);font-size:16px;cursor:pointer}
.rev__nav .sq--fill{background:var(--malva);color:#fff}
@media (max-width:899px){
  .rev{padding-top:8px}
  .rev__in{grid-template-columns:minmax(0,1fr)}
  .rev__track{justify-content:flex-start;gap:16px}
  .rev__card{flex-basis:calc((100% - 32px) / 2.4);aspect-ratio:1/1}
  .rev__nav{display:flex}
}
@media (max-width:639px){.rev__card{flex-basis:72%}}

/* ---------- Sezioni a due colonne ---------- */
.duo{max-width:1240px;margin:0 auto;padding:clamp(72px,9vw,120px) var(--gutter);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(40px,6vw,88px);align-items:center}
.amb{background:var(--sabbia)}
.amb .h2{max-width:480px}
.amb .lead{max-width:440px}
.amb__ph{justify-self:end;width:min(100%,600px);aspect-ratio:5/6}
.amb__ph img{object-position:50% 70%}

.prod__art{position:relative;width:min(100%,560px);aspect-ratio:6/5}
.prod__a{position:absolute;inset:0 30% 0 0;overflow:hidden;background:var(--sabbia2)}
.prod__a img{width:100%;height:100%;object-fit:cover;transform:scale(1.15);filter:saturate(.8) sepia(.18) brightness(1.02)}
.prod__b{position:absolute;right:0;top:50%;transform:translateY(-50%);width:40%;aspect-ratio:2/3;overflow:hidden;background:#ece2d5;box-shadow:0 0 0 8px #fff}
.prod__b img{width:100%;height:100%;object-fit:cover;transform:scale(1.65);transform-origin:51% 47%;mix-blend-mode:multiply;filter:saturate(.85) brightness(1.08)}
.prod .lead{margin-bottom:12px}
.brands{border-bottom:1px solid var(--sabbia2)}
.brands>div{display:grid;grid-template-columns:minmax(150px,1fr) minmax(0,1.8fr);gap:20px;padding:24px 0;border-top:1px solid var(--malva)}
.brands>div>span{display:flex;flex-direction:column;gap:6px}
.brands b{font-family:var(--rd);font-weight:400;font-size:28px;line-height:1}
.brands small{white-space:nowrap;font-size:11px;font-weight:500;letter-spacing:.14em;color:var(--malva-scuro)}
.brands p{font-size:14px;line-height:1.7;color:var(--testo2)}
@media (max-width:639px){.brands>div{grid-template-columns:minmax(0,1fr);gap:12px}}

/* ---------- Domande frequenti ---------- */
.faq-bg{background:var(--cipria2)}
.faq{max-width:1240px;margin:0 auto;padding:clamp(72px,9vw,120px) var(--gutter);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(28px,6vw,88px);align-items:start}
.faq__short{margin-top:12px;display:flex;flex-direction:column;gap:18px;max-width:420px}
.faq__short div{display:flex;flex-direction:column;gap:4px}
.faq__short dt{font-size:14px;font-weight:500}
.faq__short dd{font-size:14px;line-height:1.65;color:var(--testo2)}
.acc{border-top:1px solid var(--marrone)}
.acc details{border-bottom:1px solid var(--cipria3)}
.acc summary{display:flex;justify-content:space-between;gap:16px;padding:20px 0;font-size:15px;font-weight:500}
.acc summary:hover{color:var(--malva-scuro)}
.acc summary span:first-child{flex:1}
.acc summary span+span{color:var(--malva);font-size:18px;font-weight:300}
.acc details[open] summary span+span{transform:rotate(45deg)}
.acc p{padding:0 0 20px;font-size:14px;line-height:1.75;color:var(--testo2)}

/* ---------- Prenota + fondo pagina ---------- */
.cta{position:relative;overflow:hidden;color:#fff;background:var(--marrone)}
.cta__bg{position:absolute;max-width:none;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);object-fit:cover;filter:blur(5px) saturate(.82) sepia(.12) contrast(1.1) brightness(.74)}
.cta__veil{position:absolute;inset:0;background:var(--malva-scuro);mix-blend-mode:soft-light;opacity:.5}
.cta__dark{position:absolute;inset:0;background:rgba(43,30,26,.34)}
.cta__in{position:relative;max-width:1080px;margin:0 auto;padding:clamp(72px,9vw,120px) var(--gutter) clamp(48px,6vw,72px);display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.cta h2{font-family:var(--rd);font-weight:400;font-size:clamp(36px,4.4vw,64px);line-height:1.02;letter-spacing:-.01em}
.cta h2 i{color:var(--cipria)}
.cta__lead{max-width:580px;font-size:14px;line-height:1.75;color:var(--sabbia)}
.cta__btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.cards{width:100%;max-width:820px;margin-top:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.card{background:rgba(251,246,239,.96);color:var(--marrone);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;align-items:stretch;gap:10px;text-align:left;min-width:0}
.card small{font-size:10px;font-weight:500;letter-spacing:.2em;color:var(--malva-scuro)}
.card__big{font-family:var(--rd);font-size:clamp(30px,3vw,38px);line-height:1;color:var(--marrone);white-space:nowrap}
.card__txt{font-size:13px;line-height:1.6;color:var(--testo2)}
.card__txt a{white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.card .btn{align-self:flex-start;margin-top:auto}
.card__apps{margin-top:auto;padding-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.where{width:100%;margin-top:clamp(32px,4vw,48px);display:flex;justify-content:center;flex-wrap:wrap;gap:12px 40px;font-size:13px;line-height:1.6;color:var(--sabbia)}
.where--pad{padding-top:24px}
.where a{color:#fff;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.ft{position:relative;background:rgba(61,43,38,.22);-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1)}
.ft__in{max-width:1240px;margin:0 auto;padding:24px var(--gutter);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-size:12px;color:var(--sabbia)}
.ft .logo{--logo:#fff;font-size:18px}
.ft__links{display:flex;flex-wrap:wrap;gap:8px 18px}
.ft__links a{color:#fff}
.ft__links a:hover{color:#fff;opacity:.7}
@media (max-width:639px){.has-bar .ft__in{padding-bottom:96px}}

/* ---------- Pagina Trattamenti ---------- */
.feat{padding:clamp(64px,9vw,120px) clamp(20px,5vw,56px);display:flex;flex-direction:column;align-items:center;gap:clamp(36px,5vw,56px);text-align:center}
.feat__grid{width:100%;max-width:1040px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:clamp(28px,4vw,56px)}
.feat__card{display:flex;flex-direction:column;align-items:center;gap:12px}
.feat__card .ph{width:100%;max-width:280px;aspect-ratio:2/3}
.feat__card img{transition:scale 1.2s var(--ease-soft)}
.feat__card:hover img{scale:1.05}
.feat__card h3{margin-top:14px;font-family:var(--rd);font-weight:400;font-size:clamp(22px,2vw,26px);line-height:1.15;text-wrap:balance}
.feat__card p{max-width:260px;font-size:13px;line-height:1.7;color:var(--nota);text-wrap:pretty}
.feat__card .go{white-space:nowrap;font-size:11px;letter-spacing:.14em;color:var(--malva-scuro)}

.all{background:var(--sabbia);padding:clamp(64px,9vw,120px) clamp(20px,5vw,56px)}
.all__in{max-width:1160px;margin:0 auto;display:flex;flex-direction:column}
.all__head{margin-bottom:clamp(32px,4vw,48px)}
.all__head .h2{max-width:640px}
.all__head i{color:var(--malva)}
.cat{scroll-margin-top:80px;display:grid;grid-template-columns:200px minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,4vw,64px);padding:clamp(28px,4vw,44px) 0;border-top:1px solid var(--sabbia3);align-items:start}
.cat .ph{width:100%;aspect-ratio:4/5;--veil:.35}
.cat .ph img{--br:.92}
.cat__txt{display:flex;flex-direction:column;gap:12px}
.cat__num{font-size:11px;color:var(--malva-scuro)}
.cat h2{font-family:var(--rd);font-weight:400;font-size:clamp(26px,2.6vw,36px);line-height:1.1}
.cat__txt p{max-width:520px;font-size:14px;line-height:1.75;color:var(--testo2)}
.cat ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);column-gap:32px;align-content:start;border-top:1px solid var(--marrone)}
.cat li{border-bottom:1px solid var(--sabbia3)}
.cat li>span{display:block;padding:13px 0;font-size:14px;color:var(--marrone)}
.cat li>a{display:flex;justify-content:space-between;gap:12px;padding:13px 0;font-size:14px;font-weight:500;color:var(--malva-scuro)}
.cat li>a:hover{color:var(--malva)}
@media (max-width:899px){
  .cat{grid-template-columns:160px minmax(0,1fr)}
  .cat ul{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:639px){
  .cat{grid-template-columns:96px minmax(0,1fr);align-items:center}
  .cat ul{grid-template-columns:minmax(0,1fr)}
}

/* ---------- Pagine dei trattamenti (LPG, anticellulite) ---------- */
.what__txt p:not(.eyebrow){max-width:500px;font-size:15px;line-height:1.8;color:var(--testo2)}
.what__ph{justify-self:center;width:min(78%,440px);aspect-ratio:4/5;--veil:.35}
.what__ph img{--br:.92}
.for{background:var(--sabbia);padding:clamp(72px,9vw,120px) var(--gutter)}
.for__in{max-width:1160px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(32px,4vw,48px)}
.for ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:32px;border-top:1px solid var(--malva)}
.for ul.is-6{grid-template-columns:repeat(3,minmax(0,1fr))}
.for li{display:flex;flex-direction:column;gap:8px;padding:22px 0;border-bottom:1px solid var(--sabbia3)}
.for li>span:first-child{display:flex;align-items:baseline;gap:10px}
.for small{font-size:11px;color:var(--malva-scuro)}
.for b{font-family:var(--rd);font-weight:400;font-size:23px;line-height:1.15}
.for li>span+span{font-size:14px;line-height:1.65;color:var(--testo2)}
@media (max-width:899px){.for ul,.for ul.is-6{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:639px){.for ul,.for ul.is-6{grid-template-columns:minmax(0,1fr)}}
.how{max-width:1240px;margin:0 auto;padding:clamp(72px,9vw,120px) var(--gutter);display:flex;flex-direction:column;gap:clamp(32px,4vw,48px)}
.how i{color:var(--malva)}
.how ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:clamp(24px,4vw,56px)}
.how li{display:flex;flex-direction:column;gap:10px;padding-top:18px;border-top:1px solid var(--marrone)}
.how li>span:first-child{font-family:var(--rd);font-style:italic;font-size:40px;line-height:1;color:var(--malva)}
.how b{font-family:var(--rd);font-weight:400;font-size:24px;line-height:1.15}
.how li>span:last-child{font-size:14px;line-height:1.7;color:var(--testo2)}
.rel{max-width:1240px;margin:0 auto;padding:clamp(64px,8vw,104px) var(--gutter);display:flex;flex-direction:column;gap:24px}
.rel__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));column-gap:32px;border-top:1px solid var(--marrone)}
.rel__grid a{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:20px 0;border-bottom:1px solid var(--sabbia2);font-family:var(--rd);font-size:24px;line-height:1.15}
.rel__grid a span+span{font-family:var(--rb);font-size:14px;color:var(--malva)}

/* ---------- Privacy ---------- */
.legal-body{background:var(--crema)}
.legal{max-width:760px;margin:0 auto;padding:clamp(56px,8vw,104px) clamp(20px,5vw,40px) clamp(64px,8vw,112px);font-size:15px;line-height:1.8;color:#4e3a34}
.legal a{color:var(--malva-scuro);text-decoration:underline;text-underline-offset:3px}
.legal a:hover{color:var(--malva)}
.legal mark{background:var(--cipria);color:var(--malva-scuro);padding:0 4px}
.legal__tabs{display:flex;gap:24px;margin-bottom:40px;font-size:11px;letter-spacing:.16em}
.legal__tabs a{text-decoration:none;color:var(--malva-scuro)}
.legal section{scroll-margin-top:88px;display:flex;flex-direction:column;gap:14px}
.legal .big{margin:0 0 8px;font-family:var(--rd);font-weight:400;font-size:clamp(40px,5vw,60px);line-height:1;color:var(--marrone)}
.legal .sub{margin:28px 0 0;font-family:var(--rd);font-weight:500;font-size:26px;line-height:1.2;color:var(--marrone)}
.legal strong{font-weight:500;color:var(--marrone)}
.legal ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.legal__date{font-size:13px;color:var(--nota)}
.legal__sep{height:1px;background:var(--sabbia2);margin:clamp(56px,7vw,88px) 0}
.legal__note{margin-top:clamp(48px,6vw,72px);padding:20px 24px;background:var(--cipria);font-size:13px;line-height:1.7;color:var(--malva-scuro)}
.ft--solid{background:var(--marrone);-webkit-backdrop-filter:none;backdrop-filter:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Correzioni del 22/10/2026 (Francesca): scritte piccole in malva scuro (sopra) e testo a 16 px sul telefono. */
@media (max-width:639px){
  .lead,.tr__card p,.points span,.brands p,.faq__short dt,.faq__short dd,.acc summary,.acc p,
  .cta__lead,.card__txt,.hero__lead,.what__txt p:not(.eyebrow),.for li>span+span,.how li>span:last-child,
  .cat__txt p,.cat li>span,.cat li>a,.feat__card p,.legal,.book__note,.hero__info,.menu__foot{font-size:16px}
}

/* ---------- Movimento (studio del 22/10/2026) ----------
   Tempi e curve: Taste-design (references/motion.md) ed Emil Kowalski.
   Le parti animate allo scorrimento sono in js/motion.js (GSAP); qui solo l'apertura e il tocco.
   Bottoni per chiamare/prenotare, barra in basso e fondo pagina non si animano. */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.33,1,.68,1);--t-press:140ms;--t-hover:180ms}

/* Risposta al tocco: il bottone «cede» appena, come sotto un dito. */
.btn,.hd__book,.bar a,.bar button,.arrow,.rev__nav .sq,.burger,.x{transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease,border-color var(--t-hover) ease,color var(--t-hover) ease}
.btn:active,.hd__book:active,.bar a:active,.bar button:active,.rev__nav .sq:active{transform:scale(.97)}
.arrow:active,.burger:active,.x:active{transform:scale(.92)}
.book__list a,.rel__grid a,.cat li>a,.menu__nav a{transition:color var(--t-hover) ease}
.book__list a span[aria-hidden],.rel__grid a span+span,.cat li>a span[aria-hidden]{transition:transform var(--t-hover) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .book__list a:hover span[aria-hidden],.rel__grid a:hover span+span,.cat li>a:hover span[aria-hidden]{transform:translateX(4px)}
  .menu__nav a:hover{color:var(--malva-scuro)}
}
@media (hover:none){.tr__card:hover img,.feat__card:hover img{scale:none}}

/* Apertura della pagina: le scritte salgono in ordine di lettura; il bottone Prenota è già lì. */
@media (prefers-reduced-motion:no-preference){
  .js [data-rise]{opacity:0;transform:translateY(18px);animation:rise .9s var(--ease-out) forwards;animation-delay:calc(var(--i,0) * 110ms + 150ms)}
  .js .hero>.ph img{animation:settle 2.2s var(--ease-soft) both}
  /* Momento firma «Le mani che scivolano»: il titolo lo svela motion.js riga per riga;
     se lo script non parte, compare comunque dopo un attimo. */
  .js .hero__title[data-rise],.js .hero .h1[data-rise]{transform:none;animation:show 0s 2.5s forwards}
}
@media (prefers-reduced-motion:no-preference) and (max-width:639px){
  .js [data-rise]{animation-duration:.7s}
}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes show{to{opacity:1}}
@keyframes settle{from{transform:scale(1.06)}to{transform:none}}

/* Ambiente come finestra: la foto resta ferma sullo schermo e l'arco ci scorre sopra (lo attiva motion.js). */
.is-window{clip-path:inset(0 round 999px 999px 0 0)}
.is-window img{position:fixed;top:0;height:100vh;height:100lvh;object-position:50% 50%}

/* Pausa del video «Chi sono»: piccolo, in un angolo; c'è solo se lo script funziona. */
.vid-btn{position:absolute;right:12px;bottom:12px;z-index:2;width:44px;height:44px;border:0;padding:0;background:rgba(61,43,38,.55);color:#fff;display:none;align-items:center;justify-content:center;cursor:pointer;transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease}
.js .vid-btn{display:flex}
.vid-btn:active{transform:scale(.92)}
@media (hover:hover) and (pointer:fine){.vid-btn:hover{background:rgba(61,43,38,.8)}}
.vid-btn i{display:flex;gap:4px}
.vid-btn i::before,.vid-btn i::after{content:"";display:block;width:3px;height:13px;background:currentColor}
.vid-btn[aria-pressed="true"] i{gap:0}
.vid-btn[aria-pressed="true"] i::before{width:0;height:0;background:none;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent currentColor;margin-left:3px}
.vid-btn[aria-pressed="true"] i::after{display:none}

/* ---------- Pagine interne (22/10/2026) ---------- */
/* Indice delle aree in cima a Trattamenti: stesso disegno di «Potrebbe interessarti». */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
.idx{max-width:1240px;margin:0 auto;padding:clamp(40px,5vw,64px) var(--gutter) 0;display:flex;flex-direction:column;gap:16px}
.idx__grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.idx__grid a{font-size:22px;padding:16px 0}
@media (max-width:639px){.idx__grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}.idx__grid a{font-size:19px;padding:14px 0}}
/* Domande delle pagine LPG: risposte brevi e Prenota nella colonna sinistra. */
.faq__book{align-self:flex-start;margin-top:12px}
/* «Come funziona»: testo e passi in un blocco. */
.how__main{display:flex;flex-direction:column;gap:clamp(32px,4vw,48px)}

/* «Tre passi in scuro» (versione 3, scelta da Francesca il 22/10/2026): fascia marrone, numeri grandi in rosa. */
.how-bg{background:var(--marrone);color:#fff}
.how .eyebrow{color:var(--cipria)}
.how i{color:var(--cipria)}
.how li{border-top-color:rgba(251,246,239,.28)}
.how li>span:first-child{font-size:clamp(56px,6vw,80px);color:var(--cipria)}
.how li>span:last-child{color:var(--sabbia)}

/* Foto Epilazione (Unsplash, più chiara delle altre): un po' più calda e scura per intonarsi. */
.ph img[src*="epilazione-gambe"]{--br:.8;--sep:.18}

/* Carosello trattamenti sul telefono: frecce e pallini dentro il blocco degli archi. */
.tr__wrap .dots-nav{justify-content:center;margin-top:clamp(36px,6svh,64px)}
/* Sul telefono si vede un pezzo dell'arco dopo: si capisce che si scorre (scelta A, 22/10/2026). */
@media (max-width:639px){
  .tr__track{gap:14px;padding:0 15%;scroll-padding:0 15%}
  .tr__card{flex-basis:70%;scroll-snap-align:center}
  .tr__card .ph{width:100%}
}