:root {
  --guide-paper: var(--paper, #f5f3eb);
  --guide-surface: var(--paper-bright, #fbfaf6);
  --guide-ink: var(--ink, #12231f);
  --guide-muted: var(--ink-soft, #4d5d58);
  --guide-dark: var(--forest, #183d34);
  --guide-dark-deep: var(--forest-deep, #0d2923);
  --guide-accent: var(--lime, #c9ef68);
  --guide-blue: var(--blue, #3154d6);
  --guide-line: var(--line, rgba(18, 35, 31, 0.14));
  --guide-sans: var(--sans, "Geist Local", Arial, sans-serif);
  --guide-serif: var(--serif, Georgia, "Times New Roman", serif);
  --guide-mono: var(--mono, "Geist Mono Local", Consolas, monospace);
}

.guide-page { margin: 0; color: var(--guide-ink); background: var(--guide-paper); font-family: var(--guide-sans); line-height: 1.6; }
.guide-page *, .guide-page *::before, .guide-page *::after { box-sizing: border-box; }
.guide-page a { color: inherit; }
.guide-page a:focus-visible { outline: 3px solid var(--guide-blue); outline-offset: 4px; }
.guide-page h1, .guide-page h2 { font-family: var(--guide-serif); font-weight: 400; letter-spacing: -0.045em; text-wrap: balance; }
.guide-page h3, .guide-page p { text-wrap: pretty; }
.guide-shell { width: min(1120px, calc(100vw - 48px)); margin-inline: auto; }

.guide-skip { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 10px 14px; color: white; background: var(--guide-dark); border-radius: 8px; transform: translateY(-160%); }
.guide-skip:focus { transform: translateY(0); }
.guide-header { position: sticky; top: 12px; z-index: 50; width: min(1180px, calc(100vw - 24px)); min-height: 66px; margin: 12px auto 0; padding: 10px 13px 10px 16px; display: flex; align-items: center; gap: 24px; background: color-mix(in srgb, var(--guide-surface) 92%, transparent); border: 1px solid var(--guide-line); border-radius: 20px; backdrop-filter: blur(18px); }
.guide-brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; text-decoration: none; }
.guide-brand img, .guide-brand-mark { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 11px; color: var(--guide-accent); background: var(--guide-dark); font: 800 11px/1 var(--guide-mono); }
.guide-brand-copy { display: grid; line-height: 1.05; }
.guide-brand-copy strong { font-size: 14px; }
.guide-brand-copy small { margin-top: 5px; color: var(--guide-muted); font-size: 10px; }
.guide-nav { margin-left: auto; display: flex; align-items: center; gap: 26px; }
.guide-nav a { min-height: 44px; display: inline-flex; align-items: center; font-size: 12px; font-weight: 680; text-decoration: none; }
.guide-page .guide-button { min-height: 46px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 12px; color: white; background: var(--guide-dark); font-size: 13px; font-weight: 750; line-height: 1; text-decoration: none; }
.guide-page .guide-button-light { color: var(--guide-blue); background: white; }
.guide-page .guide-button-outline { color: var(--guide-ink); background: transparent; border-color: var(--guide-line); }

.guide-hero { padding-block: 105px 85px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); gap: 80px; align-items: end; }
.guide-kicker { margin: 0 0 23px; color: var(--guide-blue); font: 750 10px/1.3 var(--guide-mono); letter-spacing: .14em; text-transform: uppercase; }
.guide-hero h1 { max-width: 830px; margin: 0 0 28px; font-size: clamp(56px, 7vw, 88px); line-height: .94; }
.guide-deck { max-width: 760px; margin: 0; color: var(--guide-muted); font-size: clamp(18px, 2vw, 23px); line-height: 1.45; letter-spacing: -.02em; }
.guide-facts { margin: 0; border-top: 1px solid var(--guide-line); }
.guide-facts div { padding: 14px 0; display: grid; grid-template-columns: 105px 1fr; gap: 18px; border-bottom: 1px solid var(--guide-line); }
.guide-facts dt { color: var(--guide-muted); font: 700 9px/1.5 var(--guide-mono); letter-spacing: .08em; text-transform: uppercase; }
.guide-facts dd { margin: 0; font-size: 12px; font-weight: 650; }

.guide-body { padding-block: 20px 120px; display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 85px; align-items: start; }
.guide-main { min-width: 0; }
.guide-section { padding: 62px 0; border-top: 1px solid var(--guide-line); }
.guide-section:first-child { border-top: 0; padding-top: 0; }
.guide-section h2 { max-width: 760px; margin: 0 0 24px; font-size: clamp(40px, 5vw, 61px); line-height: 1; }
.guide-section h3 { margin: 33px 0 10px; font-size: 20px; line-height: 1.2; }
.guide-section > p, .guide-section li { max-width: 760px; color: var(--guide-muted); font-size: 15px; }
.guide-section strong { color: var(--guide-ink); }
.guide-sidebar { position: sticky; top: 105px; padding: 25px; color: white; background: var(--guide-dark); border-radius: 20px; }
.guide-sidebar p { color: rgba(255,255,255,.68); font-size: 12px; }
.guide-sidebar .guide-kicker { color: var(--guide-accent); }
.guide-sidebar h2 { margin: 0 0 15px; color: white; font-size: 29px; line-height: 1.05; }
.guide-sidebar ul { margin: 20px 0 25px; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.18); }
.guide-sidebar li { padding: 10px 0; color: rgba(255,255,255,.72); border-bottom: 1px solid rgba(255,255,255,.18); font-size: 11px; }

.guide-callout { margin: 30px 0; padding: 22px 24px; border-left: 4px solid var(--guide-blue); color: var(--guide-ink); background: var(--guide-surface); }
.guide-callout p { margin: 0; color: var(--guide-muted); }
.guide-callout > strong { display: block; margin-bottom: 5px; }
.guide-write-line { width: 100%; max-width: 620px; height: 34px; display: block; border-bottom: 1px solid var(--guide-ink); }
.guide-steps, .guide-checklist { margin: 28px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--guide-line); }
.guide-steps li, .guide-checklist li { position: relative; max-width: none; padding: 18px 8px 18px 54px; border-bottom: 1px solid var(--guide-line); }
.guide-steps li::before { content: counter(list-item, decimal-leading-zero); position: absolute; left: 7px; top: 20px; color: var(--guide-blue); font: 750 9px/1 var(--guide-mono); }
.guide-checklist li::before { content: "□"; position: absolute; left: 8px; top: 15px; color: var(--guide-blue); font-size: 22px; }

.guide-grid { margin-top: 30px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.guide-card { padding: 24px; background: var(--guide-surface); border: 1px solid var(--guide-line); border-radius: 15px; }
.guide-card h3 { margin: 0 0 9px; }
.guide-card p { margin: 0; color: var(--guide-muted); font-size: 13px; }
.guide-card .guide-kicker { margin-bottom: 12px; }

.guide-table-wrap { margin: 30px 0; overflow-x: auto; border: 1px solid var(--guide-line); border-radius: 15px; background: var(--guide-surface); }
.guide-table { width: 100%; min-width: 690px; border-collapse: collapse; }
.guide-table th, .guide-table td { padding: 17px 18px; border-bottom: 1px solid var(--guide-line); text-align: left; vertical-align: top; font-size: 12px; }
.guide-table thead th { color: var(--guide-muted); font: 750 9px/1.4 var(--guide-mono); letter-spacing: .07em; text-transform: uppercase; }
.guide-table tbody th { color: var(--guide-ink); font: 720 12px/1.5 var(--guide-sans); text-align: left; }
.guide-table tr:last-child td, .guide-table tr:last-child th { border-bottom: 0; }
.guide-table td:first-child { color: var(--guide-ink); font-weight: 720; }

.guide-score { margin-top: 28px; display: grid; gap: 12px; }
.guide-score article { padding: 22px; display: grid; grid-template-columns: 56px 1fr; gap: 18px; background: var(--guide-surface); border: 1px solid var(--guide-line); border-radius: 15px; }
.guide-score-number { width: 48px; height: 48px; display: grid; place-items: center; color: var(--guide-accent); background: var(--guide-dark); border-radius: 50%; font: 800 12px/1 var(--guide-mono); }
.guide-score h3 { margin: 2px 0 6px; }
.guide-score p { margin: 0; color: var(--guide-muted); font-size: 13px; }

.guide-faq details { border-top: 1px solid var(--guide-line); }
.guide-faq details:last-child { border-bottom: 1px solid var(--guide-line); }
.guide-faq summary { padding: 19px 42px 19px 4px; cursor: pointer; font-weight: 720; }
.guide-faq details p { padding: 0 40px 19px 4px; margin: 0; }
.guide-source-note { margin-top: 28px; color: var(--guide-muted); font-size: 11px; }
.guide-cta { margin-bottom: 90px; padding: 58px; display: grid; grid-template-columns: 1fr auto; gap: 50px; align-items: center; color: white; background: var(--guide-blue); border-radius: 24px; }
.guide-cta h2 { max-width: 760px; margin: 0 0 13px; color: white; font-size: clamp(38px, 5vw, 60px); line-height: 1; }
.guide-cta p { max-width: 670px; margin: 0; color: white; font-size: 13px; }
.guide-footer { padding-block: 34px 55px; display: flex; align-items: center; flex-wrap: wrap; gap: 22px; border-top: 1px solid var(--guide-line); }
.guide-footer nav { margin-left: auto; display: flex; flex-wrap: wrap; gap: 22px; }
.guide-footer a { min-height: 40px; display: inline-flex; align-items: center; font-size: 11px; font-weight: 680; text-decoration: none; }
.guide-footer small { flex-basis: 100%; color: var(--guide-muted); font-size: 9px; }

@media (max-width: 900px) {
  .guide-nav { display: none; }
  .guide-header > .guide-button { margin-left: auto; }
  .guide-hero, .guide-body { grid-template-columns: 1fr; }
  .guide-hero { gap: 48px; }
  .guide-body { gap: 30px; }
  .guide-sidebar { position: static; }
  .guide-cta { grid-template-columns: 1fr; }
  .guide-cta .guide-button { justify-self: start; }
}

@media (max-width: 620px) {
  .guide-shell { width: calc(100vw - 28px); }
  .guide-header { top: 7px; width: calc(100vw - 14px); margin-top: 7px; padding-left: 10px; }
  .guide-brand-copy small { display: none; }
  .guide-header > .guide-button { min-height: 42px; padding-inline: 13px; font-size: 11px; }
  .guide-hero { padding-block: 75px 62px; }
  .guide-hero h1 { font-size: clamp(47px, 14vw, 66px); }
  .guide-deck { font-size: 18px; }
  .guide-body { padding-bottom: 75px; }
  .guide-section { padding-block: 48px; }
  .guide-section h2 { font-size: 42px; }
  .guide-grid { grid-template-columns: 1fr; }
  .guide-score article { grid-template-columns: 44px 1fr; padding: 18px; }
  .guide-score-number { width: 40px; height: 40px; }
  .guide-cta { margin-bottom: 60px; padding: 35px 24px; }
  .guide-cta .guide-button { width: 100%; }
  .guide-footer { display: grid; }
  .guide-footer nav { margin-left: 0; }
}

@media print {
  .guide-header, .guide-sidebar, .guide-cta, .guide-footer { display: none; }
  .guide-shell { width: 100%; }
  .guide-hero, .guide-body { display: block; padding: 20px 0; }
  .guide-section { break-inside: avoid; padding: 22px 0; }
  .guide-table-wrap { overflow: visible; }
}