/* ==========================================================================
   ASC Pest Control -- Consolidated site stylesheet (asc-landing.css)
   Single merged stylesheet replacing the previous multi-file CSS set.
   Sections below are concatenated in their original cascade order so
   current page rendering is preserved 1:1.
   ========================================================================== */

/* ===== BEGIN asc-elementskit-nav.css ===== */
/* ============================================================
   ASC Pest Control — ElementsKit Nav Menu skin
   Paste into: ElementsKit Nav Menu widget → Advanced → Custom CSS
   (use "selector" prefix there), OR Elementor → Site Settings →
   Custom CSS, OR Appearance → Customize → Additional CSS.
   Scoped to .ekit-wid-con so it won't affect the rest of the site.
   ============================================================ */

.ekit-wid-con {
  --asc-burgundy: #B02040;
  --asc-burgundy-deep: #8a1832;
  --asc-olive: #6B8E23;
  --asc-olive-deep: #557018;
  --asc-fg: #1c2128;
  --asc-muted: #44505c;
  --asc-line: #E5E5E5;
}

/* ---------- Top-level links ---------- */
.ekit-wid-con .elementskit-navbar-nav > li > a.ekit-menu-nav-link {
  position: relative;
  color: var(--asc-muted);
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: .01em;
  padding: .6rem 1rem;
  transition: color .2s ease;
}
.ekit-wid-con .elementskit-navbar-nav > li > a.ekit-menu-nav-link:hover,
.ekit-wid-con .elementskit-navbar-nav > li.current-menu-item > a.ekit-menu-nav-link,
.ekit-wid-con .elementskit-navbar-nav > li.active > a.ekit-menu-nav-link {
  color: var(--asc-burgundy);
}
/* animated underline (olive accent) */
.ekit-wid-con .elementskit-navbar-nav > li > a.ekit-menu-nav-link::after {
  content: "";
  position: absolute;
  left: 1rem; right: 1rem; bottom: .35rem;
  height: 2px;
  background: var(--asc-olive);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
.ekit-wid-con .elementskit-navbar-nav > li > a.ekit-menu-nav-link:hover::after {
  transform: scaleX(1);
}

/* caret / dropdown icon */
.ekit-wid-con .ekit-menu-dropdown-icon { color: inherit; opacity: .8; }

/* ---------- Dropdown panels ---------- */
.ekit-wid-con .elementskit-submenu-panel {
  background: #fff;
  border: 1px solid var(--asc-line);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .14);
  padding: .5rem;
  min-width: 240px;
}
.ekit-wid-con .elementskit-submenu-panel li > a.ekit-menu-nav-link {
  color: var(--asc-muted);
  font-size: .88rem;
  font-weight: 500;
  padding: .6rem .9rem;
  border-radius: 8px;
  transition: background .15s ease, color .15s ease;
}
.ekit-wid-con .elementskit-submenu-panel li > a.ekit-menu-nav-link:hover,
.ekit-wid-con .elementskit-submenu-panel li.current-menu-item > a.ekit-menu-nav-link {
  background: rgba(176, 32, 64, .08);
  color: var(--asc-burgundy);
}

/* ---------- Mobile / hamburger ---------- */
.ekit-wid-con .elementskit-menu-hamburger .elementskit-menu-hamburger-icon {
  background-color: var(--asc-fg);
}
.ekit-wid-con .elementskit-menu-container.elementskit-menu-offcanvas-elementor,
.ekit-wid-con .elementskit-navbar-nav.elementskit-menu-po-left {
  background: #fff;
}
.ekit-wid-con .elementskit-mobile-builder-content .elementskit-navbar-nav > li > a.ekit-menu-nav-link {
  color: var(--asc-fg);
  border-bottom: 1px solid var(--asc-line);
}
.ekit-wid-con .elementskit-menu-close { color: var(--asc-burgundy); }

/* ---------- Optional "Sign In" / CTA button if added as a menu item ---------- */
.ekit-wid-con .elementskit-navbar-nav > li.asc-cta > a.ekit-menu-nav-link {
  background: var(--asc-burgundy);
  color: #fff !important;
  border-radius: 999px;
  padding: .6rem 1.25rem;
}
.ekit-wid-con .elementskit-navbar-nav > li.asc-cta > a.ekit-menu-nav-link:hover {
  background: var(--asc-burgundy-deep);
}
.ekit-wid-con .elementskit-navbar-nav > li.asc-cta > a.ekit-menu-nav-link::after { display: none; }
/* ===== END asc-elementskit-nav.css ===== */

/* ===== BEGIN asc-elementskit-nav-global.css ===== */
/* ============================================================
   ASC — ElementsKit Nav Menu skin (GLOBAL version, no "selector")
   PASTE INTO: Appearance → Customize → Additional CSS
   (works without Elementor Pro). Scoped to your header nav widget
   #elementor-element-0d40ae2 and forced with !important so it beats
   ElementsKit's own output.
   If you ever rebuild the widget and the ID changes, replace
   0d40ae2 below with the new elementor-element-XXXX id.
   ============================================================ */

/* ---------- Top-level links ---------- */
.elementor-element-0d40ae2 .elementskit-navbar-nav > li > a {
  color: #44505C !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 0 16px !important;
  position: relative !important;
  transition: color .2s ease !important;
}
.elementor-element-0d40ae2 .elementskit-navbar-nav > li:hover > a,
.elementor-element-0d40ae2 .elementskit-navbar-nav > li > a:hover,
.elementor-element-0d40ae2 .elementskit-navbar-nav > li.current-menu-item > a,
.elementor-element-0d40ae2 .elementskit-navbar-nav > li.current-menu-ancestor > a {
  color: #B02040 !important;
}

/* Caret / submenu indicator */
.elementor-element-0d40ae2 .elementskit-navbar-nav > li > a .elementskit-submenu-indicator,
.elementor-element-0d40ae2 .elementskit-navbar-nav > li > a .ekit-submenu-indicator-icon {
  color: #101010 !important;
  fill: #101010 !important;
}
.elementor-element-0d40ae2 .elementskit-navbar-nav > li:hover > a .elementskit-submenu-indicator,
.elementor-element-0d40ae2 .elementskit-navbar-nav > li:hover > a .ekit-submenu-indicator-icon {
  color: #B02040 !important;
  fill: #B02040 !important;
}

/* Olive underline on hover */
.elementor-element-0d40ae2 .elementskit-navbar-nav > li > a::after {
  content: "" !important;
  position: absolute !important;
  left: 16px; right: 16px; bottom: 6px;
  height: 2px;
  background: #6B8E23;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
.elementor-element-0d40ae2 .elementskit-navbar-nav > li:hover > a::after { transform: scaleX(1) !important; }

/* ---------- Dropdown panel ---------- */
.elementor-element-0d40ae2 .elementskit-submenu-panel {
  background: #FFFFFF !important;
  border: 1px solid #E5E5E5 !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.14) !important;
  padding: 8px !important;
  min-width: 240px !important;
}
.elementor-element-0d40ae2 .elementskit-submenu-panel > li > a {
  color: #44505C !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  transition: background .15s ease, color .15s ease !important;
}
.elementor-element-0d40ae2 .elementskit-submenu-panel > li > a:hover,
.elementor-element-0d40ae2 .elementskit-submenu-panel > li.current-menu-item > a {
  background: rgba(176,32,64,.08) !important;
  color: #B02040 !important;
}

/* ---------- Mobile / hamburger ---------- */
.elementor-element-0d40ae2 .elementskit-menu-hamburger .elementskit-menu-hamburger-icon { background-color: #1C2128 !important; }
.elementor-element-0d40ae2 .elementskit-menu-close { color: #B02040 !important; }

/* ---------- Optional CTA item (add CSS class "asc-cta" to a menu item) ---------- */
.elementor-element-0d40ae2 .elementskit-navbar-nav > li.asc-cta > a {
  background: #B02040 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 8px 20px !important;
  margin-left: 8px !important;
}
.elementor-element-0d40ae2 .elementskit-navbar-nav > li.asc-cta > a:hover { background: #8a1832 !important; color: #fff !important; }
.elementor-element-0d40ae2 .elementskit-navbar-nav > li.asc-cta > a::after { display: none !important; }
/* ===== END asc-elementskit-nav-global.css ===== */

/* ===== BEGIN asc-elementskit-nav-widget.css ===== */
/* ============================================================
   ASC — ElementsKit Nav Menu skin (WIDGET version, corrected selectors)
   PASTE INTO: the ElementsKit Nav Menu widget → Advanced → Custom CSS.
   "selector" = this widget; !important beats ElementsKit's own output
   (which is high-specificity: .elementor-XXX .elementor-element-XXX ...).
   This version targets .elementskit-navbar-nav > li > a (your markup).
   ============================================================ */

/* ---------- Top-level links ---------- */
selector .elementskit-navbar-nav > li > a {
  color: #44505C !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 0 16px !important;
  position: relative;
  transition: color .2s ease !important;
}
selector .elementskit-navbar-nav > li:hover > a,
selector .elementskit-navbar-nav > li > a:hover,
selector .elementskit-navbar-nav > li.current-menu-item > a,
selector .elementskit-navbar-nav > li.current-menu-ancestor > a {
  color: #B02040 !important;
}

/* Caret / submenu indicator */
selector .elementskit-navbar-nav > li > a .elementskit-submenu-indicator,
selector .elementskit-navbar-nav > li > a .ekit-submenu-indicator-icon {
  color: #101010 !important;
  fill: #101010 !important;
}
selector .elementskit-navbar-nav > li:hover > a .elementskit-submenu-indicator,
selector .elementskit-navbar-nav > li:hover > a .ekit-submenu-indicator-icon {
  color: #B02040 !important;
  fill: #B02040 !important;
}

/* Olive underline on hover */
selector .elementskit-navbar-nav > li > a::after {
  content: "";
  position: absolute;
  left: 16px; right: 16px; bottom: 6px;
  height: 2px;
  background: #6B8E23;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
selector .elementskit-navbar-nav > li:hover > a::after { transform: scaleX(1); }

/* ---------- Dropdown panel ---------- */
selector .elementskit-navbar-nav .elementskit-submenu-panel {
  background: #FFFFFF !important;
  border: 1px solid #E5E5E5 !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.14) !important;
  padding: 8px !important;
  min-width: 240px !important;
}
selector .elementskit-navbar-nav .elementskit-submenu-panel > li > a {
  color: #44505C !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  transition: background .15s ease, color .15s ease !important;
}
selector .elementskit-navbar-nav .elementskit-submenu-panel > li > a:hover,
selector .elementskit-navbar-nav .elementskit-submenu-panel > li.current-menu-item > a {
  background: rgba(176,32,64,.08) !important;
  color: #B02040 !important;
}

/* ---------- Mobile / hamburger ---------- */
selector .elementskit-menu-hamburger .elementskit-menu-hamburger-icon { background-color: #1C2128 !important; }
selector .elementskit-menu-close { color: #B02040 !important; }
selector .elementskit-navbar-nav.elementskit-menu-offcanvas-elementor > li > a,
selector .ekit-menu-responsive-mobile .elementskit-navbar-nav > li > a { color: #1C2128 !important; }

/* ---------- Optional CTA item (add CSS class "asc-cta" to a menu item) ---------- */
selector .elementskit-navbar-nav > li.asc-cta > a {
  background: #B02040 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 8px 20px !important;
  margin-left: 8px;
}
selector .elementskit-navbar-nav > li.asc-cta > a:hover { background: #8a1832 !important; color: #fff !important; }
selector .elementskit-navbar-nav > li.asc-cta > a::after { display: none !important; }
/* ===== END asc-elementskit-nav-widget.css ===== */

/* ===== BEGIN asc-global.css ===== */
/* =========================================================
   ASC Pest Control — Global Website CSS
   Header, Navigation, Footer, ASC page fixes, Mobile fixes
   Loaded site-wide (every front-end page) by the ASC Pest
   Pages plugin so it styles the live WordPress / HT Builder
   theme, not just the standalone plugin templates.
   ========================================================= */

/* =========================================================
   1. Base / Global Fixes
   ========================================================= */

html,
body {
    visibility: visible !important;
    opacity: 1 !important;
    overflow-x: hidden;
}

body {
    background: #ffffff;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

/* Remove unwanted WordPress/Kadence entry spacing on full-width pages */
.content-area {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.content-container.site-container {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.entry-content-wrap {
    padding: 0 !important;
}

.entry.single-entry {
    box-shadow: none !important;
}

.entry-content.single-content {
    margin: 0 !important;
}

/* Hide page title if theme outputs it */
.entry-title,
.page-title {
    display: none !important;
}

/* EA overlay fix */
.eael-cta-overlay-yes .eael-call-to-action.bg-img::after {
    background: rgba(0, 0, 0, 0.72) !important;
}

/* =========================================================
   2. ASC Top Brand Bar
   ========================================================= */

.asc-bar,
.asc-bar * {
    box-sizing: border-box;
}

.asc-bar {
    --burgundy: #B02040;
    --burgundy-deep: #8a1832;
    --olive: #5b6470;
    --olive-deep: #5b6470;
    --fg: #5b6470;
    --muted: #5b6470;
    --line: #E5E5E5;
    --bg-alt: #EBEEF0;

    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid var(--line);
    color: var(--fg);
    font-family: "DM Sans", Arial, Helvetica, sans-serif;
    position: relative;
    z-index: 10020;
}

.asc-bar a {
    text-decoration: none;
    color: inherit;
}

.asc-bar-inner {
    max-width: 1180px;
    margin: 0 auto;
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(14px, 2.4vw, 30px);
    padding: 10px clamp(18px, 3vw, 32px);
}

.asc-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.asc-logo {
    flex-shrink: 0;
    display: inline-flex;
}

.asc-logo img {
    height: 46px;
    width: auto;
    display: block;
}

.asc-word {
    display: inline-flex;
    flex-direction: column;
    line-height: 1.05;
    min-width: 0;
}

.asc-brand-top {
    font-size: clamp(18px, 1.8vw, 22px);
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--fg);
    white-space: nowrap;
}

.asc-brand-top strong {
    color: var(--burgundy);
    font-weight: 800;
}

.asc-brand-sub {
    margin-top: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted);
    white-space: nowrap;
}

.asc-creds {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
}

.asc-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--fg);
    background: var(--bg-alt);
    border: 1px solid var(--line);
}

.asc-chip i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--olive);
}

.asc-chip.b i {
    background: var(--burgundy);
}

.asc-actions {
    display: inline-flex;
    align-items: center;
    gap: clamp(12px, 1.6vw, 20px);
    flex-shrink: 0;
}

.asc-phone {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    white-space: nowrap;
}

.asc-phone svg {
    width: 17px;
    height: 17px;
    color: var(--olive-deep);
}

.asc-phone:hover {
    color: var(--burgundy);
}

.asc-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    white-space: nowrap;
    background: var(--burgundy);
    border: 2px solid transparent;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.asc-cta svg {
    width: 15px;
    height: 15px;
}

.asc-cta:hover {
    background: var(--burgundy-deep);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(176, 32, 64, 0.28);
}

/* =========================================================
   3. Main Navigation — Actual HT Builder Menu
   ========================================================= */

/*
   Your visible navigation is NOT #site-navigation.
   It is generated by HT Builder / HT Mega:
   .htbuilder-menu-area
   .htbuilder-nav
   ul.htbuilder-mainmenu
   #menu-f411387
*/

.htbuilder-menu-area,
.htbuilder-menu-area * {
    box-sizing: border-box;
}

.htbuilder-menu-area {
    position: relative !important;
    z-index: 10010 !important;
    width: 100% !important;
    background-color: rgba(8, 11, 16, 0.98) !important;
    background-image:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.12) 0%,
            rgba(255, 255, 255, 0.055) 24%,
            rgba(255, 255, 255, 0.018) 48%,
            rgba(0, 0, 0, 0.28) 100%
        ),
        radial-gradient(
            circle at 22% 0%,
            rgba(105, 118, 138, 0.16) 0%,
            rgba(105, 118, 138, 0.055) 28%,
            rgba(105, 118, 138, 0) 58%
        ),
        linear-gradient(
            90deg,
            rgba(5, 7, 11, 0.99) 0%,
            rgba(10, 14, 21, 0.98) 34%,
            rgba(13, 17, 25, 0.98) 66%,
            rgba(6, 8, 13, 0.99) 100%
        ) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.42) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        inset 0 -1px 0 rgba(255, 255, 255, 0.18),
        inset 0 16px 22px rgba(255, 255, 255, 0.025),
        0 14px 34px rgba(0, 0, 0, 0.52) !important;
    backdrop-filter: blur(12px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
}

.htbuilder-menu-area::before {
    content: "" !important;
    position: absolute !important;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.06),
        rgba(255, 255, 255, 0.28),
        rgba(255, 255, 255, 0.06)
    ) !important;
    pointer-events: none;
    z-index: 2;
}

.htbuilder-menu-area::after {
    content: "" !important;
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.12),
        rgba(255, 255, 255, 0.64),
        rgba(255, 255, 255, 0.12)
    ) !important;
    pointer-events: none;
    z-index: 2;
}

.htbuilder-nav {
    max-width: 1220px !important;
    margin: 0 auto !important;
    min-height: 54px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 22px !important;
    background: transparent !important;
    position: relative !important;
    z-index: 3 !important;
}

.htbuilder-nav ul.htbuilder-mainmenu,
.htbuilder-nav ul.htbuilder-mainmenu ul {
    list-style: none !important;
}

.htbuilder-nav > ul.htbuilder-mainmenu,
.htbuilder-nav > ul#menu-f411387 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    position: relative !important;
    float: none !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li > a {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background: transparent !important;
    font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.15px !important;
    text-transform: none !important;
    line-height: 1 !important;
    padding: 20px 13px !important;
    border: none !important;
    border-radius: 0 !important;
    min-height: auto !important;
    height: auto !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition:
        color 0.25s ease,
        background-color 0.25s ease,
        box-shadow 0.25s ease !important;
    position: relative !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li:hover > a,
.htbuilder-nav ul.htbuilder-mainmenu > li:focus-within > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-item > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current_page_item > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-parent > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-ancestor > a,
.htbuilder-nav ul.htbuilder-mainmenu > li > a:hover,
.htbuilder-nav ul.htbuilder-mainmenu > li > a:focus {
    color: #ffffff !important;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.13),
        rgba(118, 132, 154, 0.1)
    ) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(255, 255, 255, 0.1) !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li > a::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    bottom: 11px !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0),
        rgba(230, 235, 242, 0.95),
        rgba(255, 255, 255, 0)
    ) !important;
    border-radius: 10px !important;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    transition: transform 0.25s ease !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li:hover > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li:focus-within > a::after {
    transform: scaleX(1) !important;
}

.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-item > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li.current_page_item > a::after {
    display: none !important;
}

/* =========================================================
   4. Desktop Dropdown Menus
   ========================================================= */

@media screen and (min-width: 981px) {
    .htbuilder-nav ul.htbuilder-mainmenu li {
        position: relative !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu > li > ul.sub-menu {
        display: block !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: auto !important;
        width: auto !important;
        min-width: 260px !important;
        max-width: 340px !important;
        margin: 0 !important;
        padding: 10px !important;
        list-style: none !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.11) 0%,
                rgba(255, 255, 255, 0.045) 30%,
                rgba(0, 0, 0, 0.26) 100%
            ),
            radial-gradient(
                circle at 12% 0%,
                rgba(105, 118, 138, 0.14),
                rgba(105, 118, 138, 0) 55%
            ) !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.3) !important;
        border-radius: 0 0 14px 14px !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.1),
            0 24px 48px rgba(0, 0, 0, 0.56) !important;
        backdrop-filter: blur(14px) saturate(135%) !important;
        -webkit-backdrop-filter: blur(14px) saturate(135%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(6px) !important;
        transition:
            opacity 0.18s ease,
            visibility 0.18s ease,
            transform 0.18s ease !important;
        z-index: 10080 !important;
        overflow: visible !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu > li.menu-item-has-children::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -8px !important;
        height: 8px !important;
        background: transparent !important;
        z-index: 10079 !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu > li:hover > ul.sub-menu,
    .htbuilder-nav ul.htbuilder-mainmenu > li:focus-within > ul.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li {
        display: block !important;
        width: 100% !important;
        background: transparent !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        float: none !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a {
        display: block !important;
        width: 100% !important;
        color: rgba(255, 255, 255, 0.9) !important;
        background: transparent !important;
        font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 0.1px !important;
        line-height: 1.35 !important;
        padding: 11px 14px !important;
        border: none !important;
        border-radius: 9px !important;
        text-decoration: none !important;
        white-space: normal !important;
        box-sizing: border-box !important;
        transition:
            color 0.18s ease,
            background-color 0.18s ease,
            padding-left 0.18s ease !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a::after {
        display: none !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li:hover > a,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a:hover,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a:focus {
        color: #ffffff !important;
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13),
            rgba(118, 132, 154, 0.09)
        ) !important;
        padding-left: 18px !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li.current-menu-item > a,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li.current_page_item > a {
        color: #ffffff !important;
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.18),
            rgba(118, 132, 154, 0.14)
        ) !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu ul.sub-menu {
        display: block !important;
        position: absolute !important;
        top: 0 !important;
        left: 100% !important;
        right: auto !important;
        min-width: 260px !important;
        max-width: 340px !important;
        margin: 0 0 0 8px !important;
        padding: 10px !important;
        border-radius: 14px !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.1),
            0 24px 48px rgba(0, 0, 0, 0.56) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateX(6px) !important;
        transition:
            opacity 0.18s ease,
            visibility 0.18s ease,
            transform 0.18s ease !important;
        z-index: 10090 !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li:hover > ul.sub-menu,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li:focus-within > ul.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(0) !important;
    }
}

/* =========================================================
   5. Mobile Navigation — HT Builder
   ========================================================= */

.htbuilder-mobile-button {
    display: none;
}

.htbuilder-mobile-menu-area {
    z-index: 100000 !important;
}

.htbuilder-mobile-menu {
    background: rgba(8, 11, 16, 0.99) !important;
    color: #ffffff !important;
}

.htbuilder-mobile-menu ul,
.htbuilder-mobile-menu li {
    list-style: none !important;
}

.htbuilder-mobile-menu ul {
    margin: 0 !important;
    padding: 0 !important;
}

.htbuilder-mobile-menu ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.htbuilder-mobile-menu ul li a {
    display: block !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background: transparent !important;
    font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    padding: 14px 22px !important;
    text-decoration: none !important;
}

.htbuilder-mobile-menu ul li a:hover,
.htbuilder-mobile-menu ul li.current-menu-item > a,
.htbuilder-mobile-menu ul li.current_page_item > a {
    color: #ffffff !important;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.13),
        rgba(118, 132, 154, 0.08)
    ) !important;
}

.htbuilder-mobile-menu ul.sub-menu {
    background: rgba(11, 15, 22, 0.99) !important;
}

.htbuilder-mobile-menu ul.sub-menu li a {
    font-size: 13px !important;
    font-weight: 600 !important;
    padding-left: 38px !important;
}

.htbuilder-mobile-menu ul.sub-menu ul.sub-menu li a {
    padding-left: 54px !important;
}

.htbuilder-mobile-menu .menu-expand {
    color: #ffffff !important;
    background: transparent !important;
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    float: right !important;
    cursor: pointer !important;
    z-index: 10 !important;
    position: relative !important;
}

.htbuilder-mobile-close {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 14px !important;
}

/* Mobile breakpoint */
@media screen and (max-width: 980px) {
    .htbuilder-nav {
        display: none !important;
    }

    .htbuilder-mobile-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 54px !important;
        color: #ffffff !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.105) 0%,
                rgba(255, 255, 255, 0.035) 100%
            ) !important;
        border: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
        font-size: 22px !important;
        text-decoration: none !important;
        cursor: pointer !important;
        position: relative !important;
        z-index: 10030 !important;
    }

    .htbuilder-mobile-button::after {
        content: "Menu";
        font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif;
        font-size: 14px;
        font-weight: 800;
        letter-spacing: 0.2px;
        margin-left: 10px;
    }

    .htbuilder-menu-area {
        position: relative !important;
        z-index: 10020 !important;
    }
}

/* =========================================================
   6. Legacy / Theme Navigation Fallbacks
   These are harmless if the theme outputs Kadence menus too.
   ========================================================= */

#site-navigation,
.main-navigation {
    background-color: rgba(8, 11, 16, 0.98) !important;
    background-image:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.12) 0%,
            rgba(255, 255, 255, 0.055) 24%,
            rgba(255, 255, 255, 0.018) 48%,
            rgba(0, 0, 0, 0.28) 100%
        ),
        linear-gradient(
            90deg,
            rgba(5, 7, 11, 0.99) 0%,
            rgba(10, 14, 21, 0.98) 34%,
            rgba(13, 17, 25, 0.98) 66%,
            rgba(6, 8, 13, 0.99) 100%
        ) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.42) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 14px 34px rgba(0, 0, 0, 0.52) !important;
    position: relative !important;
    z-index: 9999 !important;
    width: 100% !important;
}

.main-navigation .inside-navigation,
.main-navigation .main-nav,
.main-navigation .main-nav > ul {
    background: transparent !important;
    border: none !important;
}

.site-header,
header.site-header,
.main-header-bar,
.ast-primary-header-bar,
.ast-above-header-wrap,
.ast-below-header-wrap,
.ast-main-header-wrap,
.ast-builder-grid-row,
.inside-header {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
}

/* =========================================================
   7. Responsive Top Bar
   ========================================================= */

@media screen and (max-width: 1024px) {
    .asc-creds {
        display: none;
    }

    .htbuilder-nav {
        padding: 0 10px !important;
    }

    .htbuilder-nav ul.htbuilder-mainmenu > li > a {
        font-size: 11.5px !important;
        padding: 18px 7px !important;
    }
}

@media screen and (max-width: 680px) {
    .asc-bar-inner {
        flex-wrap: wrap;
        gap: 10px 12px;
        min-height: 0;
        padding: 12px clamp(14px, 4vw, 20px);
    }

    .asc-brand {
        flex: 1 1 auto;
    }

    .asc-brand-sub {
        display: none;
    }

    .asc-logo img {
        height: 40px;
    }

    .asc-actions {
        width: 100%;
        justify-content: space-between;
        gap: 12px;
    }

    .asc-phone {
        font-size: 13px;
    }

    .asc-cta {
        flex: 1;
        justify-content: center;
        padding: 12px 16px;
    }
}

@media screen and (max-width: 430px) {
    .asc-brand-top {
        font-size: 17px;
    }

    .asc-logo img {
        height: 36px;
    }

    .asc-actions {
        flex-wrap: wrap;
    }

    .asc-phone {
        width: 100%;
        justify-content: center;
        order: 2;
        padding: 11px 14px;
        border: 1px solid var(--line);
        border-radius: 999px;
        background: #ffffff;
    }

    .asc-cta {
        width: 100%;
        order: 1;
    }
}

@media screen and (max-width: 340px) {
    .asc-brand-top {
        font-size: 15px;
    }

    .asc-logo img {
        height: 32px;
    }
}

/* =========================================================
   8. ASC Page Reveal / Visibility Fixes
   Fixes sections appearing only after hover/scroll/interaction
   ========================================================= */

.asc-premium-page .asc-reveal,
.asc-premium-page .asc-reveal.visible,
.asc-premium-page .asc-tab-panel,
.asc-elite-page .asc-reveal,
.asc-elite-page .asc-reveal.visible,
.asc-elite-page .asc-tab-panel,
.ascfs-reveal,
.ascfs-reveal:not(.visible),
.ascbrc-reveal,
.ascbrc-reveal:not(.visible),
.ascbrcp-reveal,
.ascbrcp-reveal:not(.visible) {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
}

/* Broader ASC reveal systems */
.asc-premium-page [class*="reveal"],
.asc-premium-page [class*="fade-in"],
.asc-premium-page [class*="fade-up"],
.asc-premium-page [class*="animate"],
.asc-elite-page [class*="reveal"],
.asc-elite-page [class*="fade-in"],
.asc-elite-page [class*="fade-up"],
.asc-elite-page [class*="animate"] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

/* Main wrappers visible on load */
.ascfs-premium-page,
.ascbrc-premium-page,
.ascbrcp-premium-page,
.ascbasket-page,
.asc-premium-page,
.asc-elite-page,
.asc-page {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
}

/* Make sure ASC images are not hidden */
.asc-premium-page img,
.asc-elite-page img,
.asc-page img {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Extra high-specificity reveal force */
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal.visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
}

:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbasket-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
}

/* =========================================================
   9. Hidden Panels / Overlays Should Not Block Clicks
   ========================================================= */

.ascfs-mobile-sections-overlay[hidden],
.ascfs-mobile-sections-panel[hidden],
.ascfs-sticky-cta[aria-hidden="true"],
.ascbrc-sticky-cta[aria-hidden="true"],
.ascbrcp-sticky-cta[aria-hidden="true"],
.asc-sticky-cta[aria-hidden="true"] {
    pointer-events: none !important;
}

.ascbrc-premium-page [hidden],
.ascbrcp-premium-page [hidden],
.ascfs-premium-page [hidden],
.asc-premium-page [hidden],
.asc-elite-page [hidden],
.asc-page [hidden] {
    pointer-events: none !important;
}

/* Important: keep real modals clickable when opened */
.amodal:not([hidden]) {
    pointer-events: auto !important;
}

.amodal:not([hidden]) .amodal-dialog,
.amodal:not([hidden]) .amodal-backdrop {
    pointer-events: auto !important;
}

/* =========================================================
   10. Cookie Banner / Admin Bar Safety
   ========================================================= */

#wpadminbar {
    z-index: 999999 !important;
}

.cmplz-cookiebanner {
    z-index: 999998 !important;
}

#cmplz-manage-consent {
    z-index: 999997 !important;
}

/* On logged-in mobile, prevent admin bar from crushing layout too badly */
@media screen and (max-width: 782px) {
    html {
        margin-top: 46px !important;
    }
}

/* =========================================================
   11. Floating Contact / Chat Stack Fixes
   ========================================================= */

.chat-stack,
.contact-fab,
.sentinel {
    z-index: 99990 !important;
}

.contact-fab a,
.sentinel-launcher,
.sentinel-panel {
    pointer-events: auto !important;
}

/* Prevent floating widgets from covering mobile form submit too aggressively */
@media screen and (max-width: 680px) {
    .chat-stack {
        right: 12px !important;
        bottom: 12px !important;
    }

    .sentinel-panel {
        max-width: calc(100vw - 24px) !important;
        right: 12px !important;
        left: 12px !important;
    }
}

/* =========================================================
   12. Footer Fixes
   ========================================================= */

.asc-hf.site-footer {
    margin-top: 0 !important;
    position: relative;
    z-index: 1;
}

.asc-hf.site-footer a {
    text-decoration: none !important;
}

/* Fix footer logo if image path fails or is too large */
.asc-hf .logo--footer img {
    max-width: 42px;
    max-height: 42px;
    object-fit: contain;
}

/* =========================================================
   13. Small Screen Refinements
   ========================================================= */

@media screen and (max-width: 480px) {
    .htbuilder-mobile-button {
        min-height: 52px !important;
        font-size: 20px !important;
    }

    .htbuilder-mobile-button::after {
        font-size: 13.5px !important;
    }

    .htbuilder-mobile-menu ul li a {
        font-size: 13.5px !important;
        padding: 14px 18px !important;
    }

    .htbuilder-mobile-menu ul.sub-menu li a {
        font-size: 13px !important;
        padding-left: 34px !important;
    }

    .htbuilder-mobile-menu ul.sub-menu ul.sub-menu li a {
        padding-left: 48px !important;
    }
}

@media screen and (max-width: 360px) {
    .htbuilder-mobile-button {
        min-height: 50px !important;
    }

    .htbuilder-mobile-button::after {
        font-size: 13px !important;
    }

    .htbuilder-mobile-menu ul li a {
        font-size: 13px !important;
        padding: 13px 16px !important;
    }

    .htbuilder-mobile-menu ul.sub-menu li a {
        font-size: 12.5px !important;
        padding-left: 30px !important;
    }
}

/* =========================================================
   14. Extra Defensive Fixes for Elementor / Theme Conflicts
   ========================================================= */

.elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}

.elementor-section,
.elementor-container,
.e-con {
    max-width: none;
}

/* Prevent Elementor lazy background behaviour from hiding important blocks */
.e-con.e-parent:not(.e-lazyloaded),
.e-con.e-parent:not(.e-lazyloaded) * {
    visibility: visible;
}

/* Keep SVG industry images visible */
.ind-media img,
.svc-card svg,
.card-icon svg {
    opacity: 1 !important;
    visibility: visible !important;
}

/* =========================================================
   15. Optional: Hide WordPress/Kadence duplicate mobile drawer
   Use this because your HT Builder menu already provides mobile nav.
   ========================================================= */

#mobile-drawer,
.popup-drawer,
.drawer-overlay {
    display: none !important;
    pointer-events: none !important;
}

/* =========================================================
   16. ENHANCEMENT LAYER  (brand-aligned polish + a11y)
   Added on top of the base global CSS. Ties the live theme
   nav/brand bar to the ASC burgundy/olive system, sharpens
   focus states for keyboard users, and respects motion prefs.
   ========================================================= */

:root {
    --asc-burgundy: #B02040;
    --asc-burgundy-deep: #8a1832;
    --asc-olive: #6B8E23;
    --asc-olive-bright: #7faa2c;
}

/* Sticky the live nav so it stays reachable while scrolling long pages */
.htbuilder-menu-area {
    position: sticky !important;
    top: 0 !important;
}
/* Keep dropdowns above sticky stacking context */
.htbuilder-nav ul.htbuilder-mainmenu > li > ul.sub-menu { z-index: 10085 !important; }

/* Brand-tint the nav hover underline (was plain white) so the dark nav
   reads as ASC, not generic. Olive→burgundy gradient picks up the logo. */
.htbuilder-nav ul.htbuilder-mainmenu > li > a::after {
    background: linear-gradient(
        90deg,
        rgba(127, 170, 44, 0),
        var(--asc-olive-bright) 35%,
        var(--asc-burgundy) 75%,
        rgba(176, 32, 64, 0)
    ) !important;
    height: 2.5px !important;
}
/* The active page gets a persistent burgundy underline (best-practice
   "you are here" affordance the original CSS hid). */
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-item > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li.current_page_item > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-parent > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-ancestor > a::after {
    display: block !important;
    transform: scaleX(1) !important;
    background: linear-gradient(90deg, var(--asc-olive-bright), var(--asc-burgundy)) !important;
}

/* Visible keyboard focus everywhere (accessibility / WCAG 2.4.7) */
.htbuilder-nav a:focus-visible,
.htbuilder-mobile-menu a:focus-visible,
.asc-bar a:focus-visible,
.asc-cta:focus-visible,
.asc-phone:focus-visible {
    outline: 3px solid var(--asc-olive-bright) !important;
    outline-offset: 2px !important;
    border-radius: 6px;
}
.htbuilder-menu-area a:focus-visible { outline-color: #ffffff !important; }

/* Brand-bar logo: ALWAYS visible with curved edges. Painted as a rounded
   background from the plugin logo.png so it shows even if the theme's <img>
   is empty/broken; any real <img> simply fills the same rounded box. */
.asc-bar .asc-logo {
    display: inline-flex !important;
    align-items: center; justify-content: center;
    flex: none !important;
    width: 52px !important; height: 52px !important;
    border-radius: 13px !important;
    overflow: hidden !important;
    background: #B02040 url("https://ascpestcontrol.co.za/wp-content/plugins/ASC-Pest_pages/logo.png") center / cover no-repeat !important;
    box-shadow: 0 4px 14px rgba(176,32,64,.22), 0 0 0 1px rgba(0,0,0,.05) !important;
}
/* Hide the theme's own <img> (it carries the "ASC Pest" wordmark text) so only
   the clean flame-A mark from the CSS background shows. */
.asc-bar .asc-logo img { display: none !important; }

/* Place the logo to the RIGHT of the "ASC Pest Control" wordmark. */
.asc-bar .asc-brand { align-items: center !important; }
.asc-bar .asc-word { order: 1 !important; }
.asc-bar .asc-logo { order: 2 !important; margin-left: 10px !important; }

/* Desktop only (≥1100px): add a business-hours + email info line to the top
   bar. Hidden on tablet/mobile so the bar stays clean on small viewports. */
@media (min-width: 1100px) {
    .asc-bar .asc-actions { gap: 16px !important; }
    .asc-bar .asc-actions::before {
        content: "Mon–Fri 08:00–17:00 · Sat 08:00–13:00  ·  info@ascpestcontrol.co.za";
        order: -1;
        align-self: center;
        white-space: nowrap;
        font-size: 12px; font-weight: 700; letter-spacing: .01em;
        color: #5b6470;
        padding-right: 16px;
        border-right: 1px solid var(--line, #E5E5E5);
    }
}

/* Mobile: pin the logo to the TOP-RIGHT corner of the nav bar. */
@media (max-width: 680px) {
    .asc-bar .asc-bar-inner { position: relative !important; padding-right: 64px !important; }
    .asc-bar .asc-logo {
        position: absolute !important;
        top: 10px !important; right: 14px !important;
        margin: 0 !important;
        width: 44px !important; height: 44px !important;
        z-index: 2 !important;
    }
}

/* Brand-bar CTA: a touch more presence + clear active state */
.asc-cta:active { transform: translateY(0) !important; }

/* Smooth in-page anchor scrolling, offset for the sticky nav */
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 90px; }

/* Respect reduced-motion: kill transitions/animations for those users */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* =========================================================
   17. MARKETING BLOCKS  (.ascx-*) — enterprise sections
   Drop-in shortcodes: trust bar, 4-step process, testimonials,
   free-survey band, enquiry form. Brand: burgundy + olive.
   ========================================================= */

.ascx {
    --bg-deep: #8a1832;
    --line: #e5e7eb;
    --fg: #161b21;
    --muted: #4a5560;
    font-family: "Inter", "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    padding: clamp(2.75rem, 2rem + 4vw, 5rem) 0;
}
.ascx *, .ascx *::before, .ascx *::after { box-sizing: border-box; }
.ascx-wrap { width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: clamp(1rem, .5rem + 2vw, 1.75rem); }

.ascx-head { max-width: 46rem; margin: 0 auto clamp(1.75rem, 3vw, 2.75rem); text-align: center; }
.ascx-head--left { text-align: left; margin-inline: 0; }
.ascx-eyebrow { display: inline-block; font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--asc-olive); margin-bottom: .55rem; }
.ascx-on-dark { color: #d8e6bf; }
.ascx-head h2 { font-size: clamp(1.6rem, 1rem + 2.4vw, 2.5rem); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; color: var(--fg); margin: 0 0 .5rem; }
.ascx-lead { color: var(--muted); font-size: 1.05rem; margin: 0; }
.ascx-head:not(.ascx-head--left) .ascx-lead { margin-inline: auto; max-width: 52ch; }

/* Buttons */
.ascx-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; font-weight: 700; font-size: .95rem; padding: .85rem 1.6rem; border-radius: 999px; border: 2px solid transparent; cursor: pointer; text-decoration: none; transition: transform .2s, box-shadow .2s, background .2s, color .2s; }
.ascx-btn-primary { background: var(--asc-burgundy); color: #fff; box-shadow: 0 8px 20px rgba(176,32,64,.26); }
.ascx-btn-primary:hover { background: var(--asc-burgundy-deep); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(176,32,64,.36); }
.ascx-btn-light { background: #fff; color: var(--asc-burgundy-deep); }
.ascx-btn-light:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0,0,0,.18); }
.ascx-btn-wa { background: #25D366; color: #062b14; }
.ascx-btn-wa:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(37,211,102,.4); }

/* 1. Trust bar */
.ascx-trust { background: #fff; border-block: 1px solid var(--line); padding-block: clamp(1.5rem, 1rem + 2vw, 2.25rem); }
.ascx-trust-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.ascx-trust-item { display: flex; align-items: center; gap: .85rem; }
.ascx-trust-item svg { flex: none; color: var(--asc-olive); }
.ascx-trust-item strong { display: block; font-size: .98rem; color: var(--fg); line-height: 1.2; }
.ascx-trust-item span { font-size: .85rem; color: var(--muted); }

/* 2. Process */
.ascx-process { background: #f6f7f8; }
.ascx-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); counter-reset: none; }
.ascx-step { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 1.6rem 1.4rem; transition: transform .25s, box-shadow .25s, border-color .25s; }
.ascx-step:hover { transform: translateY(-4px); border-color: var(--asc-olive); box-shadow: 0 18px 40px rgba(0,0,0,.08); }
.ascx-step-num { display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 12px; font-weight: 900; font-size: 1.05rem; color: #fff; background: linear-gradient(135deg, var(--asc-burgundy), var(--asc-burgundy-deep)); margin-bottom: .9rem; }
.ascx-step h3 { font-size: 1.15rem; font-weight: 800; color: var(--fg); margin: 0 0 .35rem; }
.ascx-step p { color: var(--muted); font-size: .94rem; margin: 0; line-height: 1.55; }

/* 3. Testimonials */
.ascx-quotes { background: #fff; }
.ascx-quote-grid { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
.ascx-quote { margin: 0; background: #f6f7f8; border: 1px solid var(--line); border-radius: 16px; padding: 1.6rem 1.5rem; display: flex; flex-direction: column; gap: .7rem; }
.ascx-stars { color: #f6b100; letter-spacing: 2px; font-size: 1.05rem; }
.ascx-quote blockquote { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--fg); }
.ascx-quote figcaption { display: flex; flex-direction: column; }
.ascx-quote figcaption strong { color: var(--fg); font-size: .95rem; }
.ascx-quote figcaption span { color: var(--muted); font-size: .82rem; }

/* 4. Free-survey band */
.ascx-survey { background: radial-gradient(900px 420px at 80% -20%, rgba(176,32,64,.55), transparent 60%), linear-gradient(135deg, var(--asc-burgundy-deep), #5e1022); color: #fff; }
.ascx-survey-inner { display: grid; gap: 1.6rem; align-items: center; }
@media (min-width: 56rem) { .ascx-survey-inner { grid-template-columns: 1.5fr auto; } }
.ascx-survey h2 { font-size: clamp(1.6rem, 1rem + 2.2vw, 2.4rem); font-weight: 800; color: #fff; margin: 0 0 .5rem; letter-spacing: -.02em; }
.ascx-survey p { color: rgba(255,255,255,.9); margin: 0; max-width: 52ch; }
.ascx-survey-cta { display: flex; flex-wrap: wrap; gap: .8rem; }

/* 5. Enquiry form */
.ascx-enquiry { background: #f6f7f8; }
.ascx-enquiry-card { background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: clamp(1.5rem, 1rem + 3vw, 3rem); max-width: 880px; box-shadow: 0 18px 50px rgba(20,24,31,.07); }
.ascx-form { display: grid; gap: 1rem; margin-top: 1.4rem; }
.ascx-field-row { display: grid; gap: 1rem; }
@media (min-width: 34rem) { .ascx-field-row { grid-template-columns: 1fr 1fr; } }
.ascx-field { display: flex; flex-direction: column; gap: .4rem; }
.ascx-field > span { font-weight: 700; font-size: .82rem; color: var(--fg); }
.ascx-field input, .ascx-field select, .ascx-field textarea { width: 100%; padding: .85rem 1rem; border: 1.5px solid var(--line); border-radius: 11px; background: #fff; color: var(--fg); font-size: .96rem; font-family: inherit; transition: border-color .2s, box-shadow .2s; }
.ascx-field input:focus, .ascx-field select:focus, .ascx-field textarea:focus { outline: none; border-color: var(--asc-burgundy); box-shadow: 0 0 0 3px rgba(176,32,64,.14); }
.ascx-field textarea { resize: vertical; min-height: 5.5rem; }
.ascx-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.ascx-form-submit { justify-self: start; }
.ascx-form-status { margin: 0; font-size: .9rem; font-weight: 600; }
.ascx-form-status.is-ok { color: #1f7a3d; }
.ascx-form-status.is-err { color: #c0392b; }

/* =========================================================
   18. SITE-WIDE VISUAL OVERHAUL  (typography rhythm + links)
   Light touch so it lifts every page without fighting the
   page builders. Targets ASC content scopes only.
   ========================================================= */
.asc-page, .ascfs-premium-page, .ascbrc-premium-page, .asc-premium-page, .asc-elite-page {
    font-feature-settings: "kern" 1, "liga" 1;
    text-rendering: optimizeLegibility;
}
.asc-page h1, .asc-page h2, .asc-page h3,
.asc-premium-page h1, .asc-premium-page h2, .asc-premium-page h3 {
    letter-spacing: -.02em;
}

/* =========================================================
   19. NAV ENHANCEMENT v3 — LIGHT, matches the page UI
   The base rules paint the HT Builder nav dark, which clashes
   with the white/burgundy/olive page. This converts the whole
   header (brand bar + main nav + dropdowns + mobile) to a
   cohesive LIGHT brand treatment and fixes button fit.
   Loaded last so it wins the cascade.
   ========================================================= */

/* ---- Brand bar: seamless with the nav below it ---- */
.asc-bar { box-shadow: none; border-bottom: 1px solid var(--line); }
.asc-brand-top { letter-spacing: -0.015em; }
.asc-chip { transition: border-color .2s, box-shadow .2s, transform .2s; }
.asc-chip:hover { border-color: rgba(176,32,64,.4); box-shadow: 0 4px 14px rgba(20,24,31,.08); transform: translateY(-1px); }

/* Buttons fit their container: never overflow, wrap gracefully */
.asc-bar-inner { flex-wrap: wrap; row-gap: 8px; }
.asc-actions { flex-wrap: wrap; max-width: 100%; }
.asc-cta {
    box-shadow: 0 6px 18px rgba(176,32,64,.28);
    letter-spacing: .01em; max-width: 100%;
}
.asc-cta::after { content: "→"; font-weight: 700; transform: translateX(-2px); transition: transform .2s ease; }
.asc-cta:hover::after { transform: translateX(2px); }

/* ---- Main nav: LIGHT bar matching the page ---- */
.htbuilder-menu-area {
    position: sticky !important;
    top: 0 !important;
    background-color: rgba(255,255,255,.92) !important;
    background-image: none !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px) !important;
    backdrop-filter: saturate(180%) blur(14px) !important;
    border-top: 1px solid rgba(0,0,0,.05) !important;
    border-bottom: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: 0 6px 22px rgba(20,24,31,.08) !important;
}
.htbuilder-menu-area::before,
.htbuilder-menu-area::after { display: none !important; }

.htbuilder-nav > ul.htbuilder-mainmenu { gap: 2px !important; }
.htbuilder-nav ul.htbuilder-mainmenu > li > a {
    color: #2b333d !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: .015em !important;
    padding: 20px 15px !important;
    border-radius: 10px 10px 0 0 !important;
    transition: color .2s ease, background-color .2s ease !important;
}
.htbuilder-nav ul.htbuilder-mainmenu > li > a:hover,
.htbuilder-nav ul.htbuilder-mainmenu > li:hover > a,
.htbuilder-nav ul.htbuilder-mainmenu > li:focus-within > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-item > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current_page_item > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-parent > a,
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-ancestor > a {
    color: var(--asc-burgundy) !important;
    background: linear-gradient(180deg, rgba(127,170,44,.10), rgba(176,32,64,.07)) !important;
    box-shadow: none !important;
}
/* Brand underline (olive -> burgundy) */
.htbuilder-nav ul.htbuilder-mainmenu > li > a::after {
    background: linear-gradient(90deg, var(--asc-olive-bright), var(--asc-burgundy)) !important;
    height: 2.5px !important;
}
.htbuilder-nav ul.htbuilder-mainmenu > li.current-menu-item > a::after,
.htbuilder-nav ul.htbuilder-mainmenu > li.current_page_item > a::after {
    display: block !important; transform: scaleX(1) !important;
}

/* ---- Dropdowns: white card, dark text, brand accent ---- */
@media screen and (min-width: 981px) {
    .htbuilder-nav ul.htbuilder-mainmenu > li > ul.sub-menu,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu ul.sub-menu {
        min-width: 248px !important;
        padding: 8px !important;
        border: 1px solid rgba(0,0,0,.08) !important;
        border-top: 2px solid var(--asc-burgundy) !important;
        border-radius: 0 0 14px 14px !important;
        background-color: #ffffff !important;
        background-image: none !important;
        box-shadow: 0 22px 50px rgba(20,24,31,.16) !important;
    }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu ul.sub-menu { border-radius: 14px !important; }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a {
        position: relative !important;
        color: #3a434e !important;
        font-size: 13px !important;
        padding: 11px 14px 11px 26px !important;
        border-radius: 10px !important;
    }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a::before {
        content: "" !important; position: absolute !important;
        left: 12px !important; top: 50% !important; margin-top: -2.5px !important;
        width: 5px !important; height: 5px !important; border-radius: 50% !important;
        background: rgba(0,0,0,.2) !important;
        transition: background .18s ease, transform .18s ease !important;
    }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li:hover > a,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a:hover {
        color: var(--asc-burgundy) !important;
        background: rgba(176,32,64,.07) !important;
        padding-left: 28px !important;
    }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li a:hover::before {
        background: var(--asc-olive) !important; transform: scale(1.5) !important;
    }
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li.current-menu-item > a,
    .htbuilder-nav ul.htbuilder-mainmenu ul.sub-menu li.current_page_item > a {
        color: var(--asc-burgundy) !important; background: rgba(176,32,64,.10) !important;
    }
}

/* ---- Mobile: light drawer + light toggle button ---- */
.htbuilder-mobile-menu { background: #ffffff !important; color: #2b333d !important; }
.htbuilder-mobile-menu ul li { border-bottom: 1px solid rgba(0,0,0,.06) !important; }
.htbuilder-mobile-menu ul li a {
    color: #2b333d !important;
    padding: 15px 22px !important;
    transition: background-color .18s ease, padding-left .18s ease, color .18s ease !important;
}
.htbuilder-mobile-menu ul li a:hover,
.htbuilder-mobile-menu ul li.current-menu-item > a,
.htbuilder-mobile-menu ul li.current_page_item > a {
    color: var(--asc-burgundy) !important;
    background: rgba(176,32,64,.06) !important;
    box-shadow: inset 3px 0 0 var(--asc-burgundy) !important;
    padding-left: 26px !important;
}
.htbuilder-mobile-menu ul.sub-menu { background: #f6f7f8 !important; }
.htbuilder-mobile-menu ul.sub-menu li a { color: #3a434e !important; }
.htbuilder-mobile-menu .menu-expand,
.htbuilder-mobile-close { color: #2b333d !important; }
.htbuilder-mobile-close { background: rgba(0,0,0,.06) !important; }
.htbuilder-mobile-button {
    color: #ffffff !important;
    background-color: var(--asc-burgundy) !important;
    background-image: none !important;
    border-bottom: none !important;
    letter-spacing: .3px !important;
    transition: background-color .2s ease !important;
}
.htbuilder-mobile-button:hover { background-color: var(--asc-burgundy-deep) !important; }

/* Legacy theme nav fallback -> also light, so nothing renders dark */
#site-navigation, .main-navigation {
    background-color: rgba(255,255,255,.92) !important;
    background-image: none !important;
    border-top: 1px solid rgba(0,0,0,.05) !important;
    border-bottom: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: 0 6px 22px rgba(20,24,31,.08) !important;
}

/* =========================================================
   20. MOBILE & LEGIBILITY HARDENING  (site-wide, defensive)
   Addresses QA feedback: faint colours, text over images,
   buttons not fitting, and mobile responsiveness. Conservative
   so it lifts every page (incl. Elementor) without breaking layout.
   ========================================================= */

/* Media never overflows its container; no horizontal scroll on phones */
img, svg, video, iframe { max-width: 100%; }
img:not([width]):not([height]) { height: auto; }
html, body { overflow-x: hidden; max-width: 100%; }

/* Long headings/words wrap instead of forcing horizontal scroll */
h1, h2, h3, h4, .ascx h1, .ascx h2, .ascx h3, .asc-brand-top { overflow-wrap: break-word; word-break: break-word; }

/* Stronger text contrast — fixes "faint colours / not appearing" */
.ascx-lead, .section-lead { color: #44505c !important; }
.ascx-eyebrow { color: var(--olive-deep, #557018) !important; }
.asc-brand-sub { color: #5b6470 !important; }

/* Touch targets ≥ 44px for interactive ASC controls (WCAG / mobile) */
.asc-cta, .ascx-btn, .btn,
.htbuilder-nav ul.htbuilder-mainmenu > li > a,
.htbuilder-mobile-menu ul li a { min-height: 44px; }

/* Buttons fit their container and wrap their label instead of overflowing */
.ascx-btn, .asc-cta, .btn { max-width: 100%; white-space: normal; }

/* Any ASC section with text over a photo gets a readable scrim
   (the burgundy survey band already has one; this guards the rest) */
.ascx-survey { position: relative; }

@media (max-width: 700px) {
  /* CTAs go full-width so they're easy to tap and never clip */
  .asc-actions { width: 100%; }
  .asc-cta { width: 100%; justify-content: center; }
  .ascx-survey-cta { width: 100%; }
  .ascx-survey-cta .ascx-btn { flex: 1 1 100%; justify-content: center; }
  .ascx-btn, .btn { width: 100%; justify-content: center; }
  /* Trim section padding so content isn't lost in whitespace on phones */
  .ascx { padding: 2.25rem 0; }
  .ascx-enquiry-card { padding: 1.25rem; border-radius: 16px; }
  /* Form fields stack for thumb-friendly entry */
  .ascx-field-row { grid-template-columns: 1fr; }
  /* Process / trust / quote grids stack cleanly */
  .ascx-steps, .ascx-trust-grid, .ascx-quote-grid { grid-template-columns: 1fr; }
}

/* Respect users who prefer fewer animations */
@media (prefers-reduced-motion: reduce) {
  .asc-cta::after, .ascx-btn, .htbuilder-nav a { transition: none !important; }
}

/* =========================================================
   21. CLOSE GAP between the menu bar and the hero
   The page hero sits inside the theme content wrappers, which add
   top spacing under the sticky nav. Zero that so the hero meets
   the menu bar cleanly. Also trims the homepage hero's top offset.
   ========================================================= */
.asc-page { margin-top: 0 !important; padding-top: 0 !important; }
.asc-page > *:first-child { margin-top: 0 !important; }

/* Theme (Kadence/Astra/Elementor) content wrappers above the hero */
.content-area, .site-content, .content-container.site-container,
.entry-content, .entry-content-wrap, .single-content,
.e-con.e-parent:first-child { margin-top: 0 !important; padding-top: 0 !important; }

/* The first ASC section/hero should butt up against the nav */
.asc-page > .page-hero:first-child,
.asc-page .page-hero:first-of-type,
.asc-page > .hero:first-child { margin-top: 0 !important; }

/* Homepage hero: drop the fixed-header offset on theme-rendered pages
   (the theme nav is in normal flow, so the offset became a gap) */
.asc-page .hero--v3 .hero-overlay { padding-top: clamp(1.5rem, 1rem + 2vw, 2.75rem) !important; }

/* =========================================================
   22. REMOVE: Sentinel assistant + Sign-in buttons
   ========================================================= */
/* Sentinel AI chat widget removed (Call/WhatsApp/email FABs stay). */
.sentinel, #sentinel { display: none !important; }

/* Sign-in buttons removed across hero and headers. */
#hero-portal-btn, #header-portal-btn, #mobile-portal-btn,
.header-cta[href*="signin"], a.header-cta[href*="signin"] { display: none !important; }

/* =========================================================
   End of ASC Pest Control CSS
   ========================================================= */
/* ===== END asc-global.css ===== */

/* ===== BEGIN asc-header-footer.css ===== */
/* ASC Pest Control — standalone header + footer styles for Elementor HTML widgets.
   Self-contained: variables + container + buttons + header/nav + footer.
   Load this ONCE (Elementor → Site Settings → Custom Code, or a <link> in the
   header HTML widget). Light burgundy/olive theme baked in. */

.asc-hf {
  --burgundy: #B02040;
  --burgundy-deep: #8a1832;
  --olive: #6B8E23;
  --olive-deep: #557018;
  --fg: #1c2128;
  --muted: #5b6470;
  --line: #E5E5E5;
  --surface: #FFFFFF;
  --bg-alt: #EBEEF0;
  --maxw: 1180px;
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .14);
}

/* layout + reset within our blocks */
.asc-hf, .asc-hf * { box-sizing: border-box; }
.asc-hf a { text-decoration: none; }
.asc-hf .container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: clamp(1rem, .5rem + 2vw, 1.75rem); }

/* buttons */
.asc-hf .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-weight: 700; font-size: .92rem; letter-spacing: .02em;
  padding: .8rem 1.5rem; border-radius: 999px; border: 2px solid transparent;
  cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s, color .2s, border-color .2s;
  white-space: nowrap;
}
.asc-hf .btn-primary { background: var(--burgundy); color: #fff; box-shadow: var(--shadow-sm); }
.asc-hf .btn-primary:hover { background: var(--burgundy-deep); transform: translateY(-2px); }

/* ===== Header ===== */
.asc-hf.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, .9);
  backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--line);
  transition: background .3s, border-color .3s, box-shadow .3s;
}
.asc-hf.site-header.scrolled { background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.asc-hf .header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 4.5rem; }

.asc-hf .logo { display: flex; align-items: center; gap: .7rem; font-weight: 800; color: var(--fg); }
.asc-hf .logo img { width: 40px; height: 40px; border-radius: 10px; }
.asc-hf .logo-text { line-height: 1.05; }
.asc-hf .logo-text strong { color: var(--burgundy); }
.asc-hf .logo-text small { display: block; font-size: .6rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

.asc-hf .nav-links { display: flex; align-items: center; gap: 1.8rem; }
.asc-hf .nav-links a { font-weight: 600; font-size: .95rem; color: #44505c; position: relative; transition: color .2s; }
.asc-hf .nav-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--olive); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.asc-hf .nav-links a:hover { color: var(--burgundy); }
.asc-hf .nav-links a:hover::after { transform: scaleX(1); }

.asc-hf .nav-item { position: relative; }
.asc-hf .nav-tab {
  background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit;
  font-weight: 600; font-size: .95rem; color: #44505c;
  display: inline-flex; align-items: center; gap: .35rem; transition: color .2s; white-space: nowrap;
}
.asc-hf .nav-tab:hover, .asc-hf .nav-item.open .nav-tab { color: var(--burgundy); }
.asc-hf .nav-caret { transition: transform .2s ease; flex-shrink: 0; }
.asc-hf .nav-item.open .nav-caret { transform: rotate(180deg); }

.asc-hf .nav-dropdown {
  position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(-6px);
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: .5rem; min-width: 210px;
  box-shadow: 0 12px 40px rgba(0,0,0,.14); display: none; flex-direction: column; gap: 1px;
  opacity: 0; transition: opacity .18s ease, transform .18s ease; z-index: 200;
}
.asc-hf .nav-item:hover > .nav-dropdown,
.asc-hf .nav-item:focus-within > .nav-dropdown,
.asc-hf .nav-item.open .nav-dropdown { display: flex; opacity: 1; transform: translateX(-50%) translateY(0); }
.asc-hf .nav-item:hover .nav-caret, .asc-hf .nav-item:focus-within .nav-caret { transform: rotate(180deg); }
/* hover bridge so the dropdown doesn't close in the gap */
.asc-hf .nav-item.has-dropdown > .nav-dropdown::before { content: ""; position: absolute; left: -8px; right: -8px; top: -16px; height: 18px; background: transparent; }
.asc-hf .nav-dropdown a { padding: .62rem .9rem; border-radius: 8px; font-size: .88rem; font-weight: 500; color: #44505c; transition: background .15s, color .15s; white-space: nowrap; }
.asc-hf .nav-dropdown a::after { display: none; }
.asc-hf .nav-dropdown a:hover { background: rgba(176,32,64,.08); color: var(--burgundy); }

.asc-hf .header-cta { /* visibility handled in media query */ }

.asc-hf .nav-toggle {
  display: none; flex-direction: column; gap: 5px; background: none; border: 0; padding: .55rem;
  border-radius: 10px; cursor: pointer; position: relative; z-index: 110;
  min-width: 44px; min-height: 44px; align-items: center; justify-content: center;
}
.asc-hf .nav-toggle span { width: 24px; height: 2.5px; background: #1c2128; border-radius: 2px; transition: .25s ease; }
.asc-hf .nav-toggle.is-open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.asc-hf .nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.asc-hf .nav-toggle.is-open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

.asc-hf .mobile-nav {
  display: none; flex-direction: column; gap: .25rem;
  padding: .5rem clamp(1rem, .5rem + 2vw, 1.75rem) 1.25rem; background: #fff; border-bottom: 1px solid var(--line);
}
.asc-hf .mobile-nav.open { display: flex; }
.asc-hf .mobile-nav > a { padding: .85rem .5rem; font-weight: 600; border-radius: 10px; color: #1c2128; }
.asc-hf .mobile-nav > a:hover { background: var(--bg-alt); color: var(--burgundy); }
.asc-hf .mobile-nav .btn { margin-top: .5rem; }
.asc-hf .mnav-item { border-radius: 10px; overflow: hidden; }
.asc-hf .mnav-tab {
  width: 100%; background: none; border: 0; text-align: left; cursor: pointer; font-family: inherit;
  font-weight: 600; font-size: 1rem; color: #1c2128; padding: .85rem .5rem;
  display: flex; align-items: center; justify-content: space-between; border-radius: 10px; transition: background .15s, color .15s;
}
.asc-hf .mnav-tab:hover, .asc-hf .mnav-item.open .mnav-tab { color: var(--burgundy); }
.asc-hf .mnav-item.open .nav-caret { transform: rotate(180deg); }
.asc-hf .mnav-sub { display: none; flex-direction: column; padding: 0 .5rem .4rem 1.1rem; gap: 2px; }
.asc-hf .mnav-item.open .mnav-sub { display: flex; }
.asc-hf .mnav-sub a { padding: .6rem .75rem; font-size: .9rem; color: #44505c; border-radius: 8px; font-weight: 500; }
.asc-hf .mnav-sub a:hover { background: rgba(176,32,64,.08); color: var(--burgundy); }

/* ===== Header search ===== */
.asc-hf .asc-search { display: flex; align-items: center; gap: .35rem; background: var(--bg-alt); border: 1px solid var(--line); border-radius: 999px; padding: .25rem .35rem .25rem .85rem; transition: border-color .2s, box-shadow .2s; }
.asc-hf .asc-search:focus-within { border-color: var(--burgundy); box-shadow: 0 0 0 3px rgba(176,32,64,.12); }
.asc-hf .asc-search input { border: 0; background: transparent; outline: 0; font: inherit; font-size: .9rem; color: var(--fg); width: 9rem; min-width: 0; }
.asc-hf .asc-search input::placeholder { color: var(--muted); }
.asc-hf .asc-search button { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--burgundy); color: #fff; cursor: pointer; flex-shrink: 0; transition: background .2s; }
.asc-hf .asc-search button:hover { background: var(--burgundy-deep); }
/* full-width search inside the mobile menu */
.asc-hf .asc-search--mobile { margin: .25rem 0 .6rem; }
.asc-hf .asc-search--mobile input { width: 100%; }

@media (max-width: 60rem) {
  .asc-hf .nav-links, .asc-hf .header-cta, .asc-hf .asc-search--desktop { display: none; }
  .asc-hf .nav-toggle { display: inline-flex; }
}
@media (min-width: 60.01rem) {
  .asc-hf .asc-search--mobile { display: none; }
}

/* ===== Footer ===== */
.asc-hf.site-footer { background: var(--burgundy-deep); border-top: 1px solid rgba(255,255,255,.12); padding-block: 3.5rem 1.75rem; color: rgba(255,255,255,.8); }
.asc-hf .footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.asc-hf .logo--footer { margin-bottom: .9rem; }
.asc-hf .logo--footer .logo-text, .asc-hf .logo--footer .logo-text strong { color: #fff; }
.asc-hf .footer-note { color: rgba(255,255,255,.8); font-size: .92rem; max-width: 28ch; }
.asc-hf .footer-accreditations { display: flex; align-items: center; gap: .75rem; margin-top: 1.25rem; flex-wrap: wrap; }
.asc-hf .footer-accred-label { font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.asc-hf .footer-accred-badge { display: inline-flex; align-items: center; background: #fff; border-radius: 6px; padding: .3rem .65rem; box-shadow: 0 1px 6px rgba(0,0,0,.2); }
.asc-hf .footer-accred-badge img { display: block; height: 34px; width: auto; }
.asc-hf .footer-social { display: flex; align-items: center; gap: .6rem; margin-top: 1.25rem; flex-wrap: wrap; }
.asc-hf .footer-social-label { font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.7); width: 100%; }
.asc-hf .footer-social-btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; transition: background .2s, transform .2s; }
.asc-hf .footer-social-btn:hover { background: rgba(255,255,255,.25); transform: translateY(-2px); }
.asc-hf .site-footer h4, .asc-hf.site-footer h4 { color: #fff; font-size: .95rem; margin-bottom: 1rem; }
.asc-hf.site-footer ul { display: grid; gap: .6rem; list-style: none; padding: 0; margin: 0; }
.asc-hf.site-footer a { color: rgba(255,255,255,.8); font-size: .92rem; transition: color .2s; }
.asc-hf.site-footer a:hover { color: #fff; }
.asc-hf .footer-contact-link { display: inline-flex; align-items: center; gap: .5rem; }
.asc-hf .footer-bottom { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.12); margin-top: 2.5rem; padding-top: 1.4rem; font-size: .84rem; color: rgba(255,255,255,.7); }
/* ===== END asc-header-footer.css ===== */

/* ===== BEGIN home-v2.css ===== */
/* ==========================================================================
   ASC Pest Control — Home v2 (clean Grid/Flex layout, ASC dark brand)
   Self-contained: own tokens; does not depend on styles.css.
   ========================================================================== */

/* --------------------------------------------------------- CSS variables */
:root {
  /* Brand — Burgundy primary, Olive secondary (light theme) */
  --burgundy: #B02040;
  --burgundy-bright: #c92a4e;
  --burgundy-deep: #8a1832;
  --olive: #6B8E23;
  --olive-deep: #557018;
  /* --orange* kept as burgundy aliases so existing rules re-theme automatically */
  --orange: #B02040;
  --orange-bright: #B02040;
  --orange-deep: #8a1832;

  /* Surfaces (light) — White + Light Gray */
  --ink-950: #8a1832;   /* deep burgundy — used by hero / CTA / footer bands */
  --ink-900: #7a1530;
  --bg: #FFFFFF;
  --bg-alt: #F4F5F6;
  --surface: #FFFFFF;
  --surface-2: #F1F2F4;
  --line: #E5E5E5;

  /* Text — dark on light */
  --fg: #1c2128;
  --muted: #5b6470;

  /* Type */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Shape */
  --radius: 16px;
  --radius-lg: 22px;
  --maxw: 1180px;
  --shadow: 0 18px 40px rgba(0, 0, 0, .45);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .3);
}

/* --------------------------------------------------------- reset / base */
* { box-sizing: border-box; }
* { margin: 0; }
button, a, [role="button"], summary { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
@media (pointer: coarse) {
  button, a, [role="button"], summary,
  input[type="submit"], input[type="button"], input[type="reset"] {
    min-height: 44px; min-width: 44px;
  }
  /* hero sector pills are inline — only enforce height */
  .hero-sector-btn, .badge, .nav-tab, .mnav-tab { min-height: 44px; }
}
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--fg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { line-height: 1.12; letter-spacing: -.02em; font-weight: 800; }
ul { list-style: none; padding: 0; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; border-radius: 6px; }

.container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: clamp(1rem, .5rem + 2vw, 1.75rem); }
.eyebrow { display: inline-block; font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--orange-bright); margin-bottom: .6rem; }
.eyebrow.on-dark { color: var(--orange-bright); }
.section-lead { color: var(--muted); font-size: 1.05rem; max-width: 60ch; }
.section-lead.on-dark { color: #cbd3db; }

/* --------------------------------------------------------- buttons (pill) */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-weight: 700; font-size: .92rem; letter-spacing: .02em;
  padding: .8rem 1.5rem; border-radius: 999px; border: 2px solid transparent;
  cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s, color .2s, border-color .2s;
  white-space: nowrap;
}
.btn-lg { padding: 1rem 1.9rem; font-size: 1rem; }
.btn-primary { background: var(--orange); color: #fff; box-shadow: var(--shadow-sm); }
.btn-primary:hover, .btn-primary:active { background: var(--orange-deep); transform: translateY(-2px); box-shadow: 0 14px 34px rgba(244, 84, 30, .4); }
.btn-outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }
.btn-outline-light:hover, .btn-outline-light:active { border-color: #fff; transform: translateY(-2px); }
.hero-sector-btn:active { background: rgba(244,84,30,.18); border-color: var(--orange-bright); transform: translateY(-2px); }

/* ========================================================= STICKY HEADER (Flexbox) */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(11, 15, 21, .72);
  backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: background .3s, border-color .3s, box-shadow .3s;
}
.site-header.scrolled { background: rgba(11, 15, 21, .94); border-bottom-color: var(--line); box-shadow: var(--shadow-sm); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 4.5rem; }

.logo { display: flex; align-items: center; gap: .7rem; font-weight: 800; }
.logo img { width: 40px; height: 40px; border-radius: 10px; }
.logo-text { line-height: 1.05; }
.logo-text strong { color: var(--orange-bright); }
.logo-text small { display: block; font-size: .6rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

.nav-links { display: flex; align-items: center; gap: 1.8rem; }
.nav-links a { font-weight: 600; font-size: .95rem; color: var(--muted); position: relative; transition: color .2s; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: var(--orange); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.nav-links a:hover { color: var(--fg); }
.nav-links a:hover::after { transform: scaleX(1); }

/* ── Dropdown nav ── */
.nav-item { position: relative; }
.nav-tab {
  background: none; border: 0; padding: 0; cursor: pointer;
  font-family: inherit; font-weight: 600; font-size: .95rem;
  color: var(--muted); display: inline-flex; align-items: center; gap: .35rem;
  transition: color .2s; white-space: nowrap;
}
.nav-tab:hover, .nav-tab:focus-visible { color: var(--fg); outline: none; }
.nav-caret { transition: transform .2s ease; flex-shrink: 0; }
.nav-item.open .nav-caret { transform: rotate(180deg); }
.nav-item.open .nav-tab { color: var(--fg); }

.nav-dropdown {
  position: absolute; top: calc(100% + 14px); left: 50%;
  transform: translateX(-50%) translateY(-6px);
  background: #131820; border: 1px solid var(--line);
  border-radius: 12px; padding: .5rem;
  min-width: 210px; box-shadow: 0 12px 40px rgba(0,0,0,.55);
  display: none; flex-direction: column; gap: 1px;
  opacity: 0; transition: opacity .18s ease, transform .18s ease;
  z-index: 200;
}
.nav-item.open .nav-dropdown {
  display: flex; opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* Open dropdowns on hover / keyboard focus (Services tab is now a link) */
.nav-item:hover > .nav-dropdown,
.nav-item:focus-within > .nav-dropdown {
  display: flex; opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.nav-item:hover .nav-caret,
.nav-item:focus-within .nav-caret { transform: rotate(180deg); }

.nav-dropdown a {
  padding: .62rem .9rem; border-radius: 8px;
  font-size: .88rem; font-weight: 500; color: var(--muted);
  transition: background .15s, color .15s; white-space: nowrap;
}
.nav-dropdown a::after { display: none; }
.nav-dropdown a:hover { background: rgba(176,32,64,.1); color: var(--orange-bright); }

.nav-toggle {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: 0; padding: .55rem; border-radius: 10px; cursor: pointer;
  position: relative; z-index: 110;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  min-width: 44px; min-height: 44px;
  align-items: center; justify-content: center;
}
.nav-toggle span { width: 24px; height: 2.5px; background: var(--fg); border-radius: 2px; transition: .25s ease; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

.mobile-nav {
  display: none; flex-direction: column; gap: .25rem;
  padding: .5rem clamp(1rem, .5rem + 2vw, 1.75rem) 1.25rem;
  background: var(--ink-900); border-bottom: 1px solid var(--line);
  position: relative; z-index: 105;
}
.mobile-nav.open { display: flex; }
.mobile-nav > a { padding: .85rem .5rem; font-weight: 600; border-radius: 10px; color: var(--fg); }
.mobile-nav > a:hover { background: var(--surface); color: var(--orange-bright); }
.mobile-nav .btn { margin-top: .5rem; }

/* mobile accordion */
.mnav-item { border-radius: 10px; overflow: hidden; }
.mnav-tab {
  width: 100%; background: none; border: 0; text-align: left; cursor: pointer;
  font-family: inherit; font-weight: 600; font-size: 1rem; color: var(--fg);
  padding: .85rem .5rem; display: flex; align-items: center; justify-content: space-between;
  border-radius: 10px; transition: background .15s, color .15s;
}
.mnav-tab:hover { background: var(--surface); color: var(--orange-bright); }
.mnav-item.open .mnav-tab { color: var(--orange-bright); }
.mnav-item.open .nav-caret { transform: rotate(180deg); }
.mnav-sub { display: none; flex-direction: column; padding: 0 .5rem .4rem 1.1rem; gap: 2px; }
.mnav-item.open .mnav-sub { display: flex; }
.mnav-sub a { padding: .6rem .75rem; font-size: .9rem; color: var(--muted); border-radius: 8px; font-weight: 500; transition: background .15s, color .15s; }
.mnav-sub a:hover { background: rgba(176,32,64,.1); color: var(--orange-bright); }

/* ========================================================= HERO */
.hero { position: relative; isolation: isolate; min-height: clamp(34rem, 70vh, 46rem); display: grid; }
.hero-bg { position: absolute; inset: 0; z-index: -2; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 38%; filter: brightness(.62); }
.hero-overlay {
  display: grid; align-items: center;
  background:
    linear-gradient(90deg, rgba(11, 15, 21, .9) 0%, rgba(11, 15, 21, .74) 45%, rgba(11, 15, 21, .4) 100%),
    linear-gradient(0deg, rgba(11, 15, 21, .55) 0%, transparent 40%),
    radial-gradient(1000px 500px at 80% -10%, rgba(176, 32, 64, .22), transparent 60%);
}
.hero-overlay h1, .hero-overlay p, .hero h1, .hero .hero-lead, .hero-inner h1, .hero-inner p {
  text-shadow: 0 2px 6px rgba(0, 0, 0, .85), 0 2px 30px rgba(0, 0, 0, .9);
}
.hero-inner { padding-block: clamp(3.5rem, 8vh, 6rem); max-width: 46rem; }
.badge {
  display: inline-flex; align-items: center; gap: .5rem; font-size: .8rem; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; color: #fff;
  background: var(--orange); padding: .5rem 1rem; border-radius: 999px; box-shadow: 0 8px 24px rgba(244, 84, 30, .4);
}
.hero h1 { font-size: clamp(2.2rem, 1rem + 5.5vw, 4rem); font-weight: 900; color: #fff; margin: 1.1rem 0 .9rem; }
.hero h1 .hl { color: var(--orange-bright); }
.hero-lead { color: #d3dae1; font-size: clamp(1.02rem, .95rem + .5vw, 1.25rem); max-width: 40ch; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 1.9rem; }
.hero-sector-btns { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
/* Mobile hero: shorter viewport, tighter padding. A dedicated portrait crop
   (hero-pest-control-mobile.jpg, swapped in via <picture>) keeps the
   technician centred and in focus instead of stretching the desktop
   landscape photo and cropping them out of frame. */
@media (max-width: 48rem) {
  .hero { min-height: clamp(30rem, 92vh, 40rem); }
  .hero-bg img { object-position: center top; }
  .hero-overlay {
    background:
      linear-gradient(180deg, rgba(11, 15, 21, .55) 0%, rgba(11, 15, 21, .82) 55%, rgba(11, 15, 21, .92) 100%);
  }
  .hero-inner { padding-block: 2.75rem; }
  .badge { font-size: .72rem; padding: .45rem .85rem; }
  .hero h1 { margin: .9rem 0 .75rem; }
}
/* On small phones make hero CTAs full-width */
@media (max-width: 26rem) {
  .hero-cta { flex-direction: column; }
  .hero-cta .btn { width: 100%; justify-content: center; }
  .hero-sector-btns { flex-direction: column; }
  .hero-sector-btn { width: 100%; justify-content: center; }
}
.hero-sector-btn {
  background: rgba(255,255,255,.06);
  border: 1.5px solid rgba(255,255,255,.22);
  color: #fff; font-size: .88rem; font-weight: 700;
  padding: .65rem 1.25rem; border-radius: 999px;
  gap: .45rem; cursor: pointer;
  transition: background .2s, border-color .2s, transform .2s;
  backdrop-filter: blur(6px);
}
.hero-sector-btn:hover { background: rgba(244,84,30,.18); border-color: var(--orange-bright); transform: translateY(-2px); }

/* ========================================================= SECTIONS */
section { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.trust { background: var(--bg-alt); }
.trust-inner { max-width: 56rem; margin-inline: auto; text-align: center; }
.trust h2 { font-size: clamp(1.7rem, 1rem + 2.6vw, 2.6rem); text-transform: uppercase; }
.trust .section-lead { margin: .9rem auto 0; }

.stats { margin-top: 2.5rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: 1rem; }
.stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1rem; }
.stat strong { display: block; font-size: clamp(1.8rem, 1rem + 2vw, 2.6rem); font-weight: 900; color: var(--orange-bright); }
.stat span { color: var(--muted); font-size: .9rem; font-weight: 600; }

/* ── Trust accreditation logos (in trust section) ── */
.trust-accreditations {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
}
.trust-accred-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}
.trust-accred-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem;
}
.trust-accred-badge {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border-radius: 8px;
  padding: .5rem 1rem;
  transition: box-shadow .2s, transform .2s;
  box-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.trust-accred-badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
}
.trust-accred-badge img { display: block; height: 48px; width: auto; }

/* ---- service highlight: CSS Grid split ---- */
.partner-grid { display: grid; gap: clamp(2rem, 1rem + 4vw, 4rem); align-items: center; }
@media (min-width: 60rem) { .partner-grid { grid-template-columns: 1fr 1fr; } }
.partner-copy h2 { font-size: clamp(1.7rem, 1rem + 2.6vw, 2.6rem); text-transform: uppercase; margin-bottom: .9rem; }
.partner-copy .btn { margin-top: 1.6rem; }
.partner-cards { display: grid; gap: 1.1rem; }
@media (min-width: 30rem) { .partner-cards { grid-template-columns: 1fr 1fr; } }
.service-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem; transition: transform .25s ease, border-color .25s, box-shadow .25s; }
.service-card:hover { transform: translateY(-5px); border-color: var(--orange); box-shadow: var(--shadow); }
.card-icon { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; border-radius: 14px; margin-bottom: 1rem; color: var(--orange-bright); background: rgba(244, 84, 30, .14); border: 1px solid rgba(244, 84, 30, .35); }
.service-card h3 { font-size: 1.2rem; margin-bottom: .4rem; }
.service-card p { color: var(--muted); font-size: .94rem; }
.card-link { display: inline-block; margin-top: 1rem; color: var(--orange-bright); font-weight: 700; font-size: .9rem; }

/* ---- compliance band ---- */
.band { background: var(--bg-alt); }
.band-inner { display: grid; gap: 1.5rem; align-items: center; background: linear-gradient(150deg, var(--ink-900), var(--surface)); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.75rem, 1rem + 3vw, 3rem); }
@media (min-width: 56rem) { .band-inner { grid-template-columns: 1.6fr auto; } }
.band h2 { font-size: clamp(1.5rem, 1rem + 1.8vw, 2.1rem); text-transform: uppercase; margin: .2rem 0 .6rem; }

/* ---- contact CTA ---- */
.cta { background: radial-gradient(900px 400px at 50% -10%, rgba(244, 84, 30, .4), transparent 60%), var(--ink-950); text-align: center; }
.cta-inner { max-width: 46rem; margin-inline: auto; }
.cta h2 { font-size: clamp(1.9rem, 1rem + 3vw, 3rem); color: #fff; margin: .3rem 0 .7rem; }
.cta .section-lead { margin: 0 auto 1.8rem; }
.cta-actions { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }

/* ========================================================= FOOTER */
.site-footer { background: var(--ink-950); border-top: 1px solid var(--line); padding-block: 3.5rem 1.75rem; }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.logo--footer { margin-bottom: .9rem; }
.footer-note { color: var(--muted); font-size: .92rem; max-width: 28ch; }

/* ── Footer accreditation badge ── */
.footer-accreditations {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-top: 1.25rem;
  flex-wrap: wrap;
}
.footer-accred-label {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
  flex-shrink: 0;
}
.footer-accred-badge {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border-radius: 6px;
  padding: .3rem .65rem;
  transition: box-shadow .2s;
  box-shadow: 0 1px 6px rgba(0,0,0,.2);
}
.footer-accred-badge:hover { box-shadow: 0 3px 14px rgba(0,0,0,.3); }
.footer-accred-badge img { display: block; height: 34px; width: auto; }
.site-footer h4 { color: #fff; font-size: .95rem; margin-bottom: 1rem; }
.site-footer ul { display: grid; gap: .6rem; }
.site-footer a { color: var(--muted); font-size: .92rem; transition: color .2s; }
.site-footer a:hover { color: var(--orange-bright); }
.footer-bottom { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; border-top: 1px solid var(--line); margin-top: 2.5rem; padding-top: 1.4rem; font-size: .84rem; color: #7e8893; }

/* ========================================================= responsive header */
@media (max-width: 60rem) {
  .nav-links, .header-cta { display: none; }
  .nav-toggle { display: inline-flex; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Added sections — Services · Industries · Plans · Areas · FAQ
   ========================================================================== */
.section-head { max-width: 46rem; margin: 0 auto clamp(2rem, 3vw, 3rem); text-align: center; }
.section-head h2 { font-size: clamp(1.7rem, 1rem + 2.6vw, 2.6rem); margin-bottom: .5rem; }
.section-head .section-lead { margin-inline: auto; }

/* section background rhythm */
.services { background: var(--bg); }
.industries { background: var(--bg-alt); }
.partner { background: var(--bg); }
.plans { background: var(--bg-alt); }
.band { background: var(--bg); }
.areas { background: var(--bg-alt); }
.faq-section { background: var(--bg); }

/* Services grid */
.svc-grid { display: grid; gap: 1.35rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr)); }
.svc-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(155deg, rgba(255,255,255,.05), rgba(255,255,255,.015) 55%),
    var(--surface);
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 4px);
  padding: 1.75rem 1.6rem;
  box-shadow: 0 1px 0 rgba(255,255,255,.04) inset;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.svc-card::before {
  content: "";
  position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--burgundy, #B02040), var(--olive, #6B8E23));
  opacity: 0; transform: scaleX(.4); transform-origin: left;
  transition: opacity .3s ease, transform .35s cubic-bezier(.2,.7,.2,1);
}
.svc-card:hover {
  transform: translateY(-6px);
  border-color: rgba(176,32,64,.4);
  box-shadow: 0 26px 60px rgba(0,0,0,.28), 0 1px 0 rgba(255,255,255,.06) inset;
}
.svc-card:hover::before { opacity: 1; transform: scaleX(1); }
.svc-card .card-icon {
  margin-bottom: 1.05rem;
  box-shadow: 0 10px 26px rgba(176,32,64,.16), inset 0 1px 0 rgba(255,255,255,.12);
  transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.svc-card:hover .card-icon { transform: translateY(-2px) scale(1.06); }
.svc-card h3 { font-size: 1.08rem; font-weight: 800; letter-spacing: -.01em; margin-bottom: .4rem; }
.svc-card p { color: var(--muted); font-size: .92rem; line-height: 1.6; }

/* Industries gallery */
.ind-grid { display: grid; gap: 1.35rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.ind-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: calc(var(--radius) + 4px);
  overflow: hidden; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.ind-card:hover { transform: translateY(-6px); border-color: rgba(176,32,64,.4); box-shadow: 0 26px 60px rgba(0,0,0,.28); }
.ind-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(155deg, rgba(176,32,64,.10), rgba(107,142,35,.08)); }
.ind-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; padding: 1.1rem; box-sizing: border-box; }
.ind-card:hover .ind-media img { transform: scale(1.08); }
.ind-caption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 1.6rem .9rem .55rem;
  background: linear-gradient(0deg, rgba(11,15,21,.86) 0%, rgba(11,15,21,.35) 70%, transparent 100%);
  color: #fff; font-size: .72rem; font-weight: 600; line-height: 1.35;
  opacity: 0; transform: translateY(6px);
  transition: opacity .3s ease, transform .3s ease;
}
.ind-card:hover .ind-caption { opacity: 1; transform: translateY(0); }
.ind-body { padding: 1.3rem 1.35rem 1.5rem; }
.ind-body h3 { font-size: 1.12rem; font-weight: 800; letter-spacing: -.01em; margin-bottom: .35rem; }
.ind-body p { color: var(--muted); font-size: .9rem; line-height: 1.55; }

/* Area highlights (Eastern Cape / Gauteng) above the service-area map */
.area-highlights { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); margin-bottom: 2rem; }
.area-highlight {
  background: var(--surface); border: 1px solid var(--line); border-radius: calc(var(--radius) + 4px);
  overflow: hidden; transition: transform .3s cubic-bezier(.2,.7,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.area-highlight:hover { transform: translateY(-6px); border-color: rgba(176,32,64,.4); box-shadow: 0 26px 60px rgba(0,0,0,.28); }
.area-highlight__media {
  position: relative; aspect-ratio: 20 / 9; overflow: hidden;
  background: linear-gradient(160deg, var(--ink-900, #11161c), var(--ink-950, #0b0f15));
}
.area-highlight__media svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.area-highlight__caption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 2rem 1.1rem .7rem;
  background: linear-gradient(0deg, rgba(11,15,21,.88) 0%, rgba(11,15,21,.25) 75%, transparent 100%);
  color: #fff; font-size: .78rem; font-weight: 600;
}
.area-highlight__body { padding: 1.25rem 1.35rem 1.45rem; }
.area-highlight__body h3 { font-size: 1.2rem; font-weight: 800; margin-bottom: .35rem; }
.area-highlight__body p { color: var(--muted); font-size: .92rem; line-height: 1.55; }

/* Plans */
.plans-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.plan { position: relative; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.9rem 1.6rem; }
.plan h3 { font-size: 1.2rem; }
.plan-price { color: var(--orange-bright); font-weight: 700; margin: .3rem 0 1.1rem; font-size: .95rem; }
.plan ul { display: grid; gap: .6rem; margin-bottom: 1.4rem; }
.plan li { display: flex; gap: .55rem; color: var(--muted); font-size: .93rem; }
.plan li::before { content: "✓"; color: var(--success); font-weight: 800; }
.plan .btn { margin-top: auto; width: 100%; }
.plan.featured { border-color: var(--orange); box-shadow: 0 0 0 1px var(--orange), var(--shadow); }
.plan-tag { position: absolute; top: -.8rem; left: 50%; transform: translateX(-50%); background: var(--orange); color: #fff; font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: .3rem .9rem; border-radius: 999px; }

/* ── Tiered domestic packages ── */
.plans-intro-actions { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; margin-top: 1.4rem; }
.plans-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }

/* Tier accent colours */
.plan--silver { --tier: #a0aec0; }
.plan--gold   { --tier: #f6c000; }
.plan--platinum { --tier: #a78bfa; }

.plan-tier {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--tier); margin-bottom: .55rem;
}
.plan-sub { color: var(--muted); font-size: .85rem; margin: .1rem 0 1rem; }

.plan-price-block { background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.1rem; margin-bottom: 1rem; }
.plan-from { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: .3rem; }
.plan-amount { display: flex; align-items: baseline; gap: .2rem; line-height: 1; }
.plan-currency { font-size: 1.3rem; font-weight: 800; color: var(--tier); }
.plan-figure { font-size: 2.8rem; font-weight: 900; color: var(--fg); letter-spacing: -.04em; }
.plan-period { font-size: .85rem; font-weight: 600; color: var(--muted); margin-left: .2rem; }
.plan-daily { color: var(--tier); font-size: .82rem; font-weight: 700; margin-top: .5rem; }

.plan-scope { font-size: .8rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--tier); border-top: 1px solid var(--line); padding-top: .9rem; margin-bottom: .65rem; }

/* plan list — override base */
.plans-grid--3 .plan ul { display: grid; gap: .4rem; margin-bottom: 1.2rem; }
.plans-grid--3 .plan li { color: var(--muted); font-size: .88rem; display: flex; gap: .5rem; align-items: flex-start; }
.plans-grid--3 .plan li::before { content: "✓"; color: #4ade80; font-weight: 800; flex: none; }
.plan-li-extra { color: var(--fg) !important; font-weight: 700 !important; }
.plan-li-extra::before { color: var(--tier) !important; content: "★" !important; }

.plan-cta { width: 100%; margin-top: auto; }
.plan--gold .plan-cta { background: var(--orange); border-color: var(--orange); color: #fff; }
.plan-note { color: var(--muted); font-size: .8rem; text-align: center; margin-top: .75rem; line-height: 1.45; }

/* Gold featured ring uses gold accent */
.plan--gold.featured { border-color: #f6c000; box-shadow: 0 0 0 1px #f6c000, var(--shadow); }

/* Service areas */
.areas-list { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; max-width: 62rem; margin-inline: auto; }
.area-pill { list-style: none; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: .6rem 1.1rem; font-weight: 600; font-size: .9rem; color: var(--fg); transition: .2s ease; }
.area-pill:hover { border-color: var(--orange); color: var(--orange-bright); transform: translateY(-2px); }

/* FAQ */
.faq { max-width: 52rem; margin-inline: auto; display: grid; gap: .8rem; }
.faq details { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: border-color .25s; }
.faq details[open] { border-color: rgba(244, 84, 30, .5); }
.faq summary { list-style: none; cursor: pointer; padding: 1.1rem 1.3rem; font-weight: 700; font-size: 1.02rem; color: var(--fg); display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq-ico { flex: none; width: 1.4rem; height: 1.4rem; position: relative; color: var(--orange-bright); transition: transform .3s ease; }
.faq-ico::before, .faq-ico::after { content: ""; position: absolute; inset: 50% 0 auto 50%; transform: translate(-50%, -50%); background: currentColor; border-radius: 2px; }
.faq-ico::before { width: 14px; height: 2.4px; }
.faq-ico::after { width: 2.4px; height: 14px; transition: transform .3s ease; }
.faq details[open] .faq-ico { transform: rotate(180deg); }
.faq details[open] .faq-ico::after { transform: translate(-50%, -50%) scaleY(0); }
.faq-a { padding: 0 1.3rem 1.1rem; color: var(--muted); }
.faq-a a { color: var(--orange-bright); }

/* ========================================================= SA MAP */
.map-wrap { max-width: 700px; margin-inline: auto; position: relative; }

.map-legend {
  display: flex; align-items: center; justify-content: center;
  gap: 1.4rem; margin-bottom: 1.2rem; flex-wrap: wrap;
}
.map-legend span {
  display: flex; align-items: center; gap: .45rem;
  font-size: .82rem; font-weight: 700; color: var(--muted);
}
.map-legend span::before {
  content: ""; width: 14px; height: 14px; border-radius: 4px; flex: none;
}
.legend-ec::before { background: rgba(244, 84, 30, .55); border: 1.5px solid var(--orange); }
.legend-gp::before { background: rgba(80, 160, 240, .45); border: 1.5px solid #50a0f0; }
.legend-dot::before { background: var(--orange-bright); border-radius: 50%; width: 10px; height: 10px; }

.sa-map { width: 100%; height: auto; display: block; }

/* country fill */
.sa-base { fill: var(--surface-2); stroke: var(--line); stroke-width: 1.5; }
.sa-enclave { fill: var(--bg-alt); stroke: var(--line); stroke-width: 1; }

/* province highlights */
.province { stroke-width: 1.8; }
.ec { fill: rgba(244, 84, 30, .22); stroke: var(--orange); }
.gp { fill: rgba(80, 160, 240, .3); stroke: #50a0f0; }

/* province border lines */
.border { fill: none; stroke: var(--line); stroke-width: 1; stroke-dasharray: 4 3; }

/* labels */
.prov-label { font-family: var(--font); font-weight: 800; font-size: 11px; pointer-events: none; }
.ec-label { fill: var(--orange-bright); }
.gp-label { fill: #7dc8ff; }

/* city pins */
.pin-dot { fill: var(--orange-bright); filter: url(#glow); }
.primary-pin { fill: var(--orange); r: 7; }
.gp-pin { fill: #50a0f0; }

.pin-pulse {
  fill: none; stroke: var(--orange-bright); stroke-width: 1.5; opacity: .35;
  animation: pulse-ring 2.2s ease-out infinite;
}
.gp-pulse { stroke: #50a0f0; }

@keyframes pulse-ring {
  0%   { r: 10; opacity: .5; }
  100% { r: 22; opacity: 0; }
}

.pin-label {
  font-family: var(--font); font-size: 9.5px; font-weight: 700;
  fill: var(--fg); pointer-events: none; paint-order: stroke;
  stroke: var(--bg-alt); stroke-width: 3px;
}

.city-pin { cursor: default; }
.city-pin:hover .pin-dot,
.city-pin:focus .pin-dot { opacity: .8; }
.city-pin:hover .pin-label,
.city-pin:focus .pin-label { fill: var(--orange-bright); }

@media (prefers-reduced-motion: reduce) {
  .pin-pulse { animation: none; }
}

/* ========================================================= CHAT STACK */

/* Shared fixed container — Vera on top, Sentinel below */
.chat-stack {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .65rem;
}

/* ========================================================= SENTINEL WIDGET */

/* ---- Positioning shell ---- */
.sentinel {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  gap: .75rem;
}

/* ---- Launcher button ---- */
.sentinel-launcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .5rem .9rem .5rem .5rem;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  color: #fff;
  background: linear-gradient(135deg, #0ea89a 0%, #0b7a70 100%);
  box-shadow: 0 4px 20px rgba(14,168,154,.45), 0 0 0 1px rgba(255,255,255,.08);
  transition: transform .2s ease, box-shadow .2s ease;
  white-space: nowrap;
  font-family: var(--font);
  font-size: .88rem;
  font-weight: 700;
}
.sentinel-launcher:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(14,168,154,.6), 0 0 0 1px rgba(255,255,255,.14);
}
.sentinel-launcher-label { line-height: 1; }

/* Launcher orb — wraps the inline SVG icon */
.sentinel-orb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  background: rgba(20,210,190,.15);
  border: 1px solid rgba(20,210,190,.3);
  flex: none;
}
.sentinel-orb svg { display: block; }
.sentinel-orb.sm {
  width: 1.9rem;
  height: 1.9rem;
}

/* Online ping dot */
.sentinel-ping {
  position: absolute;
  top: .18rem;
  right: .18rem;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 2px #0ea89a;
  animation: s-ping 2.4s ease-in-out infinite;
}
@keyframes s-ping {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%       { transform: scale(1.4); opacity: .7; }
}

/* ---- Panel ---- */
/*
  Key fix: use display:flex with flex-direction:column and explicit height.
  aria-hidden="true" hides it; toggling to "false" + adding .open shows it.
  Never use `hidden` attribute here — it forces display:none which blocks
  the CSS flex layout from being applied on reveal.
*/
.sentinel-panel {
  /* anchored above the sentinel launcher */
  position: absolute;
  bottom: calc(100% + .75rem);
  right: 0;

  /* size */
  width: 23rem;
  max-width: calc(100vw - 2rem);
  height: 32rem;
  max-height: calc(100svh - 8rem);

  /* layout — CRITICAL: all three zones must fill the panel exactly */
  display: flex;
  flex-direction: column;
  overflow: hidden;

  /* visual */
  background: var(--ink-900);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04);

  /* show/hide */
  visibility: hidden;
  opacity: 0;
  transform: translateY(12px) scale(.97);
  transform-origin: bottom right;
  transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
  pointer-events: none;
}
.sentinel-panel.open {
  visibility: visible;
  opacity: 1;
  transform: none;
  transition: opacity .22s ease, transform .22s ease;
  pointer-events: auto;
}
.sentinel-panel.minimised {
  height: auto;
}
.sentinel-panel.minimised .sentinel-messages,
.sentinel-panel.minimised .sentinel-foot {
  display: none;
}

/* ---- Header zone (top) — no open gap ---- */
.sentinel-head {
  /* must be self-contained: background fills edge-to-edge */
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .85rem 1rem;
  background: linear-gradient(135deg, #1a212b 0%, #0f141b 100%);
  border-bottom: 1px solid var(--line);
  border-radius: 18px 18px 0 0;   /* match panel top corners exactly */
  flex: none;                      /* never shrink or grow */
  cursor: grab;
  user-select: none;
  min-height: 0;                   /* prevent implicit expansion */
}
.sentinel-head:active { cursor: grabbing; }

.sentinel-id {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.sentinel-id strong {
  font-size: .93rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}
.sentinel-sub {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-size: .7rem;
  color: var(--muted);
  line-height: 1;
}
.sentinel-status-dot {
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: #22c55e;
  flex: none;
  animation: s-ping 2.4s ease-in-out infinite;
}

.sentinel-head-actions {
  display: flex;
  align-items: center;
  gap: .25rem;
  flex: none;
}
.sentinel-icon-btn {
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 7px;
  border: none;
  background: rgba(255,255,255,.07);
  color: var(--muted);
  cursor: pointer;
  transition: background .15s, color .15s;
  line-height: 1;
}
.sentinel-icon-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
.sentinel-close-btn:hover { background: rgba(239,68,68,.25); color: #fca5a5; }

/* ---- Messages zone (middle) — grows to fill ---- */
.sentinel-messages {
  flex: 1 1 0;          /* grow + shrink; basis 0 so flex controls it fully */
  min-height: 0;        /* CRITICAL: allows shrink inside flex column */
  overflow-y: auto;
  overflow-x: hidden;
  padding: .9rem;
  display: flex;
  flex-direction: column;
  gap: .55rem;
  background: rgba(255,255,255,.015);
  scroll-behavior: smooth;
}
.sentinel-messages::-webkit-scrollbar { width: 5px; }
.sentinel-messages::-webkit-scrollbar-track { background: transparent; }
.sentinel-messages::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.12);
  border-radius: 4px;
}

/* Message bubbles */
.msg {
  max-width: 86%;
  padding: .6rem .85rem;
  border-radius: 14px;
  font-size: .9rem;
  line-height: 1.5;
  word-break: break-word;
  animation: msg-in .2s ease both;
}
.msg.bot {
  align-self: flex-start;
  background: var(--surface-2);
  border: 1px solid var(--line);
  color: var(--fg);
  border-bottom-left-radius: 4px;
}
.msg.user {
  align-self: flex-end;
  background: linear-gradient(135deg, var(--orange) 0%, var(--orange-deep) 100%);
  color: #fff;
  border-bottom-right-radius: 4px;
}
.msg a { color: var(--orange-bright); text-decoration: underline; }
.msg.user a { color: #ffe0d4; }
.sentinel-sources {
  margin-top: .4rem;
  font-size: .75rem;
  color: rgba(255,255,255,.45);
}
.sentinel-sources a { color: var(--orange-bright); }
@keyframes msg-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* Typing indicator */
.typing {
  align-self: flex-start;
  display: flex;
  gap: .3rem;
  padding: .65rem .85rem;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 14px;
  border-bottom-left-radius: 4px;
}
.typing span {
  width: .42rem;
  height: .42rem;
  border-radius: 50%;
  background: var(--muted);
  animation: t-bounce .9s ease-in-out infinite;
}
.typing span:nth-child(2) { animation-delay: .15s; }
.typing span:nth-child(3) { animation-delay: .3s; }
@keyframes t-bounce {
  0%, 80%, 100% { transform: translateY(0); }
  40%           { transform: translateY(-5px); }
}

/* ---- Footer zone (bottom) — no open gap ---- */
.sentinel-foot {
  flex: none;                     /* never grow or shrink */
  display: flex;
  flex-direction: column;
  background: var(--ink-950);     /* solid fill all the way to panel edge */
  border-top: 1px solid var(--line);
  border-radius: 0 0 18px 18px;  /* match panel bottom corners exactly */
  overflow: hidden;               /* clips children to rounded corners */
  min-height: 0;
}

.sentinel-form {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .7rem .75rem;
}
.sentinel-voice {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  flex: none;
  transition: color .15s, background .15s;
}
.sentinel-voice:hover, .sentinel-voice.listening {
  color: var(--orange-bright);
  background: rgba(244,84,30,.12);
}
.sentinel-input {
  flex: 1;
  min-width: 0;
  padding: .6rem .85rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--fg);
  font-size: .88rem;
  font-family: var(--font);
  transition: border-color .2s, box-shadow .2s;
}
.sentinel-input::placeholder { color: var(--muted); opacity: .7; }
.sentinel-input:focus {
  outline: none;
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(244,84,30,.15);
}
.sentinel-send {
  display: grid;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  border: none;
  border-radius: 50%;
  background: var(--orange);
  color: #fff;
  cursor: pointer;
  flex: none;
  transition: background .2s, transform .15s;
}
.sentinel-send:hover {
  background: var(--orange-deep);
  transform: scale(1.06);
}

.sentinel-disclaimer {
  margin: 0;
  padding: .3rem .75rem .55rem;
  font-size: .68rem;
  color: rgba(255,255,255,.28);
  text-align: center;
  line-height: 1.4;
  background: var(--ink-950); /* same as foot so no colour break */
}

/* ---- Responsive ---- */
@media (max-width: 480px) {
  .chat-stack {
    bottom: 1rem;
    right: 1rem;
  }
  .sentinel-panel {
    width: calc(100vw - 2rem);
    height: calc(100svh - 7rem);
    max-height: none;
    border-radius: 14px;
  }
  .sentinel-head { border-radius: 14px 14px 0 0; }
  .sentinel-foot { border-radius: 0 0 14px 14px; }
  .sentinel-launcher-label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .sentinel-panel { transition: none; }
  .sentinel-ping, .sentinel-status-dot,
  .typing span, .msg { animation: none; }
}

/* ========================================================= CRAWLER / PERFORMANCE */

/* Scroll-margin so sticky header never obscures anchor targets */
[id] { scroll-margin-block-start: 5.5rem; }

/* text-rendering — better legibility + hints for crawlers reading rendered text */
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { text-rendering: geometricPrecision; }

/* image-rendering — crispness for SVG icons, no blur on logos */
img[src$=".svg"], img[src$=".png"] { image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; }

/* content-visibility: auto — defers off-screen rendering; helps CLS/LCP */
.services, .industries, .partner, .plans, .band, .areas, .faq-section {
  content-visibility: auto;
  contain-intrinsic-size: 0 600px;
}

/* Logical properties — future-proof i18n / RTL readiness */
.container { padding-inline: clamp(1rem, .5rem + 2vw, 1.75rem); }
.section-head { margin-block-end: clamp(2rem, 3vw, 3rem); }

/* ========================================================= PRINT STYLESHEET
   Ensures crawlers that render print versions (some indexers) see clean NAP.   */
@media print {
  .site-header, .mobile-nav, .nav-toggle, .sentinel,
  .hero-bg, .hero-overlay, .btn, .faq-ico,
  .map-wrap, .ind-media, .card-icon { display: none !important; }

  body { background: #fff; color: #000; font-size: 11pt; }
  a { color: #000; text-decoration: underline; }
  a[href^="tel"]::after { content: " (" attr(href) ")"; }
  a[href^="mailto"]::after { content: " (" attr(href) ")"; }

  h1, h2, h3 { color: #000; page-break-after: avoid; }
  section { page-break-inside: avoid; padding-block: 1rem; }

  .site-footer { border-top: 1pt solid #ccc; margin-top: 2rem; padding-top: 1rem; }
  .footer-bottom { font-size: 8pt; color: #555; }

  /* Print NAP block clearly */
  .site-footer::before {
    content: "ASC Pest Control Services | Tel: 061 138 3989 | info@ascpestcontrol.co.za | Gqeberha, Eastern Cape, South Africa";
    display: block; font-size: 9pt; margin-bottom: 1rem; color: #333;
  }
}

/* ========================================================= FORCED COLORS (accessibility) */
@media (forced-colors: active) {
  .btn-primary { forced-color-adjust: none; background: Highlight; color: HighlightText; }
  .btn-outline-light { border-color: ButtonText; color: ButtonText; }
  .svc-card, .ind-card, .plan, .service-card { border-color: ButtonText; }
  .eyebrow, .orange, .hl { color: Highlight; }
  .sentinel-launcher { border-color: ButtonText; }
}

/* ========================================================= REDUCED DATA */
@media (prefers-reduced-data: reduce) {
  .hero-bg img { display: none; }
  .hero { min-height: 24rem; background: var(--ink-950); }
  .ind-media img { display: none; }
  .ind-media { background: var(--surface); min-height: 4rem; }
}

/* ========================================================= BOOKING CHOOSER */
.booking-chooser {
  display: grid; gap: .85rem; max-width: 38rem; margin: 2rem auto 0;
}
@media (min-width: 36rem) { .booking-chooser { grid-template-columns: 1fr 1fr; } }

.booking-choice {
  display: flex; align-items: center; gap: .9rem;
  width: 100%; text-align: left; cursor: pointer;
  padding: 1.1rem 1rem; border: 1.5px solid var(--line);
  border-radius: var(--radius); background: var(--surface);
  color: var(--fg); transition: border-color .2s, transform .2s, box-shadow .2s;
}
.booking-choice:hover {
  border-color: var(--orange); transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(244,84,30,.2);
}
.bc-icon {
  flex: none; display: grid; place-items: center;
  width: 2.8rem; height: 2.8rem; border-radius: 12px;
  background: rgba(244,84,30,.14); border: 1px solid rgba(244,84,30,.35);
  color: var(--orange-bright);
}
.bc-text { flex: 1; display: flex; flex-direction: column; gap: .15rem; }
.bc-text strong { font-size: 1rem; font-weight: 700; }
.bc-text small { color: var(--muted); font-size: .82rem; }
.bc-arrow { color: var(--muted); transition: transform .2s, color .2s; }
.booking-choice:hover .bc-arrow { color: var(--orange-bright); transform: translateX(4px); }

/* ========================================================= MODAL SYSTEM */
.amodal {
  position: fixed; inset: 0; z-index: 1000;
  display: grid; place-items: center; padding: 1rem;
  pointer-events: none; /* never block taps when not open */
}
.amodal[hidden] { display: none; }
.amodal.open { pointer-events: auto; }

.amodal-backdrop {
  position: absolute; inset: 0;
  background: rgba(5,8,13,.78); backdrop-filter: blur(6px);
  opacity: 0; transition: opacity .25s ease;
}
.amodal.open .amodal-backdrop { opacity: 1; }

.amodal-dialog {
  position: relative; z-index: 1;
  width: min(640px, 100%); max-height: 92dvh; overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow);
  padding: clamp(1.25rem, 3vw, 2rem);
  transform: translateY(14px) scale(.97); opacity: 0;
  transition: transform .3s ease, opacity .25s ease;
  overscroll-behavior: contain;
}
.amodal.open .amodal-dialog { transform: none; opacity: 1; }
.amodal-dialog::-webkit-scrollbar { width: 6px; }
.amodal-dialog::-webkit-scrollbar-thumb { background: var(--line); border-radius: 6px; }

.amodal-close {
  position: absolute; top: .9rem; right: .9rem;
  width: 2.2rem; height: 2.2rem; border-radius: 50%;
  border: 1px solid var(--line); background: var(--surface-2);
  color: var(--fg); display: grid; place-items: center;
  cursor: pointer; transition: border-color .2s, color .2s; z-index: 2;
}
.amodal-close:hover { border-color: var(--orange); color: var(--orange-bright); }

.amodal-head { margin-bottom: 1.3rem; padding-right: 2.5rem; }
.amodal-head h3 { margin: .25rem 0 .3rem; font-size: clamp(1.25rem,1rem+1.3vw,1.55rem); }
.amodal-head p { margin: 0; color: var(--muted); font-size: .94rem; }
.amodal-body { /* scrolls inside dialog */ }

/* two-column row inside modals */
.amodal-row { display: grid; gap: .75rem; }
@media (min-width: 28rem) { .amodal-row { grid-template-columns: 1fr 1fr; } }

/* ========================================================= FORM FIELDS */
.field { margin-bottom: .9rem; }
.field label {
  display: block; font-weight: 700; font-size: .82rem;
  margin-bottom: .38rem; color: var(--fg);
}
.field :is(input, select, textarea) {
  width: 100%; padding: .85rem 1rem;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface-2); color: var(--fg);
  font-size: .95rem; font-family: var(--font);
  transition: border-color .2s, box-shadow .2s;
}
.field :is(input, select, textarea):focus {
  outline: none; border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(244,84,30,.18);
}
.field textarea { resize: vertical; min-height: 5rem; }
input[type="date"], input[type="time"] { color-scheme: dark; }

/* client-type radio cards */
.choice-field, .services-field { border: 0; padding: 0; margin: 0 0 1rem; }
.choice-field legend, .services-field legend {
  font-weight: 700; font-size: .82rem; margin-bottom: .5rem; padding: 0; color: var(--fg);
}
.legend-note { font-weight: 500; color: var(--muted); }
.choice-row { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.choice-card {
  position: relative; display: flex; align-items: center;
  justify-content: center; padding: .85rem; cursor: pointer;
  border: 1.5px solid var(--line); border-radius: 10px;
  background: var(--surface-2); font-weight: 700;
  transition: border-color .18s, background .18s;
}
.choice-card input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.choice-card:hover { border-color: var(--orange); }
.choice-card:has(input:checked) {
  border-color: var(--orange);
  background: rgba(244,84,30,.12);
  box-shadow: 0 0 0 1px var(--orange);
}

/* service tick checkboxes */
.service-ticks { display: grid; grid-template-columns: repeat(2, 1fr); gap: .4rem .55rem; max-height: 15rem; overflow-y: auto; }
@media (max-width: 22rem) { .service-ticks { grid-template-columns: 1fr; } }
.tick {
  position: relative; display: flex; align-items: center; gap: .55rem;
  padding: .5rem .6rem; border: 1.5px solid var(--line); border-radius: 9px;
  background: var(--surface-2); font-size: .82rem; font-weight: 600; cursor: pointer; line-height: 1.2;
  transition: border-color .16s, background .16s;
}
.tick input { position: absolute; opacity: 0; }
.tick::before {
  content: ""; flex: none; width: 1.1rem; height: 1.1rem;
  border-radius: 5px; border: 1.5px solid var(--muted);
  background: transparent; transition: background .16s, border-color .16s;
}
.tick:hover { border-color: var(--orange); }
.tick:has(input:checked) {
  border-color: var(--orange);
  background: rgba(176,32,64,.1);
}
.tick:has(input:checked)::before {
  background: var(--orange) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center / 76% no-repeat;
  border-color: var(--orange);
}

/* address geocode row */
.addr-row { display: flex; gap: .5rem; }
.addr-row input { flex: 1; }
.addr-find { flex: none; padding: .65rem 1rem; font-size: .88rem; }

/* location tools */
.location-tools {
  display: flex; align-items: center; gap: .65rem;
  flex-wrap: wrap; margin: .5rem 0 .3rem;
}
.loc-btn { font-size: .85rem; padding: .5rem .9rem; gap: .4rem; }
.loc-hint { color: var(--muted); font-size: .78rem; }

/* Leaflet map container */
.leaflet-map {
  height: 250px; border-radius: 12px; margin-top: .35rem;
  border: 1px solid var(--line); overflow: hidden;
}

/* inline checkboxes */
.field-checks { display: grid; gap: .4rem; margin-bottom: .8rem; }
.check-inline {
  display: flex; align-items: center; gap: .55rem;
  font-size: .88rem; color: var(--muted); cursor: pointer;
}
.check-inline input { accent-color: var(--orange); width: 1rem; height: 1rem; cursor: pointer; }

/* file upload drop zone */
.upload-drop {
  display: flex; align-items: center; gap: .7rem; padding: 1rem; cursor: pointer;
  font-size: .88rem; border: 1.5px dashed var(--line); border-radius: 11px;
  background: var(--surface-2); color: var(--muted); transition: border-color .2s, background .2s;
}
.upload-drop:hover, .upload-drop.drag {
  border-color: var(--orange); color: var(--fg);
  background: rgba(244,84,30,.07);
}
.upload-drop b { color: var(--orange-bright); }
.upload-drop svg { color: var(--orange-bright); flex: none; }
.upload-list { list-style: none; padding: 0; margin: .45rem 0 0; display: grid; gap: .28rem; }
.upload-list li {
  font-size: .8rem; color: var(--muted); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 7px; padding: .35rem .6rem;
}

/* submit success state */
.reassure {
  font-size: .77rem; color: var(--muted); text-align: center; margin-top: .65rem;
}

@media (max-width: 30rem) {
  .amodal { padding: .4rem; }
  .amodal-dialog { padding: 1.1rem; border-radius: var(--radius); }
}

/* ========================================================= SENTINEL QUICK-REPLIES */
.sentinel-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  padding: .1rem 0 .3rem;
  align-self: flex-start;
  max-width: 100%;
}
.sentinel-quick-btn {
  display: inline-flex;
  align-items: center;
  padding: .42rem .85rem;
  border: 1.5px solid rgba(20,210,190,.35);
  border-radius: 999px;
  background: rgba(20,210,190,.08);
  color: #14d2be;
  font-size: .8rem;
  font-weight: 700;
  font-family: var(--font);
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, border-color .15s, color .15s, transform .15s;
  line-height: 1;
}
.sentinel-quick-btn:hover {
  background: rgba(20,210,190,.18);
  border-color: #14d2be;
  color: #fff;
  transform: translateY(-1px);
}

/* ========================================================= SERVICE AREAS LEAFLET MAP */
.areas-map-wrap {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.areas-map {
  width: 100%;
  height: clamp(360px, 52vw, 560px);
  background: var(--surface);     /* shown while tiles load */
  display: block;
}

/* ---- Legend ---- */
.areas-map-legend {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  z-index: 500;
  display: flex;
  flex-direction: column;
  gap: .45rem;
  background: rgba(11,15,21,.82);
  backdrop-filter: blur(8px);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .65rem .85rem;
  pointer-events: none;
}
.aml-item {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .78rem;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
}
.aml-item svg { flex: none; }

/* ---- Override Leaflet chrome to match dark theme ---- */
.leaflet-container {
  font-family: var(--font) !important;
  background: var(--surface) !important;
}
.leaflet-control-zoom a {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: var(--fg) !important;
}
.leaflet-control-zoom a:hover {
  background: var(--surface) !important;
  color: var(--orange-bright) !important;
}
.leaflet-control-attribution {
  background: rgba(11,15,21,.7) !important;
  color: rgba(255,255,255,.35) !important;
  font-size: .68rem !important;
}
.leaflet-control-attribution a { color: rgba(255,255,255,.45) !important; }

/* ---- Custom popup ---- */
.areas-popup-wrap .leaflet-popup-content-wrapper {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.55) !important;
  padding: 0 !important;
}
.areas-popup-wrap .leaflet-popup-tip {
  background: var(--surface) !important;
}
.areas-popup-wrap .leaflet-popup-content {
  margin: 0 !important;
  width: auto !important;
}
.areas-popup {
  padding: .85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  min-width: 160px;
}
.areas-popup strong {
  font-size: .95rem;
  font-weight: 800;
  color: var(--fg);
  line-height: 1.1;
}
.areas-popup span {
  font-size: .78rem;
  color: var(--muted);
}
.areas-popup a {
  display: inline-flex;
  align-items: center;
  margin-top: .3rem;
  font-size: .8rem;
  font-weight: 700;
  color: var(--orange-bright);
  text-decoration: none;
}
.areas-popup a:hover { text-decoration: underline; }

/* ── Real images filling former placeholders (added) ── */
.img-placeholder.has-img,
.blog-hero-img-placeholder.has-img,
.post-hero-img-placeholder.has-img,
.blog-card-thumb-placeholder.has-img,
.img-container-inner.has-img { padding: 0; border: 0; overflow: hidden; }
.has-img > img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Page-hero background image + readability overlay (added) ── */
.page-hero { position: relative; overflow: hidden; }
.page-hero > .hero-bg { position: absolute; inset: 0; z-index: 0; }
.page-hero > .hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .30; }
.page-hero > .hero-bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,15,21,.72), rgba(11,15,21,.86)); }
.page-hero > .container { position: relative; z-index: 1; }

/* ── Floating contact actions (email / call / WhatsApp) (added) ── */
.contact-fab { display: flex; flex-direction: column; gap: .6rem; align-items: flex-end; }
.contact-fab.is-fixed { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 9998; }
.contact-fab a { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center;
  color: #fff; box-shadow: 0 8px 22px rgba(0,0,0,.28); transition: transform .15s, filter .15s; }
.contact-fab a:hover { transform: translateY(-2px); filter: brightness(1.07); }
.contact-fab .fab-email { background: #2b3a4a; }
.contact-fab .fab-call  { background: #F4541E; }
.contact-fab .fab-wa    { background: #25D366; }

/* ── Service areas grid (replaces the map) ── */
.areas-grid { display: grid; grid-template-columns: 1.05fr 1.45fr 1fr; gap: 1.1rem; }
@media (max-width: 60rem) { .areas-grid { grid-template-columns: 1fr; } }
.area-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 1.6rem 1.5rem; display: flex; flex-direction: column; gap: .7rem; }
.area-card--hq { background: linear-gradient(160deg, rgba(244,84,30,.16), var(--surface) 62%); border-color: rgba(244,84,30,.42); }
.area-card h3 { font-size: 1.25rem; }
.area-card p { color: var(--muted); line-height: 1.6; margin: 0; }
.area-tag { align-self: flex-start; font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: var(--orange-bright); background: rgba(244,84,30,.12); padding: .35rem .7rem; border-radius: 999px; }
.area-tag--ec { color: #14d2be; background: rgba(20,210,190,.12); }
.area-tag--gp { color: #9d90ff; background: rgba(124,108,245,.14); }
.area-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: .3rem 0 .2rem; padding: 0; list-style: none; }
.area-chips li { font-size: .85rem; font-weight: 600; color: var(--fg); background: var(--bg-alt);
  border: 1px solid var(--line); border-radius: 999px; padding: .4rem .8rem; }
.area-card .btn { align-self: flex-start; margin-top: auto; }

/* Invisible bridge across the tab→dropdown gap so hover doesn't drop (reliable click on items) */
.nav-item.has-dropdown > .nav-dropdown::before {
  content: ""; position: absolute; left: -8px; right: -8px; top: -16px; height: 18px; background: transparent;
}
.nav-item.has-dropdown:hover > .nav-dropdown,
.nav-item.has-dropdown:focus-within > .nav-dropdown {
  display: flex; opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto;
}

/* ── Images fully fill placeholders, no frames/borders (applies whenever a slot has an <img>) ── */
.img-placeholder:has(> img),
.blog-card-thumb-placeholder:has(> img),
.post-hero-img-placeholder:has(> img),
.blog-hero-img-placeholder:has(> img),
.img-container-inner:has(> img) {
  padding: 0 !important; border: 0 !important; gap: 0 !important;
  background: transparent !important; overflow: hidden; box-shadow: none !important;
  min-height: 220px;
}
.img-placeholder > img,
.blog-card-thumb-placeholder > img,
.post-hero-img-placeholder > img,
.blog-hero-img-placeholder > img,
.img-container-inner > img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  display: block !important; border: 0 !important; border-radius: inherit;
}
/* hide the leftover placeholder label/icon once a real image is present */
.img-placeholder:has(> img) > span,
.img-placeholder:has(> img) > svg,
.blog-card-thumb-placeholder:has(> img) > span,
.post-hero-img-placeholder:has(> img) > span,
.blog-hero-img-placeholder:has(> img) > span { display: none !important; }
/* let the image fill the full height of its column in split layouts */
.split .img-placeholder:has(> img) { height: 100%; }

/* ============================================================
   BURGUNDY / WHITE / LIGHT-GRAY / OLIVE REBRAND OVERRIDES
   (light theme; hero / CTA / footer = burgundy bands)
   ============================================================ */
body { background: var(--bg); color: var(--fg); }

/* Header — light glass */
.site-header { background: rgba(255,255,255,.82); border-bottom-color: var(--line); }
.site-header.scrolled { background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.logo-text strong { color: var(--burgundy); }
.logo-text small { color: var(--muted); }
.nav-links a, .nav-tab { color: #44505c; }
.nav-links a:hover, .nav-tab:hover, .nav-tab:focus-visible, .nav-item.open .nav-tab { color: var(--burgundy); }
.nav-links a::after { background: var(--burgundy); }
.nav-toggle span { background: #1c2128; }
.nav-dropdown { background: #fff; border-color: var(--line); box-shadow: 0 12px 40px rgba(0,0,0,.14); }
.nav-dropdown a { color: #44505c; }
.nav-dropdown a:hover { background: rgba(176,32,64,.08); color: var(--burgundy); }
.mobile-nav { background: #fff; border-bottom-color: var(--line); }
.mobile-nav > a, .mnav-tab { color: #1c2128; }
.mobile-nav > a:hover { background: var(--bg-alt); color: var(--burgundy); }
.mnav-sub a { color: #44505c; }

/* Buttons */
.btn-primary { background: var(--burgundy); color: #fff; }
.btn-primary:hover, .btn-primary:active { background: var(--burgundy-deep); box-shadow: 0 14px 34px rgba(176,32,64,.35); }
.btn-outline-light { color: var(--burgundy); border-color: var(--burgundy); background: transparent; }
.btn-outline-light:hover, .btn-outline-light:active { background: var(--burgundy); color: #fff; border-color: var(--burgundy); }

/* Accents */
.eyebrow, .eyebrow.on-dark, .hl, .orange { color: var(--burgundy); }

/* Cards / surfaces on light */
.svc-card, .ind-card, .ind-body, .plan, .info-card, .area-card, .contact-method, .trust-card, .feature-card, .partner-card { background: #fff; border-color: var(--line); }
.svc-card h3, .ind-card h3, .ind-body h3, .plan h3, .info-card h3 { color: var(--fg); }
.svc-card h3 a { color: var(--fg); }
.svc-card h3 a:hover { color: var(--burgundy); }
.card-icon { color: var(--burgundy); }
.svc-card:hover, .ind-card:hover, .info-card:hover, .area-card:hover { border-color: var(--burgundy); box-shadow: 0 18px 40px rgba(0,0,0,.10); }

/* Olive as the secondary accent (checkmarks, standard badges, plan ticks) */
.feature-list li::before { background: rgba(107,142,35,.14); border-color: rgba(107,142,35,.45);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236B8E23' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l3.5 3.5L13 5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; }
.std-badge, .standard-badges .std-badge { background: rgba(107,142,35,.12); border-color: rgba(107,142,35,.4); color: var(--olive-deep); }

/* HERO band -> burgundy */
.hero { background: var(--burgundy-deep); }
.hero-overlay { background:
  linear-gradient(90deg, rgba(122,21,48,.94) 0%, rgba(122,21,48,.72) 45%, rgba(122,21,48,.30) 100%),
  radial-gradient(1000px 500px at 80% -10%, rgba(176,32,64,.55), transparent 60%); }
.hero h1, .hero-inner h1 { color: #fff; }
.hero .hero-lead, .hero-sub, .hero-overlay p, .hero-inner p { color: rgba(255,255,255,.9); }
.hero .badge { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.25); }

/* CTA band -> burgundy */
.cta { background: radial-gradient(900px 400px at 50% -10%, rgba(176,32,64,.55), transparent 60%), var(--burgundy-deep); }
.cta h2 { color: #fff; }
.cta .section-lead, .cta p { color: rgba(255,255,255,.9); }

/* FOOTER -> burgundy */
.site-footer { background: var(--burgundy-deep); border-top-color: rgba(255,255,255,.12); }
.site-footer, .site-footer p, .footer-note, .footer-bottom, .footer-bottom span { color: rgba(255,255,255,.8); }
.site-footer h4 { color: #fff; }
.site-footer a { color: rgba(255,255,255,.8); }
.site-footer a:hover { color: #fff; }
.logo--footer .logo-text, .logo--footer .logo-text strong { color: #fff; }

/* Areas grid (homepage) */
.area-card--hq { background: linear-gradient(160deg, rgba(176,32,64,.10), #fff 62%); border-color: rgba(176,32,64,.4); }
.area-chips li { background: var(--bg-alt); border-color: var(--line); color: var(--fg); }

/* Rebrand touch-ups */
.contact-fab .fab-call { background: var(--burgundy); }
.contact-fab .fab-email { background: #3a2230; }
.plan-price-block { background: var(--bg-alt); border-color: var(--line); }
.plan--gold, .plan[style*="--orange"] { border-color: var(--burgundy) !important; }
.plan-tag { background: var(--burgundy); }
.badge { color: var(--burgundy); }
/* Sentinel/Vera launcher accent stays usable on light */
.sentinel-launcher { box-shadow: 0 10px 30px rgba(176,32,64,.35); }

/* Remove hero overlays — show images clean (text-shadow keeps text legible) */
.hero-overlay { background: none !important; }

/* ============================================================
   BURGUNDY + OLIVE 50/50 REBALANCE  (+ more light gray)
   ============================================================ */
:root { --bg-alt: #EBEEF0; }   /* clearer light-gray for alternating sections */

/* Olive becomes the secondary lead colour (eyebrows, icons, outlines, CTA) */
.eyebrow, .eyebrow.on-dark, .section-head .eyebrow { color: var(--olive-deep); }
.card-icon, .svc-card .card-icon, .info-card .card-icon, .trust-card .card-icon { color: var(--olive-deep); }
.nav-links a::after { background: var(--olive); }

/* Outline buttons -> olive (primary buttons stay burgundy) */
.btn-outline-light { color: var(--olive-deep); border-color: var(--olive); background: transparent; }
.btn-outline-light:hover, .btn-outline-light:active { background: var(--olive); color: #fff; border-color: var(--olive); }

/* Bands: hero = burgundy, CTA = olive, footer = burgundy  (balanced) */
.cta { background: radial-gradient(900px 400px at 50% -10%, rgba(107,142,35,.55), transparent 60%), var(--olive-deep); }
.cta h2 { color: #fff; }
.cta .section-lead, .cta p { color: rgba(255,255,255,.9); }

/* Card hovers alternate the two brand colours */
.svc-card:hover, .info-card:hover, .feature-card:hover, .plan:hover { border-color: var(--olive); box-shadow: 0 18px 40px rgba(0,0,0,.10); }
.ind-card:hover, .area-card:hover, .trust-card:hover, .partner-card:hover { border-color: var(--burgundy); }

/* Badges / pills -> olive; hero badge stays light on the band */
.badge { color: var(--olive-deep); background: rgba(107,142,35,.12); }
.hero .badge { color: #fff; background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.25); }
.area-tag--ec { color: var(--olive-deep); background: rgba(107,142,35,.14); }
.area-card--hq { background: linear-gradient(160deg, rgba(107,142,35,.12), #fff 62%); border-color: rgba(107,142,35,.4); }

/* Light-gray contact stack email btn */
.contact-fab .fab-email { background: #5b6470; }

/* ===== Button contrast fixes =====
   Outline buttons sit on dark backgrounds in the hero and CTA band, where the
   olive-deep text colour became invisible. Force white text + light border
   there, with a readable hover. */
.hero .btn-outline-light,
.hero-cta .btn-outline-light,
.cta .btn-outline-light,
.cta-actions .btn-outline-light {
  color: #fff;
  border-color: rgba(255, 255, 255, .6);
  background: transparent;
}
.hero .btn-outline-light:hover,
.hero-cta .btn-outline-light:hover,
.cta .btn-outline-light:hover,
.cta-actions .btn-outline-light:hover,
.hero .btn-outline-light:active,
.hero-cta .btn-outline-light:active,
.cta .btn-outline-light:active,
.cta-actions .btn-outline-light:active {
  background: #fff;
  color: var(--olive-deep);
  border-color: #fff;
}

/* ============================================================================
   PREMIUM DARK GLASS THEME
   A cohesive, deliberate site-wide reskin: near-black canvas, frosted-glass
   surfaces, burgundy + olive glow accents, Sora display type. Appended last
   so it wins over the light-theme rebrand block above without touching any
   page markup or class names.
   ============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');

:root {
  --pg-bg: #0a0b0d;
  --pg-bg-soft: #0e1116;
  --pg-surface: rgba(255,255,255,.045);
  --pg-surface-strong: rgba(255,255,255,.07);
  --pg-line: rgba(255,255,255,.12);
  --pg-line-strong: rgba(255,255,255,.22);
  --pg-fg: #f4f6f5;
  --pg-muted: #a7b0b8;
  --pg-glow-burgundy: rgba(197,22,70,.35);
  --pg-glow-olive: rgba(196,226,131,.22);
  --font-display: "Sora", "DM Sans", "Inter", system-ui, sans-serif;
}

html { background: var(--pg-bg); }
body { background: var(--pg-bg) !important; color: var(--pg-fg) !important; }

h1, h2, h3, h4, .logo-text, .nav-tab, .btn { font-family: var(--font-display) !important; letter-spacing: -.01em; }

section, .hero, .trust, .services, .industries, .partner, .band, .areas, .faq-section, .cta {
  background: var(--pg-bg) !important;
}
.trust, .industries { background: var(--pg-bg-soft) !important; }

/* ---- Top utility bar ---- */
.topbar { background: #050608; border-bottom: 1px solid var(--pg-line); font-size: .78rem; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .4rem 1.1rem; padding-block: .55rem; }
.topbar-group { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.topbar-item { display: inline-flex; align-items: center; gap: .4rem; color: var(--pg-muted); white-space: nowrap; }
.topbar-item--link { color: rgba(245,249,247,.86); font-weight: 600; transition: color .18s ease; }
.topbar-item--link:hover { color: #fff; }
.topbar-sep { width: 1px; height: 12px; background: var(--pg-line-strong); }
@media (max-width: 60rem) { .topbar { display: none; } }

/* ---- Header: dark glass, blurred, refined brand mark ---- */
.site-header {
  background: rgba(8,10,13,.72) !important;
  border-bottom: 1px solid var(--pg-line) !important;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}
.site-header.scrolled { background: rgba(6,7,9,.92) !important; box-shadow: 0 18px 44px rgba(0,0,0,.4) !important; }
.logo-mark {
  display: inline-grid; place-items: center; flex: 0 0 auto;
  width: 46px; height: 46px; border-radius: 14px; overflow: hidden;
  border: 1px solid var(--pg-line-strong);
  background: linear-gradient(155deg, rgba(197,22,70,.18), rgba(196,226,131,.08));
  box-shadow: 0 10px 26px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.1);
}
.logo-mark img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.logo-text strong { color: #fff !important; font-weight: 800 !important; }
.logo-text small { color: var(--pg-muted) !important; }
.nav-links a, .nav-tab { color: rgba(244,246,245,.78) !important; }
.nav-links a:hover, .nav-tab:hover, .nav-tab:focus-visible, .nav-item.open .nav-tab { color: #fff !important; }
.nav-links a::after { background: linear-gradient(90deg, #c51646, #c4e283) !important; }
.nav-dropdown {
  background: linear-gradient(180deg, rgba(20,24,29,.98), rgba(9,11,14,.98)) !important;
  border: 1px solid var(--pg-line-strong) !important;
  box-shadow: 0 30px 70px rgba(0,0,0,.5) !important;
  backdrop-filter: blur(18px) saturate(140%);
}
.nav-dropdown a { color: rgba(244,246,245,.78) !important; }
.mobile-nav { background: rgba(9,11,14,.98) !important; border-bottom-color: var(--pg-line) !important; }
.mobile-nav > a, .mnav-tab { color: var(--pg-fg) !important; }
.mnav-sub a { color: var(--pg-muted) !important; }
.nav-toggle span { background: var(--pg-fg) !important; }

/* ---- Buttons ---- */
.btn-primary { background: linear-gradient(135deg, #c5164c, #7a1130) !important; color: #fff !important; box-shadow: 0 16px 36px rgba(197,22,70,.32) !important; }
.btn-primary:hover, .btn-primary:active { background: linear-gradient(135deg, #d81a56, #8a1436) !important; box-shadow: 0 20px 44px rgba(197,22,70,.42) !important; }
.btn-outline-light { color: #fff !important; border-color: var(--pg-line-strong) !important; background: rgba(255,255,255,.04) !important; }
.btn-outline-light:hover, .btn-outline-light:active { background: rgba(255,255,255,.1) !important; border-color: #fff !important; color: #fff !important; }

/* ---- Frosted glass card system: applies to every card family sitewide ---- */
.svc-card, .ind-card, .plan, .info-card, .area-card, .area-highlight,
.contact-method, .feature-card, .step-card, .service-card, .trust-card,
.partner-card, .amodal-dialog, .choice-card, .stat {
  background:
    linear-gradient(150deg, rgba(255,255,255,.055), rgba(255,255,255,.015) 60%),
    var(--pg-surface) !important;
  border: 1px solid var(--pg-line) !important;
  color: var(--pg-fg) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}
.svc-card:hover, .ind-card:hover, .plan:hover, .info-card:hover, .area-card:hover,
.area-highlight:hover, .contact-method:hover, .feature-card:hover, .step-card:hover,
.service-card:hover, .trust-card:hover, .partner-card:hover {
  border-color: rgba(197,22,70,.45) !important;
  box-shadow: 0 34px 80px rgba(0,0,0,.42), 0 0 42px var(--pg-glow-burgundy) !important;
}
.svc-card h3, .ind-card h3, .ind-body h3, .plan h3, .info-card h3, .area-card h3,
.area-highlight h3, .contact-method h3, .feature-card h3, .step-card h3,
.service-card h3, .trust-card h3, .partner-card h3 { color: #fff !important; }
.svc-card p, .ind-card p, .ind-body p, .plan p, .info-card p, .area-card p,
.area-highlight p, .contact-method p, .feature-card p, .step-card p,
.service-card p, .partner-card p { color: var(--pg-muted) !important; }
.svc-card h3 a { color: #fff !important; }
.svc-card h3 a:hover { color: #c4e283 !important; }
.card-icon { color: #d7f09b !important; background: linear-gradient(135deg, rgba(196,226,131,.16), rgba(107,142,35,.12)) !important; border: 1px solid rgba(196,226,131,.22) !important; }
.badge { color: #d7f09b !important; background: rgba(196,226,131,.1) !important; border: 1px solid rgba(196,226,131,.2); }

/* ---- FAQ ---- */
.faq details {
  background: var(--pg-surface) !important;
  border: 1px solid var(--pg-line) !important;
  color: var(--pg-fg) !important;
  backdrop-filter: blur(10px);
}
.faq details:hover, .faq details[open] { border-color: rgba(196,226,131,.32) !important; }
.faq summary { color: #fff !important; }
.faq details p, .faq-a p { color: var(--pg-muted) !important; }

/* ---- Footer ---- */
.site-footer {
  background: #050608 !important;
  border-top: 1px solid var(--pg-line) !important;
  position: relative;
}
.site-footer::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 2px;
  background: linear-gradient(90deg, transparent, #c5164c, #c4e283, transparent);
  opacity: .6;
}
.site-footer, .site-footer p, .footer-note, .footer-bottom, .footer-bottom span { color: var(--pg-muted) !important; }
.site-footer h4 { color: #fff !important; }
.site-footer a { color: var(--pg-muted) !important; }
.site-footer a:hover { color: #c4e283 !important; }
.logo--footer .logo-text, .logo--footer .logo-text strong { color: #fff !important; }

/* ---- Hero: keep the darkened photo, align accent glow to burgundy/olive ---- */
.hero-overlay {
  background:
    linear-gradient(90deg, rgba(5,6,8,.92) 0%, rgba(5,6,8,.76) 45%, rgba(5,6,8,.42) 100%),
    linear-gradient(0deg, rgba(5,6,8,.55) 0%, transparent 40%),
    radial-gradient(1000px 500px at 80% -10%, rgba(196,226,131,.14), transparent 60%) !important;
}
.hero h1 .hl { color: #c4e283 !important; }
.hero-sector-btn { background: rgba(255,255,255,.05) !important; border-color: var(--pg-line-strong) !important; }
.hero-sector-btn:hover, .hero-sector-btn:active { background: rgba(197,22,70,.2) !important; border-color: #c4e283 !important; }

/* ---- Modals ---- */
.amodal-dialog { background: linear-gradient(160deg, #14171c, #0b0d10) !important; }
.amodal-head p, .amodal-body label { color: var(--pg-muted) !important; }
.field input, .field textarea, .field select { background: rgba(255,255,255,.04) !important; border-color: var(--pg-line) !important; color: #fff !important; }
.tick { background: rgba(255,255,255,.04) !important; border-color: var(--pg-line) !important; color: var(--pg-fg) !important; }

@media (prefers-reduced-motion: reduce) {
  .site-header, .svc-card, .ind-card, .plan, .area-card { transition: none !important; }
}

/* ============================================================================
   HERO REDESIGN — two-column layout with an operating-standard proof card,
   plus a sitewide pass replacing sharp corners with curved ones.
   ============================================================================ */

.hero {
  overflow: hidden; /* keep the photo + everything on top of it clipped to the section, nothing bleeds past its edges */
}
.hero-bg, .hero-bg picture { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-bg img { display: block; width: 100%; height: 100%; }
.hero-overlay { min-height: 100%; }
.hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  max-width: var(--maxw) !important;
  width: 100%;
}
.hero-content { max-width: 42rem; min-width: 0; }

.hero-checks { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; padding: 0; margin: 1.1rem 0 1.6rem; }
.hero-checks li {
  position: relative; padding: .55rem .9rem .55rem 2.1rem;
  border: 1px solid var(--pg-line); border-radius: 999px;
  background: rgba(255,255,255,.05); backdrop-filter: blur(10px);
  color: rgba(245,249,247,.92); font-size: .82rem; font-weight: 600;
}
.hero-checks li::before {
  content: "\2713"; position: absolute; left: .65rem; top: 50%; transform: translateY(-50%);
  display: inline-grid; place-items: center; width: 1.05rem; height: 1.05rem;
  border-radius: 50%; background: linear-gradient(135deg, #6b8e23, #1f8f4d);
  color: #fff; font-size: .62rem; font-weight: 900;
}

.hero-proof {
  position: relative;
  padding: 1.5rem;
  border-radius: 24px;
  border: 1px solid var(--pg-line-strong);
  background: linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
  box-shadow: 0 36px 90px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
}
.hero-proof__head { display: grid; gap: .2rem; padding-bottom: .9rem; border-bottom: 1px solid var(--pg-line); margin-bottom: 1rem; }
.hero-proof__head span { color: #c4e283; font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero-proof__head strong { color: #fff; font-size: 1.25rem; font-weight: 800; }
.hero-proof__steps { list-style: none; padding: 0; margin: 0 0 1.1rem; display: grid; gap: .65rem; }
.hero-proof__steps li { display: flex; gap: .8rem; padding: .85rem .9rem; border-radius: 16px; background: rgba(255,255,255,.04); border: 1px solid var(--pg-line); }
.hero-proof__steps li span { flex: none; color: #f5a524; font-weight: 800; font-size: .78rem; }
.hero-proof__steps li strong { display: block; color: #fff; font-size: .95rem; }
.hero-proof__steps li p { margin: .2rem 0 0; color: var(--pg-muted); font-size: .82rem; line-height: 1.5; }
.hero-proof__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.hero-proof__stats div { text-align: center; padding: .8rem .5rem; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid var(--pg-line); }
.hero-proof__stats strong { display: block; color: #c4e283; font-weight: 800; font-size: 1.1rem; }
.hero-proof__stats span { display: block; color: var(--pg-muted); font-size: .68rem; margin-top: .15rem; }

@media (max-width: 60rem) {
  .hero-inner { grid-template-columns: 1fr; }
  .hero-proof { max-width: 30rem; }
}
@media (max-width: 48rem) {
  .hero-proof { display: none; } /* keep the mobile hero focused on the photo + CTAs */
}

/* ---- Curved controls: soften every remaining sharp-edged interactive element ---- */
/* Square-with-curved-corners, not circular, for the logo and every icon badge */
.logo-mark { border-radius: 13px !important; }
.nav-toggle { border-radius: 12px !important; background: rgba(255,255,255,.05) !important; }
.card-icon, .bc-icon { border-radius: 14px !important; }
.field :is(input, select, textarea) { border-radius: 14px !important; }
.tick { border-radius: 12px !important; }
.choice-card { border-radius: 14px !important; }
.booking-choice { border-radius: 20px !important; }
.upload-drop { border-radius: 16px !important; }
.mnav-item, .mobile-nav > a, .mnav-tab, .mnav-sub a { border-radius: 12px !important; }
.nav-dropdown { border-radius: 16px !important; }
.nav-dropdown a { border-radius: 10px !important; }
.plan-price-block { border-radius: 14px !important; }

/* ===== END home-v2.css ===== */

/* ===== BEGIN pages.css ===== */
/* ASC Pest Control — Sub-page shared styles */

/* Page hero (shorter, gradient only — no background image) */
.page-hero {
  background: radial-gradient(900px 500px at 60% -20%, rgba(244, 84, 30, 0), transparent 55%),
              linear-gradient(180deg, #0b0f1500 0%, var(--bg) 100%);
  padding: clamp(5rem,6rem + 4vw,9rem) 0 clamp(3rem,3rem + 2vw,5rem);
  text-align: center;
}
.page-hero .badge { margin-bottom: 1.2rem; }
.page-hero h1 { font-size: clamp(2rem,1rem + 4.5vw,3.6rem); font-weight: 900; color: #fff; margin-bottom: .9rem; }
.page-hero .hero-lead { color: #d3dae1; font-size: clamp(1rem,.95rem + .4vw,1.2rem); max-width: 52ch; margin: 0 auto 2rem; }
.page-hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }

/* Image placeholder */
.img-placeholder {
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .8rem; color: var(--muted); font-size: .85rem; font-weight: 500;
  text-align: center; padding: 2rem;
  min-height: 220px;
}
.img-placeholder span { max-width: 24ch; line-height: 1.4; }

/* Split section: image + copy */
.split { display: grid; gap: clamp(2rem,1rem + 4vw,4rem); align-items: center; }
@media (min-width: 56rem) { .split { grid-template-columns: 1fr 1fr; } }
.split.reverse > *:first-child { order: 2; }
.split.reverse > *:last-child  { order: 1; }
@media (max-width: 55.9rem) { .split.reverse > * { order: unset; } }

/* Section with icon heading */
.detail-section { padding-block: clamp(3rem,2rem + 4vw,6rem); }
.detail-section:nth-child(even) { background: var(--bg-alt); }
.detail-section h2 { font-size: clamp(1.5rem,1rem + 2.2vw,2.4rem); margin-bottom: .6rem; }
.detail-section .section-lead { margin-bottom: 1.6rem; }

/* Feature list */
.feature-list { display: grid; gap: .75rem; margin: 1.4rem 0; list-style: none; padding: 0; }
.feature-list li { display: flex; gap: .8rem; align-items: flex-start; color: var(--muted); font-size: .95rem; }
.feature-list li::before { content: ""; flex: none; width: 20px; height: 20px; border-radius: 50%; background: rgba(244,84,30,.14); border: 1px solid rgba(244,84,30,.35); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ff7a45' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l3.5 3.5L13 5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; margin-top: 1px; }

/* Info cards (3 or 4 up) */
.info-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%,14rem),1fr)); }
.info-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; transition: border-color .25s, transform .25s, box-shadow .25s; }
.info-card:hover { border-color: var(--orange); transform: translateY(-3px); box-shadow: var(--shadow); }
.info-card .card-icon { margin-bottom: .9rem; }
.info-card h3 { font-size: 1rem; margin-bottom: .35rem; }
.info-card p { color: var(--muted); font-size: .9rem; line-height: 1.55; }

/* Standard badge row */
.standard-badges { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1.2rem 0; }
.std-badge { display: inline-flex; align-items: center; gap: .45rem; background: rgba(244,84,30,.1); border: 1px solid rgba(244,84,30,.3); color: var(--orange-bright); font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: .45rem .9rem; border-radius: 999px; }

/* Area cards */
.area-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%,16rem),1fr)); }
.area-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.4rem 1.5rem; transition: border-color .25s, transform .25s; }
.area-card:hover { border-color: var(--orange); transform: translateY(-3px); }
.area-card h3 { font-size: 1rem; margin-bottom: .3rem; color: var(--fg); }
.area-card p { color: var(--muted); font-size: .88rem; }
.area-card .area-tag { display: inline-block; margin-top: .6rem; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--orange-bright); }

/* Contact page */
.contact-grid { display: grid; gap: 2.5rem; }
@media (min-width: 56rem) { .contact-grid { grid-template-columns: 1fr 1.5fr; } }
.contact-info h2 { font-size: clamp(1.4rem,1rem + 1.8vw,2rem); margin-bottom: .7rem; }
.contact-method { display: flex; gap: 1rem; align-items: flex-start; padding: 1.1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: .75rem; transition: border-color .2s; }
.contact-method:hover { border-color: var(--orange); }
.contact-method .card-icon { flex: none; }
.contact-method strong { display: block; font-size: .9rem; color: var(--fg); }
.contact-method a, .contact-method span { color: var(--muted); font-size: .9rem; }

/* Form styles */
.pg-form-row { display: grid; gap: 0 1.5rem; }
@media (min-width: 30rem) { .pg-form-row { grid-template-columns: 1fr 1fr; } }
.pg-form .field { margin-bottom: 1.2rem; }
.pg-form label { display: block; font-size: .88rem; font-weight: 600; color: var(--muted); margin-bottom: .4rem; }
.pg-form input, .pg-form textarea, .pg-form select {
  width: 100%; min-width: 0; box-sizing: border-box;
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px;
  padding: .85rem 1rem; color: var(--fg); font-family: inherit;
  font-size: max(1rem, 16px); transition: border-color .2s; min-height: 48px;
}
.pg-form input:focus, .pg-form textarea:focus, .pg-form select:focus { outline: none; border-color: var(--orange); }
.pg-form textarea { resize: vertical; min-height: 110px; }
.pg-form select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23aab3bd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; }

/* CTA band (reuse on sub-pages) */
.page-cta { background: radial-gradient(900px 400px at 50% -10%, rgba(244,84,30,.4), transparent 60%), #0b0f15; text-align: center; padding-block: clamp(3.5rem,2rem + 5vw,6rem); }
.page-cta h2 { font-size: clamp(1.9rem,1rem + 3vw,3rem); color: #fff; margin: .3rem 0 .7rem; }
.page-cta .section-lead { margin: 0 auto 1.8rem; color: #cbd3db; }
.page-cta-actions { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }

/* Band section */
.band { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-block: clamp(2.5rem,2rem + 3vw,4rem); text-align: center; }
.band h3 { font-size: clamp(1.2rem,.9rem + 1.5vw,1.8rem); margin-bottom: .6rem; }
.band p { color: var(--muted); max-width: 52ch; margin: 0 auto 1.5rem; }

/* Step number cards */
.step-num { display: inline-flex; align-items: center; justify-content: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: rgba(244,84,30,.15); border: 1px solid rgba(244,84,30,.4); color: var(--orange-bright); font-size: .9rem; font-weight: 800; margin-bottom: .75rem; }

/* FAQ details pattern */
.faq-section { padding-block: clamp(2.5rem,2rem + 3vw,5rem); }
.faq-section:nth-child(even) { background: var(--bg-alt); }
.faq-category { margin-bottom: 2rem; }
.faq-category h3 { font-size: clamp(1.2rem,1rem + 1vw,1.6rem); margin-bottom: 1rem; color: var(--fg); }

/* ── Mobile optimizations ── */
@media (max-width: 480px) {
  /* Form rows stack to single column */
  .pg-form-row { grid-template-columns: 1fr; }
  /* Buttons full-width */
  .pg-form .btn { width: 100%; justify-content: center; }
  /* Contact grid stacks */
  .contact-grid { grid-template-columns: 1fr; }
  /* Hero actions wrap and grow */
  .page-hero-actions .btn { flex: 1 1 100%; justify-content: center; }
}
@media (max-width: 600px) {
  .page-hero-actions { flex-direction: column; align-items: stretch; }
  .page-hero-actions .btn { justify-content: center; }
  .split { gap: 1.5rem; }
}

/* ── Real images filling former placeholders (added) ── */
.img-placeholder.has-img,
.blog-hero-img-placeholder.has-img,
.post-hero-img-placeholder.has-img,
.blog-card-thumb-placeholder.has-img,
.img-container-inner.has-img { padding: 0; border: 0; overflow: hidden; }
.has-img > img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Page-hero background image + readability overlay (added) ── */
.page-hero { position: relative; overflow: hidden; }
.page-hero > .hero-bg { position: absolute; inset: 0; z-index: 0; }
.page-hero > .hero-bg { background: var(--ink-950); }
.page-hero > .hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 1; }
.page-hero > .hero-bg::after { content: ""; position: absolute; inset: 0; background: transparent; }
.page-hero > .container { position: relative; z-index: 1; }
/* Soft vignette behind the text only — keeps the photo visible but text crisp */
.page-hero > .container::before {
  content: ""; position: absolute; inset: -2.5rem -1rem; z-index: -1;
  background: radial-gradient(ellipse 78% 80% at 50% 50%,
              rgba(11,15,21,.72) 0%, rgba(11,15,21,.45) 55%, rgba(11,15,21,0) 80%);
  pointer-events: none;
}
.page-hero h1, .page-hero .hero-lead, .page-hero .badge {
  text-shadow: 0 2px 6px rgba(0,0,0,.9), 0 2px 30px rgba(0,0,0,.95);
}

/* ── Floating contact actions (email / call / WhatsApp) (added) ── */
.contact-fab { display: flex; flex-direction: column; gap: .6rem; align-items: flex-end; }
.contact-fab.is-fixed { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 9998; }
.contact-fab a { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center;
  color: #fff; box-shadow: 0 8px 22px rgba(0,0,0,.28); transition: transform .15s, filter .15s; }
.contact-fab a:hover { transform: translateY(-2px); filter: brightness(1.07); }
.contact-fab .fab-email { background: #2b3a4a; }
.contact-fab .fab-call  { background: #F4541E; }
.contact-fab .fab-wa    { background: #25D366; }

/* ── Images fully fill placeholders, no frames/borders (applies whenever a slot has an <img>) ── */
.img-placeholder:has(> img),
.blog-card-thumb-placeholder:has(> img),
.post-hero-img-placeholder:has(> img),
.blog-hero-img-placeholder:has(> img),
.img-container-inner:has(> img) {
  padding: 0 !important; border: 0 !important; gap: 0 !important;
  background: transparent !important; overflow: hidden; box-shadow: none !important;
  min-height: 220px;
}
.img-placeholder > img,
.blog-card-thumb-placeholder > img,
.post-hero-img-placeholder > img,
.blog-hero-img-placeholder > img,
.img-container-inner > img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  display: block !important; border: 0 !important; border-radius: inherit;
}
/* hide the leftover placeholder label/icon once a real image is present */
.img-placeholder:has(> img) > span,
.img-placeholder:has(> img) > svg,
.blog-card-thumb-placeholder:has(> img) > span,
.post-hero-img-placeholder:has(> img) > span,
.blog-hero-img-placeholder:has(> img) > span { display: none !important; }
/* let the image fill the full height of its column in split layouts */
.split .img-placeholder:has(> img) { height: 100%; }

/* ============================================================
   BURGUNDY / LIGHT REBRAND OVERRIDES (sub-pages)
   ============================================================ */
/* Page hero base (when no image) -> burgundy band */
.page-hero {
  background: radial-gradient(900px 500px at 60% -20%, rgba(176, 32, 63, 0), transparent 55%),
              linear-gradient(180deg, var(--burgundy-deep) 0%, var(--burgundy-deep) 100%);
}
/* keep heading legible whether on burgundy or over a photo */
.page-hero h1 { color: #fff; }
.page-hero .hero-lead { color: rgba(255,255,255,.9); }

/* Page CTA band -> burgundy */
.page-cta {
  background: radial-gradient(900px 400px at 50% -10%, rgba(176,32,64,.55), transparent 60%), var(--burgundy-deep);
}
.page-cta h2 { color: #fff; }
.page-cta .section-lead { color: rgba(255,255,255,.9); }

/* Feature checkmarks -> olive */
.feature-list li::before {
  background: rgba(107,142,35,.14); border-color: rgba(107,142,35,.45);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236B8E23' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8l3.5 3.5L13 5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center;
}
/* Standard badges + step numbers -> olive / burgundy */
.std-badge { background: rgba(107,142,35,.12); border-color: rgba(107,142,35,.4); color: var(--olive-deep); }
.step-num { background: rgba(176,32,64,.14); border-color: rgba(176,32,64,.4); color: var(--burgundy); }

/* Cards / methods hover accent -> burgundy (tokens already light) */
.info-card:hover, .area-card:hover, .contact-method:hover { border-color: var(--burgundy); }
.area-card .area-tag { color: var(--burgundy); }
.detail-section:nth-child(even) { background: var(--bg-alt); }

/* Remove page-hero overlays */
.page-hero > .hero-bg::after { background: transparent !important; }
.page-hero > .container::before { display: none !important; }

/* ===== Burgundy + Olive 50/50 rebalance (sub-pages) ===== */
:root { --bg-alt: #EBEEF0; }
.eyebrow { color: var(--olive-deep); }
.info-card .card-icon, .contact-method .card-icon { color: var(--olive-deep); }
/* Sub-page CTA band -> olive (page hero stays burgundy) */
.page-cta { background: radial-gradient(900px 400px at 50% -10%, rgba(107,142,35,.55), transparent 60%), var(--olive-deep); }
.page-cta h2 { color: #fff; }
.page-cta .section-lead { color: rgba(255,255,255,.9); }
/* Step numbers -> olive ; hovers alternate */
.step-num { background: rgba(107,142,35,.14); border-color: rgba(107,142,35,.4); color: var(--olive-deep); }
.info-card:hover, .contact-method:hover { border-color: var(--olive); }
.area-card:hover { border-color: var(--burgundy); }
.detail-section:nth-child(even) { background: var(--bg-alt); }
.band { background: var(--bg-alt); }

/* ===== Light-gray polish layer ===== */
:root {
  --gray-50:  #f6f7f8;   /* very light gray  */
  --gray-100: #eef0f2;   /* light gray       */
  --gray-200: #e3e6e9;   /* soft border gray */
}
/* Subtle alternating tint so long pages don't read as one flat slab */
.detail-section:nth-child(odd) { background: var(--gray-50); }
.detail-section:nth-child(even) { background: var(--gray-100); }
/* Image placeholders read as soft gray panels with a hairline border */
.img-placeholder {
  background: var(--gray-100);
  border-color: var(--gray-200);
}
.img-placeholder.has-img { border-color: var(--gray-200); }
/* Cards and form fields pick up the same restrained gray palette */
.info-card, .area-card, .contact-method, .step-card {
  background: var(--gray-50);
  border-color: var(--gray-200);
}
.field input, .field select, .field textarea { background: #fff; border-color: var(--gray-200); }
.pg-form { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius); padding: clamp(1.25rem, 1rem + 1vw, 2rem); }
/* Hairline separators between stacked sections */
.detail-section + .detail-section { border-top: 1px solid var(--gray-200); }

/* Outline buttons on the dark CTA band must stay readable (white text). */
.page-cta .btn-outline-light {
  color: #fff;
  border-color: rgba(255, 255, 255, .6);
  background: transparent;
}
.page-cta .btn-outline-light:hover,
.page-cta .btn-outline-light:active {
  background: #fff;
  color: var(--olive-deep, #3d4d16);
  border-color: #fff;
}

/* ===== Button geometry resilience inside the theme =====
   When ASC pages render within the active theme, the theme's own button/link
   styles can override the ASC shape. Re-assert geometry (not width, so 100%
   form buttons keep working) scoped to .asc-page. */
.asc-page .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .5rem;
  padding: .8rem 1.5rem !important;
  border-radius: 999px !important;
  border: 2px solid transparent !important;
  font-weight: 700 !important;
  font-size: .92rem !important;
  line-height: 1.2 !important;
  letter-spacing: .02em;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer;
  white-space: nowrap;
}
.asc-page .btn-lg { padding: 1rem 1.9rem !important; font-size: 1rem !important; }
.asc-page .btn-primary { background: var(--burgundy, #B02040) !important; color: #fff !important; }
.asc-page .btn-primary:hover { background: var(--burgundy-deep, #8a1832) !important; }
.asc-page .btn-outline-light { background: transparent !important; color: var(--olive-deep, #557018) !important; border-color: var(--olive, #6B8E23) !important; }
.asc-page .btn-outline-light:hover { background: var(--olive, #6B8E23) !important; color: #fff !important; }
/* keep full-width submit buttons full width */
.asc-page .btn[style*="width: 100%"], .asc-page .btn[style*="width:100%"] { width: 100% !important; }
/* hero + CTA outline buttons stay light on dark bands */
.asc-page .hero .btn-outline-light, .asc-page .hero-cta .btn-outline-light,
.asc-page .cta .btn-outline-light, .asc-page .cta-actions .btn-outline-light,
.asc-page .page-cta .btn-outline-light {
  color: #fff !important; border-color: rgba(255,255,255,.6) !important; background: transparent !important;
}
.asc-page .hero .btn-outline-light:hover, .asc-page .hero-cta .btn-outline-light:hover,
.asc-page .cta .btn-outline-light:hover, .asc-page .cta-actions .btn-outline-light:hover,
.asc-page .page-cta .btn-outline-light:hover {
  background: #fff !important; color: var(--olive-deep, #557018) !important; border-color: #fff !important;
}

/* =====================================================================
   VISIBILITY / CONTRAST LAYER  (fix obscured hero text & sections)
   ===================================================================== */

/* 1) Hero readability: restore a brand scrim over the photo so the white
      headline/lead are legible (a previous rule removed it). */
.asc-page .hero { position: relative; isolation: isolate; }
.asc-page .hero .hero-bg::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg,
    rgba(122,21,48,0.92) 0%, rgba(122,21,48,0.70) 42%, rgba(122,21,48,0.32) 100%) !important;
}
.asc-page .hero .hero-overlay {
  background: linear-gradient(90deg,
    rgba(122,21,48,0.70) 0%, rgba(122,21,48,0.34) 45%, rgba(122,21,48,0.05) 100%) !important;
}
.asc-page .hero h1,
.asc-page .hero .hero-lead,
.asc-page .hero-inner h1,
.asc-page .hero-inner p {
  color: #ffffff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.45), 0 1px 2px rgba(0,0,0,0.4) !important;
}
.asc-page .hero h1 .hl { color: #f0c9d3 !important; }
.asc-page .hero .badge {
  background: rgba(255,255,255,0.16) !important; color: #fff !important;
  border: 1px solid rgba(255,255,255,0.30) !important;
}

/* 2) Hero sector buttons (translucent) -> clearly visible on the scrim */
.asc-page .hero-sector-btn {
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.45) !important;
  color: #ffffff !important;
}
.asc-page .hero-sector-btn:hover {
  background: rgba(255,255,255,0.20) !important;
  border-color: #ffffff !important;
}

/* ============================================================================
   HERO FIT + SHAPE (user request)
   1) Every element sits INSIDE the hero photo — nothing bleeds past the edges.
   2) Nav logo + hero cards/controls are squares with curved corners, never circles.
   ============================================================================ */

/* --- 1) Keep all hero content inside the image --------------------------- */
/* The section grows to fit its content; the darkened photo is absolutely
   positioned to cover the whole section, so content is always over the image,
   and overflow:hidden clips anything that would otherwise spill past an edge. */
.asc-page .hero { overflow: hidden !important; }
.asc-page .hero .hero-bg,
.asc-page .hero .hero-bg picture { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; }
.asc-page .hero .hero-bg img { width: 100% !important; height: 100% !important; object-fit: cover !important; filter: brightness(.9) !important; }

/* Curve the hero: inset it slightly from the edges so the rounded corners show,
   turning the section into a rounded brand banner. overflow:hidden clips the
   photo + overlay to the same curve. */
.asc-page > .hero:first-child,
.asc-page .hero {
  border-radius: clamp(18px, 2.4vw, 30px) !important;
  margin: clamp(10px, 1.6vw, 20px) !important;
}

/* Centre the content vertically in the photo, with padding so it never
   touches the top (under the fixed header) or bottom edge. */
.asc-page .hero .hero-overlay { display: grid !important; align-items: center !important; min-height: 100% !important; }
.asc-page .hero .hero-inner {
  box-sizing: border-box !important;
  width: 100% !important;
  padding-block: clamp(2.75rem, 6vh, 5rem) !important;
}
/* Grid children can shrink and never overflow their column (stops right-edge
   clipping of the proof card / headline on mid-width screens). */
.asc-page .hero-content,
.asc-page .hero-proof { min-width: 0 !important; max-width: 100% !important; }
.asc-page .hero-content > * { max-width: 100%; }
.asc-page .hero h1,
.asc-page .hero .hero-lead { overflow-wrap: anywhere; }

/* --- 2a) Nav logo: a rounded square, not a circle ----------------------- */
/* The logo art is centred inside a rounded-square card so the square framing
   is always visible whatever shape the source image is. */
.site-header .logo-mark,
.asc-hf .logo-mark,
.logo .logo-mark {
  box-sizing: border-box !important;
  aspect-ratio: 1 / 1;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.site-header .logo-mark img,
.asc-hf .logo-mark img,
.logo .logo-mark img {
  width: 74% !important;
  height: 74% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}

/* --- 2b) Hero cards & controls: square with curved corners --------------- */
.asc-page .hero-proof { border-radius: 20px !important; }
.asc-page .hero-proof__steps li { border-radius: 14px !important; }
.asc-page .hero-proof__stats div { border-radius: 12px !important; }
.asc-page .hero-checks li { border-radius: 12px !important; }
.asc-page .hero-sector-btn { border-radius: 12px !important; }
.asc-page .hero-cta .btn { border-radius: 12px !important; }
.asc-page .hero .badge { border-radius: 10px !important; }

/* 3) Section contrast: headings stay dark on light sections, leads readable */
.asc-page h1, .asc-page h2, .asc-page h3, .asc-page h4 { color: var(--fg, #1c2128); }
.asc-page .section-lead, .asc-page p { color: var(--muted, #5b6470); }
.asc-page .eyebrow, .asc-page .section-head .eyebrow { color: var(--olive-deep, #557018) !important; }

/* 4) Dark bands (cta / page-cta / footer-ish) keep white text */
.asc-page .cta, .asc-page .page-cta { color: #fff; }
.asc-page .cta h2, .asc-page .page-cta h2 { color: #fff !important; }
.asc-page .cta p, .asc-page .cta .section-lead,
.asc-page .page-cta p, .asc-page .page-cta .section-lead { color: rgba(255,255,255,0.92) !important; }

/* 5) Cards: visible surface + hairline so they don't blend into the page */
.asc-page .svc-card, .asc-page .ind-card, .asc-page .info-card,
.asc-page .area-card, .asc-page .trust-card, .asc-page .feature-card,
.asc-page .step-card, .asc-page .partner-card {
  background: #fff;
  border: 1px solid var(--gray-200, #e3e6e9);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}
.asc-page .card-icon { color: var(--olive-deep, #557018); }

/* 6) Image placeholders never show as broken/empty blocks */
.asc-page .img-placeholder { background: var(--gray-100, #eef0f2); }
.asc-page .img-placeholder > img { width: 100%; height: 100%; object-fit: cover; }
/* ===== END pages.css ===== */

/* ===== BEGIN styles.css ===== */
/* ==========================================================================
   ASC Pest Control — Landing (Dark)
   Modern CSS: cascade layers · nesting · oklch · @property animations ·
   container queries · :has() · scroll-driven animations · mesh/aurora hero ·
   glassmorphism · bento grid · spotlight hovers · Sentinel assistant.
   Controlled motion; full prefers-reduced-motion support. Degrades gracefully.
   ========================================================================== */

@layer reset, tokens, base, layout, components, utilities, motion;

@property --angle      { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@property --aurora-x   { syntax: "<percentage>"; inherits: false; initial-value: 20%; }
@property --aurora-y   { syntax: "<percentage>"; inherits: false; initial-value: 0%; }

/* =============================================================== TOKENS */
@layer tokens {
  :root {
    /* Brand (oklch) — tuned for dark surfaces */
    --brand:        oklch(31.904% 0.09427 41.629 / 0.87);
    --brand-bright: oklch(13.342% 0.01883 77.497);
    --brand-deep:   oklch(100% 0.00011 271.152);
    --brand-soft:   oklch(34% 0.09 45);     /* dark warm tint */

    /* Neutral ramp — all dark */
    --ink-950: oklch(13% 0.018 260);        /* deepest    */
    --ink-900: oklch(16% 0.02 260);
    --ink-800: oklch(22% 0.024 258);
    --ink-700: oklch(32% 0.022 256);
    --ink-500: oklch(60% 0.02 252);
    --ink-300: oklch(80% 0.015 250);

    --paper:    oklch(15% 0.018 260);       /* alt sections */
    --surface:  oklch(21% 0.024 258);       /* cards        */
    --surface-2:oklch(26% 0.026 258);       /* inputs/raised*/
    --border:   oklch(33% 0.02 258);

    --success: oklch(70% 0.15 150);
    --warning: oklch(80% 0.15 75);
    --danger:  oklch(64% 0.2 27);

    --bg: oklch(18% 0.02 260);
    --fg: oklch(96% 0.008 250);
    --muted: oklch(76% 0.015 250);

    --maxw: 1200px;
    --gutter: clamp(1rem, 0.4rem + 3vw, 2rem);
    --radius: 1.25rem;
    --radius-lg: 2rem;
    --radius-xl: 2.5rem;

    --shadow-sm: 0 1px 2px oklch(0% 0 0 / .24), 0 8px 20px oklch(0% 0 0 / .2);
    --shadow-md: 0 14px 34px oklch(0% 0 0 / .4);
    --shadow-lg: 0 40px 80px oklch(0% 0 0 / .55);
    --glow: 0 0 0 1px oklch(68% 0.2 41 / .4), 0 16px 50px oklch(68% 0.2 41 / .4);

    --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ease: cubic-bezier(.16, .84, .44, 1);
    --ease-spring: cubic-bezier(.34, 1.56, .64, 1);

    color-scheme: dark;
    accent-color: var(--brand);
  }
}

/* =============================================================== RESET */
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  * { margin: 0; }
  html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
  body { min-height: 100svh; }
  img, svg, video { display: block; max-width: 100%; }
  button, input, select, textarea { font: inherit; color: inherit; }
  a { color: inherit; text-decoration: none; }
  :where(ul[role="list"]) { list-style: none; padding: 0; }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  }
}

/* =============================================================== BASE */
@layer base {
  body {
    font-family: var(--font); background: var(--bg);
    background-image: radial-gradient(circle at 10% 10%, rgba(255,255,255,.04), transparent 16%), radial-gradient(circle at 90% 85%, rgba(255,255,255,.03), transparent 14%);
    color: var(--fg); line-height: 1.65; font-size: 1rem; -webkit-font-smoothing: antialiased; overflow-x: hidden;
  }
  h1, h2, h3 { line-height: 1.08; letter-spacing: -0.03em; text-wrap: balance; font-weight: 800; color: var(--fg); }
  h2 { font-size: clamp(1.7rem, 1rem + 2.8vw, 2.9rem); }
  h3 { font-size: 1.2rem; letter-spacing: -0.01em; }
  p  { text-wrap: pretty; color: var(--muted); }
  section { padding-block: clamp(3.5rem, 2rem + 5vw, 7rem); }
  :focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; border-radius: 6px; }
  ::selection { background: var(--brand); color: #fff; }
  ::placeholder { color: var(--ink-500); }

  .skip-link {
    position: absolute; inset-inline-start: -999px; inset-block-start: 0; z-index: 1000;
    background: var(--brand); color: #fff; padding: .75rem 1.1rem; border-radius: 0 0 10px 0;
    &:focus { inset-inline-start: 0; }
  }
  .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; }
}

/* =============================================================== LAYOUT */
@layer layout {
  .container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
  .bg-paper { background: var(--paper); }
  .grid { display: grid; gap: clamp(1rem, .5rem + 1.5vw, 1.5rem); }
  .panel { background: rgba(10, 18, 34, .94); border: 1px solid rgba(255,255,255,.08); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
  .glass { backdrop-filter: blur(18px); background: rgba(13, 22, 42, .78); border: 1px solid rgba(255,255,255,.08); }
  .grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
  .grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
  .grid-4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }

  .bento { container-type: inline-size; display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
  @media (min-width: 48rem) { .bento { grid-template-columns: repeat(4, 1fr); } .bento > .feature { grid-column: span 2; grid-row: span 2; } }
}

/* =============================================================== COMPONENTS */
@layer components {

  /* ---- Buttons ---- */
  .btn {
    --tx: 0px; --ty: 0px;
    position: relative; isolation: isolate;
    display: inline-flex; align-items: center; justify-content: center; gap: .55em;
    font-weight: 700; padding-block: .9rem; padding-inline: 1.6rem; min-height: 3rem;
    border: 1.5px solid transparent; border-radius: 999px; cursor: pointer;
    transform: translate(var(--tx), var(--ty));
    transition: transform .25s var(--ease-spring), box-shadow .25s var(--ease), background .25s, border-color .25s;
    overflow: hidden;
    &::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
      background: linear-gradient(110deg, transparent 35%, oklch(100% 0 0 / .28) 50%, transparent 65%);
      translate: -120% 0; transition: translate .6s var(--ease); }
    &:hover::after { translate: 120% 0; }
  }
  .btn-primary { background: linear-gradient(135deg, var(--brand-bright), var(--brand-deep)); color: #fff; box-shadow: var(--shadow-md); border-radius: 1rem; &:hover { box-shadow: var(--glow); } }
  .btn-light { background: var(--fg); color: var(--ink-950); box-shadow: var(--shadow-sm); border-radius: 1rem; &:hover { box-shadow: var(--shadow-lg); } }
  .btn-ghost { border-color: oklch(100% 0 0 / .3); color: #fff; backdrop-filter: blur(6px); &:hover { border-color: #fff; } }
  .btn-outline { border-color: var(--border); color: var(--fg); &:hover { border-color: var(--brand); color: var(--brand-bright); } }
  .btn-wa { background: #25D366; color: #04321b; &:hover { box-shadow: 0 12px 40px oklch(72% 0.17 150 / .5); } }

  /* ---- Header / nav ---- */
  .header {
    position: sticky; inset-block-start: 0; z-index: 100;
    background: oklch(16% 0.02 260 / .65); backdrop-filter: saturate(180%) blur(16px);
    border-block-end: 1px solid transparent; transition: background .3s, border-color .3s, box-shadow .3s;
    &[data-scrolled="true"] { background: oklch(14% 0.02 260 / .9); border-block-end-color: var(--border); box-shadow: var(--shadow-sm); }
  }
  .nav { display: flex; align-items: center; justify-content: space-between; block-size: 4.5rem; }
  .brand { display: flex; align-items: center; gap: .75rem; font-weight: 800; color: var(--fg); }
  .brand img { inline-size: 2.5rem; aspect-ratio: 1; border-radius: 11px; box-shadow: var(--shadow-sm); }
  .brand small { display: block; font-weight: 600; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-500); }
  .nav-links { display: none; gap: 1.8rem; align-items: center; }
  .nav-links a { font-weight: 600; font-size: .94rem; color: var(--ink-300); position: relative;
    &::after { content: ""; position: absolute; inset-block-end: -4px; inset-inline: 0; block-size: 2px; background: var(--brand); scale: 0 1; transform-origin: left; transition: scale .25s var(--ease); }
    &:hover { color: var(--brand-bright); &::after { scale: 1 1; } } }
  .nav-cta { display: none; gap: .8rem; align-items: center; }
  .nav-phone { font-weight: 700; white-space: nowrap; color: var(--fg); }

  .burger { display: inline-flex; flex-direction: column; gap: 5px; background: none; border: 0; padding: .6rem; border-radius: 10px; cursor: pointer;
    & span { inline-size: 24px; block-size: 2.5px; background: var(--fg); border-radius: 2px; transition: .3s var(--ease); } }
  .header:has(#burger[aria-expanded="true"]) .burger span:nth-child(1) { translate: 0 7.5px; rotate: 45deg; }
  .header:has(#burger[aria-expanded="true"]) .burger span:nth-child(2) { opacity: 0; }
  .header:has(#burger[aria-expanded="true"]) .burger span:nth-child(3) { translate: 0 -7.5px; rotate: -45deg; }

  .mobile-menu { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s var(--ease); background: var(--surface); border-block-end: 1px solid transparent;
    & > div { overflow: hidden; }
    &.open { grid-template-rows: 1fr; border-block-end-color: var(--border); }
    & a { display: block; padding: .85rem .5rem; font-weight: 600; border-radius: 10px; color: var(--fg); &:hover { background: var(--brand-soft); color: var(--brand-bright); } }
    & .btn { margin-block-start: .6rem; } }
  @media (min-width: 60rem) { .nav-links, .nav-cta { display: flex; } .burger, .mobile-menu { display: none; } }

  /* ---- HERO ---- */
  .hero { position: relative; isolation: isolate; color: #fff; overflow: clip; background: var(--ink-950);
    padding-block: clamp(3rem, 2rem + 4vw, 6rem) clamp(4.5rem, 3rem + 7vw, 9rem); }
  .hero-bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
  .hero-image { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: center right; opacity: 0.35; }
  .hero-content { position: relative; z-index: 1; }
  .hero::before { content: ""; position: absolute; inset: -20%; z-index: -2;
    background:
      radial-gradient(40% 50% at var(--aurora-x) var(--aurora-y), oklch(64% 0.2 41 / .6), transparent 70%),
      radial-gradient(45% 55% at 85% 20%, oklch(66% 0.16 25 / .42), transparent 70%),
      radial-gradient(50% 60% at 15% 90%, oklch(50% 0.17 300 / .32), transparent 70%);
    filter: blur(22px) saturate(140%); animation: aurora 16s var(--ease) infinite alternate; }
  .hero::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background-image: radial-gradient(oklch(100% 0 0 / .05) 1px, transparent 1px); background-size: 28px 28px;
    mask-image: linear-gradient(180deg, #000, transparent 85%); }
  .hero .container { display: grid; gap: clamp(2rem, 0.9rem + 3vw, 3rem); align-items: center; }
  @media (min-width: 62rem) { .hero .container { grid-template-columns: 1.1fr .9fr; } }

  .hero-signin-wrap { padding-block: .75rem; margin-bottom: .75rem; }
  .hero-signin-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .8rem; border-radius: 1.5rem; padding: 1rem 1.2rem; background: rgba(10, 18, 34, 0.9); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 24px 70px rgba(0,0,0,0.2); backdrop-filter: blur(18px); }
  .hero-signin-copy { min-width: 0; }
  .hero-signin-copy p { margin: 0; color: rgba(255,255,255,0.9); font-size: clamp(0.88rem, 0.8rem + 0.12vw, 0.95rem); line-height: 1.5; max-width: 40rem; }
  .hero-signin-btn { min-width: 10rem; padding-inline: 1.3rem; padding-block: .8rem; font-size: .95rem; }
  .hero-signin-copy h2 { font-size: clamp(1.3rem, 1.1rem + 1vw, 1.6rem); margin: .3rem 0 .2rem; }
  .hero-signin-copy .hero-eyebrow { display: inline-flex; align-items: center; letter-spacing: .18em; text-transform: uppercase; font-size: .65rem; font-weight: 800; color: var(--brand-bright); margin-bottom: .4rem; }
  .hero-signin-grid { display: grid; gap: .8rem; }
  .hero-booking-intro { margin: 0; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .8rem; border-radius: 1.5rem; padding: 1rem 1.2rem; background: rgba(10, 18, 34, 0.9); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 24px 70px rgba(0,0,0,0.2); backdrop-filter: blur(18px); }
  .hero-booking-intro h2 { font-size: clamp(1.3rem, 1.1rem + 1vw, 1.6rem); margin: .3rem 0 .2rem; }
  .hero-booking-intro p { margin: 0; color: rgba(255,255,255,0.9); font-size: clamp(0.88rem, 0.8rem + 0.12vw, 0.95rem); line-height: 1.5; }
  .hero-booking-btn { min-width: 10rem; padding-inline: 1.3rem; padding-block: .8rem; font-size: .95rem; }
  .hero-booking-intro .hero-eyebrow { display: inline-flex; align-items: center; letter-spacing: .18em; text-transform: uppercase; font-size: .65rem; font-weight: 800; color: var(--brand-bright); margin-bottom: .4rem; }
  .hero-booking-intro .note { display: none; }
  @media (min-width: 62rem) {
    .hero-signin-grid { grid-template-columns: minmax(26rem, 1.3fr) minmax(16rem, auto); align-items: start; gap: .9rem; }
    .hero-booking-intro { justify-self: start; }
  }
  @media (max-width: 62rem) {
    .hero-signin-card { grid-template-columns: 1fr; text-align: center; }
    .hero-signin-btn { justify-self: center; width: min(100%, 18rem); }
  }

  .auth-shell { min-height: 100vh; padding-block: 3rem; background: radial-gradient(circle at top left, oklch(60% 0.12 80 / .07), transparent 24%), linear-gradient(180deg, var(--ink-950), var(--ink-900)); }
  .auth-layout { display: grid; gap: clamp(1.75rem, 1rem + 2vw, 2.5rem); align-items: stretch; min-height: calc(100vh - 6rem); }
  @media (min-width: 64rem) { .auth-layout { grid-template-columns: minmax(28rem, 42%) minmax(24rem, 38%); } }
  .auth-panel { border-radius: 2rem; padding: clamp(2rem, 2.5vw, 3rem); background: rgba(10, 18, 34, 0.95); border: 1px solid rgba(255,255,255,0.08); box-shadow: var(--shadow-lg); }
  .auth-hero-panel { display: grid; gap: 1.75rem; position: relative; overflow: hidden; }
  .auth-form-panel { display: grid; gap: 1.4rem; }
  .auth-form-stack { display: grid; gap: 0.75rem; margin-bottom: 1rem; }
  .auth-form-stack h2 { margin: 0; font-size: clamp(2rem, 1.8rem + 0.9vw, 2.8rem); color: var(--fg); }
  .auth-form-stack p { margin: 0; color: var(--ink-300); line-height: 1.75; }
  .hero-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
  .hero-logo-mark { width: 4rem; aspect-ratio: 1; display: grid; place-items: center; border-radius: 1.5rem; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); }
  .hero-logo-mark img { width: 56%; height: 56%; object-fit: contain; }
  .hero-visual { border-radius: 1.9rem; overflow: hidden; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); }
  .hero-visual img { display: block; width: 100%; height: auto; object-fit: cover; min-height: 16rem; }
  .auth-hero-stats { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero-stat { padding: 1.25rem 1.35rem; border-radius: 1.5rem; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); }
  .hero-stat strong { display: block; margin-bottom: 0.65rem; color: #fff; font-size: 1rem; }
  .hero-stat p { margin: 0; color: var(--ink-300); font-size: 0.95rem; line-height: 1.7; }
  .auth-form h1 { margin-block-end: 1rem; font-size: clamp(2.4rem, 2.2rem + 1vw, 3.2rem); color: var(--fg); }
  .auth-form p { margin-block-end: 2rem; color: var(--ink-300); max-width: 42rem; }
  .auth-form-grid { display: grid; gap: 1rem; }
  .auth-form-grid .field { margin: 0; }
  .field label { display: block; margin-block-end: .55rem; color: var(--fg); font-size: .92rem; font-weight: 700; }
  .field input { width: 100%; min-height: 3rem; padding: 1rem 1.1rem; border-radius: 1rem; border: 1px solid var(--border); background: var(--surface-2); color: var(--fg); }
  .field input:focus { border-color: var(--brand); outline: none; box-shadow: 0 0 0 3px rgba(24, 133, 219, 0.12); }
  .field-inline { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1rem; }
  .checkbox { display: inline-flex; align-items: center; gap: .55rem; color: var(--muted); font-size: .95rem; }
  .checkbox input { accent-color: var(--brand); width: auto; }
  .link-secondary { color: var(--brand-bright); font-weight: 700; }
  .auth-note { margin-top: 1.25rem; color: var(--ink-300); font-size: .95rem; }
  .auth-note a { color: var(--brand-bright); font-weight: 700; }
  .auth-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
  .auth-brand { display: inline-flex; align-items: center; gap: .85rem; color: var(--fg); font-weight: 700; }
  .auth-brand img { border-radius: 14px; background: rgba(255,255,255,0.08); padding: .35rem; }
  .auth-form-grid { display: grid; gap: 1rem; }
  .auth-cta-wrap { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
  .auth-security-card { padding: 1.2rem 1.3rem; border-radius: 1.25rem; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }
  .auth-security-card strong { display: block; margin-bottom: .55rem; color: var(--fg); font-size: 1rem; }
  .auth-security-card p { margin: 0; color: var(--ink-300); line-height: 1.65; }
  .auth-brand-panel { display: grid; gap: 1.5rem; }
  .brand-card { display: grid; gap: 1.5rem; padding: 2rem; border-radius: 2rem; border: 1px solid rgba(255,255,255,0.08); background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02)); }
  .brand-mark { width: 5rem; aspect-ratio: 1; border-radius: 1.25rem; display: grid; place-items: center; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.08); }
  .brand-mark img { width: 70%; height: 70%; object-fit: contain; }
  .brand-card h2 { margin: 0; font-size: clamp(1.6rem, 1.5rem + 0.8vw, 2.4rem); color: var(--fg); }
  .brand-card p { margin: 0; color: var(--ink-300); line-height: 1.7; }
  .auth-benefits { display: grid; gap: 1rem; }
  .auth-benefit { padding: 1.15rem 1.2rem; border-radius: 1.5rem; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); }
  .auth-benefit strong { display: block; margin-bottom: .5rem; color: var(--fg); font-size: 1rem; }
  .auth-benefit p { margin: 0; color: var(--ink-300); font-size: .95rem; line-height: 1.6; }

  .hero-eyebrow { display: inline-flex; align-items: center; gap: .5rem; inline-size: max-content;
    font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #fff;
    padding: .45rem .9rem; border-radius: 999px; background: oklch(64% 0.2 41 / .18); border: 1px solid oklch(64% 0.2 41 / .5);
    & .dot { inline-size: .5rem; aspect-ratio: 1; border-radius: 50%; background: var(--brand-bright); animation: pulse 2.2s infinite; } }
  .hero h1 { font-size: clamp(2rem, 0.9rem + 5.5vw, 4rem); font-weight: 900; margin-block: .8rem .6rem; color: #fff; }
  .hero h1 .accent { background: linear-gradient(100deg, var(--brand-bright), oklch(85% 0.13 65)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .hero .lead { font-size: clamp(.95rem, .85rem + .5vw, 1.15rem); color: var(--ink-300); max-width: 36ch; }
  .hero-cta { display: flex; flex-wrap: wrap; gap: 1rem; margin-block-start: 2rem; }
  .hero-stats-panel { position: relative; margin-block-start: 2.4rem; padding: 1.2rem 1.3rem; border-radius: 1.5rem; background: rgba(8, 14, 28, 0.82); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 24px 80px rgba(0,0,0,0.24); backdrop-filter: blur(14px); overflow: hidden; }
  .hero-stats-panel::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 16% 20%, rgba(46, 163, 255, 0.14), transparent 25%), radial-gradient(circle at 90% 70%, rgba(255, 202, 84, 0.12), transparent 18%); }
  .hero-stats { display: flex; flex-wrap: wrap; gap: 1.4rem 2.4rem; margin: 0; position: relative; z-index: 1; }
  .stat { flex: 1 1 min(12rem, 1fr); min-width: 12rem; padding: 1.15rem 1.2rem; border-radius: 1.15rem; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06); }
  .stat strong { display: block; font-size: clamp(1.5rem, 1rem + 1.6vw, 2.1rem); font-weight: 900; color: #fff; }
  .stat span { color: rgba(255,255,255,0.7); font-size: .95rem; font-weight: 600; line-height: 1.5; }
  @media (max-width: 62rem) { .hero-stats-panel { padding: 1rem; } .hero-stats { justify-content: center; } }

  .hero-booking-intro { margin: 2.4rem 0 1.4rem; padding: 1.4rem 1.35rem; border-radius: 1.5rem; background: rgba(8, 14, 28, 0.82); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 24px 80px rgba(0,0,0,0.16); }
  .hero-booking-intro h2 { margin: 0.55rem 0 0.65rem; font-size: clamp(1.5rem, 1rem + 1.5vw, 2.15rem); line-height: 1.1; color: #fff; }
  .hero-booking-intro .lead { margin: 0; color: rgba(255,255,255,0.76); max-width: 54ch; }
  @media (max-width: 62rem) { .hero-booking-intro { padding: 1.2rem 1.2rem; } }

  .quote-card { position: relative; color: var(--fg); border-radius: var(--radius-xl); padding: clamp(1.4rem, 1rem + 0.8vw, 1.8rem);
    background: rgba(10, 18, 34, 0.9); backdrop-filter: blur(18px); box-shadow: var(--shadow-lg); border: 1px solid rgba(255,255,255,.09); }
  .quote-card::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)); opacity: .55; filter: blur(1px); }
  .quote-card h3 { font-size: 1.15rem; }
  .quote-card .muted { color: var(--muted); font-size: .92rem; margin-block: .25rem 1.1rem; }
  .quote-card form { position: relative; z-index: 1; }
  .quote-card > * { position: relative; z-index: 1; }
  .field { margin-block-end: .85rem; }
  .field label { display: block; font-weight: 700; font-size: .82rem; margin-block-end: .35rem; color: var(--fg); }
  .field :is(input, select, textarea) {
    inline-size: 100%; padding: 1rem 1.05rem; border: 1px solid var(--border); border-radius: 1rem;
    background: var(--surface-2); color: var(--fg); font-size: 1rem; transition: border-color .25s, box-shadow .25s, transform .25s;
    &:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 4px var(--brand-soft); transform: translateY(-1px); }
    &:hover { border-color: color-mix(in oklch, var(--brand) 30%, var(--border)); }
    &:user-invalid { border-color: var(--danger); } }
  .field select { color: var(--fg); }
  .quote-card .btn { inline-size: 100%; }
  .reassure { font-size: .78rem; color: var(--muted); text-align: center; margin-block-start: .75rem; }

  /* ---- Marquee ---- */
  .marquee {
    position: relative;
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    background: linear-gradient(135deg, rgba(25, 35, 48, 0.98), rgba(10, 18, 33, 0.95));
    color: #fff;
    padding: 1.6rem 0;
    overflow: visible;
    border-top: 1px solid rgba(255,255,255,0.05);
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .marquee-panel {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(360px, 1.8fr);
    gap: 1.75rem;
    align-items: center;
    width: 100%;
    max-width: none;
    margin: 0 auto;
    padding: 0 2rem;
  }
  .marquee-summary { display: grid; gap: 0.35rem; }
  .marquee-eyebrow { color: var(--brand-bright); text-transform: uppercase; letter-spacing: .16em; font-size: .78rem; font-weight: 800; }
  .marquee-summary p { margin: 0; color: rgba(255,255,255,0.78); max-width: 36rem; line-height: 1.6; }
  .marquee-track-wrap { position: relative; overflow: visible; }
  .marquee-track {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: flex-start;
    align-items: center;
    margin-top: 0.75rem;
    animation: none;
  }
  .marquee .badge {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    font-weight: 700;
    font-size: .95rem;
    white-space: nowrap;
    padding: .9rem 1.05rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    color: rgba(255,255,255,0.92);
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset 0 0 1px rgba(255,255,255,0.12);
  }
  .marquee .badge b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.12);
    color: var(--brand-bright);
    font-weight: 800;
  }
  .marquee .badge + .badge { margin-left: 0; }
  @media (max-width: 860px) {
    .marquee-panel { grid-template-columns: 1fr; text-align: center; padding: 0 1.25rem; }
    .marquee-track { justify-content: center; }
  }

  /* ---- Section heads ---- */
  .section-head { max-width: 46rem; margin-inline: auto; margin-block-end: clamp(2rem, 1rem + 3vw, 3.2rem); text-align: center; }
  .eyebrow { display: inline-block; color: var(--brand-bright); font-weight: 800; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; margin-block-end: .6rem; }
  .section-head p { font-size: 1.05rem; color: var(--muted); }

  /* ---- Cards ---- */
  .card { --mx: 50%; --my: 0%; position: relative; container-type: inline-size;
    background: rgba(10, 18, 34, 0.95); border: 1px solid rgba(255,255,255,.08); border-radius: var(--radius);
    padding: clamp(1.3rem, 1rem + 1vw, 1.7rem); box-shadow: var(--shadow-sm);
    transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
    &::before { content: ""; position: absolute; inset: 0; border-radius: inherit; opacity: 0; transition: opacity .3s;
      background: radial-gradient(16rem 16rem at var(--mx) var(--my), oklch(68% 0.2 41 / .12), transparent 60%); }
    &:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: color-mix(in oklch, var(--brand) 55%, var(--border)); &::before { opacity: 1; } } }
  .card .icon { inline-size: 3.4rem; aspect-ratio: 1; display: grid; place-items: center; font-size: 1.6rem; border-radius: 16px; margin-block-end: 1rem;
    background: linear-gradient(135deg, oklch(40% 0.13 42), oklch(30% 0.1 35)); border: 1px solid oklch(46% 0.13 42); }
  .card h3 { margin-block-end: .4rem; } .card p { font-size: .94rem; }
  .feature { background: linear-gradient(180deg, #07121f 0%, #0f2135 100%); color: #fff; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 32px 90px rgba(0,0,0,0.28);
    & h3 { color: #fff; font-size: clamp(1.4rem,1rem+1.5vw,1.9rem); } & p { color: rgba(255,255,255,0.72); }
    & .icon { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.12); }
    &::before { display: none; } }

  /* industries */
  .industries { background: var(--ink-950); color: #fff;
    & .section-head p { color: var(--ink-300); } }
  .ind-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; transition: transform .3s var(--ease), border-color .3s;
    & .icon { inline-size: 3rem; aspect-ratio: 1; display: grid; place-items: center; font-size: 1.5rem; border-radius: 14px; margin-block-end: .9rem; background: oklch(64% 0.2 41 / .16); border: 1px solid oklch(64% 0.2 41 / .4); }
    & h3 { color: #fff; } & p { color: var(--ink-300); font-size: .92rem; }
    &:hover { transform: translateY(-6px); border-color: var(--brand); } }

  /* split / about */
  .split { display: grid; gap: clamp(2rem,1rem+3vw,3rem); align-items: center; }
  @media (min-width: 56rem) { .split { grid-template-columns: 1fr 1fr; } }
  .check-list { display: grid; gap: .75rem; margin-block-start: 1.2rem;
    & li { display: flex; gap: .7rem; align-items: start; font-weight: 600; color: var(--fg);
      &::before { content: "✓"; display: grid; place-items: center; inline-size: 1.5rem; aspect-ratio: 1; flex: none; border-radius: 50%; background: color-mix(in oklch, var(--success) 22%, transparent); color: var(--success); font-size: .8rem; font-weight: 800; } } }
  .media-frame { position: relative; border-radius: var(--radius-xl); overflow: hidden; display: grid; place-items: center; background: linear-gradient(150deg, var(--ink-800), var(--ink-950)); box-shadow: var(--shadow-lg); border: 1px solid var(--border); }
  .media-frame img { display: block; width: 100%; height: auto; object-fit: cover; }

  /* pest finder */
  .finder { display: grid; gap: 1.5rem; }
  .finder-chips { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
  .chip { display: inline-flex; gap: .5rem; align-items: center; padding: .7rem 1.2rem; border-radius: 999px; border: 1.5px solid var(--border); background: var(--surface); font-weight: 700; font-size: .92rem; color: var(--fg); cursor: pointer; transition: .25s var(--ease);
    &:hover { border-color: var(--brand); transform: translateY(-2px); }
    &[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: var(--glow); } }
  .finder-result { max-width: 40rem; margin-inline: auto; min-block-size: 9rem; display: grid; place-items: center; text-align: center; padding: 1.8rem; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow-md); transition: opacity .3s, transform .3s;
    & .pest-name { color: var(--brand-bright); font-weight: 900; font-size: 1.4rem; }
    &.empty { color: var(--muted); } }

  /* plans */
  .plan { display: flex; flex-direction: column; height: 100%; border-radius: var(--radius-lg); background: rgba(10, 18, 34, 0.92); border: 1px solid rgba(255,255,255,.08); box-shadow: var(--shadow-md);
    & .price { font-weight: 800; color: var(--brand-bright); margin-block: .4rem 1rem; }
    & ul { display: grid; gap: .6rem; margin-block-end: 1.4rem; }
    & li { display: flex; gap: .6rem; font-size: .93rem; color: var(--muted); &::before { content: "✓"; color: var(--success); font-weight: 800; } }
    & .btn { margin-block-start: auto; } }
  .plan.featured { border: 0; color: #fff; background: linear-gradient(155deg, var(--brand-deep), oklch(38% 0.13 34)); position: relative;
    & h3 { color: #fff; } & .price { color: #fff; } & li { color: oklch(95% 0.02 50); }
    &::after { content: "Most popular"; position: absolute; inset-block-start: -.8rem; inset-inline-start: 50%; translate: -50% 0; background: var(--ink-950); color: #fff; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: .3rem .9rem; border-radius: 999px; border: 1px solid var(--border); } }

  /* compliance band */
  .compliance { position: relative; overflow: hidden; color: #fff; border-radius: var(--radius-xl); padding: clamp(2rem, 1rem + 4vw, 4rem); box-shadow: var(--shadow-lg);
    background: linear-gradient(150deg, var(--ink-900), var(--ink-800)); border: 1px solid var(--border);
    & h2 { color: #fff; } & > p { color: var(--ink-300); max-width: 46ch; }
    &::before { content: ""; position: absolute; inset-block-start: -30%; inset-inline-end: -10%; inline-size: 30rem; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, oklch(64% 0.2 41 / .4), transparent 70%); } }
  .compliance-grid { display: grid; gap: 1.1rem; margin-block-start: 1.8rem; position: relative; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
  .ci { display: flex; gap: .8rem; & strong { color: #fff; } & p { color: var(--ink-300); font-size: .9rem; margin-block-start: .2rem; }
    &::before { content: "✓"; flex: none; display: grid; place-items: center; inline-size: 1.6rem; aspect-ratio: 1; border-radius: 50%; background: oklch(64% 0.2 41 / .22); color: var(--brand-bright); font-weight: 800; } }

  /* service areas */
  .areas-list { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }
  .area-pill { padding: .6rem 1.1rem; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); font-weight: 600; font-size: .9rem; color: var(--fg); transition: .2s var(--ease);
    &:hover { border-color: var(--brand); color: var(--brand-bright); transform: translateY(-2px); } }

  /* FAQ */
  .faq { max-width: 52rem; margin-inline: auto; display: grid; gap: .8rem; }
  .faq details { border: 1px solid rgba(255,255,255,.08); border-radius: var(--radius); background: rgba(10, 18, 34, 0.9); overflow: hidden; transition: border-color .25s, box-shadow .25s;
    &[open] { border-color: color-mix(in oklch, var(--brand) 45%, var(--border)); box-shadow: var(--shadow-sm); } }
  .faq summary { list-style: none; cursor: pointer; padding: 1.2rem 1.3rem; font-weight: 700; font-size: 1.02rem; color: var(--fg); display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    &::-webkit-details-marker { display: none; }
    & .ico { flex: none; inline-size: 1.6rem; aspect-ratio: 1; position: relative; color: var(--brand-bright); transition: rotate .3s var(--ease);
      &::before, &::after { content: ""; position: absolute; inset: 50% 0 auto 50%; translate: -50% -50%; background: currentColor; border-radius: 2px; }
      &::before { inline-size: 15px; block-size: 2.5px; } &::after { inline-size: 2.5px; block-size: 15px; transition: scale .3s; } } }
  .faq details[open] summary .ico { rotate: 180deg; &::after { scale: 1 0; } }
  .faq .ans { padding: 0 1.3rem 1.2rem; color: var(--muted); }

  /* CTA band */
  .cta-band { position: relative; overflow: hidden; text-align: center; color: #fff; border-radius: var(--radius-xl); padding: clamp(2.5rem, 1.5rem + 4vw, 5rem) var(--gutter); box-shadow: var(--shadow-lg);
    background: linear-gradient(150deg, var(--ink-900), var(--ink-950)); border: 1px solid var(--border);
    & h2 { color: #fff; } & p { color: var(--ink-300); max-width: 40ch; margin-inline: auto; }
    &::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(40rem 20rem at 80% 0%, oklch(64% 0.2 41 / .42), transparent 60%); }
    & > * { position: relative; } & .hero-cta { justify-content: center; } }

  /* footer */
  .footer { background: var(--ink-950); color: var(--ink-300); padding-block: 4rem 1.8rem; border-block-start: 1px solid rgba(255,255,255,.08); }
  .grid-foot { display: grid; gap: 2.2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
  .footer h4 { color: #fff; font-size: .95rem; margin-block-end: 1rem; }
  .footer ul { display: grid; gap: .6rem; }
  .footer a:hover { color: var(--brand-bright); }
  .footer .brand { color: #fff; margin-block-end: .9rem; }
  .foot-contact li { display: flex; gap: .6rem; align-items: start; }
  .footer-bottom { border-block-start: 1px solid var(--ink-800); margin-block-start: 2.8rem; padding-block-start: 1.4rem; display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; font-size: .84rem; color: var(--ink-500); }

  /* floating actions (left, Sentinel owns the right) */
  .float-actions { position: fixed; inset-inline-start: 1rem; inset-block-end: 1rem; z-index: 90; display: grid; gap: .7rem; }
  .fab { inline-size: 3.5rem; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; font-size: 1.3rem; color: #fff; box-shadow: var(--shadow-lg); transition: transform .2s var(--ease-spring); &:hover { transform: scale(1.1); } }
  .fab-wa { background: #25D366; } .fab-call { background: var(--brand); }
  @media (min-width: 60rem) { .float-actions { display: none; } }
}

/* =============================================================== MOTION */
@layer motion {
  @keyframes aurora { 0% { --aurora-x: 15%; --aurora-y: 0%; } 100% { --aurora-x: 70%; --aurora-y: 30%; } }
  @keyframes spin { to { --angle: 360deg; } }
  @keyframes pulse { 0% { box-shadow: 0 0 0 0 oklch(79% 0.17 56 / .6); } 70% { box-shadow: 0 0 0 .6rem oklch(79% 0.17 56 / 0); } 100% { box-shadow: 0 0 0 0 transparent; } }
  @keyframes rise { from { opacity: 0; translate: 0 2rem; } to { opacity: 1; translate: 0 0; } }

  @supports (animation-timeline: view()) {
    .reveal { animation: rise linear both; animation-timeline: view(); animation-range: entry 0% cover 28%; }
  }
  @supports not (animation-timeline: view()) {
    .reveal { opacity: 0; translate: 0 1.6rem; transition: opacity .6s var(--ease), translate .6s var(--ease); }
    .reveal.in { opacity: 1; translate: 0 0; }
  }
  @media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1 !important; translate: 0 !important; animation: none !important; }
    .hero::before, .quote-card::before, .media-frame::before, .marquee-track { animation: none !important; }
  }
}

/* =============================================================== UTILITIES */
@layer utilities {
  .text-grad { background: linear-gradient(100deg, var(--brand-bright), oklch(80% 0.13 65)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .center { text-align: center; }
}

.remove-curves {
  /* Utility class to remove curves when needed */
}

/* Remove rounded corners on primary container elements (preserve colours).
  This targets div-like components to give a squared aesthetic without
  changing existing color tokens. */
.card, .quote-card, .media-frame, .plan, .compliance, .cta-band, .footer, .grid-foot, .brand img, .hero-eyebrow, .mobile-menu, .card .icon, .ind-card, .media-frame, .areas-list, .area-pill, .chip, .sentinel-panel, .btn, .fab, .nav-links a {
  border-radius: 0 !important;
}

/* Make buttons, pills and floating actions squared and add subtle 3D motion */
.btn, .chip, .area-pill, .fab, .btn-primary, .btn-light, .btn-ghost, .btn-outline, .btn-wa {
  border-radius: 0 !important;
  transform-style: preserve-3d;
  will-change: transform, box-shadow;
}

/* Card and button 3D hover/press effects */
.card, .feature, .plan, .quote-card {
  transition: transform .36s var(--ease), box-shadow .36s var(--ease);
  transform-origin: center;
}
.card:hover, .feature:hover, .plan:hover, .quote-card:hover {
  transform: translateY(-10px) translateZ(6px) rotateX(0.8deg) scale(1.01);
  box-shadow: 0 30px 60px rgba(0,0,0,0.45);
}
.btn:hover, .fab:hover, .chip:hover, .area-pill:hover {
  transform: translateY(-6px) translateZ(4px) scale(1.02);
  box-shadow: 0 18px 40px rgba(0,0,0,0.35);
}
.btn:active, .fab:active { transform: translateY(-2px) translateZ(2px) scale(.995); }

@media (prefers-reduced-motion: reduce) {
  .card:hover, .feature:hover, .plan:hover, .quote-card:hover, .btn:hover, .fab:hover, .chip:hover, .area-pill:hover {
    transform: none !important; box-shadow: var(--shadow-sm) !important;
  }
}

/* ==========================================================================
  SENTINEL — AI assistant widget (unlayered → sits above page styles)
  Controlled animations, dark glass, fully responsive.
  ========================================================================== */
.sentinel { position: fixed; inset-block-end: 1.25rem; inset-inline-end: 1.25rem; z-index: 200; font-family: var(--font); }

/* Launcher */
.sentinel-launcher {
  position: relative; display: inline-flex; align-items: center; gap: .6rem;
  padding: .7rem 1.1rem .7rem .7rem; border: 0; border-radius: 999px; cursor: pointer; color: #fff;
  background: linear-gradient(135deg, var(--brand-bright), var(--brand-deep));
  box-shadow: var(--glow); transition: transform .25s var(--ease-spring), box-shadow .25s;
  animation: sentinel-in .5s var(--ease-spring) both;
}
.sentinel-launcher:hover { transform: translateY(-2px) scale(1.02); }
.sentinel[data-open="true"] .sentinel-launcher { transform: scale(.85); opacity: 0; pointer-events: none; }
.sentinel-launcher-label { font-weight: 800; font-size: .95rem; white-space: nowrap; }
.sentinel-orb { display: grid; place-items: center; inline-size: 2.1rem; aspect-ratio: 1; border-radius: 50%; background: oklch(100% 0 0 / .18); }
.sentinel-orb.sm { inline-size: 1.9rem; background: oklch(100% 0 0 / .14); }
.sentinel-ping { position: absolute; inset-block-start: -.2rem; inset-inline-end: -.2rem; inline-size: .8rem; aspect-ratio: 1; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 0 oklch(70% 0.15 150 / .7); animation: pulse 2.4s infinite; }
@media (max-width: 26rem) { .sentinel-launcher-label { display: none; } }

/* Panel */
.sentinel-panel {
  position: absolute; inset-block-end: 0; inset-inline-end: 0;
  inline-size: min(23rem, calc(100vw - 2rem)); block-size: min(34rem, calc(100svh - 7rem));
  display: flex; flex-direction: column; overflow: hidden;
  background: linear-gradient(180deg, rgba(10, 14, 30, 0.96), rgba(6, 10, 22, 0.98));
  backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255,255,255,.08); border-radius: 22px; box-shadow: 0 36px 90px rgba(4, 10, 24, .35);
  transform-origin: bottom right;
  animation: sentinel-pop .32s var(--ease-spring) both;
}
.sentinel-panel[hidden] { display: none; }
.sentinel-head { display: flex; align-items: center; gap: .7rem; padding: 1rem 1rem .8rem; color: #fff;
  background: linear-gradient(135deg, var(--brand-deep), rgba(55, 63, 119, 0.95)); border-bottom: 1px solid rgba(255,255,255,.08); }
.sentinel-id strong { display: block; font-size: 1rem; line-height: 1.1; }
.sentinel-id small { display: flex; align-items: center; gap: .4rem; font-size: .72rem; color: rgba(255,255,255,.74); }
.sentinel-status-dot { inline-size: .5rem; aspect-ratio: 1; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 0 oklch(70% 0.15 150 / .7); animation: pulse 2.4s infinite; }
.sentinel-close { margin-inline-start: auto; background: rgba(255,255,255,.12); border: 0; color: #fff; inline-size: 2rem; aspect-ratio: 1; border-radius: 50%; cursor: pointer; font-size: .9rem; transition: background .2s; }
.sentinel-close:hover { background: rgba(255,255,255,.22); }

.sentinel-messages { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .75rem; scroll-behavior: smooth; background: rgba(255,255,255,.02); }
.sentinel-messages::-webkit-scrollbar { width: 8px; }
.sentinel-messages::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 8px; }

.msg { max-inline-size: 85%; padding: .65rem .85rem; border-radius: 16px; font-size: .92rem; line-height: 1.45; white-space: pre-wrap; animation: msg-in .28s var(--ease) both; }
.msg.bot { align-self: flex-start; background: var(--surface-2); color: var(--fg); border-end-start-radius: 5px; }
.msg.user { align-self: flex-end; background: linear-gradient(135deg, var(--brand-bright), var(--brand-deep)); color: #fff; border-end-end-radius: 5px; }
.msg a { color: var(--brand-bright); text-decoration: underline; }
.msg.user a { color: #fff; }

.typing { align-self: flex-start; display: inline-flex; gap: .25rem; padding: .8rem .9rem; background: var(--surface-2); border-radius: 16px; border-end-start-radius: 5px; }
.typing span { inline-size: .45rem; aspect-ratio: 1; border-radius: 50%; background: var(--ink-500); animation: blink 1.2s infinite; }
.typing span:nth-child(2) { animation-delay: .2s; } .typing span:nth-child(3) { animation-delay: .4s; }


.sentinel-form { display: flex; gap: .5rem; padding: .85rem; border-block-start: 1px solid rgba(255,255,255,.08); background: rgba(7,10,19,.88); }
.sentinel-input { flex: 1; padding: .8rem .95rem; border: 1.5px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: .95rem; }
.sentinel-input:focus { outline: none; border-color: rgba(92, 117, 255, .9); box-shadow: 0 0 0 3px rgba(92, 117, 255, .16); }
.sentinel-send { flex: none; inline-size: 2.7rem; aspect-ratio: 1; border: 0; border-radius: 50%; display: grid; place-items: center; color: #fff; cursor: pointer; background: linear-gradient(135deg, var(--brand-bright), var(--brand-deep)); transition: transform .2s var(--ease-spring); }
.sentinel-send:hover { transform: scale(1.08); }
.sentinel-disclaimer { font-size: .68rem; color: var(--ink-500); text-align: center; padding: 0 1rem .7rem; background: oklch(15% 0.02 260 / .6); margin: 0; }

@keyframes sentinel-in { from { opacity: 0; transform: translateY(1rem) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes sentinel-pop { from { opacity: 0; transform: translateY(1.5rem) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes msg-in { from { opacity: 0; transform: translateY(.5rem); } to { opacity: 1; transform: none; } }
@keyframes blink { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

@media (max-width: 30rem) {
  .sentinel { inset-block-end: 1rem; inset-inline-end: 1rem; }
  .sentinel-panel { inline-size: calc(100vw - 1.5rem); block-size: min(32rem, calc(100svh - 5.5rem)); }
}
@media (prefers-reduced-motion: reduce) {
  .sentinel-launcher, .sentinel-panel, .msg, .sentinel-quick button { animation: none !important; }
  .sentinel-ping, .sentinel-status-dot, .typing span { animation: none !important; }
}

/* ==========================================================================
   IPM model — continual-improvement cycle (animated, responsive)
   ========================================================================== */
.ipm { --ipm-accent: #F4541E; }
/* let this section span the full viewport width (the heading keeps its own max-width) */
.ipm > .container { max-width: none; padding-inline: clamp(1rem, 3vw, 3rem); }
.ipm-cycle {
  position: relative;
  /* as wide as the viewport allows, capped so the circle never overflows the screen height */
  inline-size: min(94vw, 66rem, 82vh);
  aspect-ratio: 1;
  margin: clamp(1.5rem, 3vw, 3rem) auto 0;
}

/* flowing dashed ring */
.ipm-ring { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; overflow: visible; }
.ipm-path { animation: ipmFlow 6s linear infinite; }

/* bright arc sweeping clockwise = "continual" flow */
.ipm-ring-glow {
  position: absolute; inset: 10%; border-radius: 50%; pointer-events: none; opacity: .9; filter: blur(1px);
  background: conic-gradient(from 0deg, transparent 0 60%, color-mix(in srgb, var(--ipm-accent) 92%, #fff) 80%, transparent 92%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
          mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
  animation: spin 9s linear infinite;
}

/* centre hub */
.ipm-center {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  inline-size: clamp(8rem, 26%, 11rem); aspect-ratio: 1; border-radius: 50%;
  display: grid; place-content: center; text-align: center; gap: .15rem; padding: 1rem;
  background: radial-gradient(circle at 50% 35%, var(--surface-2, #222b37), var(--ink-900, #11161d));
  border: 1px solid var(--border, #2f3a48);
  box-shadow: var(--shadow-md), inset 0 0 30px rgba(244, 84, 30, .12);
}
.ipm-logo { inline-size: 2.6rem; aspect-ratio: 1; margin: 0 auto .25rem; border-radius: 9px; }
.ipm-center strong { font-size: clamp(.95rem, 2.4vw, 1.15rem); line-height: 1.05; }
.ipm-center span { font-size: .72rem; color: var(--muted, #aab3bd); }

/* nodes */
.ipm-node {
  position: absolute; transform: translate(-50%, -50%);
  inline-size: clamp(8.5rem, 21vw, 11.5rem); text-align: center;
  background: var(--surface, #1a212b); border: 1px solid var(--border, #2f3a48);
  border-radius: 16px; padding: 1rem .85rem .9rem; box-shadow: var(--shadow-sm);
  transition: transform .35s var(--ease-spring, ease), box-shadow .35s, border-color .35s;
  animation: ipmGlow 15s linear calc(var(--i) * 3s) infinite;
}
.ipm-node:hover { animation-play-state: paused; transform: translate(-50%, -50%) scale(1.05); border-color: var(--c); box-shadow: 0 14px 34px rgba(0, 0, 0, .45); z-index: 3; }
.ipm-badge {
  display: grid; place-items: center; inline-size: 3rem; aspect-ratio: 1; margin: 0 auto .55rem;
  border-radius: 50%; color: var(--c);
  background: color-mix(in srgb, var(--c) 16%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--c) 50%, transparent);
}
.ipm-badge svg { inline-size: 1.5rem; block-size: 1.5rem; }
.ipm-node h3 { font-size: .98rem; margin: 0 0 .25rem; }
.ipm-node p { font-size: .78rem; color: var(--muted, #aab3bd); margin: 0; line-height: 1.4; }

/* pentagon positions (desktop) */
.pos-top { left: 50%; top: 4%; }
.pos-tr  { left: 92%; top: 36%; }
.pos-br  { left: 75%; top: 90%; }
.pos-bl  { left: 25%; top: 90%; }
.pos-tl  { left: 8%;  top: 36%; }

@keyframes ipmFlow { to { stroke-dashoffset: -58; } }
@keyframes ipmGlow {
  0%, 22%, 100% { box-shadow: var(--shadow-sm); border-color: var(--border, #2f3a48); }
  6%, 16% {
    box-shadow: 0 0 0 1px var(--c), 0 16px 40px color-mix(in srgb, var(--c) 45%, transparent);
    border-color: var(--c); transform: translate(-50%, -50%) scale(1.06);
  }
}

/* mobile → vertical stepper */
@media (max-width: 52rem) {
  .ipm-cycle { position: static; aspect-ratio: auto; inline-size: min(100%, 34rem); display: grid; gap: .85rem; }
  .ipm-ring, .ipm-ring-glow { display: none; }
  .ipm-center { position: static; transform: none; inline-size: auto; aspect-ratio: auto; border-radius: 18px; margin-inline: auto; }
  .ipm-node {
    position: static; transform: none; inline-size: auto; text-align: left; animation: none;
    display: grid; grid-template-columns: auto 1fr; column-gap: .9rem; align-items: center;
  }
  .ipm-node:hover { transform: none; }
  .ipm-badge { grid-row: span 2; margin: 0; }
  .ipm-node h3 { align-self: end; }
  .ipm-node p { align-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  .ipm-path, .ipm-ring-glow, .ipm-node { animation: none !important; }
}

/* ==========================================================================
   High-end line icons (replaced the emojis) — sizing & tint to match styling
   ========================================================================== */
.card .icon svg,
.ind-card .icon svg { inline-size: 1.7rem; block-size: 1.7rem; display: block; color: #ffe2d3; }
.feature .icon svg { color: #fff; }
.chip svg { inline-size: 1.15rem; block-size: 1.15rem; flex: none; color: currentColor; }
.chip[aria-pressed="true"] svg { color: #fff; }

/* ==========================================================================
   About — IPM model image (right column), clean framed presentation
   ========================================================================== */
.about-figure {
  position: relative; margin: 0; overflow: hidden;
  border-radius: 22px; border: 1px solid var(--border, #2f3a48);
  background: #0b0f15; box-shadow: var(--shadow-lg);
  transition: transform .4s var(--ease, ease), box-shadow .4s;
}
.about-figure img { display: block; inline-size: 100%; block-size: auto; }
.about-figure::after {              /* subtle brand vignette to match the dark UI */
  content: ""; position: absolute; inset: 0; pointer-events: none;
  box-shadow: inset 0 0 70px rgba(244, 84, 30, .12);
  border-radius: inherit;
}
.about-figure figcaption {
  position: absolute; inset-inline: 0; inset-block-end: 0; z-index: 1;
  padding: 1.4rem 1rem .85rem; text-align: center; font-size: .82rem; font-weight: 600;
  color: #fff; background: linear-gradient(to top, rgba(8, 11, 16, .85), transparent);
}
.about-figure:hover { transform: translateY(-4px); box-shadow: 0 48px 90px rgba(0, 0, 0, .6); }

/* ==========================================================================
   Industries — image-led cards
   ========================================================================== */
.ind-card { padding: 0 !important; overflow: hidden; }
.ind-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.ind-media img { inline-size: 100%; block-size: 100%; object-fit: cover; display: block; transition: transform .5s var(--ease, ease); }
.ind-card:hover .ind-media img { transform: scale(1.06); }
.ind-body { padding: 1.4rem 1.4rem 1.5rem; }
.ind-body h3 { margin: 0 0 .35rem; color: #fff; }
.ind-body p { margin: 0; color: var(--ink-300, #b9c2cc); font-size: .92rem; }

/* ==========================================================================
   Compliance — two-column with audit image
   ========================================================================== */
.compliance-layout { display: grid; gap: clamp(1.5rem, 3vw, 2.75rem); align-items: center; }
@media (min-width: 62rem) { .compliance-layout { grid-template-columns: 1.15fr .85fr; } }
.compliance-figure { margin: 0; }
.compliance-figure img {
  inline-size: 100%; block-size: auto; display: block; border-radius: 20px;
  border: 1px solid var(--border, #2f3a48); box-shadow: var(--shadow-lg);
}

/* ==========================================================================
   Services — colour-accented enterprise tiles (accent set per card)
   ========================================================================== */
.bento > .card { --c: #F4541E; overflow: hidden; }
.bento > .card:nth-child(2) { --c: #2bd4c4; }   /* cockroach  — teal   */
.bento > .card:nth-child(3) { --c: #E8A317; }   /* rodent     — amber  */
.bento > .card:nth-child(4) { --c: #3b82f6; }   /* fly        — blue   */
.bento > .card:nth-child(5) { --c: #36c172; }   /* ant        — green  */
.bento > .card:nth-child(6) { --c: #9b5de5; }   /* termite    — violet */
.bento > .card:nth-child(7) { --c: #ec4899; }   /* bed bug    — pink   */
.bento > .card:nth-child(8) { --c: #22d3ee; }   /* disinfect  — cyan   */

/* accent top bar */
.bento > .card::after {
  content: ""; position: absolute; inset-block-start: 0; inset-inline: 0; block-size: 3px; z-index: 2;
  background: linear-gradient(90deg, var(--c), transparent 82%);
}
/* accent-tinted spotlight that follows the pointer */
.bento > .card::before {
  background: radial-gradient(15rem 15rem at var(--mx) var(--my), color-mix(in srgb, var(--c) 16%, transparent), transparent 60%);
}
/* accent icon tile */
.bento > .card .icon {
  background: linear-gradient(135deg, color-mix(in srgb, var(--c) 34%, transparent), color-mix(in srgb, var(--c) 10%, transparent));
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
}
.bento > .card .icon svg { color: var(--c); }
/* accent hover state */
.bento > .card:hover {
  border-color: color-mix(in srgb, var(--c) 55%, var(--border, #2f3a48));
  box-shadow: 0 18px 44px color-mix(in srgb, var(--c) 22%, transparent), var(--shadow-md);
}
.bento > .card:hover h3 { color: color-mix(in srgb, var(--c) 35%, #fff); }
/* feature card keeps its solid brand identity */
.bento > .feature::after { display: none; }
.bento > .feature .icon { background: rgba(255, 255, 255, .15); border-color: rgba(255, 255, 255, .28); }
.bento > .feature .icon svg { color: #fff; }
.bento > .feature:hover h3 { color: #fff; }

/* ==========================================================================
   Hero quote card — reveal overlay + commercial/industrial form
   ========================================================================== */
.quote-card { position: relative; }

/* intro overlay */
.quote-overlay { display: flex; flex-direction: column; gap: .55rem; }
.quote-overlay .quote-points { list-style: none; padding: 0; margin: .4rem 0 1.2rem; display: grid; gap: .55rem; }
.quote-overlay .quote-points li { display: flex; gap: .6rem; align-items: center; font-weight: 600; font-size: .92rem; color: var(--fg, #eef1f4); }
.quote-overlay .quote-points li::before {
  content: ""; flex: none; inline-size: 1.15rem; block-size: 1.15rem; border-radius: 50%;
  background: var(--brand, #F4541E) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center / 70% no-repeat;
}
.quote-overlay #openQuoteForm { width: 100%; }

/* form wrapper collapsed until revealed */
.quote-formwrap { max-height: 0; overflow: hidden; opacity: 0; transition: max-height .55s var(--ease, ease), opacity .4s ease; }
.quote-card.revealed .quote-overlay { display: none; }
.quote-card.revealed .quote-formwrap { max-height: 2600px; opacity: 1; }

.quote-back {
  display: inline-flex; align-items: center; gap: .4rem; background: none; border: 0; cursor: pointer;
  color: var(--muted, #aab3bd); font-weight: 700; font-size: .9rem; padding: 0 0 .25rem; margin-bottom: .4rem;
}
.quote-back:hover { color: var(--brand, #F4541E); }
.quote-form-title { margin: 0 0 1rem; }

/* client type radio cards */
.choice-field, .services-field { border: 0; padding: 0; margin: 0 0 1rem; }
.choice-field legend, .services-field legend { font-weight: 700; font-size: .82rem; margin-bottom: .5rem; padding: 0; }
.legend-note { font-weight: 500; color: var(--muted, #aab3bd); }
.choice-row { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.choice-card {
  position: relative; display: flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .8rem; border: 1.5px solid var(--border, #2f3a48); border-radius: 12px;
  background: var(--surface-2, #222b37); font-weight: 700; cursor: pointer; transition: .2s var(--ease, ease); text-align: center;
}
.choice-card input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.choice-card:hover { border-color: var(--brand, #F4541E); }
.choice-card:has(input:checked) { border-color: var(--brand, #F4541E); background: color-mix(in srgb, var(--brand, #F4541E) 16%, transparent); box-shadow: 0 0 0 1px var(--brand, #F4541E); }
.choice-card:has(input:focus-visible) { outline: 2px solid var(--brand, #F4541E); outline-offset: 2px; }

/* service tick checkboxes */
.service-ticks { display: grid; grid-template-columns: 1fr; gap: .45rem; }
@media (min-width: 26rem) { .service-ticks { grid-template-columns: 1fr 1fr; } }
.tick {
  position: relative; display: flex; align-items: center; gap: .6rem;
  padding: .6rem .7rem; border: 1.5px solid var(--border, #2f3a48); border-radius: 10px;
  background: var(--surface-2, #222b37); font-size: .88rem; font-weight: 600; cursor: pointer; transition: .18s var(--ease, ease);
}
.tick input { position: absolute; opacity: 0; }
.tick::before {
  content: ""; flex: none; inline-size: 1.15rem; block-size: 1.15rem; border-radius: 6px;
  border: 1.5px solid var(--ink-500, #7b8794); background: transparent; transition: .18s var(--ease, ease);
}
.tick:hover { border-color: var(--brand, #F4541E); }
.tick:has(input:checked) { border-color: var(--brand, #F4541E); background: color-mix(in srgb, var(--brand, #F4541E) 14%, transparent); }
.tick:has(input:checked)::before {
  background: var(--brand, #F4541E) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center / 78% no-repeat;
  border-color: var(--brand, #F4541E);
}
.tick:has(input:focus-visible) { outline: 2px solid var(--brand, #F4541E); outline-offset: 2px; }

.location-tools { margin-bottom: .25rem; }
#useCurrentLocation { font-size: .9rem; padding: .55rem 1rem; gap: .45rem; }
#locationDisplay { background: var(--surface-2, #222b37); cursor: default; }

@media (prefers-reduced-motion: reduce) {
  .quote-formwrap { transition: none; }
}

/* ==========================================================================
   Hero choices panel
   ========================================================================== */
.quote-choices { display: grid; gap: .7rem; margin: 1rem 0 1.1rem; }
.quote-choice {
  display: flex; align-items: center; gap: .9rem; inline-size: 100%; text-align: left; cursor: pointer;
  padding: 1rem; border: 1.5px solid var(--border, #2f3a48); border-radius: 14px;
  background: var(--surface-2, #222b37); color: var(--fg, #eef1f4); transition: .22s var(--ease, ease);
}
.quote-choice:hover { border-color: var(--brand, #F4541E); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.qc-icon { flex: none; display: grid; place-items: center; inline-size: 2.8rem; block-size: 2.8rem; border-radius: 12px;
  background: color-mix(in srgb, var(--brand, #F4541E) 16%, transparent); border: 1px solid color-mix(in srgb, var(--brand, #F4541E) 40%, transparent); color: var(--brand-bright, #ff7a45); }
.qc-text { flex: 1; display: flex; flex-direction: column; gap: .1rem; }
.qc-text strong { font-size: 1.02rem; }
.qc-text small { color: var(--muted, #aab3bd); font-size: .85rem; }
.qc-arrow { color: var(--muted, #aab3bd); transition: .2s var(--ease, ease); }
.quote-choice:hover .qc-arrow { color: var(--brand-bright, #ff7a45); transform: translateX(3px); }

/* ==========================================================================
   Centered modal system (commercial + residential forms)
   ========================================================================== */
.amodal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 1rem; }
.amodal[hidden] { display: none; }
.amodal-backdrop { position: absolute; inset: 0; background: rgba(5, 8, 13, .72); backdrop-filter: blur(5px); opacity: 0; transition: opacity .25s ease; }
.amodal.open .amodal-backdrop { opacity: 1; }
.amodal-dialog {
  position: relative; z-index: 1; inline-size: min(640px, 100%); max-block-size: 92vh; overflow: auto;
  background: var(--surface, #1a212b); border: 1px solid var(--border, #2f3a48); border-radius: 20px;
  box-shadow: var(--shadow-lg); padding: clamp(1.25rem, 3vw, 2rem);
  transform: translateY(14px) scale(.97); opacity: 0; transition: transform .3s var(--ease-spring, ease), opacity .25s ease;
}
.amodal.open .amodal-dialog { transform: none; opacity: 1; }
.amodal-dialog::-webkit-scrollbar { width: 8px; }
.amodal-dialog::-webkit-scrollbar-thumb { background: var(--border, #2f3a48); border-radius: 8px; }
.amodal-close {
  position: absolute; inset-block-start: .9rem; inset-inline-end: .9rem; inline-size: 2.2rem; block-size: 2.2rem;
  border-radius: 50%; border: 1px solid var(--border, #2f3a48); background: var(--surface-2, #222b37); color: var(--fg, #eef1f4);
  display: grid; place-items: center; cursor: pointer; transition: .2s; z-index: 2;
}
.amodal-close:hover { border-color: var(--brand, #F4541E); color: var(--brand-bright, #ff7a45); }
.amodal-head { margin-block-end: 1.2rem; padding-inline-end: 2rem; }
.amodal-head h3 { margin: .25rem 0 .3rem; font-size: clamp(1.3rem, 1rem + 1.4vw, 1.6rem); }
.amodal-head p { margin: 0; color: var(--muted, #aab3bd); }

/* address + location controls + leaflet map */
.addr-row { display: flex; gap: .5rem; }
.addr-row input { flex: 1; }
.addr-find { flex: none; padding: .6rem 1.1rem; }
.location-tools { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin: .55rem 0 .25rem; }
.loc-btn { font-size: .88rem; padding: .5rem .9rem; gap: .4rem; }
.loc-hint { color: var(--muted, #aab3bd); font-size: .8rem; }
.leaflet-map { height: 260px; border-radius: 14px; margin-block-start: .25rem; border: 1px solid var(--border, #2f3a48); }

/* file upload */
.upload-drop {
  display: flex; align-items: center; gap: .7rem; padding: 1rem; cursor: pointer; font-size: .9rem;
  border: 1.5px dashed var(--border, #2f3a48); border-radius: 12px; background: var(--surface-2, #222b37);
  color: var(--muted, #aab3bd); transition: .2s ease;
}
.upload-drop:hover, .upload-drop.drag { border-color: var(--brand, #F4541E); color: var(--fg, #eef1f4); background: color-mix(in srgb, var(--brand, #F4541E) 9%, var(--surface-2, #222b37)); }
.upload-drop b { color: var(--brand-bright, #ff7a45); }
.upload-drop svg { color: var(--brand-bright, #ff7a45); flex: none; }
.upload-list { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .3rem; }
.upload-list li { font-size: .82rem; color: var(--muted, #aab3bd); background: var(--surface-2, #222b37); border: 1px solid var(--border, #2f3a48); border-radius: 8px; padding: .4rem .6rem; }

/* date/time inputs inherit field styling; ensure native picker is legible on dark */
input[type="date"], input[type="time"] { color-scheme: dark; }

@media (max-width: 30rem) {
  .amodal { padding: .5rem; }
  .amodal-dialog { padding: 1.1rem; border-radius: 16px; }
}

/* ==========================================================================
   Sentinel — launcher polish (panel chrome customised inline in <head>)
   ========================================================================== */
.sentinel-launcher {
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .06);
  transition: transform .25s var(--ease-spring, ease), box-shadow .25s ease;
}
.sentinel-launcher:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 16px 40px rgba(0, 0, 0, .45); }
.sentinel-ping { box-shadow: 0 0 0 0 rgba(54, 193, 114, .6); animation: pulse 2.4s infinite; }
/* ===== END styles.css ===== */

/* ===== BEGIN theme-red.css ===== */
/* Red/Black theme overrides adapted from provided CSS — applies red accents and removes colourful gradients */
:root{
  --bg: #080608;
  --bg-2: #050304;
  --bg-3: #020202;
  --bg-card: rgba(6,4,6,0.85);
  --neon: #d34300be; /* primary red accent */
  --neon-dim: rgba(255,59,48,0.08);
  --neon-glow: rgba(255,59,48,0.28);
  --violet: #7a0b0b; /* deep red */
  --violet-lt: #ff7b00dc;
  --pink: #ff6b81;
  --green: #00b894; /* keep for success */
  --border: rgba(255,59,48,0.08);
  --border-2: rgba(255,59,48,0.14);
  --border-3: rgba(255,59,48,0.22);
  --text: #bfc9d6;
  --text-muted: #8b95a3;
  --text-dim: #40464b;
  --white: #eef3f5;
  --font: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Neutralize bright multi-colour gradients — prefer solid or subtle red tints */
.glow-border::before,
.svc-card::before,
.quote-card::before,
.hero::before { background: linear-gradient(135deg, rgba(255,59,48,0.12), rgba(122,11,11,0.06)); }

/* Replace cyan glows with red tone */
.box-shadow-glow, .marquee .badge b, .sentinel-ping { box-shadow: 0 0 16px var(--neon-glow); }

/* Buttons: remove multicolour gradient, use solid red accent */
.btn-primary, .btn-wa, .nav__cta, .hero .btn-primary { background: linear-gradient(90deg, var(--neon), color-mix(in srgb, var(--neon) 88%, #000 12%)); color: #fff; }
.btn-primary::after { background: rgba(255,255,255,0.06); }

/* Hero title flow: remove rainbow animation, apply subtle red shimmer */
.hero__title-line, .hero__accent { animation: none; background: none; color: var(--white); }
.hero__accent { filter: drop-shadow(0 0 18px var(--neon-glow)); }

/* Remove bright neon scanlines — keep subtle dark overlays */
.hero__scan { background: repeating-linear-gradient(0deg, transparent, transparent 6px, rgba(0,0,0,0.02) 6px, rgba(0,0,0,0.02) 7px); }

/* Accent lines and borders: red tones */
.stat::after, .uc-card::before, .footer::before, .svc-card::before { background: linear-gradient(90deg, transparent, var(--neon), transparent); }

/* Glow/orb colours switched to red tints */
.hero__orb--1 { background: radial-gradient(circle, rgba(255,59,48,0.12) 0%, transparent 70%); }
.hero__orb--2 { background: radial-gradient(circle, rgba(122,11,11,0.08) 0%, transparent 70%); }
.hero__orb--3 { background: radial-gradient(circle, rgba(255,59,48,0.06) 0%, transparent 70%); }

/* Card hover — red toned bloom */
.svc-card:hover, .case-card:hover { box-shadow: 0 30px 80px rgba(0,0,0,0.6), 0 0 48px rgba(255,59,48,0.06); border-color: var(--border-2); }

/* Replace neon link colours */
a, .nav__links a:hover, .case-card__link { color: var(--neon); }

/* Footer contact: prefer simple red dot instead of cyan */
.footer__bottom-badge span { background: var(--neon); box-shadow: 0 0 8px rgba(255,59,48,0.35); }

/* Remove multicolour title flow and similar animations to keep a darker, red-accented feel */
@media (prefers-reduced-motion: reduce) {
  .hero__orb, .svc-card, .case-card { animation: none !important; }
}

/* Force a high-contrast dark background where needed */
.hero, .svc-showcase, .case-studies, .contact { background: linear-gradient(180deg, #000, #080608); }

/* Keep radii minimal to match recent square theme */
* { border-radius: 0 !important; }

/* Make page content full-width: override container constraints from main CSS */
.container {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  padding-inline: var(--gutter, 1rem) !important;
}

/* Section headers and centered blocks should expand full-bleed */
.section-head { max-width: none !important; margin-inline: 0 !important; padding-inline: var(--gutter,1rem) !important; }
.hero .lead { max-width: none !important; }
.section { padding-inline: 0 !important; }
/* ===== END theme-red.css ===== */

/* ===== BEGIN asc-quote-fab.css ===== */
/* =========================================================
   ASC Pest Control — Floating "Get Quote" contact burst
   Bottom-right FAB that expands into 8 social/contact icons.
   Sits above the Sentinel chat launcher in the same stack.
   ========================================================= */

.asc-quote-fab {
  position: fixed;
  right: 20px;
  bottom: 96px; /* clears the Sentinel launcher beneath it */
  z-index: 10050;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
}

.asc-quote-fab__toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--burgundy, #B02040), var(--burgundy-deep, #8a1832));
  color: #fff;
  font-family: "Inter", "DM Sans", Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(176, 32, 64, 0.4), 0 0 0 4px rgba(176, 32, 64, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.asc-quote-fab__toggle:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(176, 32, 64, 0.48), 0 0 0 4px rgba(176, 32, 64, 0.1);
}

.asc-quote-fab__toggle svg {
  width: 18px;
  height: 18px;
  flex: none;
  transition: transform 0.3s ease;
}

.asc-quote-fab.is-open .asc-quote-fab__toggle svg {
  transform: rotate(135deg);
}

.asc-quote-fab__menu {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
}

.asc-quote-fab__item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  opacity: 0;
  transform: translateY(10px) scale(0.85);
  transition: opacity 0.22s ease, transform 0.22s ease;
  pointer-events: none;
}

.asc-quote-fab.is-open .asc-quote-fab__item {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

/* Stagger the reveal of each icon */
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(1) { transition-delay: 0.02s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(2) { transition-delay: 0.05s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(3) { transition-delay: 0.08s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(4) { transition-delay: 0.11s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(5) { transition-delay: 0.14s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(6) { transition-delay: 0.17s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(7) { transition-delay: 0.2s; }
.asc-quote-fab.is-open .asc-quote-fab__item:nth-child(8) { transition-delay: 0.23s; }

.asc-quote-fab__label {
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(20, 24, 31, 0.92);
  color: #fff;
  font-family: "Inter", "DM Sans", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.asc-quote-fab__icon {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.3);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.asc-quote-fab__icon:hover {
  transform: translateY(-2px) scale(1.06);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.36);
}

.asc-quote-fab__icon svg { width: 20px; height: 20px; }

.asc-quote-fab__icon--whatsapp  { background: #25D366; }
.asc-quote-fab__icon--phone     { background: var(--olive, #6B8E23); }
.asc-quote-fab__icon--mail      { background: var(--burgundy, #B02040); }
.asc-quote-fab__icon--linkedin  { background: #0A66C2; }
.asc-quote-fab__icon--facebook  { background: #1877F2; }
.asc-quote-fab__icon--youtube   { background: #FF0000; }
.asc-quote-fab__icon--tiktok    { background: #010101; }
.asc-quote-fab__icon--instagram {
  background: radial-gradient(circle at 30% 110%, #fdf497, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}

@media (max-width: 480px) {
  .asc-quote-fab { right: 12px; bottom: 84px; }
  .asc-quote-fab__label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .asc-quote-fab__toggle svg,
  .asc-quote-fab__item { transition: none !important; }
}

/* =========================================================
   Get Quote button — opens a popup contact/quote form
   Sits just above the Contact Us burst button.
   ========================================================= */

.asc-getquote-fab {
  position: fixed;
  right: 20px;
  bottom: 96px; /* clears the Sentinel chat launcher beneath it */
  z-index: 10050;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
}

/* Contact icon buttons (WhatsApp, Call, Email) sitting above Get a Quote,
   with curved (rounded-square) edges. */
.asc-contact-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
.asc-contact-stack__btn {
  display: inline-grid;
  place-items: center;
  width: 50px;
  height: 50px;
  border-radius: 16px; /* curved edges, not a full circle */
  color: #fff;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.3);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.asc-contact-stack__btn:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.38);
}
.asc-contact-stack__btn svg { width: 24px; height: 24px; }
.asc-contact-stack__btn--whatsapp { background: #25D366; }
.asc-contact-stack__btn--phone    { background: var(--olive, #6B8E23); }
.asc-contact-stack__btn--mail     { background: var(--burgundy, #B02040); }

.asc-getquote-fab__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border: none;
  border-radius: 18px; /* curved edges */
  background: linear-gradient(135deg, var(--olive, #6B8E23), var(--olive-deep, #557018));
  color: #fff;
  font-family: "Inter", "DM Sans", Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(107, 142, 35, 0.4), 0 0 0 4px rgba(107, 142, 35, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.asc-getquote-fab__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(107, 142, 35, 0.48), 0 0 0 4px rgba(107, 142, 35, 0.1);
}

.asc-getquote-fab__btn svg { width: 17px; height: 17px; flex: none; }

@media (max-width: 480px) {
  .asc-getquote-fab { right: 12px; bottom: 84px; }
  .asc-contact-stack__btn { width: 46px; height: 46px; border-radius: 14px; }
  .asc-contact-stack__btn svg { width: 22px; height: 22px; }
}

/* --- Popup quote-request modal --- */

.asc-quote-modal {
  position: fixed;
  inset: 0;
  z-index: 10100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.asc-quote-modal[hidden] { display: none; }

.asc-quote-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 10, 13, 0.72);
  backdrop-filter: blur(3px);
}

.asc-quote-modal__dialog {
  position: relative;
  width: min(520px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 20px;
  padding: 32px 28px 28px;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.4);
}

.asc-quote-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: rgba(20, 24, 31, 0.06);
  color: #14181f;
  cursor: pointer;
  transition: background 0.15s ease;
}

.asc-quote-modal__close:hover { background: rgba(20, 24, 31, 0.12); }
.asc-quote-modal__close svg { width: 16px; height: 16px; }

.asc-quote-modal__dialog h3 {
  margin: 0 0 6px;
  font-family: "Inter", "DM Sans", Arial, sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: #14181f;
}

.asc-quote-modal__dialog p.asc-quote-modal__lead {
  margin: 0 0 20px;
  color: #5b6470;
  font-size: 14px;
  line-height: 1.5;
}

.asc-quote-form { display: grid; gap: 14px; }

.asc-quote-form label {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  color: #14181f;
  margin-bottom: 6px;
}

.asc-quote-form input,
.asc-quote-form select,
.asc-quote-form textarea {
  width: 100%;
  padding: 11px 13px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  font-family: inherit;
  font-size: 14px;
  color: #14181f;
  background: #fff;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.asc-quote-form input:focus,
.asc-quote-form select:focus,
.asc-quote-form textarea:focus {
  border-color: var(--burgundy, #B02040);
  box-shadow: 0 0 0 3px rgba(176, 32, 64, 0.12);
}

.asc-quote-form textarea { resize: vertical; min-height: 90px; }

.asc-quote-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

@media (max-width: 480px) {
  .asc-quote-form__row { grid-template-columns: 1fr; }
}

.asc-quote-form__submit {
  margin-top: 4px;
  padding: 13px 20px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--burgundy, #B02040), var(--burgundy-deep, #8a1832));
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.asc-quote-form__submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(176, 32, 64, 0.32);
}

.asc-quote-form__status {
  font-size: 13px;
  font-weight: 700;
  margin: 0;
}
.asc-quote-form__status.is-ok { color: #1f7a3d; }
.asc-quote-form__status.is-err { color: #c0392b; }
/* ===== END asc-quote-fab.css ===== */

/* =========================================================
   Footer social icons — moved here from the floating burst.
   ========================================================= */
.footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 1.1rem;
}
.footer-social__btn {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px; /* curved edges to match the site */
  color: #fff;
  transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}
.footer-social__btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0, 0, 0, 0.3); }
.footer-social__btn svg { width: 20px; height: 20px; }
.footer-social__btn--linkedin  { background: #0A66C2; }
.footer-social__btn--facebook  { background: #1877F2; }
.footer-social__btn--youtube   { background: #FF0000; }
.footer-social__btn--tiktok    { background: #010101; }
.footer-social__btn--instagram {
  background: radial-gradient(circle at 30% 110%, #fdf497, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}

/* ===== BEGIN asc-enterprise.css ===== */
/* ==========================================================================
   ASC Pest Control — Enterprise dark-glass skin for inner pages
   Scoped to .asc-page (added to <main> on every page). Re-skins the shared
   template components (pages.css / home-v2.css) to a dark-glass finish by
   (1) overriding the design tokens those templates already consume, then
   (2) correcting the few hard-coded light literals. No page structure is
   changed beyond the wrapper class.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Page-level dark canvas
   -------------------------------------------------------------------------- */

.asc-page {
    /* brand */
    --burgundy: #c51646;
    --burgundy-bright: #c51646;
    --burgundy-deep: #650028;
    --olive: #6b8e23;
    --olive-deep: #c4e283;
    --orange: #c51646;
    --orange-bright: #c4e283;

    /* surfaces & text */
    --bg: #0b0f14;
    --bg-alt: #0e1319;
    --ink-950: #0b0f14;
    --surface: rgba(20, 26, 31, 0.72);
    --line: rgba(255, 255, 255, 0.12);
    --fg: #f4f6f5;
    --muted: #9ba8b0;

    --gray-50: #0d1216;
    --gray-100: #10151a;
    --gray-200: rgba(255, 255, 255, 0.10);

    --radius: 20px;
    --shadow: 0 28px 80px rgba(0, 0, 0, 0.45);

    position: relative;
    color: var(--fg);
    background:
        radial-gradient(circle at 12% 0%, rgba(157, 0, 61, 0.14), transparent 36%),
        radial-gradient(circle at 88% 6%, rgba(31, 143, 77, 0.10), transparent 34%),
        linear-gradient(180deg, #0b0f14 0%, #0e1319 50%, #0b0f14 100%);
    overflow-x: hidden;
}

.asc-page * { box-sizing: border-box; }

/* --------------------------------------------------------------------------
   1. Typography
   -------------------------------------------------------------------------- */

.asc-page h1, .asc-page h2, .asc-page h3, .asc-page h4 {
    color: #ffffff !important;
}

.asc-page .section-lead,
.asc-page .hero-lead {
    color: var(--muted) !important;
}

.asc-page .eyebrow, .asc-page .badge {
    color: #d7f09b !important;
}

/* --------------------------------------------------------------------------
   2. Hero
   -------------------------------------------------------------------------- */

.asc-page .page-hero {
    background:
        radial-gradient(900px 520px at 70% -10%, rgba(197, 22, 70, 0.24), transparent 60%),
        linear-gradient(180deg, #0e1319 0%, #0b0f14 100%) !important;
    border-bottom: 1px solid var(--line);
}

/* --------------------------------------------------------------------------
   3. Sections
   -------------------------------------------------------------------------- */

.asc-page .detail-section:nth-child(odd) {
    background: linear-gradient(180deg, #0b0f14, #0d1116) !important;
}

.asc-page .detail-section:nth-child(even),
.asc-page .faq-section:nth-child(even) {
    background: linear-gradient(180deg, #0d1116, #0b0f14) !important;
}

.asc-page .band {
    background: rgba(14, 19, 25, 0.7) !important;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

/* --------------------------------------------------------------------------
   4. Cards
   -------------------------------------------------------------------------- */

.asc-page .info-card,
.asc-page .area-card,
.asc-page .svc-card,
.asc-page .plan,
.asc-page .contact-method,
.asc-page .feature-card,
.asc-page .step-card {
    background: rgba(20, 26, 31, 0.78) !important;
    border: 1px solid var(--line) !important;
    color: var(--fg) !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.32) !important;
}

.asc-page .info-card h3, .asc-page .area-card h3, .asc-page .svc-card h3 { color: #ffffff !important; }
.asc-page .info-card p, .asc-page .area-card p, .asc-page .svc-card p { color: var(--muted) !important; }

.asc-page .std-badge {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(196, 226, 131, 0.3) !important;
    color: #d7f09b !important;
}

.asc-page .feature-list li { color: rgba(245, 249, 247, 0.86) !important; }

/* --------------------------------------------------------------------------
   5. Buttons
   -------------------------------------------------------------------------- */

.asc-page .btn-primary {
    background: linear-gradient(135deg, var(--burgundy-bright), var(--burgundy-deep)) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

.asc-page .btn-outline-light {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* --------------------------------------------------------------------------
   6. CTA band
   -------------------------------------------------------------------------- */

.asc-page .page-cta {
    background: linear-gradient(135deg, #11170b, #1a050b) !important;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.asc-page .page-cta h2 { color: #ffffff !important; }
.asc-page .page-cta .section-lead { color: rgba(245, 249, 247, 0.88) !important; }

/* --------------------------------------------------------------------------
   7. Forms
   -------------------------------------------------------------------------- */

.asc-page .pg-form {
    background: rgba(14, 19, 25, 0.72) !important;
    border: 1px solid var(--line) !important;
}

.asc-page .pg-form label { color: var(--muted) !important; }

.asc-page .pg-form input,
.asc-page .pg-form textarea,
.asc-page .pg-form select,
.asc-page .field input,
.asc-page .field textarea,
.asc-page .field select {
    background: rgba(5, 6, 8, 0.6) !important;
    border: 1px solid var(--line) !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   8. FAQ accordions
   -------------------------------------------------------------------------- */

.asc-page details {
    border: 1px solid var(--line) !important;
    background: rgba(20, 26, 31, 0.76) !important;
}

.asc-page summary { color: #ffffff !important; }
.asc-page details p { color: var(--muted) !important; }

/* --------------------------------------------------------------------------
   9. Placeholders / footer
   -------------------------------------------------------------------------- */

.asc-page .img-placeholder {
    background: rgba(14, 19, 25, 0.6) !important;
    border-color: var(--line) !important;
    color: var(--muted) !important;
}

.asc-page .footer-bottom,
.asc-page .footer-note { color: var(--muted) !important; }
/* ===== END asc-enterprise.css ===== */

/* ===== BEGIN blog/blog-post.css ===== */
/* ============================================================================
   ASC Pest Control — Blog Post Stylesheet
   Enterprise-grade article layout
   ============================================================================ */

:root {
  --brand:       #F4541E;
  --brand-dark:  #d63d10;
  --bg:          #0b0f15;
  --bg-2:        #141a24;
  --bg-3:        #1e2733;
  --border:      rgba(255,255,255,.07);
  --text:        #f0f4f8;
  --text-muted:  #8a96a3;
  --text-dim:    #5a6472;
  --success:     #22c55e;
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   20px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text); font-family: 'Inter', sans-serif; line-height: 1.7; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ── Progress bar ── */
.read-progress {
  position: fixed; top: 0; left: 0; z-index: 2000;
  height: 3px; background: var(--brand);
  width: 0%; transition: width .1s linear;
  box-shadow: 0 0 10px rgba(244,84,30,.6);
}

/* ── Post Hero ── */
.post-hero {
  position: relative;
  min-height: 520px;
  display: flex; align-items: flex-end;
  overflow: hidden;
  background: var(--bg-2);
}
.post-hero-img-wrap {
  position: absolute; inset: 0;
  overflow: hidden;
}
.post-hero-img-placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .75rem;
  background: var(--hero-gradient, linear-gradient(135deg,#141a24,#0b0f15));
  border-bottom: 1px dashed rgba(255,255,255,.1);
}
.post-hero-img-placeholder .ph-tag {
  font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.2); background: rgba(255,255,255,.05);
  padding: .25rem .65rem; border-radius: 3px; border: 1px solid rgba(255,255,255,.1);
}
.post-hero-img-placeholder .ph-desc {
  font-size: .88rem; font-weight: 500; color: rgba(255,255,255,.4);
  text-align: center; max-width: 420px; line-height: 1.5; padding: 0 1rem;
}
.post-hero-img-placeholder .ph-res {
  font-size: .72rem; font-weight: 600; letter-spacing: .1em;
  color: rgba(255,255,255,.2); font-family: 'Courier New', monospace;
}
.post-hero-img-placeholder img {
  width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0;
}
.post-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(11,15,21,.95) 0%, rgba(11,15,21,.55) 50%, rgba(11,15,21,.1) 100%);
}
.post-hero-content {
  position: relative; z-index: 2;
  width: 100%; max-width: 860px; margin: 0 auto;
  padding: 3rem 1.5rem 3.5rem;
}
.post-category-badge {
  display: inline-block;
  background: rgba(244,84,30,.15); color: var(--brand);
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: .3rem .75rem; border-radius: 4px; border: 1px solid rgba(244,84,30,.3);
  margin-bottom: 1rem;
}
.post-hero-title {
  font-size: clamp(2rem, 5vw, 3.1rem);
  font-weight: 800; line-height: 1.2;
  color: #fff; margin-bottom: 1rem;
}
.post-hero-title .hl { color: var(--brand); }
.post-meta {
  display: flex; flex-wrap: wrap; gap: .75rem 1.5rem;
  align-items: center; font-size: .92rem; color: var(--text-muted);
}
.post-meta-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--text-dim); }
.post-meta-author { display: flex; align-items: center; gap: .5rem; }
.post-meta-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--brand); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .65rem; font-weight: 700; flex-shrink: 0;
}

/* ── Layout ── */
.post-layout {
  display: grid;
  grid-template-columns: [full-start] 1fr [main-start] min(780px, calc(100% - 3rem)) [main-end] 1fr [full-end];
  gap: 0;
  padding: 3.5rem 0 5rem;
  overflow-x: hidden;
}
.post-layout > * { grid-column: main; min-width: 0; }
.post-layout > .full-bleed { grid-column: full; }
.post-layout > .wide { grid-column: full; max-width: 960px; margin: 0 auto; width: 100%; padding: 0 1.5rem; box-sizing: border-box; }

/* Prevent inner grids from blowing out the column */
.post-body { min-width: 0; }
.stats-strip { min-width: 0; }

@media (max-width: 720px) {
  .post-layout {
    grid-template-columns: [full-start main-start] 1fr [main-end full-end];
    padding: 2rem 1.25rem 4rem;
  }
  .post-layout > .wide { padding: 0; }
}

/* ── Body text ── */
.post-body p { margin-bottom: 1.55rem; color: #c8d0db; font-size: 1.125rem; line-height: 1.85; }
.post-body h2 {
  font-size: clamp(1.5rem, 3vw, 1.85rem); font-weight: 700; margin: 2.75rem 0 1.1rem;
  color: var(--text); padding-bottom: .55rem;
  border-bottom: 1px solid var(--border);
}
.post-body h3 { font-size: clamp(1.15rem, 2vw, 1.35rem); font-weight: 600; margin: 2rem 0 .7rem; color: var(--text); }
.post-body ul, .post-body ol {
  padding-left: 1.75rem; margin-bottom: 1.55rem; color: #c8d0db;
}
.post-body li { margin-bottom: .65rem; line-height: 1.8; font-size: 1.05rem; }
.post-body strong { color: var(--text); font-weight: 600; }

/* ── Inline image container ── */
.img-container {
  margin: 2.5rem 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--bg-2);
}
.img-container-inner {
  width: 100%; aspect-ratio: 16/9;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .6rem;
  background: var(--img-gradient, linear-gradient(135deg,#141a24,#0b0f15));
  position: relative; overflow: hidden;
  border-bottom: 1px dashed rgba(255,255,255,.08);
}
.img-container-inner img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.img-container-inner .ph-tag {
  position: relative; z-index: 1;
  font-size: .65rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.2); background: rgba(255,255,255,.05);
  padding: .2rem .6rem; border-radius: 3px; border: 1px solid rgba(255,255,255,.1);
}
.img-container-inner .ph-desc {
  position: relative; z-index: 1;
  font-size: .82rem; font-weight: 500; color: rgba(255,255,255,.35);
  text-align: center; max-width: 380px; line-height: 1.5; padding: 0 1.5rem;
}
.img-container-inner .ph-res {
  position: relative; z-index: 1;
  font-size: .68rem; font-weight: 600; letter-spacing: .1em;
  color: rgba(255,255,255,.18); font-family: 'Courier New', monospace;
}
.img-container figcaption {
  padding: .65rem 1rem; font-size: .8rem; color: var(--text-dim);
  border-top: 1px solid var(--border); font-style: italic;
}

/* ── Pull quote ── */
.pull-quote {
  margin: 2.5rem 0;
  padding: 1.5rem 1.75rem;
  border-left: 3px solid var(--brand);
  background: rgba(244,84,30,.06);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.pull-quote p {
  font-size: 1.3rem !important;
  font-style: italic;
  color: var(--text) !important;
  margin: 0 !important;
  line-height: 1.65 !important;
}
.pull-quote cite {
  display: block; margin-top: .6rem;
  font-size: .8rem; color: var(--text-muted); font-style: normal;
}

/* ── Callout box ── */
.callout {
  margin: 2rem 0; padding: 1.25rem 1.5rem;
  border-radius: var(--radius-md);
  display: flex; gap: 1rem; align-items: flex-start;
}
.callout--info { background: rgba(96,165,250,.08); border: 1px solid rgba(96,165,250,.2); }
.callout--warn { background: rgba(251,191,36,.08); border: 1px solid rgba(251,191,36,.2); }
.callout--success { background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.2); }
.callout-icon { display: flex; flex-shrink: 0; margin-top: .1rem; }
.callout-svg { display: block; }
.callout-svg--warn { color: #fbbf24; }
.callout-svg--success { color: #22c55e; }
.callout-svg--info { color: #60a5fa; }
.callout-body { font-size: 1rem; color: #c8d0db; line-height: 1.7; }
.callout-body strong { color: var(--text); }

/* ── Checklist ── */
.checklist { list-style: none; padding: 0; margin-bottom: 1.4rem; }
.checklist li {
  display: flex; gap: .75rem; align-items: flex-start;
  padding: .65rem 0; border-bottom: 1px solid var(--border);
  font-size: 1.05rem; color: #c8d0db; line-height: 1.75;
}
.checklist li:last-child { border-bottom: none; }
.checklist li::before {
  content: "";
  display: block; flex-shrink: 0; margin-top: .25rem;
  width: 16px; height: 16px; min-width: 16px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' width='16' height='16' fill='none' stroke='%2322c55e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-size: contain;
}

/* ── Stats strip ── */
.stats-strip {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr));
  gap: 1px; background: var(--border);
  border: 1px solid var(--border); border-radius: var(--radius-md);
  overflow: hidden; margin: 2.5rem 0;
}
.stat-item {
  background: var(--bg-2); padding: 1.25rem 1rem; text-align: center;
}
.stat-item .stat-value {
  font-size: 2.4rem; font-weight: 800; color: var(--brand); line-height: 1;
}
.stat-item .stat-label { font-size: .88rem; color: var(--text-muted); margin-top: .4rem; }

/* ── CTA block ── */
.post-cta {
  margin: 3rem 0; padding: 2rem;
  background: linear-gradient(135deg, rgba(244,84,30,.1) 0%, rgba(244,84,30,.04) 100%);
  border: 1px solid rgba(244,84,30,.25);
  border-radius: var(--radius-lg);
  text-align: center;
}
.post-cta h3 { font-size: 1.45rem; margin-bottom: .6rem; }
.post-cta p { color: var(--text-muted); font-size: 1.05rem; margin-bottom: 1.4rem !important; }
.post-cta .btn-group { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }
.btn-primary {
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--brand); color: #fff; font-weight: 600;
  padding: .85rem 1.7rem; border-radius: var(--radius-sm);
  font-size: 1rem; border: none; cursor: pointer; text-decoration: none;
  transition: background .2s, transform .15s;
}
.btn-primary:hover { background: var(--brand-dark); transform: translateY(-1px); text-decoration: none; }
.btn-outline {
  display: inline-flex; align-items: center; gap: .5rem;
  background: transparent; color: var(--text); font-weight: 600;
  padding: .85rem 1.7rem; border-radius: var(--radius-sm);
  font-size: 1rem; border: 1px solid var(--border); cursor: pointer; text-decoration: none;
  transition: border-color .2s, color .2s;
}
.btn-outline:hover { border-color: rgba(255,255,255,.25); text-decoration: none; }

/* ── Author card ── */
.author-card {
  display: flex; gap: 1.25rem; align-items: flex-start;
  padding: 1.5rem; background: var(--bg-2);
  border: 1px solid var(--border); border-radius: var(--radius-md);
  margin: 3rem 0 2rem;
}
.author-avatar {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--brand); color: #fff; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; font-weight: 700;
}
.author-info h4 { font-size: 1.05rem; font-weight: 700; margin-bottom: .25rem; }
.author-info p { font-size: .95rem; color: var(--text-muted); margin: 0 !important; line-height: 1.6 !important; }

/* ── Tags ── */
.post-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
.post-tag {
  font-size: .75rem; font-weight: 600; padding: .25rem .7rem; border-radius: 4px;
  background: var(--bg-3); color: var(--text-muted); border: 1px solid var(--border);
  text-decoration: none; transition: border-color .2s, color .2s;
}
.post-tag:hover { border-color: var(--brand); color: var(--brand); text-decoration: none; }

/* ── Related posts ── */
.related-posts { padding: 3rem 0 2rem; border-top: 1px solid var(--border); }
.related-posts h3 { font-size: 1.1rem; font-weight: 700; margin-bottom: 1.5rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; }
.related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: 1rem; }
.related-card {
  background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius-md);
  overflow: hidden; text-decoration: none; transition: border-color .2s, transform .2s;
}
.related-card:hover { border-color: rgba(244,84,30,.35); transform: translateY(-3px); text-decoration: none; }
.related-card-thumb {
  aspect-ratio: 16/9;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .3rem;
  border-bottom: 1px dashed rgba(255,255,255,.08);
}
.related-card-thumb .ph-res {
  font-size: .6rem; font-weight: 600; letter-spacing: .08em;
  color: rgba(255,255,255,.18); font-family: 'Courier New', monospace;
}
.related-card-body { padding: .9rem 1rem 1rem; }
.related-card-body .tag { font-size: .75rem; font-weight: 700; color: var(--brand); text-transform: uppercase; letter-spacing: .08em; }
.related-card-body h4 { font-size: 1rem; font-weight: 600; color: var(--text); line-height: 1.4; margin-top: .35rem; }

/* ── Breadcrumb ── */
.breadcrumb {
  padding: 1.25rem 0 0;
  font-size: .8rem; color: var(--text-dim);
  display: flex; align-items: center; gap: .4rem; flex-wrap: wrap;
}
.breadcrumb a { color: var(--text-dim); text-decoration: none; transition: color .2s; }
.breadcrumb a:hover { color: var(--text); }
.breadcrumb-sep { color: var(--text-dim); }

/* ── Share ── */
.share-bar {
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
  padding: 1.5rem 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
  margin-bottom: 2rem;
}
.share-label { font-size: .8rem; font-weight: 600; color: var(--text-muted); margin-right: .25rem; }
.share-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .8rem; font-weight: 600; padding: .4rem .9rem; border-radius: 6px;
  border: 1px solid var(--border); color: var(--text-muted); background: var(--bg-2);
  cursor: pointer; text-decoration: none; transition: border-color .2s, color .2s;
}
.share-btn:hover { border-color: rgba(255,255,255,.2); color: var(--text); text-decoration: none; }

/* ── Responsive ── */
@media (max-width: 640px) {
  .post-hero { min-height: 380px; }
  .post-hero-img-placeholder { gap: .5rem; }
  .author-card { flex-direction: column; }
}
/* ===== END blog/blog-post.css ===== */

/* ===== BEGIN asc-landing plugin source (premium header/hero/section system) ===== */
/* ==========================================================================
   ASC Pest Control Landing Page
   Premium Dark Glass Theme
   Complete replacement stylesheet
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. WordPress / theme reset for landing page
   -------------------------------------------------------------------------- */

body.asc-pest-landing-page {
    margin: 0 !important;
    padding: 0 !important;
    background: #050608 !important;
    color: #ffffff !important;
    overflow-x: hidden !important;
}

body.asc-pest-landing-page #masthead,
body.asc-pest-landing-page .site-header,
body.asc-pest-landing-page .main-header,
body.asc-pest-landing-page .header-main,
body.asc-pest-landing-page .elementor-location-header,
body.asc-pest-landing-page header.site-header {
    display: none !important;
}

body.asc-pest-landing-page .site,
body.asc-pest-landing-page .content-bg,
body.asc-pest-landing-page .entry,
body.asc-pest-landing-page .entry-content,
body.asc-pest-landing-page .entry-content-wrap,
body.asc-pest-landing-page .content-area,
body.asc-pest-landing-page main,
body.asc-pest-landing-page article {
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.asc-pest-landing-page .entry-title,
body.asc-pest-landing-page .entry-header,
body.asc-pest-landing-page .post-thumbnail {
    display: none !important;
}

/* --------------------------------------------------------------------------
   2. Global design system
   -------------------------------------------------------------------------- */

.asc-landing,
.asc-landing * {
    box-sizing: border-box !important;
}

.asc-landing {
    --asc-burgundy: #9d003d;
    --asc-burgundy-bright: #c51646;
    --asc-burgundy-dark: #650028;

    --asc-green: #13612e;
    --asc-green-light: #1f8f4d;
    --asc-olive: #6b8e23;
    --asc-olive-light: #c4e283;
    --asc-gold: #f5a524;

    --asc-bg: #050608;
    --asc-bg-soft: #080d10;
    --asc-bg-panel: rgba(14, 20, 24, 0.72);
    --asc-bg-panel-strong: rgba(18, 26, 31, 0.86);

    --asc-white: #ffffff;
    --asc-text: #f8fafc;
    --asc-text-soft: #d7dee3;
    --asc-text-muted: #9ba8b0;

    --asc-line: rgba(255, 255, 255, 0.13);
    --asc-line-strong: rgba(255, 255, 255, 0.2);

    --asc-radius-sm: 14px;
    --asc-radius-md: 20px;
    --asc-radius-lg: 28px;
    --asc-radius-xl: 36px;

    --asc-shadow-soft: 0 18px 50px rgba(0, 0, 0, 0.28);
    --asc-shadow-card: 0 28px 80px rgba(0, 0, 0, 0.38);
    --asc-shadow-strong: 0 42px 120px rgba(0, 0, 0, 0.55);

    width: 100% !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    background:
        radial-gradient(circle at 12% 0%, rgba(157, 0, 61, 0.22), transparent 34%),
        radial-gradient(circle at 88% 4%, rgba(31, 143, 77, 0.16), transparent 32%),
        linear-gradient(180deg, #050608 0%, #081014 44%, #050608 100%) !important;
    color: var(--asc-text) !important;
    font-family: "DM Sans", "Inter", Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.65 !important;
    overflow-x: hidden !important;
    position: relative !important;
}

/* Gloss texture layer */
.asc-landing::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
        radial-gradient(circle at 18% 8%, rgba(197, 22, 70, 0.14), transparent 28%),
        radial-gradient(circle at 82% 12%, rgba(196, 226, 131, 0.08), transparent 28%);
    background-size: 52px 52px, 52px 52px, auto, auto;
    opacity: 0.78;
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.85), transparent 78%);
}

.asc-landing > * {
    position: relative;
    z-index: 1;
}

.asc-landing a {
    color: inherit;
    text-decoration: none !important;
}

.asc-landing img,
.asc-landing svg {
    max-width: 100%;
}

.asc-container {
    width: min(1200px, calc(100% - 36px)) !important;
    margin-inline: auto !important;
}

/* --------------------------------------------------------------------------
   3. Typography
   -------------------------------------------------------------------------- */

.asc-landing h1,
.asc-landing h2,
.asc-landing h3,
.asc-landing p {
    font-family: inherit !important;
}

.asc-landing h1,
.asc-landing h2,
.asc-landing h3 {
    margin-top: 0 !important;
    color: #ffffff !important;
    font-weight: 950 !important;
    letter-spacing: -0.05em !important;
    line-height: 1.02 !important;
}

.asc-landing h1 {
    max-width: 780px !important;
    margin-bottom: 1.05rem !important;
    font-size: clamp(2.35rem, 4.9vw, 4.9rem) !important;
    text-shadow:
        0 18px 48px rgba(0, 0, 0, 0.65),
        0 3px 10px rgba(0, 0, 0, 0.42) !important;
}

.asc-landing h2 {
    max-width: 780px !important;
    margin-bottom: 1rem !important;
    font-size: clamp(2rem, 3.4vw, 3.35rem) !important;
    line-height: 1.04 !important;
}

.asc-landing h3 {
    margin-bottom: 0.65rem !important;
    font-size: clamp(1.12rem, 1.45vw, 1.35rem) !important;
    line-height: 1.16 !important;
}

.asc-section__lead,
.asc-hero__lead {
    color: var(--asc-text-soft) !important;
    font-size: clamp(1rem, 1.35vw, 1.13rem) !important;
    line-height: 1.75 !important;
}

.asc-section__lead {
    max-width: 780px !important;
    margin: 0 0 2rem !important;
}

/* Eyebrow label */
.asc-eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    width: fit-content !important;
    margin: 0 0 0.95rem !important;
    padding: 7px 12px !important;
    border: 1px solid rgba(196, 226, 131, 0.22) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.095), rgba(255, 255, 255, 0.035)),
        rgba(7, 11, 13, 0.72) !important;
    color: #d7f09b !important;
    font-size: 0.66rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.15em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 14px 34px rgba(0, 0, 0, 0.24) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

.asc-eyebrow::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--asc-burgundy-bright);
    box-shadow: 0 0 18px rgba(197, 22, 70, 0.78);
}

.asc-eyebrow--light {
    color: #d7f09b !important;
}

/* --------------------------------------------------------------------------
   4. Premium header
   -------------------------------------------------------------------------- */

.asc-pest-premium-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 999999 !important;
    width: 100% !important;
    overflow: visible !important;
    background: rgba(5, 6, 8, 0.78) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.44),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    /* NO backdrop-filter here: a backdrop-filter ancestor clips its
       absolutely-positioned descendants to its own box, which was cutting off
       the nav dropdowns (they drop BELOW the header) so they were invisible.
       The topbar/brandbar/nav bars are opaque and cover this wrapper anyway,
       so the glass look is unaffected. */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    font-family: "DM Sans", "Inter", Arial, Helvetica, sans-serif !important;
}

.asc-pest-premium-header__brandbar {
    position: relative !important;
    overflow: hidden !important;
    min-height: 96px !important;
    color: #ffffff !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(157, 0, 61, 0.32), transparent 34%),
        radial-gradient(circle at 90% 8%, rgba(31, 143, 77, 0.24), transparent 36%),
        linear-gradient(135deg, rgba(12, 7, 10, 0.97), rgba(8, 15, 11, 0.96)) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.11) !important;
    isolation: isolate !important;
}

.asc-pest-premium-header__bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}

.asc-pest-premium-header__panel--burgundy {
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: 70% !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.1), transparent 30%),
        linear-gradient(115deg, rgba(197, 22, 70, 0.88), rgba(157, 0, 61, 0.58), rgba(30, 8, 16, 0.28)) !important;
    clip-path: polygon(0 0, 76% 0, 96% 100%, 0 100%) !important;
    opacity: 0.92 !important;
}

.asc-pest-premium-header__panel--green {
    position: absolute !important;
    inset: 0 0 0 auto !important;
    width: 46% !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.13), transparent 34%),
        linear-gradient(135deg, rgba(196, 226, 131, 0.42), rgba(107, 142, 35, 0.44), rgba(19, 97, 46, 0.56)) !important;
    clip-path: polygon(24% 0, 100% 0, 100% 100%, 50% 100%) !important;
    opacity: 0.82 !important;
    filter: drop-shadow(-12px 0 22px rgba(0, 0, 0, 0.28)) !important;
}

.asc-pest-premium-header__bg::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 4 !important;
    opacity: 0.14 !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(112deg, transparent 0%, transparent 36%, rgba(255, 255, 255, 0.12) 48%, rgba(0, 0, 0, 0.24) 62%, transparent 100%) !important;
    background-size: 48px 48px, 48px 48px, 100% 100% !important;
}

.asc-pest-premium-header__orb {
    position: absolute !important;
    right: 18% !important;
    top: -132px !important;
    z-index: 5 !important;
    width: 240px !important;
    height: 240px !important;
    border-radius: 999px !important;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.18), rgba(196, 226, 131, 0.14) 36%, transparent 70%) !important;
    filter: blur(4px) !important;
    opacity: 0.68 !important;
}

.asc-pest-premium-header__line {
    position: absolute !important;
    right: 34% !important;
    top: -40% !important;
    z-index: 6 !important;
    width: 1px !important;
    height: 190% !important;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.34), transparent) !important;
    transform: rotate(-24deg) !important;
    opacity: 0.42 !important;
}

.asc-pest-premium-header__inner {
    position: relative !important;
    z-index: 12 !important;
    min-height: 96px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 28px !important;
}

.asc-pest-premium-brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 15px !important;
    min-width: 0 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.asc-pest-premium-brand__mark {
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 auto !important;
    width: 54px !important;
    height: 54px !important;
    overflow: hidden !important;
    border-radius: 17px !important;
    border: 1px solid rgba(255, 255, 255, 0.32) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    box-shadow:
        0 20px 48px rgba(0, 0, 0, 0.42),
        0 0 34px rgba(196, 226, 131, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.asc-pest-premium-brand__mark img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.asc-pest-premium-brand__copy {
    display: grid !important;
    min-width: 0 !important;
    line-height: 1 !important;
}

.asc-pest-premium-brand__copy strong {
    display: block !important;
    color: #ffffff !important;
    font-size: clamp(23px, 2.1vw, 32px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.058em !important;
    line-height: 0.98 !important;
    text-shadow:
        0 8px 22px rgba(0, 0, 0, 0.55),
        0 2px 4px rgba(0, 0, 0, 0.42) !important;
}

.asc-pest-premium-brand__copy strong em {
    color: #ffffff !important;
    font-style: normal !important;
}

.asc-pest-premium-brand__copy small {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    margin-top: 10px !important;
    padding-left: 15px !important;
    color: rgba(238, 245, 240, 0.88) !important;
    font-size: clamp(10px, 0.9vw, 13px) !important;
    font-weight: 820 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    text-shadow: 0 4px 13px rgba(0, 0, 0, 0.55) !important;
}

.asc-pest-premium-brand__copy small::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0.1em !important;
    bottom: 0.08em !important;
    width: 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #d7f09b, #6b8e23) !important;
    box-shadow: 0 0 16px rgba(196, 226, 131, 0.34) !important;
}

.asc-pest-premium-header__right {
    display: grid !important;
    justify-items: end !important;
    gap: 12px !important;
}

.asc-pest-premium-header__badges {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.asc-pest-premium-header__badges span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 28px !important;
    padding: 7px 11px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.035)) !important;
    color: rgba(255, 255, 255, 0.94) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 12px 30px rgba(0, 0, 0, 0.22) !important;
}

.asc-pest-premium-header__badges span::before {
    content: "" !important;
    display: inline-block !important;
    width: 7px !important;
    height: 7px !important;
    margin-right: 7px !important;
    border-radius: 999px !important;
    background: var(--asc-olive-light) !important;
    box-shadow:
        0 0 0 4px rgba(196, 226, 131, 0.14),
        0 0 18px rgba(196, 226, 131, 0.42) !important;
}

.asc-pest-premium-header__contact {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

.asc-pest-premium-header__phone {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 38px !important;
    padding: 0 13px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.035)) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.asc-pest-premium-header__phone span {
    color: var(--asc-olive-light) !important;
}

.asc-pest-premium-header__quote {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 0 18px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #c4e283, #6b8e23) !important;
    color: #11170b !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 18px 38px rgba(107, 142, 35, 0.26) !important;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease,
        color 180ms ease !important;
}

.asc-pest-premium-header__quote:hover {
    transform: translateY(-2px) !important;
    background: linear-gradient(135deg, #ffffff, #c4e283) !important;
    color: #650028 !important;
    box-shadow: 0 22px 46px rgba(0, 0, 0, 0.32) !important;
}

/* --------------------------------------------------------------------------
   5. Navigation
   -------------------------------------------------------------------------- */

.asc-pest-premium-nav {
    position: relative !important;
    z-index: 30 !important;
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
    background: linear-gradient(180deg, rgba(18, 25, 27, 0.96), rgba(7, 10, 12, 0.98)) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-bottom: 2px solid rgba(157, 0, 61, 0.86) !important;
    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.asc-pest-premium-nav__inner {
    min-height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
}

.asc-pest-premium-nav__menu,
.asc-header-pro__menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 6px 0 !important;
    list-style: none !important;
}

.asc-pest-premium-nav__menu > li,
.asc-header-pro__menu > li {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-pest-premium-nav__menu > li > a,
.asc-header-pro__menu > li > a {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 0 13px !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: rgba(238, 245, 240, 0.86) !important;
    -webkit-text-fill-color: rgba(238, 245, 240, 0.86) !important;
    font-family: "DM Sans", "Inter", Arial, Helvetica, sans-serif !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -0.01em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition:
        color 170ms ease,
        background 170ms ease,
        transform 170ms ease !important;
}

.asc-pest-premium-nav__menu > li > a::after,
.asc-header-pro__menu > li > a::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    bottom: 6px !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--asc-burgundy-bright), var(--asc-olive-light)) !important;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    transition: transform 170ms ease !important;
}

.asc-pest-premium-nav__menu > li > a:hover,
.asc-pest-premium-nav__menu > li.current-menu-item > a,
.asc-pest-premium-nav__menu > li.current_page_item > a,
.asc-header-pro__menu > li > a:hover,
.asc-header-pro__menu > li.current-menu-item > a,
.asc-header-pro__menu > li.current_page_item > a {
    background: linear-gradient(180deg, rgba(157, 0, 61, 0.18), rgba(255, 255, 255, 0.04)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    transform: translateY(-1px) !important;
}

.asc-pest-premium-nav__menu > li > a:hover::after,
.asc-pest-premium-nav__menu > li.current-menu-item > a::after,
.asc-pest-premium-nav__menu > li.current_page_item > a::after,
.asc-header-pro__menu > li > a:hover::after,
.asc-header-pro__menu > li.current-menu-item > a::after,
.asc-header-pro__menu > li.current_page_item > a::after {
    transform: scaleX(1) !important;
}

/* Dropdown arrow */
.asc-pest-premium-nav__menu > li.menu-item-has-children > a,
.asc-header-pro__menu > li.menu-item-has-children > a {
    gap: 6px !important;
}

.asc-pest-premium-nav__menu > li.menu-item-has-children > a::before,
.asc-header-pro__menu > li.menu-item-has-children > a::before {
    content: "▾" !important;
    display: inline-block !important;
    order: 2 !important;
    margin-left: 3px !important;
    color: rgba(196, 226, 131, 0.82) !important;
    -webkit-text-fill-color: rgba(196, 226, 131, 0.82) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    transform: translateY(-1px) !important;
}

/* Hover bridge */
.asc-pest-premium-nav__menu > li.menu-item-has-children::after,
.asc-header-pro__menu > li.menu-item-has-children::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    height: 14px !important;
    background: transparent !important;
    pointer-events: auto !important;
}

/* Dropdown */
.asc-pest-premium-nav__menu .sub-menu,
.asc-header-pro__menu .sub-menu {
    position: absolute !important;
    top: calc(100% + 5px) !important;
    left: 0 !important;
    z-index: 9999999 !important;
    min-width: 250px !important;
    margin: 0 !important;
    padding: 10px !important;
    list-style: none !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, rgba(20, 29, 34, 0.98), rgba(8, 12, 14, 0.98)) !important;
    box-shadow:
        0 26px 70px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    backdrop-filter: blur(18px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(8px) scale(0.98) !important;
    transform-origin: top left !important;
    transition:
        opacity 170ms ease,
        visibility 170ms ease,
        transform 170ms ease !important;
}

.asc-pest-premium-nav__menu .sub-menu::before,
.asc-header-pro__menu .sub-menu::before {
    content: "" !important;
    position: absolute !important;
    top: -6px !important;
    left: 22px !important;
    width: 12px !important;
    height: 12px !important;
    background: #141d22 !important;
    border-left: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
    transform: rotate(45deg) !important;
    pointer-events: none !important;
}

.asc-pest-premium-nav__menu li.menu-item-has-children:hover > .sub-menu,
.asc-pest-premium-nav__menu li.menu-item-has-children:focus-within > .sub-menu,
.asc-header-pro__menu li.menu-item-has-children:hover > .sub-menu,
.asc-header-pro__menu li.menu-item-has-children:focus-within > .sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.asc-pest-premium-nav__menu .sub-menu li,
.asc-header-pro__menu .sub-menu li {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-pest-premium-nav__menu .sub-menu a,
.asc-header-pro__menu .sub-menu a {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 41px !important;
    padding: 10px 12px 10px 35px !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: rgba(238, 245, 240, 0.86) !important;
    -webkit-text-fill-color: rgba(238, 245, 240, 0.86) !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition:
        background 160ms ease,
        color 160ms ease,
        transform 160ms ease !important;
}

.asc-pest-premium-nav__menu .sub-menu a::before,
.asc-header-pro__menu .sub-menu a::before {
    content: "" !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 999px !important;
    background: rgba(196, 226, 131, 0.38) !important;
    transform: translateY(-50%) !important;
}

.asc-pest-premium-nav__menu .sub-menu a::after,
.asc-header-pro__menu .sub-menu a::after {
    display: none !important;
}

.asc-pest-premium-nav__menu .sub-menu a:hover,
.asc-header-pro__menu .sub-menu a:hover {
    background: rgba(157, 0, 61, 0.18) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    transform: translateX(2px) !important;
}

.asc-pest-premium-nav__menu .sub-menu a:hover::before,
.asc-header-pro__menu .sub-menu a:hover::before {
    background: var(--asc-olive-light) !important;
}

/* --------------------------------------------------------------------------
   6. Mobile header / menu
   -------------------------------------------------------------------------- */

.asc-pest-premium-header__toggle,
.asc-header-pro__toggle {
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    width: 43px !important;
    height: 43px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    border-radius: 13px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18) !important;
    cursor: pointer !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

.asc-pest-premium-header__toggle span,
.asc-header-pro__toggle span {
    display: block !important;
    width: 19px !important;
    height: 2px !important;
    margin: 3.5px auto !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    transition:
        transform 180ms ease,
        opacity 180ms ease !important;
}

.asc-pest-premium-header__toggle[aria-expanded="true"] span:nth-child(1),
.asc-header-pro__toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(5.5px) rotate(45deg) !important;
}

.asc-pest-premium-header__toggle[aria-expanded="true"] span:nth-child(2),
.asc-header-pro__toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0 !important;
}

.asc-pest-premium-header__toggle[aria-expanded="true"] span:nth-child(3),
.asc-header-pro__toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-5.5px) rotate(-45deg) !important;
}

.asc-pest-premium-mobile,
.asc-header-pro__mobile {
    position: relative !important;
    z-index: 40 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: linear-gradient(180deg, rgba(20, 29, 34, 0.98), rgba(8, 12, 14, 0.98)) !important;
    padding: 12px 16px 16px !important;
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.42) !important;
}

.asc-pest-premium-mobile[hidden],
.asc-header-pro__mobile[hidden] {
    display: none !important;
}

.asc-pest-premium-mobile__menu,
.asc-header-pro__mobile-menu {
    display: grid !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-pest-premium-mobile__menu li,
.asc-header-pro__mobile-menu li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-pest-premium-mobile__menu a,
.asc-header-pro__mobile-menu a {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    padding: 10px 13px !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 820 !important;
    text-decoration: none !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035) !important;
}

.asc-pest-premium-mobile__menu a:hover,
.asc-header-pro__mobile-menu a:hover {
    background: rgba(157, 0, 61, 0.24) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.asc-pest-premium-mobile__menu .sub-menu,
.asc-header-pro__mobile-menu .sub-menu {
    display: grid !important;
    gap: 3px !important;
    margin: 4px 0 8px 16px !important;
    padding: 0 0 0 10px !important;
    border-left: 2px solid rgba(157, 0, 61, 0.22) !important;
    list-style: none !important;
}

.asc-pest-premium-mobile__menu .sub-menu a,
.asc-header-pro__mobile-menu .sub-menu a {
    min-height: 36px !important;
    color: rgba(215, 222, 227, 0.82) !important;
    -webkit-text-fill-color: rgba(215, 222, 227, 0.82) !important;
    font-size: 13px !important;
    font-weight: 720 !important;
}

/* --------------------------------------------------------------------------
   7. Buttons
   -------------------------------------------------------------------------- */

.asc-btn {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 3.25rem !important;
    padding: 0.9rem 1.25rem !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    font-size: 0.9rem !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease,
        color 180ms ease !important;
}

.asc-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255, 255, 255, 0.24),
        transparent
    );
    transform: translateX(-120%);
    transition: transform 520ms ease;
}

.asc-btn:hover {
    transform: translateY(-2px) !important;
}

.asc-btn:hover::before {
    transform: translateX(120%);
}

.asc-btn--primary {
    background: linear-gradient(135deg, var(--asc-burgundy-bright), var(--asc-burgundy-dark)) !important;
    color: #ffffff !important;
    box-shadow:
        0 18px 44px rgba(157, 0, 61, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

.asc-btn--ghost,
.asc-btn--ghost-light {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.035)) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

.asc-btn--whatsapp {
    background: linear-gradient(135deg, #25d366, var(--asc-green-light)) !important;
    color: #052e16 !important;
}

.asc-btn--light {
    background: linear-gradient(135deg, #ffffff, var(--asc-olive-light)) !important;
    color: var(--asc-burgundy-dark) !important;
}

/* --------------------------------------------------------------------------
   8. Hero
   -------------------------------------------------------------------------- */

.asc-hero {
    position: relative !important;
    isolation: isolate !important;
    min-height: 720px !important;
    display: flex !important;
    align-items: center !important;
    padding: clamp(4.5rem, 8vw, 7rem) 0 !important;
    overflow: hidden !important;
    color: #ffffff !important;
    background:
        radial-gradient(circle at 15% 18%, rgba(157, 0, 61, 0.34), transparent 32%),
        radial-gradient(circle at 82% 18%, rgba(31, 143, 77, 0.25), transparent 34%),
        linear-gradient(135deg, #050608 0%, #0a0f12 48%, #050608 100%) !important;
}

.asc-hero__bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: -2 !important;
    background:
        linear-gradient(90deg, rgba(5, 6, 8, 0.52) 0%, rgba(5, 6, 8, 0.22) 48%, rgba(5, 6, 8, 0) 100%),
        linear-gradient(180deg, rgba(5, 6, 8, 0) 60%, rgba(5, 6, 8, 0.34) 100%),
        url("../images/pexels-4097848.jpg") center / cover no-repeat !important;
    opacity: 1 !important;
    filter: saturate(1.12) contrast(1.04) brightness(1.1) !important;
}

.asc-hero::before {
    content: "";
    position: absolute;
    inset: auto -12% -30% auto;
    z-index: -1;
    width: 42rem;
    height: 42rem;
    border-radius: 999px;
    background: rgba(196, 226, 131, 0.12);
    filter: blur(22px);
}

.asc-hero::after {
    content: "";
    position: absolute;
    right: -150px;
    top: 115px;
    z-index: -1;
    width: 600px;
    height: 410px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 34px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.015)),
        radial-gradient(circle at 30% 20%, rgba(196, 226, 131, 0.18), transparent 38%),
        radial-gradient(circle at 72% 70%, rgba(157, 0, 61, 0.18), transparent 36%);
    box-shadow:
        0 44px 130px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transform: rotate(-9deg);
    opacity: 0.46;
    backdrop-filter: blur(12px);
}

.asc-hero__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.72fr) !important;
    gap: clamp(2rem, 5vw, 4rem) !important;
    align-items: center !important;
}

.asc-hero__content {
    position: relative !important;
    max-width: 860px !important;
}

.asc-hero__lead {
    max-width: 720px !important;
    margin: 0 0 1.35rem !important;
    color: rgba(245, 249, 247, 0.9) !important;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.52) !important;
}

.asc-checks {
    display: grid !important;
    gap: 0.72rem !important;
    margin: 1.25rem 0 1.85rem !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-checks li {
    position: relative !important;
    width: fit-content !important;
    padding: 0.68rem 1rem 0.68rem 2.78rem !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.035)),
        rgba(5, 6, 8, 0.48) !important;
    color: rgba(245, 249, 247, 0.94) !important;
    font-size: 0.91rem !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 14px 34px rgba(0, 0, 0, 0.20) !important;
}

.asc-checks li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0.78rem !important;
    top: 50% !important;
    display: inline-grid !important;
    place-items: center !important;
    width: 1.35rem !important;
    height: 1.35rem !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--asc-green-light), var(--asc-green)) !important;
    color: #ffffff !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    transform: translateY(-50%) !important;
    box-shadow: 0 0 20px rgba(31, 143, 77, 0.42) !important;
}

.asc-hero__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.8rem !important;
    margin-bottom: 1rem !important;
}

.asc-microcopy {
    margin: 0 !important;
    color: rgba(245, 249, 247, 0.68) !important;
    font-size: 0.9rem !important;
}

/* --------------------------------------------------------------------------
   9. Hero proof card
   -------------------------------------------------------------------------- */

.asc-proof {
    position: relative !important;
    padding: 1.35rem !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 30px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.035)),
        rgba(8, 12, 14, 0.68) !important;
    box-shadow:
        0 36px 100px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(22px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(130%) !important;
    overflow: hidden !important;
    transform: translateZ(0);
}

.asc-proof::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 0%, rgba(196, 226, 131, 0.16), transparent 35%),
        radial-gradient(circle at 86% 18%, rgba(157, 0, 61, 0.20), transparent 34%);
    pointer-events: none;
}

.asc-proof > * {
    position: relative;
    z-index: 1;
}

.asc-proof:hover {
    border-color: rgba(196, 226, 131, 0.28) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04)),
        rgba(8, 12, 14, 0.72) !important;
}

.asc-proof__head {
    display: grid !important;
    gap: 0.15rem !important;
    padding-bottom: 1rem !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.asc-proof__head span {
    color: var(--asc-olive-light) !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

.asc-proof__head strong {
    color: #ffffff !important;
    font-size: 1.35rem !important;
    font-weight: 950 !important;
    line-height: 1.1 !important;
}

.asc-process {
    display: grid !important;
    gap: 0.85rem !important;
    margin: 1rem 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.asc-process li {
    padding: 1rem !important;
    border: 1px solid rgba(255, 255, 255, 0.11) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.028)),
        rgba(5, 6, 8, 0.36) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.asc-process span {
    color: var(--asc-gold) !important;
    font-size: 0.76rem !important;
    font-weight: 950 !important;
}

.asc-process strong {
    display: block !important;
    color: #ffffff !important;
    font-size: 1.02rem !important;
    font-weight: 900 !important;
}

.asc-process p {
    margin: 0.25rem 0 0 !important;
    color: rgba(214, 221, 226, 0.78) !important;
    font-size: 0.9rem !important;
    line-height: 1.55 !important;
}

.asc-proof__stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.65rem !important;
}

.asc-proof__stats div {
    padding: 0.85rem !important;
    border: 1px solid rgba(255, 255, 255, 0.11) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.028)),
        rgba(5, 6, 8, 0.36) !important;
    text-align: center !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.asc-proof__stats strong {
    display: block !important;
    color: #ffffff !important;
    font-weight: 950 !important;
}

.asc-proof__stats span {
    display: block !important;
    color: rgba(214, 221, 226, 0.72) !important;
    font-size: 0.73rem !important;
}

/* --------------------------------------------------------------------------
   10. Sections
   -------------------------------------------------------------------------- */

.asc-section,
.asc-section--soft {
    position: relative !important;
    padding: clamp(4.5rem, 7.5vw, 7rem) 0 !important;
    background:
        radial-gradient(circle at 8% 0%, rgba(157, 0, 61, 0.13), transparent 30%),
        radial-gradient(circle at 90% 0%, rgba(31, 143, 77, 0.10), transparent 30%),
        linear-gradient(180deg, #050608 0%, #0a0f12 100%) !important;
    color: #ffffff !important;
}

.asc-section:nth-of-type(even) {
    background:
        radial-gradient(circle at 88% 0%, rgba(107, 142, 35, 0.11), transparent 30%),
        radial-gradient(circle at 14% 0%, rgba(157, 0, 61, 0.10), transparent 30%),
        linear-gradient(180deg, #080c0e 0%, #050608 100%) !important;
}

.asc-section h2 {
    position: relative !important;
}

.asc-section h2::after {
    content: "" !important;
    display: block !important;
    width: 4.2rem !important;
    height: 4px !important;
    margin-top: 1rem !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, var(--asc-burgundy-bright), var(--asc-green-light), var(--asc-olive-light)) !important;
    box-shadow: 0 0 26px rgba(196, 226, 131, 0.18) !important;
}

/* --------------------------------------------------------------------------
   10b. Section media (free-licence photography)
   -------------------------------------------------------------------------- */

.asc-media {
    position: relative !important;
    margin: 0 0 2.25rem !important;
    border: 1px solid var(--asc-line) !important;
    border-radius: var(--asc-radius-lg) !important;
    overflow: hidden !important;
    background: rgba(8, 12, 14, 0.6) !important;
    box-shadow: var(--asc-shadow-card) !important;
    transform: translateZ(0) !important;
}

.asc-media img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 7 !important;
    object-fit: cover !important;
    filter: saturate(1.06) contrast(1.04) brightness(0.96) !important;
    transition: transform 600ms ease !important;
}

.asc-media:hover img {
    transform: scale(1.035) !important;
}

.asc-media::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg, transparent 38%, rgba(5, 6, 8, 0.72) 100%),
        radial-gradient(circle at 85% 12%, rgba(157, 0, 61, 0.22), transparent 42%) !important;
}

.asc-media figcaption {
    position: absolute !important;
    left: 1.1rem !important;
    right: 1.1rem !important;
    bottom: 0.95rem !important;
    z-index: 1 !important;
    color: rgba(245, 249, 247, 0.92) !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.6) !important;
}

.asc-media figcaption::before {
    content: "" !important;
    display: inline-block !important;
    width: 8px !important;
    height: 8px !important;
    margin-right: 8px !important;
    border-radius: 999px !important;
    background: var(--asc-olive-light) !important;
    box-shadow: 0 0 14px rgba(196, 226, 131, 0.5) !important;
}

@media (max-width: 640px) {
    .asc-media img {
        aspect-ratio: 4 / 3 !important;
    }
}

/* Grids */
.asc-stat-grid,
.asc-card-grid,
.asc-industry-grid,
.asc-area-grid {
    display: grid !important;
    gap: 1rem !important;
}

.asc-stat-grid {
    grid-template-columns: repeat(4, 1fr) !important;
}

.asc-card-grid {
    grid-template-columns: repeat(4, 1fr) !important;
}

.asc-industry-grid,
.asc-area-grid {
    grid-template-columns: repeat(3, 1fr) !important;
}

/* Cards */
.asc-stat-grid article,
.asc-service-card,
.asc-industry-card,
.asc-area-card {
    position: relative !important;
    overflow: hidden !important;
    padding: 1.35rem !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 26px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.032)),
        rgba(10, 15, 18, 0.72) !important;
    color: #ffffff !important;
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    backdrop-filter: blur(18px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease,
        background 180ms ease !important;
}

.asc-stat-grid article::before,
.asc-service-card::before,
.asc-industry-card::before,
.asc-area-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, var(--asc-burgundy-bright), var(--asc-olive-light), transparent) !important;
    opacity: 0.72 !important;
    transition: opacity 180ms ease !important;
}

.asc-stat-grid article:hover,
.asc-service-card:hover,
.asc-industry-card:hover,
.asc-area-card:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(196, 226, 131, 0.28) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.038)),
        rgba(10, 15, 18, 0.78) !important;
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.46),
        0 0 36px rgba(157, 0, 61, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
}

.asc-card-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    margin-bottom: 1rem !important;
    border: 1px solid rgba(196, 226, 131, 0.20) !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, rgba(31, 143, 77, 0.30), rgba(107, 142, 35, 0.22)) !important;
    color: #d7f09b !important;
    font-weight: 950 !important;
    box-shadow:
        0 0 24px rgba(31, 143, 77, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.asc-stat-grid strong {
    display: block !important;
    color: var(--asc-olive-light) !important;
    font-size: 1.25rem !important;
    font-weight: 950 !important;
}

.asc-stat-grid span,
.asc-service-card p,
.asc-industry-card p,
.asc-area-card p {
    color: rgba(214, 221, 226, 0.78) !important;
}

.asc-service-card h3,
.asc-industry-card h3,
.asc-area-card h3 {
    color: #ffffff !important;
}

.asc-service-card p,
.asc-industry-card p,
.asc-area-card p {
    margin: 0 !important;
    font-size: 0.94rem !important;
    line-height: 1.65 !important;
}

.asc-area-card span {
    display: inline-block !important;
    margin-bottom: 0.65rem !important;
    color: var(--asc-olive-light) !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

.asc-area-card--primary {
    background:
        radial-gradient(circle at 22% 0%, rgba(196, 226, 131, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(157, 0, 61, 0.88), rgba(101, 0, 40, 0.78), rgba(8, 12, 14, 0.84)) !important;
    border-color: rgba(197, 22, 70, 0.38) !important;
}

.asc-area-card--primary span,
.asc-area-card--primary h3,
.asc-area-card--primary p {
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   11. Compliance and contact sections
   -------------------------------------------------------------------------- */

.asc-compliance,
.asc-contact {
    position: relative !important;
    overflow: hidden !important;
    padding: clamp(4.5rem, 7.5vw, 7rem) 0 !important;
    color: #ffffff !important;
    background:
        radial-gradient(circle at 18% 20%, rgba(196, 226, 131, 0.14), transparent 30%),
        radial-gradient(circle at 82% 78%, rgba(157, 0, 61, 0.20), transparent 28%),
        linear-gradient(135deg, #050608, #11170b 48%, #1a050b 100%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.asc-compliance::before,
.asc-contact::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 20%, rgba(196, 226, 131, 0.12), transparent 28%),
        radial-gradient(circle at 82% 70%, rgba(157, 0, 61, 0.24), transparent 26%);
}

.asc-compliance__inner,
.asc-contact__inner {
    position: relative !important;
    z-index: 1 !important;
}

.asc-compliance__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 2rem !important;
    align-items: center !important;
    padding: clamp(1.5rem, 3vw, 2.4rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 32px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)),
        rgba(5, 6, 8, 0.46) !important;
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    backdrop-filter: blur(18px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

.asc-compliance h2,
.asc-contact h2 {
    color: #ffffff !important;
}

.asc-compliance p,
.asc-contact p {
    max-width: 760px !important;
    color: rgba(245, 249, 247, 0.84) !important;
}

.asc-contact {
    text-align: center !important;
}

.asc-contact__inner {
    display: grid !important;
    justify-items: center !important;
}

.asc-contact__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.8rem !important;
}

/* --------------------------------------------------------------------------
   12. FAQ
   -------------------------------------------------------------------------- */

.asc-faq {
    display: grid !important;
    gap: 0.8rem !important;
    max-width: 900px !important;
}

.asc-faq details {
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    border-radius: 20px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.032)),
        rgba(10, 15, 18, 0.76) !important;
    color: #ffffff !important;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease !important;
}

.asc-faq details:hover,
.asc-faq details[open] {
    border-color: rgba(196, 226, 131, 0.28) !important;
    box-shadow:
        0 24px 70px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

.asc-faq details[open] {
    transform: translateY(-2px) !important;
}

.asc-faq summary {
    position: relative !important;
    list-style: none !important;
    padding: 1.1rem 3rem 1.1rem 1.2rem !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

.asc-faq summary::-webkit-details-marker {
    display: none !important;
}

.asc-faq summary::after {
    content: "+" !important;
    position: absolute !important;
    right: 1.2rem !important;
    top: 50% !important;
    display: inline-grid !important;
    place-items: center !important;
    width: 1.55rem !important;
    height: 1.55rem !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(31, 143, 77, 0.24), rgba(196, 226, 131, 0.14)) !important;
    color: var(--asc-olive-light) !important;
    font-weight: 950 !important;
    transform: translateY(-50%) !important;
}

.asc-faq details[open] summary::after {
    content: "−" !important;
    background: var(--asc-burgundy-bright) !important;
    color: #ffffff !important;
}

.asc-faq details p {
    margin: 0 !important;
    padding: 0 1.2rem 1.2rem !important;
    color: rgba(214, 221, 226, 0.78) !important;
}

/* --------------------------------------------------------------------------
   13. Footer
   -------------------------------------------------------------------------- */

.asc-footer {
    padding: 2rem 0 !important;
    color: rgba(214, 221, 226, 0.72) !important;
    background: #030405 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
    text-align: center !important;
}

.asc-footer p {
    margin: 0.35rem 0 !important;
}

.asc-footer a {
    color: #ffffff !important;
    font-weight: 850 !important;
}

/* --------------------------------------------------------------------------
   14. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1120px) {
    .asc-pest-premium-header__badges {
        display: none !important;
    }

    .asc-card-grid,
    .asc-stat-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .asc-industry-grid,
    .asc-area-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .asc-hero__inner {
        grid-template-columns: 1fr !important;
    }

    .asc-proof {
        max-width: 760px !important;
    }
}

@media (max-width: 920px) {
    .asc-pest-premium-header__brandbar {
        min-height: 84px !important;
    }

    .asc-pest-premium-header__panel--burgundy {
        width: 100% !important;
        clip-path: none !important;
    }

    .asc-pest-premium-header__panel--green {
        width: 46% !important;
        opacity: 0.48 !important;
        clip-path: polygon(32% 0, 100% 0, 100% 100%, 62% 100%) !important;
    }

    .asc-pest-premium-header__inner {
        min-height: 84px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 14px !important;
    }

    .asc-pest-premium-nav {
        display: none !important;
    }

    .asc-pest-premium-header__right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;
    }

    .asc-pest-premium-header__phone {
        display: none !important;
    }

    .asc-pest-premium-header__toggle,
    .asc-header-pro__toggle {
        display: inline-block !important;
    }

    .asc-pest-premium-brand__mark {
        width: 48px !important;
        height: 48px !important;
        border-radius: 15px !important;
        font-size: 13px !important;
    }

    .asc-pest-premium-brand__copy strong {
        font-size: clamp(21px, 5vw, 28px) !important;
    }

    .asc-pest-premium-brand__copy small {
        margin-top: 8px !important;
        font-size: 11px !important;
    }

    .asc-compliance__inner {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 760px) {
    .asc-container {
        width: min(100% - 28px, 1200px) !important;
    }

    .asc-landing h1 {
        max-width: 100% !important;
        font-size: clamp(2.15rem, 10vw, 3.45rem) !important;
        line-height: 1 !important;
        letter-spacing: -0.045em !important;
    }

    .asc-landing h2 {
        font-size: clamp(1.85rem, 8vw, 2.7rem) !important;
    }

    .asc-hero {
        min-height: auto !important;
        padding: 4.25rem 0 !important;
    }

    .asc-hero__bg {
        background:
            linear-gradient(180deg, rgba(5, 6, 8, 0.76), rgba(5, 6, 8, 0.78)),
            url("https://ascpestcontrol.co.za/wp-content/plugins/ASC-Pest_pages/assets/images/hero-asc.jpg") center / cover no-repeat !important;
        filter: saturate(1.06) contrast(1.04) brightness(0.82) !important;
    }

    .asc-hero::after {
        display: none !important;
    }

    .asc-checks li {
        width: 100% !important;
        border-radius: 18px !important;
    }

    .asc-hero__actions,
    .asc-contact__actions {
        display: grid !important;
        width: 100% !important;
    }

    .asc-btn {
        width: 100% !important;
    }

    .asc-card-grid,
    .asc-stat-grid,
    .asc-industry-grid,
    .asc-area-grid {
        grid-template-columns: 1fr !important;
    }

    .asc-proof__stats {
        grid-template-columns: 1fr !important;
    }

    .asc-service-card,
    .asc-industry-card,
    .asc-area-card,
    .asc-stat-grid article {
        border-radius: 22px !important;
    }
}

@media (max-width: 640px) {
    .asc-pest-premium-header__brandbar {
        min-height: 74px !important;
    }

    .asc-pest-premium-header__inner {
        min-height: 74px !important;
    }

    .asc-pest-premium-brand {
        gap: 10px !important;
    }

    .asc-pest-premium-brand__mark {
        width: 41px !important;
        height: 41px !important;
        border-radius: 13px !important;
        font-size: 11px !important;
    }

    .asc-pest-premium-brand__copy strong {
        font-size: 19px !important;
        line-height: 1 !important;
    }

    .asc-pest-premium-brand__copy small {
        display: none !important;
    }

    .asc-pest-premium-header__quote {
        display: none !important;
    }

    .asc-pest-premium-header__toggle,
    .asc-header-pro__toggle {
        width: 42px !important;
        height: 42px !important;
    }

    .asc-landing h1 {
        font-size: clamp(2rem, 11vw, 3rem) !important;
    }

    .asc-section,
    .asc-section--soft,
    .asc-compliance,
    .asc-contact {
        padding: 4rem 0 !important;
    }
}

@media (max-width: 390px) {
    .asc-pest-premium-brand__copy strong {
        font-size: 17px !important;
    }

    .asc-pest-premium-brand__mark {
        width: 39px !important;
        height: 39px !important;
    }

    .asc-landing h1 {
        font-size: 2rem !important;
    }
}

/* --------------------------------------------------------------------------
   15. Motion preferences
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .asc-landing *,
    .asc-landing *::before,
    .asc-landing *::after {
        transition: none !important;
        animation: none !important;
        scroll-behavior: auto !important;
    }
}
/* ==========================================================================
   Premium Neon Glass Cards Upgrade
   ========================================================================== */

.asc-stat-grid article,
.asc-service-card,
.asc-industry-card,
.asc-area-card {
    position: relative !important;
    overflow: visible !important;
    isolation: isolate !important;
    min-height: 230px !important;
    padding: 1.65rem !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    border-radius: 18px !important;
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.16) 0%,
            rgba(255, 255, 255, 0.075) 42%,
            rgba(255, 255, 255, 0.035) 100%
        ) !important;
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.46),
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        inset 0 -1px 0 rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(22px) saturate(155%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(155%) !important;
    transform: translateZ(0) !important;
    transition:
        transform 240ms ease,
        box-shadow 240ms ease,
        border-color 240ms ease,
        background 240ms ease !important;
}

.asc-stat-grid article::after,
.asc-service-card::after,
.asc-industry-card::after,
.asc-area-card::after {
    content: "" !important;
    position: absolute !important;
    z-index: -2 !important;
    left: 50% !important;
    top: -34px !important;
    width: 46% !important;
    height: calc(100% + 88px) !important;
    border-radius: 4px !important;
    background:
        linear-gradient(
            180deg,
            rgba(196, 226, 131, 0.05),
            rgba(196, 226, 131, 0.92) 48%,
            rgba(31, 143, 77, 0.72) 100%
        ) !important;
    transform: translateX(-50%) skewX(-13deg) !important;
    box-shadow:
        0 0 46px rgba(196, 226, 131, 0.34),
        0 44px 70px rgba(31, 143, 77, 0.22) !important;
    opacity: 0.88 !important;
    pointer-events: none !important;
    transition:
        transform 260ms ease,
        opacity 260ms ease,
        filter 260ms ease !important;
}

.asc-stat-grid article::before,
.asc-service-card::before,
.asc-industry-card::before,
.asc-area-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    height: auto !important;
    border-radius: inherit !important;
    background:
        linear-gradient(
            112deg,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.055) 32%,
            transparent 47%,
            rgba(0, 0, 0, 0.20) 100%
        ),
        radial-gradient(
            circle at 18% 14%,
            rgba(255, 255, 255, 0.14),
            transparent 34%
        ) !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

.asc-stat-grid article > *,
.asc-service-card > *,
.asc-industry-card > *,
.asc-area-card > * {
    position: relative !important;
    z-index: 2 !important;
}

.asc-stat-grid article,
.asc-service-card,
.asc-industry-card,
.asc-area-card {
    margin-top: 2.2rem !important;
}

.asc-stat-grid article .asc-card-icon,
.asc-service-card .asc-card-icon,
.asc-industry-card .asc-card-icon,
.asc-area-card .asc-card-icon {
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.22),
            rgba(255, 255, 255, 0.06)
        ) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

.asc-stat-grid strong,
.asc-service-card h3,
.asc-industry-card h3,
.asc-area-card h3 {
    color: #ffffff !important;
    text-shadow: 0 4px 18px rgba(0, 0, 0, 0.48) !important;
}

.asc-stat-grid span,
.asc-service-card p,
.asc-industry-card p,
.asc-area-card p {
    color: rgba(245, 249, 247, 0.84) !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.38) !important;
}

.asc-stat-grid article:hover,
.asc-service-card:hover,
.asc-industry-card:hover,
.asc-area-card:hover {
    transform: translateY(-12px) scale(1.015) !important;
    border-color: rgba(255, 255, 255, 0.34) !important;
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.20) 0%,
            rgba(255, 255, 255, 0.095) 45%,
            rgba(255, 255, 255, 0.045) 100%
        ) !important;
    box-shadow:
        0 42px 110px rgba(0, 0, 0, 0.58),
        0 0 48px rgba(196, 226, 131, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
}

.asc-stat-grid article:hover::after,
.asc-service-card:hover::after,
.asc-industry-card:hover::after,
.asc-area-card:hover::after {
    opacity: 1 !important;
    filter: saturate(1.25) brightness(1.12) !important;
    transform: translateX(-50%) skewX(-13deg) translateY(-7px) !important;
}

/* ==========================================================================
   ASC Service Circle Wheel (kept minimal; superseded by compact-grid layer)
   ========================================================================== */

#services {
    overflow: hidden !important;
}

#services .asc-service-wheel {
    position: relative !important;
    display: block !important;
    width: min(980px, 100%) !important;
    margin: 4rem auto 0 !important;
}

/* ==========================================================================
   ASC JS Life Layer
   ========================================================================== */

.asc-header-pro.is-scrolled {
    background: rgba(3, 4, 5, 0.88) !important;
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.58),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.asc-header-pro.is-scrolled .asc-pest-premium-header__brandbar {
    min-height: 82px !important;
}

.asc-header-pro.is-scrolled .asc-pest-premium-header__inner {
    min-height: 82px !important;
}

.asc-pest-premium-nav__menu a.is-active,
.asc-header-pro__mobile-menu a.is-active {
    background: linear-gradient(180deg, rgba(157, 0, 61, 0.24), rgba(255, 255, 255, 0.055)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.asc-pest-premium-nav__menu a.is-active::after {
    transform: scaleX(1) !important;
}

.asc-js-reveal {
    opacity: 1 !important;
    transform: none !important;
}

.asc-hero__bg {
    transform:
        translate3d(0, var(--asc-hero-y, 0px), 0)
        scale(var(--asc-hero-scale, 1)) !important;
    transform-origin: center center !important;
}

/* Pointer glow (created by JS elsewhere; harmless if absent) */
.asc-pointer-glow {
    display: none !important;
}

.asc-landing > *:not(.asc-pointer-glow):not(.asc-pest-premium-header):not(.asc-to-top):not(.asc-scroll-progress) {
    position: relative !important;
    z-index: 3 !important;
}

.asc-landing.asc-js-loaded {
    animation: none !important;
}

.asc-faq details {
    transition:
        transform 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease,
        background 220ms ease !important;
}

.asc-faq details[open] {
    transform: translateY(-3px) !important;
}

/* ==========================================================================
   ELEVATION LAYER 2.0 -- typography + palette polish
   ========================================================================== */

.asc-landing {
    --asc-font-display: "Sora", "DM Sans", "Inter", Arial, Helvetica, sans-serif;
    --asc-champagne: #e6c585;
    --asc-rose: #e0436f;
    --asc-sage: #9bc06a;
}

.asc-landing h1,
.asc-landing h2,
.asc-landing h3,
.asc-pest-premium-brand__copy strong,
.asc-proof__head strong,
.asc-faq summary {
    font-family: var(--asc-font-display) !important;
}

.asc-landing h1 {
    letter-spacing: -0.055em !important;
}

.asc-landing .asc-hl {
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
}

.asc-eyebrow::before {
    animation: none !important;
}

.asc-section h2::after {
    background-size: 200% 100% !important;
}

.asc-btn--primary {
    background:
        linear-gradient(135deg, #e0436f 0%, var(--asc-burgundy) 46%, var(--asc-burgundy-dark) 100%) !important;
}

.asc-btn--whatsapp {
    background: linear-gradient(135deg, #2af07a, #1faa59) !important;
    color: #04210f !important;
}

.asc-btn--primary:hover {
    box-shadow:
        0 26px 60px rgba(157, 0, 61, 0.45),
        0 0 30px rgba(224, 67, 111, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.asc-landing a:focus-visible,
.asc-landing button:focus-visible,
.asc-landing summary:focus-visible {
    outline: 2px solid var(--asc-olive-light) !important;
    outline-offset: 3px !important;
    border-radius: 12px !important;
}

.asc-footer {
    position: relative !important;
    overflow: hidden !important;
    padding: 2.6rem 0 2.2rem !important;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(157, 0, 61, 0.18), transparent 60%),
        #030405 !important;
}

.asc-footer::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, var(--asc-burgundy-bright), var(--asc-green-light), var(--asc-olive-light), transparent) !important;
    opacity: 0.7 !important;
}

.asc-footer p:first-child strong {
    font-family: var(--asc-font-display) !important;
    font-size: 1.05rem !important;
    color: #ffffff !important;
}

.asc-footer a {
    transition: color 160ms ease !important;
}

.asc-footer a:hover {
    color: var(--asc-olive-light) !important;
}

/* ==========================================================================
   ELEVATION LAYER 6.0 -- premium dark section backgrounds
   ========================================================================== */

#compliance.asc-compliance:not(#zzz) {
    background:
        radial-gradient(100% 80% at 50% -18%, rgba(255, 255, 255, 0.045), transparent 56%),
        linear-gradient(180deg, #0c0c0e 0%, #08080a 52%, #0b0b0d 100%) !important;
}

#compliance.asc-compliance:not(#zzz)::before {
    display: none !important;
}

#areas.asc-section:not(#zzz) {
    background:
        radial-gradient(100% 80% at 50% -16%, rgba(255, 255, 255, 0.04), transparent 56%),
        linear-gradient(180deg, #0b0b0d 0%, #070708 52%, #0a0a0c 100%) !important;
}

#areas.asc-section:not(#zzz)::before {
    display: none !important;
}

/* ==========================================================================
   ELEVATION LAYER 7.0 -- site-wide clean premium dark
   ========================================================================== */

.asc-section:not(#zzz),
.asc-section--soft:not(#zzz) {
    background:
        radial-gradient(100% 80% at 50% -12%, rgba(255, 255, 255, 0.035), transparent 56%),
        linear-gradient(180deg, #0b0b0d 0%, #070708 52%, #0a0a0c 100%) !important;
}

#contact.asc-contact:not(#zzz) {
    background:
        radial-gradient(100% 80% at 50% -12%, rgba(255, 255, 255, 0.04), transparent 56%),
        linear-gradient(180deg, #0c0c0e 0%, #08080a 52%, #0b0b0d 100%) !important;
}

#contact.asc-contact:not(#zzz)::before {
    display: none !important;
}

#about .asc-stat-grid article:not(#zzz)::after {
    display: none !important;
}

#about .asc-stat-grid article:not(#zzz) {
    margin-top: 0 !important;
    min-height: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    background:
        linear-gradient(160deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
        rgba(9, 13, 16, 0.74) !important;
    box-shadow:
        0 22px 50px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#about .asc-stat-grid article:hover:not(#zzz) {
    border-color: rgba(255, 255, 255, 0.20) !important;
    box-shadow:
        0 34px 70px rgba(0, 0, 0, 0.44),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

#about .asc-stat-grid article:not(#zzz) strong {
    color: #ffffff !important;
}

/* ==========================================================================
   ELEVATION LAYER 8.0 -- typography & spacing polish
   ========================================================================== */

.asc-landing h1 {
    font-family: var(--asc-font-display) !important;
    font-weight: 800 !important;
    font-size: clamp(2.6rem, 5vw, 4.4rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.03em !important;
    margin: 0 0 1.4rem !important;
}

.asc-landing h2 {
    font-family: var(--asc-font-display) !important;
    font-weight: 800 !important;
    font-size: clamp(1.9rem, 3.2vw, 2.95rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 1.05rem !important;
}

.asc-landing h3 {
    font-family: var(--asc-font-display) !important;
    font-weight: 700 !important;
    font-size: clamp(1.1rem, 1.4vw, 1.28rem) !important;
    line-height: 1.22 !important;
    letter-spacing: -0.015em !important;
}

.asc-eyebrow {
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.16em !important;
    margin: 0 0 1.05rem !important;
    padding: 8px 13px !important;
}

.asc-hero__lead,
.asc-section__lead {
    font-size: clamp(1.02rem, 1.3vw, 1.18rem) !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
}

.asc-section__lead {
    max-width: 760px !important;
    margin: 0 0 1.7rem !important;
}

.asc-landing p {
    line-height: 1.65 !important;
}

.asc-section:not(#zzz),
.asc-section--soft:not(#zzz) {
    padding-top: clamp(4.25rem, 7vw, 6.5rem) !important;
    padding-bottom: clamp(4.25rem, 7vw, 6.5rem) !important;
}

#industries .asc-industry-grid:not(#zzz),
#areas .asc-area-grid:not(#zzz),
#local-pest-control .asc-content-grid {
    margin-top: 2.6rem !important;
}

#industries .asc-industry-card:not(#zzz),
#areas .asc-area-card:not(#zzz) {
    padding: 1.75rem !important;
}

#industries .asc-industry-card:not(#zzz) h3,
#areas .asc-area-card:not(#zzz) h3 {
    font-size: 1.2rem !important;
    line-height: 1.2 !important;
    margin: 0 0 0.65rem !important;
}

#areas .asc-area-card:nth-child(1):not(#zzz) h3 {
    font-size: 1.45rem !important;
}

#industries .asc-industry-card:not(#zzz) p,
#areas .asc-area-card:not(#zzz) p {
    font-size: 0.93rem !important;
    line-height: 1.6 !important;
    max-width: 94% !important;
}

.asc-btn {
    font-size: 0.93rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.asc-pest-premium-nav__menu > li > a {
    font-size: 0.8rem !important;
    font-weight: 700 !important;
}

.asc-faq summary {
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.asc-faq details p {
    font-size: 0.96rem !important;
    line-height: 1.65 !important;
}

.asc-footer p {
    font-size: 0.92rem !important;
    line-height: 1.7 !important;
}

/* ==========================================================================
   ELEVATION LAYER 9.0 -- clean dark hero/header, no colour lines
   ========================================================================== */

.asc-pest-premium-header__brandbar:not(#zzz) {
    background: linear-gradient(135deg, #0c0c0e 0%, #08080a 100%) !important;
}

.asc-pest-premium-header__panel--burgundy,
.asc-pest-premium-header__panel--green {
    display: none !important;
}

.asc-pest-premium-nav:not(#zzz) {
    border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

.asc-pest-premium-header__badges span::before {
    background: rgba(255, 255, 255, 0.7) !important;
    box-shadow: none !important;
}

.asc-pest-premium-brand__copy small::before {
    background: rgba(255, 255, 255, 0.6) !important;
    box-shadow: none !important;
}

.asc-pest-premium-header__phone span {
    color: rgba(255, 255, 255, 0.8) !important;
}

.asc-hero:not(#zzz) {
    background:
        radial-gradient(100% 80% at 50% -10%, rgba(255, 255, 255, 0.045), transparent 56%),
        linear-gradient(180deg, #0b0b0d 0%, #070708 52%, #0a0a0c 100%) !important;
}

.asc-hero__bg:not(#zzz) {
    filter: grayscale(1) contrast(1.06) brightness(0.4) !important;
}

.asc-hero:not(#zzz)::before {
    display: none !important;
}

.asc-hero:not(#zzz)::after {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.012)) !important;
    opacity: 0.28 !important;
}

.asc-checks li::before {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.06)) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.asc-proof::before {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.05), transparent 35%),
        radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.04), transparent 34%) !important;
}

.asc-proof__head span,
.asc-process span {
    color: rgba(255, 255, 255, 0.72) !important;
}

.asc-section h2::after {
    display: none !important;
}

.asc-eyebrow::before {
    background: rgba(255, 255, 255, 0.65) !important;
    box-shadow: none !important;
    animation: none !important;
}

.asc-pest-premium-nav__menu > li > a::after,
.asc-header-pro__menu > li > a::after {
    background: rgba(255, 255, 255, 0.55) !important;
}

.asc-pest-premium-nav__menu > li > a:hover,
.asc-pest-premium-nav__menu > li.current-menu-item > a,
.asc-pest-premium-nav__menu > li.current_page_item > a,
.asc-pest-premium-nav__menu a.is-active,
.asc-header-pro__menu a.is-active {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03)) !important;
}

#areas .asc-area-card:not(#zzz) h3::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.18)) !important;
    box-shadow: none !important;
}

/* ==========================================================================
   ELEVATION LAYER 10.0 -- contrast glass card system
   ========================================================================== */

.asc-landing {
    --glass-light:
        linear-gradient(125deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.22) 34%, rgba(255, 255, 255, 0.08) 62%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.87));
    --glass-light-border: rgba(255, 255, 255, 0.7);
    --glass-light-ink: #10141a;
    --glass-light-ink-soft: #353c47;
    --glass-light-shadow:
        0 34px 70px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 0 30px rgba(255, 255, 255, 0.18);

    --glass-dark:
        linear-gradient(125deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.025) 32%, transparent 60%),
        linear-gradient(160deg, rgba(14, 16, 21, 0.92), rgba(6, 7, 10, 0.82));
    --glass-dark-border: rgba(255, 255, 255, 0.16);
    --glass-dark-ink: #f6f8fa;
    --glass-dark-ink-soft: rgba(246, 248, 250, 0.78);
    --glass-dark-shadow: 0 30px 64px rgba(15, 23, 42, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.10);
}

.asc-proof:not(#zzz),
#about .asc-stat-grid article:not(#zzz),
#areas .asc-area-card:not(#zzz):not(#yyy),
.asc-faq details:not(#zzz) {
    background: var(--glass-light) !important;
    border: 1px solid var(--glass-light-border) !important;
    color: var(--glass-light-ink) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%) !important;
    backdrop-filter: blur(22px) saturate(150%) !important;
    box-shadow: var(--glass-light-shadow) !important;
}

.asc-proof:not(#zzz) .asc-proof__head strong,
.asc-proof:not(#zzz) .asc-process strong,
.asc-proof:not(#zzz) .asc-proof__stats strong,
#about .asc-stat-grid article:not(#zzz) strong,
#areas .asc-area-card:not(#zzz):not(#yyy) h3,
.asc-faq details:not(#zzz) summary {
    color: var(--glass-light-ink) !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--glass-light-ink) !important;
}

.asc-proof:not(#zzz) .asc-proof__head span,
.asc-proof:not(#zzz) .asc-process span,
.asc-proof:not(#zzz) .asc-process p,
.asc-proof:not(#zzz) .asc-proof__stats span,
#about .asc-stat-grid article:not(#zzz) span,
#areas .asc-area-card:not(#zzz):not(#yyy) p,
#areas .asc-area-card:not(#zzz):not(#yyy) span,
.asc-faq details:not(#zzz) p {
    color: var(--glass-light-ink-soft) !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--glass-light-ink-soft) !important;
}

.asc-proof:not(#zzz) .asc-process li,
.asc-proof:not(#zzz) .asc-proof__stats div {
    background: rgba(255, 255, 255, 0.66) !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;
}

#areas .asc-area-card:not(#zzz):not(#yyy)::after {
    color: rgba(15, 23, 42, 0.10) !important;
}
#areas .asc-area-card:not(#zzz):not(#yyy) span {
    background: rgba(15, 23, 42, 0.06) !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
}
#areas .asc-area-card:not(#zzz):not(#yyy) h3::after {
    background: linear-gradient(90deg, rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.12)) !important;
}

#areas .asc-fx-card .asc-card-glow:not(#zzz),
#areas .asc-fx-card .asc-card-ring:not(#zzz) {
    display: none !important;
}

#areas .asc-fx-card .asc-fx-icon {
    background: linear-gradient(140deg, #1a1d22, #0c0e11) !important;
    border: 1px solid rgba(15, 23, 42, 0.14) !important;
    color: #ffffff !important;
    box-shadow:
        0 12px 26px rgba(15, 23, 42, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

.asc-faq details:not(#zzz) summary::after {
    background: rgba(15, 23, 42, 0.08) !important;
    color: #13171c !important;
}
.asc-faq details[open]:not(#zzz) summary::after {
    background: #13171c !important;
    color: #ffffff !important;
}

#about .asc-stat-grid article:hover:not(#zzz),
#areas .asc-area-card:hover:not(#zzz):not(#yyy),
.asc-faq details:hover:not(#zzz),
.asc-faq details[open]:not(#zzz) {
    border-color: rgba(15, 23, 42, 0.18) !important;
    box-shadow:
        0 42px 84px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

#industries .asc-industry-card:not(#zzz):not(#yyy) {
    background: var(--glass-dark) !important;
    border: 1px solid var(--glass-dark-border) !important;
    color: var(--glass-dark-ink) !important;
    -webkit-backdrop-filter: blur(22px) saturate(140%) !important;
    backdrop-filter: blur(22px) saturate(140%) !important;
    box-shadow: var(--glass-dark-shadow) !important;
}

#local-pest-control .asc-content-grid article {
    background: var(--glass-dark) !important;
    border: 1px solid var(--glass-dark-border) !important;
    color: var(--glass-dark-ink) !important;
    -webkit-backdrop-filter: blur(22px) saturate(140%) !important;
    backdrop-filter: blur(22px) saturate(140%) !important;
    box-shadow: var(--glass-dark-shadow) !important;
}

#local-pest-control .asc-content-grid article h3 {
    color: var(--glass-dark-ink) !important;
}
#local-pest-control .asc-content-grid article p {
    color: var(--glass-dark-ink-soft) !important;
}
#local-pest-control .asc-content-grid article::after {
    color: rgba(255, 255, 255, 0.12) !important;
}
#local-pest-control .asc-content-grid article:hover {
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow:
        0 40px 80px rgba(15, 23, 42, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

#contact.asc-contact:not(#zzz) {
    background:
        radial-gradient(circle at 50% -6%, #ffffff, transparent 50%),
        linear-gradient(180deg, #f7f8f5 0%, #eef0ea 54%, #f8f9f6 100%) !important;
    color: #0e1512 !important;
}

#contact.asc-contact:not(#zzz)::before {
    display: none !important;
}

#contact .asc-contact__inner {
    max-width: 860px !important;
    margin-inline: auto !important;
    padding: clamp(2.4rem, 5vw, 3.8rem) !important;
    border-radius: 30px !important;
    border: 1px solid var(--glass-dark-border) !important;
    background: var(--glass-dark) !important;
    -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
    backdrop-filter: blur(24px) saturate(140%) !important;
    box-shadow: 0 40px 90px rgba(15, 23, 42, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
    text-align: center !important;
}

#contact .asc-contact__inner h2 {
    color: #ffffff !important;
}
#contact .asc-contact__inner p {
    color: rgba(245, 247, 249, 0.78) !important;
    margin-inline: auto !important;
}
#contact .asc-eyebrow--light {
    color: rgba(245, 247, 249, 0.82) !important;
}

.asc-section > .asc-container > .asc-eyebrow,
.asc-section > .asc-container > h2,
.asc-section > .asc-container > .asc-section__lead {
    text-align: center !important;
}

.asc-section > .asc-container > .asc-eyebrow {
    margin-left: auto !important;
    margin-right: auto !important;
    display: flex !important;
}

.asc-section > .asc-container > h2,
.asc-section > .asc-container > .asc-section__lead {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   ELEVATION LAYER 11.0 -- full-width layout + glassier frost
   ========================================================================== */

.asc-container:not(#zzz) {
    width: min(1760px, calc(100% - 48px)) !important;
}

.asc-proof:not(#zzz),
#about .asc-stat-grid article:not(#zzz),
#areas .asc-area-card:not(#zzz):not(#yyy),
.asc-faq details:not(#zzz),
#industries .asc-industry-card:not(#zzz):not(#yyy),
#local-pest-control .asc-content-grid article,
#contact .asc-contact__inner {
    -webkit-backdrop-filter: blur(30px) saturate(165%) !important;
    backdrop-filter: blur(30px) saturate(165%) !important;
}

.asc-proof:not(#zzz) .asc-process li,
.asc-proof:not(#zzz) .asc-proof__stats div {
    background: rgba(255, 255, 255, 0.66) !important;
}

/* ==========================================================================
   ELEVATION LAYER 12.0 -- feature grids, statband, QA fixes
   ========================================================================== */

.asc-feature-grid {
    display: grid !important;
    gap: 1.5rem !important;
    margin-top: 2.6rem !important;
    align-items: stretch !important;
}

.asc-feature-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.asc-feature-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.asc-feature-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    padding: 1.9rem 1.7rem !important;
    border-radius: 22px !important;
    background: var(--glass-light) !important;
    border: 1px solid var(--glass-light-border) !important;
    color: var(--glass-light-ink) !important;
    -webkit-backdrop-filter: blur(30px) saturate(165%) !important;
    backdrop-filter: blur(30px) saturate(165%) !important;
    box-shadow: var(--glass-light-shadow) !important;
    transition:
        transform 0.28s cubic-bezier(0.2, 0.7, 0.2, 1),
        box-shadow 0.28s ease,
        border-color 0.28s ease !important;
}

.asc-feature-card:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(15, 23, 42, 0.2) !important;
    box-shadow:
        0 44px 88px rgba(0, 0, 0, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

.asc-feature-card__num {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: flex-start !important;
    min-width: 2.5rem !important;
    height: 2.5rem !important;
    padding: 0 0.7rem !important;
    margin-bottom: 1.15rem !important;
    border-radius: 13px !important;
    background: rgba(15, 23, 42, 0.07) !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    color: #0c0f14 !important;
    font-family: var(--asc-font-display) !important;
    font-weight: 800 !important;
    font-size: 0.95rem !important;
    letter-spacing: 0.02em !important;
}

.asc-feature-card h3 {
    margin: 0 0 0.6rem !important;
    color: var(--glass-light-ink) !important;
}

.asc-feature-card p {
    margin: 0 !important;
    color: var(--glass-light-ink-soft) !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
}

.asc-feature-note {
    margin: 1.7rem auto 0 !important;
    max-width: 100% !important;
    text-align: center !important;
    color: rgba(245, 249, 247, 0.58) !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

.asc-statband {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
    margin-top: 2.6rem !important;
}

.asc-statband-card {
    position: relative !important;
    overflow: hidden !important;
    text-align: center !important;
    padding: 2.3rem 1.4rem !important;
    border-radius: 22px !important;
    background: var(--glass-light) !important;
    border: 1px solid var(--glass-light-border) !important;
    -webkit-backdrop-filter: blur(30px) saturate(165%) !important;
    backdrop-filter: blur(30px) saturate(165%) !important;
    box-shadow: var(--glass-light-shadow) !important;
    transition: transform 0.28s cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 0.28s ease !important;
}

.asc-statband-card:hover {
    transform: translateY(-6px) !important;
}

.asc-statband-card strong {
    display: block !important;
    margin-bottom: 0.55rem !important;
    font-family: var(--asc-font-display) !important;
    font-weight: 800 !important;
    font-size: clamp(1.9rem, 3vw, 2.7rem) !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
    color: #0c0f14 !important;
}

.asc-statband-card span {
    display: block !important;
    color: var(--glass-light-ink-soft) !important;
    font-size: 0.92rem !important;
    line-height: 1.5 !important;
}

@media (max-width: 1080px) {
    .asc-feature-grid--4,
    .asc-feature-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .asc-statband {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 600px) {
    .asc-feature-grid--4,
    .asc-feature-grid--3 {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   ELEVATION LAYER 17.0 -- premium header refinement + centred FAQ
   ========================================================================== */

.asc-topbar {
    position: relative !important;
    z-index: 40 !important;
    overflow: hidden !important;
    max-height: 64px !important;
    background: linear-gradient(180deg, #0a0b0e, #08090b) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
    transition: max-height 0.35s ease, opacity 0.3s ease !important;
}

.asc-topbar__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 8px 18px !important;
    min-height: 42px !important;
}

.asc-topbar__group {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

.asc-topbar__item {
    color: rgba(245, 249, 247, 0.62) !important;
    font-size: 0.76rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.asc-topbar__item--mail {
    color: rgba(245, 249, 247, 0.82) !important;
    transition: color 0.16s ease !important;
}

.asc-topbar__item--mail:hover {
    color: #ffffff !important;
}

.asc-topbar__item--accent {
    color: rgba(255, 255, 255, 0.78) !important;
}

.asc-topbar__sep {
    width: 1px !important;
    height: 13px !important;
    background: rgba(255, 255, 255, 0.16) !important;
}

.asc-header-pro.is-scrolled .asc-topbar {
    max-height: 0 !important;
    opacity: 0 !important;
    border-bottom-color: transparent !important;
}

@media (max-width: 820px) {
    .asc-topbar {
        display: none !important;
    }
}

.asc-pest-premium-header__brandbar {
    min-height: 118px !important;
}

.asc-pest-premium-header__inner {
    min-height: 118px !important;
}

.asc-header-pro.is-scrolled .asc-pest-premium-header__brandbar,
.asc-header-pro.is-scrolled .asc-pest-premium-header__inner {
    min-height: 92px !important;
}

.asc-pest-premium-brand {
    gap: 17px !important;
}

.asc-pest-premium-brand__mark {
    width: 64px !important;
    height: 64px !important;
    border-radius: 19px !important;
    font-size: 16px !important;
}

.asc-pest-premium-brand__copy strong {
    font-size: clamp(25px, 2.3vw, 35px) !important;
}

.asc-pest-premium-brand__copy small {
    margin-top: 11px !important;
    font-size: clamp(11px, 0.95vw, 13.5px) !important;
}

.asc-pest-premium-header__badges {
    gap: 9px !important;
}

.asc-pest-premium-header__badges span {
    min-height: 31px !important;
    padding: 7px 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
}

.asc-pest-premium-header__badges span::before {
    content: "\2713" !important;
    width: auto !important;
    height: auto !important;
    margin-right: 7px !important;
    background: none !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 10px !important;
    font-weight: 900 !important;
}

.asc-pest-premium-header__phone {
    min-height: 46px !important;
    padding: 0 17px !important;
    font-size: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03)) !important;
}

.asc-pest-premium-header__quote {
    min-height: 46px !important;
    padding: 0 23px !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    background: linear-gradient(180deg, #ffffff, #e9ece6) !important;
    color: #12161b !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.34) !important;
}

.asc-pest-premium-header__quote:hover {
    transform: translateY(-2px) !important;
    background: #ffffff !important;
    color: #12161b !important;
    box-shadow: 0 22px 44px rgba(0, 0, 0, 0.4) !important;
}

#faq .asc-faq {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   ELEVATION LAYER 19.0 -- clean bg + performance + type pop
   ========================================================================== */

body.asc-pest-landing-page {
    background: #08090b !important;
}

.asc-landing:not(#zzz) {
    background: linear-gradient(180deg, #0a0b0d 0%, #070809 52%, #0a0b0d 100%) !important;
}

.asc-landing::before,
.asc-landing::after {
    display: none !important;
    content: none !important;
}

.asc-proof:not(#zzz),
#about .asc-stat-grid article:not(#zzz),
#areas .asc-area-card:not(#zzz):not(#yyy),
.asc-faq details:not(#zzz),
#industries .asc-industry-card:not(#zzz):not(#yyy),
#local-pest-control .asc-content-grid article,
#contact .asc-contact__inner,
.asc-feature-card,
.asc-statband-card {
    -webkit-backdrop-filter: blur(10px) saturate(115%) !important;
    backdrop-filter: blur(10px) saturate(115%) !important;
}

#about .asc-stat-grid article:not(#zzz) {
    text-align: center !important;
    align-items: center !important;
}

#about .asc-stat-grid article:not(#zzz) strong,
#about .asc-stat-grid article:not(#zzz) span {
    text-align: center !important;
    width: 100% !important;
}

.asc-landing h1 {
    font-size: clamp(2.85rem, 5.4vw, 5rem) !important;
    letter-spacing: -0.035em !important;
    line-height: 1.02 !important;
}

.asc-landing h2 {
    font-size: clamp(2.1rem, 3.7vw, 3.5rem) !important;
    letter-spacing: -0.03em !important;
    line-height: 1.06 !important;
}

.asc-landing h3 {
    font-size: clamp(1.16rem, 1.5vw, 1.42rem) !important;
}

.asc-eyebrow {
    font-size: 0.76rem !important;
    letter-spacing: 0.18em !important;
}

.asc-hero__lead,
.asc-section__lead {
    font-size: clamp(1.05rem, 1.35vw, 1.25rem) !important;
    line-height: 1.72 !important;
}

.asc-feature-card h3,
#areas .asc-area-card:not(#zzz):not(#yyy) h3,
#industries .asc-industry-card:not(#zzz):not(#yyy) h3,
#local-pest-control .asc-content-grid article h3 {
    font-size: 1.32rem !important;
}

.asc-statband-card strong {
    font-size: clamp(2.1rem, 3.2vw, 2.9rem) !important;
}

/* ==========================================================================
   ELEVATION LAYER 20.0/21.0 -- bulletproof white glass, dark cards on white
   ========================================================================== */

.asc-proof:not(#zzz),
#about .asc-stat-grid article:not(#zzz),
#areas .asc-area-card:not(#zzz):not(#yyy),
.asc-faq details:not(#zzz),
.asc-feature-card:not(#zzz),
.asc-statband-card:not(#zzz) {
    background-color: rgba(255, 255, 255, 0.9) !important;
    background-image:
        linear-gradient(125deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.58) 44%, rgba(255, 255, 255, 0.34) 100%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(150%) !important;
    backdrop-filter: blur(14px) saturate(150%) !important;
    color: #10141a !important;
    border: 1px solid rgba(255, 255, 255, 0.66) !important;
    box-shadow:
        0 28px 60px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 0 40px rgba(255, 255, 255, 0.22) !important;
}

#industries .asc-industry-card:not(#zzz):not(#yyy),
#local-pest-control .asc-content-grid article,
#contact .asc-contact__inner,
#process .asc-feature-card {
    background-color: #14171c !important;
    background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.015) 100%) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    color: #f6f8fa !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow:
        0 26px 56px rgba(15, 23, 42, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* ==========================================================================
   ELEVATION LAYER 4.0 -- light interlude sections (#industries, #local-pest-control)
   ========================================================================== */

#industries.asc-section:not(#zzz),
#industries.asc-section--soft:not(#zzz) {
    background:
        radial-gradient(circle at 50% -4%, #ffffff, transparent 46%),
        radial-gradient(ellipse at 50% 96%, rgba(15, 23, 42, 0.06), transparent 60%),
        linear-gradient(180deg, #f6f7f4 0%, #edefe9 52%, #f7f8f5 100%) !important;
    color: #0e1512 !important;
}

#industries .asc-eyebrow:not(#zzz) {
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0.7)) !important;
    color: #15321f !important;
    box-shadow:
        0 14px 30px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 #ffffff !important;
}

#industries .asc-eyebrow:not(#zzz)::before {
    background: rgba(15, 23, 42, 0.45) !important;
    box-shadow: none !important;
}

#industries h2:not(#zzz) {
    color: #0e1512 !important;
    text-shadow: none !important;
}

#industries h2:not(#zzz)::after {
    background: linear-gradient(90deg, var(--asc-burgundy), var(--asc-green), var(--asc-olive)) !important;
    box-shadow: none !important;
}

#industries .asc-section__lead:not(#zzz) {
    color: rgba(15, 23, 42, 0.62) !important;
    text-shadow: none !important;
}

#industries .asc-industry-card:not(#zzz) h3 {
    color: #f6f8fa !important;
}

#industries .asc-industry-card:not(#zzz) p {
    color: rgba(246, 248, 250, 0.72) !important;
}

#local-pest-control.asc-section:not(#zzz) {
    overflow: hidden !important;
    background:
        radial-gradient(circle at 50% -4%, #ffffff, transparent 48%),
        linear-gradient(180deg, #f7f8f5 0%, #eef0ea 54%, #f8f9f6 100%) !important;
    color: #0e1512 !important;
}

#local-pest-control.asc-section:not(#zzz)::before {
    display: none !important;
}

#local-pest-control .asc-eyebrow:not(#zzz) {
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0.7)) !important;
    color: #15321f !important;
    box-shadow:
        0 14px 30px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 #ffffff !important;
}

#local-pest-control .asc-eyebrow:not(#zzz)::before {
    background: rgba(15, 23, 42, 0.45) !important;
    box-shadow: none !important;
}

#local-pest-control h2:not(#zzz) {
    color: #0e1512 !important;
    text-shadow: none !important;
}

#local-pest-control h2:not(#zzz)::after {
    background: linear-gradient(90deg, var(--asc-green), var(--asc-olive), var(--asc-burgundy)) !important;
    box-shadow: none !important;
}

#local-pest-control .asc-section__lead:not(#zzz) {
    color: rgba(15, 23, 42, 0.62) !important;
    text-shadow: none !important;
}

#local-pest-control .asc-content-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.4rem !important;
    margin-top: 2.6rem !important;
    counter-reset: asc-lpc !important;
}

#local-pest-control .asc-content-grid article {
    counter-increment: asc-lpc !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 2.1rem 1.7rem 1.7rem !important;
    border-radius: 22px !important;
    transition:
        transform 260ms cubic-bezier(0.2, 0.7, 0.2, 1),
        box-shadow 260ms ease,
        border-color 260ms ease !important;
}

#local-pest-control .asc-content-grid article::after {
    content: counter(asc-lpc, decimal-leading-zero) !important;
    position: absolute !important;
    right: 1.3rem !important;
    top: 0.9rem !important;
    font-family: var(--asc-font-display) !important;
    font-size: 2.7rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
}

#local-pest-control .asc-content-grid article h3 {
    margin: 0 0 0.7rem 0 !important;
    font-family: var(--asc-font-display) !important;
    font-size: 1.18rem !important;
    letter-spacing: -0.02em !important;
}

#local-pest-control .asc-content-grid article p {
    margin: 0 !important;
    font-size: 0.95rem !important;
    line-height: 1.62 !important;
}

#local-pest-control .asc-content-grid article:hover {
    transform: translateY(-6px) !important;
}

@media (max-width: 1024px) {
    #local-pest-control .asc-content-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    #local-pest-control .asc-content-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   ELEVATION LAYER 14.0 -- process section -> white + dark glass
   ========================================================================== */

#process.asc-section:not(#zzz) {
    background:
        radial-gradient(circle at 50% -4%, #ffffff, transparent 46%),
        radial-gradient(ellipse at 50% 96%, rgba(15, 23, 42, 0.06), transparent 60%),
        linear-gradient(180deg, #f6f7f4 0%, #edefe9 52%, #f7f8f5 100%) !important;
    color: #0e1512 !important;
}

#process.asc-section:not(#zzz)::before {
    display: none !important;
}

#process .asc-eyebrow:not(#zzz) {
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0.7)) !important;
    color: #15321f !important;
    box-shadow:
        0 14px 30px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 #ffffff !important;
}

#process .asc-eyebrow:not(#zzz)::before {
    background: rgba(15, 23, 42, 0.45) !important;
    box-shadow: none !important;
}

#process h2:not(#zzz) {
    color: #0e1512 !important;
    text-shadow: none !important;
}

#process .asc-section__lead:not(#zzz) {
    color: rgba(15, 23, 42, 0.62) !important;
    text-shadow: none !important;
}

#process .asc-feature-card h3 {
    color: var(--glass-dark-ink) !important;
}

#process .asc-feature-card p {
    color: var(--glass-dark-ink-soft) !important;
}

#process .asc-feature-card:hover {
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow:
        0 44px 88px rgba(15, 23, 42, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

#process .asc-feature-card__num {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

/* ==========================================================================
   ELEVATION LAYER 22.0 -- compact density + section accents
   ========================================================================== */

.asc-section,
.asc-section--soft,
.asc-compliance,
.asc-contact {
    padding-top: clamp(2.5rem, 4.6vw, 3.9rem) !important;
    padding-bottom: clamp(2.5rem, 4.6vw, 3.9rem) !important;
}

.asc-hero {
    min-height: 0 !important;
    padding: clamp(2.6rem, 5.5vw, 4.2rem) 0 !important;
}

.asc-landing h1 {
    font-size: clamp(1.95rem, 3.7vw, 3.05rem) !important;
    margin-bottom: 0.9rem !important;
}

.asc-landing h2 {
    font-size: clamp(1.45rem, 2.5vw, 2.1rem) !important;
    margin-bottom: 0.8rem !important;
}

.asc-landing h3 {
    font-size: clamp(1rem, 1.15vw, 1.12rem) !important;
}

.asc-hero__lead,
.asc-section__lead {
    font-size: clamp(0.93rem, 1vw, 1.03rem) !important;
    line-height: 1.6 !important;
}

.asc-section__lead {
    margin-bottom: 1.4rem !important;
}

.asc-eyebrow {
    font-size: 0.66rem !important;
    margin-bottom: 0.7rem !important;
    padding: 6px 10px !important;
}

.asc-btn {
    min-height: 2.65rem !important;
    padding: 0.58rem 1rem !important;
    font-size: 0.82rem !important;
    border-radius: 12px !important;
}

.asc-feature-grid {
    gap: 1rem !important;
    margin-top: 1.6rem !important;
}

.asc-feature-card:not(#zzz) {
    padding: 1.2rem 1.15rem !important;
    border-radius: 16px !important;
    text-align: center !important;
    align-items: center !important;
}

.asc-feature-card:not(#zzz) .asc-feature-card__num {
    align-self: center !important;
}

.asc-feature-card__num {
    min-width: 2rem !important;
    height: 2rem !important;
    margin-bottom: 0.8rem !important;
    border-radius: 10px !important;
    font-size: 0.82rem !important;
}

.asc-feature-card p {
    font-size: 0.88rem !important;
    line-height: 1.5 !important;
}

.asc-stat-grid,
.asc-industry-grid,
.asc-area-grid,
.asc-statband {
    gap: 1rem !important;
}

#about .asc-stat-grid article:not(#zzz),
#industries .asc-industry-card:not(#zzz):not(#yyy),
#areas .asc-area-card:not(#zzz):not(#yyy),
.asc-statband-card:not(#zzz) {
    padding: 1.1rem !important;
    border-radius: 18px !important;
}

.asc-feature-card h3,
#areas .asc-area-card:not(#zzz):not(#yyy) h3,
#industries .asc-industry-card:not(#zzz):not(#yyy) h3,
#local-pest-control .asc-content-grid article h3 {
    font-size: 1.06rem !important;
}

.asc-industry-card p,
.asc-area-card p {
    font-size: 0.86rem !important;
    line-height: 1.5 !important;
}

.asc-card-icon {
    width: 34px !important;
    height: 34px !important;
    margin-bottom: 0.7rem !important;
    border-radius: 11px !important;
}

.asc-statband-card strong {
    font-size: clamp(1.45rem, 2.3vw, 1.95rem) !important;
}

.asc-proof:not(#zzz) {
    padding: 1.15rem !important;
}

.asc-proof__head strong {
    font-size: 1.12rem !important;
}

.asc-process li {
    padding: 0.8rem !important;
}

#trust.asc-section:not(#zzz) {
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.12), transparent 40%),
        linear-gradient(135deg, var(--asc-burgundy-bright), var(--asc-burgundy-dark)) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

#plans.asc-section:not(#zzz) {
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.16), transparent 42%),
        linear-gradient(135deg, #25d366, var(--asc-green-light)) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
}

#trust .asc-section__lead:not(#zzz),
#plans .asc-section__lead:not(#zzz) {
    color: rgba(255, 255, 255, 0.94) !important;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.25) !important;
}

#trust.asc-section h2::after,
#plans.asc-section h2::after {
    background: rgba(255, 255, 255, 0.9) !important;
    box-shadow: none !important;
}

/* ==========================================================================
   ENTERPRISE LAYOUT PASS -- about band, floating contact buttons, tiles
   ========================================================================== */

.asc-about-grid {
    display: grid !important;
    grid-template-columns: 0.82fr 1.18fr !important;
    gap: clamp(1.5rem, 4vw, 3rem) !important;
    align-items: center !important;
}

.asc-about__media {
    margin: 0 !important;
    height: auto !important;
    align-self: center !important;
}

.asc-about__body .asc-stat-grid {
    grid-template-columns: repeat(2, 1fr) !important;
}

@media (max-width: 860px) {
    .asc-about-grid {
        grid-template-columns: 1fr !important;
    }
}

.asc-landing #about {
    background:
        radial-gradient(circle at 16% 0%, rgba(196, 226, 131, 0.12), transparent 34%),
        radial-gradient(circle at 88% 100%, rgba(101, 0, 40, 0.55), transparent 40%),
        linear-gradient(135deg, var(--asc-burgundy-bright) 0%, var(--asc-burgundy) 48%, var(--asc-burgundy-dark) 100%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.asc-media,
.asc-media--bg {
    display: none !important;
}

.asc-landing .asc-tile-img {
    position: relative !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    color: inherit !important;
    background-image:
        linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.032)) !important;
}

.asc-tile-ico {
    display: inline-grid !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    margin-bottom: 1rem !important;
    border: 1px solid rgba(196, 226, 131, 0.22) !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, rgba(31, 143, 77, 0.30), rgba(107, 142, 35, 0.20)) !important;
    color: #d7f09b !important;
    box-shadow:
        0 0 24px rgba(31, 143, 77, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.asc-tile-ico svg {
    width: 23px !important;
    height: 23px !important;
}

@media (max-width: 600px) {
    .asc-landing .asc-fab__btn {
        width: 50px !important;
        height: 50px !important;
    }
}

.asc-landing .asc-hero__bg {
    background:
        linear-gradient(90deg, rgba(5, 6, 8, 0.7) 0%, rgba(5, 6, 8, 0.4) 46%, rgba(5, 6, 8, 0.12) 100%),
        linear-gradient(180deg, rgba(5, 6, 8, 0.05), rgba(5, 6, 8, 0.5)),
        url("../images/hero-pest-control.jpg") center / cover no-repeat !important;
    filter: saturate(1.08) contrast(1.04) brightness(0.96) !important;
}

.asc-landing .asc-about-grid {
    grid-template-columns: 1fr !important;
}

.asc-landing #about .asc-about-grid {
    grid-template-columns: 0.72fr 1.28fr !important;
    align-items: center !important;
}

.asc-landing #about .asc-about__badge {
    display: grid !important;
    place-items: center !important;
    gap: 0.95rem !important;
    height: auto !important;
    margin: 0 !important;
    padding: clamp(1.5rem, 3vw, 2.5rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.4) !important;
    overflow: visible !important;
}

.asc-landing #about .asc-about__badge img {
    position: static !important;
    width: auto !important;
    max-width: 82% !important;
    height: auto !important;
    max-height: 120px !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    transform: none !important;
    filter: none !important;
}

.asc-landing #about .asc-about__badge figcaption {
    position: static !important;
    clip: auto !important;
    clip-path: none !important;
    width: auto !important;
    height: auto !important;
    inset: auto !important;
    margin: 0 !important;
    color: #44505c !important;
    font-size: 0.74rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.13em !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
}

@media (max-width: 760px) {
    .asc-landing #about .asc-about-grid {
        grid-template-columns: 1fr !important;
    }
    .asc-landing #about .asc-about__badge {
        max-width: 360px !important;
        margin: 0 auto !important;
    }
}

/* ==========================================================================
   SECTION SPACING & WIDTH REFINEMENTS
   ========================================================================== */

.asc-landing .asc-container {
    width: min(1280px, calc(100% - 48px)) !important;
}

.asc-landing .asc-section,
.asc-landing .asc-section--soft,
.asc-landing .asc-compliance,
.asc-landing .asc-contact {
    padding-top: clamp(5rem, 8vw, 8rem) !important;
    padding-bottom: clamp(5rem, 8vw, 8rem) !important;
}

.asc-landing .asc-section__lead {
    margin-bottom: 2.4rem !important;
}

.asc-landing .asc-feature-grid {
    gap: 1.6rem !important;
    margin-top: 2.9rem !important;
}

.asc-landing .asc-stat-grid,
.asc-landing .asc-card-grid,
.asc-landing .asc-industry-grid,
.asc-landing .asc-area-grid,
.asc-landing .asc-content-grid {
    gap: 1.6rem !important;
}

.asc-landing .asc-tile-img:not(#zzz),
.asc-landing .asc-feature-card--ico:not(#zzz) {
    padding: 1.6rem 1.45rem !important;
}

.asc-landing .asc-about-grid {
    gap: clamp(2rem, 4.5vw, 3.5rem) !important;
}

/* ==========================================================================
   COMPACT SERVICES + SHORTER HERO
   ========================================================================== */

.asc-landing .asc-service-wheel {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 2rem 0 0 !important;
    transform: none !important;
}

.asc-landing .asc-service-wheel__card {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    min-height: 0 !important;
    opacity: 1 !important;
    transform: none !important;
}

@media (max-width: 760px) {
    .asc-landing .asc-service-wheel {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 520px) {
    .asc-landing .asc-service-wheel {
        grid-template-columns: 1fr !important;
    }
}

.asc-landing .asc-hero {
    min-height: 0 !important;
    padding-top: clamp(2.75rem, 5vw, 4.5rem) !important;
    padding-bottom: clamp(2.75rem, 5vw, 4.5rem) !important;
}

.asc-landing #services {
    padding-top: clamp(3rem, 5vw, 4.5rem) !important;
    padding-bottom: clamp(3rem, 5vw, 4.5rem) !important;
}

.asc-landing a:focus-visible,
.asc-landing button:focus-visible,
.asc-landing summary:focus-visible,
.asc-landing input:focus-visible,
.asc-landing select:focus-visible,
.asc-landing textarea:focus-visible {
    outline: 2px solid #c4e283 !important;
    outline-offset: 2px !important;
    border-radius: 6px !important;
}
/* ===== END asc-landing plugin source ===== */