/* ============================================================
   BTK Design System — Spacing & Layout Tokens
   The legacy theme used a fixed space array [0,10,20,32,44,80,120].
   Containers cap at 1460px (1920px viewport minus 230px gutters).
   ============================================================ */

:root {
  /* ---- Spacing scale (legacy `space` array) ---- */
  --btk-space-0: 0px;
  --btk-space-1: 10px;
  --btk-space-2: 20px;
  --btk-space-3: 32px;
  --btk-space-4: 44px;
  --btk-space-5: 80px;
  --btk-space-6: 120px;

  /* ---- Layout ---- */
  --btk-container-max: 1460px;   /* calc(1920px - 460px) */
  --btk-container-pad: 40px;     /* desktop gutter */
  --btk-header-h: 140px;         /* tall (top of page) header */
  --btk-header-h-sticky: 80px;   /* scrolled / sticky header */

  /* ---- Breakpoints (legacy `sizes`, max-width based) ---- */
  --btk-bp-sm: 414px;    /* mini */
  --btk-bp-md: 768px;    /* phone+ */
  --btk-bp-lg: 1024px;   /* tablet+ */
  --btk-bp-xl: 1280px;   /* desktop */
  --btk-bp-2xl: 1460px;  /* giant */
}

/* Reusable container, matching the production `.container` rule */
.btk-container {
  max-width: var(--btk-container-max);
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}
@media (min-width: 414px) { .btk-container { padding: 0 20px; } }
@media (min-width: 1080px) { .btk-container { padding: 0 40px; } }
@media (min-width: 1920px) { .btk-container { padding: 0; } }