@font-face { font-family: 'Zen New'; font-weight: 400; font-display: swap; src: url('/fonts/NewZen-Regular.woff2') format('woff2'), url('/fonts/NewZen-Regular.woff') format('woff'); }
@font-face { font-family: 'Zen New'; font-weight: 500; font-display: swap; src: url('/fonts/NewZen-Medium.woff2') format('woff2'), url('/fonts/NewZen-Medium.woff') format('woff'); }
@font-face { font-family: 'Open Sans'; font-weight: 400; font-display: swap; src: url('/fonts/open-sans-v26-latin-regular.woff2') format('woff2'), url('/fonts/open-sans-v26-latin-regular.woff') format('woff'); }
@font-face { font-family: 'Open Sans'; font-weight: 600; font-display: swap; src: url('/fonts/open-sans-v26-latin-600.woff2') format('woff2'), url('/fonts/open-sans-v26-latin-600.woff') format('woff'); }

:root {
  --blue: #083f67;
  --blue-light: #e6eef4;
  --yellow: #ffff6f;
  --line: #9dbad5;
  --white: #fff;
  --radius: 1.5rem;
  --gutter: 1.25rem;
  --max: 1920px;
  --text: 1.125rem;
  --head: 'Zen New', 'Trebuchet MS', sans-serif;
  --body: 'Open Sans', Arial, sans-serif;
}
@media (min-width: 1024px) { :root { --text: 1.5rem; --gutter: 2.5rem; } }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--blue); font: 400 var(--text)/1.65 var(--body); -webkit-font-smoothing: antialiased; }
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--head); font-weight: 400; line-height: 1.15; margin: 0 0 .75em; }
h1 { font-size: 2.4em; }
h2 { font-size: 1.9em; }
h3 { font-size: 1.25em; }
p { margin: 0 0 1em; }

.container { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.narrow { max-width: 1100px; }
.center { text-align: center; }
main > section, main > nav { margin-block: 2.5em; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.anchor { display: block; scroll-margin-top: 1rem; }

.eyebrow { font-family: var(--head); font-size: .75em; letter-spacing: .15em; text-transform: uppercase; margin-bottom: .75em; }
.prose a { text-decoration: underline; }
.prose h1 { font-size: 2em; }
.prose h2 { font-size: 1.5em; }
.prose h3, .prose h4 { font-size: 1.15em; }
.prose h2, .prose h3, .prose h4 { margin-top: 1.5em; }
.legal { font-size: .85em; overflow-wrap: anywhere; }
.lead { font-size: 1.15em; font-weight: 600; }


.btn { display: inline-block; padding: .5em 1.2em; border-radius: 3rem; background: var(--yellow); color: var(--blue); font: 400 .9em/1.2 var(--head); text-decoration: none; transition: background .15s, color .15s; }
.btn:hover { background: var(--blue); color: var(--yellow); }
.btn-light { background: var(--blue-light); }
.btn-dark { background: var(--blue); color: var(--white); }
.btn-dark:hover { background: var(--yellow); color: var(--blue); }
.prose + .btn, .with-icon .btn { margin-top: 1em; }
.pill { display: inline-block; padding: .4em 1em; border-radius: 3rem; background: var(--blue-light); text-decoration: none; font: 400 .85em/1.2 var(--head); }
.pill-yellow { background: var(--yellow); }
.pill:hover { background: var(--blue); color: var(--yellow); }


.site-header { padding-block: 1.25rem; font-size: .8em; }
.header-bar { display: flex; align-items: center; gap: 1rem; }
.logo { flex: 0 1 300px; }
.logo img { width: 100%; height: auto; }
.main-nav, .header-actions { display: none; }
.main-nav a { display: flex; align-items: center; gap: .4em; text-decoration: none; font-family: var(--head); font-size: 1.125em; padding: 0 .1em; border-bottom: 2px solid transparent; white-space: nowrap; }
.main-nav img { width: auto; height: 2em; }
.main-nav a:hover, .main-nav a[aria-current] { border-color: var(--yellow); }
.header-actions { align-items: center; gap: .5em; margin-left: auto; }
.header-actions .btn { font-size: 1em; white-space: nowrap; }
.lang { display: inline-flex; gap: .25em; background: var(--blue-light); border-radius: 3rem; padding: .2em; }
.lang a { padding: .3em .6em; border-radius: 3rem; text-decoration: none; font-family: var(--head); font-size: .9em; }
.lang a[aria-current] { background: var(--white); }

.mobile-menu { margin-left: auto; position: relative; }
.mobile-menu summary { list-style: none; cursor: pointer; padding: .5em 1.1em; border-radius: 3rem; background: var(--blue-light); font-family: var(--head); }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu[open] summary { background: var(--blue); color: var(--white); }
.mobile-menu nav { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 10; width: min(80vw, 360px); background: var(--white); border-radius: 1rem; box-shadow: 0 20px 40px rgba(8, 63, 103, .2); padding: 1rem; display: grid; gap: .25rem; }
.mobile-menu nav > a { padding: .5em; border-bottom: 1px solid var(--blue-light); text-decoration: none; font-family: var(--head); font-size: 1.15em; }
.mobile-menu .lang { margin-top: .5em; justify-self: start; }

@media (min-width: 1800px) {
  .main-nav { display: flex; gap: 1.25em; margin-left: 2em; }
  .header-actions { display: flex; }
  .mobile-menu { display: none; }
}

.breadcrumb { font-size: .7em; margin-bottom: 1em; }
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }


.hero { display: grid; gap: 1rem; }
.hero-text { background: var(--blue-light); border-radius: var(--radius); padding: 1.5rem; display: flex; flex-direction: column; }
.hero-icon { width: 200px; margin-top: auto; padding-top: 1.5rem; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius); aspect-ratio: 16 / 9; }
@media (min-width: 900px) {
  .hero { grid-template-columns: 1fr 1fr; }
  .hero-text { padding: 2.5rem; }
  .hero-icon { width: 260px; }
}

.home-hero-inner { position: relative; border-radius: var(--radius); overflow: hidden; background: var(--blue); min-height: 420px; display: flex; align-items: center; }
.home-hero-inner video, .home-hero-inner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.home-hero-text { position: relative; color: var(--white); padding: 2rem; max-width: 760px; }
.home-hero-text h1 { text-transform: uppercase; }
.home-hero-text p { font-size: 1.15em; }
@media (min-width: 900px) { .home-hero-inner { min-height: 620px; } .home-hero-text { padding: 4rem 5rem; } }
@media (min-width: 1600px) { .home-hero-inner { min-height: 780px; } }


.split { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 900px) { .split { grid-template-columns: 7fr 5fr; gap: 4rem; } }
.with-icon { display: grid; gap: 1.5rem; }
.side-icon { width: 64px; }
@media (min-width: 1200px) { .with-icon { grid-template-columns: 96px 1fr; } .side-icon { width: 96px; } }
.media { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); margin-bottom: 2rem; }
.media.wide { aspect-ratio: 21 / 9; }

.listbox ul { list-style: none; padding: 0; margin: 0 0 1em; font-weight: 600; }
.listbox li { position: relative; padding-left: 1.25em; margin-bottom: .4em; }
.listbox li::before { content: '·'; position: absolute; left: 0; top: -.35em; font-size: 1.8em; line-height: 1.2; }


.band { padding-block: 2.5em; }
.band-blue { background: var(--blue); color: var(--white); }
.band-blue .btn:hover { background: var(--white); color: var(--blue); }
.band-blue-light { background: var(--blue-light); }
.band .with-icon { margin-bottom: 1em; }
.split-flat { margin-top: 1em; }
@media (min-width: 900px) { .split-flat { grid-template-columns: 1fr 1fr; } .listcol { border-left: 2px solid var(--line); padding-left: 3rem; } }
@media (min-width: 1200px) { .split-flat { padding-left: calc(96px + 1.5rem); } }


.boxes { display: grid; gap: 1.5rem; }
.card { border-radius: var(--radius); padding: 1.75rem; }
.card h3 { font-size: 1.4em; }
.card .prose { font-size: .8em; }
.card-dark { background: var(--blue); color: var(--line); }
.card-dark h3 { color: var(--yellow); }
.card-dark .eyebrow { color: var(--white); }
.card-dark .btn:hover { background: var(--white); color: var(--blue); }
.card-light { background: var(--blue-light); }


.tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 900px) { .tiles { grid-template-columns: repeat(4, 1fr); } }
.tile { display: block; position: relative; text-decoration: none; }
.tile img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.tile .btn { position: absolute; left: 1em; bottom: 1em; white-space: nowrap; max-width: calc(100% - 2em); overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 599px) { .tile .btn { font-size: .75em; padding: .45em .8em; left: .5em; bottom: .5em; max-width: calc(100% - 1em); } }
.tile:hover .btn { background: var(--blue); color: var(--yellow); }


.facts { background: var(--blue-light); border-radius: var(--radius); padding: 1.5rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5em 1em; text-align: center; font-family: var(--head); font-size: 1.1em; }
.facts p { margin: 0; }
.facts strong { font-weight: 400; font-size: 2.4em; line-height: 1; vertical-align: middle; margin-inline: .2em; }
.facts-logo { width: 300px; }

.jump { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .6em; }
.jump > span { margin-right: .5em; }


.contact-box { background: var(--blue); color: var(--white); border-radius: var(--radius); padding: 2rem; }
.contact-box .eyebrow { color: var(--yellow); }
.contact-box h2 { margin-top: 1.25em; }
.contact-box a:not(.btn) { color: var(--yellow); }
@media (min-width: 900px) { .contact-box { padding: 3rem; } }


.site-footer { border-top: 1px solid var(--blue-light); padding-block: 2.5rem; margin-top: 4rem; }
.locations { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.site-footer .locations { margin-top: 0; }
.location { font-size: .7em; }
.location h3 { font-size: 1.3em; margin-bottom: .4em; }
.location a { text-decoration: none; }
.location a:hover { text-decoration: underline; }
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--blue-light); }
.footer-legal { display: flex; flex-wrap: wrap; align-items: center; gap: .4em 1em; font-family: var(--head); text-transform: uppercase; letter-spacing: .12em; font-size: .65em; }
.footer-legal a { text-decoration: none; }
.footer-legal a:hover { text-decoration: underline; }
.footer-logos { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; }
.footer-logos img { height: 44px; width: auto; }