:root {
  color-scheme: light;
  --page: #fbfcfe;
  --text: #24364c;
  --heading: #102d4d;
  --accent: #165cc5;
  --muted: #516279;
  --border: #b4c4d7;
  --surface: #eff5fc;
  --status: #176444;
  --brand: #102d4d;
  --button: #165cc5;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  color-scheme: dark;
  --page: #101923;
  --text: #d2dfed;
  --heading: #eef5ff;
  --accent: #93c1ff;
  --muted: #aabdd3;
  --border: #40556d;
  --surface: #192a3c;
  --status: #83dcb3;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #101923;
  --text: #d2dfed;
  --heading: #eef5ff;
  --accent: #93c1ff;
  --muted: #aabdd3;
  --border: #40556d;
  --surface: #192a3c;
  --status: #83dcb3;
}
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px}
body {
  margin:0;
  background:var(--page);
  color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px;
  line-height:1.65}
h1,h2,h3,p {
  margin:0}
a {
  color:var(--accent);
  text-underline-offset:4px}
a:focus-visible {
  outline:3px solid #d48b12;
  outline-offset:5px}
h1,h2,h3 {
  color:var(--heading);
  line-height:1.15}
h1 {
  font-size:clamp(2.8rem,5.7vw,4.5rem);
  letter-spacing:-.055em;
  max-width:760px}
h2 {
  font-size:clamp(2rem,3.6vw,2.8rem);
  letter-spacing:-.04em}
h3 {
  font-size:1.35rem;
  letter-spacing:-.02em}
.wrap {
  width:min(1080px,calc(100% - 48px));
  margin:auto}
.skip {
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--page);
  padding:12px;
  z-index:10}
.skip:focus {
  top:12px}
header {
  position:sticky;
  top:0;
  z-index:5;
  background:var(--page);
  border-bottom:1px solid var(--border)}
nav {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  min-height:80px}
.brand {
  font-size:1rem;
  font-weight:750;
  color:var(--heading);
  text-decoration:none;
  white-space:nowrap}
.brand span {
  display:inline-grid;
  place-items:center;
  width:34px;
  height:34px;
  background:var(--brand);
  color:white;
  margin-right:10px;
  font-size:.75rem;
  border-radius:5px}
.nav-links {
  display:flex;
  flex-wrap:wrap;
  gap:26px;
  align-items:center}
.nav-links a {
  font-size:.88rem;
  color:var(--text);
  text-decoration:none}
.nav-links a:hover {
  color:var(--accent);
  text-decoration:underline}
.language {
  border-left:1px solid var(--border);
  padding-left:20px;
  font-weight:700}
.hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:52px;
  align-items:center;
  padding:88px 0 72px}
.eyebrow {
  font-size:.76rem;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:18px}
.intro {
  font-size:1.16rem;
  max-width:660px;
  margin-top:26px}
.intro strong {
  font-weight:650;
  color:var(--heading)}
.hero-proof {
  font-size:.95rem;
  margin-top:20px;
  max-width:650px;
  color:var(--muted)}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:11px 20px;
  border:1px solid var(--accent);
  border-radius:5px;
  background:var(--button);
  color:white;
  font-size:.94rem;
  font-weight:650;
  text-decoration:none;
  transition:background .15s}
.button:hover {
  background:#10499e}
.button.secondary {
  background:transparent;
  border-color:var(--border);
  color:var(--heading)}
.button.secondary:hover {
  background:var(--surface)}
.availability {
  padding:28px;
  border:1px solid var(--border);
  background:var(--surface);
  border-radius:8px}
.status {
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--status);
  font-size:.82rem;
  font-weight:700}
.status:before {
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#23865a;
  flex-shrink:0}
.availability h2 {
  font-size:1.55rem;
  margin:24px 0}
.availability dl {
  margin:0}
.availability dt {
  font-size:.73rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-top:19px}
.availability dd {
  margin:4px 0 0;
  font-size:.95rem;
  color:var(--heading)}
.availability a {
  display:inline-block;
  font-size:.85rem;
  margin-top:24px}
.section {
  padding:76px 0;
  border-top:1px solid var(--border)}
.section-intro {
  max-width:680px;
  margin:18px 0 36px;
  color:var(--muted)}
.work {
  background:var(--brand);
  color:#dce7f5}
.work h2,.work h3 {
  color:white}
.work .eyebrow {
  color:#94c4ff}
.work .section-intro {
  color:#bfcee1}
.case-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:30px}
.case {
  border-top:2px solid #5d92cf;
  padding-top:24px}
.case .client {
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#aac5e7;
  margin-bottom:14px}
.case h3 {
  font-size:1.5rem;
  min-height:84px}
.case dl {
  margin:24px 0 0}
.case dt {
  font-size:.75rem;
  font-weight:750;
  color:#aac5e7;
  margin-top:18px}
.case dd {
  margin:5px 0 0;
  font-size:.97rem;
  line-height:1.65}
.services {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px;
  margin-top:36px}
.service {
  padding-top:22px;
  border-top:1px solid var(--border)}
.number {
  font-size:.8rem;
  color:var(--accent);
  margin-bottom:16px}
.service p {
  margin-top:17px;
  font-size:1rem}
.service .tools {
  font-size:.85rem;
  color:var(--muted);
  margin-top:20px}
.about-grid {
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap:70px}
.about-copy p {
  margin-top:22px}
.timeline {
  margin:0;
  padding:0;
  list-style:none}
.timeline li {
  padding:0 0 25px 22px;
  border-left:1px solid var(--border);
  position:relative}
.timeline li:before {
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--button);
  left:-5px;
  top:6px}
.timeline h3 {
  font-size:1.12rem}
.timeline .date {
  font-size:.8rem;
  color:var(--muted);
  margin:7px 0}
.timeline p {
  font-size:.96rem}
.expertise {
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--border)}
.expertise strong {
  color:var(--heading)}
.engagements {
  background:var(--surface)}
.formats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:30px;
  margin-top:34px}
.formats h3 {
  font-size:1.18rem}
.formats p {
  margin-top:12px;
  font-size:.96rem}
.note {
  margin-top:30px;
  font-size:.9rem;
  color:var(--muted);
  max-width:760px}
.contact {
  padding:76px 0}
.contact-inner {
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:60px;
  align-items:center}
.contact p {
  margin-top:20px;
  max-width:650px}
.contact .actions {
  margin:0;
  flex-direction:column;
  align-items:flex-start}
.email {
  font-size:.92rem;
  overflow-wrap:anywhere}
footer {
  border-top:1px solid var(--border);
  padding:24px 0;
  color:var(--muted);
  font-size:.82rem}
footer .wrap {
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap}
@media(max-width:900px) {
  .hero {
  grid-template-columns:minmax(0,1fr) 245px;
  gap:28px}
.nav-links {
  gap:16px}
.case-grid,.services {
  gap:22px}
.case h3 {
  min-height:110px}
.about-grid {
  gap:35px}
}
@media(max-width:700px) {
  html {
  scroll-padding-top:130px}
.wrap {
  width:calc(100% - 36px)}
nav {
  padding:14px 0;
  gap:14px;
  align-items:flex-start;
  flex-direction:column}
.nav-links {
  justify-content:space-between;
  width:100%;
  gap:10px}
.nav-links a {
  font-size:.8rem}
.language {
  padding-left:12px}
.hero {
  grid-template-columns:1fr;
  padding:48px 0;
  gap:30px}
h1 {
  font-size:clamp(2.55rem,10vw,3.6rem)}
.availability {
  padding:24px}
.availability h2 {
  margin:16px 0}
.availability dl {
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:16px}
.availability dt {
  margin-top:12px}
.availability dd {
  grid-row:auto}
.availability dl div {
  min-width:0}
.case-grid,.services,.formats,.about-grid,.contact-inner {
  grid-template-columns:1fr;
  gap:32px}
.case h3 {
  min-height:0}
.section,.contact {
  padding:50px 0}
.section-intro {
  margin-bottom:28px}
.case {
  padding-top:20px}
.case dl {
  margin-top:18px}
.actions .button {
  flex-grow:1}
.contact .actions {
  align-items:stretch}
.contact .email {
  text-align:center}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
* {
  transition:none!important}
}
@media print {
  header,.actions,.skip {
  display:none}
.hero,.section,.contact {
  padding:24px 0}
.work {
  background:white;
  color:var(--text)}
.work h2,.work h3,.work .eyebrow,.case .client,.case dt {
  color:var(--heading)}
.case {
  break-inside:avoid}
body {
  font-size:11pt}
.wrap {
  width:100%}
}


.theme-toggle {
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
  color: var(--heading);
  font: inherit;
  font-size: .82rem;
  cursor: pointer;
}
.theme-toggle[hidden] { display: none; }
.theme-toggle:focus-visible { outline: 3px solid #d48b12; outline-offset: 4px; }
@media (min-width: 701px) and (max-width: 1050px) {
  nav { flex-wrap: wrap; padding: 14px 0; gap: 14px; }
  .nav-links { gap: 14px; }
}
@media (max-width: 700px) {
  nav { position: relative; }
  .theme-toggle { position: absolute; right: 0; top: 10px; padding: 6px 8px; font-size: .72rem; }
  .brand { font-size: .85rem; }
  .brand span { margin-right: 6px; width: 28px; }
}
@media print {
  :root[data-theme], :root {
  color-scheme: light;
  --page: #fbfcfe;
  --text: #24364c;
  --heading: #102d4d;
  --accent: #165cc5;
  --muted: #516279;
  --border: #b4c4d7;
  --surface: #eff5fc;
  --status: #176444;
  --brand: #102d4d;
  --button: #165cc5;
  }
  .theme-toggle { display: none; }
}