/*
 * Identidad de la página web de la Alcaldía Municipal de Subachoque
 * (www.subachoque-cundinamarca.gov.co, plantilla MinTIC «Mi Colombia Digital»),
 * tomada de sus estilos calculados el 2026-09-24:
 *
 *   verde de marca      #488704  (menú activo, títulos, íconos)
 *   verde claro         #A8C98D  (fondos suaves, bordes)
 *   texto               #4B4B4B / #5C5C5C
 *   barra gov.co        #0943B5  (organismo nacional: no se re-marca)
 *   tipografía          Verdana en el cuerpo, Nunito Sans en títulos
 *
 * Contraste: #488704 sobre blanco da 4,43:1, un pelo por debajo de AA para
 * texto normal. Para texto y botones se usa el 600 (#3E7404, 5,9:1); el 500
 * queda para fondos, bordes e íconos grandes.
 *
 * Este archivo trae los tokens, la barra gov.co, la cabecera, el menú y el
 * pie. Los componentes de las páginas están en sitio.css.
 */

/* ---- Nunito Sans (SIL OFL 1.1, ver ../fonts/OFL.txt) ---- */
@font-face{font-family:"Nunito Sans";src:url("../fonts/NunitoSans-Regular.woff2") format("woff2"),url("../fonts/NunitoSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("../fonts/NunitoSans-SemiBold.woff2") format("woff2"),url("../fonts/NunitoSans-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("../fonts/NunitoSans-Bold.woff2") format("woff2"),url("../fonts/NunitoSans-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("../fonts/NunitoSans-ExtraBold.woff2") format("woff2"),url("../fonts/NunitoSans-ExtraBold.ttf") format("truetype");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("../fonts/NunitoSans-Black.woff2") format("woff2"),url("../fonts/NunitoSans-Black.ttf") format("truetype");font-weight:900;font-style:normal;font-display:swap}

:root{
  --suba-verde-50:#F2F7EC;
  --suba-verde-100:#E1EDD3;
  --suba-verde-200:#A8C98D;
  --suba-verde-300:#86B35A;
  --suba-verde-400:#619A22;
  --suba-verde-500:#488704;
  --suba-verde-600:#3E7404;
  --suba-verde-700:#2F5A03;
  --suba-verde-800:#1F3C02;

  /* Amarillo de los banners del portal (círculos de las ilustraciones). */
  --suba-amarillo:#F2C230;
  --suba-amarillo-suave:#FDF4D3;

  --suba-gris-50:#F6F8F9;
  --suba-gris-100:#E9E9E9;
  --suba-gris-200:#D5D8DA;
  --suba-gris-500:#707070;
  --suba-gris-600:#5C5C5C;
  --suba-gris-700:#4B4B4B;
  --suba-gris-900:#171A1F;

  --suba-error:#A80521;
  --suba-exito:#158361;

  --gc-govco:#0943B5;
  --gc-govco-on:#fff;
  --gc-brand:var(--suba-verde-600);
  --gc-brand-hover:var(--suba-verde-500);
  --gc-text:var(--suba-gris-700);
  --gc-text-muted:var(--suba-gris-600);
  --gc-border-focus:var(--suba-verde-600);

  --gc-font-title:"Nunito Sans",Verdana,Tahoma,sans-serif;
  --gc-font-body:Verdana,Geneva,Tahoma,sans-serif;
}

/* ---- Barra gov.co (arriba y al final del documento) ---- */
.barra-govco{background:var(--gc-govco);color:var(--gc-govco-on)}
.barra-govco .container{display:flex;align-items:center;min-height:44px}
.barra-govco a{color:inherit;text-decoration:none;font-family:var(--gc-font-title);font-weight:800;font-size:17px;letter-spacing:.04em}
.barra-govco a:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* ---- Cabecera: logo de la Alcaldía + nombre del portal ---- */
.cabecera{background:#fff}
.cabecera-marca{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:14px 0}
.marca-alcaldia{display:inline-flex;align-items:center;gap:16px;min-width:0;color:inherit;text-decoration:none}
.marca-alcaldia img{display:block;height:64px;width:auto;aspect-ratio:298/100}
.marca-alcaldia:focus-visible{outline:2px solid var(--gc-border-focus);outline-offset:4px;border-radius:4px}
.marca-portal{padding-left:16px;border-left:1px solid var(--suba-gris-200);font-family:var(--gc-font-title);line-height:1.15}
.marca-portal strong{display:block;font-size:20px;font-weight:800;color:var(--suba-verde-600)}
.marca-portal span{font-size:13px;color:var(--gc-text-muted)}
.cabecera-enlace{font-size:13px;color:var(--gc-text-muted);text-decoration:none}
.cabecera-enlace:hover{color:var(--gc-brand)}

/* ---- Menú: franja gris con la opción activa en verde (como el portal) ---- */
.menu-suba{background:var(--suba-gris-100);border-bottom:4px solid var(--suba-verde-500);padding:0}
.menu-suba .navbar-nav{gap:0}
.menu-suba .nav-link{display:flex;align-items:center;min-height:50px;padding:.5rem 1.1rem!important;font-family:var(--gc-font-body);font-size:13px;color:var(--suba-gris-700);border-radius:0}
.menu-suba .nav-link:hover,.menu-suba .nav-link:focus-visible{background:var(--suba-verde-100);color:var(--suba-verde-700)}
.menu-suba .nav-link.active,.menu-suba .nav-link[aria-current="page"]{background:var(--suba-verde-500);color:#fff}
.menu-suba .navbar-toggler{margin:6px 0;border:0;font-size:14px;font-family:var(--gc-font-title);font-weight:700;color:var(--suba-gris-700);align-items:center;gap:.5rem}
@media (max-width:991.98px){.menu-suba .navbar-toggler{display:inline-flex}}
.menu-suba .btn-menu{margin-left:auto}

/* ---- Pie: como el portal, blanco con datos de contacto y la barra gov.co ---- */
.pie{background:#fff;border-top:4px solid var(--suba-verde-500);padding:40px 0 28px;font-size:13px;color:var(--gc-text-muted)}
.pie h2{font-family:var(--gc-font-title);font-size:18px;font-weight:800;color:var(--suba-verde-600);margin-bottom:12px}
.pie dl{margin:0;line-height:1.7}
.pie dt{display:inline;font-weight:700;color:var(--suba-gris-700)}
.pie dt::after{content:": "}
.pie dd{display:inline;margin:0}
.pie dd::after{content:"\A";white-space:pre}
.pie ul{list-style:none;padding:0;margin:0;line-height:2}
.pie a{color:var(--suba-verde-600);text-decoration:underline}
.pie a:hover{color:var(--suba-verde-700)}
.pie-logos{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.pie-logos img{height:56px;width:auto}
.pie-legal{border-top:1px solid var(--suba-gris-100);margin-top:26px;padding-top:16px;font-size:12px}

@media (max-width:767.98px){
  .marca-alcaldia img{height:48px}
  .marca-portal strong{font-size:16px}
  .marca-portal span{display:none}
  .cabecera-enlace{display:none}
}
@media (max-width:419.98px){
  .marca-alcaldia{gap:10px}
  .marca-alcaldia img{height:40px}
  .marca-portal{padding-left:10px}
  .marca-portal strong{font-size:14px}
}