/* =========================================================================
   ERCAAP — corporate / investor site
   Design language matched to termiprotocol.com:
   #09090B ground · white text · zinc grays · subtle white-only lighting.
   JetBrains Mono = display headings, labels, numbers · Inter = chrome & body.
   ========================================================================= */

:root{
  --bg:#09090B; --bg-s:#0D0D0F; --bg-c:#141417; --bg-e:#1A1A1E;
  --t1:#FAFAFA; --t2:#A1A1AA; --t3:#71717A; --t4:#52525B;
  --border:rgba(255,255,255,.08); --border-h:rgba(255,255,255,.14); --border-s:rgba(255,255,255,.22);
  --soft:rgba(255,255,255,.05); --soft-2:rgba(255,255,255,.022); --soft-3:rgba(255,255,255,.035);

  /* monochrome aliases so any legacy color reference resolves to white/zinc */
  --jade:#FAFAFA; --gold:#FAFAFA; --cyan:#FAFAFA;

  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:20px; --r-2xl:24px;
  --shadow:0 6px 22px rgba(0,0,0,.5); --shadow-lg:0 22px 60px rgba(0,0,0,.62);

  --f-display:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;
  --f-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;

  --ease:cubic-bezier(.16,1,.3,1); --dur:220ms;
  --w:1180px;
}

*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--f-sans); background:var(--bg); color:var(--t1);
  line-height:1.6; font-weight:400; letter-spacing:-.011em; font-size:16px;
  overflow-x:clip; overflow-wrap:break-word; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background-image:radial-gradient(1100px 560px at 84% -14%, rgba(255,255,255,.030), transparent 60%);
}
img,video,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
::selection{ background:rgba(255,255,255,.18); color:var(--t1); }
#app{ position:relative; z-index:1; }

/* ------------------------------- Layout --------------------------------- */
.wrap{ width:100%; max-width:var(--w); margin-inline:auto; padding-inline:24px; }
.section{ position:relative; padding:clamp(64px,9vw,124px) 0; }
.divider{ height:1px; background:var(--border); max-width:var(--w); margin-inline:auto; }

/* Section heading kit */
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-mono); font-size:.72rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--t3);
  padding:6px 13px; border:1px solid var(--border); border-radius:100px; background:var(--soft-2);
}
.eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--t1); box-shadow:0 0 9px rgba(255,255,255,.5); }
.eyebrow.gold,.eyebrow.gold .dot{ color:var(--t3); }

.section-head{ max-width:720px; margin-bottom:clamp(40px,5vw,60px); }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-title{
  font-family:var(--f-display); font-weight:500; letter-spacing:.01em; line-height:1.12;
  font-size:clamp(1.9rem,4vw,3.05rem); margin:18px 0 0;
}
.section-title em{ font-style:normal; color:var(--t3); }
.section-lead{ color:var(--t2); font-size:clamp(.98rem,1.4vw,1.12rem); margin:18px 0 0; max-width:62ch; line-height:1.62; }
.section-head.center .section-lead{ margin-inline:auto; }
.section-head .eyebrow + .section-title{ margin-top:20px; }
.grad-text,.gold-text{ color:var(--t1); background:none; -webkit-text-fill-color:currentColor; }

/* ------------------------------- Buttons -------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--f-sans); font-weight:600; font-size:.9rem;
  padding:12px 26px; border-radius:var(--r); border:1px solid transparent;
  transition:transform var(--dur) var(--ease), background var(--dur), border-color var(--dur), box-shadow var(--dur);
}
.btn svg{ width:16px; height:16px; }
.btn-primary{ background:var(--t1); color:#09090B; }
.btn-primary:hover{ background:#fff; transform:translateY(-1px); box-shadow:0 10px 26px rgba(0,0,0,.5); }
.btn-ghost{ border-color:var(--border-h); color:var(--t1); background:transparent; }
.btn-ghost:hover{ border-color:var(--border-s); background:var(--soft); transform:translateY(-1px); }
.btn-lg{ padding:14px 32px; font-size:.95rem; }

/* --------------------------------- Nav ---------------------------------- */
.nav{ position:fixed; inset:0 0 auto; z-index:50; padding:12px 0; background:rgba(9,9,11,.7);
  backdrop-filter:blur(20px) saturate(140%); -webkit-backdrop-filter:blur(20px) saturate(140%);
  border-bottom:1px solid transparent; transition:transform .4s var(--ease), border-color var(--dur), background var(--dur); }
.nav.scrolled{ border-bottom-color:var(--border); }
.nav-inner{ width:min(var(--w),calc(100% - 48px)); margin-inline:auto; display:flex; align-items:center; gap:20px; }
.brand{ display:flex; align-items:center; gap:10px; }
.brand svg{ width:30px; height:30px; }
.brand b{ font-family:var(--f-mono); font-weight:700; font-size:1rem; letter-spacing:.02em; }
.brand .tld{ font-family:var(--f-mono); color:var(--t4); font-weight:500; font-size:.82rem; }
.nav-links{ display:flex; gap:2px; margin-left:auto; }
.nav-links a{ padding:8px 13px; border-radius:var(--r-sm); font-size:.85rem; font-weight:500; color:var(--t3); transition:color var(--dur), background var(--dur); }
.nav-links a:hover{ color:var(--t1); background:var(--soft); }
.nav-right{ display:flex; align-items:center; gap:10px; }
.lang-toggle{ display:flex; padding:3px; border-radius:100px; border:1px solid var(--border); background:var(--bg-c); }
.lang-toggle button{ padding:5px 11px; border-radius:100px; font-family:var(--f-mono); font-size:.72rem; font-weight:600; letter-spacing:.04em; color:var(--t4); transition:var(--dur); }
.lang-toggle button.on{ color:#09090B; background:var(--t1); }
.burger{ display:none; width:40px; height:40px; border-radius:var(--r-sm); border:1px solid var(--border-h); }
.burger span{ display:block; width:16px; height:1.5px; background:var(--t1); margin:3.5px auto; transition:.3s; }

/* --------------------------------- Hero --------------------------------- */
.hero{ position:relative; padding:clamp(120px,15vw,180px) 0 clamp(48px,7vw,88px); overflow:hidden; }
.aurora{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.aurora i{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.5; }
.aurora i:nth-child(1){ width:520px; height:520px; right:-6%; top:-16%; background:radial-gradient(circle,rgba(255,255,255,.05),transparent 65%); }
.aurora i:nth-child(2){ width:420px; height:420px; left:-8%; top:18%; background:radial-gradient(circle,rgba(255,255,255,.025),transparent 65%); }
.aurora i:nth-child(3){ display:none; }

.hero-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1fr; gap:clamp(40px,5vw,64px); align-items:center; }
@media(min-width:920px){ .hero-grid{ grid-template-columns:1fr 1.06fr; } }
.hero-eyebrows{ display:flex; gap:9px; flex-wrap:wrap; }
.hero h1{
  font-family:var(--f-display); font-weight:500; letter-spacing:.005em; line-height:1.1;
  font-size:clamp(2.4rem,5.4vw,4.3rem); margin:24px 0 0; text-wrap:balance;
}
.hero h1 em{ font-style:normal; color:var(--t3); }
.hero-sub{ color:var(--t2); font-size:clamp(1rem,1.5vw,1.18rem); margin:24px 0 0; max-width:50ch; line-height:1.6; }
.hero-cta{ display:flex; gap:12px; margin-top:32px; flex-wrap:wrap; }
.hero-kpis{ display:flex; gap:30px; margin-top:44px; flex-wrap:wrap; }
.hero-kpis .k{ display:flex; flex-direction:column; gap:4px; }
.hero-kpis .k b{ font-family:var(--f-display); font-size:clamp(1.5rem,2.6vw,2rem); font-weight:500; letter-spacing:.01em; color:var(--t1); }
.hero-kpis .k span{ font-family:var(--f-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--t4); }

/* Hero visual: refined glass panel */
.hero-visual{ position:relative; }
.hero-card{ position:relative; border-radius:var(--r-2xl); border:1px solid var(--border); background:var(--bg-s); box-shadow:var(--shadow-lg); padding:18px; overflow:hidden; }
.hero-card .row{ display:flex; gap:7px; align-items:center; margin-bottom:14px; }
.hero-card .row i{ width:10px; height:10px; border-radius:50%; background:var(--border-s); }
.hero-card .row b{ margin-left:auto; font-family:var(--f-mono); font-size:.72rem; color:var(--t4); letter-spacing:.04em; }
.hero-mini{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hero-mini .m{ border:1px solid var(--border); border-radius:var(--r); padding:14px; background:var(--bg-c); }
.hero-mini .m .lbl{ font-family:var(--f-mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--t4); }
.hero-mini .m .v{ font-family:var(--f-display); font-size:1.4rem; font-weight:500; margin-top:7px; color:var(--t1); }
.hero-mini .m.big{ grid-column:1/-1; display:flex; align-items:center; gap:13px; }
.hero-mini .m.big img{ width:46px; height:46px; border-radius:11px; border:1px solid var(--border-h); }
.hero-mini .spark{ display:flex; align-items:flex-end; gap:4px; height:34px; margin-top:12px; }
.hero-mini .spark span{ flex:1; background:linear-gradient(180deg,var(--t2),var(--t4)); border-radius:2px 2px 0 0; opacity:.9; }
.float-badge{ position:absolute; right:-12px; bottom:-14px; display:flex; align-items:center; gap:9px; padding:10px 15px; border-radius:100px;
  background:rgba(9,9,11,.86); backdrop-filter:blur(12px); border:1px solid var(--border-h); box-shadow:var(--shadow); font-family:var(--f-mono); font-size:.76rem; color:var(--t2); letter-spacing:.02em; }
.float-badge .pulse{ width:7px; height:7px; border-radius:50%; background:var(--t1); box-shadow:0 0 0 0 rgba(255,255,255,.5); animation:pulse 2.2s infinite; }
a.float-badge{ transition:transform var(--dur), border-color var(--dur); }
a.float-badge:hover{ transform:translateY(-2px); border-color:var(--border-s); }
.float-badge .ext{ width:13px; height:13px; color:var(--t3); }
.hero-next{ display:flex; align-items:center; gap:11px; margin-top:12px; padding:11px 13px; border:1px solid var(--border); border-radius:var(--r); background:var(--bg-c); transition:border-color var(--dur), background var(--dur); }
a.hero-next:hover{ border-color:var(--border-h); background:var(--bg-e); }
.hero-next img{ width:36px; height:36px; border-radius:9px; border:1px solid var(--border-h); flex:none; }
.hero-next .hn-t{ min-width:0; line-height:1.25; }
.hero-next .hn-t b{ font-family:var(--f-mono); font-size:.88rem; font-weight:600; color:var(--t1); display:block; }
.hero-next .hn-t span{ font-family:var(--f-mono); font-size:.68rem; color:var(--t4); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
.hero-next .hn-badge{ margin-left:auto; font-family:var(--f-mono); font-size:.6rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#09090B; background:var(--t1); padding:5px 10px; border-radius:100px; white-space:nowrap; flex:none; }
.termi-tags{ display:flex; gap:7px; flex-wrap:wrap; margin-bottom:18px; }
@keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }

/* ----------------------------- Trust marquee ---------------------------- */
.trust{ border-block:1px solid var(--border); }
.trust .wrap{ display:flex; align-items:center; gap:28px; padding-block:18px; }
.trust .label{ font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--t4); white-space:nowrap; }
.marquee{ overflow:hidden; flex:1; -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.marquee .track{ display:flex; gap:40px; width:max-content; animation:scrollx 42s linear infinite; }
.marquee .track span{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:.82rem; color:var(--t4); white-space:nowrap; letter-spacing:.02em; }
.marquee .track span i{ width:5px; height:5px; border-radius:50%; background:var(--t4); }
@keyframes scrollx{ to{ transform:translateX(-50%); } }

/* ------------------------------- Cards base ----------------------------- */
.card{ position:relative; border:1px solid var(--border); border-radius:var(--r-lg); background:var(--bg-c); padding:26px;
  transition:transform var(--dur) var(--ease), border-color var(--dur), background var(--dur); }
.card:hover{ transform:translateY(-2px); border-color:var(--border-h); background:var(--bg-e); }
.card .ico{ width:44px; height:44px; border-radius:11px; display:grid; place-items:center; margin-bottom:18px; border:1px solid var(--border-h); background:var(--bg-s); color:var(--t1); }
.card .ico svg{ width:21px; height:21px; }
.card h3{ font-family:var(--f-sans); font-size:1.12rem; font-weight:600; letter-spacing:-.01em; margin:0 0 8px; }
.card p{ color:var(--t2); margin:0; font-size:.94rem; line-height:1.6; }

/* glow → replaced with a quiet hover tint (no color) */
.glow::after{ content:""; position:absolute; inset:0; border-radius:inherit; opacity:0; transition:opacity var(--dur); pointer-events:none;
  background:radial-gradient(360px 180px at var(--mx,50%) var(--my,0%), rgba(255,255,255,.05), transparent 70%); }
.glow:hover::after{ opacity:1; }

/* ------------------------------ Bento grid ------------------------------ */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.b-3{ grid-column:span 3; } .b-4{ grid-column:span 4; } .b-6{ grid-column:span 6; }

/* Mega about card */
.mega{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:34px; align-items:center; padding:clamp(28px,4vw,44px); }
.mega .lede{ font-family:var(--f-display); font-weight:300; letter-spacing:.01em; font-size:clamp(1.3rem,2.2vw,1.85rem); line-height:1.36; color:var(--t1); }
.mega .lede b{ font-weight:500; color:#fff; }
.mini-stats{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.mini-stats .ms{ border:1px solid var(--border); border-radius:var(--r); padding:18px; background:var(--bg-s); }
.mini-stats .ms b{ font-family:var(--f-display); font-size:1.7rem; font-weight:500; display:block; color:var(--t1); letter-spacing:.01em; }
.mini-stats .ms span{ font-family:var(--f-mono); font-size:.72rem; color:var(--t4); letter-spacing:.04em; }

/* ------------------------------ Stat / KPI ------------------------------ */
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.stat{ position:relative; border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; background:var(--bg-c); transition:border-color var(--dur), transform var(--dur) var(--ease); }
.stat:hover{ border-color:var(--border-h); transform:translateY(-2px); }
.stat .num{ font-family:var(--f-display); font-weight:500; letter-spacing:.005em; font-size:clamp(1.9rem,3.2vw,2.6rem); line-height:1; color:var(--t1); }
.stat .lbl{ margin-top:11px; color:var(--t2); font-size:.92rem; }
.stat .sub{ margin-top:5px; color:var(--t4); font-size:.74rem; font-family:var(--f-mono); letter-spacing:.03em; }
.stat.jade .num,.stat.gold .num,.stat.cyan .num{ color:var(--t1); }

/* Proof shots */
.proof{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
.proof figure{ margin:0; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; background:var(--bg-s); transition:border-color var(--dur); }
.proof figure:hover{ border-color:var(--border-h); }
.proof figure .bar{ display:flex; align-items:center; gap:8px; padding:11px 15px; border-bottom:1px solid var(--border); font-family:var(--f-mono); font-size:.73rem; color:var(--t3); }
.proof figure .bar .d{ width:8px; height:8px; border-radius:50%; background:var(--border-s); }
.proof figure .bar .src{ margin-left:auto; color:var(--t4); }
.proof figure img{ width:100%; }
.proof figcaption{ padding:14px 16px; font-size:.86rem; color:var(--t2); border-top:1px solid var(--border); line-height:1.55; }
.proof figcaption b{ color:var(--t1); font-weight:600; }

/* ------------------------------ Timeline -------------------------------- */
.timeline{ position:relative; display:grid; gap:12px; }
.timeline::before{ content:""; position:absolute; left:26px; top:10px; bottom:10px; width:1px; background:linear-gradient(var(--border-s),var(--border),transparent); }
.tl{ position:relative; display:grid; grid-template-columns:54px minmax(0,1fr); gap:16px; align-items:start; }
.tl .node{ width:54px; display:flex; justify-content:center; padding-top:24px; }
.tl .node b{ width:12px; height:12px; border-radius:50%; background:var(--bg); border:2px solid var(--t1); box-shadow:0 0 0 4px rgba(255,255,255,.06); z-index:1; }
.tl .tl-card{ min-width:0; border:1px solid var(--border); border-radius:var(--r-lg); padding:22px 24px; background:var(--bg-c); transition:border-color var(--dur), transform var(--dur) var(--ease); }
.tl .tl-card:hover{ border-color:var(--border-h); transform:translateX(3px); }
.tl .yr{ font-family:var(--f-mono); font-size:.78rem; color:var(--t3); letter-spacing:.06em; }
.tl .tl-card h3{ font-family:var(--f-display); font-weight:500; letter-spacing:.01em; margin:8px 0 6px; font-size:1.22rem; }
.tl .role{ color:var(--t3); font-size:.84rem; font-family:var(--f-mono); }
.tl .tl-card p{ color:var(--t2); margin:11px 0 0; font-size:.95rem; line-height:1.6; }
.chips{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.chip{ display:inline-flex; align-items:center; gap:6px; font-family:var(--f-mono); font-size:.72rem; padding:4px 10px; border-radius:6px; border:1px solid var(--border); color:var(--t3); }
.chip.win{ color:var(--t1); border-color:var(--border-s); background:var(--soft); }
.chip.win svg{ width:12px; height:12px; }

/* ------------------------------ Portfolio ------------------------------- */
.filters{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.filter{ font-family:var(--f-mono); font-size:.78rem; letter-spacing:.02em; padding:7px 14px; border-radius:8px; border:1px solid var(--border); color:var(--t3); transition:var(--dur); }
.filter:hover{ color:var(--t1); border-color:var(--border-h); }
.filter.on{ color:#09090B; background:var(--t1); border-color:transparent; font-weight:600; }
.apps{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.app-card{ position:relative; display:flex; flex-direction:column; gap:14px; border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; background:var(--bg-c);
  transition:transform var(--dur) var(--ease), border-color var(--dur), background var(--dur); }
.app-card:hover{ transform:translateY(-3px); border-color:var(--border-h); background:var(--bg-e); }
.app-card .top{ display:flex; align-items:center; gap:13px; }
.app-icon{ width:54px; height:54px; border-radius:14px; flex:none; display:grid; place-items:center; position:relative; overflow:hidden;
  border:1px solid var(--border-h); background:linear-gradient(180deg,#1d1d21,#141417); color:var(--t2); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.app-icon img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.app-icon svg{ width:26px; height:26px; }
.app-card .nm{ min-width:0; }
.app-card .nm h3{ font-family:var(--f-sans); font-size:1rem; font-weight:600; margin:0; letter-spacing:-.01em; line-height:1.25; min-height:2.5em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.app-card .nm .plat{ font-family:var(--f-mono); font-size:.72rem; color:var(--t4); margin-top:4px; display:flex; gap:6px; align-items:center; }
.app-card .nm .plat svg{ width:13px; height:13px; }
.app-card p{ color:var(--t2); font-size:.9rem; margin:0; flex:1; line-height:1.55; }
.app-card .foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:14px; border-top:1px solid var(--border); }
.badge{ font-family:var(--f-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; padding:4px 9px; border-radius:6px; border:1px solid var(--border-h); color:var(--t3); }
.badge.ai,.badge.viral,.badge.game{ color:var(--t2); border-color:var(--border-h); }
.app-card .view{ font-family:var(--f-mono); font-size:.74rem; color:var(--t4); display:inline-flex; align-items:center; gap:5px; transition:color var(--dur), gap var(--dur); }
.app-card .view svg{ width:13px; height:13px; }
.app-card:hover .view{ color:var(--t1); gap:8px; }
.app-card[hidden]{ display:none; }

/* Skeleton shimmer (loading "skimmer") */
.app-card.skeleton{ pointer-events:none; }
.sk{ position:relative; overflow:hidden; background:var(--bg-e); border-radius:6px; }
.sk::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent); animation:shimmer 1.3s infinite; }
@keyframes shimmer{ to{ transform:translateX(100%); } }
.sk-ico{ width:54px; height:54px; border-radius:14px; flex:none; }
.sk-line{ height:10px; } .sk-line.w40{ width:40%; } .sk-line.w70{ width:70%; } .sk-line.w90{ width:90%; } .sk-line.w55{ width:55%; }
.portfolio-note{ margin-top:22px; font-family:var(--f-mono); font-size:.8rem; color:var(--t4); display:flex; align-items:center; gap:9px; line-height:1.5; }
.portfolio-note svg{ width:15px; height:15px; color:var(--t3); flex:none; }

/* -------------------------------- Termi --------------------------------- */
.termi-card{ position:relative; border:1px solid var(--border-h); border-radius:var(--r-2xl); overflow:hidden; background:var(--bg-s); box-shadow:var(--shadow-lg); }
.termi-grid{ display:grid; grid-template-columns:1fr; }
@media(min-width:920px){ .termi-grid{ grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); } }
.termi-copy{ min-width:0; padding:clamp(30px,4.2vw,52px); display:flex; flex-direction:column; justify-content:center; }
.termi-brand{ display:flex; align-items:center; gap:13px; margin-bottom:22px; }
.termi-brand img{ width:50px; height:50px; border-radius:13px; border:1px solid var(--border-h); }
.termi-brand .t b{ font-family:var(--f-mono); font-size:1.1rem; font-weight:700; display:block; }
.termi-brand .t span{ font-family:var(--f-mono); font-size:.74rem; color:var(--t3); }
.termi-copy h3{ font-family:var(--f-display); font-weight:500; letter-spacing:.01em; font-size:clamp(1.6rem,2.8vw,2.3rem); line-height:1.14; margin:0; }
.termi-copy h3 em{ font-style:normal; color:var(--t3); }
.termi-copy .lead{ color:var(--t2); margin:18px 0 0; font-size:1.02rem; line-height:1.62; }
.termi-feats{ display:grid; gap:13px; margin:26px 0 30px; }
.termi-feats li{ display:flex; gap:11px; align-items:flex-start; list-style:none; color:var(--t2); font-size:.95rem; line-height:1.55; }
.termi-feats li svg{ width:18px; height:18px; color:var(--t1); flex:none; margin-top:2px; }
.termi-feats li b{ color:var(--t1); font-weight:600; }
.termi-cta{ display:flex; gap:11px; flex-wrap:wrap; }
.termi-visual{ position:relative; display:flex; align-items:center; justify-content:center; min-height:300px; background:#0B0B0D; border-top:1px solid var(--border); overflow:hidden; }
@media(min-width:920px){ .termi-visual{ border-top:none; border-left:1px solid var(--border); } }
.termi-visual .vframe{ position:relative; width:100%; aspect-ratio:16/9; }
.termi-visual video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.termi-visual .scrim{ position:absolute; inset:0; pointer-events:none; background:linear-gradient(0deg,rgba(9,9,11,.22),transparent 30%); }
.termi-visual .tag{ position:absolute; left:14px; bottom:12px; display:flex; align-items:center; gap:8px; font-family:var(--f-mono); font-size:.74rem; color:var(--t1); padding:7px 13px; border-radius:100px; background:rgba(9,9,11,.82); backdrop-filter:blur(8px); border:1px solid var(--border-h); }
.termi-visual .tag .pulse{ width:6px; height:6px; border-radius:50%; background:var(--t1); animation:pulse 2s infinite; }

/* --------------------------- Mission / Vision --------------------------- */
.mv{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.mv-card{ position:relative; border:1px solid var(--border); border-radius:var(--r-xl); padding:clamp(28px,3.6vw,42px); background:var(--bg-c); overflow:hidden; transition:border-color var(--dur); }
.mv-card:hover{ border-color:var(--border-h); }
.mv-card::before{ content:""; position:absolute; left:0; top:clamp(28px,3.6vw,42px); width:3px; height:34px; background:var(--t1); opacity:.85; border-radius:0 3px 3px 0; }
.mv-card.v2::before{ background:var(--t3); }
.mv-card .k{ font-family:var(--f-mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--t3); }
.mv-card h3{ font-family:var(--f-display); font-weight:400; font-size:clamp(1.4rem,2.4vw,1.95rem); line-height:1.24; margin:16px 0 0; color:var(--t1); letter-spacing:.005em; }
.mv-card p{ color:var(--t2); margin:16px 0 0; font-size:1rem; line-height:1.62; }

/* --------------------------------- Values ------------------------------- */
.values{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.value{ display:flex; gap:15px; align-items:flex-start; border:1px solid var(--border); border-radius:var(--r-lg); padding:24px; background:var(--bg-c); transition:transform var(--dur) var(--ease), border-color var(--dur); }
.value:hover{ border-color:var(--border-h); transform:translateY(-2px); }
.value .vi{ width:40px; height:40px; border-radius:10px; flex:none; display:grid; place-items:center; border:1px solid var(--border-h); color:var(--t1); background:var(--bg-s); }
.value .vi svg{ width:19px; height:19px; }
.value h4{ font-family:var(--f-sans); margin:0 0 5px; font-size:1.02rem; font-weight:600; }
.value p{ margin:0; color:var(--t2); font-size:.88rem; line-height:1.55; }

/* --------------------------------- Goals -------------------------------- */
.goals{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.goal{ position:relative; border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; background:var(--bg-c); overflow:hidden; transition:transform var(--dur) var(--ease), border-color var(--dur); }
.goal:hover{ transform:translateY(-2px); border-color:var(--border-h); }
.goal .gv{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; border:1px solid var(--border-h); color:var(--t1); background:var(--bg-s); margin-bottom:16px; }
.goal .gv svg{ width:19px; height:19px; }
.goal .gn{ position:absolute; top:22px; right:24px; font-family:var(--f-mono); font-size:.8rem; color:var(--t4); }
.goal h4{ font-family:var(--f-sans); margin:0 0 8px; font-size:1.12rem; font-weight:600; letter-spacing:-.01em; }
.goal p{ margin:0; color:var(--t2); font-size:.92rem; line-height:1.55; }

/* ------------------------------- Services ------------------------------- */
.services{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }

/* -------------------------------- Founders ------------------------------ */
.founders{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.founder{ display:flex; gap:20px; border:1px solid var(--border); border-radius:var(--r-xl); padding:30px; background:var(--bg-c); transition:transform var(--dur) var(--ease), border-color var(--dur); }
.founder .who{ min-width:0; }
.founder:hover{ border-color:var(--border-h); transform:translateY(-2px); }
.avatar{ width:78px; height:78px; border-radius:18px; flex:none; display:grid; place-items:center; font-family:var(--f-display); font-weight:500; font-size:2rem; color:var(--t1);
  border:1px solid var(--border-h); background:linear-gradient(160deg,var(--bg-e),var(--bg-s)); }
.founder .who h3{ font-family:var(--f-display); margin:0; font-size:1.3rem; font-weight:500; letter-spacing:.01em; }
.founder .who .role{ font-family:var(--f-mono); font-size:.78rem; color:var(--t3); margin-top:5px; letter-spacing:.02em; }
.founder .who p{ color:var(--t2); margin:14px 0 0; font-size:.93rem; line-height:1.6; }
.socials{ display:flex; gap:8px; margin-top:18px; flex-wrap:wrap; }
.socials a{ display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:.78rem; padding:8px 13px; border-radius:8px; border:1px solid var(--border-h); color:var(--t2); transition:var(--dur); }
.socials a:hover{ color:var(--t1); border-color:var(--border-s); background:var(--soft); transform:translateY(-1px); }
.socials a svg{ width:15px; height:15px; }

/* -------------------------------- Contact ------------------------------- */
.contact-card{ position:relative; text-align:center; border:1px solid var(--border-h); border-radius:var(--r-2xl); padding:clamp(44px,6vw,84px) 24px; overflow:hidden; background:var(--bg-s); box-shadow:var(--shadow-lg); }
.contact-card::before{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(560px 280px at 50% -8%, rgba(255,255,255,.05), transparent 62%); }
.contact-card .eyebrow,.contact-card h2,.contact-card p,.contact-cta,.contact-mail{ position:relative; }
.contact-card h2{ font-family:var(--f-display); font-weight:500; letter-spacing:.01em; font-size:clamp(1.9rem,4.2vw,3.1rem); line-height:1.1; margin:22px 0 0; }
.contact-card h2 em{ font-style:normal; color:var(--t3); }
.contact-card p{ color:var(--t2); margin:18px auto 0; max-width:52ch; font-size:1.06rem; line-height:1.6; }
.contact-cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:32px; }
.contact-mail{ margin-top:24px; font-family:var(--f-mono); color:var(--t4); font-size:.88rem; }
.contact-mail a{ color:var(--t1); }

/* -------------------------------- Footer -------------------------------- */
.footer{ border-top:1px solid var(--border); padding:54px 0 40px; }
.footer .top{ display:flex; justify-content:space-between; gap:36px; flex-wrap:wrap; align-items:flex-start; }
.footer .brand{ margin-bottom:14px; }
.footer .brand svg{ width:32px; height:32px; }
.footer .col h5{ font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--t4); margin:0 0 13px; }
.footer .cols{ display:flex; gap:56px; flex-wrap:wrap; }
.footer .col a{ display:block; color:var(--t2); font-size:.9rem; padding:5px 0; transition:color var(--dur); }
.footer .col a:hover{ color:var(--t1); }
.footer .bottom{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-top:44px; padding-top:22px; border-top:1px solid var(--border); color:var(--t4); font-family:var(--f-mono); font-size:.8rem; }
.footer .bottom .made b{ color:var(--t3); font-weight:500; }

/* ------------------------------- Reveal anim ---------------------------- */
[data-reveal]{ opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease); transition-delay:var(--d,0s); }
[data-reveal].in{ opacity:1; transform:none; }

/* ------------------------------- Responsive ----------------------------- */
@media(max-width:1024px){
  .mega{ grid-template-columns:1fr; gap:26px; }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .apps{ grid-template-columns:repeat(2,1fr); }
  .goals{ grid-template-columns:repeat(2,1fr); }
  .b-3,.b-4{ grid-column:span 3; }
}
@media(max-width:760px){
  .nav-links{ display:none; }
  .burger{ display:block; }
  .nav-cta{ display:none; }
  .hero-kpis{ gap:22px; }
  .proof{ grid-template-columns:1fr; }
  .apps{ grid-template-columns:1fr; }
  .mv{ grid-template-columns:1fr; }
  .values,.services{ grid-template-columns:1fr; }
  .goals{ grid-template-columns:1fr; }
  .founders{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
  .b-3,.b-4,.b-6{ grid-column:1/-1; }
  .founder{ flex-direction:column; gap:16px; }
  .trust .wrap{ flex-direction:column; align-items:flex-start; gap:14px; }
}

/* Mobile drawer */
.drawer{ position:fixed; inset:0; z-index:60; background:rgba(9,9,11,.94); backdrop-filter:blur(18px); display:flex; flex-direction:column; padding:88px 28px 28px; gap:4px; transform:translateY(-100%); transition:transform .45s var(--ease); }
.drawer.open{ transform:none; }
.drawer a{ font-family:var(--f-display); padding:16px 8px; font-size:1.3rem; font-weight:500; border-bottom:1px solid var(--border); }
.drawer .close{ position:absolute; top:24px; right:24px; width:42px; height:42px; border:1px solid var(--border-h); border-radius:50%; font-size:1.2rem; color:var(--t1); }

@media(prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  [data-reveal]{ opacity:1; transform:none; }
}
