@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');

/* ==========================================================================
   Hive enterprise design system (sitewide)
   Loaded LAST so it wins on source order for equal-specificity ties.
   Goals: one electric-blue action system, customer-readable type floors,
   stark-white core copy, no false affordances on static cards, and a
   distinct Carnac display typeface for product identity.
   Electric blue #168BFF is the primary action / selection / routing accent.
   ========================================================================== */

:root{
  /* Brighten shared text tokens used by the Carnac pages */
  --bone:#FFFFFF;
  --mute:#CBD8EF;   /* WCAG-bright secondary neutral (~13:1 on #070B11) */
  --faint:#AEBFDE;  /* dimmest allowed neutral, still readable */

  /* Electric-blue action palette (centered on #168BFF) */
  --hv-blue:#168BFF;
  --hv-blue-bright:#45A6FF;
  --hv-blue-edge:#6BC0FF;
  --hv-blue-deep:#0A3A9E;

  /* Carnac product display typeface (typography canon, authoritative):
     Space Grotesk SemiBold. Wide technical grotesque, white primary wordmark,
     visibly distinct from the Inter body font. Robust fallbacks: geometric
     technical faces, then system sans. Descriptors ("Prompt" blue, "Gateway"
     amber) and body labels stay Inter Medium. */
  --carnac-font:'Space Grotesk','Oxanium','Chakra Petch',ui-sans-serif,system-ui,sans-serif;
  /* Warm amber Carnac Gateway descriptor accent (canon). */
  --carnac-amber:#F2A93B;

  /* Enterprise button tokens (electric blue) */
  --hv-btn-grad:hsl(211 100% 54% / 1);
  --hv-btn-grad-img:linear-gradient(180deg,#3fa0ff 0%,#168bff 46%,#0f6fe0 100%);
  --hv-btn-grad-hover:linear-gradient(180deg,#5cb2ff 0%,#2f9bff 46%,#1479ea 100%);
  --hv-btn-edge:1px solid rgba(120,190,255,0.7);
  --hv-btn-inner:inset 0 1px 0 rgba(255,255,255,0.45);
  --hv-btn-glow:0 10px 28px -6px rgba(22,139,255,0.55), 0 2px 6px rgba(8,16,34,0.5);
  --hv-btn-glow-hover:0 16px 42px -8px rgba(22,139,255,0.72), 0 3px 10px rgba(8,16,34,0.55);
  --hv-btn-press:inset 0 2px 7px rgba(6,14,30,0.6), 0 4px 14px -6px rgba(22,139,255,0.5);
  --hv-focus-ring:0 0 0 3px rgba(69,166,255,0.65);
}

/* ==========================================================================
   1. ENTERPRISE CTA / BUTTON SYSTEM
   ========================================================================== */

/* ---- Primary (filled, depth + controlled blue glow) ---- */
.hive-hero .hero-cta-btn.primary,
.carnac-cta a:first-child,
.mm-btn,
.mm-handoff-cta,
.rap-btn.primary,
.btn-primary{
  background:var(--hv-btn-grad-img) !important;
  color:#FFFFFF !important;
  border:var(--hv-btn-edge) !important;
  box-shadow:var(--hv-btn-inner), var(--hv-btn-glow) !important;
  font-weight:700 !important;
  font-size:17px !important;
  letter-spacing:0.01em;
  min-height:48px;
  padding:14px 28px;
  border-radius:12px;
  text-shadow:0 1px 1px rgba(4,12,30,0.4);
  cursor:pointer;
  transition:transform .14s ease, box-shadow .14s ease, background .14s ease, filter .14s ease;
}
.hive-hero .hero-cta-btn.primary:hover,
.carnac-cta a:first-child:hover,
.mm-btn:hover,
.mm-handoff-cta:hover,
.rap-btn.primary:hover,
.btn-primary:hover{
  background:var(--hv-btn-grad-hover) !important;
  transform:translateY(-2px);
  box-shadow:var(--hv-btn-inner), var(--hv-btn-glow-hover) !important;
  filter:none !important;
}
.hive-hero .hero-cta-btn.primary:active,
.carnac-cta a:first-child:active,
.mm-btn:active,
.mm-handoff-cta:active,
.rap-btn.primary:active,
.btn-primary:active{
  transform:translateY(1px);
  box-shadow:var(--hv-btn-press) !important;
  filter:saturate(1.06);
}
.hive-hero .hero-cta-btn.primary:focus-visible,
.carnac-cta a:first-child:focus-visible,
.mm-btn:focus-visible,
.mm-handoff-cta:focus-visible,
.rap-btn.primary:focus-visible,
.btn-primary:focus-visible{
  outline:none;
  box-shadow:var(--hv-focus-ring), var(--hv-btn-inner), var(--hv-btn-glow) !important;
}

/* ---- Secondary (outline, readable, subtle) ---- */
.hive-hero .hero-cta-btn.secondary,
.carnac-cta a+a,
.rap-btn.ghost,
.btn-out,
.scn-btn{
  background:rgba(47,128,255,0.07) !important;
  color:#FFFFFF !important;
  border:1px solid rgba(109,163,240,0.55) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08);
  font-weight:600 !important;
  font-size:17px !important;
  min-height:48px;
  padding:13px 24px;
  border-radius:12px;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}
.hive-hero .hero-cta-btn.secondary:hover,
.carnac-cta a+a:hover,
.rap-btn.ghost:hover,
.btn-out:hover,
.scn-btn:hover{
  background:rgba(47,128,255,0.14) !important;
  border-color:#4DA6FF !important;
  color:#FFFFFF !important;
  transform:translateY(-1px);
  box-shadow:0 8px 22px -10px rgba(47,128,255,0.5);
}
.hive-hero .hero-cta-btn.secondary:active,
.carnac-cta a+a:active,
.rap-btn.ghost:active,
.btn-out:active,
.scn-btn:active{ transform:translateY(1px); }
.hive-hero .hero-cta-btn.secondary:focus-visible,
.carnac-cta a+a:focus-visible,
.rap-btn.ghost:focus-visible,
.btn-out:focus-visible,
.scn-btn:focus-visible{
  outline:none;
  box-shadow:var(--hv-focus-ring);
  border-color:#6BC7FF !important;
}
/* scn-btn is a small pill toggle: keep it compact, not a giant button */
.scn-btn{ min-height:38px; padding:8px 14px; font-size:15px !important; border-radius:9px; }
.scn-btn[aria-pressed="true"]{ background:rgba(47,128,255,0.18) !important; border-color:#4DA6FF !important; }

/* ---- Disabled: must look disabled, never glow ---- */
.mm-btn[disabled], .mm-btn:disabled,
.rap-btn[disabled], .rap-btn:disabled,
.btn[disabled], .btn:disabled,
.btn-primary[disabled], .btn-primary:disabled,
[aria-disabled="true"].btn, [aria-disabled="true"].mm-btn{
  background:#1a2437 !important;
  color:rgba(234,241,251,0.5) !important;
  border-color:rgba(234,241,251,0.12) !important;
  box-shadow:none !important;
  transform:none !important;
  text-shadow:none !important;
  filter:none !important;
  cursor:not-allowed !important;
}

/* ==========================================================================
   2. FALSE-AFFORDANCE REMOVAL (static, non-link cards feel static)
   ========================================================================== */
.carnac-card, .mm-card{ cursor:default; transition:none; }
.carnac-card:hover{ transform:none; border-color:rgba(47,128,255,0.18); }
.mm-card:hover{ transform:none; border-color:rgba(47,128,255,0.16); }
.mm-card.next:hover{ border-color:rgba(47,128,255,0.16); }

/* Real link cards keep lift + gain a clear keyboard focus ring */
.deep-card:focus-visible, .prim:focus-visible{
  outline:none;
  box-shadow:var(--hv-focus-ring);
  border-color:#6BC7FF !important;
}

/* ==========================================================================
   3. TYPOGRAPHY & CONTRAST FLOORS
   Core copy = #FFFFFF. Secondary metadata = bright neutral, >=14px.
   ========================================================================== */

/* ---- Homepage: main section body copy (18px, stark white) ---- */
.carnac-sub{ font-size:clamp(18px,1.8vw,19px) !important; color:#FFFFFF !important; line-height:1.6 !important; }
.mm-sub{ font-size:clamp(18px,1.8vw,19px) !important; color:#FFFFFF !important; line-height:1.6 !important; }
.rap-sub{ font-size:clamp(18px,1.8vw,19px) !important; color:#FFFFFF !important; line-height:1.6 !important; }
.clr-intro{ font-size:18px !important; color:#FFFFFF !important; line-height:1.6 !important; }

/* ---- Homepage: card descriptions (>=17px, white) ---- */
.carnac-desc{ font-size:17px !important; color:#FFFFFF !important; line-height:1.55 !important; opacity:1 !important; }
.carnac-desc b{ color:#FFFFFF !important; }
.deep-desc{ font-size:17px !important; color:#FFFFFF !important; line-height:1.55 !important; opacity:1 !important; }
.clr-use{ font-size:17px !important; color:#FFFFFF !important; line-height:1.55 !important; }
.clr-why{ font-size:16px !important; color:#EAF2FF !important; line-height:1.55 !important; }
.mm-card p, .mm-card .mm-cwhy{ font-size:16px !important; color:#EAF2FF !important; line-height:1.55 !important; }

/* ---- Homepage: step / section / form labels (>=16px) ---- */
.carnac-step{ font-size:16px !important; color:#9CC0FF !important; }
.carnac-title{ color:#FFFFFF !important; }
.carnac-foot{ font-size:14px !important; color:#CBD8EF !important; }
.mm-seclabel{ font-size:16px !important; }
.mm-seclabel.now{ color:#4ADE9C !important; }

/* ---- Homepage: named privacy microline (must be readable) ---- */
.mm-reassure{ font-size:14px !important; color:#4ADE9C !important; }

/* ---- Homepage: eyebrows / tags / meta (>=14px, bright neutral) ---- */
.carnac-eyebrow{ font-size:14px !important; color:#CBD8EF !important; }
.mm-eyebrow{ font-size:14px !important; color:#F0B54A !important; }
.rap-eyebrow{ font-size:14px !important; color:#CBD8EF !important; }
.deep-tag{ font-size:14px !important; color:#8FB4FF !important; }
.deep-card.feature .deep-tag{ color:#F0B54A !important; }
.deep-name{ font-size:19px !important; color:#FFFFFF !important; }
.deep-go{ font-size:14px !important; }
.deep-foot{ font-size:14px !important; color:#CBD8EF !important; }
.proof-row span{ font-size:14px !important; color:#AEC6FF !important; }
.clr-stage{ font-size:14px !important; color:#7FB0FF !important; }
.clr-badge{ font-size:12px !important; }
.clr-note{ font-size:14px !important; color:#CBD8EF !important; }
.clr-link{ font-size:14px !important; color:#7FB0FF !important; }
.clr-flow{ font-size:13.5px !important; }
.clr-flow .step{ color:#EAF2FF !important; }
.clr-name{ font-size:17px !important; color:#FFFFFF !important; }
.rap-status{ font-size:14px !important; }
.rap-kv .k{ font-size:13.5px !important; color:#9CC0FF !important; }
.rap-kv .v{ font-size:13.5px !important; color:#FFFFFF !important; }
.mm-cname{ color:#FFFFFF !important; }

/* ---- Homepage footer: proof copy white, meta >=14px bright ---- */
.footer-brand-text{ color:#FFFFFF !important; font-size:15px; line-height:1.55; }
.footer-brand-text *{ color:#FFFFFF !important; }
.footer-nav a{ font-size:14px !important; color:#EAF2FF !important; }
.footer-meta{ font-size:14px !important; color:#CBD8EF !important; }

/* ==========================================================================
   Carnac pages (/carnac/, /carnac/director/)
   Token override handles color; per-class rules handle size floors.
   ========================================================================== */

/* Director + Carnac shared body / lede */
.lede{ font-size:clamp(18px,1.9vw,20px) !important; color:#FFFFFF !important; line-height:1.62 !important; }
.lede b{ color:#FFFFFF !important; }

/* Director eyebrow (incl. "STEP 1 · ANSWER FOR YOUR ORGANIZATION") >=16px */
.eyebrow{ font-size:16px !important; color:#7FB0FF !important; }

/* Director form labels (incl. "ORGANIZATION NAME") >=16px, pure white */
.field label{ font-size:16px !important; color:#FFFFFF !important; }
.field .hint{ font-size:14px !important; color:#CBD8EF !important; }
.field input, .field select{ font-size:17px !important; color:#FFFFFF !important; }

/* Director package labels ("PACKAGE ONE" ...) >=16px, card copy white */
.pairc .k{ font-size:16px !important; color:#7FB0FF !important; }
.pairc h3{ color:#FFFFFF !important; }
.pairc p{ font-size:16px !important; color:#FFFFFF !important; line-height:1.55 !important; }
.pairc .tag{ font-size:13px !important; }

/* Director recommendation output */
.rhead .reasons li{ font-size:16px !important; color:#FFFFFF !important; line-height:1.55 !important; }
.prim .pn{ font-size:17px !important; color:#FFFFFF !important; }
.prim .pr{ font-size:15px !important; color:#EAF2FF !important; line-height:1.5 !important; }
.prim .pgo{ font-size:14px !important; color:#6BC7FF !important; }
.prim .ppill, .prim .corepill{ font-size:12px !important; }

/* Director compare + export secondary copy */
.compare .csub{ font-size:15px !important; color:#EAF2FF !important; }
.compare .ctitle{ color:#FFFFFF !important; }
.export .etitle{ color:#FFFFFF !important; }
.export .esub{ font-size:15px !important; color:#EAF2FF !important; }
.brief{ font-size:14px !important; color:#D3E0F5 !important; }
.foot{ font-size:14px !important; color:#CBD8EF !important; }

/* /carnac/ page: brighten muted body + labels */
.scn-btn{ font-size:15px !important; }

/* ==========================================================================
   4. SITEWIDE ELECTRIC-BLUE ACTION SYSTEM
   Generic CTA classes used across the whole site inherit the same premium
   electric-blue depth/glow. Secondary/ghost/outline/disabled are excluded
   from the loud treatment so only true primary actions glow.
   ========================================================================== */
.btn-primary,
.cta-btn,
a.cta.primary,
.btn.primary,
button.primary,
.btn:not(.btn-out):not(.ghost):not(.secondary):not(.outline):not(.btn-ghost):not(.link):not([disabled]):not([aria-disabled="true"]),
.cta:not(.ghost):not(.secondary):not(.outline):not([disabled]):not([aria-disabled="true"]){
  background:var(--hv-btn-grad-img) !important;
  color:#FFFFFF !important;
  border:var(--hv-btn-edge) !important;
  box-shadow:var(--hv-btn-inner), var(--hv-btn-glow) !important;
  font-weight:700 !important;
  font-size:17px !important;
  letter-spacing:0.01em;
  min-height:46px;
  padding:13px 26px;
  border-radius:12px;
  text-shadow:0 1px 1px rgba(4,12,30,0.4);
  cursor:pointer;
  transition:transform .14s ease, box-shadow .14s ease, background .14s ease, filter .14s ease;
}
.btn-primary:hover,
.cta-btn:hover,
a.cta.primary:hover,
.btn.primary:hover,
button.primary:hover,
.btn:not(.btn-out):not(.ghost):not(.secondary):not(.outline):not(.btn-ghost):not(.link):not([disabled]):not([aria-disabled="true"]):hover,
.cta:not(.ghost):not(.secondary):not(.outline):not([disabled]):not([aria-disabled="true"]):hover{
  background:var(--hv-btn-grad-hover) !important;
  transform:translateY(-2px);
  box-shadow:var(--hv-btn-inner), var(--hv-btn-glow-hover) !important;
  filter:none !important;
}
.btn-primary:active,
.cta-btn:active,
a.cta.primary:active,
.btn.primary:active,
button.primary:active,
.btn:not(.btn-out):not(.ghost):not(.secondary):not(.outline):not(.btn-ghost):not(.link):not([disabled]):not([aria-disabled="true"]):active,
.cta:not(.ghost):not(.secondary):not(.outline):not([disabled]):not([aria-disabled="true"]):active{
  transform:translateY(1px);
  box-shadow:var(--hv-btn-press) !important;
}
.btn-primary:focus-visible,
.cta-btn:focus-visible,
a.cta.primary:focus-visible,
.btn.primary:focus-visible,
button.primary:focus-visible,
.btn:focus-visible,
.cta:focus-visible{
  outline:none;
  box-shadow:var(--hv-focus-ring), var(--hv-btn-inner), var(--hv-btn-glow) !important;
}

/* Secondary / outline / ghost: readable, bordered, electric-blue edge, no loud glow */
.btn-out, .btn.ghost, .btn.secondary, .btn.outline, .btn-ghost,
.cta.ghost, .cta.secondary, .cta.outline{
  background:rgba(22,139,255,0.08) !important;
  color:#FFFFFF !important;
  border:1px solid rgba(107,192,255,0.55) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08);
  font-weight:600 !important;
  font-size:17px !important;
  min-height:46px;
  padding:12px 22px;
  border-radius:12px;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}
.btn-out:hover, .btn.ghost:hover, .btn.secondary:hover, .btn.outline:hover, .btn-ghost:hover,
.cta.ghost:hover, .cta.secondary:hover, .cta.outline:hover{
  background:rgba(22,139,255,0.15) !important;
  border-color:var(--hv-blue-bright) !important;
  transform:translateY(-1px);
  box-shadow:0 8px 22px -10px rgba(22,139,255,0.5);
}
.btn-out:focus-visible, .btn.ghost:focus-visible, .btn.secondary:focus-visible,
.btn.outline:focus-visible, .btn-ghost:focus-visible,
.cta.ghost:focus-visible, .cta.secondary:focus-visible, .cta.outline:focus-visible{
  outline:none;
  box-shadow:var(--hv-focus-ring);
  border-color:var(--hv-blue-edge) !important;
}

/* Disabled anywhere must look disabled and never glow */
.btn[disabled], .btn:disabled, .cta[disabled], .cta:disabled,
.cta-btn[disabled], .cta-btn:disabled,
[aria-disabled="true"].btn, [aria-disabled="true"].cta, [aria-disabled="true"].cta-btn{
  background:#1a2437 !important;
  color:rgba(234,241,251,0.5) !important;
  border-color:rgba(234,241,251,0.12) !important;
  box-shadow:none !important;
  transform:none !important;
  text-shadow:none !important;
  filter:none !important;
  cursor:not-allowed !important;
}

/* ==========================================================================
   5. CARNAC PRODUCT DISPLAY TYPEFACE
   Distinct angular technical face for Carnac product identity: marks,
   Carnac hero headings, and Director product labels/badges. Never body copy.
   ========================================================================== */
.carnac-mark,
.carnac-display,
.carnac-h2 .blue,
.carnac-title, .deep-card.feature .deep-name,
.pairc h3, .prim .pn,
.mm-seclabel, .carnac-eyebrow, .mm-eyebrow{
  font-family:var(--carnac-font) !important;
  letter-spacing:0.015em;
}
.carnac-mark{ font-weight:600; }
/* Carnac page + Director hero headings get the display face at SemiBold, the
   canon weight for the Carnac wordmark. Space Grotesk ships a real 600, so no
   faux-bold synthesis. */
.carnac-display{ font-family:var(--carnac-font) !important; font-weight:600 !important; letter-spacing:0.01em; }
/* Canon descriptor colors: electric-blue "Prompt", warm-amber "Gateway". */
.carnac-desc-prompt{ color:var(--hv-blue) !important; }
.carnac-desc-gateway{ color:var(--carnac-amber) !important; }
/* Homepage Carnac band headline must decay to stark white (not the pale
   #EAF2FF base) once the phosphor sweep clears; the .blue accent word keeps
   its electric-blue color via the section stylesheet. */
.carnac-h2{ color:#FFFFFF !important; }

/* ==========================================================================
   6. LONG-FORM / BLOG READABILITY & COHERENCE
   Blog posts shipped without a body font-family (fell back to serif) and
   used dull translucent text. Bring them onto the site Inter stack with
   stark-white core copy and an enterprise body floor. Headings/marks keep
   their existing display treatment; only prose is normalized here.
   ========================================================================== */
.post-body,
.post-body p,
.post-body li,
article p, article li,
.post p, .post li{
  font-family:'Inter','Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif !important;
  color:#FFFFFF !important;
  font-size:18px !important;
  line-height:1.72 !important;
}
.post-sub{ color:#EAF2FF !important; }
.post-body blockquote{ color:#FFFFFF !important; }
.post-body strong, .post-body b{ color:#FFFFFF !important; }
.pc-summary{
  font-family:'Inter','Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif !important;
  font-size:15px !important;
  color:#EAF2FF !important;
}
.hub-sub, .post-sub{ color:#EAF2FF !important; }
