/* Escala base 8px */
:root{
  --space-1:8px;
  --space-2:16px;
  --space-3:24px;
  --space-4:32px;
  --space-6:48px;
  --space-8:64px;
  --space-12:96px;

  --section-y:var(--space-8);        /* celular */
  --section-y-desktop:var(--space-12);
  --gutter:20px;                      /* margem lateral no celular */
  --gutter-desktop:32px;

  --card-padding:28px;
  --button-padding:18px 32px;
  --button-min-height:54px;

  --radius-card:12px;
  --radius-button:8px;
  --radius-pill:999px;
  --radius-fab:50%;
}

@media (min-width:768px){
  :root{ --section-y:var(--section-y-desktop); --gutter:var(--gutter-desktop); }
}