@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=Inter:wght@400;500;600&display=swap");

:root {
  --ink: #151614;
  --paper: #eeece5;
  --muted: #73766f;
  --dark: #141615;
  --dark-muted: #858a82;
  --line-light: rgba(21, 22, 20, .17);
  --line-dark: rgba(238, 236, 229, .18);
  --accent: #d59a61;
  --display: "Inter Tight", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --body: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --header-height: 76px;
  --scroll-progress: 0%;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--dark); color: var(--paper); font-family: var(--body); font-synthesis: none; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.site-shell { overflow: clip; }
.container { width: min(1200px, calc(100% - 80px)); margin: 0 auto; }
.section-dark { background: var(--dark); color: var(--paper); }
.section-light { background: var(--paper); color: var(--ink); }
section { scroll-margin-top: 28px; }

.site-header { position: fixed; z-index: 20; top: 0; left: 0; width: 100%; height: var(--header-height); display: flex; align-items: center; justify-content: space-between; padding: 0 40px; border-bottom: 1px solid transparent; transition: background .35s ease, border-color .35s ease; }
.site-header::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 1px; background: linear-gradient(90deg, var(--accent) var(--scroll-progress), transparent var(--scroll-progress)); content: ""; }
.site-header.is-scrolled { background: rgba(20, 22, 21, .94); border-color: var(--line-dark); backdrop-filter: blur(15px); }
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand-mark { position: relative; display: block; width: 24px; height: 24px; border: 1px solid currentColor; border-radius: 50%; transition: transform .35s ease, color .25s ease; }
.brand-mark::before, .brand-mark::after { position: absolute; background: currentColor; content: ""; }
.brand-mark::before { width: 1px; height: 100%; left: 50%; top: 0; }.brand-mark::after { width: 100%; height: 1px; left: 0; top: 50%; }
.brand:hover .brand-mark { color: var(--accent); transform: rotate(45deg); }
.brand-copy { display: grid; gap: 4px; line-height: 1; letter-spacing: .12em; }.brand-copy strong { font-size: 12px; font-weight: 600; }.brand-copy span { color: var(--dark-muted); font-size: 8px; letter-spacing: .18em; }
.site-nav { display: flex; align-items: center; gap: 29px; font-size: 11px; }.site-nav > a { color: rgba(238,236,229,.7); transition: color .2s ease; }.site-nav > a:hover { color: var(--paper); }.site-nav .nav-cta { color: var(--paper); padding: 11px 15px; border: 1px solid var(--line-dark); }.site-nav .nav-cta span { color: var(--accent); margin-left: 11px; }.locale-switch { display: inline-flex; align-items: center; gap: 7px; margin-left: -9px; color: var(--dark-muted); font-size: 10px; letter-spacing: .1em; }.locale-option { padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; font-size: inherit; letter-spacing: inherit; transition: color .2s ease; }.locale-option:hover, .locale-option.is-active { color: var(--paper); }.locale-divider { color: rgba(238,236,229,.3); }
.menu-toggle { display: none; }

.hero { position: relative; min-height: 100svh; display: flex; align-items: center; isolation: isolate; overflow: hidden; }.hero-media { position: absolute; inset: 0; background: url("https://images.unsplash.com/photo-1558494949-ef010cbdcc31?auto=format&fit=crop&w=2400&q=88") center/cover; filter: grayscale(.12) saturate(.72) contrast(1.08); transform: scale(1.03); animation: hero-breathe 18s ease-in-out infinite alternate; }.hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,22,21,.97) 0%, rgba(20,22,21,.9) 39%, rgba(20,22,21,.38) 100%); }
.hero-content { position: relative; z-index: 1; padding-top: 105px; }.eyebrow { margin: 0 0 19px; color: var(--accent); font-size: 10px; font-weight: 600; letter-spacing: .14em; line-height: 1.3; text-transform: uppercase; }.hero h1 { max-width: 950px; margin: 0; color: var(--paper); font-family: var(--display); font-size: clamp(48px, 6.8vw, 98px); font-weight: 400; letter-spacing: -.055em; line-height: .94; text-wrap: balance; }.hero em, h2 em { color: var(--accent); font-family: var(--display); font-style: normal; font-weight: 500; }.hero-lede { max-width: 455px; margin: 34px 0 0; color: rgba(238,236,229,.72); font-size: 14px; line-height: 1.65; }.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 38px; }.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 14px 16px; border: 1px solid transparent; font-size: 11px; transition: transform .25s ease, background .25s ease; }.button:hover { transform: translateY(-3px); }.button > span { font-size: 16px; }.button > span:last-child, .text-link > span:last-child { color: var(--accent); }.button-primary { min-width: 205px; background: var(--accent); color: var(--ink); }.button-primary:hover { background: var(--paper); }.button-primary > span, .button-primary > span:last-child { color: var(--ink); }.text-link { display: inline-flex; align-items: center; gap: 12px; color: rgba(238,236,229,.76); font-size: 10px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }.text-link:hover { color: var(--paper); }
.hero-footer { position: absolute; z-index: 1; right: 0; bottom: 29px; left: 0; display: grid; grid-template-columns: 1fr 1fr 1fr; color: rgba(238,236,229,.54); font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }.hero-footer span:nth-child(2) { text-align: center; }.hero-footer span:last-child { text-align: right; }

.about, .workflow, .platform { padding: 145px 0 155px; }.split-section { display: grid; grid-template-columns: 1fr 1.8fr; gap: 52px; align-items: start; }.section-index { color: var(--accent); font-size: 10px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }.section-light .section-index { color: #9b6d42; }.about-copy { max-width: 760px; }.about-copy h2, .architecture-copy h2, .workflow-copy h2, .infrastructure-copy h2, .platform-copy h2, .contact-copy h2 { max-width: 720px; margin: 0; font-family: var(--display); font-size: clamp(42px, 4.5vw, 64px); font-weight: 400; letter-spacing: -.05em; line-height: .98; text-wrap: balance; }.body-copy { max-width: 500px; margin: 29px 0 0; color: var(--muted); font-size: 14px; line-height: 1.7; }.section-dark .body-copy { color: var(--dark-muted); }
.system-lines { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 105px; border-top: 1px solid var(--line-light); }.system-lines > div { position: relative; min-height: 165px; padding: 19px 25px 18px 0; border-right: 1px solid var(--line-light); }.system-lines > div:not(:first-child) { padding-left: 25px; }.system-lines > div:last-child { border-right: 0; }.system-lines span { display: block; margin-bottom: 35px; color: #9b6d42; font-size: 10px; font-weight: 600; }.system-lines strong { display: block; font-family: var(--display); font-size: 28px; font-weight: 500; letter-spacing: -.035em; }.system-lines p { max-width: 220px; margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.system-lines b { position: absolute; right: 22px; top: 20px; color: #9b6d42; font-size: 18px; font-weight: 400; }

.architecture { padding: 145px 0 155px; }.architecture-copy { max-width: 760px; }.architecture-copy h2 { color: var(--paper); }.system-flow { display: grid; grid-template-columns: 1fr 80px 1fr 80px 1fr; align-items: center; margin-top: 105px; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }.flow-step { min-height: 232px; padding: 22px 25px 25px 0; }.flow-step:nth-of-type(3), .flow-step:nth-of-type(5) { padding-left: 25px; }.flow-step span { display: block; margin-bottom: 68px; color: var(--accent); font-size: 10px; font-weight: 600; }.flow-step h3 { margin: 0; font-family: var(--display); font-size: 28px; font-weight: 500; letter-spacing: -.04em; }.flow-step p { max-width: 190px; margin: 10px 0 0; color: var(--dark-muted); font-size: 11px; line-height: 1.5; }.flow-step-emphasis { background: rgba(213,154,97,.11); }.flow-step-emphasis h3 { color: var(--accent); }.flow-rule { position: relative; height: 1px; background: var(--line-dark); }.flow-rule::after { position: absolute; right: -1px; top: 50%; width: 7px; height: 7px; border-top: 1px solid var(--accent); border-right: 1px solid var(--accent); content: ""; transform: translateY(-50%) rotate(45deg); }

.workflow { background: #e7e4dc; }.workflow-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 88px; align-items: center; }.workflow-image { min-height: 560px; background: url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=1300&q=86") center/cover; filter: grayscale(.25) saturate(.65); }.workflow-copy h2 { margin-top: 47px; }.method-list { display: grid; gap: 0; max-width: 480px; margin: 47px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line-light); }.method-list li { display: grid; grid-template-columns: 42px 1fr; gap: 15px; padding: 17px 0; border-bottom: 1px solid var(--line-light); }.method-list span { color: #9b6d42; font-size: 10px; font-weight: 600; }.method-list strong, .method-list small { display: block; }.method-list strong { font-size: 12px; font-weight: 600; }.method-list small { margin-top: 4px; color: var(--muted); font-size: 11px; }

.infrastructure { padding: 145px 0 155px; }.infrastructure-copy h2 { color: var(--paper); }.layer-layout { display: grid; grid-template-columns: .92fr 1.08fr; margin-top: 93px; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }.layer-list { border-right: 1px solid var(--line-dark); }.layer-item { position: relative; display: grid; grid-template-columns: 43px 1fr 20px; gap: 12px; align-items: center; width: 100%; min-height: 82px; padding: 16px 22px 16px 0; border: 0; border-bottom: 1px solid var(--line-dark); background: transparent; color: rgba(238,236,229,.57); cursor: pointer; text-align: left; transition: padding .25s ease, color .25s ease, background .25s ease; }.layer-item:last-child { border-bottom: 0; }.layer-item span, .layer-item b { color: var(--accent); font-size: 10px; font-weight: 600; }.layer-item b { font-size: 16px; font-weight: 400; }.layer-item strong { font-size: 12px; font-weight: 500; }.layer-item:hover, .layer-item.is-active { padding-left: 14px; background: rgba(213,154,97,.11); color: var(--paper); }.layer-detail { display: grid; grid-template-columns: 125px 1fr; gap: 30px; min-height: 410px; padding: 41px 48px; align-items: start; }.layer-number { color: var(--accent); font-family: var(--display); font-size: 86px; font-weight: 400; line-height: .78; letter-spacing: -.08em; }.layer-detail h3 { max-width: 420px; margin: 0; color: var(--paper); font-family: var(--display); font-size: clamp(36px, 3.8vw, 54px); font-weight: 500; letter-spacing: -.055em; line-height: .96; }.layer-detail > div > p:not(.eyebrow) { max-width: 360px; margin: 24px 0 0; color: var(--dark-muted); font-size: 13px; line-height: 1.65; }.detail-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 28px; }.detail-tags span { padding: 7px 9px; border: 1px solid var(--line-dark); color: var(--dark-muted); font-size: 9px; }

.platform-copy h2 { max-width: 680px; }.module-list { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 93px; border-top: 1px solid var(--line-light); }.module-list > div { position: relative; min-height: 190px; padding: 21px 28px 25px 0; border-bottom: 1px solid var(--line-light); }.module-list > div:nth-child(even) { padding-left: 28px; border-left: 1px solid var(--line-light); }.module-list span { color: #9b6d42; font-size: 10px; font-weight: 600; }.module-list h3 { margin: 46px 0 9px; font-family: var(--display); font-size: 26px; font-weight: 500; letter-spacing: -.04em; line-height: 1; }.module-list p { max-width: 270px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }

.contact { position: relative; overflow: hidden; padding: 145px 0 160px; }.contact-grid { display: grid; grid-template-columns: 1fr 1.25fr 1fr; gap: 52px; }.contact-copy h2 { margin-top: 47px; color: var(--paper); }.contact-copy .button { min-width: 270px; margin-top: 37px; }.contact-details { align-self: end; }.contact-details > div { padding: 16px 0; border-top: 1px solid var(--line-dark); }.contact-details span { display: block; margin-bottom: 8px; color: var(--dark-muted); font-size: 9px; font-weight: 600; letter-spacing: .12em; }.contact-details strong { display: block; max-width: 230px; color: var(--paper); font-size: 12px; font-weight: 500; line-height: 1.5; }
.site-footer { padding: 25px 0 30px; border-top: 1px solid var(--line-dark); }.footer-inner { display: flex; align-items: center; justify-content: space-between; color: var(--dark-muted); font-size: 9px; font-weight: 600; letter-spacing: .07em; }.footer-inner .brand { color: var(--paper); }.footer-inner .brand-copy span { color: var(--dark-muted); }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.72,.2,1); }.reveal.is-visible { opacity: 1; transform: translateY(0); }.reveal-delay-1 { transition-delay: .1s; }.reveal-delay-2 { transition-delay: .2s; }.reveal-delay-3 { transition-delay: .3s; }
@keyframes hero-breathe { from { transform: scale(1.03); } to { transform: scale(1.07); } }

@media (max-width: 1080px) { .site-nav { gap: 18px; }.split-section, .contact-grid { grid-template-columns: 1fr 1.6fr; }.contact-grid > .section-index { grid-column: 1; }.contact-copy, .contact-details { grid-column: 2; }.contact-details { margin-top: 45px; }.workflow-grid { gap: 50px; }.layer-detail { padding-right: 30px; padding-left: 30px; } }
@media (max-width: 920px) { .container { width: min(100% - 48px, 720px); }.site-header { padding: 0 24px; }.menu-toggle { display: grid; position: relative; z-index: 22; grid-template-columns: 17px; gap: 4px; align-items: center; border: 0; background: transparent; cursor: pointer; }.menu-toggle span { display: block; width: 17px; height: 1px; background: currentColor; transition: transform .25s ease, opacity .25s ease; }.menu-toggle em { position: absolute; right: 25px; left: auto; white-space: nowrap; color: var(--dark-muted); font-size: 9px; font-style: normal; letter-spacing: .1em; text-transform: uppercase; }.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }.menu-toggle[aria-expanded="true"] span:last-of-type { transform: translateY(-3px) rotate(-45deg); }.site-nav { position: fixed; inset: 0; display: grid; align-content: center; justify-items: start; gap: 21px; padding: 100px 48px 48px; background: rgba(20,22,21,.98); opacity: 0; pointer-events: none; transform: translateY(-12px); transition: opacity .3s ease, transform .3s ease; }.site-nav.is-open { opacity: 1; pointer-events: auto; transform: translateY(0); }.site-nav > a { color: var(--paper); font-family: var(--display); font-size: 34px; letter-spacing: -.04em; }.site-nav .nav-cta { margin-top: 10px; padding: 11px 0; border: 0; border-bottom: 1px solid var(--accent); font-family: var(--body); font-size: 11px; letter-spacing: .05em; }.site-nav .locale-switch { margin: 14px 0 0; color: var(--dark-muted); font-size: 14px; }.site-nav .locale-option { color: var(--paper); font-family: var(--display); font-size: 22px; letter-spacing: -.02em; }.site-nav .locale-divider { color: var(--accent); }.system-flow { grid-template-columns: 1fr 42px 1fr 42px 1fr; }.flow-step { padding-right: 15px; }.flow-step:nth-of-type(3), .flow-step:nth-of-type(5) { padding-left: 15px; }.workflow-grid { grid-template-columns: 1fr 1fr; }.workflow-image { min-height: 500px; }.layer-layout { grid-template-columns: 1fr; }.layer-list { border-right: 0; border-bottom: 1px solid var(--line-dark); }.layer-detail { min-height: 350px; }.module-list { margin-top: 65px; } }
@media (max-width: 620px) { :root { --header-height: 68px; }.container { width: calc(100% - 40px); }.site-header { padding: 0 20px; }.hero-content { padding-top: 72px; }.hero h1 { font-size: clamp(48px, 13.5vw, 72px); letter-spacing: -.055em; }.hero-lede { max-width: 360px; margin-top: 27px; font-size: 13px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; margin-top: 31px; }.hero-footer { bottom: 20px; grid-template-columns: 1fr 1fr; font-size: 8px; }.hero-footer span:nth-child(2) { display: none; }.hero-footer span:last-child { text-align: right; }.about, .workflow, .platform, .architecture, .infrastructure, .contact { padding: 100px 0 110px; }.split-section, .contact-grid, .workflow-grid { display: block; }.about-copy, .architecture-copy, .workflow-copy, .infrastructure-copy, .platform-copy, .contact-copy { margin-top: 52px; }.about-copy h2, .architecture-copy h2, .workflow-copy h2, .infrastructure-copy h2, .platform-copy h2, .contact-copy h2 { font-size: 43px; letter-spacing: -.045em; }.system-lines { display: block; margin-top: 60px; }.system-lines > div, .system-lines > div:not(:first-child) { min-height: 130px; padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--line-light); }.system-lines > div:last-child { border-bottom: 0; }.system-lines span { margin-bottom: 20px; }.system-lines strong { font-size: 26px; }.architecture-copy h2, .workflow-copy h2, .infrastructure-copy h2 { margin-top: 44px; }.system-flow { display: block; margin-top: 62px; }.flow-step, .flow-step:nth-of-type(3), .flow-step:nth-of-type(5) { min-height: 160px; padding: 18px 0; }.flow-step span { margin-bottom: 37px; }.flow-rule { width: 100%; }.flow-rule::after { display: none; }.workflow-image { min-height: 350px; margin-bottom: 62px; }.method-list { margin-top: 40px; }.layer-layout { margin-top: 62px; }.layer-item { min-height: 72px; padding-right: 8px; }.layer-item strong { font-size: 11px; }.layer-detail { display: block; min-height: 0; padding: 27px 20px 38px; }.layer-number { display: block; margin-bottom: 34px; font-size: 68px; }.layer-detail h3 { font-size: 39px; }.module-list { display: block; margin-top: 61px; }.module-list > div, .module-list > div:nth-child(even) { min-height: 155px; padding: 18px 0; border-left: 0; }.module-list h3 { margin-top: 34px; font-size: 25px; }.contact-copy h2 { margin-top: 44px; }.contact-copy .button { width: 100%; min-width: 0; }.contact-details { margin-top: 62px; }.footer-inner { align-items: flex-start; flex-direction: column; gap: 20px; }.hero-media { background-position: 63% center; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.hero-media, .reveal { animation: none; transition: none; }.reveal { opacity: 1; transform: none; }.button, .layer-item, .system-lines > div { transition: none; } }