/* =========================================================
   Vallenergia — Business · scena scroll del capannone
   ========================================================= */

/* Hero business (scuro) */
.b-hero { background: radial-gradient(120% 120% at 80% -10%, var(--ink-3), var(--ink) 55%); color:#fff; }
.b-hero .hero__inner { display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(30px,5vw,64px); align-items:center; }
@media (max-width: 920px){ .b-hero .hero__inner { grid-template-columns: 1fr; } }
.b-hero h1 { color:#fff; }
.b-hero .lead { color: rgba(255,255,255,.74); max-width: 56ch; }
.b-hero__art { position: relative; }
.b-hero .checklist li { color: rgba(255,255,255,.85); }
.b-hero .checklist .tick { background: rgba(140,219,98,.15); color: var(--lime-soft); }

/* ====== STORY: scena sticky + capitoli ====== */
.story { position: relative; background: linear-gradient(180deg, var(--ink) 0%, #08263d 100%); color:#fff; }
.story__grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; }
@media (max-width: 980px){ .story__grid { grid-template-columns: 1fr; } }

/* Colonna visuale sticky */
.story__visual {
  position: sticky; top: 0; height: 100vh; min-height: 600px;
  display: grid; place-items: center; padding: 4vh clamp(10px,3vw,40px);
}
@media (max-width: 980px){
  .story__visual { height: 64vh; min-height: 0; top: 56px; z-index: 5;
    background: linear-gradient(180deg, #08263d, rgba(8,27,43,.0)); }
}
.scene-wrap { width: 100%; max-width: 620px; position: relative; }
.scene { width: 100%; height: auto; overflow: visible; }

/* Etichetta valore che galleggia sulla scena */
.scene-badge {
  position: absolute; left: 50%; bottom: 2%; transform: translateX(-50%) translateY(10px);
  display: flex; gap: 22px; align-items: center;
  padding: 14px 22px; border-radius: 16px;
  background: rgba(7,26,42,.7); backdrop-filter: blur(8px); border:1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow-lg); opacity: 0; transition: opacity var(--t) var(--ease), transform var(--t) var(--ease);
}
.scene-badge.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.scene-badge .b { display:flex; flex-direction:column; line-height:1.1; }
.scene-badge .b .v { font-family: var(--font-display); font-weight: 800; font-size: 1.5rem;
  background: linear-gradient(120deg, var(--lime-soft), var(--lime)); -webkit-background-clip:text; background-clip:text; color: transparent; }
.scene-badge .b .k { font-size: .72rem; color: rgba(255,255,255,.6); text-transform: uppercase; letter-spacing: .08em; }
.scene-badge .sep { width:1px; height:30px; background: rgba(255,255,255,.16); }

/* Colonna capitoli */
.story__chapters { padding: 0 clamp(20px,5vw,64px); }
.chapter { min-height: 86vh; display: flex; flex-direction: column; justify-content: center; padding-block: 8vh; }
.chapter:first-child { min-height: 70vh; }
.chapter:last-child { min-height: 78vh; }
@media (max-width: 980px){ .chapter { min-height: 64vh; padding-block: 5vh; } }
.chapter__num { font-family: var(--font-display); font-weight: 700; font-size: .85rem; letter-spacing:.18em; color: var(--lime-soft); margin-bottom: 14px; display:flex; align-items:center; gap:12px; }
.chapter__num::before{ content:""; width: 30px; height:2px; background: var(--lime); border-radius:2px; }
.chapter h2 { color:#fff; font-size: clamp(1.7rem, 3.2vw, 2.6rem); margin-bottom: 14px; }
.chapter p { color: rgba(255,255,255,.74); font-size: 1.08rem; max-width: 46ch; }
.chapter .mini-stats { display:flex; gap: 28px; margin-top: 26px; flex-wrap: wrap; }
.chapter .mini-stats .num { font-family: var(--font-display); font-weight: 800; font-size: 2rem;
  background: linear-gradient(120deg, var(--blue-300), var(--lime)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.chapter .mini-stats .k { font-size: .82rem; color: rgba(255,255,255,.6); }
.chapter .chip-row { display:flex; flex-wrap:wrap; gap:10px; margin-top: 22px; }
.chapter .chip { padding:.5em 1em; border-radius:999px; font-size:.9rem; font-weight:600; font-family:var(--font-display);
  background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); color:#fff; }

/* fade-in capitolo attivo (gestito da JS via .is-active) */
.chapter > * { opacity: .25; transform: translateY(16px); transition: opacity var(--t) var(--ease), transform var(--t) var(--ease); }
.chapter.is-active > * { opacity: 1; transform: none; }
.chapter.is-active > *:nth-child(2){ transition-delay:.05s }
.chapter.is-active > *:nth-child(3){ transition-delay:.1s }
.chapter.is-active > *:nth-child(4){ transition-delay:.15s }
@media (prefers-reduced-motion: reduce){ .chapter > *{ opacity:1; transform:none; } }

/* ====== SVG scene: elementi animabili ====== */
.scene .sky-sun { transform-box: fill-box; transform-origin: center; transition: opacity var(--t-slow) var(--ease); }
.scene .sun-core { animation: sunPulse 5s ease-in-out infinite; transform-box: fill-box; transform-origin:center; }
@keyframes sunPulse { 0%,100%{ filter: drop-shadow(0 0 6px rgba(52,197,178,.6)); } 50%{ filter: drop-shadow(0 0 18px rgba(52,197,178,.95)); } }
.scene .ray { transform-box: fill-box; transform-origin: center; opacity: 0; transition: opacity var(--t) var(--ease); }
.scene.s-sun .ray { opacity: .85; animation: rayShimmer 4s ease-in-out infinite; }
.scene .ray:nth-child(2n){ animation-delay:.6s }
.scene .ray:nth-child(3n){ animation-delay:1.2s }
@keyframes rayShimmer { 0%,100%{ opacity:.4 } 50%{ opacity:.9 } }

/* pannelli: ogni cella parte invisibile e compare */
.scene .panel {
  opacity: 0; transform-box: fill-box; transform-origin: center;
  transform: scale(.4); transition: opacity .5s var(--ease-out), transform .55s var(--ease-out);
}
.scene .panel.on { opacity: 1; transform: scale(1); }

/* flussi di energia (linee tratteggiate verso inverter) */
.scene .flow { stroke-dasharray: 7 9; opacity: 0; transition: opacity var(--t) var(--ease); }
.scene.s-flow .flow { opacity: 1; animation: flowMove 1.1s linear infinite; }
@keyframes flowMove { to { stroke-dashoffset: -32; } }
.scene .inverter, .scene .meter { opacity:.25; transition: opacity var(--t) var(--ease); }
.scene.s-flow .inverter, .scene.s-flow .meter { opacity: 1; }
.scene .spark { opacity:0; transform-box:fill-box; transform-origin:center; }
.scene.s-flow .spark { animation: sparkPop 1.6s ease-in-out infinite; }
@keyframes sparkPop { 0%,100%{ opacity:0; transform: scale(.6);} 40%{ opacity:1; transform: scale(1);} }

/* foglie / co2 risparmiata */
.scene .leaf { opacity: 0; transform-box: fill-box; transform-origin:center bottom; transition: opacity var(--t) var(--ease), transform var(--t) var(--ease); }
.scene.s-eco .leaf { opacity: 1; }
.scene.s-eco .leaf { animation: floatLeaf 6s ease-in-out infinite; }
@keyframes floatLeaf { 0%,100%{ transform: translateY(0) rotate(0); } 50%{ transform: translateY(-10px) rotate(6deg); } }

/* haze / atmosfera */
.scene .ground-glow { opacity:.0; transition: opacity var(--t-slow) var(--ease); }
.scene.s-sun .ground-glow, .scene.s-flow .ground-glow, .scene.s-eco .ground-glow { opacity:1; }

/* barra avanzamento capitoli */
.story-progress { position: absolute; left: 50%; transform: translateX(-50%); top: 14px; z-index: 6;
  display:flex; gap: 8px; }
@media (max-width: 980px){ .story-progress{ top: auto; bottom: 8px; } }
.story-progress span { width: 26px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.18); transition: background var(--t), width var(--t); }
.story-progress span.on { background: var(--lime); width: 34px; }

/* ====== Mobile: alleggerisce la scena (niente pin a tutta altezza) ====== */
@media (max-width: 980px){
  .story__visual { position: relative; top:auto; height:auto; min-height:0; padding: 8px 0 0; background:none; }
  .story-progress, .scene-badge { display:none; }
  .scene-wrap { max-width: 440px; }
  /* su mobile la scena è composta una volta sola: testi sempre pieni */
  .chapter > * { opacity:1; transform:none; }
}

/* ====== Micro-interazioni premium sezione business ====== */

/* Chip story-progress più netto */
.story-progress span { width: 22px; height: 3px; border-radius: 2px; opacity:.65; transition: background var(--t-fast), width .3s var(--ease), opacity .3s; }
.story-progress span.on { background: var(--teal-light); width: 36px; opacity:1; }

/* Chip capitoli: hover su link interni */
.chapter .chip { transition: background var(--t-fast), border-color var(--t-fast); }
.chapter .chip:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); }

/* scene-badge: transizione più fluida */
.scene-badge { transition: opacity .4s var(--ease), transform .4s var(--ease); }

/* Incentive card: nessun lift (sono blocchi informativi, non cliccabili) */
.incentive.reveal.in { will-change: auto; }

/* b-results su dark: stat counter più nitido */
.b-results .stat .num { filter: none; }

/* Plan card reveal fix (stessa logica delle card normali) */
.plan { transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease); }
.plan:hover { transform: translateY(-4px); box-shadow: 0 16px 40px -18px rgba(7,26,42,.24); }