/*
 * Portada — La Guinda del Pastel
 * ---------------------------------------------------------------------------
 * Ajustes de diseño de la página de inicio (28/10/2026).
 *
 * Vive aparte de style.css para poder copiarlo tal cual a producción y para
 * que no lo pise ningún editor que tenga style.css abierto.
 *
 * No cambia la identidad del tema (Poiret One, Poppins, rejilla de producto):
 * corrige lo que impide leer y comprar.
 *
 * Original del tema hijo: cuarentena-2026-10-27\tema-hijo\
 * ---------------------------------------------------------------------------
 */

:root {
    --lg-ink: #1b1a18;        /* el negro del logotipo y del pie */
    --lg-cream: #f6efe4;      /* el crema del fondo de la portada */
    --lg-body: #5d5d5d;       /* texto de lectura: 6.6:1 sobre blanco */
    --lg-cherry: #b3122b;     /* la cereza del logotipo */
    --lg-gold: #c9a45c;       /* el dorado de la repostería */
}

/* --------------------------------------------------------------------------
   1. Aviso de tienda ("Nos hemos trasladado…")
   El tema lo pinta como barra fija abajo (position:fixed; z-index:9999) y
   tapaba 76 px de contenido en todas las páginas, con un azul que no existe
   en la paleta. Pasa a ser una franja sobre la cabecera que se desplaza con la
   página (la recoloca notice-bar.js) y habla el idioma visual de la marca.
   Si el JS no carga, sigue abajo pero con el mismo estilo y sin tapar el
   final del documento.
   -------------------------------------------------------------------------- */

body.woocommerce-demo-store .demo_store {
    position: relative !important;
    inset: auto !important;
    z-index: 30;
    margin: 0;
    padding: 11px clamp(20px, 3.2vw, 48px);
    padding-right: clamp(132px, 12vw, 168px);
    background: var(--lg-ink);
    color: var(--lg-cream);
    border-top: 2px solid var(--lg-cherry);
    font-size: 13.5px;
    line-height: 1.55;
    letter-spacing: 0.01em;
}

body.woocommerce-demo-store .demo_store::before {
    color: var(--lg-gold);
    opacity: 0.9;
    font-size: 13px;
    margin-right: 8px;
}

body.woocommerce-demo-store .demo_store a {
    color: #fff;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

body.woocommerce-demo-store .demo_store a.woocommerce-store-notice__dismiss-link {
    position: absolute;
    top: 50%;
    right: clamp(20px, 3.2vw, 48px);
    transform: translateY(-50%);
    display: inline-block;
    margin: 0;
    padding: 3px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    color: var(--lg-cream);
    font-size: 12px;
    line-height: 1.7;
    text-decoration: none;
    transition: background-color 160ms ease;
}

body.woocommerce-demo-store .demo_store a.woocommerce-store-notice__dismiss-link:hover,
body.woocommerce-demo-store .demo_store a.woocommerce-store-notice__dismiss-link:focus-visible {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

body.woocommerce-demo-store .demo_store a.woocommerce-store-notice__dismiss-link::before {
    margin-right: 5px;
    font-size: 11px;
    opacity: 0.8;
}

/* Mientras se decide el consentimiento, el aviso no compite con la ventana
   de cookies: primero una cosa, después la otra. */
body.modal-cacsp-open .demo_store {
    display: none;
}

/* Si notice-bar.js no ha podido mover el aviso, reservamos su altura para que
   no tape el final de la página. */
body.woocommerce-demo-store:not(.lg-notice-moved) {
    padding-bottom: 84px;
}

@media (max-width: 767px) {
    body.woocommerce-demo-store .demo_store {
        padding: 9px 16px;
        font-size: 12.5px;
        line-height: 1.5;
    }

    body.woocommerce-demo-store .demo_store a.woocommerce-store-notice__dismiss-link {
        position: static;
        transform: none;
        display: block;
        width: max-content;
        margin: 8px 0 0 auto;
    }
}

/* --------------------------------------------------------------------------
   2. Texto de lectura de la portada
   14 px de Poppins en columnas de 560 px es pequeño para párrafos largos;
   15 px con más interlínea y un gris más oscuro se lee sin esfuerzo.
   -------------------------------------------------------------------------- */

.home .wpb_text_column p,
.home .wpb_text_column li {
    font-size: 15px;
    line-height: 1.72;
    color: var(--lg-body);
}

.home .wpb_text_column ul {
    margin-bottom: 1.4em;
}

@media (max-width: 767px) {
    .home .wpb_text_column p,
    .home .wpb_text_column li {
        font-size: 15px;
        line-height: 1.68;
    }
}

/* --------------------------------------------------------------------------
   3. Superficies del navegador: selección, foco y enlaces en línea
   Los valores por defecto del navegador no son de nadie; estos sí.
   -------------------------------------------------------------------------- */

::selection {
    background: #f1d6da;
    color: var(--lg-ink);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--lg-cherry);
    outline-offset: 3px;
}

.home .wpb_text_column a:not(.button):not(.btn) {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

/* --------------------------------------------------------------------------
   4. Titular del slider
   Slider Revolution fija el color en línea (#777) sobre el crema del fondo.
   En 41–57 px y con la Poiret One, el titular se leía como una marca de agua.
   Se mantiene la tipografía, el tamaño y la posición; solo sube el contraste.
   -------------------------------------------------------------------------- */

.home sr7-module[data-alias="main-home"] sr7-txt.sr7-layer {
    color: #2c2a26 !important;
}

/* --------------------------------------------------------------------------
   5. Tarjetas de producto
   El título iba a 12 px, casi al mismo peso que el precio; y las tarjetas sin
   reseñas arrancaban 24 px más arriba que sus vecinas (las estrellas ocupan
   justo esos 24 px), así que la fila quedaba desalineada.
   -------------------------------------------------------------------------- */

.home .product_item--info-inner > h3.product_item--title {
    font-size: 13px;
    line-height: 1.6;
    color: var(--lg-ink);
}

.home .product_item--info-inner > h3.product_item--title:first-child {
    margin-top: 24px;
}

.home .product_item .price {
    color: var(--lg-ink);
}

/* La etiqueta NOVEDAD venía con #dd3333 en línea; con el carmesí de la marca
   el texto blanco pasa de 3,9:1 a 7:1 de contraste. */
.home .product_item .la-custom-badge {
    background-color: var(--lg-cherry) !important;
}

/* --------------------------------------------------------------------------
   6. Llamada a la acción de la sección de productos
   Era el único botón verde del sitio (WPBakery "success") y el único con
   esquina de 5 px. Pasa al negro de la marca y a la píldora del CTA del
   slider, para que las dos llamadas a la tienda se lean como la misma acción.
   -------------------------------------------------------------------------- */

.home .la-vc-btn .vc_btn3.vc_btn3-color-success {
    background-color: var(--lg-ink) !important;
    border-color: var(--lg-ink) !important;
    border-radius: 999px !important;
    letter-spacing: 0.04em;
}

.home .la-vc-btn .vc_btn3.vc_btn3-color-success:hover,
.home .la-vc-btn .vc_btn3.vc_btn3-color-success:focus-visible {
    background-color: var(--lg-cherry) !important;
    border-color: var(--lg-cherry) !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   7. Opiniones de clientes
   Tarjeta blanca de borde #e6e6e6 sobre fondo blanco: el límite no se veía y
   la cita, a 14 px y en gris medio, se perdía dentro del marco.
   -------------------------------------------------------------------------- */

.home .la_testimonials .loop__item__inner {
    background: #fdfaf5;
    border-color: rgba(27, 26, 24, 0.12);
}

.home .la_testimonials .loop__item__desc {
    font-size: 15px;
    line-height: 1.72;
    color: var(--lg-body);
}