/* Original visual system for the full test page, informed by Lawful Service's
   charcoal / white / light-neutral rhythm. No third-party template code. */
:root {
  --ink: #0d1018;
  --muted: #60636a;
  --blue: #0d1018;
  --line: #e1e2e3;
  --paper: #f7f7f7;
  --accent: #c8954b;
  --white: #fff;
}

body { background: #fff; color: var(--ink); }
a:hover { color: #8b612d; }
.wrap { max-width: 1320px; }

/* Header and cinematic opening */
.topbar {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  height: 82px;
  border-bottom: 1px solid rgba(255,255,255,.2);
  background: rgba(13,16,24,.48);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}
.brand,.brand small,.topbar nav a { color: #fff; }
.brandmark { filter: brightness(0) invert(1); }
.topbar nav .nav-cta { color: var(--ink); border-color: #fff; background: #fff; }
.topbar nav .nav-cta:hover { color: #fff; background: transparent; }
.hero { min-height: 760px; background: var(--ink); }
.hero-shade { background: linear-gradient(90deg,rgba(13,16,24,.91),rgba(13,16,24,.75) 28%,rgba(13,16,24,.3) 55%,rgba(13,16,24,.05) 80%); }
.hero-inner { padding-top: 125px; padding-bottom: 55px; }
.hero-copy { width: min(580px, 44vw); }
.hero .eyebrow { color: #fff; }
.hero .rule { border-color: var(--accent); }
.hero h1 { font-size: clamp(54px,5.1vw,78px); }
.hero h1 em { color: #e0b77a; }
.hero .lead { color: #e1e1e2; }
.hero .caption { color: #d5d5d8; }
.hero .button.primary { background: #fff; color: var(--ink); }
.hero .button.primary:hover { background: #e6e6e6; color: var(--ink); }

/* Introductory framework: quiet, precise, horizontal. */
.hero-framework { padding-top: 42px; padding-bottom: 72px; }
.hero-card { border: 1px solid var(--line); box-shadow: none; background: #fff; }
.hero-card .card-head { color: var(--ink); }
.hero-card .step { border-color: var(--line); }
.hero-card .step b { color: #8b612d; }
.hero-card .step strong { color: var(--ink); }
.hero-card .step span,.hero-card .card-foot { color: var(--muted); }

/* Advice: light canvas, white content cards, restrained gold index. */
.band { background: var(--paper); padding: 112px 0 105px; }
.eyebrow,.section-heading .eyebrow,.brief-intro .eyebrow,.verification .eyebrow { color: #8b612d; }
.section-heading { max-width: 760px; }
.section-heading h2,.split h2,.brief-intro h2,.verification h2 { letter-spacing: -.045em; }
.section-heading>p:last-child { max-width: 620px; }
.grid-four { gap: 14px; }
.grid-four article {
  border: 1px solid #e8e8e8;
  border-top: 0;
  min-height: 320px;
  padding: 32px;
  box-shadow: 0 10px 26px rgba(13,16,24,.025);
}
.grid-four article::before { content: ""; display: block; width: 42px; border-top: 2px solid var(--accent); margin-bottom: 18px; }
.grid-four .number { color: #8b612d; }
.grid-four h3 { margin-top: 30px; }
.grid-four p { color: var(--muted); }
.source-line { color: #6f7278; }

/* Two audiences: editorial rows rather than repeated blue boxes. */
.split { background: #fff; padding-top: 125px; padding-bottom: 130px; gap: 10%; }
.split>div:first-child { padding-top: 4px; }
.audience-list article { border-top: 1px solid #bfc1c4; padding: 28px 0 36px; }
.audience-list article:last-child { border-bottom: 1px solid #bfc1c4; }
.audience-list article span { color: #8b612d; }
.audience-list h3 { font-family: Georgia,serif; font-weight: 400; font-size: 29px; letter-spacing: -.03em; }
.audience-list p { font-size: 15px; line-height: 1.75; max-width: 510px; }
.audience-list a,.verify-links a { color: var(--ink); }
.audience-list a:hover,.verify-links a:hover { color: #8b612d; }

/* Conversion block is the second dark anchor in the page. */
.brief-section { background: var(--ink); padding: 125px 0; }
.brief-layout { gap: 9%; }
.brief-intro { color: #fff; }
.brief-intro .eyebrow { color: #d8ad70; }
.brief-intro>p:not(.eyebrow) { color: #c4c6ca; font-size: 17px; line-height: 1.8; }
.note { background: #1b202a; border-left-color: var(--accent); }
.note strong { color: #fff; }
.note p { color: #c4c6ca; }
.brief-form { background: #fff; border: 0; box-shadow: 0 24px 65px rgba(0,0,0,.18); }
.form-head { color: var(--ink); }
.field input,.field select,.field textarea { border-color: #c9cbd0; }
.field input:focus,.field select:focus,.field textarea:focus { outline-color: #8b612d; }
.brief-form .button.primary { background: var(--ink); color: #fff; }
.brief-form .button.primary:hover { background: #2a303d; }
.result { background: var(--paper); }

/* Verification, close, footer. */
.verification { max-width: none; background: var(--paper); padding-top: 115px; padding-bottom: 120px; padding-left: max(48px,calc((100vw - 1224px)/2)); padding-right: max(48px,calc((100vw - 1224px)/2)); }
.verification>div:last-child>p:first-child { color: #52555b; }
.verification .fine { border-top: 1px solid #d7d7d7; padding-top: 17px; }
.closing { background: #171612; padding: 105px 0 110px; }
.closing .eyebrow { color: #d8ad70; }
.closing h2 { max-width: 900px; }
.closing h2 em { color: #d8ad70; }
.closing .button.light { color: var(--ink); }
.closing p:last-child { color: #cbc9c3; }
.footer { background: #fff; padding-top: 42px; padding-bottom: 42px; border-top: 1px solid var(--line); }

@media (max-width: 950px) {
  .verification { padding-left: 28px; padding-right: 28px; }
  .grid-four article { padding: 25px; }
}

@media (max-width: 700px) {
  .topbar { height: 72px; background: rgba(13,16,24,.72); }
  .topbar nav .nav-cta { color: var(--ink); }
  .hero { min-height: 825px; }
  .hero-photo { height: 310px; }
  .hero-shade { background: linear-gradient(0deg,#0d1018 8%,rgba(13,16,24,.96) 39%,rgba(13,16,24,.04) 69%); }
  .hero-inner { padding-top: 308px; padding-bottom: 52px; }
  .hero-copy { width: 100%; }
  .hero h1 { font-size: clamp(42px,9vw,58px); }
  .hero-framework { padding-top: 22px; padding-bottom: 52px; }
  .hero-card { padding: 22px; }
  .band,.brief-section { padding: 78px 0; }
  .grid-four article { min-height: 270px; }
  .split { padding-top: 84px; padding-bottom: 90px; }
  .audience-list { margin-top: 45px; }
  .brief-intro>p:not(.eyebrow) { font-size: 15px; }
  .brief-form { margin-top: 38px; }
  .verification { padding: 82px 20px 86px; }
  .closing { padding: 85px 0; }
  .footer { padding-top: 33px; padding-bottom: 35px; }
}

@media (max-width: 420px) {
  .grid-four { grid-template-columns: 1fr; }
  .grid-four article { min-height: 0; }
}
