/* ══════════ stile.css — Partita IVA in Ordine · preset dr-welsh ══════════
   Struttura di Welsh (titolo serif con parole in colore, stelle ripetute, moduli numerati con l'interfaccia,
   fondo scuro per la citazione e la chiusura), look da carta e conto: avorio, verde conto, arancio timbro. */
:root {
  --fondo: #F5F0E6; --carta: #FFFDF8; --testo: #1C1A17; --tenue: #5b5650;
  --verde: #0F3B2E; --verde-2: #174d3d; --accento: #E4572E; --ris: #2E9E6A; --oro: #F6D658;
  --evid: rgba(246, 214, 88, .8); --mano-colore: #E4572E;
  --corpo: 18.5px; --riga: 1.55;
  --font-titolo: "Fraunces", Georgia, serif; --font-corpo: "DM Sans", system-ui, sans-serif; --font-mano: "Caveat", cursive;
  --gutter: 22px; --misura: 36rem;
  --bottone-fondo: var(--accento); --bottone-testo: #fff; --raggio: 999px;
  --ombra: 0 1px 0 rgba(28,26,23,.06), 0 18px 40px -18px rgba(28,26,23,.28);
}
body { background: var(--fondo) radial-gradient(circle at 20% 0%, #fbf7ef 0, transparent 50%) no-repeat; }
.prezzo { white-space: nowrap; }
s { text-decoration-thickness: 2px; text-decoration-color: var(--accento); }

/* testata */
.testata { display: flex; justify-content: space-between; align-items: center; padding: 14px var(--gutter); max-width: 1180px; margin: 0 auto; }
.marchio { display: block; line-height: 0; }
.marchio img { height: 40px; width: auto; }
.marchio i { color: var(--accento); font-style: italic; font-weight: 600; }
.testata-link { font: 700 .95rem/1 var(--font-corpo); text-decoration: none; padding: .55em 1em; border: 1.5px solid var(--testo); border-radius: 999px; }

main > section { background-color: var(--fondo); padding: 76px var(--gutter); max-width: 1180px; margin: 0 auto; position: relative; }
.titolo { font: 800 clamp(2rem, 8.6vw, 3.4rem)/1.06 var(--font-titolo); letter-spacing: -.02em; text-align: center; max-width: 20ch; margin: 0 auto .5em; }
.testo { max-width: var(--misura); margin: 0 auto 1em; text-align: center; }
.testo.grande { font-size: 1.22rem; line-height: 1.5; }
.chiusa { max-width: var(--misura); margin: 1.6em auto 0; text-align: center; font-size: 1.15rem; }
.occhiello { display: table; margin: 0 auto 1em; font: 600 1.18rem/1.3 var(--font-corpo); color: var(--tenue); }
.gigante { text-align: center; max-width: 16ch; margin: 0 auto .5em; font-weight: 800; }
.ris { color: var(--ris); }
.nota { font-weight: 700; }
.lucchetto { font: 700 .95rem/1 var(--font-corpo); color: var(--verde); background: #e4ece6; padding: .35em .7em; border-radius: 8px; white-space: nowrap; }
.chiuso { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 16px; padding: 14px 16px; border: 1.5px dashed rgba(15,59,46,.35); border-radius: 14px; font-size: 1.05rem; }

/* bottone */
.bottone { box-shadow: 0 10px 24px -10px rgba(228,87,46,.75); transition: transform .2s; font-size: 1.1rem; }
.bottone:hover { transform: translateY(-2px); }

/* ═════ APERTURA ═════ */
#apertura { padding-top: 26px; padding-bottom: 40px; display: grid; gap: 34px; }
.ap-testo { text-align: center; }
.headline { margin: 0 auto 20px; font-family: var(--font-titolo); color: var(--testo); }
.headline > span { display: block; white-space: nowrap; }
.hl-1 { font: 600 1.3rem/1.2 var(--font-corpo); letter-spacing: .01em; color: var(--tenue); }
.hl-chiave { font: italic 900 clamp(3rem, 15vw, 5.4rem)/.95 var(--font-titolo); color: var(--accento); letter-spacing: -.035em; margin: .02em 0 .12em; }
.hl-2 { font: 800 clamp(1.8rem, 7.9vw, 3.4rem)/1.1 var(--font-titolo); letter-spacing: -.02em; margin-bottom: .32em; }
.hl-1b { margin-bottom: .05em; }
.hl-3 { font: 900 clamp(2.3rem, 10.6vw, 4.2rem)/1.05 var(--font-titolo); letter-spacing: -.03em; color: var(--verde); }
.hl-cerchio { position: relative; display: inline-block; color: var(--verde); padding: 0 .14em; }
.hl-cerchio svg { position: absolute; left: -12%; top: -34%; width: 124%; max-width: none; height: 168%; overflow: visible; pointer-events: none; }
.hl-cerchio path { fill: none; stroke: var(--accento); stroke-width: 3; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; animation: disegna 1.1s .7s cubic-bezier(.6,.1,.2,1) forwards; }
@keyframes disegna { to { stroke-dashoffset: 0; } }
.hl-evid { background: linear-gradient(var(--evid), var(--evid)) no-repeat 0 90% / 0% .42em; -webkit-box-decoration-break: clone; box-decoration-break: clone; animation: stendi 1s 1.2s cubic-bezier(.6,.1,.2,1) forwards; padding: 0 .06em; }
@keyframes stendi { to { background-size: 100% .42em; } }
.ap-sub { font-size: 1.2rem; line-height: 1.45; max-width: 25em; margin: 0 auto 22px; }
.ap-sub strong { color: var(--verde); }
#apertura .rischio { font-size: 1.12rem; }
.rischio s { margin-right: .2em; }
.rischio { font-size: 1.05rem; }
.calc-pie, .anno-leg, .ui-testa, .f24-testa, .cas-testa, .gr-et, .stelle-testo { font-size: 1.05rem !important; }
.rischio .prezzo { color: var(--testo); font-size: 1.15em; }
.stelle-riga { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 10px; margin-top: 18px; }
.stelle { color: #f2b01e; font-size: 1.35rem; letter-spacing: 2px; }
.facce { display: flex; }
.facce i, .facce img, .faccia { --c: #999; width: 32px; height: 32px; border-radius: 50%; background: var(--c); color: #fff; font: 700 .9rem/32px var(--font-corpo); text-align: center; font-style: normal; border: 2px solid var(--fondo); margin-left: -8px; }
.facce i:first-child, .facce img:first-child { margin-left: 0; }
.stelle-testo { font-size: 1rem; color: var(--tenue); width: 100%; }

.ap-scena { position: relative; min-height: 400px; padding: 0; }
.libro { position: relative; width: 196px; height: 268px; transform: perspective(900px) rotateY(-22deg) rotateX(4deg); transform-style: preserve-3d; animation: galleggia 6s ease-in-out infinite; }
@keyframes galleggia { 50% { transform: perspective(900px) rotateY(-16deg) rotateX(2deg) translateY(-6px); } }
.libro-copertina { position: absolute; inset: 0; border-radius: 4px 10px 10px 4px; background: linear-gradient(135deg, #14523f, var(--verde) 60%, #0a2a20); color: #f5efe2; padding: 22px 18px; display: flex; flex-direction: column; gap: 12px; box-shadow: 18px 24px 40px -14px rgba(10,30,22,.55); overflow: hidden; }
.libro-copertina::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: linear-gradient(90deg, rgba(0,0,0,.35), transparent); }
.libro-sopra { font: 700 .62rem/1.2 var(--font-corpo); letter-spacing: .14em; text-transform: uppercase; color: var(--oro); }
.libro-titolo { font: 900 2.05rem/.98 var(--font-titolo); letter-spacing: -.02em; }
.libro-titolo i { color: #ff8a62; font-weight: 600; }
.libro-usp { margin-top: auto; font: 500 .82rem/1.3 var(--font-corpo); color: #d8e3dc; border-top: 1px solid rgba(255,255,255,.25); padding-top: 10px; }
.libro-dorso { position: absolute; top: 3px; bottom: 3px; right: -14px; width: 14px; background: repeating-linear-gradient(#fff 0 2px, #e8e2d6 2px 3px); transform: rotateY(90deg); transform-origin: left; }
.ap-scena .libro { position: absolute; left: 4%; top: 0; width: 176px; height: 240px; }
.ap-scena .libro-titolo { font-size: 1.8rem; }

.fattura { position: relative; z-index: 2; width: min(268px, 74vw); margin: 150px 0 0 auto; background: var(--carta); border-radius: 14px; padding: 16px 16px 14px; box-shadow: var(--ombra); transform: rotate(2.5deg); border: 1px solid rgba(28,26,23,.08); }
.fattura::before { content: ""; position: absolute; left: 0; right: 0; top: -7px; height: 8px; background: radial-gradient(circle at 6px 8px, transparent 5px, var(--carta) 5.5px) 0 0 / 12px 8px repeat-x; }
.fat-testa { display: flex; justify-content: space-between; font-size: 1.04rem; color: var(--tenue); }
.fat-stato { color: var(--ris); font-weight: 700; }
.fat-cifra { font: 800 2.1rem/1.1 var(--font-titolo); margin: 6px 0 10px; letter-spacing: -.02em; }
.fat-barra { display: flex; height: 14px; border-radius: 99px; overflow: hidden; background: #ece6da; }
.fat-barra i { display: block; height: 100%; transform-origin: left; }
.fat-parte { width: 29%; background: var(--verde); }
.fat-tuo { width: 71%; background: var(--accento); }
.fat-righe { margin-top: 10px; display: grid; gap: 4px; }
.fat-r { display: flex; justify-content: space-between; gap: 8px; font-size: 1.06rem; line-height: 1.3; }
.fat-r::before { content: ""; width: 10px; height: 10px; border-radius: 3px; margin-top: .45em; flex: none; }
.fat-r span { flex: 1; }
.fat-r-parte::before { background: var(--verde); }
.fat-r-tuo::before { background: var(--accento); }
.fat-r-tuo b { color: var(--accento); font-size: 1.15em; }

.nastro { overflow: hidden; background: var(--verde); color: #f5efe2; padding: 14px 0; transform: rotate(-1.2deg); margin: 6px -10px 0; }
.nastro-giro { display: flex; width: max-content; animation: nastro 26s linear infinite; }
.nastro-giro span { font: 700 1.05rem/1 var(--font-corpo); padding: 0 22px; white-space: nowrap; }
.nastro-giro span::after { content: "✦"; color: var(--oro); margin-left: 44px; }
@keyframes nastro { to { transform: translateX(-50%); } }

/* ═════ PROBLEMA ═════ */
.barrato::after { height: .08em; }
.cascata { position: relative; max-width: 420px; margin: 34px auto 0; background: var(--carta); border-radius: 18px; padding: 20px 20px 18px; box-shadow: var(--ombra); }
.cas-testa { font-size: 1.05rem; color: var(--tenue); margin-bottom: 10px; }
.cas-riga { position: relative; display: flex; justify-content: space-between; align-items: baseline; padding: 11px 0; border-bottom: 1px dashed rgba(28,26,23,.18); font-size: 1.05rem; }
.cas-riga b { font: 800 1.25rem/1 var(--font-titolo); }
.cas-b { position: absolute; left: 0; bottom: -1px; height: 3px; width: var(--w); background: var(--accento); transform: scaleX(0); transform-origin: left; transition: transform 1s cubic-bezier(.6,.1,.2,1) .3s; }
.cascata.acceso .cas-b { transform: scaleX(1); }
.cas-pensavi { color: var(--tenue); }
.cas-tot { border: 0; padding-top: 16px; }
.cas-tot span { font-weight: 700; }
.cas-tot b { font-size: 2.2rem; color: var(--accento); }
.cas-nota { position: absolute; right: 10px; bottom: -34px; font-size: 1.8rem; }
.tablet { max-width: 420px; margin: 64px auto 0; background: #1d1d1f; border-radius: 26px; padding: 12px; box-shadow: var(--ombra); }
.foto { position: relative; border-radius: 16px; overflow: hidden; background: #cdbfa8; }
.foto-cucina { aspect-ratio: 4 / 3; background: linear-gradient(160deg, #e9dcc6 0%, #cdb797 45%, #8f7a5f 100%); }
.foto-cucina::before { content: ""; position: absolute; left: 18%; right: 18%; bottom: 12%; height: 42%; border-radius: 10px 10px 4px 4px; background: linear-gradient(#2a2a2c, #3b3b3e); box-shadow: 0 10px 20px rgba(0,0,0,.25); }
.foto-cucina::after { content: ""; position: absolute; left: 24%; right: 24%; bottom: 20%; height: 28%; border-radius: 6px; background: linear-gradient(90deg, #f6f1e8 0 60%, #cfe5d8 60%); opacity: .9; }
.foto-etichetta { position: absolute; left: 10px; top: 10px; z-index: 2; font: 600 .78rem/1.2 var(--font-corpo); background: rgba(255,253,248,.9); color: var(--tenue); padding: .4em .7em; border-radius: 99px; }

/* ═════ BIG IDEA ═════ */
#bigidea { padding-top: 90px; }
#bigidea .gigante { font-size: clamp(2.4rem, 10.5vw, 5rem); }
.grafico { position: relative; max-width: 560px; margin: 34px auto 0; padding: 20px 18px 16px; background: var(--carta); border-radius: 18px; box-shadow: var(--ombra); }
.gr-et { font-size: 1.02rem; color: var(--tenue); margin-bottom: 6px; }
.gr-et-verde { color: var(--verde); margin-top: 18px; }
.gr-barre { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; align-items: end; height: 120px; }
.gr-stipendio { height: 64px; }
.gr-barre i { display: block; border-radius: 5px 5px 2px 2px; background: #d7cdbd; height: var(--h); transform: scaleY(0); transform-origin: bottom; transition: transform .8s cubic-bezier(.3,.9,.3,1); transition-delay: calc(var(--i) * 45ms); }
.gr-stipendio i { background: var(--ris); }
.grafico.acceso .gr-barre i { transform: scaleY(1); }
.gr-incassi i.zero { height: 4px; background: var(--accento); }
.gr-mesi { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; text-align: center; font-size: .82rem; color: var(--tenue); margin-top: 6px; }
.gr-nota { position: absolute; right: 14px; top: 12px; font-size: 1.45rem; }

/* ═════ NEMICO · calcolatore ═════ */
#nemico { background: var(--verde); color: #f5efe2; max-width: none; border-radius: 30px 30px 0 0; }
#nemico > * { max-width: 560px; margin-left: auto; margin-right: auto; }
#nemico .titolo { max-width: 14ch; }
#nemico .ris, #nemico .testo strong { color: var(--oro); }
.calc { background: var(--carta); color: var(--testo); border-radius: 22px; padding: 22px 18px; margin-top: 28px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.calc-dom { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 6px; font-weight: 700; font-size: 1.08rem; }
.calc-fatt { font: 800 1.6rem/1 var(--font-titolo); color: var(--accento); }
.calc input[type=range] { width: 100%; margin: 16px 0 14px; accent-color: var(--accento); height: 30px; }
.calc-aliq { display: grid; grid-template-columns: 1.5fr 1fr; gap: 8px; }
.calc-aliq button { min-height: 46px; border-radius: 12px; border: 1.5px solid rgba(28,26,23,.2); background: transparent; font-weight: 700; font-size: 1rem; cursor: pointer; color: var(--testo); }
.calc-aliq button.attivo { background: var(--verde); color: #fff; border-color: var(--verde); }
.calc-righe { margin-top: 14px; }
.calc-righe p { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px dashed rgba(28,26,23,.18); font-size: 1.07rem; }
.calc-righe b { font: 800 1.2rem/1.2 var(--font-titolo); white-space: nowrap; }
.calc-giugno b { color: var(--accento); }
.calc-ris { text-align: center; padding: 18px 0 4px; }
.calc-ris > span { display: block; font-size: 1.05rem; color: var(--tenue); }
.calc-ris b { display: block; font: 900 3.6rem/1 var(--font-titolo); color: var(--ris); letter-spacing: -.03em; white-space: nowrap; }
.calc-pie { font-size: .98rem; color: var(--tenue); margin-top: 12px; line-height: 1.4; }
#nemico .chiusa { color: #f5efe2; }

/* ═════ MECCANISMO ═════ */
#meccanismo { background: var(--verde); color: #f5efe2; max-width: none; border-radius: 0 0 30px 30px; padding-top: 30px; }
#meccanismo > * { max-width: 600px; margin-left: auto; margin-right: auto; }
#meccanismo strong, #meccanismo .ris { color: var(--oro); }
.anno { position: relative; background: var(--verde-2); border: 1px solid rgba(255,255,255,.14); border-radius: 22px; padding: 22px 16px 18px; margin-top: 26px; }
.anno-griglia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.anno-griglia span { position: relative; display: grid; place-items: center; height: 58px; border-radius: 12px; background: rgba(255,255,255,.06); font: 700 1.05rem/1 var(--font-corpo); text-transform: uppercase; letter-spacing: .04em; }
.anno-griglia .tacca::after { content: "✓"; position: absolute; right: 5px; top: 4px; width: 20px; height: 20px; border-radius: 50%; background: var(--ris); color: #fff; font-size: .75rem; line-height: 20px; text-align: center; transform: scale(0); transition: transform .4s cubic-bezier(.3,1.6,.5,1); transition-delay: calc(var(--i, 0) * 220ms); }
.anno.acceso .tacca::after { transform: scale(1); }
.anno-griglia .f24 { outline: 2.5px solid var(--accento); outline-offset: 2px; background: rgba(228,87,46,.18); }
.anno-leg { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 14px; font-size: .98rem; }
.anno-leg span::before { content: ""; display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; }
.leg-tacca::before { background: var(--ris); }
.leg-f24::before { border: 2px solid var(--accento); border-radius: 3px !important; }
.anno-nota { position: absolute; right: 14px; top: -22px; font-size: 1.6rem; color: var(--oro); }
#meccanismo .chiuso { border-color: rgba(255,255,255,.3); }
#meccanismo .lucchetto { background: rgba(255,255,255,.12); color: #fff; }

/* ═════ BENEFICI · i moduli di Welsh ═════ */
#benefici { padding-top: 96px; }
.modulo { max-width: 600px; margin: 64px auto 0; }
.mod-n { font: 900 4.4rem/.9 var(--font-titolo); color: transparent; -webkit-text-stroke: 1.5px var(--testo); letter-spacing: -.03em; }
.mod-et { font: 700 1.05rem/1.3 var(--font-corpo); text-transform: uppercase; letter-spacing: .08em; color: var(--accento); margin: 10px 0 6px; }
.mod-tit { font: 800 1.75rem/1.12 var(--font-titolo); letter-spacing: -.015em; margin-bottom: 10px; }
.emo { font-size: .9em; margin-right: .1em; }
.mod-txt { margin-bottom: 18px; }
.ui { background: var(--carta); border-radius: 18px; padding: 18px; box-shadow: var(--ombra); border: 1px solid rgba(28,26,23,.06); position: relative; }
.ui-testa, .f24-testa { font-size: .98rem; color: var(--tenue); padding-bottom: 8px; border-bottom: 1px solid rgba(28,26,23,.1); margin-bottom: 4px; }
.ui-r { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; font-size: 1.07rem; }
.ui-r b { font: 800 1.2rem/1 var(--font-titolo); }
.ui-chiusa { border-top: 1px dashed rgba(28,26,23,.2); margin-top: 4px; padding-top: 12px; }
.ui-chiusa b.lucchetto { font: 700 .95rem/1 var(--font-corpo); }
.leve-cifre { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.leve-cifre .barrato { font: 800 2.6rem/1 var(--font-titolo); color: var(--tenue); }
.leve-cifre b { font: 900 3.8rem/1 var(--font-titolo); color: var(--ris); }
.leve-cifre .nota { font-size: 1.6rem; }
.leve-chiuse { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.leve-chiuse span { padding: 10px 12px; border-radius: 10px; background: #efe9dd; font-weight: 700; font-size: .98rem; color: var(--tenue); }
.ui-notifica { background: linear-gradient(160deg, #233a31, #10251d); display: grid; gap: 10px; padding: 22px 14px; }
.notifica { display: flex; gap: 12px; align-items: center; background: rgba(255,255,255,.93); border-radius: 16px; padding: 12px 14px; }
.notifica p { flex: 1; display: grid; font-size: 1.05rem; line-height: 1.3; }
.notifica p span { color: var(--tenue); }
.notifica time { font-size: .85rem; color: var(--tenue); align-self: flex-start; }
.not-ico { width: 38px; height: 38px; flex: none; border-radius: 10px; background: var(--ris); color: #fff; display: grid; place-items: center; font-weight: 800; }
.notifica-vecchia { opacity: .55; transform: scale(.96); }
.ui-check { display: grid; gap: 2px; }
.ui-check p { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px dashed rgba(28,26,23,.15); font-size: 1.05rem; }
.ui-check p:last-child { border: 0; }
.ui-check i { width: 24px; height: 24px; border: 2px solid var(--verde); border-radius: 6px; flex: none; position: relative; }
.ui-check i::after { content: ""; position: absolute; left: 6px; top: 1px; width: 7px; height: 13px; border: solid var(--ris); border-width: 0 3px 3px 0; transform: rotate(45deg) scale(0); transition: transform .35s cubic-bezier(.3,1.6,.5,1); transition-delay: calc(var(--i, 0) * 260ms); }
.ui-check.acceso i::after { transform: rotate(45deg) scale(1); }
.ui-check span { flex: 1; }
.ui-check b { opacity: .7; }
.ui-f24 { overflow: hidden; }
.timbro { position: absolute; right: 14px; bottom: 16px; font: 900 1.05rem/1 var(--font-corpo); letter-spacing: .1em; text-transform: uppercase; color: var(--ris); border: 3px solid var(--ris); padding: .45em .7em; border-radius: 8px; transform: rotate(-12deg) scale(1.6); opacity: 0; transition: transform .45s cubic-bezier(.3,1.5,.5,1), opacity .3s; background: rgba(255,253,248,.85); }
.ui-f24.acceso .timbro { transform: rotate(-12deg) scale(1); opacity: 1; }
.ui-f24 .ui-r:last-of-type { margin-bottom: 44px; }
.stelle-sep { margin-top: 70px; }
.stelle-sep .stelle-testo { font: italic 600 1.4rem/1.3 var(--font-titolo); color: var(--testo); }

/* ═════ SOGNO ═════ */
#sogno { max-width: none; padding: 0; }
.sogno-foto { border-radius: 0; height: 78vh; min-height: 460px; background: linear-gradient(180deg, #f3c9a0 0%, #e7a77c 30%, #7fa3b0 55%, #41697a 78%, #2e4a3f 100%); }
.sogno-foto::before { content: ""; position: absolute; left: -10%; right: -10%; top: 46%; height: 22%; background: radial-gradient(ellipse at 30% 100%, #2e4a3f 0 40%, transparent 41%), radial-gradient(ellipse at 75% 100%, #355a4b 0 45%, transparent 46%); }
.sogno-foto::after { content: ""; position: absolute; left: 50%; top: 24%; width: 70px; height: 70px; margin-left: -35px; border-radius: 50%; background: #ffe4b8; box-shadow: 0 0 60px 20px rgba(255,228,184,.5); }
.sogno-pannello { position: relative; z-index: 2; margin: -150px var(--gutter) 0; padding: 30px 22px 26px; background: var(--carta); border-radius: 22px; box-shadow: var(--ombra); max-width: 640px; }
@media (min-width: 700px) { .sogno-pannello { margin: -180px auto 0; } }
.sogno-pannello .gigante { font-size: clamp(2.2rem, 9.6vw, 4rem); }
.sogno-pannello .testo { margin-bottom: 0; }

/* ═════ PRODOTTO · la citazione su fondo scuro ═════ */
#prodotto { margin-top: 70px; background: var(--verde); color: #f5efe2; max-width: none; border-radius: 30px; }
#prodotto > * { max-width: 640px; margin-left: auto; margin-right: auto; }
#prodotto strong { color: var(--oro); }
.prod-scena { display: grid; justify-items: center; gap: 30px; margin-top: 34px; }
.libro-grande { width: 210px; height: 288px; }
.libro-grande .libro-copertina { background: linear-gradient(135deg, #fffaf0, #efe5d1); color: var(--verde); }
.libro-grande .libro-sopra { color: var(--accento); }
.libro-grande .libro-titolo i { color: var(--accento); }
.libro-grande .libro-usp { color: var(--tenue); border-color: rgba(15,59,46,.2); }
.box-ricevi { width: 100%; background: var(--carta); color: var(--testo); border-radius: 18px; padding: 20px 18px; }
.box-tit { font: 800 1.35rem/1.2 var(--font-titolo); margin-bottom: 10px; }
.box-ricevi ul { list-style: none; padding: 0; display: grid; gap: 10px; }
.box-ricevi li { position: relative; padding-left: 34px; font-size: 1.05rem; }
.box-ricevi li::before { content: "✓"; position: absolute; left: 0; top: .1em; width: 24px; height: 24px; border-radius: 50%; background: var(--ris); color: #fff; text-align: center; line-height: 24px; font-size: .8rem; font-weight: 800; }
.programma { margin-top: 44px; }
.prog-tit { font: 800 1.5rem/1.2 var(--font-titolo); margin-bottom: 12px; text-align: center; }
.programma ol { list-style: none; padding: 0; }
.programma li { display: flex; gap: 14px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.programma li span { flex: none; width: 3.2em; font: 700 .95rem/1 var(--font-corpo); color: var(--oro); text-transform: uppercase; letter-spacing: .05em; }
.programma li b { font: 600 1.25rem/1.25 var(--font-titolo); }

/* ═════ BONUS ═════ */
.bonus { display: grid; justify-items: center; gap: 18px; max-width: 560px; margin: 44px auto 0; text-align: center; }
.cop { width: 190px; height: 258px; border-radius: 4px 10px 10px 4px; padding: 20px 16px; display: flex; flex-direction: column; gap: 10px; text-align: left; color: #fff; box-shadow: 14px 20px 34px -14px rgba(28,26,23,.5); transform: perspective(800px) rotateY(-14deg); position: relative; overflow: hidden; }
.cop::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 9px; background: linear-gradient(90deg, rgba(0,0,0,.3), transparent); }
.cop-n { font: 700 .66rem/1 var(--font-corpo); letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
.cop-t { font: 900 1.55rem/1.02 var(--font-titolo); letter-spacing: -.01em; }
.cop-u { margin-top: auto; font: 500 .8rem/1.3 var(--font-corpo); opacity: .9; border-top: 1px solid rgba(255,255,255,.35); padding-top: 8px; }
.cop-1 { background: linear-gradient(140deg, #e4572e, #b83c18); }
.cop-2 { background: linear-gradient(140deg, #2e9e6a, #17644a); }
.cop-3 { background: linear-gradient(140deg, #24384f, #121e2c); }
.bonus-txt h3 { font: 800 1.6rem/1.15 var(--font-titolo); margin-bottom: 6px; }
.bonus-prezzo { margin-top: 10px; font-size: 1.15rem; }
.bonus-prezzo s { color: var(--tenue); margin-right: 8px; }
.bonus-prezzo b { background: var(--ris); color: #fff; padding: .3em .8em; border-radius: 8px; letter-spacing: .08em; }

/* ═════ TESTIMONIANZE ═════ */
.voci { display: grid; gap: 16px; margin-top: 30px; }
.voci blockquote { background: var(--carta); border-radius: 18px; padding: 20px 18px 16px; box-shadow: var(--ombra); position: relative; }
.voci blockquote::before { content: "★★★★★"; display: block; color: #f2b01e; letter-spacing: 2px; margin-bottom: 8px; }
.voci blockquote p { font-size: 1.05rem; line-height: 1.5; }
.voci footer { display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 1rem; color: var(--tenue); }
.voci footer span { display: grid; line-height: 1.25; }
.voci footer b { color: var(--testo); }
.faccia { width: 46px; height: 46px; line-height: 46px; font-size: 1.1rem; margin: 0; flex: none; }
@media (min-width: 760px) { .voci { grid-template-columns: repeat(3, 1fr); } }

/* ═════ PREZZO ═════ */
#offerta { padding-top: 90px; }
.scontrino { position: relative; max-width: 440px; margin: 30px auto 0; background: var(--carta); border-radius: 6px; padding: 26px 22px 30px; box-shadow: var(--ombra); text-align: center; }
.scontrino::before, .scontrino::after { content: ""; position: absolute; left: 0; right: 0; height: 10px; background: radial-gradient(circle at 7px 0, transparent 6px, var(--carta) 6.5px) 0 0 / 14px 10px repeat-x; }
.scontrino::before { top: -9px; transform: scaleY(-1); }
.scontrino::after { bottom: -9px; }
.sc-r { display: flex; justify-content: space-between; gap: 10px; text-align: left; padding: 10px 0; border-bottom: 1px dashed rgba(28,26,23,.2); font-size: 1.07rem; }
.sc-r s, .sc-r b { white-space: nowrap; font-weight: 700; }
.sc-r b { color: var(--ris); }
.sc-tot { font-weight: 700; }
.sc-oggi { margin-top: 18px; font: 700 1rem/1 var(--font-corpo); text-transform: uppercase; letter-spacing: .14em; color: var(--tenue); }
.prezzo-gigante { font-size: clamp(4.6rem, 26vw, 7rem); color: var(--accento); margin: 4px auto 0; }
.sc-confronto .nota { font-size: 1.5rem; }
.copie { display: flex; justify-content: center; gap: 6px; margin: 22px 0 8px; }
.copie i { width: 22px; height: 30px; border-radius: 3px; background: #d8d0c2; position: relative; }
.copie i:not(.libera)::after { content: ""; position: absolute; left: -3px; right: -3px; top: 50%; height: 2.5px; background: var(--accento); transform: rotate(-35deg); }
.copie i.libera { background: var(--ris); box-shadow: 0 0 0 3px rgba(46,158,106,.3); animation: pulsa 1.6s ease-in-out infinite; }
@keyframes pulsa { 50% { box-shadow: 0 0 0 7px rgba(46,158,106,.12); } }
.copie-testo { font-size: 1.05rem; margin-bottom: 18px; }
.copie-testo b { color: var(--accento); }
.scontrino .bottone { width: 100%; }

/* ═════ GARANZIA ═════ */
#garanzia { text-align: center; }
.timbro-tondo { width: 170px; margin: 0 auto 18px; color: var(--ris); transform: rotate(-10deg); }
.timbro-tondo text { fill: currentColor; font-family: var(--font-corpo); font-weight: 700; }
.timbro-tondo .anello { transform-box: view-box; transform-origin: 100px 100px; animation: gira 30s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }

/* ═════ DOMANDE ═════ */
#domande { max-width: 680px; }
#domande .titolo { margin-bottom: 20px; }
summary { font-size: 1.12rem; }
details > p { font-size: 1.05rem; color: var(--tenue); }

/* ═════ CONGEDO · la chiusura scura di Welsh ═════ */
#congedo { background: var(--verde); color: #f5efe2; max-width: none; text-align: center; padding-bottom: 120px; border-radius: 30px 30px 0 0; }
#congedo .gigante { font-size: clamp(2.4rem, 10.5vw, 4.8rem); }
#congedo .ris { color: var(--oro); }
.movimento { margin-top: 18px; font-size: 1.05rem; color: #cfe0d6; }
.movimento i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #5fd39b; margin-right: 8px; animation: pulsa 1.6s infinite; }
.piede { margin-top: 70px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.15); max-width: 640px; margin-left: auto; margin-right: auto; }
.piede p { font-size: 16.5px; line-height: 1.5; color: #b9c9bf; margin-bottom: 10px; }

[data-barra-acquisto] { background: var(--carta); box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.barra-prezzo s { color: var(--tenue); margin-right: 4px; }
.barra-prezzo b { font: 800 1.35rem/1 var(--font-titolo); }

/* ═════ COMPUTER ═════ */
@media (min-width: 900px) {
  #apertura { grid-template-columns: 1.05fr .95fr; align-items: center; padding-top: 40px; min-height: 86vh; }
  .ap-testo { text-align: left; }
  .headline { margin-left: 0; max-width: 11.5em; }
  .hl-1 { font-size: 1.7rem; }
  .hl-chiave { font-size: 5rem; }
  .hl-2, .hl-3 { font-size: 3.5rem; }
  .ap-sub { margin-left: 0; }
  .stelle-riga { justify-content: flex-start; }
  .stelle-testo { width: auto; }
  .ap-scena { min-height: 520px; }
  .libro { width: 250px; height: 340px; }
  .marchio img { height: 48px; }
  .modulo { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; max-width: 980px; }
  .modulo > .ui { grid-column: 2; grid-row: 1 / span 4; align-self: center; }
  .prod-scena { grid-template-columns: auto 1fr; align-items: center; }
  #prodotto > * { max-width: 860px; }
  .bonus { grid-template-columns: auto 1fr; text-align: left; justify-items: start; align-items: center; max-width: 760px; gap: 36px; }
}

@media (prefers-reduced-motion: reduce) {
  .hl-cerchio path { stroke-dashoffset: 0; }
  .hl-evid { background-size: 100% .5em; }
  .gr-barre i, .cas-b { transform: none; }
  .tacca::after, .ui-check i::after { transform: none; }
  .ui-f24 .timbro { opacity: 1; transform: rotate(-12deg); }
}

/* mockup veri della guida e dei bonus: in pagina senza cornici, proporzioni originali */
.mockup { display: block; width: 100%; height: auto; max-width: 100%; }
.mockup-ap { position: relative; z-index: 1; animation: fluttua 6s ease-in-out infinite; filter: drop-shadow(0 26px 30px rgba(10,30,22,.28)); }
.ap-scena .fattura { margin-top: -70px; }
.mockup-bundle { max-width: 560px; margin: 0 auto; filter: drop-shadow(0 22px 28px rgba(10,30,22,.25)); }
.mockup-bonus { width: min(100%, 460px); filter: drop-shadow(0 18px 24px rgba(10,30,22,.25)); }
.mockup-offerta { width: min(100%, 520px); margin: 26px auto 6px; filter: drop-shadow(0 18px 24px rgba(10,30,22,.22)); }
@keyframes fluttua { 50% { transform: translateY(-8px); } }
.ap-scena { min-height: 0; }
@media (min-width: 900px) {
  .ap-scena { min-height: 0; }
  .mockup-ap { width: 100%; margin-left: 0; }
  .ap-scena .fattura { margin: -120px 0 0 auto; width: 300px; }
  .mockup-bundle { max-width: 440px; }
  .bonus { grid-template-columns: 400px 1fr; }
  .mockup-bonus { width: 100%; }
}

/* foto e film generati */
img.faccia, .facce img { object-fit: cover; background: #ddd; }
.foto-img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.scena-foto { margin: 44px auto 0; max-width: 760px; }
.scena-foto img { display: block; width: 100%; height: auto; border-radius: 22px; box-shadow: var(--ombra); }
.congedo-foto { margin: 34px auto 30px; max-width: 640px; }
.congedo-foto img { box-shadow: 0 20px 40px -18px rgba(0,0,0,.6); }
.sogno-foto { position: relative; overflow: hidden; background: #e7a77c; }
.sogno-foto::before, .sogno-foto::after { content: none; }
.sogno-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sogno-o { display: none; object-position: 30% 40%; }
.sogno-v { object-position: 50% 30%; }
@media (min-width: 700px) { .sogno-o { display: block; } .sogno-v { display: none; } }
html { overflow-x: clip; }