/* ==========================================================================
   FV Equine Solutions — design system
   Bodoni Moda (titoli) · Jost (testo/UI) · Mrs Saint Delafield (decorativo)
   Mobile-first · nessuna dipendenza · CSP senza stili inline
   ========================================================================== */

/* ---------- 1. Token ---------- */
:root{
  --ink:#141414;--ivory:#F7F3EC;--paper:#FFFFFF;--sand:#E7DDCC;--sand-deep:#CDBDA2;
  --green:#1F4D37;--green-ink:#163826;--green-deep:#0F2A1C;--brass:#A7824B;--muted:#5A554D;
  --error:#9B2C2C;--mark:#FBEFC4;
  --line:rgba(20,20,20,.12);--line-strong:rgba(20,20,20,.26);--line-light:rgba(247,243,236,.18);
  --serif:"Bodoni Moda","Bodoni 72","Didot",Georgia,serif;
  --sans:"Jost","Futura","Avenir Next","Segoe UI",system-ui,sans-serif;
  --script:"Mrs Saint Delafield","Snell Roundhand",cursive;
  --container:1200px;--gutter:clamp(1.25rem,4vw,2.5rem);
  --space:clamp(4.5rem,10vw,8.5rem);
  --header-h:92px;
  --panel:radial-gradient(ellipse 75% 65% at 50% 40%,#FCFAF6 0%,#F1EADF 55%,var(--sand) 100%);
  --shadow-card:0 1px 0 rgba(20,20,20,.03),0 30px 50px -34px rgba(22,56,38,.34);
  --shadow-pack:drop-shadow(0 24px 18px rgba(22,56,38,.16));
  --ease:cubic-bezier(.22,.7,.2,1);
}

/* ---------- 2. Reset e base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 1rem)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--ivory);color:var(--ink);font:400 1.0625rem/1.7 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
main{flex:1 0 auto;display:block}
h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul,ol{margin:0}
ul[class],ol[class]{list-style:none;padding:0}
img,picture,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{text-decoration-color:var(--brass)}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{cursor:pointer}
strong,b{font-weight:500}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
::selection{background:var(--green);color:var(--ivory)}
hr{height:1px;border:0;background:var(--line);margin:0}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
main:focus{outline:none}
.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-link{position:absolute;left:1rem;top:-200px;z-index:300;padding:.8rem 1.3rem;background:var(--green-ink);color:var(--ivory);font-weight:500;text-decoration:none;border-radius:2px}
.skip-link:focus{top:1rem}
.icon{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}

/* ---------- 3. Tipografia ---------- */
h1,h2,h3,h4,.display{font-family:var(--serif);font-weight:500;line-height:1.1;letter-spacing:-.012em;text-wrap:balance}
.display{font-size:clamp(2.6rem,6vw,5.2rem);line-height:1.02;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,5vw,4.3rem);line-height:1.05}
h2{font-size:clamp(2rem,4vw,3.3rem)}
h3{font-size:clamp(1.35rem,2vw,1.7rem);line-height:1.2}
h4{font-size:1.2rem;line-height:1.25}
.display em,h1 em,h2 em,h3 em{font-style:italic;font-weight:400;color:var(--green)}
.lead{font-size:clamp(1.12rem,1.5vw,1.3rem);line-height:1.65;font-weight:300;max-width:60ch}
.muted{color:var(--muted)}
.small{font-size:.9rem}
.eyebrow{display:inline-flex;align-items:center;gap:.85rem;font:500 .78rem/1.35 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--green)}
.eyebrow::before{content:"";width:2.2rem;height:1px;background:var(--brass);flex:none}
.eyebrow--plain::before{display:none}
.script{font-family:var(--script);font-weight:400;font-size:clamp(2.6rem,5vw,4.4rem);line-height:1;letter-spacing:0;color:var(--green)}
.stack{display:grid;gap:1.25rem;align-content:start}
.stack--sm{gap:.7rem}
.stack--lg{gap:2rem}

/* ---------- 4. Layout ---------- */
.container{width:100%;max-width:calc(var(--container) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.container--narrow{max-width:calc(860px + 2 * var(--gutter))}
.section{padding-block:var(--space)}
.section--tight{padding-block:clamp(3rem,6vw,5rem)}
.section--flush-top{padding-top:0}
.section--sand{background:var(--sand)}
.section--paper{background:var(--paper)}
.section-head{display:grid;gap:1.1rem;max-width:760px;margin-bottom:clamp(2.5rem,5vw,4rem)}
.section-head p{color:var(--muted);max-width:60ch}
.section-head--split{max-width:none}
@media (min-width:900px){
  .section-head--split{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end;column-gap:4rem}
  .section-head--split>.section-head__aside{display:grid;gap:1rem;justify-items:start}
}
.grid{display:grid;gap:clamp(1.25rem,2.5vw,2rem)}
@media (min-width:700px){.grid--2,.grid--3,.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.split{display:grid;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
@media (min-width:900px){
  .split{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split--text-wide{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .split--media-wide{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
  .split--reverse>:first-child{order:2}
  .split--top{align-items:start}
}
.btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.1rem}

/* ---------- 5. Header e navigazione ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(247,243,236,.9);-webkit-backdrop-filter:saturate(1.3) blur(14px);backdrop-filter:saturate(1.3) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background-color .3s,box-shadow .3s}
.site-header.is-scrolled{background:rgba(247,243,236,.96);border-bottom-color:var(--line);box-shadow:0 10px 30px -24px rgba(20,20,20,.35)}
.site-header__inner{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.4rem);min-height:var(--header-h);transition:min-height .35s var(--ease)}
.site-header.is-scrolled .site-header__inner{min-height:70px}
.brand{display:inline-flex;flex:none;text-decoration:none;border-radius:2px}
.brand img{height:64px;width:auto;transition:height .35s var(--ease)}
.site-header.is-scrolled .brand img{height:50px}
.site-nav{margin-left:auto}
.site-nav__list{display:flex;align-items:center;gap:clamp(.9rem,1.8vw,2rem)}
.site-nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;font-size:.96rem;letter-spacing:.015em;white-space:nowrap;text-decoration:none;color:var(--ink);transition:color .2s}
.site-nav a::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.site-nav a:hover{color:var(--green)}
.site-nav a:hover::after,.site-nav a[aria-current]::after{transform:scaleX(1)}
.site-nav a[aria-current]{color:var(--green);font-weight:500}
.site-header__cta{flex:none}
.nav-toggle{display:none;align-items:center;gap:.75rem;min-height:48px;padding:.5rem .2rem .5rem .8rem;margin-left:.25rem;background:none;border:0;font:500 .74rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink)}
.nav-toggle__bars{position:relative;width:28px;height:11px;border-block:1.25px solid currentColor}
@media (max-width:1100px){
  :root{--header-h:80px}
  .site-header__inner{flex-wrap:wrap;row-gap:0}
  .site-nav{order:3;flex-basis:100%;margin-left:0;padding-bottom:.4rem}
  .site-nav__list{flex-wrap:wrap;justify-content:center;column-gap:1.3rem}
  .site-header__cta{margin-left:auto}
  .js .site-header__inner{flex-wrap:nowrap}
  .js .site-nav{display:none}
  .js .nav-toggle{display:inline-flex}
  .brand img{height:56px}
}
@media (max-width:719px){
  :root{--header-h:72px}
  .brand img{height:50px}
  .site-header.is-scrolled .brand img{height:44px}
  .js .site-header__cta{display:none}
  .js .nav-toggle{margin-left:auto}
  .site-header__cta{padding-inline:1rem}
}

/* Drawer mobile */
.drawer{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;background:var(--ivory);padding:0 var(--gutter) calc(1.75rem + env(safe-area-inset-bottom));opacity:0;transform:translateY(-10px);transition:opacity .3s var(--ease),transform .45s var(--ease)}
.drawer.is-open{opacity:1;transform:none}
.drawer::before{content:"";flex:none;display:block;height:6px;margin-inline:calc(-1 * var(--gutter));background:repeating-linear-gradient(90deg,var(--green) 0 56px,var(--paper) 56px 112px)}
.drawer__top{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:74px}
.drawer__top .brand img{height:48px}
.drawer__close{display:grid;place-items:center;width:50px;height:50px;border:1px solid var(--line-strong);border-radius:50%;background:transparent;color:var(--ink);transition:background-color .2s,color .2s}
.drawer__close:hover{background:var(--ink);color:var(--ivory)}
.drawer__close .icon{width:22px;height:22px}
.drawer__nav{margin-block:clamp(1.5rem,5vh,3rem) auto}
.drawer__list{counter-reset:voce;border-top:1px solid var(--line)}
.drawer__list li{counter-increment:voce;border-bottom:1px solid var(--line)}
.drawer__list a{display:flex;align-items:baseline;gap:1.1rem;padding:.85rem 0;font:400 clamp(1.7rem,7vw,2.5rem)/1.15 var(--serif);text-decoration:none;color:var(--ink)}
.drawer__list a::before{content:counter(voce,decimal-leading-zero);min-width:1.9rem;font:italic 400 .95rem/1 var(--serif);color:var(--green)}
.drawer__list a[aria-current]{font-style:italic;color:var(--green)}
.drawer__foot{display:grid;gap:1.1rem;padding-top:2rem}
.drawer__foot .btn{width:100%}
.drawer__social{display:flex;flex-wrap:wrap;gap:.3rem 1.5rem;font-size:.95rem}
.drawer__social a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;text-decoration:none}
.is-locked,.is-locked body{overflow:hidden}

/* ---------- 6. Pulsanti e link ---------- */
.btn{--bg:var(--green);--fg:var(--ivory);--bd:var(--green);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:52px;padding:.8rem 1.65rem;border:1px solid var(--bd);border-radius:999px;background:var(--bg);color:var(--fg);font:500 .8rem/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,box-shadow .3s,transform .25s var(--ease)}
.btn:hover{--bg:var(--green-ink);--bd:var(--green-ink);box-shadow:0 14px 28px -18px rgba(22,56,38,.7)}
.btn:active{transform:translateY(1px)}
.btn .icon{width:1.3rem;height:1.3rem}
.btn--ghost{--bg:transparent;--fg:var(--ink);--bd:var(--line-strong)}
.btn--ghost:hover{--bg:var(--ink);--fg:var(--ivory);--bd:var(--ink)}
.btn--light{--bg:var(--ivory);--fg:var(--green-ink);--bd:var(--ivory)}
.btn--light:hover{--bg:var(--paper);--fg:var(--green-ink);--bd:var(--paper)}
.btn--outline-light{--bg:transparent;--fg:var(--ivory);--bd:rgba(247,243,236,.5)}
.btn--outline-light:hover{--bg:var(--ivory);--fg:var(--green-ink);--bd:var(--ivory)}
.btn--wa .icon{width:1.4rem;height:1.4rem}
.btn--sm{min-height:44px;padding:.5rem 1.1rem;font-size:.72rem;letter-spacing:.13em;gap:.5rem}
.btn--sm .icon{width:1.15rem;height:1.15rem}
.btn--lg{min-height:58px;padding:1rem 2.1rem;font-size:.84rem}
.btn--block{width:100%}
.btn--plain{--bg:transparent;--bd:transparent;--fg:inherit;display:inline-flex;align-items:center;gap:.6rem;min-height:44px;padding:0;border:0;border-radius:0;font:inherit;letter-spacing:inherit;text-transform:none;justify-content:flex-start}
.btn--plain:hover{--bg:transparent;--bd:transparent;box-shadow:none;text-decoration:underline}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
.link-arrow{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;font:500 .78rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--green);text-decoration:none}
.link-arrow>span{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:2px;transition:background-size .35s var(--ease)}
.link-arrow:hover>span{background-size:100% 1px}
.link-arrow .icon{width:1.15rem;height:1.15rem;transition:transform .3s var(--ease)}
.link-arrow:hover .icon{transform:translateX(4px)}
.cta-band .link-arrow{color:var(--sand)}
.text-link{color:var(--green);font-weight:500}

/* ---------- 7. Elementi decorativi ---------- */
.poles{position:relative;width:100%;height:28px}
.poles::before,.poles::after{content:"";position:absolute;inset-inline:0;height:8px;border-radius:999px;background:repeating-linear-gradient(90deg,var(--green) 0 92px,var(--paper) 92px 184px);box-shadow:0 0 0 1px rgba(20,20,20,.07),0 7px 10px -7px rgba(20,20,20,.35)}
.poles::before{top:0}
.poles::after{bottom:0;background-position:92px 0}
.arch{position:relative;overflow:hidden;border-radius:999px 999px 0 0;background:var(--sand);aspect-ratio:3/4;max-width:100%}
.arch img,.arch picture{width:100%;height:100%}
.arch img{object-fit:cover}
.framed{position:relative;isolation:isolate}
.framed::before{content:"";position:absolute;z-index:-1;inset:1.1rem -1.1rem -1.1rem 1.1rem;border:1px solid var(--brass);pointer-events:none}
.framed--arch::before{border-radius:999px 999px 0 0}
.framed--left::before{inset:1.1rem 1.1rem -1.1rem -1.1rem}
.photo{position:relative;overflow:hidden;background:var(--sand)}
.photo img,.photo picture{width:100%;height:100%}
.photo img{object-fit:cover}
.photo--landscape{aspect-ratio:11/9}
.caption{margin-top:.9rem;font-size:.84rem;color:var(--muted)}

/* ---------- 8. Hero home ---------- */
.hero{position:relative;padding-block:clamp(2rem,5vw,4.5rem) clamp(4rem,8vw,7rem)}
.hero__grid{display:grid;gap:clamp(3rem,6vw,5rem);align-items:center}
@media (min-width:920px){.hero__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.hero__text{display:grid;gap:1.6rem;justify-items:start}
.hero__title{max-width:14ch}
.hero__contact{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .7rem;padding-top:1.3rem;border-top:1px solid var(--line);font-size:.95rem;color:var(--muted);width:100%;max-width:34rem}
.hero__contact .icon{color:var(--green)}
.hero__contact a{color:var(--ink);font-weight:500;text-decoration:none;white-space:nowrap}
.hero__contact a:hover{text-decoration:underline}
.hero__media{position:relative;width:100%;max-width:470px;justify-self:center;margin-inline:auto;padding-bottom:2.6rem}
@media (min-width:920px){.hero__media{justify-self:end;margin-right:1.2rem}}
.hero__script{position:absolute;z-index:2;left:-3.2rem;bottom:-.4rem;transform:rotate(-7deg);font-size:clamp(3rem,5.4vw,4.6rem);color:var(--green);text-shadow:0 0 14px var(--ivory),0 0 4px var(--ivory);white-space:nowrap;pointer-events:none}
.hero__badge{position:absolute;z-index:3;right:-2rem;top:4.5rem;display:flex;align-items:center;gap:.9rem;max-width:min(300px,86%);padding:.8rem 1.1rem .8rem .8rem;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow-card);text-decoration:none;transition:transform .35s var(--ease),border-color .3s}
.hero__badge:hover{transform:translateY(-3px);border-color:var(--sand-deep)}
.hero__badge-packs{display:flex;flex:none;padding:.3rem .2rem 0;background:var(--panel)}
.hero__badge-packs img{width:36px;height:45px;object-fit:contain}
.hero__badge-packs picture+picture{margin-left:-12px}
.hero__media .arch img{object-position:50% 68%}
.hero__badge-text{display:grid;gap:.15rem;font-size:.88rem;line-height:1.35}
.hero__badge-text strong{font:500 .68rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--green)}
@media (max-width:919px){.hero__script{left:-.4rem}.hero__badge{right:-.4rem;top:2.5rem}}
@media (max-width:599px){.hero .btn-row .btn{flex:1 1 100%}}

/* ---------- 9. Trust strip, marchi, modalità ---------- */
.trust{border-block:1px solid var(--line);background:var(--paper)}
.trust__grid{display:grid;gap:1.75rem;padding-block:clamp(1.75rem,3.5vw,2.5rem)}
@media (min-width:1000px){.trust__grid{grid-template-columns:auto 1fr;align-items:center;gap:3.5rem}}
.brand-strip{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 2.2rem}
.brand-strip__label{font:500 .74rem/1.3 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.brand-strip__items{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 2rem}
.brand-name{font:500 1.05rem/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.brand-name--serif{font:italic 500 1.55rem/1 var(--serif);letter-spacing:.01em;text-transform:none}
.brand-strip__items .brand-name+.brand-name{position:relative}
.ways{display:grid;gap:1rem 2rem}
@media (min-width:640px){.ways{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){.ways{padding-left:3.5rem;border-left:1px solid var(--line)}}
.way{display:flex;align-items:center;gap:.9rem;font-size:.98rem;line-height:1.35}
.way .icon{width:34px;height:34px;color:var(--green)}

/* ---------- 10. Citazione ---------- */
.quote{display:grid;gap:1.6rem;justify-items:center;max-width:940px;margin-inline:auto;text-align:center}
.quote__text{font:italic 400 clamp(1.9rem,4.4vw,3.5rem)/1.16 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.quote__text::before{content:"";display:block;width:1px;height:3.2rem;margin:0 auto 1.6rem;background:var(--brass)}
.quote__by{display:grid;gap:.1rem;justify-items:center;font:500 .76rem/1.4 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.quote__by .script{font-size:clamp(2.6rem,4vw,3.4rem);letter-spacing:0;text-transform:none;color:var(--green);margin-bottom:-.4rem}
.poles-divider{display:grid;gap:clamp(3rem,6vw,4.5rem)}

/* ---------- 11. Card generiche ---------- */
.card{position:relative;display:grid;gap:.9rem;align-content:start;padding:clamp(1.5rem,3vw,2.25rem);background:var(--paper);border:1px solid var(--line);transition:border-color .3s,box-shadow .4s var(--ease),transform .4s var(--ease)}
.card--sand{background:var(--sand);border-color:transparent}
.card--ivory{background:var(--ivory)}
.card--link:hover{border-color:var(--sand-deep);box-shadow:var(--shadow-card);transform:translateY(-3px)}
.card--link a.card__link::after{content:"";position:absolute;inset:0}
.card__num{font:italic 400 1.15rem/1 var(--serif);color:var(--green)}
.card__icon{width:42px;height:42px;color:var(--green)}
.card__title{font-size:clamp(1.4rem,2vw,1.75rem)}
.card__title a{text-decoration:none}
.card p{color:var(--muted)}
.card .link-arrow{margin-top:.3rem}

/* ---------- 12. Famiglie di prodotti ---------- */
.family-grid{display:grid;gap:clamp(1.25rem,2.5vw,2rem)}
@media (min-width:820px){.family-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.family-tile{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);transition:border-color .3s,box-shadow .4s var(--ease),transform .4s var(--ease)}
.family-tile:hover{border-color:var(--sand-deep);box-shadow:var(--shadow-card);transform:translateY(-4px)}
.family-tile{min-width:0}
/* contain:inline-size — stesso bug Safari iOS delle card prodotto: le foto a height:92% nel box con aspect-ratio
   non devono entrare nel calcolo della larghezza, altrimenti la card sborda oltre lo schermo del telefono. */
.family-tile__media{display:flex;align-items:flex-end;justify-content:center;min-width:0;contain:inline-size;aspect-ratio:5/4;margin:.75rem .75rem 0;padding:1.5rem 1rem 0;background:var(--panel);overflow:hidden}
.family-tile__media picture{display:flex;justify-content:center;height:92%;width:40%;flex:none}
.family-tile__media picture+picture{margin-left:-9%}
.family-tile__media--single picture{width:72%}
.family-tile__media img{width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:var(--shadow-pack);transition:transform .6s var(--ease)}
.family-tile:hover .family-tile__media img{transform:translateY(-6px)}
.family-tile__body{display:grid;gap:.6rem;padding:1.4rem 1.5rem 1.6rem;flex:1;align-content:start}
.family-tile__num{font:italic 400 1.2rem/1 var(--serif);color:var(--green)}
.family-tile__title{font-size:clamp(1.55rem,2.3vw,2rem)}
.family-tile__title a{text-decoration:none}
.family-tile__title a::after{content:"";position:absolute;inset:0}
.family-tile p{color:var(--muted);font-size:.98rem}
.family-tile .link-arrow{margin-top:auto}

/* ---------- 13. Chip e filtri ---------- */
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;min-height:30px;padding:.3rem .8rem;border:1px solid var(--line-strong);border-radius:999px;background:var(--paper);font:500 .7rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);white-space:nowrap}
.chip--green{background:var(--green);border-color:var(--green);color:var(--ivory)}
.chip--sand{background:var(--sand);border-color:transparent}
.chip--ivory{background:var(--ivory);border-color:transparent}
.chip--lg{min-height:38px;padding:.45rem 1rem;font-size:.78rem;letter-spacing:.08em;text-transform:none}
.filters{display:none;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:clamp(2rem,4vw,3rem);padding-bottom:1.4rem;border-bottom:1px solid var(--line)}
.js .filters{display:flex}
.filters__label{margin-right:.5rem;font:500 .74rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.filters__btn{min-height:44px;padding:.5rem 1.15rem;border:1px solid var(--line-strong);border-radius:999px;background:transparent;font:500 .76rem/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--ink);transition:background-color .2s,color .2s,border-color .2s}
.filters__btn:hover{border-color:var(--ink)}
.filters__btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--ivory)}
.filters__count{margin-left:auto;font-size:.92rem;color:var(--muted)}
@media (max-width:639px){.filters__count{margin-left:0;flex-basis:100%}}

/* ---------- 14. Card prodotto ---------- */
.product-grid{display:grid;gap:clamp(1.25rem,2.4vw,2rem)}
@media (min-width:600px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1020px){.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.product-card{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--paper);border:1px solid var(--line);transition:border-color .3s,box-shadow .45s var(--ease),transform .45s var(--ease)}
.product-card:hover{border-color:var(--sand-deep);box-shadow:var(--shadow-card);transform:translateY(-4px)}
/* La foto sta in posizione assoluta: su Safari iOS un'immagine a height:100% dentro un box grid con aspect-ratio
   allargava la card fino a ~900px (le dimensioni 800x1000 dell'<img> entravano nel calcolo della larghezza minima). */
.product-card__media{position:relative;display:block;aspect-ratio:1/1;margin:.75rem .75rem 0;background:var(--panel);overflow:hidden}
.product-card__media picture{position:absolute;inset:clamp(1.25rem,3vw,2rem) 1rem;display:block}
.product-card__media img{display:block;width:100%;height:100%;object-fit:contain;filter:var(--shadow-pack);transition:transform .7s var(--ease)}
.product-card:hover .product-card__media img{transform:scale(1.04) translateY(-4px)}
.product-card__family{position:absolute;top:.85rem;left:.85rem;z-index:1}
.product-card__body{display:flex;flex-direction:column;gap:.7rem;flex:1;padding:1.3rem 1.5rem 1.5rem}
.product-card__brand{font:500 .72rem/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.product-card__name{font-size:clamp(1.55rem,2.2vw,1.9rem);line-height:1.08;letter-spacing:0}
.product-card__name a{text-decoration:none}
.product-card__name a::after{content:"";position:absolute;inset:0;z-index:1}
.product-card__line{color:var(--muted);font-size:.98rem;line-height:1.6}
.product-card__points{font-size:.92rem;line-height:1.5}
.product-card__foot{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;margin-top:auto;padding-top:1.1rem;border-top:1px solid var(--line)}
.product-card__foot .btn{flex:1 1 100%}
.product-card__formats{width:100%;font-size:.84rem;letter-spacing:.04em;color:var(--muted)}
.product-card__formats b{font-weight:500;color:var(--ink)}
.product-card--compact .product-card__points{display:none}
.product-family{scroll-margin-top:calc(var(--header-h) + 1.5rem)}
.product-family+.product-family{margin-top:clamp(3.5rem,7vw,6rem)}
.product-family__head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem 1.4rem;align-items:end;margin-bottom:clamp(1.75rem,3.5vw,2.5rem);padding-bottom:1.4rem;border-bottom:1px solid var(--line)}
.product-family__num{grid-row:span 2;font:italic 400 clamp(2.8rem,5vw,4.2rem)/.85 var(--serif);color:var(--green)}
.product-family__title{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.product-family__desc{color:var(--muted);max-width:62ch}

/* ---------- 15. Scheda prodotto (PDP) ---------- */
.crumbs{padding-block:1.25rem 0}
.crumbs ol{display:flex;padding:0;flex-wrap:wrap;align-items:center;gap:.2rem .55rem;font-size:.84rem;letter-spacing:.03em;color:var(--muted)}
.crumbs li{display:inline-flex;align-items:center;gap:.55rem}
.crumbs li+li::before{content:"";width:5px;height:5px;border-top:1px solid var(--brass);border-right:1px solid var(--brass);transform:rotate(45deg)}
.crumbs a{display:inline-flex;align-items:center;min-height:32px;text-decoration:none}
.crumbs a:hover{color:var(--green);text-decoration:underline}
.crumbs [aria-current]{color:var(--ink)}
.pdp{display:grid;gap:clamp(2rem,5vw,4.5rem);padding-block:clamp(1.5rem,3.5vw,2.75rem) clamp(3.5rem,7vw,6rem)}
@media (min-width:920px){.pdp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}
@media (min-width:920px){.pdp__gallery{position:sticky;top:calc(var(--header-h) + 1.5rem)}}
.pdp__panel{position:relative;display:block;aspect-ratio:4/5;background:var(--panel);box-shadow:inset 0 0 0 1px rgba(20,20,20,.05)}
.pdp__panel picture{position:absolute;inset:clamp(1.5rem,5vw,3.5rem);display:block}
.pdp__panel img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 34px 26px rgba(22,56,38,.2))}
.pdp__panel .chip{position:absolute;top:1rem;left:1rem}
.pdp__caption{margin-top:.9rem;font-size:.82rem;line-height:1.5;color:var(--muted)}
.pdp__info{display:grid;gap:1.5rem;align-content:start}
.pdp__brand{font:500 .78rem/1.3 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--green)}
.pdp__name{font-size:clamp(2.6rem,5.2vw,4.4rem);line-height:1;letter-spacing:-.015em}
.pdp__type{margin-top:-.6rem;font:italic 400 clamp(1.1rem,1.6vw,1.3rem)/1.4 var(--serif);color:var(--muted)}
.pdp__formats{display:grid;gap:.6rem}
.pdp__label{font:500 .72rem/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.buy-box{position:relative;display:grid;gap:1rem;padding:clamp(1.4rem,3vw,2rem);padding-top:calc(clamp(1.4rem,3vw,2rem) + 6px);background:var(--paper);border:1px solid var(--line);overflow:hidden}
.buy-box::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:repeating-linear-gradient(90deg,var(--green) 0 56px,var(--sand) 56px 112px)}
.buy-box__title{font-size:1.45rem}
.buy-box__actions{display:grid;gap:.7rem}
@media (min-width:520px){.buy-box__actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
.buy-box__actions .btn{width:100%;padding-inline:1rem}
.buy-box__note{font-size:.86rem;line-height:1.55;color:var(--muted)}
.buy-box__phone{display:flex;align-items:center;gap:.5rem;font-size:.92rem}
.buy-box__phone a{font-weight:500;text-decoration:none}
.accordion{border-top:1px solid var(--line)}
.accordion details{border-bottom:1px solid var(--line)}
.accordion summary{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:66px;padding:1rem 0;list-style:none;cursor:pointer;font:500 clamp(1.15rem,1.8vw,1.4rem)/1.3 var(--serif);transition:color .2s}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"";flex:none;width:15px;height:15px;background:linear-gradient(currentColor,currentColor) center/100% 1.25px no-repeat,linear-gradient(currentColor,currentColor) center/1.25px 100% no-repeat;transition:transform .35s var(--ease)}
.accordion details[open]>summary::after{transform:rotate(45deg)}
.accordion summary:hover{color:var(--green)}
.accordion__body{display:grid;gap:.9rem;padding:0 0 1.6rem;max-width:68ch}
.accordion__body p,.accordion__body li{color:var(--ink)}
.accordion__body ul{display:grid;gap:.45rem}
.accordion__body ul:not([class]){padding-left:1.1rem}
.accordion__body a:not(.btn){color:var(--green)}
.kv{display:grid;border-top:1px solid var(--line);font-size:.95rem}
.kv>div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--line)}
.kv dt{color:var(--muted)}
.kv dd{font-weight:500;text-align:right;white-space:nowrap}
.spec-label{font:500 .72rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--green)}
.faq{max-width:900px}
.related{padding-block:clamp(3.5rem,7vw,6rem);border-top:1px solid var(--line)}

/* ---------- 16. Steps, checklist, credenziali ---------- */
.steps{display:grid;gap:clamp(2rem,3vw,2.5rem)}
@media (min-width:800px){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.step{display:grid;gap:.75rem;align-content:start;padding-top:1.5rem;border-top:1px solid var(--line-strong)}
.step__num{font:italic 400 clamp(3rem,5vw,4.3rem)/.9 var(--serif);color:var(--green)}
.step__title{font-size:clamp(1.35rem,2vw,1.6rem)}
.step p{color:var(--muted)}
.checklist{display:grid;gap:.55rem}
.checklist li{position:relative;padding-left:1.8rem}
.checklist li::before{content:"";position:absolute;left:.15rem;top:.5em;width:.8rem;height:.42rem;border-left:1.25px solid var(--green);border-bottom:1.25px solid var(--green);transform:rotate(-45deg)}
.credentials{display:grid;border-top:1px solid var(--line)}
.credentials li{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.9rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.credentials__num{font:italic 400 1.35rem/1.3 var(--serif);color:var(--green)}
.credentials__kind{display:block;font:500 .7rem/1.4 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.credentials__name{display:block;font:500 1.12rem/1.35 var(--serif)}
.pro-split{display:grid;gap:clamp(2.5rem,5vw,3.5rem) clamp(2.5rem,6vw,5.5rem);grid-template-areas:"media" "text" "services"}
.pro-split__media{grid-area:media}.pro-split__text{grid-area:text}.pro-split__services{grid-area:services}
@media (min-width:920px){.pro-split{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"media text" "services text";grid-template-rows:auto 1fr;align-items:start}}
.service-links{display:grid;gap:1rem}
@media (min-width:600px){.service-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
.service-link{position:relative;display:grid;gap:.45rem;padding:1.25rem 1.3rem 1.1rem;background:var(--paper);border:1px solid var(--line);transition:border-color .3s,transform .35s var(--ease)}
.service-link:hover{border-color:var(--green);transform:translateY(-2px)}
.service-link__title{font-size:1.3rem}
.service-link__title a{text-decoration:none}
.service-link__title a::after{content:"";position:absolute;inset:0}
.service-link p{font-size:.93rem;color:var(--muted)}
.service-link .link-arrow{min-height:32px}
.tag-secondary{font:500 .68rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* ---------- 17. Instagram ---------- */
.insta__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.6rem,1.4vw,1rem)}
@media (min-width:860px){.insta__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.insta__tile{position:relative;display:block;overflow:hidden;aspect-ratio:4/5;background:var(--sand);text-decoration:none}
.insta__tile picture,.insta__tile img{width:100%;height:100%}
.insta__tile img{object-fit:cover;transition:transform .9s var(--ease)}
.insta__tile:hover img{transform:scale(1.05)}
.insta__tile .icon{position:absolute;right:.8rem;bottom:.8rem;width:30px;height:30px;padding:5px;border-radius:50%;background:rgba(247,243,236,.92);color:var(--green-ink);transition:transform .3s var(--ease)}
.insta__tile:hover .icon{transform:scale(1.1)}
.insta__tile--brand{display:grid;place-items:center;align-content:center;gap:.8rem;padding:1.25rem;background:var(--green-ink);color:var(--ivory);text-align:center}
.insta__tile--brand img{width:74%;height:auto;object-fit:contain}
.insta__tile--brand span{font-size:.9rem;letter-spacing:.04em}
.insta__img--pascolo{object-position:56% 50%}
.home-note{margin-top:clamp(1.75rem,3vw,2.5rem)}
.ordinare-actions{margin-top:clamp(2.5rem,5vw,3.5rem)}
.insta__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;margin-top:clamp(1.75rem,3vw,2.5rem)}
.insta__foot p{color:var(--muted);font-size:.96rem}
.insta__foot a:not(.btn){color:var(--green);font-weight:500}

/* ---------- 18. Recensioni ---------- */
.review-grid{display:grid;gap:clamp(1.25rem,2.5vw,2rem)}
@media (min-width:760px){.review-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.review{position:relative;display:grid;gap:1.3rem;align-content:start;padding:clamp(1.5rem,3vw,2.25rem);background:var(--paper);border:1px solid var(--line)}
.review__text{font:italic 400 clamp(1.15rem,1.7vw,1.35rem)/1.55 var(--serif)}
.review__text::before{content:"\201C";display:block;height:.5em;margin-bottom:.3rem;font-size:2.4em;line-height:1;color:var(--green)}
.review__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.88rem;color:var(--muted)}
.review__author{font-weight:500;color:var(--ink)}
.review__disclosure{width:100%;font-size:.8rem}
.reviews-empty{position:relative;display:grid;justify-items:center;gap:1.2rem;padding:clamp(2.5rem,6vw,4.5rem) clamp(1.25rem,4vw,3rem);background:var(--paper);border:1px solid var(--line);text-align:center}
.reviews-empty__icon{width:54px;height:54px;color:var(--green)}
.reviews-empty h2,.reviews-empty h3{font-size:clamp(1.6rem,3vw,2.3rem)}
.reviews-empty p{max-width:52ch;color:var(--muted)}
.policy{display:grid;gap:.8rem;padding:clamp(1.4rem,3vw,2rem);background:var(--sand);font-size:.95rem;line-height:1.65}
.policy__title{display:flex;align-items:center;gap:.7rem;font-size:1.35rem}
.policy__title .icon{width:28px;height:28px;color:var(--green)}
.policy ul{display:grid;gap:.4rem;padding-left:1.1rem}

/* ---------- 19. Note, avvisi, CTA ---------- */
.note{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.85rem;align-items:start;padding:1rem 1.2rem;border:1px solid var(--line);background:rgba(255,255,255,.6);font-size:.88rem;line-height:1.6;color:var(--muted)}
.note>.icon{width:22px;height:22px;margin-top:.1rem;color:var(--green)}
.note strong{color:var(--ink)}
.note a{color:var(--green)}
.note--strong{border:0;border-left:3px solid var(--green);background:var(--paper);color:var(--ink);font-size:.94rem}
.note--strong>.icon{width:26px;height:26px}
.notes{display:grid;gap:.75rem}
.cta-band{position:relative;overflow:hidden;background:var(--green-ink);color:var(--ivory);padding-block:clamp(4rem,9vw,7rem)}
.cta-band::after{content:"";position:absolute;right:-15rem;bottom:-14rem;width:31rem;height:31rem;border:1px solid rgba(167,130,75,.5);border-radius:999px 999px 0 0;pointer-events:none}
.cta-band__inner{position:relative;z-index:1;display:grid;gap:2rem;align-items:center}
@media (min-width:920px){.cta-band__inner{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:4rem}}
.cta-band h2 em{color:var(--sand)}
.cta-band p{color:rgba(247,243,236,.84);max-width:52ch}
.cta-band .eyebrow{color:var(--sand)}
.cta-band :focus-visible{outline-color:var(--sand)}
.cta-band__actions{display:grid;gap:.8rem;justify-items:stretch}
@media (min-width:520px){.cta-band__actions{justify-items:start}}
.cta-band__phone{font-size:.95rem;color:rgba(247,243,236,.84)}
.cta-band__phone a{color:var(--ivory);font-weight:500;text-decoration:none}

/* ---------- 20. Page hero (pagine interne) ---------- */
.page-hero{position:relative;padding-block:clamp(1.25rem,3vw,2rem) clamp(3rem,7vw,5.5rem);border-bottom:1px solid var(--line)}
.page-hero .crumbs{padding-top:0;margin-bottom:clamp(1.75rem,4vw,3rem)}
.page-hero__inner{display:grid;gap:1.3rem;max-width:880px;justify-items:start}
.page-hero__grid{display:grid;gap:clamp(2.5rem,6vw,5rem);align-items:center}
@media (min-width:920px){.page-hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.page-hero__media{width:100%;max-width:440px;justify-self:center}
.strip{position:relative;overflow:hidden;aspect-ratio:1320/426;max-height:420px;width:100%;background:var(--sand)}
.strip picture,.strip img{width:100%;height:100%}
.strip img{object-fit:cover}
@media (max-width:599px){.strip{aspect-ratio:16/9}}

/* ---------- 21. Form e compositore messaggio ---------- */
.form{display:grid;gap:1.4rem}
.form-grid{display:grid;gap:1.25rem 1.5rem}
@media (min-width:640px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.field--full{grid-column:1/-1}}
.field{display:grid;gap:.45rem;align-content:start;min-width:0}
fieldset.field{margin:0;padding:0;border:0}
.field>label:not(.check),.field legend{padding:0;font:500 .76rem/1.35 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.field__req{color:var(--green)}
.field__hint{font-size:.85rem;color:var(--muted)}
.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{width:100%;min-height:52px;padding:.8rem 1rem;border:1px solid var(--line-strong);border-radius:2px;background:var(--paper);font-size:1rem;line-height:1.4;transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
.field textarea{min-height:140px;resize:vertical}
.field select{padding-right:2.6rem;background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F4D37' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right .9rem center/18px no-repeat}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 3px rgba(31,77,55,.2)}
.field [aria-invalid="true"]{border-color:var(--error)}
.field__error{font-size:.88rem;color:var(--error)}
.field__error:empty{display:none}
.check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.8rem;align-items:start;font-size:.95rem;line-height:1.55;text-transform:none;letter-spacing:0}
.check input{width:22px;height:22px;margin:.15rem 0 0;accent-color:var(--green)}
.check a{color:var(--green)}
.form-status{padding:.9rem 1.1rem;border-left:3px solid var(--green);background:var(--paper);font-size:.95rem}
.form-status:empty{display:none}
.form-status.is-error{border-left-color:var(--error);color:var(--error)}
.composer{display:grid;gap:1rem;padding:clamp(1.25rem,3vw,2rem);background:var(--sand)}
.composer__title{font-size:1.4rem}
.composer textarea{width:100%;min-height:190px;padding:1rem;border:1px solid var(--line-strong);background:var(--ivory);font-size:.95rem;line-height:1.55;resize:vertical}
.composer .btn-row .btn{flex:1 1 200px}
.contact-cards{display:grid;gap:1rem}
@media (min-width:640px){.contact-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.contact-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:center;padding:1.25rem;background:var(--paper);border:1px solid var(--line);text-decoration:none;transition:border-color .3s}
.contact-card:hover{border-color:var(--green)}
.contact-card .icon{width:36px;height:36px;color:var(--green)}
.contact-card strong{display:block;font:500 1.15rem/1.3 var(--serif)}
.contact-card span{font-size:.9rem;color:var(--muted)}

/* ---------- 22. Prose (pagine legali) e tabelle ---------- */
.prose{max-width:72ch;font-size:1.02rem}
.prose>*+*{margin-top:1.05em}
.prose h2{margin-top:2.3em;font-size:clamp(1.55rem,2.8vw,2.1rem)}
.prose h3{margin-top:1.8em;font-size:1.3rem}
.prose h2+*,.prose h3+*{margin-top:.7em}
.prose ul,.prose ol{padding-left:1.25rem}
.prose li+li{margin-top:.4em}
.prose a:not(.btn){color:var(--green);font-weight:500;overflow-wrap:anywhere}
.prose blockquote{padding:.5rem 0 .5rem 1.25rem;border-left:1px solid var(--brass);font-style:italic}
.prose .note{margin-block:1.5em}
.prose-updated{font-size:.88rem;color:var(--muted)}
.toc{display:grid;gap:.3rem;padding:1.25rem 1.4rem;background:var(--paper);border:1px solid var(--line);font-size:.95rem}
.toc a{text-decoration:none}
.toc a:hover{color:var(--green);text-decoration:underline}
.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);background:var(--paper)}
.table-wrap:focus-visible{outline-offset:2px}
.table{width:100%;min-width:520px;border-collapse:collapse;font-size:.92rem;line-height:1.5}
.table caption{padding:.8rem 1rem;text-align:left;font-weight:500;caption-side:top}
.table th,.table td{padding:.7rem 1rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.table thead th{background:var(--sand);font-weight:500;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
.table tbody tr:last-child>*{border-bottom:0}

/* ---------- 23. 404 ---------- */
.page-404{display:grid;place-items:center;min-height:62vh;padding-block:clamp(3rem,8vw,6rem);text-align:center}
.page-404__inner{display:grid;gap:1.4rem;justify-items:center;max-width:640px}
.page-404__code{font:italic 400 clamp(6rem,22vw,12rem)/.85 var(--serif);color:var(--green)}
.page-404 .poles{max-width:320px}

/* ---------- 24. Footer ---------- */
.site-footer{flex:none;background:var(--green-ink);color:var(--ivory);border-top:1px solid var(--line-light)}
@media (max-width:919px){.cta-band::after{display:none}}
.site-footer a:not(.btn){color:inherit;text-decoration:none}
.site-footer a:not(.btn):hover{text-decoration:underline;text-decoration-color:var(--brass)}
.site-footer :focus-visible{outline-color:var(--sand)}
.site-footer__grid{display:grid;gap:2.5rem 2rem;padding-block:clamp(3.5rem,7vw,5.5rem)}
@media (min-width:700px){.site-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1040px){.site-footer__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,.9fr) minmax(0,1.25fr) minmax(0,.9fr)}}
.site-footer__brand{display:grid;gap:1.3rem;justify-items:start;align-content:start}
.site-footer__brand .brand img{height:96px}
.site-footer__claim{max-width:26ch;font:italic 400 1.35rem/1.4 var(--serif)}
.site-footer__title{margin-bottom:1rem;font:500 .74rem/1.3 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--sand)}
.site-footer__list{display:grid;gap:.1rem}
.site-footer__list a{display:inline-flex;align-items:center;gap:.65rem;min-height:40px;color:rgba(247,243,236,.88)}
.site-footer__list a:hover{color:var(--ivory)}
.site-footer__list .icon{width:20px;height:20px;color:var(--sand)}
.site-footer__list small{display:block;margin:-.35rem 0 .3rem 1.95rem;font-size:.8rem;color:rgba(247,243,236,.72)}
.site-footer__list a[aria-current]{color:var(--ivory);text-decoration:underline;text-decoration-color:var(--brass)}
.copy-bar{background:var(--green-deep);color:rgba(247,243,236,.86);font-size:.84rem;line-height:1.5}
.copy-bar__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.5rem;padding-block:1.3rem}
.copy-bar__id{color:rgba(247,243,236,.72)}
.credit{color:currentColor;opacity:.92;text-decoration:none}
.credit .cuore{color:#FF0031}
.credit:hover{text-decoration:underline}
@media (max-width:719px){.copy-bar__inner{padding-bottom:calc(1.3rem + 72px)}}
@media (min-width:720px) and (max-width:1640px){.copy-bar__inner{padding-right:calc(var(--gutter) + 170px)}}

/* ---------- 25. WhatsApp flottante ---------- */
.wa-float{position:fixed;right:calc(1rem + env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));z-index:60;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;height:56px;min-width:56px;padding:0 1.2rem 0 1rem;border-radius:999px;background:var(--green);color:var(--ivory);font:500 .74rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;box-shadow:0 16px 32px -14px rgba(15,42,28,.7),inset 0 0 0 1px rgba(247,243,236,.22);transition:background-color .3s,transform .35s var(--ease)}
.wa-float:hover{background:var(--green-ink);transform:translateY(-3px)}
.wa-float .icon{width:26px;height:26px}
.wa-float:focus-visible{outline-offset:4px}
@media (min-width:720px){.wa-float{right:calc(1.5rem + env(safe-area-inset-right));bottom:calc(1.5rem + env(safe-area-inset-bottom))}}
@media (max-width:719px){.wa-float{width:56px;padding:0}.wa-float__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}

/* ---------- 27. Chi sono (/chi-sono) ---------- */
.cs-role{margin-top:-.35rem;font:italic 400 clamp(1.15rem,1.8vw,1.45rem)/1.4 var(--serif);color:var(--muted)}
.cs-hero__media{position:relative;max-width:380px;padding-bottom:2.4rem}
.cs-hero__media .arch img{object-position:50% 45%}
@media (max-width:599px){.cs-hero .btn-row .btn{flex:1 1 100%}}
.cs-story{display:grid;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
@media (min-width:900px){.cs-story{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}}
.cs-story__media{width:100%;max-width:440px;justify-self:center}
.cs-photo--portrait{aspect-ratio:4/5}
.cs-story__media .photo img{object-position:50% 70%}
.cs-dropcap::first-letter{float:left;margin:.1em .14em 0 0;font:400 3.6em/.78 var(--serif);color:var(--green)}
.cs-anchor{scroll-margin-top:var(--header-h)}
.cs-studies{display:grid;gap:clamp(2rem,5vw,3rem) clamp(2.5rem,6vw,5.5rem);grid-template-areas:"head" "media" "list"}
.cs-studies .section-head{margin-bottom:0}
.cs-studies__head{grid-area:head}
.cs-studies__media{grid-area:media;width:100%;max-width:400px;justify-self:center}
.cs-studies__list{grid-area:list}
.cs-photo--laurea img{object-position:35% 0}
@media (min-width:920px){
  .cs-studies{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-areas:"head media" "list media";grid-template-rows:auto 1fr;align-items:start}
  .cs-studies__media{position:sticky;top:calc(var(--header-h) + 2rem);justify-self:end}
}
.cs-timeline{display:grid;max-width:660px}
.cs-timeline__item{position:relative;display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:1.4rem;padding-bottom:2.5rem}
.cs-timeline__item:last-child{padding-bottom:0}
.cs-timeline__item:not(:last-child)::before{content:"";position:absolute;left:1.7rem;top:3.4rem;bottom:0;width:1px;background:var(--brass)}
.cs-timeline__num{display:grid;place-items:center;width:3.4rem;height:3.4rem;border:1px solid var(--brass);border-radius:50%;background:var(--ivory);font:italic 400 1.3rem/1 var(--serif);color:var(--green)}
.cs-timeline__num .icon{width:1.45rem;height:1.45rem}
.cs-timeline__item--coda .cs-timeline__num{background:var(--green);border-color:var(--green);color:var(--ivory)}
.cs-timeline__body{display:grid;gap:.4rem;padding-top:.3rem}
.cs-timeline__title{font-size:clamp(1.35rem,2.2vw,1.75rem);line-height:1.2}
.cs-timeline__meta{font-size:.9rem;letter-spacing:.02em;color:var(--muted)}
.cs-timeline__body p:last-child{margin-top:.25rem}
@media (max-width:479px){
  .cs-timeline__item{grid-template-columns:2.8rem minmax(0,1fr);gap:1rem}
  .cs-timeline__num{width:2.8rem;height:2.8rem;font-size:1.1rem}
  .cs-timeline__item:not(:last-child)::before{left:1.4rem;top:2.8rem}
}
.cs-card__top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.cs-note{margin-top:clamp(1.75rem,3vw,2.5rem)}
.cs-work{display:grid;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
@media (min-width:900px){.cs-work{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}
.cs-work__media{width:100%;max-width:560px;justify-self:center}
.cs-modes{display:grid;border-top:1px solid var(--line)}
.cs-modes li{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:1.1rem;padding-block:1.25rem;border-bottom:1px solid var(--line)}
.cs-modes .icon{width:2.3rem;height:2.3rem;color:var(--green)}
.cs-modes__title{margin-bottom:.3rem;font-size:clamp(1.2rem,1.8vw,1.45rem)}
.cs-modes p{font-size:.98rem;color:var(--muted)}
.cs-pet{margin-top:.5rem}
.cs-social .contact-card strong{color:var(--ink)}
@media (min-width:900px){.cs-social{grid-template-columns:minmax(0,1fr)}}

/* ---------- 28. Prodotti (/prodotti) ---------- */
.prodotti-hero__media{position:relative;padding-bottom:2.6rem}
.arch.prodotti-vetrina{display:flex;align-items:flex-end;justify-content:center;padding:0 0 9%;background:var(--panel)}
.arch.prodotti-vetrina picture{position:relative;flex:none;width:50%;height:auto}
.arch.prodotti-vetrina picture+picture{margin-left:-26%}
.arch.prodotti-vetrina .prodotti-vetrina__main{z-index:1;width:64%}
.arch.prodotti-vetrina picture:last-child{width:44%;margin-left:-28%}
.arch.prodotti-vetrina img{width:100%;height:auto;object-fit:contain;filter:var(--shadow-pack)}
.prodotti-trust{border-top:0}
.prodotti-consiglio{align-content:center}
.prodotti-consiglio .note--strong{color:var(--ink)}
.prodotti-consiglio__foto{width:100%;max-width:230px;padding:0 1.1rem 1.1rem 0}
.prodotti-confronto{gap:1.25rem 2rem}
.prodotti-confronto>div{padding-top:1rem;border-top:1px solid var(--line-strong)}
.prodotti-confronto__pack{width:72px;height:90px}
.prodotti-confronto__pack img{width:100%;height:100%;object-fit:contain;filter:var(--shadow-pack)}
.prodotti-avvertenze{display:grid;gap:clamp(2.5rem,5vw,3.5rem);margin-top:clamp(3.5rem,7vw,6rem)}
.prodotti-avvertenze .grid{align-items:start}
@media (max-width:599px){.prodotti-hero .btn-row .btn{flex:1 1 100%}}
@media (min-width:600px){.prodotti-span{grid-column:1/-1}}
@media (min-width:1020px){.prodotti-span{grid-column:span 2}.prodotti-grid--solo{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.prodotti-consiglio--foto{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:clamp(2rem,3vw,3rem);align-items:center}}

/* ---------- 29. Schede prodotto (/prodotti/<slug>) ---------- */
.pdp-nowrap{white-space:nowrap}
.pdp-acc .pdp-formati{gap:0;border-top:1px solid var(--line)}
.pdp-formati>li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;padding:.9rem 0;border-bottom:1px solid var(--line)}
.pdp-formati__name{display:grid;gap:.1rem}
.pdp-formati__name strong{font:500 1.15rem/1.3 var(--serif)}
.pdp-formati__name span{font-size:.88rem;color:var(--muted)}
.pdp-guide__desc{display:block;margin-top:.2rem;font-size:.95rem;line-height:1.55;color:var(--muted)}
.pdp-guide__chip{justify-self:start}

/* ---------- 30. Consulenza nutrizionale (/consulenza-nutrizionale) ---------- */
@media (max-width:599px){.cn-hero-actions .btn{flex:1 1 100%}}
.cn-card__head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.cn-card__head .card__num{font-size:1.4rem}
.cn-note{margin-top:clamp(1.75rem,3vw,2.5rem)}
.cn-actions{margin-top:clamp(2.5rem,5vw,3.5rem)}
.cn-strip{margin-bottom:clamp(2rem,4vw,3rem)}
.cn-strip img{object-position:56% 50%}
@media (min-width:700px){.steps.cn-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.steps.cn-steps{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cn-prep{display:grid;gap:2rem 2.5rem}
@media (min-width:640px){.cn-prep{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cn-osteo__media{width:100%;max-width:340px;justify-self:center}
.cn-card--cta>.btn{justify-self:start}

/* ---------- 31. Recensioni (/recensioni) ---------- */
.rec-hero__policy{max-width:470px;margin:0 1.1rem 1.1rem 0}
@media (min-width:920px){.rec-hero__policy{justify-self:end}}
.rec-hero__policy .policy{gap:1rem;padding:clamp(1.6rem,3.2vw,2.3rem)}
.rec-hero__policy .link-arrow{justify-self:start;margin-top:-.2rem}
.rec-empty{padding-top:calc(clamp(2.5rem,6vw,4.5rem) + 6px);overflow:hidden}
.rec-empty::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:repeating-linear-gradient(90deg,var(--green) 0 56px,var(--sand) 56px 112px)}
.rec-empty .btn-row{justify-content:center;margin-top:.4rem}
@media (max-width:599px){.rec-empty .btn-row{width:100%}.rec-empty .btn-row .btn{flex:1 1 100%;padding-inline:1rem}}
.reviews-empty .rec-empty__foot{margin-top:.3rem;font:italic 400 1.05rem/1.5 var(--serif);color:var(--muted)}
.rec-how__media{position:relative;width:100%;max-width:340px;justify-self:center;padding-bottom:2.4rem}
.rec-how__script{position:absolute;z-index:2;right:-.6rem;bottom:0;transform:rotate(-7deg);text-shadow:0 0 14px var(--paper),0 0 4px var(--paper);white-space:nowrap;pointer-events:none}
.steps.rec-steps{grid-template-columns:minmax(0,1fr);gap:0}
.rec-steps .step{grid-template-columns:3.4rem minmax(0,1fr);column-gap:1.3rem;row-gap:.45rem;padding-block:1.4rem}
.rec-steps .step__num{grid-row:span 2;font-size:clamp(2.3rem,3.4vw,2.9rem)}
.rec-steps .step:last-child{border-bottom:1px solid var(--line)}
.rec-rules .card__title{font-size:clamp(1.3rem,1.8vw,1.5rem)}
.rec-notes{margin-top:clamp(1.75rem,3vw,2.5rem)}
@media (min-width:900px){.rec-notes{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- 32. Contatti (/contatti) ---------- */
.page-hero__media.contatti-hero__media{position:relative;max-width:clamp(230px,62vw,330px);padding-bottom:1.6rem}
.contatti-hero__media .arch img{object-position:50% 40%}
.contatti-hero__script{position:absolute;z-index:2;left:-2.6rem;bottom:-.2rem;transform:rotate(-7deg);font-size:clamp(2.6rem,4.6vw,3.8rem);text-shadow:0 0 14px var(--ivory),0 0 4px var(--ivory);white-space:nowrap;pointer-events:none}
@media (max-width:919px){.contatti-hero__script{left:-1rem}}
.contatti-hero__actions{padding-top:.3rem}
@media (max-width:599px){.contatti-hero__actions .btn{flex:1 1 100%}}
.contatti-hero__contact{gap:.4rem .6rem}
.btn--plain.contatti-tel{gap:.55rem;font:400 clamp(1.3rem,2vw,1.55rem)/1.2 var(--serif);letter-spacing:.01em;color:var(--ink);white-space:nowrap;text-decoration:none}
.btn--plain.contatti-tel--lg{font-size:clamp(1.55rem,2.6vw,2rem)}
.contatti-tel .icon{width:1.5rem;height:1.5rem;color:var(--green)}
.contatti-layout{gap:clamp(3rem,6vw,5.5rem)}
.contatti-form .check .field__req{margin-left:.15rem}
.contatti-form .form-grid{padding-top:.2rem}
@media (min-width:600px){.contatti-submit{justify-self:start}}
.contatti-canali{display:grid;gap:clamp(1.25rem,2.5vw,1.75rem);align-content:start}
.contatti-canali .buy-box .eyebrow{margin-bottom:-.35rem}
@media (min-width:900px){.contatti-canali .contact-cards{grid-template-columns:minmax(0,1fr)}}
.contatti-canali .contact-card{padding:1rem 1.1rem}
.contatti-canali .contact-card .icon{width:30px;height:30px}
.contatti-canali .contact-card strong{overflow-wrap:anywhere}
.contatti-modi{display:grid;gap:1.15rem;padding-top:.4rem}
.contatti-modi__list{display:grid;gap:1.1rem}
.contatti-modi .way{align-items:flex-start}
.contatti-modi .way .icon{width:30px;height:30px;margin-top:.15rem}
.contatti-modi .way p{font-size:.94rem;line-height:1.55;color:var(--muted)}
.contatti-modi .way strong{display:block;margin-bottom:.15rem;font:500 1.12rem/1.3 var(--serif);color:var(--ink)}
.contatti-faq .accordion__body .btn-row{padding-top:.2rem}

/* ---------- 33. Pagine legali (privacy, cookie-policy, condizioni-di-vendita) ---------- */
.legal{padding-block:clamp(2.75rem,6vw,5rem) var(--space)}
.legal-summary{margin-bottom:clamp(3rem,6vw,4.5rem)}
.legal-summary .card__title{font-size:clamp(1.3rem,1.8vw,1.5rem)}
.legal-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(2.25rem,5vw,3rem)}
.legal-layout>*{min-width:0}
@media (min-width:1000px){
  .legal-layout{grid-template-columns:270px minmax(0,1fr);column-gap:clamp(3rem,6vw,5.5rem);align-items:start}
  .legal-layout__aside{position:sticky;top:calc(var(--header-h) + 1.25rem);max-height:calc(100vh - var(--header-h) - 2.5rem);overflow-y:auto;overscroll-behavior:contain}
}
.legal-layout__aside{display:grid;gap:1rem;align-content:start}
.legal-toc{display:grid;margin-top:.5rem;counter-reset:voce}
.legal-toc li{counter-increment:voce}
.legal-toc a{display:grid;grid-template-columns:2rem minmax(0,1fr);align-items:baseline;min-height:38px;padding-block:.4rem;line-height:1.35}
.legal-toc a::before{content:counter(voce,decimal-leading-zero);font:italic 400 .95rem/1 var(--serif);color:var(--green)}
.legal-num{display:block;margin-bottom:.4rem;font:italic 400 1.1rem/1 var(--serif);letter-spacing:0;color:var(--green)}
.legal .prose>:first-child{margin-top:0}
.legal .prose .legal-steps{margin-block:1.8em;padding-left:0}
.legal .prose .legal-steps>li{margin-top:0}
.legal .prose .step__title{margin-top:0}
.legal-table{min-width:680px}
.legal-table tbody th{font-weight:500}
.legal .prose .btn-row{margin-top:1.2em}
.legal .prose .policy ul{padding-left:1.1rem}
.legal .prose .policy li+li{margin-top:.55em}

/* ---------- 34. 404 ---------- */
.p404-code{display:flex;align-items:center;justify-content:center;gap:.02em}
.p404-shoe{width:.74em;height:.74em;margin-inline:.02em;stroke-width:.9;color:var(--green)}
.p404-actions{justify-content:center}
.p404-more{max-width:calc(980px + 2 * var(--gutter));margin-top:clamp(2.5rem,5vw,3.5rem)}
.p404-links{text-align:left}
@media (min-width:760px){.p404-links{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- 35. Motion ---------- */
.js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-reveal="fade"]{transform:none}
.js [data-reveal-delay="1"]{transition-delay:.08s}
.js [data-reveal-delay="2"]{transition-delay:.16s}
.js [data-reveal-delay="3"]{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none}
}

/* ---------- 36. Stampa ---------- */
@media print{
  .site-header,.drawer,.wa-float,.skip-link,.filters,.cta-band,.insta,.buy-box__actions,.hero__badge{display:none!important}
  body{background:#fff;color:#000;font-size:11pt}
  .section,.page-hero{padding-block:1.2rem}
  .site-footer,.copy-bar{background:#fff;color:#000}
  .site-footer__grid{padding-block:1rem}
  .js [data-reveal]{opacity:1;transform:none}
  .product-card,.card,.review{break-inside:avoid;box-shadow:none}
  .prose a[href^="http"]::after{content:" (" attr(href) ")";font-weight:400;font-size:.85em}
}

/* ---------- 40. Intro d'apertura: il logo si compone (assets/intro.js) ---------- */
/* html.fvi-on la mette intro.js nell'<head>, prima del contenuto: copre subito la pagina, niente lampo */
html.fvi-on::before{content:"";position:fixed;inset:0;z-index:2147483000;background:#F7F3EC}
html.fvi-on,html.fvi-on body{overflow:hidden}
#fvi{position:fixed;inset:0;z-index:2147483001;display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 42%,#FBF8F2 0%,#F7F3EC 55%,#EEE6D8 100%);color:#141414;cursor:pointer;-webkit-tap-highlight-color:transparent;will-change:transform}
.fvi-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(1.1rem,3vh,1.9rem);width:min(78vw,560px)}
.fvi-logo{position:relative;width:100%}
/* il logo resta invisibile finche' le animazioni non partono: senza, per 2-3 frame si vedeva gia' composto */
.fvi-logo svg{display:block;width:100%;height:auto;overflow:visible;opacity:0}
.fvi-ready .fvi-logo svg{opacity:1}
.fvi-logo path{fill:currentColor;transform-box:fill-box;transform-origin:50% 50%;will-change:transform,opacity}
#fvi{overflow:hidden}
.fvi-logo #fv-master,.fvi-logo .fvi-ghost{opacity:0}
.fvi-logo #fv-master{will-change:auto}
.fvi-poles{width:min(50%,280px);height:6px;border:1px solid #1F4D37;border-radius:3px;background:repeating-linear-gradient(90deg,#1F4D37 0 22px,#F7F3EC 22px 44px);transform:scaleX(0);transform-origin:0 50%}
.fvi-skip{position:fixed;left:0;right:0;bottom:max(22px,env(safe-area-inset-bottom));margin:0;text-align:center;font:500 .7rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:#5A554D;opacity:0;transition:opacity .4s ease .8s}
.fvi-ready .fvi-skip{opacity:1}
@media (prefers-reduced-motion:reduce){html.fvi-on::before,#fvi{display:none}}
@media print{html.fvi-on::before,#fvi{display:none}}
