/* /2026 teaser: landing (scrolling, SEO text) + full-screen story overlay. Palette/fonts = site (styles.css). Transform/opacity only. */
:root { --bg:#0d0c0b; --bg-2:#151311; --bg-3:#1d1a17; --line:rgba(236,228,214,.09); --text:#ece4d6; --muted:#9b9184; --faint:#6a6259; --amber:#c9a063; --amber-soft:rgba(201,160,99,.16);
  --serif:'Fraunces','Iowan Old Style',Georgia,serif; --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; }
* { box-sizing:border-box; }
html, body { margin:0; background:var(--bg); color:var(--text); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; } button { font:inherit; color:inherit; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.y26 { max-width:720px; margin:0 auto; padding:0 18px 40px; background:radial-gradient(60% 40% at 80% 0%, rgba(201,160,99,.16), transparent 70%); }
.y26-top { display:flex; justify-content:space-between; align-items:center; padding:16px 0; }
.y26-brand { font:italic 500 18px var(--serif); text-decoration:none; }
.y26-lang a { margin-left:10px; font-size:12px; color:var(--muted); text-decoration:none; } .y26-lang a[aria-current] { color:var(--amber); }
.y26-hero { padding:34px 0 26px; }
.y26-k { font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--amber); margin:0 0 12px; }
.y26 h1 { font:500 clamp(34px, 8vw, 54px)/1.04 var(--serif); margin:0 0 14px; letter-spacing:-.015em; }
.y26-lead { color:var(--muted); font-size:16px; line-height:1.55; margin:0 0 22px; max-width:580px; }
.y26-form { display:flex; align-items:center; gap:8px; background:var(--bg-2); border:1px solid var(--line); border-radius:999px; padding:6px 6px 6px 16px; max-width:520px; }
.y26-form:focus-within { border-color:var(--amber); }
.y26-at { color:var(--amber); font-weight:600; }
.y26-form input { flex:1; min-width:0; border:0; background:transparent; color:var(--text); font:500 16px var(--sans); padding:10px 2px; outline:none; }
.y26-btn, .s-btn { border:0; border-radius:999px; background:var(--amber); color:#15120d; font-weight:700; font-size:15px; padding:12px 18px; cursor:pointer; white-space:nowrap; text-decoration:none; display:inline-flex; align-items:center; gap:8px; }
.y26-err { color:#e7a08b; font-size:14px; margin:12px 4px 0; }
.y26-sec { border-top:1px solid var(--line); padding:22px 0; }
.y26-sec h2 { font:500 22px/1.2 var(--serif); margin:0 0 8px; } .y26-sec p { color:var(--muted); line-height:1.6; margin:0; }
.y26-faq details { border-bottom:1px solid var(--line); padding:12px 0; } .y26-faq summary { cursor:pointer; font-weight:600; } .y26-faq details p { margin-top:8px; }
.y26-foot { color:var(--faint); font-size:12.5px; line-height:1.5; padding-top:18px; } .y26-foot a { color:var(--muted); }

/* story overlay */
.st-wrap { position:fixed; inset:0; z-index:50; display:grid; place-items:center; background:rgba(8,7,6,.94); }
.st { position:relative; width:min(100vw, calc(100dvh * 9 / 16)); height:100dvh; overflow:hidden; background:var(--bg); }
@media (min-width:700px) { .st { height:min(100dvh, 900px); border-radius:22px; border:1px solid var(--line); } }
.st-glow { position:absolute; inset:-20%; pointer-events:none; }
.st-glow i { position:absolute; width:70%; aspect-ratio:1; border-radius:50%; opacity:.5; will-change:transform; animation:blob 14s ease-in-out infinite alternate; }
.st-glow i:nth-child(1) { left:0; top:5%; background:radial-gradient(circle, rgba(201,160,99,.85), rgba(201,160,99,0) 70%); }
.st-glow i:nth-child(2) { right:-10%; top:45%; background:radial-gradient(circle, rgba(122,59,46,.85), rgba(122,59,46,0) 70%); animation-duration:19s; }
@keyframes blob { to { transform:translate(14%,-10%) scale(1.2); } }
.lite .st-glow i { animation:none; }
.st-bars { position:absolute; z-index:5; top:calc(env(safe-area-inset-top) + 10px); left:12px; right:12px; display:flex; gap:4px; }
.st-bars span { flex:1; height:3px; border-radius:3px; background:rgba(236,228,214,.18); overflow:hidden; } .st-bars b { display:block; height:100%; background:var(--text); transform-origin:left; transform:scaleX(0); } .st-bars .done b { transform:none; }
.st-top { position:absolute; z-index:6; top:calc(env(safe-area-inset-top) + 22px); left:14px; right:10px; display:flex; align-items:center; gap:8px; }
.st-top .br { font:italic 15px var(--serif); flex:1; }
.st-ic { width:36px; height:36px; border-radius:50%; border:1px solid var(--line); background:rgba(13,12,11,.7); display:grid; place-items:center; cursor:pointer; color:#fff; text-decoration:none; }
.st-ic svg { width:18px; height:18px; }
.st-src { position:absolute; z-index:6; left:14px; bottom:calc(env(safe-area-inset-bottom) + 14px); max-width:82%; display:flex; gap:8px; align-items:center; font-size:11px; color:var(--muted); padding:6px 10px; border-radius:999px; background:rgba(13,12,11,.8); border:1px solid var(--line); opacity:0; transition:opacity .4s; }
.st-src.on { opacity:1; } .st-src .nm { color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .st-src a { color:var(--muted); text-decoration:none; white-space:nowrap; }
.dz-credit { display:inline-flex; align-items:center; gap:4px; color:var(--muted); text-decoration:none; } .dz-credit svg { height:10px; width:auto; }
.sl { position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; justify-content:safe center; padding:84px 26px 70px; overflow:hidden; }
.sl .in { opacity:0; }
.k { font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--amber); margin:0 0 14px; }
.big { font:600 clamp(64px, 22vw, 108px)/.95 var(--serif); letter-spacing:-.03em; font-variant-numeric:tabular-nums; margin:4px 0 10px; }
.mid { font:500 clamp(26px, 8vw, 38px)/1.1 var(--serif); margin:6px 0; word-break:break-word; }
.mid.long { font-size:clamp(22px, 6.6vw, 32px); }
.p { color:var(--muted); font-size:15px; line-height:1.5; margin:0 0 10px; }
.cov { display:block; width:min(62vw, 250px); height:min(62vw, 250px); border-radius:14px; margin:0 auto 18px; object-fit:cover; background:var(--bg-3); box-shadow:0 10px 30px rgba(0,0,0,.45); }
.c { text-align:center; }
.hint { position:absolute; z-index:4; right:16px; bottom:calc(env(safe-area-inset-bottom) + 18px); font-size:11px; color:var(--faint); letter-spacing:.08em; text-transform:uppercase; }
.s-btn.ghost { background:transparent; color:var(--text); border:1px solid var(--line); }
.acts { display:flex; flex-direction:column; gap:10px; align-items:center; margin-top:18px; }
@media (prefers-reduced-motion: reduce) { .st-glow i { animation:none; } }
