/* ════════════════════════════════════════════════════════════
   Omnibus Store — Blog editorial
   Hub /blog con fondo negro + serif premium.
   Cargado después de homepage.css, reutiliza sus variables.
   Fraunces/Inter se cargan vía <link> en layout_seo.xml — NO usar
   @import aquí: Odoo minifica todo el bundle y @import fuera del
   inicio absoluto del bundle final rompe el parser y tumba todo
   el CSS de la web.
   ════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════
   Tokens locales del blog
   ═══════════════════════════════════════════ */
.ob-blog-page {
    --ob-blog-bg: #0A0A0A;
    --ob-blog-surface: #111111;
    --ob-blog-surface-2: #161616;
    --ob-blog-border: rgba(255, 255, 255, 0.08);
    --ob-blog-border-strong: rgba(255, 255, 255, 0.16);
    --ob-blog-text: #ECE7DB;
    --ob-blog-text-dim: rgba(236, 231, 219, 0.62);
    --ob-blog-text-muted: rgba(236, 231, 219, 0.42);
    --ob-blog-accent: #C93238;
    --ob-blog-accent-soft: rgba(201, 50, 56, 0.12);
    --ob-blog-cream: #F2ECE0;
    --ob-blog-cream-bg: #F4EEE1;
    --ob-blog-cream-surface: #FBF7EC;
    --ob-blog-cream-border: rgba(14, 14, 14, 0.10);
    --ob-blog-ink: #1A1A1A;
    --ob-blog-ink-dim: rgba(26, 26, 26, 0.68);
    --ob-blog-ink-muted: rgba(26, 26, 26, 0.48);
    --ob-font-serif: inherit;
    --ob-font-sans: inherit;
}

/* ═══════════════════════════════════════════
   BOX REUTILIZABLE — crema boxed sobre fondo negro
   Estilo de los bloques de la home: caja crema contenida
   con borde sutil y sombra, títulos y cuerpo en tinta.
   ═══════════════════════════════════════════ */
.ob-blog-box {
    background: var(--ob-blog-cream-bg);
    border: 1px solid var(--ob-blog-cream-border);
    border-radius: 6px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
    padding: 2rem 2.25rem;
    color: var(--ob-blog-ink);
    position: relative;
}
.ob-blog-box h1,
.ob-blog-box h2,
.ob-blog-box h3,
.ob-blog-box h4,
.ob-blog-box strong {
    color: var(--ob-blog-ink) !important;
    font-family: var(--ob-font-serif);
}
.ob-blog-box p {
    color: var(--ob-blog-ink-dim) !important;
    font-family: var(--ob-font-serif);
    font-weight: 400;
}
.ob-blog-box time {
    color: var(--ob-blog-ink-muted) !important;
}
.ob-blog-box .ob-blog-section-kicker { color: var(--ob-blog-accent); }
.ob-blog-section-kicker--ink { color: var(--ob-blog-ink) !important; }
.ob-blog-box__head {
    margin-bottom: 1.25rem;
    max-width: 720px;
}
.ob-blog-box__head h2 {
    font-size: clamp(1.5rem, 2.2vw, 1.9rem);
    margin: 0 0 0.35rem;
    line-height: 1.2;
    font-weight: 600;
}
.ob-blog-box__head p {
    font-size: 0.95rem;
    line-height: 1.55;
    margin: 0;
}

/* Variante oscura del box — mismo shape, paleta invertida */
.ob-blog-box--dark {
    background: var(--ob-blog-surface);
    border-color: var(--ob-blog-border-strong);
    color: var(--ob-blog-text);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.5);
}
.ob-blog-box--dark h1,
.ob-blog-box--dark h2,
.ob-blog-box--dark h3,
.ob-blog-box--dark h4,
.ob-blog-box--dark strong {
    color: var(--ob-blog-cream) !important;
}
.ob-blog-box--dark p {
    color: var(--ob-blog-text-dim) !important;
}
.ob-blog-box--dark time {
    color: var(--ob-blog-text-muted) !important;
}

/* ═══════════════════════════════════════════
   FONDO + HEADER coherente con el resto
   ═══════════════════════════════════════════ */
body:has(.ob-blog-page) {
    background: var(--ob-blog-bg);
    color: var(--ob-blog-text);
}
/* Todo el blog usa la misma fuente que el resto del sitio (body-font-family
   del theme: Inter). Odoo pinta los h1/h2/h3 con "Inter Tight" por defecto,
   lo forzamos a la fuente del body para coherencia total. */
.ob-blog-page,
.ob-blog-page h1, .ob-blog-page h2, .ob-blog-page h3,
.ob-blog-page h4, .ob-blog-page h5, .ob-blog-page h6,
.ob-blog-page .h1, .ob-blog-page .h2, .ob-blog-page .h3,
.ob-blog-page .h4, .ob-blog-page .h5, .ob-blog-page .h6 {
    font-family: var(--body-font-family) !important;
}
body:has(.ob-blog-page) #wrapwrap {
    background: var(--ob-blog-bg);
}
body:has(.ob-blog-page) header#top,
body:has(.ob-blog-page) header#top > .container-fluid {
    background: var(--ob-blog-bg) !important;
    background-color: var(--ob-blog-bg) !important;
    border: 0 !important;
    box-shadow: none !important;
}
body:has(.ob-blog-page) header#top nav.navbar {
    background: var(--ob-blog-surface) !important;
    border: 1px solid var(--ob-blog-border) !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.55) !important;
}
body:has(.ob-blog-page) footer {
    background: var(--ob-blog-bg) !important;
}

/* Container editorial 1120px — un pelo más estrecho que shop para respiración */
.ob-blog-page .container {
    max-width: 1120px !important;
}

/* Ocultar estructuras nativas que meten padding/fondo blanco */
.ob-blog-page .bg-100,
.ob-blog-page .bg-white,
.ob-blog-page .bg-light {
    background: transparent !important;
}
.ob-blog-page .o_wblog_normal,
.ob-blog-page .oe_structure:empty {
    padding: 0 !important;
    margin: 0 !important;
}

/* Tipografía base */
.ob-blog-page h1, .ob-blog-page h2, .ob-blog-page h3, .ob-blog-page h4,
.ob-blog-page .h1, .ob-blog-page .h2, .ob-blog-page .h3, .ob-blog-page .h4 {
    font-family: var(--ob-font-serif);
    color: var(--ob-blog-cream);
    letter-spacing: -0.01em;
    font-weight: 600;
}

/* Kicker reutilizable */
.ob-blog-section-kicker {
    display: inline-block;
    font-family: var(--ob-font-sans);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--ob-blog-accent);
    margin-bottom: 0.75rem;
}
.ob-blog-section-head {
    margin-bottom: 1.5rem;
    max-width: 680px;
}
.ob-blog-section-head h2 {
    font-size: clamp(1.5rem, 2.2vw, 1.9rem);
    margin: 0 0 0.4rem;
    line-height: 1.15;
}
.ob-blog-section-head p {
    color: var(--ob-blog-text-dim);
    font-size: 0.92rem;
    line-height: 1.55;
    margin: 0;
}
.ob-blog-section-head--split {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1.5rem;
    max-width: none;
}

/* ═══════════════════════════════════════════
   1. HERO
   ═══════════════════════════════════════════ */
.ob-blog-top { background: transparent !important; }
.ob-blog-hero { padding: 1.75rem 0 0.75rem; }
.ob-blog-box--hero {
    padding: 2.5rem 2rem 2.25rem;
    text-align: center;
    position: relative;
    overflow: visible;
}
.ob-blog-box--hero::before { border-radius: 6px; }
.ob-blog-box--hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(201, 50, 56, 0.07), transparent 70%);
    pointer-events: none;
}
.ob-blog-box--hero > * { position: relative; }
.ob-blog-hero__eyebrow {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color: var(--ob-blog-accent);
    margin-bottom: 1rem;
}
.ob-blog-hero__title {
    font-size: clamp(1.8rem, 3.6vw, 2.75rem);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.015em;
    color: var(--ob-blog-ink) !important;
    max-width: 820px;
    margin: 0 auto 0.9rem;
}
.ob-blog-hero__title em {
    font-style: italic;
    font-weight: 600;
    color: var(--ob-blog-accent);
}
.ob-blog-hero__lead {
    font-size: clamp(0.95rem, 1.2vw, 1.05rem);
    line-height: 1.6;
    color: var(--ob-blog-ink-dim) !important;
    max-width: 620px;
    margin: 0 auto 1.4rem;
    font-weight: 400;
}
.ob-blog-hero__search {
    display: flex;
    max-width: 520px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--ob-blog-cream-border);
    border-radius: 999px;
    padding: 0.3rem 0.35rem 0.3rem 1.3rem;
    box-shadow: 0 6px 18px rgba(14, 14, 14, 0.06);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ob-blog-hero__search:focus-within {
    border-color: var(--ob-blog-accent);
    box-shadow: 0 0 0 3px var(--ob-blog-accent-soft), 0 6px 18px rgba(14, 14, 14, 0.06);
}
.ob-blog-hero__search input {
    flex: 1;
    background: transparent;
    border: 0;
    outline: 0;
    color: var(--ob-blog-ink);
    font-size: 0.95rem;
    padding: 0.55rem 0;
}
.ob-blog-hero__search input::placeholder { color: var(--ob-blog-ink-muted); }

/* Dropdown autocomplete del hero */
.ob-blog-box--hero { position: relative; }
.ob-blog-suggest-wrap {
    position: relative;
    display: block;
    max-width: 520px;
    margin: 0 auto;
    z-index: 20;
}
.ob-blog-suggest {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 0.5rem);
    background: #fff;
    border: 1px solid var(--ob-blog-cream-border);
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(14, 14, 14, 0.18);
    z-index: 30;
    overflow: hidden;
    text-align: left;
    max-height: 420px;
    overflow-y: auto;
}
.ob-blog-suggest[hidden] { display: none; }
.ob-blog-suggest__item {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.7rem 0.9rem;
    text-decoration: none;
    color: var(--ob-blog-ink);
    border-bottom: 1px solid rgba(14, 14, 14, 0.06);
    transition: background 0.12s ease;
}
.ob-blog-suggest__item:last-child { border-bottom: 0; }
.ob-blog-suggest__item:hover { background: var(--ob-blog-cream-surface); }
.ob-blog-suggest__cover {
    flex-shrink: 0;
    width: 3rem;
    height: 3rem;
    border-radius: 4px;
    background: #E8E0CF;
    background-size: cover;
    background-position: center;
    border: 1px solid var(--ob-blog-cream-border);
}
.ob-blog-suggest__body {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.ob-blog-suggest__name {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--ob-blog-ink);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ob-blog-suggest__sub {
    font-size: 0.78rem;
    color: rgba(14, 14, 14, 0.6);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ob-blog-suggest__empty {
    padding: 1rem 1rem;
    text-align: center;
    color: var(--ob-blog-ink-muted);
    font-size: 0.85rem;
    font-style: italic;
}
.ob-blog-hero__search button {
    background: var(--ob-blog-accent);
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: 0.65rem 1.4rem;
    font-weight: 600;
    font-size: 0.88rem;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background 0.15s ease;
}
.ob-blog-hero__search button:hover { background: #a62428; }

/* Cabecera de vistas filtradas (tag, search) */
.ob-blog-filtered-head {
    padding: 3rem 0 1.5rem;
    border-bottom: 1px solid var(--ob-blog-border);
}
.ob-blog-backlink {
    display: inline-block;
    color: var(--ob-blog-ink-muted);
    text-decoration: none;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    margin-bottom: 0.9rem;
}
.ob-blog-backlink:hover { color: var(--ob-blog-accent); }
.ob-blog-box--dark .ob-blog-backlink { color: var(--ob-blog-text-muted); }

/* Destacado del área con fondo tipo portada */
.ob-blog-area-hero {
    position: relative;
    min-height: 360px;
    padding: 2.5rem 2.5rem;
    border-radius: 6px;
    border: 1px solid var(--ob-blog-border);
    background-color: var(--ob-blog-surface-2);
    background-size: cover;
    background-position: center;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
    color: inherit;
    overflow: hidden;
}
.ob-blog-area-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.85) 100%),
        radial-gradient(ellipse 60% 60% at 20% 100%, rgba(201,50,56,0.25), transparent 70%);
    pointer-events: none;
}
.ob-blog-area-hero__flag {
    position: absolute;
    top: 1.2rem;
    left: 1.2rem;
    background: var(--ob-blog-accent);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    z-index: 2;
}
.ob-blog-area-hero__inner {
    position: relative;
    z-index: 2;
    max-width: 720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 280px;
}
.ob-blog-area-hero .ob-blog-feed__tags {
    margin-bottom: 0.85rem;
    justify-content: center;
}
.ob-blog-area-hero .ob-blog-feed__tags a {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
    backdrop-filter: blur(4px);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.ob-blog-area-hero .ob-blog-feed__tags a:hover {
    background: var(--ob-blog-accent);
    border-color: var(--ob-blog-accent);
}
.ob-blog-area-hero h3 {
    font-size: clamp(1.6rem, 2.6vw, 2.2rem) !important;
    font-weight: 700 !important;
    line-height: 1.15;
    margin: 0 0 0.75rem;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.6);
}
.ob-blog-area-hero h3 a {
    color: var(--ob-blog-cream) !important;
    text-decoration: none;
}
.ob-blog-area-hero h3 a:hover { color: var(--ob-blog-accent) !important; }
.ob-blog-area-hero p {
    font-size: 1rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85) !important;
    margin: 0 0 1.25rem;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.5);
}
.ob-blog-area-hero .ob-blog-feed__read {
    display: inline-block;
    color: #fff;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 0.65rem 1.25rem;
    background: var(--ob-blog-accent);
    border-radius: 999px;
    align-self: center;
    transition: background 0.15s ease;
}
.ob-blog-area-hero .ob-blog-feed__read:hover { background: #a62428; }

/* Área: meta bajo el hero */
.ob-blog-area__meta {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-top: 0.25rem;
    font-size: 0.74rem;
    color: var(--ob-blog-ink-muted);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
}

/* Área: otras áreas (grid de chips horizontal) */
.ob-blog-area__others { padding: 1.5rem 2rem; }
.ob-blog-area__others .ob-blog-section-kicker { margin-bottom: 0.9rem; display: block; }
.ob-blog-area__others-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.6rem;
}

/* Estado vacío */
.ob-blog-area__empty {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--ob-blog-ink-muted);
    font-style: italic;
}
.ob-blog-filtered-title {
    font-family: var(--ob-font-serif);
    font-size: clamp(1.8rem, 3.5vw, 2.6rem);
    color: var(--ob-blog-cream);
    margin: 0;
}
.ob-blog-filtered-title span {
    color: var(--ob-blog-accent);
    font-style: italic;
}

/* ═══════════════════════════════════════════
   2+3. LÍNEA EDITORIAL + ÁREAS DEL BLOG (box unificado)
   ═══════════════════════════════════════════ */
.ob-blog-editorial { padding: 0.75rem 0; }
.ob-blog-editorial__box {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 2.25rem;
    padding: 2.25rem 2.5rem;
}
.ob-blog-editorial__box::after {
    content: "";
    position: absolute;
    top: 2.25rem;
    bottom: 2.25rem;
    left: calc(1.05 / 2.05 * 100% - 1.125rem);
    width: 1px;
    background: var(--ob-blog-border);
}
.ob-blog-editorial__intro h2 {
    font-size: clamp(1.5rem, 2.3vw, 1.95rem);
    line-height: 1.2;
    margin: 0.5rem 0 0.85rem;
    font-weight: 600;
}
.ob-blog-editorial__intro p {
    font-size: 1rem;
    line-height: 1.65;
    margin: 0;
}
.ob-blog-editorial__topics .ob-blog-section-kicker { margin-bottom: 1rem; }
.ob-blog-editorial__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
    margin-top: 0.35rem;
}
.ob-blog-topic-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.95rem;
    background: var(--ob-blog-bg);
    border: 1px solid var(--ob-blog-border);
    border-radius: 4px;
    text-decoration: none;
    color: var(--ob-blog-cream);
    font-size: 0.95rem;
    font-weight: 600;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.ob-blog-topic-chip:hover {
    background: var(--ob-blog-surface-2);
    border-color: var(--ob-blog-accent);
    transform: translateX(2px);
    color: var(--ob-blog-cream);
}
.ob-blog-section-kicker--ink { color: var(--ob-blog-cream) !important; }
.ob-blog-topic-chip__count {
    font-family: var(--ob-font-sans);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--ob-blog-accent);
    background: rgba(201, 50, 56, 0.08);
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
}

/* ═══════════════════════════════════════════
   4. FEATURED POST
   ═══════════════════════════════════════════ */
/* ═══════════════════════════════════════════
   4+5. FEED (destacado + grid) dentro del mismo box crema
   ═══════════════════════════════════════════ */
.ob-blog-feed { padding: 0.75rem 0; }
.ob-blog-feed--tight { padding: 0.4rem 0; }
.ob-blog-box--feed { padding: 2rem 2.25rem 2.25rem; }
.ob-blog-feed__head {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 1.75rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--ob-blog-cream-border);
}

/* Destacado dentro del feed */
.ob-blog-feed__featured {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 0;
    background: var(--ob-blog-cream-surface);
    border: 1px solid var(--ob-blog-cream-border);
    border-radius: 4px;
    overflow: hidden;
    transition: border-color 0.2s ease, transform 0.2s ease;
    margin-bottom: 1.5rem;
    position: relative;
}
.ob-blog-feed__featured:hover {
    border-color: var(--ob-blog-accent);
    transform: translateY(-2px);
}
.ob-blog-feed__featured-link {
    display: block;
    text-decoration: none;
    color: inherit;
}
.ob-blog-feed__featured-media {
    min-height: 280px;
    background: #E8E0CF;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ob-blog-feed__featured-placeholder {
    font-style: italic;
    color: var(--ob-blog-ink-muted);
    font-size: 1.05rem;
}
.ob-blog-feed__featured-flag {
    position: absolute;
    top: 0.9rem;
    left: 0.9rem;
    background: var(--ob-blog-accent);
    color: #fff;
    font-family: var(--ob-font-sans);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
}
.ob-blog-feed__featured-body {
    padding: 1.75rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.ob-blog-feed__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.7rem;
}
.ob-blog-feed__tags a {
    font-family: var(--ob-font-sans);
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ob-blog-accent);
    border: 1px solid var(--ob-blog-accent);
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}
.ob-blog-feed__tags a:hover {
    background: var(--ob-blog-accent);
    color: #fff;
}
.ob-blog-feed__featured-body h3 {
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 0.65rem;
}
.ob-blog-feed__featured-body h3 a {
    color: var(--ob-blog-ink);
    text-decoration: none;
}
.ob-blog-feed__featured-body h3 a:hover { color: var(--ob-blog-accent); }
.ob-blog-feed__featured-body p {
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--ob-blog-ink-dim);
    margin: 0 0 1.1rem;
}
.ob-blog-feed__featured-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-top: 0.9rem;
    border-top: 1px solid var(--ob-blog-cream-border);
    font-size: 0.76rem;
}
.ob-blog-feed__read {
    color: var(--ob-blog-accent);
    font-family: var(--ob-font-sans);
    font-weight: 700;
    font-size: 0.78rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.ob-blog-feed__read:hover { color: #e04048; }

/* Grid propio dentro del feed */
.ob-blog-feed__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.ob-blog-area__pager {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--ob-blog-cream-border);
}
.ob-blog-area__pager .pagination {
    margin-bottom: 0;
}
.ob-blog-area__pager .page-link {
    color: var(--ob-blog-accent);
}
.ob-blog-area__pager .page-item.active .page-link {
    background: var(--ob-blog-accent);
    border-color: var(--ob-blog-accent);
    color: #fff;
}
.ob-blog-card {
    display: flex;
    flex-direction: column;
    background: var(--ob-blog-cream-surface);
    border: 1px solid var(--ob-blog-cream-border);
    border-radius: 4px;
    overflow: hidden;
    transition: border-color 0.15s ease, transform 0.15s ease;
}
.ob-blog-card:hover {
    border-color: var(--ob-blog-accent);
    transform: translateY(-2px);
}
.ob-blog-card__link { display: block; text-decoration: none; color: inherit; }
.ob-blog-card__media {
    aspect-ratio: 16 / 9;
    background: #E8E0CF;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--ob-blog-cream-border);
}
.ob-blog-card__placeholder {
    font-style: italic;
    color: var(--ob-blog-ink-muted);
    font-size: 0.9rem;
}
.ob-blog-card__body {
    padding: 1rem 1.1rem 1.1rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.ob-blog-card__body .ob-blog-feed__tags { margin-bottom: 0.6rem; }
.ob-blog-card h4 {
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 0.4rem;
}
.ob-blog-card h4 a {
    color: var(--ob-blog-ink);
    text-decoration: none;
}
.ob-blog-card h4 a:hover { color: var(--ob-blog-accent); }
.ob-blog-card p {
    font-size: 0.83rem;
    line-height: 1.45;
    color: var(--ob-blog-ink-dim);
    margin: 0 0 0.7rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* ═══════════════════════════════════════════
   7. CTA FINAL
   ═══════════════════════════════════════════ */
.ob-blog-cta { padding: 0.75rem 0 2rem; }
.ob-blog-box--cta {
    padding: 2.25rem 2.5rem 2.5rem;
    text-align: center;
}
.ob-blog-cta__inner {
    max-width: 640px;
    margin: 0 auto;
}
.ob-blog-cta__inner h2 {
    font-family: var(--ob-font-serif);
    font-size: clamp(1.5rem, 2.3vw, 1.95rem);
    font-weight: 600;
    margin: 0.4rem 0 0.7rem;
    color: var(--ob-blog-ink) !important;
}
.ob-blog-cta__inner p {
    font-family: var(--ob-font-serif);
    font-size: 0.98rem;
    line-height: 1.6;
    color: #3a3a3a !important;
    margin: 0 0 1.25rem;
    font-weight: 400;
}
.ob-blog-cta__actions {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}
.ob-blog-btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    border-radius: 999px;
    font-family: var(--ob-font-sans);
    font-size: 0.84rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-decoration: none;
    border: 1px solid var(--ob-blog-cream-border);
    color: var(--ob-blog-ink);
    background: var(--ob-blog-cream-surface);
    transition: all 0.15s ease;
}
.ob-blog-btn:hover {
    background: #fff;
    border-color: var(--ob-blog-accent);
    color: var(--ob-blog-ink);
}
.ob-blog-btn--primary {
    background: var(--ob-blog-accent);
    border-color: var(--ob-blog-accent);
    color: #fff;
}
.ob-blog-btn--primary:hover {
    background: #a62428;
    border-color: #a62428;
    color: #fff;
}

/* ═══════════════════════════════════════════
   POST INDIVIDUAL (ficha) — plantilla editorial Omnibus
   ═══════════════════════════════════════════ */

/* Hero del post: imagen de fondo full box con overlay oscuro y texto encima */
.ob-blog-post-hero {
    position: relative;
    min-height: 420px;
    padding: 3rem 2.5rem;
    border-radius: 6px;
    border: 1px solid var(--ob-blog-border);
    background-color: var(--ob-blog-surface-2);
    background-size: cover;
    background-position: center;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.ob-blog-post-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(10,10,10,0.55) 0%, rgba(10,10,10,0.82) 100%),
        radial-gradient(ellipse 60% 60% at 20% 100%, rgba(201,50,56,0.25), transparent 70%);
    pointer-events: none;
}
.ob-blog-post-hero__inner {
    position: relative;
    z-index: 2;
    max-width: 780px;
    width: 100%;
}
.ob-blog-post-hero__eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color: var(--ob-blog-accent);
    margin-bottom: 1rem;
}
.ob-blog-post-hero__title {
    font-size: clamp(1.8rem, 3.4vw, 2.6rem) !important;
    font-weight: 700 !important;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: var(--ob-blog-cream) !important;
    margin: 0 auto 0.9rem;
    max-width: 720px;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.6);
}
.ob-blog-post-hero__lead {
    font-size: clamp(1rem, 1.3vw, 1.12rem);
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.88) !important;
    margin: 0 auto 1.3rem;
    max-width: 640px;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.5);
    font-weight: 400;
}
.ob-blog-post-hero__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    justify-content: center;
}
.ob-blog-post-hero__tags a {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
    text-decoration: none;
    backdrop-filter: blur(4px);
    transition: background 0.15s ease, border-color 0.15s ease;
}
.ob-blog-post-hero__tags a:hover {
    background: var(--ob-blog-accent);
    border-color: var(--ob-blog-accent);
}

/* Cuerpo del artículo: FORZADO box crema con texto negro.
   El box tiene el fondo crema. Los hijos son transparentes para que
   se vea el crema del box. El texto va a #111 sólido en todo. */
.ob-blog-page .ob-blog-post-body.ob-blog-post-body {
    background: #F4EEE1 !important;
    border: 1px solid rgba(14, 14, 14, 0.10) !important;
    padding: 2.5rem 2.25rem !important;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
}
.ob-blog-page .ob-blog-post-body.ob-blog-post-body *,
.ob-blog-page .ob-blog-post-content,
.ob-blog-page .ob-blog-post-content * {
    background: transparent !important;
    background-color: transparent !important;
    color: #111 !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
.ob-blog-page .ob-blog-post-content {
    max-width: 720px;
    margin: 0 auto;
    font-size: 1.12rem;
    line-height: 1.85;
    font-weight: 400;
    letter-spacing: 0.002em;
}
.ob-blog-page .ob-blog-post-content p {
    margin: 0 0 1.4rem;
    font-size: 1.12rem;
    line-height: 1.85;
}
.ob-blog-page .ob-blog-post-content h2 {
    margin-top: 2.8rem !important;
    margin-bottom: 1.1rem !important;
    padding-top: 0.6rem !important;
}
.ob-blog-page .ob-blog-post-content h3 {
    margin-top: 2rem !important;
    margin-bottom: 0.7rem !important;
}
.ob-blog-page .ob-blog-post-content ul,
.ob-blog-page .ob-blog-post-content ol {
    margin-bottom: 1.5rem;
    padding-left: 1.4rem;
}
.ob-blog-page .ob-blog-post-content li {
    margin-bottom: 0.7rem;
    line-height: 1.75;
}
/* El campo content de Odoo viene envuelto en un div con clase
   `o_wblog_post_content_field o_wblog_read_text` que puede traer
   padding/border/shadow propios → neutralizar. */
.ob-blog-page .ob-blog-post-content .o_wblog_post_content_field,
.ob-blog-page .ob-blog-post-content .o_wblog_read_text,
.ob-blog-page .ob-blog-post-content > div,
.ob-blog-page .ob-blog-post-content > div > div {
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
.ob-blog-post-content > div > :first-child { margin-top: 0; }
.ob-blog-post-content > div > :last-child { margin-bottom: 0; }
.ob-blog-post-content p { margin: 0 0 1.2rem; }

/* Esconde TODA la basura heredada de Odoo que vive dentro del content:
   - breadcrumb del post viejo
   - info bar (fecha/autor/OdooBot)
   - sidebar con "Compartir", "Etiquetas", iconos sociales
   - portal chatter (campo de mensajes)
   - next post footer
   Todo eso fue pegado dentro de blog_post.content al editar con el editor
   visual Odoo. Nuestro template ya pinta lo que necesita fuera. */
.ob-blog-post-content .breadcrumb,
.ob-blog-post-content #o_wblog_post_info,
.ob-blog-post-content .o_wblog_author_avatar,
.ob-blog-post-content .o_wblog_author_avatar_date,
.ob-blog-post-content address.o_portal_address,
.ob-blog-post-content nav[aria-label="migas de pan"],
.ob-blog-post-content nav[aria-label="breadcrumb"],
.ob-blog-post-content .small_social_icon,
.ob-blog-post-content .s_share,
.ob-blog-post-content [class*="social_share"],
.ob-blog-post-content [class*="o_wblog_sidebar"],
.ob-blog-post-content .o_portal_chatter,
.ob-blog-post-content #discussion,
.ob-blog-post-content #o_wblog_post_comments,
.ob-blog-post-content #o_wblog_post_footer,
.ob-blog-post-content #o_wblog_next_container,
.ob-blog-post-content .o_wblog_next_button,
.ob-blog-post-content [class*="o_wblog_next"],
.ob-blog-post-content .oe_structure:empty,
.ob-blog-post-content h6.text-uppercase,
.ob-blog-post-content .h5:has(> a.post_link),
.ob-blog-post-content [id^="oe_structure_blog_post_sidebar"] {
    display: none !important;
}

/* Tags del sidebar antiguo de Odoo (los del bloque ETIQUETAS heredado) */
.ob-blog-post-content a.post_link.o_tag,
.ob-blog-post-content .post_link[class*="o_tag"] {
    display: none !important;
}
.ob-blog-post-content p:first-of-type::first-letter {
    font-size: 3.4rem;
    font-weight: 700;
    float: left;
    line-height: 0.9;
    padding: 0.3rem 0.6rem 0 0;
    color: var(--ob-blog-accent);
}
.ob-blog-post-content .ob-reading-guide p:first-of-type::first-letter,
.ob-blog-post-content .ob-reading-guide .ob-guide-intro p:first-of-type::first-letter,
.ob-blog-post-content .ob-reading-guide .ob-guide-section p:first-of-type::first-letter {
    float: none !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
.ob-blog-post-content h1,
.ob-blog-post-content h2,
.ob-blog-post-content h3,
.ob-blog-post-content h4,
.ob-blog-post-content h5,
.ob-blog-post-content h6 {
    color: var(--ob-blog-cream) !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
}
.ob-blog-post-content h2 {
    font-size: clamp(1.4rem, 2.2vw, 1.75rem) !important;
    line-height: 1.2;
    margin: 2.2rem 0 0.9rem;
    padding-top: 0.4rem;
}
.ob-blog-post-content h3 {
    font-size: clamp(1.15rem, 1.7vw, 1.35rem) !important;
    margin: 1.6rem 0 0.6rem;
    line-height: 1.25;
}
.ob-blog-post-content h4 {
    font-size: 1.05rem !important;
    margin: 1.2rem 0 0.5rem;
}
.ob-blog-post-content a,
.ob-blog-post-content a span,
.ob-blog-post-content a em,
.ob-blog-post-content a * {
    color: var(--ob-blog-accent) !important;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.15s ease;
}
.ob-blog-post-content a:hover,
.ob-blog-post-content a:hover * { color: #e04048 !important; }
.ob-blog-post-content strong,
.ob-blog-post-content b {
    color: var(--ob-blog-cream) !important;
    font-weight: 700;
}
.ob-blog-post-content em,
.ob-blog-post-content i { font-style: italic; }
.ob-blog-post-content ul,
.ob-blog-post-content ol {
    margin: 0 0 1.3rem;
    padding-left: 1.3rem;
}
.ob-blog-post-content li {
    margin-bottom: 0.55rem;
    line-height: 1.65;
}
.ob-blog-post-content li::marker { color: var(--ob-blog-accent); }
.ob-blog-post-content blockquote,
.ob-blog-post-content blockquote p {
    color: var(--ob-blog-cream) !important;
}
.ob-blog-post-content blockquote {
    border-left: 3px solid var(--ob-blog-accent);
    padding: 0.4rem 0 0.4rem 1.4rem;
    margin: 1.8rem 0;
    font-style: italic;
    font-size: 1.1rem;
    line-height: 1.55;
}
.ob-blog-post-content img,
.ob-blog-post-content figure img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 1.75rem 0;
    border: 1px solid var(--ob-blog-border);
}
.ob-blog-post-content figure { margin: 1.75rem 0; }
.ob-blog-post-content figcaption {
    font-size: 0.82rem;
    color: var(--ob-blog-text-muted) !important;
    text-align: center;
    margin-top: 0.5rem;
    font-style: italic;
}
.ob-blog-post-content hr {
    border: 0;
    border-top: 1px solid var(--ob-blog-border);
    margin: 2.25rem auto;
    max-width: 120px;
    opacity: 1;
}
.ob-blog-post-content pre,
.ob-blog-post-content code {
    background: rgba(255, 255, 255, 0.06) !important;
    border-radius: 4px;
    padding: 0.15rem 0.45rem;
    font-size: 0.92em;
    color: var(--ob-blog-cream) !important;
}
.ob-blog-post-content pre {
    padding: 1rem 1.2rem;
    overflow-x: auto;
    margin: 1.5rem 0;
}
.ob-blog-post-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 0.95rem;
}
.ob-blog-post-content th,
.ob-blog-post-content td {
    border-bottom: 1px solid var(--ob-blog-border);
    padding: 0.6rem 0.8rem;
    text-align: left;
    color: var(--ob-blog-cream) !important;
}
.ob-blog-post-content th {
    background: rgba(255, 255, 255, 0.04) !important;
    font-weight: 700;
}

/* ──── Snippet hero entidad en blog — reutiliza ob-related-* de catalog.css
   con box crema igual que la ficha de producto ──── */
.ob-blog-entity-snippet {
    background: var(--ob-cream, #F5F0E8);
    border: 1px solid var(--ob-border, rgba(14,14,14,0.08));
    border-radius: var(--ob-radius-lg, 1.2rem);
    padding: 1.5rem;
    margin-bottom: 1rem;
    position: relative;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
}
@media (min-width: 768px) {
    .ob-blog-entity-snippet { padding: 2rem; }
}

/* Forzar colores oscuros en cards y textos dentro del snippet crema,
   porque el blog wrapper hereda color claro (#ECE7DB) a todo. */
.ob-blog-entity-snippet .ob-rc__title,
.ob-blog-entity-snippet .ob-rc__title-link,
.ob-blog-entity-snippet .ob-rc__price-now,
.ob-blog-entity-snippet .ob-rc__body {
    color: var(--ob-text, #1A1A1A) !important;
}
.ob-blog-entity-snippet .ob-rc__price-old {
    color: var(--ob-text-muted, #777) !important;
}
.ob-blog-entity-snippet .ob-related-hero__title {
    color: var(--ob-text, #1A1A1A) !important;
}
.ob-blog-entity-snippet .ob-related-hero__desc {
    color: var(--ob-text-muted, #555) !important;
}
.ob-blog-entity-snippet .ob-related-hero {
    border-bottom-color: var(--ob-border, rgba(14,14,14,0.08));
}

.ob-blog-entity-snippet .ob-related-collapse {
    display: none;
    padding-top: 1.75rem;
    border-top: 0;
    margin-top: 1.5rem;
}
.ob-blog-entity-snippet .ob-related-toggle:checked ~ .ob-related-collapse {
    display: block;
}
.ob-blog-entity-snippet .ob-related-toggle {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.ob-blog-entity-snippet .ob-related-toggle:checked ~ .ob-related-hero .ob-related-hero__cta-more,
.ob-blog-entity-snippet .ob-related-hero__cta-less {
    display: none;
}
.ob-blog-entity-snippet .ob-related-toggle:checked ~ .ob-related-hero .ob-related-hero__cta-less {
    display: inline;
}
.ob-blog-entity-snippet .ob-related-toggle:checked ~ .ob-related-hero .ob-related-hero__cta i {
    transform: rotate(180deg);
}

/* Snippet de productos del blog: misma plantilla y carrusel que el home. */
.ob-blog-entity-snippet .ob-related-collapse.ob-hero-card {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--ob-text, #1a1a1a) !important;
}
.ob-blog-entity-snippet .ob-hero-card__carousel {
    margin: 0;
}
.ob-blog-entity-snippet .ob-hero-card__carousel .row {
    align-items: stretch;
}
.ob-blog-entity-snippet .ob-card--product {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    background: var(--ob-black, #0e0e0e) !important;
    color: var(--ob-white, #fff) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 28px rgba(14, 14, 14, 0.24);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.ob-blog-entity-snippet .ob-card--product:hover {
    transform: translateY(-3px);
    border-color: var(--ob-granate, #870d18) !important;
    box-shadow: 0 18px 42px rgba(14, 14, 14, 0.34);
}
.ob-blog-entity-snippet .ob-card--product > .oe_product_image {
    width: 100% !important;
    flex: 0 0 auto !important;
    aspect-ratio: 3 / 4 !important;
    overflow: hidden !important;
    background: var(--ob-black-soft, #151515) !important;
    margin: 0 !important;
}
.ob-blog-entity-snippet .ob-card--product .oe_product_image_link,
.ob-blog-entity-snippet .ob-card--product .oe_product_image_img_wrapper {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}
.ob-blog-entity-snippet .ob-card--product .oe_product_image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    padding: 0 !important;
}
.ob-blog-entity-snippet .ob-card--product > .o_wsale_product_information {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.55rem !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0.85rem 0.9rem 1rem !important;
    background: var(--ob-black, #0e0e0e) !important;
    color: var(--ob-white, #fff) !important;
}
.ob-blog-entity-snippet .ob-card--product .o_wsale_product_information_text {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.3rem !important;
    min-height: 0 !important;
    margin: 0 !important;
}
.ob-blog-entity-snippet .ob-card--product h2.o_wsale_products_item_title {
    color: var(--ob-white, #fff) !important;
    font-size: 0.88rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    text-align: center !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    white-space: normal !important;
}
.ob-blog-entity-snippet .ob-card--product h2.o_wsale_products_item_title a,
.ob-blog-entity-snippet .ob-card--product h2.o_wsale_products_item_title a span {
    color: var(--ob-white, #fff) !important;
    text-decoration: none !important;
}
.ob-blog-entity-snippet .ob-card--product .oe_subdescription_wrapper {
    display: block !important;
    margin: 0 !important;
}
.ob-blog-entity-snippet .ob-card--product .oe_subdescription,
.ob-blog-entity-snippet .ob-card--product .oe_subdescription * {
    color: rgba(255, 255, 255, 0.64) !important;
    font-size: 0.74rem !important;
    line-height: 1.35 !important;
}
.ob-blog-entity-snippet .ob-card--product .oe_subdescription {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin: 0 !important;
}
.ob-blog-entity-snippet .ob-card--product .ob-card__foot {
    margin-top: auto !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    background: var(--ob-black, #0e0e0e) !important;
}
.ob-blog-entity-snippet .ob-card--product .product_price {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 0.35rem !important;
    color: var(--ob-white, #fff) !important;
    font-size: 0.95rem !important;
    font-weight: 800 !important;
}
.ob-blog-entity-snippet .ob-card--product .ob-card__price {
    color: var(--ob-white, #fff) !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
}
.ob-blog-entity-snippet .ob-card--product .ob-card__price-old {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 0.72rem !important;
}
.ob-blog-entity-snippet .ob-card--product .ob-card__discount {
    background: var(--ob-granate, #870d18) !important;
    border-color: var(--ob-granate, #870d18) !important;
    color: var(--ob-white, #fff) !important;
}
.ob-blog-entity-snippet .ob-card--product .ob-card__actions {
    display: flex !important;
    align-items: stretch !important;
    gap: 0.45rem !important;
}
.ob-blog-entity-snippet .ob-card__btn-add {
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    background: var(--ob-granate, #870d18);
    color: var(--ob-white, #fff) !important;
    font-weight: 800;
    font-size: 0.78rem;
    padding: 0.55rem 0.65rem;
    border-radius: 999px;
    text-decoration: none !important;
    border: 0;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ob-blog-entity-snippet .ob-card__btn-add span {
    display: none;
}
.ob-blog-entity-snippet .ob-card__btn-buy {
    position: relative;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.08);
    color: var(--ob-white, #fff) !important;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    text-decoration: none !important;
}
.ob-blog-entity-snippet .ob-card__btn-buy-label {
    display: none;
}
@media (max-width: 575.98px) {
    .ob-blog-entity-snippet .ob-card--product .oe_subdescription_wrapper {
        display: none !important;
    }
    .ob-blog-entity-snippet .ob-card--product > .o_wsale_product_information {
        padding: 0.75rem 0.75rem 0.9rem !important;
    }
}

/* Card compacta común usada en snippets de producto relacionados.
   El blog no carga catalog.css, así que trae aquí el mismo bloque visual. */
.ob-blog-entity-snippet .ob-rc {
    display: flex;
    flex-direction: column;
    background: var(--ob-cream, #f6efe2);
    border: 1px solid var(--ob-border, rgba(31, 23, 23, 0.12));
    border-radius: var(--ob-radius, 8px);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(14, 14, 14, 0.04);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.ob-blog-entity-snippet .ob-rc:hover {
    transform: translateY(-3px);
    border-color: var(--ob-granate, #870d18);
    box-shadow: 0 10px 28px rgba(14, 14, 14, 0.12);
}
.ob-blog-entity-snippet .ob-rc__img-link {
    display: block;
    position: relative;
    text-decoration: none;
    color: inherit;
}
.ob-blog-entity-snippet .ob-rc__img {
    position: relative;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    background: var(--ob-surface-alt, #efe6d7);
    display: flex;
    align-items: center;
    justify-content: center;
}
.ob-blog-entity-snippet .ob-rc__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}
.ob-blog-entity-snippet .ob-rc:hover .ob-rc__img img {
    transform: scale(1.04);
}
.ob-blog-entity-snippet .ob-rc__discount {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    background: var(--ob-granate, #870d18);
    color: var(--ob-white, #fff);
    font-size: 0.6rem;
    font-weight: 800;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    letter-spacing: 0.02em;
    line-height: 1;
    z-index: 1;
}
.ob-blog-entity-snippet .ob-rc__body {
    padding: 0.85rem 0.95rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1 1 auto;
}
.ob-blog-entity-snippet .ob-rc__title-link {
    text-decoration: none;
    color: inherit;
}
.ob-blog-entity-snippet .ob-rc__title-link:hover .ob-rc__title {
    color: var(--ob-granate, #870d18) !important;
}
.ob-blog-entity-snippet .ob-rc__title {
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--ob-text, #1a1a1a) !important;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.5em;
    transition: color 0.15s ease;
}
.ob-blog-entity-snippet .ob-rc__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: auto;
    padding-top: 0.35rem;
}
.ob-blog-entity-snippet .ob-rc__price {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    flex-wrap: wrap;
    min-width: 0;
}
.ob-blog-entity-snippet .ob-rc__price-now {
    font-size: 1rem;
    font-weight: 800;
    color: var(--ob-text, #1a1a1a) !important;
    line-height: 1.1;
}
.ob-blog-entity-snippet .ob-rc__price-old {
    font-size: 0.72rem;
    color: var(--ob-text-muted, #777) !important;
    text-decoration: line-through;
}
.ob-blog-entity-snippet .ob-rc__cart {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ob-granate, #870d18);
    color: var(--ob-white, #fff) !important;
    border: 0;
    border-radius: 999px;
    text-decoration: none;
    font-size: 0.85rem;
    transition: background 0.15s ease, transform 0.15s ease;
}
.ob-blog-entity-snippet .ob-rc__cart:hover {
    background: var(--ob-granate-dark, #6e0914);
    color: var(--ob-white, #fff) !important;
    transform: scale(1.06);
    text-decoration: none;
}
.ob-blog-entity-snippet .ob-related-grid {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: rgba(135, 13, 24, 0.5) rgba(31, 23, 23, 0.08);
    padding: 0.05rem 0.05rem 0.85rem;
}
.ob-blog-entity-snippet .ob-related-grid::-webkit-scrollbar {
    height: 8px;
}
.ob-blog-entity-snippet .ob-related-grid::-webkit-scrollbar-track {
    background: rgba(31, 23, 23, 0.08);
    border-radius: 999px;
}
.ob-blog-entity-snippet .ob-related-grid::-webkit-scrollbar-thumb {
    background: rgba(135, 13, 24, 0.55);
    border-radius: 999px;
}
.ob-blog-entity-snippet .ob-related-grid > .ob-rc,
.ob-blog-entity-snippet .ob-related-grid > .ob-card--product {
    flex: 0 0 calc((100% - 3rem) / 4) !important;
    width: calc((100% - 3rem) / 4) !important;
    min-width: calc((100% - 3rem) / 4) !important;
    max-width: calc((100% - 3rem) / 4) !important;
    scroll-snap-align: start;
}
.ob-blog-entity-snippet .ob-related-grid > .ob-card--product {
    height: auto !important;
}
@media (max-width: 991.98px) {
    .ob-blog-entity-snippet .ob-related-grid > .ob-rc,
    .ob-blog-entity-snippet .ob-related-grid > .ob-card--product {
        flex-basis: calc((100% - 1rem) / 2) !important;
        width: calc((100% - 1rem) / 2) !important;
        min-width: calc((100% - 1rem) / 2) !important;
        max-width: calc((100% - 1rem) / 2) !important;
    }
}
@media (max-width: 575.98px) {
    .ob-blog-entity-snippet .ob-related-grid > .ob-rc,
    .ob-blog-entity-snippet .ob-related-grid > .ob-card--product {
        flex-basis: min(78vw, 260px) !important;
        width: min(78vw, 260px) !important;
        min-width: min(78vw, 260px) !important;
        max-width: min(78vw, 260px) !important;
    }
}

/* Strip tags + compartir — mimetizado con el fondo negro del blog, sin box */
.ob-blog-post-close-strip { padding: 1.75rem 0 1.25rem; }
.ob-blog-post-close {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    padding: 0 0.5rem;
}
.ob-blog-post-close__col { min-width: 0; }
.ob-blog-post-close .ob-blog-section-kicker {
    display: block;
    margin-bottom: 0.85rem;
    color: var(--ob-blog-accent);
}
.ob-blog-post-close__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}
.ob-blog-post-close__tags a {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--ob-blog-accent);
    border: 1px solid var(--ob-blog-accent);
    border-radius: 999px;
    padding: 0.28rem 0.8rem;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}
.ob-blog-post-close__tags a:hover {
    background: var(--ob-blog-accent);
    color: #fff;
}
.ob-blog-post-close__share {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}
.ob-blog-post-close__share a {
    width: 2.4rem;
    height: 2.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ob-blog-border-strong);
    background: var(--ob-blog-surface);
    color: var(--ob-blog-cream);
    border-radius: 999px;
    text-decoration: none;
    font-size: 1rem;
    transition: all 0.15s ease;
}
.ob-blog-post-close__share a:hover {
    background: var(--ob-blog-accent);
    border-color: var(--ob-blog-accent);
    color: #fff;
    transform: translateY(-1px);
}

/* Comentarios: box crema con lista + form propio */
.ob-blog-post-comments.ob-blog-post-comments {
    background: #F4EEE1 !important;
    padding: 2rem 2.25rem 2.25rem;
}
.ob-blog-post-comments.ob-blog-post-comments *,
.ob-blog-post-comments.ob-blog-post-comments h2,
.ob-blog-post-comments.ob-blog-post-comments h3,
.ob-blog-post-comments.ob-blog-post-comments p,
.ob-blog-post-comments.ob-blog-post-comments label,
.ob-blog-post-comments.ob-blog-post-comments span {
    color: #111 !important;
}
.ob-blog-post-comments .ob-blog-box__head {
    text-align: center;
    margin: 0 auto 1.5rem;
}
.ob-blog-post-comments .ob-blog-section-kicker { color: var(--ob-blog-accent) !important; }
.ob-blog-comments__list {
    margin: 0 0 2rem;
    padding: 0 0 1.5rem;
    border-bottom: 1px solid var(--ob-blog-cream-border);
}
.ob-blog-comment {
    padding: 1rem 0;
    border-bottom: 1px solid rgba(14, 14, 14, 0.07);
}
.ob-blog-comment:last-child { border-bottom: 0; }
.ob-blog-comment__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    margin-bottom: 0.4rem;
    font-size: 0.85rem;
}
.ob-blog-comment__head strong {
    color: #111 !important;
    font-weight: 700;
}
.ob-blog-comment__head time {
    color: rgba(14, 14, 14, 0.5) !important;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
}
.ob-blog-comment__body {
    color: #333 !important;
    font-size: 0.96rem;
    line-height: 1.6;
}
.ob-blog-comment-form h3 {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    margin: 0 0 1rem !important;
    color: #111 !important;
}
.ob-blog-comment-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.9rem;
}
.ob-blog-comment-form label {
    display: block;
    margin-bottom: 0.9rem;
}
.ob-blog-comment-form label span {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(14, 14, 14, 0.6) !important;
    margin-bottom: 0.35rem;
}
.ob-blog-comment-form input,
.ob-blog-comment-form textarea {
    width: 100%;
    background: #fff !important;
    border: 1px solid rgba(14, 14, 14, 0.15) !important;
    color: #111 !important;
    padding: 0.65rem 0.85rem;
    font-size: 0.95rem;
    border-radius: 4px;
    font-family: inherit;
}
.ob-blog-comment-form input:focus,
.ob-blog-comment-form textarea:focus {
    outline: 0;
    border-color: var(--ob-blog-accent) !important;
    box-shadow: 0 0 0 3px rgba(201, 50, 56, 0.12);
}
.ob-blog-comment-form textarea {
    resize: vertical;
    min-height: 120px;
}
.ob-blog-comment-form button[type="submit"] {
    margin-top: 0.5rem;
}

@media (max-width: 991px) {
    .ob-blog-post-close { grid-template-columns: 1fr; gap: 1.5rem; padding: 0 1rem; }
    .ob-blog-comment-form__row { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════
   POST LEGACY (fallback Odoo nativo, por si se
   llega desde /blog/guias-2/xxx — se deja decente)
   ═══════════════════════════════════════════ */
.ob-blog-page .o_wblog_post_page_cover {
    min-height: 0 !important;
    padding: 3rem 0 1.5rem !important;
    background: transparent !important;
    box-shadow: none !important;
}
.ob-blog-page .o_wblog_post_page_cover h1,
.ob-blog-page .o_wblog_post_page_cover .h1 {
    font-family: var(--ob-font-serif) !important;
    color: var(--ob-blog-cream) !important;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    font-weight: 500 !important;
    letter-spacing: -0.015em !important;
    text-shadow: none !important;
    line-height: 1.1 !important;
}
.ob-blog-page .o_wblog_post_page_cover .lead,
.ob-blog-page .o_wblog_post_page_cover p {
    font-family: var(--ob-font-serif) !important;
    color: var(--ob-blog-text-dim) !important;
    text-shadow: none !important;
    font-style: italic;
    font-weight: 300;
}
.ob-blog-page .o_wblog_post_main,
.ob-blog-page #o_wblog_post_main,
.ob-blog-page .o_wblog_post_content_field {
    background: var(--ob-blog-surface);
    border: 1px solid var(--ob-blog-border);
    border-radius: 6px;
    padding: 2rem;
    color: var(--ob-blog-text);
    font-family: var(--ob-font-serif);
    font-size: 1.08rem;
    line-height: 1.8;
    font-weight: 300;
}
@media (min-width: 992px) {
    .ob-blog-page .o_wblog_post_main,
    .ob-blog-page #o_wblog_post_main,
    .ob-blog-page .o_wblog_post_content_field {
        padding: 3rem 3.5rem;
    }
}
.ob-blog-page .o_wblog_post_content_field h2,
.ob-blog-page .o_wblog_post_content_field h3 {
    font-family: var(--ob-font-serif);
    color: var(--ob-blog-cream);
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}
.ob-blog-page .o_wblog_post_content_field a {
    color: var(--ob-blog-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.ob-blog-page .o_wblog_post_content_field blockquote {
    border-left: 3px solid var(--ob-blog-accent);
    padding: 0.5rem 0 0.5rem 1.5rem;
    color: var(--ob-blog-text-dim);
    font-style: italic;
    margin: 1.5rem 0;
}
.ob-blog-page aside.o_wblog_sidebar,
.ob-blog-page .o_wblog_sidebar {
    background: var(--ob-blog-surface);
    border: 1px solid var(--ob-blog-border);
    border-radius: 6px;
    padding: 1.5rem;
}
.ob-blog-page .o_portal_chatter {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid var(--ob-blog-border);
}

/* ═══════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════ */
@media (max-width: 991px) {
    .ob-blog-editorial__box { grid-template-columns: 1fr; gap: 1.75rem; }
    .ob-blog-editorial__box::after { display: none; }
    .ob-blog-editorial__grid { grid-template-columns: 1fr 1fr; }
    .ob-blog-feed__head { flex-direction: column; align-items: flex-start; }
    .ob-blog-feed__search { width: 100%; min-width: 0; }
    .ob-blog-feed__featured { grid-template-columns: 1fr; }
    .ob-blog-feed__featured-media { min-height: 220px; }
    .ob-blog-feed__featured-body { padding: 1.5rem 1.5rem; }
    .ob-blog-feed__grid { grid-template-columns: repeat(2, 1fr); }
    .ob-blog-feed__head { text-align: center; }
    .ob-blog-area__others-grid { grid-template-columns: repeat(2, 1fr); }
    .ob-blog-area-hero { min-height: 300px; padding: 2rem 1.75rem; }
    .ob-blog-area-hero__inner { min-height: 220px; }
    .ob-blog-area-hero .ob-blog-feed__read { display: none; }
    .ob-blog-post-hero { min-height: 320px; padding: 2rem 1.5rem; }
    .ob-blog-post-body { padding: 2rem 1.5rem; }
    .ob-blog-post-content { font-size: 1rem; line-height: 1.7; }
    .ob-blog-post-content p:first-of-type::first-letter { font-size: 2.8rem; }
}
@media (max-width: 600px) {
    .ob-blog-hero { padding: 2.25rem 0 2rem; }
    .ob-blog-hero__search {
        flex-direction: column;
        border-radius: 14px;
        padding: 0.8rem;
        gap: 0.6rem;
    }
    .ob-blog-hero__search input { padding: 0.4rem 0.8rem; width: 100%; }
    .ob-blog-hero__search button { width: 100%; padding: 0.8rem; }
    .ob-blog-editorial__grid { grid-template-columns: 1fr; }
    .ob-blog-box { padding: 1.5rem 1.25rem; }
    .ob-blog-box--feed { padding: 1.5rem 1.25rem; }
    .ob-blog-editorial__box { padding: 1.5rem 1.25rem; }
    .ob-blog-feed__grid { grid-template-columns: 1fr; }
    .ob-blog-editorial, .ob-blog-feed, .ob-blog-cta { padding: 1.75rem 0; }
    .ob-blog-cta__actions { flex-direction: column; }
    .ob-blog-btn { width: 100%; }
}

/* ═══════════════════════════════════════════
   READING GUIDES — formato editorial reforzado
   Usado en guías tipo Batman/Daredevil/Wolverine:
   títulos de sección con numeración + bloque visual de recomendaciones.
   ═══════════════════════════════════════════ */
.ob-blog-post-content {
    counter-reset: ob-reading-section;
}

.ob-blog-post-content h2:not(.ob-rec-title):not(.ob-related-hero__title) {
    position: relative;
    margin: 3rem 0 1.25rem !important;
    padding: 2.4rem 0 1rem !important;
    color: #1f1717 !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 4.2vw, 3.25rem) !important;
    font-weight: 900 !important;
    line-height: 0.98 !important;
    letter-spacing: -0.03em !important;
    border-top: 1px solid rgba(31, 23, 23, 0.12);
}

.ob-blog-post-content h2:not(.ob-rec-title):not(.ob-related-hero__title)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ob-blog-accent) 0 88px, rgba(135, 13, 24, 0.16) 88px 100%) !important;
    border-radius: 999px;
}

.ob-blog-post-content .ob-rec-section,
.ob-blog-post-content .ob-rec-summary {
    border-color: rgba(31, 23, 23, 0.12) !important;
}

.ob-blog-post-content .ob-rec-section {
    margin: 3rem 0 0;
    padding: 2.5rem 0 0;
    border-top: 1px solid rgba(31, 23, 23, 0.12) !important;
}

.ob-blog-post-content .ob-rec-head {
    display: block;
    margin-bottom: 1.35rem;
}

.ob-blog-post-content .ob-rec-kicker {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--ob-blog-accent) !important;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ob-blog-post-content .ob-rec-title {
    margin: 0 !important;
    padding: 0 !important;
    color: #1f1717 !important;
    font-family: var(--ob-font-sans, Arial, sans-serif);
    font-size: clamp(1.55rem, 2.35vw, 2.05rem) !important;
    font-weight: 850 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    border: 0 !important;
    max-width: 680px;
}

.ob-blog-post-content .ob-rec-title::before,
.ob-blog-post-content .ob-rec-title::after {
    content: none !important;
}

.ob-blog-post-content .ob-rec-note {
    max-width: 680px;
    margin: 0.65rem 0 0;
    color: #6f5f5b !important;
    font-size: 0.92rem;
    line-height: 1.45;
}

.ob-blog-post-content .ob-rec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.ob-blog-post-content .ob-rec-card {
    display: grid;
    grid-template-rows: auto auto 1fr;
    min-height: 210px;
    padding: 1.35rem;
    background: #fffaf2 !important;
    border: 1px solid rgba(31, 23, 23, 0.12) !important;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(31, 23, 23, 0.08) !important;
}

.ob-blog-post-content .ob-rec-card--primary {
    grid-column: span 2;
    min-height: 190px;
    color: #fff !important;
    background: linear-gradient(135deg, #740a14 0%, #9f1823 52%, #1f1717 100%) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.ob-blog-post-content .ob-rec-card__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-bottom: 1.15rem;
    color: #fff !important;
    background: var(--ob-blog-accent) !important;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 900;
}

.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__index {
    color: var(--ob-blog-accent) !important;
    background: #fff !important;
}

.ob-blog-post-content .ob-rec-card__label {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--ob-blog-accent) !important;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__label,
.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__angle,
.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__why,
.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__choice,
.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__choice a {
    color: #fff !important;
}

.ob-blog-post-content .ob-rec-card__pick {
    margin: 0 0 0.9rem !important;
    padding: 0 !important;
    border: 0 !important;
}

.ob-blog-post-content .ob-rec-card__angle {
    display: block;
    margin-bottom: 0.7rem;
    color: #1f1717 !important;
    font-size: clamp(1.55rem, 2.8vw, 2.1rem);
    line-height: 0.98;
    font-weight: 950;
    letter-spacing: -0.02em;
}

.ob-blog-post-content .ob-rec-card__choice {
    display: inline;
    color: var(--ob-blog-accent) !important;
    font-size: 0.98rem;
    font-weight: 900;
    line-height: 1.35;
}

.ob-blog-post-content .ob-rec-card__choice::before {
    content: "Recommended: ";
    color: #6f5f5b !important;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__choice::before {
    color: rgba(255, 255, 255, 0.68) !important;
}

.ob-blog-post-content .ob-rec-section[lang="fr"] .ob-rec-card__choice::before {
    content: "Recommandé : ";
}

.ob-blog-post-content .ob-rec-card__choice a {
    color: inherit !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(135, 13, 24, 0.38) !important;
}

.ob-blog-post-content .ob-rec-card--primary .ob-rec-card__choice a {
    border-bottom-color: rgba(255, 255, 255, 0.48) !important;
}

.ob-blog-post-content .ob-rec-card__why {
    margin: 0;
    color: #6f5f5b !important;
    font-size: 0.95rem;
    line-height: 1.5;
}

.ob-blog-post-content .ob-rec-summary {
    margin: 0;
    padding: 2.1rem 1.5rem 2.4rem;
    color: #fff !important;
    background: #151313 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 0 0 8px 8px;
}

.ob-blog-post-content .ob-rec-summary p,
.ob-blog-post-content .ob-rec-summary strong {
    color: #fff !important;
}

@media (max-width: 767.98px) {
    .ob-blog-post-content h2:not(.ob-rec-title):not(.ob-related-hero__title) {
        padding: 2.15rem 0 1rem !important;
        font-size: clamp(1.85rem, 9vw, 2.6rem) !important;
    }

    .ob-blog-post-content h2:not(.ob-rec-title):not(.ob-related-hero__title)::before {
        content: none !important;
    }

    .ob-blog-post-content h2:not(.ob-rec-title):not(.ob-related-hero__title)::after {
        left: 0;
    }

    .ob-blog-post-content .ob-rec-head,
    .ob-blog-post-content .ob-rec-grid {
        grid-template-columns: 1fr;
    }

    .ob-blog-post-content .ob-rec-note {
        max-width: none;
    }

    .ob-blog-post-content .ob-rec-card--primary {
        grid-column: span 1;
    }
}

/* Overrides de especificidad contra el reset heredado del cuerpo del blog. */
.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-card {
    background: #fffaf2 !important;
    border: 1px solid rgba(31, 23, 23, 0.12) !important;
    box-shadow: 0 12px 26px rgba(31, 23, 23, 0.08) !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-card--primary {
    background: linear-gradient(135deg, #740a14 0%, #9f1823 52%, #1f1717 100%) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-card__index {
    background: var(--ob-blog-accent) !important;
    color: #fff !important;
    box-shadow: none !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-card--primary .ob-rec-card__index {
    background: #fff !important;
    color: var(--ob-blog-accent) !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-summary {
    background: #151313 !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-head .ob-rec-note {
    margin: 0.65rem 0 0 !important;
    max-width: 680px !important;
    color: #6f5f5b !important;
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
}

.ob-blog-page .ob-blog-post-body.ob-blog-post-body .ob-blog-post-content .ob-rec-summary,
.ob-blog-page .ob-blog-post-body.ob-blog-post-body .ob-blog-post-content .ob-rec-summary *,
.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-section p::first-letter,
.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-summary p::first-letter {
    color: #fff !important;
}

.ob-blog-page .ob-blog-post-body.ob-blog-post-body .ob-blog-post-content .ob-rec-summary .ob-rec-kicker {
    color: var(--ob-blog-accent) !important;
}

.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-section p::first-letter,
.ob-blog-page .ob-blog-post-body .ob-blog-post-content .ob-rec-summary p::first-letter {
    float: none !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}