/* ============================================================
   AŞK — Header + Footer globales
   Cargado en todo el sitio. Markup vía shortcodes
   [ask_top_header] / [ask_site_footer] (ver inc/header-footer.php).
   Tokens de marca: ver style.css (:root --ask-*).
   Todas las clases namespaced con .ask- para no colisionar
   con Hello Elementor / WooCommerce.
   ============================================================ */

/* ---- Reserva de scroll-margin para anclas bajo el header fijo ---- */
:root { --ask-header-zone: 144px; }

/* ============================================================
   TOP MARQUEE
   ============================================================ */
.ask-top-marquee {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 990;
    background: var(--ask-black);
    color: var(--ask-white);
    overflow: hidden;
    white-space: nowrap;
    font-family: var(--ask-font-sans);
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 9px 0;
}
.ask-top-marquee__track {
    display: inline-block;
    animation: ask-marquee 80s linear infinite;
}
.ask-top-marquee__track span { display: inline-block; padding: 0 28px; }
.ask-top-marquee__track .ask-sep { color: var(--ask-camel); padding: 0 6px; }

@keyframes ask-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .ask-top-marquee__track { animation: none; }
}

/* ============================================================
   HEADER
   Por defecto SÓLIDO (páginas internas). En la home (body.home)
   arranca transparente sobre el hero y se vuelve sólido al
   hacer scroll (.ask-header--scrolled vía JS).
   ============================================================ */
.ask-header {
    position: fixed;
    top: 33px;               /* debajo del top-marquee */
    left: 0; right: 0;
    z-index: 980;
    padding: 14px 32px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    color: var(--ask-black);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--ask-gray-line);
    transition: background 400ms var(--ask-ease-out),
                padding 400ms var(--ask-ease-out),
                top 400ms var(--ask-ease-out),
                color 300ms var(--ask-ease-out);
}

/* --- Nav --- */
.ask-header__nav {
    display: flex;
    gap: 36px;
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 500;
}
.ask-header__nav a {
    color: inherit;
    text-decoration: none;
    position: relative;
    padding-bottom: 3px;
    transition: color 240ms var(--ask-ease-out);
}
.ask-header__nav a::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 0; height: 1px;
    background: currentColor;
    transition: width 280ms var(--ask-ease-out);
}
.ask-header__nav a:hover::after,
.ask-header__nav a.ask-active::after { width: 100%; }
.ask-header__nav a.ask-active { font-weight: 600; }

/* --- Logo --- */
.ask-header__logo {
    height: 78px;
    display: block;
    justify-self: center;
    transition: transform 600ms var(--ask-ease-out), filter 400ms var(--ask-ease-out);
}
/* El logo se agranda 40% visualmente vía scale (no aumenta el alto del
   header: la caja sigue midiendo lo mismo, solo se escala el render). */
.ask-header__logo img { height: 100%; width: auto; display: block; transform: scale(1.82); transform-origin: center center; }
.ask-header__logo:hover { transform: scale(1.05); }

/* --- Acciones (buscar + carrito) --- */
.ask-header__actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 28px;
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 500;
}
.ask-header__actions a {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ask-header__icon {
    width: 17px; height: 17px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.ask-cart-count,
.ask-header__actions .ask-wish-count {
    background: var(--ask-camel);
    color: var(--ask-white);
    font-size: 10px;
    font-weight: 600;
    min-width: 18px;
    text-align: center;
    padding: 2px 7px;
    border-radius: 99px;
    letter-spacing: 0.04em;
    font-feature-settings: "tnum";
    margin-left: 2px;
}
.ask-cart-count--empty,
.ask-header__actions .ask-wish-count--empty { display: none; }

/* --- Botón lateral flotante: seguimiento de pedido --- */
.ask-track-fab {
	position: fixed;
	right: 0;
	/* Subido (antes 42%) para no chocar con el indicador de scroll del home,
	   que va centrado vertical (top:50%). */
	top: 30%;
	transform: translateY(-50%);
	z-index: 88;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	background: var(--ask-black, #000);
	color: var(--ask-white, #fff);
	padding: 12px 16px 12px 14px;
	border-radius: 10px 0 0 10px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 1;
	box-shadow: -3px 4px 18px rgba(0, 0, 0, 0.16);
	transition: background 260ms ease, padding 260ms ease;
}
.ask-track-fab:hover { background: var(--ask-camel, #B89968); padding-right: 22px; }
.ask-track-fab svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 1.6; flex: 0 0 auto; }
.ask-track-fab__label { white-space: nowrap; }

/* Móvil: solo icono, y arriba del botón de WhatsApp para no chocar. */
@media (max-width: 768px) {
	.ask-track-fab {
		top: auto;
		bottom: 150px;
		transform: none;
		padding: 13px;
		border-radius: 50% 0 0 50%;
	}
	.ask-track-fab:hover { padding: 13px; }
	.ask-track-fab__label { display: none; }
}

/* --- Burger (solo móvil) --- */
.ask-header__burger {
    display: none;
    background: none;
    border: 0;
    padding: 6px;
    cursor: pointer;
    color: inherit;
    width: 34px; height: 34px;
    align-items: center;
    justify-content: center;
    justify-self: start;
}
.ask-header__burger span {
    display: block;
    position: relative;
    width: 22px; height: 1.5px;
    background: currentColor;
    transition: transform 300ms var(--ask-ease-out), opacity 200ms var(--ask-ease-out);
}
.ask-header__burger span::before,
.ask-header__burger span::after {
    content: "";
    position: absolute; left: 0;
    width: 22px; height: 1.5px;
    background: currentColor;
    transition: transform 300ms var(--ask-ease-out);
}
.ask-header__burger span::before { top: -7px; }
.ask-header__burger span::after  { top: 7px; }

/* ============================================================
   ESTADO TRANSPARENTE sobre hero oscuro full-bleed.
   Solo se activa en páginas con la clase body.ask-dark-hero
   (la añade el child theme cuando hay un hero oscuro a pantalla
   completa detrás del header — p. ej. la home del Paso 4).
   Sin esa clase el header es SÓLIDO en todas partes (legible).
   ============================================================ */
body.ask-dark-hero .ask-header {
    top: 33px;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom-color: transparent;
    color: var(--ask-white);
}
/* "Scrim": degradado ALTO y suave (240px) que se desvanece sin borde
   visible. Da legibilidad al texto blanco sobre fotos claras del hero
   sin dejar la línea horizontal donde antes cortaba el degradado. */
body.ask-dark-hero .ask-header::before {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 240px;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0.55) 0%,
        rgba(0, 0, 0, 0.28) 30%,
        rgba(0, 0, 0, 0.10) 60%,
        rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    z-index: -1;
    transition: opacity 400ms var(--ask-ease-out);
}
body.ask-dark-hero .ask-header.ask-header--scrolled::before { opacity: 0; }
body.ask-dark-hero .ask-header .ask-header__logo { filter: invert(1) brightness(2); }

/* Al hacer scroll → sólido. Queda DEBAJO del marquee (top:33px) para
   que la franja negra no tape el menú. */
body.ask-dark-hero .ask-header.ask-header--scrolled {
    top: 33px;
    padding: 10px 32px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-color: var(--ask-gray-line);
    color: var(--ask-black);
    box-shadow: 0 2px 24px rgba(0, 0, 0, 0.06);
}
body.ask-dark-hero .ask-header.ask-header--scrolled .ask-header__logo {
    filter: none;
    height: 62px;
}

/* ============================================================
   SPACER: el contenido arranca bajo el header fijo. Solo las
   páginas con hero oscuro full-bleed (ask-dark-hero) prescinden
   del spacer porque el header las superpone.
   ============================================================ */
.ask-header-spacer { height: var(--ask-header-zone); }
body.ask-dark-hero .ask-header-spacer { height: 0; }

/* Anclas internas no quedan ocultas bajo el header */
:target { scroll-margin-top: var(--ask-header-zone); }

/* ============================================================
   MENÚ MÓVIL (overlay)
   ============================================================ */
.ask-mobile-nav {
    position: fixed;
    inset: 0;
    z-index: 985;
    background: var(--ask-black);
    color: var(--ask-white);
    display: flex;
    flex-direction: column;
    /* Alineado desde arriba + scroll si hace falta: con centrado vertical y
       muchos ítems, el primero ("Tienda") se salía por arriba en pantallas
       chicas. padding-top despeja el marquee + header fijos. */
    justify-content: flex-start;
    padding: 96px 32px 40px;
    overflow-y: auto;
    transform: translateY(-100%);
    visibility: hidden;
    transition: transform 520ms var(--ask-ease-out), visibility 0s linear 520ms;
}
.ask-mobile-nav.ask-open {
    transform: translateY(0);
    visibility: visible;
    transition: transform 520ms var(--ask-ease-out), visibility 0s;
}
.ask-mobile-nav a {
    color: var(--ask-white);
    text-decoration: none;
    font-family: var(--ask-font-sans);
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    padding: 12px 0;
    display: block;
}
.ask-mobile-nav a .ask-italic { font-size: 30px; }
.ask-mobile-nav__foot {
    margin-top: auto;
    padding-top: 32px;
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ask-gray);
    display: flex;
    gap: 24px;
}
.ask-mobile-nav__foot a { font-size: 12px; font-weight: 500; }

/* ============================================================
   FOOTER
   ============================================================ */
.ask-footer {
    background: var(--ask-black);
    color: var(--ask-white);
    font-family: var(--ask-font-sans);
    padding: 72px var(--ask-gutter) 0;
}
.ask-footer__inner {
    max-width: var(--ask-maxw);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 48px;
    padding-bottom: 56px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
/* Especificidad x2 para ganar a la regla de Elementor `.elementor img`. */
.ask-footer .ask-footer__brand-logo { height: 52px; width: auto; max-width: none; margin-bottom: 22px; filter: invert(1) brightness(2); }
.ask-footer__blurb {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.62);
    max-width: 340px;
    margin: 0 0 24px;
}
.ask-footer__social { display: flex; gap: 14px; }
.ask-footer__social a {
    width: 40px; height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ask-white);
    transition: background 280ms var(--ask-ease-out), color 280ms var(--ask-ease-out), border-color 280ms var(--ask-ease-out);
}
.ask-footer__social a:hover { background: var(--ask-white); color: var(--ask-black); border-color: var(--ask-white); }
.ask-footer__social svg { width: 18px; height: 18px; }

.ask-footer__col-title {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ask-camel);
    margin: 0 0 22px;
}
.ask-footer__links { list-style: none; margin: 0; padding: 0; }
.ask-footer__links li { margin-bottom: 12px; }
.ask-footer__links a {
    color: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    font-size: 14px;
    transition: color 220ms var(--ask-ease-out);
}
.ask-footer__links a:hover { color: var(--ask-white); }
.ask-footer__contact { list-style: none; margin: 0; padding: 0; }
.ask-footer__contact li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.78);
}
.ask-footer__contact a { color: inherit; text-decoration: none; }
.ask-footer__contact a:hover { color: var(--ask-white); }
.ask-footer__contact svg {
    width: 16px; height: 16px;
    margin-top: 2px;
    stroke: var(--ask-camel);
    fill: none;
    stroke-width: 1.6;
    flex-shrink: 0;
}

/* --- Logos de pago integrados --- */
.ask-footer__pay {
    max-width: var(--ask-maxw);
    margin: 0 auto;
    padding: 28px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.ask-footer__pay-label {
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    font-weight: 500;
}
.ask-footer__pay-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin: 0; padding: 0;
}
.ask-footer__pay-logos li { line-height: 0; }
.ask-footer__pay-logos img {
    height: 26px;
    width: auto;
    display: block;
    background: #fff;
    border-radius: 4px;
    padding: 3px 5px;
    box-sizing: content-box;
}

/* --- Barra inferior --- */
.ask-footer__bottom {
    max-width: var(--ask-maxw);
    margin: 0 auto;
    padding: 22px 0 32px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.45);
}
.ask-footer__bottom a { color: rgba(255, 255, 255, 0.62); text-decoration: none; }
.ask-footer__bottom a:hover { color: var(--ask-white); }
.ask-footer__bottom-links { display: flex; gap: 22px; flex-wrap: wrap; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
    .ask-footer__inner { grid-template-columns: 1fr 1fr; gap: 40px; }
}

@media (max-width: 860px) {
    .ask-header { grid-template-columns: auto auto auto; padding: 12px 18px; }
    body.ask-dark-hero .ask-header.ask-header--scrolled { padding: 8px 18px; }
    .ask-header__nav { display: none; }
    .ask-header__burger { display: inline-flex; }
    .ask-header__actions { gap: 16px; }
    .ask-header__actions a span:not(.ask-cart-count) { display: none; }
    .ask-header__logo { height: 64px; }
    body.ask-dark-hero .ask-header.ask-header--scrolled .ask-header__logo { height: 56px; }
    :root { --ask-header-zone: 124px; }
}

@media (max-width: 600px) {
    .ask-footer { padding-top: 56px; }
    .ask-footer__inner { grid-template-columns: 1fr; gap: 36px; }
    .ask-footer__pay { flex-direction: column; align-items: flex-start; gap: 12px; }
    .ask-footer__bottom { flex-direction: column; align-items: flex-start; }
    .ask-header__logo { height: 56px; }
}

/* ============================================================
   CARRITO LATERAL (drawer) — conectado al mini-cart de WooCommerce
   ============================================================ */
.ask-drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    pointer-events: none;
    transition: opacity 400ms var(--ask-ease-out);
    z-index: 1000;
}
.ask-drawer-overlay.ask-open { opacity: 1; pointer-events: auto; }

.ask-cart-drawer {
    position: fixed;
    top: 0; right: 0;
    height: 100vh;
    height: 100dvh;
    width: 420px;
    max-width: 100%;
    background: var(--ask-white);
    transform: translateX(100%);
    transition: transform 480ms var(--ask-ease-out);
    z-index: 1001;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.12);
}
.ask-cart-drawer.ask-open { transform: translateX(0); }

.ask-cart-drawer__head {
    flex-shrink: 0;
    padding: 22px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--ask-gray-line);
}
.ask-cart-drawer__title {
    font-family: var(--ask-font-sans);
    font-size: 13px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ask-black);
}
.ask-cart-drawer__close {
    background: none; border: 0;
    font-size: 26px; font-weight: 300;
    line-height: 1; cursor: pointer;
    color: var(--ask-black);
    padding: 0 4px;
}

/* Cuerpo = mini-cart de WooCommerce, en columna flex */
.ask-cart-drawer__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 0 28px;
    font-family: var(--ask-font-sans);
}
.ask-cart-drawer__body .ask-mini-cart {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.ask-cart-drawer__body .woocommerce-mini-cart {
    list-style: none;
    margin: 0; padding: 0;
    flex: 1;
    overflow-y: auto;
}
.ask-cart-drawer__body .woocommerce-mini-cart-item {
    position: relative;
    padding: 18px 28px 18px 80px;
    min-height: 92px;
    border-bottom: 1px solid var(--ask-gray-line);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
}
.ask-cart-drawer__body .woocommerce-mini-cart-item img {
    position: absolute;
    left: 0; top: 18px;
    width: 64px; height: 80px;
    object-fit: cover;
    background: var(--ask-off-white);
}
.ask-cart-drawer__body .woocommerce-mini-cart-item a:not(.remove) {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--ask-black);
    text-decoration: none;
    line-height: 1.3;
}
.ask-cart-drawer__body .woocommerce-mini-cart-item .quantity {
    font-size: 12px;
    letter-spacing: 0.04em;
    color: var(--ask-gray);
    font-feature-settings: "tnum";
}
.ask-cart-drawer__body .woocommerce-mini-cart-item .remove_from_cart_button {
    position: absolute;
    right: 0; top: 20px;
    width: 22px; height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    color: var(--ask-gray);
    text-decoration: none;
    border-radius: 50%;
    transition: color 200ms var(--ask-ease-out);
}
.ask-cart-drawer__body .woocommerce-mini-cart-item .remove_from_cart_button:hover { color: var(--ask-black); }

.ask-cart-drawer__body .woocommerce-mini-cart__empty-message {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--ask-gray);
    font-size: 14px;
    padding: 40px 0;
}

/* Barra de envío gratis */
.ask-cart-drawer__progress {
    flex-shrink: 0;
    padding: 16px 0 4px;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ask-gray);
}
.ask-cart-drawer__progress b { color: var(--ask-camel); font-weight: 600; }
.ask-cart-drawer__progress--done { color: var(--ask-black); font-weight: 600; }
.ask-cart-drawer__bar {
    height: 3px;
    background: var(--ask-gray-line);
    margin-top: 8px;
    position: relative;
    overflow: hidden;
}
.ask-cart-drawer__bar span {
    position: absolute;
    left: 0; top: 0; height: 100%;
    background: var(--ask-camel);
    transition: width 400ms var(--ask-ease-out);
}

/* Subtotal + botones */
.ask-cart-drawer__body .woocommerce-mini-cart__total {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0;
    padding: 18px 0 14px;
    border-top: 1px solid var(--ask-gray-line);
    margin-top: 8px;
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ask-black);
}
.ask-cart-drawer__body .woocommerce-mini-cart__total .woocommerce-Price-amount { font-feature-settings: "tnum"; }
.ask-cart-drawer__body .woocommerce-mini-cart__buttons {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 4px 0 26px;
}
.ask-cart-drawer__body .woocommerce-mini-cart__buttons .button {
    display: block;
    text-align: center;
    text-decoration: none;
    font-family: var(--ask-font-sans);
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 16px;
    border: 0;
    transition: background 280ms var(--ask-ease-out), color 280ms var(--ask-ease-out);
}
/* Finalizar compra = botón principal negro (primero) */
.ask-cart-drawer__body .woocommerce-mini-cart__buttons .checkout {
    order: -1;
    background: var(--ask-black);
    color: var(--ask-white);
}
.ask-cart-drawer__body .woocommerce-mini-cart__buttons .checkout:hover { background: var(--ask-camel); }
/* Ver bolsa = secundario (texto) */
.ask-cart-drawer__body .woocommerce-mini-cart__buttons .button:not(.checkout) {
    background: none;
    color: var(--ask-black);
    padding: 4px;
    letter-spacing: 0.16em;
}
.ask-cart-drawer__body .woocommerce-mini-cart__buttons .button:not(.checkout):hover { color: var(--ask-camel); }

/* ============================================================
   Elementor Pro SECUESTRA el mini-cart: en vez del markup estándar de
   WooCommerce genera su propio markup `.elementor-menu-cart__*`, así que
   las reglas de arriba no aplican y los botones salían genéricos.
   Estilizamos las clases de Elementor para respetar la identidad de marca.
   ============================================================ */
.ask-cart-drawer__body .elementor-menu-cart__products {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    overflow-y: auto;
}
.ask-cart-drawer__body .elementor-menu-cart__product {
    position: relative;
    padding: 18px 30px 18px 80px;
    min-height: 92px;
    border-bottom: 1px solid var(--ask-gray-line);
    display: block;
}
.ask-cart-drawer__body .elementor-menu-cart__product-image {
    position: absolute;
    left: 0;
    top: 18px;
    width: 64px;
    height: 80px;
    margin: 0;
}
.ask-cart-drawer__body .elementor-menu-cart__product-image img {
    width: 64px;
    height: 80px;
    object-fit: cover;
    background: var(--ask-off-white);
    display: block;
}
.ask-cart-drawer__body .elementor-menu-cart__product-name a {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--ask-black);
    text-decoration: none;
    line-height: 1.3;
}
.ask-cart-drawer__body .elementor-menu-cart__product-price,
.ask-cart-drawer__body .elementor-menu-cart__product-price .quantity {
    font-size: 12px;
    letter-spacing: 0.04em;
    color: var(--ask-gray);
    font-feature-settings: "tnum";
    margin-top: 4px;
    display: block;
}
.ask-cart-drawer__body .elementor-menu-cart__product-remove {
    position: absolute;
    right: 0;
    top: 18px;
    margin: 0;
}
.ask-cart-drawer__body .elementor-menu-cart__product-remove a {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ask-gray);
    transition: color 200ms var(--ask-ease-out);
}
.ask-cart-drawer__body .elementor-menu-cart__product-remove a:hover { color: var(--ask-black); }

/* Subtotal */
.ask-cart-drawer__body .elementor-menu-cart__subtotal {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 18px 0 14px;
    margin: 8px 0 0;
    border-top: 1px solid var(--ask-gray-line);
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ask-black);
}
.ask-cart-drawer__body .elementor-menu-cart__subtotal strong { font-weight: 600; }
.ask-cart-drawer__body .elementor-menu-cart__subtotal .woocommerce-Price-amount { font-feature-settings: "tnum"; }

/* Botones del footer (Elementor) */
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 0 26px;
}
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons .elementor-button {
    display: block;
    width: 100%;
    text-align: center;
    font-family: var(--ask-font-sans);
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 16px;
    border: 0;
    border-radius: 0;
    transition: background 280ms var(--ask-ease-out), color 280ms var(--ask-ease-out);
}
/* Finalizar compra = botón principal negro (de primero) */
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons .elementor-button--checkout {
    order: -1;
    background: var(--ask-black);
    color: var(--ask-white);
}
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
    background: var(--ask-camel);
    color: var(--ask-white);
}
/* Ver bolsa = secundario, contorno */
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons .elementor-button--view-cart {
    background: transparent;
    color: var(--ask-black);
    border: 1px solid var(--ask-black);
}
.ask-cart-drawer__body .elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover {
    background: var(--ask-black);
    color: var(--ask-white);
}

@media (max-width: 480px) {
    .ask-cart-drawer { width: 100%; }
}

/* ============================================================
   BUSCADOR — overlay con búsqueda instantánea (FiboSearch)
   ============================================================ */
/* Panel que baja desde arriba; la home queda visible detrás con un velo sutil
   (NO un popup blanco que tape todo). */
.ask-search-overlay {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(0, 0, 0, 0);
    opacity: 0;
    visibility: hidden;
    transition: background 380ms var(--ask-ease-out), opacity 380ms var(--ask-ease-out), visibility 0s linear 380ms;
}
.ask-search-overlay.ask-open {
    background: rgba(0, 0, 0, 0.28);
    opacity: 1;
    visibility: visible;
    transition: background 380ms var(--ask-ease-out), opacity 380ms var(--ask-ease-out);
}
.ask-search-overlay__inner {
    position: absolute;
    top: 0; left: 0; right: 0;
    background: var(--ask-white);
    padding: 30px 24px 34px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.14);
    transform: translateY(-100%);
    transition: transform 460ms var(--ask-ease-out);
}
.ask-search-overlay.ask-open .ask-search-overlay__inner { transform: translateY(0); }
.ask-search-overlay__box { max-width: 760px; margin: 0 auto; }
.ask-search-overlay__label {
    display: block;
    font-family: var(--ask-font-serif);
    font-style: italic;
    font-size: clamp(22px, 3vw, 34px);
    color: var(--ask-black);
    margin-bottom: 18px;
    text-align: center;
}
.ask-search-overlay__close {
    position: absolute;
    top: 16px; right: 22px;
    background: none; border: 0;
    font-size: 30px; font-weight: 300; line-height: 1;
    cursor: pointer;
    color: var(--ask-black);
    transition: color 200ms var(--ask-ease-out);
}
.ask-search-overlay__close:hover { color: var(--ask-camel); }
/* FiboSearch a ancho completo dentro del panel */
.ask-search-overlay .dgwt-wcas-search-wrapp,
.ask-search-overlay .dgwt-wcas-search-form { max-width: none !important; width: 100% !important; }

@media (max-width: 600px) {
    .ask-search-overlay__inner { padding: 22px 18px 26px; }
    .ask-search-overlay__close { top: 12px; right: 14px; }
}

/* ============================================================
   COMPRA RÁPIDA (modal quick view)
   ============================================================ */
.ask-qv-modal {
    position: fixed; inset: 0; z-index: 1200;
    display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden;
    transition: opacity 360ms var(--ask-ease-out), visibility 0s linear 360ms;
}
.ask-qv-modal.ask-open { opacity: 1; visibility: visible; transition: opacity 360ms var(--ask-ease-out); }
.ask-qv-modal__overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.5); }
.ask-qv-modal__panel {
    position: relative; z-index: 2;
    background: var(--ask-white);
    width: min(880px, 94vw); max-height: 90vh;
    display: flex; overflow: hidden;
    transform: translateY(16px) scale(0.98);
    transition: transform 420ms var(--ask-ease-out);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
}
.ask-qv-modal.ask-open .ask-qv-modal__panel { transform: translateY(0) scale(1); }
.ask-qv-modal__close {
    position: absolute; top: 12px; right: 16px; z-index: 5;
    background: none; border: 0; font-size: 28px; line-height: 1; cursor: pointer;
    color: var(--ask-black); transition: color 200ms var(--ask-ease-out);
}
.ask-qv-modal__close:hover { color: var(--ask-camel); }
.ask-qv-modal__content { width: 100%; overflow-y: auto; max-height: 90vh; }
.ask-qv-loading { padding: 90px 24px; text-align: center; color: var(--ask-gray); font-size: 14px; font-family: var(--ask-font-sans); }

.ask-qv { display: grid; grid-template-columns: 1fr 1fr; font-family: var(--ask-font-sans); }
.ask-qv__media { display: block; background-size: cover; background-position: center; background-color: var(--ask-off-white); min-height: 440px; }
.ask-qv__info { padding: 48px 44px; display: flex; flex-direction: column; }
.ask-qv__title { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; text-transform: uppercase; letter-spacing: -0.01em; margin: 0 0 12px; color: var(--ask-black); }
.ask-qv__price { font-size: 18px; color: var(--ask-black); margin-bottom: 22px; font-feature-settings: "tnum"; }
.ask-qv__price del { color: var(--ask-gray); font-weight: 400; margin-right: 6px; }
.ask-qv__price ins { color: var(--ask-camel); font-weight: 600; text-decoration: none; }
.ask-qv__form { margin-bottom: 16px; }
.ask-qv__sizehint { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.14em; text-align: center; color: var(--ask-black); margin-bottom: 14px; }
/* Selector de talla centrado tipo botones; oculta el label "Talla:" de WC */
.ask-qv table.variations,
.ask-qv table.variations tbody,
.ask-qv table.variations tr { display: block; width: 100%; }
.ask-qv table.variations td,
.ask-qv table.variations th { display: block; width: 100%; text-align: center; padding: 0; }
.ask-qv table.variations th.label { display: none; }
.ask-qv .variable-items-wrapper { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; padding: 0; margin: 0 0 8px; list-style: none; }
.ask-qv li.variable-item {
    min-width: 46px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--ask-gray-line); background: #fff;
    font-size: 13px; font-weight: 600; cursor: pointer; border-radius: 0;
    box-shadow: none; padding: 0 10px; margin: 0;
    transition: border-color 200ms var(--ask-ease-out), background 200ms var(--ask-ease-out), color 200ms var(--ask-ease-out);
}
.ask-qv li.variable-item:hover { border-color: var(--ask-black); }
.ask-qv li.variable-item.selected { background: var(--ask-black); color: #fff; border-color: var(--ask-black); }
.ask-qv__full { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ask-gray); text-decoration: none; margin-top: auto; transition: color 200ms var(--ask-ease-out); }
.ask-qv__full:hover { color: var(--ask-camel); }
.ask-qv-msg { background: #f7ece8; color: #8a3b2b; font-size: 13px; padding: 10px 12px; margin-bottom: 14px; }

/* Form de variaciones / añadir dentro del modal */
.ask-qv table.variations { width: 100%; margin: 0 0 14px; border-collapse: collapse; }
.ask-qv table.variations td, .ask-qv table.variations th { padding: 6px 0; text-align: left; vertical-align: middle; border: 0; }
.ask-qv table.variations th { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ask-gray); width: 88px; font-weight: 600; }
.ask-qv table.variations select { width: 100%; padding: 11px; border: 1px solid var(--ask-gray-line); background: var(--ask-white); font-size: 14px; }
.ask-qv .reset_variations { display: inline-block; font-size: 11px; letter-spacing: 0.1em; color: var(--ask-gray); margin: 4px 0 10px; }
.ask-qv .woocommerce-variation-price { margin-bottom: 12px; font-size: 18px; font-weight: 600; }
.ask-qv .quantity { margin-bottom: 14px; display: inline-flex; }
.ask-qv .quantity input.qty { width: 64px; padding: 12px 8px; border: 1px solid var(--ask-gray-line); text-align: center; }
.ask-qv .single_add_to_cart_button {
    background: var(--ask-black) !important; color: var(--ask-white) !important;
    border: 0 !important; border-radius: 0 !important; width: 100%;
    font-family: var(--ask-font-sans) !important; font-size: 12px !important; letter-spacing: 0.2em !important;
    text-transform: uppercase !important; font-weight: 600 !important; padding: 16px !important; cursor: pointer;
    transition: background 260ms var(--ask-ease-out) !important;
}
.ask-qv .single_add_to_cart_button:hover { background: var(--ask-camel) !important; }
.ask-qv .single_add_to_cart_button.loading { opacity: 0.7; }

@media (max-width: 760px) {
    .ask-qv { grid-template-columns: 1fr; }
    .ask-qv__media { min-height: 240px; }
    .ask-qv__info { padding: 26px 22px 30px; }
    .ask-qv-modal__panel { width: 96vw; max-height: 92vh; }
    .ask-qv-modal__content { max-height: 92vh; }
}

/* ============================================================
   CAMBIO DE FOTO AL PASAR EL CURSOR — tarjetas WooCommerce (toda la web)
   ============================================================ */
.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link { position: relative; display: block; }
.ask-secondary-image {
    position: absolute !important;
    top: 0; left: 0;
    width: 100%; height: auto;
    margin: 0 !important;
    opacity: 0;
    z-index: 2;
    pointer-events: none;
    transition: opacity 450ms var(--ask-ease-out);
}
.woocommerce ul.products li.product:hover .ask-secondary-image { opacity: 1; }

/* Solo en móviles/tablets REALES (puntero grueso, sin mouse) el cambio de foto
   es automático. En desktop/laptops táctiles con mouse manda el hover. */
@media (hover: none) and (pointer: coarse) {
    .ask-secondary-image,
    .ask-prod__back { animation: askAutoSwap 8s ease-in-out infinite; }
    .woocommerce ul.products li.product:nth-child(2n) .ask-secondary-image,
    .ask-prod:nth-child(2n) .ask-prod__back { animation-delay: 2.6s; }
    .woocommerce ul.products li.product:nth-child(3n) .ask-secondary-image,
    .ask-prod:nth-child(3n) .ask-prod__back { animation-delay: 4.2s; }
}
@keyframes askAutoSwap {
    0%, 42% { opacity: 0; }
    55%, 85% { opacity: 1; }
    100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .ask-secondary-image, .ask-prod__back { animation: none; }
}