/* ═══════════════════════════════════════════
   SANARE CAPILAR — Design Tokens
   ═══════════════════════════════════════════ */
:root {
  /* Brand Colors */
  --green:       #4A7C59;
  --green-dark:  #3a6647;
  --green2:      #6B8F71;
  --green3:      #A3B18A;
  --beige:       #DAD7CD;
  --bg:          #F8F9F6;
  --text:        #1B1B1B;
  --white:       #ffffff;
  --wa:          #25D366;
  --wa-dark:     #1ebe5a;

  /* Radii */
  --r-sm:   12px;
  --r-md:   20px;
  --r-lg:   24px;
  --r-xl:   32px;
  --r-pill: 50px;

  /* Shadows */
  --shadow-sm: 0 4px 16px rgba(74,124,89,0.08);
  --shadow:    0 8px 32px rgba(74,124,89,0.10);
  --shadow-lg: 0 16px 48px rgba(74,124,89,0.15);

  /* Transitions */
  --ease: cubic-bezier(0.32, 0.72, 0, 1);

  /* Typography */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* Layout */
  --max-w:    1280px;
  --gutter:   60px;
}

@media (max-width: 768px) {
  :root { --gutter: 20px; }
}

/* Banda tablet intermedia (P0-1): respiración ajustada sin romper el layout desktop */
@media (min-width: 769px) and (max-width: 1080px) {
  :root { --gutter: 32px; }
}