/* ==========================================================================
   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; 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-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  max-width: none;
}
.hero-content { max-width: 42rem; }

.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 ---- */
.logo-mark { border-radius: 50% !important; }
.nav-toggle { border-radius: 50% !important; background: rgba(255,255,255,.05) !important; }
.card-icon, .bc-icon { border-radius: 50% !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;
}

/* 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: 160px;
  z-index: 10050;
}

.asc-getquote-fab__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border: none;
  border-radius: 999px;
  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: 144px; }
}

/* --- 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 ===== */

/* ===== 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 ===== */