:root {
  --bg1: #ffffff;
  --bg2: #000000;
  --bg6: #e8f0fe;
  --bg7: #e6f4ea;
  --bg8: #fff4e5;
  --bg9: #fddfdd;
  --bg1Hover: rgba(255, 255, 255, 0.3);
  --bg2Hover: rgba(0, 0, 0, 0.3);
  --fuenteBase: Inter, sans-serif;
  --fuenteSecundaria: Russo One, sans-serif;
  --txtColor1: #ffffff;
  --txtColor2: #000000;
  --txtColor6: #1a237e;
  --txtColor7: #1e4620;
  --txtColor8: #663c00;
  --txtColor9: #a00a00;
  --txtColor1Hover: #000000;
  --txtColor2Hover: #ffffff;
  --border6: #42a5f5;
  --border7: #66bb6a;
  --border8: #ffa726;
  --border9: #f44336;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a {
  color: var(--txtColor1);
}

body {
  font-family: var(--fuenteBase);
  background: var(--bg1);
  color: var(--txtColor1);
}

.kingsport {
  font-family: var(--fuenteSecundaria);
  font-style: italic;
  text-transform: uppercase;
}

.contenido {
  width: 100%;
  max-width: 1200px;
  padding: 1rem 1.4rem;
}

.btnA {
  padding: 8px 24px;
  background: var(--bg1);
  color: var(--txtColor2);
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  border: none;
  border-radius: 100px;
  transition: all 0.2s ease;
}
.btnA:hover {
  background: var(--bg1Hover);
  color: var(--txtColor2Hover);
}

.btnB {
  padding: 8px 24px;
  background: var(--bg2);
  color: var(--txtColor1);
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 100px;
  transition: all 0.2s ease;
}
.btnB:hover {
  background: var(--bg2Hover);
  color: var(--txtColor1Hover);
}

.form {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 32px;
}
.form .form__campo {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0;
}
.form .form__campo label {
  text-transform: uppercase;
  color: var(--txtColor1);
  margin-bottom: 4px;
}
.form .form__campo input, .form .form__campo select {
  background: var(--bg4);
  color: var(--txtColor4);
  width: 100%;
  height: 40px;
  padding: 0px 10px;
  border: none;
  border-radius: 8px;
}
.form .form__extras {
  width: 100%;
}
.form .form__extras a {
  width: 100%;
  display: inline-block;
  text-align: right;
  text-decoration: none;
  color: var(--txtColor2);
  transition: all 0.2s ease;
}
.form .form__extras a:hover {
  color: var(--txtColor1);
}
.form .form__btn {
  padding: 8px 16px;
  border: none;
  border-radius: 8px;
}
.form .form__fila {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: nowrap;
  min-width: 0;
}
.form .form__fila .form__campo {
  overflow: hidden;
  min-width: 0;
  /* ayuda extra a WebKit para permitir el encogimiento del contenido interno */
}
.form .form__fila .form__campo label {
  width: 100%;
}
.form .form__fila .form__campo input {
  width: 100%;
}
.form .form__fila .form__campo input[type=date] {
  /* hack iOS/WebKit: ignora su min-content width */
  width: 0; /* <-- clave */
  min-width: 100%; /* <-- y esto */
  max-width: 100%;
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  line-height: normal;
  font-size: 16px;
}
.form .form__fila .form__campo input[type=date]::-webkit-datetime-edit,
.form .form__fila .form__campo input[type=date]::-webkit-date-and-time-value {
  min-width: 0;
}
.form .subtitulo__form {
  width: 100%;
  margin-top: 1.8rem;
  font-size: 1.5rem;
  font-weight: 500;
}

.buscador {
  width: 100%;
  min-width: 250px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
@media (max-width: 480px) {
  .buscador {
    width: 100%;
    max-width: 100%;
    min-width: auto;
  }
}
.buscador input {
  background: var(--bg4);
  color: var(--txtColor4);
  width: 100%;
  height: 32px;
  font-weight: 400;
  font-size: 1rem;
  padding: 0px 10px;
  border: none;
  border-radius: 8px;
}
.buscador button {
  aspect-ratio: 1/1;
  height: 32px;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.buscador button svg {
  width: 70%;
  height: 70%;
  fill: var(--txtColor10);
}

.filtros {
  padding: 1rem;
}
.filtros hr {
  margin: 1rem 0px 0.5rem 0px;
}
.filtros .titulo {
  font-weight: 700;
  font-size: 1.25rem;
}
.filtros .form {
  gap: 0.5rem;
}
.filtros .form .subtitulo__form {
  width: 100%;
  margin-top: auto;
  font-size: 1.25rem;
  font-weight: 500;
}
.filtros .form .form__campo label {
  font-weight: 500;
}
.filtros .form .form__selects {
  display: flex;
  flex-direction: column;
  justify-content: flex-star;
  align-items: flex-star;
  gap: 0.3rem;
}

.widgets {
  width: 100%;
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 1rem;
  justify-items: center;
  align-items: start;
}
@media (max-width: 480px) {
  .widgets {
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 0.75rem;
  }
}
.widgets .widget {
  width: 100%;
  aspect-ratio: 1/1;
  background: var(--bg2);
  border-radius: 1rem;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2), inset -2px -2px 12px rgba(0, 0, 0, 0.2);
  color: var(--txtColor1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
@media (max-width: 480px) {
  .widgets .widget {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
  }
}
.widgets .widget img {
  width: 50%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 50%;
}
.widgets .widget p {
  text-transform: uppercase;
  font-weight: 500;
  text-align: center;
  font-size: 1rem;
}
@media (max-width: 480px) {
  .widgets .widget p {
    font-size: 0.875rem;
  }
}
.widgets .widget:hover {
  transform: translateY(-4px);
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.2), inset -2px -2px 12px rgba(0, 0, 0, 0.2);
}

.alerta {
  width: 100%;
  padding: 20px;
  background: var(--bg6);
  color: var(--txtColor6);
  border-radius: 4px;
  border-left: 6px solid var(--borde6);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.alerta.error {
  background: var(--bg9);
  color: var(--txtColor9);
  border-left: 6px solid var(--border9);
}
.alerta.advertencia {
  background: var(--bg8);
  color: var(--txtColor8);
  border-left: 6px solid var(--border8);
}
.alerta.exito {
  background: var(--bg7);
  color: var(--txtColor7);
  border-left: 6px solid var(--border7);
}

.header {
  width: 100dvw;
  height: 90px;
  position: fixed;
  top: 0;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.header .header__left {
  margin-left: 30px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.header .header__left .header__logo {
  height: 60px;
}
.header .header__left .header__logo img {
  height: 100%;
  filter: brightness(0) invert(1);
}
@media (max-width: 480px) {
  .header .header__left .header__logo {
    height: 40px;
  }
}
.header .header__right {
  margin-right: 30px;
}
.header .header__right .header__nav {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 30px;
}
.header .header__right .header__nav a {
  font-size: 1.2rem;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  letter-spacing: 1.5px;
}
@media (max-width: 480px) {
  .header .header__right .header__nav a {
    letter-spacing: auto;
  }
}
@media (max-width: 480px) {
  .header .header__right .header__nav a {
    font-size: 1rem;
    letter-spacing: normal;
  }
}
@media (max-width: 480px) {
  .header .header__right .header__nav {
    gap: 1rem;
  }
}

.footer {
  width: 100%;
  background: var(--bg2);
  padding: 60px 0px 0px 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 60px;
}
.footer .footer__contenido {
  width: 100%;
  max-width: 1200px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: flex-start;
  gap: 0;
}
@media (max-width: 768px) {
  .footer .footer__contenido {
    display: grid;
    gap: 60px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 480px) {
  .footer .footer__contenido {
    gap: 60px;
    grid-template-columns: 1fr;
  }
}
.footer .footer__contenido div {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 6px;
}
@media (max-width: 768px) {
  .footer .footer__contenido div {
    gap: 6px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }
}
.footer .footer__contenido div .footer__subtitulo {
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 12px;
}
.footer .footer__contenido div p {
  color: #fff;
}
.footer .footer__contenido div a {
  text-decoration: none;
  color: #fff;
}
.footer .footer__contenido .footer__logo {
  gap: 30px;
  align-items: center;
}
.footer .footer__contenido .footer__logo img {
  height: 100px;
  filter: brightness(0) invert(1);
}
.footer .autor {
  width: 100%;
  text-align: center;
}

.vista__404 {
  padding-top: 200px;
  background: #2f2f2f;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
}
.vista__404 .contenido {
  height: 51vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.vista__404 .contenido .display {
  font-size: 3rem;
  margin-bottom: 8px;
}
.vista__404 .contenido .texto {
  font-size: 1rem;
  margin-bottom: 16px;
}
.vista__404 .contenido .subtitulo3 {
  font-size: 1rem;
  font-weight: 500;
}
.vista__404 .contenido .alerta {
  margin: 8px 0px 24px 0px;
}
.vista__404 .contenido .btns {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.vista__404 .contenido .btns .btnA {
  padding: 0.5rem;
  border-radius: 100px;
  font-size: 0.875rem;
}

.vista__home .main {
  position: relative;
}
.vista__home .main .seccion {
  position: relative;
  position: sticky;
  top: 0;
  width: 100dvw;
  height: 100lvh;
  overflow: hidden;
  background: linear-gradient(var(--deg), var(--c1), var(--c2), var(--c3));
}
.vista__home .main .seccion .carrousel {
  position: absolute;
  z-index: 1;
  width: 100dvw;
  height: 100lvh;
  inset: 0;
  overflow: hidden;
}
@media (max-width: 768px) {
  .vista__home .main .seccion .carrousel {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    gap: 0;
  }
}
.vista__home .main .seccion .carrousel .slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 70%;
  object-fit: contain;
  object-position: right center; /* reemplaza el right:-15%/top:50% que usabas */
  opacity: 0;
  transition: opacity 0.8s ease;
  will-change: opacity;
  transform: translateX(5%) translateY(22%);
  /* Ajustes responsivos que imitaban tu comportamiento previo */
}
.vista__home .main .seccion .carrousel .slide.is-active {
  opacity: 1;
}
@media (max-width: 1024px) {
  .vista__home .main .seccion .carrousel .slide {
    transform: translateX(5%) translateY(23%);
  }
}
@media (max-width: 768px) {
  .vista__home .main .seccion .carrousel .slide {
    height: 60%;
    transform: translateX(0%) translateY(70%);
    object-position: center bottom;
  }
}
@media (max-width: 480px) {
  .vista__home .main .seccion .carrousel .slide {
    transform: translateX(0%) translateY(80%);
    object-position: center bottom;
  }
}
@media (prefers-reduced-motion: reduce) {
  .vista__home .main .seccion .carrousel .slide .carrousel .slide {
    transition: none;
  }
}
.vista__home .main .seccion .texto {
  position: absolute;
  z-index: 2;
  top: 0;
  width: 100dvw;
  height: 100lvh;
  padding-left: 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 35px;
}
@media (max-width: 1024px) {
  .vista__home .main .seccion .texto {
    gap: 15px;
  }
}
@media (max-width: 768px) {
  .vista__home .main .seccion .texto {
    gap: 15px;
    padding: 140px 0px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }
}
.vista__home .main .seccion .texto .titulo {
  font-size: 8rem;
  line-height: 8rem;
  text-transform: uppercase;
}
@media (max-width: 1024px) {
  .vista__home .main .seccion .texto .titulo {
    font-size: 5rem;
    line-height: 5rem;
  }
}
@media (max-width: 480px) {
  .vista__home .main .seccion .texto .titulo {
    font-size: 3rem;
    line-height: 3rem;
  }
}
.vista__home .main .seccion .texto .txt {
  font-size: 2rem;
  text-transform: uppercase;
}
@media (max-width: 1024px) {
  .vista__home .main .seccion .texto .txt {
    font-size: 1rem;
  }
}
@media (max-width: 768px) {
  .vista__home .main .seccion .texto .txt {
    text-align: center;
  }
}
.vista__home .main .seccion .texto .btnA {
  font-size: 1.4rem;
}

.vista__catalogo {
  display: flex;
  flex-direction: column;
  justify-content: flex-star;
  align-items: center;
  gap: 0;
  padding-top: 90px;
  color: #000;
}
.vista__catalogo .header {
  background: linear-gradient(var(--deg), var(--c1), var(--c2), var(--c3));
}
.vista__catalogo .contenido {
  width: 100%;
  max-width: 100%;
  padding: 0;
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-star;
  gap: 0;
}
.vista__catalogo .contenido .filtros {
  min-width: 250px;
  box-shadow: 6px 0px 12px rgba(0, 0, 0, 0.25);
  height: calc(100dvh - 90px);
  position: sticky;
  top: 90px;
  left: 0;
}
@media (max-width: 768px) {
  .vista__catalogo .contenido .filtros {
    background: #fff;
    position: fixed;
    left: -100%;
    transition: all 0.3s ease;
  }
  .vista__catalogo .contenido .filtros.abierto {
    left: 0;
  }
}
@media (max-width: 480px) {
  .vista__catalogo .contenido .filtros {
    width: 100%;
  }
}
.vista__catalogo .contenido .filtros .titulo {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 0;
}
.vista__catalogo .contenido .filtros .titulo .btnA {
  height: 24px;
  padding: 0;
  aspect-ratio: 1/1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  transition: all 0.2s ease;
  display: none;
}
.vista__catalogo .contenido .filtros .titulo .btnA svg {
  height: 1rem;
  fill: #000;
}
.vista__catalogo .contenido .filtros .titulo .btnA:hover {
  background: rgb(243, 80, 80);
}
.vista__catalogo .contenido .filtros .titulo .btnA:hover svg {
  fill: #fff;
}
@media (max-width: 768px) {
  .vista__catalogo .contenido .filtros .titulo .btnA {
    display: block;
  }
}
@media (max-width: 480px) {
  .vista__catalogo .contenido .filtros .form .form__selects {
    width: 90%;
  }
}
.vista__catalogo .contenido .filtros .form .btnB {
  margin-top: 1rem;
}
.vista__catalogo .contenido .catalogo {
  width: 100%;
}
.vista__catalogo .contenido .catalogo .botonera {
  display: none;
}
.vista__catalogo .contenido .catalogo .botonera .btnA svg {
  height: 1rem;
  margin-right: 0.2rem;
}
@media (max-width: 768px) {
  .vista__catalogo .contenido .catalogo .botonera {
    display: block;
  }
}
.vista__catalogo .contenido .catalogo .productos {
  padding: 1.3rem 1.5rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 2rem;
  justify-items: center;
  align-items: start;
}
@media (max-width: 768px) {
  .vista__catalogo .contenido .catalogo .productos {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }
}
@media (max-width: 480px) {
  .vista__catalogo .contenido .catalogo .productos {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
  }
}
.vista__catalogo .contenido .catalogo .productos .producto {
  width: 100%;
  height: 100%;
  color: #000;
  border-radius: 0.5rem;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.25);
  transition: all 0.2s ease;
}
.vista__catalogo .contenido .catalogo .productos .producto:hover {
  box-shadow: 12px 12px 12px rgba(0, 0, 0, 0.25);
}
.vista__catalogo .contenido .catalogo .productos .producto:hover .foto img {
  transform: scale(120%);
}
.vista__catalogo .contenido .catalogo .productos .producto .foto {
  overflow: hidden;
  aspect-ratio: 1/1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.vista__catalogo .contenido .catalogo .productos .producto .foto img {
  width: 70%;
  transition: all 0.2s ease;
}
.vista__catalogo .contenido .catalogo .productos .producto .info {
  padding: 1rem;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
}
.vista__catalogo .contenido .catalogo .productos .producto .info .nombre {
  grid-area: 1/1/2/3;
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 700;
  text-align: left;
}
.vista__catalogo .contenido .catalogo .productos .producto .info .sabor {
  text-transform: uppercase;
  text-align: right;
}
.vista__producto {
  color: var(--txtColor);
  background: linear-gradient(var(--deg), var(--c1), var(--c2), var(--c3));
}
.vista__producto a {
  color: var(--txtColor);
}
.vista__producto .header a {
  color: var(--txtColor1);
}
.vista__producto .contenido {
  width: 100dvw;
  max-width: 100dvw;
  min-height: 100dvh;
  padding-top: 100px;
  padding-bottom: 2rem;
  display: grid;
  grid-template-columns: 0.8fr 1fr 0.8fr;
}
@media (max-width: 1024px) {
  .vista__producto .contenido {
    grid-template-columns: auto 1fr;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido {
    grid-template-columns: 1fr;
  }
}
.vista__producto .contenido .producto {
  padding: 1rem;
  grid-area: 1/1/2/2;
}
.vista__producto .contenido .producto p {
  font-size: 2rem;
  font-weight: bold;
}
.vista__producto .contenido .producto .titulo {
  text-transform: uppercase;
  font-weight: bold;
  font-size: clamp(2rem, 6vw, 4rem);
  line-height: 1.1;
  word-break: break-word;
  hyphens: auto;
}
.vista__producto .contenido .producto .presentacionesTitulo {
  margin-top: 2rem;
  font-size: 1.25rem;
  text-transform: uppercase;
}
.vista__producto .contenido .producto .presentaciones {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
@media (max-width: 768px) {
  .vista__producto .contenido .producto .presentaciones {
    margin: 0px 0px 1rem 0px;
    flex-direction: row;
    gap: 1rem;
  }
}
.vista__producto .contenido .producto .presentaciones a {
  font-size: 1.25rem;
  transition: all 0.2s ease;
  padding: 0.2rem;
}
.vista__producto .contenido .producto .presentaciones a:hover {
  font-weight: 700;
  font-size: 2rem;
}
@media (max-width: 768px) {
  .vista__producto .contenido .producto .presentaciones a:hover {
    font-size: 1.25rem;
  }
}
@media (max-width: 1024px) {
  .vista__producto .contenido .producto {
    grid-area: 1/1/2/2;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .producto {
    grid-area: 1/1/2/2;
  }
}
.vista__producto .contenido .sabores {
  grid-area: 2/1/3/3;
  width: 100%;
  min-width: 0;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.vista__producto .contenido .sabores p {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
@media (max-width: 768px) {
  .vista__producto .contenido .sabores p {
    margin-bottom: 1rem;
  }
}
.vista__producto .contenido .sabores .lista {
  width: 100%;
  gap: 1rem;
  padding-bottom: 0.25rem;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
}
.vista__producto .contenido .sabores .lista a {
  text-transform: uppercase;
  font-style: italic;
  margin-bottom: 0.2rem;
  font-size: 1.25rem;
  white-space: nowrap;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  transition: all 0.2s ease;
}
.vista__producto .contenido .sabores .lista a svg {
  height: 0.5rem;
  margin-right: 0.6rem;
  fill: var(--txtColor);
  display: none;
}
.vista__producto .contenido .sabores .lista a:hover {
  letter-spacing: 2px;
  font-weight: bold;
}
@media (max-width: 768px) {
  .vista__producto .contenido .sabores .lista a {
    font-style: normal;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .sabores .lista {
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
  }
}
@media (max-width: 1024px) {
  .vista__producto .contenido .sabores {
    margin-top: 1rem;
    grid-area: 4/1/5/3;
    align-items: center;
    gap: 0.5rem;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .sabores {
    align-items: center;
    grid-area: 5/1/6/2;
  }
}
.vista__producto .contenido .img {
  grid-area: 1/2/2/3;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
}
.vista__producto .contenido .img img {
  width: 100%;
}
@media (max-width: 1024px) {
  .vista__producto .contenido .img {
    grid-area: 1/2/2/3;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .img {
    grid-area: 2/1/3/2;
  }
}
.vista__producto .contenido .notas {
  width: 100%;
  padding: 2rem;
  grid-area: 1/3/2/4;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
}
.vista__producto .contenido .notas .nota p {
  margin-bottom: 1.5rem;
}
.vista__producto .contenido .notas .nota .titulo {
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 0.4rem;
}
@media (max-width: 1024px) {
  .vista__producto .contenido .notas {
    grid-area: 2/1/3/3;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .notas {
    grid-area: 3/1/4/2;
  }
}
.vista__producto .contenido .c2a {
  grid-area: 2/3/3/4;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 1rem;
}
.vista__producto .contenido .c2a a {
  padding: 0.5rem;
  border-radius: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0;
  transition: all 0.2s ease;
}
.vista__producto .contenido .c2a .ig {
  background: #c13584;
}
.vista__producto .contenido .c2a .ig:hover {
  background: #ffffff;
}
.vista__producto .contenido .c2a .ig:hover svg {
  fill: #c13584;
}
.vista__producto .contenido .c2a .fb {
  background: #3b5998;
}
.vista__producto .contenido .c2a .fb:hover {
  background: #ffffff;
}
.vista__producto .contenido .c2a .fb:hover svg {
  fill: #3b5998;
}
.vista__producto .contenido .c2a .whatsapp {
  background: #25D366;
}
.vista__producto .contenido .c2a .whatsapp:hover {
  background: #ffffff;
}
.vista__producto .contenido .c2a .whatsapp:hover svg {
  fill: #25D366;
}
.vista__producto .contenido .c2a svg {
  height: 2.5rem;
  fill: #ffffff;
}
@media (max-width: 1024px) {
  .vista__producto .contenido .c2a {
    grid-area: 3/1/4/3;
  }
}
@media (max-width: 768px) {
  .vista__producto .contenido .c2a {
    grid-area: 4/1/5/2;
  }
}/*# sourceMappingURL=style.min.css.map */