:root{--map-ink:#181818;--map-paper:#f7f1e5;--map-orange:#e65512;--map-yellow:#ffd83d;--map-green:#7dbb46;--map-blue:#4383bc;--map-purple:#a83baa}
.maps-page{max-width:1500px;margin:0 auto;padding:70px 32px 120px}
.maps-hero{max-width:850px;margin-bottom:34px}
.maps-hero h1{font-size:clamp(42px,7vw,84px);line-height:.92;margin:12px 0 18px;color:var(--white);letter-spacing:-.05em}
.maps-hero>p:last-child{color:var(--muted);font-size:17px;line-height:1.65}

/* Indice: card raggruppate per tipologia di funnel (Optin Funnel, VSL, ...). */
.map-index{display:flex;flex-direction:column;gap:34px;margin:34px 0 0}
.map-type-heading{display:flex;align-items:center;gap:10px;margin:0 0 14px;color:var(--white);font-size:15px;text-transform:uppercase;letter-spacing:.06em}
.map-type-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:rgba(230,85,18,.15);color:var(--orange-lt);font:700 11px var(--font-mono)}
.map-type-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.map-card{display:flex;flex-direction:column;overflow:hidden;padding:0;border:1px solid rgba(var(--on-surface-rgb),.12);border-radius:16px;background:var(--black-2);text-align:left;cursor:pointer;font:inherit;color:inherit}
.map-card:hover{border-color:var(--map-orange)}
.map-card:hover .map-card-cta{color:var(--orange-lt)}
.map-card-thumb{display:block;height:150px;background-image:var(--thumb);background-size:cover;background-position:top center;border-bottom:1px solid rgba(var(--on-surface-rgb),.1)}
.map-card-body{display:block;padding:16px 16px 4px}
.map-card-variant{display:inline-block;margin-bottom:7px;padding:3px 9px;border-radius:99px;background:rgba(230,85,18,.14);color:var(--orange-lt);font:600 10px var(--font-mono);text-transform:uppercase;letter-spacing:.02em}
.map-card-body strong{display:block;color:var(--white);font-size:15px;line-height:1.3;margin-bottom:6px}
.map-card-body small{display:block;color:var(--muted);font-size:12px;line-height:1.5}
.map-card-cta{display:block;padding:12px 16px 16px;color:var(--gray);font:600 11px var(--font-mono);text-transform:uppercase;letter-spacing:.03em}
@media(max-width:640px){.maps-page{padding:52px 16px 90px}.map-type-cards{grid-template-columns:1fr}}

/* Popup di dettaglio: immagine intatta (nessuna alterazione grafica) +
   analisi strategica (perché funziona / quando usarlo / quando evitarlo). */
.funnel-modal{display:none;position:fixed;inset:0;z-index:150;background:rgba(6,6,6,.82);padding:18px;align-items:center;justify-content:center}
.funnel-modal.open{display:flex}
.funnel-modal-panel{position:relative;width:100%;max-width:1080px;max-height:90vh;background:var(--black);border:1px solid rgba(var(--on-surface-rgb),.14);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.5);overflow:hidden}
.funnel-modal-close{position:absolute;top:12px;right:12px;z-index:2;width:32px;height:32px;border-radius:99px;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.5);color:#fff;font-size:13px;cursor:pointer}
.funnel-modal-close:hover{background:var(--map-orange);border-color:var(--map-orange)}
.funnel-modal-scroll{max-height:90vh;overflow-y:auto;padding:24px 26px}
.funnel-modal-head{margin-bottom:14px}
.funnel-modal-head .eyebrow{margin:0}
.funnel-modal-head h2{margin:4px 0 4px;color:var(--white);font-size:clamp(19px,2.4vw,25px)}
.fm-subtitle{margin:0;color:var(--muted);font-size:12.5px}
.fm-variant{display:inline-block;margin-top:8px;padding:3px 9px;border-radius:99px;background:rgba(230,85,18,.14);color:var(--orange-lt);font:600 10px var(--font-mono);text-transform:uppercase;letter-spacing:.02em}
.fm-variant:empty{display:none}
.funnel-modal-body{display:grid;grid-template-columns:300px 1fr;gap:20px;align-items:start}
.funnel-modal-imgwrap{position:relative;display:flex;align-items:center;justify-content:center;background:var(--map-paper);border:2px solid var(--map-ink);border-radius:14px;box-shadow:6px 7px 0 var(--map-orange);padding:10px;position:sticky;top:0}
.info-map-img{max-width:100%;max-height:46vh;width:auto;height:auto;object-fit:contain;border-radius:6px;cursor:zoom-in;display:block}
.info-map-zoom-hint{position:absolute;right:10px;bottom:10px;padding:5px 9px;border-radius:99px;background:rgba(17,17,17,.78);color:#fff;font:9px var(--font-mono);pointer-events:none;opacity:.9}
.funnel-modal-notes{display:flex;flex-direction:column;gap:12px;min-width:0}
.fm-block h3{margin:0 0 6px;color:var(--white);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.fm-block p,.fm-block li{color:var(--muted);font-size:12.5px;line-height:1.55}
.fm-why{padding:11px 13px;border-radius:12px;background:rgba(var(--on-surface-rgb),.03);border:1px solid rgba(var(--on-surface-rgb),.1)}
.fm-why p{margin:0}
.fm-steps-list{margin:0;padding-left:18px}
.fm-steps-list li{margin-bottom:4px}
.fm-tools{display:flex;flex-wrap:wrap;gap:6px}
.fm-tools span{padding:4px 9px;border-radius:99px;background:rgba(67,131,188,.14);color:#8fc3ec;font:10.5px var(--font-mono)}
.fm-emails{display:flex;flex-direction:column;gap:5px}
.fm-email-row{display:flex;align-items:baseline;gap:9px;padding:6px 9px;border-radius:8px;background:rgba(var(--on-surface-rgb),.03)}
.fm-email-row b{flex:0 0 44px;font-size:10.5px;letter-spacing:.02em;color:var(--orange-lt)}
.fm-email-row span{color:var(--muted);font-size:12px}
.fm-emails-note{display:none;margin:6px 0 0;color:var(--gray);font-size:10.5px;font-style:italic}
.fm-script-block{padding:11px 13px;border-radius:12px;background:rgba(163,109,224,.06);border:1px solid rgba(163,109,224,.22)}
.fm-script-block h3{color:#c79bf0}
.fm-script{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.fm-script-phase{padding:8px 10px;border-radius:9px;background:rgba(var(--on-surface-rgb),.04)}
.fm-script-phase b{display:block;margin-bottom:4px;color:#c79bf0;font:11px var(--font-mono);letter-spacing:.03em}
.fm-script-phase ul{margin:0;padding-left:14px}
.fm-script-phase li{margin-bottom:3px;font-size:11.5px;line-height:1.45}
.fm-script-ref{margin:8px 0 0}
.fm-script-ref a{color:var(--orange-lt);font-size:11px}
.fm-procedure-block{padding:11px 13px;border-radius:12px;background:rgba(67,131,188,.07);border:1px solid rgba(67,131,188,.22)}
.fm-procedure-block h3{color:#8fc3ec}
.fm-procedure-note{margin:0 0 8px;font-size:11.5px;font-style:italic}
.fm-procedure-link{display:inline-block;color:var(--orange-lt);font:600 12px var(--font-body)}
.fm-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fm-use{padding:10px 12px;border-radius:12px;background:rgba(125,187,70,.07);border:1px solid rgba(125,187,70,.22)}
.fm-use h3{color:#8fd15c}
.fm-avoid{padding:10px 12px;border-radius:12px;background:rgba(230,85,18,.06);border:1px solid rgba(230,85,18,.2)}
.fm-avoid h3{color:var(--orange-lt)}
.fm-block ul{margin:0;padding-left:16px}
.fm-block li{margin-bottom:4px}
.map-source{margin:2px 0 0;color:var(--gray);font-size:10.5px}
.map-source a{color:var(--orange-lt)}
@media(max-width:820px){.funnel-modal-body{grid-template-columns:1fr}.funnel-modal-imgwrap{position:static}.info-map-img{max-height:38vh}}
@media(max-width:640px){.fm-cols{grid-template-columns:1fr}.funnel-modal-scroll{padding:52px 16px 20px}}

/* Lightbox: zoom/pan a schermo intero per leggere le mappe dense di testo. */
.map-lightbox{display:none;position:fixed;inset:0;z-index:200;background:rgba(6,6,6,.94);flex-direction:column}
.map-lightbox.open{display:flex}
.map-lightbox-toolbar{display:flex;justify-content:center;align-items:center;gap:8px;padding:14px}
.lb-btn{width:38px;height:38px;border-radius:99px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:600 16px var(--font-body);cursor:pointer}
.lb-btn:hover{background:rgba(255,255,255,.16)}
.lb-btn[data-act="reset"]{width:auto;padding:0 16px;font-size:12px}
.lb-close{margin-left:10px;background:rgba(230,85,18,.85)}
.lb-close:hover{background:var(--map-orange)}
.map-lightbox-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
.map-lightbox-stage.grabbing{cursor:grabbing}
.map-lightbox-img{border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5);cursor:grab;user-select:none;-webkit-user-drag:none}
.map-lightbox-hint{margin:0;padding:12px;text-align:center;color:var(--gray);font:10px var(--font-mono);text-transform:uppercase;letter-spacing:.04em}
body.map-lightbox-lock{overflow:hidden}
@media(max-width:640px){.map-lightbox-hint{font-size:8px;padding:8px}.map-lightbox-toolbar{padding:10px}}