/* ============================================================
   SI DESIGN SYSTEM — core/base.css
   Reset universal + italic-clip fix + accessibility
   ============================================================ */

/* ===== BASE RESET ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
*, *::before, *::after { min-width: 0; }

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  max-width: 100vw;
  overflow-x: clip;
}

body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  font-feature-settings: "ss01", "cv11";
  max-width: 100vw;
  overflow-x: clip;
}

/* ===== ITALIC-CLIP FIX (universal) =====
   Italic + -webkit-background-clip:text corta o glyph.
   Esse fix é OBRIGATÓRIO em qualquer projeto que use o sistema. */
em, .scramble {
  display: inline-block !important;
  padding: 0 0.14em 0.18em 0.06em !important;
  line-height: inherit !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  overflow: visible !important;
}
h1, h2, h3, h4 {
  line-height: 1.08;
  padding-bottom: 0.08em;
  overflow: visible;
}
h1 em, h2 em, h3 em {
  padding: 0 0.14em 0.2em 0.06em !important;
}

/* ===== ACCESSIBILITY ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}