/* ═══════════════════════════════════════════
   Insidive.ai — Shared Design System
   ═══════════════════════════════════════════ */

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

/* Language system */
[data-lang="da"] [data-en] { display: none !important; }
[data-lang="en"] [data-da] { display: none !important; }

/* ── Themes ── */
:root {
  --bg:#040408;--bg1:#07070d;--surf:#0d0d18;--surf2:#12121e;
  --bdr:rgba(255,255,255,0.08);--bdr2:rgba(255,255,255,0.04);
  --cyan:#22d3ee;--cyand:rgba(34,211,238,0.12);
  --violet:#a78bfa;--violetd:rgba(167,139,250,0.12);
  --orange:#fb923c;--oranged:rgba(251,146,60,0.12);
  --t1:#f2f2f6;--t2:rgba(242,242,246,0.68);--t3:rgba(242,242,246,0.42);
  --font:'Geist',system-ui,sans-serif;
  --blob-op:1;--dot-c:rgba(255,255,255,0.07);
  --nav-bg:rgba(4,4,8,0.82);--shadow:0 24px 60px rgba(0,0,0,0.55);
  --scan-c:rgba(34,211,238,0.38);
}
[data-theme="light"] {
  --bg:#f3f4f6;--bg1:#ffffff;--surf:#ffffff;--surf2:#f0f1f4;
  --bdr:rgba(0,0,0,0.09);--bdr2:rgba(0,0,0,0.05);
  --cyan:#0891b2;--cyand:rgba(8,145,178,0.10);
  --violet:#7c3aed;--violetd:rgba(124,58,237,0.10);
  --orange:#ea580c;--oranged:rgba(234,88,12,0.10);
  --t1:#0f0f16;--t2:rgba(15,15,22,0.66);--t3:rgba(15,15,22,0.42);
  --blob-op:0.5;--dot-c:rgba(0,0,0,0.07);
  --nav-bg:rgba(243,244,246,0.88);--shadow:0 24px 60px rgba(0,0,0,0.12);
  --scan-c:rgba(8,145,178,0.3);
}

html { scroll-behavior: smooth; }
body {
  background:var(--bg);color:var(--t1);font-family:var(--font);
  font-size:16px;line-height:1.6;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;transition:background 0.4s,color 0.4s;
}

/* ── Atmosphere ── */
.blob { position:fixed;border-radius:50%;pointer-events:none;z-index:0;filter:blur(90px);opacity:var(--blob-op);transition:opacity 0.4s; }
.blob-1 { width:780px;height:780px;background:radial-gradient(circle,rgba(34,211,238,0.10) 0%,transparent 65%);top:-260px;left:-180px;animation:d1 22s ease-in-out infinite; }
.blob-2 { width:580px;height:580px;background:radial-gradient(circle,rgba(167,139,250,0.10) 0%,transparent 65%);top:30%;right:-140px;animation:d2 28s ease-in-out infinite; }
.blob-3 { width:400px;height:400px;background:radial-gradient(circle,rgba(34,211,238,0.06) 0%,transparent 65%);bottom:5%;left:20%;animation:d3 34s ease-in-out infinite; }
@keyframes d1{0%,100%{transform:translate(0,0) scale(1)}30%{transform:translate(60px,80px) scale(1.07)}65%{transform:translate(-40px,110px) scale(0.96)}}
@keyframes d2{0%,100%{transform:translate(0,0)}40%{transform:translate(-80px,-60px)}70%{transform:translate(-25px,70px)}}
@keyframes d3{0%,100%{transform:translate(0,0)}50%{transform:translate(-60px,-40px)}}
body::before {
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(circle,var(--dot-c) 1px,transparent 1px);background-size:28px 28px;
  mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,black 25%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,black 25%,transparent 100%);
  transition:opacity 0.4s;
}
body::after {
  content:'';position:fixed;top:0;left:0;right:0;height:1px;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,var(--scan-c) 30%,rgba(167,139,250,0.4) 70%,transparent 100%);
  transition:background 0.4s;
}

/* ── Layout ── */
.wrap { max-width:1060px;margin:0 auto;padding:0 40px;position:relative;z-index:1; }
main { position:relative;z-index:1; }
section { position:relative;z-index:1; }
.rule { height:1px;background:var(--bdr);position:relative;z-index:1; }

/* ── Nav ── */
nav { position:fixed;top:0;left:0;right:0;z-index:200;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid transparent;transition:background 0.35s,border-color 0.35s,backdrop-filter 0.35s; }
nav.s { background:var(--nav-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:var(--bdr); }
.logo { font-size:17px;font-weight:700;letter-spacing:-0.03em;color:var(--t1);text-decoration:none;display:flex;align-items:baseline;gap:0; }
.logo .logo-suffix { font-weight:400;color:var(--t3);font-size:17px;letter-spacing:-0.03em; }
.nav-r { display:flex;align-items:center;gap:16px; }
.nav-a { font-size:13px;color:var(--t3);text-decoration:none;transition:color 0.2s; }
.nav-a:hover { color:var(--t2); }
.lang-btn { width:32px;height:32px;border-radius:7px;background:transparent;border:1px solid var(--bdr);cursor:pointer;display:grid;place-items:center;font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:0.04em;color:var(--t3);transition:background 0.2s,color 0.2s,border-color 0.2s; }
.lang-btn:hover { background:var(--surf);color:var(--t2); }
.theme-btn { width:32px;height:32px;border-radius:999px;background:var(--surf);border:1px solid var(--bdr);cursor:pointer;display:grid;place-items:center;color:var(--t2);box-shadow:inset 0 0 0 1px var(--bdr2);transition:background 0.2s,color 0.2s,border-color 0.2s,transform 0.2s; }
.theme-btn:hover { background:var(--surf2);color:var(--t1);transform:translateY(-1px); }
.theme-btn svg { width:14px;height:14px; }
.btn-cta { font-family:var(--font);font-size:13px;font-weight:500;color:var(--bg);background:var(--t1);border:none;padding:8px 18px;border-radius:6px;cursor:pointer;text-decoration:none;letter-spacing:-0.01em;transition:opacity 0.2s,background 0.4s,color 0.4s; }
.btn-cta:hover { opacity:0.82; }

/* ── Buttons ── */
.btn-p { font-family:var(--font);font-size:13px;font-weight:500;color:#000;background:var(--cyan);border:none;padding:11px 22px;border-radius:6px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;transition:box-shadow 0.3s,opacity 0.2s,background 0.4s; }
.btn-p:hover { box-shadow:0 0 28px rgba(34,211,238,0.35);opacity:0.9; }
.btn-p svg { transition:transform 0.2s; }
.btn-p:hover svg { transform:translateX(3px); }
.btn-g { font-family:var(--font);font-size:13px;font-weight:400;color:var(--t2);background:transparent;border:1px solid var(--bdr);padding:11px 22px;border-radius:6px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;transition:color 0.2s,border-color 0.2s; }
.btn-g:hover { color:var(--t1);border-color:rgba(255,255,255,0.18); }
[data-theme="light"] .btn-g:hover { border-color:rgba(0,0,0,0.18); }

/* ── Animations ── */
@keyframes up { to { opacity:1;transform:translateY(0); } }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.2} }

/* ── Shared section elements ── */
.stag { font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--t3);display:flex;align-items:center;gap:10px;margin-bottom:22px;transition:color 0.4s; }
.stag::before { content:'';display:block;width:18px;height:1px;background:currentColor; }
.r { opacity:0;transform:translateY(18px);transition:opacity 0.65s cubic-bezier(.16,1,.3,1),transform 0.65s cubic-bezier(.16,1,.3,1); }
.r.v { opacity:1;transform:translateY(0); }
.d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s}

/* ── Hero (shared) ── */
.eyebrow { display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--cyan);margin-bottom:32px;opacity:0;transform:translateY(10px);animation:up 0.7s 0.1s forwards;transition:color 0.4s; }
.ep { width:4px;height:4px;border-radius:50%;background:var(--cyan);box-shadow:0 0 6px var(--cyan);animation:blink 2.5s ease-in-out infinite;transition:background 0.4s,box-shadow 0.4s; }
h1 { font-size:clamp(34px,4.5vw,58px);font-weight:700;line-height:1.08;letter-spacing:-0.04em;margin-bottom:22px;opacity:0;transform:translateY(14px);animation:up 0.85s 0.25s forwards; }
h1 em { font-style:normal;background:linear-gradient(115deg,var(--cyan) 0%,var(--violet) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:filter 0.4s; }
.hero-sub { font-size:clamp(15px,1.7vw,17px);font-weight:300;color:var(--t2);max-width:520px;margin:0 auto;line-height:1.74;opacity:0;transform:translateY(12px);animation:up 0.8s 0.4s forwards; }
.hero-actions { display:flex;gap:10px;align-items:center;justify-content:center;opacity:0;transform:translateY(12px);animation:up 0.8s 0.64s forwards; }

/* ── Platform grid (shared) ── */
.plat-head { margin-bottom:52px; }
.plat-head h2 { font-size:clamp(26px,3.2vw,44px);font-weight:700;letter-spacing:-0.035em;margin-bottom:14px; }
.plat-head p { font-size:15px;font-weight:300;color:var(--t2);max-width:480px;line-height:1.72;transition:color 0.4s; }
.plat-cols { display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bdr);border:1px solid var(--bdr);border-radius:10px;overflow:hidden;transition:background 0.4s,border-color 0.4s; }
.pc { background:var(--bg1);padding:26px 24px;transition:background 0.3s;position:relative; }
.pc::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,var(--glow,transparent) 0%,transparent 60%);opacity:0;transition:opacity 0.4s;pointer-events:none; }
.pc:hover { background:var(--surf); }
.pc:hover::before { opacity:1; }
.pc-s { --glow:rgba(34,211,238,0.07); }
.pc-p { --glow:rgba(167,139,250,0.07); }
.pc-e { --glow:rgba(251,146,60,0.07); }
.pc-intel { grid-column:1 / -1;--glow:rgba(251,146,60,0.04); }
.intel-features { display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px; }
.pc-label { font-size:10px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:18px;display:flex;align-items:center;gap:7px; }
.pc-dot { width:5px;height:5px;border-radius:50%; }
.pc-dot.c { background:var(--cyan);box-shadow:0 0 5px var(--cyan); }
.pc-dot.vl { background:var(--violet);box-shadow:0 0 5px var(--violet); }
.pc-dot.o { background:var(--orange);box-shadow:0 0 5px var(--orange); }
.lc{color:var(--cyan)} .lv{color:var(--violet)} .lo{color:var(--orange)}
.pf { padding:9px 10px;border-radius:6px;transition:background 0.2s; }
.pf:hover { background:rgba(255,255,255,0.04); }
[data-theme="light"] .pf:hover { background:rgba(0,0,0,0.04); }
.pf-name { font-size:13px;font-weight:500;color:var(--t1);margin-bottom:2px;transition:color 0.4s; }
.pf-desc { font-size:11.5px;font-weight:300;color:var(--t3);line-height:1.48;transition:color 0.4s; }
.pc-note { margin-top:16px;font-size:11.5px;color:var(--t3);line-height:1.52;transition:color 0.4s; }

/* ── Flow bar (integrated into grid) ── */
.flow-bar { grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bg1);position:relative; }
.fb { display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 24px;background:var(--bg1);cursor:default;transition:background 0.3s; }
.fb-dot { width:8px;height:8px;border-radius:2px;background:var(--t3);transition:background 0.4s,box-shadow 0.4s; }
.fb-label { font-size:11px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--t3);white-space:nowrap;transition:color 0.4s; }
.fb.active .fb-dot { box-shadow:0 0 8px var(--cyan); }
.fb.active .fb-label { color:var(--cyan); }
.fb.active.phase-s .fb-dot { background:var(--cyan); }
.fb.active.phase-p .fb-dot { background:var(--violet); }
.fb.active.phase-e .fb-dot { background:var(--orange); }
.fb.active.phase-s .fb-label { color:var(--cyan); }
.fb.active.phase-p .fb-label { color:var(--violet); }
.fb.active.phase-p .fb-dot { box-shadow:0 0 8px var(--violet); }
.fb.active.phase-e .fb-label { color:var(--orange); }
.fb.active.phase-e .fb-dot { box-shadow:0 0 8px var(--orange); }
/* Progress line across the bar */
.flow-bar::after { content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--bdr); }
.flow-progress { position:absolute;bottom:0;left:0;height:2px;background:linear-gradient(90deg,var(--cyan),var(--violet),var(--orange));transition:width 0.6s ease;z-index:1; }

/* ── CTA section ── */
.cta-email { font-size:14px;color:var(--t3);margin-top:20px; }
.cta-email a { color:var(--t2);text-decoration:none;transition:color 0.2s; }
.cta-email a:hover { color:var(--t1); }
/* ── Footer glow ── */
footer { position:relative; }
footer::before { content:'';position:absolute;top:-180px;left:50%;transform:translateX(-50%);width:120%;max-width:1400px;height:400px;pointer-events:none;background:radial-gradient(ellipse 70% 100% at 50% 100%,rgba(34,211,238,0.06) 0%,rgba(167,139,250,0.03) 50%,transparent 80%);z-index:0; }

/* ── Footer ── */
footer { border-top:1px solid var(--bdr);padding:26px 40px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1;transition:border-color 0.4s; }
.foot-left { display:flex;flex-direction:column;gap:2px; }
.foot-logo { font-size:13px;font-weight:500;color:var(--t3);transition:color 0.4s; }
.foot-tagline { font-size:11px;color:var(--t3);opacity:0.6; }
.foot-links { display:flex;gap:20px; }
.foot-links a { font-size:12px;color:var(--t3);text-decoration:none;transition:color 0.2s; }
.foot-links a:hover { color:var(--t2); }
.foot-copy { font-size:12px;color:var(--t3); }

/* ── Responsive (shared) ── */
@media(max-width:860px) {
  .plat-cols { grid-template-columns:1fr; }
  .pc-intel { grid-column:1; }
  .intel-features { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  nav { padding:0 20px; }
  .nav-a { display:none; }
  .wrap { padding:0 20px; }
  footer { flex-direction:column;gap:10px;text-align:center;padding:24px 20px; }
  .foot-links { flex-wrap:wrap;justify-content:center; }
}