:root{--brand-dark:#163A5F;--brand-light:#F0F4F8;--brand-accent:#E07A1F;--brand-text:#15212E;--brand-highlight:#EF7D22;--brand-highlight-ink:#111111;--brand-font-heading:"Roboto Slab", "Rockwell", Georgia, serif;--brand-font-body:"Trebuchet MS", "Gill Sans", Verdana, sans-serif}
:root{--fig-section-max:600px;--logo-h-phone:55px;--logo-h-desktop:56px}
/* site.css — the one stylesheet every cluster site renders through.
   The renderer prepends a :root block carrying the brand tokens from Config/brand-tokens.md for the site's palette
   (dark, light, accent, text, highlight, highlight ink) and font stacks, --fig-section-max from STUDIO_SIZES_SECTION, and the
   header logo's two heights, --logo-h-phone and --logo-h-desktop, from image-manifest.json brand{}.header_height (R-519).
   The only literal colors below are the neutral set declared here — page ground, rules, muted text — which are not brand
   colors and never vary by site; every shade is derived from the tokens by color-mix. No script, no web font. */
:root{--neutral-ground:#ffffff;--neutral-rule:#e3e6ea;--neutral-rule-soft:#eef0f2;--neutral-rule-strong:#d9dde2;--neutral-border:#b9c0c8;--neutral-muted:#555555;--neutral-muted-2:#444444;--neutral-muted-3:#777777;--neutral-ink:#111111;--neutral-shadow:rgba(0,0,0,.15);
  --shade-dark:color-mix(in srgb,var(--brand-dark) 82%,var(--neutral-ink));
  --band-pad:clamp(2.25rem,5vw,4rem);--radius:.7rem;--measure:48rem;--lift:0 2px 14px color-mix(in srgb,var(--neutral-ink) 12%,transparent)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:9rem}
body{margin:0;font-family:var(--brand-font-body);font-size:1.0625rem;line-height:1.6;color:var(--brand-text);background:var(--neutral-ground)}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--brand-dark)}
a:hover,a:focus{text-decoration-thickness:2px}
h1,h2,h3{font-family:var(--brand-font-heading);line-height:1.15;color:var(--brand-dark);margin:0 0 .55em;font-weight:800;letter-spacing:-.01em}
h1{font-size:clamp(2rem,5vw,3.25rem)}
h2{font-size:clamp(1.5rem,3.2vw,2.25rem)}
h3{font-size:1.2rem}
p,ul,ol,table{margin:0 0 1em}
ul,ol{padding-left:1.25em}
table{border-collapse:collapse;width:100%;font-size:.95em}
th,td{border:1px solid var(--neutral-rule-strong);padding:.5em .6em;text-align:left;vertical-align:top}
th{background:var(--brand-light)}
.wrap{width:min(100% - 2rem,74rem);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--brand-dark);color:var(--neutral-ground);padding:.5em 1em}
.skip:focus{left:0;z-index:100}
.hl{color:var(--brand-highlight)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;padding:.8em 1.3em;border-radius:.5em;font-weight:800;text-decoration:none;border:2px solid transparent;line-height:1.15;font-size:1.05rem;cursor:pointer;font-family:inherit}
.btn-primary{background:var(--brand-accent);color:var(--neutral-ink);border-color:var(--brand-accent)}
.btn-secondary{background:transparent;color:var(--brand-dark);border-color:var(--brand-dark)}
.btn-quote{background:var(--brand-highlight);color:var(--brand-highlight-ink);border-color:var(--brand-highlight)}
.btn-hero-call{background:transparent;color:var(--neutral-ground);border-color:var(--neutral-ground);font-size:1.15rem;padding:.9em 1.5em}
.btn-block{display:flex;width:100%}
.btn:focus-visible{outline:3px solid var(--brand-highlight);outline-offset:2px}

/* header — sticky on every page: the strip, then the logo, the navigation, the number and FREE QUOTE.
   The number is the largest text in the header; the logo image is exempt (R-508, R-518). The logo is drawn at
   --logo-h-phone and --logo-h-desktop, which the renderer sets per site so the name's capitals render at least
   LOGO_NAME_CAP_MIN tall (R-519). On phones the navigation sits behind the native <details> menu;
   at 1000 px and wider ::details-content keeps it open in the row, and the two groups open on hover or focus. */
.site-header{position:sticky;top:0;z-index:40;background:var(--neutral-ground);box-shadow:var(--lift)}
.topstrip{background:var(--shade-dark);color:var(--neutral-ground);font-size:.8125rem;font-weight:600;line-height:1.3}
.topstrip p{margin:0;padding:.4rem 0;text-align:center}
.header-row{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-areas:"logo menu" "tel quote";align-items:center;gap:.45rem .75rem;padding:.5rem 0}
.site-logo{grid-area:logo;min-width:0;display:block;line-height:0}
.site-logo img{height:var(--logo-h-phone,40px);width:auto;max-width:none}
.nav-toggle{grid-area:menu;justify-self:end}
.nav-toggle>summary{cursor:pointer;list-style:none;padding:.4em .8em;border:1px solid var(--brand-dark);border-radius:.45em;color:var(--brand-dark);font-weight:700;font-size:.95rem}
.nav-toggle>summary::-webkit-details-marker{display:none}
.nav-toggle[open]>.nav{position:absolute;left:0;right:0;top:100%;background:var(--neutral-ground);border-top:1px solid var(--neutral-rule);box-shadow:var(--lift);padding:.5rem 1rem 1rem;max-height:70vh;overflow:auto;z-index:45}
.nav ul{list-style:none;padding:0;margin:0}
.nav a,.nav-group-label{display:block;padding:.5em .6em;text-decoration:none;border-radius:.35em;color:var(--brand-text);font-weight:600;font-size:1rem}
.nav-group-label a{padding:0;display:inline}
.nav-group-label{color:var(--brand-dark)}
.nav-sub{padding-left:.9rem!important}
.nav a[aria-current=page],.nav a:hover{background:var(--brand-light)}
.header-tel{grid-area:tel;font-size:1.15rem;font-weight:800;color:var(--brand-dark);text-decoration:none;white-space:nowrap}
.header-quote{grid-area:quote;justify-self:end;font-size:.95rem;padding:.6em 1em;letter-spacing:.02em}
@media (min-width:1000px){
  .topstrip p{text-align:left}
  .header-row{grid-template-columns:auto 1fr auto auto;grid-template-areas:"logo nav tel quote";gap:1.25rem;padding:.7rem 0}
  .site-logo img{height:var(--logo-h-desktop,56px)}
  .nav-toggle{grid-area:nav;justify-self:center}
  .header-tel{font-size:1.375rem}
  .header-quote{font-size:1rem;padding:.75em 1.3em}
  @supports selector(::details-content){
    .nav-toggle>summary{display:none}
    .nav-toggle::details-content{display:contents}
    .nav-toggle>.nav{position:static!important;box-shadow:none!important;border:0!important;padding:0!important;max-height:none!important;overflow:visible!important}
    .nav>ul{display:flex;gap:.15rem;align-items:center}
    .nav>ul>li>a,.nav-group-label{white-space:nowrap}
    .nav-group{position:relative}
    .nav-group-label::after{content:"";display:inline-block;margin-left:.4em;width:.4em;height:.4em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-.2em) rotate(45deg)}
    .nav-sub{display:none;position:absolute;top:100%;left:0;min-width:17rem;background:var(--neutral-ground);border:1px solid var(--neutral-rule);border-radius:var(--radius);box-shadow:var(--lift);padding:.4rem!important;z-index:45}
    .nav-group:hover>.nav-sub,.nav-group:focus-within>.nav-sub{display:block}
  }
}

/* hero — the hero <img> is the band's backdrop and stays the LCP element (fetchpriority, preloaded, never lazy).
   Left: the H1 (service words in the highlight), the paragraph, "Call <number>". Right: the white quote card,
   which sits directly under the Call button on phones. */
.hero{position:relative;background:var(--shade-dark);color:var(--neutral-ground);isolation:isolate}
.hero-key .fig-hero{position:absolute;inset:0;margin:0;z-index:-1}
.hero-key .fig-hero img{width:100%;height:100%;object-fit:cover}
.hero-key .fig-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--shade-dark) 82%,transparent),color-mix(in srgb,var(--shade-dark) 92%,transparent))}
.hero-inner{display:grid;gap:1.75rem;padding:2rem 0 2.5rem;align-items:center}
.hero h1{color:var(--neutral-ground);margin-bottom:.45em}
.hero .bluf{font-size:1.1rem;max-width:36rem;color:var(--neutral-ground)}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.3rem 0 0}
.hero-card{background:var(--neutral-ground);color:var(--brand-text);border-radius:var(--radius);box-shadow:var(--lift);padding:1.4rem 1.25rem 1.5rem}
.hero-card .lead-form{max-width:none}
@media (min-width:1000px){
  .hero-inner{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:3rem;padding:3rem 0 3.5rem}
  .hero-key .fig-hero::after{background:linear-gradient(90deg,color-mix(in srgb,var(--shade-dark) 94%,transparent) 0%,color-mix(in srgb,var(--shade-dark) 84%,transparent) 60%,color-mix(in srgb,var(--shade-dark) 70%,transparent) 100%)}
  .hero-card{padding:1.75rem 2.75rem 2rem}
}
.hero-support{background:var(--brand-light);color:var(--brand-text);padding:2rem 0 1.5rem}
.hero-support h1{color:var(--brand-dark)}
.hero-support .bluf{color:var(--brand-text)}
.hero-support .tagline{font-style:italic}
.hero-support .fig{margin:1.25rem auto 0;width:min(100% - 2rem,74rem)}
.hero-support .fig img{width:100%;aspect-ratio:16/9;max-height:50vh;object-fit:cover;border-radius:var(--radius)}
.hero-article{background:var(--brand-light);color:var(--brand-text);padding:2rem 0 1.5rem}
.hero-article h1{color:var(--brand-dark)}
.hero-article .bluf{color:var(--brand-text)}
.hero-article .fig{margin:1.25rem auto 0;width:min(100% - 2rem,74rem)}

/* the quote form */
.lead-form{max-width:36rem}
.form-title{font-family:var(--brand-font-heading);font-weight:800;font-size:clamp(1.5rem,3vw,2rem);line-height:1.15;color:var(--neutral-ink);text-align:center;margin:0 0 1rem}
.field{margin:0 0 .9rem}
.field label{display:block;font-weight:600;margin-bottom:.35em;font-size:.95rem;color:var(--neutral-ink)}
.field input,.field textarea,.field select{width:100%;padding:.6em .75em;border:1px solid var(--neutral-border);border-radius:.3em;font:inherit;font-size:1rem;background:var(--neutral-ground);color:var(--neutral-ink)}
.field select{min-height:2.9em}
.field input:focus,.field textarea:focus,.field select:focus{outline:3px solid var(--brand-highlight);outline-offset:1px;border-color:var(--brand-dark)}
.field-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lead-form .btn-block{margin-top:1.25rem;font-size:1rem}

/* bands — every section is a full-width band; light and white alternate, never by a literal color */
.band{padding:var(--band-pad) 0}
.band-light{background:var(--brand-light)}
.band-white{background:var(--neutral-ground)}
.sec-inner{max-width:var(--measure)}
.sec-split{max-width:none;display:grid;gap:1.5rem;align-items:start}
@media (min-width:900px){.sec-split{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2.5rem}}
.sec-text>:last-child{margin-bottom:0}
.sec-group-grid{display:grid;gap:1rem}
@media (min-width:900px){.sec-group-grid{grid-template-columns:1fr 1fr;align-items:start}}
.sec-card{background:var(--neutral-ground);border:1px solid var(--neutral-rule);border-radius:var(--radius);padding:1.25rem 1.35rem;box-shadow:var(--lift)}
.sec-card h2{font-size:1.3rem}
.sec-card>:last-child{margin-bottom:0}

/* the AEO block keeps its four classes and its place first after the hero; the FAQ's dropdowns share its accordion style,
   every one closed on load */
.aeo-block{padding:var(--band-pad) 0;background:var(--neutral-ground)}
.aeo-list,.faq-list{display:grid;gap:.75rem}
.aeo-accordion,.faq-item{border:1px solid var(--neutral-rule-strong);border-left:5px solid var(--brand-dark);border-radius:var(--radius);padding:.35em 1.1em;background:var(--neutral-ground)}
.aeo-accordion summary,.faq-item summary{cursor:pointer;font-family:var(--brand-font-heading);font-weight:800;color:var(--brand-dark);font-size:1.08rem;padding:.55em 0}
.faq-item summary h3{display:inline;font-size:inherit;line-height:inherit;margin:0}
.aeo-answer,.faq-item p{margin:.2em 0 .9em}

/* lists inside record copy: SCRIBE's <ul> and <ol> carry no class, so the section styles them */
.sec ul:not(.cards):not(.article-index){list-style:none;padding:0;margin:1.1em 0 1.3em;display:grid;gap:.6rem}
.sec ul:not(.cards):not(.article-index)>li{position:relative;padding:.7em .9em .7em 2.6em;background:var(--neutral-ground);border:1px solid var(--neutral-rule);border-radius:.55rem}
.sec ul:not(.cards):not(.article-index)>li::before{content:"";position:absolute;left:1em;top:1.05em;width:.5em;height:.9em;border-right:3px solid var(--brand-highlight);border-bottom:3px solid var(--brand-highlight);transform:rotate(45deg)}
.sec ol{list-style:none;counter-reset:step;padding:0;margin:1.1em 0 1.3em;display:grid;gap:.7rem}
.sec ol>li{counter-increment:step;position:relative;padding:.75em 1em .75em 3.4em;background:var(--neutral-ground);border:1px solid var(--neutral-rule);border-radius:.55rem}
.sec ol>li::before{content:counter(step);position:absolute;left:.9em;top:.65em;width:1.8em;height:1.8em;border-radius:50%;background:var(--brand-dark);color:var(--neutral-ground);font-weight:800;display:grid;place-items:center;font-size:.95rem}
.sec strong{color:var(--brand-dark)}

/* figures and cards */
.fig{margin:0}
.fig-section{max-width:var(--fig-section-max)}
.fig-section img{border-radius:var(--radius);width:100%}
.cards{list-style:none;padding:0;margin:1.75rem 0 0;display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr))}
.card{border-radius:var(--radius);overflow:hidden;background:var(--neutral-ground);display:flex;flex-direction:column;box-shadow:var(--lift);border:1px solid var(--neutral-rule)}
.card .fig img{aspect-ratio:16/10;object-fit:cover;width:100%}
.card h3{margin:1rem 1.1rem .45rem}
.card h3 a{text-decoration:none}
.card p{margin:0 1.1rem 1.2rem;font-size:.98rem}
.sec-service-map iframe{width:100%;border:1px solid var(--neutral-rule);border-radius:.5em;display:block}
.tenant-quote{margin:1.25rem 0;padding:.75rem 0 .75rem 1.25rem;border-left:4px solid var(--brand-accent)}
.tenant-quote p{margin:0;font-size:1.1rem}
.tenant-quote cite{display:block;margin-top:.5em;font-style:normal;color:var(--neutral-muted);font-size:.95em}
.tenant-stats{list-style:none;padding:0;margin:1.25rem 0}
.tenant-stats li{padding:.35em 0;border-bottom:1px solid var(--neutral-rule-soft)}
.article-index{list-style:none;padding:0}
.article-index li{padding:1rem 0;border-bottom:1px solid var(--neutral-rule)}
.article-index p{margin:.25em 0 0;color:var(--neutral-muted-2)}
.article-meta{color:var(--neutral-muted);font-size:.95em}
.article-intro{margin-top:1.5rem}
.article-foot{margin-block:1.5rem}
.related{font-weight:700}

/* closing CTA band */
.cta-band{background:var(--shade-dark);color:var(--neutral-ground);padding:var(--band-pad) 0}
.cta-band h2,.cta-band p{color:var(--neutral-ground)}
.cta-band a:not(.btn){color:var(--neutral-ground)}
.cta-lead{font-size:1.1rem;max-width:44rem}
.cta-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.2rem 0 0}

/* breadcrumb */
.breadcrumb{font-size:.9em;margin:1rem 0}
.breadcrumb ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.35em}
.breadcrumb li+li::before{content:"›";margin-right:.35em;color:var(--neutral-muted-3)}

/* footer */
.site-footer{background:var(--brand-light);padding:2.5rem 0 2rem;font-size:.95em;border-top:1px solid var(--neutral-rule-strong)}
.footer-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}
.footer-name,.footer-heading{font-family:var(--brand-font-heading);font-weight:800;color:var(--brand-dark)}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{padding:.15em 0}
.footer-legal{margin-top:1.5rem;color:var(--neutral-muted);font-size:.88em;border-top:1px solid var(--neutral-rule-strong);padding-top:1rem}
.footer-legal p{margin:.3em 0}
.legal-notice{border-left:3px solid var(--brand-dark);padding:.5em 1em;background:var(--brand-light)}

/* desktop: one centered column. Every block sits centered with equal margins; section headings, the breadcrumb, the hero
   text and the CTA band are centered; paragraphs, lists and the dropdowns stay left-aligned at --measure. Phones keep
   the layout above. */
@media (min-width:900px){
  .sec-inner,.sec-static,.article-intro,.sec-conclusion,.article-foot,.sec-tenant-voice .wrap,.aeo-list,.faq-list{max-width:var(--measure);margin-inline:auto}
  .sec-inner.sec-split{max-width:none}
  .sec-text>h2,.sec-conclusion>h2,.faq h2{text-align:center}
  .breadcrumb ol{justify-content:center}
  .hero-copy,.hero-support .wrap,.hero-article .wrap,.cta-band .wrap{text-align:center}
  .hero .bluf,.hero-support .bluf,.hero-article .bluf,.cta-lead{max-width:var(--measure);margin-inline:auto}
  .hero-actions,.cta-actions{justify-content:center}
  .cards{grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr))}
  .sec-group-grid>.sec-card:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - .5rem)}
}

@media print{.site-header{position:static;box-shadow:none}.nav-toggle,.skip{display:none}}