/* ── DIVI NEUTRALISATION ───────────────────────────────────────────────────
   The theme ships its own editorial chrome, so Divi's header, top bar and
   wrapper padding are removed. The wrapper id is #lbep-page, NOT
   #page-container: Divi styles #page-container directly and reusing that id
   reintroduces the blank band above the header. Both ids are zeroed anyway so a
   Theme Builder layout cannot reintroduce it either. */
#lbep-page,#page-container{padding-top:0!important;margin-top:0!important}
#main-header,#top-header,#et-top-navigation,#et-secondary-menu,.et_slide_in_menu_container{display:none!important}
body.lbep #et-boc,body.lbep #et-main-area{padding-top:0!important;margin-top:0!important}
body.lbep .et_pb_section,body.lbep .et_pb_row{padding:0!important;margin:0!important;width:auto!important;max-width:none!important}
body.lbep{padding-top:0!important}
#lbep-main{display:block}
/* Long Beach Expert Painting: main stylesheet, carried from the static build.
   Design tokens live in the child style.css :root and are the single source of truth. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;background:var(--paper);color:var(--ink);font:400 var(--fs)/1.62 Overpass,system-ui,sans-serif;text-wrap:pretty}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.015em;line-height:1.14}
h1{font-size:clamp(27px,2.75vw,38px)}
h2{font-size:clamp(25px,2.55vw,35px);line-height:1.16}
h3{font-size:19.5px;font-weight:600;line-height:1.28;letter-spacing:-.005em}
h4{font-size:16.5px;font-weight:700}
p{margin:0 0 1em}
a{color:var(--brand);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--teal);text-decoration-color:var(--accent)}
ul,ol{margin:0 0 1em;padding-left:1.15em}
li{margin:0 0 .4em}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--pad)}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.kicker{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--brand);margin:0 0 .55em}
.secnum{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.16em;color:var(--accent);margin:0 0 .5em}

/* ── HEADER: one row, sticky, no utility bar ───────────────────────────── */
.site-head{position:sticky;top:0;z-index:60;background:var(--paper);border-bottom:1px solid var(--line)}
.head-in{max-width:var(--container);margin:0 auto;padding:0 var(--pad);min-height:84px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);flex:0 0 auto}
.brand img,.brand svg{width:clamp(180px,17vw,224px);height:auto}
.head-nav{flex:1 1 auto;display:flex;justify-content:center;align-items:center;gap:2px}
.head-cta{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:5px}
.navlink{position:relative;display:inline-flex;align-items:center;gap:5px;padding:11px 13px;font-size:15px;font-weight:600;color:var(--ink);text-decoration:none;border-radius:var(--r);white-space:nowrap}
.navlink:hover,.navlink[aria-expanded=true]{color:var(--brand);background:var(--brand-tint)}
.navlink .chev{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s}
.navlink[aria-expanded=true] .chev{transform:rotate(225deg) translateY(-2px)}
.hasmenu{position:relative}
.menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%);min-width:288px;background:var(--paper);border:1px solid var(--line);box-shadow:0 18px 44px -18px rgba(19,26,24,.3);padding:10px;display:none;z-index:70}
.menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.menu.open{display:block}
/* Hover-to-open is for real pointers only. On a touch screen this rule fires on
   tap and fights the click handler. */
@media (hover:hover) and (pointer:fine){.hasmenu:hover .menu{display:block}}
.menu--wide{min-width:560px;columns:2;column-gap:10px}
.menu a{display:block;padding:8px 12px;font-size:14.5px;font-weight:600;color:var(--ink);text-decoration:none;border-radius:var(--r);break-inside:avoid}
.menu a:hover{background:var(--brand-tint);color:var(--brand)}
.menu .menu-all{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;color:var(--brand);font-weight:700;column-span:all}
.phone-pill{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;background:var(--brand);color:#fff;font-size:16px;font-weight:800;letter-spacing:-.01em;text-decoration:none;border-radius:var(--r);white-space:nowrap}
.phone-pill:hover{background:var(--brand-dark);color:#fff}
.phone-pill svg{width:15px;height:15px;fill:#fff;flex:0 0 auto}
.cred{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft);text-align:center;line-height:1.4}
.navtoggle{display:none;position:relative;z-index:95;width:46px;height:42px;margin-left:auto;background:none;border:1px solid var(--line);border-radius:var(--r);cursor:pointer;padding:0}
.navtoggle span{display:block;width:20px;height:2px;margin:4px auto;background:var(--ink);transition:.2s}
.navtoggle[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.navtoggle[aria-expanded=true] span:nth-child(2){opacity:0}
.navtoggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav__scrim{display:none;position:fixed;inset:0;z-index:70;background:rgba(19,26,24,.45)}
.nav__scrim.open{display:block}

/* ── HERO ──────────────────────────────────────────────────────────────── */
.hero{position:relative;background:var(--ink);color:#fff;padding:clamp(26px,3vw,40px) 0;overflow:hidden}
.hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.82;filter:saturate(.95)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(14,31,49,.88) 0%,rgba(14,31,49,.72) 34%,rgba(14,31,49,.3) 68%,rgba(14,31,49,.12) 100%)}
.hero .container{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(24px,3vw,48px);align-items:start}
.hero h1{color:#fff;max-width:20ch}
.lede{margin:14px 0 0;max-width:66ch;font-size:15.5px;line-height:1.58;color:#E4E7E5}
.lede p{margin:0 0 .72em}
.lede p:last-child{margin-bottom:0}
.lede a{color:#fff;text-decoration-color:var(--accent)}
.lede a:hover{color:var(--accent)}
.btn-row--split{display:flex;gap:12px;margin-top:20px;max-width:520px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;font:800 15.5px/1 Overpass,sans-serif;letter-spacing:-.01em;border-radius:var(--r);text-decoration:none;border:2px solid transparent;cursor:pointer;text-align:center}
.btn--solid{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn--solid:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.btn--outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--outline:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn--dark:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-row--split .btn{flex:1 1 0;min-width:0}
.btn svg{width:14px;height:14px;fill:currentColor;flex:0 0 auto}

/* ── LEAD FORM CARD ────────────────────────────────────────────────────── */
.leadcard{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:var(--r);padding:20px;box-shadow:0 22px 54px -22px rgba(0,0,0,.5)}
.leadcard__title{font-size:20px;font-weight:800;text-align:center;letter-spacing:-.015em;margin:0 0 14px}
.leadcard .field{margin:0 0 10px}
.leadcard label{display:block;font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}
.leadcard input,.leadcard textarea{display:block;width:100%;padding:9px 11px;font:400 15px/1.4 Overpass,sans-serif;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.leadcard textarea{height:64px;min-height:64px;resize:vertical}
.leadcard input:focus,.leadcard textarea:focus{outline:2px solid var(--brand);outline-offset:0;border-color:var(--brand)}
.leadcard .btn{width:100%;margin-top:4px}
.leadcard__fine{margin:9px 0 0;font-size:12.5px;line-height:1.45;text-align:center;color:var(--ink-soft)}
.leadcard__fine a{font-weight:700}
.cta .leadcard{box-shadow:none}

/* ── TRUST STRIP ───────────────────────────────────────────────────────── */
.trust{background:var(--light);border-bottom:1px solid var(--line)}
.trust ul{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 26px;margin:0;padding:14px 0;list-style:none}
.trust li{display:flex;align-items:center;gap:8px;margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}
.trust li::before{content:"";flex:0 0 auto;width:7px;height:7px;background:var(--accent)}

/* ── REVIEWS CAROUSEL ──────────────────────────────────────────────────── */
.reviews{padding:clamp(38px,4.5vw,62px) 0 clamp(30px,3.5vw,48px);border-bottom:1px solid var(--line)}
.reviews__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 22px}
.rvarrows{display:flex;gap:8px;flex:0 0 auto}
.rvarrows button{width:42px;height:42px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);cursor:pointer;color:var(--ink)}
.rvarrows button:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.rvarrows svg{width:13px;height:13px;fill:currentColor;margin:0 auto}
.rvtrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 0 6px}
.rvtrack::-webkit-scrollbar{display:none}
.rvcard{flex:0 0 340px;scroll-snap-align:start;background:var(--light);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.stars{display:flex;gap:2px;margin:0 0 11px}
.stars svg{width:14px;height:14px;fill:var(--accent)}
.rvquote{margin:0 0 12px;font:italic 400 16px/1.5 "Zilla Slab",Georgia,serif;color:var(--ink)}
.rvmeta{margin:0;font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft)}

/* ── SECTIONS ──────────────────────────────────────────────────────────── */
.sec{padding:clamp(40px,4.6vw,66px) 0;border-bottom:1px solid var(--line)}
.sec--tint{background:var(--light)}
.sec__head{max-width:74ch}
.sec__head h2{margin-bottom:.5em}
.sec__lead{font-size:17px;line-height:1.6;color:var(--ink-soft);margin:0 0 1.1em}
.prose{max-width:74ch}
.prose h3{margin:1.7em 0 .5em}
.prose h4{margin:1.4em 0 .4em}
.cols2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,2.6vw,40px)}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,28px)}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px;margin:22px 0 0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:17px 18px}
.card--tint{background:var(--light)}
.card h3{font-size:17px;font-weight:700;margin:0 0 .35em}
.card h3 a{text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.card p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
.card--img{padding:0;overflow:hidden;display:flex;flex-direction:column}
.card--img .card__ph{display:block;line-height:0;overflow:hidden;background:var(--light)}
.card--img .card__ph img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .45s ease}
.card--img:hover .card__ph img{transform:scale(1.04)}
.card__body{padding:15px 17px 17px}
.card__body h3{margin:0 0 .35em}
.alsofor{margin:18px 0 0;font-size:14.5px;color:var(--ink-soft)}
.alsofor strong{color:var(--ink)}
.linkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 18px;margin:18px 0 0;padding:0;list-style:none}
.linkgrid li{margin:0;padding:7px 0;border-bottom:1px solid var(--line);font-size:15px;font-weight:600}
.linkgrid a{text-decoration:none}
.linkgrid a:hover{text-decoration:underline}
.ticks{list-style:none;padding:0;margin:14px 0 0}
.ticks li{position:relative;padding-left:24px;font-size:15.5px;color:var(--ink)}
.ticks li::before{content:"";position:absolute;left:2px;top:9px;width:9px;height:5px;border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
.steps{counter-reset:s;list-style:none;padding:0;margin:20px 0 0;display:grid;gap:16px}
.steps li{counter-increment:s;position:relative;padding-left:44px}
.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:1px;font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--accent)}
.steps h3{font-size:17px;font-weight:700;margin:0 0 .25em}
.steps p{margin:0;font-size:15px;color:var(--ink-soft)}

/* ── FIGURES + TABLES ──────────────────────────────────────────────────── */
figure{margin:0}
.fig{margin:24px 0 0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--light)}
.fig img{width:100%;aspect-ratio:3/2;object-fit:cover}
.fig figcaption{padding:10px 14px;font-size:13px;line-height:1.45;color:var(--ink-soft);border-top:1px solid var(--line)}
.fig--missing img{display:none}
.fig--missing figcaption{padding:34px 18px;font-weight:600;color:var(--ink)}
.tablewrap{margin:24px 0 0;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}
.ptable{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
.ptable caption{text-align:left;padding:13px 16px;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--line);background:var(--light)}
.ptable th,.ptable td{padding:11px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.ptable thead th{font-size:12.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--light)}
.ptable tbody tr:last-child th,.ptable tbody tr:last-child td{border-bottom:0}
.ptable tbody th{font-weight:700}

/* ── FAQ ───────────────────────────────────────────────────────────────── */
.faq{max-width:82ch;margin:22px 0 0;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:15px 40px 15px 0;position:relative;font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:22px;width:9px;height:9px;border-right:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(45deg);transition:transform .18s}
.faq details[open] summary::after{transform:rotate(225deg)}
.faq details > div{padding:0 0 16px;max-width:74ch}
.faq details p:last-child{margin-bottom:0}

/* ── CTA BAND ──────────────────────────────────────────────────────────── */
.cta{background:var(--ink);color:#fff;padding:clamp(40px,4.4vw,64px) 0}
.cta h2{color:#fff;max-width:22ch}
.cta__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(24px,3vw,48px);align-items:start}
.cta p{color:#E4E7E5;max-width:60ch;margin-top:.7em}
.cta .ticks li{color:#fff}
.cta .ticks li::before{border-color:var(--accent)}
.cta .btn-row--split{margin-top:24px}

/* ── FOOTER ────────────────────────────────────────────────────────────── */
.site-foot{background:#0D1211;color:#C9D0CD;padding:clamp(40px,4vw,58px) 0 0;font-size:14.5px}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(24px,3vw,44px)}
.site-foot h3{color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;margin:0 0 14px}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin:0 0 8px;line-height:1.45}
.site-foot a{color:#C9D0CD;text-decoration:none}
.site-foot a:hover{color:#fff;text-decoration:underline}
.site-foot p{margin:0 0 .8em;line-height:1.55}
.foot-brand svg,.foot-brand img{width:196px;height:auto;margin:0 0 14px}
.foot-phone{display:inline-flex;align-items:center;gap:8px;font-size:19px;font-weight:800;color:#fff;text-decoration:none}
.foot-phone:hover{color:var(--accent)}
.site-foot a:hover{color:#fff}
.foot-note{font-size:13px;color:#8D9A96}
.foot-cred{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:clamp(30px,3vw,44px);padding:20px 0;border-top:1px solid var(--line-dark)}
.foot-cred .cred{color:#8D9A96;text-align:left}
.foot-legal{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;padding:16px 0 24px;border-top:1px solid var(--line-dark);font-size:13px;color:#8D9A96}
.foot-legal a{color:#8D9A96}

/* ── MOBILE STICKY BAR ─────────────────────────────────────────────────── */
.stickybar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--paper);border-top:1px solid var(--line);padding:9px 14px;align-items:center;gap:12px}
.stickybar .btn{flex:1 1 auto;padding:13px 14px}
.stickybar .cred{flex:0 0 auto;text-align:right;font-size:9.5px;max-width:130px}

/* ── BREAKPOINT 1080: nav hides, burger shows, hero stacks ─────────────── */
@media(max-width:1080px){
  :root{--pad:22px}
  .navtoggle{display:block}
  /* .site-head is sticky with a z-index, so it forms a stacking context: .head-nav's z-index:90
     resolves INSIDE it and the whole header composites at .site-head's value. Raise the header
     above the body-level scrim (70) or the scrim paints over the open drawer. */
  .site-head{z-index:90}
  .head-in{min-height:72px;gap:12px}
  .head-cta{display:none}
  .head-nav{position:fixed;left:0;right:0;top:72px;z-index:90;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 22px 22px;max-height:calc(100dvh - 118px);overflow-y:auto;display:none}
  .head-nav.open{display:flex}
  .navlink{width:100%;justify-content:space-between;padding:14px 4px;font-size:16.5px;font-weight:700;border-bottom:1px solid var(--line);border-radius:0}
  .navlink:hover,.navlink[aria-expanded=true]{background:none}
  .hasmenu{width:100%}
  .menu{position:static;transform:none;min-width:0;width:100%;border:0;box-shadow:none;padding:2px 0 10px 4px;columns:1}
  .menu::before{display:none}
  /* STICKY HOVER (fixed v1.0.2). Tapping the group toggle on a touch screen
     leaves .hasmenu in the :hover state until the next tap elsewhere. That made
     `.hasmenu:hover .menu` (specificity 0,3,0) outrank `.menu.open` (0,2,0), so
     the panel the script had just opened was forced straight back to
     display:none and the accordion looked dead. Excluding the open panel from
     the hover rule removes the conflict; the !important on .menu.open is a
     belt-and-braces guard against Divi doing the same thing. */
  .hasmenu:hover .menu:not(.open){display:none}
  .menu.open{display:block!important;position:static;width:100%;columns:1}
  .menu a{padding:10px 0;font-size:15.5px;color:var(--ink-soft)}
  .menu a:hover{background:none}
  .drawer-cta{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 0 4px}
  .hero-grid,.cta__grid{grid-template-columns:1fr;display:flex;flex-direction:column}
  /* Stacked hero puts the H1 and lede over mid-photo, where the desktop left-weighted gradient
     gives no cover. Darken downward instead so the copy stays legible. */
  .hero__bg{opacity:.7}
  .hero::after{background:linear-gradient(180deg,rgba(14,31,49,.6) 0%,rgba(14,31,49,.84) 42%,rgba(14,31,49,.92) 100%)}
  .hero-grid > .hero-form{order:-1}
  .hero h1{max-width:none}
  .btn-row--split{max-width:none;flex-direction:column}
  .foot-grid{grid-template-columns:1fr 1fr}
  .trust ul{grid-template-columns:1fr 1fr}
}
@media(min-width:1081px){.drawer-cta{display:none}}

/* ── PHONE ─────────────────────────────────────────────────────────────── */
@media(max-width:640px){
  :root{--pad:18px}
  body{font-size:16px}
  .brand img,.brand svg{width:168px}
  .stickybar{display:flex}
  .site-foot{padding-bottom:76px}
  .cols2,.cols3,.cardgrid,.linkgrid{grid-template-columns:1fr}
  .trust ul{grid-template-columns:1fr}
  .rvcard{flex:0 0 85vw}
  .reviews__head{flex-direction:column;align-items:flex-start}
  .fig{margin-left:calc(var(--pad) * -1);margin-right:calc(var(--pad) * -1);border-left:0;border-right:0;border-radius:0}
  .foot-grid{grid-template-columns:1fr}
  .foot-cred{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ── CHECKLIST CLASS ALIASES ───────────────────────────────────────────────
   The static build's class names are authoritative for pixel fidelity. These
   aliases make the network-standard selector names resolve to the same
   elements, so both naming systems work and neither can silently break. */
.nav__call{}
.leadbox{background:var(--paper);color:var(--ink)}
.leadbox__hd h2{font-size:20px;font-weight:800;text-align:center;letter-spacing:-.015em;margin:0 0 14px}
.reviews__track{}
.reviews__btn{}
.review blockquote{margin:0}
.review blockquote p{font:italic 400 16px/1.5 "Zilla Slab",Georgia,serif}
.form__fine{}

/* ── LEAD FORM SUCCESS SWAP ────────────────────────────────────────────────
   Ninja Forms reports success through a jQuery event, not a page load. On
   success main.js adds .is-sent to the card and this hides the form body. */
.leadcard .leadform__success{display:none}
.leadcard.is-sent .leadbox__bd,.leadcard.is-sent .leadcard__fine{display:none}
.leadcard.is-sent .leadform__success{display:block}
.leadcard.is-sent .leadform__success p{margin:0;font-size:15px;line-height:1.55}
.leadform__fallback{margin:0;font-size:15px;line-height:1.55}

/* ── HEADER PHONE PILL LOCK ────────────────────────────────────────────────
   Any generic hover-legibility rule must exclude the pill or the label goes
   dark-on-navy. The pill's text, spans and icon are locked to #fff in both the
   desktop header and the mobile drawer. */
.head-nav>a:not(.phone-pill):hover{color:var(--brand)}
.phone-pill,.phone-pill:link,.phone-pill:visited,.phone-pill:hover,.phone-pill:focus,
.phone-pill span,.head-cta .phone-pill,.drawer-cta .phone-pill,
.head-cta .phone-pill:hover,.drawer-cta .phone-pill:hover{color:#fff!important}
.phone-pill svg,.head-cta .phone-pill svg,.drawer-cta .phone-pill svg{fill:#fff!important}

/* ── HOVER / FOCUS LEGIBILITY ──────────────────────────────────────────────
   Survives Divi's own link colours. */
.menu a{color:var(--ink-soft)!important}
.menu a:hover,.menu a:focus-visible{background:var(--brand-tint)!important;color:var(--ink)!important}
.menu .menu-all,.menu .menu-all:hover{color:var(--brand)!important}
.head-nav a:focus-visible,.menu a:focus-visible,.btn:focus-visible,
.rvarrows button:focus-visible,.navtoggle:focus-visible,.faq summary:focus-visible{
outline:2px solid var(--accent);outline-offset:2px}
.navlink--current{position:relative;display:inline-flex;align-items:center;gap:5px;padding:11px 13px;
font-size:15px;font-weight:700;color:var(--brand);white-space:nowrap;cursor:default}
.site-foot .navlink--current,.foot-current{color:#fff;font-weight:700}

/* ── DRAWER STACKING ───────────────────────────────────────────────────────
   .nav.open must sit above .nav__scrim or the scrim paints over the drawer. */
.head-nav.open,.nav.open{z-index:90}
.nav__scrim{z-index:70}
.navtoggle{z-index:95}

/* ── MOBILE DRAWER HARDENING (v1.0.1) ──────────────────────────────────────
   Three separate ways Divi can kill this drawer, all fixed here.

   1. The drawer is position:fixed. A transform, filter, perspective, contain or
      will-change on ANY ancestor makes fixed positioning resolve against that
      ancestor instead of the viewport, which parks the open drawer somewhere
      off screen. Divi sets these on its wrappers in several configurations, so
      the containing chain is explicitly cleared.
   2. Divi ships button resets that can collapse .navtoggle to zero size or hide
      it outright, so its display and dimensions are forced.
   3. Divi's #et-boc overflow can clip a fixed child. */
@media(max-width:1080px){
  body.lbep,body.lbep #lbep-page,body.lbep #et-main-area,body.lbep #et-boc,
  body.lbep .site-head,body.lbep .head-in{
    transform:none!important;filter:none!important;perspective:none!important;
    will-change:auto!important;contain:none!important;backdrop-filter:none!important}
  body.lbep #et-boc,body.lbep #et-main-area,body.lbep #lbep-page{overflow:visible!important}
  .navtoggle{display:flex!important;align-items:center;justify-content:center;
    flex-direction:column;width:46px!important;height:42px!important;
    visibility:visible!important;opacity:1!important;pointer-events:auto!important}
  .navtoggle span{display:block!important;width:20px;height:2px;margin:2px auto;
    background:var(--ink)!important}
  /* The drawer must beat Divi's own stacking and must never be display:none
     while .open is set, whatever else the cascade says. */
  .head-nav.open{display:flex!important;visibility:visible!important;opacity:1!important}
  .nav__scrim.open{display:block!important}
  /* dvh is unsupported on older mobile Safari, where the whole max-height
     declaration is dropped. vh first, dvh second for browsers that have it. */
  .head-nav{max-height:calc(100vh - 118px)}
  .head-nav{max-height:calc(100dvh - 118px)}
}
@media(min-width:1081px){
  /* The burger is mobile only. Forcing display above also forces it off. */
  .navtoggle{display:none!important}
}

/* ── BREADCRUMB ────────────────────────────────────────────────────────────*/
.crumbs{padding:12px 0;font-size:13px;color:var(--ink-soft);border-bottom:1px solid var(--line)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li{margin:0}
.crumbs li+li::before{content:"\203A";margin-right:6px;color:var(--line)}
.crumbs a{color:var(--ink-soft)}

/* ── SERVICE GROUPS ON THE FRONT PAGE ──────────────────────────────────────*/
.svcgroup{margin:0 0 clamp(28px,3vw,44px)}
.svcgroup:last-child{margin-bottom:0}
.svcgroup__h{margin:0 0 .3em;font-size:21px;font-weight:800;letter-spacing:-.015em}
.svcgroup__lead{margin:0;font-size:15.5px;color:var(--ink-soft);max-width:74ch}

/* ── FIGURE ASPECT GUARD ───────────────────────────────────────────────────
   height:auto with an aspect-ratio keeps bundled body images from collapsing
   when a CSS optimiser drops the intrinsic sizing. */
.fig img{height:auto;aspect-ratio:3/2}