/* Evoniq shared site styles — used by project pages.
   Preserves the dark cyan/purple identity from the homepage. */

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --bg:       #040d1b;
  --bg2:      #071428;
  --surface:  #0b1929;
  --surface2: #0f2040;
  --cyan:     #00d4ff;
  --purple:   #a855f7;
  --text:     #ffffff;
  --sub:      #7a9ab8;
  --border:   rgba(0,212,255,0.10);
  --glow:     rgba(0,212,255,0.30);
  --glow-p:   rgba(168,85,247,0.25);
  --amber:    #fbbf24;
  --green:    #22c55e;
}

html { scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  overflow-x:hidden;
  min-height:100vh;
  line-height:1.6;
}

img, svg { max-width:100%; height:auto; display:block; }
a { color:var(--cyan); }

/* ── Accessibility ── */
.skip-link {
  position:absolute; left:-9999px; top:0; z-index:10000;
  background:var(--cyan); color:#000; padding:12px 20px;
  font-weight:700; border-radius:0 0 12px 0; text-decoration:none;
}
.skip-link:focus { left:0; }

:focus { outline:none; }
:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:3px;
  border-radius:6px;
}
button:focus-visible, .btn:focus-visible, a.btn:focus-visible {
  box-shadow:0 0 0 3px rgba(0,212,255,.35);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after {
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}

/* ── Nav ── */
.site-nav {
  position:fixed; top:20px; left:50%; transform:translateX(-50%);
  z-index:1000; width:min(96vw, 960px);
  display:flex; align-items:center;
  background:rgba(7,14,35,.72);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  border:1px solid var(--border);
  border-radius:100px;
  padding:10px 10px 10px 24px;
  transition:background .3s, border-color .3s;
}
.site-nav.scrolled { background:rgba(4,13,27,.94); border-color:rgba(0,212,255,.2); }
.nav-logo {
  text-decoration:none; color:#fff; margin-right:auto;
  display:flex; align-items:center; gap:10px; min-width:0;
}
.nav-links { display:flex; gap:2px; list-style:none; margin:0 12px 0 0; padding:0; }
.nav-links a {
  color:var(--sub); font-size:14px; padding:8px 14px;
  border-radius:100px; text-decoration:none; white-space:nowrap;
  transition:color .2s, background .2s;
}
.nav-links a:hover, .nav-links a:focus-visible { color:#fff; background:rgba(255,255,255,.06); }
.nav-cta {
  background:var(--cyan); color:#000; font-weight:700; font-size:13px;
  padding:9px 22px; border-radius:100px; text-decoration:none;
  transition:background .2s, box-shadow .2s; white-space:nowrap;
}
.nav-cta:hover, .nav-cta:focus-visible { background:#fff; box-shadow:0 0 24px var(--glow); }

.evoniq-inline-logo {
  display:block;
  width:clamp(170px, 20vw, 240px);
  height:auto;
  overflow:visible;
}
.nav-logo .evoniq-inline-logo { margin:-18px 0; }
.evoniq-word {
  font-family:'Audiowide','Space Grotesk',sans-serif;
  font-size:31px; font-weight:400; letter-spacing:.045em; fill:#ffffff;
}
.evoniq-iq { fill:var(--cyan); }

@media (max-width:820px) {
  .nav-links { display:none; }
  .site-nav { padding:8px 8px 8px 18px; }
}

/* ── Layout ── */
main { padding-top:120px; }
.container { max-width:1120px; margin:0 auto; padding:0 32px; }
section { padding:80px 0; }
@media (max-width:720px) {
  section { padding:56px 0; }
  .container { padding:0 20px; }
}

/* ── Breadcrumb ── */
.breadcrumb {
  font-size:13px; color:var(--sub);
  margin-bottom:24px;
}
.breadcrumb ol { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:6px; }
.breadcrumb a { color:var(--sub); text-decoration:none; }
.breadcrumb a:hover { color:var(--cyan); }
.breadcrumb li + li::before { content:'›'; margin-right:6px; color:var(--sub); opacity:.7; }
.breadcrumb [aria-current="page"] { color:#e0f0ff; }

/* ── Hero ── */
.project-hero {
  position:relative;
  padding:32px 0 60px;
  border-bottom:1px solid var(--border);
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(0,212,255,.06), transparent 65%),
    linear-gradient(180deg, rgba(4,13,27,.0), rgba(4,13,27,.4));
}
.project-hero::before {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(rgba(0,212,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,212,255,.03) 1px, transparent 1px);
  background-size:64px 64px;
  opacity:.6;
}

.status-pill {
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:6px 14px; border-radius:100px;
  margin-bottom:20px;
}
.status-pill .dot { width:7px; height:7px; border-radius:50%; }
.status-live   { color:var(--green);  background:rgba(34,197,94,.08);  border:1px solid rgba(34,197,94,.28); }
.status-live .dot { background:var(--green); box-shadow:0 0 8px var(--green); }
.status-dev    { color:var(--amber);  background:rgba(251,191,36,.08); border:1px solid rgba(251,191,36,.24); }
.status-dev .dot { background:var(--amber); }
.status-concept{ color:var(--cyan);   background:rgba(0,212,255,.08);  border:1px solid rgba(0,212,255,.24); }
.status-concept .dot { background:var(--cyan); box-shadow:0 0 8px var(--cyan); }
.status-prelaunch { color:var(--purple); background:rgba(168,85,247,.08); border:1px solid rgba(168,85,247,.24); }
.status-prelaunch .dot { background:var(--purple); box-shadow:0 0 8px var(--purple); }

.hero-eyebrow {
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--cyan); margin-bottom:12px;
}
.project-hero h1 {
  font-family:'Space Grotesk','Inter',sans-serif;
  font-size:clamp(40px,6vw,72px);
  font-weight:700; line-height:1.06; letter-spacing:-.025em;
  margin:0 0 20px;
}
.project-hero h1 .accent { color:var(--cyan); text-shadow:0 0 40px rgba(0,212,255,.35); }
.project-hero .lede {
  color:#c9d9e8; font-size:clamp(17px,1.6vw,20px); line-height:1.6;
  max-width:760px;
}
.hero-actions {
  display:flex; flex-wrap:wrap; gap:14px;
  margin-top:32px;
}

.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-size:15px; font-weight:600; text-decoration:none;
  padding:14px 28px; border-radius:100px;
  transition:transform .2s, box-shadow .2s, background .2s, color .2s, border-color .2s;
  border:1.5px solid transparent;
  line-height:1;
}
.btn-primary {
  background:linear-gradient(135deg,var(--cyan),#0077e0);
  color:#001a2b; font-weight:700;
  box-shadow:0 6px 22px rgba(0,212,255,.20);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 14px 34px rgba(0,212,255,.35); color:#001a2b; }
.btn-secondary {
  color:#fff; border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.02);
  backdrop-filter:blur(8px);
}
.btn-secondary:hover { color:var(--cyan); border-color:var(--cyan); transform:translateY(-2px); }

/* ── Section headings ── */
.tag {
  display:inline-flex; align-items:center; gap:9px;
  font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--cyan); margin-bottom:16px;
}
.tag::before { content:''; width:20px; height:1.5px; background:var(--cyan); }

h2.section-h {
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(28px,3.4vw,44px);
  font-weight:700; line-height:1.15; letter-spacing:-.02em;
  margin:0 0 16px;
}
p.section-sub {
  color:var(--sub); font-size:17px; line-height:1.7; max-width:720px;
}

/* ── Content sections ── */
.alt-bg { background:var(--bg2); }
.section-header { margin-bottom:44px; }

/* ── Capability grid ── */
.cap-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
}
.cap {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  padding:26px 26px 28px;
  transition:border-color .3s, transform .3s, box-shadow .3s;
}
.cap:hover {
  border-color:rgba(0,212,255,.28);
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(0,0,0,.4);
}
.cap-icon {
  width:42px; height:42px; border-radius:12px;
  background:rgba(0,212,255,.08);
  border:1px solid rgba(0,212,255,.18);
  display:flex; align-items:center; justify-content:center;
  font-size:20px; margin-bottom:18px;
}
.cap h3 {
  font-family:'Space Grotesk',sans-serif;
  font-size:17px; font-weight:600;
  margin:0 0 8px;
}
.cap p { color:var(--sub); font-size:14px; line-height:1.7; margin:0; }

/* ── Facts / info card ── */
.info-card {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:20px;
  padding:32px;
  position:relative; overflow:hidden;
}
.info-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--cyan), transparent);
}
.info-card h3 {
  font-family:'Space Grotesk',sans-serif;
  font-size:18px; font-weight:700; margin:0 0 16px;
}
.fact-list { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.fact-list li {
  display:grid; grid-template-columns:130px 1fr; gap:14px;
  font-size:14px;
}
.fact-list dt, .fact-list .k {
  color:var(--sub); text-transform:uppercase;
  letter-spacing:.08em; font-size:11px; font-weight:700;
  padding-top:2px;
}
.fact-list dd, .fact-list .v { color:#e6f0f8; margin:0; }

/* ── FAQ (native details/summary) ── */
.faq-list { display:grid; gap:14px; }
.faq-item {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  transition:border-color .3s;
}
.faq-item[open] { border-color:rgba(0,212,255,.28); }
.faq-item > summary {
  list-style:none;
  cursor:pointer;
  padding:22px 26px;
  font-family:'Space Grotesk',sans-serif;
  font-size:17px; font-weight:600;
  color:#e6f0f8;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  user-select:none;
}
.faq-item > summary::-webkit-details-marker { display:none; }
.faq-item > summary::after {
  content:'+';
  color:var(--cyan);
  font-size:22px; font-weight:400; line-height:1;
  transition:transform .25s;
  flex-shrink:0;
}
.faq-item[open] > summary::after { content:'−'; }
.faq-item > summary:focus-visible { outline:2px solid var(--cyan); outline-offset:-4px; }
.faq-body {
  padding:0 26px 24px;
  color:var(--sub);
  font-size:15px; line-height:1.75;
}
.faq-body p + p { margin-top:12px; }

/* ── Small explore/link block ── */
.explore-links {
  display:flex; flex-wrap:wrap; gap:12px;
  margin-top:18px;
}
.explore-links a {
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:600;
  color:#dcecfa; background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);
  padding:8px 16px; border-radius:100px;
  text-decoration:none;
  transition:border-color .2s, color .2s, background .2s;
}
.explore-links a:hover, .explore-links a:focus-visible {
  color:var(--cyan); border-color:rgba(0,212,255,.4);
  background:rgba(0,212,255,.06);
}

/* ── CTA panel ── */
.cta-panel {
  background:
    radial-gradient(circle at 20% 30%, rgba(0,212,255,.10), transparent 55%),
    radial-gradient(circle at 80% 70%, rgba(168,85,247,.08), transparent 55%),
    var(--surface);
  border:1px solid var(--border);
  border-radius:24px;
  padding:44px;
  text-align:center;
}
.cta-panel h2 {
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(24px,2.6vw,32px);
  font-weight:700; margin:0 0 12px;
}
.cta-panel p {
  color:var(--sub); font-size:16px; line-height:1.7;
  max-width:620px; margin:0 auto 28px;
}
.cta-panel .hero-actions { justify-content:center; margin-top:0; }

/* ── Compliance / disclaimer note ── */
.notice {
  background:rgba(168,85,247,.05);
  border:1px solid rgba(168,85,247,.18);
  border-radius:14px;
  padding:18px 22px;
  color:#d9c9f0;
  font-size:14px; line-height:1.6;
}
.notice strong { color:#f1e6ff; }

/* ── Footer ── */
.site-footer {
  background:var(--bg);
  border-top:1px solid var(--border);
  padding:40px 32px 32px;
  margin-top:40px;
}
.foot-inner {
  max-width:1120px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px;
}
.foot-links { display:flex; gap:22px; flex-wrap:wrap; }
.foot-links a { color:var(--sub); font-size:14px; text-decoration:none; }
.foot-links a:hover, .foot-links a:focus-visible { color:#fff; }
.foot-copy {
  max-width:1120px; margin:24px auto 0;
  padding-top:22px; border-top:1px solid var(--border);
  color:var(--sub); font-size:12px; text-align:center;
  line-height:1.7;
}

/* ── Two-column split (used for hero-companion, overview split) ── */
.split {
  display:grid; grid-template-columns:1.4fr 1fr; gap:44px; align-items:start;
}
@media (max-width:900px) { .split { grid-template-columns:1fr; } }

/* ── Nice bulleted list inside prose ── */
.prose h3 { font-family:'Space Grotesk',sans-serif; font-size:20px; margin:24px 0 10px; }
.prose p { color:#c1d0dd; font-size:16px; line-height:1.75; margin:0 0 14px; }
.prose ul { padding-left:22px; margin:0 0 14px; }
.prose ul li { color:#c1d0dd; font-size:15px; line-height:1.7; margin-bottom:6px; }
.prose a { color:var(--cyan); text-decoration:underline; text-underline-offset:3px; }
.prose strong { color:#fff; }

/* ── Investor discovery pages ── */
.investor-hero { padding-bottom:72px; }
.investor-venture-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.investor-venture {
  background:linear-gradient(145deg,rgba(11,25,41,.95),rgba(7,20,40,.86));
  border:1px solid var(--border); border-radius:22px; padding:34px;
  box-shadow:0 22px 70px rgba(0,0,0,.25);
}
.investor-venture h3 { font-family:'Space Grotesk',sans-serif; font-size:28px; margin:8px 0 12px; }
.investor-venture h4 { font-family:'Space Grotesk',sans-serif; font-size:17px; margin:24px 0 10px; }
.investor-venture p, .investor-venture li { color:#c1d0dd; line-height:1.7; }
.investor-venture ul { padding-left:20px; display:grid; gap:6px; }
.investor-venture .hero-actions { margin-top:28px; }
.investor-faq-list { margin-top:36px; }
.investor-disclaimer { margin-top:24px; }
.info-card > p { color:var(--sub); line-height:1.7; }
@media (max-width:820px) {
  .investor-venture-grid { grid-template-columns:1fr; }
  .investor-venture { padding:26px 22px; }
}