:root {
  --dark:#101d2c;
  --lime:#c9ee78;
  --muted:#64717c
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  font:16px/1.6 system-ui,-apple-system,Segoe UI,sans-serif;
  color:#18283a;
  background:#f7f8f5
}
a {
  color:inherit
}
.wrap {
  max-width:1120px;
  margin:auto;
  padding:0 28px
}
.dark {
  background:var(--dark);
  color:white
}
.nav {
  height:82px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid #ffffff28
}
.brand {
  font-size:29px;
  font-weight:900;
  letter-spacing:-2px;
  text-decoration:none
}
.brand span {
  color:var(--lime)
}
.navlinks {
  display:flex;
  align-items:center;
  gap:30px
}
.navlinks a {
  text-decoration:none;
  font-size:14px
}
.button {
  display:inline-block;
  padding:15px 23px;
  border-radius:5px;
  background:var(--lime);
  color:var(--dark);
  font-weight:800;
  text-decoration:none;
  border:0;
  cursor:pointer
}
.button:hover {
  filter:brightness(1.08)
}
.button.outline {
  background:transparent;
  color:white;
  border:1px solid #ffffff75
}
.button.small {
  padding:10px 17px
}
.hero {
  display:grid;
  grid-template-columns:1.4fr .7fr;
  gap:70px;
  align-items:center;
  padding-top:110px;
  padding-bottom:115px
}
.eyebrow {
  color:var(--lime);
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase
}
.hero h1 {
  font-size:clamp(46px,5.6vw,75px);
  letter-spacing:-3.5px;
  line-height:1.08;
  margin:20px 0 26px
}
.hero h1 em {
  font-style:normal;
  color:var(--lime)
}
.lead {
  font-size:19px;
  color:#c8d2dd;
  max-width:660px
}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:13px;
  margin-top:32px
}
.micro {
  font-size:12px;
  color:#a8b5c3;
  margin-top:20px
}
.aside {
  border:1px solid #ffffff35;
  border-radius:8px;
  padding:32px;
  background:#ffffff09
}
.aside h2 {
  font-size:27px;
  line-height:1.25
}
.aside p {
  border-top:1px solid #ffffff2d;
  padding-top:14px;
  color:#d6e0e9
}
.aside b {
  color:var(--lime);
  margin-right:13px
}
.section {
  padding:100px 0
}
.white {
  background:white
}
.kicker {
  font-size:12px;
  letter-spacing:2px;
  font-weight:800;
  text-transform:uppercase;
  color:#63862c
}
h2 {
  font-size:clamp(34px,4vw,52px);
  line-height:1.14;
  letter-spacing:-2px;
  margin:17px 0 22px;
  max-width:760px
}
.intro {
  font-size:18px;
  color:var(--muted);
  max-width:740px
}
.grid3 {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:42px
}
.tile {
  border:1px solid #e0e5e6;
  padding:28px;
  border-radius:8px
}
.tile h3 {
  font-size:19px;
  margin:0 0 12px
}
.tile p {
  color:var(--muted);
  margin:0
}
.proofgrid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:34px
}
.proof {
  padding:22px;
  border:1px solid #e0e5e6;
  border-radius:8px;
  background:#fff
}
.proof strong {
  font-size:31px;
  letter-spacing:-1px;
  display:block;
  color:#17283a
}
.proof span {
  font-size:13px;
  color:#53616d;
  display:block;
  margin-top:6px
}
.method {
  margin-top:25px;
  padding:24px 28px;
  border-left:4px solid #91b84e;
  background:#fff
}
.method p {
  margin:8px 0 0;
  color:#53616d
}
.deliverable {
  margin-top:20px;
  padding:17px 20px;
  background:#fff;
  border-radius:6px;
  font-size:14px
}
.deliverable b {
  display:block;
  margin-bottom:5px
}
.grid2 {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  margin-top:44px
}
.step {
  padding:38px;
  background:#edf1e9;
  border-radius:8px
}
.step small {
  font-weight:800;
  color:#648337;
  letter-spacing:1.5px
}
.step h3 {
  font-size:30px;
  letter-spacing:-1px;
  margin:16px 0
}
.step p,.step li {
  color:#53616d
}
.step li {
  margin:8px 0
}
.about {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center
}
.quote {
  border:1px solid #ffffff30;
  background:#ffffff0b;
  padding:40px;
  border-radius:8px
}
.quote strong {
  font-size:clamp(28px,3vw,40px);
  line-height:1.25;
  display:block;
  letter-spacing:-1px
}
.quote strong span {
  color:var(--lime)
}
.quote p,.about p {
  color:#c6d0dc
}
.about .eyebrow {
  color:var(--lime)
}
.highlight {
  color:var(--lime)!important;
  font-weight:800
}
.band {
  background:#d6eea2;
  padding:65px 0
}
.band .inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}
.band h2 {
  margin:0 0 10px;
  font-size:39px
}
.band p {
  margin:0
}
.band .button {
  background:var(--dark);
  color:white;
  white-space:nowrap
}
.contact {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}
.form {
  border:1px solid #e0e5e6;
  border-radius:8px;
  padding:30px
}
.field {
  margin-bottom:16px
}
.field label {
  display:block;
  font-size:13px;
  font-weight:750;
  margin-bottom:7px
}
.field input,.field textarea {
  font:inherit;
  width:100%;
  border:1px solid #cbd2d6;
  border-radius:4px;
  padding:12px
}
.field input:focus,.field textarea:focus {
  outline:2px solid #89a94d
}
.form .button {
  width:100%
}
.note {
  font-size:12px;
  color:var(--muted)
}
footer {
  padding:30px 0;
  background:var(--dark);
  color:#c4cfd8;
  font-size:13px
}
footer .wrap {
  display:flex;
  justify-content:space-between;
  gap:20px
}
@media(max-width:800px) {
  .hero,.about,.contact {
    grid-template-columns:1fr;
    gap:35px
  }
  .hero {
    padding-top:75px;
    padding-bottom:80px
  }
  .grid3,.grid2,.proofgrid {
    grid-template-columns:1fr
  }
  .section {
    padding:70px 0
  }
  .band .inner {
    flex-direction:column;
    align-items:flex-start
  }
  .navlinks>a:not(.button) {
    display:none
  }
  .aside {
    display:none
  }
}
@media(max-width:450px) {
  .wrap {
    padding:0 20px
  }
  .hero h1 {
    font-size:46px;
    letter-spacing:-2.4px
  }
  .actions .button {
    width:100%;
    text-align:center
  }
  .step {
    padding:25px
  }
  footer .wrap {
    flex-direction:column
  }
  .band .button {
    white-space:normal
  }
}
.capability-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:36px
}
.capability {
  border:1px solid #e0e5e6;
  border-radius:8px;
  padding:24px;
  background:#fff
}
.capability strong {
  display:block;
  font-size:36px;
  letter-spacing:-1.5px;
  line-height:1.1;
  color:#18283a
}
.capability span {
  display:block;
  margin-top:10px;
  font-size:14px;
  line-height:1.45;
  color:#53616d
}
.experience-foot {
  margin-top:26px;
  max-width:820px;
  color:#53616d
}
.about-with-photo {
  grid-template-columns:.85fr 1.15fr;
  gap:70px
}
.portrait-wrap {
  position:relative;
  border-radius:10px;
  overflow:hidden;
  background:#273b48;
  align-self:start;
  min-height:0
}
.portrait-wrap img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2/3;
  object-fit:contain;
  object-position:center
}
.portrait-caption {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:52px 24px 22px;
  background:linear-gradient(transparent,#101d2ce8);
  font-weight:800;
  font-size:20px
}
.portrait-caption span {
  display:block;
  font-size:13px;
  font-weight:500;
  color:#d7e2e9
}
.personal-promise {
  border-left:3px solid var(--lime);
  padding:12px 0 12px 20px;
  margin:24px 0 28px
}
.personal-promise strong,.personal-promise span {
  display:block
}
.personal-promise span {
  font-size:14px;
  color:#c6d0dc;
  margin-top:6px
}
@media(max-width:800px) {
  .capability-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .about-with-photo {
    grid-template-columns:1fr
  }
  .portrait-wrap {
    min-height:0;
    max-width:480px;
    width:100%
  }
}
@media(max-width:450px) {
  .capability-grid {
    gap:10px
  }
  .capability {
    padding:17px
  }
  .capability strong {
    font-size:30px
  }
  .portrait-wrap {
    min-height:0
  }
}
.experience-stories {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:38px
}
.experience-story {
  border:1px solid #e0e5e6;
  border-radius:8px;
  padding:27px 28px;
  background:#fbfcfa
}
.experience-story h3 {
  font-size:21px;
  line-height:1.3;
  margin:0 0 12px;
  letter-spacing:-.45px
}
.experience-story p {
  color:#53616d;
  margin:0
}
.experience-close {
  margin:28px 0 0;
  padding:22px 26px;
  border-left:4px solid #91b84e;
  background:#edf1e9;
  color:#354554;
  font-size:17px
}
@media(max-width:800px) {
  .experience-stories {
    grid-template-columns:1fr
  }
  .experience-story {
    padding:24px
  }
}
/* V6 layout audit: one horizontal rhythm across all sections */ :root {
  --page-gutter:clamp(20px,4vw,40px);
  --section-space:clamp(64px,8vw,104px)
}
.wrap {
  width:100%;
  max-width:1120px;
  margin-inline:auto;
  padding-inline:var(--page-gutter)
}
.section {
  padding-block:var(--section-space)
}
.hero {
  padding-block:clamp(72px,9vw,112px)
}
.hero,.about,.contact {
  min-width:0
}
.hero>*,.about>*,.contact>* {
  min-width:0
}
.grid2,.grid3,.experience-stories {
  align-items:stretch
}
.step,.tile,.experience-story {
  height:100%
}
.step {
  display:flex;
  flex-direction:column
}
.step .deliverable {
  margin-top:auto
}
.step ul {
  padding-left:22px;
  margin-bottom:24px
}
.step li {
  padding-left:3px
}
.portrait-wrap {
  border-radius:10px;
  overflow:hidden;
  background:#263849;
  min-width:0;
  align-self:center
}
.portrait-wrap img {
  width:100%;
  height:auto;
  aspect-ratio:2/3;
  object-fit:contain;
  object-position:center;
  display:block
}
.about-with-photo {
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(32px,6vw,70px)
}
.about-with-photo h2 {
  max-width:620px
}
.about-with-photo p {
  max-width:640px
}
.experience-story h3 {
  max-width:26ch
}
.experience-story p {
  max-width:65ch
}
.band .inner>* {
  min-width:0
}
@media(max-width:800px) {
  .about-with-photo {
    grid-template-columns:1fr
  }
  .portrait-wrap {
    max-width:430px;
    justify-self:center
  }
  .hero {
    padding-block:72px
  }
  .section {
    padding-block:68px
  }
}
@media(max-width:450px) {
  .wrap {
    padding-inline:20px
  }
  .hero h1 {
    font-size:clamp(39px,11vw,46px)
  }
  .about-with-photo {
    gap:30px
  }
  .step {
    padding:24px
  }
  .experience-story {
    padding:22px
  }
}
/* V8 launch refinements */ html {
  scroll-padding-top:24px
}
body {
  overflow-x:hidden
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:3px solid #86a93d;
  outline-offset:3px
}
.linkedin-link {
  display:inline-block;
  margin:18px 0 0 16px;
  color:#c9ee78;
  text-underline-offset:4px;
  font-weight:650
}
.field select {
  font:inherit;
  width:100%;
  border:1px solid #cbd2d6;
  border-radius:4px;
  padding:12px;
  background:#fff;
  color:#18283a
}
.hp-field {
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden
}
.form button:disabled {
  opacity:.6;
  cursor:wait
}
.note a {
  text-decoration:underline
}
.navlinks a:hover,footer a:hover {
  text-decoration:underline
}
.portrait-wrap img {
  max-height:640px;
  object-fit:contain
}
.experience-story,.step,.tile {
  min-width:0
}
@media(max-width:800px) {
  .linkedin-link {
    display:block;
    margin:18px 0 0
  }
  .nav {
    height:72px
  }
  .hero h1 {
    overflow-wrap:break-word
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
}

/* V10 launch package: consistent spacing, accessible navigation, unclipped portrait. */
:root { --content-width: 1120px; }
.wrap { max-width: var(--content-width); width: 100%; margin-inline: auto; padding-inline: clamp(20px, 4vw, 32px); }
.nav { gap: 24px; }
.section { padding-block: clamp(64px, 8vw, 104px); }
.experience-stories { align-items: stretch; }
.experience-story { height: 100%; }
.about-with-photo { align-items: start; }
.portrait-wrap { margin: 0; overflow: hidden; border-radius: 10px; background: #273b48; }
.portrait-wrap img { width: 100%; height: auto; max-height: none; object-fit: contain; aspect-ratio: 2 / 3; }
.portrait-caption { position: static; padding: 15px 20px 18px; background: #263849; font-size: 18px; line-height: 1.3; }
.portrait-caption span { margin-top: 6px; }
.skip-link { position: absolute; left: -9999px; top: 10px; z-index: 100; background: var(--lime); color: #101d2c; padding: 10px 16px; }
.skip-link:focus { left: 12px; }
.button:focus-visible { outline-color: #c9ee78; outline-offset: 4px; }
#status { min-height: 1.5em; }
.form .note { line-height: 1.6; }
footer .wrap { align-items: center; flex-wrap: wrap; }
footer a { text-underline-offset: 3px; }
@media (max-width: 900px) { .about-with-photo { gap: 36px; } }
@media (max-width: 800px) { .hero { gap: 28px; } .navlinks { gap: 12px; } footer .wrap { align-items: flex-start; } }
@media (max-width: 450px) { .brand { font-size: 26px; } .navlinks .button { font-size: 12px; padding: 10px 12px; } .portrait-caption { font-size: 16px; } }

/* V11 mobile polish: one left edge, readable heading tracking, no logo wrap. */
.brand { white-space: nowrap; flex-shrink: 0; line-height: 1; display: inline-flex; align-items: baseline; }
.brand span { margin-left: 1px; }
@media (max-width: 600px) {
  .nav { height: 68px; gap: 12px; }
  .brand { font-size: 28px; letter-spacing: -1.5px; }
  .navlinks .button { font-size: 12.5px; padding: 11px 14px; white-space: nowrap; }
  .hero { padding-block: 56px 64px; gap: 24px; }
  .hero h1 { letter-spacing: -1px; line-height: 1.12; margin: 16px 0 20px; }
  .eyebrow { letter-spacing: 1.4px; line-height: 1.6; }
  .lead { font-size: 17px; }
  h1, h2 { text-wrap: balance; }
  h2 { letter-spacing: -.5px; line-height: 1.15; margin: 14px 0 18px; }
  .intro { font-size: 17px; }
  .section { padding-block: 56px; }
  .grid3, .grid2, .experience-stories, .proofgrid { margin-top: 30px; gap: 14px; }
  .tile, .experience-story, .quote { padding: 22px; }
  .step { padding: 22px; }
  .step h3 { font-size: 26px; line-height: 1.2; letter-spacing: -.6px; margin: 12px 0; }
  .step ul { padding-left: 20px; margin-block: 14px 20px; }
  .method, .experience-close { padding: 18px 20px; font-size: 16px; }
  .deliverable { padding: 14px 16px; }
  .experience-story h3 { max-width: none; }
  .band { padding: 48px 0; }
  .band .inner { gap: 22px; }
  .band h2 { font-size: 30px; margin: 0 0 10px; }
  .band .button, .contact > div > .button { width: 100%; text-align: center; white-space: normal; }
  .contact { gap: 32px; }
  .form { padding: 22px 18px; }
  .field { margin-bottom: 14px; }
  .field input, .field textarea, .field select { font-size: 16px; }
  .portrait-wrap { max-width: none; width: 100%; }
  .linkedin-link { margin-top: 20px; }
  footer { padding: 28px 0; }
  footer .wrap { flex-direction: column; align-items: flex-start; gap: 10px; }
}
@media (max-width: 360px) {
  .brand { font-size: 25px; }
  .navlinks .button { font-size: 11.5px; padding: 10px 10px; }
}

/* V12 logo image */
.brand { display: inline-flex; align-items: center; }
.brand img { display: block; height: 34px; width: auto; }
.footer-logo { display: block; width: 210px; height: auto; margin-bottom: 12px; }
@media (max-width: 600px) { .brand img { height: 28px; } }
@media (max-width: 360px) { .brand img { height: 25px; } }

/* V13 header lockup with tagline */
.nav { height: 86px; }
.brand img { height: 60px; width: auto; }
.cta-short { display: none; }
@media (max-width: 800px) { .nav { height: 76px; } .brand img { height: 50px; } }
@media (max-width: 600px) {
  .nav { height: 72px; }
  .brand img { height: 46px; }
  .cta-long { display: none; }
  .cta-short { display: inline; }
}
@media (max-width: 360px) { .brand img { height: 42px; } }