/* store.css — cromado de la tienda: anuncio, header, nav, footer, tarjeta de producto, mini-carrito.
   (Las secciones propias de cada pagina viven en store-home.css, store-catalog.css, store-checkout.css, ...) */
.only-mobile,.icon-btn.only-mobile{display:none}
.announce{background:var(--accent-50);color:var(--accent-ink-d);font-size:.8rem;font-weight:600;text-align:center;padding:.5rem 0;border-bottom:1px solid var(--accent-100)}
.announce .container{display:flex;gap:.5rem;align-items:center;justify-content:center}

.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 8px 28px -16px rgba(15,23,42,.25)}
.header-row{display:flex;align-items:center;gap:1.25rem;height:var(--header-h)}
.logo{display:inline-flex;align-items:center;gap:.65rem;flex:none} .logo img{height:40px;width:auto;max-width:180px;object-fit:contain}
.logo-mark{width:38px;height:38px;border-radius:12px;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;box-shadow:0 8px 18px -8px rgba(var(--accent-rgb),.7)}
.logo-text{display:flex;flex-direction:column;line-height:1.1} .logo-text b{font-size:1.15rem;letter-spacing:-.03em} .logo-text small{font-size:.68rem;color:var(--ink-3);font-weight:500}
.search{position:relative;flex:1;max-width:640px;display:flex;align-items:center;background:var(--bg-soft);border:1px solid transparent;border-radius:99px;padding:0 .35rem 0 1rem;transition:all .2s;color:var(--ink-3)}
.search:focus-within{background:#fff;border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12)}
.search input{flex:1;border:0;background:none;height:46px;font:inherit;color:var(--ink);padding:0 .7rem;min-width:0} .search input:focus{outline:none}
.search-btn{width:36px;height:36px;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;cursor:pointer;transition:transform .2s var(--ease)} .search-btn:hover{transform:scale(1.08)}
.suggest{position:absolute;left:0;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:.4rem;z-index:70;animation:scaleIn .2s var(--ease)}
.suggest a{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:var(--radius-sm);color:var(--ink)} .suggest a:hover,.suggest a.on{background:var(--bg-soft)}
.suggest img{width:44px;height:44px;border-radius:10px;object-fit:cover;background:var(--bg-soft)} .suggest b{display:block;font-size:.9rem} .suggest small{color:var(--ink-3)}
.header-actions{display:flex;align-items:center;gap:.25rem;margin-left:auto}
.icon-btn{position:relative;width:44px;height:44px;border-radius:50%;border:0;background:none;display:grid;place-items:center;cursor:pointer;color:var(--ink);transition:background .2s,transform .2s var(--ease)}
.icon-btn:hover{background:var(--bg-muted)} .icon-btn:active{transform:scale(.92)}
.icon-btn .count{position:absolute;top:2px;right:0;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--accent);color:var(--on-accent);font:700 .68rem/19px var(--font);font-style:normal;text-align:center;border:2px solid #fff}
.catnav{border-top:1px solid var(--line);background:#fff} .catnav .container{display:flex;gap:.25rem;overflow-x:auto;scrollbar-width:none;align-items:center}
.catnav a{display:inline-flex;align-items:center;gap:.4rem;padding:.7rem .85rem;font-size:.88rem;font-weight:600;color:var(--ink-2);white-space:nowrap;position:relative;transition:color .2s}
.catnav a::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transition:transform .3s var(--ease);border-radius:2px}
.catnav a:hover,.catnav a.on{color:var(--ink)} .catnav a:hover::after,.catnav a.on::after{transform:scaleX(1)} .catnav .deal{color:var(--danger)} .catnav .aux{color:var(--ink-3);font-weight:500}

.mnav{position:fixed;inset:0;z-index:95;background:rgba(15,23,42,.45);opacity:0;pointer-events:none;transition:opacity .25s} .mnav.on{opacity:1;pointer-events:auto}
.mnav-panel{position:absolute;left:0;top:0;bottom:0;width:min(320px,86vw);background:#fff;padding:1.25rem;transform:translateX(-100%);transition:transform .35s var(--ease);overflow:auto;display:flex;flex-direction:column}
.mnav.on .mnav-panel{transform:none} .mnav-panel>a{padding:.85rem .25rem;border-bottom:1px solid var(--line);font-weight:600}

/* footer */
.site-footer{margin-top:5rem;background:var(--bg-soft);border-top:1px solid var(--line);padding-top:3.5rem}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2.5rem;padding-bottom:2.5rem}
.footer-grid h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin-bottom:1rem}
.footer-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem} .footer-grid li a{color:var(--ink-2);transition:color .15s} .footer-grid li a:hover{color:var(--accent-ink)}
.footer-grid .contact li{display:flex;gap:.5rem;align-items:flex-start;color:var(--ink-2)} .footer-brand p{margin:1rem 0;max-width:34ch}
.social{display:flex;gap:.5rem} .social a{width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-2);transition:all .2s var(--ease)} .social a:hover{background:var(--accent);color:var(--on-accent);border-color:var(--accent);transform:translateY(-3px)}
.footer-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.25rem 20px;border-top:1px solid var(--line);font-size:.84rem;color:var(--ink-3)}
.pay{display:flex;gap:.4rem;flex-wrap:wrap} .pay i{font-style:normal;padding:.2rem .6rem;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:.74rem;font-weight:600;color:var(--ink-2)}
.wa-float{position:fixed;left:18px;bottom:18px;z-index:60;width:54px;height:54px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 12px 28px -8px rgba(37,211,102,.7);animation:pulseDot 2.2s infinite;transition:transform .2s var(--ease)} .wa-float:hover{transform:scale(1.1)}

/* tarjeta de producto */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem}
.pcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s,opacity .8s var(--ease)}
.pcard:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--line-strong)}
.pcard-media{display:block;aspect-ratio:1/1;background:var(--bg-soft);overflow:hidden;position:relative} .pcard-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)} .pcard:hover .pcard-media img{transform:scale(1.07)}
.pcard-badges{position:absolute;left:.7rem;top:.7rem;display:flex;gap:.3rem}
.pcard-wish{position:absolute;right:.6rem;top:.6rem;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.92);display:grid;place-items:center;cursor:pointer;color:var(--ink-2);box-shadow:var(--shadow-sm);transition:all .25s var(--ease)}
.pcard-wish:hover{transform:scale(1.12);color:var(--danger)} .pcard-wish.on{color:var(--danger)} .pcard-wish.on .i{fill:currentColor;animation:pop .4s var(--ease)}
.pcard-body{padding:.9rem 1rem 1rem;display:flex;flex-direction:column;gap:.25rem;flex:1}
.pcard-brand{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:700}
.pcard-name{font-size:.95rem;font-weight:600;margin:0;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;letter-spacing:-.01em} .pcard-name a:hover{color:var(--accent-ink)}
.pcard-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.6rem}
.pcard-price{display:flex;flex-direction:column;line-height:1.25} .pcard-price b{font-size:1.08rem;letter-spacing:-.02em} .pcard-price s{font-size:.8rem;color:var(--ink-3)}
.pcard-add{width:40px;height:40px;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;cursor:pointer;flex:none;box-shadow:0 8px 16px -8px rgba(var(--accent-rgb),.8);transition:transform .25s var(--ease),background .2s} .pcard-add:hover{transform:scale(1.12) rotate(90deg);background:var(--accent-600)}
.pcard-add.done{background:var(--success)}

/* mini carrito */
.mini-lines{list-style:none;margin:0;padding:0;display:grid;gap:1rem} .mini-line{display:flex;gap:.8rem;align-items:flex-start;animation:fadeUp .35s var(--ease)}
.mini-img{width:72px;height:72px;border-radius:12px;overflow:hidden;background:var(--bg-soft);flex:none} .mini-img img{width:100%;height:100%;object-fit:cover}
.mini-name{font-weight:600;font-size:.9rem;display:block;line-height:1.3} .mini-price{font-size:.82rem;color:var(--ink-3);margin:.15rem 0 .4rem}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line-strong);border-radius:99px;overflow:hidden} .stepper button{width:30px;height:30px;border:0;background:none;cursor:pointer;display:grid;place-items:center} .stepper button:hover{background:var(--bg-muted)} .stepper span{min-width:28px;text-align:center;font-weight:600;font-size:.88rem}
.mini-remove{display:block;margin:.5rem 0 0 auto;border:0;background:none;color:var(--ink-3);cursor:pointer;padding:4px} .mini-remove:hover{color:var(--danger)}
.fly{position:fixed;z-index:300;width:54px;height:54px;border-radius:50%;object-fit:cover;pointer-events:none;box-shadow:var(--shadow);transition:transform .75s cubic-bezier(.5,-.2,.6,1),opacity .75s}
.cart-btn.bump{animation:pop .45s var(--ease)}

/* paginas de contenido / breadcrumbs / titulos de seccion */
.crumbs-store{display:flex;gap:.4rem;align-items:center;font-size:.84rem;color:var(--ink-3);padding:1.2rem 0;flex-wrap:wrap} .crumbs-store a:hover{color:var(--accent-ink)}
.section{padding:3rem 0} .section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem} .section-head h2{margin:0}
.section-head .link{color:var(--accent-ink);font-weight:700;font-size:.9rem;display:inline-flex;align-items:center;gap:.3rem} .section-head .link:hover{gap:.6rem}
.page-narrow{max-width:760px;margin:0 auto;padding:2rem 20px 0}
.prose{line-height:1.75;color:var(--ink-2)} .prose h2,.prose h3{color:var(--ink);margin-top:1.8em} .prose img{border-radius:var(--radius)} .prose a{color:var(--accent-ink);text-decoration:underline}
.err-page{min-height:100vh;display:grid;place-items:center;padding:2rem;background:radial-gradient(1200px 500px at 50% -10%,var(--accent-50),transparent)} .err-page.embedded{min-height:58vh} .err-card{text-align:center;max-width:640px;width:100%;min-width:0}
.err-code{font-size:clamp(5rem,16vw,9rem);font-weight:800;letter-spacing:-.06em;line-height:1;color:var(--accent-ink);opacity:.9}
.err-trace{text-align:left;background:var(--bg-soft);padding:1rem;border-radius:var(--radius-sm);overflow:auto;font-size:.75rem;max-height:240px;max-width:100%;white-space:pre-wrap;word-break:break-all}

@media(max-width:900px){
  .only-mobile,.icon-btn.only-mobile{display:grid}.search{display:none}.header-row{gap:.5rem;height:auto;min-height:var(--header-h);flex-wrap:wrap}.catnav{display:none}
  .site-header.search-open .search{display:flex;order:9;flex:1 0 100%;max-width:none;margin:0 0 .65rem;animation:fadeUp .3s var(--ease)} .search input{height:44px}
  .footer-grid{grid-template-columns:1fr 1fr}.pgrid{grid-template-columns:repeat(2,1fr);gap:.8rem}.header-actions{margin-left:auto}
  .logo-text small{display:none}
}
@media(max-width:520px){.hide-xs{display:none!important}.footer-grid{grid-template-columns:1fr}.section{padding:2rem 0}.pcard-body{padding:.7rem .75rem .8rem}}

@media(pointer:coarse){.pcard-wish{width:40px;height:40px}}