/* ============================================================
   IBeta Market — Design Tokens (Nexora system)
   Locked from /design/IBeta_Market — FINAL.html
   v2.0 — Major SALL · LeaderNet Services
   ============================================================ */

:root {
  /* === CORE PALETTE === */
  --ib-ink:        #0A1628;
  --ib-sub:        #5B6B85;
  --ib-mute:       #8A97AA;
  --ib-line:       #E1E8F2;
  --ib-soft:       #F5F7FF;
  --ib-white:      #FFFFFF;
  --ib-black:      #0A1628;

  /* === BRAND === */
  --ib-primary:    #1855CC;
  --ib-primary-dk: #0F3A99;
  --ib-primary-lt: #EEF3FF;
  --ib-accent:     #F05A00;
  --ib-accent-lt:  #FFF0E8;
  --ib-pink:       #EC4899;

  /* === STATUS === */
  --ib-danger:     #EF4444;
  --ib-success:    #10B981;
  --ib-warning:    #F59E0B;

  /* === BADGES === */
  --ib-bd-best-bg:  #FFE9C2;  --ib-bd-best-fg:  #92400E;
  --ib-bd-new-bg:   #D1FADF;  --ib-bd-new-fg:   #065F46;
  --ib-bd-sale-bg:  #FFE0E0;  --ib-bd-sale-fg:  #B91C1C;
  --ib-bd-top-bg:   #DBE5FF;  --ib-bd-top-fg:   #1E40AF;
  --ib-bd-hot-bg:   #FFD7E0;  --ib-bd-hot-fg:   #BE185D;
  --ib-bd-excl-bg:  #FEE4B0;  --ib-bd-excl-fg:  #92400E;
  --ib-bd-lim-bg:   #FFD7D7;  --ib-bd-lim-fg:   #B91C1C;
  --ib-bd-feat-bg:  #E6E2FF;  --ib-bd-feat-fg:  #4338CA;

  /* === TYPOGRAPHY === */
  --ib-font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ib-fs-h1: 2.5rem;       /* 40px */
  --ib-fs-h2: 1.75rem;      /* 28px */
  --ib-fs-h3: 1.25rem;      /* 20px */
  --ib-fs-body: 0.9375rem;  /* 15px */
  --ib-fs-small: 0.8125rem; /* 13px */
  --ib-fs-xs: 0.75rem;      /* 12px */

  /* === SPACING === */
  --ib-sp-1: 4px;
  --ib-sp-2: 8px;
  --ib-sp-3: 12px;
  --ib-sp-4: 16px;
  --ib-sp-5: 20px;
  --ib-sp-6: 24px;
  --ib-sp-8: 32px;
  --ib-sp-10: 40px;
  --ib-sp-12: 48px;

  /* === RADII === */
  --ib-r-sm: 4px;
  --ib-r-md: 6px;
  --ib-r-lg: 8px;
  --ib-r-xl: 12px;
  --ib-r-pill: 9999px;

  /* === SHADOWS === */
  --ib-shadow-sm: 0 1px 4px rgba(10,22,40,0.06);
  --ib-shadow-md: 0 2px 8px rgba(10,22,40,0.08);
  --ib-shadow-lg: 0 8px 24px rgba(10,22,40,0.10);
  --ib-shadow-card: 0 2px 6px rgba(10,22,40,0.05);

  /* === LAYOUT === */
  --ib-container: 1440px;
  --ib-rail: 260px;
  --ib-header-h: 134px;     /* row1 + row2 */
  --ib-header-h-tab: 96px;
  --ib-header-h-mob: 64px;
  --ib-bottomnav-h: 64px;

  /* === TRANSITIONS === */
  --ib-tr-fast: 0.15s ease;
  --ib-tr-base: 0.2s ease;
  --ib-tr-slow: 0.3s ease;
}

/* ============================================================
   BASE RESET
   ============================================================ */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--ib-font);
  font-size: var(--ib-fs-body);
  line-height: 1.5;
  color: var(--ib-ink);
  background: var(--ib-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: var(--ib-primary);
  text-decoration: none;
  transition: color var(--ib-tr-fast);
}
a:hover { color: var(--ib-primary-dk); }

button {
  font-family: inherit;
  cursor: pointer;
}

img, svg, video {
  max-width: 100%;
  height: auto;
  display: block;
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ib-ink);
  line-height: 1.15;
}

p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

/* ============================================================
   UTILITIES
   ============================================================ */
.ib-container { max-width: var(--ib-container); margin: 0 auto; padding: 0 var(--ib-sp-8); }
.ib-flex { display: flex; }
.ib-grid { display: grid; }
.ib-flex-center { display: flex; align-items: center; justify-content: center; }
.ib-flex-between { display: flex; align-items: center; justify-content: space-between; }
.ib-gap-1 { gap: 4px; } .ib-gap-2 { gap: 8px; } .ib-gap-3 { gap: 12px; }
.ib-gap-4 { gap: 16px; } .ib-gap-6 { gap: 24px; }

.ib-sr-only {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0,0,0,0) !important;
  white-space: nowrap !important; border: 0 !important;
}

/* Visibility helpers */
.ib-d-none { display: none !important; }
.ib-d-mobile-only,
.ib-d-tablet-only { display: none; }

@media (max-width: 1024px) {
  .ib-d-desktop-only { display: none !important; }
  .ib-d-tablet-only { display: block; }
}
@media (max-width: 640px) {
  .ib-d-tablet-only { display: none; }
  .ib-d-mobile-only { display: block; }
}