/* ──────────────────────────────────────────────────────────────────────
 * La prosa — theme v2 · stylesheet
 * Sistema de diseño Stitch "Portal La Prosa" / The Literary Curator
 * ("The Digital Broadside"): santuario intelectual, tipografía editorial
 * de alto contraste, regla "No-Line" (jerarquía por capas tonales + espacio
 * en blanco, no bordes 1px para seccionar), esquinas 0px, color entintado.
 *
 * Fuentes: Newsreader (titulares serif) + Manrope (cuerpo / labels) +
 * Material Symbols. Acentos: terracota (secondary), salvia (tertiary),
 * charcoal (primary).
 *
 * Estiliza el DOM canónico del render-tree.v2 (content.schema.{type}.{mode}
 * → fallback content.schema.{mode}). Clases: .lp-page, .mix-list,
 * .field__items--grid, .card, .reader, .gallery, .video, .lp-nav, .footer.
 * ──────────────────────────────────────────────────────────────────── */

:root {
  --background:               #faf9f7;
  --on-background:            #2f3331;
  --surface:                  #faf9f7;
  --surface-low:              #f3f4f1;
  --surface-container:        #edeeeb;
  --surface-high:             #e6e9e6;
  --surface-highest:          #e0e3e0;
  --surface-lowest:           #ffffff;
  --on-surface:               #2f3331;
  --on-surface-variant:       #5c605d;
  --outline:                  #777c79;
  --outline-variant:          #afb3b0;
  --primary:                  #5f5e5e;
  --primary-dim:              #535252;
  --on-primary:               #faf7f6;
  --primary-container:        #e4e2e1;
  --secondary:                #8e4d40;  /* terracota */
  --secondary-container:      #ffdad3;
  --on-secondary-container:   #7e4034;
  --tertiary:                 #546258;  /* salvia */
  --on-tertiary-container:    #515f55;
  --hairline:                 rgba(47, 51, 49, 0.12);
  --hairline-strong:          rgba(47, 51, 49, 0.20);

  /* aliases legacy (JS / inline) */
  --paper: var(--background); --paper-2: var(--surface-container); --paper-3: var(--surface-high);
  --ink: var(--on-background); --ink-2: #454946; --ink-3: var(--on-surface-variant); --ink-4: var(--outline);
  --rule: var(--hairline); --rule-strong: var(--hairline-strong); --accent: var(--secondary);

  --shell-max: 1536px;
  --read-max: 672px;
}

[data-theme="dark"] {
  --background:#1c1f1e; --on-background:#faf9f7; --surface:#1c1f1e; --surface-low:#232624;
  --surface-container:#282b29; --surface-high:#2f3331; --surface-highest:#373b39; --surface-lowest:#232624;
  --on-surface:#faf9f7; --on-surface-variant:#b9bdb9; --outline:#8a8e8a; --outline-variant:#5c605d;
  --primary:#c8c6c5; --primary-dim:#d6d4d3; --on-primary:#2f3331; --primary-container:#454946;
  --secondary:#ffb4a4; --secondary-container:#5d2a20; --on-secondary-container:#ffdad3;
  --tertiary:#bbcabd; --on-tertiary-container:#dae9dc;
  --hairline:rgba(250,249,247,0.14); --hairline-strong:rgba(250,249,247,0.24); --ink-2:#d6d8d5;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Manrope', system-ui, sans-serif;
  background: var(--background);
  color: var(--on-background);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background .3s, color .3s;
}
::selection { background: var(--secondary-container); color: var(--on-secondary-container); }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal; font-style: normal; font-size: 22px; line-height: 1;
  display: inline-block; white-space: nowrap; direction: ltr;
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
}

.shell { max-width: var(--shell-max); margin: 0 auto; padding: 0 32px; }

/* ═══ Nav (glass) ═══ */
.lp-nav {
  position: fixed; top: 0; left: 0; width: 100%; z-index: 50;
  background: color-mix(in srgb, var(--background) 80%, transparent);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
}
.lp-nav-inner {
  max-width: var(--shell-max); margin: 0 auto; padding: 22px 32px;
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
}
.lp-nav .brand {
  font-family: 'Newsreader', serif; font-size: 26px; font-weight: 500;
  letter-spacing: -0.03em; text-transform: uppercase; color: var(--on-surface); white-space: nowrap;
  display: flex; align-items: center; gap: 10px;
}
.lp-nav .brand-logo { width: 36px; height: 36px; object-fit: contain; }
.lp-nav .links { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.lp-nav .links .field--reference { display: contents; }
.lp-nav .links a {
  font-family: 'Manrope', sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: color-mix(in srgb, var(--on-surface) 55%, transparent);
  padding-bottom: 4px; transition: color .3s;
}
.lp-nav .links a:hover { color: var(--on-surface); }
.lp-nav .actions { display: flex; align-items: center; gap: 22px; }
.lp-nav .actions button { background: none; border: none; padding: 0; color: var(--on-surface); cursor: pointer; display: inline-flex; transition: opacity .2s; }
.lp-nav .actions button:hover { opacity: .6; }
@media (max-width: 860px) { .lp-nav .links { display: none; } }

.laprosa-main { padding-top: 96px; }
.laprosa-empty { max-width: var(--read-max); margin: 80px auto; text-align: center; color: var(--on-surface-variant); font-style: italic; font-family: 'Newsreader', serif; }

/* ═══ Home (page.detail) ═══ */
.lp-page { display: flex; flex-direction: column; }
.lp-page > * { margin: 0; }

/* ═══ Featured (generic embedded → artículo destacado) ═══ */
.lp-featured {
  max-width: var(--shell-max); margin: 64px auto; padding: 0 32px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
}
.lp-featured__media { aspect-ratio: 4/3; overflow: hidden; background: var(--surface-container); }
.lp-featured__media img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.lp-featured .kicker {
  font-family: 'Manrope', sans-serif; font-size: 12px; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--secondary); margin-bottom: 16px;
}
.lp-featured__title { font-family: 'Newsreader', serif; font-weight: 500; font-size: clamp(32px,4.4vw,60px); line-height: 1.0; letter-spacing: -0.02em; margin: 0 0 24px; text-wrap: balance; }
.lp-featured__teaser { font-family: 'Manrope', sans-serif; font-size: 16px; line-height: 1.6; color: var(--on-surface-variant); margin: 0 0 24px; max-width: 52ch; }
.lp-featured .byline { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 24px; }
.lp-featured .byline .author { color: var(--on-surface); font-weight: 600; }
.lp-featured .cta, .reader .cta {
  display: inline-block; background: var(--primary); color: var(--on-primary); border: none;
  padding: 14px 40px; font-family: 'Manrope', sans-serif; font-size: 11px; letter-spacing: 0.2em;
  text-transform: uppercase; cursor: pointer; transition: background .2s, transform .2s;
}
.lp-featured .cta:hover { background: var(--primary-dim); transform: translateY(-2px); }
@media (max-width: 860px) { .lp-featured { grid-template-columns: 1fr; gap: 32px; } }

/* ═══ Mix-list (banda tonal) ═══ */
.mix-list { background: var(--surface-low); padding: 112px 0; }
.mix-list__head { max-width: var(--shell-max); margin: 0 auto 56px; padding: 0 32px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.mix-list__title { font-family: 'Newsreader', serif; font-weight: 400; font-style: italic; font-size: clamp(30px,3.4vw,42px); line-height: 1.05; margin: 0; letter-spacing: -0.01em; color: var(--on-surface); }
.mix-list__title a { color: inherit; }
.mix-list__subtitle { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tertiary); margin: 8px 0 0; }
.mix-list__body { max-width: var(--shell-max); margin: 0 auto; padding: 0 32px; }

/* ═══ Reference-list grid (workhorse) ═══ */
.field--reference { margin: 0; }
.field--reference-list { width: 100%; max-width: var(--shell-max); margin: 0 auto; }
.field__head { max-width: var(--shell-max); margin: 0 auto 32px; padding: 0; }
.field__title { font-family: 'Newsreader', serif; font-style: italic; font-weight: 400; font-size: 28px; margin: 0; color: var(--on-surface); }
/* El label técnico del campo (slug) es ruido dentro de bandas editoriales. */
.mix-list .field__head, .section-page__lists .field__head, .comments .field__head, .aside-list-band .field__head { display: none; }
.field__items { list-style: none; padding: 0; margin: 0; display: grid; gap: 48px; }
.field__items--grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.field__item { margin: 0; }
/* en banda mix-list o sección, el grid respeta el gutter del shell */
.mix-list__body .field__items, .section-page__lists .field__items { padding: 0; }

/* ═══ Card (thumbnail) ═══ */
.card { cursor: pointer; display: flex; flex-direction: column; height: 100%; }
.card__link { display: flex; flex-direction: column; color: inherit; height: 100%; }
.card .ph {
  width: 100%; aspect-ratio: 4/5; background: var(--surface-highest);
  overflow: hidden; margin-bottom: 24px; position: relative;
  filter: grayscale(1); transition: filter .5s, transform .7s;
}
.card .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card:hover .ph { filter: grayscale(0); }
.card .ph .tag {
  position: absolute; top: 14px; left: 14px;
  background: color-mix(in srgb, var(--background) 85%, transparent); padding: 4px 8px;
  font-family: 'Manrope', sans-serif; font-size: 9px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--on-surface-variant);
}
.card .kicker { font-family: 'Manrope', sans-serif; font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 12px; }
.card h4 { font-family: 'Newsreader', serif; font-weight: 400; font-size: 24px; line-height: 1.2; letter-spacing: -0.01em; margin: 0 0 16px; text-wrap: pretty; color: var(--on-surface); transition: color .2s; }
.card:hover h4 { color: var(--primary); }
.card .lede { font-family: 'Manrope', sans-serif; font-size: 13px; line-height: 1.6; color: var(--on-surface-variant); margin: 0 0 12px; }
.card .byline { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-surface-variant); margin-top: auto; }

/* ═══ Section page ═══ */
.section-page { max-width: var(--shell-max); margin: 0 auto; padding: 48px 32px 96px; }
.section-page .heading { border-bottom: 1px solid var(--hairline); padding-bottom: 32px; margin-bottom: 56px; display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.section-page .heading .left { display: flex; gap: 16px; align-items: baseline; }
.section-page .heading h2 { font-family: 'Newsreader', serif; font-weight: 400; font-style: italic; font-size: clamp(40px,5vw,64px); margin: 0; letter-spacing: -0.02em; color: var(--on-surface); }
.section-page .heading .count { font-family: 'Manrope', sans-serif; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--on-surface-variant); }
.section-page .desc { font-family: 'Newsreader', serif; font-style: italic; font-size: 20px; color: var(--on-surface-variant); max-width: 60ch; margin: 0 0 48px; }
/* block (no flex) — los márgenes auto del grid colapsan en flex-column */
.section-page__lists { display: block; }
.section-page__lists > * + * { margin-top: 64px; }
.section-page__lists .field--reference-list, .section-page__lists .field__head { padding-left: 0; padding-right: 0; }
.section-page__lists .field--reference { display: block; }
/* featured (reference simple) dentro de la sección: tarjeta destacada full-width */
.section-page__lists > .field--reference .card { flex-direction: row; gap: 32px; }
.section-page__lists > .field--reference .card .ph { width: 320px; aspect-ratio: 4/3; flex-shrink: 0; margin: 0; }
.section-page__lists > .field--reference .card .ph + * { align-self: center; }

/* ═══ Reader (article.detail / generic detail) ═══ */
.reader { max-width: var(--shell-max); margin: 0 auto; padding: 32px 32px 96px; }
.reader .crumbs { display: flex; gap: 10px; align-items: center; justify-content: center; font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 40px; }
.reader .crumbs a:hover { color: var(--on-surface); }
.reader > .kicker, .reader > h1, .reader > .deck, .reader > .meta-row { max-width: 1100px; margin-left: auto; margin-right: auto; text-align: center; }
.reader .kicker { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--secondary); margin-bottom: 24px; }
.reader h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: clamp(38px,5.6vw,80px); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 32px; text-wrap: balance; color: var(--on-surface); }
.reader h1 em { font-style: italic; font-weight: 400; }
.reader .deck { font-family: 'Newsreader', serif; font-size: 22px; line-height: 1.5; color: var(--on-surface-variant); margin: 0 auto 32px; max-width: 60ch; text-wrap: pretty; }
.reader .meta-row { display: flex; justify-content: center; align-items: center; gap: 48px; border-top: 1px solid var(--hairline); padding: 32px 0 0; margin: 0 auto; max-width: 640px; font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); }
.reader .meta-row .author { color: var(--on-surface); font-weight: 700; }
.reader .meta-row .actions { display: flex; gap: 18px; }
.reader .meta-row .actions button { background: none; border: none; color: var(--on-surface-variant); font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; padding: 0; transition: color .15s; }
.reader .meta-row .actions button:hover, .reader .meta-row .actions button.active { color: var(--on-surface); }
.reader .hero-ph { width: 100%; max-width: var(--shell-max); margin: 80px auto 80px; aspect-ratio: 21/9; background: var(--surface-container); overflow: hidden; }
.reader .hero-ph img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) brightness(.95); display: block; }

.prose { max-width: var(--read-max); margin: 0 auto; font-family: 'Manrope', sans-serif; font-size: 19px; line-height: 1.8; color: color-mix(in srgb, var(--on-surface) 90%, transparent); }
.prose > p { margin: 0 0 1.6em; text-wrap: pretty; }
.prose > p:first-of-type::first-letter { float: left; font-family: 'Newsreader', serif; font-weight: 500; font-size: 5rem; line-height: 0.8; padding-right: 12px; margin-top: 4px; color: var(--on-surface); }
.prose h2, .prose h3 { font-family: 'Newsreader', serif; font-weight: 400; font-style: italic; letter-spacing: -0.01em; color: var(--on-surface); }
.prose h3 { font-size: 30px; margin: 1.8em 0 0.6em; }
.prose blockquote { margin: 1.6em 0; padding: 0; border: none; font-family: 'Newsreader', serif; font-style: italic; font-size: 28px; line-height: 1.4; color: var(--secondary); }
.prose blockquote cite { display: block; margin-top: 12px; font-family: 'Manrope', sans-serif; font-style: normal; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); }
.prose img { width: 100%; height: auto; display: block; margin: 2em 0; }
.prose hr { border: none; width: 32px; height: 1px; background: var(--hairline-strong); margin: 96px auto; }
.prose .rt-table-scroll {
  width: 100%;
  margin: 2em 0;
  overflow-x: auto;
  border-top: 1px solid var(--hairline-strong);
  border-bottom: 1px solid var(--hairline-strong);
}
.prose table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-family: 'Manrope', sans-serif;
  font-size: 15px;
  line-height: 1.55;
}
.prose th, .prose td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--hairline);
  vertical-align: top;
}
.prose th {
  color: var(--on-surface);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.prose tr:last-child td { border-bottom: 0; }
.prose .rt-table__cell--center { text-align: center; }
.prose .rt-table__cell--right { text-align: right; }

/* ═══ Further reading / refs ═══ */
.comments { max-width: var(--shell-max); margin: 112px auto 0; padding: 0 32px; }
.comments h3 { font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 12px; letter-spacing: 0.4em; text-transform: uppercase; text-align: center; margin: 0 0 56px; color: var(--on-surface); }
.comments[data-comments-stub] { max-width: var(--read-max); margin: 96px auto 0; padding: 48px 32px 0; border-top: 1px solid var(--hairline); }
.comments[data-comments-stub] h3 { font-family: 'Newsreader', serif; font-style: italic; font-size: 28px; letter-spacing: -0.01em; text-transform: none; text-align: left; margin-bottom: 8px; }
.comments .sub { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--on-surface-variant); text-align: left; }

/* ═══ Gallery ═══ */
.gallery { max-width: var(--shell-max); margin: 0 auto; padding: 32px 32px 96px; }
.gallery__header { max-width: 1100px; margin: 0 auto 56px; text-align: center; }
.gallery__header .kicker { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--secondary); margin-bottom: 24px; }
.gallery__header h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: clamp(36px,5vw,72px); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 24px; text-wrap: balance; color: var(--on-surface); }
.gallery__header .deck { font-family: 'Newsreader', serif; font-size: 22px; line-height: 1.5; color: var(--on-surface-variant); margin: 0 auto 24px; max-width: 60ch; }
.gallery__header .meta-row { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); }
.gallery__cover { margin: 0 0 56px; }
.gallery__cover img { width: 100%; max-height: 70vh; object-fit: cover; display: block; filter: grayscale(.15); }
.gallery__items .field--image-list { margin: 0; }
.gallery__items .field__images { list-style: none; padding: 0; margin: 0; columns: 3; column-gap: 24px; }
.gallery__items .field__image { break-inside: avoid; margin: 0 0 24px; }
.gallery__items figure { margin: 0; }
.gallery__items img { width: 100%; height: auto; display: block; filter: grayscale(.2); transition: filter .4s; }
.gallery__items figure:hover img { filter: grayscale(0); }
.gallery__items figcaption { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-surface-variant); margin-top: 8px; }
@media (max-width: 860px) { .gallery__items .field__images { columns: 2; } }
@media (max-width: 560px) { .gallery__items .field__images { columns: 1; } }

/* ═══ Video ═══ */
.video { max-width: 960px; margin: 0 auto; padding: 32px 32px 96px; }
.video__header { text-align: center; margin-bottom: 48px; }
.video__header .kicker { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--secondary); margin-bottom: 24px; }
.video__header h1 { font-family: 'Newsreader', serif; font-weight: 500; font-size: clamp(36px,5vw,72px); line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 24px; text-wrap: balance; color: var(--on-surface); }
.video__header .deck { font-family: 'Newsreader', serif; font-size: 22px; line-height: 1.5; color: var(--on-surface-variant); margin: 0 auto; max-width: 60ch; }
.video__player { background: #000; }
.video__player figure { margin: 0; }
.video__player video, .video__player .field__media-video { width: 100%; display: block; }
.video__player .field__media-link, .video__player .field__media-image { width: 100%; display: block; }

/* ═══ Aside list band ═══ */
.aside-list-band { max-width: var(--shell-max); margin: 0 auto; padding: 64px 32px; background: var(--surface-low); }
.aside-list-band__title { font-family: 'Manrope', sans-serif; font-size: 12px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--on-surface-variant); margin: 0 0 32px; text-align: center; font-weight: 600; }
.aside-list-band__intro { text-align: center; color: var(--on-surface-variant); font-family: 'Newsreader', serif; font-style: italic; margin: -16px auto 32px; }
.aside-list-band__items .field__items--grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* ═══ Footer ═══ */
.footer { max-width: var(--shell-max); margin: 0 auto; padding: 80px 32px; border-top: 1px solid var(--hairline); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 48px; }
.footer .brand-col { display: flex; flex-direction: column; gap: 24px; }
.footer .brand-word { font-family: 'Newsreader', serif; font-weight: 500; font-size: 22px; letter-spacing: -0.02em; text-transform: uppercase; margin: 0; color: var(--on-surface); display: flex; align-items: center; gap: 10px; }
.footer .brand-logo { width: 44px; height: 44px; object-fit: contain; }
.footer .brand-tag { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: color-mix(in srgb, var(--on-surface) 50%, transparent); max-width: 220px; }
.footer-social { display: flex; gap: 12px; flex-wrap: wrap; }
.footer-social a { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--hairline); color: var(--on-surface-variant); transition: color .2s, border-color .2s; }
.footer-social a:hover { color: var(--on-surface); border-color: var(--on-surface); }
.footer-social svg { width: 16px; height: 16px; display: block; }
.footer .cols { display: grid; grid-template-columns: repeat(4, auto); gap: 48px; }
.footer .col h5 { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface); font-weight: 700; margin: 0 0 16px; }
.footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
.footer ul li a { font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: color-mix(in srgb, var(--on-surface) 50%, transparent); transition: color .2s, transform .2s; display: inline-block; }
.footer ul li a:hover { color: var(--on-surface); transform: translateX(4px); }
.footer .row2 { width: 100%; display: flex; justify-content: space-between; font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); }
.footer .row2 a { margin-right: 16px; }
.contact-page, .search-page { max-width: var(--read-max); margin: 48px auto 96px; padding: 0 32px; }
.contact-page h1, .search-page h1 { font-family: 'Newsreader', serif; font-size: clamp(38px,5vw,64px); font-weight: 500; letter-spacing: -0.02em; margin: 0 0 24px; }
.contact-page__intro, .search-page__intro { font-family: 'Newsreader', serif; font-size: 21px; line-height: 1.45; color: var(--on-surface-variant); margin-bottom: 32px; }
.contact-form, .search-form { display: grid; gap: 16px; }
.contact-form__input, .contact-form__textarea, .search-form__input { width: 100%; border: 0; border-bottom: 1px solid var(--hairline-strong); background: transparent; color: var(--on-surface); padding: 14px 0; font: inherit; }
.contact-form__textarea { min-height: 160px; resize: vertical; }
.contact-form__button, .search-form__button { justify-self: start; border: 0; background: var(--primary); color: var(--on-primary); padding: 14px 32px; font-family: 'Manrope', sans-serif; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; cursor: pointer; }
.search-results-list { list-style: none; padding: 0; margin: 32px 0 0; display: grid; gap: 24px; }
.search-results-list a { display: block; border-top: 1px solid var(--hairline); padding-top: 18px; }
.search-results-list strong { display: block; font-family: 'Newsreader', serif; font-size: 24px; font-weight: 500; }
.search-results-list span { display: block; margin-top: 8px; color: var(--on-surface-variant); }
@media (max-width: 720px) { .footer .cols { grid-template-columns: repeat(2, 1fr); } }

/* ═══ Search overlay (glass) ═══ */
.search-overlay { position: fixed; inset: 0; background: color-mix(in srgb, var(--background) 80%, transparent); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); z-index: 200; display: flex; align-items: flex-start; justify-content: center; padding-top: 14vh; animation: fade .15s ease-out; }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
.search-panel { width: min(680px, 92vw); background: var(--surface-lowest); padding: 40px; animation: slidein .2s ease-out; }
@keyframes slidein { from { transform: translateY(-12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.search-panel .head { display: flex; justify-content: space-between; align-items: center; font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 20px; }
.search-panel input { width: 100%; border: none; border-bottom: 1px solid var(--outline-variant); outline: none; background: transparent; font-family: 'Newsreader', serif; font-style: italic; font-size: 36px; color: var(--on-surface); padding: 12px 0; }
.search-panel input:focus { border-color: var(--primary); }
.search-panel input::placeholder { color: var(--outline); font-style: italic; }
.search-results { margin-top: 24px; display: flex; flex-direction: column; }
.search-result { padding: 18px 0; border-bottom: 1px solid var(--hairline); cursor: pointer; display: grid; grid-template-columns: 80px 1fr auto; gap: 16px; align-items: center; }
.search-result:last-child { border-bottom: none; }
.search-result .sec { font-family: 'Manrope', sans-serif; font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--on-surface-variant); }
.search-result .ttl { font-family: 'Newsreader', serif; font-size: 19px; line-height: 1.2; color: var(--on-surface); }
.search-result:hover .ttl { color: var(--primary); }
.search-result .arrow { font-family: 'Manrope', sans-serif; color: var(--on-surface-variant); }
.search-empty { padding: 32px 0; text-align: center; font-family: 'Newsreader', serif; font-style: italic; color: var(--on-surface-variant); font-size: 18px; }

/* ═══ Share popover + toast ═══ */
.share-pop { position: fixed; background: var(--surface-lowest); box-shadow: 0 12px 48px rgba(47,51,49,0.10); padding: 20px; z-index: 220; width: 280px; font-family: 'Manrope', sans-serif; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.share-pop .head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; font-size: 10px; color: var(--on-surface-variant); letter-spacing: 0.28em; }
.share-pop button.close { background: none; border: none; color: var(--on-surface-variant); cursor: pointer; padding: 0; font: inherit; letter-spacing: inherit; }
.share-pop ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.share-pop ul li { display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: 12px 0; border-bottom: 1px solid var(--hairline); color: var(--on-surface); }
.share-pop ul li:last-child { border-bottom: none; }
.share-pop ul li:hover { color: var(--primary); }
.share-pop ul li .arr { color: var(--on-surface-variant); }
.toast { position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%); background: var(--on-background); color: var(--background); padding: 14px 24px; font-family: 'Manrope', sans-serif; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; z-index: 300; animation: toastin .25s ease-out; }
@keyframes toastin { from { transform: translate(-50%, 12px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }

/* ═══ Ad slots ═══ */
.ad-slot { position: relative; background: var(--surface-container); padding: 16px; text-align: center; overflow: hidden; }
.ad-slot__label { display: block; font-family: 'Manrope', sans-serif; font-size: 9px; font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: var(--on-surface-variant); margin-bottom: 8px; }
.ad-slot .adsbygoogle { margin: 0 auto; }
/* AdSense <ins>: dimensiones por posición (espejo de FIXED_POSITION_SIZES en buildAdsContextV2.ts) */
.ad-slot .adsbygoogle { display: block; }                    /* responsive: leaderboard/sticky/float */
.ad-slot--box .adsbygoogle,
.ad-slot--double_box .adsbygoogle { display: inline-block; } /* unidad IAB fija */
.ad-slot--box .adsbygoogle { width: 300px; height: 250px; }
.ad-slot--double_box .adsbygoogle { width: 300px; height: 600px; }
.ad-slot--leaderboard { max-width: var(--shell-max); margin: 0 auto 32px; padding: 16px 32px; }
.ad-slot--leaderboard .adsbygoogle { min-height: 90px; }
.ad-slot--box { margin: 32px auto; max-width: 336px; }
.ad-slot--box .adsbygoogle { min-height: 250px; }
.ad-slot--double_box { margin: 32px auto; max-width: 336px; }
.ad-slot--double_box .adsbygoogle { min-height: 600px; }
.laprosa-aside .ad-slot--box, .laprosa-aside .ad-slot--double_box { max-width: none; margin: 32px 0; }
.ad-slot--sticky { position: fixed; bottom: 0; left: 0; right: 0; z-index: 180; margin: 0; padding: 8px 12px; background: var(--surface-lowest); box-shadow: 0 -8px 32px rgba(47,51,49,0.12); }
.ad-slot--sticky .ad-slot__label { margin-bottom: 4px; }
.ad-slot--sticky .adsbygoogle { min-height: 50px; }
.ad-slot--float_banner { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 190; margin: 0; width: min(760px, calc(100vw - 32px)); background: var(--surface-lowest); box-shadow: 0 12px 48px rgba(47,51,49,0.18); padding: 16px 20px; }
.ad-slot--float_banner .adsbygoogle { min-height: 90px; }
.ad-slot--float_banner.is-closed { display: none; }
.ad-slot__close { position: absolute; top: 8px; right: 8px; background: none; border: none; cursor: pointer; color: var(--on-surface-variant); font-size: 14px; line-height: 1; padding: 4px; font-family: 'Manrope', sans-serif; }
.ad-slot__close:hover { color: var(--on-surface); }
@media (min-width: 1024px) {
  /* sticky = anchor pequeño solo para mobile */
  .ad-slot--sticky { display: none; }
}
@media (max-width: 1023px) {
  /* con sticky activo el float cede el bottom en mobile (sticky va antes en el DOM) */
  .ad-slot--sticky ~ .ad-slot--float_banner { display: none; }
}

/* ═══ Responsive ═══ */
@media (max-width: 640px) {
  .shell, .lp-featured, .mix-list__head, .mix-list__body, .section-page, .reader, .comments, .gallery, .video, .footer, .aside-list-band { padding-left: 20px; padding-right: 20px; }
  .field__items--grid { grid-template-columns: 1fr; }
  .footer { flex-direction: column; }
  .footer .cols { grid-template-columns: 1fr 1fr; }
  .reader .meta-row { flex-direction: column; gap: 16px; }
  .section-page__lists > .field--reference .card { flex-direction: column; }
  .section-page__lists > .field--reference .card .ph { width: 100%; }
}