/* ============================================================================
   home.css — Homepage-only redesign layer for Next Level CPA
   Loaded ONLY on index.html, AFTER styles.css, and scoped to `.home-experience`.
   Nothing here affects any other page or the shared header/footer typography.

   Fonts: Inter — single family for the whole homepage. Brand greens kept
   throughout.

   Stock photography added in this pass is licensed under the Unsplash License
   (https://unsplash.com/license — free for commercial use, no attribution
   required): nlx-hero-poster, nlx-service-accounting/tax/cfo/incorporation,
   nlx-industry-medical/dental. The chiropractic card reuses the existing
   in-repo photo 84805.jpg.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap");

/* ---- Homepage design tokens (built from existing brand greens) ---- */
.home-experience {
  --nlx-green-1: #0d7d56;      /* --plum   */
  --nlx-green-2: #2c8c66;      /* --mint   */
  --nlx-green-3: #18724f;      /* --coral  */
  --nlx-green-deep: #0f6b4b;   /* --sand-deep */
  --nlx-ink: #13191f;          /* --navy-deep */
  --nlx-ink-soft: #1d252c;     /* --navy   */
  --nlx-grad: linear-gradient(120deg, var(--nlx-green-deep) 0%, var(--nlx-green-1) 45%, var(--nlx-green-2) 100%);
  --nlx-grad-soft: linear-gradient(135deg, rgba(13,125,86,0.12), rgba(44,140,102,0.06));
  --nlx-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --nlx-shadow-card: 0 18px 44px rgba(15, 107, 75, 0.14);
  --nlx-shadow-hover: 0 32px 70px rgba(13, 87, 62, 0.24);
}

/* =========================================================================
   1. TYPOGRAPHY — scoped to homepage <main> so shared chrome stays consistent
   ========================================================================= */
.home-experience main :is(
  h1, h2, h3, h4, h5, h6,
  .section-title, .eyebrow, .btn, .hero-badge,
  .nlx-service-tab, .nlx-service-name, .logo-chip,
  .nlx-trust-num, .nlx-trust-label,
  .nlx-industry-card strong, .nlx-industry-link,
  .card h3, .testimonial-card strong, .service-feature h3,
  .cta-field span, .cta-submit
) {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

.home-experience main :is(
  p, li, .section-lead, .content p, .card p,
  .service-feature p, .testimonial-card p,
  .nlx-service-panel p, .nlx-industry-card p, .nlx-trust-item p,
  .cta-copy p, blockquote
) {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

.home-experience main :is(h1, h2, .section-title) {
  letter-spacing: -0.01em;
  line-height: 1.14;
  font-weight: 700;
}
.home-experience main .eyebrow {
  letter-spacing: 0.26em;
  font-weight: 700;
}
.home-experience main .section-lead { line-height: 1.85; }

/* Gradient text accent used on select headings */
.home-experience .nlx-grad-text {
  background: linear-gradient(100deg, var(--nlx-green-2), var(--nlx-green-1) 55%, var(--nlx-green-deep));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* =========================================================================
   2. MOTION SYSTEM
   ========================================================================= */
@keyframes nlxFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
@keyframes nlxOrbDrift {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50%      { transform: translate3d(18px, -22px, 0) scale(1.06); }
}
@keyframes nlxGradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes nlxSheen {
  0%   { transform: translateX(-120%) skewX(-18deg); }
  60%, 100% { transform: translateX(220%) skewX(-18deg); }
}
@keyframes nlxCue {
  0%   { transform: translateY(0); opacity: 0.35; }
  50%  { transform: translateY(8px); opacity: 1; }
  100% { transform: translateY(0); opacity: 0.35; }
}
@keyframes nlxPanelIn {
  from { opacity: 0; transform: translateY(14px) scale(0.99); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Staggered reveal: home.js sets --nlx-i on each .reveal within a group */
.home-experience [data-nlx-stagger] > .reveal {
  transition-delay: calc(var(--nlx-i, 0) * 90ms);
}

/* Slightly richer reveal easing for the homepage */
.home-experience main .reveal {
  transition: opacity 620ms var(--nlx-ease), transform 620ms var(--nlx-ease);
}

/* =========================================================================
   3. HERO
   ========================================================================= */
.home-experience .nlx-hero { position: relative; overflow: hidden; }

/* READABILITY: the shared styles.css paints heavy light-green washes over the
   hero video, which crushes contrast for the dark default text. Here we drop
   those washes, let the video show, and darken it so LIGHT hero text is
   crisply legible. */
.home-experience .nlx-hero.hero-single-column {
  background: #0a1e16 !important;
  /* Reserve a little space at the bottom so the centered hero copy clears the
     scroll cue pinned to the section's bottom edge. */
  padding-bottom: 64px !important;
}
.home-experience .nlx-hero.hero-single-column::before {
  background: none !important;
}

/* Dark, directional scrim over the video (heaviest on the left where the copy
   sits) for high text contrast while keeping a brand-green tint. */
.home-experience .nlx-hero-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(6, 20, 14, 0.82) 0%, rgba(8, 26, 19, 0.58) 46%, rgba(9, 28, 20, 0.34) 100%),
    linear-gradient(180deg, rgba(6, 20, 14, 0.30) 0%, rgba(6, 20, 14, 0.08) 40%, rgba(6, 20, 14, 0.72) 100%),
    linear-gradient(115deg, rgba(13, 125, 86, 0.30) 0%, rgba(15, 107, 75, 0.05) 52%, rgba(19, 25, 31, 0) 74%);
}

/* Light hero copy for contrast over the darkened video */
.home-experience .nlx-hero .hero-copy h1 { color: #ffffff !important; }
.home-experience .nlx-hero .hero-copy p { color: rgba(238, 249, 244, 0.94) !important; }

.home-experience .nlx-hero .hero-badge {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #eafaf3 !important;
  border: 1px solid rgba(255, 255, 255, 0.30);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* Brighter gradient accent so "next level" pops on the dark hero */
.home-experience .nlx-hero .nlx-grad-text {
  background: linear-gradient(100deg, #8ff0c6, #37c48b 58%, #17a86e);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* Secondary button legible on the dark hero */
.home-experience .nlx-hero .hero-actions .btn-secondary {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}
.home-experience .nlx-hero .hero-actions .btn-secondary:hover {
  background: rgba(255, 255, 255, 0.16) !important;
}

/* Floating brand orb accent */
.home-experience .nlx-hero-orb {
  position: absolute;
  z-index: 1;
  width: clamp(220px, 32vw, 460px);
  height: clamp(220px, 32vw, 460px);
  right: -6%;
  top: -10%;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle at 34% 34%, rgba(78, 196, 150, 0.55), rgba(13, 125, 86, 0.12) 58%, transparent 70%);
  filter: blur(4px);
  animation: nlxOrbDrift 14s ease-in-out infinite;
}

.home-experience .nlx-hero .hero-grid { position: relative; z-index: 2; }

.home-experience .nlx-hero .hero-copy h1 { letter-spacing: -0.015em; }

/* Scroll cue */
.home-experience .nlx-scroll-cue {
  position: absolute;
  left: 50%;
  bottom: 22px;
  z-index: 3;
  transform: translateX(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: #eafaf3;
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-family: "Inter", system-ui, sans-serif;
  opacity: 0.9;
  transition: opacity 240ms var(--nlx-ease);
}
.home-experience .nlx-scroll-cue:hover { opacity: 1; }
.home-experience .nlx-scroll-cue .nlx-scroll-mouse {
  width: 24px;
  height: 38px;
  border: 2px solid rgba(234, 250, 243, 0.7);
  border-radius: 14px;
  position: relative;
}
.home-experience .nlx-scroll-cue .nlx-scroll-mouse::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 7px;
  width: 3px;
  height: 7px;
  border-radius: 3px;
  background: #eafaf3;
  transform: translateX(-50%);
  animation: nlxCue 1.8s ease-in-out infinite;
}

/* =========================================================================
   4. TRUST STRIP  (revived from the old stats-strip slot)
   ========================================================================= */
.home-experience .nlx-trust {
  padding: 52px 0 8px;
  position: relative;
  z-index: 6;
}
/* One connected, elevated panel. The 1px grid gap reveals the panel's own
   background as hairline dividers between cells — works at any column count. */
.home-experience .nlx-trust-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  counter-reset: nlx-trust;
  background: rgba(15, 107, 75, 0.12);
  border: 1px solid rgba(15, 107, 75, 0.12);
  border-radius: 26px;
  box-shadow: 0 34px 70px rgba(13, 87, 62, 0.14);
  overflow: hidden;
}
.home-experience .nlx-trust-item {
  position: relative;
  padding: 34px 30px 32px;
  background: linear-gradient(180deg, #ffffff, #f5faf7);
  transition: background 320ms var(--nlx-ease);
  overflow: hidden;
}
/* index watermark 01–04 */
.home-experience .nlx-trust-item::after {
  counter-increment: nlx-trust;
  content: "0" counter(nlx-trust);
  position: absolute;
  top: 16px; right: 20px;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: rgba(15, 107, 75, 0.16);
}
/* animated top accent that grows on hover */
.home-experience .nlx-trust-item::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 3px;
  background: var(--nlx-grad);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 360ms var(--nlx-ease);
}
.home-experience .nlx-trust-item:hover { background: linear-gradient(180deg, #f3fbf7, #ecf7f1); }
.home-experience .nlx-trust-item:hover::before { transform: scaleX(1); }
.home-experience .nlx-trust-icon {
  width: 52px; height: 52px;
  display: grid; place-items: center;
  border-radius: 16px;
  margin-bottom: 18px;
  color: #fff;
  background: var(--nlx-grad);
  box-shadow: 0 10px 22px rgba(15, 107, 75, 0.28);
  transition: transform 400ms var(--nlx-ease);
}
.home-experience .nlx-trust-item:hover .nlx-trust-icon { transform: translateY(-3px) rotate(-4deg); }
.home-experience .nlx-trust-icon svg { width: 26px; height: 26px; stroke: currentColor; fill: none; }
.home-experience .nlx-trust-num {
  display: block;
  font-size: 1.7rem;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.01em;
  background: linear-gradient(100deg, #0f6b4b, #17a86e);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.home-experience .nlx-trust-label {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* =========================================================================
   5. APPROACH SPLIT — image framing + zoom
   ========================================================================= */
.home-experience .split-grid .image-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--nlx-shadow-card);
  isolation: isolate;
}
.home-experience .split-grid .image-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px;
  background: var(--nlx-grad);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.65;
  pointer-events: none;
}
.home-experience .split-grid .image-card img {
  transition: transform 900ms var(--nlx-ease);
  width: 100%;
}
.home-experience .split-grid .image-card:hover img { transform: scale(1.055); }

/* soft radial glow behind the split image */
.home-experience .split-grid { position: relative; }
.home-experience .split-grid::before {
  content: "";
  position: absolute;
  left: -6%;
  top: 8%;
  width: 44%;
  height: 80%;
  z-index: -1;
  background: radial-gradient(circle at 40% 40%, rgba(44, 140, 102, 0.18), transparent 68%);
  filter: blur(6px);
}
.home-experience .check-list li { transition: transform 260ms var(--nlx-ease); }
.home-experience .check-list li:hover { transform: translateX(4px); }

/* =========================================================================
   6. SERVICES — interactive selector
   ========================================================================= */
.home-experience .nlx-services .nlx-service-shell {
  display: grid;
  grid-template-columns: 0.9fr 1.25fr;
  gap: 28px;
  margin-top: 32px;
  align-items: stretch;
}
.home-experience .nlx-service-tabs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.home-experience .nlx-service-tab {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  text-align: left;
  padding: 18px 20px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(15, 107, 75, 0.14);
  background: #ffffff;
  cursor: pointer;
  color: var(--nlx-ink-soft);
  transition: transform 260ms var(--nlx-ease), box-shadow 260ms var(--nlx-ease),
              border-color 260ms var(--nlx-ease), background 260ms var(--nlx-ease);
}
.home-experience .nlx-service-tab:hover { transform: translateX(4px); border-color: rgba(15,107,75,0.35); }
.home-experience .nlx-service-tab .nlx-service-ticon {
  flex: none;
  width: 44px; height: 44px;
  display: grid; place-items: center;
  border-radius: 12px;
  color: var(--nlx-green-1);
  background: rgba(44, 140, 102, 0.12);
  transition: color 260ms var(--nlx-ease), background 260ms var(--nlx-ease);
}
.home-experience .nlx-service-tab .nlx-service-ticon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; }
.home-experience .nlx-service-name { display: block; font-weight: 700; font-size: 1.06rem; }
.home-experience .nlx-service-hint { display: block; font-size: 0.86rem; color: var(--muted); margin-top: 2px; }
.home-experience .nlx-service-tab[aria-selected="true"] {
  background: var(--nlx-grad);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--nlx-shadow-card);
}
.home-experience .nlx-service-tab[aria-selected="true"] .nlx-service-ticon { background: rgba(255,255,255,0.18); color: #fff; }
.home-experience .nlx-service-tab[aria-selected="true"] .nlx-service-hint { color: rgba(255,255,255,0.82); }

/* Stage / panels */
.home-experience .nlx-service-stage {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-height: 420px;
  box-shadow: var(--nlx-shadow-card);
  background: #0f2019;
}
.home-experience .nlx-service-panel {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: 1fr auto;
}
.home-experience .nlx-service-media {
  position: relative;
  overflow: hidden;
}
.home-experience .nlx-service-media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform 1200ms var(--nlx-ease);
}
.home-experience .nlx-service-media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,25,19,0) 30%, rgba(11,25,19,0.86) 100%);
}
.home-experience .nlx-service-body {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: -90px;
  padding: 0 30px 28px;
  color: #fff;
  z-index: 2;
}
.home-experience .nlx-service-body h3 { color: #fff; font-size: 1.5rem; margin: 0 0 8px; }
.home-experience .nlx-service-body p {
  color: rgba(238, 249, 244, 0.9) !important;
  margin: 0;
}
.home-experience .nlx-service-cta {
  display: inline-flex; align-items: center; gap: 10px;
  margin-top: 14px;
  color: #eafaf3; font-weight: 700;
  font-family: "Inter", system-ui, sans-serif;
}
.home-experience .nlx-service-cta .nlx-arrow { transition: transform 260ms var(--nlx-ease); }
.home-experience .nlx-service-cta:hover .nlx-arrow { transform: translateX(6px); }

/* JS on: only the active panel shows, with a crossfade + slow zoom */
.home-experience .nlx-service-shell.nlx-js .nlx-service-panel {
  opacity: 0; visibility: hidden; pointer-events: none;
}
.home-experience .nlx-service-shell.nlx-js .nlx-service-panel.is-active {
  opacity: 1; visibility: visible; pointer-events: auto;
  /* animation: nlxPanelIn 560ms var(--nlx-ease); */
}
.home-experience .nlx-service-shell.nlx-js .nlx-service-panel.is-active .nlx-service-media img { transform: scale(1.09); }

/* JS off fallback: stack panels statically so content is still usable */
.home-experience .nlx-service-shell:not(.nlx-js) .nlx-service-stage {
  min-height: 0; display: grid; gap: 20px; background: transparent; box-shadow: none;
}
.home-experience .nlx-service-shell:not(.nlx-js) .nlx-service-panel {
  position: relative; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--nlx-shadow-card);
}

/* =========================================================================
   7. INDUSTRIES — image cards
   ========================================================================= */
.home-experience .nlx-industry-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 30px;
}
.home-experience .nlx-industry-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-height: 340px;
  display: flex;
  box-shadow: var(--nlx-shadow-card);
  isolation: isolate;
  transition: transform 360ms var(--nlx-ease), box-shadow 360ms var(--nlx-ease);
}
.home-experience .nlx-industry-card:hover { transform: translateY(-8px); box-shadow: var(--nlx-shadow-hover); }
.home-experience .nlx-industry-media { position: absolute; inset: 0; z-index: -1; }
.home-experience .nlx-industry-media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1000ms var(--nlx-ease);
}
.home-experience .nlx-industry-card:hover .nlx-industry-media img { transform: scale(1.08); }
.home-experience .nlx-industry-media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,25,19,0.10) 0%, rgba(11,25,19,0.35) 45%, rgba(9,54,38,0.9) 100%);
}
.home-experience .nlx-industry-overlay {
  position: relative;
  margin-top: auto;
  padding: 26px 24px;
  color: #fff;
}
.home-experience .nlx-industry-overlay strong {
  display: block;
  font-size: 1.35rem;
  margin-bottom: 8px;
  letter-spacing: 0.01em;
}
.home-experience .nlx-industry-overlay p {
  color: rgba(236, 248, 243, 0.92) !important;
  font-size: 0.96rem;
  margin: 0 0 14px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 420ms var(--nlx-ease), opacity 360ms var(--nlx-ease), margin 420ms var(--nlx-ease);
}
.home-experience .nlx-industry-card:hover .nlx-industry-overlay p,
.home-experience .nlx-industry-card:focus-within .nlx-industry-overlay p {
  max-height: 160px; opacity: 1;
}
.home-experience .nlx-industry-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: #eafaf3; font-weight: 700;
}
.home-experience .nlx-industry-link .nlx-arrow { transition: transform 260ms var(--nlx-ease); }
.home-experience .nlx-industry-card:hover .nlx-industry-link .nlx-arrow { transform: translateX(6px); }
.home-experience .nlx-industry-card a.nlx-industry-stretch { position: absolute; inset: 0; z-index: 3; text-indent: -9999px; }

/* =========================================================================
   8. VALUE BAND + LOGO CHIPS
   ========================================================================= */
.home-experience .feature-band .value-grid .card {
  position: relative;
  padding: 34px 30px;
  border-radius: var(--radius-lg);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)),
    rgba(10, 24, 18, 0.35);
  border: 1px solid rgba(120, 200, 165, 0.16);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.22);
  overflow: hidden;
  transition: transform 320ms var(--nlx-ease), box-shadow 320ms var(--nlx-ease),
              border-color 320ms var(--nlx-ease), background 320ms var(--nlx-ease);
}
/* radial glow that lights up on hover */
.home-experience .feature-band .value-grid .card::after {
  content: "";
  position: absolute;
  top: -40%; right: -30%;
  width: 60%; height: 80%;
  background: radial-gradient(circle, rgba(44, 140, 102, 0.35), transparent 68%);
  opacity: 0;
  transition: opacity 420ms var(--nlx-ease);
  pointer-events: none;
}
.home-experience .feature-band .value-grid .card::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 4px;
  background: var(--nlx-grad);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 380ms var(--nlx-ease);
}
.home-experience .feature-band .value-grid .card:hover {
  transform: translateY(-8px);
  border-color: rgba(120, 200, 165, 0.4);
  box-shadow: 0 36px 66px rgba(0, 0, 0, 0.34);
}
.home-experience .feature-band .value-grid .card:hover::before { transform: scaleX(1); }
.home-experience .feature-band .value-grid .card:hover::after { opacity: 1; }

/* Bright, legible icon chips (were near-invisible faint on the dark band) */
.home-experience .feature-band .value-grid .card .section-badge-icon,
.home-experience .feature-band .value-grid .card .section-badge-icon-light {
  width: 56px; height: 56px;
  border-radius: 16px;
  display: grid; place-items: center;
  background: var(--nlx-grad) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 26px rgba(15, 107, 75, 0.4);
  transition: transform 400ms var(--nlx-ease);
}
.home-experience .feature-band .value-grid .card .section-badge-icon svg {
  width: 26px; height: 26px;
  stroke: #ffffff;
}
.home-experience .feature-band .value-grid .card:hover .section-badge-icon { transform: translateY(-3px) rotate(-4deg); }

/* Modern chip row */
.home-experience .logo-row { flex-wrap: wrap; gap: 12px; }
.home-experience .logo-chip {
  border: 1px solid rgba(120, 200, 165, 0.24);
  background: rgba(120, 200, 165, 0.06);
  transition: transform 300ms var(--nlx-ease), box-shadow 300ms var(--nlx-ease),
              background 300ms var(--nlx-ease), border-color 300ms var(--nlx-ease);
}
.home-experience .logo-chip span { color: var(--nlx-green-2); }
.home-experience .logo-chip:hover {
  transform: translateY(-4px);
  background: var(--nlx-grad);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--nlx-shadow-card);
}
.home-experience .logo-chip:hover span { color: #eafaf3; }

/* =========================================================================
   9. CTA BAND — animated gradient + input polish
   ========================================================================= */
.home-experience .cta .cta-panel {
  position: relative;
  overflow: hidden;
  background: linear-gradient(125deg, #0b4b34, #0d7d56 42%, #16a06a 68%, #0f6b4b) !important;
  background-size: 200% 200% !important;
  animation: nlxGradientShift 16s ease infinite;
}
.home-experience .cta .cta-field input,
.home-experience .cta .cta-field textarea {
  transition: border-color 240ms var(--nlx-ease), box-shadow 240ms var(--nlx-ease), background 240ms var(--nlx-ease);
}
.home-experience .cta .cta-field input:focus,
.home-experience .cta .cta-field textarea:focus {
  outline: none;
  border-color: rgba(255,255,255,0.9);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.16);
}
.home-experience .cta .cta-submit {
  position: relative;
  overflow: hidden;
  transition: transform 240ms var(--nlx-ease), box-shadow 240ms var(--nlx-ease);
}
.home-experience .cta .cta-submit::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.55), transparent);
  transform: translateX(-120%) skewX(-18deg);
}
.home-experience .cta .cta-submit:hover { transform: translateY(-3px); box-shadow: var(--nlx-shadow-card); }
.home-experience .cta .cta-submit:hover::after { animation: nlxSheen 0.9s var(--nlx-ease); }

/* =========================================================================
   10. Generic hover polish for legacy service-feature cards (Core Services
        fallback styling / any residual .service-feature usage)
   ========================================================================= */
.home-experience .service-feature {
  transition: transform 320ms var(--nlx-ease), box-shadow 320ms var(--nlx-ease);
}
.home-experience .service-feature:hover { transform: translateY(-6px); box-shadow: var(--nlx-shadow-card); }
.home-experience .service-feature-link .service-feature-arrow { transition: transform 260ms var(--nlx-ease); display: inline-block; }
.home-experience .service-feature-link:hover .service-feature-arrow { transform: translateX(6px); }

/* =========================================================================
   11. RESPONSIVE
   ========================================================================= */
@media (max-width: 980px) {
  .home-experience .nlx-services .nlx-service-shell { grid-template-columns: 1fr; }
  .home-experience .nlx-service-stage { min-height: 380px; }
  .home-experience .nlx-trust-grid { grid-template-columns: repeat(2, 1fr); }
  .home-experience .nlx-industry-grid { grid-template-columns: 1fr; }
  .home-experience .nlx-industry-card { min-height: 300px; }
  /* On touch/smaller screens, always reveal industry copy (no hover) */
  .home-experience .nlx-industry-overlay p { max-height: 160px; opacity: 1; }
}
@media (max-width: 640px) {
  .home-experience .nlx-trust-grid { grid-template-columns: 1fr; }
  .home-experience .nlx-service-tab { padding: 14px 16px; }
  .home-experience .nlx-service-body { padding: 0 20px 22px; margin-top: -70px; }
  .home-experience .nlx-hero-orb { display: none; }
  .home-experience .nlx-scroll-cue { display: none; }
}

/* =========================================================================
   12. REDUCED MOTION
   ========================================================================= */
@media (prefers-reduced-motion: reduce) {
  .home-experience *,
  .home-experience *::before,
  .home-experience *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .home-experience .nlx-hero-orb,
  .home-experience .nlx-scroll-cue .nlx-scroll-mouse::after { animation: none !important; }
  .home-experience main .reveal { opacity: 1 !important; transform: none !important; }
  .home-experience [data-nlx-parallax] { transform: none !important; }
}
