/* ==========================================================================
   MNDZA Studio — complementos para WordPress
   Páginas de texto (aviso de privacidad, etc.), listados y contenido del
   editor. Usa las capas declaradas en main.css.
   ========================================================================== */

@layer pages {
  /* ---------- Página de texto ---------- */
  .entry { container-type: inline-size; padding: var(--space-m) var(--pad) var(--space-l); }
  .entry__head { display: grid; gap: var(--space-s); padding-bottom: var(--space-m); }
  .entry__label { font-family: var(--mono); font-size: var(--fs-mono-s); text-transform: uppercase; color: var(--muted); }
  .entry__title { --fit-max: var(--fs-xl); font-family: var(--display); font-stretch: 62%; font-weight: 700; line-height: 0.86; text-transform: uppercase; }
  .entry__cover { margin-bottom: var(--space-m); border-radius: var(--r-s); overflow: hidden; }
  .entry__cover img { width: 100%; }

  /* ---------- Contenido del editor ---------- */
  .prose { max-width: 68ch; font-size: var(--fs-body-lg); line-height: 1.45; }
  .prose > * + * { margin-top: 1em; }
  .prose h2, .prose h3, .prose h4 { margin-top: 1.6em; font-family: var(--display); font-stretch: 75%; font-weight: 700; line-height: 1; text-transform: uppercase; }
  .prose h2 { font-size: var(--fs-card); }
  .prose h3 { font-size: calc(var(--fs-card) * 0.8); }
  .prose h4 { font-size: 1em; }
  .prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
  .prose a:hover { text-decoration-color: var(--accent); }
  .prose ul, .prose ol { padding-left: 1.2em; }
  .prose li + li { margin-top: 0.35em; }
  .prose blockquote { padding-left: 1em; border-left: 3px solid var(--accent); }
  .prose img, .prose video, .prose iframe { max-width: 100%; height: auto; border-radius: var(--r-s); }
  .prose figure { margin-block: 1.5em; }
  .prose figcaption { margin-top: 0.5em; font-family: var(--mono); font-size: var(--fs-mono-s); color: var(--muted); }
  .prose hr { border: 0; border-top: 1px solid var(--grey-2); margin-block: 2em; }
  .prose table { width: 100%; border-collapse: collapse; font-size: 0.85em; }
  .prose th, .prose td { padding: 0.5em 0.75em 0.5em 0; border-bottom: 1px solid var(--grey-2); text-align: left; }
  .prose .alignwide, .prose .alignfull { max-width: none; }
  .prose .aligncenter { margin-inline: auto; }
  .prose .wp-block-image img { display: block; }
  .prose .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 0.75rem; }
  .prose .wp-block-button__link { display: inline-flex; padding: 0.7em 1.2em; border-radius: 999px; background: var(--black); color: var(--white); text-decoration: none; font-family: var(--mono); font-size: var(--fs-mono-s); text-transform: uppercase; }
  .prose .wp-block-columns { display: grid; gap: var(--space-s); }
  @media (min-width: 48em) { .prose .wp-block-columns { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); } }

  /* Textos con varios párrafos dentro de componentes del diseño */
  .faq__a > * + * { margin-top: 0.75em; }
  .svc__text .svc__desc > * + * { margin-top: 0.75em; }

  /* ---------- Listados (blog, búsqueda, archivos) ---------- */
  .entries { width: 100%; }
  .entries a { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.25rem 0.75rem; padding-block: 0.8rem; border-top: 1px solid var(--grey-2); }
  .entries li:last-child a { border-bottom: 1px solid var(--grey-2); }
  .entries__title { font-family: var(--display); font-stretch: 62%; font-weight: 700; text-transform: uppercase; font-size: var(--fs-card); line-height: 1; }
  .entries__meta { grid-column: 1; font-family: var(--mono); font-size: var(--fs-mono-s); text-transform: uppercase; color: var(--muted); }
  .entries .icon { grid-row: 1 / span 2; grid-column: 2; }
  .entries a:hover .entries__title { text-decoration: underline; text-decoration-color: var(--accent); }
  .entries__empty { font-size: var(--fs-body-lg); }
  .pagination { margin-top: var(--space-m); }
  .pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0.5rem; font-family: var(--mono); font-size: var(--fs-mono-s); text-transform: uppercase; }
  .pagination .page-numbers { display: inline-grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; padding-inline: 0.75rem; border: 1px solid var(--grey-2); border-radius: 999px; }
  .pagination .current { background: var(--black); border-color: var(--black); color: var(--white); }

  /* ---------- Contacto ---------- */
  .contact-head__label { color: var(--muted); }

  /* ---------- Aviso del formulario sin JavaScript ---------- */
  .form-notice { margin-bottom: var(--space-s); padding: 0.9rem 1rem; border-radius: var(--r-s); background: var(--grey); font-size: var(--fs-body); }
  .form-notice.is-error { background: #ffe9e0; }

  /* ---------- Barra de administración de WordPress ---------- */
  @media (min-width: 64em) { .admin-bar .case-info { top: 32px; } }
}

@layer utilities {
  /* Texto solo para lectores de pantalla (clase estándar de WordPress). */
  .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .screen-reader-text:focus { position: static !important; width: auto; height: auto; margin: 0; clip: auto; clip-path: none; white-space: normal; }
}