/* AcquaStream v2 — le parti aggiunte al pacchetto del 18/09.
   Caricato per ultimo: usa solo i token e i gesti già presenti (blu notte, ciano,
   card con filo di luce in alto, pill del catalogo), non ne introduce di nuovi. */

header>.button small:first-child,.floating-subscribe strong>small:first-child{font-weight:400}

/* ------------------------------------------------------------ la scheda del piano */
.price-card .price b{font-weight:inherit}

/* ------------------------------------------------------------ dove arriviamo */
.coverage{display:grid;grid-template-columns:minmax(0,760px);gap:7vw;align-items:start;background:radial-gradient(ellipse at 12% 20%,#1770882a,transparent 60%),#061722;border-top:1px solid #ace3f21f}
.coverage-head h2{font-size:clamp(2.5rem,4.3vw,4rem);line-height:1.05;letter-spacing:-.055em;margin:16px 0 0}
.coverage-head>p{color:#b8d0d8;font-size:1.0625rem;line-height:1.65;max-width:460px;margin:26px 0 10px}
.coverage-regions{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.coverage-region{border:1px solid #89d8ee40;border-radius:7px;background:linear-gradient(150deg,#102e3f,#081d29);padding:26px 24px;position:relative;overflow:hidden}
.coverage-region::before{content:"";position:absolute;left:15%;right:15%;top:0;height:1px;background:#d0f5ff;box-shadow:0 0 30px 3px #83e4ff66}
.coverage-region h3{display:flex;flex-direction:column;gap:6px;font-size:1.5rem;letter-spacing:-.03em;margin:0 0 14px}
.coverage-region h3 small{font-size:.75rem;letter-spacing:.14em;font-weight:700;color:var(--cyan);text-transform:uppercase}
.coverage-list{list-style:none;margin:0;padding:0}
.coverage-list li{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--line);font-size:1rem;color:#e3f3f7}
.coverage-list li:last-child{border-bottom:0}
.coverage-list .flow-icon{width:18px;height:18px;flex:0 0 18px;color:#9ee1f4}

/* ------------------------------------------------------------ modulo di contatto */
.coverage-result{margin:14px 0 0;padding:12px 14px;border-radius:6px;border:1px solid #7fd7ef55;background:#0b3444;font-size:.9375rem;line-height:1.55;color:#d9f5fd}
.coverage-result.is-outside{border-color:#a9c2cc40;background:#0a2533;color:#c9dce2}
.contact-trap{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.contact-card .contact-consent{display:flex;align-items:flex-start;gap:12px;margin:22px 0 0;font-size:.875rem;line-height:1.55;color:#d5e7ec;cursor:pointer}
.flow-experience .contact-card .contact-consent input,.contact-card .contact-consent input{flex:0 0 22px;width:22px;height:22px;min-height:0;margin:1px 0 0;padding:0;accent-color:#3bccf5;border-radius:4px}
.contact-consent a{color:#b1e7f6;text-decoration:underline;text-underline-offset:3px}
.contact-card .contact-consent[aria-invalid=true],.contact-card .contact-consent:has(input[aria-invalid=true]){color:#ffcec7}
.contact-send[disabled]{opacity:.72;cursor:progress;transform:none}
.contact-success{margin-top:22px;padding:24px;border:1px solid #7fd7ef75;border-radius:7px;background:linear-gradient(135deg,#133347,#092030);outline:none}
.contact-success h4{font-size:1.5rem;letter-spacing:-.03em;margin:14px 0 8px}
.contact-success p{margin:0;color:#c1d5df;line-height:1.6}
.contact-success-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#3bccf51f;border:1px solid #7fd7ef75;color:var(--cyan)}
.contact-success-mark .flow-icon{width:22px;height:22px}

/* ------------------------------------------------------------ footer */
.footer-bottom>span{line-height:1.6}

/* ------------------------------------------------------------ responsive */
@media (max-width:1100px){
 .coverage{grid-template-columns:1fr;gap:34px}
}
@media (max-width:760px){
 /* Difetto del pacchetto: streaming.css mette la Top 10 in overflow:visible per una
    griglia, catalogue.css la riporta in fila senza ridare lo scorrimento. La fila
    usciva dallo schermo (pagina larga 1679 px su 375) e il telefono la rimpiccioliva. */
 .streaming-home .ranking-rail{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory}
 .coverage-head h2{font-size:2.5rem}
 .coverage-head>p{font-size:1rem}
 .coverage-regions{grid-template-columns:1fr;gap:16px}
 .coverage-region{padding:22px 20px}
}

/* ------------------------------------------------------------ testata
   Il quinto link del menu non ci sta fra 761 e 1100 px: lì il pulsante del prezzo si
   riduceva a 30 px. Sotto i 760 il menu è a comparsa e il link torna visibile. */
@media (min-width:761px) and (max-width:1100px){
 #primary-nav a[href="#dove"]{display:none}
}
/* Difetto del pacchetto: sotto i 600 px il pulsante in testata conteneva prezzo e
   «Scopri la tua soluzione» in 118 px e ne mostrava metà. Resta il prezzo. */
@media (max-width:600px){
 .streaming-home header>.button .header-action{display:none}
}
@media (max-width:400px){
 /* Il prezzo non si taglia: cede spazio il marchio, che è un'immagine e si riduce bene. */
 .streaming-home header>.button{padding-inline:8px;gap:0;flex-shrink:0}
 header>.brand{flex:0 1 auto;min-width:0}
 header>.brand .brand-art{max-width:100%}
}

/* Rete di sicurezza: le frecce degli scaffali (larghe almeno 28 px anche quando il
   margine laterale è più stretto) sbordavano di qualche pixel a 768 px. clip, a
   differenza di hidden, non crea un contenitore di scorrimento: la scena fissata
   dello scroll-video continua a funzionare. */
body{overflow-x:clip}

/* Il modulo a meta pagina: stessa scheda del contatto, da sola e centrata.
   Serve a chi ha appena letto come funziona il servizio e non ha nessuna
   intenzione di scorrere fino in fondo per lasciare un numero. */
.contact-quick{background:radial-gradient(ellipse at 15% 0%,#12455680,transparent 60%),#061620;border-top:1px solid #ace3f21f;border-bottom:1px solid #ace3f21f}
.contact-quick .contact-card{max-width:760px;margin-inline:auto}
.contact-quick h3{font-size:clamp(1.75rem,3.4vw,2.35rem);line-height:1.1;margin:14px 0 10px}
.contact-quick .contact-card>p{color:var(--muted);font-size:1rem;margin-bottom:26px;max-width:58ch}
@media(max-width:760px){.contact-quick{padding:48px 5vw}.contact-quick h3{font-size:1.75rem}}

/* Su schermo stretto il richiamo in testata mostrava solo «da €29,90 / mese»:
   un cartellino del prezzo, non un'azione. Sotto i 760 px torna un verbo, e
   sotto i 420 il prezzo lascia il posto al verbo — tanto la barra in basso
   porta tutti e due. */
.header-action-short{display:none}
@media(max-width:760px){
  .streaming-home header>.button.small .header-action-short{display:inline;font-size:.8125rem;font-weight:700}
  .streaming-home header>.button.small{gap:8px}
}
@media(max-width:420px){
  .streaming-home header>.button.small>span:first-child{display:none}
}

/* ------------------------------------------------------------ la prova di 30 giorni
   Dal 07/10/2026 l'installazione la anticipa AcquaStream e tutti i 30 giorni di prova sono gratis:
   chi resta paga dal 31° giorno il mese che comincia più €120 una tantum. I 120 € stanno accanto al prezzo ovunque
   il prezzo è in evidenza: un costo obbligatorio detto solo in nota è un'omissione. */
.journey-offer>div:has(.journey-fee){flex-wrap:wrap;row-gap:0}
.journey-offer>div>.journey-fee{flex-basis:100%;margin-top:6px;font-size:.8125rem;line-height:1.4;color:#c4d9df}
/* La riga dei €120 allarga il blocco del prezzo fino alla misura della frase: accanto,
   «Disdici quando vuoi» restava isolato a metà schermo. Va sotto il prezzo, allineato. */
.journey-offer:has(.journey-fee){flex-direction:column;align-items:flex-start;row-gap:2px}
/* La prova è il titolo della prima scena. «Paghi solo se resti.» è più lungo di «Tu sei
   libero.»: il corpo scende quanto basta perché ogni frase resti su una riga sola. */
.flow-experience #hero-title{font-size:clamp(56px,5.4vw,92px)}
@media (max-width:760px){.flow-experience #hero-title{font-size:min(48px,10.2vw)}}

.trial{display:grid;grid-template-columns:1.1fr .9fr;gap:34px 6vw;align-items:start;background:radial-gradient(ellipse at 85% 10%,#1770882e,transparent 58%),linear-gradient(#08202d,#061722);border-top:1px solid #ace3f21f}
.trial-head{grid-column:1/-1;max-width:760px}
.trial-head h2{font-size:clamp(2.5rem,4.3vw,4rem);line-height:1.05;letter-spacing:-.055em;margin:16px 0 0}
.trial-head>p{color:#b8d0d8;font-size:1.0625rem;line-height:1.65;max-width:560px;margin:24px 0 0}

.trial-steps{list-style:none;margin:0;padding:0;position:relative}
.trial-steps::before{content:"";position:absolute;left:7px;top:12px;bottom:12px;width:1px;background:linear-gradient(#65d5f4aa,#65d5f422)}
.trial-steps li{position:relative;padding:0 0 30px 38px}
.trial-steps li:last-child{padding-bottom:0}
.trial-steps li::before{content:"";position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:50%;background:#061722;border:2px solid var(--cyan);box-shadow:0 0 14px #65d5f455}
.trial-steps li:last-child::before{background:var(--cyan)}
.trial-day{display:block;font-size:.75rem;letter-spacing:.14em;font-weight:700;color:var(--cyan);text-transform:uppercase}
.trial-steps h3{font-size:1.5rem;letter-spacing:-.03em;line-height:1.2;margin:8px 0 8px}
.trial-steps p{margin:0;color:#c1d5df;font-size:1rem;line-height:1.6;max-width:520px}

.trial-ledger{position:relative;overflow:hidden;border:1px solid #89d8ee40;border-radius:7px;background:linear-gradient(150deg,#102e3f,#081d29);padding:28px 26px 24px}
.trial-ledger::before{content:"";position:absolute;left:15%;right:15%;top:0;height:1px;background:#d0f5ff;box-shadow:0 0 30px 3px #83e4ff66}
.trial-ledger h3{font-size:1.5rem;letter-spacing:-.03em;margin:0 0 10px}
.trial-ledger dl{margin:0 0 24px}
.trial-ledger dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:13px 0;border-bottom:1px solid var(--line)}
.trial-ledger dt{flex:1 1 auto;font-size:.9375rem;line-height:1.45;color:#d5e7ec}
.trial-ledger dd{flex:0 0 auto;margin:0;text-align:right;font-size:1.375rem;font-weight:800;letter-spacing:-.03em;color:#effbff;white-space:nowrap}
.trial-ledger dd small{display:block;margin-top:3px;font-size:.75rem;font-weight:400;letter-spacing:0;color:#a9c2cc}
.trial-ledger .trial-stay{border-bottom:0;padding-top:16px}
.trial-ledger .trial-stay dt{color:var(--cyan);font-weight:700}
.trial-ledger .trial-stay dd>span{display:block;margin-top:8px;font-size:1.0625rem}
.trial-ledger .trial-stay dd{max-width:58%}
.trial-ledger .trial-stay dd small{white-space:normal}
.trial-ledger .button{width:100%;justify-content:center}
.trial-note{margin:16px 0 0;font-size:.8125rem;line-height:1.65;color:#b8ced6}

.plan-setup{margin:8px 0 0;font-size:.8125rem;line-height:1.55;color:#c4d9df}
.plan-setup a,.trial-note a{color:#b1e7f6;text-decoration:underline;text-underline-offset:3px}
.calculator-results .next-year{margin:10px 0 0;font-size:.8125rem;color:#b8ced6;text-align:right}
.calculator-results .next-year strong{color:#e3f3f7}

@media (max-width:900px){
 .trial{grid-template-columns:1fr}
}
@media (max-width:760px){
 .trial-head h2{font-size:2.5rem}
 .trial-head>p{font-size:1rem;margin-top:18px}
 .trial-steps h3{font-size:1.3125rem}
 .trial-ledger{padding:24px 20px 20px}
 .trial-ledger dd{font-size:1.25rem}
}

/* La prima scena su telefono: la frase sul primo mese gratis ha allungato il testo, e su
   390×844 «All'installazione non paghi niente» finiva sotto la barra in basso. Su schermi
   bassi (375×667) già prima i pulsanti ci finivano sotto. La riga di rassicurazione su
   telefono si toglie (il primo mese gratis e i €120 sono già detti sopra), e sugli schermi
   bassi si stringe il resto. */
@media (max-width:760px){
 .journey-opening .journey-reassurance{display:none}
}
@media (max-width:760px) and (max-height:760px){
 /* La scena è alta almeno 740 px (river.css) e, su uno schermo più basso, la parte in
    eccesso resta sopra il bordo: a top:130px il testo partiva sotto la testata. Si ancora
    86 px sotto il bordo visibile, qualunque sia l'altezza dello schermo. */
 .journey-opening{top:calc(86px + max(0px, 740px - 100svh));transform:translate3d(0,var(--cue-y,0px),0)}
 .journey-opening .journey-signature,.journey-opening .journey-kicker{display:none}
 /* Per lo stesso motivo la fila dei capitoli finiva sotto la testata, a metà: su schermi
    così bassi non c'è posto anche per lei. Resta «Scorri», in basso. */
 .journey-nav{display:none}
 .flow-experience #hero-title{font-size:min(36px,9.4vw)}
 .journey-opening>p{font-size:15px;line-height:1.45;margin-bottom:10px}
 .journey-opening .journey-offer{margin:6px 0 12px}
 .journey-opening .journey-offer strong{font-size:2.25rem}
 .journey-actions>.button{min-height:46px}
 .journey-actions>.flow-secondary{min-height:44px}
}
@media (max-width:760px) and (max-height:600px){
 .journey-actions>.flow-secondary{display:none}
}
