/* ==========================================================================
   PAULA VELASCO — DESIGN TOKENS
   Fuente: sistema de diseño del handoff (hifi, valores finales).
   No modificar sin revisar con Paula — estos valores son la marca.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  /* --- Paleta base ------------------------------------------------------ */
  --color-black-deep: #0A0A0A;
  --color-smoke-warm: #1A1814;
  --color-tobacco: #5A4A36;
  --color-gold-earth: #B8936A;
  --color-gold-light: #D4AA88;
  --color-cream-gold: #F0E4D4;
  --color-cream-base: #F5F2ED;
  --color-warm-gray: #7A7268;
  --color-white: #FFFFFF;

  /* --- Superficies -------------------------------------------------------- */
  --surface-hub: var(--color-cream-base);
  --surface-b2c: var(--color-cream-base);
  --surface-b2c-alt: var(--color-cream-gold);
  --surface-b2b: var(--color-smoke-warm);
  --surface-authority: var(--color-smoke-warm);
  --surface-footer: var(--color-smoke-warm);

  /* --- Texto --------------------------------------------------------------- */
  --text-on-light: var(--color-black-deep);
  --text-on-light-muted: var(--color-warm-gray);
  --text-on-dark: var(--color-cream-base);
  --text-on-dark-muted: #C9C0B3;
  --text-accent: var(--color-gold-earth);

  /* --- Bordes -------------------------------------------------------------- */
  --border-hairline: rgba(184, 147, 106, 0.15);
  --border-hairline-strong: rgba(184, 147, 106, 0.35);
  --border-on-dark: rgba(240, 228, 212, 0.15);

  /* --- Botones ------------------------------------------------------------- */
  --btn-b2b-primary-bg: var(--color-gold-earth);
  --btn-b2b-primary-bg-hover: var(--color-gold-light);
  --btn-b2b-primary-text: var(--color-black-deep);

  --btn-b2c-primary-bg: var(--color-tobacco);
  --btn-b2c-primary-bg-hover: var(--color-gold-earth);
  --btn-b2c-primary-text: var(--color-cream-base);

  --btn-ghost-border: rgba(90, 74, 54, 0.3);
  --btn-ghost-border-hover: var(--color-gold-earth);
  --btn-ghost-border-on-dark: rgba(240, 228, 212, 0.3);
  --btn-ghost-border-on-dark-hover: var(--color-gold-earth);

  --icon-color: var(--color-gold-earth);

  /* --- Tipografía ------------------------------------------------------------ */
  --font-serif-display: 'Cormorant Garamond', 'Georgia', serif;
  --font-sans-body: 'DM Sans', -apple-system, 'Helvetica Neue', sans-serif;

  --weight-serif-light: 300;
  --weight-serif-regular: 400;
  --weight-serif-semibold: 600;
  --weight-sans-light: 300;
  --weight-sans-regular: 400;
  --weight-sans-medium: 500;

  --text-h1-mobile: 2.75rem;
  --text-h1: clamp(2.75rem, 2.1rem + 3.2vw, 6rem);
  --text-h2-mobile: 2.25rem;
  --text-h2: clamp(2.25rem, 1.9rem + 1.8vw, 3.875rem);
  --text-h3-mobile: 1.5rem;
  --text-h3: clamp(1.5rem, 1.3rem + 1vw, 2.125rem);
  --text-quote-mobile: 1.75rem;
  --text-quote: clamp(1.75rem, 1.4rem + 1.8vw, 2.875rem);

  --leading-display: 1.15;
  --leading-display-tight: 1.1;

  --text-body: 1rem;
  --text-body-sm: 0.9375rem;
  --text-body-lg: 1.0625rem;
  --text-eyebrow: 0.6875rem;
  --text-cta: 0.8125rem;
  --text-nav: 0.9375rem;

  --leading-body: 1.7;

  --tracking-eyebrow: 0.25em;
  --tracking-cta: 0.12em;
  --tracking-normal: 0;

  /* --- Espaciado ------------------------------------------------------------- */
  --container-max: 1100px;
  --container-pad-desktop: 40px;
  --container-pad-mobile: 24px;

  --section-pad-y-desktop: 100px;
  --section-pad-y-mobile: 72px;
  --section-pad-y: clamp(var(--section-pad-y-mobile), 6vw + 20px, var(--section-pad-y-desktop));

  --gap-block: 70px;
  --gap-block-min: 60px;
  --gap-block-max: 80px;

  --card-pad-desktop: 38px;
  --card-pad-mobile: 24px;
  --card-pad: clamp(var(--card-pad-mobile), 3vw, var(--card-pad-desktop));

  --radius-none: 0px;
  --radius-sm: 2px;
  --radius-max: 4px;

  --border-width-hairline: 1px;

  --bp-mobile: 720px;
}
