/* =============================================================
   ClassicPages-PMO.css
   Internal version: V1 | 2026-08-03 CST

   The nine standalone pages that have not been redesigned yet:
   contact-us, customer-reviews, image-copyright-policy, pricing, privacy-policy,
   service-areas, services, terms-conditions, thank-you.

   WHY IT EXISTS
   These nine were loading the whole legacy sheet and using 26% of it. Measured by
   taking every identifier that appears in their page source, markup and script both,
   and keeping only the rules whose classes actually turn up. 73% of that sheet was
   dead weight to them.

   DELIBERATELY NOT INCLUDED, they stay on the legacy sheet:
   the pest library hub and its 28 species pages, and the article pages
   /pest-articles/ and /pest-in-your-city/. A parallel session owns those.

   THIS FILE IS TEMPORARY. Every one of these nine pages is queued for a redesign onto
   the v2 system. As each is rebuilt it gets pmo_design=v2, stops loading this sheet,
   and picks up the v2 sheets instead. When the last one moves, delete this file, its
   entry in Deploy-Snippets-PMO.py, and its snippet.
   ============================================================= */

/*

=============================================================

  PEST ME OFF - GLOBAL CSS

  Paste into: WP Code plugin as a CSS snippet

  Version: V129 | 2026-05-16 00:00 CST

  Covers all service pages, the About page, the Services hub page,

  the Homepage widget, all City Page widgets, the Pest Library hub,

  the Pricing page, the site Footer (V76+), blog post layout (V108+),

  Pest Articles hub (V118+), and City Gallery hub (V118+).

  Do NOT add page-specific CSS here except About page, Services hub,

  Homepage widget, Pest Library hub, and Pricing page classes.

  NEVER remove, rename, or change any existing CSS class or property.

  Only add new classes.



  V101 | 2026-05-10 22:00

  Full-bleed extended to .hero-bar pages (Services, Contact, Pricing).

  Added :has(.hero-bar) selectors alongside existing :has(.hero) rules so

  pages using the compact hero-bar header also get GP article padding removed.



  V99 | 2026-05-11 10:00

  faq-phone hover: added .faq-phone:hover rule (color:#fff, text-decoration:none)

  to prevent WP/GP theme overriding link hover color to blue on dark CTA box.

  pmo-dude background changed from #0e2c49 to transparent so hero gradient

  shows through the div, reducing visible box around tech image.

  Hero button phone SVG: size guidance updated (see Homepage-PMO.html V9).



  V90 | 2026-05-10 12:30

  Second pass dead code removal: city-grid/city-card old aliases removed

  (widgets use -v2 variants), faq-btn/faq-answer/faq-cta-box dead aliases

  removed, fb-desc/about-city-chip/sec-flush-bottom removed, peak-notice

  block removed, form-col-label/form-col-sub removed (forms are GHL),

  pl-dim removed, rq-grid-3 removed, entry-content .cite removed,

  species-thumb/species-name-text/sci removed, species-cell-text removed,

  minor-pest-axes + sec-list full blocks removed (LBA/Pavement Ant already

  use a different architecture), diy-ok-pill removed, conf-label removed,

  chart-img-sm/chart-stat-rail/chart-caption/pull-stat-muted/diagram-fig-sm

  removed, collapsed risk axis color variants removed.



  V89 | 2026-05-10 12:00

  Deep CSS audit: cross-referenced all 907 CSS classes against all 57

  widget HTML files. Removed all dead code confirmed unused in any widget:

  preview HTML nav chrome (topbar/nav/hamburger/mobile-menu),

  dev-label and dev-block sections, mobile-cta-bar block (PL pages use

  msc- prefix), reviews/picture placeholder blocks, all HTML form field

  classes (forms are GHL iframes - ff, ff-row, form-btn, form-note etc.),

  lform-title/sub, old About page hero classes (about-hero-inner/sub/ctas,

  about-trust-bar, trust-pill, bio-conf-badge), old CP-specific classes

  (cp-cta-banner, cp-faq-*, cp-svc-*, cp-btn-*), old outbound-links /

  related-resources section, old diy-fail list architecture (diy-fail,

  diy-fail-intro, diy-fail-subhead, diy-fail-list - widgets now use

  diy-fail-card/grid/head pattern), old treatment-grid/treatment-card

  (renamed to treatment-protocol-grid), egg-cycle-box/ec-* (old

  cockroach pattern), footer-tagline/footer-top-strip neutralize rules,

  img-pending placeholder, reviews-footer-note.

  btn-white-outline kept (used in About widget).



  V88 | 2026-05-10 10:54

  CSS audit: Elementor is fully removed from the site. Three dead

  selector blocks removed: V9 Elementor structural overrides

  (.elementor-section, .elementor-container, .elementor-column,

  .elementor-column-wrap), V58 Flexbox Container overrides (.e-con,

  .e-con-inner), and V60 header/footer e-con fix. Footer H4 margin

  rule re-scoped from .elementor-location-footer to bare footer.footer.

  Comment references to Elementor widget filenames updated.

  guides/Guide-ElementorJSON-PMO.md deleted (Elementor gone).



  V87 | 2026-05-10 10:21

  Phone icon nudge increased: .ico svg margin-top 2px -> 4px,

  .msc-ico svg margin-top 1px -> 3px. Icon was still sitting too high

  relative to button text vertical center.



  V86 | 2026-05-10 10:17

  Full-bleed for PL species pages: .grid-container, #primary, .content-area

  expanded to 100vw on pages containing .bc-wrap. Dark sections (hero,

  breadcrumb, risk banners, bottom CTA) now reach browser edges on desktop

  and mobile. Inner .wrap handles 1100px content constraint per section.

  SVG phone icon alignment: switched .ico/.msc-ico from inline-flex to flex

  with align-self:center + margin-top:2px on SVG for true vertical center.



  V85 | 2026-05-10 09:30

  SVG phone icon vertical alignment fix. .ico and .msc-ico use

  display:inline-flex + align-items:center so the SVG sits centered

  on the text baseline in btn-call and mobile sticky CTA.



  V84 | 2026-05-10 08:45

  Hide GP post title on PL species pages (.inside-article:has(.bc-wrap) .entry-header).

  The hero section serves as the page title - GP's auto-rendered .entry-title

  was appearing above the dark breadcrumb section as a redundant float.



  V83 | May 2026

  Non-Elementor architecture retrofit. All CSS that was scoped under

  .elementor-widget-html is now scoped under .entry-content, which is

  the GeneratePress post content wrapper when Elementor is not present.

  Removed the Elementor widget structural reset block (width/padding/margin

  overrides on .elementor-widget-container) - not needed without Elementor.

  Added .inside-article:has(.bc-wrap) { padding: 0 !important; } so PL

  species pages (identified by .bc-wrap breadcrumb) can render full-bleed

  dark sections (hero, risk banners, bottom CTA) edge-to-edge without GP

  article padding fighting them. Each section controls its own padding.



  V82 | May 2026

  Footer column alignment fix: all 5 column H4 headings now share

  the same top y-coordinate at desktop width. Brand column content

  (NAP, hours, social icons) is taller than the 4 link columns,

  creating an optical impression of misalignment even though the

  H4 tops align. Fix: footer-grid switches from align-items:start

  to align-items:stretch so all 5 columns fill the same height,

  then each footer-col uses display:flex / flex-direction:column

  so the H4 stays at the very top of every column regardless of

  content height.

  Also: footer V76-V81 addition blocks consolidated into one clean

  block. All redundant override layers removed. Settled rules only.

  Header comment trimmed to last 3 versions.



  V81 | May 2026

  Footer grid ratio fix: brand column reduced from 2fr to 1.4fr

  so the 4 link columns get more horizontal room. align-items:start

  added so all 5 columns top-align. H4 line-height and margin

  normalized across all 5 columns.



  V80 | May 2026

  Footer V5 polish: Yelp icon normalized to match other socials

  (white-ish letter Y, no special red). .footer-social-letter class

  added for letter-form glyphs. .footer-bom-pill SVG icon spacing

  rule added. Brand column tagline display:none defense-in-depth.

=============================================================

*/



/* ── DESIGN TOKENS ─────────────────────────────────────────

   Single source of truth for all brand colors and values.

   Change one value here and it updates everywhere.

──────────────────────────────────────────────────────────── */

:root {

  --blue:       #2E86AB;

  --blue-d:     #1d6a8a;

  --blue-l:     #4FA8CC;

  --blue-pale:  #E0EAF2;

  --navy:       #0D2137;

  --yellow:     #F5A623;

  --yellow-d:   #D4861A;

  --text:       #1A2A3A;

  --muted:      #5A7A8A;

  --border:     #C8DDE8;

}





/* ── BASE RESET ────────────────────────────────────────────

   Applied globally.

──────────────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

img { max-width: 100%; height: auto; display: block; }

a { text-decoration: none; color: inherit; }





/* ── LAYOUT ────────────────────────────────────────────────*/

.wrap { max-width: 1140px; margin: 0 auto; padding: 0 20px; }





/* ── TYPOGRAPHY ────────────────────────────────────────────*/

.eyebrow {

  font-size: 13px; font-weight: 700; letter-spacing: .2em;

  text-transform: uppercase; color: var(--blue);

  display: block; margin-bottom: 10px;

}

.eyebrow-center { text-align: center; }



/* ── PAGE TITLE BAR SUBTITLE ────────────────────────────────── */

/* Muted subtitle line below H1 in .page-title-bar sections     */

.page-title-sub {

  color: rgba(255,255,255,.65);

  font-size: 15px;

  margin-top: 6px;

}



/* ── SEC-H2-CENTER (base class) ─────────────────────────────── */

.sec-h2-center { text-align: center; }



/* ── SEC MAP CAPTION ────────────────────────────────────────── */

/* Centered muted paragraph above map embeds in sec-navy blocks  */

.sec-map-caption {

  text-align: center;

  color: rgba(255,255,255,.65);

  font-size: 14px;

  margin-bottom: 28px;

}





/* ── BUTTONS ───────────────────────────────────────────────*/

.btn {

  display: inline-flex; align-items: center; justify-content: center; gap: 8px;

  padding: 14px 26px; border-radius: 8px; font-weight: 700; font-size: 15px;

  transition: all .2s; cursor: pointer; border: none;

  font-family: "Plus Jakarta Sans", sans-serif;

  line-height: 1; white-space: nowrap; min-height: 50px;

}

@media(max-width:480px) { .btn { white-space: normal; text-align: center; line-height: 1.3; } }

.btn-amber { background: var(--yellow); color: var(--navy); }

.btn-amber:hover { background: var(--yellow-d); transform: translateY(-1px); }





/* ── HERO ───────────────────────────────────────────────────*/

.hero { background: linear-gradient(160deg, var(--navy) 0%, #0e2d4a 60%, #0a2035 100%); padding: 52px 20px 48px; position: relative; overflow: hidden; }

.hero::after { content: ""; position: absolute; top: -100px; right: -100px; width: 500px; height: 500px; background: radial-gradient(circle, rgba(46,134,171,.14) 0%, transparent 65%); pointer-events: none; }



.hero h1 { font-family: "Bebas Neue", sans-serif; font-size: clamp(38px,7vw,60px); line-height: .95; letter-spacing: .5px; color: #fff; margin-bottom: 16px; }

.hero h1 em { color: var(--yellow); font-style: normal; }

.hero-cta-row { display: grid; grid-template-columns: auto 200px; gap: 20px; align-items: start; margin-top: 20px; }

@media(max-width:859px) { .hero-cta-row { display: block; } .pmo-dude { display: none; } }







/* ── TRUST BAR ──────────────────────────────────────────────*/

.tbar { background: var(--blue); display: flex; justify-content: center; flex-wrap: wrap; }

.tbar-item { padding: 14px 20px; display: flex; align-items: center; gap: 8px; color: #fff; font-size: 12px; font-weight: 700; border-right: 1px solid rgba(255,255,255,.2); }

.tbar-item:last-child { border-right: none; }

.tbar-item span { font-size: 18px; }

@media(max-width:640px) { .tbar { flex-direction: column; } .tbar-item { width: 100%; border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.15); padding: 10px 20px; } .tbar-item:last-child { border-bottom: none; } }





/* ── PAGE SECTIONS ──────────────────────────────────────────*/

.sec      { padding: 56px 0; }

.sec-alt  { background: #f8fbfd; padding: 56px 0; }

.sec-pale { background: var(--blue-pale); padding: 56px 0; }





/* ── BREADCRUMB ─────────────────────────────────────────────*/

.breadcrumb { background: var(--blue-pale); padding: 10px 20px; border-bottom: 1px solid var(--border); }

.breadcrumb-inner { max-width: 1140px; margin: 0 auto; font-size: 12px; color: var(--muted); }

.breadcrumb-inner a { color: var(--blue); font-weight: 600; }

.breadcrumb-inner span { margin: 0 5px; opacity: .5; }









@keyframes blink { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.5; transform:scale(.8); } }





/* ── CTA BANNER (Seasonal / Urgency) ───────────────────────*/

.seasonal-cta { background: linear-gradient(135deg, var(--navy) 0%, #0e2d4a 60%, #0a2035 100%); padding: 56px 20px; position: relative; overflow: hidden; }

.seasonal-cta::before { content: ""; position: absolute; top: -80px; right: -80px; width: 400px; height: 400px; background: radial-gradient(circle, rgba(46,134,171,.18) 0%, transparent 65%); pointer-events: none; }

.seasonal-cta-inner { max-width: 800px; margin: 0 auto; text-align: center; position: relative; z-index: 1; }

.seasonal-cta h2 { font-family: "Bebas Neue", sans-serif; font-size: clamp(30px,6vw,52px); color: #fff; letter-spacing: 1px; line-height: 1.05; margin-bottom: 10px; }

.seasonal-cta h2 em { color: var(--yellow); font-style: normal; }

/* Scoped override - beats base .entry-content h2 color:var(--text)!important

   Specificity (0,2,1) with !important wins over (0,1,1) with !important on the reset rule.

   Also restores the larger CTA font-size that sec-h2-white would reduce. */

.entry-content .seasonal-cta h2 { color: #fff !important; font-size: clamp(30px,6vw,52px) !important; letter-spacing: 1px !important; line-height: 1.05 !important; margin-bottom: 10px !important; }

.seasonal-cta .hook { font-size: 15px; color: rgba(255,255,255,.7); line-height: 1.7; margin-bottom: 28px; max-width: 560px; margin-left: auto; margin-right: auto; }

.seasonal-cta .cta-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; }





/* ── ALL SERVICES GRID ──────────────────────────────────────*/

.svc-link-grid { display: grid; grid-template-columns: 1fr; gap: 8px; max-width: 1140px; margin: 0 auto; }

@media(min-width:400px) { .svc-link-grid { grid-template-columns: repeat(2,1fr); } }

@media(min-width:600px) { .svc-link-grid { grid-template-columns: repeat(3,1fr); } }

@media(min-width:900px) { .svc-link-grid { grid-template-columns: repeat(4,1fr); } }

.svc-link { display: flex; align-items: center; gap: 6px; background: #fff; border: 1.5px solid var(--border); border-radius: 8px; padding: 9px 10px; font-size: 12px!important; font-weight: 600; color: var(--text); transition: all .15s; text-decoration: none; min-width: 0; overflow: hidden; word-break: break-word; }

@media(min-width:600px) { .svc-link { font-size: 13px; padding: 11px 14px; gap: 8px; } }

.svc-link:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-pale); }

.svc-img { width: 30px; }



.faq-list { display: flex; flex-direction: column; gap: 0; max-width: 100%; overflow: hidden; }

.faq-item { border-bottom: 1.5px solid var(--border); }

.faq-item:first-child { border-top: 1.5px solid var(--border); }

.faq-q { width: 100%; text-align: left; background: none; border: none; padding: 16px 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 15px; font-weight: 700; color: var(--navy) !important; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; line-height: 1.4; -webkit-tap-highlight-color: transparent !important; outline: none; white-space: normal; overflow-wrap: break-word; word-break: break-word; min-width: 0; -webkit-appearance: none; appearance: none; }

.faq-q:hover,

.faq-q:active,

.faq-q:focus,

.faq-q:focus-visible,

.faq-item .faq-q:hover,

.faq-item .faq-q:active,

.faq-item .faq-q:focus,

button.faq-q:hover, button.faq-q:active, button.faq-q:focus { background: transparent !important; background-color: transparent !important; outline: none !important; box-shadow: none !important; -webkit-tap-highlight-color: transparent !important; border-color: transparent !important; }

.faq-q span { flex: 1; min-width: 0; white-space: normal; overflow-wrap: break-word; word-break: break-word; }

.faq-q::after { content: "+"; font-size: 24px; color: var(--blue); flex-shrink: 0; transition: transform .2s; font-weight: 300; line-height: 1; }

.faq-item.open .faq-q::after { transform: rotate(45deg); }

.faq-a { display: none !important; padding: 0 0 16px; font-size: 14px; color: var(--text); line-height: 1.75; overflow-wrap: break-word; word-break: break-word; }

.faq-a.open, .faq-item.open .faq-a { display: block !important; }

.faq-a a { color: var(--blue); text-decoration: underline; }





/* GP full-bleed: PMO-deployed pages use .hero or .hero-bar at the top.

   Remove .inside-article padding so dark sections can bleed edge-to-edge.

   Each section controls its own horizontal padding. */

.inside-article:has(.hero), .inside-article:has(.hero-bar) { padding: 0 !important; }

/* Full-bleed: expand GP layout containers to viewport width on all PMO-deployed pages.

   Inner .wrap class constrains content per section. */

.grid-container:has(.hero), .grid-container:has(.hero-bar) { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }

#primary:has(.hero), .content-area:has(.hero), #primary:has(.hero-bar), .content-area:has(.hero-bar) { width: 100% !important; max-width: 100% !important; padding: 0 !important; }



/* Hero grid */

.hero { width: 100%; }







/* All services grid */

.svc-link-grid { display: grid !important; }



/* Two-col prose */





/* Hero CTA row */

@media(min-width:860px) { .hero-cta-row { display: grid !important; grid-template-columns: auto 200px !important; align-items: start !important; } }



/* RID grid */





/* FAQ layout */





/* Stat rail */









/* Service area two-column layout (city pages) */







/* ══════════════════════════════════════════════════════════════

   NEW IN V35: ALL INLINE STYLES ELIMINATED FROM WIDGET FILES

   ══════════════════════════════════════════════════════════════ */



/* ── ENTRY CONTENT H2 BASE RESET ──────────────────────────── */

.entry-content h2 {

  font-family: "Bebas Neue", sans-serif !important;

  font-size: clamp(28px,4.5vw,42px) !important;

  letter-spacing: .5px !important;

  line-height: 1.1 !important;

  color: var(--text) !important;

  margin-bottom: 20px;

}



/* ── SECTION HEADINGS ──────────────────────────────────────── */

.entry-content .sec-h2 { font-family: "Bebas Neue", sans-serif !important; font-size: clamp(28px,4.5vw,42px) !important; letter-spacing: .5px; line-height: 1.1; color: var(--text); margin-bottom: 20px; }

.entry-content .sec-h2-sm { font-family: "Bebas Neue", sans-serif !important; font-size: clamp(24px,4vw,36px) !important; letter-spacing: .5px; line-height: 1.1; color: var(--text); margin-bottom: 20px; }

.entry-content .sec-h2-white { font-family: "Bebas Neue", sans-serif !important; font-size: clamp(28px,4.5vw,42px) !important; letter-spacing: .5px; line-height: 1.1; color: #fff !important; margin-bottom: 10px; }

.entry-content .sec-h2-tight { margin-bottom: 8px !important; }

.entry-content .sec-h2-center { text-align: center !important; }



/* ── WRAP WIDTH MODIFIERS ───────────────────────────────────── */

.wrap-sm { max-width: 900px; }



/* ── SECTION CONTENT ───────────────────────────────────────── */

.open-p { font-size: 15px; line-height: 1.85; color: var(--text); margin-bottom: 16px; }

.open-p:last-child { margin-bottom: 0; }

.sec-lead { font-size: 14px; color: var(--muted); margin-bottom: 24px; max-width: 680px; }



/* ── EYEBROW MODIFIERS ─────────────────────────────────────── */

.eyebrow-gold { color: var(--yellow); }



/* ── SECTION MODIFIERS ─────────────────────────────────────── */

.sec-tight { padding-top: 42px; padding-bottom: 42px; }



/* ── ADDITIONAL V35 CLASSES ─────────────────────────────────── */

.btn-ghost-white { background: rgba(255,255,255,.12); color: #fff; border: 2px solid rgba(255,255,255,.4); }

.btn-ghost-white:hover { background: rgba(255,255,255,.2); }



/* ── BUTTON UTILITIES ───────────────────────────────────────── */

.btn-full { width: 100%; margin-bottom: 8px; }





/* ══════════════════════════════════════════════════════════════

   V37: SERVICES HUB PAGE CLASSES

   ══════════════════════════════════════════════════════════════ */



/* ── SERVICES HUB: PAGE TITLE BAR ──────────────────────────── */

.page-title-bar { background: var(--navy); padding: 36px 20px 28px; text-align: center; }

.page-title-bar h1 {

  font-family: "Bebas Neue", sans-serif;

  font-size: clamp(26px, 5vw, 44px);

  line-height: 1.05;

  letter-spacing: .5px;

  color: #fff;

  margin-bottom: 16px;

}

.page-title-bar h1 em { color: var(--yellow); font-style: normal; }



/* ── SERVICES HUB: SERVICE CARD GRID ───────────────────────── */

.hub-grid {

  display: grid !important;

  grid-template-columns: repeat(2, 1fr);

  gap: 14px;

  max-width: 1140px;

  margin: 0 auto;

}

@media(min-width: 640px) { .hub-grid { grid-template-columns: repeat(3, 1fr); } }

@media(min-width: 900px) { .hub-grid { grid-template-columns: repeat(4, 1fr); } }



/* ── SERVICES HUB: INDIVIDUAL SERVICE CARD ─────────────────── */

.hub-card {

  background: var(--navy); border-radius: 12px; padding: 22px 16px 16px;

  display: flex; flex-direction: column; align-items: center; text-align: center;

  text-decoration: none; color: inherit;

  transition: background .2s, transform .15s, box-shadow .15s;

}

.hub-card:hover {

  background: #0e2d4a; transform: translateY(-2px);

  box-shadow: 0 8px 28px rgba(13,33,55,.4);

}



/* ── SERVICES HUB: CARD ICON CIRCLE ────────────────────────── */

.hub-icon {

  width: 72px; height: 72px; border-radius: 50%;

  background: rgba(255,255,255,.95);

  display: flex; align-items: center; justify-content: center;

  margin-bottom: 12px; flex-shrink: 0;

}

.hub-icon img { width: 44px; height: 44px; object-fit: contain; display: block; }



/* ── SERVICES HUB: CARD TEXT LAYERS ────────────────────────── */

.hub-name {

  font-family: "Bebas Neue", sans-serif; font-size: 21px; letter-spacing: .5px;

  color: #fff; line-height: 1.1; margin-bottom: 4px;

}

.hub-fun {

  font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;

  color: var(--yellow); margin-bottom: 8px; line-height: 1.3;

}

.hub-comma {

  font-size: 11px; line-height: 1.65; color: rgba(255,255,255,.55);

  margin-bottom: 12px; flex: 1; padding: 0 4px; text-align: center;

}

.hub-btn {

  display: flex; align-items: center; justify-content: center;

  width: 100%; padding: 9px 12px; background: var(--yellow); color: var(--navy);

  font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; font-size: 12px;

  border-radius: 6px; transition: background .15s; text-decoration: none; margin-top: auto;

}

.hub-card:hover .hub-btn { background: var(--yellow-d); }









/* ── OUTLINE PILL (species / descriptor tags) ───────────────── */

.pill {

  display: inline-block;

  font-size: 11px;

  background: transparent;

  color: var(--muted);

  font-weight: 600;

  padding: 3px 9px;

  border-radius: 20px;

  border: 1.5px solid var(--border);

}



/* ── DEVICE-SPECIFIC CALL BUTTON TEXT ──────────────────────── */

.btn-call .btn-desktop { display: inline; }

.btn-call .btn-mobile  { display: none; }

@media(max-width:768px) {

  .btn-call .btn-desktop { display: none; }

  .btn-call .btn-mobile  { display: inline; }

}



/* ── CITY CHIP NAVIGATION GRID ──────────────────────────────── */

.city-chip-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 8px;

  margin-bottom: 20px;

}

@media(max-width:700px) { .city-chip-grid { grid-template-columns: repeat(2, 1fr); } }



.city-chip {

  display: block;

  background: #fff;

  border: 1.5px solid var(--border);

  border-radius: 30px;

  padding: 7px 10px;

  text-align: center;

  font-size: 12px !important;

  font-weight: 700;

  color: var(--blue-d);

  text-decoration: none !important;

  transition: border-color .15s, color .15s, background .15s;

}

.city-chip:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-pale); }





/* ── CITY PAGE SECTION BACKGROUNDS ─────────────────────────── */

.sec { padding: 72px 0; }

@media(max-width:600px) { .sec { padding: 52px 0; } .sec-light { padding: 52px 0; } }







/* ── SERVICE AREA CARD (Section 10) ────────────────────────── */

.area-card { background: var(--blue-pale); border: 1.5px solid var(--border); border-radius: 14px; padding: 24px; }

.area-card h3 { font-family: "Bebas Neue", sans-serif; font-size: 20px; letter-spacing: .5px; color: var(--navy); margin-bottom: 6px; }

.area-card-sub { font-size: 13px; color: var(--muted); margin-bottom: 16px; display: block; text-align: center; }













/* ── AREA MAP WRAPPER (inside .area-two-col) ─────────────────── */

.area-map-wrap { border-radius: 14px !important; overflow: hidden; min-height: 380px; width: 100%; }





/* ── PROSE LINK COLOR (city page pest sections) ─────────────── */

.sec p a, .sec-light p a, .reviews-section p a {

  color: var(--blue);

  text-decoration: underline;

  text-underline-offset: 2px;

}





/* ── MOBILE LINK SIZE FIX ───────────────────────────────────── */

.geo-intro a,

.open-p a,

.pest-prose a,

.hood-item p a {

  font-size: inherit;

}





/* ══════════════════════════════════════════════════════════════

   V47: SERVICE AREAS HUB CITY CARDS

   ══════════════════════════════════════════════════════════════ */



/* ── CITY HUB CARD GRID ─────────────────────────────────────── */

.city-hub-grid {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 14px;

  max-width: 1140px;

  margin: 0 auto;

}

@media(min-width: 640px)  { .city-hub-grid { grid-template-columns: repeat(3, 1fr); } }

@media(min-width: 1000px) { .city-hub-grid { grid-template-columns: repeat(4, 1fr); } }



/* ── CITY HUB CARD ──────────────────────────────────────────── */

.city-hub-card {

  background: var(--navy);

  border-radius: 12px;

  padding: 20px 16px 16px;

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  text-decoration: none;

  color: inherit;

  transition: background .2s, transform .15s, box-shadow .15s;

}

.city-hub-card:hover {

  background: #0e2d4a;

  transform: translateY(-2px);

  box-shadow: 0 8px 28px rgba(13,33,55,.3);

}



/* ── CITY HUB CARD TEXT LAYERS ──────────────────────────────── */

.city-hub-name {

  font-family: "Bebas Neue", sans-serif;

  font-size: 22px;

  letter-spacing: .5px;

  color: #fff;

  line-height: 1.1;

  margin-bottom: 10px;

}

.city-hub-row-label {

  font-size: 9px;

  font-weight: 800;

  letter-spacing: .14em;

  text-transform: uppercase;

  color: var(--yellow);

  margin-bottom: 3px;

  margin-top: 8px;

}

.city-hub-pests {

  font-size: 11px;

  line-height: 1.6;

  color: rgba(255,255,255,.75);

}

.city-hub-hoods {

  font-size: 11px;

  line-height: 1.6;

  color: rgba(255,255,255,.6);

  flex: 1;

}



/* ── CITY HUB CARD BUTTON ───────────────────────────────────── */

.city-hub-btn {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  padding: 9px 12px;

  background: var(--yellow);

  color: var(--navy);

  font-family: "Plus Jakarta Sans", sans-serif;

  font-weight: 800;

  font-size: 10px;

  border-radius: 6px;

  transition: background .15s;

  text-decoration: none;

  margin-top: 14px;

}

.city-hub-card:hover .city-hub-btn { background: var(--yellow-d); }



/* Grid display override for city-hub-grid */

.entry-content .city-hub-grid {

  display: grid !important;

  grid-template-columns: repeat(2, 1fr) !important;

}

@media(min-width: 640px) {

  .entry-content .city-hub-grid { grid-template-columns: repeat(3, 1fr) !important; }

}

@media(min-width: 1000px) {

  .entry-content .city-hub-grid { grid-template-columns: repeat(4, 1fr) !important; }

}





/* Display override */



.nap-row {

  display: flex;

  align-items: flex-start;

  gap: 12px;

  margin-bottom: 14px;

}

.nap-row:last-child { margin-bottom: 0; }

.nap-icon {

  width: 36px;

  height: 36px;

  background: var(--navy);

  border-radius: 8px;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  font-size: 16px;

}

.nap-icon svg { stroke: #fff; }

.nap-detail {

  font-size: 14px;

  line-height: 1.6;

  color: var(--text);

}

.nap-detail strong {

  display: block;

  font-size: 11px;

  font-weight: 700;

  letter-spacing: .1em;

  text-transform: uppercase;

  color: var(--muted);

  margin-bottom: 2px;

}

.nap-detail a {

  color: var(--navy);

  font-weight: 700;

  font-size: 16px;

  text-decoration: none;

}

.nap-detail a:hover { color: var(--blue); }

.hours-row {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 7px 0;

  border-bottom: 1px solid var(--border);

  font-size: 13px;

}

.hours-row:last-child { border-bottom: none; }

.hours-row .day { font-weight: 700; color: var(--text); }

.hours-row .time { color: var(--blue-d); font-weight: 600; }

.hours-row.closed .time { color: var(--muted); }

















/* ── COMMERCIAL PLANS SECTION ───────────────────────────────── */

.plans-section { background: var(--navy); padding: 60px 20px; }

.plans-header { text-align: center; margin-bottom: 36px; }















/* DISPLAY OVERRIDES FOR PEST LIBRARY */



















/* =============================================================

   PRICING PAGE CLASSES — V58 ADDITIONS

   All classes below are new and pricing-page-specific.

   No existing classes were modified.

   ============================================================= */



/* TEXT UTILITIES */

.txt-gold { color: var(--yellow); }



/* WHITE OUTLINE BUTTON */

.btn-outline-w { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }

.btn-outline-w:hover { background: rgba(255,255,255,.08); }







/* MOSQUITO ADD-ON */

.mosq-addon { max-width: 860px; margin: 16px auto 0; background: var(--navy); border: 1px solid rgba(46,134,171,.35); border-radius: 12px; padding: 18px 20px; display: flex; align-items: center; gap: 16px; }

@media(max-width:480px) { .mosq-addon { flex-direction: column; align-items: flex-start; gap: 10px; } }

.mosq-body-col { flex: 1; }

.mosq-name { font-family: 'Bebas Neue', sans-serif; font-size: 18px; color: #fff; letter-spacing: .4px; margin: 0 0 2px; }

.mosq-tag { font-size: 10px; font-weight: 700; color: var(--yellow); letter-spacing: .08em; text-transform: uppercase; }

.mosq-desc { font-size: 12px; color: rgba(255,255,255,.5); line-height: 1.6; margin-top: 4px; }

.mosq-price-col { text-align: right; flex-shrink: 0; }

.mosq-price-num { font-family: 'Bebas Neue', sans-serif; font-size: 34px; color: var(--yellow); line-height: 1; }

.mosq-price-note { font-size: 10px; color: rgba(255,255,255,.38); }

.sqft-note { font-size: 11px; color: var(--muted); text-align: center; margin: 12px auto 0; max-width: 860px; font-style: italic; }





/* REVIEWS GRID — 4 COLUMN (top section) */

.rq-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 14px; }

@media(min-width:860px) { .rq-grid { grid-template-columns: repeat(4, 1fr); } }

.rq-card { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px; }

.rq-stars { color: var(--yellow); font-size: 14px; margin-bottom: 8px; letter-spacing: 1px; }

.rq-text { font-size: 12.5px; color: var(--text); line-height: 1.75; margin: 0 0 10px; font-style: italic; }

.rq-author { font-size: 11px; font-weight: 700; color: var(--muted); }

.reviews-note { font-size: 12.5px; color: var(--muted); margin-bottom: 20px; font-style: italic; }

.reviews-footer-link { color: var(--blue); font-weight: 700; }



/* COMMERCIAL PLANS */

.comm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; max-width: 860px; margin: 0 auto 22px; }

@media(max-width:540px) { .comm-grid { grid-template-columns: 1fr; } }

.comm-card { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px; }

.comm-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }

.comm-name { font-family: 'Bebas Neue', sans-serif; font-size: 18px; color: var(--navy); letter-spacing: .4px; }

.comm-freq { font-size: 9.5px; font-weight: 900; color: var(--blue); letter-spacing: .1em; text-transform: uppercase; background: var(--blue-pale); border: 1px solid var(--border); border-radius: 20px; padding: 2px 9px; white-space: nowrap; flex-shrink: 0; }

.comm-body { font-size: 12px; color: var(--muted); line-height: 1.65; margin: 0; }

.comm-cta-col { display: flex; flex-direction: column; align-items: center; gap: 10px; max-width: 860px; margin: 0 auto; }



/* ESTIMATE SECTION */

.est-section { background: #fff; padding: 52px 20px; border-top: 4px solid var(--navy); }

.est-inner { max-width: 960px; margin: 0 auto; }

.est-header { text-align: center; margin-bottom: 28px; }

.est-sub { font-size: 13px; color: var(--muted); line-height: 1.75; max-width: 560px; margin: 0 auto; }



.est-form-wrap { max-width: 540px; margin: 0 auto; background: var(--navy); border-radius: 14px; padding: 24px; }



/* PRICING PAGE SECTION OVERRIDES */

.pricing-plans-sec { background: var(--blue-pale); padding: 52px 20px; }

.pricing-plans-header { text-align: center; max-width: 660px; margin: 0 auto 28px; }

.pricing-h2-lg { font-family: 'Bebas Neue', sans-serif; font-size: clamp(28px, 4.5vw, 46px); color: var(--navy); letter-spacing: .4px; margin: 0 0 18px; }





/* HERO BAR — PRICING PAGE */

.hero-bar { background: var(--navy); padding: 28px 20px 24px; }

.hero-bar-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; }

.hero-bar-left { flex: 1; min-width: 260px; }

.hero-bar h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(26px, 3.8vw, 44px); color: #fff; letter-spacing: .5px; line-height: 1.08; margin: 0 0 8px; }

.hero-bar h1 span { color: var(--yellow); }

.hero-bar-h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(26px, 3.8vw, 44px); color: #fff; letter-spacing: .5px; line-height: 1.08; margin: 0 0 8px; }

.hero-bar-h1-accent { color: var(--yellow); }

.hero-bar-sub { font-size: 13.5px; color: rgba(255,255,255,.6); line-height: 1.65; margin: 0 0 14px; max-width: 500px; }



/* BOM PILL — PRICING PAGE VARIANT */

.bom-pill { display: flex; align-items: center; gap: 10px; background: rgba(245,166,35,.1); border: 1px solid rgba(245,166,35,.28); border-radius: 10px; padding: 10px 14px; flex-shrink: 0; }

.bom-pill img, .bom-pill-img { width: 44px; height: 44px; border-radius: 6px; object-fit: contain; }

.bom-pill-text { font-size: 11px; font-weight: 700; color: var(--yellow); line-height: 1.4; }

.hero-bar-cta-row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 14px; }

.entry-content .hero-bar .btn-call .ico { display: flex; align-items: center; align-self: center; line-height: 1; }

.entry-content .hero-bar .btn-call .ico svg { display: block; margin-top: 4px; }



/* COMMERCIAL PLAN SECTION */

.plans-section { background: var(--navy); padding: 52px 20px; }

.plans-header { text-align: center; max-width: 660px; margin: 0 auto 28px; }

.plans-sub { font-size: 13.5px; color: rgba(255,255,255,.55); line-height: 1.7; }



/* Commercial cards: freq pill wraps to next line when title is long */

.comm-card-head { flex-wrap: wrap; align-items: flex-start; }

.comm-name { flex: 1 1 100%; }

.comm-freq { flex-shrink: 0; margin-top: 4px; }



/* Reviews note: clean centered link, no URL text wrapping */

.reviews-note { text-align: center; font-size: 13px; }

.reviews-footer-link { color: var(--blue); font-weight: 700; text-decoration: none; white-space: nowrap; }

.reviews-footer-link:hover { text-decoration: underline; }



/* Estimate anchor: move id to form wrapper so button scrolls past cards */

.est-form-anchor { display: block; height: 0; visibility: hidden; }









/* ── PRICING PAGE MOBILE FIXES — V58 PATCH 2 ──────────────────

   Reduces padding and fixes layout on small screens.

   Addresses: plan tile clipping, section gap, billing note,

   calendar column width, one-time services spacing.

────────────────────────────────────────────────────────────── */



/* Reduce section vertical padding on mobile */

@media(max-width:640px) {

  .pricing-plans-sec { padding: 32px 14px; }

  .cal-section { padding: 32px 14px; }

  .sec.sec-tight { padding-top: 24px; padding-bottom: 24px; }

  .onetimes-wrap { padding: 16px; }

  .est-section { padding: 36px 14px; }

}



/* Gap between reviews and plans: tighten bottom of reviews section */

.sec.sec-tight.sec-pale { padding-bottom: 24px; }



.entry-content .hero .btn-call { background: #F5A623; color: #0D2137; font-weight: 900; font-size: 15px; letter-spacing: .04em; padding: 14px 24px; border-radius: 6px; display: inline-flex; align-items: center; gap: 8px; text-transform: uppercase; text-decoration: none; }

.entry-content .hero .btn-call:hover { background: #FFB733; color: #0D2137; text-decoration: none; }

.entry-content .hero .btn-call .ico { display: flex; align-items: center; align-self: center; line-height: 1; }

.entry-content .hero .btn-call .ico svg { display: block; margin-top: 4px; }



































/* ── PL SPECIES: MOBILE STICKY CALL + TEXT BAR ──────────── */

/* Unscoped: position:fixed requires global scope. Sitewide pattern. */

.mobile-sticky-cta { display: none; }

@media(max-width:768px) {

  .mobile-sticky-cta { display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; box-shadow: 0 -2px 12px rgba(0,0,0,.22); }

  .mobile-sticky-cta a { flex: 1; padding: 14px 12px; text-align: center; font-weight: 900; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; display: flex; align-items: center; justify-content: center; gap: 8px; }

  .mobile-sticky-cta a:hover { text-decoration: none; }

  .msc-call { background: #F5A623; color: #0D2137 !important; }

  .msc-text  { background: #2E86AB; color: #fff !important; }

  .msc-ico   { display: flex; align-items: center; align-self: center; line-height: 1; }

  .msc-ico svg { display: block; margin-top: 3px; }

  body { padding-bottom: 54px; }

}





/* ============================================================

   V64 MOBILE FIXES (max-width:768px)

   Breakpoint matches existing confusion-table stacked-card

   breakpoint already in this file.

   ============================================================ */



@media(max-width:768px) {



  /* -- FIX A: Root cause - column width --

     V63 :has(.bc-wrap) td:first-child width:20% has higher

     specificity than the general mobile width:100% rule.

     Override it back to full width. */

  .entry-content:has(.bc-wrap) .confusion-table th:first-child,

  .entry-content:has(.bc-wrap) .confusion-table td:first-child {

    width: 100% !important;

  }



  /* -- FIX B: Last card yellow line --

     Line 2511: tr:last-child td { border-bottom:none } is a global

     rule (no media query). On mobile stacked cards it kills the

     yellow border-bottom on the last card's td:first-child.

     Restore it explicitly. */

  .entry-content:has(.bc-wrap) .confusion-table tr:last-child td:first-child {

    border-bottom: 2px solid #F5A623 !important;

    margin-bottom: 6px !important;

    padding-bottom: 10px !important;

  }



  /* -- FIX C: Card inner padding --

     tr has padding:14px 16px but horizontal padding on

     block-converted table rows is unreliable cross-browser.

     Explicit td padding is the safe approach. */

  .entry-content:has(.bc-wrap) .confusion-table td {

    padding-left: 14px !important;

    padding-right: 14px !important;

  }



  /* -- FIX D (mobile override): Self-badge above ant image --

     On mobile cards, badge is left-aligned at the top of the

     full-width card header. Self-row gets extra padding-top

     so the image+name row sits below the badge with breathing room. */

  .entry-content:has(.bc-wrap) .confusion-table td:first-child .self-badge {

    left: 14px;

    transform: none;

    top: 10px;

  }

  .entry-content:has(.bc-wrap) .confusion-table td:first-child:has(.self-badge) {

    padding-top: 40px !important;

  }



  /* -- FIX E: species-cell-v row layout --

     Row layout: image beside name instead of stacked above.

     cm-aka restored (fits on one line with Fix A applied).

     cm-sci hidden on mobile (too verbose at narrow widths). */

  .entry-content:has(.bc-wrap) .species-cell-v {

    flex-direction: row !important;

    gap: 12px !important;

    align-items: center !important;

    text-align: left !important;

  }

  .entry-content:has(.bc-wrap) .species-cell-v strong {

    font-size: 13px;

    text-align: left;

    line-height: 1.3;

  }

  .entry-content:has(.bc-wrap) .species-cm-img {

    width: 40px !important;

    height: 40px !important;

    flex-shrink: 0;

    margin: 0 !important;

  }

  .entry-content:has(.bc-wrap) .confusion-table .cm-aka {

    display: block !important;

    font-size: 11px;

    line-height: 1.4;

  }

  .entry-content:has(.bc-wrap) .confusion-table .cm-sci {

    display: none !important;

  }

  /* Self-badge: compact size, already positioned absolute above */

  .entry-content:has(.bc-wrap) .confusion-table .self-badge {

    font-size: 9px !important;

    padding: 2px 7px !important;

  }



  /* -- FIX F: Confusion matrix section top padding --

     .sec-light drops to 36px top padding at mobile. Add 16px

     extra so the section breathes from the identification

     section above it. */

  .entry-content:has(.bc-wrap) #confusion-matrix {

    padding-top: 52px !important;

  }



}



/* Mobile: stack cards single column */





















/*

=============================================================

  V68 ADDITION: Inline external link visibility

  The base `a { text-decoration: none; color: inherit; }` rule from V67

  makes inline external links invisible in body copy. The .ext-link class

  restores visibility for inline citations on PL pages without changing

  the global default (which is needed for nav, button, and confusion

  matrix species links).

=============================================================

*/



.entry-content .sec-p a[target="_blank"],

.entry-content .hero-summary a[target="_blank"],

.entry-content .danger-card a[target="_blank"],

.entry-content .diy-fail-card p a[target="_blank"] {

  color: #2E86AB;

  font-size: inherit;

  font-weight: inherit;

  line-height: inherit;

  text-decoration: none;

  transition: color 0.15s ease;

}







/* Bottom stops text + CTA paragraph: force left-align on mobile.

   Parent .bottom-stops switches to text-align:center at 600px;

   .bottom-cta has text-align:center globally. Both cascade down

   and center the paragraph text on narrow viewports. */









/* All icons in svc-link-grid -- 32px base size */

.svc-img { width: 32px; height: 32px; object-fit: contain; flex-shrink: 0; }




@keyframes pmo-pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(74,222,128,0.65); }
  50%       { box-shadow: 0 0 0 5px rgba(74,222,128,0); }
}

/* Mobile: hide ribbon entirely */