:root{--navy:#001233;--coral:#FF595A;--beige:#CAC0B3;--bg:#fff;--ink:#14202e}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#f7f3ee}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.header{position:sticky;top:0;z-index:50;background:var(--navy);color:#fff;display:flex;align-items:center;gap:16px;padding:10px 18px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px}.logo img{height:56px;width:auto;background:#fff;border-radius:10px;padding:4px}.logo span{font-weight:900;letter-spacing:.5px;line-height:1}.logo small{display:block;font-size:10px;letter-spacing:3px;color:var(--beige)}.logo b{color:var(--coral)}
.search{flex:1;min-width:220px;display:flex;background:#fff;border-radius:999px;overflow:hidden}.search span{padding:10px 0 10px 14px}.search input{flex:1;border:0;outline:0;padding:11px;font-size:15px}.search button{background:var(--coral);color:#fff;border:0;padding:0 18px;font-weight:800;cursor:pointer}
.nav{display:flex;gap:16px;font-weight:700}.nav a:hover{color:var(--coral)}
.cart-btn{background:var(--coral);color:#fff;border:0;border-radius:999px;padding:11px 16px;cursor:pointer;font-weight:800}.cart-btn span{background:#fff;color:var(--navy);border-radius:999px;padding:2px 8px;margin:0 4px}
.burger{display:none;background:transparent;color:#fff;border:1px solid #fff;border-radius:8px;font-size:22px;cursor:pointer}
.topbar{background:var(--coral);color:#fff;text-align:center;padding:8px;font-size:13px;font-weight:700}
.hero{position:relative;overflow:hidden;background:var(--navy)}.hero-track{display:flex;transition:transform .5s ease}.slide{min-width:100%;position:relative;height:420px}.slide img{width:100%;height:100%;object-fit:cover;opacity:.92}.slide-text{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 8%;color:#fff;max-width:640px;text-shadow:0 2px 20px rgba(0,0,0,.6)}.pill{background:var(--coral);padding:6px 12px;border-radius:999px;font-weight:900;font-size:12px;letter-spacing:1px;width:fit-content}.slide-text h1{font-size:52px;line-height:.95;margin:14px 0}.btn{background:var(--coral);color:#fff;padding:13px 22px;border-radius:999px;font-weight:900;display:inline-block;width:fit-content;border:0;cursor:pointer}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.9);border:0;width:44px;height:44px;border-radius:50%;font-size:28px;cursor:pointer}.prev{left:12px}.next{right:12px}.dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px}.dots button{width:10px;height:10px;border-radius:50%;border:0;background:#fff;opacity:.5;cursor:pointer}.dots button.active{opacity:1;background:var(--coral)}
.section{padding:42px 5%}.beige{background:var(--beige)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px}.eyebrow{color:var(--coral);font-weight:900;letter-spacing:2px;font-size:12px}.section h2{margin:4px 0 0;font-size:32px}
.carousel{display:flex;gap:18px;overflow-x:auto;scroll-behavior:smooth;padding:20px 2px;scroll-snap-type:x mandatory}.carousel::-webkit-scrollbar{height:6px}.carousel::-webkit-scrollbar-thumb{background:var(--beige);border-radius:99px}
.carousel-btns button,.filters button{cursor:pointer}.carousel-btns button{width:42px;height:42px;border-radius:50%;border:1px solid #ddd;background:#fff;font-size:24px}
.card{min-width:250px;max-width:250px;scroll-snap-align:start;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.08);position:relative}.card img{height:210px;width:100%;object-fit:cover}.card-body{padding:14px}.ribbon{position:absolute;top:12px;left:12px;background:var(--coral);color:#fff;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:900}.ribbon.nuevo{background:var(--navy)}.ribbon.oferta{background:#111}.cat{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#888}.card h3{margin:4px 0;font-size:17px}.stars{color:#f5a623;font-size:13px}.price{margin:8px 0}.old{text-decoration:line-through;color:#999;margin-right:8px}.now{font-size:20px;font-weight:900;color:var(--navy)}.add{width:100%;background:var(--navy);color:#fff;border:0;padding:11px;border-radius:10px;font-weight:800;cursor:pointer}.add:hover{background:var(--coral)}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.filters button{padding:10px 18px;border-radius:999px;border:1px solid #ddd;background:#fff;font-weight:700}.filters button.active{background:var(--navy);color:#fff}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.grid .card{min-width:0;max-width:none}.results{color:#666}.empty{background:#fff;padding:20px;border-radius:12px;text-align:center}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0 5% 42px;text-align:center;font-weight:800}.benefits div{background:#fff;padding:16px;border-radius:14px}
footer{background:var(--navy);color:#fff;text-align:center;padding:28px 16px;line-height:1.7}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;z-index:60}.overlay.show{display:block}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(420px,92vw);background:#fff;z-index:70;transform:translateX(105%);transition:.3s;display:flex;flex-direction:column}.drawer.open{transform:none}.drawer-head{display:flex;justify-content:space-between;padding:18px;border-bottom:1px solid #eee}.drawer-head button{border:0;background:#eee;width:34px;height:34px;border-radius:50%;cursor:pointer}
.progress{height:8px;background:#eee;margin:14px 18px 6px;border-radius:99px;overflow:hidden}.progress div{height:100%;background:var(--coral);width:0}.drawer p{padding:0 18px;font-size:13px}
#cartItems{flex:1;overflow:auto;padding:0 18px}.cart-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #eee;align-items:center}.cart-item img{width:64px;height:64px;object-fit:cover;border-radius:10px}.cart-item .meta{flex:1}.qty{display:flex;gap:8px;align-items:center}.qty button{width:26px;height:26px;border-radius:50%;border:1px solid #ddd;background:#fff;cursor:pointer}.remove{border:0;background:none;color:#c00;cursor:pointer}
.drawer-foot{padding:16px 18px;border-top:1px solid #eee}.row{display:flex;justify-content:space-between;margin-bottom:8px}.total{font-size:20px}.full{width:100%;text-align:center}.note{font-size:13px;color:#0a7a42;text-align:center}
.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,80px);background:var(--navy);color:#fff;padding:12px 20px;border-radius:999px;transition:.3s;z-index:90}.toast.show{transform:translate(-50%,0)}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.benefits{grid-template-columns:repeat(2,1fr)}.slide{height:340px}.slide-text h1{font-size:36px}.nav{display:none}.burger{display:block}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.slide{height:280px}.section{padding:28px 4%}.search{order:3;width:100%}}