/* =============================================================
   /historia — 10 cenas, um traço contínuo em Ouro, corte de luz na cena 05
   ============================================================= */
.hs{position:relative; background:var(--navy-deep); color:var(--papel)}
.hs-progresso{position:fixed; top:0; left:0; right:0; height:3px; background:transparent; z-index:80}
.hs-progresso span{display:block; height:100%; width:0; background:var(--ouro)}

/* O traço único, absoluto sobre toda a altura do documento */
.hs-linha{position:absolute; inset:0; z-index:1; pointer-events:none}
.hs-linha svg{width:100%; height:100%}
.hs-linha path{stroke:var(--ouro); fill:none; stroke-width:1.5; stroke-dasharray:1; stroke-dashoffset:1}
.hs.claro .hs-linha path{stroke:var(--ouro-ink)}

.hs-cena{position:relative; z-index:2; min-height:90vh; display:flex; align-items:center; padding:var(--sp-8) 0}
.hs-cena .container{display:grid; gap:var(--sp-6); align-items:center}
@media (min-width:901px){.hs-cena .container{grid-template-columns:1fr 1fr; gap:var(--sp-12)}}

.hs-escuro-0{background:var(--navy-deep)}
.hs-escuro-1{background:var(--navy)}
.hs-claro{background:var(--papel); color:var(--carvao)}
.hs-claro .hs-num{color:var(--ouro-ink)}
.hs-claro .hs-texto{color:rgba(23,24,26,.86)}

.hs-num{font-family:var(--f-mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ouro); display:block; margin-bottom:var(--sp-2)}
.hs-titulo{font-family:var(--f-display); font-weight:600; letter-spacing:-.02em; line-height:1.1; font-size:clamp(1.7rem,3.6vw,2.7rem)}
.hs-texto{font-size:1.08rem; line-height:1.62; margin-top:var(--sp-3); color:rgba(246,241,231,.86); max-width:56ch}
.hs-arte{border:0}
.hs-arte svg{width:100%; height:auto}
.hs-selo{font-family:var(--f-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; opacity:.6; margin-top:var(--sp-3)}

.hs-hero{min-height:100vh; display:flex; align-items:center; text-align:left}
.hs-hero .hs-titulo{font-size:clamp(2.6rem,6vw,4.5rem)}

/* Botão fixo a partir da cena 05 */
.hs-fixo{
  position:fixed; right:var(--sp-3); bottom:var(--sp-3); z-index:70;
  opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity .3s var(--ease-out), transform .3s var(--ease-out);
}
.hs-fixo.on{opacity:1; transform:none; pointer-events:auto}

.hs-pular{font-family:var(--f-mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; opacity:.66}

@media (prefers-reduced-motion:reduce){
  .hs-linha path{stroke-dashoffset:0 !important}
}

/* Arte: contorno puro, sem preenchimento */
.hs-arte svg{stroke:var(--ouro); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.hs-claro .hs-arte svg{stroke:var(--ouro-ink)}
.hs-arte .solido{fill:var(--ignea); stroke:none}
.hs-arte .rot{font-family:var(--f-mono); font-size:11px; letter-spacing:.1em; fill:var(--ouro); stroke:none}
.hs-claro .hs-arte .rot{fill:var(--ouro-ink)}
.hs-arte .rot-ignea{fill:var(--ignea); stroke:none; font-family:var(--f-mono); font-size:11px; letter-spacing:.1em}
.hs-arte .hachura{stroke-width:.8; opacity:.3}
.hs-arte .fantasma{opacity:.22; stroke-dasharray:3 5}
.hs-arte .ignea{stroke:var(--ignea)}
.hs-arte .grade{stroke-width:.6; opacity:.10}
