/* Pistone · officina, griglia svizzera chiara. Template Super Easy Web (docs/TEMPLATE.md).
   Forme: tutto ad angolo vivo (raggio 0), linee sottili che dividono le celle. */
@font-face{font-family:'Space Grotesk';src:url('../_font/space-grotesk/space-grotesk-var.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('../_font/jetbrains-mono/jetbrains-mono-var.woff2') format('woff2');font-weight:100 800;font-display:swap}

:root{
  --p:#f5c400;
  --s:#efefeb;
  --t:#131416;
  --a:#26282c;
  --f-titoli:'Space Grotesk', 'Arial', sans-serif;
  --f-testo:'Space Grotesk', system-ui, sans-serif;
  --f-mono:'JetBrains Mono', ui-monospace, Consolas, monospace;

  --su-p:var(--t);
  --su-a:var(--s);
  --t2:color-mix(in oklab, var(--t) 68%, var(--s));
  --linea:color-mix(in oklab, var(--t) 18%, var(--s));
  --s2:color-mix(in oklab, var(--t) 5%, var(--s));
  --bordo:clamp(16px, 2.2vw, 32px);
  --max:1600px;
  --ease:cubic-bezier(.65,0,.35,1);
  --esce:cubic-bezier(.16,1,.3,1);
}
@supports (color: oklch(from red l c h)){
  :root{
    --su-p:oklch(from var(--p) clamp(.16, (.64 - l) * 999, .985) 0 0);
    --su-a:oklch(from var(--a) clamp(.16, (.64 - l) * 999, .985) 0 0);
  }
}
html[data-font] .mono{font-family:var(--f-testo)}

*,*::before,*::after{box-sizing:border-box}
.ancora-spenta{display:none !important}
h1,h2{text-wrap:balance}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--s);color:var(--t);font:400 17px/1.55 var(--f-testo);overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--f-titoli);font-weight:700;line-height:1;letter-spacing:-.035em}
p{margin:0}
button,input,select{font:inherit;color:inherit}
svg{width:1em;height:1em;flex:none}
figure{margin:0}
.mono{font-family:var(--f-mono);font-weight:500;letter-spacing:-.01em}
:focus-visible{outline:3px solid var(--p);outline-offset:2px}
.salta{position:absolute;left:-999px;top:8px;z-index:100;background:var(--p);color:var(--su-p);padding:10px 16px}
.salta:focus{left:16px}
.titolo{font-size:clamp(38px, 4.6vw, 76px)}

/* ---------- pulsanti ---------- */
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:56px;padding:0 22px;border:1.5px solid transparent;font:600 16px/1 var(--f-testo);text-decoration:none;cursor:pointer;white-space:nowrap;position:relative;overflow:hidden;isolation:isolate;transition:color .35s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease)}
.btn:hover::before{transform:scaleY(1)}
.btn svg{width:20px;height:20px;transition:transform .45s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn--p{background:var(--p);color:var(--su-p)}
.btn--p::before{background:var(--t)}
.btn--p:hover{color:var(--p)}
.btn--scuro{background:var(--t);color:var(--s)}
.btn--scuro::before{background:var(--s)}
.btn--scuro:hover{color:var(--t)}
.btn--linea{border-color:var(--t)}
.btn--linea::before{background:var(--t)}
.btn--linea:hover{color:var(--s)}
.btn--piccolo{min-height:46px;padding:0 18px;font-size:15px}
.collegamento{display:inline-flex;align-items:center;gap:10px;font:600 22px/1 var(--f-mono);text-decoration:none;min-height:44px}
.collegamento svg{width:20px;height:20px}
.collegamento:hover{text-decoration:underline;text-underline-offset:5px}

/* ---------- testata ---------- */
.testata{position:sticky;top:0;z-index:40;background:var(--s);border-bottom:1px solid var(--linea)}
.testata__barra{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 var(--bordo);height:36px;background:var(--t);color:var(--s);font-size:13px}
.testata__barra p{display:flex;gap:24px}
.testata__barra a{text-decoration:none;font-weight:700;color:color-mix(in oklab, var(--p) 75%, var(--s))}
.testata__riga{display:flex;align-items:center;gap:28px;height:68px;padding:0 var(--bordo)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 21px/1 var(--f-titoli);letter-spacing:-.03em;min-width:0;max-width:32vw}
.logo [data-nome]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:4px 0}
.logo__segno{width:26px;height:26px;flex:none;background:var(--p);box-shadow:inset 0 0 0 7px var(--p), inset 0 0 0 13px var(--t)}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{position:relative;text-decoration:none;font-weight:500;font-size:15px;padding:10px 12px}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;background:var(--p);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover::after{transform:scaleX(1)}
.lingue{display:flex;font:500 13px/1 var(--f-mono)}
.lingue a{text-decoration:none;padding:8px 6px;color:var(--t2)}
.lingue a[aria-current]{color:var(--t);font-weight:700}
.burger{display:none;position:relative;width:48px;height:48px;border:1.5px solid var(--t);background:transparent;cursor:pointer;margin-left:auto}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:var(--t);transition:transform .4s var(--ease), top .4s var(--ease)}
.burger span:first-child{top:18px}.burger span:last-child{top:26px}
.burger[aria-expanded="true"] span:first-child{top:22px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:22px;transform:rotate(-45deg)}
.pannello{position:fixed;inset:104px 0 0;z-index:35;background:var(--p);color:var(--su-p);padding:24px var(--bordo) 32px;display:flex;flex-direction:column;justify-content:space-between;overflow:auto}
.pannello[hidden]{display:none}
.pannello nav{display:flex;flex-direction:column}
.pannello nav a{display:flex;align-items:baseline;gap:18px;font:700 clamp(36px, 10vw, 60px)/1.1 var(--f-titoli);letter-spacing:-.04em;text-decoration:none;padding:10px 0;border-bottom:1.5px solid currentColor}
.pannello nav a .mono{font-size:14px;letter-spacing:0}
.pannello .btn{background:var(--su-p);color:var(--p);margin-top:24px}

/* ---------- celle (griglia svizzera) ---------- */
.cella{position:relative;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);min-width:0}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:repeat(12, minmax(0, 1fr));grid-template-areas:
  "t t t t t t t t m m m m"
  "f f f f n1 n1 n2 n2 m m m m"
  "f f f f s s s s n3 n3 n4 n4";
  grid-template-rows:auto minmax(180px, 1fr) minmax(180px, 1fr);
  min-height:min(calc(100svh - 105px), 875px);max-width:var(--max);margin:0 auto;border-left:1px solid var(--linea)}
.cella--titolo{grid-area:t;padding:clamp(28px, 3.4vw, 56px) var(--bordo) clamp(24px, 2.6vw, 40px)}
.hero__titolo{font-size:clamp(46px, 5.9vw, 100px);line-height:.94;letter-spacing:-.05em;max-width:14ch}
.cella--modulo{grid-area:m;background:var(--p);color:var(--su-p);padding:clamp(24px, 2.6vw, 40px);display:flex;flex-direction:column;gap:18px;justify-content:flex-end;border-color:color-mix(in oklab, var(--su-p) 20%, var(--p))}
.rapido__titolo{font-size:clamp(28px, 2.4vw, 40px);margin-bottom:auto;padding-bottom:24px}
.rapido__nota{font-size:13px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font:600 13px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em}
.campo input,.campo select{height:54px;border:1.5px solid currentColor;background:transparent;padding:0 14px;font:500 18px/1 var(--f-testo);border-radius:0;width:100%;min-width:0}
.campo input::placeholder{color:currentColor;opacity:.45}
.campo select option{color:#111}
.cella--modulo input[name="targa"]{font-family:var(--f-mono);text-transform:uppercase;letter-spacing:.08em}
.cella--modulo .btn{width:100%}
.cella--foto{grid-area:f;overflow:hidden;min-height:340px}
.cella--foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cella--num{padding:clamp(18px, 2vw, 32px);display:flex;flex-direction:column;justify-content:space-between;gap:12px}
.cella--num b{font-size:clamp(46px, 4.6vw, 80px);line-height:.9;font-weight:600;letter-spacing:-.05em}
.cella--num span{font-size:15px;color:var(--t2);max-width:20ch}
.n1{grid-area:n1}.n2{grid-area:n2}.n3{grid-area:n3}.n4{grid-area:n4}
.cella--sotto{grid-area:s;padding:clamp(18px, 2vw, 32px);display:flex;flex-direction:column;justify-content:space-between;gap:20px;background:var(--s2)}
.cella--sotto p{font-size:18px;max-width:44ch}

/* ---------- servizi ---------- */
.servizi{max-width:var(--max);margin:0 auto;padding:clamp(80px, 9vw, 140px) 0 0;position:relative}
.servizi__testa{display:grid;grid-template-columns:repeat(12, minmax(0, 1fr));gap:0 24px;padding:0 var(--bordo) 48px}
.servizi__testa .titolo{grid-column:1 / 8}
.servizi__testa p{grid-column:8 / 13;align-self:end;color:var(--t2);max-width:44ch}
.elenco{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--t)}
.voce{position:relative;display:grid;grid-template-columns:90px minmax(0, 4fr) minmax(0, 5fr) minmax(0, 2fr);align-items:center;gap:24px;padding:28px var(--bordo);border-bottom:1px solid var(--linea);cursor:default;transition:background-color .35s, color .35s}
.voce::before{content:"";position:absolute;inset:0;background:var(--p);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease);z-index:-1}
.voce{isolation:isolate}
.voce:hover::before{transform:scaleY(1)}
.voce:hover{color:var(--su-p)}
.voce__n{font-size:14px;color:var(--t2)}
.voce:hover .voce__n,.voce:hover p{color:inherit}
.voce h3{font-size:clamp(30px, 3.2vw, 54px);letter-spacing:-.045em;transition:transform .45s var(--esce)}
.voce:hover h3{transform:translateX(12px)}
.voce p{color:var(--t2);font-size:16px;max-width:46ch}
.voce__prezzo{justify-self:end;font-size:18px;white-space:nowrap}
.voce__mini{display:none}
.segui{position:fixed;left:0;top:0;z-index:30;width:300px;aspect-ratio:4/3;pointer-events:none;overflow:hidden;opacity:0;box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.segui img{width:100%;height:100%;object-fit:cover}

/* ---------- marche ---------- */
.marche{max-width:var(--max);margin:0 auto;padding:clamp(80px, 9vw, 140px) 0 0}
.marche__testa{padding:0 var(--bordo) 40px;display:flex;flex-direction:column;gap:16px}
.marche__testa p{color:var(--t2);max-width:56ch}
.marche__griglia{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5, 1fr);border-top:1px solid var(--linea);border-left:1px solid var(--linea)}
.marche__griglia li{padding:26px var(--bordo);border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);font-size:clamp(16px, 1.3vw, 20px);transition:background-color .3s, color .3s}
.marche__griglia li:hover{background:var(--t);color:var(--s)}
.marche__griglia li:last-child{background:var(--p);color:var(--su-p)}

/* ---------- prenota ---------- */
.prenota{background:var(--a);color:var(--su-a);margin-top:clamp(80px, 9vw, 140px)}
.prenota__griglia{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0, 5fr) minmax(0, 7fr)}
.prenota__testo{padding:clamp(48px, 6vw, 96px) var(--bordo);display:flex;flex-direction:column;gap:24px;border-right:1px solid color-mix(in oklab, var(--su-a) 18%, var(--a))}
.prenota__testo > p{max-width:36ch;opacity:.8;font-size:18px}
.stima{margin-top:auto;padding-top:32px;border-top:1px solid color-mix(in oklab, var(--su-a) 22%, var(--a));display:flex;flex-direction:column;gap:8px}
.stima span{font-size:13px;text-transform:uppercase;letter-spacing:.1em;opacity:.7}
.stima b{font-family:var(--f-titoli);font-weight:700 !important;font-size:clamp(48px, 5vw, 84px);line-height:.9;color:var(--su-a);font-weight:600;letter-spacing:-.05em;align-self:flex-start;background:linear-gradient(var(--p), var(--p)) 0 88% / 100% .18em no-repeat;padding-bottom:.08em}
.stima small{opacity:.7;font-size:14px}
.prenota__modulo{padding:clamp(40px, 5vw, 80px) var(--bordo);display:flex;flex-direction:column;gap:28px}
.riga-campi{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:end}
.prenota .campo input{border-color:color-mix(in oklab, var(--su-a) 45%, var(--a))}
.prenota .campo input:focus{outline:none;border-color:var(--p)}
.lavori{border:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(3, 1fr);gap:8px}
.lavori legend{font:600 13px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px;padding:0}
.lavori label{position:relative;cursor:pointer}
.lavori input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.lavori span{display:flex;align-items:center;min-height:54px;padding:0 16px;border:1.5px solid color-mix(in oklab, var(--su-a) 30%, var(--a));font-weight:600;font-size:16px;transition:background-color .25s, color .25s, border-color .25s}
.lavori input:checked + span{background:var(--p);color:var(--su-p);border-color:var(--p)}
.lavori input:focus-visible + span{outline:3px solid var(--p);outline-offset:2px}
.interruttore{display:flex;align-items:center;gap:14px;min-height:54px;cursor:pointer;font-weight:600;position:relative}
.interruttore input{position:absolute;opacity:0;width:1px;height:1px}
.interruttore__segno{flex:none;width:52px;height:30px;border:1.5px solid currentColor;position:relative;transition:background-color .3s}
.interruttore__segno::after{content:"";position:absolute;top:4px;left:4px;width:19px;height:19px;background:currentColor;transition:transform .35s var(--ease), background-color .3s}
.interruttore input:checked + .interruttore__segno{background:var(--p);border-color:var(--p)}
.interruttore input:checked + .interruttore__segno::after{transform:translateX(22px);background:var(--su-p)}
.interruttore input:focus-visible + .interruttore__segno{outline:3px solid var(--p);outline-offset:2px}
.prenota__modulo .btn{align-self:flex-start;min-width:260px}

/* ---------- officina ---------- */
.officina{max-width:var(--max);margin:0 auto;padding-top:clamp(80px, 9vw, 140px)}
.officina__griglia{display:grid;grid-template-columns:repeat(12, minmax(0, 1fr));grid-template-areas:
  "x x x x a a a a a a a a"
  "b b b c c c c c p p p p";
  border-top:1px solid var(--linea);border-left:1px solid var(--linea)}
.cella--testo{grid-area:x;padding:clamp(24px, 3vw, 48px) var(--bordo);display:flex;flex-direction:column;gap:24px}
.cella--testo p{color:var(--t2)}
.cella--f1{grid-area:a;overflow:hidden;aspect-ratio:16/9}
.cella--f2{grid-area:b;overflow:hidden;aspect-ratio:4/5}
.cella--f3{grid-area:c;overflow:hidden}
.cella--f1 img,.cella--f2 img,.cella--f3 img{width:100%;height:100%;object-fit:cover;transform:scale(1.15)}
.cella--patti{grid-area:p;list-style:none;margin:0;padding:clamp(24px, 3vw, 48px) var(--bordo);display:flex;flex-direction:column;justify-content:center;gap:0;background:var(--t);color:var(--s)}
.cella--patti li{display:flex;gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px solid color-mix(in oklab, var(--s) 20%, var(--t));font-size:clamp(18px, 1.5vw, 22px);font-weight:600;letter-spacing:-.02em}
.cella--patti li:last-child{border-bottom:0}
.cella--patti .mono{color:var(--p);font-size:14px}

/* ---------- recensioni ---------- */
.recensioni{max-width:var(--max);margin:0 auto;padding-top:clamp(80px, 9vw, 140px)}
.recensioni__griglia{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));border-top:1px solid var(--linea);border-left:1px solid var(--linea)}
.recensioni blockquote{margin:0;padding:clamp(24px, 2.6vw, 40px);display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:280px}
.recensioni blockquote p{font-size:clamp(18px, 1.5vw, 22px);line-height:1.4;letter-spacing:-.015em}
.recensioni footer{font-size:13px;color:var(--t2)}
.cella--voto{padding:clamp(24px, 2.6vw, 40px);background:var(--p);color:var(--su-p);display:flex;flex-direction:column;gap:10px;justify-content:flex-end}
.voto{font-size:clamp(80px, 8vw, 132px);line-height:.85;font-weight:600;letter-spacing:-.06em}
.stelle{display:flex;gap:4px}
.stelle svg{width:22px;height:22px}

/* ---------- contatti ---------- */
.contatti{max-width:var(--max);margin:0 auto;padding-top:clamp(80px, 9vw, 140px)}
.contatti__griglia{display:grid;grid-template-columns:repeat(12, minmax(0, 1fr));border-top:1px solid var(--linea);border-left:1px solid var(--linea)}
.cella--dove{grid-column:span 4;padding:clamp(24px, 3vw, 48px) var(--bordo);display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.cella--dove p{color:var(--t2)}
.grande{font-size:clamp(26px, 2.2vw, 36px);font-weight:600;color:var(--t);text-decoration:none;letter-spacing:-.04em}
.cella--orari{grid-column:span 4;padding:clamp(24px, 3vw, 48px) var(--bordo)}
.cella--orari h3{font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:18px}
.cella--orari dl{margin:0}
.cella--orari dl div{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--linea)}
.cella--orari dd{margin:0;font-size:15px}
.nota{margin-top:16px;color:var(--t2);font-size:15px}
.cella--mappa{grid-column:span 4;min-height:340px;background:var(--s2);overflow:hidden}
.cella--mappa svg{position:absolute;inset:0;width:100%;height:100%}
.griglia-mappa path{stroke:var(--linea);stroke-width:1;fill:none}
.strada{fill:none;stroke:var(--t);stroke-width:6;stroke-linecap:square;opacity:.18}
.strada--grande{stroke-width:14;opacity:.3}
.strada--fine{stroke-width:3}
.punto rect{fill:var(--p);stroke:var(--t);stroke-width:2}
.punto .punto__centro{fill:var(--t);stroke:none}

/* ---------- piede ---------- */
.piede{max-width:var(--max);margin:clamp(80px, 9vw, 140px) auto 0;padding:0 var(--bordo) 110px;border-top:1.5px solid var(--t)}
.piede__nome{font:700 clamp(48px, 9.5vw, 160px)/.9 var(--f-titoli);letter-spacing:-.06em;padding:40px 0;overflow-wrap:anywhere}
.piede__riga{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px;color:var(--t2)}

/* ---------- flottanti ---------- */
.flottanti{position:fixed;right:18px;bottom:18px;z-index:30;display:flex;gap:8px;transition:opacity .4s, transform .5s var(--esce)}
html.js .flottanti.in-attesa{opacity:0;transform:translateY(20px);pointer-events:none}
.flottante{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:56px;height:56px;padding:0 16px;text-decoration:none;font-weight:700;box-shadow:0 14px 30px -14px rgba(0,0,0,.45)}
.flottante[hidden]{display:none}
.flottante svg{width:24px;height:24px}
.flottante--tel{background:var(--p);color:var(--su-p);display:none}
.flottante--wa{background:var(--t);color:var(--s)}

/* ---------- responsive ---------- */
@media (max-width:1200px){
  .nav a{padding:10px 8px}
  .lingue{display:none}
  .voce{grid-template-columns:70px minmax(0, 1fr) minmax(0, 1.2fr) auto}
  .marche__griglia{grid-template-columns:repeat(4, 1fr)}
  .recensioni__griglia{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width:1024px){
  .hero{grid-template-areas:
    "t t t t t t t t t t t t"
    "f f f f f f m m m m m m"
    "f f f f f f m m m m m m"
    "n1 n1 n1 n2 n2 n2 n3 n3 n3 n4 n4 n4"
    "s s s s s s s s s s s s";grid-template-rows:auto;min-height:0}
  .cella--titolo{padding-bottom:32px}
  .hero__titolo{max-width:16ch}
  .cella--foto{min-height:420px}
  .prenota__griglia{grid-template-columns:1fr}
  .prenota__testo{border-right:0;border-bottom:1px solid color-mix(in oklab, var(--su-a) 18%, var(--a))}
  .officina__griglia{grid-template-areas:"x x x x x x x x x x x x" "a a a a a a a a a a a a" "b b b b b b c c c c c c" "p p p p p p p p p p p p"}
  .contatti__griglia > .cella{grid-column:span 6}
  .cella--mappa{grid-column:1 / -1 !important}
}
@media (max-width:900px){
  .nav,.testata__riga > .btn,.testata__via{display:none}
  .burger{display:block}
  .logo{max-width:70vw}
  .servizi__testa{display:flex;flex-direction:column;gap:18px}
  .voce{grid-template-columns:44px minmax(0, 1fr) 96px;grid-template-areas:"n h m" "n p m" "n z m";gap:6px 16px;padding:22px var(--bordo)}
  .voce__n{grid-area:n;align-self:start;padding-top:6px}
  .voce h3{grid-area:h}
  .voce p{grid-area:p}
  .voce__prezzo{grid-area:z;justify-self:start;font-size:16px}
  .voce__mini{display:block;grid-area:m;width:96px;height:96px;object-fit:cover;align-self:start}
  .voce:hover h3{transform:none}
  .segui{display:none}
  .flottante--tel{display:inline-flex}
}
@media (max-width:640px){
  body{font-size:16px}
  .testata__barra p span:nth-child(2){display:none}
  .titolo{font-size:clamp(34px, 10vw, 46px)}
  .hero{grid-template-columns:1fr 1fr;grid-template-areas:
    "t t" "m m" "f f" "n1 n2" "n3 n4" "s s"}
  .hero__titolo{font-size:clamp(40px, 12.5vw, 60px)}
  .cella--foto{min-height:0;height:340px}
  .cella--num b{font-size:48px}
  .cella--num span{font-size:14px}
  .cella--sotto p{font-size:16px}
  .voce{grid-template-columns:32px minmax(0, 1fr) 76px}
  .voce__mini{width:76px;height:76px}
  .voce h3{font-size:28px}
  .voce p{font-size:15px}
  .marche__griglia{grid-template-columns:repeat(2, 1fr)}
  .marche__griglia li{padding:18px var(--bordo)}
  .riga-campi{grid-template-columns:1fr}
  .lavori{grid-template-columns:1fr 1fr}
  .lavori span{font-size:15px;padding:0 12px}
  .prenota__modulo .btn{align-self:stretch;min-width:0}
  .officina__griglia{grid-template-areas:"x x x x x x x x x x x x" "a a a a a a a a a a a a" "b b b b b b b b b b b b" "c c c c c c c c c c c c" "p p p p p p p p p p p p"}
  .cella--f3{aspect-ratio:3/2}
  .recensioni__griglia{grid-template-columns:1fr}
  .recensioni blockquote{min-height:0}
  .contatti__griglia > .cella{grid-column:1 / -1}
  .flottante--tel span{display:none}
}
@media (min-width:1800px){
  body{font-size:18px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .cella--f1 img,.cella--f2 img,.cella--f3 img{transform:none}
}

/* ---------- apertura ---------- */
/* Pistone: l'insegna si accende sulla saracinesca abbassata, poi la saracinesca si alza sull'officina. */
.apertura{background:transparent}
.ap-serranda{position:absolute;left:0;right:0;top:0;height:100%;background:
  repeating-linear-gradient(180deg,
    color-mix(in oklab, var(--t) 78%, var(--s)) 0,
    color-mix(in oklab, var(--t) 62%, var(--s)) 14px,
    color-mix(in oklab, var(--t) 86%, var(--s)) 26px,
    color-mix(in oklab, var(--t) 95%, var(--s)) 28px,
    color-mix(in oklab, var(--t) 78%, var(--s)) 30px);
  box-shadow:0 10px 30px rgba(0,0,0,.45)}
.ap-serranda::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22px;background:linear-gradient(color-mix(in oklab, var(--t) 50%, var(--s)), color-mix(in oklab, var(--t) 90%, var(--s)))}
.ap-maniglia{position:absolute;left:50%;bottom:30px;width:90px;height:10px;margin-left:-45px;border-radius:5px;background:color-mix(in oklab, var(--t) 40%, var(--s))}
.ap-insegna{position:absolute;left:0;right:0;top:50%;margin:0 auto;width:max-content;transform:translateY(-50%);max-width:calc(100% - 32px);display:flex;align-items:center;gap:16px;padding:clamp(16px, 2.4vw, 26px) clamp(20px, 3vw, 36px);background:var(--p);color:var(--su-p);box-shadow:0 0 0 6px var(--t), 0 20px 60px -10px color-mix(in oklab, var(--p) 70%, transparent)}
.ap-spia{flex:none;width:16px;height:16px;border-radius:50%;background:#3ddc62;box-shadow:0 0 14px #3ddc62}
.ap-nome{margin:0;font:700 clamp(26px, 4.4vw, 64px)/1 var(--f-titoli);letter-spacing:-.04em;overflow-wrap:break-word;min-width:0}
/* ---------- /apertura ---------- */