/* Story is readable in document order before JavaScript and on small screens. */
.story-page { background:var(--navy-deep); }
.story-stage { color:var(--ivory); background:radial-gradient(ellipse at 90% 35%,#344566,var(--navy-deep) 70%); }
.story-pin { position:relative; padding:140px 7vw 60px; }
.story-opening,.story-chapter { max-width:620px; padding:40px 0 70px; }
.story-opening h1,.story-chapter h2,.story-next h2 { font:500 clamp(42px,5.2vw,78px)/1.03 var(--serif); letter-spacing:-.025em; }
.story-opening h1 em { font-style:normal; color:var(--gold-soft); }
.story-opening>p:not(.eyebrow) { margin-top:26px; max-width:390px; font-size:20px; color:#c9d0de; }
.story-start { display:inline-flex; gap:24px; margin-top:30px; color:var(--gold-soft); text-underline-offset:7px; }
.story-chapter { scroll-margin-top:100px; }
.story-tag { color:var(--gold-soft); font-size:21px; margin-top:20px; }
.story-problem { margin-top:14px; color:#c9d0de; font-size:18px; max-width:510px; }
.story-answer { border-left:2px solid var(--gold); padding:0 0 0 22px; margin-top:28px; max-width:530px; }
.story-answer h3 { font-size:13px; text-transform:uppercase; letter-spacing:.16em; color:var(--gold-soft); margin-bottom:8px; }
.story-answer p { color:#e0e4ed; font-size:17px; }
.story-chapter .btn { background:var(--gold-soft); color:var(--navy); margin-top:24px; }
.story-portrait { position:relative; width:min(380px,100%); margin:auto; }
.story-portrait img { width:100%; height:auto; }
.story-signature { position:absolute; bottom:0; left:0; right:0; padding:40px 24px 24px; background:linear-gradient(transparent,var(--navy-deep)); font:32px var(--serif); }
.story-signature span { display:block; margin-top:8px; font:14px/1.5 var(--sans); color:var(--gold-soft); }
.story-progress { display:none; }
.story-next { padding:90px 7vw; background:var(--paper); color:var(--navy); }
.story-next .eyebrow { color:#806235; }
.story-next>p:not(.eyebrow) { max-width:640px; margin-top:24px; }
.story-next>div { display:flex; flex-wrap:wrap; gap:24px; align-items:center; margin-top:30px; }
.story-contact { text-underline-offset:6px; }
.story-source { font-size:13px; color:var(--muted); }
.story-page a:focus-visible { outline:3px solid var(--gold); outline-offset:6px; }
.story-page .id { min-width:0; }
.story-page .id a { overflow-wrap:anywhere; }
@media (min-width:1000px) and (min-height:740px) and (prefers-reduced-motion:no-preference) {
 .story-animated .story-stage { height:500vh; }
 .story-animated .story-pin { position:sticky; top:0; height:100svh; padding:0; overflow:hidden; }
 .story-animated .story-opening,.story-animated .story-chapter { position:absolute; top:50%; left:7vw; width:49vw; max-width:650px; padding:0; transform:translateY(-50%); }
 .story-animated .story-chapter { visibility:hidden; opacity:0; }
 .story-animated .story-portrait { position:absolute; bottom:0; right:1vw; width:39vw; max-width:590px; height:83%; margin:0; }
 .story-animated .story-portrait img { height:100%; object-fit:contain; object-position:bottom; }
 .story-animated .story-signature { padding-bottom:90px; text-align:right; padding-right:5vw; }
 .story-animated .story-progress { display:flex; gap:24px; position:absolute; bottom:0; left:0; right:0; padding:22px 7vw; background:rgba(18,27,50,.95); border-top:1px solid #ffffff20; z-index:6; }
 .story-progress a { color:#a7b1c6; font-size:14px; text-decoration:none; padding:7px 0; border-bottom:2px solid transparent; }
 .story-progress a[aria-current] { color:var(--gold-soft); border-color:var(--gold); }
 .story-progress span { margin-right:8px; font-size:11px; }
}
@media(max-width:600px) {
 .story-pin { padding:105px 6vw 0; }
 .story-opening { padding-top:30px; }
 .story-chapter { border-top:1px solid #ffffff24; padding:50px 0; }
 .story-tag { font-size:19px; }
 .story-page .id { align-items:flex-start; gap:14px; }
 .story-page .id .monogram { width:48px; height:48px; flex-shrink:0; font-size:24px; }
 .story-page .id .role2 { font-size:16px; }
 .nav-links { gap:10px; }
 .nav-cta { padding:7px 10px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

@media (prefers-reduced-motion:no-preference) { .story-animated .story-opening,.story-animated .story-chapter { transition:opacity .3s ease; } }

/* The landing page inherits the original opening curtain reveal. */
.story-pin>.curtain { display:none; pointer-events:none; }
@media (min-width:1000px) and (min-height:740px) and (prefers-reduced-motion:no-preference) {
 .story-animated .story-stage { height:560vh; }
 .story-animated .story-pin>.curtain { display:block; z-index:2; }
 .story-animated .story-opening { z-index:3; color:var(--navy); }
 .story-animated .story-opening .eyebrow,.story-animated .story-opening h1 em,.story-animated .story-start { color:#806235; }
 .story-animated .story-opening>p:not(.eyebrow) { color:var(--ink); }
 .story-animated .story-portrait { z-index:4; transform-origin:bottom right; pointer-events:none; }
 .story-animated .story-chapter { z-index:1; }
}
/* Complete slide transitions: a substantial vertical entrance and curtain reveal. */
.story-controls { display:none; }
@media(min-width:1000px) and (min-height:740px) and (prefers-reduced-motion:no-preference) {
 .story-animated .story-opening,.story-animated .story-chapter { opacity:0; visibility:hidden; transform:translateY(calc(-50% + var(--slide-direction,1)*90px)) scale(.96); filter:blur(8px); transition:opacity .65s ease,transform .85s cubic-bezier(.22,1,.36,1),filter .75s ease,visibility 0s .85s; }
 .story-animated .story-pin .is-current { opacity:1; visibility:visible; transform:translateY(-50%) scale(1); filter:blur(0); transition-delay:.12s,.12s,.12s,0s; }
 .story-animated .story-pin>.curtain { transition:transform 1s cubic-bezier(.65,0,.25,1); }
 .story-animated .is-open .curtain.left { transform:translateX(-101%); }
 .story-animated .is-open .curtain.right { transform:translateX(101%); }
 .story-animated .story-portrait { transition:transform 1s cubic-bezier(.22,1,.36,1); }
 .story-animated .is-open .story-portrait { transform:translateX(2vw) scale(.92); }
 .story-animated .story-controls { display:flex; position:absolute; bottom:32px; left:7vw; gap:12px; z-index:8; }
 .story-controls button { border:1px solid var(--gold); border-radius:50%; width:48px;height:48px; background:var(--navy); color:var(--gold-soft); cursor:pointer; font-size:24px; }
 .story-controls button:disabled { opacity:.3; cursor:default; }
 .story-controls button:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
}

.story-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:24px; }
.story-chapter .story-actions .btn { margin-top:0; }
.story-chapter .story-actions .solution-btn { background:transparent; color:var(--gold-soft); border:1px solid var(--gold); }
.story-chapter .story-actions .solution-btn:hover { background:var(--gold-soft); color:var(--navy); }
/* Phone presentation: the same complete-slide motion in a compact composition. */
@media (max-width:999px) and (min-height:540px) and (prefers-reduced-motion:no-preference) {
 .story-animated .story-stage { height:500svh; }
 .story-animated .story-pin { position:sticky;top:0;height:100svh;padding:0;overflow:hidden; }
 .story-animated .story-pin>.curtain { display:block;z-index:2;transition:transform 1s cubic-bezier(.65,0,.25,1); }
 .story-animated .is-open .curtain.left { transform:translateX(-101%); }
 .story-animated .is-open .curtain.right { transform:translateX(101%); }
 .story-animated .story-opening,.story-animated .story-chapter { position:absolute;top:49%;left:6vw;right:6vw;width:auto;max-width:none;padding:0;margin:0;max-height:calc(100svh - 125px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;border:0;opacity:0;visibility:hidden;transform:translateY(calc(-50% + var(--slide-direction,1)*70px)) scale(.95);filter:blur(8px);transition:opacity .65s ease,transform .85s cubic-bezier(.22,1,.36,1),filter .75s ease,visibility 0s .85s; }
 .story-animated .story-pin .is-current { opacity:1;visibility:visible;transform:translateY(-50%) scale(1);filter:blur(0);transition-delay:.1s,.1s,.1s,0s; }
 .story-animated .story-opening { z-index:3;top:38%;color:var(--navy); }
 .story-animated .story-opening .eyebrow,.story-animated .story-opening h1 em,.story-animated .story-start { color:#806235; }
 .story-animated .story-opening>p:not(.eyebrow) { color:var(--ink); }
 .story-animated .story-opening h1 { font-size:clamp(41px,10vw,66px); }
 .story-animated .story-opening>p:not(.eyebrow) { font-size:16px;margin-top:16px;max-width:290px; }
 .story-animated .story-start { margin-top:18px; }
 .story-animated .story-chapter { z-index:1;top:47%; }
 .story-animated .story-chapter h2 { font-size:clamp(38px,9.3vw,56px); }
 .story-animated .story-tag { font-size:18px;margin-top:15px; }
 .story-animated .story-problem { font-size:15px;margin-top:10px; }
 .story-animated .story-answer { margin-top:17px;padding-left:14px; }
 .story-animated .story-answer p { font-size:15px; }
 .story-animated .story-actions { gap:9px;margin-top:16px; }
 .story-animated .story-actions .btn { padding:10px 15px;font-size:13px; }
 .story-animated .story-portrait { position:absolute;bottom:0;right:-9vw;width:67vw;height:49svh;max-width:none;margin:0;z-index:4;pointer-events:none;transform-origin:bottom right;transition:transform 1s ease,opacity .6s ease; }
 .story-animated .story-portrait img { height:100%;object-fit:contain;object-position:bottom right; }
 .story-animated .story-signature { display:none; }
 .story-animated .is-open .story-portrait { transform:translateX(5vw) scale(.9);opacity:0; }
 .story-animated .story-controls { display:flex;position:absolute;bottom:12px;right:6vw;gap:8px;z-index:8; }
 .story-animated .story-controls button { width:40px;height:40px;font-size:20px; }
}
@media (max-width:999px) and (max-height:680px) and (prefers-reduced-motion:no-preference) {
 .story-animated .story-opening { top:39%; }
 .story-animated .story-opening h1 { font-size:clamp(36px,8vw,48px); }
 .story-animated .story-portrait { height:38svh; }
 .story-animated .story-chapter h2 { font-size:clamp(34px,8vw,45px); }
 .story-animated .story-tag { font-size:16px; }
 .story-animated .story-problem,.story-animated .story-answer p { font-size:14px; }
}