section {
  position: relative;
  padding: var(--section-padding);
}

.container {
  max-width: var(--container-max);
  margin: 0 auto;
}

/* Primary button - angled cut corner */
.btn-p {
  display: inline-block;
  padding: .85rem 2.4rem;
  background: var(--cyan);
  color: var(--dark);
  border: none;
  font-family: 'Outfit', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all var(--transition-fast);
  text-decoration: none;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
}

.btn-p:hover {
  background: var(--white);
  transform: translateY(-2px);
}

/* Secondary button - bordered */
.btn-s {
  display: inline-block;
  padding: .85rem 2.4rem;
  background: transparent;
  color: var(--text);
  border: 1px solid var(--card-border);
  font-family: 'Outfit', sans-serif;
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all var(--transition-fast);
  text-decoration: none;
}

.btn-s:hover {
  border-color: var(--cyan);
  color: var(--cyan);
}
