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

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: 'DM Sans', sans-serif;
  font-size: 16.8px;
  line-height: 1.6;
  transition: background 0.3s ease, color 0.3s ease;
  overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* =====================
   TRANSICIONES GLOBALES
===================== */
.sec-card,
.cat-item,
.feed-item { transition: opacity 0.2s; }

.sec-card:hover,
.cat-item:hover { opacity: 0.85; }