@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-light-italic.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-medium-italic.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Neo Sans Pro";
  src: url("fonts/neo-sans-pro/neo-sans-pro-bold-italic.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
}
:root {
  --font-alt: "Verdana", sans-serif;
  --color-white: #FFF;
  --color-orange: #EB6E00;
  --bg-color-body: #074154;
  --bg-color-section: #162835;
  --bg-color-footer: #0B0B33;
  --bg-color-copyright: #05137D;
  --text-color-blue: #0B0B33;
  --section-1-heading-color: #0E1C70;
  --section-3-heading-color: #6299A9;
}

*, ::before, ::after {
  /* outline: .1px solid red; */
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
}

img, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

ol, ul {
  padding-left: 1.5em;
}

a {
  color: inherit;
}
a:not(p a) {
  display: block;
  text-decoration: none;
}

html {
  font-family: "Neo Sans Pro", sans-serif;
  font-optical-sizing: auto;
  text-size-adjust: none;
  color: #0B0B33;
  overflow-x: hidden;
  scroll-behavior: smooth;
}
html.noscroll {
  overflow-y: hidden;
}
html.noscroll > body {
  overflow-y: scroll;
}

body {
  overflow-x: hidden;
}

button, .btn {
  display: block;
  padding: 15px 30px;
  border: none;
  border-radius: 16px;
  /* background-color: #0000; */
  color: inherit;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  user-select: none;
  cursor: pointer;
  transition: color 0.2s, background-color 0.2s;
}

.btn-primary {
  padding: 18px 30px 14px 30px;
  color: #002B62;
  background-image: radial-gradient(92.53% 71.14% at 50% 114.49%, #41D3B7 0%, #FFF 100%);
  box-shadow: inset 0px -3px 12px 0px rgba(65, 211, 183, 0.5019607843), 0px 4px 12px 0px rgba(65, 211, 183, 0.3490196078);
  font-size: 18px;
  text-shadow: 0px 1px 5px rgba(4, 18, 124, 0.5019607843);
  transition: background-image 0.6s ease-out, color 0.6s ease-out, box-shadow 0.6s ease-out;
  transition: background-image 0.6s ease-out, color 0.6s ease-out, box-shadow 0.6s ease-out, transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.btn-primary:hover {
  color: var(--color-white);
  background-image: radial-gradient(92.53% 71.14% at 50% 114.49%, #41D3B7 0%, #04127C 100%);
  box-shadow: 0px -6px 25px 0px #41D3B7 inset, 0px 8px 24px 0px rgba(65, 211, 183, 0.7019607843);
  transform: translateY(-3px);
}

.btn-secondary {
  padding: 12px 30px;
  color: #FFF;
  background-color: #EB6E00;
  font-size: 14px;
  transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.btn-secondary:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px hsla(0, 0%, 0%, 0.15), 0 3px 6px hsla(0, 0%, 0%, 0.1);
}
.btn-secondary:active {
  background-color: #b85600;
  transform: translateY(-3px);
}

.font-alt {
  font-family: var(--font-alt);
}

.text-center {
  text-align: center;
}

.text-blue {
  color: #0E1C70 !important;
}

.text-teal {
  color: #A0D8AD !important;
}

.text-cyan {
  color: #A5E4ED !important;
}

.text-orange {
  color: #EB6E00 !important;
}

.bg-blue {
  background-image: linear-gradient(180deg, #67C2DC 0%, #FFF 100%);
}

h1 {
  color: #fff;
  font-size: 48px;
}

h2 {
  color: #04127C;
  font-size: 40px;
  font-weight: 400;
  text-align: center;
}

@media (max-width: 700px) {
  h1 {
    font-size: 36px;
    text-align: center;
  }
  h2 {
    font-size: 32px;
  }
}
h2, strong, p, li {
  line-height: 1.5;
}

.wrap, section > div {
  width: 100%;
  max-width: 1200px;
  margin: auto;
}

.flex, .flex-col, section, section > div {
  display: flex;
  align-items: center;
  gap: 20px;
}

.flex-col, section, section > div {
  flex-direction: column;
}

section {
  gap: 40px;
  /* padding-block: clamp(50px, 1.786rem + 5.95vw, 100px); */
  padding-inline: clamp(20px, 0.385rem + 3.85vw, 60px);
  /* margin-block: 50px; */
}
section > div {
  gap: 40px;
  gap: 20px;
}

section.hero {
  position: relative;
  background-color: #10546A;
  color: #fff;
  background: #10546A url("images/hero-bg.png") top center/2000px auto no-repeat;
}
section.hero .content-wrap strong {
  color: #A0D8AD;
  font-size: 24px;
  font-weight: 400;
  /*  line-height: 1.25; */
}
section.hero .content-wrap p {
  color: #A5E4ED;
  font-size: 18px;
  font-family: var(--font-alt);
  text-align: left !important;
}
@media (max-width: 700px) {
  section.hero .content-wrap strong {
    font-size: 24px !important;
    text-align: center;
  }
  section.hero .content-wrap p {
    font-size: 14px !important;
  }
  section.hero .content-wrap br {
    display: none;
  }
}

section.hero-alt strong {
  color: #FFF;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
}

.grid-col-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  width: 100%;
}
@media (max-width: 1000px) {
  .grid-col-2 {
    grid-template-columns: 1fr !important;
  }
}
.grid-col-2 > .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  z-index: 1;
}
@media (max-width: 700px) {
  .grid-col-2 > .content-wrap {
    align-items: center;
  }
}
.grid-col-2 > .image-wrap {
  position: absolute;
  top: 0;
  left: 50vw;
  width: auto;
  max-width: none;
  height: 85%;
  z-index: -1;
}
@media (max-width: 1000px) {
  .grid-col-2 > .image-wrap {
    display: none;
  }
}
.grid-col-2 > .image-wrap:first-child {
  left: auto;
  right: 50vw;
}
@media (min-width: 1001px) {
  .grid-col-2 > .image-wrap:first-child + .content-wrap {
    grid-column-start: 2;
  }
}

.grid-col-3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--w, 320px), 1fr));
  grid-template-columns: repeat(auto-fill, minmax(var(--w, 300px), 1fr));
  gap: 15px;
  width: 100%;
}

.home-grid {
  --card-width: 250px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--card-width), 1fr));
  gap: 10px;
  width: 100%;
}

.content-bg-filter {
  position: relative;
}
.content-bg-filter::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  top: -60px;
  left: -60px;
  background-color: rgb(13, 76, 96);
  padding: 60px;
  border-radius: 60px;
  box-sizing: content-box;
  filter: blur(100px);
  z-index: -1;
}

.fancy-img {
  position: absolute;
  z-index: -1;
  width: 100%;
  user-select: none;
  pointer-events: none;
  -webkit-touch-callout: none;
}

.fancy {
  position: relative;
  z-index: 0;
}

header#site-header {
  position: relative;
  width: 100%;
  height: 65px;
  background-color: #FFF;
  box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.25);
  z-index: 10;
}
header#site-header::before {
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  background: linear-gradient(to left, #A0D8AD 0%, #65B3A4 10%, #50919B 20%, #2F5B8E 35%, #183384 45%, #091A7E 60%, #04127C 65%);
}
header#site-header > div {
  justify-content: space-between;
  max-width: 1440px;
  height: calc(100% - 5px);
  padding: 0 20px;
  margin: auto;
}
header#site-header > div nav {
  gap: 0;
  padding: 0 10px;
}
header#site-header > div nav a {
  color: #002B62;
  line-height: 40px;
  letter-spacing: 0.175em;
  padding: 2px 20px 0;
  border-bottom: 2px solid transparent;
}
header#site-header > div nav a[aria-current=page] {
  color: #EB6E00;
  border-image: linear-gradient(to right, rgba(0, 0, 0, 0), #41D3B7, rgba(0, 0, 0, 0)) 1;
}
header#site-header > div #mob-menu {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0 10px;
  border-radius: 5px;
}
@media (max-width: 900px) {
  header#site-header > div nav {
    position: absolute;
    inset: 65px 0 auto;
    display: none;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    background-color: #fff;
    text-align: center;
    z-index: 1;
  }
  header#site-header > div #mob-menu {
    display: block;
  }
  header#site-header.menu-open nav {
    display: flex;
  }
}

footer#site-footer {
  font-size: 10px;
  text-align: center;
  color: #FFF;
  background-color: #05137D;
  padding: 7px 10px;
}

#ebook-cta {
  background-color: #296E84;
  color: #FFF;
  padding-block: 95px;
}
#ebook-cta > div {
  max-width: 740px;
}
#ebook-cta h3 {
  font-size: 34px;
}
@media (max-width: 700px) {
  #ebook-cta h3 {
    font-size: 32px;
  }
}
#ebook-cta p {
  font-size: 21px;
}

#sidebar-nav {
  position: fixed;
  top: 50%;
  left: 20px;
  align-items: start;
  gap: 10px;
  transform: translateY(-50%);
  z-index: 9;
}
#sidebar-nav a {
  position: relative;
  /* height: 30px; */
  padding-left: 20px;
  color: rgba(0, 0, 0, 0);
  font-size: 14px;
  font-weight: 700;
  line-height: 30px;
  transition: color 0.3s ease-out;
}
#sidebar-nav a::before {
  content: "";
  position: absolute;
  left: 0;
  width: 2px;
  height: 100%;
  background-color: #173146;
  transition: width 0.3s ease-out, background-color 0.3s ease-out;
}
#sidebar-nav a:hover {
  color: #173146;
}
#sidebar-nav a:hover::before {
  width: 9px;
}
#sidebar-nav a.active {
  color: var(--color-orange);
}
#sidebar-nav a.active::before {
  width: 9px;
  background: currentColor;
}
@media (max-width: 900px) {
  #sidebar-nav {
    display: none;
  }
}

.tab-nav {
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  background-color: #16637B;
}
.tab-nav > a {
  color: #FFF;
  letter-spacing: 0.2em;
  /* text-transform: uppercase; */
  padding: 22px 20px 18px;
  border-bottom: 2px solid transparent;
  opacity: 0.3;
  transition: opacity 0.3s;
}
.tab-nav > a[aria-current=page] {
  opacity: 1;
  border-image: linear-gradient(to right, rgba(0, 0, 0, 0), #EB6E00, rgba(0, 0, 0, 0)) 1;
}

.card-1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 20px 18px;
  border-radius: 10px;
  background-color: #F3F8F9;
  text-align: center;
}
.card-1 img {
  width: auto;
  height: 136px;
  margin-bottom: 20px;
}
.card-1 strong {
  color: #04127C;
  font-size: 21px;
  font-weight: 700;
}
.card-1 p {
  color: #002B62;
  font-family: var(--font-alt);
  font-size: 14px;
}
@media (max-width: 700px) {
  .card-1 img {
    margin-bottom: 10px;
  }
  .card-1 strong {
    font-size: 16px;
  }
  .card-1 br {
    display: none;
  }
}

.card-2 {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
  padding: 30px;
  border-radius: 16px;
  background-color: #E6F7F6;
  color: #002B62;
  text-align: center;
  overflow: hidden;
}
.card-2::before, .card-2::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 42px;
  height: 42px;
  border-radius: 0 16px;
}
.card-2::before {
  background-color: #00275A;
  transition: background-color 0.3s ease-out;
}
.card-2:hover::before {
  background-color: #41D3B7;
}
.card-2::after {
  --mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 42 42' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 28L28 15M28 15H15M28 15V28' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
  mask: var(--mask) center no-repeat;
  -webkit-mask: var(--mask) center no-repeat;
  mask-size: cover;
  -webkit-mask-size: cover;
  background-color: #41D3B7;
  transition: background-color 0.3s ease-out, transform 0.3s ease-out;
}
.card-2:hover::after {
  background-color: #fff;
  transform: rotate(-180deg);
}
.card-2 strong {
  font-size: 21px;
}
.card-2 p {
  font-family: var(--font-alt);
  font-size: 14px;
}
.card-2 .content {
  display: flex;
  flex-direction: column;
  gap: 30px;
  transition: transform 0.3s ease-out;
}
.card-2 .text {
  position: relative;
}
.card-2 .text > :first-child {
  transition: opacity 0.3s ease-out;
}
.card-2 .text > :last-child {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease-out;
}
.card-2:hover img {
  opacity: 0 !important;
  transition: opacity 0.3s ease-out !important;
}
.card-2:hover .content {
  transform: translateY(-210px);
}
.card-2:hover .text > :first-child {
  opacity: 0;
}
.card-2:hover .text > :last-child {
  opacity: 1;
}

.card-3 {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 10px;
  max-width: 990px;
  color: #002B62;
}
@media (max-width: 700px) {
  .card-3 {
    grid-template-columns: 1fr;
  }
}
.card-3 img {
  aspect-ratio: 1;
  width: 100%;
  height: auto;
  max-height: 300px;
  object-fit: cover;
  border-radius: 16px;
}
.card-3 .content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  padding: 15px 20px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.7);
}
.card-3 h3 {
  color: var(--color-orange);
  font-size: 24px;
  line-height: 1.5;
}
.card-3 p {
  font-size: 16px;
  font-family: var(--font-alt);
}
.card-3 ul {
  list-style: none;
  padding: 0;
}
.card-3 ul li {
  display: flex;
  gap: 15px;
  padding: 10px;
  border-top: 1px solid #EBECF0;
  font-family: var(--font-alt);
  font-size: 14px;
}
.card-3 ul li:before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%2341D3B7' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpath stroke='%2341D3B7' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M22 4 12 14.01l-3-3'/%3E%3C/svg%3E");
  height: 24px;
}

.card-4 {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
  padding: 110px 25px 25px;
  border-radius: 24px;
  background: linear-gradient(0deg, #0B0B33 0%, rgba(11, 11, 51, 0.2509803922) 100%), var(--bg-image) center/cover no-repeat;
  color: #fff;
  text-align: center;
}
.card-4 strong {
  font-size: 21px;
}
.card-4 p {
  font-family: var(--font-alt);
}

.card-5 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 20px;
  border-radius: 8px;
  background-color: #fff;
}
.card-5 strong {
  color: #EB6E00;
  font-weight: 400;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
}
.card-5 h4 {
  color: #002B62;
  font-weight: 400;
  margin-bottom: 10px;
}
.card-5 a.btn-secondary {
  margin-top: auto;
}

.video-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
}
.video-card .video-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-card img.yt-play-btn {
  position: absolute;
  inset: 0;
  margin: auto;
  width: min(18.5%, 122px);
  height: auto;
}

.home-page section#section-1 {
  gap: 100px;
  padding-block: 85px;
  overflow: hidden;
  /* overflow added for text background after pseudo element  */
}
.home-page section#section-1 .content-wrap strong {
  font-size: 32px;
}
.home-page section#section-1 .content-wrap p {
  font-size: 20px;
}
.home-page section#section-1 > div:last-of-type {
  background-color: #0D4C60;
  max-width: 860px;
  padding: 4px 14px 14px;
  border: 16px solid transparent;
  border-image: url("images/corners.svg") 16;
  box-shadow: 0 0 0 15px rgba(56, 128, 151, 0.3), 30px 0 0 rgba(56, 128, 151, 0.3), -30px 0 0 rgba(56, 128, 151, 0.3), 0 30px 0 rgba(56, 128, 151, 0.3), 0 -30px 0 rgba(56, 128, 151, 0.3);
}
.home-page section#section-1 > div:last-of-type * {
  color: #FFF;
  font-size: 24px;
}
.home-page section#section-1 > div:last-of-type strong {
  font-weight: 700;
}
@media (max-width: 700px) {
  .home-page section#section-1 {
    padding-block: 40px 30px;
  }
  .home-page section#section-1 .content-wrap strong {
    font-size: 21px;
  }
  .home-page section#section-1 .content-wrap p {
    font-size: 14px;
  }
  .home-page section#section-1 > div:last-of-type {
    padding-inline: 0;
  }
  .home-page section#section-1 > div:last-of-type * {
    font-size: 21px;
  }
}
.home-page section#section-2 {
  padding-block: 50px;
}
.home-page section#section-2 > div {
  max-width: 1320px;
}
.home-page section#section-3 {
  padding-block: 50px;
}
.home-page section#section-3 > div {
  gap: 50px;
}
.home-page section#section-3 > div .flex {
  align-items: start;
  gap: 5.5%;
}
.home-page section#section-3 > div .flex .big {
  flex: 33%;
  color: #04127C;
  font-size: 64px;
  font-weight: 300;
  line-height: 1.25;
}
.home-page section#section-3 > div .flex .flex-col {
  flex: 65%;
  gap: 16px;
  font-size: 20px;
}
.home-page section#section-3 > div .flex .flex-col strong {
  color: var(--color-orange);
  font-size: 24px;
}
@media (max-width: 900px) {
  .home-page section#section-3 {
    background-color: #67C2DC;
    text-align: center;
    padding-block: 30px;
  }
  .home-page section#section-3 > div {
    gap: 20px;
  }
  .home-page section#section-3 > div .flex {
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 20px;
    border-radius: 8px;
    background: #fff;
  }
  .home-page section#section-3 > div h2, .home-page section#section-3 > div .big {
    font-size: 32px !important;
  }
  .home-page section#section-3 > div strong {
    font-size: 16px !important;
  }
  .home-page section#section-3 > div p {
    font-size: 14px;
  }
}
.home-page section#pillars {
  position: relative;
  width: 100%;
  background-color: #D2EEF2;
}
.home-page section#pillars #map-bg, .home-page section#pillars > div {
  width: 100%;
  max-width: 1400px;
}
.home-page section#pillars .animation-container {
  position: absolute;
  width: 100%;
  height: 100%;
}
.home-page section#pillars .grid {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  justify-items: start;
  align-items: start;
  width: 70%;
  max-width: 900px;
  height: 90%;
}
.home-page section#pillars .grid a {
  position: relative;
  display: flex;
  padding: 12px 30px 10px;
  border-radius: 8px;
  background-color: #FFF;
  color: #002B62;
  font-size: 24px;
  letter-spacing: 3.6px;
  text-transform: uppercase;
  filter: drop-shadow(0px 0px 0px #FFF);
  transition: background-color 0.3s ease-out, color 0.3s ease-out, filter 0.3s ease-out;
}
.home-page section#pillars .grid a:first-of-type {
  align-self: center;
  justify-self: end;
}
.home-page section#pillars .grid a::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  width: 24px;
  height: 24px;
  margin: auto;
  border-radius: 4px 0;
  background-color: inherit;
  transform: rotate(45deg) skew(5deg, 5deg) translate(8px, 8px);
  z-index: -1;
}
.home-page section#pillars .grid a:hover {
  background-color: #EB6E00;
  color: #fff;
  filter: drop-shadow(0px 8px 24px #EB6E00);
}

@keyframes moveClouds {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.cloud-container {
  position: absolute;
  height: 100%;
  width: 200%;
  top: 0;
  left: -50%;
  z-index: -1;
}

.cloud {
  top: 0;
  left: 0;
  pointer-events: none;
}
.cloud img {
  width: 700px;
  height: 400px;
  position: absolute;
  transition: transform 0.3s ease-in-out;
  /* mix-blend-mode: screen; */
  /* background-color: red; */
  /* border: 100px solid blue; */
}

#cloud1 img {
  top: 0;
  left: -50%;
  /* top: -100px; */
  /* right: 300px; */
}

#cloud2 img {
  top: 300px;
  left: -75%;
  /* top: -150px; */
}

#cloud3 img {
  top: 500px;
  left: -25%;
  /* top: -350px; */
  /* left: 500px; */
}

#cloud4 img {
  top: 100px;
  left: -10%;
  /* top: -500px; */
  /* left: -200px; */
}

.paused {
  animation-play-state: paused;
}

.pillar-page section#section-1 {
  padding-block: 75px 165px;
}
.pillar-page section#section-1 .image-wrap {
  height: 100%;
}
.pillar-page section#section-2 > div > p {
  max-width: 775px;
  font-size: 18px;
}
.pillar-page section#section-2 .grid-col-3 {
  padding-block: 30px;
}
.pillar-page section#section-3 {
  background-color: #D2EEF2;
  padding-block: 60px 185px;
}
.pillar-page section#section-3 > div {
  gap: 50px;
}

.resources-page {
  /* REMOVED */
}
.resources-page section {
  padding-block: 50px;
}
.resources-page section > div {
  gap: 30px;
  max-width: 1120px;
}
.resources-page h2 {
  align-self: start;
  color: #002B62;
  font-size: 32px;
  font-weight: 700;
}
.resources-page section#section-1 {
  padding-block: 140px 280px;
}
.resources-page section#section-1 .grid-col-2 {
  grid-template-columns: 1fr 1.65fr;
  align-items: center;
}
.resources-page section#section-1 h1 {
  align-self: stretch;
}
.resources-page section#section-1 p {
  font-family: inherit;
  font-size: 21px;
}
.resources-page #sec-related {
  padding-block: 50px 100px;
}
.resources-page .video-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
}
.resources-page .video-card .video-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.resources-page .video-card img.yt-play-btn {
  position: absolute;
  inset: 0;
  margin: auto;
  width: min(18.5%, 122px);
  height: auto;
}
.resources-page .video-carousel {
  position: relative;
  display: flex;
  flex-direction: row;
  gap: 40px;
  width: min(100%, 1440px);
  padding-inline: 150px;
  padding-inline: 0 150px;
  overflow-y: auto;
  scrollbar-width: none;
  --mask: linear-gradient(90deg, #0000 0, #000 150px),
  			linear-gradient(-90deg, #0000 0, #000 150px);
  --mask: linear-gradient(-90deg, #0000 0, #000 150px);
  mask-image: var(--mask);
  -webkit-mask-image: var(--mask);
  mask-composite: source-in;
  -webkit-mask-composite: source-in;
}
.resources-page .video-carousel::-webkit-scrollbar {
  display: none;
}
.resources-page .video-carousel .video-card {
  flex: 310px 0 0;
  height: 175px;
}
.resources-page section#section-2 {
  background-color: #7AB7C0;
}
.resources-page section#section-2 .grid-col-3 {
  gap: 30px;
}
.resources-page section#section-3 .container {
  width: 100%;
  border-radius: 16px;
  background-color: #7AB7C0;
}
.resources-page section#section-3 .container > div ~ div {
  border-top: 1px solid #16637B;
}
.resources-page section#section-3 .container > .flex {
  width: 100%;
  padding: 20px;
}
.resources-page section#section-3 .container > .flex h3 {
  flex: 190px 1 0;
  color: #002B62;
  font-size: 21px;
  font-weight: 400;
  letter-spacing: 0.1em;
}
.resources-page section#section-3 .container > .flex .grid-col-3 {
  --w: 210px;
  align-items: stretch;
  gap: 20px;
}
@media (max-width: 1000px) {
  .resources-page section#section-3 .container > .flex {
    flex-direction: column;
  }
  .resources-page section#section-3 .container > .flex h3 {
    flex: none;
    width: 100%;
  }
}

.about-page section#section-1 {
  padding-block: 140px 200px;
}
.about-page section#section-2 {
  padding-block: 115px 90px;
}
.about-page section#section-2 > div {
  gap: 40px;
  max-width: 1120px;
}
.about-page section#section-2 .grid-col-3 {
  gap: 25px;
}
.about-page section#section-2 img {
  height: 180px;
}

.contact-page section#section-1 {
  padding-block: 140px 100px;
}

#fancy-1, #fancy-3, #fancy-4, #fancy-6, #fancy-7, #fancy-8 {
  bottom: 0;
}

#fancy-1 {
  max-height: 280px;
  min-height: 200px;
}

#fancy-2 {
  top: 0;
  max-height: 280px;
}

#fancy-3 {
  max-height: 175px;
}

#fancy-4 {
  max-height: 250px;
}

#fancy-5 {
  top: 0;
  max-height: 175px;
}

#fancy-6 {
  max-height: 280px;
}

#fancy-7 {
  max-height: 175px;
}

#fancy-8 {
  max-height: 175px;
}