/* Editorial guide layout; keeps the existing shared design tokens intact. */
.guide-page { padding-block-start: 2.5rem; }
.guide-hero { max-width: 54rem; margin-block-end: 2rem; }
.guide-hero h1 { font-size: clamp(2rem, 4.3vw, 3.7rem); line-height: 1.12; margin-block: .55rem 1.2rem; text-wrap: balance; }
.guide-kicker { color: var(--accent-text); font-size: .85rem; letter-spacing: .06em; }
.guide-lede { font-size: 1.2rem; line-height: 1.55; color: var(--text-secondary); max-width: 48rem; }
.guide-dateline { font-size: .88rem; color: var(--text-secondary); line-height: 1.6; margin-block-start: 1rem; }
.guide-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--border-subtle); margin-block: 2rem; }
.guide-stat { display: flex; flex-direction: column; gap: .4rem; padding: 1.4rem 1.25rem; text-decoration: none; }
.guide-stat + .guide-stat { border-inline-start: 1px solid var(--border-subtle); }
.guide-stat strong { font-size: 2.2rem; line-height: 1; color: var(--text-primary); }
.guide-stat span { color: var(--text-secondary); }
.guide-stat:hover { background: var(--bg-surface); }
.guide-controls { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 1rem; align-items: end; }
.guide-controls label { display: flex; flex-direction: column; gap: .45rem; color: var(--text-secondary); font-size: .85rem; }
.guide-controls input, .guide-controls select { width: 100%; min-width: 0; box-sizing: border-box; background: var(--bg-surface); color: var(--text-primary); border: 1px solid var(--border-interactive); border-radius: .25rem; padding: .8rem; font: inherit; font-size: 1rem; }
.guide-controls input:focus, .guide-controls select:focus, .guide-stat:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 3px; }
.guide-group { scroll-margin-top: 1.5rem; }
.guide-group__heading { display: flex; gap: 1rem; align-items: baseline; border-block-end: 1px solid var(--border-subtle); padding-block-end: .7rem; margin-block-end: .7rem; }
.guide-group__heading h2 { margin: 0; font-size: 1.6rem; }
.guide-group__heading span { color: var(--text-secondary); }
.guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-block-start: 1.25rem; }
.guide-entry { display: flex; flex-direction: column; gap: .75rem; padding: 1.4rem; background: var(--bg-surface); border: 1px solid var(--border-subtle); min-width: 0; }
.guide-entry__meta { display: flex; align-items: baseline; justify-content: space-between; gap: .65rem; flex-wrap: wrap; font-size: .78rem; color: var(--text-secondary); }
.guide-entry h3 { font-size: 1.2rem; line-height: 1.35; margin: 0; }
.guide-entry h3 a { color: var(--text-primary); text-decoration: none; }
.guide-entry h3 a:hover { text-decoration: underline; }
.guide-entry p { color: var(--text-secondary); font-size: .95rem; line-height: 1.6; margin: 0; }
.guide-entry__read { font-size: .85rem; margin-block-start: auto; padding-block-start: .35rem; }
.guide-back { display: inline-block; margin-block-end: 1.5rem; }
.guide-about { max-width: 48rem; line-height: 1.7; }
.value-definition { border-block-start: 1px solid var(--border-subtle); padding-block: 1.4rem; }
.value-definition h2 { font-size: 1.25rem; margin-block: 0 .6rem; }
.value-definition p { color: var(--text-secondary); line-height: 1.7; margin: 0; }
.guide-entry[hidden], .guide-group[hidden], #guide-empty[hidden] { display: none; }
@media (max-width: 700px) {
  .guide-grid { grid-template-columns: 1fr; }
  .guide-controls { grid-template-columns: 1fr 1fr; }
  .guide-controls label:first-child { grid-column: 1 / -1; }
  .guide-stat { padding: 1rem .65rem; }
  .guide-stat span { font-size: .85rem; }
  .guide-stat strong { font-size: 1.8rem; }
  .guide-entry { padding: 1.1rem; }
}
