/* ═════════ REPORT ═════════ */
.doc-brands{display:flex;align-items:center;padding:0 2px 16px}
.doc-brands .lg-me{width:min(252px,64vw)}
.doc{background:var(--card);border:1px solid var(--line);border-radius:26px;box-shadow:var(--sh2);overflow:hidden}
.doc-head{background:var(--o-surf);color:#fff;padding:clamp(20px,4vw,28px);position:relative;overflow:hidden}

.doc-head>*{position:relative;z-index:1}
.doc-h{font-size:clamp(22px,5.4vw,30px);font-weight:800;letter-spacing:-.035em;line-height:1.1;margin:0}
.doc-sub{font-size:13.5px;color:#fff;font-weight:600;margin-top:9px;line-height:1.5}
.doc-sub b{font-weight:850}
.doc-ref{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.28);
  font-size:11px;color:#fff;font-weight:700;display:flex;gap:14px;flex-wrap:wrap}
.doc-body{padding:clamp(18px,4vw,28px);display:grid;gap:clamp(18px,3.4vw,24px)}
.sec-t{display:flex;align-items:center;gap:9px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;
  font-weight:900;color:var(--o-d);margin-bottom:12px}
.sec-t:before{content:"";width:20px;height:2.5px;border-radius:2px;background:var(--o);flex:none}
.sec-t.g{color:var(--gr)}.sec-t.g:before{background:var(--gr)}

.headline{background:linear-gradient(160deg,#FFF7F2,#fff);border:1.5px solid var(--o-line);border-radius:var(--r2);padding:clamp(18px,4vw,24px)}
.headline .k{font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:var(--o-d)}
.headline .v{font-size:clamp(36px,10vw,54px);font-weight:900;letter-spacing:-.05em;line-height:1;margin:8px 0 0;
  color:var(--ink);font-variant-numeric:tabular-nums}
.headline .v small{font-size:.34em;font-weight:800;color:var(--mut);letter-spacing:-.02em}
.headline .k{color:var(--o-d)}
.headline .d{font-size:12.5px;color:var(--ink2);margin-top:9px;line-height:1.45}
.headline .d b{color:var(--ink)}

.grid{display:grid;gap:9px;grid-template-columns:repeat(2,1fr)}
@media(min-width:640px){.grid.g3{grid-template-columns:repeat(3,1fr)}.grid.g4{grid-template-columns:repeat(4,1fr)}}
.tile{background:#FCFAF8;border:1px solid var(--line);border-radius:15px;padding:14px 13px}
.tile .k{font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:800;color:#5E6870;line-height:1.3}
.tile .v{font-size:clamp(18px,5vw,23px);font-weight:900;letter-spacing:-.035em;margin-top:6px;line-height:1.05;
  font-variant-numeric:tabular-nums}
.tile .v small{font-size:.5em;font-weight:800;color:var(--mut)}
.tile .d{font-size:10.5px;color:var(--mut);margin-top:5px;line-height:1.35}
.tile.o{background:#FFE3D6;border-color:#F7BFA3}.tile.o .v{color:var(--o)}
.tile.g{background:#DBF2E7;border-color:#9FD8BE}.tile.g .v{color:#0B6B49}
.tile.b{background:#DEEAF7;border-color:#B1D0E8}.tile.b .v{color:#1F4E75}
/* la casella che porta il numero chiave della sezione */
.tile.solid{background:var(--o-surf);border-color:transparent;color:#fff}
.tile.solid .k,.tile.solid .d,.tile.solid .v,.tile.solid .v small{color:#fff}
.grid.ctr .tile{text-align:center}
.headline.ctr{text-align:center}
.headline.ctr .d{margin-inline:auto}

.blist{display:grid;gap:9px}
.brow{display:flex;align-items:center;gap:12px;background:#fff;border:1.5px solid var(--line);border-radius:15px;padding:13px 15px}
.brow .bi{width:38px;height:38px;flex:none;border-radius:11px;display:grid;place-items:center;background:var(--o-soft);color:var(--o-d)}
.brow .bi svg{width:19px;height:19px}
.brow.g .bi{background:var(--gr-soft);color:var(--gr)}
.brow.b .bi{background:var(--bl-soft);color:var(--bl)}
.brow .bt{flex:1;min-width:0}
.brow .bt strong{display:block;font-size:14px;letter-spacing:-.02em;line-height:1.25}
.brow .bt span{display:block;font-size:11.5px;color:var(--mut);margin-top:3px;line-height:1.4}
.brow .bv{font-size:11.5px;font-weight:850;color:var(--gr);white-space:nowrap;
  background:var(--gr-soft);border:1px solid var(--gr-line);border-radius:99px;padding:5px 10px}
@media(max-width:520px){.brow{flex-wrap:wrap;gap:10px}
  .brow .bi{order:1}.brow .bv{order:2;margin-left:auto}.brow .bt{order:3;flex:1 1 100%}}

/* riepilogo dei dati inseriti: sempre aperto, apre il report */
.recap{border:1px solid var(--line);border-radius:var(--r2);background:#FCFAF8;overflow:hidden}
.recap dl{margin:0;padding:4px 16px 10px}
.recap-r{display:grid;grid-template-columns:1fr;gap:1px;padding:9px 0;border-top:1px solid var(--line2)}
.recap-r:first-child{border-top:0}
@media(min-width:520px){.recap-r{grid-template-columns:minmax(140px,.4fr) 1fr;gap:12px;align-items:baseline}}
.recap-r dt{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:800;color:#626B75;margin:0}
.recap-r dd{font-size:13.5px;font-weight:750;letter-spacing:-.015em;color:var(--ink);margin:0;line-height:1.35}
.recap-r dd em{font-style:normal;font-weight:650;color:var(--mut);font-size:12.5px}

.afwin{border-radius:var(--r2);padding:clamp(17px,4vw,22px);background:var(--gr-soft);border:1.5px solid var(--gr-line)}
.afwin .afk{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;text-transform:uppercase;letter-spacing:.11em;
  font-weight:900;color:#fff;background:var(--gr);padding:5px 11px;border-radius:99px}
.afwin .afk svg{width:13px;height:13px}
.afwin .afh{font-size:clamp(18px,4.4vw,22px);font-weight:850;letter-spacing:-.03em;line-height:1.2;margin:12px 0 0;color:#0C4A34}
.afwin .afd{font-size:13px;line-height:1.5;color:#1B5340;margin-top:8px;font-weight:600}
.afwin .afd b{font-weight:850;color:#0C4A34}
.afwin .aflg{width:min(210px,54vw);margin-top:16px}

/* chiusura: fondo bianco, arancio solo dove serve spingere */
.finale{background:#fff;border:1px solid var(--line);border-radius:var(--r2);padding:clamp(20px,4vw,26px)}
.finale h3{font-size:clamp(19px,4.8vw,25px);letter-spacing:-.03em;margin:0 0 9px;line-height:1.2;color:var(--ink)}
.finale p{font-size:13.5px;line-height:1.55;color:var(--ink2);font-weight:600;margin:0 0 18px}
.finale p b{font-weight:800;color:var(--ink)}
.steps{display:grid;gap:9px;margin-bottom:20px}
@media(min-width:640px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{background:var(--o-surf);border-radius:15px;padding:15px 14px;color:#fff}
.step .n{width:25px;height:25px;border-radius:8px;background:#fff;color:#B63B0C;display:grid;place-items:center;
  font-size:12.5px;font-weight:900;margin-bottom:10px}
.step strong{display:block;font-size:13.5px;letter-spacing:-.02em;color:#fff}
.step span{display:block;font-size:11.5px;color:#fff;font-weight:600;margin-top:4px;line-height:1.4}
.fbtns{display:grid;gap:9px}
@media(min-width:560px){.fbtns{grid-auto-flow:column;justify-content:start}}
.finale .btn.ghost{background:#F1ECE7;color:#4C545C;border:1.5px solid #E3DBD3;box-shadow:none}
.finale .btn.ghost:hover{background:#EAE4DD;border-color:#D8CEC5}

/* richiesta di contatto via WhatsApp */
.wabox{border:1.5px solid var(--gr-line);background:var(--gr-soft);border-radius:var(--r2);
  padding:clamp(16px,3.4vw,20px);margin:0 0 18px}
.wabox .wat{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:850;letter-spacing:-.02em;color:#0C4A34}
.wabox .wat svg{width:19px;height:19px;flex:none;color:var(--gr)}
.wamsg{display:block;width:100%;margin:11px 0 11px;border:1.5px solid #BFE0CF;border-radius:13px;background:#fff;
  padding:12px 13px;font-size:13.5px;line-height:1.5;font-weight:600;color:var(--ink);resize:vertical;min-height:124px}
.wabox .btn{width:100%}
.wamsg:focus{outline:0;border-color:var(--gr);box-shadow:0 0 0 3px rgba(15,122,84,.13)}
.wabox .hint{margin-top:10px}

.legal{font-size:10.5px;line-height:1.6;color:#6A727A;background:#FAF7F4;border:1px solid var(--line2);
  border-radius:14px;padding:14px 16px}
.legal b{color:#4C545C}

/* stampa */
/* ═════════ REPORT · quattro colori soltanto ═════════
   bianco, arancio #E9500E, grigio Mondo Energetico, verde WhatsApp.
   Il colore sta nei fondi pieni, nei bordi e nelle icone; il testo è
   bianco sui pieni e nero o grigio sul bianco. Niente tinte intermedie. */
.doc{border-color:var(--me-line)}
.doc-head{background:var(--o)}
.sec-t{color:var(--o-d)}
.sec-t:before{background:var(--o)}
.sec-t.g{color:var(--o-d)}.sec-t.g:before{background:var(--o)}

.recap{background:#fff;border-color:var(--me-line)}
.recap-r{border-top-color:#EDEDEF}
.recap-r dt{color:var(--me-gray-d)}
.recap-r dd em{color:var(--me-gray-d)}

.headline{background:#fff;border:2px solid var(--o)}
.headline .k{color:var(--o-d)}
.headline .v{color:var(--ink)}
.headline .v small{color:var(--me-gray-d)}
.headline .d{color:var(--ink2)}

.tile{background:#fff;border:1.5px solid var(--me-line)}
.tile .k{color:var(--me-gray-d)}
.tile .d{color:var(--me-gray-d)}
.tile .v{color:var(--ink)}
.tile .v small{color:var(--me-gray-d)}
.tile.o{background:#fff;border-color:var(--o)}.tile.o .v{color:var(--o-d)}
.tile.g{background:#fff;border-color:var(--me-line)}.tile.g .v{color:var(--ink)}
.tile.b{background:#fff;border-color:var(--me-gray)}.tile.b .v{color:var(--ink)}
.tile.solid{background:var(--o);border-color:var(--o);color:#fff}
.tile.solid .k,.tile.solid .d,.tile.solid .v,.tile.solid .v small{color:#fff}

.brow{border-color:var(--me-line)}
.brow .bi{background:#fff;border:1.5px solid var(--o);color:var(--o-d)}
.brow.g .bi{background:#fff;border-color:var(--o);color:var(--o-d)}
.brow.b .bi{background:#fff;border-color:var(--me-gray);color:var(--me-gray-d)}
.brow .bt span{color:var(--me-gray-d)}
.brow .bv{background:#fff;border:1.5px solid var(--o);color:var(--o-d)}

/* verifica preliminare: verde WhatsApp pieno, con il suo testo scuro */
.afwin{background:#fff;border:2px solid var(--ed-green)}
.afwin .afk{background:var(--ed-green);color:#fff;font-size:11px;font-weight:900}
.afwin .afh{color:var(--ink)}
.afwin .afd{color:var(--ink2)}
.afwin .afd b{color:var(--ink)}

.step{background:var(--o)}
.step .n{background:#fff;color:var(--o-d)}
.wabox{background:#fff;border:1.5px solid var(--ed-green)}
.wabox .wat{color:var(--ed-d);font-size:15.5px;font-weight:900}
.wabox .wat svg{color:var(--ed-green)}
.wamsg{border-color:var(--me-line)}
.wamsg:focus{border-color:var(--ed-green);box-shadow:0 0 0 3px rgba(44,142,55,.2)}
.legal{background:#fff;border-color:var(--me-line);color:var(--me-gray-d)}
.legal b{color:var(--ink2)}
.finale .btn.ghost{background:var(--me-gray-d);color:#fff;border-color:var(--me-gray-d)}
.finale .btn.ghost:hover{background:#46474B;border-color:#46474B}

/* ═════════ intestazione e piede di stampa ═════════
   Vivono dentro una tabella: thead e tfoot sono gli unici elementi che
   i browser ripetono su ogni foglio riservando lo spazio. A schermo la
   tabella torna a comportarsi come una normale sequenza di blocchi. */
.prsheet{display:block;width:100%;border-collapse:collapse}
.prsheet thead,.prsheet tfoot{display:none}
.prsheet tbody,.prsheet tr,.prsheet td{display:block;padding:0}
.prhead{display:flex;align-items:center;gap:14px;padding-bottom:8px;border-bottom:1.5px solid var(--o);margin-bottom:12px}
.prhead .lg-me{width:190px;flex:none}
.prhead .co{margin-left:auto;text-align:right;font-size:8.4px;line-height:1.5;color:var(--me-gray-d);font-weight:650}
.prhead .co b{display:block;font-size:9.6px;color:var(--ink);font-weight:900;letter-spacing:.01em}
.prfoot{display:flex;align-items:center;gap:12px;padding-top:8px;border-top:1px solid var(--me-line);margin-top:12px}
.prfoot .ed{width:38px;height:38px;box-shadow:none}
.prfoot .pt{font-size:9.6px;font-weight:850;color:var(--ink2);line-height:1.35}
.prfoot .pdnc{font-size:8.4px;font-weight:650;color:var(--me-gray-d);margin-top:2px;line-height:1.35}

@media print{
  @page{size:A4;margin:1cm}
  html,body{background:#fff}
  .mbar,.rail,.navbar,.noprint,.fbtns,.doc-brands,.pfoot{display:none!important}
  .app{height:auto;overflow:visible;display:block}
  .stage{overflow:visible}
  .wrap{max-width:none;padding:0}
  .screen{display:none!important}
  .screen.on{display:block!important;animation:none}
  .doc{border:0;box-shadow:none;border-radius:0}
  .doc-body{padding:0;gap:14px}
  .doc-head{padding:16px 18px;border-radius:0}
  .recap dl{display:block!important}

  /* la tabella riporta intestazione e piede su ogni foglio */
  .prsheet{display:table}
  .prsheet thead{display:table-header-group}
  .prsheet tfoot{display:table-footer-group}
  .prsheet tbody{display:table-row-group}
  .prsheet tr{display:table-row}
  .prsheet td{display:table-cell}

  /* nessun blocco spezzato a metà fra due fogli */
  .doc-body>div,.headline,.tile,.brow,.afwin,.recap,.legal,.finale,.steps,.step,.grid{
    break-inside:avoid;page-break-inside:avoid}
  .sec-t{break-after:avoid;page-break-after:avoid}
  .doc-head,.finale,.tile,.brow,.afwin,.step,.afk,.prhead,.prfoot,.wabox{
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ed{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

