/* ===== WAY · demo de cotización · paleta y tipografía propias sobre tokens.css + styles.css =====
   Editorial en hueso, con la serif Didone que ya vive en su logo. Contrastes medidos sobre #F4F1EC:
   tinta 16.1, gris 5.0, vino 9.2; y hueso sobre vino 9.2. Todos por encima de AA.
   La foto nunca lleva texto encima: el titular vive en la columna de al lado, que es lo que
   permite que sea HTML y no un JPG con las letras dentro.
   Modo noche: los mismos tokens invertidos bajo [data-tema="noche"]; gris 8.1 y vino 6.6 sobre tinta. */
:root{
  --w-bg:#F4F1EC; --w-bg2:#EAE5DD; --w-tinta:#171412; --w-gris:#6E655D;
  --w-vino:#7A1B24; --w-vino2:#5E141B;
  --w-line:rgba(23,20,18,.14); --w-line2:rgba(23,20,18,.3);
  --w-nav:rgba(244,241,236,.92); --w-fig1:#F2EEE7; --w-fig2:#E6E0D6; --w-fig3:#DAD3C7; --w-aviso:#4C453E;
  --w-sombra:rgba(23,20,18,.16);
  --font-display:'Bodoni Moda',Georgia,'Times New Roman',serif;
  --font-ui:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
[data-tema="noche"]{
  --w-bg:#171412; --w-bg2:#242019; --w-tinta:#F4F1EC; --w-gris:#B5ACA2;
  --w-vino:#D9737C; --w-vino2:#E38B93;
  --w-line:rgba(244,241,236,.16); --w-line2:rgba(244,241,236,.36);
  --w-nav:rgba(23,20,18,.9); --w-fig1:#2B2620; --w-fig2:#221E19; --w-fig3:#1C1915; --w-aviso:#B5ACA2;
  --w-sombra:rgba(0,0,0,.5);
  color-scheme:dark;
}
html{background:var(--w-bg)}
body{background:var(--w-bg);color:var(--w-tinta);font-family:var(--font-ui);font-size:16px;line-height:1.55;
  transition:background .3s,color .3s}
::selection{background:var(--w-vino);color:var(--w-bg)}
h1,h2,h3,.way-num{font-family:var(--font-display);font-weight:600;letter-spacing:-.015em}

/* ---- barra de la demo y navegación ---- */
.demo-bar{background:#171412;color:#F4F1EC}
.nav,.nav.is-scrolled,.nav.nav--light{background:var(--w-nav);color:var(--w-tinta);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--w-line)}
.nav .wrap{display:flex;align-items:center;gap:18px}
.way-marca{font-family:var(--font-display);font-weight:600;font-size:26px;letter-spacing:.16em;color:var(--w-tinta);
  text-decoration:none;margin-right:auto}
.way-marca small{display:block;font-family:var(--font-ui);font-size:9px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--w-gris);margin-top:1px}
.nav a{color:var(--w-tinta)}
.way-menu{display:flex;gap:26px;align-items:center}
.way-menu a{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--w-tinta);
  text-decoration:none;padding:6px 0;border-bottom:1px solid transparent;transition:border-color .25s}
.way-menu a:hover,.way-menu a:focus-visible{border-color:var(--w-vino)}
.way-menu a[aria-current="page"]{border-color:var(--w-tinta)}
.way-tema{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--w-line2);border-radius:50%;
  background:transparent;color:var(--w-tinta);cursor:pointer;transition:border-color .25s,background .25s}
.way-tema:hover,.way-tema:focus-visible{border-color:var(--w-tinta)}
.way-tema__luna{display:none}
[data-tema="noche"] .way-tema__sol{display:none}
[data-tema="noche"] .way-tema__luna{display:block}
.nav-overlay{background:var(--w-bg);color:var(--w-tinta)}
.nav-overlay nav a{font-family:var(--font-display);font-weight:600;font-size:clamp(30px,9vw,54px);
  line-height:1.08;letter-spacing:-.01em;color:var(--w-tinta)}
@media (max-width:1024px){.way-menu{display:none}}

/* ---- botones ----
   styles.css enrolla .btn__label hacia arriba al pasar el cursor y hace entrar una copia
   .btn__label--copy. Aqui no se emiten copias (hay botones que se generan por JS y seria
   facil olvidar alguna), asi que sin esto la etiqueta desaparecia justo al ir a pulsar. */
.btn:hover .btn__label,.btn:focus-visible .btn__label{transform:none;opacity:1}
.btn--solido{background:var(--w-tinta);color:var(--w-bg);border:1px solid var(--w-tinta)}
.btn--solido:hover,.btn--solido:focus-visible{background:var(--w-vino);border-color:var(--w-vino);color:#F4F1EC}
.btn--linea{background:transparent;color:var(--w-tinta);border:1px solid var(--w-line2)}
.btn--linea:hover,.btn--linea:focus-visible{border-color:var(--w-tinta);background:var(--w-bg2)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;
  font-size:13.5px;font-weight:500;letter-spacing:.03em;cursor:pointer;text-decoration:none;
  transition:background .25s,border-color .25s,color .25s}

/* ---- cabecera de cada página ---- */
.way-hero{padding-block:clamp(70px,13vh,130px) clamp(40px,7vh,70px)}
.way-hero--corta{padding-block:clamp(48px,9vh,90px) clamp(26px,4vh,40px)}
.way-hero__eyebrow{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--w-vino);margin:0 0 22px}
.way-hero h1{font-size:clamp(2.9rem,11vw,7.4rem);line-height:.94;margin:0;text-transform:uppercase}
.way-hero--corta h1{font-size:clamp(2.4rem,7vw,4.6rem)}
.way-hero h1 em{font-style:italic;font-weight:400}
.way-hero__lead{max-width:46ch;margin:26px 0 0;font-size:clamp(15px,1.6vw,18px);color:var(--w-gris)}
.way-hero__acc{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.way-datos{display:flex;flex-wrap:wrap;gap:0 34px;margin:42px 0 0;padding-top:22px;border-top:1px solid var(--w-line);
  list-style:none}
.way-datos li{font-size:13px;color:var(--w-gris);padding:5px 0}
.way-datos b{color:var(--w-tinta);font-weight:600}

/* ---- cinta ---- */
.way-tira{background:var(--w-tinta);color:var(--w-bg);padding-block:13px;overflow:hidden;margin-top:clamp(40px,7vh,70px)}
.way-tira .marquee__inner{gap:0;color:var(--w-bg);font-family:var(--font-display);font-size:13px}
.way-tira span{font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;padding:0 28px;white-space:nowrap}
.way-tira i{font-style:normal;color:var(--w-vino);filter:brightness(1.9)}

/* ---- look ---- */
.way-looks{padding-block:clamp(50px,8vh,90px) 0}
.way-look{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);
  align-items:start;padding:clamp(40px,7vh,80px) 0;border-top:1px solid var(--w-line)}
.way-look:first-child{border-top:0}
.way-look--der .way-look__media{order:2}
.way-look__media{position:sticky;top:calc(var(--nav-h,64px) + 20px)}
.way-marco{position:relative;border-radius:3px;overflow:hidden;background:var(--w-bg2)}
.way-foto{display:block;width:100%;height:auto}
.way-look__num{font-family:var(--font-display);font-size:13px;letter-spacing:.2em;color:var(--w-vino);margin:0 0 14px}
.way-look__t{font-size:clamp(2rem,4.6vw,3.5rem);line-height:1.02;margin:0 0 16px}
.way-look__mat{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--w-gris);margin:0 0 18px}
.way-look__lead{font-size:16px;color:var(--w-gris);margin:0 0 14px;max-width:46ch}
.way-col{font-size:14px;color:var(--w-gris);margin:0 0 18px}
.way-col b{color:var(--w-tinta);font-weight:600}
.way-look__precio{font-family:var(--font-display);font-size:30px;margin:0 0 20px}

/* ---- el punto sobre la prenda ---- */
.way-punto{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  width:16px;height:16px;padding:0;background:none;border:0;cursor:pointer;z-index:2}
.way-punto i{position:absolute;inset:0;border-radius:50%;
  background:#F4F1EC;box-shadow:0 0 0 1.5px rgba(23,20,18,.4),0 2px 10px rgba(0,0,0,.3)}
.way-punto i::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#7A1B24}
.way-punto span{position:absolute;top:50%;left:26px;transform:translateY(-50%) translateX(-6px);
  font-size:12px;letter-spacing:.02em;white-space:nowrap;padding:6px 12px;border-radius:999px;
  background:rgba(23,20,18,.9);color:#F4F1EC;opacity:0;
  transition:opacity .3s,transform .3s;pointer-events:none}
.way-punto[data-lado="izq"] span{left:auto;right:26px;transform:translateY(-50%) translateX(6px)}
.way-punto:hover span,.way-punto:focus-visible span{opacity:1;transform:translateY(-50%)}
.js:not(.reduced) .way-punto i::before{content:"";position:absolute;inset:-7px;border-radius:50%;
  border:1px solid rgba(244,241,236,.75);animation:wayLatir 2.4s ease-out infinite}
@keyframes wayLatir{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.5);opacity:0}}
@media (max-width:720px){.way-punto span{opacity:1;transform:translateY(-50%);font-size:11px;padding:5px 10px}}

/* ---- combina con ---- */
.way-comb{margin-top:34px;padding-top:26px;border-top:1px solid var(--w-line)}
.way-comb__t{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--w-gris);margin:0 0 16px}
.way-comb__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
/* Los <button> no heredan ni tipografia ni color: sin esto el nombre de la prenda salia
   en Arial y en el gris del sistema, casi invisible sobre el hueso. */
.way-mini,.way-cat__it,.way-punto,.nav__burger,.way-chip,.way-bolsa,.way-panel__velo,.way-filtro,.way-orden select{font-family:inherit}
.way-mini,.way-cat__it{font:inherit;color:inherit}
.way-mini{display:block;text-align:left;background:none;border:0;padding:0;cursor:pointer}
.way-mini img{width:100%;height:auto;border-radius:3px;display:block;background:var(--w-bg2);
  transition:opacity .3s}
.way-mini:hover img,.way-mini:focus-visible img{opacity:.82}
.way-mini__n{display:block;font-size:13.5px;margin-top:9px}
.way-mini__p{display:block;font-size:13.5px;color:var(--w-gris)}
.way-comb__nota{font-size:13.5px;color:var(--w-gris);margin:0 0 18px;font-style:italic}
.way-comb__pie{font-size:12px;color:var(--w-gris);margin:12px 0 0}

/* ---- secciones, catálogo, tienda, envíos ---- */
.way-sec{padding-block:clamp(50px,8vh,90px);border-top:1px solid var(--w-line)}
.way-sec--sin{border-top:0;padding-top:0}
.way-sec__t{font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.05;margin:0 0 12px}
.way-sec__lead{color:var(--w-gris);max-width:52ch;margin:0 0 34px}
.way-sec__cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 30px;margin-bottom:30px}
.way-sec__cab .way-sec__lead{margin:0}
.way-cat__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:22px 16px}
.way-cat__grid--full{grid-template-columns:repeat(4,1fr);gap:30px 20px}
.way-cat__it{display:block;text-align:left;background:none;border:0;padding:0;cursor:pointer}
.way-cat__it[hidden]{display:none}
.way-cat__foto{display:block;aspect-ratio:3/4;overflow:hidden;border-radius:3px;background:var(--w-bg2)}
.way-cat__foto img{width:100%;height:100%;object-fit:cover;display:block;background:var(--w-bg2);
  transition:opacity .3s,transform .5s ease}
.way-cat__it:hover img,.way-cat__it:focus-visible img{opacity:.86}
.way-cat__grid--full .way-cat__it:hover img{transform:scale(1.03)}
.way-cat__n{display:block;font-size:13px;margin-top:10px;line-height:1.3}
.way-cat__p{display:block;font-size:13px;color:var(--w-tinta);margin-top:2px}
.way-cat__d{display:block;font-size:11.5px;color:var(--w-gris);margin-top:3px;letter-spacing:.02em}
.way-cat__vacio{padding:40px 0;color:var(--w-gris)}
.way-cat__vacio[hidden]{display:none}
.way-cat__vacio button{background:none;border:0;padding:0;color:var(--w-tinta);font:inherit;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px}
@media (max-width:1024px){.way-cat__grid--full{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.way-cat__grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.way-cat__grid,.way-cat__grid--full{grid-template-columns:repeat(2,1fr);gap:22px 12px}}

/* filtros del catálogo: pegados arriba, con el conteo en vivo */
.way-filtros{position:sticky;top:0;z-index:5;background:var(--w-bg);padding:14px 0 12px;margin-bottom:26px;
  border-bottom:1px solid var(--w-line);display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px}
.way-filtros__grupo{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.way-filtros__lab{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--w-gris);margin-right:4px}
.way-filtro{font-size:12.5px;letter-spacing:.03em;color:var(--w-tinta);background:none;border:1px solid var(--w-line2);
  border-radius:999px;padding:7px 13px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.way-filtro small{font-size:11px;color:var(--w-gris);margin-left:5px}
.way-filtro:hover,.way-filtro:focus-visible{border-color:var(--w-tinta)}
.way-filtro[aria-pressed="true"]{background:var(--w-tinta);color:var(--w-bg);border-color:var(--w-tinta)}
.way-filtro[aria-pressed="true"] small{color:inherit;opacity:.75}
.way-orden{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--w-gris);margin-left:auto}
.way-orden select{font-size:12.5px;color:var(--w-tinta);background:var(--w-bg);border:1px solid var(--w-line2);
  border-radius:999px;padding:7px 12px}
.way-filtros__n{width:100%;margin:0;font-size:12.5px;color:var(--w-gris)}
.no-js .way-filtros{display:none}

.way-dos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);align-items:start}
.way-ficha-dato{border-top:1px solid var(--w-line);padding:16px 0;display:grid;grid-template-columns:130px 1fr;gap:16px}
.way-ficha-dato dt{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--w-gris)}
.way-ficha-dato dd{margin:0;font-size:15px}
@media (max-width:820px){.way-dos{grid-template-columns:1fr}}

/* ---- avance de "Arma tu look" en el inicio ---- */
.way-avance{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 14px}
.way-avance a{display:block;border-radius:3px;overflow:hidden;background:var(--w-bg2)}
.way-avance img{display:block;width:100%;height:auto;transition:transform .5s ease}
.way-avance a:hover img{transform:scale(1.03)}
.way-avance__pie{font-size:12px;color:var(--w-gris);margin:0}
.way-avance__pie a{color:var(--w-tinta);text-decoration:underline;text-underline-offset:3px}

/* ---- panel de la prenda ---- */
.way-panel{position:fixed;inset:0;z-index:60;display:grid;place-items:end;pointer-events:none}
.way-panel[hidden]{display:none}
.way-panel__velo{position:absolute;inset:0;background:rgba(23,20,18,.42);opacity:0;transition:opacity .35s;
  pointer-events:auto;border:0;padding:0;cursor:pointer}
.way-panel.abierto .way-panel__velo{opacity:1}
.way-panel__caja{position:relative;width:min(420px,100%);height:100%;background:var(--w-bg);color:var(--w-tinta);
  padding:26px 26px 30px;overflow-y:auto;pointer-events:auto;transform:translateX(100%);
  transition:transform .42s cubic-bezier(.22,1,.36,1);box-shadow:-18px 0 60px var(--w-sombra)}
.way-panel.abierto .way-panel__caja{transform:none}
.reduced .way-panel__caja{transition:none}
.way-panel__x{position:absolute;top:18px;right:18px;width:36px;height:36px;display:grid;place-items:center;
  border:1px solid var(--w-line);border-radius:50%;background:var(--w-bg);color:var(--w-tinta);cursor:pointer;z-index:2}
.way-panel__x:hover,.way-panel__x:focus-visible{border-color:var(--w-tinta)}
.way-panel__foto{position:relative;aspect-ratio:3/4;margin-bottom:20px;border-radius:3px;
  overflow:hidden;background:var(--w-bg2)}
.way-panel__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  opacity:1;transition:opacity .45s ease}
.way-panel__foto img.entrando{opacity:0}
.reduced .way-panel__foto img{transition:none}
.way-lab i{font-style:normal;color:var(--w-vino);letter-spacing:.04em;text-transform:none}
.way-panel h3{font-size:1.7rem;line-height:1.1;margin:0 0 6px}
.way-panel__mat{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--w-gris);margin:0 0 14px}
.way-panel__pr{font-family:var(--font-display);font-size:26px;margin:0 0 22px}
.way-lab{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--w-gris);margin:0 0 9px}
.way-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.way-chip{padding:8px 15px;border-radius:999px;border:1px solid var(--w-line2);background:transparent;
  color:var(--w-tinta);font-size:13px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.way-chip[aria-checked="true"]{background:var(--w-tinta);border-color:var(--w-tinta);color:var(--w-bg)}
.way-chip:hover,.way-chip:focus-visible{border-color:var(--w-tinta)}
.way-panel .btn{width:100%;justify-content:center}
.way-panel__tienda{display:inline-block;margin-top:16px;font-size:13px;color:var(--w-gris);
  text-decoration:underline;text-underline-offset:3px}
.way-panel__tienda:hover{color:var(--w-tinta)}
.way-panel__envio{font-size:13px;color:var(--w-gris);margin:18px 0 0;padding-top:16px;border-top:1px solid var(--w-line)}
@media (max-width:520px){
  .way-panel{place-items:end center}
  .way-panel__caja{width:100%;height:auto;max-height:88vh;transform:translateY(100%);border-radius:16px 16px 0 0}
}

/* ---- bolsa ---- */
.way-bolsa{position:fixed;right:clamp(14px,3vw,26px);bottom:calc(clamp(14px,3vw,26px) + 66px);z-index:55;
  display:flex;align-items:center;gap:9px;padding:11px 17px;border-radius:999px;border:1px solid var(--w-line2);
  background:var(--w-bg);color:var(--w-tinta);font-size:13px;cursor:pointer;
  box-shadow:0 6px 24px var(--w-sombra);transition:transform .3s,opacity .3s}
.way-bolsa[hidden]{display:none}
.way-bolsa b{font-weight:600}
.way-bolsa:hover,.way-bolsa:focus-visible{border-color:var(--w-tinta)}
.way-bolsa__n{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  background:var(--w-vino);color:#F4F1EC;font-size:11.5px;font-weight:600}
.way-lista{list-style:none;margin:0 0 18px;padding:0}
.way-lista li{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--w-line);
  font-size:14px}
.way-lista small{display:block;color:var(--w-gris);font-size:12.5px}
.way-lista button{background:none;border:0;color:var(--w-gris);cursor:pointer;font-size:12.5px;
  text-decoration:underline;text-underline-offset:3px;padding:0}
.way-lista button:hover{color:var(--w-vino)}
.way-total{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 20px;
  font-family:var(--font-display);font-size:22px}

/* ---- preguntas y pie ---- */
.faq details{border-top:1px solid var(--w-line)}
.faq summary{padding:18px 0;font-size:16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--w-vino);font-size:20px;line-height:1;
  transition:transform .3s;transform-origin:50% 50%}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details div{padding:0 0 20px;color:var(--w-gris);max-width:60ch}
.way-pie{border-top:1px solid var(--w-line);padding-block:38px 46px;color:var(--w-gris);font-size:13.5px}
.way-pie a{color:var(--w-tinta)}
.way-pie__nav{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 18px;padding:0;list-style:none}
.way-pie__nav a{text-decoration:none;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}
.wa-float{color:var(--wa-text)}

/* ---- Maniquí: "Arma tu look" ----
   La figura muestra un look pre-renderizado (la prenda de arriba puesta sobre la foto real de la
   de abajo, o el vestido sobre una foto de la modelo). Si a una combinación le falta su look, se
   apilan los recortes de las prendas en las coordenadas de su foto original. */
.way-mq{padding-block:clamp(30px,5vh,60px) clamp(50px,8vh,90px)}
.way-mq__esc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.way-mq__lin dd i{display:block;font-style:normal;font-size:12.5px;color:var(--w-gris);margin-top:4px;line-height:1.4}
.way-mq__figw{margin:0;width:min(360px,62vw)}
.way-mq__fig{position:relative;width:100%;aspect-ratio:600/800;border-radius:4px;
  background:radial-gradient(72% 58% at 50% 42%,var(--w-fig1) 0%,var(--w-fig2) 64%,var(--w-fig3) 100%);overflow:hidden}
.way-mq__look{position:absolute;inset:0}
.way-mq__look img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.way-mq__look img.on{opacity:1}
.reduced .way-mq__look img{transition:none}
.way-mq__capa{position:absolute;inset:0}
.way-mq__capa img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;transition:opacity .45s ease;filter:drop-shadow(0 14px 22px rgba(23,20,18,.18))}
.way-mq__capa img.on{opacity:1}
.reduced .way-mq__capa img{transition:none}
/* El gris de la marca a 11 px medía 3.84 sobre fondo claro, por debajo de AA. Este tono pasa de 6. */
.way-mq__aviso{margin:10px 0 0;padding:0 4px;font-size:11px;line-height:1.5;
  letter-spacing:.03em;color:var(--w-aviso);text-align:center}

.way-mq__datos dl{margin:0 0 20px}
.way-mq__lin{display:grid;grid-template-columns:74px 1fr auto;gap:10px 14px;align-items:baseline;
  padding:13px 0;border-top:1px solid var(--w-line)}
.way-mq__lin dt{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--w-gris)}
.way-mq__lin dd{margin:0;font-size:15.5px}
.way-mq__lin button{font-family:inherit;background:none;border:0;padding:0;cursor:pointer;color:var(--w-tinta);
  font-size:15.5px;text-align:left;text-decoration:underline;text-decoration-color:var(--w-line2);
  text-underline-offset:4px}
.way-mq__lin button:hover,.way-mq__lin button:focus-visible{text-decoration-color:var(--w-vino)}
.way-mq__lin span{font-size:15.5px;color:var(--w-gris);font-variant-numeric:tabular-nums}
.way-mq__tot{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:16px 0 20px;border-top:1px solid var(--w-tinta);font-family:var(--font-display);font-size:25px}
.way-mq__acc{display:flex;flex-wrap:wrap;gap:10px}
.way-mq__envio{font-size:13px;color:var(--w-gris);margin:0 0 18px;max-width:44ch}

.way-mq__sel{margin-top:clamp(26px,4vh,42px)}
.way-mq__zona{margin-bottom:20px}
.way-mq__zona[hidden]{display:none}
.way-mq__zona > p{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--w-gris);margin:0 0 11px}
.way-mq__fila{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  padding-bottom:3px;margin-right:calc(var(--pad-x) * -1);padding-right:var(--pad-x)}
.way-mq__fila::-webkit-scrollbar{display:none}
.way-mq__it{flex:0 0 auto;width:92px;font-family:inherit;color:inherit;background:none;border:0;padding:0;
  cursor:pointer;text-align:left}
.way-mq__it img{width:92px;height:123px;object-fit:cover;object-position:50% 40%;border-radius:3px;
  display:block;background:var(--w-bg2);border:2px solid transparent;transition:border-color .25s,opacity .25s}
.way-mq__it:hover img,.way-mq__it:focus-visible img{opacity:.84}
.way-mq__it[aria-pressed="true"] img{border-color:var(--w-tinta)}
.way-mq__it b{display:block;font-size:11.5px;font-weight:500;margin-top:7px;line-height:1.25}
.way-mq__it span{display:block;font-size:11.5px;color:var(--w-gris)}
.way-mq__estilos{display:flex;flex-wrap:wrap;gap:8px}
.way-mq__estilo{font-family:inherit;font-size:12.5px;letter-spacing:.04em;color:var(--w-tinta);background:none;
  border:1px solid var(--w-line2);border-radius:999px;padding:7px 14px;cursor:pointer;transition:background .2s,color .2s}
.way-mq__estilo:hover,.way-mq__estilo:focus-visible{border-color:var(--w-tinta)}
.way-mq__estilo[aria-pressed="true"]{background:var(--w-tinta);color:var(--w-bg);border-color:var(--w-tinta)}
@media (max-width:900px){
  .way-mq__esc{grid-template-columns:1fr;justify-items:center;gap:26px}
  .way-mq__datos{width:100%}
  .way-mq__figw{width:min(300px,70vw)}
  .way-avance{gap:8px}
}

/* ---- demo viva en el héroe: los looks pasan solos, se pueden guardar y cambiar ahí mismo ---- */
.way-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:clamp(28px,5vw,80px);align-items:center}
.way-vivo{width:100%;max-width:380px;margin:0 auto}
/* con la demo al lado, el titular baja de 11vw a 6vw para no meterse debajo de la foto */
.way-hero__grid h1{font-size:clamp(2.6rem,6vw,5.6rem);line-height:.96}
.way-hero__grid .way-hero__lead{max-width:40ch}
@media (max-width:1024px){.way-hero__grid h1{font-size:clamp(2.9rem,11vw,6rem)}}
.way-vivo__fig{position:relative;aspect-ratio:3/4;border-radius:6px;overflow:hidden;background:var(--w-bg2);box-shadow:0 30px 60px var(--w-sombra)}
.way-vivo__capa{position:absolute;inset:0}
.way-vivo__capa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}
.way-vivo__capa img.on{opacity:1}
.reduced .way-vivo__capa img{transition:none}
.way-vivo__btn{position:absolute;width:40px;height:40px;border-radius:50%;border:0;background:rgba(244,241,236,.94);color:#171412;
  display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 14px rgba(23,20,18,.18);transition:transform .2s,color .2s}
.way-vivo__btn:hover,.way-vivo__btn:focus-visible{transform:scale(1.06)}
.way-vivo__btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.way-vivo__cora{top:12px;right:12px}
.way-vivo__cora[aria-pressed="true"]{color:#7A1B24}
.way-vivo__cora[aria-pressed="true"] svg{fill:currentColor}
.way-vivo__play{bottom:12px;left:12px}
.way-vivo__play .p2{display:none}
.way-vivo__play[aria-pressed="false"] .p1{display:none}
.way-vivo__play[aria-pressed="false"] .p2{display:block}
.way-vivo__ia{position:absolute;right:12px;bottom:18px;margin:0;padding:5px 9px;border-radius:999px;font-size:10px;letter-spacing:.03em;
  background:rgba(23,20,18,.8);color:#F4F1EC}
.way-vivo__barra{position:absolute;left:0;right:0;top:0;height:3px;background:rgba(23,20,18,.12);z-index:2}
.way-vivo__barra i{display:block;height:100%;width:0;background:var(--w-vino)}
.way-vivo__ctl{margin-top:12px}
.way-vivo__fila{display:grid;grid-template-columns:50px 30px minmax(0,1fr) 30px;align-items:center;gap:6px;padding:6px 0;border-top:1px solid var(--w-line);font-size:12.5px}
.way-vivo__fila > span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--w-gris)}
.way-vivo__fila b{font-weight:500;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.way-vivo__fila button{width:30px;height:30px;border-radius:50%;border:1px solid var(--w-line2);background:none;color:var(--w-tinta);cursor:pointer;
  display:grid;place-items:center;font-family:inherit}
.way-vivo__fila button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.way-vivo__fila button:hover,.way-vivo__fila button:focus-visible{border-color:var(--w-tinta)}
.way-vivo__pie{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid var(--w-tinta);margin-top:2px;flex-wrap:wrap}
.way-vivo__pie > b{font-family:var(--font-display);font-size:20px;font-weight:600}
.way-vivo__acc{display:flex;gap:8px;align-items:center}
.way-vivo__ir,.way-vivo__mis{font-family:inherit;font-size:12px;letter-spacing:.03em;padding:7px 12px;border-radius:999px;border:1px solid var(--w-line2);
  color:var(--w-tinta);background:none;text-decoration:none;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center}
.way-vivo__ir:hover,.way-vivo__mis:hover,.way-vivo__ir:focus-visible,.way-vivo__mis:focus-visible{border-color:var(--w-tinta)}
.way-vivo__mis i{font-style:normal;display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:999px;
  background:var(--w-vino);color:#F4F1EC;font-size:10.5px;font-weight:600}
.way-vivo__mis i[data-n="0"]{display:none}
.way-mis li{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center}
.way-mis img{width:64px;height:85px;object-fit:cover;border-radius:3px;display:block;background:var(--w-bg2)}
.way-mis b{display:block;font-weight:500;font-size:14px}
.way-mis__acc{display:flex;gap:12px;margin-top:5px}
.way-mis__acc a,.way-mis__acc button{background:none;border:0;padding:0;font:inherit;font-size:12.5px;color:var(--w-gris);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.way-mis__acc a:hover,.way-mis__acc button:hover{color:var(--w-vino)}
@media (max-width:1024px){.way-hero__grid{grid-template-columns:1fr;gap:34px}.way-vivo{max-width:340px;margin:0}}
.no-js .way-vivo{display:none}

/* ---- sin JS y movimiento reducido ---- */
@media (max-width:900px){
  .way-look{grid-template-columns:1fr;gap:24px}
  .way-look--der .way-look__media{order:0}
  .way-look__media{position:static}
}
.reduced .way-punto i::before{animation:none}
.no-js .way-punto,.no-js .way-bolsa,.no-js .way-tema{display:none}