:root{
  --green:#059669;
  --green2:#10b981;
  --green3:#62c95f;
  --dark:#06101d;
  --navy:#0b1b2b;
  --text:#111827;
  --muted:#64748b;
  --soft:#f6f8fb;
  --line:#e5e7eb;
  --blue:#2388e8;
  --white:#ffffff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:#fff;
}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.container{width:min(1120px,calc(100% - 40px));margin:0 auto}
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(6,16,29,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-wrap{
  height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:14px;color:white}
.brand img{height:46px;width:auto;display:block;border-radius:4px}
.brand span{font-size:12px;color:#9ca3af;font-weight:700;letter-spacing:.02em}
.main-nav{display:flex;gap:24px;align-items:center;color:white;font-weight:800;font-size:14px}
.main-nav a:hover{color:var(--green2)}
.nav-cta{
  border:1px solid rgba(16,185,129,.9);
  padding:12px 16px;
  border-radius:10px;
  color:white!important;
}
.mobile-toggle{display:none;background:none;border:0;color:white;font-size:30px}
.hero{
  min-height:660px;
  color:white;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 82% 22%,rgba(16,185,129,.24),transparent 28%),
    linear-gradient(135deg,#06101d 0%,#0b1b2b 58%,#06281f 100%);
}
.hero-bg-lines:before,.hero-bg-lines:after,.final-cta:after{
  content:"";
  position:absolute;
  width:820px;
  height:340px;
  border:1px solid rgba(16,185,129,.22);
  border-left:0;
  border-right:0;
  border-radius:50%;
  transform:rotate(-12deg);
}
.hero-bg-lines:before{right:-150px;bottom:20px}
.hero-bg-lines:after{right:-90px;bottom:-60px}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:60px;align-items:center;position:relative;z-index:2}
.eyebrow{
  margin:0 0 14px;
  color:var(--green2);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:13px;
  font-weight:900;
}
h1,h2,h3,h4{font-family:Poppins,Inter,sans-serif}
h1{
  font-size:clamp(52px,7vw,92px);
  letter-spacing:-.07em;
  line-height:.92;
  margin:0 0 24px;
}
h1 span{color:var(--green3)}
h2{
  font-size:clamp(32px,4vw,54px);
  line-height:1.05;
  letter-spacing:-.045em;
  margin:0 0 18px;
}
h3{font-size:24px;margin:0 0 12px}
h4{font-size:20px;line-height:1.35;margin:0 0 16px}
.hero-text{font-size:21px;line-height:1.6;color:#e5e7eb;max-width:610px}
.actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:32px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  padding:15px 22px;
  font-weight:900;
  transition:.2s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,#35a853,var(--green));color:white}
.btn-secondary{border:1px solid rgba(255,255,255,.5);color:white}
.btn-small{padding:12px 18px;border:1px solid rgba(255,255,255,.45);color:white}
.hero-visual{position:relative;height:460px}
.pin-shape{
  position:absolute;
  right:60px;
  top:28px;
  width:360px;
  height:360px;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:linear-gradient(135deg,rgba(16,185,129,.58),rgba(5,150,105,.12));
  box-shadow:0 40px 120px rgba(0,0,0,.35);
}
.pin-shape:before{
  content:"";
  position:absolute;
  inset:31%;
  border-radius:50%;
  background:rgba(255,255,255,.14);
}
.orb{position:absolute;border-radius:50%;background:rgba(16,185,129,.16);filter:blur(1px)}
.orb-one{width:120px;height:120px;right:20px;bottom:20px}
.orb-two{width:70px;height:70px;left:70px;top:90px}
.founding-banner{
  background:#07111f;
  color:white;
  border-top:2px solid var(--green);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:20px 0;
}
.banner-inner{display:flex;align-items:center;justify-content:space-between;gap:26px}
.banner-inner strong{font-size:22px}
.banner-inner p{margin:6px 0 0;color:#d1d5db}
.section{padding:88px 0}
.section-head{max-width:880px;margin-bottom:42px}
.center{text-align:center;margin-left:auto;margin-right:auto}
.section-head p,.value-card p,.product-card p,.why-copy p,.page-hero p,.contact-section p,.founder-split p,.values-four p{color:var(--muted);line-height:1.75}
.value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.value-card{
  background:white;
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px 22px;
  text-align:center;
  box-shadow:0 18px 50px rgba(15,23,42,.05);
}
.value-card .icon{font-size:36px;margin-bottom:12px}
.value-card h3{font-size:18px}
.products-section,.serve-section{background:var(--soft)}
.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.product-card{
  background:white;
  border:1px solid #dbe3ed;
  border-radius:18px;
  padding:34px;
  box-shadow:0 24px 60px rgba(15,23,42,.07);
}
.product-top{display:flex;align-items:center;gap:14px;margin-bottom:24px;flex-wrap:wrap}
.product-icon{
  width:72px;height:72px;border-radius:18px;color:white;display:grid;place-items:center;
  font-size:34px;font-weight:900;font-family:Poppins,Inter,sans-serif;
}
.product-icon.kid{background:var(--green)}
.product-icon.ratio{background:var(--blue)}
.product-tag{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--green);font-weight:900}
.product-tag.blue{color:var(--blue)}
.product-card ul{padding-left:20px;line-height:1.95;color:#1f2937}
.learn{font-weight:900;color:var(--green)}
.learn.blue,.blue-card .learn{color:var(--blue)}
.blue-btn{background:linear-gradient(135deg,#35a4ff,var(--blue))}
.serve-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.serve-grid div{
  background:white;border:1px solid var(--line);border-radius:14px;
  padding:24px 12px;text-align:center;font-size:33px;
}
.serve-grid span{display:block;font-size:14px;font-weight:900;margin-top:13px}
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.stats-strip{background:#07111f;color:white;padding:44px 0}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);text-align:center}
.stats-grid div{border-right:1px solid rgba(255,255,255,.18)}
.stats-grid div:last-child{border-right:0}
.stats-grid strong{font-size:58px;color:var(--green3);display:block;font-family:Poppins,Inter,sans-serif}
.stats-grid span{font-weight:900}
.final-cta{
  position:relative;overflow:hidden;color:white;padding:86px 0;
  background:linear-gradient(135deg,#06101d,#0b1b2b 58%,#083c2e);
}
.final-cta:after{right:-180px;bottom:-90px}
.final-cta .container{position:relative;z-index:1;max-width:880px}
.final-cta p{font-size:20px;color:#d1d5db;line-height:1.65}
.center-actions{justify-content:center}
.page-hero{
  background:linear-gradient(135deg,#06101d,#0b1b2b 58%,#083c2e);
  color:white;
  padding:126px 0 92px;
}
.page-hero .container{max-width:950px}
.page-hero p{font-size:20px;color:#d1d5db}
.founder-photo{
  min-height:430px;border-radius:26px;background:linear-gradient(135deg,#0b1b2b,#059669);
  color:white;display:grid;place-items:center;font-size:92px;font-weight:900;font-family:Poppins,Inter,sans-serif;
}
.values-four{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.values-four article{
  background:white;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:0 18px 50px rgba(15,23,42,.05);
}
.contact-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:55px;align-items:start}
.contact-details{display:grid;gap:16px;margin:30px 0;font-size:20px;font-weight:900}
.contact-details a{color:var(--green)}
.contact-form{
  background:var(--soft);border:1px solid var(--line);border-radius:24px;padding:30px;display:grid;gap:16px;
}
label{display:grid;gap:8px;font-weight:900}
input,select,textarea{
  width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:15px 14px;font:inherit;background:white;
}
button{
  border:0;background:var(--green);color:white;border-radius:10px;padding:16px;font-weight:900;font:inherit;cursor:pointer;
}
.hidden-field{display:none!important}
.footer{background:#06101d;color:white;padding:48px 0 26px}
.footer-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:54px;align-items:start}
.footer-brand img{height:52px;width:auto;border-radius:4px}
.footer-brand p,.copyright{color:#9ca3af}
.socials{display:flex;gap:14px;margin-top:18px}
.socials a{color:var(--green2);font-weight:900}
.footer-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.footer-columns div{display:grid;gap:11px}
.footer-columns a,.footer-columns span{color:#d1d5db}
.footer-columns strong{margin-bottom:7px}
.copyright{border-top:1px solid rgba(255,255,255,.08);margin-top:36px;padding-top:22px;font-size:14px}
@media(max-width:940px){
  .mobile-toggle{display:block}
  .main-nav{
    display:none;position:absolute;top:82px;left:0;right:0;background:#06101d;padding:20px;
    flex-direction:column;align-items:flex-start;border-top:1px solid rgba(255,255,255,.08)
  }
  .nav-open .main-nav{display:flex}
  .brand span{display:none}
  .hero{min-height:auto;padding:84px 0}
  .hero-grid,.product-grid,.split,.contact-grid,.footer-grid{grid-template-columns:1fr}
  .hero-visual{display:none}
  .value-grid,.values-four{grid-template-columns:1fr}
  .serve-grid{grid-template-columns:repeat(2,1fr)}
  .stats-grid{grid-template-columns:1fr;gap:28px}
  .stats-grid div{border-right:0}
  .banner-inner{align-items:flex-start;flex-direction:column}
  .footer-columns{grid-template-columns:1fr}
  h1{font-size:52px}
}


/* Product logo updates */
.product-logo-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.product-logo-full {
  display: block;
  max-width: 400px;
  max-height: 140px;
  object-fit: contain;
}
.product-logo-icon {
  width: 120px;
  height: 120px;
  object-fit: contain;
  border-radius: 18px;
}
.product-site-link {
  display: inline-flex;
  margin-top: 10px;
  font-weight: 900;
  color: var(--green);
}
.blue-card .product-site-link {
  color: var(--blue);
}
.footer-product-logo {
  max-width: 125px;
  max-height: 42px;
  object-fit: contain;
  vertical-align: middle;
}