/* Edificio Rosario Norte — sistema visual
   Misma línea gráfica que Edificio Plaza Manquehue (verde CBRE Chile): bosque profundo + verde de marca + verde señal como acento.
   Tipografías libres: Source Serif 4 (titulares) y Hanken Grotesk (interfaz).
   Al final: componentes propios de Rosario Norte (sellos en la portada, series mensuales, galerías, videos). */

@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-latin-opsz-normal.woff2") format("woff2");
  font-weight: 200 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-latin-opsz-italic.woff2") format("woff2");
  font-weight: 200 900; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
/* Griego (solo se descargan si la página tiene letras griegas): Source Serif 4 griego e Inter griego para la interfaz */
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-greek-opsz-normal.woff2") format("woff2");
  font-weight: 200 900; font-style: normal; font-display: swap; unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+1F00-1FFF;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-greek-opsz-italic.woff2") format("woff2");
  font-weight: 200 900; font-style: italic; font-display: swap; unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+1F00-1FFF;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/inter-greek-wght-normal.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF, U+1F00-1FFF;
}

:root {
  --forest-950: #012a2d;
  --forest: #003f2d;
  --brand: #0c6a4d;
  --brand-deep: #084a37;
  --signal: #17e88f;
  --mint: #80bbad;
  --sage-50: #f6f6f3;
  --sage-100: #eeefea;
  --line: #e1e3de;
  --ink: #0f1f1c;
  --ink-soft: #56615f;
  --on-dark-soft: #a9cbbe;
  --on-brand-soft: #d6ebe2;

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;

  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --max: 82rem;
  --bar-h: 5rem;
  --radius: 2px;
  --focus: var(--brand);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--bar-h) + 1rem);
  scrollbar-color: var(--brand) var(--sage-100);
}

body {
  margin: 0;
  font: 400 1.0625rem/1.7 var(--sans);
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  caret-color: var(--brand);
}

::selection { background: var(--signal); color: var(--forest-950); }

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 2px; }
.on-dark { --focus: var(--signal); color: #fff; }

.skip {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  background: var(--signal); color: var(--forest-950); padding: 0.75rem 1rem; font-weight: 700; border-radius: var(--radius);
}
.skip:focus { top: 0.75rem; }

.wrap { width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto; }

h1, h2, h3 { margin: 0; font-family: var(--serif); font-weight: 340; text-wrap: balance; }
h2 { font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.08; letter-spacing: -0.025em; }
h3 { font-size: clamp(1.375rem, 2vw, 1.75rem); line-height: 1.2; letter-spacing: -0.015em; }
p { margin: 0; }
.measure { max-width: 62ch; }

/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 0.6rem;
  padding: 1rem 1.65rem;
  font: 600 0.9375rem/1 var(--sans); letter-spacing: 0.02em;
  text-decoration: none; border-radius: var(--radius);
  border: 1px solid transparent; cursor: pointer;
  transition: background-color 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease), transform 0.16s var(--ease);
}
.btn svg { width: 1.125rem; height: 1.125rem; transition: transform 0.25s var(--ease); }
.btn:hover svg { transform: translateX(3px); }
.btn--signal { background: var(--signal); color: var(--forest-950); }
.btn--signal:hover { background: #fff; }
.btn--solid { background: var(--brand); color: #fff; }
.btn--solid:hover { background: var(--forest); }
.btn--line { border-color: var(--ink); color: var(--ink); }
.btn--line:hover { background: var(--ink); color: #fff; }
.btn:active { transform: scale(0.97); }

/* ---------- Barra superior y menú desplegable (modelo CBRE) ---------- */
.bar {
  position: sticky; top: 0; z-index: 50;
  background: var(--forest-950); color: #fff;
  --focus: var(--signal);
  --p: 0;
  transition: background-color 0.3s var(--ease), color 0.3s var(--ease);
}
/* Al avanzar, la barra pasa a vidrio: la página se adivina debajo, desenfocada (misma receta que la franja de la portada) */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .bar.is-scrolled:not(.is-dd-open):not(.is-menu-open) {
    background: rgba(1, 42, 45, 0.8);
    -webkit-backdrop-filter: blur(16px) saturate(1.4) brightness(0.9); backdrop-filter: blur(16px) saturate(1.4) brightness(0.9);
  }
}
.bar.is-dd-open, .bar.is-menu-open { background: #fff; color: var(--ink); --focus: var(--brand); }
.bar__inner {
  width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto;
  height: var(--bar-h);
  display: flex; align-items: center; gap: clamp(1rem, 3vw, 3rem);
}
.bar__logo { flex: none; display: flex; align-items: center; gap: 0.85rem; text-decoration: none; }
.bar__marca { position: relative; display: block; }
.bar__logo img { width: auto; height: 2.5rem; transition: opacity 0.3s var(--ease); }
.bar__logo .logo--dark { position: absolute; left: 0; top: 0; opacity: 0; }
.bar__nombre { font: 650 0.936rem/1.15 var(--sans); /* +30 % (pedido del usuario, 21-10) */ letter-spacing: 0.12em; text-transform: uppercase; padding-left: 0.85rem; border-left: 1px solid currentColor; white-space: nowrap; }
.bar.is-dd-open .logo--light, .bar.is-menu-open .logo--light { opacity: 0; }
.bar.is-dd-open .logo--dark, .bar.is-menu-open .logo--dark { opacity: 1; }

.gnav { flex: 1; }
.gnav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0.125rem; }
.gnav__item { position: static; }
.gnav__link {
  white-space: nowrap;
  display: inline-flex; align-items: center; gap: 0.45rem;
  padding: 0.6rem 1rem;
  font: 600 1rem/1 var(--sans);
  color: currentColor; background: none; border: 0; cursor: pointer;
  text-decoration: underline solid transparent; text-decoration-thickness: 2px; text-underline-offset: 0.5em;
  transition: text-decoration-color 0.25s var(--ease);
}
.gnav__link svg { width: 0.75rem; height: 0.75rem; transition: transform 0.3s var(--ease); }
.gnav__link[aria-expanded="true"] svg { transform: rotate(180deg); }
.gnav__link:hover, .gnav__link[aria-expanded="true"], .gnav__link.is-active, .gnav__link[aria-current="page"] { text-decoration-color: var(--signal); }
.bar.is-dd-open .gnav__link:hover, .bar.is-dd-open .gnav__link[aria-expanded="true"], .bar.is-dd-open .gnav__link.is-active, .bar.is-dd-open .gnav__link[aria-current="page"] { text-decoration-color: var(--brand); }
.gnav__cta { display: none; }

.bar__cta { flex: none; margin-left: auto; padding: 0.8rem 1.2rem; font-size: 0.9375rem; }
/* Escritorio: menú centrado en la barra (logo | menú | botón) */
@media (min-width: 68.01rem) {
  .bar__inner { display: grid; grid-template-columns: 1fr auto 1fr; }
  .gnav { flex: none; }
  .bar__cta { justify-self: end; margin-left: 0; }
}
.bar__cta.btn--signal { background: #fff; color: var(--forest-950); border-color: #fff; }
.bar__cta.btn--signal:hover { background: var(--signal); color: var(--forest-950); border-color: var(--signal); }
.bar.is-dd-open .bar__cta { background: #fff; color: var(--brand); border-color: var(--brand); }
.bar.is-dd-open .bar__cta:hover { background: var(--brand); color: #fff; }

.bar__toggle {
  display: none; margin-left: auto; place-items: center; width: 2.875rem; height: 2.875rem;
  background: transparent; color: currentColor; border: 2px solid currentColor; border-radius: var(--radius); cursor: pointer;
}
.bar__toggle svg { width: 1.5rem; height: 1.5rem; }
.bar__toggle .ic-close { display: none; }
.bar.is-menu-open .bar__toggle .ic-open { display: none; }
.bar.is-menu-open .bar__toggle .ic-close { display: block; }

.bar__progress { height: 3px; background: rgba(255, 255, 255, 0.1); transition: opacity 0.3s var(--ease); }
.bar__progress i { display: block; height: 100%; background: var(--signal); transform: scaleX(var(--p)); transform-origin: left; }
.bar.is-dd-open .bar__progress, .bar.is-menu-open .bar__progress { opacity: 0; }

/* Panel desplegable a todo el ancho */
.dd {
  position: absolute; left: 0; right: 0; top: 100%;
  background: #fff; color: var(--ink);
  border-top: 1px solid var(--line);
  box-shadow: 0 34px 40px -34px rgba(0, 18, 14, 0.4);
  visibility: hidden; opacity: 0; transform: translateY(-8px);
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0s linear 0.25s;
}
.gnav__item.is-open .dd { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.dd__grid {
  width: min(100% - 2 * var(--gutter), var(--max)); margin-inline: auto;
  display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.4fr);
  gap: clamp(2rem, 6vw, 6rem); padding-block: clamp(2rem, 4vw, 3.5rem);
}
.dd__title { font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 3vw, 2.75rem); line-height: 1.08; letter-spacing: -0.015em; }
.dd__text { margin-top: 1rem; max-width: 38ch; color: var(--ink-soft); }
.dd__head .btn { margin-top: 1.5rem; }
.dd__groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 4rem); align-content: start; }
.dd__label { margin: 0 0 0.75rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--line); font: 650 0.78rem/1 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--brand); }
.dd__links { list-style: none; margin: 0; padding: 0; }
.dd__links a {
  display: block; padding: 0.55rem 0; color: var(--ink); text-decoration: underline solid transparent;
  font: 600 1.0625rem/1.3 var(--sans); text-underline-offset: 0.3em; text-decoration-thickness: 1px;
  transition: color 0.2s var(--ease), text-decoration-color 0.2s var(--ease);
}
.dd__links a:hover { color: var(--brand); text-decoration-color: currentColor; }
.dd__more { display: inline-flex; align-items: center; gap: 0.6rem; margin-top: 0.85rem; font: 650 0.9375rem/1.2 var(--sans); color: var(--brand); text-decoration: none; }
.dd__more svg { width: 1.125rem; height: 1.125rem; transition: transform 0.25s var(--ease); }
.dd__more:hover svg { transform: translateX(4px); }
.dd__more:hover { text-decoration: underline; text-underline-offset: 0.3em; }

.scrim {
  position: fixed; inset: 0; z-index: 40; background: rgba(1, 42, 45, 0.5);
  opacity: 0; visibility: hidden; transition: opacity 0.3s var(--ease), visibility 0s linear 0.3s;
}
.scrim.is-on { opacity: 1; visibility: visible; transition-delay: 0s; }

/* ---------- Secciones ---------- */
.sec { padding-block: clamp(5.5rem, 11vw, 10rem); }
.sec--paper { background: #fff; }
.sec--sage { background: var(--sage-50); }
.sec--forest { background: var(--forest); }
.sec--deep { background: var(--forest-950); }
.sec--brand { background: var(--forest); }

/* ---------- Portada: la foto a todo el ancho con una franja de vidrio ---------- */
.hero {
  position: relative; overflow: hidden; background: var(--forest);
  color: #fff; --focus: var(--signal); 
  /* alto de la foto (16 : 9 aprox.), sin pasar de la pantalla: si sobra, se recorta solo el borde inferior, que queda bajo la franja */
  height: min(calc(100vw / 1.7684), calc(100svh - var(--bar-h) - 3px));
  min-height: 34rem;
}
.hero__photo { position: absolute; inset: 0; margin: 0; }
/* Foto 4:3: se recorta desde arriba para que la torre quede completa sobre la franja */
.hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; }

/* Franja de vidrio esmerilado: fondo translúcido con desenfoque, como en cbre.cl */
.hero__glass {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
  background: rgba(1, 42, 45, 0.78);
  border-top: 1px solid rgba(255, 255, 255, 0.22);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hero__glass { background: rgba(1, 42, 45, 0.5); -webkit-backdrop-filter: blur(14px) brightness(0.9); backdrop-filter: blur(14px) brightness(0.9); }
}
.hero__glass-in {
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center;
  padding-block: clamp(1.25rem, 2.4vw, 2rem);
}
.hero h1 { font-size: clamp(1.75rem, 3.1vw, 3rem); line-height: 1.06; letter-spacing: -0.02em; text-wrap: balance; }
.hero h1 em { font-style: italic; color: var(--signal); }
.hero__facts { margin: 0; display: grid; }
.hero__facts div { display: grid; grid-template-columns: 7.75rem 1fr; gap: 1rem; align-items: baseline; padding-block: 0.4rem; border-top: 1px solid rgba(255, 255, 255, 0.22); }
.hero__facts div:first-child { border-top: 0; }
.hero__facts dt { font: 650 0.75rem/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; color: var(--on-brand-soft); }
.hero__facts dd { margin: 0; font-weight: 600; font-size: 0.9375rem; }

/* Anchos medianos: franja más compacta para no tapar la foto */
@media (min-width: 62.01rem) and (max-width: 75rem) {
  .hero__glass-in { padding-block: 1rem 1.1rem; gap: 2rem; }
  .hero__facts div { grid-template-columns: 7rem 1fr; gap: 0.75rem; padding-block: 0.3rem; }
  .hero__facts dd { font-size: 0.875rem; }
}

/* Pantallas medianas y móvil: la foto va entera y la franja se apoya debajo, sin tapar nada */
@media (max-width: 62rem) {
  .hero { height: auto; min-height: 0; overflow: visible; }
  .hero__photo { position: relative; }
  .hero__photo img { height: auto; aspect-ratio: 4 / 3; object-position: 50% 0; }
  .hero__glass { position: static; -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--forest); border-top: 0; }
  .hero__glass-in { grid-template-columns: 1fr; gap: 1.25rem; padding-block: 1.75rem 2.25rem; }
  .hero h1 { font-size: clamp(2rem, 7vw, 3rem); }
}

/* ---------- Nuestra alma + ficha ---------- */
.alma__head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; }
.alma__lead { font-family: var(--serif); font-size: clamp(1.375rem, 2.2vw, 2rem); line-height: 1.35; letter-spacing: -0.01em; color: var(--ink-soft); max-width: 34ch; }
.alma__grid { margin-top: clamp(3rem, 6vw, 5rem); }
.alma__items { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.8fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 3vw, 3rem); }
.alma__item { padding-top: 1.5rem; border-top: 1px solid var(--line); }
.alma__item h3 { font: 650 0.78rem/1.2 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--brand); margin-bottom: 0.75rem; }
.alma__item p { color: var(--ink-soft); max-width: 60ch; }

.ficha { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); margin-top: clamp(4rem, 8vw, 7rem); padding-top: clamp(3rem, 6vw, 5rem); border-top: 1px solid var(--line); align-items: start; }
.ficha h3 { font-size: clamp(1.75rem, 2.6vw, 2.5rem); }
.ficha__intro { margin-top: 1rem; color: var(--ink-soft); max-width: 44ch; }
.ficha dl { margin: 0; }
.ficha .row { display: grid; grid-template-columns: minmax(8rem, 11rem) 1fr; gap: 1.25rem; padding: 1.05rem 0; border-top: 1px solid var(--line); }
.ficha .row:first-child { border-top: 0; padding-top: 0; }
.ficha dt { font: 650 0.78rem/1.6 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--brand); padding-top: 0.15rem; }
.ficha dd { margin: 0; font-weight: 500; }

/* ---------- Ubicación ---------- */
.ubic { display: grid; grid-template-columns: minmax(0, 0.62fr) minmax(0, 1.38fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.ubic h2 { max-width: 16ch; }
.ubic__rotulo { margin: 0 0 1rem; font: 600 0.8125rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--brand); }
.ubic__lead { margin: 1.25rem 0 0; color: var(--ink-soft); }
.ubic__datos { margin: 2.25rem 0 2.25rem; }
.ubic__datos div { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1rem; padding: 0.85rem 0; border-top: 1px solid var(--line); }
.ubic__datos div:last-child { border-bottom: 1px solid var(--line); }
.ubic__datos dt { font-size: 0.8125rem; letter-spacing: 0.04em; color: var(--ink-soft); }
.ubic__datos dd { margin: 0; font-size: 0.9375rem; font-weight: 500; color: var(--ink); }
.ubic .enlace-linea svg { width: 0.9em; height: 0.9em; }
@media (max-width: 30rem) { .ubic__datos div { grid-template-columns: 1fr; gap: 0.15rem; } }
.near { list-style: none; margin: 2rem 0 0; padding: 0; }
.near li { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: baseline; padding: 0.95rem 0; border-top: 1px solid rgba(255, 255, 255, 0.16); }
.near li:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
.near strong { font-weight: 700; }
.near span { color: var(--on-dark-soft); font-size: 0.9375rem; }
.ubic .btn { margin-top: 2rem; }
.aerea { margin: 0; }
.aerea img { width: 100%; height: auto; border-radius: var(--radius); box-shadow: 0 30px 60px -35px rgba(1, 42, 45, 0.45); }
.aerea figcaption { margin-top: 0.85rem; font-size: 0.875rem; color: var(--on-dark-soft); }

/* ---------- Sostenibilidad ---------- */
.sost { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.sost h2 { max-width: 14ch; }
.sost .lede { margin-top: 1.5rem; color: var(--on-brand-soft); }
.certs { list-style: none; margin: 0; padding: 0; }
.certs > li { padding: 1.6rem 0; border-top: 1px solid rgba(255, 255, 255, 0.28); }
.certs > li:first-child { padding-top: 0; border-top: 0; }
.certs > li:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.28); }
.certs h3 { font: 650 1.375rem/1.3 var(--sans); letter-spacing: -0.005em; }
.certs p { margin-top: 0.4rem; color: var(--on-brand-soft); }
.links { list-style: none; margin: 1rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.5rem; }
.links a {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font: 700 0.9375rem/1.3 var(--sans); text-decoration: none; color: #fff;
  border-bottom: 2px solid var(--signal); padding-bottom: 0.15rem;
  transition: color 0.2s var(--ease);
}
.links a:hover { border-bottom-width: 4px; padding-bottom: 0.05rem; }
.links svg { width: 1rem; height: 1rem; }

/* ---------- Portal ---------- */
.portal h2 { max-width: 24ch; }
.portal__signs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin-top: clamp(2rem, 4vw, 3rem); }
.sign {
  display: grid; grid-template-rows: auto 1fr auto; gap: 1.25rem;
  padding: clamp(1.5rem, 3vw, 2.25rem); min-height: 15rem;
  background: var(--forest); color: #fff; text-decoration: none; --focus: var(--signal);
  border-radius: var(--radius);
  transition: background-color 0.25s var(--ease);
}
.sign:hover { background: var(--brand); }
.sign svg.ic { width: 2.5rem; height: 2.5rem; color: var(--signal); }
.sign h3 { font-size: clamp(1.625rem, 2.6vw, 2.25rem); }
.sign p { color: var(--on-dark-soft); margin-top: 0.5rem; max-width: 40ch; }
.sign:hover p { color: var(--on-brand-soft); }
.sign .go { display: inline-flex; align-items: center; gap: 0.6rem; font: 650 0.875rem/1 var(--sans); letter-spacing: 0.08em; text-transform: uppercase; }
.sign .go svg { width: 1.25rem; height: 1.25rem; transition: transform 0.25s var(--ease); }
.sign:hover .go svg { transform: translateX(5px); }

/* ---------- Arriendo ---------- */
.arriendo { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; }
.arriendo h2 { font-size: clamp(2.25rem, 5vw, 4.5rem); line-height: 1.04; }
.arriendo__side p { color: var(--on-dark-soft); }
.arriendo__side .btn { margin-top: 1.5rem; }
.arriendo__by { display: flex; align-items: center; gap: 1rem; margin-top: 2rem; }
.arriendo__by img { width: auto; height: 1.75rem; }
.arriendo__by span { font-size: 0.875rem; color: var(--on-dark-soft); }

/* ---------- Pie ---------- */
.foot { background: var(--forest-950); color: #fff; padding-block: clamp(3rem, 6vw, 4.5rem) 2rem; --focus: var(--signal); }
.foot__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(0, 1fr)); gap: 2.5rem; }
.foot img.logo { width: auto; height: 3.25rem; }
.foot h2 { font: 650 0.78rem/1 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--on-dark-soft); margin-bottom: 1rem; }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.foot a { text-decoration: none; }
.foot a:hover { text-decoration: underline; }
.foot address { font-style: normal; color: var(--on-dark-soft); margin-top: 1.25rem; }
.foot__base { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.14); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; font-size: 0.875rem; color: var(--on-dark-soft); }
.foot__base img { width: auto; height: 1.5rem; }

/* ---------- Páginas interiores ---------- */
.page-head { background: var(--forest); color: #fff; padding-block: clamp(3rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem); --focus: var(--signal); }
.page-head h1 { font-size: clamp(2.5rem, 5.2vw, 4.75rem); line-height: 1.04; letter-spacing: -0.02em; }
.page-head p { margin-top: 1.5rem; max-width: 58ch; color: var(--on-dark-soft); font-size: 1.1875rem; }

/* Cabecera con foto de fondo: la foto a todo el ancho y un velo verde que oscurece el lado del texto */
.page-head--imagen { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(4rem, 9vw, 8rem) clamp(3rem, 6vw, 5rem); }
.page-head__fondo { position: absolute; inset: 0; z-index: -1; margin: 0; }
.page-head__fondo img { width: 100%; height: 100%; object-fit: cover; }
.page-head__fondo::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(1, 42, 45, 0.94) 0%, rgba(1, 42, 45, 0.82) 42%, rgba(1, 42, 45, 0.38) 100%),
    linear-gradient(0deg, rgba(1, 42, 45, 0.55) 0%, rgba(1, 42, 45, 0) 45%);
}
/* Documentos lleva el índice de secciones a la derecha: velo parejo para que también se lea */
.page-head--imagen-densa .page-head__fondo::after { background: linear-gradient(90deg, rgba(1, 42, 45, 0.94) 0%, rgba(1, 42, 45, 0.8) 55%, rgba(1, 42, 45, 0.72) 100%); }
.page-head__fondo--documentos img { object-position: 50% 40%; }
/* Foto de la web original (WordPress): evacuación por la escalera */
.page-head__fondo--emergencia img { object-position: 50% 50%; }
.page-head__fondo--efemerides img { object-position: 60% 40%; }
@media (max-width: 46rem) {
  .page-head__fondo::after { background: linear-gradient(0deg, rgba(1, 42, 45, 0.95) 0%, rgba(1, 42, 45, 0.78) 60%, rgba(1, 42, 45, 0.6) 100%); }
}

.toolbar { display: grid; grid-template-columns: minmax(0, 24rem) 1fr; gap: 1.25rem 2rem; align-items: center; padding-block: 1.75rem; }
.search { position: relative; }
.search svg { position: absolute; left: 1rem; top: 50%; width: 1.25rem; height: 1.25rem; transform: translateY(-50%); color: var(--brand); pointer-events: none; }
.search input {
  width: 100%; padding: 0.95rem 1rem 0.95rem 3rem;
  font: 500 1rem var(--sans); color: var(--ink);
  background: #fff; border: 2px solid var(--line); border-radius: var(--radius);
  transition: border-color 0.2s var(--ease);
}
.search input::placeholder { color: var(--ink-soft); opacity: 0.85; }
.search input:hover { border-color: var(--mint); }
.search input:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; border-color: var(--brand); }
.chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chip {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.6rem 0.95rem; border-radius: var(--radius);
  background: transparent; color: var(--ink); border: 2px solid var(--line);
  font: 700 0.875rem/1 var(--sans); cursor: pointer;
  transition: background-color 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.chip:hover { border-color: var(--brand); }
.chip[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
.chip .n { font-variant-numeric: tabular-nums; opacity: 0.75; font-weight: 600; }
.status { min-height: 1.5rem; color: var(--ink-soft); font-size: 0.9375rem; }

.group { margin-top: clamp(2rem, 4vw, 3rem); }
.group[hidden] { display: none; }
.group__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-bottom: 0.9rem; border-bottom: 3px solid var(--brand); }
.group__head h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -0.01em; }
.group__head .count { white-space: nowrap; flex: none; font: 700 0.875rem var(--sans); color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.docs { list-style: none; margin: 0; padding: 0; }
.docs li[hidden] { display: none; }
.doc {
  display: grid; grid-template-columns: minmax(0, 1fr) auto 2.25rem; gap: 1.5rem; align-items: center;
  padding: 1.1rem 0.5rem; margin-inline: -0.5rem; text-decoration: none;
  border-radius: var(--radius);
  background: linear-gradient(var(--line), var(--line)) bottom center / calc(100% - 1rem) 1px no-repeat;
  transition: background-color 0.2s var(--ease);
}
.doc:hover { background-color: var(--sage-100); }
.doc__name { font-weight: 700; line-height: 1.35; }
.doc__note { display: block; margin-top: 0.15rem; font-weight: 400; font-size: 0.9375rem; color: var(--ink-soft); }
.doc__meta { font: 600 0.875rem var(--sans); color: var(--ink-soft); white-space: nowrap; font-variant-numeric: tabular-nums; }
.doc__go { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--brand); color: #fff; transition: background-color 0.2s var(--ease), transform 0.25s var(--ease); }
.doc__go svg { width: 1.125rem; height: 1.125rem; }
.doc:hover .doc__go { background: var(--forest); transform: translate(2px, -2px); }
.empty { padding: 2.5rem 0; color: var(--ink-soft); }

.archive { margin-top: clamp(3rem, 6vw, 5rem); background: var(--sage-100); border-radius: var(--radius); }
.archive summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.5rem; font: 650 1.0625rem var(--sans); border-radius: var(--radius); }
.archive summary::-webkit-details-marker { display: none; }
.archive summary .plus { width: 1.25rem; height: 1.25rem; transition: transform 0.3s var(--ease); flex: none; }
.archive[open] summary .plus { transform: rotate(45deg); }
.archive__body { padding: 0 1.5rem 1.5rem; }
.archive__body > p { color: var(--ink-soft); max-width: 62ch; margin-bottom: 1rem; }

.modes { display: grid; margin-top: clamp(2rem, 4vw, 3rem); }
.mode { display: grid; grid-template-columns: 7rem minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(1.25rem, 3vw, 3rem); align-items: center; padding: clamp(1.5rem, 3vw, 2.25rem) 0; border-top: 1px solid var(--line); }
.mode:last-child { border-bottom: 1px solid var(--line); }
.mode__icon { display: grid; place-items: center; width: 7rem; height: 7rem; background: var(--brand); color: #fff; border-radius: var(--radius); }
.mode__icon svg { width: 4.25rem; height: 4.25rem; }
.mode h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.mode p { margin-top: 0.5rem; color: var(--ink-soft); }
.mode .docs .doc { padding-block: 0.9rem; margin-inline: 0; padding-inline: 0; }
.mode .docs li:first-child .doc { border-top: 1px solid var(--line); }
.sos { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1.5rem; margin-top: clamp(2.5rem, 5vw, 4rem); padding: clamp(1.5rem, 3vw, 2.25rem); background: var(--forest); color: #fff; border-radius: var(--radius); --focus: var(--signal); }
.sos h2 { font-size: clamp(1.5rem, 2.6vw, 2.125rem); }
.sos p { color: var(--on-dark-soft); margin-top: 0.4rem; }

/* Página 404: la misma ficha de vidrio del acceso a la Intranet (.acceso), más ancha y con titular mayor */
.notfound .acceso__ficha { width: min(40rem, 100%); gap: 1.5rem; }
.acceso.notfound h1 { font-size: clamp(2.25rem, 4.6vw, 3.75rem); line-height: 1.05; }
.notfound .acceso__intro { font-size: 1.125rem; }
.notfound__links { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.notfound .btn--line { color: #fff; border-color: currentColor; }
.notfound .btn--line:hover { background: #fff; color: var(--forest-950); border-color: #fff; }
.notfound__mas { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.22); font-weight: 600; }
.notfound__mas a { text-decoration: none; }
.notfound__mas a:hover { color: var(--signal); }
@media (max-width: 46rem) { .notfound__links .btn { width: 100%; justify-content: center; } }
.page-head .btn--line { color: #fff; border-color: currentColor; }
.page-head .btn--line:hover { background: #fff; color: var(--forest-950); border-color: #fff; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.sec--tight { padding-block: 1rem clamp(4rem, 8vw, 7rem); }

/* ---------- Intranet: acceso con clave (ficha de vidrio sobre la portada desenfocada) ---------- */
.acceso {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: calc(100svh - var(--bar-h) - 3px);
  display: grid; place-items: center;
  padding: clamp(2.5rem, 7vw, 5rem) var(--gutter);
  background: var(--forest-950);
}
.acceso__foto { position: absolute; inset: 0; z-index: -2; margin: 0; }
.acceso__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.acceso::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(1, 42, 45, 0.9); }
.acceso__ficha {
  width: min(28rem, 100%);
  padding: clamp(2rem, 4vw, 2.75rem) clamp(1.5rem, 4vw, 2.5rem);
  border-radius: var(--radius);
  background: rgba(1, 42, 45, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.26);
  box-shadow: 0 32px 80px rgba(1, 42, 45, 0.45);
  display: grid; gap: 1.25rem;
  animation: accesoIn 0.5s var(--ease) both;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .acceso::before { background: rgba(1, 42, 45, 0.55); -webkit-backdrop-filter: blur(22px) brightness(0.95); backdrop-filter: blur(22px) brightness(0.95); }
  .acceso__ficha { background: rgba(255, 255, 255, 0.08); -webkit-backdrop-filter: blur(24px) brightness(1.04); backdrop-filter: blur(24px) brightness(1.04); }
}
.acceso__kicker { display: flex; align-items: center; gap: 0.55rem; font: 650 0.75rem/1 var(--sans); letter-spacing: 0.16em; text-transform: uppercase; color: var(--signal); }
.acceso__kicker svg { width: 1.05rem; height: 1.05rem; }
.acceso h1 { font-size: clamp(1.875rem, 3.4vw, 2.5rem); line-height: 1.08; letter-spacing: -0.02em; }
.acceso h1 em { font-style: italic; color: var(--signal); }
.acceso__intro { color: var(--on-dark-soft); font-size: 0.975rem; line-height: 1.6; }
.acceso__form { display: grid; gap: 1.1rem; margin-top: 0.25rem; }
.campo { display: grid; gap: 0.5rem; }
.campo label { font: 650 0.72rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-brand-soft); }
.campo input {
  width: 100%; padding: 0.9rem 1rem;
  font: 500 1rem/1.2 var(--sans); color: #fff; caret-color: var(--signal);
  background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.32); border-radius: var(--radius);
  transition: border-color 0.2s var(--ease), background-color 0.2s var(--ease);
}
.campo input:hover { border-color: rgba(255, 255, 255, 0.55); }
.campo input:focus { border-color: var(--signal); background: rgba(255, 255, 255, 0.11); }
.campo input:-webkit-autofill { -webkit-text-fill-color: #fff; box-shadow: 0 0 0 100px #1d4a47 inset; caret-color: var(--signal); }
.campo__clave { position: relative; }
.campo__clave input { padding-right: 5.5rem; }
.campo__ver {
  position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%);
  padding: 0.5rem 0.7rem; border: 0; border-radius: 3px; background: transparent; cursor: pointer;
  font: 700 0.78rem/1 var(--sans); letter-spacing: 0.04em; color: var(--on-brand-soft);
}
.campo__ver:hover { color: #fff; background: rgba(255, 255, 255, 0.1); }
.acceso__entrar { width: 100%; justify-content: center; margin-top: 0.4rem; padding-block: 1rem; }
.acceso__msg { padding: 0.8rem 1rem; border-radius: var(--radius); border: 1px solid; font-size: 0.925rem; line-height: 1.45; }
.acceso__msg--error { border-color: #ff9a8a; background: rgba(255, 110, 90, 0.14); color: #fff; }
.acceso__msg--info { border-color: var(--signal); background: rgba(23, 232, 143, 0.1); color: #fff; }
.acceso__pie { padding-top: 1.1rem; border-top: 1px solid rgba(255, 255, 255, 0.16); font-size: 0.875rem; color: var(--on-dark-soft); }
.acceso__pie a, .acceso__olvido { color: #fff; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.4); text-underline-offset: 0.22em; }
.acceso__pie a:hover, .acceso__olvido:hover { text-decoration-color: var(--signal); }
.acceso__olvido { justify-self: center; font-size: 0.875rem; }
.acceso__intro b { color: #fff; font-weight: 600; overflow-wrap: anywhere; }
@keyframes accesoIn { from { opacity: 0; transform: translateY(14px) scale(0.985); } to { opacity: 1; transform: none; } }

/* Barra de sesión en la Intranet */
.sesion { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.5rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.16); color: var(--on-dark-soft); font-size: 0.95rem; }
.sesion__quien { display: inline-flex; align-items: center; gap: 0.55rem; }
.sesion__quien svg { width: 1rem; height: 1rem; color: var(--signal); }
.sesion__quien b { color: #fff; font-weight: 700; }
.sesion form { margin: 0; }
.sesion .btn { padding: 0.65rem 1.1rem; font-size: 0.875rem; background: transparent; }
.sesion .btn:hover { background: #fff; color: var(--forest-950); border-color: #fff; }

/* ---------- Pantalla de carga: cortina de vidrio (primera página de cada visita; ver js/carga.js) ---------- */
.carga { display: none; }
.con-carga .carga { display: block; position: fixed; inset: 0; z-index: 200; cursor: progress; }
.carga-bloqueo { overflow: hidden; }
.carga__hoja {
  position: absolute; left: 0; right: 0; height: 50.2%;
  background: rgba(1, 42, 45, 0.96);
  transition: transform 0.9s var(--ease), opacity 0.4s var(--ease) 0.45s;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .carga__hoja { background: rgba(1, 42, 45, 0.55); -webkit-backdrop-filter: blur(22px) brightness(0.95); backdrop-filter: blur(22px) brightness(0.95); }
}
.carga__hoja--t { top: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
.carga__hoja--b { bottom: 0; border-top: 1px solid rgba(255, 255, 255, 0.3); }
.carga__marca {
  position: absolute; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -50%);
  display: grid; gap: 1.2rem; justify-items: center;
  animation: cargaIn 0.8s var(--ease) both; transition: opacity 0.4s var(--ease);
}
.carga__logo { width: min(13rem, 46vw); height: auto; }
.carga__barra { display: block; width: min(15rem, 52vw); height: 2px; background: rgba(255, 255, 255, 0.22); overflow: hidden; }
.carga__barra i { display: block; height: 100%; background: var(--signal); transform: scaleX(0); transform-origin: 0 50%; animation: cargaLlenar 0.95s var(--ease) both; }
.carga.is-out { cursor: auto; pointer-events: none; }
.carga.is-out .carga__hoja { opacity: 0; } /* se desvanecen mientras se abren: aunque el móvil trabe el desenfoque, no queda velo */
.carga.is-out .carga__hoja--t { transform: translateY(-100%); }
.carga.is-out .carga__hoja--b { transform: translateY(100%); }
.carga.is-out .carga__marca { animation: cargaOut 0.35s var(--ease) forwards; } /* con animación: la de entrada (fill "both") fija la opacidad en 1 y una simple opacity: 0 no la vence */
@keyframes cargaIn { from { opacity: 0; transform: translate(-50%, calc(-50% + 14px)) scale(0.985); } to { opacity: 1; transform: translate(-50%, -50%); } }
@keyframes cargaOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes cargaLlenar { 0% { transform: scaleX(0); } 55% { transform: scaleX(0.62); } 100% { transform: scaleX(1); } }

/* ---------- Visor de documentos (visor.html; para celulares sin visor de PDF propio) ---------- */
.visor { background: #2b3b3a; min-height: 100vh; }
.visor__barra {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.6rem var(--gutter);
  background: var(--forest-950); color: #fff; --focus: var(--signal);
}
.visor__logo img { width: auto; height: 2.25rem; }
.visor__titulo {
  flex: 1; min-width: 0;
  font: 600 1rem/1.25 var(--sans); letter-spacing: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.visor__accion { flex: none; padding: 0.7rem 1rem; }
.visor__accion:hover svg { transform: none; }
.visor__cerrar {
  flex: none; display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem;
  background: transparent; color: #fff; border: 2px solid rgba(255, 255, 255, 0.5); border-radius: var(--radius); cursor: pointer;
}
.visor__cerrar:hover { border-color: #fff; }
.visor__cerrar svg { width: 1.375rem; height: 1.375rem; }
.visor__paginas { display: grid; gap: 0.75rem; justify-items: center; padding: 0.75rem 0.5rem 2rem; }
.visor__pagina { width: min(100%, 60rem); aspect-ratio: 210 / 297; background: #fff; box-shadow: 0 10px 24px -14px rgba(0, 0, 0, 0.6); }
.visor__pagina canvas { display: block; width: 100%; height: 100%; }
.visor__estado { margin: 3rem auto; padding: 0 var(--gutter); max-width: 32rem; text-align: center; color: #fff; }
.visor__estado a { color: var(--signal); font-weight: 700; }
@media (max-width: 46rem) {
  .visor__logo { display: none; }
  .visor__accion-texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .visor__accion { padding: 0.7rem; }
}

/* ---------- Responsive ---------- */
/* El menú pasa a hamburguesa antes que el resto del layout: sus cinco entradas no caben en una línea por debajo de ~1090px */
@media (max-width: 68rem) {
  .bar__toggle { display: inline-grid; }
  .bar__cta { display: none; }
  .gnav {
    position: fixed; left: 0; right: 0; bottom: 0; top: calc(var(--bar-h) + 3px);
    background: #fff; color: var(--ink); overflow-y: auto; display: none;
    padding: 0.5rem var(--gutter) 2.5rem;
  }
  .bar.is-menu-open .gnav { display: block; }
  html.menu-lock { overflow: hidden; }
  .gnav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .gnav__item { border-bottom: 1px solid var(--line); }
  .gnav__link { width: 100%; justify-content: space-between; padding: 1.15rem 0; font-size: 1.25rem; text-decoration: none; }
  .gnav__link.is-active, .gnav__link[aria-current="page"] { color: var(--brand); }
  .gnav__link svg { width: 1rem; height: 1rem; }
  .gnav__cta { display: block; border: 0; padding-top: 1.5rem; }
  .gnav__cta .btn { width: 100%; justify-content: center; background: #fff; color: var(--brand); border-color: var(--brand); }
  .gnav__cta .btn:hover { background: var(--brand); color: #fff; }
  .dd { position: static; visibility: visible; opacity: 1; transform: none; box-shadow: none; border: 0; display: none; transition: none; }
  .gnav__item.is-open .dd { display: block; }
  .dd__grid { width: 100%; grid-template-columns: 1fr; gap: 0; padding-block: 0.25rem 1.25rem; }
  .dd__title, .dd__text { display: none; }
  .dd__head { order: 2; padding-top: 0.5rem; }
  .dd__head .btn { margin-top: 0; width: 100%; justify-content: center; }
  .dd__groups { grid-template-columns: 1fr; gap: 1.25rem; }
  .scrim { display: none; }
}

@media (max-width: 62rem) {
  .alma__head, .alma__grid, .ficha, .ubic, .sost, .arriendo, .desc { grid-template-columns: 1fr; }
  .portal__signs { grid-template-columns: 1fr; }
  .alma__head { align-items: start; }
  .alma__items { grid-template-columns: 1fr; gap: 0; }
  .alma__item { padding-block: 1.5rem; }
  .alma__item:first-child { padding-top: 0; border-top: 0; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .foot__grid > :first-child { grid-column: 1 / -1; }
  .toolbar { grid-template-columns: 1fr; }
  .mode { grid-template-columns: 5.5rem 1fr; }
  .mode__icon { width: 5.5rem; height: 5.5rem; }
  .mode__icon svg { width: 3.5rem; height: 3.5rem; }
  .mode .docs { grid-column: 1 / -1; }
}

@media (max-width: 46rem) {
  .portal__signs { grid-template-columns: 1fr; }
  .ficha .row { grid-template-columns: 1fr; gap: 0.15rem; }
  .doc { grid-template-columns: minmax(0, 1fr) 2.25rem; gap: 0.5rem 1rem; }
  .doc__meta { grid-column: 1; grid-row: 2; }
  .doc__go { grid-column: 2; grid-row: 1 / 3; }
  .foot__grid { grid-template-columns: 1fr; }
  .sos { grid-template-columns: 1fr; }
}

/* =====================================================================
   Componentes propios de Rosario Norte
   ===================================================================== */

/* ---------- Sellos de certificación sobre la portada ---------- */
/* Son lo único, además de la franja de vidrio, que va sobre la foto: el cliente los quiere a la vista.
   Cada sello enlaza a su certificado. Se agregan o cambian en fuente/sitio.json. */
.hero__sellos { position: absolute; left: 0; right: 0; top: clamp(1.25rem, 3.5vw, 2.75rem); z-index: 1; }
.sellos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: clamp(0.5rem, 1.2vw, 0.9rem); }
.sellos a { display: block; border-radius: 50%; transition: transform 0.3s var(--ease); }
.sellos a:hover { transform: translateY(-3px) scale(1.04); }
.sellos img { width: auto; height: clamp(4.25rem, 7.4vw, 7.25rem); filter: drop-shadow(0 6px 14px rgba(1, 42, 45, 0.35)); }
.sellos--sost { margin-top: 2.5rem; }
.sellos--sost img { height: clamp(4rem, 6vw, 5.5rem); filter: none; }

/* Sellos de la portada, en grande (máx. ~10rem: los PNG recortados miden ~180–200px) */
.sellos.sellos--grande { gap: clamp(0.6rem, 1.4vw, 1.1rem); }
.sellos.sellos--grande img { height: clamp(5.5rem, 10.5vw, 10rem); }
@media (max-width: 62rem) {
  .sellos.sellos--grande img { height: clamp(4.25rem, 19vw, 6.5rem); }
}

/* Portada: sellos en columna dentro de un panel de vidrio a la izquierda (misma receta que la franja).
   El alto de cada sello se calcula para que los 4, con su separación, quepan sobre la franja (--franja lo mide js/main.js). */
.hero__panel { left: clamp(0.75rem, 2vw, 2rem); right: auto; width: max-content; top: clamp(0.75rem, 2vw, 1.5rem); padding: 1rem 0.9rem 0.6rem; border-radius: var(--radius); background: rgba(1, 42, 45, 0.72); border: 1px solid rgba(255, 255, 255, 0.22); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hero__panel { background: rgba(1, 42, 45, 0.42); -webkit-backdrop-filter: blur(14px) brightness(0.9); backdrop-filter: blur(14px) brightness(0.9); }
}
.hero__panel-t { margin-bottom: 0.6rem; font: 650 0.72rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-brand-soft); text-align: center; }
.sellos.sellos--panel { flex-direction: column; align-items: center; gap: clamp(0.6rem, 1.6vh, 1.1rem); }
.sellos.sellos--panel img { height: min(8rem, calc((100svh - var(--bar-h) - var(--franja, 11.5rem) - 9rem) / 4)); filter: none; }

@media (max-width: 62rem) {
  .hero__panel { left: 0.75rem; top: 0.75rem; padding: 0.6rem 0.6rem 0.5rem; }
  .hero__panel-t { font-size: 0.6rem; }
  .sellos.sellos--panel { flex-direction: row; gap: 0.35rem; }
  .sellos.sellos--panel img { height: clamp(3.5rem, 15vw, 5rem); }
}
}

/* ---------- Respuesta al pulsar (todo lo pulsable confirma el toque) ---------- */
.chip, .pill, a.mes, .lightbox__btn, .bar__toggle, .campo__ver { transition-property: background-color, color, border-color, transform; transition-duration: 0.2s, 0.2s, 0.2s, 0.16s; transition-timing-function: var(--ease); }
.chip:active, .pill:active, a.mes:active, .lightbox__btn:active, .bar__toggle:active, .campo__ver:active { transform: scale(0.97); }
.video__boton { transition: transform 0.16s var(--ease); }
.video__boton:active { transform: scale(0.99); }

/* ---------- Visor de fotos: entra suave (opacidad + escala desde 0.96), sale más rápido ---------- */
.lightbox[open] { animation: lightboxIn 0.22s var(--ease); }
.lightbox[open]::backdrop { animation: lightboxVelo 0.22s var(--ease); }
@keyframes lightboxIn { from { opacity: 0; } }
@keyframes lightboxVelo { from { opacity: 0; } }
.lightbox[open] .lightbox__fig img { animation: lightboxFoto 0.22s var(--ease); }
@keyframes lightboxFoto { from { opacity: 0; transform: scale(0.96); } }

/* ---------- Aviso bajo la portada (protocolo de reciclaje) ---------- */
/* Cinta del protocolo de reciclaje: corre hacia la izquierda sin fin (dos grupos idénticos, se desplaza -50%) y se detiene al pasar el mouse o al enfocarla */
.aviso { display: block; overflow: hidden; background: var(--forest); color: #fff; text-decoration: none; border-block: 1px solid var(--brand-deep); transition: background-color 0.2s var(--ease); }
.aviso:hover { background: var(--brand-deep); }
.aviso__cinta { display: flex; width: max-content; animation: aviso-corre 38s linear infinite; }
.aviso:hover .aviso__cinta, .aviso:focus-visible .aviso__cinta { animation-play-state: paused; }
.aviso__grupo { display: flex; flex: none; }
.aviso__item { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.95rem 1.75rem 0.95rem 0; white-space: nowrap; font-size: 1rem; }
.aviso__item::after { content: ""; width: 0.375rem; height: 0.375rem; margin-left: 1rem; border-radius: 50%; background: var(--signal); }
.aviso__item > svg { flex: none; width: 1.375rem; height: 1.375rem; color: var(--signal); }
.aviso b { font: 650 0.9375rem/1 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; color: var(--signal); }
.aviso__go { display: inline-flex; align-items: center; gap: 0.45rem; font: 650 0.8125rem/1 var(--sans); letter-spacing: 0.08em; text-transform: uppercase; color: #fff; text-decoration: underline; text-decoration-color: rgb(255 255 255 / 0.4); text-underline-offset: 0.3em; }
.aviso__go svg { width: 1.125rem; height: 1.125rem; }
@keyframes aviso-corre { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- El edificio: texto + foto, cifras ---------- */
/* Dos columnas parejas: el texto (con su título) a la izquierda y la foto a toda la altura del texto a la derecha */
.desc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: stretch; }
.desc__head { margin-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.desc__head .alma__lead { margin-top: 1rem; }
.desc__texto p { color: var(--ink-soft); max-width: none; }
.desc__texto p + p { margin-top: 1.1rem; }
.desc__foto { position: relative; margin: 0; min-height: 26rem; border-radius: var(--radius); overflow: hidden; background: var(--sage-100); }
.desc__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 78% 50%; }
/* Cifras: el número cuenta hacia arriba al aparecer y una barra muestra la proporción del ahorro */
.cifras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem clamp(1.5rem, 4vw, 3rem); margin: clamp(2rem, 4vw, 2.75rem) 0 0; padding-top: 1.75rem; border-top: 1px solid var(--line); }
.cifras dt { font: 400 clamp(2.75rem, 5vw, 4rem)/1 var(--serif); letter-spacing: -0.02em; color: var(--brand); font-variant-numeric: tabular-nums; }
.cifras dd { margin: 0.5rem 0 0; font: 650 0.78rem/1.3 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--ink-soft); }
.cifras__barra { display: block; height: 4px; margin-top: 0.9rem; border-radius: 2px; background: var(--sage-100); overflow: hidden; position: relative; }
.cifras__barra::after { content: ""; position: absolute; inset: 0; background: var(--brand); transform-origin: left; transform: scaleX(var(--v, 0)); }
.cifras__barra--30 { --v: 0.3; }
.cifras__barra--35 { --v: 0.35; }
.cifras.es-espera .cifras__barra::after { transform: scaleX(0); }
.cifras.es-cuenta .cifras__barra::after { transition: transform 1.4s cubic-bezier(0.23, 1, 0.32, 1); }

/* Características: dos datos clave junto al título y una tarjeta por característica (foto + título + descripción) */
.ficha { align-items: end; }
.ficha__claves { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem clamp(1.5rem, 4vw, 3rem); }
.ficha__claves > div { padding-top: 1.1rem; border-top: 2px solid var(--brand); }
.ficha__claves dt { font: 650 0.75rem/1.3 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft); padding: 0; }
.ficha__claves dd { margin: 0.45rem 0 0; font: 400 clamp(1.75rem, 3vw, 2.5rem)/1.05 var(--serif); letter-spacing: -0.015em; color: var(--brand); }
.rasgos { list-style: none; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.4vw, 2rem) clamp(1rem, 2vw, 1.5rem); }
/* "Vidrio que se despliega": la foto completa con el título en una franja de vidrio esmerilado (texto blanco);
   al pasar el mouse o llegar con el teclado, el vidrio sube y aparece la descripción. En pantallas táctiles se ve siempre. */
.rasgo { position: relative; isolation: isolate; aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden; background: var(--forest-950); outline: none; }
.rasgo:focus-visible { box-shadow: 0 0 0 3px var(--signal); }
.rasgo__img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease); }
.rasgo__vidrio { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 1.1rem 1.25rem 1.25rem; color: #fff; background: rgba(1, 42, 45, 0.82); border-top: 1px solid rgba(255, 255, 255, 0.22); }
@media (hover: hover) and (pointer: fine) {
  /* La descripción se despliega animando la altura de la fila (0fr → 1fr): rápido al abrir, sin saltos */
  .rasgo__mas { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.28s cubic-bezier(0.23, 1, 0.32, 1); }
  .rasgo__mas > p { overflow: hidden; min-height: 0; opacity: 0; transition: opacity 0.2s ease; }
  .rasgo:hover .rasgo__mas, .rasgo:focus-within .rasgo__mas { grid-template-rows: 1fr; }
  .rasgo:hover .rasgo__mas > p, .rasgo:focus-within .rasgo__mas > p { opacity: 1; }
  .rasgo__vidrio h4::after { content: " +"; opacity: 0.7; }
  .rasgo:hover .rasgo__vidrio h4::after, .rasgo:focus-within .rasgo__vidrio h4::after { content: ""; }
}
@media (prefers-reduced-motion: reduce) { .rasgo__mas, .rasgo__mas > p { transition: none !important; } }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .rasgo__vidrio { background: rgba(1, 42, 45, 0.6); -webkit-backdrop-filter: blur(18px) saturate(1.25) brightness(0.62); backdrop-filter: blur(18px) saturate(1.25) brightness(0.62); }
}
.rasgo__vidrio h4 { margin: 0; font: 650 0.8rem/1.3 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; color: #fff; }
.rasgo__vidrio p { margin: 0.55rem 0 0; color: rgba(255, 255, 255, 0.9); font-size: 0.95rem; line-height: 1.55; }
@media (hover: hover) and (pointer: fine) { .rasgo:hover .rasgo__img { transform: scale(1.035); } }
@media (prefers-reduced-motion: reduce) { .rasgo__img { transition: none; } .rasgo:hover .rasgo__img { transform: none; } }
@media (max-width: 62rem) { .rasgos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 34rem) { .rasgos { grid-template-columns: 1fr; } .ficha__claves { grid-template-columns: 1fr 1fr; } }

/* ---------- Galerías (edificio y efemérides) ---------- */
.galeria { list-style: none; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(0.5rem, 1.2vw, 1rem); }
.galeria a { display: block; overflow: hidden; border-radius: var(--radius); background: var(--forest); }
.galeria img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 0.3s var(--ease), opacity 0.2s var(--ease); }
.galeria a:hover img { transform: scale(1.04); opacity: 0.92; }
.galeria--efe { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 1.25rem; }

.lightbox { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(1, 42, 45, 0.94); color: #fff; --focus: var(--signal); }
.lightbox::backdrop { background: rgba(1, 42, 45, 0.6); }
.lightbox__fig { margin: 0; height: 100%; display: grid; grid-template-rows: 1fr auto; place-items: center; padding: 4.5rem clamp(3.5rem, 8vw, 6rem) 1.25rem; }
.lightbox__fig img { max-width: 100%; max-height: calc(100vh - 8rem); width: auto; height: auto; object-fit: contain; border-radius: var(--radius); }
.lightbox__fig figcaption { padding-top: 0.9rem; font-size: 0.9375rem; color: var(--on-dark-soft); text-align: center; }
.lightbox__btn { position: absolute; display: grid; place-items: center; width: 3rem; height: 3rem; border: 2px solid rgba(255, 255, 255, 0.5); border-radius: var(--radius); background: rgba(1, 42, 45, 0.5); color: #fff; cursor: pointer; transition: border-color 0.2s var(--ease), background-color 0.2s var(--ease); }
.lightbox__btn:hover { border-color: #fff; background: rgba(1, 42, 45, 0.85); }
.lightbox__btn svg { width: 1.5rem; height: 1.5rem; }
.lightbox__cerrar { top: 1rem; right: 1rem; }
.lightbox__prev, .lightbox__next { top: 50%; transform: translateY(-50%); }
.lightbox__prev { left: 1rem; }
.lightbox__next { right: 1rem; }

/* ---------- Pie: redes ---------- */
.foot__redes { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.5rem; }
.foot__redes a { color: #fff; font-weight: 600; }

/* ---------- Biblioteca: bloques, años y series mensuales ---------- */
.bloques { list-style: none; margin: 0; padding: 0; }
.bloque { padding: clamp(1.4rem, 2.5vw, 1.9rem) 0; border-bottom: 1px solid var(--line); }
.bloque[hidden] { display: none; }
.bloque__head h3 { font: 650 1.1875rem/1.3 var(--sans); letter-spacing: -0.005em; }
.bloque__head p { margin-top: 0.3rem; color: var(--ink-soft); max-width: 70ch; }
.bloque .docs, .bloque .pills, .bloque .serie, .bloque .subs, .bloque .links { margin-top: 1rem; }
.bloque .docs--uno { margin-top: 0; }
.bloque .docs--uno .doc, .bloque .docs li:last-child .doc { background-image: none; }
.bloque .docs:first-child { margin-top: 0; }
.serie__extras--solo { grid-column: 2; }
.bloque .docs--uno .doc__name { font-size: 1.1875rem; font-weight: 650; }

.pills { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pill {
  display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0.5rem 1rem;
  font: 700 0.9375rem/1 var(--sans); font-variant-numeric: tabular-nums; color: var(--ink); text-decoration: none;
  background: #fff; border: 2px solid var(--line); border-radius: var(--radius);
  transition: background-color 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.pill:hover { background: var(--brand); border-color: var(--brand); color: #fff; }

/* Serie mensual: una fila por año con los 12 meses */
.serie { display: grid; gap: 0.5rem; }
.serie__fila { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: 0.5rem 1rem; align-items: center; }
.serie__anio { font: 650 1rem/1 var(--sans); font-variant-numeric: tabular-nums; color: var(--brand); }
.serie__meses { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0.35rem; }
.mes {
  display: grid; place-items: center; min-height: 2.5rem; padding: 0.25rem;
  font: 700 0.875rem/1 var(--sans); color: var(--ink); text-decoration: none;
  background: #fff; border: 2px solid var(--line); border-radius: var(--radius);
  transition: background-color 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease);
}
a.mes:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.mes--vacio { background: transparent; border: 1px dashed var(--line); color: #9fb2ab; font-weight: 600; }
.serie__extras { grid-column: 2; display: flex; flex-wrap: wrap; gap: 0.35rem; }
.serie__extras .pill { min-height: 2.1rem; padding: 0.4rem 0.8rem; font-size: 0.8125rem; }

/* Subcarpetas (arrendatarios, proveedores, servicios) */
.subs { display: grid; gap: 0.5rem; }
.sub { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.sub[hidden] { display: none; }
.sub summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 0.5rem 1rem; flex-wrap: wrap; padding: 1rem 1.25rem; border-radius: var(--radius); }
.sub summary::-webkit-details-marker { display: none; }
.sub summary:hover { background: var(--sage-100); }
.sub__nombre { font-weight: 650; }
.sub__meta { font-size: 0.875rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.sub summary .plus { width: 1.25rem; height: 1.25rem; margin-left: auto; flex: none; color: var(--brand); transition: transform 0.2s var(--ease); }
.sub[open] > summary .plus { transform: rotate(45deg); }
.sub__body { padding: 0 1.25rem 1.25rem; }
.sub__body > .serie, .sub__body > .docs { margin-top: 0; }

.links--claro a { color: var(--ink); border-bottom-color: var(--brand); }

/* ---------- Plan de emergencia ---------- */
.recursos { display: grid; gap: 0; }
.recurso { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 5vw, 4rem); align-items: center; padding-block: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); }
.recurso:first-child { padding-top: 1rem; }
.recurso figure { margin: 0; }
.recurso img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius); }
.recurso h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.recurso p { margin-top: 0.75rem; color: var(--ink-soft); max-width: 58ch; }
.recurso .btn { margin-top: 1.5rem; }
.recurso__meta { display: block; margin-top: 0.75rem; font: 600 0.875rem var(--sans); color: var(--ink-soft); }

.videos__intro { margin-top: 0.75rem; color: var(--ink-soft); font-size: 0.9375rem; }
.videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 3vw, 2rem); margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.video { margin: 0; }
.video__boton, .video__marco { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius); }
.video__boton { position: relative; padding: 0; overflow: hidden; cursor: pointer; background: var(--forest); }
.video__boton img { width: 100%; height: 100%; object-fit: cover; opacity: 0.85; transition: opacity 0.2s var(--ease), transform 0.3s var(--ease); }
.video__boton:hover img { opacity: 1; transform: scale(1.03); }
.video__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: var(--signal); color: var(--forest-950); box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.6); }
.video__play svg { width: 2rem; height: 2rem; margin-left: 0.2rem; }
.video figcaption { margin-top: 0.75rem; color: var(--ink-soft); }
.video figcaption b { color: var(--ink); }

/* ---------- Efemérides ---------- */
.actividad { padding-block: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); }
.actividad:first-child { padding-top: 1rem; }
.actividad__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.5rem 1.5rem; padding-bottom: 0.9rem; border-bottom: 3px solid var(--brand); }
.actividad__head h2 { font-size: clamp(1.625rem, 2.8vw, 2.25rem); }
.actividad__head span { font: 700 0.875rem var(--sans); color: var(--ink-soft); }

/* ---------- Documentos: portada con una fila por sección ---------- */
/* Filas editoriales a todo el ancho (foto + texto, alternadas), no tarjetas: cada sección es un destino con su foto. */
/* Cada sección en su banda: fondo alternado (salvia 50 / salvia 100) y aire generoso entre una y otra */
.banda { background: var(--sage-50); padding-block: clamp(3.5rem, 7vw, 6.5rem); }
.banda--alt { background: var(--sage-100); }
.banda + .banda { border-top: 1px solid var(--line); }
.seccion { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.banda--alt .seccion__temas li, .banda--alt .seccion__temas li:last-child { border-color: #cfdcd5; }
.seccion--inv .seccion__foto { order: 2; }
.seccion__foto { position: relative; display: block; overflow: hidden; border-radius: var(--radius); background: var(--forest); }
.seccion__foto img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; transition: transform 0.35s var(--ease); }
.seccion:hover .seccion__foto img { transform: scale(1.035); }
.seccion h2 { font-size: clamp(2.25rem, 4vw, 3.5rem); line-height: 1.04; letter-spacing: -0.02em; }
.seccion h2 a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size 0.25s var(--ease); }
.seccion h2 a:hover { background-size: 100% 2px; }
.seccion__desc { margin-top: 1rem; color: var(--ink-soft); max-width: 48ch; }
.seccion__temas { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; }
.seccion__temas li { padding: 0.55rem 0; border-top: 1px solid var(--line); font-weight: 600; }
.seccion__temas li:last-child { border-bottom: 1px solid var(--line); }
.seccion__temas .seccion__mas { font-weight: 500; color: var(--ink-soft); }
.seccion__datos { display: flex; flex-wrap: wrap; gap: 0.75rem 2.5rem; margin: 1.5rem 0 0; }
.seccion__datos dt { font: 650 0.72rem/1.2 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; color: var(--brand); }
.seccion__datos dd { margin: 0.3rem 0 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.seccion .btn { margin-top: 1.75rem; }

/* Sellos sobre la foto de Certificados (portada de Documentos y cabecera de la sección) */
.sellos.sellos--foto { position: absolute; left: clamp(0.75rem, 2vw, 1.25rem); bottom: clamp(0.75rem, 2vw, 1.25rem); flex-wrap: nowrap; gap: 0.35rem; }
.sellos.sellos--foto img { height: clamp(2.75rem, 4.2vw, 4rem); }
/* Las reglas de la foto (.seccion__foto img / .page-head__foto img: ancho 100 %, 3:2, recorte y zoom al pasar el mouse)
   también alcanzan a los sellos: se anulan para que se vean enteros */
.seccion__foto .sellos--foto img, .page-head__foto .sellos--foto img { width: auto; aspect-ratio: auto; object-fit: contain; transform: none; transition: none; }

/* Índice de secciones en la cabecera de la portada de Documentos */
.page-head__grid--indice { align-items: end; }
.indice { display: grid; }
.indice a { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1rem; align-items: baseline; padding: 1rem 0; border-top: 1px solid rgba(255, 255, 255, 0.22); color: #fff; text-decoration: none; transition: color 0.2s var(--ease); }
.indice a:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.22); }
.indice__t { font: 400 clamp(1.375rem, 2vw, 1.75rem)/1.15 var(--serif); letter-spacing: -0.01em; }
.indice__n { font: 600 0.875rem var(--sans); color: var(--on-dark-soft); font-variant-numeric: tabular-nums; }
.indice svg { width: 1.25rem; height: 1.25rem; color: var(--signal); align-self: center; transition: transform 0.25s var(--ease); }
.indice a:hover { color: var(--signal); }
.indice a:hover svg { transform: translateX(4px); }

.recientes { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.recientes .lede { margin-top: 1rem; color: var(--ink-soft); }
.recientes .doc:hover { background-color: var(--sage-100); }

/* ---------- Documentos: página de una sección ---------- */
.page-head--foto { padding-block: clamp(2.5rem, 5vw, 4rem); }
.page-head__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.page-head__foto { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius); }
.page-head__foto img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
/* Cabeceras con foto (Documentos, sus secciones, Emergencia, Efemérides): todas de la misma altura, como las páginas
   interiores de cbre.cl, cuyo bloque de título y foto termina a 732 px (45,75rem) del borde superior. El contenido va abajo
   para que el título no salte al navegar; en pantallas bajas se acorta para que siempre asome el contenido. */
.page-head--imagen, .page-head--foto {
  display: grid; align-content: end;
  min-height: min(calc(45.75rem - var(--bar-h)), calc(100svh - var(--bar-h) - 7rem));
  padding-block: clamp(2.5rem, 5vw, 4rem);
}
@media (max-width: 46rem) { .page-head--imagen, .page-head--foto { min-height: 28rem; } }
/* Secciones de Documentos: la foto crece hasta llenar el alto de la cabecera (como la foto grande de cbre.cl) y el texto va abajo */
@media (min-width: 62.01rem) {
  .page-head--foto .page-head__grid { align-items: end; }
  .page-head--foto .page-head__foto { height: min(calc(45.75rem - var(--bar-h) - 8rem), calc(100svh - var(--bar-h) - 15rem)); }
  .page-head--foto .page-head__foto > img { height: 100%; aspect-ratio: auto; }
}
.migas { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: 1.25rem; font: 700 0.875rem/1 var(--sans); color: var(--on-dark-soft); }
.migas a { color: #fff; text-decoration: underline; text-decoration-color: var(--signal); text-decoration-thickness: 2px; }
.migas a:hover { color: var(--signal); }

.secnav { position: sticky; top: calc(var(--bar-h) + 3px); z-index: 20; background: #fff; border-bottom: 1px solid var(--line); }
.secnav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: clamp(1rem, 3vw, 2.5rem); overflow-x: auto; scrollbar-width: none; }
.secnav ul::-webkit-scrollbar { display: none; }
.secnav__link { display: inline-flex; align-items: center; gap: 0.5rem; padding: 1.1rem 0 0.95rem; white-space: nowrap; font: 700 0.9375rem/1 var(--sans); color: var(--ink-soft); text-decoration: none; border-bottom: 3px solid transparent; transition: color 0.2s var(--ease), border-color 0.2s var(--ease); }
a.secnav__link:hover { color: var(--ink); border-bottom-color: var(--line); }
.secnav__link[aria-current="page"] { color: var(--ink); border-bottom-color: var(--brand); }
.secnav .n { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-soft); }

.toolbar--sola { grid-template-columns: minmax(0, 30rem); }
.group--unica { margin-top: 0; }
.group--unica .group__head { justify-content: flex-end; border-bottom-width: 1px; border-bottom-color: var(--line); padding-bottom: 0.6rem; }

/* Bloques con miniatura */
.bloque--img { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); align-items: start; }
.bloque__img { margin: 0; overflow: hidden; border-radius: var(--radius); background: var(--sage-100); }
.bloque__img img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.bloque__body { min-width: 0; }

@media (max-width: 75rem) {
  .bar__nombre { display: none; }
}
@media (max-width: 62rem) {
  .seccion, .recientes, .page-head__grid { grid-template-columns: 1fr; }
  .seccion--inv .seccion__foto { order: 0; }
  .page-head__foto { max-width: 34rem; }
  .bloque--img { grid-template-columns: 7rem minmax(0, 1fr); }
}
@media (max-width: 46rem) {
  .bloque--img { grid-template-columns: 1fr; }
  .bloque__img { max-width: 12rem; }
  .bloque__img img { aspect-ratio: 16 / 9; }
  .toolbar--sola { grid-template-columns: 1fr; }
}
@media (max-width: 62rem) {
  .desc { grid-template-columns: 1fr; }
  .hero__sellos { top: 0.85rem; }
  .sellos img { height: clamp(3.5rem, 13vw, 5rem); }
  .serie__meses { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .recurso { grid-template-columns: 1fr; }
  .galeria--efe { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 46rem) {
  .rasgos, .galeria, .galeria--efe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .videos { grid-template-columns: 1fr; }
  .serie__fila { grid-template-columns: 1fr; }
  .serie__extras, .serie__extras--solo { grid-column: 1; }
  .lightbox__fig { padding-inline: 0.75rem; padding-bottom: 4.5rem; }
  .lightbox__prev, .lightbox__next { top: auto; bottom: 1rem; transform: none; }
  .lightbox__prev { left: calc(50% - 3.5rem); }
  .lightbox__next { right: calc(50% - 3.5rem); }
}

/* Los movimientos de hover (flechas que avanzan, fotos que se acercan, sellos que suben) son solo para mouse:
   en pantallas táctiles el hover se "pega" al tocar. */
@media (hover: none), (pointer: coarse) {
  .btn:hover svg, .dd__more:hover svg, .sign:hover .go svg, .doc:hover .doc__go, .sellos a:hover,
  .galeria a:hover img, .video__boton:hover img, .seccion:hover .seccion__foto img, .indice a:hover svg { transform: none; }
}

/* Movimiento reducido: sin desplazamientos ni escalas, pero se conservan los cambios de color y opacidad, que ayudan a entender */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-property: opacity, color, background-color, border-color, text-decoration-color !important; }
  .btn:hover svg, .dd__more:hover svg, .sign:hover .go svg, .doc:hover .doc__go, .sellos a:hover,
  .galeria a:hover img, .video__boton:hover img, .seccion:hover .seccion__foto img, .indice a:hover svg,
  .btn:active, .chip:active, .pill:active, a.mes:active, .lightbox__btn:active, .bar__toggle:active, .video__boton:active { transform: none; }
}

@media print {
  .carga, .bar, .scrim, .skip, .toolbar, .status, .archive summary .plus, .hero__glass { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .sec, .page-head { padding-block: 1rem; background: #fff !important; color: #000 !important; }
  .hero { height: auto; min-height: 0; }
  .hero__photo { position: static; }
  .hero__foto { position: static; opacity: 1; }
  .hero__foto:not(:first-child) { display: none; }
  .foot { background: #fff; color: #000; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- Intranet: herramienta de consulta ---------- */
/* Cabecera compacta: título y sesión en una línea; el buscador queda en la primera pantalla */
.page-head--intranet { padding-block: clamp(1.75rem, 3.5vw, 2.75rem); }
.page-head--intranet .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.page-head--intranet h1 { font-size: clamp(2rem, 3.6vw, 3rem); }
.page-head--intranet .sesion { margin-top: 0; padding-top: 0; border-top: 0; }

/* Coincidencias de la búsqueda: el mes o el documento pedido se marca dentro de su serie */
a.mes.es-coincidencia { background: var(--brand); border-color: var(--forest); color: #fff; box-shadow: 0 0 0 3px var(--mint); }
.doc.es-coincidencia { background-color: var(--sage-100); box-shadow: inset 0 0 0 2px var(--brand); }
.pill.es-coincidencia { background: var(--brand); border-color: var(--brand); color: #fff; }

/* Listas largas agrupadas por año */
.anios { display: grid; gap: 0.5rem; }
.anio { border-top: 1px solid var(--line); }
.anio:first-child { border-top: 0; }
.anio summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 0.75rem; padding: 0.85rem 0; }
.anio summary::-webkit-details-marker { display: none; }
.anio__nombre { font: 650 1rem/1 var(--sans); font-variant-numeric: tabular-nums; color: var(--brand); }
.anio__n { font-size: 0.875rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.anio summary .plus { width: 1.1rem; height: 1.1rem; margin-left: auto; align-self: center; flex: none; color: var(--brand); transition: transform 0.2s var(--ease); }
.anio[open] summary .plus { transform: rotate(45deg); }
.anio .docs { margin: 0 0 0.75rem; }

/* Fondo del acceso: el desenfoque va en la foto misma (agrandada más allá del borde), no en una capa encima:
   así el borde de la pantalla no queda nítido en los teléfonos */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .acceso::before { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .acceso__foto { inset: -3rem; }
  .acceso__foto img { filter: blur(22px) brightness(0.95); }
}

/* En el teléfono los filtros van en una sola fila deslizable en vez de ocupar media pantalla */
@media (max-width: 46rem) {
  .chips { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(-1 * var(--gutter)); padding: 0.25rem var(--gutter); scrollbar-width: none; scroll-snap-type: x proximity; }
  .chips::-webkit-scrollbar { display: none; }
  .chip { flex: none; scroll-snap-align: start; }
  .page-head--intranet .sesion { gap: 0.5rem 1rem; font-size: 0.875rem; }
}

/* =========================================================================
   Intranet por dentro: portada con la torre, paneles de color por sección
   y una página propia por empresa, proveedor o servicio
   ========================================================================= */
/* Barra clara (fondo blanco, logo verde) */
.bar--clara, .bar--clara.is-scrolled:not(.is-dd-open):not(.is-menu-open) { background: #fff; color: var(--ink); --focus: var(--brand); border-bottom: 1px solid var(--line); -webkit-backdrop-filter: none; backdrop-filter: none; }
.bar--clara .logo--light { opacity: 0; }
.bar--clara .logo--dark { opacity: 1; }
.bar--clara .gnav__link:hover, .bar--clara .gnav__link[aria-expanded="true"], .bar--clara .gnav__link.is-active, .bar--clara .gnav__link[aria-current="page"] { text-decoration-color: var(--brand); }
.bar--clara .bar__cta.btn--signal { background: var(--brand); color: #fff; border-color: var(--brand); }
.bar--clara .bar__cta.btn--signal:hover { background: var(--brand-deep); border-color: var(--brand-deep); color: #fff; }
.bar--clara .bar__progress { background: var(--sage-100); }
.bar--clara .bar__progress i { background: var(--brand); }

.isesion { background: var(--sage-50); border-bottom: 1px solid var(--line); font-size: 0.8125rem; color: var(--ink-soft); }
.isesion .wrap { display: flex; align-items: center; justify-content: flex-end; gap: 0.5rem 0.9rem; min-height: 2.5rem; }
.isesion svg { width: 0.9rem; height: 0.9rem; color: var(--brand); flex: none; }
.isesion b { color: var(--ink); }
.isesion form { margin: 0; }
.isesion a { color: var(--brand); font: 650 0.8125rem/1 var(--sans); text-decoration: underline; text-underline-offset: 0.2em; }
.isesion button { border: 0; background: none; padding: 0; color: var(--brand); font: 650 0.8125rem/1 var(--sans); text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }

/* Portada: la torre contra el cielo, como en la Zona Privada anterior */
.iportada { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(20rem, 40vw, 30rem); display: grid; align-items: end; color: #fff; background: #0d3a52; }
.iportada__foto { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; }
.iportada::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(1, 30, 40, 0.62) 0%, rgba(1, 30, 40, 0.28) 48%, rgba(1, 30, 40, 0) 75%), linear-gradient(0deg, rgba(1, 30, 40, 0.55) 0%, rgba(1, 30, 40, 0) 55%); }
.iportada__txt { padding-block: clamp(2rem, 5vw, 3.25rem); }
.iportada__kicker { margin: 0 0 0.6rem; font: 650 0.78rem/1 var(--sans); letter-spacing: 0.22em; text-transform: uppercase; }
.iportada h1 { color: #fff; font-size: clamp(2.75rem, 6vw, 4.5rem); line-height: 1; letter-spacing: -0.02em; text-shadow: 0 2px 24px rgba(0, 0, 0, 0.25); }
.iportada__dir { margin: 0.6rem 0 1.5rem; color: rgba(255, 255, 255, 0.9); }
.ibuscar { position: relative; max-width: 34rem; }
.ibuscar svg { position: absolute; left: 1rem; top: 50%; width: 1.2rem; height: 1.2rem; transform: translateY(-50%); color: var(--brand); pointer-events: none; }
.ibuscar input { width: 100%; min-height: 3.3rem; padding: 0.75rem 1rem 0.75rem 2.9rem; border: 0; border-radius: var(--radius); background: #fff; color: var(--ink); font: 500 1rem var(--sans); box-shadow: 0 12px 32px rgba(1, 30, 40, 0.28); }
.ibuscar input:focus-visible { outline: 3px solid var(--signal); outline-offset: 2px; }

/* Paneles con un fondo tenue por sección */
.intra { --t-emp: #edf5f0; --t-prov: #ecf2f6; --t-fact: #f6f3ea; --t-regl: #f2f0f6; --t-plan: #eef1f3; padding-block: clamp(1.75rem, 3.5vw, 2.5rem) clamp(3rem, 6vw, 5rem); }
.isec--emp { --bg-sec: var(--t-emp); --ac: #0c6a4d; }
.isec--prov { --bg-sec: var(--t-prov); --ac: #1d5f7a; }
.isec--fact { --bg-sec: var(--t-fact); --ac: #7a5a12; }
.isec--regl { --bg-sec: var(--t-regl); --ac: #574a86; }
.isec--plan { --bg-sec: var(--t-plan); --ac: #3d5866; }
.isec { background: var(--bg-sec); border-radius: 8px; padding: clamp(1.25rem, 2.6vw, 2rem); }
.isec[hidden], .ifila[hidden], .iinactivas[hidden] { display: none; }
.idos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem); align-items: start; }
.intra > * + * { margin-top: clamp(1.25rem, 2.5vw, 2rem); }
.isec__head { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 0.85rem; row-gap: 0.2rem; align-items: center; padding-bottom: 1.1rem; margin-bottom: 0.5rem; border-bottom: 1px solid color-mix(in srgb, var(--ac) 22%, transparent); }
.isec__pic { grid-row: span 2; display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; background: #fff; color: var(--ac); }
.isec__pic svg { width: 1.3rem; height: 1.3rem; }
.isec__head h2 { font: 650 0.95rem/1.25 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ac); }
.isec__n { font-size: 0.875rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.idir { display: grid; }
.idir--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; }
.ifila { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 0.25rem 1rem; align-items: center; padding: 0.95rem 0.6rem; border-bottom: 1px solid color-mix(in srgb, var(--ac) 14%, transparent); border-radius: 4px; color: var(--ink); text-decoration: none; transition: background-color 0.15s ease; }
.ifila:hover { background: #fff; }
.ifila--ic { grid-template-columns: auto minmax(0, 1fr) auto auto; }
.ifila__ic { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: #fff; color: var(--ac); transition: background-color 0.15s ease, color 0.15s ease; }
.ifila__ic svg { width: 1.05rem; height: 1.05rem; }
.ifila:hover .ifila__ic { background: var(--ac); color: #fff; }
.ifila__nombre { font-weight: 650; min-width: 0; }
.ifila__nombre--doc { font-weight: 600; }
.ifila__sub { display: block; font-weight: 500; font-size: 0.8125rem; color: var(--ink-soft); }
.ifila__fecha { font-size: 0.8125rem; color: var(--ink-soft); white-space: nowrap; font-variant-numeric: tabular-nums; }
.ifila > svg { width: 1.1rem; height: 1.1rem; color: var(--ac); transition: transform 0.2s var(--ease); }
.ifila:hover > svg { transform: translateX(3px); }
.ifila--inactiva .ifila__nombre { color: var(--ink-soft); font-weight: 700; }
.idir--compacta .ifila { grid-template-columns: auto minmax(0, 1fr) auto; padding-block: 0.7rem; }
.idir--compacta .ifila__ic { width: 1.75rem; height: 1.75rem; }
.iinactivas { margin-top: 1.5rem; }
.iinactivas p { margin: 0 0 0.2rem; font: 650 0.7rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); }
.ivacio { padding: 1rem 1.25rem; border-radius: 8px; background: var(--sage-50); color: var(--ink-soft); }

/* Página de una empresa, proveedor o servicio */
.ificha-cab { padding-block: clamp(2rem, 4.5vw, 3rem) 0.25rem; }
.imigas { display: flex; flex-wrap: wrap; gap: 0.4rem; font-size: 0.875rem; color: var(--ink-soft); margin-bottom: 0.7rem; }
.imigas a { color: inherit; text-underline-offset: 0.2em; }
.imigas a:hover { color: var(--brand); }
.ificha-cab h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.05; letter-spacing: -0.015em; }
.ificha-cab p { margin: 0.5rem 0 0; color: var(--ink-soft); }
.intra--ficha { padding-top: 1.5rem; }
.ificha-top { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
.iultimo { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.8rem 1.15rem; border-radius: var(--radius); background: var(--ac); color: #fff; font-weight: 650; text-decoration: none; transition: filter 0.15s ease, transform 0.16s var(--ease); }
.iultimo:hover { filter: brightness(0.9); }
.iultimo:active { transform: scale(0.97); }
.iultimo svg { width: 1.35rem; height: 1.35rem; }
.iultimo small { display: block; font-weight: 600; font-size: 0.75rem; opacity: 0.85; }
.ivolver { font-weight: 700; color: var(--ac); text-underline-offset: 0.2em; }
.intra--ficha .ibloque { background: var(--bg-sec); border-radius: 8px; padding: clamp(1rem, 2.4vw, 1.6rem); }
.intra--ficha .ibloque + .ibloque { margin-top: 1rem; }
.ibloque h2 { font: 650 0.85rem/1.2 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--ac); margin-bottom: 0.75rem; }
.intra--ficha .serie__anio { color: var(--ac); }
.intra--ficha a.mes { border-width: 1px; }
.intra--ficha a.mes:hover { background: var(--ac); border-color: var(--ac); }
.intra--ficha .mes--ult { box-shadow: 0 0 0 2px var(--ac); }
.ileyenda { display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem; margin: 0.9rem 0 0; font-size: 0.8125rem; color: var(--ink-soft); }
.ileyenda i { display: inline-block; width: 0.9rem; height: 0.9rem; border-radius: 2px; vertical-align: -2px; margin-right: 0.35rem; border: 1px solid var(--line); background: #fff; }
.ileyenda i.u { box-shadow: 0 0 0 2px var(--ac); }
.ileyenda i.v { border-style: dashed; background: transparent; }
.ianios { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.ianio { padding: 0.5rem 0.9rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; color: var(--ink); font: 700 0.875rem/1 var(--sans); font-variant-numeric: tabular-nums; cursor: pointer; transition: background-color 0.15s ease, transform 0.16s var(--ease); }
.ianio[aria-pressed="true"] { background: var(--ac); border-color: var(--ac); color: #fff; }
.ianio:active { transform: scale(0.97); }
[data-anio][hidden] { display: none; }
.imes { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 0.35rem 1rem; padding-block: 0.65rem; border-top: 1px solid color-mix(in srgb, var(--ac) 14%, transparent); align-items: start; }
.imes:first-of-type { border-top: 0; }
.imes > span { font-weight: 650; padding-top: 0.4rem; }
.ichips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ichip { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.45rem 0.75rem; border-radius: var(--radius); border: 1px solid var(--line); background: #fff; color: var(--ink); font-size: 0.8125rem; font-weight: 700; text-decoration: none; transition: border-color 0.15s ease, background-color 0.15s ease; }
.ichip:hover { border-color: var(--ac); background: var(--sage-50); }
.ichip span { color: var(--ink-soft); font-weight: 600; font-size: 0.7rem; }

@media (max-width: 62rem) {
  .idos { grid-template-columns: 1fr; }
}
@media (max-width: 46rem) {
  .idir--2:not(.idir--compacta) { grid-template-columns: 1fr; }
  .imes { grid-template-columns: 1fr; }
  .isesion span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
}
@media (max-width: 30rem) {
  .idir--compacta { grid-template-columns: 1fr; }
}
@media print {
  .isesion, .iportada, .ibuscar, .ianios { display: none !important; }
  [data-anio][hidden] { display: block !important; }
}
.ichips--otros { margin-top: 0.75rem; }
.ifila--pendiente { cursor: default; } .ifila--pendiente:hover { background: transparent; } .ifila--pendiente .ifila__nombre { color: var(--ink-soft); font-weight: 700; } .ifila--pendiente .ifila__ic { opacity: 0.55; } .ifila--pendiente:hover .ifila__ic { background: #fff; color: var(--ac); }

/* Intranet por dentro: fondo blanco (los paneles de color se distinguen mejor) */
body:has(.intra) { background: #fff; }
.foot__logo { display: inline-block; border-radius: var(--radius); transition: opacity 0.2s var(--ease); } .foot__logo:hover { opacity: 0.85; }

@media (max-width: 62rem) { .desc__foto { min-height: 0; aspect-ratio: 4 / 3; } }

/* Sección "El edificio" más ancha: fotos y tarjetas más grandes (los párrafos conservan su ancho de lectura) */
.wrap--ancha { width: min(100% - 2 * var(--gutter), 115rem); }
@media (max-width: 34rem) { .rasgos { grid-template-columns: 1fr; } .ficha__claves dd { font-size: 1.35rem; } }
.desc__head .alma__lead { max-width: none; }

/* Pantallas anchas (desde 1.600 px): con el contenido más ancho, las fotos se achican sumando columnas */
@media (min-width: 100rem) {
  /* Características: las 6 tarjetas en una sola fila */
  .rasgos { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.25rem; }
  .rasgo__vidrio { padding: 0.95rem 1.05rem 1.05rem; }
  .rasgo__vidrio p { font-size: 0.9rem; }
  /* Galería: mosaico de 6 columnas, la primera foto grande (2×2) y las otras 8 alrededor: dos filas compactas */
  #galeria .galeria { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  #galeria .galeria > li:first-child { grid-column: span 2; grid-row: span 2; }
  #galeria .galeria > li:first-child a, #galeria .galeria > li:first-child img { height: 100%; }
}

/* Portada: la barra llega al mismo ancho mayor que el contenido, para que los bordes calcen */
.bar--ancha .bar__inner { width: min(100% - 2 * var(--gutter), 115rem); }
/* Pantallas anchas (desde 1.600 px): barra más alta, logo, menú y botón un poco más grandes, a escala del contenido */
@media (min-width: 100rem) {
  :root { --bar-h: 5.75rem; }
  .bar__logo img { height: 2.9rem; }
  .bar__nombre { font-size: 1.04rem; }
  .gnav__link { font-size: 1.0625rem; padding: 0.7rem 1.15rem; }
  .gnav__link svg { width: 0.8rem; height: 0.8rem; }
  .bar__cta { padding: 0.95rem 1.4rem; font-size: 1rem; }
  .bar__cta svg { width: 1.15rem; height: 1.15rem; }
}
/* Barra con más aire arriba y abajo, y el logo un 20% más grande (40 → 48 px; en pantallas anchas 46 → 56 px) */
:root { --bar-h: 5.75rem; }
.bar__logo img { height: 3rem; }
@media (min-width: 100rem) {
  :root { --bar-h: 6.5rem; }
  .bar__logo img { height: 3.5rem; }
}
@media (max-width: 30rem) { :root { --bar-h: 5.25rem; } .bar__logo img { height: 2.6rem; } }

/* Sellos de la portada un 30% más grandes. En una columna no caben sobre la franja en pantallas de alto normal,
   así que en escritorio van en 2×2 dentro del mismo panel; en pantallas muy altas siguen en columna. */
.sellos.sellos--panel { display: grid; grid-template-columns: repeat(2, auto); justify-items: center; gap: clamp(0.6rem, 1.4vh, 1rem) clamp(0.6rem, 1vw, 0.9rem); }
.sellos.sellos--panel img { height: min(10.4rem, calc((100svh - var(--bar-h) - var(--franja, 11.5rem) - 9rem) / 4 * 1.3)); }
@media (min-height: 68rem) {
  .sellos.sellos--panel { grid-template-columns: auto; }
}
@media (max-width: 62rem) {
  .sellos.sellos--panel { display: flex; flex-direction: row; gap: 0.35rem; }
  .sellos.sellos--panel img { height: clamp(4.55rem, 19.5vw, 6.5rem); }
}


/* =====================================================================
   PORTADA EDITORIAL (rediseño en la paralela)
   Inspirada en cbre.cl (foto protagonista, titular con línea, enlaces "——", filetes) y en componentes
   de 21st (Feature List Showcase, Bold Stats, Editorial service list). Todo respeta "reducir movimiento".
   ===================================================================== */

/* Enlace con línea: línea verde señal + texto; la línea se alarga al pasar el mouse */
.enlace-linea { display: inline-flex; align-items: center; gap: 0.9rem; font: 600 1rem/1.2 var(--sans); letter-spacing: 0.01em; color: var(--forest); text-decoration: none; }
.enlace-linea::before { content: ""; flex: none; width: 2.5rem; height: 2px; background: var(--signal); transition: width 0.35s var(--ease); }
.enlace-linea:hover::before { width: 3.75rem; }
.enlace-linea--claro { color: #fff; }

/* Encabezado de sección: título a la izquierda, bajada a la derecha */
.encabezado { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem clamp(2rem, 6vw, 6rem); align-items: end; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.encabezado__texto { justify-self: end; max-width: 44ch; font-size: 1.125rem; color: var(--ink-soft); }
.rotulo { display: flex; align-items: center; gap: 0.9rem; font: 600 0.8125rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--brand); }
.rotulo::before { content: ""; width: 2.5rem; height: 2px; background: var(--signal); }

/* ---------- Hero: foto a pantalla completa, titular abajo a la izquierda, línea que cruza ---------- */
.hero--editorial { height: max(36rem, calc(100svh - var(--bar-h) - 3px)); min-height: 0; }
.hero--editorial .hero__photo::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(1, 42, 45, 0.9) 0%, rgba(1, 42, 45, 0.55) 34%, rgba(1, 42, 45, 0) 64%),
    linear-gradient(to right, rgba(1, 42, 45, 0.45), rgba(1, 42, 45, 0) 55%);
}
.hero--editorial .hero__photo img { object-position: 50% 22%; }
/* Carrusel de la portada: la foto nueva aparece encima con un fundido lento y simétrico, mientras la anterior
   sigue opaca debajo (si ambas se desvanecieran a la vez, a mitad del cambio se asomaría el fondo oscuro). */
.hero__photo { isolation: isolate; }
.hero--editorial .hero__photo::after { z-index: 2; }
.hero__foto { position: absolute; inset: 0; opacity: 0; }
.hero__foto.is-saliente { opacity: 1; }
.hero__foto.is-activa { opacity: 1; z-index: 1; transition: opacity 2s cubic-bezier(0.37, 0, 0.63, 1); }
.hero--editorial .hero__foto--aerea img { object-position: 50% 45%; }
.hero--editorial .hero__foto--fachada img { object-position: 50% 30%; }
.hero--editorial .hero__foto--torre img { object-position: 45% 25%; }
@media (prefers-reduced-motion: reduce) { .hero__foto { transition: none; } }
.hero__sellos-fila { position: absolute; z-index: 1; top: clamp(1rem, 2.5vw, 2rem); left: max(var(--gutter), calc((100% - 115rem) / 2)); }
/* Sellos en columna vertical a la izquierda. Pantallas normales: arriba, del tamaño que quepa sin tocar el titular. */
.sellos.sellos--hero { flex-direction: column; flex-wrap: nowrap; gap: 0.6rem; }
.sellos.sellos--hero img { height: clamp(2.5rem, calc((100svh - var(--bar-h) - 33rem) / 4), 8.2rem); }
/* Pantallas muy anchas (hay margen libre a la izquierda del texto): la columna va en ese margen, compacta y arriba */
@media (min-width: 130rem) {
  .hero__sellos-fila { top: clamp(1rem, 2.5vw, 1.75rem); left: 0; width: calc((100% - 115rem) / 2); display: flex; justify-content: center; }
  .sellos.sellos--hero { gap: 0.75rem; }
  .sellos.sellos--hero img { height: min(calc((100svh - var(--bar-h) - 3rem) / 8.6), calc((100vw - 115rem) / 4 - 0.75rem), 8.5rem); }
}
.hero__texto { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding-bottom: clamp(2rem, 5vw, 4rem); }
.hero__eyebrow { font: 600 0.8125rem/1.3 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-dark-soft); }
.hero--editorial h1 { margin-top: 1rem; max-width: 18ch; font-size: clamp(2.25rem, 4.4vw, 4.25rem); line-height: 1.02; letter-spacing: -0.03em; font-weight: 330; }
.hero__linea { display: block; height: 2px; margin-top: clamp(1.5rem, 3vw, 2.5rem); background: rgba(255, 255, 255, 0.9); transform-origin: left; animation: hero-linea 1.6s var(--ease) 0.35s both; }
@keyframes hero-linea { from { transform: scaleX(0); } to { transform: none; } }
.hero__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 3rem; margin-top: 1.5rem; }
.hero__datos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem clamp(1.5rem, 4vw, 3.5rem); }
.hero__datos li { display: grid; gap: 0.4rem; }
.hero__datos b { font: 400 1.25rem/1 var(--serif); }
.hero__datos span { font: 600 0.72rem/1 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--on-dark-soft); }

/* ---------- El edificio: rótulo, frase en dos tonos y texto en dos columnas ---------- */
.manifiesto { margin-top: clamp(1.5rem, 3vw, 2.5rem); max-width: 32ch; font: 330 clamp(1.625rem, 3vw, 2.875rem)/1.15 var(--serif); letter-spacing: -0.025em; color: var(--forest); text-wrap: balance; }
.manifiesto span { color: #5f8580; }
.presenta__texto { margin: clamp(2.5rem, 5vw, 4rem) 0 0 auto; max-width: 56rem; columns: 2 22rem; column-gap: 3rem; color: var(--ink-soft); }
.presenta__texto p { break-inside: avoid; }
.presenta__texto p + p { margin-top: 1rem; }

/* El edificio en dos columnas alineadas arriba: la frase a la izquierda y el texto a la derecha (sin vacío en diagonal) */
.presenta > .wrap { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: clamp(2.5rem, 7vw, 8rem); align-items: start; }
.presenta .rotulo, .presenta .cifras2 { grid-column: 1 / -1; }
.presenta .manifiesto { max-width: 24ch; }
.presenta .presenta__texto { margin: clamp(1.5rem, 3vw, 2.5rem) 0 0; max-width: 40rem; columns: auto; padding-top: 0.6rem; border-top: 2px solid var(--signal); }
.presenta .presenta__texto p { padding-top: 1rem; }
@media (max-width: 62rem) { .presenta > .wrap { grid-template-columns: 1fr; } }

/* ---------- Cifras: una protagonista enorme junto a la foto, y una fila de cifras ---------- */
.cifras2 { margin-top: clamp(4rem, 8vw, 7rem); padding-top: clamp(2.5rem, 5vw, 4rem); border-top: 1px solid var(--line); }
.cifras2__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.cifras2__num { font: 300 clamp(4.5rem, 10vw, 8.5rem)/0.9 var(--serif); letter-spacing: -0.05em; color: var(--forest); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cifras2__dato { margin-top: 1.75rem; max-width: 34ch; color: var(--ink-soft); }
.cifras2__dato b { display: block; margin-bottom: 0.4rem; font: 600 0.8125rem/1.2 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--brand); }
.cifras2__foto { margin: 0; overflow: hidden; border-radius: var(--radius); aspect-ratio: 4 / 3; background: var(--sage-100); }
.cifras2__foto img { width: 100%; height: 100%; object-fit: cover; }
.cifras2__fila { margin: clamp(3rem, 6vw, 5rem) 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.cifras2__fila > div { padding: 1.75rem 1.5rem 0; border-left: 1px solid var(--line); }
.cifras2__fila > div:first-child { padding-left: 0; border-left: 0; }
.cifras2__fila dt { font: 330 clamp(1.875rem, 2.8vw, 2.625rem)/1 var(--serif); letter-spacing: -0.03em; color: var(--forest); font-variant-numeric: tabular-nums; }
.cifras2__fila dd { margin: 0.75rem 0 0; font-size: 0.9375rem; color: var(--ink-soft); }

/* ---------- Características: lista numerada con foto que cambia (avanza sola; la barra marca el tiempo) ---------- */
.rasgos2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.rasgos2__lista { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.rasgo2 { position: relative; border-bottom: 1px solid var(--line); }
.rasgo2__btn {
  width: 100%; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr) auto; align-items: baseline; gap: 1rem;
  padding: 1.35rem 0; margin: 0; background: none; border: 0; text-align: left; font: inherit; color: var(--ink); cursor: pointer;
}
.rasgo2__n { font: 500 0.8125rem/1 var(--sans); color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.rasgo2__t { font: 340 clamp(1.25rem, 1.8vw, 1.625rem)/1.2 var(--serif); letter-spacing: -0.015em; color: var(--ink-soft); transition: color 0.25s var(--ease), transform 0.4s var(--ease); }
.rasgo2.is-activa .rasgo2__t, .rasgo2__btn:hover .rasgo2__t { color: var(--forest); }
.rasgo2__btn:hover .rasgo2__t { transform: translateX(6px); }
.rasgo2__signo { position: relative; align-self: center; width: 1rem; height: 1rem; color: var(--forest); }
.rasgo2__signo::before, .rasgo2__signo::after { content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1.5px; background: currentColor; transition: transform 0.35s var(--ease); }
.rasgo2__signo::after { transform: rotate(90deg); }
.rasgo2.is-activa .rasgo2__signo::after { transform: rotate(0deg); }
.rasgo2__desc { display: grid; grid-template-rows: 1fr; transition: grid-template-rows 0.5s var(--ease); }
.rasgo2__desc > div { overflow: hidden; min-height: 0; }
.rasgo2__desc p { padding: 0 0 1.5rem 3.75rem; max-width: 46ch; color: var(--ink-soft); }
.rasgos2.is-js .rasgo2:not(.is-activa) .rasgo2__desc { grid-template-rows: 0fr; }
.rasgo2__barra { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; overflow: hidden; }
.rasgo2__barra i { display: block; height: 100%; background: var(--brand); transform: scaleX(0); transform-origin: left; }
.rasgos2.is-auto .rasgo2.is-activa .rasgo2__barra i { animation: rasgo-avance 6s linear forwards; }
.rasgos2.is-auto.is-pausa .rasgo2.is-activa .rasgo2__barra i, .rasgos2.is-auto:not(.is-en-vista) .rasgo2.is-activa .rasgo2__barra i { animation-play-state: paused; }
@keyframes rasgo-avance { to { transform: none; } }
.rasgos2__fotos { position: sticky; top: calc(var(--bar-h) + 2rem); display: grid; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius); background: var(--sage-100); }
.rasgo2__foto { grid-area: 1 / 1; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.05); transition: opacity 0.7s var(--ease), transform 1.4s var(--ease); }
.rasgo2__foto.is-activa { opacity: 1; transform: none; }

/* ---------- Galería en mosaico: una foto grande y las demás alrededor, con pie al pasar el mouse ---------- */
.mosaico { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(0.5rem, 1vw, 1rem); }
.mosaico__item { position: relative; }
.mosaico__item--grande { grid-column: span 2; grid-row: span 2; }
.mosaico a { position: relative; display: block; overflow: hidden; border-radius: var(--radius); background: var(--sage-100); }
.mosaico__item--grande a { position: absolute; inset: 0; }
.mosaico img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 0.9s var(--ease); }
.mosaico__item--grande img { height: 100%; aspect-ratio: auto; }
.mosaico a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(1, 42, 45, 0.7), rgba(1, 42, 45, 0) 50%); opacity: 0; transition: opacity 0.4s var(--ease); }
.mosaico__pie { position: absolute; z-index: 1; left: 1rem; right: 1rem; bottom: 0.9rem; color: #fff; font: 600 0.875rem/1.3 var(--sans); opacity: 0; transform: translateY(6px); transition: opacity 0.4s var(--ease), transform 0.4s var(--ease); }
.mosaico a:hover img { transform: scale(1.05); }
.mosaico a:hover::after, .mosaico a:hover .mosaico__pie, .mosaico a:focus-visible::after, .mosaico a:focus-visible .mosaico__pie { opacity: 1; transform: none; }
.mosaico__item--grande .mosaico__pie { font-size: 1rem; left: 1.5rem; bottom: 1.25rem; }

/* ---------- Para quienes trabajan en el edificio: filas numeradas ---------- */
.atajos { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.atajos > li { border-bottom: 1px solid var(--line); }
.atajo { display: grid; grid-template-columns: 4rem minmax(0, 1.1fr) minmax(0, 1fr) auto; align-items: center; gap: 1rem 2rem; padding: clamp(1.5rem, 3vw, 2.25rem) 0; color: var(--ink); text-decoration: none; }
.atajo__n { font: 500 0.875rem/1 var(--sans); color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.atajo__t { font: 340 clamp(1.5rem, 2.4vw, 2.125rem)/1.1 var(--serif); letter-spacing: -0.02em; color: var(--forest); transition: transform 0.45s var(--ease); }
.atajo__d { max-width: 44ch; color: var(--ink-soft); }
.atajo__go { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border: 1px solid var(--line); border-radius: 50%; color: var(--forest); transition: background-color 0.3s var(--ease), border-color 0.3s var(--ease), color 0.3s var(--ease), transform 0.4s var(--ease); }
.atajo__go svg { width: 1.25rem; height: 1.25rem; }
.atajo:hover .atajo__t { transform: translateX(10px); }
.atajo:hover .atajo__go { background: var(--forest); border-color: var(--forest); color: #fff; transform: rotate(-45deg); }

/* ---------- Aparición suave al entrar en pantalla (la activa main.js; nunca con movimiento reducido) ---------- */
.js-revelar [data-revelar] { opacity: 0; transform: translateY(28px); transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
.js-revelar [data-revelar].is-visible { opacity: 1; transform: none; }
.js-revelar .cifras2__fila > :nth-child(2), .js-revelar .mosaico > :nth-child(3n + 2), .js-revelar .atajos > :nth-child(2) { transition-delay: 0.08s; }
.js-revelar .cifras2__fila > :nth-child(3), .js-revelar .mosaico > :nth-child(3n + 3), .js-revelar .atajos > :nth-child(3) { transition-delay: 0.16s; }
.js-revelar .cifras2__fila > :nth-child(4) { transition-delay: 0.24s; }

/* ---------- Pantallas medianas y teléfono ---------- */
@media (max-width: 62rem) {
  .hero--editorial { height: max(34rem, calc(100svh - var(--bar-h) - 3px)); overflow: hidden; }
  .hero--editorial .hero__photo { position: absolute; }
  .hero--editorial .hero__photo img { height: 100%; aspect-ratio: auto; }
  .encabezado { grid-template-columns: 1fr; }
  .encabezado__texto { justify-self: start; }
  .cifras2__top, .rasgos2 { grid-template-columns: 1fr; }
  .cifras2__fila { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cifras2__fila > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .rasgos2__fotos { position: relative; top: 0; order: -1; }
  .atajo { grid-template-columns: 3rem minmax(0, 1fr) auto; }
  .atajo__d { grid-column: 2; grid-row: 2; }
  .atajo__go { grid-column: 3; grid-row: 1 / 3; }
}
@media (max-width: 46rem) {
  .sellos.sellos--hero { flex-direction: row; }
  .sellos.sellos--hero img { height: 3.1rem; }
  .hero__datos b { font-size: 1.05rem; }
  .mosaico { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mosaico__item--grande { grid-row: auto; }
  .mosaico__item--grande a { position: relative; }
  .mosaico__item--grande img { aspect-ratio: 4 / 3; }
  .mosaico__pie, .mosaico__item--grande .mosaico__pie { left: 0.6rem; right: 0.6rem; bottom: 0.5rem; font-size: 0.75rem; }
  .rasgo2__desc p { padding-left: 3.75rem; }
}

/* Pantallas táctiles: sin desplazamientos de hover */
@media (hover: none), (pointer: coarse) {
  .rasgo2__btn:hover .rasgo2__t, .atajo:hover .atajo__t, .atajo:hover .atajo__go, .mosaico a:hover img { transform: none; }
}


/* ---------- Ajustes de la crítica (2026-10-17) ---------- */
/* Sostenibilidad: títulos en la serif de todo el sitio y enlaces con la línea verde («—— 2025 ↗») */
.sost .certs h3 { font: 400 clamp(1.375rem, 2vw, 1.625rem)/1.2 var(--serif); letter-spacing: -0.01em; }
.sost .links { gap: 0.75rem 2rem; }
.sost .links a, .sost .links a:hover { gap: 0.7rem; padding: 0; border: 0; font-weight: 600; }
.sost .links a::before { content: ""; flex: none; width: 1.75rem; height: 2px; background: var(--signal); transition: width 0.3s var(--ease); }
.sost .links a:hover::before { width: 2.75rem; }
/* El mapa va plano, como todas las fotos */
.aerea img { box-shadow: none; }
/* Galería en pantallas táctiles (sin mouse): el pie de cada foto se ve siempre */
@media (hover: none) {
  .mosaico a::after, .mosaico__pie { opacity: 1; transform: none; }
}
/* Sostenibilidad: el título acompaña mientras se recorre la lista de certificados */
@media (min-width: 62.01rem) { .sost > div:first-child { position: sticky; top: calc(var(--bar-h) + 2.5rem); } }

/* Menú desplegable con la entrada de cbre.cl: el panel baja desde detrás de la barra en 0,5 s
   (curva cubic-bezier(.75,.02,.5,1)) y el contenido aparece después, con un fundido de 0,4 s que empieza a los 0,3 s. */
@media (min-width: 68.01rem) {
  .gnav__item.is-open .dd { animation: dd-baja 0.5s cubic-bezier(0.75, 0.02, 0.5, 1) backwards; }
  .gnav__item.is-open .dd__grid { animation: dd-contenido 0.4s cubic-bezier(0.75, 0.02, 0.5, 1) 0.3s both; }
}
@keyframes dd-baja {
  0% { opacity: 0; clip-path: inset(0 0 100% 0); }
  75% { opacity: 1; }
  100% { opacity: 1; clip-path: inset(0 0 -4rem 0); }
}
@keyframes dd-contenido {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: none; }
}

/* Pesos tipográficos del menú medidos en cbre.cl: barra y enlaces en sans 500, textos en 400,
   rótulos de grupo en serif 400 gris azulado (sin mayúsculas) y enlace final con la línea verde «——». */
.gnav__link { font-weight: 500; }
.dd__text { font-size: 1.125rem; line-height: 1.75; font-weight: 320; letter-spacing: 0.005em; } /* Calibre 400 de CBRE se ve como Hanken 320 */
.dd__head .btn { font-weight: 500; }
.dd__label { font: 400 1.25rem/1.25 var(--serif); letter-spacing: -0.005em; text-transform: none; color: #5f7787; }
.dd__links a { font-weight: 500; font-size: 1.125rem; color: var(--forest); }
.dd__links a:hover { color: var(--brand); }
.dd__more { gap: 0.9rem; font-weight: 500; font-size: 1rem; letter-spacing: -0.01em; color: var(--forest); }
.dd__more::before { content: ""; flex: none; width: 2.5rem; height: 2px; background: var(--signal); transition: width 0.35s var(--ease); }
.dd__more:hover::before { width: 3.75rem; }
.dd__more:hover { text-decoration: none; }
.dd__more svg { display: none; }

/* Botones sólidos en el verde de los botones de cbre.cl (#003f2d = --forest); al pasar el mouse, verde de marca */
.btn--solid { background: var(--forest); border-color: var(--forest); }
.btn--solid:hover { background: var(--brand); border-color: var(--brand); }
.bar--clara .bar__cta.btn--signal, .bar--clara.is-dd-open .bar__cta.btn--signal { background: var(--forest); color: #fff; border-color: var(--forest); }
.bar--clara .bar__cta.btn--signal:hover, .bar--clara.is-dd-open .bar__cta.btn--signal:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.bar.is-dd-open .bar__cta { color: var(--forest); border-color: var(--forest); }
.bar.is-dd-open .bar__cta:hover { background: var(--forest); color: #fff; }

/* Texto corrido más liviano, como el de cbre.cl (su Calibre 400 se ve como Hanken 320–340).
   Solo cambia lo que hereda el peso base; títulos, botones y etiquetas tienen su propio peso. */
body { font-weight: 340; }
b, strong { font-weight: 600; }

/* Títulos como los de cbre.cl: serif de trazo firme (su Financier Display 400 ≈ Source Serif 4 a 460) en verde bosque.
   Sobre fondos oscuros (hero, cabeceras, Sostenibilidad) siguen en blanco. */
h1, h2, h3 { font-weight: 460; font-optical-sizing: auto; letter-spacing: -0.02em; color: var(--forest); }
.on-dark :is(h1, h2, h3), .on-dark:is(h1, h2, h3) { color: inherit; }
.rasgo2__t, .atajo__t, .dd__title { font-weight: 440; }

/* ---------- Selector de idioma con banderas (español = Chile, inglés = EE. UU., coreano, griego; 2026-10-20) ----------
   Escritorio: botón con la bandera y el código del idioma actual, a la izquierda del botón Intranet (.bar__fin); al pulsarlo
   se despliega la lista (details/summary: funciona sin JavaScript; main.js la cierra al hacer clic fuera o con Escape).
   Móvil (≤ 68rem): fila de banderas dentro del menú desplegado (.gnav__idioma > .idiomas). */
.bar__fin { flex: none; display: flex; align-items: center; gap: clamp(0.75rem, 1.4vw, 1.5rem); }
@media (min-width: 68.01rem) { .bar__fin { justify-self: end; } .bar__fin .bar__cta { justify-self: auto; } }
@media (max-width: 68rem) { .bar__fin { display: none; } }
.bandera { display: block; flex: none; width: 1.375rem; height: auto; aspect-ratio: 3 / 2; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15, 31, 28, 0.14); }
.idioma { position: relative; }
.idioma__btn {
  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.55rem 0.35rem; cursor: pointer; list-style: none;
  font: 650 0.8125rem/1 var(--sans); letter-spacing: 0.1em; color: currentColor; border-radius: 4px;
}
.idioma__btn::-webkit-details-marker { display: none; }
.idioma__btn > svg:last-child { width: 0.7rem; height: 0.7rem; opacity: 0.75; transition: transform 0.25s var(--ease); }
.idioma[open] > .idioma__btn > svg:last-child { transform: rotate(180deg); }
.idioma__btn:hover .idioma__cod { text-decoration: underline 2px; text-underline-offset: 0.45em; }
.idioma__lista { list-style: none; margin: 0; padding: 0; }
.idioma > .idioma__lista {
  position: absolute; right: 0; top: calc(100% + 0.6rem); z-index: 60; min-width: 12.5rem; padding: 0.4rem;
  background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: 4px; box-shadow: 0 14px 36px rgba(1, 42, 45, 0.18);
  animation: idioma-entra 0.22s var(--ease);
}
@keyframes idioma-entra { from { opacity: 0; transform: translateY(-4px); } }
.idioma .idioma__op {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.75rem; border-radius: 3px;
  font: 450 0.9375rem/1.2 var(--sans); color: var(--ink); text-decoration: none; transition: background-color 0.15s var(--ease);
}
.idioma .idioma__op .idioma__cod { margin-left: auto; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; color: var(--ink-soft); }
.idioma a.idioma__op:hover, .idioma a.idioma__op:focus-visible { background: var(--sage-100); }
.idioma .idioma__op[aria-current] { font-weight: 650; color: var(--forest); background: var(--sage-50); }
.idioma .idioma__op[aria-current] .idioma__cod { color: var(--brand); }
.gnav__idioma { display: none; }
@media (max-width: 68rem) {
  .gnav__idioma { display: block; border: 0; padding-top: 1.25rem; }
  .idiomas .idioma__lista { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.25rem 0.5rem; }
  .idiomas .idioma__op { display: inline-flex; flex-direction: column; align-items: center; gap: 0.4rem; padding: 0.6rem 0.75rem; color: var(--ink); text-decoration: none; border-radius: 4px; font: 600 0.8125rem/1 var(--sans); letter-spacing: 0.08em; }
  .idiomas .bandera { width: 2rem; }
  .idiomas .idioma__nombre { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .idiomas .idioma__op[aria-current] { background: var(--sage-100); color: var(--forest); }
  .idiomas .idioma__op[aria-current] .idioma__cod { text-decoration: underline 2px var(--brand); text-underline-offset: 0.4em; }
}
@media (min-width: 100rem) { .idioma__btn { font-size: 0.875rem; } }
@media (prefers-reduced-motion: reduce) { .idioma > .idioma__lista { animation: none; } .idioma__btn > svg:last-child { transition: none; } }

/* ---------- Coreano y griego (2026-10-20) ----------
   Griego: Source Serif 4 tiene griego (subconjunto propio, abajo); Hanken Grotesk no, así que sus letras griegas salen de Inter
   (mismo nombre de familia, solo para ese rango de caracteres). Coreano: fuentes del sistema (Malgun Gothic, Apple SD Gothic Neo),
   también en los títulos (los coreanos de serif del sistema se ven anticuados), y cortes de línea entre palabras. */
:lang(ko) { --serif: "Source Serif 4", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif; --sans: "Hanken Grotesk", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", system-ui, sans-serif; word-break: keep-all; overflow-wrap: anywhere; }
:lang(ko) :is(h1, h2, h3) { letter-spacing: -0.01em; }
:lang(ko) :is(em, i) { font-style: normal; } /* el hangul no tiene cursiva: el navegador la inclinaría a la fuerza (el color verde ya destaca) */
.isec--emer { --bg-sec: #f7efec; --ac: #9a3b2e; }
/* ---------- Características como «Insights recientes» de cbre.cl (aprobado en el artifact, 2026-10-17) ----------
   Ancho de contenido 84rem (1344 px); columnas sin casi separación; foto cuadrada al 87 % corrida 13 % a la derecha;
   etiqueta y título alineados con la foto. Al pasar el mouse (o con el foco): panel de vidrio que cubre la foto de
   izquierda a derecha en 0,4 s, filete verde señal de 4 px y la descripción sube y aparece. */
#caracteristicas > .wrap { width: min(100% - 2 * var(--gutter), 84rem); }
.carac { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(3rem, 6vw, 5rem) 1rem; }
.carac__item { border-top: 1px solid var(--line); padding-top: 1.5rem; display: grid; grid-template-rows: auto 1fr; }
.carac__cab { padding-left: 13%; display: grid; align-content: start; gap: 0.5rem; margin-bottom: clamp(1.75rem, 3vw, 3rem); }
.carac__etq { font: 320 1rem/1.3 var(--sans); color: var(--ink-soft); }
.carac__cab h3 { font: 440 clamp(1.375rem, 2vw, 1.75rem)/1.2 var(--serif); letter-spacing: -0.015em; color: var(--forest); }
.carac__cab h3 span { text-decoration: underline 2px transparent; text-underline-offset: 3px; transition: text-decoration-color 0.25s cubic-bezier(0.75, 0.02, 0.5, 1); }
.carac__item:hover .carac__cab h3 span { text-decoration-color: currentColor; }
.carac__media { position: relative; margin-left: 13%; aspect-ratio: 1 / 1; max-width: 100%; align-self: end; overflow: hidden; }
.carac__media:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
.carac__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.carac__panel { position: absolute; inset: 0; padding: clamp(1rem, 2.2vw, 2rem); border-left: 4px solid transparent; transition: border-color 0s cubic-bezier(0.75, 0.02, 0.5, 1) 0.4s; }
.carac__panel::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 0; background: #e6e6e6; transition: width 0.4s cubic-bezier(0.75, 0.02, 0.5, 1); }
.carac__panel p { position: relative; font-weight: 320; font-size: clamp(0.9375rem, 1.3vw, 1.125rem); line-height: 1.75; color: var(--ink); opacity: 0; transform: translateY(10px); transition: opacity 0.4s cubic-bezier(0.75, 0.02, 0.5, 1) 0.1s, transform 0.4s cubic-bezier(0.75, 0.02, 0.5, 1) 0.1s; }
.carac__media:hover .carac__panel, .carac__media:focus-within .carac__panel { border-left-color: var(--signal); transition-delay: 0s; }
.carac__media:hover .carac__panel::before, .carac__media:focus-within .carac__panel::before { width: 100%; }
.carac__media:hover .carac__panel p, .carac__media:focus-within .carac__panel p { opacity: 1; transform: none; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .carac__panel::before { background: rgba(244, 245, 242, 0.66); -webkit-backdrop-filter: blur(18px) saturate(1.25); backdrop-filter: blur(18px) saturate(1.25); }
}
.js-revelar .carac > :nth-child(3n + 2) { transition-delay: 0.08s; }
.js-revelar .carac > :nth-child(3n + 3) { transition-delay: 0.16s; }
@media (max-width: 62rem) { .carac { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 40rem) { .carac { grid-template-columns: 1fr; } .carac__media { margin-left: 0; } .carac__cab { padding-left: 0; } }
/* Pantallas táctiles: tocar la foto le da el foco y revela el panel (focus-within) */

/* Características sobre fondo blanco, como «Insights recientes» de cbre.cl */
#caracteristicas { background: #fff; }

/* ---------- Pie como cbre.cl (2026-10-17): fondo blanco, filete verde bosque grueso arriba, logo verde,
   enlaces grandes en verde (su Calibre 20px/500 ≈ Hanken 1.25rem/460), filete gris fino y fila final pequeña. ---------- */
.foot { background: #fff; color: var(--forest); --focus: var(--brand); padding-block: 0 2.5rem; }
.foot > .wrap { border-top: 3px solid var(--forest); padding-top: clamp(2.5rem, 4vw, 3.5rem); }
.foot__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.2fr); gap: 2.5rem clamp(2rem, 5vw, 5rem); }
.foot img.logo { height: 2.75rem; }
.foot address { color: var(--ink-soft); font-weight: 320; line-height: 1.6; }
.foot h2 { font: 320 1rem/1.3 var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink-soft); margin-bottom: 1.1rem; }
.foot ul { gap: 1rem; }
.foot nav a { font: 460 1.25rem/1.2 var(--sans); letter-spacing: -0.02em; color: var(--forest); text-decoration: underline 2px transparent; text-underline-offset: 4px; transition: text-decoration-color 0.25s cubic-bezier(0.75, 0.02, 0.5, 1); }
.foot nav a:hover { text-decoration-color: currentColor; }
.foot__base { margin-top: clamp(2.5rem, 4vw, 3.5rem); padding-top: 1.5rem; border-top: 1px solid #b3b3b3; color: var(--ink-soft); font-size: 0.8125rem; font-weight: 320; }
.foot__redes a { color: var(--forest); font-weight: 460; font-size: 1rem; text-decoration: underline 2px transparent; text-underline-offset: 4px; transition: text-decoration-color 0.25s cubic-bezier(0.75, 0.02, 0.5, 1); }
.foot__redes a:hover { text-decoration-color: currentColor; }
.foot__base img { height: 1.25rem; }
@media (max-width: 46rem) { .foot__grid { grid-template-columns: 1fr; } }

/* Franja final del pie como cbre.cl (2026-10-17): enlaces legales en fila (500, 0.9375rem), íconos de redes
   a la derecha y el copyright pequeño en su propia línea. */
.foot__base { align-items: center; row-gap: 1.25rem; padding-top: 2rem; }
.foot__legal { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; }
.foot nav.foot__legal a { font: 500 0.9375rem/1.3 var(--sans); letter-spacing: 0; }
.foot__redes { gap: 0.5rem 1.25rem; }
.foot__red { display: inline-flex; padding: 0.25rem; margin: -0.25rem; border-radius: var(--radius); transition: color 0.2s var(--ease); }
.foot__red svg { width: 1.5rem; height: 1.5rem; }
.foot__red:hover { color: var(--brand); }
.foot__copy { flex-basis: 100%; margin: 0.5rem 0 0; font-size: 0.75rem; color: var(--ink-soft); }
/* Crédito de diseño y desarrollo, bajo el copyright */
.foot__credito { flex-basis: 100%; margin: -0.9rem 0 0; font-size: 0.75rem; color: var(--ink-soft); } /* junto al copyright: compensa el row-gap de .foot__base */
.foot__credito a { color: inherit; text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 0.2em; }
.foot__credito a:hover { color: var(--brand); text-decoration-color: currentColor; }

/* ---------- Privacidad y Términos de uso: índice fijo a la izquierda, texto a la derecha ---------- */
.legal-sec { padding-block: clamp(3rem, 6vw, 5rem) clamp(4rem, 8vw, 7rem); }
.legal { display: grid; grid-template-columns: minmax(14rem, 1fr) minmax(0, 2.6fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.legal__lado { position: sticky; top: calc(var(--bar-h) + 2rem); }
.legal__version { margin: 0 0 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); font-size: 0.875rem; color: var(--ink-soft); }
.legal__indice ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.legal__indice a { display: flex; gap: 0.75rem; padding: 0.4rem 0; color: var(--forest); font-weight: 500; font-size: 0.9375rem; text-decoration: underline 1px transparent; text-underline-offset: 4px; transition: text-decoration-color 0.25s var(--ease); }
.legal__indice a:hover { text-decoration-color: currentColor; }
.legal__indice a span, .legal__texto h2 span { font: 500 0.8125rem/1.6 var(--sans); color: var(--brand); font-variant-numeric: tabular-nums; }
.legal__texto { max-width: 52rem; }
.legal__texto > section { padding-top: 2.5rem; margin-top: 2.5rem; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--bar-h) + 1.5rem); }
.legal__texto h2 { display: flex; align-items: baseline; gap: 1rem; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.15; margin-bottom: 1.25rem; }
.legal__texto p, .legal__texto li { color: var(--ink); max-width: 68ch; line-height: 1.65; }
.legal__texto p + p, .legal__texto p + ol, .legal__texto ol + p, .legal__texto ul + p, .legal__texto p + ul, .legal__tabla + p, .legal__texto p + .legal__tabla { margin-top: 1rem; }
.legal__texto ul, .legal__texto ol { padding-left: 1.25rem; display: grid; gap: 0.4rem; }
.legal__texto a { color: var(--brand); }
.legal__resumen { padding: clamp(1.5rem, 3vw, 2rem); background: var(--sage-100); border-left: 3px solid var(--brand); border-radius: var(--radius); }
.legal__resumen h2 { font-size: 1.25rem; margin-bottom: 0.75rem; }
.legal__resumen ul { margin: 0; }
.legal__tabla { overflow-x: auto; border-top: 2px solid var(--forest); }
.legal__tabla table { width: 100%; min-width: 40rem; border-collapse: collapse; font-size: 0.875rem; line-height: 1.45; }
.legal__tabla th, .legal__tabla td { padding: 0.85rem 1rem 0.85rem 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.legal__tabla thead th { font-weight: 600; color: var(--ink-soft); font-size: 0.8125rem; }
.legal__tabla tbody th { font-weight: 500; color: var(--forest); }
mark.pendiente { background: #fff3b0; color: var(--ink); padding: 0 0.2em; border-radius: var(--radius); }
@media (max-width: 62rem) {
  .legal { grid-template-columns: minmax(0, 1fr); }
  .legal__lado { position: static; }
}

/* ---------- Tipografía igualada a cbre.cl (2026-10-17, a pedido del usuario; medida en su sección «Nuestro compromiso») ----------
   cbre.cl: título de sección 64px/1.0 · título de tarjeta 32px/1.125 · texto 16px/22px · «Ver más» 18px 500, −0.36px, línea 40×2.25.
   Los pesos siguen la equivalencia ya calibrada (Financier 400 ≈ Source Serif 460; Calibre 400 ≈ Hanken 340).
   Para volver atrás, borrar este bloque. */
body { font-size: 1rem; line-height: 1.375; }
h2 { font-size: clamp(2.5rem, 4.6vw, 4rem); line-height: 1; }
.carac__cab h3 { font-size: clamp(1.5rem, 2.3vw, 2rem); line-height: 1.125; }
.carac__panel p { font-size: 1rem; line-height: 1.375; }
.enlace-linea { font: 500 1.125rem/1.2 var(--sans); letter-spacing: -0.02em; }
.enlace-linea::before { height: 2.25px; }

/* ==========================================================================
   Teléfono y tablet al estilo de cbre.cl (medido en su sitio el 2026-10-17, en 390 y 820 px de ancho):
   barra de 80 px verde oscuro con íconos sin borde; márgenes de 24 px (teléfono) y 32 px (tablet); títulos de 48 px;
   portada con la foto arriba (385 px) y debajo un panel verde con el titular de 32 px y los puntos del carrusel;
   páginas interiores en blanco: título verde de 48 px, bajada gris y la foto debajo, del margen al borde derecho.
   El escritorio no cambia.
   ========================================================================== */
.hero__puntos { display: none; }
@media (max-width: 68rem) {
  :root { --bar-h: 5rem; }
  /* Barra sólida como en cbre.cl: verde oscuro en la portada (que en escritorio la lleva blanca) y blanca con el logo verde
     en las páginas interiores. El selector repetido gana a las reglas de vidrio y de barra blanca sin tocarlas. */
  .bar.bar.bar:not(.is-menu-open):not(.is-dd-open) { background: #fff; color: var(--forest); border-bottom: 1px solid var(--line); -webkit-backdrop-filter: none; backdrop-filter: none; --focus: var(--brand); }
  .bar:not(.bar--clara):not(.is-menu-open) .logo--light { opacity: 0; }
  .bar:not(.bar--clara):not(.is-menu-open) .logo--dark { opacity: 1; }
  .bar.bar .bar__progress { background: transparent; }
  .bar:not(.bar--clara) .bar__progress i { background: var(--brand); }
  .bar.bar.bar.bar--clara:not(.is-menu-open):not(.is-dd-open) { background: var(--forest-950); color: #fff; border-bottom-color: transparent; --focus: var(--signal); }
  .bar.bar--clara:not(.is-menu-open) .logo--light { opacity: 1; }
  .bar.bar--clara:not(.is-menu-open) .logo--dark { opacity: 0; }
  .bar.bar--clara .bar__progress i { background: var(--signal); }
  .bar__logo img { height: 2.5rem; }
  .bar__toggle { width: 2.75rem; height: 2.75rem; margin-right: -0.625rem; border: 0; }
}
@media (max-width: 62rem) {
  :root { --gutter: 2rem; }
  h2 { font-size: 3rem; line-height: 1; font-weight: 400; letter-spacing: -0.01em; }

  /* Portada: foto arriba y panel verde con el texto debajo */
  .hero.hero--editorial { height: auto; min-height: 0; overflow: visible; }
  .hero--editorial .hero__photo { position: relative; inset: auto; height: 24rem; }
  .hero--editorial .hero__photo::after { background: linear-gradient(to bottom, rgba(1, 42, 45, 0.35), rgba(1, 42, 45, 0) 35%); }
  .hero__texto { position: static; background: var(--forest-950); padding: 1.5rem 0; }
  .hero__eyebrow { display: none; }
  /* La línea blanca cruza la foto a media altura, como en cbre.cl */
  .hero__linea { position: absolute; z-index: 1; top: 12rem; left: var(--gutter); right: var(--gutter); height: 0.375rem; margin: 0; background: #fff; }
  .hero--editorial h1 { margin-top: 0; max-width: 22ch; font-size: 2rem; line-height: 1.125; letter-spacing: -0.01em; font-weight: 400; }
  .hero__pie { flex-direction: column; align-items: flex-start; gap: 1.75rem; margin-top: 1.5rem; }
  .hero__sellos-fila { top: 1rem; left: var(--gutter); }
  .sellos.sellos--hero { flex-direction: row; gap: 0.5rem; }
  .sellos.sellos--hero img { height: 3.5rem; }
  .hero__puntos { display: flex; justify-content: center; margin-top: 1.75rem; }
  .hero__punto { display: grid; place-items: center; width: 1.75rem; height: 2rem; padding: 0; background: none; border: 0; cursor: pointer; }
  .hero__punto::before { content: ""; width: 0.625rem; height: 0.625rem; border-radius: 50%; background: rgba(255, 255, 255, 0.4); transition: background-color 0.3s var(--ease); }
  .hero__punto[aria-current="true"]::before { background: #fff; }

  /* Páginas interiores (no la Intranet): en blanco, título verde, bajada gris y la foto debajo */
  .page-head:not(.page-head--intranet) { display: flex; flex-direction: column; min-height: 0; padding: 2rem 0 0; background: #fff; color: var(--ink); --focus: var(--brand); overflow: hidden; isolation: auto; }
  .page-head:not(.page-head--intranet) h1 { color: var(--forest); font-size: 3rem; line-height: 1; font-weight: 400; letter-spacing: -0.01em; }
  .page-head:not(.page-head--intranet) p { margin-top: 2rem; max-width: 40rem; color: #435254; font-size: 1.5rem; line-height: 1.25; }
  .page-head .migas { color: var(--ink-soft); }
  .page-head .migas a { color: var(--forest); }
  .page-head .btn--line { color: var(--forest); }
  .page-head__fondo { position: relative; inset: auto; z-index: auto; order: 2; margin: 2.5rem 0 0 var(--gutter); height: 15.3rem; }
  .page-head__fondo::after { display: none; }
  .page-head--foto .page-head__grid { gap: 2.5rem; }
  .page-head--foto .page-head__foto { max-width: none; height: 15.3rem; margin-right: calc(-1 * var(--gutter)); }
  .page-head--foto .page-head__foto > img { height: 100%; aspect-ratio: auto; }
  .page-head .indice a { color: var(--ink); border-color: var(--line); }
  .page-head .indice__n { color: var(--ink-soft); }
  .page-head .indice svg { color: var(--brand); }
  .page-head .indice a:hover { color: var(--brand); }
}
@media (max-width: 46rem) {
  :root { --gutter: 1.5rem; }
  .sellos.sellos--hero img { height: 3.1rem; }
  .page-head:not(.page-head--intranet) p { font-size: 1rem; line-height: 1.375; }
  .page-head__fondo, .page-head--foto .page-head__foto { height: 12.5rem; }
}
@media (prefers-reduced-motion: reduce) { .hero__puntos { display: none !important; } }
