@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#000000;--panel:#000000;--panel2:#111111;--line:#222222;--text:#ffffff;--muted:#888888;--lime:#ffffff;--sidebar:280px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;font-size:15px;animation:fadeIn 0.8s ease forwards}button,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid var(--lime);outline-offset:4px}body.locked{overflow:hidden}.shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);padding:40px 30px;background:#000000;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:10px;width:max-content}.brand-symbol{font:900 63px Inter,sans-serif;letter-spacing:-3px}.brand-accent,.footer-mark span,.accent-dot{color:var(--lime)}.brand-text{font:800 28px Inter,sans-serif;letter-spacing:.08em}.brand-text small{font-size:14px;letter-spacing:.46em}.brand-caption{font-size:10px;letter-spacing:.22em;color:var(--muted);margin:22px 0 59px}.nav{display:flex;flex-direction:column;gap:5px}.nav a{font:600 13px Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase;padding:16px 0;border-bottom:1px solid #111111;display:flex;justify-content:space-between;transition:all .3s ease}.nav a:hover,.nav a.active{color:#ffffff;transform:translateX(5px)}.nav a span{font:400 16px Inter,sans-serif;opacity:0;transition:opacity .3s}.nav a:hover span{opacity:1}.nav-label{color:#555555;font-size:10px;letter-spacing:.22em;margin:37px 0 12px}.side-bottom{margin-top:auto;display:grid;gap:15px;font-size:10px;letter-spacing:.1em;color:#555555}.side-bottom span:first-child{color:var(--lime)}.main{margin-left:var(--sidebar);width:calc(100% - var(--sidebar));min-width:0}.topbar{height:80px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;position:relative}.top-note{font-size:11px;font-weight:700;letter-spacing:.19em;color:#888888}.cart-trigger{background:none;border:0;color:var(--text);display:flex;align-items:center;gap:13px;font:600 13px Inter,sans-serif;letter-spacing:.1em;transition:transform .3s ease}.cart-trigger:hover{transform:scale(1.05)}.cart-trigger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}.cart-trigger b{background:var(--lime);color:#000;padding:4px 7px;min-width:23px;text-align:center;font:700 12px Inter,sans-serif;border-radius:50%}.mobile-menu,.mobile-brand,.menu-close{display:none!important}.icon-btn{background:none;border:0;color:var(--text);font-size:24px;padding:8px}.intro{min-height:405px;display:grid;grid-template-columns:56% 44%;border-bottom:1px solid var(--line);overflow:hidden}.intro-copy{padding:54px 6% 52px 9%;display:flex;align-items:flex-start;flex-direction:column;justify-content:center}.eyebrow{color:var(--lime);font-size:11px;font-weight:700;letter-spacing:.24em;margin:0 0 15px}.intro h1,.catalog h1,.catalog h2,.cart-drawer h2,.checkout-dialog h2{font-family:Inter,sans-serif;letter-spacing:-0.02em;line-height:1;margin:0}.intro h1{font-size:clamp(45px,6vw,90px);font-weight:800}.intro h1 em{color:var(--lime);font-style:normal}.intro-copy>p:not(.eyebrow){color:#888888;line-height:1.6;max-width:410px;margin:21px 0 27px}.outline-btn{border:1px solid var(--lime);color:var(--lime);background:transparent;padding:15px 22px;font:600 12px Inter,sans-serif;letter-spacing:.15em;display:flex;gap:35px;align-items:center;justify-content:space-between;transition:all .3s ease}.outline-btn:hover{background:var(--lime);color:#000;transform:translateY(-2px);box-shadow:0 10px 20px rgba(255,255,255,0.1)}.intro-art{position:relative;overflow:hidden;background:radial-gradient(circle at 60% 46%,#111111 0%,#0a0a0a 34%,#000000 69%);display:flex;justify-content:center;align-items:center}.intro-art:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(125deg,transparent 0 44px,#ffffff03 45px 46px)}.intro-art>span{z-index:2;text-align:center;font:800 clamp(30px,4vw,60px) Inter,sans-serif;letter-spacing:.02em;transform:rotate(-9deg)}.art-ring{position:absolute;width:70%;aspect-ratio:1;border:2px solid #ffffff30;border-radius:50%;box-shadow:0 0 70px #ffffff10;transform:rotateX(65deg) rotate(-20deg) scale(1.7)}.art-stripe{position:absolute;width:115%;height:29px;background:var(--lime);opacity:.2;transform:rotate(-25deg) translateY(130px);filter:blur(5px)}.intro-art strong{position:absolute;bottom:27px;right:30px;font:600 11px Inter,sans-serif;letter-spacing:.2em}.catalog{padding:80px 5.5% 90px;scroll-margin-top:20px}.catalog-heading{display:flex;justify-content:space-between;align-items:end;gap:20px}.catalog h1,.catalog h2{font-size:clamp(30px,4vw,50px);font-weight:800}.catalog-heading>span{white-space:nowrap;color:var(--muted);font-size:13px;padding-bottom:5px}.catalog-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:35px 0 35px;padding:15px 0}.chips{display:flex;flex-wrap:wrap;gap:10px}.chip{color:#888888;background:transparent;border:1px solid #333333;padding:10px 18px;border-radius:30px;font:600 12px Inter,sans-serif;letter-spacing:.05em;transition:all .3s ease}.chip:hover,.chip.active{background:var(--lime);border-color:var(--lime);color:#000}.sort-label{white-space:nowrap;color:#888888;font:600 11px Inter,sans-serif;letter-spacing:.1em}.sort-label select{margin-left:8px;background:#000000;color:var(--text);padding:10px 25px 10px 15px;border:1px solid #333333;font-size:12px;border-radius:20px}.products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 20px}.product-card{min-width:0;cursor:pointer;animation:rise .6s cubic-bezier(0.16, 1, 0.3, 1) both}.product-image{aspect-ratio:1/1.2;background:#050505;position:relative;overflow:hidden;border:1px solid #111111}.product-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(0.16, 1, 0.3, 1)}.product-card:hover img{transform:scale(1.05)}.product-image:after{content:"";position:absolute;inset:0;box-shadow:inset 0 -60px 50px #000000aa;pointer-events:none}.badge{position:absolute;z-index:1;top:15px;left:15px;background:#ffffff;color:#000000;font:700 10px Inter,sans-serif;padding:6px 10px;letter-spacing:.1em;border-radius:20px}.badge.sold{background:#222222;color:#ffffff}.quick-view{position:absolute;z-index:2;bottom:15px;left:15px;right:15px;transform:translateY(150%);transition:transform .4s cubic-bezier(0.16, 1, 0.3, 1);background:var(--lime);color:#000;border:0;padding:14px;text-align:center;font:700 12px Inter,sans-serif;letter-spacing:.15em;border-radius:30px}.product-card:hover .quick-view,.quick-view:focus-visible{transform:translateY(0)}.product-meta{display:flex;justify-content:space-between;gap:10px;align-items:start;padding:18px 2px}.product-meta h3{margin:0;font:600 15px Inter,sans-serif;letter-spacing:.02em}.product-meta p{margin:6px 0 0;color:#777777;font-size:12px}.product-meta strong{font:600 15px Inter,sans-serif;white-space:nowrap}.empty{color:var(--muted);padding:50px 0}footer{border-top:1px solid var(--line);padding:45px 5.5%;display:flex;align-items:center;gap:30px;background:#000000}.footer-mark{font:900 50px Inter,sans-serif;letter-spacing:-3px}footer div{display:grid;gap:8px}footer strong{font:700 18px Inter,sans-serif}footer small{font-size:11px;letter-spacing:.15em;color:#555555}footer>a{margin-left:auto;color:var(--lime);font:600 12px Inter,sans-serif;letter-spacing:.1em;transition:transform .3s ease}footer>a:hover{transform:translateY(-3px)}.drawer-scrim,.scrim{position:fixed;inset:0;background:#000000cc;opacity:0;visibility:hidden;transition:opacity .3s ease;z-index:39}.drawer-scrim.open,.scrim.open{opacity:1;visibility:visible;backdrop-filter:blur(5px)}.cart-drawer{position:fixed;z-index:40;right:0;top:0;bottom:0;width:min(480px,100%);background:#000000;border-left:1px solid var(--line);transform:translateX(100%);transition:transform .4s cubic-bezier(0.16, 1, 0.3, 1);display:flex;flex-direction:column}.cart-drawer.open{transform:translateX(0)}.cart-drawer header{padding:30px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.cart-drawer h2{font-size:32px}.cart-drawer h2 span{color:var(--lime);font-size:18px;opacity:0.5}.cart-items{overflow:auto;flex:1;padding:20px 30px}.cart-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);gap:15px}.cart-empty strong{color:var(--text);font:700 22px Inter,sans-serif}.cart-row{display:grid;grid-template-columns:100px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.cart-row img{width:100px;height:120px;object-fit:cover;background:#111111;border-radius:4px}.cart-row h3{margin:0 0 8px;font:600 16px Inter,sans-serif}.cart-row small{color:var(--muted)}.cart-row-body{display:flex;flex-direction:column;justify-content:space-between}.cart-row-foot{display:flex;justify-content:space-between;align-items:center}.qty{display:flex;align-items:center;border:1px solid #333333;border-radius:20px}.qty button{border:0;background:none;color:#fff;padding:8px 14px;transition:color .2s}.qty button:hover{color:#888}.qty span{font-size:13px;min-width:15px;text-align:center}.remove{background:none;border:0;color:#777777;text-decoration:underline;font-size:11px;transition:color .2s}.remove:hover{color:#fff}.cart-bottom{padding:30px;border-top:1px solid var(--line);background:#050505}.subtotal{display:flex;justify-content:space-between;font:700 18px Inter,sans-serif;margin-bottom:10px}.cart-bottom p{font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:20px}.primary-btn{border:0;width:100%;padding:18px;background:var(--lime);color:#000;display:flex;justify-content:space-between;font:700 14px Inter,sans-serif;letter-spacing:.1em;border-radius:30px;transition:all .3s ease}.primary-btn:hover{background:#ffffff;transform:translateY(-2px);box-shadow:0 10px 20px rgba(255,255,255,0.1)}.primary-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}.product-dialog,.checkout-dialog{background:#000000;color:var(--text);border:1px solid #222222;padding:0;max-width:900px;width:calc(100% - 32px);box-shadow:0 40px 100px #000000;border-radius:8px}.product-dialog::backdrop,.checkout-dialog::backdrop{background:#000000dd;backdrop-filter:blur(5px)}.dialog-close{position:absolute;z-index:2;right:20px;top:20px;transition:transform .3s ease}.dialog-close:hover{transform:rotate(90deg)}.detail-grid{display:grid;grid-template-columns:1fr 1fr}.detail-grid>img{width:100%;height:100%;min-height:500px;object-fit:cover;border-radius:8px 0 0 8px}.detail-copy{padding:60px 45px 50px;display:flex;flex-direction:column;align-items:start}.detail-copy h2{font:800 clamp(30px,3vw,45px) Inter,sans-serif;margin:10px 0 20px;line-height:1.1}.detail-price{font:600 22px Inter,sans-serif;color:var(--lime)}.detail-description{color:#999999;line-height:1.7;margin:25px 0}.detail-copy label{color:var(--muted);font-size:11px;letter-spacing:.15em;margin:15px 0 10px;text-transform:uppercase}.detail-copy select{background:#111111;color:#fff;border:1px solid #333333;padding:15px;width:100%;margin-bottom:25px;border-radius:4px}.detail-copy .primary-btn{margin-top:auto}.checkout-dialog{max-width:540px;padding:60px 40px 40px;border-radius:8px}.checkout-dialog h2{font-size:42px;margin-bottom:15px}.checkout-dialog>p:not(.eyebrow){color:#999999;line-height:1.7}.checkout-summary{border-block:1px solid var(--line);padding:20px 0;margin:25px 0;display:flex;justify-content:space-between;font-weight:600;font-size:18px}.checkout-dialog .payment-note{font-size:12px;color:#666}.checkout-dialog .outline-btn{margin-top:25px;border-radius:30px}.product-card:nth-child(2){animation-delay:.1s}.product-card:nth-child(3){animation-delay:.2s}.product-card:nth-child(4){animation-delay:.3s}@keyframes rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@media(max-width:1080px){:root{--sidebar:240px}.sidebar{padding-inline:20px}.products{gap:30px 15px}.intro h1{font-size:clamp(40px,5vw,70px)}}@media(max-width:820px){.sidebar{transform:translateX(-100%);transition:transform .4s cubic-bezier(0.16, 1, 0.3, 1);z-index:31;width:min(300px,85vw)}.sidebar.open{transform:translateX(0)}.scrim{z-index:30}.menu-close{display:block!important;position:absolute;top:15px;right:15px}.main{margin-left:0;width:100%}.topbar{height:70px}.mobile-menu,.mobile-brand{display:block!important}.mobile-brand{font:700 20px Inter,sans-serif;letter-spacing:.05em}.mobile-brand em{color:var(--lime);font-style:normal}.top-note{display:none}.intro{min-height:380px}.products{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:580px){.topbar{padding:0 20px}.cart-trigger span{display:none}.intro{grid-template-columns:1fr}.intro-copy{padding:60px 25px 50px}.intro h1{font-size:clamp(45px,12vw,65px)}.intro-art{min-height:150px}.intro-art>span{font-size:26px}.intro-art strong{bottom:15px;right:20px}.catalog{padding:60px 20px 70px}.catalog-heading{align-items:start}.catalog-heading>span{font-size:11px}.catalog h1,.catalog h2{font-size:32px}.catalog-controls{align-items:stretch;flex-direction:column;gap:15px}.chips{gap:8px}.chip{padding:8px 14px}.sort-label{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.products{gap:25px 12px}.product-meta{display:block;padding:12px 2px}.product-meta h3{font-size:14px}.product-meta strong{display:block;margin-top:5px}.quick-view{position:static;transform:none;display:block;width:calc(100% - 20px);margin:0 10px 10px;padding:12px;border-radius:20px}.product-image{aspect-ratio:1/1.3}.badge{top:10px;left:10px;font-size:10.5px}footer{padding:40px 20px;flex-wrap:wrap;gap:20px}footer>a{width:100%;margin-left:0;text-align:center;padding:15px 0;border-top:1px solid #111}.detail-grid{grid-template-columns:1fr}.detail-grid>img{min-height:0;height:350px;border-radius:8px 8px 0 0}.detail-copy{padding:35px 25px}.checkout-dialog{padding:50px 25px 30px}.checkout-dialog h2{font-size:32px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Barra de desplazamiento de la página en el borde izquierdo. */
html{overflow:hidden}
body{direction:rtl;height:100dvh;overflow-y:scroll;scroll-behavior:smooth}
body>*{direction:ltr}
body::-webkit-scrollbar{width:14px}
body::-webkit-scrollbar-track{background:#111}
body::-webkit-scrollbar-thumb{background:#888;border:3px solid #111;border-radius:8px}
body::-webkit-scrollbar-thumb:hover{background:#bbb}
.sidebar{left:var(--scrollbar-size,14px)}
body.locked .sidebar{left:0}
@media(prefers-reduced-motion:reduce){body{scroll-behavior:auto}}

/* Fotografía aportada para PROJECT X7 */
.intro-art{background:#ddd url('assets/project-x7-reference.webp') center 48%/cover no-repeat}.intro-art:before{background:linear-gradient(90deg,#080b0caa,#080b0c22 65%,#080b0c66)}.intro-art>span{text-shadow:0 3px 25px #000,0 0 5px #000}.art-ring,.art-stripe{display:none}

/* Marca y fotografía proporcionadas por PROJECT X7. */
.topbar{display:grid;grid-template-columns:1fr auto 1fr;gap:12px}.header-logo{grid-column:2;display:flex;align-items:center;justify-content:center;width:clamp(175px,20vw,270px);height:70px}.header-logo img{display:block;width:100%;height:auto;max-height:65px;object-fit:contain}.cart-trigger{grid-column:3;justify-self:end}.product-image{background:#ececec}.product-image img,.detail-grid>img,.cart-row img{object-fit:cover;object-position:52% 50%}.product-image img{filter:contrast(1.025)}
@media(max-width:820px){.topbar{grid-template-columns:1fr auto 1fr}.mobile-menu{grid-column:1;justify-self:start}.header-logo{grid-column:2;width:clamp(140px,34vw,220px);height:58px}.header-logo img{max-height:55px}.cart-trigger{grid-column:3}}@media(max-width:580px){.header-logo{width:150px}.topbar{gap:2px}.mobile-menu{font-size:22px}}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:6px}.footer-links a{font-size:11px;letter-spacing:.14em;color:#777;transition:color .2s}.footer-links a:hover{color:#fff}
.ship-country{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;font-size:11px;font-weight:600;letter-spacing:.15em;color:var(--muted)}.ship-country select{flex:1;max-width:60%;background:#111;color:#fff;border:1px solid #333;padding:10px 12px;font-size:13px;letter-spacing:normal}
.topbar-actions{grid-column:3;justify-self:end;display:flex;align-items:center;gap:22px}.account-trigger{display:flex;align-items:center;gap:9px;font:600 13px Inter,sans-serif;letter-spacing:.1em;transition:transform .3s ease}.account-trigger:hover{transform:scale(1.05)}.account-trigger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}.login-note{color:#ffcc66!important}@media(max-width:820px){.account-trigger span{display:none}.topbar-actions{gap:14px}}
[hidden]{display:none!important}
.nav-categories{display:flex;flex-direction:column;gap:5px}.badge.sold-out{background:#111;color:#fff;border:1px solid #fff}.detail-media{display:grid;gap:10px;align-content:start}.detail-thumbs{display:flex;gap:8px;flex-wrap:wrap}.detail-thumbs button{width:62px;height:62px;padding:0;border:1px solid #333;background:#111;opacity:.6}.detail-thumbs button.active,.detail-thumbs button:hover{opacity:1;border-color:#fff}.detail-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.stock-note{min-height:1.2em;color:#ffcc66;font-size:13px;margin:8px 0 0}#productSize option:disabled{color:#666}
.detail-media{min-width:0}.detail-media>img{display:block;width:100%;height:100%;min-height:500px;max-height:640px;object-fit:cover;object-position:52% 50%;border-radius:8px 0 0 8px}.detail-media .detail-thumbs{padding:0 10px 10px}@media(max-width:580px){.detail-media>img{min-height:0;height:350px;border-radius:8px 8px 0 0}}

/* ===================== Diseño profesional (inspirado en tiendas de equipamiento moto) ===================== */
/* Lo que dibuja el navegador también lleva la marca: selección, cursor de texto, controles y barra de desplazamiento. */
::selection{background:#C8102E;color:#fff}
html{accent-color:#C8102E;caret-color:#C8102E}
body{scrollbar-color:#2c2c2c #0a0a0a;scrollbar-width:thin}
body::-webkit-scrollbar{width:11px}body::-webkit-scrollbar-track{background:#0a0a0a}body::-webkit-scrollbar-thumb{background:#2c2c2c;border:3px solid #0a0a0a;border-radius:8px}body::-webkit-scrollbar-thumb:hover{background:#444}

/* Barra de anuncios */
.announce{background:#C8102E;color:#fff;text-align:center;padding:9px 16px}
.announce p{margin:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;font:600 11px/1.4 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.announce-sep{width:1px;height:12px;background:#ffffff80}
@media(max-width:580px){.announce p{font-size:11px;letter-spacing:.06em}.announce-sep{display:none}}

/* Elige tu estilo de manejo: mosaico asimétrico (una foto grande y dos apiladas) */
.styles{padding:96px 5.5% 40px}
.styles-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:24px 40px;margin-bottom:34px}
.styles-head h2{font:800 clamp(30px,4vw,52px)/1.02 Inter,sans-serif;letter-spacing:-.02em;margin:0;text-wrap:balance}
.styles-head p{margin:0;color:#a8a8a8;font-size:15px;line-height:1.6;max-width:42ch;justify-self:end}
.styles-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:14px;height:clamp(540px,72vh,780px)}
.style-tile{position:relative;overflow:hidden;display:block;background:#0b0b0b;border:1px solid #1a1a1a;border-radius:6px;isolation:isolate}
.style-tile--lead{grid-row:1 / span 2}
.style-media{position:absolute;inset:0;z-index:-1}
.style-media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.12);transition:transform 1.4s cubic-bezier(.16,1,.3,1),filter .6s ease;filter:saturate(.92) brightness(.9)}
.style-tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 18%,#050505b8 52%,#050505f5 100%)}
.style-copy{position:absolute;left:0;right:0;bottom:0;padding:clamp(20px,2.6vw,34px);display:grid;gap:8px}
.style-copy h3{margin:0;font:800 clamp(28px,3.4vw,48px)/1 Inter,sans-serif;letter-spacing:-.01em}
.style-copy p{margin:0;color:#d2d2d2;font-size:14px;line-height:1.55;max-width:34ch}
.style-cta{margin-top:8px;justify-self:start;font:700 12px Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase;padding-bottom:4px;background:linear-gradient(#C8102E,#C8102E) left bottom/0% 2px no-repeat;transition:background-size .5s cubic-bezier(.16,1,.3,1)}
.style-cta span{display:inline-block;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.style-tile:hover .style-media img,.style-tile:focus-visible .style-media img{transform:scale(1.18);filter:saturate(1) brightness(1)}
.style-tile:hover .style-cta,.style-tile:focus-visible .style-cta{background-size:100% 2px}
.style-tile:hover .style-cta span{transform:translate(3px,-3px)}
.style-tile:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:820px){.styles{padding:70px 20px 30px}.styles-head{grid-template-columns:1fr}.styles-head p{justify-self:start}.styles-grid{grid-template-columns:1fr;grid-template-rows:none;height:auto}.style-tile{height:340px}.style-tile--lead{grid-row:auto;height:440px}}

/* Garantías: una sola franja con separadores finos, no tarjetas */
.assurances{border-top:1px solid #1a1a1a;border-bottom:1px solid #1a1a1a;margin:0 5.5%}
.assurances ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.assurances li{display:flex;gap:14px;align-items:flex-start;padding:30px 24px}
.assurances li+li{border-left:1px solid #1a1a1a}
.assurances .ic{flex:none;width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.assurances strong{display:block;font:700 12px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.assurances span{color:#9d9d9d;font-size:13px;line-height:1.55}
.assurances a{text-decoration:underline;text-underline-offset:3px;color:#ddd}
@media(max-width:1080px){.assurances ul{grid-template-columns:repeat(2,minmax(0,1fr))}.assurances li:nth-child(3){border-left:0}.assurances li:nth-child(n+3){border-top:1px solid #1a1a1a}}
@media(max-width:580px){.assurances{margin:0 20px}.assurances ul{grid-template-columns:1fr}.assurances li{padding:22px 4px}.assurances li+li{border-left:0;border-top:1px solid #1a1a1a}}

/* Pie de página en columnas */
.site-footer{display:block;border-top:0;background:#070707;padding:64px 5.5% 26px;margin-top:70px}
.site-footer__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:36px}
.site-footer .site-footer__brand{display:grid;gap:12px;align-content:start}
.site-footer__brand img{width:180px;height:auto}
.site-footer__brand p{margin:0;color:#bdbdbd;font-size:14px}
.site-footer small{font-size:12px;letter-spacing:.06em;color:#8a8a8a}
.site-footer nav{display:grid;gap:12px;align-content:start}
@media(min-width:821px){.site-footer__grid:has(>nav:nth-of-type(4)){grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr))}}
.site-footer h3{margin:0 0 4px;font:700 11px Inter,sans-serif;letter-spacing:.2em;color:#8a8a8a}
.site-footer nav a{color:#d3d3d3;font-size:14px;width:max-content;text-underline-offset:4px;transition:color .2s}
.site-footer nav a:hover{color:#fff;text-decoration:underline}
.site-footer__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-top:48px;padding-top:22px;border-top:1px solid #181818;color:#8f8f8f;font-size:12px;letter-spacing:.04em}
.site-footer .to-top{font:600 12px Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.site-footer .to-top:hover span{display:inline-block;transform:translateY(-3px);transition:transform .3s}
@media(max-width:820px){.site-footer{padding:48px 20px 24px}.site-footer__grid{grid-template-columns:1fr 1fr}.site-footer__brand{grid-column:1 / -1}}
.style-copy h3,.style-copy p{text-shadow:0 2px 18px #000c}

/* Franja de texto en movimiento entre secciones */
.marquee{overflow:hidden;border-block:1px solid #1a1a1a;padding:22px 0;margin:30px 0 0;background:#070707}
.marquee-track{display:flex;align-items:center;gap:34px;width:max-content;padding-left:34px}
.marquee-track span{font:800 clamp(28px,4.4vw,64px)/1 Inter,sans-serif;letter-spacing:-.01em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px #d9d9d9}
.marquee-track span:nth-child(4n+1){color:#fff;-webkit-text-stroke:0}
.marquee-track img{width:clamp(24px,2.6vw,34px);height:auto;flex:none;border-radius:7px}
/* Franja "V1 DROPPING SOON" con el logo 777 bajo la portada (la mueve home-motion.js; sin animación queda fija). */
/* Va entre dos líneas (arriba y abajo) que brillan en el centro; texto y logo quedan centrados a la misma altura. */
.drop-band{position:relative;overflow:hidden;background:#050505;border-block:1px solid #2c2c2c;padding:clamp(16px,1.8vw,22px) 0}
.drop-band::before,.drop-band::after{content:"";position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#ffffffc0 50%,transparent);pointer-events:none}
.drop-band::before{top:-1px}
.drop-band::after{bottom:-1px}
.drop-track{display:flex;align-items:center;gap:clamp(36px,5vw,84px);width:max-content;padding-left:clamp(36px,5vw,84px)}
/* text-box recorta el espacio de arriba y abajo de la letra: el centro de las mayúsculas coincide con el del logo. */
.drop-track span{display:block;font:800 clamp(16px,1.7vw,24px)/1 Inter,sans-serif;letter-spacing:.07em;color:#fff;white-space:nowrap;text-box:trim-both cap alphabetic}
.drop-track img{display:block;height:clamp(22px,2.2vw,32px);width:auto;flex:none;opacity:.95}
/* Línea de progreso de lectura bajo el encabezado (solo con animaciones activas) */
.scroll-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#C8102E;transform:scaleX(0);transform-origin:left;display:none;pointer-events:none}
.gsap-on .scroll-progress{display:block}

/* Menú de usuario en el encabezado */
.account-wrap{position:relative}
.account-avatar{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#C8102E;color:#fff;font:800 13px Inter,sans-serif;letter-spacing:0}
.account-avatar.lg{width:44px;height:44px;font-size:17px;flex:none}
.account-menu{position:absolute;right:0;top:calc(100% + 14px);z-index:45;width:min(290px,86vw);background:#0b0b0b;border:1px solid #232323;border-radius:8px;box-shadow:0 24px 50px -20px #000;padding:8px;display:grid;transform-origin:top right;animation:menu-pop .25s cubic-bezier(.16,1,.3,1)}
.account-menu[hidden]{display:none}
.account-menu::before{content:"";position:absolute;top:-7px;right:22px;width:12px;height:12px;background:#0b0b0b;border-left:1px solid #232323;border-top:1px solid #232323;transform:rotate(45deg)}
.account-menu__head{display:flex;align-items:center;gap:12px;padding:12px 12px 14px;border-bottom:1px solid #1d1d1d;margin-bottom:6px}
.account-menu__head div{display:grid;gap:3px;min-width:0}
.account-menu__head strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu__head small{color:#9a9a9a;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu a,.account-menu button{display:block;width:100%;text-align:left;padding:11px 12px;border-radius:6px;background:none;border:0;color:#d6d6d6;font:500 14px Inter,sans-serif;cursor:pointer}
.account-menu a:hover,.account-menu button:hover,.account-menu a:focus-visible,.account-menu button:focus-visible{background:#151515;color:#fff}
.account-menu button{color:#ff9a9a;border-top:1px solid #1d1d1d;border-radius:0 0 6px 6px;margin-top:4px}
@keyframes menu-pop{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.account-menu{animation:none}}

/* Tienda principal: destacados que llevan al catálogo */
.featured{padding:90px 5.5% 70px}
.featured-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:34px}
.featured-head h2{font:800 clamp(30px,4vw,52px)/1.02 Inter,sans-serif;letter-spacing:-.02em;margin:0}
.featured-head .outline-btn{flex:none}
.featured-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
a.product-card{display:block;color:inherit}
a.product-card .quick-view{display:block}
@media(max-width:1080px){.featured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.featured{padding:60px 20px 50px}}
/* Página de productos */
.catalog-page{padding-top:46px}
.crumbs{display:flex;gap:10px;align-items:center;font:600 12px Inter,sans-serif;letter-spacing:.08em;color:#8a8a8a;margin-bottom:26px}
.crumbs a{color:#cfcfcf;text-decoration:underline;text-underline-offset:4px}.crumbs a:hover{color:#fff}
.crumbs [aria-current]{color:#fff}
/* Carrito: "Seguir comprando" debajo del botón de pago */
.cart-bottom .keep-shopping{width:100%;justify-content:center;gap:14px;margin-top:12px;border-radius:30px;padding:15px}

/* Stock visible */
.badge.low-stock{background:#ffcc66;color:#000}
.stock-flag{display:block;margin-top:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.stock-flag.low{color:#ffcc66}.stock-flag.out{color:#ff6b7f}
.product-card.is-sold-out .product-image img{filter:grayscale(1) contrast(.9);opacity:.5}
.product-card.is-sold-out .product-image::after{content:'AGOTADO';position:absolute;z-index:1;inset:50% 0 auto;box-shadow:none;transform:translateY(-50%);padding:12px 0;background:#000000d9;color:#fff;text-align:center;font:800 13px Inter,Arial,sans-serif;letter-spacing:.3em;border-block:1px solid #ffffff40;pointer-events:none}
.product-card.is-sold-out .badge.sold-out{display:none}
.product-card.is-sold-out .product-meta h3,.product-card.is-sold-out .product-meta strong{color:#9a9a9a}
.product-card.is-sold-out .product-meta strong{text-decoration:line-through;text-decoration-color:#ff6b7f}
/* Productos en silueta ("PRÓXIMAMENTE"): la imagen ya llega como silueta desde el servidor. */
.badge.soon{background:var(--x-red,#c8102e);color:#fff;letter-spacing:.12em}
.stock-flag.soon{color:#ff8a9a}
.soon-price{font-size:.78em;letter-spacing:.14em;color:#fff}
.product-card.is-teaser .product-image{cursor:pointer}
.product-card.is-teaser .product-image::after{content:'PRÓXIMAMENTE';position:absolute;z-index:1;inset:50% 0 auto;transform:translateY(-50%);padding:12px 0;background:#000000cc;color:#fff;text-align:center;font:800 13px/1 Inter,sans-serif;letter-spacing:.32em}
.product-card.is-teaser .badge.soon{display:none}
.soon-note{border-color:#c8102e80;background:#c8102e1a;color:#ffd6dc}
.sold-out-note{margin:0 0 18px;padding:14px 16px;border:1px solid #ff6b7f66;background:#ff6b7f14;color:#ffd6dc;font-size:13px;line-height:1.5}
.sold-out-note strong{display:block;margin-bottom:4px;color:#ff6b7f;letter-spacing:.2em;font-size:12px}
.cart-stock{margin:6px 0 0;color:#ffcc66;font-size:12px;line-height:1.4}.cart-stock.out{color:#ff6b7f}
.cart-row.is-sold-out img{filter:grayscale(1);opacity:.5}
/* ===== Celulares, tablets y pantallas grandes ===== */
/* Campos de 16 px en pantallas táctiles y angostas: el iPhone no acerca la página al escribir. */
@media (pointer:coarse),(max-width:820px){input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea{font-size:16px!important}}
/* Todo lo que se toca con el dedo mide al menos 44 px. */
@media (pointer:coarse){
.account-trigger,.cart-trigger{min-height:44px;min-width:44px;justify-content:center}
.chip,.sort-label select{min-height:44px}
.site-footer nav{gap:0}
.site-footer nav a,.site-footer .to-top,.page-foot a,.crumbs a,.page-top>a,.acct-top-nav a{display:inline-flex;align-items:center;min-height:44px}
.eye{min-height:44px;min-width:52px}
.link-btn{min-height:44px;display:inline-flex;align-items:center}
.tab{min-height:48px}
.dialog-close{display:grid;place-items:center;min-width:44px;min-height:44px}
.icon-btn{min-width:44px;min-height:44px}
}
/* Ficha de producto a pantalla completa en el celular, con la X siempre a mano. */
@media (max-width:580px){
.product-dialog{width:100%;max-width:none;height:100%;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;box-shadow:none;overscroll-behavior:contain}
.product-dialog .detail-media>img{border-radius:0;height:min(56vh,420px)}
.product-dialog .detail-copy{padding:28px 20px 22px}
.product-dialog .dialog-close{position:fixed;top:10px;right:10px;width:44px;height:44px;padding:0;border-radius:50%;background:#000000b8;backdrop-filter:blur(6px);font-size:19px}
.product-dialog .dialog-close:hover{transform:none}
.checkout-dialog{width:calc(100% - 24px)}
}
/* El botón de agregar al carrito se queda visible al bajar por la ficha. */
@media (max-width:820px){
.detail-copy .primary-btn{position:sticky;bottom:14px;z-index:3;box-shadow:0 -22px 26px 4px #000}
}
/* Pantallas grandes: más columnas en el catálogo en vez de tarjetas gigantes. */
@media (min-width:1400px){.products{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:2000px){.products{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* Aviso de sesión (inactividad), lo crea sesion.js */
.x7-aviso{position:fixed;z-index:300;left:50%;bottom:16px;transform:translateX(-50%);width:min(560px,calc(100% - 32px));display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 14px 14px 18px;background:#0b0b0b;border:1px solid #2e2e2e;border-left:3px solid #C8102E;color:#eee;font:500 14px/1.45 Inter,sans-serif;box-shadow:0 18px 50px #000c}
.x7-aviso[hidden]{display:none}
.x7-aviso p{margin:0;flex:1 1 220px}
.x7-aviso a,.x7-aviso button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border:1px solid #fff;background:#fff;color:#000;font:700 12px Inter,sans-serif;letter-spacing:.12em;text-decoration:none;cursor:pointer}
.x7-aviso .x7-cerrar{min-width:44px;padding:0;background:none;color:#fff;border-color:#3a3a3a;font-size:16px}
@media (prefers-reduced-motion:no-preference){.x7-aviso:not([hidden]){animation:fadeIn .25s ease}}
/* Aviso de términos en el carrito */
.cart-bottom .cart-legal{margin:-10px 0 16px;font-size:11.5px;color:#8f8f8f}
.cart-bottom .cart-legal a{color:#cfcfcf;text-decoration:underline;text-underline-offset:3px}
.cart-bottom .cart-legal a:hover{color:#fff}

/* Categorías del catálogo: la que señalas con el mouse se agranda un poco; en el celular, la que tocas (y queda
   agrandada mientras está elegida). Crece menos que el espacio entre botones: no tapa a las de al lado. */
.chips .chip{transform-origin:center;transition:background .3s,color .3s,border-color .3s,transform .25s cubic-bezier(.34,1.56,.64,1)}
@media(hover:hover){.chips .chip:hover{transform:scale(1.07)}}
@media(hover:none){.chips .chip.active{transform:scale(1.07)}}
.chips .chip:active{transform:scale(1.1)}
/* Es un agrandado pequeño: se anima aunque el equipo tenga "reducir movimiento" (lo pidió el dueño). */
@media(prefers-reduced-motion:reduce){.chips .chip{transition-duration:.3s,.3s,.3s,.25s!important}}

/* Fotos de las secciones («Elige tu estilo»): las mismas sombras automáticas que las fotos de producto. */
.style-media::after{content:"";position:absolute;inset:0;box-shadow:inset 0 -60px 50px #000000aa;pointer-events:none}
.style-tile{transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1),border-color .5s}
.style-tile:hover,.style-tile:focus-visible{transform:translateY(-6px);box-shadow:0 26px 40px -22px #ffffff40;border-color:#2a2a2a}
@media(prefers-reduced-motion:reduce){.style-tile:hover,.style-tile:focus-visible{transform:none}}