*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #E63946;--color-primary-dark: #C41E3A;--color-secondary: #1D3557;--color-accent: #F4A261;--color-accent-gold: #D4AF37;--color-surface: #F7F3EE;--color-surface-alt: #FFF8F0;--color-green: #2A9D8F;--color-green-dark: #1B7A6E;--color-pink: #E9C8D8;--color-turquoise: #2EC4B6;--color-purple: #7B2D8E;--color-magenta: #D6006C;--color-text: #1a1a1a;--color-text-muted: #666;--color-white: #ffffff;--color-black: #0a0a0a;--font-display: "Outfit", sans-serif;--font-body: "Inter", sans-serif;--header-height: 64px;--banner-height: 32px;--total-header: calc(var(--header-height) + var(--banner-height));--section-pad: clamp(60px, 8vw, 120px);--grid-gap: 20px;--ease-out: cubic-bezier(.25, .46, .45, .94);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--transition-fast: .2s var(--ease-out);--transition-med: .4s var(--ease-out);--transition-slow: .6s var(--ease-out);--shadow-sm: 0 2px 8px rgba(0,0,0,.06);--shadow-md: 0 8px 30px rgba(0,0,0,.08);--shadow-lg: 0 20px 60px rgba(0,0,0,.12);--shadow-hover: 0 12px 40px rgba(0,0,0,.15);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px}html{scroll-behavior:smooth;scroll-padding-top:var(--total-header);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);color:var(--color-text);background:var(--color-surface);line-height:1.6;overflow-x:hidden}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer;font-family:inherit}img{max-width:100%;display:block}.btn-primary{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;background:var(--color-secondary);color:var(--color-white);font-family:var(--font-display);font-size:.95rem;font-weight:700;letter-spacing:.12em;border:none;cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:var(--color-primary);transition:left var(--transition-med);z-index:0}.btn-primary:hover:before{left:0}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}.btn-primary>*{position:relative;z-index:1}.section-title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3.2rem);font-weight:900;line-height:1.1;color:var(--color-secondary)}.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:var(--color-secondary);transition:transform var(--transition-med)}.site-header.hidden{transform:translateY(-100%)}.header-main{height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 24px}.logo{font-family:var(--font-display);font-size:clamp(1.1rem,2.5vw,1.5rem);font-weight:900;color:var(--color-white);letter-spacing:.08em;position:absolute;left:50%;transform:translate(-50%);white-space:nowrap}.hamburger{display:flex;flex-direction:column;gap:5px;width:28px;padding:4px 0;z-index:10}.hamburger span{display:block;height:2.5px;background:var(--color-white);border-radius:2px;transition:all var(--transition-fast)}.hamburger:hover span{background:var(--color-accent)}.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}.header-actions{display:flex;align-items:center;gap:12px;z-index:10}.icon-btn{color:var(--color-white);display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);transition:all var(--transition-fast);position:relative}.icon-btn:hover{background:#ffffff1f;color:var(--color-accent)}.cart-badge{position:absolute;top:2px;right:0;width:18px;height:18px;background:var(--color-primary);color:#fff;font-size:.65rem;font-weight:700;border-radius:50%;display:flex;align-items:center;justify-content:center}.header-banner{height:var(--banner-height);background:var(--color-primary);overflow:hidden;display:flex;align-items:center}.banner-scroll{display:flex;gap:24px;animation:bannerScroll 20s linear infinite;white-space:nowrap}.banner-scroll span{font-family:var(--font-display);font-size:.72rem;font-weight:700;color:var(--color-white);letter-spacing:.1em;text-transform:uppercase}@keyframes bannerScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.mobile-nav{position:fixed;top:0;left:-100%;width:min(380px,85vw);height:100vh;background:var(--color-secondary);z-index:2000;transition:left var(--transition-med);display:flex;flex-direction:column;padding:32px}.mobile-nav.open{left:0}.mobile-nav-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:48px}.mobile-nav-title{font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-white);letter-spacing:.1em;text-transform:uppercase}.mobile-nav-close{color:var(--color-white);font-size:1.4rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:background var(--transition-fast)}.mobile-nav-close:hover{background:#ffffff1a}.mobile-nav-links{list-style:none;display:flex;flex-direction:column;gap:8px}.mobile-nav-links a{font-family:var(--font-display);font-size:2rem;font-weight:900;color:var(--color-white);padding:12px 0;display:block;border-bottom:1px solid rgba(255,255,255,.08);transition:all var(--transition-fast);position:relative}.mobile-nav-links a:after{content:"→";position:absolute;right:0;opacity:0;transform:translate(-10px);transition:all var(--transition-fast)}.mobile-nav-links a:hover{color:var(--color-accent);padding-left:16px}.mobile-nav-links a:hover:after{opacity:1;transform:translate(0)}.nav-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1999;opacity:0;pointer-events:none;transition:opacity var(--transition-med)}.nav-overlay.visible{opacity:1;pointer-events:all}.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:var(--color-primary);padding-top:var(--total-header)}.hero-bg{position:absolute;right:-5%;top:50%;transform:translateY(-50%);width:55%;height:90%;opacity:.25;pointer-events:none}.hero-bg-img{width:100%;height:100%;object-fit:contain;filter:saturate(0) brightness(2);mix-blend-mode:overlay}.hero-content{position:relative;z-index:2;padding:clamp(40px,6vw,80px);max-width:740px}.hero-title{margin-bottom:28px}.hero-title-line{display:block}.hero-title-small{font-family:var(--font-display);font-size:clamp(1rem,2vw,1.3rem);font-weight:600;color:var(--color-surface);letter-spacing:.2em;text-transform:uppercase;margin-bottom:8px;opacity:0;transform:translateY(20px);animation:heroFadeIn .8s .3s var(--ease-out) forwards}.hero-title-big{font-family:var(--font-display);font-size:clamp(3.5rem,10vw,9rem);font-weight:900;color:var(--color-white);line-height:.9;letter-spacing:-.02em;opacity:0;transform:translateY(40px)}.hero-title-big:nth-child(2){animation:heroFadeIn .8s .5s var(--ease-out) forwards}.hero-title-big:nth-child(3){animation:heroFadeIn .8s .7s var(--ease-out) forwards;color:var(--color-accent)}@keyframes heroFadeIn{to{opacity:1;transform:translateY(0)}}.hero-description{font-size:clamp(.95rem,1.5vw,1.15rem);color:#ffffffd9;line-height:1.7;max-width:500px;margin-bottom:36px;opacity:0;animation:heroFadeIn .8s .9s var(--ease-out) forwards}.hero-cta{opacity:0;animation:heroFadeIn .8s 1.1s var(--ease-out) forwards;background:var(--color-white);color:var(--color-secondary)}.hero-cta:before{background:var(--color-accent)}.hero-cta:hover{color:var(--color-white)}.marquee{background:var(--color-secondary);padding:18px 0;overflow:hidden}.marquee-track{display:flex}.marquee-content{display:flex;gap:40px;animation:marqueeFlow 25s linear infinite;white-space:nowrap}.marquee-content span{font-family:var(--font-display);font-size:clamp(.85rem,1.2vw,1rem);font-weight:700;color:var(--color-white);letter-spacing:.08em;text-transform:uppercase;flex-shrink:0}@keyframes marqueeFlow{0%{transform:translate(0)}to{transform:translate(-50%)}}.catalogo{padding:var(--section-pad) clamp(20px,4vw,60px);background:var(--color-surface)}.catalogo-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:36px}.ver-todo{font-family:var(--font-display);font-size:.9rem;font-weight:600;color:var(--color-primary);border-bottom:2px solid var(--color-primary);padding-bottom:2px;transition:all var(--transition-fast)}.ver-todo:hover{color:var(--color-primary-dark);border-color:var(--color-primary-dark)}.collection-menu{display:flex;gap:12px;margin-bottom:40px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}.collection-menu::-webkit-scrollbar{display:none}.collection-tab{display:flex;align-items:center;gap:10px;padding:10px 20px;border-radius:var(--radius-full);border:2px solid #ddd;background:var(--color-white);font-family:var(--font-display);font-size:.85rem;font-weight:600;color:var(--color-text-muted);white-space:nowrap;transition:all var(--transition-fast);cursor:pointer}.collection-tab:hover{border-color:var(--color-secondary);color:var(--color-secondary)}.collection-tab.active{background:var(--color-secondary);border-color:var(--color-secondary);color:var(--color-white)}.collection-thumb{width:20px;height:20px;border-radius:50%;flex-shrink:0}.collection-tab.active .collection-thumb{box-shadow:0 0 0 2px var(--color-white)}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}.product-card{background:var(--color-white);border-radius:var(--radius-md);overflow:hidden;transition:all var(--transition-med);cursor:pointer}.product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}.product-card[data-animate]{opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out),box-shadow var(--transition-fast)}.product-card[data-animate].visible{opacity:1;transform:translateY(0)}.product-card:hover.visible{transform:translateY(-6px)}.product-card.hidden{display:none}.product-image-wrap{position:relative;overflow:hidden;aspect-ratio:1;background:var(--color-surface-alt)}.product-image{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-med)}.product-card:hover .product-image{transform:scale(1.06)}.product-overlay{position:absolute;inset:0;background:#1d355766;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-fast)}.product-card:hover .product-overlay{opacity:1}.btn-quick-view{padding:12px 28px;background:var(--color-white);color:var(--color-secondary);font-family:var(--font-display);font-size:.85rem;font-weight:700;letter-spacing:.08em;border-radius:var(--radius-full);transform:translateY(10px);transition:all var(--transition-fast)}.product-card:hover .btn-quick-view{transform:translateY(0)}.btn-quick-view:hover{background:var(--color-accent);color:var(--color-white)}.product-info{padding:16px 18px 20px}.product-name{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--color-secondary);margin-bottom:4px}.product-price{font-size:.9rem;color:var(--color-text-muted);font-weight:500;margin-bottom:12px}.product-unit{font-size:.75rem;opacity:.7}.product-swatches{display:flex;gap:8px}.swatch{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all var(--transition-fast);position:relative}.swatch:hover{transform:scale(1.2)}.swatch.active{border-color:var(--color-secondary);box-shadow:0 0 0 2px var(--color-white),0 0 0 4px var(--color-secondary)}.about{background:var(--color-green);padding:var(--section-pad) clamp(20px,4vw,60px);overflow:hidden}.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,80px);align-items:center;max-width:1200px;margin:0 auto}.about-image-col{position:relative}.about-image{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%}.about-title{color:var(--color-white);font-size:clamp(2.5rem,5vw,4rem);margin-bottom:24px}.about-description{font-size:clamp(1rem,1.3vw,1.15rem);color:#ffffffe0;line-height:1.8;margin-bottom:36px}.about-stats{display:flex;gap:32px;margin-bottom:40px}.stat{display:flex;flex-direction:column}.stat-number{font-family:var(--font-display);font-size:clamp(1.8rem,3vw,2.5rem);font-weight:900;color:var(--color-accent)}.stat-label{font-size:.85rem;color:#ffffffbf;font-weight:500}.about .btn-primary{background:var(--color-white);color:var(--color-green-dark)}.about .btn-primary:before{background:var(--color-accent)}.about .btn-primary:hover{color:var(--color-white)}.site-footer{background:var(--color-secondary);color:var(--color-white)}.footer-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;padding:clamp(60px,8vw,100px) clamp(20px,4vw,60px);max-width:1200px;margin:0 auto}.footer-logo{font-family:var(--font-display);font-size:clamp(3rem,6vw,5rem);font-weight:900;line-height:.95;color:var(--color-pink);margin-bottom:20px}.footer-tagline{font-size:1rem;color:#ffffffb3;line-height:1.6}.footer-info{display:flex;gap:40px}.footer-col{flex:1}.footer-heading{font-family:var(--font-display);font-weight:700;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px;color:var(--color-accent)}.footer-col p{font-size:.9rem;color:#ffffffb3;line-height:1.8}.footer-social{display:flex;gap:16px;margin-top:16px}.social-link{width:40px;height:40px;border-radius:50%;background:#ffffff14;display:flex;align-items:center;justify-content:center;color:var(--color-white);transition:all var(--transition-fast)}.social-link:hover{background:var(--color-primary);transform:translateY(-3px)}.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:20px clamp(20px,4vw,60px);text-align:center}.footer-bottom p{font-size:.8rem;color:#fff6}@media(max-width:1024px){.product-grid{grid-template-columns:repeat(3,1fr)}.about-inner{grid-template-columns:1fr;gap:40px}.about-image-col{max-width:500px;margin:0 auto}}@media(max-width:768px){.product-grid{grid-template-columns:repeat(2,1fr);gap:14px}.hero{min-height:auto;padding-top:calc(var(--total-header) + 20px);padding-bottom:60px}.hero-bg{width:100%;right:0;opacity:.12}.hero-content{padding:30px 20px}.footer-inner{grid-template-columns:1fr;gap:40px}.footer-info{flex-direction:column;gap:32px}.about-stats{gap:20px;flex-wrap:wrap}}@media(max-width:480px){.product-grid{grid-template-columns:1fr 1fr;gap:10px}.product-info{padding:12px 14px 16px}.product-name{font-size:.88rem}.product-price{font-size:.82rem}.collection-tab{padding:8px 16px;font-size:.8rem}.btn-primary{padding:14px 28px;font-size:.85rem}}body.loaded .hero-title-small,body.loaded .hero-title-big,body.loaded .hero-description,body.loaded .hero-cta{animation-play-state:running}
