/* ==========================================================================
   site.css — patrones de sección para las páginas de contenido
   (index, nosotros, secretarías, noticias, radio, eventos, contacto). Requiere base.css.
   Documentación y snippets: tools/DESIGN.md
   ========================================================================== */

/* ---------- Page hero (interior) ---------- */
.page-hero {
  --c: var(--primary-strong);
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--surface); color: var(--text);
  padding-block: clamp(3rem, 7vw, 5.5rem) clamp(2.5rem, 6vw, 4.5rem);
}
.page-hero::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; background: var(--c); z-index: 1; }
.page-hero__content { max-width: 52rem; position: relative; }
.page-hero .eyebrow { color: var(--c); }
.page-hero h1 { margin-bottom: var(--sp-4); }
.page-hero .lead { max-width: 60ch; }
.page-hero__actions { margin-top: var(--sp-8); }
.page-hero--image { color: #fff; background: var(--c); display: grid; align-items: end; min-height: clamp(22rem, 48vh, 34rem); padding-block: clamp(3rem, 8vw, 6rem) clamp(2rem, 5vw, 3.5rem); }
.page-hero--image::before { display: none; }
.page-hero--image .page-hero__media { position: absolute; inset: 0; z-index: -2; }
.page-hero--image .page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero--image .page-hero__scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, color-mix(in srgb, var(--scrim) 55%, transparent), var(--scrim) 70%, color-mix(in srgb, var(--scrim) 100%, #0B1020 30%)); }
.page-hero--image h1, .page-hero--image .h1, .page-hero--image h2, .page-hero--image .eyebrow { color: #fff; }
.page-hero--image .eyebrow { color: #fff; }
.page-hero--image .lead { color: #fff; }
.page-hero--color { background: linear-gradient(160deg, color-mix(in srgb, var(--c) 88%, #0B1020), var(--c) 70%); color: #fff; }
.page-hero--color::before { display: none; }
.page-hero--color h1, .page-hero--color .h1, .page-hero--color h2 { color: #fff; }
.page-hero--color .eyebrow { color: #fff; }
.page-hero--color .lead { color: #fff; }
.page-hero--color .btn--secondary { --btn-fg: #fff; --btn-bd: rgb(255 255 255 / .7); --btn-bg-h: rgb(255 255 255 / .12); }
.page-hero--color .btn--primary { --btn-bg: #fff; --btn-fg: var(--c); --btn-bg-h: #EBEEF7; box-shadow: none; }
.page-hero__pattern { position: absolute; right: -6rem; top: -6rem; width: 30rem; height: 30rem; border-radius: 50%; background: radial-gradient(circle at 30% 30%, rgb(255 255 255 / .16), transparent 62%); pointer-events: none; }
.page-hero--image .page-hero__pattern, .page-hero--color .page-hero__pattern { display: block; }
.page-hero__pattern { display: none; }

/* ---------- Breadcrumbs ---------- */
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; font-size: var(--fs-small); color: var(--text-muted); margin-bottom: var(--sp-4); }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover { color: var(--primary); text-decoration: underline; }
.breadcrumbs li + li::before { content: "/"; opacity: .5; margin-right: .5rem; }
.breadcrumbs [aria-current="page"] { color: var(--text); font-weight: 600; }
.page-hero--image .breadcrumbs, .page-hero--color .breadcrumbs { color: #fff; }
.page-hero--image .breadcrumbs [aria-current="page"], .page-hero--color .breadcrumbs [aria-current="page"] { color: #fff; }

/* ---------- Feature grid (funciones de secretaría, pilares con ícono) ---------- */
.feature-grid { display: grid; gap: clamp(1rem, 2.5vw, 1.5rem); }
@media (min-width: 600px) { .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .feature-grid { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); } }
.feature { --c: var(--primary); position: relative; padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); display: grid; gap: var(--sp-3); align-content: start; transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base); }
.feature:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--c) 40%, var(--border)); }
.section--alt .feature { border-color: transparent; box-shadow: var(--shadow-sm); }
.feature__icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: var(--radius); background: color-mix(in srgb, var(--c) 12%, var(--bg)); color: var(--c); }
[data-theme="dark"] .feature__icon { background: color-mix(in srgb, var(--c) 26%, var(--bg)); color: color-mix(in srgb, var(--c) 50%, #fff); }
.feature__icon svg { width: 1.5rem; height: 1.5rem; }
.feature__title { font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; letter-spacing: -.01em; line-height: 1.2; }
.feature__text { color: var(--text-muted); font-size: .9375rem; }
.feature__num { position: absolute; top: 1.25rem; right: 1.25rem; font-family: var(--font-display); font-size: 2rem; line-height: 1; color: color-mix(in srgb, var(--c) 22%, transparent); font-weight: 600; }

/* ---------- Split (imagen + texto, sticky) ---------- */
.split { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (min-width: 900px) {
  .split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split--media-right .split__media { order: 2; }
  .split__media--sticky { position: sticky; top: calc(var(--header-h) + 1.5rem); }
  .split--60 { grid-template-columns: 1.15fr .85fr; }
}
.split__media { border-radius: var(--radius-lg); overflow: hidden; background: var(--surface-2); box-shadow: var(--shadow); }
.split__media img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.split__media--portrait img { aspect-ratio: 3 / 4; }
.split__media--square img { aspect-ratio: 1; }
.split__body > .eyebrow { margin-bottom: var(--sp-3); }
.split__body h2, .split__body .h2, .split__body .h1 { margin-bottom: var(--sp-6); }
.split__body .prose + .btn-group, .split__body .prose + .btn { margin-top: var(--sp-8); }
.split__caption { display: flex; gap: .75rem; align-items: center; margin-top: var(--sp-3); font-size: var(--fs-small); color: var(--text-muted); }

/* ---------- Quote (cita con foto circular) ---------- */
.quote { --c: var(--primary); display: grid; gap: var(--sp-6); align-items: center; justify-items: center; text-align: center; max-width: 52rem; margin-inline: auto; }
.quote__photo { width: clamp(6rem, 14vw, 8.5rem); height: clamp(6rem, 14vw, 8.5rem); border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 5px var(--bg), 0 0 0 7px var(--c); }
.quote__text { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.375rem, 1.1rem + 1.4vw, 2.125rem); line-height: 1.3; letter-spacing: -.01em; color: var(--text); text-wrap: balance; }
.quote__text::before { content: "“"; display: block; font-size: 2.2em; line-height: .6; color: var(--c); margin-bottom: .25em; font-weight: 600; }
.quote__author { font-size: var(--fs-small); color: var(--text-muted); }
.quote__author strong { display: block; font-size: 1rem; color: var(--text); }
@media (min-width: 768px) {
  .quote--side { grid-template-columns: auto 1fr; text-align: left; justify-items: start; gap: var(--sp-8); }
  .quote--side .quote__text::before { display: inline; line-height: 1; margin-right: .1em; font-size: 1.4em; vertical-align: -.1em; }
}
.quote--dark .quote__text, .section--dark .quote__text { color: var(--text); }

/* ---------- Pillars (3 pilares numerados) ---------- */
.pillars { display: grid; gap: clamp(1rem, 2.5vw, 2rem); counter-reset: pillar; }
@media (min-width: 768px) { .pillars { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pillar { counter-increment: pillar; position: relative; padding: clamp(1.5rem, 3vw, 2rem); padding-top: clamp(2.5rem, 4vw, 3rem); border-top: 2px solid var(--border); display: grid; gap: var(--sp-3); align-content: start; }
.pillar::before { content: "0" counter(pillar); position: absolute; top: -.85rem; left: clamp(1.5rem, 3vw, 2rem); padding: .1rem .6rem; background: var(--bg); font-family: var(--font-display); font-weight: 600; font-size: 1.125rem; color: var(--primary); letter-spacing: .02em; }
.section--alt .pillar::before { background: var(--surface); }
.pillar__title { font-family: var(--font-display); font-weight: 600; font-size: 1.5rem; letter-spacing: -.01em; line-height: 1.15; }
.pillar__text { color: var(--text-muted); }

/* ---------- News ---------- */
.news-card .card__media { aspect-ratio: 16 / 10; }
.news-card__date { font-size: var(--fs-small); color: var(--text-muted); font-weight: 600; letter-spacing: .02em; }
.news-card .card__title { font-size: 1.3125rem; }
.news-card--featured { display: grid; }
@media (min-width: 900px) { .news-card--featured { grid-template-columns: 1.2fr 1fr; } .news-card--featured .card__media { aspect-ratio: auto; min-height: 100%; } .news-card--featured .card__body { padding: clamp(1.75rem, 4vw, 3rem); justify-content: center; } .news-card--featured .card__title { font-size: var(--fs-h3); } }
.news-card--noimage .card__body { padding-top: clamp(1.75rem, 4vw, 2.5rem); }
.news-card--noimage .card__body::before { content: ""; width: 3rem; height: 4px; border-radius: 4px; background: var(--primary); }
.news-list { display: grid; gap: clamp(1rem, 2.5vw, 1.75rem); }
@media (min-width: 600px) { .news-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .news-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.share { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; }
.share__label { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-right: .25rem; }

/* ---------- Gallery (scroll-snap + botones) ---------- */
.gallery { position: relative; }
.gallery__track {
  display: flex; gap: var(--sp-4); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter);
  padding-block: .25rem .75rem; scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; -webkit-overflow-scrolling: touch;
}
.gallery__item { flex: 0 0 min(78%, 22rem); scroll-snap-align: start; margin: 0; }
@media (min-width: 768px) { .gallery__item { flex-basis: min(42%, 26rem); } }
@media (min-width: 1200px) { .gallery__item { flex-basis: calc((100% - 2 * var(--sp-4)) / 3); } }
.gallery__btn { display: block; width: 100%; border-radius: var(--radius); overflow: hidden; background: var(--surface-2); aspect-ratio: 4 / 3; position: relative; cursor: zoom-in; }
.gallery__btn img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-reveal) var(--ease-out); }
.gallery__btn:hover img { transform: scale(1.04); }
.gallery__btn:focus-visible { outline-offset: 2px; }
.gallery__btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(11 16 32 / .35), transparent 45%); opacity: 0; transition: opacity var(--dur-base); }
.gallery__btn:hover::after { opacity: 1; }
.gallery__caption { margin-top: .5rem; font-size: var(--fs-small); color: var(--text-muted); }
.gallery__nav { display: flex; justify-content: flex-end; gap: .5rem; margin-bottom: var(--sp-4); }
.gallery__nav .btn--icon svg { width: 1.25rem; height: 1.25rem; }
.gallery--bleed .gallery__track { margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); }

/* ---------- Team ---------- */
.team-card { display: grid; align-content: start; justify-items: center; text-align: center; gap: var(--sp-3); padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.team-card__photo { width: 7.5rem; height: 7.5rem; border-radius: 50%; object-fit: cover; background: var(--surface-2); box-shadow: 0 0 0 4px var(--bg), 0 0 0 6px var(--primary-soft-2); }
.team-card__name { font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; letter-spacing: -.01em; }
.team-card__role { font-size: var(--fs-small); color: var(--text-muted); }
.avatar { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: color-mix(in srgb, var(--c, var(--primary)) 14%, var(--bg)); color: color-mix(in srgb, var(--c, var(--primary)) 78%, #000); font-weight: 700; font-size: .9375rem; letter-spacing: .02em; flex: none; }
[data-theme="dark"] .avatar { background: color-mix(in srgb, var(--c, var(--primary)) 28%, var(--bg)); color: color-mix(in srgb, var(--c, var(--primary)) 45%, #fff); }
.person { display: inline-flex; align-items: center; gap: .75rem; padding: .5rem .875rem .5rem .5rem; border: 1px solid var(--border); border-radius: var(--radius-full); background: var(--bg); }
.person__name { font-weight: 700; font-size: var(--fs-small); line-height: 1.2; }
.person__role { display: block; font-size: var(--fs-xs); color: var(--text-muted); font-weight: 500; }

/* ---------- CTA band ---------- */
.cta-band { --c: var(--primary); position: relative; isolation: isolate; overflow: hidden; border-radius: var(--radius-lg); background: var(--primary-strong); color: #fff; padding: clamp(2rem, 5vw, 4rem); display: grid; gap: var(--sp-6); align-items: center; }
[data-theme="dark"] .cta-band { background: var(--surface-2); border: 1px solid var(--border); color: var(--text); }
@media (min-width: 900px) { .cta-band { grid-template-columns: 1.4fr 1fr; } .cta-band__actions { justify-self: end; } }
.cta-band::before { content: ""; position: absolute; right: -8rem; top: -8rem; width: 26rem; height: 26rem; border-radius: 50%; background: radial-gradient(circle, rgb(255 255 255 / .14), transparent 65%); z-index: -1; }
.cta-band h2 { color: inherit; font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.75rem); margin-bottom: var(--sp-3); }
.cta-band p { color: color-mix(in srgb, currentColor 82%, transparent); max-width: 50ch; }
.cta-band .eyebrow { color: color-mix(in srgb, currentColor 85%, transparent); }
.cta-band__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.cta-band .btn--primary { --btn-bg: #fff; --btn-fg: #2023A3; --btn-bg-h: #EBEEF7; box-shadow: none; }
[data-theme="dark"] .cta-band .btn--primary { --btn-bg: var(--primary); --btn-fg: var(--primary-contrast); --btn-bg-h: var(--primary-strong); }
.cta-band .btn--secondary { --btn-fg: #fff; --btn-bd: rgb(255 255 255 / .7); --btn-bg-h: rgb(255 255 255 / .12); }
[data-theme="dark"] .cta-band .btn--secondary { --btn-fg: var(--text); --btn-bd: var(--border-strong); --btn-bg-h: var(--surface); }

/* ---------- Tag list ---------- */
.tag-list { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.tag-list--center { justify-content: center; }
.tag { display: inline-flex; align-items: center; gap: .4rem; padding: .4rem .9rem; border-radius: var(--radius-full); background: var(--primary-soft); color: var(--primary-strong); font-weight: 700; font-size: var(--fs-small); }
.tag--lg { font-family: var(--font-display); font-weight: 600; font-size: 1.125rem; padding: .6rem 1.25rem; }

/* ---------- Partner logos ---------- */
.partner-logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
@media (min-width: 600px) { .partner-logos { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); } }
.partner-logos__item { display: grid; place-items: center; min-height: 6rem; padding: var(--sp-4); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); }
.partner-logos__item img { max-height: 4.5rem; width: auto; object-fit: contain; filter: grayscale(1) contrast(1.15); opacity: .88; transition: filter var(--dur-base), opacity var(--dur-base), transform var(--dur-base) var(--ease-out); }
.partner-logos__item:hover img, .partner-logos__item:focus-within img { filter: none; opacity: 1; transform: scale(1.04); }
[data-theme="dark"] .partner-logos__item { background: #fff; border-color: transparent; }

/* ---------- Radio band (siempre oscura) ---------- */
.radio-band {
  color-scheme: dark;
  --bg: #0B1020; --surface: #141B36; --surface-2: #1C2547; --text: #E7EAF6; --text-muted: #A9B1CC;
  --primary: #8FA0FF; --primary-strong: #A9B8FF; --accent: #6F84FF; --border: #2A3457; --border-strong: #3B4775; --primary-contrast: #0B1020;
  --primary-soft: color-mix(in srgb, var(--primary) 12%, var(--bg));
  position: relative; isolation: isolate; overflow: hidden; background: var(--bg); color: var(--text);
}
[data-theme="dark"] .radio-band { --bg: #070B18; }
.radio-band::before { content: ""; position: absolute; left: -10rem; top: -10rem; width: 34rem; height: 34rem; border-radius: 50%; background: radial-gradient(circle, rgb(143 160 255 / .18), transparent 65%); z-index: -1; }
.radio-band .eyebrow { color: var(--primary); }
.radio-band h2, .radio-band h3 { color: var(--text); }
.radio-band__grid { display: grid; gap: var(--sp-8); align-items: center; }
@media (min-width: 900px) { .radio-band__grid { grid-template-columns: 1fr 1fr; } }
.radio-band__art { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.radio-band__art img { width: 100%; height: auto; }
.radio-band__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-4); }
.radio-band .btn--primary { --btn-bg: var(--primary); --btn-fg: var(--primary-contrast); --btn-bg-h: var(--primary-strong); }
.radio-band .btn--secondary { --btn-fg: var(--text); --btn-bd: var(--border-strong); --btn-bg-h: var(--surface); }
.radio-band .card, .radio-band .team-card { background: var(--surface); border-color: var(--border); }
.eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 1rem; }
.eq span { width: 3px; background: currentColor; border-radius: 2px; animation: eq 1s ease-in-out infinite; height: 40%; }
.eq span:nth-child(2) { animation-delay: .15s; } .eq span:nth-child(3) { animation-delay: .3s; } .eq span:nth-child(4) { animation-delay: .45s; }
@keyframes eq { 0%, 100% { height: 30%; } 50% { height: 100%; } }
@media (prefers-reduced-motion: reduce) { .eq span { animation: none; height: 60%; } }

/* ---------- Video facade (YouTube) ---------- */
.video-facade { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: var(--surface-2); display: block; width: 100%; cursor: pointer; }
.video-facade img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-reveal) var(--ease-out); }
.video-facade:hover img { transform: scale(1.03); }
.video-facade__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 4.25rem; height: 4.25rem; border-radius: 50%; background: rgb(255 255 255 / .92); color: #1B2FD9; box-shadow: var(--shadow-lg); transition: transform var(--dur-base) var(--ease-out), background-color var(--dur-fast); }
.video-facade:hover .video-facade__play { transform: translate(-50%, -50%) scale(1.08); background: #fff; }
.video-facade__play svg { width: 1.75rem; height: 1.75rem; margin-left: 3px; }
.video-facade iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-facade__duration { position: absolute; right: .75rem; bottom: .75rem; padding: .2rem .5rem; border-radius: var(--radius-sm); background: rgb(11 16 32 / .75); color: #fff; font-size: var(--fs-xs); font-weight: 700; font-variant-numeric: tabular-nums; }
.episode__title { font-family: var(--font-display); font-weight: 600; font-size: 1.1875rem; line-height: 1.25; margin-top: var(--sp-3); }
.episode__meta { font-size: var(--fs-small); color: var(--text-muted); margin-top: .25rem; }

/* ---------- Secretarías (cards de inicio) ---------- */
.secretaria-card { --c: var(--primary); position: relative; display: grid; gap: var(--sp-3); align-content: start; padding: clamp(1.5rem, 3vw, 2rem); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); text-decoration: none; color: var(--text); overflow: hidden; transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base); }
.secretaria-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 6px; background: var(--c); }
.secretaria-card:hover, .secretaria-card:focus-within { transform: translateY(-4px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--c) 45%, var(--border)); color: var(--text); }
.secretaria-card__kicker { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--c); }
[data-theme="dark"] .secretaria-card__kicker { color: color-mix(in srgb, var(--c) 55%, #fff); }
.secretaria-card__title { font-family: var(--font-display); font-weight: 600; font-size: 1.5rem; letter-spacing: -.01em; line-height: 1.15; }
.secretaria-card__title a { color: inherit; text-decoration: none; }
.secretaria-card__title a::after { content: ""; position: absolute; inset: 0; }
.secretaria-card__text { color: var(--text-muted); font-size: .9375rem; }
.secretaria-card__people { display: flex; flex-wrap: wrap; gap: .5rem; font-size: var(--fs-small); color: var(--text-muted); margin-top: auto; }
.secretaria-card__people .avatar { width: 2rem; height: 2rem; font-size: .75rem; }
.secretaria-card .link-arrow { color: var(--c); }
[data-theme="dark"] .secretaria-card .link-arrow { color: color-mix(in srgb, var(--c) 50%, #fff); }

/* ---------- Region cards (La Plata / Berisso / Ensenada) ---------- */
.region-card { position: relative; display: grid; gap: .5rem; padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); text-decoration: none; color: var(--text); transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base); }
.region-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--border-strong); color: var(--text); }
.region-card__name { font-family: var(--font-display); font-weight: 600; font-size: 1.5rem; letter-spacing: -.01em; }
.region-card__count { font-family: var(--font-display); font-weight: 600; font-size: 2.5rem; line-height: 1; letter-spacing: -.03em; color: var(--primary-strong); font-variant-numeric: tabular-nums; }
.region-card__label { font-size: var(--fs-small); color: var(--text-muted); }
.region-card .link-arrow { margin-top: .5rem; }

/* ---------- Result list (buscador instantáneo) ---------- */
.result-list { display: grid; gap: .25rem; }
.result { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .75rem 1rem; padding: .625rem .75rem; border-radius: var(--radius); text-decoration: none; color: var(--text); transition: background-color var(--dur-fast); }
.result:hover, .result:focus-visible { background: var(--surface-2); color: var(--text); }
.result__name { font-weight: 700; font-size: .9375rem; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.result__meta { font-size: var(--fs-xs); color: var(--text-muted); }
.result__action { font-size: var(--fs-xs); font-weight: 700; color: var(--primary); white-space: nowrap; }
.empty { padding: var(--sp-8) var(--sp-4); text-align: center; color: var(--text-muted); border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); }
.empty strong { display: block; color: var(--text); font-family: var(--font-display); font-size: 1.25rem; margin-bottom: .25rem; }

/* ---------- Contact list (dl con íconos) ---------- */
.contact-list { display: grid; gap: var(--sp-4); margin: 0; }
.contact-item { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "term actions" "value actions"; align-items: center; column-gap: var(--sp-4); padding: var(--sp-4); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); }
.contact-item__term { grid-area: term; display: flex; align-items: center; gap: var(--sp-4); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.contact-item__icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); flex: none; }
.contact-item__icon svg { width: 1.25rem; height: 1.25rem; }
.contact-item__value { grid-area: value; margin: -.6rem 0 0; padding-left: calc(2.75rem + var(--sp-4)); font-weight: 600; overflow-wrap: anywhere; }
.contact-item__value a { color: var(--text); text-decoration: none; }
.contact-item__value a:hover { color: var(--primary); text-decoration: underline; }
.contact-item__actions { grid-area: actions; margin: 0; display: flex; gap: .25rem; }
@media (max-width: 480px) { .contact-item { grid-template-columns: 1fr; grid-template-areas: "term" "value" "actions"; } .contact-item__actions { justify-content: flex-end; margin-top: .5rem; } }

/* ---------- Documentos (PDF) ---------- */
.doc-card { display: grid; grid-template-columns: auto 1fr; gap: var(--sp-4); align-items: center; padding: var(--sp-4) var(--sp-6) var(--sp-4) var(--sp-4); background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-lg); text-decoration: none; color: var(--text); transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base); }
.doc-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--border-strong); color: var(--text); }
.doc-card__icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); }
.doc-card__icon svg { width: 1.5rem; height: 1.5rem; }
.doc-card__title { font-weight: 700; }
.doc-card__meta { font-size: var(--fs-small); color: var(--text-muted); }

/* ---------- Nota de aviso (fondo ámbar suave; la usan los <noscript> de mapa y listado) ---------- */
.pending-note { display: flex; gap: .75rem; align-items: flex-start; padding: .875rem 1rem; border-radius: var(--radius); background: color-mix(in srgb, var(--warm) 14%, var(--bg)); border: 1px solid color-mix(in srgb, var(--warm) 45%, transparent); font-size: var(--fs-small); color: var(--text); }
.pending-note .badge { flex: none; }

/* ---------- Map teaser (SVG generado por site.js) ---------- */
.map-teaser { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); border: 1px solid var(--border); }
.map-teaser svg { width: 100%; height: auto; display: block; }
.map-teaser__legend { display: flex; flex-wrap: wrap; gap: .5rem; padding: var(--sp-4); border-top: 1px solid var(--border); background: var(--bg); }
.map-teaser__overlay { position: absolute; inset: auto 1rem 1rem auto; }

/* ---------- Íconos utilitarios ---------- */
.iconbox { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); }
.iconbox svg { width: 1.25rem; height: 1.25rem; }
.divider { display: flex; align-items: center; gap: var(--sp-4); color: var(--text-muted); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.divider::before, .divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.kicker-line { display: flex; align-items: center; gap: var(--sp-3); }
.kicker-line::after { content: ""; flex: 1; height: 1px; background: var(--border); }


/* ==========================================================================
   Tarjeta de novedad (js/novedades.js) — la usan la portada y la página de Noticias
   ========================================================================== */
/* Las publicaciones vienen en formatos mezclados (3:4, 4:5, 9:16, 1:1 y apaisadas) y muchas son
   afiches con texto: se muestran completas sobre un fondo neutro en vez de recortarlas. */
.page-noticias .noticias-grid .novedad-card .card__media,
.novedad-card .card__media {
  aspect-ratio: 3 / 4; overflow: hidden;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.novedad-card .card__media img { width: 100%; height: 100%; object-fit: contain; }
.novedad-card .news-card__date { display: flex; align-items: center; gap: .4rem; flex-wrap: nowrap; min-width: 0; }
.novedad-card .news-card__date time { white-space: nowrap; }
.novedad-card__fuente {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: var(--fs-xs); font-weight: 700; color: var(--text-muted);
}
.novedad-card__fuente svg { flex: none; }
.novedad-card__plate {
  display: grid; place-items: center; aspect-ratio: 4 / 3;
  background: var(--surface-2); border-bottom: 3px solid var(--primary);
}
.novedad-card__stamp { display: grid; justify-items: center; font-family: var(--font-display); color: var(--text-muted); }
.novedad-card__stamp-mes { font-size: 1.125rem; letter-spacing: .02em; }
.novedad-card__stamp-anio { font-size: 2.5rem; font-weight: 600; line-height: 1; color: var(--primary-strong); }
.badge--cat {
  color: color-mix(in srgb, var(--c) 82%, var(--text));
  background: color-mix(in srgb, var(--c) 10%, var(--bg));
  border-color: color-mix(in srgb, var(--c) 26%, transparent);
}
[data-theme="dark"] .badge--cat {
  color: color-mix(in srgb, var(--c) 45%, #fff);
  background: color-mix(in srgb, var(--c) 18%, var(--bg));
}