:root{
  --bg: #0A0A0C;
  --bg-raised: #111114;
  --bg-card: #15151A;
  --border: #232328;
  --border-hover: #34343C;
  --text: #F5F3EA;
  --text-dim: #8C8A82;
  --text-faint: #57564F;
  --lime: #298DFF;
  --lime-dim: #1A6FD4;
  --purple: #9D7CFF;
  --purple-bg: #1C1730;
  --red: #FF5C5C;
  --cyan: #4FF0E0;
  --mono: 'JetBrains Mono', monospace;
  --sans: 'Inter', sans-serif;
  --radius: 10px;
  --glow-lime: 0 0 8px rgba(41,141,255,.55), 0 0 22px rgba(41,141,255,.30);
  --glow-purple: 0 0 10px rgba(157,124,255,.5), 0 0 26px rgba(157,124,255,.28);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  position:relative;
  overflow-x:hidden;
}

.grain{
  position:fixed;inset:0;pointer-events:none;z-index:1;opacity:0.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============================================================
   CYBER-NEON BACKGROUND FX (blade runner / synthwave)
   ============================================================ */

/* Perspective synthwave grid sitting on the floor */
.fx-grid{
  position:fixed;left:50%;bottom:-10vh;
  width:240vw;height:90vh;
  transform:translateX(-50%) perspective(420px) rotateX(70deg);
  transform-origin:50% 100%;
  pointer-events:none;z-index:0;opacity:.75;
  background-image:
    linear-gradient(rgba(41,141,255,.42) 1.5px, transparent 1.5px),
    linear-gradient(90deg, rgba(157,124,255,.34) 1.5px, transparent 1.5px);
  background-size:62px 62px;
  -webkit-mask-image:linear-gradient(to top, #000 0%, #000 22%, transparent 72%);
          mask-image:linear-gradient(to top, #000 0%, #000 22%, transparent 72%);
  animation:grid-roll 2.4s linear infinite;
}
@keyframes grid-roll{ to{ background-position:0 64px, 0 0; } }

/* Glowing horizon line where the grid meets the sky */
.fx-horizon{
  position:fixed;left:0;right:0;bottom:38vh;height:2px;
  pointer-events:none;z-index:0;
  background:linear-gradient(90deg, transparent, var(--lime), var(--cyan), var(--purple), transparent);
  filter:blur(1px);
  box-shadow:0 0 30px 6px rgba(41,141,255,.45), 0 0 80px 16px rgba(157,124,255,.28);
  opacity:.6;
  animation:horizon-pulse 5s ease-in-out infinite;
}
@keyframes horizon-pulse{50%{opacity:.7;}}

/* Slow-shifting ambient color clouds */
.fx-ambient{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 50% 40% at 12% 8%, rgba(41,141,255,.10), transparent 60%),
    radial-gradient(ellipse 46% 42% at 88% 14%, rgba(157,124,255,.11), transparent 62%),
    radial-gradient(ellipse 60% 50% at 50% 110%, rgba(79,240,224,.08), transparent 60%);
  animation:ambient-drift 18s ease-in-out infinite alternate;
}
@keyframes ambient-drift{
  from{transform:translate3d(-1.5%,-1%,0) scale(1.02);}
  to{transform:translate3d(2%,1.5%,0) scale(1.06);}
}

/* CRT scanlines + a sweeping scan beam */
.fx-scanlines{
  position:fixed;inset:0;pointer-events:none;z-index:3;opacity:.5;
  background:repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0px,
    rgba(0,0,0,0) 2px,
    rgba(0,0,0,.22) 3px,
    rgba(0,0,0,0) 4px
  );
  mix-blend-mode:multiply;
}
.fx-scanlines::after{
  content:"";position:absolute;left:0;right:0;height:18vh;
  background:linear-gradient(to bottom, transparent, rgba(41,141,255,.06), transparent);
  animation:scan-sweep 6s linear infinite;
}
@keyframes scan-sweep{ from{top:-20vh;} to{top:120vh;} }

/* Occasional CRT brightness flicker over the whole page */
.fx-flicker{
  position:fixed;inset:0;pointer-events:none;z-index:4;
  background:rgba(41,141,255,.025);opacity:0;
  animation:crt-flicker 7s steps(1) infinite;
}
@keyframes crt-flicker{
  0%,96%,100%{opacity:0;}
  97%{opacity:.5;} 97.5%{opacity:0;} 98.5%{opacity:.35;}
}

.container{max-width:1140px;margin:0 auto;padding:0 24px;}

a{color:inherit;text-decoration:none;}

::selection{background:var(--lime);color:#0A0A0C;}

:focus-visible{outline:2px solid var(--lime);outline-offset:2px;}

/* ===== TOPBAR ===== */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(10,10,12,0.7);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}
.topbar-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:64px;
}
.logo{
  font-family:var(--mono);font-weight:700;font-size:16px;letter-spacing:-0.02em;
  cursor:pointer;user-select:none;transition:transform .1s;
}
.logo:hover{text-shadow:var(--glow-lime);}
.logo:active{transform:scale(.94);}
.logo-bracket{color:var(--text-faint);}
.logo-fun{color:var(--lime);text-shadow:var(--glow-lime);}
.nav-links{display:flex;gap:28px;}
.nav-links a{
  font-family:var(--mono);font-size:13px;color:var(--text-dim);
  transition:color .15s, text-shadow .15s;
}
.nav-links a:hover{color:var(--lime);text-shadow:var(--glow-lime);}
.btn-submit{
  font-family:var(--mono);font-size:13px;font-weight:500;
  background:var(--lime);color:#ffffff;
  padding:8px 16px;border-radius:6px;
  transition:transform .12s, box-shadow .12s, background .12s;
  box-shadow:0 0 0 rgba(41,141,255,0);
}
.btn-submit:hover{background:#1A6FD4;transform:translateY(-1px);box-shadow:var(--glow-lime);}

/* ===== HERO — fluid full-width type ===== */
.hero{
  min-height:100vh;
  display:flex;flex-direction:column;
  padding:96px 0 0;
  position:relative;z-index:2;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 50% 40%, rgba(41,141,255,0.18), transparent 70%);
}

.hero-main{
  flex:1;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
  position:relative;z-index:1;
  padding:0 24px;
}
.fluid-title{
  font-family:var(--mono);font-weight:800;
  font-size:clamp(48px, 11vw, 130px);
  line-height:.98;letter-spacing:-0.02em;
  white-space:nowrap;
  margin-bottom:clamp(20px,3vw,34px);
  color:#E8EAED;
  text-shadow:
    0 0 16px rgba(232,234,237,.30),
    0 0 60px rgba(41,141,255,.22);
}
.fluid-title .suffix{
  display:inline-block;
  background:linear-gradient(135deg, #ffffff, #298DFF);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 0 20px rgba(41,141,255,.5));
  animation:word-in .35s cubic-bezier(.22,1,.36,1) both;
}
@keyframes word-in{
  from{ clip-path:inset(100% 0 0 0); transform:translateY(20px); }
  to  { clip-path:inset(0% 0 0 0);   transform:translateY(0); }
}
.hero-sub{
  font-family:var(--mono);
  font-size:clamp(13px,1.5vw,18px);color:var(--text-dim);
  letter-spacing:.01em;
}

/* ===== CENTERED CTA BLOCK ===== */
.hero-cta{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;gap:22px;
  padding:0 24px 40px;
}
.btn-cta{
  font-family:var(--mono);font-size:14px;font-weight:600;
  background:var(--lime);color:#ffffff;
  padding:13px 24px;border-radius:8px;
  text-decoration:none;white-space:nowrap;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.btn-cta:hover{background:#1A6FD4;transform:translateY(-2px);box-shadow:var(--glow-lime);}
.hero-stats{
  display:flex;align-items:center;gap:16px;
  font-family:var(--mono);font-size:13px;color:var(--text-faint);
}
.hero-stats .stat b{color:var(--text);font-weight:700;}
.hero-stats .stat-sep{color:var(--border-hover);}

/* ===== TRUSTED TICKER ===== */
.trusted-bar{
  position:relative;z-index:1;
  padding:18px 0;
  border-top:1px solid var(--border);
  overflow:hidden;
}
.trusted-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.trusted-track{
  display:flex;align-items:center;gap:54px;width:max-content;
  animation:marquee 44s linear infinite;
}
.trusted-track .logo-mark{
  display:inline-block;
  height:30px;width:var(--w,40px);flex:none;
  background:linear-gradient(90deg,#ff5e5e,#ff9b3d,#ffe24d,#5dff8f,#3de0ff,#6a8bff,#c46bff,#ff5ea8,#ff5e5e);
  background-size:200% 100%;
  -webkit-mask:var(--l) center/contain no-repeat;
  mask:var(--l) center/contain no-repeat;
  animation:rainbow-move 6s linear infinite;
}
@keyframes rainbow-move{from{background-position:0% 0;}to{background-position:200% 0;}}
@keyframes marquee{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ===== GLITCH TITLE ===== */
.glitch{position:relative;display:inline-block;}
.glitch::before,
.glitch::after{
  content:attr(data-text);
  position:absolute;left:0;top:0;width:100%;
  overflow:hidden;pointer-events:none;
}
.glitch::before{
  color:var(--cyan);
  clip-path:inset(0 0 0 0);
  animation:glitch-top 5s infinite steps(2);
  text-shadow:-2px 0 var(--cyan);
}
.glitch::after{
  color:var(--purple);
  animation:glitch-bottom 5s infinite steps(2);
  text-shadow:2px 0 var(--red);
}
@keyframes glitch-top{
  0%,90%,100%{transform:translate(0,0);clip-path:inset(0 0 100% 0);opacity:0;}
  91%{transform:translate(-3px,-2px);clip-path:inset(0 0 55% 0);opacity:.9;}
  93%{transform:translate(3px,1px);clip-path:inset(0 0 62% 0);opacity:.9;}
  95%{transform:translate(-2px,0);clip-path:inset(0 0 48% 0);opacity:.9;}
}
@keyframes glitch-bottom{
  0%,90%,100%{transform:translate(0,0);clip-path:inset(100% 0 0 0);opacity:0;}
  91%{transform:translate(3px,2px);clip-path:inset(55% 0 0 0);opacity:.9;}
  93%{transform:translate(-3px,-1px);clip-path:inset(45% 0 0 0);opacity:.9;}
  95%{transform:translate(2px,0);clip-path:inset(60% 0 0 0);opacity:.9;}
}

/* Terminal */
.terminal{
  background:var(--bg-raised);
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(0,0,0,0.6), 0 0 0 1px rgba(41,141,255,.04), 0 0 40px -8px rgba(41,141,255,.12);
}
.terminal-bar{
  display:flex;align-items:center;gap:7px;
  padding:11px 14px;
  background:#0D0D10;
  border-bottom:1px solid var(--border);
}
.dot{width:10px;height:10px;border-radius:50%;}
.dot-r{background:#FF5F57;}
.dot-y{background:#FEBC2E;}
.dot-g{background:#28C840;}
.terminal-title{
  font-family:var(--mono);font-size:11px;color:var(--text-faint);
  margin-left:8px;
}
.terminal-body{
  padding:24px 20px;min-height:172px;
  font-family:var(--mono);font-size:14px;line-height:2;
}
.t-prompt{color:var(--lime);text-shadow:var(--glow-lime);}
.t-cmd{color:var(--text);}
.t-cursor{
  color:var(--lime);text-shadow:var(--glow-lime);
  animation:blink 1s step-end infinite;
}
@keyframes blink{50%{opacity:0;}}
.t-out{color:var(--text-dim);padding-left:18px;animation:fadeIn .2s ease;}
.t-ok{color:var(--lime);text-shadow:0 0 12px rgba(41,141,255,0.45);}
@keyframes fadeIn{from{opacity:0;transform:translateY(2px);}to{opacity:1;transform:translateY(0);}}

/* ===== SEARCH ===== */
.search-section{
  padding:0 0 32px;position:relative;z-index:2;
}
.searchbar{
  display:flex;align-items:center;gap:12px;
  background:var(--bg-raised);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 18px;
  margin-bottom:18px;
  transition:border-color .15s, box-shadow .2s;
}
.searchbar:focus-within{border-color:var(--lime-dim);box-shadow:var(--glow-lime);}
.search-icon{
  font-family:var(--mono);color:var(--lime);font-style:normal;font-weight:700;
  text-shadow:var(--glow-lime);
}
.searchbar input{
  background:none;border:none;outline:none;
  color:var(--text);font-family:var(--sans);font-size:14px;
  flex:1;
}
.searchbar input::placeholder{color:var(--text-faint);}

.filters{display:flex;gap:8px;flex-wrap:wrap;}
.filter-pill{
  font-family:var(--mono);font-size:12px;
  background:transparent;color:var(--text-dim);
  border:1px solid var(--border);
  padding:7px 14px;border-radius:20px;
  cursor:pointer;transition:all .12s;
  white-space:nowrap;
}
.filter-pill:hover{border-color:var(--lime-dim);color:var(--lime);box-shadow:0 0 10px -2px rgba(41,141,255,.4);}
.filter-pill.active{
  background:var(--lime);color:#ffffff;border-color:var(--lime);font-weight:500;
  box-shadow:var(--glow-lime);
}

/* ===== GRID / CARDS ===== */
.tools-section{padding:8px 0 64px;position:relative;z-index:2;}
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:14px;
}
.card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:20px;
  position:relative;
  transition:border-color .15s, transform .15s, box-shadow .2s;
  display:flex;flex-direction:column;
  overflow:hidden;
}
/* neon scan sheen that runs across a card on hover */
.card::before{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(100deg, transparent, rgba(41,141,255,.10), transparent);
  transform:skewX(-18deg);transition:left .55s ease;pointer-events:none;
}
.card:hover::before{left:130%;}
.card:hover{
  border-color:var(--lime-dim);transform:translateY(-3px);
  box-shadow:0 12px 30px -12px rgba(0,0,0,.7), 0 0 0 1px rgba(41,141,255,.25), 0 0 24px -6px rgba(41,141,255,.4);
}
/* staggered entrance */
.card{animation:card-in .42s cubic-bezier(.2,.7,.2,1) backwards;}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;}
.card-icon{
  width:36px;height:36px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-weight:700;font-size:14px;
  background:var(--purple-bg);color:var(--purple);
  transition:box-shadow .2s, color .2s;
}
.card:hover .card-icon{color:#c9b6ff;box-shadow:var(--glow-purple);}
.card-icon.has-logo{
  background:#fff;padding:6px;overflow:hidden;
}
.card-icon.has-logo img{
  width:100%;height:100%;object-fit:contain;display:block;
}
.card:hover .card-icon.has-logo{box-shadow:0 0 0 1px rgba(255,255,255,.15), 0 4px 14px rgba(0,0,0,.4);}
@keyframes card-in{from{opacity:0;transform:translateY(14px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.badge-aff{
  font-family:var(--mono);font-size:10px;
  background:rgba(41,141,255,0.1);color:var(--lime-dim);
  padding:3px 9px;border-radius:20px;font-weight:500;
}
.card-title{font-size:15px;font-weight:600;margin-bottom:6px;}
.card-desc{
  font-size:13px;color:var(--text-dim);line-height:1.55;
  margin-bottom:18px;flex:1;
}
.card-foot{display:flex;justify-content:space-between;align-items:center;}
.tag-row{display:flex;gap:5px;flex-wrap:wrap;}
.tag{
  font-family:var(--mono);font-size:10px;
  background:var(--bg-raised);color:var(--text-faint);
  padding:3px 8px;border-radius:5px;border:1px solid var(--border);
}
.go-btn{
  font-family:var(--mono);font-size:12px;color:var(--lime);
  font-weight:500;display:flex;align-items:center;gap:4px;
  transition:text-shadow .2s;
}
.card:hover .go-btn{text-shadow:var(--glow-lime);}
.card a.card-link{position:absolute;inset:0;border-radius:var(--radius);z-index:2;}

.empty-state{
  text-align:center;color:var(--text-dim);font-size:14px;padding:48px 0;
}
.empty-state a{color:var(--lime);text-decoration:underline;}

/* ===== CTA ===== */
.cta{
  padding:72px 0;
  border-top:1px solid var(--border);
  position:relative;z-index:2;
  background:radial-gradient(ellipse 500px 250px at 50% 0%, rgba(157,124,255,0.08), transparent 60%);
}
.cta-inner{text-align:center;max-width:480px;margin:0 auto;}
.cta h2{
  font-family:var(--mono);font-size:26px;font-weight:700;margin-bottom:12px;
  letter-spacing:-0.01em;
}
.cta p{color:var(--text-dim);font-size:14px;line-height:1.6;margin-bottom:28px;}
.btn-primary{
  display:inline-block;
  font-family:var(--mono);font-size:14px;font-weight:500;
  background:var(--lime);color:#ffffff;
  padding:13px 28px;border-radius:8px;
  transition:transform .12s, background .12s, box-shadow .2s;
}
.btn-primary:hover{background:#1A6FD4;transform:translateY(-1px);box-shadow:var(--glow-lime);}

/* ===== FOOTER ===== */
.footer{
  border-top:1px solid var(--border);
  padding:40px 0 48px;
  position:relative;z-index:2;
}
.footer-col{display:flex;flex-direction:column;gap:18px;}
.footer-row{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:14px;
}
.footer-brand{
  font-family:var(--mono);font-size:15px;font-weight:700;letter-spacing:-.01em;
}
.footer-nav{display:flex;gap:22px;}
.footer-nav a{
  font-family:var(--mono);font-size:13px;color:var(--text-dim);
  transition:color .18s, text-shadow .18s;
}
.footer-nav a:hover{color:var(--lime);text-shadow:var(--glow-lime);}
.footer-meta{
  font-family:var(--mono);font-size:12px;color:var(--text-faint);
  padding-top:16px;border-top:1px solid var(--border);
}
.footer-dim{color:var(--text-faint);}
.footer-disc{
  font-size:12px;line-height:1.6;color:var(--text-faint);
  max-width:680px;
}

/* ============================================================
   SWORD SLASH OVERLAY
   ============================================================ */
.slash-fx{
  position:fixed;inset:0;z-index:9000;pointer-events:none;
  opacity:0;visibility:hidden;
}
.slash-fx.run{opacity:1;visibility:visible;}
/* the blade — a long thin streak swept across the screen */
.blade{
  position:absolute;top:50%;left:50%;
  width:220vmax;height:3px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0) 8%, var(--cyan) 35%, #fff 50%, var(--lime) 65%, rgba(255,255,255,0) 92%, transparent);
  box-shadow:0 0 14px 3px rgba(41,141,255,.9), 0 0 40px 10px rgba(79,240,224,.6);
  transform:translate(-50%,-50%) rotate(-32deg) translateX(-160vmax);
  opacity:0;
}
.slash-fx.run .blade{animation:blade-sweep .42s cubic-bezier(.4,0,.1,1) forwards;}
@keyframes blade-sweep{
  0%{transform:translate(-50%,-50%) rotate(-32deg) translateX(-160vmax);opacity:0;}
  12%{opacity:1;}
  100%{transform:translate(-50%,-50%) rotate(-32deg) translateX(160vmax);opacity:1;}
}
/* the lingering glowing gash left behind */
.gash{
  position:absolute;top:50%;left:50%;
  width:230vmax;height:2px;
  background:linear-gradient(90deg, transparent, var(--lime) 30%, #fff 50%, var(--cyan) 70%, transparent);
  box-shadow:0 0 22px 5px rgba(41,141,255,.8), 0 0 60px 14px rgba(79,240,224,.45);
  transform:translate(-50%,-50%) rotate(-32deg) scaleX(0);
  transform-origin:center;opacity:0;
}
.slash-fx.run .gash{animation:gash-show .55s ease-out forwards;animation-delay:.16s;}
@keyframes gash-show{
  0%{transform:translate(-50%,-50%) rotate(-32deg) scaleX(0);opacity:1;}
  35%{transform:translate(-50%,-50%) rotate(-32deg) scaleX(1);opacity:1;}
  100%{transform:translate(-50%,-50%) rotate(-32deg) scaleX(1);opacity:0;}
}
/* white flash bloom at the moment of the cut */
.gash-flash{
  position:absolute;inset:0;background:rgba(41,141,255,.06);opacity:0;
}
.slash-fx.run .gash-flash{animation:gash-flash .3s ease-out forwards;animation-delay:.14s;}
@keyframes gash-flash{0%{opacity:1;}100%{opacity:0;}}
/* screen jolts apart along the cut */
.slash-shift{animation:slash-shake .32s ease-out;}
@keyframes slash-shake{
  0%,100%{transform:translate(0,0);}
  30%{transform:translate(4px,-3px);}
  60%{transform:translate(-3px,2px);}
}
/* sparks generated by JS */
.spark{
  position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 8px 2px rgba(41,141,255,.9);
}

/* ============================================================
   NUCLEAR EASTER-EGG OVERLAY
   ============================================================ */
.nuke-fx{
  position:fixed;inset:0;z-index:9500;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;
}
.nuke-fx.run{opacity:1;visibility:visible;}
.nuke-flash{
  position:absolute;inset:0;background:radial-gradient(circle at 50% 55%, #fff, #eaffd0 30%, var(--lime) 55%, transparent 75%);
  opacity:0;
}
.nuke-fx.run .nuke-flash{animation:nuke-flash 1.1s ease-out forwards;}
@keyframes nuke-flash{
  0%{opacity:0;}
  6%{opacity:1;}
  30%{opacity:.85;}
  100%{opacity:0;}
}
.nuke-shock{
  position:absolute;top:55%;left:50%;width:40px;height:40px;border-radius:50%;
  border:3px solid rgba(41,141,255,.9);
  box-shadow:0 0 30px 6px rgba(41,141,255,.7), inset 0 0 20px rgba(255,255,255,.6);
  transform:translate(-50%,-50%) scale(0);opacity:0;
}
.nuke-fx.run .nuke-shock{animation:nuke-shock 1.1s cubic-bezier(.15,.6,.2,1) forwards;}
.nuke-shock-2{border-color:rgba(79,240,224,.8);}
.nuke-fx.run .nuke-shock-2{animation:nuke-shock 1.2s cubic-bezier(.15,.6,.2,1) forwards;animation-delay:.12s;}
@keyframes nuke-shock{
  0%{transform:translate(-50%,-50%) scale(0);opacity:1;}
  100%{transform:translate(-50%,-50%) scale(46);opacity:0;}
}
.nuke-bloom{
  position:absolute;top:55%;left:50%;width:30vmin;height:30vmin;border-radius:50%;
  background:radial-gradient(circle, #fff, var(--lime) 45%, rgba(157,124,255,.5) 70%, transparent 78%);
  transform:translate(-50%,-50%) scale(0);opacity:0;filter:blur(2px);
}
.nuke-fx.run .nuke-bloom{animation:nuke-bloom 1.1s ease-out forwards;}
@keyframes nuke-bloom{
  0%{transform:translate(-50%,-50%) scale(0);opacity:1;}
  40%{transform:translate(-50%,-50%) scale(1.1);opacity:.95;}
  100%{transform:translate(-50%,-50%) scale(1.5) translateY(-12vmin);opacity:0;}
}
.nuke-text{
  position:relative;z-index:2;
  font-family:var(--mono);font-weight:800;font-size:9vmin;letter-spacing:.04em;
  color:#0A0A0C;
  text-shadow:0 0 18px rgba(255,255,255,.9);
  transform:scale(.4);opacity:0;
}
.nuke-fx.run .nuke-text{animation:nuke-text 1.1s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:.1s;}
@keyframes nuke-text{
  0%{transform:scale(.3);opacity:0;}
  18%{transform:scale(1.12);opacity:1;}
  40%{transform:scale(1);opacity:1;}
  100%{transform:scale(1.04);opacity:0;}
}
/* whole-page shake during the blast */
.nuke-shake{animation:nuke-shake .6s cubic-bezier(.36,.07,.19,.97) both;}
@keyframes nuke-shake{
  10%,90%{transform:translate(-2px,1px);}
  20%,80%{transform:translate(4px,-2px);}
  30%,50%,70%{transform:translate(-6px,3px);}
  40%,60%{transform:translate(6px,-3px);}
}

/* ============================================================
   TOOL DETAIL PAGE
   ============================================================ */
.detail-wrap{
  padding:56px 0 40px;position:relative;z-index:2;
}
.breadcrumb{
  font-family:var(--mono);font-size:13px;color:var(--text-dim);
  display:inline-block;margin-bottom:36px;transition:color .15s, text-shadow .15s;
}
.breadcrumb:hover{color:var(--lime);text-shadow:var(--glow-lime);}
.detail-head{
  display:flex;align-items:center;gap:22px;margin-bottom:24px;
}
.detail-icon{
  width:84px;height:84px;border-radius:18px;flex:none;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-weight:800;font-size:30px;
  color:var(--lime);background:var(--bg-card);
  border:1px solid var(--border);
  box-shadow:var(--glow-lime), inset 0 0 24px rgba(0,0,0,.4);
}
.detail-cat{
  font-family:var(--mono);font-size:12px;color:var(--lime-dim);
  text-transform:uppercase;letter-spacing:.08em;
}
.detail-name{
  font-family:var(--mono);font-size:40px;font-weight:800;
  letter-spacing:-.02em;line-height:1.05;margin:6px 0 4px;
}
.detail-blurb{color:var(--text-dim);font-size:15px;}
.detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;}
.meta-pill{
  font-family:var(--mono);font-size:12px;color:var(--text-dim);
  background:var(--bg-raised);border:1px solid var(--border);
  padding:7px 14px;border-radius:20px;
}
.meta-aff{color:var(--lime-dim);border-color:rgba(41,141,255,.3);background:rgba(41,141,255,.06);}
.detail-desc{
  font-size:18px;line-height:1.65;color:var(--text);
  max-width:640px;margin-bottom:32px;
}
.detail-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}
.btn-lg{font-size:15px;padding:15px 30px;}
.btn-ghost{
  font-family:var(--mono);font-size:14px;color:var(--text-dim);
  border:1px solid var(--border);padding:14px 24px;border-radius:8px;
  transition:all .15s;
}
.btn-ghost:hover{border-color:var(--lime-dim);color:var(--lime);}
.aff-note{
  font-family:var(--mono);font-size:12px;color:var(--text-faint);
  line-height:1.6;max-width:560px;margin-top:28px;
  padding-top:18px;border-top:1px solid var(--border);
}
/* ===== RICH DETAIL BLOCKS (use-cases / pros-cons / faq) ===== */
.detail-block{
  margin-top:52px;padding-top:40px;
  border-top:1px solid var(--border);
}
.block-title{
  font-family:var(--mono);font-size:14px;font-weight:700;
  color:var(--text);text-transform:uppercase;letter-spacing:.07em;
  display:flex;align-items:baseline;gap:12px;margin-bottom:24px;
}
.block-num{
  font-size:12px;color:var(--lime-dim);font-weight:800;
}

/* Use cases */
.usecase-list{list-style:none;display:flex;flex-direction:column;gap:2px;}
.usecase{
  display:flex;align-items:flex-start;gap:18px;
  padding:16px 18px;
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius);
  transition:border-color .15s, transform .15s, box-shadow .2s;
}
.usecase:hover{
  border-color:var(--lime-dim);transform:translateX(3px);
  box-shadow:0 0 0 1px rgba(41,141,255,.18), 0 0 18px -8px rgba(41,141,255,.4);
}
.usecase-idx{
  font-family:var(--mono);font-size:13px;font-weight:800;
  color:var(--lime);text-shadow:var(--glow-lime);
  flex:none;line-height:1.6;
}
.usecase-text{font-size:15px;line-height:1.6;color:var(--text);}

/* Pros / cons */
.procon-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;
}
.procon-col{
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius);padding:22px 22px 24px;
}
.procon-pros{box-shadow:inset 3px 0 0 var(--lime);}
.procon-cons{box-shadow:inset 3px 0 0 var(--red);}
.procon-head{
  font-family:var(--mono);font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
  display:flex;align-items:center;gap:9px;margin-bottom:16px;
  color:var(--text-dim);
}
.procon-glyph{
  width:22px;height:22px;border-radius:6px;flex:none;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:800;line-height:1;
}
.procon-pros .procon-glyph{background:rgba(41,141,255,.12);color:var(--lime);}
.procon-cons .procon-glyph{background:rgba(255,92,92,.12);color:var(--red);}
.procon-col ul{list-style:none;display:flex;flex-direction:column;gap:13px;}
.procon-col li{
  font-size:14px;line-height:1.55;color:var(--text);
  padding-left:18px;position:relative;
}
.procon-col li::before{
  content:"";position:absolute;left:0;top:8px;
  width:6px;height:6px;border-radius:50%;
}
.procon-pros li::before{background:var(--lime);box-shadow:0 0 6px rgba(41,141,255,.6);}
.procon-cons li::before{background:var(--red);box-shadow:0 0 6px rgba(255,92,92,.5);}

/* FAQ accordion */
.faq{display:flex;flex-direction:column;gap:10px;}
.faq-item{
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--radius);overflow:hidden;
  transition:border-color .15s;
}
.faq-item[open]{border-color:var(--lime-dim);}
.faq-q{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 20px;
  font-family:var(--sans);font-size:15px;font-weight:600;color:var(--text);
  transition:color .15s;
}
.faq-q::-webkit-details-marker{display:none;}
.faq-item:hover .faq-q{color:var(--lime);}
.faq-chev{
  font-family:var(--mono);font-size:20px;font-weight:400;line-height:1;
  color:var(--lime);flex:none;transition:transform .2s ease;
}
.faq-item[open] .faq-chev{transform:rotate(45deg);}
.faq-a{
  padding:0 20px 20px;
  font-size:14px;line-height:1.7;color:var(--text-dim);max-width:680px;
}

@media (max-width:640px){
  .procon-grid{grid-template-columns:1fr;}
}

.related{padding:24px 0 72px;position:relative;z-index:2;border-top:1px solid var(--border);}
.related-title{
  font-family:var(--mono);font-size:14px;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.06em;margin:40px 0 18px;
}
.not-found{text-align:center;padding:80px 0;}
.nf-code{
  font-family:var(--mono);font-size:64px;font-weight:800;color:var(--lime);
  text-shadow:var(--glow-lime);line-height:1;margin-bottom:16px;
}
.not-found h1{font-family:var(--mono);font-size:24px;margin-bottom:10px;}
.not-found p{color:var(--text-dim);font-size:14px;margin-bottom:28px;}

/* ===== RESPONSIVE ===== */
@media (max-width:860px){
  .nav-links{display:none;}
  .fx-grid{opacity:.32;}
}
@media (max-width:560px){
  .hero{padding:84px 0 0;}
  .hero-stats{gap:12px;font-size:12px;}
  .grid{grid-template-columns:1fr;}
  .footer-row{flex-direction:column;align-items:flex-start;gap:10px;}
  .footer-meta{flex-direction:column;align-items:flex-start;}
}
@media (max-width:560px){
  .detail-head{flex-direction:column;align-items:flex-start;gap:14px;}
  .detail-name{font-size:30px;}
  .detail-desc{font-size:16px;}
  .detail-actions{flex-direction:column;align-items:stretch;}
  .btn-ghost{text-align:center;}
}

@media (prefers-reduced-motion: reduce){
  .t-cursor, .float-char, .fx-grid, .fx-horizon, .fx-ambient,
  .fx-scanlines::after, .fx-flicker, .glitch::before, .glitch::after,
  .card{animation:none !important;}
  .fx-grid, .fx-scanlines{display:none;}
  html{scroll-behavior:auto;}
}

/* ===== INTRO LOADER + PAGE RISE ===== */
.loader{display:none;}
html.booting .loader{
  display:flex;align-items:center;justify-content:center;
  position:fixed;inset:0;z-index:9999;background:#08090F;
}
.loader-blob{
  width:60vw;height:40vh;border-radius:50%;
  background:radial-gradient(ellipse 60% 40% at 50% 50%, rgba(41,141,255,0.35), transparent 70%);
  opacity:0;
  animation:loader-glow .6s ease forwards;
}
@keyframes loader-glow{ from{opacity:0;transform:scale(.9);} to{opacity:1;transform:scale(1);} }
.loader.hide{animation:loader-fade .4s ease forwards;}
@keyframes loader-fade{ to{opacity:0;visibility:hidden;} }

html.booting .page-rise{opacity:0;transform:translateY(30px);}
.page-rise{transition:opacity .5s ease, transform .5s ease;}

@media (prefers-reduced-motion: reduce){
  .loader-blob{animation-duration:.2s;}
  html.booting .page-rise{opacity:1;transform:none;}
}

/* ===== DETAIL ICON WITH LOGO ===== */
.detail-icon.has-logo{background:#fff;padding:14px;box-shadow:0 0 0 1px var(--border), 0 8px 28px rgba(0,0,0,.45);}
.detail-icon.has-logo img{width:100%;height:100%;object-fit:contain;display:block;}

/* ===== SUBMIT MODAL ===== */
.modal-overlay{
  position:fixed;inset:0;z-index:10000;
  display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(6,7,12,.78);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;transition:opacity .2s ease, visibility .2s ease;
}
.modal-overlay.open{opacity:1;visibility:visible;}
.modal{
  position:relative;width:100%;max-width:460px;
  background:var(--bg-raised);border:1px solid var(--border);
  border-radius:16px;padding:34px 32px 30px;
  box-shadow:0 24px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(41,141,255,.08);
  transform:translateY(16px) scale(.98);transition:transform .24s cubic-bezier(.2,.8,.2,1);
  max-height:90vh;overflow-y:auto;
}
.modal-overlay.open .modal{transform:translateY(0) scale(1);}
.modal-close{
  position:absolute;top:16px;right:16px;
  width:32px;height:32px;border:none;border-radius:8px;cursor:pointer;
  background:transparent;color:var(--text-dim);font-size:22px;line-height:1;
  transition:background .15s, color .15s;
}
.modal-close:hover{background:var(--bg-card);color:var(--text);}
.modal-title{
  font-family:var(--mono);font-size:22px;font-weight:800;letter-spacing:-.01em;
  margin-bottom:8px;
}
.modal-title::before{content:"+ ";color:var(--lime);}
.modal-sub{color:var(--text-dim);font-size:13.5px;line-height:1.6;margin-bottom:24px;}
.modal-form{display:flex;flex-direction:column;gap:16px;}
.field{display:flex;flex-direction:column;gap:7px;}
.field-label{
  font-family:var(--mono);font-size:11.5px;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.06em;
}
.field input, .field select, .field textarea{
  width:100%;font-family:var(--sans);font-size:14px;color:var(--text);
  background:var(--bg-card);border:1px solid var(--border);border-radius:8px;
  padding:11px 13px;transition:border-color .15s, box-shadow .15s;
}
.field textarea{resize:vertical;min-height:64px;line-height:1.5;}
.field select{font-family:var(--mono);cursor:pointer;}
.field input::placeholder, .field textarea::placeholder{color:var(--text-faint);}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--lime-dim);box-shadow:0 0 0 3px rgba(41,141,255,.14);
}
.btn-modal-submit{width:100%;text-align:center;margin-top:4px;cursor:pointer;border:none;}
.modal-note{
  font-family:var(--mono);font-size:11px;color:var(--text-faint);
  text-align:center;margin-top:2px;
}
.modal-success{
  text-align:center;font-family:var(--mono);font-size:16px;color:var(--lime);
  padding:30px 0 14px;line-height:1.7;
}
.modal-success span{display:block;margin-top:8px;font-size:12.5px;color:var(--text-dim);}
