/* Minimal, fast CSS (no frameworks) */
:root{
  --bg:#000;
  --bg-2:#0a0a0a;
  --panel:#111;
  --text:#e8e8e8;
  --muted:#9aa0a6;
  --accent:#00ff78;
  --border:#1e1e1e;
  --card:#0f0f0f;
  --bg-gradient: linear-gradient(180deg, #00111a 0%, #001a10 45%, #000000 100%);
  --bg-overlay: linear-gradient(180deg, rgba(0,0,0,0.20), rgba(0,0,0,0.55));
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans';
  background: var(--bg-gradient);
  background-color: var(--bg);
  color:var(--text);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

.container{max-width:1100px;margin:0 auto;padding:0 20px}
.container.narrow{max-width:820px}
.center{text-align:center}

/* HERO */
.hero{
  position:relative;
  height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
}
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;
}
.hero-mesh{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:screen;opacity:.55}
.hero-inner{position:relative;z-index:2;max-width:780px;padding:0 24px}
.hero h1{font-size:clamp(40px,6vw,84px);margin:10px 0 12px;font-weight:800;letter-spacing:-.02em}
.tagline{font-size:clamp(18px,2.2vw,26px);color:#c7c7c7;margin:0 0 28px}
.cta{
  display:inline-block;background:#fff;color:#000;
  padding:14px 28px;border-radius:999px;text-decoration:none;font-weight:600;
  transition:transform .2s ease, background .2s ease;
}
.cta:hover{transform:translateY(-2px);background:#e6e6e6}

/* Crest inline (above name) */
.crest-inline{display:flex;justify-content:center;margin-bottom:8px}
.crest{opacity:.92;filter:drop-shadow(0 10px 30px rgba(0,255,120,.08))}
.crest--small{width:min(20vmin,140px);height:auto}
/* .ring animation handled via SVG SMIL */
/* ring keyframes removed; using SMIL */

/* Monogram stroke animation classes */
#monogram{
  stroke-dasharray:400;
  stroke-dashoffset:400;
}
#monogram.draw{
  animation: monogram-draw 2.8s ease forwards;
}
#monogram.erase{
  animation: monogram-erase 0.7s ease forwards;
}
@keyframes monogram-draw{
  from{ stroke-dashoffset:400 }
  to{ stroke-dashoffset:0 }
}
@keyframes monogram-erase{
  from{ stroke-dashoffset:0 }
  to{ stroke-dashoffset:400 }
}

/* subtle scroll cue */
.scroll-cue{margin-top:18px;height:28px;display:flex;justify-content:center}
.scroll-cue span{
  width:18px;height:28px;border:2px solid #b7b7b7;border-radius:12px;position:relative;opacity:.7
}
.scroll-cue span:after{
  content:"";position:absolute;left:50%;top:6px;width:2px;height:6px;background:#b7b7b7;transform:translateX(-50%);
  animation:scroll 1.6s ease-in-out infinite;
}
@keyframes scroll{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,10px)}}

/* Sections */
.section{padding:96px 0;border-top:1px solid var(--border);background:var(--bg)}
.section--about{background:var(--bg)}
.section--ventures{background:var(--bg-2)}
.section--vision{background:var(--bg)}
.section--impact{background:var(--bg-2)}
.section--contact{background:var(--bg)}

h2{font-size:clamp(28px,3vw,40px);margin:0 0 18px}
p{line-height:1.7;color:#cfcfcf;margin:0 0 16px}

.actions{display:flex;gap:14px;justify-content:center;margin-top:24px}
.btn{
  display:inline-block;border-radius:999px;padding:12px 20px;text-decoration:none;font-weight:600;
  border:1px solid #2a2a2a
}
.btn--light{background:#fff;color:#000}
.btn--dark{background:transparent;color:#fff}

/* Ventures */
.grid{
  display:grid;gap:18px;
  grid-template-columns:repeat(1, 1fr);
}
@media(min-width:640px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.grid{grid-template-columns:repeat(3,1fr)}}

.card{
  background:var(--card);border:1px solid var(--border);border-radius:20px;
  padding:64px 18px;text-align:center;font-weight:700;font-size:22px;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.card:hover{
  transform:translateY(-3px);
  border-color:#2d2d2d;
  box-shadow:0 10px 30px rgba(0,0,0,.3);
}
.card a{color:inherit;text-decoration:underline;text-underline-offset:4px}

/* Impact icon */
.icon{color:var(--accent);margin-bottom:12px}

/* Footer */
.footer{padding:40px 0;border-top:1px solid var(--border);background:var(--bg-2)}
.crest-mini{font-size:22px;font-weight:800;margin-bottom:8px}
.small{color:#9fa3a8;font-size:13px;margin-bottom:4px}
.tiny{color:#8a8f94;font-size:12px}

.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .hero-mesh{display:none}
  /* .ring animation handled via SVG SMIL */
  #monogram{animation:none}
  .cta:hover{transform:none}
  .reveal{transition:none}
}