/* ═══════════════════════════════════════════════════════════════════════════
   THE LERNER AGENCY — main.css
   Pixel-perfect conversion of the React/Tailwind frontend to plain CSS.
   Mirrors exact colors, typography, spacing, animations and responsive layout.
═══════════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   1. CSS CUSTOM PROPERTIES (Design Tokens)
   All values mirror the original src/index.css CSS variables.
───────────────────────────────────────────────────────────── */
:root {
    /* Brand colors */
    --color-navy:            hsl(215, 25%, 12%);   /* #192130 – headers/dark bg */
    --color-blue:            hsl(213, 76%, 39%);   /* #185CAF – primary/links */
    --color-red:             hsl(358, 82%, 44%);   /* #CC141A – accent/CTA */
    --color-light:           hsl(210, 33%, 97%);   /* #F5F7FA – text on dark */
    --color-gold:            hsl(40,  90%, 55%);   /* #F4AF25 – stars/gold */
    --color-bg:              #ffffff;
    --color-muted-bg:        hsl(210, 20%, 96%);   /* #F3F5F7 – alternate section bg */
    --color-foreground:      hsl(215, 25%, 12%);   /* same as navy */
    --color-muted-fg:        hsl(215, 12%, 50%);   /* #707D8F – secondary text */
    --color-border:          hsl(214, 20%, 90%);   /* #D5E1EE – borders */

    /* Semantic aliases */
    --primary:               var(--color-blue);
    --accent:                var(--color-red);
    --brand-navy:            var(--color-navy);
    --brand-blue:            var(--color-blue);
    --brand-red:             var(--color-red);
    --brand-light:           var(--color-light);
    --brand-gold:            var(--color-gold);

    /* Typography */
    --font-display:          'Minion Variable Concept', Georgia, serif;
    --font-body:             'Inter', sans-serif;

    /* Spacing */
    --section-spacing:       5rem;
    --container-max:         1400px;
    --container-pad:         1.5rem;

    /* Radii — 0 by design (sharp corners everywhere) */
    --radius:                0px;
}

@media (max-height: 720px) {
    :root { --section-spacing: 2.875rem; }
}

/* ─────────────────────────────────────────────────────────────
   2. RESET & BASE
───────────────────────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
    border-color: var(--color-border);
}
html {
    overflow-x: hidden;
    scroll-behavior: smooth;
    /* WordPress admin-bar CSS can add margin-top on the frontend.
       The React reference has no top offset, so force exact positioning. */
    margin-top: 0 !important;
}
body {
    font-family: var(--font-body);
    background-color: var(--color-bg);
    color: var(--color-foreground);
    overflow-x: hidden;
    width: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
    padding: 0;
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    margin: 0;
}
p { margin: 0; }
a { color: inherit; text-decoration: none; }
img, video {
    max-width: 100%;
    height: auto;
    display: block;
}
ul, ol { margin: 0; padding: 0; }
button { cursor: pointer; border: none; background: none; padding: 0; }
::selection {
    background: var(--color-red);
    color: #fff;
}

/* ─────────────────────────────────────────────────────────────
   3. LAYOUT UTILITIES
───────────────────────────────────────────────────────────── */
.la-container {
    width: 100%;
    max-width: var(--container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
@media (min-width: 640px) {
    .la-container { padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 1024px) {
    .la-container { padding-left: 2rem; padding-right: 2rem; }
}

.la-section {
    padding-top: var(--section-spacing);
    padding-bottom: var(--section-spacing);
    overflow: hidden;
}
.la-section--white  { background-color: var(--color-bg); }
.la-section--muted  { background-color: var(--color-muted-bg); }
.la-section--navy   { background-color: var(--color-navy); }
.la-section--faq    {
    position: relative;
    padding-top: var(--section-spacing);
    padding-bottom: var(--section-spacing);
    overflow: hidden;
}

/* ─────────────────────────────────────────────────────────────
   4. TYPOGRAPHY HELPERS
───────────────────────────────────────────────────────────── */
.la-label {
    display: inline-block;
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.3em;
    text-transform: uppercase;
}
.la-label--red   { color: var(--color-red); }
.la-label--block { display: block; margin-bottom: 1rem; }

.la-line-accent {
    width: 80px;
    height: 3px;
    background: var(--color-red);
    margin-top: 1rem;
    margin-bottom: 1.5rem;
}
.la-line-accent--center {
    margin-left: auto;
    margin-right: auto;
}

.la-section-heading {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 4vw, 3rem);
    font-weight: 700;
    color: var(--color-foreground);
    line-height: 1.15;
    margin-bottom: 1.5rem;
}
.la-section-heading--center { text-align: center; }
.la-section-heading--light  { color: var(--color-light); }

.la-section-desc {
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--color-muted-fg);
    line-height: 1.7;
    margin-bottom: 2.5rem;
}

.la-section-header { margin-bottom: 4rem; }
.la-section-header--center { text-align: center; }

.la-text--red     { color: var(--color-red); }
.la-text--primary { color: var(--color-blue); }

/* ─────────────────────────────────────────────────────────────
   5. BUTTONS
───────────────────────────────────────────────────────────── */
.la-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 1rem 2.5rem;
    border-radius: var(--radius);
    transition: all 0.2s ease;
    cursor: pointer;
    text-align: center;
    border: none;
    text-decoration: none;
    white-space: nowrap;
}
.la-btn--accent {
    background-color: var(--color-red);
    color: #fff;
}
.la-btn--accent:hover {
    filter: brightness(1.1);
    transform: scale(1.02);
}
.la-btn--accent:active { transform: scale(0.97); }

.la-btn--outline-light {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.3);
    color: #fff;
}
.la-btn--outline-light:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.5);
}
.la-btn--full { width: 100%; }

/* ─────────────────────────────────────────────────────────────
   6. FORM INPUTS
───────────────────────────────────────────────────────────── */
.la-input {
    display: block;
    width: 100%;
    background-color: var(--color-bg);
    border: 1px solid var(--color-border);
    padding: 1rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-foreground);
    border-radius: var(--radius);
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
    appearance: none;
}
.la-input::placeholder { color: var(--color-muted-fg); }
.la-input:focus {
    border-color: var(--color-blue);
    box-shadow: 0 0 0 3px hsl(213 76% 39% / 0.1);
}
.la-input--select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}
.la-input--textarea { resize: none; }

/* ─────────────────────────────────────────────────────────────
   7. SCROLL PROGRESS BAR (Fixed top accent line)
───────────────────────────────────────────────────────────── */
.la-scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background-color: var(--color-red);
    transform-origin: left;
    transform: scaleX(0);
    z-index: 100;
    transition: transform 0.1s linear;
}

/* ─────────────────────────────────────────────────────────────
   8. SPLASH SCREEN
───────────────────────────────────────────────────────────── */
.la-splash {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background-color: var(--color-navy);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.8s ease;
}
.la-splash.la-splash--done {
    opacity: 0;
    pointer-events: none;
}
.la-splash__glow {
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 50%;
    background: radial-gradient(circle, hsl(213 76% 39% / 0.6), transparent 70%);
    opacity: 0.2;
    animation: splashGlowPulse 3s infinite;
}
@keyframes splashGlowPulse {
    0%, 100% { transform: scale(1); opacity: 0.1; }
    50%       { transform: scale(1.3); opacity: 0.3; }
}
.la-splash__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    position: relative;
    z-index: 1;
}
.la-splash__logo-wrap {
    transform: scale(0) rotate(-10deg);
    transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.la-splash__logo-wrap.la-splash--phase1 {
    transform: scale(1) rotate(0deg);
}
.la-splash__logo {
    height: 64px;
    width: auto;
}
@media (min-width: 768px) {
    .la-splash__logo { height: 80px; }
}
.la-splash__tagline-wrap {
    overflow: hidden;
    max-width: 0;
    transition: max-width 0.6s ease;
}
.la-splash__tagline-wrap.la-splash--phase2 {
    max-width: 400px;
}
.la-splash__tagline {
    font-family: var(--font-body);
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: rgba(245, 247, 250, 0.7);
    white-space: nowrap;
    margin: 0;
}
.la-splash__line {
    height: 2px;
    background-color: var(--color-red);
    width: 0;
    transition: width 1.5s ease-in-out;
}
.la-splash__line.la-splash--phase1 {
    width: 120px;
}

/* ─────────────────────────────────────────────────────────────
   9. HEADER
───────────────────────────────────────────────────────────── */

/* Define --header-h on :root so ALL elements (mobile nav, hero padding, etc.) can read it */
:root {
    --header-h: 60px;
}
@media (min-width: 640px) {
    :root { --header-h: 80px; }
}

.la-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 40;
    height: var(--header-h);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: hsl(215 25% 12% / 0.25);
    /*
     * IMPORTANT: transition must be on the BASE element so it fires on BOTH:
     *  - background/border/shadow changes (scroll)
     *  - transform changes (front-page slide-in animation)
     */
    transition: background 0.5s ease,
                border-color 0.5s ease,
                box-shadow 0.5s ease,
                transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.la-header.la-header--scrolled {
    background: hsl(215 25% 12% / 0.95);
    border-bottom: 1px solid hsl(358 82% 44% / 0.35);
    box-shadow: 0 10px 30px rgba(0,0,0,0.24);
}

/* Front page only: header starts hidden, slides in after splash (3.2s via JS) */
.is-front-page .la-header {
    transform: translateY(-100%);
}
.is-front-page .la-header.la-header--visible {
    transform: translateY(0);
    /* transition is already on .la-header — no need to repeat */
}
.la-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    height: 100%;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.la-header__logo-link { display: inline-block; flex-shrink: 0; min-width: 0; }
.la-header__logo {
    height: 48px;
    width: auto;
    max-width: 250px;
    transition: all 0.3s;
    display: block;
}
@media (min-width: 640px)  { .la-header__logo { height: 64px; max-width: 280px; } }
@media (min-width: 1024px) { .la-header__logo { height: 48px; max-width: 300px; } }
@media (min-width: 1280px) { .la-header__logo { height: 80px; max-width: none; } }

.la-header__nav--desktop {
    display: none;
    align-items: center;
    gap: 1.5rem;
}
@media (min-width: 1024px) {
    .la-header__nav--desktop { display: flex; }
}
.la-header__nav-link {
    font-family: var(--font-body);
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    transition: color 0.3s;
    padding: 0.5rem;
}
.la-header__nav-link:hover, .la-header__nav-link.active { color: #fff; }
.la-header__schedule-btn {
    display: none;
}
@media (min-width: 1280px) {
    .la-header__schedule-btn {
        display: inline-block;
        border: 1px solid rgba(255,255,255,0.25);
        padding: 0.75rem 0.75rem;
        font-size: 0.7rem;
        color: rgba(255,255,255,0.9) !important;
    }
    .la-header__schedule-btn:hover {
        background: rgba(255,255,255,0.08);
    }
}
.la-header__quote-btn {
    padding: 0.625rem 1rem;
    font-size: 0.7rem;
}
@media (min-width: 1280px) {
    .la-header__quote-btn { padding: 0.75rem 1.5rem; font-size: 0.75rem; }
}

/* Hamburger */
.la-header__hamburger {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,0.2);
    transition: background 0.2s;
    flex-shrink: 0;
}
.la-header__hamburger:hover { background: rgba(255,255,255,0.08); }
@media (min-width: 640px) {
    .la-header__hamburger { width: 44px; height: 44px; }
}
@media (min-width: 1024px) {
    .la-header__hamburger { display: none; }
}
.la-header__hamburger-bar {
    display: block;
    width: 24px;
    height: 2px;
    background: #fff;
    transition: transform 0.3s, opacity 0.3s;
}
.la-header__hamburger.is-open .la-header__hamburger-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.la-header__hamburger.is-open .la-header__hamburger-bar:nth-child(2) { opacity: 0; }
.la-header__hamburger.is-open .la-header__hamburger-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile Nav — positioned directly below the header */
.la-mobile-nav {
    display: none;
    position: fixed;
    inset-x: 0;
    top: var(--header-h); /* Uses :root --header-h — always correct */
    z-index: 30;
}
.la-mobile-nav.is-open { 
    display: block;  
    width: 100%;
    }
.la-mobile-nav__backdrop {
    position: absolute;
    inset: 0;
    height: calc(100vh - var(--header-h));
    background: hsl(215 25% 12% / 0.65);
    cursor: default;
    border: none;
}
.la-mobile-nav__panel {
    position: relative;
    background: hsl(215 25% 12% / 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(255,255,255,0.1);
    max-height: calc(100vh - var(--header-h));
    overflow-y: auto;
    z-index: 1;
}
.la-mobile-nav__links {
    display: flex;
    flex-direction: column;
    padding: 1.5rem;
    gap: 1rem;
}
.la-mobile-nav__link {
    font-family: var(--font-body);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255,255,255,0.8);
    padding: 0.5rem 0;
    transition: color 0.2s;
}
.la-mobile-nav__link:hover { color: #fff; }
.la-mobile-nav__cta {
    margin-top: 0.5rem;
    text-align: center;
    width: 100%;
    padding: 0.75rem 1.5rem;
    font-size: 0.75rem;
}

/* ─────────────────────────────────────────────────────────────
   10. FOOTER
───────────────────────────────────────────────────────────── */
.la-footer {
    background-color: var(--color-navy);
    color: var(--color-light);
    overflow: hidden;
    border-top: 2px solid hsl(358 82% 44% / 0.4);
}
.la-footer__inner {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
@media (min-width: 640px) {
    .la-footer__inner { padding-top: 4rem; padding-bottom: 4rem; }
}
.la-footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
}
@media (min-width: 640px)  { .la-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .la-footer__grid { grid-template-columns: 2fr 1fr 1fr; } }

.la-footer__brand { grid-column: 1 / -1; }
@media (min-width: 1024px) { .la-footer__brand { grid-column: 1; } }

.la-footer__logo-link { display: inline-block; margin-bottom: 1rem; }
.la-footer__logo { height: 40px; width: auto; }
@media (min-width: 640px) { .la-footer__logo { height: 48px; } }

.la-footer__tagline {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.5);
    line-height: 1.7;
    max-width: 28rem;
    margin-bottom: 1rem;
}
.la-footer__contact { display: flex; flex-direction: column; gap: 0.5rem; }
.la-footer__contact-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.6);
    transition: color 0.3s;
    text-decoration: none;
}
.la-footer__contact-item svg { flex-shrink: 0; margin-top: 2px; }
.la-footer__contact-item--phone { color: rgba(245,247,250,0.7); font-weight: 600; }
.la-footer__contact-item--cell  { padding-left: 1.5rem; font-size: 0.75rem; color: rgba(245,247,250,0.45); }
a.la-footer__contact-item:hover { color: var(--color-red); }

.la-footer__col-heading {
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(245,247,250,0.4);
    margin-bottom: 1.5rem;
}
.la-footer__nav-link {
    display: block;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.6);
    margin-bottom: 0.75rem;
    transition: color 0.3s;
    text-decoration: none;
}
.la-footer__nav-link:hover { color: var(--color-red); }

.la-footer__bottom {
    border-top: 1px solid rgba(245,247,250,0.1);
    margin-top: 2rem;
    padding-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    text-align: center;
}
@media (min-width: 640px) {
    .la-footer__bottom { flex-direction: row; justify-content: space-between; text-align: left; }
}
.la-footer__copyright, .la-footer__license {
    font-family: var(--font-body);
    font-size: 0.7rem;
    color: rgba(245,247,250,0.3);
}

/* ─────────────────────────────────────────────────────────────
   11. HERO SECTION
───────────────────────────────────────────────────────────── */
.la-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: min(100vh, 100svh);
    overflow: hidden;
}
.la-hero__bg {
    position: absolute;
    inset: 0;
}
.la-hero__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.la-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, var(--color-navy) 0%, hsl(215 25% 12% / 0.75) 50%, hsl(215 25% 12% / 0.4) 100%);
}
.la-hero__content {
    position: relative;
    z-index: 10;
    padding-bottom: 2.5rem;
    /* Ensure hero text always starts BELOW the fixed header (header-h + 40px breathing room) */
    padding-top: calc(var(--header-h) + 2.5rem);
}
@media (min-width: 640px) {
    .la-hero__content { padding-bottom: 5rem; padding-top: calc(var(--header-h) + 5rem); }
}
@media (max-height: 720px) {
    .la-hero__content { padding-top: calc(var(--header-h) + 2rem); padding-bottom: 2rem; }
}
.la-hero__text-block { max-width: 48rem; }
.la-hero__label {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 1.25rem;
}
.la-hero__shield-icon { color: var(--color-red); flex-shrink: 0; }
.la-hero__label span {
    font-family: var(--font-body);
    font-size: 0.6rem;
    font-weight: 400;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(245,247,250,0.6);
}
@media (min-width: 640px) {
    .la-hero__label span { font-size: 0.75rem; letter-spacing: 0.3em; }
}
.la-hero__heading {
    font-family: var(--font-display);
    font-size: clamp(2rem, 6vw, 4.5rem);
    font-weight: 700;
    color: var(--color-light);
    line-height: 1.06;
    margin-bottom: 1.25rem;
}
@media (min-width: 640px)  { .la-hero__heading { margin-bottom: 1.5rem; } }
@media (min-width: 768px)  { .la-hero__heading { font-size: clamp(2.5rem, 7vw, 6rem); } }
/* Tailwind text-7xl = 4.5rem in the React source; do not overscale. */
@media (min-width: 1024px) { .la-hero__heading { font-size: 4.5rem; } }
@media (max-height: 720px) { .la-hero__heading { font-size: clamp(2rem, 5vw, 3rem); } }
.la-hero__heading .la-text--red { color: var(--color-red); }

.la-hero__desc {
    font-family: var(--font-body);
    font-size: 0.9375rem;
    color: rgba(245,247,250,0.6);
    max-width: 36rem;
    line-height: 1.65;
    margin-bottom: 1.75rem;
}
@media (min-width: 640px) {
    .la-hero__desc { font-size: 1.125rem; margin-bottom: 2.5rem; }
}
@media (min-width: 768px) { .la-hero__desc { font-size: 1.25rem; } }
@media (max-height: 720px) { .la-hero__desc { margin-bottom: 1.25rem; } }

.la-hero__buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
@media (min-width: 640px) {
    .la-hero__buttons { flex-direction: row; gap: 1rem; }
}

.la-hero__stats {
    margin-top: 2.5rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background-color: rgba(245,247,250,0.1);
}
@media (min-width: 640px)  { .la-hero__stats { margin-top: 5rem; } }
@media (min-width: 768px)  { .la-hero__stats { grid-template-columns: repeat(4, 1fr); } }
@media (max-height: 720px) { .la-hero__stats { margin-top: 1.5rem; } }
@media (max-height: 720px) and (min-width: 640px) { .la-hero__stats { margin-top: 2.5rem; } }

.la-hero__stat {
    background: hsl(215 25% 12% / 0.5);
    backdrop-filter: blur(4px);
    padding: 1rem 1.5rem;
}
.la-hero__stat-num {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-red);
    display: block;
}
@media (min-width: 640px) { .la-hero__stat-num { font-size: 1.5rem; } }
@media (min-width: 768px) { .la-hero__stat-num { font-size: 1.875rem; } }
.la-hero__stat-label {
    font-family: var(--font-body);
    font-size: 0.625rem;
    color: rgba(245,247,250,0.5);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-top: 0.25rem;
}
@media (min-width: 640px) { .la-hero__stat-label { font-size: 0.75rem; } }

/* ─────────────────────────────────────────────────────────────
   12. ABOUT / TRUST SECTION
───────────────────────────────────────────────────────────── */
.la-about__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: center;
}
@media (min-width: 1024px) {
    .la-about__grid { grid-template-columns: 1fr 1fr; gap: 4rem; }
}
.la-about__image-col { position: relative; }
.la-about__image-wrap {
    position: relative;
    overflow: hidden;
}
.la-about__image {
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}
.la-about__badge {
    position: absolute;
    bottom: 0;
    right: 1rem;
    background-color: var(--color-blue);
    color: #fff;
    padding: 1rem;
}
@media (min-width: 640px) { .la-about__badge { right: -0.75rem; } }
.la-about__badge-num {
    display: block;
    font-family: var(--font-display);
    font-size: 1.875rem;
    font-weight: 700;
}
@media (min-width: 640px) { .la-about__badge-num { font-size: 2.25rem; } }
.la-about__badge-text {
    font-family: var(--font-body);
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-top: 0.25rem;
}
.la-about__content {}
.la-about__points { display: flex; flex-direction: column; gap: 1.5rem; }
.la-about__point {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}
.la-about__point:hover .la-about__point-icon {
    background-color: var(--color-blue);
}
.la-about__point:hover .la-about__point-icon svg {
    stroke: #fff;
}
.la-about__point-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background-color: hsl(213 76% 39% / 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s;
}
.la-about__point-icon svg { stroke: var(--color-blue); transition: stroke 0.3s; }
.la-about__point-title {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-foreground);
    margin-bottom: 0.25rem;
}
.la-about__point-desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    line-height: 1.65;
}

/* ─────────────────────────────────────────────────────────────
   13. CARRIERS SECTION
───────────────────────────────────────────────────────────── */
.la-carriers {
    padding-top: 3rem;
    padding-bottom: 3.5rem;
    background-color: var(--color-bg);
    overflow: hidden;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}
@media (min-width: 640px) {
    .la-carriers { padding-top: 3.5rem; padding-bottom: 3.5rem; }
}
.la-carriers__header { text-align: center; margin-bottom: 2rem; }
.la-carriers__sub {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    margin-top: 0;
}
.la-carriers__track-wrap {
    position: relative;
    overflow: hidden;
    padding: 0 1rem;
}
@media (min-width: 640px) { .la-carriers__track-wrap { padding: 0 1.5rem; } }

.la-carriers__track {
    display: flex;
    width: max-content;
    gap: 1rem;
    --carrier-speed: 34s;
}
@media (max-width: 640px) {
    .la-carriers__track { --carrier-speed: 46s; }
}
.la-carriers__group {
    display: flex;
    flex-shrink: 0;
    min-width: max-content;
    gap: 1rem;
    animation: carriersMarquee var(--carrier-speed) linear infinite;
    will-change: transform;
    backface-visibility: hidden;
}
@keyframes carriersMarquee {
    0%   { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(calc(-100% - 1rem), 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .la-carriers__group { animation-duration: 1ms; animation-iteration-count: 1; }
}
.la-carriers__item {
    width: 180px;
    border: 1px solid var(--color-border);
    background: #fff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
@media (min-width: 640px) {
    .la-carriers__item { width: 220px; padding: 1rem; }
}
.la-carriers__logo {
    height: 34px;
    width: 100%;
    object-fit: contain;
    display: block;
}
@media (min-width: 640px) { .la-carriers__logo { height: 40px; } }
.la-carriers__name {
    font-family: var(--font-body);
    font-size: 0.6875rem;
    font-weight: 500;
    color: rgba(25, 33, 48, 0.8);
    text-align: center;
    line-height: 1.3;
}
@media (min-width: 640px) { .la-carriers__name { font-size: 0.75rem; } }

/* ─────────────────────────────────────────────────────────────
   14. SERVICES SECTION
───────────────────────────────────────────────────────────── */
.la-services__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    background-color: var(--color-border);
}
@media (min-width: 640px)  { .la-services__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .la-services__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .la-services__grid { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1536px) { .la-services__grid { grid-template-columns: repeat(5, 1fr); } }

.la-service-card {
    background-color: var(--color-bg);
    position: relative;
    overflow: hidden;
    cursor: default;
}
.la-service-card__bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.7s ease;
}
.la-service-card:hover .la-service-card__bg { opacity: 1; }
.la-service-card__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.1);
    transition: transform 0.7s ease;
    display: block;
}
.la-service-card:hover .la-service-card__bg-img { transform: scale(1); }
.la-service-card__bg-overlay {
    position: absolute;
    inset: 0;
    background: hsl(215 25% 12% / 0.8);
}
.la-service-card__accent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: var(--color-red);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.5s ease;
}
.la-service-card:hover .la-service-card__accent { transform: scaleX(1); }
.la-service-card__body {
    position: relative;
    z-index: 10;
    padding: 1.5rem;
}
@media (min-width: 640px) { .la-service-card__body { padding: 2rem; } }
.la-service-card__icon {
    color: var(--color-red);
    margin-bottom: 1.5rem;
    transition: color 0.5s ease;
}
.la-service-card:hover .la-service-card__icon { color: #fff; }
.la-service-card__title {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-foreground);
    margin-bottom: 0.75rem;
    transition: color 0.5s ease;
}
.la-service-card:hover .la-service-card__title { color: #fff; }
.la-service-card__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    line-height: 1.65;
    transition: color 0.5s ease;
}
.la-service-card:hover .la-service-card__desc { color: rgba(255,255,255,0.7); }
.la-services__cta {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

/* ─────────────────────────────────────────────────────────────
   15. PROCESS SECTION
───────────────────────────────────────────────────────────── */
.la-process__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    align-items: center;
}
@media (min-width: 1024px) {
    .la-process__grid { grid-template-columns: 1fr 1fr; gap: 4rem; }
}
.la-process__image-col {}
.la-process__image-wrap {
    position: relative;
    overflow: hidden;
}
.la-process__image {
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}
.la-process__image-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, hsl(215 25% 12% / 0.4), transparent);
}
.la-process__steps-col {}
.la-process__steps { display: flex; flex-direction: column; gap: 2rem; margin-top: 2.5rem; }
.la-process__step {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
}
.la-process__step:hover .la-process__step-num { color: var(--color-red); }
.la-process__step:hover .la-process__step-body { border-color: hsl(358 82% 44% / 0.4); }
.la-process__step-num {
    font-family: var(--font-display);
    font-size: 1.875rem;
    font-weight: 700;
    color: hsl(358 82% 44% / 0.3);
    flex-shrink: 0;
    width: 3rem;
    transition: color 0.3s;
}
.la-process__step-body {
    border-left: 1px solid rgba(245,247,250,0.1);
    padding-left: 1.5rem;
    transition: border-color 0.3s;
}
.la-process__step-title {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--color-light);
    margin-bottom: 0.5rem;
}
.la-process__step-desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.5);
    line-height: 1.65;
}

/* ─────────────────────────────────────────────────────────────
   16. BENEFITS SECTION
───────────────────────────────────────────────────────────── */
.la-benefits__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}
@media (min-width: 1024px) {
    .la-benefits__grid { grid-template-columns: 1fr 1fr; }
}
.la-benefits__images {}
.la-benefits__img-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    overflow: hidden;
}
.la-benefits__img-wrap { overflow: hidden; }
.la-benefits__img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}
@media (min-width: 640px) { .la-benefits__img { height: 224px; } }
.la-benefits__img-wrap:hover .la-benefits__img { transform: scale(1.05); }

.la-benefits__content {
    background-color: var(--color-muted-bg);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
@media (min-width: 640px) { .la-benefits__content { padding: 2.5rem; } }
@media (min-width: 1024px) { .la-benefits__content { padding: 4rem; } }

.la-benefits__list { list-style: none; display: flex; flex-direction: column; gap: 1.25rem; }
.la-benefits__item { display: flex; align-items: flex-start; gap: 0.75rem; }
.la-benefits__dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: var(--color-red);
    flex-shrink: 0;
    margin-top: 0.5rem;
}
.la-benefits__item span:last-child {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(25, 33, 48, 0.8);
    line-height: 1.65;
}
.la-benefits__cta { margin-top: 2.5rem; align-self: flex-start; }

/* ─────────────────────────────────────────────────────────────
   17. PARALLAX CTA SECTION
───────────────────────────────────────────────────────────── */
.la-cta-parallax {
    position: relative;
    height: min(60vh, 52svh);
    min-height: min(400px, 42svh);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
@media (max-height: 720px) {
    .la-cta-parallax { height: 36svh; min-height: 220px; }
}
.la-cta-parallax__bg {
    position: absolute;
    inset: 0;
    will-change: transform;
}
.la-cta-parallax__bg-img {
    width: 100%;
    height: auto;
    display: block;
    margin-top: -20%;
}
.la-cta-parallax__overlay {
    position: absolute;
    inset: 0;
    background: hsl(215 25% 12% / 0.7);
}
.la-cta-parallax__content {
    position: relative;
    z-index: 10;
    text-align: center;
    padding: 1.5rem;
    max-width: 48rem;
    margin: 0 auto;
}
.la-cta-parallax__heading {
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 5vw, 3.75rem);
    font-weight: 700;
    color: var(--color-light);
    line-height: 1.1;
    margin: 0 0 1.5rem;
}
@media (max-height: 720px) {
    .la-cta-parallax__heading { font-size: clamp(1.25rem, 3vw, 2rem); }
}
.la-cta-parallax__desc {
    font-family: var(--font-body);
    font-size: 1rem;
    color: rgba(245,247,250,0.6);
    max-width: 36rem;
    margin: 0 auto 2rem;
    line-height: 1.65;
}
@media (min-width: 640px) { .la-cta-parallax__desc { font-size: 1.125rem; } }
.la-cta-parallax__buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: stretch;
}
@media (min-width: 640px) {
    .la-cta-parallax__buttons {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }
}
.la-cta-parallax__buttons .la-btn {
    padding: 1rem 2.5rem;
}

/* ─────────────────────────────────────────────────────────────
   18. TESTIMONIALS SECTION
───────────────────────────────────────────────────────────── */
.la-testimonials__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    background-color: var(--color-border);
}
@media (min-width: 768px) {
    .la-testimonials__grid { grid-template-columns: repeat(3, 1fr); }
}
.la-testimonial-card {
    background-color: var(--color-bg);
    display: flex;
    flex-direction: column;
}
.la-testimonial-card__img-wrap {
    position: relative;
    height: 192px;
    overflow: hidden;
}
.la-testimonial-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}
.la-testimonial-card:hover .la-testimonial-card__img { transform: scale(1.1); }
.la-testimonial-card__img-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, var(--color-bg), transparent);
}
.la-testimonial-card__quote-icon {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: rgba(255,255,255,0.2);
}
.la-testimonial-card__body {
    padding: 2rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}
@media (min-width: 640px) { .la-testimonial-card__body { padding: 2.5rem; } }
.la-testimonial-card__stars {
    display: flex;
    gap: 4px;
    margin-bottom: 1.5rem;
    color: var(--color-gold);
}
.la-testimonial-card__text {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(25, 33, 48, 0.8);
    line-height: 1.65;
    font-style: italic;
    flex: 1;
    margin: 0 0 2rem;
}
.la-testimonial-card__text p { margin: 0; }
.la-testimonial-card__footer {
    border-top: 1px solid var(--color-border);
    padding-top: 1rem;
}
.la-testimonial-card__name {
    display: block;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-foreground);
    font-style: normal;
}
.la-testimonial-card__role {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--color-muted-fg);
    margin-top: 2px;
}

/* ─────────────────────────────────────────────────────────────
   19. FAQ SECTION
───────────────────────────────────────────────────────────── */
.la-faq__bg {
    position: absolute;
    inset: 0;
}
.la-faq__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.1;
    display: block;
}
.la-faq__bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, hsl(215 25% 12% / 0.95), hsl(213 76% 20% / 0.95));
}
.la-faq__pattern {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    opacity: 0.03;
    background: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 40px,
        #fff 40px,
        #fff 41px
    );
    pointer-events: none;
}
.la-faq__container { position: relative; z-index: 10; }
.la-faq__list {
    max-width: 48rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.la-faq__item {
    background: rgba(245,247,250,0.05);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(245,247,250,0.1);
}
.la-faq__question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem;
    text-align: left;
    cursor: pointer;
    border: none;
    background: none;
    transition: background 0.2s;
}
@media (min-width: 640px) { .la-faq__question { padding: 1.5rem; } }
.la-faq__question:hover { background: rgba(245,247,250,0.03); }
.la-faq__question span {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-light);
    padding-right: 1rem;
    flex: 1;
    text-align: left;
}
.la-faq__chevron {
    flex-shrink: 0;
    color: var(--color-red);
    transition: transform 0.3s ease;
}
.la-faq__question[aria-expanded="true"] .la-faq__chevron {
    transform: rotate(180deg);
}
.la-faq__answer {
    overflow: hidden;
    transition: height 0.3s ease;
}
.la-faq__answer[hidden] {
    display: none;
}
.la-faq__answer p {
    padding: 0 1.25rem 1.5rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.6);
    line-height: 1.65;
}
@media (min-width: 640px) { .la-faq__answer p { padding: 0 1.5rem 1.5rem; } }

/* ─────────────────────────────────────────────────────────────
   20. CONTACT SECTION
───────────────────────────────────────────────────────────── */
.la-contact__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}
@media (min-width: 1024px) {
    .la-contact__grid { grid-template-columns: 1fr 1fr; }
}
.la-contact__agent {
    position: relative;
    min-height: min(350px, 45svh);
}
@media (min-width: 640px) { .la-contact__agent { min-height: min(400px, 50svh); } }
@media (max-height: 720px) { .la-contact__agent { min-height: min(220px, 30svh); } }
.la-contact__agent-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}
.la-contact__agent-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, hsl(215 25% 12% / 0.9), transparent);
    padding: 1.5rem;
}
@media (min-width: 640px) { .la-contact__agent-overlay { padding: 2rem; } }
.la-contact__agent-name {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-light);
}
@media (min-width: 640px) { .la-contact__agent-name { font-size: 1.5rem; } }
.la-contact__agent-role {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.6);
    margin-top: 0.25rem;
}
.la-contact__agent-links { margin-top: 1rem; display: flex; flex-direction: column; gap: 4px; }
.la-contact__agent-link {
    display: block;
    font-family: var(--font-body);
    text-decoration: none;
    transition: color 0.3s;
}
.la-contact__agent-link--phone { font-size: 0.875rem; font-weight: 600; color: rgba(245,247,250,0.9); }
.la-contact__agent-link--cell  { font-size: 0.75rem;  color: rgba(245,247,250,0.6); }
.la-contact__agent-link--email { font-size: 0.875rem; color: rgba(245,247,250,0.8); }
.la-contact__agent-link:hover  { color: var(--color-red); }

.la-contact__form-col {
    background-color: var(--color-muted-bg);
    padding: 2rem;
}
@media (min-width: 640px) { .la-contact__form-col { padding: 2.5rem; } }
@media (min-width: 1024px) { .la-contact__form-col { padding: 4rem; } }

.la-contact__heading {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 3vw, 1.875rem);
    font-weight: 700;
    color: var(--color-foreground);
    margin-bottom: 0.5rem;
}
.la-contact__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    margin-bottom: 1rem;
}
.la-contact__calendly {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    margin-bottom: 2rem;
}
.la-contact__calendly-link {
    font-weight: 600;
    color: var(--color-red);
    text-underline-offset: 4px;
}
.la-contact__calendly-link:hover { text-decoration: underline; }

.la-contact-form { display: flex; flex-direction: column; gap: 1rem; }
.la-contact-form__row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) { .la-contact-form__row { grid-template-columns: 1fr 1fr; } }
.la-contact-form__thanks {
    background: hsl(213 76% 39% / 0.1);
    padding: 2rem;
    text-align: center;
}
.la-contact-form__thanks h3 {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-blue);
    margin-bottom: 0.5rem;
}
.la-contact-form__thanks p {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
}








/* Contact Form 7 shortcode styling.
   Uses the same visual language as the original static React-converted form. */
.la-cf7-shortcode {
    width: 100%;
}
.la-cf7-shortcode .wpcf7 {
    width: 100%;
}
.la-cf7-shortcode .wpcf7 form,
.la-cf7-shortcode .lerner-cf7-quote-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0;
}
.la-cf7-shortcode .lerner-cf7-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) {
    .la-cf7-shortcode .lerner-cf7-row {
        grid-template-columns: 1fr 1fr;
    }
}
.la-cf7-shortcode .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}
.la-cf7-shortcode .wpcf7 input[type="text"],
.la-cf7-shortcode .wpcf7 input[type="email"],
.la-cf7-shortcode .wpcf7 input[type="tel"],
.la-cf7-shortcode .wpcf7 select,
.la-cf7-shortcode .wpcf7 textarea {
    display: block;
    width: 100%;
    background-color: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 0;
    padding: 1rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-foreground);
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    -webkit-appearance: none;
    appearance: none;
}
.la-cf7-shortcode .wpcf7 input::placeholder,
.la-cf7-shortcode .wpcf7 textarea::placeholder {
    color: var(--color-muted-fg);
}
.la-cf7-shortcode .wpcf7 select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}
.la-cf7-shortcode .wpcf7 textarea {
    min-height: 104px;
    resize: vertical;
}
.la-cf7-shortcode .wpcf7 input:focus,
.la-cf7-shortcode .wpcf7 select:focus,
.la-cf7-shortcode .wpcf7 textarea:focus {
    border-color: var(--color-blue);
    box-shadow: 0 0 0 3px hsl(213 76% 39% / 0.1);
}
.la-cf7-shortcode .wpcf7-submit {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-red);
    color: #fff;
    border: 0;
    border-radius: 0;
    padding: 1rem;
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: filter 0.2s ease;
}
.la-cf7-shortcode .wpcf7-submit:hover {
    filter: brightness(1.1);
}
.la-cf7-shortcode .wpcf7-spinner {
    margin: 0.75rem auto 0;
}
.la-cf7-shortcode .wpcf7-not-valid-tip {
    margin-top: 0.35rem;
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--color-red);
}
.la-cf7-shortcode .wpcf7-response-output {
    margin: 1rem 0 0 !important;
    padding: 0.875rem 1rem !important;
    border-radius: 0 !important;
    font-family: var(--font-body);
    font-size: 0.875rem;
}






.la-contact__ezlynx {
    margin-top: 2.5rem;
    overflow: hidden;
}
@media (min-width: 640px) { .la-contact__ezlynx { margin-top: 3rem; } }
.ezlynx-quote-embed { isolation: isolate; max-width: 100%; overflow: hidden; }
.ezlynx-quote-embed iframe { display: block; overflow: hidden; border: none; max-width: 100%; }

/* ─────────────────────────────────────────────────────────────
   21. CHAT BUBBLE
───────────────────────────────────────────────────────────── */
.la-chat-bubble {
    position: fixed;
    bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
    right: calc(1.5rem + env(safe-area-inset-right, 0px));
    z-index: 50;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: var(--color-red);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
    transition: filter 0.2s;
    animation: chatBubbleAppear 0.5s ease 4.5s both;
}
.la-chat-bubble:hover { filter: brightness(1.1); }
.la-chat-bubble__pulse {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background-color: var(--color-red);
    animation: chatBubblePing 2s cubic-bezier(0, 0, 0.2, 1) infinite;
    opacity: 0.2;
}
@keyframes chatBubbleAppear {
    from { opacity: 0; transform: scale(0); }
    to   { opacity: 1; transform: scale(1); }
}
@keyframes chatBubblePing {
    75%, 100% { transform: scale(2); opacity: 0; }
}

/* ─────────────────────────────────────────────────────────────
   22. SCROLL TO TOP
───────────────────────────────────────────────────────────── */
.la-scroll-top {
    position: fixed;
    bottom: 1.5rem;
    left: 1.5rem;
    z-index: 50;
    width: 48px;
    height: 48px;
    background-color: var(--color-foreground);
    color: var(--color-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    transition: background-color 0.3s, opacity 0.3s, transform 0.3s;
    opacity: 0;
    transform: scale(0.8);
}
.la-scroll-top.is-visible {
    opacity: 1;
    transform: scale(1);
}
.la-scroll-top:hover { background-color: var(--color-blue); }
.la-scroll-top[hidden] { display: none; }

/* ─────────────────────────────────────────────────────────────
   23. SCROLL-TRIGGERED ANIMATIONS
   Classes applied by IntersectionObserver in main.js
───────────────────────────────────────────────────────────── */
.la-animate {
    opacity: 0;
    transition-duration: 0.7s;
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
    transition-property: opacity, transform;
}
.la-animate[data-animate="fade-up"]    { transform: translateY(50px); }
.la-animate[data-animate="fade-left"]  { transform: translateX(-60px); }
.la-animate[data-animate="fade-right"] { transform: translateX(60px); }
.la-animate[data-animate="scale-in"]  { transform: scale(0.9); }
.la-animate.is-visible {
    opacity: 1;
    transform: translate(0) scale(1);
}
@media (prefers-reduced-motion: reduce) {
    .la-animate { transition: none; opacity: 1; transform: none; }
}

/* ─────────────────────────────────────────────────────────────
   24. FADE-IN ON HERO (whole section)
───────────────────────────────────────────────────────────── */
.la-fade-in {
    animation: sectionFadeIn 0.8s ease 3.2s both;
}
@keyframes sectionFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ─────────────────────────────────────────────────────────────
   25. MISC / UTILITY
───────────────────────────────────────────────────────────── */
/* Prevent horizontal scroll globally */
.la-main { overflow-x: clip; }

/* Index.php blog list */
.la-main--blog { padding-top: 0; }
.la-posts-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 640px) { .la-posts-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .la-posts-grid { grid-template-columns: repeat(3, 1fr); } }
.la-post-card { border: 1px solid var(--color-border); }
.la-post-card__thumb img { width: 100%; height: 200px; object-fit: cover; display: block; }
.la-post-card__body { padding: 1.5rem; }
.la-post-card__title {
    font-family: var(--font-display);
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
}
.la-post-card__title a { color: var(--color-foreground); text-decoration: none; }
.la-post-card__title a:hover { color: var(--color-blue); }
.la-post-card__excerpt { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-fg); margin-bottom: 1rem; }

/* ─────────────────────────────────────────────────────────────
   26. WORDPRESS ADMIN BAR
   React source keeps the header fixed at top: 0. Keep the same behavior
   even when WordPress adds body.admin-bar during previews/devtools.
───────────────────────────────────────────────────────────── */
.admin-bar .la-header,
.admin-bar .la-splash {
    top: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   INNER PAGES — Additional Styles
   Shared patterns across About, Services, Client Center, Contact pages.
═══════════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   1. PAGE HERO (inner page hero — navy bg, shorter than homepage)
───────────────────────────────────────────────────────────── */
.la-page-hero {
    background-color: var(--color-navy);
    color: var(--color-light);
    /* Always clear the fixed header using the shared --header-h variable */
    padding-top: calc(var(--header-h) + 4rem);
    padding-bottom: 3.5rem;
    overflow: hidden;
}
@media (min-width: 768px) {
    .la-page-hero { padding-top: calc(var(--header-h) + 5rem); padding-bottom: 5rem; }
}
.la-page-hero__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: center;
}
@media (min-width: 1024px) {
    .la-page-hero__grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
.la-page-hero__text {}
.la-page-hero__label {
    display: block;
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--color-red);
    margin-bottom: 1rem;
}
.la-page-hero__heading {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-light);
    margin: 0 0 1rem;
}
.la-page-hero__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.7;
    color: rgba(245,247,250,0.8);
    margin-bottom: 1.5rem;
    max-width: 36rem;
}
@media (min-width: 768px) { .la-page-hero__desc { font-size: 1rem; } }
.la-page-hero__desc--narrow { max-width: 40rem; }
.la-page-hero__list { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1.25rem; }
.la-page-hero__list-item {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.85);
}
.la-page-hero--text-only .la-page-hero__heading { max-width: 42rem; }
.la-page-hero--text-only .la-page-hero__desc { max-width: 42rem; }

.la-page-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.5rem;
}
@media (min-width: 640px) { .la-page-hero__actions { flex-direction: row; } }

.la-page-hero__image-col {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.1);
}
.la-page-hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 200px;
    display: block;
}
@media (min-width: 1024px) {
    .la-page-hero__img { min-height: 340px; }
}

/* Ghost/outline button for contact page hero */
.la-btn--ghost-light {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.25);
    color: rgba(255,255,255,0.95);
    padding: 0.75rem 1.25rem;
    font-size: 0.7rem;
}
.la-btn--ghost-light:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.4); }

/* Outline button for dark backgrounds */
.la-btn--outline-dark {
    background: transparent;
    border: 1px solid var(--color-border);
    color: var(--color-foreground);
}
.la-btn--outline-dark:hover { background: var(--color-muted-bg); }

/* Small button size */
.la-btn--sm { padding: 0.5rem 1rem; font-size: 0.7rem; }

/* ─────────────────────────────────────────────────────────────
   2. SHARED INNER SECTION TYPOGRAPHY
───────────────────────────────────────────────────────────── */
.la-inner-heading {
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 3.5vw, 2.5rem);
    font-weight: 700;
    color: var(--color-foreground);
    line-height: 1.15;
    margin: 0 0 0.75rem;
}
.la-inner-desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.7;
    color: var(--color-muted-fg);
    max-width: 42rem;
    margin-bottom: 1.5rem;
}
@media (min-width: 768px) { .la-inner-desc { font-size: 1rem; } }

/* ─────────────────────────────────────────────────────────────
   3. ARTICLE CARDS (.la-card)
   Used in: trust items, feature cards, team section, service standards
───────────────────────────────────────────────────────────── */
.la-card {
    border: 1px solid var(--color-border);
    background-color: var(--color-bg);
    padding: 1.25rem;
}
@media (min-width: 640px) { .la-card { padding: 1.5rem; } }
.la-card--flex { display: flex; flex-direction: column; height: 100%; }
.la-card__icon { color: var(--color-red); margin-bottom: 0.75rem; }
.la-card__heading {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-foreground);
    margin: 0.75rem 0 0.5rem;
}
.la-card__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.65;
    color: var(--color-muted-fg);
    margin: 0;
}
.la-card__desc--flex { flex: 1; margin-bottom: 1rem; }
.la-card__cta { margin-top: auto; width: fit-content; }

/* Stacked card list */
.la-cards-stack { display: flex; flex-direction: column; gap: 1rem; margin-top: 1.5rem; }
.la-cards-stack--double {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) {
    .la-cards-stack--double { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .la-cards-stack--double { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────────────────
   4. ABOUT PAGE
───────────────────────────────────────────────────────────── */
/* Trust Section */
.la-about-trust__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: stretch;
}
@media (min-width: 1024px) {
    .la-about-trust__grid { grid-template-columns: 0.95fr 1.05fr; gap: 2.5rem; }
}
.la-about-trust__image-col {
    overflow: hidden;
    border: 1px solid var(--color-border);
    background: var(--color-muted-bg);
    min-height: 280px;
}
@media (min-width: 640px) { .la-about-trust__image-col { min-height: 320px; } }
@media (min-width: 1024px) { .la-about-trust__image-col { min-height: 420px; } }
.la-about-trust__img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.la-about-trust__content {}

/* Team Section */
.la-about-team__header { margin-bottom: 2rem; }
.la-about-team__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}
@media (min-width: 1024px) {
    .la-about-team__grid { grid-template-columns: 1.2fr 1fr; gap: 1.5rem; }
}
.la-about-team__image-col {
    overflow: hidden;
    border: 1px solid var(--color-border);
    background: var(--color-muted-bg);
    min-height: 240px;
}
@media (min-width: 1024px) { .la-about-team__image-col { min-height: auto; } }
.la-about-team__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.la-about-team__members { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 640px) {
    .la-about-team__members { display: grid; grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .la-about-team__members { display: flex; flex-direction: column; }
}

/* Team member card */
.la-member-card {
    border: 1px solid var(--color-border);
    background-color: var(--color-bg);
    padding: 1.25rem;
}
.la-member-card__name {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-foreground);
    margin: 0 0 0.25rem;
}
.la-member-card__role {
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-red);
    margin-bottom: 0.5rem;
}
.la-member-card__bio {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.65;
    color: var(--color-muted-fg);
    margin: 0;
}

/* CTA section */
.la-about-cta {
    border-top: 1px solid var(--color-border);
    background-color: hsl(210, 20%, 97%);
    padding-top: 3rem;
    padding-bottom: 3.5rem;
}
.la-about-cta__inner { text-align: center; }
.la-about-cta__heading {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 3vw, 1.5rem);
    font-weight: 700;
    color: var(--color-foreground);
    margin: 0 0 0.5rem;
}
.la-about-cta__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--color-muted-fg);
    max-width: 32rem;
    margin: 0 auto 1.5rem;
    line-height: 1.65;
}
.la-about-cta__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}

/* ─────────────────────────────────────────────────────────────
   5. SERVICES PAGE
───────────────────────────────────────────────────────────── */
/* Category section */
.la-cat-section__header { margin-bottom: 2.5rem; max-width: 48rem; }
.la-cat-section__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: stretch;
}
@media (min-width: 640px) {
    .la-cat-section__grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1280px) {
    .la-cat-section__grid { grid-template-columns: repeat(3, 1fr); }
}

/* Service card (page style — distinct from homepage hover grid) */
.la-svc-card-page {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--color-border);
    background-color: var(--color-bg);
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    height: 100%;
}
.la-svc-card-page__image-wrap {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--color-muted-bg);
}
.la-svc-card-page__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}
.la-svc-card-page:hover .la-svc-card-page__img { transform: scale(1.04); }
.la-svc-card-page__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1.25rem;
}
@media (min-width: 640px) { .la-svc-card-page__body { padding: 1.5rem; } }
.la-svc-card-page__title {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-foreground);
    margin: 0 0 0.75rem;
}
@media (min-width: 640px) { .la-svc-card-page__title { font-size: 1.25rem; } }
.la-svc-card-page__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.65;
    color: var(--color-muted-fg);
    flex: 1;
    margin-bottom: 1.25rem;
}
.la-svc-card-page__cta {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.625rem 1.25rem;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
}

/* Services bottom CTA */
.la-svc-bottom-cta {
    border-top: 1px solid var(--color-border);
    background-color: var(--color-navy);
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
    color: var(--color-light);
}
.la-svc-bottom-cta__inner { max-width: 42rem; margin: 0 auto; text-align: center; }
.la-svc-bottom-cta__heading {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 3vw, 1.5rem);
    font-weight: 600;
    color: var(--color-light);
    margin: 0 0 0.5rem;
}
.la-svc-bottom-cta__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: rgba(245,247,250,0.75);
    margin-bottom: 2rem;
    line-height: 1.65;
}
@media (min-width: 768px) { .la-svc-bottom-cta__desc { font-size: 1rem; } }
.la-svc-bottom-cta__buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: stretch;
    justify-content: center;
}
@media (min-width: 640px) {
    .la-svc-bottom-cta__buttons { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 1rem; }
}

/* ─────────────────────────────────────────────────────────────
   6. CLIENT CENTER PAGE
───────────────────────────────────────────────────────────── */
/* Access section (dark navy, continuation of hero) */
.la-cc-access {
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    color: var(--color-light);
    overflow: hidden;
}
.la-cc-access__panel {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    border: 1px solid rgba(255,255,255,0.15);
    background: hsl(215 25% 12% / 0.8);
    padding: 1.5rem;
}
@media (min-width: 640px) {
    .la-cc-access__panel { flex-direction: row; align-items: center; justify-content: space-between; padding: 2rem; }
}
.la-cc-access__info { min-width: 0; }
.la-cc-access__heading {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 3vw, 1.875rem);
    font-weight: 700;
    color: var(--color-light);
    margin: 0.5rem 0 0.75rem;
}
.la-cc-access__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.7;
    color: rgba(245,247,250,0.75);
    max-width: 36rem;
    margin: 0;
}
@media (min-width: 768px) { .la-cc-access__desc { font-size: 1rem; } }
.la-cc-access__btns {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex-shrink: 0;
}
@media (min-width: 640px) { .la-cc-access__btns { align-items: flex-end; } }
.la-cc-access__btns .la-btn { padding: 0.75rem 1.5rem; font-size: 0.7rem; }

/* Portal iframe wrapper */
.la-cc-portal {
    margin-top: 2rem;
    overflow: hidden;
    width: 100%;
}
.la-cc-portal__iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    border: none;
    background: #fff;
}
.client-portal-embed { isolation: isolate; max-width: 100%; overflow: hidden; }

/* Features grid */
.la-cc-features__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-top: 2rem;
}
@media (min-width: 640px) {
    .la-cc-features__grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .la-cc-features__grid { grid-template-columns: repeat(3, 1fr); }
}

/* Support section */
.la-cc-support__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: stretch;
}
@media (min-width: 1024px) {
    .la-cc-support__grid { grid-template-columns: 1.1fr 0.9fr; gap: 2.5rem; }
}
.la-cc-support__content {}
.la-cc-support__cta { margin-top: 1.5rem; }
.la-cc-support__image-col {
    overflow: hidden;
    border: 1px solid var(--color-border);
    background: var(--color-muted-bg);
    min-height: 240px;
}
@media (min-width: 640px) { .la-cc-support__image-col { min-height: 340px; } }
.la-cc-support__img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* ─────────────────────────────────────────────────────────────
   7. CONTACT PAGE
───────────────────────────────────────────────────────────── */
/* Import insurance section (dark overlay on bg image) */
.la-import-section {
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.la-import-section__bg { position: absolute; inset: 0; }
.la-import-section__bg-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.la-import-section__overlay-1 {
    position: absolute;
    inset: 0;
    background: hsl(215 25% 12% / 0.85);
}
.la-import-section__overlay-2 {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, var(--color-navy), hsl(215 25% 12% / 0.9), hsl(215 25% 12% / 0.75));
}
.la-import-section__content {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-top: 3.5rem;
    padding-bottom: 5rem;
}
@media (min-width: 768px) { .la-import-section__content { padding-top: 5rem; padding-bottom: 5rem; } }
.la-import-section__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border: 1px solid hsl(358 82% 44% / 0.4);
    background: rgba(255,255,255,0.05);
    color: var(--color-red);
    margin-bottom: 1.25rem;
}
.la-import-section__label {
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--color-red);
    margin-bottom: 0.75rem;
}
.la-import-section__heading {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-light);
    margin: 0 0 1rem;
}
.la-import-section__desc {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.7;
    color: rgba(245,247,250,0.8);
    max-width: 36rem;
    margin-bottom: 2rem;
}
@media (min-width: 768px) { .la-import-section__desc { font-size: 1rem; } }
.la-import-section__cta { padding: 1rem 2.5rem; }

/* Integration Panel (EZLynx quote on contact page) */
.la-integration-panel {
    width: 100%;
    border: 2px solid hsl(215 25% 12% / 0.15);
    background: var(--color-bg);
    box-shadow: 0 12px 44px -10px rgba(21,35,47,0.2);
    overflow: hidden;
}
.la-integration-panel__header {
    position: relative;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    background-color: var(--color-navy);
    padding: 1.25rem 1.5rem;
}
@media (min-width: 640px) { .la-integration-panel__header { padding: 1.5rem 2rem; } }
.la-integration-panel__accent {
    position: absolute;
    inset-block: 0;
    left: 0;
    width: 4px;
    background-color: var(--color-red);
    pointer-events: none;
}
.la-integration-panel__kicker {
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--color-red);
    padding-left: 1rem;
    margin-bottom: 0.75rem;
}
.la-integration-panel__title {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 3vw, 1.875rem);
    font-weight: 700;
    color: var(--color-light);
    padding-left: 1rem;
    margin: 0;
}
.la-integration-panel__body {
    border-top: 1px solid hsl(358 82% 44% / 0.2);
    background: hsl(210 33% 97% / 0.3);
    padding: 1.5rem;
}
@media (min-width: 640px) { .la-integration-panel__body { padding: 1.75rem 2rem; } }
.la-integration-panel__intro {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.65;
    color: rgba(25,33,48,0.85);
    max-width: 42rem;
    margin-bottom: 1.25rem;
}
@media (min-width: 768px) { .la-integration-panel__intro { font-size: 1rem; } }
.la-integration-panel__embed { margin-top: 1.25rem; overflow: hidden; }
.la-contact-form-section { padding-top: var(--section-spacing); padding-bottom: var(--section-spacing); overflow: hidden; }

/* Map section */
.la-map-section__header { margin-bottom: 1.5rem; }
.la-map-section__frame-wrap {
    overflow: hidden;
    border: 1px solid var(--color-border);
    background: var(--color-bg);
}
.la-map-section__iframe {
    display: block;
    width: 100%;
    height: 320px;
    border: none;
}
@media (min-width: 768px) { .la-map-section__iframe { height: 420px; } }

/* ─────────────────────────────────────────────────────────────
   8. SCROLL-MT FOR ANCHOR LINKS (accounting for fixed header)
───────────────────────────────────────────────────────────── */
[id] { scroll-margin-top: calc(var(--header-h) + 1.5rem); }