/* All selectors are scoped: do not alter the cart, PQR or legacy modals. */
dialog.hogar-promo {
    --hp-bg: #f6efe9;
    --hp-text: #301e12;
    border: 0;
    border-radius: 16px;
    padding: 0;
    margin: auto;
    width: min(var(--hp-max-width, 960px), calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow: auto;
    overscroll-behavior: contain;
    background: var(--hp-bg);
    color: var(--hp-text);
    box-shadow: 0 16px 64px #0005;
    font: inherit;
    text-align: center;
}
dialog.hogar-promo:not([open]) { display: none !important; }
dialog.hogar-promo::backdrop { background: rgb(0 0 0 / 55%); }
.hogar-promo, .hogar-promo * { box-sizing: border-box; }
.hogar-promo.hogar-promo--white { --hp-bg: #fff; }
.hogar-promo.hogar-promo--dark { --hp-bg: #301e12; --hp-text: #fff; }
.hogar-promo.hogar-promo--left { text-align: left; }
.hogar-promo__panel { position: relative; isolation: isolate; min-width: 0; }
.hogar-promo .hogar-promo__close {
    position: sticky; top: 0; float: right; margin: 0 0 -44px 0;
    z-index: 3; width: 44px; min-width: 44px; max-width: 44px; height: 44px; min-height: 44px; padding: 0;
    display: grid; place-items: center; border: 0;
    border-radius: 0; background: transparent; color: #301e12;
    box-shadow: none; font: 24px/1 sans-serif; cursor: pointer;
}
.hogar-promo__close span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px #0003; }
.hogar-promo .hogar-promo__close:focus:not(:focus-visible) { outline: none; }
.hogar-promo .hogar-promo__close:focus-visible { outline-offset: -4px; }
/* Automatic opening is not keyboard navigation; retain the actual focus. */
.hogar-promo[data-initial-focus="true"] .hogar-promo__close:focus {
    outline: none;
}
.hogar-promo__surface-link { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.hogar-promo .hogar-promo__surface-link:focus-visible { outline-offset: -4px; }
.hogar-promo__panel--linked .hogar-promo__content { z-index: 2; pointer-events: none; }
.hogar-promo__panel--linked .hogar-promo__content a,
.hogar-promo__panel--linked .hogar-promo__content button { pointer-events: auto; }
.hogar-promo__picture { display: block; width: 100%; }
.hogar-promo .hogar-promo__image { display: block; width: 100%; height: auto; margin: 0; }
.hogar-promo__content { position: relative; padding: 56px 32px 32px; overflow-wrap: anywhere; }
.hogar-promo .hogar-promo__title { margin: 0 0 16px; color: inherit; font-size: clamp(1.35rem, 4vw, 2rem); line-height: 1.2; }
.hogar-promo__body { font-size: 1rem; line-height: 1.6; }
.hogar-promo__body p { margin: 0 0 16px; }
.hogar-promo__body a { color: inherit; text-decoration: underline; }
.hogar-promo__body img { max-width: 100%; height: auto; }
.hogar-promo__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 24px; }
.hogar-promo .hogar-promo__button {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 44px; max-width: 100%; padding: 12px 24px;
    border: 2px solid #634f41; border-radius: 8px;
    background: #634f41; color: #fff; font: inherit; font-weight: 600;
    line-height: 1.4; text-decoration: none; cursor: pointer; white-space: normal;
}
.hogar-promo .hogar-promo__button--secondary { background: #fff; color: #301e12; }
.hogar-promo .hogar-promo__button:hover { filter: brightness(.9); }
.hogar-promo :focus-visible { outline: 3px solid #c45a28; outline-offset: 3px; }
.hogar-promo--background .hogar-promo__picture { position: absolute; inset: 0; height: 100%; z-index: -2; }
.hogar-promo--background .hogar-promo__image { height: 100%; object-fit: cover; }
.hogar-promo--background .hogar-promo__panel { background: #301e12; color: #fff; }
.hogar-promo--background .hogar-promo__content { background: rgb(0 0 0 / 60%); min-height: 280px; }
.hogar-promo__preview { font-size: .8rem; font-weight: 600; }
html.hogar-promo-open { overflow: hidden; }
@media (max-width: 600px) {
    .hogar-promo__content { padding: 56px 20px 24px; }
    .hogar-promo__actions { flex-direction: column; }
    .hogar-promo .hogar-promo__button { width: 100%; }
}
@media (prefers-reduced-motion: no-preference) {
    .hogar-promo[open] { animation: hogar-promo-appear 180ms ease-out; }
    @keyframes hogar-promo-appear { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
}
