/* SISGA 2026 — shared presentation layer for every language */
:root {
  --ink: #2f2b2a;
  --muted: #655d57;
  --paper: #fffaf2;
  --cream: #f4eadf;
  --soft: #efe1d4;
  --line: #d8c5b6;
  --gold: #c7a06d;
  --dark: #292725;
  --red: #8e3f33;
  --green: #5f6f53;
  --display: Georgia, "Times New Roman", serif;
  --sans: Arial, "Segoe UI", sans-serif;
  --content: min(1180px, calc(100% - 32px));
  --wide: min(1320px, calc(100% - 32px));
  --shadow: 0 16px 42px rgba(62, 43, 31, .1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.62;
}
body p, body li, body td, body th, body label, body input, body select, body textarea, body button {
  font-family: var(--sans);
}
a { color: inherit; }
img { display: block; max-width: 100%; height: auto; }
.wrap { width: var(--content); margin-inline: auto; }

h1, h2, h3, h4, .brand {
  font-family: var(--display);
  text-wrap: balance;
}
h1 { letter-spacing: -.035em; }
h2 { letter-spacing: -.025em; }
p, li { text-wrap: pretty; }

.skip-link {
  position: fixed;
  top: 8px;
  left: -9999px;
  z-index: 5000;
  padding: 10px 14px;
  border: 2px solid var(--dark);
  background: #fff;
  color: #111;
  font-weight: 800;
}
.skip-link:focus { left: 8px; }

/* Shared language bar used by translated templates */
.sisga-lang-switch {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  display: flex !important;
  justify-content: flex-end;
  gap: 4px !important;
  width: 100%;
  min-height: 34px;
  padding: 5px max(16px, calc((100% - 1320px) / 2)) !important;
  background: var(--dark);
  color: #fff;
  font: 800 12px/1 var(--sans) !important;
}
.sisga-lang-switch a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px !important;
  border-radius: 2px;
  background: transparent !important;
  color: #fff !important;
  text-decoration: none;
}
.sisga-lang-switch a:hover, .sisga-lang-switch a:focus-visible {
  background: rgba(255,255,255,.14) !important;
  text-decoration: underline;
}
html body .sisga-lang-switch > a,
html body .sisga-lang-switch > a:link,
html body .sisga-lang-switch > a:visited {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Both header systems */
.topbar, .top {
  position: sticky !important;
  top: 0;
  z-index: 1000 !important;
  min-height: 72px;
  border-bottom: 1px solid var(--line) !important;
  background: rgba(255,250,242,.97) !important;
  box-shadow: 0 6px 18px rgba(62,43,31,.04);
  backdrop-filter: blur(12px);
}
.topbar {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 0 max(16px, calc((100% - 1320px) / 2));
}
.topbar:has(> .wrap) { padding: 0; }
.top .wrap, .topbar > .wrap {
  width: var(--wide) !important;
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 22px;
  margin-inline: auto !important;
}
.brand {
  flex: 0 0 auto;
  color: var(--ink) !important;
  font-size: 1.75rem !important;
  font-weight: 800;
  line-height: .92;
  text-decoration: none !important;
}
.brand small {
  display: block;
  margin-top: 5px;
  font: 800 .65rem/1.1 var(--sans) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.topbar nav, .top .menu, .topbar .menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex: 1 1 auto;
  margin: 0;
}
.topbar nav a, .top .menu a, .topbar .menu a, .submenu-toggle {
  padding: 8px 0;
  color: var(--ink);
  font: 800 .87rem/1.15 var(--sans) !important;
  text-decoration: none;
  white-space: nowrap;
}
.topbar nav a:hover, .topbar nav a:focus-visible,
.top .menu a:hover, .top .menu a:focus-visible,
.topbar .menu a[aria-current="page"], .topbar nav .active, .top .menu .active {
  color: var(--red) !important;
}
.lang-switch, .langs, .lang-mini {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
}
.lang-switch a, .lang-switch .lang-disabled, .langs a, .lang-mini a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 32px;
  padding: 4px 7px !important;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  font: 800 .74rem/1 var(--sans) !important;
  text-decoration: none;
}

/* Hero and major bands */
.page-hero, .route-hero, .hero, .cover {
  border-bottom: 1px solid var(--line);
  background: linear-gradient(120deg, var(--cream), var(--paper) 58%, #efdcd1) !important;
}
.page-hero, .route-hero { padding: 70px max(16px, calc((100% - 1180px) / 2)) 52px !important; }
.page-hero > .wrap { width: 100% !important; }
.page-hero h1, .route-hero h1, .hero h1, .cover h1 {
  max-width: 1000px;
  margin: 0 0 18px;
  color: var(--ink);
  font-size: clamp(2.8rem, 7vw, 5.8rem) !important;
  line-height: .94 !important;
}
.page-hero .lead, .route-hero p, .hero .lead, .cover p {
  max-width: 850px;
  color: var(--muted);
  font-size: 1.12rem;
}
.kicker, .overline {
  margin: 0 0 10px;
  color: var(--red) !important;
  font: 900 .78rem/1.2 var(--sans) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Content rhythm */
main > section:not(.page-hero):not(.route-hero):not(.cover):not(.home-es-hero):not(.full-bleed) {
  padding-top: 52px;
  padding-bottom: 52px;
}
main > section:not(.page-hero):not(.route-hero):not(.cover):not(.home-es-hero):not(.full-bleed) > :where(.grid,.grid2,.cards,.split,.feature,.timeline,.schedule,.route-grid,.profile-kpis,.producer-path,.content-narrow,.two-feature,.cooperation-grid,.summary-program,.info-split,.detail-grid,.people,.legal-list,.entities,.mini-grid,.distinctions,.table-wrap,h2,h3,p,ul,ol,.btns,.actions,.notice,.route-table,.profile-choice) {
  width: var(--content);
  margin-left: auto;
  margin-right: auto;
}
.section, section { border-color: var(--line); }
.section h2, section h2 {
  color: var(--ink);
  font-size: clamp(2rem, 4.5vw, 3.6rem);
  line-height: .98;
}

/* Cards and grids */
.card, .route-card, .sisga-card, .entity, .big-form, .form,
.producer-action-card, .producer-choice article, .producer-samples article,
.sisga-word-card, .people article, .legal-list article, .schedule, .notice {
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  background: var(--paper) !important;
  color: var(--ink);
  box-shadow: var(--shadow);
}
.card, .route-card, .sisga-card, .entity, .people article, .legal-list article { padding: 24px; }
.card.emph, .route-card.emph, .sisga-word-card.important { border-top: 6px solid var(--gold) !important; }
.card h3, .route-card h2, .route-card h3, .people h3 {
  margin-top: 0;
  color: var(--ink);
  font-family: var(--display) !important;
  line-height: 1.05;
}
.card p, .route-card p, .route-card li { color: var(--muted); }
.grid, .grid2, .cards, .split, .route-grid, .people, .legal-list, .info-split, .detail-grid {
  gap: 20px !important;
}

/* Calls to action */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 17px !important;
  border: 1px solid var(--dark) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--ink) !important;
  font: 900 .88rem/1.15 var(--sans) !important;
  text-decoration: none;
  box-shadow: none !important;
}
.btn.primary, .btn.gold {
  border-color: var(--dark) !important;
  background: var(--dark) !important;
  color: #fff !important;
}
.btn:hover, .btn:focus-visible { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(41,39,37,.14) !important; }
.btns, .actions, .profile-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* Tables and forms */
.table-wrap { overflow-x: auto; }
.table, .route-table, .sisga-word-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--line) !important;
  background: #fff;
  font-size: .94rem;
}
.table th, .table td, .route-table th, .route-table td,
.sisga-word-table th, .sisga-word-table td {
  padding: 12px;
  border-bottom: 1px solid var(--line) !important;
  text-align: left;
  vertical-align: top;
}
.table th, .route-table th, .sisga-word-table th { background: #f1dfcf !important; }
input, select, textarea {
  width: 100%;
  min-height: 44px;
  padding: 11px 12px;
  border: 1px solid var(--line) !important;
  border-radius: 0;
  background: #fff;
  color: var(--ink);
  font: inherit;
}
input:focus, select:focus, textarea:focus, a:focus-visible, button:focus-visible {
  outline: 3px solid rgba(142,63,51,.3);
  outline-offset: 2px;
}

/* Footer systems */
.entity-strip, .sisga-logo-bar, .logo-strip { border-top: 1px solid var(--line); }
.footer, body > footer {
  display: block !important;
  padding: 34px max(16px, calc((100% - 1180px) / 2)) !important;
  background: var(--dark) !important;
  color: #fff !important;
  font: .9rem/1.6 var(--sans) !important;
}
.footer .wrap { width: 100%; }
.footer p, body > footer p { color: #f2e9df !important; }
.footer a, body > footer a { display: inline-block; margin: 4px 10px 4px 0; color: #fff !important; }

/* Language selector remains a deliberately distinct landing page */
.language-page { background: linear-gradient(115deg, var(--paper), #f1ded2) !important; }
.language-page .language-hero { border: 0; }
.language-option { box-shadow: 0 8px 22px rgba(62,43,31,.06); }

@media (max-width: 1100px) {
  .topbar, .top .wrap, .topbar > .wrap { flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  .topbar:has(> .wrap) { padding-top: 0; padding-bottom: 0; }
  .topbar > nav, .top .menu, .topbar:not(:has(.menu-toggle)) .menu {
    order: 4;
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    padding: 3px 0 8px;
    scrollbar-width: thin;
  }
  .topbar:has(.menu-toggle) .menu { width: 100%; }
  .lang-switch, .langs, .lang-mini { margin-left: auto; }
}

@media (max-width: 760px) {
  :root { --content: min(100% - 28px, 1180px); --wide: min(100% - 28px, 1320px); }
  html, body, main { width: 100%; max-width: 100%; overflow-x: hidden !important; }
  .sisga-lang-switch {
    position: static !important;
    left: auto !important;
    right: auto !important;
    justify-content: center !important;
    width: 100vw !important;
    max-width: 100vw !important;
    padding-inline: 10px !important;
    transform: none !important;
  }
  .sisga-lang-switch a {
    position: static !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .topbar { padding-inline: 14px; }
  .brand { font-size: 1.5rem !important; }
  .page-hero, .route-hero { padding: 48px 14px 38px !important; }
  .wrap, .word-wrap, .route-hero > *, .page-hero > *, .hero > *,
  .sisga-bases-word .word-wrap, .sisga-producer-summary .word-wrap,
  .sisga-word-cta .word-wrap, .profile-choice > * {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .route-hero > *, .page-hero > * { width: 100% !important; max-width: 100% !important; }
  h1, h2, h3, .producer-section-title { max-width: 100%; overflow-wrap: anywhere; word-break: normal; }
  .btns, .actions, .profile-actions {
    width: auto !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .btns > *, .actions > *, .profile-actions > * {
    flex: 0 1 auto;
    max-width: 100%;
    white-space: normal !important;
  }
  main > section:not(.page-hero):not(.route-hero):not(.cover):not(.home-es-hero) { padding-top: 40px; padding-bottom: 40px; }
  .grid, .grid.two, .grid.three, .grid2, .cards, .split, .route-grid,
  .route-grid.two, .route-grid.four, .people, .legal-list, .info-split, .detail-grid,
  .producer-choice, .producer-action-grid, .producer-other-grid, .producer-samples {
    grid-template-columns: 1fr !important;
  }
  .table, .route-table, .sisga-word-table { min-width: 650px; }
  .table-wrap, .route-table { overflow-x: auto; display: block; }
  .language-layout { grid-template-columns: 1fr !important; }
  .language-poster { justify-self: start !important; width: min(300px, 100%) !important; }
}
