/* ============================================================
   iKHOTECHS — Stylesheet v3.0
   Fonts: Space Grotesk + Inter + JetBrains Mono
   Themes: 20 Premium (10 original + 10 new)
   ============================================================ */

:root {
  --font-display: 'Space Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --radius:    10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --ease:      cubic-bezier(0.4, 0, 0.2, 1);
  --transition: all 0.28s var(--ease);
  --nav-h: 66px;
}

/* ── ORIGINAL 10 THEMES ─────────────────────────────────── */
[data-theme="midnight"] {
  --bg:#07070f;--bg2:#0d0d1a;--card:rgba(19,19,43,0.85);--card-s:#13132b;
  --border:rgba(67,97,238,0.22);--border2:rgba(67,97,238,0.09);
  --primary:#4361ee;--ph:#3451de;--pglow:rgba(67,97,238,0.28);
  --accent:#00d4ff;--accent2:#7b2fff;
  --text:#e8eaf6;--text2:#9fa8c7;--text3:#606899;
  --ok:#00e676;--warn:#ffd740;--danger:#ff1744;
  --grad:linear-gradient(135deg,#4361ee,#00d4ff);
  --grad2:linear-gradient(135deg,#7b2fff,#4361ee);
  --glow:0 0 28px rgba(67,97,238,0.2);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="white"] {
  --bg:#f8faff;--bg2:#eef2ff;--card:#fff;--card-s:#fff;
  --border:#dde3f0;--border2:#eef2ff;
  --primary:#2563eb;--ph:#1d4ed8;--pglow:rgba(37,99,235,0.15);
  --accent:#0891b2;--accent2:#7c3aed;
  --text:#0f172a;--text2:#475569;--text3:#94a3b8;
  --ok:#059669;--warn:#d97706;--danger:#dc2626;
  --grad:linear-gradient(135deg,#2563eb,#0891b2);
  --grad2:linear-gradient(135deg,#7c3aed,#2563eb);
  --glow:0 0 20px rgba(37,99,235,0.1);--shadow:0 4px 20px rgba(0,0,0,0.08);
}
[data-theme="ocean"] {
  --bg:#0a192f;--bg2:#112240;--card:rgba(29,53,87,0.72);--card-s:#1d3557;
  --border:rgba(100,255,218,0.15);--border2:rgba(100,255,218,0.07);
  --primary:#64ffda;--ph:#4fd9b8;--pglow:rgba(100,255,218,0.2);
  --accent:#ccd6f6;--accent2:#57cbff;
  --text:#ccd6f6;--text2:#8892b0;--text3:#495670;
  --ok:#64ffda;--warn:#ffd740;--danger:#ff6b6b;
  --grad:linear-gradient(135deg,#64ffda,#57cbff);
  --glow:0 0 28px rgba(100,255,218,0.15);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="emerald"] {
  --bg:#061a0e;--bg2:#0a2613;--card:rgba(15,51,24,0.82);--card-s:#0f3318;
  --border:rgba(0,230,118,0.2);--border2:rgba(0,230,118,0.08);
  --primary:#00e676;--ph:#00c964;--pglow:rgba(0,230,118,0.22);
  --accent:#76ff03;--accent2:#00bfa5;
  --text:#e8f5e9;--text2:#a5d6a7;--text3:#4caf50;
  --ok:#00e676;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#00e676,#76ff03);
  --glow:0 0 28px rgba(0,230,118,0.18);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="purple"] {
  --bg:#0a0014;--bg2:#12001f;--card:rgba(26,0,48,0.85);--card-s:#1a0030;
  --border:rgba(206,147,216,0.2);--border2:rgba(206,147,216,0.08);
  --primary:#ce93d8;--ph:#ba68c8;--pglow:rgba(206,147,216,0.22);
  --accent:#ff80ab;--accent2:#ea80fc;
  --text:#f3e5f5;--text2:#ce93d8;--text3:#7b1fa2;
  --ok:#a5d6a7;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#ce93d8,#ea80fc);
  --glow:0 0 28px rgba(206,147,216,0.18);--shadow:0 8px 32px rgba(0,0,0,0.6);
}
[data-theme="sunset"] {
  --bg:#1a0500;--bg2:#2d0c00;--card:rgba(61,18,0,0.85);--card-s:#3d1200;
  --border:rgba(255,109,0,0.25);--border2:rgba(255,109,0,0.1);
  --primary:#ff6d00;--ph:#e65c00;--pglow:rgba(255,109,0,0.28);
  --accent:#ffab40;--accent2:#ff3d00;
  --text:#fff3e0;--text2:#ffcc80;--text3:#e65100;
  --ok:#aed581;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#ff6d00,#ffab40);
  --glow:0 0 28px rgba(255,109,0,0.22);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="carbon"] {
  --bg:#000;--bg2:#0a0a0a;--card:rgba(20,20,20,0.95);--card-s:#141414;
  --border:rgba(255,255,255,0.08);--border2:rgba(255,255,255,0.04);
  --primary:#f0f0f0;--ph:#e0e0e0;--pglow:rgba(255,255,255,0.07);
  --accent:#bdbdbd;--accent2:#616161;
  --text:#fff;--text2:#9e9e9e;--text3:#424242;
  --ok:#69f0ae;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#f0f0f0,#9e9e9e);
  --glow:0 0 28px rgba(255,255,255,0.05);--shadow:0 8px 32px rgba(0,0,0,0.8);
}
[data-theme="pink"] {
  --bg:#fff0f3;--bg2:#ffe4e8;--card:#fff;--card-s:#fff;
  --border:rgba(233,30,99,0.2);--border2:rgba(233,30,99,0.08);
  --primary:#e91e63;--ph:#c2185b;--pglow:rgba(233,30,99,0.18);
  --accent:#ff4081;--accent2:#f06292;
  --text:#311b21;--text2:#880e4f;--text3:#f48fb1;
  --ok:#388e3c;--warn:#f57c00;--danger:#c62828;
  --grad:linear-gradient(135deg,#e91e63,#f06292);
  --glow:0 0 20px rgba(233,30,99,0.15);--shadow:0 4px 20px rgba(233,30,99,0.12);
}
[data-theme="arctic"] {
  --bg:#eaf4fb;--bg2:#d6ebf5;--card:rgba(255,255,255,0.9);--card-s:#fff;
  --border:rgba(2,119,189,0.2);--border2:rgba(2,119,189,0.08);
  --primary:#0277bd;--ph:#01579b;--pglow:rgba(2,119,189,0.15);
  --accent:#01579b;--accent2:#00bcd4;
  --text:#01273a;--text2:#0277bd;--text3:#4fc3f7;
  --ok:#388e3c;--warn:#f57c00;--danger:#c62828;
  --grad:linear-gradient(135deg,#0277bd,#00bcd4);
  --glow:0 0 20px rgba(2,119,189,0.15);--shadow:0 4px 20px rgba(2,119,189,0.1);
}
[data-theme="galaxy"] {
  --bg:#030012;--bg2:#06001e;--card:rgba(13,0,45,0.88);--card-s:#0d002d;
  --border:rgba(255,0,255,0.2);--border2:rgba(0,255,255,0.08);
  --primary:#ff00ff;--ph:#cc00cc;--pglow:rgba(255,0,255,0.28);
  --accent:#00ffff;--accent2:#ff6600;
  --text:#f0e6ff;--text2:#c084fc;--text3:#7c3aed;
  --ok:#00ff88;--warn:#ffff00;--danger:#ff3333;
  --grad:linear-gradient(135deg,#ff00ff,#00ffff);
  --glow:0 0 36px rgba(255,0,255,0.18);--shadow:0 8px 32px rgba(0,0,0,0.8);
}

/* ── 10 NEW THEMES ──────────────────────────────────────── */
[data-theme="rose-gold"] {
  --bg:#110508;--bg2:#1c0a10;--card:rgba(32,10,18,0.88);--card-s:#20080e;
  --border:rgba(212,175,55,0.25);--border2:rgba(212,175,55,0.1);
  --primary:#d4af37;--ph:#c4a030;--pglow:rgba(212,175,55,0.25);
  --accent:#ff8fa3;--accent2:#e91e8c;
  --text:#fdf0f0;--text2:#e8c99a;--text3:#8b6914;
  --ok:#a5d6a7;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#d4af37,#ff8fa3);
  --grad2:linear-gradient(135deg,#e91e8c,#d4af37);
  --glow:0 0 28px rgba(212,175,55,0.2);--shadow:0 8px 32px rgba(0,0,0,0.6);
}
[data-theme="forest"] {
  --bg:#020b04;--bg2:#051409;--card:rgba(8,28,12,0.88);--card-s:#081c0c;
  --border:rgba(34,197,94,0.22);--border2:rgba(34,197,94,0.08);
  --primary:#22c55e;--ph:#16a34a;--pglow:rgba(34,197,94,0.22);
  --accent:#86efac;--accent2:#4ade80;
  --text:#f0fdf4;--text2:#86efac;--text3:#166534;
  --ok:#22c55e;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#22c55e,#86efac);
  --grad2:linear-gradient(135deg,#4ade80,#22c55e);
  --glow:0 0 28px rgba(34,197,94,0.18);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="volcanic"] {
  --bg:#0f0000;--bg2:#1a0200;--card:rgba(30,5,0,0.88);--card-s:#1e0500;
  --border:rgba(239,68,68,0.25);--border2:rgba(239,68,68,0.1);
  --primary:#ef4444;--ph:#dc2626;--pglow:rgba(239,68,68,0.25);
  --accent:#fb923c;--accent2:#f97316;
  --text:#fff1f1;--text2:#fca5a5;--text3:#7f1d1d;
  --ok:#a5d6a7;--warn:#ffd740;--danger:#ef4444;
  --grad:linear-gradient(135deg,#ef4444,#fb923c);
  --grad2:linear-gradient(135deg,#f97316,#ef4444);
  --glow:0 0 28px rgba(239,68,68,0.22);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="cyberpunk"] {
  --bg:#080700;--bg2:#100f00;--card:rgba(20,18,0,0.92);--card-s:#141200;
  --border:rgba(234,179,8,0.3);--border2:rgba(234,179,8,0.1);
  --primary:#eab308;--ph:#ca8a04;--pglow:rgba(234,179,8,0.3);
  --accent:#facc15;--accent2:#a3e635;
  --text:#fefce8;--text2:#fde047;--text3:#713f12;
  --ok:#a3e635;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#eab308,#a3e635);
  --grad2:linear-gradient(135deg,#facc15,#eab308);
  --glow:0 0 28px rgba(234,179,8,0.25);--shadow:0 8px 32px rgba(0,0,0,0.7);
}
[data-theme="lavender"] {
  --bg:#f5f0ff;--bg2:#ede8ff;--card:rgba(255,255,255,0.92);--card-s:#fff;
  --border:rgba(124,58,237,0.2);--border2:rgba(124,58,237,0.08);
  --primary:#7c3aed;--ph:#6d28d9;--pglow:rgba(124,58,237,0.15);
  --accent:#a78bfa;--accent2:#c4b5fd;
  --text:#1e1b4b;--text2:#5b21b6;--text3:#c4b5fd;
  --ok:#059669;--warn:#d97706;--danger:#dc2626;
  --grad:linear-gradient(135deg,#7c3aed,#a78bfa);
  --grad2:linear-gradient(135deg,#c4b5fd,#7c3aed);
  --glow:0 0 20px rgba(124,58,237,0.15);--shadow:0 4px 20px rgba(124,58,237,0.1);
}
[data-theme="navy"] {
  --bg:#020617;--bg2:#0f172a;--card:rgba(15,23,42,0.88);--card-s:#0f172a;
  --border:rgba(148,163,184,0.15);--border2:rgba(148,163,184,0.07);
  --primary:#38bdf8;--ph:#0ea5e9;--pglow:rgba(56,189,248,0.22);
  --accent:#7dd3fc;--accent2:#bae6fd;
  --text:#f1f5f9;--text2:#94a3b8;--text3:#334155;
  --ok:#34d399;--warn:#fbbf24;--danger:#f87171;
  --grad:linear-gradient(135deg,#38bdf8,#7dd3fc);
  --grad2:linear-gradient(135deg,#0ea5e9,#38bdf8);
  --glow:0 0 28px rgba(56,189,248,0.2);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="amber"] {
  --bg:#180c00;--bg2:#231200;--card:rgba(35,20,0,0.88);--card-s:#231400;
  --border:rgba(251,146,60,0.25);--border2:rgba(251,146,60,0.1);
  --primary:#fb923c;--ph:#f97316;--pglow:rgba(251,146,60,0.25);
  --accent:#fbbf24;--accent2:#f59e0b;
  --text:#fffbeb;--text2:#fed7aa;--text3:#92400e;
  --ok:#a3e635;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#fb923c,#fbbf24);
  --grad2:linear-gradient(135deg,#f59e0b,#fb923c);
  --glow:0 0 28px rgba(251,146,60,0.22);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="slate"] {
  --bg:#0b0d14;--bg2:#13172a;--card:rgba(19,23,42,0.88);--card-s:#13172a;
  --border:rgba(100,116,139,0.22);--border2:rgba(100,116,139,0.08);
  --primary:#94a3b8;--ph:#64748b;--pglow:rgba(148,163,184,0.18);
  --accent:#cbd5e1;--accent2:#e2e8f0;
  --text:#f8fafc;--text2:#94a3b8;--text3:#475569;
  --ok:#34d399;--warn:#fbbf24;--danger:#f87171;
  --grad:linear-gradient(135deg,#64748b,#94a3b8);
  --grad2:linear-gradient(135deg,#94a3b8,#cbd5e1);
  --glow:0 0 24px rgba(148,163,184,0.15);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="teal"] {
  --bg:#001a18;--bg2:#002520;--card:rgba(0,40,35,0.88);--card-s:#002820;
  --border:rgba(20,184,166,0.25);--border2:rgba(20,184,166,0.1);
  --primary:#14b8a6;--ph:#0d9488;--pglow:rgba(20,184,166,0.22);
  --accent:#2dd4bf;--accent2:#5eead4;
  --text:#f0fdfa;--text2:#99f6e4;--text3:#134e4a;
  --ok:#14b8a6;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#14b8a6,#2dd4bf);
  --grad2:linear-gradient(135deg,#0d9488,#14b8a6);
  --glow:0 0 28px rgba(20,184,166,0.2);--shadow:0 8px 32px rgba(0,0,0,0.5);
}
[data-theme="crimson"] {
  --bg:#0d0005;--bg2:#18000a;--card:rgba(28,0,14,0.88);--card-s:#1c000e;
  --border:rgba(219,39,119,0.25);--border2:rgba(219,39,119,0.1);
  --primary:#db2777;--ph:#be185d;--pglow:rgba(219,39,119,0.25);
  --accent:#f472b6;--accent2:#fb7185;
  --text:#fff1f8;--text2:#f9a8d4;--text3:#831843;
  --ok:#a5d6a7;--warn:#ffd740;--danger:#ff5252;
  --grad:linear-gradient(135deg,#db2777,#f472b6);
  --grad2:linear-gradient(135deg,#fb7185,#db2777);
  --glow:0 0 28px rgba(219,39,119,0.22);--shadow:0 8px 32px rgba(0,0,0,0.6);
}

/* ── BASE ─────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;transition:background .4s,color .4s;-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.6;}
a{color:var(--primary);text-decoration:none;}
a:hover{color:var(--accent);}
img{max-width:100%;height:auto;display:block;}
button,input,select,textarea{font-family:var(--font-body);}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.2;letter-spacing:-0.02em;}
.grad-text{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
code,pre,.mono{font-family:var(--font-mono);}

/* ── LAYOUT ───────────────────────────────────────────────── */
.container{max-width:1200px;margin:0 auto;padding:0 28px;}
.section{padding:96px 0;}
.section-alt{background:var(--bg2);}
.section-header{text-align:center;margin-bottom:60px;}
.label-pill{display:inline-block;background:var(--pglow);color:var(--primary);border:1px solid var(--border);border-radius:999px;padding:5px 16px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:14px;}
.section-title{font-size:clamp(1.8rem,4.5vw,2.8rem);margin-bottom:14px;}
.section-sub{color:var(--text2);font-size:1rem;max-width:520px;margin:0 auto;line-height:1.7;}

/* ── BUTTONS ──────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:var(--radius);font-family:var(--font-body);font-size:.9rem;font-weight:600;cursor:pointer;transition:var(--transition);border:none;white-space:nowrap;line-height:1;letter-spacing:.01em;}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px var(--pglow);}
.btn-primary:hover{background:var(--ph);transform:translateY(-2px);box-shadow:0 8px 24px var(--pglow);color:#fff;}
.btn-outline{background:transparent;color:var(--primary);border:1.5px solid var(--primary);}
.btn-outline:hover{background:var(--primary);color:#fff;transform:translateY(-2px);}
.btn-ghost{background:rgba(255,255,255,0.05);color:var(--text);border:1px solid var(--border);}
.btn-ghost:hover{background:var(--primary);color:#fff;border-color:var(--primary);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-danger:hover{filter:brightness(1.12);transform:translateY(-1px);}
.btn-ok{background:var(--ok);color:#000;}
.btn-sm{padding:6px 13px;font-size:.8rem;}
.btn-lg{padding:14px 28px;font-size:.95rem;border-radius:var(--radius-lg);}
.btn-xl{padding:16px 34px;font-size:1rem;border-radius:var(--radius-lg);}
.btn-block{width:100%;justify-content:center;}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none!important;}
.btn-icon{width:36px;height:36px;padding:0;justify-content:center;}

/* ── CARDS ────────────────────────────────────────────────── */
.card{background:var(--card);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:var(--transition);}
.card:hover{border-color:var(--primary);box-shadow:var(--glow);transform:translateY(-3px);}

/* ── ANNOUNCEMENT TICKER ──────────────────────────────────── */
.ann-bar{background:var(--grad);padding:10px 0;overflow:hidden;}
.ticker-inner{display:flex;animation:ticker-go 50s linear infinite;white-space:nowrap;}
.ticker-inner:hover{animation-play-state:paused;}
.ticker-item{padding:0 44px;font-size:.82rem;font-weight:500;color:#fff;letter-spacing:.02em;}
.ticker-item::after{content:'◆';margin-left:44px;opacity:.35;}
@keyframes ticker-go{from{transform:translateX(100vw);}to{transform:translateX(-100%);}}

/* ── NAVBAR ───────────────────────────────────────────────── */
.navbar{position:sticky;top:0;z-index:190;height:var(--nav-h);background:rgba(7,7,15,.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border2);display:flex;align-items:center;justify-content:space-between;padding:0 32px;transition:background .4s;}
[data-theme="white"] .navbar,[data-theme="pink"] .navbar,[data-theme="arctic"] .navbar,[data-theme="lavender"] .navbar{background:rgba(255,255,255,.94);}
.nav-brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:1.2rem;font-weight:700;color:var(--text);letter-spacing:-.02em;}
.nav-logo{width:36px;height:36px;background:var(--grad);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.nav-links{display:flex;align-items:center;gap:2px;list-style:none;}
.nav-links a{padding:7px 12px;color:var(--text2);font-weight:500;border-radius:8px;transition:var(--transition);font-size:.86rem;}
.nav-links a:hover,.nav-links a.active{color:var(--text);background:rgba(255,255,255,.07);}
.nav-actions{display:flex;align-items:center;gap:10px;}
.hamburger{display:none;background:none;border:none;color:var(--text);font-size:1.3rem;cursor:pointer;padding:6px;}
.mob-menu{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:var(--bg2);border-bottom:1px solid var(--border);padding:12px;z-index:180;flex-direction:column;gap:4px;box-shadow:0 8px 24px rgba(0,0,0,.3);}
.mob-menu.open{display:flex;}
.mob-menu a{padding:11px 14px;color:var(--text);font-weight:500;border-radius:9px;transition:var(--transition);display:block;font-size:.9rem;}
.mob-menu a:hover{background:rgba(255,255,255,.06);color:var(--primary);}

/* ── HERO ─────────────────────────────────────────────────── */
.hero{min-height:calc(100vh - var(--nav-h) - 40px);display:flex;align-items:center;justify-content:center;text-align:center;padding:80px 24px;position:relative;overflow:hidden;}
.hero-bg{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse 80% 60% at 50% 30%,var(--pglow),transparent);animation:hbg 6s ease-in-out infinite;}
.hero-dots{position:absolute;inset:0;opacity:.06;background-image:radial-gradient(var(--primary) 1px,transparent 1px);background-size:30px 30px;}
@keyframes hbg{0%,100%{opacity:.5;transform:scale(1);}50%{opacity:.9;transform:scale(1.05);}}
.hero-content{position:relative;z-index:1;max-width:860px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--pglow);border:1px solid var(--border);border-radius:999px;padding:6px 16px;font-size:.78rem;color:var(--accent);margin-bottom:24px;font-weight:600;animation:slide-down .7s var(--ease) both;}
.hero-title{font-size:clamp(2.8rem,7vw,5.8rem);font-weight:700;line-height:1.04;margin-bottom:22px;animation:slide-up .7s var(--ease) .1s both;letter-spacing:-.03em;}
.hero-sub{font-size:clamp(1rem,2.5vw,1.15rem);color:var(--text2);max-width:560px;margin:0 auto 36px;line-height:1.7;animation:slide-up .7s var(--ease) .2s both;}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;animation:slide-up .7s var(--ease) .3s both;}
.hero-stats{display:flex;gap:40px;justify-content:center;margin-top:60px;animation:slide-up .7s var(--ease) .4s both;flex-wrap:wrap;padding-top:36px;border-top:1px solid var(--border2);max-width:560px;margin-left:auto;margin-right:auto;}
.stat-val{font-family:var(--font-display);font-size:2rem;font-weight:700;letter-spacing:-.02em;}
.stat-val.g{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.stat-lbl{font-size:.75rem;color:var(--text3);margin-top:3px;text-transform:uppercase;letter-spacing:.08em;}

/* ── TRUST BAR ────────────────────────────────────────────── */
.trust-bar{display:flex;align-items:center;justify-content:center;gap:28px;padding:20px 24px;border-top:1px solid var(--border2);border-bottom:1px solid var(--border2);background:var(--bg2);flex-wrap:wrap;}
.trust-item{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--text2);font-weight:500;}
.trust-item i{color:var(--primary);font-size:1rem;}

/* ── PRODUCT GRID ─────────────────────────────────────────── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;}
.pcard{background:var(--card);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:var(--transition);cursor:pointer;position:relative;}
.pcard:hover{border-color:var(--primary);box-shadow:var(--glow),0 12px 48px rgba(0,0,0,.25);transform:translateY(-6px);}
.pcard-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg2);}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.pcard:hover .pcard-img img{transform:scale(1.08);}
.pcard-cat{position:absolute;top:10px;left:10px;background:var(--grad);color:#fff;padding:3px 10px;border-radius:999px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;}
.pcard-badge{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);color:#fff;padding:3px 9px;border-radius:999px;font-size:.68rem;font-weight:600;}
.pcard-body{padding:18px 20px 20px;}
.pcard-title{font-family:var(--font-display);font-size:1rem;font-weight:600;margin-bottom:7px;line-height:1.3;color:var(--text);letter-spacing:-.01em;}
.pcard-desc{font-size:.82rem;color:var(--text2);margin-bottom:16px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.pcard-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.pcard-price{font-family:var(--font-display);font-size:1.25rem;font-weight:700;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em;}
.pcard-btns{display:flex;gap:6px;}

/* ── CATEGORIES ───────────────────────────────────────────── */
.catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;}
.catcard{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px 14px;text-align:center;cursor:pointer;transition:var(--transition);display:block;position:relative;overflow:hidden;}
.catcard::before{content:'';position:absolute;inset:0;background:var(--grad);opacity:0;transition:var(--transition);}
.catcard:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--glow);}
.catcard:hover::before{opacity:.06;}
.catcard-icon{font-size:2rem;display:block;margin-bottom:10px;position:relative;transition:transform .3s var(--ease);}
.catcard:hover .catcard-icon{transform:scale(1.15) rotate(-5deg);}
.catcard-name{font-family:var(--font-display);font-size:.85rem;font-weight:600;color:var(--text);position:relative;letter-spacing:-.01em;}
.catcard-count{font-size:.7rem;color:var(--text3);margin-top:3px;position:relative;}

/* ── OTHER STORES ─────────────────────────────────────────── */
.stores-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;}
.store-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px 20px;text-align:center;transition:var(--transition);display:flex;flex-direction:column;align-items:center;gap:12px;position:relative;overflow:hidden;cursor:pointer;}
.store-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transition:transform .3s var(--ease);}
.store-card:hover{border-color:var(--primary);transform:translateY(-5px);box-shadow:var(--glow);}
.store-card:hover::after{transform:scaleX(1);}
.store-logo{width:64px;height:64px;border-radius:16px;background:var(--bg2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:1.8rem;transition:var(--transition);overflow:hidden;}
.store-logo img{width:100%;height:100%;object-fit:contain;padding:8px;}
.store-card:hover .store-logo{border-color:var(--primary);box-shadow:var(--glow);}
.store-name{font-family:var(--font-display);font-size:.95rem;font-weight:700;color:var(--text);letter-spacing:-.01em;}
.store-desc{font-size:.76rem;color:var(--text2);line-height:1.5;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.store-link{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:600;color:var(--primary);margin-top:auto;transition:var(--transition);}
.store-link:hover{gap:8px;color:var(--accent);}

/* ── EXTERNAL LINKS ───────────────────────────────────────── */
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
.lcard{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;color:var(--text);font-weight:500;font-size:.88rem;transition:var(--transition);cursor:pointer;}
.lcard:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px);box-shadow:var(--glow);}
.lcard i{font-size:1.2rem;color:var(--primary);}

/* ── HOW IT WORKS ─────────────────────────────────────────── */
.how-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2px;position:relative;}
.how-card{background:var(--card);border:1px solid var(--border);padding:32px 24px;text-align:center;transition:var(--transition);position:relative;}
.how-card:first-child{border-radius:var(--radius-lg) 0 0 var(--radius-lg);}
.how-card:last-child{border-radius:0 var(--radius-lg) var(--radius-lg) 0;}
.how-card:hover{background:var(--pglow);z-index:1;box-shadow:var(--glow);}
.how-step-num{position:absolute;top:16px;right:18px;font-family:var(--font-display);font-size:3rem;font-weight:700;color:var(--border);line-height:1;transition:var(--transition);}
.how-card:hover .how-step-num{color:var(--primary);opacity:.4;}
.how-icon{font-size:2.4rem;display:block;margin-bottom:14px;}
.how-card h3{font-size:.95rem;margin-bottom:8px;font-weight:600;}
.how-card p{font-size:.82rem;color:var(--text2);line-height:1.6;}

/* ── FLOATING CONTACTS ────────────────────────────────────── */
.floats{position:fixed;bottom:26px;right:26px;display:flex;flex-direction:column;gap:10px;z-index:900;}
.float-btn{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff;box-shadow:0 4px 18px rgba(0,0,0,.3);transition:var(--transition);}
.float-btn:hover{transform:scale(1.12) translateY(-3px);color:#fff;}
.f-wa{background:#25d366;}.f-wa:hover{background:#1da851;}
.f-tg{background:#2aabee;}.f-tg:hover{background:#1b95d6;}

/* ── FOOTER ───────────────────────────────────────────────── */
.footer{background:var(--bg2);border-top:1px solid var(--border2);padding:60px 32px 28px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;max-width:1200px;margin:0 auto 48px;}
.footer-brand-name{font-family:var(--font-display);font-size:1.4rem;font-weight:700;margin-bottom:12px;letter-spacing:-.02em;}
.footer-brand p{color:var(--text2);font-size:.85rem;line-height:1.65;}
.footer-socials{display:flex;gap:12px;margin-top:18px;}
.footer-socials a{color:var(--text3);font-size:1.2rem;transition:var(--transition);width:36px;height:36px;border-radius:9px;background:var(--border2);display:flex;align-items:center;justify-content:center;}
.footer-socials a:hover{color:#fff;background:var(--primary);}
.footer-col h4{font-family:var(--font-display);font-weight:600;font-size:.83rem;margin-bottom:18px;letter-spacing:.05em;text-transform:uppercase;color:var(--text3);}
.footer-col ul{list-style:none;}
.footer-col ul li{margin-bottom:9px;}
.footer-col ul li a{color:var(--text2);font-size:.84rem;transition:var(--transition);}
.footer-col ul li a:hover{color:var(--primary);}
.footer-bottom{border-top:1px solid var(--border2);padding-top:22px;display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;flex-wrap:wrap;gap:10px;}
.footer-bottom p{color:var(--text3);font-size:.78rem;}

/* ── MODAL ────────────────────────────────────────────────── */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;}
.overlay.open{opacity:1;visibility:visible;}
.modal{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px;max-width:580px;width:100%;max-height:90vh;overflow-y:auto;position:relative;transform:scale(.93) translateY(14px);transition:transform .3s var(--ease);scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
.overlay.open .modal{transform:scale(1) translateY(0);}
.modal-x{position:absolute;top:14px;right:14px;background:var(--border);border:none;color:var(--text2);width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.85rem;transition:var(--transition);}
.modal-x:hover{background:var(--danger);color:#fff;}

/* ── SEARCH + FILTER ──────────────────────────────────────── */
.search-wrap{position:relative;max-width:600px;margin:0 auto 28px;}
.search-inp{width:100%;padding:13px 20px 13px 46px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);color:var(--text);font-size:.9rem;outline:none;transition:var(--transition);font-family:var(--font-body);}
.search-inp:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--pglow);}
.search-inp::placeholder{color:var(--text3);}
.search-ico{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--text3);pointer-events:none;font-size:.9rem;}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;align-items:center;}
.fpill{padding:6px 16px;background:var(--card);border:1px solid var(--border);border-radius:999px;color:var(--text2);font-size:.8rem;font-weight:500;cursor:pointer;transition:var(--transition);font-family:var(--font-body);}
.fpill:hover,.fpill.on{background:var(--primary);color:#fff;border-color:var(--primary);}
.fsort{padding:6px 14px;background:var(--card);border:1px solid var(--border);border-radius:999px;color:var(--text2);font-size:.8rem;cursor:pointer;outline:none;transition:var(--transition);font-family:var(--font-body);margin-left:auto;}
.fsort:focus{border-color:var(--primary);}

/* ── FORM CONTROLS ────────────────────────────────────────── */
.fg{margin-bottom:18px;}
.fg label{display:block;font-size:.8rem;font-weight:600;margin-bottom:7px;color:var(--text2);letter-spacing:.01em;}
.fc{width:100%;padding:10px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.88rem;outline:none;transition:var(--transition);font-family:var(--font-body);}
.fc:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--pglow);}
.fc::placeholder{color:var(--text3);}
textarea.fc{resize:vertical;min-height:90px;}
select.fc{cursor:pointer;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.fhint{font-size:.74rem;color:var(--text3);margin-top:5px;}
.form-check{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:.86rem;color:var(--text2);}
.form-check input[type=checkbox]{width:15px;height:15px;accent-color:var(--primary);cursor:pointer;}

/* ── TABLES ───────────────────────────────────────────────── */
.tbl-wrap{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--border);}
table{width:100%;border-collapse:collapse;}
table th{background:var(--bg2);padding:10px 14px;text-align:left;font-size:.72rem;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border);}
table td{padding:12px 14px;font-size:.84rem;border-bottom:1px solid var(--border2);vertical-align:middle;}
table tr:last-child td{border-bottom:none;}
table tr:hover td{background:rgba(255,255,255,.02);}

/* ── BADGES ───────────────────────────────────────────────── */
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.68rem;font-weight:700;letter-spacing:.02em;}
.b-p{background:var(--pglow);color:var(--primary);}
.b-ok{background:rgba(0,230,118,.15);color:var(--ok);}
.b-warn{background:rgba(255,215,64,.15);color:var(--warn);}
.b-danger{background:rgba(255,23,68,.15);color:var(--danger);}
.b-sec{background:var(--border);color:var(--text3);}

/* ── ALERTS ───────────────────────────────────────────────── */
.alert{padding:12px 16px;border-radius:var(--radius);margin-bottom:16px;font-size:.86rem;border-left:3px solid;line-height:1.5;}
.a-ok{background:rgba(0,230,118,.08);border-color:var(--ok);color:var(--ok);}
.a-err{background:rgba(255,23,68,.08);border-color:var(--danger);color:var(--danger);}
.a-info{background:var(--pglow);border-color:var(--primary);color:var(--primary);}
.a-warn{background:rgba(255,215,64,.08);border-color:var(--warn);color:var(--warn);}

/* ── TOAST ────────────────────────────────────────────────── */
#toast-zone{position:fixed;bottom:90px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:340px;}
.toast{background:var(--card-s,var(--bg2));border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow);transform:translateX(400px);transition:transform .35s var(--ease);}
.toast.show{transform:translateX(0);}
.toast.t-ok{border-left:3px solid var(--ok);}
.toast.t-err{border-left:3px solid var(--danger);}
.toast.t-info{border-left:3px solid var(--primary);}
.toast .ti{font-size:.95rem;flex-shrink:0;}
.toast .tt{font-size:.82rem;color:var(--text);font-weight:500;line-height:1.4;}

/* ── SCROLL TOP ───────────────────────────────────────────── */
.stb{position:fixed;bottom:90px;right:90px;z-index:899;width:40px;height:40px;background:var(--primary);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:.88rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px var(--pglow);opacity:0;pointer-events:none;transition:var(--transition);}
.stb.show{opacity:1;pointer-events:all;}
.stb:hover{transform:translateY(-3px);}

/* ── LOADING / EMPTY ──────────────────────────────────────── */
.spin-wrap{display:flex;align-items:center;justify-content:center;padding:60px 20px;flex-direction:column;gap:14px;}
.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .75s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.empty{text-align:center;padding:56px 20px;color:var(--text3);}
.empty .ei{font-size:3.5rem;display:block;margin-bottom:14px;}
.empty h3{color:var(--text2);margin-bottom:8px;font-size:1rem;font-weight:600;}
.empty p{font-size:.84rem;}
.divider{height:1px;background:var(--border);margin:20px 0;}

/* ── CHECKOUT ─────────────────────────────────────────────── */
.checkout-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:28px;max-width:980px;margin:0 auto;}
.order-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:24px;position:sticky;top:84px;height:fit-content;}
.checkout-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:24px;}
.price-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--border2);font-size:.88rem;}
.price-row:last-child{border-bottom:none;}
.price-row.total{font-family:var(--font-display);font-size:1.15rem;font-weight:700;padding-top:14px;}
.price-row.total .pv{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.price-row .pk{color:var(--text2);}

/* ── SUCCESS ──────────────────────────────────────────────── */
.success-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px;}
.success-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:48px 40px;max-width:560px;width:100%;text-align:center;}
.success-icon{font-size:4rem;display:block;margin-bottom:18px;animation:bounce-in .6s var(--ease);}
@keyframes bounce-in{0%{transform:scale(0);}60%{transform:scale(1.2);}100%{transform:scale(1);}}

/* ── ADMIN ────────────────────────────────────────────────── */
.admin-wrap{display:flex;min-height:100vh;}
.sidebar{width:236px;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:18px 0;position:fixed;top:0;bottom:0;overflow-y:auto;z-index:100;}
.sidebar-logo{display:flex;align-items:center;gap:10px;padding:14px 18px 22px;font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--text);letter-spacing:-.02em;}
.sl-icon{width:32px;height:32px;background:var(--grad);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.9rem;}
.sidebar-nav{flex:1;}
.snav-item{display:flex;align-items:center;gap:9px;padding:10px 18px;color:var(--text2);font-size:.84rem;font-weight:500;cursor:pointer;transition:var(--transition);border-left:2px solid transparent;}
.snav-item:hover{color:var(--text);background:var(--pglow);}
.snav-item.on{color:var(--primary);background:var(--pglow);border-left-color:var(--primary);}
.snav-item i{width:15px;text-align:center;font-size:.82rem;}
.sidebar-foot{padding:14px 18px;border-top:1px solid var(--border);}
.admin-main{flex:1;margin-left:236px;min-height:100vh;background:var(--bg);}
.admin-topbar{height:58px;background:var(--bg2);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:90;}
.admin-topbar h2{font-family:var(--font-display);font-size:1.05rem;font-weight:600;}
.admin-content{padding:24px;}
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:24px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;position:relative;overflow:hidden;}
.stat-card::before{content:'';position:absolute;top:-20px;right:-20px;width:80px;height:80px;background:var(--pglow);border-radius:50%;}
.stat-card .sc-val{font-family:var(--font-display);font-size:1.8rem;font-weight:700;margin-bottom:3px;letter-spacing:-.02em;}
.stat-card .sc-lbl{font-size:.72rem;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.07em;}
.stat-card .sc-icon{position:absolute;top:18px;right:18px;font-size:1.4rem;opacity:.4;}
.tab-content{display:none;}
.tab-content.on{display:block;}
.admin-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;margin-bottom:20px;}
.admin-section-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.admin-section-hd h3{font-size:.95rem;font-weight:600;letter-spacing:-.01em;}
.theme-swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
.ts-item{border-radius:var(--radius);overflow:hidden;cursor:pointer;border:2px solid transparent;transition:var(--transition);}
.ts-item:hover{transform:translateY(-3px);}
.ts-item.active{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary);}
.ts-swatch{height:48px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.ts-label{text-align:center;font-size:.68rem;font-weight:700;padding:5px 4px;background:var(--bg2);color:var(--text2);}
.toggle-switch{position:relative;display:inline-block;width:42px;height:23px;}
.toggle-switch input{opacity:0;width:0;height:0;}
.toggle-slider{position:absolute;inset:0;background:var(--border);border-radius:999px;cursor:pointer;transition:.3s;}
.toggle-slider::before{content:'';position:absolute;width:17px;height:17px;background:#fff;border-radius:50%;left:3px;bottom:3px;transition:.3s;}
.toggle-switch input:checked+.toggle-slider{background:var(--primary);}
.toggle-switch input:checked+.toggle-slider::before{transform:translateX(19px);}
.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border2);}
.toggle-row:last-child{border-bottom:none;}
.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px;}
.chart-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;}
.chart-box h4{font-size:.75rem;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;}
.top-prod{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border2);}
.top-prod:last-child{border-bottom:none;}
.tp-rank{width:22px;height:22px;background:var(--grad);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.64rem;font-weight:800;color:#fff;flex-shrink:0;}
.realtime-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:rtpulse 2s ease-in-out infinite;display:inline-block;margin-right:7px;}
@keyframes rtpulse{0%,100%{opacity:1;}50%{opacity:.2;}}
.fb-badge,.tg-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-size:.72rem;font-weight:600;}
.fb-on{background:rgba(0,230,118,.1);color:var(--ok);border:1px solid rgba(0,230,118,.25);}
.fb-off{background:rgba(255,215,64,.1);color:var(--warn);border:1px solid rgba(255,215,64,.25);}
.tg-on{background:rgba(42,171,238,.1);color:#2aabee;border:1px solid rgba(42,171,238,.25);}
.tg-off{background:rgba(255,23,68,.08);color:var(--danger);border:1px solid rgba(255,23,68,.2);}

/* ── ANIMATIONS ───────────────────────────────────────────── */
@keyframes slide-up{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
@keyframes slide-down{from{opacity:0;transform:translateY(-16px);}to{opacity:1;transform:translateY(0);}}
@keyframes fade-in{from{opacity:0;}to{opacity:1;}}
@keyframes float-y{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}

/* Scroll-reveal (applied via JS IntersectionObserver) */
.reveal{opacity:0;transform:translateY(32px);transition:opacity .65s var(--ease),transform .65s 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-delay-4{transition-delay:.4s;}
.reveal-delay-5{transition-delay:.5s;}
.reveal-delay-6{transition-delay:.6s;}

/* Stagger for grid children */
.stagger-children>*{opacity:0;transform:translateY(28px);transition:opacity .55s var(--ease),transform .55s var(--ease);}
.stagger-children.visible>*:nth-child(1){opacity:1;transform:none;transition-delay:.05s;}
.stagger-children.visible>*:nth-child(2){opacity:1;transform:none;transition-delay:.1s;}
.stagger-children.visible>*:nth-child(3){opacity:1;transform:none;transition-delay:.15s;}
.stagger-children.visible>*:nth-child(4){opacity:1;transform:none;transition-delay:.2s;}
.stagger-children.visible>*:nth-child(5){opacity:1;transform:none;transition-delay:.25s;}
.stagger-children.visible>*:nth-child(6){opacity:1;transform:none;transition-delay:.3s;}
.stagger-children.visible>*:nth-child(n+7){opacity:1;transform:none;transition-delay:.35s;}

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media(max-width:1024px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
}
@media(max-width:900px){
  .checkout-grid{grid-template-columns:1fr;}
  .order-box{position:static;}
  .analytics-grid{grid-template-columns:1fr;}
  .sidebar{width:200px;}
  .admin-main{margin-left:200px;}
  .how-card:first-child{border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
  .how-card:last-child{border-radius:0 0 var(--radius-lg) var(--radius-lg);}
}
@media(max-width:768px){
  .nav-links{display:none;}
  .hamburger{display:block;}
  .hero{min-height:auto;padding:56px 20px;}
  .section{padding:64px 0;}
  .pgrid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));}
  .catgrid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));}
  .stores-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));}
  .navbar,.footer{padding-left:16px;padding-right:16px;}
  .footer-grid{grid-template-columns:1fr;}
  .frow{grid-template-columns:1fr;}
  .admin-wrap{flex-direction:column;}
  .sidebar{position:relative;width:100%;height:auto;padding:8px;overflow-x:auto;bottom:auto;flex-direction:row;}
  .sidebar-logo{display:none;}
  .sidebar-nav{display:flex;gap:2px;flex-direction:row;}
  .snav-item{border-left:none;border-bottom:2px solid transparent;padding:7px 10px;font-size:.76rem;white-space:nowrap;}
  .snav-item.on{border-bottom-color:var(--primary);border-left:none;}
  .admin-main{margin-left:0;}
  .admin-topbar{display:none;}
  .floats{bottom:14px;right:14px;}
  .stb{right:78px;bottom:78px;}
  .hero-stats{gap:20px;}
  .theme-swatches{grid-template-columns:repeat(4,1fr);}
}
@media(max-width:480px){
  .pgrid{grid-template-columns:1fr;}
  .catgrid{grid-template-columns:repeat(3,1fr);}
  .stores-grid{grid-template-columns:repeat(2,1fr);}
  .hero-cta{flex-direction:column;align-items:center;}
  .modal{padding:22px;}
  .success-card{padding:32px 24px;}
  .theme-swatches{grid-template-columns:repeat(3,1fr);}
}

/* ── LOGO ──────────────────────────────────────────────── */
.nav-brand { gap: 0; }
.nav-logo-full {
  height: 38px; width: auto; border-radius: 8px;
  background: #000; padding: 3px 10px;
  display: block; object-fit: contain;
}
.nav-logo-icon { display: none; }

/* ── SKELETON LOADERS ─────────────────────────────────── */
@keyframes shimmer {
  0% { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}
.skeleton {
  background: linear-gradient(90deg, var(--border2) 25%, var(--border) 50%, var(--border2) 75%);
  background-size: 600px 100%;
  animation: shimmer 1.6s infinite;
  border-radius: var(--radius);
}
.skel-card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); overflow: hidden;
}
.skel-img { aspect-ratio: 4/3; }
.skel-body { padding: 18px 20px; }
.skel-line { height: 13px; margin-bottom: 10px; }
.skel-line.w60 { width: 60%; }
.skel-line.w40 { width: 40%; }
.skel-line.w80 { width: 80%; }
.skel-price { height: 20px; width: 35%; margin-bottom: 0; }

/* ── STOCK BADGES ─────────────────────────────────────── */
.stock-badge {
  display: inline-block; font-size: .68rem; font-weight: 700;
  padding: 2px 8px; border-radius: 999px; margin-top: 4px;
  letter-spacing: .02em;
}
.stock-out { background: rgba(255,23,68,.15); color: var(--danger); }
.stock-low { background: rgba(255,109,0,.15); color: #ff6d00; }
.stock-warn { background: rgba(255,215,64,.12); color: var(--warn); }

/* ── MOBILE BOTTOM NAV ────────────────────────────────── */
.mob-bottom-nav {
  display: none; position: fixed; bottom: 0; left: 0; right: 0;
  height: 58px; background: var(--bg2); border-top: 1px solid var(--border);
  z-index: 850; grid-template-columns: repeat(4,1fr);
  align-items: stretch; backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
.mbn-item {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; color: var(--text3); font-size: .6rem; font-weight: 600;
  text-decoration: none; transition: var(--transition); text-transform: uppercase;
  letter-spacing: .05em; position: relative;
}
.mbn-item i { font-size: 1.15rem; transition: var(--transition); }
.mbn-item:hover, .mbn-item.active { color: var(--primary); }
.mbn-item.active i { transform: scale(1.15); }
.mbn-item.active::before {
  content: ''; position: absolute; top: 0; left: 50%;
  transform: translateX(-50%); width: 28px; height: 2px;
  background: var(--primary); border-radius: 0 0 4px 4px;
}
@media(max-width: 768px) {
  .mob-bottom-nav { display: grid; }
  body { padding-bottom: 58px; }
  .floats { bottom: 68px; }
  .stb { bottom: 80px; right: 14px; }
  #toast-zone { bottom: 70px; }
}

/* ── ORDER LOOKUP ─────────────────────────────────────── */
.lookup-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 20px; }
.lookup-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-xl); padding: 40px 36px; max-width: 520px; width: 100%; }
.order-result-card { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px; margin-bottom: 14px; transition: var(--transition); }
.order-result-card:hover { border-color: var(--primary); }
.order-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.order-ref-code { font-family: var(--font-mono); font-size: .74rem; color: var(--text3); }

/* ── TERMS PAGE ───────────────────────────────────────── */
.terms-wrap { max-width: 760px; margin: 0 auto; padding: 60px 28px; }
.terms-wrap h1 { font-size: 2rem; margin-bottom: 8px; }
.terms-wrap h2 { font-size: 1.2rem; margin: 32px 0 10px; color: var(--primary); }
.terms-wrap p { color: var(--text2); line-height: 1.8; margin-bottom: 14px; font-size: .93rem; }
.terms-wrap ul { color: var(--text2); padding-left: 20px; margin-bottom: 14px; }
.terms-wrap ul li { margin-bottom: 7px; font-size: .93rem; line-height: 1.7; }
.terms-updated { font-size: .8rem; color: var(--text3); margin-bottom: 36px; }

/* ── PRINT STYLES ────────────────────────────────────────── */
@media print {
  .navbar,.floats,.stb,.mob-bottom-nav,.footer,.btn-outline,.btn-ghost,
  #toast-zone,.hero,.ann-bar,.mob-menu { display: none !important; }
  body { background: #fff !important; color: #000 !important; padding: 0 !important; font-size: 12pt; }
  .success-wrap { min-height: auto; padding: 0; }
  .success-card { border: none; padding: 0; max-width: 100%; box-shadow: none; }
  .rr { border-color: #ddd; }
  .badge { border: 1px solid #ccc; }
  .grad-text { -webkit-text-fill-color: #000 !important; }
  .deliv-card { border: 1px solid #ddd; background: #f9f9f9 !important; }
  a { color: #000; }
  .btn-primary { background: #333 !important; color: #fff !important; -webkit-print-color-adjust: exact; }
}

/* ── PRODUCT CARD BUTTON DOMINANCE ────────────────────────── */
.pcard-btns .btn-primary {
  min-width: 80px;
  font-size: .8rem;
  font-weight: 700;
  box-shadow: 0 2px 8px var(--pglow);
}
.pcard-btns .btn-ghost {
  opacity: .7;
  font-size: .78rem;
}
.pcard:hover .pcard-btns .btn-primary {
  box-shadow: 0 4px 14px var(--pglow);
  transform: translateY(-1px);
}

/* ── MOBILE CHECKOUT FIX ─────────────────────────────────── */
@media(max-width: 640px) {
  .checkout-box, .order-box { padding: 18px 16px; }
  .checkout-page { padding: 24px 14px 70px; }
  .pay-method-toggle { grid-template-columns: 1fr; gap: 10px; }
  .pmb { padding: 14px 12px; }
}

/* ── CUSTOMER TABLE ──────────────────────────────────────── */
.customer-rank {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--grad); display: flex; align-items: center; justify-content: center;
  font-size: .72rem; font-weight: 800; color: #fff; flex-shrink: 0;
}

/* ── SOCIAL LINKS IN FOOTER ──────────────────────────────── */
.footer-socials a.social-ig:hover { background: #e1306c; }
.footer-socials a.social-tw:hover { background: #1da1f2; }
.footer-socials a.social-fb:hover { background: #1877f2; }

/* ── HERO BADGE PILLS ────────────────────────────────────── */
.hero-trust-pills {
  display: flex; gap: 8px; justify-content: center; flex-wrap: wrap;
  margin-top: 36px; animation: slide-up .7s var(--ease) .4s both;
}
.htp { 
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--pglow); border: 1px solid var(--border);
  border-radius: 999px; padding: 6px 14px; font-size: .76rem;
  color: var(--accent); font-weight: 600;
}
.htp i { font-size: .8rem; }

/* ── PRINT STYLES (Receipt page) ─────────────────────────── */
@media print {
  body { background: #fff !important; color: #000 !important; font-size: 12pt; }
  .navbar,.floats,.stb,.mob-bottom-nav,.ann-bar,
  .btn:not(.print-show), footer, .overlay { display: none !important; }
  .success-wrap { padding: 0; min-height: auto; }
  .success-card {
    background: #fff !important; border: 1px solid #ddd !important;
    border-radius: 4px; padding: 24px; max-width: 100%; box-shadow: none;
  }
  .rr { border-bottom: 1px solid #eee; }
  .grad-text { -webkit-text-fill-color: #000 !important; background: none !important; }
  .badge { border: 1px solid #ddd; }
  a { color: #000; text-decoration: none; }
}

/* ── PRODUCT CARD BUY BUTTON POLISH ──────────────────────── */
.pcard-btns .btn-primary {
  padding: 8px 16px;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .02em;
  box-shadow: 0 3px 10px var(--pglow);
}
.pcard-btns .btn-primary:hover {
  transform: scale(1.05);
  box-shadow: 0 5px 16px var(--pglow);
}
.pcard-btns .btn-ghost {
  padding: 8px 14px;
  font-size: .78rem;
  opacity: .8;
}
.pcard-btns .btn-ghost:hover { opacity: 1; }

/* ── CUSTOMER LIST ────────────────────────────────────────── */
.customer-rank {
  width: 22px; height: 22px; background: var(--grad); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .64rem; font-weight: 800; color: #fff;
}
