/* PlumbingBO - single stylesheet, mobile-first.

   Design language: technical and hard-edged. Deep blueprint blue as the whole
   structure, with ONE accent - a safety lime - used the way a marker pen is
   used: sparingly, to mark the thing that matters. Numbered sections in a
   monospaced face, 4px corners, thick left rules on cards, no gradients.

   Deliberately unlike the five sibling client sites:
     San Diego   - royal blue + amber, rounded cards, photography, Inter
     Manhattan   - near-black + signal red + bone, Archivo, 2px squares
     Brooklyn N  - pine + clay on warm paper, slab serif, hairlines
     Harlem      - indigo + brass, bordered tiles, sticky sidebar
     Brooklyn S  - navy/azure/cyan GRADIENTS, 14px radii, pill buttons

   The two that also use blue are separated on purpose: San Diego pairs blue
   with amber on rounded photographic cards, Brooklyn South builds everything
   out of gradient fields and pills. This one has no gradient anywhere, no
   radius above 4px, and a lime accent neither of them touches.

   Color roles:
     BLUE  = interactive and structural. Links, buttons, rules, dark fields.
     LIME  = accent ONLY. Numerals, highlight marks, icon dots, the big CTA.
             Never body text on white - it is a dark-ground color here.
     STEEL = alternating sections and card grounds.

   Every pair is verified by site-src/plumbingbo/contrast.js, which reads the
   tokens in this block directly. Re-run it after changing any color. */

:root{
  /* Deep fields */
  --ink:#08182A;         /* darkest ground, headings */
  --navy:#0E2B47;        /* raised panel on dark */
  --navy-2:#1E3F62;      /* border on dark */

  /* Interactive - blue */
  --blue:#1257C4;        /* 6.6:1 on white */
  --blue-dk:#0D4099;
  --blue-lt:#93C0FF;     /* 9.6:1 on ink */

  /* Accent - lime. Dark-ground only. */
  --lime:#C6F24E;        /* 13.9:1 on ink */
  --lime-2:#A8D62F;
  --lime-ink:#4E6B00;    /* 6.0:1 on white, for the rare lime-tinted text */
  --lime-wash:#F4FBDF;

  /* Light grounds */
  --white:#ffffff;
  --steel:#EFF3F7;       /* alternating section */
  --steel-2:#DDE5ED;

  /* Text */
  --body:#3B4956;        /* 9.1:1 on white */
  --muted:#57646F;       /* 5.9:1 on white */
  --on-dark:#CFDEEC;     /* 13.3:1 on ink */
  --dim:#93A9BF;         /* 7.4:1 on ink */

  --line:#E2E9F0;
  --line-2:#C4D1DD;

  --radius:4px;
  --radius-sm:3px;
  --max:1180px;

  --font:'Sora',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;

  --shadow-sm:0 1px 2px rgba(8,24,42,.06);
  --shadow:0 4px 16px rgba(8,24,42,.09);
  --shadow-lg:0 18px 44px rgba(8,24,42,.18);
}

*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;font-family:var(--font);color:var(--ink);background:var(--white);
  line-height:1.66;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  padding-bottom:64px;
}
@media(min-width:900px){body{padding-bottom:0}}

img,svg{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none;transition:color .15s}
a:hover{color:var(--blue-dk);text-decoration:underline}
ul,ol{padding-left:1.15rem}
li{margin-bottom:.35rem}

h1,h2,h3,h4{color:var(--ink);margin:0 0 .7rem;font-weight:700;line-height:1.18;letter-spacing:-.022em}
h1{font-size:clamp(2rem,5vw,3.35rem);line-height:1.05;letter-spacing:-.033em;font-weight:800}
h2{font-size:clamp(1.55rem,3.2vw,2.3rem);letter-spacing:-.028em;font-weight:700}
h3{font-size:1.14rem;font-weight:700;letter-spacing:-.014em}
h4{font-size:.98rem;font-weight:700}
p{margin:0 0 1.05rem;color:var(--body)}
strong{font-weight:700;color:var(--ink)}

.container{max-width:var(--max);margin:0 auto;padding:0 1.25rem}

/* Monospaced micro-label. Used for kickers, numerals and spec labels; it is
   what gives the site its technical register. */
.kicker{
  display:block;font-family:var(--mono);font-size:.7rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin:0 0 .45rem;
}
.kicker-lime{color:var(--lime)}

/* Emphasis inside a heading. One phrase per page, never more.
   This started as a marker-pen highlight drawn with a background gradient.
   On a heading that wraps it rendered as a dull band across two lines and read
   as a redaction rather than a highlight, so the emphasis is carried by color
   instead - which survives any line break. Lime on ink is 13.8:1. */
.hl{color:var(--lime)}

.skip-link{position:absolute;left:-9999px;padding:.6rem 1rem;background:var(--blue);color:#fff;z-index:9999;font-weight:700;border-radius:var(--radius-sm)}
.skip-link:focus{left:1rem;top:1rem}
#main:focus{outline:none;scroll-margin-top:5rem}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* ---------------------------------------------------------------------------
   Header
   --------------------------------------------------------------------------- */
.site-header{position:sticky;top:0;z-index:60;background:var(--white);border-bottom:2px solid var(--ink)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:var(--max);margin:0 auto;padding:.7rem 1.25rem}
.brand{display:flex;align-items:center;gap:.65rem;color:var(--ink)}
.brand:hover{color:var(--ink);text-decoration:none}
.brand-mark{
  width:40px;height:40px;flex-shrink:0;background:var(--ink);
  display:flex;align-items:center;justify-content:center;border-radius:var(--radius);
}
.brand-mark svg{width:24px;height:24px}
.brand-text{font-weight:800;font-size:1.02rem;line-height:1.1;letter-spacing:-.03em}
.brand-text small{display:block;font-family:var(--mono);color:var(--muted);font-weight:500;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;margin-top:.22rem}

.nav-toggle{background:var(--white);border:2px solid var(--ink);color:var(--ink);padding:.35rem .55rem;font-size:1.15rem;line-height:1;cursor:pointer;border-radius:var(--radius-sm);font-family:inherit}
.nav-toggle:hover{background:var(--steel)}

.nav{display:none}
.nav.open{display:block;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:2px solid var(--ink);box-shadow:var(--shadow)}
.nav ul{list-style:none;margin:0;padding:.4rem 1.25rem 1rem}
.nav li{margin:0}
.nav a{display:block;padding:.72rem 0;color:var(--ink);font-weight:600;border-bottom:1px solid var(--line);font-size:.97rem}
.nav a:hover{color:var(--blue);text-decoration:none}
.nav a[aria-current]{color:var(--blue)}
.nav .cta-call{
  margin-top:.9rem;background:var(--blue);color:#fff;text-align:center;
  padding:.8rem 1rem;border:none;border-radius:var(--radius-sm);font-weight:700;font-family:var(--mono);letter-spacing:.02em;
}
.nav .cta-call:hover{background:var(--blue-dk);color:#fff}

@media(min-width:960px){
  .nav-toggle{display:none}
  .nav,.nav.open{display:block;position:static;background:transparent;border:none;box-shadow:none}
  .nav ul{display:flex;align-items:center;gap:.1rem;padding:0}
  .nav a{border:none;padding:.5rem .72rem;font-size:.9rem;font-weight:600;border-radius:var(--radius-sm)}
  .nav a:hover{background:var(--steel);color:var(--blue)}
  .nav a[aria-current]{background:var(--steel);color:var(--blue)}
  .nav .cta-call{margin:0 0 0 .55rem;padding:.6rem 1.05rem;font-size:.86rem}
}

/* ---------------------------------------------------------------------------
   Hero - flat ink field, oversized type, lime rule. No gradient, no photo.
   --------------------------------------------------------------------------- */
.hero{position:relative;overflow:hidden;background:var(--ink);color:#fff;padding:2.8rem 0 0}
@media(min-width:960px){.hero{padding:4rem 0 0}}
/* Faint blueprint grid, drawn in CSS so it costs no request. */
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(147,192,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(147,192,255,.07) 1px,transparent 1px);
  background-size:48px 48px;
}
.hero-inner{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 1.25rem}
.hero-grid{display:grid;gap:2rem;grid-template-columns:1fr;align-items:start}
@media(min-width:960px){.hero-grid{grid-template-columns:1.12fr .88fr;gap:3.2rem;align-items:center}}
.hero h1{color:#fff;margin-bottom:1rem}
.hero .lede{font-size:1.06rem;color:var(--on-dark);max-width:38rem;margin-bottom:1.6rem}
@media(min-width:960px){.hero .lede{font-size:1.14rem}}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.8rem}

/* Rating line. VISIBLE TEXT ONLY - never mirrored into schema. */
.rating-line{display:flex;align-items:center;gap:.6rem;font-size:.9rem;color:var(--on-dark);margin-bottom:1.8rem;flex-wrap:wrap}
.rating-stars{color:var(--lime);letter-spacing:.1em;font-size:1rem}
.rating-line b{color:#fff;font-weight:700}
/* The same block on a LIGHT ground (the about page). Without this the rating
   inherited the dark-ground colors and rendered near-white on white, which is
   how it shipped the first time. Lime is a dark-ground color and cannot be
   used for the stars here, so they take the blue. */
.rating-line-light{color:var(--body)}
.rating-line-light .rating-stars{color:var(--blue)}
.rating-line-light b{color:var(--ink)}

/* Spec panel on the right of the hero. */
.hero-panel{background:var(--navy);border:1px solid var(--navy-2);border-radius:var(--radius);padding:1.4rem}
.hero-panel h2{color:#fff;font-size:1.05rem;margin-bottom:1rem}
.spec-rows{display:grid;gap:0;margin:0;padding:0;list-style:none}
.spec-rows li{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--navy-2);margin:0;font-size:.9rem}
.spec-rows li:last-child{border-bottom:none}
.spec-rows dt,.spec-rows .k{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.spec-rows .v{color:#fff;font-weight:600;text-align:right}

/* Stat rail sitting across the bottom of the hero. */
.hero-rail{position:relative;z-index:1;border-top:1px solid var(--navy-2);margin-top:2.4rem}
.hero-rail-inner{max-width:var(--max);margin:0 auto;padding:0 1.25rem;display:grid;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.hero-rail-inner{grid-template-columns:repeat(4,1fr)}}
.rail-item{padding:1.2rem 0;border-right:1px solid var(--navy-2)}
.rail-item:last-child{border-right:none}
@media(max-width:759px){.rail-item:nth-child(2n){border-right:none}.rail-item:nth-child(-n+2){border-bottom:1px solid var(--navy-2)}}
.rail-item .n{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--lime);line-height:1;display:block;margin-bottom:.3rem}
.rail-item .t{font-size:.82rem;color:var(--dim);display:block;padding-right:1rem}

/* ---------------------------------------------------------------------------
   Buttons
   --------------------------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.82rem 1.4rem;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;
  border:2px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s;
  text-decoration:none;line-height:1.2;font-family:var(--font);
}
.btn:hover{text-decoration:none}
.btn svg{width:18px;height:18px;flex-shrink:0}
.btn-lg{padding:.95rem 1.7rem;font-size:1rem}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dk);color:#fff}
.btn-lime{background:var(--lime);color:var(--ink)}
.btn-lime:hover{background:var(--lime-2);color:var(--ink)}
.btn-outline{background:transparent;color:#fff;border-color:var(--navy-2)}
.btn-outline:hover{background:var(--navy);color:#fff;border-color:var(--blue-lt)}
.btn-ghost{background:transparent;color:var(--blue);border-color:var(--line-2)}
.btn-ghost:hover{background:var(--steel);color:var(--blue-dk)}

/* ---------------------------------------------------------------------------
   Sections
   --------------------------------------------------------------------------- */
section{padding:3rem 0}
@media(min-width:900px){section{padding:4.2rem 0}}
.sec-steel{background:var(--steel)}
.sec-ink{background:var(--ink);color:var(--on-dark)}
.sec-ink h2,.sec-ink h3{color:#fff}
.sec-ink p{color:var(--on-dark)}
.sec-ink a{color:var(--blue-lt)}

/* Numbered section heading - the site's signature. */
.sec-head{display:flex;gap:1rem;align-items:flex-start;margin-bottom:2rem;max-width:52rem}
.sec-num{
  font-family:var(--mono);font-size:.82rem;font-weight:700;color:var(--blue);
  border:2px solid var(--line-2);border-radius:var(--radius-sm);
  padding:.3rem .5rem;flex-shrink:0;line-height:1;margin-top:.35rem;
}
.sec-ink .sec-num{color:var(--lime);border-color:var(--navy-2)}
.sec-intro{margin:.5rem 0 0;font-size:1.02rem}

/* ---------------------------------------------------------------------------
   Cards - flat, 4px, with a thick left rule that turns lime on hover
   --------------------------------------------------------------------------- */
.grid{display:grid;gap:1rem}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr}
@media(min-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}

.card{
  background:var(--white);border:1px solid var(--line);border-left:4px solid var(--blue);
  border-radius:var(--radius);padding:1.3rem 1.3rem 1.2rem;
  transition:border-left-color .15s,box-shadow .15s,transform .15s;
}
a.card{display:block;color:inherit}
a.card:hover{text-decoration:none;border-left-color:var(--lime-2);box-shadow:var(--shadow);transform:translateY(-2px)}
a.card:hover h3{color:var(--blue)}
.card h3{margin-bottom:.4rem}
.card p{margin-bottom:0;font-size:.93rem;color:var(--muted)}
.sec-steel .card{border-color:var(--steel-2);border-left-color:var(--blue)}

.card-icon{
  width:40px;height:40px;border-radius:var(--radius-sm);background:var(--ink);color:var(--lime);
  display:flex;align-items:center;justify-content:center;margin-bottom:.85rem;
}
.card-icon svg{width:21px;height:21px}
a.card:hover .card-icon{background:var(--blue);color:#fff}

.card-more{display:inline-block;margin-top:.75rem;font-family:var(--mono);font-size:.74rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}

/* Plain bordered tile, used where an icon would be noise */
.tile{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem}
.sec-steel .tile{border-color:var(--steel-2)}
.tile h3{font-size:1.02rem}
.tile p:last-child{margin-bottom:0}

/* Numbered step list */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:1rem}
@media(min-width:760px){.steps{grid-template-columns:repeat(2,1fr)}}
.steps li{display:flex;gap:.9rem;margin:0;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem}
.sec-steel .steps li{border-color:var(--steel-2)}
.steps .n{font-family:var(--mono);font-weight:700;color:var(--blue);font-size:.85rem;flex-shrink:0;padding-top:.15rem}
.steps h3{font-size:1rem;margin-bottom:.25rem}
.steps p{margin:0;font-size:.92rem;color:var(--muted)}

/* Checklist with lime ticks */
.ticks{list-style:none;padding:0;margin:0 0 1.1rem}
.ticks li{position:relative;padding-left:1.6rem;margin-bottom:.5rem;color:var(--body)}
.ticks li::before{
  content:"";position:absolute;left:0;top:.52em;width:9px;height:5px;
  border-left:2.5px solid var(--lime-2);border-bottom:2.5px solid var(--lime-2);
  transform:rotate(-45deg);
}
.sec-ink .ticks li{color:var(--on-dark)}
.sec-ink .ticks li::before{border-color:var(--lime)}

/* Warning / note callout */
.note{
  border:1px solid var(--line-2);border-left:4px solid var(--ink);background:var(--steel);
  border-radius:var(--radius);padding:1.1rem 1.2rem;margin:1.4rem 0;
}
.note p:last-child{margin-bottom:0}
.note strong{display:block;margin-bottom:.25rem}

/* ---------------------------------------------------------------------------
   Page header
   --------------------------------------------------------------------------- */
.page-header{background:var(--ink);color:#fff;padding:2.2rem 0 2.4rem;position:relative;overflow:hidden}
@media(min-width:900px){.page-header{padding:3.2rem 0 3.4rem}}
.page-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--lime)}
.page-header h1{color:#fff;margin-bottom:.7rem;max-width:26ch}
.page-header .lede{color:var(--on-dark);font-size:1.05rem;max-width:44rem;margin:0}
.breadcrumbs{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:1rem}
.breadcrumbs a{color:var(--dim)}
.breadcrumbs a:hover{color:var(--lime)}
.breadcrumbs span{margin:0 .45rem;color:var(--navy-2)}

/* ---------------------------------------------------------------------------
   Prose (service + area body copy)
   --------------------------------------------------------------------------- */
.prose{max-width:46rem}
.prose h2{margin-top:2.4rem;padding-top:1.4rem;border-top:2px solid var(--ink)}
.prose h2:first-child{margin-top:0;padding-top:0;border-top:none}
.prose h3{margin-top:1.6rem;color:var(--ink)}
.prose ul,.prose ol{margin-bottom:1.1rem}
.prose li{color:var(--body)}
.prose-wide{max-width:58rem}

.layout{display:grid;gap:2.2rem;grid-template-columns:1fr}
@media(min-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 300px;gap:3rem;align-items:start}}
.aside{display:grid;gap:1rem}
@media(min-width:1000px){.aside{position:sticky;top:5.5rem}}
.aside-box{border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem}
.aside-box.dark{background:var(--ink);border-color:var(--ink)}
.aside-box.dark h3{color:#fff}
.aside-box.dark p{color:var(--on-dark);font-size:.92rem}
.aside-box h3{font-size:1rem}
.aside-list{list-style:none;padding:0;margin:0}
.aside-list li{margin:0;border-bottom:1px solid var(--line)}
.aside-list li:last-child{border-bottom:none}
.aside-list a{display:block;padding:.6rem 0;font-size:.92rem;font-weight:600;color:var(--ink)}
.aside-list a:hover{color:var(--blue);text-decoration:none}

/* Spec table */
.table-wrap{overflow-x:auto;margin:1.3rem 0}
table.spec{width:100%;border-collapse:collapse;font-size:.93rem;border:1px solid var(--line)}
table.spec th,table.spec td{padding:.8rem .9rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
table.spec tr:last-child th,table.spec tr:last-child td{border-bottom:none}
table.spec th{background:var(--steel);font-weight:700;color:var(--ink);white-space:nowrap;width:1%;border-right:1px solid var(--line)}
table.spec td{color:var(--body)}

/* ---------------------------------------------------------------------------
   Statement band
   --------------------------------------------------------------------------- */
.statement{background:var(--ink);color:#fff;padding:2.6rem 0}
@media(min-width:900px){.statement{padding:3.4rem 0}}
.statement p{font-size:1.2rem;font-weight:600;color:#fff;max-width:46rem;margin:0;line-height:1.5;letter-spacing:-.015em}
@media(min-width:900px){.statement p{font-size:1.45rem}}

/* ---------------------------------------------------------------------------
   FAQ
   --------------------------------------------------------------------------- */
.faq-group{margin-bottom:2.4rem}
.faq-group>h2{padding-top:1.3rem;border-top:2px solid var(--ink);margin-bottom:1.2rem}
.faq-item{border:1px solid var(--line);border-left:4px solid var(--line-2);border-radius:var(--radius);padding:1.1rem 1.2rem;margin-bottom:.8rem;background:var(--white)}
.faq-item:hover{border-left-color:var(--lime-2)}
.faq-question{font-size:1.02rem;font-weight:700;margin:0 0 .45rem;color:var(--ink)}
.faq-answer{color:var(--body);font-size:.95rem}
.faq-answer p:last-child{margin-bottom:0}

/* ---------------------------------------------------------------------------
   CTA strip
   --------------------------------------------------------------------------- */
.cta-strip{background:var(--blue);color:#fff;padding:2.4rem 0}
@media(min-width:900px){.cta-strip{padding:3rem 0}}
.cta-inner{display:flex;flex-direction:column;gap:1.3rem;align-items:flex-start}
@media(min-width:860px){.cta-inner{flex-direction:row;align-items:center;justify-content:space-between;gap:2rem}}
.cta-strip h2{color:#fff;margin-bottom:.35rem}
.cta-strip p{color:#E4EEFC;margin:0;max-width:44rem}

/* ---------------------------------------------------------------------------
   Contact
   --------------------------------------------------------------------------- */
.contact-grid{display:grid;gap:1.6rem;grid-template-columns:1fr}
@media(min-width:860px){.contact-grid{grid-template-columns:1fr 1fr;gap:2.4rem}}
.contact-box{border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem}
.contact-box address{font-style:normal;color:var(--body);line-height:1.8}
.map-frame{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;line-height:0}
.map-frame iframe{width:100%;height:340px;border:0;display:block}

/* ---------------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------------- */
.site-footer{background:var(--ink);color:var(--on-dark);padding:2.8rem 0 1.4rem;border-top:4px solid var(--lime)}
.footer-grid{display:grid;gap:1.8rem;grid-template-columns:1fr}
@media(min-width:680px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.footer-grid{grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.2rem}}
.footer-col{min-width:0}
.site-footer h4{color:#fff;font-size:.78rem;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.9rem;font-weight:600}
.footer-brand h4{font-family:var(--font);font-size:1.15rem;letter-spacing:-.03em;text-transform:none;font-weight:800}
.site-footer p{color:var(--dim);font-size:.9rem}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.45rem}
.site-footer a{color:var(--on-dark);font-size:.9rem}
.site-footer a:hover{color:var(--lime);text-decoration:none}
.site-footer address{font-style:normal;color:var(--dim);font-size:.9rem;line-height:1.8;margin-top:.9rem}
.footer-bottom{
  display:flex;flex-direction:column;gap:.5rem;margin-top:2.2rem;padding-top:1.2rem;
  border-top:1px solid var(--navy-2);font-size:.82rem;color:var(--dim);
}
@media(min-width:680px){.footer-bottom{flex-direction:row;justify-content:space-between;align-items:center}}

/* ---------------------------------------------------------------------------
   Sticky mobile call bar
   --------------------------------------------------------------------------- */
.callbar{
  position:fixed;bottom:0;left:0;right:0;z-index:70;display:grid;grid-template-columns:1.6fr 1fr;
  border-top:2px solid var(--ink);background:var(--white);
}
.callbar a{
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  padding:.95rem .5rem;font-weight:700;font-size:.93rem;text-decoration:none;
}
.callbar a:hover{text-decoration:none}
.callbar svg{width:17px;height:17px}
.cb-primary{background:var(--blue);color:#fff}
.cb-primary:hover{background:var(--blue-dk);color:#fff}
.cb-secondary{background:var(--white);color:var(--ink);border-left:1px solid var(--line)}
.cb-secondary:hover{background:var(--steel);color:var(--ink)}
@media(min-width:900px){.callbar{display:none}}

/* ---------------------------------------------------------------------------
   Utility
   --------------------------------------------------------------------------- */
.lede{font-size:1.05rem;color:var(--body)}
.small{font-size:.88rem}

/* Area/service index columns */
.index-cols{columns:1;column-gap:2rem}
@media(min-width:640px){.index-cols{columns:2}}
@media(min-width:960px){.index-cols{columns:3}}
.index-cols a{display:block;padding:.5rem 0;border-bottom:1px solid var(--line);break-inside:avoid;font-weight:600;color:var(--ink);font-size:.94rem}
.index-cols a:hover{color:var(--blue);text-decoration:none}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
