/* Hostalin · Brand Tokens · Tailwind v4
 * Bloque @theme listo para pegar en app.css.
 * Curado vs designlang raw: ver brandbook §07 y design-tokens.json.
 */

@import "tailwindcss";

@theme {
  /* COLORES — primarios */
  --color-primary:        #5A9A9D;
  --color-primary-anchor: #9AB6BA;
  --color-primary-dark:   #16494C;

  /* COLORES — neutros */
  --color-tint:      #ACCBBC;
  --color-cream:     #F4F2EC;
  --color-paper:     #FBFAF6;
  --color-text:      #1A1A1A;
  --color-text-soft: #6B6B66;
  --color-rule:      #DDD8CE;

  /* COLORES — semánticos (solo validación) */
  --color-danger: #A14545;
  --color-good:   #1B6E4F;

  /* TIPOGRAFÍA */
  --font-display: "Playfair Display", "EB Garamond", Georgia, serif;
  --font-body:    "Inter", "Open Sans", -apple-system, system-ui, sans-serif;

  /* TYPE SCALE */
  --text-xs:   0.78rem;
  --text-sm:   0.88rem;
  --text-base: 1.02rem;
  --text-lg:   1.15rem;
  --text-xl:   1.45rem;
  --text-2xl:  1.85rem;
  --text-3xl:  2.4rem;
  --text-4xl:  3.2rem;
  --text-5xl:  4.6rem;

  /* SPACING (sobre base 4px) */
  --spacing: 0.25rem;

  /* RADIUS */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   14px;
  --radius-full: 999px;

  /* SHADOWS */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.10);
  --shadow-lg: 0 12px 28px rgba(0,0,0,0.12);
}

/* Defaults globales sugeridos */
body {
  background: var(--color-cream);
  color: var(--color-text);
  font-family: var(--font-body);
  line-height: 1.55;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--color-primary-dark);
  letter-spacing: -0.015em;
}