/* ==========================================================================
   SaaS Law site stylesheet
   --------------------------------------------------------------------------
   Loaded on the legacy WordPress/Kadence pages only (contact, services,
   practice areas, articles, policies). The homepage, /platform/, /law-firm/,
   /about/ and /blog/ use home.css instead; every page gets its header and
   footer from chrome.css. Two jobs:
     1. Tokens, and the Kadence palette remapped onto the homepage colours.
     2. Sections 4-6: legacy Kadence/CF7 markup skinned in place, because
        those exports' own stylesheets did not survive the WordPress export.
   Job 1 is namespaced .sl-* so it cannot leak into the Kadence block markup;
   job 2 is scoped by body class instead, for the same reason.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Minimal reset
   Guards against the UA default `body { margin: 8px }` insetting the
   full-bleed header and footer on any page without Kadence's normalize. A
   no-op on the Kadence pages, where global.min.css already zeroes it.
   -------------------------------------------------------------------------- */
html { box-sizing: border-box; }
body { margin: 0; }

/* --------------------------------------------------------------------------
   1. Tokens
   Reuses the existing Kadence palette where an equivalent exists, so the new
   chrome stays on-brand with the pages it sits above.
   -------------------------------------------------------------------------- */
:root {
  /* Mapped onto the existing brand palette */
  --sl-blue:       var(--global-palette1, #19459d);
  --sl-gold:       var(--global-palette2, #edcc19);
  --sl-ink:        var(--global-palette3, #070811);
  --sl-muted:      var(--global-palette4, #707075);
  --sl-faint:      var(--global-palette5, #959599);
  /* New — no existing equivalent */
  --sl-navy:       #0F2A5E;
  --sl-gold-deep:  #B8860B;
  --sl-blue-tint:  #EDF1FA;
  --sl-cream:      #F3EFE6;
  --sl-canvas:     #FAF8F3;
  --sl-line:       #E4E0D4;
  --sl-line-soft:  #ECE8DD;

  /* Redline card, per redline-card.html */
  --sl-clause-bg:    #EEF1F6;
  --sl-clause-ink:   #1F2733;
  --sl-clause-muted: #5A6676;
  --sl-clause-red:   #C0392B;
  --sl-pill-bg:      #EAF1FB;
  --sl-pill-border:  #CBDBF2;
  --sl-tag-bg:       #FBEFC7;
  --sl-tag-text:     #8A6D0F;

  /* Type */
  --sl-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sl-sans:  'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --sl-mono:  'Spline Sans Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Layout — content width lines up with chrome.css .sl-cwrap */
  --sl-maxw: 1080px;
  --sl-pad: 20px;
}

/* Remap the Kadence font vars so the 36 existing page bodies match the new
   chrome above them. Revert these two lines to fall back to Manrope. */
:root {
  --global-body-font-family: 'Inter', system-ui, -apple-system, sans-serif;
  --global-heading-font-family: 'Fraunces', Georgia, serif;
}

/* Remap the Kadence colour palette onto the homepage's navy / gold / cream so
   every page body matches it. html:root outranks the :root palette Kadence
   prints inline in each page's <head>. Originals in comments. */
html:root {
  --global-palette1: #0F2A5E; /* #19459d brand blue -> navy */
  --global-palette2: #E8B824; /* #edcc19 yellow -> gold */
  --global-palette3: #15202E; /* #070811 ink */
  --global-palette4: #55616F; /* #707075 muted */
  --global-palette5: #6B7685; /* #959599 faint */
  --global-palette6: #CFC9B8; /* #c4c4cb */
  --global-palette7: #E4E0D4; /* #ebebeb lines */
  --global-palette8: #F3EFE6; /* #f3f3f3 body / band */
  --global-palette9: #FAF8F3; /* #ffffff page background -> canvas */
}

/* --------------------------------------------------------------------------
   2. Accessibility baseline
   The theme ships a `hide-focus-outline` body class that suppresses focus
   rings entirely. Restore a visible ring for keyboard users.
   -------------------------------------------------------------------------- */
body.hide-focus-outline .sl-topnav :focus-visible,
body.hide-focus-outline .sl-mtabs :focus-visible,
body.hide-focus-outline .sl-foot :focus-visible,
body.hide-focus-outline .sl-page :focus-visible,
body.hide-focus-outline .cc-post-navigation :focus-visible,
.cc-post-navigation :focus-visible,
.sl-page :focus-visible {
  outline: 3px solid var(--sl-gold);
  outline-offset: 2px;
  border-radius: 4px;
}

.sl-skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  background: var(--sl-navy);
  color: #fff;
  padding: 12px 20px;
  font: 600 14px/1 var(--sl-sans);
}
.sl-skip:focus { left: 0; }

/* Every transform/transition below is opt-in for users who want motion. */
@media (prefers-reduced-motion: reduce) {
  .sl-page * {
    transition: none;
    animation: none;
    scroll-behavior: auto;
  }
}

/* --------------------------------------------------------------------------
   3. Shared primitives
   -------------------------------------------------------------------------- */
.sl-wrap {
  max-width: var(--sl-maxw);
  margin: 0 auto;
  padding: 0 var(--sl-pad);
}

.sl-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 10px;
  padding: 10px 17px;
  font-family: var(--sl-sans);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  text-decoration: none;
}
@media (prefers-reduced-motion: no-preference) {
  .sl-btn { transition: transform .1s, box-shadow .12s, background .12s, border-color .12s; }
}
.sl-btn--lg { padding: 14px 24px; font-size: 15px; }
.sl-btn--primary {
  background: var(--sl-navy);
  color: #fff;
  box-shadow: 0 2px 8px rgba(15, 42, 94, .2);
}
.sl-btn--primary:hover { background: #14356F; color: #fff; }
.sl-btn--ghost {
  color: var(--sl-navy);
  border-color: var(--sl-line);
  background: #fff;
}
.sl-btn--ghost:hover { border-color: #C4CCD8; color: var(--sl-navy); }
.sl-btn--gold {
  background: var(--sl-gold);
  color: var(--sl-navy);
}
.sl-btn--gold:hover { background: #F7DA3C; color: var(--sl-navy); }
@media (prefers-reduced-motion: no-preference) {
  .sl-btn--primary:hover,
  .sl-btn--gold:hover { transform: translateY(-1px); }
  .sl-btn--primary:hover { box-shadow: 0 4px 14px rgba(15, 42, 94, .28); }
  .sl-btn--gold:hover { box-shadow: 0 4px 14px rgba(242, 207, 21, .4); }
}

/* --------------------------------------------------------------------------
   4. /contact/ — "Contact Us" form
   Still the Contact Form 7 export underneath: .wpcf7-form, [type=submit] and
   .wpcf7-response-output are load-bearing for js/formspree-handler.js, so
   these rules re-skin that markup rather than replace it. Selectors carry an
   extra class on purpose — Kadence's global.min.css styles bare input[type=…]
   and CF7's styles.css styles .wpcf7 form … , both of which would otherwise
   tie or win on specificity.
   -------------------------------------------------------------------------- */
.sl-cform { margin-top: 28px; }

.sl-cform .wpcf7-form {
  background: #fff;
  border: 1px solid var(--sl-line-soft);
  border-radius: 20px;
  padding: 38px 40px 32px;
  box-shadow: 0 1px 2px rgba(15, 42, 94, .04), 0 18px 44px -26px rgba(15, 42, 94, .28);
}

.sl-cform__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 24px; }
.sl-cfield--wide { grid-column: 1 / -1; }

.sl-cform .sl-cfield label {
  display: block;
  font-family: var(--sl-sans);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--sl-navy);
  margin-bottom: 8px;
}
.sl-cfield__req { color: var(--sl-faint); font-weight: 400; margin-left: 3px; }
.sl-cfield .wpcf7-form-control-wrap { display: block; }

/* Filled, not outlined — the border only shows up on focus/error. */
.sl-cform .sl-cfield input,
.sl-cform .sl-cfield textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  font-family: var(--sl-sans);
  font-size: 15px;
  line-height: 1.5;
  color: var(--sl-ink);
  background: #F4F6FA;
  border: 1px solid transparent;
  border-radius: 12px;
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.sl-cform .sl-cfield textarea { min-height: 170px; resize: vertical; }
.sl-cform .sl-cfield input::placeholder,
.sl-cform .sl-cfield textarea::placeholder { color: var(--sl-faint); }
.sl-cform .sl-cfield input:hover,
.sl-cform .sl-cfield textarea:hover { background: #EDF1F8; }
.sl-cform .sl-cfield input:focus,
.sl-cform .sl-cfield textarea:focus {
  outline: none;
  color: var(--sl-ink);
  background: #fff;
  border-color: var(--sl-navy);
  box-shadow: 0 0 0 3px var(--sl-blue-tint);
}
/* Chrome paints its own autofill background over the fill colour. */
.sl-cform .sl-cfield input:-webkit-autofill,
.sl-cform .sl-cfield input:-webkit-autofill:hover {
  -webkit-box-shadow: 0 0 0 60px #F4F6FA inset;
  -webkit-text-fill-color: var(--sl-ink);
}
.sl-cform .sl-cfield input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 60px #fff inset, 0 0 0 3px var(--sl-blue-tint);
}

.sl-cform .sl-cfield input.wpcf7-not-valid,
.sl-cform .sl-cfield textarea.wpcf7-not-valid { background: #FDF3F1; border-color: #C02B0A; }
.sl-cform .wpcf7-not-valid-tip { font-size: 13px; line-height: 1.5; color: #C02B0A; margin-top: 7px; }

.sl-cform__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 24px;
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid var(--sl-line-soft);
}
/* Kadence styles bare input[type=submit] at (0,1,1), which outranks the plain
   .sl-btn classes — so the button's own look is restated at (0,3,1). */
.sl-cform input[type="submit"].sl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 15px 30px;
  font-family: var(--sl-sans);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  border: 1px solid transparent;
  border-radius: 12px;
}
.sl-cform input[type="submit"].sl-btn--primary {
  background: var(--sl-navy);
  color: #fff;
  box-shadow: 0 2px 8px rgba(15, 42, 94, .2);
}
.sl-cform input[type="submit"].sl-btn--primary:hover,
.sl-cform input[type="submit"].sl-btn--primary:focus {
  background: #14356F;
  color: #fff;
  box-shadow: 0 4px 14px rgba(15, 42, 94, .28);
}
.sl-cform input[type="submit"].sl-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
/* The theme's `hide-focus-outline` body class kills focus rings at (0,1,1).
   The text fields get their own ring above; the button needs one restored. */
body.hide-focus-outline .sl-cform input[type="submit"]:focus-visible,
.sl-cform input[type="submit"]:focus-visible { outline: 3px solid var(--sl-gold); outline-offset: 2px; }
.sl-cform__note { font-size: 13.5px; line-height: 1.5; color: var(--sl-muted); margin: 0; max-width: 420px; }

/* formspree-handler.js tags this with is-sending / is-error / is-ok. CF7's own
   stylesheet hides it on form.init — a class the handler never clears — so
   visibility is driven off aria-hidden instead. */
.sl-cform.wpcf7 form.wpcf7-form .wpcf7-response-output {
  display: block;
  border: 0;
  margin: 20px 0 0;
  padding: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}
.sl-cform.wpcf7 form.wpcf7-form .wpcf7-response-output[aria-hidden="true"] { display: none; }
.sl-cform .wpcf7-response-output.is-sending { color: var(--sl-muted); }
.sl-cform .wpcf7-response-output.is-error { color: #C02B0A; }
.sl-cform .wpcf7-response-output.is-ok { color: #2F7D18; }

/* --------------------------------------------------------------------------
   5. Practice-area pages — title band, sidebar service nav, enquiry form
   -------------------------------------------------------------------------- */

/* --- Article title -------------------------------------------------------
   The grey .entry-hero band that used to sit above the article repeated the
   title the article already carries, so it was removed and the article's
   heading promoted from h2 to h1. Give the page a little breathing room at
   the top now that nothing precedes it. */
body.single-practice_area .entry-content > h1:first-child { margin-top: 0; }

/* --- Sidebar service nav -------------------------------------------------
   .cc-post-navigation was authored as a collapsible accordion (note the
   data-accordion-forced attribute, the __toggler spans and the visibility-on
   state class) but neither its stylesheet nor its script survived the
   WordPress export — grep the repo and this is the only rule set it has. So
   it rendered as a raw, fully-expanded nested <ul> with default bullets: 24
   flat links, no hierarchy, no current-page marker.

   The collapse is pure CSS off visibility-on, which the export already puts
   on exactly the current branch. practice-nav.js only adds the toggle button,
   so with JS off the nav degrades to a plain expanded list, not a broken one.
   -------------------------------------------------------------------------- */
body.single-practice_area .cc-post-navigation {
  font-family: var(--sl-sans);
  background: #fff;
  border: 1px solid var(--sl-line);
  border-radius: 14px;
  padding: 6px;
}

/* Kadence styles bare h4 as 26px/800 navy — far too loud for a nav label. */
body.single-practice_area .cc-post-navigation__headline {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--sl-line);
}
body.single-practice_area .cc-post-navigation__link--header {
  display: block;
  padding: 12px 12px 11px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sl-faint);
  text-decoration: none;
}
body.single-practice_area .cc-post-navigation__link--header:hover { color: var(--sl-navy); }
/* The header's toggler has no sub-list to open — it is a link to /services/. */
body.single-practice_area .cc-post-navigation__headline .cc-post-navigation__toggler { display: none; }

body.single-practice_area .cc-post-navigation__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
body.single-practice_area .cc-post-navigation__item {
  list-style: none;
  margin: 0;
}
/* Parents hold their link and toggle on one row, sub-list wrapping beneath. */
body.single-practice_area .cc-post-navigation__item--parent {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

body.single-practice_area .cc-post-navigation__link {
  display: block;
  flex: 1;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--sl-ink);
  text-decoration: none;
}
@media (prefers-reduced-motion: no-preference) {
  body.single-practice_area .cc-post-navigation__link { transition: background .12s, color .12s; }
}
body.single-practice_area .cc-post-navigation__link:hover {
  background: var(--sl-canvas);
  color: var(--sl-navy);
}
/* On a child page the export marks BOTH the ancestor section and the current
   page --active. Two filled blocks read as two current pages, so the filled
   treatment is reserved for the real one: href="./" is the self-link, and it
   is present exactly once on every one of the 24 pages. */
body.single-practice_area .cc-post-navigation__link--active {
  font-weight: 600;
  color: var(--sl-navy);
}
body.single-practice_area .cc-post-navigation__link--active[href="./"] {
  background: var(--sl-blue-tint);
  box-shadow: inset 3px 0 0 var(--sl-navy);
}
body.single-practice_area .cc-post-navigation__link--active[href="./"]:hover { background: var(--sl-blue-tint); }

/* A parent row also holds the toggle button, so the link's own highlight would
   stop short of the row's right edge. Extend the tint across the button so the
   two read as one bar. Tinting the <li> instead is not an option — the sub-list
   is inside it, so the children would sit on the tint too. The --current class
   is added by practice-nav.js. */
body.single-practice_area .cc-post-navigation__item--current > .cc-post-navigation__link--active {
  border-radius: 8px 0 0 8px;
}
body.single-practice_area .cc-post-navigation__item--current > .cc-post-navigation__toggle {
  height: 37px;
  margin-right: 0;
  padding-right: 10px;
  background: var(--sl-blue-tint);
  border-radius: 0 8px 8px 0;
  color: var(--sl-navy);
}

/* The whole collapse: the export already marks the current branch. */
body.single-practice_area .cc-post-navigation__list--level-1 { display: none; }
body.single-practice_area .cc-post-navigation__list--level-1.visibility-on {
  display: block;
  flex-basis: 100%;
  margin: 2px 0 6px 20px;
  padding-left: 10px;
  border-left: 1px solid var(--sl-line);
}
body.single-practice_area .cc-post-navigation__link--child {
  padding: 7px 10px;
  font-size: 13.5px;
  font-weight: 400;
  color: var(--sl-muted);
}
body.single-practice_area .cc-post-navigation__link--child:hover { color: var(--sl-navy); }

/* Injected by practice-nav.js; the export's own __toggler span is discarded. */
body.single-practice_area .cc-post-navigation__toggle {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  min-width: 28px;
  height: 28px;
  margin-right: 4px;
  padding: 0 6px;
  background: none;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  color: var(--sl-faint);
}
body.single-practice_area .cc-post-navigation__toggle:hover { background: var(--sl-canvas); color: var(--sl-navy); }
body.single-practice_area .cc-post-navigation__toggle svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
}
@media (prefers-reduced-motion: no-preference) {
  body.single-practice_area .cc-post-navigation__toggle svg { transition: transform .15s ease; }
}
body.single-practice_area .cc-post-navigation__toggle[aria-expanded="true"] svg { transform: rotate(90deg); }
body.single-practice_area .cc-post-navigation__count {
  font-family: var(--sl-mono);
  font-size: 11px;
  line-height: 1;
}
/* Once open the count is redundant — the children are right there. */
body.single-practice_area .cc-post-navigation__toggle[aria-expanded="true"] .cc-post-navigation__count { display: none; }

/* --- Sidebar enquiry form ------------------------------------------------
   The same CF7 export as /contact/, but sitting in the left sidebar of the 24
   /services/ detail pages. Skinned in place off the body class so the markup
   on all 24 exports stays untouched. Supersedes the "Practice Area Contact
   Form" block that used to be duplicated into every page's wp-custom-css.
   -------------------------------------------------------------------------- */
body.single-practice_area .wpcf7 { margin-top: 32px; }

body.single-practice_area .wpcf7 form {
  padding: 28px 24px 26px;
  color: #fff;
  background: var(--sl-blue);
  border-radius: 10px;
  box-shadow: 0 16px 34px -22px rgba(15, 42, 94, .6);
}

body.single-practice_area .wpcf7 form p { margin: 0; }
body.single-practice_area .wpcf7 form p + p { margin-top: 18px; }
body.single-practice_area .wpcf7 form p:last-of-type { margin-top: 24px; }

body.single-practice_area .wpcf7 form label {
  display: block;
  font-family: var(--sl-sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .02em;
  color: rgba(255, 255, 255, .88);
}
/* The export puts a <br> between the label text and its control. Margin does
   that job now, so the break would only add a stray blank line. */
body.single-practice_area .wpcf7 form label br { display: none; }
body.single-practice_area .wpcf7 form .wpcf7-form-control-wrap { display: block; margin-top: 8px; }

body.single-practice_area .wpcf7 form input[type="text"],
body.single-practice_area .wpcf7 form input[type="tel"],
body.single-practice_area .wpcf7 form input[type="email"],
body.single-practice_area .wpcf7 form textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  font-family: var(--sl-sans);
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--sl-ink);
  background: #fff;
  border: 1px solid transparent;
  border-radius: 5px;
  box-shadow: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
body.single-practice_area .wpcf7 form textarea { height: 128px; min-height: 128px; resize: vertical; }
body.single-practice_area .wpcf7 form input::placeholder,
body.single-practice_area .wpcf7 form textarea::placeholder { color: var(--sl-faint); }
body.single-practice_area .wpcf7 form input[type="text"]:focus,
body.single-practice_area .wpcf7 form input[type="tel"]:focus,
body.single-practice_area .wpcf7 form input[type="email"]:focus,
body.single-practice_area .wpcf7 form textarea:focus {
  outline: none;
  color: var(--sl-ink);
  background: #fff;
  border-color: var(--sl-gold);
  box-shadow: 0 0 0 3px rgba(237, 204, 25, .38);
}
body.single-practice_area .wpcf7 form input.wpcf7-not-valid,
body.single-practice_area .wpcf7 form textarea.wpcf7-not-valid {
  border-color: #FFB0A0;
  box-shadow: 0 0 0 3px rgba(255, 130, 105, .32);
}
body.single-practice_area .wpcf7 .wpcf7-not-valid-tip { margin-top: 8px; font-size: 12.5px; color: #FFD9D2; }

body.single-practice_area .wpcf7 form input[type="submit"] {
  display: inline-block;
  width: auto;
  padding: 10px 22px;
  font-family: var(--sl-sans);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--sl-navy);
  background: var(--sl-gold);
  border: 0;
  border-radius: 5px;
  cursor: pointer;
  box-shadow: none;
}
/* Was gold text on a near-white button — effectively unreadable on hover. */
body.single-practice_area .wpcf7 form input[type="submit"]:hover,
body.single-practice_area .wpcf7 form input[type="submit"]:focus {
  color: var(--sl-navy);
  background: #F7DA3C;
  box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .55);
}
body.single-practice_area .wpcf7 form input[type="submit"]:disabled {
  opacity: .55;
  cursor: not-allowed;
  color: var(--sl-navy);
  background: var(--sl-gold);
  box-shadow: none;
}
body.hide-focus-outline.single-practice_area .wpcf7 form input[type="submit"]:focus-visible,
body.single-practice_area .wpcf7 form input[type="submit"]:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}

/* Same CF7 `form.init` trap as section 10 — see the note there. */
body.single-practice_area .wpcf7 form.wpcf7-form .wpcf7-response-output {
  display: block;
  border: 0;
  margin: 16px 0 0;
  padding: 0;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
}
body.single-practice_area .wpcf7 form.wpcf7-form .wpcf7-response-output[aria-hidden="true"] { display: none; }
body.single-practice_area .wpcf7 form.wpcf7-form .wpcf7-response-output.is-sending { color: rgba(255, 255, 255, .8); }
body.single-practice_area .wpcf7 form.wpcf7-form .wpcf7-response-output.is-error { color: #FFD9D2; }
body.single-practice_area .wpcf7 form.wpcf7-form .wpcf7-response-output.is-ok { color: #D7F3C8; }

/* --------------------------------------------------------------------------
   6. /services/ archive — hero + card grid spacing
   The hero row was sized around a full-bleed photo (min-height 337px) that has
   since been removed, so the title floated in ~140px of empty band. Kadence
   then adds another 3rem above the grid via .content-area. Both are pulled in
   here rather than in the page's inline CSS, which is a generated blob.
   -------------------------------------------------------------------------- */
body.post-type-archive-practice_area .kb-row-layout-id341_45015c-d9 > .kt-row-column-wrap {
  min-height: 150px;
}
body.post-type-archive-practice_area .content-area { margin-top: 24px; }

/* --------------------------------------------------------------------------
   7. Responsive — normalized onto the site's existing 1024 / 767 breakpoints
   -------------------------------------------------------------------------- */
@media all and (max-width: 1024px) {
  .sl-cform__grid { grid-template-columns: repeat(2, 1fr); }
  .sl-cfield--email { grid-column: 1 / -1; }
}

@media all and (max-width: 767px) {
  :root { --sl-pad: 20px; }

  .sl-cform .wpcf7-form { padding: 26px 20px 24px; border-radius: 16px; }
  .sl-cform__grid { grid-template-columns: 1fr; gap: 20px; }
  .sl-cform .sl-cfield textarea { min-height: 150px; }
  .sl-cform__foot { flex-direction: column; align-items: stretch; margin-top: 26px; padding-top: 22px; }
  .sl-cform input[type="submit"].sl-btn { width: 100%; justify-content: center; }
  .sl-cform__note { max-width: none; }
}

/* --------------------------------------------------------------------------
   8. "Keep Building Your Dream" CTA band (#cta-section, legacy Kadence pages)
   Was a full-bleed yellow row; restyled to the homepage's cream band with a
   navy heading and navy button.
   -------------------------------------------------------------------------- */
#cta-section.kb-row-layout-wrap { background: var(--sl-cream) !important; border-top: 1px solid var(--sl-line); }
#cta-section .wp-block-kadence-advancedheading { color: var(--sl-navy); letter-spacing: -.8px; font-weight: 600; }
#cta-section .kb-button {
  background: var(--sl-navy);
  color: #fff;
  border-radius: 10px;
  font-family: var(--sl-sans);
  font-weight: 600;
  box-shadow: 0 2px 10px rgba(15, 42, 94, .3);
  transition: transform .1s, box-shadow .15s;
}
#cta-section .kb-button:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(15, 42, 94, .36); color: #fff; }
