/* ProRetoque Blog Configurador v0.5.4 — solo zona blog; componentes globales quedan en el tema */
/* The Sage theme reserves vertical space for its native page-title area even
 * when the title text is removed. On the selected Blog page we collapse only
 * those page/content wrappers, following the same reset used by the known-good
 * ProRetoque IA landings plugin. Header/footer remain controlled by the theme. */
body.prblog-template-page .entry-title,
body.prblog-template-page .page-title,
body.prblog-template-page .entry-header,
body.prblog-template-page .page-header,
body.prblog-template-page .wp-block-post-title,
body.prblog-template-page main > header:not(.site-header){display:none!important}

body.prblog-template-page .site-main,
body.prblog-template-page .content-area,
body.prblog-template-page article.page,
body.prblog-template-page .entry-content,
body.prblog-template-page .wp-block-post-content,
body.prblog-template-page .page-content{
  margin-top:0!important;
  padding-top:0!important;
}

/* Avoid an empty title/header wrapper leaving height through min-height or margins. */
body.prblog-template-page .entry-header:empty,
body.prblog-template-page .page-header:empty{
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  height:0!important;
}

.prblog{--prblog-max:1120px;max-width:var(--prblog-max);margin:0 auto;padding:54px 0 72px;color:#111;font-family:inherit}
.prblog *{box-sizing:border-box}
.prblog a{color:inherit}

.prblog-topline{margin:0 0 58px;padding:0}
.prblog-topline h1{margin:0;max-width:620px;font-size:clamp(30px,2.8vw,40px);line-height:1.04;letter-spacing:-.035em;font-weight:600}

.prblog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:42px;row-gap:66px}
.prblog-card{min-width:0}
.prblog-media{display:block;width:100%;aspect-ratio:1.62/1;overflow:hidden;background:#ececec;border:1px solid #222;text-decoration:none}
.prblog-media img{display:block;width:100%;height:100%;object-fit:cover}
.prblog-media-empty,.prblog-placeholder-media{display:block;width:100%;height:100%;background:#e3e3e3}
.prblog-card-copy{padding-top:17px}
.prblog-card h2{font-size:23px;line-height:1.05;font-weight:600;letter-spacing:-.025em;margin:0 0 16px}
.prblog-card h2 a{text-decoration:none}
.prblog-card p{font-size:13px;line-height:1.35;margin:0 0 19px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.prblog-read{display:inline-block;text-decoration:none;border:1px solid #111;padding:7px 17px;font-size:11px;line-height:1;background:#fff}

.prblog-card-placeholder{opacity:.82}
.prblog-card-placeholder .prblog-media{border-color:#a8a8a8;background:#d9d9d9}
.prblog-placeholder-title,.prblog-placeholder-line,.prblog-placeholder-button{background:#d5d5d5;border-radius:1px}
.prblog-placeholder-title{height:18px;width:88%;margin:0 0 8px}
.prblog-placeholder-title-short{width:62%;margin-bottom:17px}
.prblog-placeholder-line{height:8px;width:100%;margin:0 0 6px}
.prblog-placeholder-line-short{width:72%;margin-bottom:19px}
.prblog-placeholder-button{height:27px;width:96px;border:1px solid #c1c1c1;background:#e0e0e0}

.prblog-pagination{display:flex;justify-content:center;align-items:center;gap:7px;margin:72px 0 64px;padding:0;border:0;font-size:12px}
.prblog-pagination a,.prblog-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:29px;height:29px;padding:0 9px;border:1px solid #b7b7b7;text-decoration:none;background:#fff;white-space:nowrap}
.prblog-pagination .current{background:#111;color:#fff;border-color:#111}
.prblog-pagination .prblog-page-disabled{color:#777;background:#f3f3f3}
.prblog-pagination .prev,.prblog-pagination .next,.prblog-pagination .prblog-last{min-width:auto}

@media (max-width:1180px){.prblog{padding-left:28px;padding-right:28px}}
@media (max-width:900px){.prblog-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}}
@media (max-width:620px){.prblog{padding:34px 18px 52px}.prblog-topline{margin-bottom:38px}.prblog-grid{grid-template-columns:1fr;row-gap:46px}.prblog-card h2{font-size:22px}.prblog-pagination{justify-content:flex-start;overflow-x:auto;padding-bottom:6px}}

/* Visual clones intentionally inherit the exact same styling as real cards. */
.prblog-card-clone{opacity:1}

/* --------------------------------------------------------------------------

/* --------------------------------------------------------------------------
   Articulo maestro v0.7.1 - escala y marcos de la maqueta PDF.
   -------------------------------------------------------------------------- */
body.prblog-article-template .blog-h1a,body.prblog-article-template .blog-h1a__image,body.prblog-article-template .blog-article>header.blog-h1a,body.prblog-article-template .entry-title,body.prblog-article-template .entry-header,body.prblog-article-template .page-header,body.prblog-article-template .wp-block-post-title{display:none!important;margin:0!important;padding:0!important;height:0!important;min-height:0!important;overflow:hidden!important}
body.prblog-article-template .blog-article,body.prblog-article-template .e-content,body.prblog-article-template .entry-content{margin-top:0!important;padding-top:0!important}

.prblog-master-article{width:min(940px,calc(100% - 48px));margin:0 auto;padding:38px 0 72px;color:#111;font-family:inherit}.prblog-master-article *{box-sizing:border-box}.prblog-master-article a{color:inherit}
.prblog-master-head{margin:0 0 18px}.prblog-master-back{display:inline-block;margin:0 0 24px;font-size:11px;line-height:1;text-decoration:none;text-transform:uppercase}.prblog-master-head h1{width:min(850px,100%);margin:0 0 22px;font-size:clamp(34px,4vw,52px);line-height:1.03;font-weight:500;letter-spacing:-.025em;text-transform:uppercase}.prblog-master-rule{height:1px;background:#111;margin:0 0 9px}.prblog-master-meta{display:flex;justify-content:space-between;gap:20px;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.02em}
.prblog-master-hero{width:100%;aspect-ratio:16/7;margin:0 0 28px;overflow:hidden;border:1px solid #999;background:#f5f5f5}.prblog-master-hero img,.prblog-master-image-empty{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.prblog-master-lead-wrap{max-width:780px;margin:0 0 38px}.prblog-master-lead-wrap .pr-lead{margin:0;font-size:17px;line-height:1.65;font-weight:400}
.prblog-master-toc{margin:0 0 42px;padding-top:18px;border-top:1px solid #ddd;font-size:14px;line-height:1.5}.prblog-master-toc strong{display:block;margin-bottom:12px;font-size:15px;font-weight:600}.prblog-master-toc ol{list-style:none;margin:0;padding:0}.prblog-master-toc li{margin:0 0 6px}.prblog-master-toc a{text-decoration:none}.prblog-master-toc a:hover{text-decoration:underline}.prblog-master-toc span{font-weight:700}
.prblog-master-body{font-size:16px;line-height:1.7}.prblog-master-body p{margin:0 0 18px}.prblog-master-body h2{margin:58px 0 20px;padding-top:0;scroll-margin-top:120px;font-size:clamp(24px,2.3vw,31px);line-height:1.14;font-weight:500;text-transform:uppercase;letter-spacing:-.015em}.prblog-master-body h3,.prblog-master-body h4{margin:0 0 7px;font-size:18px;line-height:1.3;font-weight:600}.prblog-master-body ul,.prblog-master-body ol{margin:0 0 22px;padding-left:1.4em}
.prblog-master-body figure{margin:28px 0 34px}.prblog-master-body figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.prblog-master-body .pr-media{aspect-ratio:16/7;overflow:hidden;border:1px solid #b8b8b8;background:#f5f5f5}.prblog-master-body .pr-media-square{aspect-ratio:1/1}.prblog-master-body .pr-media-4x3{aspect-ratio:4/3}.prblog-master-body .pr-media-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:30px 0 46px}.prblog-master-body .pr-media-pair figure{aspect-ratio:4/3;margin:0;overflow:hidden;border:1px solid #b8b8b8;background:#f5f5f5}
.prblog-master-body .pr-section-split{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(260px,.92fr);gap:34px;align-items:start;margin-top:22px}.prblog-master-body .pr-section-split .pr-media{aspect-ratio:4/3;margin:0}.prblog-master-body .pr-section-split .pr-section-copy p:last-child{margin-bottom:0}
.prblog-master-body blockquote.pr-quote{width:min(420px,90%);margin:34px 0 48px;padding:4px 0 4px 22px;border-left:2px solid #111;font-size:28px;line-height:1.16;font-style:normal;font-weight:400}
.prblog-master-body .pr-benefits-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 38px;margin:28px 0 44px;padding-top:24px;border-top:1px solid #ddd}.prblog-master-body .pr-benefit{padding:0 0 22px;margin:0 0 22px;border-bottom:1px solid #ddd}.prblog-master-body .pr-benefit h3{margin-bottom:6px}.prblog-master-body .pr-benefit p{margin:0;color:#555;font-size:14px;line-height:1.55}.prblog-master-body .pr-stat{grid-column:1/-1;text-align:center;padding:30px 0;margin:2px 0 24px;border-top:1px solid #ddd;border-bottom:1px solid #ddd}.prblog-master-body .pr-stat strong{display:block;font-size:54px;line-height:1;font-weight:500}.prblog-master-body .pr-stat p{margin:10px auto 0;max-width:380px;font-size:14px;color:#333}
.prblog-master-cta{margin:58px 0 54px;padding:26px 0;border-top:1px solid #111;border-bottom:1px solid #111;display:flex;align-items:center;justify-content:space-between;gap:28px}.prblog-master-cta>div{min-width:0}.prblog-master-cta>div>p{margin:0 0 4px;font-size:20px;line-height:1.25;font-weight:500}.prblog-master-cta>div>span{font-size:13px;color:#666}.prblog-master-cta form{display:flex;width:min(440px,100%);margin:0}.prblog-master-cta input{height:42px;flex:1;min-width:0;border:1px solid #111;background:#fff;padding:0 12px;font:inherit;font-size:13px}.prblog-master-cta button{height:42px;border:1px solid #111;background:#111;color:#fff;padding:0 18px;font:inherit;font-size:13px;font-weight:600;white-space:nowrap}
.prblog-master-related{margin-top:0}.prblog-master-related>h2{margin:0 0 18px;font-size:11px;line-height:1;font-weight:500;letter-spacing:.06em}.prblog-master-related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.prblog-master-related-media{display:block;aspect-ratio:1/1;overflow:hidden;border:1px solid #bbb;background:#f5f5f5}.prblog-master-related-media img{display:block;width:100%;height:100%;object-fit:cover}.prblog-master-related-card h3{margin:9px 0 10px;font-size:14px;line-height:1.2;font-weight:600}.prblog-master-related-card h3 a{text-decoration:none}.prblog-master-related-card small{display:block;margin:0 0 9px;font-size:10px;line-height:1;color:#666}.prblog-master-related-read{display:inline-block;font-size:10px;line-height:1;text-decoration:underline;font-weight:700}
@media(max-width:900px){.prblog-master-article{width:min(100% - 36px,940px)}.prblog-master-head h1{font-size:38px}.prblog-master-body .pr-section-split{grid-template-columns:1fr}.prblog-master-body .pr-section-split .pr-media{max-width:620px}.prblog-master-related-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.prblog-master-cta{align-items:flex-start;flex-direction:column}.prblog-master-cta form{width:100%}}
@media(max-width:620px){.prblog-master-article{width:calc(100% - 28px);padding:26px 0 48px}.prblog-master-back{margin-bottom:18px}.prblog-master-head h1{font-size:30px;line-height:1.06}.prblog-master-meta{font-size:9px;flex-direction:column;gap:4px}.prblog-master-hero{aspect-ratio:4/3;margin-bottom:22px}.prblog-master-lead-wrap .pr-lead{font-size:16px}.prblog-master-toc{font-size:13px;margin-bottom:32px}.prblog-master-body{font-size:15px}.prblog-master-body h2{font-size:23px;margin-top:44px}.prblog-master-body h3,.prblog-master-body h4{font-size:17px}.prblog-master-body .pr-media-pair{grid-template-columns:1fr;gap:16px}.prblog-master-body blockquote.pr-quote{font-size:24px;margin-left:0}.prblog-master-body .pr-benefits-grid{grid-template-columns:1fr}.prblog-master-body .pr-stat{grid-column:1}.prblog-master-cta form{flex-direction:column}.prblog-master-cta input,.prblog-master-cta button{width:100%}.prblog-master-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* --------------------------------------------------------------------------
   v0.9.1 - Marcos de imagen controlados por la plantilla.
   La proporcion del archivo original nunca determina la altura visual.
   -------------------------------------------------------------------------- */
body.prblog-article-template .prblog-master-body figure.pr-media {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 7 !important;
  overflow: hidden !important;
  margin: 32px 0 38px !important;
  padding: 0 !important;
  border: 1px solid #b8b8b8 !important;
  background: #f5f5f5 !important;
}
body.prblog-article-template .prblog-master-body figure.pr-media > img,
body.prblog-article-template .prblog-master-body figure.pr-media > a > img,
body.prblog-article-template .prblog-master-body figure.pr-media img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  min-height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
}
/* Una clase portrait ya no conserva formato vertical: dentro de esta plantilla
   sigue usando el marco editorial horizontal. */
body.prblog-article-template .prblog-master-body figure.pr-media-portrait,
body.prblog-article-template .prblog-master-body figure.pr-media-wide,
body.prblog-article-template .prblog-master-body figure.pr-media-hero {
  aspect-ratio: 16 / 7 !important;
}
/* Excepciones explicitas que podremos usar cuando el diseño realmente requiera
   otro marco, nunca por la proporcion original del archivo. */
body.prblog-article-template .prblog-master-body figure.pr-media-square {
  aspect-ratio: 1 / 1 !important;
}
body.prblog-article-template .prblog-master-body figure.pr-media-4x3 {
  aspect-ratio: 4 / 3 !important;
}
@media (max-width: 620px) {
  body.prblog-article-template .prblog-master-body figure.pr-media,
  body.prblog-article-template .prblog-master-body figure.pr-media-portrait,
  body.prblog-article-template .prblog-master-body figure.pr-media-wide,
  body.prblog-article-template .prblog-master-body figure.pr-media-hero {
    aspect-ratio: 4 / 3 !important;
    margin: 24px 0 30px !important;
  }
}


/* --------------------------------------------------------------------------
   v0.9.2 - Sistema de marcos editoriales reutilizable.
   El contenido decide qué imagen es; la plantilla decide cómo se muestra.
   -------------------------------------------------------------------------- */
/* Marco editorial principal: adecuado para imágenes de sección y contenido. */
body.prblog-article-template .prblog-master-body figure.pr-media,
body.prblog-article-template .prblog-master-body figure.pr-media-wide,
body.prblog-article-template .prblog-master-body figure.pr-media-hero,
body.prblog-article-template .prblog-master-body figure.pr-media-portrait {
  aspect-ratio: 16 / 7 !important;
}

/* Marcos explícitos disponibles para futuros artículos. Solo se usan cuando
   el HTML normalizado los solicita por función editorial, nunca por el tamaño
   original del archivo. */
body.prblog-article-template .prblog-master-body figure.pr-media-section {
  aspect-ratio: 2 / 1 !important;
}
body.prblog-article-template .prblog-master-body figure.pr-media-landscape {
  aspect-ratio: 3 / 2 !important;
}
body.prblog-article-template .prblog-master-body figure.pr-media-square {
  aspect-ratio: 1 / 1 !important;
}
body.prblog-article-template .prblog-master-body figure.pr-media-4x3 {
  aspect-ratio: 4 / 3 !important;
}

/* Control del encuadre sin cambiar de archivo. */
body.prblog-article-template .prblog-master-body figure.pr-focus-top img {
  object-position: center top !important;
}
body.prblog-article-template .prblog-master-body figure.pr-focus-bottom img {
  object-position: center bottom !important;
}
body.prblog-article-template .prblog-master-body figure.pr-focus-left img {
  object-position: left center !important;
}
body.prblog-article-template .prblog-master-body figure.pr-focus-right img {
  object-position: right center !important;
}

/* En bloques a dos columnas el marco se adapta a la función del bloque. */
body.prblog-article-template .prblog-master-body .pr-section-split figure.pr-media {
  aspect-ratio: 4 / 3 !important;
  margin: 0 !important;
}

@media (max-width: 900px) {
  body.prblog-article-template .prblog-master-body figure.pr-media,
  body.prblog-article-template .prblog-master-body figure.pr-media-wide,
  body.prblog-article-template .prblog-master-body figure.pr-media-hero,
  body.prblog-article-template .prblog-master-body figure.pr-media-portrait,
  body.prblog-article-template .prblog-master-body figure.pr-media-section {
    aspect-ratio: 3 / 2 !important;
  }
}
@media (max-width: 620px) {
  body.prblog-article-template .prblog-master-body figure.pr-media,
  body.prblog-article-template .prblog-master-body figure.pr-media-wide,
  body.prblog-article-template .prblog-master-body figure.pr-media-hero,
  body.prblog-article-template .prblog-master-body figure.pr-media-portrait,
  body.prblog-article-template .prblog-master-body figure.pr-media-section,
  body.prblog-article-template .prblog-master-body figure.pr-media-landscape {
    aspect-ratio: 4 / 3 !important;
  }
}


/* --------------------------------------------------------------------------
   v0.9.3 - Bloque nativo de WordPress solo en la portada del blog.
   El plugin no recrea el formulario: deja que el contenido real de la página
   se renderice después de la paginación. No afecta a artículos individuales.
   -------------------------------------------------------------------------- */
.prblog-native-after-grid{width:100%;margin:58px 0 72px;padding:0}
.prblog-native-after-grid>*:first-child{margin-top:0}
.prblog-native-after-grid>*:last-child{margin-bottom:0}
body.prblog-article-template .prblog-native-after-grid{display:none!important}

/* v0.9.4 — Componente real Sage <x-contact-form variant="dudas" /> en /blog/. */
.prblog-sage-contact {
  width: 100%;
  margin-top: 64px;
}
.prblog-sage-contact > :first-child { margin-top: 0; }
.prblog-sage-contact > :last-child { margin-bottom: 0; }
