/* ============================================================
   ZMLC — Homepage Design System (index.css)
   Green Palette: Forest #1A4A2E | Counsel #2E7D52 | Midnight #0D2518
   Replaces all gold / dark-navy references with premium green tokens.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400;1,600&family=Inter:wght@300;400;500;600;700&display=swap');

/* ===== ROOT VARIABLES ===== */
:root {
    --color-white: #FFFFFF;
    --color-forest: #1A4A2E;
    --color-black: #111111;
    --color-mint: #EAF4EE;
    --color-counsel: #2E7D52;
    --color-hover: #1A4A2E;
    --color-midnight: #0D2518;
    --color-offwhite: #F7F7F5;
    --color-parchment: #D1D1CC;
    --color-slate: #6B6B66;
    --color-rich-black: #111111;
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.07);
    --shadow-hover: 0 12px 40px rgba(26, 74, 46, 0.15);
    --radius: 12px;
    --radius-sm: 8px;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== BASE ===== */
body {
    font-family: 'Inter', 'Montserrat', sans-serif;
    background: var(--color-white);
    color: var(--color-black);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
    font-family: 'Playfair Display', Georgia, serif;
    letter-spacing: -0.01em;
}

p {
    line-height: 1.75;
    color: var(--color-slate);
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--color-forest), var(--color-counsel));
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--color-counsel); }

/* ===== GLOBAL LOADER ===== */
#global-loader {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: var(--color-white);
    z-index: 999999;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#global-loader .loader-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-counsel);
    margin-top: 8px;
}

/* ===== TOP BAR ===== */
.site-topbar,
.bg-black.text-white.py-2 {
    background: var(--color-midnight) !important;
    border-bottom: 1px solid rgba(46, 125, 82, 0.2);
}

/* Top bar social hover */
.bg-black.text-white.py-2 a:hover,
.site-topbar a:hover {
    color: var(--color-counsel) !important;
}

/* ===== NAVIGATION / HEADER ===== */
header.site-header,
header.bg-white,
header {
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

header nav a {
    font-family: 'Inter', sans-serif;
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-black) !important;
    transition: var(--transition);
    position: relative;
    white-space: nowrap !important;
}

header nav a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--color-counsel);
    transition: width 0.3s ease;
}

header nav a:hover::after,
header nav a.nav-active::after,
header nav a.border-b-2:not(.border-transparent)::after {
    width: 100%;
}

header nav a:hover { color: var(--color-forest) !important; }

/* Active nav link */
.border-gold-500,
.border-b-2.border-gold-500 {
    border-color: var(--color-counsel) !important;
}
.hover\:text-gold-600:hover,
.hover\:text-gold-400:hover {
    color: var(--color-counsel) !important;
}

/* Language toggle */
header nav button {
    font-family: 'Inter', sans-serif;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--color-black);
    transition: color 0.25s;
    white-space: nowrap !important;
}
header nav button:hover { color: var(--color-forest); }

/* ===== LOGO ===== */
#logo .logo-icon,
#logo .w-12.h-12,
#logo .bg-black,
.site-logo .logo-icon {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
    border: none !important;
    box-shadow: 0 2px 12px rgba(26, 74, 46, 0.25) !important;
}

/* Footer logo circle */
footer .w-12.h-12.bg-gold-500,
footer .logo-icon {
    background: var(--color-forest) !important;
}

/* ===== BUTTON SYSTEM ===== */
/* Primary Button — Counsel green bg */
.btn-primary-green,
.btn-gold-primary,
.btn-gold {
    background: var(--color-counsel) !important;
    color: var(--color-white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 14px 28px;
    border-radius: var(--radius-sm) !important;
    border: none !important;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    box-shadow: 0 4px 16px rgba(46, 125, 82, 0.25);
    transition: var(--transition);
}
.btn-primary-green:hover,
.btn-gold-primary:hover,
.btn-gold:hover {
    background: var(--color-forest) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(26, 74, 46, 0.35) !important;
    color: var(--color-white) !important;
}


/* Secondary / Outline Button */
.btn-outline-green,
.btn-outline-gold {
    background: transparent !important;
    border: 1.5px solid var(--color-counsel) !important;
    color: var(--color-counsel) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 0.82rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 14px 28px;
    border-radius: var(--radius-sm) !important;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    transition: var(--transition);
}
.btn-outline-green:hover,
.btn-outline-gold:hover {
    background: var(--color-mint) !important;
    border-color: var(--color-forest) !important;
    color: var(--color-forest) !important;
    transform: translateY(-2px);
}

/* CTA on dark backgrounds */
.btn-cta-dark {
    background: var(--color-counsel) !important;
    color: var(--color-white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 14px 28px;
    border-radius: var(--radius-sm) !important;
    border: none !important;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: var(--transition);
}
.btn-cta-dark:hover {
    background: var(--color-forest) !important;
    transform: translateY(-2px);
}

/* Dark/Black inline buttons (Meet Full Team, View All, etc.) */
.bg-black.hover\:bg-gray-800,
a.bg-black,
a.inline-block.bg-black {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
    border-radius: var(--radius-sm) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 0.85rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    border: none !important;
    transition: var(--transition);
    text-decoration: none;
}
.bg-black.hover\:bg-gray-800:hover,
a.bg-black:hover,
a.inline-block.bg-black:hover {
    background: var(--color-midnight) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(13, 37, 24, 0.25);
}

/* Client portal nav button */
#client-portal-btn,
#mobile-client-portal-btn {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 700;
    padding: 10px 18px !important;
    border: none !important;
    transition: var(--transition);
    text-decoration: none;
    font-size: 0.82rem;
    letter-spacing: 0.04em;
}
#client-portal-btn:hover,
#mobile-client-portal-btn:hover {
    background: var(--color-midnight) !important;
    transform: translateY(-2px);
}

/* ===== SECTION HEADING SYSTEM ===== */
section h2 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 700;
    color: var(--color-black);
}

/* Section label / eyebrow text */
.section-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-counsel);
}

/* Gold/accent underline — replace all gold lines with counsel green */
.w-20.h-1.bg-gold-500,
.w-20.h-1.mx-auto,
.section-divider,
.brand-line,
.gold-line {
    background: linear-gradient(90deg, var(--color-counsel), rgba(46, 125, 82, 0.3)) !important;
    height: 3px !important;
    border-radius: 2px;
    margin: 12px auto 24px auto;
}

/* Specific heading dividers with inline styles — override via class */
.w-24.h-1 {
    background: linear-gradient(90deg, var(--color-counsel), rgba(46, 125, 82, 0.3)) !important;
    height: 3px !important;
    border-radius: 2px;
}

/* ===== SECTION BACKGROUNDS ===== */
#about { background: var(--color-white) !important; }
#team { background: var(--color-forest) !important; }
#practice-areas { background: var(--color-white) !important; }
#judgments { background: var(--color-mint) !important; }
#publications { background: var(--color-white) !important; }
#laws-preview { background: var(--color-offwhite) !important; }
#news { background: var(--color-white) !important; }
#contact { background: var(--color-mint) !important; }

/* Section separators — thin top border */
#team, #judgments { position: relative; }
#team::before, #judgments::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--color-parchment), transparent);
}

/* ===== ABOUT SECTION ===== */
#about {
    position: relative;
    background: var(--color-white) !important;
}

#about::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--color-parchment), transparent);
}

/* Premium editorial blockquote */
#about blockquote {
    border-left: 4px solid var(--color-counsel);
    background: rgba(234, 244, 238, 0.4);
    padding: 20px 24px;
    border-radius: 0 var(--radius) var(--radius) 0;
    font-style: italic;
    color: var(--color-midnight);
    margin: 0 0 24px 0;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.05rem;
}

/* Stat card custom styles */
.stat-card {
    background: linear-gradient(135deg, var(--color-white) 0%, rgba(234, 244, 238, 0.15) 100%);
    border: 1px solid rgba(209, 209, 204, 0.6);
    border-top: 3px solid var(--color-counsel);
    border-radius: var(--radius-sm);
    padding: 24px;
    transition: var(--transition);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
}

.stat-card:hover {
    transform: translateY(-4px);
    border-color: var(--color-counsel);
    box-shadow: var(--shadow-hover);
    background: linear-gradient(135deg, var(--color-white) 0%, rgba(234, 244, 238, 0.3) 100%);
}

.stat-card h3 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--color-forest);
    font-weight: 700;
}

.stat-icon-wrapper {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(46, 125, 82, 0.08);
    color: var(--color-counsel);
    transition: var(--transition);
    border: 1px solid rgba(46, 125, 82, 0.12);
}

.stat-card:hover .stat-icon-wrapper {
    background: var(--color-counsel);
    color: var(--color-white);
    border-color: var(--color-counsel);
    transform: scale(1.05);
}

/* Partner premium card styling */
.partner-card {
    border-radius: var(--radius) !important;
    border: 1px solid rgba(209, 209, 204, 0.6) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04) !important;
    transition: var(--transition);
}

.partner-card:hover {
    box-shadow: 0 20px 40px rgba(13, 37, 24, 0.08) !important;
    border-color: rgba(46, 125, 82, 0.3) !important;
    transform: translateY(-2px);
}

.partner-image-container {
    transition: var(--transition);
}

.partner-card:hover .partner-image-container {
    transform: scale(1.03);
    border-color: var(--color-forest);
}

.partner-sig {
    font-family: 'Monotype Corsiva', 'Apple Chancery', 'ITC Zapf Chancery', 'Zapf Chancery', cursive, serif !important;
    font-size: 2rem !important;
    letter-spacing: -0.02em;
}

.partner-firm-label {
    font-family: 'Bookman Old Style', 'Bookman', 'URW Bookman L', 'Georgia', serif !important;
}

.editorial-body-text {
    font-family: 'Bookman Old Style', 'Bookman', 'URW Bookman L', 'Georgia', serif !important;
    text-align: justify;
}

/* ===== TEAM SECTION (Homepage) ===== */
.lawyer-card, #index-team-grid .bg-white.rounded-lg {
    background-color: #FFFFFF !important;
    border-radius: var(--radius) !important;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(46, 125, 82, 0.12) !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.lawyer-card:hover, #index-team-grid .bg-white.rounded-lg:hover {
    box-shadow: 0 20px 35px rgba(26, 74, 46, 0.15) !important;
    transform: translateY(-8px) !important;
    border-color: var(--color-counsel) !important;
}
.lawyer-card h3, #index-team-grid h3 {
    font-family: 'Playfair Display', Georgia, serif !important;
    color: var(--color-forest) !important;
}

/* Team image wrapper */
.team-img-wrapper {
    position: relative;
    width: 100%;
    padding-top: 125%;
    background: linear-gradient(160deg, var(--color-forest) 0%, var(--color-counsel) 100%);
    overflow: hidden;
}
.team-img-wrapper img,
.team-img-wrapper svg {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: top center !important;
}

/* ===== PRACTICE AREA CARDS ===== */
.practice-card {
    border-radius: var(--radius) !important;
    border: 1px solid var(--color-parchment) !important;
    box-shadow: var(--shadow-card) !important;
    transition: var(--transition);
    overflow: hidden;
    position: relative;
    background: var(--color-white);
}

.practice-card::before {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color-counsel), transparent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}
.practice-card:hover::before { transform: scaleX(1); }
.practice-card:hover {
    box-shadow: var(--shadow-hover) !important;
    transform: translateY(-4px);
    border-color: var(--color-forest) !important;
}

/* Practice card icon circles — bg forest, white icon */
.practice-card .rounded-full.bg-black,
.practice-card .rounded-full,
.flex.items-center.justify-center.h-16.w-16.rounded-full.bg-black {
    background: var(--color-forest) !important;
    border: none !important;
    color: var(--color-white) !important;
}

.practice-icon,
.practice-card .text-gold-400,
.text-gold-400 {
    color: var(--color-white) !important;
}

/* ===== JUDGMENTS SECTION ===== */
/* Dynamic judgment cards injected by JS */
.judgment-card,
#index-judgments-grid .bg-white {
    border-left: 3px solid var(--color-counsel) !important;
    background: var(--color-white) !important;
    border-radius: var(--radius) !important;
    transition: var(--transition);
}
#index-judgments-grid .bg-white:hover,
.judgment-card:hover {
    background: var(--color-mint) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-hover) !important;
}

/* ===== PUBLICATIONS SECTION (Homepage) ===== */
#publications { position: relative; }
#publications::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--color-parchment), transparent);
}

/* Publications card hover */
#index-publications-grid a,
.publication-card {
    border-radius: var(--radius) !important;
    border: 1px solid var(--color-parchment) !important;
    transition: var(--transition);
}
#index-publications-grid a:hover,
.publication-card:hover {
    border-color: var(--color-counsel) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-hover) !important;
}

/* Publications "Request Full Access" inline button override */
#publications a[style] {
    border-color: var(--color-counsel) !important;
    color: var(--color-counsel) !important;
}

/* ===== LAWS PREVIEW SECTION ===== */
/* Feature highlight circles */
#laws-preview .rounded-full.bg-black {
    background: var(--color-forest) !important;
    box-shadow: 0 4px 16px rgba(26, 74, 46, 0.2);
    border: none !important;
    color: var(--color-white) !important;
}
#laws-preview .fas,
#laws-preview .fa {
    color: var(--color-white) !important;
}

/* Feature cards */
#laws-preview .rounded-lg.border,
#laws-preview .rounded-lg.border.border-gray-100 {
    border-radius: var(--radius) !important;
    border: 1px solid var(--color-parchment) !important;
    transition: var(--transition);
    background: var(--color-white);
}
#laws-preview .rounded-lg.border:hover,
#laws-preview .rounded-lg.border.border-gray-100:hover {
    box-shadow: var(--shadow-hover) !important;
    border-color: var(--color-counsel) !important;
    transform: translateY(-3px);
}

/* Laws preview grid cards (dynamically generated) */
#laws-preview-grid a {
    border-radius: var(--radius) !important;
    border: 1px solid var(--color-parchment) !important;
    background: var(--color-white) !important;
    transition: var(--transition) !important;
}
#laws-preview-grid a:hover {
    border-color: var(--color-counsel) !important;
    box-shadow: var(--shadow-hover) !important;
    transform: translateY(-3px);
}
/* Law card read link */
#laws-preview-grid .text-gold-600,
#laws-preview-grid .group-hover\:text-gold-600 {
    color: var(--color-counsel) !important;
}
/* Law card title hover */
#laws-preview-grid .group-hover\:text-gold-600:hover {
    color: var(--color-forest) !important;
}

/* ===== TESTIMONIALS SECTION ===== */
#testimonials-section {
    background: var(--color-midnight) !important;
    position: relative;
    padding-bottom: 100px;
}

#testimonials-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 40% at 50% 50%, rgba(46, 125, 82, 0.07) 0%, transparent 70%);
    pointer-events: none;
}

#testimonials-section h2 {
    color: var(--color-white) !important;
}

#testimonials-section p {
    color: rgba(255, 255, 255, 0.75);
}

/* Testimonial heading accent */
#testimonials-section .w-24.h-1 {
    background: linear-gradient(90deg, var(--color-counsel), rgba(46, 125, 82, 0.3)) !important;
}

/* 3-Column Viewport & Track */
.testi-viewport {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

.testi-track-container {
    overflow: hidden;
    padding: 20px 0;
}

.testi-track {
    display: flex;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    gap: 24px;
}

.testi-slide {
    flex: 0 0 calc(33.333% - 16px);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 30px;
    transition: var(--transition);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 280px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(4px);
}

.testi-slide:hover {
    transform: translateY(-8px);
    border-color: rgba(46, 125, 82, 0.35);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
}

@media (max-width: 1024px) {
    .testi-slide { flex: 0 0 calc(50% - 12px); }
}

@media (max-width: 768px) {
    .testi-slide { flex: 0 0 100%; }
    .testi-viewport { padding: 0 16px; }
    .testi-arrow { display: none !important; }
}

/* Stars — amber for readability on dark bg */
.testi-stars {
    color: #F59E0B;
    margin-bottom: 15px;
    font-size: 0.9rem;
}

.testi-review {
    font-size: 1rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    font-family: 'Inter', sans-serif;
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.testi-author {
    margin-top: auto;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 15px;
}

.testi-name {
    display: block;
    font-weight: 700;
    font-size: 1rem;
    color: var(--color-white);
}

.testi-title {
    display: block;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Navigation Arrows */
.testi-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--color-forest);
    border: 1px solid rgba(46, 125, 82, 0.3);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: var(--transition);
}

.testi-arrow:hover {
    background: var(--color-counsel);
    border-color: var(--color-counsel);
    box-shadow: 0 0 20px rgba(46, 125, 82, 0.3);
}

.testi-arrow.prev { left: -10px; }
.testi-arrow.next { right: -10px; }

/* Quote mark decor */
.testi-viewport .fa-quote-left {
    color: var(--color-counsel) !important;
    opacity: 0.12;
}

/* Write a Review Button */
#open-review-modal {
    background: var(--color-counsel) !important;
    color: var(--color-white) !important;
    border: none;
    transition: var(--transition);
}
#open-review-modal:hover {
    background: var(--color-forest) !important;
    transform: scale(1.03);
}

/* Testimonial dots */
.testi-dots { display: flex; gap: 8px; }
.testi-dot {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: width 0.3s ease, background 0.3s;
}
.testi-dot.active {
    width: 24px;
    background: var(--color-counsel);
}

.testi-progress-bar {
    width: 100px;
    height: 2px;
    background: rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
}
.testi-progress-fill {
    position: absolute;
    top: 0; left: 0; height: 100%;
    width: 0%;
    background: var(--color-counsel);
}
.testi-progress-fill.running {
    animation: progressFill 5s linear forwards;
}
@keyframes progressFill {
    from { width: 0%; }
    to { width: 100%; }
}

/* Controls */
.testi-controls {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

/* ===== REVIEW MODAL ===== */
.testi-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(8px);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    transition: opacity 0.3s ease;
}
.testi-modal-overlay.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.testi-modal-content {
    background: var(--color-midnight);
    border: 1px solid rgba(46, 125, 82, 0.3);
    width: 100%;
    max-width: 600px;
    border-radius: 20px;
    padding: 40px;
    position: relative;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.8), 0 0 30px rgba(46, 125, 82, 0.08);
}

.testi-modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.4);
    background: none;
    border: none;
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s;
}
.testi-modal-close:hover { color: var(--color-white); }

/* Review form */
.testi-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.form-group-full { grid-column: span 2; }

.testi-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 8px;
    text-transform: uppercase;
}

.testi-input {
    width: 100%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    padding: 12px 16px;
    color: var(--color-white);
    font-family: 'Inter', sans-serif;
    transition: border-color 0.3s;
}
.testi-input:focus {
    border-color: var(--color-counsel);
    outline: none;
    box-shadow: 0 0 0 3px rgba(46, 125, 82, 0.2);
}

/* Star picker */
.star-picker {
    display: flex;
    gap: 12px;
    margin-top: 5px;
}
.sp-star {
    font-size: 1.8rem;
    color: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: all 0.2s ease;
}
.sp-star.active {
    color: #F59E0B !important;
    text-shadow: 0 0 10px rgba(245, 158, 11, 0.3);
}
.sp-star:hover { transform: scale(1.2); }

/* Submit button */
.btn-submit-review {
    grid-column: span 2;
    background: var(--color-counsel) !important;
    color: var(--color-white) !important;
    font-weight: 800;
    font-size: 0.95rem;
    padding: 16px;
    border-radius: 12px;
    border: none;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 6px 20px rgba(46, 125, 82, 0.35);
    margin-top: 10px;
}
.btn-submit-review:hover {
    background: var(--color-forest) !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(26, 74, 46, 0.45);
}
.btn-submit-review:active { transform: translateY(-1px); }
.btn-submit-review:disabled {
    background: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.3) !important;
    cursor: not-allowed;
    box-shadow: none;
}

/* Success message check icon */
#testi-success-msg .fa-check-circle {
    color: var(--color-counsel) !important;
}
#testi-success-msg button {
    color: var(--color-counsel) !important;
}

/* ===== NEWS CARDS ===== */
#news { position: relative; }
.news-card {
    transition: var(--transition) !important;
    border-radius: var(--radius) !important;
    border: 1px solid var(--color-parchment) !important;
    box-shadow: var(--shadow-card) !important;
    background: var(--color-white) !important;
    overflow: hidden;
}
.news-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: var(--shadow-hover) !important;
    border-top: 3px solid var(--color-forest) !important;
}

/* News category badges */
.news-card .absolute.top-4.left-4.bg-gold-500 {
    background: var(--color-counsel) !important;
    color: var(--color-white) !important;
    border-radius: 6px;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}
.news-card .absolute.top-4.left-4.bg-black {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
    border-radius: 6px;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

/* News "Read More" link */
.news-card .text-gold-600,
.news-card .text-gold-600:hover {
    color: var(--color-counsel) !important;
    font-weight: 600;
    transition: color 0.2s;
}
.news-card a.text-gold-600:hover {
    color: var(--color-forest) !important;
}

/* ===== CONTACT SECTION ===== */
#contact { position: relative; }

/* Contact form card */
#contact .bg-white.p-8.rounded-lg,
#contact .bg-white.p-8 {
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-card) !important;
    border: 1px solid var(--color-parchment) !important;
    border-top: 4px solid var(--color-forest) !important;
    background: var(--color-white) !important;
}

/* Contact info card */
#contact .bg-black.text-white.p-8.rounded-lg,
#contact .bg-black.text-white.p-8 {
    background: var(--color-midnight) !important;
    border-radius: var(--radius) !important;
    border: 1px solid rgba(46, 125, 82, 0.15) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2) !important;
}

/* Contact icon circles */
#contact .w-12.h-12.rounded-full.bg-gold-500 {
    background: var(--color-counsel) !important;
    box-shadow: 0 4px 16px rgba(46, 125, 82, 0.3);
}

/* Form inputs */
#contact input,
#contact textarea {
    border-radius: var(--radius-sm) !important;
    border: 1.5px solid var(--color-parchment) !important;
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    transition: var(--transition);
    background: var(--color-white);
    color: var(--color-black);
}
#contact input:focus,
#contact textarea:focus {
    border-color: var(--color-counsel) !important;
    box-shadow: 0 0 0 3px rgba(46, 125, 82, 0.12) !important;
    outline: none !important;
}

/* Submit button */
#contact button[type="submit"],
.bg-gold-500.hover\:bg-gold-600 {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    letter-spacing: 0.04em;
    font-size: 0.9rem;
    border-radius: var(--radius-sm) !important;
    border: none !important;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 4px 16px rgba(26, 74, 46, 0.3);
}
#contact button[type="submit"]:hover,
.bg-gold-500.hover\:bg-gold-600:hover {
    background: var(--color-midnight) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(13, 37, 24, 0.35) !important;
}

/* Contact social icons (dark card) */
#contact .bg-gray-800.hover\:bg-gold-500 {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: var(--transition);
}
#contact .bg-gray-800.hover\:bg-gold-500:hover {
    background: var(--color-counsel) !important;
    border-color: var(--color-counsel) !important;
}

/* ===== CTA BANNER SECTION ===== */
section.py-16.bg-gold-500,
section.bg-gold-500 {
    background: var(--color-forest) !important;
}

section.py-16.bg-gold-500 h2,
section.bg-gold-500 h2 {
    color: var(--color-white) !important;
    font-family: 'Playfair Display', Georgia, serif;
}

section.py-16.bg-gold-500 p,
section.bg-gold-500 p {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* CTA button on green banner */
section.py-16.bg-gold-500 a.bg-black,
section.bg-gold-500 a.bg-black,
section.bg-gold-500 a {
    background: var(--color-white) !important;
    color: var(--color-forest) !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 700;
    transition: var(--transition);
    text-decoration: none;
}
section.py-16.bg-gold-500 a:hover,
section.bg-gold-500 a:hover {
    background: var(--color-mint) !important;
    color: var(--color-forest) !important;
    transform: translateY(-2px);
}

/* ===== FOOTER ===== */
footer.bg-gray-900,
footer {
    background: var(--color-black) !important;
    color: var(--color-white);
}

/* Footer logo icon */
footer .w-12.h-12.bg-gold-500 {
    background: var(--color-forest) !important;
    color: var(--color-white) !important;
}

/* Footer link hover */
footer .text-gray-400.hover\:text-gold-400:hover,
footer a.hover\:text-gold-400:hover,
footer .text-gray-500.hover\:text-gold-400:hover {
    color: var(--color-counsel) !important;
}

/* Footer social icons */
footer .bg-gray-800.hover\:bg-gold-500 {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: var(--transition);
}
footer .bg-gray-800.hover\:bg-gold-500:hover {
    background: var(--color-counsel) !important;
    border-color: var(--color-counsel) !important;
}

/* Footer icons */
footer .text-gold-500,
footer .fas.text-gold-500,
footer .fa.text-gold-500 {
    color: var(--color-counsel) !important;
}

/* Footer divider */
footer hr,
footer .border-gray-800 {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* Footer bottom text */
footer .text-gray-500 {
    color: var(--color-slate) !important;
}

/* ===== MOBILE NAV ===== */
#mobile-menu {
    background: var(--color-white) !important;
}
#mobile-menu a:hover,
#mobile-menu a.active {
    background: var(--color-mint) !important;
    color: var(--color-counsel) !important;
}

/* ===== SECTION HEADING DIVIDER UTILITY ===== */
.section-divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--color-counsel), rgba(46, 125, 82, 0.3));
    border-radius: 2px;
    margin: 12px auto 24px auto;
}

/* ===== SKELETON SHIMMER ANIMATIONS ===== */
@keyframes skeleton-shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-line {
    background: linear-gradient(90deg, #EAF4EE 25%, #D1D1CC 50%, #EAF4EE 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite;
    border-radius: 4px;
    height: 14px;
    margin-bottom: 8px;
}

.skeleton-avatar {
    background: linear-gradient(135deg, #EAF4EE 25%, #D1D1CC 50%, #EAF4EE 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite;
    border-radius: 50%;
}

.skeleton-card {
    background: var(--color-white);
    border: 1px solid var(--color-parchment);
    border-radius: var(--radius);
    padding: 24px;
    overflow: hidden;
}

.skeleton-block {
    background: linear-gradient(90deg, #EAF4EE 25%, #D1D1CC 50%, #EAF4EE 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite;
    border-radius: var(--radius-sm);
}

/* ===== MICRO-ANIMATIONS ===== */

/* Entrance animation class added by JS IntersectionObserver */
.animate-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.animate-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Fade-up keyframe (also used for modal) */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
.animate-fade-up {
    animation: fadeUp 0.6s cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* Card hover lift — global */
.card-hover {
    transition: var(--transition);
}
.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
}

/* ===== HERO SLIDER SECTION ===== */
/* DO NOT MODIFY HERO SLIDER ROOT */
.hero-bg-section {
    position: relative;
    height: 90vh;
    min-height: 600px;
    width: 100%;
    overflow: hidden;
}

.hero-slide-item {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 1.5s ease, visibility 1.5s;
    z-index: 1;
}
.hero-slide-item.active {
    opacity: 1;
    visibility: visible;
    z-index: 2;
}
.hero-slide-item .slide-content {
    opacity: 0;
    transform: translateY(30px);
    transition: all 1s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: 0.5s;
}
.hero-slide-item.active .slide-content {
    opacity: 1;
    transform: translateY(0);
}

.hero-logo-large {
    max-width: 450px;
    width: 90%;
    height: auto;
    filter: drop-shadow(0 8px 30px rgba(0, 0, 0, 0.1));
    margin-bottom: 35px;
}

/* Hero slider utility */
.hero-slider { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero-slide   { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; }

/* ===== MOBILE OPTIMIZATIONS ===== */
@media (max-width: 768px) {
    .hero-bg-section { min-height: 70vh; }
    section { overflow-x: hidden; }
    h2 { font-size: 1.65rem !important; }

    #contact .flex.flex-col.lg\:flex-row > div {
        padding: 20px !important;
    }

    .testi-form {
        grid-template-columns: 1fr !important;
    }
    .form-group-full,
    .btn-submit-review {
        grid-column: span 1 !important;
    }
}

@media (max-width: 480px) {
    .hero-bg-section { min-height: 60vh; }

    .testi-modal-content {
        margin: 8px !important;
        max-height: calc(100vh - 16px) !important;
        overflow-y: auto !important;
        border-radius: 16px !important;
        padding: 24px !important;
    }
}

/* ===== CARD BASE ===== */
.card-base {
    background: var(--color-white);
    border-radius: var(--radius);
    border: 1px solid var(--color-parchment);
    box-shadow: var(--shadow-card);
    transition: var(--transition);
    overflow: hidden;
}
.card-base:hover {
    box-shadow: var(--shadow-hover);
    transform: translateY(-4px);
    border-color: var(--color-forest);
}
@media (hover: none) {
    .card-base:hover { transform: none; }
}

/* ===== GENERIC GOLD BADGE UTILITY OVERRIDES ===== */
.bg-gold-500 { background: var(--color-counsel) !important; }
.bg-gold-100 { background: var(--color-mint) !important; }
.text-gold-600 { color: var(--color-counsel) !important; }
.text-gold-500 { color: var(--color-counsel) !important; }
.text-gold-400 { color: var(--color-counsel) !important; }
.border-gold-500 { border-color: var(--color-counsel) !important; }
.hover\:border-gold-500:hover { border-color: var(--color-forest) !important; }
.hover\:border-gold-300:hover { border-color: var(--color-counsel) !important; }