body { background-color: white !important; }

textarea { resize: none; }

.section {
  padding-top: 60px;
  position: relative;
}

.offcanvas {
  max-width: 340px !important;
}

.big-check {
  width: 1.25rem !important;
  height: 1.25rem !important;
}

.big-switch {
  width: 2.2rem !important;
  min-width: 2.2rem !important;
  max-width: 2.2rem !important;
  height: 1.25rem !important;
}

.pclick { cursor: default; }
.pclick:hover { cursor: pointer; }

.fa-1yMx { font-size: 1.5em; }

.sombra {
  -webkit-box-shadow: 0 3px 12px  rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 12px  rgba(0, 0, 0, 0.3);
}

.bradius { border-radius: 15px !important; }

.soro { color: #FFD700; }
.spla { color: #C0C0C0; }
.sbro { color: #CD7F32; }
.sroj { color: red; }
.sver { color: green; }
.snar { color: orange; }
.pazu1 { color: #60BED5; }
.pazu2 { color: #AFDCEF; }
.pgri1 { color: #59585D; }
.pmor1 { color: #572364; }
.plil { color: #A4A2CD; }
.bg-pvio1 { background-color: #8B00FF; }
.bg-plil1 { background-color: #D3D5E7; }
.bg-pmor1 { background-color: #572364; }
.border-plil { border-color: #A4A2CD !important; }
.border-pmor1 { border-color: #572364 !important; }

.btn-xs {
  --bs-btn-padding-y: 0.1875rem;
  --bs-btn-padding-x: 0.375rem;
  --bs-btn-font-size: 0.42rem;
  --bs-btn-border-radius: 0.25rem;
}

.btn-pazu1 {
  color: white;
  background-color: #60BED5;
  border-color: #60BED5;
}.btn-pazu1:hover {
  color: white !important;
  background-color: #56A8BC !important;
  border-color: #56A8BC !important;
}.btn-pazu1:active {
  color: white !important;
  background-color: #4990A1 !important;
  border-color: #4990A1 !important;
}

.btn-plil {
  color: white !important;
  background-color: #A4A2CD !important;
  border-color: #A4A2CD !important;
}.btn-plil:hover {
  color: white !important;
  background-color: #A4A2CD !important;
  outline: 2px solid #8382A5 !important;
  outline-offset: -2px !important;
}.btn-plil:active {
  color: white !important;
  background-color: #8382A5 !important;
}

.btn-pmor {
  color: white !important;
  background-color: #572364 !important;
  border-color: #572364 !important;
}.btn-pmor:hover {
  color: white !important;
  background-color: #572364 !important;
  outline: 2px solid #33143A !important;
  outline-offset: -2px !important;
}.btn-pmor:active {
  color: white !important;
  background-color: #33143A !important;
}

.table-scroll {
  min-width: 295px;
  max-height: 350px;
  overflow: auto;
  border: 1px solid lightgray;
}.table-scroll thead tr th {
  position: sticky;
  top: -3px;
  z-index: 3;
  vertical-align: middle;
  background-color: white !important;
}

.lists-scroll {
  min-width: 295px;
  max-height: 350px;
  overflow: auto;
  border: 1px solid lightgray;
}

.div-scroll {
  min-width: 295px;
  max-height: 450px;
  overflow: auto;
}

.spinnercubes {
  margin: 30px auto;
  width: 68px;
  height: 50px;
  position: relative;
}

.cube1, .cube2 {
  background-color: #A4A2CD;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 0;
  left: 0;

  -webkit-animation: sk-cubemove 1.8s infinite ease-in-out;
  animation: sk-cubemove 1.8s infinite ease-in-out;
}

.cube2 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

@-webkit-keyframes sk-cubemove {
  25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }
  50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }
  75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }
  100% { -webkit-transform: rotate(-360deg) }
}

@keyframes sk-cubemove {
  25% {
    transform: translateX(42px) rotate(-90deg) scale(0.5);
    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
  } 50% {
    transform: translateX(42px) translateY(42px) rotate(-179deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
  } 50.1% {
    transform: translateX(42px) translateY(42px) rotate(-180deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
  } 75% {
    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
  } 100% {
    transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
  }
}

.nav-pills {
  color: white;
  --bs-nav-pills-link-active-color: black;
  --bs-nav-pills-link-active-bg: #212529;
}
button.nav-link {
  color: black !important;
  border: 1px solid #212529 !important;
  border-radius: 0px !important;
}
button.nav-link.active {
  color: white !important;
  border: 1px solid #212529 !important;
  border-radius: 0px !important;
}

.stitulo {
  color: white !important;
  background-color: rgba(0, 0, 0, 0.45) !important;
  border-radius: 10px !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  padding-top: 0.2rem !important;
  padding-bottom: 0.2rem !important;
}




.contacto-real {
  background: #f2f2f2;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
}

.contacto-real-title {
  color: #3b4d66;
  font-size: clamp(2rem, 3.2vw, 3.2rem);
  font-weight: 600;
  letter-spacing: .02em;
}

.contacto-brand {
  position: relative;
  width: 92px;
  height: 64px;
}

.brand-back,
.brand-front {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: 0 10px 18px rgba(76, 88, 120, .18);
}

.brand-back {
  top: 8px;
  right: 2px;
  width: 50px;
  height: 38px;
  border-radius: 7px;
  background: #8d8abf;
  font-size: 1.05rem;
}

.brand-front {
  left: 0;
  bottom: 0;
  width: 56px;
  height: 42px;
  border-radius: 8px;
  background: #9ed4e8;
  font-size: 1.15rem;
}

.contacto-real-list {
  max-width: 760px;
}

.contacto-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.contacto-item-icon {
  width: 28px;
  height: 28px;
  border-radius: 4px;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .85rem;
  flex: 0 0 auto;
}

.icon-mail { background: #9ed4e8; }
.icon-phone { background: #8d8abf; }
.icon-wa { background: #56bfd6; }

.contacto-item-text {
  color: #3b4d66;
  text-decoration: none;
  font-size: clamp(1rem, 1.25vw, 1.35rem);
  line-height: 1.2;
}

.contacto-item-text:hover {
  color: #2f4058;
}