: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: 'Inter', sans-serif; letter-spacing: -0.035em; }

/* film-grain texture */
.grain-overlay { position: fixed; inset: 0; z-index: -1; opacity: .05; pointer-events: none; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* Light marquee strip beneath the hero */
.marquee-strip { background: #ffffff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.marquee-track { display: inline-flex; align-items: center; gap: 2rem; white-space: nowrap; animation: marqueeScroll 26s linear infinite; }
.marquee-track span { display:inline-flex; align-items:center; gap: .6rem; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.marquee-track .sep { width:4px; height:4px; border-radius:50%; background: var(--green); }
@keyframes marqueeScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* magnetic glow behind primary CTAs */
.btn-glow { position: relative; isolation: isolate; }
.btn-glow::before { content:''; position:absolute; inset:-4px; border-radius: 16px; background: linear-gradient(120deg, var(--green-light), var(--green)); z-index:-1; filter: blur(14px); opacity: 0; transition: opacity .45s var(--ease); }
.btn-glow:hover::before { opacity: .55; }

/* AMBIENT BACKGROUND */
.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: .35; animation: drift 22s ease-in-out infinite; }
.bg-orb-1 { width: 460px; height: 460px; top: -120px; left: -100px; background: radial-gradient(circle, rgba(11,138,67,.25), transparent 70%); animation-duration: 26s; }
.bg-orb-2 { width: 380px; height: 380px; top: 40%; right: -140px; background: radial-gradient(circle, rgba(9,19,43,.15), transparent 70%); animation-duration: 30s; animation-delay: -6s; }
.bg-orb-3 { width: 340px; height: 340px; bottom: -140px; left: 30%; background: radial-gradient(circle, rgba(11,138,67,.15), transparent 70%); animation-duration: 34s; animation-delay: -12s; }

/* Mobile optimization for orbs */
@media (max-width: 768px) {
    .bg-orb-1 { width: 280px; height: 280px; top: -50px; left: -50px; filter: blur(50px); }
    .bg-orb-2 { width: 250px; height: 250px; right: -80px; filter: blur(50px); }
    .bg-orb-3 { width: 200px; height: 200px; bottom: -80px; filter: blur(50px); }
    .marquee-track { gap: 1.5rem; }
}

@keyframes drift {
    0%, 100% { transform: translate(0,0) scale(1); }
    33% { transform: translate(40px,-30px) scale(1.08); }
    66% { transform: translate(-30px,25px) scale(.95); }
}

/* SHARED CARD / ACCENT LANGUAGE */
.glass-card { background: rgba(255,255,255,0.9); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border: 1px solid rgba(255,255,255,0.8); box-shadow: 0 24px 60px -20px rgba(9,19,43,.15); }

.accent-card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; transition: transform .35s var(--ease), box-shadow .45s var(--ease), border-color .3s; transform-style: preserve-3d; will-change: transform; }
.accent-card::before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, var(--green-light), var(--green)); transform: scaleY(0); transform-origin: top; transition: transform .5s var(--ease); z-index: 2; }
.accent-card:hover { box-shadow: 0 22px 50px -18px rgba(9,19,43,.18); border-color: rgba(11,138,67,.25); }
.accent-card:hover::before { transform: scaleY(1); }
.accent-card-dark { position: relative; background: var(--navy); border-radius: 18px; overflow: hidden; transition: transform .35s var(--ease), box-shadow .45s var(--ease); transform-style: preserve-3d; will-change: transform; }
.accent-card-dark::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--green-light), var(--green), transparent); z-index: 2; }
.accent-card-dark:hover { box-shadow: 0 24px 50px -16px rgba(0,0,0,.4); }

.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); }

.rich-content { color: var(--muted); font-size: 1.05rem; line-height: 1.85; }
.rich-content h2 { font-size: 1.4rem !important; font-weight: 600; color: var(--ink) !important; margin: 2rem 0 1rem; letter-spacing: -0.025em; }
@media (min-width: 768px) { .rich-content h2 { font-size: 1.6rem !important; margin: 2.5rem 0 1.25rem; } }
.rich-content h3 { font-size: 1.2rem !important; font-weight: 500; color: #1e293b !important; margin: 1.5rem 0 1rem; }
@media (min-width: 768px) { .rich-content h3 { font-size: 1.3rem !important; margin: 2rem 0 1rem; } }
.rich-content p { margin-bottom: 1.5rem; text-align: justify; }
.rich-content ul { list-style: none; padding: 0; margin-bottom: 2rem; }
.rich-content ul li { position: relative; padding-left: 1.8rem; margin-bottom: .85rem; color: #334155; }
.rich-content ul li::before { content: ''; position: absolute; left: 0; top: .65rem; width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(11,138,67,.12); }
.rich-content blockquote { border-left: 3px solid var(--green); padding: 1.25rem 1.5rem; background: var(--green-pale); border-radius: 0 16px 16px 0; font-style: italic; color: var(--navy); margin: 2rem 0; }
@media (min-width: 768px) { .rich-content blockquote { padding: 1.5rem 2rem; margin: 2.5rem 0; } }

.custom-scrollbar::-webkit-scrollbar { width: 5px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(9,19,43,.2); border-radius: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: rgba(9,19,43,.4); }

.faq-content { transition: max-height .5s var(--ease), opacity .4s ease; max-height: 0; opacity: 0; overflow: hidden; }
.faq-item.active .faq-content { max-height: 800px; opacity: 1; padding-bottom: 1.5rem; }
.faq-icon { transition: transform .35s var(--ease-pop), color .3s ease; }
.faq-item.active .faq-icon { transform: rotate(45deg); color: var(--green); }
.faq-item.active { border-color: var(--green) !important; box-shadow: 0 10px 25px -5px rgba(11,138,67,.12); }
.faq-item { position: relative; }
.faq-item::before { content:''; position:absolute; top:0; left:0; bottom:0; width:3px; background: var(--green); transform: scaleY(0); transform-origin: top; transition: transform .4s var(--ease); }
.faq-item.active::before { transform: scaleY(1); }

/* Updated Light HERO */
.hero-section { position: relative; overflow: hidden; background: var(--paper); }
.hero-grid { 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%); }
.hero-parallax-img { will-change: transform; }
.hero-kicker { display:inline-flex; align-items:center; gap:.5rem; }
.hero-kicker .dot { width:6px; height:6px; border-radius:50%; background: var(--green); box-shadow: 0 0 0 4px rgba(11, 138, 67, 0.15); animation: pulseDot 2s infinite; }
@keyframes pulseDot { 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); } }

/* rotating certification seal */
.cert-seal { position: relative; width: 108px; height: 108px; display:flex; align-items:center; justify-content:center; }
.cert-seal::before { content:''; position:absolute; inset:0; border-radius:50%; border: 1.5px dashed rgba(11,138,67,.55); animation: spinSlow 26s linear infinite; }
.cert-seal::after { content:''; position:absolute; inset:10px; border-radius:50%; background: radial-gradient(circle at 35% 30%, rgba(11,138,67,.15), rgba(11,138,67,.05) 60%, transparent 75%); }
.cert-seal .seal-core { position:relative; z-index:2; width:74px; height:74px; border-radius:50%; background: linear-gradient(145deg, var(--green-light), var(--green)); display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 30px -8px rgba(11,138,67,.6), inset 0 2px 4px rgba(255,255,255,.3); }
@keyframes spinSlow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.hero-stat-pill { transition: transform .4s var(--ease-pop), background .3s; }
.hero-stat-pill:hover { transform: translateY(-3px); background: #f9fafb; }

.bracket-frame { position: relative; }
.bracket-frame::before, .bracket-frame::after { content:''; position:absolute; width:22px; height:22px; border-color: rgba(11,138,67,.7); z-index: 3; }
.bracket-frame::before { top:-1px; left:-1px; border-top:2px solid; border-left:2px solid; border-radius: 10px 0 0 0; }
.bracket-frame::after { bottom:-1px; right:-1px; border-bottom:2px solid; border-right:2px solid; border-radius: 0 0 10px 0; }

.process-step-dot { transition: border-color .35s, box-shadow .35s, transform .35s var(--ease-pop); }
.group:hover .process-step-dot { border-color: var(--green) !important; box-shadow: 0 0 0 8px rgba(11,138,67,.1); transform: translateY(-2px); }

.benefit-item, .challenge-item, .industry-item { transition: transform .4s var(--ease), box-shadow .4s var(--ease); }

@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, .cert-seal::before, .hero-kicker .dot { animation: none !important; }
    .gsap-fade-up, .gsap-stagger { opacity: 1 !important; transform: none !important; }
}