.example-spec-page-shell { background: #0B0C0E; }
.example-spec-header { grid-template-columns: 330px 1fr auto; }
.example-spec-page h1,
.example-spec-page h2 { margin: 0; font-weight: 370; letter-spacing: -.045em; line-height: .98; text-transform: uppercase; }
.example-spec-page h1 { max-width: 760px; font-size: clamp(48px,6.1vw,86px); }
.example-spec-page h2 { font-size: clamp(38px,4.4vw,64px); }
.example-spec-intro { padding: clamp(76px,8vw,118px) 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.example-spec-intro__grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(290px,.8fr); gap: clamp(48px,8vw,110px); align-items: center; }
.example-spec-lead { max-width: 650px; margin: 28px 0; color: #9AA1AA; font-size: 16px; line-height: 1.72; }
.example-spec-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.example-spec-summary { display: grid; gap: 1px; margin: 0; padding: 1px; border-top: 3px solid #A66A3F; list-style: none; background: rgba(255,255,255,.14); box-shadow: 0 24px 48px rgba(0,0,0,.24); }
.example-spec-summary li { padding: 18px 20px 18px 48px; color: #B8BDC4; background: #171819; font-size: 13px; line-height: 1.55; }
.example-spec-summary li::before { content: "✓"; float: left; margin-left: -27px; color: #E1A954; font-weight: 900; }
.example-spec-document { padding: clamp(82px,9vw,126px) 0; border-top: 1px solid rgba(166,106,63,.24); background: #171819; }
.example-spec-document__grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(48px,8vw,100px); align-items: center; }
.example-spec-document__copy p:last-child { max-width: 430px; margin: 28px 0 0; color: #9AA1AA; line-height: 1.72; }
.example-spec-document .spec-sheet { transform: none; }
.example-spec-accuracy { padding: clamp(76px,8vw,112px) 0; color: #252A31; background: #D7DADF; }
.example-spec-accuracy__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px,8vw,110px); align-items: start; }
.example-spec-accuracy .eyebrow { color: #555C65; }
.example-spec-accuracy__grid > div:last-child { padding-left: 28px; border-left: 2px solid #A66A3F; }
.example-spec-accuracy__grid > div:last-child p { color: #555C65; line-height: 1.72; }
.example-spec-accuracy__grid > div:last-child p:last-child { margin-bottom: 0; font-weight: 700; }

@media (max-width: 1100px) {
  .example-spec-header { grid-template-columns: 1fr auto; }
}

@media (max-width: 900px) {
  .example-spec-intro__grid,
  .example-spec-document__grid,
  .example-spec-accuracy__grid { grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 560px) {
  .example-spec-page h1 { font-size: clamp(42px,13vw,58px); }
  .example-spec-page h2 { font-size: 38px; }
  .example-spec-actions { align-items: stretch; flex-direction: column; }
  .example-spec-document .spec-sheet { overflow: visible; }
  .example-spec-document .spec-sheet table { min-width: 0; table-layout: fixed; font-size: 7px; }
  .example-spec-document .spec-sheet th,
  .example-spec-document .spec-sheet td { padding: 9px 3px; overflow-wrap: anywhere; }
  .example-spec-document .spec-sheet th:nth-child(1) { width: 22%; }
  .example-spec-document .spec-sheet th:nth-child(2) { width: 48%; }
  .example-spec-document .spec-sheet th:nth-child(3) { width: 30%; }
  .example-spec-document .spec-sheet td:nth-child(2) { align-items: flex-start; gap: 4px; }
  .example-spec-document .spec-sheet i { width: 8px; height: 8px; margin-top: 1px; }
  .example-spec-document .spec-sheet footer { grid-template-columns: 1fr; }
  .example-spec-document .spec-sheet footer small { grid-column: auto; }
  .example-spec-accuracy__grid > div:last-child { padding-left: 18px; }
}
