/* Editorial guides share the studio's type, colour and navigation. */
.guide-page .nav__inner { gap: 1rem; }
.guide-page .nav__inner > .btn { white-space: nowrap; }
.guide-hero { max-width: 940px; padding-block: 3rem 4rem; }
.guide-hero h1 { font-size: clamp(2.5rem, 5.6vw, 5rem); line-height: 1.08; margin-block: 1.25rem 1.5rem; }
.guide-lead { color: var(--muted); max-width: 52ch; font-size: 1.1rem; }
.guide-meta { color: var(--muted); font-size: .8rem; margin-top: 1.5rem; }
.guide-lead strong { color: var(--primary); font-weight: 500; }
.guide-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; list-style: none; padding: 0; margin-top: 1.5rem; }
.guide-summary li { border-top: 1px solid var(--border); padding-top: 1rem; }
.guide-summary strong { display: block; font-weight: 500; margin-bottom: .4rem; }
.guide-summary span { color: var(--muted); }
.guide-index-mobile { display: none; }
.guide-layout { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1.6fr); gap: 5rem; align-items: start; border-top: 1px solid var(--border); }
.guide-index { position: sticky; top: 110px; display: grid; gap: .4rem; padding-top: 2rem; }
.guide-index > .eyebrow { margin-bottom: .8rem; }
.guide-index a { display: flex; align-items: baseline; gap: .75rem; padding-block: .65rem; color: var(--muted); font-size: .85rem; min-height: 44px; }
.guide-index a:hover { color: var(--primary); }
.guide-index a > span { color: var(--primary); font-size: .7rem; }
.guide-section { padding-block: 2.5rem; border-bottom: 1px solid var(--border); scroll-margin-top: 16px; }
.guide-section h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-block: .8rem 1.5rem; }
.guide-content p, .guide-content li, .guide-scenarios dd { color: var(--muted); font-size: 1rem; line-height: 1.85; max-width: 65ch; }
.guide-content p + p { margin-top: 1rem; }
.guide-content a { color: var(--primary); text-decoration: underline; text-underline-offset: 4px; }
.guide-content strong { color: var(--text); font-weight: 500; }
.guide-content .btn { color: var(--bg); text-decoration: none; }
.guide-content ul { padding-left: 1.2rem; margin-block: 1.5rem; }
.guide-content li { padding-left: .3rem; margin-bottom: .75rem; }
.guide-content li::marker { color: var(--primary); }
.guide-callout { border-left: 2px solid var(--primary); background: var(--surface); padding: 1.5rem; margin-block: 1.75rem; }
.guide-callout .guide-price { color: var(--text); margin-block: .75rem; }
.guide-price strong { display: block; color: var(--primary); font: 500 clamp(3rem, 5vw, 4rem)/1.2 'Space Grotesk', sans-serif; letter-spacing: -.05em; }
.guide-callout .text-link { margin-top: 1rem; font-size: .9rem; min-height: 44px; }
.guide-scenarios { margin-block: 1.5rem; }
.guide-scenarios > div { padding-block: 1.25rem; border-top: 1px solid var(--border); }
.guide-scenarios dt { font-weight: 500; margin-bottom: .5rem; }
.guide-scenarios dd { margin: 0; }
.guide-closing { padding-block: 4rem; }
.guide-closing h2 { margin-block: 1rem; }
.guide-closing > p { color: var(--muted); max-width: 55ch; }
.guide-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin-top: 1.75rem; }
.guide-page .footer__bottom > div { flex-wrap: wrap; }
.guide-page .footer__bottom a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 900px) {
  .guide-layout { grid-template-columns: 1fr; gap: 1rem; }
  .guide-index { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1.5rem; }
  .guide-index > .eyebrow { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .guide-hero { padding-block: 2rem 2.5rem; }
  .guide-lead { font-size: 1rem; }
  .guide-page .brand { font-size: 1rem; gap: .5rem; }
  .guide-page .brand img { width: 32px; height: 32px; }
  .guide-page .nav__inner > .btn { padding: .65rem .8rem; font-size: .72rem; }
  .guide-index { display: none; }
  .guide-index-mobile { display: block; padding-block: 1rem; border-bottom: 1px solid var(--border); }
  .guide-index-mobile summary { cursor: pointer; display: flex; justify-content: space-between; align-items: center; min-height: 44px; list-style: none; }
  .guide-index-mobile summary::-webkit-details-marker { display: none; }
  .guide-index-mobile[open] summary > span { transform: rotate(45deg); }
  .guide-index-links { display: grid; margin-top: .5rem; }
  .guide-index-links a { display: flex; align-items: baseline; gap: .75rem; padding-block: .65rem; min-height: 44px; color: var(--muted); font-size: .875rem; }
  .guide-index-links a > span { color: var(--primary); }
  .guide-summary { grid-template-columns: 1fr; gap: .75rem; }
  .guide-summary li { padding-top: .75rem; }
  .guide-summary strong { margin-bottom: .15rem; }
  .guide-section { padding-block: 2rem; }
  .guide-callout { padding: 1.25rem; }
  .guide-actions { flex-direction: column; align-items: stretch; }
  .guide-actions .btn { justify-content: space-between; text-align: left; }
}
@media (max-width: 360px) {
  .guide-page .brand { font-size: .85rem; gap: .35rem; }
  .guide-page .brand img { width: 26px; height: 26px; }
  .guide-page .nav__inner { gap: .5rem; }
}