/* MAGMA — fluid layout, type scale and vertical rhythm.
   The Figma file is a single 1440 frame with no breakpoints; this file turns its
   fixed measures into a system that holds from 375 to 1920.
   Note: --step-* are FONT SIZES, tagged spacing only so the token parser reads
   their clamp() values as lengths rather than font families. */
:root{
  /* Type scale — 7 steps on a 1.333 modulus, fluid between 375 and 1440 */
  --step--1:clamp(12px,0.7rem + 0.16vw,14px); /* @kind spacing */
  --step-0:clamp(15px,0.86rem + 0.26vw,18px); /* @kind spacing */
  --step-1:clamp(18px,0.96rem + 0.63vw,24px); /* @kind spacing */
  --step-2:clamp(22px,1.1rem + 1.1vw,30px); /* @kind spacing */
  --step-3:clamp(28px,0.9rem + 3.4vw,48px); /* @kind spacing */
  --step-4:clamp(34px,0.6rem + 6.6vw,72px); /* @kind spacing */
  --step-5:clamp(42px,-0.4rem + 12.1vw,122px); /* @kind spacing */
  --step-script:clamp(32px,0.2rem + 7.6vw,80px); /* @kind spacing */

  /* The "Collection" kit's own three-step scale (ui_kits/website-v2). Namespaced:
     the system's four rhythm steps live in tokens/spacing.css and must stay the
     single meaning of --rhythm-*.
     room = between sections · block = inside a section · line = between siblings */
  --v2-room:clamp(72px,9.2vw,144px); /* @kind spacing */
  --v2-block:clamp(32px,4.2vw,64px); /* @kind spacing */
  --v2-line:clamp(14px,1.6vw,22px); /* @kind spacing */

  /* Fluid gutters and grid */
  --gutter:clamp(16px,2.1vw,28px); /* @kind spacing */
  --col-gap:clamp(10px,1vw,14px); /* @kind spacing */
}

/* Containers */
.mg-band{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter);box-sizing:border-box}
.mg-room{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter);box-sizing:border-box}
.mg-bleed{width:100%}

/* 12 → 6 → 2 column grid */
.mg-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--col-gap)}
@media(max-width:1024px){.mg-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:640px){.mg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}