/* ============================================================
   STAAD HOME — Design tokens
   UN solo lugar para colores, tipografia fluida (clamp),
   espaciados y motion. Cambia algo aqui = cambia toda la web.
   ============================================================ */

/* ------------------------------------------------------------
   Inter, servida desde el propio sitio.
   Antes venia de fonts.googleapis.com: dos servidores mas
   —el del CSS y el de los archivos— antes de poder pintar una
   sola letra de la web. Aqui no hay ni DNS ni handshake que
   esperar; el archivo viaja con el resto del tema.
   Es UN solo archivo por alfabeto y no uno por peso: Inter es
   variable (eje de peso 100-900, comprobado en la fuente), asi
   que los tres pesos que usa el tema salen del mismo woff2.
   El de latin-ext solo se descarga si aparece una letra suya:
   el navegador mira unicode-range antes de pedir nada, y el
   espanol vive entero en el primero.
   Licencia SIL Open Font 1.1, que permite alojarla; el texto
   va al lado, en assets/fonts/Inter-LICENSE.txt.
   ------------------------------------------------------------ */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-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: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {

  /* ---------- Color (tu paleta actual) ---------- */
  --c-bg:        #F6F4F1;              /* fondo crema      */
  --c-bg-2:      #EFECE7;              /* crema +1 tono    */
  --c-ink:       #171717;             /* texto / negro    */
  /* .56 daba 4.01:1 sobre el crema: por debajo del minimo legible (4.5).
     A .68 sube a 5.91:1 y sigue leyendose suave, no negro. */
  --c-ink-soft:  rgba(23, 23, 23, .68);
  --c-white:     #FFFFFF;
  --c-line:      #CECDC3;             /* bordes/divisores */
  --c-accent:    #514841;             /* marron hover     */
  --c-taupe:     #8D8378;             /* fondo "El Universo STAAD" */
  /* El taupe de fondo sobre crema solo da 3.39:1, no vale para TEXTO.
     Esta version oscura conserva el color de marca y da 5.14:1. */
  --c-taupe-txt: #6E665D;

  /* ---------- Tipografia ----------
     Forma DJR Banner es SANS (de Adobe Fonts). Si tu kit usa otro
     nombre de familia, cambialo aqui (lo veras en tu kit de Adobe). */
  --font-title: "forma-djr-banner", "Forma DJR Banner", "Helvetica Neue", Arial, sans-serif;
  --font-body:  "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* Serif display de alto contraste (Adobe Fonts) para titulos hero + H1 */
  --font-display: "kudryashev-d-contrast", "Didot", "Bodoni MT", Georgia, "Times New Roman", serif;

  /* Textura sutil tipo microcemento para los fondos cremita */
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");

  /* Escala FLUIDA con clamp() -> responsive SIN media queries.
     clamp(minimo, preferido-segun-ancho, maximo) */
  --fs-hero:  clamp(1.80rem, 1.00rem + 3.4vw, 3.60rem);   /* portadas (mas pequeno, fluido) */
  --fs-h1:    clamp(2.10rem, 1.30rem + 3.6vw, 4.00rem);
  --fs-h2:    clamp(1.65rem, 1.10rem + 2.6vw, 2.75rem);
  --fs-h3:    clamp(1.25rem, 1.00rem + 1.2vw, 1.60rem);
  --fs-body:  clamp(0.95rem, 0.90rem + 0.25vw, 1.05rem);
  --fs-small: clamp(0.72rem, 0.68rem + 0.20vw, 0.80rem);
  --fs-micro: clamp(0.62rem, 0.60rem + 0.15vw, 0.72rem);

  /* Sistema GLOBAL de tamanos por bloque (cambia aqui = cambia toda la web) */
  --fs-section-title: clamp(1.25rem, 1.00rem + 1.2vw, 1.60rem);   /* titulos de seccion */
  --fs-section-text:  clamp(0.88rem, 0.84rem + 0.20vw, 0.98rem);  /* parrafos de seccion */

  /* Letter-spacing para el look editorial en MAYUSCULAS */
  --ls-tight:  -0.01em;
  --ls-normal:  0;
  --ls-wide:    0.14em;
  --ls-wider:   0.22em;

  /* Interlineado */
  --lh-tight:  1.05;
  --lh-snug:   1.20;
  --lh-body:   1.65;

  /* ---------- Espaciado fluido ---------- */
  --space-2xs: clamp(0.50rem, 0.45rem + 0.25vw, 0.75rem);
  --space-xs:  clamp(0.75rem, 0.65rem + 0.50vw, 1.15rem);
  --space-sm:  clamp(1.00rem, 0.85rem + 0.75vw, 1.60rem);
  --space-md:  clamp(1.60rem, 1.30rem + 1.50vw, 2.75rem);
  --space-lg:  clamp(2.50rem, 2.00rem + 2.50vw, 4.50rem);
  --space-xl:  clamp(4.00rem, 3.00rem + 5.00vw, 8.00rem);
  --space-2xl: clamp(6.00rem, 4.50rem + 7.00vw, 12.0rem);

  /* ---------- Layout ---------- */
  --container:      min(92vw, 1320px);   /* contenido legible   */
  --container-wide: min(96vw, 1760px);   /* secciones anchas    */
  --gutter: clamp(1rem, 0.6rem + 2vw, 2.5rem);

  /* ---------- Motion ---------- */
  /* Easings por contexto (la clave del "feel") */
  --ease:          cubic-bezier(.77, 0, .175, 1);  /* simetrico: grandes movimientos */
  --ease-out:      cubic-bezier(.16, 1, .3, 1);    /* entradas/hovers: arranca rapido, asienta suave */
  --ease-out-soft: cubic-bezier(.33, 1, .68, 1);   /* version mas gentil */
  --ease-spring:   cubic-bezier(.34, 1.28, .64, 1);/* leve rebote: drawer / press */

  /* Duraciones por contexto */
  --dur-fast: .18s;   /* hovers, foco, micro-feedback */
  --dur:      .45s;   /* medio: paneles, header, toggles */
  --dur-slow: .8s;    /* entradas grandes: reveals, drawer */

  /* ---------- Otros ---------- */
  --radius:    0px;                      /* tu marca = esquinas rectas */
  /* Alto de la BARRA en si (logo + menu) */
  --bar-h:    clamp(74px, 8.2vw, 126px);
  --bar-h-sm: clamp(62px, 5.6vw, 88px);   /* barra compacta al hacer scroll */
  /* Franja de aviso, encima de la barra (0px si algun dia se retira) */
  --aviso-h:  clamp(28px, 2.4vw, 34px);
  /* Alto TOTAL de la cabecera fija = franja + barra. Todo el sitio calcula
     su respiro superior a partir de estas dos, asi que al anadir la franja
     el contenido se aparta solo, sin tocar una regla mas. */
  --header-h:    calc(var(--bar-h) + var(--aviso-h));
  --header-h-sm: calc(var(--bar-h-sm) + var(--aviso-h));
  --lux-pad-x:   clamp(22px, 3vw, 40px);  /* padding lateral: header + panel del menu */
}