/* =========================================================
   PEPPINO CENTURY — TEMA HIJO ASTRA
   Look dark, gastro italian bar
   ========================================================= */

:root {
    --pep-bg:           #0e0e0e;
    --pep-surface:      #1a1a1a;
    --pep-surface-2:    #232323;
    --pep-border:       #2a2a2a;
    --pep-border-soft:  #353535;
    --pep-text:         #faf3e0;
    --pep-text-soft:    #b8b3a8;
    --pep-text-muted:   #7a746a;
    --pep-red:          #d71920;
    --pep-red-dark:     #a8121a;
    --pep-green:        #1ea455;
    --pep-green-dark:   #15803d;
    --pep-gold:         #f5c518;
    --pep-gold-soft:    #e8c98a;

    --pep-radius:       14px;
    --pep-radius-sm:    10px;
    --pep-radius-lg:    20px;

    --pep-shadow:       0 8px 24px rgba(0,0,0,.4);
    --pep-shadow-soft:  0 4px 14px rgba(0,0,0,.25);

    --pep-serif:        'Playfair Display', Georgia, serif;
    --pep-sans:         'Inter', system-ui, -apple-system, sans-serif;
}

/* ---------- BASE GLOBAL DARK ---------- */
body.peppino-dark {
    background: var(--pep-bg);
    color: var(--pep-text);
    font-family: var(--pep-sans);
    font-feature-settings: "ss01" on, "cv11" on;
}

body.peppino-dark h1,
body.peppino-dark h2,
body.peppino-dark h3,
body.peppino-dark h4 {
    font-family: var(--pep-serif);
    color: var(--pep-text);
    letter-spacing: -0.01em;
}

body.peppino-dark a {
    color: var(--pep-gold-soft);
}

body.peppino-dark a:hover {
    color: var(--pep-gold);
}

body.peppino-dark p {
    color: var(--pep-text-soft);
}

/* ---------- MENÚ MÓVIL (off-canvas Astra) — fondo negro + texto crema ---------- */
body.peppino-dark .ast-mobile-popup-drawer,
body.peppino-dark .ast-mobile-popup-content,
body.peppino-dark .ast-mobile-popup-inner,
body.peppino-dark .mobile-menu-wrap,
body.peppino-dark .ast-mobile-header-wrap,
body.peppino-dark .main-header-menu.submenu-with-border,
body.peppino-dark .menu-toggle-target,
body.peppino-dark .ast-builder-menu-mobile,
body.peppino-dark .ast-builder-menu-mobile-inner,
body.peppino-dark .main-navigation,
body.peppino-dark #ast-mobile-popup,
body.peppino-dark #ast-mobile-header,
body.peppino-dark .ast-mobile-header-content,
body.peppino-dark .ast-builder-menu-mobile .main-header-menu,
body.peppino-dark .menu-below-header-nav,
body.peppino-dark .menu-above-header-nav,
body.peppino-dark .ast-builder-layout-element[data-section*="menu"],
body.peppino-dark .menu-overlay-active .main-header-menu {
    background: #000 !important;
    background-color: #000 !important;
    color: var(--pep-text) !important;
}

/* Forzar TODO link/li dentro del drawer móvil a texto crema */
body.peppino-dark .ast-mobile-popup-drawer *,
body.peppino-dark .menu-toggle-target *,
body.peppino-dark .ast-builder-menu-mobile *,
body.peppino-dark .ast-builder-menu-mobile-inner *,
body.peppino-dark .main-navigation a,
body.peppino-dark .main-navigation li,
body.peppino-dark .ast-builder-menu-mobile a,
body.peppino-dark .ast-builder-menu-mobile li,
body.peppino-dark .ast-builder-menu-mobile li a,
body.peppino-dark .ast-mobile-popup-content a,
body.peppino-dark .ast-mobile-popup-content li {
    color: var(--pep-text) !important;
    background: transparent !important;
}

/* Headings/títulos secundarios dentro del menú móvil */
body.peppino-dark .ast-builder-menu-mobile h1,
body.peppino-dark .ast-builder-menu-mobile h2,
body.peppino-dark .ast-builder-menu-mobile h3,
body.peppino-dark .ast-mobile-popup-content h1,
body.peppino-dark .ast-mobile-popup-content h2 {
    color: var(--pep-text) !important;
}

body.peppino-dark .ast-mobile-popup-drawer .menu-item,
body.peppino-dark .ast-mobile-popup-drawer .menu-item > a,
body.peppino-dark .ast-mobile-popup-drawer ul li a,
body.peppino-dark .ast-mobile-popup-drawer .ast-mobile-menu-buttons a,
body.peppino-dark .main-header-menu .menu-item > a,
body.peppino-dark .ast-mobile-popup-content a {
    color: var(--pep-text) !important;
    font-weight: 600 !important;
    font-size: 18px !important;
    padding: 14px 20px !important;
    border-bottom: 1px solid #1a1a1a !important;
    background: transparent !important;
}

body.peppino-dark .ast-mobile-popup-drawer .menu-item > a:hover,
body.peppino-dark .ast-mobile-popup-drawer .menu-item.current-menu-item > a {
    color: var(--pep-red) !important;
    background: rgba(215,25,32,.08) !important;
}

/* Botón de cierre (X) del drawer */
body.peppino-dark .menu-toggle-close,
body.peppino-dark .ast-mobile-popup-close,
body.peppino-dark .menu-toggle-close .ast-menu-close,
body.peppino-dark button.menu-toggle-close {
    color: var(--pep-text) !important;
    background: transparent !important;
}

/* Burger icon */
body.peppino-dark .ast-mobile-menu-buttons-fill,
body.peppino-dark .ast-mobile-menu-buttons button {
    color: var(--pep-text) !important;
    background: transparent !important;
    border-color: var(--pep-border) !important;
}

/* Header del drawer (donde aparece el logo) */
body.peppino-dark .ast-mobile-header-wrap {
    background: #000 !important;
    border-bottom: 1px solid var(--pep-border) !important;
}

/* ---------- HEADER / SITE BRAND ---------- */
body.peppino-dark .ast-primary-header-bar,
body.peppino-dark .main-header-bar,
body.peppino-dark .ast-above-header,
body.peppino-dark .ast-below-header {
    background: #000 !important;
    border-bottom: 1px solid var(--pep-border);
}

/* Si hay logo, escondemos el site title de Astra */
body.peppino-dark .ast-site-identity .site-title,
body.peppino-dark .site-branding .site-title,
body.peppino-dark .ast-site-title-wrap .site-title {
    display: none !important;
}

body.peppino-dark .ast-primary-header .custom-logo-link img,
body.peppino-dark .site-branding img {
    max-height: 64px;
    width: auto;
    filter: brightness(1) contrast(1.05);
    background: #fff;        /* el logo viene con fondo blanco */
    padding: 6px 14px;
    border-radius: 8px;
}

body.peppino-dark .main-header-menu a,
body.peppino-dark .ast-builder-menu .menu-item > a {
    color: var(--pep-text) !important;
    font-weight: 600;
    letter-spacing: 0.02em;
}

body.peppino-dark .main-header-menu a:hover {
    color: var(--pep-red) !important;
}

/* Icono carrito header */
body.peppino-dark .ast-cart-menu-wrap,
body.peppino-dark .ast-site-header-cart i {
    color: var(--pep-text) !important;
}

body.peppino-dark .ast-cart-menu-wrap:hover {
    color: var(--pep-red) !important;
}

/* ---------- BANDA TRICOLOR DECORATIVA ---------- */
body.peppino-dark .main-header-bar::after {
    content: "";
    display: block;
    height: 3px;
    background: linear-gradient(90deg,
        var(--pep-green) 0 33.33%,
        #fff 33.33% 66.66%,
        var(--pep-red) 66.66% 100%);
}

/* ---------- CONTENIDO PRINCIPAL ---------- */
body.peppino-dark .site-content,
body.peppino-dark #content {
    background: var(--pep-bg);
    padding-top: 32px;
    padding-bottom: 64px;
}

body.peppino-dark .entry-content,
body.peppino-dark .ast-container {
    color: var(--pep-text);
}

/* ---------- WIDTH GLOBAL — forzar contenedores a centro real ---------- */
body.peppino-dark .ast-container,
body.peppino-dark .ast-container-fluid,
body.peppino-dark .site-content > .ast-container,
body.peppino-dark .site-footer .ast-container,
body.peppino-dark .ast-footer-overlay .ast-container,
body.peppino-dark .ast-small-footer .ast-container {
    max-width: min(1280px, 92%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center;
}

/* Footer: copyright centrado horizontalmente */
body.peppino-dark .ast-small-footer,
body.peppino-dark .ast-builder-html-element,
body.peppino-dark .site-footer .ast-builder-grid-row {
    text-align: center !important;
    justify-content: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
body.peppino-dark .site-footer p { margin: 0 auto !important; }

/* ---------- FOOTER (dark integral) ---------- */
body.peppino-dark .site-footer,
body.peppino-dark .footer-adv,
body.peppino-dark .footer-sml,
body.peppino-dark .ast-small-footer,
body.peppino-dark .ast-footer-overlay,
body.peppino-dark .site-below-footer-wrap,
body.peppino-dark .site-primary-footer-wrap,
body.peppino-dark .ast-builder-footer-grid-row-1,
body.peppino-dark .ast-builder-footer-grid-row-2,
body.peppino-dark .ast-builder-footer-grid-row-3,
body.peppino-dark [data-section="section-footer-builder"],
body.peppino-dark .ast-below-footer-wrap,
body.peppino-dark footer.site-footer,
body.peppino-dark footer[id*="footer"],
body.peppino-dark footer[class*="footer"] {
    background: #000 !important;
    background-color: #000 !important;
    color: var(--pep-text-soft) !important;
    border-color: var(--pep-border) !important;
}

body.peppino-dark .site-footer a,
body.peppino-dark .ast-small-footer a,
body.peppino-dark .site-below-footer-wrap a {
    color: var(--pep-gold-soft) !important;
}

/* Wrapper exterior por si Astra mete un div con fondo blanco */
body.peppino-dark #page,
body.peppino-dark .hfeed.site,
body.peppino-dark .site-content + * {
    background: var(--pep-bg) !important;
}

/* Espacio entre contenido y footer también oscuro */
body.peppino-dark .site-content {
    background: var(--pep-bg) !important;
}

/* Banda separadora tricolor antes del footer (toque Peppino) */
body.peppino-dark footer.site-footer::before {
    content: "";
    display: block;
    height: 3px;
    background: linear-gradient(90deg,
        var(--pep-green) 0 33.33%,
        #fff 33.33% 66.66%,
        var(--pep-red) 66.66% 100%);
}

/* =========================================================
   WOOCOMMERCE — LISTADO DE PRODUCTOS (CARTA)
   ========================================================= */
body.peppino-dark ul.products li.product,
body.peppino-dark .woocommerce ul.products li.product {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
    padding: 16px !important;
    box-shadow: var(--pep-shadow-soft);
    transition: transform .18s ease, border-color .18s ease;
}

body.peppino-dark.woocommerce ul.products li.product:hover {
    transform: translateY(-3px);
    border-color: var(--pep-red);
}

body.peppino-dark.woocommerce ul.products li.product img {
    border-radius: var(--pep-radius-sm);
}

body.peppino-dark.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--pep-serif) !important;
    color: var(--pep-text) !important;
    font-size: 22px !important;
    font-weight: 700;
    margin-top: 14px;
}

body.peppino-dark.woocommerce ul.products li.product .price {
    color: var(--pep-gold) !important;
    font-weight: 800 !important;
    font-size: 20px !important;
    font-family: var(--pep-sans);
}

body.peppino-dark.woocommerce ul.products li.product .button {
    background: var(--pep-red) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 12px 18px !important;
}

body.peppino-dark.woocommerce ul.products li.product .button:hover {
    background: var(--pep-red-dark) !important;
}

/* =========================================================
   FICHA DE PRODUCTO (TIPO "4 QUESOS")
   ========================================================= */
body.peppino-product-page .site-content {
    background: var(--pep-bg);
}

/* Layout: imagen izquierda, summary derecha, ambos como cards */
/* Anular floats de Astra/WooCommerce que descentran el contenido */
body.peppino-product-page div.product .woocommerce-product-gallery,
body.peppino-product-page div.product .summary,
body.peppino-product-page .woocommerce div.product .woocommerce-product-gallery,
body.peppino-product-page .woocommerce div.product .summary {
    float: none !important;
    width: auto !important;
    clear: none !important;
}

body.peppino-product-page div.product,
body.peppino-product-page .woocommerce div.product,
body.peppino-product-page .type-product {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 32px !important;
    align-items: start !important;
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    width: 100% !important;
}

/* Solo bajamos a 1 columna en móvil real (≤ 720px), no en tablet/PC con DevTools */
@media (max-width: 720px) {
    body.peppino-product-page div.product,
    body.peppino-product-page .woocommerce div.product,
    body.peppino-product-page .type-product {
        grid-template-columns: 1fr !important;
        max-width: 600px !important;
        gap: 20px !important;
    }
}

/* Contenedor exterior de Astra: pleno ancho, sin sidebar, centrado */
body.peppino-product-page .ast-container,
body.peppino-product-page .ast-woocommerce-container,
body.peppino-product-page #primary,
body.peppino-product-page #content,
body.peppino-product-page main#main,
body.peppino-product-page .content-area,
body.peppino-product-page .ast-no-sidebar #primary {
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
    width: 100% !important;
    flex: 1 1 auto !important;
}

/* Si Astra deja hueco para sidebar, lo eliminamos */
body.peppino-product-page #secondary,
body.peppino-product-page .widget-area,
body.peppino-product-page .sidebar-main {
    display: none !important;
    width: 0 !important;
}

/* Forzar el wrap interno a 100% en caso de layout con sidebar fantasma */
body.peppino-product-page .ast-row,
body.peppino-product-page .ast-container > .ast-row {
    display: block !important;
}
body.peppino-product-page .ast-row > [class*="ast-col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
}

/* === BESTIA: cualquier wrapper article/article.post/ast-* a 100% centrado === */
body.peppino-product-page article,
body.peppino-product-page article.post,
body.peppino-product-page article.product,
body.peppino-product-page .ast-article-single,
body.peppino-product-page .post-thumb-img-content,
body.peppino-product-page .entry-content,
body.peppino-product-page .ast-no-thumbnail,
body.peppino-product-page .content-wrap,
body.peppino-product-page .ast-page-builder-template .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    float: none !important;
    display: block !important;
}

body.peppino-product-page .woocommerce-product-gallery {
    width: 100% !important;
    background: var(--pep-surface);  /* dark, las fotos son PNG transparente */
    border-radius: var(--pep-radius-lg);
    padding: 8px;  /* menos padding para que la pizza ocupe más */
    box-shadow: var(--pep-shadow);
    border: 1px solid var(--pep-border);
    position: relative;
    overflow: hidden;
}

body.peppino-product-page .woocommerce-product-gallery img {
    border-radius: var(--pep-radius);
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    display: block;
    /* Sin transformaciones, sin hover, sin zoom — el PNG transparente se ve limpio */
    transform: none !important;
}

body.peppino-product-page .woocommerce-product-gallery img:hover {
    transform: none !important;
    filter: none !important;
}

/* Wrapper del slide ocupa todo el ancho */
body.peppino-product-page .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
body.peppino-product-page .woocommerce-product-gallery figure {
    width: 100% !important;
    margin: 0 !important;
}

body.peppino-product-page .woocommerce-product-gallery .woocommerce-product-gallery__image {
    width: 100% !important;
    overflow: hidden;
    border-radius: var(--pep-radius);
}

/* Quitamos completamente el icono de lupa (zoom) — ya no hay funcionalidad */
body.peppino-product-page .woocommerce-product-gallery__trigger {
    display: none !important;
}

/* Eliminar cualquier flex-zoom o transition de WC */
body.peppino-product-page .flex-control-thumbs,
body.peppino-product-page .woocommerce-product-gallery--with-images .flex-control-thumbs {
    display: none !important;
}
body.peppino-product-page .woocommerce-product-gallery__image a {
    cursor: default !important;
    pointer-events: none !important;
}
body.peppino-product-page .woocommerce-product-gallery__image a img {
    pointer-events: auto !important;
}

/* === Topbar custom de la ficha de pizza (sustituye breadcrumb) === */
body.peppino-product-page .peppino-product-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 0 24px;
    border-bottom: 1px solid var(--pep-border);
    margin: 0 auto 28px;
    max-width: 1100px;  /* mismo ancho que .product para alineación visual */
}
body.peppino-product-page .peppino-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--pep-text-soft) !important;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.01em;
    transition: color .15s, transform .15s;
}
body.peppino-product-page .peppino-back-link:hover {
    color: var(--pep-gold) !important;
    transform: translateX(-3px);
}
body.peppino-product-page .peppino-product-cat-tag {
    display: inline-flex;
    align-items: center;
    background: rgba(245,197,24,.1);
    color: var(--pep-gold);
    border: 1px solid rgba(245,197,24,.25);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* === Ocultar restos de breadcrumb / meta / relacionados (defensa en profundidad) === */
body.peppino-product-page .woocommerce-breadcrumb,
body.peppino-product-page nav.woocommerce-breadcrumb,
body.peppino-product-page .product_meta,
body.peppino-product-page .woocommerce-tabs,
body.peppino-product-page .related,
body.peppino-product-page .related.products,
body.peppino-product-page section.related,
body.peppino-product-page .upsells,
body.peppino-product-page .upsells.products,
body.peppino-product-page .cross-sells,
body.peppino-product-page .ast-woocommerce-related-products,
body.peppino-product-page .ast-woocommerce-upsell-products,
body.peppino-product-page .ast-related-products-wrap,
body.peppino-product-page h2.related-products-title,
body.peppino-product-page .woocommerce-product-rating,
body.peppino-product-page .ast-breadcrumbs-wrapper,
body.peppino-product-page .ast-archive-description,
body.peppino-product-page .ast-single-related-posts-container,
body.peppino-product-page .entry-header {
    display: none !important;
}

/* === Layout principal — más estrecho y centrado === */
body.peppino-product-page #primary,
body.peppino-product-page .ast-container,
body.peppino-product-page main.site-main {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

body.peppino-product-page .summary.entry-summary {
    width: 100% !important;
    background: var(--pep-surface);
    border-radius: var(--pep-radius-lg);
    padding: 28px;
    border: 1px solid var(--pep-border);
    box-shadow: var(--pep-shadow);
}

body.peppino-product-page .product_title {
    font-family: var(--pep-serif);
    font-size: 42px;
    font-weight: 800;
    color: var(--pep-text);
    margin: 0 0 12px;
    line-height: 1.05;
}

body.peppino-product-page .summary .price,
body.peppino-product-page .summary .woocommerce-Price-amount {
    color: var(--pep-gold) !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    font-family: var(--pep-sans) !important;
}

body.peppino-product-page .woocommerce-product-details__short-description {
    color: var(--pep-text-soft);
    font-size: 16px;
    line-height: 1.6;
    margin: 14px 0 22px;
    font-style: normal;
    font-family: var(--pep-sans);
    font-weight: 400;
    letter-spacing: 0.01em;
}

/* Cantidad + total + botón */
body.peppino-product-page form.cart {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

body.peppino-product-page form.cart .quantity {
    background: var(--pep-surface-2);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius-sm);
    padding: 4px;
}

body.peppino-product-page form.cart .quantity input.qty {
    background: transparent;
    border: 0;
    color: var(--pep-text);
    font-weight: 700;
    width: 56px;
    text-align: center;
    font-size: 18px;
}

body.peppino-product-page form.cart .single_add_to_cart_button {
    background: var(--pep-red) !important;
    color: #fff !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border: 0 !important;
    border-radius: var(--pep-radius-sm) !important;
    padding: 16px 28px !important;
    font-size: 16px !important;
    flex: 1;
    min-width: 200px;
    box-shadow: 0 6px 18px rgba(215,25,32,.35);
    transition: background .18s, transform .12s;
}

body.peppino-product-page form.cart .single_add_to_cart_button:hover {
    background: var(--pep-red-dark) !important;
    transform: translateY(-1px);
}

/* Total destacado (lo inserta functions.php) */
.peppino-total-box {
    width: 100%;
    background: #000;
    color: var(--pep-gold);
    border-radius: var(--pep-radius-sm);
    padding: 14px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 14px 0 4px;
    border: 1px solid var(--pep-border-soft);
}

.peppino-total-box .peppino-total-label {
    color: var(--pep-text);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 14px;
}

.peppino-total-box .peppino-total-amount,
.peppino-total-box .peppino-total-amount .woocommerce-Price-amount {
    color: var(--pep-gold) !important;
    font-size: 26px;
    font-weight: 800;
}

/* =========================================================
   PEPPINO EXTRAS UI — bloque completo en ficha de producto
   ========================================================= */
.peppino-extras-ui {
    margin: 18px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.peppino-extras-ui .peppino-block-head {
    margin-bottom: 14px;
}
.peppino-extras-ui .peppino-block-head h4 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 4px;
    font-family: var(--pep-sans);
    font-size: 17px;
    font-weight: 800;
    color: var(--pep-text);
    text-transform: none;
    letter-spacing: 0;
}
.peppino-extras-ui .peppino-base-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
@media (max-width: 540px) {
    .peppino-extras-ui .peppino-base-grid { grid-template-columns: 1fr; }
}

/* Total grande estilo "4 Quesos" */
.peppino-pizza-total {
    background: #000;
    border-radius: var(--pep-radius);
    padding: 18px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
    border: 1px solid var(--pep-border-soft);
}
.peppino-pizza-total-label {
    color: var(--pep-text);
    font-weight: 800;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.peppino-pizza-total-amount {
    color: var(--pep-gold);
    font-size: 28px;
    font-weight: 800;
    font-family: var(--pep-sans);
}

/* Estilos para checkbox "extras" diferenciado del base */
.peppino-option-extra {
    justify-content: space-between;
}
.peppino-option-extra .peppino-option-label {
    margin-right: auto;
}

/* =========================================================
   PPOM / EXTRAS (ingredientes, acordeones)
   El plugin PPOM o similar suele inyectar .ppom-fields, .ppom-wrapper.
   Le damos un look acorde aunque no usemos ese plugin concreto.
   ========================================================= */
.ppom-wrapper,
.peppino-extras-block {
    background: var(--pep-surface-2);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius);
    padding: 18px;
    margin: 18px 0;
}

.ppom-wrapper .ppom-field-label,
.peppino-extras-block h4 {
    color: var(--pep-text);
    font-family: var(--pep-sans);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.peppino-extras-block .peppino-badge-free {
    background: rgba(30,164,85,.18);
    color: var(--pep-green);
    font-size: 12px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    letter-spacing: 0.02em;
}

.peppino-extras-block .peppino-extras-hint {
    color: var(--pep-text-muted);
    font-size: 13px;
    margin: -4px 0 12px;
}

/* Checkboxes / radios estilo Peppino */
.peppino-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: var(--pep-surface);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius-sm);
    cursor: pointer;
    transition: border-color .15s, background .15s;
}

.peppino-option:hover {
    border-color: var(--pep-red);
    background: var(--pep-surface-2);
}

.peppino-option input[type="checkbox"],
.peppino-option input[type="radio"] {
    appearance: none;
    width: 22px;
    height: 22px;
    border: 2px solid var(--pep-border-soft);
    border-radius: 6px;
    background: var(--pep-bg);
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;
}

.peppino-option input[type="radio"] {
    border-radius: 50%;
}

.peppino-option input[type="checkbox"]:checked,
.peppino-option input[type="radio"]:checked {
    background: var(--pep-red);
    border-color: var(--pep-red);
}

.peppino-option input[type="checkbox"]:checked::after {
    content: "✓";
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}

.peppino-option input[type="radio"]:checked::after {
    content: "";
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
}

.peppino-option-label {
    flex: 1;
    color: var(--pep-text);
    font-size: 14px;
    font-weight: 500;
    font-family: var(--pep-sans);
    line-height: 1.3;
    margin: 0;
}

.peppino-price-chip {
    background: rgba(215,25,32,.18);
    color: #ff8088;
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Reset font hereditario de Astra para todos los elementos del bloque extras */
.peppino-extras-ui,
.peppino-extras-ui * {
    font-family: var(--pep-sans);
}
.peppino-extras-ui label,
.peppino-extras-ui span {
    font-size: inherit;
    line-height: inherit;
}

/* Compacta un poco las opciones */
.peppino-option {
    padding: 10px 12px;
    min-height: 44px;
}

/* Acordeón de categorías de extras */
.peppino-accordion {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

/* Iconos SVG de cada categoría — color dorado, alineados */
.peppino-accordion-icon {
    color: var(--pep-gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    margin-right: 6px;
}
.peppino-accordion-icon svg {
    width: 22px;
    height: 22px;
}
.peppino-accordion-head:hover .peppino-accordion-icon { color: var(--pep-text); }
.peppino-accordion-item.is-open .peppino-accordion-icon { color: var(--pep-text); }

/* Iconos del menú degustación en /reservas-grupos */
.peppino-menu-list-icons { list-style: none !important; padding: 0 !important; }
.peppino-menu-list-icons li {
    display: flex;
    align-items: center;
    gap: 10px;
}
.peppino-menu-list-icons li svg {
    color: var(--pep-gold);
    flex-shrink: 0;
}

/* Icono SVG del checkout slot info (caja "Tu pedido") */
.peppino-checkout-slot-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(245,197,24,.1);
    border: 1px solid rgba(245,197,24,.2);
    color: var(--pep-gold);
    flex-shrink: 0;
}
.peppino-checkout-slot-icon svg { width: 24px; height: 24px; }

/* Llama "Mandar al horno" — SVG pseudo-elemento via CSS */
.single_add_to_cart_button.peppino-btn-fire,
.products .product .peppino-btn-fire,
.products .product a.add_to_cart_button {
    position: relative;
}
.single_add_to_cart_button::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3 c2 4 5 5 5 10 a5 5 0 0 1 -10 0 c0 -3 2 -4 2 -7 q1 1 2 1 q-1 -2 1 -4 Z'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3 c2 4 5 5 5 10 a5 5 0 0 1 -10 0 c0 -3 2 -4 2 -7 q1 1 2 1 q-1 -2 1 -4 Z'/></svg>") center / contain no-repeat;
    vertical-align: middle;
    margin-right: 8px;
    transition: transform .25s;
}
.single_add_to_cart_button:hover::before {
    transform: scale(1.15) rotate(-4deg);
}

.peppino-accordion-item {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius-sm);
    overflow: hidden;
}

.peppino-accordion-head {
    width: 100%;
    background: transparent;
    border: 0;
    color: var(--pep-text);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
}

.peppino-accordion-head:hover {
    background: var(--pep-surface-2);
}

.peppino-accordion-head .peppino-accordion-icon {
    margin-right: 8px;
}

.peppino-accordion-head .peppino-accordion-caret {
    transition: transform .18s;
    color: var(--pep-text-muted);
}

.peppino-accordion-item.is-open .peppino-accordion-caret {
    transform: rotate(180deg);
}

.peppino-accordion-body {
    padding: 12px 16px 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
/* Cerrado por defecto: el atributo hidden tiene que ganar */
.peppino-accordion-body[hidden] { display: none !important; }

@media (max-width: 600px) {
    .peppino-accordion-body { grid-template-columns: 1fr; }
}

/* =========================================================
   CARRITO Y CHECKOUT
   ========================================================= */
body.peppino-cart-page .site-content,
body.peppino-checkout-page .site-content {
    background: var(--pep-bg);
}

body.peppino-cart-page .woocommerce table.shop_table,
body.peppino-checkout-page .woocommerce table.shop_table {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
    color: var(--pep-text);
}

body.peppino-cart-page .woocommerce table.shop_table th,
body.peppino-checkout-page .woocommerce table.shop_table th {
    background: var(--pep-surface-2);
    color: var(--pep-text);
    border-bottom: 1px solid var(--pep-border);
}

body.peppino-cart-page .woocommerce table.shop_table td,
body.peppino-checkout-page .woocommerce table.shop_table td {
    border-top: 1px solid var(--pep-border);
}

body.peppino-checkout-page .woocommerce-checkout input,
body.peppino-checkout-page .woocommerce-checkout select,
body.peppino-checkout-page .woocommerce-checkout textarea {
    background: var(--pep-surface-2) !important;
    color: var(--pep-text) !important;
    border: 1px solid var(--pep-border-soft) !important;
    border-radius: var(--pep-radius-sm) !important;
    padding: 12px 14px !important;
}

body.peppino-checkout-page .woocommerce-checkout label {
    color: var(--pep-text-soft);
}

body.peppino-checkout-page #payment {
    background: var(--pep-surface) !important;
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
}

body.peppino-checkout-page #payment ul.payment_methods {
    background: transparent !important;
    border-bottom: 1px solid var(--pep-border);
}

body.peppino-checkout-page #payment div.payment_box {
    background: var(--pep-surface-2) !important;
    color: var(--pep-text-soft);
}

/* Botón "Realizar pedido" */
body.peppino-checkout-page #place_order,
body.peppino-cart-page .checkout-button {
    background: var(--pep-red) !important;
    color: #fff !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 18px 24px !important;
    font-size: 17px !important;
    border-radius: var(--pep-radius-sm) !important;
    box-shadow: 0 6px 18px rgba(215,25,32,.35);
}

body.peppino-checkout-page #place_order:hover {
    background: var(--pep-red-dark) !important;
}

/* =========================================================
   PEPPINO DELIVERY SLOTS — ESTILO INTEGRADO
   (sobrescribimos el CSS del plugin para el front)
   ========================================================= */
.peppino-delivery-box {
    background: var(--pep-surface) !important;
    border: 1px solid var(--pep-border-soft) !important;
    border-radius: var(--pep-radius) !important;
    padding: 20px !important;
    margin: 20px 0 !important;
    color: var(--pep-text);
}

.peppino-delivery-box h3 {
    color: var(--pep-text);
    font-family: var(--pep-sans);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 14px;
}

.peppino-delivery-box h3 span {
    color: var(--pep-red);
}

.peppino-delivery-box label {
    color: var(--pep-text-soft);
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: block;
    margin: 16px 0 8px;
}

.peppino-type-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.pep-type-btn,
.pep-date-btn,
.pep-time-btn {
    background: var(--pep-surface-2);
    color: var(--pep-text);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius-sm);
    padding: 14px 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s;
    font-family: var(--pep-sans);
}

.pep-type-btn:hover,
.pep-date-btn:hover,
.pep-time-btn:hover {
    border-color: var(--pep-red);
    background: #2a1414;
}

.pep-type-btn.is-active,
.pep-date-btn.is-active,
.pep-time-btn.is-active {
    background: var(--pep-red);
    border-color: var(--pep-red);
    color: #fff;
    box-shadow: 0 4px 14px rgba(215,25,32,.35);
}

.peppino-date-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
}

.pep-date-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 12px 10px;
}

.pep-date-btn strong { font-size: 14px; }
.pep-date-btn small { font-size: 12px; opacity: .8; }

.pep-time-group {
    margin-top: 12px;
}

.pep-time-group > span {
    display: block;
    color: var(--pep-text-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
}

.pep-time-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(78px, 1fr));
    gap: 6px;
}

.pep-time-btn {
    padding: 10px 8px;
    font-size: 14px;
}

.peppino-slot-status {
    margin-top: 14px;
    padding: 10px 14px;
    background: var(--pep-bg);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-sm);
    font-size: 14px;
}

.peppino-slot-status .pep-muted { color: var(--pep-text-muted); }
.peppino-slot-status .pep-ok { color: var(--pep-green); font-weight: 700; }

.peppino-checkout-reminder {
    background: rgba(245,197,24,.12);
    color: var(--pep-gold);
    border: 1px solid rgba(245,197,24,.3);
    border-radius: var(--pep-radius-sm);
    padding: 12px 16px;
    margin-bottom: 16px;
    font-weight: 600;
}

/* =========================================================
   MENSAJES WOOCOMMERCE
   ========================================================= */
body.peppino-dark .woocommerce-message,
body.peppino-dark .woocommerce-info,
body.peppino-dark .woocommerce-error {
    background: var(--pep-surface) !important;
    color: var(--pep-text) !important;
    border-top-color: var(--pep-red) !important;
    border-radius: var(--pep-radius-sm);
}

body.peppino-dark .woocommerce-message a,
body.peppino-dark .woocommerce-info a {
    color: var(--pep-gold-soft) !important;
}

/* =========================================================
   BOTONES PEPPINO REUTILIZABLES
   ========================================================= */
.peppino-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 28px;
    border-radius: var(--pep-radius-sm);
    border: 0;
    font-family: var(--pep-sans);
    font-weight: 800;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .12s, background .18s, box-shadow .18s;
}
.peppino-btn-primary { background: var(--pep-red); color: #fff !important; box-shadow: 0 6px 18px rgba(215,25,32,.35); }
.peppino-btn-primary:hover { background: var(--pep-red-dark); transform: translateY(-2px); color: #fff !important; }
.peppino-btn-ghost { background: transparent; color: var(--pep-text) !important; border: 1.5px solid var(--pep-text); }
.peppino-btn-ghost:hover { background: var(--pep-text); color: #000 !important; }
.peppino-btn-block { width: 100%; margin-top: 12px; }

.peppino-eyebrow {
    display: inline-block;
    font-family: var(--pep-sans);
    color: var(--pep-gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

/* =========================================================
   HOME — HERO ANIMADO (con o sin vídeo)
   ========================================================= */
.peppino-hero {
    position: relative;
    min-height: 86vh;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: -32px;
    padding: 100px 20px 80px;
    overflow: hidden;
    background: #000;
    isolation: isolate;
    display: flex;
    align-items: center;
}

.peppino-hero-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 1;
    filter: brightness(.55) saturate(1.1);
}

.peppino-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background:
        radial-gradient(ellipse at 30% 30%, rgba(215,25,32,.18), transparent 55%),
        radial-gradient(ellipse at 70% 80%, rgba(30,164,85,.12), transparent 60%),
        linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.7) 100%);
    pointer-events: none;
}

.peppino-hero-inner {
    position: relative;
    z-index: 3;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    padding: 0 20px;
}

.peppino-hero-kicker {
    display: inline-block;
    font-family: var(--pep-sans);
    font-weight: 700;
    color: var(--pep-gold);
    letter-spacing: 0.3em;
    font-size: 13px;
    margin-bottom: 16px;
    text-transform: uppercase;
    animation: peppino-fade-up .8s ease both;
}

.peppino-hero-title {
    font-family: var(--pep-serif);
    font-size: clamp(44px, 7vw, 96px);
    font-weight: 800;
    line-height: 1;
    margin: 0 0 22px;
    color: #fff;
    animation: peppino-fade-up 1s .15s ease both;
}
.peppino-hero-title em {
    font-style: italic;
    color: var(--pep-gold);
    font-weight: 700;
}

.peppino-hero-sub {
    color: rgba(255,255,255,.85);
    font-size: clamp(15px, 1.4vw, 18px);
    line-height: 1.6;
    margin: 0 auto 36px;
    max-width: 620px;
    animation: peppino-fade-up 1s .3s ease both;
}

.peppino-hero-ctas {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    animation: peppino-fade-up 1s .45s ease both;
}

.peppino-hero-strip {
    margin-top: 60px;
    display: flex;
    gap: 0;
    justify-content: center;
    animation: peppino-fade-up 1s .6s ease both;
}
.peppino-hero-strip span {
    width: 70px;
    height: 4px;
    border-radius: 4px;
}
.peppino-hero-strip span:nth-child(1) { background: var(--pep-green); }
.peppino-hero-strip span:nth-child(2) { background: #fff; margin: 0 4px; }
.peppino-hero-strip span:nth-child(3) { background: var(--pep-red); }

@keyframes peppino-fade-up {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ----- Animación CSS fallback (sin vídeo o si vídeo falla) ----- */
.peppino-hero-anim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background:
        radial-gradient(circle at 50% 60%, #3a1408 0%, #1a0805 35%, #000 80%);
    overflow: hidden;
}
/* Si hay vídeo y carga, ocultamos la animación */
.peppino-hero.has-video.video-ok .peppino-hero-anim { display: none; }
.peppino-hero.has-video .peppino-hero-anim { opacity: 1; }

.peppino-flame {
    position: absolute;
    bottom: -120px;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    filter: blur(60px);
    opacity: .55;
    animation: peppino-flame 6s ease-in-out infinite;
}
.peppino-flame.f1 { left: 20%; background: #d71920; animation-delay: 0s; }
.peppino-flame.f2 { left: 50%; background: #f5c518; animation-delay: 1.5s; transform: translateX(-50%); }
.peppino-flame.f3 { right: 18%; background: #a01a14; animation-delay: 3s; }

@keyframes peppino-flame {
    0%,100% { transform: translateY(0) scale(1); opacity: .55; }
    50%     { transform: translateY(-30px) scale(1.15); opacity: .75; }
}
.peppino-hero-anim .peppino-flame.f2 {
    animation-name: peppino-flame-center;
}
@keyframes peppino-flame-center {
    0%,100% { transform: translateX(-50%) translateY(0) scale(1); opacity: .55; }
    50%     { transform: translateX(-50%) translateY(-30px) scale(1.15); opacity: .75; }
}

.peppino-ingredient {
    position: absolute;
    font-size: 36px;
    opacity: .15;
    animation: peppino-drift 18s linear infinite;
    filter: blur(.5px);
}
.peppino-ingredient.i1 { left: 8%;  top: 18%; animation-duration: 22s; }
.peppino-ingredient.i2 { left: 88%; top: 22%; animation-duration: 19s; animation-delay: -4s; }
.peppino-ingredient.i3 { left: 14%; top: 70%; animation-duration: 25s; animation-delay: -8s; font-size: 44px; }
.peppino-ingredient.i4 { left: 82%; top: 65%; animation-duration: 20s; animation-delay: -2s; font-size: 52px; opacity: .25; }
.peppino-ingredient.i5 { left: 48%; top: 12%; animation-duration: 24s; animation-delay: -10s; }

@keyframes peppino-drift {
    0%   { transform: translate(0, 0) rotate(0deg); }
    50%  { transform: translate(20px, -20px) rotate(180deg); }
    100% { transform: translate(0, 0) rotate(360deg); }
}

@media (max-width: 760px) {
    .peppino-hero { min-height: 70vh; padding: 60px 20px; margin: -32px 0 0; }
    .peppino-hero-strip { margin-top: 40px; }
}

/* =========================================================
   HOME — SECCIONES
   ========================================================= */
.peppino-section {
    padding: 80px 0 60px;
    max-width: 1180px;
    margin: 0 auto;
}

.peppino-section-head {
    text-align: center;
    margin-bottom: 50px;
}
.peppino-section-head h2 {
    font-family: var(--pep-serif);
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 800;
    margin: 0 0 12px;
    color: var(--pep-text);
}
.peppino-section-head p {
    color: var(--pep-text-soft);
    font-size: 16px;
    max-width: 540px;
    margin: 0 auto;
}

.peppino-section-more {
    text-align: center;
    margin-top: 36px;
}

/* =========================================================
   HOME — TRES PILARES (Masa lenta / Horno piedra / Italia en Lugo)
   ========================================================= */
.peppino-section-pillars {
    padding: 60px 0 30px;
}
.peppino-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
@media (max-width: 880px) {
    .peppino-pillars-grid { grid-template-columns: 1fr; }
}

.peppino-pillar {
    text-align: center;
    padding: 30px 24px;
    border-radius: var(--pep-radius-lg);
    background: transparent;
    position: relative;
    transition: transform .25s;
}
.peppino-pillar:hover { transform: translateY(-4px); }

.peppino-pillar-icon {
    width: 140px;
    height: 140px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.peppino-pillar-icon svg,
.peppino-pillar-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
/* Recorta automáticamente el fondo blanco de los PNG de los pilares
   (pinta sobre fondo negro: el blanco se vuelve "transparente" visualmente).
   Si en el futuro subes versiones con fondo transparente, sigue funcionando igual. */
.peppino-pillar-icon img {
    mix-blend-mode: screen;
    filter: brightness(1.05) contrast(1.05);
}

.peppino-pillar-title {
    font-family: var(--pep-serif);
    font-size: 22px;
    font-weight: 700;
    color: var(--pep-text);
    margin: 0 0 14px;
    letter-spacing: 0.02em;
}

.peppino-pillar-text {
    color: var(--pep-text-soft);
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 18px;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.peppino-pillar-flag {
    display: inline-flex;
    gap: 0;
    justify-content: center;
}
.peppino-pillar-flag span {
    width: 38px;
    height: 3px;
    border-radius: 2px;
}
.peppino-pillar-flag span:nth-child(1) { background: var(--pep-green); }
.peppino-pillar-flag span:nth-child(2) { background: var(--pep-text); margin: 0 4px; }
.peppino-pillar-flag span:nth-child(3) { background: var(--pep-red); }

/* =========================================================
   HOME — EL LOCAL (texto + collage de 3 fotos)
   ========================================================= */
.peppino-section-local {
    padding: 80px 0;
}

.peppino-local-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 60px;
    align-items: center;
}
@media (max-width: 960px) {
    .peppino-local-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
}

.peppino-local-text {
    padding: 20px 0;
}
.peppino-local-eyebrow {
    color: var(--pep-red);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 16px;
}
.peppino-local-text h2 {
    font-family: var(--pep-serif);
    font-size: clamp(32px, 4.5vw, 52px);
    font-weight: 800;
    color: var(--pep-text);
    margin: 0 0 22px;
    line-height: 1.1;
}
.peppino-local-text p {
    color: var(--pep-text-soft);
    font-size: 16px;
    line-height: 1.65;
    margin: 0 0 16px;
}
.peppino-local-text .peppino-btn {
    margin-top: 12px;
}

/* Collage: foto grande izquierda + 2 más pequeñas apiladas a la derecha */
.peppino-local-collage {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 14px;
    height: 520px;
}
.peppino-local-photo {
    position: relative;
    overflow: hidden;
    border-radius: var(--pep-radius);
    border: 1px solid var(--pep-border);
    background: var(--pep-surface);
    box-shadow: var(--pep-shadow);
}
.peppino-local-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.peppino-local-photo:hover img {
    transform: scale(1.06);
}
.peppino-local-photo-big {
    grid-row: 1 / 3;
}
.peppino-local-photo-small-1 { grid-row: 1; }
.peppino-local-photo-small-2 { grid-row: 2; }

@media (max-width: 700px) {
    .peppino-local-collage {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 220px 160px;
        height: auto;
    }
    .peppino-local-photo-big {
        grid-row: 1;
        grid-column: 1 / 3;
    }
    .peppino-local-photo-small-1 { grid-row: 2; grid-column: 1; }
    .peppino-local-photo-small-2 { grid-row: 2; grid-column: 2; }
}

.peppino-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
}
.peppino-info-card {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-lg);
    padding: 32px 28px;
    text-align: center;
    transition: border-color .18s, transform .18s;
}
.peppino-info-card:hover {
    border-color: var(--pep-red);
    transform: translateY(-4px);
}
.peppino-info-icon {
    font-size: 38px;
    display: block;
    margin-bottom: 12px;
}
.peppino-info-card h3 {
    font-family: var(--pep-serif);
    font-size: 24px;
    margin: 0 0 10px;
    color: var(--pep-gold);
}
.peppino-info-card p { color: var(--pep-text-soft); margin: 0; line-height: 1.55; }
.peppino-link {
    display: inline-block;
    margin-top: 10px;
    color: var(--pep-gold) !important;
    font-weight: 700;
    text-decoration: none !important;
}

/* =========================================================
   HOME — VISÍTANOS (info + mapa)
   ========================================================= */
.peppino-section-visit {
    padding: 80px 0;
}

.peppino-visit-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 30px;
    align-items: stretch;
}
@media (max-width: 960px) {
    .peppino-visit-grid {
        grid-template-columns: 1fr;
    }
}

.peppino-visit-info {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.peppino-visit-card {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-lg);
    padding: 24px 26px;
    display: flex;
    gap: 18px;
    align-items: flex-start;
    transition: border-color .18s, transform .18s;
}
.peppino-visit-card:hover {
    border-color: var(--pep-red);
    transform: translateX(3px);
}

.peppino-visit-icon {
    flex-shrink: 0;
    background: linear-gradient(135deg, rgba(245,197,24,.08) 0%, rgba(215,25,32,.04) 100%);
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(245,197,24,.18);
    color: var(--pep-gold);
    transition: border-color .2s, transform .2s, color .2s;
}
.peppino-visit-icon svg {
    width: 26px;
    height: 26px;
    stroke: currentColor;
}
.peppino-visit-card:hover .peppino-visit-icon {
    border-color: var(--pep-gold);
    color: var(--pep-text);
    transform: rotate(-3deg);
}

.peppino-visit-content { flex: 1; }
.peppino-visit-content h3 {
    margin: 0 0 8px;
    font-family: var(--pep-serif);
    font-size: 22px;
    color: var(--pep-gold);
}
.peppino-visit-content p {
    color: var(--pep-text-soft);
    margin: 0 0 8px;
    line-height: 1.55;
    font-size: 15px;
}
.peppino-visit-content p strong { color: var(--pep-text); }
.peppino-phone {
    color: var(--pep-text) !important;
    font-family: var(--pep-sans);
    font-size: 24px !important;
    font-weight: 800;
    text-decoration: none !important;
    letter-spacing: 0.04em;
    transition: color .15s;
}
.peppino-phone:hover { color: var(--pep-red) !important; }

/* Horario semanal */
.peppino-schedule {
    list-style: none;
    padding: 0;
    margin: 8px 0 14px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.peppino-schedule li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--pep-border);
    color: var(--pep-text-soft);
    font-size: 15px;
}
.peppino-schedule li:last-child { border-bottom: 0; }
.peppino-schedule li.is-today {
    color: var(--pep-text);
    font-weight: 700;
}
.peppino-schedule-day {
    flex: 0 0 90px;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 0.06em;
    font-weight: 700;
}
.peppino-schedule-hours {
    flex: 1;
    color: var(--pep-text);
    font-family: var(--pep-sans);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}
.peppino-schedule li:not(.is-today) .peppino-schedule-hours { color: var(--pep-text-soft); }
.peppino-schedule-badge {
    background: var(--pep-red);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 3px 10px;
    border-radius: 999px;
}
.peppino-schedule-note {
    background: rgba(245,197,24,.08);
    border: 1px solid rgba(245,197,24,.2);
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 13px !important;
    color: var(--pep-gold-soft) !important;
    margin: 14px 0 0 !important;
    line-height: 1.45 !important;
}
.peppino-schedule-note strong {
    color: var(--pep-gold) !important;
    font-family: var(--pep-sans);
}

/* Mapa */
.peppino-visit-map {
    border-radius: var(--pep-radius-lg);
    overflow: hidden;
    border: 1px solid var(--pep-border);
    background: var(--pep-surface);
    min-height: 500px;
    position: relative;
    box-shadow: var(--pep-shadow);
}
.peppino-visit-map iframe {
    width: 100%;
    height: 100%;
    min-height: 500px;
    display: block;
    filter: invert(.9) hue-rotate(180deg) saturate(.85) brightness(1.05);
}
@media (max-width: 960px) {
    .peppino-visit-map { min-height: 360px; }
    .peppino-visit-map iframe { min-height: 360px; }
}

/* =========================================================
   HOME — RESEÑAS DE GOOGLE (solo 5★)
   ========================================================= */
.peppino-section-reviews {
    padding: 80px 0 60px;
}

.peppino-reviews-summary {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 10px 18px;
    background: rgba(245,197,24,.08);
    border: 1px solid rgba(245,197,24,.25);
    border-radius: 999px;
    flex-wrap: wrap;
    justify-content: center;
}
.peppino-reviews-stars {
    color: var(--pep-gold);
    font-size: 20px;
    letter-spacing: 2px;
}
.peppino-reviews-rating {
    color: var(--pep-text);
    font-weight: 800;
    font-size: 22px;
    font-family: var(--pep-sans);
}
.peppino-reviews-total {
    color: var(--pep-text-soft);
    font-size: 14px;
}

.peppino-reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 40px;
}
@media (max-width: 960px) { .peppino-reviews-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .peppino-reviews-grid { grid-template-columns: 1fr; } }

.peppino-review-card {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-lg);
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform .2s, border-color .2s;
    position: relative;
}
.peppino-review-card:hover {
    transform: translateY(-3px);
    border-color: var(--pep-red);
}

.peppino-review-head {
    display: flex;
    align-items: center;
    gap: 12px;
}
.peppino-review-head img,
.peppino-review-avatar-fallback {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
    object-fit: cover;
}
.peppino-review-avatar-fallback {
    background: linear-gradient(135deg, var(--pep-red), var(--pep-gold));
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 800;
    text-transform: uppercase;
}
.peppino-review-head > div {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.peppino-review-head strong {
    color: var(--pep-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
}
.peppino-review-meta {
    color: var(--pep-gold);
    font-size: 13px;
    letter-spacing: 1px;
    margin-top: 2px;
}
.peppino-review-meta small {
    color: var(--pep-text-muted);
    font-size: 12px;
    letter-spacing: normal;
}
.peppino-review-google {
    flex-shrink: 0;
}

.peppino-review-text {
    color: var(--pep-text-soft);
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
    font-style: italic;
    /* Limita a 6 líneas con elipsis */
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    line-clamp: 6;
    overflow: hidden;
}

/* =========================================================
   CARTA — single page
   ========================================================= */
.peppino-carta {
    max-width: 1100px;
    margin: 0 auto;
    padding: 30px 16px 80px;
}

.peppino-carta-header {
    text-align: center;
    padding: 30px 0 40px;
}
.peppino-carta-header h1 {
    font-family: var(--pep-serif);
    font-size: clamp(40px, 6vw, 68px);
    margin: 0 0 12px;
    color: var(--pep-text);
}
.peppino-carta-header p {
    color: var(--pep-text-soft);
    max-width: 560px;
    margin: 0 auto;
}

.peppino-carta-nav {
    position: sticky;
    top: 60px;
    z-index: 50;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    background: rgba(14,14,14,.92);
    backdrop-filter: blur(10px);
    border: 1px solid var(--pep-border);
    border-radius: 999px;
    padding: 10px;
    margin: 0 auto 48px;
    max-width: max-content;
    box-shadow: var(--pep-shadow);
}
.peppino-carta-nav a {
    color: var(--pep-text);
    text-decoration: none !important;
    padding: 8px 18px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 14px;
    transition: background .15s, color .15s;
}
.peppino-carta-nav a:hover {
    background: var(--pep-red);
    color: #fff !important;
}

.peppino-carta-section {
    margin-bottom: 64px;
    scroll-margin-top: 130px;
}
.peppino-carta-title {
    font-family: var(--pep-serif);
    font-size: clamp(28px, 4vw, 42px);
    text-align: center;
    color: var(--pep-text);
    margin: 0 0 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.peppino-tricolor {
    display: inline-block;
    width: 80px;
    height: 6px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--pep-green) 33%, #fff 33% 66%, var(--pep-red) 66%);
}

.peppino-carta-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}
@media (max-width: 760px) {
    .peppino-carta-grid { grid-template-columns: 1fr; }
}

.peppino-carta-item {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
    padding: 14px 18px 14px 14px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: border-color .18s, transform .18s;
}
.peppino-carta-item.is-pizza:hover {
    border-color: var(--pep-red);
    transform: translateX(3px);
}

.peppino-carta-item-thumb {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--pep-bg);
    display: block;
    border: 1px solid var(--pep-border);
}
.peppino-carta-item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .25s;
}
.peppino-carta-item.is-pizza:hover .peppino-carta-item-thumb img {
    transform: scale(1.06);
}

.peppino-carta-item-main {
    flex: 1;
    min-width: 0;
}

@media (max-width: 540px) {
    .peppino-carta-item-thumb { width: 72px; height: 72px; }
    .peppino-carta-item { padding: 12px; gap: 12px; }
}

.peppino-carta-item h3 {
    margin: 0 0 6px;
    font-family: var(--pep-sans);
    font-size: 18px;
    font-weight: 800;
    color: var(--pep-text);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.peppino-carta-item h3 a {
    color: var(--pep-text) !important;
    text-decoration: none !important;
}
.peppino-carta-item h3 a:hover { color: var(--pep-gold) !important; }

.peppino-carta-item p {
    margin: 0;
    color: var(--pep-text-soft);
    font-size: 14px;
    font-style: normal;
    font-family: var(--pep-sans);
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: 0.01em;
}

.peppino-carta-item-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    flex-shrink: 0;
}
.peppino-carta-price {
    color: var(--pep-gold);
    font-size: 20px;
    font-weight: 800;
    white-space: nowrap;
}
.peppino-carta-price .woocommerce-Price-amount { color: var(--pep-gold) !important; }

.peppino-mini-btn {
    background: var(--pep-red);
    color: #fff !important;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none !important;
    transition: background .15s;
}
.peppino-mini-btn:hover { background: var(--pep-red-dark); color: #fff !important; }

.peppino-carta-footer-note {
    text-align: center;
    color: var(--pep-gold-soft);
    font-style: italic;
    margin-top: 40px;
    padding: 20px;
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
}

/* =========================================================
   RESERVAS PARA GRUPOS
   ========================================================= */
.peppino-reservas {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 16px 80px;
}
.peppino-reservas-header {
    text-align: center;
    margin-bottom: 50px;
}
.peppino-reservas-header h1 {
    font-family: var(--pep-serif);
    font-size: clamp(36px, 5vw, 56px);
    color: var(--pep-text);
    margin: 0 0 14px;
}
.peppino-reservas-header p {
    color: var(--pep-text-soft);
    max-width: 640px;
    margin: 0 auto;
    font-size: 16px;
}

.peppino-reservas-grid {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 40px;
    align-items: start;
}
@media (max-width: 880px) {
    .peppino-reservas-grid { grid-template-columns: 1fr; }
}

.peppino-menu-degustacion {
    background: linear-gradient(160deg, #1a1a1a 0%, #0a0a0a 100%);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-lg);
    padding: 30px;
    position: relative;
    overflow: hidden;
}
.peppino-menu-degustacion::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 6px;
    background: linear-gradient(90deg, var(--pep-green) 33%, #fff 33% 66%, var(--pep-red) 66%);
}
.peppino-menu-eyebrow {
    color: var(--pep-gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}
.peppino-menu-degustacion h2 {
    font-family: var(--pep-serif);
    font-size: 36px;
    margin: 6px 0 16px;
    color: var(--pep-text);
}
.peppino-menu-price {
    background: #000;
    color: var(--pep-gold);
    padding: 14px 18px;
    border-radius: var(--pep-radius-sm);
    margin-bottom: 22px;
    display: flex;
    align-items: baseline;
    gap: 8px;
    border: 1px solid var(--pep-border-soft);
}
.peppino-menu-price strong { font-size: 32px; font-weight: 800; }
.peppino-menu-price span { color: var(--pep-text-muted); font-size: 14px; }
.peppino-menu-degustacion ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}
.peppino-menu-degustacion li {
    color: var(--pep-text);
    padding: 10px 0;
    border-bottom: 1px solid var(--pep-border);
    font-size: 15px;
}
.peppino-menu-degustacion li:last-child { border-bottom: 0; }
.peppino-menu-min {
    color: var(--pep-gold-soft);
    font-style: italic;
    margin: 0;
    text-align: center;
    padding-top: 10px;
    border-top: 1px dashed var(--pep-border-soft);
}

.peppino-form {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius-lg);
    padding: 32px;
}
.peppino-form label {
    display: block;
    color: var(--pep-text-soft);
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 14px;
}
.peppino-form input,
.peppino-form textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
    padding: 14px 16px;
    background: var(--pep-surface-2);
    color: var(--pep-text);
    border: 1px solid var(--pep-border-soft);
    border-radius: var(--pep-radius-sm);
    font-size: 16px;
    font-family: var(--pep-sans);
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    transition: border-color .15s;
}
.peppino-form input:focus,
.peppino-form textarea:focus {
    outline: none;
    border-color: var(--pep-red);
}
.peppino-form-row { display: grid; gap: 14px; }
.peppino-form-2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 520px) { .peppino-form-2 { grid-template-columns: 1fr; } }

.peppino-form-msg {
    padding: 14px 18px;
    border-radius: var(--pep-radius-sm);
    margin-bottom: 18px;
    font-weight: 600;
}
.peppino-form-msg-ok {
    background: rgba(30,164,85,.15);
    color: var(--pep-green);
    border: 1px solid rgba(30,164,85,.3);
}
.peppino-form-msg-error {
    background: rgba(215,25,32,.12);
    color: #ff8088;
    border: 1px solid rgba(215,25,32,.3);
}
.peppino-form-foot {
    margin: 12px 0 0;
    text-align: center;
    color: var(--pep-text-muted);
    font-size: 13px;
}

/* =========================================================
   VINOS Y BEBIDAS — estilo carta clásica italiana
   ========================================================= */
.peppino-vinos {
    max-width: 1000px;
    margin: 0 auto;
    padding: 30px 16px 80px;
}

.peppino-vinos-header {
    text-align: center;
    padding: 30px 0 50px;
    position: relative;
}
.peppino-vinos-header h1 {
    font-family: var(--pep-serif);
    font-size: clamp(40px, 6vw, 64px);
    margin: 0 0 14px;
    color: var(--pep-text);
    font-style: italic;
    font-weight: 700;
}
.peppino-vinos-header p {
    color: var(--pep-text-soft);
    max-width: 580px;
    margin: 0 auto;
    font-size: 16px;
}

.peppino-age-warning {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: rgba(215,25,32,.08);
    border: 1px solid rgba(215,25,32,.25);
    border-radius: 999px;
    padding: 10px 18px 10px 8px;
    margin: 28px auto 0;
    color: var(--pep-text-soft);
    font-size: 13px;
    max-width: 640px;
    line-height: 1.4;
    text-align: left;
}
.peppino-age-badge {
    background: var(--pep-red);
    color: #fff;
    font-weight: 900;
    font-size: 13px;
    letter-spacing: 0.04em;
    padding: 6px 12px;
    border-radius: 999px;
    flex-shrink: 0;
}

.peppino-vinos-nav {
    margin-bottom: 60px;
}

.peppino-vinos-section {
    margin-bottom: 64px;
    scroll-margin-top: 130px;
}

.peppino-vinos-section-head {
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: center;
    margin-bottom: 28px;
    padding-bottom: 14px;
    position: relative;
}
.peppino-vinos-section-head::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--pep-gold-soft), transparent);
}

.peppino-vinos-icon {
    color: var(--pep-gold);
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.peppino-vinos-icon svg { width: 100%; height: 100%; }

.peppino-vinos-section-head h2 {
    font-family: var(--pep-serif);
    font-size: clamp(22px, 3vw, 30px);
    font-weight: 700;
    color: var(--pep-text);
    margin: 0;
    letter-spacing: 0.18em;
}

.peppino-tricolor-mini {
    display: inline-flex;
}
.peppino-tricolor-mini::before {
    content: "";
    width: 24px;
    height: 3px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--pep-green) 33%, #fff 33% 66%, var(--pep-red) 66%);
    display: inline-block;
}

.peppino-vinos-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 40px;
}
@media (max-width: 700px) {
    .peppino-vinos-list { grid-template-columns: 1fr; gap: 4px; }
}

.peppino-vinos-list li {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 10px 0;
    color: var(--pep-text);
    font-family: var(--pep-sans);
    border-bottom: 1px dotted rgba(255,255,255,.06);
}
.peppino-vinos-list li:hover {
    border-bottom-color: var(--pep-gold);
}

.peppino-vino-name {
    font-size: 16px;
    font-weight: 500;
    color: var(--pep-text);
    flex-shrink: 0;
}

.peppino-vino-dots {
    flex: 1;
    border-bottom: 1px dotted rgba(184, 179, 168, 0.3);
    transform: translateY(-4px);
    min-width: 20px;
}

.peppino-vino-price {
    color: var(--pep-gold);
    font-weight: 700;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex-shrink: 0;
}

/* En móvil: nombre y precio en la misma línea con dots entremedias */
@media (max-width: 700px) {
    .peppino-vinos-list li { padding: 8px 0; }
    .peppino-vino-name { font-size: 15px; }
    .peppino-vino-price { font-size: 15px; }
}

/* =========================================================
   RESPONSIVE GLOBAL — Home + páginas
   Fix de breakpoints y ajustes para tablet/móvil
   ========================================================= */

/* Evitar scroll horizontal por culpa del hero full-width */
html, body { overflow-x: hidden; }

/* Tablet ~ 960px y por debajo */
@media (max-width: 960px) {
    .peppino-section { padding: 56px 16px 40px; }
    .peppino-section-pillars { padding: 40px 16px 20px; }
    .peppino-section-local { padding: 50px 16px; }
    .peppino-section-visit { padding: 50px 16px; }
    .peppino-section-reviews { padding: 50px 16px 40px; }

    .peppino-section-head { margin-bottom: 32px; }
    .peppino-section-head h2 { font-size: clamp(26px, 4.5vw, 36px); }

    /* Pillares: 1 columna por encima de 768, otra leve mejora */
    .peppino-pillars-grid { gap: 18px; }
    .peppino-pillar { padding: 24px 16px; }
    .peppino-pillar-icon { width: 110px; height: 110px; }

    /* WooCommerce grid en home — forzamos máximo 2 columnas */
    .peppino-section-pizzas .woocommerce ul.products,
    .peppino-section-pizzas ul.products {
        grid-template-columns: 1fr 1fr !important;
        display: grid !important;
        gap: 14px !important;
    }
    .peppino-section-pizzas ul.products li.product { width: auto !important; float: none !important; margin: 0 !important; }
}

/* Móvil ~ 640px y por debajo */
@media (max-width: 640px) {
    .peppino-section { padding: 44px 14px 30px; }
    .peppino-section-pillars,
    .peppino-section-local,
    .peppino-section-visit,
    .peppino-section-reviews { padding: 44px 14px; }

    /* Hero: aire y CTAs en columna */
    .peppino-hero { min-height: 70vh; padding: 70px 18px 50px; }
    .peppino-hero-title { font-size: clamp(34px, 9vw, 52px); }
    .peppino-hero-sub { font-size: 14px; margin-bottom: 28px; }
    .peppino-hero-ctas { flex-direction: column; gap: 10px; width: 100%; max-width: 320px; margin: 0 auto; }
    .peppino-hero-ctas .peppino-btn { width: 100%; }
    .peppino-hero-strip { margin-top: 32px; }
    .peppino-hero-strip span { width: 48px; }

    /* Pizzas en home — 1 columna */
    .peppino-section-pizzas ul.products {
        grid-template-columns: 1fr !important;
    }

    /* Visit cards más compactas */
    .peppino-visit-card { padding: 18px; gap: 14px; }
    .peppino-visit-icon { width: 44px; height: 44px; font-size: 22px; border-radius: 10px; }
    .peppino-visit-content h3 { font-size: 18px; }
    .peppino-phone { font-size: 20px !important; }
    .peppino-schedule-day { flex: 0 0 80px; font-size: 11px; }
    .peppino-schedule-hours { font-size: 14px; }
    .peppino-visit-map { min-height: 280px; }
    .peppino-visit-map iframe { min-height: 280px; }

    /* Local: collage compacto */
    .peppino-local-text h2 { font-size: clamp(26px, 7vw, 38px); }
    .peppino-local-text p { font-size: 14px; }
    .peppino-local-collage {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 180px 130px;
        gap: 8px;
    }

    /* Reviews: tarjetas más compactas */
    .peppino-review-card { padding: 18px; }
    .peppino-review-text { font-size: 14px; -webkit-line-clamp: 5; line-clamp: 5; }

    /* Carta — nav sticky redonda: scroll horizontal si no cabe */
    .peppino-carta-nav {
        max-width: calc(100vw - 28px);
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .peppino-carta-nav::-webkit-scrollbar { display: none; }
    .peppino-carta-nav a { white-space: nowrap; font-size: 13px; padding: 7px 14px; }

    /* FAB carrito no tape contenido */
    body { padding-bottom: 90px; }
}

/* =========================================================
   FICHA DE PIZZA — RESPONSIVE específico
   ========================================================= */

/* Tablet ~ 920px y por debajo: gallery y summary apiladas */
@media (max-width: 920px) {
    body.peppino-product-page #primary,
    body.peppino-product-page .ast-container,
    body.peppino-product-page main.site-main {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    body.peppino-product-page .peppino-product-topbar {
        padding: 14px 16px 18px;
        margin-bottom: 22px;
    }
    body.peppino-product-page .product_title {
        font-size: clamp(28px, 5vw, 38px) !important;
    }
}

/* Móvil ~ 640px */
@media (max-width: 640px) {
    /* Topbar: encoge tamaños pero mantiene los dos elementos en línea */
    body.peppino-product-page .peppino-product-topbar {
        padding: 12px 14px 16px;
        margin-bottom: 18px;
        gap: 10px;
    }
    body.peppino-product-page .peppino-back-link {
        font-size: 13px;
    }
    body.peppino-product-page .peppino-back-link svg {
        width: 14px;
        height: 14px;
    }
    body.peppino-product-page .peppino-product-cat-tag {
        font-size: 10px;
        padding: 4px 10px;
        letter-spacing: 0.08em;
    }

    /* Cards de imagen y summary: padding más fino para no comerse el ancho */
    body.peppino-product-page .woocommerce-product-gallery {
        padding: 12px !important;
        border-radius: 14px !important;
    }
    body.peppino-product-page .summary.entry-summary {
        padding: 22px 18px !important;
        border-radius: 14px !important;
    }

    /* Precio y descripción del producto */
    body.peppino-product-page .summary .price,
    body.peppino-product-page .summary .woocommerce-Price-amount {
        font-size: 24px !important;
    }
    body.peppino-product-page .woocommerce-product-details__short-description {
        font-size: 15px;
        line-height: 1.55;
    }

    /* Form cantidad + botón "Mandar al horno": apilados en columna */
    body.peppino-product-page form.cart {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    body.peppino-product-page form.cart .quantity {
        align-self: flex-start !important;
        margin: 0 !important;
    }
    body.peppino-product-page form.cart .single_add_to_cart_button {
        width: 100% !important;
        min-width: 0 !important;
        padding: 16px 20px !important;
        font-size: 15px !important;
    }

    /* Caja "Total pizza" más compacta */
    .peppino-pizza-total {
        padding: 14px 18px;
    }
    .peppino-pizza-total-amount {
        font-size: 24px;
    }
    .peppino-pizza-total-label {
        font-size: 13px;
    }

    /* Bloques extras: padding más fino */
    .peppino-extras-block,
    .peppino-upsell {
        padding: 14px !important;
    }

    /* Acordeones: dos columnas se ven apretadas → 1 columna */
    .peppino-accordion-body {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }
    /* Mismo para "Quita ingredientes" */
    .peppino-extras-ui .peppino-base-grid {
        grid-template-columns: 1fr !important;
    }

    /* Upsell: tarjetas a ancho completo */
    .peppino-upsell-grid {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }
    .peppino-upsell-item {
        padding: 14px 16px !important;
    }
    .peppino-upsell-name {
        font-size: 15px !important;
    }
    .peppino-upsell-minus,
    .peppino-upsell-plus {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        flex: 0 0 40px !important;
    }
    .peppino-upsell-count {
        font-size: 18px !important;
    }
}

/* Móvil muy estrecho ~ 380px (iPhone SE etc.) */
@media (max-width: 380px) {
    body.peppino-product-page .peppino-product-topbar {
        flex-wrap: wrap;
    }
    body.peppino-product-page .peppino-product-cat-tag {
        font-size: 9px;
        padding: 3px 8px;
    }
    body.peppino-product-page .summary.entry-summary {
        padding: 18px 14px !important;
    }
    body.peppino-product-page .product_title {
        font-size: 26px !important;
    }
}

/* Móvil estrecho ~ 420px */
@media (max-width: 420px) {
    .peppino-hero-title { font-size: clamp(28px, 10vw, 42px); }
    .peppino-pillar-icon { width: 96px; height: 96px; }
    .peppino-pillar-title { font-size: 19px; }
    .peppino-pillar-text { font-size: 14px; }
    .peppino-local-collage {
        grid-template-rows: 160px 110px;
    }
    .peppino-section-head h2 { font-size: 24px; }
    .peppino-eyebrow { font-size: 12px; letter-spacing: 0.16em; }
}

/* =========================================================
   IMG PLACEHOLDER nicer in shop
   ========================================================= */
.woocommerce-placeholder.wp-post-image {
    border-radius: var(--pep-radius);
    background: #1a1a1a;
}

/* =========================================================
   FIX: botón añadir al carrito en grids (loop)
   El selector body.woocommerce no aplica cuando se usa el
   shortcode [products] en una página normal.
   ========================================================= */
body.peppino-dark .products .product .button,
body.peppino-dark .products .product a.add_to_cart_button,
body.peppino-dark .products .product .added_to_cart {
    background: var(--pep-red) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 12px 20px !important;
    box-shadow: 0 4px 14px rgba(215,25,32,.3);
    transition: background .18s, transform .12s !important;
}
body.peppino-dark .products .product .button:hover,
body.peppino-dark .products .product a.add_to_cart_button:hover {
    background: var(--pep-red-dark) !important;
    transform: translateY(-1px);
}

/* Tarjetas del grid en home / shop con fondo correcto */
body.peppino-dark .products li.product,
body.peppino-dark .woocommerce-loop-product__link {
    background: var(--pep-surface);
    border: 1px solid var(--pep-border);
    border-radius: var(--pep-radius);
}
body.peppino-dark .woocommerce-loop-product__link { background: transparent; border: 0; }

body.peppino-dark .products .product .price,
body.peppino-dark .products .product .price .amount,
body.peppino-dark .products .product .woocommerce-Price-amount {
    color: var(--pep-gold) !important;
    font-weight: 800;
}

body.peppino-dark .products .product .woocommerce-loop-product__title {
    color: var(--pep-text) !important;
    font-family: var(--pep-serif);
    font-weight: 700;
}

body.peppino-dark .products .product .product_cat,
body.peppino-dark .products .product .posted_in {
    color: var(--pep-text-muted) !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}