/* Base styles for scroll-reveal animations */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 100ms; }
.reveal-delay-2 { transition-delay: 200ms; }
.reveal-delay-3 { transition-delay: 300ms; }

/* —— Global Design Tokens & Warm Editorial Palette —— */
:root {
    --color-warm-primary: #F3F1EC;
    --color-warm-light: #F8F7F3;
    --color-warm-beige: #EAE6DD;
    --color-warm-border: #E5E0D5;
    --color-warm-border-dark: #DCD6C9;
    --color-card-white: #FFFFFF;
    --color-navy: #0F172A;
    --color-navy-deep: #101828;
    --color-cyan: #22D3EE;
    --color-accent: #2563EB;
}

body,
body.bg-white,
body.bg-\[\#f3f1ec\] {
    background-color: #F3F1EC !important;
    overflow-x: hidden;
    color: #0F172A;
    line-height: 1.65;
}

/* Background Utility Helpers */
.bg-warm-primary,
.bg-\[\#F3F1EC\],
.bg-\[\#f3f1ec\] {
    background-color: #F3F1EC !important;
}

.bg-warm-light,
.bg-\[\#F8F7F3\],
.bg-\[\#f8f7f3\] {
    background-color: #F8F7F3 !important;
}

.bg-warm-beige,
.bg-\[\#EAE6DD\],
.bg-\[\#eae6dd\] {
    background-color: #EAE6DD !important;
}

.border-warm,
.border-\[\#E5E0D5\],
.border-\[\#e5e0d5\] {
    border-color: #E5E0D5 !important;
}

.border-warm-dark,
.border-\[\#DCD6C9\],
.border-\[\#dcd6c9\] {
    border-color: #DCD6C9 !important;
}

/* —— Readable text on light backgrounds —— */
main,
section.bg-white,
section.bg-brand-light,
section.bg-slate-50,
section.bg-warm-primary,
section.bg-warm-light,
section.bg-warm-beige,
.bg-\[\#F8FAFC\],
.bg-\[\#F3F1EC\],
.bg-\[\#F8F7F3\],
.bg-\[\#EAE6DD\] {
    color: #0F172A;
}

.text-slate-400,
.text-slate-500 {
    color: #64748B !important;
}

.text-slate-600 {
    color: #475569 !important;
}

.text-slate-700 {
    color: #1E293B !important;
}

.text-slate-800 {
    color: #0F172A !important;
}

.bg-white .font-light,
.bg-\[\#F8FAFC\] .font-light,
.bg-brand-light .font-light,
.bg-warm-primary .font-light,
.bg-warm-light .font-light,
.bg-warm-beige .font-light {
    font-weight: 400;
    color: #475569 !important;
}

.bg-white p,
.bg-brand-light p,
.bg-slate-50 p,
.bg-\[\#F8FAFC\] p,
.bg-warm-primary p,
.bg-warm-light p,
.bg-warm-beige p,
.bg-white li,
.bg-slate-50 li,
.bg-warm-light li,
.bg-warm-beige li {
    color: #1E293B;
}

label,
.text-sm.font-semibold {
    color: #0F172A;
}

/* —— Premium Header & Navigation Styling —— */
#main-header {
    background-color: #FFFFFF !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(229, 224, 213, 0.95) !important;
    box-shadow: 0 4px 20px -10px rgba(15, 23, 42, 0.05) !important;
}

#main-header nav > a,
#main-header nav button,
#mobile-menu > div > a,
#mobile-menu .accordion-btn {
    color: #0F172A !important;
}

#main-header nav > a:hover,
#main-header nav button:hover,
#mobile-menu a:hover,
#mobile-menu .accordion-btn:hover {
    color: #1D4ED8 !important;
}

#main-header a.bg-blue-800,
#mobile-menu a.bg-blue-800 {
    color: #FFFFFF !important;
}

#main-header .text-slate-500,
#main-header .text-slate-600,
#main-header p.text-slate-500,
#mobile-menu .text-slate-600 {
    color: #475569 !important;
}

#main-header h4.text-slate-900 {
    color: #0F172A !important;
}

/* Mega menu dropdown panels */
#main-header .group .absolute > div {
    background-color: #FFFFFF !important;
    border: 1px solid #E5E0D5 !important;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08) !important;
}

/* Mobile Menu Panel */
#mobile-menu {
    background-color: #F3F1EC !important;
    border-top: 1px solid #E5E0D5 !important;
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.15) !important;
}

#mobile-menu a,
#mobile-menu .mobile-accordion {
    border-color: #E5E0D5 !important;
}

/* Footer: brighter text on deep navy */
footer {
    background-color: #0F172A !important;
}

footer .footer-heading {
    color: #FFFFFF !important;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 1rem;
}

footer .footer-link {
    color: #CBD5E1 !important;
    font-size: 0.875rem;
    line-height: 1.6;
    transition: color 0.2s ease;
}

footer a.footer-link:hover,
footer a.footer-link:focus-visible {
    color: #FFFFFF !important;
    outline: none;
}

footer .footer-meta {
    color: #94A3B8 !important;
}

footer .footer-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    color: #FFFFFF !important;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    transition: background 0.2s ease, transform 0.2s ease;
}

footer .footer-social-link:hover,
footer .footer-social-link:focus-visible {
    background: rgba(255, 255, 255, 0.18);
    transform: translateY(-1px);
    outline: 2px solid #38BDF8;
    outline-offset: 2px;
}

/* Legal text styling */
.legal-copy p,
.legal-copy li {
    color: #1E293B;
    line-height: 1.75;
}

/* —— Modern Rounded Cards (Editorial & Premium) —— */
.modern-card,
#dynamic-services-grid > div,
#dynamic-services-listing > div,
#dynamic-industries-grid > div,
#dynamic-industries-listing > div,
article.modern-card {
    border-radius: 1rem !important;
    border: 1px solid #E5E0D5 !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 3px rgba(15, 23, 42, 0.04),
        0 8px 24px -6px rgba(15, 23, 42, 0.06) !important;
    overflow: hidden;
    transition:
        box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
        border-color 0.35s ease !important;
}

.modern-card:hover,
#dynamic-services-grid > div:hover,
#dynamic-services-listing > div:hover,
#dynamic-industries-grid > div:hover,
#dynamic-industries-listing > div:hover,
article.modern-card:hover {
    border-color: #CBD5E1 !important;
    box-shadow:
        0 4px 8px -2px rgba(15, 23, 42, 0.05),
        0 18px 36px -8px rgba(15, 23, 42, 0.12) !important;
    transform: translateY(-3px) !important;
}

.modern-card .modern-card__body,
#dynamic-services-grid > div > div:last-child,
#dynamic-services-listing > div > div:last-child,
#dynamic-industries-grid > div > div:last-child,
#dynamic-industries-listing > div > div:last-child {
    padding: 1.75rem;
}

.modern-card h3,
.modern-card h4,
#dynamic-services-grid h3,
#dynamic-industries-grid h3 {
    color: #0F172A !important;
}

.modern-card p,
#dynamic-services-grid p,
#dynamic-industries-grid p {
    color: #334155 !important;
}

/* Content blocks on About / Careers / FAQ / Contact */
section .grid > .border.border-slate-200,
section .grid > .bg-white.border.border-slate-200,
article.bg-white.border.border-slate-200 {
    border-radius: 1rem !important;
    border-color: #E5E0D5 !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 2px 10px -4px rgba(15, 23, 42, 0.06) !important;
}

/* Contact & Form Panel */
.rounded-\[16px\].border.border-gray-100,
.rounded-\[16px\].border.border-slate-200,
.rounded-\[16px\].border {
    border-radius: 1rem !important;
    border-color: #E5E0D5 !important;
    box-shadow: 0 12px 36px -12px rgba(15, 23, 42, 0.08) !important;
}

/* Inputs & Form Elements */
input,
select,
textarea {
    color: #0F172A !important;
    border-color: #D1D5DB !important;
    background-color: #FFFFFF !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #2563EB !important;
    outline: none !important;
}

input::placeholder,
textarea::placeholder {
    color: #64748B !important;
}

/* Dark Navy Sections & CTA High Contrast */
section.bg-brand-navy,
section.bg-\[\#101828\],
section.bg-\[\#0f172a\] {
    background-color: #0F172A !important;
}

section.bg-brand-navy h1,
section.bg-brand-navy h2,
section.bg-brand-navy h3 {
    color: #FFFFFF !important;
}

section.bg-brand-navy p {
    color: #E2E8F0 !important;
}

section.bg-brand-navy .text-slate-300,
section.bg-brand-navy .text-slate-400,
section.bg-brand-navy .text-slate-600 {
    color: #CBD5E1 !important;
}

/* Hero copy stays readable on dark imagery */
section.relative.h-screen .text-slate-100,
section.relative.h-screen .text-slate-200,
section.relative.h-screen h1.text-white {
    color: #F8FAFC !important;
}

section.relative.h-screen .text-slate-900 {
    color: #F1F5F9 !important;
}

/* Our Story section tabs */
.story-subnav {
    background-color: rgba(243, 241, 236, 0.95) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid #E5E0D5 !important;
}

.story-subnav .story-tab {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding: 0.625rem 1.125rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #0F172A !important;
    background: #FFFFFF;
    border: 1px solid #E5E0D5;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.story-subnav .story-tab:hover,
.story-subnav .story-tab:focus-visible {
    color: #1D4ED8 !important;
    border-color: #93C5FD;
    background: #EFF6FF;
    outline: none;
}

.story-subnav .story-tab.is-active,
.story-subnav .story-tab[aria-current="page"] {
    color: #FFFFFF !important;
    background: #1D4ED8 !important;
    border-color: #1D4ED8 !important;
}