/* ==========================================================================
   Botones y enlaces de acción. La esquina recortada a 45° replica el corte de la K del logo.
   ========================================================================== */

.btn {
  --c: 14px;
  display: inline-flex;
  align-items: center;
  gap: .6em;
  background: var(--ink);
  color: var(--bg);
  text-decoration: none;
  font-weight: 700;
  font-stretch: 105%;
  font-size: 1rem;
  padding: 1rem 1.6rem 1rem 1.4rem;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  clip-path: polygon(0 0,calc(100% - var(--c)) 0,100% var(--c),100% 100%,0 100%);
  transition: background .2s,color .2s;
}

.btn:hover {
  background: var(--teal);
  color: #000;
}

.btn:focus-visible {
  outline: 3px solid var(--teal);
  outline-offset: -7px;
}

.text-link {
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .3em;
  text-decoration-color: var(--teal);
}

.text-link:hover {
  color: var(--teal-ink);
}

/* Botón Cotizar: turquesa con la esquina blanca, como el corte de la K */
.btn-quote {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  font-weight: 700;
  font-stretch: 105%;
  font-size: .95rem;
  color: #000000;
  padding: .72rem 1.35rem .72rem 1.1rem;
  background: linear-gradient(225deg,#13B3CA 0 11px,#FFFFFF 11px);
  transition: color .2s;
}

.btn-quote:hover {
  color: #000000;
  background: linear-gradient(225deg,#FFFFFF 0 11px,#13B3CA 11px);
}

.btn-quote:focus-visible {
  outline: 3px solid #FFFFFF;
  outline-offset: 3px;
}