.guide-main { padding: clamp(2rem, 5vw, 4rem) 0 5rem; }
.guide-container { max-width: 1120px; }
.breadcrumbs { margin: 0 0 2rem; font-size: .9rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 0; padding: 0; }
.breadcrumbs li + li::before { content: "/"; color: var(--muted); margin-right: .5rem; }
.breadcrumbs [aria-current="page"] { color: var(--muted); }
.guide-heading { max-width: none; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.guide-heading--visual { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr); gap:clamp(2rem,6vw,5rem); align-items:center; }
.guide-heading__copy,.guide-heading__visual { min-width:0; }
.guide-heading h1 { margin: .35rem 0 1rem; }
.guide-heading .lede { max-width: 68ch; color: var(--muted); font-size: clamp(1.08rem, 2vw, 1.25rem); }
.guide-container > section + section { margin-top: 3rem; }
.guide-container h2 { margin-bottom: .9rem; }
.guide-prose { max-width: 720px; margin: 0; line-height: 1.75; }
.guide-prose section + section, .guide-prose .related-guides { margin-top: clamp(3rem, 5vw, 4rem); }
.guide-prose section > h2 { margin-bottom: 1.2rem; line-height: 1.2; }
.guide-prose p, .guide-prose li { max-width: 68ch; }
.guide-prose li + li { margin-top: .7rem; }
.guide-callout { margin-block: 1.4rem; padding: 1.25rem 1.5rem; border: 1px solid var(--border); border-left: 4px solid var(--blue); border-radius: 12px; background: var(--surface-2); }
.guide-callout ul { margin: 0; padding-left: 1.2rem; }
.guide-decision-list { list-style: none; margin: 1.5rem 0; padding: 0; border-block: 1px solid var(--border); }
.guide-decision-list li, .guide-prose .guide-decision-list li + li { position: relative; margin: 0; padding: .9rem .4rem .9rem 1.5rem; }
.guide-decision-list li + li { border-top: 1px solid var(--border); }
.guide-decision-list li::before { content: ""; position: absolute; top: 1.6rem; left: .3rem; width: .5rem; height: .5rem; border-radius: 50%; background: var(--accent); }
.guide-steps { list-style:none; counter-reset:guide-step; padding:0; margin:1.5rem 0; }
.guide-steps li { position:relative; counter-increment:guide-step; min-height:2.75rem; margin:0; padding:0 0 1.35rem 3.35rem; }
.guide-steps li::before { content:counter(guide-step); position:absolute; left:0; top:-.1rem; display:grid; place-items:center; width:2rem; height:2rem; border:1px solid rgb(85 230 165 / 45%); border-radius:50%; color:var(--accent); background:var(--surface); font-weight:800; font-size:.88rem; }
.guide-steps li:not(:last-child)::after { content:""; position:absolute; left:.96rem; top:2rem; bottom:.1rem; border-left:1px solid var(--border); }
.guide-cta { margin: 3rem 0; padding: clamp(1.4rem, 4vw, 2rem); border: 1px solid rgb(85 230 165 / 38%); border-radius: 16px; background: var(--surface-2); box-shadow: inset 3px 0 var(--accent); }
.guide-cta h2 { margin: .4rem 0 .75rem; }
.guide-cta p:not(.eyebrow) { max-width: 62ch; color: var(--muted); }
.guide-cta .button { margin-top: .5rem; min-height: 48px; }
.related-guides { padding-top: 1.5rem; border-top: 1px solid var(--border); }
.guide-card { display: block; min-width:0; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--border); border-radius: 16px; background: var(--surface-2); color: var(--text); text-decoration: none; transition: border-color 150ms ease, transform 150ms ease; }
.guide-card:hover { border-color: var(--accent); transform: translateY(-2px); text-decoration: none; }
.guide-card:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.guide-card h3 { margin: .45rem 0; font-size: 1.3rem; }
.guide-card p { max-width: 68ch; color: var(--muted); }
.guide-card__icon { display:grid; place-items:center; width:2.8rem; height:2.8rem; margin-bottom:1.1rem; border:1px solid rgb(85 230 165 / 28%); border-radius:12px; color:var(--accent); background:rgb(85 230 165 / 6%); font-size:1.1rem; }
.guide-card__topic { color: var(--accent); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.guide-card__link { color: var(--accent); font-weight: 700; }
.guide-home-link { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.guide-home-link p { max-width: 65ch; color: var(--muted); }
.guide-comparison { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.guide-comparison article { min-width: 0; padding: 1.25rem; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); }
.guide-comparison__visual { display:grid; place-items:center; min-height:4.6rem; margin:-.1rem 0 .9rem; color:var(--accent); font-size:2.1rem; }
.guide-comparison__visual--text { font-weight:800; letter-spacing:-.08em; }
.guide-comparison__visual--scale { width:4.2rem; min-height:2.8rem; margin:.8rem auto 1.7rem; border:1px solid var(--blue); border-radius:7px; box-shadow:8px 6px 0 -2px var(--surface-2),8px 6px 0 -1px var(--blue); font-size:1rem; }
.guide-comparison__visual--target { font-size:1.6rem; }
.guide-comparison h3 { margin: .35rem 0 .85rem; font-size: 1.15rem; }
.guide-comparison p { margin: 0; }
.guide-comparison p + p { margin-top: .85rem; }
.guide-comparison strong { color: var(--text); }
.metric-reference { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; margin:1.25rem 0; }
.metric-reference > div { display:grid; grid-template-columns:2rem minmax(0,1fr); gap:.7rem; padding:.9rem; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
.metric-reference dt { display:contents; font-weight:750; }
.metric-reference dt i { grid-row:span 2; color:var(--accent); text-align:center; padding-top:.2rem; }
.metric-reference dd { grid-column:2; margin:-.5rem 0 0; color:var(--muted); font-size:.92rem; }
@media (max-width: 760px) {
  .guide-comparison { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .guide-main { padding-top: 1.5rem; }
  .breadcrumbs { margin-bottom: 1.5rem; }
  .guide-prose section + section, .guide-prose .related-guides, .guide-cta, .guide-home-link { margin-top: 2.25rem; }
  .guide-callout { padding: 1rem 1.1rem; }
  .guide-cta .button { width: 100%; }
  .metric-reference > div { grid-template-columns: 1fr; gap: .25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .guide-card { transition: none; }
}

.related-guides ul { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:.8rem; list-style:none; margin:0; padding:0; }
.guide-prose .related-guides li { margin:0; }
.related-guides a { display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; height:100%; min-height:4.5rem; padding:1rem 1.1rem; border:1px solid var(--border); border-radius:12px; color:var(--text); background:var(--surface); font-size:1.06rem; font-weight:650; line-height:1.4; overflow-wrap:anywhere; text-decoration:none; transition:border-color 150ms ease, background 150ms ease, transform 150ms ease; }
.related-guides a::after { content:"→"; flex:none; color:var(--accent); }
.related-guides a:hover,.related-guides a:focus-visible { border-color:var(--accent); background:var(--surface-2); transform:translateY(-1px); }
.sizing-illustration { margin:0; }
.sizing-illustration__pair { display:grid; gap:.7rem; }
.sizing-illustration__case { display:grid; grid-template-columns:minmax(5.5rem,.42fr) minmax(0,1fr); align-items:center; gap:.7rem; min-width:0; padding:.65rem; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
.sizing-illustration__label { color:var(--accent-soft); font-size:.8rem; font-weight:750; line-height:1.35; }
.sizing-illustration__window { min-width:0; padding:.55rem; border:1px solid #3a4a44; border-radius:7px; background:var(--bg); }
.sizing-illustration__bar { margin-bottom:.55rem; padding-bottom:.3rem; border-bottom:1px solid var(--border); color:var(--muted); font-size:.65rem; }
.sizing-illustration__text { display:block; color:var(--text); font-size:1.15rem; font-weight:700; line-height:1.2; }
.sizing-illustration__control { display:inline-block; margin-top:.6rem; padding:.2rem .5rem; border:1px solid var(--border); border-radius:5px; color:var(--muted); font-size:.67rem; line-height:1.2; }
.sizing-illustration__case--scale .sizing-illustration__bar { font-size:.76rem; }
.sizing-illustration__case--scale .sizing-illustration__control { padding:.35rem .7rem; font-size:.8rem; }
.sizing-illustration figcaption, .metric-map figcaption { margin-top:.7rem; color:var(--muted); font-size:.84rem; line-height:1.5; }
.metric-map { margin:1.5rem 0; }
.metric-map__window { overflow:hidden; border:1px solid #3a4a44; border-radius:12px; background:var(--surface); }
.metric-map__title, .metric-map__menu, .metric-map__status { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem .9rem; padding:.7rem 1rem; }
.metric-map__title { background:var(--surface-2); font-weight:700; }
.metric-map__menu { border-block:1px solid var(--border); color:var(--muted); }
.metric-map__body { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; min-height:9rem; padding:1rem; }
.metric-map__icons, .metric-map__dialog { display:flex; flex-direction:column; align-items:flex-start; gap:.45rem; min-width:0; }
.metric-map__icons span:last-child { font-size:1.12rem; }
.metric-map__dialog { padding:.7rem; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); }
.metric-map__dialog span:last-child { align-self:flex-end; padding:.2rem .65rem; border:1px solid var(--border); border-radius:5px; font-size:.8rem; }
.metric-map__status { border-top:1px solid var(--border); color:var(--muted); font-size:.88rem; }
.metric-map__tag { color:var(--accent-soft); font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.guide-specimen { max-width:430px; margin:0 auto; padding:.7rem; border:1px solid #35443f; border-radius:14px; background:linear-gradient(145deg,#17201d,#101714); box-shadow:0 18px 45px rgb(0 0 0 / 24%); }
.guide-specimen__bar { display:flex; align-items:center; gap:.45rem; padding:.25rem .2rem .75rem; color:var(--muted); font-size:.78rem; }
.guide-specimen__bar i,.guide-specimen__row i { color:var(--accent); }
.guide-specimen__rows { display:grid; gap:.4rem; padding:.6rem; border-radius:8px; background:var(--bg); }
.guide-specimen__row { display:flex; align-items:center; gap:.7rem; padding:.5rem .6rem; border-radius:6px; color:var(--muted); font-size:.82rem; }
.guide-specimen__row--focus { color:var(--text); outline:1px solid rgb(85 230 165 / 50%); background:rgb(85 230 165 / 6%); }
.guide-specimen__caption { margin:.75rem .25rem .15rem; color:var(--accent-soft); font-size:.78rem; }
.guide-before-after { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin:1.25rem 0; }
.guide-before-after article { padding:1rem; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
.guide-before-after h3 { margin:0 0 .8rem; color:var(--muted); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; }
.guide-before-after__sample { display:flex; align-items:center; gap:.75rem; }
.guide-before-after__sample i { flex:none; width:1.6rem; color:var(--accent); font-size:1.5rem; text-align:center; }
.guide-before-after__sample span { line-height:1.25; }
.guide-before-after__sample--after span { font-size:1.2rem; }
.guide-caption { margin:-.4rem 0 1.25rem; color:var(--muted); font-size:.83rem; }
.guide-hub-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
.guide-hub-grid .guide-card { display:flex; flex-direction:column; }
.guide-hub-grid .guide-card p { line-height:1.55; }
.guide-hub-grid .guide-card__link { margin-top:auto; padding-top:1rem; }
.guide-diagnostic { max-width:720px; margin:0 auto; padding:1.1rem 1.2rem .2rem; border:1px solid var(--border); border-radius:14px; background:linear-gradient(135deg,var(--surface),var(--bg)); }
.guide-diagnostic .guide-steps li { padding-bottom:1rem; }
.comparison-table-wrap { max-width:100%; overflow-x:auto; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.comparison-table-wrap:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.comparison-table { width:100%; min-width:660px; border-collapse:collapse; text-align:left; }
.comparison-table th,.comparison-table td { padding:.9rem 1rem; vertical-align:top; border-bottom:1px solid var(--border); }
.comparison-table thead th { color:var(--accent-soft); background:var(--surface-2); font-size:.92rem; }
.comparison-table tbody th { width:19%; color:var(--text); font-size:.9rem; }
.comparison-table td { color:var(--muted); font-size:.92rem; }
.comparison-table tr:last-child th,.comparison-table tr:last-child td { border-bottom:0; }
.choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:3rem; }
.choice-card { min-width:0; padding:clamp(1.1rem,3vw,1.6rem); border:1px solid var(--border); border-radius:14px; background:var(--surface-2); }
.choice-card h2 { margin:.3rem 0 .7rem; }
.choice-card p,.choice-card li { color:var(--muted); }
.choice-card ul { padding-left:1.2rem; }
.choice-card li + li { margin-top:.4rem; }
.choice-card .button { min-height:44px; margin-top:.4rem; }
.source-list li + li { margin-top:.55rem; }
@media (max-width:760px) {
 .guide-heading--visual { grid-template-columns:1fr; gap:1.6rem; }
 .guide-heading__visual { max-width:480px; width:100%; }
 .guide-comparison { grid-template-columns:1fr; }
 .guide-hub-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .choice-grid { grid-template-columns:1fr; }
}
@media (max-width:560px) {
 .sizing-illustration__case { grid-template-columns:1fr; }
 .metric-map__body { grid-template-columns:1fr; }
 .metric-reference { grid-template-columns:1fr; }
 .guide-before-after { grid-template-columns:1fr; }
 .guide-diagnostic { padding-inline:.75rem; }
 .guide-steps li { padding-left:2.8rem; }
 .guide-hub-grid { grid-template-columns:1fr; }
 .comparison-table { min-width:590px; }
 .comparison-table th,.comparison-table td { padding:.75rem; }
}
@media (prefers-reduced-motion: reduce) {
 .related-guides a { transition:none; }
 .related-guides a:hover,.related-guides a:focus-visible { transform:none; }
}