/* Scena 3D Hârtie de pe homepage. Fără WebGL, secțiunea rămâne un bloc simplu de carduri. */
.hartie-story { position: relative; z-index: 1; padding: 56px clamp(16px, 5vw, 72px); background: #F1F5F9; display: grid; gap: 16px; }
.hartie-beat .hartie-card { width: min(100%, 460px); padding: 24px; border-radius: 10px; background: #FBF9F5; box-shadow: 0 10px 32px rgba(50, 40, 25, .14); }
.hartie-card .hartie-eyebrow { margin: 0 0 10px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #0F766E; }
.hartie-card h2 { margin: 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.14; letter-spacing: -.015em; color: #17202A; }
.hartie-card p:not(.hartie-eyebrow) { margin: 12px 0 0; color: #475569; }
.hartie-card .btn { margin-top: 20px; }

#hartie-scena { position: fixed; inset: 0; width: 100%; height: 100lvh; display: block; pointer-events: none; z-index: -1; visibility: hidden; }

html.hartie-on #hartie-scena.is-vizibil { visibility: visible; }

/* Până la primul cadru, zona are culoarea scenei, ca textul deschis să rămână lizibil. */
html.hartie-on #acasa, html.hartie-on .hartie-story { background: #0A1626; }
html.hartie-live #acasa, html.hartie-live .hartie-story { background: transparent; }

html.hartie-on #acasa { position: relative; z-index: 1; --ink: #F8FAFC; --muted: #CBD5E1; color: #F8FAFC; }
html.hartie-on #acasa .hero-world { display: none; }
html.hartie-on #acasa .hero-copy { position: relative; margin-top: 12px; padding: 24px 32px 36px; width: min(1240px, 94vw); max-width: none; }
html.hartie-on #acasa h1 { color: #F8FAFC; font-size: clamp(42px, 6.4vw, 96px); line-height: .98; letter-spacing: -.035em; }
html.hartie-on #acasa .hero-lead { color: #DCE4EE; }
html.hartie-on #acasa .hero-note { color: #C4CFDC; }
html.hartie-on #acasa .btn--ghost { color: #F8FAFC; border-color: rgba(248, 250, 252, .55); background: transparent; }
html.hartie-on #acasa .scroll-cue { color: #DCE4EE; }

html.hartie-on .hartie-story { display: block; padding: 0 clamp(16px, 7vw, 112px); }
html.hartie-on .hartie-beat { min-height: 88vh; display: flex; align-items: center; }
html.hartie-on .hartie-beat--dreapta { justify-content: flex-end; }
html.hartie-on .hartie-beat .hartie-card { width: min(100%, 560px); padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
html.hartie-on .hartie-card .hartie-eyebrow { color: #FB923C; }
html.hartie-on .hartie-card h2 { color: #F8FAFC; font-size: clamp(36px, 4.8vw, 72px); line-height: 1; letter-spacing: -.03em; }
html.hartie-on .hartie-card p:not(.hartie-eyebrow) { margin-top: 18px; font-size: 18px; color: #DCE4EE; }

/* Secțiunile de după scenă au nevoie de fundal propriu, ca să acopere pânza fixă. */
html.hartie-on .trust, html.hartie-on #solutii { position: relative; z-index: 1; background: #F8FAFC; }

@media (max-width: 760px) {
  html.hartie-on #acasa .hero-copy { padding: 16px 14px 28px; }
  html.hartie-on .hartie-beat { min-height: 105vh; align-items: flex-start; justify-content: flex-start; padding-top: 12vh; }
  /* Pe telefon textul rămâne pe zona umbrită din partea de jos cât timp pasul e pe ecran. */
  html.hartie-on .hartie-beat .hartie-card { position: sticky; top: 50vh; padding: 0; text-shadow: 0 1px 14px rgba(10, 22, 38, .9); }
  html.hartie-live .hartie-beat .hartie-card { opacity: 0; transition: opacity .22s linear; }
  html.hartie-live .hartie-beat .hartie-card.is-activ, html.hartie-live .hartie-beat .hartie-card:focus-within { opacity: 1; }
  html.hartie-on #acasa .scroll-cue { text-shadow: 0 1px 10px rgba(10, 22, 38, .95); }
}