:root {
  --light-gray: #f8f9fa;
  --lighter-gray: #f1f3f5;
  --dark-gray: #212529;
  --brand-red: #f03e3e;
  --dark-brand-red: #c92a2a;
  --pale-peach: #eacda3;
  --light-amber: #d6ae7b;
  --midnight-blue: #0f0c29;
  --dark-imperial-blue: #302b63;
  --plum: #24243e;

  /* Shadows */
  --gentle-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  --bold-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}

a {
  text-decoration: none;
}

/* width */
.w-full {
  width: 100%;
}

.w-half {
  width: 50%;
}

/* color */
.text-white {
  color: #fff;
}

/* display */

/* headings */
.heading__h1 {
  font-size: 72px;
}

.heading__h2 {
  font-size: 48px;
  text-transform: capitalize;
}

.heading__h3 {
  font-size: 24px;
  font-weight: 100;
}

.lead {
  font-size: 48px;
  margin-bottom: 62px;
}
/* Gradients */

.blue-gradient {
  background: linear-gradient(
    to left,
    var(--midnight-blue),
    var(--dark-imperial-blue),
    var(--plum)
  );
}

.light-gradient {
  background: linear-gradient(
    to bottom,
    var(--lighter-gray),
    var(--light-gray)
  );
}

.peach-gradient {
  background: linear-gradient(to bottom, var(--pale-peach), var(--light-amber));
}

/* links */

.link-primary {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: 600;
  background-color: var(--dark-brand-red);
  color: #fff;
  padding: 1.8rem 2.8rem;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  border-radius: 5px;
  box-shadow: var(--gentle-shadow);
  transition: all 0.2s;
  border: 0;
  cursor: pointer;
}

.link-primary:hover {
  box-shadow: var(--bold-shadow);
  transform: translateY(-5px) scale(1.1);
  background-color: var(--brand-red);
  letter-spacing: 3.8px;
}

.link-secondary {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  background-color: var(--dark-brand-red);
  color: #fff;
  padding: 1.4rem 2.1rem;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  border-radius: 5px;
  box-shadow: var(--gentle-shadow);
  transition: all 0.2s;
  border: 0;
  cursor: pointer;
}

.link-secondary:hover {
  box-shadow: var(--bold-shadow);
  transform: translateY(-5px) scale(1.1);
  background-color: var(--brand-red);
  letter-spacing: 4px;
}

/* text-alignment */
.text-center {
  text-align: center;
}

/* margin */

.mb-0 {
  margin-bottom: 0;
}
