/* WaterDamageGo Post Hero v1.1.0 - homepage-style hero + Design Pro
   section-panel body design for city posts.
   Loaded ONLY on single posts that render the hero (see plugin scope). */

/* ---------- Hero panel (mirrors .wdg-hero + Design Pro polish) ---------- */
.wdg-post-hero{
    position:relative;
    background-color:#0b2a4a;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    border-radius:22px;
    box-shadow:0 16px 40px rgba(11,42,74,.22);
    min-height:480px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:48px 24px;
    color:#fff;
    margin-bottom:28px;
}
.wdg-post-hero-inner{max-width:860px;margin:0 auto;width:100%}

/* Category pill (GEORGIA etc.) - same glass look as the homepage chips */
.wdg-post-hero-cat{
    display:inline-block;
    letter-spacing:2px;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    color:#bfe6fb;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.35);
    padding:7px 16px;
    border-radius:999px;
    margin-bottom:20px;
}

.wdg-post-hero-title{
    color:#fff;
    font-size:clamp(30px,5vw,48px);
    line-height:1.12;
    letter-spacing:-.01em;
    margin:0 0 16px;
    text-shadow:0 2px 16px rgba(0,0,0,.5);
}
.wdg-post-hero-sub{
    color:#dceefb;
    font-size:clamp(16px,2.2vw,20px);
    max-width:760px;
    margin:0 auto;
}

/* Trust chips - values copied from Foundation .wdg-chips.
   They render AFTER the call button (CTA-first order). */
.wdg-post-hero .wdg-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.wdg-post-hero .wdg-chips span{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);color:#fff;padding:7px 14px;border-radius:999px;font-size:14px;font-weight:600}

/* Call button (Foundation .wdg-call-link shortcode output).
   CTA FIRST: sits directly under the sub-line so it is visible
   in the first viewport without scrolling, desktop and mobile. */
.wdg-post-hero-btn{margin-top:26px}
.wdg-post-hero .wdg-call-link{box-shadow:0 10px 26px rgba(0,0,0,.35)}

/* ---------- Hide Kadence's own title header + featured image ----------
   The hero carries the post title (as its H1) and the featured photo,
   so the theme's header and thumbnail would only duplicate them.
   :has() scopes this to articles that actually contain the hero -
   no per-post CSS is ever needed, for the sample or the full rollout. */
article:has(.wdg-post-hero) .entry-header{display:none}
article:has(.wdg-post-hero) .post-thumbnail{display:none}

/* ---------- Mobile ---------- */
@media (max-width:640px){
    .wdg-post-hero{min-height:0;padding:36px 18px 40px;border-radius:18px}
    .wdg-post-hero-cat{letter-spacing:1.5px}
}

/* ==================================================================
   v1.1.0 POST BODY DESIGN - the wrapped sections as homepage panels.
   Values mirror the homepage Design Pro layer (wdg-design.css):
   page background #edf4fa - white panels with shadow
   0 4px 24px rgba(11,42,74,.07) - navy #0b2a4a - aqua #0e7fc4 -
   line #e2edf5 - body text #33475c at line-height 1.68.
   The wrapper classes only exist on hero posts, and this stylesheet
   only loads there, so scoping stays automatic.
   ================================================================== */
/* v1.2.1: !important + ID selectors. The v1.2.0 plain rules lost the
   specificity war against Kadence's own content-column background
   (its dynamic CSS targets ID-level wrappers like #primary), so the
   gaps between panels stayed white. These rules end that: the field
   is #edf4fa and every wrapper between body and panels is transparent. */
body:has(.wdg-post-hero){background:#edf4fa!important}
body:has(.wdg-post-hero) #wrapper,
body:has(.wdg-post-hero) .site-container,
body:has(.wdg-post-hero) #inner-wrap,
body:has(.wdg-post-hero) #primary,
body:has(.wdg-post-hero) .content-area,
body:has(.wdg-post-hero) #main,
body:has(.wdg-post-hero) .site-main,
body:has(.wdg-post-hero) main,
body:has(.wdg-post-hero) article,
body:has(.wdg-post-hero) .entry-content-wrap,
body:has(.wdg-post-hero) .entry-content{background:transparent!important}

.wdg-post-intro,.wdg-post-section{
    background:#fff;
    border:1px solid #e2edf5;
    border-radius:18px;
    box-shadow:0 4px 24px rgba(11,42,74,.07);
    padding:30px 34px;
    margin:0 0 24px;
}
.wdg-post-intro p,.wdg-post-section p{color:#33475c;line-height:1.68}
.wdg-post-intro > :first-child,.wdg-post-section > :first-child{margin-top:0}
.wdg-post-intro > :last-child,.wdg-post-section > :last-child{margin-bottom:0}

/* Section headings - Design Pro look: navy, tight spacing,
   58x4 aqua accent bar under the heading */
.wdg-post-section h2{
    color:#0b2a4a;
    font-size:clamp(23px,3.2vw,32px);
    letter-spacing:-.01em;
    margin:0 0 14px;
}
.wdg-post-section h2::after{
    content:"";
    display:block;
    width:58px;
    height:4px;
    border-radius:2px;
    background:#0e7fc4;
    margin:14px 0 0;
}

/* Sub-headings inside the panels */
.wdg-post-section h3{
    color:#0b2a4a;
    font-size:20px;
    margin:24px 0 8px;
}

/* FAQ section: every question becomes its own light row,
   and the answer paragraph gets matching row padding */
.wdg-post-faq h3{
    background:#f2f8fc;
    border:1px solid #e2edf5;
    border-radius:12px;
    padding:14px 18px;
    margin:22px 0 0;
    font-size:18px;
}
.wdg-post-faq h3:first-of-type{margin-top:6px}
.wdg-post-faq h3 + p{padding:12px 18px 2px;margin:0}

/* Cost table - Design Pro / Foundation .wdg-table values:
   navy header row, striped body, soft cell borders */
.wdg-post-section .wdg-table{margin:0 0 8px}
.wdg-post-section .wdg-table table{
    border-collapse:collapse;
    width:100%;
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 2px 10px rgba(11,42,74,.06);
}
.wdg-post-section .wdg-table th{
    background:#0b2a4a;
    color:#fff;
    padding:14px 18px;
    font-size:16px;
    text-align:left;
}
.wdg-post-section .wdg-table td{
    padding:13px 18px;
    border-bottom:1px solid #e2edf5;
    color:#1c2b39;
}
.wdg-post-section .wdg-table tbody tr:nth-child(even) td{background:#f4f9fd}
.wdg-post-section .wdg-table tbody tr:last-child td{border-bottom:none}

/* Lists: aqua markers, matching the brand accent */
.wdg-post-intro li::marker,.wdg-post-section li::marker{color:#0e7fc4}

/* In-content photos get the homepage image radius */
article:has(.wdg-post-hero) .wp-block-image img{border-radius:16px}

/* ---------- Mobile: tighter panels, smaller table type ---------- */
@media (max-width:640px){
    .wdg-post-intro,.wdg-post-section{padding:22px 18px;border-radius:14px}
    .wdg-post-section .wdg-table th,.wdg-post-section .wdg-table td{padding:11px 12px;font-size:15px}
}
