/* ==========================================================================
   Ophelia — tokens de marca
   Única fuente de verdad para colores, tipografía, espaciado y movimiento.
   Cambia un valor aquí y se actualiza en todo el sitio.

   Copia exacta de ophelia-tienda/assets/css/tokens.css, el prototipo donde se
   afina el diseño. Si cambias un valor, cámbialo en los dos.
   ========================================================================== */

:root {
  /* Color */
  --marfil: #F7F4EF;          /* fondo principal */
  --lino: #ECE5DB;            /* secciones y bloques */
  --arena: #E3DBCF;           /* líneas divisorias, newsletter */
  --piedra: #CFC3B3;          /* bordes de campos, fotos de relleno */
  --taupe: #8E7D6A;           /* color del logo: líneas y detalles (no texto pequeño) */
  --taupe-profundo: #6B5A48;  /* textos de apoyo, etiquetas */
  --texto-suave: #3D342C;     /* párrafos */
  --tinta: #1A1714;           /* títulos, botones, pie de página */
  --marfil-claro: #EFE9E0;    /* texto sobre tinta */
  --gris-pie: #B8AA98;        /* texto secundario en el pie */
  --linea-pie: #3A332D;       /* divisoria sobre el aviso legal, en el pie */

  /* Tipografía */
  --fuente-titulos: 'Cormorant Garamond', 'Times New Roman', serif;
  --fuente-texto: 'Jost', 'Helvetica Neue', sans-serif;

  --t-hero: clamp(2.9rem, 5.2vw, 4.75rem);
  --t-h2: clamp(2.1rem, 3.6vw, 3.5rem);
  --t-h3: clamp(1.4rem, 1.8vw, 1.9rem);
  --t-cita: clamp(1.75rem, 3vw, 2.75rem);
  --t-cuerpo: 1rem;
  --t-chico: 0.875rem;
  --t-etiqueta: 0.75rem;

  --espaciado-etiqueta: 0.28em; /* mayúsculas espaciadas en menús y botones */

  /* Espaciado y medidas */
  --margen: clamp(1.5rem, 4.5vw, 4rem);
  --seccion: clamp(4rem, 9vw, 8rem);
  --ancho-max: 1440px;
  --alto-header: 104px;

  /* Movimiento */
  --curva: cubic-bezier(.2, .7, .2, 1);
  --lento: 1.2s;
  --medio: .6s;
  --rapido: .35s;
}

@media (max-width: 900px) {
  :root { --alto-header: 64px; }
}
