/* Holt Universe story pages. Loads after home.css and reuses its tokens, fonts, buttons, ridges and footer. */

.story-hero{position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 60%,var(--sky-low) 100%)}
.topbar{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;padding-block:18px}
.topbar a{text-decoration:none;display:inline-flex;align-items:center;gap:10px}
.topbar .home span{font-family:var(--display);font-weight:700;font-size:1.25rem}
.topbar .home img{border-radius:50%}
.topbar .login{color:var(--gold);font-weight:600;font-size:.95rem}
.topbar a:hover span,.topbar .login:hover{text-decoration:underline}

.story-head{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center;padding-block:24px 190px}
.eyebrow{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:700;margin:0 0 14px}
.story-head h1{margin-bottom:4px}
.subtitle{font-family:var(--display);font-style:italic;font-weight:600;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--gold);margin:0 0 18px}
.facts{color:var(--text-soft);margin:0 0 30px;font-variant-numeric:tabular-nums}
.pull{margin:0;padding:4px 0 4px 22px;border-left:2px solid var(--gold)}
.pull p{font-family:var(--display);font-style:italic;font-weight:600;font-size:clamp(1.3rem,2.3vw,1.65rem);line-height:1.35;margin:0 0 10px}
.pull cite{font-style:normal;color:var(--text-soft);font-size:.9rem}

.poster{margin:0;justify-self:center;max-width:400px;width:100%}
.poster a{display:block;border-radius:10px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px var(--card-line);
  transition:transform .35s ease,box-shadow .35s ease}
.poster a:hover,.poster a:focus-visible{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 30px 70px rgba(0,0,0,.6),0 0 0 1px var(--gold),0 0 40px rgba(217,169,63,.25)}
.poster a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.poster img{display:block;width:100%;height:auto}
.poster figcaption{color:var(--text-soft);font-size:.86rem;margin-top:12px;line-height:1.45}
.poster figcaption a{display:inline;box-shadow:none;color:var(--gold);border-radius:0;transform:none}

/* ARTICLE */
.article{background:var(--ridge-3);padding-block:30px 40px}
.col{max-width:720px;margin:0 auto;padding-inline:24px}
.article h2{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.2rem);line-height:1.15;margin:46px 0 12px;color:var(--text);text-wrap:balance}
.article .col > h2:first-child{margin-top:10px}
.article p{color:#d9deeb;margin:0 0 16px;font-size:1.06rem;line-height:1.72}
.doc{margin:22px 0 24px;padding:18px 22px;background:var(--card);border:1px solid var(--card-line);border-radius:12px}
.doc p{font-family:var(--display);font-style:italic;font-weight:600;font-size:1.3rem;line-height:1.4;color:var(--star);margin:0}
.weight{font-family:var(--display);font-weight:700;font-size:1.3rem!important;color:var(--gold)!important;line-height:1.4!important;margin-top:24px!important}

.line{list-style:none;margin:20px 0 22px;padding:0;counter-reset:gen}
.line li{position:relative;padding:8px 0 8px 46px;color:#d9deeb}
.line li::before{content:"";position:absolute;left:14px;top:50%;width:11px;height:11px;margin-top:-5px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px rgba(217,169,63,.7)}
.line li::after{content:"";position:absolute;left:19px;top:calc(50% + 8px);height:calc(100% - 4px);width:1.5px;background:var(--gold-soft)}
.line li:last-child::after{display:none}
.line b{color:var(--text);font-family:var(--display);font-size:1.15rem}

/* HOW WE KNOW */
.proof{margin-top:60px;padding-block:50px 56px;background:linear-gradient(180deg,var(--ridge-3),#0a1229);border-top:1px solid var(--card-line);border-bottom:1px solid var(--card-line)}
.proof .col h2{margin-top:0}
.proof-grid{max-width:1080px;margin:28px auto 0;padding-inline:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.pcard{position:relative;background:var(--card);border:1px solid var(--card-line);border-radius:14px;padding:24px 24px 20px 24px}
.pcard.wide{grid-column:1/-1}
.pcard.wide ul{columns:2;column-gap:40px}
.pcard.wide li{break-inside:avoid}
.article .eyebrow{color:var(--gold);font-size:.78rem;line-height:1.4;margin-bottom:10px}
.pcard .num{font-variant-numeric:lining-nums;position:absolute;top:18px;right:20px;font-family:var(--display);font-weight:700;font-size:2.4rem;line-height:1;color:var(--gold-soft)}
.pcard h3{font-family:var(--display);font-size:1.45rem;margin:0 0 12px;padding-right:40px}
.pcard ul{margin:0;padding-left:18px;color:#d9deeb}
.pcard li{margin-bottom:7px}
.pcard dl{margin:0;display:grid;grid-template-columns:minmax(0,11em) minmax(0,1fr);gap:12px 24px}
.pcard dt{color:var(--gold);font-weight:700;font-size:.9rem;letter-spacing:.04em}
.pcard dt{padding-top:2px}
.pcard dd{margin:0;color:#d9deeb}

.sources{padding-block:20px 30px}
.sources ul{padding-left:18px;color:var(--text-soft);font-size:.95rem}
.sources li{margin-bottom:8px}
.more{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:30px!important;color:var(--text-soft)}

@media (max-width:860px){
  .story-head{grid-template-columns:1fr;gap:34px;padding-block:10px 140px}
  .poster{max-width:320px}
  .proof-grid{grid-template-columns:1fr}
  .pcard dl{grid-template-columns:1fr;gap:2px}
  .pcard.wide ul{columns:1}
  .pcard dd{margin-bottom:12px}
}

/* short header for plain pages like Privacy */
.story-head.single{grid-template-columns:1fr;padding-block:20px 150px}
.plist{margin:0 0 16px;padding-left:20px;color:#d9deeb;font-size:1.06rem;line-height:1.7}
.plist li{margin-bottom:8px}
.plist b{color:var(--text)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--gold);font-weight:600;cursor:pointer;text-decoration:underline}
.linkbtn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}