:root{
	--obsidian:#0a0c14;
	--obsidian-2:#0e1220;
	--obsidian-3:#131828;
	--parchment:#e8eeff;
	--parchment-2:#c8d4f8;
	--amber:#2761d3;
	--amber-2:#4d84e8;
	--amber-deep:#1a3d8a;
	--cyan:#18c4d3;
	--cyan-dim:#0f8a96;
	--crimson:#c13b3b;
	--line:rgba(39,97,211,.18);
	--line-2:rgba(39,97,211,.32);




	--blue: #0B6EF3;
	--blue-light: #3d8fff;
	--yellow: #FFD500;
	--bg-light: #F8FAFF;
	--bg-dark: #0E1A2B;
	--bg-dark-2: #0a1421;
	--bg-card-dark: rgba(14, 26, 43, 0.9);
	--bg-card-light: #ffffff;

	--text-primary-dark: #e8f0fe;
	--text-secondary-dark: #8ca0bc;


	--bg: var(--bg-dark);
	--bg2: var(--bg-dark-2);
	--bg-card: var(--bg-card-dark);
	--text: var(--text-primary-dark);
	--text-sub: var(--text-secondary-dark);
	--border: var(--border-dark);
	--nav-bg: rgba(14, 26, 43, 0.72);
	--section-alt: #0a1421;

	--border-dark: rgba(255, 255, 255, 0.08);
	--border-light: rgba(0, 0, 0, 0.08);

	--surface-dark: #0D1E35;     /* slightly lighter content bg */
	--surface-dark-2: #102040;
	--surface-dark-3: #152850;
	--text-muted: #6080A0;
	--border-color: rgba(30, 136, 229, 0.15);

}

[data-theme="light"] {
	--bg: var(--bg-light);
	--bg2: #eef3ff;
	--bg-card: var(--bg-card-light);
	--text: var(--text-primary-light);
	--text-sub: var(--text-secondary-light);
	--border: var(--border-light);
	--nav-bg: rgba(248, 250, 255, 0.82);
	--section-alt: #f0f4ff;

	--surface-dark: #FFFFFF;
	--surface-dark-2: #E8F0FE;
	--surface-dark-3: #D8E8FF;
	
	--text-muted: #445F80;
	--border-color: rgba(21, 101, 192, 0.12);
}


html.light-theme{
	--obsidian:#f0f4ff;
	--obsidian-2:#e4eaff;
	--obsidian-3:#d8e0ff;
	--parchment:#1a2040;
	--parchment-2:#2a3060;
	--amber:#2761d3;
	--amber-2:#1a4daa;
	--amber-deep:#0d2d6e;
	--cyan:#18c4d3;
	--cyan-dim:#0f8a96;
	--crimson:#c13b3b;
	--line:rgba(39,97,211,.15);
	--line-2:rgba(39,97,211,.28);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
	font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
	background:var(--obsidian);
	color:var(--parchment);
	line-height:1.6;
	overflow-x:hidden;
	-webkit-font-smoothing:antialiased;
}

/* ---------- Grain overlay ---------- */
body::before{
	content:"";
	position:fixed; inset:0;
	pointer-events:none;
	background-image:
		radial-gradient(circle at 20% 10%, rgba(39,97,211,.08), transparent 40%),
		radial-gradient(circle at 80% 80%, rgba(24,196,211,.05), transparent 40%);
	z-index:0;
}
body::after{
	content:"";
	position:fixed; inset:0;
	pointer-events:none;
	background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.7 0 0 0 0 0.8 0 0 0 0 0.95 0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	opacity:.6;
	mix-blend-mode:overlay;
	z-index:1;
}

.wrap{max-width:1320px; margin:0 auto; padding:0 2rem; position:relative; z-index:2}

/* ---------- Nav ---------- */
nav{
	position:absolute; top:0; left:0; right:0;
	z-index:100;
	padding:1.1rem 0;
	/* background:rgba(10,12,20,.15);
	backdrop-filter:blur(18px) saturate(140%);
	-webkit-backdrop-filter:blur(18px) saturate(140%); */
	/* border-bottom:1px solid var(--line); */
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; max-width:1320px; margin:0 auto; padding:0 2rem}
.logo{display:flex; align-items:center; gap:.7rem; font-family:'Plus Jakarta Sans',sans-serif; font-weight:700; font-size:1.3rem; letter-spacing:-.03em}
.logo-mark{
	width:36px; height:36px;
	display:flex; align-items:center; justify-content:center;
	background:linear-gradient(135deg, var(--amber), var(--amber-deep));
	border-radius:8px;
	box-shadow:0 0 20px rgba(39,97,211,.45), inset 0 1px 0 rgba(255,255,255,.2);
	position:relative;
}
.logo-mark svg{width:22px; height:22px; fill:var(--obsidian)}
.logo-text b{font-weight:700; color:var(--parchment)}
.logo-text i{font-style:italic; color:var(--amber-2); font-weight:500; margin-left:.15rem}
.nav-links{display:flex; gap:2.2rem; align-items:center}
.nav-links a{color:var(--parchment); text-decoration:none; font-size:.92rem; font-weight:400; opacity:.78; transition:opacity .2s, color .2s}
.nav-links a:hover{opacity:1; color:var(--amber-2)}
.nav-cta{
	padding:.62rem 1.25rem;
	background:var(--amber);
	color: #ffffff !important;
	border-radius:2px;
	font-weight:600 !important;
	opacity:1 !important;
	transition:transform .2s, box-shadow .2s;
	font-size:.88rem !important;
}
.nav-cta:hover{transform:translateY(-1px); box-shadow:0 8px 24px rgba(39,97,211,.4); color:var(--obsidian) !important}

@media (max-width:780px){ .nav-links a:not(.nav-cta){display:none} }

/* ---------- Theme Toggle ---------- */
.theme-toggle{
	display:flex; align-items:center; justify-content:center;
	width:38px; height:38px;
	background:rgba(255,255,255,.06);
	border:1px solid var(--line-2);
	border-radius:8px;
	cursor:pointer;
	transition:all .25s cubic-bezier(.2,.8,.2,1);
	flex-shrink:0;
	margin-left:.5rem;
}
.theme-toggle:hover{
	background:rgba(39,97,211,.18);
	border-color:var(--amber-2);
	transform:scale(1.05);
	box-shadow:0 0 16px rgba(39,97,211,.25);
}
.theme-toggle svg{
	width:18px; height:18px;
	stroke:var(--parchment);
	fill:none;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round;
	transition:all .3s;
}
.theme-toggle .icon-moon{ display:block }
.theme-toggle .icon-sun{ display:none }
html.light-theme .theme-toggle .icon-moon{ display:none }
html.light-theme .theme-toggle .icon-sun{ display:block }
html.light-theme nav{
	background:rgba(240,244,255,.92);
	border-bottom-color:rgba(39,97,211,.2);
}
html.light-theme .theme-toggle{
	background:rgba(39,97,211,.08);
}
html.light-theme .logo-mark svg{ fill:#ffffff }
html.light-theme .nav-links a{ color:var(--parchment) }

/* ---------- Hero ---------- */
.hero{
	min-height:100vh;
	padding:10rem 0 6rem;
	position:relative;
	display:flex;
	align-items:center;
	overflow:hidden;
}
.hero-grid{
	position:absolute; inset:0;
	background-image:
		linear-gradient(var(--line) 1px, transparent 1px),
		linear-gradient(90deg, var(--line) 1px, transparent 1px);
	background-size:80px 80px;
	mask-image:radial-gradient(ellipse at center, black 20%, transparent 70%);
	-webkit-mask-image:radial-gradient(ellipse at center, black 20%, transparent 70%);
	opacity:.5;
}
.hero-inner{position:relative; z-index:2; width:100%; display:grid; grid-template-columns:1.15fr 1fr; gap:5rem; align-items:center}
@media(max-width:1020px){ .hero-inner{grid-template-columns:1fr; gap:3rem} }

.hero-tag{
	display:inline-flex; align-items:center; gap:.55rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.72rem;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--amber-2);
	padding:.45rem .9rem;
	border:1px solid rgba(39,97,211,.35);
	border-radius:2px;
	background:rgba(39,97,211,.06);
	margin-bottom:2rem;
}
.hero-tag::before{content:""; width:6px; height:6px; background:var(--amber-2); border-radius:50%; box-shadow:0 0 12px var(--amber-2); animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

.hero h1{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-weight:800;
	font-size:clamp(2.8rem, 6.5vw, 3.6rem);
	line-height:.98;
	letter-spacing:-.02em;
	margin-bottom:1.8rem;
}
.hero h1 .serif-italic{ color:var(--blue); font-weight:700}
.hero h1 .underline-mark{
	position:relative; display:inline-block;
}
.hero h1 .underline-mark::after{
	content:""; position:absolute; left:0; right:0; bottom:.08em; height:.12em;
	background:var(--amber);
	transform:scaleX(0); transform-origin:left;
	animation:drawLine 1.2s .5s forwards cubic-bezier(.2,.8,.2,1);
}
@keyframes drawLine{to{transform:scaleX(1)}}

.light-theme .hero p.lede{
	color: var(--parchment);
}
.hero p.lede{
	font-size:1.22rem;
	color:rgba(232,238,255,.72);
	max-width:560px;
	margin-bottom:2.8rem;
	font-weight:300;
}
.hero p.lede b{font-weight:500; color:var(--parchment)}


.hero-ctas{display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:3rem}
.btn{
	/* display:inline-flex;  */
	align-items:center; gap:.6rem;
	padding:1rem 1.8rem;
	font-size:.95rem;
	font-weight:500;
	text-decoration:none;
	border-radius:2px;
	transition:all .22s cubic-bezier(.2,.8,.2,1);
	cursor:pointer;
	border:none;
	font-family:inherit;
}
.btn-primary{
	background:var(--amber);
	color:#ffffff;
	box-shadow:0 0 0 1px var(--amber), 0 10px 30px rgba(39,97,211,.22);
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 0 0 1px var(--amber-2), 0 14px 40px rgba(39,97,211,.4)}
.btn-ghost{
	background:transparent;
	color:var(--parchment);
	border:1px solid var(--line-2);
}
.btn-ghost:hover{border-color:var(--amber-2); color:var(--amber-2)}
.btn .arrow{transition:transform .22s}
.btn:hover .arrow{transform:translateX(4px)}

.hero-meta{
	display:flex; gap:2.5rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.78rem;
	color:rgba(232,238,255,.5);
	text-transform:uppercase;
	/* letter-spacing:.12em; */
	border-top:1px solid var(--line);
	padding-top:1.5rem;
	flex-wrap:wrap;
	text-align: center;
}
.light-theme .hero-meta{ color: var(--parchment) }
.hero-meta span strong{color:var(--blue); font-weight:800; display:block; font-size:2.4rem; font-family:'Plus Jakarta Sans',sans-serif;  letter-spacing:-.02em; margin-bottom:.1rem}

.hero-meta span {
	flex: 1 0 0;
}

.no-before::before{
	display: none;
}
/* ---------- Hero visual: Garuda + telemetry ---------- */
.hero-visual{
	position:relative;
	aspect-ratio:1/1.05;
	max-width:520px;
	margin:0 auto;
	width:100%;
	top: 4rem;
}
.garuda-frame{
	position:absolute; inset:0;
	border:1px solid var(--line-2);
	border-radius:4px;
	overflow:hidden;
	background:
		radial-gradient(ellipse at 50% 40%, rgba(39,97,211,.12), transparent 60%),
		linear-gradient(180deg, var(--obsidian-2), var(--obsidian));
}
.garuda-frame::before{
	content:"GARUD.OBS";
	position:absolute;
	top:1rem; left:1rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.65rem;
	letter-spacing:.25em;
	color:var(--amber-2);
	opacity:.7;
}
.garuda-frame::after{
	content:"● LIVE";
	position:absolute;
	top:1rem; right:1rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.65rem;
	letter-spacing:.15em;
	color:var(--cyan);
	opacity:.8;
}
.garuda-svg{position:absolute; inset:0; width:100%; height:100%}

/* animated trace lines in hero viz */
.trace{
	stroke:var(--cyan);
	stroke-width:1;
	fill:none;
	stroke-dasharray:4 200;
	animation:traceFlow 6s linear infinite;
	opacity:.55;
}
.trace.t2{animation-delay:-2s; stroke:var(--amber-2)}
.trace.t3{animation-delay:-4s; stroke:var(--cyan)}
@keyframes traceFlow{to{stroke-dashoffset:-400}}

.ping{
	fill:var(--amber-2);
	animation:ping 3s ease-in-out infinite;
}
.ping.p2{animation-delay:.7s; fill:var(--cyan)}
.ping.p3{animation-delay:1.6s; fill:var(--amber-2)}
.ping.p4{animation-delay:2.2s; fill:var(--cyan)}
@keyframes ping{0%,100%{opacity:.3; r:2}50%{opacity:1; r:4}}

.hud-corner{position:absolute; width:18px; height:18px; border:1px solid var(--amber-2)}
.hud-corner.tl{top:8px; left:8px; border-right:none; border-bottom:none}
.hud-corner.tr{top:8px; right:8px; border-left:none; border-bottom:none}
.hud-corner.bl{bottom:8px; left:8px; border-right:none; border-top:none}
.hud-corner.br{bottom:8px; right:8px; border-left:none; border-top:none}

/* telemetry readout */
.telemetry{
	position:absolute;
	bottom:1rem; left:1rem; right:1rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.65rem;
	color:rgba(232,238,255,.55);
	line-height:1.8;
}
.telemetry .row{display:flex; justify-content:space-between; border-top:1px dashed var(--line)}
.telemetry .row:first-child{border:none}
.telemetry .val{color:var(--amber-2)}
.telemetry .val.ok{color:var(--cyan)}

/* ---------- Marquee (logos / phrases) ---------- */
.marquee{
	border-top:1px solid var(--line);
	border-bottom:1px solid var(--line);
	background:var(--obsidian-2);
	padding:1.4rem 0;
	overflow:hidden;
	position:relative;
	z-index:2;
}
.marquee-track{
	display:flex; gap:4rem;
	animation:marquee 45s linear infinite;
	width:max-content;
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.15rem;
	font-style:italic;
	color:rgba(232,238,255,.4);
	white-space:nowrap;
}
.light-theme .marquee-track{ color: var(--parchment) }
.marquee-track span{display:inline-flex; align-items:center; gap:4rem}
.marquee-track span::after{content:"◆"; color:var(--amber); font-style:normal; font-size:.7rem}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- Section chrome ---------- */
section{padding:7rem 0; position:relative; z-index:2}
.eyebrow{
	font-family:'JetBrains Mono',monospace;
	font-size:.72rem;
	letter-spacing:.22em;
	text-transform:uppercase;
	color:var(--amber-2);
	margin-bottom:1.2rem;
	display:inline-block;
}
.eyebrow::before{content:"— "; opacity:.6}
.section-title{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-weight:800;
	font-size:clamp(2.2rem,4.2vw,3.8rem);
	line-height:1.05;
	letter-spacing:-.035em;
	margin-bottom:1.2rem;
	max-width:800px;
}
.section-title i{font-style:normal; color:var(--amber-2)}
.section-sub{
	font-size:1.1rem;
	color:rgba(232,238,255,.65);
	max-width:640px;
	font-weight:300;
	margin-bottom:3.5rem;
}
.light-theme .section-sub{ color: var(--parchment) }

/* ---------- Problem (The Case Against Lock-in) ---------- */
.problem{
	background:var(--obsidian-2);
	border-top:1px solid var(--line);
	border-bottom:1px solid var(--line);
}
.compare{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:2px;
	background:var(--line);
	border:1px solid var(--line);
}
@media(max-width:780px){ .compare{grid-template-columns:1fr} }
.compare-col{padding:3rem 2.5rem; background:var(--obsidian-2)}
.compare-col.them{background:var(--obsidian-3)}
.compare-col.us{background:linear-gradient(180deg, rgba(39,97,211,.08), var(--obsidian-2))}
.compare-label{
	font-family:'JetBrains Mono',monospace;
	font-size:.72rem; letter-spacing:.2em;
	text-transform:uppercase;
	margin-bottom:1.5rem;
	display:flex; align-items:center; gap:.6rem;
}
.compare-col.them .compare-label{color:rgba(232,238,255,.5)}
.compare-col.us .compare-label{color:var(--amber-2)}
.compare h3{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.8rem;
	font-weight:700;
	line-height:1.2;
	margin-bottom:1.5rem;
	letter-spacing:-.03em;
}
.compare-col.them h3{color:rgba(232,238,255,.6)}
.compare ul{list-style:none}
.compare li{
	padding:.9rem 0;
	border-bottom:1px solid var(--line);
	display:flex; align-items:flex-start; gap:.8rem;
	font-size:.96rem;
}
.compare li:last-child{border-bottom:none}
.compare-col.them li{color:rgba(232,238,255,.55)}
.compare-col.them li::before{content:"✕"; color:var(--crimson); font-weight:700; flex-shrink:0}
.compare-col.us li::before{content:"◆"; color:var(--amber-2); flex-shrink:0; font-size:.7rem; margin-top:.45rem}

/* ---------- Capabilities grid ---------- */
.caps-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:1px;
	background:var(--line);
	border:1px solid var(--line);
}
@media(max-width:980px){ .caps-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:620px){ .caps-grid{grid-template-columns:1fr} }
.cap{
	background:var(--obsidian-2);
	padding:2.2rem 2rem;
	transition:background .3s;
	position:relative;
	cursor:default;
}
.cap:hover{background:var(--obsidian-3)}
.cap:hover .cap-num{color:var(--amber-2)}
.cap-num{
	font-family:'JetBrains Mono',monospace;
	font-size:1rem;
	color:rgba(232,238,255,.35);
	/* letter-spacing:.1em; */
	transition:color .3s;
	display:block;
	margin-bottom:1rem;
}
.light-theme .cap-num{ color: var(--parchment) }
.cap-icon{
	width:46px; height:46px;
	display:flex; align-items:center; justify-content:center;
	background:rgba(39,97,211,.08);
	border:1px solid rgba(39,97,211,.25);
	border-radius:3px;
	margin-bottom:1.3rem;
}
.cap-icon svg{width:22px; height:22px; stroke:var(--amber-2); fill:none; stroke-width:1.5}
.cap h4{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.35rem;
	font-weight:700;
	line-height:1.25;
	margin-bottom:.7rem;
	letter-spacing:-.02em;
}
.cap h4 i{color:var(--amber-2); font-style:italic; font-weight:400}
.cap p{
	font-size:.92rem;
	color:rgba(232,238,255,.6);
	line-height:1.55;
}
.light-theme .cap p{ color: var(--parchment-2) }
.cap .count{
	font-family:'JetBrains Mono',monospace;
	font-size:.7rem;
	color:var(--cyan);
	letter-spacing:.15em;
	margin-top:1rem;
	display:block;
}

/* ---------- Feature matrix ---------- */
.matrix-section{background:var(--obsidian-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.matrix{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2rem}
@media(max-width:980px){ .matrix{grid-template-columns:repeat(2,1fr)} }
@media(max-width:520px){ .matrix{grid-template-columns:1fr} }
.mtile{
	border:1px solid var(--line);
	padding:1.2rem 1.3rem;
	background:var(--obsidian);
	transition:border-color .25s, transform .25s;
}
.mtile:hover{border-color:var(--amber-2); transform:translateY(-2px)}
.mtile-num{
	font-family:'JetBrains Mono',monospace;
	font-size:.7rem;
	color:var(--amber-2);
	letter-spacing:.12em;
	display:block;
	margin-bottom:.4rem;
}
.mtile-name{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.05rem;
	font-weight:600;
	line-height:1.25;
}

/* ---------- Differentiators / Pillars ---------- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--line)}
@media(max-width:820px){ .pillars{grid-template-columns:1fr} }
.pillar{
	padding:3rem 2.5rem;
	border-right:1px solid var(--line);
	border-bottom:1px solid var(--line);
	position:relative;
	overflow:hidden;
}
/* .pillar:nth-child(2n){border-right:none} */
/* .pillar:nth-last-child(-n+2){border-bottom:none} */
@media(max-width:820px){ .pillar{border-right:none !important} .pillar:nth-last-child(-n+2){border-bottom:1px solid var(--line)} .pillar:last-child{border-bottom:none} }
.pillar-num{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-style:italic;
	font-size:3.5rem;
	color:rgba(39,97,211,.22);
	position:absolute;
	top:1rem; right:1.5rem;
	line-height:1;
	font-weight:800;
}
.pillar h3{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.7rem;
	font-weight:700;
	line-height:1.2;
	margin-bottom:1rem;
	letter-spacing:-.025em;
}
.pillar h3 i{color:var(--amber-2); font-style:italic}
.pillar p{
	color:rgba(232,238,255,.65);
	font-size:.98rem;
	line-height:1.6;
}
.light-theme .pillar p{ color: var(--parchment-2) }

/* ---------- Big quote / anthem ---------- */
.anthem{
	padding:9rem 0;
	text-align:center;
	position:relative;
}
.anthem::before{
	content:"❝";
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:10rem;
	color:rgba(39,97,211,.12);
	position:absolute;
	top:2rem; left:50%; transform:translateX(-50%);
	line-height:1;
}
.anthem-text {
	font-family: 'Plus Jakarta Sans',sans-serif;
	font-size: clamp(1.8rem,4vw,2.4rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.015em;
	max-width: 900px;
	margin: 0 auto 2rem;
	position: relative;
	z-index: 2;
}
.anthem-text i{font-style:italic; color:var(--amber-2)}
.anthem-attr {
	font-family: 'JetBrains Mono',monospace;
	font-size: 1rem;
	letter-spacing: .1em;
	color: rgba(232,238,255,.45);
	text-transform: uppercase;
}
.light-theme .anthem-attr{ color: var(--parchment) }

/* ---------- Timeline / launch ---------- */
.timeline-section{
	background:var(--obsidian-2); 
	/* border-top:1px solid var(--line); 
	border-bottom:1px solid var(--line); */
}
.timeline{
	position:relative;
	padding-left:2.5rem;
	margin-top:2rem;
}
.timeline::before{
	content:""; position:absolute; left:.9rem; top:.5rem; bottom:.5rem;
	width:1px; background:linear-gradient(180deg, var(--amber-2), transparent);
}
.tl-item{
	position:relative;
	padding:1.5rem 0 2rem;
	border-bottom:1px dashed var(--line);
}
.tl-item:last-child{border-bottom:none}
.tl-item::before{
	content:""; position:absolute; left:-2.1rem; top:2rem;
	width:14px; height:14px;
	border-radius:50%;
	background:var(--obsidian);
	border:2px solid var(--amber-2);
	box-shadow:0 0 0 4px var(--obsidian-2), 0 0 12px rgba(39,97,211,.6);
}
.tl-item.future::before{border-color:rgba(232,238,255,.3); box-shadow:0 0 0 4px var(--obsidian-2)}
.light-theme .tl-item.future::before{ border-color: var(--line-2) }
.tl-date {
	font-family: 'JetBrains Mono',monospace;
	font-size: 1rem;
	letter-spacing: .1em;
	color: var(--amber-2);
	display: block;
	margin-bottom: .4rem;
}
.tl-item.future .tl-date{color:rgba(232,238,255,.45)}
.light-theme .tl-item.future .tl-date{ color: var(--line-2) }
.tl-item h4{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-size:1.45rem;
	font-weight:700;
	line-height:1.25;
	margin-bottom:.4rem;
}
.tl-item p{color:rgba(232,238,255,.6); font-size:.95rem}
.light-theme .tl-item p{ color: var(--parchment-2) }

/* ---------- CTA band ---------- */
.cta-band{
	padding:7rem 0;
	background:
		radial-gradient(ellipse at center, rgba(39,97,211,.14), transparent 70%),
		linear-gradient(180deg, var(--obsidian-2), var(--obsidian));
	border-top:1px solid var(--line);
	position:relative;
	overflow:hidden;
}
.cta-band::before, .cta-band::after{
	content:"";
	position:absolute;
	width:600px; height:600px;
	border-radius:50%;
	background:radial-gradient(circle, rgba(39,97,211,.12), transparent 60%);
	filter:blur(40px);
}
.cta-band::before{top:-200px; left:-200px}
.cta-band::after{bottom:-200px; right:-200px}
.cta-inner{text-align:center; position:relative; z-index:2}
.cta-band h2{
	font-family:'Plus Jakarta Sans',sans-serif;
	font-weight:800;
	font-size:clamp(2.4rem,5vw,4.2rem);
	line-height:1.05;
	letter-spacing:-.04em;
	margin-bottom:1.2rem;
	max-width:900px;
	margin-left:auto; margin-right:auto;
}
.cta-band h2 i{font-style:italic; color:var(--amber-2)}
.cta-band p{color:rgba(232,238,255,.65); font-size:1.15rem; max-width:560px; margin:0 auto 2.5rem; font-weight:300}
.light-theme .cta-band p{ color: var(--parchment) }
.cta-row{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap}

/* ---------- Footer ---------- */
footer{
	padding:4rem 0 2rem;
	background: #0a0c14;
	border-top:1px solid var(--line);
	position:relative; z-index:2;
}
.foot-grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3rem}
@media(max-width:820px){ .foot-grid{grid-template-columns:1fr 1fr; gap:2rem} }
@media(max-width:520px){ .foot-grid{grid-template-columns:1fr} }
.foot-col h5{
	font-family:'JetBrains Mono',monospace;
	font-size:.72rem;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--amber-2);
	margin-bottom:1.2rem;
}
.foot-col ul{list-style:none}
.foot-col li{margin-bottom:.6rem}
.foot-col a{color:rgba(232,238,255,.6); text-decoration:none; font-size:.92rem; transition:color .2s}
.foot-col a:hover{color:var(--amber-2)}
.foot-about p{color:rgba(232,238,255,.55); font-size:.92rem; margin-top:1rem; max-width:360px}
.foot-bottom{
	margin-top: 3rem;
	padding-top:2rem;
	border-top:1px solid var(--line);
	display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
	font-family:'JetBrains Mono',monospace;
	font-size:.72rem;
	color:rgba(232,238,255,.4);
	letter-spacing:.12em;
	text-transform:uppercase;
}

.light-theme footer, .light-theme .form-label-custom { 
	color: var(--bg-card-light) !important; 
}

/* reveal animation */
.reveal{opacity:0; transform:translateY(20px); transition:opacity .8s, transform .8s}
.reveal.in{opacity:1; transform:none}

.p-0{padding:0 !important}


	/* ---------- APM Comparison Table ---------- */
	.apm-compare-section{
		padding:7rem 0;
		background:var(--obsidian-2);
		/* border-top:1px solid var(--line);
		border-bottom:1px solid var(--line); */
		position:relative; z-index:2;
	}
	.apm-table-wrap{
		position:relative;
		border:1px solid var(--line-2);
		border-radius:4px;
		overflow:hidden;
	}
	.apm-scroll-hint{
		display:none;
		text-align:center;
		font-family:'JetBrains Mono',monospace;
		font-size:.68rem;
		letter-spacing:.15em;
		color:rgba(232,238,255,.4);
		padding:.6rem;
		background:var(--obsidian-3);
		border-bottom:1px solid var(--line);
	}
	@media(max-width:640px){ .apm-scroll-hint{ display:block } }
	.apm-table-scroller{
		overflow-x:auto;
		-webkit-overflow-scrolling:touch;
	}
	.apm-table{
		width:100%;
		border-collapse:collapse;
		font-size:.9rem;
		min-width:520px;
	}
	/* Header */
	.apm-table thead tr{
		background:var(--obsidian-3);
	}
	.apm-table th {
		padding: 1.1rem 1.4rem;
		font-family: 'JetBrains Mono',monospace;
		font-size: .9rem;
		letter-spacing: .1em;
		text-transform: uppercase;
		font-weight: 500;
		text-align: center;
		border-bottom: 2px solid var(--line-2);
		color: rgba(232,238,255,.55);
		white-space: nowrap;
	}
	.apm-th-feature{
		text-align:left !important;
		width:42%;
		color:rgba(232,238,255,.45) !important;
	}
	.apm-th-garud{
		background:rgba(39,97,211,.15);
		border-left:1px solid var(--line-2);
		border-right:1px solid var(--line-2);
	}
	.apm-th-other{
		color:rgba(232,238,255,.4) !important;
	}
	.apm-garud-badge {
		display: inline-flex;
		align-items: center;
		gap: .45rem;
		color: var(--amber-2);
		font-size: 0.9rem;
		letter-spacing: .1em;
	}
	.apm-garud-badge svg{
		fill:var(--amber-2);
		flex-shrink:0;
	}
	/* Body rows */
	.apm-table tbody tr{
		border-bottom:1px solid var(--line);
		transition:background .2s;
	}
	.apm-table tbody tr:last-child{ border-bottom:none }
	.apm-table tbody tr:not(.apm-group-row):hover{
		background:rgba(39,97,211,.05);
	}
	.apm-table td{
		padding:.85rem 1.4rem;
		vertical-align:middle;
		text-align:center;
		color:rgba(232,238,255,.7);
		font-size:.88rem;
	}
	.apm-table td:first-child {
		text-align: left;
		font-size: .95rem;
		color: rgba(232,238,255,.85);
		font-weight: 400;
	}
	/* Garud column highlight */
	.apm-table td:nth-child(2){
		background:rgba(39,97,211,.07);
		border-left:1px solid var(--line-2);
		border-right:1px solid var(--line-2);
		font-weight:500;
	}
	/* Group header rows */
	.apm-group-row td{
		padding:.7rem 1.4rem .5rem !important;
		font-family:'JetBrains Mono',monospace;
		font-size:.68rem;
		letter-spacing:.2em;
		text-transform:uppercase;
		color:var(--cyan) !important;
		background:rgba(24,196,211,.05) !important;
		border-bottom:1px solid rgba(24,196,211,.15) !important;
		font-weight:500;
		text-align:left !important;
	}
	/* Status cells */
	.apm-yes{
		color:#4ade80 !important;
		font-weight:600;
		font-size:.95rem;
	}
	.light-theme .apm-yes{ color: #1ca74f !important }
	.apm-no{
		color:#f87171 !important;
		font-weight:600;
		font-size:.95rem;
	}
	.apm-partial{
		color:rgba(232,238,255,.5) !important;
		font-size:.85rem;
		font-style:italic;
	}
	.light-theme .apm-partial{ color:rgba(26,32,64,.5) !important }
	.apm-note {
		font-family: 'JetBrains Mono',monospace;
		font-size: .9rem;
		font-weight: 400;
		font-style: normal;
		opacity: .75;
		display: inline-block;
		margin-left: .25rem;
		color: inherit;
	}
	/* Light theme overrides */
	html.light-theme .apm-compare-section{ background:var(--obsidian-2) }
	html.light-theme .apm-table th{ color:rgba(26,32,64,.5) }
	html.light-theme .apm-table td{ color:rgba(26,32,64,.8) }
	html.light-theme .apm-table td:first-child{ color:rgba(26,32,64,.9) }
	html.light-theme .apm-group-row td{ color:var(--cyan) !important }
	html.light-theme .apm-th-feature{ color:rgba(26,32,64,.45) !important }
	html.light-theme .apm-th-other{ color:rgba(26,32,64,.4) !important }




    
/* ─── Dashboard Mockup ─── */
.dashboard-wrap {
	position: relative;
	perspective: 1200px;
}

.dashboard-inner {
	transform-style: preserve-3d;
	transition: transform 0.15s ease-out;
}

.dashboard-card {
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 20px;
	position: relative;
	overflow: hidden;
	backdrop-filter: blur(20px);
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.3), 0 0 0 1px var(--border);
}

[data-theme="dark"] .dashboard-card {
	background: rgba(14, 26, 43, 0.9);
}

.dash-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--border);
}

.dash-dots {
	display: flex;
	gap: 6px;
}

.dash-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
}

.dash-dot.r {
	background: #ff5f57;
}

.dash-dot.y {
	background: #ffbd2e;
}

.dash-dot.g {
	background: #28c840;
}

.dash-title-bar {
	font-size: 11px;
	color: var(--text-sub);
	font-family: 'Space Mono', monospace;
}

.dash-metrics {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin-bottom: 14px;
}

.dash-metric {
	background: rgba(11, 110, 243, 0.08);
	border: 1px solid rgba(11, 110, 243, 0.12);
	border-radius: 10px;
	padding: 10px;
}

.dash-metric-label {
	font-size: 9px;
	color: var(--text-sub);
	letter-spacing: 0.5px;
	margin-bottom: 4px;
}

.dash-metric-val {
	font-size: 18px;
	font-weight: 700;
	color: var(--blue-light);
	font-family: 'Space Mono', monospace;
}

.dash-metric-delta {
	font-size: 9px;
	color: #22c55e;
}

.dash-metric.warn .dash-metric-val {
	color: var(--yellow);
}

.dash-metric.err .dash-metric-val {
	color: #f87171;
}

  
/* Spark chart */
.spark-chart {
	height: 60px;
	position: relative;
	overflow: hidden;
	margin-bottom: 14px;
}

.spark-svg {
	width: 100%;
	height: 100%;
}

/* Service list */
.dash-services {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.dash-service {
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--bg-card);
	border: 1px solid var(--border);
	border-radius: 8px;
	padding: 8px 10px;
	font-size: 11px;
}

.dash-svc-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	flex-shrink: 0;
}

.dash-svc-dot.ok {
	background: #22c55e;
	box-shadow: 0 0 6px #22c55e;
}

.dash-svc-dot.warn {
	background: var(--yellow);
	box-shadow: 0 0 6px var(--yellow);
}

.dash-svc-dot.err {
	background: #f87171;
	box-shadow: 0 0 6px #f87171;
}

.dash-svc-name {
	flex: 1;
	color: var(--text);
}

.dash-svc-ms {
	color: var(--text-sub);
	font-family: 'Space Mono', monospace;
}

/* Floating cards */
.float-card {
	position: absolute;
	background: rgba(14, 26, 43, 0.92);
	border: 1px solid rgba(11, 110, 243, 0.25);
	border-radius: 12px;
	padding: 12px 16px;
	backdrop-filter: blur(16px);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
	font-size: 12px;
	animation: float-y 4s ease-in-out infinite;
}

[data-theme="light"] .float-card {
	background: rgba(255, 255, 255, 0.95);
}

.float-card-1 {
	top: -30px;
	left: -40px;
	animation-delay: 0s;
}

.float-card-2 {
	bottom: -20px;
	right: -30px;
	animation-delay: -2s;
}

.float-card-3 {
	top: 40%;
	left: -60px;
	animation-delay: -1s;
}

@keyframes float-y {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-10px);
	}
}


.fc-label {
	font-size: 9px;
	color: var(--text-sub);
	letter-spacing: 0.5px;
	margin-bottom: 4px;
}

.fc-val {
	font-weight: 700;
	color: var(--yellow);
	font-family: 'Space Mono', monospace;
}

.fc-bar {
	height: 3px;
	background: var(--border);
	border-radius: 2px;
	margin-top: 6px;
}

.fc-bar-fill {
	height: 100%;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--blue), var(--yellow));
}

/* AI alert */
.ai-alert {
	position: absolute;
	top: -20px;
	right: 20px;
	background: linear-gradient(135deg, rgba(11, 110, 243, 0.2), rgba(11, 110, 243, 0.05));
	border: 1px solid rgba(11, 110, 243, 0.3);
	border-radius: 10px;
	padding: 10px 14px;
	font-size: 11px;
	color: var(--text);
	backdrop-filter: blur(10px);
	display: flex;
	align-items: center;
	gap: 8px;
	animation: float-y 5s ease-in-out infinite;
	animation-delay: -1.5s;
	max-width: 200px;
}

.ai-alert i {
	color: var(--blue);
	font-size: 14px;
}



.hero-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-bg-video video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
  /* opacity: 0.95; */
}
.hero-bg-video::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #0F1B2C;
  background: linear-gradient(223deg, rgba(14, 18, 32, 0) 0%, rgba(14, 18, 32, 1) 73%);
  width: 100%;
  height: 100%;
  z-index: 1;
}
.hero-bg-video::after {
  content: '';
  position: absolute;
  inset: 0;
  background-color: #0a1421;
  width: 100%;
  height: 100%;
  animation: gradientFade 10s ease normal forwards;
}

@keyframes gradientFade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


.marquee::before {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 20rem;
  height: 100%;
  background: #0E1220;
  background: linear-gradient(90deg,rgba(14, 18, 32, 0) 0%, rgba(14, 18, 32, 1) 100%);
  z-index: 9;
	pointer-events: none;
}
.marquee::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 20rem;
  height: 100%;
  background: #0E1220;
  background: linear-gradient(270deg,rgba(14, 18, 32, 0) 0%, rgba(14, 18, 32, 1) 100%);
  z-index: 9;
	pointer-events: none;
}

.light-theme .marquee::before {
	background: var(--obsidian-2);
	background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--obsidian-2) 100%);
}
.light-theme .marquee::after {
	background: var(--obsidian-2);
	background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--obsidian-2) 100%);
}

.marquee.marquee-logo .img-fluid {
  max-width: 130px;
  border-radius: 10px;
}
.marquee.marquee-logo .marquee-track {
  gap: 1rem;
	animation: marquee 45s linear infinite reverse;
}
.marquee.marquee-logo span {
  gap: 1rem;
  opacity: 0.5;
  transition: all 0.3s;
}
.marquee.marquee-logo span:hover {
  opacity: 1;
}


.logo img{
  width:220px;
  height:auto;
  transition:transform .3s;
}

.logo-dark {
  display: none;
}
html.light-theme .logo-dark {
  display: block;
}
html.light-theme .logo-light {
  display: none;
}

.hero {
  background-color: var(--obsidian) !important;
}
.hero h1{
  color: var(--text) !important;
}
.hero .btn-ghost{
  color: var(--text) !important;
}
.hero p, .hero p b{
  color: var(--text) !important;
}
.hero-meta{
  color: var(--text-sub) !important;
}


/* ═══════════════════════════════════════════
		FOOTER
═══════════════════════════════════════════ */

#footer {
  padding: 64px 0 32px;
  background: var(--surface-dark);
  border-top: 1px solid var(--border-color);
}

.footer-logo { margin-bottom: 14px; }

.footer-tagline {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.6;
  /* max-width: 220px; */
  margin-bottom: 20px;
}

.social-links {
  display: flex;
  gap: 12px;
}

.social-link {
  width: 36px; height: 36px;
  background: var(--surface-dark-2);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-secondary);
  font-size: 14px;
  text-decoration: none;
  transition: var(--transition);
}

.social-link:hover {
  border-color: var(--primary);
  color: var(--primary);
  box-shadow: 0 0 12px var(--primary-glow);
}

.footer-heading {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 16px;
}

.footer-links { list-style: none; display: flex; flex-direction: column; gap: 10px; }

.footer-links a {
  font-size: 14px;
  color: var(--text-secondary);
  text-decoration: none;
  transition: var(--transition);
}

.footer-links a:hover { color: var(--primary); }

.footer-contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 10px;
}

.footer-contact-item i { color: var(--primary); }

.footer-bottom {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--border-color);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: gap;
  gap: 16px;
}

.footer-legal { font-size: 12px; color: var(--text-muted); }

.footer-copy { font-size: 12px; color: var(--text-muted); }

/* ============================================================
	FOOTER CONTACT FORM
============================================================ */
.footer-form-card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  padding: 32px;
  backdrop-filter: blur(10px);
  position: relative;
  overflow: hidden;
}

.footer-form-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
}

.form-group-custom { display: flex; flex-direction: column; gap: 6px; }

.form-label-custom {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  letter-spacing: 0.3px;
}

.form-input-custom {
  background: var(--surface-dark-2);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 11px 14px;
  font-family: var(--font-main);
  font-size: 14px;
  color: var(--text-primary);
  outline: none;
  transition: var(--transition);
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
}

.form-input-custom::placeholder { color: var(--text-muted); }

.form-input-custom:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(11,110,243,0.12);
  background: var(--surface-dark-3);
}

.form-select-custom {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238BA3C7' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 36px;
  cursor: pointer;
}

.form-select-custom:focus {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238BA3C7' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.form-select-custom option {
  background: var(--surface-dark-2);
  color: var(--text-primary);
}

.form-textarea-custom {
  resize: vertical;
  min-height: 90px;
  line-height: 1.5;
}

.btn-form-submit {
  width: 100%;
  background: var(--primary);
  color: #fff;
  border: none;
  padding: 13px 24px;
  border-radius: 10px;
  font-family: var(--font-main);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 4px 20px var(--primary-glow);
  margin-top: 4px;
}

.btn-form-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px var(--primary-glow);
}

.btn-form-submit:active { transform: scale(0.98); }

.form-success {
  margin-top: 14px;
  padding: 12px 16px;
  background: rgba(34,197,94,0.1);
  border: 1px solid rgba(34,197,94,0.3);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: #22C55E;
  display: flex;
  align-items: center;
  gap: 8px;
}

[data-theme="light"] .form-input-custom {
  background: var(--bg-light);
  color: var(--bg-dark);
}

[data-theme="light"] .form-input-custom::placeholder { color: var(--text-muted); }
[data-theme="light"] .footer-form-card { background: #fff; }

footer {
	overflow: hidden;
}
.sigContain {
  background:transparent; 
  overflow:hidden; 
  width:100%; height:100vh; 
  opacity: 0.2;
}
.sigContain, .signal {
  overflow: hidden;
  position: absolute;
  top: 0;  bottom: 0;  left: 0;  right: 0;
}
.signal {
	border:2px solid #009fdb;
	border-radius:300px;
	top:200px; width:400px; height:400px;
	left:calc(50% - 200px);
	margin:0;
	opacity:0;
	position:absolute;
}
.s1 {animation: pulsate 8s ease-out 0s  infinite;  }
.s2 {animation: pulsate 8s ease-out 2s  infinite;}
.s3 {animation: pulsate 8s ease-out 4s  infinite;}
.s4 {animation: pulsate 8s ease-out 6s  infinite;}
 
@keyframes pulsate {
	0% { transform:scale(0.1); opacity: 0.0;}
	20% { opacity:0.2;}
	50% { opacity:0.4;}
	80% { opacity:0.1;}
	100% { transform:scale(5); opacity:0;}
}


.infi-ico {
	width: 100px;
	height: 47px;
}

#outline {
  stroke-dasharray: 2.42777px, 242.77666px;
  stroke-dashoffset: 0;
  -webkit-animation: anim 1.6s linear infinite;
          animation: anim 1.6s linear infinite;
}


.infi-ico #outline-bg {
  stroke: rgb(11, 110, 243);
  opacity: 1;
  stroke-width: 10px;
}
.infi-ico #outline {
  stroke: rgb(3, 200, 205);
  stroke-width: 10px;
  z-index: 99;
  position: absolute;
}

@-webkit-keyframes anim {
  12.5% {
    stroke-dasharray: 33.98873px, 242.77666px;
    stroke-dashoffset: -26.70543px;
  }
  43.75% {
    stroke-dasharray: 84.97183px, 242.77666px;
    stroke-dashoffset: -84.97183px;
  }
  100% {
    stroke-dasharray: 2.42777px, 242.77666px;
    stroke-dashoffset: -240.34889px;
  }
}

@keyframes anim {
  12.5% {
    stroke-dasharray: 33.98873px, 242.77666px;
    stroke-dashoffset: -26.70543px;
  }
  43.75% {
    stroke-dasharray: 84.97183px, 242.77666px;
    stroke-dashoffset: -84.97183px;
  }
  100% {
    stroke-dasharray: 2.42777px, 242.77666px;
    stroke-dashoffset: -240.34889px;
  }
}



.modal-content{
	background-color: #0e1220 !important;
}

.modal {
	backdrop-filter: blur(10px);
}