/* ─── DESIGN TOKENS — STRIPE SYSTEM ──────────────────────────────────────── */
:root {
  /* === PURPLE GRADIENT SYSTEM — STRIPE SIGNATURE === */
  --purple-900:   #0B041C;
  --purple-800:   #150833;
  --purple-700:   #3B1E75;
  --purple-600:   #4C2896;
  --purple-500:   #6D28D9;
  --purple-400:   #7C3AED;
  --purple-300:   #8B5CF6;
  --purple-200:   #A78BFA;
  --purple-100:   #DDD6FE;
  --purple-50:    #EDE9FE;

  /* === GRADIENT DEFINITIONS === */
  --grad-hero:    linear-gradient(135deg, #0A0118 0%, #1E0A3C 40%, #2D1158 100%);
  --grad-primary: linear-gradient(135deg, #8B5CF6 0%, #EC4899 100%);
  --grad-glow:    radial-gradient(ellipse at 50% 0%, rgba(236,72,153,0.4) 0%, transparent 70%);
  --grad-card:    linear-gradient(145deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.02) 100%);
  --grad-text:    linear-gradient(90deg, #A78BFA, #EC4899, #8B5CF6);
  background-size: 200% auto;
  animation: gradientText 3s linear infinite;

  /* === CANVAS — LIGHT MODE === */
  --white:        #FFFFFF;
  --slate-50:     #F8FAFC;
  --slate-100:    #F1F5F9;
  --slate-200:    #E2E8F0;
  --slate-300:    #CBD5E1;
  --slate-400:    #94A3B8;
  --slate-500:    #64748B;
  --slate-600:    #475569;
  --slate-700:    #334155;
  --slate-800:    #1E293B;
  --slate-900:    #0F172A;

  /* === AKSEN WARNA === */
  --indigo:       #4F46E5;
  --blue:         #0EA5E9;
  --cyan:         #06B6D4;
  --emerald:      #10B981;
  --amber:        #F59E0B;
  --rose:         #F43F5E;
  --pink:         #EC4899;

  /* === TEKS DI ATAS DARK BACKGROUND === */
  --text-on-dark-primary:   #FFFFFF;
  --text-on-dark-secondary: rgba(255,255,255,0.70);
  --text-on-dark-muted:     rgba(255,255,255,0.45);
  --text-on-dark-ghost:     rgba(255,255,255,0.25);

  /* === TEKS DI ATAS LIGHT BACKGROUND === */
  --text-primary:   #0F172A;
  --text-secondary: #334155;
  --text-muted:     #64748B;
  --text-ghost:     #94A3B8;

  /* === BORDER DI DARK === */
  --border-dark:     rgba(255,255,255,0.08);
  --border-dark-md:  rgba(255,255,255,0.14);
  --border-dark-strong: rgba(255,255,255,0.22);

  /* === TIPOGRAFI === */
  --font-display: 'Instrument Serif', 'Georgia', serif;
  --font-sans:    'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;

  --text-display-xl: clamp(2.5rem, 7vw, 5rem);
  --text-display:    clamp(2rem,   5vw, 3.5rem);
  --text-h1:         clamp(1.625rem,3vw,2.25rem);
  --text-h2:         clamp(1.25rem, 2.5vw,1.75rem);
  --text-h3:         1.125rem;
  --text-body:       1rem;
  --text-sm:         0.9375rem;
  --text-xs:         0.8125rem;
  --text-micro:      0.75rem;

  --fw-thin:        300;
  --fw-regular:     400;
  --fw-medium:      500;
  --fw-semibold:    600;
  --fw-bold:        700;

  --ls-tight:   -0.02em;
  --ls-normal:   0;
  --ls-wide:     0.04em;
  --ls-caps:     0.08em;

  /* === SPACING (8px grid) === */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px;
  --s6:24px; --s8:32px; --s10:40px; --s12:48px; --s16:64px;
  --s20:80px; --s24:96px; --s32:128px;

  /* === BORDER RADIUS === */
  --r-sm:    6px;
  --r-md:    10px;
  --r-lg:    14px;
  --r-xl:    20px;
  --r-2xl:   28px;
  --r-pill:  9999px;
  --r-circle:50%;

  /* === LAYOUT === */
  --max-w:        1180px;
  --max-w-narrow: 760px;
  --nav-h:        64px;
  --px:           clamp(1rem, 5vw, 2rem);
  --section-py:   clamp(4rem, 10vw, 7rem);

  /* === SHADOW & GLOW === */
  --shadow-card:    0 0 0 1px var(--border-dark), 0 4px 24px rgba(0,0,0,0.4);
  --shadow-hover:   0 0 0 1px var(--border-dark-md), 0 8px 40px rgba(109,40,217,0.3);
  --shadow-glow:    0 0 60px rgba(124,58,237,0.4);
  --shadow-btn:     0 4px 20px rgba(109,40,217,0.5);
  --shadow-modal:   0 0 0 1px var(--border-dark), 0 24px 80px rgba(0,0,0,0.6);

  /* === ANIMASI === */
  --ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --t-fast:  150ms;
  --t-base:  250ms;
  --t-slow:  450ms;
}

/* ─── RESET ─────────────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  color: var(--text-on-dark-primary);
  background: linear-gradient(135deg, #0D0221 0%, #1A0533 40%, #0D1B4B 100%);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display:block; max-width:100%; object-fit:cover }
button { cursor:pointer; border:none; background:none; font-family:inherit }
a { color:inherit; text-decoration:none }
input, select, textarea { font-family:inherit }
ul { list-style:none }

/* ─── UTILITIES ─────────────────────────────────────────────────────────── */
.container { width:100%; max-width:var(--max-w); margin:0 auto; padding:0 var(--px) }
.container--narrow { max-width:var(--max-w-narrow) }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0) }
.truncate-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.hidden { display:none!important }
.text-gradient { background:var(--grad-text); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text }
.section-label {
  display:inline-block; font-size:var(--text-xs); font-weight:var(--fw-semibold);
  color:var(--purple-200); text-transform:uppercase; letter-spacing:var(--ls-caps);
  margin-bottom:var(--s4);
}

/* ─── ANIMATE ON SCROLL ─────────────────────────────────────────────────── */
.aos { opacity:0; transform:translateY(28px); transition:opacity var(--t-slow) var(--ease-out), transform var(--t-slow) var(--ease-out) }
.aos.visible { opacity:1; transform:translateY(0) }
.aos-left  { transform:translateX(-28px) }
.aos-right { transform:translateX(28px) }
.aos.visible.aos-left, .aos.visible.aos-right { transform:translateX(0) }

/* ═══════════════════════════════════════════════════════════════════════════
   BUTTON SYSTEM
   ═══════════════════════════════════════════════════════════════════════════ */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--s2); font-family:var(--font-sans);
  font-weight:var(--fw-semibold); border-radius:var(--r-pill);
  transition:all var(--t-base); cursor:pointer; border:none;
  white-space:nowrap;
}
.btn--primary {
  background:var(--grad-primary);
  background-size: 200% auto;
  color:white;
  box-shadow:var(--shadow-btn);
  transition: all 0.4s ease;
}
.btn--primary:hover {
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 10px 40px rgba(236,72,153,0.6);
  background-position: right center;
}
.btn--outline {
  background:transparent;
  color:var(--text-on-dark-primary);
  border:1px solid var(--border-dark-strong);
}
.btn--outline:hover {
  background:rgba(255,255,255,0.06);
  border-color:var(--purple-300);
}
.btn--ghost {
  background:rgba(124,58,237,0.12);
  color:var(--purple-200);
}
.btn--ghost:hover { background:rgba(124,58,237,0.22); }
.btn--lg { padding:var(--s4) var(--s8); font-size:var(--text-body); }
.btn--md { padding:var(--s3) var(--s6); font-size:var(--text-sm); }
.btn--sm { padding:var(--s2) var(--s4); font-size:var(--text-xs); }

/* ═══════════════════════════════════════════════════════════════════════════
   NAVBAR
   ═══════════════════════════════════════════════════════════════════════════ */
.navbar {
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  height:var(--nav-h);
  background:transparent;
  transition:background var(--t-base), backdrop-filter var(--t-base), border-bottom var(--t-base);
}
.navbar.scrolled {
  background:rgba(15,1,40,0.85);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border-dark);
}
.navbar__inner {
  display:flex; align-items:center; justify-content:space-between;
  height:100%;
}
.navbar__logo {
  font-weight:var(--fw-bold);
  font-size:1.125rem;
  color:var(--text-on-dark-primary);
  display:flex; align-items:center; gap:var(--s2);
}
.navbar__logo span { color:var(--purple-200); }
.navbar__menu { display:flex; gap:var(--s8); }
.navbar__menu a {
  font-size:var(--text-sm);
  color:var(--text-on-dark-secondary);
  font-weight:var(--fw-medium);
  transition:color var(--t-fast);
}
.navbar__menu a:hover { color:var(--text-on-dark-primary); }
.navbar__hamburger {
  display:none; flex-direction:column; gap:5px; width:24px;
}
.navbar__hamburger span {
  display:block; height:2px;
  background:var(--text-on-dark-primary);
  transition:transform var(--t-base);
}
.navbar__mobile {
  position:fixed;
  top:var(--nav-h); left:0; right:0;
  background:var(--purple-900);
  border-bottom:1px solid var(--border-dark);
  padding:var(--s6) var(--px);
  z-index:99;
}
.navbar__mobile ul { display:flex; flex-direction:column; gap:var(--s4); }
.navbar__mobile a {
  display:block; padding:var(--s3) 0;
  color:var(--text-on-dark-secondary);
  font-weight:var(--fw-medium);
  font-size:var(--text-body);
}
.navbar__mobile a:hover { color:var(--text-on-dark-primary); }

@media (max-width:767px) {
  .navbar__menu { display:none; }
  .navbar__cta-desktop { display:none!important; }
  .navbar__hamburger { display:flex; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════════════════════════ */
.hero {
  position:relative;
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  text-align:center;
  padding:calc(var(--nav-h) + var(--s12)) var(--px) var(--s16);
  overflow:hidden;
}
.hero__bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:1; opacity:0.25;
}
.hero__overlay {
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(to bottom, rgba(10,1,24,0.5) 0%, rgba(10,1,24,0.95) 100%);
}
.hero__glow {
  position:absolute; inset:0; z-index:3;
  background:var(--grad-glow); pointer-events:none;
}
.hero__grid {
  position:absolute; inset:0; z-index:4;
  background-image:
    linear-gradient(rgba(139,92,246,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139,92,246,0.08) 1px, transparent 1px);
  background-size:60px 60px;
  pointer-events:none;
  animation: gridMove 20s linear infinite;
}
@keyframes gridMove { 0% { transform: translateY(0); } 100% { transform: translateY(60px); } }
.hero__content {
  position:relative; z-index:5;
  max-width:860px; margin:0 auto;
}
.hero__badge {
  display:inline-flex; align-items:center; gap:var(--s2);
  padding:var(--s2) var(--s5);
  border:1px solid var(--purple-600); border-radius:var(--r-pill);
  color:var(--purple-200); font-size:var(--text-xs);
  font-weight:var(--fw-medium); letter-spacing:var(--ls-wide);
  text-transform:uppercase; margin-bottom:var(--s8);
  background:rgba(124,58,237,0.1);
}
.hero__title {
  font-family:var(--font-display);
  text-shadow: 0 0 40px rgba(139,92,246,0.5);
  font-size:var(--text-display-xl);
  font-weight:var(--fw-thin);
  line-height:1.05; letter-spacing:var(--ls-tight);
  color:var(--text-on-dark-primary);
  margin-bottom:var(--s4);
}
.hero__year { display:block; }
.hero__sub {
  font-size:var(--text-h2); font-weight:var(--fw-thin);
  color:var(--text-on-dark-secondary);
  margin-bottom:var(--s10);
  line-height:1.4;
}

/* Countdown */
.countdown {
  display:flex; justify-content:center; align-items:center;
  gap:var(--s3); margin-bottom:var(--s10); flex-wrap:wrap;
}
.countdown__unit {
  background:rgba(255,255,255,0.05);
  border:1px solid var(--border-dark-md);
  border-radius:var(--r-xl); padding:var(--s5) var(--s4);
  min-width:80px; text-align:center;
  backdrop-filter:blur(8px);
}
.countdown__number {
  display:block; font-size:2.5rem; font-weight:var(--fw-bold);
  color:white; line-height:1; font-variant-numeric:tabular-nums;
}
.countdown__label {
  display:block; font-size:var(--text-micro); margin-top:var(--s1);
  color:var(--text-on-dark-muted); text-transform:uppercase;
  letter-spacing:var(--ls-caps);
}
.countdown__sep {
  font-size:2rem; color:var(--purple-400); line-height:1;
  align-self:flex-start; margin-top:var(--s3);
}
@keyframes flipIn {
  from { transform:rotateX(-90deg); opacity:0; }
  to   { transform:rotateX(0);      opacity:1; }
}
.countdown__number.flip { animation:flipIn 0.3s var(--ease-out); }

/* Hero CTA + quick stats */
.hero__cta { display:flex; gap:var(--s4); justify-content:center; flex-wrap:wrap; margin-bottom:var(--s10); }
.hero__quick-stats { display:flex; gap:var(--s8); justify-content:center; flex-wrap:wrap; }
.hero__quick-stats span {
  color:var(--text-on-dark-muted); font-size:var(--text-sm);
  display:flex; align-items:center; gap:var(--s2);
}
.hero__quick-stats i { color:var(--purple-400); }

/* Scroll indicator */
.hero__scroll {
  position:absolute; bottom:var(--s8); left:50%; transform:translateX(-50%);
  z-index:5; display:flex; flex-direction:column; align-items:center; gap:var(--s2);
  color:var(--text-on-dark-muted); font-size:var(--text-micro);
  text-transform:uppercase; letter-spacing:var(--ls-caps);
  animation:bounce 2s infinite;
}
@keyframes bounce {
  0%,100% { transform:translateX(-50%) translateY(0) }
  50%     { transform:translateX(-50%) translateY(8px) }
}

/* ═══════════════════════════════════════════════════════════════════════════
   TICKER
   ═══════════════════════════════════════════════════════════════════════════ */
.ticker {
  background:rgba(109,40,217,0.15);
  border-top:1px solid var(--border-dark);
  border-bottom:1px solid var(--border-dark);
  padding:var(--s3) 0;
  overflow:hidden;
  display:flex; align-items:center;
}
.ticker__label {
  flex-shrink:0; padding:0 var(--s4);
  font-size:var(--text-xs); font-weight:var(--fw-semibold);
  color:var(--purple-200); text-transform:uppercase;
  letter-spacing:var(--ls-caps); border-right:1px solid var(--border-dark);
  margin-right:var(--s4); display:flex; align-items:center; gap:var(--s2);
}
.ticker__track { display:flex; gap:var(--s12); animation:ticker 28s linear infinite; }
.ticker__track:hover { animation-play-state:paused; }
.ticker__item {
  white-space:nowrap; font-size:var(--text-sm);
  color:var(--text-on-dark-secondary);
  display:flex; align-items:center; gap:var(--s2);
}
.ticker__item i { color:var(--purple-300); }
@keyframes ticker {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   STATS
   ═══════════════════════════════════════════════════════════════════════════ */
.stats {
  background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%);
  border-top:1px solid var(--border-dark);
  border-bottom:1px solid var(--border-dark);
  padding:var(--s12) 0;
}
.stats__grid {
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:0;
}
.stats__item {
  text-align:center; padding:var(--s6) var(--s4);
  border-right:1px solid var(--border-dark);
  display:flex; flex-direction:column; align-items:center; gap:var(--s2);
}
.stats__item:last-child { border-right:none; }
.stats__icon {
  font-size:28px; color:var(--purple-300);
  margin-bottom:var(--s1);
}
.stats__value {
  font-size:var(--text-display);
  font-weight:var(--fw-bold);
  background:var(--grad-text);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
  line-height:1.1;
}
.stats__label {
  font-size:var(--text-xs); color:var(--text-on-dark-muted);
  text-transform:uppercase; letter-spacing:var(--ls-caps);
}

@media (max-width:1023px) {
  .stats__grid { grid-template-columns:repeat(3, 1fr); }
  .stats__item:nth-child(3) { border-right:none; }
  .stats__item:nth-child(1), .stats__item:nth-child(2), .stats__item:nth-child(3) {
    border-bottom:1px solid var(--border-dark);
  }
}
@media (max-width:639px) {
  .stats__grid { grid-template-columns:repeat(2, 1fr); }
  .stats__item { border-right:none; border-bottom:1px solid var(--border-dark); }
  .stats__item:nth-child(odd) { border-right:1px solid var(--border-dark); }
  .stats__item:nth-last-child(-n+2) { border-bottom:none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ABOUT
   ═══════════════════════════════════════════════════════════════════════════ */
.about {
  position:relative;
  padding:var(--section-py) 0;
  background:var(--purple-900);
  overflow:hidden;
}
.about__grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--s16);
  align-items:center;
}
.about__text { position:relative; z-index:2; }
.about__heading {
  font-family:var(--font-display);
  font-style:italic;
  font-size:var(--text-display);
  font-weight:var(--fw-thin);
  line-height:1.2;
  color:var(--text-on-dark-primary);
  margin-bottom:var(--s6);
}
.about__desc {
  color:var(--text-on-dark-secondary);
  font-size:var(--text-body);
  line-height:1.7;
  margin-bottom:var(--s6);
}
.about__bullets {
  display:flex; flex-direction:column; gap:var(--s3);
  margin-bottom:var(--s8);
}
.about__bullets li {
  display:flex; align-items:flex-start; gap:var(--s3);
  color:var(--text-on-dark-secondary); font-size:var(--text-sm);
}
.about__bullets li i { color:var(--purple-400); margin-top:2px; flex-shrink:0; }
.about__cta { display:flex; gap:var(--s4); flex-wrap:wrap; }

/* About — Visual kanan */
.about__visual { position:relative; z-index:2; }
.about__card-main {
  position:relative; border-radius:var(--r-xl);
  overflow:hidden; margin-bottom:var(--s4);
}
.about__card-main img { width:100%; height:auto; display:block; }
.about__card-overlay {
  position:absolute; bottom:0; left:0; right:0;
  padding:var(--s6);
  background:linear-gradient(to top, rgba(10,1,24,0.9), transparent);
  display:flex; flex-direction:column; gap:var(--s1);
}
.about__card-overlay strong {
  font-family:var(--font-display);
  font-size:var(--text-h2); font-weight:var(--fw-thin);
  color:var(--text-on-dark-primary);
}
.about__card-overlay span {
  font-size:var(--text-sm); color:var(--purple-200);
}

.about__mini-cards {
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s3);
}
.about__mini-card {
  background:rgba(255,255,255,0.06);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--border-dark-md);
  border-radius:var(--r-lg);
  padding:var(--s4);
  display:flex; flex-direction:column; align-items:center; gap:var(--s2);
  text-align:center;
  transition:border-color var(--t-base);
}
.about__mini-card:hover { border-color:var(--purple-400); }
.about__mini-card i { font-size:20px; color:var(--purple-300); }
.about__mini-card span { font-size:var(--text-xs); color:var(--text-on-dark-secondary); }

/* About — Glow decoration */
.about__glow {
  position:absolute; width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(124,58,237,0.12), transparent);
  pointer-events:none;
}
.about__glow--tr { top:-100px; right:-100px; }
.about__glow--bl { bottom:-80px; left:-80px; }

@media (max-width:1023px) {
  .about__grid { grid-template-columns:1fr; gap:var(--s10); }
}
@media (max-width:639px) {
  .about__mini-cards { grid-template-columns:1fr 1fr 1fr; }
  .about__mini-card { padding:var(--s3); }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SECTION HEADER (shared)
   ═══════════════════════════════════════════════════════════════════════════ */
.section-header {
  text-align:center; margin-bottom:var(--s16);
}
.section-title {
  font-family:var(--font-display);
  font-size:var(--text-display);
  font-weight:var(--fw-thin);
  color:var(--text-on-dark-primary);
  line-height:1.1; letter-spacing:var(--ls-tight);
  margin-bottom:var(--s4);
}
.section-sub {
  font-size:var(--text-h3); font-weight:var(--fw-thin);
  color:var(--text-on-dark-secondary); max-width:560px; margin:0 auto;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SPEAKERS
   ═══════════════════════════════════════════════════════════════════════════ */
.speakers-section {
  padding:var(--section-py) 0;
  background:var(--purple-900);
}
.speakers-grid {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:var(--s6);
}
@media (max-width:1023px) { .speakers-grid { grid-template-columns:repeat(2, 1fr); } }
@media (max-width:599px)  { .speakers-grid { grid-template-columns:1fr; } }

.speaker-card {
  background:var(--grad-card);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border:1px solid var(--border-dark);
  border-radius:var(--r-xl);
  padding:var(--s8) var(--s6);
  text-align:center;
  transition:border-color var(--t-base), transform var(--t-base), box-shadow var(--t-base);
  cursor:pointer;
}
.speaker-card:hover {
  border-color:var(--purple-500);
  box-shadow:var(--shadow-hover);
  transform:translateY(-6px);
}
.speaker-card--keynote {
  grid-column:span 2;
  display:flex; align-items:center; gap:var(--s8);
  text-align:left;
  background:linear-gradient(135deg, rgba(109,40,217,0.2), rgba(79,70,229,0.1));
  border-color:var(--purple-500);
}
@media (max-width:1023px) { .speaker-card--keynote { grid-column:span 2; } }
@media (max-width:599px)  { .speaker-card--keynote { grid-column:span 1; flex-direction:column; text-align:center; } }

.speaker-avatar {
  width:120px; height:120px;
  border-radius:var(--r-circle);
  animation: float-anim 6s ease-in-out infinite;
  object-fit:cover; flex-shrink:0; margin:0 auto var(--s5);
  border:2px solid transparent;
  background-image:linear-gradient(var(--purple-700), var(--purple-700)),
                    linear-gradient(135deg, var(--purple-400), var(--indigo));
  background-origin:border-box;
  background-clip:padding-box, border-box;
  box-shadow:0 0 24px rgba(124,58,237,0.3);
}
.speaker-card--keynote .speaker-avatar {
  width:160px; height:160px; margin:0;
}
@media (max-width:599px) {
  .speaker-card--keynote .speaker-avatar { margin:0 auto var(--s5); }
}
.speaker-badge-keynote {
  display:inline-flex; align-items:center; gap:var(--s1);
  padding:var(--s1) var(--s3);
  background:var(--grad-primary); border-radius:var(--r-pill);
  font-size:10px; font-weight:var(--fw-semibold);
  color:white; margin-bottom:var(--s3);
}
.speaker-name {
  font-size:var(--text-h3); font-weight:var(--fw-semibold);
  color:var(--text-on-dark-primary); margin-bottom:var(--s1);
}
.speaker-title { font-size:var(--text-xs); color:var(--purple-200); margin-bottom:var(--s1); }
.speaker-company { font-size:var(--text-micro); color:var(--text-on-dark-muted); margin-bottom:var(--s4); }
.speaker-topic {
  font-size:var(--text-sm); color:var(--text-on-dark-secondary);
  font-style:italic; margin-bottom:var(--s4); line-height:1.5;
}
.speaker-tags {
  display:flex; flex-wrap:wrap; gap:var(--s2); justify-content:center; margin-bottom:var(--s5);
}
.speaker-card--keynote .speaker-tags { justify-content:flex-start; }
@media (max-width:599px) { .speaker-card--keynote .speaker-tags { justify-content:center; } }
.tag-pill {
  padding:var(--s1) var(--s3); border-radius:var(--r-pill);
  font-size:10px; font-weight:var(--fw-medium);
  background:rgba(124,58,237,0.2); color:var(--purple-200);
  border:1px solid var(--purple-600);
}

/* ═══════════════════════════════════════════════════════════════════════════
   MODAL
   ═══════════════════════════════════════════════════════════════════════════ */
.modal-overlay {
  position:fixed; inset:0; z-index:200;
  background:rgba(10,1,24,0.8);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  padding:var(--s4);
}
.modal-content {
  background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%);
  border:1px solid var(--border-dark);
  border-radius:var(--r-2xl);
  max-width:640px; width:100%;
  padding:var(--s8);
  position:relative;
  box-shadow:var(--shadow-modal);
  max-height:90vh;
  overflow-y:auto;
}
.modal-close {
  position:absolute; top:var(--s4); right:var(--s4);
  width:36px; height:36px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--r-circle);
  background:rgba(255,255,255,0.06);
  color:var(--text-on-dark-secondary);
  font-size:18px;
  transition:background var(--t-fast);
}
.modal-close:hover { background:rgba(255,255,255,0.12); }

.modal-speaker-header {
  display:flex; align-items:center; gap:var(--s5);
  margin-bottom:var(--s6);
}
.modal-speaker-avatar {
  width:100px; height:100px;
  border-radius:var(--r-circle);
  object-fit:cover; flex-shrink:0;
  border:2px solid var(--purple-500);
  box-shadow:0 0 20px rgba(124,58,237,0.3);
}
.modal-speaker-info { flex:1; }
.modal-speaker-name {
  font-size:var(--text-h1); font-weight:var(--fw-semibold);
  color:var(--text-on-dark-primary); line-height:1.2; margin-bottom:var(--s1);
}
.modal-speaker-title { font-size:var(--text-sm); color:var(--purple-200); }
.modal-speaker-company { font-size:var(--text-xs); color:var(--text-on-dark-muted); margin-top:var(--s1); }
.modal-speaker-links { display:flex; gap:var(--s2); margin-top:var(--s3); }
.modal-speaker-link {
  display:inline-flex; align-items:center; gap:var(--s1);
  padding:var(--s1) var(--s3); border-radius:var(--r-pill);
  font-size:var(--text-micro); color:var(--purple-200);
  background:rgba(124,58,237,0.15);
  transition:background var(--t-fast);
}
.modal-speaker-link:hover { background:rgba(124,58,237,0.3); }

.modal-divider {
  border:none; border-top:1px solid var(--border-dark);
  margin:var(--s6) 0;
}
.modal-section-label {
  font-size:var(--text-micro); font-weight:var(--fw-semibold);
  text-transform:uppercase; letter-spacing:var(--ls-caps);
  color:var(--purple-300); margin-bottom:var(--s3);
}
.modal-topic {
  font-size:var(--text-body); color:var(--text-on-dark-primary);
  font-style:italic; line-height:1.6; margin-bottom:var(--s3);
}
.modal-schedule-meta {
  display:flex; gap:var(--s4); flex-wrap:wrap;
  margin-bottom:var(--s2);
}
.modal-schedule-meta span {
  display:flex; align-items:center; gap:var(--s1);
  font-size:var(--text-xs); color:var(--text-on-dark-secondary);
}
.modal-schedule-meta i { color:var(--purple-300); }
.modal-bio {
  font-size:var(--text-sm); color:var(--text-on-dark-secondary);
  line-height:1.7;
}
.modal-tags { display:flex; gap:var(--s2); flex-wrap:wrap; margin:var(--s6) 0; }
.modal-cta { display:flex; gap:var(--s3); flex-wrap:wrap; }

/* ═══════════════════════════════════════════════════════════════════════════
   SCHEDULE / JADWAL
   ═══════════════════════════════════════════════════════════════════════════ */
.schedule-section {
  padding:var(--section-py) 0;
  background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%);
}
.schedule-controls { margin-bottom:var(--s8); }

.schedule-day-tabs {
  display:flex; gap:var(--s3); margin-bottom:var(--s5);
  flex-wrap:wrap;
}
.schedule-day-tab {
  display:flex; flex-direction:column; gap:2px;
  padding:var(--s3) var(--s8); border-radius:var(--r-pill);
  font-weight:var(--fw-medium); font-size:var(--text-sm);
  cursor:pointer; transition:all var(--t-base);
  border:1px solid var(--border-dark-md);
  color:var(--text-on-dark-secondary);
  text-align:left;
}
.schedule-day-tab.active {
  background:var(--grad-primary); color:white;
  border-color:transparent; box-shadow:var(--shadow-btn);
}
.schedule-day-tab__date {
  font-size:var(--text-xs); opacity:0.7;
}

.track-filters {
  display:flex; gap:var(--s2); overflow-x:auto;
  padding-bottom:var(--s2);
  -webkit-overflow-scrolling:touch;
}
.track-filters::-webkit-scrollbar { height:4px; }
.track-filters::-webkit-scrollbar-thumb { background:var(--purple-600); border-radius:2px; }
.track-filter {
  display:flex; align-items:center; gap:var(--s2);
  padding:var(--s2) var(--s4); border-radius:var(--r-pill);
  font-size:var(--text-xs); font-weight:var(--fw-medium);
  border:1px solid var(--border-dark); white-space:nowrap;
  cursor:pointer; transition:all var(--t-fast);
  color:var(--text-on-dark-secondary);
}
.track-filter.active, .track-filter:hover {
  border-color:var(--purple-400); color:white;
}
.track-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }

.schedule-list { display:flex; flex-direction:column; gap:var(--s3); }

.schedule-item {
  display:grid; grid-template-columns:140px 1fr auto;
  gap:var(--s4); align-items:start;
  padding:var(--s4) var(--s6); border-radius:var(--r-lg);
  border:1px solid var(--border-dark);
  background:rgba(255,255,255,0.02);
  transition:border-color var(--t-fast), background var(--t-fast);
  position:relative; overflow:hidden;
}
.schedule-item:hover {
  border-color:var(--border-dark-md); background:rgba(255,255,255,0.04);
}
.schedule-item::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
}
.schedule-item--keynote::before,
.schedule-item--panel::before,
.schedule-item--ceremony::before { background:var(--purple-400); }
.schedule-item--keynote {
  background:linear-gradient(90deg, rgba(109,40,217,0.15), transparent);
  border-color:var(--purple-600);
}
.schedule-item--workshop::before { background:var(--amber); }
.schedule-item--talk::before { background:var(--track-color, var(--blue)); }
.schedule-item--lightning::before { background:var(--rose); }
.schedule-item--break {
  opacity:0.6; background:transparent;
}
.schedule-item--break::before { background:var(--text-on-dark-ghost); }
.schedule-item--registration::before { background:var(--text-on-dark-muted); }
.schedule-item--special {
  background:linear-gradient(90deg, rgba(184,134,11,0.1), transparent);
  border-color:rgba(184,134,11,0.3);
}
.schedule-item--special::before { background:#B8860B; }

.schedule-time {
  font-size:var(--text-xs); color:var(--text-on-dark-muted);
  font-weight:var(--fw-medium); font-variant-numeric:tabular-nums;
  padding-top:2px;
}
.schedule-title {
  font-size:var(--text-sm); font-weight:var(--fw-semibold);
  color:var(--text-on-dark-primary); margin-bottom:var(--s1);
  line-height:1.4;
}
.schedule-meta {
  font-size:var(--text-xs); color:var(--text-on-dark-muted);
  display:flex; gap:var(--s3); flex-wrap:wrap; margin-top:var(--s2);
}
.schedule-meta i { font-size:14px; }
.schedule-badge {
  padding:2px var(--s3); border-radius:var(--r-pill);
  font-size:10px; font-weight:var(--fw-semibold);
  white-space:nowrap; flex-shrink:0;
}
.badge--keynote   { background:rgba(124,58,237,0.2); color:var(--purple-200); }
.badge--workshop  { background:rgba(245,158,11,0.15); color:#FCD34D; }
.badge--panel     { background:rgba(16,185,129,0.15); color:#6EE7B7; }
.badge--lightning { background:rgba(244,63,94,0.15); color:#FDA4AF; animation:pulse-badge 1.5s infinite; }
.badge--special   { background:rgba(184,134,11,0.2); color:#FCD34D; }
.badge--ceremony  { background:rgba(124,58,237,0.15); color:var(--purple-200); }
@keyframes pulse-badge { 0%,100% { opacity:1 } 50% { opacity:0.5 } }

.schedule-speaker {
  display:flex; align-items:center; gap:var(--s2); flex-shrink:0;
}
.schedule-speaker-avatar {
  width:32px; height:32px; border-radius:50%;
  object-fit:cover; border:1px solid var(--purple-600);
}
.schedule-speaker-name {
  font-size:var(--text-xs); color:var(--purple-200); white-space:nowrap;
}
.schedule-right {
  display:flex; flex-direction:column; align-items:flex-end; gap:var(--s2);
}

@media (max-width:767px) {
  .schedule-item { grid-template-columns:1fr; }
  .schedule-time { font-size:var(--text-micro); }
  .schedule-right { flex-direction:row; align-items:center; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   TICKETS
   ═══════════════════════════════════════════════════════════════════════════ */
.tickets-section { padding:var(--section-py) 0; background:var(--purple-900); }
.tickets-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s5); }
@media(max-width:1023px){ .tickets-grid{ grid-template-columns:repeat(2,1fr) } }
@media(max-width:599px){  .tickets-grid{ grid-template-columns:1fr } }
.ticket-card {
  background:var(--grad-card); border:1px solid var(--border-dark);
  border-radius:var(--r-xl); padding:var(--s8) var(--s6);
  position:relative; display:flex; flex-direction:column;
  transition:border-color var(--t-base), transform var(--t-base), box-shadow var(--t-base);
}
.ticket-card:hover:not(.ticket-card--sold) { border-color:var(--purple-500); box-shadow:var(--shadow-hover); transform:translateY(-4px); }
.ticket-card--vip { border:1px solid var(--purple-500); background:linear-gradient(145deg, rgba(79,46,136,0.4), rgba(29,15,58,0.8)); box-shadow:var(--shadow-glow); }
.ticket-card--sold { opacity:0.5; }
.ticket-badge { position:absolute; top:var(--s4); right:var(--s4); padding:var(--s1) var(--s3); border-radius:var(--r-pill); font-size:10px; font-weight:var(--fw-bold); background:var(--grad-primary); color:white; }
.ticket-badge--gold { background:linear-gradient(135deg, #B8860B, #F59E0B); }
.ticket-name { font-size:var(--text-h2); font-weight:var(--fw-bold); color:var(--text-on-dark-primary); margin-bottom:var(--s2); }
.ticket-desc { font-size:var(--text-sm); color:var(--text-on-dark-muted); margin-bottom:var(--s6); line-height:1.5; }
.ticket-price { font-size:var(--text-display); font-weight:var(--fw-bold); margin-bottom:var(--s1); }
.ticket-price-original { font-size:var(--text-sm); color:var(--text-on-dark-muted); text-decoration:line-through; margin-bottom:var(--s1); }
.ticket-price-note { font-size:var(--text-micro); color:var(--text-on-dark-ghost); margin-bottom:var(--s6); }
.ticket-divider { border:none; border-top:1px solid var(--border-dark); margin:var(--s4) 0; }
.ticket-benefits { margin-bottom:var(--s6); display:flex; flex-direction:column; gap:var(--s3); }
.ticket-benefit { display:flex; align-items:flex-start; gap:var(--s3); font-size:var(--text-sm); color:var(--text-on-dark-secondary); }
.ticket-benefit i { color:var(--emerald); flex-shrink:0; margin-top:2px; }
.ticket-quota-label { display:flex; justify-content:space-between; font-size:var(--text-xs); margin-bottom:var(--s2); }
.quota-bar-bg { background:rgba(124,58,237,0.15); border-radius:var(--r-pill); height:6px; margin-bottom:var(--s6); overflow:hidden; }
.quota-bar-fill { height:6px; border-radius:var(--r-pill); transition:width 1s var(--ease-out); }
.ticket-card .btn { margin-top:auto; width:100%; justify-content:center; }

/* ═══════════════════════════════════════════════════════════════════════════
   VENUE
   ═══════════════════════════════════════════════════════════════════════════ */
.venue-section { padding:var(--section-py) 0; background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%); }
.venue-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--s10); align-items:start; }
@media(max-width:1023px){ .venue-grid{ grid-template-columns:1fr } }
.venue-main-photo { position:relative; border-radius:var(--r-xl); overflow:hidden; margin-bottom:var(--s3); }
.venue-main-photo img { width:100%; height:auto; }
.venue-photo-badge { position:absolute; bottom:var(--s4); left:var(--s4); padding:var(--s2) var(--s4); border-radius:var(--r-pill); background:rgba(10,1,24,0.8); backdrop-filter:blur(8px); font-size:var(--text-xs); font-weight:var(--fw-semibold); color:var(--text-on-dark-primary); }
.venue-thumbs { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s3); }
.venue-thumbs img { width:100%; border-radius:var(--r-lg); aspect-ratio:3/2; object-fit:cover; }
.venue-info-list { display:flex; flex-direction:column; gap:var(--s5); margin-bottom:var(--s6); }
.venue-info-list li { display:flex; align-items:flex-start; gap:var(--s3); }
.venue-info-list i { color:var(--purple-300); font-size:20px; margin-top:2px; flex-shrink:0; }
.venue-info-list span { font-size:var(--text-sm); color:var(--text-on-dark-secondary); line-height:1.6; }
.venue-map-placeholder { border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--border-dark); }
.venue-map-placeholder img { width:100%; height:auto; }

/* ═══════════════════════════════════════════════════════════════════════════
   SPONSORS
   ═══════════════════════════════════════════════════════════════════════════ */
.sponsors-section { padding:var(--section-py) 0; background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%); }
.sponsor-tier { margin-bottom:var(--s10); }
.sponsor-tier-label { text-align:center; font-size:var(--text-xs); font-weight:var(--fw-semibold); color:var(--text-on-dark-muted); text-transform:uppercase; letter-spacing:var(--ls-caps); margin-bottom:var(--s5); }
.sponsor-logos { display:flex; justify-content:center; align-items:center; gap:var(--s8); flex-wrap:wrap; }
.sponsor-logo { display:block; border-radius:var(--r-md); transition:filter var(--t-base), opacity var(--t-base); filter:brightness(0) invert(0.6); opacity:0.6; }
.sponsor-logo:hover { filter:none; opacity:1; }
.sponsor-logo img { display:block; }
.sponsors-cta { text-align:center; margin-top:var(--s10); padding-top:var(--s8); border-top:1px solid var(--border-dark); }
.sponsors-cta p { font-size:var(--text-sm); color:var(--text-on-dark-muted); margin-bottom:var(--s4); }

/* ═══════════════════════════════════════════════════════════════════════════
   TESTIMONIALS
   ═══════════════════════════════════════════════════════════════════════════ */
.testimonials-section { padding:var(--section-py) 0; background:var(--purple-900); }
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s6); }
@media(max-width:1023px){ .testimonials-grid{ grid-template-columns:repeat(2,1fr) } }
@media(max-width:639px){  .testimonials-grid{ grid-template-columns:1fr } }
.testimonial-card { background:var(--grad-card); border:1px solid var(--border-dark); border-radius:var(--r-xl); padding:var(--s8); transition:border-color var(--t-base), transform var(--t-base); }
.testimonial-card:hover { border-color:var(--purple-500); transform:translateY(-4px); }
.testimonial-quote { font-size:48px; line-height:1; color:var(--purple-400); opacity:0.3; font-family:var(--font-display); margin-bottom:var(--s2); }
.testimonial-text { font-size:var(--text-sm); color:var(--text-on-dark-secondary); font-style:italic; line-height:1.7; margin-bottom:var(--s5); }
.testimonial-stars { color:var(--amber); font-size:14px; margin-bottom:var(--s5); }
.testimonial-author { display:flex; align-items:center; gap:var(--s3); padding-top:var(--s4); border-top:1px solid var(--border-dark); }
.testimonial-avatar { width:48px; height:48px; border-radius:var(--r-circle); background:var(--grad-primary); display:flex; align-items:center; justify-content:center; font-weight:var(--fw-bold); font-size:var(--text-sm); color:white; flex-shrink:0; }
.testimonial-name { font-weight:var(--fw-semibold); font-size:var(--text-sm); color:var(--text-on-dark-primary); }
.testimonial-role { font-size:var(--text-xs); color:var(--text-on-dark-muted); }

/* ═══════════════════════════════════════════════════════════════════════════
   FAQ
   ═══════════════════════════════════════════════════════════════════════════ */
.faq-section { padding:var(--section-py) 0; background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%); }
.faq-list { max-width:var(--max-w-narrow); margin:0 auto; }
.faq-item { border-bottom:1px solid var(--border-dark); padding:var(--s5) 0; }
.faq-header { display:flex; justify-content:space-between; align-items:center; cursor:pointer; gap:var(--s4); transition:color var(--t-fast); }
.faq-header:hover .faq-question { color:var(--purple-200); }
.faq-question { font-weight:var(--fw-semibold); font-size:var(--text-body); color:var(--text-on-dark-primary); transition:color var(--t-fast); }
.faq-icon { font-size:20px; color:var(--purple-300); flex-shrink:0; transition:transform var(--t-base); }
.faq-item.active .faq-icon { transform:rotate(45deg); }
.faq-body { max-height:0; overflow:hidden; transition:max-height 0.35s var(--ease-out), padding 0.35s var(--ease-out); }
.faq-item.active .faq-body { max-height:500px; }
.faq-answer { padding-top:var(--s4); font-size:var(--text-sm); color:var(--text-on-dark-secondary); line-height:1.7; }

/* ═══════════════════════════════════════════════════════════════════════════
   REGISTRATION
   ═══════════════════════════════════════════════════════════════════════════ */
.register-section { padding:var(--section-py) 0; background:var(--purple-900); position:relative; }
.register-wrapper { max-width:640px; margin:0 auto; background:var(--grad-card); border:1px solid var(--border-dark); border-radius:var(--r-2xl); padding:var(--s12) var(--s10); position:relative; }
.register-wrapper::before { content:''; position:absolute; top:-80px; left:50%; transform:translateX(-50%); width:400px; height:400px; border-radius:50%; background:radial-gradient(circle, rgba(124,58,237,0.12), transparent); pointer-events:none; z-index:-1; }
.reg-steps { display:flex; align-items:center; justify-content:center; gap:0; margin-bottom:var(--s10); }
.reg-step { display:flex; flex-direction:column; align-items:center; gap:var(--s2); }
.reg-step-circle { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:var(--text-sm); font-weight:var(--fw-bold); border:2px solid var(--border-dark-md); color:var(--text-on-dark-muted); background:transparent; transition:all var(--t-base); }
.reg-step.active .reg-step-circle { background:var(--grad-primary); border-color:transparent; color:white; box-shadow:var(--shadow-btn); }
.reg-step.done .reg-step-circle { background:var(--emerald); border-color:transparent; color:white; }
.reg-step-label { font-size:var(--text-xs); color:var(--text-on-dark-muted); white-space:nowrap; }
.reg-step.active .reg-step-label { color:var(--purple-200); font-weight:var(--fw-medium); }
.reg-step-line { width:60px; height:1px; background:var(--border-dark); margin-bottom:var(--s5); }
.form-group { margin-bottom:var(--s6); }
.form-label { display:block; font-size:var(--text-sm); font-weight:var(--fw-medium); color:var(--text-on-dark-secondary); margin-bottom:var(--s2); }
.form-input, .form-select, .form-textarea { width:100%; padding:var(--s3) var(--s4); background:rgba(255,255,255,0.05); border:1px solid var(--border-dark-md); border-radius:var(--r-md); color:var(--text-on-dark-primary); font-family:var(--font-sans); font-size:var(--text-sm); transition:border-color var(--t-fast), background var(--t-fast); }
.form-input:focus, .form-select:focus, .form-textarea:focus { outline:none; border-color:var(--purple-400); background:rgba(124,58,237,0.08); box-shadow:0 0 0 3px rgba(124,58,237,0.15); }
.form-input.error, .form-select.error { border-color:var(--rose); }
.form-error { font-size:var(--text-xs); color:var(--rose); margin-top:var(--s1); display:none; }
.form-error.visible { display:block; }
.form-select option { background: linear-gradient(180deg, #1A0533 0%, #0D0221 100%); }
.form-textarea { resize:vertical; min-height:100px; }
.ticket-radio-group { display:flex; flex-direction:column; gap:var(--s3); }
.ticket-radio { display:flex; align-items:center; gap:var(--s4); padding:var(--s4) var(--s5); border-radius:var(--r-lg); border:1px solid var(--border-dark); cursor:pointer; transition:border-color var(--t-fast), background var(--t-fast); }
.ticket-radio:hover:not(.ticket-radio--sold) { border-color:var(--purple-500); background:rgba(124,58,237,0.06); }
.ticket-radio.selected { border-color:var(--purple-400); background:rgba(124,58,237,0.1); }
.ticket-radio--sold { opacity:0.4; cursor:not-allowed; }
.ticket-radio input[type="radio"] { accent-color:var(--purple-400); width:18px; height:18px; flex-shrink:0; }
.ticket-radio-name { font-weight:var(--fw-semibold); color:var(--text-on-dark-primary); }
.ticket-radio-price { margin-left:auto; font-weight:var(--fw-bold); color:var(--purple-200); white-space:nowrap; }
.reg-summary { background:rgba(255,255,255,0.04); border:1px solid var(--border-dark); border-radius:var(--r-lg); padding:var(--s6); margin-bottom:var(--s6); }
.reg-summary-row { display:flex; justify-content:space-between; align-items:center; font-size:var(--text-sm); padding:var(--s2) 0; border-bottom:1px solid var(--border-dark); }
.reg-summary-row:last-child { border-bottom:none; font-weight:var(--fw-bold); font-size:var(--text-body); }
.reg-summary-row span:first-child { color:var(--text-on-dark-muted); }
.reg-summary-row span:last-child { color:var(--text-on-dark-primary); }
.form-nav { display:flex; justify-content:space-between; gap:var(--s4); margin-top:var(--s8); }
.form-nav .btn { flex:1; justify-content:center; }

/* ═══════════════════════════════════════════════════════════════════════════
   TOAST
   ═══════════════════════════════════════════════════════════════════════════ */
#toast-container { position:fixed; top:var(--s8); right:var(--s8); z-index:300; display:flex; flex-direction:column; gap:var(--s2); }
.toast { padding:var(--s3) var(--s6); border-radius:var(--r-lg); font-size:var(--text-sm); color:white; transform:translateX(120%); transition:transform var(--t-base); }
.toast--show { transform:translateX(0); }
.toast--error { background:var(--rose); }
.toast--info { background:var(--purple-500); }
.toast--success { background:var(--emerald); }
@keyframes toastIn  { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@keyframes toastOut { from{opacity:1;transform:translateY(0)} to{opacity:0;transform:translateY(12px)} }

/* ═══════════════════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════════════════ */
.footer { background:var(--purple-900); border-top:1px solid var(--border-dark); }
.footer-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s10); padding:var(--s16) 0; }
@media(max-width:1023px){ .footer-grid{ grid-template-columns:repeat(2,1fr) } }
@media(max-width:599px){  .footer-grid{ grid-template-columns:1fr } }
.footer-col {}
.footer-logo { font-weight:var(--fw-bold); font-size:1.125rem; color:var(--text-on-dark-primary); display:flex; align-items:center; gap:var(--s2); margin-bottom:var(--s3); }
.footer-logo span { color:var(--purple-200); }
.footer-tagline { font-size:var(--text-sm); color:var(--text-on-dark-muted); font-style:italic; margin-bottom:var(--s5); }
.footer-socials { display:flex; gap:var(--s2); }
.footer-socials a {
  width:36px; height:36px; border-radius:var(--r-pill);
  display:flex; align-items:center; justify-content:center;
  background:rgba(124,58,237,0.1); border:1px solid var(--border-dark);
  color:var(--purple-200); font-size:16px;
  transition:background var(--t-fast), border-color var(--t-fast);
}
.footer-socials a:hover { background:rgba(124,58,237,0.25); border-color:var(--purple-400); }
.footer-col-title {
  font-size:var(--text-xs); font-weight:var(--fw-semibold);
  text-transform:uppercase; letter-spacing:var(--ls-caps);
  color:var(--purple-300); margin-bottom:var(--s4);
}
.footer-links { display:flex; flex-direction:column; gap:var(--s3); }
.footer-links a { font-size:var(--text-sm); color:var(--text-on-dark-muted); transition:color var(--t-fast); display:flex; align-items:center; gap:var(--s2); }
.footer-links a:hover { color:var(--text-on-dark-primary); }
.footer-links a i { font-size:16px; color:var(--purple-300); }
.footer-bottom {
  border-top:1px solid var(--border-dark); padding:var(--s6) 0;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--s3);
  font-size:var(--text-xs); color:var(--text-on-dark-muted);
}
.footer-bottom a { color:var(--purple-300); }
.footer-bottom a:hover { color:var(--purple-200); }

/* ═══════════════════════════════════════════════════════════════════════════
   FLOATING BUTTONS
   ═══════════════════════════════════════════════════════════════════════════ */
#wa-float {
  position:fixed; bottom:var(--s6); right:var(--s6); z-index:50;
  width:54px; height:54px; border-radius:var(--r-circle);
  background:#25D366; color:white; font-size:22px;
  box-shadow:0 4px 20px rgba(37,211,102,0.4);
  display:flex; align-items:center; justify-content:center;
  transition:transform var(--t-base), box-shadow var(--t-base);
}
#wa-float:hover { transform:scale(1.1); box-shadow:0 8px 32px rgba(37,211,102,0.5); }

#back-top {
  position:fixed; bottom:calc(var(--s6) + 64px); right:var(--s6); z-index:50;
  width:40px; height:40px; border-radius:var(--r-circle);
  background:rgba(124,58,237,0.2); border:1px solid var(--border-dark-md);
  color:var(--purple-200); font-size:16px;
  display:flex; align-items:center; justify-content:center;
  transition:all var(--t-base); opacity:0; pointer-events:none;
}
#back-top.visible { opacity:1; pointer-events:auto; }
#back-top:hover { background:rgba(124,58,237,0.4); transform:translateY(-3px); }

/* ═══════════════════════════════════════════════════════════════════════════
   PHASE 6 — POLISH · SCROLL SPY · ACCESSIBILITY
   ═══════════════════════════════════════════════════════════════════════════ */

/* Scroll spy active link */
.navbar__menu a.active { color:var(--text-on-dark-primary); position:relative; }
.navbar__menu a.active::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:2px; background:var(--grad-primary); border-radius:var(--r-pill);
}

/* Focus ring for accessibility */
:focus-visible { outline:2px solid var(--purple-400); outline-offset:3px; border-radius:var(--r-sm); }
button:focus-visible, a:focus-visible { outline:2px solid var(--purple-400); }

/* Selection color */
::selection { background:rgba(124,58,237,0.35); color:white; }

/* Scrollbar styling */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:var(--purple-900); }
::-webkit-scrollbar-thumb { background:var(--purple-600); border-radius:var(--r-pill); }
::-webkit-scrollbar-thumb:hover { background:var(--purple-400); }

/* Lazy load transition */
img[loading="lazy"] { transition:filter var(--t-slow); }

@keyframes float-anim {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}
.floating { animation: float-anim 4s ease-in-out infinite; }