@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@font-face{font-family:UnboundedCompacta;src:url(unbounded-extrabold.woff) format("woff");font-weight:400;font-style:normal;font-display:swap;size-adjust:72%}
/* SITIO NUEVO · el encabezado y el pie del inicio nuevo, en todas las páginas de la tienda.
   - Encabezado: lo carga header-tools.js (agrega la clase "sitio-nuevo" al <body>). En el inicio no hace nada,
     porque el inicio ya tiene el suyo en inicio-nuevo.css (fijo arriba y con animaciones).
   - En las demás páginas el encabezado NO se queda fijo, para no tapar la galería de las fichas, el índice del álbum
     ni el estudio de fundas. Al bajar se va con la página, como siempre.
   - Pie: lo carga footer.js (agrega la clase "pie-nuevo" al pie).
   Para quitarlo: borra este archivo y las líneas marcadas "SITIO NUEVO" en header-tools.js y footer.js. */

/* ---------- Fondo hueso en toda la página (como el inicio) ---------- */
html:has(body.sitio-nuevo),html body.sitio-nuevo,html body.sitio-nuevo main{background:#eeede8!important}
html body.sitio-nuevo section.catalog,html body.sitio-nuevo main.product-page{background:transparent!important}
html body.sitio-nuevo .album-sheet{background:#f7f6f2!important}
html body.sitio-nuevo #album-page{background:transparent!important}
html body.sitio-nuevo .al-ixhead{background:#eeede8!important}
html body.sitio-nuevo .card-info,html body.sitio-nuevo button.quick-add{background:transparent!important}
html body.sitio-nuevo img.main-photo{background:#f7f6f2!important;border-radius:20px}
html body.sitio-nuevo .store-nav-dropdown-panel{background:#f7f6f2!important}

/* ---------- Encabezado ---------- */
html body.sitio-nuevo header.topbar{background:#eeede8!important;color:#151412!important;border:0!important;box-shadow:none!important}
html body.sitio-nuevo header.topbar .brand img{content:url('logo-peyote.webp')!important;filter:none!important;opacity:1!important}
html body.sitio-nuevo header.topbar *,html body.sitio-nuevo .store-nav a{text-shadow:none!important}
html body.sitio-nuevo header.topbar a,html body.sitio-nuevo header.topbar button{color:#151412!important}
html body.sitio-nuevo header.topbar .menu-icon i{background:#151412!important}
html body.sitio-nuevo header.topbar [data-cart-count]{background:#ff8346!important;color:#151412!important;border:0!important}
html body.sitio-nuevo .store-nav{background:#eeede8!important;border:0!important;border-bottom:1px solid #d9d6cd!important}
html body.sitio-nuevo .store-nav>a,html body.sitio-nuevo .store-nav>.store-nav-dropdown>a{color:#151412!important;font:700 14px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
html body.sitio-nuevo .store-nav a.store-nav-collection{padding:8px 13px!important;border:0!important;border-radius:999px!important;background:#ff8346!important;color:#151412!important;font:700 14px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;text-transform:none!important;box-shadow:none!important;transform:none!important}
html body.sitio-nuevo .store-nav a.store-nav-collection:hover{background:#151412!important;color:#fff!important}
html body.sitio-nuevo .store-nav a:focus-visible,html body.sitio-nuevo header.topbar a:focus-visible,html body.sitio-nuevo header.topbar button:focus-visible{outline:3px solid #ff8346;outline-offset:3px}

/* ---------- Pie de página ---------- */
html body .site-footer.pie-nuevo{background:#151412!important;color:#e9e6de!important;padding:56px 5vw calc(28px + env(safe-area-inset-bottom,0px))!important}
html body .site-footer.pie-nuevo .footer-size-cta{border:1px solid #3a3732!important;border-radius:16px!important;padding:18px 22px!important;color:#e9e6de!important;transition:border-color .2s}
html body .site-footer.pie-nuevo .footer-size-cta:hover{border-color:#ff8346!important}
html body .site-footer.pie-nuevo .footer-size-cta span{color:#a39e94!important;font:600 15px Raleway,Arial,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
html body .site-footer.pie-nuevo .footer-size-cta strong{font:400 22px/1 UnboundedCompacta,Impact,"Arial Narrow",sans-serif!important;letter-spacing:.01em!important;text-transform:uppercase!important}
html body .site-footer.pie-nuevo .footer-size-cta b{color:#ff8346!important}
html body .site-footer.pie-nuevo h3{margin:0 0 14px!important;color:#fff!important;font:400 18px/1 UnboundedCompacta,Impact,"Arial Narrow",sans-serif!important;letter-spacing:.02em!important;text-transform:uppercase!important}
html body .site-footer.pie-nuevo nav a{color:#cfcbc2!important;font:600 14.5px/1.3 Raleway,Arial,sans-serif!important}
html body .site-footer.pie-nuevo nav a:hover{color:#fff!important;text-decoration:underline;text-underline-offset:3px}
html body .site-footer.pie-nuevo .footer-brand p,html body .site-footer.pie-nuevo .footer-contact p{color:#a39e94!important;font:500 14.5px/1.5 Raleway,Arial,sans-serif!important}
html body .site-footer.pie-nuevo .footer-brand p:first-of-type{color:#e9e6de!important}
html body .site-footer.pie-nuevo .footer-wa{border:0!important;border-radius:999px!important;background:#ff8346!important;color:#151412!important;padding:12px 16px!important;font:800 14px/1 Raleway,Arial,sans-serif!important;letter-spacing:0!important;transition:transform .2s}
html body .site-footer.pie-nuevo .footer-wa:hover{transform:translateY(-2px)}
html body .site-footer.pie-nuevo .social-links a{border-color:#3a3732!important;transition:background .2s}
html body .site-footer.pie-nuevo .social-links a:hover{background:#2a2825!important}
html body .site-footer.pie-nuevo .footer-bottom{border-top-color:#34312c!important}
html body .site-footer.pie-nuevo .footer-legal a,html body .site-footer.pie-nuevo .footer-bottom>p{color:#8f8a80!important;font:600 13px/1.4 Raleway,Arial,sans-serif!important}
html body .site-footer.pie-nuevo .footer-legal a:hover{color:#fff!important}
html body .site-footer.pie-nuevo .payment-marks .pm{border-radius:7px!important}
html body .site-footer.pie-nuevo a:focus-visible{outline:3px solid #ff8346;outline-offset:3px}

/* ---------- Catálogo y categorías (catálogo, ligas, selecciones, mujeres, retros, niños, shorts, fundas) ---------- */
html body.sitio-nuevo .catalog-head h2,html body.sitio-nuevo .catalog-head #catalog-title{font:400 clamp(48px,6.6vw,104px)/.88 UnboundedCompacta,Impact,"Arial Narrow",sans-serif!important;letter-spacing:0!important;text-transform:uppercase!important}
html body.sitio-nuevo .catalog-head .eyebrow{color:#ff8346!important;font:700 12px/1 Raleway,Arial,sans-serif!important;letter-spacing:.08em!important}
html body.sitio-nuevo .catalog-head .cr-lead{font:600 16px/1.5 Raleway,Arial,sans-serif!important}
html body.sitio-nuevo .catalog-head{border-radius:0 0 28px 28px;overflow:hidden}
html body.sitio-nuevo .products .card .product-photo{border-radius:20px!important;background:#f7f6f2!important;overflow:hidden}
html body.sitio-nuevo .products .card .product-photo img{transition:transform .5s cubic-bezier(.2,.8,.2,1)!important}
html body.sitio-nuevo .products .card:hover .product-photo img{transform:rotate(-3deg) scale(1.05)}
html body.sitio-nuevo .products .card [data-add],html body.sitio-nuevo .products .card .quick-add{border-radius:999px!important;border:1.5px solid #151412!important;transition:background .2s,color .2s,transform .2s!important}
html body.sitio-nuevo .products .card [data-add]:hover,html body.sitio-nuevo .products .card .quick-add:hover{background:#151412!important;color:#eeede8!important;transform:translateY(-1px)}
html body.sitio-nuevo .products .card [data-add].added{background:#ff8346!important;border-color:#ff8346!important;color:#151412!important}
/* Las tarjetas aparecen escalonadas al cargar y al filtrar (catalogo-nuevo.js les pone la clase) */
html body.sitio-nuevo .products .card.sn-in{animation:sn-card .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--sn-i,0) * 55ms)}
@keyframes sn-card{from{opacity:0;transform:translateY(26px)}}
@media(prefers-reduced-motion:reduce){html body.sitio-nuevo .products .card.sn-in{animation:none}html body.sitio-nuevo .products .card:hover .product-photo img{transform:none}}