@font-face {
  font-family: Inter;
  src: url("assets/inter.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --ink: #163a3f;
  --muted: #506465;
  --paper: #f7f6f0;
  --line: #cdd7cf;
  --focus: #9781e8;
}
body {font-family: Inter, Arial, sans-serif}
.icon {width: 1.15em; height: 1.15em; flex: none; vertical-align: middle}
.site-start {position: relative; z-index: 5; height: 0}
header.masthead {
  max-width: 1520px; min-height: 0; display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; padding: 24px clamp(26px,4.7vw,84px); gap: 24px; border: 0; color: #f6f5e9;
}
#main-navigation {display: flex; gap: 2px; width: auto; flex-direction: row; padding: 4px; border-radius: 40px; background: #ffffff0d; border: 1px solid #e6fff026; backdrop-filter: blur(14px)}
#main-navigation a {font-size: 12px; font-weight: 500; line-height: 1.2; padding: 10px 17px; border-radius: 30px; color: #e8eee9}
#main-navigation a:hover, #main-navigation a[aria-current] {background: #d8ece627; color: white; text-decoration: none}
.nav-contact {justify-self: end; display: flex; align-items: center; gap: 12px; border: 1px solid #e8faef6e; border-radius: 26px; padding: 8px 17px; font-size: 12px; font-weight: 540}
.nav-contact:hover, .sub-action:hover {background: #ffffff19; text-decoration: none}
.arrival-scene {
  background: #163840 url("assets/sky-atlas.webp") center center / 100% 100% no-repeat;
  padding: 119px 26px 62px; overflow: hidden; position: relative; isolation: isolate;
}
.hero-message {position: relative; margin: auto; text-align: center; color: #fcf8e8; max-width: 880px}
.journey-label {display: flex; justify-content: center; align-items: center; gap: 10px; text-transform: uppercase; font-size: 10px; font-weight: 590; letter-spacing: .19em; color: #deece1}
.journey-label .icon {width: 16px; height: 16px}
.route-line {width: 30px; border-top: 1px dashed #d3e1d79e; position: relative}
.route-line::after {content: ''; position: absolute; right: 0; top: -2.5px; width: 4px; height: 4px; border-radius: 50%; background: #d7e9df}
.hero-message h1 {margin: 19px auto 16px; font-size: clamp(64px,6.8vw,103px); letter-spacing: -.074em; font-weight: 590; line-height: .98}
.hero-message h1 em {font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: 1.07em; letter-spacing: -.066em; color: #d7f3df}
.opening-summary {margin: 0 auto; max-width: 520px; font-size: 15px; line-height: 1.58; color: #eff3ec; text-wrap: balance}
.opening-actions {display: flex; gap: 10px; align-items: center; justify-content: center; margin: 23px auto 0}
.opening-actions a {display: inline-flex; align-items: center; gap: 12px; padding: 12px 18px; border-radius: 32px; font-size: 12px; font-weight: 630; line-height: 1.4}
.main-action {background: #f0f2d9; color: #123a39; border: 1px solid #f0f2d9}
.main-action:hover {background: white; text-decoration: none}
.sub-action {background: #18333c4d; border: 1px solid #eef7ed66}
.hero-deck {display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr); gap: clamp(12px,1.65vw,26px); align-items: center; max-width: 1200px; margin: 40px auto 0}
.snapshot {background: #f8f8ee; border-radius: 15px; display: block; padding: 7px 7px 0; box-shadow: 0 13px 28px #092c3040; transition: transform .18s ease; color: #223d3e}
.snapshot:hover {text-decoration: none; transform: translateY(-4px) rotate(0)}
.photo-left {transform: translateY(7px) rotate(-4deg)}
.photo-right {transform: translateY(7px) rotate(4deg)}
.snapshot-image {position: relative; border-radius: 9px; overflow: hidden; aspect-ratio: 1.88; background: #d5dcd4}
.snapshot-image img {width: 100%; height: 100%; object-fit: cover}
.photo-right img {object-position: 50% 47%}
.photo-location {position: absolute; top: 9px; left: 9px; display: flex; gap: 4px; align-items: center; border-radius: 30px; padding: 4px 7px; color: #fff; background: #183137c9; font-size: 9px; font-weight: 550}
.snapshot-caption {display: flex; align-items: center; justify-content: space-between; padding: 11px 5px 12px; font-size: clamp(11px,1vw,14px); font-weight: 630; letter-spacing: -.025em}
.snapshot-caption .icon {width: 14px; height: 14px; color: #586b66}
.assistant-card {position: relative; z-index: 1; border: 1px solid #f6f2ffe0; background: linear-gradient(135deg,#faf7ff,#f0edfc 55%,#dfdcf9); border-radius: 19px; padding: 21px; box-shadow: 0 18px 48px #28254845; color: #302b41}
.assistant-head {display: flex; align-items: center; gap: 10px}
.assistant-icon {display: grid; place-items: center; width: 37px; height: 37px; border-radius: 12px; background: #50416e; color: #e9ddff}
.assistant-icon .icon {width: 26px; height: 26px}
.assistant-head p {font-size: 9px; font-weight: 690; letter-spacing: .125em; text-transform: uppercase; color: #6a5e7f; margin-bottom: 2px}
.assistant-head h2 {font-size: clamp(18px,1.7vw,24px); letter-spacing: -.055em; line-height: 1.12; font-weight: 650}
.expand-chat {display: grid; place-items: center; margin-left: auto; width: 32px; height: 32px; border-radius: 50%; color: #574b6d; background: #ffffff75; border: 1px solid #5c4c791f}
.expand-chat:hover, .quick-topics button:hover {background: #fff}
.ask-prompt {font-size: 13px; margin: 15px 0 7px; color: #4b415a}
.quick-form {display: flex; align-items: center; gap: 4px; padding: 5px; padding-left: 13px; background: #fff; border-radius: 12px; border: 1px solid #c9c3d9}
.quick-form:focus-within {outline: 2px solid #8471ae}
.quick-form input {font-size: 14px; min-width: 0; background: transparent; border: 0; color: #332947; flex: 1; padding: 6px 0}
.quick-form input:focus-visible {outline: 0}
.quick-form input::placeholder {color: #726e7b}
.quick-form button {border: 0; background: #51436f; color: white; border-radius: 9px; width: 33px; height: 33px; display: grid; place-items: center}
.quick-form button:hover {background: #34264b}
.quick-topics {display: flex; gap: 5px; flex-wrap: wrap; margin-top: 10px}
.quick-topics button {font-size: 10px; font-weight: 560; line-height: 1.3; color: #51475f; padding: 6px 9px; border-radius: 20px; border: 1px solid #c8c1d5; background: #ffffff48}
.intro.wrap, .process.wrap, .sectors.wrap, .restored.wrap {padding-top: clamp(42px,5vw,78px); padding-bottom: clamp(38px,4.5vw,70px)}
.intro.wrap {border-top: none}
.section-title {font-size: 15px; font-weight: 630; letter-spacing: -.035em; align-items: center; gap: 12px}
.section-title span, .step-index {font-variant-numeric: tabular-nums; color: #476b61}
.section-title span {font-size: 20px}
.section-lead, .intro-copy .section-lead, .people-copy .section-lead, .section-head .section-lead, .contact .section-lead {font-size: clamp(28px,3.35vw,47px); letter-spacing: -.06em; line-height: 1.1}
.people figure img {border-radius: 14px; object-fit: cover; object-position: 50% 43%}
.people {background: #e8eee7}
.contact {background: #e6eae9}
.intro-visual figure {width: min(100%,365px); margin-inline: auto}
.intro-visual figure img {width: 100%; height: auto; max-height: none; object-fit: contain; border-radius: 14px; background: transparent}
.sector-list {font-weight: 570}
.button, .chat-message a.chat-action.primary {border-radius: 24px; background: #214746; border-color: #214746}
#inquiry {border-radius: 16px}
.bema-lockup {display: block; justify-self: start; line-height: 0}
.bema-lockup img {width: 95px; height: auto; object-fit: contain}
footer .bema-lockup img {mix-blend-mode: multiply}
.footer-bottom {align-items: baseline; flex-wrap: wrap}
.footer-bottom address {font-style: normal; font-size: 12px; line-height: 1.6; color: var(--muted)}
@media (max-width: 700px) {.masthead .bema-lockup img {width: 72px}}
body:has(#chat-dialog[open]) {overflow: hidden}
#chat-dialog {padding: 0; width: min(608px,calc(100% - 28px)); max-height: 87dvh; margin: auto; border: 1px solid #c7bed8; border-radius: 20px; color: #fff; background: #303141; box-shadow: 0 24px 80px #051e2490; overscroll-behavior: contain}
#chat-dialog::backdrop {background: #0b252ab0; backdrop-filter: blur(5px)}
#chat-panel {max-width: none; margin: 0; padding: 25px; border-radius: 0; background: linear-gradient(145deg,#3a334a,#233e43)}
#chat-panel .chat-heading {padding-right: 42px}
#chat-panel .chat-heading h2 {font-size: 25px}
#chat-panel .chat-kicker {color: #dbd3ee; font-weight: 650}
#chat-panel #chat-form {border-radius: 12px}
#chat-panel #chat-form button {background: #51436f; border-radius: 9px}
#chat-panel .chat-suggestions button, #chat-panel .chat-interview-link {border-radius: 22px}
#chat-panel .chat-next-step {margin: 15px 0; gap: 10px}
#chat-panel .chat-disclosure {margin-top: 12px}
#close-chat {position: absolute; right: 14px; top: 14px; display: grid; place-items: center; width: 36px; height: 36px; color: #fff; border-radius: 50%; border: 1px solid #ffffff45; background: #ffffff14}
@media (min-width: 1500px) {.arrival-scene {padding-top: 148px; padding-bottom: 55px}.hero-deck {margin-top: 44px}}
@media (min-width: 801px) {
  .assistant-card {padding: clamp(22px,2.1vw,32px)}
  .assistant-head {gap: 13px}
  .assistant-head h2 {font-size: clamp(22px,2.1vw,31px)}
  .assistant-head p {font-size: 10px}
  .assistant-icon {width: 46px; height: 46px}
  .assistant-icon .icon {width: 30px; height: 30px}
  .expand-chat {width: 38px; height: 38px}
  .ask-prompt {font-size: 15px; margin: 19px 0 9px}
  .quick-form {padding: 6px 6px 6px 15px}
  .quick-form input {font-size: 16px}
  .quick-form button {width: 40px; height: 40px}
  .quick-topics {gap: 7px; margin-top: 12px}
  .quick-topics button {font-size: 12px; padding: 7px 11px}
  .snapshot-caption {font-size: clamp(12px,1.05vw,15px); padding: 12px 6px 13px}
}
@media (max-width: 800px) {
  .arrival-scene {padding-left: 18px; padding-right: 18px}
  .hero-deck {grid-template-columns: 1fr 1.55fr 1fr; gap: 10px}
  .assistant-card {padding: 15px}
  .quick-topics {gap: 4px}
  .quick-topics button {padding: 6px}
  .snapshot-image {aspect-ratio: 1.5}
}
@media (max-width: 700px) {
  header.masthead {position: relative; grid-template-columns: 1fr auto auto; padding: 18px 20px; gap: 10px}
  #menu-toggle {display: grid; width: 38px; height: 38px; min-height: 0; place-items: center; padding: 0; border-radius: 50%; color: #fff; border: 1px solid #f3fff040; background: #ffffff12}
  #main-navigation {display: none; position: absolute; right: 19px; top: calc(100% - 5px); min-width: 170px; flex-direction: column; gap: 1px; border-radius: 15px; background: #193d42; padding: 6px; box-shadow: 0 12px 30px #092a3055}
  #main-navigation.is-open {display: flex}
  #main-navigation a {padding: 12px 14px; border-radius: 9px}
  .nav-contact {font-size: 11px; padding: 8px 12px}
  .arrival-scene {padding: 101px 18px 34px; background-size: auto 100%}
  .journey-label {font-size: 9px}
  .hero-message h1 {font-size: clamp(48px,10.2vw,72px); margin-top: 18px; margin-bottom: 17px}
  .opening-summary {font-size: 14px; max-width: 430px}
  .opening-actions {margin-top: 17px; gap: 7px}
  .opening-actions a {font-size: 11px; padding: 11px 13px; gap: 7px}
  .hero-deck {max-width: 500px; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 28px; gap: 16px 12px}
  .assistant-card {grid-row: 1; grid-column: 1/-1; padding: 18px 19px}
  .assistant-head h2 {font-size: 23px}
  .ask-prompt {margin: 12px 0 7px}
  .quick-form input {font-size: 16px}
  .quick-topics button {padding: 7px 11px}
  .snapshot {border-radius: 10px; padding: 4px 4px 0}
  .snapshot-image {aspect-ratio: 1.72; border-radius: 7px}
  .snapshot-caption {font-size: 11px; padding: 8px 4px}
  .photo-left {transform: rotate(-2deg)}
  .photo-right {transform: rotate(2deg)}
  .photo-location {font-size: 8px; top: 6px; left: 6px}
  .section-title {font-size: 15px}
  #chat-panel {padding: 21px 16px}
  #chat-panel #chat-log {max-height: min(42dvh,350px)}
}
@media (prefers-reduced-motion: reduce) {.snapshot {transition: none}}

/* Each process row opens independently and remains usable without JavaScript. */
.process-steps {list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line)}
.process-steps li {border-bottom: 1px solid var(--line)}
.process-steps summary {display: grid; grid-template-columns: 2.5rem 1fr auto; align-items: center; gap: 12px; padding: 18px 8px; list-style: none; cursor: pointer; font-size: clamp(17px,1.65vw,23px); font-weight: 570; letter-spacing: -.035em}
.process-steps summary::-webkit-details-marker {display: none}
.process-steps summary:hover {background: #eaf0e9}
.step-toggle {width: 30px; height: 30px; border: 1px solid #b9c8bc; border-radius: 50%; display: grid; place-items: center}
.step-toggle::before, .step-toggle::after {content: ''; grid-area: 1/1; width: 11px; height: 1.5px; background: currentColor}
.step-toggle::after {transform: rotate(90deg)}
details[open] > summary .step-toggle::after {display: none}
.process-steps details > p {max-width: 77ch; margin: 0 16px 22px calc(2.5rem + 20px); font-size: 15px; line-height: 1.7; color: var(--muted)}
@media (max-width: 600px) {
  .process-steps summary {grid-template-columns: 1.5rem 1fr auto; padding: 16px 0; gap: 9px}
  .process-steps details > p {margin-left: 0}
}

.mt-training {margin-top: clamp(36px,5vw,70px); display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: clamp(24px,5vw,70px)}
.mt-intro {grid-column: 2; grid-row: 1}
.mt-intro h3 {margin: 10px 0 18px; font-size: clamp(25px,2.5vw,36px); letter-spacing: -.045em; line-height: 1.15}
.mt-intro .text-link {margin-top: 10px}
.mt-intro > div > p:not(.eyebrow) {color: var(--muted); font-size: 15px; line-height: 1.7}
.mt-photos {grid-column: 1; grid-row: 1}
.mt-photos img {width: 100%; height: auto; border-radius: 12px}
@media (max-width: 700px) {
  .mt-training {display: flex; flex-direction: column; align-items: stretch; gap: 18px}
}