/* ============================================================
   DESIGN TOKENS — responsive type / spacing / radius
   Mobile-first: mobile values are defaults, sm (≥640) and lg (≥1024)
   add scale. Tokens set size/spacing only — font-family, weight, color
   stay as utilities so each use case can pick its own.
   Edit one place here → site-wide consistency.
   ============================================================ */

/* — Typography */
.text-display { font-size:36px; line-height:1.05; }
.text-h2      { font-size:28px; line-height:1.15; }
.text-h3      { font-size:20px; line-height:1.25; }
.text-lead    { font-size:16px; line-height:1.6;  }
.text-body    { font-size:14px; line-height:1.55; }
.text-meta    { font-size:11px; line-height:1.3;  }

/* — Spacing (padding) */
.pad-section    { padding-top:48px; padding-bottom:48px; }
.pad-section-sm { padding-top:32px; padding-bottom:32px; }
.pad-card-lg    { padding:16px; }
.pad-card       { padding:12px; }
.pad-x          { padding-left:16px; padding-right:16px; }

/* — Gap (for flex/grid containers between sibling blocks) */
.gap-stack    { gap:12px; }

/* — Margin-bottom for section heads (label + h2 → body content) */
.mb-head      { margin-bottom:32px; }

/* — Radius */
.rad-card-lg  { border-radius:24px; }
.rad-card     { border-radius:12px; }

@media (min-width:640px){
  .text-display { font-size:52px; }
  .text-h2      { font-size:36px; }
  .text-h3      { font-size:24px; }
  .text-lead    { font-size:18px; }
  .text-body    { font-size:16px; }
  .text-meta    { font-size:12px; }
  .pad-section    { padding-top:64px; padding-bottom:64px; }
  .pad-section-sm { padding-top:48px; padding-bottom:48px; }
  .pad-card-lg    { padding:20px; }
  .pad-card       { padding:16px; }
  .pad-x          { padding-left:24px; padding-right:24px; }
  .gap-stack    { gap:16px; }
  .mb-head      { margin-bottom:40px; }
}

@media (min-width:1024px){
  .text-display { font-size:64px; }
  .text-h2      { font-size:48px; }
  .text-h3      { font-size:32px; }
  .text-lead    { font-size:20px; }
  .text-body    { font-size:18px; }
  .text-meta    { font-size:13px; }
  .pad-section    { padding-top:96px; padding-bottom:96px; }
  .pad-section-sm { padding-top:72px; padding-bottom:72px; }
  .pad-card-lg    { padding:24px; }
  .pad-card       { padding:16px; }
  .pad-x          { padding-left:32px; padding-right:32px; }
  .gap-stack    { gap:24px; }
  .mb-head      { margin-bottom:56px; }
  .rad-card-lg  { border-radius:40px; }
  .rad-card     { border-radius:16px; }
}

body { font-family:'DM Sans',sans-serif; color:#111; }

.grad {background:linear-gradient(135deg,#1D6FFF 0%,#9333EA 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:inline;}

h1,h2,h3,h4 { font-family:'Outfit',sans-serif; }

.nav-link { font-size:.875rem; font-weight:500; color:#374151; text-decoration:none; position:relative; padding-bottom:2px; transition:color .15s; }
.nav-link {padding:.375rem 1rem !important;border-radius:999px;position:relative;z-index:1;}

.nav-link:hover, .nav-link.active { color:var(--cobalt); }

.nav-link::after { content:''; position:absolute; bottom:-2px; left:0; width:0; height:1.5px; background:var(--cobalt); transition:width .2s; }
.nav-link::after {display:none !important;}

.nav-link:hover::after, .nav-link.active::after { width:100%; }

.dropdown { position:relative; }

.dropdown.is-open .dropdown-menu {display:flex;}
.dropdown.is-open .dropdown-menu {visibility:visible;opacity:1;transform:translateY(0) translateX(-50%) !important;pointer-events:auto;transition:opacity .18s,transform .18s cubic-bezier(.34,1.56,.64,1),visibility 0s 0s;}

.dd-col { flex:1; }

.dd-col-title { font-family:'Outfit',sans-serif; font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--cobalt); margin-bottom:.875rem; }
.dd-col-title {margin-bottom:1rem !important;}

.dd-link { display:flex; align-items:center; gap:.5rem; font-size:.875rem; font-weight:500; color:#374151; text-decoration:none; padding:.45rem 0; border-bottom:1px solid #F3F4F6; transition:color .15s; }

.dd-link:last-child { border-bottom:none; }

.dd-link:hover { color:var(--cobalt); }

.btn-outline { display:inline-block; background:transparent; color:#374151 !important; font-weight:500; border:1.5px solid #D1D5DB; border-radius:8px; text-decoration:none; transition:border-color .15s,color .15s; }

.btn-outline:hover { border-color:var(--cobalt); color:var(--cobalt) !important; }

.btn-white { display:inline-block; background:#fff; color:var(--navy) !important; font-weight:600; border-radius:8px; text-decoration:none; transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s; box-shadow:0 4px 16px rgba(0,0,0,.15); }

.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.2); }

.section-label { display:inline-block; font-family:'Outfit',sans-serif; font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--cobalt); margin-bottom:1rem; }

.form-input { width:100%; padding:.875rem 1.125rem; border:1.5px solid #E5E7EB; border-radius:10px; font-size:.9rem; color:#111; background:#fff; font-family:'DM Sans',sans-serif; transition:border-color .15s,box-shadow .15s; }

.form-input:focus { outline:none; border-color:var(--cobalt); box-shadow:0 0 0 3px rgba(37,99,235,.12); }

.form-input::placeholder { color:#9CA3AF; }

.svc-card { border:1.5px solid #E5E7EB; border-radius:16px; padding:2rem; background:#fff; text-decoration:none; color:inherit; display:block; transition:border-color .2s,box-shadow .2s,transform .2s cubic-bezier(.34,1.56,.64,1); }

.svc-card:hover { border-color:var(--cobalt-light); box-shadow:0 8px 32px rgba(37,99,235,.1); transform:translateY(-3px); }

.svc-card:hover .svc-icon { background:var(--cobalt); }

.svc-card:hover .svc-icon svg { color:#fff; }

#mobile-menu { display:none; }

#mobile-menu.open { display:block; }

html { scroll-behavior:smooth; scroll-padding-top:88px; }
html { font-size: 125%; }

@keyframes aurora {
      from { background-position: 50% 50%, 50% 50%; }
      to   { background-position: 350% 50%, 350% 50%; }
    }

.aurora-layer {
      position: absolute;
      inset: -10px;
      background-image:
        repeating-linear-gradient(100deg, #fff 0%, #fff 7%, transparent 10%, transparent 12%, #fff 16%),
        repeating-linear-gradient(100deg, #3B82F6 10%, #A5B4FC 15%, #93C5FD 20%, #DDD6FE 25%, #60A5FA 30%);
      background-size: 300%, 200%;
      background-position: 50% 50%, 50% 50%;
      filter: blur(10px) invert(1);
      opacity: 0.5;
      animation: aurora 60s linear infinite;
      -webkit-mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
      mask-image: radial-gradient(ellipse at 100% 0%, black 10%, transparent 70%);
      pointer-events: none;
      will-change: transform;
      z-index: 0;
    }

.aurora-layer::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image:
        repeating-linear-gradient(100deg, #fff 0%, #fff 7%, transparent 10%, transparent 12%, #fff 16%),
        repeating-linear-gradient(100deg, #3B82F6 10%, #A5B4FC 15%, #93C5FD 20%, #DDD6FE 25%, #60A5FA 30%);
      background-size: 200%, 100%;
      background-attachment: fixed;
      mix-blend-mode: difference;
      animation: aurora 60s linear infinite;
    }

.dark-section .section-label { color: rgba(160,190,255,.82) !important; }

.dark-section h2, .dark-section h3 { color: #fff !important; }

.dark-section p { color: rgba(210,225,255,.82) !important; }

.dark-section .text-gray-500 { color: rgba(200,215,255,.75) !important; }

.dark-section .text-gray-600 { color: rgba(200,215,255,.8) !important; }

.dark-section .text-gray-400 { color: rgba(180,200,255,.65) !important; }

.dark-section .text-cobalt { color: #7BADFF !important; }

.dark-section .text-gray-900 { color: #fff !important; }

.dark-section .text-gray-950 { color: #fff !important; }

.dark-section .text-gray-700 { color: rgba(210,225,255,.85) !important; }

.btn-glow-wrap { position:relative; display:inline-flex; vertical-align:middle; }

.btn-glow-bg { position:absolute; inset:-3px; background:linear-gradient(135deg,#1D6FFF 0%,#7C3AED 50%,#9333EA 100%); border-radius:12px; filter:blur(18px); opacity:0; transition:opacity 1s ease; pointer-events:none; z-index:0; }

.btn-glow-wrap:hover .btn-glow-bg { opacity:0.85; transition:opacity .25s ease; }

@keyframes shine-spin {
      from { transform: rotate(0deg); }
      to   { transform: rotate(360deg); }
    }

.shine-border-wrap {
      position: relative;
      border-radius: 22px;   
      padding: 2px;
    }

.shine-border-glow {
      position: absolute;
      inset: 0;
      border-radius: 22px;
      overflow: hidden;
    }

.shine-border-spin {
      position: absolute;
      inset: -100%;
      filter: blur(6px);
      animation: shine-spin 4s linear infinite;
      background: conic-gradient(from 0deg, #1D6FFF, #9333EA, #22D3EE, #1D6FFF);
    }

@keyframes bga-move-vertical {
      0%   { transform: translateY(-50%); }
      50%  { transform: translateY(50%); }
      100% { transform: translateY(-50%); }
    }

@keyframes bga-move-circle {
      0%   { transform: rotate(0deg); }
      50%  { transform: rotate(180deg); }
      100% { transform: rotate(360deg); }
    }

@keyframes bga-move-horizontal {
      0%   { transform: translateX(-50%) translateY(-10%); }
      50%  { transform: translateX(50%) translateY(10%); }
      100% { transform: translateX(-50%) translateY(-10%); }
    }

.bga-wrap {
      position: relative;
      overflow: hidden;
      background: linear-gradient(40deg, rgb(4,9,30), rgb(30,11,100));
    }

.bga-orbs {
      position: absolute;
      inset: 0;
      filter: url(#blurMeStats) blur(40px);
    }

.bga-orb {
      position: absolute;
      mix-blend-mode: hard-light;
      width: 700px; height: 700px;
      top: calc(50% - 350px);
      left: calc(50% - 350px);
    }

.bga-orb-1 {
      background: radial-gradient(circle at center, rgb(37,99,235) 0, rgb(37,99,235) 50%) no-repeat;
      transform-origin: center center;
      animation: bga-move-vertical 30s ease infinite;
    }

.bga-orb-2 {
      background: radial-gradient(circle at center, rgba(147,51,234,.8) 0, rgba(147,51,234,0) 50%) no-repeat;
      transform-origin: calc(50% - 400px);
      animation: bga-move-circle 20s reverse infinite;
    }

.bga-orb-3 {
      background: radial-gradient(circle at center, rgba(34,211,238,.8) 0, rgba(34,211,238,0) 50%) no-repeat;
      transform-origin: calc(50% + 400px);
      animation: bga-move-circle 40s linear infinite;
    }

.bga-orb-4 {
      background: radial-gradient(circle at center, rgba(29,111,255,.8) 0, rgba(29,111,255,0) 50%) no-repeat;
      transform-origin: calc(50% - 200px);
      animation: bga-move-horizontal 40s ease infinite;
      opacity: .7;
    }

.bga-orb-5 {
      background: radial-gradient(circle at center, rgba(120,60,240,.8) 0, rgba(120,60,240,0) 50%) no-repeat;
      transform-origin: calc(50% - 800px) calc(50% + 800px);
      animation: bga-move-circle 20s ease infinite;
    }

#nav-pill {position:absolute;background:rgba(37,99,235,.09);border-radius:999px;pointer-events:none;transition:left .22s cubic-bezier(.34,1.56,.64,1),width .22s cubic-bezier(.34,1.56,.64,1),opacity .15s;opacity:0;height:34px;top:50%;transform:translateY(-50%);z-index:0;}

.dd-link-rich {display:flex;align-items:flex-start;gap:.75rem;padding:.5rem .375rem;border-radius:10px;text-decoration:none;transition:background .15s;margin-bottom:.25rem;}

.dd-link-rich:last-child {margin-bottom:0;}

.dd-link-rich:hover {background:#F0F5FF;}

.dd-icon {width:36px;height:36px;min-width:36px;border:1px solid #E5E7EB;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#374151;transition:background .15s,color .15s,border-color .15s;}

.dd-link-rich:hover .dd-icon {background:var(--cobalt);color:#fff;border-color:var(--cobalt);}

.dd-link-label {font-size:.8125rem;font-weight:600;color:#111;line-height:1.3;}

.dd-link-desc {font-size:.7rem;color:#6B7280;margin-top:.125rem;line-height:1.35;}

.dd-chev {transition:transform .2s cubic-bezier(.34,1.56,.64,1);}

.dropdown.is-open .dd-chev {transform:rotate(180deg);}

.price-card.featured {border-color:var(--cobalt);box-shadow:0 8px 32px rgba(37,99,235,.15);}

.btn-outline-white {display:inline-block;background:transparent;color:#fff !important;font-weight:500;border:1.5px solid rgba(255,255,255,.35);border-radius:8px;text-decoration:none;transition:border-color .15s,background .15s;}

.btn-outline-white:hover {border-color:#fff;background:rgba(255,255,255,.08);}

.feat-card {border:1.5px solid #E5E7EB;border-radius:16px;padding:1.75rem;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s cubic-bezier(.34,1.56,.64,1);}

.feat-card:hover {border-color:var(--cobalt-light);box-shadow:0 8px 32px rgba(37,99,235,.1);transform:translateY(-2px);}

.feat-icon {width:48px;height:48px;border-radius:12px;background:var(--sky);display:flex;align-items:center;justify-content:center;margin-bottom:1rem;}

.faq-item {border-bottom:1px solid #E5E7EB;}

.faq-item:last-child {border-bottom:none;}

.faq-btn {width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:1.25rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;font-family:'Outfit',sans-serif;font-weight:700;font-size:1rem;color:#111;}

.faq-answer {display:none;padding-bottom:1.25rem;color:#4B5563;font-size:.9375rem;line-height:1.75;}

.faq-item.open .faq-answer {display:block;}

.faq-item.open .faq-icon {transform:rotate(45deg);}

.faq-icon {transition:transform .2s;flex-shrink:0;}

/* ============================================================
   HARMONIZED — selectors that drifted slightly between pages,
   unified here into one shared definition.
   ============================================================ */

:root { --navy:#1E3A8A; --cobalt:#2563EB; --cobalt-light:#60A5FA; --sky:#EEF3FF; --dark:#0C0F1A; }

.dropdown-menu { position:absolute; top:calc(100% + 14px); left:50%; transform:translateX(-50%); background:#fff; border:1px solid #E5E7EB; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,.12),0 6px 16px rgba(0,0,0,.06); min-width:540px; padding:1.75rem; display:none; z-index:100; gap:1.75rem; }
.dropdown-menu {display:flex !important;visibility:hidden;opacity:0;transform:translateY(-10px) translateX(-50%) !important;pointer-events:none;transition:opacity .18s,transform .18s cubic-bezier(.34,1.56,.64,1),visibility 0s .18s;}
.dropdown-menu {min-width:600px !important;padding:1.5rem !important;}

.btn-primary { display:inline-block; background:var(--cobalt); color:#fff !important; font-weight:600; border-radius:8px; text-decoration:none; transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s ease; box-shadow:0 4px 16px rgba(37,99,235,.35),0 1px 4px rgba(37,99,235,.2); }
.btn-primary { background:#0A1628 !important; box-shadow:0 0 0 1px rgba(29,111,255,.3), 0 2px 12px rgba(29,111,255,.18); position:relative; z-index:1; }

.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(37,99,235,.45),0 2px 6px rgba(37,99,235,.2); }
.btn-primary:hover { background:#0F2040 !important; }

.svc-icon { width:48px; height:48px; border-radius:12px; background:var(--sky); display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; transition:background .2s; }

.industry-tag {display:inline-flex;align-items:center;gap:.4rem;background:#F4F7FF;color:var(--cobalt);font-size:.8rem;font-weight:500;padding:.4rem .875rem;border-radius:999px;border:1px solid #DDEAFF;}

.price-card {border:1.5px solid #E5E7EB;border-radius:16px;padding:1.75rem;background:#fff;transition:border-color .2s,box-shadow .2s;}

.check-item {display:flex;align-items:flex-start;gap:.625rem;padding:.4rem 0;}

/* ============================================================
   MOBILE OVERRIDES — shrink buttons for touch density.
   Default inline Tailwind (px-7 py-3.5 text-base) renders ~65px tall
   because of the project's 125% root; cap to 44px on mobile.
   ============================================================ */
@media (max-width:639px) {
  .btn-primary, .btn-outline, .btn-white {
    padding: 12px 18px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    min-height: 48px;
  }
  /* Match input height to button on mobile */
  .form-input {
    padding: 12px 14px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    min-height: 48px;
  }
}

/* Desktop input matches default button height (~65px) */
@media (min-width:640px) {
  .form-input { min-height: 65px; }
}

