@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Instrument+Sans:wght@400;500;600;700&display=swap');

:root {
  color-scheme: light;
  --navy:#102746; --base:#fff; --band:#f1f5fa; --ink:#102746;
  --muted:#435773; --blue:#214e83; --action:#102746; --line:#d5dfeb;
  --heading:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --mono:"IBM Plex Mono",monospace;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; background:var(--base); color:var(--ink); font:1rem/1.6 "Instrument Sans",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
button,input,select,textarea { font:inherit; }
img { display:block; max-width:100%; height:auto; }
p,h1,h2,h3,dl,dd,ul,ol { margin:0; }
p,dd,li { overflow-wrap:break-word; }
p,dd { color:var(--muted); }
.container { width:min(1296px,calc(100% - 2 * clamp(20px,4.5vw,72px))); margin-inline:auto; }
.skip { position:fixed; top:.5rem; left:1rem; transform:translateY(-160%); padding:.65rem 1rem; background:var(--action); color:#fff; z-index:20; }
.skip:focus { transform:none; }
.top { position:sticky; top:0; z-index:5; background:#fff; border-bottom:1px solid var(--line); }
.bar { display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:73px; }
.wordmark img { filter:brightness(0) saturate(100%) invert(13%) sepia(28%) saturate(2203%) hue-rotate(173deg) brightness(91%) contrast(95%); }
.wordmark { display:inline-flex; min-height:44px; align-items:center; flex-shrink:0; }
nav { display:flex; gap:clamp(.65rem,1.35vw,1.4rem); align-items:center; font-size:.86rem; }
nav a,footer a { min-height:44px; display:inline-flex; align-items:center; }
nav a:hover,footer a:hover,.publication a:hover,.email:hover { color:var(--blue); }
.menu-toggle { display:none; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.65rem; min-height:46px; padding:.65rem 1rem; border:1px solid var(--action); border-radius:3px; color:#fff; background:var(--action); font-weight:700; cursor:pointer; }
.button:hover,nav .button:hover { background:#214e83; color:#fff; }
.button-outline { background:transparent; color:var(--ink); border-color:#b7c8e2; }
.button-outline:hover { background:#253b58; color:white; }
.hero { position:relative; isolation:isolate; border-bottom:1px solid var(--line); background:#102746; }
.hero,#how { --ink:#fff; --muted:#e0e9f4; --blue:#c9dcf7; --line:#466181; color:var(--ink); }
.hero .button:not(.button-outline) { background:#fff; color:var(--navy); border-color:#fff; }
.hero .button:not(.button-outline):hover { background:#e5eef9; }
.hero::before,.hero::after { content:""; position:absolute; z-index:-1; inset:0; }
.hero::before { background:url(hero.webp) 63% 52% / cover; filter:grayscale(1); }
.hero::after { background:linear-gradient(90deg,#102746 0%,#102746f4 27%,#102746bc 52%,#10274625 90%),linear-gradient(0deg,#102746 0%,transparent 43%); }
.hero-body { padding-block:clamp(3.8rem,8vw,8.5rem); }
.eyebrow { color:var(--blue); font:500 .75rem/1.5 var(--mono); letter-spacing:.13em; text-transform:uppercase; margin-bottom:.85rem; }
h1,h2 { font-family:var(--heading); font-weight:700; letter-spacing:-.016em; }
h1 { font-size:clamp(3rem,6.5vw,6.6rem); line-height:.97; max-width:790px; margin-bottom:1.4rem; }
h1 span { display:block; color:#fff; }
h2 { font-size:clamp(2.45rem,4.8vw,4.6rem); line-height:1.04; text-wrap:balance; }
h3 { color:var(--ink); line-height:1.3; }
.intro { font-size:clamp(1.04rem,1.55vw,1.24rem); max-width:37rem; margin-top:1rem; }
.capability-line { display:flex; flex-wrap:wrap; gap:.4rem 1rem; padding:0; margin-top:1.45rem; list-style:none; font:500 .68rem/1.5 var(--mono); letter-spacing:.07em; text-transform:uppercase; color:#d1def0; }
.capability-line li { white-space:nowrap; }
.capability-line li:not(:first-child)::before { content:"·"; margin-right:1rem; color:var(--blue); }
.actions { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1.65rem; }
.section { padding-block:clamp(3.2rem,6.6vw,6.4rem); }
.section-head { max-width:54rem; margin-bottom:clamp(1.35rem,3vw,2.5rem); }
.section-head>p:last-child { margin-top:.8rem; }
.portfolio { border-top:1px solid var(--line); }
.portfolio details { border-bottom:1px solid var(--line); }
.portfolio summary { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1rem; cursor:pointer; list-style:none; padding:1.05rem .65rem; }
.portfolio summary::-webkit-details-marker { display:none; }
.portfolio summary:hover,.portfolio details[open] { background:#f1f5fa; }
.portfolio summary strong,.portfolio summary>span:first-child>span { display:block; }
.portfolio summary strong { font-size:clamp(1.04rem,2vw,1.3rem); line-height:1.3; }
.portfolio summary>span:first-child>span { font-size:.95rem; color:var(--muted); margin-top:.28rem; }
.explore,.publication a { color:var(--blue); font-weight:700; font-size:.9rem; }
.explore::after { content:" →"; }
details[open] .explore::after { content:" ↓"; }
.detail { padding:.15rem .65rem 1.25rem; color:var(--muted); }
.detail ul { padding-left:1.25rem; }
.detail li+li,.challenge-grid li+li { margin-top:.4rem; }
.detail dt { font-weight:700; color:var(--ink); }
.detail dd+dt { margin-top:.65rem; }
.band { background:var(--band); border-block:1px solid var(--line); }
#how { background:var(--navy); }
.challenge-grid,.pathway,.credentials { display:grid; gap:1.4rem; }
.challenge-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.challenge-grid article { border-top:1px solid var(--blue); padding-top:1rem; }
.challenge-grid h3,.work-path h3 { font:600 .9rem/1.4 var(--mono); text-transform:uppercase; letter-spacing:.06em; }
.challenge-grid ul { margin-top:.7rem; padding-left:1.05rem; color:var(--muted); }
.challenge-grid li::marker { color:var(--blue); }
.pathway { list-style:none; padding:0; grid-template-columns:repeat(4,minmax(0,1fr)); }
.pathway li { min-width:0; border-top:1px solid #6d8caf; padding:.85rem 0 0; position:relative; }
.pathway li::before { content:""; position:absolute; top:-4px; left:0; width:7px; height:7px; background:var(--blue); }
.assessment-path { margin:0 0 1.7rem; font:500 clamp(.7rem,1.3vw,.92rem)/1.4 var(--mono); text-transform:uppercase; color:var(--blue); }
.work-path li>span { display:block; font:500 1.65rem/1.2 var(--mono); color:var(--blue); margin-bottom:.7rem; }
.work-path p { margin-top:.4rem; font-size:.96rem; }
.split { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(1.55rem,6vw,6rem); }
.principles>div { border-top:1px solid var(--line); padding:.72rem 0; }
.principles dt { font-weight:700; }
.principles dd { margin-top:.1rem; }
#about { background:linear-gradient(90deg,#fff 30%,#fffffff0 58%,#ffffffb8),url(wing.webp) right 44% / auto 130% no-repeat,#fff; }
.credentials { grid-template-columns:repeat(4,minmax(0,1fr)); margin-block:1.8rem 1.3rem; }
.credentials>div { border-top:1px solid #6b87aa; padding-top:.7rem; }
.credentials dt { color:var(--navy); font:600 .82rem/1.4 var(--mono); text-transform:uppercase; }
.credentials dd { margin-top:.4rem; }
.measure { max-width:51rem; }
.publication { border-left:2px solid var(--blue); padding:0 0 0 1.25rem; }
.publication h3 { font-size:1.35rem; margin-bottom:.45rem; }
.publication a,.email { display:inline-flex; align-items:center; min-height:44px; overflow-wrap:anywhere; }
.email { margin-top:.65rem; color:var(--blue); }
.contact-band { background-image:linear-gradient(90deg,#24375238 1px,transparent 1px),linear-gradient(#24375238 1px,transparent 1px); background-size:32px 32px; }
form { background:#fff; border:1px solid var(--line); padding:clamp(1rem,2.4vw,1.75rem); }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem; margin-bottom:.85rem; }
label { display:block; font-weight:600; font-size:.87rem; }
input,select,textarea { display:block; width:100%; min-width:0; min-height:44px; margin-top:.28rem; border:1px solid #acbed4; border-radius:3px; background:#fff; color:var(--ink); padding:.52rem .6rem; font-size:1rem; }
textarea { resize:vertical; }
form .button { margin-top:1rem; }
.form-note { margin-top:.5rem; font-size:.86rem; }
footer { padding:.65rem 0 1.25rem; }
footer .bar { justify-content:flex-start; flex-wrap:wrap; column-gap:1.5rem; }
footer .bar>a:last-child { margin-left:auto; }
footer p { border-top:1px solid var(--line); padding-top:.75rem; font-size:.85rem; }

@media (max-width:1120px) {
  .menu-toggle { display:grid; place-content:center; gap:4px; width:46px; height:46px; border:1px solid var(--line); border-radius:3px; background:var(--band); cursor:pointer; }
  .menu-toggle span { width:19px; height:2px; background:var(--ink); }
  nav { display:none; position:absolute; top:100%; inset-inline:0; background:var(--base); padding:.5rem clamp(20px,4.5vw,72px) 1rem; max-height:calc(100dvh - 75px); overflow:auto; border-bottom:1px solid var(--line); }
  nav.is-open { display:grid; gap:0; }
  nav a:not(.button) { border-bottom:1px solid var(--line); }
  nav .button { justify-self:start; margin-top:.6rem; }
}
@media (max-width:760px) {
  .hero::before { background-position:67% 48%; }
  .hero::after { background:linear-gradient(90deg,#102746f7,#102746dc 52%,#1027467d),linear-gradient(0deg,#102746,transparent 52%); }
  .split,.challenge-grid { grid-template-columns:1fr; }
  .credentials,.work-path { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #about { background-size:auto,auto 100%; }
}
@media (max-width:520px) {
  .bar { min-height:65px; }
  .wordmark img { width:147px; }
  .portfolio summary { grid-template-columns:1fr; gap:.35rem; padding:.75rem .35rem; }
  .detail { padding-inline:.35rem; }
  .assessment-path { gap:.45rem; }
  .form-grid { grid-template-columns:1fr; }
  .capability-line { column-gap:.65rem; }
  .capability-line li:not(:first-child)::before { margin-right:.65rem; }
  footer .bar { gap:0 .85rem; font-size:.82rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Editorial homepage and interior page introductions */
.landing-feature {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  align-items:center;
  gap:clamp(1.5rem,6vw,6rem);
}
.landing-feature h2,.landing-pair h2,.landing-contact h2 { text-wrap:initial; }
.landing-feature p:not(.eyebrow),.landing-pair p:not(.eyebrow) { margin-top:.8rem; max-width:34rem; }
.landing-feature img { width:100%; aspect-ratio:16/9; object-fit:cover; object-position:center 52%; }
.editorial-link { display:inline-flex; align-items:center; min-height:44px; gap:.55rem; color:var(--blue); font-weight:700; margin-top:.55rem; }
.editorial-link:hover { text-decoration:underline; text-underline-offset:.2em; }
.landing-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1.5rem,5vw,5rem); }
.landing-pair section { border-top:1px solid #9ab0cc; padding-top:1.3rem; }
.landing-pair h2,.landing-contact h2 { font-size:clamp(2.15rem,3.8vw,3.35rem); }
.landing-contact { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.2rem; padding-block:clamp(2.5rem,5vw,4.1rem); }
.page-title { background:var(--navy); color:#fff; padding-block:clamp(2.6rem,5vw,5rem); }
.page-title .eyebrow { color:#c9dcf7; }
.page-title h1,.contact-title { font-size:clamp(3rem,5.3vw,5.2rem); max-width:unset; margin-bottom:0; }
@media (max-width:760px) {
  .landing-feature,.landing-pair { grid-template-columns:1fr; }
}
