/* ============================================================
   Titanitos · Cabecera 2026
   Medidas, colores y tipografía de la demo. Prefijo tm- para no
   chocar con Warehouse; los !important solo donde el tema pisa.
   ============================================================ */

:root{
  --tm-blue:#0098D8; --tm-blue-d:#0076AE; --tm-ink:#111111; --tm-grey:#5E5B56; --tm-tile:#F1EFEC; --tm-line:#E3E0DB;
  --tm-sans:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif; --tm-r:14px;
}
.tm{
  --tm-blue:#0098D8;
  --tm-blue-d:#0076AE;
  --tm-ink:#111111;
  --tm-grey:#5E5B56;
  --tm-tile:#F1EFEC;
  --tm-line:#E3E0DB;
  --tm-sans:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --tm-hdr:74px;
  --tm-pad:clamp(16px,3vw,44px);
  --tm-maxw:1680px;
  --tm-r:14px;
  /* La caja no existe para el diseño: así la cabecera queda fija respecto a la página */
  display:contents;
}
@media (max-width:900px){ .tm{--tm-hdr:62px} }

.tm-ann,.tm-hdr,.tm-mnav,.tm-modal{font-family:var(--tm-sans); color:var(--tm-ink); line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
.tm-ann *,.tm-hdr *,.tm-mnav *,.tm-modal *{box-sizing:border-box}
.tm [hidden]{display:none!important}
/* Arreglos mínimos frente al tema, con especificidad cero para no pisar lo de abajo */
:where(.tm-hdr,.tm-mnav,.tm-modal,.tm-ann) a{color:inherit; text-decoration:none!important}
:where(.tm-hdr,.tm-mnav,.tm-modal) button{font:inherit; color:inherit; cursor:pointer; border:0; background:none;
  padding:0; margin:0; box-shadow:none; text-transform:none; letter-spacing:inherit}
:where(.tm-hdr,.tm-mnav) ul{list-style:none; margin:0; padding:0}
:where(.tm-hdr,.tm-mnav,.tm-modal) :is(h2,h4,h5){margin:0; font-family:var(--tm-sans)}
:where(.tm-hdr) img{max-width:100%; display:block}
.tm-hdr :focus-visible,.tm-mnav :focus-visible,.tm-modal :focus-visible{outline:2px solid var(--tm-blue); outline-offset:2px}
.tm-hdr .tm-search__i:focus-visible{outline:none}

.tm-cap{font-size:11.2px; letter-spacing:.09em; text-transform:uppercase; font-weight:600}
.tm-cap--g{color:var(--tm-grey)}

/* ============================================================
   AVISOS
   ============================================================ */
.tm-ann{background:var(--tm-ann-bg,var(--tm-blue)); color:var(--tm-ann-fg,#fff); height:32px; overflow:hidden; position:relative; z-index:1041}
.tm-ann__l{list-style:none; margin:0!important; padding:0!important; transition:transform .55s cubic-bezier(.6,0,.3,1)}
.tm-ann__l li{height:32px; display:flex; align-items:center; justify-content:center; gap:8px; padding:0 12px;
  font-size:11.2px; letter-spacing:.07em; text-transform:uppercase; font-weight:600; text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tm-ann a{color:var(--tm-ann-fg,#fff)!important}
.tm-ann a:hover{text-decoration:underline!important}

/* ============================================================
   CABECERA
   ============================================================ */
.tm-hdr{position:sticky; top:0; z-index:1040; background:#fff; border-bottom:1px solid var(--tm-line)}
.tm-hdr__in{display:flex; align-items:center; gap:16px; height:var(--tm-hdr); padding-inline:var(--tm-pad);
  max-width:var(--tm-maxw); margin-inline:auto}
.tm-hdr__l{display:flex; align-items:center; gap:14px; min-width:0}
.tm-hdr__r{margin-left:auto; display:flex; align-items:center; gap:16px}

.tm-logo{display:flex; align-items:center; flex:none}
.tm-logo img{height:var(--tm-logo-h,34px); width:auto; max-width:none}
.tm-logo__t{font-weight:700; letter-spacing:.04em; font-size:16px; text-transform:uppercase}
@media (max-width:560px){ .tm-logo img{height:calc(var(--tm-logo-h,34px) * .82)} }

.tm-ico{position:relative; display:grid; place-items:center; min-width:18px; height:28px; color:var(--tm-ink)!important}
.tm-ico:hover{color:var(--tm-blue)!important}
.tm-ico__n{position:absolute; top:-5px; right:-6px; font-size:9.6px; font-weight:600; line-height:1;
  font-variant-numeric:tabular-nums}
.tm-ico__dot{position:absolute; top:2px; right:2px; width:6px; height:6px; border-radius:50%; background:var(--tm-blue)}
.tm-burger{display:none; width:28px; height:28px; place-items:center}

/* ---------- Barra del menú ---------- */
.tm-nav{display:flex; gap:clamp(12px,1.6vw,28px); margin-left:clamp(16px,3vw,44px)}
.tm-nav__i{position:relative}
.tm-nav__l{display:flex; align-items:center; gap:7px; height:var(--tm-hdr); position:relative; white-space:nowrap;
  font-size:12.5px; letter-spacing:.09em; text-transform:uppercase; font-weight:600; color:var(--tm-ink)!important}
.tm-nav__l::after{content:''; position:absolute; left:0; right:0; bottom:14px; height:2px; background:var(--tm-blue);
  transform:scaleX(0); transition:transform .2s}
.tm-nav__i.is-on .tm-nav__l,
.tm-nav__i:hover .tm-nav__l,
.tm-nav__i--hl .tm-nav__l{color:var(--tm-blue)!important}
.tm-nav__i.is-on .tm-nav__l::after{transform:scaleX(1)}
.tm-nav__tag{font-size:8.8px; letter-spacing:.1em; background:var(--tm-blue); color:#fff; padding:3px 6px;
  border-radius:4px; line-height:1.2}
.tm-nav__tag--hot{background:var(--tm-ink)}

/* ---------- Desplegable compacto ---------- */
/* Cuelga de su entrada y alinea su texto con el de la barra */
.tm-dd{position:absolute; top:100%; left:-24px; z-index:1039; padding-top:8px;
  opacity:0; visibility:hidden; transform:translateY(-4px); pointer-events:none;
  transition:opacity .16s ease, transform .16s ease, visibility 0s .16s}
.tm-nav__i.is-on > .tm-dd{opacity:1; visibility:visible; transform:none; pointer-events:auto;
  transition:opacity .16s ease, transform .16s ease}
.tm-dd__in{min-width:260px; background:#fff; border:1px solid var(--tm-line); border-radius:var(--tm-r);
  box-shadow:0 24px 48px -24px rgba(0,0,0,.28), 0 2px 6px rgba(0,0,0,.04); padding:12px}
.tm-dd__in--cols{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(230px,auto); gap:4px;
  padding:16px 12px 12px}
.tm-dd__c + .tm-dd__c{border-left:1px solid var(--tm-line); padding-left:4px}
.tm-dd__h{font-size:9.9px!important; letter-spacing:.11em; text-transform:uppercase; font-weight:600!important;
  color:var(--tm-grey)!important; margin:0 12px 6px!important; line-height:1.4}
.tm-dd__h a{color:var(--tm-grey)!important}
.tm-dd__h a:hover{color:var(--tm-blue)!important}
.tm-dd ul{display:grid; gap:1px}
.tm-dd li{margin:0}
.tm-dd ul a{display:flex; align-items:baseline; justify-content:space-between; gap:24px; padding:8px 12px;
  border-radius:8px; font-size:14.4px; line-height:1.35; color:var(--tm-ink)!important; white-space:nowrap;
  transition:background .12s, color .12s}
.tm-dd ul a em{font-style:normal; font-size:11.8px; color:var(--tm-grey); font-variant-numeric:tabular-nums}
.tm-dd ul a:hover,.tm-dd ul a:focus-visible{background:var(--tm-tile); color:var(--tm-blue)!important; outline:none}
.tm-dd ul a.is-hl{color:var(--tm-blue)!important}
/* «Ver todo», un poco más marcado */
.tm-dd ul a.is-all span{font-weight:600}

/* ---------- Buscador ---------- */
.tm-search{position:absolute; left:0; right:0; top:100%; background:#fff; border-bottom:1px solid var(--tm-line);
  box-shadow:0 30px 60px -40px rgba(0,0,0,.5); z-index:1039}
.tm-search__f{position:relative; display:flex; align-items:center; gap:12px; max-width:var(--tm-maxw); margin:0 auto;
  padding:16px var(--tm-pad); color:var(--tm-grey)}
.tm-search__lupa{flex:none}
.tm-search__i{flex:1; min-width:0; height:48px; border:0!important; border-bottom:1px solid var(--tm-line)!important;
  border-radius:0!important; background:transparent!important; box-shadow:none!important; outline:none;
  font:inherit; font-size:18.4px!important; letter-spacing:-.01em; color:var(--tm-ink)!important; padding:0 4px!important;
  -webkit-appearance:none; appearance:none}
.tm-search__i::-webkit-search-cancel-button{display:none}
.tm-search__i::placeholder{color:#9A968F}
.tm-search__i:focus{border-bottom-color:var(--tm-blue)!important}
.tm-search__clear{font-size:10.6px!important; letter-spacing:.09em!important; text-transform:uppercase!important;
  font-weight:600; color:var(--tm-grey)!important; padding:6px 4px!important}
.tm-search__clear:hover{color:var(--tm-ink)!important}
.tm-search__spin{width:16px; height:16px; border:2px solid var(--tm-line); border-top-color:var(--tm-blue); border-radius:50%;
  opacity:0; flex:none; transition:opacity .15s}
.tm-search__f.is-loading .tm-search__spin{opacity:1; animation:tmspin .7s linear infinite}
@keyframes tmspin{to{transform:rotate(360deg)}}
.tm-search__b{height:42px; padding:0 22px!important; border-radius:10px; background:var(--tm-blue)!important;
  color:#fff!important; font-size:11.2px!important; letter-spacing:.09em!important; text-transform:uppercase!important;
  font-weight:600}
.tm-search__b:hover{background:var(--tm-blue-d)!important}
.tm-search__x{width:36px; height:36px; font-size:16px; color:var(--tm-grey)}

.tm-vh{position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; margin:0}

/* Resultados */
.tm-sr{max-height:calc(100vh - var(--tm-hdr) - 110px); overflow:auto; overscroll-behavior:contain}
.tm-sr:empty{display:none}
.tm-sr__in{display:grid; grid-template-columns:minmax(220px,280px) 1fr; gap:clamp(24px,3vw,56px);
  max-width:var(--tm-maxw); margin:0 auto; padding:8px var(--tm-pad) 34px}
.tm-sr__in--wide,.tm-sr__in--solo{grid-template-columns:1fr}
.tm-sr__side,.tm-sr__main{min-width:0}
.tm-sr__in--solo .tm-sr__side{display:flex; flex-wrap:wrap; gap:8px 48px}
.tm-sr mark{background:none; color:inherit; font-weight:700; padding:0}

.tm-sr__sec{margin-bottom:26px}
.tm-sr__sec h6{display:flex; justify-content:space-between; align-items:center; margin:0 0 12px!important;
  font-family:var(--tm-sans); font-size:9.9px!important; letter-spacing:.11em; text-transform:uppercase;
  font-weight:600!important; color:var(--tm-grey)!important; padding-bottom:10px; border-bottom:1px solid var(--tm-line)}
.tm-sr__del{font-size:9.9px!important; letter-spacing:.06em!important; text-transform:none!important; color:var(--tm-grey)!important;
  text-decoration:underline!important; font-weight:500}
.tm-sr__fix{font-size:13.4px; color:var(--tm-grey); margin:0 0 18px; padding:10px 12px; background:#E8F6FD; border-radius:10px}
.tm-sr__fix b{color:var(--tm-ink)}

.tm-sr__sug li + li,.tm-sr__cats li + li{margin-top:2px}
.tm-sr__sug button{display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:7px 8px!important;
  margin:0 -8px!important; border-radius:8px; font-size:15.2px!important; color:var(--tm-ink)!important; font-weight:400}
.tm-sr__sug svg{color:var(--tm-grey); flex:none}
.tm-sr__cats a{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:7px 8px;
  margin:0 -8px; border-radius:8px; font-size:14.7px; color:var(--tm-ink)!important}
.tm-sr__cats small{color:var(--tm-grey); font-size:12.5px}
.tm-sr__cats em{font-style:normal; color:var(--tm-grey); font-size:12.2px; font-variant-numeric:tabular-nums}
.tm-sr__sug button:hover,.tm-sr__sug button:focus-visible,
.tm-sr__cats a:hover,.tm-sr__cats a:focus-visible{background:var(--tm-tile); outline:none}

.tm-sr__tags{display:flex; flex-wrap:wrap; gap:6px}
.tm-tag{height:34px; padding:0 14px!important; border:1px solid var(--tm-line)!important; border-radius:100px;
  font-size:13.1px!important; color:var(--tm-ink)!important; transition:.15s}
.tm-tag:hover,.tm-tag:focus-visible{border-color:var(--tm-ink)!important; outline:none}

.tm-sr__bar{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px}
.tm-sr__bar b{font-size:9.9px; letter-spacing:.11em; text-transform:uppercase; font-weight:600; color:var(--tm-grey)}
.tm-sr__bar span{font-size:12.8px; color:var(--tm-grey)}
.tm-sr__sort{margin-left:auto}
.tm-sr__sort select{height:34px; border:1px solid var(--tm-line); border-radius:8px; background:#fff; color:var(--tm-ink);
  font:inherit; font-size:12.8px; padding:0 28px 0 10px; cursor:pointer}

.tm-sr__chips{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:10px}
.tm-sr__lbl{font-size:9.9px; letter-spacing:.11em; text-transform:uppercase; font-weight:600; color:var(--tm-grey); margin-right:4px}
.tm-chip{height:32px; padding:0 13px!important; border:1px solid var(--tm-line)!important; border-radius:100px;
  font-size:12.8px!important; color:var(--tm-ink)!important; display:inline-flex; align-items:center; gap:6px; transition:.15s}
.tm-chip em{font-style:normal; color:var(--tm-grey); font-size:11.5px}
.tm-chip:hover{border-color:var(--tm-ink)!important}
.tm-chip.is-on{background:var(--tm-ink)!important; border-color:var(--tm-ink)!important; color:#fff!important}
.tm-chip.is-on em{color:rgba(255,255,255,.7)}
.tm-sr__chips--sz .tm-chip{min-width:40px; justify-content:center; padding:0 8px!important; border-radius:8px;
  font-variant-numeric:tabular-nums}
.tm-sr__chips--sz .tm-chip.is-on{background:var(--tm-blue)!important; border-color:var(--tm-blue)!important}

.tm-sr__grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:22px 16px; margin-top:16px}
.tm-card{display:flex; flex-direction:column; gap:4px; color:var(--tm-ink)!important; border-radius:var(--tm-r); outline-offset:4px}
.tm-card__img{position:relative; display:block; aspect-ratio:1/1; border-radius:var(--tm-r); overflow:hidden;
  background:var(--tm-tile); margin-bottom:6px}
.tm-card__img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply;
  transition:transform .45s}
.tm-card:hover .tm-card__img img{transform:scale(1.05)}
.tm-card__off,.tm-card__new{position:absolute; top:10px; left:10px; font-style:normal; font-size:9.6px; letter-spacing:.08em;
  text-transform:uppercase; font-weight:700; color:#fff; background:var(--tm-ink); padding:4px 7px; border-radius:4px}
.tm-card__new{background:var(--tm-blue)}
.tm-card__cat{font-size:9.9px; letter-spacing:.1em; text-transform:uppercase; color:var(--tm-grey); font-weight:600}
.tm-card__n{font-size:14.1px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.tm-card__p{display:flex; gap:8px; align-items:baseline; font-variant-numeric:tabular-nums}
.tm-card__p b{font-size:14.7px; font-weight:600}
.tm-card__p s{font-size:12.5px; color:var(--tm-grey)}
.tm-card__sz{font-size:11.5px; color:var(--tm-grey)}
.tm-card__sz.is-ok{color:#1E7F4E; font-weight:600}

.tm-sr__all{display:flex; justify-content:center; align-items:center; gap:8px; height:48px; margin-top:26px;
  border:1px solid var(--tm-ink); border-radius:10px; font-size:11.5px; letter-spacing:.09em; text-transform:uppercase;
  font-weight:600; color:var(--tm-ink)!important; transition:.16s}
.tm-sr__all:hover,.tm-sr__all:focus-visible{background:var(--tm-ink); color:#fff!important}

.tm-sr__none{padding:12px 0 6px}
.tm-sr__big{font-size:clamp(19.2px,2vw,25.6px); letter-spacing:-.02em; margin:0 0 8px; color:var(--tm-ink)}
.tm-sr__tip{font-size:14.1px; color:var(--tm-grey); margin:0 0 26px}
.tm-sr__tip--pad{padding:30px 0 0}
.tm-sr__reset{color:var(--tm-blue)!important; text-decoration:underline!important; font-size:inherit!important}

/* ---------- Megamenú ---------- */
.tm-megawrap{position:absolute; left:0; right:0; top:100%; background:#fff; border-top:1px solid var(--tm-line);
  border-bottom:1px solid var(--tm-line); box-shadow:0 26px 44px -34px rgba(0,0,0,.45); display:none; z-index:1039}
.tm-megawrap.is-open{display:block}
.tm-mega{display:none; max-width:var(--tm-maxw); margin-inline:auto; padding:32px var(--tm-pad) 38px;
  gap:clamp(20px,2.6vw,44px)}
.tm-mega.is-on{display:grid}
.tm-mega__h{font-size:10.6px!important; letter-spacing:.11em; text-transform:uppercase; font-weight:600!important;
  color:var(--tm-grey)!important; padding-bottom:10px; border-bottom:1px solid var(--tm-line); margin-bottom:14px!important;
  line-height:1.05}
.tm-mega__h a{color:var(--tm-grey)!important}
.tm-mega__h a:hover{color:var(--tm-blue)!important}
.tm-mega ul{display:grid; gap:11px}
.tm-mega ul li{margin:0}
.tm-mega ul a{font-size:14.7px; display:flex; justify-content:space-between; gap:12px; line-height:1.55;
  color:var(--tm-ink)!important}
.tm-mega ul a span{color:var(--tm-grey); font-size:12.5px; font-variant-numeric:tabular-nums}
.tm-mega ul a:hover,.tm-mega ul a.is-hl{color:var(--tm-blue)!important}

.tm-mega__sizes{display:flex; flex-wrap:wrap; gap:6px}
.tm-mega__sizes a{min-width:42px; height:36px; padding:0 8px; border:1px solid var(--tm-line); border-radius:8px;
  display:grid; place-items:center; font-size:12.8px; color:var(--tm-ink)!important; transition:.15s;
  font-variant-numeric:tabular-nums}
.tm-mega__sizes a:hover{background:var(--tm-blue); border-color:var(--tm-blue); color:#fff!important}

.tm-mega__promos{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.tm-promo{position:relative; display:block; aspect-ratio:4/5; border-radius:var(--tm-r); overflow:hidden;
  background:var(--tm-tile)}
.tm-promo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s}
.tm-promo:hover img{transform:scale(1.04)}
.tm-promo::after{content:''; position:absolute; inset:0; background:linear-gradient(transparent 45%,rgba(0,0,0,.6))}
.tm-promo b{position:absolute; left:14px; right:14px; bottom:12px; z-index:2; color:#fff; font-size:14.1px;
  font-weight:600; line-height:1.3}
.tm-promo b span{display:block; font-size:10.6px; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
  opacity:.85; margin-bottom:3px}

.tm-mega__foot{grid-column:1/-1; display:flex; gap:22px; flex-wrap:wrap; padding-top:18px; margin-top:4px;
  border-top:1px solid var(--tm-line)}
.tm-mega__foot a{font-size:12.5px; color:var(--tm-grey)!important; display:flex; align-items:center; gap:7px}
.tm-mega__foot a:hover{color:var(--tm-blue)!important}

.tm-ver{display:inline-flex; align-items:center; gap:7px; margin-top:14px; font-size:12.8px; font-weight:600;
  color:var(--tm-blue)!important; border-bottom:1px solid var(--tm-blue); padding-bottom:2px}

/* ============================================================
   MENÚ MÓVIL
   Pensado para el pulgar: filas de 52-60 px, textos de 16-18 px,
   buscador arriba y la cuenta en el pie. Por encima de cualquier
   botón flotante de otros módulos (WhatsApp, traductor…).
   ============================================================ */
.tm-mnav{position:fixed; inset:0; z-index:2147483000; background:#fff; transform:translateX(-100%); visibility:hidden;
  transition:transform .3s cubic-bezier(.2,.8,.3,1),visibility 0s .3s; display:flex; flex-direction:column;
  overscroll-behavior:contain; -webkit-text-size-adjust:100%}
.tm-mnav.is-open{transform:translateX(0); visibility:visible; transition:transform .3s cubic-bezier(.2,.8,.3,1)}

.tm-mnav__t{display:flex; justify-content:space-between; align-items:center; flex:none; height:60px;
  padding:0 8px 0 20px; margin-top:env(safe-area-inset-top,0px)}
.tm-mnav__logo img{height:26px; width:auto; display:block}
.tm-mnav__x{width:48px; height:48px; display:grid; place-items:center; border-radius:50%!important; color:var(--tm-ink)!important}
.tm-mnav__x:active{background:var(--tm-tile)!important}

.tm-mnav__s{flex:none; padding:4px 20px 12px}
.tm-mnav__search{display:flex!important; align-items:center; gap:12px; width:100%; height:50px; padding:0 16px!important;
  border-radius:14px!important; background:var(--tm-tile)!important; color:var(--tm-grey)!important; text-align:left;
  font-size:16px!important; letter-spacing:0!important}
.tm-mnav__search svg{color:var(--tm-ink); flex:none}
.tm-mnav__search span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

.tm-mnav__l{flex:1; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:0 20px 20px}
.tm-mnav__sec{border-bottom:1px solid var(--tm-line)}
.tm-mnav__b{width:100%; min-height:60px; display:flex!important; align-items:center; gap:10px; padding:0 2px!important;
  text-align:left; color:var(--tm-ink)!important; -webkit-tap-highlight-color:transparent}
.tm-mnav__n{font-size:18.9px!important; font-weight:600; letter-spacing:-.02em; line-height:1.2}
.tm-mnav__b small{font-size:9.3px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:var(--tm-blue);
  padding:4px 7px; border-radius:5px; font-weight:700; flex:none; line-height:1.2}
.tm-mnav__b small.is-hot{background:var(--tm-ink)}
.tm-mnav__chev{margin-left:auto; flex:none; color:var(--tm-grey); transition:transform .25s}
.tm-mnav__sec.is-open .tm-mnav__b{color:var(--tm-blue)!important}
.tm-mnav__sec.is-open .tm-mnav__chev{transform:rotate(180deg); color:var(--tm-blue)}

.tm-mnav__p{max-height:0; overflow:hidden; transition:max-height .35s ease}
.tm-mnav__sec.is-open .tm-mnav__p{max-height:1600px; padding-bottom:14px}
.tm-mnav__g + .tm-mnav__g{margin-top:10px}
.tm-mnav__g h5{font-size:10.9px!important; letter-spacing:.1em; text-transform:uppercase; color:var(--tm-grey)!important;
  font-weight:700!important; margin:6px 0 2px!important; line-height:1.4; padding:0 12px}
.tm-mnav__g ul{display:grid}
.tm-mnav__g li{margin:0}
.tm-mnav__g a{display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; padding:0 12px;
  border-radius:10px; font-size:16px; color:var(--tm-ink)!important; -webkit-tap-highlight-color:transparent}
.tm-mnav__g a.is-all span{font-weight:600}
.tm-mnav__g a em{font-style:normal; font-size:13.1px; color:var(--tm-grey); font-variant-numeric:tabular-nums}
.tm-mnav__g a:active{background:var(--tm-tile); color:var(--tm-blue)!important}
.tm-mnav__p .tm-ver{margin:8px 12px 0}

.tm-mnav__extra{display:flex; flex-wrap:wrap; gap:8px 20px; padding:22px 2px 6px}
.tm-mnav__extra a{font-size:14.1px; color:var(--tm-grey)!important; text-decoration:underline!important;
  text-underline-offset:3px; text-decoration-color:var(--tm-line)!important}

/* Pie: la cuenta */
.tm-mnav__f{flex:none; background:var(--tm-tile); padding:14px 20px calc(14px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--tm-line)}
.tm-mnav__who{display:flex; align-items:center; gap:12px; margin-bottom:12px}
.tm-mnav__who div b{display:block; font-size:15.7px; font-weight:600; line-height:1.2}
.tm-mnav__who div span{display:block; font-size:12.5px; color:var(--tm-grey)}
.tm-mnav__who .tm-acc__av{background:#fff}
.tm-mnav__out{margin-left:auto; font-size:13.6px; font-weight:600; color:var(--tm-grey)!important; padding:12px 4px}
.tm-mnav__tiles{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.tm-mnav__tiles a{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:72px;
  padding:10px 4px; border-radius:12px; background:#fff; text-align:center; color:var(--tm-ink)!important;
  font-size:11.5px; font-weight:600; line-height:1.2; -webkit-tap-highlight-color:transparent}
.tm-mnav__tiles a .tm-i{width:22px; height:22px; color:var(--tm-blue)}
.tm-mnav__tiles a:active{background:var(--tm-blue); color:#fff!important}
.tm-mnav__tiles a:active .tm-i{color:#fff}
.tm-mnav__guest{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.tm-mnav__guest .tm-btn{height:48px}

/* ============================================================
   CARRITO FLOTANTE
   Colores propios con !important: el tema no debe teñirlo
   ============================================================ */
.tm-fcart{position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:1030; width:54px; height:54px;
  display:none; place-items:center; padding:0!important; margin:0!important; cursor:pointer;
  background:#fff!important; color:var(--tm-ink)!important; border:1px solid var(--tm-line)!important; border-right:0!important;
  border-radius:14px 0 0 14px!important; box-shadow:0 12px 34px -20px rgba(0,0,0,.45)!important;
  font-family:var(--tm-sans); transition:background .18s, color .18s, width .18s}
.tm-fcart.is-on{display:grid}
.tm-fcart svg{display:block; color:inherit!important; stroke:currentColor!important; fill:none!important}
.tm-fcart:hover,.tm-fcart:focus-visible{background:var(--tm-blue)!important; color:#fff!important;
  border-color:var(--tm-blue)!important; outline:none}
.tm-fcart__n{position:absolute; top:6px; right:6px; display:grid; place-items:center; min-width:17px; height:17px;
  padding:0 4px; border-radius:100px; background:var(--tm-blue)!important; color:#fff!important;
  font-size:9.3px; font-weight:700; line-height:1; transition:background .18s, color .18s}
.tm-fcart:hover .tm-fcart__n,.tm-fcart:focus-visible .tm-fcart__n{background:#fff!important; color:var(--tm-blue)!important}
.tm-fcart.is-pop{animation:tmpop .5s ease}
@keyframes tmpop{0%{background:var(--tm-blue); color:#fff}100%{background:#fff; color:var(--tm-ink)}}

/* ============================================================
   CAJÓN DE CARRITO
   ============================================================ */
.tm-drawer{position:fixed; inset:0; z-index:2147483100; font-family:var(--tm-sans); color:var(--tm-ink); line-height:1.5}
.tm-drawer *{box-sizing:border-box}
.tm-drawer a{text-decoration:none!important}
.tm-drawer :where(button){font:inherit; cursor:pointer; border:0; background:none; padding:0; margin:0; color:inherit;
  text-transform:none; letter-spacing:inherit; box-shadow:none}
.tm-drawer__bg{position:absolute; inset:0; background:rgba(0,0,0,.35); opacity:0; transition:opacity .28s}
.tm-drawer__box{position:absolute; top:0; right:0; bottom:0; width:min(470px,100%); background:#fff;
  display:flex; flex-direction:column; border-radius:22px 0 0 22px; transform:translateX(100%);
  transition:transform .32s cubic-bezier(.2,.8,.3,1)}
.tm-drawer.is-open .tm-drawer__bg{opacity:1}
.tm-drawer.is-open .tm-drawer__box{transform:none}
.tm-drawer__x{position:absolute; top:44px; left:-26px; width:52px; height:52px; border-radius:50%!important;
  background:#fff!important; display:grid; place-items:center; font-size:17.6px; color:var(--tm-ink)!important;
  box-shadow:0 6px 22px -8px rgba(0,0,0,.35)!important; z-index:3}
.tm-drawer__x:hover{background:var(--tm-ink)!important; color:#fff!important}
.tm-drawer__ok{margin:18px 26px 0; background:var(--tm-blue); color:#fff; padding:10px 14px; font-size:9.9px;
  letter-spacing:.1em; text-transform:uppercase; font-weight:600; border-radius:8px}
.tm-drawer__err{margin:14px 26px 0; padding:10px 14px; font-size:12.8px; border-radius:8px; background:#FDECEC; color:#9B1C1C}
.tm-drawer__ship{padding:26px 26px 18px; font-size:13.1px}
.tm-drawer__ship b{font-weight:600}
.tm-drawer__bar{height:3px; background:#E8E5E1; margin-top:12px; overflow:hidden; border-radius:3px}
.tm-drawer__bar i{display:block; height:100%; width:0; background:var(--tm-blue); transition:width .45s}
.tm-drawer__b{flex:1; overflow:auto; overscroll-behavior:contain; padding:0 26px; transition:opacity .2s}
.tm-drawer.is-busy .tm-drawer__b,.tm-drawer.is-busy .tm-drawer__up{opacity:.5; pointer-events:none}
.tm-drawer.is-loading .tm-drawer__b:empty{min-height:180px; background:linear-gradient(90deg,#F1EFEC 25%,#F8F7F5 50%,#F1EFEC 75%)
  0 0/200% 100%; animation:tmsk 1.2s linear infinite; border-radius:12px; margin:0 26px; padding:0}
@keyframes tmsk{to{background-position:-200% 0}}

.tm-dline{display:grid; grid-template-columns:96px 1fr auto; gap:16px; padding:16px 0; align-items:start;
  transition:opacity .2s}
.tm-dline.is-out{opacity:.35}
.tm-dline__img{display:block; width:96px; aspect-ratio:1; border-radius:10px; overflow:hidden; background:var(--tm-tile)}
.tm-dline__img img{width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; display:block}
.tm-dline__n{display:block; font-size:11.8px; letter-spacing:.05em; text-transform:uppercase; font-weight:600;
  color:var(--tm-ink)!important; line-height:1.35}
.tm-dline__n:hover{color:var(--tm-blue)!important}
.tm-dline__m{font-size:12px; color:var(--tm-grey); margin:4px 0}
.tm-dline__r{display:grid; justify-items:end; gap:14px}
.tm-qty{display:inline-flex; align-items:center; border:1px solid var(--tm-line); border-radius:8px; height:32px}
.tm-qty button{width:30px; height:100%; font-size:15.2px; color:var(--tm-ink)!important}
.tm-qty button:hover{color:var(--tm-blue)!important}
.tm-qty button:disabled{opacity:.3; cursor:default}
.tm-qty span{min-width:22px; text-align:center; font-size:12.5px; font-variant-numeric:tabular-nums}
.tm-rm{font-size:10.2px!important; letter-spacing:.08em!important; text-transform:uppercase!important; color:var(--tm-grey)!important;
  border-bottom:1px solid var(--tm-line)!important}
.tm-rm:hover{color:var(--tm-ink)!important; border-color:var(--tm-ink)!important}
.tm-drawer__empty{padding:40px 0; display:grid; justify-items:start; gap:16px; font-size:15.2px; color:var(--tm-grey)}

.tm-drawer__up{padding:18px 26px; border-top:1px solid var(--tm-line); transition:opacity .2s}
.tm-uprow{display:flex; gap:14px; align-items:center; margin-top:12px}
.tm-uprow img{width:70px; aspect-ratio:1; object-fit:cover; background:var(--tm-tile); border-radius:10px; display:block}
.tm-uprow div{flex:1; font-size:11.5px; letter-spacing:.05em; text-transform:uppercase; line-height:1.35}
.tm-uprow div a{color:var(--tm-ink)!important}
.tm-uprow span{display:block; color:var(--tm-grey); margin-top:3px}

.tm-drawer__f{padding:20px 26px calc(24px + env(safe-area-inset-bottom,0px)); background:var(--tm-tile)}
.tm-drawer__tot{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px}
.tm-drawer__tot b{font-size:24px; font-weight:600; letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.tm-drawer__2{display:flex; gap:8px; margin-top:8px}
.tm-drawer__2 > *{flex:1}
.tm-drawer.is-empty .tm-drawer__f .tm-btn--big{opacity:.4; pointer-events:none}

/* Botones (los de la demo) */
.tm-btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; height:48px; padding:0 22px!important;
  font-size:11.8px!important; letter-spacing:.09em!important; text-transform:uppercase!important; font-weight:600!important;
  background:var(--tm-blue)!important; color:#fff!important; border:1px solid var(--tm-blue)!important; border-radius:10px!important;
  transition:.16s; cursor:pointer; text-decoration:none!important; white-space:nowrap}
.tm-btn:hover{background:var(--tm-blue-d)!important; border-color:var(--tm-blue-d)!important; color:#fff!important}
.tm-btn--out{background:transparent!important; color:var(--tm-ink)!important; border-color:var(--tm-line)!important}
.tm-btn--out:hover{background:var(--tm-ink)!important; border-color:var(--tm-ink)!important; color:#fff!important}
.tm-btn--ink{background:var(--tm-ink)!important; border-color:var(--tm-ink)!important}
.tm-btn--ink:hover{background:#000!important; border-color:#000!important}
.tm-btn--sm{height:38px; padding:0 16px!important; font-size:9.9px!important; border-radius:9px!important}
.tm-btn--big{height:52px}
.tm-btn--full{width:100%}

/* ============================================================
   ICONOS
   ============================================================ */
.tm-i{width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round;
  stroke-linejoin:round; display:block}
.tm-i--sm{width:14px; height:14px}

/* Cliente identificado: inicial + nombre en lugar del muñeco */
.tm-hdr .tm-ico.tm-me{width:auto; height:34px; display:inline-flex; align-items:center; gap:7px;
  padding:0 9px 0 4px; margin:0 2px; border-radius:100px; transition:background .15s}
.tm-me__ini{display:grid; place-items:center; width:26px; height:26px; border-radius:50%; flex:none;
  background:#E8F6FD; color:var(--tm-blue); font-size:12px; font-weight:700; line-height:1}
.tm-me__nm{font-size:13px; font-weight:500; letter-spacing:0; color:var(--tm-ink); max-width:110px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.tm-me__car{color:var(--tm-grey); transition:transform .2s}
.tm-hdr .tm-ico.tm-me:hover,.tm-acc.is-open .tm-ico.tm-me{background:var(--tm-tile)}
.tm-hdr .tm-ico.tm-me:hover .tm-me__ini,.tm-acc.is-open .tm-me__ini{background:var(--tm-blue); color:#fff}
.tm-acc.is-open .tm-me__car{transform:rotate(180deg)}

/* ============================================================
   DESPLEGABLE DE CUENTA
   ============================================================ */
.tm-acc{position:relative}
.tm-acc__dd{position:absolute; top:calc(100% + 18px); right:-12px; width:290px; z-index:1045; background:#fff;
  border:1px solid var(--tm-line); border-radius:var(--tm-r); padding:8px;
  box-shadow:0 24px 48px -24px rgba(0,0,0,.3), 0 2px 6px rgba(0,0,0,.04);
  font-family:var(--tm-sans); animation:tmdd .16s ease}
@keyframes tmdd{from{opacity:0; transform:translateY(-4px)}}
.tm-acc__dd::before{content:''; position:absolute; top:-7px; right:20px; width:12px; height:12px; background:#fff;
  border-left:1px solid var(--tm-line); border-top:1px solid var(--tm-line); transform:rotate(45deg)}
.tm-acc.is-open > .tm-ico{color:var(--tm-blue)!important}
.tm-acc__hd{display:flex; align-items:center; gap:12px; padding:10px 10px 14px; margin-bottom:4px;
  border-bottom:1px solid var(--tm-line)}
.tm-acc__hd div b{display:block; font-size:15.2px; font-weight:600; letter-spacing:-.01em; line-height:1.25}
.tm-acc__hd div span{display:block; font-size:11.8px; color:var(--tm-grey); overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; max-width:190px}
.tm-acc__av,.tm-dash__av{display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:50%;
  background:#E8F6FD; color:var(--tm-blue); font-weight:700; font-size:16px}
.tm-acc__l{display:grid; gap:1px; padding:4px 0}
.tm-acc__l a,.tm-acc__out{display:flex; align-items:center; gap:12px; padding:10px; border-radius:9px;
  font-size:14.4px; color:var(--tm-ink)!important; transition:background .12s, color .12s}
.tm-acc__l a .tm-i,.tm-acc__out .tm-i{color:var(--tm-grey)}
.tm-acc__l a:hover,.tm-acc__l a:focus-visible{background:var(--tm-tile); color:var(--tm-blue)!important; outline:none}
.tm-acc__l a:hover .tm-i{color:var(--tm-blue)}
.tm-acc__out{margin-top:4px; border-top:1px solid var(--tm-line); border-radius:0 0 9px 9px; padding-top:12px;
  color:var(--tm-grey)!important}
.tm-acc__out:hover,.tm-acc__out:focus-visible{background:#FDECEC; color:#9B1C1C!important; outline:none}
.tm-acc__out:hover .tm-i{color:#9B1C1C}
.tm-acc__guest{padding:12px}
.tm-acc__guest b{display:block; font-size:16px; font-weight:600; letter-spacing:-.01em}
.tm-acc__guest p{margin:6px 0 14px; font-size:13.1px; color:var(--tm-grey); line-height:1.5}
.tm-acc__reg{display:block; text-align:center; margin-top:12px; font-size:12.8px; color:var(--tm-blue)!important}
.tm-acc__reg:hover{text-decoration:underline!important}

/* ============================================================
   ÁREA «MI CUENTA»
   ============================================================ */
.tm-dash{font-family:var(--tm-sans); color:var(--tm-ink); line-height:1.5}
.tm-dash *{box-sizing:border-box}
.tm-dash a{text-decoration:none!important}
.tm-dash__hero{display:flex; align-items:center; gap:18px; padding:24px; border-radius:18px;
  background:linear-gradient(135deg,#E8F6FD 0%,#F6FBFE 60%,#fff 100%); border:1px solid #D6EEFA; margin-bottom:22px}
.tm-dash__hero .tm-dash__av{width:56px; height:56px; font-size:21.6px; background:#fff;
  box-shadow:0 6px 16px -10px rgba(0,152,216,.6)}
.tm-dash__hero h2{margin:2px 0 0!important; font-family:var(--tm-sans)!important; font-size:clamp(22.4px,2.4vw,30.4px)!important;
  font-weight:600!important; letter-spacing:-.03em; line-height:1.1; color:var(--tm-ink)!important; text-transform:none!important}
.tm-dash__hero p{margin:4px 0 0; font-size:13.4px; color:var(--tm-grey)}
.tm-dash__out{margin-left:auto}

.tm-dash__quick{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-bottom:30px}
.tm-dash__q{display:flex; align-items:center; gap:12px; padding:16px 18px; border-radius:var(--tm-r);
  background:var(--tm-ink); color:#fff!important; transition:transform .16s, background .16s}
.tm-dash__q b{flex:1; font-size:14.4px; font-weight:600}
.tm-dash__q:hover{background:var(--tm-blue); transform:translateY(-2px)}

.tm-dash__t{display:block; margin-bottom:12px}
.tm-dash__grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px}
.tm-dash__card{display:flex; flex-direction:column; gap:6px; padding:18px; border:1px solid var(--tm-line);
  border-radius:var(--tm-r); background:#fff; color:var(--tm-ink)!important;
  transition:border-color .16s, box-shadow .16s, transform .16s}
.tm-dash__card b{font-size:14.7px; font-weight:600; letter-spacing:-.01em; line-height:1.3}
.tm-dash__card span{font-size:12.2px; color:var(--tm-grey); line-height:1.4}
.tm-dash__ic{display:grid !important; place-items:center; width:40px; height:40px; border-radius:10px;
  background:var(--tm-tile); color:var(--tm-ink); margin-bottom:6px; transition:background .16s, color .16s}
.tm-dash__card:hover,.tm-dash__card:focus-visible{border-color:var(--tm-blue); outline:none;
  box-shadow:0 14px 30px -22px rgba(0,152,216,.8); transform:translateY(-2px)}
.tm-dash__card:hover .tm-dash__ic{background:var(--tm-blue); color:#fff}

/* La página del tema, con nuestro aire */
body.tm-account #main .page-header{display:none}
body.tm-account .my-account-page-content{padding-top:4px}
body.tm-account .my-account-side-links{font-family:var(--tm-sans); border:1px solid var(--tm-line)!important;
  border-radius:var(--tm-r); padding:8px!important; background:#fff; align-self:flex-start}
body.tm-account .my-account-side-links > a,
body.tm-account .my-account-side-links > div{display:block; width:100%!important; max-width:none!important; float:none!important;
  padding:0!important; margin:0!important; border:0!important}
body.tm-account .my-account-side-links .link-item,
body.tm-account .my-account-side-links > div > a.link-item{display:flex!important; align-items:center; gap:12px;
  padding:10px 12px!important; margin:0!important; border:0!important; border-radius:9px; font-size:14.1px!important;
  color:var(--tm-ink)!important; text-transform:none!important; letter-spacing:0!important; background:none!important;
  text-align:left!important; flex-direction:row!important; line-height:1.35!important}
body.tm-account .my-account-side-links i{color:var(--tm-grey)!important; font-size:15px!important; width:18px;
  margin:0!important; text-align:center; flex:none}
body.tm-account .my-account-side-links a:hover .link-item,
body.tm-account .my-account-side-links a.link-item:hover,
body.tm-account .my-account-side-links a.is-on .link-item{background:var(--tm-tile)!important; color:var(--tm-blue)!important}
body.tm-account .my-account-side-links .tm-i{color:var(--tm-grey); flex:none}
body.tm-account .my-account-side-links a:hover i,
body.tm-account .my-account-side-links a.link-item:hover i,
body.tm-account .my-account-side-links a:hover .tm-i,
body.tm-account .my-account-side-links a.is-on .tm-i{color:var(--tm-blue)!important}
body.tm-account .my-account-side-links a[href*="mylogout"] .link-item{color:var(--tm-grey)!important;
  border-top:1px solid var(--tm-line)!important; border-radius:0 0 9px 9px; margin-top:4px!important}

/* Resto de páginas de cliente: botones y campos con los colores de la marca */
body.page-customer-account #main .btn-primary,
body.page-customer-account #main button[type=submit].btn{background:var(--tm-blue)!important; border-color:var(--tm-blue)!important;
  color:#fff!important; border-radius:10px!important; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  font-size:11.8px; padding:12px 22px}
body.page-customer-account #main .btn-primary:hover,
body.page-customer-account #main button[type=submit].btn:hover{background:var(--tm-blue-d)!important; border-color:var(--tm-blue-d)!important}
body.page-customer-account #main .form-control{border-radius:9px!important; border-color:var(--tm-line)!important; min-height:44px}
body.page-customer-account #main .form-control:focus{border-color:var(--tm-blue)!important; box-shadow:0 0 0 3px rgba(0,152,216,.15)!important}
body.page-customer-account #main .page-title{font-family:var(--tm-sans); font-weight:600; letter-spacing:-.02em}

@media (max-width:767px){
  .tm-acc__dd{position:fixed; top:calc(var(--tm-hdr,62px) + 6px); left:12px; right:12px; width:auto; z-index:2147482900}
  .tm-acc__dd::before{display:none}
  .tm-dash__hero{flex-wrap:wrap; padding:18px}
  .tm-dash__out{margin-left:0; width:100%}
  .tm-dash__grid{grid-template-columns:1fr 1fr}
  /* En el móvil las tarjetas ya llevan a todas las secciones */
  body.tm-account .my-account-side-links{display:none!important}
  body.tm-account .my-account-page-content{width:100%!important; max-width:100%!important; flex:0 0 100%!important}
  .tm-dash__card{padding:14px}
}

/* ============================================================
   GUÍA DE TALLAS
   ============================================================ */
.tm-modal{position:fixed; inset:0; z-index:2147483200}
.tm-modal__bg{position:absolute; inset:0; background:rgba(0,0,0,.4)}
.tm-modal__box{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:16px;
  width:min(660px,94vw); max-height:86vh; overflow:auto; padding:clamp(24px,3.4vw,40px)}
.tm-modal__x{position:absolute; top:14px; right:16px; width:32px; height:32px; font-size:17.6px}
.tm-modal__h{margin-top:10px!important; font-size:clamp(22.4px,2.4vw,32px)!important; font-weight:600!important;
  letter-spacing:-.03em; line-height:1.05; color:var(--tm-ink)}
.tm-modal__p{margin:12px 0 0; font-size:15px; color:var(--tm-grey); line-height:1.7; max-width:52ch}
.tm-calc{margin-top:22px; padding:18px; background:var(--tm-tile)}
.tm-calc input[type=range]{width:100%; accent-color:var(--tm-blue); margin:14px 0 4px}
.tm-calc__ends{display:flex; justify-content:space-between; font-size:10.6px; color:var(--tm-grey)}
.tm-calc__out{display:flex; align-items:baseline; gap:12px; margin-top:16px}
.tm-calc__out b{font-size:41.6px; font-weight:600; letter-spacing:-.04em; color:var(--tm-blue); line-height:1}
.tm-calc__stage{font-size:12.5px; color:var(--tm-grey); margin-top:3px}
.tm-tbl{width:100%; border-collapse:collapse; margin-top:18px; font-size:12.8px}
.tm-tbl th,.tm-tbl td{padding:10px; text-align:left; border-bottom:1px solid var(--tm-line)}
.tm-tbl th{font-size:9.6px; letter-spacing:.1em; text-transform:uppercase; color:var(--tm-grey); font-weight:600}
.tm-tbl tr:hover td{background:#E8F6FD}
.tm-modal__s{font-size:11.5px; color:var(--tm-grey); margin:14px 0 0}

body.tm-lock{overflow:hidden}

/* ============================================================
   RESPONSIVE (mismos cortes que la demo)
   ============================================================ */
@media (max-width:1180px){
  .tm-nav,.tm-megawrap,.tm-dd{display:none!important}
  .tm-burger{display:grid}
  /* Zonas de toque de 44 px aunque el icono sea pequeño */
  .tm-hdr__in{gap:4px; padding-inline:6px 8px}
  .tm-hdr__l{gap:2px}
  .tm-hdr__r{gap:0}
  .tm-burger,.tm-hdr .tm-ico{width:44px; height:44px; display:grid; place-items:center}
  .tm-burger svg{width:22px; height:22px}
  .tm-hdr .tm-ico svg{width:21px; height:21px}
  .tm-ico__n{top:5px; right:3px; min-width:16px; height:16px; padding:0 4px; border-radius:100px; display:grid;
    place-items:center; background:var(--tm-blue); color:#fff; font-size:9.6px}
  .tm-ico__dot{top:10px; right:10px}
  /* En el móvil, solo la inicial dentro de la zona de toque de 44 px */
  .tm-hdr .tm-ico.tm-me{width:44px; height:44px; padding:0; margin:0; justify-content:center; background:none}
  .tm-me__nm,.tm-me__car{display:none}
}
@media (max-width:900px){
  /* Carrito flotante: botón redondo abajo a la derecha */
  .tm-fcart{right:14px; bottom:calc(14px + env(safe-area-inset-bottom,0px)); top:auto; transform:none; width:52px; height:52px;
    background:var(--tm-blue)!important; color:#fff!important; border:0!important; border-radius:50%!important}
  .tm-fcart:hover,.tm-fcart:focus-visible{background:var(--tm-blue-d)!important}
  .tm-fcart__n{top:-5px; right:-5px; background:#fff!important; color:var(--tm-blue)!important; border:1px solid var(--tm-blue)}
  .tm-fcart.is-pop{animation:tmpopm .4s ease}
  @keyframes tmpopm{from{opacity:0; transform:translateY(16px)}}
  .tm-drawer__box{border-radius:0; width:100%}
  .tm-drawer__x{top:calc(14px + env(safe-area-inset-top,0px)); left:auto; right:16px; box-shadow:none!important;
    background:var(--tm-tile)!important; width:40px; height:40px}
  .tm-drawer__ship,.tm-drawer__b,.tm-drawer__up,.tm-drawer__f{padding-left:18px; padding-right:18px}
  .tm-drawer__ship{padding-top:22px; padding-right:70px}
  .tm-drawer__ok{margin:16px 70px 0 18px}
  .tm-dline{grid-template-columns:74px 1fr; gap:12px}
  .tm-dline__img{width:74px}
  .tm-dline__r{grid-column:2; justify-items:start; grid-auto-flow:column; align-items:center; gap:16px}
  .tm-search{position:fixed; inset:0; top:0; z-index:1065; display:flex; flex-direction:column; border:0; box-shadow:none}
  .tm-search__f{flex:none; padding:10px 14px; padding-top:calc(10px + env(safe-area-inset-top,0px)); gap:10px;
    border-bottom:1px solid var(--tm-line)}
  .tm-search__i{height:44px; font-size:16px!important; border-bottom:0!important}
  .tm-search__lupa{display:none}
  .tm-sr{flex:1; max-height:none}
  .tm-sr__in{grid-template-columns:1fr; gap:6px; padding:14px 14px calc(30px + env(safe-area-inset-bottom,0px))}
  .tm-sr__sec{margin-bottom:18px}
  .tm-sr__sug{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; margin:0 -14px!important; padding:0 14px!important}
  .tm-sr__sug::-webkit-scrollbar{display:none}
  .tm-sr__sug li + li{margin-top:0}
  .tm-sr__sug button{width:auto; white-space:nowrap; margin:0!important; border:1px solid var(--tm-line); border-radius:100px;
    padding:0 13px!important; height:34px; font-size:13.4px!important}
  .tm-sr__sug svg{display:none}
  .tm-sr__chips{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-left:-14px; margin-right:-14px; padding:0 14px}
  .tm-sr__chips::-webkit-scrollbar{display:none}
  .tm-chip{flex:none}
  .tm-sr__grid{grid-template-columns:1fr 1fr; gap:18px 12px}
  .tm-sr__sort select{max-width:150px}
  body.tm-lock-s{overflow:hidden}
  /* La cabecera sube por encima de la barra de avisos mientras el buscador ocupa la pantalla */
  body.tm-lock-s .tm-hdr{z-index:2147483050}
  .tm-modal__box{top:auto; bottom:0; left:0; transform:none; width:100%; max-height:88vh; border-radius:16px 16px 0 0;
    padding:24px 18px calc(24px + env(safe-area-inset-bottom,0px))}
  .tm-search__b{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tm-ann__l,.tm-mnav,.tm-mnav__p,.tm-promo img,.tm-nav__l::after,.tm-dd{transition:none!important}
}
