/* ══════════════════════════════════════════
   INNERLUXES — SaaS Page Styles
   File: styles-page.css
   ══════════════════════════════════════════ */

/* ══════════════════════════════════════════
   PREMIUM SITE-WIDE STYLING (blue theme — matches header)
   ══════════════════════════════════════════ */

/* --- Scrollbar --- */
html { scrollbar-width: thin; scrollbar-color: #005EB8 rgba(0, 94, 184, 0.06); }
html::-webkit-scrollbar         { width: 11px; height: 11px; }
html::-webkit-scrollbar-track   { background: rgba(0, 94, 184, 0.05); }
html::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #0570d8 0%, #005EB8 100%);
  border: 2px solid transparent;
  background-clip: padding-box;
  border-radius: 0;
}
html::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #1e88e5 0%, #0570d8 100%);
  background-clip: padding-box;
  border: 2px solid transparent;
}
html::-webkit-scrollbar-corner  { background: rgba(0, 94, 184, 0.05); }

/* Dark-mode scrollbar */
body:not(.light) { scrollbar-color: #60a5fa rgba(255, 255, 255, 0.04); }
body:not(.light)::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.04); }
body:not(.light)::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);
  background-clip: padding-box;
  border: 2px solid transparent;
}
body:not(.light)::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #93c5fd 0%, #60a5fa 100%);
  background-clip: padding-box;
  border: 2px solid transparent;
}
body:not(.light)::-webkit-scrollbar-corner { background: rgba(255, 255, 255, 0.04); }

/* --- Text selection (Fix 1) --- */
::selection {
  background: rgba(0, 94, 184, 0.25);
  color: #1a1814;
}
::-moz-selection {
  background: rgba(0, 94, 184, 0.25);
  color: #1a1814;
}
body:not(.light) ::selection {
  background: rgba(96, 165, 250, 0.30);
  color: #fff;
}
body:not(.light) ::-moz-selection {
  background: rgba(96, 165, 250, 0.30);
  color: #fff;
}

/* --- Focus rings (Fix 2) — replaces default browser blue --- */
*:focus { outline: none; }
*:focus-visible {
  outline: 2px solid #005EB8;
  outline-offset: 2px;
  border-radius: 2px;
}
body:not(.light) *:focus-visible {
  outline-color: #60a5fa;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  box-shadow: 0 0 0 3px rgba(0, 94, 184, 0.18);
}
body:not(.light) button:focus-visible,
body:not(.light) a:focus-visible,
body:not(.light) input:focus-visible,
body:not(.light) textarea:focus-visible,
body:not(.light) select:focus-visible {
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}


/* ── CSS Variables ── */
:root {
  --ink:       #1a1814;
  --ink-soft:  #3d3a35;
  --ink-muted: #7a7570;
  --cream:     #faf8f4;
  --cream-mid: #f2ede4;
  --gold:      #b8860b;
  --gold-light:#d4a820;
  --gold-pale: #f5ead0;
  --white:     #ffffff;
  --border:    rgba(26,24,20,0.12);
  --shadow:    0 4px 32px rgba(26,24,20,0.08);
  --shadow-lg: 0 12px 60px rgba(26,24,20,0.14);
  --toc-w:     280px;
  --content-max: 860px;
}

/* ══════════════════════════════════════════
   DARK MODE
   ══════════════════════════════════════════ */

@media (prefers-color-scheme: dark) {
  :root {
    --ink:       #e8e4dc;
    --ink-soft:  #c4bfb6;
    --ink-muted: #8a8580;
    --cream:     #1a1814;
    --cream-mid: #2a2620;
    --gold-pale: #3a2e10;
    --white:     #1e1c18;
    --border:    rgba(255,255,255,0.1);
    --shadow:    0 4px 32px rgba(0,0,0,0.3);
  }
  body { background: #1a1814; color: #e8e4dc; }
  .section-block h2                      { color: #60a5fa !important; }
  .section-block p                       { color: #c4bfb6 !important; }
  .section-label                         { color: #d4a820 !important; }
  .service-card                          { background: #1e1c18 !important; border-color: rgba(255,255,255,0.1) !important; }
  .service-card h3                       { color: #e8e4dc !important; }
  .service-card p                        { color: #8a8580 !important; }
  .sc-num                                { color: #3a3530 !important; }
  .step                                  { border-color: rgba(255,255,255,0.08) !important; }
  .step h3                               { color: #e8e4dc !important; }
  .step p                                { color: #8a8580 !important; }
  .testimonial-card-new                  { background: #1e1c18 !important; border-color: rgba(255,255,255,0.1) !important; }
  .testimonial-card-new blockquote       { color: #c4bfb6 !important; }
  .testimonial-card-new .author          { color: #8a8580 !important; }
  .toc-header span                       { color: #e8e4dc !important; }
  .toc-list                              { border-color: rgba(96, 165, 250, 0.22) !important; }
  .toc-list li a                         { color: #8a8580 !important; }
  .toc-list li a:hover                   { color: #60a5fa !important; border-left-color: rgba(96, 165, 250, 0.5) !important; }
  .toc-list li a.toc-active              { color: #60a5fa !important; border-left-color: #60a5fa !important; }
  .toc-cta                               { background: linear-gradient(155deg, rgba(96, 165, 250, 0.10) 0%, rgba(96, 165, 250, 0.02) 100%) !important; border-color: rgba(96, 165, 250, 0.22) !important; border-left-color: #60a5fa !important; }
  .toc-cta p                             { color: #c4bfb6 !important; }
  .section-block                         { border-color: rgba(255,255,255,0.08) !important; }
  .highlight-box                         { background: #0d0c0a !important; }
  .btn-outline-page                      { border-color: rgba(255,255,255,0.25) !important; color: #c4bfb6 !important; }
}

body:not(.light) {
  --ink:       #e8e4dc;
  --ink-soft:  #c4bfb6;
  --ink-muted: #8a8580;
  --cream:     #1a1814;
  --cream-mid: #2a2620;
  --gold-pale: #3a2e10;
  --white:     #1e1c18;
  --border:    rgba(255,255,255,0.1);
  --shadow:    0 4px 32px rgba(0,0,0,0.3);
  background:  #1a1814 !important;
  color:       #e8e4dc;
}
body:not(.light) .page-body                       { background: #1a1814 !important; }
body:not(.light) main                             { background: #1a1814 !important; }
body:not(.light) .section-block h2                { color: #60a5fa !important; }
body:not(.light) .section-block p                 { color: #c4bfb6 !important; }
body:not(.light) .section-label                   { color: #d4a820 !important; }
body:not(.light) .service-card                    { background: #1e1c18 !important; border-color: rgba(255,255,255,0.1) !important; }
body:not(.light) .service-card h3                 { color: #e8e4dc !important; }
body:not(.light) .service-card p                  { color: #8a8580 !important; }
body:not(.light) .sc-num                          { color: #3a3530 !important; }
body:not(.light) .step                            { border-color: rgba(255,255,255,0.08) !important; }
body:not(.light) .step h3                         { color: #e8e4dc !important; }
body:not(.light) .step p                          { color: #8a8580 !important; }
body:not(.light) .testimonial-card-new            { background: #1e1c18 !important; border-color: rgba(255,255,255,0.1) !important; }
body:not(.light) .testimonial-card-new blockquote { color: #c4bfb6 !important; }
body:not(.light) .testimonial-card-new .author    { color: #8a8580 !important; }
body:not(.light) .toc-header span                 { color: #e8e4dc !important; }
body:not(.light) .toc-list                        { border-color: rgba(96, 165, 250, 0.22) !important; }
body:not(.light) .toc-list li a                   { color: #8a8580 !important; }
body:not(.light) .toc-list li a:hover             { color: #60a5fa !important; border-left-color: rgba(96, 165, 250, 0.5) !important; }
body:not(.light) .toc-list li a.toc-active        { color: #60a5fa !important; border-left-color: #60a5fa !important; }
body:not(.light) .toc-cta                         { background: linear-gradient(155deg, rgba(96, 165, 250, 0.10) 0%, rgba(96, 165, 250, 0.02) 100%) !important; border-color: rgba(96, 165, 250, 0.22) !important; border-left-color: #60a5fa !important; }
body:not(.light) .toc-cta p                       { color: #c4bfb6 !important; }
body:not(.light) .section-block                   { border-color: rgba(255,255,255,0.08) !important; }
body:not(.light) .highlight-box                   { background: #0d0c0a !important; }
body:not(.light) .btn-outline-page                { border-color: rgba(255,255,255,0.25) !important; color: #c4bfb6 !important; }

/* ── LIGHT MODE ── */
body.light .section-block p { color: #3d3a35 !important; }

/* ══════════════════════════════════════════
   HERO SECTION - FIXED
   ══════════════════════════════════════════ */
.service-hero {
  padding: 0;
  margin: 0;
}

.new-hero-wrap {
  display: flex;
  align-items: center; /* keep image centered */
  justify-content: space-between;
  min-height: 420px;
  padding: 30px 80px 50px;
  background: #005EB8;
  position: relative;
  overflow: hidden;
  gap: 60px;
}

/* Only the left content aligns to top — keeps breadcrumb near top, image stays centered */
.new-hero-content {
  align-self: flex-start;
}

/* Decorative glows */
.new-hero-glow1,
.new-hero-glow2 {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}
.new-hero-glow1 {
  width: 400px; height: 400px;
   top: -100px; left: -100px;
}
.new-hero-glow2 {
  width: 300px; height: 300px;
   bottom: -80px; right: 400px;
}

/* ── Left Content ── */
.new-hero-content {
  flex: 1 1 0;
  min-width: 0;
  z-index: 1;
}

.new-hero-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.new-hero-breadcrumb a,
.new-hero-breadcrumb span {
  color: rgba(168, 200, 237, 0.75);
  font-size: 13px;
  text-decoration: none;
  font-family: 'Inter', sans-serif;
}
.new-hero-breadcrumb a:hover { color: #fff; }
.new-hero-breadcrumb span:last-child { color: rgba(255,255,255,0.4); }

.new-hero-h1 {
  font-family: serif;
  font-size: 48px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.1;
  margin: 0 0 10px 0;
  letter-spacing: -0.02em;
}

.new-hero-desc {
  font-family: Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.7;
  margin: 0 0 12px 0;
  max-width: 560px;
}
.new-hero-desc strong {
  color: #ffffff;
  font-weight: 700;
  font-style: normal;
}

/* ── Rating ── */
.new-hero-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 16px 0 28px;
}
.new-hero-stars {
  color: #f5a623;
  font-size: 20px;
  letter-spacing: 3px;
}
.new-hero-reviews {
  font-size: 13px;
  color: rgba(168, 200, 237, 0.75);
  font-family: 'Inter', sans-serif;
}

/* ── Buttons ── */
.new-hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.btn-primary-nh {
  display: inline-block;
  padding: 14px 32px;
  background: #f5a623;
  color: #ffffff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 600;
  border-radius: 2px;
  text-decoration: none;
  transition: background 0.2s, transform 0.15s;
  white-space: nowrap;
}
.btn-primary-nh:hover {
  background: #e09410;
  transform: translateY(-1px);
}

.btn-ghost-nh {
  display: inline-block;
  padding: 13px 30px;
  background: transparent;
  color: #ffffff;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 500;
  border: 2px solid rgba(255, 255, 255, 0.55);
  border-radius: 2px;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
  white-space: nowrap;
}
.btn-ghost-nh:hover {
  border-color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.08);
}

/* ── Right Image ── */
.new-hero-image {
  flex: 0 0 500px;
  max-width: 500px;
  height: 360px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  z-index: 1;
  overflow: hidden;
}
.new-hero-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center right;
  display: block;
}

/* ══ TABLET ══ */
@media (max-width: 1100px) {
  .new-hero-wrap {
    padding: 60px 40px;
    gap: 40px;
  }
  .new-hero-h1 { font-size: 32px; }
  .new-hero-image {
    flex: 0 0 380px;
    max-width: 380px;
    height: 280px;
  }
}

/* ══ MOBILE ══ */
@media (max-width: 768px) {
  .new-hero-wrap {
    flex-direction: column;
    padding: 90px 24px 48px;
    gap: 32px;
    text-align: center;
    align-items: center;
  }
  .new-hero-breadcrumb { justify-content: center; }
  .new-hero-h1 { font-size: 32px; }
  .new-hero-desc {
    font-size: 15px;
    max-width: 100%;
  }
  .new-hero-rating { justify-content: center; }
  .new-hero-actions {
    flex-direction: column;
    width: 100%;
    align-items: center;
  }
  .btn-primary-nh,
  .btn-ghost-nh {
    width: 100%;
    text-align: center;
    padding: 15px 20px;
  }
  .new-hero-image {
    flex: 0 0 auto;
    width: 100%;
    max-width: 340px;
    height: 260px;
    justify-content: center;
  }
  .new-hero-image img {
    object-position: center;
  }
}

@media (max-width: 480px) {
  .new-hero-h1 { font-size: 26px; }
  .new-hero-image {
    max-width: 280px;
    height: 210px;
  }
}

/* ══════════════════════════════════════════
   MAIN LAYOUT
   ══════════════════════════════════════════ */
.page-body {
  max-width: 1440px;
  margin: 0 auto;
  padding: 70px 60px 100px 80px;
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 50px;
  align-items: start;
}

.content {
  background: transparent;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
  min-width: 0;
}

/* ── Section Block ── */
.section-block {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: none solid var(--border);
}
.section-block:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.section-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}
.section-label::before {
  content: '';
  display: block;
  width: 24px; height: 1px;
  background: var(--gold);
}

/* ── H2 ── */
.section-block h2 {
  font-family: serif;
  font-size: clamp(2.5rem, 3vw, 2rem);
  font-weight: lighter;
  line-height: 1.15;
  color: #005EB8;
  margin-bottom: 15px;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  gap: 50px;
  width: fit-content;
  position: relative;
}
.section-block h2::before { display: none; }
.section-block h2,
.section-block h2 * { font-weight: lighter !important; }

.section-block p {
  font-size: clamp(1rem, 2.5vw, 1.3rem);
  color: #3d3a35;
  line-height: 1.8;
  margin-bottom: 18px;
}
body.light .section-block p { color: #3d3a35 !important; }
.section-block p:last-child  { margin-bottom: 0; }

/* ══════════════════════════════════════════
   BULLET POINTS (Blue Square Style)
   ══════════════════════════════════════════ */
.blue-bullets {
  list-style: none;
  padding: 0;
  margin: 24px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.blue-bullets {
  text-align: left !important;
  align-self: stretch;   /* never shrink-center inside a flex card (align-items:center) */
  width: 100%;
}
.blue-bullets li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: clamp(0.95rem, 2.5vw, 1.15rem);
  color: #3d3a35;
  line-height: 1.7;
  text-align: left !important;
}
/* Only the TEXT span flexes, NOT the bullet-sq */
.blue-bullets li > span:not(.bullet-sq) {
  text-align: left !important;
  flex: 1 1 auto;
  min-width: 0;
}

.blue-bullets li .bullet-sq {
  flex-shrink: 0;
  margin-top: 8px;
  width: 12px;
  height: 12px;
  background: #005EB8;
  display: inline-block;
}

.blue-bullets li span { display: inline; }

.bullets-source {
  margin-top: 12px;
  font-size: 1rem;
  font-style: italic;
  color: #7a7570;
}
.bullets-source a {
  color: #005EB8;
  text-decoration: none;
}
.bullets-source a:hover { text-decoration: underline; }
/* Inline links inside blue-bullets — keep them subtle but clearly clickable */
.blue-bullets li a {
  color: #005EB8;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 94, 184, 0.25);
  transition: border-color 0.18s ease, color 0.18s ease;
}
.blue-bullets li a:hover {
  color: #1e40af;
  border-bottom-color: #005EB8;
}
body:not(.light) .blue-bullets li a {
  color: #60a5fa;
  border-bottom-color: rgba(96, 165, 250, 0.3);
}
body:not(.light) .blue-bullets li a:hover {
  color: #93c5fd;
  border-bottom-color: #60a5fa;
}

/* AI Specialization premium cards (.aid-spec) */
.aid-spec {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.6rem;
  margin-top: 1.6rem;
}
.aid-spec__card {
  background: linear-gradient(160deg, rgba(0, 94, 184, 0.05), rgba(124, 58, 237, 0.04));
  border: 1px solid rgba(0, 94, 184, 0.2);
  border-radius: 18px;
  padding: 2rem 2rem 2.2rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0, 94, 184, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.aid-spec__card::before {
  content: '''';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #005EB8, #7c3aed);
}
.aid-spec__card:hover {
  transform: translateY(-3px);
  border-color: rgba(0, 94, 184, 0.4);
  box-shadow: 0 12px 36px rgba(0, 94, 184, 0.12);
}
.aid-spec__head {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-bottom: 1rem;
}
.aid-spec__icon {
  display: inline-flex;
  width: 52px;
  height: 52px;
  background: linear-gradient(135deg, #005EB8, #1e3a8a);
  color: #fff;
  border-radius: 12px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0, 94, 184, 0.25);
}
.aid-spec__icon svg {
  width: 28px;
  height: 28px;
}
.aid-spec__title {
  margin: 0;
  font-size: 1.45rem;
  color: var(--text);
  font-weight: 600;
  line-height: 1.25;
}
.aid-spec__lead {
  font-size: 0.98rem;
  line-height: 1.55;
  margin: 0 0 0.3rem;
  color: var(--text);
  opacity: 0.88;
}
.aid-spec__card .blue-bullets { margin-top: 14px; gap: 12px; }
.aid-spec__card .blue-bullets li { font-size: 0.95rem; line-height: 1.55; }

body:not(.light) .aid-spec__card {
  background: linear-gradient(160deg, rgba(96, 165, 250, 0.06), rgba(167, 139, 250, 0.05));
  border-color: rgba(96, 165, 250, 0.25);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
}
body:not(.light) .aid-spec__card:hover {
  border-color: rgba(96, 165, 250, 0.5);
  box-shadow: 0 12px 36px rgba(96, 165, 250, 0.12);
}

@media (max-width: 800px) {
  .aid-spec { grid-template-columns: 1fr; }
  .aid-spec__card { padding: 1.6rem 1.4rem 1.8rem; }
}

body:not(.light) .blue-bullets li { color: #c4bfb6; }

/* ══════════════════════════════════════════
   SERVICE GRID
   ══════════════════════════════════════════ */
.service-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 36px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  padding: 28px;
  position: relative;
  transition: box-shadow 0.22s, transform 0.22s, border-color 0.22s;
  overflow: hidden;
}
.service-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 0;
  background: var(--gold);
  transition: height 0.3s ease;
}
.service-card:hover {
  box-shadow: var(--shadow);
  transform: translateY(-2px);
  border-color: rgba(184,134,11,0.2);
}
.service-card:hover::before { height: 100%; }

.sc-num {
  font-family: serif;
  font-size: 2rem;
  color: var(--cream-mid);
  line-height: 1;
  margin-bottom: 12px;
  display: block;
}
.service-card h3 {
  font-family: serif;
  font-size: 1.1rem;
  font-weight: 400;
  color: #1a1814;
  margin-bottom: 10px;
  line-height: 1.3;
}
.service-card p {
  font-size: 0.875rem;
  color: #7a7570;
  line-height: 1.65;
  margin-bottom: 0;
}
body.light .service-card h3 { color: #1a1814 !important; }
body.light .service-card p  { color: #7a7570 !important; }

/* ══════════════════════════════════════════
   PROCESS STEPS
   ══════════════════════════════════════════ */
.process-steps {
  margin-top: 36px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.step {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 24px;
  padding: 28px 0;
  border-bottom: 1px solid var(--border);
  position: relative;
}
.step:last-child { border-bottom: none; }
.step-num {
  font-family: serif;
  font-size: 2.2rem;
  color: var(--gold-pale);
  line-height: 1;
  padding-top: 4px;
  position: relative;
}
.step-num::after {
  content: '';
  position: absolute;
  top: 18px; left: 100%;
  width: 24px; height: 1px;
  background: var(--border);
}
.step h3 {
  font-family: serif;
  font-size: 1.15rem;
  font-weight: 400;
  color: #1a1814;
  margin-bottom: 8px;
}
.step p {
  font-size: 0.9rem;
  color: #7a7570;
  line-height: 1.7;
  margin-bottom: 0;
}
body.light .step h3 { color: #1a1814 !important; }
body.light .step p  { color: #7a7570 !important; }

/* ══════════════════════════════════════════
   HIGHLIGHT BOX
   ══════════════════════════════════════════ */
.highlight-box {
  background: var(--ink);
  padding: 36px 40px;
  margin: 36px 0;
  position: relative;
  overflow: hidden;
}
.highlight-box::after {
  content: '';
  position: absolute;
  bottom: 0; right: 0;
  width: 200px; height: 200px;
  background: radial-gradient(circle at bottom right, rgba(184,134,11,0.2) 0%, transparent 70%);
}
.highlight-box p {
  font-family: serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.6;
  margin-bottom: 0;
}
.highlight-box .quote-attr {
  font-family: serif;
  font-size: 0.78rem;
  font-style: normal;
  color: var(--gold-light);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 16px;
  display: block;
}

/* ══════════════════════════════════════════
   TESTIMONIALS
   ══════════════════════════════════════════ */
.testimonial-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 32px;
}
.testimonial-card-new {
  background: var(--white);
  border: 1px solid var(--border);
  padding: 28px;
}
.stars-new { color: var(--gold); font-size: 0.85rem; margin-bottom: 14px; letter-spacing: 2px; }
.testimonial-card-new blockquote {
  font-family: serif;
  font-size: 0.975rem;
  font-style: italic;
  color: #3d3a35;
  line-height: 1.65;
  margin-bottom: 18px;
}
.testimonial-card-new .author {
  font-size: 0.78rem;
  font-weight: 600;
  color: #7a7570;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
body.light .testimonial-card-new blockquote { color: #3d3a35 !important; }
body.light .testimonial-card-new .author    { color: #7a7570 !important; }

/* ══════════════════════════════════════════
   EXPERT TESTIMONIAL SECTION
   ══════════════════════════════════════════ */
.expert-testimonial-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  border: 1px solid #d0d7e2;
  border-radius: 0;
  padding: 40px 48px;
  max-width: 100%;
  background: #ffffff;
  margin-top: 24px;
}
.expert-testimonial-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  flex-shrink: 0;
  width: 260px;
}
.expert-photo {
  width: 260px;
  height: 280px;
  overflow: hidden;
  border-radius: 0;
  /* now holds the INNERLUXES logo (not a portrait) — clean light panel */
  background: #eef4fb;
  border: 1px solid rgba(0, 94, 184, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
}
.expert-photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;   /* show the full logo, never crop/distort */
  padding: 34px;
  box-sizing: border-box;
  display: block;
}
body:not(.light) .expert-photo {
  background: #1e1c18;
  border-color: rgba(255, 255, 255, 0.10);
}
.expert-name {
  font-size: 22px;
  font-weight: 600;
  color: #1a1a2e;
  text-decoration: underline;
  text-underline-offset: 4px;
  margin: 0;
}
.expert-title {
  font-size: 15px;
  color: #555;
  margin: 0;
  line-height: 1.6;
}
.expert-testimonial-right {
  flex: 1;
  padding-left: 10px;
  padding-top: 10px;
  min-width: 0;
}
.quote-mark {
  font-size: 48px;
  font-family: Georgia, serif;
  color: #b3c5e0;
  line-height: 0.6;
  display: inline;
  margin-right: 6px;
  vertical-align: middle;
  position: static;
}
.expert-quote {
  font-size: 18px;
  color: #2a2a2a;
  line-height: 1.85;
  margin: 0;
  font-style: normal;
}
body:not(.light) .expert-testimonial-wrapper {
  background: #1e1c18 !important;
  border-color: rgba(255,255,255,0.08) !important;
}
body:not(.light) .expert-name { color: #e8e4dc !important; }
body:not(.light) .expert-name a {
  color: #60a5fa !important;
  text-decoration-color: #60a5fa !important;
}
body:not(.light) .expert-title  { color: #8a8580 !important; }
body:not(.light) .expert-quote  { color: #c4bfb6 !important; }
body:not(.light) .quote-mark    { color: #3a3530 !important; }
body.light .expert-testimonial-wrapper {
  background: #ffffff !important;
  border-color: #d0d7e2 !important;
}
body.light .expert-name { color: #1a1a2e !important; }
body.light .expert-name a {
  color: #1a1a2e !important;
  text-decoration-color: #1a1a2e !important;
}
body.light .expert-title  { color: #555 !important; }
body.light .expert-quote  { color: #2a2a2a !important; }
.expert-name a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.expert-name a:hover { opacity: 0.75; }
/* portrait variant: a headshot fills the panel, unlike the padded logo above */
.expert-photo.has-portrait {
  background: #eef4fb;
}
.expert-photo.has-portrait img {
  object-fit: cover;
  object-position: 50% 12%;
  padding: 0;
}
body:not(.light) .expert-photo.has-portrait { background: #1e1c18; }
.expert-testimonial-left .expert-info p,
.expert-testimonial-left .expert-title {
  font-size: 15px !important;
  line-height: 1.6 !important;
  margin-bottom: 0 !important;
}
.expert-testimonial-wrapper .quote-mark {
  font-size: 48px !important;
  line-height: 0.6 !important;
  display: inline !important;
  margin-bottom: 0 !important;
  vertical-align: middle !important;
}
.expert-testimonial-wrapper .expert-quote {
  font-size: 18px !important;
  line-height: 1.85 !important;
  margin: 0 !important;
}

/* ══════════════════════════════════════════
   TABLE OF CONTENTS — STICKY BUG FIX
   ══════════════════════════════════════════ */
.toc-wrap {
  position: sticky;
  top: 120px;                       /* fixed header (~92px) + topbar + breathing room */
  align-self: start;               /* prevents grid stretch */
  max-height: calc(100vh - 140px); /* limits height accounting for top offset */
  overflow-y: auto;                /* internal scroll if TOC is long */
  padding-top: 4px;                /* extra cushion above heading */
}

/* Mobile: smaller offset since mobile header behaves differently */
@media (max-width: 900px) {
  .toc-wrap {
    top: 70px;
    max-height: calc(100vh - 90px);
  }
}
.toc {
  background: transparent;
  border: none;
  box-shadow: none;
  overflow: visible;
  border-radius: 0;
  padding-left: 4px;
}
.toc-header {
  background: transparent;
  padding: 0 0 18px 0;
  border-bottom: none;
}
.toc-header span {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  position: relative;
  display: inline-block;
  padding-bottom: 10px;
}
.toc-header span::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 32px;
  height: 1.5px;
  background: linear-gradient(90deg, #005EB8 0%, #1e88e5 50%, rgba(0, 94, 184, 0.1) 100%);
}
.toc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-left: 1px solid rgba(0, 94, 184, 0.22);
  position: relative;
}
.toc-list li { position: relative; }
.toc-list li a {
  display: block;
  padding: 9px 0 9px 18px;
  font-size: 0.82rem;
  color: var(--ink-muted);
  text-decoration: none;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  letter-spacing: 0.005em;
  line-height: 1.35;
  border-left: 2px solid transparent;
  margin-left: -1px;
  transition: color 0.25s ease, border-color 0.25s ease, padding-left 0.2s ease, font-weight 0.2s ease;
}
.toc-list li a:hover {
  color: #005EB8;
  font-weight: 600;
  border-left-color: rgba(0, 94, 184, 0.5);
  padding-left: 22px;
}
.toc-list li a.toc-active {
  color: #005EB8;
  font-weight: 700;
  border-left-color: #005EB8;
  padding-left: 22px;
}
.toc-list li a .toc-num { display: none; }
.toc-cta {
  margin: 22px 0 0 0;
  background: linear-gradient(155deg, rgba(0, 94, 184, 0.08) 0%, rgba(0, 94, 184, 0.02) 100%);
  border: 1px solid rgba(0, 94, 184, 0.18);
  border-left: 3px solid #005EB8;
  padding: 14px 16px;
  border-radius: 0;
  position: relative;
}
.toc-cta::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 1.5px;
  background: linear-gradient(90deg, transparent 0%, #005EB8 50%, transparent 100%);
  opacity: 0.6;
}
.toc-cta p {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.78rem;
  font-style: italic;
  color: var(--ink-soft);
  line-height: 1.55;
  margin-bottom: 0;
}
.toc-cta a   { display: none; }
.toc-trust   { display: none; }

/* ── TOC "Schedule a call" — on hover the line fades out and a full-width
   button slides in left→right over the whole block ── */
.toc-cta { position: relative; }
.toc-cta p { transition: opacity .25s ease; }
.toc-cta:hover p,
.toc-cta:focus-within p { opacity: 0; }
/* button fills the entire CTA block, edge to edge */
.toc-cta-btn-wrap {
  position: absolute;
  inset: 0;
  display: flex;
  overflow: hidden;
  z-index: 2;
}
.toc-cta .toc-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 8px 14px;
  background: #005EB8;
  color: #fff;
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: .015em;
  text-decoration: none;
  border-radius: 0;
  white-space: nowrap;
  cursor: pointer;
  transform: translateX(-110%);
  opacity: 0;
  transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .32s ease, background-color .16s ease;
}
.toc-cta:hover .toc-cta-btn,
.toc-cta:focus-within .toc-cta-btn { transform: translateX(0); opacity: 1; }
.toc-cta .toc-cta-btn:hover { background: #004484; }
.toc-cta .toc-cta-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
body:not(.light) .toc-cta .toc-cta-btn { background: #2563eb; }
body:not(.light) .toc-cta .toc-cta-btn:hover { background: #1d4ed8; }
/* Touch devices (no hover): show the button statically below the line */
@media (hover: none) {
  .toc-cta:hover p { opacity: 1; }
  .toc-cta-btn-wrap { position: static; overflow: visible; margin-top: 12px; }
  .toc-cta .toc-cta-btn { transform: none; opacity: 1; height: auto; padding: 9px 16px; }
}

/* Premium TOC scrollbar (when TOC itself overflows) */
.toc-wrap { scrollbar-width: thin; scrollbar-color: rgba(0, 94, 184, 0.4) transparent; }
.toc-wrap::-webkit-scrollbar         { width: 4px; }
.toc-wrap::-webkit-scrollbar-track   { background: transparent; }
.toc-wrap::-webkit-scrollbar-thumb   { background: rgba(0, 94, 184, 0.35); border-radius: 0; }
.toc-wrap::-webkit-scrollbar-thumb:hover { background: rgba(0, 94, 184, 0.6); }

/* ══════════════════════════════════════════
   STATS GRID
   ══════════════════════════════════════════ */
* { box-sizing: border-box; }

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1.45fr;
  grid-template-rows: 120px 120px 130px;
  gap: 8px;
}

@media (max-width: 600px) {
  .grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 8px;
  }
  .photo-tall {
    grid-column: 1 / 3 !important;
    grid-row: auto !important;
    height: 220px;
    order: -1;
  }
  .card { min-height: 90px; }
  .photo { height: 110px; }
  .num { font-size: 20px; }
}

.card {
  border-radius: 0;
  padding: 11px 14px 14px;
  position: relative;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.card:hover { filter: brightness(0.96); }
.c1 { background: #d3ece2; }
.c2 { background: #cbe2f3; }
.c3 { background: #dbd3ed; }
.c4 { background: #f4efca; }

.arr {
  position: absolute;
  top: 8px; right: 8px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(255,255,255,0.6);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; color: #444;
}

.num {
  font-size: 24px;
  font-weight: 700;
  color: #1a1a2e;
  line-height: 1.1;
  margin-bottom: 3px;
}
.lbl { font-size: 12px; color: #2a2a2a; font-weight: 400; }

.photo-tall {
  grid-column: 3;
  grid-row: 1 / 4;
  border-radius: 0;
  overflow: hidden;
  position: relative;
  background: #eee;
}
.photo {
  border-radius: 0;
  overflow: hidden;
  position: relative;
  background: #eee;
}
.slot { position: absolute; inset: 0; }
.slot img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: opacity 0.6s ease;
}

.nav {
  display: flex; justify-content: flex-end;
  gap: 6px; margin-top: 8px;
}
.nbtn {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1.5px solid #ccc; background: #fff;
  font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #555;
  touch-action: manipulation;
}
.nbtn:hover  { background: #f0f0f0; }
.nbtn:active { background: #e0e0e0; }

/* ── Modal Overlay ── */
.ov {
  display: none; position: fixed; inset: 0;
  background: rgba(0, 23, 56, 0.45);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 9999; align-items: center; justify-content: center;
}
.ov.on { display: flex; }
.modal {
  background: var(--cream);
  border-top: 3px solid #005EB8;
  border-radius: 0;
  padding: 40px 28px 36px; max-width: 480px; width: 90%;
  position: relative; text-align: center;
  box-shadow: 0 12px 48px rgba(0, 94, 184, 0.20);
}
.mcls {
  position: absolute; top: 10px; right: 12px;
  font-size: 18px; cursor: pointer; color: #005EB8;
  background: rgba(0, 94, 184, 0.06);
  border: 1px solid rgba(0, 94, 184, 0.18);
  line-height: 1;
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  padding: 0;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.mcls:hover {
  background: #005EB8;
  color: #fff;
  border-color: #005EB8;
}
.mnum { font-size: 44px; font-weight: 800; color: #005EB8; margin-bottom: 5px; }
.mtit { font-size: 14px; color: var(--ink-soft); margin-bottom: 18px; }
.mbod { font-size: 15px; color: var(--ink); line-height: 1.8; }
body:not(.light) .modal { background: var(--cream); border-top-color: #60a5fa; box-shadow: 0 12px 48px rgba(96, 165, 250, 0.18); }
body:not(.light) .mcls { color: #60a5fa; background: rgba(96, 165, 250, 0.08); border-color: rgba(96, 165, 250, 0.22); }
body:not(.light) .mcls:hover { background: #60a5fa; color: #1a1814; border-color: #60a5fa; }
body:not(.light) .mnum { color: #60a5fa; }

/* ── Stats Section ── */
.stats-section {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 0px 0 32px 0;
  margin-top: 1px;
}
.stat-item {
  flex: 1 1 180px;
  padding: 8px 24px 8px 20px;
  border-right: 1px solid #e0e0e0;
}
.stat-item:last-child {
  border-right: none;
  padding-right: 0;
}
.stat-num {
  font-size: 32px;
  font-weight: 500;
  color: #1e6fc7;
  margin-bottom: 6px;
}
.stat-desc {
  font-size: 18px;
  color: #555;
  line-height: 1.5;
}
@media (max-width: 560px) {
  .stat-item {
    flex: 1 1 140px;
    border-right: none;
    border-bottom: 1px solid #e0e0e0;
    padding: 12px 0;
  }
  .stat-item:last-child { border-bottom: none; }
  .stat-num  { font-size: 26px; }
  .stat-desc { font-size: 15px; }
}

/* ══════════════════════════════════════════
   RESPONSIVE — MAIN BREAKPOINTS
   ══════════════════════════════════════════ */

@media (max-width: 1024px) {
  .page-body {
    padding: 50px 40px 80px;
    gap: 40px;
  }
}

@media (max-width: 900px) {
  .page-body {
    grid-template-columns: 1fr;
    padding: 40px 24px 60px;
  }
  .toc-wrap             { display: none; }
  .service-grid         { grid-template-columns: 1fr; }
  .testimonial-grid     { grid-template-columns: 1fr; }
  .saas-types-grid      { grid-template-columns: repeat(2, 1fr); }
  .scope-grid           { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .page-body {
    padding: 28px 16px 48px;
    gap: 0;
  }
  .section-block { margin-bottom: 24px; padding-bottom: 24px; }
  .section-block h2 { gap: 16px; }
  .service-grid         { grid-template-columns: 1fr; gap: 14px; margin-top: 24px; }
  .testimonial-grid     { grid-template-columns: 1fr; gap: 14px; margin-top: 20px; }
  .saas-types-grid      { grid-template-columns: 1fr; gap: 14px; margin-top: 24px; }
  .scope-grid           { grid-template-columns: 1fr; gap: 14px; margin-top: 24px; }
  .service-card { padding: 20px 18px; }
  .step { grid-template-columns: 40px 1fr; gap: 16px; padding: 20px 0; }
  .step-num { font-size: 1.6rem; }
  .step-num::after { width: 12px; }
  .highlight-box { padding: 24px 20px; margin: 24px 0; }
  .highlight-box p { font-size: 1.1rem; }
  .testimonial-card-new { padding: 20px 16px; }
  .expert-testimonial-wrapper {
    flex-direction: column;
    padding: 24px 20px;
    gap: 24px;
    align-items: center;
  }
  .expert-testimonial-left {
    width: 100%;
    max-width: 200px;
  }
  .expert-photo {
    width: 160px;
    height: 180px;
  }
  .expert-name { font-size: 18px; }
  .expert-title { font-size: 13px; }
  .expert-testimonial-right {
    padding-left: 0;
    padding-top: 0;
    width: 100%;
  }
  .expert-testimonial-wrapper .expert-quote { font-size: 15px !important; }
  .expert-testimonial-wrapper .quote-mark   { font-size: 36px !important; }
  .cta-banner-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 18px;
    gap: 20px;
  }
  .cta-banner-btn { width: 100%; }
  .cta-banner-h2  { font-size: 1.15rem; }
  .cta-banner-p   { font-size: 0.9rem; }
  .scope-card-body { padding: 20px 18px 24px; }
  .scope-card-body h3 { font-size: 1.25rem; margin-bottom: 20px; }
  .scope-card-body p  { font-size: 1rem !important; }
  .saas-type-card { padding: 24px 20px 28px; }
  .saas-type-card h3 { font-size: 1.1rem; }
  .saas-type-list li { font-size: 0.95rem; }
  .grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .photo-tall {
    grid-column: 1 / 3;
    grid-row: auto;
    height: 200px;
    order: -1;
  }
}

@media (max-width: 380px) {
  .page-body { padding: 20px 12px 40px; }
  .new-hero-h1 { font-size: 20px; }
  .section-block h2 { font-size: 1.2rem; }
}

/* ── Light mode overrides ── */
body.light .toc-header span                   { color: #1a1814; }
body.light .toc-list li a                     { color: #aab0bc; }
body.light .toc-list li a.toc-active          { color: #005EB8; }
body.light .section-block h2                  { color: #005EB8; }
body.light .section-block p                   { color: #3d3a35; }
body.light .service-card h3                   { color: #1a1814; }
body.light .service-card p                    { color: #7a7570; }
body.light .step h3                           { color: #1a1814; }
body.light .step p                            { color: #7a7570; }
body.light .testimonial-card-new blockquote   { color: #3d3a35; }
body.light .testimonial-card-new .author      { color: #7a7570; }
body.light .blue-bullets li                   { color: #3d3a35; }

/* ── Dark mode card/step/testimonial overrides ── */
body.dark .service-card h3                    { color: #e8e4dc !important; }
body.dark .service-card p                     { color: #8a8580 !important; }
body.dark .step h3                            { color: #e8e4dc !important; }
body.dark .step p                             { color: #8a8580 !important; }
body.dark .testimonial-card-new blockquote    { color: #c4bfb6 !important; }
body.dark .testimonial-card-new .author       { color: #8a8580 !important; }
body.dark-mode .service-card h3               { color: #e8e4dc !important; }
body.dark-mode .service-card p                { color: #8a8580 !important; }
body.dark-mode .step h3                       { color: #e8e4dc !important; }
body.dark-mode .step p                        { color: #8a8580 !important; }
body.dark-mode .testimonial-card-new blockquote { color: #c4bfb6 !important; }
body.dark-mode .testimonial-card-new .author  { color: #8a8580 !important; }

/* ══════════════════════════════════════════
   H2 ANCHOR LINK SYSTEM
   ══════════════════════════════════════════ */
.anchor-link {
  display: inline-flex;
  align-items: center;
  opacity: 0;
  color: #005EB8;
  font-size: 0.60em;
  transition: opacity 0.2s ease;
  cursor: pointer;
  text-decoration: none;
  flex-shrink: 0;
  line-height: 1;
}
.section-block h2:hover .anchor-link { opacity: 1; }
@media (hover: none) {
  .anchor-link { opacity: 0.5; }
}
.anchor-link svg { width: 1em; height: 1em; }

.anchor-copied-tip {
  position: fixed;
  background: #1a1814;
  color: #fff;
  font-family: serif;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
  z-index: 9999;
  white-space: nowrap;
}
.anchor-copied-tip.visible { opacity: 1; }

/* ══════════════════════════════════════════
   SAAS TYPES GRID
   ══════════════════════════════════════════ */
.saas-types-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 36px;
}

.saas-type-card {
  background: #ffffff;
  border: 1px solid rgba(26,24,20,0.12);
  padding: 36px 28px 40px;
}

.saas-type-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 20px;
}
.saas-type-icon svg {
  width: 72px;
  height: 72px;
}

.saas-type-card h3 {
  font-family: serif;
  font-size: 1.8rem;
  font-weight: 600;
  color: #005EB8;
  margin-bottom: 18px;
  line-height: 1.4;
  text-decoration: none;
  text-underline-offset: 4px;
}

.saas-type-card h3:has(a) {
  text-decoration: underline;
  text-decoration-color: #005EB8;
}

.saas-type-card h3 a {
  color: inherit;
  text-decoration: none;
}

.saas-type-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.saas-type-list {
  text-align: left !important;
  list-style: none;
  padding: 0;
  margin: 0;
  align-self: stretch;   /* never shrink-center inside a flex card (align-items:center) */
  width: 100%;
}
/* Block layout (NOT flex) — keeps inline text + links flowing naturally,
   no gap between text and link, wrapped lines indent properly under text */
.saas-type-list li {
  display: block;
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  font-size: 1.20rem;
  color: #3d3a35;
  line-height: 2;
  text-align: left !important;
}
.saas-type-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 11px;
  height: 11px;
  background: #005EB8;
  display: block;
}

@media (max-width: 1100px) {
  .saas-types-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .saas-types-grid { grid-template-columns: 1fr; }
}

body:not(.light) .saas-type-card                  { background: #1e1c18 !important; border-color: rgba(255,255,255,0.1) !important; }
body:not(.light) .saas-type-card h3               { color: #e8e4dc !important; }
body:not(.light) .saas-type-list li               { color: #8a8580 !important; }
body:not(.light) .saas-type-icon svg line,
body:not(.light) .saas-type-icon svg rect,
body:not(.light) .saas-type-icon svg path,
body:not(.light) .saas-type-icon svg circle       { stroke: #8a8580; }

body.light .saas-type-card h3  { color: #1a1814 !important; }
body.light .saas-type-list li  { color: #7a7570 !important; }

/* ══════════════════════════════════════════
   CTA BANNER SECTION
   ══════════════════════════════════════════ */
/* ─────────────────────────────────────────────────────────────────────────
   CTA "button-text" card — matches the /software-development/custom
   "Looking for direct client references?" (.a-button-text) design: white card,
   soft shadow (no cream banner / no gold border), sans dark heading, grey copy,
   and a square blue button on the right. Shared across ~1546 pages via THIS
   block only; page markup is untouched (structure verified uniform).
   ───────────────────────────────────────────────────────────────────────── */
.cta-banner-section {
  margin: 40px 0;
  background: #ffffff;
  border: none;
  border-radius: 0;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.10);
  transition: box-shadow 0.3s ease;
}
.cta-banner-section:hover { box-shadow: 0 2px 20px rgba(0, 0, 0, 0.20); }

.cta-banner-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 28px 32px;
}

.cta-banner-text { flex: 1; min-width: 0; }

.cta-banner-h2 {
  font-family: "DM Sans", system-ui, -apple-system, sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #222;
  margin: 0 0 12px 0;
  line-height: 1.28;
  letter-spacing: normal;
}

.cta-banner-p {
  font-size: 16px;
  color: #3b3c3d;
  line-height: 1.75;
  margin: 0;
}

.cta-banner-action {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  min-width: 190px;
  max-width: 220px;
  margin-left: 20px;
}

.cta-banner-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 190px;
  padding: 15.5px 24px;
  background: #005EB8;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  border-radius: 0;
  line-height: 1.35;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out;
}
.cta-banner-btn:hover { background: #004688; }

/* ── dark mode ── */
body:not(.light) .cta-banner-section {
  background: #1e1c18 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
}
body:not(.light) .cta-banner-section:hover { box-shadow: 0 2px 20px rgba(0, 0, 0, 0.50); }
body:not(.light) .cta-banner-h2 { color: #e8e4dc !important; }
body:not(.light) .cta-banner-p  { color: #c4bfb6 !important; }
body:not(.light) .cta-banner-btn { background: #005EB8; }
body:not(.light) .cta-banner-btn:hover { background: #2563eb; }

@media (max-width: 680px) {
  .cta-banner-section { margin: 32px 0; }
  .cta-banner-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px 20px;
    gap: 20px;
  }
  .cta-banner-action { margin-left: 0; max-width: none; width: 100%; min-width: 0; }
  .cta-banner-h2 { font-size: 20px; }
  .cta-banner-p { font-size: 15px; }
}

/* ══════════════════════════════════════════
   SCOPE GRID
   ══════════════════════════════════════════ */
.scope-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 36px;
  border: none;
}

.scope-card {
  background: #ffffff;
  border: 1px solid #dde2ea;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
  border-radius: 0;
}

.scope-card-top {
  height: 9px;
  background: #005EB8;
  flex-shrink: 0;
}

.scope-card-body {
  padding: 28px 24px 32px;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
/* Bullet lists inside scope cards: the card body centers its content, which shrink-centers
   the list block — force lists full-width & left so the bullets sit at the card's left edge. */
.scope-card-body .saas-type-list,
.scope-card-body .card-list,
.scope-card-body .blue-bullets,
.scope-card-body ul {
  align-self: stretch;
  width: 100%;
  text-align: left;
}

.scope-card-body h3 {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1a2e;
  margin: 0 0 34px 0;
  line-height: 1.4;
  text-align: center;
}

.scope-card-body h3 a {
  color: #005EB8;
  text-decoration: underline;
  text-decoration-color: #005EB8;
  text-underline-offset: 3px;
  font-weight: 700;
}
.scope-card-body h3 a:hover { color: #0047a0; }

.scope-card-body p {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem !important;
  color: #3d3a35 !important;
  line-height: 1.72 !important;
  margin: 0 !important;
  text-align: left;
  width: 100%;
}

.scope-card-body p a {
  color: #005EB8;
  text-decoration: underline;
  text-decoration-color: #005EB8;
  text-underline-offset: 2px;
}
.scope-card-body p a:hover { color: #0047a0; }

@media (max-width: 1100px) {
  .scope-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .scope-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  .scope-grid { grid-template-columns: 1fr; }
}

body:not(.light) .scope-grid {
  border: none !important;
}
body:not(.light) .scope-card {
  background: #1e1c18 !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: none !important;
}
body:not(.light) .scope-card-body h3,
body:not(.light) .scope-card-body h3 a {
  color: #e8e4dc !important;
}
body:not(.light) .scope-card-body p {
  color: #8a8580 !important;
}

body.light .scope-card               { background: #ffffff !important; border-color: #dde2ea !important; }
body.light .scope-card-body h3       { color: #1a1a2e !important; }
body.light .scope-card-body h3 a     { color: #005EB8 !important; }
body.light .scope-card-body p        { color: #3d3a35 !important; }

/* ══════════════════════════════════════════
   MOBILE SIDEBAR — Brand Blue, Left Slide In
   ══════════════════════════════════════════ */

.mobile-nav-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 998;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.mobile-nav-overlay.active {
  display: block;
  opacity: 1;
}

.mobile-nav-header {
  display: none;
}
.mobile-nav-footer {
  display: none;
}

.nav-item-contact {
  display: none;
}

@media (max-width: 1279px) {

  .nav-item-contact {
    display: block;
  }

  .site-header.shrink {
    padding: 0.75rem 1rem;
    border-radius: 0;
    max-width: 100%;
    margin: 0;
    left: 0;
    right: 0;
    transform: none;
    top: 0;
    background: rgba(255, 255, 255, 0.98);
    border: none; /* No border — eliminates visible seam between header and colored hero */
  }

  body:not(.light) .site-header.shrink {
    background: rgba(17, 21, 32, 0.98);
    border: none;
  }

  .site-header.shrink .logo-icon { width: 36px; height: 36px; }
  .site-header.shrink .logo-text { font-size: 1.1rem; opacity: 1; }

  .site-header {
    padding: 0; /* topbar + header-main handle their own padding */
    background: #005EB8;
    border: none; /* No border — eliminates visible seam between header and colored hero */
    border-radius: 0;
    max-width: 100%;
    margin: 0;
    left: 0;
    right: 0;
  }

  body:not(.light) .site-header {
    background: rgba(17, 21, 32, 0.98);
    border: none;
  }

  .header-actions-mobile {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
  }

  .header-actions-mobile .theme-toggle {
    display: inline-flex;
    width: 40px;
    height: 40px;
    border-radius: 50%;
  }

  .nav-toggle {
    display: inline-flex;
    z-index: 1001;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: transparent;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    color: var(--text);
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  body:not(.light) .nav-toggle {
    border-color: var(--border);
  }

  .nav-actions .theme-toggle { display: none; }

  .site-nav,
  .site-header.shrink .site-nav {
    position: fixed;
    top: 0;
    left: -100%;
    right: auto;
    width: 85%;
    max-width: 320px;
    height: 100vh;
    height: 100dvh;
    flex-direction: column;
    background: #005EB8;
    padding: 0;
    border: none;
    border-radius: 0;
    z-index: 999;
    overflow: hidden;
    transition: left 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 10px 0 40px rgba(0, 0, 0, 0.25);
  }

  .site-nav.open,
  .site-header.shrink .site-nav.open {
    left: 0;
    display: flex;
  }

  .mobile-nav-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    min-height: 56px;
  }

  .mobile-nav-brand {
    display: flex !important;
    align-items: center;
    gap: 0.6rem;
  }

  .mobile-nav-brand .logo-icon {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    animation: none;
    filter: brightness(10) !important;
  }

  .mobile-nav-brand h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.04em;
  }

  .mobile-nav-close {
    display: flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    color: #fff;
    font-size: 1.1rem;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.2s ease;
    line-height: 1;
  }

  .mobile-nav-close:hover {
    background: rgba(255, 255, 255, 0.25);
  }

  .nav-links,
  .site-header.shrink .nav-links {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 6px 0;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    max-width: 100%;
  }

  .nav-links::-webkit-scrollbar { width: 4px; }
  .nav-links::-webkit-scrollbar-track { background: transparent; }
  .nav-links::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.25);
    border-radius: 2px;
  }

  .nav-item {
    padding: 0;
    margin: 2px 10px;
    border-bottom: none;
    position: relative;
  }

  .nav-item.has-dropdown > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 11px 14px;
    font-size: 0.88rem;
    font-weight: 500;
    color: #fff;
    gap: 0.5rem;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
    background: rgba(255, 255, 255, 0.08);
  }

  /* No leading icon on the mobile/tablet nav rows -- see styles.css. */

  .nav-item.has-dropdown > a::after {
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.7)' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.3s ease;
    flex-shrink: 0;
  }

  .nav-item.has-dropdown > a:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.2);
  }

  .nav-item.has-dropdown.active > a {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.3);
  }

  .nav-item.has-dropdown.active > a::after {
    transform: rotate(180deg);
  }

  /* Plain top-level nav items (no dropdown, no contact) — e.g., Pricing in healthcare-header */
  .nav-item:not(.has-dropdown):not(.nav-item-contact) > a {
    display: flex;
    align-items: center;
    padding: 11px 14px;
    font-size: 0.88rem;
    font-weight: 500;
    color: #fff;
    gap: 0.5rem;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid transparent;
    transition: all 0.2s ease;
    text-decoration: none;
  }
  .nav-item:not(.has-dropdown):not(.nav-item-contact) > a:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.2);
  }

  .nav-item-contact {
    padding: 0;
    margin: 2px 10px;
  }

  .nav-item-contact > a {
    display: flex;
    align-items: center;
    padding: 11px 14px;
    font-size: 0.88rem;
    font-weight: 500;
    color: #fff;
    gap: 0.5rem;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid transparent;
    transition: all 0.2s ease;
  }

  .nav-item-contact > a:hover {
    background: rgba(255, 255, 255, 0.15);
  }

  .nav-item.has-dropdown .dropdown {
    position: static;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .nav-item.has-dropdown .dropdown::before { display: none; }

  .nav-item.has-dropdown.active .dropdown {
    max-height: 600px;
    margin-top: 3px;
    padding-left: 6px;
    border-left: 2px solid rgba(255, 255, 255, 0.2);
    margin-left: 6px;
  }

  .dropdown-section-title {
    padding: 8px 6px 4px 6px;
    font-size: 0.62rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 0;
  }

  .dropdown-header { display: none; }

  .dropdown-footer {
    display: flex;
    padding: 6px 8px;
    margin-top: 4px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }

  .dropdown-footer .link {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.8);
    padding: 6px 8px;
    border-radius: 4px;
    margin: 0;
    width: 100%;
  }

  .dropdown-footer .link:hover {
    background: rgba(255, 255, 255, 0.1);
  }

  .dropdown-footer .link::after {
    content: "→";
    margin-left: auto;
    border: none;
    transform: none;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.8rem;
  }

  .dropdown-wide {
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0;
    max-height: none;
    padding: 4px 0;
  }

  .dropdown-section {
    margin-bottom: 0;
    padding: 2px 0;
    flex: none !important;
    width: 100% !important;
  }

  .dropdown-wide .dropdown-section { flex: none !important; width: 100% !important; }

  .dropdown-grid,
  .dropdown-wide .dropdown-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    grid-template-columns: none !important;
  }

  .dropdown-item,
  .dropdown-wide .dropdown-item {
    padding: 8px 10px;
    font-size: 0.78rem;
    gap: 0.5rem;
    border-radius: 4px;
    margin: 1px 4px;
    color: rgba(255, 255, 255, 0.85);
    background: transparent;
    border: none;
    display: flex;
    align-items: center;
  }

  .dropdown-item:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    transform: translateX(3px);
  }

  .dropdown-item img {
    width: 16px;
    height: 16px;
    filter: brightness(1.5);
    opacity: 0.85;
  }

  .nav-item.has-dropdown:nth-child(1) .dropdown-item,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item *,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item span,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item p,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item h4,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item small {
    color: rgba(255, 255, 255, 0.85) !important;
  }

  .nav-item.has-dropdown:nth-child(1) .dropdown-item:hover,
  .nav-item.has-dropdown:nth-child(1) .dropdown-item:hover * {
    color: #fff !important;
  }

  .nav-item.has-dropdown:hover .dropdown { max-height: 0; }
  .nav-item.has-dropdown.active .dropdown,
  .nav-item.has-dropdown.active:hover .dropdown { max-height: 600px; }

  .mobile-nav-footer {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.15);
    margin-top: auto;
  }

  .mobile-nav-footer-label {
    font-size: 0.68rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.45);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 2px;
  }

  .mobile-nav-footer-row {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .mobile-nav-quick-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 9px 12px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 5px;
    font-size: 0.82rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    flex: 1;
    transition: background 0.2s ease;
  }

  .mobile-nav-quick-btn:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
  }

  .mobile-nav-quick-btn svg {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    opacity: 0.9;
  }

  .mobile-nav-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 11px 20px;
    background: #fff;
    color: #005EB8;
    border: none;
    border-radius: 5px;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    width: 100%;
    transition: background 0.2s ease;
  }

  .mobile-nav-cta:hover {
    background: rgba(255, 255, 255, 0.9);
  }

  .mobile-nav-cta svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
  }

  .nav-actions { display: none; }
}
/* ── Costs Section Heading ── */
.costs-heading-wrap {
  display: flex;
  align-items: flex-start;
  gap: 0;
  margin-bottom: 24px;
}
 
.costs-heading-bar {
  width: 10px;
  min-height: 80px;
  background: #c8ddf5;
  flex-shrink: 0;
  margin-right: 20px;
  align-self: stretch;
}
 
.costs-heading-wrap h2 {
  margin-bottom: 0 !important;
}
 
/* ── 3-column cards grid ── */
.costs-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 36px;
  margin-bottom: 28px;
}
 
/* ── Individual cost card ── */
.costs-card {
  border: 1px solid rgba(26,24,20,0.12);
  border-radius: 4px;
  padding: 36px 28px 32px;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: box-shadow 0.22s, transform 0.2s;
}
.costs-card:hover {
  box-shadow: 0 6px 28px rgba(0,94,184,0.10);
  transform: translateY(-3px);
}
 
.costs-card-icon {
  width: 96px;
  height: 96px;
  margin-bottom: 20px;
}
.costs-card-icon svg {
  width: 96px;
  height: 96px;
}
 
.costs-card-price {
  font-family: serif;
  font-size: 1.65rem;
  font-weight: 700;
  color: #1a1814;
  margin-bottom: 14px;
  letter-spacing: -0.01em;
}
 
.costs-card-desc {
  font-size: 1.3rem !important;
  color: #3d3a35 !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}
 
/* ── Note below cards ── */
.costs-note {
  font-size: 0.95rem !important;
  color: #7a7570 !important;
  margin-top: 8px !important;
  text-align: center;
}
.costs-note a {
  color: #005EB8;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500;
}
.costs-note a:hover { color: #0047a0; }
 
/* ── Responsive ── */
@media (max-width: 900px) {
  .costs-cards-grid { grid-template-columns: 1fr; max-width: 420px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 640px) {
  .costs-cards-grid { max-width: 100%; gap: 14px; margin-top: 24px; }
  .costs-card { padding: 28px 20px 24px; }
  .costs-card-price { font-size: 1.4rem; }
  .costs-heading-bar { min-height: 60px; }
}
 
/* ── Dark mode ── */
body:not(.light) .costs-card {
  background: #1e1c18 !important;
  border-color: rgba(255,255,255,0.1) !important;
}
body:not(.light) .costs-card-price { color: #e8e4dc !important; }
body:not(.light) .costs-card-desc  { color: #8a8580 !important; }
body:not(.light) .costs-note       { color: #6b6760 !important; }
body:not(.light) .costs-card-icon svg line,
body:not(.light) .costs-card-icon svg path,
body:not(.light) .costs-card-icon svg circle,
body:not(.light) .costs-card-icon svg rect { stroke: #8a8580; }
body:not(.light) .costs-heading-bar { background: #2a3a50; }







/* ═══════════════════════════════════════════════════════
   BENEFITS / WHY CHOOSE US — Section Styles
   File: benefits-section.css
   Append to styles-page.css or paste into a <style> tag
   ═══════════════════════════════════════════════════════ */

/* ── Grid: 2 columns ── */
.benefits-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 32px;
}

/* ── Individual card ── */
.benefit-card {
  border: 1px solid rgba(26, 24, 20, 0.13);
  border-radius: 3px;
  padding: 36px 32px 32px;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: box-shadow 0.22s, transform 0.2s, border-color 0.22s;
}

.benefit-card:hover {
  box-shadow: 0 6px 30px rgba(230, 168, 23, 0.10);
  transform: translateY(-2px);
  border-color: rgba(230, 168, 23, 0.30);
}

/* ── Icon ── */
.benefit-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.benefit-icon svg {
  width: 72px;
  height: 72px;
}

/* ── Title — bold, no link style by default ── */
.benefit-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1814;
  margin: 0 0 14px 0;
  line-height: 1.35;
  /* No underline unless .benefit-linked is present */
  text-decoration: none;
}

/* ── Title WITH link — underline shown ── */
.benefit-title.benefit-linked {
  text-decoration: underline;
  text-decoration-color: #1a1814;
  text-underline-offset: 4px;
  cursor: pointer;
}
.benefit-title.benefit-linked:hover {
  color: #e6a817;
  text-decoration-color: #e6a817;
}

/* ── Description ── */
.benefit-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: 1.3rem !important;
  color: #3d3a35 !important;
  line-height: 1.72 !important;
  margin: 0 !important;
  text-align: center;
}

.benefit-desc a {
  color: #1a1814;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(26, 24, 20, 0.5);
  transition: color 0.2s;
}
.benefit-desc a:hover {
  color: #e6a817;
  text-decoration-color: #e6a817;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .benefits-grid {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
}
@media (max-width: 640px) {
  .benefits-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 24px;
  }
  .benefit-card {
    padding: 28px 20px 24px;
  }
  .benefit-title {
    font-size: 1rem;
  }
  .benefit-desc {
    font-size: 0.9rem !important;
  }
}

/* ══════════════════════════════════════════
   DARK MODE
   ══════════════════════════════════════════ */
body:not(.light) .benefit-card {
  background: #1e1c18 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}
body:not(.light) .benefit-card:hover {
  border-color: rgba(230, 168, 23, 0.25) !important;
}
body:not(.light) .benefit-title {
  color: #e8e4dc !important;
  text-decoration-color: #e8e4dc !important;
}
body:not(.light) .benefit-title.benefit-linked:hover {
  color: #e6a817 !important;
  text-decoration-color: #e6a817 !important;
}
body:not(.light) .benefit-desc {
  color: #8a8580 !important;
}
body:not(.light) .benefit-desc a {
  color: #c4bfb6 !important;
  text-decoration-color: rgba(196, 191, 182, 0.5) !important;
}
body:not(.light) .benefit-desc a:hover {
  color: #e6a817 !important;
}

/* ── Light mode explicit overrides ── */
body.light .benefit-card {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.13) !important;
}
body.light .benefit-title { color: #1a1814 !important; }
body.light .benefit-desc  { color: #3d3a35 !important; }







* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Georgia, 'Times New Roman', serif;
  background-color: #ffffff;
  color: #222222;
}

/* ── Outer wrapper ── */
.section-wrapper {
  max-width: 1100px;
  margin: 0 auto;
  padding: 48px 24px 64px;
}

/* ── Heading ── */
.section-title {
  font-size: 22px;
  font-weight: 700;
  color: #005EB8;
  margin-bottom: 16px;
  font-family: Arial, Helvetica, sans-serif;
}
body:not(.light) .section-title { color: #60a5fa; }

/* ── Description paragraph ── */
.section-desc {
  font-size: 15px;
  line-height: 1.7;
  color: #333333;
  margin-bottom: 36px;
  font-family: Arial, Helvetica, sans-serif;
}

/* ── Two-column card row ── */
.cards-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* ── Individual card — Premium blue theme ── */
.card {
  position: relative;
  background-color: #ffffff;
  border: 1px solid rgba(0, 94, 184, 0.15);
  border-radius: 12px;
  padding: 44px 36px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 4px 16px rgba(0, 94, 184, 0.06), 0 1px 3px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.card:hover {
  box-shadow: 0 14px 36px rgba(0, 94, 184, 0.12), 0 4px 10px rgba(0, 0, 0, 0.05);
  border-color: rgba(0, 94, 184, 0.32);
  transform: translateY(-3px);
}
/* Top accent gradient bar */
.card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #005EB8 0%, #003e7e 50%, #005EB8 100%);
  opacity: 0.85;
  transition: opacity 0.3s ease;
}
.card:hover::before { opacity: 1; }

/* ── Icon wrapper — centered, blue tinted bg ── */
.card-icon {
  width: 64px;
  height: 64px;
  margin-bottom: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0, 94, 184, 0.08) 0%, rgba(0, 94, 184, 0.02) 100%);
  transition: background 0.3s ease, transform 0.3s ease;
}
.card:hover .card-icon {
  background: linear-gradient(135deg, rgba(0, 94, 184, 0.14) 0%, rgba(0, 94, 184, 0.04) 100%);
  transform: scale(1.05);
}
/* Force blue stroke on all card-icon SVGs */
.card-icon svg line,
.card-icon svg rect,
.card-icon svg path,
.card-icon svg circle,
.card-icon svg polygon,
.card-icon svg polyline {
  stroke: #005EB8;
}

/* ── Card heading — premium serif blue ── */
.card-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #005EB8;
  margin-bottom: 22px;
  font-family: Georgia, 'Times New Roman', serif;
  text-align: center;
  letter-spacing: -0.01em;
  line-height: 1.35;
}

/* ── List ── */
.card-list {
  list-style: none;
  width: 100%;
  padding: 0;
  text-align: left;     /* keep bullets left-aligned even if the card/section centers content */
  align-self: stretch;  /* span full card width instead of being centered by the card's align-items */
}
.card-list li { text-align: left; }

.card-list li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 11px;
  font-size: 15px;
  line-height: 1.6;
  color: #3d3a35;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Square blue bullet */
.card-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  background-color: #005EB8;
  border-radius: 2px;
  box-shadow: 0 0 0 3px rgba(0, 94, 184, 0.1);
  flex-shrink: 0;
  transition: background 0.25s ease, box-shadow 0.25s ease;
}
.card:hover .card-list li::before {
  background-color: #003e7e;
  box-shadow: 0 0 0 4px rgba(0, 94, 184, 0.15);
}

/* ── Link inside list ── */
.card-link {
  color: #005EB8;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500;
  transition: color 0.2s ease;
}
.card-link:hover {
  color: #003e7e;
}

/* ──────────────────────────────────────────────
   .cards-container cards restyled to MATCH the .scope-card design
   (square corners, gray border, 9px SOLID blue top bar, no icon,
   dark DM Sans title). Scoped to .cards-container so other .card
   uses elsewhere are unaffected. Propagates site-wide. 2026-06-11.
   ────────────────────────────────────────────── */
.cards-container .card {
  border-radius: 0;
  border: 1px solid #dde2ea;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  padding: 37px 24px 34px;
  justify-content: flex-start;
}
.cards-container .card::before {
  height: 9px;
  background: #005EB8;
  opacity: 1;
}
.cards-container .card:hover {
  box-shadow: 0 10px 28px rgba(0, 94, 184, 0.12);
  border-color: #cdd6e2;
  transform: translateY(-3px);
}
.cards-container .card:hover::before { opacity: 1; }
.cards-container .card-icon { display: none; }
.cards-container .card-title {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 18px;
}
body:not(.light) .cards-container .card {
  background: #1e1c18;
  border-color: rgba(255, 255, 255, 0.08);
}
body:not(.light) .cards-container .card::before { background: #005EB8; }
body:not(.light) .cards-container .card-title { color: #e8e4dc; }

/* ── Responsive: stack on small screens ── */
@media (max-width: 680px) {
  .cards-container { grid-template-columns: 1fr; }
  .card { padding: 36px 28px 32px; }
  .cards-container .card { padding: 37px 22px 30px; }
}

/* ── Dark mode for cards ── */
body:not(.light) .card {
  background-color: #15191f;
  border-color: rgba(96, 165, 250, 0.18);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.4);
}
body:not(.light) .card:hover {
  box-shadow: 0 14px 36px rgba(96, 165, 250, 0.18), 0 4px 10px rgba(0, 0, 0, 0.5);
  border-color: rgba(96, 165, 250, 0.4);
}
body:not(.light) .card::before {
  background: linear-gradient(90deg, #60a5fa 0%, #2563eb 50%, #60a5fa 100%);
}
body:not(.light) .card-icon {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.1) 0%, rgba(96, 165, 250, 0.02) 100%);
}
body:not(.light) .card:hover .card-icon {
  background: linear-gradient(135deg, rgba(96, 165, 250, 0.18) 0%, rgba(96, 165, 250, 0.05) 100%);
}
body:not(.light) .card-icon svg line,
body:not(.light) .card-icon svg rect,
body:not(.light) .card-icon svg path,
body:not(.light) .card-icon svg circle,
body:not(.light) .card-icon svg polygon,
body:not(.light) .card-icon svg polyline { stroke: #93c5fd; }
body:not(.light) .card-title { color: #93c5fd; }
body:not(.light) .card-list li { color: #c4cad6; }
body:not(.light) .card-list li::before {
  background-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.15);
}
body:not(.light) .card:hover .card-list li::before {
  background-color: #93c5fd;
  box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.22);
}
body:not(.light) .card-link { color: #93c5fd; }
body:not(.light) .card-link:hover { color: #bfdbfe; }
body:not(.light) .section-desc { color: #c4cad6; }


* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    body {
      font-family: 'Segoe UI', Arial, sans-serif;
      background-color: #ffffff;
      color: #222222;
    }
 
    /* ══════════════════════════════════════════════════════════════════════
       CHOOSE YOUR SERVICE OPTION — restyled to the /software-development/custom
       .sv-item cards: white tile, 1px #dadfe3 border, soft shadow, centred icon +
       20px-bold title, 16px description, blue arrow text-link at the bottom.
       Every selector is scoped to .service-card / .service-section / .cards-wrapper
       so no other card type is touched (.card-title is also used by .cards-container
       — kept safe by scoping). ~790 pages, CSS-only, markup untouched.
       ══════════════════════════════════════════════════════════════════════ */
    .service-section { max-width: 1140px; margin: 64px auto; padding: 0 20px; }
    .service-section .section-title {
      font-size: 2rem; font-weight: 400; color: #1a1814; margin-bottom: 12px;
      font-family: Georgia, 'Times New Roman', serif; letter-spacing: 0.01em;
    }
    .divider-line {
      height: 1px; margin-bottom: 40px;
      background: linear-gradient(90deg, #005EB8 0%, rgba(0,94,184,0.10) 100%);
    }
    .cards-wrapper { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: stretch; }

    /* ── card frame ── */
    .service-card {
      background: #ffffff;
      border: 1px solid #dadfe3;
      box-shadow: 0 2px 20px rgba(0,0,0,0.05);
      display: flex; flex-direction: column; position: relative; overflow: hidden;
      transition: box-shadow 0.3s ease, border-color 0.3s ease;
    }
    .service-card:hover { box-shadow: 0 2px 20px rgba(0,0,0,0.10); border-color: #bcc4cd; }
    /* remove old gold shimmer / left-bar / top stripe / number badge */
    .service-card::after { content: none; }
    .service-card::before { display: none; }
    .card-top-border { display: none; }
    .service-section .service-card::before,
    .service-section .service-card:hover::before { display: none; }
    .service-card .card-body::before { content: none; }

    /* ── icon shown again (old design hid it), sized like sv-item ── */
    .service-card .icon-wrap { display: flex; justify-content: center; margin-bottom: 15px; }
    .service-card .icon-wrap svg { width: 64px; height: auto; }

    /* ── body: centred (sv-item alignment-center) ── */
    .service-card .card-body {
      padding: 28px 22px 24px;
      display: flex; flex-direction: column; align-items: center; text-align: center; flex: 1;
    }

    /* ── title 20px bold (scoped -> .cards-container title untouched) ── */
    .service-card .card-title {
      font-family: "DM Sans", system-ui, -apple-system, sans-serif;
      font-size: 20px; font-weight: 700; color: #222;
      margin-bottom: 15px; line-height: 1.35; letter-spacing: normal; text-align: center;
    }
    .service-card .card-title a { color: inherit; text-decoration: none; }
    .service-card .card-title a:hover { color: #005EB8; }

    /* ── description 16px ── */
    .service-card .card-desc {
      font-size: 16px; color: #3b3c3d; line-height: 1.56;
      text-align: left; width: 100%; margin-bottom: 20px; flex: 1;
    }

    /* ── Bare .card-btn fallback: a few OTHER card types (e.g. the Dynamics 365
       "Request ->" pricing cards) reuse .card-btn OUTSIDE .service-card. Keep their
       original gold-outlined look untouched; .service-card .card-btn below (more
       specific) gives the new service-option cards the blue arrow link. ── */
    .card-btn {
      display: inline-flex; align-items: center; gap: 8px;
      border: 1px solid rgba(200,168,0,0.55); color: #c8a800;
      padding: 10px 22px; font-size: 12.5px; font-weight: 700;
      letter-spacing: 0.07em; text-transform: uppercase; text-decoration: none;
      transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
    }
    .card-btn:hover { background: #c8a800; color: #0f0e0b; border-color: #c8a800; }

    /* ── link: blue arrow text-link at the bottom-left (arrow already in the label) ── */
    .service-card .card-btn {
      display: inline-flex; align-items: center; gap: 6px; margin-top: auto; align-self: flex-start;
      border: none; background: none; color: #005EB8; padding: 0;
      font-size: 16px; font-weight: 600; letter-spacing: normal; text-transform: none;
      text-decoration: none; transition: color 0.2s ease;
    }
    .service-card .card-btn:hover { color: #004688; background: none; }

    /* ── inline underline links inside descriptions ── */
    .inline-link { color: #005EB8; text-decoration: underline; }

    /* ── dark mode ── */
    body:not(.light) .service-section .section-title { color: #e8e4dc; }
    body:not(.light) .divider-line { background: linear-gradient(90deg, #60a5fa 0%, rgba(96,165,250,0.12) 100%); }
    body:not(.light) .service-card {
      background: #1e1c18 !important; border-color: rgba(96,165,250,0.18) !important;
      box-shadow: 0 2px 20px rgba(0,0,0,0.40);
    }
    body:not(.light) .service-card:hover { border-color: #3b5b7a !important; box-shadow: 0 2px 20px rgba(0,0,0,0.55); }
    body:not(.light) .service-card .card-title,
    body:not(.light) .service-card .card-title a { color: #e8e4dc !important; }
    body:not(.light) .service-card .card-title a:hover { color: #60a5fa !important; }
    body:not(.light) .service-card .card-desc { color: #c4bfb6 !important; }
    body:not(.light) .service-card .card-btn { color: #60a5fa !important; }
    body:not(.light) .service-card .card-btn:hover { color: #93c5fd !important; }

    /* ── light mode explicit ── */
    body.light .service-section .section-title { color: #1a1814; }
    body.light .service-card { background: #ffffff; border-color: #dadfe3; }
    body.light .service-card .card-title, body.light .service-card .card-title a { color: #222 !important; }
    body.light .service-card .card-desc { color: #3b3c3d !important; }

    /* ── mobile ── */
    @media (max-width: 768px) {
      .cards-wrapper { grid-template-columns: 1fr; gap: 16px; }
      .service-card { width: 100%; }
      .service-section .section-title { font-size: 1.4rem; }
      .service-card .card-body { padding: 24px 18px 22px; }
    }
    @media (min-width: 769px) and (max-width: 1024px) {
      .cards-wrapper { grid-template-columns: repeat(2, 1fr); }
    }

    .mvp-section {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px 24px;
    border: 0.5px solid #ddd;
    border-radius: none;
    background: #fff;
    margin: 8px 0;
  }
  .mvp-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #1a5fb4;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .mvp-icon svg {
    width: 22px;
    height: 22px;
    fill: white;
  }
  .mvp-text {
    font-size: 15px;
    line-height: 1.7;
    color: #333;
    font-style: italic;
    margin: 0;
  }
  .mvp-text strong {
    font-weight: 600;
    font-style: italic;
  }
  .mvp-text a {
    color: #333;
    text-decoration: underline;
    font-style: italic;
    font-weight: 500;
    cursor: pointer;
  }
  .mvp-text a:hover {
    color: #1a5fb4;
  }
  /* Dark mode for the MVP note (was a glaring white strip on dark pages) —
     pure additions, light mode untouched. Used by ~430 pages. */
  body:not(.light) .mvp-section {
    background: #1e1c18;
    border-color: rgba(96, 165, 250, 0.22);
  }
  body:not(.light) .mvp-text { color: #c4bfb6; }
  body:not(.light) .mvp-text strong { color: #e8e4dc; }
  body:not(.light) .mvp-text a { color: #93c5fd; }
  body:not(.light) .mvp-text a:hover { color: #60a5fa; }


  .faq-wrapper {
    font-family: Georgia, 'Times New Roman', serif;
    max-width: 860px;
    margin: 0 auto;
    padding: 32px 16px;
  }
  .faq-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
  }
  .faq-header-bar {
    width: 8px;
    height: 64px;
    background: #b8d4e8;
    border-radius: 2px;
  }
  .faq-title {
    font-size: 32px;
    font-weight: 700;
    color: #1a3a5c;
    margin: 0;
  }
  .faq-link-icon {
    color: #6a9cc0;
    font-size: 18px;
    text-decoration: none;
    opacity: 0.7;
  }
  .faq-list { border-top: 1px solid #dde8f0; }
  .faq-item { border-bottom: 1px solid #dde8f0; }
  .faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 20px;
    cursor: pointer;
    background: transparent;
    transition: background 0.25s ease;
    user-select: none;
  }
  .faq-item.open .faq-question { background: #e8f1f8; }
  .faq-question:hover { background: #f0f6fb; }
  .faq-question-text {
    font-size: 16px;
    color: #1a3a5c;
    font-family: Arial, sans-serif;
    font-weight: 400;
  }
  .faq-item.open .faq-question-text { color: #1a5fb4; font-weight: 500; }
  .faq-chevron {
    width: 18px; height: 18px;
    flex-shrink: 0;
    transition: transform 0.35s ease;
    color: #6a9cc0;
  }
  .faq-item.open .faq-chevron { transform: rotate(180deg); }
  .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.45s cubic-bezier(0.4,0,0.2,1), opacity 0.35s ease, padding 0.35s ease;
    opacity: 0;
    padding: 0 20px;
    background: #fff;
  }
  .faq-item.open .faq-answer {
    max-height: 600px;
    opacity: 1;
    padding: 16px 20px 24px;
  }
  .faq-answer p { font-size: 15px; line-height: 1.75; color: #333; margin: 0 0 12px; font-family: Arial, sans-serif; }
  .faq-answer ul { margin: 8px 0 12px 4px; padding: 0; list-style: none; }
  .faq-answer ul li { font-size: 15px; line-height: 1.75; color: #333; font-family: Arial, sans-serif; padding-left: 20px; position: relative; margin-bottom: 4px; }
  .faq-answer ul li::before { content: '▪'; position: absolute; left: 0; color: #1a3a5c; font-size: 12px; top: 3px; }
  .faq-answer ol { margin: 8px 0 12px; padding-left: 20px; }
  .faq-answer ol li { font-size: 15px; line-height: 1.75; color: #333; font-family: Arial, sans-serif; margin-bottom: 6px; }

  /* ───── FAQ dark mode overrides ───── */
  body:not(.light) .faq-header-bar { background: #60a5fa; }
  body:not(.light) .faq-title { color: #e5e7eb; }
  body:not(.light) .faq-link-icon { color: #93c5fd; }
  body:not(.light) .faq-list { border-top-color: rgba(255,255,255,0.12); }
  body:not(.light) .faq-item { border-bottom-color: rgba(255,255,255,0.12); }
  body:not(.light) .faq-question-text { color: #e5e7eb; }
  body:not(.light) .faq-question:hover { background: rgba(96,165,250,0.08); }
  body:not(.light) .faq-item.open .faq-question { background: rgba(96,165,250,0.12); }
  body:not(.light) .faq-item.open .faq-question-text { color: #93c5fd; }
  body:not(.light) .faq-chevron { color: #93c5fd; }
  body:not(.light) .faq-answer { background: transparent; }
  body:not(.light) .faq-answer p { color: #d1d5db; }
  body:not(.light) .faq-answer ul li { color: #d1d5db; }
  body:not(.light) .faq-answer ul li::before { color: #60a5fa; }
  body:not(.light) .faq-answer ol li { color: #d1d5db; }


/* ══════════════════════════════════════════
   CONTACT SECTION — PREMIUM DARK
   ══════════════════════════════════════════ */
/* ── PREMIUM CONTACT SECTION — Blue theme matching site ── */
.cs-wrapper{background:#f6f9fc !important;border-top:1px solid rgba(0,94,184,0.08);border-bottom:1px solid rgba(0,94,184,0.08);padding:64px 30px;display:flex;align-items:center;justify-content:center;}
.cs-container{display:flex;gap:48px;max-width:1050px;width:100%;align-items:flex-start;}
.cs-form-card{background:#ffffff;border:1px solid rgba(0,94,184,0.15);border-radius:12px;padding:40px 36px 36px;flex:1 1 0;box-shadow:0 4px 16px rgba(0,94,184,0.06),0 1px 3px rgba(0,0,0,0.04);min-width:0;position:relative;transition:box-shadow .3s ease,border-color .3s ease;}
.cs-form-card:hover{box-shadow:0 12px 32px rgba(0,94,184,0.1),0 4px 10px rgba(0,0,0,0.05);border-color:rgba(0,94,184,0.28);}
.cs-form-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:12px 12px 0 0;background:linear-gradient(90deg,#005EB8 0%,#003e7e 50%,#005EB8 100%);}
.cs-title{font-family:Georgia,'Times New Roman',serif;font-size:22px;font-weight:600;color:#0f2742;margin-bottom:8px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;letter-spacing:-.01em;}
.cs-badge{display:inline-flex;align-items:center;}
.cs-subtitle{font-size:14px;color:#4a4a4a;margin-bottom:22px;line-height:1.65;}
.cs-msg-wrapper{border:1px solid rgba(0,94,184,0.25);border-radius:8px;margin-bottom:14px;position:relative;background:#f6f9fc;transition:border-color .2s;}
.cs-msg-wrapper:focus-within{border-color:rgba(0,94,184,0.55);}
.cs-legend{font-size:11px;color:#005EB8;margin-left:10px;padding:0 6px;background:#ffffff;letter-spacing:.06em;text-transform:uppercase;font-weight:700;}
.cs-msg-wrapper textarea{width:100%;border:none;outline:none;resize:none;font-size:14px;color:#0f2742;padding:12px 50px 12px 14px;min-height:110px;border-radius:8px;font-family:inherit;background:transparent;line-height:1.65;}
.cs-msg-wrapper textarea::placeholder{color:#8a8a8a;}
.cs-mic-btn{position:absolute;right:10px;bottom:10px;background:rgba(0,94,184,0.08);border:1px solid rgba(0,94,184,0.35);border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,border-color .2s;padding:0;}
.cs-mic-btn:hover{background:rgba(0,94,184,0.18);border-color:#005EB8;}
.cs-mic-btn.cs-recording{background:rgba(220,38,38,.1);border-color:#dc2626;animation:cs-pulse 1s infinite;}
.cs-mic-btn svg{width:16px;height:16px;fill:#005EB8;}
.cs-mic-btn.cs-recording svg{fill:#dc2626;}
@keyframes cs-pulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.35);}50%{box-shadow:0 0 0 7px rgba(220,38,38,0);}}
.cs-mic-status{position:absolute;right:52px;bottom:16px;font-size:11px;color:#dc2626;font-weight:500;}
.cs-upload-row{display:flex;align-items:center;gap:8px;font-size:13px;color:#4a4a4a;margin-bottom:16px;flex-wrap:wrap;}
.cs-upload-row a{color:#005EB8;text-decoration:none;font-weight:600;}
.cs-upload-row a:hover{text-decoration:underline;color:#003e7e;}
.cs-help-icon{width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,94,184,0.25);display:inline-flex;align-items:center;justify-content:center;font-size:10px;color:#4a4a4a;cursor:pointer;font-weight:700;}
.cs-file-name{font-size:12px;color:#005EB8;font-style:italic;}
.cs-row{display:flex;gap:14px;margin-bottom:12px;}
.cs-input{flex:1 1 0;padding:11px 14px;border:1px solid rgba(0,94,184,0.18);border-radius:8px;font-size:14px;color:#0f2742;outline:none;background:#f6f9fc;transition:border-color .2s,background .2s;width:100%;font-family:inherit;}
.cs-input::placeholder{color:#8a8a8a;}
.cs-input:focus{border-color:#005EB8;background:#ffffff;}
.cs-phone-group{position:relative;display:flex;align-items:center;flex:1 1 0;border:1px solid rgba(0,94,184,0.18);border-radius:8px;overflow:visible;background:#f6f9fc;transition:border-color .2s;}
.cs-phone-group:focus-within{border-color:#005EB8;background:#ffffff;}
.cs-flag-sel{display:flex;align-items:center;gap:3px;padding:0 10px;border-right:1px solid rgba(0,94,184,0.12);background:transparent;height:42px;cursor:pointer;font-size:13px;color:#0f2742;white-space:nowrap;border-radius:8px 0 0 8px;user-select:none;flex-shrink:0;}
.cs-flag-sel:hover{background:rgba(0,94,184,0.06);}
.cs-arrow{font-size:10px;color:#4a4a4a;}
.cs-code{font-size:13px;color:#005EB8;font-weight:700;}
.cs-phone-group>input[type="tel"]{flex:1;border:none;outline:none;padding:11px 10px;font-size:14px;color:#0f2742;background:transparent;font-family:inherit;border-radius:0 8px 8px 0;min-width:0;}
.cs-phone-group>input[type="tel"]::placeholder{color:#8a8a8a;}
.cs-country-dropdown{display:none;position:absolute;top:calc(100% + 4px);left:0;width:290px;background:#ffffff;border:1px solid rgba(0,94,184,0.2);border-radius:10px;box-shadow:0 12px 32px rgba(0,94,184,0.15),0 4px 10px rgba(0,0,0,0.06);z-index:9999;overflow:hidden;}
.cs-country-dropdown.cs-open{display:block;}
.cs-country-search-wrap{padding:8px 10px;border-bottom:1px solid rgba(0,94,184,0.12);background:#f6f9fc;}
.cs-country-search-wrap input{width:100%;border:1px solid rgba(0,94,184,0.18);border-radius:6px;padding:7px 10px;font-size:13px;outline:none;font-family:inherit;color:#0f2742;background:#ffffff;box-sizing:border-box;}
.cs-country-search-wrap input:focus{border-color:#005EB8;}
#cs-countryList{list-style:none;margin:0;padding:4px 0;max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(0,94,184,0.3) transparent;}
#cs-countryList li{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;font-size:13px;color:#4a4a4a;transition:background .12s;}
#cs-countryList li:hover,#cs-countryList li.cs-active{background:rgba(0,94,184,0.07);color:#005EB8;}
#cs-countryList li .cs-li-flag{font-size:18px;line-height:1;min-width:24px;text-align:center;}
#cs-countryList li .cs-li-name{flex:1;}
#cs-countryList li .cs-li-code{color:#005EB8;font-weight:700;font-size:12px;white-space:nowrap;}
.cs-send-row{display:flex;justify-content:flex-start;margin-top:20px;}
.cs-send-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#005EB8;color:#ffffff;border:none;border-radius:8px;padding:14px 44px;font-size:13.5px;font-weight:600;letter-spacing:.05em;cursor:pointer;box-shadow:0 4px 14px rgba(0,94,184,0.22);transition:background .25s,transform .2s,box-shadow .25s;font-family:inherit;}
.cs-send-btn::after{content:'\2192';font-size:16px;transition:transform .25s;}
.cs-send-btn:hover{background:#003e7e;transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,94,184,0.32);}
.cs-send-btn:hover::after{transform:translateX(4px);}
.cs-send-btn:active{transform:scale(.98);}
.cs-status{display:none;margin-top:14px;padding:12px 16px;border-radius:6px;font-size:14px;text-align:center;}
.cs-status.success{background:rgba(26,122,66,.1);color:#166534;border:1px solid rgba(22,101,52,.2);display:block;}
.cs-status.error{background:rgba(185,28,28,.08);color:#991b1b;border:1px solid rgba(153,27,27,.2);display:block;}
.cs-sidebar{min-width:210px;max-width:240px;display:flex;flex-direction:column;align-items:flex-start;padding-top:12px;}
.cs-sidebar-title{font-family:Georgia,'Times New Roman',serif;font-size:18px;font-weight:600;color:#0f2742;margin-bottom:24px;letter-spacing:-.01em;}
.cs-option{display:flex;align-items:center;gap:12px;margin-bottom:18px;font-size:15px;color:#4a4a4a;text-decoration:none;transition:color .2s,transform .2s;}
.cs-option:hover{color:#005EB8;transform:translateX(2px);}
.cs-icon-circle{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid rgba(0,94,184,0.25);background:rgba(0,94,184,0.06);transition:background .2s,border-color .2s,transform .2s;}
.cs-option:hover .cs-icon-circle{background:rgba(0,94,184,0.14);border-color:#005EB8;transform:scale(1.05);}
.cs-icon-circle svg{width:17px;height:17px;fill:#005EB8;}

/* ── Dark mode for contact section ── */
body:not(.light) .cs-wrapper{background:#0f1419 !important;border-top-color:rgba(96,165,250,0.12);border-bottom-color:rgba(96,165,250,0.12);}
body:not(.light) .cs-form-card{background:#15191f;border-color:rgba(96,165,250,0.18);box-shadow:0 4px 16px rgba(0,0,0,0.3),0 1px 3px rgba(0,0,0,0.4);}
body:not(.light) .cs-form-card:hover{box-shadow:0 12px 32px rgba(96,165,250,0.18),0 4px 10px rgba(0,0,0,0.5);border-color:rgba(96,165,250,0.4);}
body:not(.light) .cs-form-card::before{background:linear-gradient(90deg,#60a5fa 0%,#2563eb 50%,#60a5fa 100%);}
body:not(.light) .cs-title{color:#e5e7eb;}
body:not(.light) .cs-subtitle{color:#c4cad6;}
body:not(.light) .cs-msg-wrapper{border-color:rgba(96,165,250,0.25);background:#1a1f27;}
body:not(.light) .cs-msg-wrapper:focus-within{border-color:#60a5fa;}
body:not(.light) .cs-legend{color:#93c5fd;background:#15191f;}
body:not(.light) .cs-msg-wrapper textarea{color:#e5e7eb;}
body:not(.light) .cs-msg-wrapper textarea::placeholder{color:#6b7280;}
body:not(.light) .cs-input,body:not(.light) .cs-phone-group{background:#1a1f27;border-color:rgba(96,165,250,0.2);color:#e5e7eb;}
body:not(.light) .cs-input::placeholder,body:not(.light) .cs-phone-group>input[type="tel"]::placeholder{color:#6b7280;}
body:not(.light) .cs-input:focus,body:not(.light) .cs-phone-group:focus-within{border-color:#60a5fa;background:#1f242d;}
body:not(.light) .cs-phone-group>input[type="tel"]{color:#e5e7eb;}
body:not(.light) .cs-flag-sel{color:#e5e7eb;border-right-color:rgba(96,165,250,0.18);}
body:not(.light) .cs-flag-sel:hover{background:rgba(96,165,250,0.08);}
body:not(.light) .cs-code{color:#93c5fd;}
body:not(.light) .cs-arrow{color:#9ca3af;}
body:not(.light) .cs-upload-row{color:#c4cad6;}
body:not(.light) .cs-upload-row a{color:#93c5fd;}
body:not(.light) .cs-help-icon{border-color:rgba(96,165,250,0.25);color:#c4cad6;}
body:not(.light) .cs-file-name{color:#93c5fd;}
body:not(.light) .cs-mic-btn{background:rgba(96,165,250,0.1);border-color:rgba(96,165,250,0.35);}
body:not(.light) .cs-mic-btn:hover{background:rgba(96,165,250,0.2);border-color:#60a5fa;}
body:not(.light) .cs-mic-btn svg{fill:#93c5fd;}
body:not(.light) .cs-country-dropdown{background:#15191f;border-color:rgba(96,165,250,0.25);box-shadow:0 12px 32px rgba(0,0,0,0.5);}
body:not(.light) .cs-country-search-wrap{background:#1a1f27;border-bottom-color:rgba(96,165,250,0.18);}
body:not(.light) .cs-country-search-wrap input{background:#0f1419;border-color:rgba(96,165,250,0.2);color:#e5e7eb;}
body:not(.light) #cs-countryList li{color:#c4cad6;}
body:not(.light) #cs-countryList li:hover,body:not(.light) #cs-countryList li.cs-active{background:rgba(96,165,250,0.1);color:#93c5fd;}
body:not(.light) #cs-countryList li .cs-li-code{color:#93c5fd;}
body:not(.light) .cs-send-btn{background:#2563eb;box-shadow:0 4px 14px rgba(96,165,250,0.28);}
body:not(.light) .cs-send-btn:hover{background:#3b82f6;box-shadow:0 8px 22px rgba(96,165,250,0.4);}
body:not(.light) .cs-sidebar-title{color:#e5e7eb;}
body:not(.light) .cs-option{color:#c4cad6;}
body:not(.light) .cs-option:hover{color:#93c5fd;}
body:not(.light) .cs-icon-circle{border-color:rgba(96,165,250,0.3);background:rgba(96,165,250,0.08);}
body:not(.light) .cs-option:hover .cs-icon-circle{background:rgba(96,165,250,0.18);border-color:#60a5fa;}
body:not(.light) .cs-icon-circle svg{fill:#93c5fd;}
.cs-illustration{display:none;}
/* audio player injected by JS */
#cs-audioPlayerWrap audio{filter:invert(0);border-radius:2px;}
@media(max-width:700px){
  .cs-wrapper{padding:40px 20px;}
  .cs-container{flex-direction:column;gap:28px;}
  .cs-sidebar{max-width:100%;width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;padding-top:0;}
  .cs-sidebar-title{width:100%;margin-bottom:8px;}
  .cs-row{flex-direction:column;}
  .cs-country-dropdown{width:100%;}
}

/* ══════════════════════════════════════════
   APPS SECTION — C# Development Cards
   Matches: styles-page.css design system
   ══════════════════════════════════════════ */

/* ── Section Wrapper ── */
.apps-section-wrap {
  margin-bottom: 30px;
  padding-bottom: 30px;
}

/* ── Section Label (matches .section-label) ── */
.apps-section-wrap .section-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold, #b8860b);
  margin-bottom: 20px;
}
.apps-section-wrap .section-label::before {
  content: '';
  display: block;
  width: 24px;
  height: 1px;
  background: var(--gold, #b8860b);
}

/* ── Section Heading (matches .section-block h2) ── */
.apps-section-title {
  font-family: serif;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: lighter !important;
  line-height: 1.15;
  color: #005EB8;
  margin-bottom: 32px;
  letter-spacing: 0.02em;
}

/* ─────────────────────────────────────────────────────────────────────────
   "X We Develop" cards — unified to the /healthcare "Clients We Serve"
   (.ibx-card) look. Shared across ~145 pages via THIS block only; page markup
   is untouched. White tile, #D6EBFF border, clean line icon (coloured box
   removed), semibold label. Cards that link somewhere get a whole-card click
   (pure-CSS stretched link), a corner arrow, and a growing blue underbar on
   hover; cards with no link stay static.
   ───────────────────────────────────────────────────────────────────────── */
.apps-cards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  margin-top: 0;
}

.app-card-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #ffffff;
  border: 1px solid #D6EBFF;
  border-radius: 0;
  padding: 26px 16px 24px;
  box-shadow: 0 0 28px -8px rgba(41, 59, 76, 0.12);
  overflow: hidden;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/* whole linked card is the click target (stretched link over the card) */
.app-card-item:has(a[href]) { cursor: pointer; }
.app-card-item a[href]::after { content: ""; position: absolute; inset: 0; z-index: 1; }

/* growing blue underbar + corner arrow: decorative, never block the click */
.app-card-item::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 0; height: 3px; background: #005EB8;
  transition: width 0.3s ease; z-index: 2; pointer-events: none;
}
.app-card-item:has(a[href]):hover { border-color: #005EB8; }
.app-card-item:has(a[href]):hover::after { width: 100%; }
.app-card-item:has(a[href])::before {
  content: ""; position: absolute; right: 9px; top: 9px;
  width: 12px; height: 12px; opacity: 0; transform: translate(-4px, 4px);
  background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005EB8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='7' y1='17' x2='17' y2='7'/%3E%3Cpolyline points='8 7 17 7 17 16'/%3E%3C/svg%3E");
  transition: all 0.3s ease; z-index: 2; pointer-events: none;
}
.app-card-item:has(a[href]):hover::before { opacity: 1; transform: none; }

/* icon: drop the coloured box, show the line SVG clean and larger */
.app-icon-box {
  width: auto; height: auto;
  background: none !important;
  border-radius: 0;
  margin-bottom: 14px;
  flex-shrink: 0;
}
.app-icon-box svg { width: 52px; height: 52px; }

.app-card-label {
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #222;
  line-height: 1.5;
  margin: 0;
}
/* Card labels are NOT prose links: the whole card is the click target and the
   hover arrow/underbar already signal it. Kill the underline from both the
   .bullet-link rule and the SEO "body links must underline" rule. The empty
   :not([data-*]) chain (always true) only inflates specificity so this beats
   that SEO selector (main p a:not()... = 0,6,3) without touching those rules. */
.app-card-label a:not([data-i]):not([data-l]):not([data-x]):not([data-c]):not([data-a]):not([data-r]):not([data-d]) {
  color: inherit !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.app-card-item:has(a[href]):hover .app-card-label a:not([data-i]):not([data-l]):not([data-x]):not([data-c]):not([data-a]):not([data-r]):not([data-d]) {
  color: #005EB8 !important;
}

.app-card-item:nth-child(5) { grid-column: 1; }

/* ── DARK MODE ── */
body:not(.light) .app-card-item {
  background: #1e1c18 !important;
  border-color: rgba(96,165,250,0.22) !important;
  box-shadow: 0 0 28px -8px rgba(0,0,0,0.5);
}
body:not(.light) .app-card-item:has(a[href]):hover { border-color: #60a5fa !important; }
body:not(.light) .app-card-item::after { background: #60a5fa; }
body:not(.light) .app-card-item:has(a[href])::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2360a5fa' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='7' y1='17' x2='17' y2='7'/%3E%3Cpolyline points='8 7 17 7 17 16'/%3E%3C/svg%3E"); }
body:not(.light) .app-icon-box svg { stroke: #60a5fa !important; }
body:not(.light) .app-icon-box svg circle[fill="#005EB8"] { fill: #60a5fa !important; }
body:not(.light) .app-card-label { color: #e8e4dc !important; }
body:not(.light) .app-card-item:has(a[href]):hover .app-card-label,
body:not(.light) .app-card-item:has(a[href]):hover .app-card-label a:not([data-i]):not([data-l]):not([data-x]):not([data-c]):not([data-a]):not([data-r]):not([data-d]) { color: #60a5fa !important; }
body:not(.light) .apps-section-title { color: #60a5fa !important; }
body:not(.light) .apps-section-wrap .section-label { color: #d4a820 !important; }
body:not(.light) .apps-section-wrap .section-label::before { background: #d4a820 !important; }

/* ── LIGHT MODE explicit ── */
body.light .app-card-item { background: #ffffff !important; border-color: #D6EBFF !important; }
body.light .app-card-label, body.light .app-card-label a { color: #222 !important; }
body.light .apps-section-title { color: #005EB8 !important; }

/* ── RESPONSIVE ── */
@media (max-width: 1023px) {
  .apps-cards-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .app-card-item:nth-child(5) { grid-column: auto; }
}
@media (max-width: 767px) {
  .apps-cards-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .app-card-item { padding: 22px 12px 20px; }
  .app-icon-box svg { width: 46px; height: 46px; }
  .app-card-label { font-size: 16px; }
  .app-card-item:nth-child(5) { grid-column: auto; }
}
@media (max-width: 440px) {
  .apps-cards-grid { grid-template-columns: 1fr; }
}

/* icon colour variants: box background removed; keep inline SVG stroke colours in
   light mode (blue/amber/pink for variety), recolour for dark. */
.app-icon-blue, .app-icon-yellow, .app-icon-pink { background: none !important; }
.apps-grid-gap { margin-top: 16px; }
body:not(.light) .app-icon-yellow svg { stroke: #e6b800 !important; }
body:not(.light) .app-icon-pink   svg { stroke: #e07070 !important; }

/* ════════════════════════════════════════════
   INNERLUXES — About Block (premium minimal)
   ════════════════════════════════════════════ */
.il-about {
  background: #ffffff !important;
  padding: 5px 24px !important;
  border-top: 1px solid rgba(10, 20, 40, 0.06) !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
}
body:not(.light) .il-about {
  background: #0b1220 !important;
  border-top-color: rgba(255, 255, 255, 0.05) !important;
}
.il-about::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 64px !important;
  height: 4px !important;
  background: #005EB8 !important;
  border-radius: 0 0 4px 4px !important;
}
.il-about .il-about-wrap {
  max-width: 1080px !important;
  margin: 0 auto !important;
  text-align: center !important;
}
.il-about .il-about-eyebrow {
  display: inline-block !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: #005EB8 !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}
body:not(.light) .il-about .il-about-eyebrow { color: #6FB7FF !important; }
.il-about .il-about-title {
  font-size: clamp(1.9rem, 3.6vw, 2.9rem) !important;
  line-height: 1.18 !important;
  font-weight: 800 !important;
  color: #0a1428 !important;
  margin: 0 auto 28px !important;
  letter-spacing: -0.015em !important;
  max-width: 820px !important;
}
body:not(.light) .il-about .il-about-title { color: #f4f7fb !important; }
.il-about .il-about-lead {
  font-size: 1.1rem !important;
  line-height: 1.75 !important;
  color: #4a5a73 !important;
  margin: 0 auto 64px !important;
  max-width: 720px !important;
}
body:not(.light) .il-about .il-about-lead { color: #b8c1d0 !important; }
.il-about .il-about-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 56px !important;
  max-width: 980px !important;
  margin: 0 auto 56px !important;
  text-align: left !important;
}
.il-about .il-metric {
  position: relative !important;
  padding-left: 24px !important;
  border-left: 2px solid rgba(0, 94, 184, 0.18) !important;
}
body:not(.light) .il-about .il-metric {
  border-left-color: rgba(111, 183, 255, 0.25) !important;
}
.il-about .il-metric-num {
  font-size: clamp(2rem, 3.4vw, 2.6rem) !important;
  font-weight: 800 !important;
  color: #005EB8 !important;
  line-height: 1 !important;
  margin: 0 0 10px !important;
  letter-spacing: -0.025em !important;
}
body:not(.light) .il-about .il-metric-num { color: #6FB7FF !important; }
.il-about .il-metric-label {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #0a1428 !important;
  margin: 0 0 8px !important;
  line-height: 1.3 !important;
}
body:not(.light) .il-about .il-metric-label { color: #f4f7fb !important; }
.il-about .il-metric-note {
  font-size: 0.9rem !important;
  color: #5a6b85 !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  font-weight: 400 !important;
}
body:not(.light) .il-about .il-metric-note { color: #9aa4b6 !important; }
.il-about .il-about-cta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  justify-content: center !important;
}
.il-about .il-about-cta .il-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 30px !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  border: 2px solid transparent !important;
  cursor: pointer !important;
  letter-spacing: 0.005em !important;
}
.il-about .il-about-cta .il-btn-primary {
  background: #005EB8 !important;
  color: #ffffff !important;
  border-color: #005EB8 !important;
}
.il-about .il-about-cta .il-btn-primary:hover {
  background: #004a96 !important;
  border-color: #004a96 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 22px rgba(0, 94, 184, 0.3) !important;
}
.il-about .il-about-cta .il-btn-ghost {
  background: transparent !important;
  color: #0a1428 !important;
  border-color: rgba(10, 20, 40, 0.18) !important;
}
.il-about .il-about-cta .il-btn-ghost:hover {
  background: #0a1428 !important;
  color: #ffffff !important;
  border-color: #0a1428 !important;
}
body:not(.light) .il-about .il-about-cta .il-btn-ghost {
  color: #f4f7fb !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}
body:not(.light) .il-about .il-about-cta .il-btn-ghost:hover {
  background: #f4f7fb !important;
  color: #0a1428 !important;
  border-color: #f4f7fb !important;
}

/* === Responsive === */
@media (max-width: 900px) {
  .il-about { padding: 80px 22px !important; }
  .il-about .il-about-metrics {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
    max-width: 520px !important;
  }
  .il-about .il-about-lead { margin-bottom: 48px !important; }
}
@media (max-width: 520px) {
  .il-about { padding: 64px 18px !important; }
  .il-about .il-about-cta { flex-direction: column !important; align-items: stretch !important; }
  .il-about .il-about-cta .il-btn { width: 100% !important; }
}
/* ════════════════════════════════════════════
   Inline bullet links (auto-added)
   ════════════════════════════════════════════ */
/* ════════════════════════════════════════════
   Content links — reference underline system (ported from the
   locations page): solid #005EB8 underline, 2px offset, 1px,
   text flows/wraps naturally, hover changes text colour only.
   ════════════════════════════════════════════ */
a.bullet-link,
h2 .heading-link, h3 .heading-link, .heading-link {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  text-decoration-skip-ink: auto !important;
  border-bottom: none !important;
  white-space: normal !important;
  transition: color 0.12s ease-in-out, text-decoration-color 0.12s ease-in-out !important;
}
a.bullet-link:hover,
h2 .heading-link:hover, h3 .heading-link:hover, .heading-link:hover {
  color: #005EB8 !important;
  text-decoration-color: #005EB8 !important;
}
/* remove the old INNERLUXES heading arrow */
h2 .heading-link::after, h3 .heading-link::after,
.heading-link::after {
  content: none !important;
}
body:not(.light) a.bullet-link,
body:not(.light) h2 .heading-link, body:not(.light) h3 .heading-link, body:not(.light) .heading-link {
  text-decoration-color: #6FB7FF !important;
}
body:not(.light) a.bullet-link:hover,
body:not(.light) .heading-link:hover {
  color: #6FB7FF !important;
  text-decoration-color: #6FB7FF !important;
}
/* ════════════════════════════════════════════
   SEO — Paragraph & body content links MUST show underline
   Standard web UX: links in body text are visibly distinguishable
   Applied to common paragraph/lead/description containers across pages
   ════════════════════════════════════════════ */

/* Hero leads */
.innx-hero-lead a:not(.bullet-link):not(.heading-link),
.sd-hero__lead a:not(.bullet-link):not(.heading-link),
.bx-lead a:not(.bullet-link):not(.heading-link),
.tt__sub a:not(.bullet-link):not(.heading-link),
.sol__sub a:not(.bullet-link):not(.heading-link),
.industry__sub a:not(.bullet-link):not(.heading-link),
.ss__sub a:not(.bullet-link):not(.heading-link),
.offering__sub a:not(.bullet-link):not(.heading-link),
.faq__sub a:not(.bullet-link):not(.heading-link),

/* Panel & service descriptions */
.panel__desc a:not(.bullet-link):not(.heading-link),
.discuss__desc a:not(.bullet-link):not(.heading-link),
.faq-item__a-inner a:not(.bullet-link):not(.heading-link),
.seo-faq-answer a:not(.bullet-link):not(.heading-link),

/* Generic body containers used across pages */
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]),
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]) {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  text-decoration-color: #005EB8 !important;
  border-bottom: none !important;
  transition: color 0.18s ease, text-decoration-color 0.18s ease, text-decoration-thickness 0.18s ease !important;
}

.innx-hero-lead a:not(.bullet-link):not(.heading-link):hover,
.sd-hero__lead a:not(.bullet-link):not(.heading-link):hover,
.bx-lead a:not(.bullet-link):not(.heading-link):hover,
.tt__sub a:not(.bullet-link):not(.heading-link):hover,
.sol__sub a:not(.bullet-link):not(.heading-link):hover,
.industry__sub a:not(.bullet-link):not(.heading-link):hover,
.ss__sub a:not(.bullet-link):not(.heading-link):hover,
.offering__sub a:not(.bullet-link):not(.heading-link):hover,
.faq__sub a:not(.bullet-link):not(.heading-link):hover,
.panel__desc a:not(.bullet-link):not(.heading-link):hover,
.discuss__desc a:not(.bullet-link):not(.heading-link):hover,
.faq-item__a-inner a:not(.bullet-link):not(.heading-link):hover,
.seo-faq-answer a:not(.bullet-link):not(.heading-link):hover,
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):hover,
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):hover {
  color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-decoration-color: #005EB8 !important;
}

/* Dark mode — body link colors */
body:not(.light) .innx-hero-lead a:not(.bullet-link):not(.heading-link),
body:not(.light) .sd-hero__lead a:not(.bullet-link):not(.heading-link),
body:not(.light) .bx-lead a:not(.bullet-link):not(.heading-link),
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .offering__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link),
body:not(.light) .faq-item__a-inner a:not(.bullet-link):not(.heading-link),
body:not(.light) .seo-faq-answer a:not(.bullet-link):not(.heading-link) {
  text-decoration-color: rgba(111, 183, 255, 0.6) !important;
}
body:not(.light) .innx-hero-lead a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .sd-hero__lead a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .bx-lead a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .offering__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .faq-item__a-inner a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .seo-faq-answer a:not(.bullet-link):not(.heading-link):hover {
  color: #6FB7FF !important;
  text-decoration-color: #6FB7FF !important;
}

/* Hero lead lighter color (text is white-ish) */
.innx-hero-lead a:not(.bullet-link):not(.heading-link),
.sd-hero__lead a:not(.bullet-link):not(.heading-link),
.bx-lead a:not(.bullet-link):not(.heading-link) {
  color: #ffffff !important;
  text-decoration-color: rgba(255, 255, 255, 0.7) !important;
}
.innx-hero-lead a:not(.bullet-link):not(.heading-link):hover,
.sd-hero__lead a:not(.bullet-link):not(.heading-link):hover,
.bx-lead a:not(.bullet-link):not(.heading-link):hover {
  color: #FFD580 !important;
  text-decoration-color: #FFD580 !important;
}
/* ════════════════════════════════════════════
   SEO LINK COLOR FIX (2026-05-08 round 2)
   - Hero links: GOLD/AMBER (visible against blue hero bg)
   - Body links: SOLID 2px brand blue (was 1px faint, now bold)
   - bullet-link & heading-link: stronger underline default
   ════════════════════════════════════════════ */

/* HERO LEAD LINKS — gold/amber, contrasts blue background */
.innx-hero-lead a:not(.bullet-link):not(.heading-link),
.sd-hero__lead a:not(.bullet-link):not(.heading-link),
.bx-lead a:not(.bullet-link):not(.heading-link) {
  color: #FFD580 !important;
  text-decoration: underline !important;
  text-decoration-color: #FFD580 !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 4px !important;
  font-weight: 600 !important;
  border-bottom: none !important;
  transition: color 0.18s ease, text-decoration-color 0.18s ease, text-decoration-thickness 0.18s ease !important;
}
.innx-hero-lead a:not(.bullet-link):not(.heading-link):hover,
.sd-hero__lead a:not(.bullet-link):not(.heading-link):hover,
.bx-lead a:not(.bullet-link):not(.heading-link):hover {
  color: #FFE9B0 !important;
  text-decoration-color: #FFE9B0 !important;
  text-decoration-thickness: 3px !important;
}

/* BODY LINKS (sol__sub, tt__sub, industry__sub, panel__desc, etc.) — bold brand blue */
.tt__sub a:not(.bullet-link):not(.heading-link),
.sol__sub a:not(.bullet-link):not(.heading-link),
.industry__sub a:not(.bullet-link):not(.heading-link),
.ss__sub a:not(.bullet-link):not(.heading-link),
.offering__sub a:not(.bullet-link):not(.heading-link),
.faq__sub a:not(.bullet-link):not(.heading-link),
.panel__desc a:not(.bullet-link):not(.heading-link),
.discuss__desc a:not(.bullet-link):not(.heading-link),
.faq-item__a-inner a:not(.bullet-link):not(.heading-link),
.seo-faq-answer a:not(.bullet-link):not(.heading-link),
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]),
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]) {
  color: #005EB8 !important;
  text-decoration: underline !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  font-weight: inherit !important;
  border-bottom: none !important;
}
.tt__sub a:not(.bullet-link):not(.heading-link):hover,
.sol__sub a:not(.bullet-link):not(.heading-link):hover,
.industry__sub a:not(.bullet-link):not(.heading-link):hover,
.ss__sub a:not(.bullet-link):not(.heading-link):hover,
.offering__sub a:not(.bullet-link):not(.heading-link):hover,
.faq__sub a:not(.bullet-link):not(.heading-link):hover,
.panel__desc a:not(.bullet-link):not(.heading-link):hover,
.discuss__desc a:not(.bullet-link):not(.heading-link):hover,
.faq-item__a-inner a:not(.bullet-link):not(.heading-link):hover,
.seo-faq-answer a:not(.bullet-link):not(.heading-link):hover,
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]):hover,
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]):hover {
  color: #003e7e !important;
  text-decoration-color: #003e7e !important;
  text-decoration-thickness: auto !important;
}

/* BULLET-LINK — was dotted/faint, now solid brand blue 2px */
a.bullet-link,
li a.bullet-link {
  color: #005EB8 !important;
  text-decoration: underline !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  border-bottom: none !important;
  font-weight: inherit !important;
}
a.bullet-link:hover,
li a.bullet-link:hover {
  color: #003e7e !important;
  text-decoration-color: #003e7e !important;
  text-decoration-thickness: auto !important;
}

/* HEADING-LINK — was hover-only, now subtle solid underline default */
h2 .heading-link,
h3 .heading-link,
.heading-link {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(0, 94, 184, 0.5) !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 5px !important;
  border-bottom: none !important;
}
h2 .heading-link:hover,
h3 .heading-link:hover,
.heading-link:hover {
  color: #005EB8 !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: 3px !important;
}
h2 .heading-link::after,
h3 .heading-link::after,
.heading-link::after {
  content: "";
}

/* DARK MODE — body links use lighter blue */
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .offering__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link),
body:not(.light) .faq-item__a-inner a:not(.bullet-link):not(.heading-link),
body:not(.light) .seo-faq-answer a:not(.bullet-link):not(.heading-link),
body:not(.light) a.bullet-link {
  color: #6FB7FF !important;
  text-decoration-color: #6FB7FF !important;
}
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) a.bullet-link:hover {
  color: #9CCAFF !important;
  text-decoration-color: #9CCAFF !important;
}
/* ════════════════════════════════════════════
   SEO LINK HOVER FIX (2026-05-08 round 3)
   - Bullet underline: HERO BLUE #0558BD
   - Hover: text color matches underline, thickness STAYS same (no thickening)
   - Same hover pattern applied to body links + heading-links for consistency
   ════════════════════════════════════════════ */

/* BULLET-LINK — hero blue underline, neutral text default, color match on hover */
a.bullet-link,
li a.bullet-link {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  border-bottom: none !important;
  font-weight: inherit !important;
  transition: color 0.18s ease !important;
}
a.bullet-link:hover,
li a.bullet-link:hover {
  color: #0558BD !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: auto !important;
}

/* BODY PARAGRAPH LINKS — same pattern as bullets */
.tt__sub a:not(.bullet-link):not(.heading-link),
.sol__sub a:not(.bullet-link):not(.heading-link),
.industry__sub a:not(.bullet-link):not(.heading-link),
.ss__sub a:not(.bullet-link):not(.heading-link),
.offering__sub a:not(.bullet-link):not(.heading-link),
.faq__sub a:not(.bullet-link):not(.heading-link),
.panel__desc a:not(.bullet-link):not(.heading-link),
.discuss__desc a:not(.bullet-link):not(.heading-link),
.faq-item__a-inner a:not(.bullet-link):not(.heading-link),
.seo-faq-answer a:not(.bullet-link):not(.heading-link),
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]),
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]) {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  border-bottom: none !important;
  font-weight: inherit !important;
  transition: color 0.18s ease !important;
}
.tt__sub a:not(.bullet-link):not(.heading-link):hover,
.sol__sub a:not(.bullet-link):not(.heading-link):hover,
.industry__sub a:not(.bullet-link):not(.heading-link):hover,
.ss__sub a:not(.bullet-link):not(.heading-link):hover,
.offering__sub a:not(.bullet-link):not(.heading-link):hover,
.faq__sub a:not(.bullet-link):not(.heading-link):hover,
.panel__desc a:not(.bullet-link):not(.heading-link):hover,
.discuss__desc a:not(.bullet-link):not(.heading-link):hover,
.faq-item__a-inner a:not(.bullet-link):not(.heading-link):hover,
.seo-faq-answer a:not(.bullet-link):not(.heading-link):hover,
main p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]):hover,
article p a:not(.bullet-link):not(.heading-link):not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="tab"]):hover {
  color: #0558BD !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: auto !important;
}

/* HEADING-LINK — same pattern */
h2 .heading-link,
h3 .heading-link,
.heading-link {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 5px !important;
  border-bottom: none !important;
  transition: color 0.18s ease !important;
}
h2 .heading-link:hover,
h3 .heading-link:hover,
.heading-link:hover {
  color: #0558BD !important;
  text-decoration-color: #0558BD !important;
  text-decoration-thickness: 2px !important;
}

/* HERO LINKS — keep amber (already visible against blue), hover stays same thickness */
.innx-hero-lead a:not(.bullet-link):not(.heading-link),
.sd-hero__lead a:not(.bullet-link):not(.heading-link),
.bx-lead a:not(.bullet-link):not(.heading-link) {
  color: #FFD580 !important;
  text-decoration: underline !important;
  text-decoration-color: #FFD580 !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 4px !important;
  font-weight: 600 !important;
  border-bottom: none !important;
  transition: color 0.18s ease !important;
}
.innx-hero-lead a:not(.bullet-link):not(.heading-link):hover,
.sd-hero__lead a:not(.bullet-link):not(.heading-link):hover,
.bx-lead a:not(.bullet-link):not(.heading-link):hover {
  color: #FFE9B0 !important;
  text-decoration-color: #FFE9B0 !important;
  text-decoration-thickness: 2px !important;
}

/* DARK MODE — hero blue equivalent for dark bg */
body:not(.light) a.bullet-link,
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link),
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link),
body:not(.light) .heading-link {
  text-decoration-color: #6FB7FF !important;
}
body:not(.light) a.bullet-link:hover,
body:not(.light) .tt__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .sol__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .industry__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .ss__sub a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .panel__desc a:not(.bullet-link):not(.heading-link):hover,
body:not(.light) .heading-link:hover {
  color: #6FB7FF !important;
  text-decoration-color: #6FB7FF !important;
  text-decoration-thickness: auto !important;
}

/* ============================================================
   Premium content-link underline (reference feel) — site-wide.
   text-underline-offset + text-decoration-thickness ONLY affect links that are
   already underlined (content / heading / bullet links). Nav, buttons, cards
   (text-decoration:none) are visually unaffected. Gives the subtle, offset,
   premium underline like reference instead of the cramped default.
   ============================================================ */
a{text-underline-offset:2px;text-decoration-thickness:auto}

/* ════════════════════════════════════════════════════════════════
   EXACT reference link underline — taken verbatim from the locations
   page (sp-location.css). Applied to EVERY content link site-wide,
   whether the text is bold or not. Last rule = wins over everything.
   underline · #005EB8 · 2px offset · 1px thickness · natural wrap ·
   hover = text turns #005EB8. (skip-ink default = breaks at descenders)
   ════════════════════════════════════════════════════════════════ */
a.bullet-link, a.heading-link, .heading-link,
h2 .heading-link, h3 .heading-link,
.ab-prose a, .a-wysiwyg a,
.innx-hero-lead a:not([class*="btn"]):not([class*="cta"]),
.sd-hero__lead a:not([class*="btn"]):not([class*="cta"]),
.bx-lead a:not([class*="btn"]):not([class*="cta"]),
.tt__sub a:not([class*="btn"]):not([class*="cta"]),
.sol__sub a:not([class*="btn"]):not([class*="cta"]),
.industry__sub a:not([class*="btn"]):not([class*="cta"]),
.ss__sub a:not([class*="btn"]):not([class*="cta"]),
.offering__sub a:not([class*="btn"]):not([class*="cta"]),
.faq__sub a:not([class*="btn"]):not([class*="cta"]),
.panel__desc a:not([class*="btn"]):not([class*="cta"]),
.discuss__desc a:not([class*="btn"]):not([class*="cta"]),
.faq-item__a-inner a:not([class*="btn"]):not([class*="cta"]),
.seo-faq-answer a:not([class*="btn"]):not([class*="cta"]),
main p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="hero"]):not([href^="javascript"]),
main li a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([href^="javascript"]),
article p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]) {
  text-decoration: underline !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  border-bottom: none !important;
  white-space: normal !important;
  transition: color .12s ease-in-out !important;
}
a.bullet-link:hover, a.heading-link:hover, .heading-link:hover,
.ab-prose a:hover, .a-wysiwyg a:hover,
.panel__desc a:not([class*="btn"]):hover, .discuss__desc a:not([class*="btn"]):hover,
.faq-item__a-inner a:not([class*="btn"]):hover, .seo-faq-answer a:not([class*="btn"]):hover,
.innx-hero-lead a:not([class*="btn"]):hover, .sd-hero__lead a:not([class*="btn"]):hover,
.bx-lead a:not([class*="btn"]):hover, .tt__sub a:not([class*="btn"]):hover,
.sol__sub a:not([class*="btn"]):hover, .industry__sub a:not([class*="btn"]):hover,
.ss__sub a:not([class*="btn"]):hover, .offering__sub a:not([class*="btn"]):hover,
.faq__sub a:not([class*="btn"]):hover,
main p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):hover,
main li a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):hover {
  color: #005EB8 !important;
  text-decoration-color: #005EB8 !important;
  text-decoration-thickness: auto !important;
  text-shadow: none !important;
}

/* ============================================================
   Auto-added internal links should match the surrounding text
   weight — NOT bold. (Headings keep their bold via inherit.)
   ============================================================ */
main a.bullet-link, main a.inline-link,
main p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]):not([class*="hero"]),
main li a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):not([class*="pill"]),
.a-wysiwyg a:not([class*="btn"]):not([class*="cta"]),
.ab-prose a:not([class*="btn"]):not([class*="cta"]) {
  font-weight: inherit !important;
}
body:not(.light) a.bullet-link, body:not(.light) a.heading-link, body:not(.light) .heading-link,
body:not(.light) main p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]),
body:not(.light) main li a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]) {
  text-decoration-color: #6FB7FF !important;
}
body:not(.light) a.bullet-link:hover, body:not(.light) .heading-link:hover,
body:not(.light) main p a:not([class*="btn"]):not([class*="cta"]):not([class*="card"]):hover {
  color: #6FB7FF !important;
  text-decoration-color: #6FB7FF !important;
}

/* ════════════════════════════════════════════════════════════════
   DOUBLE-UNDERLINE GUARD  (site-wide, authoritative — keep LAST)
   ----------------------------------------------------------------
   Some wrapper elements (card headings, expert names, benefit titles)
   set text-decoration:underline on the ELEMENT itself. When that element
   also contains a content link (.bullet-link), the browser paints TWO
   underlines — one from the wrapper, one from the link. The link already
   carries the reference underline everywhere, so any wrapper that holds a
   content link must drop its own underline. No link inside => wrapper
   keeps its original design underline (this rule simply doesn't match).
   ════════════════════════════════════════════════════════════════ */
h1:has(a.bullet-link), h2:has(a.bullet-link), h3:has(a.bullet-link),
h4:has(a.bullet-link), h5:has(a.bullet-link), h6:has(a.bullet-link),
.saas-type-card h3:has(a), .benefit-title:has(a), .expert-name:has(a),
.scope-card-body h3:has(a),
*:has(> a.bullet-link) {
  text-decoration: none !important;
}


/* ===== INNERLUXES shared contact block (ilcb) ===== */

/* full-width gradient band — identical to contact-us .sac-hero + .container */
.ilcb{background:linear-gradient(180deg,#eaf5ff 0%,#d6efff 100%);padding:40px 0 48px;}
body:not(.light) .ilcb{background:linear-gradient(180deg,#161b22 0%,#1a1814 100%);}
.ilcb>.sac-grid{max-width:1238px;width:100%;margin:0 auto;padding:0 24px;box-sizing:border-box;}
@media (max-width:767px){.ilcb{padding:28px 0 34px;}.ilcb>.sac-grid{padding:0 16px;}}
/* TOC pages: contact moved to be a sibling AFTER .page-body — full-bleed band, clear of the sticky TOC */
.ilcb-full{width:100%;margin:0;}
/* match contact-us: focus shows via the blue BORDER only — kill the focus-visible outline ring AND the 3px box-shadow ring */
.ilcb .form-input:focus,.ilcb .form-input:focus-visible,.ilcb .form-textarea:focus,.ilcb .form-textarea:focus-visible,.ilcb .iti input:focus,.ilcb .iti input:focus-visible,.ilcb .form-input-wrapper:focus-within,.ilcb .form-textarea-wrapper:focus-within{outline:none !important;box-shadow:none !important;}

/* ---- dark mode: fix elements that stayed light (upload box, chips, radios) ---- */
body:not(.light) .cuf-form .form-upload-input-wrapper{background-color:#161412;border-color:#3a3631;}
body:not(.light) .cuf-form .form-upload-input-wrapper.dragover{background-color:#1e2a38;border-color:#60a5fa;}
body:not(.light) .cuf-form .form-upload-text{color:#c4bfb6;}
body:not(.light) .cuf-form .form-upload-text label{color:#60a5fa;}
body:not(.light) .cuf-form .form-upload-img{background:#222e3a;color:#60a5fa;}
body:not(.light) .cuf-form .cf-upload-tip{background:#222e3a;color:#c4bfb6;}
body:not(.light) .cuf-form .cf-file-chip{background:#222e3a;color:#9ec5ff;}
body:not(.light) .cuf-form .cf-file-chip button{color:#c4bfb6;}
body:not(.light) .cuf-form .form-radio-group-label,body:not(.light) .cuf-form .form-radio-label{color:#c4bfb6;}
body:not(.light) .cuf-form .form-radio-checkmark{border-color:#5a554d;}
body:not(.light) .cuf-form .form-radio-label input[type=radio]:checked~.form-radio-checkmark{border-color:#60a5fa;}
body:not(.light) .cuf-form .form-radio-label input[type=radio]:checked~.form-radio-checkmark:after{background:#60a5fa;}

/* ============================================================
         CONTACT US — form-first layout (mirrors SCN contact structure)
         ============================================================ */
      .sac-page{--sac-blue:#005eb8;--sac-blue-dk:#004484;}
      .sac-hero{background:linear-gradient(180deg,#eaf5ff 0%,#d6efff 100%);padding:36px 0 56px;}
      .sac-bc .breadcrumbs__list{padding:18px 0 6px;}
      .sac-h1{color:#004484;font-family:var(--font-family-header,"Sumana"),serif;font-size:40px;font-weight:400;line-height:1.14;margin:6px 0 10px;}
      @media (max-width:1023px){.sac-h1{font-size:32px;}}
      @media (max-width:767px){.sac-h1{font-size:27px;}}
      .sac-intro{font-size:16px;line-height:1.6;color:#3b3c3d;max-width:760px;margin:0 0 28px;}
      .sac-grid{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:32px;align-items:start;}
      @media (max-width:1023px){.sac-grid{grid-template-columns:minmax(0,1fr);gap:24px;}}

      /* ---- form card ---- */
      .sac-card{background:#fff;border-radius:10px;box-shadow:0 18px 50px rgba(0,42,90,.12);padding:32px;min-width:0;}
      .cuf-form{min-width:0;}
      @media (max-width:767px){.sac-card{padding:22px 18px;}}
      .sac-formhead{margin-bottom:20px;}
      .sac-formtitle{font-size:24px;font-weight:600;color:#222;line-height:1.3;margin:0 0 8px;overflow-wrap:break-word;}
      .sac-formsub{font-size:15px;line-height:1.6;color:#3b3c3d;margin:0;overflow-wrap:break-word;}

      /* ---- form fields (functional) ---- */
      .cuf-form .form-textarea-wrapper,.cuf-form .form-input-wrapper{position:relative;}
      .cuf-form .form-textarea-wrapper{margin-bottom:0;}
      .cuf-form .form-input,.cuf-form .form-textarea{width:100%;box-sizing:border-box;border:1px solid #949494;border-radius:2px;color:#464749;font-size:16px;line-height:1.5;padding:11px 12px;background:#fff;outline:none;transition:border-color .12s ease;}
      .cuf-form .form-textarea{display:block;line-height:1.6;padding:12px;resize:vertical;min-height:104px;}
      .cuf-form .form-input::placeholder,.cuf-form .form-textarea::placeholder{color:#7a7a7a;font-size:14px;}
      .cuf-form .form-input:focus,.cuf-form .form-textarea:focus{border-color:#005eb8;}
      .cuf-form .form-element-label{position:absolute;left:8px;top:0;font-size:12px;line-height:1.2;color:#7a7a7a;background:#fff;padding:0 4px;opacity:0;transform:translateY(0);transition:opacity .2s ease,transform .2s ease,color .1s ease;pointer-events:none;}
      .cuf-form .form-input:focus~.form-element-label,.cuf-form .form-textarea:focus~.form-element-label{color:#005eb8;}
      .cuf-form .form-input:not(:placeholder-shown)~.form-element-label,.cuf-form .form-textarea:not(:placeholder-shown)~.form-element-label{opacity:1;transform:translateY(-6px);}
      .cuf-form .has-error .form-input,.cuf-form .has-error .form-textarea{border-color:#e4002b;}
      .cuf-form .form-element-error{display:block;color:#e4002b;font-size:12px;line-height:1.5;margin-top:4px;}
      body:not(.light) .cuf-form .has-error .form-input,body:not(.light) .cuf-form .has-error .form-textarea{border-color:#ff6b7d;}
      body:not(.light) .cuf-form .form-element-error{color:#ff6b7d;}
      /* upload */
      .cuf-form .form-upload-input-wrapper{background-color:#f7f9fa;border:1px dashed #b6bcc2;border-radius:2px;padding:10px 12px;margin-top:16px;transition:background-color .2s ease,border-color .2s ease;}
      .cuf-form .form-upload-input-wrapper.dragover{background-color:#f2f9fe;border-color:#115689;}
      .cuf-form .form-upload-input-row{display:flex;align-items:center;}
      .cuf-form .form-upload-img{background:#d6ebff;color:#005eb8;border-radius:100%;display:flex;align-items:center;justify-content:center;height:26px;width:26px;flex:0 0 auto;margin-right:8px;}
      .cuf-form .form-upload-img svg{width:16px;height:16px;}
      .cuf-form .form-upload-text{color:#555;font-size:14px;line-height:1.7;margin:0 8px 0 0;}
      .cuf-form .form-upload-text label{color:#005eb8;cursor:pointer;font-weight:600;}
      .cuf-form .form-upload-input{display:none;}
      .cuf-form .form-upload-input-files{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px;}
      .cuf-form .cf-file-chip{display:inline-flex;align-items:center;gap:6px;background:#e5f2fe;color:#005eb8;font-size:12px;padding:3px 8px;border-radius:2px;}
      .cuf-form .cf-file-chip button{border:0;background:none;color:#666c73;cursor:pointer;font-size:14px;line-height:1;padding:0;}
      .cuf-form .cf-upload-tip{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:auto;border-radius:50%;background:#e5f2fe;color:#666c73;font-size:11px;font-weight:600;cursor:pointer;flex:0 0 auto;}
      .cuf-form .cf-upload-tip-content{position:absolute;right:0;bottom:calc(100% + 8px);width:260px;background:#3b3c3d;color:#fff;font-size:12px;line-height:1.5;padding:10px 12px;border-radius:3px;display:flex;flex-direction:column;gap:4px;opacity:0;visibility:hidden;transition:opacity .15s ease;z-index:5;}
      .cuf-form .cf-upload-tip:hover .cf-upload-tip-content{opacity:1;visibility:visible;}
      /* user inputs grid */
      .cuf-form .contact-form-user-inputs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-top:20px;}
      @media (max-width:520px){.cuf-form .contact-form-user-inputs{grid-template-columns:1fr;}}
      /* radios */
      .cuf-form .form-radio-group-wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px;}
      .cuf-form .form-radio-group{display:flex;flex-wrap:wrap;align-items:center;gap:16px;}
      .cuf-form .form-radio-group-label{color:#3b3c3d;font-size:15px;line-height:1.5;}
      .cuf-form .form-radio-label{display:flex;align-items:center;gap:8px;color:#3b3c3d;font-size:15px;cursor:pointer;margin:0;position:relative;}
      .cuf-form .form-radio-label input[type=radio]{position:absolute;width:0;height:0;opacity:0;}
      .cuf-form .form-radio-checkmark{border:1.5px solid #949494;border-radius:50%;width:16px;height:16px;flex:0 0 auto;position:relative;}
      .cuf-form .form-radio-checkmark:after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-radius:50%;background:#005eb8;opacity:0;transform:translate(-50%,-50%);}
      .cuf-form .form-radio-label input[type=radio]:checked~.form-radio-checkmark{border-color:#005eb8;}
      .cuf-form .form-radio-label input[type=radio]:checked~.form-radio-checkmark:after{opacity:1;}
      /* NDA toggle */
      .contact-form-nda-checkbox{margin:18px 0 4px;}
      .form-checkbox-ios-like-wrapper{align-items:center;display:flex;width:-moz-fit-content;width:fit-content;}
      .form-checkbox-ios-like-label{color:#3b3c3d;margin:0;font-size:14px;line-height:1.5;cursor:pointer;}
      .form-checkbox-ios-like-wrapper .form-checkbox-ios-like{-webkit-appearance:none;appearance:none;background-color:#e8e8e8;border:none;border-radius:20px;cursor:pointer;display:inline-block;height:20px;margin-left:12px;outline:none;padding:0;position:relative;transition:all .17s ease-out;width:36px;flex:0 0 auto;}
      .form-checkbox-ios-like-wrapper .form-checkbox-ios-like:checked{background:#005eb8;}
      .form-checkbox-ios-like-wrapper .form-checkbox-ios-like:checked:after{transform:translateX(16px);}
      .form-checkbox-ios-like-wrapper .form-checkbox-ios-like:after{background:#fff;border-radius:100%;box-shadow:0 4px 4px 0 #2222221a;content:"";height:16px;left:2px;position:absolute;top:2px;transition:all .17s ease-out;width:16px;}
      body:not(.light) .form-checkbox-ios-like-label{color:#e8e4dc;}
      body:not(.light) .form-checkbox-ios-like-wrapper .form-checkbox-ios-like{background-color:#3a3631;}
      body:not(.light) .form-checkbox-ios-like-wrapper .form-checkbox-ios-like:checked{background:#60a5fa;}
      /* Send button */
      .contact-form-submit-btn{background-image:linear-gradient(90deg,#ffe17a,#f5bd00);background-size:150%;background-position:0 0;border:none;color:#222;cursor:pointer;display:block;font-size:18px;font-weight:600;line-height:1.5;margin:22px 0 0;min-width:160px;padding:2px;transition:background-position .25s ease;width:-moz-fit-content;width:fit-content;}
      .contact-form-submit-btn:hover{background-position:50% 0;}
      .contact-form-submit-btn-text{border:1px solid #fff4cf;display:block;padding:9px 34px;}
      .contact-form-submit-btn:disabled{opacity:.6;cursor:default;}

      /* ---- right column ---- */
      .sac-side{display:flex;flex-direction:column;gap:20px;}
      .sac-panel{background:#fff;border-radius:10px;box-shadow:0 12px 36px rgba(0,42,90,.10);padding:24px;}
      .sac-panel-title{font-size:16px;font-weight:600;color:#222;margin:0 0 14px;}
      .sac-panel-title:after{content:"";display:block;width:34px;height:2px;background:#ed8b00;margin-top:6px;}
      .sac-contacts-list{display:flex;flex-direction:column;gap:6px;}
      .sac-contact{display:flex;align-items:center;gap:12px;padding:9px 8px;border-radius:6px;color:#1f2937;font-size:15px;text-decoration:none;transition:background .14s ease,color .14s ease;}
      .sac-contact:hover{background:#eaf5ff;color:#005eb8;}
      .sac-contact-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#e5f2fe;color:#005eb8;}
      .sac-contact-ic svg{width:17px;height:17px;}
      .sac-contact b{display:block;font-weight:600;font-size:12px;color:#7a8794;line-height:1.3;}
      .sac-brief-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
      .sac-brief-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:#3b3c3d;}
      .sac-brief-list li svg{flex:0 0 auto;width:18px;height:18px;color:#2ea043;margin-top:1px;}

      /* ---- section frame ---- */
      .sac-sec{padding:46px 0;}
      @media (max-width:767px){.sac-sec{padding:34px 0;}}
      .sac-sec-title{font-family:var(--font-family-header,"Sumana"),serif;font-size:30px;font-weight:400;color:#004484;margin:0 0 24px;}
      @media (max-width:767px){.sac-sec-title{font-size:25px;margin-bottom:18px;}}
      /* remove SCN-style blue square decoration behind every h2 on this page */
      .sac-page h2::before{display:none !important;content:none !important;}

      /* ---- feature bullets ---- */
      .sac-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
      @media (max-width:900px){.sac-features-grid{grid-template-columns:1fr;gap:14px;}}
      .sac-feature{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #e3eaf1;border-radius:8px;padding:20px 22px;}
      .sac-feature-ic{flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:#e5f2fe;color:#005eb8;display:flex;align-items:center;justify-content:center;}
      .sac-feature-ic svg{width:21px;height:21px;}
      .sac-feature h3{font-size:17px;font-weight:600;color:#222;margin:0 0 5px;}
      .sac-feature p{font-size:14px;line-height:1.6;color:#3b3c3d;margin:0;}

      /* ---- trust strip / badges ---- */
      .sac-trust{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;padding:8px 0 0;}
      .sac-trust-item{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e3eaf1;border-radius:8px;padding:12px 18px;min-width:0;}
      .sac-trust-num{font-family:var(--font-family-header,"Sumana"),serif;font-size:26px;line-height:1;color:#004484;}
      .sac-trust-txt{font-size:13px;line-height:1.35;color:#3b3c3d;}
      .sac-trust-iso{height:50px;width:auto;display:block;}

      /* ---- FAQ ---- */
      .sac-faq-item{border-bottom:1px solid #e3eaf1;}
      .sac-faq-item:first-child{border-top:1px solid #e3eaf1;}
      .sac-faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;cursor:pointer;padding:18px 4px;font-size:17px;font-weight:600;color:#222;list-style:none;}
      .sac-faq-q:hover{color:#005eb8;}
      .sac-faq-q svg{width:18px;height:18px;color:#005eb8;transition:transform .3s ease;flex:0 0 auto;}
      .sac-faq-item.open .sac-faq-q svg{transform:rotate(180deg);}
      .sac-faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
      .sac-faq-item.open .sac-faq-a{max-height:480px;}
      .sac-faq-a p{font-size:15px;line-height:1.72;color:#3b3c3d;padding:0 4px 18px;margin:0;}
      .sac-faq-a a{color:#005eb8;text-decoration:underline;}

      /* dark mode */
      body:not(.light) .sac-hero{background:linear-gradient(180deg,#161b22 0%,#1a1814 100%);}
      body:not(.light) .sac-h1,body:not(.light) .sac-trust-num,body:not(.light) .sac-sec-title{color:#cfe4ff;}
      body:not(.light) .sac-intro,body:not(.light) .sac-feature p,body:not(.light) .sac-faq-a p{color:#c4bfb6;}
      body:not(.light) .sac-card,body:not(.light) .sac-panel,body:not(.light) .sac-feature{background:#1e1c18;box-shadow:0 12px 36px rgba(0,0,0,.4);}
      body:not(.light) .sac-feature{border-color:#2c2a26;}
      body:not(.light) .sac-formtitle,body:not(.light) .sac-panel-title,body:not(.light) .sac-feature h3,body:not(.light) .sac-faq-q{color:#e8e4dc;}
      body:not(.light) .sac-formsub,body:not(.light) .sac-brief-list li,body:not(.light) .sac-trust-txt{color:#c4bfb6;}
      body:not(.light) .sac-contact{color:#e8e4dc;}
      body:not(.light) .sac-contact:hover{background:#222e3a;color:#60a5fa;}
      body:not(.light) .sac-contact-ic,body:not(.light) .sac-feature-ic{background:#222e3a;color:#60a5fa;}
      body:not(.light) .sac-trust-item{background:#1e1c18;border-color:#2c2a26;}
      body:not(.light) .sac-faq-item,body:not(.light) .sac-faq-item:first-child{border-color:#2c2a26;}
      body:not(.light) .sac-faq-q:hover{color:#60a5fa;}
      body:not(.light) .cuf-form .form-input,body:not(.light) .cuf-form .form-textarea{background:#161412;border-color:#3a3631;color:#e8e4dc;}
      body:not(.light) .cuf-form .form-element-label{background:#1e1c18;color:#c4bfb6;}

      /* ---- mobile polish ---- */
      @media (max-width:767px){
        .sac-hero{padding:18px 0 32px;}
        .sac-bc .breadcrumbs__list{padding:14px 0 4px;}
        .sac-h1{font-size:26px;margin:4px 0 8px;}
        .sac-intro{font-size:15px;margin-bottom:18px;}
        .sac-grid{gap:18px;}
        .sac-card{padding:20px 16px;}
        .sac-formtitle{font-size:20px;}
        .sac-formsub{font-size:14px;}
        .sac-panel{padding:18px 16px;}
        .cuf-form .contact-form-submit-btn{width:100%;min-width:0;}
        .cuf-form .contact-form-submit-btn-text{display:block;text-align:center;}
        .sac-trust{gap:10px;}
        .sac-trust-item{flex:1 1 calc(50% - 6px);justify-content:center;padding:12px 12px;}
        .sac-trust-iso{height:42px;}
      }
      @media (max-width:380px){.sac-trust-item{flex:1 1 100%;}}

      /* thank-you popup */
      .cf-thankyou{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(8,18,32,.55);box-sizing:border-box;}
      .cf-thankyou[hidden]{display:none!important;}
      .cf-thankyou-box{position:relative;width:440px;max-width:93vw;background:#fff;border-radius:6px;box-shadow:0 18px 60px rgba(0,0,0,.4);padding:40px 32px 32px;text-align:center;box-sizing:border-box;}
      .cf-thankyou-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:#e6f4ea;color:#2ea043;margin-bottom:16px;}
      .cf-thankyou-icon svg{width:34px;height:34px;}
      .cf-thankyou-title{font-size:24px;font-weight:700;color:#1a2a3a;margin:0 0 10px;}
      .cf-thankyou-text{font-size:15px;line-height:1.6;color:#5a6573;margin:0 0 24px;}
      .cf-thankyou-btn{background:#005EB8;color:#fff;border:0;border-radius:2px;font-size:16px;font-weight:600;padding:11px 40px;cursor:pointer;transition:background .15s;}
      .cf-thankyou-btn:hover{background:#004484;}
      .cf-thankyou-close{position:absolute;top:10px;right:10px;width:32px;height:32px;border:0;background:none;color:#737373;cursor:pointer;display:flex;align-items:center;justify-content:center;}
      .cf-thankyou-close:hover{color:#1a2a3a;}
      .cf-thankyou-close svg{width:18px;height:18px;}
      body:not(.light) .cf-thankyou-box{background:#1e1c18;}
      body:not(.light) .cf-thankyou-title{color:#e8e4dc;}
      body:not(.light) .cf-thankyou-text{color:#c4bfb6;}
      body:not(.light) .cf-thankyou-close{color:#c4bfb6;}
      body:not(.light) .cf-thankyou-close:hover{color:#e8e4dc;}
/* ===== end ilcb ===== */

/* ===== dark mode: inline light callout boxes (style="...background:#f8f9fa...")
   6 pages use hard-coded inline #f8f9fa bands that dark mode can't recolor;
   !important in a stylesheet beats inline declarations ===== */
body:not(.light) main [style*="background:#f8f9fa"]{background:#1e1c18 !important;}