/*
 * DEFENSIVE LAYOUT CSS
 * --------------------
 * This file is loaded LAST and provides high-specificity, extension-resistant
 * layout rules for critical page structures. All rules use !important so that
 * browser extensions (Dark Reader, uBlock, etc.) cannot easily override the
 * intended alignment, width, and centering of the Hanssen Agency theme.
 *
 * DO NOT add aesthetic styling here — only layout/alignment protection.
 */

/* ============================================================
   1. CONTAINERS — force centered, max-width aware
   ============================================================ */

.site-main .container,
.site-main .container.cq,
body .container,
body .container.cq,
main .container,
main .container.cq,
.site-main .container {
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* ============================================================
   2. SECTION HEADERS — force center alignment on all sections
   ============================================================ */

section .section-header,
section .section-header.scroll-reveal,
.site-main section .section-header,
.site-main section .section-header.scroll-reveal,
main section .section-header,
main section .section-header.scroll-reveal {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

section .section-header .section-label,
section .section-header .section-title,
section .section-header .section-subtitle,
.site-main section .section-header .section-label,
.site-main section .section-header .section-title,
.site-main section .section-header .section-subtitle,
main section .section-header .section-label,
main section .section-header .section-title,
main section .section-header .section-subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ============================================================
   3. HERO SECTIONS — force centered content
   ============================================================ */

.hero-section .container,
.v2-hero .container,
.page-hero .container,
.services-hero .container,
.references-hero .container,
.contact-hero .container,
.blog-hero .container,
.wir-hero .container,
.legal-hero .container {
    text-align: center !important;
}

.hero-section .hero-headline,
.hero-section .page-title,
.v2-hero .v2-headline,
.v2-hero .v2-subline,
.services-hero .page-title,
.services-hero .page-subtitle,
.references-hero .page-title,
.references-hero .page-subtitle,
.contact-hero .page-title,
.contact-hero .page-subtitle,
.blog-hero .page-title,
.blog-hero .page-subtitle,
.wir-hero .page-title,
.wir-hero .page-subtitle,
.legal-hero .page-title,
.legal-hero .page-subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.v2-hero .v2-hero-cta,
.hero-section .hero-cta,
.services-hero .hero-cta,
.references-hero .hero-cta,
.contact-hero .hero-cta,
.blog-hero .hero-cta,
.wir-hero .hero-cta,
.legal-hero .hero-cta {
    justify-content: center !important;
}

.v2-hero .hero-single-stat,
.hero-section .hero-single-stat {
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
}

/* ============================================================
   4. FOOTER — force centered brand block
   ============================================================ */

.footer-top .container,
.footer-top .container.cq,
footer .footer-brand-block,
.footer-brand-block {
    text-align: center !important;
}

.footer-brand-block,
footer .footer-brand-block {
    align-items: center !important;
}

.footer-brand-label,
.footer-brand-headline,
.footer-cta-btn,
footer .footer-brand-label,
footer .footer-brand-headline,
footer .footer-cta-btn {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-content: center !important;
}

.footer-brand-headline {
    max-width: 100% !important;
}

/* ============================================================
   5. PROCESS SECTION — force wide and centered
   ============================================================ */

.process-section,
.process-section .container,
.process-section .process-timeline,
.process-section .section-header,
.process-section .section-label,
.process-section .section-title,
.process-section .section-subtitle,
.process-section .process-step {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.process-section .container {
    width: 100% !important;
    max-width: 1800px !important;
}

.process-section .process-timeline {
    justify-content: center !important;
}

/* ============================================================
   6. MICE SECTION — force centered header and grid
   ============================================================ */

.mice-section .section-header,
.mice-section .section-label,
.mice-section .section-title,
.mice-section .section-subtitle,
.mice-section .mice-grid,
.mice-section .mice-benefits,
.mice-section .mice-benefits h3,
.mice-section .benefits-list,
.mice-section .benefits-list li {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.mice-section .mice-grid {
    justify-content: center !important;
}

/* ============================================================
   7. NEWSLETTER / LEAD MAGNET — force centered
   ============================================================ */

.newsletter-section .container,
.newsletter-section .section-header,
.newsletter-section .section-label,
.newsletter-section .section-title,
.newsletter-section .section-subtitle,
.lead-magnet-section .container,
.lead-magnet-section .lead-magnet-card,
.lead-magnet-section .lead-magnet-content,
.lead-magnet-section .section-label,
.lead-magnet-section .section-title,
.lead-magnet-section .section-subtitle,
.lead-magnet-section .lead-magnet-form,
.lead-magnet-section form,
.lead-magnet-section .newsletter-form,
.lead-magnet-section .form-fields,
.lead-magnet-section .form-field {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.newsletter-section .newsletter-form,
.lead-magnet-section .lead-magnet-form,
.lead-magnet-section form,
.lead-magnet-section .form-fields,
.lead-magnet-section .form-field {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.lead-magnet-section .lead-magnet-card {
    justify-content: center !important;
}

/* ============================================================
   8. FAQ / ACCORDION — force centered header
   ============================================================ */

.faq-section .section-header,
.faq-section .section-label,
.faq-section .section-title,
.faq-section .section-subtitle,
.faq-section .faq-accordion,
.faq-section .faq-item,
.faq-section .faq-question,
.faq-section .faq-answer {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ============================================================
   9. GENERIC CENTERING GUARDRAILS
   ============================================================ */

/* Any section header inside any section must be centered */
section[class*="-section"] .section-header,
section[class*="-section"] .section-header * {
    text-align: center !important;
}

/* Prevent horizontal overflow from extensions */
html, body {
    overflow-x: hidden !important;
}