:root { color-scheme: light; --paper:#f6f5f0; --ink:#202720; --muted:#62665f; --blue:#2331bb; --line:#d0d2c9; --soft:#eeeee7; --serif:"Baskerville","Iowan Old Style","Palatino Linotype",Georgia,serif; --sans:"Helvetica Neue",Helvetica,Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:106px; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.6 var(--sans); -webkit-font-smoothing:antialiased; }
button,input,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-underline-offset:6px; }
button { cursor:pointer; }
img { display:block; max-width:100%; }
figure,p,h1,h2,h3 { margin:0; }
h1,h2,h3 { font-weight:400; }
h1,h2 { font-family:var(--serif); letter-spacing:-.055em; line-height:1.02; }
em { font-weight:400; }
:focus-visible { outline:3px solid var(--blue); outline-offset:5px; }
.skip-link { position:fixed; top:12px; left:16px; z-index:20; padding:12px 20px; background:var(--blue); color:white; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.shell { width:min(1280px,calc(100% - 112px)); margin-inline:auto; }
.concept-bar { background:var(--ink); color:var(--paper); font-size:12px; letter-spacing:.03em; }
.concept-bar .shell { display:flex; justify-content:space-between; gap:20px; padding-block:9px; }
.site-header { position:sticky; top:0; z-index:10; background:var(--paper); border-bottom:1px solid var(--line); }
.nav-row { display:flex; align-items:center; min-height:100px; gap:54px; }
.wordmark { font-family:var(--serif); font-size:36px; line-height:1; letter-spacing:-.06em; text-decoration:none; white-space:nowrap; }
.wordmark-dot { color:var(--blue); }
.nav-descriptor { font-size:12px; line-height:1.45; color:var(--muted); }
nav { margin-left:auto; display:flex; align-items:center; gap:32px; }
nav a { font-size:14px; text-decoration:none; padding-block:13px; transition:color .2s; }
nav a:hover { color:var(--blue); }
.nav-contact { border-bottom:1px solid var(--ink); min-width:92px; }
.hero { padding-top:68px; display:grid; grid-template-columns:1.34fr 1fr; column-gap:62px; }
.eyebrow,.section-label { font-size:12px; text-transform:uppercase; letter-spacing:.13em; font-weight:500; }
.eyebrow { display:flex; align-items:center; gap:14px; color:var(--blue); }
.small-rule { display:inline-block; width:28px; height:1px; background:currentColor; }
h1 { font-size:clamp(66px,7.15vw,102px); margin:26px 0 27px; line-height:.99; }
h1 em { color:var(--blue); }
.hero-description { font-size:18px; line-height:1.65; max-width:470px; color:#4f554e; }
.hero-actions { display:flex; align-items:center; gap:26px; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:13px 26px; color:white; background:var(--blue); border:1px solid var(--blue); font-size:14px; font-weight:500; text-decoration:none; transition:background .2s,transform .2s; }
.button:hover { background:#18238c; transform:translateY(-2px); }
.text-link { display:inline-flex; align-items:center; min-height:44px; font-size:14px; text-decoration-thickness:1px; }
.hero-fit { margin-top:22px; font-size:12px; color:var(--muted); }
.hero-portrait { padding-top:22px; position:relative; }
.portrait-frame { position:relative; background:#282e33; }
.portrait-frame img { width:100%; height:auto; aspect-ratio:1 / 1.14; object-fit:cover; object-position:center 29%; }
.portrait-index { position:absolute; right:-28px; top:0; writing-mode:vertical-rl; font-size:12px; letter-spacing:.07em; text-transform:uppercase; }
.hero-portrait figcaption { background:var(--blue); color:white; padding:23px 27px; display:flex; justify-content:space-between; align-items:center; }
figcaption strong { display:block; font:27px/1.2 var(--serif); letter-spacing:-.02em; }
figcaption div > span { display:block; font-size:12px; margin-top:5px; color:#e0e3ff; }
.portrait-mark { display:flex; font:italic 50px/.8 var(--serif); letter-spacing:-.12em; }
.portrait-mark span { transform:translateY(9px); }
.hero-footer { grid-column:1 / -1; display:flex; justify-content:space-between; gap:24px; margin-top:50px; border-top:1px solid var(--line); padding:18px 0 24px; font-size:12px; color:var(--muted); }
.hero-footer a { text-decoration:none; }
.section { padding-block:104px; }
.section-label { display:flex; gap:16px; color:var(--muted); }
.section-label > span { color:var(--blue); font-variant-numeric:tabular-nums; }
h2 { font-size:clamp(42px,4.45vw,64px); }
h2 em { color:var(--blue); }
.perspective { display:grid; grid-template-columns:.75fr 1.8fr; gap:90px; border-bottom:1px solid var(--line); }
.perspective .section-label { padding-top:12px; }
.lede { color:var(--muted); max-width:570px; font-size:18px; margin-top:27px; }
.section-heading { display:grid; grid-template-columns:.75fr 1.8fr; gap:90px; margin-bottom:64px; }
.section-heading > .section-label { padding-top:12px; }
.service { display:grid; grid-template-columns:.2fr .85fr 1fr; gap:45px; border-top:1px solid var(--line); padding-block:38px 42px; }
.service:last-child { border-bottom:1px solid var(--line); }
.service-index { padding-top:6px; color:var(--blue); font-size:14px; }
.service h3 { font:42px/1.04 var(--serif); letter-spacing:-.035em; }
.service h3 em { color:var(--muted); }
.service p { max-width:450px; color:var(--muted); }
.service .service-output { font-size:12px; margin-top:21px; color:var(--ink); }
.diagnostic-section { background:var(--blue); color:white; padding-block:88px; }
.diagnostic { display:grid; grid-template-columns:1fr 1fr; gap:110px; }
.diagnostic .section-label,.diagnostic .section-label > span { color:#d2d7ff; }
.diagnostic h2 { margin-top:38px; }
.diagnostic h2 em { color:inherit; }
.diagnostic-intro { max-width:350px; margin-top:23px; color:#e0e3ff; }
.diagnostic-tabs { margin-top:32px; max-width:385px; }
.diagnostic-tabs button { display:flex; width:100%; align-items:center; gap:24px; background:none; color:#d2d7ff; border:0; border-top:1px solid #6e79df; padding:16px 4px; text-align:left; transition:color .2s,padding .2s; }
.diagnostic-tabs button:last-child { border-bottom:1px solid #6e79df; }
.diagnostic-tabs button > span:first-child { font-size:12px; }
.diagnostic-tabs button[aria-pressed="true"] { color:white; padding-inline:12px; background:#ffffff0b; }
.choice-state { width:8px; height:8px; border:1px solid currentColor; border-radius:50%; margin-left:auto; }
[aria-pressed="true"] .choice-state { background:currentColor; }
.diagnostic-section :focus-visible,.about-section :focus-visible { outline-color:white; }
.diagnostic-tabs button:hover { color:white; }
.diagnostic-response { border-left:1px solid #6e79df; padding-left:65px; padding-top:8px; align-self:center; }
.mini-label { font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:#d2d7ff; }
.diagnostic-response h3 { font:38px/1.14 var(--serif); letter-spacing:-.03em; margin-block:24px; min-height:130px; }
#diag-copy { color:#e0e3ff; min-height:104px; }
.exploration-label { margin-top:26px; }
#diag-list { list-style:none; padding:0; margin:14px 0 27px; }
#diag-list li { padding-block:7px; border-bottom:1px solid #6e79df; font-size:14px; }
.engagement-heading { display:flex; justify-content:space-between; gap:20px; padding-bottom:15px; font-size:12px; border-bottom:1px solid var(--ink); }
.engagement-heading span:first-child { color:var(--blue); }
.engagement-grid { display:grid; grid-template-columns:repeat(3,1fr); }
.engagement-step { padding:30px 32px 28px; border-right:1px solid var(--line); }
.engagement-step:first-child { padding-left:0; }
.engagement-step:last-child { padding-right:0; border-right:0; }
.step-top { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:12px; }
.step-top span:last-child { color:#71776a; font:64px/1 var(--serif); letter-spacing:-.06em; }
.engagement-step h3 { font:44px/1 var(--serif); letter-spacing:-.04em; margin:36px 0 22px; }
.engagement-step > p { color:var(--muted); }
.engagement-step .deliverable { margin-top:32px; padding-top:19px; border-top:1px solid var(--line); font-size:14px; color:var(--ink); }
.deliverable span { display:block; color:var(--blue); font-size:12px; letter-spacing:.05em; text-transform:uppercase; margin-bottom:6px; }
.scenario-note { border-top:1px solid var(--line); padding-top:18px; color:var(--muted); font-size:12px; }
.about-section { background:var(--ink); color:var(--paper); padding-block:96px; }
.about-grid { display:grid; grid-template-columns:.75fr 1.8fr; gap:90px; }
.about-section .section-label,.about-section .section-label > span { color:#c1c7bc; }
.about-monogram { display:block; margin:76px 0 48px; font:italic 120px/.9 var(--serif); letter-spacing:-.15em; color:#babeb0; }
.about-monogram > span { display:inline-block; transform:translateY(22px); }
.about-identity > p:last-child { font-size:16px; }
.about-identity > p:last-child > span { font-size:12px; color:#bec4b9; }
.about-copy h2 em { color:#c5cbbc; }
.about-lede { font-size:21px; margin-top:30px; margin-bottom:16px; }
.about-copy > p:not(.about-lede) { color:#bec4b9; max-width:600px; }
.principles { display:grid; grid-template-columns:1fr 1fr; gap:28px 32px; margin-top:36px; }
.principles > div { border-top:1px solid #5e665d; padding-top:14px; }
.principles h3 { font-size:16px; }
.principles p { font-size:14px; margin-top:4px; color:#bec4b9; }
.about-copy > .concept-note { font-size:12px; margin-top:38px; }
.faq-layout { display:grid; grid-template-columns:.75fr 1.8fr; gap:90px; }
.faq-layout h2 { margin-top:32px; }
.faq-list { border-top:1px solid var(--line); }
details { border-bottom:1px solid var(--line); }
summary { padding-block:24px; display:flex; align-items:center; justify-content:space-between; gap:24px; font-size:17px; cursor:pointer; list-style:none; }
summary::-webkit-details-marker { display:none; }
summary > span { position:relative; flex:0 0 14px; height:14px; }
summary > span::before,summary > span::after { content:""; position:absolute; background:var(--blue); }
summary > span::before { height:1px; width:14px; top:6px; }
summary > span::after { width:1px; height:14px; left:6px; transition:transform .2s; }
details[open] summary > span::after { transform:rotate(90deg); }
details p { padding:0 38px 24px 0; color:var(--muted); }
.contact-section { background:var(--soft); padding-block:88px; border-top:1px solid var(--line); }
.contact-grid { display:grid; grid-template-columns:1.15fr 1fr; gap:100px; }
.contact-grid h2 { margin-top:38px; }
.contact-grid .lede { max-width:420px; font-size:16px; }
.conversation-note { margin-top:35px; padding-top:20px; border-top:1px solid var(--line); max-width:320px; }
.conversation-note > span { color:var(--blue); font-size:12px; }
.conversation-note p { margin-top:8px; font-size:14px; color:var(--muted); }
.contact-form { align-self:center; padding-top:3px; }
fieldset { border:0; padding:0; margin:0; min-width:0; }
fieldset[disabled] { opacity:.6; }
.form-heading { font:28px/1.2 var(--serif); letter-spacing:-.03em; }
.form-note { font-size:12px; color:var(--muted); margin-top:10px; margin-bottom:30px; }
.field { margin-top:22px; }
label { display:block; font-size:14px; margin-bottom:7px; }
input,textarea { display:block; width:100%; border:0; border-bottom:1px solid #7d8275; border-radius:0; color:var(--ink); background:transparent; padding:12px 0; min-height:48px; }
textarea { resize:vertical; min-height:106px; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:1; font-size:14px; }
.contact-form .button { margin-top:28px; width:100%; }
.form-status { margin-top:16px; color:var(--blue); font-size:14px; }
.form-status:empty { display:none; }
.site-footer { padding:45px 0; border-top:1px solid var(--line); }
.footer-row { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.footer-row p { font-size:12px; color:var(--muted); }
.footer-row p:last-child { text-align:right; }
@media (min-width:901px) and (prefers-reduced-motion:no-preference) {
  .hero-copy,.hero-portrait { animation:enter .65s ease-out both; }
  .hero-portrait { animation-delay:.12s; }
  @keyframes enter { from { transform:translateY(10px); } to { transform:none; } }
}
@media (max-width:1100px) {
  .shell { width:calc(100% - 72px); }
  .nav-row { gap:34px; } nav { gap:24px; }
  .hero { column-gap:38px; } h1 { font-size:7.5vw; }
  .hero-description { font-size:16px; } .desktop-break { display:none; }
  .hero-actions { gap:18px; flex-wrap:wrap; } .hero-fit { max-width:300px; }
}
@media (max-width:900px) {
  .nav-descriptor { display:none; }
  .hero { padding-top:50px; column-gap:35px; }
  .hero-portrait { padding-top:55px; }
  .hero-actions { gap:5px 18px; margin-top:24px; }
  .hero-description { max-width:340px; }
  .perspective { gap:35px; grid-template-columns:.75fr 1.8fr; }
  .section { padding-block:80px; } .footer-row { flex-wrap:wrap; }
  .section-heading,.about-grid,.faq-layout { gap:35px; }
  .service { gap:24px; grid-template-columns:.15fr .8fr 1fr; }
  .service h3 { font-size:36px; }
  .diagnostic { gap:45px; }
  .diagnostic-response { padding-left:35px; }
  .diagnostic-response h3 { font-size:32px; min-height:145px; }
  #diag-copy { min-height:153px; }
  .engagement-step { padding-inline:22px; }
  .contact-grid { gap:45px; }
}
@media (max-width:680px) {
  html { scroll-padding-top:86px; }
  .shell { width:calc(100% - 40px); }
  .concept-bar .shell { padding-block:8px; font-size:12px; letter-spacing:0; }
  .concept-bar .shell > span:last-child { display:none; }
  .nav-row { min-height:78px; gap:15px; } .wordmark { font-size:31px; }
  nav { gap:0; } nav a:not(.nav-contact) { display:none; }
  .nav-contact { min-width:83px; padding-block:10px; }
  .hero { display:flex; flex-direction:column; padding-top:39px; }
  .eyebrow { font-size:12px; letter-spacing:.04em; gap:10px; } .small-rule { width:20px; flex-shrink:0; }
  h1 { font-size:clamp(51px,13.4vw,84px); line-height:1; margin:25px 0; letter-spacing:-.05em; }
  .hero-description { font-size:16px; max-width:390px; }
  .hero-actions { margin-top:25px; gap:18px; }
  .button { min-height:52px; padding-inline:21px; } .text-link { font-size:14px; }
  .hero-fit { margin-top:16px; max-width:none; font-size:12px; }
  .hero-portrait { padding:0; margin:39px 14px 0 0; }
  .portrait-frame img { aspect-ratio:1 / 1.05; object-position:center 25%; }
  .portrait-index { right:-18px; font-size:12px; }
  .hero-portrait figcaption { padding:20px 22px; }
  .hero-footer { margin-top:28px; padding-block:18px; font-size:12px; flex-direction:column; gap:8px; }
  .section { padding-block:64px; } .perspective { display:block; }
  .section-label { margin-bottom:27px; font-size:12px; } .perspective .section-label { padding:0; }
  h2 { font-size:clamp(40px,10.7vw,60px); } .lede { font-size:16px; margin-top:23px; }
  .footer-row { align-items:flex-start; flex-direction:column; gap:23px; }
  .footer-row p:last-child { text-align:left; }
  .section-heading,.about-grid,.faq-layout,.contact-grid { display:block; }
  .section-heading { margin-bottom:38px; }
  .section-heading > .section-label { padding-top:0; }
  .service { grid-template-columns:34px 1fr; gap:13px; padding-block:27px; }
  .service h3 { font-size:36px; }
  .service h3 br { display:none; }
  .service > div { grid-column:2; }
  .service p { font-size:16px; }
  .service .service-output { font-size:12px; margin-top:15px; }
  .diagnostic-section,.about-section,.contact-section { padding-block:64px; }
  .diagnostic { display:block; }
  .diagnostic h2 { margin-top:0; }
  .diagnostic-intro { max-width:360px; }
  .diagnostic-tabs { max-width:none; }
  .diagnostic-response { margin-top:36px; padding:28px 0 0; border-left:0; border-top:1px solid #6e79df; }
  .diagnostic-response h3 { font-size:34px; min-height:116px; }
  #diag-copy { min-height:128px; }
  .engagement-heading { font-size:12px; flex-direction:column; gap:4px; }
  .engagement-grid { display:block; }
  .engagement-step,.engagement-step:first-child,.engagement-step:last-child { padding:27px 0; border-right:0; border-bottom:1px solid var(--line); }
  .engagement-step:last-child { border-bottom:0; }
  .step-top { justify-content:flex-start; gap:18px; }
  .step-top span:last-child { font-size:44px; }
  .engagement-step h3 { margin:16px 0; }
  .engagement-step .deliverable { margin-top:21px; }
  .about-monogram { display:none; }
  .about-identity > p:last-child { margin-bottom:30px; }
  .about-lede { font-size:20px; }
  .principles { gap:24px 18px; }
  .principles h3 { font-size:15px; }
  .principles p { font-size:14px; }
  .faq-layout h2 { margin:0 0 32px; }
  summary { font-size:16px; padding-block:21px; }
  details p { padding-right:10px; }
  .contact-grid h2 { margin-top:0; }
  .contact-form { margin-top:42px; border-top:1px solid var(--line); padding-top:32px; }
  .conversation-note { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
}
