/* ============================================================
   TOKENS — single source of truth for the whole invitation.
   Layer 1 of the design system: primitives only, no components.
   ============================================================ */

:root {
  /* ---------- Color · Rosa (primary) ---------- */
  --rosa-50:  #FFF9FC;
  --rosa-100: #FFF0F6;
  --rosa-200: #FFE2EF;
  --rosa-300: #FAD9E7;
  --rosa-400: #F2C6DA;
  --rosa-500: #FFB6D3;
  --rosa-600: #F0709F;
  --rosa-700: #D94C86;
  --rosa-800: #C43B7C;
  --rosa-900: #94245C;

  /* ---------- Color · Verde (garden) ---------- */
  --verde-50:  #F4FBF3;
  --verde-100: #E9F6E7;
  --verde-200: #CFE7CE;
  --verde-300: #9FD9A4;
  --verde-400: #5D9E66;
  --verde-500: #4E8F58;
  --verde-600: #3E7C4A;
  --verde-700: #33703F;
  --verde-800: #2F6338;
  --verde-900: #245029;

  /* ---------- Color · Miel (accent) ---------- */
  --miel-100: #FFF8E6;
  --miel-200: #FFF3C4;
  --miel-300: #FFE9A8;
  --miel-400: #F7E3B8;
  --miel-500: #F5B93C;
  --miel-600: #E9A61E;
  --miel-700: #C98A12;
  --miel-800: #8A6A00;

  /* ---------- Color · Madera / papel ---------- */
  --madera-100: #FFF6E3;
  --madera-200: #F7E4C3;
  --madera-300: #E8CFA4;
  --madera-400: #D2B183;
  --madera-600: #A97F4E;
  --cuerda:     #C9A46B;
  --cuerda-osc: #9C7840;

  /* ---------- Color · Neutrals ---------- */
  --crema:   #FFF6EF;
  --crema-2: #FDF1E4;
  --papel:   #FFFDF7;
  --blanco:  #FFFFFF;
  --tinta:   #4A3A33;
  --tinta-2: #5B4A42;
  --tinta-3: #6B5A50;
  --linea:   #E7DFD2;

  /* ---------- Semantic roles ---------- */
  --fondo:            var(--crema);
  --fondo-alt:        var(--crema-2);
  --texto:            var(--tinta);
  --texto-suave:      var(--tinta-3);
  --acento:           var(--rosa-800);
  --acento-fuerte:    var(--rosa-900);
  --acento-verde:     var(--verde-800);
  --borde-rosa:       var(--rosa-300);
  --borde-verde:      var(--verde-200);
  --borde-miel:       var(--miel-400);

  /* ---------- Typography ---------- */
  --fuente-display: "Grandstander", "Trebuchet MS", cursive;
  --fuente-texto:   "Quicksand", system-ui, -apple-system, "Segoe UI", sans-serif;

  --txt-2xs: 0.625rem;  /* 10px */
  --txt-xs:  0.6875rem; /* 11px */
  --txt-sm:  0.8125rem; /* 13px */
  --txt-md:  0.875rem;  /* 14px */
  --txt-base:0.9375rem; /* 15px */
  --txt-lg:  1.0625rem; /* 17px */
  --txt-xl:  1.25rem;   /* 20px */
  --txt-2xl: 1.5rem;    /* 24px */
  --txt-3xl: 1.75rem;   /* 28px */
  --txt-4xl: 2.125rem;  /* 34px */
  --txt-5xl: 2.75rem;   /* 44px */
  --txt-7xl: 8rem;      /* 128px — el "7" */

  --track-wide:  0.14em;
  --track-wider: 0.22em;
  --track-max:   0.3em;

  /* ---------- Spacing ---------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;

  /* ---------- Radii ---------- */
  --r-sm:  10px;
  --r-md:  16px;
  --r-lg:  22px;
  --r-xl:  28px;
  --r-2xl: 34px;
  --r-full: 999px;

  /* ---------- Elevation ----------
     The signature of this invitation is the "chunky" flat offset
     shadow (sticker look) paired with a soft ambient shadow. */
  --sombra-rosa:  0 8px 0 var(--rosa-300), 0 16px 28px rgba(190, 120, 150, 0.18);
  --sombra-verde: 0 8px 0 var(--verde-100), 0 16px 28px rgba(110, 150, 115, 0.18);
  --sombra-miel:  0 8px 0 #F6EBD2, 0 16px 28px rgba(180, 150, 90, 0.18);
  --sombra-suave: 0 10px 24px rgba(150, 110, 90, 0.16);
  --sombra-alta:  0 18px 40px rgba(160, 110, 120, 0.24);
  --sombra-boton-rosa:  0 7px 0 var(--rosa-800), 0 14px 24px rgba(200, 80, 130, 0.3);
  --sombra-boton-verde: 0 7px 0 var(--verde-900), 0 14px 24px rgba(45, 90, 55, 0.28);

  /* ---------- Motion ---------- */
  --ease-suave: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-rebote: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-rapida: 160ms;
  --dur-media: 320ms;
  --dur-lenta: 620ms;

  /* ---------- Layout ---------- */
  --ancho-col: 540px;
  --ancho-col-desktop: 620px;
}