/* ===============================
   NexTA - Services Section
   White Glass Marble Style
=============================== */

.services-section {
  padding: clamp(45px, 6vw, 25px) 20px;
  background: linear-gradient(180deg, #fafbff 0%, #f4f6fb 50%, #eef1f7 100%);
  position: relative;
  overflow: hidden;
  z-index: 1;

  /* Subtle marble texture overlay */
  background-image: 
    radial-gradient(circle at 20% 30%, rgba(255,255,255,0.6) 0%, transparent 70%),
    radial-gradient(circle at 80% 70%, rgba(255,255,255,0.45) 0%, transparent 60%),
    linear-gradient(145deg, rgba(255,255,255,0.2), rgba(240,240,245,0.2));
  background-blend-mode: overlay;
}

/* Section title */
.services-section .section-title {
  display: block;
  text-align: center;
  margin-bottom: 64px;
}
.services-section .section-title span {
  display: inline-block;
  padding: 0 44px;
  font-size: clamp(28px, 2.5vw, 38px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.5px;

  background: linear-gradient(90deg, #6a4ee6 0%, #af2cee 50%, #03bb7c 100%);
  background-size: 240% 100%;
  background-position: center;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  -webkit-text-stroke: 0.3px rgba(0, 0, 0, 0.1);
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15));
}

/* ===============================
   Layout
=============================== */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 44px;
  max-width: 1280px;
  margin: 0 auto;
}

/* ===============================
   Service Card (Glass Marble)
=============================== */
.service-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;

  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(28px) saturate(200%) brightness(1.05);
  border-radius: 24px;
  padding: 46px 34px;
  max-width: 360px;
  margin: 0 auto;
  height: 100%;

  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow:
    0 12px 28px rgba(15, 23, 42, 0.08),
    inset 0 1px 4px rgba(255,255,255,0.7);

  text-align: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;

  /* Subtle marble vein texture */
  background-image: 
    linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(245,245,250,0.25) 100%),
    url("https://www.transparenttextures.com/patterns/marble.png"); /* optional */
  background-size: cover;
  background-blend-mode: overlay;
}

.service-card:hover {
  transform: translateY(-10px) scale(1.03);
  box-shadow:
    0 24px 48px rgba(15, 23, 42, 0.15),
    0 8px 20px rgba(0,0,0,0.08),
    inset 0 1px 6px rgba(255,255,255,0.5);
  border-color: rgba(123, 82, 255, 0.35);
}

/* ===============================
   Image Area
=============================== */
.service-card .image-wrap {
  width: 100%;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 28px;
  position: relative;
  overflow: hidden;

  background: linear-gradient(145deg, #ffffff, #f7f7fb);
  border-radius: 16px;
  padding: 18px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.04);
}

.service-card .image-wrap img {
  object-fit: contain;
  display: block;
  height: auto;
  width: auto;
  max-height: 100%;
  max-width: 100%;
  position: relative;
  z-index: 0;
}

/* Shine effect */
.service-card .image-wrap::before {
  content: "";
  position: absolute;
  top: -80%;
  left: -80%;
  width: 60%;
  height: 260%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.9) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: rotate(25deg);
  z-index: 1;
  animation: imageShine 3s ease-in-out infinite;
  opacity: 0;
}
@keyframes imageShine {
  0% { transform: translateX(-120%) rotate(25deg); opacity: 0; }
  10% { opacity: 1; }
  20% { transform: translateX(120%) rotate(25deg); opacity: 0; }
  100% { opacity: 0; }
}

/* ===============================
   Icon (Gem-like)
=============================== */
.service-card .icon-wrap {
  width: 88px;
  height: 88px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 22px auto;
  background: linear-gradient(145deg, #ffffff, #f3f3f8);
  box-shadow:
    0 6px 16px rgba(0,0,0,0.08),
    inset 0 2px 8px rgba(255,255,255,0.9);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.service-card:hover .icon-wrap {
  transform: scale(1.08);
  box-shadow:
    0 14px 28px rgba(123,82,255,0.18),
    0 0 0 6px rgba(175,44,238,0.1);
}
.service-icon {
  width: 52px;
  height: 52px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.2));
  transition: transform 0.35s ease, filter 0.35s ease;
}
.service-card:hover .service-icon {
  transform: scale(1.12);
  filter: drop-shadow(0 3px 10px rgba(0,0,0,0.28));
}

/* ===============================
   Per-service illustration tweaks
=============================== */
.exec-img { transform: scale(1.4) translateY(5px); }
.market-img { transform: scale(1.8) translateY(10px); }
.rpo-img { transform: scale(1.8) translateY(10px); }

/* ===============================
   Text
=============================== */
.service-card h3 {
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 1.25rem;
  color: #090e30;
}
.service-card p {
  flex-grow: 1;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #2d2d2d;
  max-width: 36ch;
  margin: 0 auto;
}

/* ===============================
   Mobile
=============================== */
@media (max-width: 767px) {
  .service-card .image-wrap {
    height: 140px;
    padding: 12px;
  }

  .exec-img { transform: scale(0.9); }
  .market-img { transform: scale(1.2) translateY(-8px); }
  .rpo-img { transform: scale(1.0) translateY(5px); }

  .services-section .section-title span {
    padding: 0 18px;
    font-size: clamp(22px, 5vw, 28px);
  }
}
/* ===============================
   Mobile Performance Optimizations
=============================== */
@media (max-width: 767px) {
  /* Disable backdrop-filter on cards (fallback to plain white) */
  .service-card {
    backdrop-filter: none;
    background: #ffffff;
  }

  /* Remove infinite shine animation on small devices */
  .service-card .image-wrap::before {
    animation: none;
    opacity: 0; /* keep it invisible */
  }

  /* Use lighter shadows for mobile */
  .service-card,
  .service-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  }
}
/* ==========================================================
   NEXTA — EXECUTIVE SEARCH PAGE
   ========================================================== */
/* ============================================================
   NexTA — Executive Search Page (scoped)
   Add to: assets/css/nx-services.css
   ============================================================ */

/* ============================================================
   [NX SERVICE] EXECUTIVE SEARCH PAGE — Premium Luxury Design
   ============================================================ */
/* =====================================================================
   NEXtA — EXEC SECTION (standalone, no external deps)
   Scope: #nx-exec-service only
   Includes:
   - Hero Prism (aurora spin behind chips, mobile-safe)
   - Capability Ribbons (mirror glass)
   - Core + Industries spacing
   - Token definitions + safe resets
   ===================================================================== */

/* ---- Local tokens + safe reset (scoped) ---- */
#nx-exec-service {
  /* Brand tokens */
  --ex-g1:#6a4ee6;
  --ex-g2:#af2cee;
  --ex-ink:#0b1220;
  --ex-muted:#6b7280;

  /* Surfaces */
  --ex-glass: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,248,252,.92));
  --ex-shadow: 0 18px 44px rgba(10,12,20,.10);
}

#nx-exec-service * { box-sizing:border-box; }

/* =====================================================================
   HERO PRISM — brand 3D orbit stage
   Namespace: nx-execprism-*
   ===================================================================== */
#nx-exec-service .nx-execprism-hero{
  /* keep hero-local shorthands for gradients */
  --g1: var(--ex-g1);
  --g2: var(--ex-g2);
  --ink: var(--ex-ink);
  --muted: var(--ex-muted);

  margin-top:calc(var(--header-offset,92px) + 76px);
  background:#fff;
  border-radius:24px;
  border:1px solid rgba(10,12,20,.06);
  box-shadow:0 24px 60px rgba(10,12,20,.06);
  padding:76px 56px;
  isolation:isolate;
  margin-bottom:86px; /* extra space so it doesn’t merge with next section */
}

#nx-exec-service .nx-execprism-inner{
  display:grid; grid-template-columns:1.22fr .78fr;
  gap:52px; align-items:start;
}

/* LEFT copy */
#nx-exec-service .nx-execprism-eyebrow{
  text-transform:uppercase; font-weight:900;
  font-size:12px; letter-spacing:.14em;
  color:var(--g1); margin-bottom:8px;
}
#nx-exec-service .nx-execprism-title{
  margin:0 0 14px; color:var(--ink);
  font-size:clamp(2rem,5vw,3.3rem); font-weight:900; max-width:580px;
}
#nx-exec-service .nx-execprism-lead{
  color:var(--muted); margin:0 0 10px; line-height:1.68; max-width:610px;
}

/* CTA (scoped so other CTAs are safe) */
#nx-exec-service .nx-execprism-cta{ margin-top:20px; }
#nx-exec-service .nx-execprism-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 26px; border-radius:14px;
  background:linear-gradient(90deg,var(--g1),var(--g2));
  text-decoration:none; color:#fff; font-weight:900;
  box-shadow:0 20px 50px rgba(106,78,230,.25);
  transition:transform .2s ease, box-shadow .2s ease;
}
#nx-exec-service .nx-execprism-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 26px 62px rgba(106,78,230,.28);
}

/* ---- PRISM STAGE ---- */
#nx-exec-service .nx-execprism-right{ position:relative; }
#nx-exec-service .nx-execprism-stage{
  height:320px; position:relative;
  perspective:700px; transform-style:preserve-3d;
  overflow:visible; z-index:1;
}

/* Ambient bloom behind the aurora */
#nx-exec-service .nx-execprism-bloom{
  position:absolute; left:50%; top:70%;
  width:420px; height:220px; transform:translate(-50%,-50%);
  background:
    radial-gradient(50% 40% at 50% 50%, rgba(106,78,230,.22), transparent 60%),
    radial-gradient(38% 38% at 40% 60%, rgba(175,44,238,.18), transparent 62%);
  opacity:.42; pointer-events:none; z-index:0;
}

/* AURORA CORE (no disk, pure light) */
#nx-exec-service .nx-execprism-core{
  position:absolute; left:50%; top:50%;
  width:140px; height:140px;
  transform:translate(-50%,-50%);
  animation: core-breathe 5.2s ease-in-out infinite alternate;
  z-index:2; pointer-events:none;
  /* hard kill of any stray surfaces */
  background:none !important; border:none !important; box-shadow:none !important;
  -webkit-mask-image:none !important; mask-image:none !important;
}

/* spinning light only */
#nx-exec-service .nx-execprism-core .spin{
  position:absolute; inset:-55%;
  border-radius:50%;
  background: conic-gradient(
    from 0deg,
    rgba(106,78,230,.55),
    rgba(175,44,238,.35),
    rgba(106,78,230,.10),
    rgba(175,44,238,.45)
  );
  mix-blend-mode:screen;
  filter: blur(18px);
  opacity:.70;
  animation: prismSpin 10.5s linear infinite;
  /* feather the edges so it never looks like a circle */
  -webkit-mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,.85) 0%, rgba(0,0,0,.65) 42%, rgba(0,0,0,.25) 60%, rgba(0,0,0,0) 100%);
          mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,.85) 0%, rgba(0,0,0,.65) 42%, rgba(0,0,0,.25) 60%, rgba(0,0,0,0) 100%);
}
@keyframes prismSpin { from{transform:rotate(0)} to{transform:rotate(360deg)} }
@keyframes core-breathe{
  0%{ transform:translate(-50%,-50%) scale(1); }
  100%{ transform:translate(-50%,-50%) scale(1.05); }
}

/* Ground glow for depth */
#nx-exec-service .nx-execprism-stage::after{
  content:"";
  position:absolute; left:50%; bottom:-6px;
  width:180px; height:30px; transform:translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(106,78,230,.18) 0%, rgba(0,0,0,0) 70%);
  filter: blur(8px); opacity:.45; z-index:0; pointer-events:none;
}

/* Floating chips (gentle vertical hover only) */
#nx-exec-service .nx-execprism-chip{
  position:absolute; z-index:3;
  width:220px; padding:12px 14px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(10,12,20,.06);
  border-radius:16px !important; /* defend against global card radius */
  box-shadow:0 14px 34px rgba(10,12,20,.10);
  font-size:.9rem;
  transform:translateY(0) rotate(var(--rot,0deg));
  animation: chipHover 3.8s ease-in-out infinite alternate;
}
@keyframes chipHover{
  0%   { transform: translateY(0) rotate(var(--rot)); }
  100% { transform: translateY(-8px) rotate(var(--rot)); }
}
#nx-exec-service .nx-execprism-chip h4{
  margin:0 0 4px; font-weight:800; font-size:.96rem; color:var(--ex-ink);
}
#nx-exec-service .nx-execprism-chip p{
  margin:0; font-size:.84rem; color:var(--ex-muted);
}

/* Chip coordinates */
#nx-exec-service .nx-execprism-chip.a{ top:30px;  left:220px; --rot:-1deg; }
#nx-exec-service .nx-execprism-chip.b{ top:110px; left:60px;  --rot:0deg; }
#nx-exec-service .nx-execprism-chip.c{ top:190px; left:240px; --rot:-1deg; }
#nx-exec-service .nx-execprism-chip.d{ top:250px; left:80px;  --rot:0deg; }

/* Method cards (unchanged, but scoped) */
#nx-exec-service .nx-execprism-spacer{ height:26px; }
#nx-exec-service .nx-execprism-method{ display:grid; gap:14px; }
#nx-exec-service .nx-execprism-method-item{
  position:relative; background:#fff;
  border:1px solid rgba(10,12,20,.06); border-radius:14px;
  padding:16px 16px 14px 46px; box-shadow:0 12px 30px rgba(10,12,20,.06);
}
#nx-exec-service .nx-execprism-method-item::before{
  content:""; position:absolute; left:16px; top:16px;
  width:12px; height:12px; border-radius:6px;
  background:linear-gradient(90deg,var(--ex-g1),var(--ex-g2));
  box-shadow:0 0 12px rgba(106,78,230,.30);
}

/* =====================================================================
   RESPONSIVE — Prism Hero stacking & chip tightening
   ===================================================================== */
@media (max-width: 960px){
  #nx-exec-service .nx-execprism-inner{
    grid-template-columns:1fr; gap:42px;
  }
  #nx-exec-service .nx-execprism-right{ margin:0 auto; width:100%; max-width:380px; }
  #nx-exec-service .nx-execprism-stage{ margin:0 auto; }
}
@media (max-width: 680px){
  #nx-exec-service .nx-execprism-hero{ padding:56px 28px; }
  #nx-exec-service .nx-execprism-stage{ height:280px; }
  #nx-exec-service .nx-execprism-chip{ width:200px; }
}
@media (max-width: 540px){
  #nx-exec-service .nx-execprism-chip.a{ top:10px;  left:140px; }
  #nx-exec-service .nx-execprism-chip.b{ top:90px;  left:20px;  }
  #nx-exec-service .nx-execprism-chip.c{ top:160px; left:150px; }
  #nx-exec-service .nx-execprism-chip.d{ top:220px; left:30px;  }
}
@media (max-width: 400px){
  #nx-exec-service .nx-execprism-chip{ width:180px; }
  #nx-exec-service .nx-execprism-stage{ height:250px; }
}

/* =====================================================================
   CAPABILITY RIBBONS — Mirror-Glass Finish (brand purple)
   ===================================================================== */
#nx-exec-service .nx-exec-ribbons{ margin:56px 0 10px; }
#nx-exec-service .nx-exec-ribbons-inner{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px; align-items:stretch;
}
#nx-exec-service .nx-exec-ribbon{
  position:relative; border-radius:16px !important; overflow:hidden;
  min-height:148px; padding:18px 22px;
  background:
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,0) 18%, rgba(0,0,0,.06) 55%, rgba(255,255,255,.08) 100%),
    linear-gradient(90deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 22%, rgba(0,0,0,.06) 50%, rgba(255,255,255,0) 78%, rgba(255,255,255,.18) 100%),
    var(--ex-glass);
  border:1px solid rgba(10,12,20,.08);
  box-shadow:
    0 14px 36px rgba(10,12,20,.10),
    inset 0 1px 0 rgba(255,255,255,.75),
    inset 0 -1px 0 rgba(10,12,20,.06);
  transition:transform .25s cubic-bezier(.25,.9,.3,1), box-shadow .25s ease, filter .25s ease;
  backface-visibility:hidden;
}
#nx-exec-service .nx-exec-ribbon::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(120deg, rgba(106,78,230,.18), rgba(175,44,238,.18));
  mix-blend-mode:soft-light; opacity:.55;
}
#nx-exec-service .nx-exec-ribbon::after{
  content:""; position:absolute; top:-20%; bottom:-20%; width:28%;
  left:-40%; transform:skewX(-18deg); border-radius:24px;
  background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.42) 45%, rgba(255,255,255,0) 100%);
  opacity:0; transition:transform .75s ease, opacity .45s ease;
  will-change:transform,opacity;
}
#nx-exec-service .nx-exec-ribbon:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 56px rgba(106,78,230,.22);
  filter:saturate(1.04);
}
#nx-exec-service .nx-exec-ribbon:hover::after{
  opacity:.85; transform:skewX(-18deg) translateX(240%);
}
#nx-exec-service .nx-exec-ribbon-angle{
  content:""; position:absolute; inset:-20px auto -20px -60px; width:160px; transform:skewX(-18deg);
  background:
    linear-gradient(180deg, rgba(106,78,230,.16), rgba(175,44,238,.16)),
    linear-gradient(90deg, rgba(255,255,255,.35), rgba(255,255,255,0));
  border-right:1px solid rgba(106,78,230,.28);
  pointer-events:none; filter:saturate(1.05);
}
#nx-exec-service .nx-exec-ribbon-title{
  margin:0 0 6px; font-weight:900; font-size:1.06rem; color:var(--ex-ink);
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}
#nx-exec-service .nx-exec-ribbon-desc{
  margin:0; color:var(--ex-muted); line-height:1.6;
}

/* Ribbons grid responsive */
@media (max-width:1000px){
  #nx-exec-service .nx-exec-ribbons-inner{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px){
  #nx-exec-service .nx-exec-ribbons-inner{ grid-template-columns:1fr; }
}

/* =====================================================================
   CORE SECTION (Why organisations choose NexTA)
   ===================================================================== */
#nx-exec-service .nx-exec-core{ margin:72px 0 86px; position:relative; }
#nx-exec-service .nx-exec-core-inner{
  display:grid; grid-template-columns:1fr 320px; gap:22px;
  background:var(--ex-glass);
  border:1px solid rgba(10,12,20,.06); border-radius:20px;
  padding:40px; box-shadow:var(--ex-shadow); overflow:hidden;
}
#nx-exec-service .nx-exec-core-inner::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(106,78,230,.08), rgba(175,44,238,.08));
  mix-blend-mode:overlay; opacity:.25;
}
#nx-exec-service .nx-exec-core-subtitle{ font-weight:900; font-size:1.24rem; margin:0 0 10px; color:var(--ex-ink); }
#nx-exec-service .nx-exec-core-lead{ color:var(--ex-muted); margin:0 0 12px; line-height:1.7; max-width:620px; }
#nx-exec-service .nx-exec-core-benefits{ margin:0; padding-left:18px; line-height:1.6; color:var(--ex-ink); }
#nx-exec-service .nx-exec-core-benefits li{ margin-bottom:8px; }
#nx-exec-service .nx-exec-glass{
  background:#fff; border:1px solid rgba(10,12,20,.06); padding:18px; border-radius:14px;
  text-align:left; box-shadow:0 10px 28px rgba(10,12,20,.08);
}
@media(max-width:960px){
  #nx-exec-service .nx-exec-core-inner{ grid-template-columns:1fr; padding:32px; }
  #nx-exec-service .nx-exec-glass{ max-width:520px; margin:10px auto 0; text-align:center; }
}
@media(max-width:680px){
  #nx-exec-service .nx-exec-core-inner{ padding:28px; }
  #nx-exec-service .nx-exec-core-lead{ font-size:.98rem; }
}
@media(max-width:480px){
  #nx-exec-service .nx-exec-core-inner{ padding:22px; }
  #nx-exec-service .nx-exec-core-lead{ font-size:.94rem; }
}

/* =====================================================================
   INDUSTRIES — spacing & pills
   ===================================================================== */
#nx-exec-service .nx-exec-industries{ margin:64px 0 200px; }
#nx-exec-service .nx-exec-industry-grid{ display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-start; }
#nx-exec-service .nx-pill{
  background:#fff; border:1.4px solid rgba(106,78,230,.18); border-radius:30px; padding:10px 18px;
  font-weight:700; color:#0b1220; transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
#nx-exec-service .nx-pill:hover{
  background:linear-gradient(90deg,var(--ex-g1),var(--ex-g2)); color:#fff;
  box-shadow:0 0 16px rgba(106,78,230,.25); transform:translateY(-2px);
}
@media(max-width:680px){
  #nx-exec-service .nx-exec-industries{ margin-bottom:140px; }
}
@media(max-width:400px){
  #nx-exec-service .nx-exec-industries{ margin-bottom:160px; }
}


/* MARKET INTELLIGENCE — unified w/ site, slight teal accent (minified) */
#nx-market-service{--mi-g1:#6a4ee6;--mi-g2:#af2cee;--mi-ac: #00b3ff;--mi-ink:#0b1220;--mi-muted:#6b7280;--mi-glass:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,248,250,.9));--mi-shadow:0 12px 36px rgba(10,12,20,.08);--mi-radius:18px}
#nx-market-service .nx-mi-wrap{max-width:1280px;margin:0 auto;padding:0 28px;color:var(--mi-ink);font-family:Inter,"Space Grotesk",system-ui,sans-serif}
#nx-market-service .nx-mi-hero{position:relative;border-radius:22px;background:var(--mi-glass);border:1px solid rgba(10,12,20,.05);box-shadow:var(--mi-shadow);margin-top:calc(var(--header-offset,92px) + 32px);padding:64px 48px;overflow:hidden}
#nx-market-service .nx-mi-hero-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:36px}
#nx-market-service .nx-mi-eyebrow{display:inline-block;font-weight:800;font-size:12px;color:var(--mi-g1);text-transform:uppercase;letter-spacing:.14em;margin-bottom:8px}
#nx-market-service .nx-mi-hero-title{font-size:clamp(2rem,4.6vw,3.2rem);font-weight:900;line-height:1.04;margin:0 0 14px;color:var(--mi-ink)}
#nx-market-service .nx-mi-hero-lead{color:var(--mi-muted);margin:0 0 10px;max-width:65ch;font-size:1.05rem}
#nx-market-service .nx-mi-chiprow{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
#nx-market-service .nx-mi-chip{padding:8px 12px;border-radius:999px;font-weight:700;font-size:.82rem;background:linear-gradient(90deg,rgba(106,78,230,.10),rgba(175,44,238,.12));border:1px solid rgba(106,78,230,.18);transition:transform .2s ease,box-shadow .2s ease}
#nx-market-service .nx-mi-chip:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,179,255,.15)}
#nx-market-service .nx-mi-hero-visual{position:relative;height:360px;display:flex;align-items:center;justify-content:center}
#nx-market-service .nx-mi-radar{position:relative;width:360px;height:360px;border-radius:50%;background:radial-gradient(closest-side,rgba(106,78,230,.08),transparent 65%),radial-gradient(circle at 50% 50%,transparent 44%,rgba(0,0,0,.06) 45%,transparent 46%),radial-gradient(circle at 50% 50%,transparent 24%,rgba(0,0,0,.06) 25%,transparent 26%),radial-gradient(circle at 50% 50%,transparent 64%,rgba(0,0,0,.06) 65%,transparent 66%),repeating-conic-gradient(from 0deg,rgba(0,0,0,.05) 0 2deg,transparent 2deg 12deg);overflow:hidden;box-shadow:0 18px 42px rgba(0,0,0,.08),inset 0 0 0 1px rgba(10,12,20,.06)}
#nx-market-service .nx-mi-radar-aura{position:absolute;inset:-12%;border-radius:50%;pointer-events:none;background:radial-gradient(60% 60% at 50% 50%,rgba(106,78,230,.18),rgba(175,44,238,.10) 55%,transparent 70%);filter:blur(8px);opacity:.7}
@media (prefers-reduced-motion:no-preference){
#nx-market-service .nx-mi-radar-sweep{position:absolute;inset:0;background:conic-gradient(from 0deg,rgba(0,179,255,.24),rgba(0,179,255,0) 40%);animation:nx-mi-sweep 6.2s linear infinite;mix-blend-mode:screen;opacity:.85}
#nx-market-service .nx-mi-radar::after{content:"";position:absolute;inset:-20%;border-radius:50%;background:conic-gradient(from 0deg,rgba(106,78,230,.08),rgba(175,44,238,0) 40%);animation:nx-mi-sweep 9.6s linear infinite}
}
@keyframes nx-mi-sweep{to{transform:rotate(1turn)}}
#nx-market-service .nx-mi-dot{position:absolute;width:10px;height:10px;border-radius:50%;background:linear-gradient(180deg,var(--mi-ac),var(--mi-g2));box-shadow:0 0 14px rgba(0,179,255,.45)}
#nx-market-service .nx-mi-dot--a{top:22%;left:62%}
#nx-market-service .nx-mi-dot--b{top:68%;left:30%}
#nx-market-service .nx-mi-dot--c{top:42%;left:18%}
#nx-market-service .nx-mi-mini-card{position:absolute;right:8%;bottom:8%;background:rgba(255,255,255,.75);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(10,12,20,.06);border-radius:12px;padding:10px 12px;box-shadow:0 8px 24px rgba(10,12,20,.08)}
#nx-market-service .nx-mi-mini-title{margin:0 0 6px;font-size:.78rem;color:var(--mi-muted);font-weight:700}
#nx-market-service .nx-mi-spark{width:140px;height:42px;color:var(--mi-g2)}
#nx-market-service .nx-mi-panels{margin:56px 0 18px}
#nx-market-service .nx-mi-panels-inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
#nx-market-service .nx-mi-panel{background:var(--mi-glass);border:1px solid rgba(10,12,20,.06);border-radius:16px;padding:18px;box-shadow:var(--mi-shadow);position:relative;overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-height:160px;transition:transform .28s cubic-bezier(.25,.9,.3,1),box-shadow .28s ease}
#nx-market-service .nx-mi-panel:hover{transform:translateY(-4px);box-shadow:0 16px 46px rgba(106,78,230,.18)}
#nx-market-service .nx-mi-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(106,78,230,.06),rgba(175,44,238,.06));opacity:.35;mix-blend-mode:multiply;pointer-events:none}
#nx-market-service .nx-mi-panel-head{display:grid;grid-template-columns:32px 1fr;align-items:center;gap:10px;margin-bottom:8px}
#nx-market-service .nx-mi-badge{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:.85rem;color:#fff;background:linear-gradient(90deg,var(--mi-g1),var(--mi-g2));box-shadow:0 8px 18px rgba(106,78,230,.28)}
#nx-market-service .nx-mi-panel-title{margin:0;font-size:1.06rem;font-weight:900;color:var(--mi-ink);line-height:1.25}
#nx-market-service .nx-mi-panel-desc{margin:6px 0 0;color:var(--mi-muted);line-height:1.55}
#nx-market-service .nx-mi-method{margin-top:58px}
#nx-market-service .nx-mi-section-title{font-weight:900;font-size:1.28rem;margin:0 0 14px;color:var(--mi-ink)}
#nx-market-service .nx-mi-rail-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:10px 4px 6px;border-radius:12px;border:1px dashed rgba(10,12,20,.06)}
#nx-market-service .nx-mi-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);gap:16px;align-items:stretch;padding:12px 6px;position:relative}
#nx-market-service .nx-mi-rail::before{content:"";position:absolute;left:6px;right:6px;top:22px;height:4px;border-radius:3px;background:linear-gradient(90deg,rgba(106,78,230,.6),rgba(175,44,238,.6));opacity:.35}
#nx-market-service .nx-mi-node{position:relative;background:#fff;border:1px solid rgba(10,12,20,.06);border-radius:14px;padding:18px 16px 16px;box-shadow:0 10px 24px rgba(10,12,20,.06);min-height:120px;transition:transform .25s ease,box-shadow .25s ease}
#nx-market-service .nx-mi-node:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(106,78,230,.18)}
#nx-market-service .nx-mi-node-dot{position:absolute;top:14px;left:12px;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 40% 40%,var(--mi-g2),var(--mi-g1));box-shadow:0 0 14px rgba(0,179,255,.35)}
#nx-market-service .nx-mi-node-title{margin:0 0 6px 26px;font-size:1.02rem;font-weight:900;color:var(--mi-ink)}
#nx-market-service .nx-mi-node-num{display:inline-block;width:22px;height:22px;border-radius:7px;text-align:center;font-size:.8rem;line-height:22px;font-weight:900;color:#fff;margin-right:8px;background:linear-gradient(90deg,var(--mi-g1),var(--mi-g2))}
#nx-market-service .nx-mi-node-desc{margin:0 0 0 26px;color:var(--mi-muted);line-height:1.55}
#nx-market-service .nx-mi-core{margin:70px 0}
#nx-market-service .nx-mi-core-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;background:var(--mi-glass);border:1px solid rgba(10,12,20,.05);border-radius:20px;padding:40px;box-shadow:var(--mi-shadow);position:relative;overflow:hidden}
#nx-market-service .nx-mi-core-inner::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(106,78,230,.08),rgba(175,44,238,.08));mix-blend-mode:overlay;opacity:.25}
#nx-market-service .nx-mi-core-subtitle{font-weight:900;font-size:1.38rem;margin:0 0 14px;color:var(--mi-ink)}
#nx-market-service .nx-mi-list{margin:0;padding-left:18px;color:var(--mi-ink);line-height:1.6}
#nx-market-service .nx-mi-list li{margin-bottom:8px}
#nx-market-service .nx-mi-list--tight{padding-left:18px}
#nx-market-service .nx-mi-list--tight li{margin-bottom:6px}
#nx-market-service .nx-mi-glass-card{background:rgba(255,255,255,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(10,12,20,.05);border-radius:14px;padding:18px 20px;box-shadow:0 10px 28px rgba(10,12,20,.08)}
#nx-market-service .nx-mi-glass-head{margin:0 0 8px;color:var(--mi-muted);font-weight:800}
/* RESPONSIVE */
@media (max-width:1100px){
#nx-market-service .nx-mi-hero-inner{grid-template-columns:1fr}
#nx-market-service .nx-mi-hero-visual{height:300px}
#nx-market-service .nx-mi-radar{width:300px;height:300px}
}
@media (max-width:1000px){
#nx-market-service .nx-mi-panels-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
#nx-market-service .nx-mi-core-inner{grid-template-columns:1fr;padding:28px}
}
@media (max-width:640px){
#nx-market-service .nx-mi-hero{padding:48px 22px}
#nx-market-service .nx-mi-hero-title{font-size:clamp(1.7rem,6.2vw,2.1rem)}
#nx-market-service .nx-mi-chip{font-size:.76rem}
#nx-market-service .nx-mi-rail-wrap{padding:8px 2px 4px}
#nx-market-service .nx-mi-rail{grid-auto-columns:84%}
#nx-market-service .nx-mi-panels-inner{grid-template-columns:1fr}
#nx-market-service .nx-mi-hero{margin-bottom:36px}
}
@media (max-width:420px){
#nx-market-service .nx-mi-mini-card{right:4%;bottom:6%}
#nx-market-service .nx-mi-radar{width:260px;height:260px}
}
/* ACCESSIBILITY */
@media (prefers-reduced-motion:reduce){
#nx-market-service .nx-mi-chip,#nx-market-service .nx-mi-panel,#nx-market-service .nx-mi-node{transition:none!important}
#nx-market-service .nx-mi-radar-sweep,#nx-market-service .nx-mi-radar::after{animation:none!important}
}
/* ==========================================================
   CONTRACT STAFFING — UNIQUE LOOK (Warmer Purple Theme)
   Namespace: #nx-contract-service .nx-cs-*
   - Warmer violet/magenta palette to stay brand-aligned
   - No collisions with other sections
   - Mobile/perf-safe (reduced filters, guarded animations)
   ========================================================== */
#nx-contract-service{
  /* Brand-aligned, slightly warmer purple accent */
  --cs-g1:#6a4ee6;   /* brand violet */
  --cs-g2:#b34bee;   /* warmer magenta */
  --cs-g1-warm:#7a5af8; /* hover lift tint */
  --cs-ink:#0b1220;
  --cs-muted:#6b7280;

  /* Glass + depth */
  --cs-glass:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,248,250,.9));
  --cs-shadow:0 12px 36px rgba(10,12,20,.08);
  --cs-radius:18px;

  /* Subtle diagonal banding (very light, purple-tinted) */
  --cs-stripes:repeating-linear-gradient(
    45deg,
    rgba(106,78,230,.08) 0 10px,
    rgba(179,75,238,.08) 10px 20px
  );

  font-family:Inter,"Space Grotesk",system-ui,sans-serif;
  color:var(--cs-ink);
}

#nx-contract-service .nx-cs-wrap{
  max-width:1280px; margin:0 auto; padding:0 28px;
}

/* ---------------- HERO: ticket stack + ticker ---------------- */
#nx-contract-service .nx-cs-hero{
  position:relative; border-radius:22px; background:var(--cs-glass);
  border:1px solid rgba(10,12,20,.05); box-shadow:var(--cs-shadow);
  margin-top:calc(var(--header-offset,92px) + 32px);
  padding:64px 48px; overflow:hidden;
}
#nx-contract-service .nx-cs-hero::before{
  content:""; position:absolute; inset:-20% -10% -30% -10%;
  background:var(--cs-stripes);
  filter:blur(12px); opacity:.55; pointer-events:none;
}
#nx-contract-service .nx-cs-hero-inner{
  display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:center;
}
#nx-contract-service .nx-cs-eyebrow{
  display:inline-block; font-weight:800; font-size:12px; color:var(--cs-g1);
  text-transform:uppercase; letter-spacing:.14em; margin-bottom:8px;
}
#nx-contract-service .nx-cs-hero-title{
  font-size:clamp(2rem,4.6vw,3.2rem); font-weight:900; line-height:1.04; margin:0 0 12px;
}
#nx-contract-service .nx-cs-hero-lead{
  color:var(--cs-muted); margin:0 0 10px; max-width:65ch; font-size:1.05rem;
}

/* Chips */
#nx-contract-service .nx-cs-chiprow{ margin-top:16px; display:flex; flex-wrap:wrap; gap:8px; }
#nx-contract-service .nx-cs-chip{
  padding:8px 12px; border-radius:999px; font-weight:700; font-size:.82rem;
  background:linear-gradient(90deg, rgba(106,78,230,.10), rgba(179,75,238,.12));
  border:1px solid rgba(106,78,230,.20);
  transition:transform .2s ease, box-shadow .2s ease;
}
#nx-contract-service .nx-cs-chip:hover{
  transform:translateY(-2px); box-shadow:0 8px 18px rgba(106,78,230,.18);
}

/* Ticket stack visual */
#nx-contract-service .nx-cs-hero-visual{
  position:relative; height:360px; display:flex; align-items:center; justify-content:center;
}
#nx-contract-service .nx-cs-ticket{
  position:absolute; width:280px; border-radius:16px; padding:14px 16px;
  background:#fff; border:1px solid rgba(10,12,20,.06);
  box-shadow:0 18px 42px rgba(10,12,20,.08);
  transform-origin:center;
}
#nx-contract-service .nx-cs-ticket--a{ transform:rotate(-6deg) translate(-20px,-26px); }
#nx-contract-service .nx-cs-ticket--b{ transform:rotate(3deg) translate(12px,10px); }
#nx-contract-service .nx-cs-ticket--c{ transform:rotate(9deg) translate(40px,40px); }

#nx-contract-service .nx-cs-ticket-head{
  margin:0 0 4px; font-weight:900; font-size:.98rem; color:var(--cs-ink);
}
#nx-contract-service .nx-cs-ticket-sub{
  margin:0; color:var(--cs-muted); font-size:.86rem;
}

/* subtle scroll float (very light to keep perf) */
@media (prefers-reduced-motion:no-preference){
  #nx-contract-service .nx-cs-ticket{ animation:nx-cs-float 6.5s ease-in-out infinite alternate; will-change:transform; }
  @keyframes nx-cs-float{
    from{ transform:translateY(0) rotate(var(--rot,0deg)); }
    to  { transform:translateY(-8px) rotate(var(--rot,0deg)); }
  }
  #nx-contract-service .nx-cs-ticket--a{ --rot:-6deg; }
  #nx-contract-service .nx-cs-ticket--b{ --rot:3deg; }
  #nx-contract-service .nx-cs-ticket--c{ --rot:9deg; }
}

/* Ticker */
#nx-contract-service .nx-cs-ticker{
  position:absolute; bottom:14px; left:50%; transform:translateX(-50%);
  display:flex; gap:30px; white-space:nowrap; font-weight:800; font-size:.86rem; color:#6a4ee6;
  opacity:.9;
}
@media (prefers-reduced-motion:no-preference){
  #nx-contract-service .nx-cs-ticker{ animation:nx-cs-marquee 16s linear infinite; will-change:transform; }
  @keyframes nx-cs-marquee{ to{ transform:translateX(calc(-50% - 40%)); } }
}
#nx-contract-service .nx-cs-ticker span{ opacity:.85; }

/* ---------------- BENEFITS (staggered but aligned) ---------------- */
#nx-contract-service .nx-cs-benefits{ margin:56px 0 10px; }
#nx-contract-service .nx-cs-benefits-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:stretch;
}
#nx-contract-service .nx-cs-benefit{
  background:var(--cs-glass); border:1px solid rgba(10,12,20,.06); border-radius:16px; padding:18px;
  box-shadow:var(--cs-shadow); position:relative; overflow:hidden;
  display:grid; grid-template-rows:auto auto 1fr; min-height:160px;
  transition:transform .28s cubic-bezier(.25,.9,.3,1), box-shadow .28s ease;
}
#nx-contract-service .nx-cs-benefit.is-up{ transform:translateY(-6px); } /* subtle stagger */
#nx-contract-service .nx-cs-benefit:hover{
  transform:translateY(-8px); box-shadow:0 20px 50px rgba(106,78,230,.18);
}

#nx-contract-service .nx-cs-benefit::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(106,78,230,.06), rgba(179,75,238,.06));
  opacity:.35; mix-blend-mode:multiply; pointer-events:none;
}

#nx-contract-service .nx-cs-badge{
  width:28px; height:28px; border-radius:10px; display:grid; place-items:center; font-weight:800; font-size:.85rem; color:#fff;
  background:linear-gradient(90deg,var(--cs-g1),var(--cs-g2)); box-shadow:0 8px 18px rgba(106,78,230,.22);
  margin-bottom:8px;
}
#nx-contract-service .nx-cs-benefit-title{ margin:0; font-size:1.06rem; font-weight:900; color:var(--cs-ink); line-height:1.25; }
#nx-contract-service .nx-cs-benefit-desc{ margin:8px 0 0; color:var(--cs-muted); line-height:1.55; }

/* ---------------- PROCESS (swim-lanes) ---------------- */
#nx-contract-service .nx-cs-process{ margin-top:62px; }
#nx-contract-service .nx-cs-section-title{ font-weight:900; font-size:1.28rem; margin:0 0 14px; }

#nx-contract-service .nx-cs-lanes{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; position:relative;
}
#nx-contract-service .nx-cs-lanes::before{
  content:""; position:absolute; top:20px; left:8px; right:8px; height:4px; border-radius:3px;
  background:linear-gradient(90deg, rgba(106,78,230,.6), rgba(179,75,238,.6)); opacity:.5;
}
#nx-contract-service .nx-cs-lane{
  background:#fff; border:1px solid rgba(10,12,20,.06); border-radius:14px; padding:18px 16px 16px;
  box-shadow:0 10px 24px rgba(10,12,20,.06); min-height:120px; position:relative;
  transition:transform .25s ease, box-shadow .25s ease;
}
#nx-contract-service .nx-cs-lane:hover{
  transform:translateY(-4px); box-shadow:0 18px 40px rgba(106,78,230,.15);
}

#nx-contract-service .nx-cs-lane-head{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
#nx-contract-service .nx-cs-stepnum{
  display:inline-block; width:22px; height:22px; border-radius:7px; text-align:center; line-height:22px;
  font-size:.8rem; font-weight:900; color:#fff; background:linear-gradient(90deg,var(--cs-g1),var(--cs-g2));
  box-shadow:0 0 14px rgba(106,78,230,.35);
}
#nx-contract-service .nx-cs-lane-title{ margin:0; font-size:1.02rem; font-weight:900; }
#nx-contract-service .nx-cs-lane-desc{ margin:0; color:var(--cs-muted); line-height:1.55; }

/* ---------------- CORE (models + use cases) ---------------- */
#nx-contract-service .nx-cs-core{ margin:70px 0; }
#nx-contract-service .nx-cs-core-inner{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
}
#nx-contract-service .nx-cs-core-card{
  background:rgba(255,255,255,.75); backdrop-filter:blur(8px);
  border:1px solid rgba(10,12,20,.06); border-radius:16px; padding:20px;
  box-shadow:0 10px 28px rgba(10,12,20,.08);
}
#nx-contract-service .nx-cs-core-sub{ margin:0 0 10px; font-size:1.12rem; font-weight:900; color:var(--cs-ink); }
#nx-contract-service .nx-cs-list{ margin:0; padding-left:18px; color:var(--cs-ink); line-height:1.6; }
#nx-contract-service .nx-cs-list li{ margin-bottom:8px; }

/* ---------------- FINAL CTA — container (unique section) ---------------- */
#nx-contract-service .nx-cs-final-cta {
  margin: 72px 0 80px;
  background: linear-gradient(180deg, rgba(10,12,20,.02), rgba(10,12,20,.05));
  border-radius: 20px;
  padding: 48px 32px;
  box-shadow: 0 12px 38px rgba(10,12,20,.06);
  position:relative;
  overflow:hidden;
}
#nx-contract-service .nx-cs-final-cta::before{
  /* subtle animated aurora that won’t tank perf */
  content:""; position:absolute; inset:0;
  background: radial-gradient(60% 60% at 30% 20%, rgba(106,78,230,.14), transparent 60%),
              radial-gradient(70% 70% at 80% 70%, rgba(179,75,238,.12), transparent 65%);
  opacity:.6; pointer-events:none;
}
#nx-contract-service .nx-cs-final-inner {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:28px; position:relative; z-index:2;
}

#nx-contract-service .nx-cs-final-title {
  margin:0 0 6px; font-size:1.9rem; font-weight:900; color:#0b1220;
}
#nx-contract-service .nx-cs-final-sub {
  margin:0; color:#6b7280; font-size:1.05rem;
}

/* -------- CTA button (isolated, unshared) -------- */
#nx-contract-service .nx-cs-cta-btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 32px;
  border-radius:14px;
  font-weight:900; text-decoration:none;
  font-size:1rem;
  color:#fff;
  cursor:pointer;

  background:linear-gradient(90deg, var(--cs-g1), var(--cs-g2));
  background-size:200% 100%; background-position:0% 50%;
  box-shadow:0 16px 42px rgba(106,78,230,.26);
  transition:transform .22s cubic-bezier(.25,.9,.3,1), box-shadow .22s ease, background-position .35s ease;
  position:relative;
  overflow:hidden;
}

/* subtle warm overlay to differentiate from Exec */
#nx-contract-service .nx-cs-cta-btn::before {
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(255,200,240,.10), rgba(255,170,210,.10));
  opacity:.45; mix-blend-mode:soft-light; pointer-events:none;
}

/* glow sweep */
#nx-contract-service .nx-cs-cta-btn::after {
  content:""; position:absolute;
  top:-20%; bottom:-20%; width:26%; left:-36%;
  background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 50%, rgba(255,255,255,0) 100%);
  border-radius:20px; opacity:0;
  transform:skewX(-18deg);
  transition:transform .65s ease, opacity .35s ease;
}

#nx-contract-service .nx-cs-cta-btn:hover {
  transform:translateY(-3px) scale(1.02);
  background-position:100% 50%;
  box-shadow:0 24px 62px rgba(106,78,230,.32);
}

#nx-contract-service .nx-cs-cta-btn:hover::after {
  opacity:.85; transform:skewX(-18deg) translateX(240%);
}

/* touch improvements */
@media (hover:none){
  #nx-contract-service .nx-cs-cta-btn:hover {
    transform:none; box-shadow:0 16px 42px rgba(106,78,230,.26);
    background-position:0% 50%;
  }
}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1100px){
  #nx-contract-service .nx-cs-hero-inner{ grid-template-columns:1fr; }
  #nx-contract-service .nx-cs-hero-visual{ height:300px; }
}
@media (max-width:1000px){
  #nx-contract-service .nx-cs-benefits-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #nx-contract-service .nx-cs-lanes{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #nx-contract-service .nx-cs-core-inner{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  #nx-contract-service .nx-cs-hero{ padding:48px 22px; }
  #nx-contract-service .nx-cs-hero-title{ font-size:clamp(1.7rem,6.2vw,2.1rem); }
  #nx-contract-service .nx-cs-benefits-grid,
  #nx-contract-service .nx-cs-lanes{ grid-template-columns:1fr; }
  #nx-contract-service .nx-cs-benefit.is-up{ transform:none; }
  #nx-contract-service .nx-cs-final-cta{ padding:40px 22px; }
}

/* ---------------- ACCESSIBILITY ---------------- */
@media (prefers-reduced-motion:reduce){
  #nx-contract-service .nx-cs-ticket,
  #nx-contract-service .nx-cs-benefit,
  #nx-contract-service .nx-cs-lane{ animation:none !important; transition:none !important; }
  #nx-contract-service .nx-cs-ticker{ animation:none !important; }
}

/* ---------------- DEFENSIVE (avoid global overrides) ---------------- */
#nx-contract-service .nx-cs-final-cta a.nx-cs-cta-btn{
  background-image:linear-gradient(90deg,var(--cs-g1),var(--cs-g2)) !important;
  background-color:transparent !important;
  color:#fff !important;
}

/* Anchor alias spacing fix for sticky header (if you use #contract-staffing anchor) */
#nx-contract-service .nx-anchor-alias{
  position: relative;
  display: block;
  height: 0;
  margin-top: calc(var(--header-offset, 92px) * -1 - 24px);
  visibility: hidden;
}

/* Overlay is scoped to the section, not the whole screen */
#nx-contract-service{ position: relative; }

#nx-contract-service .nx-coming-soon-overlay{
  position: absolute;
  inset: 0;
  z-index: 50;

  display: grid;
  place-items: center;

  background: rgba(5,8,15,.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  pointer-events: auto; /* blocks clicks in this section */
}

#nx-contract-service .nx-coming-soon-card{
  pointer-events: auto;
}

/* hidden state */
#nx-contract-service .nx-coming-soon-overlay.is-hidden{
  display: none;
}

/* ==========================================================
   Contract Staffing — Coming Soon Overlay (SINGLE SOURCE)
   Scope: #nx-contract-service only
   Includes: clickable CTA + pill style + no click blocking
   ========================================================== */

#nx-contract-service{
  position: relative;
  --cs-g1:#6a4ee6;
  --cs-g2:#b34bee;
  --cs-ink:#0b1220;
  --cs-muted:#6b7280;
}

/* ==========================================================
   OVERLAY
   ========================================================== */
#nx-contract-service .nx-coming-soon-overlay{
  position:absolute;
  inset:0;
  z-index:9999;

  display:grid;
  place-items:center;
  padding:clamp(18px, 3vw, 36px);

  background:
    radial-gradient(1200px 520px at 18% 20%, rgba(106,78,230,.20), transparent 55%),
    radial-gradient(900px 460px at 82% 72%, rgba(179,75,238,.18), transparent 60%),
    rgba(10,12,20,.46);

  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);

  /* Overlay blocks clicks behind it */
  pointer-events:auto;
}

#nx-contract-service .nx-coming-soon-overlay.is-hidden{
  display:none;
}

/* IMPORTANT: never let pseudo elements eat clicks */
#nx-contract-service .nx-coming-soon-overlay::before,
#nx-contract-service .nx-coming-soon-overlay::after{
  pointer-events:none;
}

/* ==========================================================
   PANEL (clickable content)
   ========================================================== */
#nx-contract-service .nx-coming-soon-panel{
  width:min(1100px, 94vw);
  min-height:clamp(260px, 42vh, 420px);
  border-radius:26px;
  padding:clamp(26px, 4vw, 54px);

  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:14px;

  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.74));
  border:1px solid rgba(255,255,255,.32);
  box-shadow:
    0 34px 90px rgba(10,12,20,.34),
    0 12px 34px rgba(10,12,20,.14),
    inset 0 1px 0 rgba(255,255,255,.70);

  color:var(--cs-ink);
  position:relative;
  overflow:hidden;

  /* MUST be clickable */
  pointer-events:auto;
}

/* Aurora wash inside panel */
#nx-contract-service .nx-coming-soon-panel::before{
  content:"";
  position:absolute;
  inset:-28%;
  background:
    radial-gradient(60% 55% at 20% 30%, rgba(106,78,230,.30), transparent 56%),
    radial-gradient(55% 55% at 80% 70%, rgba(179,75,238,.24), transparent 60%);
  filter: blur(24px);
  opacity:.60;
  pointer-events:none; /* ✅ do not block clicks */
}
#nx-contract-service .nx-coming-soon-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.60), rgba(255,255,255,0) 44%);
  opacity:.18;
  pointer-events:none; /* ✅ do not block clicks */
}

/* Defensive: ensure all children can receive clicks */
#nx-contract-service .nx-coming-soon-panel,
#nx-contract-service .nx-coming-soon-panel *{
  pointer-events:auto;
  position:relative;
  z-index:1;
}

/* ==========================================================
   TYPOGRAPHY
   ========================================================== */
#nx-contract-service .nx-coming-soon-kicker,
#nx-contract-service .nx-coming-soon-panel h2,
#nx-contract-service .nx-coming-soon-lead,
#nx-contract-service .nx-coming-soon-badge,
#nx-contract-service .nx-coming-soon-note,
#nx-contract-service .nx-coming-soon-btn{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

#nx-contract-service .nx-coming-soon-kicker{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:900;
  font-size:12px;
  color:rgba(11,18,32,.62);
}

#nx-contract-service .nx-coming-soon-panel h2{
  margin:0 !important;
  font-weight:950 !important;
  letter-spacing:-0.03em;
  line-height:1.05;
  font-size:clamp(34px, 5vw, 56px) !important;

  background:linear-gradient(90deg, var(--cs-g1), var(--cs-g2));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

#nx-contract-service .nx-coming-soon-lead{
  margin:0 !important;
  font-size:clamp(16px, 1.6vw, 20px);
  line-height:1.75;
  color:rgba(11,18,32,.78);
  max-width:70ch;
}

/* ==========================================================
   META ROW
   ========================================================== */
#nx-contract-service .nx-coming-soon-meta{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

#nx-contract-service .nx-coming-soon-badge{
  display:inline-flex;
  align-items:center;
  padding:10px 14px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  color:#fff;
  background:linear-gradient(90deg, var(--cs-g1), var(--cs-g2));
  box-shadow:0 14px 30px rgba(106,78,230,.22);
}

#nx-contract-service .nx-coming-soon-note{
  font-weight:800;
  font-size:14px;
  color:rgba(11,18,32,.72);
}

/* ==========================================================
   CTA (pill button) — CLICKABLE
   ========================================================== */
#nx-contract-service .nx-coming-soon-actions{
  margin-top:22px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;

  /* keep above overlay/panel effects */
  position:relative;
  z-index:10;
}

#nx-contract-service .nx-coming-soon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 22px;
  border-radius:999px;          /* pill */
  font-weight:900;
  text-decoration:none !important;

  color:#fff !important;
  background:linear-gradient(90deg, var(--cs-g1), var(--cs-g2));
  box-shadow:0 18px 44px rgba(106,78,230,.28);
  transition:transform .22s ease, box-shadow .22s ease;

  cursor:pointer;
}

#nx-contract-service .nx-coming-soon-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 26px 62px rgba(106,78,230,.34);
}

/* ==========================================================
   MOBILE
   ========================================================== */
@media (max-width:560px){
  #nx-contract-service .nx-coming-soon-panel{
    min-height:300px;
    border-radius:20px;
    padding:22px 18px;
  }
}
