@font-face{font-family:"Inter";src:url("fonts/Inter-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;}
@font-face{font-family:"Inter";src:url("fonts/Inter-SemiBold.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap;}
@font-face{font-family:"Inter";src:url("fonts/Inter-Bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;}
@font-face{font-family:"Inter";src:url("fonts/Inter-ExtraBold.woff2") format("woff2");font-style:normal;font-weight:800;font-display:swap;}
@font-face{
  font-family:"IBM Plex Mono";
  src:url("fonts/IBMPlexMono-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Mono";
  src:url("fonts/IBMPlexMono-Bold.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}


:root{
  --navy:#15282D;
  --paper:#F4F0E8;
  --petrol:#52686A;
  --copper:#985536;
  --line:#D8D4CB;
  --white:#FFFFFF;
  --max:1360px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--navy);
  font-family:Inter,Arial,sans-serif;line-height:1.5;font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;
}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit}
.shell{max-width:var(--max);margin:auto;padding:0 48px}
.mono{
  font-family:"IBM Plex Mono","Courier New",monospace;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase
}
.copper{color:var(--copper)}
.muted{color:var(--petrol)}
.rule{border-top:1px solid var(--line)}
.skip{
  position:absolute;left:-9999px;top:0;background:var(--navy);color:white;padding:12px 16px;z-index:99
}
.skip:focus{left:12px;top:12px}
nav{
  position:sticky;top:0;z-index:30;background:rgba(244,240,232,.96);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)
}
.nav{
  min-height:74px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:30px
}
.logo{font-size:29px;font-weight:800;text-decoration:none;letter-spacing:-.045em}
.logo span{color:var(--copper)}
.links{display:flex;gap:28px;align-items:center}
.links a{text-decoration:none;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.links .cta{border-bottom:1px solid var(--copper);padding-bottom:5px}
.hero{
  min-height:calc(100vh - 74px);display:grid;grid-template-columns:1.03fr .97fr;
  align-items:center;gap:66px;padding:74px 0 88px
}
.hero h1{
  font-size:clamp(70px,8.6vw,132px);line-height:.86;letter-spacing:-.07em;margin:17px 0 28px
}
.promise{
  font-size:clamp(31px,3.7vw,52px);line-height:1.06;letter-spacing:-.042em;
  max-width:850px;margin:0 0 28px;font-weight:400
}
.intro{font-size:18px;line-height:1.72;color:var(--petrol);max-width:700px}
.text-link{
  display:inline-flex;align-items:center;gap:18px;text-decoration:none;font-weight:700;
  margin-top:30px;padding-bottom:8px;border-bottom:2px solid var(--copper)
}
.hero-media{aspect-ratio:4/5;overflow:hidden;background:#ddd}
.hero-media img{transition:transform .8s ease}
.hero-media:hover img{transform:scale(1.015)}
section{padding:110px 0}
.grid{display:grid;grid-template-columns:220px 1fr;gap:72px}
.section-title{
  font-size:clamp(43px,5.2vw,78px);line-height:.97;letter-spacing:-.058em;
  margin:0 0 34px;max-width:980px
}
.copy{font-size:19px;line-height:1.75;color:var(--petrol);max-width:830px}
.problem-grid{
  display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:62px
}
.problem{min-height:230px;padding:28px 28px 28px 0;border-right:1px solid var(--line)}
.problem:not(:first-child){padding-left:28px}.problem:last-child{border-right:0}
.problem .nr{color:var(--copper);margin-bottom:38px}
.problem h3{font-size:24px;margin:0 0 12px;letter-spacing:-.028em}
.problem p{margin:0;color:var(--petrol)}
.feature{
  display:grid;grid-template-columns:1.08fr .92fr;min-height:620px
}
.feature.reverse{grid-template-columns:.92fr 1.08fr}
.feature.reverse .feature-copy{order:1;border-left:1px solid var(--line);border-right:0}
.feature.reverse .feature-media{order:2}
.feature-media{min-height:520px;overflow:hidden}
.feature-copy{
  padding:72px;border:1px solid var(--line);border-left:0;
  display:flex;flex-direction:column;justify-content:center
}
.feature-copy h2{font-size:clamp(42px,5vw,72px);line-height:1;letter-spacing:-.052em;margin:12px 0 28px}
.process{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line);margin-top:54px}
.step{min-height:230px;padding:24px 20px 24px 0;border-right:1px solid var(--line);position:relative}
.step:not(:first-child){padding-left:20px}.step:last-child{border-right:0}
.step:before{content:"";position:absolute;top:-4px;left:0;width:8px;height:8px;background:var(--copper)}
.step:not(:first-child):before{left:20px}
.step b{display:block;font-size:28px;margin-top:38px}.step p{font-size:14px;color:var(--petrol);margin-top:14px}
.services{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}
.service{min-height:250px;padding:38px 44px 44px 0;border-bottom:1px solid var(--line)}
.service:nth-child(odd){border-right:1px solid var(--line)}
.service:nth-child(even){padding-left:44px}
.service h3{font-size:30px;letter-spacing:-.035em;margin:22px 0 12px}
.service p{color:var(--petrol);max-width:480px}
.image-strip{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);margin-top:66px}
.image-strip figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--paper)}
.applications{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.application{padding:24px 20px 35px 0;border-right:1px solid var(--line)}
.application:not(:first-child){padding-left:20px}.application:last-child{border-right:0}
.application b{display:block;font-size:20px;margin-top:22px}
.application span{display:block;color:var(--petrol);font-size:14px;margin-top:6px}
.contact{background:var(--navy);color:var(--paper)}
.contact .shell{padding-top:100px;padding-bottom:100px}
.contact-grid{display:grid;grid-template-columns:220px 1fr;gap:72px}
.contact h2{
  font-size:clamp(54px,7.2vw,106px);line-height:.91;letter-spacing:-.064em;
  max-width:1050px;margin:0 0 30px
}
.contact p{font-size:18px;color:#CBD3D1;max-width:680px}
.contact .text-link{color:var(--paper)}
footer{background:var(--navy);color:var(--paper);border-top:1px solid rgba(244,240,232,.18)}
.footer{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px;padding-top:52px;padding-bottom:52px}
.footer-logo{font-size:43px;font-weight:800;letter-spacing:-.05em}.footer-logo span{color:var(--copper)}
.footer p,.footer a{font-size:14px;color:#CBD3D1;text-decoration:none}
.footer .mono{color:#91A09D}
.legal-pending{opacity:.6;pointer-events:none}
@media(max-width:980px){
  .shell{padding:0 24px}.links a:not(.cta){display:none}
  .hero,.grid,.feature,.feature.reverse,.contact-grid{grid-template-columns:1fr}
  .hero{gap:38px;padding-top:48px}.hero-media{aspect-ratio:16/10}
  .feature.reverse .feature-copy,.feature.reverse .feature-media{order:initial}
  .feature-copy,.feature.reverse .feature-copy{border:1px solid var(--line);padding:44px 28px}
  .problem-grid,.process,.applications{grid-template-columns:1fr 1fr}
  .problem,.step,.application{border-bottom:1px solid var(--line)}
  .services{grid-template-columns:1fr}.service{border-right:0!important;padding:34px 0!important}
  .footer{grid-template-columns:1fr}
}
@media(max-width:640px){
  section{padding:78px 0}
  .problem-grid,.process,.applications,.image-strip{grid-template-columns:1fr}
  .problem,.step,.application{border-right:0;padding:25px 0!important}
  .hero h1{font-size:68px}.promise{font-size:31px}
}

/* Responsive image wrappers */
picture{display:block;width:100%;height:100%}


/* Step 5 — accessibility and mobile UX */
:focus-visible{
  outline:3px solid currentColor;
  outline-offset:4px;
}
nav a:focus-visible,.text-link:focus-visible,footer a:focus-visible{
  border-radius:2px;
}
.links a{min-height:44px;display:inline-flex;align-items:center}
.skip:focus{left:12px;top:12px;outline:3px solid var(--copper);outline-offset:3px}
section[id]{scroll-margin-top:90px}
.hero-media img,.feature-media img,.image-strip img{transition:transform .8s ease}

.mobile-toggle{
  display:none;border:1px solid var(--navy);background:transparent;color:var(--navy);
  min-width:44px;min-height:44px;padding:8px 11px;font:700 11px/1 "IBM Plex Mono","Courier New",monospace;
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important
  }
  .hero-media:hover img{transform:none}
}

@media(max-width:980px){
  .nav{grid-template-columns:1fr auto;position:relative}
  .mobile-toggle{display:inline-flex;align-items:center;justify-content:center}
  .links{
    display:none;position:absolute;left:24px;right:24px;top:74px;
    background:var(--paper);border:1px solid var(--line);padding:12px;
    flex-direction:column;align-items:stretch;gap:0;box-shadow:0 14px 28px rgba(21,40,45,.12)
  }
  .links.is-open{display:flex}
  .links a,.links a:not(.cta){
    display:flex;min-height:48px;padding:10px 8px;align-items:center
  }
  .links .cta{margin-top:4px;border:1px solid var(--copper);padding:10px 12px}
}
@media(max-width:640px){
  .shell{padding-left:20px;padding-right:20px}
  .links{left:20px;right:20px}
  .mono{font-size:12px;letter-spacing:.13em}
  .intro,.copy{font-size:17px;line-height:1.65}
  .contact p{font-size:17px}
  .text-link{min-height:44px;align-items:center}
}


/* Step 6 — project intake and conversion */
.project-form{margin-top:52px;max-width:980px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px}
.field{display:flex;flex-direction:column;gap:9px}
.field-full{grid-column:1/-1}
.field label,.consent{
  font-size:12px;letter-spacing:.07em;text-transform:uppercase;font-weight:700
}
.optional{color:#9FADAA;font-weight:400;text-transform:none;letter-spacing:0}
.field input,.field select,.field textarea{
  width:100%;border:1px solid rgba(244,240,232,.34);border-radius:0;
  background:rgba(255,255,255,.04);color:var(--paper);
  padding:14px 15px;font:inherit;font-size:16px;line-height:1.4;
}
.field input,.field select{min-height:52px}
.field textarea{resize:vertical;min-height:170px}
.field select{appearance:auto}
.field select option{color:var(--navy);background:var(--paper)}
.field input::placeholder,.field textarea::placeholder{color:#9FADAA}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{
  outline:3px solid var(--copper);outline-offset:2px;border-color:transparent
}
.field-help{font-size:12px;color:#AEBAB7}
.consent{
  display:flex;gap:12px;align-items:flex-start;margin-top:28px;
  text-transform:none;letter-spacing:0;font-weight:400;color:#CBD3D1;max-width:760px
}
.consent input{width:18px;height:18px;min-width:18px;margin-top:2px;accent-color:var(--copper)}
.consent a{color:var(--paper);text-underline-offset:3px}
.form-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:30px}
.submit-button{
  border:0;background:var(--copper);color:var(--white);min-height:50px;
  padding:13px 20px;font:700 14px/1.2 Inter,Arial,sans-serif;cursor:pointer
}
.submit-button:hover{filter:brightness(.94)}
.submit-button:disabled{opacity:.55;cursor:wait}
.mail-fallback{font-size:13px;color:#CBD3D1;text-underline-offset:4px}
.form-status{min-height:24px;margin:18px 0 0;font-size:14px;color:#E9D9D0}
.form-status.is-error{color:#FFD0C2}
.form-status.is-success{color:#D5E9DE}
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.turnstile-slot{margin-top:24px}
@media(max-width:700px){
  .form-grid{grid-template-columns:1fr;gap:22px}
  .field-full{grid-column:auto}
  .project-form{margin-top:38px}
  .form-actions{align-items:stretch;flex-direction:column}
  .submit-button{width:100%}
  .mail-fallback{text-align:center}
}


/* Step 7 — credibility, proof structure and FAQ */
.proof-grid{
  display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin-top:58px
}
.proof-card{min-height:290px;padding:34px 42px 38px 0;border-bottom:1px solid var(--line)}
.proof-card:nth-child(odd){border-right:1px solid var(--line)}
.proof-card:nth-child(even){padding-left:42px}
.proof-card h3{font-size:29px;line-height:1.1;letter-spacing:-.035em;margin:24px 0 14px}
.proof-card p{margin:0;color:var(--petrol);max-width:520px}
.control-panel{
  display:grid;grid-template-columns:.85fr 1.15fr;border:1px solid var(--line);
  margin-top:66px;min-height:320px
}
.control-intro{padding:48px;display:flex;flex-direction:column;justify-content:center}
.control-intro h3{font-size:clamp(32px,3.5vw,52px);line-height:1;letter-spacing:-.045em;margin:14px 0 0}
.control-list{list-style:none;margin:0;padding:0;border-left:1px solid var(--line)}
.control-list li{
  display:grid;grid-template-columns:58px 1fr;align-items:center;gap:14px;
  min-height:54px;padding:12px 24px;border-bottom:1px solid var(--line)
}
.control-list li:last-child{border-bottom:0}
.control-list .mono{color:var(--copper)}
.control-list li span:last-child{font-weight:600}
.faq-list{border-top:1px solid var(--line);margin-top:54px}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{
  list-style:none;cursor:pointer;position:relative;padding:28px 56px 28px 0;
  font-size:22px;font-weight:700;letter-spacing:-.02em
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{
  content:"+";position:absolute;right:8px;top:50%;transform:translateY(-50%);
  font:400 26px/1 "IBM Plex Mono","Courier New",monospace;color:var(--copper)
}
.faq-list details[open] summary::after{content:"−"}
.faq-list details p{
  max-width:830px;margin:-4px 0 30px;color:var(--petrol);font-size:17px;line-height:1.7
}
.faq-list summary:focus-visible{outline:3px solid var(--copper);outline-offset:5px}

@media(max-width:980px){
  .proof-grid{grid-template-columns:1fr}
  .proof-card,.proof-card:nth-child(even){
    padding:32px 0!important;border-right:0!important;min-height:0
  }
  .control-panel{grid-template-columns:1fr}
  .control-list{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:640px){
  .control-intro{padding:34px 24px}
  .control-list li{padding:12px 18px;grid-template-columns:44px 1fr}
  .faq-list summary{font-size:19px;padding-top:24px;padding-bottom:24px}
}


/* Step 8 — service detail pages */
.service-link{display:inline-flex;margin-top:18px;font-size:13px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--copper);padding-bottom:4px}
.detail-hero{padding:96px 0 88px;border-bottom:1px solid var(--line)}
.detail-hero .eyebrow{margin-bottom:20px}
.detail-hero h1{font-size:clamp(54px,7.2vw,104px);line-height:.92;letter-spacing:-.06em;margin:0 0 28px;max-width:1100px}
.detail-hero .lead{font-size:clamp(22px,2.2vw,31px);line-height:1.35;letter-spacing:-.025em;max-width:900px;margin:0;color:var(--petrol)}
.detail-layout{display:grid;grid-template-columns:220px 1fr;gap:72px}
.detail-copy{max-width:900px}
.detail-copy h2{font-size:clamp(38px,4.4vw,64px);line-height:1;letter-spacing:-.045em;margin:0 0 28px}
.detail-copy p{font-size:18px;line-height:1.75;color:var(--petrol)}
.detail-points{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:52px}
.detail-point{padding:28px 26px 32px 0;border-right:1px solid var(--line)}
.detail-point:not(:first-child){padding-left:26px}.detail-point:last-child{border-right:0}
.detail-point h3{font-size:22px;margin:18px 0 10px}.detail-point p{font-size:15px;line-height:1.6;margin:0}
.related-services{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}
.related-services a{padding:24px 28px 24px 0;border-bottom:1px solid var(--line);text-decoration:none;font-weight:700}
.related-services a:nth-child(even){padding-left:28px}
.detail-cta{background:var(--navy);color:var(--paper);padding:80px 0}.detail-cta h2{font-size:clamp(42px,5vw,72px);line-height:1;letter-spacing:-.05em;margin:0 0 22px;max-width:900px}.detail-cta p{color:#CBD3D1;max-width:720px;font-size:18px}
@media(max-width:980px){.detail-layout{grid-template-columns:1fr}.detail-points{grid-template-columns:1fr}.detail-point,.detail-point:not(:first-child){padding:26px 0;border-right:0;border-bottom:1px solid var(--line)}.related-services{grid-template-columns:1fr}.related-services a,.related-services a:nth-child(even){padding:22px 0}}

.company-id{margin-top:18px;font-size:12px!important;line-height:1.6;color:#91A09D!important}