/* ============================================================
 * Gold Apple Studio — design tokens
 * Извлечено живым CSS-инспектом goldapple.ru/customer/account
 * и seller.goldapple.ru. Источник правды для всего UI.
 * ============================================================ */

:root {
  /* ---------- COLOR ---------- */
  /* Brand */
  --ga-lime:          #DEFE00;     /* фирменный электрик-лайм */
  --ga-lime-soft:     #E8FE40;     /* hover/glow */
  --ga-lime-dark:     #B5D200;     /* active/pressed */

  /* Neutrals */
  --ga-black:         #000000;
  --ga-ink:           #0F0F0F;     /* почти-чёрный для длинного текста */
  --ga-graphite:      #2A2A2A;     /* secondary text */
  --ga-mute:          #6B6B6B;     /* placeholder */
  --ga-line:          #E5E3DD;     /* hairline borders */

  /* Surfaces */
  --ga-white:         #FFFFFF;
  --ga-cream:         #F5F3EE;     /* warm page background */
  --ga-card:          #FAF8F2;     /* surface cards */
  --ga-card-hover:    #F2EFE7;

  /* Accents */
  --ga-pink-soft:     #FFD8E5;     /* подарочные карты */
  --ga-pink:          #FF6FB1;
  --ga-sale:          #FF1F4F;     /* sale-magenta badge */
  --ga-sale-yellow:   #FFD200;     /* HIT badge */

  /* Functional */
  --ga-success:       #00C271;
  --ga-warning:       #FFB000;
  --ga-error:         #E11D2C;
  --ga-focus-ring:    color-mix(in oklch, var(--ga-lime) 70%, transparent);

  /* ---------- TYPOGRAPHY ---------- */
  --ga-body-font:     'Onest', 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  /* Display = Onest @ 900 (полная Cyrillic-поддержка vs Anton, который её нет) */
  --ga-display-font:  'Onest', 'Inter', 'Helvetica Neue', sans-serif;
  --ga-mono-font:     'JetBrains Mono', ui-monospace, SFMono-Regular, Consolas, monospace;

  /* Modular type scale (mobile-first; desktop scales up via clamp) */
  --text-3xs:         11px;
  --text-2xs:         12px;
  --text-xs:          13px;
  --text-sm:          14px;
  --text-base:        16px;
  --text-lg:          clamp(17px, 1.6vw, 18px);
  --text-xl:          clamp(20px, 2vw, 22px);
  --text-2xl:         clamp(24px, 2.6vw, 28px);
  --text-3xl:         clamp(30px, 3.4vw, 36px);
  --text-4xl:         clamp(38px, 4.6vw, 48px);

  /* Display sizes — для condensed-хедлайнов как на seller.goldapple.ru */
  --text-h1:          clamp(40px, 6vw, 56px);              /* ЛК-стиль h1 */
  --text-display-sm:  clamp(40px, 5.5vw, 64px);
  --text-display-md:  clamp(48px, 7vw, 88px);
  --text-display-lg:  clamp(56px, 9vw, 112px);            /* hero на seller */
  --text-display-xl:  clamp(72px, 11vw, 160px);            /* scroll-eaters */

  /* Weights */
  --weight-regular:   400;
  --weight-medium:    500;       /* стандартный h1 у ЗЯ */
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-black:     900;

  /* Line heights */
  --leading-tight:    1.05;      /* для display */
  --leading-snug:     1.18;      /* для h1-h2 */
  --leading-normal:   1.45;      /* body */
  --leading-relaxed:  1.6;       /* long copy */

  /* Letter spacing */
  --track-tight:      -0.04em;   /* для display */
  --track-snug:       -0.02em;
  --track-normal:     0;
  --track-wide:       0.04em;
  --track-caps:       0.08em;    /* для UPPERCASE CTA */

  /* ---------- SPACING ---------- */
  --space-px:         1px;
  --space-1:          4px;
  --space-2:          8px;
  --space-3:          12px;
  --space-4:          16px;
  --space-5:          20px;
  --space-6:          24px;
  --space-8:          32px;
  --space-10:         40px;
  --space-12:         48px;
  --space-16:         64px;
  --space-20:         80px;
  --space-24:         96px;
  --space-32:         128px;
  --space-section:    clamp(64px, 9vw, 160px);

  /* Container widths */
  --content-narrow:   720px;
  --content-default:  1080px;
  --content-wide:     1440px;
  --content-bleed:    100%;
  --gutter:           clamp(16px, 4vw, 48px);

  /* ---------- RADII ---------- */
  --radius-none:      0px;
  --radius-xs:        4px;
  --radius-sm:        8px;
  --radius-md:        12px;
  --radius-lg:        16px;
  --radius-xl:        24px;       /* основной ЗЯ-карточный radius */
  --radius-2xl:       32px;
  --radius-pill:      999px;
  --radius-full:      9999px;

  /* ---------- SHADOWS ---------- */
  --shadow-card:      0 1px 2px rgba(0, 0, 0, 0.04),
                      0 8px 24px rgba(0, 0, 0, 0.06);
  --shadow-elevated:  0 4px 8px rgba(0, 0, 0, 0.06),
                      0 24px 48px rgba(0, 0, 0, 0.10);
  --shadow-pressed:   0 0 0 1px rgba(0, 0, 0, 0.08) inset;
  --shadow-focus:     0 0 0 3px var(--ga-focus-ring);

  /* ---------- MOTION ---------- */
  --duration-fast:    120ms;
  --duration-snap:    180ms;
  --duration-normal:  280ms;
  --duration-slow:    480ms;
  --duration-cinematic: 800ms;

  --ease-out-expo:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart:   cubic-bezier(0.25, 1, 0.5, 1);
  --ease-spring:      cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out:      cubic-bezier(0.65, 0, 0.35, 1);

  /* ---------- LAYOUT ---------- */
  --header-height:    72px;
  --header-height-sm: 60px;
  --z-base:           1;
  --z-sticky:         50;
  --z-overlay:        100;
  --z-modal:          200;
  --z-toast:          300;

  /* ---------- COMPONENT TOKENS ---------- */
  --button-height-sm: 40px;
  --button-height-md: 48px;
  --button-height-lg: 56px;

  --input-height:     48px;

  --card-pad:         clamp(20px, 3vw, 32px);
  --card-pad-lg:      clamp(28px, 4vw, 48px);
}

/* ============================================================
 * Reduced motion
 * ============================================================ */
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast:      0ms;
    --duration-snap:      0ms;
    --duration-normal:    0ms;
    --duration-slow:      0ms;
    --duration-cinematic: 0ms;
  }
}