/* 2026-10-04 visual refinement: stronger hierarchy, contemporary type and calmer rhythm. */
:root {
  --ui-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --navy: #0b2d4f;
  --accent-soft: #75c2ff;
}

body,
h1,
h2,
h3,
h4,
.button {
  font-family: var(--ui-font);
}

body {
  font-feature-settings: "kern" 1, "liga" 1;
  text-rendering: optimizeLegibility;
}

html {
  scroll-padding-top: 112px;
  overflow-x: clip;
}

body {
  overflow-x: clip;
}

/* Keep the fixed navigation in the page-level stacking context. */
.hero {
  isolation: auto;
}

.hero > .hero-image {
  z-index: 0;
}

.hero > .hero-shade {
  z-index: 1;
}

section:not(.hero) {
  padding: 94px 0;
}

.section-tag {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  color: #3d5265;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1.75px;
}

.section-tag::before {
  content: "";
  display: block;
  flex: 0 0 3px;
  width: 3px;
  height: 22px;
  background: linear-gradient(180deg, #007bff, #63c4ff);
  border-radius: 2px;
}

.execution .section-tag,
.contact .section-tag {
  color: #c4d2da;
}

.section-heading {
  margin-bottom: 52px;
}

.section-heading h2 {
  max-width: 1040px;
}

/* Navigation becomes a restrained, translucent utility bar after the hero. */
header.site-nav {
  transition: padding .24s ease, border-color .24s ease, box-shadow .24s ease;
}

header.site-nav::before {
  content: "";
  position: absolute;
  inset: 0 50%;
  width: 100vw;
  transform: translateX(-50%);
  z-index: -1;
  background: transparent;
  transition: background .24s ease, backdrop-filter .24s ease;
}

header.site-nav.is-sticky {
  position: fixed;
  top: 0;
  left: 50%;
  width: calc(100% - 128px);
  max-width: 1360px;
  transform: translateX(-50%);
  z-index: 10000;
  padding: 17px 0;
  border-bottom-color: rgba(255, 255, 255, .14);
  box-shadow: 0 12px 35px rgba(0, 18, 34, .15);
}

header.site-nav.is-sticky::before {
  background: rgba(6, 37, 63, .9);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

header.site-nav.is-sticky .hero-wordmark {
  width: 150px;
  flex-basis: 150px;
}

header.site-nav nav a {
  position: relative;
}

header.site-nav nav a:not(.nav-contact)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -9px;
  height: 2px;
  background: #58b9ff;
  transition: right .22s ease;
}

header.site-nav nav a.is-current:not(.nav-contact)::after,
header.site-nav nav a:hover:not(.nav-contact)::after {
  right: 0;
}

header.site-nav nav a.is-current {
  color: #9fd7ff;
}

/* Service rows feel interactive without becoming cards. */
.service-list summary {
  margin-inline: -16px;
  padding-inline: 16px;
  border-left: 3px solid transparent;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.service-list summary:hover,
.service-list summary:focus-visible {
  background: linear-gradient(90deg, rgba(0, 123, 255, .07), rgba(0, 123, 255, 0) 72%);
  border-left-color: #168ee7;
}

.service-list .plus {
  min-width: 132px;
  justify-content: center;
  padding: 9px 13px;
  border: 1px solid rgba(0, 123, 255, .28);
  border-radius: 999px;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.service-list summary:hover .plus,
.service-list details[open] .plus {
  background: rgba(0, 123, 255, .08);
  border-color: rgba(0, 123, 255, .6);
  color: #005fc8;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  header.site-nav,
  .service-list summary,
  .service-list .plus { transition: none; }
}

@media (max-width: 1000px) {
  header.site-nav.is-sticky { width: calc(100% - 70px); }
  section:not(.hero) { padding: 84px 0; }
}

@media (max-width: 700px) {
  html { scroll-padding-top: 148px; }
  header.site-nav.is-sticky { width: calc(100% - 40px); padding: 13px 0; }
  header.site-nav.is-sticky .hero-wordmark { width: 126px; flex-basis: 126px; }
  .section-tag { font-size: 11px; gap: 10px; margin-bottom: 21px; }
  .section-tag::before { height: 18px; }
  section:not(.hero) { padding: 68px 0; }
  .section-heading { margin-bottom: 36px; }
  .service-list summary { margin-inline: -10px; padding-inline: 10px; }
  .service-list .plus { min-width: 0; padding: 7px 9px; }
}

/* Selected experience: compact proof points that expand only when requested. */
.case-studies{background:#edf2f5;border-top:1px solid #d9e1e7;border-bottom:1px solid #d9e1e7}
.case-studies .section-heading h2{font-size:clamp(38px,4.25vw,64px)}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
.case-card{overflow:hidden;border:1px solid rgba(11,45,79,.14);border-top:3px solid #168ee7;background:#fff;box-shadow:0 16px 40px rgba(11,45,79,.07)}
.case-card>summary{display:grid;grid-template-columns:34px minmax(0,1fr) 30px;gap:15px;align-items:start;min-height:230px;padding:28px 25px 25px;transition:background .2s ease}
.case-card>summary:hover,.case-card>summary:focus-visible{background:#f7fafc}
.case-number{padding-top:4px;color:#168ee7;font-size:11px;font-weight:700;letter-spacing:1.3px}
.case-heading{display:block}.case-heading strong{display:block;color:#0b2d4f;font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.35px}.case-heading small{display:block;margin-top:19px;color:#536779;font-size:15px;line-height:1.65}
.case-plus{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid rgba(22,142,231,.45);border-radius:50%;color:#0878cb;font-size:21px;line-height:1;transition:transform .2s ease,background .2s ease,color .2s ease}
.case-card[open] .case-plus{transform:rotate(45deg);background:#0b2d4f;color:#fff}
.case-body{padding:0 25px 28px 74px;border-top:1px solid #e3e9ed}.case-body>div{padding-top:20px}.case-body h4{margin:0 0 7px;color:#168ee7;font-size:10px;font-weight:700;letter-spacing:1.45px;text-transform:uppercase}.case-body p{margin:0;color:#526678;font-size:14px;line-height:1.65}.case-body blockquote{margin:23px 0 0;padding:17px 0 0 17px;border-top:1px solid #dce4e9;border-left:2px solid #168ee7;color:#0b2d4f;font-size:15px;font-weight:700;line-height:1.55}
.case-note{margin:22px 0 0;color:#6e7d89;font-size:12px}
@media(max-width:1000px){.case-grid{grid-template-columns:1fr}.case-card>summary{min-height:0}}
@media(max-width:600px){.case-card>summary{grid-template-columns:27px minmax(0,1fr) 28px;gap:10px;padding:23px 19px 21px}.case-heading strong{font-size:21px}.case-heading small{margin-top:13px;font-size:14px}.case-body{padding:0 20px 24px 56px}}