:root {
    --primary: #004aad;
    --secondary: #00bf63;
    --dark: #020617;
    --ink: #0f172a;
    --muted: #64748b;
    --surface: #ffffff;
    --surface-soft: #f8fafc;
    --border: #e2e8f0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Manrope', sans-serif;
    background: var(--surface-soft);
    color: var(--ink);
}

body.menu-open {
    overflow: hidden;
}

::selection {
    background: rgba(0, 74, 173, .16);
    color: var(--primary);
}

.bg-grid {
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 42px 42px;
}

.glass {
    background: rgba(255,255,255,.09);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1px solid rgba(255,255,255,.14);
}

.glass-light {
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1px solid rgba(255,255,255,.65);
}

.neo {
    background: #fff;
    box-shadow: 12px 12px 30px rgba(15,23,42,.07), -10px -10px 25px rgba(255,255,255,.95);
}

.gradient-text {
    background: linear-gradient(90deg, var(--primary), var(--secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.nav-scrolled > div {
    box-shadow: 0 18px 45px rgba(15,23,42,.14);
    border-color: rgba(255,255,255,.8);
}

.nav-active {
    color: var(--secondary) !important;
}

.hero-overlay {
    background:
        linear-gradient(90deg, rgba(2,6,23,.94) 0%, rgba(2,6,23,.78) 45%, rgba(2,6,23,.42) 100%),
        linear-gradient(180deg, rgba(2,6,23,.25), rgba(2,6,23,.72));
}

@keyframes float {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.float {
    animation: float 5s ease-in-out infinite;
}

@keyframes floatSupport {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
}

.float-support {
    animation: floatSupport 3s ease-in-out infinite;
}

.image-shine {
    position: relative;
    overflow: hidden;
}

.image-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.16) 48%, transparent 72%);
    transform: translateX(-120%);
    transition: transform .8s ease;
}

.image-shine:hover::after {
    transform: translateX(120%);
}

.form-field {
    width: 100%;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    border-radius: 16px;
    padding: 14px 16px;
    color: #0f172a;
    outline: none;
    transition: .25s ease;
}

.form-field:focus {
    border-color: rgba(0,74,173,.45);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(0,74,173,.08);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .float, .float-support { animation: none; }
}

.mobile-nav-link{display:flex;align-items:center;padding:12px 14px;border-radius:14px;font-size:1rem;font-weight:600;color:#334155;transition:.25s ease}.mobile-nav-link:hover,.mobile-nav-link.nav-active{background:rgba(0,74,173,.08);color:#004aad}

.card{background:#fff;border:1px solid #e2e8f0;border-radius:28px;box-shadow:0 10px 35px rgba(15,23,42,.045);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}.card:hover{transform:translateY(-5px);box-shadow:0 22px 55px rgba(15,23,42,.10);border-color:rgba(0,74,173,.18)}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:999px;background:rgba(0,74,173,.08);color:#004aad;font-size:.78rem;font-weight:800;letter-spacing:.04em}
.section-title{font-size:clamp(2rem,4vw,3rem);line-height:1.12;font-weight:800;letter-spacing:-.03em}
.section-description{font-size:1.05rem;line-height:1.8;color:#64748b}
.icon-box{width:56px;height:56px;border-radius:18px;background:rgba(0,74,173,.09);display:flex;align-items:center;justify-content:center}
.icon-box-green{background:rgba(0,191,99,.10)}
.dark-panel{background:#020617;border-radius:32px;position:relative}
.stat-dark,.stat-card{border-radius:24px;padding:1.5rem}.stat-dark{background:#020617;color:#fff}.stat-dark h3{font-size:2.2rem;font-weight:800;color:#00bf63}.stat-dark p{margin-top:.25rem;color:#94a3b8;font-size:.875rem}.stat-card{background:#fff;border:1px solid #e2e8f0}.stat-card h3{font-size:2.2rem;font-weight:800;color:#004aad}.stat-card p{margin-top:.25rem;color:#64748b;font-size:.875rem}


/* =========================================================
   PROXIMA FULL-WIDTH LAYOUT
   Remove the boxed 7xl page frame across every page/section.
   Keep narrower max-width utilities (e.g. max-w-3xl) intact
   for readable text and form content.
   ========================================================= */
.max-w-7xl {
    width: 100% !important;
    max-width: none !important;
}

/* Consistent edge spacing on wide displays */
@media (min-width: 1024px) {
    .px-6 {
        padding-left: clamp(1.5rem, 3vw, 3rem) !important;
        padding-right: clamp(1.5rem, 3vw, 3rem) !important;
    }
}

@media (min-width: 1536px) {
    .px-6 {
        padding-left: clamp(3rem, 4vw, 4.5rem) !important;
        padding-right: clamp(3rem, 4vw, 4.5rem) !important;
    }
}

/* Prevent horizontal overflow while allowing full-bleed sections */
html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}


/* Keep the floating navigation intentionally boxed on full-width pages */
#navbar {
    width: calc(100% - 1.5rem) !important;
    max-width: 80rem !important;
}