/* ─────────────────────────────────────────────
   AFFILIATE TEMPLATE — GLOBAL CSS
   Shared tokens, resets, utilities
───────────────────────────────────────────── */

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
img { max-width: 100%; display: block; }
ul { list-style: none; }
a { text-decoration: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* ── SHARED LAYOUT TOKENS ── */
:root {
  --container-max: 860px;
  --container-pad: 24px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --transition: 0.2s ease;
}

/* ── LAYOUT HELPERS ── */
.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-pad);
}

/* ── SCROLL REVEAL ── */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── STAR RATING HELPER ── */
.stars { letter-spacing: 1px; }

/* ── RESPONSIVE ── */
@media (max-width: 640px) {
  :root { --container-pad: 16px; }
}