/* Focused trust, stewardship, status, and homepage-compression refinements. */

/* Reclaim premium above-the-fold space when the full desktop navigation is visible. */
@media (min-width: 1181px) {
  #overview.hero { padding-top: 118px; }
}

/* Hero microcopy should remain readable even though the overall site uses an 18px root size. */
.hero-flow-chip { font-size: .78rem; }
.hero-flow-step h3 { font-size: .92rem; }
.hero-flow-step p { font-size: .8rem; line-height: 1.5; }
.hero-flow-boundary p { font-size: .88rem; }
.hero-flow-boundary a { font-size: .8rem; }

/* Once the homepage join panel is detached, the Why section becomes a single strong thesis column. */
.home-compressed .why-it-matters-section .why-now-layout {
  grid-template-columns: minmax(0, 920px);
}
.home-compressed .why-it-matters-section .why-now-copy { max-width: 920px; }
.home-compressed .public-flow-section { display: none; }

/* Compact bridge from the five-step hero to the full process page. */
.process-bridge {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(44,108,255,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.72);
  color: #536a79;
  font-size: .92rem;
  line-height: 1.6;
}
.process-bridge strong { color: #102d3e; }
.process-bridge a { color: #194ba9; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }

/* Four clear involvement paths. */
.join-role-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: .75rem;
  margin: 1.35rem 0 1.5rem;
}
.join-role-card {
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 14px;
  background: rgba(255,255,255,.055);
}
.join-role-card strong { display:block; margin-bottom:.42rem; color:#fff; font-size:.92rem; line-height:1.35; }
.join-role-card span { color:rgba(255,255,255,.68); font-size:.86rem; line-height:1.55; }
.join-role-card a { display:inline-block; margin-top:.8rem; color:#a9f6ea; font-size:.82rem; font-weight:750; text-decoration:underline; text-underline-offset:3px; }

/* Founder / stewardship disclosure. */
.stewardship-section { background: linear-gradient(180deg,#f7f9fa,#eef5f6); }
.stewardship-layout {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) minmax(280px,.7fr);
  gap: 2rem;
  align-items: start;
}
.stewardship-card {
  padding: clamp(1.4rem,3vw,2rem);
  border: 1px solid rgba(14,49,69,.1);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 52px rgba(11,42,60,.07);
}
.stewardship-card h3 { margin:.15rem 0 .85rem; color:#102d3e; font-size:1.45rem; letter-spacing:-.025em; }
.stewardship-card p { margin:.7rem 0 0; color:#58707c; font-size:.95rem; line-height:1.7; }
.stewardship-facts { display:grid; gap:.7rem; }
.stewardship-fact { padding:1rem; border:1px solid rgba(14,49,69,.1); border-radius:14px; background:#fff; }
.stewardship-fact span { display:block; color:#708590; font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.stewardship-fact strong { display:block; margin-top:.32rem; color:#102d3e; font-size:.96rem; line-height:1.45; }
.stewardship-disclosure { margin-top:1rem; padding:1rem 1.1rem; border-left:3px solid #23978a; background:#eaf6f3; color:#355967; font-size:.9rem; line-height:1.65; }

/* Dedicated status page. */
.status-hero {
  padding: 132px 0 72px;
  color:#fff;
  background: radial-gradient(circle at 74% 30%, rgba(25,182,164,.14), transparent 30%), linear-gradient(150deg,#06101e,#0a1830 54%,#07121f);
}
.status-hero h1 { margin:0; max-width:900px; font-size:clamp(3rem,6vw,5.6rem); line-height:.96; letter-spacing:-.055em; font-weight:650; }
.status-hero p:not(.eyebrow) { max-width:820px; color:rgba(255,255,255,.72); font-size:1.04rem; line-height:1.65; }
.status-page-main { background:#f4f7fb; }
.status-overview-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.5fr); gap:1rem; margin-top:1.5rem; }
.status-overview-card { padding:1.25rem; border:1px solid rgba(14,49,69,.1); border-radius:16px; background:#fff; }
.status-overview-card span { display:block; color:#708590; font-size:.76rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.status-overview-card strong { display:block; margin-top:.4rem; color:#102d3e; font-size:1.2rem; }
.status-overview-card p { margin:.5rem 0 0; color:#5c7480; font-size:.9rem; line-height:1.65; }
.status-gate-list { display:grid; gap:.7rem; margin-top:1.5rem; }
.status-gate-row { display:grid; grid-template-columns:2.15rem minmax(0,1fr) auto; gap:.9rem; align-items:start; padding:1rem 1.05rem; border:1px solid rgba(14,49,69,.1); border-radius:14px; background:#fff; }
.status-gate-code { display:grid; place-items:center; width:2.15rem; height:2.15rem; border-radius:50%; background:#eef4ff; color:#194ba9; font-size:.78rem; font-weight:800; }
.status-gate-row strong { display:block; color:#102d3e; font-size:.98rem; }
.status-gate-row p { margin:.32rem 0 0; color:#607783; font-size:.9rem; line-height:1.6; }
.status-gate-state { padding:.3rem .55rem; border-radius:999px; font-size:.76rem; font-weight:800; letter-spacing:.07em; }
.status-gate-state.pass { background:#e7f6f1; color:#176553; border:1px solid #b9dfd4; }
.status-gate-state.pending { background:#fff1db; color:#76510b; border:1px solid #efc67d; }
.status-residual { margin-top:1.5rem; padding:1.25rem; border-radius:16px; background:#0b1c2c; color:#fff; }
.status-residual h3 { margin:0 0 .7rem; }
.status-residual ul { margin:.4rem 0 0; padding-left:1.15rem; color:rgba(255,255,255,.76); }
.status-residual li + li { margin-top:.45rem; }
.status-source { margin-top:1rem; color:#607783; font-size:.88rem; line-height:1.65; }
.status-source code { overflow-wrap:anywhere; }

/* --------------------------------------------------------------------------
   Human-readability and visual-consistency pass
   -------------------------------------------------------------------------- */

/* The site deliberately uses the platform UI stack; Inter is not shipped. */
body {
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
}

/* Fixed-header anchors must land below the header rather than underneath it. */
html { scroll-padding-top: 104px; }
main [id], section[id] { scroll-margin-top: 104px; }

/* Homepage status is a compact human summary, not a second technical record. */
#n1-status .status-summary { display:grid; gap:1.15rem; }
#n1-status .section-intro { margin-bottom:0; }
#n1-status .status-evidence { margin-top:0; }
#n1-status .status-evidence a { font-size:.86rem; }

/* How-it-works hero: intentional two-column composition rather than a floating card. */
#how-overview .hero-layout {
  grid-template-columns: minmax(0, 1.18fr) minmax(300px, .72fr);
  gap: clamp(2.2rem, 5vw, 5rem);
  align-items: center;
}
#how-overview .hero-copy { max-width: 760px; }
#how-overview .hero-copy h1 {
  max-width: 760px;
  font-size: clamp(3.25rem, 5.2vw, 4.9rem);
  line-height: .99;
}
#how-overview .nonbinding-rule {
  align-self:center;
  width:100%;
  max-width:430px;
  margin-inline:auto;
}

/* Fair, scan-friendly comparison of three different governance mechanisms. */
.governance-comparison {
  overflow:hidden;
  margin-top:1.5rem;
  border:1px solid rgba(14,49,69,.12);
  border-radius:18px;
  background:#fff;
  box-shadow:0 16px 45px rgba(10,42,61,.07);
}
.comparison-row {
  display:grid;
  grid-template-columns:minmax(150px,.85fr) repeat(3,minmax(0,1.25fr));
}
.comparison-row + .comparison-row { border-top:1px solid rgba(14,49,69,.09); }
.comparison-row > * {
  min-width:0;
  padding:1rem 1.05rem;
  border-left:1px solid rgba(14,49,69,.08);
  color:#4d6674;
  font-size:.9rem;
  line-height:1.6;
}
.comparison-row > :first-child { border-left:0; }
.comparison-head { background:#0b1c2c; }
.comparison-head > * { color:#fff; font-size:.9rem; font-weight:800; }
.comparison-head > :first-child { color:rgba(255,255,255,.62); text-transform:uppercase; letter-spacing:.08em; font-size:.74rem; }
.comparison-row-label { background:#f4f7fb; color:#254657; font-weight:800; }
.comparison-note {
  margin:1rem 0 0;
  padding:1rem 1.1rem;
  border-left:3px solid #23978a;
  background:#eef8f5;
  color:#3f606d;
  font-size:.9rem;
  line-height:1.65;
}
.comparison-sources { margin-top:1rem; color:#5f7682; font-size:.86rem; line-height:1.65; }
.comparison-sources a { color:#1657ad; text-decoration:underline; text-underline-offset:3px; }

/* Avoid an orphaned third card in the climate example. */
#climate-policy .meaning-grid > :last-child:nth-child(odd) { grid-column:1 / -1; }

/* Give useful secondary text a genuine reading size. */
.repo-disclosure,
.status-evidence,
.footer-primary p,
.footer-status p { font-size:max(.86rem, 14px); }

/* Harmonize the brand mark when older pages contain text-only brand links. */
.brand-polished .brand-mark { flex:0 0 auto; }

@media (max-width: 1180px) {
  html { scroll-padding-top: 88px; }
  main [id], section[id] { scroll-margin-top: 88px; }
  #how-overview .hero-layout { grid-template-columns:1fr; gap:1.8rem; }
  #how-overview .hero-copy { max-width:760px; }
  #how-overview .nonbinding-rule { max-width:760px; margin-inline:0; }
}

@media (max-width: 900px) {
  .comparison-row { grid-template-columns:1fr; }
  .comparison-head { display:none; }
  .comparison-row > * { border-left:0; }
  .comparison-row > *:not(.comparison-row-label)::before {
    content:attr(data-label);
    display:block;
    margin-bottom:.28rem;
    color:#708590;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .comparison-row > * + * { border-top:1px solid rgba(14,49,69,.06); }
  .comparison-row-label { padding-bottom:.75rem; }
}

@media (max-width: 980px) {
  .join-role-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stewardship-layout, .status-overview-grid { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
  .join-role-grid { grid-template-columns:1fr; }
  .status-gate-row { grid-template-columns:2.15rem minmax(0,1fr); }
  .status-gate-state { grid-column:2; justify-self:start; }
  .status-hero { padding-top:118px; }
}
@media (max-width: 480px) {
  .hero h1 { font-size:clamp(2.65rem,12.5vw,3rem); }
  #how-overview .hero-copy h1 { font-size:clamp(2.55rem,12vw,2.9rem); }
}