/* Blue Valley Blinds — guide.html (the lead ladder, Rung 1-3)
   Uses ONLY the site's existing :root tokens from style.css (olive/ivory/rust).
   No new colour custom properties, so check_palettes.py stays clean. */

/* ---------- guide hero: split, echoing the home hero ---------- */
.g-hero{display:grid;grid-template-columns:1.02fr .98fr;min-height:76vh;border-bottom:1px solid var(--line)}
.g-hero-text{background:var(--paper);display:flex;flex-direction:column;justify-content:center;padding:150px 5vw 70px}
.g-hero-text .crumb{font-size:.8rem;color:var(--ink-soft);margin-bottom:16px}
.g-hero-text .crumb a{color:var(--rust)}
.g-hero-text .crumb a:hover{text-decoration:underline}
.g-hero-text h1{font-size:clamp(2.5rem,4.8vw,4rem);max-width:14ch;margin:6px 0 10px}
.g-kicker{font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,1.9vw,1.5rem);color:var(--rust);margin-bottom:20px}
.g-hero-text .lead{font-size:1.08rem;color:var(--ink-soft);max-width:52ch;margin-bottom:26px}
.g-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
.g-meta span{font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;font-weight:600;color:var(--ink-soft);background:var(--ivory);border:1px solid var(--line);padding:8px 13px}
.g-hero-ctas{display:flex;flex-wrap:wrap;gap:14px}
.g-hero-media{position:relative;overflow:hidden;min-height:340px}
.g-hero-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.g-hero-media .scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(35,39,23,.4),rgba(35,39,23,0) 34%),linear-gradient(0deg,rgba(35,39,23,.5),transparent 32%)}
.g-hero-media .tag{position:absolute;left:22px;bottom:20px;color:var(--ivory);z-index:2;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(35,39,23,.55);backdrop-filter:blur(6px);padding:9px 15px}
@media(max-width:980px){
  .g-hero{grid-template-columns:1fr;min-height:auto}
  .g-hero-media{min-height:46vh;order:-1}
  .g-hero-text{padding:120px 7vw 54px}
}

/* ---------- table of contents ---------- */
.g-toc{background:var(--olive-deep);color:var(--ivory);position:sticky;top:0;z-index:40}
.g-toc-inner{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;padding:15px 0}
.g-toc .eyebrow{color:var(--rust-soft);margin:0 12px 0 0}
.g-toc a{font-size:.82rem;color:rgba(250,246,234,.72);white-space:nowrap;transition:color .2s;padding:4px 0}
.g-toc a:hover,.g-toc a:focus-visible{color:var(--ivory)}
@media(max-width:760px){.g-toc{position:static}.g-toc-inner{gap:4px 16px}}

/* ---------- prose ---------- */
.g-prose{max-width:70ch}
.g-prose p{color:var(--ink-soft);margin-bottom:18px;font-size:1.03rem}
.g-prose .lead-para{font-family:var(--serif);font-size:clamp(1.3rem,2.1vw,1.7rem);line-height:1.35;color:var(--ink);max-width:26ch;margin-bottom:24px}
.g-prose strong{color:var(--ink);font-weight:600}
.g-prose sup a{color:var(--rust);text-decoration:none;font-weight:600;font-size:.7em;padding:0 1px}
.g-prose sup a:hover{text-decoration:underline}
.section-ink{background:var(--olive-deep);color:var(--ivory)}
.section-ink .eyebrow{color:var(--rust-soft)}
.section-ink .section-head h2,.section-ink .g-prose .lead-para{color:var(--ivory)}
.section-ink .section-head p{color:rgba(250,246,234,.72)}
.section-ink .g-prose p{color:rgba(250,246,234,.82)}
.section-ink .g-prose strong{color:var(--ivory)}
.section-ink .g-prose sup a{color:var(--rust-soft)}
.section-ink .rule{background:var(--rust-soft)}

/* ---------- sun-arc signature diagram (draws itself) ---------- */
.sunarc{margin:32px 0 8px;max-width:560px}
.sunarc svg{width:100%;height:auto}
.arc-faint{stroke:rgba(250,246,234,.24);fill:none;stroke-width:1}
.arc-line{stroke:var(--rust-soft);stroke-width:2.4;fill:none;stroke-dasharray:340;stroke-dashoffset:340;transition:stroke-dashoffset 1.7s cubic-bezier(.4,0,.2,1)}
.sunarc.is-drawn .arc-line{stroke-dashoffset:0}
.arc-sun{fill:var(--rust-soft);opacity:0;transition:opacity .6s ease .9s}
.sunarc.is-drawn .arc-sun{opacity:1}
.arc-label{fill:rgba(250,246,234,.7);font-family:var(--sans);font-size:12px;font-weight:500}
@media(prefers-reduced-motion:reduce){.arc-line{stroke-dashoffset:0;transition:none}.arc-sun{opacity:1;transition:none}}

/* ---------- elevation grid ---------- */
.elev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px}
.elev-card{background:var(--ivory);padding:30px 28px}
.elev-card .compass{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.elev-card .compass svg{width:30px;height:30px;color:var(--rust);flex:none}
.elev-card .compass b{font-family:var(--serif);font-size:1.12rem;font-weight:500;color:var(--ink);line-height:1.2}
.elev-card p{font-size:.94rem;color:var(--ink-soft);margin-bottom:14px}
.elev-card .verdict{font-size:.9rem;color:var(--ink);border-left:2px solid var(--rust);padding-left:14px}
.elev-card .verdict em{font-style:italic;color:var(--rust);font-weight:500}
@media(max-width:720px){.elev-grid{grid-template-columns:1fr}}

/* ---------- product recommendations ---------- */
.rec-list{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line)}
.rec{background:var(--ivory);display:grid;grid-template-columns:1fr auto;gap:24px;padding:30px 28px;align-items:start}
.rec-tag{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--rust);margin-bottom:8px}
.rec h3{font-size:1.28rem;margin-bottom:10px}
.rec p{font-size:.96rem;color:var(--ink-soft);margin-bottom:12px;max-width:64ch}
.rec p:last-child{margin-bottom:0}
.rec .tradeoff{font-size:.9rem;background:var(--paper);border-left:2px solid var(--rust-soft);padding:12px 16px}
.rec .tradeoff b{color:var(--ink);font-weight:600}
.rec-side{display:flex;align-items:flex-start}
.rec-add{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--rust);background:transparent;color:var(--rust);
  padding:11px 16px;font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}
.rec-add svg{width:15px;height:15px}
.rec-add:hover{background:var(--rust);color:var(--ivory)}
.rec-add.is-added{background:var(--olive);border-color:var(--olive);color:var(--ivory);cursor:default}
.rec-brief{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.rec-brief .rec{grid-template-columns:1fr;gap:12px}
.rec-brief h3{font-size:1.08rem}
.rec-brief .rec-side{margin-top:2px}
@media(max-width:720px){.rec{grid-template-columns:1fr}.rec-brief{grid-template-columns:1fr}.rec-side{margin-top:4px}}

/* ---------- captioned figures ---------- */
.g-figure{margin:34px 0 0;position:relative;overflow:hidden;border:1px solid var(--line)}
.g-figure img{width:100%;height:auto;display:block}
.g-figure figcaption{background:var(--paper);color:var(--ink-soft);font-size:.86rem;padding:14px 18px}
.g-figure figcaption b{color:var(--ink);font-weight:600}
.g-figure-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px}
.g-figure-grid .g-figure{margin:0}
@media(max-width:760px){.g-figure-grid{grid-template-columns:1fr}}

/* ---------- what we'd check on site ---------- */
.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 40px;margin-top:8px}
.check-item{display:flex;gap:16px}
.check-item .num{font-family:var(--serif);font-style:italic;font-size:1.9rem;color:var(--rust-soft);flex:none;line-height:1}
.check-item h3{font-size:1.06rem;margin-bottom:6px;color:var(--ivory)}
.check-item p{font-size:.92rem;color:rgba(250,246,234,.78);margin:0}
@media(max-width:720px){.check-grid{grid-template-columns:1fr}}

/* ---------- ladder: forms + ballpark ---------- */
.ladder-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:56px;align-items:start}
.ladder-side .promise{display:flex;flex-direction:column;gap:14px;margin:22px 0 20px}
.promise-item{display:flex;gap:11px;align-items:flex-start;font-size:.95rem;color:var(--ink-soft)}
.promise-item svg{width:22px;height:22px;color:var(--rust);flex:none;margin-top:1px}
.section-ink .promise-item{color:rgba(250,246,234,.85)}
.section-ink .promise-item svg{color:var(--rust-soft)}
.capacity-note{font-size:.92rem;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:16px;margin-top:4px}
.section-ink .capacity-note{color:rgba(250,246,234,.75);border-top-color:rgba(250,246,234,.18)}
.carry-hint{font-size:.9rem;color:var(--ink-soft);margin-top:14px}
.section-ink .carry-hint{color:rgba(250,246,234,.7)}

.form-card{background:var(--ivory);border:1px solid var(--line);padding:34px;box-shadow:0 28px 60px -42px rgba(43,48,25,.4)}
.form-card .legend{display:block;font-size:.76rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px}
.interest-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.interest-grid label{display:flex;align-items:flex-start;gap:9px;font-size:.86rem;color:var(--ink);cursor:pointer;padding:2px 0;
  text-transform:none;letter-spacing:normal;font-weight:400}
.interest-grid input{width:auto;min-width:0;padding:0;margin:2px 0 0;border:0;background:none;box-shadow:none;
  accent-color:var(--rust);flex:none}
@media(max-width:520px){.interest-grid{grid-template-columns:1fr}}
.carry-note{font-size:.84rem;color:var(--rust);background:var(--paper);border:1px dashed var(--rust-soft);padding:10px 13px;margin-top:12px}
.carry-note strong{font-weight:600}
.popia-note{font-size:.78rem;color:var(--ink-soft);margin-top:14px;line-height:1.55}

/* ballpark — collapsed, quieter than the measure */
.ballpark{margin:6px 0 4px;border:1px solid var(--line);background:var(--paper)}
.ballpark>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:16px 18px;font-size:.94rem;font-weight:600;color:var(--ink)}
.ballpark>summary::-webkit-details-marker{display:none}
.ballpark>summary .chev{width:16px;height:16px;color:var(--rust);transition:transform .3s ease;flex:none}
.ballpark[open]>summary .chev{transform:rotate(180deg)}
.bp-inner{padding:6px 18px 20px}
.bp-print-head{display:none}
.bp-pairing{font-size:.9rem;color:var(--ink-soft);margin-bottom:16px}
.bp-pairing strong{color:var(--ink);font-weight:600}
.bp-scroll{overflow-x:auto}
.bp-table{width:100%;border-collapse:collapse;font-size:.86rem;min-width:560px}
.bp-table th{text-align:left;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;padding:0 8px 8px;border-bottom:1px solid var(--line)}
.bp-table td{padding:7px 8px 7px 0;vertical-align:top}
.bp-table td[data-lbl] input,.bp-table td[data-lbl] select{width:100%;padding:9px 10px;border:1.5px solid var(--line);background:var(--ivory);font:inherit;font-size:.85rem}
.bp-table td[data-lbl] input:focus,.bp-table td[data-lbl] select:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px rgba(168,85,42,.14)}
.bp-rm{width:34px;text-align:center}
.bp-remove{border:none;background:transparent;color:var(--ink-soft);font-size:1.3rem;line-height:1;cursor:pointer;padding:6px 8px;transition:color .2s}
.bp-remove:hover{color:var(--rust)}
.bp-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}
.bp-btn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line);background:var(--ivory);color:var(--ink);
  padding:10px 15px;font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s}
.bp-btn svg{width:15px;height:15px;color:var(--rust)}
.bp-btn:hover{border-color:var(--rust);color:var(--rust)}
.bp-count{font-size:.85rem;color:var(--ink-soft);margin-top:12px}
.bp-foot{font-size:.78rem;color:var(--ink-soft);margin-top:8px;line-height:1.5}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* success panel */
.form-success{display:none}
.form-success.show{display:block;background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--rust);padding:26px 28px;margin-top:6px}
.form-success h3{font-size:1.3rem;margin-bottom:8px}
.form-success p{color:var(--ink-soft);font-size:.96rem;margin-bottom:10px}
.form-success p:last-child{margin-bottom:0}
.form-success a{color:var(--rust);font-weight:600;text-decoration:underline}
.is-hidden{display:none}

/* ---------- sources ---------- */
.sources ol{margin:0 0 20px 0;padding-left:22px;display:flex;flex-direction:column;gap:12px}
.sources li{font-size:.88rem;color:var(--ink-soft);line-height:1.55;max-width:88ch}
.sources a{color:var(--rust);text-decoration:underline;word-break:break-word}
.sources .note{font-size:.85rem;color:var(--ink-soft);max-width:88ch;border-top:1px solid var(--line);padding-top:18px}

/* ---------- guide close CTA reuse ---------- */
.g-close{background:var(--ink);color:var(--ivory);text-align:center;overflow:hidden}
.g-close .cta-glow span:nth-child(1){background:rgba(107,117,72,.5)}
.g-close .cta-glow span:nth-child(2){background:rgba(168,85,42,.35)}
.g-close .eyebrow{color:var(--rust-soft)}
.g-close h2{color:var(--ivory);font-size:clamp(2rem,4vw,3rem);max-width:20ch;margin:14px auto 16px}
.g-close p{color:rgba(250,246,234,.72);max-width:52ch;margin:0 auto 34px}
.g-close-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- print: the ballpark becomes a clean paper list ---------- */
@media print{
  .site-nav,.g-toc,.chat-launcher,.chat-panel,footer,.g-hero-media,.g-close,
  .marquee,.rec-add,.bp-actions,.g-hero-ctas,.g-meta,.reveal-in{display:none!important}
  body.bp-printing *{visibility:hidden}
  body.bp-printing #ballpark,body.bp-printing #ballpark *{visibility:visible}
  body.bp-printing #ballpark{position:absolute;left:0;top:0;width:100%;background:#fff;color:#000}
  body.bp-printing .ballpark>summary{display:none}
  body.bp-printing .bp-print-head{display:block;margin-bottom:14px}
  body.bp-printing .bp-print-head h2{font-size:1.3rem;margin-bottom:6px}
  body.bp-printing .bp-pairing,body.bp-printing .bp-count,body.bp-printing .bp-foot{display:none}
  body.bp-printing .bp-table{min-width:0}
  body.bp-printing .bp-table td[data-lbl] input,
  body.bp-printing .bp-table td[data-lbl] select{border:1px solid #999;background:#fff}
  body.bp-printing .bp-rm,body.bp-printing .bp-remove{display:none}
}
