:root{
  --bg:#061019;
  --bg2:#081722;
  --white:#f5f7f9;
  --muted:#aeb8c1;
  --ice:#86abc8;
  --ice2:#bdd6e9;
  --line:rgba(134,171,200,.28);
}
*{box-sizing:border-box}
html{background:#03090e}
body{
  margin:0;
  min-height:100vh;
  background:#061019;
  color:var(--white);
  font-family:"Segoe UI",Arial,sans-serif;
}
a{color:inherit;text-decoration:none}
.topbar{
  height:64px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 4.5vw;
  background:#050c12;
  border-bottom:1px solid rgba(134,171,200,.08);
}
.brand{font-size:12px;font-weight:800;letter-spacing:.3em}
.brand span{color:var(--ice)}
.topbar nav{display:flex;gap:32px;font-size:clamp(10px,.66vw,12px);font-weight:800;letter-spacing:.15em}
.topbar nav a{padding:24px 0 17px;position:relative;color:#d3dae0}
.topbar nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:10px;height:1px;background:#9dbbd1}
.micro{justify-self:end;color:var(--ice);font-size:clamp(9px,.56vw,10px);line-height:1.4;letter-spacing:.18em;font-weight:800}

.journal-hero{
  min-height:385px;
  padding:78px 7vw 58px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px);
  gap:7vw;
  align-items:end;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 76% 35%,rgba(83,126,157,.13),transparent 30%),
    linear-gradient(125deg,#07131c 0%,#091923 55%,#050d13 100%);
}
.journal-kicker{
  color:var(--ice);
  font-size:12px;
  font-weight:800;
  letter-spacing:.26em;
  margin-bottom:18px;
}
.journal-hero h1{
  margin:0;
  font-family:"Arial Narrow",Arial,sans-serif;
  font-size:clamp(72px,8vw,132px);
  line-height:.78;
  letter-spacing:-.055em;
}
.journal-hero h1 span{color:#89aac6}
.journal-hero p{
  max-width:760px;
  margin:28px 0 0;
  color:#c0cad1;
  font-size:clamp(16px,1.1vw,21px);
  line-height:1.6;
}
.journal-side{
  border-left:1px solid rgba(142,181,209,.45);
  padding:8px 0 8px 26px;
  color:#96b8d1;
  font-size:12px;
  line-height:1.7;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.journal-main{
  padding:50px 7vw 80px;
  background:#07131c;
}
.journal-heading{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:18px;
  align-items:center;
  margin-bottom:30px;
}
.journal-heading h2{
  margin:0;
  font-size:15px;
  letter-spacing:.23em;
}
.journal-heading span{height:1px;background:var(--line)}

.journal-feature{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:42px;
  padding:38px 0 44px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.journal-feature .meta,.journal-card .meta,.article-meta{
  color:#83aac7;
  font-size:11px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.journal-feature h3{
  margin:12px 0 18px;
  max-width:900px;
  font-family:"Arial Narrow",Arial,sans-serif;
  font-size:clamp(42px,4.3vw,78px);
  line-height:.95;
  letter-spacing:-.035em;
}
.journal-feature p{
  margin:0;
  max-width:850px;
  color:#bac6ce;
  font-size:17px;
  line-height:1.6;
}
.journal-feature .read-link,.journal-card .read-link{
  align-self:end;
  justify-self:start;
  display:inline-flex;
  gap:18px;
  padding-bottom:6px;
  border-bottom:1px solid #7fa6c3;
  font-size:12px;
  font-weight:800;
  letter-spacing:.15em;
}

.journal-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  padding-top:28px;
}
.journal-card{
  min-height:255px;
  padding:26px;
  border:1px solid rgba(134,171,200,.2);
  background:linear-gradient(150deg,rgba(12,29,42,.78),rgba(5,13,19,.92));
  display:flex;
  flex-direction:column;
}
.journal-card h3{
  margin:12px 0 14px;
  font-family:"Arial Narrow",Arial,sans-serif;
  font-size:30px;
  line-height:1;
}
.journal-card p{
  margin:0 0 22px;
  color:#b8c4cd;
  font-size:14px;
  line-height:1.55;
}
.journal-card .read-link{margin-top:auto}

.journal-empty{
  padding:70px 0 90px;
  border-top:1px solid var(--line);
}
.journal-empty .eyebrow{
  color:var(--ice);
  font-size:11px;
  font-weight:800;
  letter-spacing:.2em;
}
.journal-empty h3{
  margin:12px 0 16px;
  font-family:"Arial Narrow",Arial,sans-serif;
  font-size:clamp(38px,4vw,66px);
  line-height:.95;
}
.journal-empty p{
  max-width:650px;
  margin:0;
  color:#b9c5cd;
  font-size:16px;
  line-height:1.6;
}

.article-wrap{
  width:min(900px,calc(100% - 48px));
  margin:0 auto;
  padding:72px 0 90px;
}
.article-back{
  display:inline-flex;
  gap:10px;
  color:#95b8d2;
  font-size:11px;
  font-weight:800;
  letter-spacing:.15em;
  margin-bottom:38px;
}
.article-header{
  padding-bottom:34px;
  border-bottom:1px solid var(--line);
}
.article-header h1{
  margin:13px 0 18px;
  font-family:"Arial Narrow",Arial,sans-serif;
  font-size:clamp(48px,6vw,88px);
  line-height:.95;
  letter-spacing:-.04em;
}
.article-summary{
  margin:0;
  max-width:760px;
  color:#bdc8cf;
  font-size:19px;
  line-height:1.55;
}
.article-body{
  padding-top:36px;
  color:#d6dde2;
  font:18px/1.75 Georgia,serif;
}
.article-body h2{
  margin:42px 0 15px;
  font:700 31px/1.15 "Segoe UI",Arial,sans-serif;
  color:#f5f7f9;
}
.article-body p{margin:0 0 22px}
.article-body blockquote{
  margin:34px 0;
  padding:8px 0 8px 24px;
  border-left:2px solid #89aac6;
  color:#c8d7e2;
  font-style:italic;
  font-size:23px;
}
.article-missing{
  padding:80px 0;
  color:#bdc8cf;
}

footer{
  height:58px;
  padding:0 3.5vw;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  background:#050d13;
  border-top:1px solid var(--line);
  color:#7f9db5;
  font-size:clamp(9px,.56vw,10px);
  letter-spacing:.16em;
}
footer span:last-child{text-align:right}

@media(max-width:900px){
  .topbar{grid-template-columns:1fr;padding:0 22px}
  .topbar nav,.micro{display:none}
  .journal-hero{grid-template-columns:1fr;padding:58px 24px 48px}
  .journal-side{display:none}
  .journal-main{padding:38px 24px 60px}
  .journal-feature{grid-template-columns:1fr}
  .journal-grid{grid-template-columns:1fr}
  footer{grid-template-columns:1fr;height:auto;gap:10px;padding:20px 24px}
  footer span:last-child{text-align:left}
}