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

    .rsg-inm-ftr{ --blue:#2E81C1; --gold:#D5AD7B;
      --ink:#E4ECF3; --muted:#C3D4E4; --muted-2:#8A94A3; --line:rgba(255,255,255,.10);
      position:relative; font-family:var(--font); color:var(--muted);
      /* 2026-07-31 — client-specified footer background: a vertical fade from deep navy to
         black, making the footer its own deeper plinth beneath the page's dark bands rather
         than matching them. (This deliberately reverses the 2026-07-29 "flatten to
         --band-dark" alignment; the pages' bands stay #072857, so expect a visible step at
         the CTA-band/footer seam — that separation is the intent.) Every footer text colour
         gains contrast on the darker field: --muted 9.56 -> 12.36, --muted-2 4.72 -> 6.10,
         the reversed paper wordmark 13.11 -> 16.95, and --blue clears AA outright
         (3.47 -> 4.48/5.03). --band-dark is kept as the token of record for the red border. */
      --band-dark:#00122B;
      background:linear-gradient(#00122B 0%, #000000 100%);
      border-top:3px solid var(--red);
    }
    .rsg-inm-ftr *,.rsg-inm-ftr *::before,.rsg-inm-ftr *::after{box-sizing:border-box}
    .rsg-inm-ftr a{text-decoration:none;color:inherit}
    .rsg-inm-ftr ul{list-style:none;margin:0;padding:0}
    .rsg-inm-ftr svg{display:block}
    .rsg-inm-ftr :focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:3px}

    .rsg-ftr-main{max-width:1220px;margin:0 auto;padding:64px 28px 30px}
    .rsg-ftr-top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px 34px}

    /* ---- brand column ---- */
    .rsg-ftr-brand{max-width:400px}
    .rsg-ftr-logo{display:inline-flex;align-items:center;margin-bottom:18px}
    /* client's FINALIZED 2026 logo lockup — FULL-COLOUR variant, per explicit client
       instruction (2026-07-31): the identical logo file is used on every surface sitewide,
       header and footer alike, with no reversed/knockout variant.
       KNOWN TRADE-OFF, accepted by the client after being shown it rendered: the wordmark's
       own blue #002E6D is very close in value to this near-black band, so "MECHANICAL" reads
       dim here (~1.5:1) while "INNOVATIVE" in #AA182C still carries. WCAG exempts logotypes
       from contrast minimums, so this is conformant — it is a legibility choice, not a defect.
       If it ever needs lifting, the one-line fix is a paper plate behind .rsg-ftr-logo
       (background:#F9F3E8;padding:14px 18px;border-radius:12px) — NOT a recoloured logo.
       Aspect 2.170:1, so 76px tall = 165px wide inside the 400px brand column. */
    .rsg-ftr-logo-img{display:block;height:76px;width:auto;max-width:100%}
    .rsg-ftr-desc{font-size:13.5px;line-height:1.75;color:var(--muted);margin:0 0 20px}
    .rsg-ftr-desc b{color:var(--ink);font-weight:600}

    .rsg-ftr-rating{display:inline-flex;align-items:center;gap:9px;padding:9px 15px;margin-bottom:20px;
      border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04)}
    .rsg-ftr-rating .rsg-ftr-g{width:16px;height:16px;flex:0 0 auto}
    .rsg-ftr-stars{color:var(--gold);letter-spacing:1px;font-size:12px}
    .rsg-ftr-rating b{color:#fff;font-weight:700;font-size:13.5px}
    .rsg-ftr-rating span{font-size:13px;color:var(--muted)}

    .rsg-ftr-phone{display:inline-flex;align-items:center;gap:12px;margin-bottom:16px}
    .rsg-ftr-phone-ic{width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;flex:0 0 auto;box-shadow:0 10px 22px -12px rgba(170,24,44,.7);transition:transform .25s var(--ease)}
    .rsg-ftr-phone-ic svg{width:18px;height:18px}
    .rsg-ftr-phone:hover .rsg-ftr-phone-ic{transform:scale(1.06)}
    .rsg-ftr-phone b{font-size:22px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums lining-nums}

    .rsg-ftr-lines{display:grid;gap:9px;margin-bottom:20px}
    .rsg-ftr-line{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;color:var(--muted)}
    .rsg-ftr-line svg{width:15px;height:15px;flex:0 0 auto;margin-top:2px;color:var(--blue-2)}

    .rsg-ftr-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
    .rsg-ftr-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--line);
      border-radius:8px;background:rgba(255,255,255,.04);font-size:11px;font-weight:600;letter-spacing:.01em;color:var(--ink)}
    .rsg-ftr-ck{width:16px;height:16px;flex:0 0 auto;border-radius:4px;background:var(--red);display:inline-flex;align-items:center;justify-content:center}
    .rsg-ftr-ck svg{width:9px;height:9px;color:#fff}

    .rsg-ftr-social{display:flex;gap:10px}
    .rsg-ftr-social a{width:38px;height:38px;border-radius:9px;background:rgba(255,255,255,.06);border:1px solid var(--line);
      color:var(--ink);display:grid;place-items:center;transition:background .2s,transform .2s var(--ease),border-color .2s}
    .rsg-ftr-social a svg{width:17px;height:17px}
    .rsg-ftr-social a:hover{background:var(--red);border-color:var(--red);transform:translateY(-2px)}

    /* ---- service columns ---- */
    .rsg-ftr-col-title{font-size:12.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#fff;margin:0 0 6px}
    .rsg-ftr-col-title a{transition:color .18s}
    .rsg-ftr-col-title a:hover{color:var(--blue-2)}
    .rsg-ftr-col-rule{width:30px;height:3px;border-radius:3px;background:var(--red);margin-bottom:18px}
    .rsg-ftr-links li{margin:0 0 11px}
    .rsg-ftr-links a{position:relative;display:inline-block;font-size:13.5px;line-height:1.4;color:var(--muted);
      transition:color .18s var(--ease),transform .18s var(--ease)}
    .rsg-ftr-links a:hover{color:var(--blue-2);transform:translateX(3px)}

    /* ---- bottom bar ---- */
    .rsg-ftr-bottom{max-width:1220px;margin:0 auto;margin-top:44px;padding:26px 28px 40px;border-top:1px solid var(--line);text-align:center}
    .rsg-ftr-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-bottom:20px}
    .rsg-ftr-nav a{font-size:13.5px;font-weight:600;color:var(--ink);transition:color .18s}
    .rsg-ftr-nav a:hover{color:var(--blue-2)}
    .rsg-ftr-tag{font-size:12.5px;font-weight:600;letter-spacing:.03em;color:var(--gold);margin:0 0 8px}
    .rsg-ftr-copy{font-size:12px;color:var(--muted-2);margin:0}
    .rsg-ftr-copy a{color:var(--muted);font-weight:600}
    .rsg-ftr-copy a:hover{color:var(--blue-2)}

    /* ---- responsive ---- */
    @media (max-width:1024px){
      .rsg-ftr-main{padding:52px 26px 26px}
      .rsg-ftr-top{grid-template-columns:repeat(2,1fr);gap:36px 30px}
      .rsg-ftr-brand{max-width:none}
    }
    @media (max-width:767px){
      .rsg-ftr-top{grid-template-columns:1fr;gap:34px}
      .rsg-ftr-brand{text-align:left}
      .rsg-ftr-nav{gap:10px 18px}
      /* stacked service columns read better centered on a phone */
      .rsg-ftr-col{text-align:center}
      .rsg-ftr-col-rule{margin-left:auto;margin-right:auto}
      .rsg-ftr-links a:hover{transform:none} /* slide-right hover fights a centered list */
      .rsg-ftr-social{justify-content:center} /* flex row — needs justify, not text-align */
    }
    @media (max-width:480px){
      .rsg-ftr-main{padding:44px 20px 22px}
      .rsg-ftr-bottom{padding:24px 20px 34px}
      .rsg-ftr-phone b{font-size:20px}
    }

    /* ---- 2026-08-22 (r2) - BRAND COLUMN: left on desktop and tablet, centred on phones ----
       The first ask centred this block at every width; the follow-up is that it should
       read LEFT with the rest of the desktop footer and only centre on phones, where the
       service columns already centre. So the centring is scoped to the same <=767
       breakpoint those columns use, and desktop/tablet simply fall back to the sheet's
       own left-aligned originals - which were never deleted, only out-specified.
       .rsg-ftr-logo is inline-flex, i.e. inline-LEVEL, so text-align moves it.
       .rsg-ftr-social is a flex CONTAINER and needs justify-content; the <=767 block
       further up already centres it, and this (0,2,0) twin only makes the intent local.
       The only rule that HAS to win is that block's .rsg-ftr-brand{text-align:left}.
       The description gets a measure and auto margins only here, because this is the
       one breakpoint where the brand column runs the full width of the footer. */
    @media (max-width:767px){
      .rsg-inm-ftr .rsg-ftr-brand{text-align:center}
      .rsg-inm-ftr .rsg-ftr-desc{max-width:58ch;margin-left:auto;margin-right:auto;text-wrap:pretty}
      .rsg-inm-ftr .rsg-ftr-social{justify-content:center}
    }
    @media (prefers-reduced-motion:reduce){ .rsg-inm-ftr *{transition:none!important} }
  
/* italic crutch removed 2026-08-20: heading accent words are span elements now; the accent colour and decoration selectors were re-pointed from em to span in the same round. */
  
/* =====================================================================
 * 2026-08-29 — LAYOUT FOR THE NOTION-DOC FOOTER (structure round).
 * COLOUR IS OUT OF SCOPE and nothing here introduces one: --red, --ink,
 * --muted-2, --ease and #fff are all already used by this sheet above.
 * The grid is ONE ROW of FOUR columns (client, 2026-08-29: "make it only one
 * row and 4 column" — it was briefly the doc screenshot's 2x2). Brand keeps the
 * sheet's own 1.7fr : 1fr ratio from the 5-across original; the rest is spacing for
 * the blocks the doc adds (address, hours, call button, area groups, proof).
 * ===================================================================== */
.rsg-inm-ftr .rsg-ftr-line b{font-weight:700;color:var(--ink)}
.rsg-inm-ftr .rsg-ftr-line--stack{flex-direction:column;gap:3px}
.rsg-inm-ftr .rsg-ftr-line--dim{color:var(--muted-2)}
.rsg-inm-ftr .rsg-ftr-links li > span{display:inline-block;font-size:13.5px;line-height:1.4}
.rsg-inm-ftr .rsg-ftr-proof{margin-top:20px;margin-bottom:0}
.rsg-inm-ftr .rsg-ftr-call{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:10px;background:var(--red);color:#fff;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums lining-nums;box-shadow:0 12px 26px -14px rgba(170,24,44,.75);transform-origin:center;transition:transform .2s var(--ease)}
.rsg-inm-ftr .rsg-ftr-call:hover{transform:scale(1.05)}
@media (max-width:767px){.rsg-inm-ftr .rsg-ftr-col{text-align:left}.rsg-inm-ftr .rsg-ftr-col-rule{margin-left:0;margin-right:0}.rsg-inm-ftr .rsg-ftr-links a:hover{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){.rsg-inm-ftr .rsg-ftr-call:hover{transform:none}}

/* 2026-09-11 KELLIE LAUNCH REVIEW - footer logo = white-keyline mascot + white wordmark (media 553); site-wide floating Call Now pill */
.rsg-inm-ftr .rsg-ftr-logo-img{height:84px}
.rsg-fab-call{position:fixed;right:22px;bottom:22px;z-index:70;display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 26px 0 22px;border-radius:999px;background:var(--red,#AA182C);color:#fff;font-family:var(--font-heading,inherit);font-weight:800;font-size:16px;letter-spacing:.01em;line-height:1;text-decoration:none;box-shadow:0 16px 34px -14px rgba(170,24,44,.75),0 3px 10px rgba(8,25,42,.22);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.rsg-fab-call svg{width:18px;height:18px;fill:currentColor;flex:none}
.rsg-fab-call:hover{transform:translateY(-2px);background:#911426;box-shadow:0 20px 38px -14px rgba(170,24,44,.8),0 4px 12px rgba(8,25,42,.26);color:#fff}
.rsg-fab-call:focus-visible{outline:3px solid #fff;outline-offset:3px}
html.rsg-bk-lock .rsg-fab-call{display:none}
@media (max-width:767px){
  .rsg-fab-call{right:16px;bottom:16px;min-height:52px;padding:0 20px 0 18px;font-size:15px}
  body:has(.hp-mobar) .rsg-fab-call{display:none}
}
@media (prefers-reduced-motion:reduce){.rsg-fab-call{transition:none}.rsg-fab-call:hover{transform:none}}