@font-face{font-family:'Source Sans 3';src:url('assets/source-sans-500.woff') format('woff');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'Source Sans 3';src:url('assets/source-sans-600.woff') format('woff');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-400.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-500.woff') format('woff');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-600.woff') format('woff');font-style:normal;font-weight:600;font-display:swap}

:root{
  --ink:#172b36;
  --secondary:#52626c;
  --border:#d9e0e4;
  --surface:#f2f5f6;
  --blue:#345f78;
  --white:#fff;
  --page:1200px;
  --gutter:clamp(24px,5.5vw,88px);
  --edge:max(var(--gutter),calc((100% - var(--page))/2));
  --section-space:clamp(96px,10.5vw,152px);
  --section-gap:clamp(48px,6.5vw,88px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:112px}
body{margin:0;background:var(--white);color:var(--ink);font-family:Inter,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:'Source Sans 3',Inter,Arial,sans-serif;font-weight:500;text-wrap:balance}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
a,button,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #6895b7;outline-offset:6px}
::selection{background:#c6dde9;color:#172b36}
.skip{position:fixed;top:-100px;left:20px;background:var(--ink);color:white;padding:12px 20px;z-index:100}
.skip:focus{top:10px}

/* One shared content edge keeps every section aligned. */
.header{min-height:88px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:18px var(--edge);background:#fff;position:sticky;top:0;z-index:20;border-bottom:1px solid #e9eef0;gap:24px}
.wordmark{font-size:1.5rem;font-weight:600;letter-spacing:.11em;line-height:1.2;white-space:nowrap}
nav{display:flex;align-items:center;gap:clamp(22px,2.6vw,38px);font-size:.875rem}
nav>a{transition:color 160ms ease}
nav>a:hover{color:var(--blue)}
.nav-action{min-height:46px;padding:10px 17px;border:1px solid #cbd5db;border-radius:4px;display:flex;align-items:center;gap:26px;white-space:nowrap;transition:background 160ms ease}
.nav-action:hover{background:var(--surface)}

/* A quiet, static pattern: no simulated site or moving background. */
.hero{position:relative;display:flex;align-items:center;min-height:680px;min-height:clamp(640px,calc(94svh - 88px),820px);background:#172b36;color:#fff;isolation:isolate;overflow:hidden}
.hero-pattern{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,#172b36 42%,#233e4b 100%)}
.pattern-field{position:absolute;inset:0 0 0 46%;background-image:linear-gradient(90deg,#a6c0cc16 1px,transparent 1px),linear-gradient(0deg,#a6c0cc0a 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent,#000 24%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24%)}
.pattern-frame{position:absolute;top:17%;right:-6%;width:42%;height:69%;border:1px solid #b7d0db40;transform:skewY(-12deg)}
.pattern-frame-one{background:linear-gradient(120deg,#8dabb40a,transparent 65%)}
.pattern-frame-two{top:29%;right:-14%;height:66%;border-color:#b7d0db22}
.hero-content{width:100%;padding:96px var(--edge) 138px}
h1{font-size:clamp(3.4rem,6.7vw,6.1rem);line-height:1.04;letter-spacing:-.035em;max-width:850px}
.hero-content p{font-size:1.125rem;line-height:1.75;margin:32px 0 38px;color:#d9e3e9;max-width:510px;text-wrap:pretty}
.button{min-height:52px;padding:14px 23px;border:1px solid transparent;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;gap:34px;font-weight:500;font-size:.9375rem;line-height:1.5;transition:background 160ms ease,transform 160ms ease}
.button-white{background:#fff;color:var(--ink)}
.button-white:hover{background:#e6eef2}
.scroll-cue{position:absolute;bottom:32px;left:var(--edge);display:inline-flex;align-items:center;gap:24px;min-height:44px;color:#d1dfe6;font-size:.875rem}
.scroll-cue>span:last-child{font-size:1.2rem;transition:transform 180ms ease}
.scroll-cue:hover{color:#fff}

.section{padding:var(--section-space) var(--edge)}
.section-heading{max-width:640px}
.eyebrow{display:block;font-size:.875rem;letter-spacing:.11em;font-weight:500;color:var(--secondary);margin-bottom:24px;line-height:1.5}
h2{font-size:clamp(2.5rem,4vw,3.75rem);line-height:1.1;letter-spacing:-.025em}
.section-heading>p{font-size:1.0625rem;color:var(--secondary);margin-top:26px;max-width:43ch;line-height:1.8;text-wrap:pretty}
.capabilities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,4vw,56px);margin-top:var(--section-gap)}
.capability{display:flex;flex-direction:column;align-items:stretch;border-top:1px solid #cbd6dc;padding-top:25px;min-width:0}
.index{font-size:.875rem;color:var(--secondary);display:block;margin-bottom:30px;font-variant-numeric:tabular-nums}
.capability h3{font-size:1.9375rem;letter-spacing:-.015em;line-height:1.2;margin-bottom:18px}
.capability>p{color:var(--secondary);font-size:1rem;max-width:29ch;line-height:1.8;margin-bottom:27px}
details{font-size:1rem}
summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;font-weight:500;padding:16px 0;line-height:1.5;min-height:52px}
summary::-webkit-details-marker{display:none}
summary span{font-size:1.35rem;font-weight:400;line-height:1;transition:transform 160ms ease}
details[open]>summary span{transform:rotate(45deg)}
.capability details{margin-top:auto}
.capability summary{border-top:1px solid var(--border);font-size:.9375rem}
.capability details>div{padding:4px 0 18px;color:var(--secondary);line-height:1.8}

.approach{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(64px,10vw,144px);padding:var(--section-space) var(--edge);background:var(--surface);align-items:start}
.approach h2{max-width:11ch}
.approach-copy>p{color:var(--secondary);margin-top:28px;max-width:39ch;font-size:1.0625rem;line-height:1.8;text-wrap:pretty}
.approach-principles>div{padding:32px 0;border-bottom:1px solid #d2dce1}
.approach-principles>div:first-child{padding-top:0}
.approach-principles>div:last-child{border:0;padding-bottom:0}
.approach-principles h3{font-weight:500;font-size:1.8125rem;letter-spacing:-.015em;line-height:1.2}
.approach-principles p{color:var(--secondary);font-size:1rem;margin-top:12px;line-height:1.75;max-width:36ch}

.team{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(64px,10vw,144px);align-items:center}
.team h2{max-width:14ch}
.team p{max-width:41ch;font-size:1.125rem;line-height:1.85;color:var(--secondary);text-wrap:pretty}
.project{position:relative;display:grid;grid-template-columns:.95fr 1.15fr;align-items:center;gap:clamp(48px,7vw,104px)}
.project:before{content:'';position:absolute;top:0;left:var(--edge);right:var(--edge);height:1px;background:var(--border)}
.project-tool{min-width:0;border:1px solid var(--border);border-radius:6px;overflow:hidden;background:#fff}
.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--surface);border-bottom:1px solid var(--border)}
.tabs button{padding:19px 10px;border:0;background:transparent;color:var(--secondary);font-size:.875rem;line-height:1.5;position:relative;min-height:66px;font-weight:400;transition:background 160ms ease,color 160ms ease}
.tabs button[aria-selected=true]{color:var(--ink);font-weight:500;background:#fff}
.tabs button[aria-selected=true]:after{content:'';position:absolute;height:2px;bottom:-1px;left:18px;right:18px;background:var(--ink)}
.tabs button:hover{color:var(--ink);background:#e6edf0}
.tabs button:focus-visible{outline-offset:-5px}
.stage{padding:36px;min-height:354px}
.stage h3{font-size:1.625rem;letter-spacing:-.018em;line-height:1.3}
.stage>p{color:var(--secondary);font-size:1rem;margin-top:16px;line-height:1.8}
.stage-details{margin:28px 0 22px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stage-details summary{font-size:.9375rem;font-weight:400}
.stage-details ul{list-style:none;padding:0;margin:0 0 16px;color:var(--secondary);font-size:1rem}
.stage-details li{position:relative;padding:8px 0 8px 18px;line-height:1.75}
.stage-details li:before{content:'·';position:absolute;left:0;font-size:1.25rem;line-height:1.4}
.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;font-size:.9375rem;font-weight:500;padding:10px 0;border-bottom:1px solid var(--ink);line-height:1.6}
.text-link:hover{color:var(--blue);border-color:var(--blue)}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(64px,9vw,128px);align-items:start;padding:var(--section-space) var(--edge);background:var(--ink);color:white}
.contact .eyebrow{color:#b7c9d3}
.contact-copy>p{color:#d2dfe6;margin-top:28px;max-width:34ch;line-height:1.8}
.contact-copy>p:last-child{margin-top:34px}
.contact-email{display:inline-block;padding:4px 0;text-decoration:underline;text-underline-offset:6px;overflow-wrap:anywhere}
.contact-email:hover{color:white}
.contact form{min-width:0;padding-top:4px}
.contact label{display:block;font-size:.9375rem;font-weight:400;color:#edf2f5}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:26px}
.contact input,.contact textarea{font-family:Inter,Arial,sans-serif;font-size:1rem;line-height:1.6;width:100%;min-width:0;color:var(--ink);background:white;border:1px solid #becbd4;border-radius:4px;padding:13px 14px;margin-top:10px;box-shadow:none}
.contact input{min-height:52px}
.contact textarea{resize:vertical;min-height:140px;display:block}
.contact textarea::placeholder{color:#62727c}
.contact input:focus-visible,.contact textarea:focus-visible{outline:3px solid #8bbde2;outline-offset:4px}
.contact .button{margin-top:26px}
.contact .button:disabled{cursor:not-allowed;opacity:.65;transform:none}
.form-note{font-size:.875rem;line-height:1.65;color:#d2dfe6;margin-top:16px;max-width:42ch}
footer{border-top:1px solid var(--border);padding:40px var(--edge);display:flex;align-items:center;justify-content:space-between;gap:28px}
footer .wordmark{font-size:1.25rem}
footer>span{font-size:.875rem;color:var(--secondary)}
.back-top{font-size:.875rem;display:flex;gap:16px;align-items:center;min-height:44px}

@media(hover:hover) and (pointer:fine){
  .button:hover{transform:translateY(-2px)}
  .scroll-cue:hover>span:last-child{transform:translateY(3px)}
}
@media(max-width:1100px){
  nav{gap:22px}
  .approach,.team,.contact{gap:7%}
  .project{gap:5%;grid-template-columns:.9fr 1.1fr}
  .stage{padding:28px}
  .form-row{grid-template-columns:1fr;gap:22px}
}
@media(max-width:940px){
  nav>a:not(.nav-action){display:none}
  .project{grid-template-columns:1fr;gap:44px}
  .project .section-heading{max-width:650px}
  .project-tool{max-width:680px;width:100%}
  .stage{min-height:320px}
}
@media(max-width:700px){
  :root{--gutter:clamp(24px,7vw,42px);--section-space:clamp(80px,16vw,104px);--section-gap:44px}
  html{scroll-padding-top:96px}
  .header{min-height:76px;padding-block:14px;gap:16px}
  .wordmark{font-size:1.25rem;letter-spacing:.09em}
  .nav-action{font-size:.875rem;padding:9px 12px;gap:16px}
  .hero{min-height:620px;min-height:clamp(590px,calc(94svh - 76px),720px)}
  .hero-content{padding:86px var(--edge) 146px}
  h1{font-size:clamp(2.5rem,10.5vw,4.3rem);line-height:1.06;letter-spacing:-.025em}
  .hero-content p{font-size:1rem;max-width:32ch;line-height:1.8;margin:28px 0 32px}
  .desktop-break{display:none}
  .pattern-field{left:32%;opacity:.4;background-size:54px 54px}
  .pattern-frame{top:15%;right:-44%;width:92%;opacity:.45}
  .pattern-frame-two{top:30%;right:-57%}
  .scroll-cue{bottom:26px;gap:18px;font-size:.8125rem}
  h2{font-size:clamp(2.4rem,8vw,3.25rem)}
  .eyebrow{font-size:.875rem;margin-bottom:21px}
  .section-heading>p{font-size:1rem;margin-top:24px}
  .capabilities{grid-template-columns:1fr;gap:36px}
  .capability{display:grid;grid-template-columns:34px 1fr;column-gap:16px;padding-top:26px}
  .capability .index{margin:8px 0 0;grid-column:1;grid-row:1}
  .capability h3{font-size:1.8125rem;margin-bottom:14px;grid-column:2}
  .capability>p{grid-column:2;max-width:34ch;margin-bottom:18px}
  .capability details{grid-column:2}
  .approach,.team,.contact{grid-template-columns:1fr;gap:44px}
  .approach-copy>p{font-size:1rem;margin-top:25px}
  .approach-principles>div{padding:27px 0}
  .approach-principles h3{font-size:1.6875rem}
  .team p{font-size:1.0625rem;line-height:1.85}
  .project{gap:40px}
  .tabs button{font-size:.875rem;padding:17px 8px;min-height:76px}
  .tabs button[aria-selected=true]:after{left:10px;right:10px}
  .stage{padding:27px 24px;min-height:370px}
  .stage h3{font-size:1.625rem}
  .stage-details summary{gap:14px;font-size:.875rem}
  .contact-copy>p{margin-top:25px}
  .contact-copy>p:last-child{margin-top:24px}
  .contact form{padding-top:0}
  .form-row{gap:22px;margin-bottom:22px}
  .contact .button{width:100%}
  footer{padding-block:32px;flex-wrap:wrap;gap:22px}
  footer .wordmark{flex-basis:100%}
  .back-top{margin-left:auto}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .button:hover,.scroll-cue:hover>span:last-child{transform:none}
}
@media print{
  .header{position:static}
  .hero-pattern,.scroll-cue{display:none}
  .hero{min-height:0;background:white;color:var(--ink)}
  .hero-content{padding-block:40px}
  .hero-content p{color:var(--secondary)}
  .section,.approach,.contact{padding-block:40px}
}
