/* ================================================================
   YDWP PEST CONTROL, Custom CSS
   Only rules that theme.json can't express:
   - Dark mode variable overrides
   - Sticky header
   - Card hover effects / animations
   - Mobile responsive
   - Review plugin compatibility
   ================================================================ */

/* ===== DESIGN TOKENS (CSS custom properties for dark mode) ===== */
:root, :root[data-theme="light"] {
    --pc-bg: #f8fafc;
    --pc-bg-alt: #f1f5f9;
    --pc-surface: #ffffff;
    --pc-surface-alt: #f8fafc;
    --pc-text: #0f172a;
    --pc-text-muted: #475569;
    --pc-text-faded: #64748b;
    --pc-border: #e2e8f0;
    --pc-border-light: #f1f5f9;
    --pc-heading: #0f172a;
    --pc-accent: #d9773a;
    --pc-accent-hover: #b85f28;
    /* Links: #a1491c passes WCAG AA (6.03) on white and (5.5) on surface-alt;
       on dark hero sections links use --pc-link-dark (7.35 on #080c19). */
    --pc-link: #a1491c;
    --pc-link-dark: #e08a4f;
    /* Hover teal: #157068 passes AA on white (5.92) and surface-alt (5.4) */
    --pc-link-hover: #157068;
    --pc-button-bg: #d9773a;
    --pc-button-text: #ffffff;
    --pc-button-hover: #b85f28;
    --pc-card-bg: #ffffff;
    --pc-card-border: #e2e8f0;
    --pc-header-bg: rgba(255,255,255,0.92);
    --pc-header-text: #0f172a;
    --pc-footer-bg: #0a1628;
    --pc-footer-text: #cbd5e1;
    --pc-footer-heading: #f8fafc;
    --pc-footer-link: #d9773a;
    --pc-footer-link-hover: #3DC9BD;
    --pc-separator: #e2e8f0;
    --pc-shadow-card: 0 2px 12px rgba(0,0,0,0.06);
    --pc-shadow-card-hover: 0 12px 32px rgba(0,0,0,0.12);
    --pc-hero-overlay: linear-gradient(135deg, rgba(15,23,42,0.85), rgba(10,22,40,0.7));
    --pc-shadow: 0 2px 8px rgba(0,0,0,0.08);
    --pc-shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
    --pc-radius: 8px;
    --pc-radius-lg: 16px;
    --pc-transition: 250ms ease;
    --pc-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Dark theme disabled Oct 2026 at client request, always light. */
:root[data-theme="dark"] {
    /* alias: dark block no longer overrides; forces light values via attribute removal below */
    --pc-dark-disabled: 1;
}

/* ===== SUB-PAGE LAYOUT: match homepage rhythm ===== */
/* Interior pages (termite-control, about, city pages) render bare
   headings/paragraphs without homepage's padded groups. Give every
   interior page's content column consistent side padding and
   section spacing equal to the homepage. */
main.pc-main {
    padding-left: clamp(1.25rem, 4vw, 2.5rem) !important;
    padding-right: clamp(1.25rem, 4vw, 2.5rem) !important;
}

main.pc-main > .entry-content,
main.pc-main .wp-block-post-content {
    max-width: min(1200px, 100% - clamp(2.5rem, 8vw, 5rem)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Section spacing on interior pages: same vertical rhythm as homepage groups */
/* D2/CTA follow-up: both of these helpers were written for interior pages but
   the homepage main carries pc-main now, and unscoped they leak
   (margin-top 2.5rem on every top-level homepage group; the white junction
   between two full-bleed sections grew past the approved rhythm, measured as a
   275px uniform band after the how-it-works removal). Scoped to interior
   pages; the homepage sections keep their own ydh-home.css spacing. */
body.ydh-inner main.pc-main > .entry-content > .wp-block-group,
body.ydh-inner main.pc-main > .entry-content > h2,
body.ydh-inner main.pc-main > .entry-content > h3 {
    margin-top: 2.5rem;
}

body.ydh-inner main.pc-main > .entry-content > .wp-block-group {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

/* Page title band gets breathing room like homepage hero */
.pc-page-title {
    padding-left: clamp(1.25rem, 4vw, 2.5rem) !important;
    padding-right: clamp(1.25rem, 4vw, 2.5rem) !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* Breadcrumbs inside the content column, not glued to the edge */
main .yoast-breadcrumbs {
    padding-left: 0 !important;
    max-width: min(1200px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===== BASE BODY (overrides theme.json for dark mode support) ===== */
body {
    background-color: var(--pc-bg) !important;
    color: var(--pc-text) !important;
    transition: background-color var(--pc-transition), color var(--pc-transition);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ===== TYPOGRAPHY ===== */
h1, h2, h3, h4, h5, h6 {
    color: var(--pc-heading) !important;
}

main a:not(.wp-block-button__link):not(.wp-element-button) {
    color: var(--pc-link) !important;
    text-decoration: none !important;
    transition: color var(--pc-transition);
    font-weight: 500;
}

/* Links inside dark hero sections need the lighter orange for contrast */
.is-style-nfd-theme-dark a:not(.wp-block-button__link):not(.wp-element-button),
.wp-block-group[style*="background-color:#080c19"] a:not(.wp-block-button__link):not(.wp-element-button) {
    color: var(--pc-link-dark) !important;
}

main a:not(.wp-block-button__link):not(.wp-element-button):hover {
    color: var(--pc-link-hover) !important;
    text-decoration: underline !important;
}

/* ===== STICKY HEADER ===== */
.wp-site-blocks {
    overflow: visible !important;
}

header, .wp-block-template-part[aria-label="Header"],
.pc-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background-color: var(--pc-header-bg) !important;
    backdrop-filter: blur(12px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(180%) !important;
    border-bottom: 1px solid var(--pc-border) !important;
    transition: background-color var(--pc-transition), box-shadow var(--pc-transition);
}

header.scrolled {
    box-shadow: var(--pc-shadow) !important;
}

/* Header text color */
header .wp-block-site-title,
header .wp-block-site-title a,
header .wp-block-navigation .wp-block-navigation-item__label,
header .wp-block-navigation .wp-block-navigation-item__content {
    color: var(--pc-header-text) !important;
}

/* Header logo */
header .wp-block-site-logo img,
header .pc-site-logo img,
header img.custom-logo {
    max-height: 56px !important;
    width: auto !important;
    transition: transform var(--pc-transition);
}

/* Nav link hover */
header .wp-block-navigation .wp-block-navigation-item__content:hover {
    color: var(--pc-accent) !important;
}

/* Nav underline animation */
header .wp-block-navigation .wp-block-navigation-item {
    position: relative;
}

header .wp-block-navigation .wp-block-navigation-item::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--pc-accent);
    transform: scaleX(0);
    transition: transform var(--pc-transition);
    transform-origin: center;
}

header .wp-block-navigation .wp-block-navigation-item:hover::after {
    transform: scaleX(1);
}

/* Submenu dropdown */
header .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
    background-color: var(--pc-surface) !important;
    border: 1px solid var(--pc-border) !important;
    border-radius: var(--pc-radius) !important;
    box-shadow: var(--pc-shadow-lg) !important;
    padding: 0.5rem !important;
    display: none !important;
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    min-width: 200px !important;
    z-index: 1000 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.2s ease, visibility 0.2s ease !important;
}

/* Desktop: show on hover */
@media (min-width: 783px) {
    header .wp-block-navigation .has-child:hover > .wp-block-navigation__submenu-container {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        /* Complete the un-clip: core navigation/style.min.css keeps the
           closed box at height:0; width:0; overflow:hidden, and on this page
           its :hover un-clip rule does not match (no Interactivity runtime),
           so display alone left an 18px sliver on hover (and with JS off). */
        height: auto !important;
        width: auto !important;
        overflow: visible !important;
    }

    /* Desktop: also show when clicked-open (touch laptops etc.) */
    header .wp-block-navigation .has-child.pc-submenu-open > .wp-block-navigation__submenu-container {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* Make submenu icon clickable cursor */
header .wp-block-navigation-item.has-child .wp-block-navigation__submenu-icon {
    cursor: pointer;
}

/* Open state: rotate chevron */
header .wp-block-navigation-item.has-child.pc-submenu-open > .wp-block-navigation__submenu-icon {
    transform: rotate(180deg);
    transition: transform 0.2s ease;
}

header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__label {
    color: var(--pc-text) !important;
}

/* ===== BUTTONS ===== */
.wp-block-button__link, .wp-element-button {
    background-color: var(--pc-button-bg) !important;
    color: var(--pc-button-text) !important;
    border-radius: var(--pc-radius) !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    padding: 0.75rem 1.75rem !important;
    transition: all var(--pc-transition) !important;
    box-shadow: 0 2px 8px rgba(217,119,58,0.25) !important;
    border: none !important;
    position: relative;
    overflow: hidden;
}

.wp-block-button__link:hover, .wp-element-button:hover {
    background-color: var(--pc-button-hover) !important;
    box-shadow: 0 4px 20px rgba(217,119,58,0.35) !important;
    transform: translateY(-2px) !important;
}

/* ===== HERO SECTION ===== */
/* The hero uses inline style background-color:#080c19, style it as dark section */
.nfd-container.is-style-nfd-theme-dark,
.wp-block-group[style*="background-color:#080c19"],
.wp-block-group[style*="background-color:#080C19"] {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: var(--pc-navy, #0a1628) !important;
    background-image: var(--pc-hero-overlay) !important;
    background-size: cover !important;
    background-position: center !important;
}

/* Hero inner content */
.nfd-container.is-style-nfd-theme-dark .nfd-gap-lg,
.wp-block-group[style*="background-color:#080c19"] > .wp-block-group {
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 6rem 2rem !important;
}

/* Hero headings: white regardless of mode */
.is-style-nfd-theme-dark h1,
.is-style-nfd-theme-dark h2,
.wp-block-group[style*="background-color:#080c19"] h1,
.wp-block-group[style*="background-color:#080c19"] h2 {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.is-style-nfd-theme-dark p:not(.wprevpro_t1_P_3),
.wp-block-group[style*="background-color:#080c19"] p:not(.wprevpro_t1_P_3) {
    color: rgba(255,255,255,0.9) !important;
}

/* Ensure all images in dark sections are visible */
.is-style-nfd-theme-dark .wp-block-image {
    display: block !important;
}

/* Dark sections without nfd-container (e.g. About Content) need a real background */
.is-style-nfd-theme-dark.wp-block-group:not(.nfd-container) {
    background-color: var(--pc-navy, #0a1628) !important;
}

/* Hero separators */
.is-style-nfd-theme-dark .wp-block-separator,
.wp-block-group[style*="background-color:#080c19"] .wp-block-separator {
    border: none !important;
    max-width: 200px !important;
    margin: 2rem auto !important;
    height: 3px !important;
    background: linear-gradient(90deg, #d9773a, #2BB2A6) !important;
    border-radius: 2px !important;
}

/* ===== SEPARATORS ===== */
main .wp-block-separator:not(.is-style-dots) {
    border: none !important;
    max-width: 200px !important;
    margin: 3rem auto !important;
    height: 3px !important;
    background: linear-gradient(90deg, #d9773a, #2BB2A6) !important;
    border-radius: 2px !important;
}

/* ===== PEST ICON GRID ===== */
.wp-block-columns.alignwide {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
    gap: 1.5rem !important;
}

.wp-block-columns.alignwide .wp-block-column {
    background-color: var(--pc-card-bg) !important;
    border: 1px solid var(--pc-card-border) !important;
    border-radius: var(--pc-radius-lg) !important;
    padding: 1.5rem !important;
    text-align: center !important;
    transition: transform var(--pc-transition), box-shadow var(--pc-transition), border-color var(--pc-transition);
    box-shadow: var(--pc-shadow-card) !important;
    margin: 0 !important;
}

.wp-block-columns.alignwide .wp-block-column:hover {
    transform: translateY(-6px) scale(1.02) !important;
    box-shadow: var(--pc-shadow-card-hover) !important;
    border-color: var(--pc-accent) !important;
}

.wp-block-columns.alignwide .wp-block-column img {
    max-width: 64px !important;
    height: auto !important;
    margin: 0 auto 1rem !important;
    display: block !important;
    transition: transform var(--pc-transition);
}

.wp-block-columns.alignwide .wp-block-column:hover img {
    transform: scale(1.1) rotate(-3deg);
}

.wp-block-columns.alignwide .wp-block-column p {
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    color: var(--pc-text) !important;
    margin: 0 !important;
}

/* ===== SERVICE CARDS ===== */
main .wp-block-columns:not(.alignwide) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 2rem !important;
}

main .wp-block-columns:not(.alignwide) .wp-block-column {
    background-color: var(--pc-card-bg) !important;
    border: 1px solid var(--pc-card-border) !important;
    border-radius: var(--pc-radius-lg) !important;
    padding: 3rem 2rem !important;
    transition: transform var(--pc-transition), box-shadow var(--pc-transition), border-color var(--pc-transition);
    box-shadow: var(--pc-shadow-card) !important;
    position: relative;
    overflow: hidden;
    margin: 0 !important;
}

main .wp-block-columns:not(.alignwide) .wp-block-column::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #d9773a, #2BB2A6);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 400ms ease;
}

main .wp-block-columns:not(.alignwide) .wp-block-column:hover {
    transform: translateY(-8px) !important;
    box-shadow: var(--pc-shadow-card-hover) !important;
    border-color: var(--pc-accent) !important;
}

main .wp-block-columns:not(.alignwide) .wp-block-column:hover::before {
    transform: scaleX(1);
}

main .wp-block-columns:not(.alignwide) .wp-block-column h3 a {
    color: var(--pc-heading) !important;
    text-decoration: none !important;
    transition: color var(--pc-transition);
}

main .wp-block-columns:not(.alignwide) .wp-block-column h3 a:hover {
    color: var(--pc-accent) !important;
}

main .wp-block-columns:not(.alignwide) .wp-block-column p {
    color: var(--pc-text-muted) !important;
    font-size: 0.9rem !important;
    line-height: 1.65 !important;
}

/* Service card text inside the hero section must respect card colors, not hero white */
main .is-style-nfd-theme-dark .wp-block-columns:not(.alignwide) .wp-block-column p,
main .wp-block-group[style*="background-color:#080c19"] .wp-block-columns:not(.alignwide) .wp-block-column p {
    color: var(--pc-text-muted) !important;
}

main .is-style-nfd-theme-dark .wp-block-columns:not(.alignwide) .wp-block-column h3,
main .wp-block-group[style*="background-color:#080c19"] .wp-block-columns:not(.alignwide) .wp-block-column h3 {
    color: var(--pc-heading) !important;
}

main .is-style-nfd-theme-dark .wp-block-columns:not(.alignwide) .wp-block-column h3 a,
main .wp-block-group[style*="background-color:#080c19"] .wp-block-columns:not(.alignwide) .wp-block-column h3 a {
    color: var(--pc-heading) !important;
}

/* ===== FAQ / HEADING ACCENTS ===== */
main h3.wp-block-heading {
    color: var(--pc-heading) !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    margin-top: 2rem !important;
    margin-bottom: 0.5rem !important;
    padding-left: 1rem !important;
    border-left: 3px solid var(--pc-accent) !important;
    transition: border-color var(--pc-transition), padding-left var(--pc-transition);
}

main h3.wp-block-heading:hover {
    border-left-width: 4px !important;
    padding-left: calc(1rem + 2px) !important;
}

main h3.wp-block-heading + p {
    color: var(--pc-text-muted) !important;
    padding-left: calc(1rem + 3px) !important;
}

/* FAQ inside dark hero: white text */
.is-style-nfd-theme-dark h3.wp-block-heading,
.wp-block-group[style*="background-color:#080c19"] h3.wp-block-heading {
    color: #ffffff !important;
}

.is-style-nfd-theme-dark h3.wp-block-heading + p,
.wp-block-group[style*="background-color:#080c19"] h3.wp-block-heading + p {
    color: rgba(255,255,255,0.85) !important;
}

/* ===== THEME TOGGLE BUTTON ===== */
#pc-theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: transparent;
    border: 1px solid var(--pc-border);
    border-radius: var(--pc-radius);
    padding: 0.5rem 0.85rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--pc-text);
    cursor: pointer;
    transition: all var(--pc-transition);
    line-height: 1;
    white-space: nowrap;
    margin-left: 1rem;
    font-family: inherit;
}

#pc-theme-toggle:hover {
    border-color: var(--pc-accent) !important;
    color: var(--pc-accent) !important;
    transform: translateY(-1px);
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

#pc-theme-toggle .pc-toggle-icon {
    font-size: 1rem;
    line-height: 1;
    transition: transform 400ms var(--pc-ease-bounce);
}

#pc-theme-toggle:hover .pc-toggle-icon {
    transform: rotate(180deg);
}

/* ===== SCROLL ANIMATIONS ===== */
.pc-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 600ms ease, transform 600ms var(--pc-ease-bounce);
}

.pc-reveal.pc-visible {
    opacity: 1;
    transform: translateY(0);
}

.pc-reveal:nth-child(1) { transition-delay: 0ms; }
.pc-reveal:nth-child(2) { transition-delay: 80ms; }
.pc-reveal:nth-child(3) { transition-delay: 160ms; }
.pc-reveal:nth-child(4) { transition-delay: 240ms; }
.pc-reveal:nth-child(5) { transition-delay: 320ms; }
.pc-reveal:nth-child(6) { transition-delay: 400ms; }

/* ===== ANIMATIONS ===== */
@keyframes pc-fade-up {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

.is-style-nfd-theme-dark h1,
.wp-block-group[style*="background-color:#080c19"] h1 {
    animation: pc-fade-up 800ms ease 100ms both;
}

.is-style-nfd-theme-dark h2,
.wp-block-group[style*="background-color:#080c19"] h2 {
    animation: pc-fade-up 800ms ease 250ms both;
}

.is-style-nfd-theme-dark p,
.wp-block-group[style*="background-color:#080c19"] p {
    animation: pc-fade-up 800ms ease 400ms both;
}

.is-style-nfd-theme-dark .wp-block-buttons,
.wp-block-group[style*="background-color:#080c19"] .wp-block-buttons {
    animation: pc-fade-up 800ms ease 550ms both;
}

/* ===== FOOTER ===== */
.pc-footer {
    background-color: var(--pc-footer-bg) !important;
    color: var(--pc-footer-text) !important;
}

.pc-footer p, .pc-footer a, .pc-footer span, .pc-footer time, .pc-footer strong, .pc-footer li {
    color: var(--pc-footer-text) !important;
}

.pc-footer a:hover {
    color: var(--pc-footer-link-hover) !important;
}

.pc-footer-logo img {
    max-width: 200px;
    height: auto;
}

/* ===== ACCESSIBILITY ===== */
a:focus-visible,
button:focus-visible,
.wp-block-button__link:focus-visible {
    outline: 2px solid var(--pc-accent) !important;
    outline-offset: 2px !important;
}

/* ===== YOAST BREADCRUMBS ===== */
nav.yoast-breadcrumbs {
    font-size: 0.85em !important;
    color: var(--pc-text-muted) !important;
    padding: 8px 0 4px 0 !important;
    margin-bottom: 8px !important;
    border-bottom: 1px solid var(--pc-border) !important;
}

nav.yoast-breadcrumbs a {
    color: var(--pc-link) !important;
    text-decoration: none !important;
}

nav.yoast-breadcrumbs a:hover {
    color: var(--pc-link-hover) !important;
    text-decoration: underline !important;
}

nav.yoast-breadcrumbs span {
    color: var(--pc-text-faded) !important;
}

/* ===== REVIEW PLUGIN COMPATIBILITY ===== */
.w3_wprs-row-padding {
    display: flex !important;
    flex-wrap: wrap !important;
}

.w3_wprs-col.l4 {
    width: 33.333% !important;
    float: none !important;
    flex: 0 0 33.333% !important;
    max-width: 33.333% !important;
    box-sizing: border-box !important;
}

@media (max-width: 600px) {
    .w3_wprs-col.l4 {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

.wprevpro_usetemplate {
    max-width: 1000px !important;
    margin: 3rem auto !important;
    padding: 3rem !important;
    background: var(--pc-card-bg) !important;
    border: 1px solid var(--pc-card-border) !important;
    border-radius: var(--pc-radius-lg) !important;
    box-shadow: var(--pc-shadow-card) !important;
}

.wprevpro_t1_DIV_2 {
    background: #ffffff !important;
    border-color: #e2e8f0 !important;
}

/* Force review text dark on white card */
p.wprevpro_t1_P_3,
p.wprevpro_t1_P_3 span,
.wprevpro_usetemplate p.wprevpro_t1_P_3,
.wprevpro_usetemplate p.wprevpro_t1_P_3 span {
    color: #334155 !important;
}

.wprevpro_t1_P_3 .wprevpro_star_imgs svg,
.wprevpro_t1_P_3 .svgicons svg,
.wprevpro_t1_P_3 .starloc1 svg {
    color: #f59e0b !important;
    fill: #f59e0b !important;
}

/* Light mode: names on white section bg */
.wprevpro_t1_SPAN_5 {
    color: #1e293b !important;
}

.wprevpro_t1_SPAN_5 span {
    color: #64748b !important;
}

/* Dark mode: names on dark section bg */
:root[data-theme="dark"] .wprevpro_t1_SPAN_5 {
    color: #ffffff !important;
}

:root[data-theme="dark"] .wprevpro_t1_SPAN_5 span {
    color: rgba(255, 255, 255, 0.75) !important;
}

.wprevpro_t1_P_3 .wprevpro_verified_svg svg {
    color: #2BB2A6 !important;
    fill: #2BB2A6 !important;
}

.wprevpro_t1_DIV_2::before {
    color: #d9773a !important;
}

.wprevpro_t1_DIV_2::after {
    border-top-color: #ffffff !important;
}

.wprevpro_t1_P_3 .wprs_rd_more {
    color: var(--pc-link) !important;   /* D2 fix: was #d9773a (3.16:1); var resolves #A94A10 = 5.72:1 */
    cursor: pointer;
}

/* ===== RESPONSIVE: MOBILE ===== */
html {
    overflow-x: clip !important;
}

/* Hide nav-internal CTA on mobile (it's in the overlay) */
header .pc-header-cta {
    display: flex;
}

/* Mobile CTA clone: hidden on desktop, shown inside overlay only */
.pc-mobile-cta {
    display: none !important;
}

@media (max-width: 782px) {
    /* Header layout: logo left, hamburger centered, toggle right */
    header .wp-block-group,
    header .pc-header {
        flex-wrap: nowrap !important;
        gap: 0 !important;
        justify-content: space-between !important;
        align-items: center !important;
        position: relative !important;
    }

    header .pc-header-nav-toggle {
        flex-wrap: nowrap !important;
        gap: 0.5rem !important;
        width: 100% !important;
        justify-content: center !important;
        align-items: center !important;
        flex-shrink: 0 !important;
        position: relative !important;
    }

    /* Theme toggle: pinned to the far right */
    #pc-theme-toggle {
        position: absolute !important;
        right: 0.75rem !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin-left: 0 !important;
        padding: 0.3rem 0.5rem !important;
        font-size: 0.7rem !important;
    }

    /* Logo stays on the left, overlays the centered nav area */
    header .wp-block-site-logo,
    header .pc-site-logo {
        position: absolute !important;
        left: 0.75rem !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 1 !important;
    }

    /* Hide desktop CTA on mobile (shown in menu overlay) */
    header .pc-header-cta {
        display: none !important;
    }

    /* Hamburger: always visible on mobile */
    header .wp-block-navigation__responsive-container-open {
        display: flex !important;
        padding: 0.5rem !important;
    }

    /* Hide the inline nav items on mobile, they belong in the custom overlay only */
    header .wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item {
        display: none !important;
    }

    /* Custom hamburger button */
    #pc-hamburger {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: none !important;
        border: none !important;
        cursor: pointer !important;
        padding: 0.5rem !important;
        color: var(--pc-header-text, #0f172a) !important;
    }

    #pc-hamburger svg {
        width: 24px !important;
        height: 24px !important;
        fill: currentColor !important;
    }

    /* Prevent body scroll when menu is open */
    body.pc-menu-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
    }

    /* Mobile menu overlay: full-screen */
    .wp-block-navigation__responsive-container.is-menu-open {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 100000 !important;
        padding: 1rem !important;
        padding-top: 4rem !important;
        overflow-y: auto !important;
        background-color: var(--pc-surface, #ffffff) !important;
    }

    :root[data-theme="dark"] .wp-block-navigation__responsive-container.is-menu-open {
        background-color: var(--pc-surface, #152544) !important;
    }

    /* Menu close button */
    .wp-block-navigation__responsive-container-close {
        z-index: 100001 !important;
        position: absolute !important;
        top: 1rem !important;
        right: 1rem !important;
    }

    /* Menu items */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
        padding-top: 1.5rem !important;
        width: 100% !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__container {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
        width: 100% !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation-item {
        padding: 0.75rem 0 !important;
        width: 100% !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation-item__label {
        font-size: 1.15rem !important;
        color: var(--pc-text) !important;
    }

    /* Submenu in mobile, hidden by default, shown when pc-submenu-open */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content
        .has-child > .wp-block-navigation__submenu-container {
        position: static !important;
        width: 100% !important;
        padding-left: 1rem !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        height: auto !important;
        min-width: 0 !important;
        overflow: initial !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content
        .has-child.pc-submenu-open > .wp-block-navigation__submenu-container {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    /* Make "Service Areas" row look clickable in mobile overlay */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content
        .has-child > .wp-block-navigation-item__content {
        cursor: pointer !important;
    }

    /* Show chevron rotation in mobile overlay */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content
        .has-child.pc-submenu-open > .wp-block-navigation__submenu-icon {
        transform: rotate(180deg) !important;
    }

    /* CTA in mobile menu */
    .wp-block-navigation__responsive-container.is-menu-open
        .pc-mobile-cta {
        display: flex !important;
        width: 100% !important;
        justify-content: center !important;
        margin-top: 1.5rem !important;
        padding-top: 1.5rem !important;
        border-top: 1px solid var(--pc-border) !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .pc-mobile-cta .wp-block-button {
        width: 100% !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .pc-mobile-cta .wp-block-button__link {
        width: 100% !important;
        text-align: center !important;
        font-size: 1rem !important;
        padding: 0.85rem 1.5rem !important;
    }

    /* Logo smaller on mobile, prevent squishing */
    header .wp-block-site-logo img,
    header .pc-site-logo img,
    header img.custom-logo {
        max-height: 40px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    /* Service cards: single column */
    body main .wp-block-columns:not(.alignwide) {
        grid-template-columns: 1fr !important;
    }

    /* Pest icons: 2 columns */
    body .wp-block-columns.alignwide {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* Hero: constrain to viewport */
    .nfd-container.is-style-nfd-theme-dark .nfd-gap-lg,
    .wp-block-group[style*="background-color:#080c19"] > .wp-block-group {
        max-width: 100% !important;
        padding: 4rem 1rem !important;
        box-sizing: border-box !important;
    }

    /* Override alignwide on mobile */
    .alignwide {
        max-width: 100% !important;
    }

    /* Force border-box on mobile */
    *, *::before, *::after {
        box-sizing: border-box !important;
    }

    /* Keep horizontal padding on mobile (was zeroed before, which pushed
       sub-page text edge-to-edge; homepage blocks carried their own
       padding so only sub-pages looked broken) */
    main.has-global-padding {
        padding-left: clamp(1.25rem, 4vw, 2.5rem) !important;
        padding-right: clamp(1.25rem, 4vw, 2.5rem) !important;
    }

    .entry-content.has-global-padding {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Hero headings: no overflow */
    .is-style-nfd-theme-dark h1,
    .wp-block-group[style*="background-color:#080c19"] h1 {
        word-break: break-word !important;
        hyphens: auto !important;
        font-size: clamp(1.5rem, 6vw, 2rem) !important;
    }

    .is-style-nfd-theme-dark h2,
    .wp-block-group[style*="background-color:#080c19"] h2 {
        font-size: clamp(1.1rem, 4vw, 1.4rem) !important;
    }

    /* Section spacing */
    main .wp-block-group {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
}

@media (max-width: 480px) {
    .wp-block-columns.alignwide .wp-block-column {
        min-width: 0 !important;
    }

    .is-style-nfd-theme-dark .wp-block-buttons .wp-block-button__link,
    .wp-block-group[style*="background-color:#080c19"] .wp-block-buttons .wp-block-button__link {
        width: 100% !important;
        font-size: 0.95rem !important;
        padding: 0.85rem 1.25rem !important;
    }

    .is-style-nfd-theme-dark .wp-block-buttons,
    .wp-block-group[style*="background-color:#080c19"] .wp-block-buttons {
        width: 100% !important;
    }

    header .wp-block-site-logo img,
    header .pc-site-logo img,
    header img.custom-logo {
        max-height: 32px !important;
    }
}

/* ===== WPFORMS RESPONSIVE ===== */
.wpforms-container,
.wpforms-container .wpforms-form {
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: hidden !important;
}

.wpforms-container .wpforms-form .wpforms-field {
    max-width: 100% !important;
    width: 100% !important;
}

.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container input[type="number"],
.wpforms-container input[type="url"],
.wpforms-container input[type="password"],
.wpforms-container textarea,
.wpforms-container select {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Stack First/Last name fields on mobile */
@media (max-width: 600px) {
    .wpforms-container .wpforms-field-name-first,
    .wpforms-container .wpforms-field-name-last {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    .wpforms-container .wpforms-field-name {
        flex-direction: column !important;
    }
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition: none !important;
        animation: none !important;
    }
    .pc-reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* The redesigned chrome (tokens, header, nav, buttons, footer, motion) now
   lives in assets/css/ydh-design.css, loaded after this file. This file keeps
   the v1 compatibility layer for legacy sub-page markup. */