/* Viva campaign styles */
.hero {
  text-align: center;
  padding: var(--s-7) 0;
}
.hero .btn-secondary {
  border-color: var(--paper);
  color: var(--paper);
}
.section--alt {
  background: var(--paper);
}
.container--narrow {
  width: min(60ch, 92%);
  margin-inline: auto;
}
.card--elevated {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 6px 12px rgba(0, 0, 0, 0.08);
}
.band {
  text-align: center;
}
.band .btn-primary {
  margin-top: var(--s-4);
}

:root{
  --text: var(--ink);
  --brand: var(--brand-azul);
  --muted: var(--ink-2);
  --header-height: 0px;
  --brand-wordmark-scale: 1;
  scroll-padding-top: calc(var(--brand-logo-height, 3rem) + var(--s-5));
}

/* --- Layout helpers --- */
.section{ padding:56px 0; }
.btn-row{ display:flex; gap:12px; flex-wrap:wrap; margin-top:12px; justify-content:center; }

/* --- Keep hero light --- */
.hero--light{ background:var(--bg); padding:48px 0 24px; }

/* --- Typography --- */
body, p, input, button, textarea{
  font-family: var(--font-body);
  color: var(--text);
  font-weight: 400;
}
h1,h2,h3,.display{
  font-family: var(--font-head);
  color: var(--brand);              /* #0C3C78 */
  letter-spacing:-.01em;
}
.display{
  font-size: clamp(40px, 4.4vw, 56px);
  line-height: 1.08;
  font-weight: 800;
}
.lead{ font-size:20px; color:var(--muted); }

/* --- Buttons (accent) --- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  border-radius:12px; padding:.85rem 1.2rem;
  text-transform:uppercase; letter-spacing:.04em; font-weight:800;
  text-decoration:none; border:0; cursor:pointer;
  font-family: var(--font-head);
}

.btn-primary{
  background:var(--brand-sun); color:#fff;
  box-shadow:0 10px 24px rgba(225,82,45,.20);
  font-size:1.2rem;
}
.btn-primary:hover{ background:var(--brand-sun-hover); }
.btn-primary:active{ background:var(--brand-sun-pressed); }
.btn-primary:focus-visible{ outline:2px solid var(--brand-sun-soft); outline-offset:2px; }

.btn-secondary{
  background:transparent; color:#0C3C78;          /* Azul Profundo */
  border:2px solid #0C3C78; border-radius:12px; padding:.8rem 1.2rem;
}
.btn-secondary:hover{ background: color-mix(in srgb, #0C3C78 10%, #fff); }

/* ===== Nav (responsive dropdown) ===== */
.header{
  position:-webkit-sticky;
  position:sticky;
  top:0;
  inset-inline:0;
  z-index:1000;
  background:var(--paper);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  width:100%;
  box-shadow:0 2px 12px rgba(16, 24, 40, .06);
}
.header.is-fixed{
  position:fixed;
  top:0;
  left:0;
  right:0;
}
.nav-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0;
  padding:calc(14px + env(safe-area-inset-top)) 0 14px;
}
.brand{
  display:inline-flex;
  align-items:center;
  flex-wrap:nowrap;
  gap:calc(var(--s-1) / 2);
  font-family: var(--font-head);
  font-weight:900;
  color:var(--brand);
  text-decoration:none;
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  font-size:calc(1.15rem * var(--brand-wordmark-scale, 1));
  line-height:1;
}
.brand__home{
  display:inline-flex;
  align-items:center;
  gap:var(--s-2);
  color:inherit;
  text-decoration:none;
  flex:0 1 auto;
  min-width:0;
}
.brand__home:hover{
  text-decoration:none;
}
.brand__home[aria-current]{
  cursor:default;
}
.brand__ticker-link{
  display:inline-flex;
  align-items:center;
  color:inherit;
  text-decoration:none;
  flex:0 1 auto;
  min-width:0;
}
.brand__ticker-link:hover{
  text-decoration:none;
}
.brand__logo{
  display:block;
  height:var(--brand-logo-height, clamp(2.25rem, 5vw, 2.75rem));
  max-height:var(--brand-logo-height, clamp(2.25rem, 5vw, 2.75rem));
  width:auto;
}
.brand__text{
  display:inline-flex;
  align-items:center;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  flex-shrink:0;
}
.brand__ticker{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:var(--s-1);
  margin-left:calc(var(--s-1) * .75);
  font-weight:700;
  font-size:inherit;
  text-transform:none;
  letter-spacing:inherit;
  color:var(--brand-azul);
  min-width:var(--ticker-width, 6ch);
  white-space:nowrap;
  overflow:hidden;
  flex-shrink:1;
}
.brand__ticker::before{
  content:"|";
  display:inline-block;
  color:var(--border);
  font-weight:inherit;
  line-height:1;
  margin-right:calc(var(--s-1) / 2);
}

@media (max-width:768px){
  html[lang="es"] .brand__ticker{
    margin-left:calc(var(--s-1) * .75);
  }
}

html[lang="en"] .brand__ticker{
  margin-left:calc(var(--s-1) / 2);
}

html[lang="en"] .brand__ticker::before{
  margin-right:calc(var(--s-1) / 3);
}
.brand__ticker-label{
  display:inline-block;
  font-size:inherit;
  font-weight:inherit;
  line-height:1;
  color:inherit;
}
.brand__ticker-name{
  display:inline-block;
  min-width:var(--ticker-width, 6ch);
  font-size:inherit;
  font-weight:inherit;
  line-height:1;
  text-align:left;
  color:inherit;
}
.brand__ticker-measure{
  position:absolute;
  left:-9999px;
  bottom:auto;
  pointer-events:none;
  white-space:nowrap;
  opacity:0;
}

@media (max-width:520px){
  html[lang="es"]{
    --brand-wordmark-scale:.92;
  }

  html[lang="es"] .brand__text,
  html[lang="es"] .brand__ticker{
    font-size:clamp(.95em, 2.9vw, 1.02em);
  }
}

@media (max-width:420px){
  html[lang="es"]{
    --brand-wordmark-scale:.88;
  }

  html[lang="es"] .brand__text,
  html[lang="es"] .brand__ticker{
    font-size:clamp(.92em, 3.3vw, .98em);
  }
}

@media (max-width:360px){
  .brand{
    flex-wrap:wrap;
    row-gap:var(--s-1);
  }

  .brand__ticker{
    margin-left:var(--s-3);
  }
}

body.has-fixed-header main{
  padding-top:var(--header-height);
}

/* Base menu */
.menu{ display:flex; gap:24px; align-items:center; list-style:none; margin:0; padding:0; font-family: var(--font-head); }
.menu a{
  color:var(--text);
  text-decoration:none;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.1;
  text-align:center;
}
.menu__search{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  flex:0 1 auto;
}
.menu-search__panel{
  flex:1 1 100%;
  width:100%;
}
.menu-search{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  width:100%;
}
.menu-search__input{
  flex:1 1 auto;
  min-width:0;
  padding:var(--s-2) var(--s-3);
  border:1px solid var(--border);
  border-radius:var(--radius);
  font-family:var(--font-body);
  font-size:1rem;
  color:var(--ink);
  background-color:var(--paper);
}
.menu-search__input:focus{
  outline:2px solid var(--brand-link);
  outline-offset:2px;
}
.menu-search__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:calc(var(--s-2) + 0.125rem) var(--s-4);
  border:1px solid var(--brand-azul);
  border-radius:var(--btn-radius);
  background:var(--brand-azul);
  color:#fff;
  font-family:var(--font-head);
  font-size:.95rem;
  font-weight:700;
  line-height:1.1;
  cursor:pointer;
}
.menu-search__button:hover,
.menu-search__button:focus-visible{
  text-decoration:none;
  background:var(--brand-azul-deep);
  border-color:var(--brand-azul-deep);
}
.menu-search__button:focus-visible{
  outline:2px solid var(--brand-link);
  outline-offset:2px;
}
.menu-search__button:active{
  background:color-mix(in srgb, var(--brand-azul) 85%, #000 15%);
  border-color:color-mix(in srgb, var(--brand-azul) 85%, #000 15%);
}
.menu-search__toggle{
  display:none;
  align-items:center;
  gap:var(--s-1);
  padding:var(--s-2) var(--s-3);
  border:1px solid transparent;
  border-radius:var(--btn-radius);
  background:transparent;
  color:var(--brand-azul);
  font:inherit;
  font-weight:700;
  line-height:1.1;
  cursor:pointer;
  transition:background-color .18s ease, border-color .18s ease;
}
.menu-search__toggle::before{
  content:"🔍";
  font-size:1rem;
  line-height:1;
}
.menu-search__toggle:hover,
.menu-search__toggle:focus-visible{
  text-decoration:none;
  background:color-mix(in srgb, var(--brand-azul) 8%, var(--paper));
  border-color:var(--brand-azul);
}
.menu-search__toggle:focus-visible{
  outline:2px solid var(--brand-link);
  outline-offset:2px;
}
.menu a:hover{ text-decoration:underline; }
.menu li{ position:relative; }
.nav-parent{
  background:transparent;
  border:0;
  font:inherit;
  font-weight:700;
  color:var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.1;
  text-align:center;
}
.language-switch{
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
}
html[lang="en"] .language-switch{
  gap:calc(var(--s-1) / 2);
}
.language-switch__option{
  color:var(--text);
  display:inline-flex;
  align-items:center;
}
.language-switch__option.language-switch__current{
  color:var(--brand-azul-deep);
}
.language-switch__divider{
  color:var(--ink-2);
}
.submenu{ list-style:none; margin:0; padding:var(--s-2) 0; background:var(--paper); border:1px solid var(--border);
  display:none; opacity:0; visibility:hidden; position:absolute; top:100%; left:0; z-index:1000; }
.submenu a{ padding:var(--s-2) var(--s-4); color:var(--text); }
.has-submenu:hover > .submenu,
.has-submenu:focus-within > .submenu,
.has-submenu > .nav-parent[aria-expanded="true"] + .submenu{ display:block; opacity:1; visibility:visible; }
@media (max-width: 900px){
  .submenu{ position:static; }
}
@media (min-width:1024px){
  .submenu{ pointer-events:auto; }
}

/* Toggle (hidden on desktop) */
.nav-toggle{ display:none; background:transparent; border:0; cursor:pointer; padding:8px; border-radius:8px; margin-left:auto; font-family: var(--font-head); }
.nav-toggle-bar{ display:block; width:24px; height:2px; background:var(--text); margin:5px 0; border-radius:1px; }

/* Mobile styles */
@media (max-width: 900px){
  .nav-toggle{ display:inline-block; }

  .mobile-nav{
    position:absolute;
    top:100%;
    left:50%;
    width:100vw;
    background:var(--paper);
    border-top:1px solid var(--border);
    box-shadow:0 6px 24px rgba(0,0,0,.06);
    z-index:1000;
    overflow:hidden;
    transform:translate(-50%,0) scaleY(0);
    transform-origin:top;
    transition:transform .18s ease-out, opacity .18s ease-out;
    opacity:0;
  }

  .mobile-nav.is-open{
    transform:translate(-50%,0) scaleY(1);
    opacity:1;
  }

  .mobile-nav .menu{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:var(--s-4);
    padding:var(--s-4) var(--s-5);
  }

  .menu__search{
    width:100%;
  }

  .mobile-nav .menu-search{
    flex-direction:column;
    align-items:stretch;
  }

  .mobile-nav .menu-search__button{
    width:100%;
  }
}

@media (min-width:901px){
  .menu__search{
    margin-left:auto;
    position:relative;
  }

  .menu__search--desktop{
    align-items:center;
    flex:0 0 auto;
  }

  .menu__search--desktop .menu-search__toggle{
    display:inline-flex;
  }

  .menu__search--desktop .menu-search__panel{
    position:absolute;
    right:0;
    top:calc(100% + var(--s-2));
    width:min(22rem, 92vw);
    padding:var(--s-4);
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--paper);
    box-shadow:0 20px 40px rgba(15, 23, 42, 0.18);
    transition:opacity .18s ease, transform .18s ease;
    z-index:1000;
  }

  .menu__search--desktop:not(.is-open) .menu-search__panel{
    opacity:0;
    visibility:hidden;
    transform:translateY(-0.25rem);
    pointer-events:none;
  }

  .menu__search--desktop.is-open .menu-search__panel{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
  }

  .menu__search--desktop .menu-search{
    flex-direction:column;
    align-items:stretch;
    gap:var(--s-3);
  }

  .menu__search--desktop .menu-search__button{
    width:100%;
  }
}
