/* ==========================================================================
   VARIABLES — fuente de verdad de tipografía, colores y medidas.
   Medidas tomadas del tema de irri-avance.com.ar (Impreza); colores y
   tipografía según el Manual de marca Global Drip.
   ========================================================================== */

/* --- Tipografía: Proxima Nova (Manual de marca) ---------------------------
   Proxima Nova es una fuente comercial. Hoy se usa la instalada en el
   sistema (local) y, si no está, Montserrat.
   Cuando tengas los .woff2 licenciados: copialos en /fonts y agregá a cada
   bloque, después de los local(...), la línea correspondiente, por ejemplo:
     url("../fonts/ProximaNova-Regular.woff2") format("woff2")
   (Light, Regular, RegularIt, Semibold y Bold). */
@font-face {
  font-family: "Proxima Nova";
  src: local("Proxima Nova Light"), local("ProximaNova-Light");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: local("Proxima Nova Regular"), local("ProximaNova-Regular");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: local("Proxima Nova Italic"), local("ProximaNova-RegularIt");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: local("Proxima Nova Semibold"), local("ProximaNova-Semibold");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proxima Nova";
  src: local("Proxima Nova Bold"), local("ProximaNova-Bold");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* --- Respaldo: Montserrat (licencia libre OFL), incluida en /fonts ---------
   Se usa mientras no estén los archivos de Proxima Nova. */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-italic.woff2") format("woff2");
  font-weight: 300 700;
  font-style: italic;
  font-display: swap;
}

:root {
  /* --- Familias --- */
  --font-family: "Proxima Nova", "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --font-family-headings: var(--font-family);

  /* --- Escala tipográfica (valores de la referencia) --- */
  --font-size: 18px;
  --line-height: 28px;
  --font-weight: 400;
  --bold-font-weight: 700;

  --h1-font-size: 3rem;    --h1-line-height: 1.1; --h1-font-weight: 700;
  --h2-font-size: 2rem;    --h2-line-height: 1.2; --h2-font-weight: 700;
  --h3-font-size: 1.7rem;  --h3-line-height: 1.2; --h3-font-weight: 400;
  --h4-font-size: 1.4rem;  --h4-line-height: 1.2; --h4-font-weight: 400;
  --h6-font-size: 18px;    --h6-line-height: 1.2; --h6-font-weight: 300;
  --h6-letter-spacing: 0.04em;
  --heading-margin-bottom: 1.5rem;

  /* Título grande de los bloques con video (us_custom_59139a13) */
  --display-font-size: calc(1.8rem + 2vw);

  /* Menú del header */
  --menu-font-size: 16px;
  --menu-font-weight: 700;
  --menu-dropdown-font-size: 15px;

  /* --- Paleta Global Drip (Manual de marca) --- */
  --gd-blue: #004ABC;
  --gd-cyan: #02C2E0;
  --gd-black: #000000;
  --gd-white: #FFFFFF;

  /* --- Paleta Krebs (pivote central) ---
     No hay códigos oficiales: valores de referencia, ajustar acá. */
  --krebs-red: #D71920;
  --krebs-black: #141414;

  /* --- Neutros (heredados de la referencia) --- */
  --color-dark: #1c1c1c;          /* header sticky / footer (ref: #2b2b2b) */
  --color-gray: #575756;          /* hover de botones y texto (ref) */
  --color-gray-light: #9d9d9c;    /* botón neutro (ref us-btn-style_6) */
  --color-text-on-dark: #ffffff;
  --color-text-muted: #d2d2d2;

  /* --- Roles --- */
  --color-primary: var(--gd-blue);
  --color-accent: var(--gd-cyan);
  --color-header-bg: var(--color-dark);
  --color-header-text: var(--color-text-muted);
  --color-header-text-transparent: #ffffff;
  --color-header-text-hover: var(--gd-cyan);
  --color-footer-bg: var(--color-dark);
  --color-footer-text: #ffffff;
  --color-footer-accent: var(--gd-cyan);
  --color-footer-border: var(--color-gray);

  /* --- Páginas internas (ref: content-bg #dedede / alt #f2f2f2) --- */
  --color-content-bg: #dedede;
  --color-content-bg-alt-section: #f2f2f2;
  --color-content-text: #575756;
  --color-content-heading: #575756;
  --color-heading-accent: var(--gd-blue);       /* títulos h1 azules (ref #0069b4) */
  --page-header-fallback: #0b2f6b;               /* color si falta la imagen */
  --overlay-page-header: rgba(0, 0, 0, 0.35);    /* oscurecido neutro y parejo, sin degradé */
  --media-radius: 0.75em;
  --media-placeholder: linear-gradient(135deg, #004ABC, #02C2E0);

  /* --- Inputs de formularios (ref) --- */
  --inputs-height: 3em;
  --inputs-padding: 1.4em;
  --inputs-font-size: 18px;
  --inputs-border-radius: 1.5em;
  --inputs-background: #d0d0d0;
  --inputs-focus-box-shadow: 0 0 0 3px var(--gd-blue) inset;

  /* --- Mapa --- */
  --map-province: #c9ced6;
  --map-province-active: #9fdcea;
  --map-province-hover: #6fcde2;
  --map-province-selected: var(--gd-cyan);
  --map-stroke: #ffffff;

  /* --- Overlays sobre video (ref: rgba(0,0,0,.45) plano) --- */
  --overlay-base: rgba(0, 0, 0, 0.45);
  --overlay-goteo: var(--overlay-base);   /* sin tinte de color */
  --overlay-pivote: var(--overlay-base);  /* sin tinte de color */

  /* --- Layout --- */
  --site-content-width: 1140px;
  --section-padding-inline: 2.5rem;
  --section-padding-block: 4rem;        /* height_medium */
  --section-padding-block-small: 2rem;  /* height_small */
  --columns-gap: 3rem;
  --hwrapper-gap: 1.2rem;
  --separator-small: 1.5rem;
  --site-border-radius: 0.3rem;
  --viewport-height: 100vh;

  /* --- Header --- */
  --header-height: 80px;
  --header-sticky-height: 60px;
  --header-logo-height: 45px;
  --menu-items-gap: 15px;
  --header-transition: 0.3s cubic-bezier(.78, .13, .15, .86);
  --header-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);

  /* --- Botones (us-btn-style_*) --- */
  --btn-font-size: 18px;
  --btn-line-height: 1.2;
  --btn-padding: 0.9em 2em;
  --btn-radius: 0.5em;
  --btn-radius-round: 1em;
  --btn-shadow: 0 0.1em 0.2em 0 rgba(0, 0, 0, 0.2);
  --btn-shadow-hover: 0 0.5em 1em 0 rgba(0, 0, 0, 0.2);
  --btn-hover-background: var(--color-gray);
  --btn-transition: 0.3s ease;
}

@supports (height: 100svh) {
  :root { --viewport-height: 100svh; }
}

@media (max-width: 600px) {
  :root {
    --font-size: 17px;
    --h1-font-size: 2.2rem;
    --h2-font-size: 1.8rem;
    --h3-font-size: 1.5rem;
    --h4-font-size: 1.2rem;
    --section-padding-inline: 1.5rem;
    --columns-gap: 1.5rem;
    --header-logo-height: 30px;
  }
}
