:root {
  color-scheme: dark;
  --ink: #0b1013;
  --ink-soft: #152024;
  --paper: #edf0eb;
  --paper-line: #cbd2cc;
  --white: #f7f9f5;
  --muted: #aeb9b7;
  --lime: #d8f35f;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--ink); color: var(--white); font-family: "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid var(--lime); outline-offset: 5px; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
::selection { color: var(--ink); background: var(--lime); }
.shell { width: min(100% - 72px, 1440px); margin-inline: auto; }
.skip-link { position: absolute; z-index: 20; left: 16px; top: -80px; padding: 12px 18px; background: var(--lime); color: var(--ink); }
.skip-link:focus { top: 16px; }

.site-header { position: relative; z-index: 5; background: var(--ink); }
.header-inner { min-height: 94px; display: flex; align-items: center; gap: 40px; border-bottom: 1px solid rgba(255,255,255,.15); }
.brand { display: inline-flex; align-items: center; gap: 9px; flex: none; font-size: 25px; font-weight: 730; letter-spacing: -.065em; line-height: 1; }
.brand-mark { width: 35px; height: 35px; color: var(--lime); }
.brand-period { color: var(--lime); }
.primary-nav { display: flex; align-items: center; gap: 38px; margin-left: auto; }
.primary-nav a, .header-contact { font-size: 13px; font-weight: 600; letter-spacing: .01em; transition: color .2s ease; }
.primary-nav a { color: #ccd4d1; }
.primary-nav a:hover, .header-contact:hover { color: var(--lime); }
.header-contact { display: inline-flex; align-items: center; gap: 20px; padding: 14px 0 14px 34px; margin-left: 6px; border-left: 1px solid rgba(255,255,255,.2); }
.header-contact span { font-size: 21px; font-weight: 400; line-height: 1; }

.hero { overflow: hidden; background: radial-gradient(circle at 73% 32%, #1b2728 0, transparent 36%), var(--ink); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(0, .87fr); align-items: stretch; gap: clamp(20px, 4vw, 70px); min-height: 678px; }
.hero-copy { align-self: center; padding: 76px 0 90px; position: relative; z-index: 1; }
.eyebrow { display: flex; align-items: center; gap: 13px; color: var(--lime); font-size: 12px; font-weight: 700; letter-spacing: .21em; text-transform: uppercase; }
.signal-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 20px rgba(216,243,95,.6); }
.hero h1 { max-width: 760px; margin-top: 31px; font-size: clamp(64px, 6.65vw, 112px); font-weight: 570; letter-spacing: -.077em; line-height: .97; }
.hero h1 em, .approach-section h2 em { font-style: normal; color: var(--lime); }
.hero-description { max-width: 535px; margin-top: 35px; color: #c0cbc7; font-size: clamp(17px, 1.42vw, 20px); line-height: 1.53; letter-spacing: -.015em; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 29px; margin-top: 39px; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 58px; padding: 0 21px; font-size: 14px; font-weight: 700; letter-spacing: -.01em; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-3px); }
.button span { font-size: 22px; font-weight: 400; line-height: 1; }
.button-lime { background: var(--lime); color: var(--ink); min-width: 225px; }
.button-lime:hover { background: #e6fa8e; }
.text-link { display: inline-flex; align-items: center; gap: 16px; color: #dce4df; font-size: 14px; font-weight: 650; transition: color .2s ease; }
.text-link:hover { color: var(--lime); }
.text-link span { font-size: 20px; }
.hero-visual { align-self: stretch; min-height: 610px; position: relative; overflow: hidden; background: #171d1d; border-left: 1px solid rgba(255,255,255,.09); border-right: 1px solid rgba(255,255,255,.09); }
.hero-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(9,15,18,.08) 55%, rgba(9,15,18,.88) 100%); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.visual-caption { position: absolute; z-index: 1; left: 29px; right: 29px; bottom: 28px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #edf3e7; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.visual-caption span:first-child { color: var(--lime); }
.hero-footnote { display: flex; align-items: center; gap: 18px; height: 78px; color: #9da9a6; border-top: 1px solid rgba(255,255,255,.15); font-size: 10px; font-weight: 700; letter-spacing: .2em; }
.footnote-line { width: 26px; height: 1px; background: #687471; }

.intro-section { color: var(--ink); background: var(--paper); padding: 92px 0 119px; }
.section-kicker { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 11px; font-weight: 750; letter-spacing: .18em; line-height: 1.4; }
.section-kicker span:last-child { text-align: right; }
.intro-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 60px; margin: 89px 0 75px; }
.intro-heading-row h2 { flex: 1 1 55%; font-size: clamp(68px, 8.2vw, 128px); font-weight: 580; letter-spacing: -.085em; line-height: .89; }
.intro-heading-row h2 span { color: #70817b; }
.intro-heading-row p { flex: 1 1 33%; max-width: 425px; padding-bottom: 6px; color: #3d4e4b; font-size: clamp(18px, 1.55vw, 22px); line-height: 1.48; letter-spacing: -.025em; }
.capabilities { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #9eaaa4; border-bottom: 1px solid #9eaaa4; }
.capability { display: flex; flex-direction: column; min-height: 318px; padding: 30px 34px 34px 0; }
.capability + .capability { border-left: 1px solid var(--paper-line); padding-left: 34px; }
.capability-top { display: flex; align-items: flex-start; justify-content: space-between; color: #73857d; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.capability-glyph { font-size: 31px; color: #41514c; line-height: .8; font-weight: 400; }
.capability h3 { margin-top: auto; font-size: clamp(25px, 2.25vw, 34px); font-weight: 620; letter-spacing: -.05em; line-height: 1.1; }
.capability p { max-width: 330px; margin-top: 15px; color: #52615b; font-size: 16px; line-height: 1.48; }

.approach-section { background: var(--ink-soft); padding: 111px 0 130px; }
.approach-grid { display: grid; grid-template-columns: 1fr .78fr; gap: clamp(60px, 11vw, 175px); }
.section-kicker-dark { color: var(--lime); }
.approach-lead h2 { margin-top: 92px; font-size: clamp(58px, 6.6vw, 105px); font-weight: 560; letter-spacing: -.078em; line-height: .98; }
.approach-detail { padding-top: 122px; }
.approach-intro { max-width: 515px; color: #e0e7e2; font-size: clamp(21px, 2.1vw, 30px); line-height: 1.4; letter-spacing: -.035em; }
.approach-steps { margin-top: 77px; border-top: 1px solid rgba(255,255,255,.2); }
.approach-steps > div { display: flex; align-items: center; gap: 38px; min-height: 71px; border-bottom: 1px solid rgba(255,255,255,.2); }
.approach-steps span { color: var(--lime); font-size: 12px; font-weight: 700; letter-spacing: .13em; }
.approach-steps p { color: #d3ddd7; font-size: 16px; }

.contact-section { color: var(--ink); background: var(--lime); padding: 90px 0 85px; }
.contact-inner h2 { margin-top: 94px; font-size: clamp(63px, 9.2vw, 145px); font-weight: 580; letter-spacing: -.085em; line-height: .96; }
.contact-bottom { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-top: 94px; }
.contact-bottom p { max-width: 450px; font-size: clamp(20px, 2.3vw, 31px); line-height: 1.23; letter-spacing: -.04em; }
.button-dark { min-width: 202px; color: var(--white); background: var(--ink); }
.button-dark:hover { background: #25322e; }
.site-footer { background: var(--ink); }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 148px; }
.footer-inner p, .footer-inner > a:last-child { color: #aebbb5; font-size: 13px; }
.footer-inner > a:last-child:hover { color: var(--lime); }

@media (max-width: 1000px) {
  .shell { width: min(100% - 48px, 1440px); }
  .hero-grid { gap: 18px; min-height: 600px; }
  .hero-copy { padding: 60px 0; }
  .hero h1 { font-size: clamp(58px, 7.1vw, 78px); }
  .hero-visual { min-height: 550px; }
  .intro-heading-row { gap: 36px; }
  .intro-heading-row h2 { font-size: clamp(65px, 8vw, 92px); }
  .capability { padding-right: 20px; }
  .capability + .capability { padding-left: 20px; }
  .approach-grid { gap: 60px; }
}
@media (max-width: 720px) {
  .shell { width: min(100% - 36px, 600px); }
  .header-inner { min-height: 72px; }
  .brand { font-size: 23px; }
  .brand-mark { width: 32px; height: 32px; }
  .primary-nav { display: none; }
  .header-contact { margin-left: auto; padding-left: 18px; gap: 8px; font-size: 12px; }
  .hero-grid { display: flex; flex-direction: column; gap: 0; }
  .hero-copy { padding: 77px 0 66px; }
  .eyebrow { font-size: 10px; letter-spacing: .15em; }
  .hero h1 { margin-top: 25px; font-size: clamp(57px, 12vw, 86px); }
  .hero-description { margin-top: 26px; font-size: 18px; }
  .hero-actions { margin-top: 31px; gap: 24px; }
  .hero-visual { width: 100%; min-height: 0; height: min(114vw, 550px); border: 0; }
  .visual-caption { left: 20px; right: 20px; bottom: 20px; font-size: 9px; }
  .hero-footnote { height: 64px; font-size: 9px; gap: 13px; }
  .footnote-line { width: 17px; }
  .intro-section { padding: 67px 0 78px; }
  .section-kicker { font-size: 10px; }
  .section-kicker span:last-child { display: none; }
  .intro-heading-row { display: block; margin: 66px 0 54px; }
  .intro-heading-row h2 { font-size: clamp(68px, 13vw, 92px); }
  .intro-heading-row p { margin-top: 35px; font-size: 19px; }
  .capabilities { display: block; }
  .capability, .capability + .capability { min-height: 224px; padding: 23px 0 26px; border-left: 0; }
  .capability + .capability { border-top: 1px solid var(--paper-line); }
  .capability h3 { font-size: 30px; }
  .capability p { margin-top: 11px; }
  .approach-section { padding: 72px 0 85px; }
  .approach-grid { display: block; }
  .approach-lead h2 { margin-top: 63px; font-size: clamp(57px, 11vw, 83px); }
  .approach-detail { padding-top: 52px; }
  .approach-intro { font-size: 23px; }
  .approach-steps { margin-top: 50px; }
  .contact-section { padding: 70px 0 76px; }
  .contact-inner h2 { margin-top: 65px; font-size: clamp(59px, 11vw, 82px); }
  .contact-bottom { align-items: start; flex-direction: column; margin-top: 63px; }
  .contact-bottom p { font-size: 24px; }
  .footer-inner { min-height: 185px; flex-wrap: wrap; align-content: center; gap: 25px 20px; }
  .footer-inner .brand { width: 100%; }
}
@media (max-width: 390px) {
  .header-contact { padding-left: 12px; }
  .hero h1 { font-size: 54px; }
  .button-lime { min-width: 210px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .contact-inner h2 { font-size: 54px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
