/* Portada: rosa, fucsia y violeta del logo; respeta los campos del editor. */
.tienda .t-hero {
    height: 410px;
    max-height: 410px;
    border-radius: 24px;
    margin-bottom: 24px;
    box-shadow: var(--t-shadow-sm);
    overflow: hidden;
    position: relative;
}
.tienda .t-slide {
    height: 410px;
    max-height: 410px;
    min-height: 410px;
    padding: 32px 68px 56px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}
.tienda .t-slide__title {
    font-size: clamp(1.9rem, 3.2vw, 2.75rem);
    line-height: 1.08;
    letter-spacing: -.035em;
    margin: 8px 0 12px;
}
.tienda .t-slide__title [data-hero-title-highlight] { color: #f8c3d9; }
.tienda .t-intro { margin: 0 0 20px; }
.tienda .t-intro h1 { font-size: clamp(1.6rem, 2.5vw, 2.25rem); line-height: 1.2; max-width: none; }
.tienda .t-intro h1 br { display: none; }
.tienda .t-intro h1 em::before { content: ' '; }
.tienda .t-section-kicker { font-size: .875rem; letter-spacing: .06em; color: var(--t-primary-dark); }
.tienda .t-nav__link { font-size: .875rem; }
.tienda .t-hero__pause { position: absolute; z-index: 5; right: 20px; bottom: 15px; min-height: 40px; padding: 6px 14px; border: 1px solid #f8c3d9; border-radius: 999px; background: #1a0629; color: #fff; font: 600 .875rem system-ui, sans-serif; cursor: pointer; }
.tienda :is(a, button, input, select):focus-visible { outline: 3px solid var(--t-primary); outline-offset: 4px; }
.tienda .t-hero :is(a, button):focus-visible { outline-color: #fff; }

/* Los controles permanecen visibles también sin hover, teclado o puntero. */
.tienda .t-hero__arrow {
    opacity: 1;
    background: rgba(255, 255, 255, .96);
}
.tienda .t-hero__dots button::before { background: rgba(255, 255, 255, .78); }
.tienda .t-hero__dots button.is-active::before { background: rgba(255, 255, 255, .96); }

/* Modo oscuro */

body.tienda[data-theme="dark"] .t-intro h1 em { color: #f8c3d9 !important; }
body.tienda[data-theme="dark"] .t-section-kicker { color: var(--t-primary); }

/* Responsive móvil y tablet vertical */
@media (max-width: 760px) {
    .tienda .t-hero { height: 340px; max-height: 340px; }
    .tienda .t-hero__arrow {
        top: auto !important;
        bottom: 14px !important;
        transform: none !important;
        width: 36px !important;
        height: 38px !important;
        z-index: 6 !important;
    }
    .tienda .t-hero__arrow--prev { left: 10px !important; }
    .tienda .t-hero__arrow--next { left: 48px !important; right: auto !important; }
    .tienda .t-hero__pause { right: 10px !important; bottom: 14px !important; min-height: 38px !important; }

    .tienda .t-slide {
        height: 340px;
        max-height: 340px;
        min-height: 340px;
        padding: 16px 16px 65px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        box-sizing: border-box;
    }
    .tienda .t-slide__title {
        font-size: clamp(1.35rem, 5vw, 1.75rem) !important;
        margin: 4px 0 6px !important;
        line-height: 1.12 !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    .tienda *, .tienda *::before, .tienda *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

/* Slides 3 y 4: composiciones editoriales con destinos completos. */
.tienda :is(.t-slide--b, .t-slide--c) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.tienda :is(#catalogo, #novedades, #regalos, #locales) {
    scroll-margin-top: calc(var(--t-header-h, 120px) + 32px);
}

@media (max-width: 760px) {
    .tienda :is(.t-slide--b, .t-slide--c) { padding: 16px 16px 65px; }
    .tienda :is(.t-slide--b, .t-slide--c) .t-slide__title {
        margin: 4px 0 7px !important;
        font-size: clamp(1.75rem, 7vw, 2.35rem) !important;
        line-height: 1.02 !important;
    }
}
/* =====================================================================
   PORTADA SIN REPETICIONES (1.4.130)
   ---------------------------------------------------------------------
   Todo lo de este bloque acompaña la limpieza de la portada: una sola
   franja de promesas, una sola llamada por tarjeta, sin glifos como
   íconos y sin botones duplicados entre el encabezado y la barra
   inferior del celular. Va al final a propósito: estas reglas mandan
   sobre las capas anteriores de tienda.css.
   ===================================================================== */

/* [hidden] tiene que ganarle a los display explícitos de estas clases. */
.tienda :is(.t-nav__link, .t-slide, .t-hiring-guide, .t-carousel__nav)[hidden] { display: none !important; }

/* ---- Encabezado ---- */
/* Con la barra de aviso prendida, el lema decía lo mismo dos veces
   ("Envíos a todo Paraguay" arriba y al lado del logo). */
body.tienda:has(#t-announce:not([hidden])) .t-header__occasion { display: none; }
/* La nota del menú era relleno en la barra de escritorio. */
.tienda .t-nav__note { display: none !important; }
.tienda .t-account__chev,
.tienda .t-dept-toggle__chev { display: inline-flex; align-items: center; transition: transform .18s ease; }
.tienda #t-account-btn[aria-expanded="true"] .t-account__chev,
.tienda .t-dept-toggle[aria-expanded="true"] .t-dept-toggle__chev { transform: rotate(180deg); }

/* En el celular la barra inferior ya tiene Favoritos, Carrito y Menú: el
   encabezado no los repite y le deja lugar al logo y al buscador. */
@media (max-width: 720px) {
    .tienda .t-header__actions #t-wish-btn,
    .tienda .t-header__actions #t-cart-btn,
    .tienda .t-header__bar > #t-burger { display: none !important; }
    /* "Inicio" de la barra inferior ya sube hasta arriba. */
    .tienda #t-to-top { display: none !important; }
}

/* ---- Hero ---- */
.tienda .t-hero__pause {
    width: 40px; height: 40px; min-height: 40px; padding: 0;
    display: inline-grid; place-items: center;
    border-color: rgba(255, 255, 255, .5);
    background: rgba(26, 6, 41, .72);
    backdrop-filter: blur(6px);
}
.tienda .t-hero__pause .t-hero__play-ico,
.tienda .t-hero__pause[aria-pressed="true"] .t-hero__pause-ico { display: none; }
.tienda .t-hero__pause[aria-pressed="true"] .t-hero__play-ico { display: block; }
.tienda .t-hero__arrow { display: inline-grid; place-items: center; color: var(--t-ink); }
/* Con una sola diapositiva no hay nada que pasar ni pausar. */
.tienda .t-hero--unica :is(.t-hero__dots, .t-hero__arrow, .t-hero__pause) { display: none !important; }
@media (max-width: 760px) {
    /* En el teléfono se desliza con el dedo; las flechas tapaban el texto. */
    .tienda .t-hero__arrow { display: none !important; }
    .tienda .t-hero__pause { width: 36px !important; height: 36px !important; min-height: 36px !important; }
    .tienda .t-hero__dots { justify-content: flex-start; left: 16px; bottom: 26px; }
}

/* ---- Titular: pegado a las categorías, que es lo que encabeza ---- */
.tienda .t-intro { margin-top: clamp(26px, 4vw, 44px); }

/* ---- Colecciones: la grilla se adapta a las tarjetas que existen ----
   Si una categoría no está en el catálogo su tarjeta se esconde; con la
   grilla fija de cuatro columnas quedaba un hueco al final. */
@media (min-width: 900px) {
    .tienda .t-collection-grid { grid-template-columns: repeat(var(--colecciones, 4), minmax(0, 1fr)); }
}
@media (max-width: 899px) and (min-width: 301px) {
    .tienda .t-collection-card--ancha { grid-column: 1 / -1; min-height: 120px; }
}

/* ---- Carruseles: en pantallas táctiles se deslizan con el dedo ---- */
.tienda .t-carousel__nav { display: inline-grid; place-items: center; color: var(--t-ink); }
@media (max-width: 720px), (hover: none) {
    .tienda .t-carousel__nav { display: none !important; }
}

/* ---- Tarjeta de producto: un solo botón, más liviano ----
   Con 24 tarjetas en pantalla, 24 bloques fucsia llenos competían con las
   fotos. El botón queda en tono suave y se llena al pasar por encima. */
.tienda .t-card__buy {
    background: color-mix(in srgb, var(--t-primary) 10%, transparent);
    color: var(--t-primary-dark);
    box-shadow: none;
    border: 1px solid color-mix(in srgb, var(--t-primary) 22%, transparent);
}
.tienda .t-card__buy:hover,
.tienda .t-card:hover .t-card__buy {
    background: var(--t-primary);
    color: #fff;
    border-color: var(--t-primary);
    filter: none;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--t-primary) 28%, transparent);
}
.tienda .t-card__buy.is-agregado,
.tienda .t-card__buy.is-agregado:hover {
    background: #127a4b; border-color: #127a4b; color: #fff; box-shadow: none; transform: none;
}
body.tienda[data-theme="dark"] .t-card__buy { color: #ffd1e6; }
body.tienda[data-theme="dark"] .t-card:hover .t-card__buy,
body.tienda[data-theme="dark"] .t-card__buy:hover { color: #fff; }

/* ---- Íconos que antes eran caracteres ---- */
.tienda .t-estrellas { display: inline-flex; gap: 1px; color: #f5a524; vertical-align: -2px; }
.tienda .t-estrella:not(.is-llena) { color: color-mix(in srgb, #f5a524 45%, transparent); }
.tienda .t-resena-pdp__verificada,
.tienda .t-order__dot { display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.tienda .t-pag__flecha { display: inline-grid; place-items: center; }
.tienda :is(.t-modal__close, .t-cart-panel__close, .t-lightbox__close, .t-nav__close, .t-announce__close) {
    display: inline-grid; place-items: center;
}
