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

:root {
  --bg: #070d14;
  --bg2: #0d1829;
  --bg3: #0a1420;
  --text: #ffffff;
  --muted: #6b8098;
  --muted2: #9aafc2;
  --border: rgba(255, 255, 255, 0.08);
  --c-green: #aaff00;
  --c-green2: #78cc00;
  --c-green3: #d4ff66;
  --c-blue: #4488ff;
  --c-purple: #9944ff;
  --c-red: #ff3322;
  --c-yellow: #ffdd00;
  --c-teal: #00ddaa;
    --lime:    #D4F712;
  --lime-d:  #9AB50A;
  --green:   #00C100;
  --cyan:    #5EFAF7;
  --blue:    #39A7F3;
  --violet:  #330066;
  --magenta: #CC0680;
  --red:     #840000;
  --yellow:  #FFFF00;

  --black:   #080A0C;
  --dark:    #0E1115;
  --dark-2:  #14181E;
  --dark-3:  #1A1F27;
  --white:   #FFFFFF;
  --off:     rgba(255,255,255,0.85);
  --muted:   rgba(255,255,255,0.42);
  --border:  rgba(212,247,18,0.12);
  --border2: rgba(94,250,247,0.15);
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  background: var(--bg);
  color: var(--text);
  overflow-x: hidden;
}



::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar-track {
  background: var(--bg);
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    var(--c-green),
    var(--c-blue),
    var(--c-purple),
    var(--c-red),
    var(--c-yellow),
    var(--c-teal)
  );
  border-radius: 2px;
}

/* ── KEYFRAMES ── */

@keyframes hexSpin {
  to { transform: rotate(360deg); }
}

@keyframes plDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes plFU {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fU {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes sI {
  to { opacity: 1; transform: translateX(0); }
}

@keyframes glow {
  0%, 100% { box-shadow: 0 0 20px currentColor, 0 0 40px currentColor; }
  50%       { box-shadow: 0 0 40px currentColor, 0 0 80px currentColor; }
}

@keyframes rp {
  0%, 100% { opacity: 0.4; }
  50%       { opacity: 1; }
}

@keyframes fl1 {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-10px); }
}

@keyframes fl2 {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-14px); }
}

@keyframes drw {
  to { stroke-dashoffset: 0; }
}

@keyframes plSh {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(200%); }
}

@keyframes plScan {
  0%   { top: 0; }
  100% { top: 100%; }
}

@keyframes pulse {
  0%, 100% { opacity: 0.6; }
  50%       { opacity: 1; }
}

@keyframes hexPulse {
  0%, 100% { box-shadow: 0 0 30px rgba(170, 255, 0, 0.3); }
  50%       { box-shadow: 0 0 60px rgba(170, 255, 0, 0.6); }
}

@keyframes borderFlow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes gradShift {
  0%   { background-position: 0%; }
  100% { background-position: 200%; }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes stepPop {
  from { opacity: 0; transform: scale(0.5); }
  to   { opacity: 1; transform: scale(1); }
}

/* ── NAV ── */

#nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 4%;
  transition: all 0.4s;
}

#nav.scrolled {
  background: rgba(7, 13, 20, 0.96);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.7rem 4%;
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
}

.nav-logo-img img {
  width: 264px;
}

.nav-logo-icon {
  width: 44px;
  height: 44px;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}

.nav-logo-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  background: conic-gradient(
    from 0deg,
    #4488ff, #9944ff, #ff3322,
    #ffdd00, #aaff00, #00ddaa, #4488ff
  );
  animation: hexSpin 6s linear infinite;
}

.nav-logo-icon svg {
  position: relative;
  z-index: 1;
}

.nav-logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav-logo-text .nl1 {
  font-family: 'Rajdhani', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.15em;
}

.nav-logo-text .nl2 {
  font-family: 'Dancing Script', cursive;
  font-size: 0.8rem;
  background: linear-gradient(90deg, var(--c-green), var(--c-blue), var(--c-purple));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.nav-links {
  display: flex;
  gap: 0;
  list-style: none;
}

.nav-links a {
  color: var(--muted2);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 0.5rem 1rem;
  position: relative;
  transition: color 0.3s;
}

.nav-links a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 1rem;
  right: 1rem;
  height: 1px;
  background: linear-gradient(90deg, var(--c-green), var(--c-blue), var(--c-purple));
  transform: scaleX(0);
  transition: transform 0.3s;
}

.nav-links a:hover {
  color: var(--text);
}

.nav-links a:hover::after,
.nav-links a.active::after {
  transform: scaleX(1);
}

.nav-links a.active {
  color: var(--c-green);
}

.nav-link {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
}

.nav-link a {
  font-size: 0.88rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 0.5rem 1rem;
  position: relative;
  transition: color 0.3s;
  color: var(--muted2);
}

.nav-cta {
  background: linear-gradient(135deg, var(--c-green), var(--c-teal));
  color: #050a00;
  padding: 0.55rem 1.4rem;
  border: none;
  border-radius: 3px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
  white-space: nowrap;
}

.nav-cta:hover {
  box-shadow: 0 0 20px rgba(170, 255, 0, 0.5);
  transform: translateY(-1px);
}

.nav-cta i {
  transition: all 0.5s;
  transform: rotate(-45deg);
}

.nav-hb {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav-hb span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--text);
  transition: all 0.3s;
}

.mob-menu {
  position: fixed;
  inset: 0;
  z-index: 150;
  background: rgba(7, 13, 20, 0.98);
  backdrop-filter: blur(20px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}

.mob-menu.open {
  opacity: 1;
  pointer-events: all;
}

.mob-menu a {
  font-family: 'Rajdhani', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted2);
  text-decoration: none;
  transition: color 0.3s;
}

.mob-menu a:nth-child(2):hover { color: var(--c-green); }
.mob-menu a:nth-child(3):hover { color: var(--c-blue); }
.mob-menu a:nth-child(4):hover { color: var(--c-purple); }
.mob-menu a:nth-child(5):hover { color: var(--c-red); }
.mob-menu a:nth-child(6):hover { color: var(--c-yellow); }
.mob-menu a:nth-child(7):hover { color: var(--c-teal); }

.mob-close {
  position: absolute;
  top: 1.5rem;
  right: 4%;
  background: none;
  border: none;
  color: var(--text);
  font-size: 1.5rem;
  cursor: pointer;
}

/* ── HERO ── */

#hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding:0px;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 10% 50%, rgba(68, 136, 255, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 90% 30%, rgba(153, 68, 255, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 80%, rgba(170, 255, 0, 0.05) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(255, 51, 34, 0.04) 0%, transparent 50%),
    var(--bg);
}

#hero .container {
  position: relative;
  z-index: 2;
}

#hero .row {
  align-items: center;
  min-height: 100vh;
}

.hero-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
  background-size: 60px 60px;
}

.rings {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.ring {
  position: absolute;
  border-radius: 50%;
  animation: rp 6s ease-in-out infinite;
}

.r1 {
  width: 600px;
  height: 600px;
  margin: -300px 0 0 -300px;
  border: 1px solid rgba(68, 136, 255, 0.06);
}

.r2 {
  width: 900px;
  height: 900px;
  margin: -450px 0 0 -450px;
  animation-delay: 1s;
  border: 1px solid rgba(153, 68, 255, 0.04);
}

.r3 {
  width: 1200px;
  height: 1200px;
  margin: -600px 0 0 -600px;
  animation-delay: 2s;
  border: 1px solid rgba(170, 255, 0, 0.03);
}

.hero-left {
  position: relative;
  z-index: 2;
  flex: 0 0 58.333%;
  padding-right: 4rem;
}

.hero-right {
  position: relative;
  z-index: 2;
  flex: 0 0 41.667%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  background: linear-gradient(90deg, var(--c-green), var(--c-teal));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 1.5rem;
}

.hero-badge::before,
.hero-badge::after {
  content: '';
  width: 30px;
  height: 1px;
  background: linear-gradient(90deg, var(--c-green), var(--c-teal));
  flex-shrink: 0;
}

.hero-h1 {
  line-height: 0.9;
  margin-bottom: 0.4rem;
}

.hs {
  display: block;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(5rem, 9vw, 9rem);
  color: var(--text);
  letter-spacing: 0.05em;
  opacity: 0;
  transform: translateX(-40px);
  animation: sI 0.8s ease forwards;
}

.hs.s1 { animation-delay: 0.5s; }

.hs.s2 {
  font-family: 'Dancing Script', cursive;
  font-size: clamp(3rem, 5.5vw, 5.5rem);
  letter-spacing: 0;
  animation-delay: 0.7s;
  background: linear-gradient(90deg, var(--c-green), var(--c-teal), var(--c-blue), var(--c-purple));
  background-size: 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradShift 4s linear infinite, sI 0.8s ease forwards 0.7s;
}

.hs.s3 { animation-delay: 0.9s; }

.hero-tag {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  background: linear-gradient(90deg, var(--c-yellow), var(--c-red), var(--c-purple));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin: 0.8rem 0 1.5rem;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.1s;
}

.hero-div {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1.4rem;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.2s;
}

.hero-div .dot {
  width: 6px;
  height: 6px;
  background: var(--c-green);
  transform: rotate(45deg);
  flex-shrink: 0;
}

.hero-div .ln {
  flex: 1;
  height: 1px;
  background: linear-gradient(
    90deg,
    var(--c-green), var(--c-blue), var(--c-purple),
    var(--c-red), var(--c-yellow), transparent
  );
}

.hero-desc {
  font-size: 0.9rem;
  color: var(--muted2);
  line-height: 1.8;
  max-width: 480px;
  margin-bottom: 2rem;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.3s;
}

.hero-stats {
  display: flex;
  gap: 0;
  margin-bottom: 2rem;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.4s;
}

.hst {
  flex: 1;
  padding-left: 1rem;
}

.hst:nth-child(1) { border-left: 2px solid var(--c-green); }
.hst:nth-child(2) { border-left: 2px solid var(--c-blue); }
.hst:nth-child(3) { border-left: 2px solid var(--c-purple); }

.hst .num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.5rem;
  line-height: 1;
}

.hst:nth-child(1) .num { color: var(--c-green); }
.hst:nth-child(2) .num { color: var(--c-blue); }
.hst:nth-child(3) .num { color: var(--c-purple); }

.hst .lbl {
  font-size: 0.65rem;
  color: var(--muted);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 0.2rem;
}

.hero-btns {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.5s;
}

.btn-g {
  background: linear-gradient(135deg, var(--c-green), var(--c-teal));
  color: #050a00;
  padding: 0.85rem 2rem;
  border: none;
  border-radius: 3px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}

.btn-g::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transform: translateX(-100%);
  transition: 0.5s;
}

.btn-g:hover::after { transform: translateX(100%); }

.btn-g:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 30px rgba(170, 255, 0, 0.5);
}

.btn-b {
  background: transparent;
  color: var(--c-blue);
  padding: 0.85rem 2rem;
  border: 1px solid var(--c-blue);
  border-radius: 3px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s;
}

.btn-b:hover {
  background: rgba(68, 136, 255, 0.1);
  transform: translateY(-2px);
  box-shadow: 0 0 20px rgba(68, 136, 255, 0.3);
}

.hero-trust {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  opacity: 0;
  animation: fU 0.8s ease forwards 1.6s;
}

.ti {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  color: var(--muted2);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ti:nth-child(1)::before { content: '●'; color: var(--c-green);  font-size: 0.5rem; }
.ti:nth-child(2)::before { content: '●'; color: var(--c-yellow); font-size: 0.5rem; }
.ti:nth-child(3)::before { content: '●'; color: var(--c-teal);   font-size: 0.5rem; }

/* Blueprint */

.bp-wrap {
  position: relative;
  width: 100%;
  opacity: 0;
  animation: fU 1s ease forwards 0.6s;
}

.bp-wrap svg { width: 100%; height: auto; }

.bpp {
  fill: none;
  stroke: var(--c-green);
  stroke-width: 1.5;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

.bpt {
  fill: none;
  stroke: rgba(170, 255, 0, 0.4);
  stroke-width: 0.8;
}

.bpd {
  fill: none;
  stroke: rgba(255, 255, 255, 0.15);
  stroke-width: 0.8;
  stroke-dasharray: 5 4;
}

.d1  { animation: drw 1.5s ease forwards 1.0s; }
.d2  { animation: drw 1.5s ease forwards 1.3s; }
.d3  { animation: drw 1.2s ease forwards 1.6s; }
.d4  { animation: drw 1.0s ease forwards 1.8s; }
.d5  { animation: drw 1.0s ease forwards 2.0s; }
.d6  { animation: drw 0.8s ease forwards 2.1s; }
.d7  { animation: drw 0.8s ease forwards 2.2s; }
.d8  { animation: drw 0.8s ease forwards 2.3s; }
.d9  { animation: drw 0.7s ease forwards 2.4s; }
.d10 { animation: drw 0.6s ease forwards 2.5s; }
.d11 { animation: drw 0.6s ease forwards 2.6s; }
.d12 { animation: drw 0.6s ease forwards 2.7s; }

.bpdot {
  fill: var(--c-green);
  opacity: 0;
}

.bd1 { animation: plFU 0.3s ease forwards 1.8s; }
.bd2 { animation: plFU 0.3s ease forwards 2.0s; }
.bd3 { animation: plFU 0.3s ease forwards 2.1s; }
.bd4 { animation: plFU 0.3s ease forwards 2.2s; }
.bd5 { animation: plFU 0.3s ease forwards 2.3s; }

.bptxt {
  fill: rgba(170, 255, 0, 0.55);
  font-size: 9px;
  font-family: 'Rajdhani', sans-serif;
  letter-spacing: 1px;
  opacity: 0;
}

.bt1 { animation: plFU 0.4s ease forwards 2.4s; }
.bt2 { animation: plFU 0.4s ease forwards 2.6s; }
.bt3 { animation: plFU 0.4s ease forwards 2.8s; }

.btwm {
  fill: rgba(170, 255, 0, 0.05);
  font-size: 30px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  letter-spacing: 4px;
  opacity: 0;
  animation: plFU 1s ease forwards 3.2s;
}

.roof-glow {
  position: absolute;
  top: 17%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background: var(--c-green);
  border-radius: 50%;
  box-shadow: 0 0 20px var(--c-green), 0 0 40px rgba(170, 255, 0, 0.5);
  opacity: 0;
  animation: plFU 0.3s ease forwards 2s, glow 2s ease-in-out infinite 2.3s;
}

.fcard {
  position: absolute;
  background: rgba(10, 18, 30, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 6px;
  padding: 0.9rem 1.2rem;
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  opacity: 0;
}

.fc1 {
  top: 4%;
  right: 1%;
  animation: fl1 5s ease-in-out infinite, plFU 0.8s ease forwards 3s;
  border-color: rgba(68, 136, 255, 0.4);
}

.fc2 {
  bottom: 7%;
  right: 0%;
  animation: fl2 6s ease-in-out infinite, plFU 0.8s ease forwards 3.3s;
  border-color: rgba(170, 255, 0, 0.4);
}

.fc-lbl {
  font-size: 0.6rem;
  color: var(--muted);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
}

.fc1 .fc-val {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.8rem;
  color: var(--c-blue);
  line-height: 1;
}

.fc2 .fc-val {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.8rem;
  color: var(--c-green);
  line-height: 1;
}

.fc-sub {
  font-size: 0.65rem;
  color: var(--muted2);
  margin-top: 0.2rem;
}
/* ── SHARED SECTION STYLES ── */

.section {
  padding: 6rem 4%;
}

.sec-lbl {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

.sec-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.5rem, 5vw, 4rem);
  letter-spacing: 0.05em;
  line-height: 1;
  margin-bottom: 0.8rem;
}

.sec-sub {
  color: var(--muted2);
  font-size: 0.9rem;
  line-height: 1.8;
  max-width: 520px;
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.reveal.vis {
  opacity: 1;
  transform: translateY(0);
}

.dg {
  width: 50px;
  height: 3px;
  margin: 1rem 0;
  border-radius: 2px;
}

.dg-rainbow {
  width: 80px;
  height: 3px;
  background: linear-gradient(
    90deg,
    var(--c-green),
    var(--c-blue),
    var(--c-purple),
    var(--c-red),
    var(--c-yellow),
    var(--c-teal)
  );
  border-radius: 2px;
  margin: 1rem auto;
}

/* ── STATS ── */

#stats {
  background: var(--bg2);
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  padding: 3.5rem 4%;
  padding-top: 0px;
}

.srow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}

.si {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 2rem;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  position: relative;
}

.si:last-child {
  border-right: none;
}

.si::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  border-radius: 0 0 2px 2px;
}

.si:nth-child(1)::before { background: var(--c-green);  box-shadow: 0 0 15px var(--c-green); }
.si:nth-child(2)::before { background: var(--c-blue);   box-shadow: 0 0 15px var(--c-blue); }
.si:nth-child(3)::before { background: var(--c-purple); box-shadow: 0 0 15px var(--c-purple); }
.si:nth-child(4)::before { background: var(--c-teal);   box-shadow: 0 0 15px var(--c-teal); }

.si:nth-child(1) .si-num { color: var(--c-green); }
.si:nth-child(2) .si-num { color: var(--c-blue); }
.si:nth-child(3) .si-num { color: var(--c-purple); }
.si:nth-child(4) .si-num { color: var(--c-teal); }

.si-icon {
  font-size: 1.6rem;
  margin-bottom: 0.6rem;
  animation: float 3s ease-in-out infinite;
}

.si:nth-child(2) .si-icon { animation-delay: 0.5s; }
.si:nth-child(3) .si-icon { animation-delay: 1s; }
.si:nth-child(4) .si-icon { animation-delay: 1.5s; }

.si-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 3.5rem;
  line-height: 1;
  padding-top: 30px;
}

.si-lbl {
  font-size: 0.7rem;
  color: var(--muted);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-top: 0.3rem;
  text-align: center;
}
/* ── ABOUT ── */

#about {
  background: var(--bg);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  /* align-items: center; */
  padding: 6rem 4%;
}

.aig {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 275px 275px;
  gap: 0.8rem;
  position: relative;
}

.aib {
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s;
}

.aib:nth-child(1) {
  grid-row: 1 / 3;
  border: 1px solid rgba(68, 136, 255, 0.35);
  box-shadow:
    inset 0 0 40px rgba(68, 136, 255, 0.08),
    0 0 0 1px rgba(68, 136, 255, 0.1);
}

.aib:nth-child(2) {
  border: 1px solid rgba(153, 68, 255, 0.35);
  box-shadow: inset 0 0 30px rgba(153, 68, 255, 0.08);
}

.aib:nth-child(3) {
  border: 1px solid rgba(0, 221, 170, 0.35);
  box-shadow: inset 0 0 30px rgba(0, 221, 170, 0.08);
}

.aib:hover {
  transform: scale(1.02);
}

.aib svg {
  opacity: 0.2;
}

.abadge {
  position: absolute;
  bottom: -1rem;
  right: -1rem;
  background: linear-gradient(135deg, var(--c-green), var(--c-teal));
  color: #050a00;
  padding: 1.2rem 1.5rem;
  border-radius: 4px;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  line-height: 1;
  text-align: center;
  box-shadow: 0 0 30px rgba(170, 255, 0, 0.3);
}

.abadge span {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.afs {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 2rem;
}

.afi {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  padding: 0.8rem;
  border-radius: 4px;
  transition: background 0.3s;
}

.afi:hover {
  background: rgba(255, 255, 255, 0.03);
}

.afi:nth-child(1) .afi-ico {
  background: rgba(170, 255, 0, 0.12);
  border: 1px solid rgba(170, 255, 0, 0.3);
  color: var(--c-green);
}

.afi:nth-child(2) .afi-ico {
  background: rgba(68, 136, 255, 0.12);
  border: 1px solid rgba(68, 136, 255, 0.3);
  color: var(--c-blue);
}

.afi:nth-child(3) .afi-ico {
  background: rgba(153, 68, 255, 0.12);
  border: 1px solid rgba(153, 68, 255, 0.3);
  color: var(--c-purple);
}

.afi-ico {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.afi-t h4 {
  font-size: 0.9rem;
  font-weight: 600;
  margin-bottom: 0.2rem;
}

.afi-t p {
  font-size: 0.8rem;
  color: var(--muted2);
  line-height: 1.6;
}
/* ═══════════════════════════════════════
   SERVICES SECTION
═══════════════════════════════════════ */
.services{
  position:relative;z-index:1;
  padding:100px 60px;
  background:var(--dark);overflow:hidden;
}
.services-bg-word{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-family:'Bebas Neue',sans-serif;font-size:18vw;letter-spacing:-10px;
  color:rgba(212,247,18,0.025);pointer-events:none;white-space:nowrap;
}
.services-header{
  display:grid;grid-template-columns:1fr 1fr;gap:40px;
  align-items:end;margin-bottom:64px;
  display: flex;
  justify-content: space-between;
}
.s-desc {
    font-size: 0.96rem;
    font-weight: 300;
    line-height: 1.6;
    color: var(--muted);
    max-width: 360px;
}
.services-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:rgba(212,247,18,0.08);
}
.svc-card{
  background:var(--dark);padding:44px 34px;
  position:relative;overflow:hidden;cursor:pointer;
  transition:background 0.4s;
}
.svc-card::before{
  content:'';position:absolute;bottom:0;left:0;
  width:100%;height:3px;
  transform:scaleX(0);transform-origin:left;
  transition:transform 0.4s;
}
.svc-card:nth-child(1)::before{background:linear-gradient(90deg,var(--lime),var(--green));}
.svc-card:nth-child(2)::before{background:linear-gradient(90deg,var(--cyan),var(--blue));}
.svc-card:nth-child(3)::before{background:linear-gradient(90deg,var(--magenta),var(--red));}
.svc-card:nth-child(4)::before{background:linear-gradient(90deg,var(--violet),var(--blue));}
.svc-card:nth-child(5)::before{background:linear-gradient(90deg,var(--lime),var(--cyan));}
.svc-card:nth-child(6)::before{background:linear-gradient(90deg,var(--magenta),var(--violet));}
.svc-card:hover{background:var(--dark-2);}
.svc-card:hover::before{transform:scaleX(1);}

.svc-num{
  font-family:'Bebas Neue',sans-serif;font-size:3.5rem;line-height:1;
  color:rgba(212,247,18,0.1);margin-bottom:18px;
  transition:color 0.4s;
}
.svc-card:hover .svc-num{color:rgba(212,247,18,0.22);}

.svc-icon{
  width:46px;height:46px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;font-size:1.3rem;
  border:1px solid rgba(255,255,255,0.1);
  transition:border-color 0.3s,background 0.3s;
}
.svc-card:nth-child(1) .svc-icon{border-color:rgba(212,247,18,0.3);background:rgba(212,247,18,0.07);}
.svc-card:nth-child(2) .svc-icon{border-color:rgba(94,250,247,0.3);background:rgba(94,250,247,0.07);}
.svc-card:nth-child(3) .svc-icon{border-color:rgba(204,6,128,0.3);background:rgba(204,6,128,0.07);}
.svc-card:nth-child(4) .svc-icon{border-color:rgba(51,0,102,0.5);background:rgba(51,0,102,0.15);}
.svc-card:nth-child(5) .svc-icon{border-color:rgba(57,167,243,0.3);background:rgba(57,167,243,0.07);}
.svc-card:nth-child(6) .svc-icon{border-color:rgba(212,247,18,0.2);background:rgba(212,247,18,0.05);}

.svc-title{font-size:1.1rem;font-weight:700;margin-bottom:10px;color:var(--white);}
.svc-text{font-size:0.78rem;font-weight:300;color:var(--muted);line-height:1.78;margin-bottom:20px;}
.svc-link{
  font-size:0.64rem;font-weight:700;letter-spacing:3px;
  text-transform:uppercase;color:var(--lime);
  display:flex;align-items:center;gap:8px;text-decoration:none;
  transition:gap 0.3s;
}
.svc-card:nth-child(2) .svc-link{color:var(--cyan);}
.svc-card:nth-child(3) .svc-link{color:var(--magenta);}
.svc-card:nth-child(4) .svc-link{color:var(--blue);}
.svc-link:hover{gap:14px;}
.marquee{
  position:relative;z-index:1;overflow:hidden;white-space:nowrap;
  background:linear-gradient(90deg,var(--lime),var(--cyan),var(--lime));
  background-size:200% auto;
  animation:mBg 6s linear infinite;
  padding:12px 0;
}
@keyframes mBg{to{background-position:200% center;}}
.marquee-inner{display:inline-flex;animation:mScroll 28s linear infinite;}
.marquee-item{
  display:inline-flex;align-items:center;gap:14px;
  padding:0 28px;font-size:0.68rem;font-weight:700;
  letter-spacing:3px;text-transform:uppercase;color:#0E1115;
}
.marquee-sep{opacity:0.5;font-size:0.5rem;}
@keyframes mScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
/* ── PROJECTS ── */
#projects{background:var(--bg3);padding:6rem 4%}
.ph{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:2.5rem}
.va{background:linear-gradient(90deg,var(--c-green),var(--c-teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:0.78rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--c-green);padding-bottom:2px;transition:opacity 0.3s}
.va:hover{opacity:0.7}
.pg{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:0.8rem;height:580px}
.pc{border-radius:6px;overflow:hidden;position:relative;background:var(--bg2);border:1px solid rgba(255,255,255,0.06);transition:all 0.4s;cursor:pointer;display:flex;align-items:flex-end}
.pc:nth-child(1){grid-row:1/3}
.pc-bg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.pc-bg svg{opacity:0.1;width:40%;height:40%}
.pc:nth-child(1) .pc-bg{background:linear-gradient(135deg,rgba(170,255,0,0.05),rgba(0,221,170,0.08))}
.pc:nth-child(2) .pc-bg{background:linear-gradient(135deg,rgba(68,136,255,0.05),rgba(153,68,255,0.08))}
.pc:nth-child(3) .pc-bg{background:linear-gradient(135deg,rgba(255,51,34,0.05),rgba(255,221,0,0.08))}
.pc:nth-child(4) .pc-bg{background:linear-gradient(135deg,rgba(153,68,255,0.05),rgba(68,136,255,0.08))}
.pc:nth-child(5) .pc-bg{background:linear-gradient(135deg,rgba(0,221,170,0.05),rgba(170,255,0,0.08))}
.pc-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,13,20,0.95) 0%,rgba(7,13,20,0.1) 70%,transparent 100%);transition:background 0.4s}
.pc:hover .pc-ov{background:linear-gradient(to top,rgba(7,13,20,0.98) 0%,rgba(7,13,20,0.6) 100%)}
.pc:nth-child(1):hover{border-color:rgba(170,255,0,0.5);box-shadow:0 0 40px rgba(170,255,0,0.08)}
.pc:nth-child(2):hover{border-color:rgba(68,136,255,0.5);box-shadow:0 0 40px rgba(68,136,255,0.08)}
.pc:nth-child(3):hover{border-color:rgba(255,51,34,0.5);box-shadow:0 0 40px rgba(255,51,34,0.08)}
.pc:nth-child(4):hover{border-color:rgba(153,68,255,0.5);box-shadow:0 0 40px rgba(153,68,255,0.08)}
.pc:nth-child(5):hover{border-color:rgba(0,221,170,0.5);box-shadow:0 0 40px rgba(0,221,170,0.08)}
.pc-info{position:relative;z-index:2;padding:1.2rem}
.pc-tag{font-size:0.6rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.25rem 0.7rem;border-radius:20px;display:inline-block;margin-bottom:0.5rem;font-weight:600}
.pc:nth-child(1) .pc-tag{color:var(--c-green);background:rgba(170,255,0,0.1);border:1px solid rgba(170,255,0,0.3)}
.pc:nth-child(2) .pc-tag{color:var(--c-blue);background:rgba(68,136,255,0.1);border:1px solid rgba(68,136,255,0.3)}
.pc:nth-child(3) .pc-tag{color:var(--c-red);background:rgba(255,51,34,0.1);border:1px solid rgba(255,51,34,0.3)}
.pc:nth-child(4) .pc-tag{color:var(--c-purple);background:rgba(153,68,255,0.1);border:1px solid rgba(153,68,255,0.3)}
.pc:nth-child(5) .pc-tag{color:var(--c-teal);background:rgba(0,221,170,0.1);border:1px solid rgba(0,221,170,0.3)}
.pc-name{font-family:'Rajdhani',sans-serif;font-size:1rem;font-weight:700;letter-spacing:0.05em}
.pc-loc{font-size:0.75rem;color:var(--muted2);margin-top:0.2rem}

/* ═══════════════════════════════════════
   SHARED SECTION STYLES
═══════════════════════════════════════ */
.s-eyebrow{
  display:flex;align-items:center;gap:12px;margin-bottom:12px;
}
.s-eyebrow-line{width:34px;height:1px;}
.s-eyebrow-text{font-size:0.62rem;font-weight:700;letter-spacing:5px;text-transform:uppercase;}

.s-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.2rem,4vw,2.4rem);
  letter-spacing:2px;line-height:1;
}
.s-title em{
  font-family:'Dancing Script',cursive;
  font-style:normal;font-size:1.1em;
  margin-left: 5px;
  background: linear-gradient(90deg, #CC0680, #cfc8d6, #39A7F3);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
/* ═══════════════════════════════════════
   PROCESS — 12-month snake timeline
   (from Sahara Homes ref)
═══════════════════════════════════════ */
.process{
  position:relative;z-index:1;
  padding:100px 60px;
  background:var(--dark);overflow:hidden;
}
.process-header{margin-bottom:70px;text-align:center;}

/* Row */
.timeline-row{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;position:relative;margin-bottom:0;
}
/* Horizontal connector */
.timeline-row::before{
  content:'';position:absolute;
  top:35px;left:calc(12.5% + 0px);
  width:75%;height:2px;
  background:linear-gradient(90deg,var(--lime),var(--cyan));
  z-index:0;
}
.timeline-row.row-rev::before{
  background:linear-gradient(90deg,var(--cyan),var(--magenta));
}
.timeline-row.row-3::before{
  background:linear-gradient(90deg,var(--magenta),var(--violet));
}

/* U-turn connector between rows */
.u-turn{
  height:60px;position:relative;
  display:flex;align-items:center;
}
.u-turn-line{
  position:absolute;right:12.5%;
  width:3px;height:60px;
  background:linear-gradient(180deg,var(--cyan),var(--magenta));
}
.u-turn-line.ul2{left:12.5%;right:auto;background:linear-gradient(180deg,var(--magenta),var(--violet));}

.timeline-step{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;padding:0 10px;position:relative;z-index:1;
}
.ts-circle{
  width:70px;height:70px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:1.1rem;
  letter-spacing:2px;margin-bottom:16px;
  position:relative;
  transition:transform 0.3s;
}
.ts-circle:hover{transform:scale(1.1);}
/* Color per row */
.row-1 .ts-circle{
  background:var(--dark-2);
  border:2px solid var(--lime);color:var(--lime);
  box-shadow:0 0 20px rgba(212,247,18,0.15);
}
.row-rev .ts-circle{
  background:var(--dark-2);
  border:2px solid var(--cyan);color:var(--cyan);
  box-shadow:0 0 20px rgba(94,250,247,0.15);
}
.row-3 .ts-circle{
  background:var(--dark-2);
  border:2px solid var(--magenta);color:var(--magenta);
  box-shadow:0 0 20px rgba(204,6,128,0.15);
}
/* Inner dot */
.ts-circle::after{
  content:'';position:absolute;
  width:8px;height:8px;border-radius:50%;top:8px;right:8px;
}
.row-1 .ts-circle::after{background:var(--lime);}
.row-rev .ts-circle::after{background:var(--cyan);}
.row-3 .ts-circle::after{background:var(--magenta);}

.ts-month{font-size:0.85rem;font-weight:700;margin-bottom:4px;}
.row-1 .ts-month{color:var(--lime);}
.row-rev .ts-month{color:var(--cyan);}
.row-3 .ts-month{color:var(--magenta);}

.ts-label{font-size:0.72rem;color:var(--muted);line-height:1.5;}

/* ═══════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════ */
.testimonials{
  position:relative;z-index:1;
  padding:100px 60px;
}
.testi-header{text-align:center;margin-bottom:60px;}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.testi-card{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;padding:32px;
  transition:border-color 0.3s,transform 0.3s;
}
.testi-card:hover{border-color:rgba(212,247,18,0.25);transform:translateY(-6px);}
.testi-quote{
  font-size:2.2rem;line-height:1;margin-bottom:14px;
  background:linear-gradient(135deg,var(--lime),var(--cyan));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.stars{color:var(--lime);font-size:0.8rem;margin-bottom:12px;}
.testi-text{font-size:0.83rem;color:rgba(255,255,255,0.6);line-height:1.78;margin-bottom:24px;}
.testi-author{display:flex;align-items:center;gap:14px;}
.testi-av{
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:0.9rem;flex-shrink:0;
}
.testi-name{font-weight:700;font-size:0.85rem;}
.testi-loc{font-size:0.68rem;color:var(--muted);}


/* ═══════════════════════════════════════
   CTA SECTION
═══════════════════════════════════════ */
.cta-section{
  position:relative;z-index:1;
  padding:100px 60px;text-align:center;
  overflow:hidden;
  background:var(--dark);
}
.cta-glow-bg{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 70% at 50% 50%,rgba(0,193,0,0.08),transparent 70%);
}
.cta-orbit{
  position:absolute;border-radius:50%;border:1px solid;opacity:0.08;
  animation:orbitSpin 25s linear infinite;
}
.cta-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.5rem,6vw,5rem);
  letter-spacing:3px;line-height:1;margin-bottom:16px;
  position:relative;
}
.cta-title span{
  background:linear-gradient(120deg,var(--lime) 0%,var(--cyan) 50%,var(--magenta) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.cta-sub{font-size:0.85rem;color:var(--muted);margin-bottom:44px;position:relative;}
.cta-form{
  display:flex;gap:12px;justify-content:center;
  flex-wrap:wrap;position:relative;
}
.cta-input{
  padding:15px 28px;border-radius:12px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  color:var(--white);font-family:'Montserrat',sans-serif;
  font-size:0.85rem;outline:none;min-width:260px;
  transition:border-color 0.3s;
}
.cta-input:focus{border-color:var(--lime);}
.cta-input::placeholder{color:rgba(255,255,255,0.28);}
.btn-primary::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--cyan), var(--lime));
    opacity: 0;
    transition: opacity 0.3s;
}
.btn-primary span {
    position: relative;
    z-index: 1;
}
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 38px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--lime), var(--cyan));
    color: #0E1115;
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-decoration: none;
    border: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
}
/* ── FOOTER ── */

footer {
  background: #030710;
  position: relative;
  overflow: hidden;
}

footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--c-green), var(--c-blue), var(--c-purple),
    var(--c-red), var(--c-yellow), var(--c-teal), var(--c-green)
  );
  background-size: 200%;
  animation: gradShift 4s linear infinite;
}

.footer-inner {
  padding: 4rem 4% 0;
}

.fg2 {
  display: grid;
  grid-template-columns: 2.5fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}

.fb p {
  font-size: 0.83rem;
  color: var(--muted2);
  line-height: 1.8;
  margin-top: 0.8rem;
  max-width: 580px;
}
.newsletter p{
   font-size: 0.83rem;
  color: var(--muted2);
  line-height: 1.8;
  margin-top: 0.8rem;
}
.fc-col h4 {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.fc-col:nth-child(2) h4 { color: var(--c-green); }
.fc-col:nth-child(3) h4 { color: var(--c-blue); }
.fc-col:nth-child(4) h4 { color: var(--c-purple); }

.fc-col ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding-left: 0px;
}

.fc-col ul a {
  font-size: 0.82rem;
  color: var(--muted2);
  text-decoration: none;
  transition: color 0.3s;
}

.fc-col:nth-child(2) ul a:hover { color: var(--c-green); }
.fc-col:nth-child(3) ul a:hover { color: var(--c-blue); }
.fc-col:nth-child(4) ul a:hover { color: var(--c-purple); }

.fbot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 1.5rem 4% 2rem;
  flex-wrap: wrap;
  gap: 1rem;
}

.fbot p {
  font-size: 0.75rem;
  color: var(--muted);
}

.socs {
  display: flex;
  gap: 0.8rem;
}

.soc {
  width: 36px;
  height: 36px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted2);
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 700;
  transition: all 0.3s;
}

.soc:nth-child(1):hover {
  border-color: var(--c-blue);
  color: var(--c-blue);
  background: rgba(68, 136, 255, 0.1);
  box-shadow: 0 0 12px rgba(68, 136, 255, 0.2);
}

.soc:nth-child(2):hover {
  border-color: var(--c-purple);
  color: var(--c-purple);
  background: rgba(153, 68, 255, 0.1);
  box-shadow: 0 0 12px rgba(153, 68, 255, 0.2);
}

.soc:nth-child(3):hover {
  border-color: var(--c-red);
  color: var(--c-red);
  background: rgba(255, 51, 34, 0.1);
  box-shadow: 0 0 12px rgba(255, 51, 34, 0.2);
}

.soc:nth-child(4):hover {
  border-color: var(--c-green);
  color: var(--c-green);
  background: rgba(170, 255, 0, 0.1);
  box-shadow: 0 0 12px rgba(170, 255, 0, 0.2);
}
.footer-logo{
  width: 264px;
}
.newsletter p{
    color:var(--muted2);
    line-height:1.9;
    margin-bottom:28px;
}

.newsletter-form{
    display:flex;
    border:1px solid rgba(255,255,255,.15);
    overflow:hidden;
    height:42px;
}

.newsletter-form input{
    flex:1;
    background:transparent;
    border:0;
    color:#fff;
    padding:0 22px;
    font-size:16px;
    outline:none;
}

.newsletter-form input::placeholder{
    color:#8d8d8d;
}

.newsletter-form button{
    width:70px;
    border:0;
    cursor:pointer;
    color:#111;
    font-size:20px;
    background:linear-gradient(135deg,var(--c-green),var(--c-teal));
}
.footer-links{
  display: flex;
  gap:24px;
}
.footer-links a{
     font-size: 0.68rem;
    color: rgba(245, 240, 232, 0.3);
    text-decoration: none;
    transition: color 0.3s;
}
#hero .ring{
  background:transparent !important;
}
.timel/* ── BROCHURE SECTION ── */
#brochure{
  padding-bottom: 100px !important;
}
#brochure{background:radial-gradient(ellipse at 5% 60%,rgba(153,68,255,0.12) 0%,transparent 45%),radial-gradient(ellipse at 95% 20%,rgba(170,255,0,0.08) 0%,transparent 45%),var(--bg);padding:6rem 6%;position:relative;overflow:hidden}
#brochure::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,0.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.015) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
#brochure::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--c-green),var(--c-blue),var(--c-purple),var(--c-red),var(--c-yellow),var(--c-teal),var(--c-green));background-size:200%;animation:gradShift 4s linear infinite}
.brochure-inner{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}

/* BOOK STAGE */
.book-stage{display:flex;align-items:center;justify-content:center;height:500px;perspective:900px;position:relative}

/* RING */
@keyframes ringRotate{to{transform:rotate(360deg)}}
@keyframes ringPulse{0%,100%{opacity:0.5;transform:scale(0.95)}50%{opacity:1;transform:scale(1.05)}}
.ring-wrap{position:absolute;width:340px;height:340px;animation:ringPulse 3s ease-in-out infinite;pointer-events:none}
.ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid transparent;background:linear-gradient(#070d14,#070d14) padding-box,conic-gradient(from 0deg,var(--c-green),var(--c-blue),var(--c-purple),var(--c-red),var(--c-yellow),var(--c-teal),var(--c-green)) border-box;animation:ringRotate 6s linear infinite}
.ring2{position:absolute;inset:18px;border-radius:50%;border:1px solid transparent;background:linear-gradient(#070d14,#070d14) padding-box,conic-gradient(from 180deg,var(--c-teal),var(--c-yellow),var(--c-red),var(--c-purple),var(--c-blue),var(--c-green),var(--c-teal)) border-box;animation:ringRotate 10s linear infinite reverse;opacity:0.5}

/* GLOW */
.book-glow{position:absolute;width:280px;height:340px;background:radial-gradient(ellipse at 40% 55%,rgba(170,255,0,0.25) 0%,rgba(68,136,255,0.12) 45%,transparent 70%);filter:blur(35px);border-radius:40% 60% 50% 50%;animation:ringPulse 4s ease-in-out infinite 0.5s}

/* SPARKLES */
@keyframes spark{0%{opacity:1;transform:scale(1) translateY(0)}100%{opacity:0;transform:scale(0) translateY(-30px)}}
.sparks{position:absolute;inset:0;pointer-events:none}
.spark{position:absolute;width:5px;height:5px;border-radius:50%;animation:spark 2s ease-out infinite}
.spark:nth-child(1){left:30%;top:25%;background:var(--c-green);animation-delay:0s}
.spark:nth-child(2){left:70%;top:20%;background:var(--c-blue);animation-delay:0.4s}
.spark:nth-child(3){left:20%;top:65%;background:var(--c-yellow);animation-delay:0.8s}
.spark:nth-child(4){left:75%;top:70%;background:var(--c-teal);animation-delay:1.2s}
.spark:nth-child(5){left:50%;top:15%;background:var(--c-purple);animation-delay:0.6s}
.spark:nth-child(6){left:85%;top:45%;background:var(--c-red);animation-delay:1.5s}
.spark:nth-child(7){left:15%;top:40%;background:var(--c-green);animation-delay:1.8s}

/* BADGES */
@keyframes badgeBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.fbadge{position:absolute;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:0.72rem;letter-spacing:0.08em;padding:0.5rem 0.85rem;border-radius:8px;background:rgba(6,12,22,0.97);border:1px solid;z-index:20;box-shadow:0 8px 30px rgba(0,0,0,0.6);backdrop-filter:blur(12px)}
.fb1{top:55px;right:10px;border-color:rgba(170,255,0,0.4);color:var(--c-green);animation:badgeBob 3.5s ease-in-out infinite}
.fb2{bottom:85px;right:5px;border-color:rgba(68,136,255,0.4);color:var(--c-blue);animation:badgeBob 4.2s ease-in-out infinite 0.7s}
.fb3{bottom:155px;left:5px;border-color:rgba(255,221,0,0.4);color:var(--c-yellow);animation:badgeBob 3.8s ease-in-out infinite 1.3s}

/* 3D BOOK */
@keyframes bookBob{0%,100%{transform:rotateX(10deg) rotateY(-32deg) translateY(0px)}50%{transform:rotateX(10deg) rotateY(-32deg) translateY(-20px)}}
.book-floater{position:relative;z-index:10;transform-style:preserve-3d;animation:bookBob 5s ease-in-out infinite}
.book3d{width:210px;height:295px;position:relative;transform-style:preserve-3d}
.bface{position:absolute;backface-visibility:hidden}
.b-front{position:absolute;width:210px;height:295px;transform:translateZ(14px);border-radius:1px 7px 7px 1px;overflow:hidden;display:flex;flex-direction:column;background:#060c18;box-shadow:4px 0 20px rgba(0,0,0,0.5)}
.b-front::after{content:'';position:absolute;top:0;left:0;right:0;height:3.5px;z-index:4;background:linear-gradient(90deg,var(--c-green),var(--c-blue),var(--c-purple),var(--c-red),var(--c-yellow),var(--c-teal));background-size:200%;animation:gradShift 3s linear infinite}
.b-img{width:100%;height:155px;object-fit:cover;display:block;filter:brightness(0.62) saturate(1.15)}
.b-overlay{position:absolute;top:0;left:0;right:0;height:155px;background:linear-gradient(135deg,rgba(68,136,255,0.18),rgba(153,68,255,0.12));z-index:1;mix-blend-mode:screen}
.b-gradient-mid{position:absolute;top:145px;left:0;right:0;height:25px;background:linear-gradient(to bottom,transparent,#060c18);z-index:2}
@keyframes shimmer{0%{left:-120%}100%{left:150%}}
.b-shine{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}
.b-shine::after{content:'';position:absolute;top:0;left:-120%;width:50%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,0.07),transparent);animation:shimmer 5s ease-in-out infinite 2s}
.b-info{flex:1;background:linear-gradient(160deg,#060e1e,#020610);padding:0.85rem 1rem 1rem;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.b-info::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,0.012) 0,rgba(255,255,255,0.012) 1px,transparent 1px,transparent 16px)}
.b-eye{font-family:'Rajdhani',sans-serif;font-size:0.48rem;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;background:linear-gradient(90deg,var(--c-green),var(--c-teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:0.2rem}
.b-t1{font-family:'Bebas Neue',sans-serif;font-size:1.7rem;letter-spacing:0.1em;line-height:0.9;margin-bottom:0.1rem;background:linear-gradient(90deg,var(--c-yellow),var(--c-green),var(--c-teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.b-t2{font-family:'Rajdhani',sans-serif;font-size:0.6rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:0.65rem}
.b-rule{height:1px;background:linear-gradient(90deg,rgba(255,255,255,0.08),transparent);margin-bottom:0.5rem}
.b-row{display:flex;align-items:center;gap:0.4rem}
.b-hex{width:14px;height:14px;clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:conic-gradient(from 0deg,#4488ff,#9944ff,#ff3322,#ffdd00,#aaff00,#00ddaa,#4488ff);animation:spin 6s linear infinite;flex-shrink:0}
.b-bname{font-family:'Rajdhani',sans-serif;font-size:0.46rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.3)}
.b-spine{position:absolute;width:28px;height:295px;left:0;top:0;transform:rotateY(-90deg) translateZ(0px);transform-origin:left center;background:linear-gradient(to right,#020408,#0b1624);overflow:hidden;display:flex;align-items:center;justify-content:center}
.b-spine::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(to bottom,var(--c-green),var(--c-blue),var(--c-purple),var(--c-red),var(--c-yellow),var(--c-teal));opacity:0.9}
.b-spine::after{content:'';position:absolute;top:0;right:0;width:1px;height:100%;background:rgba(255,255,255,0.04)}
.b-stxt{font-family:'Rajdhani',sans-serif;font-size:0.44rem;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:rgba(255,255,255,0.45);writing-mode:vertical-rl;transform:rotate(180deg);padding-left:4px}
.b-back{position:absolute;width:210px;height:295px;transform:translateZ(-14px);background:#02050a;border-radius:1px 7px 7px 1px}
.b-top{position:absolute;width:210px;height:28px;left:0;top:0;transform:rotateX(90deg) translateZ(14px);transform-origin:top center;background:#0a1628;display:flex;align-items:center;padding:0 10px;gap:4px}
.ptop{width:1px;height:16px;background:rgba(255,255,255,0.06)}
.b-btm{position:absolute;width:210px;height:28px;left:0;bottom:0;transform:rotateX(-90deg) translateZ(14px);transform-origin:bottom center;background:linear-gradient(90deg,#0a1628,#040810)}
.book-shadow{position:absolute;bottom:-40px;left:50%;transform:translateX(-40%);width:240px;height:30px;background:rgba(0,0,0,0.5);filter:blur(22px);border-radius:50%;animation:ringPulse 5s ease-in-out infinite}

/* RIGHT CONTENT */
.brochure-lbl{font-family:'Rajdhani',sans-serif;font-size:0.66rem;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;color:var(--c-green);display:flex;align-items:center;gap:0.55rem;margin-bottom:0.9rem}
.brochure-lbl::after{content:'';flex:1;height:1px;max-width:50px;background:linear-gradient(90deg,var(--c-green),transparent)}
.brochure-h2{font-family:'Dancing Script',cursive;font-size:clamp(2rem,3.2vw,2.85rem);line-height:1.12;margin-bottom:0.9rem;background:linear-gradient(90deg,#fff,rgba(255,255,255,0.68));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.brochure-rule{width:55px;height:3px;background:linear-gradient(90deg,var(--c-green),var(--c-blue),var(--c-purple));border-radius:2px;margin-bottom:1.1rem}
.brochure-desc{font-size:0.85rem;color:var(--muted2);line-height:1.85;margin-bottom:1.8rem}
.inside-lbl{font-family:'Rajdhani',sans-serif;font-size:0.6rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:var(--muted);margin-bottom:0.7rem}
.inside-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.42rem;margin-bottom:1.8rem}
.inside-item{display:flex;align-items:center;gap:0.5rem;font-size:0.76rem;color:var(--muted2);padding:0.52rem 0.7rem;border-radius:5px;border:1px solid rgba(255,255,255,0.05);background:rgba(255,255,255,0.02);transition:all 0.3s}
.inside-item:hover{background:rgba(255,255,255,0.045);border-color:rgba(255,255,255,0.12);transform:translateX(4px)}
.idot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.dl-row{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.btn-dl{display:inline-flex;align-items:center;gap:0.65rem;background:linear-gradient(135deg,var(--c-green),var(--c-teal));color:#030a00;padding:0.95rem 2.1rem;border-radius:5px;font-family:'Rajdhani',sans-serif;font-size:0.86rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;transition:all 0.3s;position:relative;overflow:hidden}
.btn-dl::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.22),transparent);transform:translateX(-120%);transition:0.6s}
.btn-dl:hover::before{transform:translateX(120%)}
.btn-dl:hover{box-shadow:0 0 40px rgba(170,255,0,0.6),0 8px 30px rgba(0,0,0,0.3);transform:translateY(-2px)}
.btn-ic{width:26px;height:26px;background:rgba(0,0,0,0.2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.82rem;flex-shrink:0}
.dl-note{font-size:0.7rem;color:var(--muted);line-height:1.65}
.dl-note strong{display:block;color:var(--muted2);font-weight:500;font-size:0.75rem}
@media(max-width:860px){.brochure-inner{grid-template-columns:1fr;gap:3rem}.book-stage{height:400px}.fbadge{display:none}}ine-wrap{position:relative;}