:root {
  /* Base Background & Text */
  --bg: rgba(43, 43, 43, 0.8);
  --bg-nav: rgb(43, 43, 43);
  --bg-light: rgba(70, 70, 70, 0.8);
  --off-white: rgb(130, 130, 130);
  --text: rgb(230, 230, 230);

  /* Primary Branding */
  --primary: rgb(104, 177, 223);
  --primary-hover: rgb(60, 85, 100);

  /* Accent / Secondary Buttons */
  --accent: rgb(132, 169, 140);
  --accent-hover: rgb(110, 145, 120);

  /* CTA / Highlight */
  --highlight: rgb(220, 183, 104);
  --highlight-text: rgb(30, 30, 30);

  /* Alerts */
  --danger: rgb(177, 70, 70);
  --danger-hover: rgb(140, 40, 40);

  /* Distance Variables */
  --nav-bar-height: 8dvh;
  --video-height: 85dvh;
}

/* index.html */

#app {
    max-width: 100dvw;
    font-size: 3.5rem;
    color: var(--text);
    margin: 0;
}

#page {
    padding-bottom: 8dvh;
}

section {
    padding: 2dvw;
}

nav {
    height: 8dvh;
    width: 100%;
    position: fixed;
    z-index: 2;
    bottom: 0;
    font-size: 2.5rem;

    display: flex;
    justify-content: space-evenly;
    align-items: center;

    background-color: var(--bg-nav);
}

a {
    text-decoration: none;
    color: var(--text);
}

.primary-heading {
    text-align: center;
    padding: 3%;
}

#links {
    display: flex;
    justify-content: space-evenly;
    padding: 3%;
    flex-grow: 3;
}

.navItem {
    padding: 2%;
}

/* homepage.html */

video {
}

img {
    max-width: 100%;
}

.video-container {
    height: 100dvh;
    position: fixed;
    top: 0;
    justify-self: center;
    z-index: -1;
    padding: 0;
}

#b-roll {
    height: 100%;
}

#b-roll > source {
    height: 100%;
}

#headline-container {
    height: 92dvh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

h2 {
    border-bottom: 0.5rem solid var(--primary);
    margin: 0;
}

.call-btn-container {
   display: flex;
   justify-content: space-evenly;
}

.call-btn {
    background-color: var(--primary);
}

.btn {
    font-size: 3rem;
    border: none;
    border-radius: 1rem;
    padding: 1rem;
    margin: 2rem;
    background-color: var(--primary);
}

.what-we-do-img {
    width: 100%;
}

.section-dark {
    background-color: var(--bg);
}

.section-light {
    background-color: var(--bg-light);
}

/* careers.html */

summary{
    list-style: none;
    height: fit-content;
}
summary > h3, p {
    margin: 0;
    padding: 2dvw;
}

details {
    margin: 0;
}

.position-img {
    width: 100%;
}

.apply {
    padding: 2dvw;
}

.formInput {
    font-size: 3.5rem;
}