/* Shared design system. Brand colors/fonts arrive as CSS variables from each page's <head>. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;font-family:var(--font-body);font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);line-height:1.1;margin:0 0 .5em;text-wrap:balance}
h1,h2,h3,.num,.price,.cost td,.hero-call b{font-variant-numeric:lining-nums proportional-nums}
h1{font-size:clamp(2.35rem,5.4vw,4rem)}
h2{font-size:clamp(1.85rem,3.6vw,2.75rem)}
h3{font-size:1.32rem;line-height:1.25}
p{margin:0 0 1em;text-wrap:pretty}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.container{width:100%;max-width:1220px;margin-inline:auto;padding-inline:clamp(18px,4vw,40px)}
.skip{position:absolute;left:-9999px;top:10px;z-index:200;background:#fff;color:#000;padding:8px 14px;border-radius:8px}
.skip:focus{left:16px}
:focus-visible{outline:2px solid var(--cta);outline-offset:3px}
.muted{color:var(--muted)}

.eyebrow{display:inline-flex;align-items:center;gap:.75em;font-family:var(--font-body);font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:none;color:var(--accent-text);margin:0 0 1.1rem}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.75}
.hero .eyebrow,.cta-band .eyebrow,.aside-card--dark .eyebrow{color:var(--cta)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font:inherit;font-weight:600;font-size:1rem;line-height:1.1;padding:.95rem 1.45rem;border-radius:var(--btn-radius);border:1.5px solid transparent;text-decoration:none;cursor:pointer;transition:transform .15s ease,filter .15s ease,background .15s ease,box-shadow .15s ease;white-space:nowrap}
.btn-cta{background:var(--cta);color:var(--cta-ink);box-shadow:0 12px 28px -14px var(--cta)}
.btn-cta:hover{transform:translateY(-1px);filter:brightness(1.06)}
/* The plain (form) button on dark backgrounds: a clear light-blue outline so it stands out next to the colored call button (Niv, 11 Oct 2026) */
.btn-ghost-light{border-width:2px;border-color:color-mix(in srgb,var(--brand) 55%,#ffffff);color:var(--hero-ink);background:rgba(255,255,255,.04)}
.btn-ghost-light:hover{background:rgba(255,255,255,.1)}
.btn-sm{padding:.7rem 1.1rem;font-size:.92rem}
.btn-lg{padding:1.1rem 1.7rem;font-size:1.05rem}
.btn-block{width:100%}
.text-link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--brand);text-decoration:none}
.text-link:hover{text-decoration:underline}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--hero-bg);color:var(--hero-ink);border-bottom:1px solid var(--hero-line)}
.header-inner{display:flex;align-items:center;gap:1.5rem;min-height:76px}
.logo{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;color:inherit}
.logo-mark{color:var(--cta);flex:none}
.logo-text{display:flex;flex-direction:column;line-height:1}
.logo-name{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1.45rem;letter-spacing:.01em}
.logo-suffix{font-size:.6rem;font-weight:600;letter-spacing:.32em;text-transform:none;opacity:.7;margin-top:.35rem}
.nav{display:flex;gap:1.8rem;margin-left:auto}
.nav a{text-decoration:none;font-size:.92rem;font-weight:500;opacity:.82;transition:opacity .15s}
.nav a:hover{opacity:1}
.header-actions{display:flex;align-items:center;gap:1.1rem}
.nav+.header-actions{margin-left:1.2rem}
.header-inner>.logo+.header-actions{margin-left:auto}
.header-phone{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}
.header-phone svg{color:var(--cta)}
.header-phone span{display:flex;flex-direction:column;line-height:1.15}
.header-phone small{font-size:.66rem;letter-spacing:.14em;text-transform:none;opacity:.65}
.header-phone b{font-size:1.02rem;font-weight:600;letter-spacing:.01em}
/* The call as the orange header button (layout.headerCall); phones keep the round icon */
@media (min-width:641px){.header-phone--btn{background:var(--panel-cta,var(--cta));color:#fff;padding:.5rem 1.15rem .5rem .95rem;border-radius:var(--btn-radius);box-shadow:0 12px 28px -14px var(--panel-cta,var(--cta));transition:filter .15s ease}.header-phone--btn:hover{filter:brightness(1.08)}.header-phone--btn svg{color:#fff}.header-phone--btn small{opacity:.9}}
@media (max-width:980px){.nav{display:none}.header-inner>.logo+.nav+.header-actions{margin-left:auto}}
@media (max-width:640px){.header-phone span{display:none}.header-phone{width:42px;height:42px;justify-content:center;border:1px solid var(--hero-line);border-radius:50%}.header-inner{min-height:64px;gap:.8rem}.logo-name{font-size:1.25rem}.logo-mark{width:28px;height:28px}.header-actions .btn{display:none}}

/* Hero */
.hero{position:relative;background:var(--hero-bg);color:var(--hero-ink);overflow:hidden;isolation:isolate}
.hero::before,.cta-band::before{content:"";position:absolute;inset:0;background-image:var(--pattern);background-size:var(--pattern-size);opacity:var(--pattern-opacity);z-index:-2}
.hero::after{content:"";position:absolute;right:-18%;bottom:-55%;width:min(1000px,90vw);aspect-ratio:1;background:radial-gradient(closest-side,var(--glow),transparent);z-index:-1;pointer-events:none}
.hero h1{color:var(--hero-ink)}
.hero .lede{font-size:clamp(1.05rem,1.6vw,1.2rem);color:var(--hero-muted);max-width:34em}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(28px,5vw,80px);align-items:center;padding-block:clamp(40px,7vw,100px)}
.hero--compact .hero-grid{padding-block:clamp(32px,5vw,72px)}
.hero--slim .container{padding-block:clamp(44px,6vw,84px)}
.hero--slim h1{font-size:clamp(2.1rem,4.4vw,3.3rem);max-width:20em}
.checks{list-style:none;padding:0;margin:1.7rem 0 2rem;display:grid;gap:.75rem}
.checks li{display:flex;gap:.75rem;align-items:flex-start;font-size:1rem}
.checks svg{color:var(--cta);flex:none;margin-top:.2em}
.hero-call a{display:inline-flex;align-items:center;gap:.85rem;text-decoration:none;color:inherit;padding:.25rem 0}
.hero-call svg{width:46px;height:46px;padding:12px;border-radius:50%;border:1px solid var(--hero-line);color:var(--cta)}
.hero-call span{display:flex;flex-direction:column;line-height:1.2}
.hero-call small{font-size:.72rem;letter-spacing:.14em;text-transform:none;color:var(--hero-muted)}
.hero-call b{font-size:1.3rem;font-weight:600}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0 0 1.4rem;font-size:.8rem;color:var(--hero-muted)}
.crumbs li+li::before{content:"/";margin-right:.4rem;opacity:.5}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr}.hero-call{display:none}.checks{margin:1.2rem 0 0}}
@media (max-width:640px){.checks li:nth-child(n+3){display:none}.hero-grid{padding-block:26px 34px;gap:24px}.hero .lede{font-size:1rem}.hero .eyebrow{margin-bottom:.8rem}.form-kicker{font-size:.66rem}}

/* Lead form */
.form-card{position:relative;background:var(--surface);color:var(--ink);border-radius:calc(var(--radius) + 6px);padding:clamp(22px,3vw,36px);box-shadow:0 40px 90px -30px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06)}
.form-kicker{display:flex;align-items:center;gap:.45rem;font-size:.74rem;font-weight:600;letter-spacing:.08em;text-transform:none;color:var(--brand);margin:0 0 .6rem}
.form-title{font-size:clamp(1.5rem,2.4vw,1.85rem);margin:0 0 .2rem}
.progress{height:3px;background:var(--line);border-radius:3px;overflow:hidden;margin:1.1rem 0 .5rem}
.progress span{display:block;height:100%;width:33.33%;background:var(--brand);transition:width .35s ease}
.step-count{font-size:.76rem;color:var(--muted);margin:0 0 1rem}
.step{border:0;padding:0;margin:0;min-width:0}
.step legend{float:left;width:100%;font-weight:600;font-size:1.02rem;padding:0;margin-bottom:.9rem}
.step legend+*{clear:both}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.choice{position:relative;display:block}
.choice--wide{grid-column:1/-1}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice span{display:flex;align-items:center;gap:.65rem;min-height:52px;padding:.7rem .85rem;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 4px);font-size:.92rem;font-weight:500;line-height:1.25;cursor:pointer;transition:border-color .15s,background .15s,transform .1s}
.choice:hover span{border-color:var(--brand)}
.choice input:checked+span{border-color:var(--brand);background:var(--brand-tint)}
.choice input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.field{display:grid;gap:.35rem;margin-bottom:.85rem}
.field label,.field .label{font-size:.84rem;font-weight:600}
.opt{font-weight:400;color:var(--muted)}
.lead-form input[type=text],.lead-form input[type=tel],.lead-form input[type=email],.lead-form select{width:100%;font:inherit;font-size:16px;padding:.8rem .95rem;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 6px);background:#fff;color:var(--ink);transition:border-color .15s,box-shadow .15s;appearance:none;-webkit-appearance:none}
.lead-form select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23777' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}
.lead-form input:focus,.lead-form select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-tint)}
.lead-form [aria-invalid=true]{border-color:#b42318!important}
.field-error{color:#b42318;font-size:.8rem;margin:0}
.field-error:empty{display:none}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media (max-width:460px){.row2{grid-template-columns:1fr;gap:0}}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.seg label{position:relative}
.seg input{position:absolute;opacity:0}
.seg span{display:block;text-align:center;padding:.72rem;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 6px);font-weight:500;cursor:pointer;transition:border-color .15s,background .15s}
.seg input:checked+span{border-color:var(--brand);background:var(--brand-tint)}
.seg input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.consent{display:flex;gap:.65rem;align-items:flex-start;font-size:.72rem;line-height:1.45;color:var(--muted);margin:.3rem 0 .35rem;cursor:pointer}
.consent input{width:18px;height:18px;margin:.1rem 0 0;flex:none;accent-color:var(--brand)}
.disclosure{font-size:.72rem;line-height:1.45;color:var(--muted);margin:0 0 1rem calc(18px + .65rem)}
.disclosure a{color:inherit}
.form-nav{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-top:.4rem}
.form-nav .btn{flex:1}
/* Back: top left of the step, above the question (Niv, 17 Oct 2026) */
.btn-back{display:inline-flex;align-items:center;gap:.35rem;background:var(--brand-tint);border:0;border-radius:999px;font:inherit;font-size:.86rem;font-weight:600;color:var(--brand);cursor:pointer;padding:.4rem .85rem .4rem .7rem;margin:0 0 .9rem}
.btn-back:hover{background:var(--brand);color:#fff}
.form-msg{font-size:.9rem;margin-top:.6rem}
.form-msg:empty{display:none}
.form-msg.is-error{color:#b42318}
.form-msg.is-info{color:var(--brand);background:var(--brand-tint);padding:.8rem 1rem;border-radius:10px}
.lead-form.is-sending [data-submit]{opacity:.7;pointer-events:none}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.cf-turnstile{margin:.2rem 0 .6rem}

/* Trust strip */
.trust{background:var(--surface);border-bottom:1px solid var(--line)}
.trust ul{list-style:none;margin:0;padding:1.5rem 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem 1.5rem}
.trust li{display:flex;align-items:center;gap:.75rem;font-size:.93rem;font-weight:500;line-height:1.3}
.trust svg{color:var(--brand);flex:none}
@media (max-width:900px){.trust ul{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.trust li{font-size:.85rem}}

/* Sections */
.section{padding-block:clamp(36px,4vw,56px)} /* Niv, 16 Oct 2026: the gaps between sections were too big on desktop */
.section--alt{background:var(--surface)}
.section-head{max-width:740px;margin-bottom:clamp(30px,4vw,54px)}
.section-head.center{text-align:center;margin-inline:auto}
.section-head.center .eyebrow{justify-content:center}
.section-head>p:not(.eyebrow){color:var(--muted);font-size:1.08rem;margin:0}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:1.1rem}
.card{position:relative;display:flex;flex-direction:column;gap:.55rem;padding:1.8rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:inherit;transition:border-color .2s,transform .2s,box-shadow .2s}
.section--alt .card{background:var(--bg)}
a.card:hover{border-color:var(--brand);transform:translateY(-3px);box-shadow:0 22px 44px -28px rgba(0,0,0,.4)}
.card-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:calc(var(--radius) - 4px);background:var(--brand-tint);color:var(--brand);flex:none}
.card h3{margin:.5rem 0 0}
.card p{color:var(--muted);font-size:.96rem;margin:0}
.card .more{margin-top:auto;padding-top:.8rem;display:inline-flex;align-items:center;gap:.4rem;font-size:.9rem;font-weight:600;color:var(--brand)}
.cards--plain .card h3{margin-top:.2rem}
/* Flip cards (a service with a cover): cover art in front; on hover the card turns on its axis in 3D and
   shows one word for the service over the same art. Hover devices only; touch taps go straight to the page. */
.card--flip{display:grid;padding:0;border:0;background:none;perspective:1200px}
.section--alt .card--flip{background:none}
a.card--flip:hover{border-color:transparent;transform:none;box-shadow:none}
.flip-inner{display:grid;position:relative;transform-style:preserve-3d;transition:transform .75s cubic-bezier(.2,.7,.2,1)}
.flip-front,.flip-back{grid-area:1/1;position:relative;overflow:hidden;border-radius:var(--radius);-webkit-backface-visibility:hidden;backface-visibility:hidden}
.flip-front{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line)}
.section--alt .flip-front{background:var(--bg)}
.card-cover{aspect-ratio:16/9;overflow:hidden;background:var(--brand-tint)}
.card-cover img{display:block;width:100%;height:100%;object-fit:cover}
.card-body{display:flex;flex-direction:column;gap:.55rem;flex:1;padding:0 1.8rem 1.8rem}
.card--flip .card-icon{margin-top:-25px;position:relative;background:var(--surface);box-shadow:0 0 0 5px var(--surface),0 10px 22px -12px rgba(0,0,0,.45)}
.flip-back{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;transform:rotateY(180deg);background:var(--hero-bg);color:#fff;text-align:center;padding:1.8rem}
.flip-back::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(160deg,rgba(var(--hero-rgb),.72),rgba(var(--hero-rgb),.94))}
.flip-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(2px);transform:scale(1.08)}
@media (hover:hover){a.card--flip:hover .flip-inner,a.card--flip:focus-visible .flip-inner{transform:rotateY(180deg)}}
a.card--flip:hover .flip-front{box-shadow:none}
@media (prefers-reduced-motion:reduce){
  .flip-inner{transform:none!important}
  .flip-back{transform:none;opacity:0}
  a.card--flip:hover .flip-back,a.card--flip:focus-visible .flip-back{opacity:1}
}

.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3.5vw,48px)}
.steps li{padding-top:1.5rem;border-top:1px solid var(--ink)}
.steps .num{display:block;font-family:var(--font-display);font-size:2.9rem;line-height:1;color:var(--brand);margin-bottom:1rem}
.steps p{color:var(--muted);margin:0}
@media (max-width:780px){.steps{grid-template-columns:1fr}}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.features{list-style:none;padding:0;margin:0;display:grid;gap:1.8rem}
.features li{display:flex;gap:1.1rem;align-items:flex-start}
.features h3{font-size:1.2rem;margin:.1rem 0 .3rem}
.features p{color:var(--muted);margin:0}
.features--row{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.6rem}
.features--row li{flex-direction:column;gap:.8rem}
@media (max-width:980px){.features--row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.features--row{grid-template-columns:1fr}.features--row li{flex-direction:row}}
.note{margin:1rem 0 0;padding:.3rem 0 .3rem 1.5rem;border-left:2px solid var(--cta)}
.note blockquote{margin:0 0 .8rem;font-family:var(--font-display);font-size:clamp(1.3rem,2.2vw,1.65rem);line-height:1.35}
.note figcaption{font-size:.78rem;letter-spacing:.08em;text-transform:none;color:var(--muted)}

/* Cost table */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.section--alt .table-wrap{background:var(--bg)}
table.cost{width:100%;min-width:620px;border-collapse:collapse;font-size:.96rem}
.cost th,.cost td{text-align:left;vertical-align:top;padding:1.05rem 1.3rem;border-bottom:1px solid var(--line)}
.cost thead th{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:none;color:var(--muted)}
.cost tbody th{font-weight:600}
.cost td:nth-child(2){font-family:var(--font-display);font-size:1.12rem;white-space:nowrap;color:var(--brand)}
.cost td:last-child{color:var(--muted);font-size:.9rem}
.cost tbody tr:last-child>*{border-bottom:0}
.fineprint{font-size:.84rem;color:var(--muted);margin-top:1rem}
.fineprint a{color:var(--brand);font-weight:600}

/* FAQ */
.faq-wrap .faq{max-width:900px}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:1.2rem;padding:1.35rem 0;font-weight:600;font-size:1.08rem;line-height:1.4;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-family:var(--font-display);font-size:1.7rem;font-weight:400;line-height:1;color:var(--brand);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 2.5rem 1.4rem 0;color:var(--muted)}
.faq details>div p{margin:0}

/* CTA band */
.cta-band{position:relative;background:var(--hero-bg);color:var(--hero-ink);overflow:hidden;isolation:isolate}
.cta-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:2rem;padding-block:clamp(52px,7vw,92px)}
.cta-band h2{color:var(--hero-ink);max-width:17em;margin-bottom:.4rem}
.cta-band p{color:var(--hero-muted);margin:0;max-width:36em}
.cta-actions{display:flex;flex-wrap:wrap;gap:.8rem}
@media (max-width:520px){.cta-actions,.cta-actions .btn{width:100%}}

/* Content pages */
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(36px,6vw,88px);align-items:start}
@media (max-width:980px){.content-grid{grid-template-columns:1fr}}
.prose{max-width:740px}
.prose h2{font-size:clamp(1.6rem,2.8vw,2.1rem);margin-top:2.1em}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.2rem;margin-top:1.6em;margin-bottom:.4em}
.prose p,.prose li{color:color-mix(in srgb,var(--ink) 82%,var(--bg))}
.prose a{color:var(--brand)}
.prose ul:not(.ticks){padding-left:1.2em}
.prose li{margin-bottom:.45em}
.legal h2{font-size:1.45rem;margin-top:1.8em}
.ticks{list-style:none;padding:0;margin:0 0 1.2em;display:grid;gap:.8rem}
.ticks li{display:flex;gap:.75rem;align-items:flex-start;margin:0}
.ticks svg{color:var(--brand);flex:none;margin-top:.25em}
.ticks--lg li{font-size:1.05rem}
.tip{margin-top:2.4rem;padding:1.5rem 1.7rem;background:var(--brand-tint);border-radius:var(--radius)}
.tip p:last-child{margin:0}
.aside{display:grid;gap:1rem;position:sticky;top:100px}
@media (max-width:980px){.aside{position:static}}
.aside-card{padding:1.6rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.aside-card .price{font-family:var(--font-display);font-size:2rem;line-height:1.1;color:var(--brand);margin:0 0 .4rem}
.aside-card .muted{font-size:.92rem}
.aside-card--dark{background:var(--hero-bg);color:var(--hero-ink);border-color:transparent}
.aside-card--dark p{color:var(--hero-muted)}
.link-list{list-style:none;padding:0;margin:0}
.link-list li+li{border-top:1px solid var(--line)}
.link-list a{display:flex;justify-content:space-between;align-items:center;padding:.7rem 0;text-decoration:none;font-weight:500}
.link-list a:hover{color:var(--brand)}
.chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.45rem}
.chips li{font-size:.85rem;padding:.35rem .75rem;border:1px solid var(--line);border-radius:999px}
.area-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.6rem}
.area-list a{display:flex;align-items:center;gap:.5rem;padding:.9rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;font-weight:500;background:var(--surface)}
.area-list a:hover{border-color:var(--brand)}
.area-list svg{color:var(--brand)}

/* Footer */
.site-footer{background:var(--footer-bg);color:rgba(255,255,255,.72);font-size:.92rem;padding-block:64px 40px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:2.5rem}
.footer-grid--min{grid-template-columns:1fr}
.site-footer .logo{color:#fff;margin-bottom:1rem}
.site-footer a{text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline}
.site-footer h4{font-family:var(--font-body);font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:none;color:rgba(255,255,255,.45);margin:0 0 1rem}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.55rem}
.footer-brand p{max-width:28em}
.foot-hours strong{display:inline-block;color:#fff;font-weight:700;margin-bottom:.2rem}
.footer-disclosure{margin-top:3rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.1);font-size:.78rem;line-height:1.6;color:rgba(255,255,255,.5)}
.footer-disclosure p{max-width:70em}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media (max-width:760px){.site-footer{padding-bottom:110px}}

/* Mobile sticky action bar */
.mobile-bar{display:none}
@media (max-width:760px){
  .mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:1fr 1.4fr;gap:.55rem;padding:.65rem .8rem calc(.65rem + env(safe-area-inset-bottom,0px));background:var(--hero-bg);box-shadow:0 -12px 30px -12px rgba(0,0,0,.45);transition:transform .25s ease}
  .mobile-bar .btn{padding:.9rem 1rem}
  .mobile-bar.is-hidden{transform:translateY(115%)}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ===== Variant components (garage door and future niches) ===== */
.form-card{box-shadow:var(--form-shadow)}
/* Urgent top bar */
/* The ad page's offer bar, like the contractor's own top bar (Niv, 5 Nov 2026): dark, grey text, the offer in yellow */
.topbar{background:var(--cta);color:var(--cta-ink);font-size:.86rem;font-weight:600}
.topbar .container{display:flex;align-items:center;justify-content:center;gap:.6rem;min-height:40px;padding-block:.45rem;text-align:center;flex-wrap:wrap}
.topbar a{color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
/* Call-first hero */
.hero-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin:1.6rem 0 1.4rem}
.btn-xl{padding:1rem 1.6rem 1rem 1.3rem;border-radius:var(--btn-radius);text-align:left;line-height:1.15}
.btn-xl span{display:flex;flex-direction:column}
.btn-xl small{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:none;opacity:.8}
.btn-xl b{font-size:1.45rem;font-weight:800;letter-spacing:.01em;font-variant-numeric:lining-nums tabular-nums}
.hero--call .hero-ctas .btn-ghost-light{padding:.95rem 1.2rem}
@media (max-width:520px){.hero-ctas{flex-direction:column;align-items:stretch}.btn-xl{justify-content:center}.hero-ctas .btn-ghost-light{justify-content:center}}
/* Price anchors (Google Ads requires price ranges near the top for this niche) */
.price-block{margin:1.2rem 0 .4rem}
.price-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hero-line);border:1px solid var(--hero-line);border-radius:var(--radius);overflow:hidden}
.price-strip li{display:flex;flex-direction:column;gap:.1rem;padding:.75rem 1rem;background:var(--hero-bg)}
.price-strip span{font-size:1rem;color:var(--hero-muted)}
.price-strip b{font-family:var(--font-display);font-size:1.3rem;font-weight:var(--display-weight);font-variant-numeric:lining-nums;color:var(--hero-ink)}
.price-note{font-size:1rem;color:var(--hero-muted);margin:.55rem 0 0}
@media (max-width:560px){.price-strip{grid-template-columns:1fr}.price-strip li{flex-direction:row;justify-content:space-between;align-items:baseline;gap:.8rem;padding:.6rem .9rem}.price-strip b{font-size:1.15rem;white-space:nowrap}}
.price-pill{display:inline-flex;align-items:center;gap:.45rem;font-size:1rem;padding:.45rem .9rem;border:1px solid var(--hero-line);border-radius:999px;color:var(--hero-muted);margin:0 0 .4rem}
.price-pill b{color:var(--hero-ink);font-variant-numeric:lining-nums}
.price-pill svg{color:var(--cta)}
/* Symptom picker */
.problems{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:.8rem}
.problem{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:inherit;transition:border-color .2s,transform .2s,box-shadow .2s}
.problem:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:0 16px 36px -24px rgba(0,0,0,.4)}
.problem-body{display:flex;flex-direction:column;gap:.15rem;flex:1;min-width:0}
.problem-body b{font-size:1.02rem;line-height:1.3}
.problem-body span{font-size:.9rem;color:var(--muted);line-height:1.45}
.problem-go{color:var(--brand);flex:none}
/* Style gallery */
.styles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:1.1rem}
.style-card{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s,box-shadow .2s}
.style-card:hover{border-color:var(--brand);transform:translateY(-3px);box-shadow:0 22px 44px -28px rgba(0,0,0,.35)}
.style-art{aspect-ratio:6/5;background:var(--line)}
.style-art svg{width:100%;height:100%;display:block}
.style-body{display:flex;flex-direction:column;gap:.45rem;padding:1.3rem 1.3rem 1.4rem;flex:1}
.style-body h3{margin:0}
.style-body p{margin:0;color:var(--muted);font-size:.94rem}
.style-body .style-price{color:var(--ink)}
.style-body .style-price b{color:var(--brand);font-variant-numeric:lining-nums;white-space:nowrap}
.style-body .more{margin-top:auto;padding-top:.6rem;display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.9rem;color:var(--brand)}
/* Call-first mobile bar: phone is the big button */
@media (max-width:760px){.mobile-bar--call{grid-template-columns:1.15fr 1fr}.mobile-bar .btn{padding:.9rem .6rem}.mobile-bar svg{flex-shrink:0}}
@media (max-width:380px){.mobile-bar .btn{font-size:.94rem;gap:.4rem}}

/* ===== Photo-led layouts ===== */
/* Action bar under header (A) */
.action-bar{background:var(--cta);color:var(--cta-ink);font-size:.9rem;font-weight:600}
.action-bar .container{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:46px}
.action-bar span{display:inline-flex;align-items:center;gap:.5rem}
.action-bar nav{display:flex;align-self:stretch}
.action-bar nav a{display:inline-flex;align-items:center;gap:.45rem;padding:0 1.15rem;text-decoration:none;border-left:1px solid rgba(0,0,0,.14)}
.action-bar nav a:hover{background:rgba(0,0,0,.08)}
@media (max-width:980px){.action-bar{display:none}}
/* Full-bleed photo hero (A) */
.hero--photo::before,.hero--photo::after{display:none}
.hero-photo{position:absolute;inset:0;z-index:-1}
.hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--hero-rgb),.95) 0%,rgba(var(--hero-rgb),.82) 42%,rgba(var(--hero-rgb),.3) 100%)}
.hero--photo .hero-grid{padding-block:clamp(44px,7vw,110px)}
.hero--photo .hero-ctas{margin:1.4rem 0 1.2rem}
.hero--photo .price-strip li{background:rgba(var(--hero-rgb),.72);backdrop-filter:blur(6px)}
@media (max-width:960px){
  .hero-photo{bottom:auto;height:520px}
  .hero-photo::after{background:linear-gradient(180deg,rgba(var(--hero-rgb),.55) 0%,rgba(var(--hero-rgb),.8) 55%,rgba(var(--hero-rgb),1) 100%)}
}
/* Split hero (B) */
.hero-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--panel-bg);color:var(--panel-ink);min-height:min(86vh,820px);
  --hero-bg:var(--panel-bg);--hero-ink:var(--panel-ink);--hero-muted:var(--panel-muted);--hero-line:var(--panel-line);--cta:var(--panel-cta);--cta-ink:var(--panel-cta-ink)}
.split-panel{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,6vw,88px) clamp(20px,4vw,64px) clamp(40px,6vw,84px) max(clamp(18px,4vw,40px),calc((100vw - 1220px) / 2 + 40px))}
.split-panel h1{color:var(--panel-ink);font-size:clamp(2.3rem,4.6vw,3.7rem)}
.split-panel .lede{color:var(--panel-muted);font-size:clamp(1.05rem,1.5vw,1.18rem);max-width:32em}
.split-panel .eyebrow{color:var(--panel-cta)}
.split-panel .crumbs ol{color:var(--panel-muted)}
.split-photo{position:relative;min-height:360px}
.split-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.icon-links{display:flex;flex-wrap:wrap;gap:clamp(20px,3vw,44px);margin:.6rem 0 1.4rem}
.icon-links a{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;color:var(--panel-cta);font-size:.76rem;font-weight:600;letter-spacing:.16em;text-transform:none}
.icon-links a:hover{color:var(--panel-ink)}
.split-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.4rem;margin-top:1.6rem}
.split-call{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:inherit}
.split-call svg{width:44px;height:44px;padding:11px;border-radius:50%;border:1px solid var(--panel-line);color:var(--panel-cta)}
.split-call span{display:flex;flex-direction:column;line-height:1.2}
.split-call small{font-size:.72rem;letter-spacing:.12em;text-transform:none;color:var(--panel-muted)}
.split-call b{font-size:1.25rem;font-weight:600;font-variant-numeric:lining-nums}
@media (max-width:900px){.hero-split{grid-template-columns:1fr;min-height:0}.split-photo{order:-1;min-height:0;aspect-ratio:16/9}}
/* Photo tiles (A) */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.tile{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;color:#fff;text-decoration:none;isolation:isolate;background:var(--hero-bg)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.tile:hover img{transform:scale(1.05)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02) 30%,rgba(0,0,0,.82));z-index:0}
.tile-label{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:.25rem;padding:1.2rem 3rem 1.3rem 1.2rem}
.tile-label b{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);font-size:1.35rem;line-height:1.12}
.tile-label span{font-size:.92rem;opacity:.85;line-height:1.35}
.tile-label svg{position:absolute;right:1.1rem;bottom:1.35rem;color:var(--cta)}
@media (max-width:900px){.tiles{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.tiles{gap:.6rem}.tile{aspect-ratio:4/5}.tile-label{padding:.9rem 2.2rem .9rem .9rem}.tile-label b{font-size:1.05rem}.tile-label span{display:none}.tile-label svg{right:.8rem;bottom:1rem}}
/* Why-us checklist + promise card (A) */
.why{align-items:center}
.why-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.8rem}
.why-list li{display:flex;gap:.7rem;align-items:flex-start;font-weight:500;line-height:1.4}
.why-list svg{color:var(--brand);flex:none;margin-top:.15em}
@media (max-width:600px){.why-list{grid-template-columns:1fr}}
.promise{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;padding:clamp(26px,3.5vw,44px);background:var(--hero-bg);color:var(--hero-ink);border-radius:calc(var(--radius) + 4px)}
.promise>svg{color:var(--cta)}
.promise h3{color:var(--hero-ink);font-size:clamp(1.5rem,2.4vw,1.9rem);margin:0}
.promise p{color:var(--hero-muted);margin:0}
/* Schedule band */
.schedule-band{background:var(--band-bg);color:var(--band-ink)}
.schedule-band .container{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.9rem 1.6rem;padding-block:1.15rem;text-align:center}
.schedule-band p{margin:0;display:flex;align-items:center;gap:.6rem;font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);font-size:clamp(1.2rem,2vw,1.55rem)}
.schedule-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}
.band-primary{background:var(--band-ink);color:var(--band-bg)}
.band-primary:hover{filter:brightness(1.15)}
.band-ghost{border-color:currentColor;color:inherit}
/* Lookbook (B) */
.lookbook{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(170px,19vw,270px);gap:.9rem}
.look{position:relative;overflow:hidden;border-radius:var(--radius);color:#fff;text-decoration:none;isolation:isolate;background:var(--line)}
.look--big{grid-column:span 2;grid-row:span 2}
.look img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.look:hover img{transform:scale(1.04)}
.look::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.72))}
.look-cap{position:absolute;left:1.1rem;right:1.1rem;bottom:1rem;z-index:1;display:flex;flex-direction:column;gap:.1rem}
.look-cap b{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1.35rem;line-height:1.15}
.look--big .look-cap b{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.look-cap span{font-size:.9rem;opacity:.92;font-variant-numeric:lining-nums}
@media (max-width:900px){.lookbook{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(150px,42vw,240px)}}
/* Service circles (B) */
.circles{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,3vw,46px)}
.circle{display:flex;flex-direction:column;align-items:center;gap:.85rem;width:140px;text-align:center;text-decoration:none;color:inherit}
.circle-ring{display:grid;place-items:center;width:120px;height:120px;border-radius:50%;border:1.5px solid var(--brand);color:var(--brand);transition:background .2s,color .2s,transform .2s}
.circle:hover .circle-ring{background:var(--brand);color:#fff;transform:translateY(-3px)}
.circle b{font-weight:600;font-size:.98rem;line-height:1.3}
@media (max-width:520px){.circle{width:44%}.circle-ring{width:96px;height:96px}}
/* Quote section (B) */
.quote-section .split{align-items:center}
/* Prefer to talk: a button right under the lede (Niv, 17 Oct 2026) */
.quote-section .quote-call{margin:0 0 1.6rem;font-size:1.05rem;padding:.85rem 1.3rem}
.quote-call b{font-weight:800;font-variant-numeric:lining-nums}

.lead-form--short .form-title{margin-bottom:1.1rem}
.lead-form--short .field{margin-bottom:.75rem}

/* Lookbook inner wrapper (enables 3D tilt without clipping) */
.look{overflow:visible;background:none}
.look::after{display:none}
.look-inner{position:absolute;inset:0;overflow:hidden;border-radius:var(--radius);background:var(--line);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease}
.look-inner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.72))}
.look:hover .look-inner{box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}

/* ===== Light 3D motion (motion: true) ===== */
.door-reveal{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;perspective:1200px;pointer-events:none;overflow:hidden}
.door-reveal i{flex:1;background:var(--panel-bg);background-image:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.22) 92%,rgba(0,0,0,.35));transform-origin:50% 0;backface-visibility:hidden;animation:slatUp .85s cubic-bezier(.65,.05,.3,1) forwards}
.door-reveal i:nth-child(1){animation-delay:.2s}.door-reveal i:nth-child(2){animation-delay:.32s}.door-reveal i:nth-child(3){animation-delay:.44s}.door-reveal i:nth-child(4){animation-delay:.56s}.door-reveal i:nth-child(5){animation-delay:.68s}
@keyframes slatUp{0%{transform:rotateX(0)}100%{transform:rotateX(-96deg) translateY(-40%);opacity:0}}
.motion .split-photo{overflow:hidden}
.motion .split-photo img{animation:kenBurns 8s cubic-bezier(.2,.6,.2,1) both}
@keyframes kenBurns{from{transform:scale(1.1)}to{transform:scale(1)}}
html.js .motion .reveal{opacity:0;transform:perspective(1000px) rotateX(12deg) translateY(30px);transition:opacity .8s ease,transform .95s cubic-bezier(.2,.7,.2,1)}
html.js .motion .reveal.in{opacity:1;transform:none}
.motion .circle-ring svg{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.motion .circle:hover .circle-ring svg{transform:rotateY(360deg)}
@media (prefers-reduced-motion:reduce){
  .door-reveal{display:none}
  .motion .split-photo img{animation:none}
  html.js .motion .reveal{opacity:1;transform:none}
}

@media (max-width:520px){.look:not(.look--big) .look-cap span{display:none}.look:not(.look--big) .look-cap b{font-size:1rem;line-height:1.2}.look-cap{left:.8rem;right:.8rem;bottom:.7rem}}


/* ---------- guides (blog) ---------- */
.guide-list{list-style:none;padding:0!important;margin:0;display:grid;gap:1.1rem}
.guide-item{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius,14px);padding:1.3rem 1.4rem;margin:0}
.guide-item a{text-decoration:none;color:inherit}
.guide-item h2{font-size:clamp(1.4rem,2.4vw,1.6rem);line-height:1.2;margin:0 0 .45em}
.guide-item p:not(.guide-meta){color:var(--muted)}
.guide-item a:hover h2{color:var(--brand)}
.guide-item p{margin:0 0 .4em}
.guide-meta{font-size:.9rem;color:var(--muted)!important}
.guide .callout{border-left:4px solid var(--cta);background:var(--surface);padding:1rem 1.2rem;border-radius:0 10px 10px 0;margin:1.4em 0}
.guide ol{padding-left:1.3em}
.guide-cta{margin:2.4em 0 1em;padding:1.5rem;border-radius:var(--radius,14px);background:var(--surface);border:1px solid var(--line)}
.guide-cta h2{margin-top:0!important;font-size:1.35rem}
.guide-note{font-size:.88rem;color:var(--muted)!important;margin-top:2em}

/* ---------- mobile legibility + tap targets (audit 2026-09-30) ---------- */
@media (max-width:760px){
  .eyebrow{font-size:.8rem;letter-spacing:.18em}
  .logo-suffix{font-size:.76rem;letter-spacing:.24em}
  .form-kicker{font-size:.76rem}
  .consent,.disclosure{font-size:.8rem}
  .btn small,.split-call small,.hero-call small{font-size:.76rem}
  .site-footer h4{font-size:.8rem}
  .site-footer ul{gap:.15rem}
  .site-footer li a,.footer-brand a{display:inline-flex;align-items:center;min-height:44px;padding:.35rem 0;line-height:1.3}
  .footer-disclosure{font-size:.82rem}
  .footer-disclosure a{display:inline-block;padding:.5rem .1rem}
  .disclosure a,.consent a{display:inline-block;padding:.35rem 0}
  .split-call{display:inline-flex;align-items:center;min-height:44px}
}

/* ---------- no all-caps labels (Niv, 3 Oct 2026): sentence case, so the wide tracking comes down ---------- */
.eyebrow{letter-spacing:.04em;font-size:.82rem}
.logo-suffix{letter-spacing:.06em;font-size:.72rem}
.header-phone small,.hero-call small,.btn-xl small,.split-call small{letter-spacing:.02em}
.form-kicker,.cost thead th,.site-footer h4,.note figcaption,.icon-links a{letter-spacing:.03em}
@media (max-width:760px){.eyebrow{letter-spacing:.03em}.logo-suffix{letter-spacing:.05em}}

/* ---------- rodent control components ---------- */
.license-badge{display:flex;align-items:flex-start;gap:.55rem;max-width:34em;margin:.2rem 0 0;font-size:.88rem;line-height:1.45;color:var(--hero-muted)}
.license-badge svg{color:var(--cta);flex:none;margin-top:.1em}
.split-panel .license-badge{margin-top:1.3rem}
.license-line{display:flex;align-items:center;gap:.5rem;color:rgba(255,255,255,.78)}
/* entry-point house */
.entry-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"art head" "art list";column-gap:clamp(28px,5vw,72px);align-items:center}
.entry-art{grid-area:art}.entry-head{grid-area:head;align-self:end}.entry-head .section-head{margin-bottom:1.4rem}.entry-list{grid-area:list;align-self:start}
@media (max-width:960px){.entry-grid{grid-template-columns:1fr;grid-template-areas:"head" "art" "list";row-gap:1.2rem}}
.entry-art{background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--radius) + 6px);padding:clamp(10px,2vw,22px)}
.section--alt .entry-art{background:var(--bg)}
.entry-art svg{width:100%;height:auto;overflow:visible}
.entry-art path,.entry-art rect,.entry-art circle{vector-effect:non-scaling-stroke}
.h-ground{stroke:var(--line);stroke-width:3;fill:none}
.h-roof{fill:var(--brand-tint);stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round}
.h-truss{stroke:var(--brand);stroke-width:1.4;stroke-dasharray:5 5;fill:none;opacity:.55}
.h-wall{fill:var(--surface);stroke:var(--ink);stroke-width:2.2}
.section--alt .h-wall{fill:var(--bg)}
.h-found{fill:var(--line);stroke:var(--ink);stroke-width:2}
.h-vent,.h-win,.h-garage,.h-rvent,.h-ac{fill:none;stroke:var(--ink);stroke-width:1.8}
.h-win{fill:var(--brand-tint)}
.h-slat{fill:none;stroke:var(--ink);stroke-width:1.1;opacity:.55}
.h-palm{fill:none;stroke:var(--brand);stroke-width:5;stroke-linecap:round}
.h-frond{fill:none;stroke:var(--brand);stroke-width:3;stroke-linecap:round;opacity:.85}
.h-pipe{fill:none;stroke:var(--muted);stroke-width:3;stroke-linecap:round}
.h-wire{fill:none;stroke:var(--muted);stroke-width:1.6;stroke-dasharray:2 4}
.ep-dot{cursor:pointer;outline:none}
.ep-core{fill:var(--cta);stroke:var(--surface);stroke-width:3;transition:transform .2s}
.ep-dot text{font:700 16px var(--font-body);fill:var(--cta-ink);pointer-events:none}
.ep-pulse{fill:var(--cta);opacity:.35;transform-box:fill-box;transform-origin:center;animation:epPulse 2.2s ease-out infinite}
.ep-dot.is-active .ep-core,.ep-dot:hover .ep-core,.ep-dot:focus-visible .ep-core{transform:scale(1.18)}
@keyframes epPulse{0%{transform:scale(.8);opacity:.45}100%{transform:scale(2);opacity:0}}
.ep-list{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.ep-list button{display:flex;gap:.9rem;align-items:flex-start;width:100%;text-align:left;font:inherit;color:inherit;background:transparent;border:1px solid transparent;border-radius:calc(var(--radius) - 2px);padding:.75rem .85rem;cursor:pointer;transition:background .2s,border-color .2s}
.ep-list li.is-active button,.ep-list button:hover{background:var(--surface);border-color:var(--line)}
.section--alt .ep-list li.is-active button,.section--alt .ep-list button:hover{background:var(--bg)}
.ep-num{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--cta);color:var(--cta-ink);font-weight:700;font-size:.9rem}
.ep-body{display:flex;flex-direction:column;gap:.15rem}
.ep-body b{font-size:1.02rem;line-height:1.3}
.ep-body span{font-size:.93rem;color:var(--muted);line-height:1.5}
@media (prefers-reduced-motion:reduce){.ep-pulse{animation:none}}
/* process timeline */
.process{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,2vw,24px);counter-reset:p}
.process li{position:relative;display:flex;flex-direction:column;gap:.45rem;padding:1.5rem 1.3rem 1.6rem;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius)}
.section:not(.section--alt) .process li{background:var(--surface)}
.proc-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--brand);color:#fff;margin-bottom:.4rem}
.proc-num{font-size:.8rem;font-weight:600;color:var(--accent-text)}
.process h3{font-size:1.15rem;margin:0}
.process p{margin:0;font-size:.93rem;color:var(--muted)}
@media (max-width:1100px){.process{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.process{grid-template-columns:1fr;gap:0}.process li{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:.9rem;border-radius:0;border-width:0 0 0 2px;border-color:var(--brand);background:transparent!important;padding:.2rem 0 1.4rem 1.3rem;margin-left:25px}.proc-icon{position:absolute;left:-27px;top:0;width:52px;height:52px;margin:0}.process li>*:not(.proc-icon){margin-left:24px}.process h3,.process p,.proc-num{flex-basis:100%}}
/* facts band */
.facts-band{background:var(--hero-bg);color:var(--hero-ink);padding-block:clamp(44px,6vw,80px)}
.facts-band h2{color:var(--hero-ink);font-size:clamp(1.5rem,2.6vw,2rem);max-width:24em;margin-bottom:1.6rem}
.facts{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,40px)}
.facts li{display:flex;flex-direction:column;gap:.35rem;padding-top:1.1rem;border-top:1px solid var(--hero-line)}
.facts b{font-family:var(--font-display);font-weight:var(--display-weight);font-size:clamp(2.4rem,4.4vw,3.4rem);line-height:1;color:var(--cta);font-variant-numeric:lining-nums}
.facts span{color:var(--hero-ink);font-size:1rem;line-height:1.45}
.facts small{color:var(--hero-muted);font-size:.8rem}
@media (max-width:760px){.facts{grid-template-columns:1fr}}

/* ---------- utility bar, trust ribbon, story, audiences, area groups, dark process (8 Oct 2026) ---------- */
.utility{background:var(--footer-bg);color:rgba(255,255,255,.82);font-size:.8rem;font-weight:500}
.utility .container{display:flex;align-items:center;justify-content:center;gap:1rem;min-height:36px}
.utility ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 1.4rem}
.utility li{display:inline-flex;align-items:center;gap:.4rem}
.utility li svg{color:var(--cta)}
@media (max-width:980px){.utility ul li:nth-child(n+2){display:none}}
.trust--ribbon{background:var(--brand);border-bottom:0}
.trust--ribbon li{color:#fff;font-weight:600}
.trust--ribbon svg{color:#fff;opacity:.9}
.btn-outline{border-color:var(--brand);color:var(--brand);background:transparent;margin-top:.6rem}
.btn-outline:hover{background:var(--brand);color:#fff}
.story-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center}
.story-photo{border-radius:calc(var(--radius) + 4px);overflow:hidden;aspect-ratio:4/3.4;box-shadow:0 30px 60px -36px rgba(0,0,0,.45)}
.story-photo img{width:100%;height:100%;object-fit:cover}
.story-p{color:var(--muted)}
@media (max-width:900px){.story-grid{grid-template-columns:1fr}}
.audiences{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.audience{display:flex;flex-direction:column;gap:.6rem;padding:clamp(22px,3vw,34px);background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--brand);border-radius:var(--radius)}
.section--alt .audience{background:var(--bg)}
.audience h3{margin:.4rem 0 0}
.audience>p{color:var(--muted);margin:0}
.audience .ticks{margin:.4rem 0 .6rem}
.audience .text-link{margin-top:auto}
@media (max-width:760px){.audiences{grid-template-columns:1fr}}
.area-groups{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:1.1rem}
.area-group{padding:1.4rem 1.4rem 1.5rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.section--alt .area-group{background:var(--bg)}
.area-group h3{display:flex;align-items:center;gap:.5rem;font-size:1.12rem;margin:0 0 .8rem}
.area-group h3 svg{color:var(--brand)}
.area-group p{color:var(--muted);font-size:.95rem}
.area-group .chips li{font-size:1rem;background:var(--brand-tint);border-color:transparent}
.area-more{margin:1.4rem 0 0}
/* dark process band with connected steps */
.process-band{background:var(--hero-bg);color:var(--hero-ink)}
.process-band .section-head h2{color:var(--hero-ink)}
.process-band .section-head>p:not(.eyebrow){color:var(--hero-muted)}
.process-band .eyebrow{color:var(--cta)}
.process-band .process li{background:transparent!important;border:0;padding:0 .4rem;text-align:center;align-items:center}
.process-band .process li::before{content:"";position:absolute;top:26px;left:calc(50% + 34px);right:calc(-50% + 34px);height:2px;background:var(--hero-line)}
.process-band .process li:last-child::before{display:none}
.process-band .proc-icon{background:var(--cta);color:var(--cta-ink);box-shadow:0 0 0 6px rgba(255,255,255,.06)}
.process-band .proc-num{color:var(--cta)}
.process-band h3{color:var(--hero-ink)}
.process-band .process p{color:var(--hero-muted)}
@media (max-width:1100px){.process-band .process li::before{display:none}}
@media (max-width:700px){.process-band .process li{text-align:left;align-items:flex-start;border-left:2px solid var(--hero-line);padding:.2rem 0 1.4rem 1.3rem}}

/* mobile tightening (8 Oct 2026) */
.utility-m{display:none;margin:0;align-items:center;gap:.4rem}
.utility-m svg{color:var(--cta)}
@media (max-width:760px){
  .utility ul{display:none}.utility-m{display:inline-flex}.utility--desk{display:none}
  .quote-section .ticks,.quote-section .quote-call{display:none}
  .quote-section .section-head{margin-bottom:1.2rem}
  #areas .area-group .chips li:nth-child(n+7){display:none}
  #areas .area-group{padding:1.1rem}
}
@media (max-width:760px){
  #services .cards{gap:.6rem}
  #services .card{display:grid;grid-template-columns:44px 1fr;column-gap:.9rem;row-gap:.15rem;padding:1rem 1.1rem;align-items:start}
  #services .card .card-icon{grid-row:span 2;width:44px;height:44px}
  #services .card h3{margin:0;font-size:1.06rem}
  #services .cards{grid-template-columns:1fr 1fr}
  #services .card{grid-template-columns:1fr;padding:.9rem;row-gap:.5rem}
  #services .card .card-icon{grid-row:auto;width:40px;height:40px}
  #services .card h3{font-size:.98rem}
  #services .card p,#services .card .more{display:none}
  #services .card--flip{padding:0}
  #services .card--flip .card-body{padding:.75rem .85rem .9rem}
  #services .card--flip .card-icon{display:none}
}
.svc-mascot{display:none}
@media (max-width:760px){.svc-mascot{display:block;width:150px;height:auto;margin:.4rem auto 1.2rem;filter:drop-shadow(0 10px 20px rgba(0,0,0,.25))}}
/* Facts on phones: the number beside its text, not above it */
@media (max-width:760px){.facts li{display:grid;grid-template-columns:6.2rem 1fr;column-gap:.9rem;row-gap:.2rem;align-items:start}.facts b{grid-row:span 2;font-size:2rem}}

/* Services dropdown in the header nav */
.nav-dd{position:relative;display:flex;align-items:center}
.nav-dd>a{display:inline-flex;align-items:center;gap:.3rem}
.nav-dd>a svg{opacity:.7;transition:transform .2s}
.nav-dd-menu{position:absolute;top:calc(100% + 14px);left:-14px;min-width:290px;display:grid;padding:.5rem;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 24px 50px -20px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:70}
.nav-dd-menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.nav-dd:hover .nav-dd-menu,.nav-dd:focus-within .nav-dd-menu{opacity:1;visibility:visible;transform:none}
.nav-dd:hover>a svg,.nav-dd:focus-within>a svg{transform:rotate(180deg)}
.nav .nav-dd-menu a{display:flex;align-items:center;gap:.7rem;padding:.7rem .8rem;border-radius:calc(var(--radius) - 6px);font-size:.94rem;font-weight:500;opacity:1}
.nav .nav-dd-menu a:hover{background:var(--brand-tint)}
.nav-dd-menu .dd-line{margin:.35rem .8rem;border:0;border-top:1px solid var(--line)}

/* ---------- mascot hero, logo badge, CTA mascot (8 Oct 2026) ---------- */
.logo-badge{width:46px;height:46px;flex:none;border-radius:50%}
@media (max-width:640px){.logo-badge{width:38px;height:38px}}
.hero--mascot{background:var(--hero-bg)}
.hero--mascot::after{right:-10%;bottom:-40%}
.mascot-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(40px,6vw,84px)}
/* Equal-width columns, so the icons sit at even distances whatever each label's length (Niv, 13 Oct 2026) */
.hero--mascot .icon-links{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;column-gap:clamp(10px,1.6vw,20px);width:fit-content;max-width:100%;margin:.6rem 0 1.4rem}
.hero--mascot .icon-links a{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center;text-decoration:none;color:var(--panel-cta);font-size:.8rem;font-weight:600}
.hero--mascot .icon-links a:hover{color:#fff}
.hero--mascot .split-call svg{border-color:var(--hero-line);color:var(--panel-cta)}
.hero--mascot .split-call small{color:var(--hero-muted)}
/* The book link reads as a link: white bold lead-in, underlined label (Niv, 16 Oct 2026) */
.hero--mascot .btn-cta{background:var(--panel-cta)}
.hero-art{position:relative;padding:8% 0 6% 10%}
.blob{position:relative;overflow:hidden;aspect-ratio:5/4;border-radius:58px 150px 64px 170px / 72px 110px 140px 84px;box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}
.blob img{width:100%;height:100%;object-fit:cover}
.mascot-hero{position:absolute;left:-4%;top:-6%;width:46%;height:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.45));animation:mascotIn .9s cubic-bezier(.2,.8,.2,1.2) both,mascotFloat 4.5s ease-in-out 1s infinite}
.mascot-rat{position:absolute;right:-3%;bottom:-2%;width:28%;height:auto;filter:drop-shadow(0 16px 18px rgba(0,0,0,.4));animation:ratRun 1.1s cubic-bezier(.3,.7,.3,1) .35s both}
@keyframes mascotIn{from{opacity:0;transform:translate(-30px,40px) rotate(-8deg) scale(.9)}to{opacity:1;transform:none}}
@keyframes mascotFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes ratRun{from{opacity:0;transform:translateX(-120px) rotate(-6deg)}to{opacity:1;transform:none}}
@media (max-width:900px){.mascot-grid{grid-template-columns:1fr}.hero-art{max-width:520px;width:100%;margin:0 auto;padding:10% 0 4% 12%}}
@media (prefers-reduced-motion:reduce){.mascot-hero,.mascot-rat{animation:none}}
/* The text starts a clear gap past the seal's right edge (seal left + width + 56px, less the container's own offset) at every desktop width (Niv, 14 Oct 2026) */
.cta-band--mascot .cta-inner{padding-left:max(40px,calc(clamp(10px,4vw,60px) + clamp(150px,15vw,220px) + 56px - max(0px,(100vw - 1220px) / 2)))}
.cta-mascot{position:absolute;left:clamp(10px,4vw,60px);bottom:0;width:clamp(150px,15vw,220px);height:auto;z-index:0;filter:drop-shadow(0 10px 24px rgba(0,0,0,.4))}
@media (max-width:760px){.cta-band--mascot .cta-inner{padding-left:clamp(18px,4vw,40px)}.cta-mascot{display:none}}
/* Phones: the call-to-action band is centered, text and buttons alike */
@media (max-width:760px){.cta-inner{flex-direction:column;align-items:stretch;text-align:center}.cta-band h2,.cta-band p{margin-inline:auto}}

/* ---------- mascot hero: the call and licence line get room, set off by a hairline (Niv, 10 Oct 2026) ---------- */
.hero--mascot .license-badge{margin-top:1.6rem;padding-top:1.1rem;border-top:1px solid var(--hero-line);font-size:.84rem;max-width:30em}
@media (max-width:900px){.hero--mascot .hero-art{margin-top:1.4rem}}
/* Phones: the mascot art comes right after the headline instead of after the buttons (Niv, 11 Oct 2026) */
@media (max-width:900px){
  .mascot-grid{row-gap:0}
  .hero--mascot .hero-copy{display:contents}
  .hero--mascot .hero-copy>*{order:2}
  .hero--mascot .hero-copy>.crumbs,.hero--mascot .hero-copy>.eyebrow,.hero--mascot .hero-copy>h1{order:0}
  .hero--mascot .hero-art{order:1;max-width:360px;margin:2.6rem auto 1.2rem}
  .hero--mascot .hero-art--plain{padding:0;margin:1.2rem auto 1.4rem}
}
/* No seal on inner pages: the photo needs none of the room kept for it */
.hero-art--plain{padding:0}

/* ---------- service areas as tabs on the home page (Niv, 10 Oct 2026) ---------- */
.area-tablist{display:flex;flex-wrap:wrap;gap:.5rem}
.area-tablist button{display:inline-flex;align-items:center;gap:.4rem;font:inherit;font-size:.92rem;font-weight:600;padding:.6rem 1rem;min-height:44px;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.area-tablist button svg{color:var(--brand);flex:none}
.area-tablist button:hover{background:var(--brand-tint)}
/* Selected tab: same fill as the others, marked only by a brand-colored outline, so every region stays equally visible */
.area-tablist button[aria-expanded="true"]{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.area-tablist button:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.area-panel{margin-top:1rem;padding:1.5rem;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius)}
.area-panel h3{font-size:1.12rem;margin:0 0 .9rem}
.area-panel .chips li{font-size:1rem;background:var(--brand-tint);border-color:transparent}
@media (max-width:760px){.area-group .chips li,.area-panel .chips li{font-size:.88rem}}
@media (max-width:760px){.area-tablist button{font-size:.86rem;padding:.5rem .85rem}.area-panel{padding:1.1rem}}

/* Phones (Niv, 12 Oct 2026): the hero's service icons span the full width in equal columns; less empty space between
   sections (Niv: "a bit of space, not enormous"), least under the form and the service areas */
@media (max-width:760px){
  .hero--mascot .icon-links{width:100%;grid-auto-columns:minmax(0,1fr);column-gap:4px}
  .section{padding-block:28px}
  .quote-section{padding-bottom:16px}
  #areas{padding-bottom:28px}
}

/* Phone menu (Niv, 12 Oct 2026): ☰ in the header below 980px opens a panel under it */
.menu-btn{display:none;align-items:center;justify-content:center;width:42px;height:42px;padding:0;border:1px solid var(--hero-line);border-radius:50%;background:none;color:inherit;cursor:pointer}
.menu-btn svg+svg,.menu-btn[aria-expanded="true"] svg:first-child{display:none}
.menu-btn[aria-expanded="true"] svg+svg{display:block}
.menu-btn:focus-visible{outline:2px solid var(--panel-cta,var(--cta));outline-offset:2px}
.mobile-menu{position:absolute;left:0;right:0;top:100%;max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain;background:var(--hero-bg);color:var(--hero-ink);border-top:1px solid var(--hero-line);box-shadow:0 30px 50px -20px rgba(0,0,0,.5);padding-block:1rem 1.4rem}
.mobile-menu[hidden]{display:none}
.mm-label{margin:0 0 .5rem;font-size:.8rem;font-weight:600;opacity:.65}
.mm-services{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:.9rem}
.mm-services a{display:flex;align-items:center;gap:.55rem;padding:.7rem .75rem;min-height:48px;border:1px solid var(--hero-line);border-radius:calc(var(--radius) - 6px);text-decoration:none;color:inherit;font-size:.9rem;font-weight:500;line-height:1.2}
.mm-services a svg{color:var(--panel-cta,var(--cta));flex:none}
.mm-links{display:grid}
.mm-links a{display:flex;align-items:center;justify-content:space-between;padding:.95rem .2rem;border-bottom:1px solid var(--hero-line);text-decoration:none;color:inherit;font-size:1.05rem;font-weight:600}
.mm-links a svg{opacity:.5}
.mm-actions{display:grid;gap:.6rem;margin-top:1.2rem}
.mm-actions .btn{justify-content:center;gap:.5rem}
@media (max-width:980px){.menu-btn{display:inline-flex}}
html.menu-open{overflow:hidden}

/* ---------- one-line colored logo ("SealWell Rodent Control", Niv, 14 Oct 2026) ---------- */
.logo-inline{flex-direction:row;align-items:baseline;gap:.32em;white-space:nowrap}
.logo-inline .logo-name,.logo-inline .logo-suffix{font-family:var(--font-display);font-size:1.32rem;letter-spacing:0;margin-top:0;opacity:1}
.logo-inline .logo-name{color:var(--logo-name);font-weight:var(--logo-name-w,var(--display-weight))}
.logo-inline .logo-suffix{font-weight:700;color:var(--logo-suffix)}
.header-inner:has(.logo-inline) .nav{gap:1.35rem}
.header-inner:has(.logo-inline) .nav a,.header-inner:has(.logo-inline) .header-phone b{white-space:nowrap}
/* The longer one-line logo leaves no room for the full nav below 1280px: the ☰ menu takes over there */
@media (max-width:1279px){.header-inner:has(.logo-inline) .nav{display:none}.header-inner:has(.logo-inline) .menu-btn{display:inline-flex}.header-inner:has(.logo-inline)>.logo+.nav+.header-actions{margin-left:auto}}
@media (max-width:640px){.logo-inline .logo-name,.logo-inline .logo-suffix{font-size:1.12rem}}
@media (max-width:420px){
  .header-inner:has(.logo-inline){gap:.5rem}
  .header-inner:has(.logo-inline) .logo{gap:.5rem}
  .header-inner:has(.logo-inline) .logo-badge{width:36px;height:36px}
  .header-inner:has(.logo-inline) .header-actions{gap:.5rem}
  .header-inner:has(.logo-inline) .header-phone,.header-inner:has(.logo-inline) .menu-btn{width:38px;height:38px}
  .logo-inline .logo-name,.logo-inline .logo-suffix{font-size:.92rem}
  .logo-inline{gap:.28em}
}
@media (max-width:350px){.logo-inline .logo-name,.logo-inline .logo-suffix{font-size:.74rem}}
/* Region pages (/service-areas/<region>/): the map and the ZIP codes list that opens (Niv, 14 Oct 2026) */
.area-group .text-link,.area-panel .text-link{display:inline-flex;margin-top:.9rem;font-size:.85rem}
.area-map{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--surface)}
/* The map is cropped 64px on the left and 48px on top: Google's satellite button and "Open in Maps" link fall
   outside the box, while its logo and "Map data" line (bottom center and right) stay in view (Niv, 16 Oct 2026) */
.area-map{height:clamp(340px,48vw,440px)}
.area-map iframe{display:block;width:calc(100% + 64px);height:calc(100% + 48px);margin:-48px 0 0 -64px;border:0}
.zip-list{margin-top:1.1rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.zip-list summary{display:flex;align-items:center;gap:.5rem;padding:1rem 1.2rem;font-weight:600;cursor:pointer;list-style:none}
.zip-list summary::-webkit-details-marker{display:none}
.zip-list summary svg{color:var(--brand)}
.zip-list summary::after{content:'+';margin-left:auto;font-size:1.3rem;line-height:1;color:var(--muted)}
.zip-list[open] summary::after{content:'−'}
.zip-list dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:.7rem 1.4rem;margin:0;padding:0 1.2rem 1.2rem}
.zip-list dt{font-weight:600;font-size:.92rem}
.zip-list dd{margin:.15rem 0 0;color:var(--muted);font-size:.85rem;line-height:1.5}
@media (max-width:560px){.zip-list dl{grid-template-columns:1fr 1fr;gap:.6rem 1rem}}
/* City pages (/areas/<slug>/, Niv, 16 Oct 2026). A city chip with its own page is a link. */
.chips li.chip-link{padding:0}
.chips li.chip-link a{display:block;padding:.35rem .75rem;color:inherit;text-decoration:none;border-radius:inherit;transition:color .15s ease,box-shadow .15s ease}
.chips li.chip-link a:hover,.chips li.chip-link a:focus-visible{color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
/* Google's search embed outlines the place; its place card (top left, from about 390px wide) and satellite
   button are cropped off: 150px on top, 64px on the left. Logo and credits stay in view. */
.area-map--place{height:380px}
.area-map--place iframe{height:calc(100% + 150px);margin-top:-150px}
/* Two copies of the map, one zoom apart; a hidden lazy iframe never loads */
.area-map--place .map-wide{display:none}
@media (min-width:1100px){.area-map--place{height:520px}.area-map--place .map-wide{display:block}.area-map--place .map-narrow{display:none}}
.zip-list .zip-chips{margin:0;padding:0 1.2rem 1.2rem}
.zip-chips li{font-variant-numeric:tabular-nums;background:var(--surface)}
/* City pages: the parts of the city as a plain bulleted list, so they don't look like the clickable area chips (Niv, 17 Oct 2026) */
.prose ul.parts-list{columns:2;column-gap:2rem;padding-left:1.2em;margin:0 0 1.6em}
.parts-list li{break-inside:avoid;margin-bottom:.5em}
.parts-list li::marker{color:var(--brand)}
@media (max-width:560px){.prose ul.parts-list{columns:1}}

/* ---------- Call + Book side by side in the mascot hero (Niv, 25 Oct 2026) ---------- */
/* The two buttons share one height; on phones they stack full width, call on top */
.split-ctas--pair{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:stretch;gap:.8rem}
.split-ctas--pair .btn-xl{min-height:64px}
.split-ctas--pair .btn-ghost-light{padding-inline:1.5rem}
@media (max-width:520px){.split-ctas--pair{grid-template-columns:1fr;width:100%}.split-ctas--pair .btn-xl{width:100%;justify-content:center}}
/* Phones, inner pages: the call and book buttons come before the photo, so both show on the first screen
   without scrolling (found 24 Oct 2026: the photo pushed the call button off the first screen); the breadcrumb
   trail stays for desktop and in the page data. The home page keeps the seal right under its headline. */
@media (max-width:900px){
  .hero--mascot .hero-art--plain{order:3;max-width:420px;margin:1.8rem auto 0}
  .hero--mascot .hero-copy>.crumbs{display:none}
  .hero--mascot .split-ctas{margin-top:1.3rem}
  .hero--mascot .license-badge{margin-top:1.2rem;padding-top:.9rem}
}

/* ---------- Phones: Call, Text and Book as three equal buttons, icon over label (Niv, 25 Oct 2026) ---------- */
@media (max-width:760px){
  .mobile-bar--trio{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
  .mobile-bar--trio .btn{flex-direction:column;gap:.3rem;padding:.6rem .3rem;font-size:.86rem;line-height:1.1;min-height:58px}
  .mobile-bar--trio .btn svg{flex-shrink:0}
}

/* ---------- Without the call/text checkbox (smsConsent: false), the Terms line sits flush left ---------- */
.disclosure{margin-left:0}
.consent+.disclosure{margin-left:calc(18px + .65rem)}

/* ---------- "Los Angeles County" under the logo name in the header (logoArea; Niv, 25 Oct 2026) ---------- */
.logo-stack{display:flex;flex-direction:column;gap:4px;line-height:1}
.logo-area{display:flex;align-items:center;gap:.35em;font-size:.74rem;font-weight:600;color:var(--hero-muted);letter-spacing:.01em;white-space:nowrap}
.logo-area::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--panel-cta,var(--cta));flex:none}
@media (max-width:640px){.logo-area{font-size:.68rem;gap:.3em}.logo-stack{gap:3px}}
@media (max-width:380px){.logo-area{font-size:.6rem}}

/* ---------- The centered home hero (layout.homeHero: 'center'; Niv, 25 Oct 2026, from zevashelanu.com) ---------- */
/* The street photo full width under a navy veil, the area line and the headline centered, then the form card over the photo's bottom edge */
.hc{position:relative;isolation:isolate;color:#fff;text-align:center;overflow:hidden;background:var(--hero-bg)}
.hc-bg{position:absolute;inset:0;z-index:-1}
.hc-bg img{width:100%;height:100%;object-fit:cover;object-position:center 62%;display:block}
.hc-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 78%,transparent) 0%,color-mix(in srgb,var(--hero-bg) 55%,transparent) 45%,color-mix(in srgb,var(--hero-bg) 82%,transparent) 100%)}
.hc-inner{padding-block:clamp(26px,5vw,56px) clamp(150px,15vw,200px);display:flex;flex-direction:column;align-items:center}
/* Three lines of nearly the same size (Niv, 25 Oct 2026): "Rodent Control", "Los Angeles County" (the h1), the slogan */
.hc-h1{margin:0;display:flex;flex-direction:column;align-items:center;gap:.3em;line-height:1.02;text-shadow:0 4px 24px rgba(0,0,0,.45)}
.hc-t1{color:#fff;font-size:clamp(2.3rem,6.6vw,4.2rem)}
.hc-t2{display:flex;align-items:center;justify-content:center;gap:.18em;color:var(--hero-accent,#9cc2ff);font-size:clamp(1.95rem,5.6vw,3.6rem)}
.hc-t2 svg{width:.78em;height:.78em;color:var(--panel-cta,var(--cta));flex:none}
/* The ad page: a question headline from the search, a little smaller than "Rodent Control" so it fits two lines on a phone,
   and the open-now line under it (Niv, 5 Nov 2026) */
.hc-h1--q .hc-t1{font-size:clamp(2rem,5.6vw,3.8rem);max-width:12em;text-wrap:balance}
.hc-open{margin:.8em 0 0;display:inline-flex;align-items:center;gap:.55em;padding:.38em .95em;border-radius:999px;background:color-mix(in srgb,var(--hero-bg) 62%,transparent);color:#fff;font-weight:600;font-size:clamp(.95rem,2.6vw,1.12rem);line-height:1.3;text-shadow:none}
.hc-open i{flex:none;width:.62em;height:.62em;border-radius:50%;background:var(--hero-accent,#9cc2ff)}
.hc-open.is-open i{background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.55);animation:hc-pulse 2s infinite}
@keyframes hc-pulse{70%{box-shadow:0 0 0 .55em rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
@media (prefers-reduced-motion:reduce){.hc-open.is-open i{animation:none}}
@media (max-width:480px){.hc-open{font-size:.8rem;padding:.4em .85em;gap:.5em;white-space:nowrap;letter-spacing:-.005em}}
.hc-slogan{margin:.55em 0 0;color:#fff;font:var(--display-weight) clamp(1.7rem,5vw,3.2rem)/1.08 var(--font-display);letter-spacing:var(--display-tracking);max-width:16em;text-shadow:0 4px 24px rgba(0,0,0,.45)}
.hc-slogan span{position:relative;display:inline-block;color:var(--panel-cta,var(--cta));margin-top:.06em}
.hc-swoosh{position:absolute;left:2%;right:2%;bottom:-.24em;width:96%;height:.28em;color:var(--panel-cta,var(--cta))}
.hc-form{position:relative;z-index:2;margin-top:clamp(-150px,-12vw,-100px);padding-bottom:clamp(28px,5vw,56px)}
.hc-form .container{padding-block:0}
.hc-box{position:relative;max-width:560px;margin:0 auto}
.hc-card{position:relative;z-index:1;text-align:center;border-radius:24px;padding:clamp(22px,4vw,34px);box-shadow:0 40px 80px -30px color-mix(in srgb,var(--hero-bg) 55%,transparent),0 0 0 1px var(--line)}
.hc-card .step{border:0;padding:0;margin:0}
.hc-card .field{text-align:left;margin-bottom:.6rem}
.hc-card input::placeholder{color:#7d8aa0}
.hc-title{margin:0 0 .4rem;font-size:clamp(1.55rem,4.6vw,2.05rem);line-height:1.15}
.hc-title em{font-style:normal;color:var(--cta);background:linear-gradient(transparent 82%,rgba(226,86,12,.28) 0);white-space:nowrap}
.hc-sub{margin:0 0 .8rem;color:var(--muted);font-size:.95rem}
.hc-ticks{list-style:none;padding:0;margin:0 0 1.1rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem 1rem;font-size:.86rem;font-weight:600}
.hc-ticks li{display:flex;align-items:center;gap:.3rem}
.hc-ticks svg{color:var(--cta)}
.hc-card .btn-lg{margin-top:.2rem}
.hc-call{display:inline-flex;align-items:center;gap:.4rem;margin-top:.8rem;color:var(--muted);text-decoration:none;font-size:.9rem}
.hc-call b{color:var(--ink)}
.hc-call svg{color:var(--cta)}
.hc-card .disclosure{text-align:center;margin:.55rem 0 0;line-height:1.4}
.hc-card .form-msg{text-align:left}
/* The call button under the card, as wide as the card */
.hc-callbtn{display:flex;justify-content:center;max-width:560px;margin:1.1rem auto 0}
.hc-callbtn .btn{width:100%;justify-content:center;min-height:64px}
.hc-callbtn small{display:block;font-size:.86rem;font-weight:600;opacity:.95}
@media (max-width:639px){.hc-callbtn{width:88%;max-width:340px;margin-top:.9rem}}
/* The ad page: Netanel's offer as a coupon under the call button (Niv, 5 Nov 2026) */
.hc-offer{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.15rem .9rem;width:100%;max-width:560px;margin:.75rem auto 0;padding:.6rem .95rem;border:2px dashed var(--offer,#ffb067);border-radius:14px;background:color-mix(in srgb,var(--hero-bg) 72%,transparent);color:#fff;text-align:left;text-shadow:none;line-height:1.25}
.hc-offer-k[hidden]{display:none}
.hc-offer-k{grid-column:1/-1;font-size:.82rem;font-weight:600;color:#c9d6ee}
.hc-offer-k i{font-style:normal}
.hc-offer-v{font-size:1rem;font-weight:600}
.hc-offer-v b{color:var(--offer,#ffb067);font-size:1.45em;font-weight:800;margin-right:.1em}
.hc-offer-d{justify-self:end;padding:.3em .65em;border-radius:999px;background:var(--offer,#ffb067);color:var(--offer-ink,#0a1428);font-size:.82rem;font-weight:800;white-space:nowrap}
@media (max-width:639px){.hc-offer{width:88%;max-width:340px;padding:.55rem .8rem;gap:.1rem .6rem}.hc-offer-v{font-size:.9rem}.hc-offer-k{font-size:.76rem}.hc-offer-d{font-size:.74rem}}
/* The ad page: the call button in the hero, above the form (Niv, 5 Nov 2026) */
.hc-callbtn--top{width:100%;margin-top:1.15rem;text-shadow:none}
@media (max-width:639px){.hc-callbtn--top{margin-top:.95rem}}
/* The seal and the rat at the edges of the card */
.hc-seal,.hc-rat{position:absolute;z-index:2;height:auto;pointer-events:none;filter:drop-shadow(0 14px 22px rgba(0,0,0,.35))}
.hc-seal{width:128px;left:-14px;top:-118px;animation:mascotIn .7s .15s both cubic-bezier(.2,1.3,.4,1)}
.hc-rat{width:82px;right:-8px;top:-54px;animation:ratRun .7s .5s both ease-out}
@media (min-width:640px){.hc-seal{width:170px;left:-60px;top:-150px}.hc-rat{width:110px;right:-46px;top:-70px}}
@media (min-width:1024px){.hc-seal{width:270px;left:-235px;top:-30px}.hc-rat{width:160px;right:-170px;top:auto;bottom:90px}}
/* Phones: a narrower card, the seal peeking over its middle and the rat over its right corner, from behind;
   the whole form, button included, on the first screen */
@media (max-width:639px){
  .hc-inner{padding-top:26px;padding-bottom:152px}
  .hc-form{margin-top:-46px}
  .hc-box{width:88%;max-width:340px}
  .hc-card{padding:20px 16px 16px}
  .hc-seal{width:100px;left:calc(50% - 50px);top:-88px;z-index:0}
  .hc-rat{width:72px;right:4px;top:-52px;z-index:0}
  .hc-title{font-size:1.32rem;white-space:nowrap;margin-bottom:.25rem}
  .hc-sub{font-size:.86rem;margin-bottom:.55rem}
  .hc-ticks{flex-wrap:nowrap;gap:.6rem;font-size:.72rem;margin-bottom:.85rem}
  .hc-ticks li{gap:.2rem;white-space:nowrap}
  .hc-card input{min-height:48px}
  .hc-call{display:none}
  .hc-card .disclosure{font-size:.68rem}
}
/* A more compact form card on every page (Niv, 5 Nov 2026: "the rectangles are too big", the card took half a phone screen):
   lower fields and button, less padding and space between lines. Inputs keep 16px text so iPhones don't zoom in. */
.hc-card{padding:clamp(16px,2.6vw,24px) clamp(16px,2.6vw,26px) clamp(12px,2vw,18px)}
.hc-card .field{margin-bottom:.45rem}
.hc-card input[type=text],.hc-card input[type=tel]{min-height:0;padding:.62rem .9rem}
.hc-card .btn-lg{margin-top:.15rem;padding:.78rem 1.4rem}
.hc-sub{margin-bottom:.5rem}
.hc-ticks{margin-bottom:.7rem}
.hc-card .disclosure{margin-top:.4rem}
@media (max-width:639px){
  .hc-card{padding:15px 14px 11px}
  .hc-title{font-size:1.22rem;margin-bottom:.15rem}
  .hc-sub{font-size:.82rem;margin-bottom:.4rem}
  .hc-ticks{font-size:.7rem;margin-bottom:.6rem}
  .hc-card input[type=text],.hc-card input[type=tel]{min-height:0;padding:.55rem .8rem}
  .hc-card .field{margin-bottom:.4rem}
  .hc-card .btn-lg{padding:.72rem 1rem;font-size:1rem}
  .hc-card .disclosure{margin-top:.3rem;line-height:1.3}
}
/* Desktop (Niv, 25 Oct 2026: the photo looked cut off halfway down the card): the photo runs behind the whole form, down
   past the call button, and ends in solid navy. .hc goes static so the photo sizes to .hc-wrap; phones keep the short strip */
@media (min-width:640px){
  .hc-wrap{position:relative}
  .hc{position:static;overflow:visible}
  .hc-bg::after{background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 78%,transparent) 0%,color-mix(in srgb,var(--hero-bg) 50%,transparent) 30%,color-mix(in srgb,var(--hero-bg) 62%,transparent) 70%,var(--hero-bg) 100%)}
}
@media (prefers-reduced-motion:reduce){.hc-seal,.hc-rat{animation:none}}

/* ---------- Home trust strip with two items (trustShort): one per row on phones, left-aligned, no line between (Niv, 25 Oct 2026) ---------- */
.trust--two ul{display:flex;flex-wrap:nowrap;justify-content:center;gap:0;padding:.9rem 0}
.trust--two li{flex:0 1 auto;padding:.2rem 2rem}
@media (max-width:639px){
  .trust--two ul{flex-direction:column;align-items:flex-start;gap:.75rem;padding:1.05rem 0}
  .trust--two li{justify-content:flex-start;padding:0;white-space:normal}
}

/* ---------- Mid-page call card (midCta) ---------- */
.mid-cta{padding:clamp(10px,3vw,28px) 0 clamp(28px,5vw,56px)}
.mid-cta .container{padding-block:0}
.mid-cta-inner{position:relative;display:grid;gap:16px;align-items:center;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--radius) + 6px);padding:24px 20px;box-shadow:0 30px 60px -42px color-mix(in srgb,var(--hero-bg) 60%,transparent);overflow:hidden}
.mid-cta-inner::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--cta)}
.mid-cta img{width:92px;height:auto;margin:0 auto}
.mid-cta h2{font-size:clamp(1.35rem,2.6vw,1.85rem);margin:0 0 .35rem}
.mid-cta p{margin:0 auto;color:var(--muted);max-width:36em}
.mid-cta .cta-actions{display:grid;gap:10px;width:100%}
.mid-cta .cta-actions .btn{justify-content:center;margin:0}
@media (min-width:900px){
  .mid-cta-inner{grid-template-columns:110px minmax(0,1fr) auto;text-align:left;padding:26px 34px}
  .mid-cta-inner::before{right:auto;bottom:0;width:6px;height:auto}
  .mid-cta p{margin:0}
  .mid-cta .cta-actions{width:auto}
  .mid-cta-inner--text{grid-template-columns:minmax(0,1fr) auto;padding:30px 40px}
  .mid-cta-inner--text .cta-actions{grid-template-columns:auto auto}
}

/* ---------- Facts band with two facts ---------- */
@media (min-width:761px){.facts-band .facts:has(> li:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px;margin-inline:auto}}

/* ---------- Area tabs: the prompt over the region buttons (areaGroups.prompt) ---------- */
.area-prompt{display:flex;align-items:center;gap:.45rem;margin:0 0 .7rem;font-weight:700;font-size:1rem;color:var(--ink)}
.area-prompt::after{content:"";width:9px;height:9px;border-right:2px solid var(--cta);border-bottom:2px solid var(--cta);transform:rotate(45deg) translateY(-3px)}

/* ---------- "Free inspection" (freeOffer): a card top right on desktop, nothing on phones (Niv, 28 Oct 2026) ---------- */
.free-card{position:fixed;right:20px;top:calc(var(--hh,72px) + 16px);z-index:45;width:272px;background:var(--surface);color:var(--ink);border-radius:16px;padding:16px;box-shadow:0 30px 60px -22px color-mix(in srgb,var(--hero-bg) 60%,transparent),0 0 0 1px var(--line);overflow:hidden;transition:opacity .25s,transform .25s,visibility .25s}
.free-card::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--cta)}
.free-card.is-off{opacity:0;visibility:hidden;transform:translateY(-12px)}
.free-full{display:grid;grid-template-columns:58px 1fr;gap:4px 12px;align-items:center}
.free-full img{width:58px;height:auto}
.free-k{margin:0;font:var(--display-weight) 1.2rem/1.15 var(--font-display);color:var(--cta)}
.free-t{margin:.25rem 0 0;font-size:.8rem;line-height:1.4;color:var(--muted)}
.free-full .btn{grid-column:1/-1;margin-top:10px;justify-content:center}
.free-call{grid-column:1/-1;text-align:center;font-size:.8rem;color:var(--muted);text-decoration:none;margin-top:4px}
.free-call b{color:var(--ink)}
.free-x{position:absolute;right:6px;top:8px;width:30px;height:30px;display:grid;place-items:center;border:0;background:none;color:var(--muted);cursor:pointer;border-radius:50%}
.free-x:hover{background:var(--brand-tint)}
.free-pill{display:none}
.free-pill::after{content:"›";font-size:1.1rem;margin-left:.1rem}
.free-card.is-min{width:auto;padding:0;border-radius:999px;background:var(--cta)}
.free-card.is-min::before,.free-card.is-min .free-full,.free-card.is-min .free-x{display:none}
.free-card.is-min .free-pill{display:inline-flex;align-items:center;gap:.45rem;border:0;background:var(--cta);color:#fff;font:700 .92rem var(--font-body);padding:.75rem 1.2rem;cursor:pointer;border-radius:999px}
/* Under 1700px wide the full card would cover the page: it rests as a pill and opens on hover or focus */
@media (min-width:901px) and (max-width:1699px){
  .free-card:not(.is-min):not(:hover):not(:focus-within){width:auto;padding:0;border-radius:999px;background:var(--cta)}
  .free-card:not(.is-min):not(:hover):not(:focus-within)::before,
  .free-card:not(.is-min):not(:hover):not(:focus-within) .free-full,
  .free-card:not(.is-min):not(:hover):not(:focus-within) .free-x{display:none}
  .free-card:not(.is-min):not(:hover):not(:focus-within) .free-pill{display:inline-flex;align-items:center;gap:.45rem;border:0;background:var(--cta);color:#fff;font:700 .92rem var(--font-body);padding:.75rem 1.2rem;cursor:pointer;border-radius:999px}
}
@media (max-width:900px){.free-card{display:none}}

/* ---------- "Our work and reviews" carousel (reviews; Niv, 25 Oct 2026) ---------- */
.rv{background:var(--brand-tint)}
.rv .section-head{margin-bottom:1.2rem}
.rv-carousel{min-width:0}
.rv-track{--g:clamp(18px,4vw,40px);display:grid;grid-auto-flow:column;grid-auto-columns:84%;gap:14px;align-items:start;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--g);padding:6px var(--g) 14px;margin-inline:calc(var(--g) * -1);scrollbar-width:none;overscroll-behavior-x:contain;outline:none;overflow-y:hidden;box-sizing:border-box;transition:height .3s ease}
.rv-track::-webkit-scrollbar{display:none}
@media (min-width:640px){.rv-track{grid-auto-columns:calc((100% - 2 * var(--g) - 14px) / 2.15)}}
@media (min-width:1024px){.rv-track{grid-auto-columns:calc((100% - 2 * var(--g) - 28px) / 3)}}
.rv-card{scroll-snap-align:start;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 22px 44px -30px color-mix(in srgb,var(--hero-bg) 50%,transparent);display:flex;flex-direction:column;overflow:hidden}
.rv-photo{position:relative;aspect-ratio:16/10;background:#eef2f8;overflow:hidden}
.rv-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.rv-photo--ba{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:#fff}
.rv-photo--ba img{position:static}
.rv-tag{position:absolute;left:10px;bottom:10px;background:color-mix(in srgb,var(--hero-bg) 86%,transparent);color:#fff;font-size:.7rem;font-weight:600;padding:.3rem .55rem;border-radius:6px}
.rv .ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;text-align:center;color:#5d6e88;background:repeating-linear-gradient(135deg,#f1f5fb 0 12px,#e8eef7 12px 24px);border:2px dashed #c3cfe0;font-size:.8rem;font-weight:600;height:100%}
.rv-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:.55rem;flex:1}
.rv .stars{color:#f6b400;letter-spacing:.06em;font-size:1rem;line-height:1}
.rv-body p{margin:0;font-size:.95rem;line-height:1.55}
.rv .ph-line{display:block;padding:.9rem;border:2px dashed #c3cfe0;border-radius:8px;color:#5d6e88;font-size:.85rem;font-weight:600}
.rv-meta{margin-top:auto;display:flex;flex-direction:column;gap:.1rem;font-size:.82rem;color:var(--muted)}
.rv-meta b{color:var(--ink);font-size:.92rem}
.rv-ctrl{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:6px}
.rv-arrow{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.rv-dots{display:flex;gap:6px}
.rv-dots button{width:8px;height:8px;border-radius:5px;border:0;padding:0;background:#c3cfe0;cursor:pointer;transition:width .2s}
.rv-dots button[aria-current="true"]{background:var(--cta);width:22px}

/* ---------- Glass service cards (servicesSection.glass; Niv, 25 Oct 2026): the name centered on a frosted tint ---------- */
.glass-cards{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;isolation:isolate}
@media (min-width:900px){.glass-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
/* soft color behind the cards, so the frosted glass has something to blur */
.glass-cards::before{content:"";position:absolute;inset:-6% -4%;z-index:-1;pointer-events:none;filter:blur(36px);opacity:.5;
  background:radial-gradient(40% 48% at 20% 25%,rgba(31,95,214,.32),transparent 70%),radial-gradient(40% 48% at 80% 75%,rgba(11,61,107,.30),transparent 70%)}
.glass-card{position:relative;display:grid;place-items:center;min-height:118px;padding:18px 14px;border-radius:18px;text-align:center;text-decoration:none;overflow:hidden;
  color:color-mix(in srgb,var(--c) 72%,var(--hero-bg));
  background:linear-gradient(145deg,color-mix(in srgb,var(--c) 20%,rgba(255,255,255,.72)),color-mix(in srgb,var(--c) 7%,rgba(255,255,255,.55)));
  border:1px solid color-mix(in srgb,var(--c) 30%,rgba(255,255,255,.6));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 color-mix(in srgb,var(--c) 18%,transparent),0 18px 38px -24px color-mix(in srgb,var(--c) 70%,transparent);
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  transition:transform .2s ease,box-shadow .2s ease}
/* a light sheen across the top */
.glass-card::before{content:"";position:absolute;inset:0 0 55% 0;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));pointer-events:none}
.glass-card span{position:relative;font:var(--display-weight) clamp(1.02rem,2.2vw,1.25rem)/1.2 var(--font-display);letter-spacing:-.01em;max-width:12em}
.glass-card:hover{transform:translateY(-3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 24px 44px -22px color-mix(in srgb,var(--c) 80%,transparent)}
.glass-card:focus-visible{outline:2px solid var(--c);outline-offset:3px}
@media (min-width:900px){.glass-card{min-height:140px}}
@media (prefers-reduced-motion:reduce){.glass-card{transition:none}}

/* ---------- Photo service cards (servicesSection.photoCards; Niv, 25 Oct 2026): the name over a picture ---------- */
.photo-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:900px){.photo-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
.photo-card{position:relative;display:block;aspect-ratio:1/1;border-radius:18px;overflow:hidden;text-decoration:none;color:#fff;background:var(--hero-bg);isolation:isolate;
  box-shadow:0 18px 38px -24px color-mix(in srgb,var(--hero-bg) 75%,transparent);transition:transform .2s ease,box-shadow .2s ease}
@media (min-width:900px){.photo-card{aspect-ratio:4/3}}
.photo-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}
.photo-card:hover{transform:translateY(-3px);box-shadow:0 26px 46px -22px color-mix(in srgb,var(--hero-bg) 85%,transparent)}
.photo-card:hover img{transform:scale(1.06)}
.photo-card:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.pc-label b{font:var(--display-weight) clamp(1rem,2.2vw,1.3rem)/1.18 var(--font-display);letter-spacing:-.01em}
.pc-label i{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-style:normal}
.photo-credit{margin:14px 0 0;font-size:.82rem;color:var(--muted)}
/* real: navy fade from the bottom, the name and one line in white, an orange arrow */
.photo-card--real::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 0%,transparent) 30%,color-mix(in srgb,var(--hero-bg) 55%,transparent) 58%,color-mix(in srgb,var(--hero-bg) 94%,transparent))}
.photo-card--real .pc-label{position:absolute;inset:auto 0 0 0;display:grid;grid-template-columns:1fr auto;align-items:end;gap:4px 10px;padding:16px}
.photo-card--real .pc-label b{grid-column:1}
.photo-card--real .pc-label small{grid-column:1;font-size:.86rem;line-height:1.35;color:#d5dfee;display:none}
.photo-card--real .pc-label i{grid-column:2;grid-row:1/span 2;background:var(--cta);color:#fff}
@media (min-width:900px){.photo-card--real .pc-label{padding:20px}.photo-card--real .pc-label small{display:block}}
/* glass: a frosted bar along the bottom, white text */
.photo-card--glass::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 5%,transparent),color-mix(in srgb,var(--hero-bg) 35%,transparent))}
.photo-card--glass .pc-label{position:absolute;inset:auto 10px 10px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 12px 16px;border-radius:14px;
  background:color-mix(in srgb,var(--hero-bg) 38%,transparent);border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%)}
.photo-card--glass .pc-label b{text-shadow:0 1px 8px rgba(0,0,0,.35)}
.photo-card--glass .pc-label i{background:rgba(255,255,255,.95);color:var(--hero-bg);width:30px;height:30px}
/* band: the picture on top, a solid navy band under it with the name in white */
.photo-card--band{display:grid;grid-template-rows:1fr auto;aspect-ratio:auto}
.photo-card--band img{position:static;grid-row:1;aspect-ratio:4/3;height:auto;z-index:auto}
.photo-card--band .pc-label{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;background:var(--hero-bg);min-height:62px}
.photo-card--band .pc-label i{background:var(--cta);color:#fff;width:30px;height:30px}
@media (min-width:900px){.photo-card--band .pc-label{padding:16px 18px;min-height:72px}}
@media (max-width:899px){.pc-label b{font-size:.98rem}.photo-card--real .pc-label,.photo-card--glass .pc-label{padding:10px 10px 10px 12px}.pc-label i{width:28px;height:28px}}
@media (prefers-reduced-motion:reduce){.photo-card,.photo-card img{transition:none}}

/* ---------- Orange is call, blue is book (bookBlue; Niv, 25 Oct 2026) ---------- */
.book-blue .lead-form [data-submit],.book-blue .free-full .btn-cta{background:var(--brand);color:#fff;box-shadow:0 12px 28px -14px var(--brand)}
.book-blue .lead-form [data-submit]:hover,.book-blue .free-full .btn-cta:hover{filter:brightness(1.08)}
.book-blue .free-card::before{background:var(--brand)}
.book-blue .free-k{color:var(--brand)}
.book-blue .free-card.is-min,.book-blue .free-card.is-min .free-pill{background:var(--brand)}
@media (min-width:901px) and (max-width:1699px){
  .book-blue .free-card:not(.is-min):not(:hover):not(:focus-within),
  .book-blue .free-card:not(.is-min):not(:hover):not(:focus-within) .free-pill{background:var(--brand)}
}

/* Book buttons are always filled blue, never just an outline (Niv, 25 Oct 2026): the header, the mid-page card, the
   closing band and the phone bar, on pages with the form (#quote) and without it (/book/) */
.book-blue .mid-cta .btn-outline,
.book-blue .site-header .header-actions a.btn[href$="#quote"],.book-blue .site-header .header-actions a.btn[href="/book/"],
.book-blue .cta-band .cta-actions a.btn[href$="#quote"],.book-blue .cta-band .cta-actions a.btn[href="/book/"],
.book-blue .mobile-bar a.btn[href$="#quote"],.book-blue .mobile-bar a.btn[href="/book/"]{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 12px 28px -14px var(--brand)}
.book-blue .mid-cta .btn-outline:hover{background:var(--brand);filter:brightness(1.08)}

/* Trust strip: a fine hairline between the two items that fades out (Niv, 25 Oct 2026) */
.trust--two li{position:relative}
.trust--two li+li::before{content:"";position:absolute;left:0;top:18%;width:1px;height:64%;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0))}
@media (max-width:639px){
  .trust--two ul{gap:0}
  .trust--two li{padding:.55rem 0}
  .trust--two li+li::before{top:0;left:0;width:78%;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.65),rgba(255,255,255,.18) 60%,rgba(255,255,255,0))}
}

/* The desktop pill is orange; the book button inside the open card stays blue. */
.book-blue .free-card.is-min,.book-blue .free-card.is-min .free-pill{background:var(--cta)}
@media (min-width:901px) and (max-width:1699px){
  .book-blue .free-card:not(.is-min):not(:hover):not(:focus-within),
  .book-blue .free-card:not(.is-min):not(:hover):not(:focus-within) .free-pill{background:var(--cta)}
}

/* ---------- Google reviews in the carousel (reviews.google; Niv, 25 Oct 2026) ---------- */
.rv-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.6rem 2rem}
.rv-head .section-head{margin-bottom:0}
.rv-head{margin-bottom:1.2rem}
@media (min-width:901px){.rv-head{margin-bottom:2rem}} /* room under the lede on laptops (Niv, 25 Oct 2026) */
/* The reviews line on one line on every screen (Niv, 26 Oct 2026): as big as fits, never above the laptop size. One line of it
   is about 23 times its font size wide; the box is the screen minus 36px of gutters. */
.rv-head .section-head p:not(.eyebrow){white-space:nowrap;font-size:min(1.08rem,calc((100vw - 36px) / 24))}
@media (max-width:900px){.rv-head{margin-bottom:.9rem}}
.rv-score{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:.6rem .95rem;box-shadow:0 14px 30px -24px color-mix(in srgb,var(--hero-bg) 50%,transparent);margin-bottom:1.2rem}
.rv-score>b{font:var(--display-weight) 2rem/1 var(--font-display)}
.rv-score .stars{display:block;font-size:1.05rem}
.rv-score small{display:flex;align-items:center;gap:.35rem;margin-top:.25rem;font-size:.8rem;color:var(--muted)}
.rv-score:hover small{color:var(--brand)}
.rv-card--g .rv-body{gap:.6rem}
.rv-who{display:flex;align-items:center;gap:.6rem}
.rv-who b{font-size:.95rem;line-height:1.2}
.rv-who .g-logo{margin-left:auto;flex:none}
.rv-av{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:1rem}
.rv-text{margin:0;font-size:.93rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.rv-text.is-open{-webkit-line-clamp:unset;display:block}
.rv-more{align-self:flex-start;border:0;background:none;padding:0;color:var(--brand);font:600 .85rem var(--font-body);cursor:pointer}
.rv-pics{display:flex;gap:6px;margin-top:.2rem}
.rv-pics img{flex:1 1 0;min-width:0;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:8px;display:block}
.rv-pics img:only-child{aspect-ratio:16/10}

/* Carousel arrows on the carousel itself, left and right at mid-height, only the dots underneath (Niv, 25 Oct 2026) */
.rv-carousel{position:relative}
.rv-ctrl{margin-top:2px}
.rv-carousel .rv-arrow{position:absolute;z-index:3;top:calc((100% - 22px) / 2);transform:translateY(-50%);width:44px;height:44px;background:rgba(255,255,255,.94);border:1px solid var(--line);box-shadow:0 10px 24px -10px color-mix(in srgb,var(--hero-bg) 45%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.rv-carousel .rv-arrow:hover{transform:translateY(-50%) scale(1.06)}
.rv-carousel [data-prev]{left:-10px}
.rv-carousel [data-next]{right:-10px}
@media (max-width:639px){.rv-carousel [data-prev]{left:-6px}.rv-carousel [data-next]{right:-6px}.rv-carousel .rv-arrow{width:40px;height:40px}}
.rv-dots button{width:7px;height:7px}
.rv-dots button[aria-current="true"]{width:18px}

/* The old top bar's checks under the hero call button, laptops only (heroChecks; Niv, 25 Oct 2026) */
.hero-checks{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:.86rem;font-weight:500;opacity:.9}
.hero-checks li{display:inline-flex;align-items:center;gap:.4rem}
.hero-checks svg{color:var(--cta)}
.hc-form .hero-checks{justify-content:center;color:#fff}
@media (max-width:900px){.hero-checks{display:none}}
/* Under the hero form: a bit bigger, and the same gap above (to the call button) as below (to the blue band) (Niv, 25 Oct 2026) */
@media (min-width:901px){.hc-form{padding-bottom:26px}.hc-form .hero-checks{margin-top:26px;font-size:.95rem}}

/* "Our work" (Niv, 28 Oct 2026): Netanel's real job photos. Before/after pairs, a photo grid, and a lightbox. */
/* Flex with a centred last row, so a short last row sits in the middle instead of leaving a gap on the right */
.wk-pairs{display:flex;flex-direction:column;gap:18px}
@media (min-width:760px){.wk-pairs{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:22px}.wk-pair{flex:0 0 calc((100% - 22px)/2);min-width:0}}
.wk-pair{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.section--alt .wk-pair{background:var(--bg)}
.wk-pair-pics{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:var(--line)}
.wk-side{position:relative}
.wk-pair figcaption{padding:.8rem 1rem .9rem;font-size:.95rem;line-height:1.4}
.wk-tag{position:absolute;left:10px;top:10px;background:color-mix(in srgb,var(--hero-bg) 88%,transparent);color:#fff;font-size:.74rem;font-weight:600;padding:.28rem .6rem;border-radius:6px;pointer-events:none}
.wk-tag--after{background:#0f7a43}
.wk-pic{display:block;position:relative;aspect-ratio:1/1;overflow:hidden;background:#e7ecf3;cursor:zoom-in}
.wk-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.wk-pic:hover img{transform:scale(1.04)}
.wk-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px}.wk-grid .wk-pic{flex:0 0 calc((100% - 10px)/2);min-width:0}
@media (min-width:640px){.wk-grid{gap:14px}.wk-grid .wk-pic{flex-basis:calc((100% - 28px)/3)}}
@media (min-width:1000px){.wk-grid .wk-pic{flex-basis:calc((100% - 42px)/4)}}
.wk-grid .wk-pic{border-radius:calc(var(--radius) - 4px)}
.wk-more{margin:26px 0 0;text-align:center}
.wk-more .btn{display:inline-flex;align-items:center;gap:.5rem}
.wk-jump{display:flex;flex-wrap:wrap;gap:8px;margin:clamp(34px,4vw,52px) 0 0}
.wk-jump a{padding:.5rem .9rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:inherit;text-decoration:none;font-size:.9rem;font-weight:500}
.wk-jump a:hover{border-color:var(--brand)}
.wk-group{margin-top:clamp(34px,4vw,52px);scroll-margin-top:96px}
.wk-group h2{margin:0 0 .35rem}
.wk-group>p{margin:0}
.wk .photo-credit{margin-top:28px}
.lb{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:56px 12px 20px;background:rgba(5,12,24,.94);color:#fff}
.lb[hidden]{display:none}
.lb img{max-width:min(100%,1100px);max-height:calc(100vh - 150px);object-fit:contain;border-radius:8px;background:#111}
.lb p{margin:0;max-width:760px;text-align:center;font-size:.95rem;line-height:1.4;opacity:.92}
.lb small{opacity:.65}
.lb button{position:absolute;display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.lb button:hover{background:rgba(255,255,255,.26)}
.lb .lb-x{top:10px;right:10px}
.lb .lb-prev{left:10px;top:50%;transform:translateY(-50%)}
.lb .lb-next{right:10px;top:50%;transform:translateY(-50%)}
@media (max-width:640px){.lb .lb-prev,.lb .lb-next{top:auto;bottom:14px;transform:none}}
body.lb-open{overflow:hidden}

/* The reviews' label, small under the carousel (Niv, 5 Nov 2026) */
.rv-note{margin:.9rem auto 0;text-align:center;font-size:.8rem;color:var(--muted,#64748b);max-width:40em}

/* The form card's text (Niv, 5 Nov 2026): the reply line and the three ticks bigger, the placeholders a little smaller.
   Only the placeholder shrinks: typed text stays 16px so iPhones don't zoom in on the field. */
.hc-sub{font-size:1.02rem}
.hc-ticks{font-size:.95rem}
.hc-card .hc-ticks svg{width:17px;height:17px;flex:none}
.hc-card input::placeholder{font-size:.88em}
@media (max-width:639px){
  .hc-sub{font-size:.92rem}
  .hc-card .hc-ticks{font-size:.79rem;gap:.45rem}
  .hc-card .hc-ticks li{gap:.15rem}
  .hc-card .hc-ticks svg{width:15px;height:15px}
}

/* Readable sizes for an older audience (s.readable → body.type-read; SealWell, Niv, 5 Nov 2026). Measured at 390px with
   scripts/font-audit.mjs: no label under 13px, fine print at 12px, trust items and buttons' small lines at 15-16px. */
.type-read .logo-area{font-size:12px}
.type-read .hc-open{font-size:14.5px}
.type-read .hc-callbtn small{font-size:15px}
.type-read .hc-offer-k{font-size:13.5px}
.type-read .hc-offer-v{font-size:15.5px}
.type-read .hc-offer-d{font-size:13px}
.type-read .hc-sub{font-size:15.5px}
.type-read .disclosure{font-size:12px}
.type-read .eyebrow{font-size:14px}
.type-read .rv-more{font-size:15px}
.type-read .rv-note,.type-read .facts small{font-size:13.5px}
.type-read .photo-credit{font-size:14px}
.type-read .area-tablist button,.type-read .area-tablist [role=tab]{font-size:15px}
.type-read .license-line,.type-read .footer-disclosure{font-size:13.5px}
.type-read .footer-grid h3,.type-read .footer-grid h4,.type-read .footer-grid .foot-h{font-size:14px}
.type-read .trust--two li span{font-size:16px}
@media (max-width:480px){.type-read .hc-open{font-size:13.5px}}

/* The site extras inside the inner heroes, left-aligned with the copy (Niv, 5 Nov 2026) */
.hero-copy .hc-open,.hero--slim .hc-open{margin:1rem 0 0}
.hero-copy .hc-offer,.hero--slim .hc-offer{margin:1rem 0 0;width:100%;max-width:480px}
.hero--slim .hc-callbtn{margin:1rem 0 0;width:100%;max-width:480px}
@media (max-width:639px){.hero-copy .hc-offer,.hero--slim .hc-offer,.hero--slim .hc-callbtn{width:100%;max-width:none}}

/* The hero's second line in a red box, the Rodents Stop look (layout.heroBox, Niv, 5 Nov 2026) */
.hc-h1--box .hc-t2{background:var(--cta);color:#fff;padding:.06em .34em .1em;border-radius:8px;font-size:clamp(1.55rem,5vw,3.1rem);text-shadow:none;box-shadow:0 10px 26px -12px var(--cta)}
.hc-h1--box .hc-t2 svg{color:#fff}
/* The $150 coupon sliding in after a scroll (go.offerPop, Niv, 5 Nov 2026) */
.offer-pop{position:fixed;left:14px;right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:58;max-width:390px;margin:0 auto;padding:12px;border-radius:18px;background:var(--hero-bg);box-shadow:0 24px 50px -16px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08);transform:translateY(130%);opacity:0;visibility:hidden;transition:transform .45s cubic-bezier(.2,1.2,.4,1),opacity .3s,visibility .45s}
.offer-pop.is-in{transform:none;opacity:1;visibility:visible}
.offer-pop .hc-offer{margin:0;width:100%;max-width:none;background:transparent}
.op-x{position:absolute;top:-11px;right:-11px;width:30px;height:30px;border-radius:50%;border:0;display:grid;place-items:center;background:#fff;color:var(--ink);box-shadow:0 6px 16px -6px rgba(0,0,0,.5);cursor:pointer}
.op-call{width:100%;justify-content:center;margin-top:10px;padding:.85rem 1rem}
@media (min-width:901px){.offer-pop{left:24px;right:auto;bottom:24px;width:380px;margin:0}}
@media (prefers-reduced-motion:reduce){.offer-pop{transition:opacity .2s,visibility .2s;transform:none}}

/* The hero's small red line on top and the facts line under the headline, the Rodent Control Inc look (Niv, 5 Nov 2026) */
.hc-eyebrow{margin:0 0 .7em;color:var(--hero-accent,#ff5a5f);font-weight:800;font-size:clamp(.82rem,2.2vw,1rem);letter-spacing:.08em;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.hc-sub-line{margin:.75em auto 0;max-width:44em;text-wrap:balance;color:#fff;font-weight:700;font-size:clamp(.95rem,2.4vw,1.15rem);line-height:1.4;text-shadow:0 2px 14px rgba(0,0,0,.6)}
/* The hero call button, bigger text on computers (Niv, 5 Nov 2026) */
@media (min-width:901px){.hc-callbtn--top .btn{min-height:84px;gap:.8rem}.hc-callbtn--top .btn svg{width:28px;height:28px}.hc-callbtn--top .btn small{font-size:1.3rem;opacity:1;letter-spacing:0}.hc-callbtn--top b{font-size:2.1rem}}

/* ---------- No form on the first screen (layout.formBelow, Niv, 5 Nov 2026): the hero ends in a book button and the proof
   badges (Rodent Control Inc's badge row), and the form follows on a plain background ---------- */
.hc--solo .hc-inner{padding-bottom:clamp(30px,5vw,56px)}
.hc-wrap--solo .hc{position:relative;overflow:hidden}
.hc-wrap--solo .hc-bg::after{background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 80%,transparent) 0%,color-mix(in srgb,var(--hero-bg) 55%,transparent) 45%,color-mix(in srgb,var(--hero-bg) 88%,transparent) 100%)}
.hc-bookbtn{width:100%;max-width:560px;margin-top:.7rem;justify-content:center;background:var(--brand);border-color:var(--brand);color:#fff}
.hc-bookbtn:hover{background:var(--brand);filter:brightness(1.12)}
.hc-callbtn--top{max-width:560px}
.proof-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:1.3rem;width:100%;max-width:640px}
.pb{display:inline-flex;align-items:center;gap:.6rem;background:#fff;color:#16181b;border-radius:12px;padding:.55rem .95rem;text-decoration:none;box-shadow:0 8px 22px -12px rgba(0,0,0,.6);text-align:left;line-height:1.15}
a.pb:hover{transform:translateY(-1px)}
.pb .i{color:var(--cta);flex:none}
.pb-logo{flex:none}
.pb-t{display:flex;flex-direction:column}
.pb-t b{font-size:1.02rem;font-weight:800;display:inline-flex;align-items:center;gap:.3rem}
.pb-t small{font-size:.8rem;color:#5c6169;font-weight:500}
.pb-stars{color:#f5b301;font-size:.9rem;letter-spacing:.02em}
.pb-note{margin:.55rem 0 0;font-size:.78rem;color:var(--hero-muted,#b7bbc2)}
.hc-form--below{margin-top:0;padding-top:clamp(28px,5vw,48px);background:var(--bg)}
.hc-form--below .hero-checks{color:var(--ink)}
@media (max-width:639px){
  .hc--solo .hc-inner{padding-bottom:26px}
  .proof-badges{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .pb{padding:.5rem .65rem;gap:.45rem}
  .pb-t b{font-size:.95rem}
  .pb-t small{font-size:.74rem}
  .hc-form--below{margin-top:0}
  .hc-form--below .hc-box{width:100%;max-width:420px}
}
/* Phones, a calmer first screen (Niv, 5 Nov 2026: "too condensed"): no facts line (the call button and badges carry it),
   a slimmer book button, more air between the groups */
@media (max-width:639px){
  .hc--solo .hc-sub-line{display:none}
  .hc--solo .hc-open{margin-top:1rem}
  .hc--solo .hc-callbtn--top{margin-top:1.1rem}
  .hc--solo .hc-bookbtn{padding:.7rem 1rem;font-size:1rem;margin-top:.6rem}
  .hc--solo .proof-badges{margin-top:1.4rem}
  .pb-t b{white-space:nowrap}
}

/* The hero's facts as check bullets (heroSub as a list, Niv, 5 Nov 2026), on phones too */
.hc-ticks-line{list-style:none;margin:.9rem 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem 1.4rem;font-weight:700;font-size:clamp(1rem,2.4vw,1.15rem);color:#fff}
.hc-ticks-line li{display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap}
.hc-ticks-line .i{color:#3ddc84;flex:none}
@media (max-width:639px){.hc-ticks-line{gap:.3rem .9rem;font-size:.95rem;margin-top:.75rem}}

/* ---------- The truck photo in the hero (images.heroFigure, Niv, 5 Nov 2026): no darkened photo behind the text, a dark hero
   with a soft red glow, and the photo itself shown clearly: on phones under the call button, on desktop right of the text ---------- */
.hc--fig{background:radial-gradient(120% 70% at 50% 0%,color-mix(in srgb,var(--cta) 18%,var(--hero-bg)) 0%,var(--hero-bg) 60%)}
.hc-fig{margin:1.2rem 0 0;width:100%;max-width:620px}
.hc-fig img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 22px 50px -20px rgba(0,0,0,.75)}
.hc--fig .proof-badges{margin-top:1rem}
@media (max-width:639px){
  .hc--fig .hc-inner{padding-top:20px}
  .hc-fig{margin-top:1rem}
  .hc-fig img{border-radius:14px;aspect-ratio:4/3;object-fit:cover}
  .hc--fig .proof-badges{margin-top:.85rem}
}
@media (min-width:900px){
  .hc--fig .hc-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:clamp(32px,4vw,64px);align-items:center;justify-items:start;text-align:left;padding-block:clamp(36px,4vw,60px)}
  .hc--fig .hc-inner>*{grid-column:1}
  .hc--fig .hc-fig{grid-column:2;grid-row:1 / span 9;align-self:center;max-width:none;margin:0}
  .hc--fig .hc-fig img{border-radius:18px;aspect-ratio:1024/572;object-fit:cover}
  .hc--fig .hc-h1{text-align:left;align-items:flex-start}
  .hc--fig .hc-ticks-line,.hc--fig .proof-badges{justify-content:flex-start}
  .hc--fig .hc-callbtn--top{max-width:none}
  .hc--fig .pb-note{text-align:left}
}

/* ---------- The bands above the header (topStrip, Niv, 5 Nov 2026, like Rodent Control Inc) ---------- */
.top-strip{text-align:center}
.ts-lic{margin:0;background:#2b2e33;color:#e9eaec;font-size:.86rem;font-weight:600;padding:.5rem 16px;display:flex;align-items:center;justify-content:center;gap:.45rem;line-height:1.35}
.ts-lic .i{color:#ff5a5f;flex:none}
.ts-lic i{font-style:normal;opacity:.6;margin:0 .45rem}
.ts-band{background:#eef0f2;border-bottom:1px solid #dfe2e6;padding:.55rem 0 .6rem}
.ts-band .container{padding-block:0}
.ts-band p{margin:0;line-height:1.35}
.ts-k{color:var(--cta);font-weight:800;font-size:1.02rem;letter-spacing:.01em}
.ts-l{color:#3c4047;font-size:.92rem;font-weight:500;margin-top:.1rem}
@media (max-width:639px){
  .ts-lic{font-size:.8rem;padding:.45rem 12px;flex-wrap:wrap}
  .ts-lic span{display:inline}
  .ts-k{font-size:.98rem}
  .ts-l{font-size:.86rem}
}

.ts-lic{display:block}
.ts-lic .i{display:inline-block;vertical-align:-2px;margin-right:.35rem}
.ts-lic span+span::before{content:"·";opacity:.6;margin:0 .5rem}
@media (max-width:639px){.ts-lic .ts-desk{display:none}.ts-lic{white-space:nowrap}}
/* the headline in the narrower left column next to the truck photo (desktop) */
@media (min-width:900px){
  .hc--fig .hc-t1{font-size:clamp(2.4rem,3.7vw,3.5rem);text-wrap:balance}
  .hc--fig .hc-h1--box .hc-t2{font-size:clamp(1.5rem,2.4vw,2.3rem);white-space:nowrap}
}

/* ---------- Phones: the truck picture is the hero's full background (heroFigure.bgPhone, Niv, 5 Nov 2026, like Rodents Stop and
   Rodent Control Inc): the text sits on its sky, the truck and the door logo show under the call button, the badges at the
   bottom on the road. Dark at the top for the white text, clear in the middle, dark again under the badges. ---------- */
@media (max-width:899px){
  .hc--fig .hc-inner{min-height:min(820px,calc(100svh - 40px));padding-bottom:18px}
  .hc--fig .hc-fig{position:absolute;inset:0;margin:0;max-width:none;width:auto;z-index:-1}
  .hc--fig .hc-fig picture{display:block;width:100%;height:100%}
  .hc--fig .hc-fig img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:88% bottom;border-radius:0;box-shadow:none}
  .hc--fig .hc-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--hero-bg) 88%,transparent) 0%,color-mix(in srgb,var(--hero-bg) 70%,transparent) 30%,color-mix(in srgb,var(--hero-bg) 20%,transparent) 52%,transparent 62%,transparent 80%,color-mix(in srgb,var(--hero-bg) 70%,transparent) 100%)}
  .hc--fig .proof-badges{margin-top:auto}
  .hc--fig{background:var(--hero-bg)}
}

/* Inner pages with the home hero (layout.innerCenter): their crumbs and intro sit above the form */
.hc-form--below .crumbs{margin:0 auto .6rem;max-width:760px}
.hc-lede-below{max-width:680px;margin:0 auto 1.4rem;text-align:center;color:var(--muted);font-size:1.05rem;line-height:1.6}
@media (max-width:639px){.hc-form--below .crumbs{display:none}.hc-lede-below{font-size:.98rem;margin-bottom:1.1rem}}
/* Desktop: the truck photo is the background on the right, fading into the dark behind the text on the left (Niv, 5 Nov 2026,
   "for now", until a wide version exists) */
@media (min-width:900px){
  .hc--fig .hc-inner{grid-template-columns:minmax(0,560px) 1fr;min-height:560px}
  .hc--fig .hc-fig{position:absolute;top:0;right:0;bottom:0;width:66%;margin:0;z-index:-1;grid-column:auto;grid-row:auto}
  .hc--fig .hc-fig picture{display:block;width:100%;height:100%}
  .hc--fig .hc-fig img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center 45%;border-radius:0;box-shadow:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 38%);mask-image:linear-gradient(90deg,transparent 0%,#000 38%)}
  .hc--fig .hc-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--hero-bg) 0%,color-mix(in srgb,var(--hero-bg) 55%,transparent) 30%,transparent 55%),linear-gradient(0deg,color-mix(in srgb,var(--hero-bg) 45%,transparent),transparent 30%)}
}
@media (min-width:900px){.hc--fig .hc-inner{position:static}.hc--fig{position:relative}}
@media (min-width:900px){.hc--fig .hc-fig{align-self:stretch;justify-self:stretch}}