/* ═══════════════════════════════════════════════════════════════════════
   TLSM v1.1.77 — ONE SITEWIDE CONTAINER + GUTTER (loads last)
   Why: the v1.1.6x overflow lock set `.s-inner,.cta-inner,.footer-inner,
   .nav-inner{max-width:100% !important}`, which wiped the 1300px cap on
   those wrappers. Result at 1920: nav, most homepage bands and the footer
   ran edge-to-edge (32px gutter, 1841px wide) while the hero / stats /
   usp bands stayed at 1300 and every inner page sat in a 920–1120px column
   (≈400px dead margin each side). Mobile/tablet had a separate !important
   1.25rem gutter layer, so gutters never matched across pages.
   Fix: one container (--tlsm-max) + one fluid gutter (--tlsm-gutter) for
   every band, nav, footer and inner-page stage. Prose keeps a readable
   measure (--tlsm-measure); copy unchanged; colours unchanged.
   `:root:not(#_t)` adds one id of specificity so this layer beats the older
   !important gutter layers without touching them.
   ═════════════════════════════════════════════════════════════════════ */
:root{
  --tlsm-max:1360px;                                   /* content width at desktop */
  --tlsm-gutter:clamp(20px, 3.2vw, 48px);              /* 20 phone · ~26 @820 · ~33 @1024 · 46 @1440 · 48 max */
  --tlsm-gutter-l:max(var(--tlsm-gutter), env(safe-area-inset-left, 0px));
  --tlsm-gutter-r:max(var(--tlsm-gutter), env(safe-area-inset-right, 0px));
  --tlsm-wrap:calc(var(--tlsm-max) + 2 * var(--tlsm-gutter));
  --tlsm-measure:74ch;                                 /* long-form paragraph line length */
}

/* Large monitors: a touch wider so 1920+ never reads as a narrow column */
@media (min-width:1800px){
  :root{ --tlsm-max:1440px; }
}

/* ── A. Full-bleed bands: shell carries NO side padding, inner carries the gutter ── */
:root:not(#_t) body .s,
:root:not(#_t) body .usp-band,
:root:not(#_t) body .flare-stats,
:root:not(#_t) body .stats-band,
:root:not(#_t) body .path-magnet,
:root:not(#_t) body .trust-strip,
:root:not(#_t) body .inline-lm,
:root:not(#_t) body .hero,
:root:not(#_t) body footer.footer{
  padding-left:0 !important;
  padding-right:0 !important;
}
:root:not(#_t) body .s-inner,
:root:not(#_t) body .hero-inner,
:root:not(#_t) body .hero.hero--askmaps .hero-inner.hero-askmaps-inner,
:root:not(#_t) body .usp-band-inner,
:root:not(#_t) body .flare-stats-inner,
:root:not(#_t) body .stats-band-inner,
:root:not(#_t) body .path-magnet-inner,
:root:not(#_t) body .trust-strip-inner,
:root:not(#_t) body .footer-inner{
  width:100%;
  max-width:var(--tlsm-wrap) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:var(--tlsm-gutter-l) !important;
  padding-right:var(--tlsm-gutter-r) !important;
  box-sizing:border-box;
}
/* Lead-magnet strip: same outer edge, card keeps its compact 2-col shape */
:root:not(#_t) body .inline-lm-inner{
  width:auto;
  max-width:min(1040px, calc(100% - var(--tlsm-gutter-l) - var(--tlsm-gutter-r))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box;
}

/* Desktop nav lines up with page content (mobile thin header untouched) */
@media (min-width:901px){
  :root:not(#_t) body .nav-inner{
    max-width:var(--tlsm-wrap) !important;
    margin-left:auto;margin-right:auto;
    padding-left:var(--tlsm-gutter-l);
    padding-right:var(--tlsm-gutter-r);
    box-sizing:border-box;
  }
}

/* Inner homepage grids that were capped narrower than their band */
:root:not(#_t) body .bridge-grid,
:root:not(#_t) body .compare-grid,
:root:not(#_t) body .guarantee-grid{
  max-width:100% !important;
}
:root:not(#_t) body .path-magnet-inner .pm-h{max-width:1000px;margin-left:auto;margin-right:auto}

/* Final CTA board: one gutter on the navy stage, board fills the container */
:root:not(#_t) body .cta-s{
  padding-left:var(--tlsm-gutter-l) !important;
  padding-right:var(--tlsm-gutter-r) !important;
}
:root:not(#_t) body .cta-s .cta-inner{
  max-width:var(--tlsm-max) !important;
  margin-left:auto;margin-right:auto;
}

/* ── B. Inner pages: stage shell carries the gutter, wrapper carries the width ── */
:root:not(#_t) body .tlsm-lp-hero,
:root:not(#_t) body .tlsm-lp-stage,
:root:not(#_t) body .tlsm-cu-hero,
:root:not(#_t) body .tlsm-cu-stage,
:root:not(#_t) body .tlsm-wwh-hero,
:root:not(#_t) body .tlsm-wwh-stage,
:root:not(#_t) body .page-hero,
:root:not(#_t) body .content-area,
:root:not(#_t) body .archive-header{
  padding-left:var(--tlsm-gutter-l) !important;
  padding-right:var(--tlsm-gutter-r) !important;
}
:root:not(#_t) body .tlsm-lp-hero-inner,
:root:not(#_t) body .tlsm-lp-wrap,
:root:not(#_t) body .tlsm-cu-hero-inner,
:root:not(#_t) body .tlsm-cu-wrap,
:root:not(#_t) body .tlsm-wwh-hero-grid,
:root:not(#_t) body .tlsm-wwh-wrap,
:root:not(#_t) body .content-inner.wide{
  width:100%;
  max-width:var(--tlsm-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box;
}
/* Blog index: grid widens to the container, same outer gutter */
:root:not(#_t) body .archive-container{
  width:100%;
  max-width:var(--tlsm-wrap) !important;
  margin-left:auto;margin-right:auto;
  padding-left:var(--tlsm-gutter-l) !important;
  padding-right:var(--tlsm-gutter-r) !important;
  box-sizing:border-box;
}
/* Single post: keep the reading column, just use the shared gutter */
:root:not(#_t) body .post-container{
  padding-left:var(--tlsm-gutter-l) !important;
  padding-right:var(--tlsm-gutter-r) !important;
  box-sizing:border-box;
}

/* Long-form copy inside widened inner-page cards keeps a readable line length */
:root:not(#_t) body .tlsm-lp-card > p,
:root:not(#_t) body .tlsm-wwh-card > p,
:root:not(#_t) body .tlsm-cu-card > p,
:root:not(#_t) body .tlsm-lp-card > .tlsm-lp-lead,
:root:not(#_t) body .tlsm-wwh-card > ul,
:root:not(#_t) body .tlsm-lp-card > ul,
:root:not(#_t) body .tlsm-wwh-lock > p,
:root:not(#_t) body .tlsm-cu-close > p,
:root:not(#_t) body .tlsm-cu-checks{
  max-width:var(--tlsm-measure);
}
:root:not(#_t) body .tlsm-squeeze .tlsm-squeeze__sub{
  max-width:var(--tlsm-measure);
  margin-left:auto;margin-right:auto;
}
/* Who We Help hero portrait keeps its proportion on wide screens (face stays whole) */
@media (min-width:901px){
  :root:not(#_t) body .tlsm-wwh-hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr)}
  :root:not(#_t) body .tlsm-wwh-hero-photo{max-width:500px;justify-self:end;width:100%}
}

/* ── C. Phones: never let text touch the glass, never scroll sideways ── */
@media (max-width:600px){
  :root{ --tlsm-gutter:20px; }
}
html,body{overflow-x:clip}

/* Final CTA board on desktop: copy column + photo column, so the wider board has no
   stranded space. Trust line stays directly under its button (same column, no row stretch). */
@media (min-width:1024px){
  :root:not(#_t) body .cta-s .cta-inner{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
    column-gap:clamp(2rem,4vw,3.5rem);
    align-content:center;
    max-width:min(var(--tlsm-max), 1240px) !important;
  }
  :root:not(#_t) body .cta-s .cta-inner > *{grid-column:1}
  :root:not(#_t) body .cta-s .cta-inner > .home-visual--cta{
    grid-column:2;grid-row:1 / span 6;
    position:relative;aspect-ratio:auto;min-height:340px;height:100%;margin:0;
    align-self:stretch;overflow:hidden;
  }
  :root:not(#_t) body .cta-s .home-visual--cta img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  }
}