@charset "utf-8";
/* Concepto: tienda de fibra andina. Fotos en marcos trapezoidales (puerta inca),
   etiquetas "cosidas" con la finura en micras, una faja tejida como separador. */
:root {
  --lana: #F2ECE3;      /* fondo: alpaca cruda */
  --lana-2: #E7DDCF;    /* banda alterna */
  --carta: #FBF8F3;     /* superficie de tarjetas */
  --tinta: #2A1D16;     /* texto: café oscuro */
  --tinta-2: #6A5345;   /* texto secundario */
  --grana: #B3141C;     /* rojo de la marca */
  --sobre-grana: #FFFFFF;
  --vicuna: #9C6B3B;    /* acento cálido */
  --wa: #1A8F4C;
  --linea: rgba(42, 29, 22, .16);
  --sombra: rgba(42, 29, 22, .18);

  --f-display: "Young Serif", Georgia, "Times New Roman", serif;
  --f-texto: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-etiqueta: "IBM Plex Mono", ui-monospace, Menlo, monospace;

  --radio: 6px;
  --gutter-l: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --lana: #17110D; --lana-2: #211813; --carta: #1F1712;
    --tinta: #F1E8DC; --tinta-2: #BFAD9B;
    --grana: #E0454B; --sobre-grana: #1A0E0A; --vicuna: #D49B60; --wa: #2DB46A;
    --linea: rgba(241, 232, 220, .16); --sombra: rgba(0, 0, 0, .5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --lana: #17110D; --lana-2: #211813; --carta: #1F1712;
  --tinta: #F1E8DC; --tinta-2: #BFAD9B;
  --grana: #E0454B; --sobre-grana: #1A0E0A; --vicuna: #D49B60; --wa: #2DB46A;
  --linea: rgba(241, 232, 220, .16); --sombra: rgba(0, 0, 0, .5);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: var(--lana); color: var(--tinta);
  font-family: var(--f-texto); font-size: 16px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px);
  z-index: 60; background: var(--lana);
}
img { max-width: 100%; display: block; }
h1, h2, h3 { font-family: var(--f-display); font-weight: 400; line-height: 1.12; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(2.2rem, 5.2vw, 3.9rem); letter-spacing: -.01em; }
h2 { font-size: clamp(1.75rem, 3.4vw, 2.6rem); }
h3 { font-size: 1.3rem; }
p { margin: 0; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--vicuna); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: 1160px; margin: 0 auto; padding-left: var(--gutter-l); padding-right: var(--gutter-r); }
.eyebrow {
  font-family: var(--f-etiqueta); font-size: .76rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--vicuna); margin-bottom: .8rem;
}
.lead { font-size: 1.14rem; color: var(--tinta-2); max-width: 46ch; }

/* Barra de demo */
.demo-bar {
  background: var(--tinta); color: var(--lana); text-align: center;
  font-family: var(--f-etiqueta); font-size: .72rem; letter-spacing: .04em;
  padding-block: 7px; padding-left: var(--gutter-l); padding-right: var(--gutter-r);
}

/* Faja tejida */
.faja {
  height: 16px; background-color: #2A1D16;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16'%3E%3Crect width='32' height='16' fill='%232A1D16'/%3E%3Cpath d='M14 2h4v2h2v2h2v4h-2v2h-2v2h-4v-2h-2v-2h-2V6h2V4h2z' fill='%23B3141C'/%3E%3Crect x='15' y='7' width='2' height='2' fill='%23F2ECE3'/%3E%3Crect x='0' y='7' width='5' height='2' fill='%23C9A57E'/%3E%3Crect x='27' y='7' width='5' height='2' fill='%23C9A57E'/%3E%3C/svg%3E");
  background-size: 32px 16px;
}

/* Botones */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-family: var(--f-texto); font-weight: 600; font-size: 1rem; text-decoration: none;
  padding: .85rem 1.4rem; border-radius: 999px; border: 2px solid transparent;
  cursor: pointer; transition: transform .2s ease, opacity .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn svg { width: 18px; height: 18px; fill: currentColor; }
.btn--main { background: var(--grana); color: var(--sobre-grana); }
.btn--line { border-color: var(--tinta); color: var(--tinta); background: transparent; }
.btn--wa { background: var(--wa); color: #fff; }
.btn--sm { padding: .55rem 1rem; font-size: .9rem; }
.btn--full { width: 100%; }

/* Navegación */
.nav {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: var(--lana); border-bottom: 1px solid var(--linea);
}
.nav__in {
  max-width: 1160px; margin: 0 auto; display: flex; align-items: center; gap: 1.2rem;
  padding-block: 10px; padding-left: var(--gutter-l); padding-right: var(--gutter-r);
}
.marca { display: flex; align-items: center; gap: .6rem; text-decoration: none; }
.marca__escudo {
  width: 42px; height: 42px; border-radius: 50%; background: #FFFFFF;
  display: grid; place-items: center; flex: none; box-shadow: 0 0 0 1px var(--linea);
}
.marca__escudo img { width: 30px; height: auto; }
.marca__txt { font-family: var(--f-display); font-size: 1.35rem; line-height: 1; }
.marca__txt small {
  display: block; font-family: var(--f-etiqueta); font-size: .6rem; letter-spacing: .16em;
  text-transform: uppercase; color: var(--tinta-2); margin-top: 3px;
}
.nav__links { display: flex; gap: 1.4rem; margin-left: auto; }
.nav__links a { text-decoration: none; font-size: .93rem; font-weight: 500; color: var(--tinta-2); }
.nav__links a:hover { color: var(--tinta); }
.nav__acc { display: flex; align-items: center; gap: .7rem; }
.idioma { display: flex; border: 1px solid var(--linea); border-radius: 999px; padding: 2px; }
.idioma button {
  font: 600 .74rem var(--f-etiqueta); border: 0; background: transparent; color: var(--tinta-2);
  padding: .3rem .6rem; border-radius: 999px; cursor: pointer;
}
.idioma button.is-on { background: var(--tinta); color: var(--lana); }

/* Portada */
.hero__in {
  max-width: 1160px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr .9fr;
  gap: clamp(1.5rem, 4vw, 4rem); align-items: center;
  padding-block: clamp(2rem, 5vw, 4.5rem); padding-left: var(--gutter-l); padding-right: var(--gutter-r);
}
.hero__txt { min-width: 0; display: grid; gap: 1.3rem; }
.hero__txt .eyebrow { margin: 0; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: .8rem; }
.hero__datos {
  list-style: none; padding: 1.2rem 0 0; margin: .4rem 0 0; display: grid;
  grid-template-columns: repeat(3, auto); justify-content: start; gap: 2rem;
  border-top: 1px solid var(--linea);
}
.hero__datos li { display: grid; }
.hero__datos strong { font-family: var(--f-display); font-weight: 400; font-size: 1.4rem; }
.hero__datos span { font-size: .85rem; color: var(--tinta-2); }
.hero__foto { margin: 0; position: relative; justify-self: center; width: min(100%, 470px); min-width: 0; }
.vitrina { display: grid; gap: .8rem; }
.vitrina__pista {
  position: relative; display: flex; gap: 14px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: none; padding-inline: 9%; border-radius: 4px;
}
.vitrina__pista::-webkit-scrollbar { display: none; }
.vitrina__slide {
  flex: 0 0 82%; scroll-snap-align: center; aspect-ratio: 4 / 5; border: 0; padding: 0; cursor: pointer;
  background: var(--lana-2); clip-path: polygon(13% 0, 87% 0, 100% 100%, 0 100%);
  opacity: .4; transform: scale(.92); transition: opacity .45s ease, transform .45s ease;
}
.vitrina__slide.is-on { opacity: 1; transform: none; cursor: zoom-in; }
.vitrina__slide:focus-visible { opacity: 1; box-shadow: inset 0 0 0 5px var(--vicuna); }
.vitrina__slide img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.vitrina__pie { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-inline: 9%; }
.vitrina__pie .etiqueta { position: static; box-shadow: 0 6px 16px var(--sombra); min-width: 0; }
.etiqueta__precio { font-weight: 500; color: var(--grana) !important; }
.vitrina__flechas { display: flex; gap: .45rem; flex: none; }
.vitrina__flechas button {
  width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--linea); background: var(--carta);
  color: var(--tinta); font-size: 1.5rem; line-height: 1; cursor: pointer; transition: transform .2s ease;
}
.vitrina__flechas button:hover { transform: scale(1.08); }
.vitrina__puntos { display: flex; justify-content: center; flex-wrap: wrap; }
.vitrina__puntos button { width: 22px; height: 22px; border: 0; padding: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.vitrina__puntos button::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--linea); }
.vitrina__puntos button.is-on::before { width: 18px; border-radius: 4px; background: var(--grana); }
.vitrina__tip { text-align: center; font-size: .8rem; color: var(--tinta-2); }
.hero__marco {
  clip-path: polygon(13% 0, 87% 0, 100% 100%, 0 100%);
  background: var(--lana-2); aspect-ratio: 573 / 860; overflow: hidden;
}
.hero__marco img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }

/* Etiqueta cosida */
.etiqueta {
  position: absolute; left: -14px; bottom: 34px; background: var(--carta);
  font-family: var(--f-etiqueta); font-size: .74rem; padding: .55rem .8rem;
  border: 1px dashed var(--vicuna); outline: 4px solid var(--carta);
  display: grid; gap: 2px; box-shadow: 0 10px 24px var(--sombra);
}
.etiqueta span:first-child { font-weight: 500; }
.etiqueta span:last-child { color: var(--tinta-2); }

/* Gancho */
.gancho {
  position: relative; text-align: center; overflow: hidden;
  padding-block: clamp(3.5rem, 8vw, 6.5rem); padding-left: var(--gutter-l); padding-right: var(--gutter-r);
}
.hilo { position: absolute; left: 0; top: 50%; width: 100%; height: 160px; transform: translateY(-50%); }
.hilo path { fill: none; stroke: var(--grana); stroke-width: 2; opacity: .35; }
.gancho__frase {
  position: relative; font-family: var(--f-display); font-size: clamp(1.8rem, 4.2vw, 3.2rem);
  line-height: 1.18; max-width: 22ch; margin: 0 auto; text-wrap: balance;
}
.gancho__sub { position: relative; margin: 1.2rem auto 0; color: var(--tinta-2); max-width: 52ch; }

.gancho__foto { position: relative; margin: clamp(2rem, 5vw, 3.5rem) auto 0; max-width: 1160px; }
.gancho__foto img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: var(--radio); }
.aliado { margin-top: 1.4rem; padding: 1rem 1.1rem; border: 1px dashed var(--vicuna); background: var(--carta); display: grid; gap: .25rem; max-width: 46ch; }
.aliado__t { font-weight: 700; }
.aliado p:not(.aliado__t) { color: var(--tinta-2); font-size: .93rem; }

/* Secciones */
section[id] { scroll-margin-top: 80px; }
.sec-head { margin-bottom: 2.2rem; max-width: 640px; }
.sec-head__p { color: var(--tinta-2); margin-top: .8rem; max-width: 56ch; }
.sec-head--row { max-width: none; display: flex; justify-content: space-between; align-items: end; gap: 1rem; flex-wrap: wrap; }

.probador { background: var(--lana-2); padding-block: clamp(3rem, 6vw, 5rem); }
.pasos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.paso { display: grid; gap: .5rem; align-content: start; padding-top: 1.2rem; border-top: 2px solid var(--tinta); }
.paso__n { font-family: var(--f-etiqueta); font-size: .8rem; color: var(--grana); font-weight: 500; }
.paso p { color: var(--tinta-2); }

/* Catálogo */
.coleccion { padding-block: clamp(3rem, 6vw, 5rem); }
.filtros { display: flex; gap: .4rem; flex-wrap: wrap; }
.filtro {
  font: 500 .9rem var(--f-texto); padding: .45rem 1rem; border-radius: 999px; cursor: pointer;
  background: transparent; color: var(--tinta); border: 1px solid var(--linea);
}
.filtro.is-on { background: var(--tinta); color: var(--lana); border-color: var(--tinta); }
.grilla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem 1.5rem; }
.prod { display: grid; gap: .7rem; align-content: start; min-width: 0; }
.prod[hidden] { display: none !important; }
.prod__foto {
  position: relative; aspect-ratio: 4 / 5; background: var(--lana-2); overflow: hidden;
  border-radius: var(--radio); cursor: pointer; border: 0; padding: 0; width: 100%;
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .25s ease;
}
.prod__foto img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; transition: transform .5s ease; }
.prod__foto:hover img { transform: scale(1.04); }
.prod__badge {
  position: absolute; top: 10px; left: 10px; font: 500 .7rem var(--f-etiqueta);
  padding: .3rem .6rem; border-radius: 999px; background: var(--carta); color: var(--tinta);
}
.prod__badge--ultima { background: var(--grana); color: var(--sobre-grana); }
.prod__ref {
  position: absolute; bottom: 8px; right: 8px; font: .62rem var(--f-etiqueta); letter-spacing: .06em;
  background: rgba(0, 0, 0, .55); color: #fff; padding: .2rem .45rem; border-radius: 3px;
}
.prod__top { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; }
.prod__nombre { font-family: var(--f-display); font-size: 1.25rem; }
.prod__precio { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.prod__precio small { display: block; text-align: right; font-weight: 400; color: var(--tinta-2); font-size: .78rem; }
.prod__fibra {
  justify-self: start; font: .72rem var(--f-etiqueta); color: var(--tinta-2);
  border: 1px dashed var(--vicuna); padding: .25rem .5rem;
}
.prod__tallas { font-size: .85rem; color: var(--tinta-2); }
.prod__tallas b { color: var(--tinta); font-weight: 600; }
.prod__btn {
  justify-self: start; font: 600 .92rem var(--f-texto); background: none; border: 0; padding: 0;
  color: var(--grana); cursor: pointer; text-decoration: underline; text-underline-offset: 4px;
}
.nota-stock { display: flex; align-items: center; gap: .6rem; margin-top: 2rem; font-size: .9rem; color: var(--tinta-2); }
.punto { width: 9px; height: 9px; border-radius: 50%; background: var(--wa); flex: none; }

/* Regalos */
.regalos { padding-block: clamp(2.5rem, 5vw, 4rem); border-block: 1px solid var(--linea); }
.regalos__in { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: center; }
.regalos__lista { list-style: none; margin: 0; padding: 0; }
.regalos__lista li {
  display: flex; justify-content: space-between; gap: 1rem; padding-block: .85rem;
  border-bottom: 1px solid var(--linea); font-size: 1.05rem;
}
.precio-desde { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.precio-desde small { font-weight: 400; color: var(--tinta-2); }

/* Calidad */
.calidad { padding-block: clamp(3rem, 6vw, 5rem); }
.niveles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.nivel { background: var(--carta); padding: 1.6rem; border-radius: var(--radio); display: grid; gap: .6rem; align-content: start; }
.nivel__mic { font: 500 1.6rem var(--f-etiqueta); color: var(--grana); font-variant-numeric: tabular-nums; }
.nivel > p:not([class]) { color: var(--tinta-2); font-size: .95rem; }
.nivel__comp { font: .75rem var(--f-etiqueta); border-top: 1px dashed var(--vicuna); padding-top: .7rem; margin-top: .3rem; }
.cuidado { margin-top: 2.2rem; display: grid; grid-template-columns: auto 1fr; gap: 1.5rem; align-items: start; }
.cuidado ul { margin: 0; padding-left: 1.1rem; color: var(--tinta-2); display: grid; gap: .3rem; }

/* Historia */
.historia { background: var(--lana-2); padding-block: clamp(3rem, 6vw, 5rem); }
.historia__in { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(1.5rem, 5vw, 4.5rem); align-items: center; }
.historia__foto { margin: 0; }
.historia__foto img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 40%;
  clip-path: polygon(13% 0, 87% 0, 100% 100%, 0 100%);
}
.historia__foto figcaption { font: .72rem var(--f-etiqueta); color: var(--tinta-2); margin-top: .7rem; text-align: center; }
.historia__txt { display: grid; gap: 1rem; min-width: 0; }
.historia__txt .eyebrow { margin: 0; }
.historia__txt p:not(.eyebrow) { color: var(--tinta-2); font-size: 1.05rem; max-width: 56ch; }

/* A medida */
.medida { padding-block: clamp(2.5rem, 5vw, 4rem); }
.medida__in { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.medida__in > div { max-width: 640px; display: grid; gap: .6rem; }
.medida h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); }
.medida p { color: var(--tinta-2); }

/* FAQ */
.faq { padding-block: clamp(2.5rem, 5vw, 4rem) clamp(3rem, 6vw, 5rem); }
.faq .wrap { max-width: 820px; }
.faq h2 { margin-bottom: 1.4rem; }
details { border-bottom: 1px solid var(--linea); }
summary {
  cursor: pointer; padding-block: 1rem; font-weight: 600; list-style: none;
  display: flex; justify-content: space-between; gap: 1rem;
}
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; font-family: var(--f-etiqueta); color: var(--grana); }
details[open] summary::after { content: "–"; }
details p { padding-bottom: 1.1rem; color: var(--tinta-2); max-width: 64ch; }

/* Pie */
.pie { background: var(--tinta); color: var(--lana); }
.pie__in { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; padding-block: 2rem 5.5rem; }
.pie__marca { display: flex; align-items: center; gap: .9rem; }
.pie__marca p { font-size: .92rem; opacity: .85; }
.pie__wa { font-family: var(--f-etiqueta); font-size: .85rem; }
.sel { user-select: all; }

/* WhatsApp flotante */
.wa-flotante {
  position: fixed; z-index: 40; width: 58px; height: 58px; border-radius: 50%;
  right: calc(18px + env(safe-area-inset-right, 0px)); bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  background: var(--wa); color: #fff; display: grid; place-items: center;
  box-shadow: 0 8px 22px var(--sombra); transition: transform .2s ease;
}
.wa-flotante:hover { transform: scale(1.07); }
.wa-flotante svg { width: 30px; height: 30px; fill: currentColor; }

/* Ficha */
.ficha { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 16px; }
.ficha__fondo { position: absolute; inset: 0; background: rgba(15, 10, 7, .62); }
.ficha__caja {
  position: relative; background: var(--carta); color: var(--tinta); border-radius: 10px;
  width: min(940px, 100%); max-height: calc(100% - 8px); overflow: auto;
  display: grid; grid-template-columns: 1fr 1fr;
}
.ficha__x {
  position: absolute; top: 8px; right: 10px; z-index: 3; width: 38px; height: 38px; border-radius: 50%;
  border: 0; background: var(--carta); color: var(--tinta); font-size: 1.5rem; cursor: pointer; line-height: 1;
}
.ficha__foto { position: relative; overflow: hidden; background: var(--lana-2); cursor: zoom-in; min-height: 320px; touch-action: none; }
.ficha__foto img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; transition: transform .15s ease-out; transform-origin: 50% 50%; }
.ficha__foto.is-zoom img { transform: scale(2.3); }
.ficha__lupa-tip {
  position: absolute; left: 10px; bottom: 10px; font: .66rem var(--f-etiqueta);
  background: rgba(0, 0, 0, .6); color: #fff; padding: .3rem .55rem; border-radius: 3px;
}
.ficha__info { padding: 1.8rem; display: grid; gap: .65rem; align-content: start; min-width: 0; }
.ficha__info .eyebrow { margin: 0; }
.ficha__info h3 { font-size: 1.8rem; }
.ficha__precio { font-size: 1.3rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.ficha__precio small { font-weight: 400; color: var(--tinta-2); font-size: .9rem; }
.ficha__desc { color: var(--tinta-2); }
.ficha__comp { font: .75rem var(--f-etiqueta); border: 1px dashed var(--vicuna); padding: .45rem .6rem; justify-self: start; }
.ficha__lbl { font-weight: 600; font-size: .88rem; margin-top: .4rem; }
.tallas { display: flex; flex-wrap: wrap; gap: .45rem; }
.talla {
  min-width: 48px; padding: .5rem .7rem; border-radius: var(--radio); border: 1px solid var(--linea);
  background: transparent; color: var(--tinta); font: 600 .9rem var(--f-texto); cursor: pointer;
}
.talla.is-on { border-color: var(--tinta); box-shadow: inset 0 0 0 1px var(--tinta); }
.talla:disabled { opacity: .4; text-decoration: line-through; cursor: not-allowed; }
.talla small { display: block; font: 400 .62rem var(--f-etiqueta); color: var(--tinta-2); text-decoration: none; }
.campo {
  width: 100%; font: 1rem var(--f-texto); padding: .7rem .8rem; border-radius: var(--radio);
  border: 1px solid var(--linea); background: var(--lana); color: var(--tinta);
}
.campo + .campo { margin-top: 0; }
.check { display: flex; gap: .5rem; align-items: center; font-size: .92rem; margin-block: .2rem .4rem; }
.ficha__aviso { font-size: .78rem; color: var(--tinta-2); text-align: center; }

/* Responsivo */
@media (max-width: 960px) {
  .nav__links { display: none; }
  .grilla { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .hero__in { grid-template-columns: 1fr; }
  .hero__foto { width: min(100%, 420px); }
  .hero__datos { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
  .pasos, .niveles, .regalos__in, .historia__in { grid-template-columns: 1fr; }
  .historia__foto { max-width: 320px; }
  .cuidado { grid-template-columns: 1fr; gap: .6rem; }
  .ficha { padding: 0; place-items: end center; }
  .ficha__caja { grid-template-columns: 1fr; border-radius: 14px 14px 0 0; max-height: 92%; }
  .ficha__foto { aspect-ratio: 4 / 4; min-height: 0; }
  .gancho__foto img { aspect-ratio: 3 / 2; }
  .nav__acc .btn--wa span { display: none; }
}
@media (max-width: 440px) {
  .grilla { grid-template-columns: 1fr; }
  .marca__txt small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

[hidden] { display: none !important; }