/* =========================================================
   SPQR Aegis — Project Brake Pedal campaign page
   ========================================================= */
.page-brake { background: var(--paper); }

.brake-hero {
  min-height: 94svh;
  overflow: hidden;
  position: relative;
  padding: 164px 0 88px;
  isolation: isolate;
}
.brake-hero::before {
  width: min(820px, 82vw); aspect-ratio: 1; position: absolute; z-index: -1;
  top: -36%; right: -15%; border-radius: 50%;
  background: radial-gradient(circle, rgba(196,164,95,.22), rgba(196,164,95,0) 68%); content: "";
}
.brake-hero::after {
  width: 480px; aspect-ratio: 1; position: absolute; z-index: -1;
  left: -300px; bottom: -4%; border: 1px solid rgba(165,63,46,.14); border-radius: 50%;
  box-shadow: 0 0 0 72px rgba(165,63,46,.026), 0 0 0 144px rgba(165,63,46,.016); content: "";
}
.brake-hero-grid { display: grid; grid-template-columns: minmax(0,1.03fr) minmax(400px,.97fr); gap: 66px; align-items: center; }
.brake-hero h1 { max-width: 760px; font-size: clamp(60px,7.6vw,104px); }
.brake-kicker { margin: -5px 0 20px; color: var(--seal); font-family: var(--mono); font-size: clamp(17px,2vw,23px); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.brake-hero .hero-lede { max-width: 720px; }
.brake-hero .hero-meta { max-width: 760px; }

.brake-boundary-card {
  overflow: hidden; position: relative; padding: 26px; border: 1px solid rgba(255,255,255,.11);
  border-radius: var(--radius-lg); background: #0b111e; box-shadow: var(--shadow-dark); color: white;
}
.brake-boundary-card::before { width: 330px; height: 330px; position: absolute; top: -190px; right: -80px; border-radius: 50%; background: rgba(165,63,46,.34); filter: blur(70px); content: ""; }
.brake-card-topline { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; color: #7d899f; font-family: var(--mono); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.boundary-flow { display: grid; gap: 5px; position: relative; }
.boundary-node { min-height: 92px; display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.035); }
.boundary-node.is-aegis { border-color: rgba(196,164,95,.38); background: rgba(196,164,95,.08); }
.boundary-node.is-denied { border-color: rgba(238,136,121,.35); background: rgba(238,136,121,.07); }
.boundary-index { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #3a465c; border-radius: 50%; color: #b7c0d0; font-family: var(--mono); font-size: 9px; }
.boundary-node b { display: block; color: white; font-size: 14px; }
.boundary-node small { display: block; margin-top: 4px; color: #8490a5; font-size: 11px; line-height: 1.45; }
.boundary-tag { color: var(--brass); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; text-align: right; }
.is-denied .boundary-tag { color: var(--deny); }
.boundary-arrow { height: 20px; display: grid; place-items: center; color: #59677e; font-size: 12px; }
.boundary-rule { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); color: #8793a8; font-family: var(--mono); font-size: 10px; letter-spacing: .18em; }
.boundary-rule strong { color: var(--seal-bright); font-family: var(--serif); font-size: 30px; font-weight: 500; line-height: 1; }

.brake-signal { padding: 34px 0; border-top: 1px solid rgba(165,63,46,.16); border-bottom: 1px solid rgba(165,63,46,.16); background: linear-gradient(90deg, rgba(165,63,46,.06), rgba(196,164,95,.08)); }
.brake-signal-inner { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 34px; align-items: center; }
.brake-dino { width: 86px; height: 86px; display: grid; place-items: center; border: 1px solid rgba(165,63,46,.16); border-radius: 50%; background: rgba(255,255,255,.45); box-shadow: var(--shadow-soft); font-size: 46px; }
.brake-signal h2 { margin: 0 0 8px; font-size: clamp(38px,4vw,58px); }
.brake-signal p:last-child { margin: 0; color: var(--slate); font-size: 18px; }

.brake-compare-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.brake-compare-card { min-height: 430px; display: flex; flex-direction: column; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.55); }
.brake-compare-card.is-authority { border-color: rgba(165,63,46,.30); background: var(--white); box-shadow: var(--shadow-soft); }
.compare-label { color: var(--muted); font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.brake-compare-card h3 { margin-top: 24px; font-size: clamp(32px,3.7vw,46px); }
.brake-compare-card ul { display: grid; gap: 13px; margin: 10px 0 26px; padding: 0; list-style: none; }
.brake-compare-card li { position: relative; padding-left: 23px; color: var(--slate); font-size: 15px; }
.brake-compare-card li::before { position: absolute; left: 0; color: var(--seal); content: "◆"; font-size: 7px; top: .55em; }
.compare-bottom { margin: auto 0 0; padding-top: 20px; border-top: 1px solid var(--line); color: var(--slate); font-size: 15px; }
.compare-bottom strong { color: var(--ink); }

.brake-demo { background: #080d18; color: white; }
.brake-demo-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 72px; align-items: center; }
.brake-demo .section-header { margin: 0; }
.brake-demo .section-header p { color: #9ba7ba; }
.brake-demo-instructions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.brake-demo-instructions > div { min-height: 170px; padding: 22px; border: 1px solid rgba(255,255,255,.11); border-radius: var(--radius-md); background: rgba(255,255,255,.035); }
.brake-demo-instructions span { width: 36px; height: 36px; display: grid; place-items: center; margin-bottom: 30px; border: 1px solid #3c485e; border-radius: 50%; color: var(--brass); font-family: var(--mono); font-size: 9px; }
.brake-demo-instructions b { display: block; margin-bottom: 6px; color: white; font-size: 15px; }
.brake-demo-instructions small { color: #8591a6; font-size: 11px; line-height: 1.5; }

.brake-proof-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.brake-proof-card { min-height: 220px; display: flex; flex-direction: column; justify-content: space-between; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--white); }
.brake-proof-card.is-zero { border-color: rgba(63,167,118,.28); box-shadow: 0 18px 55px rgba(63,167,118,.08); }
.brake-proof-card strong { font-family: var(--serif); font-size: clamp(44px,4.6vw,66px); font-weight: 500; letter-spacing: -.04em; line-height: .96; }
.brake-proof-card.is-zero strong { color: #237954; }
.brake-proof-card span { max-width: 280px; color: var(--slate); font-size: 13px; line-height: 1.5; }
.brake-proof-note { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 30px; align-items: center; margin-top: 18px; padding: 26px 28px; border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255,255,255,.45); }
.brake-proof-note p { margin: 0; color: var(--slate); font-size: 13px; }
.brake-proof-note strong { color: var(--ink); }

.brake-questions-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 70px; align-items: start; }
.brake-questions-layout .section-header { margin: 0; position: sticky; top: 110px; }
.brake-question-list { display: grid; gap: 12px; }
.brake-question { min-height: 125px; display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 20px; align-items: center; padding: 25px 28px; border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255,255,255,.52); }
.brake-question span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(165,63,46,.22); border-radius: 50%; color: var(--seal); font-family: var(--mono); font-size: 10px; }
.brake-question p { margin: 0; font-family: var(--serif); font-size: clamp(22px,2.4vw,30px); letter-spacing: -.02em; line-height: 1.2; }

.brake-manifesto { overflow: hidden; position: relative; padding: 120px 0; background: var(--ink); color: white; text-align: center; }
.brake-manifesto::before { width: 660px; height: 660px; position: absolute; top: -420px; left: 50%; transform: translateX(-50%); border-radius: 50%; background: rgba(165,63,46,.28); filter: blur(110px); content: ""; }
.brake-manifesto .wrap { position: relative; }
.brake-manifesto h2 { max-width: 980px; margin-inline: auto; font-size: clamp(48px,6.5vw,86px); }
.brake-manifesto p:not(.eyebrow):not(.cta-note) { max-width: 760px; margin: 0 auto; color: #a4aec0; font-size: 18px; }
.brake-manifesto .cta-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.brake-dark-ghost { border-color: rgba(255,255,255,.18); background: transparent; color: white; }
.brake-dark-ghost:hover { background: rgba(255,255,255,.07); }
.brake-manifesto .cta-note { margin-top: 22px; color: #728097; font-family: var(--mono); font-size: 10px; }

@media (max-width: 980px) {
  .brake-hero-grid { grid-template-columns: 1fr; }
  .brake-boundary-card { max-width: 720px; }
  .brake-demo-grid, .brake-questions-layout { grid-template-columns: 1fr; gap: 44px; }
  .brake-questions-layout .section-header { position: static; }
}

@media (max-width: 760px) {
  .brake-hero { min-height: auto; padding: 132px 0 66px; }
  .brake-hero h1 { font-size: clamp(52px,17vw,76px); }
  .brake-hero .hero-topline { align-items: flex-start; }
  .brake-hero .hero-proof { display: none; }
  .brake-boundary-card { padding: 18px; border-radius: 22px; }
  .boundary-node { grid-template-columns: 36px minmax(0,1fr); }
  .boundary-tag { display: none; }
  .brake-signal-inner { grid-template-columns: 1fr; gap: 18px; }
  .brake-dino { width: 72px; height: 72px; font-size: 38px; }
  .brake-compare-grid, .brake-proof-grid, .brake-demo-instructions { grid-template-columns: 1fr; }
  .brake-compare-card { min-height: 360px; padding: 24px; }
  .brake-proof-note { grid-template-columns: 1fr; }
  .brake-question { grid-template-columns: 44px minmax(0,1fr); padding: 20px; }
  .brake-question span { width: 38px; height: 38px; }
  .brake-manifesto { padding: 92px 0; }
}