/* assets/promo.css — pagine "locandina" (includes/promo-page.php). Si appoggia a landing.css. */
.promo{--pc:#F2762E}
.promo .btn-primary{background:var(--pc);box-shadow:0 10px 30px color-mix(in srgb,var(--pc) 38%,transparent)}
.promo .btn-sm{padding:10px 18px;font-size:14px}
.promo .btn-lg{padding:18px 30px;font-size:16.5px}
.promo .kicker{color:var(--pc)}
.promo .fp-steps .n{background:var(--pc)}
.promo .hero h1 .serif{background:linear-gradient(120deg,var(--pc),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}

/* barra in alto: solo logo, lingua e pulsante */
.promo-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px clamp(16px,4vw,40px);background:rgba(15,27,51,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}
.promo-brand img{height:36px;width:auto}
.promo-top-r{display:flex;align-items:center;gap:10px}
.promo-top .lang-switcher{position:relative}
.promo-top .lang-current{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:7px 9px;cursor:pointer;line-height:0}
.promo-top .lang-current svg{width:22px;height:16px;border-radius:3px}
.promo-top .lang-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);background:#fff;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25);padding:6px;min-width:170px}
.promo-top .lang-menu.open{display:block}
.promo-top .lang-option{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;color:var(--ink);font-size:14.5px;font-weight:600}
.promo-top .lang-option:hover,.promo-top .lang-option.active{background:var(--bg-alt)}
.promo-top .lang-option svg{width:22px;height:16px;border-radius:3px}

/* hero */
.promo-hero{padding-top:clamp(34px,6vw,70px)}
.promo-hero h1{font-size:clamp(36px,5.4vw,62px)}
.promo-bullets{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:12px;max-width:560px}
.promo-bullets li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.5;color:var(--on-navy-sub)}
.promo-bullets b{color:var(--on-navy)}
.promo-bullets .ic,.why .ic,.poster-points .ic{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;background:color-mix(in srgb,var(--pc) 20%,transparent);color:var(--pc)}
.promo-bullets .ic svg,.why .ic svg,.poster-points .ic svg{width:19px;height:19px}
.promo-visual{position:relative;display:flex;justify-content:center;align-items:center;min-height:520px}
.promo-visual .phone{position:relative;width:min(290px,66vw);transform:rotate(-2deg);z-index:2}
.promo-shot{position:absolute;right:0;bottom:30px;width:56%;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 60px rgba(0,0,0,.45);background:#fff;z-index:3;transform:rotate(3deg)}
.promo-shot img{width:100%}

/* numeri */
.promo-proof{background:var(--navy-2);color:var(--on-navy);padding:26px 0;border-top:1px solid rgba(255,255,255,.06)}
.proof-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center}
.proof b{display:block;font-size:clamp(26px,3.4vw,38px);font-weight:900;letter-spacing:-.02em;color:var(--pc)}
.proof span{font-size:13.5px;color:var(--on-navy-sub)}

/* perché */
.promo .sec-head p{color:var(--ink-sub);font-size:17px;line-height:1.6;max-width:720px;margin:12px auto 0}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:900px){.why-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.why-grid{grid-template-columns:1fr}}
.why{padding:26px;border-radius:22px;border:1px solid var(--divider);background:#fff}
.why h3{font-size:18.5px;margin:14px 0 8px;letter-spacing:-.01em}
.why p{margin:0;color:var(--ink-sub);font-size:15px;line-height:1.6}
.promo-steps .cta-row.center{justify-content:center;margin-top:30px}
.promo .final-card .btn-ghost{color:var(--on-navy)}

.promo-foot{text-align:center;padding:26px 16px 90px;font-size:13.5px;color:var(--ink-sub)}
.promo-foot a{text-decoration:underline;text-underline-offset:3px}

/* pulsante fisso su telefono, compare quando l'hero non si vede più */
.promo-sticky{display:none}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .promo-visual{min-height:0;margin-top:10px}
  .promo-visual .phone{width:min(250px,62vw)}
  .promo-shot{width:52%;right:2%;bottom:6%}
  .proof-row{grid-template-columns:repeat(2,1fr);row-gap:20px}
  .promo-sticky{display:flex;position:fixed;left:14px;right:14px;bottom:14px;z-index:60;justify-content:center;align-items:center;gap:8px;padding:16px;border-radius:18px;background:var(--pc);color:#fff;font-weight:800;font-size:16px;box-shadow:0 14px 40px rgba(0,0,0,.3);transform:translateY(140%);transition:transform .25s ease}
  .promo-sticky.on{transform:none}
  .promo-sticky svg{width:18px;height:18px}
}
@media (max-width:520px){
  .promo-brand img{height:28px}
  .promo-top .btn-sm{padding:9px 13px;font-size:13px}
  .promo-hero .cta-row .btn{width:100%;justify-content:center}
}

/* ================= locandina A4 (?stampa=1) ================= */
.is-print{background:#e9e7e2}
.print-bar{display:flex;gap:12px;justify-content:center;align-items:center;padding:14px;font-size:14px}
.print-bar button{font:inherit;font-weight:800;padding:11px 22px;border-radius:24px;border:0;background:var(--pc);color:#fff;cursor:pointer}
.print-bar a{text-decoration:underline}
.poster{width:210mm;height:297mm;margin:0 auto 30px;overflow:hidden;display:flex;flex-direction:column;padding:16mm 15mm 14mm;color:var(--on-navy);background:radial-gradient(130mm 90mm at 100% 0,rgba(124,92,255,.35),transparent 70%),radial-gradient(130mm 100mm at 0 100%,color-mix(in srgb,var(--pc) 35%,transparent),transparent 70%),linear-gradient(180deg,var(--navy),var(--navy-2));box-shadow:0 20px 60px rgba(0,0,0,.25);-webkit-print-color-adjust:exact;print-color-adjust:exact}
.poster-logo{height:13mm;width:auto;align-self:flex-start}
.poster-badge{align-self:flex-start;margin-top:9mm;font-size:12pt;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--pc)}
.poster h1{font-size:38pt;line-height:1.03;font-weight:900;letter-spacing:-.03em;margin:4mm 0 5mm}
.poster h1 .serif{font-size:1.1em;color:var(--pc)}
.poster-lead{font-size:14pt;line-height:1.45;color:var(--on-navy-sub);margin:0 0 6mm}
.poster-mid{display:grid;grid-template-columns:1fr 58mm;gap:8mm;align-items:center;margin-bottom:8mm}
.poster-phone{border-radius:9mm;padding:2.2mm;background:linear-gradient(145deg,#2a3550,#0b1222);box-shadow:0 10mm 20mm rgba(0,0,0,.45);transform:rotate(3deg)}
.poster-phone img{border-radius:7mm;width:100%;height:84mm;object-fit:cover;object-position:top}
.poster-points{list-style:none;margin:0;padding:0;display:grid;gap:5mm}
.poster-points li{display:flex;gap:4mm;align-items:center;font-size:13.5pt;line-height:1.4;color:var(--on-navy-sub)}
.poster-points b{color:var(--on-navy)}
.poster-points .ic{width:11mm;height:11mm;border-radius:3.5mm}
.poster-points .ic svg{width:6mm;height:6mm}
.poster-steps{list-style:none;margin:0;padding:0;display:grid;gap:3.6mm}
.poster-steps li{display:flex;gap:3.5mm;align-items:flex-start;font-size:11.5pt;line-height:1.38;color:var(--on-navy-sub)}
.poster-steps b{color:var(--on-navy)}
.poster-steps .n{flex-shrink:0;width:8mm;height:8mm;border-radius:2.6mm;background:var(--pc);color:#fff;font-weight:900;font-size:11pt;display:inline-flex;align-items:center;justify-content:center}
.poster-qr{margin-top:auto;display:flex;gap:8mm;align-items:center;background:#fff;color:var(--ink);border-radius:7mm;padding:7mm}
.poster-qr #qr{line-height:0;flex-shrink:0}
.poster-qr #qr img,.poster-qr #qr canvas{width:52mm!important;height:52mm!important}
.poster-qr b{display:block;font-size:22pt;line-height:1.1;font-weight:900;letter-spacing:-.02em}
.poster-qr span{display:block;font-size:13pt;color:var(--pc);font-weight:800;margin-top:3mm}
.poster-qr small{display:block;font-size:10pt;color:var(--ink-sub);margin-top:4mm;word-break:break-all}
@page{size:A4;margin:0}
@media print{
  .is-print{background:#fff}
  .print-bar{display:none}
  .poster{margin:0;box-shadow:none}
}
@media screen and (max-width:820px){
  .poster{transform-origin:top center;zoom:.45}
}