/* ===================================================
   FQC Buttons — sistema unificado (independiente de Bootstrap)
   Paleta: Naranja #ff8f0f | Azul #205b8c
   Variantes: slide | glow | wipe (nuevo diagonal)
=================================================== */
:root{
  --fqc-orange: #ff8f0f;
  --fqc-blue:   #205b8c;
  --fqc-white:  #ffffff;
  --fqc-shadow: 0 6px 18px rgba(32,91,140,.25);
}

/* ---------- Base de todos los botones ---------- */
.fqc-btn{
  display: inline-block;
  font-family: 'Century Gothic', sans-serif;
  font-weight: 600;
  font-size: 16px;
  padding: .6rem 1.25rem;
  border-radius: .5rem;
  border: 2px solid var(--fqc-orange);
  background-color: var(--fqc-orange);
  color: var(--fqc-white);
  cursor: pointer;
  text-align: center;
  text-decoration: none !important;
  transition: background-color .25s ease, border-color .25s ease,
              color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.fqc-btn:focus{ outline: none; }
.fqc-btn:focus-visible{ box-shadow: 0 0 0 .2rem rgba(255,143,15,.35); }
.fqc-btn:active{ transform: translateY(0); box-shadow: none; }
.fqc-btn:disabled{ opacity:.6; pointer-events:none; }

/* ---------- Variante 1: Slide (relleno deslizante L→R) ---------- */
.fqc-btn.slide{ position: relative; overflow: hidden; z-index: 1; }
.fqc-btn.slide::before{
  content:"";
  position:absolute; top:0; left:-100%;
  width:100%; height:100%;
  background: var(--fqc-blue);
  transition:left .35s ease;
  z-index:-1;
}
.fqc-btn.slide:hover::before{ left:0; }
.fqc-btn.slide:hover,
.fqc-btn.slide:focus{
  color: var(--fqc-white);
  border-color: var(--fqc-blue);
  transform: translateY(-2px);
  box-shadow: var(--fqc-shadow);
}

/* ---------- Variante 2: Glow (brillo suave) ---------- */
.fqc-btn.glow:hover{
  background-color: var(--fqc-blue);
  border-color:     var(--fqc-blue);
  color:            var(--fqc-white);
  box-shadow: 0 0 15px rgba(32,91,140,.6);
  transform: translateY(-2px);
}

/* ---------- Variante 3: Wipe (barrido diagonal novedoso) ---------- */
.fqc-btn.wipe{ position: relative; overflow: hidden; z-index: 1; }
.fqc-btn.wipe::before{
  content:"";
  position:absolute;
  /* tamaño extra para cubrir al inclinar */
  width:160%; height:160%;
  top:-30%; left:-130%;
  background: var(--fqc-blue);
  transform: skewX(-20deg);
  transition: left .38s ease;
  z-index:-1;
}
.fqc-btn.wipe:hover::before{ left:-10%; }
.fqc-btn.wipe:hover,
.fqc-btn.wipe:focus{
  color: var(--fqc-white);
  border-color: var(--fqc-blue);
  transform: translateY(-2px);
  box-shadow: var(--fqc-shadow);
}
