/* enchufá — estilos del sitio. Base: tokens.css (no redefinir colores/radios/espaciados acá).
   Valores tomados de design/export/ui-componentes.dc.html. Mobile-first. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-text);font-size:var(--type-body-size);line-height:var(--type-body-line);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-accent);text-decoration:none}
a:hover{color:var(--color-accent-hover);text-decoration:underline}
button{font:inherit;color:inherit}
h1,h2,h3{margin:0}
p{margin:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:var(--z-toast);background:var(--color-accent);color:var(--color-on-accent);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm)}
.skip:focus{left:8px}
.e-ico{display:inline-block;flex:none;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:middle}
.e-badge{display:block;flex:none}

/* Layout */
.wrap{width:100%;max-width:1280px;margin:0 auto;padding-left:var(--space-4);padding-right:var(--space-4)}
.sec{padding-top:var(--space-10);padding-bottom:var(--space-4)}
.sec--tight{padding-top:var(--space-6)}
.sec__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}

/* Tipografía (escala de tokens) */
.h1{font-family:var(--font-display);font-size:30px;line-height:var(--type-h1-line);font-weight:var(--type-h1-weight);text-wrap:balance}
.h2{font-family:var(--font-display);font-size:22px;line-height:var(--type-h2-line);font-weight:var(--type-h2-weight)}
.h3{font-family:var(--font-text);font-size:var(--type-title-size);line-height:var(--type-title-line);font-weight:var(--type-title-weight);display:flex;align-items:center;gap:var(--space-2)}
.lead{font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--color-text-2);text-wrap:pretty}
.eyebrow{font-size:var(--type-caption-size);font-weight:var(--type-caption-weight);letter-spacing:.08em;color:var(--color-text-3)}
.eyebrow--accent{color:var(--color-accent);font-size:13px;font-weight:700;letter-spacing:.1em}
.muted13{font-size:13px;color:var(--color-text-2)}
.muted14{font-size:var(--type-small-size);color:var(--color-text-2)}
.link{display:inline-flex;align-items:center;gap:6px;font-size:var(--type-small-size);font-weight:600;background:none;border:0;padding:0;cursor:pointer;color:var(--color-accent)}
.dot{width:6px;height:6px;border-radius:9px;flex:none;display:inline-block}
.dot8{width:8px;height:8px;border-radius:9px;flex:none;display:inline-block}
.catchip{display:flex;align-items:center;gap:6px;font-size:var(--type-caption-size);font-weight:600;letter-spacing:.06em;color:var(--color-text-2)}

/* Botones (componente 01): alto 48 (56 hero), radio 12, 16/600 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 22px;border-radius:var(--radius-md);border:0;font:600 16px var(--font-text);cursor:pointer;text-decoration:none;transition:background var(--motion-base) var(--motion-easing),box-shadow var(--motion-base) var(--motion-easing);white-space:nowrap}
.btn:hover{text-decoration:none}
.btn--primary{background:var(--color-accent);color:var(--color-on-accent)}
.btn--primary:hover{background:var(--color-accent-hover);color:var(--color-on-accent);box-shadow:0 0 0 3px rgba(255,214,10,0.25)}
.btn--primary:active{background:var(--color-accent-press)}
.btn--sec{background:transparent;color:var(--color-text);border:1px solid rgba(255,255,255,0.22)}
.btn--sec:hover{background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.4);color:var(--color-text)}
.btn--sec[aria-pressed="true"]{border-color:var(--color-accent);background:var(--color-accent-soft)}
.btn--wa{background:var(--color-whatsapp);color:var(--color-on-whatsapp)}
.btn--wa:hover{background:#4BE184;color:var(--color-on-whatsapp);box-shadow:0 0 0 3px rgba(37,211,102,0.25)}
.btn--lg{height:52px}
.btn--md{height:44px;padding:0 20px;font-size:15px}
.btn--md48{height:48px}
.btn--sm{height:44px;padding:0 18px;font-size:15px;gap:8px}
.btn--card{flex:1;height:44px;font-size:15px;padding:0 12px}
.btn--icon{width:44px;height:44px;padding:0;flex:none}
.btn--block{width:100%}

/* Header */
.hdr{position:sticky;top:0;z-index:var(--z-header);background:rgba(11,13,18,0.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border)}
.hdr__in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--space-3);padding-top:var(--space-3);padding-bottom:var(--space-3)}
.hdr__logo img{height:24px;width:auto}
.hdr__burger{grid-column:3;grid-row:1;justify-self:end;width:44px;height:44px;border-radius:var(--radius-md);background:var(--color-surface-2);border:0;display:flex;align-items:center;justify-content:center;cursor:pointer}
.nav{display:none}

/* Buscador (componente 07) */
.srch{position:relative;display:flex;align-items:center;gap:var(--space-3);height:44px;padding:0 var(--space-3);border-radius:var(--radius-md);background:var(--color-surface-2);border:1px solid var(--color-border);grid-column:1 / -1;grid-row:2;transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}
.srch:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px rgba(255,214,10,0.2)}
.srch input{flex:1;min-width:0;height:100%;background:transparent;border:0;outline:0;color:var(--color-text);font:400 16px var(--font-text)}
.srch input::placeholder{color:var(--color-text-3)}
.srch input::-webkit-search-cancel-button{display:none}
.srch__clear{background:none;border:0;padding:4px;cursor:pointer;display:flex}
.srch__clear[hidden]{display:none}
.srch--page{height:52px;max-width:560px;margin:var(--space-4) 0 var(--space-5)}
.srch__drop{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:var(--z-dropdown);background:var(--color-surface-1);border:1px solid var(--color-border-strong);border-radius:14px;padding:var(--space-2);box-shadow:var(--shadow-lg);max-height:70vh;overflow:auto}
.srch__lbl{display:block;font-size:var(--type-caption-size);font-weight:600;letter-spacing:.08em;color:var(--color-text-3);padding:8px 12px}
.srch__row{display:flex;align-items:center;gap:var(--space-3);padding:8px 12px;border-radius:10px;color:var(--color-text);font-size:15px;line-height:1.3}
.srch__row:hover,.srch__row.is-active{background:rgba(255,255,255,0.05);color:var(--color-text);text-decoration:none}
.srch__row img{width:40px;height:40px;border-radius:var(--radius-sm);object-fit:cover}
.srch__row .grow{flex:1}
.srch__row .n{color:var(--color-text-2)}
.srch__row .pr{font-size:var(--type-small-size);font-weight:600;font-variant-numeric:tabular-nums}
.srch__help{display:flex;align-items:center;gap:10px;margin-top:var(--space-2);padding:12px;border-top:1px solid var(--color-border);font-size:var(--type-small-size);color:var(--color-text-2)}

/* Menú mobile (componente 08) */
.mnu{position:fixed;inset:0;z-index:var(--z-overlay);background:var(--color-bg);display:flex;flex-direction:column}
.mnu[hidden]{display:none}
.mnu__top{display:flex;align-items:center;justify-content:space-between;padding:14px var(--space-4);border-bottom:1px solid var(--color-border)}
.mnu__top img{height:24px;width:auto}
.mnu__close{width:44px;height:44px;border-radius:var(--radius-md);background:var(--color-surface-2);border:0;display:flex;align-items:center;justify-content:center;cursor:pointer}
.mnu__body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);flex:1;overflow:auto}
.mnu__body .eyebrow{padding:4px 4px 6px}
.mnu__cat{display:flex;align-items:center;gap:14px;min-height:60px;padding:8px 12px;border-radius:14px;color:var(--color-text)}
.mnu__cat:hover{text-decoration:none;color:var(--color-text);border-color:rgba(255,255,255,0.2)}
.mnu__ico{width:42px;height:42px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex:none}
.mnu__txt{display:flex;flex-direction:column;gap:2px;flex:1}
.mnu__name{font-size:16px;font-weight:600}
.mnu__sub{font-size:13px;color:var(--color-text-2)}
.mnu__soon{display:flex;align-items:center;gap:14px;min-height:52px;padding:8px 12px;border-radius:14px;border:1px dashed var(--color-border-strong)}
.mnu__soonname{font-size:15px;color:var(--color-text-2);flex:1}
.mnu__soontag{font-size:var(--type-caption-size);font-weight:600;color:var(--color-cat-movilidad)}
.mnu__foot{padding:var(--space-4);border-top:1px solid var(--color-border)}

/* Hero (raster del kit + zonas cliqueables sobre los botones dibujados) */
.hero{padding-top:var(--space-4)}
.hero__frame{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--color-border)}
.hero__frame img{width:100%}
.hero__hot{position:absolute;border-radius:var(--radius-md)}
.hero__hot:focus-visible{box-shadow:var(--shadow-focus)}
.hero__hot--cta{left:7%;top:42.6%;width:35.3%;height:7.1%}
.hero__hot--wa{display:none}
@media (min-width:760px){
  .hero__hot--cta{left:7%;top:75%;width:15.4%;height:9.3%}
  .hero__hot--wa{display:block;left:23.4%;top:75%;width:19.7%;height:9.3%}
}

/* Cinta animada de la home (no está en el kit: tokens; ver DESIGN-GAPS #20) */
.cinta{position:relative;z-index:var(--z-raised);overflow:hidden;margin:-22px 0 0;padding:28px 0 30px}
.cinta__band{display:grid;gap:10px;rotate:-2.2deg;margin:0 -40px}
.cinta__fila{overflow:hidden}
.cinta__track{display:flex;gap:10px;width:max-content;animation:cinta 48s linear infinite}
.cinta__fila--rev .cinta__track{animation-direction:reverse;animation-duration:56s}
.cinta:hover .cinta__track{animation-play-state:paused}
@keyframes cinta{to{transform:translateX(-50%)}}
.cinta__p{flex:0 0 auto;white-space:nowrap;padding:9px 20px;border-radius:var(--radius-pill);font:600 13px/1.2 var(--font-display);text-transform:uppercase;letter-spacing:.02em;text-decoration:none}
.cinta__p--cat{background:var(--cat);color:var(--color-on-accent)}
.cinta__p--cat:hover{color:var(--color-on-accent);text-decoration:none;box-shadow:0 0 0 3px rgba(255,255,255,0.18)}
.cinta__p--y{background:var(--color-accent);color:var(--color-on-accent)}
.cinta__p--o{border:1.5px solid var(--color-border-strong);color:var(--color-text);background:rgba(11,13,18,0.6)}
@media (min-width:760px){.cinta__p{font-size:14px;padding:10px 24px}.cinta{margin-top:-26px}}
@media (prefers-reduced-motion:reduce){.cinta__track{animation:none}}

/* Tarjetas de categoría */
.catgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
.catcard{position:relative;display:block;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border);color:var(--color-text);transition:border-color var(--motion-base)}
.catcard:hover{border-color:rgba(255,255,255,0.2);text-decoration:none;color:var(--color-text)}
.catcard img{width:100%;aspect-ratio:3/2;object-fit:cover}
.catcard__pill{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:6px;font-size:var(--type-caption-size);font-weight:600;padding:5px 10px;border-radius:var(--radius-pill);background:rgba(11,13,18,0.7);border:1px solid var(--color-border-strong)}
.catcard__n{position:absolute;left:14px;bottom:10px;font-size:13px;color:var(--color-text-2)}
.catcard--soon{border-style:dashed;border-color:var(--color-border-strong)}
.catcard--soon img{opacity:.6}
.catcard__soon{position:absolute;left:14px;bottom:10px;font-size:var(--type-caption-size);font-weight:600;color:var(--color-cat-movilidad)}

/* Grilla y tarjeta de producto (componente 02) */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:var(--space-5)}
.pcard{display:flex;flex-direction:column;gap:14px;padding:12px 12px 16px;transition:border-color var(--motion-base)}
.pcard:hover{border-color:rgba(255,255,255,0.2)}
.pcard__img{position:relative;display:block;border-radius:var(--radius-md);overflow:hidden;aspect-ratio:1/1;background:var(--color-surface-2)}
.pcard__img img{width:100%;height:100%;object-fit:cover}
/* Prueba fotos sin fondo: el producto se apoya sobre surface-3 con el brillo del kit */
.pcard__img.is-recorte,.pdp__img.is-recorte{background:var(--gradient-hero),var(--color-surface-3)}
.is-recorte img{object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,0.35))}
.pcard__img.is-tarjeta,.pdp__img.is-tarjeta{background:var(--gradient-hero),var(--color-surface-3);padding:12%}
.is-tarjeta img{object-fit:contain;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-md)}
.pcard__badges{position:absolute;top:10px;left:10px;display:flex;flex-wrap:wrap;gap:6px}
.pcard__head{display:flex;flex-direction:column;gap:6px;padding:0 4px}
.pcard__name{font-size:17px;font-weight:600;line-height:1.3;text-wrap:pretty}
.pcard__name a{color:var(--color-text)}
.pcard__name a:hover{color:var(--color-text);text-decoration:underline}
.pcard__short{font-size:13px;color:var(--color-text-2)}
.pcard__price{display:flex;flex-direction:column;gap:2px;padding:0 4px}
.pcard__tr{display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap}
.pcard__big{font-weight:700;font-size:24px}
.pcard__trl{font-size:13px;font-weight:600;color:var(--color-accent)}
.pcard__stock{display:flex;align-items:center;gap:var(--space-2);padding:0 4px;font-size:13px;font-weight:600}
.pcard__actions{display:flex;gap:var(--space-2);padding:0 4px;margin-top:auto}

/* Migas */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-top:var(--space-4);font-size:13px;color:var(--color-text-2)}
.crumbs a{color:var(--color-text-2)}
.crumbs a:hover{color:var(--color-text)}
.crumbs [aria-current]{color:var(--color-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}

/* Cabecera de categoría: ilustración a la derecha, 45 % izquierdo libre para texto */
.cover{position:relative;margin-top:var(--space-3)}
.cover__img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:right center;border-radius:20px;border:1px solid var(--color-border)}
.cover__txt{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5) 0 0}
@media (min-width:760px){
  .cover__img{aspect-ratio:auto;height:360px}
  .cover__txt{position:absolute;left:var(--space-4);top:0;bottom:0;width:45%;justify-content:center;padding:var(--space-10)}
}

/* Filtros */
.filters{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-5)}
.chips{display:flex;gap:var(--space-2);overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.chips::-webkit-scrollbar{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--color-border-strong);color:var(--color-text);font-size:var(--type-small-size);font-weight:600;white-space:nowrap}
.chip:hover{background:rgba(255,255,255,0.06);color:var(--color-text);text-decoration:none}
.chip.is-on{background:var(--color-accent-soft);border-color:rgba(255,214,10,0.35);color:var(--color-accent)}
.sort{display:flex;align-items:center;gap:var(--space-2)}
.sort select{height:36px;border-radius:var(--radius-sm);background:var(--color-surface-2);color:var(--color-text);border:1px solid var(--color-border-strong);padding:0 10px;font:500 14px var(--font-text)}

/* Ficha */
.pdp{display:grid;gap:var(--space-6);padding-top:var(--space-4)}
.pdp__img{border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface-2);border:1px solid var(--color-border);aspect-ratio:1/1}
.pdp__img img{width:100%;height:100%;object-fit:cover}
.pdp__imgnote{margin-top:var(--space-2)}
.pdp__info{display:flex;flex-direction:column;gap:var(--space-4)}
.pdp__title{font-family:var(--font-display);font-weight:var(--type-h2-weight);font-size:24px;line-height:var(--type-h2-line);text-wrap:balance}
.pdp__badges{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.pdp__ctas{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.pdp__ctas .btn--wa{flex:1 1 240px}
.pdp__trust{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3);font-size:15px;color:var(--color-text-2)}
.pdp__trust li{display:flex;gap:var(--space-3);align-items:flex-start}
.pdp__trust strong{color:var(--color-text);font-weight:600}

/* Bloque de precio (componente 03) */
.priceblock{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-6)}
.priceblock__list{display:flex;flex-direction:column;gap:4px}
.priceblock__lv{font-weight:600;font-size:var(--type-h3-size)}
.priceblock__tr{display:flex;flex-direction:column;gap:6px;padding:var(--space-4);border-radius:var(--radius-md);background:rgba(255,214,10,0.08);border:1px solid rgba(255,214,10,0.35)}
.priceblock__trh{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.priceblock__trl{font-size:var(--type-small-size);font-weight:600;color:var(--color-accent)}
.priceblock__pct{font-size:13px;font-weight:700;color:var(--color-on-accent);background:var(--color-accent);border-radius:var(--radius-pill);padding:3px 10px}
.priceblock__fl{font-size:13px;font-weight:600;color:var(--color-accent)}
.priceblock__tv{font-weight:700;font-size:var(--type-price-size);line-height:var(--type-price-line)}
.priceblock__cuotas{display:flex;align-items:center;gap:var(--space-3);padding:14px var(--space-4);border-radius:var(--radius-md);background:var(--color-surface-2);font-size:15px}
.priceblock__cuotas strong{font-weight:600}

/* Chip de stock (componente 04) */
.stockchip{display:inline-flex;align-items:center;gap:var(--space-2);min-height:32px;padding:4px 14px;border-radius:var(--radius-pill);font-size:var(--type-small-size);font-weight:600;align-self:flex-start}
.stockchip--ok{background:rgba(61,214,140,0.1);border:1px solid rgba(61,214,140,0.35);color:var(--color-success)}
.stockchip--warn{background:rgba(255,181,71,0.1);border:1px solid rgba(255,181,71,0.35);color:var(--color-warning)}
.stockchip--pre{background:rgba(255,214,10,0.08);border:1px solid rgba(255,214,10,0.35);color:var(--color-accent)}
.stockchip--out{background:var(--color-surface-1);border:1px solid var(--color-border);color:var(--color-text-2)}

/* Para quién / specs (componente 05) */
.pdp__more{display:grid;gap:var(--space-5)}
.desc{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6)}
.desc p,.desc li{color:var(--color-text-2);font-size:15px;line-height:1.55}
.desc ul{margin:0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:6px}
.desc li::marker{color:var(--color-accent)}
.desc__links{display:flex;flex-wrap:wrap;gap:var(--space-5)}
.desc__links a{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.fit{display:grid;gap:var(--space-5);padding:var(--space-6)}
.fit__col{display:flex;flex-direction:column;gap:var(--space-2)}
.fit__col p{color:var(--color-text-2);font-size:15px;line-height:1.55}
.specs{padding:var(--space-2) var(--space-6) var(--space-4)}
.specs .h3{padding:var(--space-4) 0 var(--space-2)}
.specs dl{margin:0}
.specs__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-4);padding:14px 0;border-bottom:1px solid var(--color-border)}
.specs__row dt{display:flex;align-items:center;gap:6px;font-size:var(--type-small-size);color:var(--color-text-2)}
.specs__row dd{margin:0;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.specs__help{margin-top:var(--space-4);font-size:13px;color:var(--color-text-2);line-height:1.5}
.specs__help strong{color:var(--color-text);font-weight:600}
.tip{position:relative;background:none;border:0;padding:2px;cursor:help;display:inline-flex}
.tip[aria-expanded="true"]::after,.tip:hover::after{content:attr(data-tip);position:absolute;left:0;top:calc(100% + 6px);z-index:var(--z-dropdown);width:240px;padding:10px 12px;border-radius:var(--radius-sm);background:var(--color-surface-3);border:1px solid var(--color-border-strong);box-shadow:var(--shadow-md);color:var(--color-text);font-size:13px;font-weight:500;line-height:1.45;text-align:left}

/* Comparador (componente 06) */
.cmp{padding:20px;overflow-x:auto;margin-top:var(--space-5)}
.cmp__grid{display:grid;grid-template-columns:120px repeat(var(--n),minmax(150px,1fr));min-width:calc(120px + var(--n) * 150px)}
.cmp__head{display:flex;flex-direction:column;gap:var(--space-2);padding:0 10px var(--space-4)}
.cmp__head img{width:72px;height:72px;border-radius:10px;object-fit:cover}
.cmp__name{font-size:var(--type-small-size);font-weight:600;line-height:1.3;color:var(--color-text)}
.cmp__price{font-weight:700;font-size:17px}
.cmp__rm{font-size:13px;align-self:flex-start}
.cmp__k{font-size:13px;color:var(--color-text-2);padding:12px 10px 12px 0;border-top:1px solid var(--color-border)}
.cmp__v{font-size:var(--type-small-size);font-weight:600;padding:12px 10px;border-top:1px solid var(--color-border)}
.cmp__k.is-diff,.cmp__v.is-diff{background:rgba(255,214,10,0.05)}
.cmp__note{margin-top:var(--space-3)}
.cmpbar{position:fixed;left:50%;transform:translateX(-50%);bottom:var(--space-4);z-index:var(--z-sticky);display:flex;align-items:center;gap:var(--space-3);padding:8px 8px 8px 16px;border-radius:var(--radius-lg);background:var(--color-surface-2);border:1px solid var(--color-border-strong);box-shadow:var(--shadow-lg);font-size:var(--type-small-size);font-weight:600;max-width:calc(100% - 96px)}
.cmpbar[hidden]{display:none}
.cmpbar__x{background:none;border:0;cursor:pointer;display:flex;padding:6px}

/* Estados vacíos y 404 (componentes 09 · 10) */
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:40px 28px;max-width:520px;margin:var(--space-6) auto}
.empty__ico{width:72px;height:72px;border-radius:var(--radius-pill);border:1px solid var(--color-border-strong);display:flex;align-items:center;justify-content:center}
.empty__t{font-family:var(--font-display);font-weight:600;font-size:19px;line-height:1.3}
.empty__b{font-size:15px;color:var(--color-text-2);line-height:1.5;max-width:280px;text-wrap:pretty}
.e404{position:relative;overflow:hidden;display:grid;gap:var(--space-8);align-items:center;padding:var(--space-8) var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--color-border);background:radial-gradient(50% 80% at 78% 50%,rgba(255,214,10,0.14) 0%,rgba(255,214,10,0) 70%),#0F1217}
.e404__txt{display:flex;flex-direction:column;gap:var(--space-5);align-items:flex-start}
.e404__t{font-family:var(--font-display);font-weight:700;font-size:32px;line-height:1.1;text-wrap:balance}
.e404__ctas{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.e404__art{display:flex;justify-content:center}
.e404__box{width:200px;height:200px;border-radius:50px;background:var(--color-surface-1);border:1px solid var(--color-border-strong);display:flex;align-items:center;justify-content:center;position:relative}
.e404__box img{width:125px;height:125px;opacity:.9}
.e404__q{position:absolute;right:-18px;bottom:24px;font-family:var(--font-display);font-weight:700;font-size:40px;color:var(--color-accent);transform:rotate(-8deg)}

/* Páginas de texto (ayuda / legales): no definidas en el kit, tipografía y colores de tokens */
.legal{max-width:760px;display:flex;flex-direction:column;gap:var(--space-4)}
.legal .h1{margin-bottom:var(--space-2)}
.legal .h3{margin-top:var(--space-6);font-size:20px}
.legal__h4{font-size:var(--type-body-size);font-weight:600;margin-top:var(--space-2)}
.legal p,.legal li{font-size:var(--type-body-size);line-height:var(--type-body-line);color:var(--color-text-2)}
.legal strong{color:var(--color-text);font-weight:600}
.legal ul{margin:0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2)}
.legal li::marker{color:var(--color-accent)}
.legal__cta{margin-top:var(--space-6)}

/* Promo */
.promo{display:block;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border)}
.promo img{width:100%}

/* Footer (componente 11) */
.ftr{margin-top:var(--space-16);margin-bottom:var(--space-4);display:flex;flex-direction:column;gap:var(--space-10);padding:var(--space-10) var(--space-6) 28px;border-radius:var(--radius-xl);background:#0F1217;border:1px solid var(--color-border);width:calc(100% - 2 * var(--space-4));max-width:1248px}
.ftr__grid{display:grid;gap:var(--space-8)}
.ftr__brand{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start}
.ftr__brand img{height:30px;width:auto}
.ftr__brand p{font-size:15px;color:var(--color-text-2);line-height:1.55;max-width:300px}
.ftr__col{display:flex;flex-direction:column;gap:var(--space-3)}
.ftr__col a,.ftr__col span:not(.eyebrow){color:var(--color-text);font-size:15px}
.ftr__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-6);border-top:1px solid var(--color-border);font-size:13px;color:var(--color-text-2)}
.ftr__links{display:flex;flex-wrap:wrap;gap:var(--space-5)}
.ftr__links a{color:var(--color-text-2)}
.ftr__links .ftr__arrep{color:var(--color-text);font-weight:600;text-decoration:underline}

/* WhatsApp flotante (solo mobile) */
.wa-fab{position:fixed;right:var(--space-4);bottom:var(--space-4);z-index:var(--z-sticky);width:56px;height:56px;border-radius:var(--radius-pill);background:var(--color-whatsapp);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md)}
.wa-fab:hover{background:#4BE184}

/* Búsqueda: página */
.srchpage__cats{margin-bottom:var(--space-5)}

/* ===== Tablet / desktop ===== */
@media (min-width:760px){
  .wrap{padding-left:var(--space-8);padding-right:var(--space-8)}
  .h1{font-size:var(--type-h1-size)}
  .h2{font-size:var(--type-h2-size)}
  .catgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
  .filters{flex-direction:row;align-items:center;justify-content:space-between}
  .fit{grid-template-columns:1fr 1fr}
  .e404{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:56px}
  .e404__t{font-size:44px}
  .e404__box{width:240px;height:240px;border-radius:60px}
  .e404__box img{width:150px;height:150px}
  .ftr{padding:48px 40px 28px;width:calc(100% - 2 * var(--space-8))}
  .ftr__grid{grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr))}
  .cmpbar{bottom:var(--space-6)}
}
@media (min-width:1024px){
  .hdr__in{grid-template-columns:auto minmax(0,560px) 1fr;gap:var(--space-8)}
  .hdr__logo img{height:28px}
  .srch{grid-column:auto;grid-row:auto;height:48px}
  .hdr__burger{display:none}
  .nav{display:flex;gap:var(--space-1);padding-bottom:var(--space-2);overflow-x:auto}
  .nav a{display:inline-flex;align-items:center;gap:var(--space-2);height:40px;padding:0 14px;border-radius:var(--radius-md);color:var(--color-text);font-size:15px;font-weight:600;white-space:nowrap}
  .nav a:hover,.nav a[aria-current]{background:rgba(255,255,255,0.06);text-decoration:none;color:var(--color-text)}
  .nav a[aria-current]{box-shadow:inset 0 -2px 0 var(--cat)}
  .pdp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-12);align-items:start}
  .pdp__media{position:sticky;top:140px}
  .pdp__title{font-size:var(--type-h2-size)}
  .priceblock__fl{font-size:13px;font-weight:600;color:var(--color-accent)}
.priceblock__tv{font-size:34px}
  .pdp__more{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
  .specs{grid-row:1 / span 2;grid-column:2}
  .desc{grid-column:1}
  .fit{grid-template-columns:1fr}
  .wa-fab{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}