/* ══════════════════════════════════════════════════════════
   LCR SOFTWARE — MAIN CSS — Cyber-Elite 2026 Design
   Dark + Light themes, all public components
   ══════════════════════════════════════════════════════════ */

/* ── CSS VARIABLES — DARK (DEFAULT) ── */
:root {
  --bg:        #020209;
  --bg1:       #06060f;
  --bg2:       #0a0a18;
  --surface:   rgba(255,255,255,0.028);
  --surface-h: rgba(255,255,255,0.055);
  --border:    rgba(255,255,255,0.065);
  --border-h:  rgba(0,245,255,0.35);
  --cyan:      #00f5ff;
  --cyan-d:    #00c8d4;
  --cyan-glow: rgba(0,245,255,0.18);
  --amber:     #ff7d00;
  --amber-d:   #e06800;
  --amber-glow:rgba(255,125,0,0.18);
  --purple:    #9b5cf6;
  --purple-glow:rgba(155,92,246,0.18);
  --red:       #ff4444;
  --green:     #00ff88;
  --text:      #dde0f0;
  --text-2:    #7878a0;
  --text-3:    #3a3a58;
  --ease:      cubic-bezier(0.16,1,0.3,1);
  --ease2:     cubic-bezier(0.4,0,0.2,1);
  --ease3:     cubic-bezier(0.33,1,0.68,1);
  --header-h:  72px;
  --radius:    12px;
  --radius-sm: 8px;
  --radius-lg: 16px;
}

/* ── LIGHT THEME ── */
html[data-theme="light"] {
  --bg:#f0f0f8; --bg1:#ffffff; --bg2:#e8e8f5;
  --surface:rgba(0,0,0,0.03); --surface-h:rgba(0,0,0,0.055);
  --border:rgba(0,0,0,0.08); --border-h:rgba(0,170,180,0.4);
  --cyan:#0088ff; --cyan-d:#0066cc; --cyan-glow:rgba(0,136,255,0.15);
  --amber:#e06000; --amber-glow:rgba(224,96,0,0.15);
  --purple:#7c3aed; --purple-glow:rgba(124,58,237,0.15);
  --text:#0a0a1a; --text-2:#505070; --text-3:#b0b0c8;
}

/* ── RESET ── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Figtree',sans-serif;font-weight:400;font-size:15px;
  line-height:1.65;color:var(--text);background:var(--bg);
  cursor:default;overflow-x:hidden;min-height:100vh;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
a:not(.btn){color:var(--cyan);text-decoration:none;transition:color .25s var(--ease2)}
a:not(.btn):hover{color:var(--cyan-d)}
a.btn{text-decoration:none}
img{max-width:100%;height:auto;display:block}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;border:none;outline:none;background:none}
button{cursor:pointer}
ul,ol{list-style:none}
h1,h2,h3,h4,h5,h6{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;line-height:0.95;letter-spacing:-0.02em;color:var(--text)}

/* ── NOISE GRAIN OVERLAY ── */
body::before{
  content:'';position:fixed;inset:0;z-index:9999;pointer-events:none;
  opacity:0.03;
  background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:128px 128px;
}

/* ── SCROLL PROGRESS BAR ── */
#scroll-progress{
  position:fixed;top:0;left:0;height:2px;z-index:10001;
  background:linear-gradient(90deg,var(--cyan),var(--amber));
  width:0%;transition:width .1s linear;
}


/* ── BREADCRUMB ── */
.breadcrumb{
  display:flex;align-items:center;gap:8px;font-size:14px;color:var(--text-2);
  margin-bottom:24px;padding:12px 0;flex-wrap:wrap;
}
.breadcrumb a{
  color:var(--text-2);text-decoration:none;transition:color .2s;
}
.breadcrumb a:hover{color:var(--cyan)}
.breadcrumb .sep{
  color:var(--text-3);margin:0 4px;
}
.breadcrumb span:last-child,
.breadcrumb .current{
  color:var(--text);font-weight:500;
}

/* Page hero breadcrumb override */
.page-hero .breadcrumb{
  justify-content:center;margin-bottom:16px;font-size:13px;
}
.page-hero .breadcrumb a{color:var(--text-2)}
.page-hero .breadcrumb a:hover{color:var(--cyan)}
.page-hero .breadcrumb .sep{color:var(--text-3)}

/* ── ANNOUNCEMENT BAR ── */
.announcement-bar{
  background:linear-gradient(90deg,var(--bg2),var(--bg1),var(--bg2));
  border-bottom:1px solid var(--border);padding:10px 20px;text-align:center;
  font-size:13px;color:var(--text-2);position:relative;overflow:hidden;
}
.announcement-bar .shimmer{
  position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(0,245,255,0.04),transparent);
  animation:shimmerAnim 3s infinite;
}
@keyframes shimmerAnim{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.announcement-bar a{color:var(--cyan);font-weight:600;margin-left:8px}
.announcement-bar .dismiss{
  position:absolute;right:16px;top:50%;transform:translateY(-50%);
  color:var(--text-3);font-size:18px;cursor:pointer;line-height:1;
  background:transparent;border:none;padding:0;
}
.announcement-bar .dismiss:hover{color:var(--text)}

/* ── HEADER ── */
.site-header{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  height:var(--header-h);display:flex;align-items:center;
  padding:0 40px;transition:all .4s var(--ease2);
  background:transparent;
}
.site-header.has-announcement{top:38px}
.site-header.scrolled{
  background:rgba(2,2,9,0.85);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
  border-bottom:1px solid var(--border);
}
html[data-theme="light"] .site-header.scrolled{
  background:rgba(240,240,248,0.88);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;max-width:1400px;margin:0 auto;
}
.logo{
  font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:22px;
  text-transform:uppercase;letter-spacing:1px;color:var(--text);
  display:flex;align-items:center;gap:8px;
}
.logo .accent{color:var(--cyan)}
.logo img{height:34px;width:auto}
.logo .logo-dark{display:none}
.logo .logo-light{display:none}
[data-theme="dark"] .logo .logo-dark{display:block}
[data-theme="light"] .logo .logo-light{display:block}
.logo .logo-text{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:20px;
  text-transform:uppercase;letter-spacing:1px;color:var(--text);white-space:nowrap;
  line-height:1;
  display:inline-block;position:relative;
  background:linear-gradient(90deg,var(--text) 0%,var(--text) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:signatureReveal .8s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes signatureReveal{
  0%{clip-path:polygon(0 0,0 100%,0 100%,0 0,100% 0,100% 100%,100% 100%,100% 0)}
  100%{clip-path:polygon(0 0,0 100%,50% 100%,50% 0,100% 0,100% 100%,50% 100%,50% 0)}
}
.footer-brand .logo-dark{display:none}
.footer-brand .logo-light{display:none}
[data-theme="dark"] .footer-brand .logo-dark{display:inline}
[data-theme="light"] .footer-brand .logo-light{display:inline}
.footer-brand .name{display:flex;align-items:center;gap:8px}
.footer-logo-text{
  font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:18px;
  text-transform:uppercase;letter-spacing:1px;color:var(--text);
  display:inline-block;position:relative;
  background:linear-gradient(90deg,var(--text) 0%,var(--text) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:signatureReveal .8s cubic-bezier(.4,0,.2,1) forwards;
}
.nav-links{display:flex;align-items:center;gap:32px}
.nav-links a{
  font-size:16px;font-weight:700;color:var(--text-2);
  position:relative;transition:color .25s var(--ease2);
}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-links a::after{
  content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;
  background:var(--cyan);transition:width .3s var(--ease);
}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.header-actions{display:flex;align-items:center;gap:16px}

/* Theme Toggle */
.theme-toggle{
  width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--border);cursor:pointer;
  transition:all .3s var(--ease2);color:var(--text);
}
.theme-toggle:hover{border-color:var(--border-h);background:var(--surface-h)}
.theme-toggle svg{width:20px;height:20px;transition:transform .3s var(--ease2)}
.theme-toggle:hover svg{transform:scale(1.1)}

/* Live Search */
/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 28px;border-radius:var(--radius-sm);font-weight:600;font-size:14px;
  transition:all .3s var(--ease2);border:1px solid transparent;cursor:pointer;
  text-transform:uppercase;letter-spacing:0.5px;font-family:'Barlow Condensed',sans-serif;
}
.btn-primary{
  background:var(--cyan);color:#020209;border-color:var(--cyan);
  box-shadow:0 0 20px var(--cyan-glow);
}
.btn-primary:hover{
  background:var(--cyan-d);border-color:var(--cyan-d);color:#020209;
  box-shadow:0 0 30px var(--cyan-glow);transform:translateY(-2px);
}
.btn-secondary{
  background:transparent;color:var(--text);border-color:var(--border);
}
.btn-secondary:hover{
  border-color:var(--cyan);color:var(--cyan);
  box-shadow:0 0 15px var(--cyan-glow);background:rgba(0,245,255,0.04);
}
.btn-amber{
  background:var(--amber);color:#020209;border-color:var(--amber);
  box-shadow:0 0 20px var(--amber-glow);
}
.btn-amber:hover{background:var(--amber-d);color:#020209;transform:translateY(-2px)}
.btn-danger{
  background:rgba(255,68,68,0.1);color:var(--red);border-color:rgba(255,68,68,0.2);
}
.btn-danger:hover{background:rgba(255,68,68,0.2);transform:translateY(-2px)}
.btn-sm{padding:8px 18px;font-size:12px}
.btn-lg{padding:16px 36px;font-size:16px}
.btn-magnetic{transition:transform .2s var(--ease)}

/* ── DOWNLOAD BUTTON ENHANCEMENT ── */
.download-btn{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--cyan),var(--cyan-d)) !important;
  border:1px solid var(--cyan) !important;
  box-shadow:0 0 15px var(--cyan-glow),0 2px 8px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.2) !important;
  transition:all .3s var(--ease2) !important;
  padding:8px 18px !important;
  font-size:12px !important;
}
.download-btn::before{
  content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.15),transparent);
  transition:left 0.6s var(--ease2);
}
.download-btn:hover::before{left:100%}
.download-btn:hover{
  background:linear-gradient(135deg,var(--cyan-d),var(--cyan)) !important;
  transform:translateY(-2px) scale(1.02);
  box-shadow:0 0 25px var(--cyan-glow),0 4px 12px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.3) !important;
}
.download-btn:active{
  transform:translateY(0) scale(0.98);
  box-shadow:0 0 10px var(--cyan-glow),0 1px 4px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.1) !important;
}

/* ── MOBILE MENU ── */
.hamburger{
  display:none;width:40px;height:40px;flex-direction:column;align-items:center;
  justify-content:center;gap:5px;cursor:pointer;z-index:1001;
  background:transparent;border:none;padding:0;
}
.hamburger span{
  width:24px;height:2px;background:var(--text);transition:all .3s var(--ease);
}
.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.mobile-overlay{
  position:fixed;inset:0;background:rgba(2,2,9,0.97);z-index:999;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease2);
}
.mobile-overlay.active{opacity:1;pointer-events:all}
.mobile-overlay a{
  font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:700;
  text-transform:uppercase;color:var(--text);transition:color .2s;
}
.mobile-overlay a:hover{color:var(--cyan)}

/* ── HERO ── */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  justify-content:center;text-align:center;padding:120px 20px 80px;overflow:hidden;
}
/* Hero background container */
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}

/* Cyber grid */
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(0,245,255,0.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,245,255,0.04) 1px,transparent 1px);
  background-size:60px 60px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,black 20%,transparent 70%);
  mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,black 20%,transparent 70%);
}

/* Floating gradient orbs */
.hero-orb{
  position:absolute;border-radius:50%;
  filter:blur(100px);opacity:0.18;
  will-change:transform;
}
.hero-orb--cyan{
  width:500px;height:500px;background:var(--cyan);
  top:5%;left:15%;
  animation:orbFloat 22s ease-in-out infinite alternate;
}
.hero-orb--purple{
  width:400px;height:400px;background:var(--purple);
  top:40%;right:10%;
  animation:orbFloat 26s ease-in-out infinite alternate-reverse;
}
.hero-orb--amber{
  width:350px;height:350px;background:var(--amber);
  bottom:10%;left:40%;
  animation:orbFloat 20s ease-in-out infinite alternate;
  animation-delay:-8s;
}
@keyframes orbFloat{
  0%{transform:translate(0,0) scale(1)}
  20%{transform:translate(30px,-40px) scale(1.08)}
  40%{transform:translate(-25px,35px) scale(0.94)}
  60%{transform:translate(40px,20px) scale(1.06)}
  80%{transform:translate(-35px,-30px) scale(0.96)}
  100%{transform:translate(20px,45px) scale(1.04)}
}

/* Floating particles canvas */
.hero-particles{
  position:absolute;inset:0;width:100%;height:100%;
}

/* Radial vignette — depth + focus to center */
.hero-vignette{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 70% at 50% 45%,transparent 30%,var(--bg) 100%);
}

/* Light theme adjustments */
html[data-theme="light"] .hero-grid{
  background-image:
    linear-gradient(rgba(0,136,255,0.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,136,255,0.06) 1px,transparent 1px);
}
html[data-theme="light"] .hero-orb{opacity:0.1;filter:blur(120px)}
html[data-theme="light"] .hero-vignette{
  background:radial-gradient(ellipse 80% 70% at 50% 45%,transparent 30%,var(--bg) 100%);
}

.hero-content{position:relative;z-index:2;max-width:900px}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 20px;border-radius:40px;background:var(--surface);
  border:1px solid var(--border);font-size:12px;color:var(--cyan);
  font-family:'Space Mono',monospace;text-transform:uppercase;
  letter-spacing:1px;margin-bottom:24px;
}
.hero-badge .dot{
  width:6px;height:6px;border-radius:50%;background:var(--green);
  animation:pulse 2s infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}
.hero h1{
  font-size:clamp(48px,8vw,96px);font-weight:900;line-height:0.92;
  margin-bottom:24px;position:relative;
}
.hero h1 span{display:block}
.hero h1 .line-1{color:var(--text)}
.hero h1 .line-2{
  color:var(--cyan);
}
.hero h1 .line-3{color:var(--text);opacity:0.95}

.hero-sub{
  font-size:18px;color:var(--text-2);max-width:560px;margin:0 auto 36px;
  font-weight:300;line-height:1.7;
}
.hero-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.scroll-hint{
  position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  transition:opacity .6s,transform .6s;
}
.scroll-hint.hidden{opacity:0;transform:translateX(-50%) translateY(20px);pointer-events:none}

/* Mouse outline */
.scroll-mouse{
  width:26px;height:42px;border-radius:14px;
  border:2px solid var(--cyan);position:relative;
  opacity:0.6;transition:opacity .3s;
}
.scroll-hint:hover .scroll-mouse{opacity:1}

/* Scrolling wheel dot */
.scroll-wheel{
  width:4px;height:8px;border-radius:4px;
  background:var(--cyan);
  position:absolute;top:8px;left:50%;transform:translateX(-50%);
  animation:scrollWheel 2s ease-in-out infinite;
}
@keyframes scrollWheel{
  0%{opacity:1;top:8px}
  50%{opacity:0.3;top:22px}
  100%{opacity:0;top:22px}
}

/* Cascade chevrons */
.scroll-chevrons{display:flex;flex-direction:column;align-items:center;margin-top:4px;gap:0}
.scroll-chevrons .chevron{
  display:block;width:10px;height:10px;
  border-right:1.5px solid var(--cyan);border-bottom:1.5px solid var(--cyan);
  transform:rotate(45deg);margin-top:-5px;
  opacity:0;
  animation:chevronCascade 2s ease-in-out infinite;
}
.scroll-chevrons .chevron:nth-child(1){animation-delay:0s}
.scroll-chevrons .chevron:nth-child(2){animation-delay:.2s}
.scroll-chevrons .chevron:nth-child(3){animation-delay:.4s}
@keyframes chevronCascade{
  0%{opacity:0}
  25%{opacity:0.9}
  50%{opacity:0.9}
  75%{opacity:0.2}
  100%{opacity:0}
}

/* ── TICKER MARQUEE ── */
.ticker{
  overflow:hidden;background:var(--bg1);border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);padding:14px 0;
}
.ticker-track{
  display:flex;gap:60px;animation:tickerScroll 30s linear infinite;
  white-space:nowrap;
}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tickerScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.ticker-item{
  font-family:'Barlow Condensed',sans-serif;font-size:14px;
  text-transform:uppercase;letter-spacing:2px;color:var(--text-3);
  display:flex;align-items:center;gap:12px;flex-shrink:0;
}
.ticker-item .sep{color:var(--cyan);font-size:8px}

/* ── SECTION STYLES ── */
section{padding:100px 20px;position:relative}
.section-inner{max-width:1200px;margin:0 auto}
.section-label{
  font-family:'Space Mono',monospace;font-size:11px;text-transform:uppercase;
  letter-spacing:3px;color:var(--cyan);margin-bottom:12px;
}
.section-title{font-size:clamp(32px,5vw,52px);margin-bottom:16px}
.section-desc{color:var(--text-2);font-size:16px;max-width:560px;margin-bottom:48px}

/* ── STATS ── */
.stats-section{background:var(--bg1);padding:80px 20px;position:relative;overflow:hidden}
.stats-section::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--border),transparent);
}
.stats-section::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--border),transparent);
}
.stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
  align-items:stretch;
}

/* ── Stat Card ── */
.stat-card{
  position:relative;border-radius:16px;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
  height: 100%;
}
.stat-card:hover{transform:translateY(-6px)}

/* ── Inner Card ── */
.stat-card-inner{
  position:relative;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,0.04) 0%,rgba(255,255,255,0.01) 100%);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border:1px solid var(--border);
  padding:28px 24px;display:flex;align-items:center;gap:18px;
  overflow:hidden;transition:border-color .4s var(--ease2),background .4s var(--ease2);
  height: 100%;
}

/* ── Hover: accent border + glow ── */
.stat-card[data-accent="cyan"]:hover .stat-card-inner{
  border-color:rgba(0,245,255,0.35);
  background:linear-gradient(160deg,rgba(0,245,255,0.06) 0%,rgba(0,245,255,0.01) 100%);
}
.stat-card[data-accent="cyan"]:hover{
  box-shadow:0 0 40px rgba(0,245,255,0.1),0 8px 32px rgba(0,0,0,0.15);
}
.stat-card[data-accent="purple"]:hover .stat-card-inner{
  border-color:rgba(155,92,246,0.35);
  background:linear-gradient(160deg,rgba(155,92,246,0.06) 0%,rgba(155,92,246,0.01) 100%);
}
.stat-card[data-accent="purple"]:hover{
  box-shadow:0 0 40px rgba(155,92,246,0.1),0 8px 32px rgba(0,0,0,0.15);
}
.stat-card[data-accent="green"]:hover .stat-card-inner{
  border-color:rgba(0,255,136,0.35);
  background:linear-gradient(160deg,rgba(0,255,136,0.06) 0%,rgba(0,255,136,0.01) 100%);
}
.stat-card[data-accent="green"]:hover{
  box-shadow:0 0 40px rgba(0,255,136,0.1),0 8px 32px rgba(0,0,0,0.15);
}
.stat-card[data-accent="amber"]:hover .stat-card-inner{
  border-color:rgba(255,125,0,0.35);
  background:linear-gradient(160deg,rgba(255,125,0,0.06) 0%,rgba(255,125,0,0.01) 100%);
}
.stat-card[data-accent="amber"]:hover{
  box-shadow:0 0 40px rgba(255,125,0,0.1),0 8px 32px rgba(0,0,0,0.15);
}

/* ── Shimmer Effect ── */
.stat-card-shimmer{
  position:absolute;top:0;left:-150%;width:150%;height:100%;z-index:3;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,0.03) 45%,rgba(255,255,255,0.06) 50%,rgba(255,255,255,0.03) 55%,transparent 70%);
  pointer-events:none;
}
.stat-card:hover .stat-card-shimmer{
  animation:statShimmer 1.2s ease forwards;
}
@keyframes statShimmer{
  0%{left:-150%}
  100%{left:150%}
}

/* ── Icon ── */
.stat-icon{
  flex-shrink:0;width:52px;height:52px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.stat-card:hover .stat-icon{transform:scale(1.08)}
.stat-card[data-accent="cyan"] .stat-icon{
  background:rgba(0,245,255,0.08);color:var(--cyan);
  box-shadow:0 0 0 1px rgba(0,245,255,0.12);
}
.stat-card[data-accent="cyan"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(0,245,255,0.15),0 0 0 1px rgba(0,245,255,0.25);
}
.stat-card[data-accent="purple"] .stat-icon{
  background:rgba(155,92,246,0.08);color:var(--purple);
  box-shadow:0 0 0 1px rgba(155,92,246,0.12);
}
.stat-card[data-accent="purple"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(155,92,246,0.15),0 0 0 1px rgba(155,92,246,0.25);
}
.stat-card[data-accent="green"] .stat-icon{
  background:rgba(0,255,136,0.08);color:var(--green);
  box-shadow:0 0 0 1px rgba(0,255,136,0.12);
}
.stat-card[data-accent="green"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(0,255,136,0.15),0 0 0 1px rgba(0,255,136,0.25);
}
.stat-card[data-accent="amber"] .stat-icon{
  background:rgba(255,125,0,0.08);color:var(--amber);
  box-shadow:0 0 0 1px rgba(255,125,0,0.12);
}
.stat-card[data-accent="amber"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(255,125,0,0.15),0 0 0 1px rgba(255,125,0,0.25);
}

/* ── Content ── */
.stat-content{flex:1;min-width:0}
.stat-number{
  font-family:'Barlow Condensed',sans-serif;font-size:42px;font-weight:900;
  line-height:1;margin-bottom:4px;letter-spacing:-0.02em;
  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.stat-card[data-accent="cyan"] .stat-number{
  background-image:linear-gradient(135deg,var(--cyan),#80fbff,var(--cyan));
}
.stat-card[data-accent="purple"] .stat-number{
  background-image:linear-gradient(135deg,var(--purple),#c4a0ff,var(--purple));
}
.stat-card[data-accent="green"] .stat-number{
  background-image:linear-gradient(135deg,var(--green),#80ffbb,var(--green));
}
.stat-card[data-accent="amber"] .stat-number{
  background-image:linear-gradient(135deg,var(--amber),#ffb060,var(--amber));
}
.stat-label{
  font-size:12px;color:var(--text-2);text-transform:uppercase;
  letter-spacing:1.5px;font-weight:500;
}

/* ── Progress Ring ── */
.stat-ring{
  flex-shrink:0;width:44px;height:44px;opacity:0.5;
  transition:opacity .4s var(--ease2);
}
.stat-card:hover .stat-ring{opacity:0.8}
.stat-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.stat-ring circle:first-child{stroke:var(--border)}
.stat-card[data-accent="cyan"] .stat-ring-fill{stroke:var(--cyan)}
.stat-card[data-accent="purple"] .stat-ring-fill{stroke:var(--purple)}
.stat-card[data-accent="green"] .stat-ring-fill{stroke:var(--green)}
.stat-card[data-accent="amber"] .stat-ring-fill{stroke:var(--amber)}
.stat-ring-fill{
  transition:stroke-dasharray 1.5s cubic-bezier(0.4,0,0.2,1);
}

/* ── Light Theme Stats ── */
html[data-theme="light"] .stat-card-inner{
  background:linear-gradient(160deg,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.5) 100%);
  border-color:rgba(0,0,0,0.06);
}
html[data-theme="light"] .stat-card-shimmer{
  background:linear-gradient(105deg,transparent 30%,rgba(0,0,0,0.02) 45%,rgba(0,0,0,0.04) 50%,rgba(0,0,0,0.02) 55%,transparent 70%);
}
html[data-theme="light"] .stat-card[data-accent="cyan"] .stat-icon{
  background:rgba(0,136,255,0.08);box-shadow:0 0 0 1px rgba(0,136,255,0.15);
}
html[data-theme="light"] .stat-card[data-accent="purple"] .stat-icon{
  background:rgba(124,58,237,0.08);box-shadow:0 0 0 1px rgba(124,58,237,0.15);
}
html[data-theme="light"] .stat-card[data-accent="green"] .stat-icon{
  background:rgba(0,180,80,0.08);box-shadow:0 0 0 1px rgba(0,180,80,0.15);
}
html[data-theme="light"] .stat-card[data-accent="amber"] .stat-icon{
  background:rgba(200,96,0,0.08);box-shadow:0 0 0 1px rgba(200,96,0,0.15);
}
html[data-theme="light"] .stat-card[data-accent="cyan"] .stat-number{
  background-image:linear-gradient(135deg,#0066cc,#0088ff,#0066cc);
}
html[data-theme="light"] .stat-card[data-accent="purple"] .stat-number{
  background-image:linear-gradient(135deg,#5b21b6,#7c3aed,#5b21b6);
}
html[data-theme="light"] .stat-card[data-accent="green"] .stat-number{
  background-image:linear-gradient(135deg,#059669,#10b981,#059669);
}
html[data-theme="light"] .stat-card[data-accent="amber"] .stat-number{
  background-image:linear-gradient(135deg,#c2410c,#e06000,#c2410c);
}
html[data-theme="light"] .stat-card[data-accent="cyan"]:hover .stat-card-inner{
  border-color:rgba(0,136,255,0.3);
  background:linear-gradient(160deg,rgba(0,136,255,0.05) 0%,rgba(0,136,255,0.01) 100%);
}
html[data-theme="light"] .stat-card[data-accent="purple"]:hover .stat-card-inner{
  border-color:rgba(124,58,237,0.3);
  background:linear-gradient(160deg,rgba(124,58,237,0.05) 0%,rgba(124,58,237,0.01) 100%);
}
html[data-theme="light"] .stat-card[data-accent="green"]:hover .stat-card-inner{
  border-color:rgba(0,180,80,0.3);
  background:linear-gradient(160deg,rgba(0,180,80,0.05) 0%,rgba(0,180,80,0.01) 100%);
}
html[data-theme="light"] .stat-card[data-accent="amber"]:hover .stat-card-inner{
  border-color:rgba(200,96,0,0.3);
  background:linear-gradient(160deg,rgba(200,96,0,0.05) 0%,rgba(200,96,0,0.01) 100%);
}
html[data-theme="light"] .stat-card[data-accent="cyan"]:hover{
  box-shadow:0 0 40px rgba(0,136,255,0.08),0 8px 32px rgba(0,0,0,0.06);
}
html[data-theme="light"] .stat-card[data-accent="purple"]:hover{
  box-shadow:0 0 40px rgba(124,58,237,0.08),0 8px 32px rgba(0,0,0,0.06);
}
html[data-theme="light"] .stat-card[data-accent="green"]:hover{
  box-shadow:0 0 40px rgba(0,180,80,0.08),0 8px 32px rgba(0,0,0,0.06);
}
html[data-theme="light"] .stat-card[data-accent="amber"]:hover{
  box-shadow:0 0 40px rgba(200,96,0,0.08),0 8px 32px rgba(0,0,0,0.06);
}
html[data-theme="light"] .stat-card[data-accent="cyan"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(0,136,255,0.12),0 0 0 1px rgba(0,136,255,0.2);
}
html[data-theme="light"] .stat-card[data-accent="purple"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(124,58,237,0.12),0 0 0 1px rgba(124,58,237,0.2);
}
html[data-theme="light"] .stat-card[data-accent="green"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(0,180,80,0.12),0 0 0 1px rgba(0,180,80,0.2);
}
html[data-theme="light"] .stat-card[data-accent="amber"]:hover .stat-icon{
  box-shadow:0 0 20px rgba(200,96,0,0.12),0 0 0 1px rgba(200,96,0,0.2);
}

/* ── PRODUCT CARDS ── */
.products-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:24px;
  justify-items:start;
  justify-content:center;
  width:100%;
  max-width:1240px;
  margin:0 auto;
}
.product-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;transition:all .4s var(--ease2);position:relative;
  transform-style:preserve-3d;perspective:800px;display:block;
  color:var(--text);text-decoration:none;cursor:pointer;
  width:100%;
  max-width:320px;
}
.product-card:hover{
  border-color:var(--border-h);transform:translateY(-4px);
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
}
.product-card .card-glow{
  position:absolute;inset:0;border-radius:var(--radius);pointer-events:none;
  opacity:0;transition:opacity .4s;z-index:1;
  background:radial-gradient(600px circle at var(--mx,50%) var(--my,50%),var(--cyan-glow),transparent 40%);
}
.product-card:hover .card-glow{opacity:1}
.product-card .card-image{
  position:relative;height:200px;overflow:hidden;background:var(--bg2);
  display:flex;align-items:center;justify-content:center;
}
.product-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.product-card:hover .card-image img{transform:scale(1.05)}
.product-card .card-image .placeholder-icon{font-size:48px;color:var(--text-3)}
.product-card .sale-badge{
  position:absolute;top:12px;right:12px;padding:4px 12px;border-radius:20px;
  font-size:11px;font-weight:700;font-family:'Space Mono',monospace;
  text-transform:uppercase;z-index:2;
}
.sale-badge.new{background:var(--cyan);color:#020209}
.sale-badge.hot{background:var(--amber);color:#020209}
.sale-badge.sale{background:var(--red);color:#fff}
.product-card .card-body{padding:20px;position:relative;z-index:2}
.product-card .card-cat{
  font-size:11px;font-family:'Space Mono',monospace;text-transform:uppercase;
  letter-spacing:1px;margin-bottom:8px;
}
.product-card .card-title{
  font-size:20px;font-family:'Barlow Condensed',sans-serif;font-weight:700;
  text-transform:uppercase;margin-bottom:8px;line-height:1.1;
}
.product-card .card-title a{color:var(--text);transition:color .2s}
.product-card .card-title a:hover{color:var(--cyan)}
.product-card .card-desc{
  font-size:13px;color:var(--text-2);line-height:1.6;margin-bottom:16px;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.product-card .card-meta{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.product-card .card-price{
  font-family:'Barlow Condensed',sans-serif;font-size:22px;font-weight:800;
  color:var(--cyan);
}
.product-card .card-price .original{
  font-size:14px;color:var(--text-3);text-decoration:line-through;margin-right:6px;font-weight:400;
}
.product-card .card-rating{display:flex;align-items:center;gap:4px;font-size:13px}
.product-card .card-rating .stars{color:var(--amber);font-size:12px}
.product-card .card-rating .count{color:var(--text-3);font-size:11px}
.product-card .card-footer{
  display:flex;align-items:center;gap:8px;padding:16px 20px;
  border-top:1px solid var(--border);
}
.product-card .card-footer .version{
  font-family:'Space Mono',monospace;font-size:11px;color:var(--text-3);
  padding:3px 8px;border-radius:4px;background:var(--surface);
}
.product-card .card-footer .platform{font-size:12px;color:var(--text-3)}

/* ── FEATURED PRODUCTS HORIZONTAL SCROLL ── */
.featured-scroll{
  display:flex;gap:24px;overflow-x:auto;padding:20px 0;
  cursor:grab;-ms-overflow-style:none;scrollbar-width:none;
}
.featured-scroll::-webkit-scrollbar{display:none}
.featured-scroll.dragging{cursor:grabbing}
.featured-scroll .product-card{min-width:340px;flex-shrink:0}

/* ── FILTER TABS ── */
.filter-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
.filter-tab{
  padding:8px 20px;border-radius:30px;font-size:13px;font-weight:500;
  color:var(--text-2);background:var(--surface);border:1px solid var(--border);
  cursor:pointer;transition:all .3s var(--ease2);
}
.filter-tab:hover{border-color:var(--border-h);color:var(--text)}
.filter-tab.active{
  background:var(--cyan);color:#020209;border-color:var(--cyan);font-weight:600;
}

/* ── SORT DROPDOWN ── */
.sort-select{
  padding:8px 16px;border-radius:var(--radius-sm);background:var(--surface);
  border:1px solid var(--border);color:var(--text);font-size:13px;cursor:pointer;
}
.sort-select:focus{border-color:var(--cyan)}
.sort-select option{background:var(--bg1);color:var(--text)}

/* ── INFINITE SCROLL LOADER ── */
.load-trigger{min-height:1px;margin:20px 0}
.loader{
  display:flex;justify-content:center;padding:40px;
}
.loader .spinner{
  width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--cyan);
  border-radius:50%;animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.end-message{
  text-align:center;padding:40px;color:var(--text-3);font-size:14px;
  font-family:'Space Mono',monospace;
}

/* ── BENTO FEATURES GRID ── */
.bento-grid{
  display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(180px,auto);gap:20px;
}
.bento-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);
  padding:32px;transition:all .15s ease;overflow:hidden;position:relative;
  display:flex;flex-direction:column;justify-content:flex-start;
}
.bento-card:hover{border-color:var(--border-h);background:var(--surface-h);transform:translateY(-2px)}
.bento-card.span-2{grid-column:span 2}
.bento-card .bento-icon{
  font-size:32px;
  margin-bottom:16px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.bento-card .bento-icon img{
  width:64px;
  height:64px;
  object-fit:contain;
  display:block;
}
.bento-card h3{font-size:20px;margin-bottom:8px;text-transform:uppercase;line-height:1.2}
.bento-card p{font-size:13px;color:var(--text-2);line-height:1.7;margin:0}

/* ── TESTIMONIALS ── */
.testimonials{overflow:hidden;padding:80px 0}
.testimonial-row{
  display:flex;gap:24px;animation:scrollTestimonials 40s linear infinite;
}
.testimonial-row.reverse{animation-direction:reverse}
.testimonial-card{
  min-width:350px;flex-shrink:0;background:var(--bg1);border:1px solid var(--border);
  border-radius:var(--radius);padding:24px;
}
.testimonial-card .stars{color:var(--amber);font-size:14px;margin-bottom:12px}
.testimonial-card .quote{font-size:14px;color:var(--text-2);line-height:1.7;margin-bottom:16px;font-style:italic}
.testimonial-card .author{font-weight:600;font-size:13px}
.testimonial-card .author-meta{font-size:12px;color:var(--text-3)}
@keyframes scrollTestimonials{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── BLOG CARDS ── */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px}
.blog-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;transition:all .3s var(--ease2);
}
.blog-card:hover{border-color:var(--border-h);transform:translateY(-3px)}
.blog-card .blog-image{height:200px;overflow:hidden;background:var(--bg2)}
.blog-card .blog-image img{width:100%;height:100%;object-fit:cover}
.blog-card .blog-body{padding:20px}
.blog-card .blog-cat{font-size:11px;color:var(--cyan);text-transform:uppercase;letter-spacing:1px;font-family:'Space Mono',monospace;margin-bottom:8px}
.blog-card .blog-title{font-size:18px;font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;margin-bottom:8px;line-height:1.2}
.blog-card .blog-title a{color:var(--text)}
.blog-card .blog-title a:hover{color:var(--cyan)}
.blog-card .blog-excerpt{font-size:13px;color:var(--text-2);line-height:1.6;margin-bottom:12px}
.blog-card .blog-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-3)}

/* ── CTA BANNER ── */
.cta-banner{
  background:linear-gradient(135deg,var(--bg2),var(--bg1));
  border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:60px;text-align:center;position:relative;overflow:hidden;
}
.cta-banner h2{font-size:clamp(28px,4vw,44px);margin-bottom:16px}
.cta-banner p{color:var(--text-2);margin-bottom:32px;font-size:16px}

/* ── PRODUCT PAGE BACKGROUND ── */
.product-page-bg{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse 80% 50% at 20% 0%, rgba(0,245,255,0.03) 0%, transparent 60%),
    radial-gradient(ellipse 60% 40% at 80% 10%, rgba(155,92,246,0.025) 0%, transparent 50%),
    radial-gradient(ellipse 90% 60% at 50% 100%, rgba(0,245,255,0.02) 0%, transparent 50%),
    linear-gradient(180deg, var(--bg) 0%, #020210 40%, #030318 70%, var(--bg) 100%);
}
.product-page-bg > section,
.product-page-bg > script{
  position:relative;z-index:2;
}
.product-page-bg::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  background-image:
    linear-gradient(rgba(0,245,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,245,255,0.035) 1px, transparent 1px);
  background-size:60px 60px;
}
.product-page-bg::after{
  content:'';position:absolute;top:15%;left:50%;width:800px;height:800px;
  transform:translateX(-50%);pointer-events:none;z-index:0;
  background:radial-gradient(circle, rgba(0,245,255,0.04) 0%, transparent 70%);
  border-radius:50%;filter:blur(80px);
}
html[data-theme="light"] .product-page-bg{
  background:
    radial-gradient(ellipse 80% 50% at 20% 0%, rgba(0,136,255,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 60% 40% at 80% 10%, rgba(124,58,237,0.04) 0%, transparent 50%),
    radial-gradient(ellipse 90% 60% at 50% 100%, rgba(0,136,255,0.03) 0%, transparent 50%),
    linear-gradient(180deg, var(--bg) 0%, #e8e8f8 40%, #e0e0f0 70%, var(--bg) 100%);
}
html[data-theme="light"] .product-page-bg::before{
  background-image:
    linear-gradient(rgba(0,136,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,136,255,0.04) 1px, transparent 1px);
}
html[data-theme="light"] .product-page-bg::after{
  background:radial-gradient(circle, rgba(0,136,255,0.04) 0%, transparent 70%);
}

/* ── PRODUCT PAGE ── */
.product-hero{padding:120px 20px 40px}
.product-layout{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start}
.product-tabs{margin-top:32px}
.tab-nav{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:24px}
.tab-btn{
  padding:12px 24px;font-size:14px;font-weight:500;color:var(--text-2);
  cursor:pointer;transition:all .2s;border-bottom:2px solid transparent;margin-bottom:-1px;
}
.tab-btn:hover{color:var(--text)}
.tab-btn.active{color:var(--cyan);border-bottom-color:var(--cyan)}
.tab-panel{display:none}
.tab-panel.active{display:block}
.tab-panel .content{font-size:15px;line-height:1.8;color:var(--text-2)}
.tab-panel .content h2,.tab-panel .content h3{color:var(--text);margin:24px 0 12px;font-size:20px}
.tab-panel .content p{margin-bottom:16px}
.tab-panel .content ul{padding-left:20px;margin-bottom:16px}
.tab-panel .content li{margin-bottom:8px;list-style:disc}

/* Purchase Panel */
.purchase-panel{
  position:sticky;top:100px;background:rgba(0,8,15,0.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(0,245,255,0.12);border-radius:var(--radius);padding:28px;
  box-shadow:0 4px 24px rgba(0,0,0,0.4), inset 0 0 30px rgba(0,245,255,0.03);
}
html[data-theme="light"] .purchase-panel{
  background:rgba(240,240,248,0.45);border-color:rgba(0,136,255,0.15);
  box-shadow:0 4px 24px rgba(0,0,0,0.06), inset 0 0 30px rgba(0,136,255,0.04);
}
.purchase-panel .price-big{
  font-family:'Barlow Condensed',sans-serif;font-size:40px;font-weight:900;
  color:#D3D3D3;margin-bottom:4px;text-align:center;
}
.purchase-panel .price-original{
  font-size:18px;color:#D3D3D3;text-decoration:line-through;margin-bottom:12px;text-align:center;
}
.purchase-panel .sale-timer{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:12px;text-align:center;margin-bottom:20px;
}
.purchase-panel .sale-timer .label{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.purchase-panel .sale-timer .countdown{font-family:'Space Mono',monospace;font-size:20px;color:var(--amber);font-weight:700}
.purchase-panel .buy-btn{width:100%;margin-bottom:16px;min-width:280px}
.purchase-panel .buy-btn[style*="Purchase via Discord"],
.purchase-panel .buy-btn[href*="discord"]{
  width:322px !important;height:53px !important;min-width:322px !important;
  max-width:322px !important;display:flex !important;align-items:center !important;
  justify-content:center !important;
}
.purchase-panel .payment-icons{display:flex;gap:8px;justify-content:center;margin-bottom:16px}
.purchase-panel .payment-icons span{font-size:12px;color:var(--text-3);padding:4px 8px;background:var(--surface);border-radius:4px}
.purchase-panel .license-info{
  border-top:1px solid var(--border);padding-top:16px;margin-top:16px;
  font-size:13px;color:var(--text-2);
}
.purchase-panel .license-info .row{display:flex;justify-content:space-between;margin:6px 0}
.purchase-panel .license-info .row .val{color:var(--text);font-weight:500}

/* ── REVIEWS ── */
.review-list{display:flex;flex-direction:column;gap:16px}
.review-item{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:20px;
}
.review-item .review-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.review-item .reviewer{font-weight:600;font-size:14px}
.review-item .review-date{font-size:12px;color:var(--text-3)}
.review-item .review-stars{color:var(--amber);font-size:14px;margin-bottom:8px}
.review-item .review-title{font-weight:600;margin-bottom:6px}
.review-item .review-content{font-size:14px;color:var(--text-2);line-height:1.7}
.review-item .admin-reply{
  margin-top:12px;padding:12px;background:var(--bg2);border-left:3px solid var(--cyan);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:13px;
}
.review-form{margin-top:32px;padding:24px;background:var(--surface);border-radius:var(--radius)}
.stars-interactive .star{cursor:pointer;font-size:24px;color:var(--text-3);transition:color .2s}
.stars-interactive .star:hover,.stars-interactive .star.filled{color:var(--amber)}

/* ── FORMS ── */
.form-group{margin-bottom:20px}
.form-group label{display:block;font-size:13px;font-weight:500;margin-bottom:6px;color:var(--text)}
.form-control{
  width:100%;padding:12px 16px;border-radius:var(--radius-sm);
  background:var(--bg2);border:1px solid var(--border);color:var(--text);
  font-size:14px;transition:all .3s var(--ease2);
}
.form-control:focus{border-color:var(--cyan);box-shadow:0 0 0 3px var(--cyan-glow)}
textarea.form-control{min-height:120px;resize:vertical}
select.form-control{cursor:pointer}
.form-control::placeholder{color:var(--text-3)}
.form-hint{font-size:12px;color:var(--text-3);margin-top:4px}
.form-error{font-size:12px;color:var(--red);margin-top:4px}
.char-counter{font-size:11px;color:var(--text-3);text-align:right;margin-top:4px;font-family:'Space Mono',monospace}

/* ── FLASH MESSAGES ── */
.flash-container{position:fixed;top:80px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:8px;max-width:400px}
.flash{
  display:flex;align-items:center;gap:12px;padding:14px 20px;border-radius:var(--radius-sm);
  font-size:14px;animation:flashIn .3s var(--ease);border:1px solid;
}
@keyframes flashIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
.flash-success{background:rgba(0,255,136,0.08);border-color:rgba(0,255,136,0.3);color:var(--green)}
.flash-error{background:rgba(255,68,68,0.08);border-color:rgba(255,68,68,0.3);color:var(--red)}
.flash-warning{background:rgba(255,125,0,0.08);border-color:rgba(255,125,0,0.3);color:var(--amber)}
.flash-info{background:rgba(0,245,255,0.08);border-color:rgba(0,245,255,0.3);color:var(--cyan)}
.flash-icon{font-size:18px;flex-shrink:0}
.flash-close{margin-left:auto;font-size:18px;color:inherit;opacity:0.6;cursor:pointer;background:none;border:none}
.flash-close:hover{opacity:1}

/* ── FAQ ACCORDION ── */
.faq-list{display:flex;flex-direction:column;gap:12px}
.faq-item{background:var(--bg1);border-radius:var(--radius);border:1px solid rgba(255,255,255,0.12);margin-bottom:16px;overflow:hidden;position:relative;transition:all 0.3s var(--ease2), box-shadow 0.3s var(--ease2), transform 0.3s var(--ease2)}
.faq-item:hover{box-shadow:0 8px 32px rgba(0,245,255,0.08);transform:translateY(-2px)}
.faq-item.active{box-shadow:0 12px 40px rgba(0,245,255,0.12);border-color:var(--cyan)}
.faq-question{font-size:22px;padding:18px 24px;display:flex;align-items:center;gap:16px;cursor:pointer;text-align:center;justify-content:center;border:none;background:none;width:100%;font:inherit;font-weight:600;color:var(--text);transition:all 0.25s var(--ease2)}
.faq-question:hover{background:rgba(255,255,255,0.02)}
.faq-question:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.faq-question-icon,
.faq-toggle-icon{display:inline-flex;justify-content:center;align-items:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,0.06);box-shadow:0 8px 18px rgba(0,0,0,0.12);border:none;transition:all 0.3s var(--ease2)}
.faq-question-icon:focus-visible,
.faq-toggle-icon:focus-visible{outline:2px solid var(--cyan);}
.faq-question-icon .faq-icon-svg{width:30px;height:30px;fill:none;stroke:var(--text-3);stroke-width:1.8;transition:all 0.3s var(--ease2)}
.faq-question-icon .faq-icon-svg circle{stroke:rgba(255,255,255,0.12);stroke-width:2;}
.faq-question-icon .faq-icon-svg path{stroke:var(--text);stroke-width:1.8;}
.faq-toggle-icon svg{width:20px;height:20px;stroke:var(--text-2);stroke-width:2.2;fill:none;transition:all 0.3s var(--ease2)}
.faq-toggle-icon svg polyline{stroke-linecap:round;stroke-linejoin:round;}
.faq-item.active .faq-toggle-icon{transform:rotate(180deg);background:var(--cyan);box-shadow:0 4px 16px rgba(0,245,255,0.3)}
.faq-item.active .faq-toggle-icon svg{stroke:var(--text);}
.faq-item.active .faq-question-icon .faq-icon-svg circle{stroke:var(--cyan);stroke-width:2.5}
.faq-item.active .faq-question-icon .faq-icon-svg path{stroke:var(--cyan)}
.faq-question-text{flex:1;display:block;text-align:center;font-size:19px;line-height:1.05;transition:color 0.25s var(--ease2)}
.faq-item.active .faq-question-text{color:var(--cyan)}
.faq-answer{padding:0;font-size:16px;line-height:1.65;color:var(--text-2);margin:0;max-height:0;overflow:hidden;opacity:0;border-top:0;text-align:center;transition:max-height 0.35s cubic-bezier(0.4,0,0.2,1), opacity 0.25s cubic-bezier(0.4,0,0.2,1), padding 0.35s cubic-bezier(0.4,0,0.2,1), border-top 0s 0.35s}
.faq-item.active .faq-answer{max-height:1000px;padding:16px 22px 20px;opacity:1;border-top:1px solid rgba(255,255,255,0.05);transition:max-height 0.4s var(--ease3), opacity 0.3s var(--ease3) 0.05s, padding 0.3s var(--ease3), border-top 0s}
.faq-answer p{font-size:15px;color:var(--text-2);line-height:1.75;margin:0;transform:translateY(10px);opacity:0;transition:all 0.15s var(--ease2)}
.faq-item.active .faq-answer p{transform:translateY(0);opacity:1;transition:all 0.3s var(--ease2) 0.08s}

.page-subtitle{font-size:16px;color:var(--text-2);text-align:center;margin-top:8px;margin-bottom:0}
.faq-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;font-size:13px;color:var(--text-2);text-transform:uppercase;letter-spacing:1px;margin-top:12px;margin-bottom:32px}
.faq-meta span{padding:6px 14px;background:var(--surface);border:1px solid var(--border);border-radius:999px}
.search-faq-card:hover{border-color:var(--cyan);box-shadow:0 8px 32px rgba(0,245,255,0.08);transform:translateY(-2px)}

/* ── DASHBOARD ── */
.dashboard-layout{display:grid;grid-template-columns:260px 1fr;gap:24px;min-height:calc(100vh - var(--header-h));padding:0 0 0 24px}
.dash-sidebar-col{
  position:sticky;top:calc(var(--header-h) + 16px);height:fit-content;max-height:calc(100vh - var(--header-h) - 32px);overflow-y:auto;
  display:flex;flex-direction:column;gap:12px;margin:16px 0;
}
.dash-sidebar{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);padding:16px 0;
}
.dash-sidebar-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);padding:20px;text-align:center;
}
.dash-sidebar-card .label{font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}
.dash-sidebar-card .value{font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:800;color:var(--text)}
.dash-sidebar a{
  display:flex;align-items:center;gap:12px;padding:12px 24px;font-size:14px;
  color:var(--text-2);transition:all .2s;
}
.dash-sidebar a:hover{color:var(--text);background:var(--surface);margin:0 8px;border-radius:var(--radius-sm);padding-left:21px}
.dash-sidebar a.active{color:var(--cyan);background:rgba(0,245,255,0.05);border-left:3px solid var(--cyan);margin:0 8px;border-radius:var(--radius-sm);padding-left:21px}
.dash-sidebar a .icon{font-size:16px;width:20px;text-align:center}
.dash-main{padding:32px}
.dash-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px}
.dash-stat-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);
  padding:20px;
}
.dash-stat-card .label{font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}
.dash-stat-card .value{font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:800;color:var(--text)}

/* ── TABLES ── */
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius)}
.data-table{width:100%;border-collapse:collapse}
.data-table th{
  background:var(--bg2);padding:12px 16px;text-align:left;font-size:12px;
  text-transform:uppercase;letter-spacing:0.5px;color:var(--text-2);
  font-family:'Space Mono',monospace;border-bottom:1px solid var(--border);
}
.data-table td{padding:12px 16px;border-bottom:1px solid var(--border);font-size:14px}
.data-table tbody tr{transition:background .2s}
.data-table tbody tr:hover{background:var(--surface)}
.data-table tbody tr:nth-child(even){background:rgba(255,255,255,0.01)}

/* ── BADGES ── */
.badge{
  display:inline-flex;padding:3px 10px;border-radius:20px;font-size:11px;
  font-weight:600;text-transform:uppercase;letter-spacing:0.5px;
  font-family:'Space Mono',monospace;
}
.badge-cyan{background:rgba(0,245,255,0.1);color:var(--cyan);border:1px solid rgba(0,245,255,0.2)}
.badge-amber{background:rgba(255,125,0,0.1);color:var(--amber);border:1px solid rgba(255,125,0,0.2)}
.badge-green{background:rgba(0,255,136,0.1);color:var(--green);border:1px solid rgba(0,255,136,0.2)}
.badge-red{background:rgba(255,68,68,0.1);color:var(--red);border:1px solid rgba(255,68,68,0.2)}
.badge-purple{background:rgba(155,92,246,0.1);color:var(--purple);border:1px solid rgba(155,92,246,0.2)}
.badge-neutral{background:rgba(138,138,180,0.1);color:var(--text-2);border:1px solid rgba(138,138,180,0.2)}

/* ── PAGINATION ── */
.pagination-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:40px}
.pagination-info{font-size:12px;color:var(--text-3);font-family:'Space Mono',monospace;letter-spacing:0.5px}
.pagination{display:flex;align-items:center;justify-content:center;gap:6px}
.page-btn{
  width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  border-radius:var(--radius-sm);font-size:14px;color:var(--text-2);
  background:var(--surface);border:1px solid var(--border);transition:all .2s;
}
.page-btn:hover:not(.disabled):not(.active){border-color:var(--border-h);color:var(--text)}
.page-btn.active{background:var(--cyan);color:#020209;border-color:var(--cyan);font-weight:600}
.page-btn.disabled{opacity:0.3;cursor:default;pointer-events:none}
.page-dots{color:var(--text-3);padding:0 4px}

/* ── FOOTER ── */
.site-footer{
  border-top:2px solid;border-image:linear-gradient(90deg,var(--cyan),var(--amber),var(--purple)) 1;
  padding:60px 20px 30px;background:var(--bg1);
}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:40px;margin-bottom:40px}
.footer-brand .name{
  font-family:'Barlow Condensed',sans-serif;font-size:24px;font-weight:800;
  text-transform:uppercase;margin-bottom:8px;
}
.footer-brand .tagline{font-size:14px;color:var(--text-2);margin-bottom:16px}
.footer-socials{display:flex;gap:12px}
.footer-socials a{
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--border);color:var(--text-2);
  font-size:14px;transition:all .2s;
}
.footer-socials a:hover{border-color:var(--cyan);color:var(--cyan)}
.footer-col h4{
  font-size:12px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-3);
  margin-bottom:16px;font-family:'Space Mono',monospace;
}
.footer-col a{display:block;font-size:14px;color:var(--text-2);padding:4px 0;transition:color .2s}
.footer-col a:hover{color:var(--text)}
.footer-newsletter .newsletter-form{display:flex;gap:8px;margin-top:8px}
.footer-newsletter input{
  flex:1;padding:10px 14px;border-radius:var(--radius-sm);background:var(--bg2);
  border:1px solid var(--border);color:var(--text);font-size:13px;
}
.footer-newsletter input:focus{border-color:var(--cyan)}
.footer-newsletter button{padding:10px 20px;border-radius:var(--radius-sm);background:var(--cyan);color:#020209;font-weight:600;font-size:13px;cursor:pointer;border:none}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:24px;border-top:1px solid var(--border);font-size:13px;color:var(--text-3);
}
.footer-status{display:flex;align-items:center;gap:8px}
.footer-status .status-dot{
  width:8px;height:8px;border-radius:50%;background:var(--green);
  animation:pulse 2s infinite;
}

/* ── 404 PAGE ── */
.error-page{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:40px;
}
.error-page .error-code{
  font-family:'Barlow Condensed',sans-serif;font-size:clamp(120px,20vw,240px);
  font-weight:900;color:transparent;
  -webkit-text-stroke:2px var(--text-3);line-height:1;
}
.error-page h2{font-size:28px;margin:16px 0}
.error-page p{color:var(--text-2);margin-bottom:32px}

/* ── MAINTENANCE ── */
.maintenance-page{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:40px;background:var(--bg);
}
.maintenance-page h1{font-size:48px;margin-bottom:16px}
.maintenance-page p{color:var(--text-2);font-size:16px;max-width:500px;margin-bottom:32px}

/* ── AUTH PAGES ── */
.auth-page{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px;
}
.auth-card{
  width:100%;max-width:440px;background:var(--bg1);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:40px;
}
.auth-card h1{font-size:28px;text-align:center;margin-bottom:8px}
.auth-card .subtitle{text-align:center;color:var(--text-2);font-size:14px;margin-bottom:32px}
.auth-card .auth-footer{text-align:center;margin-top:24px;font-size:13px;color:var(--text-2)}
.auth-card .auth-footer a{color:var(--cyan)}

/* ── CONTACT ── */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.contact-info-card{
  background:var(--bg1);border:1px solid var(--border);border-radius:var(--radius);
  padding:24px;display:flex;align-items:center;gap:16px;
  transition:all .3s var(--ease2);
}
.contact-info-card:hover{border-color:var(--border-h);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,0.15)}
.contact-info-card .icon{font-size:24px;color:var(--cyan);transition:transform .3s var(--ease2)}
.contact-info-card:hover .icon{transform:scale(1.1)}
.contact-info-card .label{font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:0.5px}
.contact-info-card .value{font-weight:500}
.contact-info-card .value a{color:var(--cyan);transition:color .2s}
.contact-info-card .value a:hover{color:var(--text)}

/* ── Contact Success State ── */
.contact-success{
  flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:48px 20px;min-height:360px;
}
.contact-success-icon{
  width:100px;height:100px;margin-bottom:28px;position:relative;
}
.contact-success-icon svg{
  width:100%;height:100%;color:var(--cyan);
  filter:drop-shadow(0 0 24px rgba(0,245,255,0.3));
}
/* Circle: circumference = 2 * PI * 42 ≈ 264 */
.contact-success-icon .success-circle{
  stroke:var(--cyan);
  stroke-dasharray:264;
  stroke-dashoffset:264;
  transition:none;
}
/* Checkmark polyline: total length ≈ 68 */
.contact-success-icon .success-check{
  stroke:var(--cyan);
  stroke-dasharray:68;
  stroke-dashoffset:68;
  transition:none;
}
/* Animations trigger only when .active is added */
.contact-success.active .success-circle{
  animation:csCircleDraw .8s cubic-bezier(0.65,0,0.35,1) .1s forwards;
}
.contact-success.active .success-check{
  animation:csCheckDraw .45s cubic-bezier(0.5,0,0.35,1) .75s forwards;
}
@keyframes csCircleDraw{to{stroke-dashoffset:0}}
@keyframes csCheckDraw{to{stroke-dashoffset:0}}
.contact-success-title{
  font-size:28px;font-weight:700;margin-bottom:12px;
  opacity:0;transform:translateY(14px);
}
.contact-success-desc{
  font-size:15px;color:var(--text-2);line-height:1.7;max-width:400px;
  opacity:0;transform:translateY(14px);
}
.contact-success-btn{
  margin-top:20px;display:inline-flex;align-items:center;gap:8px;
  opacity:0;transform:translateY(14px);
}
.contact-success.active .contact-success-title{
  animation:csFadeUp .5s ease .95s forwards;
}
.contact-success.active .contact-success-desc{
  animation:csFadeUp .5s ease 1.15s forwards;
}
.contact-success.active .contact-success-btn{
  animation:csFadeUp .5s ease 1.35s forwards;
}
@keyframes csFadeUp{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
html[data-theme="light"] .contact-success-icon svg{
  color:var(--cyan);filter:drop-shadow(0 0 20px rgba(0,136,255,0.25));
}

/* ── STATUS PAGE ── */
.status-list{display:flex;flex-direction:column;gap:12px}
.status-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px;background:var(--bg1);border:1px solid var(--border);
  border-radius:var(--radius-sm);
}
.status-item .service-name{font-weight:500}
.status-item .status-indicator{display:flex;align-items:center;gap:8px;font-size:13px}
.status-item .status-indicator .dot{width:10px;height:10px;border-radius:50%}
.status-item .status-indicator .dot.operational{background:var(--green)}
.status-item .status-indicator .dot.degraded{background:var(--amber)}
.status-item .status-indicator .dot.down{background:var(--red)}

/* ── REVEAL ON SCROLL ── */
.reveal{opacity:0;transform:translateY(30px);transition:all .8s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal.reveal-done{transition-delay:0s}
.bento-card.reveal-done{transition:all .15s ease;transition-delay:0s}
.faq-item.reveal.reveal-done{transition:all 0.3s var(--ease2), box-shadow 0.3s var(--ease2), transform 0.3s var(--ease2)}
.faq-item.reveal-done:hover{box-shadow:0 8px 32px rgba(0,245,255,0.08);transform:translateY(-2px)}

/* ── THEME TRANSITION ── */
html.transitioning,html.transitioning *{transition:background-color .4s,color .4s,border-color .4s,box-shadow .4s !important}

/* ── TICKET/CHAT ── */
.chat-thread{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}
.chat-message{
  max-width:75%;padding:16px;border-radius:var(--radius);font-size:14px;line-height:1.7;
}
.chat-message.staff{
  align-self:flex-start;background:rgba(0,245,255,0.05);border:1px solid rgba(0,245,255,0.15);
}
.chat-message.user{
  align-self:flex-end;background:var(--surface);border:1px solid var(--border);
}
.chat-message .msg-meta{font-size:11px;color:var(--text-3);margin-top:8px}

/* ── PAGE HERO (minimal) ── */
.page-hero{padding:120px 20px 40px;text-align:center}
.page-hero h1{font-size:clamp(32px,5vw,52px);margin-bottom:12px}
.page-hero p{color:var(--text-2);font-size:16px}

/* ── CONTENT ── */
.content-body{max-width:800px;margin:0 auto;padding:40px 20px 80px}
.content-body h1{font-size:32px;margin-bottom:24px}
.content-body h2{font-size:24px;margin:32px 0 16px;color:var(--text)}
.content-body h3{font-size:20px;margin:24px 0 12px}
.content-body p{font-size:15px;line-height:1.8;color:var(--text-2);margin-bottom:16px}
.content-body ul,.content-body ol{padding-left:24px;margin-bottom:16px}
.content-body li{margin-bottom:8px;font-size:15px;color:var(--text-2);list-style:disc}
.content-body strong{color:var(--text)}
.content-body a{color:var(--cyan)}

/* ── LICENSE KEY DISPLAY ── */
.license-key{
  font-family:'Space Mono',monospace;padding:8px 12px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px;
}
.license-key:hover{border-color:var(--cyan)}
.license-key .copy-icon{font-size:12px;color:var(--text-3)}

/* ── WISHLIST ── */
.wishlist-btn{
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--surface);border:1px solid var(--border);cursor:pointer;
  transition:all .2s;font-size:16px;color:var(--text-3);
}
.wishlist-btn:hover,.wishlist-btn.active{border-color:var(--red);color:var(--red)}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .bento-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .bento-card{padding:24px}
  .bento-card.span-2{grid-column:span 1}
  .product-layout{grid-template-columns:1fr}
  .purchase-panel{position:static}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}
/* ── MOBILE DASHBOARD NAV ── */
.dash-mobile-nav{
  display:none;overflow-x:auto;-webkit-overflow-scrolling:touch;
  gap:8px;padding:0 0 16px;margin-bottom:16px;border-bottom:1px solid var(--border);
  scrollbar-width:none;
}
.dash-mobile-nav::-webkit-scrollbar{display:none}
.dash-mobile-nav a{
  display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:20px;
  font-size:13px;font-weight:500;color:var(--text-2);background:var(--surface);
  border:1px solid var(--border);white-space:nowrap;transition:all .2s;flex-shrink:0;
}
.dash-mobile-nav a:hover{border-color:var(--border-h);color:var(--text)}
.dash-mobile-nav a.active{background:var(--cyan);color:#020209;border-color:var(--cyan)}

@media(max-width:768px){
  .site-header{padding:0 20px}
  .nav-links{display:none}
  .hamburger{display:flex}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .stats-section{padding:60px 20px}
  .stat-card-inner{padding:22px 18px;gap:14px}
  .stat-number{font-size:34px}
  .stat-icon{width:44px;height:44px;border-radius:12px}
  .stat-icon svg{width:22px;height:22px}
  .stat-ring{width:38px;height:38px}
  .bento-grid{grid-template-columns:1fr;gap:12px}
  .bento-card{padding:20px}
  .bento-card.span-2{grid-column:span 1}
  .products-grid{grid-template-columns:1fr;place-items:center;max-width:400px;margin:0 auto}
  .dashboard-layout{grid-template-columns:1fr}
  .dash-sidebar-col{display:none}
  .dash-mobile-nav{display:flex}
  .hero-content h1{font-size:2.5rem;line-height:1.1}
  .section-inner{padding:0}
  .page-hero{padding:60px 20px}
  .footer-grid{grid-template-columns:1fr;text-align:center}
  .footer-socials{justify-content:center}
  .testimonial-row{display:none}
  .testimonial-row:first-child{display:grid;grid-template-columns:1fr;gap:16px;max-width:400px;margin:0 auto;animation:none}
  .contact-grid{grid-template-columns:1fr}
  .blog-grid{grid-template-columns:1fr}
  .hero h1{font-size:clamp(36px,10vw,64px)}
  .breadcrumb{font-size:13px;gap:6px}
  .breadcrumb .sep{margin:0 2px}
  .page-hero .breadcrumb{font-size:12px;gap:4px}
  .faq-question{font-size:17px;padding:14px 16px;gap:12px}
  .faq-question-text{font-size:15px}
  .faq-question-icon,.faq-toggle-icon{width:30px;height:30px}
  .faq-question-icon .faq-icon-svg{width:24px;height:24px}
  .faq-toggle-icon svg{width:16px;height:16px}
  .faq-answer{font-size:14px}
  .faq-answer p{font-size:13px}
  .faq-item{margin-bottom:12px}
}
@media(max-width:480px){
  .hero{padding:100px 16px 60px}
  .hero-ctas{flex-direction:column;align-items:center}
  .stats-grid{grid-template-columns:1fr;gap:12px}
  .stat-card-inner{padding:20px 16px;gap:12px}
  .stat-number{font-size:30px}
  .stat-icon{width:40px;height:40px;border-radius:10px}
  .stat-icon svg{width:20px;height:20px}
  .stat-ring{width:34px;height:34px}
  .stat-label{font-size:11px;letter-spacing:1px}
  .auth-card{padding:28px 20px}
  .chat-message{max-width:90%}
}

/* ── TOAST NOTIFICATIONS ── */
.toast-container{position:fixed;top:80px;right:16px;z-index:10000;display:flex;flex-direction:column;gap:10px;max-width:400px;pointer-events:none}
.toast{
  position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px 14px 14px;border-radius:14px;
  font-size:13px;font-weight:500;letter-spacing:0.01em;line-height:1.4;
  border:1px solid;backdrop-filter:blur(20px) saturate(1.8);-webkit-backdrop-filter:blur(20px) saturate(1.8);
  box-shadow:0 8px 32px rgba(0,0,0,0.25),0 2px 8px rgba(0,0,0,0.15),inset 0 1px 0 rgba(255,255,255,0.04);
  overflow:hidden;pointer-events:auto;
  animation:toastSlideIn .45s cubic-bezier(0.16,1,0.3,1) forwards;
  transform-origin:right center;
}
.toast.toast-exit{
  animation:toastSlideOut .35s cubic-bezier(0.7,0,0.84,0) forwards;
}
@keyframes toastSlideIn{
  0%{opacity:0;transform:translateX(40px) scale(0.92)}
  100%{opacity:1;transform:translateX(0) scale(1)}
}
@keyframes toastSlideOut{
  0%{opacity:1;transform:translateX(0) scale(1)}
  100%{opacity:0;transform:translateX(50px) scale(0.92)}
}
.toast-success{background:rgba(0,255,136,0.07);border-color:rgba(0,255,136,0.18);color:#00ff88}
.toast-error{background:rgba(255,68,68,0.07);border-color:rgba(255,68,68,0.18);color:#ff4444}
.toast-warning{background:rgba(255,125,0,0.07);border-color:rgba(255,125,0,0.18);color:#ff7d00}
.toast-info{background:rgba(0,245,255,0.07);border-color:rgba(0,245,255,0.18);color:#00f5ff}
.toast-loading{background:rgba(155,92,246,0.07);border-color:rgba(155,92,246,0.18);color:#9b5cf6}
.toast .toast-icon-wrap{
  flex-shrink:0;width:34px;height:34px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:currentColor;position:relative;
}
.toast .toast-icon-wrap::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:currentColor;opacity:0.12;
}
.toast .toast-icon-wrap svg{width:18px;height:18px;color:var(--bg,#020209);position:relative;z-index:1}
.toast-success .toast-icon-wrap{background:rgba(0,255,136,0.15)}
.toast-success .toast-icon-wrap svg{color:#00ff88}
.toast-error .toast-icon-wrap{background:rgba(255,68,68,0.15)}
.toast-error .toast-icon-wrap svg{color:#ff4444}
.toast-warning .toast-icon-wrap{background:rgba(255,125,0,0.15)}
.toast-warning .toast-icon-wrap svg{color:#ff7d00}
.toast-info .toast-icon-wrap{background:rgba(0,245,255,0.15)}
.toast-info .toast-icon-wrap svg{color:#00f5ff}
.toast .toast-body{flex:1;min-width:0}
.toast .toast-title{font-size:13px;font-weight:600;margin-bottom:2px}
.toast .toast-msg{font-size:12px;opacity:0.8;font-weight:400}
.toast .toast-close{
  flex-shrink:0;width:26px;height:26px;border-radius:8px;border:0;
  background:transparent;color:currentColor;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .2s,background .2s;
}
.toast:hover .toast-close{opacity:0.5}
.toast .toast-close:hover{opacity:1;background:rgba(255,255,255,0.06)}
.toast .toast-close svg{width:14px;height:14px}
.toast .toast-progress{
  position:absolute;bottom:0;left:0;height:2px;border-radius:0 0 14px 14px;
  background:currentColor;opacity:0.4;
  animation:toastProgress linear forwards;
}
@keyframes toastProgress{from{width:100%}to{width:0%}}
.toast .toast-icon-wrap .icon-clipboard{animation:clipIconPop .4s cubic-bezier(0.16,1,0.3,1) .15s both}
@keyframes clipIconPop{0%{transform:scale(0) rotate(-15deg);opacity:0}100%{transform:scale(1) rotate(0);opacity:1}}
[data-theme="light"] .toast{box-shadow:0 8px 32px rgba(0,0,0,0.1),0 2px 8px rgba(0,0,0,0.06),inset 0 1px 0 rgba(255,255,255,0.5)}
[data-theme="light"] .toast-success{background:rgba(0,180,80,0.08);border-color:rgba(0,180,80,0.2);color:#00913e}
[data-theme="light"] .toast-success .toast-icon-wrap{background:rgba(0,180,80,0.12)}
[data-theme="light"] .toast-success .toast-icon-wrap svg{color:#00913e}
[data-theme="light"] .toast-error{background:rgba(220,40,40,0.08);border-color:rgba(220,40,40,0.2);color:#c62828}
[data-theme="light"] .toast-info{background:rgba(0,140,180,0.08);border-color:rgba(0,140,180,0.2);color:#00838f}
[data-theme="light"] .toast-warning{background:rgba(200,100,0,0.08);border-color:rgba(200,100,0,0.2);color:#bf5f00}

/* ── BACK TO TOP ── */
.back-to-top{
  position:fixed;bottom:32px;right:32px;z-index:9999;
  width:44px;height:44px;border-radius:12px;border:1px solid var(--border);
  background:var(--surface);color:var(--cyan);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;opacity:0;visibility:hidden;
  transform:translateY(16px);
  transition:opacity .3s,transform .3s,background .2s,border-color .2s;
  backdrop-filter:blur(12px);
}
.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top:hover{background:var(--cyan);color:var(--bg);border-color:var(--cyan)}
.back-to-top:active{transform:translateY(-2px)}