/* Refinery Atlas · stile della home (0.4.0 "Sala controllo"): barra superiore, copertina con scena 3D, percorso di processo con indice a icone,
   mappa dei flussi, bilancio, cartiglio. Token e componenti ra-* in engine/atlas.css. Solo tema scuro. Tutto sotto #home. */
body.home{height:auto;min-height:100%;overflow:visible;background:var(--bg);color:var(--ink)}
html:has(body.home){height:auto;background:var(--bg)}
#home{min-height:100vh}
#home *{min-width:0}
#home a{color:inherit}
#home a:focus-visible,#home button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:none}
.ho-w{width:100%;max-width:1440px;margin-inline:auto;padding-inline:24px;box-sizing:border-box}
.mk-a{fill:var(--accent)}.mk-s{fill:var(--line-strong)}.mk-t{stroke:var(--line-strong);stroke-width:1;fill:none}
#home .skip{position:absolute;left:16px;top:-48px;z-index:50;padding:var(--space-2) var(--space-3);background:var(--accent);color:var(--on-accent);font-weight:500;text-decoration:none}
#home .skip:focus{top:8px}

/* ---------- barra superiore ---------- */
.ho-bar{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.ho-bar .ho-w{display:flex;align-items:center;gap:28px;height:44px}
.ho-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.ho-brand svg{width:20px;height:20px;flex:none}
.ho-brand__name{font-family:var(--font-mono);font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.ho-nav{display:flex;gap:2px;margin-right:auto;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}
.ho-nav::-webkit-scrollbar{display:none}
.ho-nav a{font-size:12px;line-height:16px;color:var(--ink-3);text-decoration:none;padding:6px 10px;white-space:nowrap;transition:color var(--dur-fast) var(--ease-standard)}
.ho-nav a:hover{color:var(--ink)}
.ho-ref{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}

/* ---------- copertina ---------- */
.ho-hero{border-bottom:1px solid var(--line)}
.ho-hero .ho-w{display:grid;grid-template-columns:380px minmax(0,1fr);gap:0;min-height:min(760px,calc(100vh - 44px))}
.ho-hero__txt{display:flex;flex-direction:column;justify-content:center;gap:var(--space-4);padding:40px 32px 40px 0}
.ho-h1{margin:0;font-family:var(--font-sans);font-weight:500;font-size:var(--t-h1);line-height:38px;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
.ho-lede{margin:0;font-size:13px;line-height:20px;color:var(--ink-2);max-width:46ch}
.ho-cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.ho-cta .ra-btn{padding:8px 14px}
.ho-facts{display:grid;grid-template-columns:1fr auto;margin:var(--space-3) 0 0;border-top:1px solid var(--line)}
.ho-facts dt,.ho-facts dd{margin:0;padding:7px 0;border-bottom:1px solid var(--line)}
.ho-facts dt{font-family:var(--font-mono);font-size:10px;line-height:16px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.ho-facts dd{font-family:var(--font-mono);font-size:12px;line-height:16px;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.ho-facts dd .ra-unit{margin-left:var(--space-1)}
.ho-scene{position:relative;display:flex;flex-direction:column;min-width:0;border-left:1px solid var(--line);overflow:hidden}
.ho-scene__stage{position:relative;flex:1 1 auto;min-height:500px;overflow:hidden;
  background-color:var(--bg);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px}
.ho-scene__cv{position:absolute;inset:0}
.ho-scene__cv canvas{display:block;width:100%;height:100%;cursor:grab}
.ho-scene__cv canvas:active{cursor:grabbing}
.ho-scene.no3d .ho-scene__stage::after{content:"3D view unavailable in this browser";position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-mono);font-size:11px;color:var(--ink-3)}
/* etichette delle unità: solo sigla, il nome compare sull'unità in evidenza */
.ho-call{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:6px;margin:-22px 0 0;padding:1px 6px;border:1px solid var(--line-strong);border-radius:0;background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--ink);cursor:pointer;white-space:nowrap;will-change:transform;
  font-family:var(--font-mono);font-size:10px;line-height:14px;letter-spacing:.06em;transition:border-color var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
.ho-call b{font-weight:500;color:var(--ink-3)}
.ho-call span{display:none;color:var(--ink-2)}
.ho-call:hover,.ho-call:focus-visible{border-color:var(--ink-2)}
.ho-call:focus-visible{outline:none;box-shadow:var(--shadow-focus)}
.ho-call.is-rel{border-color:var(--ink-3)}
.ho-call.is-rel b{color:var(--ink)}
.ho-call.is-sel{z-index:2;border-color:var(--accent);background:var(--surface-2)}
.ho-call.is-sel b{color:var(--accent)}
.ho-call.is-sel span{display:inline}
.ho-call.is-dim{opacity:.4}
.ho-call--static{pointer-events:none;border-style:dashed;cursor:default}
.ho-call--static b{color:var(--ink-3)}
.ho-scene__open{position:absolute;right:16px;top:16px;display:inline-flex;align-items:center;gap:8px;background:color-mix(in srgb,var(--bg) 85%,transparent)}
.ho-scene__open svg{width:12px;height:12px}
.ho-scene__ctl{position:absolute;left:16px;bottom:16px;display:flex;flex-wrap:wrap;gap:8px}
.ho-scene__ctl .ra-seg{background:color-mix(in srgb,var(--bg) 85%,transparent)}
.ho-scene__hint{position:absolute;right:16px;bottom:18px;margin:0;font-family:var(--font-mono);font-size:10px;line-height:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
/* pannello di lettura sotto la scena: unità in evidenza, alimentazioni, prodotti, legenda dei colori */
.ho-read{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.9fr);height:176px;overflow:hidden;border-top:1px solid var(--line);background:var(--surface-1)}
.ho-read__c{display:flex;flex-direction:column;gap:6px;min-width:0;padding:12px 16px;border-left:1px solid var(--line);overflow:hidden}
.ho-read__c:first-child{border-left:0}
.ho-read__t{display:block}
.ho-read__t .tag{margin-right:8px;font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--accent)}
.ho-read__t .nm{font-size:13px;line-height:18px;font-weight:500;color:var(--ink)}
.ho-read .desc{margin:0;font-size:11px;line-height:16px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ho-read__open{align-self:flex-start;margin-top:auto;padding:4px 10px;font-size:11px}
.ho-read__l{list-style:none;margin:0;padding:0}
.ho-read__l li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:baseline;padding:3px 0;border-bottom:1px solid var(--line);font-family:var(--font-mono);font-size:11px;line-height:16px}
.ho-read__l .id{white-space:nowrap;color:var(--ink)}
.ho-read__l .pt{overflow:hidden;text-overflow:ellipsis;text-align:right;font-size:10px;color:var(--ink-3);white-space:nowrap}
.ho-read__l .v{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.ho-read__l .v i{margin-left:3px;font-size:10px;font-style:normal;color:var(--ink-3)}
.ho-read__l .none{display:block;color:var(--ink-3)}
.ho-key ul{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;font-size:11px;line-height:14px;color:var(--ink-2)}
.ho-key li{display:flex;align-items:center;gap:8px}
.k{display:inline-block;flex:none;box-sizing:border-box;width:16px;height:10px}
.k--sel{border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 32%,var(--surface-1))}
.k--rel{border:1px solid var(--ink)}
.k--flow{height:0;border-top:2px dashed var(--flow)}
.k--idle{border:1px solid var(--ink-3);opacity:.7}

/* ---------- sezioni ---------- */
.ho-sec{padding-block:48px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:var(--space-5)}
.ho-sec__head{display:grid;grid-template-columns:380px minmax(0,1fr);gap:0 32px;align-items:end}
.ho-sec__head>div{display:flex;flex-direction:column;gap:var(--space-2)}
.ho-h2{margin:0;font-family:var(--font-sans);font-weight:500;font-size:var(--t-h2);line-height:26px;letter-spacing:-.01em;color:var(--ink)}
.ho-sec__lede{margin:0;max-width:70ch;font-size:13px;line-height:20px;color:var(--ink-2)}
.ho-note{margin:0;font-size:11px;line-height:16px;color:var(--ink-3)}
.ho-sec .ho-cta{margin-top:var(--space-2)}

/* ---------- mappa dei flussi (site/flowmap.js) ---------- */
#home .flow{background:var(--surface-1);border:1px solid var(--line-strong)}
#home .flow .plot{position:relative;padding:var(--space-4) var(--space-4) var(--space-1)}
#home .flow svg{display:block;width:100%;height:auto;overflow:visible}
#home .flow .pfd-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
#home .flow .leg{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);padding:var(--space-2) var(--space-4) var(--space-3);font-size:12px;line-height:16px;color:var(--ink-3)}
#home .flow .leg span{display:inline-flex;align-items:center;gap:var(--space-2)}
#home .flow .leg i{display:inline-block;width:18px;height:6px;border-radius:1px}
#home .flow .leg i.dash{height:0;border-top:2px dashed var(--ink-3);background:none}
.k-crude{--c:var(--f-crude)}.k-nap{--c:var(--f-nap)}.k-kero{--c:var(--f-kero)}.k-diesel{--c:var(--f-diesel)}.k-vgo{--c:var(--f-vgo)}.k-vr{--c:var(--f-vr)}.k-gasoline{--c:var(--f-gasoline)}.k-lpg{--c:var(--f-lpg)}
.k-gas{--c:var(--f-gas)}.k-fuel{--c:var(--f-fuel)}.k-h2{--c:var(--f-h2)}.k-acid{--c:var(--f-acid)}.k-steam{--c:var(--f-steam)}.k-sulfur{--c:var(--f-sulfur)}.k-coke{--c:var(--f-coke)}.k-mid{--c:var(--f-mid)}
svg.pfd{font-family:var(--font-sans);min-width:0}
svg.pfd text{font-family:var(--font-sans);pointer-events:none}
.fm-node{cursor:pointer;outline:none;transition:opacity var(--dur-fast)}
.fm-node rect.bx{fill:var(--surface-1);stroke:var(--line-strong);stroke-width:1;rx:1}
.fm-node.live rect.bx{stroke:var(--ink-2);stroke-width:1}
.fm-node.plan rect.bx,.fm-node.ext rect.bx{stroke-dasharray:4 3;fill:var(--surface-1);stroke:var(--line)}
.fm-node.ext rect.bx{stroke:var(--ink-3)}
.fm-node .tg{font-family:var(--font-mono);font-weight:500;font-size:15px;letter-spacing:.02em;fill:var(--accent)}
.fm-node .nm{font-size:12px;fill:var(--ink-2);font-weight:500}
.fm-node .fd{font-family:var(--font-mono);font-size:11px;fill:var(--ink-3);font-variant-numeric:tabular-nums}
.fm-node.plan text,.fm-node.ext text{fill:var(--ink-3)}
.fm-node .dot{fill:var(--accent)}.fm-node.plan .dot,.fm-node.ext .dot{fill:none;stroke:var(--ink-3);stroke-width:1.2}
.fm-node .gl{fill:none;stroke:var(--ink-3);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.fm-node.live .gl{stroke:var(--accent)}
.fm-node:hover rect.bx,.fm-node:focus-visible rect.bx,.fm-node.sel rect.bx{stroke:var(--accent);stroke-width:2}
.fm-node:focus-visible rect.bx{stroke-dasharray:none}
.fm-node.prod rect.bx{stroke:var(--line-strong)}
.fm-node.prod .sw{fill:var(--c)}
.fm-node.prod .pn{font-family:var(--font-sans);font-weight:500;font-size:19px;fill:var(--ink)}
.fm-node.prod .pv{font-family:var(--font-mono);font-size:14px;font-weight:500;fill:var(--ink);font-variant-numeric:tabular-nums}
.fm-node.prod .ps{font-family:var(--font-mono);font-size:11px;fill:var(--ink-3)}
.fm-node.prod .gl{stroke:var(--c);stroke-width:1.6}
.fm-band rect{fill:none;stroke:var(--line-strong);stroke-width:1.2;stroke-dasharray:6 4}
.fm-band.live rect{stroke:var(--ink-2)}
.fm-band text{font-size:12px;font-weight:500;fill:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.fm-band{cursor:pointer;outline:none}.fm-band.sel rect,.fm-band:focus-visible rect{stroke:var(--accent);stroke-width:2}
.fm-edge{cursor:pointer;transition:opacity var(--dur-fast)}
.fm-edge .hit{fill:none;stroke:transparent;pointer-events:stroke}
.fm-edge .pipe{fill:none;stroke:var(--c);stroke-opacity:.8;stroke-linecap:butt;stroke-linejoin:round}
.fm-edge.dashed .pipe{stroke-dasharray:5 4;stroke-opacity:.75}
.fm-edge.svc .pipe{stroke-opacity:.9}
.fm-edge .flowline{fill:none;stroke:rgba(255,255,255,.46);stroke-dasharray:3 15;animation:fmflow 2.6s linear infinite;pointer-events:none}
svg.pfd[data-run="0"] .flowline{animation-play-state:paused}
@keyframes fmin{from{opacity:0}}
svg.pfd[data-intro="1"] .fm-node,svg.pfd[data-intro="1"] .fm-hdr,svg.pfd[data-intro="1"] .fm-band{animation:fmin .45s var(--ease-standard) backwards;animation-delay:calc(var(--i,0)*90ms)}
svg.pfd[data-intro="1"] .fm-edge .pipe,svg.pfd[data-intro="1"] .fm-edge .arrow{animation:fmin .45s var(--ease-standard) backwards;animation-delay:calc(var(--i,0)*90ms + 140ms)}
@keyframes fmflow{to{stroke-dashoffset:-36}}
.fm-edge .arrow,.fm-edge .tee{fill:var(--c);pointer-events:none}
.fm-edge .fm-val{display:none;font-family:var(--font-mono);font-size:11px;font-weight:500;fill:var(--ink);font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--surface-1);stroke-width:3px;stroke-linejoin:round}
.fm-edge .fm-val.big,svg.pfd[data-vals="1"] .fm-edge .fm-val,.fm-edge.hot .fm-val{display:block}
.fm-edge:hover .pipe{stroke-opacity:1}
.fm-hdr{cursor:pointer;outline:none;transition:opacity var(--dur-fast)}
.fm-hdr .hit{fill:none;stroke:transparent;pointer-events:stroke}
.fm-hdr .line{fill:none;stroke:var(--c);stroke-width:3;stroke-dasharray:9 4}
.fm-hdr .tee{fill:var(--c)}
.fm-hdr text{font-size:12px;font-weight:500;fill:var(--ink-2)}
.fm-hdr:hover .line,.fm-hdr.sel .line,.fm-hdr:focus-visible .line{stroke-width:5}
svg.pfd.focus .fm-edge:not(.hot){opacity:.1}
svg.pfd.focus .fm-node:not(.hot),svg.pfd.focus .fm-hdr:not(.hot),svg.pfd.focus .fm-band:not(.hot){opacity:.3}
svg.pfd[data-anim="0"] .flowline{display:none}
svg.pfd.no-hc .ly-hc,svg.pfd.no-h2 .ly-h2,svg.pfd.no-fuel .ly-fuel,svg.pfd.no-acid .ly-acid,svg.pfd.no-steam .ly-steam{display:none}
svg.pfd[data-vals="x"] .fm-edge .fm-val{display:none!important}
.fm-tip{position:absolute;z-index:3;max-width:280px;padding:var(--space-2) var(--space-3);background:var(--surface-3);border:1px solid var(--line-strong);border-radius:var(--radius-sm);box-shadow:var(--shadow-pop);font-size:11px;line-height:14px;pointer-events:none;color:var(--ink)}
.fm-tip[hidden]{display:none}
.fm-tip h5{margin:0 0 var(--space-1);font-size:12px;line-height:16px;font-weight:600;color:var(--ink)}.fm-tip ul{margin:0;padding:0;list-style:none}
.fm-tip li{display:flex;justify-content:space-between;gap:var(--space-4);padding:1px 0;color:var(--ink-2)}.fm-tip li b{font-family:var(--font-mono);font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.fm-tip p{margin:var(--space-1) 0 0;color:var(--ink-2)}
#home .flow .fm-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-5);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line);background:var(--surface-2)}
#home .fm-seg{display:flex;align-items:center;gap:var(--space-3)}
#home .fm-lab{font-family:var(--font-mono);font-size:10px;line-height:14px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
#home .fm-seg .grp{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
#home .fm-bar button{font-family:var(--font-mono);font-weight:500;font-size:11px;line-height:14px;letter-spacing:.02em;padding:6px var(--space-3);color:var(--ink-2);background:transparent;border:0;border-radius:1px;cursor:pointer;min-height:28px;transition:background var(--dur-fast) var(--ease-standard)}
#home .fm-bar button:hover{background:var(--surface-3);color:var(--ink)}
#home .fm-bar button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
#home .fm-bar .fm-pill[aria-pressed="true"]{background:transparent;color:var(--ink);border-color:var(--accent)}
#home .fm-bar .fm-pill[aria-pressed="true"]:hover{background:var(--surface-3)}
#home .fm-opts{display:flex;flex-wrap:wrap;gap:var(--space-1)}
#home .fm-bar .fm-pill{border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
#home .fm-bar .fm-pill[aria-pressed="false"]{background:transparent;color:var(--ink-3);text-decoration:line-through;text-decoration-thickness:1px}
#home .fm-sum{margin:0;flex:1 1 260px;font-family:var(--font-mono);font-size:11px;line-height:14px;color:var(--ink-3);text-align:right}
#home .flow .leg .lg-live,#home .flow .leg .lg-plan{display:inline-block;width:16px;height:11px;border:1px solid var(--ink-2);border-radius:1px}
#home .flow .leg .lg-plan{border:1px dashed var(--ink-3)}
#home .flow .leg .lg-hint{flex:1 1 100%;color:var(--ink-3)}
#home .fm-info{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,4fr) minmax(0,4fr);gap:var(--space-5);padding:var(--space-4);border-top:1px solid var(--line-strong);background:var(--surface-2)}
#home .fm-info h3{margin:0;font-family:var(--font-sans);font-weight:500;font-size:18px;line-height:24px;color:var(--ink)}
#home .fm-info h3 small{display:block;margin-top:var(--space-1);font-family:var(--font-mono);font-weight:500;font-size:11px;line-height:14px;color:var(--ink-3)}
#home .fm-info p{margin:var(--space-2) 0 0;font-size:12px;line-height:16px;color:var(--ink-2)}
#home .fm-info h4{margin:0 0 var(--space-2);font-family:var(--font-mono);font-weight:500;font-size:10px;line-height:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
#home .fm-info ul{margin:0;padding:0;list-style:none;font-size:12px;line-height:16px}
#home .fm-info li{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-1) 0;border-top:1px solid var(--line)}
#home .fm-info li:first-child{border-top:0}
#home .fm-info li b{flex:none;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:500;white-space:nowrap;color:var(--ink)}
#home .fm-info li span.n{color:var(--ink-2);overflow-wrap:anywhere}
#home .fm-info .bal{font-size:11px;line-height:14px;color:var(--ink-3)}
#home .fm-info li.bar{position:relative;padding-bottom:6px}
#home .fm-info li.bar i{position:absolute;left:0;bottom:1px;height:2px;background:var(--flow);opacity:.8}
#home .fm-info .btn{margin-top:var(--space-3)}
#home .btn{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-sans);font-size:12px;line-height:16px;font-weight:500;color:var(--on-accent);background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-4);cursor:pointer;text-decoration:none;transition:filter var(--dur-fast) var(--ease-standard)}
#home .btn:hover{filter:brightness(1.1)}
#home .btn svg{width:14px;height:14px;flex:none}


/* ---------- percorso di processo: indice a icone ---------- */
.ho-path{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ho-stage{display:grid;grid-template-columns:24px 232px minmax(0,1fr);column-gap:var(--space-4);padding-block:16px;border-bottom:1px solid var(--line)}
.ho-stage:last-child{border-bottom:0}
.ho-stage__rail{position:relative}
.ho-stage__node{display:block;width:24px;height:16px;font-family:var(--font-mono);font-size:10px;line-height:16px;font-weight:500;color:var(--accent);letter-spacing:.04em}
.ho-stage__head{display:flex;flex-direction:column;gap:var(--space-1);padding-top:0}
.ho-stage__head h3{margin:0}
.ho-stage__head .ho-h3{font-family:var(--font-sans);font-weight:500;font-size:13px;line-height:16px;color:var(--ink)}
.ho-stage__out{font-family:var(--font-mono);font-size:10px;line-height:14px;letter-spacing:.02em;color:var(--ink-3);overflow-wrap:anywhere}
.ho-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));padding:0 1px 1px 0}
.ho-tile{position:relative;box-sizing:border-box;display:flex;align-items:center;gap:10px;height:52px;padding:0 10px;margin:0 -1px -1px 0;border:1px solid var(--line);background:var(--surface-1);color:var(--ink-2);text-decoration:none;cursor:pointer;
  transition:background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.ho-tile__ico{flex:none;display:grid;place-items:center;width:32px;height:32px;color:var(--ink-2);transition:color var(--dur-fast) var(--ease-standard)}
.ho-tile__ico svg{width:32px;height:32px;display:block}
.ho-tile__txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1 1 auto}
.ho-tile__code{font-family:var(--font-mono);font-size:10px;line-height:12px;letter-spacing:.04em;color:var(--ink-3)}
.ho-tile__name{font-size:12px;line-height:16px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ho-tile__val{flex:none;font-family:var(--font-mono);font-size:10px;line-height:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;text-align:right}
.ho-tile:hover{background:var(--surface-2);border-color:var(--line-strong);z-index:1}
.ho-tile:hover .ho-tile__ico,.ho-tile:focus-visible .ho-tile__ico{color:var(--accent)}
#home .ho-tile:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;z-index:2}
.ho-tile[aria-disabled="true"]{cursor:default;opacity:.55}

/* ---------- come funziona ---------- */
.ho-how__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;border:1px solid var(--line)}
.ho-feat{display:grid;grid-template-columns:28px minmax(0,1fr);gap:var(--space-1) var(--space-3);padding:var(--space-4);border-right:1px solid var(--line);align-content:start}
.ho-feat:last-child{border-right:0}
.ho-feat svg{width:24px;height:24px;color:var(--accent);grid-row:span 2}
.ho-feat h3{margin:0;font-family:var(--font-sans);font-size:13px;line-height:18px;font-weight:500;color:var(--ink)}
.ho-feat p{margin:0;font-size:12px;line-height:18px;color:var(--ink-2)}

/* ---------- indicatori ---------- */
.ho-kpis.ra-frame{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line)}
.ho-kpis>.ra-kpi{background:var(--surface-1)}
.ho-main .ra-kpi__row{flex-wrap:wrap}
.ho-foot{padding-block:32px 48px}

/* ---------- bilancio ---------- */
.ho-panel{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);min-width:0}
.ho-panel .ra-table-wrap{margin:0 calc(var(--space-5) * -1)}
.ho-table .ra-table{min-width:520px}
.ho-table .ra-table th:first-child,.ho-table .ra-table td:first-child{padding-left:var(--space-5)}
.ho-table .ra-table th:last-child,.ho-table .ra-table td:last-child{padding-right:var(--space-5)}
.ho-table .ra-table td.txt{font-family:var(--font-sans)}
.ho-table .ra-table caption .ra-label{padding-left:var(--space-5)}
.ho-table tfoot th,.ho-table tfoot td{border-top:1px solid var(--line-strong);border-bottom:0;font-weight:500}
.ho-table tfoot th{background:none;text-transform:none;letter-spacing:0;font-family:var(--font-mono);font-size:12px;line-height:16px;color:var(--ink)}


/* ---------- ingresso orchestrato: un solo momento forte ---------- */
.ho-hero__txt>*{animation:ra-in var(--dur-base) var(--ease-standard) both}
.ho-hero__txt>*:nth-child(1){animation-delay:60ms}.ho-hero__txt>*:nth-child(2){animation-delay:140ms}.ho-hero__txt>*:nth-child(3){animation-delay:220ms}.ho-hero__txt>*:nth-child(4){animation-delay:300ms}.ho-hero__txt>*:nth-child(5){animation-delay:380ms}
.ho-scene{animation:ra-fade 600ms var(--ease-standard) 200ms both}
@keyframes ra-fade{from{opacity:0}}
.ho-tiles>.ho-tile{animation:ra-in var(--dur-base) var(--ease-standard) both;animation-delay:calc(var(--i,0)*30ms + 250ms)}

/* ---------- schermi stretti ---------- */
@media (max-width:1100px){
  .ho-hero .ho-w{grid-template-columns:minmax(0,1fr)}
  .ho-hero__txt{padding:32px 0 24px}
  .ho-scene{border-left:0;border-top:1px solid var(--line);margin-inline:-24px}
  .ho-scene__stage{min-height:480px}
  .ho-sec__head{grid-template-columns:minmax(0,1fr);gap:var(--space-2)}
}
@media (max-width:980px){
  #home .flow svg.pfd{min-width:980px}
  #home .fm-sum{text-align:left}
  #home .fm-info{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #home .fm-info>div:first-child{grid-column:1/-1}
}
@media (max-width:760px){
  .ho-w{padding-inline:16px}
  .ho-bar .ho-w{gap:12px}
  .ho-ref{display:none}
  .ho-scene{margin-inline:-16px}
  .ho-scene__stage{min-height:0;height:540px}
  .ho-call:not(.is-sel){display:none}
  .ho-read{grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:auto}
  .ho-read__id{grid-column:1/-1;border-left:0;min-height:112px}
  .ho-read__c{padding:10px 16px}
  .ho-read__c:nth-child(2){border-left:0}
  .ho-key{grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}
  .ho-key ul{flex-direction:row;flex-wrap:wrap;gap:6px 16px}
  .ho-h1{font-size:28px;line-height:32px}
  .ho-stage{grid-template-columns:minmax(0,1fr);row-gap:var(--space-3)}
  .ho-stage__rail{display:none}
  .ho-tiles{grid-template-columns:minmax(0,1fr)}
  .ho-brand__name{display:none}
  .ho-scene__hint{display:none}
  .ho-scene__open{top:12px;right:12px}
  .ho-scene__ctl{left:12px;bottom:12px}
  .ho-sec{padding-block:32px}
  .ho-panel{padding:var(--space-4)}
  .ho-panel .ra-table-wrap{margin:0 calc(var(--space-4) * -1)}
  .ho-table .ra-table th:first-child,.ho-table .ra-table td:first-child{padding-left:var(--space-4)}
  .ho-table .ra-table th:last-child,.ho-table .ra-table td:last-child{padding-right:var(--space-4)}
  .ho-table .ra-table caption .ra-label{padding-left:var(--space-4)}
  .ho-feat{border-right:0;border-bottom:1px solid var(--line)}.ho-feat:last-child{border-bottom:0}
  #home .fm-info{grid-template-columns:minmax(0,1fr)}
  #home .fm-bar button{white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  .ho-hero__txt>*,.ho-scene,.ho-tiles>.ho-tile{animation:none}
  .ho-tile,.ho-nav a,.ho-call{transition:none}
  svg.pfd[data-intro="1"] *{animation:none!important}
}

/* ---------- dettagli ---------- */
.ra-cartiglio .s12{grid-column:1/-1}
.ho-how__shot figcaption{padding:var(--space-2) var(--space-3);border-top:1px solid var(--line)}
.ho-cartiglio-note{font-size:11px;line-height:14px;color:var(--ink-2);max-width:96ch}

/* PFD: barra a tre gruppi (Segui, Mostra, Vista) e percorsi pronti */
#home .fm-grp{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3)}
#home .fm-grp .grp{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
#home .fm-lab.sub{letter-spacing:.02em;text-transform:none;font-weight:400;margin-left:var(--space-2)}
#home .fm-clear{border:1px solid var(--line-strong)!important;border-radius:var(--radius-sm)!important}
#home .fm-clear:disabled{opacity:.4;cursor:default}
#home .fm-chip{display:inline-flex;align-items:center;gap:var(--space-2)}
#home .fm-chip i{display:inline-block;width:12px;height:6px;border-radius:1px}
#home .fm-bar .fm-chip[aria-pressed="false"] i{opacity:.35}
#home .fm-sel{font-family:var(--font-mono);font-size:11px;line-height:14px;min-height:28px;padding:4px var(--space-3);color:var(--ink);background:var(--surface-1);border:1px solid var(--line-strong);border-radius:var(--radius-sm);max-width:100%}
#home .fm-sel:focus-visible{outline:none;box-shadow:var(--shadow-focus)}
#home .fm-focus{margin:0;flex:1 1 100%;font-family:var(--font-mono);font-size:11px;line-height:14px;color:var(--ink);min-height:16px}
#home .fm-sum{flex:1 1 100%;text-align:left}

/* PFD: zoom e spostamento */
#home .fm-zoom{display:inline-flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--line-strong);border-radius:var(--radius-sm)}
#home .fm-zoom button{font-family:var(--font-mono);font-weight:500;font-size:11px;line-height:14px;min-width:32px;min-height:28px;padding:0 var(--space-2);color:var(--ink);background:transparent;border:0;border-radius:1px;cursor:pointer;transition:background var(--dur-fast)}
#home .fm-zoom button:hover:not(:disabled){background:var(--surface-3)}
#home .fm-zoom button:disabled{color:var(--ink-3);opacity:.45;cursor:default}
#home .fm-zoom button:focus-visible{outline:none;box-shadow:var(--shadow-focus)}
#home .fm-zoom .fm-zlev{font-family:var(--font-mono);font-size:11px;line-height:14px;color:var(--ink-3);padding:0 var(--space-2);min-width:36px;text-align:right}
svg.pfd[data-zoomed="1"]{cursor:grab;touch-action:none}
svg.pfd.panning{cursor:grabbing}
svg.pfd{user-select:none;-webkit-user-select:none}
