/* ============================================================
   YDWP INTERIOR PAGE SECTIONS  (assets/css/ydh-page.css)
   Page-specific section styles for every non-home page that uses
   the redesigned chrome: service pages, city pages, /service-areas/,
   /about/, /contact/, /blog/, blog posts, archives, search, 404.

   Every rule is scoped under main.ydh-page (the interior page shell)
   so the approved homepage is untouched. The shared design system
   (tokens, header, footer, buttons, motion) lives in
   assets/css/ydh-design.css and loads on every page.

   Palette per redesign spec v1: ink/orange/charcoal, no teal.
   Contrast: body copy #3A3631 on #FFFFFF = 12.6:1; muted #6E6760 on
   #FFFFFF = 5.5:1; hero copy #C9C2B8 on #16130F = 10.5:1; eyebrow
   #F0A868 on #16130F = 7.6:1; ink #14120F on orange #D2601A = 4.83:1.
   All body pairs >= 4.5:1, all large text >= 3:1.
   ============================================================ */

/* ---------- Page shell ---------- */

main.ydh-page {
    padding-left: 0 !important;
    padding-right: 0 !important;
    color: var(--ydh-body, #3A3631);
    font-family: var(--ydh-font-body, 'Inter', sans-serif);
    line-height: 1.65;
    background: #FFFFFF;
}

/* The post content wrapper ships alignfull, which makes it bleed past the root
   padding by ~27px a side and pushes documentElement.scrollWidth past the
   viewport even though html has overflow-x: clip. Keep it as a centred content
   column instead; the sections inside still reach the viewport edges through
   their own calc(50% - 50vw) full-bleed rule. */
main.ydh-page > .wp-block-post-content.alignfull,
main.ydh-page > .entry-content.alignfull,
main.ydh-page > .wp-block-post-content,
main.ydh-page > .entry-content {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: min(1200px, 100% - clamp(2.5rem, 8vw, 5rem)) !important;
}

/* Full-bleed sections must escape the constrained root padding */
main.ydh-page > .wp-block-group.alignfull,
main.ydh-page .wp-block-post-content > .wp-block-group.alignfull,
main.ydh-page .entry-content > .wp-block-group.alignfull {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    max-width: 100vw !important;
}

/* v1 typography guard: custom.css sets every heading to --pc-heading with
   !important and gives h3 a left orange rule. Interior sections own their own
   heading treatment, so re-assert it here with equal or higher specificity. */
main.ydh-page h1,
main.ydh-page h2,
main.ydh-page h3,
main.ydh-page h4 {
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    color: var(--ydh-ink, #14120F);
    letter-spacing: -0.02em;
    line-height: 1.18;
}

main.ydh-page h3.wp-block-heading {
    border-left: none !important;
    padding-left: 0 !important;
    margin-top: 0 !important;
}

main.ydh-page .wp-block-separator {
    display: none !important;
}

/* Bare <img> tags inside wp:html blocks get no constraint from core block CSS,
   so an intrinsic 1024px photo would force a 1044px layout viewport on a 390px
   phone and shrink the whole page. Constrain every content image. */
main.ydh-page img {
    max-width: 100%;
    height: auto;
}

main.ydh-page .ydh-about-intro img {
    border-radius: 14px;
    border: 1px solid var(--ydh-line, #E8E3DC);
}

/* The custom-link-colors mu-plugin injects a teal hover at (0,2,2) after the
   stylesheets. These selectors sit at (0,3,2), so the brand pair wins. */
main.ydh-page a:not(.wp-block-button__link):not(.wp-element-button) {
    color: var(--ydh-orange-deep, #A94A10) !important;
    font-weight: 500;
}

main.ydh-page a:not(.wp-block-button__link):not(.wp-element-button):hover {
    color: #7E3608 !important;
    text-decoration: underline !important;
}

/* ---------- Interior hero (shorter version of the homepage hero) ---------- */

main.ydh-page .ydh-page-hero {
    background:
        radial-gradient(720px 360px at 84% -18%, rgba(210, 96, 26, 0.20) 0%, rgba(210, 96, 26, 0) 62%),
        #16130F;
    color: #F7F5F2;
    padding: clamp(2.1rem, 5vw, 3.4rem) 0 clamp(1.9rem, 4vw, 3rem);
}

main.ydh-page .ydh-page-hero-inner,
main.ydh-page .ydh-section-inner,
main.ydh-page .ydh-final-inner,
main.ydh-page .ydh-crumbs-inner {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(1.25rem, 4vw, 2.5rem);
    padding-right: clamp(1.25rem, 4vw, 2.5rem);
    box-sizing: border-box;
}

main.ydh-page .ydh-page-hero h1,
main.ydh-page .ydh-page-hero .ydh-page-title {
    color: #F7F5F2 !important;
    font-weight: 800;
    font-size: clamp(1.75rem, 3.4vw, 2.85rem);
    max-width: 26ch;
    margin: 0.35rem 0 0;
}

main.ydh-page .ydh-page-hero .ydh-eyebrow {
    color: #F0A868 !important;
    margin-bottom: 0.2rem !important;
}

main.ydh-page .ydh-page-hero .ydh-lede {
    color: #C9C2B8;
    max-width: 66ch;
    margin: 0.9rem 0 0;
    font-size: clamp(1rem, 1.25vw, 1.1rem);
}

main.ydh-page .ydh-page-hero .ydh-hero-ctas {
    margin: 1.4rem 0 0;
    gap: 0.7rem;
}

main.ydh-page .ydh-page-hero .ydh-hero-ctas .wp-block-button {
    margin: 0;
}

main.ydh-page .ydh-page-chips,
main.ydh-page .ydh-chips {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1.2rem 0 0;
    padding: 0;
}

main.ydh-page .ydh-chip {
    display: inline-flex;
    align-items: center;
    border: 1px solid #2A231C;
    background: #221D18;
    color: #E8E3DC;
    border-radius: 999px;
    padding: 0.35rem 0.85rem;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Hero with a supporting image on wide screens */
main.ydh-page .ydh-page-hero--split .ydh-page-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
}

main.ydh-page .ydh-page-hero-media img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
    border: 1px solid #2A231C;
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.45);
}

@media (max-width: 900px) {
    main.ydh-page .ydh-page-hero--split .ydh-page-hero-inner {
        grid-template-columns: 1fr;
    }
    main.ydh-page .ydh-page-hero-media {
        order: -1;
    }
}

/* ---------- Breadcrumbs (rendered by the theme breadcrumb shim) ---------- */

main.ydh-page .ydh-crumbs {
    background: var(--ydh-mist, #F7F5F2);
    border-bottom: 1px solid var(--ydh-line, #E8E3DC);
    font-size: 0.82rem;
}

main.ydh-page .ydh-crumbs nav.yoast-breadcrumbs,
main.ydh-page .ydh-crumbs .yoast-breadcrumbs {
    padding: 0.6rem 0 !important;
    margin: 0 !important;
    border: none !important;
    color: var(--ydh-muted, #6E6760) !important;
    background: none !important;
    max-width: 1200px;
    margin-left: auto !important;
    margin-right: auto !important;
}

main.ydh-page .ydh-crumbs a {
    color: var(--ydh-orange-deep, #A94A10) !important;
}

/* ---------- Sections ---------- */

main.ydh-page .ydh-section {
    padding: clamp(2.6rem, 5.5vw, 4.4rem) 0;
}

main.ydh-page .ydh-section--mist {
    background: var(--ydh-mist, #F7F5F2);
    border-top: 1px solid var(--ydh-line, #E8E3DC);
    border-bottom: 1px solid var(--ydh-line, #E8E3DC);
}

main.ydh-page .ydh-section--tight {
    padding: clamp(1.8rem, 3.5vw, 2.8rem) 0;
}

main.ydh-page .ydh-section h2 {
    font-weight: 700;
    font-size: clamp(1.4rem, 2.5vw, 2.05rem);
    margin: 0 0 0.9rem;
    max-width: 34ch;
}

main.ydh-page .ydh-section p {
    margin: 0 0 1rem;
    max-width: 74ch;
}

main.ydh-page .ydh-section p:last-child {
    margin-bottom: 0;
}

main.ydh-page .ydh-section .ydh-eyebrow,
main.ydh-page .ydh-final-inner .ydh-eyebrow {
    color: var(--ydh-orange-deep, #A94A10) !important;
    font-family: var(--ydh-font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0 0 0.45rem;
}

main.ydh-page .ydh-statrow {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.2rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

main.ydh-page .ydh-statrow li {
    border-left: 3px solid var(--ydh-orange, #D2601A);
    padding: 0.2rem 0 0.2rem 0.9rem;
    color: var(--ydh-body, #3A3631);
    font-size: 0.95rem;
    line-height: 1.5;
}

main.ydh-page .ydh-statrow strong {
    display: block;
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    color: var(--ydh-ink, #14120F);
    font-size: 1.05rem;
}

/* ---------- Pest list (service and city pages) ---------- */

main.ydh-page .ydh-pest-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem 1.6rem;
    margin: 1.2rem 0 0;
    padding: 0;
    list-style: none;
}

main.ydh-page .ydh-pest-list li {
    background: #FFFFFF;
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 12px;
    padding: 1rem 1.1rem;
    color: var(--ydh-body, #3A3631);
    font-size: 0.95rem;
}

main.ydh-page .ydh-section--mist .ydh-pest-list li {
    background: #FFFFFF;
}

main.ydh-page .ydh-pest-list strong {
    display: block;
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    color: var(--ydh-ink, #14120F);
    font-size: 1.02rem;
    margin-bottom: 0.2rem;
}

/* ---------- Check list ---------- */

main.ydh-page .ydh-checks {
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.55rem;
}

main.ydh-page .ydh-checks li {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    color: var(--ydh-body, #3A3631);
}

main.ydh-page .ydh-check-dot {
    flex: 0 0 auto;
    width: 1.15rem;
    height: 1.15rem;
    margin-top: 0.25rem;
    border-radius: 50%;
    background: var(--ydh-orange-tint, #FDF1E7);
    color: var(--ydh-orange-deep, #A94A10);
    font-size: 0.72rem;
    line-height: 1.15rem;
    text-align: center;
    font-weight: 700;
}

/* ---------- Service link grid ---------- */

main.ydh-page .ydh-linkgrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0.9rem;
    margin: 1.2rem 0 0;
    padding: 0;
    list-style: none;
}

main.ydh-page a.ydh-linkcard {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    background: #FFFFFF;
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 12px;
    padding: 0.95rem 1.1rem;
    color: var(--ydh-ink, #14120F) !important;
    font-family: var(--ydh-font-body, 'Inter', sans-serif);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none !important;
    transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

main.ydh-page a.ydh-linkcard:hover {
    transform: translateY(-3px);
    border-color: var(--ydh-orange, #D2601A);
    box-shadow: 0 10px 26px rgba(20, 18, 15, 0.10);
    color: var(--ydh-ink, #14120F) !important;
    text-decoration: none !important;
}

main.ydh-page a.ydh-linkcard .ydh-linkcard-arrow {
    color: var(--ydh-orange-deep, #A94A10);
    font-weight: 700;
}

/* ---------- Map ---------- */

main.ydh-page .ydh-map {
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 14px;
    overflow: hidden;
    background: #FFFFFF;
    max-width: 100%;
}

main.ydh-page .ydh-map iframe {
    display: block;
    width: 100%;
    height: clamp(240px, 38vw, 380px);
    border: 0;
}

/* ---------- FAQ (details/summary, same interaction as the homepage) ---------- */

main.ydh-page .ydh-faq-list {
    margin: 1.2rem 0 0;
    display: grid;
    gap: 0.6rem;
}

/* Group label between FAQ lists: a wp:heading block between two wp:html FAQ
   lists renders as an unstyled float between the card stacks, so group
   sub-headings are part of the list block instead (ydh-faq-subhead). */
main.ydh-page .ydh-faq-subhead {
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    color: var(--ydh-ink, #14120F);
    font-weight: 600;
    font-size: 1.1rem;
    margin: 1.6rem 0 0.6rem;
}

main.ydh-page .ydh-faq-item {
    background: #FFFFFF;
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
}

main.ydh-page .ydh-faq-item summary {
    cursor: pointer;
    list-style: none;
    padding: 0.95rem 1.15rem;
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--ydh-ink, #14120F);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
}

main.ydh-page .ydh-faq-item summary::-webkit-details-marker {
    display: none;
}

main.ydh-page .ydh-faq-item summary::after {
    content: '+';
    flex: 0 0 auto;
    color: var(--ydh-orange-deep, #A94A10);
    font-size: 1.25rem;
    line-height: 1;
}

main.ydh-page .ydh-faq-item[open] summary::after {
    content: '\2013';
}

main.ydh-page .ydh-faq-item p {
    padding: 0 1.15rem 1.05rem;
    margin: 0 !important;
    color: var(--ydh-body, #3A3631);
    max-width: none;
}

/* ---------- Nearby city links ---------- */

main.ydh-page .ydh-nearby {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1rem 0 0;
    padding: 0;
}

main.ydh-page .ydh-nearby a {
    display: inline-flex;
    border: 1px solid var(--ydh-line, #E8E3DC);
    background: #FFFFFF;
    border-radius: 999px;
    padding: 0.4rem 0.9rem;
    font-size: 0.88rem;
    font-weight: 600;
}

/* ---------- Final CTA band ---------- */

main.ydh-page .ydh-final {
    background: #16130F;
    color: #F7F5F2;
    padding: clamp(2.4rem, 5vw, 3.6rem) 0;
}

main.ydh-page .ydh-final h2 {
    color: #F7F5F2 !important;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 30ch;
}

main.ydh-page .ydh-final p {
    color: #C9C2B8;
    text-align: center;
    max-width: 58ch;
    margin-left: auto;
    margin-right: auto;
}

main.ydh-page .ydh-final .ydh-hero-ctas {
    margin-top: 1.4rem;
    gap: 0.7rem;
}

main.ydh-page .ydh-final .wp-block-button {
    margin: 0;
}

/* ---------- Reviews (plugin container, shared) ---------- */

main.ydh-page .wprevpro_usetemplate {
    margin: 1.6rem auto !important;
}

/* ---------- Blog: article pages stay readable ---------- */

main.ydh-page .ydh-article {
    background: #FFFFFF;
}

main.ydh-page .ydh-article-inner {
    max-width: 780px;
    margin: 0 auto;
    padding-left: clamp(1.25rem, 4vw, 2.5rem);
    padding-right: clamp(1.25rem, 4vw, 2.5rem);
    padding-bottom: clamp(2.5rem, 5vw, 4rem);
    box-sizing: border-box;
}

main.ydh-page .ydh-article .wp-block-post-title,
main.ydh-page .ydh-article h1 {
    font-size: clamp(1.6rem, 3vw, 2.3rem);
    text-align: left;
    margin: 0 0 0.6rem;
}

main.ydh-page .ydh-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.1rem;
    align-items: center;
    color: var(--ydh-muted, #6E6760);
    font-size: 0.86rem;
    border-bottom: 1px solid var(--ydh-line, #E8E3DC);
    padding-bottom: 0.9rem;
    margin-bottom: 1.4rem;
}

main.ydh-page .ydh-article p,
main.ydh-page .ydh-article li {
    color: #33302C;
    font-size: 1.02rem;
    line-height: 1.75;
}

main.ydh-page .ydh-article h2 {
    font-size: clamp(1.25rem, 2vw, 1.6rem);
    margin: 2rem 0 0.6rem;
    max-width: none;
}

main.ydh-page .ydh-article h3 {
    font-size: clamp(1.08rem, 1.6vw, 1.25rem);
    margin: 1.5rem 0 0.5rem;
    max-width: none;
}

main.ydh-page .ydh-article img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

main.ydh-page .ydh-article ul,
main.ydh-page .ydh-article ol {
    padding-left: 1.3rem;
}

main.ydh-page .ydh-article blockquote {
    border-left: 3px solid var(--ydh-orange, #D2601A);
    background: var(--ydh-mist, #F7F5F2);
    margin: 1.4rem 0;
    padding: 0.9rem 1.2rem;
    color: var(--ydh-ink, #14120F);
}

main.ydh-page .ydh-article .wp-block-post-featured-image {
    margin: 0 0 1.4rem;
}

/* ---------- Post index, archive and search results ---------- */

main.ydh-page .ydh-posts {
    list-style: none;
    margin: 1.4rem 0 0;
    padding: 0;
    display: grid;
    gap: 1rem;
}

main.ydh-page .ydh-posts li {
    background: #FFFFFF;
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 12px;
    padding: 1.1rem 1.25rem;
    transition: transform 220ms ease, box-shadow 220ms ease;
}

main.ydh-page .ydh-posts li:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(20, 18, 15, 0.10);
}

main.ydh-page .ydh-post-title,
main.ydh-page .ydh-posts h2,
main.ydh-page .ydh-posts h3 {
    display: block;
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    font-size: clamp(1.1rem, 1.8vw, 1.35rem);
    margin: 0 0 0.35rem;
    max-width: none;
}

main.ydh-page .ydh-post-title a {
    color: var(--ydh-ink, #14120F) !important;
    text-decoration: none !important;
}

main.ydh-page .ydh-post-title a:hover {
    color: var(--ydh-orange-deep, #A94A10) !important;
}

main.ydh-page .ydh-post-date {
    display: block;
    color: var(--ydh-muted, #6E6760);
    font-size: 0.84rem;
    margin-bottom: 0.4rem;
}

main.ydh-page .ydh-post-excerpt {
    color: var(--ydh-body, #3A3631);
    margin: 0;
    max-width: 74ch;
}

main.ydh-page .wp-block-query-pagination {
    margin-top: 1.6rem;
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
    align-items: center;
}

main.ydh-page .wp-block-query-pagination a,
main.ydh-page .wp-block-query-pagination .page-numbers {
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 8px;
    padding: 0.4rem 0.8rem;
    text-decoration: none !important;
}

main.ydh-page .wp-block-query-pagination .current {
    background: var(--ydh-orange, #D2601A);
    border-color: var(--ydh-orange, #D2601A);
    color: var(--ydh-ink, #14120F) !important;
    font-weight: 700;
}

/* ---------- 404 ---------- */

main.ydh-page .ydh-404 {
    text-align: center;
}

main.ydh-page .ydh-404 .ydh-404-code {
    display: block;
    font-family: var(--ydh-font-display, 'Outfit', sans-serif);
    font-size: clamp(3rem, 9vw, 5.5rem);
    font-weight: 800;
    line-height: 1;
    color: var(--ydh-orange, #D2601A);
    margin-bottom: 0.4rem;
}

main.ydh-page .ydh-404 p {
    margin-left: auto;
    margin-right: auto;
}

main.ydh-page .ydh-404 .wp-block-search {
    max-width: 460px;
    margin: 1.4rem auto 0;
}

main.ydh-page .ydh-404 .wp-block-search__input {
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 999px 0 0 999px;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    width: 100%;
}

main.ydh-page .ydh-404 .wp-block-search__button {
    border-radius: 0 999px 999px 0;
    background: var(--ydh-orange, #D2601A) !important;
    color: var(--ydh-ink, #14120F) !important;
    font-weight: 700;
    padding: 0.7rem 1.2rem;
}

main.ydh-page .ydh-404-routes {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
    margin: 1.6rem 0 0;
    padding: 0;
}

main.ydh-page .ydh-404-routes a {
    display: inline-flex;
    border: 1px solid var(--ydh-line, #E8E3DC);
    border-radius: 999px;
    padding: 0.5rem 1rem;
    font-weight: 600;
    text-decoration: none !important;
}

/* ---------- WPForms: match the design system ---------- */

/* The contact form shipped with the previous dark palette stored twice: in the
   form 120 theme and in the contact page's form block attributes. That produced
   #ffffff labels and #ffffff field text on a #ffffff field, a measured 1.00:1,
   so the labels and anything typed were invisible. Both stored copies are
   corrected to the tokens below. These declarations pin the same pairs in the
   theme. They carry !important because the plugin prints its own ID qualified
   variable block (#wpforms-120.wpforms-block-<uuid>) whose specificity beats a
   plain class selector, so a later form edit cannot bring white on white back.
   Scoped to the interior page shell, so nothing outside the form is affected. */

main.ydh-page .wpforms-form {
    --wpforms-label-color: var(--ydh-ink) !important;
    --wpforms-label-sublabel-color: var(--ydh-muted) !important;
    --wpforms-field-text-color: var(--ydh-ink) !important;
    --wpforms-field-background-color: #FFFFFF !important;
    --wpforms-field-border-color: var(--ydh-line) !important;
    --wpforms-field-border-color-spare: var(--ydh-line) !important;
    --wpforms-field-menu-color: var(--ydh-ink) !important;
    --wpforms-button-background-color: var(--ydh-orange) !important;
    --wpforms-button-border-color: var(--ydh-orange) !important;
    --wpforms-button-text-color: var(--ydh-ink) !important;
    --wpforms-page-break-color: var(--ydh-orange-deep) !important;
}

main.ydh-page .wpforms-form .wpforms-field-label {
    color: var(--ydh-ink);
}

main.ydh-page .wpforms-form .wpforms-field-sublabel {
    color: var(--ydh-muted);
}

main.ydh-page .wpforms-form input::placeholder,
main.ydh-page .wpforms-form textarea::placeholder {
    color: var(--ydh-muted);
    opacity: 1;
}

main.ydh-page .wpforms-form .wpforms-submit {
    background-color: var(--ydh-orange);
    border-color: var(--ydh-orange);
    color: var(--ydh-ink);
    font-weight: 600;
}

main.ydh-page .wpforms-form .wpforms-submit:hover,
main.ydh-page .wpforms-form .wpforms-submit:focus {
    background-color: var(--ydh-orange-600);
    border-color: var(--ydh-orange-600);
    color: var(--ydh-ink);
}

/* Required fields: the plugin's asterisk keeps its own error colour (#d63637,
   measured 4.73:1 on white) and the label also gains a visible word, so the
   asterisk is never the only signal that a field is required. The input keeps
   the native required and aria-required attributes for assistive tech. */
main.ydh-page .wpforms-form .wpforms-field-label:has(.wpforms-required-label)::after {
    content: " (required)";
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--ydh-muted);
}

/* ---------- Reveal motion for interior pages ---------- */

html.ydh-js main.ydh-page .ydh-reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 500ms ease-out, transform 500ms ease-out;
}

html.ydh-js main.ydh-page .ydh-reveal.ydh-in-view {
    opacity: 1;
    transform: translateY(0);
}

html.ydh-js main.ydh-page .ydh-stagger > * {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 500ms ease-out, transform 500ms ease-out;
    transition-delay: var(--ydh-d, 0ms);
}

html.ydh-js main.ydh-page .ydh-stagger.ydh-in-view > * {
    opacity: 1;
    transform: translateY(0);
}

/* ---------- Responsive ---------- */

@media (max-width: 782px) {
    main.ydh-page .ydh-page-hero {
        padding-top: 1.8rem;
    }

    main.ydh-page .ydh-section {
        padding: 2.2rem 0;
    }

    main.ydh-page .ydh-page-hero h1 {
        font-size: clamp(1.5rem, 6.4vw, 2rem);
        max-width: none;
    }

    main.ydh-page .ydh-pest-list,
    main.ydh-page .ydh-linkgrid,
    main.ydh-page .ydh-statrow {
        grid-template-columns: 1fr;
    }

    main.ydh-page .ydh-article p,
    main.ydh-page .ydh-article li {
        font-size: 1rem;
    }
}

/* ---------- Centered text convention (matches homepage text blocks) ----------
   Homepage text sections render centred; non-home pages use the same
   convention. Scoped under main.ydh-page so the front page (main.ydh-main,
   ydh-home.css) is untouched. Controls inside forms keep their own alignment
   (inputs get text-align:center from the browser default of start via this
   inheritance otherwise, so re-assert start on form controls). */

main.ydh-page .ydh-page-hero-inner,
main.ydh-page .ydh-section-inner,
main.ydh-page .ydh-final-inner {
    text-align: center;
}

main.ydh-page .ydh-page-hero h1,
main.ydh-page .ydh-page-hero .ydh-page-title,
main.ydh-page .ydh-section h2,
main.ydh-page .ydh-section h3 {
    margin-left: auto;
    margin-right: auto;
}

main.ydh-page .ydh-section p,
main.ydh-page .ydh-section ul,
main.ydh-page .ydh-final p {
    margin-left: auto;
    margin-right: auto;
}

/* Lists keep dot markers visible with centred text: restore the bullets that
   the theme's list reset removed and pull them in proportionally. */
main.ydh-page .ydh-section ul.ydh-pest-list,
main.ydh-page .ydh-section ul {
    list-style: none;
    padding-left: 0;
}

/* Keep list items readable left-aligned (marker-less chips): center the
   inner text of items instead. */
main.ydh-page .ydh-pest-list li,
main.ydh-page .ydh-checks li {
    text-align: center;
}

/* Do NOT centre form controls, buttons, or table cells. */
main.ydh-page input,
main.ydh-page textarea,
main.ydh-page select {
    text-align: left !important;
}

/* Center button rows and tag/chip rows to match the centred text above.
   The buttons container is a flex row (WP layout-flex) and inherits
   text-align only in effect, not box position, so centre it explicitly.
   .ydh-header-cta (header CTA, not page content) is excluded. */
main.ydh-page .ydh-hero-ctas,
main.ydh-page .ydh-section-inner .wp-block-buttons,
main.ydh-page .ydh-final-inner .wp-block-buttons {
    justify-content: center;
}

/* Button rows are centred by the container rule above. Do NOT add auto side
   margins on the items themselves: inside a flex row auto margins win over
   justify-content:center and shove each button to an opposite end (this broke
   every bottom CTA row before). Width stays fit-content so items size to their
   label and sit adjacent with the row's gap. */
main.ydh-page .ydh-hero-ctas .wp-block-button,
main.ydh-page .ydh-section-inner .wp-block-button,
main.ydh-page .ydh-final-inner .wp-block-button {
    display: flex;
    justify-content: center;
    width: fit-content;
}

main.ydh-page .ydh-hero-ctas .wp-block-button .wp-block-button__link,
main.ydh-page .ydh-section-inner .wp-block-button .wp-block-button__link,
main.ydh-page .ydh-final-inner .wp-block-button .wp-block-button__link {
    text-align: center;
}

/* Bare button rows: a row that carries no layout class (markup stored or
   rendered verbatim, such as a buttons block inside a raw-HTML wrapper) stays
   a plain block box. justify-content is inert on a block box, so the
   shrink-to-fit item above lands at the left edge. Centre the item itself with
   auto side margins, which is correct only because these rows are NOT flex
   containers. The :not(.is-layout-flex) guard keeps every core-laid-out flex
   row on the justify-content path above, where auto margins would absorb the
   free space instead and shove items apart (the bottom-CTA bug fixed in 3.5.3). */
main.ydh-page .wp-block-buttons:not(.is-layout-flex):not(.ydh-header-cta) > .wp-block-button {
    display: flex;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

/* Tag/pill chip rows under the buttons: flex row becomes a centred,
   wrapped inline row. */
main.ydh-page .ydh-page-chips,
main.ydh-page .ydh-chips {
    justify-content: center;
    text-align: center;
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
    main.ydh-page .ydh-linkcard:hover,
    main.ydh-page .ydh-posts li:hover {
        transform: none;
    }
    html.ydh-js main.ydh-page .ydh-reveal,
    html.ydh-js main.ydh-page .ydh-stagger > * {
        opacity: 1 !important;
        transform: none !important;
    }
}