/* Solo questa landing. Base comune in stile.css e comune.css */

.brand__word b{font-weight:600;color:var(--orange)}

/* sigillo della garanzia */
.sigillo{flex:none;width:112px;height:112px;filter:drop-shadow(0 18px 30px rgba(194,98,42,.35))}
.sigillo__giro{transform-origin:60px 60px;animation:giro 28s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.sigillo__giro{animation:none}}

/* prezzo nella prima schermata */
.hero__cta{align-items:center;gap:clamp(18px,3vw,36px)}
.hero__sub b{color:var(--ink);font-weight:600}
.prezzo{display:flex;flex-direction:column;gap:4px}
.prezzo__riga{display:flex;align-items:baseline;gap:12px;margin:0;font-family:"Inter Tight",sans-serif}
.prezzo__riga s{font-size:22px;font-weight:500;color:var(--muted);text-decoration-thickness:2px;text-decoration-color:var(--orange)}
.prezzo__riga strong{font-size:clamp(44px,5vw,64px);font-weight:600;letter-spacing:-.045em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.prezzo__riga span{font-size:15px;font-weight:500;color:var(--ink-2)}
.prezzo__nota{margin:0;font-size:14px;color:var(--muted)}

/* i tre vantaggi e la garanzia */
.vant{padding:0 0 clamp(64px,8vw,110px)}
.vant__griglia{display:grid;grid-template-columns:repeat(3,1fr) 1.25fr;gap:14px;list-style:none;margin:0;padding:0}
.vant__voce{display:flex;flex-direction:column;gap:10px;padding:26px 24px;border-radius:var(--r-l);background:#fff;border:1px solid var(--line-soft);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.vant__voce:hover{transform:translateY(-4px);box-shadow:0 30px 60px -36px rgba(20,22,15,.35)}
.vant__voce svg:not(.sigillo){width:30px;height:30px;stroke:var(--orange);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.vant__voce h3{font-family:"Inter Tight",sans-serif;font-size:clamp(19px,1.6vw,22px);font-weight:600;letter-spacing:-.03em;line-height:1.2;margin:0}
.vant__voce p{font-size:15px;line-height:1.5;color:var(--muted);margin:0}
.vant__voce--garanzia{flex-direction:row;align-items:center;gap:20px;background:var(--black);border-color:transparent;color:#fff}
.vant__voce--garanzia p{color:rgba(255,255,255,.66)}
.vant__voce--garanzia .sigillo{width:96px;height:96px}
@media (max-width:1080px){.vant__griglia{grid-template-columns:repeat(3,1fr)}.vant__voce--garanzia{grid-column:1/-1}}
@media (max-width:720px){.vant__griglia{grid-template-columns:1fr}.vant__voce{padding:22px}}

/* template contro su misura, impaginato come easysitesitaly: fondo scuro, un riquadro diviso in due */
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/instrument-serif-italic.woff2') format('woff2')}
.tpl-sez{background:var(--black);color:#fff}
.tpl-sez .sec-title em{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.confronto{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.14);border-radius:var(--r-m)}
.confronto__lato{display:flex;flex-direction:column;padding:clamp(28px,3vw,44px)}
.confronto__lato+.confronto__lato{border-left:1px solid rgba(255,255,255,.14)}
.confronto__lato h3{margin:36px 0 0;font-family:"Inter Tight",sans-serif;font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:-.03em;line-height:1.2;color:#fff}
.confronto__lato p{margin:14px 0 0;font-size:15.5px;line-height:1.65;color:rgba(255,255,255,.62)}
/* tre stampi identici: il template è uguale per tutti */
.stampi{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.2vw,16px);height:170px;align-items:center}
.stampo{display:flex;flex-direction:column;gap:7px;height:120px;padding:14px 12px;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:rgba(255,255,255,.04)}
.stampo i{display:block;height:3px;border-radius:2px;background:rgba(255,255,255,.22)}
.stampo i+i{width:58%}
.stampo b{display:block;flex:1;margin-top:4px;border-radius:2px;background:rgba(255,255,255,.12)}
.stampo span{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.stampo u{display:block;height:16px;border-radius:2px;background:rgba(255,255,255,.12)}
/* tre carte diverse e storte: il tuo sito nasce dalla tua attività */
.carte{position:relative;height:170px}
.carta{position:absolute;top:50%;display:flex;flex-direction:column;justify-content:space-between;width:clamp(120px,12vw,168px);aspect-ratio:1.3;padding:14px 16px;border-radius:3px;box-shadow:0 24px 40px -22px rgba(0,0,0,.7);transition:transform .6s var(--ease)}
.carta--aa{left:4%;background:#DCE0CF;color:#2B3324;transform:translateY(-52%) rotate(-5deg)}
.carta--aa span{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-size:clamp(40px,4vw,56px);line-height:.9}
.carta--aa i{position:absolute;right:16px;bottom:22px;width:26px;height:26px;border-radius:50%;background:#9AA486}
.carta--aa b{width:34%;height:3px;border-radius:2px;background:#4A5640}
.carta--storia{left:34%;background:#DCE5FA;color:#2E4FB8;transform:translateY(-48%) rotate(3deg)}
.carta--storia span{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-size:clamp(19px,1.7vw,24px);line-height:1.05}
.carta--storia i{position:absolute;right:14px;top:16px;width:34%;height:68%;border:1.5px solid #2E4FB8;border-bottom:0;border-radius:99px 99px 0 0;opacity:.6}
.carta--tuo{left:64%;background:var(--orange);color:#fff;transform:translateY(-50%) rotate(-3deg)}
.carta--tuo small{font-size:9px;font-weight:600;opacity:.75}
.carta--tuo span{font-family:"Inter Tight",sans-serif;font-size:clamp(19px,1.7vw,24px);font-weight:600;letter-spacing:-.03em;line-height:1.05}
.carta--tuo em{position:absolute;right:14px;bottom:10px;font-style:normal;font-size:20px}
.confronto__lato:hover .carta--aa{transform:translateY(-58%) rotate(-9deg) translateX(-8px)}
.confronto__lato:hover .carta--storia{transform:translateY(-52%) rotate(5deg)}
.confronto__lato:hover .carta--tuo{transform:translateY(-56%) rotate(-6deg) translateX(8px)}
@media (max-width:900px){.confronto{grid-template-columns:1fr}.confronto__lato+.confronto__lato{border-left:0;border-top:1px solid rgba(255,255,255,.14)}}
@media (max-width:480px){.stampi,.carte{height:130px}.stampo{height:96px}.carta{width:110px}}

/* perché costa poco */
.perche{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(36px,6vw,96px);align-items:start}
.perche__testa{position:sticky;top:120px}
.perche__testa .sec-title{text-align:left}
.perche__testa .sec-lead{margin-top:18px;text-align:left}
.perche__lista{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.perche__lista li{position:relative;padding:28px 28px 28px 88px;border-radius:var(--r-l);background:#fff;border:1px solid var(--line-soft)}
.perche__n{position:absolute;left:28px;top:28px;font-family:"Inter Tight",sans-serif;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--orange)}
.perche__lista h3{margin:0;font-family:"Inter Tight",sans-serif;font-size:clamp(20px,1.8vw,24px);font-weight:600;letter-spacing:-.03em;line-height:1.2}
.perche__lista p{margin:10px 0 0;color:var(--muted);line-height:1.55}
/* prima e oggi: il prezzo di riferimento accanto al nostro */
.prima-oggi{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px}
.prima-oggi__col{padding:20px 22px;border-radius:var(--r-m);background:var(--bg-soft)}
.prima-oggi__col b{display:block;font-family:"Inter Tight",sans-serif;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.prima-oggi__col ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px;font-size:15px;line-height:1.35}
.prima-oggi__col:not(.prima-oggi__col--oggi) li{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(194,98,42,.6)}
.prima-oggi__col--oggi{background:var(--black);color:#fff}
.prima-oggi__col--oggi b{color:var(--orange-2)}
@media (max-width:900px){.perche{grid-template-columns:1fr}.perche__testa{position:static}.perche__lista li{padding:24px 22px 24px 70px}.perche__n{left:22px;top:26px}}
@media (max-width:420px){.prima-oggi{grid-template-columns:1fr}}

/* il video delle recensioni */
.rec-video{max-width:1080px;margin:0 auto clamp(36px,5vw,60px);border-radius:var(--r-l);overflow:hidden;box-shadow:0 50px 90px -50px rgba(20,22,15,.55);background:var(--bg-soft);aspect-ratio:16/9}
.rec-video video{display:block;width:100%;height:100%;object-fit:cover}

/* come funziona in quattro passi */
.catena--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1080px){.catena--4{grid-template-columns:1fr 1fr}.catena--4 .anello::after{display:none}}
@media (max-width:720px){.catena--4{grid-template-columns:1fr}}

/* i tre vantaggi corti */
.vant__voce--corta{flex-direction:row;align-items:center;gap:16px}
.vant__voce--corta svg{flex:none}

.perche__chiusa{margin:30px 0 0;padding-top:20px;border-top:1px solid var(--line-soft);font-family:"Inter Tight",sans-serif;font-size:clamp(20px,1.9vw,26px);font-weight:600;letter-spacing:-.03em;line-height:1.25;color:var(--ink)}

/* il sito lavora quando tu non puoi */
.catena--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:1080px){.catena--3{grid-template-columns:1fr}.catena--3 .anello::after{display:none}}

/* due offerte */
.offerte .plan__price s{display:block;margin-bottom:6px;font-size:22px;font-weight:500;letter-spacing:0;color:rgba(255,255,255,.5);text-decoration-color:var(--orange-2);text-decoration-thickness:2px}
.offerte .plan h3{max-width:20ch}

/* lavori in una giostra orizzontale: scorre da sola, le frecce spostano di una scheda */
.giostra__testa{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(30px,4vw,48px)}
.giostra__testa .sec-title{text-align:left}
.giostra__frecce{display:flex;gap:10px;flex:none}
.giostra__f{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.giostra__f:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.giostra__f:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.giostra__f svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.giostra__pista{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);padding:6px var(--pad) 24px;scrollbar-width:none}
.giostra__pista::-webkit-scrollbar{display:none}
.giostra__pista:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.giostra__pista .work{flex:none;width:clamp(280px,30vw,420px);scroll-snap-align:start}
@media (max-width:720px){.giostra__testa{align-items:flex-start;flex-direction:column}.giostra__f{width:46px;height:46px}.giostra__pista .work{width:82vw}}

/* recensioni a tutta larghezza: il nastro le fa scorrere (js/nastro.js) */
#recensioni .nastro{margin-top:0}

/* garanzia su fondo scuro */
.garanzia__in{display:flex;align-items:center;gap:clamp(28px,5vw,72px)}
.garanzia .sec-title{text-align:left}
.garanzia .sec-lead{margin-top:18px;text-align:left}
.sigillo--grande{width:clamp(130px,16vw,200px);height:auto}
@media (max-width:720px){.garanzia__in{flex-direction:column;align-items:flex-start}}

/* dopo l'invio del modulo */
.ct-fatto{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:6px;padding:22px;border-radius:var(--r-m);background:var(--bg-soft)}
.ct-fatto p{margin:0;line-height:1.55}
.ct-fatto[hidden]{display:none}
.hero__sub p+p{margin-top:14px}