/* Inter is self-hosted; see assets/fonts/Inter-LICENSE.txt. */
@font-face {
  font-family: 'Inter';
  src: url('../fonts/InterVariable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

:root {
  --bg: #020a0e;
  --panel: #031018;
  --blue: #4AF1F2;
  --bright: #4AF1F2;
  --text: #f5f6f7;
  --muted: #a4cde4;
  --border: #21465a;
  --max: none;
  color-scheme: dark
}

* {
  box-sizing: border-box
}

html {
  scroll-behavior: smooth
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-optical-sizing: auto;
  font-size: clamp(14px, 1.43vw, 21px);
  line-height: 1.4
}

a {
  color: inherit;
  text-decoration: none
}

button, input, textarea {
  font: inherit
}

button, a, input, textarea {
  -webkit-tap-highlight-color: transparent
}

button {
  cursor: pointer
}

img {
  display: block;
  max-width: 100%
}

h1, h2, h3, p {
  margin: 0
}

p+p {
  margin-top: .75em
}

h1, h2, h3 {
  line-height: 1.08;
  letter-spacing: -.035em
}

h1 {
  font-size: clamp(45px, 6.6vw, 95px);
  font-weight: 700
}

h2 {
  font-size: clamp(28px, 3.7vw, 53px);
  margin-bottom: .34em
}

h3 {
  font-size: 1.1em
}

h1 span, h2 span, h3, .logo span {
  color: var(--bright)
}

ul, ol {
  padding: 0;
  margin: 0
}

::selection {
  background: #186e70;
  color: #fff
}

:focus-visible {
  outline: 2px solid #4AF1F2;
  outline-offset: 5px
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0
}

.skip-link {
  position: absolute;
  left: 15px;
  top: -100px;
  z-index: 100;
  background: var(--bg);
  padding: 12px
}

.skip-link:focus {
  top: 10px
}

.site-header {
  height: clamp(64px, 5.35vw, 78px);
  background: linear-gradient(110deg, #03090c, #020b12);
  border: 1px solid #183442;
  position: relative;
  z-index: 20
}

.header-inner {
  height: 100%;
  max-width: var(--max);
  margin: auto;
  padding: 0 4.4%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px
}

.logo {
  font-weight: 700;
  font-size: clamp(27px, 2.85vw, 41px);
  letter-spacing: -.025em;
  white-space: nowrap
}

.logo span {
  font-weight: 500;
  color: var(--blue)
}

nav {
  height: 100%;
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 44px);
  font-size: clamp(12px, 1.15vw, 17px)
}

nav>a:not(.button) {
  display: flex;
  align-items: center;
  height: 100%;
  position: relative;
  white-space: nowrap
}

nav>a.active {
  color: var(--blue)
}

nav>a.active:after {
  content: "";
  height: 2px;
  background: var(--blue);
  position: absolute;
  bottom: 12%;
  left: 0;
  right: 0
}

nav>a:hover {
  color: #4AF1F2
}

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  padding: .8em 1.9em;
  border: 2px solid var(--blue);
  border-radius: 40px;
  color: #fff;
  background: linear-gradient(180deg, #0c414188, #00101ddb 50%, #14626555);
  box-shadow: 0 0 13px #4AF1F230, inset 0 0 9px #4AF1F225;
  font-size: clamp(13px, 1.2vw, 18px);
  line-height: 1.2;
  transition: background .2s, box-shadow .2s;
  white-space: nowrap
}

.button span {
  color: var(--blue);
  font-size: 1.4em;
  line-height: .8
}

.button:hover {
  background: #104749;
  box-shadow: 0 0 20px #4AF1F260
}

.header-cta {
  font-size: inherit;
  padding: .7em 1.7em;
  border-width: 1.5px
}

.menu-toggle {
  display: none
}

main {
  max-width: var(--max);
  margin: auto
}

.hero {
  position: relative;
  height: clamp(460px, 43vw, 600px);
  min-height: 430px;
  background: #00101d url('../images/hero.png') center/100% 100% no-repeat;
  overflow: hidden;
  border-bottom: 1px solid #143344
}

.hero-home {
  height: clamp(520px, 47vw, 680px)
}

.hero-content {
  position: relative;
  z-index: 2;
  padding: clamp(32px, 4vw, 56px) 5.5%;
  max-width: 83%
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: clamp(10px, 1.03vw, 15px);
  text-transform: uppercase;
  letter-spacing: .34em;
  color: #a8dbf4;
  line-height: 1.5;
  margin-bottom: 2em
}

.eyebrow span, .accent-rule, .small-rule {
  display: block;
  width: 46px;
  height: 2px;
  background: var(--blue);
  flex-shrink: 0
}

.hero .eyebrow span {
  width: 46px
}

.hero h1 {
  margin-bottom: .17em;
  text-shadow: 0 2px 4px #0005
}

.hero-home h1 {
  font-size: clamp(43px, 5.3vw, 77px);
  letter-spacing: -.04em
}

.hero-description {
  font-size: clamp(16px, 1.72vw, 25px);
  line-height: 1.3;
  max-width: 61%;
  margin-top: .65em
}

.hero-home .hero-description {
  max-width: 77%
}

.hero .button {
  margin-top: 1.4em
}

.hero-subtitle, .hero-manifesto {
  text-transform: uppercase;
  letter-spacing: .32em;
  font-size: clamp(11px, 1.2vw, 17px);
  color: #b4e0f5;
  line-height: 1.8
}

.hero-manifesto {
  margin-top: 2em;
  line-height: 2.2
}

.hero .brand-heading {
  font-size: clamp(60px, 7vw, 101px);
  margin-top: .15em
}

.hero-contact .hero-description {
  max-width: 69%;
  margin-top: .7em
}

.micro-copy {
  text-transform: uppercase;
  letter-spacing: .25em;
  line-height: 1.8;
  font-size: clamp(9px, 1vw, 14px);
  color: #abdfff
}

.hero-side {
  position: absolute;
  right: 3.3%;
  top: 9%;
  border-left: 1px solid #34738d;
  padding-left: 1.5%;
  line-height: 2.1
}

.hero-bottom-left {
  position: absolute;
  bottom: 6%;
  left: 5%;
  padding: 1% 1.4%;
  border-left: 1px solid #59c8ed;
  background: #00121ba8
}

.small-rule {
  width: 30px;
  margin-top: 12px
}

.hero-bottom-center {
  position: absolute;
  left: 65%;
  bottom: 6%;
  text-align: center
}

.hero-building {
  position: absolute;
  right: 2%;
  bottom: 8%;
  transform: skewY(-13deg);
  background: #00000040;
}

.hero-about .hero-bottom-center {
  left: auto;
  right: 3%;
  bottom: 6%;
  text-align: left
}

.hero-about .hero-building {
  display: none
}

.page-content {
  margin: 0 auto;
  padding: 3.1% 30px;
  max-width: 1500px;
}

.panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 8px;
  background-color: var(--panel);
  padding: 2.2% 2.5%;
  background-position: center;
  background-size: cover
}

.accent-rule {
  width: 34px;
  margin-bottom: 1.1em
}

.panel p {
  position: relative;
  z-index: 1
}

.panel-copy {
  width: 47%;
  position: relative;
  z-index: 2
}

.panel .button {
  margin-top: 1.5em
}

.office {
  background-image: linear-gradient(90deg, #010b11 0%, #010b11e8 37%, transparent 65%), url('../images/office.png');
  background-size: cover, 100% 160%;
  background-position: center, center 60%
}

.what-we-do {
  min-height: min(27.3vw, 393px)
}

.what-we-do h2 {
  font-size: clamp(34px, 4vw, 58px)
}

.image-caption {
  position: absolute !important;
  text-transform: uppercase;
  letter-spacing: .25em;
  line-height: 1.7;
  color: #b4ddfc;
  font-size: clamp(10px, 1.05vw, 15px);
  pointer-events: none
}

.office-caption {
  right: 5%;
  top: 24%;
  transform: skewY(-10deg);
  font-size: clamp(14px, 1.65vw, 24px);
  letter-spacing: .24em
}

.two-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.2%
}

.home-middle {
  margin-top: 1.8%;
  margin-bottom: 1.8%
}

.home-middle>.panel {
  min-height: min(32vw, 461px);
  padding: 4.5% 5%
}

.home-middle h2 {
  font-size: clamp(31px, 3.55vw, 51px)
}

.home-middle p {
  font-size: .92em
}

.road {
  background-image: linear-gradient(90deg, #020c13fa 0%, #020c13de 40%, #020c1320 90%), url('../images/road.png');
  background-position: center, right center
}

.process-list {
  list-style: none;
  counter-reset: steps;
  margin-top: 1.1em;
  position: relative;
  z-index: 2
}

.process-list li {
  counter-increment: steps;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: .65em;
  font-size: .86em;
  min-height: 28px
}

.process-list li:before {
  content: counter(steps);
  display: grid;
  place-items: center;
  color: #4AF1F2;
  width: 29px;
  height: 29px;
  flex-shrink: 0;
  border: 1px solid #4AF1F2;
  border-radius: 50%;
  box-shadow: 0 0 8px #4AF1F250;
  font-size: 1.35em;
  background: #001322
}

.road-words {
  position: absolute;
  right: 3%;
  top: 41%;
  display: flex;
  flex-direction: column;
  gap: 1.55em;
  font-size: clamp(7px, .75vw, 11px);
  text-align: right
}

.world {
  background-image: linear-gradient(90deg, #020c12f5, #020c12cc 50%, #020c1255), url('../images/world.png');
  background-position: center, right center
}

.icon-list {
  list-style: none;
  position: relative;
  z-index: 2
}

.icon-list li {
  display: flex;
  align-items: center;
  gap: 1.6em;
  margin-top: 1.2em;
  font-size: .9em;
  line-height: 1.4
}

.icon {
  width: 40px;
  height: 43px;
  flex-shrink: 0;
  color: #4AF1F2
}

.serve-list li {
  margin-top: 1.45em;
  gap: 1.8em
}

.serve-list li span:before {
  content: '路';
  color: #4AF1F2;
  margin-right: .5em
}

.side-note {
  position: absolute !important;
  right: 4%;
  top: 9%;
  font-size: clamp(8px, .95vw, 13px) !important;
  border-left: 1px solid #225168;
  padding-left: 1.7em
}

.home-middle .side-note {
  top: 55%;
  right: 3%;
  font-size: clamp(7px, .8vw, 11px) !important;
  max-width: 21%
}

.home-middle .serve-list {
  padding-right: 8%
}

.mountain {
  background-image: linear-gradient(90deg, #020c13f2 0%, #020c13ce 39%, #020c1310 74%), url('../images/mountain.png');
  background-size: cover, 100% 160%;
  background-position: center, center 54%
}

.why {
  min-height: min(23.4vw, 337px)
}

.wide-copy {
  width: 60%
}

.wide-copy p {
  font-size: .95em;
  line-height: 1.55
}

.mountain-caption {
  right: 2%;
  bottom: 9%;
  text-align: center
}

.why .mountain-caption {
  right: 3%
}

.about-content {
  padding: 2.8% 3.1% 0
}

.about-content h2 {
  font-size: clamp(28px, 3.45vw, 50px)
}

.overview {
  min-height: min(22.3vw, 321px);
  padding: 1.5% 2%
}

.overview .panel-copy {
  width: 54%
}

.overview p {
  font-size: .96em
}

.overview .office-caption {
  right: 3%;
  top: 20%
}

.about-grid {
  gap: 18px 1.7%;
  margin-top: 1.5%
}

.about-grid>.panel {
  padding: 3% 4%;
  min-height: min(26vw, 374px)
}

.bullet-list {
  padding-left: 1.1em;
  position: relative;
  z-index: 2
}

.bullet-list li {
  padding-left: .1em;
  margin-top: .47em
}

.problem {
  background-image: linear-gradient(90deg, #020c13 5%, #020c13c9 65%, #020c1340), url('../images/problem.png');
  background-position: center, right bottom
}

.problem .bullet-list {
  font-size: .94em
}

.problem .side-note {
  right: 4%;
  top: 8%
}

.solution p, .solution li {
  font-size: .91em
}

.solution>p:first-of-type {
  max-width: 80%
}

.solution .side-note {
  top: 5%;
  right: 3%
}

.solution .bullet-list {
  margin: .8em 0
}

.industries .icon-list li {
  font-size: .85em;
  margin-top: 1em;
  gap: 1.3em
}

.industries .side-note {
  font-size: clamp(8px, .87vw, 12px) !important;
  right: 3%
}

.industries .icon-list {
  max-width: 86%
}

.advantages .icon-list li {
  gap: 1.1em;
  margin-top: .9em;
  font-size: .81em
}

.compact .icon {
  width: 27px;
  height: 30px
}

.advantages .mountain-caption {
  font-size: .7em;
  right: 2%;
  bottom: 6%;
  max-width: 21%;
  text-align: left
}

.about-grid>.statement {
  display: flex;
  gap: 1.2em;
  min-height: min(15.7vw, 226px);
  padding: 3% 4%
}

.statement>.icon {
  color: var(--blue);
  width: 52px;
  height: 54px;
  margin-top: 7px
}

.statement h2 {
  font-size: clamp(24px, 2.7vw, 39px);
  line-height: 1.12
}

.statement p {
  font-size: .88em;
  line-height: 1.4
}

.statement.mission p {
  max-width: 80%
}

.contact-content {
  padding: 1.5% 2% 0
}

.contact-top {
  display: grid;
  grid-template-columns: minmax(0, 2.25fr) minmax(0, 1fr);
  gap: 1.4%
}

.contact-panels {
  display: grid;
  gap: 14px;
  grid-template-rows: .9fr 1fr 1.1fr
}

.contact-panels>.panel {
  padding: 2% 3.2%;
  min-height: 150px
}

.contact-content h2 {
  font-size: clamp(25px, 3vw, 43px)
}

.contact-panels .accent-rule, .contact-form .accent-rule {
  margin-bottom: 1em
}

.contact-panels .office-caption {
  font-size: clamp(10px, 1.2vw, 17px);
  right: 3%;
  top: 2px;
}

.contact-panels p, .contact-panels li {
  font-size: .96em
}

.contact-panels .bullet-list li {
  margin-top: 0
}

.contact-panels .primary-tagline p:not(.image-caption) {
  max-width: 73%
}

.building {
  background-image: linear-gradient(90deg, #020c13f9, #020c1399 55%, transparent), url('../images/building.png');
  background-position: center, center 60%
}

.brand-statement>p:not(.image-caption) {
  max-width: 76%
}

.brand-statement .mountain-caption {
  right: 2%;
  font-size: .75em;
  bottom: 11%
}

.contact-form {
  padding: 4.4% 6%;
  background: linear-gradient(135deg, #020b11, #031018)
}

.contact-form>p {
  margin-top: 0
}

.contact-form form {
  margin-top: 1em
}

.contact-form label {
  margin-top: 1em;
  font-size: .9em
}

.contact-form input, .contact-form textarea {
  font-size: .85em
}

.contact-form .button {
  width: 100%;
  margin-top: 1.2em;
  padding: .8em .5em
}

.form-tagline {
  text-align: center;
  margin-top: 1.5em !important;
  font-size: .72em
}

.positioning {
  padding: 1.2% 0 0;
  margin-top: 1.3%;
  overflow: visible
}

.positioning>h2 {
  font-size: clamp(20px, 2.4vw, 35px);
  text-transform: uppercase;
  letter-spacing: -.02em;
  padding: 0 2.3% .8%;
  margin-bottom: .3em
}

.positioning-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2%;
  margin: 0 -1px -1px
}

.investor-card {
  padding: 3% 5.5%;
  min-height: min(38.7vw, 557px);
  background-size: cover;
  background-position: center bottom
}

.investor-heading {
  display: flex;
  gap: 1em;
  align-items: flex-start;
  position: relative;
  z-index: 2
}

.investor-heading>.icon {
  padding: 8px;
  width: 56px;
  height: 56px;
  border: 1px solid #063149;
  background: #00172688;
  border-radius: 5px;
  color: var(--blue)
}

.investor-heading h3 {
  font-size: .98em;
  line-height: 1.2;
  letter-spacing: -.02em;
  margin-top: .45em
}

.investor-copy {
  margin-left: calc(56px + 1em);
  position: relative;
  z-index: 2;
  font-size: .82em;
  line-height: 1.4;
  margin-top: 6px
}

.investor-heading:has(h3:nth-child(2)) {
  min-height: 62px
}

.investor-copy p {
  margin-top: .5em
}

.investor-copy .bullet-list {
  margin: .8em 0
}

.investor-copy li {
  margin-top: .15em
}

.bank {
  background-image: linear-gradient(#020b1180, #020b1190 48%, #020b1122), url('../images/bank.png')
}

.jet {
  background-image: linear-gradient(#020b1180, #020b1190 48%, #020b1122), url('../images/jet.png')
}

.venture {
  background-image: linear-gradient(#020b11 10%, #020b11de 55%, #020b1120), url('../images/hero.png');
  background-size: cover, auto 105%;
  background-position: center, 42% bottom
}

.investor-caption {
  position: absolute !important;
  bottom: 4%;
  left: 7%;
  font-size: .72em
}

.growth-bars {
  display: flex;
  gap: 9px;
  align-items: flex-end;
  position: absolute;
  bottom: 3%;
  right: 3%;
  height: 28%;
  width: 44%;
  opacity: .6
}

.growth-bars i {
  flex: 1;
  background: linear-gradient(#4AF1F2, #00334a);
  border: 1px solid #4AF1F2;
  height: 25%
}

.growth-bars i:nth-child(2) {
  height: 40%
}

.growth-bars i:nth-child(3) {
  height: 55%
}

.growth-bars i:nth-child(4) {
  height: 70%
}

.growth-bars i:nth-child(5) {
  height: 85%
}

.growth-bars i:nth-child(6) {
  height: 100%
}

.site-footer {
  max-width: var(--max);
  margin: 0 auto;
  position: relative;
  min-height: min(31vw, 447px);
  padding: 4% 4.1% 2.5%;
  text-align: center;
  background: url('../images/wave.png') center bottom/100% 170% no-repeat
}

.footer-brand {
  font-size: clamp(42px, 4.8vw, 69px)
}

.footer-tagline {
  color: #b5e4fb;
  letter-spacing: .3em;
  font-size: clamp(11px, 1.35vw, 19px);
  margin-top: .25em
}

.site-footer>.small-rule {
  margin: 2.1% auto;
  width: 43px
}

.footer-values {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2em;
  text-transform: uppercase;
  letter-spacing: .3em;
  font-size: clamp(9px, .96vw, 14px);
  color: #abdfff;
  margin-top: 2.4%
}

.footer-values i {
  height: 14px;
  width: 1px;
  background: #73a4ba
}

.footer-values a:hover {
  color: #fff
}

.footer-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  text-align: left;
  margin-top: 8%;
  gap: 30px;
  font-size: clamp(11px, 1.18vw, 17px)
}

.footer-bottom .micro-copy {
  font-size: .64em;
  position: relative;
  line-height: 1.8
}

.footer-bottom .micro-copy:before {
  content: "";
  position: absolute;
  left: -30px;
  top: 7px;
  width: 20px;
  height: 1px;
  background: #b6e8fa
}

.page-about .site-footer, .page-contact .site-footer {
  min-height: min(27vw, 390px);
  padding-top: 2.7%
}

label {
  display: block;
  margin: 1.1em 0 .35em
}

input, textarea {
  display: block;
  width: 100%;
  border: 1px solid #46748e;
  border-radius: 5px;
  background: #061622aa;
  color: #fff;
  padding: .65em .85em;
  line-height: 1.4
}

input::placeholder, textarea::placeholder {
  color: #8babc0;
  opacity: 1
}

textarea {
  resize: vertical;
  min-height: 110px
}

input:focus, textarea:focus {
  outline: 2px solid #4AF1F255;
  border-color: var(--blue)
}

input[type=file] {
  font-size: .9em;
  padding: .6em
}

input::file-selector-button {
  background: #07304a;
  color: #c4ecff;
  border: 0;
  border-radius: 4px;
  padding: .5em;
  margin-right: 1em
}

.honey {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden
}

.notice {
  padding: 12px 16px;
  border: 1px solid #4d829b;
  background: #09304a;
  border-radius: 6px;
  margin: 1em 0;
  font-size: .9em
}

.notice p+p {
  margin-top: .25em
}

.notice.error {
  border-color: #a35e5e;
  background: #321920;
  color: #ffd7d7
}

.notice.success {
  border-color: #318975;
  background: #0b302c;
  color: #c1ffec
}

.projects-content {
  padding-bottom: 2%
}

.section-heading {
  margin-bottom: 2em
}

.project-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px
}

.project-card {
  padding: 0
}

.project-poster {
  display: block;
  overflow: hidden;
  aspect-ratio: 2/3;
  background: #071b28
}

.project-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s
}

.project-poster:hover img {
  transform: scale(1.025)
}

.project-copy {
  padding: 24px
}

.project-copy .eyebrow {
  font-size: 10px;
  margin-bottom: 1em
}

.project-copy h2 {
  font-size: 28px;
  overflow-wrap: anywhere
}

.project-copy>p {
  font-size: 16px;
  color: #c7dce8
}

.project-bottom {
  margin-top: 1.5em;
  border-top: 1px solid var(--border);
  padding-top: 1em;
  display: flex;
  gap: 15px;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 14px
}

.project-amount {
  color: #4AF1F2;
  font-weight: bold
}

.text-link {
  color: #4AF1F2
}

.text-link:hover {
  text-decoration: underline
}

.empty-projects {
  padding: 6%;
  margin: 1em 0;
  min-height: 300px
}

.empty-projects p {
  max-width: 60%
}

.project-detail {
  padding-top: 4%;
  padding-bottom: 5%
}

.project-detail-grid {
  margin-top: 2em;
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 5%
}

.detail-poster {
  border-radius: 8px;
  width: 100%;
  border: 1px solid var(--border)
}

.project-detail h1 {
  font-size: clamp(36px, 4.7vw, 68px);
  overflow-wrap: anywhere
}

.project-logline {
  font-size: 1.15em;
  color: #b8dbef;
  margin-top: 1em
}

.amount-block {
  margin: 1.8em 0;
  padding: 1em 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border)
}

.amount-block .eyebrow {
  margin-bottom: .4em
}

.amount-block strong {
  font-size: 1.6em;
  color: var(--blue)
}

.project-detail h2 {
  font-size: 30px
}

.project-summary {
  white-space: normal;
  overflow-wrap: anywhere;
  margin-bottom: 2em
}

.admin-shell {
  max-width: 1120px;
  margin: auto;
  padding: 45px 24px;
  min-height: 70vh;
  font-size: 16px
}

.admin-shell h1 {
  font-size: 40px;
  margin-bottom: 12px
}

.admin-shell h2 {
  font-size: 25px
}

.admin-shell p {
  color: #b9d2e1
}

.admin-login {
  max-width: 480px;
  margin: 50px auto;
  padding: 35px
}

.admin-login .button {
  width: 100%;
  margin-top: 24px
}

.admin-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 32px;
  flex-wrap: wrap
}

.admin-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap
}

.admin-actions .button {
  font-size: 14px
}

.button.secondary {
  border-color: #365b71;
  background: #0b1b27;
  box-shadow: none
}

.button.danger {
  border-color: #975367;
  color: #ffd6de;
  background: #30141d;
  box-shadow: none
}

.admin-nav {
  display: flex;
  gap: 22px;
  margin: 20px 0 30px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 15px;
  font-size: 16px;
  height: auto
}

.admin-nav a {
  height: auto !important
}

.admin-row {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
  margin-bottom: 12px
}

.admin-row img {
  width: 65px;
  height: 90px;
  object-fit: cover;
  border-radius: 4px
}

.admin-row-copy {
  flex: 1;
  min-width: 0
}

.admin-row h2 {
  overflow-wrap: anywhere
}

.admin-row p {
  font-size: 14px
}

.admin-form {
  padding: 28px;
  max-width: 800px
}

.admin-form .hint {
  font-size: 13px;
  margin-top: 6px;
  color: #9eb9c9
}

.admin-form textarea {
  min-height: 140px
}

.admin-form .admin-actions {
  margin-top: 25px
}

.poster-preview {
  width: 150px;
  max-height: 225px;
  object-fit: cover;
  margin-top: 15px;
  border-radius: 5px
}

.message-card {
  padding: 24px;
  margin: 16px 0
}

.message-meta {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  font-size: 14px
}

.message-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere
}

.muted {
  color: #9cb6c7
}

@media(min-width:1441px) {
  .header-inner {
    padding-left: 4.4%;
    padding-right: 4.4%
  }

  .site-footer {
    padding: 58px 60px 36px
  }

  .page-about .site-footer, .page-contact .site-footer {
    padding-top: 39px
  }
}

@media(min-width:761px) and (max-width:1100px) {
  nav {
    gap: 20px
  }

  .header-inner {
    padding: 0 4%
  }

  .header-cta {
    padding: .7em 1.1em
  }

  .home-middle .side-note {
    display: none
  }

  .home-middle .serve-list {
    padding-right: 0
  }

  .road-words {
    opacity: .75;
    right: 2%
  }

  .process-list li {
    gap: 10px;
    font-size: .82em
  }

  .about-grid {
    gap: 14px
  }

  .investor-heading>.icon {
    width: 45px;
    height: 45px;
    padding: 5px
  }

  .investor-copy {
    margin-left: calc(45px + 1em);
    font-size: .82em
  }

  .investor-heading h3 {
    font-size: .92em
  }

  .contact-form {
    padding: 4.4% 6%
  }

  .contact-form label {
    margin-top: .9em
  }

  .hero-content {
    max-width: 90%
  }

  .hero-home .hero-description {
    max-width: 70%
  }
}

@media(max-width:1000px) {
  .about-grid>.panel {
    min-height: 260px
  }

  .about-grid>.statement {
    min-height: 160px
  }

  .about-grid .side-note {
    opacity: .85
  }

  .industries .side-note {
    display: none
  }

  .industries .icon-list {
    max-width: 100%
  }

  .advantages .mountain-caption {
    display: none
  }

  .investor-card {
    min-height: 390px
  }

  .project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }

  .hero-description {
    max-width: 70%
  }

  .home-middle>.panel {
    min-height: 315px
  }

  .panel-copy {
    width: 51%
  }

  .wide-copy {
    width: 65%
  }

  .site-footer {
    min-height: 300px
  }

  .page-about .site-footer, .page-contact .site-footer {
    min-height: 270px
  }
}

@media(max-width:760px) {
  body {
    font-size: 15px
  }

  .site-header {
    height: 68px
  }

  .header-inner {
    padding: 0 6%
  }

  .logo {
    font-size: 29px
  }

  .menu-toggle {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 10px;
    background: transparent;
    border: 1px solid #285068;
    border-radius: 5px
  }

  .menu-toggle>span:not(.sr-only) {
    width: 23px;
    height: 2px;
    background: #4AF1F2
  }

  .menu-toggle[aria-expanded=true]>span:first-child {
    transform: translateY(7px) rotate(45deg)
  }

  .menu-toggle[aria-expanded=true]>span:nth-child(2) {
    opacity: 0
  }

  .menu-toggle[aria-expanded=true]>span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg)
  }

  #navigation {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 67px;
    background: #020d16fa;
    border-bottom: 1px solid #276078;
    padding: 20px 6%;
    height: auto;
    box-shadow: 0 15px 30px #0008
  }

  #navigation.is-open {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0
  }

  #navigation>a:not(.button) {
    padding: 14px 0;
    font-size: 16px
  }

  #navigation>a.active:after {
    left: 0;
    right: auto;
    width: 30px;
    bottom: 5px
  }

  #navigation>.button {
    margin-top: 15px;
    font-size: 15px
  }

  .hero, .hero-home {
    height: 550px;
    min-height: 0;
    background-size: auto 100%;
    background-position: 58% center
  }

  .hero:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #00101bed, #00101b55 75%, #00101b11)
  }

  .hero-content {
    padding: 32px 6%;
    max-width: 100%
  }

  .eyebrow {
    font-size: 9px;
    letter-spacing: .25em;
    gap: 12px;
    margin-bottom: 25px
  }

  .hero .eyebrow span {
    width: 28px
  }

  .hero-home h1 {
    font-size: clamp(35px, 6.5vw, 49px);
    line-height: 1.1
  }

  .hero h1 {
    font-size: clamp(45px, 9vw, 66px)
  }

  .hero-home h1 {
    font-size: clamp(35px, 6.5vw, 49px)
  }

  .hero .brand-heading {
    font-size: clamp(53px, 10vw, 76px)
  }

  .hero-description, .hero-home .hero-description, .hero-contact .hero-description {
    font-size: 17px;
    max-width: 85%;
    line-height: 1.45;
    margin-top: 20px
  }

  .hero-subtitle, .hero-manifesto {
    font-size: 10px;
    letter-spacing: .25em;
    max-width: 90%;
    line-height: 2
  }

  .hero-manifesto {
    margin-top: 26px
  }

  .hero .button {
    margin-top: 25px
  }

  .hero-side {
    display: none
  }

  .hero-bottom-left {
    left: 6%;
    bottom: 5%;
    font-size: 8px
  }

  .hero-bottom-center {
    left: auto;
    right: 6%;
    bottom: 5%;
    font-size: 8px
  }

  .hero-building {
    display: none
  }

  .hero-about .hero-bottom-center {
    right: 6%;
    bottom: 5%
  }

  .hero-about, .hero-contact, .hero-projects {
    height: 460px
  }

  .desktop-break {
    display: none
  }

  .page-content, .about-content, .contact-content {
    padding: 22px 5% 0
  }

  .panel {
    padding: 24px;
    border-radius: 7px
  }

  h2, .what-we-do h2, .home-middle h2, .about-content h2, .contact-content h2 {
    font-size: 31px
  }

  .panel-copy, .overview .panel-copy {
    width: 80%
  }

  .what-we-do {
    min-height: 350px;
    padding-bottom: 35px
  }

  .office {
    background-size: cover, auto 135%;
    background-position: center, right center
  }

  .office-caption {
    display: none
  }

  .two-columns {
    grid-template-columns: 1fr;
    gap: 16px
  }

  .home-middle {
    margin: 16px 0
  }

  .home-middle>.panel {
    min-height: 330px;
    padding: 25px
  }

  .home-middle p {
    font-size: 14px
  }

  .process-list li {
    font-size: 13px;
    margin-bottom: 13px
  }

  .road-words {
    font-size: 8px;
    top: 44%;
    right: 5%;
    gap: 2em
  }

  .home-middle .serve-list {
    padding-right: 0
  }

  .home-middle .side-note {
    display: block;
    font-size: 8px !important;
    right: 4%;
    top: 55%
  }

  .serve-list li {
    gap: 22px;
    margin-top: 23px;
    font-size: 14px
  }

  .serve-list {
    max-width: 90%
  }

  .serve-list .icon {
    width: 34px
  }

  .why {
    min-height: 320px
  }

  .wide-copy {
    width: 79%
  }

  .wide-copy p {
    font-size: 14px
  }

  .mountain {
    background-size: cover, auto 130%;
    background-position: center, right center
  }

  .why .mountain-caption {
    display: none
  }

  .overview {
    min-height: 320px;
    padding: 24px
  }

  .overview p {
    font-size: 14px
  }

  .about-grid {
    margin-top: 16px;
    gap: 16px
  }

  .about-grid>.panel {
    padding: 24px;
    min-height: 280px
  }

  .about-grid .side-note {
    font-size: 8px !important;
    right: 5%
  }

  .problem>p, .problem .bullet-list {
    max-width: 85%
  }

  .problem .side-note {
    top: 26%
  }

  .about-grid .solution {
    min-height: 330px
  }

  .solution p, .solution li {
    font-size: 14px
  }

  .solution .side-note {
    display: none
  }

  .solution>p:first-of-type {
    max-width: 100%
  }

  .industries .side-note {
    display: block
  }

  .industries .icon-list li {
    font-size: 13px;
    margin-top: 18px;
    gap: 20px
  }

  .advantages .icon-list li {
    font-size: 13px;
    margin-top: 16px
  }

  .advantages .mountain-caption {
    display: none
  }

  .about-grid>.statement {
    min-height: 210px;
    gap: 18px;
    padding: 24px
  }

  .statement>.icon {
    width: 40px;
    height: 44px
  }

  .statement h2 {
    font-size: 26px
  }

  .statement p {
    font-size: 14px
  }

  .statement.mission p {
    max-width: 95%
  }

  .contact-top {
    grid-template-columns: 1fr;
    gap: 16px
  }

  .contact-panels {
    gap: 16px;
    grid-template-rows: auto
  }

  .contact-panels>.panel {
    padding: 24px;
    min-height: 190px
  }

  .contact-panels .brand-statement {
    min-height: 260px
  }

  .contact-panels p, .contact-panels li {
    font-size: 14px
  }

  .contact-panels .primary-tagline p:not(.image-caption) {
    max-width: 85%
  }

  .brand-statement>p:not(.image-caption) {
    max-width: 85%
  }

  .brand-statement .mountain-caption {
    display: none
  }

  .contact-form {
    padding: 25px
  }

  .contact-form input, .contact-form textarea {
    font-size: 16px
  }

  .contact-form label {
    font-size: 14px
  }

  .contact-form textarea {
    min-height: 140px
  }

  .contact-form form {
    margin-top: 20px
  }

  .form-tagline {
    font-size: 10px
  }

  .positioning {
    margin-top: 20px;
    padding: 20px 0 0
  }

  .positioning>h2 {
    font-size: 24px;
    padding: 0 20px 20px;
    line-height: 1.2
  }

  .positioning-grid {
    grid-template-columns: 1fr;
    gap: 16px
  }

  .investor-card {
    padding: 24px;
    min-height: 440px
  }

  .investor-heading>.icon {
    width: 50px;
    height: 50px
  }

  .investor-heading h3 {
    font-size: 17px;
    max-width: 300px
  }

  .investor-copy {
    font-size: 14px;
    margin-left: 65px;
    max-width: 85%;
    margin-top: 0
  }

  .investor-caption {
    font-size: 10px;
    left: 24px;
    bottom: 20px
  }

  .bank, .jet {
    background-size: 100% auto;
    background-position: center bottom
  }

  .venture {
    background-size: cover;
    background-position: center bottom
  }

  .growth-bars {
    width: 35%;
    height: 22%
  }

  .site-footer, .page-about .site-footer, .page-contact .site-footer {
    min-height: 330px;
    padding: 38px 6% 25px;
    background-size: auto 140%;
    background-position: center bottom
  }

  .footer-brand {
    font-size: 42px
  }

  .footer-tagline {
    font-size: 10px;
    letter-spacing: .22em;
    line-height: 1.8;
    max-width: 350px;
    margin: 5px auto 0
  }

  .site-footer>.small-rule {
    margin: 20px auto
  }

  .footer-values {
    gap: 16px;
    font-size: 8px;
    letter-spacing: .2em
  }

  .footer-values i {
    height: 11px
  }

  .footer-bottom {
    margin-top: 65px;
    display: block;
    font-size: 10px;
    text-align: center
  }

  .footer-bottom .micro-copy {
    display: none
  }

  .button {
    font-size: 13px
  }

  .project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px
  }

  .project-copy {
    padding: 18px
  }

  .project-copy h2 {
    font-size: 24px
  }

  .project-copy>p {
    font-size: 14px
  }

  .project-bottom {
    font-size: 12px
  }

  .empty-projects {
    padding: 30px;
    min-height: 330px
  }

  .empty-projects p {
    max-width: 85%;
    font-size: 15px
  }

  .project-detail-grid {
    grid-template-columns: 1fr;
    gap: 30px
  }

  .detail-poster {
    max-width: 380px;
    margin: auto
  }

  .project-detail {
    padding-top: 30px
  }

  .project-detail h1 {
    font-size: 40px
  }

  .project-detail-grid>div {
    padding-bottom: 30px
  }

  .admin-shell {
    padding: 30px 20px
  }

  .admin-shell h1 {
    font-size: 32px
  }

  .admin-row {
    flex-wrap: wrap;
    padding: 16px
  }

  .admin-row .admin-actions {
    width: 100%
  }

  .admin-form {
    padding: 20px
  }

  .admin-login {
    padding: 25px
  }

  .admin-nav {
    flex-wrap: wrap;
    gap: 15px
  }
}

@media(max-width:420px) {
  .hero-home {
    height: 570px
  }

  .hero-home .eyebrow {
    font-size: 8px;
    letter-spacing: .2em;
    gap: 8px
  }

  .hero-description, .hero-home .hero-description, .hero-contact .hero-description {
    max-width: 100%;
    font-size: 16px
  }

  .hero-home h1 {
    font-size: 35px
  }

  .hero-home h1 span {
    display: block;
    max-width: 310px
  }

  .panel-copy, .overview .panel-copy, .wide-copy {
    width: 100%
  }

  .panel {
    padding: 22px
  }

  .office {
    background-image: linear-gradient(90deg, #010b11f5, #010b11ae), url('../images/office.png')
  }

  .home-middle .side-note, .road-words, .industries .side-note {
    display: none
  }

  .serve-list {
    max-width: 100%
  }

  .about-grid .problem .side-note {
    display: none
  }

  .problem>p, .problem .bullet-list {
    max-width: 100%
  }

  .industries .icon-list {
    max-width: 100%
  }

  .brand-statement>p:not(.image-caption) {
    max-width: 100%
  }

  .contact-panels .brand-statement {
    min-height: 300px
  }

  .project-grid {
    grid-template-columns: 1fr
  }

  .footer-values {
    gap: 12px;
    font-size: 7px
  }

  .investor-copy {
    margin-left: 0;
    margin-top: 12px;
    max-width: 100%;
    padding-bottom: 130px
  }

  .investor-heading h3 {
    font-size: 17px
  }

  .investor-card {
    min-height: 480px
  }

  .statement>.icon {
    width: 33px
  }

  .about-grid>.statement {
    gap: 12px
  }

  .statement h2 {
    font-size: 24px
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto
  }

  *, *:before, *:after {
    transition: none !important
  }
}

/* Full-width public layout, with proportionate banners on larger displays. */
main, .header-inner, .site-footer {
  width: 100%;
}

@media (min-width: 1441px) {
  .hero {
    height: clamp(600px, 35vw, 720px);
    background-size: cover;
    background-position: center 15%;
  }

  .hero-home {
    height: clamp(680px, 39vw, 800px);
  }

  .hero-content {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .hero-description {
    max-width: min(61%, 740px);
  }

  .hero-home .hero-description {
    max-width: min(77%, 820px);
  }

  .hero-contact .hero-description {
    max-width: min(69%, 800px);
  }
}

/* Deter casual copying on public pages while preserving editable controls. */
body:not(.page-admin) {
  -webkit-user-select: none;
  user-select: none;
}

body:not(.page-admin) img {
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
}

body:not(.page-admin) :is(input, textarea, select, [contenteditable]:not([contenteditable="false"]), [data-allow-copy]) {
  -webkit-user-select: text;
  user-select: text;
}

/* Full-width artwork follows the wide composition of the supplied hero reference. */
.hero,
.hero-home,
.hero-about,
.hero-contact,
.hero-projects {
  height: auto;
  min-height: calc(100vw * 901 / 1746);
  background-size: 100% auto;
  background-position: center bottom;
  background-repeat: no-repeat;
}

/* Shorter displays need room for the copy, CTA, and bottom captions. */
@media (max-width: 1440px), (max-height: 820px) {

  .hero-content {
    padding-top: clamp(28px, 4vw, 48px);
    padding-bottom: 128px;
  }
}

@media (min-width: 761px) and (max-height: 820px) {
  .hero-home h1 {
    font-size: clamp(40px, 4.8vw, 68px);
  }

  .hero-description {
    font-size: clamp(16px, 1.5vw, 22px);
  }

  .hero .eyebrow {
    margin-bottom: 1.5em;
  }
}

/* Keep the homepage's lower caption in layout flow, below the CTA. */
.hero-home {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: calc(100vw * 901 / 1746);
}

.hero-home > .hero-content {
  flex: none;
  padding-bottom: clamp(28px, 3vw, 48px);
}

.hero-home > .hero-bottom-left {
  position: relative;
  inset: auto;
  flex: none;
  align-self: flex-start;
  margin: auto 0 clamp(24px, 3vw, 48px) 5%;
}

@media (max-width: 760px) {
  .hero-home > .hero-bottom-left { margin-left: 6%; }
}

/* Use the same glass lettering and placement on every hero. */
@media (min-width: 761px) {
  .hero > .hero-building {
    display: block;
    right: .8%;
    bottom: 10vw;
    width: 10%;
    margin: 0;
    padding: 0;
    background: none;
    font-size: clamp(9px, .86vw, 13px);
    line-height: 1.75;
    letter-spacing: .23em;
    color: #b6dbe6;
    text-align: left;
    transform: skewY(-28deg) scaleX(.82);
    transform-origin: right bottom;
    text-shadow: 0 1px 2px #001018;
  }
}

/* Reference hero: editable text over uncropped, full-width artwork. */
.hero {
  background-image: url('../images/hero-reference.png');
  background-size: 100% auto;
  background-position: center bottom;
}

.hero-home > .hero-content {
  width: 70%;
  max-width: none;
  margin-left: 5.7%;
  padding: 5.8vw 0 5vw;
}

.hero-home .eyebrow {
  font-size: clamp(9px, .95vw, 17px);
  letter-spacing: .3em;
  margin-bottom: 2.6vw;
  gap: 1.3vw;
}
.hero-home .eyebrow span { width: 3.3vw; }
.hero-home h1 {
  font-size: clamp(36px, 4.8vw, 92px);
  line-height: 1.08;
  letter-spacing: -.045em;
  margin: 0;
}
.hero-home h1 > span { white-space: nowrap; }
.hero-home .hero-description {
  max-width: 55vw;
  margin-top: 1.5vw;
  font-size: clamp(15px, 1.65vw, 30px);
  line-height: 1.3;
}
.hero-home .hero-content > .button {
  margin-top: 1.9vw;
  padding: .85em 1.9em;
  font-size: clamp(12px, 1.18vw, 21px);
}
.hero-home > .hero-bottom-left {
  margin: auto 0 2.5vw 4.8%;
  padding: 1vw 1.4vw;
  font-size: clamp(8px, .9vw, 16px);
  line-height: 1.8;
}
.hero-home > .hero-bottom-center,
.hero-about > .hero-bottom-center {
  left: 64.5%;
  right: auto;
  bottom: 4.5%;
  font-size: clamp(8px, .95vw, 17px);
  text-align: center;
}
.hero-home > .hero-side {
  top: 9%;
  right: 3.3%;
  font-size: clamp(8px, .9vw, 16px);
  line-height: 2.1;
}

@media (min-width: 761px) {
  .hero > .hero-building {
    right: 0.8%;
    bottom: 18%;
    width: 10%;
    font-size: clamp(9px, 1vw, 18px);
    line-height: 1.65;
    letter-spacing: .2em;
    transform: skewY(-17deg) scaleX(.86);
  }
}
@media (max-width: 760px) {
  .hero-home > .hero-content {
    width: 88%;
    margin-left: 6%;
    padding: 32px 0 36px;
  }
  .hero-home .eyebrow { font-size: 8px; gap: 10px; letter-spacing: .18em; margin-bottom: 22px; }
  .hero-home .eyebrow span { width: 24px; }
  .hero-home h1 { font-size: clamp(33px, 6.4vw, 48px); line-height: 1.1; }
  .hero-home h1 > span { white-space: normal; max-width: none; }
  .hero-home .hero-description { max-width: 100%; margin-top: 18px; font-size: 16px; line-height: 1.45; }
  .hero-home .hero-content > .button { margin-top: 24px; font-size: 13px; }
  .hero-home > .hero-bottom-left { margin: auto 0 24px 6%; padding: 10px 14px; font-size: 8px; }
  .hero-home > .hero-bottom-center,
  .hero-about > .hero-bottom-center { left: auto; right: 6%; bottom: 24px; font-size: 8px; }
}

/* Right-facing aircraft and skyline placement from the original contact design. */
.investor-card.jet {
  background-color: #020b11;
  background-image: linear-gradient(180deg, #020b1199 0%, #020b1166 50%, #020b1100 75%), url('../images/jet-reference.png');
  background-size: cover, 100% auto;
  background-position: center, center bottom;
  background-repeat: no-repeat;
}

/* Refined brand accents, wall lettering, and footer composition. */
:root {
  --accent: #4AF1F2;
  --blue: var(--accent);
  --bright: var(--accent);
}

.what-we-do .office-caption-home,
.overview .office-caption-about {
  display: block;
  width: 22%;
  margin: 0;
  color: #b5d8dc;
  font-family: var(--font-sans);
  font-weight: 300;
  font-size: clamp(17px, 1.95vw, 28px);
  line-height: 1.65;
  letter-spacing: .28em;
  text-align: left;
  transform: skewY(-11deg) scaleX(.74);
  transform-origin: left center;
  text-shadow: 0 1px 2px #000b, 0 0 8px #b5d8dc18;
}

.office-caption-home>span,
.office-caption-about>span:not(.small-rule) {
  display: block;
  white-space: nowrap;
}

.what-we-do .office-caption-home {
  top: 9%;
  left: 85%;
  right: auto;
}

.overview .office-caption-about {
  top: 9%;
  left: 84%;
  right: auto;
  font-size: clamp(16px, 1.78vw, 26px);
}

.office-caption-about .small-rule {
  width: 36px;
  margin-top: 16px;
}

.site-footer,
.page-about .site-footer,
.page-contact .site-footer {
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: clamp(310px, 31vw, 445px);
  padding: clamp(32px, 4vw, 58px) 4.1% 28px;
  background: var(--bg);
  overflow: hidden;
}

.site-footer::before {
  content: '';
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: auto 0 0;
  height: 64%;
  background: linear-gradient(180deg, #020a0e 0%, #020a0e44 27%, #020a0e22 55%, #020a0e9c 100%),
    url('../images/wave.png') center bottom / 100% 100% no-repeat;
  filter: hue-rotate(-25deg) saturate(.8);
  opacity: .72;
}

.footer-identity {
  position: relative;
  text-align: center;
}

.footer-brand {
  font-size: clamp(40px, 4.8vw, 69px);
  line-height: 1.1;
  letter-spacing: -.025em;
}

.footer-tagline {
  max-width: none;
  margin: 10px auto 0;
  font-size: clamp(11px, 1.35vw, 19px);
  font-weight: 400;
  letter-spacing: .27em;
  line-height: 1.6;
  color: #b4dcdf;
}

.footer-identity>.small-rule {
  width: 43px;
  height: 2px;
  margin: 22px auto;
}

.footer-values {
  margin: 0;
  gap: clamp(18px, 2.6vw, 38px);
  font-size: clamp(9px, .96vw, 14px);
  color: #b4dcdf;
}

.footer-values i {
  background: #79a9aa;
  height: 13px;
}

.footer-bottom {
  position: relative;
  margin-top: auto;
  padding-top: clamp(64px, 7.5vw, 108px);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 48px;
  font-size: clamp(11px, 1.18vw, 17px);
  text-align: left;
}

.footer-bottom>p {
  margin: 0;
}

.footer-bottom .micro-copy {
  display: block;
  flex-shrink: 0;
  color: #b4dcdf;
  font-size: .64em;
  letter-spacing: .17em;
}

.footer-bottom .micro-copy::before {
  background: #b4dcdf;
}

/* The image cannot influence the poster frame's dimensions. */
.project-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.project-poster {
  position: relative;
  flex: none;
  width: 100%;
  height: 360px;
  padding-top: 0;
  aspect-ratio: auto;
  overflow: hidden;
}

.project-poster img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 360px;
  object-fit: cover;
  object-position: center;
}

.project-copy {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.project-copy>p {
  margin-bottom: 1.5em;
  overflow-wrap: anywhere;
}

.project-bottom {
  margin-top: auto;
}

.detail-poster {
  aspect-ratio: 2 / 3;
  height: auto;
  object-fit: cover;
  object-position: center;
  align-self: start;
}

.project-highlights {
  margin: 0 0 2em;
}

.project-detail-grid > div {
  min-width: 0;
}

.project-highlights h2,
.project-card-highlights h3 {
  margin-bottom: .6em;
}

.project-highlights ul,
.project-card-highlights ul {
  margin: 0 0 1.5em;
  padding-left: 1.4em;
  color: #c7dce8;
}

.project-highlights li,
.project-card-highlights li {
  margin-bottom: .55em;
  overflow-wrap: anywhere;
}

.project-detail-images,
.project-card-images {
  display: grid;
  gap: 16px;
}

.project-detail-images img,
.project-card-images img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
}

.project-card-highlights {
  margin-top: 1.5em;
}

.project-card-highlights h3 {
  font-size: 18px;
}

.project-card-images {
  margin-top: 1em;
}

.admin-existing-images {
  margin-top: 1.5em;
}

.admin-image-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 16px;
  margin-top: .75em;
}

.admin-image-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  font-size: 14px;
}

.admin-image-item img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 5px;
}

.admin-image-item span {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-image-item input[type=checkbox] {
  display: inline-block;
  width: auto;
  margin: 0;
  padding: 0;
  flex: none;
}

.delivery-status {
  border-top: 1px solid var(--border);
  padding-top: 14px;
  margin-top: 20px;
  font-size: 13px;
  color: #a6d8d8;
}

.contact-submit .submit-label {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

.contact-submit:disabled {
  cursor: wait;
  opacity: .8;
  transform: none;
}

.contact-submit .submit-spinner {
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: none;
  border: 2px solid #4af1f240;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: submit-spin .7s linear infinite;
}

.contact-submit [hidden], #contact-feedback[hidden] {
  display: none;
}

@keyframes submit-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Subtle entrance/exit motion without delaying clicks or form submissions. */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .65s ease, transform .65s cubic-bezier(.2, .65, .25, 1);
}

.reveal.is-visible, .reveal:focus-within {
  opacity: 1;
  transform: translateY(0);
}

.hero-content>* {
  animation: content-enter .75s ease both;
}

.hero-content> :nth-child(2) {
  animation-delay: .08s;
}

.hero-content> :nth-child(3) {
  animation-delay: .16s;
}

.hero-content> :nth-child(4) {
  animation-delay: .24s;
}

.hero-content> :nth-child(5) {
  animation-delay: .32s;
}

.button {
  transition: background .25s ease, box-shadow .25s ease, transform .25s ease;
}

.button:hover {
  transform: translateY(-2px);
}

.button:active {
  transform: translateY(0);
}

.menu-toggle>span {
  transition: transform .22s ease, opacity .22s ease;
}

@keyframes content-enter {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes page-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes page-fade-out {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: page-fade-out .18s ease both;
}

::view-transition-new(root) {
  animation: page-fade-in .28s ease both;
}

@media (max-width: 760px) {
  #navigation {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
  }

  #navigation.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .what-we-do, .overview {
    padding-bottom: 175px;
  }

  .what-we-do .panel-copy, .overview .panel-copy {
    width: 100%;
  }

  .what-we-do .office-caption-home,
  .overview .office-caption-about {
    top: auto;
    bottom: 26px;
    left: auto;
    right: 2%;
    width: 40%;
    font-size: 17px;
    line-height: 1.6;
    transform: skewY(-9deg) scaleX(.78);
    color: #c6e3e5;
  }

  .overview .office-caption-about {
    bottom: 30px;
  }

  .what-we-do.office, .overview.office {
    background-image: linear-gradient(180deg, #010b11ee 0%, #010b11db 55%, #010b1122 100%), url('../images/office.png');
    background-size: cover, auto 100%;
    background-position: center, right bottom;
  }

  .site-footer, .page-about .site-footer, .page-contact .site-footer {
    min-height: 335px;
    padding: 38px 6% 24px;
  }

  .site-footer::before {
    height: 55%;
    background-size: cover, 145% 100%;
  }

  .footer-brand {
    font-size: 42px;
  }

  .footer-tagline {
    max-width: 390px;
    font-size: 10px;
    letter-spacing: .2em;
    margin-top: 10px;
  }

  .footer-identity>.small-rule {
    margin: 20px auto;
    width: 36px;
  }

  .footer-values {
    gap: 15px;
    font-size: 8px;
    letter-spacing: .2em;
  }

  .footer-bottom {
    flex-direction: column-reverse;
    align-items: center;
    gap: 24px;
    padding-top: 50px;
    text-align: center;
    font-size: 10px;
  }

  .footer-bottom .micro-copy {
    font-size: 8px;
    line-height: 1.7;
  }

  .footer-bottom .micro-copy::before {
    display: none;
  }
}

@media (max-width: 420px) {
  .footer-brand {
    font-size: 39px;
  }

  .footer-values {
    gap: 12px;
    font-size: 7px;
  }

  .footer-tagline {
    max-width: 290px;
  }

  .what-we-do .office-caption-home, .overview .office-caption-about {
    right: 0;
    width: 46%;
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }

  @view-transition {
    navigation: none;
  }

  ::view-transition-old(root), ::view-transition-new(root) {
    animation: none !important;
  }
}

/* Corporate Overview and Testimonials */
@media (min-width: 761px) {
  #navigation { gap: clamp(10px, 1.5vw, 25px); font-size: clamp(11px, .94vw, 15px); }
}

@media (min-width: 761px) and (max-width: 1400px) {
  #navigation .header-cta { display: none; }
}

@media (min-width: 761px) and (max-width: 1000px) {
  #navigation { gap: 10px; font-size: 11px; }
  .site-header .logo { font-size: 24px; }
}

.footer-values { flex-wrap: wrap; row-gap: .8em; }

.corporate-content,
.testimonials-content { padding-bottom: 6%; }

.corporate-tree { max-width: 1060px; margin: 0 auto; padding: clamp(24px, 5vw, 70px); }
.corporate-root { color: var(--blue); font-size: clamp(22px, 2.5vw, 34px); font-weight: 700; overflow-wrap: anywhere; }
.corporate-branches,
.corporate-branches ul { list-style: none; border-left: 1px solid #4AF1F2; margin: 12px 0 0 12px; padding-left: clamp(20px, 3vw, 42px); }
.corporate-branches li { position: relative; padding: .55em 0; overflow-wrap: anywhere; }
.corporate-branches li::before { content: ''; position: absolute; width: clamp(20px, 3vw, 42px); height: 1px; background: #4AF1F2; top: 1.25em; left: calc(-1 * clamp(20px, 3vw, 42px)); }
.corporate-endow { color: var(--text); }
.corporate-endow > strong { color: var(--blue); }
.corporate-endow > ul { color: var(--text); font-weight: 400; }

.testimonial-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.testimonial-card { display: flex; flex-direction: column; min-width: 0; padding: clamp(24px, 2.4vw, 36px); }
.testimonial-card h3 { font-size: clamp(21px, 1.7vw, 28px); margin-bottom: .8em; }
.testimonial-card blockquote { margin: 0; color: #d5e6ef; font-size: 1.05em; line-height: 1.6; white-space: pre-line; }
.testimonial-attribution { margin-top: auto; padding-top: 1.5em; color: var(--blue); font-size: .84em; }
.testimonial-admin-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 22px; padding: 24px; margin-bottom: 14px; }
.testimonial-admin-copy { min-width: 0; flex: 1; }
.testimonial-admin-copy blockquote { margin: 12px 0 0; color: #c7dce8; white-space: pre-wrap; overflow-wrap: anywhere; }

/* Additional project images sit below the poster and open at full size. */
.project-gallery { min-width: 0; }
.project-detail-images,
.project-card-images { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.project-detail-images { margin-top: 12px; }
.project-card-images { margin: 0; padding: 12px 14px 0; }
.project-image-thumb { display: block; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; background: #071b28; }
.project-detail-images .project-image-thumb img,
.project-card-images .project-image-thumb img { width: 100%; height: 100%; object-fit: cover; border: 0; border-radius: 0; transition: transform .2s ease; }
.project-image-thumb:hover img { transform: scale(1.06); }
.project-lightbox { position: fixed; inset: 0; width: min(92vw, 1200px); max-width: none; max-height: 92vh; padding: 42px 24px 24px; border: 1px solid var(--border); border-radius: 10px; background: #020a0e; color: #fff; overflow: auto; }
.project-lightbox::backdrop { background: #000c; }
.project-lightbox img { width: auto; max-width: 100%; max-height: calc(92vh - 72px); margin: auto; object-fit: contain; }
.project-lightbox-close { position: absolute; right: 10px; top: 6px; width: 32px; height: 32px; border: 0; background: transparent; color: #fff; font-size: 30px; line-height: 1; }

@media (max-width: 1100px) and (min-width: 761px) {
  .testimonial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .testimonial-grid { grid-template-columns: 1fr; }
  .testimonial-admin-row { flex-direction: column; }
  .project-gallery { max-width: 380px; margin: auto; }
  .corporate-tree { padding: 24px 18px; }
  .corporate-branches, .corporate-branches ul { margin-left: 6px; }
}

/* Corporate overview */
.corporate-content { max-width: 1400px; padding-top: clamp(56px, 6vw, 100px); }
.corporate-intro { max-width: 1140px; padding-bottom: clamp(60px, 7vw, 110px); }
.corporate-kicker { color: var(--blue); font-size: .65em; font-weight: 700; letter-spacing: .17em; line-height: 1.5; text-transform: uppercase; }
.corporate-intro h2 { max-width: 850px; margin: .3em 0 .45em; font-size: clamp(42px, 5.2vw, 76px); }
.corporate-lead { max-width: 1080px; font-size: clamp(21px, 2.15vw, 30px); font-weight: 500; line-height: 1.45; }
.corporate-intro-copy { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 50px); margin-top: clamp(36px, 4vw, 65px); padding-top: 30px; border-top: 1px solid var(--border); color: #c9dce6; font-size: .88em; line-height: 1.65; }
.corporate-intro-copy p + p { margin-top: 0; }
.corporate-section { margin-bottom: clamp(75px, 8vw, 130px); }
.corporate-section-heading { margin-bottom: clamp(24px, 3vw, 44px); }
.corporate-section-heading .accent-rule { display: block; }
.corporate-section-heading h2 { margin: .15em 0 .3em; }
.corporate-section-heading > p:last-child:not(.corporate-kicker) { max-width: 760px; color: #c9dce6; }
.corporate-service-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; list-style: none; }
.corporate-service-grid li { min-height: 135px; padding: 22px; border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(145deg, #09222e, #031018 70%); font-size: 1.03em; font-weight: 600; line-height: 1.3; }
.corporate-service-grid li::before { content: ''; display: block; width: 28px; height: 2px; margin-bottom: 20px; background: var(--blue); }
.corporate-industry-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.corporate-industry { grid-column: span 2; min-height: 255px; padding: clamp(22px, 2.6vw, 38px); background-image: linear-gradient(145deg, #082431, #031018 75%); }
.corporate-industry:nth-child(4), .corporate-industry:nth-child(5) { grid-column: span 3; }
.corporate-card-number { display: block; margin-bottom: 25px; color: var(--blue); font-size: .62em; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.corporate-industry h3 { margin-bottom: .6em; color: var(--text); font-size: clamp(23px, 2vw, 30px); line-height: 1.16; }
.corporate-industry p { color: #c9dce6; font-size: .84em; line-height: 1.55; }
.corporate-process { padding: clamp(30px, 4vw, 58px); border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(125deg, #0a2631, #031018 68%); }
.corporate-process-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; list-style: none; counter-reset: corporate-steps; }
.corporate-process-list li { min-height: 145px; padding: 25px 20px 25px 0; border-top: 1px solid #2a5260; counter-increment: corporate-steps; font-weight: 600; line-height: 1.3; }
.corporate-process-list li::before { content: counter(corporate-steps, decimal-leading-zero); display: block; margin-bottom: 24px; color: var(--blue); font-size: .7em; letter-spacing: .12em; }
.corporate-purpose-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.corporate-purpose { min-height: 310px; padding: clamp(28px, 4vw, 55px); background-image: linear-gradient(145deg, #0b2934, #031018 80%); }
.corporate-purpose h2 { margin: .65em 0 .4em; }
.corporate-purpose > p:last-child { max-width: 590px; color: #d3e2e9; line-height: 1.55; }
.corporate-principles { margin-top: clamp(60px, 7vw, 100px); }
.corporate-principles ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; list-style: none; }
.corporate-principles li { padding: 19px 0; border-top: 1px solid var(--border); font-weight: 600; }
.corporate-principles li::before { content: '↗'; margin-right: 14px; color: var(--blue); }
.corporate-ecosystem { padding: clamp(30px, 4vw, 58px); border: 1px solid var(--border); border-radius: 8px; background: #04141c; }
.corporate-relationship { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(12px, 3vw, 45px); }
.corporate-brand { min-width: 0; padding: clamp(22px, 3vw, 42px); border: 1px solid var(--border); border-radius: 8px; background: #071d27; }
.corporate-brand-endow { border-color: #2d9197; background: #0a2a32; }
.corporate-brand h3 { margin-bottom: .5em; color: var(--text); font-size: clamp(23px, 2.1vw, 33px); overflow-wrap: anywhere; }
.corporate-brand-endow h3 { color: var(--blue); }
.corporate-brand p { color: #c7dce5; }
.corporate-relationship-link { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--blue); font-size: .6em; font-weight: 700; letter-spacing: .13em; text-align: center; text-transform: uppercase; white-space: nowrap; }
.corporate-relationship-link span:first-child { font-size: 3em; line-height: 1; transform: rotate(-90deg); }
.corporate-relationship-copy { max-width: 920px; margin-top: 30px; color: #c9dce6; font-size: .85em; line-height: 1.6; }
.corporate-structure .corporate-tree { max-width: none; background-image: linear-gradient(125deg, #0a2631, #031018 68%); }
.corporate-closing { padding: clamp(40px, 6vw, 85px); border: 1px solid #2d9197; border-radius: 8px; background: linear-gradient(120deg, #0e3740, #031018 70%); }
.corporate-closing h2 { margin: .25em 0 .4em; font-size: clamp(38px, 5.4vw, 74px); }
.corporate-closing > p:not(.corporate-kicker) { color: #c9dce6; }

@media (max-width: 1000px) {
  .corporate-intro-copy { grid-template-columns: 1fr 1fr; }
  .corporate-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .corporate-industry { grid-column: span 3; }
  .corporate-industry:nth-child(4), .corporate-industry:nth-child(5) { grid-column: span 3; }
  .corporate-process-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .corporate-content { padding-top: 50px; padding-bottom: 70px; }
  .corporate-intro-copy, .corporate-service-grid, .corporate-industry-grid, .corporate-purpose-grid, .corporate-principles ul { grid-template-columns: 1fr; }
  .corporate-intro-copy { gap: 20px; }
  .corporate-service-grid li { min-height: 105px; }
  .corporate-industry, .corporate-industry:nth-child(4), .corporate-industry:nth-child(5) { grid-column: auto; min-height: 0; }
  .corporate-process-list { grid-template-columns: 1fr 1fr; gap: 0 18px; }
  .corporate-process-list li { min-height: 125px; }
  .corporate-purpose { min-height: 0; }
  .corporate-relationship { grid-template-columns: 1fr; }
  .corporate-relationship-link span:first-child { transform: none; }
}

@media (max-width: 460px) {
  .corporate-process-list { grid-template-columns: 1fr; }
  .corporate-process-list li { min-height: 0; padding: 18px 0; }
  .corporate-process-list li::before { margin-bottom: 8px; }
}