/*
Theme Name:        Metro Detroit Home Inspections
Theme URI:         https://rightnowmarketinggroup.com
Author:            Right Now Marketing Group LLC
Description:       Complete standalone WordPress theme for Metro Detroit home inspection companies. Activates and instantly builds a fully-editable Gutenberg website — no plugins required. Includes Home, About, Services landing + 8 individual service pages, Gallery, and Contact. Features dynamic {{tag}} system, LocalBusiness + HomeInspector JSON-LD schema, and WP-CLI support. Color palette: Navy / Gold / White.
Version:           1.0.0
Requires at least: 6.4
Tested up to:      7.0
Requires PHP:      8.0
License:           GPL-2.0-or-later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       mdhi
Tags:              block-editor, custom-colors, custom-logo, custom-menu, featured-images, translation-ready
*/

/* ── Design Tokens ── */
:root {
    --mdhi-navy:          #1a2744;
    --mdhi-navy-soft:     #22345a;
    --mdhi-navy-mid:      #2d4373;
    --mdhi-navy-light:    #3d5a8a;
    --mdhi-gold:          #c89b3c;
    --mdhi-gold-dark:     #a67d2a;
    --mdhi-gold-hover:    #b8892e;
    --mdhi-gold-light:    #e0b660;
    --mdhi-white:         #ffffff;
    --mdhi-off-white:     #f9f8f5;
    --mdhi-grey-light:    #f2f3f5;
    --mdhi-grey-mid:      #e0e2e8;
    --mdhi-grey-text:     #5a6070;
    --mdhi-grey-dark:     #3d4250;
    --mdhi-text:          #1a1f2e;
    --mdhi-border:        #dde0e8;
    --mdhi-surface:       #f5f6f9;
    --mdhi-radius:        6px;
    --mdhi-radius-lg:     12px;
    --mdhi-shadow:        0 2px 8px rgba(26,39,68,.10);
    --mdhi-shadow-md:     0 4px 16px rgba(26,39,68,.14);
    --mdhi-shadow-lg:     0 8px 32px rgba(26,39,68,.18);
    --mdhi-max-w:         1200px;
}

/* ── Base Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
    font-family: 'Inter', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.75;
    color: var(--mdhi-text);
    background: var(--mdhi-white);
    -webkit-font-smoothing: antialiased;
}

/* ── Typography ── */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.2;
    color: var(--mdhi-navy);
    margin-bottom: .75em;
}
h1 { font-size: clamp(1.875rem, 4.5vw, 3.25rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.375rem); }
h3 { font-size: clamp(1.125rem, 2vw, 1.5rem); }
h4 { font-size: clamp(1rem, 1.5vw, 1.25rem); }
p  { margin-bottom: 1.125em; }
p:last-child { margin-bottom: 0; }
a  { color: var(--mdhi-navy); text-decoration: underline; }
a:hover { color: var(--mdhi-gold-dark); }

/* ── CRITICAL: Full-width alignfull block breakout ── */
.site-content { overflow-x: hidden; }
.wp-block-group.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
}
.wp-block-group.alignfull > * {
    max-width: var(--mdhi-max-w);
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

/* ── Buttons ── */
.mdhi-btn {
    display: inline-block;
    padding: .75rem 1.875rem;
    font-weight: 700;
    font-size: .9375rem;
    border-radius: var(--mdhi-radius);
    text-decoration: none;
    transition: background .14s, color .14s, border-color .14s, box-shadow .14s;
    cursor: pointer;
    border: 2px solid transparent;
    letter-spacing: .01em;
}
.mdhi-btn--gold {
    background: var(--mdhi-gold);
    color: var(--mdhi-navy);
    border-color: var(--mdhi-gold);
}
.mdhi-btn--gold:hover {
    background: var(--mdhi-gold-dark);
    border-color: var(--mdhi-gold-dark);
    color: var(--mdhi-navy);
    box-shadow: var(--mdhi-shadow-md);
}
.mdhi-btn--navy {
    background: var(--mdhi-navy);
    color: var(--mdhi-white);
    border-color: var(--mdhi-navy);
}
.mdhi-btn--navy:hover {
    background: var(--mdhi-navy-soft);
    border-color: var(--mdhi-navy-soft);
    color: var(--mdhi-white);
}
.mdhi-btn--outline {
    background: transparent;
    color: var(--mdhi-white);
    border-color: rgba(255,255,255,.65);
}
.mdhi-btn--outline:hover {
    background: rgba(255,255,255,.12);
    border-color: var(--mdhi-white);
    color: var(--mdhi-white);
}
.mdhi-btn--outline-navy {
    background: transparent;
    color: var(--mdhi-navy);
    border-color: var(--mdhi-navy);
}
.mdhi-btn--outline-navy:hover {
    background: var(--mdhi-navy);
    color: var(--mdhi-white);
}

/* ── Cards ── */
/* Feature card (icon + title + text, border-top accent) */
.mdhi-card {
    background: var(--mdhi-white);
    border: 1px solid var(--mdhi-border);
    border-top: 4px solid var(--mdhi-gold);
    border-radius: var(--mdhi-radius-lg);
    padding: 1.75rem;
    box-shadow: var(--mdhi-shadow);
    transition: box-shadow .15s, transform .15s;
}
.mdhi-card:hover { box-shadow: var(--mdhi-shadow-md); transform: translateY(-2px); }

/* Benefit card (border-left accent) */
.mdhi-card--benefit {
    border-top: 1px solid var(--mdhi-border);
    border-left: 4px solid var(--mdhi-gold);
    border-radius: 0 var(--mdhi-radius) var(--mdhi-radius) 0;
}

/* Step card (centered, numbered) */
.mdhi-card--step { border-top: 4px solid var(--mdhi-gold); text-align: center; }

/* ── Trust / Badge bar ── */
.mdhi-trust-bar {
    background: var(--mdhi-gold);
    color: var(--mdhi-navy);
    font-weight: 700;
    font-size: .875rem;
    text-align: center;
    padding: .625rem 1.5rem;
    letter-spacing: .02em;
}

/* ── FAQ Accordion (wp:details) ── */
.wp-block-details {
    border: 1px solid var(--mdhi-border);
    border-radius: var(--mdhi-radius);
    margin-bottom: .875rem;
    overflow: hidden;
}
.wp-block-details summary {
    padding: 1.125rem 1.375rem;
    background: var(--mdhi-surface);
    cursor: pointer;
    font-weight: 600;
    color: var(--mdhi-navy);
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
    content: '+';
    font-size: 1.5rem;
    font-weight: 300;
    flex-shrink: 0;
    color: var(--mdhi-gold-dark);
}
.wp-block-details[open] summary { background: var(--mdhi-grey-light); }
.wp-block-details[open] summary::after { content: '−'; }
.wp-block-details > *:not(summary) { padding: 1.125rem 1.375rem; }

/* ── Gutenberg WP Buttons ── */
.wp-block-button__link {
    border-radius: var(--mdhi-radius) !important;
    font-weight: 700 !important;
    transition: background .14s, color .14s !important;
}

/* ── Accessibility ── */
.skip-link {
    background: var(--mdhi-navy);
    color: var(--mdhi-white);
    font-weight: 700;
    left: 1rem;
    padding: .625rem 1.25rem;
    position: absolute;
    top: -999px;
    z-index: 999999;
    border-radius: 0 0 var(--mdhi-radius) var(--mdhi-radius);
    text-decoration: none;
}
.skip-link:focus { top: 0; }

/* ── Images ── */
img { max-width: 100%; height: auto; display: block; }

/* ── Utility ── */
.text-center { text-align: center; }
.text-gold   { color: var(--mdhi-gold); }
.text-navy   { color: var(--mdhi-navy); }
.text-white  { color: var(--mdhi-white); }