/* ============================================================
   home.css — Paper Alibi homepage sections.
   Load AFTER paper-alibi.css. Uses the shared theme tokens
   (--coral, --gold, --ink, --paper-soft, --cream, --green, --muted).
   All classes are prefixed .hp- to avoid collisions with the
   planner styles.
   ============================================================ */

/* ---- Hero additions (sits inside the existing .hero-wrap) ---- */

/* ---- Homepage hero motion (CSS only, no JS needed) ---- */
@media (prefers-reduced-motion: no-preference){
  .hero-copy{animation:hpRise .9s cubic-bezier(.22,1,.36,1) both}
  .hero-board{animation:hpRise .9s cubic-bezier(.22,1,.36,1) .14s both}
  /* Idle drift uses the translate property so each prop keeps its own rotation */
  .desk-props img{animation:hpDrift 8s ease-in-out infinite alternate}
  .desk-props img:nth-child(2n){animation-duration:10s;animation-delay:1.1s}
  .desk-props img:nth-child(3n){animation-duration:12s;animation-delay:.5s}
}
@keyframes hpRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes hpDrift{from{translate:0 0}to{translate:0 9px}}
.folder-stack{transition:transform .3s ease,filter .3s ease}
.hero-board:hover .folder-stack{transform:translateY(-6px);filter:drop-shadow(0 22px 26px rgba(0,0,0,.35))}

.hp-badge{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#0d2238;background:var(--gold);padding:6px 12px;border-radius:20px;margin-bottom:20px}
.hp-badge .dot{width:7px;height:7px;border-radius:50%;background:#0d2238}
.hp-hero-sub{font-size:clamp(17px,2.1vw,21px);color:#d9d2c4;margin:20px 0 0;max-width:56ch}
.hp-hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:30px}
.hp-hero-actions .secondary{color:var(--cream);font-weight:700;font-size:15px;padding:12px 6px;border-bottom:1px solid rgba(255,248,237,.4);text-decoration:none}
.hp-hero-actions .secondary:hover{border-color:var(--coral);color:var(--cream)}
.hp-legal-mini{font-size:12.5px;color:#7f899a;margin:22px 0 0;max-width:60ch}

/* ---- Section scaffold on the dark desk ---- */
.hp-section{padding:56px 0 0}
.hp-section-head{max-width:640px}
.hp-section-head h2{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:clamp(28px,3.6vw,38px);line-height:1.1;letter-spacing:-.01em;margin:0;color:var(--cream)}
.hp-section-head p{font-size:16px;color:#d9d2c4;margin:12px 0 0}

/* ---- Coverage matrix ---- */
.hp-coverage{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,380px));gap:18px;margin-top:28px}
.hp-cov-card{background:var(--paper-soft);border:1px solid #e4d8bf;border-radius:16px;padding:22px 22px 18px;box-shadow:var(--soft-shadow)}
.hp-cov-card.soon{background:#f3ecda;border-color:#ddceac;opacity:.9}
.hp-cov-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hp-cov-head h3{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:22px;color:var(--ink);margin:0}
.hp-tag{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:20px}
.hp-tag.live{background:#dcebdf;color:#2f6a44}
.hp-tag.soon{background:#eadfbf;color:#8a6d24}
.hp-issues{margin-top:16px;display:flex;flex-direction:column;gap:9px}
.hp-issue{display:flex;align-items:center;justify-content:space-between;gap:10px;text-decoration:none;background:#fffdf6;border:1px solid #e4d8bf;border-radius:11px;padding:12px 14px;transition:transform .15s ease,border-color .15s ease}
a.hp-issue:hover{border-color:var(--coral);transform:translateY(-1px)}
.hp-issue.soon{background:#efe7d2;border-color:#ddceac}
.hp-issue .nm{display:block;font-weight:700;font-size:14.5px;color:var(--ink)}
.hp-issue .bl{display:block;font-size:12.5px;color:#6b6248;line-height:1.4;margin-top:2px}
.hp-issue .go{flex:none;font-size:11px;font-weight:800}
.hp-issue .go.live{color:var(--coral)}
.hp-issue .go.soon{color:#a2977a}
.hp-note{font-size:13px;color:#7f899a;margin:18px 0 0}
.hp-note a{color:#8bb4ea;font-weight:700}

/* ---- How it works ---- */
.hp-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:26px}
.hp-step{background:var(--paper-soft);border:1px solid #e4d8bf;border-radius:16px;padding:24px 22px;box-shadow:var(--soft-shadow)}
.hp-step .n{font-family:Georgia,serif;font-size:38px;line-height:1;color:#cabd9e}
.hp-step b{display:block;font-size:17px;color:var(--ink);margin:12px 0 6px}
.hp-step p{font-size:14px;color:#4a4735;line-height:1.55;margin:0}

/* ---- Honesty / UPL block ---- */
.hp-honest{background:linear-gradient(160deg,#12233a,#0c1725);border:1px solid rgba(255,248,237,.12);border-radius:18px;padding:34px clamp(22px,4vw,44px);margin-top:26px}
.hp-honest-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:start}
.hp-honest .eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.hp-honest h2{font-family:Georgia,serif;font-weight:700;font-size:clamp(26px,3.2vw,34px);line-height:1.15;margin:14px 0 0;color:var(--cream)}
.hp-honest > .hp-honest-grid > div > p{font-size:16px;color:#d9d2c4;margin:16px 0 0;max-width:60ch}
.hp-checks{display:flex;flex-direction:column;gap:12px}
.hp-check{display:flex;gap:12px;align-items:flex-start;background:rgba(255,248,237,.05);border:1px solid rgba(255,248,237,.12);border-radius:12px;padding:14px 16px}
.hp-check .mk{flex:none;color:#7fd6a2;font-weight:800;font-size:15px}
.hp-check b{display:block;font-size:14.5px;color:var(--cream)}
.hp-check span{display:block;font-size:13px;color:#9fb0c4;line-height:1.5;margin-top:2px}

/* ---- Rich footer ---- */
.hp-footer{margin-top:52px;padding:34px 0 46px;border-top:1px solid rgba(255,248,237,.12)}
.hp-foot-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px}
.hp-foot-brand .brand{margin-bottom:0}
.hp-foot-brand p{font-size:13px;color:#7f899a;margin:14px 0 0;max-width:34ch}
.hp-foot-col h4{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#9fb0c4;margin:0 0 14px}
.hp-foot-col a{display:block;font-size:14px;color:#d9d2c4;font-weight:600;text-decoration:none;margin-bottom:9px}
.hp-foot-col a:hover{color:var(--cream)}
.hp-foot-bottom{display:flex;flex-wrap:wrap;gap:14px 26px;justify-content:space-between;align-items:center;margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,248,237,.09);font-size:12.5px;color:#7f899a}
.hp-foot-bottom .links{display:flex;gap:18px}
.hp-foot-bottom a{color:#9fb0c4;text-decoration:none}
.hp-foot-bottom a:hover{color:var(--cream)}

/* ---- Content pages (About, Legal, state hubs) ---- */
.hp-crumb{font-size:13px;color:#9fb0c4;margin:0 0 12px}
.hp-crumb a{color:#8bb4ea;text-decoration:none;font-weight:600}
.hp-crumb a:hover{color:#b9d3f4}
.hp-page-head{padding-top:40px}
.hp-page-head h1{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:clamp(34px,4.4vw,48px);line-height:1.06;letter-spacing:-.01em;color:var(--cream);margin:0}
.hp-page-head .sub{font-size:17px;color:#d9d2c4;margin:14px 0 0;max-width:62ch}
.hp-doc{background:var(--paper-soft);border:1px solid #e4d8bf;border-radius:16px;box-shadow:var(--soft-shadow);padding:clamp(24px,4vw,48px);max-width:820px;margin:26px 0 0}
.hp-doc > *:first-child{margin-top:0}
.hp-doc h2{font-family:Georgia,'Times New Roman',serif;color:var(--ink);font-size:23px;margin:32px 0 10px}
.hp-doc h3{font-family:Georgia,'Times New Roman',serif;color:var(--ink);font-size:18px;margin:22px 0 6px}
.hp-doc p{font-size:16px;line-height:1.65;color:#4a4735;margin:0 0 14px}
.hp-doc .lede{font-size:18px;color:#3a3a2c}
.hp-doc ul,.hp-doc ol{margin:0 0 16px;padding-left:22px}
.hp-doc li{font-size:15.5px;line-height:1.6;color:#4a4735;margin-bottom:8px}
.hp-doc a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.hp-doc a:hover{color:#1e4f93}
/* Buttons inside .hp-doc must keep their own colors, not the body-link blue above */
.hp-doc a.button{color:#fff;text-decoration:none;font-weight:900}
.hp-doc a.button:hover{color:#fff}
.hp-doc a.button.gold,.hp-doc a.button.gold:hover{color:#281c05}
/* Secondary button: readable outline style instead of an unstyled solid-blue box */
.button.secondary{background:#fff;color:var(--blue);border:1.5px solid var(--blue);box-shadow:none}
.button.secondary:hover{background:#f3f7fd}
.hp-doc a.button.secondary{color:var(--blue)}
.hp-doc dl{margin:0}
.hp-doc dt{font-weight:800;color:var(--ink);margin-top:16px}
.hp-doc dd{margin:2px 0 0;padding:0;color:#4a4735;font-size:15.5px;line-height:1.6}
.hp-doc .callout{background:#fffdf6;border:1px solid #e4d8bf;border-left:4px solid var(--gold);border-radius:10px;padding:14px 16px;margin:0 0 16px}
.hp-doc .callout p{margin:0;font-size:14.5px}

@media (max-width:820px){
  .hp-honest-grid{grid-template-columns:1fr;gap:22px}
  .hp-foot-cols{grid-template-columns:1fr;gap:22px}
}

/* ===== Issue-first coverage: issue cards + state popup ===== */
.hp-issue-cards{margin-top:28px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,360px));gap:18px}
.hp-issue-card{text-align:left;cursor:pointer;font:inherit;background:var(--paper-soft);border:1px solid #e4d8bf;border-radius:16px;padding:22px 22px 18px;box-shadow:var(--soft-shadow);transition:transform .15s ease,border-color .15s ease}
.hp-issue-card:hover{border-color:var(--coral);transform:translateY(-2px)}
.hp-issue-desc{font-size:14px;color:#6b6248;line-height:1.5;margin:10px 0 14px}
.hp-issue-go{font-size:13px;font-weight:800;color:var(--coral)}
.hp-state-search{width:100%;padding:11px 14px;border:1.5px solid #e4d8bf;border-radius:10px;font-size:15px;background:#fffdf6;color:var(--ink);margin:4px 0 14px}
.hp-state-search:focus{outline:none;border-color:var(--coral)}
.hp-state-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px}
.hp-state{display:flex;align-items:center;justify-content:space-between;gap:8px;text-decoration:none;background:#fffdf6;border:1px solid #e4d8bf;border-radius:10px;padding:11px 13px;font-weight:700;font-size:14.5px;color:var(--ink);transition:transform .15s ease,border-color .15s ease}
a.hp-state:hover{border-color:var(--coral);transform:translateY(-1px)}
.hp-state .go{flex:none;font-size:11px;font-weight:800;color:var(--coral)}
.hp-state[hidden]{display:none}
.pa-modal[hidden]{display:none}
.pa-modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:20px}
.pa-modal-backdrop{position:absolute;inset:0;background:rgba(6,14,22,.6);backdrop-filter:blur(3px)}
.pa-modal-card{position:relative;background:var(--paper-soft);border:1px solid #e4d8bf;border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.5);padding:24px 24px 20px;max-width:520px;width:100%;max-height:80vh;overflow:auto}
.pa-modal-card h3{font-family:Georgia,'Times New Roman',serif;font-size:22px;color:var(--ink);margin:0 6px 4px 0}
.pa-modal-x{position:absolute;top:12px;right:14px;background:none;border:0;font-size:26px;line-height:1;color:#8a7c66;cursor:pointer}
.pa-modal-foot{font-size:12.5px;color:#8a7c66;margin:14px 0 0}
.pa-modal-foot a{color:var(--blue);font-weight:700}


/* Floating back-to-top quick link */
.pa-quick-top{position:fixed;right:18px;bottom:18px;z-index:80;display:inline-flex;align-items:center;justify-content:center;min-width:54px;height:42px;padding:0 14px;border-radius:999px;background:#fff8ed;color:#0d2238;border:1px solid rgba(13,34,56,.14);box-shadow:0 12px 30px rgba(0,0,0,.26);font-size:13px;font-weight:800;text-decoration:none;}
.pa-quick-top:hover{transform:translateY(-1px);text-decoration:none;color:#0d2238;}
@media (max-width:640px){.pa-quick-top{right:12px;bottom:12px;height:38px;min-width:48px;font-size:12px;}}
@media print{.pa-quick-top{display:none !important;}}