/* ============================================================
   OII4 BUTTON SYSTEM
============================================================ */

.oii-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;

  min-height: 54px;
  padding: 0 1.4rem;

  border-radius: var(--radius-pill);

  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: -0.01em;

  text-decoration: none;
  cursor: pointer;

  transition:
    transform var(--transition-fast),
    background var(--transition-fast),
    color var(--transition-fast),
    border-color var(--transition-fast),
    box-shadow var(--transition-fast);

  isolation: isolate;
}

.oii-btn:hover {
  transform: translateY(-2px);
}

/* PRIMARY */

.oii-btn-primary {
  background: linear-gradient(
    135deg,
    var(--oii-copper),
    var(--oii-amber)
  );

  color: #fff;

  box-shadow:
    0 18px 40px rgba(185,120,79,.24);
}

.oii-btn-primary:hover {
  box-shadow:
    0 26px 60px rgba(185,120,79,.32);
}

/* OUTLINE */

.oii-btn-outline {
  color: #fff;

  border: 1px solid rgba(255,255,255,.18);

  background: rgba(255,255,255,.06);

  backdrop-filter: blur(18px);
}

.oii-btn-outline:hover {
  background: rgba(255,255,255,.12);
}

/* DARK */

.oii-btn-dark {
  background: var(--oii-navy);
  color: #fff;
}

.oii-btn-dark:hover {
  background: var(--oii-blue);
}

/* TEXT */

.oii-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;

  color: var(--oii-copper);

  font-weight: 800;
  text-decoration: none;

  transition: gap var(--transition-fast);
}

.oii-link:hover {
  gap: .8rem;
}