
:root{--navy:#020F43;--yellow:#F9C94D;--red:#A51F28;--white:#fff;--text:#17213a;--muted:#707a90;--line:#dfe4ee;--soft:#f6f8fb}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}a{text-decoration:none;color:inherit}button,input,select{font:inherit}.wrap{width:min(1180px,92%);margin:auto}
.top-strip{height:30px;background:var(--navy);color:#fff;overflow:hidden;border-bottom:1px solid #ffffff1a}.ticker-window{height:100%;overflow:hidden}.ticker-track{height:100%;display:flex;width:max-content;animation:tickerMove 25s linear infinite}.ticker-set{display:flex;align-items:center;gap:24px;padding-right:24px;white-space:nowrap;font-size:10px;font-weight:800;letter-spacing:1px}.ticker-set b{color:var(--yellow)}@keyframes tickerMove{to{transform:translateX(-50%)}}
.header{background:var(--navy);color:#fff}.header-main{min-height:78px;display:flex;align-items:center;gap:24px}.brand{width:165px;flex:0 0 165px}.brand img{width:100%;display:block}.search-box{height:46px;display:flex;flex:1;max-width:550px;background:#fff;border-radius:9px;overflow:hidden}.search-box input{flex:1;border:0;outline:0;padding:0 16px;font-size:13px}.search-box button{width:54px;border:0;background:var(--yellow);color:var(--navy);font-size:22px;cursor:pointer}.header-links{display:flex;align-items:center;gap:6px;margin-left:auto}.header-links button{color:#fff;background:transparent;border:0;cursor:pointer;font-size:10px;font-weight:800;display:flex;align-items:center;gap:6px;padding:7px;position:relative}.mode{border:1px solid #ffffff33!important;border-radius:9px!important;background:#ffffff0d!important}.mode:first-child{background:var(--yellow)!important;color:var(--navy)!important}.mode small{display:block;font-size:7px;color:var(--yellow);margin-top:2px}.mode:first-child small{color:var(--navy)}.cart em{position:absolute;right:0;top:0;width:17px;height:17px;background:var(--red);border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:8px}
.nav{background:var(--navy);border-top:1px solid #ffffff18}.nav-row{min-height:48px;display:flex;align-items:center;gap:34px}.nav-row a{font-size:10px;font-weight:800;color:#fff}.all-categories{border:0;background:var(--yellow);color:var(--navy);border-radius:8px;padding:14px 20px;font-size:10px;font-weight:800;cursor:pointer}.all-categories span{float:right;margin-left:20px}.mega-menu{display:none;background:#fff;color:var(--navy);position:absolute;left:0;right:0;z-index:80;box-shadow:0 14px 30px #0002;border-bottom:1px solid var(--line)}.mega-menu.open{display:block}.category-menu-panel{width:min(1180px,92%);margin:auto;padding:16px 0}.category-menu-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.menu-category{border:1px solid var(--line);background:#fff;border-radius:7px;padding:12px;text-align:left;color:var(--navy);font-size:10px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between}.menu-category:hover{border-color:var(--yellow);background:#fffaf0}.category-flyout{margin-top:12px;border-top:1px solid var(--line);padding-top:12px;display:none}.category-flyout.show{display:block}.flyout-title{font-size:13px;font-weight:800;margin-bottom:8px}.flyout-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.flyout-grid button{border:0;background:var(--soft);padding:9px;text-align:left;border-radius:5px;font-size:9px;cursor:pointer;color:var(--navy)}.flyout-grid button:hover{background:var(--yellow)}
.hero{padding:0;background:#fff}.hero-slider{height:500px;width:100%;position:relative;overflow:hidden;background:var(--navy)}.hero-slide{position:absolute;inset:0;opacity:0;background-position:center;background-size:cover;transition:opacity .5s}.hero-slide.active{opacity:1}.hero-one{background-image:linear-gradient(90deg,#020f43cc,#020f4340),url('images/banners/banner-1.jpg')}.hero-two{background-image:linear-gradient(90deg,#020f4399,#020f4322),url('images/banners/banner-2.jpg')}.hero-three{background-image:linear-gradient(90deg,#020f4399,#020f4322),url('images/banners/banner-3.jpg')}.hero-four{background-image:linear-gradient(90deg,#020f4399,#020f4322),url('images/banners/banner-4.jpg')}.hero-caption{position:absolute;left:6%;top:50%;transform:translateY(-50%);max-width:620px;color:#fff}.hero-caption span{display:inline-block;background:var(--red);padding:8px 16px;border-radius:30px;font-size:10px;font-weight:800;letter-spacing:1.4px}.hero-caption h1{font-size:54px;line-height:1;margin:16px 0 10px}.hero-caption p{font-size:17px;line-height:1.5}.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:#020f43cc;color:#fff;font-size:30px;cursor:pointer;z-index:3}.hero-arrow.left{left:18px}.hero-arrow.right{right:18px}.hero-dots{position:absolute;right:25px;bottom:18px;display:flex;gap:7px}.hero-dots button{width:9px;height:9px;border:0;border-radius:50%;background:#fff9;cursor:pointer}.hero-dots button.active{width:24px;border-radius:9px;background:var(--yellow)}.hero-actions{display:flex;justify-content:center;gap:12px;padding:20px 0 30px}.yellow-btn,.outline-btn,.white-btn,.navy-btn{border-radius:8px;padding:13px 20px;font-size:10px;font-weight:800;cursor:pointer;display:inline-block}.yellow-btn{border:1px solid var(--yellow);background:var(--yellow);color:var(--navy)}.outline-btn{border:1px solid var(--navy);background:#fff;color:var(--navy)}.white-btn{border:1px solid #fff;background:#fff;color:var(--navy)}.navy-btn{border:1px solid var(--navy);background:var(--navy);color:#fff}.full{width:100%}
.section,.products-area{padding:55px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.section-head h2{font-size:30px;color:var(--navy);margin:7px 0}.section-head>a{font-size:10px;color:var(--red);font-weight:800}.kicker{font-size:9px;color:var(--red);font-weight:800;letter-spacing:1.7px}.kicker.light{color:var(--yellow)}.category-chips{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.category-chip{min-height:112px;border:1px solid var(--line);border-radius:12px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;cursor:pointer;color:var(--navy);transition:.2s}.category-chip:hover{transform:translateY(-2px);border-color:var(--yellow);box-shadow:0 8px 20px #07154f12}.category-circle{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:900}.category-chip strong{font-size:10px;text-align:center;line-height:1.25}.red{background:#fff0f0;color:var(--red)}.blue{background:#edf2ff;color:#2846a7}.yellow{background:#fff6d8;color:#b27b00}.green{background:#eaf8ef;color:#21844a}.purple{background:#f2ecff;color:#7441bd}.orange{background:#fff0df;color:#c46512}.pink{background:#ffedf5;color:#c33a77}
.products-area{background:#f7f8fb}.products-head{align-items:center}.sort{display:flex;align-items:center;gap:10px;font-size:10px}.sort select{border:1px solid #ccd4e2;background:#fff;border-radius:7px;padding:10px 30px 10px 12px;color:var(--navy)}.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.product{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}.product-img{aspect-ratio:1/1;height:auto;background:#edf0f5}.product-img img{width:100%;height:100%;object-fit:cover;display:block}.product-info{padding:14px}.product-info small{font-size:8px;color:var(--red);font-weight:800}.product-info h3{font-size:13px;line-height:1.35;margin:7px 0;color:var(--navy)}.price{font-size:17px;color:var(--red);font-weight:800}.add-cart{width:100%;margin-top:10px;border:0;background:var(--navy);color:#fff;border-radius:6px;padding:11px;font-size:9px;font-weight:800;cursor:pointer}.subcategory-row{display:flex;gap:7px;overflow:auto;margin-bottom:16px}.subcategory-row button{border:1px solid var(--line);background:#fff;color:var(--navy);padding:8px 11px;border-radius:20px;font-size:9px;white-space:nowrap;cursor:pointer}.subcategory-row button.active{background:var(--yellow);border-color:var(--yellow)}
.delivery-section{background:var(--navy);color:#fff;padding:50px 0}.delivery-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.delivery-inner h2{font-size:28px;margin:7px 0;color:#fff}.delivery-inner p{font-size:11px;color:#cbd4e7}.delivery-choice{display:flex;gap:10px}
.about-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:17px}.about-main{background:var(--navy);color:#fff;border-radius:11px;padding:25px}.about-main h3{font-size:18px;margin:0 0 10px}.about-main p,.about-card p{font-size:11px;line-height:1.8;color:var(--muted)}.about-main p{color:#dbe2f0}.value{margin-top:22px;border-left:3px solid var(--yellow);padding-left:12px;display:flex;flex-direction:column;gap:5px}.value strong{font-size:9px;color:var(--yellow)}.value span{font-size:10px}.about-card{border:1px solid var(--line);border-radius:11px;padding:23px}.about-card h3{margin:0;color:var(--navy);font-size:15px}
.location-section{background:var(--soft);padding:58px 0}.location-inner{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:center}.location-inner h2{font-size:30px;color:var(--navy);margin:7px 0}.location-inner p{font-size:11px;line-height:1.7;color:var(--muted)}.address{font-size:14px!important;color:var(--navy)!important}.map-card{height:245px;border-radius:12px;background:#e6eaf0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--navy);padding:20px}.map-card strong{font-size:15px}.map-card p{margin:7px 0;color:var(--navy)}
.footer{background:var(--navy);color:#fff;padding-top:44px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:35px;padding-bottom:35px}.footer-logo{width:150px}.footer p,.footer a{display:block;font-size:10px;line-height:1.9;color:#aeb8cd}.footer h3{font-size:10px;letter-spacing:1px}.socials{display:flex;gap:8px}.socials a{width:34px;height:34px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;font-size:11px;font-weight:800}.footer-bottom{border-top:1px solid #ffffff14;padding:14px;text-align:center;font-size:9px;color:#8e9ab1}
.modal{display:none;position:fixed;inset:0;background:#020f43aa;z-index:100;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.dialog{width:min(510px,100%);background:#fff;border-radius:12px;padding:28px;position:relative}.modal-close{position:absolute;right:12px;top:8px;border:0;background:none;font-size:27px;color:#778095;cursor:pointer}.dialog h2{font-size:22px;color:var(--navy);margin:7px 0}.dialog p{font-size:10px;color:var(--muted);line-height:1.7}.address-row{display:flex;gap:7px;margin:10px 0}.address-row input{flex:1;border:1px solid var(--line);border-radius:6px;padding:11px;font-size:10px;outline:0}.location-status{font-size:9px;color:var(--muted);padding:10px 0;min-height:30px}.whatsapp-float{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;text-decoration:none;z-index:9999;box-shadow:0 5px 18px #0004;font-size:11px;font-weight:900;border:3px solid #fff}.toast{position:fixed;right:20px;bottom:20px;background:var(--navy);color:#fff;padding:12px 17px;border-radius:7px;font-size:10px;z-index:200}
.category-page,.checkout-page{padding:45px 0;background:var(--soft);min-height:60vh}.breadcrumb{font-size:10px;color:var(--muted);margin-bottom:20px}.category-page-head{display:flex;justify-content:space-between;align-items:end;gap:20px}.category-page-head h1{font-size:36px;color:var(--navy);margin:7px 0}.category-subnav{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0 25px}.category-subnav button{border:1px solid var(--line);background:#fff;border-radius:20px;padding:8px 11px;font-size:9px;cursor:pointer}.category-subnav button.active{background:var(--yellow);border-color:var(--yellow)}.category-products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category-empty{padding:40px;background:#fff;border:1px solid var(--line);border-radius:10px;color:var(--muted);grid-column:1/-1}.checkout-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:20px}.checkout-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:25px}.checkout-card h1,.checkout-card h2{color:var(--navy)}.checkout-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.checkout-mode{border:1px solid var(--line);background:#fff;border-radius:10px;padding:15px;text-align:left;cursor:pointer;color:var(--navy)}.checkout-mode.active{border-color:var(--yellow);box-shadow:0 0 0 2px #f9c94d55}.checkout-mode strong,.checkout-mode small{display:block}.checkout-mode small{font-size:9px;color:var(--muted);margin-top:5px}.checkout-card label{display:block;font-size:10px;font-weight:700;color:var(--navy);margin-top:12px}.checkout-card input{width:100%;margin-top:6px;padding:11px;border:1px solid var(--line);border-radius:7px}.cart-line{display:grid;grid-template-columns:1fr auto auto;gap:15px;align-items:center;border-bottom:1px solid var(--line);padding:12px 0;font-size:10px}.cart-line small{display:block;color:var(--muted)}.cart-qty{display:flex;gap:8px;align-items:center}.cart-qty button{border:1px solid var(--line);background:#fff;border-radius:5px;width:28px;height:28px}.cart-total{display:flex;justify-content:space-between;padding-top:16px;font-size:14px;color:var(--navy)}
@media(max-width:1000px){.header-main{flex-wrap:wrap;padding:10px 0}.search-box{order:3;max-width:none;flex-basis:100%}.category-chips{grid-template-columns:repeat(4,1fr)}.products-grid,.category-products-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.about-grid{grid-template-columns:1fr 1fr}.checkout-grid{grid-template-columns:1fr}.category-menu-list{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.top-strip{height:28px}.header-main{gap:10px;padding:8px 0}.brand{width:125px;flex-basis:125px}.header-links{width:100%;justify-content:space-between;gap:2px}.header-links button{font-size:8px;padding:6px}.search-box{height:42px}.nav-row{gap:14px;overflow:auto;white-space:nowrap}.all-categories{padding:12px 14px}.mega-menu{max-height:75vh;overflow:auto}.category-menu-list{grid-template-columns:1fr 1fr}.flyout-grid{grid-template-columns:1fr 1fr}.hero-slider{height:330px}.hero-caption{left:7%;max-width:78%}.hero-caption h1{font-size:33px}.hero-caption p{font-size:12px}.hero-actions{padding:15px 10px 25px}.hero-actions a{flex:1;text-align:center}.section,.products-area{padding:38px 0}.section-head{align-items:flex-start}.section-head h2{font-size:24px}.category-chips{grid-template-columns:1fr 1fr;gap:9px}.category-chip{min-height:105px}.products-grid,.category-products-grid{grid-template-columns:1fr 1fr;gap:10px}.product-img{aspect-ratio:1/1;height:auto}.product-info{padding:10px}.product-info h3{font-size:11px}.price{font-size:15px}.add-cart{font-size:8px;padding:10px 4px}.delivery-inner,.location-inner,.about-grid{grid-template-columns:1fr}.delivery-choice{flex-direction:column}.delivery-choice button{width:100%}.footer-grid{grid-template-columns:1fr}.checkout-modes{grid-template-columns:1fr}.category-page-head{align-items:flex-start;flex-direction:column}.whatsapp-float{width:54px;height:54px;right:14px;bottom:14px}.cart-line{grid-template-columns:1fr auto}.cart-line>strong:last-child{grid-column:1/-1}.dialog{padding:20px}.address-row{flex-direction:column}}


/* V16: presentación limpia de categorías en inicio */
.featured-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.featured-category-card{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  padding:18px;
  transition:.2s;
}
.featured-category-card:hover{
  border-color:var(--yellow);
  box-shadow:0 8px 22px #07154f12;
  transform:translateY(-2px);
}
.featured-category-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:13px;
}
.featured-category-head .category-circle{width:44px;height:44px;flex:0 0 44px}
.featured-category-head strong{font-size:13px;color:var(--navy)}
.featured-subcats{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.featured-subcats button{
  border:1px solid var(--line);
  background:var(--soft);
  color:var(--navy);
  border-radius:18px;
  padding:7px 9px;
  font-size:9px;
  cursor:pointer;
}
.featured-subcats button:hover{background:var(--yellow);border-color:var(--yellow)}
.featured-category-link{
  display:inline-block;
  margin-top:12px;
  font-size:9px;
  color:var(--red);
  font-weight:800;
}
.featured-category-note{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid var(--line);
  font-size:10px;
  color:var(--muted);
}
.featured-category-note .outline-btn{padding:10px 14px}
.featured-products-note{
  margin:-8px 0 18px;
  font-size:10px;
  color:var(--muted);
}
.product-img{
  background:#f1f3f7;
  display:flex;
  align-items:center;
  justify-content:center;
}
.product-img img{
  object-fit:contain;
  background:#f1f3f7;
}
.whatsapp-float{
  font-size:0;
}
.whatsapp-float svg{
  width:32px;
  height:32px;
  display:block;
}
@media(max-width:1000px){
  .featured-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:650px){
  .featured-category-grid{grid-template-columns:1fr}
  .featured-category-note{align-items:stretch;flex-direction:column}
  .featured-category-note .outline-btn{width:100%;text-align:center}
  .featured-subcats button{font-size:8px}
  .product-img{aspect-ratio:1/1;height:auto}
}


/* V17 — Todas las categorías + subcategorías debajo de cada una */
.mega-menu{
  max-height:calc(100vh - 115px);
  overflow:auto;
}
.category-menu-panel{
  padding:18px 0 24px;
}
.category-menu-list{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.menu-category-card{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  overflow:hidden;
}
.menu-category-title{
  width:100%;
  border:0;
  border-bottom:1px solid var(--line);
  background:#fff;
  color:var(--navy);
  padding:13px 14px;
  text-align:left;
  font-size:11px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
}
.menu-category-title:hover{
  background:#fffaf0;
}
.menu-arrow{
  color:var(--red);
  font-size:15px;
}
.menu-subcategories{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  padding:10px;
  background:#fafbfc;
}
.menu-subcategory{
  border:1px solid #e2e6ee;
  background:#fff;
  color:#26345b;
  border-radius:14px;
  padding:6px 8px;
  font-size:8px;
  line-height:1.2;
  cursor:pointer;
}
.menu-subcategory:hover{
  background:var(--yellow);
  border-color:var(--yellow);
  color:var(--navy);
}
.category-flyout{
  display:none!important;
}
@media(max-width:1000px){
  .category-menu-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:650px){
  .mega-menu{max-height:78vh}
  .category-menu-list{grid-template-columns:1fr;gap:9px}
  .menu-category-title{font-size:11px;padding:12px}
  .menu-subcategory{font-size:8px;padding:7px 9px}
}


/* V18 — menú desplegable tipo referencia: lista izquierda + submenú derecho */
.mega-menu{
  display:none;
  position:absolute;
  left:0;
  right:0;
  top:100%;
  z-index:1000;
  background:#fff;
  border-top:1px solid #e4e7ee;
  box-shadow:0 12px 30px rgba(0,0,0,.16);
}
.mega-menu.open{display:block}
.category-menu-panel{
  width:min(1180px,92%);
  margin:0 auto;
  padding:0;
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
  min-height:430px;
}
.category-menu-list{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:8px 0;
  border-right:1px solid #e3e6ed;
  background:#fff;
}
.menu-category{
  width:100%;
  min-height:44px;
  border:0;
  border-radius:0;
  background:#fff;
  color:var(--navy);
  padding:11px 16px;
  text-align:left;
  font-size:11px;
  font-weight:600;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.menu-category:hover,
.menu-category.active{
  background:#f5f6f8;
  color:var(--navy);
}
.menu-category.active{
  font-weight:800;
  border-left:3px solid var(--yellow);
  padding-left:13px;
}
.menu-arrow{
  color:#111;
  font-size:18px;
  line-height:1;
}
.category-flyout{
  display:none;
  margin:0;
  border:0;
  padding:28px 30px;
  background:#fff;
}
.category-flyout.show{display:block}
.flyout-title{
  font-size:18px;
  font-weight:800;
  color:var(--navy);
  margin:0 0 18px;
}
.flyout-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px 12px;
}
.flyout-grid button,
.flyout-subcategory{
  border:0;
  background:#f6f7f9;
  color:#26345b;
  padding:10px 12px;
  text-align:left;
  border-radius:5px;
  font-size:10px;
  cursor:pointer;
}
.flyout-grid button:hover,
.flyout-subcategory:hover{
  background:#fff3c7;
  color:var(--navy);
}
@media(max-width:800px){
  .category-menu-panel{
    grid-template-columns:1fr;
    max-height:75vh;
    overflow:auto;
  }
  .category-menu-list{
    border-right:0;
    border-bottom:1px solid #e3e6ed;
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .menu-category{min-height:40px}
  .category-flyout{
    padding:18px 15px;
  }
}
@media(max-width:520px){
  .category-menu-list{grid-template-columns:1fr}
  .flyout-grid{grid-template-columns:1fr}
}


/* V19 — corrección: botón TODAS LAS CATEGORÍAS abre realmente el mega menú */
.nav{position:relative;z-index:2000}
.mega-menu{position:absolute;left:0;right:0;top:100%;z-index:3000}
.mega-menu.open{display:block!important}
.category-menu-panel{position:relative;z-index:3001}
.category-flyout{min-width:0}


/* V20 — corrección definitiva del mega menú */
.mega-menu.open{display:block!important;}
.category-menu-panel{
  display:grid!important;
  grid-template-columns:300px minmax(0,1fr)!important;
  align-items:stretch!important;
  padding:0!important;
  width:min(1180px,92%)!important;
  margin:0 auto!important;
  min-height:420px!important;
}
.category-menu-list{
  display:flex!important;
  flex-direction:column!important;
  flex-wrap:nowrap!important;
  grid-template-columns:none!important;
  gap:0!important;
  padding:8px 0!important;
  border-right:1px solid #e3e6ed!important;
  overflow-y:auto!important;
  max-height:520px!important;
}
.menu-category{
  flex:0 0 44px!important;
  width:100%!important;
  min-height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  white-space:normal!important;
}
.category-flyout{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  margin:0!important;
  padding:28px 30px!important;
  border:0!important;
  background:#fff!important;
  min-width:0!important;
}
.category-flyout .flyout-title{
  display:block!important;
  color:#06144f!important;
  margin:0 0 18px!important;
}
.category-flyout .flyout-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:9px 12px!important;
}
.category-flyout .flyout-subcategory{
  display:block!important;
  width:100%!important;
  min-height:36px!important;
}
@media(max-width:800px){
  .category-menu-panel{
    grid-template-columns:1fr!important;
    max-height:78vh!important;
    overflow:auto!important;
  }
  .category-menu-list{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    flex-direction:initial!important;
    border-right:0!important;
    border-bottom:1px solid #e3e6ed!important;
    max-height:none!important;
  }
  .category-flyout{
    display:block!important;
    padding:18px 15px!important;
  }
}
@media(max-width:520px){
  .category-menu-list{grid-template-columns:1fr!important}
  .category-flyout .flyout-grid{grid-template-columns:1fr!important}
}


/* =========================================================
   V21 — CORRECCIÓN DE LAYOUT
   1) El mega menú queda por encima del contenido.
   2) La sección "Compra por categoría" vuelve a ser una
      cuadrícula horizontal, no una columna.
   3) El slider y el menú no quedan tapados.
   ========================================================= */

/* Header/menu siempre encima del contenido */
.site-header,
header,
.nav,
.main-nav,
.mega-menu{
  position:relative;
  z-index:5000;
}
.mega-menu{
  position:absolute !important;
  z-index:6000 !important;
}

/* Evitar que una sección con transform/overflow cree una capa
   por encima del menú */
.hero,
.hero-slider,
.slider,
main,
section{
  z-index:1;
}

/* ---------- Categorías destacadas ---------- */
.featured-categories,
.categories-section,
.category-showcase,
.buy-category-section{
  width:100%;
  overflow:visible;
}

.featured-categories .category-grid,
.categories-section .category-grid,
.category-showcase .category-grid,
.buy-category-section .category-grid,
.featured-categories .categories-grid,
.categories-section .categories-grid,
.category-showcase .categories-grid{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:12px !important;
  width:100% !important;
  align-items:stretch !important;
}

.featured-categories .category-card,
.categories-section .category-card,
.category-showcase .category-card,
.buy-category-section .category-card{
  width:auto !important;
  min-width:0 !important;
  height:116px !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Mantener los iconos circulares */
.featured-categories .category-icon,
.categories-section .category-icon,
.category-showcase .category-icon,
.buy-category-section .category-icon{
  width:50px !important;
  height:50px !important;
  min-width:50px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 auto 9px !important;
}

/* El contenedor de categorías no debe convertirse en columna */
.featured-categories .category-grid > *,
.categories-section .category-grid > *,
.category-showcase .category-grid > *,
.buy-category-section .category-grid > *,
.featured-categories .categories-grid > *,
.categories-section .categories-grid > *,
.category-showcase .categories-grid > *{
  position:relative;
  width:auto !important;
}

/* Responsive */
@media(max-width:1050px){
  .featured-categories .category-grid,
  .categories-section .category-grid,
  .category-showcase .category-grid,
  .buy-category-section .category-grid,
  .featured-categories .categories-grid,
  .categories-section .categories-grid,
  .category-showcase .categories-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}
@media(max-width:700px){
  .featured-categories .category-grid,
  .categories-section .category-grid,
  .category-showcase .category-grid,
  .buy-category-section .category-grid,
  .featured-categories .categories-grid,
  .categories-section .categories-grid,
  .category-showcase .categories-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* El menú desplegable tiene dos zonas: categorías izquierda,
   subcategorías derecha. */
.mega-menu.open{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}
.category-menu-panel{
  display:grid !important;
  grid-template-columns:300px minmax(0,1fr) !important;
  width:min(1180px,92%) !important;
  margin:0 auto !important;
}
.category-menu-list{
  display:flex !important;
  flex-direction:column !important;
  grid-column:1 !important;
}
.category-flyout{
  display:block !important;
  grid-column:2 !important;
  min-width:0 !important;
}
@media(max-width:800px){
  .category-menu-panel{
    grid-template-columns:1fr !important;
  }
  .category-menu-list{
    grid-column:1 !important;
  }
  .category-flyout{
    grid-column:1 !important;
  }
}


/* FINAL — sección Compra por categoría: limpia, horizontal y funcional */
.featured-category-grid{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:12px !important;
  width:100% !important;
}
.featured-category-card{
  width:100% !important;
  min-width:0 !important;
  min-height:112px !important;
  border:1px solid var(--line) !important;
  border-radius:12px !important;
  background:#fff !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  padding:12px !important;
  cursor:pointer !important;
  color:var(--navy) !important;
}
.featured-category-card:hover{border-color:var(--yellow) !important;box-shadow:0 8px 20px #07154f12;transform:translateY(-2px)}
.featured-category-card .category-circle{width:52px !important;height:52px !important;border-radius:50% !important;display:grid !important;place-items:center !important;flex:0 0 52px !important}
.featured-category-card strong{font-size:10px !important;text-align:center !important;line-height:1.25 !important}

/* FINAL — mega menú exactamente: izquierda categorías / derecha subcategorías */
.nav{position:relative !important;z-index:9000 !important}
.mega-menu{position:absolute !important;top:100% !important;left:0 !important;right:0 !important;z-index:10000 !important;background:#fff !important}
.category-menu-panel{display:grid !important;grid-template-columns:300px minmax(0,1fr) !important;width:min(1180px,92%) !important;min-height:420px !important}
.category-menu-list{display:flex !important;flex-direction:column !important;grid-column:1 !important;gap:0 !important}
.category-flyout{display:block !important;grid-column:2 !important;margin:0 !important;border-top:0 !important;border-left:1px solid var(--line) !important;padding:28px 30px !important}
.flyout-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.menu-category{width:100% !important;border:0 !important;border-bottom:1px solid #eef0f4 !important;border-radius:0 !important;background:#fff !important;min-height:42px !important;padding:11px 15px !important}

/* Portada de categoría (gestionada desde el panel de administrador) */
.category-hero{position:relative;aspect-ratio:4/1;min-height:150px;border-radius:14px;background:var(--navy);background-size:cover;background-position:center;display:flex;align-items:center;padding:24px 28px;margin-bottom:22px;overflow:hidden}
.category-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#020f43cc,#020f4340)}
.category-hero-inner{position:relative;color:#fff;max-width:640px}
.category-hero-inner span{display:inline-block;background:var(--red);padding:6px 14px;border-radius:30px;font-size:9px;font-weight:800;letter-spacing:1px}
.category-hero-inner h2{font-size:24px;margin:10px 0 6px;color:#fff}
.category-hero-inner p{font-size:12px;color:#dbe2f0;line-height:1.6;margin:0}

/* Imagen de categoría subida desde el panel (reemplaza al ícono) */
.category-circle.has-image,.menu-category-icon.has-image{overflow:hidden;padding:0;background:#eef0f6}
.category-circle.has-image img,.menu-category-icon.has-image img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}

/* Producto agotado / inactivo (gestionado desde el panel de administrador) */
.product-img{position:relative}
.stock-badge{position:absolute;top:8px;left:8px;z-index:2;background:var(--red);color:#fff;font-size:8px;font-weight:800;letter-spacing:.5px;padding:5px 9px;border-radius:20px}
.product.out-of-stock .product-img img{filter:grayscale(1);opacity:.55}
.product.out-of-stock .add-cart{background:#c7ccd6;cursor:not-allowed}
.product.out-of-stock h3,.product.out-of-stock .price{opacity:.6}
.menu-category.active,.menu-category:hover{background:#f6f7f9 !important;border-left:3px solid var(--yellow) !important;padding-left:12px !important}
@media(max-width:1050px){
 .featured-category-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
}
@media(max-width:700px){
 .featured-category-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
 .category-menu-panel{grid-template-columns:1fr !important;max-height:75vh !important;overflow:auto !important}
 .category-menu-list{grid-column:1 !important}
 .category-flyout{grid-column:1 !important;border-left:0 !important;border-top:1px solid var(--line) !important;padding:18px !important}
 .flyout-grid{grid-template-columns:1fr !important}
}


/* Categorías: iconos Font Awesome en lugar de texto/emojis */
.featured-category-head .category-circle,
.featured-category-card .category-circle{
  font-size:20px !important;
  line-height:1;
}
.featured-category-card .category-circle i{
  display:block;
  line-height:1;
}

/* Iconos de categorías: SVG local, sin dependencia de emojis ni CDN */
.category-svg{width:24px;height:24px;display:block;stroke:currentColor;fill:none;}
.featured-category-card .category-circle .category-svg{width:25px;height:25px;}
.menu-category-icon .category-svg{width:17px;height:17px;}
.menu-category-icon{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);}
