/* =========================================================
   /catalogos — tema claro, centrado en el catálogo
   La cabecera y el pie del sitio siguen en negro (identidad);
   el área de contenido es clara para que el embed sea el
   protagonista y las portadas se lean sin ruido alrededor.
   ========================================================= */

.page-catalog{ background:#fff; color:#111; }
.page-catalog #contenido{ background:#fff; }

/* La cabecera negra se separa del contenido claro con la línea roja */
.page-catalog .site-header{
    background:#000;
    border-bottom:2px solid #ff1400;
}
.page-catalog .site-header.is-stuck{ background:#000; }

/* ---------- Encabezado compacto y centrado ---------- */
.catalog-page-hero{
    position:relative;
    padding:clamp(30px,4vw,52px) 0 clamp(20px,2.6vw,30px);
    background:#fff;
    color:#111;
    text-align:center;
}
.catalog-page-hero__inner{
    max-width:760px;
    margin-inline:auto;
}
.catalog-page-hero .marker{
    display:flex; align-items:center; justify-content:center;
    gap:11px; margin-bottom:12px;
}
.catalog-page-hero .marker span{
    font-family:"Saira Condensed","Arial Narrow",Arial,sans-serif;
    font-size:.82rem; font-weight:800; letter-spacing:.2em;
    text-transform:uppercase; color:#ff1400;
}
.catalog-page-hero h1{
    margin:0 0 12px;
    font-family:"Saira Condensed","Arial Narrow",Arial,sans-serif;
    font-size:clamp(2.1rem,4.6vw,3.4rem); font-weight:800;
    line-height:.94; letter-spacing:-.015em; text-transform:uppercase;
    color:#111;
}
.catalog-page-hero h1 em{ font-style:normal; color:#ff1400; }
.catalog-page-hero p{
    margin:0 auto;
    max-width:56ch;
    color:#5c5c62;
    font-size:.98rem;
    line-height:1.55;
}

.catalog-hero-meta{
    display:flex; flex-wrap:wrap; justify-content:center;
    gap:8px; margin-top:20px;
}
.catalog-hero-meta span{
    display:inline-flex; align-items:center; gap:7px;
    padding:7px 14px;
    border:1px solid rgba(0,0,0,.14); border-radius:999px;
    font-family:"Saira Condensed","Arial Narrow",Arial,sans-serif;
    font-size:.84rem; font-weight:700; letter-spacing:.08em;
    text-transform:uppercase; color:#111;
    background:#fff;
}
.catalog-hero-meta b{ color:#ff1400; font-weight:800; }

/* ---------- El catálogo, protagonista ---------- */
.catalogo-wrap{
    width:100%;
    margin:0 auto;
    padding:0 0 clamp(34px,4vw,56px);
    background:#fff;
    overflow:hidden;
}
.catalogo-surface{
    width:min(1440px, calc(100% - 24px));
    margin-inline:auto;
    background:#fff;
    border-radius:16px;
    overflow:hidden;
}
#catalogo-embed{
    width:100%; max-width:100%;
    min-height:640px;
    background:#fff; color:#111;
    overflow:hidden;
}

.cat-noscript{
    max-width:720px; margin:24px auto; padding:18px;
    border:1px solid rgba(0,0,0,.12); border-radius:14px;
    text-align:center; font-weight:700; color:#111; background:#fff;
}
.cat-noscript a{ color:#ff1400; }

@media (max-width:760px){
    .catalog-page-hero{ padding:24px 0 16px; }
    .catalogo-surface{ width:calc(100% - 16px); border-radius:12px; }
    #catalogo-embed{ min-height:700px; }
}