/* ============================================================
   VIJIN.AI · Sovereign · section-level backgrounds — CLEARED
   ------------------------------------------------------------
   Per client: sections must be fully transparent so the page's
   deep-navy constellation background shows through everywhere.
   This file no longer adds any background to .sv-sec elements.
   Only card/component-level backgrounds (in other files) remain.
   ============================================================ */

/* Hero text panel: strip frame/shadow/fill → content sits directly
   on the navy background (sovereign page only; shared CSS untouched). */
.svx [data-seg="sovereign"] .sv-maphero-panel{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
/* hero eyebrow: strip its pill bg/border/shadow too (hero only) */
.svx [data-seg="sovereign"] .sv-maphero-panel .sv-eyebrow{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding-inline:0 !important;
}
/* hero chips: strip pill bg/border/shadow (hero only) */
.svx [data-seg="sovereign"] .sv-maphero-panel .sv-chip{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding-inline:0 !important;
}
/* UNIFY page background to cyan/blue (sky→sea) — DARK THEME ONLY,
   so the light theme keeps its mandatory cream background. FIXED so the
   footer shows the exact same background tone as the rest of the page. */
[data-theme="dark"].svx [data-seg="sovereign"]{
  background:radial-gradient(125% 96% at 50% -8%,#0c5d54 0%,#084a42 27%,#073a33 50%,#06231f 74%,#041713 100%) fixed !important;
}
/* LIGHT THEME: cream background is a hard requirement (non-negotiable) */
[data-theme="light"].svx [data-seg="sovereign"]{
  background:linear-gradient(180deg,#fbf6e9 0%,#f6efda 50%,#f1e7c9 100%) fixed !important;
}
[data-theme="light"].svx [data-seg="sovereign"] .sv-maphero-panel{
  background:transparent !important;
}
/* calm the violet/warm scene specks */
.svx [data-seg="sovereign"] .sv-scene{opacity:.5 !important;}
/* recolor the orange capital marker on the map to the cool palette */
.svx [data-seg="sovereign"] .sv-maphero-map [fill="#feb602"]{fill:#4aa0e8 !important;}
.svx [data-seg="sovereign"] .sv-maphero-map [stroke="#feb602"]{stroke:#4aa0e8 !important;}
/* per client: remove the soft glow rect behind the map + the map's centre fill */
.svx [data-seg="sovereign"] .sv-maphero-map [fill="url(#svmGlow)"]{display:none !important;}
.svx [data-seg="sovereign"] .sv-maphero-map [fill="url(#svmFill)"]{fill:none !important;}
/* per client: remove the silk aurora ribbon entirely (hero bottom + footer) */
.svx [data-seg="sovereign"] .sv-aura,
.svx [data-seg="sovereign"] .sv-foot-aura{display:none !important;}

/* Cohesive CYAN→BLUE aurora only — ZERO violet/purple (hard rule).
   Sovereign palette is cyan + blue, nothing else. */
.svx [data-seg="sovereign"] .sv-aura #svAuA stop:nth-child(1){stop-color:#17d1c6 !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuA stop:nth-child(2){stop-color:#2aa6e2 !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuA stop:nth-child(3){stop-color:#2f7fd4 !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuA stop:nth-child(4){stop-color:#285fbe !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuB stop:nth-child(1){stop-color:#2ee6d6 !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuB stop:nth-child(2){stop-color:#2aa6e2 !important;}
.svx [data-seg="sovereign"] .sv-aura #svAuB stop:nth-child(3){stop-color:#2f7fd4 !important;}

/* ---- FOOTER aurora: keep the ribbon lines, recolour to cyan→blue to
   match the page, and drop the washed-out screen-blend transparency
   that made it look muddy. Sovereign page only. ---- */
.svx [data-seg="sovereign"] .sv-foot-aura .sv-aura-svg{
  mix-blend-mode:normal !important;
  opacity:1 !important;
}
/* svFA gradient (4 stops): mauve/violet/teal/red → cyan/sky/blue */
.svx [data-seg="sovereign"] .sv-foot-aura #svFA stop:nth-child(1){stop-color:#17d1c6 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura #svFA stop:nth-child(2){stop-color:#2aa6e2 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura #svFA stop:nth-child(3){stop-color:#2f7fd4 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura #svFA stop:nth-child(4){stop-color:#285fbe !important;}
/* svFB gradient (3 stops): teal/violet/pink → cyan/sky/blue */
.svx [data-seg="sovereign"] .sv-foot-aura #svFB stop:nth-child(1){stop-color:#2ee6d6 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura #svFB stop:nth-child(2){stop-color:#2aa6e2 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura #svFB stop:nth-child(3){stop-color:#2f7fd4 !important;}
/* make the visible strokes solid (no faint wash) */
.svx [data-seg="sovereign"] .sv-foot-aura path[stroke="url(#svFA)"]{opacity:1 !important;}
.svx [data-seg="sovereign"] .sv-foot-aura path[stroke="url(#svFB)"]{opacity:.9 !important;}

/* FOOTER = EXACTLY the page background, nothing else (hard rule):
   fully transparent, no gradient, no slab — the fixed page background
   shows through identically to the rest of the page. */
.svx [data-seg="sovereign"] .sv-foot,
.svx [data-seg="sovereign"] .lp-foot.sv-foot-glow,
[data-theme="dark"].svx [data-seg="sovereign"] .lp-foot.sv-foot-glow,
[data-theme="light"].svx [data-seg="sovereign"] .lp-foot.sv-foot-glow{
  background:transparent !important;
  border-top:none !important;
}

/* ============================================================
   HERO REFINEMENTS (per client review) — sovereign only.
   Calmer, more sovereign-mature hero: softer waves, lighter top
   band, clearer paragraph, decluttered map, indicator-style rail,
   tidier feature chips, short-screen safety. Reversible via `svx`.
   ============================================================ */

/* 1 · Bottom waves: ~35% shorter, fewer competing layers */
.svx [data-seg="sovereign"] .sv-aura{height:152px !important;bottom:-14px !important;}
.svx [data-seg="sovereign"] .sv-aura path[stroke="#eaf0ff"]{display:none !important;}     /* drop thin highlight line */
.svx [data-seg="sovereign"] .sv-aura g[filter] path{stroke-width:46 !important;}          /* slimmer glow band */

/* 2 · Top sky band / map glow: dial back so it doesn't compete */
.svx [data-seg="sovereign"] .sv-maphero-map{
  filter:drop-shadow(0 0 16px rgba(23,209,198,.14)) !important;
  opacity:.82 !important;
}
.svx [data-seg="sovereign"] .sv-maphero-map [fill="url(#svmGlow)"]{opacity:.5 !important;}
.svx [data-seg="sovereign"] .sv-scene{opacity:.42 !important;}

/* 3 · Description: higher contrast, narrower measure, airier leading */
[data-theme="dark"].svx [data-seg="sovereign"] .sv-maphero-panel .sv-lead{
  color:#e4edf8 !important;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .sv-lead{
  max-width:46ch !important;
  line-height:1.85 !important;
}

/* 4 · Map declutter: fainter net, dimmer secondary dots, calmer centre */
.svx [data-seg="sovereign"] .sv-maphero-map .svm-net{opacity:.18 !important;}
.svx [data-seg="sovereign"] .sv-maphero-map circle[fill="#7fe7e0"]{opacity:.55 !important;}
.svx [data-seg="sovereign"] .sv-maphero-map circle[fill="#17d1c6"][opacity=".1"]{opacity:.04 !important;}
.svx [data-seg="sovereign"] .sv-maphero-map .svm-cap-ring{display:none !important;}        /* remove pulsing "target" */

/* 5 · Rail = capability indicators, not buttons (decorative: pointer-events:none) */
.svx [data-seg="sovereign"] .sv-rail-item,
[data-theme="dark"].svx [data-seg="sovereign"] .sv-rail-item,
[data-theme="light"].svx [data-seg="sovereign"] .sv-rail-item{
  padding:5px 4px !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  font-size:12.5px !important;
  font-weight:600 !important;
  gap:9px !important;
}
.svx [data-seg="sovereign"] .sv-rail-item.on,
[data-theme="dark"].svx [data-seg="sovereign"] .sv-rail-item.on,
[data-theme="light"].svx [data-seg="sovereign"] .sv-rail-item.on{
  background:transparent !important;border:none !important;color:var(--head) !important;
}

/* 6 · Feature chips: more spacing, smaller tick, aligned to text start */
.svx [data-seg="sovereign"] .sv-chips{
  gap:14px 20px !important;
  justify-content:flex-start !important;
  margin-top:26px !important;
}
.svx [data-seg="sovereign"] .sv-chip svg{width:12px !important;height:12px !important;}

/* 7 · Breathing room so the next section's header isn't crowding the hero */
.svx [data-seg="sovereign"] .sv-maphero-in{padding-bottom:104px !important;}

/* 8 · Short-screen safety (laptops ~768–900px tall): fit content, not decor */
@media(max-height:860px){
  .svx [data-seg="sovereign"] .sv-maphero{min-height:auto !important;}
  .svx [data-seg="sovereign"] .sv-maphero-in{padding-top:40px !important;padding-bottom:72px !important;}
  .svx [data-seg="sovereign"] .sv-aura{height:120px !important;}
}

/* ============================================================
   HERO · design-engineering polish pass (sovereign only)
   Hierarchy · spacing · contrast · buttons · micro-motion · quality.
   Fast & restrained — no heavy effects, no slow easing.
   ============================================================ */

/* — Panel rhythm: tighter, more intentional vertical spacing — */
.svx [data-seg="sovereign"] .sv-maphero-panel{padding:36px 34px !important;}
.svx [data-seg="sovereign"] .sv-maphero-panel > .sv-eyebrow{margin-bottom:18px;line-height:1.5;}
.svx [data-seg="sovereign"] .sv-maphero-panel h1{margin:0 0 16px;letter-spacing:-.015em;line-height:1.18;}
.svx [data-seg="sovereign"] .sv-maphero-panel .sv-cta-row{margin-top:30px;gap:12px;}

/* — Buttons: crisp, fast, tactile (≤180ms), cohesive cyan depth — */
.svx [data-seg="sovereign"] .sv-maphero-panel .btn{
  height:46px;padding:0 22px;border-radius:12px;font-weight:600;
  transition:transform .16s cubic-bezier(.2,.7,.2,1), box-shadow .16s ease, background .16s ease, border-color .16s ease;
  will-change:transform;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .btn-primary{
  box-shadow:0 10px 26px -14px rgba(23,209,198,.6), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px -14px rgba(23,209,198,.72), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .btn:not(.btn-primary){
  border-color:color-mix(in oklab,var(--cyan) 30%,transparent) !important;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .btn:not(.btn-primary):hover{
  transform:translateY(-2px);
  border-color:color-mix(in oklab,var(--cyan) 55%,transparent) !important;
  background:color-mix(in oklab,var(--cyan) 9%,transparent) !important;
}
.svx [data-seg="sovereign"] .sv-maphero-panel .btn:active{transform:translateY(0);}
/* Keyboard focus: clear, accessible ring (cyan) — not shown on mouse click */
.svx [data-seg="sovereign"] .sv-maphero-panel .btn:focus-visible,
.svx [data-seg="sovereign"] .sv-rail-item:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px var(--bg-4), 0 0 0 4px var(--cyan), 0 10px 26px -14px rgba(23,209,198,.6);
}

/* — Trust chips: quiet, aligned markers (not a stray centred row) — */
.svx [data-seg="sovereign"] .sv-chips{
  max-width:none !important;gap:10px 18px !important;margin-top:24px !important;
  padding-top:20px;border-top:1px solid color-mix(in oklab,var(--cyan) 14%,transparent);
}
.svx [data-seg="sovereign"] .sv-chip{
  padding:0 !important;border:none !important;background:transparent !important;
  color:var(--t2) !important;font-size:12.5px !important;gap:6px !important;
}
.svx [data-seg="sovereign"] .sv-chip svg{color:var(--cyan) !important;opacity:.95;}

/* — Micro-motion: fast staggered entrance on load (reduced-motion safe) — */
@media(prefers-reduced-motion:no-preference){
  .svx [data-seg="sovereign"] .sv-maphero-panel > *{animation:svHeroIn .5s cubic-bezier(.2,.7,.2,1) both;}
  .svx [data-seg="sovereign"] .sv-maphero-panel > .sv-eyebrow{animation-delay:.04s;}
  .svx [data-seg="sovereign"] .sv-maphero-panel > h1{animation-delay:.10s;}
  .svx [data-seg="sovereign"] .sv-maphero-panel > .sv-lead{animation-delay:.16s;}
  .svx [data-seg="sovereign"] .sv-maphero-panel > .sv-cta-row{animation-delay:.22s;}
  .svx [data-seg="sovereign"] .sv-maphero-panel > .sv-chips{animation-delay:.28s;}
  .svx [data-seg="sovereign"] .sv-rail-item{animation:svHeroIn .5s cubic-bezier(.2,.7,.2,1) both;}
  .svx [data-seg="sovereign"] .sv-rail-item:nth-child(1){animation-delay:.30s;}
  .svx [data-seg="sovereign"] .sv-rail-item:nth-child(2){animation-delay:.36s;}
  .svx [data-seg="sovereign"] .sv-rail-item:nth-child(3){animation-delay:.42s;}
  .svx [data-seg="sovereign"] .sv-rail-item:nth-child(4){animation-delay:.48s;}
  .svx [data-seg="sovereign"] .sv-rail-item:nth-child(5){animation-delay:.54s;}
}
@keyframes svHeroIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* Hide the (decorative) capability rail earlier so it never overlaps the
   text panel on tablet / short-laptop widths (920–1100px gap). */
@media(max-width:1100px){
  .svx [data-seg="sovereign"] .sv-maphero-rail{display:none !important;}
}

/* ============================================================
   WHOLE-PAGE POLISH (sovereign only) — consistent micro-interactions,
   accessible focus states, and one restrained per-section scroll reveal.
   Identity intact; protected sections only gain motion/focus, no redesign.
   ============================================================ */

/* Accessible keyboard-focus rings page-wide */
.svx [data-seg="sovereign"] .sv-sec .btn:focus-visible,
.svx [data-seg="sovereign"] .sv-contact .btn:focus-visible,
.svx [data-seg="sovereign"] .sv-form .btn:focus-visible,
.svx [data-seg="sovereign"] .sv-form input:focus-visible,
.svx [data-seg="sovereign"] .sv-form select:focus-visible,
.svx [data-seg="sovereign"] .sv-form textarea:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px var(--bg-4), 0 0 0 4px color-mix(in oklab,var(--cyan) 80%,transparent);
}

/* Section CTAs: same fast, tactile feel as the hero */
.svx [data-seg="sovereign"] .sv-sec .btn-primary,
.svx [data-seg="sovereign"] .sv-form .btn,
.svx [data-seg="sovereign"] .sv-ctaband .btn{
  transition:transform .16s cubic-bezier(.2,.7,.2,1), box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.svx [data-seg="sovereign"] .sv-sec .btn-primary:hover,
.svx [data-seg="sovereign"] .sv-ctaband .btn-primary:hover{transform:translateY(-2px);}
.svx [data-seg="sovereign"] .sv-sec .btn:active,
.svx [data-seg="sovereign"] .sv-form .btn:active{transform:translateY(0);}

/* Consistent, fast transition baseline on cards across sections */
.svx [data-seg="sovereign"] .sv-card,
.svx [data-seg="sovereign"] .sv-plan,
.svx [data-seg="sovereign"] .sv-sphere,
.svx [data-seg="sovereign"] .sv-uc-item{
  transition:transform .18s cubic-bezier(.2,.7,.2,1), border-color .18s ease, box-shadow .18s ease;
}

/* One restrained scroll-reveal per section — JS adds .rv-pending/.rv-in.
   Without JS (or with reduced-motion) sections stay fully visible. */
@media(prefers-reduced-motion:no-preference){
  .svx [data-seg="sovereign"] .sv-sec.rv-pending{opacity:0;transform:translateY(16px);}
  .svx [data-seg="sovereign"] .sv-sec.rv-in{
    opacity:1;transform:none;
    transition:opacity .5s ease, transform .55s cubic-bezier(.2,.7,.2,1);
  }
}

/* ============================================================
   HEADER polish (sovereign only) — fast, consistent nav interaction
   + accessible keyboard focus. Header→Footer pass complete.
   ============================================================ */
.svx [data-seg="sovereign"] .lp-links > a,
.svx [data-seg="sovereign"] .dd-trigger,
.svx [data-seg="sovereign"] .lp-ctl .icon-btn,
.svx [data-seg="sovereign"] .lp-ctl .btn{
  transition:color .16s ease, background .16s ease, border-color .16s ease, transform .16s cubic-bezier(.2,.7,.2,1), box-shadow .16s ease;
}
.svx [data-seg="sovereign"] .lp-links > a:active,
.svx [data-seg="sovereign"] .dd-trigger:active{transform:translateY(0);}
.svx [data-seg="sovereign"] .lp-links > a:focus-visible,
.svx [data-seg="sovereign"] .dd-trigger:focus-visible,
.svx [data-seg="sovereign"] .lp-ctl .icon-btn:focus-visible,
.svx [data-seg="sovereign"] .lp-ctl .btn:focus-visible,
.svx [data-seg="sovereign"] .dd-panel a:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px color-mix(in oklab,var(--cyan) 80%,transparent);
}
/* dropdown items: quiet, fast hover feedback */
.svx [data-seg="sovereign"] .dd-panel a{transition:background .15s ease, color .15s ease;}

/* ============================================================
   CLIENT NOTES — hero rail as dashboard tiles + chips above line
   ============================================================ */
/* #1 + #2 · Hero side rail → compact dashboard tiles (icon + label) */
.svx [data-seg="sovereign"] .sv-maphero-rail{gap:10px !important;}
.svx [data-seg="sovereign"] .sv-rail-item,
[data-theme="dark"].svx [data-seg="sovereign"] .sv-rail-item,
[data-theme="light"].svx [data-seg="sovereign"] .sv-rail-item{
  padding:10px 14px !important;
  border:1px solid color-mix(in oklab,var(--cyan) 24%,transparent) !important;
  border-radius:12px !important;
  background:color-mix(in oklab,var(--bg-4) 40%,transparent) !important;
  -webkit-backdrop-filter:blur(7px) !important;
  backdrop-filter:blur(7px) !important;
  font-size:12.5px !important;
  font-weight:600 !important;
  gap:10px !important;
  box-shadow:0 8px 22px -16px rgba(0,0,0,.7) !important;
  transition:border-color .16s ease, background .16s ease, transform .16s cubic-bezier(.2,.7,.2,1) !important;
}
[data-theme="dark"].svx [data-seg="sovereign"] .sv-rail-item.on,
[data-theme="light"].svx [data-seg="sovereign"] .sv-rail-item.on{
  border-color:color-mix(in oklab,var(--cyan) 46%,transparent) !important;
  background:color-mix(in oklab,var(--cyan) 13%,transparent) !important;
  color:var(--head) !important;
}
.svx [data-seg="sovereign"] .sv-rail-item:hover{
  transform:translateY(-2px) !important;
  border-color:color-mix(in oklab,var(--cyan) 50%,transparent) !important;
}

/* #6 · Trust chips: divider sits UNDER the chips so text reads above the line */
.svx [data-seg="sovereign"] .sv-chips{
  border-top:none !important;
  border-bottom:1px solid color-mix(in oklab,var(--cyan) 16%,transparent) !important;
  padding-top:0 !important;
  padding-bottom:18px !important;
  margin-top:22px !important;
}
