:root {
  color-scheme:light;
  --navy:#072949;
  --accent:#92b9ce;
  --ink:#102f4b;
  --paper:#f7f9fc
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--paper)
}

a {
  color:inherit
}

header {
  padding:24px 6vw;
  background:#fff;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid #dfe7ed;
  gap:24px
}

/* Display the supplied logo without modifying the original image.
   The frame hides the large white margins in the source file. */
.brand {
  position: relative;
  width: min(292px, 100%);
  aspect-ratio: 6.4 / 1;
  overflow: hidden;
  flex-shrink: 1;
}
.brand-logo {
  position: absolute;
  width: 114%;
  max-width: none;
  height: auto;
  left: 0;
  top: 50%;
  transform: translate(-6%, -50%);
}
.header-contact {
  font-size:14px;
  text-decoration:none;
  border-bottom:1px solid #91a7b6;
  padding-bottom:5px
}

main {
  display:grid;
  grid-template-columns:1.13fr 1fr;
  min-height:calc(100svh - 193px)
}

.intro {
  padding:80px 6vw 72px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start
}

.eyebrow {
  margin:0 0 30px;
  font-size:13px;
  letter-spacing:2.3px;
  text-transform:uppercase;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:12px
}

.eyebrow:before {
  content:'';
  width:28px;
  height:2px;
  background:var(--accent)
}

h1 {
  font:clamp(3rem,5.6vw,6.5rem)/1.02 Georgia,'Times New Roman',serif;
  letter-spacing:-2.5px;
  margin:0 0 30px;
  font-weight:400
}

h1 em {
  font-weight:400;
  color:#426b88
}

.description {
  font-size:18px;
  line-height:1.8;
  max-width:420px;
  color:#536b7d;
  margin:0 0 38px
}

.button {
  background:var(--navy);
  color:white;
  padding:17px 26px;
  border-radius:3px;
  text-decoration:none;
  font-size:16px;
  display:inline-block;
  font-weight:600;
  transition:background .2s
}

.button:hover {
  background:#154667
}

.button:focus-visible,.header-contact:focus-visible,footer a:focus-visible {
  outline:3px solid #427898;
  outline-offset:6px
}

.email {
  font-size:14px;
  color:#536b7d;
  margin:17px 0 0;
  overflow-wrap:anywhere
}

.panel {
  background:var(--navy);
  padding:60px 48px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
  color:#f0f5fa
}

.panel:before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,transparent 35%,#ffffff04 35%,#ffffff04 65%,transparent 65%);
  pointer-events:none
}

.panel-top {
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(1rem, 1.5vw, 1.25rem);
  font-weight: 400;
  letter-spacing: -0.6px;
  line-height: 1.3;
  position: relative;
}
.panel-top strong {
  font-weight: 800;
}

.statement {
  position:relative;
  margin:auto 0;
  padding:60px 0
}

.statement small {
  display:block;
  color:var(--accent);
  font-size:14px;
  letter-spacing:1px;
  margin-bottom:22px
}

.statement p {
  font:clamp(2.2rem,3.5vw,4.5rem)/1.2 Georgia,serif;
  margin:0;
  max-width:420px
}

.panel-bottom {
  position:relative;
  border-top:1px solid #ffffff28;
  padding-top:24px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:13px;
  color:#bdcedb;
  letter-spacing:.4px
}

footer {
  padding:25px 6vw;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  font-size:13px;
  color:#536b7d
}

footer a {
  text-decoration:none
}

footer p {
  margin:0
}

::selection {
  background:#92b9ce;
  color:#072949
}

@media(min-width:1500px) {
  main {
  min-height:750px
}


}

@media(max-width:800px) {
  header {
  padding:23px 6vw
}

.header-contact {
  display:none
}

main {
  grid-template-columns:1fr;
  min-height:0
}

.intro {
  padding:65px 7vw
}

h1 {
  font-size:clamp(3rem,10vw,5rem);
  letter-spacing:-1.5px
}

.description {
  font-size:17px
}

.panel {
  padding:34px 7vw;
  min-height:380px
}

.statement {
  padding:48px 0
}

.statement p {
  font-size:2.7rem
}

.panel-bottom {
  flex-wrap:wrap
}

footer {
  padding:24px 7vw;
  align-items:flex-start;
  flex-direction:column;
  line-height:1.6
}


}

@media(prefers-reduced-motion:reduce) {
  * {
  transition:none!important
}


}