.archive-page{background:#020910}
.archive-page .page-shell{background:linear-gradient(180deg,#020a11,#03101a 28%,#020910 100%)}

.archive-hero{min-height:620px;position:relative;display:grid;align-items:center;isolation:isolate;border-bottom:1px solid var(--line);overflow:hidden}
.archive-hero-art{position:absolute;inset:0;background:url('archive-dossier.webp') center/cover no-repeat;z-index:-3;filter:saturate(.65) contrast(1.08);transform:scale(1.03)}
.archive-hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(2,8,13,.97) 0%,rgba(2,8,13,.9) 42%,rgba(2,8,13,.45) 74%,rgba(2,8,13,.8) 100%),linear-gradient(180deg,rgba(2,8,13,.15),rgba(2,8,13,.96))}
.archive-hero-content{width:min(760px,88vw);padding:90px clamp(30px,7vw,110px) 70px}
.archive-overline,.archive-kicker,.record-code,.story-era{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em}
.archive-overline{margin:0 0 18px;color:#59c5ff;font-size:11px}
.archive-hero h1{font-family:var(--hero-display);font-size:clamp(54px,7vw,96px);font-weight:400;letter-spacing:.13em;text-transform:uppercase;margin:0;color:#ecf3f7;text-shadow:0 0 26px rgba(65,186,255,.18)}
.archive-hero h2{font-size:clamp(22px,3vw,34px);font-weight:300;text-transform:uppercase;letter-spacing:.12em;line-height:1.25;margin:18px 0;color:#d9e6ed}
.archive-hero-content>p:not(.archive-overline){max-width:680px;color:#aebfca;font-size:16px;line-height:1.65;margin:0 0 10px}
.archive-scroll{display:inline-flex;align-items:center;gap:24px;margin-top:24px;border:1px solid rgba(65,186,255,.45);padding:11px 15px;color:#78d2ff;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.13em}
.archive-scroll:hover{border-color:var(--blue);color:#d7f2ff;background:rgba(65,186,255,.06)}

.archive-index{padding:82px clamp(24px,5vw,76px) 92px;border-bottom:1px solid var(--line)}
.archive-section-heading{max-width:720px;margin-bottom:34px}
.archive-kicker{font-size:11px;color:#4fc0ff;margin:0 0 10px}
.archive-section-heading h2{font-size:clamp(30px,4vw,48px);font-weight:300;text-transform:uppercase;letter-spacing:.14em;margin:0 0 12px}
.archive-section-heading>p:last-child{color:#98aab5;font-size:14px;margin:0}
.record-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.record-card{border:1px solid rgba(113,174,210,.2);background:linear-gradient(180deg,rgba(8,22,32,.9),rgba(3,11,17,.95));min-height:360px;overflow:hidden;position:relative;transition:transform .2s,border-color .2s,box-shadow .2s}
.record-card>img{width:100%;height:210px;object-fit:cover;filter:saturate(.72) contrast(1.07)}
.record-copy{padding:18px}
.record-code{font-size:8px;color:#4bbcff;margin:0 0 8px}
.record-copy h3{font-size:17px;text-transform:uppercase;letter-spacing:.12em;font-weight:300;margin:0 0 5px}
.record-copy>p:not(.record-code){font-family:var(--mono);text-transform:uppercase;letter-spacing:.09em;color:#94a7b3;font-size:9px;margin:0 0 18px}
.record-copy span{font-family:var(--mono);text-transform:uppercase;letter-spacing:.11em;font-size:9px;color:#6f8490}
.record-copy span b{font-size:14px;margin-left:8px}
.active-record:hover{transform:translateY(-4px);border-color:rgba(65,186,255,.5);box-shadow:0 16px 35px rgba(0,0,0,.24)}
.active-record .record-copy span{color:#58c6ff}
.locked-record:after{content:"RESTRICTED";position:absolute;top:18px;right:-28px;transform:rotate(35deg);width:135px;text-align:center;padding:4px 0;background:rgba(135,37,34,.88);color:#f2c1bc;font-family:var(--mono);font-size:8px;letter-spacing:.15em;border-top:1px solid rgba(255,190,185,.35);border-bottom:1px solid rgba(255,190,185,.35)}
.locked-record>img{opacity:.44;filter:grayscale(.7) saturate(.35) contrast(1.08)}

.archive-story{max-width:1120px;margin:0 auto;padding:96px clamp(22px,4vw,52px) 88px}
.archive-story + .archive-story{border-top:1px solid rgba(113,174,210,.16)}
.story-file-header{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(360px,1.1fr);gap:42px;align-items:stretch;margin-bottom:46px;border:1px solid rgba(99,173,215,.22);background:linear-gradient(135deg,rgba(7,22,32,.88),rgba(3,12,18,.95))}
.story-file-image{position:relative;min-height:330px;overflow:hidden}
.story-file-image img{width:100%;height:100%;min-height:330px;object-fit:cover;filter:saturate(.65) contrast(1.08)}
.protect-mother .story-file-image img{object-position:center 22%}
.story-file-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 62%,rgba(2,9,15,.78))}
.story-file-image span{position:absolute;left:18px;top:18px;z-index:2;padding:6px 9px;border:1px solid rgba(61,206,137,.6);color:#69dba0;background:rgba(3,26,19,.78);font-family:var(--mono);font-size:9px;letter-spacing:.14em}
.story-file-copy{padding:38px 38px 32px 0;align-self:center}
.story-file-copy h2{font-family:var(--hero-display);font-size:clamp(36px,5vw,60px);font-weight:400;letter-spacing:.1em;text-transform:uppercase;margin:4px 0 13px;color:#eef5f8}
.story-era{font-size:10px;color:#e7a745;margin:0 0 24px}
.story-file-copy dl{margin:0;border-top:1px solid rgba(115,179,216,.18)}
.story-file-copy dl div{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:10px 0;border-bottom:1px solid rgba(115,179,216,.13)}
.story-file-copy dt{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#688696}
.story-file-copy dd{margin:0;font-size:12px;color:#becbd3}

.story-body{width:min(780px,100%);margin:0 auto;padding:54px clamp(24px,6vw,70px) 64px;background:linear-gradient(180deg,rgba(11,22,28,.94),rgba(5,13,18,.97));border:1px solid rgba(120,167,193,.18);box-shadow:0 30px 80px rgba(0,0,0,.28);position:relative}
.story-body:before{content:"COMMONWEALTH ARCHIVE / 001";display:block;margin-bottom:30px;padding-bottom:15px;border-bottom:1px solid rgba(123,174,202,.16);font-family:var(--mono);font-size:8px;letter-spacing:.18em;color:#607b8a}
.protect-mother .story-body:before{content:"COMMONWEALTH ARCHIVE / 004"}
.story-body p{font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.88;color:#d3d9dc;margin:0 0 1.5em;letter-spacing:.005em}
.story-body p:first-of-type:first-letter{float:left;font-family:var(--hero-display);font-size:58px;line-height:.8;padding:9px 10px 2px 0;color:#64c8ff}
.protect-mother .story-body .story-intro{font-family:var(--display);font-size:15px;line-height:1.7;color:#9fb3bf;letter-spacing:.03em}
.protect-mother .story-body .story-intro:first-of-type:first-letter{float:none;font-family:inherit;font-size:inherit;line-height:inherit;padding:0;color:inherit}
.protect-mother .story-body .story-intro:nth-of-type(3){margin-bottom:2.6em;color:#dce6eb;font-style:italic}
.story-body p:nth-of-type(4),.story-body p:nth-of-type(12),.story-body p:nth-of-type(17),.story-body p:nth-of-type(31){color:#e8edf0}
.story-file-footer{width:min(780px,100%);margin:18px auto 0;display:flex;justify-content:space-between;gap:22px;font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#5f7a88}
.story-file-footer a{color:#5fc9ff}
.story-file-footer a:hover{color:#d8f3ff}

.archive-close{border-top:1px solid var(--line);display:grid;grid-template-columns:120px minmax(0,720px);justify-content:center;gap:42px;align-items:center;padding:72px 24px 78px;background:radial-gradient(circle at 50% 100%,rgba(19,79,111,.18),transparent 42%)}
.archive-close>img{width:82px;justify-self:center;filter:drop-shadow(0 0 18px rgba(65,186,255,.28))}
.archive-close h2{font-size:clamp(25px,4vw,42px);font-weight:300;text-transform:uppercase;letter-spacing:.12em;margin:0 0 12px}
.archive-close p:not(.archive-kicker){color:#9fb0ba;line-height:1.6;margin:0 0 18px}
.archive-actions{display:flex;gap:14px;flex-wrap:wrap}
.archive-footer{min-height:68px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.11em;font-size:9px;color:#637d8c}
.archive-footer a{color:#78cfff}

@media(max-width:980px){
  .archive-hero{min-height:560px}
  .record-grid{grid-template-columns:repeat(2,1fr)}
  .story-file-header{grid-template-columns:1fr}
  .story-file-copy{padding:0 34px 34px}
  .story-file-image:after{background:linear-gradient(180deg,transparent 60%,rgba(2,9,15,.82))}
}

@media(max-width:760px){
  .archive-hero{min-height:530px}
  .archive-hero-content{padding:70px 24px 60px}
  .archive-hero h1{font-size:44px;letter-spacing:.09em}
  .archive-hero h2{font-size:20px}
  .archive-hero-content>p:not(.archive-overline){font-size:14px}
  .archive-index{padding:60px 18px 66px}
  .record-grid{grid-template-columns:1fr}
  .record-card{min-height:0}
  .record-card>img{height:200px}
  .archive-story{padding:70px 14px 62px}
  .story-file-image,.story-file-image img{min-height:250px}
  .story-file-copy{padding:0 22px 28px}
  .story-file-copy h2{font-size:34px}
  .story-body{padding:38px 21px 44px}
  .story-body p{font-size:16px;line-height:1.78}
  .story-file-footer{flex-direction:column;align-items:flex-start;padding:0 4px}
  .archive-close{grid-template-columns:1fr;text-align:center;gap:20px;padding:58px 22px}
  .archive-actions{justify-content:center}
  .archive-footer{padding:0 18px;gap:16px}
}