.f-barra { background: var(--paper); padding: 40px 0 3px; }
.f-barra--categoria { padding-bottom: 12px; }
.f-barra--categoria .p-buscar { width: 328px; }
.f-producto { background: var(--paper); padding: 30px 0 30px; }
.f-producto__in { display: grid; grid-template-columns: 600px 544px; column-gap: 80px; align-items: start; }
.f-galeria { min-width: 0; }
.f-galeria__marco {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  cursor: zoom-in;
}
.f-galeria__foto,
.f-galeria__foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.f-galeria__flecha {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 95px;
  padding: 0 0 0 20px;
  border: 0;
  background: none;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.f-galeria__flecha--izq { left: 0; }
.f-galeria__flecha--der { right: 0; padding: 0 20px 0 0; justify-content: flex-end; }
.f-galeria__flecha span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--paper) 20%, transparent);
  background: color-mix(in srgb, var(--ink) 30%, transparent);
  color: var(--paper);
}
.f-galeria__flecha svg { width: 20px; height: 20px; display: block; }
.f-galeria__flecha:focus-visible span { outline: 2px solid var(--paper); outline-offset: 2px; }
.f-galeria__puntos { display: none; }
.f-galeria__tira { position: relative; margin: 8px -1px 0 -3px; }
.f-galeria__minis {
  display: flex;
  max-width: 490px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.f-galeria__minis::-webkit-scrollbar { display: none; }
.f-galeria__mini {
  flex: none;
  width: 64px;
  height: 64px;
  margin: 3px;
  padding: 3px;
  border: 0;
  background: none;
  opacity: 0.65;
  cursor: pointer;
}
.f-galeria__mini img { display: block; width: 100%; height: 100%; object-fit: cover; }
.f-galeria__mini.is-activa { opacity: 1; border: 1px solid var(--ink); padding: 2px; }
.f-galeria__mas {
  position: absolute;
  top: 0;
  right: 0;
  width: 27px;
  height: 71px;
  border: 0;
  padding: 0;
  background: var(--paper);
  color: var(--brand);
  cursor: pointer;
}
.f-galeria__mas[hidden] { display: none; }
.f-galeria__mas svg { width: 16px; height: 16px; display: block; margin: 0 auto; }
.f-texto { padding-bottom: 32px; color: var(--brand); }
.f-texto__titulo {
  margin: 0 0 8px;
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: 48px;
  line-height: 62.4px;
  color: var(--brand);
}
.f-texto__sub {
  margin: 0 0 16px;
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: 32px;
  line-height: 41.6px;
  color: var(--brand);
}
.f-texto__desc {
  display: flow-root;
  margin-top: 72px;
  font-weight: var(--weight-medium);
  font-size: 16px;
  line-height: 24px;
  color: var(--brand);
}
.f-texto__desc p { margin: 0 0 8px; }
.f-texto__desc > p:empty { height: 24px; }
.f-texto__desc li { list-style-position: inside; }
.f-texto__desc li p { display: inline; margin: 0; white-space: pre-line; }
.f-texto__desc ul { display: flow-root; margin: 0; padding: 0 0 0 16px; }
.f-texto__desc strong { font-weight: 700; }
.f-contacto { background: var(--paper); padding: 0 0 54px; display: flex; justify-content: center; }
.f-contacto .btn { padding: 8.5px 55.5px; font-size: 18px; line-height: 30.96px; }
.f-visor {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--ink) 88%, transparent);
}
.f-visor[hidden] { display: none; }
.f-visor img { width: min(90vw, 90vh); height: min(90vw, 90vh); object-fit: contain; display: block; }
.f-visor button {
  position: absolute;
  border: 0;
  background: none;
  color: var(--paper);
  cursor: pointer;
  padding: 12px;
}
.f-visor button svg { width: 28px; height: 28px; display: block; }
.f-visor__cerrar { top: 8px; right: 8px; }
.f-visor__ant { left: 16px; top: 50%; transform: translateY(-50%); }
.f-visor__sig { right: 16px; top: 50%; transform: translateY(-50%); }
@media (max-width: 920px) {
  .f-barra { padding: 40px 0 0; }
  .f-barra .p-listado__barra { padding: 0 15px; }
  .f-barra--categoria { padding: 50px 0 2px; }
  .f-barra--categoria .p-buscar { width: 100%; }
  .f-producto { padding: 56px 0 48px; }
  .f-producto__in { grid-template-columns: 1fr; row-gap: 32px; }
  .f-galeria__tira { display: none; }
  .f-galeria__puntos {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 21px;
    display: flex;
    justify-content: center;
    padding: 0 2px;
    gap: min(10px, calc((100% - 4px - var(--n) * 10px) / (var(--n) - 1)));
    pointer-events: none;
  }
  .f-galeria__puntos span { flex: none; }
  .f-galeria__puntos span { width: 10px; height: 10px; border-radius: 50%; background: var(--paper); opacity: 0.5; }
  .f-galeria__puntos span.is-activo { opacity: 1; }
  .f-texto__titulo { font-size: 32px; line-height: 41.6px; }
  .f-texto__sub { font-size: 24px; line-height: 31.2px; }
  .f-contacto { padding: 2px 0 113px; }
  .f-contacto .btn { padding: 9.5px 38.5px; font-size: 14px; line-height: 24.08px; }
}
@media (prefers-reduced-motion: reduce) {
  .f-galeria__minis { scroll-behavior: auto; }
}
