/* ═══════════════════════════════════════════════════════════
   NEMTHQ — State Promo Drawer
   Geolocation-based, auto-show, single card with dual CTAs
   v=1 — April 2026
   ═══════════════════════════════════════════════════════════ */

.promo-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:9998;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.promo-overlay.active{opacity:1;visibility:visible}

.promo-drawer{position:fixed;top:0;right:0;width:88vw;max-width:360px;height:100dvh;z-index:9999;background:#fff;box-shadow:-8px 0 40px rgba(0,0,0,.12);transform:translateX(105%);transition:transform .4s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;overflow:hidden}
.promo-drawer.active{transform:translateX(0)}

.promo-header{padding:14px 16px;background:linear-gradient(135deg,#1B3A8C 0%,#2952C4 100%);color:#fff;display:flex;align-items:center;gap:12px;flex-shrink:0}
.promo-abbr{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.22);display:grid;place-items:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:.9rem;letter-spacing:.04em;flex-shrink:0}
.promo-hd-text{flex:1;min-width:0}
.promo-hd-name{font-family:'Source Serif 4',serif;font-size:1rem;font-weight:700;line-height:1.2}
.promo-hd-sub{font-size:.68rem;opacity:.7;margin-top:1px}
.promo-close{width:32px;height:32px;border:none;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:1.1rem;cursor:pointer;display:grid;place-items:center;flex-shrink:0;transition:background .2s}
.promo-close:hover{background:rgba(255,255,255,.25)}

.promo-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 16px 20px}

.promo-badges{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:16px}
.promo-badge{padding:4px 10px;border-radius:6px;font-size:.7rem;font-weight:700;letter-spacing:.01em}
.promo-badge.mod{background:rgba(27,58,140,.07);color:#1B3A8C}
.promo-badge.rate{background:rgba(255,107,44,.07);color:#D4500A}
.promo-badge.time{background:rgba(34,197,94,.07);color:#15803D}

.promo-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:16px}
.promo-stat{background:#F8F9FB;border-radius:8px;padding:10px;text-align:center}
.promo-stat-val{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:800;color:#1B3A8C}
.promo-stat-lbl{font-size:.68rem;color:#888;margin-top:2px}

.promo-checks{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}
.promo-chk{display:flex;align-items:center;gap:9px;padding:8px 12px;background:#F8F9FB;border-radius:8px;font-size:.82rem;color:#333}
.promo-chk-icon{width:18px;height:18px;min-width:18px;border-radius:5px;background:linear-gradient(135deg,#22C55E,#16A34A);color:#fff;display:grid;place-items:center;font-size:.6rem;font-weight:800}

.promo-cta-primary{display:block;width:100%;padding:14px 16px;border-radius:10px;background:linear-gradient(135deg,#FF6B2C,#FF8A50);color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:.9rem;text-align:center;text-decoration:none;border:none;cursor:pointer;box-shadow:0 4px 16px rgba(255,107,44,.22);transition:transform .2s,box-shadow .2s;margin-bottom:10px}
.promo-cta-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(255,107,44,.32)}

.promo-blog-link{display:block;text-align:center;font-size:.75rem;color:#999;text-decoration:none;padding:2px 0;transition:color .2s}
.promo-blog-link:hover{color:#1B3A8C}

.promo-footer{text-align:center;padding:8px 16px 14px;border-top:1px solid rgba(0,0,0,.05);flex-shrink:0}
.promo-change{font-size:.75rem;color:#999;background:none;border:none;cursor:pointer;text-decoration:underline;text-decoration-color:rgba(0,0,0,.12);padding:4px 8px;font-family:'Bricolage Grotesque',sans-serif;transition:color .2s}
.promo-change:hover{color:#1B3A8C}

.promo-loading{text-align:center;padding:60px 20px;color:#999;font-size:.85rem}
.promo-loading::after{content:'';display:block;width:28px;height:28px;margin:12px auto 0;border:3px solid rgba(27,58,140,.1);border-top-color:#1B3A8C;border-radius:50%;animation:promo-spin .7s linear infinite}
@keyframes promo-spin{to{transform:rotate(360deg)}}

@media(min-width:769px){
  .promo-drawer{max-width:380px}
}