:root {
    --blue: #00467F;
    --text: #3D3D3D;
    --gray: #EBEBEB;
    --font: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
}
* {box-sizing: border-box;}
html {scroll-behavior: smooth;}
body {background-color: #fff; color: var(--text); font-family: var(--font) !important; margin: 0; padding: 0; font-optical-sizing: auto; font-weight: normal; font-style: normal;}

/* IMAGES */
img {max-width: 100%; height: auto; border: 0;}

/* RESPONSIVE VIDEOS */
.embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;} 
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* MAX WIDTHS */ 
.header-max-width   {width: 100%; max-width: 1800px; margin: 0 auto; display: block; position: relative;}

.max-width-1600, 
.max-width          {width: 100%; max-width: 1600px; margin: 0 auto; display: block; position: relative;}

.max-width-1400     {width: 100%; max-width: 1400px; margin: 0 auto; display: block; position: relative;}

.max-width-1200,
.content-max-width  {width: 100%; max-width: 1200px; margin: 0 auto; display: block; position: relative;}

.max-width-900,
.text-max-width     {width: 100%; max-width: 900px;  margin: 0 auto; display: block; position: relative;}

@media ( max-width: 1800px ) {
    .header-max-width {padding-left: 4%; padding-right: 4%;}
}
@media ( max-width: 1700px ) {
    .max-width-1600,
    .max-width {padding-left: 4%; padding-right: 4%;}
}
@media ( max-width: 1280px ) {
    .header-max-width {padding-left: 2%; padding-right: 2%;}
}

/* SECTIONS */
.white-section {background-color: #fff;}
.gray-section  {background-color: var(--gray);}
.blue-section  {background-color: var(--blue);}

/* PADDING */
.xlarge-padding {padding-top: 120px; padding-bottom: 120px;}
.large-padding  {padding-top: 90px; padding-bottom: 90px;}
.medium-padding {padding-top: 60px; padding-bottom: 60px;}
.small-padding  {padding-top: 30px; padding-bottom: 30px;}

.xlarge-top-padding {padding-top: 120px;}
.xlarge-bottom-padding {padding-bottom: 120px;}
.large-top-padding {padding-top: 90px;}
.large-bottom-padding {padding-bottom: 90px;}
.medium-top-padding {padding-top: 60px;}
.medium-bottom-padding {padding-bottom: 60px;}
.small-top-padding {padding-top: 30px;}
.small-bottom-padding {padding-bottom: 30px;}
.none-top-padding {padding-top: 0;}
.none-bottom-padding {padding-bottom: 0;}

.side-padding   {padding-left: 4%; padding-right: 4%;}

.margin-top-100 {margin-top: -100px;}
.margin-top-80  {margin-top: -80px;}
.margin-top-60  {margin-top: -60px;}

/* ALIGNMENT */
.align-left   {text-align: left;}
.align-center {text-align: center;}
.align-right  {text-align: right;}

/* GENERAL */
p, ul, ol, table {font-size: 24px; line-height: 1.4em; font-weight: normal;}
p {margin: 0 0 33px 0;}
blockquote p {font-size: 14px; margin: 0 0 20px 0;}

ul {list-style-type: disc; padding-left: 20px; margin: 0 0 33px 0;}
ul ul {list-style-type: circle;}
ol {padding-left: 20px; margin: 0 0 33px 0;}
ul p, ol p {margin: 0;}

a {color: var(--blue); text-decoration: underline;}
a:hover, a:focus {color: var(--text); text-decoration: underline;}

strong, b {font-weight: 500;}
em, i {font-style: italic;}
sup {position: relative; vertical-align: baseline; font-size: 0.6em; top: -0.6em; line-height: 0;}
sub {line-height: 1em;}
hr {border: 0; height: 1px; background: #e7edf2; margin: 40px 0;}
iframe {width: 100% !important; max-width: 100%; display: inline-block;}
blockquote {background-color: var(--gray); padding: 20px; margin: 0;}
figure {margin: 0; padding: 0; max-width: 100%; display: inline-block;}
figure p {margin: 0; padding: 0;}
figcaption {font-size: 12px; text-transform: uppercase; font-style: italic; font-weight: 500; margin: 10px 0 0 0;}

/* TABLES */
table {text-align: left; vertical-align: top; margin-bottom: 40px;}
table tr {text-align: left; vertical-align: top;}
table tr td {text-align: left; vertical-align: top;}
table tr th {vertical-align: top;}

table.styled {width: 100%; border-collapse: collapse; border: 1px solid #e0e0e0;}
table.styled th {
    border-collapse: collapse; border: 1px solid #e0e0e0; background-color: #e7e7e7; font-weight: 700; text-align: left; vertical-align: top; padding: 10px;
}
table.styled td {
    border-collapse: collapse; border: 1px solid #e0e0e0; background-color: #fff0; font-weight: 400; text-align: left; vertical-align: top; padding: 10px;
}
table.styled tr:nth-child(odd) td {
    border-collapse: collapse; border: 1px solid #e0e0e0; background-color: #eee; font-weight: 400; text-align: left; vertical-align: top; padding: 10px;
}
table.styled td.even {
    border-collapse: collapse; border: 1px solid #e0e0e0; background-color: #eee; font-weight: 400; text-align: left; vertical-align: top; padding: 10px;
}
table p {margin: 0;}
table th p {font-weight: 500;}

/* HEADINGS */
h1, 
.big h1   {color: #fff; font-size: 95px; line-height: 1em;   font-weight: 500; text-transform: uppercase; margin: 0; padding: 0; text-shadow: 0 2px 12px rgb(0 0 0 / 38%);}
.small h1 {color: #fff; font-size: 58px; line-height: 1.1em; font-weight: 500; text-transform: uppercase; margin: 0; padding: 0; text-shadow: none;}
.small h1 span {font-size: 48px;}

h2, 
.small h2,
h1.project-title, 
h1.home {color: var(--blue); font-size: 32px; line-height: 1.1em; font-weight: 500; text-transform: uppercase; margin: 0 0 35px 0; padding: 0; text-shadow: none;}
h2.home {font-size: 32px; text-align: center;}
.big h2, 
h2.big  {color: var(--blue); font-size: 58px; line-height: 1.1em; font-weight: 500; text-transform: none; margin: 0 0 35px 0; padding: 0;}

h3 {color: var(--blue); font-size: 24px; line-height: 1.1em; font-weight: 500; text-transform: none; margin: 0 0 26px 0;}
h4 {color: var(--text); font-size: 12px; line-height: 1.1em; font-weight: 500; text-transform: uppercase; margin: 0 0 15px 0;}

.blue-section h1, .blue-section h2, .blue-section h3, .blue-section h4, 
.blue-section p, .blue-section ul, .blue-section ol {color: #fff;}

@media ( max-width: 1400px ) {
    h1, 
    .big h1   {font-size: 90px;}
    .small h1 {font-size: 54px;}
    .small h1 span {font-size: 44px;}
}
@media ( max-width: 1200px ) {
    p, ul, ol, table {font-size: 23px; margin: 0 0 32px 0;}

    h1, 
    .big h1   {font-size: 80px;}
    .small h1 {font-size: 54px;}
    .small h1 span {font-size: 44px;}

    h2, 
    .small h2,
    h1.project-title, 
    h1.home {font-size: 31px; margin: 0 0 34px 0;}
    h2.home {font-size: 31px;}
    .big h2, 
    h2.big  {font-size: 54px; margin: 0 0 34px 0;}
}
@media ( max-width: 1000px ) {
    p, ul, ol, table {font-size: 22px; margin: 0 0 31px 0;}

    h1, 
    .big h1   {font-size: 70px;}
    .small h1 {font-size: 50px;}
    .small h1 span {font-size: 40px;}

    h2, 
    .small h2,
    h1.project-title, 
    h1.home {font-size: 30px; margin: 0 0 33px 0;}
    h2.home {font-size: 30px;}
    .big h2, 
    h2.big  {font-size: 50px; margin: 0 0 33px 0;}

    .xlarge-padding {padding-top: 115px; padding-bottom: 115px;}
    .large-padding  {padding-top: 85px; padding-bottom: 85px;}
    .medium-padding {padding-top: 55px; padding-bottom: 55px;}

    .xlarge-top-padding {padding-top: 115px;}
    .xlarge-bottom-padding {padding-bottom: 115px;}
    .large-top-padding {padding-top: 85px;}
    .large-bottom-padding {padding-bottom: 85px;}
    .medium-top-padding {padding-top: 55px;}
    .medium-bottom-padding {padding-bottom: 55px;}
}
@media (max-width: 800px) {
    p, ul, ol, table {font-size: 21px; margin: 0 0 30px;}
    figcaption {font-size: 11px; margin: 9px 0 0;}

    h1,
    .big h1   {font-size: 60px;}
    .small h1 {font-size: 46px;}
    .small h1 span {font-size: 36px;}

    h2,
    .small h2,
    h1.project-title, 
    h1.home {font-size: 29px; margin: 0 0 32px;}
    h2.home {font-size: 29px;}
    .big h2, 
    h2.big  {font-size: 46px; margin: 0 0 32px;}

    .xlarge-padding {padding-top: 110px; padding-bottom: 110px;}
    .large-padding  {padding-top: 80px; padding-bottom: 80px;}
    .medium-padding {padding-top: 50px; padding-bottom: 50px;}
    .small-padding  {padding-top: 25px; padding-bottom: 25px;}

    .xlarge-top-padding {padding-top: 110px;}
    .xlarge-bottom-padding {padding-bottom: 110px;}
    .large-top-padding {padding-top: 80px;}
    .large-bottom-padding {padding-bottom: 80px;}
    .medium-top-padding {padding-top: 50px;}
    .medium-bottom-padding {padding-bottom: 50px;}
    .small-top-padding {padding-top: 25px;}
    .small-bottom-padding {padding-bottom: 25px;}
}

@media (max-width: 767px) {
    p, ul, ol, table {font-size: 20px; margin: 0 0 28px;}

    h1,
    .big h1   {font-size: 50px; text-shadow: none;}
    .small h1 {font-size: 42px;}
    .small h1 span {font-size: 42px;}

    h2,
    .small h2,
    h1.project-title, 
    h1.home {font-size: 28px; margin: 0 0 31px;}
    h2.home {font-size: 28px;}
    .big h2, 
    h2.big  {font-size: 42px; margin: 0 0 31px;}

    .xlarge-padding  {padding-top: 105px; padding-bottom: 105px;}
    .large-padding  {padding-top: 75px; padding-bottom: 75px;}
    .medium-padding {padding-top: 45px; padding-bottom: 45px;}
    .small-padding  {padding-top: 25px; padding-bottom: 25px;}

    .xlarge-top-padding {padding-top: 105px;}
    .xlarge-bottom-padding {padding-bottom: 105px;}
    .large-top-padding {padding-top: 75px;}
    .large-bottom-padding {padding-bottom: 75px;}
    .medium-top-padding {padding-top: 45px;}
    .medium-bottom-padding {padding-bottom: 45px;}
    .small-top-padding {padding-top: 25px;}
    .small-bottom-padding {padding-bottom: 25px;}
}
@media (max-width: 500px) {
    p, ul, ol, table {font-size: 19px; margin: 0 0 26px;}
    figcaption {font-size: 10px; margin: 8px 0 0;}

    h1,
    .big h1   {font-size: 40px;}
    .small h1 {font-size: 38px;}
    .small h1 span {font-size: 38px;}

    h2,
    .small h2,
    h1.project-title, 
    h1.home {font-size: 26px; margin: 0 0 30px;}
    h2.home {font-size: 26px;}
    .big h2, 
    h2.big  {font-size: 38px; margin: 0 0 30px;}

    .xlarge-padding {padding-top: 100px; padding-bottom: 100px;}
    .large-padding  {padding-top: 70px; padding-bottom: 70px;}
    .medium-padding {padding-top: 40px; padding-bottom: 40px;}
    .small-padding  {padding-top: 20px; padding-bottom: 20px;}

    .xlarge-top-padding {padding-top: 100px;}
    .xlarge-bottom-padding {padding-bottom: 100px;}
    .large-top-padding {padding-top: 70px;}
    .large-bottom-padding {padding-bottom: 70px;}
    .medium-top-padding {padding-top: 40px;}
    .medium-bottom-padding {padding-bottom: 40px;}
    .small-top-padding {padding-top: 20px;}
    .small-bottom-padding {padding-bottom: 20px;}
}
@media (max-width: 430px) {
    h1, 
    .big h1   {font-size: 30px;}
    .small h1 {font-size: 36px;}
    .small h1 span {font-size: 36px;}

    h2,
    .small h2,
    h1.project-title, 
    h1.home {font-size: 24px; margin: 0 0 29px;}
    h2.home {font-size: 24px;}
    .big h2, 
    h2.big  {font-size: 30px; margin: 0 0 29px;}
}

/* modal / venobox */
.vbox-inline, .vbox-figlio {height: auto !important; box-shadow: none !important; background: none !important; overflow: hidden !important;}
.vbox-inline video {width: 100%; height: auto; max-width: 100%; display: block;}
.vbox-overlay {cursor: pointer;}
.vbox-close {opacity: 0 !important;}
.vbox-inline .overlay-closer-x {width: 100%; text-align: right; position: absolute; top: 0; right: 0;}
.vbox-inline .overlay-closer-x .vbox-close {
	display: inline-block; font-size: 25px !important; width: auto; height: auto; line-height: 1em; color: #fff !important; font-weight: normal; position: absolute !important; 
	top: -4px; right: 4%; cursor: pointer; opacity: 1 !important; background: none; padding: 0; margin: 0; text-align: right;
}
.vbox-inline .overlay-instructions {text-align: right; color: #ccc; font-size: 14px; line-height: 1em; padding: 10px 0 0 0;}

/* INTRO + OUTRO */
.intro-text {margin: 0 0 55px 0; text-align: center;}
.outro-text {margin: 35px 0 0 0; text-align: center;}

/* COLUMNS */
.content-two-columns {display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap;}
.content-two-columns div.left-column, 
.content-two-columns div.right-column {display: inline-block; width: 46%;}
.content-two-columns div.left-column :last-child, 
.content-two-columns div.right-column :last-child {margin: 0;}

.blue-section .content-two-columns, 
.blue-section .content-two-columns p, 
.blue-section .content-two-columns h1, 
.blue-section .content-two-columns h2, 
.blue-section .content-two-columns h3, 
.blue-section .content-two-columns h4, 
.blue-section .content-two-columns ul, 
.blue-section .content-two-columns ol {color: #fff;}

@media ( max-width: 1000px ) {
    .content-two-columns {flex-wrap: wrap;}
    .content-two-columns div.left-column, 
    .content-two-columns div.right-column {display: block; width: 100%;}
    .content-two-columns .left-column {margin-bottom: 40px;}

    .margin-top-100, .margin-top-80, .margin-top-60 {margin-top: 0;}
}

/* FEATURED PROJECTS */
.featured-projects {display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: stretch;}
.featured-projects .featured-project {display: inline-block; width: 49.5%; text-decoration: none;}
.featured-projects .featured-project img {
    width: 100%;          /* Let the width span the available container space */
    aspect-ratio: 4 / 3;  /* Define your target aspect ratio (e.g., 16:9, 1:1, 4:3) */
    object-fit: cover;    /* Crops the excess image data without distorting the image */
}
@media ( max-width: 767px ) {
    .featured-projects {flex-wrap: wrap;}
    .featured-projects .featured-project {display: block; width: 100%; margin: 0 0 30px 0;}
}

/* RELATED PROJECTS */
a.featured-project figcaption {padding-left: 0; transition-property: padding-left; transition-duration: .35s;}
a.featured-project:hover figcaption {padding-left: 10px;}
a.featured-project figcaption > span {font-size: 16px; opacity: 1.0; padding-left: 0; transition-property: opacity,padding-left; transition-duration: .45s; transition-timing-function:cubic-bezier(0.25, 0.46, 0.45, 0.94);}
a.featured-project:hover figcaption > span {opacity: 0; padding-left: 30px;}
.max-width.push-right {display: flex; justify-content: right;}
.max-width.push-right .content-max-width {margin: 0;}

/* MANAGEMENT TEAM */
.management-team {display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; margin: 0; padding: 0; width: 100%; list-style: none; box-sizing: border-box;}
.management-team li {display: inline-block; margin: 0 60px 60px 0; width: 250px; list-style: none; text-align: left; box-sizing: border-box;}
.management-team li img {display: block; text-align: center; margin: 0 auto; width: 100%; height: auto; max-width: 100%; margin-bottom: 25px;}
.management-team li strong {font-weight: 500; color: var(--blue);}
.management-team li a.border-button {margin-top: 20px;}

.management-team-modal {background-color: #fff; padding: 50px 70px 50px 60px;}
.management-team-modal strong {font-weight: 500; color: var(--blue);}

@media screen and (min-width: 1301px) {
    .management-team li:nth-child(4), 
    .management-team li:nth-child(8), 
    .management-team li:nth-child(12) {margin-right: 0;}
}
@media screen and (max-width: 1400px) {
    .management-team-modal {padding: 45px 60px 45px 55px;}
} 
@media screen and (min-width: 961px) and (max-width: 1300px) {
    .management-team li:nth-child(3), 
    .management-team li:nth-child(6), 
    .management-team li:nth-child(9), 
    .management-team li:nth-child(12) {margin-right: 0;}
}
@media screen and (max-width: 1200px) {
    .management-team-modal {padding: 40px 60px 40px 50px;}
}
@media screen and (max-width: 1000px) {
    .management-team-modal {padding: 35px 50px 35px 40px;}
}
@media screen and (min-width: 561px) and (max-width: 960px) {
    .management-team li:nth-child(even) {margin-right: 0;}
}
@media screen and (max-width: 767px) {
	.management-team-modal {padding: 30px;}
}
@media screen and (max-width: 560px) {
    .management-team li {margin-right: 0;}
}

/* Sections: reveal when they enter the viewport (with javascript) */
.reveal {opacity: 0; transform: translateY(18px); transition: opacity 650ms ease, transform 650ms ease;}
.reveal.is-visible {opacity: 1; transform: translateY(0);}