/*!
 * pelotapasto.com — pp-components.css (v2)
 * Capa: Componentes editoriales (reusables).
 *
 * LOCK:
 * - Sin rediseño / sin cambios visibles.
 * - Sin mover responsabilidades a templates.
 * - Captions: las métricas globales (size/italic/align/padding) viven en core.css.
 *   Aquí solo quedan ajustes propios del componente (tono/legibilidad + margen).
 */

@layer pp-components {

  /* --------------------------------------------------------------------
     Componente: Block “Media Editorial”
     (migrado 1:1 desde assets/css/block-media-editorial.css)
     -------------------------------------------------------------------- */

  .pp-media-editorial { margin: 0; }

  .pp-media-editorial__frame { margin: 0 0 0.75rem; }

  .pp-media-editorial__frame--expanded { width: 100%; }

  .pp-media-editorial__frame--text {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
  }

  .pp-media-editorial__img {
    display: block;
    width: 100%;
    height: auto;
  }

  .pp-media-editorial__chooser {
    display: grid;
    gap: 0.75rem;
  }

  .pp-media-editorial__embedHint {
    padding: 0.75rem;
    border: 1px solid rgba(0,0,0,0.12);
  }

  /* Caption del componente:
     - Métricas globales vienen de core.css (figcaption / .wp-element-caption).
     - Aquí solo: tono/legibilidad + margen propio del bloque. */
  .pp-media-editorial__caption {
    color: var(--pp-ink-soft);
    opacity: 1;
    font-weight: 350;
    letter-spacing: .01em;

    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-kerning: normal;
    font-variant-ligatures: common-ligatures contextual;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
    text-shadow: 0 0 .35px rgba(0,0,0,.18);

    margin: 6px 0 0 0;
  }

}