/* ══════════════════════════════════════════════════════════════════
   eDesign.com.pa · BRAND.CSS — fuente única de la identidad visual
   Tipografías, tokens de color y reset base.
   Lo carga TODA página del sitio: home, legales, servicios, landings.
   ⚠ Si cambias un color o una tipografía, se cambia SOLO aquí.
   ══════════════════════════════════════════════════════════════════ */

/* ══════════ TIPOGRAFÍAS AUTO-HOSPEDADAS ══════════
   Sin llamadas a fonts.googleapis.com: la IP del visitante no sale del dominio.
   Subconjunto latino, solo los pesos que el sitio usa realmente. */
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/space-grotesk-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:600;font-display:swap;
  src:url('/assets/fonts/space-grotesk-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/fonts/space-grotesk-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;
  src:url('/assets/fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/jetbrains-mono-latin-500-normal.woff2') format('woff2');}

/* ══════════ TOKENS DE MARCA ══════════ */
:root{
  /* primarios */
  --navy:#0F2238;          /* Navy eDesign  · fondo base            */
  --deep:#081525;          /* Navy profundo · fondos de sección     */
  --ink:#16324F;           /* Navy tinta    · tarjetas y superficies*/
  --green:#7AC943;         /* Verde Auditoría · acentos y CTA       */
  --green-deep:#4C8F1F;    /* Verde Profundo  · texto sobre blanco  */

  /* neutros y estado */
  --slate:#5B6B7D;
  --off:#F5F7F9;
  --amber:#E8A33D;
  --red:#FF6B5E;

  /* líneas y texto sobre oscuro */
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);
  --txt:rgba(255,255,255,.72);

  /* movimiento */
  --ease:cubic-bezier(.22,1,.36,1);

  /* ancho de contenido — cada plantilla lo redefine si lo necesita */
  --max:1240px;
}

/* ══════════ RESET BASE ══════════ */
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'IBM Plex Sans',system-ui,sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input{font-family:inherit;}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 34px;}
.mono{font-family:'JetBrains Mono',monospace;}
