/* Layout, radii and motion. Page geometry is the Brand Book's 1920x1080 frame. */
:root {
  --mm-page-w: 1920px;
  --mm-page-h: 1080px;
  --mm-page-margin: 60px;        /* title block inset, left and top */
  --mm-panel-x: 493px;           /* spec panel left edge */
  --mm-panel-y: 62px;
  --mm-panel-w: 1370px;
  --mm-panel-h: 900px;
  --mm-footer-y: 983px;
  --mm-footer-h: 97px;
  --mm-footer-text-x: 213px;     /* footer label, clear of the 22px logo */

  /* Vertical rhythm inside a text block */
  --mm-gap-xs: 8px;
  --mm-gap-sm: 14px;
  --mm-gap-md: 40px;
  --mm-gap-lg: 53px;
  --mm-gap-xl: 76px;

  /* Radii — the book uses square corners for full-bleed colour and 20px for panels. */
  --mm-radius-none: 0px;
  --mm-radius-panel: 20px;
  --mm-radius-chip: 12px;
  --mm-radius-pill: 999px;

  /* Clear space around the logo is measured in M-heights (frame65). */
  --mm-logo-clearspace: 1em;

  /* Motion. The book is a print artefact; motion is inherited from the product UI:
     short, no bounce, no overshoot. */
  --mm-ease: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --mm-duration-fast: 120ms; /* @kind other */
  --mm-duration: 200ms; /* @kind other */

  /* Elevation. The brand uses flat colour; shadow appears only in product chrome. */
  --mm-shadow-none: none;
  --mm-shadow-chrome: 0 1px 2px rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.08);
}
