:root { --max: 1280px; }

/* Desktop chrome: kill two-row utils band (phone smell on 1440) */
@media (min-width: 801px) {
  body[data-sept] .site-header {
    grid-template-columns: auto 1fr auto auto;
    grid-template-areas: "wordmark nav utils cta";
    align-items: center;
  }
  body[data-sept] .site-header .header-utils {
    grid-area: utils;
    grid-column: auto;
    justify-content: flex-end;
  }
  body[data-sept] .site-header .main-nav { grid-area: nav; }
  body[data-sept] .site-header .header-cta { grid-area: cta; }
  body[data-sept] .site-header .qa-wordmark,
  body[data-sept] .site-header .wordmark { grid-area: wordmark; }
}

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--ink);
  text-decoration: none;
  padding: 12px 20px;
  border: 1px solid var(--ink);
  border-radius: 0;
  font-size: 15px;
  line-height: 24px;
  font-weight: 500;
}
.btn-secondary:hover { background: var(--fog); }

.hero-clear { padding-top: 72px; padding-bottom: 56px; }
.hero-clear .display { max-width: 16ch; }
.hero-clear .lede { max-width: 62ch; font-size: 20px; line-height: 34px; }
.trust-line { margin: 24px 0 0; color: var(--grey); font-size: 14px; line-height: 24px; }

.three-step-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 32px;
}
.quick-step { border-top: 1px solid var(--ink); padding-top: 16px; }
.quick-step p { margin-bottom: 0; color: var(--grey); }

.sheet-teaser-clear { border-top: 1px solid var(--rule); }
.sheet-preview-dark,
.sheet-page .sheet-frame {
  background: var(--ink);
  color: var(--paper);
  border-color: var(--ink);
}
.sheet-preview-dark .sheet-meta,
.sheet-page .sheet-frame .sheet-meta {
  border-color: var(--paper);
  color: var(--paper);
}
.sheet-preview-dark .gap-box,
.sheet-page .sheet-frame .gap-box {
  border-color: var(--fog);
  color: var(--paper);
}
.sheet-preview-dark .sheet-bound,
.sheet-page .sheet-frame .sheet-bound { color: var(--fog); }
.sheet-preview-dark .blue-rule,
.sheet-page .sheet-frame .blue-rule { height: 5px; background: var(--evidence); }
.sheet-page .sheet-frame .wm-dot { background: var(--paper); }

.compact-scope,
.independence-strip { border-top: 1px solid var(--rule); }
.compact-scope p,
.independence-strip p { max-width: 72ch; }

.footer-grid-compact { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
.footer-grid-compact .footer-col p { margin: 0; color: var(--grey); font-size: 15px; line-height: 26px; }

.method-intro { max-width: 68ch; }
.method-step strong { display: block; margin-bottom: 4px; }

.story-note { color: var(--grey); font-size: 15px; line-height: 26px; }

/* Header utility links measured 20px tall at 390px, under the 24px tap minimum. */
.header-utils a { display: inline-flex; align-items: center; min-height: 24px; }

@media (max-width: 1100px) {
  .three-step-grid, .footer-grid-compact { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 800px) {
  .hero-clear { padding-top: 48px; }
  .hero-clear .lede { font-size: 18px; line-height: 31px; }
  .three-step-grid, .footer-grid-compact { grid-template-columns: 1fr; }
  .hero-actions { gap: 12px; }
  .hero-actions .btn { width: 100%; }
}