body.story-page { background: #050705; color: #f5f8f2; }
.story-hero { padding: 155px 0 65px; background: radial-gradient(ellipse at 80% 35%, #8cff0018, transparent 50%); }
.story-hero-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 56px; }
.story-kicker { display: block; color: #8cff00; font: 800 11px/1.7 Arial, sans-serif; letter-spacing: 1.6px; margin-bottom: 18px; }
.story-hero h1 { color: #8cff00; font-size: clamp(48px,7vw,88px); line-height: 1.05; letter-spacing: -3px; margin-bottom: 24px; }
.story-hero p, .story-copy p { color: #c3cfbb; font-size: 17px; line-height: 1.85; margin: 0 0 20px; }
.story-hero .story-lead { color: #f5f8f2; font-size: clamp(22px,2.5vw,30px); line-height: 1.4; }
.story-hero-photo, .story-chapter > img { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid #8cff0040; }
.story-section { padding: 64px 0; }
.story-section-tinted { background: #0d130a; border-block: 1px solid #ffffff15; }
.story-chapter { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(30px,6vw,80px); }
.story-chapter-reverse .story-copy { order: 2; }
.story-copy h2 { color: #f5f8f2; font-size: clamp(29px,3.5vw,43px); line-height: 1.15; letter-spacing: -1px; margin-bottom: 24px; }
.story-copy p:last-child { margin-bottom: 0; }
.story-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin-top: 28px; }
.story-button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 54px; padding: 16px 22px; background: #8cff00; color: #101609; border: 1px solid #8cff00; border-radius: 8px; font-size: 14px; font-weight: 800; line-height: 1.5; }
.story-button:hover { color: #101609; background: #b2ff55; }
.story-text-link { color: #e5eddf; font-size: 14px; font-weight: 700; padding-block: 12px; }
.story-text-link:hover { color: #8cff00; }
.story-main a:focus-visible { outline: 3px solid #8cff00; outline-offset: 5px; }
@media(max-width:991px) { .story-hero { padding-top:125px; } .story-hero-grid,.story-chapter { grid-template-columns:1fr; gap:30px; } .story-chapter-reverse .story-copy { order:0; } .story-chapter > img,.story-hero-photo { max-width:700px; } }
@media(max-width:575px) { .story-hero { padding:110px 0 36px; } .story-hero h1 { letter-spacing:-2px; } .story-section { padding-block:36px; } .story-hero p,.story-copy p { font-size:16px; } }