/* ============================================================
   Delancey Street — Main Stylesheet
   Translates the inline-styled JSX components into reusable
   classes. Mobile-first refinements at the bottom.
   ============================================================ */

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

/* ============================================================
   /glossary/ — pillar resource page
   ============================================================ */
.ds-glossary-hero { padding: 72px 60px 48px; background: var(--ds-paper); border-bottom: 1px solid var(--ds-line); }
.ds-glossary-hero__inner { max-width: 1080px; margin: 0 auto; }
.ds-glossary-hero h1 { font-size: clamp(40px, 6vw, 72px); font-weight: 900; letter-spacing: -0.02em; line-height: 1.02; text-transform: uppercase; margin: 16px 0 0; color: var(--ds-ink); }
.ds-glossary-hero h1 .ds-emph { color: var(--ds-cyan); }
.ds-glossary-hero__sub { font-size: 18px; line-height: 1.55; color: var(--ds-ink-3); max-width: 760px; margin: 24px 0 0; font-weight: 500; }
.ds-glossary-hero__jump { display: flex; flex-wrap: wrap; gap: 10px 14px; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--ds-line); }
.ds-glossary-hero__jump a { font-size: 12px; font-weight: 700; color: var(--ds-cyan-deep, #0a8fbc); padding: 8px 14px; border: 1px solid var(--ds-line); border-radius: 999px; background: #fff; transition: background .15s, color .15s; letter-spacing: 0.04em; text-transform: uppercase; }
.ds-glossary-hero__jump a:hover { background: var(--ds-cyan); color: #fff; border-color: var(--ds-cyan); }

.ds-glossary-section { padding: 64px 60px; border-bottom: 1px solid var(--ds-line); }
.ds-glossary-section:nth-child(odd) { background: #fff; }
.ds-glossary-section:nth-child(even) { background: var(--ds-paper); }
.ds-glossary-section__inner { max-width: 1080px; margin: 0 auto; }
.ds-glossary-section__head { margin-bottom: 36px; max-width: 760px; }
.ds-glossary-section__head h2 { font-size: clamp(28px, 4vw, 42px); font-weight: 900; letter-spacing: -0.015em; color: var(--ds-ink); margin: 0; text-transform: uppercase; }
.ds-glossary-section__head p { font-size: 16px; line-height: 1.6; color: var(--ds-ink-3); margin: 14px 0 0; font-weight: 500; }

.ds-glossary-list { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; padding: 0; }
.ds-glossary-entry { padding: 22px 0; border-top: 1px solid var(--ds-line); display: grid; grid-template-columns: 240px 1fr; gap: 24px; align-items: start; }
.ds-glossary-entry:first-child { border-top: 0; }
.ds-glossary-entry dt { font-size: 15px; font-weight: 800; color: var(--ds-ink); letter-spacing: -0.005em; }
.ds-glossary-entry dd { font-size: 15px; line-height: 1.65; color: var(--ds-ink-3); margin: 0; font-weight: 500; }
.ds-glossary-entry__see-also { display: block; margin-top: 8px; font-size: 13px; color: var(--ds-muted); }
.ds-glossary-entry__see-also a { color: var(--ds-cyan-deep, #0a8fbc); font-weight: 700; text-decoration: none; border-bottom: 1px solid currentColor; }
.ds-glossary-entry__see-also a:hover { color: var(--ds-cyan); }

@media (max-width: 800px) {
  .ds-glossary-hero { padding: 48px 20px 32px; }
  .ds-glossary-section { padding: 48px 20px; }
  .ds-glossary-entry { grid-template-columns: 1fr; gap: 6px; padding: 18px 0; }
  .ds-glossary-entry dt { font-size: 16px; }
}

.ds-glossary-cta-prelude { padding: 48px 60px; background: var(--ds-ink); color: #fff; text-align: center; }
.ds-glossary-cta-prelude__inner { max-width: 760px; margin: 0 auto; }
.ds-glossary-cta-prelude p { font-size: 17px; line-height: 1.6; color: rgba(255,255,255,0.86); margin: 0; font-weight: 500; }
@media (max-width: 800px) { .ds-glossary-cta-prelude { padding: 36px 20px; } }

/* Canonical attorney-cost promise — see ds_attorney_cost_text(). */
.ds-atty-cost__lead { margin: 0 0 6px; font-weight: 700; }
.ds-atty-cost__note {
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  color: var(--ds-muted, #5c6a7e);
  font-weight: 500;
  font-style: italic;
}
.ds-atty-cost__star { font-weight: 800; color: var(--ds-cyan, #00b8f0); margin-left: 2px; }

/* Prevent any single overflowing element (decorative right-side d-marks,
   wide uppercase headings, positioned background patterns) from forcing
   horizontal scroll on phones and clipping the rest of the layout.
   `overflow-x: clip` is stricter than `hidden` (it hard-clips without
   establishing a scroll context) and is essential when fixed-position
   sticky CTAs and modal overlays are in play. */
html { overflow-x: clip; overflow-x: hidden; }
body { overflow-x: clip; overflow-x: hidden; max-width: 100vw; width: 100%; }
/* Top-level section containers should also clip their own decorative
   right-side d-marks so a long uppercase headline can wrap without the
   pattern leaking past the viewport. */
@media (max-width: 800px) {
  .ds-section, .ds-hero, .ds-banner-100m, .ds-cta-band, .ds-inner-hero,
  .ds-page-body, .ds-footer, .ds-track, .ds-how, .ds-howit,
  .ds-difference, .ds-team, .ds-compare, .ds-form-section, .ds-press,
  .ds-blog-grid, .ds-industries, .ds-industries-home, .ds-team-strip,
  .ds-real-people, .ds-real-success, .ds-press-releases, .ds-trusted,
  .ds-beat, .ds-shield, .ds-mca-final-cta, .ds-mca-section,
  .ds-service__hero, .ds-service__problem, .ds-service__process,
  .ds-service__states, .ds-service__resources, .ds-service__testimonial,
  .ds-service__faqs, .ds-team-single__hero, .ds-team-single__bio,
  .ds-team-single__cases, .ds-team-single__quote,
  .ds-blog-single__body-section, .ds-stateguide,
  .ds-case, .ds-list-section, .ds-guide-hero, .ds-guide,
  .ds-testimonials, .ds-getfree, .ds-blog-grid-home,
  .ds-difference-home, .ds-form-section, .ds-trusted, .ds-beat-home {
    overflow-x: clip;
    overflow-x: hidden;
  }
}
body {
  font-family: var(--ds-font);
  color: var(--ds-ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: var(--ds-fs-body);
  line-height: var(--ds-lh-body);
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ds-cyan-deep); }
button { font-family: inherit; }
h1, h2, h3, h4, h5, h6, p { margin: 0; }
h1, h2, h3, h4, h5, h6 {
  font-weight: var(--ds-fw-heavy, 800);
  letter-spacing: var(--ds-tracking-tight);
  line-height: var(--ds-lh-tight);
  color: var(--ds-ink);
}
ul, ol { list-style: none; padding: 0; margin: 0; }
input, textarea, select, button { font-family: inherit; }
:focus-visible { outline: 2px solid var(--ds-cyan); outline-offset: 2px; }

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--ds-ink);
  color: #fff;
  padding: 8px 14px;
  z-index: 9999;
}
.skip-link:focus { left: 0; }

.dsart, .dsart * { font-family: var(--ds-font); }

/* ---------- Layout helpers ---------- */
.ds-container { max-width: var(--ds-page-max); margin: 0 auto; padding: 0 var(--ds-page-pad-x); }
.ds-container--wide { max-width: var(--ds-page-max-wide); }
.ds-section { padding: var(--ds-section-y) var(--ds-page-pad-x); }
.ds-section--tight { padding: var(--ds-section-y-tight) var(--ds-page-pad-x); }
.ds-section--banner { padding: var(--ds-section-y-banner) var(--ds-page-pad-x); }
.ds-section--paper { background: var(--ds-paper); }
.ds-section--paper-2 { background: var(--ds-paper-2); }
.ds-section--ink { background: var(--ds-ink); color: #fff; }
.ds-section--ink-deep { background: var(--ds-ink-deep, #0a121f); color: #fff; }
.ds-section--ink h1,
.ds-section--ink h2,
.ds-section--ink h3,
.ds-section--ink h4,
.ds-section--ink-deep h1,
.ds-section--ink-deep h2,
.ds-section--ink-deep h3,
.ds-section--ink-deep h4 { color: #fff; }
.ds-section--ink .ds-section-sub,
.ds-section--ink-deep .ds-section-sub { color: rgba(255, 255, 255, .78); }

/* ---------- Eyebrow + section title ---------- */
.ds-eyebrow {
  font-size: 13px;
  font-weight: 800;
  /* WCAG AA: cyan #00B8F0 on white = 2.2:1 (fails). Deeper cyan gives ≥4.5:1. */
  color: var(--ds-cyan);
  letter-spacing: var(--ds-tracking-eyebrow);
  text-transform: uppercase;
  margin-bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.ds-eyebrow--rule::before { content: ""; width: 32px; height: 1px; background: var(--ds-cyan); }
/* Eyebrow on dark sections keeps the brighter cyan (already passes contrast on ink) */
.ds-section--ink .ds-eyebrow,
.ds-section--ink-deep .ds-eyebrow,
.ds-shield .ds-eyebrow,
.ds-form-section .ds-eyebrow,
.ds-difference-home .ds-eyebrow,
.ds-mca-final-cta .ds-eyebrow { color: var(--ds-cyan); }

/* ---------- Section mark (d-icon + horizontal rule above eyebrow) ---------- */
.ds-section-mark { display: flex; align-items: center; gap: 16px; margin-bottom: 36px; }
.ds-section-mark--center { justify-content: center; }
.ds-section-mark--center .ds-section-mark__rule { max-width: 220px; }
.ds-section-mark__icon { width: 22px; height: 28px; flex-shrink: 0; }
.ds-section-mark__rule { flex: 1; height: 1px; background: rgba(15, 26, 45, .10); }
.ds-section--ink .ds-section-mark__icon,
.ds-section--ink-deep .ds-section-mark__icon,
.ds-mca-final-cta .ds-section-mark__icon,
.ds-difference-home .ds-section-mark__icon,
.ds-form-section .ds-section-mark__icon,
.ds-shield .ds-section-mark__icon { filter: brightness(0) invert(1); }
.ds-section--ink .ds-section-mark__rule,
.ds-section--ink-deep .ds-section-mark__rule,
.ds-mca-final-cta .ds-section-mark__rule,
.ds-difference-home .ds-section-mark__rule,
.ds-form-section .ds-section-mark__rule,
.ds-shield .ds-section-mark__rule { background: rgba(255, 255, 255, .18); }
.ds-section-title {
  font-size: 54px;
  line-height: 1.04;
  letter-spacing: var(--ds-tracking-tight);
  font-weight: 800;
  text-transform: uppercase;
  color: var(--ds-ink);
  margin: 0;
}
.ds-section-title--white { color: #fff; }
.ds-section-title--lg { font-size: 54px; }
.ds-section-title--md { font-size: 42px; }
.ds-section-sub {
  font-size: 17px;
  line-height: 1.6;
  color: var(--ds-ink-3);
  margin-top: 20px;
  font-weight: 500;
}
.ds-emph { color: var(--ds-cyan); }

/* ---------- D-pattern utility (canonical) ----------
   Tiled white "d:" glyph, 48×70 tile. Use as a decorative absolute layer
   inside a position:relative parent with overflow:hidden.
   Default = CtaBand variant: right 45%, opacity 0.18.
   Modifiers: --hero (full, 0.04), --section (40%, 0.06), --cta (45%, 0.18),
              --cta-flat (45%, 0.28), --left (anchor left instead of right).
   ---------------------------------------------------- */
.d-pattern {
  position: absolute;
  inset: 0 0 0 auto;
  width: 45%;
  background-image: url('../images/d-mark-white.svg');
  background-repeat: repeat;
  background-size: 48px 70px;
  background-position: 0 0;
  opacity: var(--d-pattern-opacity, 0.18);
  pointer-events: none;
  z-index: 1;
}
.d-pattern--full,
.d-pattern--hero { width: 100%; inset: 0; --d-pattern-opacity: 0.04; }
.d-pattern--section { width: 40%; --d-pattern-opacity: 0.06; }
.d-pattern--cta { width: 45%; --d-pattern-opacity: 0.18; }
.d-pattern--cta-flat { width: 45%; --d-pattern-opacity: 0.28; }
.d-pattern--left { inset: 0 auto 0 0; }

/* ---------- Hairline rules + spacers ---------- */
.ds-rule { display: block; height: 1px; background: var(--ds-line); border: 0; }
.ds-rule--soft { background: var(--ds-line-soft); }
.ds-rule--ink { background: rgba(255, 255, 255, .12); }
.ds-rule--cyan { background: var(--ds-cyan); height: 2px; }

/* ---------- Pill / chip primitives ---------- */
.ds-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: var(--ds-radius-pill);
  background: var(--ds-paper-2);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: var(--ds-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--ds-ink);
}
.ds-pill--cyan { background: var(--ds-cyan); color: #fff; }
.ds-pill--ink { background: var(--ds-ink); color: #fff; }
.ds-pill--ghost-light {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .25);
  color: #fff;
}

/* ---------- Card primitive ---------- */
.ds-card {
  background: #fff;
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius-card);
  box-shadow: var(--ds-shadow-card);
  padding: 32px;
  transition: transform var(--ds-dur) var(--ds-ease),
              box-shadow var(--ds-dur) var(--ds-ease),
              border-color var(--ds-dur) var(--ds-ease);
}
.ds-card--paper { background: var(--ds-paper); }
.ds-card--ink { background: var(--ds-ink); color: #fff; border-color: rgba(255, 255, 255, .08); }
.ds-card--flat { box-shadow: none; }
.ds-card--lift:hover { transform: translateY(-3px); box-shadow: var(--ds-shadow-pop); border-color: var(--ds-cyan); }

/* ---------- CTA buttons ---------- */
.ds-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  height: 54px;
  padding: 0 32px;
  border-radius: var(--ds-radius-pill);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--ds-cyan);
  color: #fff;
  border: 0;
  cursor: pointer;
  box-shadow: var(--ds-shadow-cta);
  transition: transform var(--ds-dur) var(--ds-ease), box-shadow var(--ds-dur) var(--ds-ease);
}
.ds-cta:hover { transform: translateY(-1px); box-shadow: var(--ds-shadow-cta-hover); color: #fff; }
.ds-cta:focus-visible { outline: 2px solid var(--ds-ink); outline-offset: 3px; }
.ds-cta--lg { height: 60px; padding: 0 36px; font-size: 14px; }
.ds-cta--sm { height: 46px; padding: 0 22px; font-size: 12px; }
.ds-cta--ink { background: var(--ds-ink); color: #fff; box-shadow: none; }
.ds-cta--ink:hover { background: var(--ds-ink-2); color: #fff; box-shadow: none; }
.ds-cta--ghost {
  background: #fff;
  color: var(--ds-ink);
  border: 2px solid var(--ds-ink);
  box-shadow: none;
}
.ds-cta--ghost:hover { background: var(--ds-ink); color: #fff; box-shadow: none; }
.ds-cta--ghost-light {
  background: transparent;
  color: #fff;
  border: 1.5px solid rgba(255, 255, 255, .4);
  box-shadow: none;
}
.ds-cta--ghost-light:hover { background: rgba(255, 255, 255, .12); color: #fff; box-shadow: none; }
.ds-cta svg { transition: transform var(--ds-dur) var(--ds-ease); }
.ds-cta:hover svg { transform: translateX(3px); }

/* ============================================================
   HEADER + NAV (mega-menu)
   ============================================================ */
.ds-nav {
  position: sticky;
  top: 0;
  z-index: var(--ds-z-nav);
  background: #fff;
  border-bottom: 1px solid var(--ds-line);
}
.ds-nav.is-scrolled { box-shadow: 0 4px 16px rgba(15, 26, 45, .06); }

.ds-nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 40px;
  gap: 32px;
  max-width: 1480px;
  margin: 0 auto;
}
.ds-nav__logo { display: inline-flex; align-items: center; }
.ds-nav__logo img { height: 88px; width: auto; max-height: 88px; }
.ds-nav__logo img[src$=".svg"] { height: 88px; max-height: 88px; }

.ds-nav__list {
  display: flex;
  gap: 32px;
  font-size: 14px;
  color: var(--ds-ink-2);
  font-weight: 700;
  white-space: nowrap;
  align-items: center;
  margin: 0 auto;
}
.ds-nav__list > li { position: static; }
/* The mega panel positions relative to .ds-nav (which is sticky and therefore
 * a containing block) — NOT relative to its own <li>, otherwise it clips to a
 * single column the width of the trigger link. */
.ds-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  letter-spacing: 0.02em;
  padding: 8px 2px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color .15s ease, border-color .15s ease;
}
.ds-nav__link:hover,
.ds-nav__link[aria-expanded="true"],
.ds-nav__list .current-menu-item > .ds-nav__link {
  color: var(--ds-cyan);
  border-bottom-color: var(--ds-cyan);
}
/* Fix 2: clearer caret affordance + rotate on open */
.ds-nav__link[aria-expanded="true"] .ds-nav__caret { transform: rotate(180deg); }
.ds-nav__caret { transition: transform .2s ease; }
.ds-nav__caret { font-size: 9px; opacity: .6; }

.ds-nav__phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 13px;
  color: var(--ds-ink-2);
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.ds-nav__phone:hover { color: var(--ds-cyan); }
/* Fix 3: CTA is now the dominant action — slightly larger, taller letterspacing, stronger shadow */
.ds-nav__cta {
  height: 46px;
  padding: 0 26px;
  border-radius: 999px;
  background: var(--ds-cyan);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  box-shadow: 0 8px 22px -8px rgba(0, 184, 240, .65);
  transition: background .2s, transform .2s, box-shadow .2s;
  white-space: nowrap;
}
.ds-nav__cta:hover { background: var(--ds-cyan-deep); color: #fff; transform: translateY(-1px); box-shadow: var(--ds-shadow-cta-hover); }
.ds-nav__right { display: flex; align-items: center; gap: 22px; }

.ds-mega {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  background: #fff;
  border-top: 1px solid var(--ds-line);
  border-bottom: 1px solid var(--ds-line);
  box-shadow: 0 24px 48px -16px rgba(10, 18, 31, .14);
  display: none;
}
.ds-mega.is-open { display: block; }
.ds-mega__grid {
  max-width: 1080px;
  margin: 0 auto;
  padding: 28px 32px 32px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}
.ds-mega__grid--with-feature { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1.1fr); gap: 24px; }

.ds-mega__col { min-width: 0; }
.ds-mega__col-h {
  font-size: 11px;
  font-weight: 800;
  color: var(--ds-cyan);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ds-line);
  white-space: nowrap;
}
.ds-mega__col ul { display: flex; flex-direction: column; gap: 11px; }
.ds-mega__col a { color: var(--ds-ink); font-size: 14px; font-weight: 600; line-height: 1.35; display: block; word-wrap: break-word; }
.ds-mega__col a:hover { color: var(--ds-cyan); }

.ds-mega__feature {
  background: linear-gradient(160deg, var(--ds-ink) 0%, var(--ds-ink-deep, #0a121f) 100%);
  color: #fff;
  padding: 26px 24px;
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
.ds-mega__feature .ds-mega__col-h { color: var(--ds-cyan); border-bottom: 0; padding-bottom: 0; margin-bottom: 16px; }
.ds-mega__feature ul { gap: 12px; }
/* Fix 5: feature links are the prominent action — bolder, with hover slide */
.ds-mega__feature a {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color .15s ease, transform .15s ease;
}
.ds-mega__feature a:hover { color: var(--ds-cyan); transform: translateX(3px); }

/* "NEW" badge for promoted mega-menu items (e.g. Reconciliation Shield™). */
.ds-mega__badge {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--ds-cyan);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  vertical-align: 1px;
  line-height: 1.3;
}
.ds-mega__feature .ds-mega__badge { background: var(--ds-cyan); color: var(--ds-ink); }

/* Fix 6: hamburger gets stronger weight + active state, plus tap target meets 48px */
.ds-nav__hamburger {
  display: none;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  border: 1px solid var(--ds-line);
  background: #fff;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--ds-ink);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.ds-nav__hamburger svg { stroke-width: 2; }
.ds-nav__hamburger:hover,
.ds-nav__hamburger[aria-expanded="true"] {
  background: var(--ds-ink);
  border-color: var(--ds-ink);
  color: #fff;
}

/* ============================================================
   FOOTER
   ============================================================ */
.ds-footer {
  padding: 48px 60px 28px;
  background: var(--ds-ink-deep);
  color: rgba(255, 255, 255, .78);
  position: relative;
  overflow: hidden;
}
.ds-footer::after {
  content: "";
  position: absolute;
  right: -80px;
  top: 50%;
  transform: translateY(-50%);
  width: 360px;
  height: 480px;
  background: url('../images/ico-delancey.svg') no-repeat center / contain;
  opacity: 0.04;
  filter: brightness(0) invert(1);
  pointer-events: none;
  z-index: 0;
}
.ds-footer__inner { max-width: 1280px; margin: 0 auto; position: relative; z-index: 1; }
/* Fix 7: rebalance footer grid — narrower brand col gives nav columns wider links */
.ds-footer__cols {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 36px;
  margin-bottom: 32px;
}
.ds-footer__col h4 {
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  margin-bottom: 14px;
}
.ds-footer__col ul { display: flex; flex-direction: column; gap: 7px; }
.ds-footer__col a {
  color: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  transition: color .15s ease, transform .15s ease;
}
.ds-footer__col a:hover { color: var(--ds-cyan); transform: translateX(2px); }
.ds-footer__brand p {
  font-size: 14px;
  line-height: 1.55;
  margin-top: 14px;
  font-weight: 500;
  opacity: .8;
  max-width: 340px;
}
.ds-footer__cs-label {
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  margin: 18px 0 4px;
}
.ds-footer__phone {
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  display: block;
  margin-bottom: 2px;
}
.ds-footer__email { font-size: 14px; color: var(--ds-cyan); }
.ds-footer__address {
  font-style: normal;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255,255,255,0.78);
  margin: 14px 0 4px;
}
.ds-footer__hours {
  font-size: 12px;
  color: rgba(255,255,255,0.62);
  margin-top: 4px;
  letter-spacing: 0.04em;
}
.ds-footer__social { display: flex; gap: 10px; margin-top: 16px; }
.ds-footer__social a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .1);
  display: grid;
  place-items: center;
  color: #fff;
  transition: background .2s, color .2s, transform .2s, border-color .2s;
}
.ds-footer__social a:hover { background: var(--ds-cyan); color: #fff; border-color: var(--ds-cyan); transform: translateY(-2px); }
.ds-footer__legal {
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: 12px;
  line-height: 1.55;
  opacity: .65;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
  max-width: 1100px;
}
.ds-footer__legal strong { color: rgba(255, 255, 255, .85); font-weight: 700; }
.ds-footer__bottom {
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 12px;
  opacity: .6;
  font-weight: 500;
}
.ds-footer__bottom a { color: inherit; }

/* ============================================================
   HERO V1
   ============================================================ */
.ds-hero {
  padding: 56px 60px 72px;
  background: #fff;
  position: relative;
  overflow: hidden;
}
.ds-hero__grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1440px;
  margin: 0 auto;
}
.ds-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-radius: 999px;
  background: var(--ds-paper-2);
  margin-bottom: 28px;
}
.ds-hero__pill-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, .15);
}
.ds-hero__pill-text {
  font-size: 11px;
  font-weight: 800;
  color: var(--ds-ink);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.ds-hero__h1 {
  font-size: clamp(64px, 7.4vw, 104px);
  line-height: .9;
  letter-spacing: -0.035em;
  font-weight: 900;
  text-transform: uppercase;
  text-wrap: balance;
  color: var(--ds-ink);
}
.ds-hero__h1 span { display: block; }
.ds-hero__h1 .ds-emph { color: var(--ds-cyan); }
.ds-hero__sub {
  font-size: 19px;
  line-height: 1.55;
  color: var(--ds-ink-3);
  max-width: 520px;
  margin: 36px 0;
  font-weight: 500;
}
.ds-hero__sub strong { color: var(--ds-ink); }
.ds-hero__trust { margin-top: 48px; }

/* Calculator card */
.ds-calc {
  background: #fff;
  border-radius: 24px;
  box-shadow: var(--ds-shadow-card-pop);
  border: 1px solid var(--ds-line);
  position: relative;
  overflow: hidden;
}
.ds-calc__head {
  padding: 18px 28px;
  border-bottom: 1px solid var(--ds-line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--ds-paper);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ds-ink);
}
.ds-calc__head-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--ds-cyan);
  box-shadow: 0 0 0 4px rgba(0, 184, 240, .18);
}
.ds-calc__body { padding: 32px 32px 28px; }
.ds-calc__h3 {
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--ds-ink);
  line-height: 1.15;
  margin-bottom: 6px;
}
.ds-calc__sub { font-size: 13px; color: var(--ds-muted); font-weight: 500; margin-bottom: 24px; }
.ds-calc__readout { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; }
.ds-calc__readout .num {
  font-size: 56px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: var(--ds-ink);
  letter-spacing: -0.035em;
  line-height: 1;
}
.ds-calc__readout .unit {
  font-size: 13px;
  font-weight: 700;
  color: var(--ds-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-left: 6px;
}
.ds-calc__slider { width: 100%; accent-color: var(--ds-cyan); height: 6px; margin-bottom: 8px; }
.ds-calc__scale { display: flex; justify-content: space-between; font-size: 10px; color: var(--ds-muted); margin-bottom: 18px; font-weight: 700; letter-spacing: 0.08em; }
.ds-calc__chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.ds-calc__chip {
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  border: 1.5px solid var(--ds-line);
  background: #fff;
  color: var(--ds-ink);
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.ds-calc__chip.is-active { border-color: var(--ds-cyan); background: var(--ds-cyan); color: #fff; }
.ds-calc__result {
  padding: 24px 26px 22px;
  background: var(--ds-ink);
  border-radius: 16px;
  position: relative;
  overflow: hidden;
  color: #fff;
}
.ds-calc__result-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 800;
  color: var(--ds-cyan);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  margin-bottom: 14px;
}
.ds-calc__result-label::before { content: ""; width: 18px; height: 1.5px; background: var(--ds-cyan); }
.ds-calc__result-grid { display: grid; grid-template-columns: auto 1fr; gap: 4px 18px; align-items: baseline; }
.ds-calc__result-h {
  font-size: 11px;
  font-weight: 800;
  color: rgba(255, 255, 255, .55);
  text-transform: uppercase;
  letter-spacing: 0.14em;
}
.ds-calc__result-num {
  font-size: 34px;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.ds-calc__result-num--cyan { color: var(--ds-cyan); }
.ds-calc__result-rule { height: 1px; background: rgba(255, 255, 255, .12); margin: 18px 0 14px; }
.ds-calc__result-foot {
  display: flex; justify-content: space-between;
  font-size: 12px; font-weight: 600;
  color: rgba(255, 255, 255, .7);
  font-variant-numeric: tabular-nums;
}
.ds-calc__cta {
  margin-top: 18px;
  width: 100%;
  height: 54px;
  border-radius: 999px;
  background: var(--ds-cyan);
  color: #fff;
  border: 0;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  box-shadow: var(--ds-shadow-cta);
}
.ds-calc__cta:hover { background: var(--ds-cyan-deep); }
.ds-calc__foot-note { text-align: center; margin-top: 12px; font-size: 11px; color: var(--ds-muted); font-weight: 600; }

.ds-trust { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.ds-trust__count-label { font-size: 10px; font-weight: 800; color: var(--ds-muted); letter-spacing: 0.18em; text-transform: uppercase; }
.ds-trust__count-num { font-size: 14px; font-weight: 800; color: var(--ds-ink); letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }
.ds-trust__divider { width: 1px; height: 36px; background: var(--ds-line); }
.ds-trust img { height: 46px; width: auto; object-fit: contain; flex-shrink: 0; }
.ds-trust img.is-tall { height: 48px; }
.ds-trust img.is-short { height: 44px; }

/* Calculator head — split layout (mirrors HeroV1 JSX) */
.ds-calc__head-left { display: flex; align-items: center; gap: 10px; }
.ds-calc__head-right {
  font-size: 11px;
  font-weight: 800;
  color: var(--ds-muted);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Faint d-mark watermark inside the dark result panel (mirrors DMark size=160 @ opacity .07) */
.ds-calc__result-watermark {
  position: absolute;
  right: -40px;
  top: -40px;
  width: 160px;
  height: 160px;
  opacity: .07;
  filter: brightness(0) saturate(100%) invert(60%) sepia(82%) saturate(2410%) hue-rotate(168deg) brightness(101%) contrast(101%);
  pointer-events: none;
}
.ds-calc__result > *:not(.ds-calc__result-watermark) { position: relative; }

/* ============================================================
   $100M BANNER
   ============================================================ */
.ds-banner-100m {
  padding: 72px 60px;
  color: #fff;
  text-align: center;
  position: relative;
  background-color: var(--ds-cyan);
  background-size: cover;
  background-position: center;
}
.ds-banner-100m h2 {
  font-size: 46px;
  font-weight: 900;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
  position: relative;
}
.ds-banner-100m h2 .ds-underline {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 3px;
  color: #fff;
}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.ds-testimonials .ds-testimonials__split {
  max-width: 1280px;
  margin: 0 auto 24px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 32px;
  align-items: center;
}
.ds-testimonials__split > .rule { height: 1px; background: var(--ds-line); }
.ds-testimonials__awards {
  max-width: 1100px;
  margin: 24px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 36px;
  flex-wrap: wrap;
}
.ds-stars { display: inline-flex; gap: 4px; color: var(--ds-gold); }
.ds-testimonials__rating {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 18px 28px;
  border-left: 1px solid var(--ds-line);
  border-right: 1px solid var(--ds-line);
}
.ds-testimonials__rating .label-big { font-size: 14px; font-weight: 800; color: var(--ds-ink); }
.ds-testimonials__rating .label-sm { font-size: 11px; font-weight: 700; color: var(--ds-muted); letter-spacing: 0.14em; text-transform: uppercase; }
.ds-testimonials__count .num {
  font-size: 32px;
  font-weight: 900;
  color: var(--ds-cyan);
  letter-spacing: -0.03em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.ds-testimonials__count .lab {
  font-size: 11px; font-weight: 700; color: var(--ds-muted);
  letter-spacing: 0.14em; text-transform: uppercase;
}
.ds-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1280px;
  margin: 64px auto 0;
}
.ds-testimonial-card {
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid var(--ds-line);
  background: #fff;
  display: flex;
  flex-direction: column;
}
.ds-testimonial-card__photo {
  height: 280px;
  position: relative;
  overflow: hidden;
  background: #fff;
}
.ds-testimonial-card__photo img.bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.ds-testimonial-card__photo img.fg {
  position: absolute; bottom: 0; left: 50%;
  transform: translateX(-50%);
  height: 100%; width: auto; max-width: none;
}
.ds-testimonial-card__body {
  padding: 28px 26px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.ds-testimonial-card__quote {
  font-size: 14.5px; line-height: 1.6;
  color: var(--ds-ink-2);
  font-weight: 500; flex: 1;
  margin-top: 14px;
}
.ds-testimonial-card__author {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--ds-line);
}
.ds-testimonial-card__name { font-size: 16px; font-weight: 800; color: var(--ds-ink); text-transform: uppercase; }
.ds-testimonial-card__role { font-size: 13px; color: var(--ds-muted); margin-top: 2px; }
.ds-testimonial-card__meta { font-size: 11.5px; color: var(--ds-muted); margin-top: 4px; letter-spacing: 0.02em; }
.ds-testimonial-card__meta time { font-style: italic; }

/* ============================================================
   TRACK RECORD
   ============================================================ */
.ds-track {
  padding: 120px 60px 96px;
  background: var(--ds-paper);
}
.ds-track__stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--ds-line);
  border-bottom: 1px solid var(--ds-line);
  margin-bottom: 72px;
}
.ds-track__stat {
  padding: 40px 28px;
  text-align: center;
  border-right: 1px solid var(--ds-line);
}
.ds-track__stat:last-child { border-right: 0; }
.ds-track__stat .num {
  font-size: clamp(40px, 6vw, 88px);
  font-weight: 900;
  color: var(--ds-cyan);
  letter-spacing: -0.04em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  word-break: keep-all;
}
@media (max-width: 800px) {
  .ds-track__stat { padding: 28px 16px; }
  .ds-track__stat .num { font-size: clamp(32px, 9vw, 48px); }
  .ds-track__stat .l1 { font-size: 11px; letter-spacing: 0.12em; }
  .ds-track__stat .l2 { font-size: 10px; letter-spacing: 0.10em; }
}
.ds-track__stat .l1 { font-size: 13px; font-weight: 800; color: var(--ds-ink); letter-spacing: 0.16em; text-transform: uppercase; margin-top: 14px; }
.ds-track__stat .l2 { font-size: 12px; font-weight: 700; color: var(--ds-muted); letter-spacing: 0.14em; text-transform: uppercase; margin-top: 4px; }
/* Note: the OUTER grid is `.ds-track__copy-grid` — defined in sections-home.css.
 * `.ds-track__copy` is the inner copy column; it must remain a normal block
 * flow. An earlier `.ds-track__copy { display: grid; grid-template-columns: 1fr 1.4fr }`
 * rule here wrongly turned the paragraphs into grid columns with 64px gaps. */
.ds-track__copy p { font-size: 17px; line-height: 1.65; color: var(--ds-ink-3); margin-bottom: 18px; font-weight: 500; }
.ds-track__copy p.lede { font-size: 18px; line-height: 1.55; color: var(--ds-ink); font-weight: 700; }

/* ============================================================
   INDUSTRIES
   ============================================================ */
.ds-industries { padding: 120px 60px; background: #fff; }
.ds-industries__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  max-width: 1280px;
  margin: 56px auto 0;
}
.ds-industry-tile {
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 4/5;
  display: block;
}
.ds-industry-tile img { width: 100%; height: 100%; object-fit: cover; }
.ds-industry-tile__label {
  position: absolute;
  inset: auto 0 0 0;
  padding: 18px 20px 16px;
  background: linear-gradient(0deg, rgba(15,26,45,.85), rgba(15,26,45,0));
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.ds-how {
  padding: 120px 60px;
  background: var(--ds-paper);
  position: relative;
  overflow: hidden;
}
.ds-how__inner { max-width: 1320px; margin: 0 auto; position: relative; }
.ds-how__head {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 64px;
  align-items: end;
  margin-bottom: 64px;
}
.ds-how__title {
  font-size: 64px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: var(--ds-ink);
}
.ds-how__sub {
  font-size: 18px;
  line-height: 1.55;
  color: var(--ds-ink-3);
  margin-top: 24px;
  font-weight: 500;
  max-width: 620px;
}
.ds-how__sub strong { color: var(--ds-ink); }
.ds-how__steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.ds-how__step {
  background: #fff;
  border-radius: 18px;
  padding: 28px 26px;
  border: 1px solid var(--ds-line);
}
.ds-how__step .n {
  font-size: 11px;
  font-weight: 800;
  color: var(--ds-cyan);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.ds-how__step h3 {
  font-size: 22px;
  font-weight: 800;
  color: var(--ds-ink);
  margin-top: 12px;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  line-height: 1.15;
}
.ds-how__step p {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ds-ink-3);
  margin-top: 12px;
  font-weight: 500;
}

/* ============================================================
   DELANCEY DIFFERENCE
   ============================================================ */
.ds-difference { padding: 120px 60px; background: #fff; }
.ds-difference__grid {
  max-width: 1280px;
  margin: 56px auto 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.ds-pillar {
  padding: 32px 26px;
  background: var(--ds-paper);
  border-radius: var(--ds-radius-card);
  border: 1px solid var(--ds-line);
}
.ds-pillar__icon {
  width: 56px; height: 56px;
  border-radius: 14px;
  background: var(--ds-cyan);
  color: #fff;
  display: grid; place-items: center;
}
.ds-pillar h3 {
  font-size: 18px;
  font-weight: 900;
  color: var(--ds-ink);
  margin-top: 22px;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  line-height: 1.2;
}
.ds-pillar p { font-size: 14.5px; line-height: 1.55; color: var(--ds-ink-3); margin-top: 12px; font-weight: 500; }

/* ============================================================
   TEAM STRIP
   ============================================================ */
.ds-team { padding: 120px 60px; background: var(--ds-paper); }
.ds-team__grid {
  max-width: 1280px;
  margin: 56px auto 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
.ds-team-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid var(--ds-line);
  overflow: hidden;
  text-align: center;
  display: block;
}
.ds-team-card img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.ds-team-card__body { padding: 18px 14px 22px; }
.ds-team-card__name { font-size: 15px; font-weight: 800; color: var(--ds-ink); letter-spacing: -0.01em; }
.ds-team-card__role { font-size: 12px; color: var(--ds-muted); margin-top: 6px; line-height: 1.4; }

/* ============================================================
   COMPARISON
   ============================================================ */
.ds-compare { padding: 120px 60px; background: #fff; }
.ds-compare__table {
  max-width: 1100px;
  margin: 56px auto 0;
  border-radius: var(--ds-radius-card);
  border: 1px solid var(--ds-line);
  overflow: hidden;
  background: #fff;
}
.ds-compare__row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  border-bottom: 1px solid var(--ds-line);
}
.ds-compare__row:last-child { border-bottom: 0; }
.ds-compare__row > div {
  padding: var(--ds-vs-cell-pad-y) var(--ds-vs-cell-pad-x);
  font-size: var(--ds-vs-row-fs);
  font-weight: var(--ds-vs-row-fw);
  color: var(--ds-ink-2);
}
.ds-compare__row.is-head > div {
  background: var(--ds-vs-head-bg);
  color: var(--ds-vs-head-fg);
  text-transform: uppercase;
  font-size: var(--ds-vs-head-fs);
  letter-spacing: var(--ds-vs-head-tracking);
  font-weight: var(--ds-vs-head-fw);
}
.ds-compare__row:nth-child(even):not(.is-head) > div { background: var(--ds-vs-zebra); }
.ds-compare__row .col-ds { background: var(--ds-vs-col-ds-bg); font-weight: 700; }
.ds-compare__row:nth-child(even):not(.is-head) .col-ds { background: var(--ds-vs-col-ds-zebra); }
.ds-compare__row.is-head .col-ds { background: var(--ds-cyan); color: var(--ds-ink); }
.ds-compare__check {
  display: inline-grid; place-items: center;
  width: var(--ds-vs-check-size); height: var(--ds-vs-check-size);
  border-radius: 50%;
  background: var(--ds-vs-check-bg); color: var(--ds-vs-check-fg);
  font-weight: 800; font-size: 12px;
}
.ds-compare__x {
  display: inline-grid; place-items: center;
  width: var(--ds-vs-check-size); height: var(--ds-vs-check-size);
  border-radius: 50%;
  background: var(--ds-vs-x-bg); color: var(--ds-vs-x-fg);
  font-weight: 800; font-size: 12px;
}

/* ============================================================
   GET FREE OF DEBT FORM
   ============================================================ */
.ds-form-section {
  padding: 120px 60px;
  background: var(--ds-ink);
  color: #fff;
}
.ds-form-section__grid {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.ds-form-section h2 { color: #fff; }
.ds-form-section .ds-section-sub { color: rgba(255,255,255,.78); }
.ds-form {
  color: var(--ds-ink);
  font-family: var(--ds-font);
}
.ds-form--grid { display: flex; flex-direction: column; gap: 14px; }
.ds-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.ds-form__field { display: flex; flex-direction: column; }
.ds-form__field--full { grid-column: 1 / -1; }
.ds-form label {
  font-size: 11px;
  font-weight: 800;
  color: var(--ds-ink-2);
  letter-spacing: 0.10em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 6px;
}
.ds-form input[type="text"],
.ds-form input[type="email"],
.ds-form input[type="tel"],
.ds-form input[type="number"],
.ds-form input[type="url"],
.ds-form select,
.ds-form textarea {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1.5px solid var(--ds-line);
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  background: #fff;
  color: var(--ds-ink);
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
}
.ds-form textarea {
  height: auto;
  min-height: 96px;
  padding: 12px 14px;
  line-height: 1.5;
  resize: vertical;
}
.ds-form input::placeholder,
.ds-form textarea::placeholder { color: var(--ds-muted); font-weight: 500; }
.ds-form select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ds-ink-2) 50%),
    linear-gradient(135deg, var(--ds-ink-2) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.ds-form input:focus,
.ds-form select:focus,
.ds-form textarea:focus {
  outline: none;
  border-color: var(--ds-cyan);
  box-shadow: 0 0 0 3px rgba(0,184,240,.18);
}
.ds-form__pill-row {
  display: grid;
  gap: 8px;
}
.ds-form__pill-row--4 { grid-template-columns: repeat(4, 1fr); }
.ds-form__pill-row--3 { grid-template-columns: repeat(3, 1fr); }
.ds-form__pill {
  height: 48px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1.5px solid var(--ds-line);
  background: #fff;
  color: var(--ds-ink);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s ease;
  text-align: center;
}
.ds-form__pill:hover { border-color: var(--ds-cyan); }
.ds-form__pill.is-active {
  border-color: var(--ds-cyan);
  background: var(--ds-cyan);
  color: #fff;
  box-shadow: 0 6px 18px -8px rgba(0,184,240,.6);
}
.ds-form__submit {
  margin-top: 10px;
  width: 100%;
  height: 58px;
  border-radius: 999px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-shadow: var(--ds-shadow-cta-hover);
}
.ds-form__consent-note {
  font-size: 11px;
  line-height: 1.55;
  color: var(--ds-muted);
  margin: 14px auto 0;
  text-align: center;
  font-weight: 500;
  max-width: 70ch;
}
@media (max-width: 600px) {
  .ds-form__row { grid-template-columns: 1fr; }
  .ds-form__pill-row--4 { grid-template-columns: repeat(2, 1fr); }
  .ds-form__pill-row--3 { grid-template-columns: 1fr; }
}

/* ============================================================
   PRESS STRIP
   ============================================================ */
.ds-press {
  padding: 96px 60px;
  background: #fff;
  border-top: 1px solid var(--ds-line);
  border-bottom: 1px solid var(--ds-line);
}
.ds-press__row {
  max-width: 1280px;
  margin: 32px auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 56px;
  flex-wrap: wrap;
}
.ds-press__row img {
  height: 36px;
  width: auto;
  object-fit: contain;
  flex-shrink: 0;
  filter: grayscale(1);
  opacity: .7;
  transition: opacity .2s ease, filter .2s ease;
}
.ds-press__row img:hover,
.ds-press__row a:hover img,
.ds-press__row a:focus-visible img { filter: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .ds-press__row img { transition: none; }
}

/* ============================================================
   BLOG GRID
   ============================================================ */
.ds-blog-grid { padding: 120px 60px; background: #fff; }
.ds-blog-grid__cards {
  max-width: 1280px;
  margin: 56px auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.ds-blog-card {
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--ds-line);
  background: #fff;
  display: flex;
  flex-direction: column;
}
.ds-blog-card__cover {
  aspect-ratio: 16/10;
  background: var(--ds-paper);
  display: grid;
  place-items: center;
  padding: 32px;
}
.ds-blog-card__cover.tone-ink { background: var(--ds-ink); color: #fff; }
.ds-blog-card__cover.tone-cyan { background: var(--ds-cyan); color: var(--ds-ink); }
.ds-blog-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ds-blog-card__cover h3 {
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  line-height: 1.15;
  text-align: center;
}
.ds-blog-card__body { padding: 20px 22px 24px; }
.ds-blog-card__meta { font-size: 11px; font-weight: 700; color: var(--ds-muted); letter-spacing: 0.12em; text-transform: uppercase; }
.ds-blog-card__title { font-size: 18px; font-weight: 800; color: var(--ds-ink); margin-top: 8px; line-height: 1.3; letter-spacing: -0.01em; }
.ds-blog-card__desc { font-size: 14px; color: var(--ds-ink-3); margin-top: 10px; line-height: 1.55; font-weight: 500; }

/* ============================================================
   CTA BAND
   ============================================================ */
.ds-cta-band {
  padding: 56px 60px;
  background: var(--ds-cyan);
  color: var(--ds-ink);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.ds-cta-band > * { position: relative; z-index: 1; }
.ds-cta-band--ink { background: var(--ds-ink); color: #fff; }
.ds-cta-band h2 { font-size: 36px; font-weight: 900; letter-spacing: -0.02em; text-transform: uppercase; margin-bottom: 18px; }
.ds-cta-band::after {
  content: "";
  position: absolute;
  right: -40px;
  top: 50%;
  transform: translateY(-50%);
  width: 240px;
  height: 320px;
  background: url('../images/ico-delancey.svg') no-repeat center / contain;
  opacity: 0.06;
  filter: brightness(0) invert(1);
  pointer-events: none;
  z-index: 0;
}

/* ============================================================
   GENERIC PAGE / CPT INNER LAYOUT
   ============================================================ */
.ds-inner-hero {
  padding: 80px 60px 56px;
  background: #fff;
  border-bottom: 1px solid var(--ds-line);
  position: relative;
  overflow: hidden;
}
.ds-inner-hero::after {
  content: "";
  position: absolute;
  right: -40px;
  top: 50%;
  transform: translateY(-50%);
  width: 280px;
  height: 380px;
  background: url('../images/ico-delancey.svg') no-repeat center / contain;
  opacity: 0.07;
  pointer-events: none;
  z-index: 0;
}
.ds-inner-hero__inner { max-width: 1100px; margin: 0 auto; position: relative; z-index: 1; }
.ds-inner-hero h1 {
  font-family: var(--ds-font, 'Montserrat', sans-serif);
  font-size: 84px;
  line-height: 82px;
  text-wrap: balance;
  overflow-wrap: anywhere;
  hyphens: auto;
  font-weight: 900;
  font-style: normal;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: rgb(15, 26, 45);
  margin-top: 18px;
}
@media (max-width: 900px) {
  .ds-inner-hero h1 { font-size: 52px; line-height: 54px; }
}
@media (max-width: 560px) {
  .ds-inner-hero h1 { font-size: 36px; line-height: 38px; }
}
@media (max-width: 414px) {
  .ds-inner-hero h1 { font-size: 30px; line-height: 32px; }
}
.ds-inner-hero__sub { font-size: 18px; line-height: 1.55; color: var(--ds-ink-3); margin-top: 18px; max-width: 720px; font-weight: 500; }
.ds-inner-hero__cta { margin-top: 28px; }
.ds-inner-hero__cta .ds-cta { display: inline-flex; }
.ds-breadcrumbs { font-size: 12px; color: var(--ds-muted); letter-spacing: 0.06em; }
/* WCAG AA: 12px cyan on white needs ≥4.5:1 — use deeper cyan token */
.ds-breadcrumbs a { color: var(--ds-cyan); text-decoration: underline; }
.ds-breadcrumbs a:hover { color: var(--ds-cyan-deep); }

.ds-page-body { padding: 72px 60px; background: #fff; }
.ds-page-body__inner { max-width: 880px; margin: 0 auto; }
.ds-page-body__inner p { font-size: 17px; line-height: 1.7; color: var(--ds-ink-2); margin-bottom: 18px; }
.ds-page-body__inner h2 { font-size: 32px; font-weight: 800; letter-spacing: -0.015em; text-transform: uppercase; color: var(--ds-ink); margin: 36px 0 16px; }
.ds-page-body__inner h3 { font-size: 22px; font-weight: 800; color: var(--ds-ink); margin: 24px 0 12px; }
.ds-page-body__inner ul { list-style: disc; padding-left: 22px; margin-bottom: 18px; }
.ds-page-body__inner ul li { font-size: 16px; line-height: 1.7; color: var(--ds-ink-2); margin-bottom: 6px; list-style: disc; }
.ds-page-body__inner ul li::marker { color: var(--ds-cyan); }
.ds-page-body__inner ol { list-style: decimal-leading-zero; padding-left: 34px; margin-bottom: 18px; }
.ds-page-body__inner ol li { font-size: 16px; line-height: 1.7; color: var(--ds-ink-2); margin-bottom: 6px; list-style: decimal-leading-zero; padding-left: 6px; }
.ds-page-body__inner ol li::marker { color: var(--ds-cyan); font-weight: 800; }

/* State guide cities + courts */
.ds-courts-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 18px; }
.ds-courts-grid > div { padding: 22px 24px; background: var(--ds-paper); border-radius: 14px; border: 1px solid var(--ds-line); }
.ds-courts-grid h4 { font-size: 16px; font-weight: 800; color: var(--ds-ink); margin-bottom: 6px; }
.ds-courts-grid p { font-size: 14.5px; color: var(--ds-ink-3); line-height: 1.55; }

.ds-cities-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.ds-cities-list span {
  padding: 8px 14px;
  background: var(--ds-cyan-soft);
  color: var(--ds-cyan-deep);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}

/* Service quick facts */
.ds-quick-facts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 32px 0;
}
.ds-quick-facts > div {
  padding: 22px 20px;
  background: var(--ds-paper);
  border-radius: 14px;
  border: 1px solid var(--ds-line);
}
.ds-quick-facts .lab { font-size: 22px; font-weight: 900; color: var(--ds-cyan); letter-spacing: -0.02em; }
.ds-quick-facts .cap { font-size: 13px; color: var(--ds-ink-3); margin-top: 6px; line-height: 1.45; }

/* FAQ accordion */
.ds-faqs { margin-top: 28px; }
.ds-faq {
  border-bottom: 1px solid var(--ds-line);
}
.ds-faq summary {
  font-size: 18px;
  font-weight: 700;
  color: var(--ds-ink);
  padding: 22px 0;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ds-faq summary::-webkit-details-marker { display: none; }
.ds-faq summary span {
  transition: transform 0.2s;
  display: inline-block;
  font-size: 24px;
  font-weight: 400;
  color: var(--ds-cyan);
}
/* WCAG AA: cyan on white = 2.2:1 — use deeper cyan for bold heading text */
.ds-faq[open] summary { color: var(--ds-cyan-deep); }
.ds-faq[open] summary span { transform: rotate(45deg); }
.ds-faq__a { padding-bottom: 22px; font-size: 15.5px; line-height: 1.7; color: var(--ds-ink-2); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .ds-hero__grid { grid-template-columns: 1fr; gap: 48px; }
  .ds-track__copy-grid { grid-template-columns: 1fr; gap: 32px; }
  .ds-track__stats { grid-template-columns: repeat(2, 1fr); }
  .ds-track__stat { border-bottom: 1px solid var(--ds-line); }
  .ds-track__stat:nth-child(2) { border-right: 0; }
  .ds-how__head { grid-template-columns: 1fr; gap: 24px; }
  .ds-how__steps { grid-template-columns: repeat(2, 1fr); }
  .ds-difference__grid { grid-template-columns: repeat(2, 1fr); }
  .ds-team__grid { grid-template-columns: repeat(3, 1fr); }
  .ds-blog-grid__cards { grid-template-columns: 1fr; }
  .ds-testimonials__grid { grid-template-columns: 1fr; }
  .ds-form-section__grid { grid-template-columns: 1fr; gap: 32px; }
  .ds-footer__cols { grid-template-columns: 1fr 1fr; }
  .ds-industries__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 800px) {
  :root {
    --ds-page-pad-x: 20px;
    --ds-section-y: 72px;
  }
  .ds-section, .ds-track, .ds-how, .ds-difference, .ds-team,
  .ds-compare, .ds-form-section, .ds-press, .ds-blog-grid, .ds-industries,
  .ds-hero, .ds-banner-100m, .ds-cta-band, .ds-inner-hero, .ds-page-body, .ds-footer {
    padding-left: var(--ds-page-pad-x);
    padding-right: var(--ds-page-pad-x);
  }
  .ds-track, .ds-how, .ds-difference, .ds-team, .ds-compare,
  .ds-form-section, .ds-blog-grid, .ds-industries {
    padding-top: var(--ds-section-y);
    padding-bottom: var(--ds-section-y);
  }
  .ds-nav__inner { padding: 14px 20px; }
  .ds-nav__list, .ds-nav__phone, .ds-nav__cta { display: none; }
  .ds-nav__hamburger { display: flex; }

  .ds-section-title { font-size: 36px; }
  .ds-section-title--lg { font-size: 36px; }
  .ds-section-title--md { font-size: 32px; }
  .ds-hero__h1 { font-size: clamp(48px, 11vw, 72px); }
  .ds-banner-100m h2 { font-size: 28px; }
  .ds-how__title { font-size: 40px; }
  .ds-how__steps { grid-template-columns: 1fr; }
  .ds-difference__grid { grid-template-columns: 1fr; }
  .ds-team__grid { grid-template-columns: repeat(2, 1fr); }
  .ds-industries__grid { grid-template-columns: repeat(2, 1fr); }
  .ds-footer__cols { grid-template-columns: 1fr; gap: 32px; margin-bottom: 32px; }
  .ds-quick-facts { grid-template-columns: repeat(2, 1fr); }
  .ds-courts-grid { grid-template-columns: 1fr; }
  .ds-track__stats { grid-template-columns: 1fr 1fr; }
  .ds-compare__row { grid-template-columns: 1fr; }
  .ds-mega.is-open { display: none; }
  .ds-mega__grid--with-feature, .ds-mega__grid { grid-template-columns: 1fr; gap: 24px; padding: 24px 20px; }

  /* Mobile drawer — full-height overlay panel sliding in from right.
     Body-scroll lock, backdrop, in-drawer header w/ close button, and a
     pinned phone+Apply Now footer. */
  /* Backdrop only used during the slide-in animation; once the drawer
     is full-screen it covers everything anyway. Keep it for click-out
     intent on slow networks where the drawer transition stutters. */
  .ds-mobile-nav__backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    background: rgba(11, 18, 32, 0.55);
    z-index: 2147483600;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--ds-dur) var(--ds-ease);
  }
  .ds-mobile-nav__backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
  }
  /* Full-screen takeover (not a side panel). Slides in from the right
     and covers the whole viewport — standard mobile menu pattern. */
  .ds-mobile-nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    height: 100dvh;
    background: #fff;
    z-index: 2147483601;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    transform: translateX(100%);
    transition: transform var(--ds-dur-slow) var(--ds-ease);
  }
  /* Hide Smith.ai chat widget while the drawer is open — its z-index
     fights the drawer otherwise and it covers the close button + CTA.
     The widget is injected as #smithChatWidget (3rd-party). */
  body.ds-mobile-nav-open #smithChatWidget,
  body.ds-mobile-nav-open .smithai-frame,
  body.ds-mobile-nav-open #smithai-frame,
  body.ds-mobile-nav-open iframe[id*="smith"],
  body.ds-mobile-nav-open iframe[src*="smith.ai"],
  body.ds-mobile-nav-open [class*="SmithAI"],
  body.ds-mobile-nav-open [id*="smith-ai"] { display: none !important; visibility: hidden !important; }
  /* Also lift our own sticky bottom CTA out of the way. */
  body.ds-mobile-nav-open .ds-mobile-cta { display: none !important; }
  /* Header pinned at top of scrolling drawer. */
  .ds-mobile-nav__head { position: sticky; top: 0; background: #fff; z-index: 2; }
  .ds-mobile-nav.is-open { transform: translateX(0); }
  /* Drawer header (logo + close) */
  .ds-mobile-nav__head {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--ds-line);
  }
  .ds-mobile-nav__brand img { height: 56px; width: auto; display: block; }
  .ds-mobile-nav__close {
    width: 48px; height: 48px;
    border: 1px solid var(--ds-line);
    background: #fff;
    border-radius: 12px;
    color: var(--ds-ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
  }
  .ds-mobile-nav__close:hover {
    background: var(--ds-ink);
    border-color: var(--ds-ink);
    color: #fff;
  }

  /* Default link styling for top-level nav items in the full-screen
     takeover. Bigger type since we're using the whole viewport. We
     exclude .ds-mobile-nav__cta and .ds-mobile-nav__phone — those get
     full pill treatments below. */
  .ds-mobile-nav a:not(.ds-mobile-nav__cta):not(.ds-mobile-nav__phone):not(.ds-mobile-nav__brand) {
    display: block;
    padding: 18px 24px;
    border-bottom: 1px solid var(--ds-line);
    font-weight: 800;
    color: var(--ds-ink);
    font-size: 18px;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    height: auto;
    letter-spacing: 0;
    text-transform: none;
  }

  .ds-mobile-nav__group { border-bottom: 1px solid var(--ds-line); }
  .ds-mobile-nav__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-right: 8px;
  }
  .ds-mobile-nav__row .ds-mobile-nav__top { flex: 1; border-bottom: 0; padding: 18px 24px; font-size: 18px; }
  .ds-mobile-nav__toggle {
    width: 48px; height: 48px;
    border: 0; background: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ds-ink-2);
    flex: none;
  }
  .ds-mobile-nav__caret { display: inline-block; transition: transform .2s ease; font-size: 12px; }
  .ds-mobile-nav__toggle[aria-expanded="true"] .ds-mobile-nav__caret { transform: rotate(180deg); color: var(--ds-cyan); }
  .ds-mobile-nav__panel {
    padding: 4px 24px 18px;
    background: var(--ds-paper);
  }
  .ds-mobile-nav__panel[hidden] { display: none; }
  .ds-mobile-nav__col-h {
    font-size: 11px;
    font-weight: 800;
    color: var(--ds-cyan);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 12px 0 6px;
    border-bottom: 0 !important;
  }
  .ds-mobile-nav__sub {
    display: block;
    padding: 14px 0 14px 18px !important;
    border-bottom: 0 !important;
    font-weight: 600;
    font-size: 15px;
    color: var(--ds-ink-2);
    background: transparent !important;
  }
  .ds-mobile-nav__sub--feature { color: var(--ds-ink); font-weight: 700; }

  /* Footer: phone link + Apply Now CTA at the bottom of the full-screen
     menu. Uses safe-area inset on iOS so they don't sit under the home
     bar. Wider side margin since we have the whole viewport now. */
  .ds-mobile-nav__phone,
  .ds-mobile-nav__cta {
    flex: none;
    margin: 0 24px;
  }
  .ds-mobile-nav__phone {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 16px !important;
    margin-top: auto !important;
    margin-bottom: 12px;
    color: var(--ds-cyan) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em;
    border: 1.5px solid var(--ds-cyan) !important;
    border-radius: 999px !important;
    background: rgba(0, 184, 240, 0.06) !important;
    text-transform: none !important;
  }
  .ds-mobile-nav__phone::before {
    content: "";
    display: inline-block;
    width: 14px; height: 14px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M5 4h3l2 5-2 1a11 11 0 006 6l1-2 5 2v3a2 2 0 01-2 2A16 16 0 013 6a2 2 0 012-2z'/></svg>") center/contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M5 4h3l2 5-2 1a11 11 0 006 6l1-2 5 2v3a2 2 0 01-2 2A16 16 0 013 6a2 2 0 012-2z'/></svg>") center/contain no-repeat;
  }
  .ds-mobile-nav__cta {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 56px !important;
    padding: 0 24px !important;
    margin-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    background: var(--ds-cyan) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: 0 12px 28px -10px rgba(0, 184, 240, 0.65) !important;
    text-align: center;
  }
  .ds-mobile-nav__cta:hover {
    background: var(--ds-cyan-deep) !important;
    color: #fff !important;
    transform: translateY(-1px);
  }

  /* The middle (scrolling) area — everything between header and the
     phone+cta footer. Use a wrapper-less approach: target the
     accordion groups + simple top-level anchors directly. */
  .ds-mobile-nav__group,
  .ds-mobile-nav > a.ds-mobile-nav__top {
    flex: none;
  }

  /* When body has the drawer-open lock applied via JS, prevent scroll
     of the document underneath. */
  body.ds-mobile-nav-open { overflow: hidden; }
}

/* Tiny-phone overrides for the full-screen menu. */
@media (max-width: 380px) {
  .ds-mobile-nav__brand img { height: 44px; }
  .ds-mobile-nav a:not(.ds-mobile-nav__cta):not(.ds-mobile-nav__phone):not(.ds-mobile-nav__brand) { font-size: 17px; padding: 16px 20px; }
  .ds-mobile-nav__row .ds-mobile-nav__top { font-size: 17px; padding: 16px 20px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ============================================================
   AQC7 mobile fixes (additive — do not remove existing rules)
   ============================================================ */

/* Fix 6: ds-form__row collapse at 768px (was 600) so iPad portrait gets 1-col */
@media (max-width: 768px) {
  .ds-form__row { grid-template-columns: 1fr; }
  .ds-form__pill-row--4 { grid-template-columns: repeat(2, 1fr); }
}

/* MOBQC-C: pill rows at narrow phones — pills can squish too tight in 2-col
   when labels are wide ("$250K-$1M"). Drop --4 to 2-col cleanly with min-h. */
@media (max-width: 480px) {
  .ds-form__pill-row--4,
  .ds-form__pill-row--3 { grid-template-columns: repeat(2, 1fr); }
  .ds-form__pill { font-size: 12px; height: 44px; padding: 0 8px; }
  /* Required-asterisks should never wrap to a new line */
  .ds-form label > span[aria-hidden="true"] { white-space: nowrap; }
}

/* Mobile nav — shrink the logo so the hamburger button has room.
   Base rules at line 281-282 use `.ds-nav__logo img[src$=".svg"]` which
   has HIGHER specificity than `.ds-nav__logo img` alone — so we have to
   match the same selector here for the override to win. */
@media (max-width: 800px) {
  .ds-nav__logo img,
  .ds-nav__logo img[src$=".svg"] { height: 56px; max-height: 56px; }
  /* Defensive — make sure the hamburger button can never get squeezed
     out of layout by a wide logo or a long phone label. */
  .ds-nav__inner { gap: 12px; padding: 14px 16px; }
  .ds-nav__right { flex-shrink: 0; min-width: 48px; }
  .ds-nav__hamburger { flex-shrink: 0; display: flex !important; }
  .ds-nav__logo { min-width: 0; flex-shrink: 1; overflow: hidden; }
}
@media (max-width: 480px) {
  .ds-nav__logo img,
  .ds-nav__logo img[src$=".svg"] { height: 44px; max-height: 44px; }
  .ds-nav__inner { padding: 12px 14px; gap: 10px; }
}

/* Fix 1: Hero h1 minimums at <480px (iPhone SE / narrow phones) */
@media (max-width: 480px) {
  .ds-hero__h1 { font-size: clamp(32px, 9vw, 44px); }
  .ds-inner-hero h1 { font-size: clamp(28px, 8vw, 36px); }
  .ds-inner-hero { padding-top: 56px; padding-bottom: 40px; }
}

/* ============================================================
   Mobile QC overrides — May 2026
   Reported issues: testimonials head + awards strip cramming on
   ~390px screens, banner-100m heading clipping, hero sub overflow,
   savings row number overflow.
   ============================================================ */
@media (max-width: 800px) {
  /* Testimonials: stack the title bar + the awards strip vertically.
     Hide the decorative side-rules on mobile (they only make sense
     when the title sits between them). */
  .ds-testimonials .ds-testimonials__split {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 0;
    margin-bottom: 16px;
  }
  .ds-testimonials__split > .rule { display: none; }
  .ds-testimonials__awards {
    flex-direction: column;
    gap: 20px;
    align-items: center;
    margin-top: 16px;
  }
  .ds-testimonials__rating {
    border-left: 0;
    border-right: 0;
    border-top: 1px solid var(--ds-line);
    border-bottom: 1px solid var(--ds-line);
    padding: 18px 0;
    width: 100%;
    max-width: 320px;
  }
  .ds-testimonials__zogby { max-width: 220px; height: auto; }
  .ds-testimonials__count { display: flex; align-items: baseline; gap: 12px; }
  .ds-testimonials__count .num { font-size: 28px; }
  .ds-testimonials__count .lab br { display: none; }
}

@media (max-width: 480px) {
  .ds-testimonials .ds-section-title { font-size: 32px; line-height: 1.05; }
}

/* Banner 100M heading was clipping ("BUSINESS DEBT SETTL") because
   28px uppercase tracking ran longer than the available width with
   the 20px page-pad. Allow word-wrap at narrow widths. */
@media (max-width: 480px) {
  .ds-banner-100m { padding-top: 48px; padding-bottom: 48px; }
  .ds-banner-100m h2 { font-size: 22px; line-height: 1.15; word-break: break-word; }
}

/* Hero sub: at narrow phones the long sentence ("…$100M+ settled")
   was getting clipped at the right edge. Add a hard wrap fallback. */
@media (max-width: 480px) {
  .ds-hero__sub { font-size: 16px; line-height: 1.5; max-width: none; overflow-wrap: anywhere; }
}

/* MCA calculator "PER YEAR SAVED $1,875,000" was clipping at
   "$1,875,0" — the right column had no min-width and the savings
   row was overflowing. Constrain font + ensure wrap. */
@media (max-width: 480px) {
  .ds-mca-calc__savings-row { gap: 12px; }
  .ds-mca-calc__savings-num,
  .ds-mca-calc__savings-row .num { font-size: 22px; word-break: break-all; }
}

/* Fix 10: Page-padding cascade — extend the central <800 override list so
   sections that previously managed their own pad-x at varied breakpoints
   (sometimes never) honor the same token-driven --ds-page-pad-x var.
   This keeps existing per-section rules intact (additive) but guarantees
   a single 20px floor below 800. */
@media (max-width: 800px) {
  .ds-howit, .ds-difference-home, .ds-press-releases, .ds-blog-grid-home,
  .ds-trusted, .ds-real-people, .ds-industries-home, .ds-team-strip,
  .ds-shield, .ds-beat, .ds-getfree, .ds-form-section,
  .ds-editorial, .ds-shield-hero, .ds-facts-hero, .ds-infographic,
  .ds-settlement-spectrum, .ds-settlement-process, .ds-settlement-compare,
  .ds-settlement-bigstats, .ds-settlement-cta,
  .ds-blog-single__hero, .ds-blog-single__body-section, .ds-blog-single__related,
  .ds-case__hero, .ds-case__narrative, .ds-case__related,
  .ds-team-single__hero, .ds-team-single__body,
  .ds-service__hero, .ds-service__problem, .ds-service__scenarios,
  .ds-service__pullquote, .ds-service__process, .ds-service__testimonial,
  .ds-service__states, .ds-service__faqs, .ds-service__resources,
  .ds-service__contact, .ds-service__cta, .ds-service__quick-facts-section {
    padding-left: var(--ds-page-pad-x);
    padding-right: var(--ds-page-pad-x);
  }
}

/* ============================================================
   Hide hashtag/pill overlays on cyan portrait CTA banners
   (overlapped photos, looked bad — removed globally)
   ============================================================ */
/* Hide the homepage pill (was overlapping awkwardly behind the man); leave the cyan CTA pills visible per design */
.ds-beat__hashtag {
  display: none !important;
}

/* ============================================================
   Screen-reader only utility (a11y)
   ============================================================ */
.screen-reader-text,
.sr-only,
.visually-hidden {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
  width: 1px;
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  word-wrap: normal !important;
  border: 0;
  padding: 0;
  margin: -1px;
}
.screen-reader-text:focus,
.sr-only:focus,
.visually-hidden:focus {
  position: fixed !important;
  clip: auto;
  -webkit-clip-path: none;
          clip-path: none;
  width: auto;
  height: auto;
  overflow: visible;
  white-space: normal;
  background: var(--ds-ink);
  color: #fff;
  padding: 8px 14px;
  z-index: 9999;
}

/* ============================================================
   Print stylesheet
   ============================================================ */
@media print {
  .ds-nav,
  .ds-footer,
  .ds-mobile-cta,
  .ds-exit-popup,
  .ds-mega,
  .skip-link,
  .ds-back-to-top,
  .ds-search-overlay {
    display: none !important;
  }
  body {
    background: #fff !important;
    color: #000 !important;
    font-size: 12pt;
    line-height: 1.5;
  }
  a,
  a:visited {
    color: #000 !important;
    text-decoration: underline;
  }
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    word-break: break-all;
  }
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }
  .ds-cta,
  .ds-cta--lg,
  .ds-btn,
  .ds-btn--primary {
    background: transparent !important;
    color: #000 !important;
    border: 1px solid #000 !important;
    box-shadow: none !important;
  }
  img,
  svg {
    max-width: 100% !important;
    page-break-inside: avoid;
  }
  h1, h2, h3, h4, h5, h6 {
    color: #000 !important;
    page-break-after: avoid;
  }
  p, blockquote, li {
    page-break-inside: avoid;
  }
  .ds-section,
  .ds-section--tight,
  .ds-section--banner,
  .ds-section--ink,
  .ds-section--ink-deep,
  .ds-section--paper,
  .ds-section--paper-2 {
    background: #fff !important;
    color: #000 !important;
    padding: 0.5in 0 !important;
  }
}

/* ============================================================
   EXIT-INTENT MODAL — "Daily debits don't pause."
   Loss-aversion popup. Triggers: desktop mouseleave-top, mobile 45s.
   Dismissed = 7-day cookie. CTA click = 30-day cookie.
   ============================================================ */
.ds-exit { position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: center; justify-content: center; padding: 24px; pointer-events: none; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.ds-exit[hidden] { display: none; }
.ds-exit.is-open { pointer-events: auto; }
.ds-exit__backdrop {
  position: fixed; inset: 0;
  background: rgba(8, 14, 24, 0.72);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity .25s ease;
}
.ds-exit.is-open .ds-exit__backdrop { opacity: 1; }
.ds-exit__panel {
  position: relative;
  background: #fff;
  border-radius: 22px;
  width: 100%;
  max-width: 880px;
  max-height: calc(100vh - 48px);
  box-shadow: 0 32px 80px -24px rgba(8, 14, 24, .55);
  overflow: hidden;
  transform: translateY(16px) scale(.96);
  opacity: 0;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .25s ease;
  display: grid;
  grid-template-columns: 1fr 380px;
  margin: auto;
}
.ds-exit.is-open .ds-exit__panel { transform: translateY(0) scale(1); opacity: 1; }
.ds-exit__close {
  position: absolute; top: 14px; right: 14px;
  width: 36px; height: 36px;
  border-radius: 50%; border: 0;
  background: rgba(15, 26, 45, .06);
  color: var(--ds-ink);
  display: grid; place-items: center;
  cursor: pointer;
  transition: background .15s ease;
  z-index: 3;
}
.ds-exit__close:hover { background: rgba(15, 26, 45, .12); }
.ds-exit__body {
  position: relative; z-index: 2;
  padding: 36px 40px 28px;
}
.ds-exit__eyebrow {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ds-cyan);
  margin-bottom: 14px;
}
.ds-exit__h {
  font-size: 30px;
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: -0.015em;
  color: var(--ds-ink);
  margin: 0 0 14px;
  text-transform: uppercase;
  text-wrap: balance;
}
.ds-exit__h .ds-emph { color: var(--ds-cyan); }
.ds-exit__sub {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ds-ink-3);
  margin: 0 0 18px;
  font-weight: 500;
}
.ds-exit__bullets {
  list-style: none; padding: 0; margin: 0 0 22px;
  display: flex; flex-direction: column; gap: 8px;
}
.ds-exit__bullets li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ds-ink);
  letter-spacing: 0.01em;
}
.ds-exit__bullets li svg { color: var(--ds-cyan); flex-shrink: 0; }
.ds-exit__footnote {
  font-size: 11px;
  line-height: 1.5;
  color: var(--ds-muted);
  font-style: italic;
  font-weight: 500;
  margin: 0 0 18px;
}
.ds-exit__actions {
  display: flex; flex-wrap: wrap; gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}
.ds-exit__btn {
  display: inline-flex; align-items: center; gap: 10px;
  height: 50px; padding: 0 22px;
  border-radius: 999px;
  background: var(--ds-cyan);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: 0 12px 28px -10px rgba(0, 184, 240, .55);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.ds-exit__btn:hover { background: var(--ds-cyan-deep); color: #fff; transform: translateY(-1px); box-shadow: 0 16px 32px -10px rgba(0, 184, 240, .65); }
.ds-exit__btn svg { color: #fff; }
.ds-exit__tel {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14px;
  font-weight: 800;
  color: var(--ds-ink);
  text-decoration: none;
  letter-spacing: 0.02em;
}
.ds-exit__tel:hover { color: var(--ds-cyan-deep); }
.ds-exit__tel svg { color: var(--ds-cyan); }
.ds-exit__dismiss {
  background: transparent; border: 0; padding: 4px 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--ds-muted);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.ds-exit__dismiss:hover { color: var(--ds-ink-3); }

/* Right-side form panel */
.ds-exit__form {
  position: relative;
  background: linear-gradient(160deg, var(--ds-cyan) 0%, var(--ds-cyan-deep) 100%);
  color: #fff;
  padding: 32px 28px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}
.ds-exit__form-pattern {
  position: absolute; inset: 0;
  background: url('../images/d-pattern.svg') center / cover no-repeat;
  opacity: 0.18;
  pointer-events: none;
}
.ds-exit__form-inner { position: relative; z-index: 1; }
.ds-exit__form-eyebrow {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .9);
  margin-bottom: 10px;
}
.ds-exit__form-h {
  font-size: 22px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #fff;
  margin-bottom: 18px;
  text-transform: uppercase;
}
.ds-exit__form-microcopy {
  font-size: 11px;
  font-weight: 600;
  color: rgba(255, 255, 255, .82);
  letter-spacing: 0.04em;
  margin-top: 14px;
  text-align: center;
}

/* Native form inside modal — compact, on cyan */
.ds-exit__form-fields { display: flex; flex-direction: column; gap: 10px; }
.ds-exit__form-fields .ds-form__field { display: flex; flex-direction: column; gap: 6px; }
.ds-exit__form-fields label {
  font-size: 11px;
  font-weight: 700;
  color: rgba(255, 255, 255, .9);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.ds-exit__form-fields input[type="text"],
.ds-exit__form-fields input[type="email"],
.ds-exit__form-fields input[type="tel"] {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  background: rgba(255, 255, 255, .96);
  border: 0;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ds-ink);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
  font-family: inherit;
}
.ds-exit__form-fields input::placeholder { color: var(--ds-muted); }
.ds-exit__form-fields input:focus {
  outline: 2px solid #fff;
  outline-offset: 1px;
}
.ds-exit__submit {
  width: 100%;
  height: 48px;
  padding: 0 22px;
  background: #fff;
  color: var(--ds-ink);
  border: 0;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, .25);
  transition: transform .15s ease, box-shadow .15s ease;
  font-family: inherit;
}
.ds-exit__submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px -6px rgba(0, 0, 0, .35);
}
.ds-exit__submit svg { color: var(--ds-cyan); }
.ds-exit__submit[disabled] { opacity: .65; cursor: not-allowed; transform: none; }
.ds-exit__form-error {
  background: rgba(255, 255, 255, .14);
  color: #fff;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12px;
  margin-top: 4px;
}
.ds-exit__form-fields.is-success {
  text-align: center;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 18px 0;
}

@media (max-width: 760px) {
  .ds-exit { padding: 12px; align-items: flex-start; }
  .ds-exit__panel {
    grid-template-columns: 1fr;
    max-width: 100%;
    max-height: calc(100dvh - 24px);
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 18px;
  }
  .ds-exit__close {
    position: sticky;
    top: 12px;
    margin-left: auto;
    margin-right: 12px;
    margin-top: 12px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
  }
  .ds-exit__body { padding: 4px 22px 18px; }
  .ds-exit__eyebrow { margin-bottom: 10px; }
  .ds-exit__h { font-size: 22px; margin-bottom: 12px; }
  .ds-exit__sub { font-size: 13.5px; margin-bottom: 14px; }
  .ds-exit__bullets { margin-bottom: 16px; }
  .ds-exit__bullets li { font-size: 12.5px; }
  .ds-exit__form { padding: 22px 20px 20px; }
  .ds-exit__form-eyebrow { margin-bottom: 8px; }
  .ds-exit__form-h { font-size: 18px; margin-bottom: 14px; }
  .ds-exit__form-fields { gap: 8px; }
  .ds-exit__form-fields label { font-size: 10.5px; }
  .ds-exit__form-fields input[type="text"],
  .ds-exit__form-fields input[type="email"],
  .ds-exit__form-fields input[type="tel"] { height: 42px; font-size: 16px; /* 16px prevents iOS zoom on focus */ padding: 0 12px; }
  .ds-exit__submit { height: 46px; font-size: 12px; }
  .ds-exit__form-microcopy { font-size: 10.5px; margin-top: 12px; }
}

@media (max-width: 380px) {
  .ds-exit { padding: 8px; }
  .ds-exit__panel { max-height: calc(100vh - 16px); border-radius: 14px; }
  .ds-exit__body { padding: 4px 16px 14px; }
  .ds-exit__h { font-size: 20px; }
  .ds-exit__form { padding: 18px 16px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .ds-exit__backdrop, .ds-exit__panel { transition: none; }
}

/* ============================================================
   May 2026 RESP-QC E — global narrow-phone safety net
   Prevents horizontal scroll on inner-hero when h1 has very long
   words ("RECONCILIATION") at the smallest viewports.
   ============================================================ */
@media (max-width: 480px) {
  .ds-inner-hero { overflow-x: hidden; }
  .ds-inner-hero h1 { overflow-wrap: anywhere; word-break: break-word; }
  .ds-inner-hero__inner { min-width: 0; }
}

/* ============================================================
   MOBILE STICKY CTA — fixed bottom bar with Call Now + Apply.
   Hidden on desktop (>=900px) and on the /apply/ form pages
   (where the page itself is already the conversion).
   ============================================================ */
.ds-mobile-cta {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  background: rgba(15, 26, 45, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 -8px 24px rgba(8, 14, 24, 0.25);
  gap: 8px;
}
.ds-mobile-cta__btn {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
  white-space: nowrap;
  overflow: hidden;
}
.ds-mobile-cta__btn span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ds-mobile-cta__btn--call {
  background: var(--ds-cyan);
  color: #fff;
  box-shadow: 0 6px 16px -4px rgba(0, 184, 240, 0.55);
}
.ds-mobile-cta__btn--call:hover,
.ds-mobile-cta__btn--call:active { background: var(--ds-cyan-deep); color: #fff; transform: translateY(-1px); }
.ds-mobile-cta__btn--call svg { color: #fff; flex-shrink: 0; }
.ds-mobile-cta__btn--apply {
  background: #fff;
  color: var(--ds-ink);
}
.ds-mobile-cta__btn--apply:hover,
.ds-mobile-cta__btn--apply:active { background: var(--ds-paper); color: var(--ds-ink); transform: translateY(-1px); }
.ds-mobile-cta__btn--apply svg { color: var(--ds-cyan); flex-shrink: 0; }

@media (max-width: 900px) {
  .ds-mobile-cta { display: flex; }
  /* Push the dark footer all the way to the bottom of the viewport
     when the user has scrolled to the end. The sticky CTA bar overlays
     the last ~80px of the footer, so we extend the footer's bottom
     padding by the bar's height + the iOS safe-area inset. This kills
     the white gap that shows when body padding doesn't match CTA height. */
  .ds-footer { padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
  body { padding-bottom: 0; background: var(--ds-ink); }
  /* When the exit-intent modal is open, hide the sticky bar so the modal
     gets the full viewport (and the bar doesn't cover the modal's submit). */
  body:has(.ds-exit.is-open) .ds-mobile-cta,
  .ds-mobile-cta.is-hidden { display: none; }
}

/* Narrow phones — tighten padding/font so "GET FREE HELP" and "CALL NOW"
   labels don't truncate. Bumped from @<=380 to @<=480 because audits
   showed clipping at 390px on every page that renders the sticky CTA. */
@media (max-width: 480px) {
  .ds-mobile-cta { padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); gap: 6px; }
  .ds-mobile-cta__btn { height: 44px; padding: 0 10px; font-size: 12px; gap: 6px; letter-spacing: 0.04em; }
  .ds-mobile-cta__btn svg { width: 14px; height: 14px; }
}
@media (max-width: 420px) {
  /* Hide the trailing arrow icon on "Get Free Help" — text needs the room
     and the cyan brand button color is the primary visual signal. */
  .ds-mobile-cta__btn--apply svg { display: none; }
}
@media (max-width: 360px) {
  .ds-mobile-cta { padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); gap: 4px; }
  .ds-mobile-cta__btn { padding: 0 8px; font-size: 11px; gap: 4px; letter-spacing: 0.02em; }
  /* Hide the phone glyph too — color + label still communicate the action. */
  .ds-mobile-cta__btn--call svg { display: none; }
}

/* ============================================================
   Testimonials section title — at <=900px the body bg flips to
   --ds-ink (dark) and the testimonials section has no own bg, so
   the default --ds-ink colored title rendered invisibly on dark.
   ============================================================ */
@media (max-width: 900px) {
  .ds-testimonials .ds-section-title,
  .ds-testimonials .ds-section-title .ds-emph,
  .ds-testimonials .ds-eyebrow,
  .ds-testimonials__rating .label-big { color: #fff !important; }
  .ds-testimonials .ds-eyebrow { color: var(--ds-cyan) !important; }
}

/* ============================================================
   Smith.ai chat widget — push above the mobile sticky CTA on
   phones so the chat button doesn't overlap "GET FREE HELP".
   The widget is injected as #smithChatWidget (3rd-party JS) so
   we can't control its base styles, only nudge with !important.
   ============================================================ */
/* Hide Smith.ai chat widget entirely on mobile — too disruptive on
   small screens where it covers content and competes with the sticky
   bottom CTA. Desktop keeps the widget. */
@media (max-width: 900px) {
  #smithChatWidget,
  .smithai-frame,
  iframe[src*="smith.ai"],
  [class*="SmithAI"],
  [id*="smith-ai"] {
    display: none !important;
    visibility: hidden !important;
  }
}

/* Hide the chat widget while the exit-intent modal is open so its
   floating launcher doesn't cover the form's CTA / microcopy. */
body:has(.ds-exit.is-open) #smithChatWidget,
body.ds-mobile-nav-open #smithChatWidget {
  display: none !important;
  visibility: hidden !important;
}
