
:root {
    --navy: #09132b;
    --navy-2: #0e1c3f;
    --navy-soft: #142348;
    --green: #0b8a43;
    --green-light: #17b558;
    --green-pale: #eaf7ef;
    --paper: #f7f9fb;
    --ink: #10182b;
    --muted: #5b6577;
    --line: #e7eaf0;
    --ease: cubic-bezier(.16,1,.3,1);
    --ease-pop: cubic-bezier(.34,1.56,.64,1);
}
body { background-color: var(--paper); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
.font-display { font-family: 'Fraunces', serif; }

.ambient-bg { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.bg-orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .3; animation: drift 24s ease-in-out infinite; }
.bg-orb-1 { width: 420px; height: 420px; top: -100px; left: -100px; background: radial-gradient(circle, rgba(11,138,67,.32), transparent 70%); }
.bg-orb-2 { width: 360px; height: 360px; top: 30%; right: -140px; background: radial-gradient(circle, rgba(9,19,43,.22), transparent 70%); animation-duration: 30s; animation-delay: -8s; }
.bg-orb-3 { width: 320px; height: 320px; bottom: -120px; left: 35%; background: radial-gradient(circle, rgba(11,138,67,.2), transparent 70%); animation-duration: 34s; animation-delay: -14s; }
@keyframes drift { 0%,100%{ transform: translate(0,0) scale(1);} 33%{ transform: translate(35px,-25px) scale(1.06);} 66%{ transform: translate(-25px,20px) scale(.96);} }

/* Updated Light Hero Grid */
.page-hero { position: relative; overflow: hidden; background: var(--paper); }
.hero-grid-light { 
    background-image: linear-gradient(to right, rgba(9, 19, 43, 0.03) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(9, 19, 43, 0.03) 1px, transparent 1px); 
    background-size: 4rem 4rem; 
    mask-image: radial-gradient(ellipse 70% 70% at 50% 0%, #000 40%, transparent 100%); 
}

/* Kicker Updates for Light Theme */
.hero-kicker-light { display:inline-flex; align-items:center; gap:.5rem; }
.hero-kicker-light .dot { 
    width:6px; height:6px; border-radius:50%; background: var(--green); 
    box-shadow: 0 0 0 4px rgba(11, 138, 67, 0.15); 
    animation: pulseDotLight 2s infinite; 
}
@keyframes pulseDotLight { 
    0%,100%{ box-shadow: 0 0 0 4px rgba(11, 138, 67, 0.15); } 
    50%{ box-shadow: 0 0 0 8px rgba(11, 138, 67, 0.05); } 
}

/* Animated Curved Underline */
.svg-underline { position: absolute; left: 0; bottom: -8px; width: 100%; height: 16px; pointer-events: none; overflow: visible; z-index: -1; }
.svg-underline path {
    stroke-dasharray: 300;
    stroke-dashoffset: 300;
    animation: drawUnderline 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: 0.4s;
}
@keyframes drawUnderline {
    to { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .svg-underline path { stroke-dashoffset: 0; animation: none; }
}

.icon-pop { transition: transform .45s var(--ease-pop), background .35s, color .35s, border-color .35s; }
.group:hover .icon-pop { transform: scale(1.12) rotate(-6deg); }

/* filter pills */
.filter-pill { transition: all .3s var(--ease); }
.filter-pill.active { background: var(--navy); color: #fff; border-color: var(--navy); }
.filter-pill:not(.active):hover { border-color: var(--green); color: var(--green); }

/* certification card */
.cert-card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 22px; overflow: hidden; transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s; }
.cert-card::after { content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background: linear-gradient(90deg, var(--green-light), var(--green)); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.cert-card:hover { transform: translateY(-6px); box-shadow: 0 28px 60px -20px rgba(9,19,43,.2); border-color: rgba(11,138,67,.25); }
.cert-card:hover::after { transform: scaleX(1); }
.cert-card .cert-img { transition: transform .7s var(--ease); }
.cert-card:hover .cert-img { transform: scale(1.07); }
.cert-card .view-arrow { transition: transform .4s var(--ease-pop); }
.cert-card:hover .view-arrow { transform: translateX(4px); }

@keyframes revealUp { from { opacity:0; transform: translateY(28px); } to { opacity:1; transform: translateY(0); } }
.gsap-fade-up { opacity: 0; transform: translateY(32px); }
.gsap-stagger  { opacity: 0; transform: translateY(24px); }

@media (prefers-reduced-motion: reduce) {
    .bg-orb, .hero-kicker .dot { animation: none !important; }
    .gsap-fade-up, .gsap-stagger { opacity: 1 !important; transform: none !important; }
}

/* Mobile Filter Scrollbar Hidden */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
