/* The energy pipeline guide. On screen: a contents rail and a readable column,
   one column on a phone. In print: letter pages in the house style of the
   Fulcrum Energy outreach guide (navy, gold rule, Cormorant headings). */
.guide-wrap { display:grid; grid-template-columns:220px minmax(0, 1fr); gap:28px; max-width:1100px; margin:0 auto; padding:22px 16px 80px; }
.toc { position:sticky; top:calc(var(--header-h) + 12px); align-self:start; font-size:.8rem; max-height:calc(100vh - var(--header-h) - 24px); overflow:auto; }
.toc-title { font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--slate); margin-bottom:8px; }
.toc a { display:block; color:var(--navy); text-decoration:none; padding:5px 8px; border-left:2px solid var(--fog); }
.toc a:hover { border-left-color:var(--gold); background:#fff; }
.guide { background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:36px 44px 48px; line-height:1.55; font-size:.95rem; }
.guide .kicker { font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.guide .kicker::before { content:''; display:inline-block; width:22px; height:2px; background:var(--gold); vertical-align:middle; margin-right:8px; }
.guide h1 { font-size:2.4rem; line-height:1.1; margin:0 0 6px; } .guide h1 em { color:var(--gold); font-style:normal; }
.guide .meta { color:var(--slate); font-size:.82rem; margin-bottom:22px; padding-bottom:18px; border-bottom:1px solid var(--fog); }
.guide h2 { font-size:1.7rem; margin:44px 0 10px; padding-top:18px; border-top:1px solid var(--fog); scroll-margin-top:calc(var(--header-h) + 12px); }
.guide h2:first-of-type { border-top:none; padding-top:0; }
.guide h3 { font-size:1.2rem; margin:24px 0 6px; scroll-margin-top:calc(var(--header-h) + 12px); }
.guide p { margin:0 0 12px; } .guide ul, .guide ol { margin:0 0 12px 22px; } .guide li { margin-bottom:5px; }
.guide .ui { font-weight:700; color:var(--navy); background:#F2F4F8; border:1px solid #E1E6EE; border-radius:4px; padding:0 5px; font-size:.9em; white-space:nowrap; }
.guide .rule { background:#F6F3EC; border-left:3px solid var(--gold); padding:10px 14px; margin:12px 0 16px; border-radius:0 6px 6px 0; }
.guide .rule b:first-child { color:var(--deep-gold); }
.guide .note { background:#E3EAF5; border-radius:6px; padding:10px 14px; margin:12px 0 16px; }
.guide .view-as { font-size:.8rem; color:var(--slate); margin:0 0 18px; } .guide .view-as select { font-size:.8rem; padding:4px 6px; border:1px solid var(--border); border-radius:5px; background:#fff; color:var(--ink); }
.guide .warn { background:#FDE4E1; border-radius:6px; padding:10px 14px; margin:12px 0 16px; color:#7a1d14; }
.guide .steps li { margin-bottom:8px; } .guide .steps li::marker { font-weight:700; color:var(--gold); }
.guide figure { margin:14px 0 20px; } .guide figure img { display:block; max-width:100%; border:1px solid var(--border); border-radius:6px; box-shadow:var(--shadow); min-height:40px; background:#f7f8fa; }
.guide figure img.missing { padding:12px; color:var(--slate); font-size:.8rem; }
.guide figcaption { font-size:.78rem; color:var(--slate); margin-top:6px; }
.guide .pair { display:grid; grid-template-columns:minmax(0, 2fr) minmax(0, 1fr); gap:12px; align-items:start; }
.guide table { width:100%; border-collapse:collapse; font-size:.86rem; margin:8px 0 16px; }
.guide th { text-align:left; background:var(--navy); color:#fff; font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; padding:8px 10px; }
.guide td { padding:8px 10px; border-bottom:1px solid var(--fog); vertical-align:top; } .guide tr:nth-child(even) td { background:#FAFAF7; }
.guide .flow { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:10px 0 16px; }
.guide .flow span { background:#fff; border:1px solid var(--navy); color:var(--navy); border-radius:14px; padding:3px 10px; font-size:.78rem; font-weight:600; white-space:nowrap; }
.guide .flow span.exit { border-color:var(--red); color:var(--red); } .guide .flow span.won { background:var(--navy); color:#fff; }
.guide .flow i { color:var(--gold); font-style:normal; font-weight:700; }
.guide .roles td:first-child { font-weight:700; white-space:nowrap; }
.guide .glossary dt { font-weight:700; margin-top:8px; } .guide .glossary dd { margin:0 0 4px 0; }
.guide .page-break { break-before:page; }
.guide .tpl { background:#F7F8FA; border:1px solid var(--border); border-radius:6px; padding:12px 14px; font-size:.86rem; white-space:pre-wrap; margin:8px 0 14px; }
.print-btn { position:fixed; right:16px; bottom:18px; z-index:50; background:#fff; }
@media (max-width:900px) {
  .guide-wrap { grid-template-columns:1fr; padding:14px 12px 90px; gap:12px; }
  .toc { position:static; max-height:none; background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:12px; }
  .toc a { display:inline-block; border-left:none; padding:4px 8px; }
  .guide { padding:22px 18px 32px; font-size:.93rem; } .guide h1 { font-size:1.9rem; } .guide h2 { font-size:1.4rem; }
  .guide .pair { grid-template-columns:1fr; }
  .print-btn { display:none; }
}
@media print {
  @page { size: letter; margin: 0.7in 0.75in; }
  body { background:#fff; font-size:10.5pt; }
  #header, #hnav, .toc, .print-btn, .toast, .menu-btn { display:none !important; }
  .guide-wrap { display:block; padding:0; max-width:none; }
  .guide { border:none; box-shadow:none; padding:0; font-size:10.5pt; line-height:1.45; }
  .guide h2 { break-after:avoid; margin-top:28px; } .guide h3 { break-after:avoid; }
  .guide .view-as { display:none; }
  .guide figure, .guide .rule, .guide .note, .guide table, .guide .tpl { break-inside:avoid; }
  .guide figure img { box-shadow:none; max-height:4.6in; width:auto; max-width:100%; }
  .guide a { color:inherit; text-decoration:none; }
  .guide .page-break { break-before:page; }
}