/* INVIZIBILII v3 · sistemul vizual al site-ului filmului, montat ca o carte care se deschide */
@font-face{font-family:"Fraunces";src:url(../assets/fonts/Fraunces.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(../assets/fonts/SourceSerif4.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(../assets/fonts/SourceSerif4-Italic.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url(../assets/fonts/Inter-latin.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";src:url(../assets/fonts/Inter.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02AF,U+0218-021B,U+1E00-1EFF}

:root{
  --navy:#0f1119;--navy-2:#161a26;--navy-3:#1f2433;
  --cream:#ece4d4;--cream-dim:#b9b1a2;--paper:#f2ebdf;--paper-2:#e9dfcd;--ink:#1b1a17;--ink-dim:#5a5348;
  --gold:#c99a45;--gold-l:#e6c886;--gold-d:#8f6a2a;
  --display:"Fraunces",Georgia,serif;--serif:"Source Serif 4",Georgia,serif;--ui:"Inter",system-ui,sans-serif;
  --gut:clamp(20px,5vw,72px);--maxw:1240px;
  --edge:max(var(--gut),calc((100vw - var(--maxw)) / 2));
  --out:cubic-bezier(.23,1,.32,1);--expo:cubic-bezier(.16,1,.3,1);
  --vh:100svh;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--navy);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--cream);font-family:var(--serif);font-size:clamp(16px,1.05vw + 10px,19px);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--gold);color:var(--ink);padding:10px 14px;font-family:var(--ui);font-size:14px}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px}

/* ---------- buttons ---------- */
.btn-gold{display:inline-flex;align-items:center;justify-content:center;background:var(--gold);color:var(--ink);font-family:var(--ui);font-weight:600;font-size:14px;text-decoration:none;padding:10px 18px;border-radius:2px;border:0;transition:background .3s var(--out),transform .3s var(--out)}
.btn-gold:hover{background:var(--gold-l)}
.btn-gold:active{transform:scale(.97)}
.btn-gold.big{font-size:15px;padding:16px 26px}
.btn-ghost{display:inline-flex;align-items:center;gap:10px;background:transparent;border:1px solid rgba(236,228,212,.35);color:var(--cream);font-family:var(--ui);font-size:15px;padding:15px 20px;border-radius:2px;transition:border-color .3s,background .3s}
.btn-ghost:hover{border-color:var(--gold-l);background:rgba(201,154,69,.08)}
.cue-ic{width:0;height:0;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent;display:inline-block}
.cue.playing .cue-ic{width:8px;height:10px;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor}
.cue-chip{display:inline-flex;align-items:center;gap:10px;background:none;border:0;border-bottom:1px solid currentColor;padding:6px 0;font-family:var(--ui);font-size:14px;color:var(--ink)}
.cue-chip b{font-weight:600}
.cue-chip.light{color:var(--cream)}
.cue-chip:hover{color:var(--gold-d)}
.cue-chip.light:hover{color:var(--gold-l)}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;gap:24px;height:64px;padding:0 var(--gut);background:linear-gradient(180deg,rgba(15,17,25,.7),rgba(15,17,25,0));transition:background .5s var(--out)}
.nav.solid{background:rgba(15,17,25,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.nav-mark img{height:22px;width:auto}
.nav-chapter{margin:0;display:flex;gap:10px;align-items:baseline;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--cream-dim)}
.nav-chapter .nc-t{color:var(--cream)}
.nav-tools{margin-left:auto;display:flex;align-items:center;gap:16px}
.nav-cd{font-family:var(--ui);font-size:13px;color:var(--cream-dim);font-variant-numeric:tabular-nums}
.nav-cd b{color:var(--cream);font-weight:500}
.snd{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid rgba(236,228,212,.25);border-radius:2px;padding:8px 12px;font-family:var(--ui);font-size:13px}
.snd[aria-pressed="true"]{border-color:var(--gold);color:var(--gold-l)}
.bars{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.bars i{width:2px;height:4px;background:currentColor;border-radius:1px}
.bars.on i,.snd[aria-pressed="true"] .bars i{animation:bar .9s var(--out) infinite alternate}
.bars i:nth-child(2){animation-delay:-.3s!important}.bars i:nth-child(3){animation-delay:-.6s!important}.bars i:nth-child(4){animation-delay:-.15s!important}
@keyframes bar{from{height:3px}to{height:12px}}

/* ---------- shared scene type ---------- */
.chap{margin:0;display:flex;align-items:baseline;gap:18px;font-family:var(--serif);font-size:clamp(15px,1.1vw,18px);color:var(--ink-dim)}
.chap em{color:var(--gold-d)}
.chap .pg{font-family:var(--ui);font-size:12px;letter-spacing:.04em}
.chap.light{color:var(--cream-dim)}.chap.light em{color:var(--gold-l)}
.ln{margin:0;overflow:hidden;padding-bottom:.06em}
.ln>span{display:inline-block}
.credit{font-family:var(--ui);font-size:12px;color:var(--cream-dim);margin:18px 0 0}

/* =========================================================
   ACT A · coperta + capitolul 1
   ========================================================= */
.act-a .pin{display:flex;flex-direction:column}
.cover{order:-1;position:relative;height:var(--vh);min-height:560px}
.cover-face{position:absolute;inset:0;overflow:hidden;background:var(--navy)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:100% 50%;transform-origin:70% 40%}
.hero-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(15,17,25,.94) 0%,rgba(15,17,25,.7) 30%,rgba(15,17,25,0) 52%),
  linear-gradient(180deg,rgba(15,17,25,.55) 0%,rgba(15,17,25,0) 18%,rgba(15,17,25,0) 70%,rgba(15,17,25,.85) 100%)}
.hero-copy{position:absolute;left:var(--edge);top:50%;transform:translateY(-44%);width:var(--copy-w,min(40vw,560px))}
.presents{margin:0 0 18px;font-family:var(--serif);font-style:italic;font-size:clamp(15px,1.1vw,18px);color:var(--cream-dim)}
.hero-title{margin:0;line-height:0}
.hero-title img{width:var(--logo-w,100%);height:auto;filter:drop-shadow(0 10px 40px rgba(0,0,0,.55))}
.hero-kicker{margin:20px 0 0;font-family:var(--display);font-style:italic;font-weight:400;font-size:clamp(28px,2.9vw,46px);line-height:1.05;color:var(--gold-l);font-variation-settings:"opsz" 144}
.hero-meta{margin:14px 0 0;font-family:var(--ui);font-size:15px;color:var(--cream)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.open-cue{position:absolute;left:var(--edge);bottom:28px;margin:0;display:flex;align-items:center;gap:14px;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--cream-dim)}
.oc-line{width:56px;height:1px;background:var(--gold);transform-origin:left;animation:oc 2.4s var(--out) infinite}
@keyframes oc{0%{transform:scaleX(0)}60%,100%{transform:scaleX(1);opacity:0}}
.cover-dim,.cover-back,.spine-light,.page-shadow{display:none}

/* page 1 (static flow) */
.page1{position:relative;min-height:var(--vh);background:var(--paper);color:var(--ink);overflow:hidden;
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-content:start;
  padding:clamp(88px,12vh,120px) 0 clamp(40px,7vh,72px) var(--edge)}
.p1-grain{position:absolute;inset:0;pointer-events:none;opacity:.5;background:
  radial-gradient(120% 80% at 0% 0%,rgba(255,255,255,.55),rgba(255,255,255,0) 60%),
  radial-gradient(90% 70% at 100% 100%,rgba(143,106,42,.12),rgba(143,106,42,0) 60%)}
.page1 .chap{grid-column:1/7;grid-row:1;position:relative;z-index:2}
.c1-title{grid-column:1/8;grid-row:2;position:relative;z-index:3;margin:clamp(10px,3vh,32px) 0 0;font-family:var(--display);font-weight:400;font-size:clamp(60px,8.8vw,160px);line-height:.88;letter-spacing:-.025em;font-variation-settings:"opsz" 144;color:var(--ink)}
.c1-title .w{display:block;white-space:nowrap}
.c1-title .ch{display:inline-block;will-change:transform}
.c1-lines{grid-column:1/6;grid-row:3;position:relative;z-index:2;margin-top:clamp(20px,4vh,44px);font-size:clamp(17px,1.25vw,21px);line-height:1.5;color:var(--ink)}
.c1-songs{grid-column:1/6;grid-row:4;justify-self:start;margin-top:22px;position:relative;z-index:2}
.c1-photo{position:absolute;top:0;bottom:0;right:0;width:52%;margin:0}
.c1-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 30%}
.c1-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(242,235,223,.55) 0%,rgba(242,235,223,0) 14%),linear-gradient(180deg,rgba(15,17,25,.35) 0%,rgba(15,17,25,0) 16%,rgba(15,17,25,0) 70%,rgba(15,17,25,.5))}
.c1-photo figcaption{position:absolute;right:var(--gut);bottom:18px;z-index:2;font-family:var(--ui);font-size:12px;color:var(--cream)}
.c1-colegi{position:absolute;z-index:3;left:calc(48% - clamp(180px,19vw,300px) * .5);bottom:clamp(40px,8vh,80px);width:clamp(180px,19vw,300px);margin:0;transform:rotate(-2.5deg)}
.cg-strips{background:#fff;padding:8px 8px 8px;box-shadow:0 18px 40px -18px rgba(27,26,23,.55)}
.cg-strips img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.c1-colegi figcaption{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--ink-dim);margin-top:8px;padding-left:4px}

/* =========================================================
   ACT B · notificarea
   ========================================================= */
.act-b{position:relative;background:var(--navy)}
.act-b .pin{position:relative;height:var(--vh);min-height:560px;overflow:hidden;background:#07080c}
.b-stage{position:absolute;inset:0}
.b-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform-origin:66% 42%}
.b-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(70% 70% at 0% 20%,rgba(7,8,12,.9),rgba(7,8,12,0) 70%),linear-gradient(180deg,rgba(7,8,12,.5) 0%,rgba(7,8,12,0) 25%,rgba(7,8,12,0) 70%,rgba(7,8,12,.6) 100%)}
.act-b .chap{position:absolute;left:var(--edge);top:clamp(88px,12vh,120px);z-index:3}
.b-ding{position:absolute;left:calc(var(--edge) - .04em);top:clamp(110px,17vh,170px);z-index:3;margin:0;font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(110px,17vw,300px);line-height:.9;color:var(--gold-l);letter-spacing:-.04em;font-variation-settings:"opsz" 144}
.notif{position:absolute;z-index:4;left:var(--nx,56%);top:var(--ny,16%);width:var(--nw,min(340px,80vw));background:rgba(28,30,40,.78);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px 16px 12px;font-family:var(--ui);color:#fff;box-shadow:0 24px 60px -20px rgba(0,0,0,.7)}
.nf-top{display:flex;align-items:center;gap:8px;font-size:13px}
.nf-av{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#c56bff,#ff5fa2);display:grid;place-items:center;font-size:12px;font-weight:700}
.nf-top time{margin-left:auto;color:rgba(255,255,255,.55);font-size:12px}
.nf-msg{margin:8px 0 12px;font-size:15px;line-height:1.4}
.nf-act{display:flex;gap:8px}
.nf-act button{flex:1;border:0;border-radius:10px;padding:9px 10px;font-size:14px;font-weight:600;transition:transform .08s}
.nf-act button:active{transform:scale(.96)}
.nf-yes{background:#fff;color:#111}
.nf-no{background:rgba(255,255,255,.14);color:#fff}
.feed{position:absolute;z-index:3;right:calc(var(--edge) + 40px);bottom:clamp(40px,9vh,90px);margin:0;padding:0;list-style:none;width:min(300px,30vw);font-family:var(--ui);font-size:13px;color:var(--cream)}
.feed li{background:rgba(15,17,25,.72);border:1px solid rgba(236,228,212,.12);border-radius:12px;padding:9px 12px;margin-top:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.feed b{display:block;font-size:11px;color:var(--gold-l);font-weight:600}
.b-lines{position:absolute;z-index:3;left:var(--edge);top:clamp(130px,19vh,190px);font-family:var(--display);font-weight:400;font-size:clamp(40px,5.4vw,92px);line-height:.98;letter-spacing:-.02em;color:var(--cream);font-variation-settings:"opsz" 144;max-width:56vw}
.b-lines .ln:nth-child(2){font-style:italic;color:var(--gold-l)}
.b-lines .ln.sm{margin-top:18px;max-width:34ch;font-family:var(--serif);font-size:clamp(16px,1.2vw,20px);line-height:1.45;letter-spacing:0;color:var(--cream)}
.b-lines{max-width:min(46vw,760px)}

/* =========================================================
   ACT C · ușa
   ========================================================= */
.act-c{position:relative;background:var(--navy)}
.act-c .pin{position:relative;height:var(--vh);min-height:560px;overflow:hidden;background:#07070a}
.c-stage{position:absolute;inset:0}
.c-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.c-arch{position:absolute;inset:0;z-index:1;visibility:hidden}
.c-arch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.c-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(7,7,10,.82) 0%,rgba(7,7,10,.3) 30%,rgba(7,7,10,0) 45%),linear-gradient(180deg,rgba(7,7,10,0) 60%,rgba(7,7,10,.7) 100%)}
.act-c .chap{position:absolute;left:var(--edge);top:clamp(88px,12vh,120px);z-index:3}
.c-title{position:absolute;z-index:3;left:var(--edge);top:clamp(130px,20vh,200px);margin:0;width:min(30vw,440px);font-family:var(--display);font-weight:400;font-size:clamp(44px,5vw,84px);line-height:.98;letter-spacing:-.02em;font-variation-settings:"opsz" 144;color:var(--cream)}
.c-title .ch{display:inline-block}
.c-title .w{display:inline-block;white-space:nowrap}
.c-lines{position:absolute;z-index:3;left:var(--edge);bottom:clamp(44px,9vh,96px);font-family:var(--display);font-size:clamp(30px,3.4vw,58px);line-height:1.04;letter-spacing:-.015em;color:var(--cream);font-variation-settings:"opsz" 144}
.c-lines .ln:last-of-type{font-style:italic;color:var(--gold-l)}
.cue-row{display:flex;gap:24px;margin-top:22px}

/* ---------- now playing + dock ---------- */
.np{visibility:hidden;position:fixed;left:var(--gut);bottom:22px;z-index:60;display:flex;align-items:center;gap:10px;background:rgba(15,17,25,.92);border:1px solid rgba(201,154,69,.45);color:var(--cream);font-family:var(--ui);font-size:13px;padding:8px 8px 8px 14px;border-radius:2px;transform:translateY(160%);transition:transform .45s var(--out)}
.np.show{transform:none;visibility:visible}
.np .bars{color:var(--gold)}
.np button{background:none;border:0;font-size:18px;line-height:1;padding:2px 6px;color:var(--cream-dim)}
.dock{display:none}

/* =========================================================
   MOTION LAYOUT (JS + nu reduced-motion)
   ========================================================= */
.motion .act-a .pin{display:block;position:relative;height:var(--vh);min-height:560px;overflow:hidden;perspective:1800px;perspective-origin:0% 50%;background:var(--navy)}
.motion .page1{position:absolute;inset:0;min-height:0}
.motion .page-shadow{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(90deg,rgba(15,17,25,.55),rgba(15,17,25,.15) 40%,rgba(15,17,25,0) 70%);opacity:1}
.motion .cover{position:absolute;inset:0;z-index:5;transform-origin:0% 50%;transform-style:preserve-3d;min-height:0}
.motion .cover-face{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.motion .page-shadow{display:block}
.motion .cover-dim{display:block;position:absolute;inset:0;background:#07080c;opacity:0;pointer-events:none}
.motion .cover-back{display:grid;place-items:center;position:absolute;inset:0;background:
  radial-gradient(circle at 50% 50%,rgba(201,154,69,.1),rgba(201,154,69,0) 60%),
  repeating-linear-gradient(45deg,#1a1d2a 0 14px,#161926 14px 28px);transform:rotateY(180deg);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.motion .cover-back p{font-family:var(--display);font-size:28px;text-align:center;color:var(--gold);line-height:1.2}
.motion .spine-light{display:block;position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,transparent,var(--gold-l),transparent);opacity:0}

.motion .act-b .pin,.motion .act-c .pin{will-change:transform}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1100px){
  .nav-cd{display:none}
}
@media (max-width:900px){
  :root{--edge:var(--gut)}
  .nav{gap:14px;height:58px}
  .nav-chapter{display:none}
  .snd .snd-l{display:none}
  .open-cue{display:none}

  .page1{display:flex;flex-direction:column;padding:76px var(--gut) 84px}
  .page1 .chap{order:0}
  .c1-title{order:1;font-size:clamp(52px,15vw,96px);margin-top:8px}
  .c1-photo{order:2;position:relative;width:auto;height:30svh;margin:18px calc(-1 * var(--gut)) 0}
  .c1-photo::after{background:linear-gradient(180deg,rgba(15,17,25,0) 60%,rgba(15,17,25,.5))}
  .c1-lines{order:3;margin-top:16px;font-size:16.5px;line-height:1.45}
  .c1-songs{order:4;margin-top:12px}
  .c1-colegi{display:none}

  .b-img{object-position:72% 50%}
  .b-vignette{background:linear-gradient(180deg,rgba(7,8,12,.92) 0%,rgba(7,8,12,.75) 30%,rgba(7,8,12,0) 46%,rgba(7,8,12,0) 80%,rgba(7,8,12,.6) 100%)}
  .act-b .chap{top:76px}
  .b-ding{font-size:clamp(84px,26vw,150px);top:100px}
  .b-lines{font-size:clamp(34px,10vw,52px);top:104px;max-width:none;right:var(--gut)}
  .feed{display:none}

  .c-img{object-position:50% 30%}
  .c-shade{background:linear-gradient(180deg,rgba(7,7,10,.85) 0%,rgba(7,7,10,.4) 26%,rgba(7,7,10,0) 40%,rgba(7,7,10,0) 58%,rgba(7,7,10,.9) 82%)}
  .act-c .chap{top:76px}
  .c-title{top:104px;width:auto;right:var(--gut);font-size:clamp(34px,9.4vw,52px)}
  .c-lines{bottom:92px;right:var(--gut);font-size:clamp(28px,8vw,40px)}
  .cue-row{flex-wrap:wrap;gap:8px 20px}
  .credit{display:none}


  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:55;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));background:rgba(15,17,25,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid rgba(201,154,69,.35);text-decoration:none;font-family:var(--ui);font-size:13px;color:var(--cream)}
  .dock b{background:var(--gold);color:var(--ink);padding:10px 22px;border-radius:2px;font-size:14px}
  .np{bottom:76px}
}

@media (max-width:900px) and (max-aspect-ratio:1/1){
  .hero-img{inset:0 auto auto -15%;width:130%;max-width:none;height:auto;aspect-ratio:1500/1350;object-position:50% 0}
  .hero-shade{background:linear-gradient(180deg,rgba(15,17,25,.55) 0%,rgba(15,17,25,0) 12%,rgba(15,17,25,0) 30%,rgba(15,17,25,.7) 44%,var(--navy) 54%)}
  .hero-copy{top:auto;bottom:calc(64px + env(safe-area-inset-bottom));transform:none;left:var(--gut);right:var(--gut);width:auto}
  .hero-title img{width:var(--logo-w,min(78vw,420px))}
  .presents{font-size:14px;margin-bottom:10px}
  .hero-kicker{margin-top:12px;font-size:28px}
  .hero-meta{font-size:14px;margin-top:8px}
  .hero-cta{margin-top:18px}
  .hero-cta .btn-gold.big,.hero-cta .btn-ghost{padding:14px 18px;font-size:14px}
}
@media (min-width:600px) and (max-width:900px) and (max-aspect-ratio:1/1){
  .hero-img{left:0;width:100%}
  .hero-shade{background:linear-gradient(180deg,rgba(15,17,25,.55) 0%,rgba(15,17,25,0) 12%,rgba(15,17,25,0) 50%,rgba(15,17,25,.7) 62%,var(--navy) 70%)}
}
@media (max-width:420px){
  .nav-tools{gap:10px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
/* layout static (fără animație): fără suprapuneri */
html:not(.motion) .b-ding{display:none}
html:not(.motion) .notif{left:auto;right:calc(var(--edge) + 40px);top:clamp(96px,14vh,140px)}
@media (max-width:900px){html:not(.motion) .notif,html:not(.motion) .feed{display:none}}

/* =========================================================
   v3 · CARTEA ÎNTREAGĂ: cotoare, hartă, fir auriu, capitolele 4–13, hub
   ========================================================= */
:root{--paper-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .32  0 0 0 0 .12  0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");--cloth:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
.tbd{display:inline-block;font-family:var(--ui);font-style:normal;font-size:10.5px;font-weight:600;letter-spacing:.04em;color:#7a4b00;background:#f4d98f;border-radius:2px;padding:1px 6px;vertical-align:.15em;white-space:nowrap}
.btn-line{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(27,26,23,.35);color:var(--ink);font-family:var(--ui);font-size:14px;text-decoration:none;padding:10px 18px;border-radius:2px;transition:border-color .3s,background .3s}
.btn-line:hover{border-color:var(--gold-d);background:rgba(201,154,69,.1)}
.btn-line.light{border-color:rgba(236,228,212,.35);color:var(--cream)}
.btn-line.big{padding:16px 24px;font-size:15px}
.ic{width:24px;height:24px;display:inline-block}
.ic.big{width:56px;height:56px}
small{font-size:.78em;opacity:.75}

/* ---------- nav clock ---------- */
.nav-clock{display:flex;align-items:center;gap:12px;background:none;border:0;padding:4px 6px 4px 0;text-align:left}
.nav-clock svg{width:34px;height:34px;flex:none;overflow:visible}
.ck-face{fill:rgba(15,17,25,.5);stroke:var(--gold);stroke-width:1.2}
.ck-ticks line{stroke:var(--cream-dim);stroke-width:1.4;stroke-linecap:round;opacity:.5;transition:stroke .4s,opacity .4s}
.ck-ticks line.done{stroke:var(--gold-l);opacity:1}
.ck-ticks line.now{stroke:#fff;opacity:1;stroke-width:2.2}
.ck-hand{stroke:var(--gold-l);stroke-width:1.8;stroke-linecap:round;transform-origin:20px 20px;transition:transform .5s var(--out)}
.ck-pin{fill:var(--gold-l)}
.nav-clock .nav-chapter{display:flex;flex-direction:column;gap:0;line-height:1.2}
.nav-clock .nc-n{font-family:var(--ui);font-style:normal;font-size:11px;color:var(--gold-l);letter-spacing:.03em}
.nav-clock .nc-t{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--cream)}
.nav-clock:hover .ck-face{fill:rgba(201,154,69,.15)}
.nav-skip{font-family:var(--ui);font-size:13px;color:var(--cream-dim);text-decoration:none;border-bottom:1px solid transparent}
.nav-skip:hover{color:var(--gold-l);border-color:var(--gold-l)}
html.gray-world .nav-clock svg{filter:grayscale(1)}

/* ---------- gate ---------- */
.gate{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:22px}
.gate-b{display:inline-flex;align-items:center;gap:10px;background:none;border:0;border-bottom:1px solid rgba(236,228,212,.3);padding:6px 0;font-family:var(--ui);font-size:14px;color:var(--cream)}
.gate-b:hover,.gate-b.sel{color:var(--gold-l);border-color:var(--gold-l)}
.gate-b .bars{color:var(--gold)}

/* =========================================================
   COTOARE (cântecele spectacolului)
   ========================================================= */
.spine{--c:#2a3550;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px;
  width:var(--sw,66px);height:var(--sh,340px);padding:16px 0 14px;border:0;border-radius:3px 3px 2px 2px;color:var(--gold-l);text-align:center;text-decoration:none;
  background:
   linear-gradient(90deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.08) 9%,rgba(255,255,255,.13) 22%,rgba(255,255,255,0) 40%,rgba(0,0,0,.05) 70%,rgba(0,0,0,.38) 100%),
   var(--cloth),
   repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),
   repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 1px,transparent 1px 3px),
   var(--c);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.12),0 1px 0 rgba(0,0,0,.4),6px 0 14px -8px rgba(0,0,0,.6);
  transform-origin:50% 100%;transition:transform .5s var(--out),box-shadow .5s var(--out);flex:none}
.spine::before,.spine::after{content:"";position:absolute;left:9px;right:9px;height:6px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;opacity:.7}
.spine::before{top:44px}.spine::after{bottom:46px}
.sp-n{font-family:var(--display);font-style:italic;font-size:15px;line-height:1;opacity:.9;margin-bottom:18px}
.sp-t{flex:1;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--display);font-weight:500;font-size:clamp(16px,1.25vw,19px);line-height:1.08;letter-spacing:.01em;
  font-variation-settings:"opsz" 72;max-height:100%;overflow:hidden;
  background:linear-gradient(180deg,#f4dfa6,#c99a45 45%,#f0d48e 60%,#a77a33);-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 1px 0 rgba(0,0,0,.0)}
.sp-book{position:absolute;left:4px;bottom:62px;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--ui);font-size:9px;letter-spacing:.06em;opacity:.55;color:var(--cream)}
.sp-d{font-family:var(--ui);font-size:10.5px;font-variant-numeric:tabular-nums;opacity:.75;margin-top:16px}
.sp-play{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid currentColor;font-family:var(--ui);font-size:8px;line-height:1.1}
.sp-play i{width:0;height:0;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px}
.spine.playing .sp-play i{width:8px;height:9px;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor;margin:0}
.spine.nosound .sp-play{width:auto;height:auto;border:0;border-radius:0;font-size:8.5px;opacity:.6;writing-mode:horizontal-tb;max-width:54px}
button.spine{cursor:pointer}
button.spine:hover,button.spine:focus-visible{transform:translateY(-14px) rotate(-1.2deg);box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),0 22px 30px -16px rgba(0,0,0,.7),6px 0 14px -8px rgba(0,0,0,.6)}
.spine.playing{transform:translateY(-22px);box-shadow:inset 0 0 0 1px rgba(230,200,134,.5),0 0 0 1px rgba(230,200,134,.35),0 26px 40px -18px rgba(0,0,0,.8)}
.spine.playing .sp-t{animation:foil 2.2s linear infinite;background-size:100% 220%}
@keyframes foil{from{background-position:0 0}to{background-position:0 220%}}

.shelf{display:flex;align-items:flex-end;gap:5px;position:relative;padding:28px 0 0}
.shelf::after{content:"";position:absolute;left:-14px;right:-14px;bottom:-12px;height:12px;background:linear-gradient(180deg,#6b4a23,#3c2812);box-shadow:0 12px 24px -10px rgba(0,0,0,.7);border-radius:1px}
.shelf .spine:nth-child(3n+1){--sh:360px}.shelf .spine:nth-child(3n+2){--sh:322px;--sw:62px}.shelf .spine:nth-child(4n){--sh:378px;--sw:72px}.shelf .spine:nth-child(5n){--sh:300px;--sw:58px}
.shelf.full{flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;padding:40px 14px 0;margin:0 -14px;scrollbar-width:thin;scrollbar-color:var(--gold-d) transparent}
.shelf.full::after{display:none}
.shelf.full{background:linear-gradient(transparent calc(100% - 12px),#4a3218 calc(100% - 12px))}
.shelf.full .spine{margin-bottom:12px}
.shelf-note,.hub-note{font-family:var(--ui);font-size:13px;line-height:1.55;color:var(--ink-dim);max-width:720px;margin:36px 0 0}

/* cotor culcat: în scenele cu fotografie */
.songrow{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.spine.sm,.shelf.mini .spine{--sw:auto;--sh:auto;width:min(380px,100%);height:auto;min-height:48px;flex-direction:row;padding:0 14px 0 12px;gap:12px;justify-content:flex-start;border-radius:2px 3px 3px 2px;transform-origin:0 50%;
  background:
   linear-gradient(180deg,rgba(0,0,0,.4) 0%,rgba(255,255,255,.12) 22%,rgba(255,255,255,0) 45%,rgba(0,0,0,.35) 100%),
   var(--cloth),repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),var(--c)}
.spine.sm::before,.spine.sm::after,.shelf.mini .spine::before,.shelf.mini .spine::after{top:8px;bottom:8px;left:auto;right:auto;height:auto;width:4px;border:0;border-left:1px solid currentColor;border-right:1px solid currentColor}
.spine.sm::before,.shelf.mini .spine::before{left:44px}.spine.sm::after,.shelf.mini .spine::after{right:62px}
.spine.sm .sp-n,.shelf.mini .sp-n{margin:0;width:22px}
.spine.sm .sp-t,.shelf.mini .sp-t{writing-mode:horizontal-tb;transform:none;font-size:17px;padding:12px 0 12px 14px;text-align:left;white-space:normal}
.spine.sm .sp-book,.shelf.mini .sp-book{display:none}
.spine.sm .sp-d,.shelf.mini .sp-d{margin:0 0 0 auto;padding-left:10px}
.spine.sm .sp-play,.shelf.mini .sp-play{flex:none}
.spine.sm.nosound .sp-play,.shelf.mini .spine.nosound .sp-play{max-width:none;white-space:nowrap}
button.spine.sm:hover,.shelf.mini button.spine:hover,button.spine.sm:focus-visible{transform:translateX(10px)}
.spine.sm.playing,.shelf.mini .spine.playing{transform:translateX(14px)}
.shelf.mini{flex-direction:column;align-items:flex-start;gap:4px;padding:0}
.shelf.mini::after{display:none}
.songrow .spine:nth-child(2),.shelf.mini .spine:nth-child(2){margin-left:18px;width:min(360px,100%)}

/* =========================================================
   JURNAL
   ========================================================= */
.jurnal{position:relative;background:var(--paper);color:var(--ink);overflow:hidden}
.jurnal::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0 37px,rgba(70,90,140,.13) 37px 38px);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.jurnal::after{content:"";position:absolute;top:0;bottom:0;left:calc(var(--edge) - 22px);width:1px;background:rgba(180,60,50,.28)}
.j-in{position:relative;max-width:calc(var(--maxw) + 2*var(--gut));margin:0 auto;padding:clamp(96px,16vh,170px) var(--gut) clamp(80px,12vh,140px)}
.j-title{margin:22px 0 0;max-width:15ch;font-family:var(--display);font-weight:400;font-size:clamp(40px,5.2vw,86px);line-height:.98;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.j-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,3vw,48px);margin-top:clamp(40px,8vh,90px)}
.jl{margin:0;position:relative}
.jl-l,.jl-d{display:block;width:100%;aspect-ratio:1}
.jl-l{position:absolute;inset:0 0 auto 0;display:grid;place-items:center;font-family:var(--display);font-weight:300;font-size:clamp(110px,13vw,220px);line-height:1;color:var(--ink);font-variation-settings:"opsz" 144}
.jl-d{fill:none;stroke:var(--gold-d);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.jl figcaption{margin-top:14px;font-size:16px;line-height:1.45;color:var(--ink-dim)}
.jl figcaption b{font-family:var(--display);font-weight:500;color:var(--ink)}
.j-text{columns:2 320px;column-gap:48px;margin-top:clamp(40px,7vh,80px);max-width:980px;font-size:clamp(17px,1.2vw,20px)}
.j-text p{margin:0 0 1em}
html:not(.motion) .jl-d{opacity:1}html:not(.motion) .jl-l{opacity:.12}

/* =========================================================
   CEASURILE
   ========================================================= */
.ceas{position:relative;background:#0b0c12;color:var(--cream);overflow:hidden}
.cs-in{max-width:calc(var(--maxw) + 2*var(--gut));margin:0 auto;padding:clamp(90px,14vh,150px) var(--gut);display:grid;grid-template-columns:7fr 5fr;gap:clamp(28px,4vw,64px);align-items:center}
.cs-photo{margin:0;position:relative;clip-path:inset(0 round 50% 50% 4px 4px / 34% 34% 4px 4px)}
.cs-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 40%}
.cs-photo figcaption{position:absolute;left:0;right:0;bottom:16px;text-align:center;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--cream)}
.cs-t{margin:18px 0 18px;font-family:var(--display);font-weight:400;font-size:clamp(44px,5vw,84px);line-height:.95;letter-spacing:-.02em;color:var(--gold-l);font-variation-settings:"opsz" 144}
.cs-text p{color:var(--cream-dim);margin:0 0 1em}
.cs-songs{margin:22px 0}
.quiz{position:relative;margin-top:30px;padding:22px 22px 18px 76px;border:1px solid rgba(201,154,69,.35);border-radius:2px;background:rgba(201,154,69,.05)}
.qz-gem{position:absolute;left:18px;top:20px;width:40px;height:40px;color:var(--gold-l);transition:transform .8s var(--out)}
.quiz.ok .qz-gem{transform:rotate(360deg) scale(1.15);filter:drop-shadow(0 0 10px rgba(230,200,134,.7))}
.qz-q{margin:0 0 12px;font-family:var(--display);font-size:20px;line-height:1.25;color:var(--cream)}
.qz-a{display:flex;flex-wrap:wrap;gap:8px}
.qz-a button{background:none;border:1px solid rgba(236,228,212,.3);border-radius:2px;padding:8px 16px;font-family:var(--ui);font-size:14px;transition:background .3s,border-color .3s}
.qz-a button:hover{border-color:var(--gold-l)}
.qz-a button.yes{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.qz-a button.no{opacity:.45;text-decoration:line-through}
.qz-r{min-height:1.4em;margin:12px 0 0;font-family:var(--serif);font-style:italic;color:var(--gold-l)}

/* =========================================================
   HARTA
   ========================================================= */
.mapsec{position:relative;background:radial-gradient(120% 90% at 50% 0%,#1b2030,#0f1119 70%);color:var(--cream);overflow:hidden}
.map-in{max-width:calc(1320px + 2*var(--gut));margin:0 auto;padding:clamp(90px,14vh,150px) var(--gut) clamp(70px,10vh,120px)}
.map-head{display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;align-items:end}
.map-head .chap{grid-column:1/-1}
.map-title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(44px,5.4vw,92px);line-height:.95;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.map-lead{margin:0;max-width:44ch;color:var(--cream-dim)}
.map-list{display:none}
html.no-js .map-list,html.nomap .map-list{display:block;columns:2;margin-top:40px}
.map-list a{color:var(--gold-l)}
.map-host{position:relative;margin-top:clamp(28px,5vh,56px)}
.map{position:relative;border-radius:4px;overflow:visible;background:
   radial-gradient(60% 80% at 20% 30%,rgba(255,255,255,.45),rgba(255,255,255,0) 70%),
   radial-gradient(70% 90% at 90% 90%,rgba(143,106,42,.22),rgba(143,106,42,0) 70%),
   var(--paper-noise),#f1e8d4;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8),inset 0 0 0 1px rgba(143,106,42,.35),inset 0 0 60px rgba(120,85,30,.25)}
.map::before{content:"";position:absolute;inset:10px;border:1px solid rgba(143,106,42,.45);pointer-events:none;border-radius:2px}
.map svg.map-svg{display:block;width:100%;height:auto;overflow:visible}
.map .rg{fill:rgba(143,106,42,.07);stroke:rgba(143,106,42,.35);stroke-width:1;stroke-dasharray:2 5}
.map .rg-l{font-family:var(--display);font-style:italic;font-size:19px;fill:#8f6a2a}
.map .rg-l.sm{font-size:14px}
.map.tall .rg-l{font-size:16px}
.map-tip .cue-ic{flex:none}
.map .rg-n{font-family:var(--ui);font-size:10.5px;letter-spacing:.08em;fill:#8f6a2a;opacity:.8}
.map .road{fill:none;stroke:rgba(27,26,23,.35);stroke-width:1.6;stroke-dasharray:1 7;stroke-linecap:round}
.map .gold{fill:none;stroke:#b8862f;stroke-width:3.2;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(201,154,69,.6))}
.map .deco{fill:none;stroke:rgba(27,26,23,.28);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.map .compass text{font-family:var(--display);font-size:13px;fill:#5a5348}
.map .stop{cursor:pointer;outline:none}
.map .stop .bg{fill:#f6efe0;stroke:rgba(27,26,23,.55);stroke-width:1.2;transition:fill .4s,stroke .4s}
.map .stop .ring{fill:none;stroke:#c99a45;stroke-width:1.4;opacity:0;transform-box:fill-box;transform-origin:center}
.map .stop use{color:#1b1a17;transition:color .4s}
.map .stop text{font-family:var(--display);font-size:15px;fill:#1b1a17;paint-order:stroke;stroke:#efe5d0;stroke-width:4px;stroke-linejoin:round}
.map .stop text.sub{font-family:var(--serif);font-style:italic;font-size:12px;fill:#5a5348}
.map .stop .num{font-family:var(--ui);font-size:9.5px;fill:#8f6a2a;stroke:none}
.map .stop.done .bg{fill:#1b1a17;stroke:#1b1a17}
.map .stop.done use{color:#e6c886}
.map .stop.now .bg{fill:#c99a45;stroke:#8f6a2a}
.map .stop.now use{color:#1b1a17}
.map .stop.now .ring{opacity:1;animation:ring 2.4s var(--out) infinite}
@keyframes ring{from{transform:scale(1);opacity:.9}to{transform:scale(1.9);opacity:0}}
.map .stop:hover .bg,.map .stop:focus-visible .bg{stroke:#c99a45;stroke-width:2.4}
.map .laura{pointer-events:none}
.map .laura circle{fill:#c99a45;stroke:#fff;stroke-width:2}
.map-tip{position:absolute;z-index:5;width:min(300px,86vw);background:#14171f;color:var(--cream);border:1px solid rgba(201,154,69,.5);border-radius:3px;padding:16px 16px 14px;box-shadow:0 24px 50px -20px rgba(0,0,0,.8);font-family:var(--ui);font-size:13px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s,transform .3s var(--out),visibility 0s .3s}
.map-tip.show{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s var(--out)}
.map-tip .mt-k{color:var(--gold-l);font-size:11px;letter-spacing:.04em}
.map-tip h3{margin:4px 0 2px;font-family:var(--display);font-weight:400;font-size:24px;line-height:1.05}
.map-tip p{margin:0 0 10px;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--cream-dim)}
.map-tip .mt-songs{display:flex;flex-direction:column;gap:6px;margin:10px 0 12px}
.map-tip .mt-songs button,.map-tip .mt-songs span{display:flex;align-items:center;gap:10px;background:none;border:0;border-left:2px solid var(--gold);padding:4px 0 4px 10px;text-align:left;font-family:var(--display);font-size:16px;color:var(--cream)}
.map-tip .mt-songs span{border-color:rgba(236,228,212,.25);color:var(--cream-dim)}
.map-tip .mt-songs span small{font-family:var(--ui);font-size:10px}
.map-tip .mt-go{width:100%}
.map-tip .mt-x{position:absolute;right:6px;top:4px;background:none;border:0;font-size:20px;color:var(--cream-dim)}
.map-hint{margin:14px 0 0;font-family:var(--ui);font-size:12px;color:var(--cream-dim)}
.map-overlay{position:fixed;inset:0;z-index:80;background:rgba(9,10,15,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:auto;opacity:0;transition:opacity .35s}
.map-overlay.show{opacity:1}
.mo-in{max-width:1240px;margin:0 auto;padding:22px var(--gut) 40px}
.mo-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.mo-x{background:none;border:1px solid rgba(236,228,212,.3);color:var(--cream);width:42px;height:42px;border-radius:50%;font-size:22px;line-height:1}
.map-overlay .map-host{margin-top:10px}

/* =========================================================
   ACTUL II · fir auriu + spread-uri
   ========================================================= */
.act2{position:relative;background:#0f1119}
.thread{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}
.thread path{fill:none;stroke-linecap:round}
#threadPath{stroke:url(#tg);stroke:#c99a45;stroke-width:2.2}
#threadGlow{stroke:#e6c886;stroke-width:7;opacity:.18;filter:blur(3px)}
.act2-intro{position:relative;background:var(--paper);color:var(--ink);overflow:hidden}
.a2-in{max-width:calc(var(--maxw) + 2*var(--gut));margin:0 auto;padding:clamp(100px,16vh,170px) var(--gut) clamp(80px,12vh,130px);display:grid;grid-template-columns:5fr 7fr;gap:24px 56px;align-items:end}
.a2-in .chap{grid-column:1/-1}
.a2-title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(48px,6vw,104px);line-height:.92;letter-spacing:-.025em;font-variation-settings:"opsz" 144}
.a2-title em{font-style:italic;color:var(--gold-d);font-size:.62em;letter-spacing:-.01em;display:inline-block;margin-top:.2em}
.a2-lead{grid-column:1;margin:0;font-size:clamp(17px,1.2vw,20px)}
.act2-intro .shelf{grid-column:2;grid-row:2/4;justify-content:flex-end;padding-bottom:4px}
.act2-intro .shelf-note{grid-column:1/-1}

.book{position:relative;overflow:hidden;--bg:#14213d;--fg:var(--cream);--dim:var(--cream-dim);--acc:var(--gold-l);background:var(--bg);color:var(--fg)}
.book.tone-pino{--bg:#f1e4cc;--fg:var(--ink);--dim:var(--ink-dim);--acc:#9a3b1c}
.book.tone-muc{--bg:#2a1712;--acc:#7fb3d5}
.book.tone-sea{--bg:#0c1b27;--acc:#8fd0d8}
.book.tone-cave{--bg:#090806;--acc:#f2b45a}
.book.tone-alice{--bg:#ece5f1;--fg:var(--ink);--dim:#5c5168;--acc:#7a3d8c}
.book.tone-prince::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;background-image:radial-gradient(1.2px 1.2px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 70% 20%,#fff,transparent),radial-gradient(1.4px 1.4px at 85% 60%,#e6c886,transparent),radial-gradient(1px 1px at 40% 80%,#fff,transparent),radial-gradient(1px 1px at 10% 70%,#e6c886,transparent),radial-gradient(1.2px 1.2px at 55% 45%,#fff,transparent);background-size:340px 300px}
.book.tone-muc::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.08;background:repeating-conic-gradient(from 45deg,#7fb3d5 0 25%,transparent 0 50%) 0 0/46px 46px}
.bk-in{position:relative;z-index:2;max-width:calc(var(--maxw) + 2*var(--gut));margin:0 auto;padding:clamp(110px,18vh,190px) var(--gut) clamp(80px,12vh,130px);
  display:grid;grid-template-columns:5fr 7fr;grid-template-areas:"node node" "head photo" "big photo" "text photo" "extra extra";column-gap:clamp(28px,4.4vw,72px);align-items:start}
.book:nth-of-type(even) .bk-in{grid-template-columns:7fr 5fr;grid-template-areas:"node node" "photo head" "photo big" "photo text" "extra extra"}
.bk-node{grid-area:node;justify-self:center;width:64px;height:64px;margin-bottom:clamp(30px,6vh,60px);border-radius:50%;display:grid;place-items:center;color:var(--acc);border:1px solid currentColor;background:var(--bg);position:relative;z-index:4;transition:background .6s,color .6s,box-shadow .6s}
.bk-node .ic{width:34px;height:34px}
.bk-node.lit{background:var(--gold);color:var(--ink);border-color:var(--gold);box-shadow:0 0 0 8px rgba(201,154,69,.15),0 0 40px rgba(230,200,134,.45)}
.bk-head{grid-area:head}
.book .chap{color:var(--dim)}.book .chap em{color:var(--acc)}
.bk-title{margin:14px 0 0;display:flex;flex-direction:column;gap:6px}
.bk-name{font-family:var(--display);font-weight:400;font-size:clamp(28px,2.6vw,42px);line-height:1;letter-spacing:-.01em;color:var(--acc)}
.bk-author{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--dim)}
.bk-big{grid-area:big;margin-top:clamp(18px,4vh,40px);font-family:var(--display);font-weight:400;font-size:clamp(38px,4.3vw,74px);line-height:.98;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.bk-big .ln:last-child{font-style:italic}
.bk-photo{grid-area:photo;position:relative;margin:0;align-self:stretch;min-height:clamp(380px,70vh,760px)}
.bk-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bk-photo figcaption{position:absolute;left:14px;bottom:12px;z-index:3;font-family:var(--ui);font-size:11.5px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.bk-photo[data-tone="prince"]{clip-path:inset(0 round 999px 999px 4px 4px)}
.bk-photo[data-tone="prince"] img{object-position:46% 30%}
.bk-photo[data-tone="pino"]{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 62%,3% 60%,0 58%);border-radius:3px}
.bk-photo[data-tone="pino"] img{object-position:50% 50%}
.bk-photo[data-tone="muc"]{clip-path:path("M0 900V180C0 90 90 60 160 30 220 6 250 0 260 0s40 6 100 30c70 30 160 60 160 150v720z");}
.bk-photo[data-tone="muc"] img{object-position:50% 60%}
.bk-photo[data-tone="sea"] img{object-position:47% 30%}
.bk-photo[data-tone="alice"]{clip-path:ellipse(48% 50% at 50% 50%)}
.bk-photo[data-tone="alice"] img{object-position:47% 30%}
.bk-text{grid-area:text;margin-top:clamp(20px,4vh,40px);font-size:clamp(17px,1.15vw,19.5px);color:var(--fg)}
.bk-text p{margin:0 0 1em}
.bk-text p em{color:var(--acc)}
.bk-quote{margin:26px 0;padding-left:20px;border-left:2px solid var(--acc)}
.bk-quote p{margin:0;font-family:var(--display);font-style:italic;font-size:clamp(22px,1.8vw,30px);line-height:1.15}
.bk-quote cite{display:block;margin-top:8px;font-family:var(--ui);font-style:normal;font-size:12px;color:var(--dim)}
.bk-songs{margin-top:28px}
.bk-songs-k{margin:0 0 10px;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--dim)}
.bk-extra{grid-area:extra;margin-top:clamp(40px,8vh,90px)}

/* 04 · anagramă + culoare */
.tone-prince .bk-extra{display:grid;grid-template-columns:5fr 7fr;gap:clamp(28px,4.4vw,72px);align-items:center}
.anagram{text-align:center}
.ag-row{position:relative;height:clamp(90px,10vw,150px);width:min(100%,400px);margin:0 auto}
.ag{position:absolute;top:0;left:calc(var(--x,0) * 20%);width:20%;text-align:center;font-family:var(--display);font-weight:300;font-size:clamp(70px,8vw,130px);line-height:1;color:var(--gold-l);font-variation-settings:"opsz" 144}
.ag-cap{margin:6px 0 0;font-family:var(--serif);font-style:italic;color:var(--cream-dim)}
.paint{position:relative;aspect-ratio:3/2;border-radius:3px;overflow:hidden;touch-action:pan-y;cursor:crosshair;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.paint-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%;filter:grayscale(1) contrast(1.05) brightness(.9)}
.paint-cv{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.paint-all{position:absolute;z-index:3;right:14px;bottom:14px;background:var(--gold);color:var(--ink);border:0;border-radius:2px;padding:9px 14px;font-family:var(--ui);font-size:13px;font-weight:600}
.paint-hint{position:absolute;z-index:3;left:14px;top:12px;margin:0;font-family:var(--ui);font-size:12px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.9);max-width:60%}
.paint.full .paint-img{filter:none}.paint.full .paint-cv,.paint.full .paint-hint{opacity:0;transition:opacity .8s}

/* 05 · nasul */
.nose{max-width:880px;margin:0 auto}
.nose-svg{width:100%;height:auto;overflow:visible}
.nose-head{fill:none;stroke:var(--ink);stroke-width:2}
.nose-eye{fill:var(--ink)}
.nose-line{stroke:#9a3b1c;stroke-width:9;stroke-linecap:round;fill:none}
.nose-leaf{fill:#5f7d3a;opacity:0}
.egg path{fill:#fbf6ea;stroke:var(--ink);stroke-width:1.6}
.chick{opacity:0}.chick circle{fill:#f2c94c;stroke:var(--ink);stroke-width:1.4}.chick path{fill:#e08a1e}
.lies{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:8px 0 0;padding:0;font-family:var(--display);font-style:italic;font-size:clamp(16px,1.3vw,20px);color:#9a3b1c}
.lies li{border-top:1px solid rgba(154,59,28,.4);padding-top:8px}
.nose-cap{margin:18px 0 0;font-family:var(--ui);font-size:13px;color:var(--ink-dim);text-align:center}

/* 06 · smochine */
.figs{text-align:center}
.figs-k{margin:0 0 18px;font-family:var(--serif);font-style:italic;color:var(--cream-dim)}
.figs-row{display:flex;justify-content:center;gap:clamp(18px,5vw,70px)}
.fig{position:relative;background:none;border:0;color:#b78ad0;padding:0 0 46px;transition:transform .3s var(--out)}
.fig:hover{transform:translateY(-6px) rotate(-4deg)}
.fig .ic.big{width:clamp(70px,8vw,110px);height:clamp(70px,8vw,110px)}
.fig b{position:absolute;left:50%;bottom:0;transform:translate(-50%,10px);font-family:var(--display);font-weight:600;font-size:clamp(26px,3vw,44px);color:var(--gold-l);opacity:0;transition:opacity .25s,transform .45s var(--out)}
.fig.on b{opacity:1;transform:translate(-50%,0)}
.fig.on{color:var(--gold-l)}
.fig.on .ic{animation:bop .45s var(--out)}
@keyframes bop{40%{transform:scale(1.18) rotate(-8deg)}}

/* 07 · pânza */
.sail{position:relative;display:flex;justify-content:center;align-items:flex-end;height:clamp(260px,40vh,420px)}
.mast{position:absolute;left:50%;bottom:0;width:3px;height:100%;background:linear-gradient(#b48a4a,#6b4a23)}
.sail-cloth{position:relative;left:calc(50% - 2px);transform-origin:0 50%;width:min(420px,70vw);height:84%;align-self:center;margin-left:-50%;padding:30px 30px 30px 36px;display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(255,255,255,0) 30%),#efe6d2;color:var(--ink);border-radius:0 60% 60% 0/0 50% 50% 0;box-shadow:12px 20px 40px -20px rgba(0,0,0,.7)}
.sail-cloth p{margin:0;font-family:var(--display);font-size:clamp(20px,2vw,30px);line-height:1.15}
.sail-cloth p:first-child{font-style:italic;color:#1c4a5a;font-size:clamp(28px,3vw,46px)}

/* 08 · peștera */
.cave-stage{cursor:none}
.cave-dark{position:absolute;inset:0;z-index:2;background:radial-gradient(circle var(--r,170px) at var(--x,50%) var(--y,45%),rgba(9,8,6,0) 0%,rgba(9,8,6,.35) 45%,rgba(9,8,6,.96) 100%);pointer-events:none}
.cave-hint{position:absolute;z-index:3;left:16px;top:14px;margin:0;font-family:var(--serif);font-style:italic;font-size:15px;color:#f2b45a;max-width:60%}
html:not(.motion) .cave-dark{display:none}html:not(.motion) .cave-hint{display:none}html:not(.motion) .cave-stage{cursor:auto}

/* 09 · filtre */
.filt img{transition:filter 1.2s var(--out)}
.filt.on img{filter:saturate(2.1) hue-rotate(-18deg) contrast(1.15) brightness(1.08) blur(.6px)}
.filt-ui{position:absolute;inset:0;z-index:2;pointer-events:none;transition:opacity .8s}
.filt-ui span{position:absolute;font-family:var(--ui);font-size:13px;font-weight:600;color:#fff;background:rgba(255,95,162,.85);padding:6px 10px;border-radius:20px}
.f-like{right:12%;top:16%}.f-tag{left:14%;bottom:20%;background:rgba(197,107,255,.85)!important}
.filt-ui i{position:absolute;width:14px;height:14px;background:radial-gradient(circle,#fff,rgba(255,255,255,0) 70%);animation:twinkle 1.8s ease-in-out infinite}
.filt-ui .g1{left:24%;top:24%}.filt-ui .g2{left:70%;top:34%;animation-delay:-.6s}.filt-ui .g3{left:40%;top:70%;animation-delay:-1.1s}.filt-ui .g4{left:80%;top:72%;animation-delay:-.3s}.filt-ui .g5{left:16%;top:52%;animation-delay:-1.4s}
@keyframes twinkle{50%{transform:scale(.3);opacity:.3}}
.filt:not(.on) .filt-ui{opacity:0}
.filt-btn{position:absolute;z-index:3;left:50%;bottom:9%;transform:translateX(-50%);background:var(--ink);color:#fff;border:0;border-radius:2px;padding:12px 20px;font-family:var(--ui);font-size:14px;font-weight:600}
.filt:not(.on) .filt-btn{background:var(--paper);color:var(--ink)}

/* =========================================================
   ACT S · Scrollina   ACT T · Tărâm   ACT R · citește   ACT K · cortina
   ========================================================= */
.act-s,.act-t,.act-r,.act-k{position:relative;background:#07070a}
.act-s .pin,.act-t .pin,.act-r .pin,.act-k .pin{position:relative;height:var(--vh);min-height:560px;overflow:hidden}
.act-s .chap,.act-t .chap,.act-r .chap,.act-k .chap{position:absolute;left:var(--edge);top:clamp(88px,12vh,120px);z-index:6}
.s-stage,.t-stage,.r-stage,.r-sala{position:absolute;inset:0}
.s-stage img,.t-stage img,.r-stage img,.r-sala img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s-stage img{object-position:62% 40%}
.s-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(20,4,14,.92) 0%,rgba(20,4,14,.6) 34%,rgba(20,4,14,0) 52%),linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.6))}
.s-copy{position:absolute;z-index:6;left:var(--edge);top:clamp(130px,20vh,200px);width:min(38vw,520px)}
.s-title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(46px,5.4vw,96px);line-height:.92;letter-spacing:-.025em;color:#fff;font-variation-settings:"opsz" 144}
.s-hash{color:#ff5fa2;font-style:italic;margin-right:.04em}
.s-text{margin:18px 0 20px;color:#f1d9e4;font-size:clamp(16px,1.1vw,18.5px)}
.s-stop{display:flex;align-items:center;gap:14px;margin:0 0 18px;font-family:var(--ui);font-size:13px;color:#fff}
.s-stop svg{width:44px;height:44px;flex:none;transform:rotate(-90deg)}
.ss-bg{fill:none;stroke:rgba(255,255,255,.2);stroke-width:3}
.ss-fg{fill:none;stroke:var(--gold-l);stroke-width:3;stroke-linecap:round;stroke-dasharray:119.4;stroke-dashoffset:119.4}
.s-stop p{margin:0}
.act-s.won .s-stop p{color:var(--gold-l)}
.s-feed{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.s-bub{position:absolute;right:var(--rx);top:var(--ry);font-family:var(--ui);font-size:13px;font-weight:600;color:#fff;background:rgba(255,95,162,.9);padding:7px 12px;border-radius:18px;white-space:nowrap;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.s-bub.h{background:rgba(197,107,255,.9)}.s-bub.n{background:rgba(28,30,40,.88);border:1px solid rgba(255,255,255,.15)}
.s-fire{position:absolute;left:0;right:0;bottom:0;height:70%;z-index:3;pointer-events:none;transform:translateY(100%);transform-origin:bottom}
.s-fire i{position:absolute;left:0;right:0;bottom:0;height:100%;background:radial-gradient(60% 70% at 30% 100%,rgba(255,120,30,.75),rgba(255,60,20,0) 70%),radial-gradient(50% 60% at 75% 100%,rgba(255,170,40,.6),rgba(255,60,20,0) 70%);mix-blend-mode:screen;animation:flick 1.6s ease-in-out infinite alternate}
.s-fire i:nth-child(2){animation-delay:-.5s;opacity:.7;transform:scaleX(-1)}.s-fire i:nth-child(3){animation-delay:-1s;opacity:.5;height:70%}
@keyframes flick{from{transform:scaleY(.92) translateX(-2%)}to{transform:scaleY(1.06) translateX(2%)}}
.act-s.won .s-fire{opacity:.15;transition:opacity 1.4s}

.t-stage img{object-position:50% 50%;filter:grayscale(1) contrast(1.05)}
.t-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(270deg,rgba(8,8,10,.92) 0%,rgba(8,8,10,.6) 34%,rgba(8,8,10,0) 54%),linear-gradient(180deg,rgba(8,8,10,.5),rgba(8,8,10,0) 30%)}
.t-copy{position:absolute;z-index:5;right:var(--edge);top:clamp(130px,22vh,220px);width:min(36vw,500px);color:#e8e8e8}
.t-title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(40px,4.3vw,76px);line-height:.98;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.t-text{margin:18px 0 20px;color:#b9b9b9;font-size:clamp(16px,1.1vw,18.5px)}
.act-t .spine{filter:grayscale(1);transition:filter 1s}
.act-t .spine:hover,.act-t .spine.playing{filter:none}
.t-clock{position:absolute;z-index:4;left:var(--edge);top:clamp(150px,24vh,240px);width:clamp(120px,13vw,200px);height:auto}
.t-clock circle{fill:rgba(255,255,255,.04);stroke:#d0d0d0;stroke-width:2}
.t-clock line{stroke:#e6e6e6;stroke-linecap:round}
.tc-m{stroke-width:3}.tc-h{stroke-width:5}
#tTicks line{stroke:#9a9a9a;stroke-width:2}
.t-page{position:absolute;z-index:6;left:50%;bottom:-30vh;width:clamp(120px,12vw,170px);aspect-ratio:3/4;margin-left:-60px;background:linear-gradient(160deg,#f3ead6,#d9c7a1);border-radius:2px;box-shadow:0 20px 40px -10px rgba(0,0,0,.7);
  clip-path:polygon(0 6%,10% 0,22% 4%,40% 0,60% 3%,78% 0,100% 5%,96% 30%,100% 55%,95% 78%,100% 100%,70% 96%,48% 100%,25% 95%,0 100%,4% 70%,0 45%,5% 22%);display:grid;place-items:center}
.t-page::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 40% at 100% 0%,rgba(60,30,10,.7),transparent 70%),radial-gradient(50% 30% at 0% 100%,rgba(60,30,10,.6),transparent 70%)}
.t-page p{margin:0;font-family:var(--serif);font-style:italic;font-size:13px;color:#5a3d1a}
html.gray-world .act2 ~ * .spine:not(:hover){}

.r-stage img{object-position:50% 40%}
.r-gray{filter:grayscale(1) brightness(.75)}
.r-color{clip-path:circle(0% at 50% 45%)}
.r-sala{z-index:3;opacity:0}
.r-sala img{object-position:50% 70%}
.r-shade{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,rgba(5,6,10,.25) 0%,rgba(5,6,10,0) 30%,rgba(5,6,10,.25) 55%,rgba(5,6,10,.88) 100%)}
.r-k{position:absolute;z-index:6;left:var(--edge);top:clamp(130px,20vh,190px);width:min(34vw,440px);margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(17px,1.2vw,20px);color:var(--cream)}
.r-quote{position:absolute;z-index:6;left:var(--edge);right:var(--edge);bottom:clamp(120px,22vh,220px);margin:0;max-width:22ch;font-family:var(--display);font-weight:400;font-size:clamp(40px,4.8vw,84px);line-height:1;letter-spacing:-.02em;color:#fff;font-variation-settings:"opsz" 144;text-shadow:0 4px 30px rgba(0,0,0,.6)}
.r-quote .wd{display:inline-block;opacity:.12;transition:none}
.r-src{position:absolute;z-index:6;left:var(--edge);bottom:clamp(86px,15vh,160px);margin:0;font-family:var(--ui);font-size:13px;color:var(--gold-l)}
.r-aloud{position:absolute;z-index:6;right:var(--edge);bottom:clamp(40px,7vh,80px);width:min(32vw,420px);margin:0;font-family:var(--serif);font-size:16px;color:var(--cream)}
.r-code{position:absolute;z-index:6;left:var(--edge);bottom:clamp(36px,6vh,64px)}

.act-k .pin{background:radial-gradient(70% 60% at 50% 40%,#2b0e12,#0a0507 75%)}
.k-stage{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:90px var(--gut) 40px;gap:14px}
.k-stage .chap{position:static;justify-content:center}
.k-pre{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.4vw,24px);color:var(--cream-dim)}
.k-date{margin:0;display:flex;flex-direction:column;align-items:center;line-height:.82;font-family:var(--display);font-weight:400;color:var(--gold-l);font-variation-settings:"opsz" 144}
.k-d{font-size:clamp(150px,22vw,330px);letter-spacing:-.04em}
.k-m{font-size:clamp(46px,6.6vw,110px);font-style:italic;color:var(--cream);letter-spacing:-.02em}
.k-meta{margin:6px 0 10px;font-family:var(--ui);font-size:15px;color:var(--cream)}
.k-song{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 24px;margin-top:16px}
.curtain{position:absolute;top:0;bottom:0;width:51%;z-index:4;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.05) 8%,rgba(0,0,0,.3) 16%,rgba(255,255,255,.06) 24%,rgba(0,0,0,.32) 32%,rgba(255,255,255,.05) 40%,rgba(0,0,0,.3) 48%,rgba(255,255,255,.06) 56%,rgba(0,0,0,.3) 64%,rgba(255,255,255,.05) 72%,rgba(0,0,0,.3) 80%,rgba(255,255,255,.06) 88%,rgba(0,0,0,.4)),linear-gradient(180deg,#8e1622,#5c0b13 70%,#3a060b)}
.curtain.l{left:0;transform-origin:0 0}.curtain.r{right:0;transform-origin:100% 0}
.valance{position:absolute;left:0;right:0;top:0;height:70px;z-index:5;background:linear-gradient(180deg,#6e0f19,#4a0910);box-shadow:0 10px 30px rgba(0,0,0,.6);-webkit-mask:radial-gradient(40px 26px at 40px 70px,transparent 98%,#000) -40px 0/80px 100%;mask:radial-gradient(40px 26px at 40px 70px,transparent 98%,#000) -40px 0/80px 100%}
.valance::after{content:"";position:absolute;left:0;right:0;bottom:30px;height:2px;background:var(--gold);opacity:.7}
html:not(.motion) .curtain{display:none}

/* =========================================================
   HUB
   ========================================================= */
.hub{position:relative;overflow:hidden}
.hub-in{max-width:calc(var(--maxw) + 2*var(--gut));margin:0 auto;padding:clamp(90px,14vh,150px) var(--gut)}
.hub-t{margin:18px 0 0;font-family:var(--display);font-weight:400;font-size:clamp(40px,4.8vw,82px);line-height:.96;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.hub-lead{max-width:62ch;margin:22px 0 0}
.hub.show{background:var(--paper);color:var(--ink)}
.show-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,5vw,80px);margin-top:20px;align-items:start}
.show-t{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(52px,6.6vw,118px);line-height:.9;letter-spacing:-.025em;font-variation-settings:"opsz" 144}
.show-t em{color:var(--gold-d)}
.show-cd{display:flex;gap:clamp(14px,3vw,40px);margin:34px 0 0;font-variant-numeric:tabular-nums}
.show-cd div{display:flex;flex-direction:column}
.show-cd b{font-family:var(--display);font-weight:400;font-size:clamp(40px,4.2vw,70px);line-height:1;color:var(--ink)}
.show-cd span{font-family:var(--ui);font-size:12px;color:var(--ink-dim)}
.facts{margin:40px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.facts div{padding:14px 0;border-top:1px solid rgba(27,26,23,.15)}
.facts dt{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--gold-d)}
.facts dd{margin:2px 0 0;font-size:16.5px;line-height:1.45}
.show-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.price{background:#14171f;color:var(--cream);padding:clamp(22px,3vw,36px);border-radius:3px;position:relative}
.price::before{content:"";position:absolute;left:0;right:0;top:64%;border-top:2px dashed rgba(236,228,212,.18)}
.price-k{margin:0 0 14px;font-family:var(--serif);font-style:italic;color:var(--gold-l)}
.price ul,.offer ul{list-style:none;margin:0;padding:0}
.price li,.offer li{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid rgba(236,228,212,.12);font-family:var(--ui);font-size:15px}
.price li b,.offer li b{margin-left:auto;font-family:var(--display);font-weight:500;font-size:22px;color:var(--gold-l)}
.price-n{margin:14px 0 0;font-family:var(--ui);font-size:12px;color:var(--cream-dim)}
.qr{display:flex;gap:16px;align-items:center;margin-top:40px}
.qr img{width:104px;height:104px;background:#fff;padding:6px;border-radius:2px}
.qr p{margin:0;font-family:var(--ui);font-size:13px;color:var(--cream-dim)}

.hub.sound{background:#121520;color:var(--cream)}
.hub.sound .shelf.full{margin-top:40px}
.song-list{margin:40px 0 0;padding:0;list-style:none;columns:2 360px;column-gap:48px}
.song-list li{break-inside:avoid;padding:8px 0;border-bottom:1px solid rgba(236,228,212,.1);font-family:var(--display);font-size:18px}
.song-list b{font-family:var(--ui);font-size:12px;color:var(--gold-l);margin-right:8px;font-weight:500}
.song-list span{display:block;font-family:var(--ui);font-size:12px;color:var(--cream-dim)}
.hub.sound .hub-note{color:var(--cream-dim)}.hub.sound .hub-note a{color:var(--gold-l)}

.hub.hist{background:var(--paper);color:var(--ink)}
.hist-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}
.counter{margin:0;display:flex;flex-direction:column;align-items:flex-end}
.counter b{font-family:var(--display);font-weight:400;font-size:clamp(70px,9vw,160px);line-height:.85;color:var(--gold-d);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.counter span{font-family:var(--ui);font-size:13px;color:var(--ink-dim)}
.tl{list-style:none;margin:clamp(40px,7vh,80px) 0 0;padding:28px 0 0;display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;position:relative;scrollbar-width:thin}
.tl::before{content:"";position:absolute;left:0;right:0;top:34px;height:1px;background:rgba(27,26,23,.25)}
.tl-i{flex:0 0 clamp(170px,15vw,220px);scroll-snap-align:start;position:relative;padding:28px 18px 0 0;display:flex;flex-direction:column;gap:4px}
.tl-dot{position:absolute;top:0;left:0;width:13px;height:13px;border-radius:50%;background:var(--paper);border:1.5px solid var(--gold-d)}
.tl-i.sp .tl-dot,.tl-i.feb .tl-dot{background:var(--gold)}
.tl-i.next .tl-dot{background:var(--ink);border-color:var(--ink);box-shadow:0 0 0 5px rgba(201,154,69,.35)}
.tl-i time{font-family:var(--ui);font-size:12px;color:var(--gold-d)}
.tl-i b{font-family:var(--display);font-weight:500;font-size:20px;line-height:1.1}
.tl-i span{font-size:14.5px;line-height:1.4;color:var(--ink-dim)}
.gal-h{display:flex;align-items:baseline;gap:16px;margin:clamp(40px,7vh,70px) 0 14px}
.gal-h h3{margin:0;font-family:var(--display);font-weight:400;font-size:26px}
.gal-h span{font-family:var(--serif);font-style:italic;color:var(--ink-dim)}
.gal{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:clamp(110px,11vw,170px);gap:6px}
.g-i{padding:0;border:0;overflow:hidden;background:#222;border-radius:2px}
.g-i img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--out)}
.g-i:hover img{transform:scale(1.05)}
.gal.sp .g-i:nth-child(1){grid-column:span 3;grid-row:span 2}.gal.sp .g-i:nth-child(2){grid-column:span 3}.gal.sp .g-i:nth-child(6){grid-column:span 2;grid-row:span 2}
.gal.feb .g-i:nth-child(1){grid-column:span 2;grid-row:span 2}.gal.feb .g-i:nth-child(n+2){grid-column:span 2}
.gal.feb{grid-template-columns:repeat(6,1fr)}
.gal.feb .g-i:nth-child(4),.gal.feb .g-i:nth-child(5){grid-column:span 2}
.hub.hist .hub-note{color:var(--ink-dim)}
.lb{position:fixed;inset:0;z-index:90;background:rgba(5,6,10,.94);display:grid;place-items:center;padding:40px}
.lb[hidden]{display:none}
.lb img{max-width:min(1400px,94vw);max-height:80vh;width:auto;height:auto}
.lb p{color:var(--cream-dim);font-family:var(--ui);font-size:13px;margin:12px 0 0;text-align:center}
.lb-x{position:absolute;right:20px;top:16px;background:none;border:0;color:#fff;font-size:30px}

.hub.cast{background:#0f1119;color:var(--cream)}
.playbill{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.pb{position:relative;aspect-ratio:3/4;border:1px solid rgba(201,154,69,.35);border-radius:2px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;background:linear-gradient(180deg,#161a26,#0f1119)}
.pb-ini{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-weight:300;font-size:clamp(90px,10vw,170px);color:var(--gold);opacity:.55;transition:opacity .6s var(--out),transform .8s var(--out)}
.pb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%;opacity:0;transform:scale(1.06);transition:opacity .7s var(--out),transform 1.2s var(--out);clip-path:circle(0% at 50% 45%)}
.pb.has:hover img,.pb.has:focus img,.pb.has.reveal img{opacity:1;transform:none;clip-path:circle(75% at 50% 45%);transition:opacity .7s var(--out),transform 1.2s var(--out),clip-path 1s var(--out)}
.pb.has:hover .pb-ini,.pb.has:focus .pb-ini,.pb.has.reveal .pb-ini{opacity:0;transform:scale(1.4)}
.pb::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(180deg,rgba(15,17,25,0),rgba(15,17,25,.92));pointer-events:none}
.pb-role,.pb-name{position:relative;z-index:2}
.pb-role{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--gold-l);line-height:1.2}
.pb-name{font-family:var(--display);font-size:clamp(19px,1.6vw,24px);line-height:1.1;margin-top:2px}
.also{margin:28px 0 0;font-size:17px;color:var(--cream-dim);max-width:900px}
.also span{font-style:italic;color:var(--gold-l);margin-right:6px}
.team{margin:44px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px}
.team div{padding:12px 0;border-top:1px solid rgba(236,228,212,.12)}
.team dt{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--gold-l)}
.team dd{margin:2px 0 0;font-family:var(--display);font-size:19px}

.hub.cartea{background:#ebe2cf;color:var(--ink)}
.cartea .hub-in{display:grid;grid-template-columns:4fr 7fr;gap:clamp(30px,5vw,80px);align-items:center}
.ct-photo{margin:0;position:relative;transform:rotate(-2.5deg);box-shadow:0 30px 50px -24px rgba(0,0,0,.5);background:#fff;padding:12px 12px 46px}
.ct-photo img{width:100%;aspect-ratio:599/703;object-fit:cover}
.ct-text p{max-width:60ch}
.ct-q{margin:28px 0 0;padding-left:20px;border-left:2px solid var(--gold-d)}
.ct-q p{margin:0;font-family:var(--display);font-style:italic;font-size:clamp(24px,2.2vw,36px);line-height:1.1}
.ct-q cite{font-family:var(--ui);font-size:12px;font-style:normal;color:var(--ink-dim)}

.hub.scoli{background:var(--paper);color:var(--ink);border-top:1px solid rgba(27,26,23,.1)}
.sc-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,5vw,80px);margin-top:10px;align-items:start}
.ask{margin:28px 0 0;padding:0;list-style:none;counter-reset:a}
.ask li{counter-increment:a;padding:12px 0 12px 46px;position:relative;border-top:1px solid rgba(27,26,23,.14);font-family:var(--display);font-size:clamp(19px,1.5vw,24px);line-height:1.2}
.ask li::before{content:counter(a);position:absolute;left:0;top:10px;font-family:var(--display);font-style:italic;font-size:26px;color:var(--gold-d)}
.ask-k{font-family:var(--ui);font-size:12px;color:var(--ink-dim)}
.offer{background:#14171f;color:var(--cream);padding:clamp(22px,3vw,36px);border-radius:3px;display:flex;flex-direction:column;gap:12px}
.offer s{font-family:var(--ui);font-size:13px;color:var(--cream-dim);margin-left:auto}
.offer li b{margin-left:12px}
.offer-plus{margin:6px 0 0;font-family:var(--serif);font-style:italic;color:var(--gold-l)}
.offer-how{margin:0;font-family:var(--ui);font-size:13px;line-height:1.6;color:var(--cream-dim)}
.offer .btn-gold,.offer .btn-line{width:100%}

.hub.presa{background:#161a26;color:var(--cream)}
.quotes{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:20px;margin-top:40px}
.quotes blockquote{margin:0;padding:26px;border:1px solid rgba(201,154,69,.3);border-radius:2px}
.quotes p{margin:0;font-family:var(--display);font-style:italic;font-size:clamp(20px,1.7vw,28px);line-height:1.15}
.quotes cite{display:block;margin-top:14px;font-family:var(--ui);font-size:12px;font-style:normal;color:var(--cream-dim)}
.quotes .empty{border-style:dashed;opacity:.75}
.quotes .empty p{font-size:18px;color:var(--cream-dim)}
.hub.presa .hub-note{color:var(--cream-dim)}

.hub.faq{background:var(--paper);color:var(--ink)}
.faq-list{margin-top:34px;max-width:900px}
.faq details{border-top:1px solid rgba(27,26,23,.18)}
.faq details:last-child{border-bottom:1px solid rgba(27,26,23,.18)}
.faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;position:relative;font-family:var(--display);font-size:clamp(19px,1.5vw,24px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;border-right:1.5px solid var(--gold-d);border-bottom:1.5px solid var(--gold-d);transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--out)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{margin:0 0 20px;max-width:70ch;color:var(--ink-dim)}

.final{position:relative;background:radial-gradient(80% 70% at 50% 30%,#232a40,#0f1119 70%);color:var(--cream);text-align:center}
.fin-in{max-width:900px;margin:0 auto;padding:clamp(100px,16vh,170px) var(--gut) 80px;display:flex;flex-direction:column;align-items:center;gap:20px}
.fin-k{margin:0;font-family:var(--serif);font-style:italic;font-size:20px;color:var(--gold-l)}
.fin-t{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(44px,5.6vw,96px);line-height:.95;letter-spacing:-.02em;font-variation-settings:"opsz" 144}
.next-show{margin-top:50px;padding-top:26px;border-top:1px solid rgba(236,228,212,.15);max-width:560px}
.next-show .chap{justify-content:center}
.next-show p{color:var(--cream-dim)}
.next-show b{color:var(--cream);font-family:var(--display);font-weight:500}
.foot{border-top:1px solid rgba(236,228,212,.1);padding:40px var(--gut) 100px;font-family:var(--ui);font-size:13px;color:var(--cream-dim)}
.foot img{width:180px;height:auto;margin:0 auto 14px}
.foot p{margin:6px auto;max-width:800px}
.foot a{color:var(--cream)}
.foot .legal{font-size:11.5px;opacity:.75}

/* ---------- motion overlap (scena următoare urcă peste cea fixată) ---------- */
.motion .over{margin-top:calc(-1 * var(--vh));z-index:3}
.motion .act-b{margin-top:0}
.act-a{z-index:1}.act-b{z-index:2}.jurnal{z-index:3}
.motion .jurnal{margin-top:calc(-1 * var(--vh))}
.motion .act-c,.motion .ceas,.motion .mapsec,.motion .act-t,.motion .act-r,.motion .act-k,.motion #spectacol{position:relative}
.act-c{z-index:4}.ceas{z-index:5}.mapsec{z-index:6}.act2{z-index:7}.act-s{z-index:8}.act-t{z-index:9}.act-r{z-index:10}.act-k{z-index:11}.hub,.final{z-index:12}
.motion .act2,.motion .act-s{margin-top:0}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1100px){
  .nav-skip{display:none}
  .feed{display:none}
  .playbill{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .nav-clock .nav-chapter{display:flex}
  .nav-clock .nc-n{font-size:10px}.nav-clock .nc-t{font-size:13px;max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .nav-mark{display:none}
  .gate{margin-top:14px;gap:4px 18px}
  .j-grid{grid-template-columns:repeat(2,1fr);gap:28px 18px}
  .jl-l{font-size:clamp(90px,30vw,150px)}
  .cs-in,.map-head,.a2-in,.show-grid,.sc-grid,.cartea .hub-in{grid-template-columns:1fr}
  .cs-photo img{aspect-ratio:4/3}
  .a2-lead,.act2-intro .shelf{grid-column:1;grid-row:auto}
  .act2-intro .shelf{justify-content:flex-start;overflow-x:auto;padding:30px 14px 0;margin:20px -14px 0}
  .act2-intro .shelf::after{display:none}
  .act2-intro .shelf{background:linear-gradient(transparent calc(100% - 12px),#4a3218 calc(100% - 12px))}
  .act2-intro .shelf .spine{margin-bottom:12px}
  .spine{--sw:58px!important}
  .shelf .spine{--sh:300px!important}.shelf .spine:nth-child(2n){--sh:276px!important}
  .bk-in,.book:nth-of-type(even) .bk-in{grid-template-columns:1fr;grid-template-areas:"node" "head" "big" "photo" "text" "extra";padding-top:90px}
  .bk-node{width:52px;height:52px;margin-bottom:26px}
  .bk-photo{min-height:0;aspect-ratio:4/5;margin:26px calc(-1*var(--gut)) 0}
  .bk-photo[data-tone="sea"],.bk-photo[data-tone="cave"]{aspect-ratio:4/5}
  .bk-photo[data-tone="muc"]{clip-path:inset(0 round 46% 46% 0 0 / 24% 24% 0 0);aspect-ratio:1}
  .tone-prince .bk-extra{grid-template-columns:1fr}
  .lies{grid-template-columns:1fr 1fr}
  .s-shade{background:linear-gradient(180deg,rgba(20,4,14,.94) 0%,rgba(20,4,14,.75) 40%,rgba(20,4,14,0) 62%,rgba(0,0,0,.4))}
  .s-stage img{object-position:62% 50%;top:30%;height:70%}
  .act-s .chap,.act-t .chap,.act-r .chap{top:68px}
  .s-copy{top:96px;right:var(--gut);width:auto}
  .s-title{font-size:clamp(40px,11vw,60px)}
  .s-text{font-size:15px;margin:10px 0 12px}
  .s-copy .songrow{display:none}
  .t-stage img{object-position:44% 50%;top:34%;height:66%}
  .t-shade{background:linear-gradient(180deg,rgba(8,8,10,.95) 0%,rgba(8,8,10,.8) 34%,rgba(8,8,10,0) 54%)}
  .t-copy{left:var(--gut);right:var(--gut);top:96px;width:auto}
  .t-title{font-size:clamp(32px,9vw,46px)}
  .t-text{font-size:15px;margin:10px 0 12px}
  .t-clock{left:auto;right:var(--gut);top:auto;bottom:90px;width:96px}
  .r-k{top:96px;right:var(--gut);width:auto;font-size:16px}
  .r-quote{font-size:clamp(34px,9.6vw,52px);bottom:200px;max-width:none}
  .r-src{bottom:170px}
  .r-aloud{left:var(--gut);right:var(--gut);width:auto;bottom:96px;font-size:14px}
  .r-code{display:none}
  .k-song .cue-chip{display:none}
  .facts{grid-template-columns:1fr}
  .playbill{grid-template-columns:repeat(2,1fr)}
  .team{grid-template-columns:1fr 1fr}
  .quotes{grid-template-columns:1fr}
  .gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px}
  .gal .g-i{grid-column:auto!important;grid-row:auto!important}
  .gal.sp .g-i:first-child{grid-column:span 2!important;grid-row:span 2!important}
  .counter{align-items:flex-start}
  .foot{padding-bottom:120px}
  .song-list{columns:1}
}
@media (max-width:520px){
  .nav-cd{display:none}
  .snd{padding:8px 10px}
  .team{grid-template-columns:1fr}
}

/* voice band · rânduri editoriale (vocea spectacolului, nu citate) */
.voice-band{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px;border-top:1px solid rgba(201,154,69,.45);border-bottom:1px solid rgba(201,154,69,.45)}
.voice-band p{margin:0;padding:26px 24px;font-family:var(--display);font-weight:400;font-size:clamp(20px,1.6vw,26px);line-height:1.2;letter-spacing:-.01em;color:var(--gold-l);font-variation-settings:"opsz" 144}
.voice-band p+p{border-left:1px solid rgba(201,154,69,.25)}
@media (max-width:900px){.voice-band{grid-template-columns:1fr}.voice-band p{padding:20px 0}.voice-band p+p{border-left:0;border-top:1px solid rgba(201,154,69,.25)}}