/* ============================================================
   TUP Inversión — Design tokens (DARK)
   Matched contra tengounplanpodcast.com/semanadeldinero
   Tema: fondo casi negro + acento naranja
   ============================================================ */

:root {
  /* Color — dark theme TUP */
  --c-bg:            #0a0a0a;
  --c-bg-alt:        #131313;
  --c-bg-card:       #161616;
  --c-bg-elevated:   #1c1c1c;
  --c-bg-warm:       #1a1410;   /* hero warm dark */
  --c-text:          #ffffff;
  --c-text-soft:     #c8c8c8;
  --c-text-muted:    #888888;
  --c-border:        rgba(255,255,255,0.08);
  --c-border-strong: rgba(255,255,255,0.16);
  --c-accent:        #FFA417;
  --c-accent-soft:   rgba(255,164,23,0.12);
  --c-accent-ink:    #0a0a0a;
  --c-success:       #4ade80;
  --c-danger:        #f87171;

  /* Type families */
  --ff-display: 'Oakes Grotesk', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ff-body:    'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Type scale — más contenida que antes, alineada con la web real */
  --fs-display: clamp(2rem, 2.4vw + 1rem, 3rem);
  --fs-h1:      clamp(1.85rem, 1.8vw + 1rem, 2.6rem);
  --fs-h2:      clamp(1.65rem, 1.4vw + 1rem, 2.2rem);
  --fs-h3:      clamp(1.2rem, 0.6vw + 1rem, 1.45rem);
  --fs-h4:      1.05rem;
  --fs-eyebrow: 0.78rem;
  --fs-body:    1.02rem;
  --fs-small:   0.9rem;
  --fs-micro:   0.78rem;

  /* Line heights */
  --lh-tight:   1.15;
  --lh-snug:    1.3;
  --lh-normal:  1.6;
  --lh-loose:   1.75;

  /* Weights — display más contenidos (la web real no usa 800) */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   700;     /* antes 800, era demasiado pesado */
  --fw-display: 700;

  /* Spacing scale */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.5rem;
  --sp-6:  2rem;
  --sp-7:  3rem;
  --sp-8:  4rem;
  --sp-9:  6rem;
  --sp-10: 8rem;

  /* Layout */
  --w-container: 1180px;
  --w-narrow:    760px;
  --gutter:      clamp(1.25rem, 4vw, 2.5rem);

  /* Section vertical rhythm */
  --section-py: clamp(3.5rem, 5vw, 5.5rem);

  /* Radii */
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   20px;
  --r-xl:   28px;
  --r-full: 999px;

  /* Shadows (sutiles, fondo dark) */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.45);
  --shadow-lg: 0 16px 48px rgba(0,0,0,0.6);
  --shadow-orange: 0 8px 28px rgba(255,164,23,0.25);

  /* Transitions */
  --t-fast: 150ms cubic-bezier(.2,.7,.3,1);
  --t-base: 240ms cubic-bezier(.2,.7,.3,1);
}