/*section[class*="nq-"] {
  height: 100vh;
}*/

.nq-composicion, .nq-ficha-tec{
  min-height: 80vh;
}

.fondo-marron{
  background-color: rgba(96, 78, 56, 1);
}

.fondo-semi-past{
  background-color: rgba(var(--color-bg-semi-past) ,1);
}

.fondo-tierno{
  background-color: rgba(var(--color-bg-tierno), 1)
}

.fondo-semi-lc{
  background-color: rgba(var(--color-bg-semi-lc), 1)
}

.fondo-viejo{
  background-color: rgba(var(--color-bg-viejo), 1)
}

.fondo-curado-past{
  background-color: rgba(var(--color-bg-curado-past),1 )
}

.fondo-curado-lc{
  background-color: rgba(var(--color-bg-curado-lc),1 )
}

.fondo-off-white{
  background-color: rgb(237,237,215);
}

.fondo-antracita{
  background-color: #363636;
}

.fondo-maridaje{
  /*background-image: url('/assets/img/quesos/brown-wooden-texture-flooring-background.jpg');*/
  /*background-image: url('/assets/img/quesos/paperboard-texture-1.jpg');*/
  /*background-image: url('/assets/img/quesos/paper-texture.jpg');*/
  background-image: url('/assets/img/quesos/wood-background-abstract-wooden-texture.jpg');
}

.gradient-semi-past{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgba(163,40,56, 1) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(111, 27, 37, 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-tierno{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgba(220,220,220, 1) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-tierno), 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-semi-lc{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(144, 57, 57) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-semi-lc), 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-viejo{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(139, 111, 79) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-viejo), 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-curado-past{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(98,95,91) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-curado-past), 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-curado-lc{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(51,48,46) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-curado-lc), 0) 60%   /* Borde: tu oscuro original */
    );
}

.gradient-ficha-tec{
  background: radial-gradient( circle at left 84%, rgb(163, 40, 56) 0%, rgba(111, 27, 37, 0) 26% );
}

.gradient-ficha-tec.tierno{
  background: radial-gradient( circle at left 84%, rgba(220,220,220,1) 0%, rgba(var(--color-bg-tierno), 0) 35% );
}
.gradient-ficha-tec.semi-lc{
  background: radial-gradient( circle at left 84%, rgb(144, 57, 57) 0%, rgba(var(--color-bg-semi-lc), 0) 26% );
}

.gradient-ficha-tec.viejo{
  background: radial-gradient( circle at left 84%, rgb(139, 111, 79) 0%, rgba(var(--color-bg-viejo), 0) 26% );
}

.gradient-ficha-tec.curado-past{
  background: radial-gradient( circle at left 84%, rgb(98,95,91) 0%, rgba(var(--color-bg-curado-past), 0) 26% );
}

.gradient-ficha-tec.curado-lc{
  background: radial-gradient( circle at left 84%, rgb(51,48,46) 0%, rgba(var(--color-bg-curado-lc), 0) 26% );
}

.gradient-composicion{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgba(163,40,56, 1) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(111, 27, 37, 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-composicion.tierno{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgba(220,220,220, 1) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-tierno), 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-composicion.semi-lc{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(144, 57, 57) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-semi-lc), 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-composicion.viejo{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(139, 111, 79) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-viejo), 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-composicion.curado-past{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(98,95,91) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-curado-past), 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-composicion.curado-lc{
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgb(51,48,46) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(var(--color-bg-curado-lc), 0) 50%   /* Borde: tu oscuro original */
    );
}

.gradient-queso {
  /* He subido el centro a un tono más luminoso para que se note el degradado */
  background: radial-gradient(
    circle at center 12%,
    /*rgba(140, 115, 85, 1) 0%,    Centro: más luz */
    rgba(192, 135, 105, 1) 0%,   /* Centro: más luz */
    /*rgba(119, 94, 68, 1) 35%,   Medio: tu marrón original */
    rgba(96, 78, 56, 0) 100%   /* Borde: tu oscuro original */
    );
}

#carouselCata{
  min-height: 300px;
}

.nq-header>h1{
  font-size: 3rem;
  text-transform: initial;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
}

.nq-cata h4{
  font-size: 3rem;
}

.btn-comprar-queso{
  font-size: 1.4rem;
  color: var(--color-dark-grey);
  background-color: rgb(var(--color-off-white));
  border-radius: 1.5rem;
  border: 2px solid transparent;
}

.breadcrumb.bg-light{
  background-color: rgb(var(--color-off-white)) !important;
}

.btn-maridaje{

  border-radius: 1.5rem;
  border: 2px solid transparent;
}

.btn-maridaje.semi-past{
  color: rgb(var(--color-off-white));
  background-color: rgb(var(--color-bg-semi-past));
}

.btn-maridaje.semi-lc{
  color: rgb(var(--color-off-white));
  background-color: rgb(var(--color-bg-semi-lc));
}
.btn-maridaje.viejo{
  color: rgb(var(--color-off-white));
  background-color: rgb(var(--color-bg-viejo));
}

.btn-maridaje.tierno{
  color: var(--color-dark-grey);
  background-color: rgb(var(--color-bg-tierno));
}
.btn-maridaje.curado-past{
  color: rgb(var(--color-off-white));
  background-color: rgb(var(--color-bg-curado-past));
}
.btn-maridaje.curado-lc{
  color: rgb(var(--color-off-white));
  background-color: rgb(var(--color-bg-curado-lc));
}

.circulo-dividido {
  width: 135px;
  height: 135px;
  
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /*border: 2px solid #604e38;*/
  color: rgba(245, 245, 240, 1);
  font-family: sans-serif;
  font-weight: bold;
  margin: 0.5rem;
}
.circulo-dividido.semi-past{
  background-color: #51131b;
}
.circulo-dividido.semi-lc{
  background-color: #781c28;
}
.circulo-dividido.tierno{
  background-color: #8e8e8e;
}
.circulo-dividido.viejo{
  background-color: rgb(124, 100, 72);
}

.circulo-dividido.curado-past{
  
  background-color: rgb(90, 87, 82);
}
.circulo-dividido.curado-lc{
  
  background-color: rgb(70, 64, 62);
}

.circulo-dividido.glass{
  background: rgba(0,0,0,0.15);
  backdrop-filter: blur(2px);
}

.circulo-glass{
  /*width: 50%;*/
  width: clamp(150px, 14vw, 30%);
  /*height: 150px;*/
  aspect-ratio: 1/1;
  background-color: #51131b;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /*border: 2px solid #604e38;*/
  color: rgb(var(--color-off-white), 1);
  font-family: sans-serif;
  font-weight: bold;
  margin: 0.5rem;
  background: rgba(255,255,240,0.20);
  backdrop-filter: blur(20px);
  align-items: center;
  justify-content: center;
}

.circulo-glass.dark{
  background: rgba(0,0,0,0.20);
}

.circulo-glass .icon{
  display: flex;
  justify-content: center;
  height: 50%;
  /*padding-top: 0.5rem;*/

}
.circulo-glass .icon img{
  /*width: 60%;*/

}

.circulo-glass .title{
  padding-top: 0.25rem;
  text-align: center;
  max-width: 80%;
  line-height:  1;
  height: 2rem;
  display: flex;
  align-items: center;
}

.mitad {
  flex: 1; /* Hace que cada mitad ocupe el 50% */
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.superior {
  /* Línea divisoria en la parte inferior de la primera mitad */
  border-bottom: 1px solid rgba(245, 245, 240, 0.3);
  align-items: flex-end; /* Empuja el texto un poco hacia la línea */
  padding-bottom: 8px;
}

.inferior {
  align-items: flex-start; /* Empuja el texto un poco hacia la línea */
  padding-top: 8px;
  font-size: 26px; /* El porcentaje suele verse mejor más grande */
  font-weight: bold;
}


.ratio-1x1-queso{
  --bs-aspect-ratio: calc(1 / 1 * 100%);
}
@media (min-width: 768px) {
  .ratio-1x1-queso {
    --bs-aspect-ratio: calc(3 / 4 * 100%);
  }
}

@media (min-width: 1921px) {
  .ratio-1x1-queso {
    --bs-aspect-ratio: calc(2 / 3 * 100%);
  }
}


@media (any-hover: hover){
  .btn-comprar-queso:hover{
    border: 2px solid rgb(var(--color-off-white));
  }
  .btn-maridaje.semi-past:hover{
    color: rgb(var(--color-bg-semi-past));
    background-color: transparent;
    border: 2px solid rgb(var(--color-bg-semi-past));
  }
  .btn-maridaje.semi-lc:hover{
    background-color: transparent;
    color: rgb(var(--color-bg-semi-lc));
    border: 2px solid rgb(var(--color-bg-semi-lc));
  }
  .btn-maridaje.viejo:hover{
    background-color: transparent;
    color: rgb(var(--color-bg-viejo));
    border: 2px solid rgb(var(--color-bg-viejo));
  }
  .btn-maridaje.tierno:hover{
    color: rgb(var(--color-dark-grey));
    background-color: transparent;
    border-color: rgb(var(--color-dark-grey));
  }
  .btn-maridaje.curado-past:hover{
    color: rgb(var(--color-dark-grey));
    background-color: transparent;
    border: 2px solid rgb(var(--color-bg-curado-past));
  }
  .btn-maridaje.curado-lc:hover{
    color: rgb(var(--color-dark-grey));
    background-color: transparent;
    border: 2px solid rgb(var(--color-bg-curado-lc));
  }
}