/* =============================================================================
   Style2 overrides — typography + visual identity (Polish Parts A + B combined)

   Loaded AFTER style1's base CSS via STYLE_CSS_BUNDLES["style2"] in
   platform/app.py. Tenant-specific colors flow through CSS variables.

   Specificity strategy: every rule is scoped to `body.style-style2 ...` to
   guarantee it wins against style.css's multiple .hero__heading / .hero__cta
   definitions without resorting to !important. Body class is injected via
   inject_globals -> current_style_id in base.html.

   Type system (from demo2 admin Typography panel, 2026-05-21):
     Primary    = Jost 30px / 300 Light / UPPERCASE  -> h1/h2/section titles
     Secondary  = Jost 22px / 300 Light              -> h3/subheads
     Text       = Raleway 16px / 400 Normal          -> body
     Accent     = PT Serif 13px / 400 italic         -> eyebrow labels

   Demo3 uses the same fonts; only colors differ (see style3_design_seed_values).
   ============================================================================= */

/* ---------- FONT IMPORTS ---------- */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600&family=Raleway:wght@300;400;500;600;700&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* ---------- BODY TYPOGRAPHY ---------- */
body.style-style2 {
    font-family: 'Raleway', 'Open Sans', Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
}

/* ---------- PRIMARY HEADINGS — Jost 300 UPPERCASE with letter-spacing ---------- */
body.style-style2 h1,
body.style-style2 h2,
body.style-style2 .hero__heading,
body.style-style2 .section-title,
body.style-style2 .section-heading,
body.style-style2 .welcome__heading,
body.style-style2 .testimonial__heading,
body.style-style2 .latest-news__heading,
/* Hf-heading-parity 2026-06-02: .departments__heading added after style.css
   wide-Cabin block scoped to body.style-style1 (edit 8). Cowork live probe
   confirmed 1 instance on style2 home. */
body.style-style2 .departments__heading {
    font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.15;
}

/* ---------- SECONDARY HEADINGS — Jost 300, mixed case ---------- */
body.style-style2 h3 {
    font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-style: normal;
    font-weight: 300;
    text-transform: none;
    letter-spacing: 0;
    font-size: 22px;
    line-height: 1.25;
}

/* h4-h6 stay Jost but slightly heavier for legibility at small sizes */
body.style-style2 h4,
body.style-style2 h5,
body.style-style2 h6 {
    font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

/* ---------- ACCENT (eyebrow labels) — PT Serif italic ---------- */
body.style-style2 .section-eyebrow,
body.style-style2 .welcome__eyebrow,
body.style-style2 .testimonial__eyebrow,
body.style-style2 .latest-news__label,
body.style-style2 .services-list__eyebrow {
    font-family: 'PT Serif', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 0.8125rem;
    letter-spacing: 0.05em;
    text-transform: none;
    color: var(--primary);
    margin-bottom: 0.5rem;
    display: inline-block;
}

/* EB-1 (2026-05-25): hero eyebrow was 0.8125rem - too small per demo notes.
   Bump to 1rem with more tracking so 'What About Us' reads clearly. */
body.style-style2 .hero__eyebrow {
    font-size: 1rem;
    letter-spacing: 0.08em;
}

/* EB-welcome (2026-05-28): welcome eyebrow inherited the canonical 0.8125rem
   which read too quiet above the welcome heading. Bump to match the
   .hero__eyebrow EB-1 treatment (same specificity, later position wins). */
body.style-style2 .welcome__eyebrow {
    font-size: 1rem;
    letter-spacing: 0.08em;
}

/* ---------- HERO SLIDER ---------- */
body.style-style2 .hero__heading {
    font-size: clamp(1.875rem, 5vw, 3rem);
    line-height: 1.1;
    color: var(--primary);
    margin-bottom: 0.75rem;
    max-width: 55%;
}

body.style-style2 .hero__sub {
    font-family: 'Raleway', sans-serif;
    color: #333;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0.5rem 0 1rem;
    max-width: 50%;
}

/* ---------- CTA BUTTONS — lime bg, dark teal text, Jost caps ---------- */
body.style-style2 .hero__cta,
body.style-style2 .hero__cta--colors,
body.style-style2 .btn--primary,
body.style-style2 .cta-button,
body.style-style2 .book-now-btn {
    background: var(--primary);
    color: white;
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    border: 0;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.95rem 2rem;
    border-radius: 0;
    display: inline-block;
}

body.style-style2 .hero__cta:hover,
body.style-style2 .btn--primary:hover,
body.style-style2 .cta-button:hover {
    filter: brightness(0.92);
}

/* ---------- TOPBAR ---------- */
body.style-style2 .topbar {
    background: var(--primary);
}

/* ---------- FOOTER ---------- */
body.style-style2 footer,
body.style-style2 .site-footer,
body.style-style2 .footer {
    background: #006f66 !important;
    color: white;
}

body.style-style2 footer a,
body.style-style2 .site-footer a,
body.style-style2 .footer a {
    color: var(--accent);
}

body.style-style2 footer a:hover,
body.style-style2 .site-footer a:hover,
body.style-style2 .footer a:hover {
    color: var(--accent);
}

body.style-style2 footer h3,
body.style-style2 footer h4,
body.style-style2 .footer h3,
body.style-style2 .footer h4 {
    color: #ffffff;
}

/* ---------- WELCOME (HEART AND SCIENCE format) ---------- */
body.style-style2 .welcome {
    background: #f8f9fa;
    /* EB-4 (2026-05-25): reduce bottom padding so the gap before the
       lime BOOK NOW band tightens (was 3rem both ends). */
    padding: 3rem 0 1.5rem 0;
}

body.style-style2 .welcome__inner {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: start;
}

@media (min-width: 992px) {
    body.style-style2 .welcome__inner {
        flex-direction: row;
    }
    body.style-style2 .welcome__text-col {
        flex: 1.2;
    }
    body.style-style2 .welcome__media-col {
        flex: 1;
    }
}

body.style-style2 .welcome__heading {
    font-size: clamp(1.5rem, 3.5vw, 2.2rem);
    margin: 0.25rem 0 0.75rem;
    color: var(--primary);
}

body.style-style2 .welcome__text {
    font-family: 'Raleway', sans-serif;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #444;
}

body.style-style2 .welcome__features {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0;
}

body.style-style2 .welcome__features li {
    padding-left: 1.6rem;
    position: relative;
    font-family: 'Raleway', sans-serif;
    font-size: 0.95rem;
    line-height: 1.7;
    color: #333;
    margin-bottom: 0.35rem;
}

body.style-style2 .welcome__features li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: var(--accent);
    font-weight: 700;
}

body.style-style2 .welcome__image {
    width: 100%;
    aspect-ratio: 5 / 4;
    height: auto;
    /* EB-2: cap stacked height so the image never dominates on narrow widths. */
    max-height: 460px;
    object-fit: cover;
    border-radius: 4px;
}

/* =============================================================================
   Part B section structure rules (services / testimonial / news)
   ============================================================================= */

/* ---------- SERVICES LIST — vertical bulleted condition list ---------- */
body.style-style2 .services-list--bulleted {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 0;
    text-align: left;
}

body.style-style2 .services-list--bulleted__item {
    padding: 1rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

body.style-style2 .services-list--bulleted__item:last-child {
    border-bottom: 0;
}

body.style-style2 .services-list--bulleted__name {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 1.05rem;
    color: var(--primary);
    margin: 0 0 0.35rem 0;
    padding-left: 1.5rem;
    position: relative;
}

body.style-style2 .services-list--bulleted__name::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: var(--accent);
    font-weight: 700;
}

body.style-style2 .services-list--bulleted__desc {
    font-family: 'Raleway', sans-serif;
    font-size: 0.92rem;
    color: #555;
    line-height: 1.5;
    margin: 0 0 0.5rem 0;
    padding-left: 1.5rem;
}

body.style-style2 .services-list--bulleted__link {
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    color: var(--primary);
    text-decoration: none;
    font-size: 0.9rem;
    padding-left: 1.5rem;
}

body.style-style2 .services-list--bulleted__link::after { content: ' +'; }
body.style-style2 .services-list--bulleted__link:hover { color: var(--accent); }

/* ---------- TESTIMONIAL — 2-column (quote left, circular photo right) ---------- */
body.style-style2 .testimonial { background: #f8f9fa; padding: 3rem 0; }

body.style-style2 .testimonial__slide {
    display: none;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
    padding: 0;
    text-align: left;
}

@media (min-width: 768px) {
    body.style-style2 .testimonial__slide {
        grid-template-columns: 1.4fr 1fr;
        gap: 2.5rem;
    }
}

body.style-style2 .testimonial__slide.active { display: grid; }

body.style-style2 .testimonial__quote {
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    color: #333;
    margin: 0.5rem 0 1rem;
}

body.style-style2 .testimonial__name {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #ffffff;
    margin: 0 0 0.15rem 0;
    font-size: 1.1rem;
}

body.style-style2 .testimonial__role {
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    color: #777;
    font-size: 0.85rem;
    margin: 0;
}

body.style-style2 .testimonial__avatar {
    width: 200px;
    height: 200px;
    max-width: 200px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 50%;
    display: block;
    margin: 0 auto;
}


/* ---------- LATEST NEWS — numbered 01-04 with rounded photo ---------- */
body.style-style2 .latest-news { padding: 3rem 0; }

body.style-style2 .news-grid--numbered {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    margin-top: 1.5rem;
}

@media (min-width: 992px) {
    body.style-style2 .news-grid--numbered {
        grid-template-columns: 1fr 1fr;
    }
}

body.style-style2 .news-item--numbered {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 1.25rem;
    align-items: start;
}

@media (min-width: 768px) {
    body.style-style2 .news-item--numbered {
        /* EB-7 (2026-05-25): text column was 1fr (stretched full width),
           leaving a large gap before the 140px image. minmax keeps text
           readable but lets it sit nearer the photo. */
        grid-template-columns: minmax(0, 1fr) 160px;
        gap: 1.5rem;
    }
    body.style-style2 .news-item--numbered__image {
        order: 2;
    }
    body.style-style2 .news-item--numbered__text {
        order: 1;
    }
}

body.style-style2 .news-item--numbered__number {
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    /* EB-6 (2026-05-25): lime var(--accent) failed contrast on light bg.
       Switch to primary teal for WCAG-AA legibility. */
    color: var(--primary);
    font-size: 1.4rem;
    letter-spacing: 0.1em;
    margin: 0 0 0.5rem 0;
}

body.style-style2 .news-item--numbered__title {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
    color: var(--primary);
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
}

body.style-style2 .news-item--numbered__excerpt {
    font-family: 'Raleway', sans-serif;
    font-size: 0.88rem;
    color: #555;
    line-height: 1.55;
    margin: 0 0 0.5rem 0;
}

body.style-style2 .news-item--numbered__image {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 50%;
}

body.style-style2 .news-item--numbered__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

body.style-style2 .news-item--numbered__link {
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    color: var(--primary);
    text-decoration: none;
    font-size: 0.88rem;
}

body.style-style2 .news-item--numbered__link::after { content: ' \2192'; }
body.style-style2 .news-item--numbered__link:hover { color: var(--accent); }

/* =============================================================================
   Style2 mobile hero typography — overrides base.html legacy mobile block
   (which we scoped to body.style-style1 in this PR; style2 now defines its own).
   ============================================================================= */
@media (max-width: 768px) {
    body.style-style2 .hero__slide-content {
        padding: 40px 20px !important;
        max-width: 100% !important;
    }
    body.style-style2 .hero__heading {
        font-family: 'Jost', sans-serif;
        font-size: 1.5rem;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        line-height: 1.2;
        color: var(--primary);
        max-width: 100%;
        margin: 0 0 0.5rem;
    }
    body.style-style2 .hero__sub {
        font-family: 'Raleway', sans-serif;
        font-size: 0.95rem;
        color: #333;
        max-width: 100%;
    }
    body.style-style2 .hero__cta {
        font-family: 'Jost', sans-serif;
        font-size: 0.95rem;
        background: var(--primary);
        color: white;
    }
}

@media (max-width: 480px) {
    body.style-style2 .hero__heading {
        font-size: 1.25rem;
    }
    body.style-style2 .hero__sub {
        font-size: 0.9rem;
    }
}

/* =============================================================================
   Style2 D.2 — middle sections CSS
   Adds: quicklinks restyle, welcome image-LEFT, book_now_card, departments
   tabbed lime-card variant.
   ============================================================================= */

/* ---------- QUICKLINKS (3-tile dark teal row, first active darker) ---------- */
body.style-style2 .quicklinks {
    background: var(--primary);
    padding: 0;
    margin: 0;
}

body.style-style2 .quicklinks__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 100%;
    padding: 0;
}

@media (min-width: 768px) {
    body.style-style2 .quicklinks__inner {
        grid-template-columns: repeat(3, 1fr);
    }
}

body.style-style2 .quicklinks__item {
    padding: 2.25rem 1.75rem;
    color: white;
    text-align: left;
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    transition: background 0.2s;
}

@media (min-width: 768px) {
    body.style-style2 .quicklinks__item {
        border-bottom: 0;
        border-right: 1px solid rgba(255, 255, 255, 0.10);
    }
    body.style-style2 .quicklinks__item:last-child {
        border-right: 0;
    }
}

body.style-style2 .quicklinks__item:first-child {
    background: rgba(0, 0, 0, 0.20);
}

body.style-style2 .quicklinks__item:hover {
    background: rgba(0, 0, 0, 0.10);
}

body.style-style2 .quicklinks__icon {
    color: var(--accent);
    font-size: 1.6rem;
    margin-bottom: 0.75rem;
}

body.style-style2 .quicklinks__title {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 1.1rem;
    color: white;
    margin: 0 0 0.4rem;
}

body.style-style2 .quicklinks__text {
    font-family: 'Raleway', sans-serif;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.80);
    margin: 0 0 0.75rem;
    line-height: 1.5;
}

body.style-style2 .quicklinks__cta {
    color: var(--accent);
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    font-size: 0.95rem;
}

body.style-style2 .quicklinks__cta::after { content: ' +'; }

/* ---------- WELCOME — image LEFT, text RIGHT (DOM-ordered, no CSS reorder needed) ---------- */
body.style-style2 .welcome__inner {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: stretch;
}

/* EB-2 (2026-05-25): lowered from 992px so the 2-col welcome layout appears
   at regular browser widths (the image was full-width/giant just under 992). */
@media (min-width: 860px) {
    body.style-style2 .welcome__inner {
        flex-direction: row;
        align-items: center;
    }
    body.style-style2 .welcome__media-col {
        flex: 1;
    }
    body.style-style2 .welcome__text-col {
        flex: 1.2;
    }
}

body.style-style2 .welcome__phone-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: 1rem;
    padding: 0.6rem 1.25rem;
    background: var(--primary);
    color: white;
    text-decoration: none;
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    font-size: 1.05rem;
    letter-spacing: 0.03em;
    border-radius: 0;
}

body.style-style2 .welcome__phone-cta i {
    color: var(--accent);
}

body.style-style2 .welcome__phone-cta:hover {
    background: var(--secondary);
}

/* ---------- BOOK NOW CARD (full-width lime, hand-with-heart icon LEFT, BOOK NOW arrow RIGHT) ---------- */
body.style-style2 .book-now-card {
    background: var(--accent);
    padding: 0;
}

body.style-style2 .book-now-card__link {
    /* EB-3 (2026-05-25): center the icon+text cluster (was left-spread via
       text flex:1) so the band reads as one cohesive, clearly-clickable unit. */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 2rem 2.5rem;
    color: var(--primary);
    text-decoration: none;
    max-width: 1280px;
    margin: 0 auto;
}

body.style-style2 .book-now-card__icon {
    flex-shrink: 0;
}

body.style-style2 .book-now-card__icon i {
    font-size: 3.5rem;
    color: var(--primary);
}

body.style-style2 .book-now-card__text {
    /* EB-3: no flex stretch - let text hug the icon in the centered cluster. */
    flex: 0 1 auto;
}

body.style-style2 .book-now-card__eyebrow {
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    font-size: 0.95rem;
    margin: 0 0 0.25rem;
    color: var(--primary);
}

body.style-style2 .book-now-card__heading {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    font-size: 2rem;
    margin: 0;
    color: var(--primary);
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

body.style-style2 .book-now-card__heading i {
    font-size: 1.5rem;
}

body.style-style2 .book-now-card__link:hover {
    filter: brightness(0.95);
}
/* EB-3: clickable affordance - underline BOOK NOW heading + nudge arrow on hover. */
body.style-style2 .book-now-card__link:hover .book-now-card__heading {
    text-decoration: underline;
    text-underline-offset: 6px;
}
body.style-style2 .book-now-card__link:hover .book-now-card__heading i {
    transform: translateX(4px);
    transition: transform 0.2s ease;
}

/* ---------- DEPARTMENTS (tabbed lime-card variant) ---------- */
body.style-style2 .departments {
    background: #fafafa;
    padding: 3.5rem 0;
}

body.style-style2 .departments__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

body.style-style2 .departments__header {
    text-align: center;
    margin-bottom: 2rem;
}

body.style-style2 .departments__sub {
    font-family: 'Raleway', sans-serif;
    font-size: 0.95rem;
    color: #666;
    margin: 0.5rem 0 0;
}

body.style-style2 .dept-tabs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    body.style-style2 .dept-tabs {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 1024px) {
    body.style-style2 .dept-tabs {
        grid-template-columns: repeat(6, 1fr);
    }
}

body.style-style2 .dept-tab {
    background: var(--primary);
    color: white;
    border: 0;
    padding: 1rem 0.5rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.2s;
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    border-radius: 0;
}

body.style-style2 .dept-tab.active {
    background: var(--accent);
    color: var(--primary);
}

body.style-style2 .dept-tab__icon {
    font-size: 1.4rem;
}

body.style-style2 .dept-tab__icon img {
    max-width: 32px;
    max-height: 32px;
}

body.style-style2 .dept-tab__name {
    line-height: 1.2;
    text-align: center;
}

body.style-style2 .dept-panel {
    display: none;
}

body.style-style2 .dept-panel.active {
    display: block;
}

body.style-style2 .dept-panel__inner {
    background: var(--accent);
    padding: 2.5rem 2rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
}

@media (min-width: 768px) {
    body.style-style2 .dept-panel__inner {
        grid-template-columns: 200px 1fr;
        gap: 2.5rem;
    }
}

body.style-style2 .dept-panel__icon {
    text-align: center;
}

body.style-style2 .dept-panel__icon i {
    font-size: 6rem;
    color: var(--primary);
}

body.style-style2 .dept-panel__icon img {
    max-width: 160px;
    max-height: 160px;
}

body.style-style2 .dept-panel__name {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1.5rem;
    color: var(--primary);
    margin: 0 0 0.75rem;
}

body.style-style2 .dept-panel__text {
    font-family: 'Raleway', sans-serif;
    color: var(--primary);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0 0 1rem;
}

body.style-style2 .dept-panel__link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--primary);
    color: white;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.85rem;
    border-radius: 0;
}

body.style-style2 .dept-panel__link:hover {
    background: var(--secondary);
}


/* =============================================================================
   Hf-style2-grab-match (2026-05-22) — late-cascade overrides for layout changes
   that don't fit cleanly as in-place edits. Per-rule comments explain intent.
   ============================================================================= */

/* ---------- TESTIMONIAL — heading WHITE, eyebrow LIME on dark-teal bg ---------- */
body.style-style2 .testimonial__heading {
    color: #ffffff !important;
}
body.style-style2 .testimonial__eyebrow {
    color: var(--accent) !important;
}
body.style-style2 .testimonial__quote {
    color: #ffffff !important;
}

/* ---------- SERVICES PANEL — nested navy (#2e4a6f) + lime (#c0d731) at 35/65 ---------- */
body.style-style2 .dept-panel,
body.style-style2 .dept-panel.active {
    background: #2e4a6f !important;
    background-image: none !important;
    padding: 40px 40px 40px 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
}

body.style-style2 .dept-panel__inner {
    background: transparent !important;
    display: grid !important;
    grid-template-columns: 32% 68% !important;
    gap: 0 !important;
    align-items: stretch !important;
    min-height: 360px !important;
}

body.style-style2 .dept-panel__icon {
    background: transparent !important;
    color: #c0d731 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
}

body.style-style2 .dept-panel__icon i {
    color: #c0d731 !important;
    font-size: 14rem !important;
}

body.style-style2 .dept-panel__icon img {
    max-width: 140px !important;
    height: auto !important;
}

body.style-style2 .dept-panel__content {
    background: #c0d731 !important;
    padding: 50px 60px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    min-height: 360px !important;
    border-radius: 16px !important;
}

body.style-style2 .dept-panel__name {
    color: #2e4a6f !important;
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: 1.6rem !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .dept-panel__text {
    color: #2e4a6f !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    margin: 0 0 1.25rem 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 5 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

body.style-style2 .dept-panel__link {
    color: #2e4a6f !important;
    background: transparent !important;
    border: 2px solid #2e4a6f !important;
    padding: 0.6rem 1.4rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    align-self: flex-start !important;
    margin-top: auto !important;
    text-decoration: none !important;
}

body.style-style2 .dept-panel__link:hover {
    background: #2e4a6f !important;
    color: #c0d731 !important;
}

@media (max-width: 768px) {
    body.style-style2 .dept-panel__inner {
        grid-template-columns: 1fr !important;
    }
    body.style-style2 .dept-panel__content {
        padding: 24px !important;
    }
}

/* ---------- QUICKLINKS — 3 edge-to-edge tiles, alternating navy/green/navy ---------- */
body.style-style2 .quicklinks {
    background: transparent !important;
    padding: 0 !important;
}

body.style-style2 .quicklinks__inner {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0 !important;
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.style-style2 .quicklinks__item {
    background: #2e4a6f;
    color: #ffffff;
    /* D2 (2026-05-29): layout !important stripped (padding/min-height/
       flex-direction/align-items/text-align) so the .page-banner + .quicklinks
       compact rule can win on inner pages via specificity. */
    padding: 60px 50px 50px 50px;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    min-height: 380px;
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

body.style-style2 .quicklinks__item:nth-child(2) {
    background: #006f66;
}

body.style-style2 .quicklinks__item:nth-child(3) {
    background: #2e4a6f;
}

body.style-style2 .quicklinks__item:hover {
    filter: brightness(1.08) !important;
}

/* Override the "first child active darker" rule from earlier polish — colors are intrinsic now */
body.style-style2 .quicklinks__item:first-child {
    background: #2e4a6f;
}

body.style-style2 .quicklinks__icon {
    color: #ffffff;
    font-size: 3.5rem !important;
    margin: 0 0 28px 0 !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    border: none !important;
}

body.style-style2 .quicklinks__icon i {
    color: #ffffff;
    font-size: 3.5rem !important;
}

body.style-style2 .quicklinks__title {
    color: #ffffff !important;
    font-family: 'Jost', 'Open Sans', Arial, sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: 1.8rem !important;
    line-height: 1.15 !important;
    margin: 0 0 18px 0 !important;
}

body.style-style2 .quicklinks__text {
    color: #ffffff !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
    margin: 0 0 28px 0 !important;
}

body.style-style2 .quicklinks__cta {
    color: #c0d731 !important;
    font-family: 'Raleway', sans-serif !important;
    font-weight: 500 !important;
    font-size: 1rem !important;
    margin-top: auto !important;
}

@media (max-width: 768px) {
    body.style-style2 .quicklinks__inner {
        grid-template-columns: 1fr !important;
    }
    body.style-style2 .quicklinks__item {
        min-height: auto !important;
        padding: 40px 28px !important;
    }
}


/* =============================================================================
   Hf-style2-about-us-grab-match (2026-05-23) — About page styles to match grab
   ============================================================================= */

/* Hide the page-banner on style2 inner pages (Phase R 2026-05-30 — see
   trailing block for the audit trail; this comment preserves placement
   alignment with the original PR #128 location.) */

/* D4 (2026-05-29): user direction reversed - quicklinks SHOULD appear on
   inner pages in a less prominent / compact way. PR #128 hid them here
   based on a now-superseded grab. The compact treatment lives in the
   QL-COMPACT block below. */

/* ---------- ABOUT BLOCK — image LEFT + text RIGHT (grab Block 1 layout) ---------- */
body.style-style2 .about__hero {
    padding: 80px 0 !important;
    background: #ffffff !important;
}

body.style-style2 .about__hero .two-col {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    gap: 60px !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
}

body.style-style2 .about__hero .two-col__left,
body.style-style2 .about__hero .two-col__right {
    flex: 1 !important;
    min-width: 0 !important;
}

body.style-style2 .about__eyebrow {
    /* EB-10 (2026-05-27): unified to canonical PT Serif italic teal eyebrow
       (was Raleway uppercase gray - inconsistent with homepage/Services). */
    font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.05em !important;
    text-transform: none !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .about__heading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important; /* Heading-parity 2026-06-06: 0.03em -> 0.04em to match canonical PRIMARY HEADINGS block (~L49) used by .hero__heading + .welcome__heading etc. */
    font-size: clamp(1.875rem, 5vw, 3rem) !important; /* Hf-heading-parity 2026-06-02: bumped to hero clamp for inner-page parity */
    line-height: 1.15 !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .about__subheading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important; /* Heading-parity 2026-06-06: 0.03em -> 0.04em to match .about__heading + canonical PRIMARY HEADINGS (~L49). Note covers headline AND subhead per CMS-markup-June-1. */
    font-size: clamp(1.4rem, 2.5vw, 1.8rem) !important;
    color: var(--primary) !important;
    margin: 0 0 1.25rem 0 !important;
}

body.style-style2 .about__cta-text {
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
    color: #006f66 !important;
    /* Hf-heading-parity 2026-06-02: tighten cluster gap to satisfy POST-QA
       invariant ≤12px between .about__cta-text and first .about__text p.
       Cowork measured pre-state gap=24px; post 0.25rem ≈ 4px. */
    margin: 0 0 0.25rem 0 !important;
}

body.style-style2 .about__text {
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    color: #006f66 !important;
    margin: 0 0 1.5rem 0 !important;
}

body.style-style2 .about__text p {
    /* Hf-heading-parity 2026-06-02: explicit color on the p children — the
       container rule above sets #006f66 but inner-pages.css:147 .about__text p
       { color: #666 } wins via direct-rule-beats-inheritance. (0,1,2) +
       !important here beats (0,1,1) without !important. */
    color: #006f66 !important;
    margin: 0 0 1rem 0 !important;
}
/* Hf-heading-parity 2026-06-02: 15b — belt-and-suspenders cluster-gap fix.
   Cooperates with .about__cta-text margin-bottom: 0.25rem (edit 14). Margin
   collapsing normally handles this, but explicit margin-top:0 covers
   browsers that don't collapse adjacent block margins (rare modes). */
body.style-style2 .about__text p:first-child {
    margin-top: 0 !important;
}

body.style-style2 .about__bullets {
    list-style: none !important;
    padding: 0 !important;
    margin: 1.25rem 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem 1.5rem !important;
}

body.style-style2 .about__bullets li {
    padding-left: 1.75rem !important;
    position: relative !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 0.95rem !important;
    line-height: 1.4 !important;
    color: #333 !important;
}

body.style-style2 .about__bullets li::before {
    content: '\2713' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    color: var(--accent) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}

body.style-style2 .about__hero .about__image {
    width: 100% !important;
    height: auto !important;
}

body.style-style2 .about__hero .about__image img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    display: block !important;
}

@media (max-width: 768px) {
    body.style-style2 .about__hero .two-col {
        flex-direction: column !important;
        gap: 30px !important;
    }
}

/* ---------- SERVICES GRID below about block ---------- */
body.style-style2 .about-page-services,
body.style-style2 .section--gray {
    background: #f7f7f5 !important;
    padding: 60px 40px !important;
}

body.style-style2 .section--gray .section-heading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: clamp(1.875rem, 5vw, 3rem) !important; /* Hf-heading-parity 2026-06-02: bumped to hero clamp for inner-page parity */
    color: var(--primary) !important;
    text-align: center !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .section--gray .services-grid {
    max-width: 1280px !important;
    margin: 1.5rem auto 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1.5rem !important;
}

/* Override .service-card flex sizing inherited from style1's flexbox layout.
   In our grid context, let the card fill its grid track. */
body.style-style2 .section--gray .services-grid > .service-card {
    flex: initial !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
}

@media (max-width: 992px) {
    body.style-style2 .section--gray .services-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    body.style-style2 .section--gray .services-grid {
        grid-template-columns: 1fr !important;
    }
}


/* =============================================================================
   Hf-style2-team-grab-match (2026-05-23) — Team page styles to match grab
   ============================================================================= */

/* ---------- Team section heading + intro ---------- */
body.style-style2 .team-grid {
    max-width: 1200px !important;
    margin: 2rem auto 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2rem !important;
    padding: 0 40px !important;
}

@media (max-width: 992px) {
    body.style-style2 .team-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    body.style-style2 .team-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ---------- Doctor card — square portrait + minimal text ---------- */
body.style-style2 .team-grid .doctor-circle {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Photo: square aspect-ratio 3:4 matching grab portraits */
body.style-style2 .team-grid .doctor-circle__photo {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 4 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: #f5f5f5 !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .team-grid .doctor-circle__photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
    display: block !important;
}

/* Doctor name — small dark italic, matching grab */
body.style-style2 .team-grid .doctor-circle__name {
    font-family: 'Jost', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1.05rem !important;
    color: var(--primary) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 0 0.25rem 0 !important;
    text-align: center !important;
}

/* Hide the per-doctor underline + Learn More CTA — grab doesn't show them */
body.style-style2 .team-grid .doctor-circle__underline {
    display: none !important;
}

body.style-style2 .team-grid .doctor-circle__cta {
    display: none !important;
}

/* ---------- Section header above the grid (eyebrow + heading + intro) ---------- */
body.style-style2 .section .section-label {
    /* EB-10 (2026-05-27): unified to canonical PT Serif italic teal eyebrow
       (was Raleway uppercase gray - inconsistent with homepage/Services). */
    font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.05em !important;
    text-transform: none !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .section .section-heading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: clamp(1.875rem, 5vw, 3rem) !important; /* Hf-heading-parity 2026-06-02: bumped to hero clamp for inner-page parity */
    color: var(--primary) !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .section .section-intro {
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
    color: #666 !important;
    max-width: 720px !important;
    margin: 0 auto 1rem auto !important;
}

body.style-style2 .section .section-underline {
    display: inline-block !important;
    width: 60px !important;
    height: 3px !important;
    background: var(--primary) !important;
    margin: 0.5rem auto 0 !important;
}


/* =============================================================================
   Hf-style2-contact-grab-match (2026-05-23) — Contact page styles to match grab
   ============================================================================= */

/* ---------- 3-CARD TOP SECTION (Our Location / Our Contact / Mail Us) ---------- */
body.style-style2 .contact-cards {
    background: #ffffff !important;
    padding: 60px 40px 40px !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
}

body.style-style2 .contact-cards__grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2rem !important;
}

body.style-style2 .contact-card {
    background: #f7f7f5 !important;
    padding: 40px 30px !important;
    text-align: center !important;
    border-radius: 4px !important;
}

body.style-style2 .contact-card__icon {
    width: 72px !important;
    height: 72px !important;
    background: #2e4a6f !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 1.25rem auto !important;
    border-radius: 4px !important;
}

body.style-style2 .contact-card__icon i {
    color: #ffffff !important;
    font-size: 1.75rem !important;
}

body.style-style2 .contact-card__title {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-size: 1.2rem !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .contact-card__body {
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    color: #006f66 !important;
    margin: 0 !important;
}

body.style-style2 .contact-card__body a {
    color: #006f66 !important;
    text-decoration: none !important;
}

body.style-style2 .contact-card__body a:hover {
    color: var(--primary) !important;
}

@media (max-width: 992px) {
    body.style-style2 .contact-cards__grid {
        grid-template-columns: 1fr !important;
    }
}

/* ---------- FORM SECTION: hide redundant sidebar, center form ---------- */
body.style-style2 .contact-section .two-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

body.style-style2 .contact-section .two-col__left {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 800px !important;
}

body.style-style2 .contact-section .two-col__right {
    display: none !important;
}

/* Center heading + eyebrow above the form */
body.style-style2 .contact-section .two-col__left {
    text-align: center !important;
}

body.style-style2 .contact-section .section-eyebrow {
    /* EB-10 (2026-05-27): unified to canonical PT Serif italic teal eyebrow
       (was Raleway uppercase gray - inconsistent with homepage/Services). */
    font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.05em !important;
    text-transform: none !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .contact-section .section-heading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: clamp(1.875rem, 5vw, 3rem) !important; /* Hf-heading-parity 2026-06-02: bumped to hero clamp for inner-page parity */
    color: var(--primary) !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .contact-section .section-underline {
    display: inline-block !important;
    width: 60px !important;
    height: 3px !important;
    background: var(--primary) !important;
    margin: 0 auto 1.5rem auto !important;
}

/* Form left-align inside the centered column */
body.style-style2 .contact-section form {
    text-align: left !important;
    max-width: 600px !important;
    margin: 0 auto !important;
}

body.style-style2 .contact-section .contact-form__group {
    margin-bottom: 1rem !important;
}

body.style-style2 .contact-section .contact-form__label {
    font-family: 'Raleway', sans-serif !important;
    font-size: 0.95rem !important;
    color: #333 !important;
    margin-bottom: 0.35rem !important;
    display: block !important;
}

body.style-style2 .contact-section .contact-form__input,
body.style-style2 .contact-section .contact-form__textarea {
    width: 100% !important;
    padding: 0.65rem 0.9rem !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
}

body.style-style2 .contact-section .contact-form__textarea {
    min-height: 140px !important;
}

body.style-style2 .contact-section button.btn-primary {
    background: var(--primary) !important;
    color: #ffffff !important;
    padding: 0.7rem 1.6rem !important;
    border: none !important;
    border-radius: 4px !important;
    font-family: 'Jost', sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 0.04em !important;
    cursor: pointer !important;
}

body.style-style2 .contact-section button.btn-primary:hover {
    background: #006f66 !important;
}

@media (max-width: 768px) {
    body.style-style2 .contact-cards {
        padding: 40px 20px 30px !important;
    }
}


/* =============================================================================
   Hf-style2-faq-grab-match (2026-05-23) — FAQ page styles to match grab
   ============================================================================= */

/* ---------- FAQ SECTION — image LEFT + accordion RIGHT ---------- */
body.style-style2 .faq-section {
    padding: 60px 40px !important;
    background: #ffffff !important;
}

body.style-style2 .faq-section .two-col {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: flex-start !important;
    gap: 60px !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
}

body.style-style2 .faq-section .two-col__left,
body.style-style2 .faq-section .two-col__right {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}

body.style-style2 .faq-section .two-col__right img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 4px !important;
}

/* Eyebrow above heading */
body.style-style2 .faq__eyebrow {
    /* EB-10 (2026-05-27): unified to canonical PT Serif italic teal eyebrow
       (was Raleway uppercase gray - inconsistent with homepage/Services). */
    font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.05em !important;
    text-transform: none !important;
    color: var(--primary) !important;
    margin: 0 0 0.5rem 0 !important;
}

body.style-style2 .faq-section .section-heading {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: clamp(1.875rem, 5vw, 3rem) !important; /* Hf-heading-parity 2026-06-02: bumped to hero clamp for inner-page parity */
    color: var(--primary) !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .faq-section .section-underline {
    display: block !important;
    width: 60px !important;
    height: 3px !important;
    background: var(--primary) !important;
    margin: 0 0 1.25rem 0 !important;
}

body.style-style2 .faq__intro {
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    line-height: 1.6 !important;
    color: #006f66 !important;
    margin: 0 0 1.5rem 0 !important;
}

/* ---------- Accordion items ---------- */
body.style-style2 .faq-accordion {
    margin-top: 1rem !important;
}

body.style-style2 .faq-accordion__item {
    background: #f7f7f5 !important;
    margin-bottom: 0.75rem !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    transition: background 0.2s !important;
}

body.style-style2 .faq-accordion__item.active {
    background: var(--primary) !important;
}

body.style-style2 .faq-accordion__question {
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 1rem 1.25rem !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    color: var(--primary) !important;
    text-align: left !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    cursor: pointer !important;
}

body.style-style2 .faq-accordion__item.active .faq-accordion__question {
    color: #ffffff !important;
}

body.style-style2 .faq-accordion__icon::after {
    content: '+' !important;
    font-size: 1.25rem !important;
    color: var(--primary) !important;
}

body.style-style2 .faq-accordion__item.active .faq-accordion__icon::after {
    content: '\2212' !important;
    color: #ffffff !important;
}

body.style-style2 .faq-accordion__answer {
    padding: 0 1.25rem 1rem 1.25rem !important;
    background: #ffffff !important;
    color: var(--primary) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
}

body.style-style2 .faq-accordion__item:not(.active) .faq-accordion__answer {
    display: none !important;
}

/* Mobile: stack image above accordion */
@media (max-width: 768px) {
    body.style-style2 .faq-section .two-col {
        flex-direction: column !important;
        gap: 30px !important;
    }
}


/* =============================================================================
   Hf-style2-news-grab-match (2026-05-24) — News / Blog index styles to match grab
   ============================================================================= */

body.style-style2 .blog-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2rem !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 60px 40px !important;
}

@media (max-width: 992px) {
    body.style-style2 .blog-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    body.style-style2 .blog-grid {
        grid-template-columns: 1fr !important;
    }
}

body.style-style2 .blog-card {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.style-style2 .blog-card__image {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
    border-radius: 4px !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .blog-card__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

body.style-style2 .blog-card__content {
    padding: 0 !important;
}

body.style-style2 .blog-card__title {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
    margin: 0 0 0.75rem 0 !important;
}

body.style-style2 .blog-card__title a {
    color: var(--primary) !important;
    text-decoration: none !important;
}

body.style-style2 .blog-card__title a:hover {
    color: #006f66 !important;
}

body.style-style2 .blog-card__excerpt {
    font-family: 'Raleway', sans-serif !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
    color: #555 !important;
    margin: 0 0 1rem 0 !important;
}

body.style-style2 .blog-card__link {
    font-family: 'Raleway', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.95rem !important;
    color: #006f66 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.35rem !important;
}

body.style-style2 .blog-card__link:hover {
    color: var(--primary) !important;
}

/* QL-COMPACT (2026-05-28): when .quicklinks sits directly after a
   .page-banner (inner pages only), render a shorter / less-prominent
   variant. Homepage hero unaffected (homepage has no page_banner).
   Selector specificity wins over base .quicklinks__item without !important. */
body.style-style2 .page-banner + .quicklinks {
    padding: 16px 0;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__item {
    padding: 20px 24px;
    min-height: auto;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    text-align: left;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__icon {
    font-size: 1.5rem;
    margin: 0;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__text {
    font-size: 0.95rem;
}

/* SERVICES-CARDS (2026-05-28): replace bulleted services_list with a card
   grid mirroring the homepage card aesthetic. 3-col desktop / 2 tablet /
   1 mobile. icon_url FA-class or stethoscope fallback. */
body.style-style2 .services-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 32px;
}
@media (max-width: 1024px) {
    body.style-style2 .services-card-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    body.style-style2 .services-card-grid { grid-template-columns: 1fr; }
}
body.style-style2 .services-card {
    display: block;
    background: #fff;
    padding: 32px 28px;
    border: 1px solid #e6ebef;
    border-radius: 4px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}
body.style-style2 .services-card:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(0,0,0,0.06);
}
body.style-style2 .services-card__icon {
    color: var(--primary);
    font-size: 2.25rem;
    margin-bottom: 16px;
}
body.style-style2 .services-card__name {
    font-family: 'Jost', sans-serif;
    font-size: 1.25rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 12px 0;
    color: var(--primary);
}
body.style-style2 .services-card__desc {
    font-family: 'Raleway', sans-serif;
    font-size: 0.95rem;
    line-height: 1.55;
    color: #4a5560;
    margin: 0 0 16px 0;
}
body.style-style2 .services-card__link {
    font-family: 'PT Serif', Georgia, serif;
    font-style: italic;
    font-size: 0.9rem;
    color: var(--primary);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* PHASE R 2026-05-30: page-banner hidden again on style2 inner pages per
   user direction. Phase A's restoration was reverted; inner pages show
   quicklinks band as the only top element (no hero image, no h1 banner). */
body.style-style2 .page-banner {
    display: none;
}

/* PHASE B 2026-05-30: inner-page quicklinks (rendered by page_banner.html
   partial after .page-banner) get the home navy/teal/navy palette to match
   the home quicklinks aesthetic. The JS at partials/page_banner.html L42-50
   is gated on style2 so no inline styles fight these CSS rules. nth-child
   selectors hit cleanly because the partial renders exactly 3 tiles today
   (live-counted /services + /about 2026-05-30); n+4 fallback catches any
   future tenant that grows the band beyond 3. */
body.style-style2 .page-banner + .quicklinks .quicklinks__item:nth-child(1) {
    background: #2e4a6f;
    color: #ffffff;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__item:nth-child(2) {
    background: #006f66;
    color: #ffffff;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__item:nth-child(3) {
    background: #2e4a6f;
    color: #ffffff;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__item:nth-child(n+4) {
    background: #2e4a6f;
    color: #ffffff;
}
body.style-style2 .page-banner + .quicklinks .quicklinks__item .quicklinks__icon,
body.style-style2 .page-banner + .quicklinks .quicklinks__item .quicklinks__icon i,
body.style-style2 .page-banner + .quicklinks .quicklinks__item .quicklinks__text {
    color: #ffffff;
}

/* PHASE G 2026-05-30: .services-stack rewritten per user direction —
   section is on neutral (transparent) bg, not the navy fill the prior
   Phase C/F used. Each .services-stack__item IS a self-contained lime
   card with subtle shadow, navy icon INSIDE the card (not external
   chunky lime). 2-col grid >768, single-col below. The .services-stack__card
   inner wrapper is removed in the matching template edits (services_list.html
   + about_body.html). */
body.style-style2 .services-stack {
    background: transparent;
    padding: 80px 0;
}
body.style-style2 .services-stack__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}
body.style-style2 .services-stack .section-eyebrow,
body.style-style2 .services-stack .section-heading {
    color: var(--primary);
    text-align: center;
}
/* Hf-heading-parity 2026-06-02: /services primary heading sat at 32px (from
   inner-pages.css:19 .section-heading), while /team, /about, /contact, /faq
   bumped to hero clamp via edits 9-13. The other rules use .section parent
   which .services-stack__inner doesn't match, so /services missed the bump.
   This rule brings it to parity. */
body.style-style2 .services-stack .section-heading {
    font-size: clamp(1.875rem, 5vw, 3rem) !important;
}
body.style-style2 .services-stack .section-intro {
    color: var(--text-muted, #5a6770);
    text-align: center;
    max-width: 720px;
    margin: 16px auto 48px;
}
body.style-style2 .services-stack__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-top: 32px;
}
body.style-style2 .services-stack__item {
    /* Phase J 2026-05-30: white card with thin lime outline (was solid lime).
       LEARN MORE button below carries the lime accent. */
    background: #ffffff;
    border: 2px solid var(--accent);
    border-radius: 16px;
    padding: 40px 32px;
    box-shadow: 0 4px 16px rgba(10, 58, 92, 0.12), 0 1px 3px rgba(10, 58, 92, 0.08);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
body.style-style2 .services-stack__icon {
    color: var(--primary);
    font-size: 3.5rem;
    line-height: 1;
    margin-bottom: 20px;
}
body.style-style2 .services-stack__icon img {
    max-width: 80px;
    height: auto;
}
body.style-style2 .services-stack__name {
    /* font-family + font-weight need !important to defeat style.css:1176
       h1-h6 grouped !important (same lesson as Phase A v3 + Phase C). */
    font-family: 'Jost', 'Open Sans', Arial, sans-serif !important;
    font-weight: 300 !important;
    font-size: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--primary);
    margin: 0 0 12px;
}
body.style-style2 .services-stack__text {
    color: var(--primary);
    margin: 0 0 24px;
    line-height: 1.6;
}
body.style-style2 .services-stack__link {
    /* Phase J 2026-05-30: filled lime button on white card (was outlined navy on lime card). */
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: var(--accent);
    border: 2px solid var(--accent);
    border-radius: 8px;
    color: var(--primary);
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-weight: 400;
    letter-spacing: 0.04em;
    font-size: 0.9rem;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    margin-top: auto;
}
body.style-style2 .services-stack__link:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--accent);
}
body.style-style2 .services-stack__empty {
    color: var(--primary);
    text-align: center;
    margin: 48px 0;
}
@media (max-width: 768px) {
    body.style-style2 .services-stack {
        padding: 60px 0;
    }
    body.style-style2 .services-stack__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    body.style-style2 .services-stack__item {
        padding: 32px 24px;
    }
    body.style-style2 .services-stack__icon {
        font-size: 3rem;
    }
    body.style-style2 .services-stack__name {
        font-size: 1.25rem;
    }
}

/* Phase L 2026-05-30 — about__image object-position: top so the woman's head
   stays in frame. Image natural 533×800 portrait scaled to 510×765, cropped
   to 510×510 — center crop (50% 50%) lops 127.5px off both ends including
   her head. `50% 0%` aligns image top with crop window top. Style2-scoped. */
body.style-style2 .about__image img {
    object-position: 50% 0%;
}

/* Phase N.B 2026-05-30 — awards_media section (mirrors services-stack visual). */
body.style-style2 .awards-media { padding: 80px 0; }
body.style-style2 .awards-media__inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
body.style-style2 .awards-media .section-eyebrow,
body.style-style2 .awards-media .section-heading { color: var(--primary); text-align: center; }
body.style-style2 .awards-media .section-intro {
    color: var(--text-muted, #5a6770); text-align: center;
    max-width: 720px; margin: 16px auto 48px;
}
body.style-style2 .awards-media__grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 32px;
}
body.style-style2 .awards-media__item {
    background: #ffffff;
    border: 2px solid var(--accent);
    border-radius: 16px;
    padding: 32px 24px;
    box-shadow: 0 4px 16px rgba(10, 58, 92, 0.12), 0 1px 3px rgba(10, 58, 92, 0.08);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
body.style-style2 .awards-media__video {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto !important; /* per [[css_aspect_ratio_height_auto_trap]] */
    margin-bottom: 16px;
    overflow: hidden;
    border-radius: 8px;
    background: #000;
}
body.style-style2 .awards-media__video iframe {
    width: 100%; height: 100%; border: 0; display: block;
}
body.style-style2 .awards-media__image {
    width: 100%; margin-bottom: 16px; border-radius: 8px; overflow: hidden;
}
body.style-style2 .awards-media__image img { width: 100%; height: auto; display: block; }
/* Phase O.media-teaser 2026-06-01: video-teaser variant — when card.video_embed_url is a
   non-URL sentinel like '#', renders image with bottom caption + play-button overlay
   to signal "this is video content" without an actual iframe. */
body.style-style2 .awards-media__image--video-teaser { position: relative; cursor: pointer; }
body.style-style2 .awards-media__caption-overlay {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.15) 70%, transparent);
    padding: 22px 20px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
body.style-style2 .awards-media__caption-text {
    font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
body.style-style2 .awards-media__play-icon {
    color: var(--accent);
    font-size: 36px;
    flex-shrink: 0;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
body.style-style2 .awards-media__icon {
    font-size: 3.5rem; color: var(--primary); margin-bottom: 16px; line-height: 1;
}
body.style-style2 .awards-media__name {
    font-family: 'Jost', 'Open Sans', Arial, sans-serif !important;
    font-weight: 300 !important;
    font-size: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--primary);
    margin: 0 0 12px;
}
body.style-style2 .awards-media__text {
    color: var(--primary); margin: 0 0 16px; line-height: 1.6;
}
body.style-style2 .awards-media__link {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 20px; background: var(--accent); border: 2px solid var(--accent);
    border-radius: 8px; color: var(--primary); text-decoration: none;
    text-transform: uppercase; font-family: 'Jost', 'Open Sans', Arial, sans-serif;
    font-weight: 400; letter-spacing: 0.04em; font-size: 0.9rem;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    margin-top: auto;
}
body.style-style2 .awards-media__link:hover {
    background: var(--primary); border-color: var(--primary); color: var(--accent);
}
body.style-style2 .awards-media__empty {
    color: var(--primary); text-align: center; margin: 48px 0;
}
@media (max-width: 768px) {
    body.style-style2 .awards-media { padding: 60px 0; }
    body.style-style2 .awards-media__grid { grid-template-columns: 1fr; gap: 24px; }
    body.style-style2 .awards-media__name { font-size: 1.25rem; }
    body.style-style2 .awards-media__item { padding: 24px 20px; }
    body.style-style2 .awards-media__icon { font-size: 3rem; }
}

/* Phase O.HOTFIX 2026-05-30 — about image top aligned with subhead top.
   ROOT CAUSE: inner-pages.css L109-111 sets `.about__hero .two-col {
   align-items: center }` globally, vertically centering the (shorter) image
   col within the taller text col. Padding-top inside the image wrapper
   only pushes the centered-position further down — it never aligns the
   image TOP with the subhead.
   FIX: override align-items to flex-start so both cols top-align, then
   add padding-top equal to (eyebrow + heading + margins) so image starts
   roughly at subhead Y. Eyebrow ~0.8125rem + heading clamp(1.8rem..2.4rem)
   + margins ≈ 70-90px on style2's typography.
   Mobile (<=900) restores stretch so the single-column stack behaves
   normally with image col flushed full-width. */
body.style-style2 .about__hero .two-col {
    align-items: flex-start !important;
}
body.style-style2 .about__hero .about__image {
    padding-top: 75px;
}
@media (max-width: 900px) {
    body.style-style2 .about__hero .two-col {
        align-items: stretch !important;
    }
    body.style-style2 .about__hero .about__image { padding-top: 0; }
}
