/* Esri-inspired direction: neutral surfaces, charcoal, vivid blue, water and terrain accents.
   These are Rapps concept colors, not an extraction of Esri brand specifications. */
:root {
  --paper: #ffffff;
  --ink: #292929;
  --muted: #59636c;
  --line: #d5dce1;
  --accent: #006fa8;
  --coral: var(--accent);
  --blue: #0079c1;
  --navy: #262b30;
  --sky: #3ac1f2;
  --teal: #007e87;
  --lime: #b7df77;
}
::selection { background: #b8e8fc; color: #173443; }
.header, .header nav { background: #fff; }
.header nav a:hover { color: var(--accent); border-color: var(--accent); }
.hero {
  background: #292929;
  background-image: radial-gradient(ellipse at 94% 90%, #006fa84d, transparent 64%);
  color: #fff;
}
.hero h1 em { color: var(--sky); }
.hero .eyebrow i { background: var(--lime); }
.hero .hero-location, .hero .motion-toggle { color: #c2cdd3; }
.hero .round-link b { border-color: #879ba7; }
.hero .round-link:hover b { background: var(--sky); color: #142a35; border-color: var(--sky); }
.hero a:focus-visible, .hero button:focus-visible { outline-color: var(--sky); }
.belief-line span:before { color: var(--teal); }
.investments { background: #f1f4f6; }
.architecture { background: #d6ebf8; color: #006aa4; }
.systems { background: #d4efea; color: #006a6f; }
.investment-copy p { color: #53616a; }
.tags span { border-color: #b5c9d4; }
.text-link { color: var(--accent); }
.approach { background: #252b30; }
.approach em { color: var(--sky); }
.approach .small-note, .approach-intro>p, .principles p { color: #bdcbd3; }
.principles article>span { color: #7dd2f3; }
.orbital span { border-color: #5ea7c1; }
.orbital i { background: var(--lime); box-shadow: 0 0 25px #b7df7755; }
.spatial {
  background-color: #102e40;
  background-image: radial-gradient(ellipse at 86% 55%, #008f9944, transparent 62%);
}
.spatial em { color: #56c9f3; }
.layer-controls button[aria-pressed=true] { background: #0074ab; color: #fff; border-color: #49bde7; }
.layer-controls button:hover { background: #165675; color: #fff; }
.opportunity-pins { fill: var(--lime); }
.opportunity-plane svg>g:last-child { stroke: var(--lime); }
.contact { background: #006398; color: #fff; }
.contact .section-heading { border-color: #ffffff4d; }
.contact em { color: #adf0e2; }
.contact .small-note, .contact .form-note { color: #d2e8f5; }
.contact-email { border-color: #a4d5ef; }
.contact input, .contact textarea, .contact select { color: #fff; border-color: #a4d5ef; }
.contact input:focus, .contact textarea:focus, .contact select:focus { outline: none; border-bottom-color: #c2f0ff; box-shadow: 0 1px 0 #c2f0ff; }
.contact select option { background: #fff; color: #292929; }
.contact .submit { background: #fff; color: #005783; }
.contact .submit:hover { background: #d9f2fc; }
.contact a:focus-visible, .contact button:focus-visible { outline-color: #c2f0ff; }
.footer { background: #f7f9fa; }

/* Hero revision: the original Rapps color and character, given room to breathe. */
.header {
  position: absolute;
  top: 0; left: 0; right: 0;
  color: #fff;
  background: transparent;
  border-bottom: 1px solid #ffffff2b;
}
.header nav { background: transparent; }
.header nav a:hover { color: #fff; border-color: #fff; }
.header a:focus-visible, .header button:focus-visible { outline-color: #fff; }
.hero {
  height: 100svh;
  min-height: 740px;
  max-height: 1200px;
  padding-top: 145px;
  background: #071236;
  isolation: isolate;
  /* Clip oversize artwork without creating an internally scrollable section. */
  overflow: clip;
}
.hero-art {
  inset: -150px -8%;
  z-index: 0;
}
.hero:after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, #0608204d, transparent 65%), linear-gradient(0deg, #040b22c7, transparent 38%, transparent 78%, #06082066);
  z-index: 1;
  pointer-events: none;
}
.hero-top { align-items: start; position: relative; z-index: 2; }
.hero .eyebrow {
  text-transform: none;
  letter-spacing: .2px;
  font-size: 13px;
  color: #fff;
}
.hero-introduction {
  font-size: 12px; line-height: 1.8;
  color: #fff; max-width: 310px;
  margin: 0;
}
.hero h1 {
  position: absolute;
  left: 4.5%; right: 4.5%; bottom: 22%;
  margin: 0;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(70px, 8.6vw, 146px);
  letter-spacing: -.055em;
  line-height: 1.03;
  color: #fff;
  text-shadow: 0 2px 35px #060c2530;
}
.hero h1 em {
  color: #fff;
  padding: 0;
  margin-top: 4px;
}
.hero-bottom {
  bottom: 65px;
  border-top: 1px solid #ffffff45;
  padding-top: 24px;
  align-items: center;
}
.hero-strategies { display: flex; gap: 35px; }
.hero-strategies a { font-size: 12px; padding: 10px 0; }
.hero-strategies a span { margin-left: 20px; display: inline-block; transition: transform .2s; }
.hero-strategies a:hover span { transform: translate(3px,-3px); }
.hero .round-link b { border-color: #ffffff80; }
.hero .round-link:hover b { background: #fff; color: #13264d; border-color: #fff; }
.hero .motion-toggle { color: #fff; bottom: 23px; z-index: 2; }
@media(max-width:900px) {
  .hero { min-height: 710px; padding-top: 120px; }
  .hero h1 { font-size: clamp(64px,9vw,95px); bottom: 27%; }
  .hero-introduction { max-width: 260px; font-size: 11px; }
}
@media(max-width:600px), (max-width:1100px) and (orientation:portrait) {
  .header .menu-toggle { color: #fff; }
  .header nav.open { background: #111933; border-color: #ffffff40; }
  .hero { height: 100svh; min-height: 690px; max-height: 960px; padding-top: 111px; }
  .hero .eyebrow { font-size: 10px; }
  .hero-introduction { display: none; }
  .hero h1 { left: 6%; right: 6%; bottom: 28%; font-size: clamp(43px,10.9vw,66px); letter-spacing: -.055em; line-height: 1.14; }
  .hero-art { inset: -120px -65%; }
  .hero-strategies { gap: 20px; }
  .hero-strategies a { font-size: 10px; }
  .hero-strategies a span { margin-left: 6px; }
  .hero-bottom { bottom: 64px; gap: 12px; padding-top: 20px; }
  .hero .round-link b { width: 35px; height: 35px; }
}
