/* Feature guides extend the existing paper, coral and sage landing palette. */
.skip-link { position:absolute; left:20px; top:-80px; z-index:5; background:var(--ink); color:var(--paper); padding:12px 16px; }
.skip-link:focus { top:12px; }
.guide-nav { display:flex; align-items:center; gap:28px; }
.guide-nav > a:first-child { text-decoration:none; font-weight:700; display:inline-flex; align-items:center; min-height:44px; padding:0 4px; }
.guide-main { max-width:1180px; margin:auto; padding:0 28px; overflow:visible; }
.guide-hero { padding:76px 0 52px; }
.guide-label { font-size:12px; line-height:1.6; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.guide-label a { text-decoration:none; }
.guide-hero h1 { font-size:clamp(42px,6.5vw,78px); line-height:1.04; }
.guide-hero em { color:var(--coral-text); font-style:normal; }
.guide-lede { max-width:720px; font-size:22px; line-height:1.55; color:var(--muted); margin:28px 0 20px; }
.guide-product { font-size:13px; color:var(--muted); line-height:1.5; }
.guide-layout { display:grid; grid-template-columns:250px minmax(0,700px); gap:72px; padding:40px 0 72px; border-top:1px solid var(--line); }
.guide-layout:has(> .guide-article:first-child) { grid-template-columns:minmax(0,1fr); }
.guide-contents nav { position:sticky; top:28px; }
.guide-contents ol { list-style:none; padding:0; margin:16px 0 0; }
.guide-contents li { margin:0; font-size:15px; line-height:1.4; }
.guide-contents a { text-decoration:none; display:flex; align-items:center; min-height:44px; padding:4px 0; }
.guide-contents a:hover { color:var(--coral-text); }
.guide-article { min-width:0; }
.guide-article section { scroll-margin-top:32px; margin-bottom:48px; }
.guide-article h2,.guide-note h2 { font-size:30px; line-height:1.15; letter-spacing:-.025em; margin:0 0 20px; }
.guide-article p,.guide-article li,.guide-note p { font-size:18px; line-height:1.75; color:var(--muted); }
.guide-article strong { color:var(--ink); font-weight:700; }
.guide-article ol { padding-left:24px; }
.guide-article li { padding-left:8px; margin-bottom:12px; }
.guide-article li::marker { color:var(--coral-text); font-weight:800; }
.guide-example { background:var(--card); border-left:4px solid var(--coral-text); padding:24px; margin:28px 0; }
.guide-example p { margin-bottom:0; }
.guide-next { border-top:1px solid var(--line); padding-top:28px; }
.guide-next a { color:var(--ink); font-weight:800; display:inline-flex; align-items:center; min-height:44px; }
.guide-related { border-top:1px solid var(--line); padding:48px 0 72px; }
.guide-related h2 { font-size:36px; letter-spacing:-.03em; margin:8px 0 28px; }
.guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.guide-related .guide-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.guide-card { display:flex; flex-direction:column; align-items:flex-start; padding:30px; min-height:280px; background:var(--card); border:1px solid var(--line); border-radius:20px; text-decoration:none; }
.guide-card:hover { border-color:var(--coral-text); }
.guide-card h2,.guide-card h3 { font-size:28px; line-height:1.12; letter-spacing:-.025em; margin:22px 0 12px; }
.guide-card p { font-size:17px; line-height:1.5; margin:0 0 28px; color:var(--muted); }
.guide-read { font-weight:800; margin-top:auto; }
.guide-read span { color:var(--coral-text); margin-left:8px; }
.guide-index { padding-bottom:56px; }
.guide-note { background:var(--sage); border-radius:24px; padding:36px 40px; max-width:900px; }
.guide-note p { color:var(--ink); max-width:64ch; }
.guide-existing { margin:32px 0 72px; line-height:1.6; color:var(--muted); }
@media(max-width:1050px) {
  /* A contents rail at tablet widths turns the article into a narrow column.
     Keep the reading flow full-width until there is room for both columns. */
  .guide-layout { display:block; }
  .guide-layout:has(> .guide-article:first-child) { grid-template-columns:minmax(0,1fr); }
  .guide-contents { margin-bottom:40px; padding-bottom:16px; border-bottom:1px solid var(--line); }
  .guide-contents nav { position:static; }
  .guide-grid { grid-template-columns:1fr; }
  .guide-card { min-height:220px; }
}
@media(max-width:620px) {
  .guide-main { padding:0 20px; }
  .guide-nav { gap:18px; font-size:14px; }
  .guide-hero { padding:48px 0 32px; }
  .guide-lede { font-size:19px; }
  .guide-layout { padding:28px 0 36px; }
  .guide-article h2 { font-size:27px; }
  .guide-article section { margin-bottom:32px; }
  .guide-article p,.guide-article li { line-height:1.55; }
  .guide-related .guide-grid { grid-template-columns:1fr; }
  .guide-card { padding:26px; }
  .guide-note { padding:28px; }
}

.guide-download { padding:0 0 64px; }
.guide-download h2 { font-size:30px; letter-spacing:-.025em; }
.guide-download p { font-size:14px; color:var(--muted); line-height:1.5; }
