/**
 * WinRocket v2 — "Rocket" global design layer.
 * Loads last, after every page stylesheet, and restyles the shared pieces
 * (tokens, type, buttons, badges, header, footer, CTA block, page heroes)
 * so every page matches the new homepage without rewriting inner layouts.
 */

:root{
  --rk-bg:#FAF8F6;
  --rk-surface:#FFFFFF;
  --rk-surface-2:#F4F0EC;
  --rk-ink:#0F172A;
  --rk-muted:#64748B;
  --rk-line:#E9E3DD;
  --rk-accent:#F97316;
  --rk-accent-deep:#EA580C;
  --rk-accent-soft:#FFEDD5;
  --rk-band:#0F172A;
  --rk-f-display:"Archivo","Arial Narrow",Impact,sans-serif;
  --rk-f-body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --rk-f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --rk-f-hand:"Caveat","Bradley Hand",cursive;
  --rk-shadow:0 1px 0 rgba(15,23,42,.04),0 18px 40px -18px rgba(15,23,42,.18);

  /* Map legacy tokens onto the new palette */
  --wr-orange:var(--rk-accent);
  --wr-text:var(--rk-ink);
  --wr-muted:var(--rk-muted);
  --wr-border:var(--rk-line);
  --wr-light:var(--rk-surface-2);
  --wr-radius-lg:18px;
  --wr-radius-xl:28px;
  --wr-shadow-md:var(--rk-shadow);
  --wr-nav-h:62px;
}

/* ─── Base ─── */
body{
  font-family:var(--rk-f-body);
  background:var(--rk-bg);
  color:var(--rk-ink);
  letter-spacing:0;
}
::selection{background:var(--rk-accent-soft);color:var(--rk-ink)}
:focus-visible{outline:3px solid var(--rk-accent);outline-offset:3px}
:where(h1,h2,h3){font-family:var(--rk-f-display);letter-spacing:-.02em}

/* ─── Section titles & badges ─── */
.wr-section-title,.wr-sec-title,
.wr-page-hero h1,.wr-hero h1,.wr-page-header h1,
.wr-cta-block h2,.wr-cta-section h2{
  font-family:var(--rk-f-display);
  font-weight:800;
  font-stretch:90%;
  letter-spacing:-.025em;
  line-height:1.02;
  text-wrap:balance;
}
.wr-page-hero h1,.wr-hero h1{font-weight:900;font-stretch:84%;text-transform:uppercase;letter-spacing:-.015em;line-height:.95}
.wr-section-badge,.wr-sec-badge{
  font-family:var(--rk-f-mono);
  font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
  padding:7px 14px;border-radius:999px;
  background:var(--rk-surface);color:var(--rk-ink);
  border:1px solid var(--rk-line);
}
.wr-section-badge.wr-badge-orange,.wr-sec-badge.wr-badge-orange{color:var(--rk-accent-deep);border-color:#FBD5B5}
.wr-section-badge.wr-badge-blue,.wr-section-badge.wr-badge-purple,.wr-section-badge.wr-badge-navy,.wr-section-badge.wr-badge-green,
.wr-sec-badge.wr-badge-blue,.wr-sec-badge.wr-badge-purple,.wr-sec-badge.wr-badge-navy,.wr-sec-badge.wr-badge-green{background:var(--rk-surface);color:var(--rk-ink)}

/* ─── Buttons (pill) ─── */
.wr-btn-primary,.wr-btn-secondary,.wr-btn-ghost,.wr-btn-orange,.wr-btn-outline-white{
  border-radius:999px;font-weight:600;letter-spacing:0;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease;
}
.wr-btn-primary,.wr-btn-orange{
  background:var(--rk-accent);color:#fff;
  box-shadow:0 10px 24px -10px var(--rk-accent);
}
.wr-btn-primary{padding:14px 26px;font-size:15px}
.wr-btn-primary:hover,.wr-btn-orange:hover{background:var(--rk-accent-deep);color:#fff;transform:translateY(-2px);box-shadow:0 14px 28px -12px var(--rk-accent)}
.wr-btn-secondary,.wr-btn-ghost{background:var(--rk-surface);border:1px solid var(--rk-line);color:var(--rk-ink)}
.wr-btn-secondary{padding:14px 26px;font-size:15px}
.wr-btn-secondary:hover,.wr-btn-ghost:hover{background:var(--rk-surface);border-color:var(--rk-accent);color:var(--rk-ink);transform:translateY(-2px)}
.wr-btn-outline-white{border-radius:999px}

/* ─── Page heroes on inner pages ─── */
.wr-hero,
.wr-page-hero:not(.wr-addon-hero),
.wr-roadmap-content .wr-rm-hero,
.wr-blog-content .wr-page-hero,
.wr-support-content .wr-page-hero,
.wr-shortcodes-content .wr-page-hero{
  background:
    radial-gradient(closest-side at 85% 20%,rgba(249,115,22,.12),transparent),
    radial-gradient(circle at 1px 1px,var(--rk-line) 1px,transparent 0) 0 0/22px 22px,
    var(--rk-bg);
}

/* ─── Header: floating pill ─── */
header.wr-header{
  background:transparent;
  border-bottom:0;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  pointer-events:none;
}
header.wr-header > *{pointer-events:auto}
header.wr-header.is-scrolled{box-shadow:none}
.wr-header-inner{
  width:calc(100% - 32px);
  max-width:1120px;
  margin:12px auto 0;
  padding:0 8px 0 18px;
  border-radius:999px;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  backdrop-filter:saturate(180%) blur(16px);
  border:1px solid var(--rk-line);
  box-shadow:var(--rk-shadow);
  transition:box-shadow .25s ease,background .25s ease;
}
header.wr-header.is-scrolled .wr-header-inner{background:rgba(255,255,255,.94);box-shadow:0 1px 0 rgba(15,23,42,.04),0 22px 44px -20px rgba(15,23,42,.28)}
.wr-logo{font-family:var(--rk-f-display);font-weight:800;font-size:21px}
.wr-logo-icon{border-radius:50%}
.wr-nav{gap:12px}
.wr-nav-list,.wr-nav .menu{gap:2px}
.wr-nav-list a,.wr-nav .menu a{display:block;padding:8px 13px;border-radius:999px;font-size:14.5px;color:var(--rk-muted);transition:color .2s,background .2s}
.wr-nav-list a:hover,.wr-nav .menu a:hover{color:var(--rk-ink);background:var(--rk-surface-2)}
.wr-nav-list a.active,.wr-nav .menu .current-menu-item>a,.wr-nav .menu .current_page_item>a{color:var(--rk-accent-deep);background:var(--rk-accent-soft)}
.wr-header-btns .wr-btn-ghost{padding:9px 16px;font-size:14px}
.wr-header-btns .wr-btn-orange{padding:10px 18px;font-size:14px}

@media (max-width:1024px){
  /* A backdrop-filter here would trap the fixed mobile menu, so use a solid pill */
  .wr-header-inner{
    -webkit-backdrop-filter:none;backdrop-filter:none;
    background:#fff;
    width:calc(100% - 24px);
    margin-top:10px;
    padding:0 6px 0 16px;
  }
  .wr-menu-toggle{width:44px;height:44px;border-radius:50%;background:var(--rk-ink);padding:13px 12px}
  .wr-menu-bar{background:#fff}
  header.wr-header .wr-nav{background:var(--rk-bg);border-top:1px solid var(--rk-line);box-sizing:border-box}
  header.wr-header .wr-nav .wr-header-btns{box-sizing:border-box}
  .wr-nav-list a,.wr-nav .menu a{padding:14px 6px;border-radius:0;font-size:16px;color:var(--rk-ink)}
  .wr-nav-list a:hover,.wr-nav .menu a:hover{background:transparent;color:var(--rk-accent-deep)}
  .wr-nav-list a.active,.wr-nav .menu .current-menu-item>a{background:transparent}
}

/* ─── Shared bottom CTA block → navy band ─── */
.wr-cta-block{
  background:var(--rk-band);
  color:#F8FAFC;
  border-top:0;
  border-radius:28px;
  margin:0 auto 72px;
  width:calc(100% - 32px);
  max-width:1200px;
}
.wr-cta-block::before{background:radial-gradient(closest-side at 80% 30%,rgba(249,115,22,.28),transparent),radial-gradient(closest-side at 10% 90%,rgba(249,115,22,.14),transparent)}
.wr-cta-block h2{color:#F8FAFC;font-size:clamp(32px,4.6vw,56px);text-transform:uppercase;font-weight:900;font-stretch:84%}
.wr-cta-block > p:not(.wr-cta-note),.wr-cta-block .wr-cta-note{color:#94A3B8}
.wr-cta-block .wr-btn-secondary{background:transparent;color:#F8FAFC;border-color:rgba(255,255,255,.25)}

/* ─── Footer ─── */
.wr-footer{background:var(--rk-surface-2);border-top:1px solid var(--rk-line);position:relative;overflow:hidden}
.wr-footer-brand h3{font-family:var(--rk-f-display);font-weight:900;font-size:28px;letter-spacing:-.02em}
.wr-footer-col h4{font-family:var(--rk-f-mono);font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--rk-muted)}
.wr-footer-col ul li a{color:var(--rk-ink)}
.wr-footer-col ul li a:hover{color:var(--rk-accent-deep)}
.wr-social-btn{border-radius:50%;background:var(--rk-surface)}
.wr-footer-credit a{color:var(--rk-accent-deep)}
.wr-footer-bottom{border-top-color:var(--rk-line)}
.wr-footer-tag{border-radius:999px;background:var(--rk-surface);border:1px solid var(--rk-line);font-family:var(--rk-f-mono);font-size:11px;letter-spacing:.08em}
.wr-footer-inner{position:relative}
.wr-footer::after{
  content:"WINROCKET";
  display:block;
  font-family:var(--rk-f-display);font-weight:900;font-stretch:80%;
  font-size:clamp(64px,17vw,250px);line-height:.8;letter-spacing:-.02em;
  text-align:center;color:transparent;
  -webkit-text-stroke:1px var(--rk-line);
  margin-top:40px;margin-bottom:-.12em;
  pointer-events:none;user-select:none;
}

@media (prefers-reduced-motion:reduce){
  .wr-btn-primary,.wr-btn-secondary,.wr-btn-ghost,.wr-btn-orange{transition:none}
}
