:root {
  --ink: #0b3039;
  --ink-soft: #214650;
  /* softer secondary text color */
}

/* ---------- Base ---------- */
* {
  box-sizing: border-box;
  /* padding/border are included in width/height */
}

html,
body {
  height: 100%;
  /* allow 100vh calculations to work as expected */
}

body {
  margin: 0;
  /* remove default page margin */
  color: var(--ink);
  /* use the main text color */
  background: url("assets/background/bg.png") center top / cover no-repeat;
  background-color: white;
  font-family: 'brother-1816', sans-serif;
  font-weight: 400;
  line-height: 1.5;
  overflow-x: hidden;
}


h2 {
  font-family: 'brother-1816-printed', sans-serif;
  font-size: 43px;
  font-style: italic;
  font-weight: 500;
  font-feature-settings: "calt" 1, "ordn" 1, "swsh" 1;
  line-height: 1.2;
  margin: 0 0 .6rem;
}

.track .num {
  font-family: 'brother-1816-printed', sans-serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 1;
}

h3 {
  font-family: 'brother-1816-printed', sans-serif;
  font-size: 32px;
  font-weight: 500;
  font-feature-settings: "calt" 1, "ordn" 1, "swsh" 1;
}

p {
  margin: 0 0 0.75rem 0;
  font-size: 20px;
  line-height: 1.5;
}

summary {
  font-size: 24px;
}

a {
  color: inherit;
}

.caption {
  font-size: 15px;
  /* small label style */
  letter-spacing: 120%;
  /* slight tracking for uppercase */
  text-transform: uppercase;
  /* label look */
  color: var(--ink-soft);
  /* softer tone */
  margin-top: 8px;
  /* space from element above */
  font-style: bold;
  font-weight: 700;
  font-feature-settings: 'calt' off;
  line-height: 150%;
  /* 22.5px */
}

.timeline .time {
  font-size: 15px;
}

.timeline .evt {
  font-size: 20px;
}

@media (max-width: 599px) {
  p {
    font-size: 18px;
  }

  h2 {
    font-size: 35px;
  }

  h3 {
    font-size: 24px;
  }

  .track .num {
    font-size: 24px;
  }

  .caption {
    font-size: 12px;
  }

  .schedule-columns .meta .meta-item.caption {
    font-size: 12px;
  }

  .timeline .time {
    font-size: 10px;
  }

  .timeline .evt {
    font-size: 12px;
  }

  .summary {
    font-size: 20px;
  }

  /* to fix how much width the text takes up for hero section */
  .hero .intro {
    max-width: 94vw;
    padding-left: 3vw;
    padding-right: 3vw;
  }

  /* to fix how much width the text takes up for midwater section & theme section */
  .midwater .dive-in,
  .theme-content .content {
    max-width: 90vw;
    padding-left: 5vw;
    padding-right: 5vw;
  }

  /* to fix how much width the text takes up for tracks section & faq section */
  .tracks .content,
  .faq .content {
    max-width: 80vw;
    padding-left: 10vw;
    padding-right: 10vw;
  }

  /* to fix how much width the text takes up for schedules section */
  .midnight.zone .schedule-panel .content {
    max-width: 90vw;
    padding-left: 5vw;
    padding-right: 5vw;
  }

}