/* PROFEC — Bordes, radios, sombras y motivo 24°
   "Esquinas de radio controlado, no muy redondeadas."
   El ángulo de 24° es el gesto propietario del logo: se extiende a cortes
   de esquina (clip-path) y al gradiente brasa→ámbar. Sobriedad: poco
   gradiente, poco glow — el peso lo cargan carbón, navy y hueso. */

:root {
  /* Radios — controlados, nunca píldora salvo Tag/Badge pequeños */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;

  /* Motivo 24°: corte de esquina. tan(24°) ≈ 0.445 → un corte de 18px de
     ancho baja 8px. Úsese en UNA esquina (superior derecha) de botones
     primarios, tarjetas destacadas y sellos. */
  --cut-corner-sm: polygon(0 0, calc(100% - 14px) 0, 100% 6.2px, 100% 100%, 0 100%);
  --cut-corner-md: polygon(0 0, calc(100% - 22px) 0, 100% 9.8px, 100% 100%, 0 100%);
  --cut-corner-lg: polygon(0 0, calc(100% - 36px) 0, 100% 16px, 100% 100%, 0 100%);

  /* Sombras — frías y discretas, nunca glow de color */
  --shadow-sm: 0 1px 2px rgba(26, 26, 29, 0.10);
  --shadow-md: 0 4px 12px rgba(26, 26, 29, 0.12);
  --shadow-lg: 0 12px 32px rgba(4, 30, 55, 0.22);

  /* Bordes */
  --border-width: 1px;
  --border-width-strong: 2px;

  /* Animación — seria y contenida: fades y desplazamientos cortos */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
}