/*
CHANGE LOG
File: static/css/recruiting-proposal.css
Purpose: Page-only styles for https://prohrhq.com/recruiting-proposal, a literal copy of ChatGPT's three-page visual
         blueprint (mh/chatgpt-to-claude notes/2026-10-31-2010-managed-recruiting-visual-blueprint.pdf): navy chapter
         bars, tinted rows, numbered step tiles, the advertising-flow panel, the four-term list, a dark summary band,
         a schematic board and one big call-to-action bar. Site tokens only (navy, green, alt surface, rule).
How it works: every rule is scoped under .rp-page, so nothing else on the site changes. The request form keeps its
         own .fc-* styles from prohrhq_public.css.
Version History:
  2026-11-03 - Page width follows the site standard (--maxw-content, 85% of screen up to 1400px; paragraphs held to
               --maxw-prose) instead of a fixed 820px; the warm band stays inside the column (Michael).
  2026-11-03 - .rp-proof warm full-width band (box-shadow bleed, no sideways scroll); quotes italic, gold rule, gold mark.
  2026-11-03 - .rp-quotes / .rp-quote: two client quotes side by side under the review card, stacked on phones.
  2026-11-03 - .rp-review: WifiTalents review card (score left, quote right, stacks on phones); box is .ph-card.
  2026-11-01 - .rp-w white text for the chevron arrows.
  2026-11-01 - v7.0 page: figure images; removed the sample-board and ChatGPT-drawing rules (no longer on the page).
  2026-11-01 - SVG text styles live here (the regression check refuses <style> and style= in templates).
  2026-11-01 - Removed rules the v6.0 page no longer uses (steps list, chips, flow panel, path, band, note).
  2026-11-01 - v6.0 page: hero picture, figures, wide/phone SVG switch (.rp-svg), print shows the wide layouts.
  2026-11-01 - v5.0 page: three-part division of work, numbered path to launch (.rp-path); "Your decision" badge style removed.
  2026-11-01 - Board cards hold sample driver text; the board is one link to the recruiting board tour.
  2026-10-31 - .rp-facts for the per-carrier facts table.
  2026-10-31 - Created (Michael: copy the blueprint literally, no reinterpretation).
*/
.rp-page{ max-width:var(--maxw-content,min(85vw,1400px)); margin:0 auto 3rem; padding:0 1rem; font-family:var(--font-sans); color:var(--color-text,#2b2f33); }
.rp-page .rp-chapter{ margin:0 0 2.75rem; }
.rp-page .rp-bar{ background:var(--color-navy-deep,#14213d); color:#fff; font-size:.85rem; font-weight:700;
  letter-spacing:.02em; padding:.7rem 1rem; border-radius:var(--radius,6px) var(--radius,6px) 0 0; }
.rp-page h1, .rp-page .rp-h{ font-family:var(--font-sans); font-size:clamp(1.6rem,4vw,2.1rem); line-height:1.15;
  color:var(--color-navy-deep,#14213d); margin:1.1rem 0 .9rem; padding-bottom:.9rem; border-bottom:1px solid var(--color-rule,#d9dee8); }
.rp-page h3{ font-family:var(--font-sans); font-size:1.2rem; color:var(--color-navy-deep,#14213d); margin:1.8rem 0 .7rem; }
.rp-page p{ font-size:1.02rem; line-height:1.55; margin:0 0 .4rem; max-width:var(--maxw-prose,900px); }
.rp-page .rp-small{ font-size:.88rem; color:var(--color-text-mute,#4a5872); }
.rp-hero img{ display:block; width:100%; height:auto; margin:0; }
.rp-fig{ margin:1.2rem 0 .6rem; }
.rp-fig figcaption{ margin:.35rem 0 0; }
.rp-fig img{ display:block; width:100%; height:auto; border:1px solid var(--color-rule,#d9dee8); }
.rp-svg{ display:block; width:100%; height:auto; }
.rp-svg--tall{ display:none; }
@media (max-width:640px){ .rp-svg--wide{ display:none; } .rp-svg--tall{ display:block; } }
@media print{ .rp-svg--tall{ display:none !important; } .rp-svg--wide{ display:block !important; } }
.rp-try{ margin:.3rem 0 0; font-weight:700; }
.rp-try a{ color:var(--color-navy-deep,#14213d); }
.rp-cta{ margin:1.6rem 0 .5rem; }
.rp-cta > summary{ list-style:none; cursor:pointer; background:var(--color-green,#3F6657); color:#fff; font-weight:700;
  font-size:1.15rem; letter-spacing:.04em; text-transform:uppercase; padding:1.05rem 1.2rem; }
.rp-cta > summary::-webkit-details-marker{ display:none; }
.rp-cta > summary:focus-visible{ outline:3px solid var(--color-navy-deep,#14213d); outline-offset:2px; }
.rp-cta[open] > summary{ margin-bottom:1rem; }
.rp-cta .rp-call{ margin:.9rem 0 0; }
.rp-facts{ width:100%; margin:.4rem 0 0; }
.rp-more{ margin:2rem 0 0; border-top:1px solid var(--color-rule,#d9dee8); padding-top:.8rem; }
.rp-more > summary{ cursor:pointer; font-weight:700; color:var(--color-navy-deep,#14213d); }
/* SVG text styles. The regression check allows no style block or style attribute in a template, so the
   drawings use classes from here. ChatGPT's two drawings keep their own rules, scoped by the drawing's id. */
.rp-svg .rp-t{font-family:Arial,sans-serif;fill:#14213d}
.rp-svg .rp-title{font-weight:bold;font-size:29px}
.rp-svg .rp-head{font-weight:bold;font-size:22px}
.rp-svg .rp-sub{font-size:17px}
.rp-svg .rpg-card{fill:#f1f6f7;stroke:#cddde0;stroke-width:2}
.rp-svg .rp-s15{font-size:15px}
.rp-svg .rp-s20{font-size:20px}
.rp-svg .rp-s24{font-size:24px}
.rp-svg .rp-s26{font-size:26px}
.rp-svg .rp-s30{font-size:30px}
.rp-svg text.rp-num-w{fill:#fff;font-weight:bold}
.rp-svg text.rp-w{fill:#fff}
.rp-page .rp-review{ display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; align-items:center; margin:1.2rem 0 .6rem; }
.rp-page .rp-review-score{ flex:0 0 auto; text-align:center; padding-right:1.4rem; border-right:1px solid var(--color-rule,#d9dee8); }
.rp-page .rp-review-num{ font-size:2.2rem; font-weight:700; line-height:1; color:var(--color-navy-deep,#14213d); }
.rp-page .rp-review-of{ font-size:1rem; color:var(--color-text-mute,#4a5872); margin-left:.15rem; }
.rp-page .rp-review-rank{ display:block; margin-top:.3rem; font-size:.8rem; font-weight:700; color:var(--color-green,#3F6657); }
.rp-page .rp-review-body{ flex:1 1 300px; min-width:0; }
.rp-page .rp-review-src{ font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--color-text-mute,#4a5872); margin:0 0 .3rem; }
.rp-page .rp-review-quote{ margin:0 0 .35rem; padding:0; border:0; }
.rp-page .rp-review-quote p{ font-family:var(--font-serif); font-size:1.15rem; line-height:1.4; color:var(--color-text,#2b2f33); margin:0; }
@media (max-width:520px){ .rp-page .rp-review-score{ border-right:0; padding-right:0; text-align:left; } }
.rp-page .rp-quotes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; margin:1rem 0 .6rem; }
.rp-page .rp-quote{ margin:0; }
.rp-page .rp-quote .rp-review-quote p{ font-size:1.05rem; }
.rp-page .rp-quote figcaption{ margin:.4rem 0 0; }
.rp-page .rp-proof{ background:var(--color-bg-warm,#faf7f1); border-radius:var(--radius,6px);
  padding:1.2rem 1.25rem 1.25rem; margin:1.4rem 0 1.6rem; }
.rp-page .rp-proof-label{ font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--color-green,#3F6657); margin:0 0 .2rem; }
.rp-page .rp-proof .rp-review{ margin-top:.6rem; }
.rp-page .rp-proof .rp-quotes{ margin-bottom:0; }
.rp-page .rp-quote{ position:relative; border-left:3px solid var(--color-gold,#b8922a); padding-right:2.6rem; }
.rp-page .rp-quote::before{ content:"\201C"; position:absolute; top:-.15rem; right:.7rem; font-family:var(--font-serif);
  font-size:4rem; line-height:1; color:var(--color-gold,#b8922a); opacity:.35; }
.rp-page .rp-quote .rp-review-quote p{ font-style:italic; }
