:root{
--color-primary-text:rgb(3,3,3);
--color-primary-background:rgb(255,255,255);
--color-primary-accent:rgb(212,37,87);
--color-accent-scuro:rgb(196,24,74);
--color-grid:rgb(3,3,3);
--color-tenue:rgb(240,240,240);
--color-muto:rgb(88,88,88);
--font-body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--section-x:1rem;
--py-theme:2rem;
--altezza-testa:3.3rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:6rem}
body{margin:0;background:var(--color-primary-background);color:var(--color-primary-text);font-family:var(--font-body);font-size:1rem;line-height:1.2}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}

/* utility della griglia */
.griglia{display:-ms-grid;display:grid;grid-template-columns:repeat(1,minmax(0,1fr))}
.col-span-1{grid-column:span 1/span 1}
.maiuscolo{text-transform:uppercase}
.section-x-padding{padding-left:var(--section-x);padding-right:var(--section-x)}
.py-theme{padding-top:var(--py-theme);padding-bottom:var(--py-theme)}
.py-4{padding-top:1rem;padding-bottom:1rem}
.mt-1{margin-top:.25rem}
.text-sm{font-size:.8rem;line-height:1.2}
.text-2xl{font-size:1.563rem;line-height:1.2}
.border-b-grid{border-bottom:1px solid var(--color-grid)}
.border-t-grid{border-top:1px solid var(--color-grid)}
.border-r-grid{border-right:1px solid var(--color-grid)}
.hover\:text-scheme-accent:hover{color:var(--color-accent-scuro)}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* striscia che scorre */
.annuncio{overflow:hidden;white-space:nowrap;border-bottom:1px solid var(--color-grid);font-size:1rem;text-transform:uppercase;height:2.2rem;line-height:2.2rem}
.annuncio__giro{display:inline-block;padding-left:100%;-webkit-animation:scorri 38s linear infinite;animation:scorri 38s linear infinite}
.annuncio:hover .annuncio__giro{-webkit-animation-play-state:paused;animation-play-state:paused}
@-webkit-keyframes scorri{to{-webkit-transform:translateX(-100%)}}
@keyframes scorri{to{transform:translateX(-100%)}}

/* header */
.sticky-testa{position:-webkit-sticky;position:sticky;top:0;z-index:30;background:var(--color-primary-background)}
.headzone{position:relative;background:var(--color-primary-background);border-bottom:1px solid var(--color-grid)}
.headzone__riga{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:var(--altezza-testa)}
.headzone__logo img{width:9.5rem}
.headzone__nav{display:none}
.headzone__nav a{text-decoration:none;text-transform:uppercase;padding:.6rem 0}
.headzone__nav a[aria-current]{text-decoration:underline;text-underline-offset:.3rem}
.headzone__tel{display:none;text-decoration:none;text-transform:uppercase}
.headzone__menu{margin-left:auto;background:none;border:0;padding:.7rem 0 .7rem .7rem;text-transform:uppercase;cursor:pointer}
.tendina-mobile{border-top:1px solid var(--color-grid)}
.tendina-mobile a{display:block;padding:.9rem var(--section-x);border-bottom:1px solid var(--color-grid);text-decoration:none;text-transform:uppercase}
.tendina-mobile[hidden]{display:none}

/* hero */
.hero-foto{position:relative;border-bottom:1px solid var(--color-grid);height:70vh;min-height:26rem;max-height:53.5rem;overflow:hidden;background:#222}
.hero-foto img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}
.hero-foto__testo{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:vertical;
  -ms-flex-direction:column;
  flex-direction:column;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  text-align:center;
  padding:0 var(--section-x);
  color:#fff;
  background:rgba(0,0,0,.28);
}
.hero-foto__testo h1{font-size:1.563rem;font-weight:400;text-transform:uppercase;max-width:38rem;line-height:1.2;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.hero-foto__testo p{max-width:34rem;margin-top:.75rem;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.bottone-accento{display:inline-block;margin-top:1.5rem;background:var(--color-primary-accent);color:#fff;padding:.6rem 2rem;text-decoration:none;text-transform:uppercase;border:0;cursor:pointer;font-size:1rem}
.bottone-accento:hover{background:var(--color-accent-scuro)}
.bottone-accento[disabled]{opacity:.6;cursor:wait}

/* titoli di sezione */
.titolo-sezione{font-size:1.563rem;font-weight:400;text-transform:uppercase;padding:1.75rem var(--section-x) 1rem;border-bottom:1px solid var(--color-grid)}
/* .titolo-sezione{padding-top:2.5rem} */

/* griglia "prodotti" */
.type-product-grid-item{display:block;text-decoration:none;height:100%;border-bottom:1px solid var(--color-grid)}
.type-product-grid-item .gallery-image-cropped{background:var(--color-tenue);border-bottom:1px solid var(--color-grid);aspect-ratio:1}
.type-product-grid-item img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}
.type-product-grid-item .didascalia{padding:1rem var(--section-x);text-align:left;text-transform:uppercase}
.type-product-grid-item .didascalia p + p{margin-top:.25rem}

/* celle di esempio */
.cella-esempio{padding:1.25rem var(--section-x) 1.5rem;border-bottom:1px solid var(--color-grid);min-height:11rem}
.cella-esempio dt{text-transform:uppercase;font-size:.8rem;letter-spacing:.04em;color:var(--color-muto)}
.cella-esempio dd{margin-top:.6rem;font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-size:.95rem;line-height:1.45}
.cella-esempio .esito{display:block;margin-top:.8rem;font-family:var(--font-body);font-size:.95rem}
.cella-esempio .esito b{color:var(--color-accent-scuro);font-weight:400;text-transform:uppercase}

/* collezioni */
.collezione{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-bottom:1px solid var(--color-grid);text-decoration:none}
.collezione img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-webkit-transition:-webkit-transform .6s;transition:transform .6s}
.collezione:hover img{-webkit-transform:scale(1.03);transform:scale(1.03)}
.collezione__nome{position:absolute;left:0;right:0;top:1.75rem;text-align:center;color:#fff;font-size:2.2rem;text-transform:uppercase;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.collezione__riga{position:absolute;left:1rem;right:1rem;bottom:1.25rem;color:#fff;text-align:center;background:rgba(3,3,3,.7);padding:.6rem .8rem;line-height:1.35}

/* iscrizione a tessere */
.iscrizione{border-bottom:1px solid var(--color-grid)}
.iscrizione__intro{padding:1.25rem var(--section-x);border-bottom:1px solid var(--color-grid);line-height:1.45}
.gruppo-tessere{border:0;margin:0;padding:1.25rem var(--section-x);border-bottom:1px solid var(--color-grid)}
.gruppo-tessere legend{float:left;width:100%;text-transform:uppercase;margin-bottom:.8rem}
.tessere{clear:both;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.tessera{position:relative}
.tessera input{position:absolute;opacity:0;width:1px;height:1px}
.tessera span{display:block;border:1px solid var(--color-grid);padding:.9rem .8rem;min-height:4.2rem;cursor:pointer;line-height:1.3}
.tessera span small{display:block;margin-top:.3rem;color:var(--color-muto);font-size:.8rem}
.tessera input:checked + span{background:var(--color-primary-text);color:#fff}
.tessera input:checked + span small{color:#d6d6d6}
.tessera input:focus-visible + span{outline:2px solid var(--color-primary-accent);outline-offset:2px}
.campi{padding:1.25rem var(--section-x);display:grid;gap:1rem}
.campi label{display:block;text-transform:uppercase;font-size:.8rem;margin-bottom:.35rem}
.campi input[type=text],.campi input[type=email],.campi select{width:100%;padding:.75rem .8rem;border:1px solid var(--color-grid);border-radius:0;background:#fff;font-size:1rem}
.campi input:focus,.campi select:focus{outline:2px solid var(--color-primary-accent);outline-offset:1px}
.campi input:user-invalid,.campi select:user-invalid{border-color:var(--color-accent-scuro)}
.consenso{display:-webkit-box;display:-ms-flexbox;display:flex;gap:.6rem;line-height:1.4;font-size:.95rem}
.consenso input{width:1.1rem;height:1.1rem;margin:.1rem 0 0;-ms-flex-negative:0;flex-shrink:0;accent-color:var(--color-primary-text)}
.trappola{display:none}
.risposta{margin:0 var(--section-x) 1.25rem;padding:1rem;border:1px solid var(--color-grid);line-height:1.45}
.risposta.bene{background:var(--color-tenue)}
.risposta.male{border-color:var(--color-accent-scuro);color:var(--color-accent-scuro)}
.risposta[hidden]{display:none}

/* domande ad accordion */
.faq-lista details{border-bottom:1px solid var(--color-grid)}
.faq-lista summary{list-style:none;cursor:pointer;padding:1rem 2.5rem 1rem var(--section-x);position:relative;text-transform:uppercase}
.faq-lista summary::-webkit-details-marker{display:none}
.faq-lista summary:after{content:"+";position:absolute;right:var(--section-x);top:.9rem;font-size:1.3rem}
.faq-lista details[open] summary:after{content:"–"}
.faq-lista details p{padding:0 var(--section-x) 1.25rem;line-height:1.45;max-width:46rem}

/* altre pagine */
.testa-pagina{padding:2rem var(--section-x) 1.5rem;border-bottom:1px solid var(--color-grid)}
.testa-pagina h1{font-size:1.563rem;font-weight:400;text-transform:uppercase;line-height:1.2}
.testa-pagina p{margin-top:.8rem;max-width:42rem;line-height:1.45}
.blocco{padding:1.5rem var(--section-x);border-bottom:1px solid var(--color-grid);line-height:1.5}
.blocco h2{font-size:1rem;font-weight:400;text-transform:uppercase;margin-bottom:.8rem}
.blocco p + p,.blocco p + ul,.blocco ul + p{margin-top:.8rem}
.blocco ul li{padding:.35rem 0 .35rem 1rem;position:relative}
.blocco ul li:before{content:"";position:absolute;left:0;top:.95rem;width:.4rem;height:1px;background:var(--color-primary-text)}
.blocco__testo{max-width:46rem}
.foto-larga img{width:100%;height:22rem;-o-object-fit:cover;object-fit:cover;border-bottom:1px solid var(--color-grid)}
.prova-cf{display:grid;gap:.6rem;max-width:30rem;margin-top:1rem}
.prova-cf input{padding:.75rem .8rem;border:1px solid var(--color-grid);font-family:ui-monospace,Consolas,monospace;font-size:1.1rem;letter-spacing:.08em;text-transform:uppercase;border-radius:0}
.prova-cf output{display:block;min-height:3rem;padding:.75rem .8rem;border:1px dashed var(--color-grid);line-height:1.4}
.tabella-cf{width:100%;border-collapse:collapse;font-size:.9rem;margin-top:1rem}
.tabella-cf th,.tabella-cf td{border:1px solid var(--color-grid);padding:.5rem .6rem;text-align:left;vertical-align:top}
.tabella-cf th{text-transform:uppercase;font-weight:400;background:var(--color-tenue)}
.scorre{overflow-x:auto}
.testo-regole{padding:1.5rem var(--section-x) 2.5rem;line-height:1.55;max-width:50rem}
.testo-regole h2{font-size:1rem;font-weight:400;text-transform:uppercase;margin-top:1.75rem;padding-top:1rem;border-top:1px solid var(--color-grid)}
.testo-regole p,.testo-regole ul{margin-top:.7rem}
.testo-regole li{padding-left:1rem;position:relative;margin-top:.3rem}
.testo-regole li:before{content:"–";position:absolute;left:0}

/* piede */
.underline-block{border-top:1px solid var(--color-grid)}
.underline-block__celle > div{padding:1rem var(--section-x) 1.5rem;border-bottom:1px solid var(--color-grid);line-height:1.45}
.underline-block h2{font-size:1rem;font-weight:400;text-transform:uppercase;margin-bottom:.6rem}
.underline-block a{text-decoration:none}
.underline-block li a,.underline-block li button{display:inline-block;padding:.2rem 0;background:none;border:0;cursor:pointer;text-align:left}
.underline-block li a:hover,.underline-block li button:hover{text-decoration:underline}
.underline-block .icone{display:-webkit-box;display:-ms-flexbox;display:flex;gap:.9rem}
.underline-block .icone svg{width:1.4rem;height:1.4rem}
.underline-block__fondo{padding:1rem var(--section-x) 1.25rem;font-size:.8rem;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem 1.5rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}

/* avviso cookie */
.avviso-cookie{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--color-grid);padding:1rem var(--section-x);display:grid;gap:.8rem;line-height:1.4}
.avviso-cookie[hidden]{display:none}
.avviso-cookie__bottoni{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:.5rem}
.avviso-cookie button{border:1px solid var(--color-grid);background:#fff;padding:.6rem 1rem;text-transform:uppercase;cursor:pointer}
.avviso-cookie button.bottone-nero{background:var(--color-primary-text);color:#fff}

a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--color-primary-accent);outline-offset:2px}

@media only screen and (max-width:900px){
.collezione__nome{font-size:1.8rem}
}
@media (min-width:1024px){
:root{--section-x:1rem;--py-theme:2.5rem}
.griglia--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.griglia--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.griglia--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.lg\:border-r-grid{border-right:1px solid var(--color-grid)}
.griglia--4 > .col-span-1:nth-child(4n){border-right:0}
.headzone__riga{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.headzone__nav{display:contents}
.headzone__nav a{text-align:center}
.headzone__tel{display:block;text-align:right}
.headzone__menu,.tendina-mobile{display:none!important}
.hero-foto__testo h1{font-size:2rem}
.tessere{grid-template-columns:repeat(4,minmax(0,1fr))}
.campi{grid-template-columns:repeat(3,minmax(0,1fr));-webkit-box-align:end;-ms-flex-align:end;align-items:end}
.campi .tutta{grid-column:1/-1}
.faq-lista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.faq-lista details:nth-child(odd){border-right:1px solid var(--color-grid)}
.underline-block__celle{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.underline-block__celle > div{border-right:1px solid var(--color-grid);border-bottom:0}
.underline-block__celle > div:last-child{border-right:0}
.underline-block__fondo{border-top:1px solid var(--color-grid)}
.avviso-cookie{grid-template-columns:1fr auto;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.foto-larga img{height:30rem}
}
@media (prefers-reduced-motion:reduce){
.annuncio__giro{-webkit-animation:none;animation:none;padding-left:var(--section-x)}
.collezione img{-webkit-transition:none;transition:none}
}

/* linee della griglia: sfondo nero, 1px di spazio, celle bianche */
.griglia-linee{display:grid;gap:1px;background:var(--color-grid);grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid var(--color-grid)}
.griglia-linee > *{background:var(--color-primary-background)}
.griglia-linee--1{grid-template-columns:minmax(0,1fr)}
.griglia-linee .type-product-grid-item,.griglia-linee .cella-esempio,.griglia-linee .collezione{border-bottom:0}
.type-product-grid-item:hover .didascalia p:first-child{color:var(--color-accent-scuro)}
@media (min-width:1024px){
.griglia-linee--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.griglia-linee--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.underline-block__celle{gap:1px;background:var(--color-grid)}
.underline-block__celle > div{background:var(--color-primary-background);border-right:0}
}

.campione-mail{margin:0;padding:1.25rem var(--section-x);border-bottom:1px solid var(--color-grid);font-family:ui-monospace,Consolas,monospace;font-size:.9rem;line-height:1.55;white-space:pre-wrap;background:var(--color-tenue)}
.hero-foto__bottone{position:absolute;left:0;right:0;top:62%;text-align:center}
.hero-foto__bottone .bottone-accento{margin-top:0}
.riga-titolo{padding:1.5rem var(--section-x) 1.75rem;border-bottom:1px solid var(--color-grid)}
.riga-titolo h1{font-size:clamp(1.563rem,3.4vw,2.441rem);font-weight:400;text-transform:uppercase;line-height:1.15;text-wrap:balance}
.riga-titolo p{margin-top:.6rem;max-width:44rem;line-height:1.45;text-wrap:pretty}
.testa-pagina h1,.titolo-sezione{text-wrap:balance}
.iscrizione__intro,.blocco__testo p{text-wrap:pretty}
.faq-lista{padding-bottom:3rem}
.iscrizione{padding-bottom:.5rem}
@media (min-width:1024px){.headzone__riga{grid-template-columns:1.2fr repeat(3,minmax(0,1fr)) 1.2fr}.campi{-webkit-box-align:start;-ms-flex-align:start;align-items:start}}
.campi label.consenso{text-transform:none;font-size:.95rem;margin-bottom:0}
.tabella-cf + p,.scorre + p{margin-top:1rem}
.testo-regole,.blocco__testo,.testa-pagina p,.riga-titolo p{max-width:none}

/* sabato da casa */
.da-casa{display:grid;grid-template-columns:1fr;border-bottom:1px solid var(--color-grid)}
.da-casa__foto img{width:100%;height:100%;object-fit:cover}
.da-casa__testo{padding:1.5rem var(--section-x);line-height:1.55}
.da-casa__testo p+p,.da-casa__testo ul{margin-top:.8rem}
.da-casa__testo ul{padding-left:1.1rem}
.da-casa__manca{margin-top:1.2rem;display:inline-block;background:var(--color-primary-accent);color:#fff;padding:.4rem .7rem;font-size:.9rem}
/* dopo: cosa fa l'IA */
.dopo-ia__voce{background:var(--color-primary-background);padding:1.5rem var(--section-x)}
.dopo-ia__voce svg{width:38px;height:38px;color:var(--color-primary-accent)}
.dopo-ia__voce h3{margin-top:.7rem;font-size:1.1rem;font-weight:600;text-transform:uppercase}
.dopo-ia__voce p{margin-top:.5rem;line-height:1.5;color:var(--color-muto)}
/* interne */
.foto-blocco{margin:1.2rem 0 0}
.foto-blocco img{width:100%;max-width:520px}
.foto-blocco figcaption{margin-top:.4rem;font-size:.85rem;color:var(--color-muto)}
.lettera{display:grid;grid-template-columns:1fr;border-bottom:1px solid var(--color-grid)}
.lettera__foto{width:100%;height:100%;object-fit:cover}
.lettera__corpo{padding:1.5rem var(--section-x);background:var(--color-tenue);line-height:1.55}
.lettera__corpo p+p{margin-top:.8rem}
.lettera__oggetto{font-weight:700;border-bottom:1px solid var(--color-grid);padding-bottom:.6rem}
@media (min-width:1024px){.da-casa,.lettera{grid-template-columns:1fr 1fr}.da-casa__testo,.lettera__corpo{padding:2.5rem 2.5rem}}
.dopo-ia{border-top:0}
.cella-esempio dd{font-family:var(--font-body)}
.da-casa__testo ul li{list-style:disc}

/* pronti per sabato */
.pronti{padding:2rem var(--section-x) 2.5rem;border-bottom:1px solid var(--color-grid)}
.pronti__intro{color:var(--color-muto)}
.pronti__lista{margin:1rem 0 0;padding:0;list-style:none;max-width:640px}
.pronti__lista li{border-top:1px solid var(--color-grid)}
.pronti__lista label{display:flex;gap:.8rem;align-items:center;padding:.8rem 0;cursor:pointer}
.pronti__lista input{width:1.2rem;height:1.2rem;accent-color:var(--color-primary-accent)}
.pronti__lista input:checked+span{color:var(--color-muto);text-decoration:line-through}
.pronti__stato{margin-top:1rem;font-weight:600;text-transform:uppercase;font-size:.9rem}
