/* El estilo de Serendipia (T003), sacado de la web de WordPress (Referencia/Web woordpres/): los colores del logo,
   la letra Outfit y las formas suaves. Todos los colores se escriben solo aquí; el resto de hojas usa estas variables. */

/* La letra, servida desde nuestro hosting (D007: ninguna visita pasa por Google). Outfit es de licencia libre (SIL OFL)
   y variable: un solo archivo lleva todos los gruesos del 100 al 900. */
@font-face {
  font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/assets/fuentes/outfit-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/assets/fuentes/outfit-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Colores de la escuela */
  --naranja: #FFC576;          /* el del logo: botones principales, acentos, palabras destacadas de los títulos */
  --naranja-vivo: #FFB54D;     /* degradados y formas de fondo */
  --naranja-oscuro: #9E6208;   /* texto naranja que tiene que leerse (etiquetas, enlaces). Era #D68F20 (2,6:1); este
                                  da 4,8:1 sobre crema, lo que pide WCAG para leer bien (P002, aprobado por Joel) */
  --melocoton: #FFE8C8;        /* botones suaves */
  --naranja-suave: rgba(255, 197, 118, 0.15); /* fondos de etiquetas y anillo del foco */
  --naranja-borde: rgba(255, 197, 118, 0.4);
  --crema: #FFF9EF;            /* fondos de sección */
  --gris: #54595F;             /* texto y títulos */
  --gris-boton: #5F6373;       /* texto de los botones suaves */
  --texto-suave: #666666;
  --texto-tenue: #707070;      /* era #888888: no llegaba al contraste mínimo para leer (4,5:1); este da 4,7 sobre crema (T018) */
  --blanco: #FFFFFF;
  --superficie-2: #FCFCFC;
  --linea: #EEEEEE;
  --linea-campo: #EAEAEA;
  --linea-tarjeta: #F4F4F4;
  --gris-suave: #777777;        /* resúmenes de las tarjetas */
  --gris-icono: #CBD5E1;        /* separador discontinuo del contacto */
  --ok: #2E9E6B;
  /* Las salas en el horario (los colores de la web de Joel) */
  --sala-1: #FDE047;
  --sala-1-fondo: #FFFCF2;
  --sala-2: #FDBA74;
  --sala-2-fondo: #FFF8F0;
  --sala-3: #9CA3AF;
  --sala-3-fondo: #F8FAFC;
  --sala-4: #C084FC;
  --sala-4-fondo: #FAF5FF;
  /* Los «trajes» de los casales (T015): un color de acento por temporada, sobre el naranja de siempre */
  --navidad: #6E8B5B;           /* el verde de los abetos de su foto */
  --navidad-suave: #EEF3E8;
  --navidad-2: #B5523B;         /* el rojo de las bolas */
  --verano: #1FA9B8;            /* el agua de la piscina de su foto */
  --verano-suave: #E3F6F8;
  --verano-2: #FFB54D;
  --primavera: #6FAE8C;         /* Semana Santa: verde tierno */
  --primavera-suave: #E9F5EE;
  --primavera-2: #B79AE0;       /* y lila */
  --error: #C8483B;
  --error-suave: rgba(200, 72, 59, 0.08);

  /* Letra */
  --fuente: 'Outfit', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --t-xs: 11px;
  --t-s: 13px;
  --t-m: 15px;
  --t-l: 17px;
  --t-intro: clamp(17px, 1.5vw, 19px);
  --t-h3: 20px;
  --t-h2: clamp(28px, 3.2vw, 38px);
  --t-titulo: clamp(34px, 4vw, 48px);

  /* Formas */
  --radio-s: 8px;
  --radio: 12px;
  --radio-l: 16px;
  --radio-xl: 24px;
  --pildora: 50px;
  --sombra-s: 0 4px 15px rgba(84, 89, 95, 0.05);
  --sombra: 0 10px 30px rgba(84, 89, 95, 0.05);
  --sombra-l: 0 15px 40px rgba(84, 89, 95, 0.08);
  --sombra-naranja: 0 8px 20px rgba(255, 197, 118, 0.3);
  --foco: 0 0 0 4px rgba(255, 197, 118, 0.25);

  /* Espacios */
  --esp-1: 4px;
  --esp-2: 8px;
  --esp-3: 12px;
  --esp-4: 16px;
  --esp-5: 24px;
  --esp-6: 32px;
  --esp-7: 48px;
  --esp-8: 64px;
  --ancho: 1200px;
  --ancho-texto: 720px;
  --curva: cubic-bezier(0.2, 0.8, 0.2, 1);
}