/*
Theme Name: Red de Portales — Base parametrizable
Description: Tema hijo compartido de la Red de Portales. Sin datos de ninguna comuna en el código; todo se configura por sitio.
Author: Red de Portales
Template: generatepress
Version: 0.11.6
Text Domain: red-portales-base
Requires at least: 6.6
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/*
 * Base visual derivada de maqueta-penalolen-v5.html.
 * El color de cada portal se define en la configuración (opción red_portales_config)
 * y el tema lo aplica sobre estas variables sin duplicar la hoja de estilos.
 */
:root {
  --portal-ink: #223233;
  --portal-muted: #4a5c5d;
  --portal-primary: #276d73;
  --portal-background: #fbfaf5;
  --portal-surface: #ffffff;
  --portal-line: #d1dfde;
  --portal-pale: #eaf4f3;
  --portal-accent: #e8bb6e;
  --portal-focus: #b36b19;
  --portal-content-width: 980px;
  --portal-radius: 5px;
  --portal-font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;
  --portal-font-serif: Georgia, "Times New Roman", serif;
}

html {
  scroll-behavior: smooth;
}

body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  background: var(--portal-surface);
  color: var(--portal-ink);
  font-family: var(--portal-font-sans);
  font-size: 19px;
  line-height: 1.5;
}

#page {
  width: 100%;
  flex: 1 0 auto;
}

.site-header,
.site-footer {
  flex: 0 0 auto;
}

a {
  color: var(--portal-primary);
  text-underline-offset: 0.18em;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--portal-focus);
  outline-offset: 3px;
}

h1,
h2,
.entry-title,
.site-info__title {
  color: var(--portal-ink);
  font-family: var(--portal-font-serif);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.12;
}

.grid-container,
.site-grid,
.inside-header,
.inside-navigation,
.inside-site-info {
  max-width: var(--portal-content-width);
}

.site-header,
.main-navigation,
.site-footer {
  background: var(--portal-surface);
}

.site-header,
.site-footer {
  border-color: var(--portal-line);
}

/* Mantiene la navegación disponible en páginas largas sin usar JavaScript. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  border-bottom: 1px solid var(--portal-line);
  box-shadow: 0 2px 10px rgb(34 50 51 / 8%);
}

body.admin-bar .site-header {
  top: 32px;
}

.inside-header {
  padding-top: 14px;
  padding-right: 0;
  padding-bottom: 14px;
  padding-left: 0;
}

.site-logo img,
.custom-logo {
  width: auto;
  max-width: 300px;
  height: auto;
  max-height: 48px;
}

/* Navegación principal legible sin alterar la escala ya aprobada en móvil. */
@media (min-width: 651px) {
  .main-navigation .main-nav > ul > li > a {
    font-size: 17px;
  }
}

/* GeneratePress conserva el título junto al logo salvo que se oculte explícitamente. */
.site-branding-container:has(.site-logo) .site-branding {
  display: none;
}

.site-content {
  padding-top: 32px;
  padding-bottom: 0;
}

/* Evita franjas vacías entre el último contenido y el pie en toda la red. */
#primary .site-main {
  margin-bottom: 0;
}

.site-footer {
  border-top: 1px solid var(--portal-line);
}

/* Une las imágenes destacadas al encabezado y al contenido, sin franjas marfil. */
body.featured-image-active .page-header-image {
  margin-top: 0;
}

body.featured-image-active #content {
  padding-top: 0;
}

body.featured-image-active #primary .site-main {
  margin-top: 0;
}

.inside-article {
  background: transparent;
}

.entry-content {
  max-width: none;
}

.single .entry-content {
  max-width: 760px;
  margin-right: auto;
  margin-left: auto;
}

/* Los contenidos interiores usan una sola columna editorial. */
.single .content-area,
body.page:not(.home) .content-area,
.archive .content-area,
.search .content-area {
  width: 100%;
}

.single .widget-area,
body.page:not(.home) .widget-area,
.archive .widget-area,
.search .widget-area {
  display: none !important;
}

.single .entry-header,
.single .entry-meta,
.single .featured-image {
  max-width: 760px;
  margin-right: auto;
  margin-left: auto;
}

.single .featured-image img {
  width: 100%;
  max-height: 430px;
  object-fit: cover;
}

/* Las imágenes destacadas de listados llenan la columna sin deformarse. */
.archive .post-image a,
.search .post-image a {
  display: block;
}

.archive .post-image img,
.search .post-image img {
  display: block;
  width: 100%;
  height: auto;
}

.entry-meta {
  color: var(--portal-muted);
  font-size: 14px;
}

/* La fecha y el autor son datos internos; no distraen la lectura pública. */
.entry-header .entry-meta {
  display: none;
}

/* Directorio de trámites: la tarea del usuario aparece antes del texto editorial. */
.portal-directory {
  max-width: 980px;
  margin: 30px auto 48px;
}

.portal-directory__section {
  margin-top: 34px;
}

.portal-directory__section > h2 {
  margin: 0 0 6px;
  font-size: clamp(27px, 4vw, 36px);
}

.portal-directory__section-intro {
  margin: 0 0 17px;
  color: var(--portal-muted);
  font-size: 16px;
}

.portal-directory__group {
  margin-top: 30px;
}

.portal-directory__group > h3 {
  margin: 0 0 12px;
  color: var(--portal-ink);
  font-family: var(--portal-font-sans);
  font-size: 19px;
  line-height: 1.3;
}

.portal-directory__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.portal-directory__card {
  display: flex;
  min-height: 132px;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--portal-border, #b9cdcb);
  border-left: 5px solid var(--portal-primary);
  border-radius: 7px;
  background: var(--portal-surface);
  padding: 18px 19px 16px;
  color: var(--portal-ink);
  text-decoration: none;
  box-shadow: 0 2px 9px rgb(34 50 51 / 5%);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.portal-directory__card:hover,
.portal-directory__card:focus-visible {
  border-color: var(--portal-primary);
  color: var(--portal-ink);
  box-shadow: 0 8px 22px rgb(34 50 51 / 12%);
  transform: translateY(-2px);
}

.portal-directory__card-title {
  display: block;
  margin-bottom: 7px;
  font-size: 19px;
  font-weight: 750;
  line-height: 1.25;
}

.portal-directory__card-summary {
  display: block;
  color: var(--portal-muted);
  font-size: 15px;
  line-height: 1.4;
}

.portal-directory__card-action {
  display: block;
  margin-top: 13px;
  color: var(--portal-primary);
  font-size: 14px;
  font-weight: 750;
}

.portal-directory__seo {
  max-width: 760px;
  margin: 58px auto 0;
  border-top: 1px solid var(--portal-line);
  padding-top: 34px;
}

.portal-directory__seo > h2:first-child {
  margin-top: 0;
}

/* Cierre de páginas informativas: cuatro rutas claras para continuar. */
.portal-continuation {
  box-sizing: border-box;
  max-width: 980px;
  margin: 56px auto 0;
  border: 1px solid var(--portal-line);
  border-radius: 12px;
  background: var(--portal-pale);
  padding: 28px;
}

.portal-continuation__kicker {
  margin: 0 0 5px;
  color: var(--portal-primary);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-continuation h2 {
  margin: 0 0 20px;
  font-size: clamp(29px, 4vw, 39px);
}

.portal-continuation__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.portal-continuation__card {
  display: block;
  border: 1px solid var(--portal-border, #b9cdcb);
  border-left: 5px solid var(--portal-primary);
  border-radius: 7px;
  background: var(--portal-surface);
  padding: 15px 16px;
  color: var(--portal-ink);
  text-decoration: none;
  box-shadow: 0 2px 9px rgb(34 50 51 / 5%);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.portal-continuation__card:hover,
.portal-continuation__card:focus-visible {
  border-color: var(--portal-primary);
  color: var(--portal-ink);
  box-shadow: 0 8px 22px rgb(34 50 51 / 12%);
  transform: translateY(-2px);
}

.portal-continuation__card-title,
.portal-continuation__card-summary {
  display: block;
}

.portal-continuation__card-title {
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.3;
}

.portal-continuation__card-summary {
  color: var(--portal-muted);
  font-size: 14px;
  line-height: 1.4;
}

/* Cierre útil de cada trámite: evita la navegación cronológica entre categorías. */
.portal-tramite-single footer.entry-meta,
.portal-tramite-single #nav-below,
.portal-tramite-single .post-navigation {
  display: none !important;
}

/* Todas las entradas cierran con navegación temática, no cronológica. */
.single-post footer.entry-meta,
.single-post #nav-below,
.single-post .post-navigation {
  display: none !important;
}

.portal-tramite-single .entry-content h6 {
  color: var(--portal-muted);
  font-family: var(--portal-font-sans);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.6;
}

.portal-related {
  max-width: 760px;
  margin: 48px auto 8px;
  border-top: 1px solid var(--portal-line);
  padding-top: 30px;
}

.portal-related__all {
  display: inline-flex;
  min-height: 52px;
  box-sizing: border-box;
  align-items: center;
  border: 2px solid var(--portal-primary);
  border-radius: 7px;
  padding: 11px 17px;
  font-size: 18px;
  font-weight: 750;
  text-decoration: none;
}

.portal-related__all:hover,
.portal-related__all:focus-visible {
  background: var(--portal-primary);
  color: #fff;
}

.portal-related h2 {
  margin: 35px 0 7px;
  font-size: clamp(27px, 4vw, 36px);
}

.portal-related__intro {
  margin: 0 0 18px;
  color: var(--portal-muted);
  font-size: 18px;
}

.portal-related .portal-directory__card-title {
  font-size: 20px;
}

.portal-related .portal-directory__card-summary {
  font-size: 16px;
}

.portal-related__articles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.portal-related__article {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--portal-line);
  border-radius: 9px;
  background: var(--portal-surface);
  color: var(--portal-ink);
  text-decoration: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.portal-related__article:hover,
.portal-related__article:focus-visible {
  border-color: var(--portal-primary);
  box-shadow: 0 10px 24px rgb(34 50 51 / 12%);
  color: var(--portal-ink);
  transform: translateY(-2px);
}

.portal-related__article-media {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background:
    radial-gradient(circle at 78% 24%, rgb(255 255 255 / 16%) 0 19%, transparent 20%),
    linear-gradient(135deg, var(--portal-primary), var(--portal-primary-light, #3b898c));
}

.portal-related__article-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 220ms ease;
}

.portal-related__article:hover .portal-related__article-media img,
.portal-related__article:focus-visible .portal-related__article-media img {
  transform: scale(1.025);
}

.portal-related__article-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 18px;
}

.portal-related__article-title {
  font-family: var(--portal-font-serif);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

.portal-related__article-summary {
  margin-top: 9px;
  color: var(--portal-muted);
  font-size: 16px;
  line-height: 1.5;
}

.portal-related__article-action {
  margin-top: auto;
  padding-top: 15px;
  color: var(--portal-primary);
  font-size: 15px;
  font-weight: 750;
}

/* Agenda continua: cabecera reconocible y sin franjas marfil entre entradas. */
.category-agenda .site-content {
  padding-top: 0;
}

.category-agenda .site-main {
  margin-top: 0;
  background: var(--portal-surface);
}

.category-agenda .page-header,
.category-agenda .inside-article {
  background: var(--portal-surface);
}

.category-agenda .page-header {
  position: relative;
  overflow: hidden;
  margin-bottom: 0;
  padding: clamp(32px, 6vw, 58px) 40px;
  background: linear-gradient(135deg, var(--portal-primary-dark, #205f63) 0%, var(--portal-primary) 58%, var(--portal-primary-light, #39878a) 100%);
  color: var(--portal-surface);
}

.category-agenda .page-title {
  position: relative;
  z-index: 1;
  max-width: var(--portal-content-width);
  margin: 0 auto;
  transform: translateX(2px);
  color: var(--portal-surface);
  font-size: clamp(44px, 7vw, 68px);
  line-height: 1.04;
}

.category-agenda .page-title::before {
  display: block;
  margin-bottom: 9px;
  color: var(--portal-tint, #d6eeee);
  font-family: var(--portal-font-sans);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: 0.11em;
  line-height: 1.3;
  text-transform: uppercase;
  content: "Actividades y panoramas";
}

.category-agenda.separate-containers .site-main > article {
  margin-bottom: 0;
  border-bottom: 1px solid var(--portal-line);
}

.category-agenda.separate-containers .site-main > article:last-of-type {
  border-bottom: 0;
}

/* Índices centrales de Servicios útiles y Conoce tu comuna. */
.portal-hub {
  max-width: 980px;
  margin: 8px auto 20px;
}

.portal-hub__lead {
  max-width: 720px;
  margin-bottom: 28px;
  color: var(--portal-muted);
}

.portal-hub .portal-directory__card {
  min-height: 142px;
}

/* Páginas principales: sin franjas marfil y con jerarquía visual común. */
body.page:not(.home) .site-content {
  padding-top: 0;
}

body.page:not(.home) #primary .site-main {
  margin-top: 0;
}

.portal-section-page .inside-article {
  padding: 0 0 44px;
  background: var(--portal-surface);
}

.portal-section-page .entry-header {
  max-width: none;
  margin: 0;
  padding: clamp(30px, 5vw, 52px) max(30px, calc((100% - var(--portal-content-width)) / 2));
  background: linear-gradient(135deg, var(--portal-primary-dark, #205f63) 0%, var(--portal-primary) 62%, var(--portal-primary-light, #39878a) 100%);
}

.portal-section-page .entry-title {
  max-width: var(--portal-content-width);
  margin: 0 auto;
  color: #fff;
  font-size: clamp(42px, 6vw, 64px);
}

.portal-section-page .entry-title::before {
  display: block;
  margin-bottom: 9px;
  color: var(--portal-tint, #d6eeee);
  font-family: var(--portal-font-sans);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: 0.11em;
  line-height: 1.3;
  text-transform: uppercase;
}

.portal-section--services .entry-title::before {
  content: "Información práctica";
}

.portal-section--discover .entry-title::before {
  content: var(--portal-discover-kicker, "Descubre tu comuna");
}

.portal-section--parks .entry-title::before {
  content: "Naturaleza y aire libre";
}

.portal-section--weather .entry-title::before {
  content: "Condiciones locales";
}

.portal-section-page .entry-content {
  max-width: var(--portal-content-width);
  margin: 0 auto;
  padding: clamp(28px, 4vw, 42px) 30px 0;
}

/* La red ya no utiliza los widgets ni las barras comerciales heredadas. */
.footer-widgets,
.e-floating-bars {
  display: none !important;
}

.wp-block-button__link,
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  border-radius: var(--portal-radius);
}

/* Portada comunal en bloques nativos. */
.portal-home {
  max-width: var(--portal-content-width);
  margin-inline: auto;
}

.portal-home-main {
  width: 100%;
}

.portal-hero {
  padding: 20px 0 27px;
}

.portal-kicker {
  margin: 0 0 8px;
  color: var(--portal-primary);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: 0.02em;
}

.portal-hero h1 {
  margin: 0 0 14px;
  font-size: clamp(35px, 5vw, 53px);
}

.portal-lead {
  max-width: 650px;
  margin: 0 0 22px;
  color: var(--portal-muted);
  font-size: 19px;
}

.portal-shortcuts {
  padding: 6px 0 31px;
}

.portal-shortcuts > h2 {
  margin: 0 0 13px;
  font-family: var(--portal-font-sans);
  font-size: 18px;
  letter-spacing: -0.01em;
}

.portal-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

.portal-tile {
  display: block;
  box-sizing: border-box;
  min-height: 117px;
  margin: 0;
  border: 1.5px solid var(--portal-line);
  border-left: 5px solid var(--portal-primary);
  border-radius: var(--portal-radius);
  background: var(--portal-surface);
  padding: 18px 17px 17px;
  color: var(--portal-ink);
  text-decoration: none;
}

.portal-tile:hover {
  border-color: #a4b7a9;
  background: var(--portal-pale);
}

.portal-tile h3 {
  margin: 0;
  font-family: var(--portal-font-sans);
  font-size: clamp(20px, 2.5vw, 24px);
  line-height: 1.25;
}

.portal-tile h3,
.portal-tile h3 a {
  color: var(--portal-ink);
  text-decoration-color: #9eae9f;
  text-decoration-thickness: 1px;
}

.portal-tile p {
  margin: 7px 0 0;
  color: var(--portal-muted);
  font-size: 15px;
}

.portal-landscape {
  margin: 0 0 8px;
}

.portal-landscape img {
  width: 100%;
  height: auto;
  display: block;
}

.portal-landscape figcaption {
  margin-top: 7px;
  color: var(--portal-muted);
  font-size: 13px;
  text-align: left;
}

.portal-content-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 55px;
  margin: 0;
  border-top: 1px solid var(--portal-line);
  padding: 30px 0 46px;
}

.portal-section-title {
  margin: 0 0 8px;
  font-size: 27px;
}

.portal-intro {
  margin: 0 0 17px;
  color: var(--portal-muted);
  font-size: 16px;
}

.portal-links {
  margin: 0;
  padding: 0;
  list-style: none;
}

.portal-links li {
  margin: 0;
  border-bottom: 1px solid var(--portal-line);
  padding: 12px 0;
}

.portal-links a {
  font-size: 18px;
  font-weight: 650;
}

.portal-links small {
  display: block;
  margin-top: 3px;
  color: var(--portal-muted);
  font-size: 14px;
}

.portal-note {
  margin-top: 19px;
  border-radius: var(--portal-radius);
  background: var(--portal-pale);
  padding: 18px;
  font-size: 16px;
}

.portal-note strong {
  display: block;
  margin-bottom: 4px;
}

/* Tarjeta climática compartida. Los datos se obtienen y cachean en el servidor. */
.portal-weather {
  max-width: 820px;
  margin: 28px 0;
  border: 1px solid var(--portal-line);
  border-top: 5px solid var(--portal-primary);
  border-radius: var(--portal-radius);
  background: var(--portal-surface);
  padding: clamp(20px, 4vw, 32px);
}

.portal-weather__heading,
.portal-weather__updated,
.portal-weather__source,
.portal-weather__condition,
.portal-weather__day p {
  margin-top: 0;
}

.portal-weather__heading {
  margin-bottom: 18px;
  font-size: clamp(25px, 4vw, 34px);
}

.portal-weather__current {
  display: grid;
  grid-template-columns: minmax(130px, 0.7fr) minmax(220px, 1.3fr);
  gap: 24px;
  align-items: center;
  margin-bottom: 25px;
}

.portal-weather__temperature {
  margin: 0;
  color: var(--portal-ink);
  font-family: var(--portal-font-serif);
  font-size: clamp(58px, 10vw, 82px);
  font-weight: 700;
  letter-spacing: -0.06em;
  line-height: 0.95;
}

.portal-weather__condition {
  margin-bottom: 11px;
  color: var(--portal-muted);
  font-size: 18px;
}

.portal-weather__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 20px;
  margin: 0;
}

.portal-weather__facts div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--portal-line);
  padding-bottom: 6px;
}

.portal-weather__facts dt {
  color: var(--portal-muted);
}

.portal-weather__facts dd {
  margin: 0;
  font-weight: 700;
}

.portal-weather__forecast {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 22px;
}

.portal-weather__day {
  border-radius: var(--portal-radius);
  background: var(--portal-pale);
  padding: 14px;
}

.portal-weather__day h3 {
  margin: 0 0 6px;
  font-family: var(--portal-font-sans);
  font-size: 16px;
}

.portal-weather__day p {
  margin-bottom: 4px;
  color: var(--portal-muted);
  font-size: 14px;
}

.portal-weather__day strong {
  font-size: 18px;
}

.portal-weather__updated,
.portal-weather__source {
  color: var(--portal-muted);
  font-size: 13px;
}

.portal-weather__updated {
  margin-bottom: 5px;
}

.portal-weather__source {
  margin-bottom: 17px;
}

.portal-weather__link {
  display: inline-block;
  border-radius: var(--portal-radius);
  background: var(--portal-primary);
  padding: 11px 16px;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.portal-weather__link:hover,
.portal-weather__link:focus {
  background: var(--portal-ink);
  color: #fff;
}

@media (max-width: 650px) {
  body {
    font-size: 18px;
  }

  .inside-header {
    padding-top: 10px;
    padding-right: 18px;
    padding-bottom: 10px;
    padding-left: 18px;
  }

  body.admin-bar .site-header {
    top: 46px;
  }

  .separate-containers .inside-article {
    padding-right: 18px;
    padding-left: 18px;
  }

  .portal-section-page.separate-containers .inside-article {
    padding-right: 0;
    padding-left: 0;
  }

  .portal-section-page .entry-header {
    padding: 26px 18px 29px;
  }

  .portal-section-page .entry-title {
    font-size: clamp(38px, 11vw, 50px);
  }

  .portal-section-page .entry-content {
    padding: 27px 18px 0;
  }

  .category-agenda .page-header {
    padding-right: 18px;
    padding-left: 18px;
  }

  .portal-home,
  .portal-home > .wp-block-group,
  .portal-home > .wp-block-image {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .portal-home-main .portal-home {
    box-sizing: border-box;
    padding-right: 18px;
    padding-left: 18px;
  }

  /* WordPress añade este contenedor a los grupos clásicos. */
  .portal-home .wp-block-group__inner-container {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .site-content {
    padding-top: 24px;
    padding-bottom: 0;
  }

  .portal-hero {
    padding: 14px 0 23px;
  }

  .portal-lead {
    font-size: 18px;
  }

  .site-logo img,
  .custom-logo {
    max-width: 230px;
    max-height: 37px;
  }

  /* Menú móvil: lectura cómoda y objetivos táctiles amplios en toda la red. */
  .main-navigation.toggled .main-nav > ul > li > a {
    min-height: 64px;
    padding: 18px 22px;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.4;
  }

  .portal-tiles,
  .portal-content-grid,
  .portal-directory__grid,
  .portal-related__articles,
  .portal-continuation__grid {
    grid-template-columns: 1fr;
  }

  .portal-continuation {
    margin-top: 40px;
    border-radius: 9px;
    padding: 22px 16px;
  }

  .portal-directory {
    margin-top: 24px;
  }

  .portal-directory__card {
    min-height: 0;
    padding: 16px;
  }

  .portal-related {
    margin-top: 38px;
    padding-top: 24px;
  }

  .portal-related__all {
    width: 100%;
    justify-content: center;
    font-size: 18px;
  }

  .portal-tile {
    min-height: 0;
    padding: 16px 13px;
  }

  .portal-content-grid {
    gap: 36px;
    padding-top: 26px;
  }

  .portal-weather__current,
  .portal-weather__forecast {
    grid-template-columns: 1fr;
  }

  .portal-weather__facts {
    grid-template-columns: 1fr;
  }
}

/* rp-gutter v2
   Márgenes laterales en pantallas intermedias (tablets y ventanas angostas).
   Entre 651 px y el ancho del contenido, el encabezado y la portada quedaban pegados a los bordes.
   El ancho máximo crece lo mismo que el margen, así el diseño de escritorio no cambia.
   El menú reduce su espaciado en ventanas de hasta 960 px para que no salte a dos líneas. */
@media (min-width: 651px) {
  :root {
    --portal-gutter: clamp(24px, 4vw, 40px);
  }

  .inside-header {
    box-sizing: border-box;
    max-width: calc(var(--portal-content-width) + 40px);
    padding-right: 20px;
    padding-left: 20px;
  }

  .portal-home-main .portal-home {
    box-sizing: border-box;
    max-width: calc(var(--portal-content-width) + 2 * var(--portal-gutter));
    padding-right: var(--portal-gutter);
    padding-left: var(--portal-gutter);
  }
}

@media (min-width: 769px) and (max-width: 960px) {
  .main-navigation .main-nav > ul > li > a {
    padding-right: 12px;
    padding-left: 12px;
  }
}

/* rp-landscape
   La imagen de la portada se recorta siempre a 1200 x 630 px (proporción 1,905:1, la misma de Peñalolén),
   sin importar las medidas del archivo. Así, al reemplazarla a mano, no hace falta recortarla antes. */
.portal-landscape img {
  aspect-ratio: 1200 / 630;
  object-fit: cover;
  object-position: center;
}

/* rp-alineacion
   Si la imagen o el bloque de listas de la portada quedaron fuera del grupo portal-home
   (plantilla antigua), se alinean con el mismo margen que el resto del contenido. */
.portal-home-main > .portal-landscape,
.portal-home-main > .portal-content-grid {
  box-sizing: border-box;
  margin-right: var(--portal-gutter, 18px);
  margin-left: var(--portal-gutter, 18px);
}


/* rp-agenda-vacia
   Estado vacío de la Agenda: mensaje breve y los cuatro destinos del portal. */
.portal-agenda-empty {
  box-sizing: border-box;
  max-width: var(--portal-content-width);
  margin: 0 auto;
  padding: 36px var(--portal-gutter, 18px) 56px;
}

.portal-agenda-empty__text {
  margin: 0;
  color: var(--portal-muted);
  font-size: 21px;
  line-height: 1.5;
}