/* ========================================
   VARIÁVEIS CSS GLOBAIS - DEVITO ALIMENTOS
   ======================================== */

:root {
  /* Cores Principais */
  --red: #00bccf;
  --primary: #00bccf;
  --primary-600: #00a8ba;
  --primary-hover: #008a9a;
  --accent: #c81a1a;
  --secondary: #142d6c;
  
  /* Cores de Texto */
  --text: #3b3b3b;
  --text-light: #666;
  --text-muted: #888;
  --muted: #bdbdbd;
  
  /* Cores de Fundo */
  --bg: #ffffff;
  --bg-light: #fff;
  --panel: #13141a;
  --card: #fafafa;
  
  /* Sombras */
  --shadow: 0 12px 36px rgba(0, 0, 0, 0.18);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 10px 25px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 20px 40px rgba(0, 188, 207, 0.25);
  --ring: #ffffff18;
  
  /* Hero */
  --hero-h: 500px;
  --hero-overlay-h: 112px;
  --hero-badge-w: 120px;
  --hero-badge-h: 48px;
  
  /* Thumbnail Card */
  --thumb-card-w: 96px;
  --thumb-card-padding: 8px;
  --thumb-card-border: 6px;
}

/* Reset Global */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
  background: transparent;
}

body {
  font-family: 'Nunito Sans', 'Museo Sans', sans-serif;
  font-weight: 700;
  color: var(--text);
  background: transparent;
  -webkit-font-smoothing: antialiased;
}

/* Imagens Responsivas */
img, picture, video {
  max-width: 100%;
  height: auto;
  display: block;
}