@font-face{font-family:Archivo;src:url('../fonts/archivo-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Archivo;src:url('../fonts/archivo-semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Archivo;src:url('../fonts/archivo-extrabold.ttf') format('truetype');font-style:normal;font-weight:800;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('../fonts/ibm-plex-mono-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}

:root{
  --p-paper:oklch(0.987 0.003 95);
  --p-aluminum:oklch(0.97 0.002 95);
  --p-mist:oklch(0.94 0.003 95);
  --p-ink:oklch(0.16 0.01 285);
  --p-clay:oklch(0.48 0.015 75);
  --p-stone:oklch(0.58 0.012 75);
  --p-acid:oklch(0.866 0.295 136);
  --p-acid-dark:oklch(0.74 0.24 136);
  --surface:var(--p-paper);
  --surface-alt:var(--p-aluminum);
  --surface-dark:var(--p-ink);
  --text:var(--p-ink);
  --text-muted:var(--p-clay);
  --text-on-dark:var(--p-paper);
  --accent:var(--p-acid);
  --line:oklch(0.84 0.006 95);
  --line-dark:oklch(0.32 0.012 285);
  --error:oklch(0.56 0.19 28);
  --success:oklch(0.68 0.18 145);
  --font-sans:Archivo,'Helvetica Neue',Arial,sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
  --page:1440px;
  --gutter:clamp(1rem,4vw,4rem);
  --section:clamp(5rem,10vw,10rem);
  --ease:cubic-bezier(.33,0,0.66,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:6rem}
body{font-family:var(--font-sans);font-size:1rem;line-height:1.65;color:var(--text);background:var(--surface);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.menu-open{overflow:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
::selection{color:var(--p-ink);background:var(--accent)}
:focus-visible{outline:3px solid var(--p-acid-dark);outline-offset:4px}
[hidden]{display:none!important}
h1,h2,h3{font-weight:600;line-height:1.02;letter-spacing:-.045em;text-wrap:balance}
p{max-width:68ch}
ul,ol{list-style:none}

.skip-link{position:fixed;top:1rem;left:1rem;z-index:100;padding:.75rem 1rem;color:var(--p-ink);background:var(--accent);transform:translateY(-180%);transition:transform .2s var(--ease)}
.skip-link:focus{transform:translateY(0)}
.page-grid{width:calc(100% - (2 * var(--gutter)));max-width:var(--page);margin-inline:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1rem,1.8vw,1.75rem)}
.section-space{padding-block:var(--section)}
.meta-label{font-family:var(--font-mono);font-size:.72rem;line-height:1.5;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.meta-on-dark{color:var(--text-on-dark)}
.button{min-height:3.25rem;display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;padding:.85rem 1.1rem;border:1px solid transparent;border-radius:2px;font-weight:600;line-height:1.2;transition:background-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.button span,.text-link span{display:inline-block;transition:transform .25s var(--ease)}
.button:hover{transform:translateY(-2px)}
.button:hover span,.text-link:hover span{transform:translate(3px,-3px)}
.button:active{transform:translateY(0)}
.button-primary{color:var(--text-on-dark);background:var(--p-ink)}
.button-primary:hover{color:var(--p-ink);background:var(--accent)}
.button-accent{color:var(--p-ink);background:var(--accent)}
.button-accent:hover{background:var(--p-paper)}
.button[disabled]{cursor:wait;opacity:.65;transform:none}
.text-link{min-height:2.75rem;width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:1.5rem;padding-block:.5rem;border-bottom:1px solid currentColor;font-weight:600;line-height:1.35;transition:color .25s var(--ease)}
.text-link:hover{color:var(--p-clay)}
.reveal{transform:translateY(0);transition:transform .35s var(--ease)}
.js .reveal:not(.is-visible){transform:translateY(12px)}

.site-header{position:fixed;inset:0 0 auto;z-index:40;color:var(--text);background:color-mix(in oklch,var(--p-paper) 92%,transparent);border-bottom:1px solid transparent;backdrop-filter:blur(14px);transition:border-color .2s var(--ease)}
.site-header.is-scrolled{border-color:var(--line)}
.header-inner{width:calc(100% - (2 * var(--gutter)));max-width:var(--page);min-height:5rem;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brand{display:inline-flex;align-items:center;gap:.75rem;flex:none}
.brand-logo{display:block;width:11.75rem;height:auto}
.brand-symbol{width:2rem;height:2rem;color:var(--p-acid-dark)}
.brand-type{display:flex;flex-direction:column;line-height:1}
.brand-type strong{font-size:.95rem;letter-spacing:-.025em}
.brand-type>span{margin-top:.35rem;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.19em}
.site-nav{display:flex;align-items:center;gap:clamp(1.25rem,2.5vw,2.75rem);font-size:.88rem;font-weight:600}
.site-nav>a{min-height:2.75rem;display:inline-flex;align-items:center;position:relative}
.site-nav>a:not(.nav-contact)::after{content:'';position:absolute;right:0;bottom:.35rem;left:0;height:1px;background:var(--p-ink);transform:scaleX(0);transform-origin:right;transition:transform .25s var(--ease)}
.site-nav>a:hover::after{transform:scaleX(1);transform-origin:left}
.nav-contact{gap:1.25rem;padding-inline:1rem;color:var(--text-on-dark);background:var(--p-ink)}
.nav-contact:hover{color:var(--p-ink);background:var(--accent)}
.language-switch{display:inline-flex;align-items:center;gap:.35rem;margin-left:-.75rem;padding:.25rem .5rem;border:1px solid var(--line);font-family:var(--font-mono);font-size:.7rem;font-weight:500;letter-spacing:.08em;line-height:1}
.language-switch>a{min-height:2rem;display:inline-flex;align-items:center;opacity:.45;text-decoration:none;transition:opacity .2s var(--ease)}
.language-switch>a:hover,.language-switch>a[aria-current="page"]{opacity:1}
.language-switch>a[aria-current="page"]{font-weight:800;text-decoration:underline;text-underline-offset:.3rem}
.menu-toggle{display:none;width:3rem;height:3rem;border:0;background:transparent;align-items:center;justify-content:center;flex-direction:column;gap:.45rem}
.menu-toggle span{width:1.5rem;height:2px;background:var(--p-ink);transition:transform .2s var(--ease)}

.hero{min-height:100dvh;padding-top:5rem;display:flex;flex-direction:column;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:5rem 5rem;background-position:center 5rem}
.hero::before{content:'';position:absolute;inset:5rem 0 auto;height:calc(100% - 5rem);pointer-events:none;background:linear-gradient(90deg,var(--p-paper) 0%,color-mix(in oklch,var(--p-paper) 82%,transparent) 55%,transparent 85%)}
.hero{position:relative}
.hero-grid{flex:1;align-items:stretch;padding-block:clamp(3rem,7vh,6rem) clamp(3rem,6vh,5rem);position:relative}
.hero-copy{grid-column:1/span 7;align-self:center;padding-right:clamp(0rem,2vw,2rem);position:relative;z-index:2}
.hero h1{margin-top:1.4rem;font-size:clamp(3.3rem,6.7vw,7.4rem);font-weight:800;line-height:.94;letter-spacing:-.065em}
.hero h1 span{color:var(--text-muted)}
.hero-intro{margin-top:clamp(1.75rem,4vh,3rem);max-width:38rem;font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.6}
.hero-actions{margin-top:2rem;display:flex;align-items:center;flex-wrap:wrap;gap:1.5rem 2rem}
.hero-visual{grid-column:8/span 5;min-height:31rem;position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;color:var(--text-on-dark);background:var(--p-ink)}
.visual-meta,.hero-visual figcaption{position:relative;z-index:2;display:flex;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;font-family:var(--font-mono);font-size:.61rem;letter-spacing:.09em;text-transform:uppercase}
.hero-visual img{position:absolute;inset:3rem 0 3.25rem;width:100%;height:calc(100% - 6.25rem);object-fit:cover;transform:translate3d(var(--parallax-x,0),var(--parallax-y,0),0) scale(1.06);transition:transform .2s ease-out}
.hero-visual figcaption{justify-content:flex-start;gap:1.5rem;border-top:1px solid var(--line-dark)}
.hero-visual figcaption span+span::before{content:'/';margin-right:1.5rem;color:var(--accent)}
.signal-strip{position:relative;border-block:1px solid var(--line);background:var(--p-paper)}
.signal-inner{width:calc(100% - (2 * var(--gutter)));max-width:var(--page);min-height:4.5rem;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase}
.signal-inner i{width:4px;height:4px;background:var(--p-acid-dark);transform:rotate(45deg)}

.manifesto{background:var(--surface-alt)}
.manifesto-grid{align-items:start}
.manifesto h2{grid-column:1/span 8;font-size:clamp(2.4rem,4.8vw,5.25rem)}
.manifesto h2 span{color:var(--text-muted)}
.manifesto-copy{grid-column:9/span 4;padding-top:.65rem;display:grid;gap:1.5rem;font-size:1.05rem}
.section-heading{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:inherit;margin-bottom:clamp(3rem,6vw,6rem);align-items:end}
.section-heading .meta-label{grid-column:1/span 12;margin-bottom:1rem}
.section-heading h2{grid-column:1/span 8;font-size:clamp(2.6rem,5vw,5.5rem)}
.section-heading>p:last-child{grid-column:9/span 4;font-size:1.05rem}
.expertise-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:inherit;padding-block:clamp(2.5rem,4vw,4.5rem);border-top:1px solid var(--line)}
.expertise-row:last-child{border-bottom:1px solid var(--line)}
.expertise-name{grid-column:1/span 5}
.expertise-index{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;color:var(--text-muted)}
.expertise-name h3{margin-top:1.25rem;max-width:30rem;font-size:clamp(2rem,3.2vw,3.65rem)}
.expertise-detail{grid-column:7/span 6}
.expertise-detail>p{font-size:1.06rem}
.service-list{margin-block:2rem;display:grid;grid-template-columns:1fr 1fr;gap:0 1.5rem}
.service-list li{padding-block:.85rem;border-top:1px solid var(--line);font-size:.93rem;line-height:1.45}

.education-feature{background:var(--p-paper)}
.education-grid{align-items:center}
.education-copy{grid-column:1/span 5}
.education-copy h2{margin-block:1.5rem;font-size:clamp(2.6rem,4.7vw,5.1rem)}
.education-copy>p:not(.meta-label){font-size:1.04rem}
.education-copy>p+p{margin-top:1.25rem}
.education-copy .text-link{margin-top:2rem}
.learning-map{grid-column:7/span 6;padding:clamp(1.5rem,3vw,3rem);background:var(--surface-alt);box-shadow:inset 0 1.5px 0 var(--line),inset 0 -1.5px 0 var(--line)}
.learning-map-head{display:flex;justify-content:space-between;gap:1rem;font-family:var(--font-mono);font-size:.64rem;letter-spacing:.09em;color:var(--text-muted)}
.learning-map-head span:last-child{text-align:right}
.learning-steps{margin-top:2rem}
.learning-steps li{position:relative;display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding-block:1.75rem;border-top:1px solid var(--line)}
.learning-steps li::before{content:'';position:absolute;top:-1px;left:0;width:100%;height:2px;background:var(--p-acid-dark);transform:scaleX(.12);transform-origin:left;transition:transform .4s var(--ease)}
.learning-steps li:hover::before{transform:scaleX(1)}
.learning-steps li>span{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted)}
.learning-steps h3{font-size:clamp(1.65rem,2.5vw,2.4rem)}
.learning-steps p{margin-top:.65rem;font-size:.94rem}
.learning-audience{padding-top:1.25rem;display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.learning-audience span+span::before{content:'/';margin-right:1.5rem;color:var(--p-acid-dark)}
.education-services{grid-column:1/-1;margin-top:clamp(4rem,8vw,8rem)}
.education-services-heading{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:inherit;align-items:end;margin-bottom:clamp(2rem,4vw,3.5rem)}
.education-services-heading>div{grid-column:1/span 7}
.education-services-heading>p{grid-column:9/span 4;font-size:.96rem;color:var(--text-muted)}
.education-services-heading h3{margin-top:1.25rem;font-size:clamp(2.15rem,3.8vw,4rem);line-height:1.06}
.education-service-table{border-bottom:1px solid var(--line)}
.service-table-labels,.education-service-row{display:grid;grid-template-columns:4fr 4fr 4fr;gap:clamp(1rem,2vw,2rem)}
.service-table-labels{padding-bottom:.75rem;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted)}
.education-service-row{position:relative;padding-block:2rem;border-top:1px solid var(--line)}
.education-service-row::before{content:'';position:absolute;top:-1px;left:0;width:100%;height:2px;background:var(--p-acid-dark);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.education-service-row:hover::before{transform:scaleX(1)}
.service-title{display:flex;align-items:baseline;gap:1rem}
.service-title>span{font-family:var(--font-mono);font-size:.67rem;color:var(--text-muted)}
.service-title h4{font-size:clamp(1.35rem,2vw,2rem);font-weight:600;line-height:1.1;letter-spacing:-.035em}
.education-service-row>p{font-size:.93rem;line-height:1.6}
.service-outcome{padding-left:1.25rem;position:relative;font-weight:600}
.service-outcome::before{content:'→';position:absolute;left:0;font-family:var(--font-mono);font-weight:400;color:var(--p-acid-dark)}

.tech-feature{--accent:var(--p-acid);padding-block:var(--section);color:var(--text-on-dark);background:var(--surface-dark);overflow:hidden}
.tech-grid{align-items:center}
.tech-visual{--tech-x:50%;--tech-y:50%;grid-column:1/span 7;position:relative;min-height:44rem;background-image:linear-gradient(var(--line-dark) 1px,transparent 1px),linear-gradient(90deg,var(--line-dark) 1px,transparent 1px);background-size:4rem 4rem;overflow:hidden}
.tech-diagram-nav{position:absolute;inset:0 0 auto;z-index:5;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line-dark);background:var(--p-ink)}
.tech-diagram-nav button{min-height:3.5rem;padding:.75rem .65rem;border:0;border-right:1px solid var(--line-dark);color:var(--text-on-dark);background:transparent;font-family:var(--font-mono);font-size:.6rem;line-height:1.35;text-align:left;transition:background-color .2s var(--ease),color .2s var(--ease)}
.tech-diagram-nav button:last-child{border-right:0}
.tech-diagram-nav button span{margin-right:.35rem;color:var(--accent)}
.tech-diagram-nav button:hover{background:var(--line-dark)}
.tech-diagram-nav button[aria-pressed=true]{color:var(--p-ink);background:var(--accent)}
.tech-diagram-nav button[aria-pressed=true] span{color:var(--p-ink)}
.tech-diagram{position:absolute;inset:3.5rem 0 0;animation:diagram-in .35s var(--ease)}
@keyframes diagram-in{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.tech-diagram img{position:absolute;inset:0 0 2.5rem;width:100%;height:calc(100% - 2.5rem);object-fit:contain;user-select:none}
.tech-diagram figcaption{position:absolute;inset:auto 0 0;min-height:2.5rem;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid var(--line-dark);font-family:var(--font-mono);font-size:.58rem;letter-spacing:.07em;color:#B7B7B7}
.tech-crosshair{position:absolute;inset:3.5rem 0 2.5rem;z-index:3;pointer-events:none;opacity:0;transition:opacity .2s var(--ease)}
.tech-crosshair::before{content:'';position:absolute;top:0;bottom:0;left:var(--tech-x);width:1px;background:var(--accent)}
.tech-crosshair::after{content:'';position:absolute;top:var(--tech-y);right:0;left:0;height:1px;background:var(--accent)}
.tech-visual:hover .tech-crosshair{opacity:.45}
.tech-copy{grid-column:9/span 4}
.tech-copy h2{margin-block:1.5rem;font-size:clamp(2.5rem,4.4vw,4.75rem)}
.tech-copy>p:not(.meta-label){color:var(--text-on-dark)}
.tech-specs{margin-block:2rem;border-top:1px solid var(--line-dark)}
.tech-specs>div{padding-block:1rem;display:grid;gap:.35rem;border-bottom:1px solid var(--line-dark)}
.tech-specs span{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.tech-specs strong{font-size:.92rem;font-weight:400;line-height:1.45}

.solutions{background:var(--surface-alt)}
.solutions-grid{align-items:start}
.solutions-intro{grid-column:1/span 5;position:sticky;top:8rem}
.solutions-intro h2{margin-block:1.5rem;font-size:clamp(2.5rem,4.5vw,4.9rem)}
.solution-explorer{grid-column:7/span 6;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,3vw,3.5rem)}
.tab-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.tab-list button{min-height:4.75rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border:0;border-bottom:1px solid var(--line);color:var(--text-muted);background:transparent;text-align:left;line-height:1.35;transition:color .2s var(--ease),padding-left .2s var(--ease)}
.tab-list button:hover{padding-left:.4rem;color:var(--text)}
.tab-list button[aria-selected=true]{color:var(--text);font-weight:600}
.tab-list button[aria-selected=true]>span:last-child{color:var(--p-acid-dark)}
.tab-panels{min-height:26rem}
.tab-panels section{animation:panel-in .25s var(--ease)}
@keyframes panel-in{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.panel-kicker{font-family:var(--font-mono);font-size:.67rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.tab-panels h3{margin-block:1.25rem;font-size:clamp(1.75rem,2.5vw,2.8rem);line-height:1.08}
.tab-panels section>p:not(.panel-kicker){margin-bottom:1.5rem}

.process-heading{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:inherit;align-items:end;margin-bottom:clamp(3rem,6vw,5rem)}
.process-heading .meta-label{grid-column:1/span 12}
.process-heading h2{grid-column:1/span 7;font-size:clamp(3rem,6vw,6.75rem)}
.process-heading>p:last-child{grid-column:9/span 4}
.process-list{grid-column:1/-1;counter-reset:steps}
.process-list li{display:grid;grid-template-columns:1fr 4fr 6fr 1fr;gap:inherit;align-items:start;padding-block:1.8rem;border-top:1px solid var(--line)}
.process-list li:last-child{border-bottom:1px solid var(--line)}
.process-list li>span{font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted)}
.process-list h3{font-size:clamp(1.65rem,2.5vw,2.75rem)}
.process-list p{grid-column:3/span 2;max-width:38rem}

.example{background:var(--surface-alt)}
.example-top{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:inherit;align-items:start;margin-bottom:3rem}
.example-top .meta-label{grid-column:1/span 3}
.example-top h2{grid-column:5/span 8;font-size:clamp(2.75rem,5.5vw,6rem)}
.example-scenario{grid-column:5/-1;padding-top:2rem;border-top:1px solid var(--line)}
.scenario-lead{max-width:55rem;font-size:clamp(1.4rem,2.4vw,2.35rem);line-height:1.3;letter-spacing:-.025em}
.example-columns{margin-top:3rem;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,5rem)}
.example-columns article>span{font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}
.example-columns h3{margin-block:1rem;font-size:clamp(1.5rem,2vw,2.15rem);line-height:1.12}
.example-result{margin-top:3rem;padding:1.5rem 0 1.5rem 1.5rem;border-left:2px solid var(--p-acid-dark);font-weight:600;font-size:1.1rem}

.team-grid{align-items:start}
.team-title{grid-column:1/span 7}
.team-title h2{margin-top:1.5rem;font-size:clamp(2.6rem,5vw,5.5rem)}
.team-copy{grid-column:9/span 4;display:grid;gap:1.5rem}
.principles{margin-top:1rem;border-top:1px solid var(--line)}
.principles li{padding-block:1rem;display:grid;gap:.3rem;border-bottom:1px solid var(--line)}
.principles strong{font-size:.95rem}
.principles span{font-size:.88rem;color:var(--text-muted)}

.contact{color:var(--text-on-dark);background:var(--surface-dark)}
.contact-grid{align-items:start}
.contact-copy{grid-column:1/span 5;position:sticky;top:8rem}
.contact-copy h2{margin-block:1.5rem;font-size:clamp(3.25rem,6vw,6.75rem)}
.contact-copy>p:not(.meta-label){max-width:32rem}
.contact-note{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line-dark);max-width:30rem}
.contact-note>span{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.contact-note p{margin-top:.65rem;font-size:.9rem}
.contact-social{margin-top:2.25rem;max-width:30rem}
.contact-social>span{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.contact-social nav{margin-top:.75rem;border-top:1px solid var(--line-dark)}
.contact-social a{min-height:3.25rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;border-bottom:1px solid var(--line-dark);font-size:.9rem;font-weight:600;transition:color .2s var(--ease)}
.contact-social a small{font-size:.72rem;font-weight:400;color:var(--p-stone);text-align:right}
.contact-social a:hover{color:var(--accent)}
.contact-form{grid-column:7/span 6;display:grid;gap:1.5rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.field{display:grid;gap:.5rem;position:relative}
.field label{font-size:.85rem;font-weight:600}
.field input,.field select,.field textarea{width:100%;min-height:3.25rem;padding:.85rem 0;border:0;border-bottom:1px solid var(--line-dark);border-radius:0;color:var(--text-on-dark);background:transparent;outline:none;transition:border-color .2s var(--ease)}
.field textarea{min-height:9rem;resize:vertical;line-height:1.6}
.field select{cursor:pointer;color-scheme:dark}
.field input::placeholder,.field textarea::placeholder{color:oklch(0.73 0.008 95);opacity:1}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}
.field input[aria-invalid=true],.field select[aria-invalid=true],.field textarea[aria-invalid=true]{border-color:var(--error)}
.field-hint{font-size:.72rem;color:var(--text-on-dark)}
.field-error{min-height:1rem;font-size:.75rem;line-height:1.35;color:oklch(0.8 0.12 28)}
.consent{display:flex;align-items:flex-start;gap:.8rem;font-size:.82rem;line-height:1.5;cursor:pointer}
.consent input{appearance:none;width:1.25rem;height:1.25rem;flex:0 0 1.25rem;margin-top:.1rem;border:1px solid var(--line-dark);display:grid;place-content:center;cursor:pointer}
.consent input::before{content:'';width:.65rem;height:.65rem;transform:scale(0);background:var(--accent);transition:transform .15s var(--ease)}
.consent input:checked::before{transform:scale(1)}
.privacy-details{font-size:.8rem;border-block:1px solid var(--line-dark)}
.privacy-details summary{min-height:3rem;display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none}
.privacy-details summary::-webkit-details-marker{display:none}
.privacy-details summary::after{content:'+';font-family:var(--font-mono);font-size:1.2rem}
.privacy-details[open] summary::after{content:'−'}
.privacy-details p{padding-bottom:1.25rem}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-submit{width:100%;border:0}
.form-status{min-height:1.5rem;font-size:.88rem}
.form-status.success{color:var(--accent)}
.form-status.error{color:oklch(0.8 0.12 28)}

.site-footer{padding-block:4rem 2rem;background:var(--p-aluminum);border-top:1px solid var(--line)}
.footer-grid{align-items:start}
.brand-footer{grid-column:1/span 3}
.footer-grid>p{grid-column:5/span 3;font-size:1.2rem;font-weight:600;line-height:1.35;letter-spacing:-.02em}
.footer-grid>nav{grid-column:9/span 2;display:flex;flex-direction:column;align-items:flex-start}
.footer-grid>nav a{min-height:2.5rem;border-bottom:1px solid transparent}
.footer-grid>nav a:hover{border-color:currentColor}
.footer-meta{grid-column:1/span 12;margin-top:4rem;padding-top:1.5rem;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:1rem;font-family:var(--font-mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}

/* Premium art direction — editorial warmth × engineering precision */
:root{
  --p-paper:#fdfaf6;--p-aluminum:#f3f0e9;--p-mist:#eae6de;--p-ink:#262626;--p-clay:#625d55;--p-stone:#7d766c;
  --p-teal:#093753;--p-butter:#f2e297;--accent:var(--p-butter);--line:#dcd6cc;--line-dark:#414146;--section:clamp(4.75rem,8vw,8rem)
}
html{scrollbar-color:var(--p-teal) var(--p-paper);scrollbar-width:thin}
body{background:var(--p-paper);letter-spacing:-.008em}
.reveal{opacity:1;transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal:not(.is-visible){opacity:0;transform:translateY(24px)}
.brand-symbol{color:var(--p-teal)}
.site-header{background:color-mix(in srgb,var(--p-paper) 90%,transparent)}
.nav-contact:hover{color:var(--p-ink);background:var(--p-butter)}
.button-primary:hover{background:var(--p-butter)}
.button-accent{background:var(--accent)}
.text-link:hover{color:var(--p-teal)}
.hero{background-image:linear-gradient(#e7e0d6 1px,transparent 1px),linear-gradient(90deg,#e7e0d6 1px,transparent 1px)}
.hero h1{font-size:clamp(3.2rem,6.25vw,6.9rem);letter-spacing:-.062em}
.hero-intro strong{color:var(--p-teal)}
.hero-copy{grid-column:1/span 6}
.hero-stage{grid-column:7/span 6;align-self:center;position:relative;min-width:0}
.hero-stage-meta{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1rem;font-family:var(--font-mono);font-size:.6rem;letter-spacing:.09em;color:var(--p-teal)}
.hero-stage figure{position:relative;overflow:hidden}
.hero-media-primary{height:clamp(20rem,32vw,29rem);margin-left:3rem;background:var(--p-teal)}
.hero-media-primary img{width:100%;height:100%;object-fit:cover;transform:translate3d(var(--parallax-x,0),var(--parallax-y,0),0) scale(1.05);transition:transform .35s ease-out}
.hero-media-primary figcaption{position:absolute;inset:auto 0 0;padding:1rem 1.25rem;display:flex;justify-content:space-between;gap:1rem;color:var(--p-paper);background:color-mix(in srgb,var(--p-teal) 94%,transparent);font-family:var(--font-mono);font-size:.59rem;letter-spacing:.08em}
.hero-media-secondary{width:72%;height:clamp(14rem,19vw,19rem);margin:-4.5rem 0 0 -1.5rem;z-index:2;border:8px solid var(--p-paper);background:var(--p-ink);box-shadow:0 24px 60px #26262624}
.hero-media-secondary img{width:100%;height:100%;object-fit:cover;transform:translate3d(var(--parallax-x,0),var(--parallax-y,0),0) scale(1.04);transition:transform .35s ease-out}
.hero-media-secondary figcaption{position:absolute;inset:auto 0 0;padding:.7rem .85rem;display:flex;justify-content:space-between;gap:1rem;color:#d8d8d3;background:#262626e8;font-family:var(--font-mono);font-size:.52rem;letter-spacing:.07em}
.hero-stage-link{width:44%;margin:1rem 0 0 auto;padding:.65rem 0;display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--p-teal);color:var(--p-teal);font-family:var(--font-mono);font-size:.61rem;text-transform:uppercase;letter-spacing:.06em}
.hero-stage-link span:last-child{transition:transform .25s var(--ease)}
.hero-stage-link:hover span:last-child{transform:translateY(4px)}
.signal-strip{background:var(--p-teal);border:0;color:var(--p-paper)}
.signal-inner i{background:var(--p-butter)}
.manifesto{color:var(--p-paper);background:var(--p-teal)}
.manifesto h2 span{color:#afc1cb}
.manifesto-copy{color:#e3eaee}
.section-heading h2{color:var(--p-teal)}
.expertise-row{padding-inline:2rem;transition:background-color .35s var(--ease)}
.expertise-row:first-of-type{background:#f2e2972c;border-top:3px solid var(--p-teal)}
.expertise-row:first-of-type .expertise-index{color:var(--p-teal)}
.expertise-row:last-child{margin-top:2rem;color:var(--p-paper);background:var(--p-ink);border:0}
.expertise-row:last-child .expertise-index{color:#a7a7a0}
.expertise-row:last-child .service-list li{border-color:var(--line-dark)}
.expertise-row:last-child .text-link:hover{color:var(--p-acid)}
.education-copy{grid-column:1/span 5;grid-row:1/span 2;position:sticky;top:7.5rem;align-self:start}
.education-copy h2,.education-services-heading h3{color:var(--p-teal)}
.education-media{grid-column:6/span 7;position:relative;min-height:25rem;overflow:hidden;background:var(--p-teal)}
.education-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.education-media:hover img{transform:scale(1.025)}
.education-media figcaption{position:absolute;inset:auto 0 0;padding:1rem 1.25rem;display:flex;justify-content:space-between;gap:1rem;color:var(--p-teal);background:#fdfaf6ed;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.07em}
.learning-map{grid-column:6/span 7;margin-top:1.5rem;background:#f0eee8;box-shadow:none;border-top:3px solid var(--p-teal)}
.learning-map-head,.learning-steps h3{color:var(--p-teal)}
.learning-steps li::before{background:var(--p-teal)}
.learning-steps li>span,.learning-audience{color:#6c6b63}
.learning-audience span+span::before{color:var(--p-teal)}
.service-table-labels{color:var(--p-teal)}
.education-service-row{transition:background-color .3s var(--ease)}
.education-service-row:hover{background:#f2e29738}
.education-service-row::before{background:var(--p-teal)}
.service-outcome::before{color:var(--p-teal)}
.tech-cinema{grid-column:1/-1;position:relative;height:min(68vh,43rem);min-height:28rem;margin-bottom:clamp(3rem,6vw,6rem);overflow:hidden;background:#111}
.tech-cinema img{position:absolute;inset:0;width:100%;height:100%;padding:clamp(1rem,3vw,3rem) clamp(1rem,5vw,5rem) 4rem;object-fit:contain;transition:transform 1s var(--ease)}
.tech-cinema:hover img{transform:scale(1.018)}
.tech-cinema figcaption{position:absolute;inset:auto 0 0;padding:6rem 1.5rem 1.5rem;display:flex;justify-content:space-between;gap:2rem;color:#f5f3ee;background:linear-gradient(transparent,#111 72%);font-family:var(--font-mono);font-size:.64rem;letter-spacing:.08em}
.tech-copy h2{font-size:clamp(2.5rem,4vw,4.35rem)}
.example{background:#f2e29730}
.example-result{border-color:var(--p-teal)}
.process-list li{transition:background-color .25s var(--ease),padding-inline .25s var(--ease)}
.process-list li:hover{padding-inline:1rem;background:#f2e29732}
.contact{--accent:var(--p-butter);background:var(--p-teal)}
.contact .text-link:hover{color:var(--p-butter)}
.site-footer{background:#f0ece4}

@media (max-width:1100px){
  .hero h1{font-size:clamp(3.1rem,6.9vw,5.5rem)}
  .hero-copy{grid-column:1/span 6}
  .hero-visual{grid-column:8/span 5}
  .hero-media-primary{height:23rem;margin-left:2rem}
  .hero-media-secondary{height:15rem}
  .hero-stage-link{width:48%}
  .education-media{grid-column:6/span 7;min-height:22rem}
  .tech-cinema{height:34rem}
  .manifesto h2{grid-column:1/span 7}
  .manifesto-copy{grid-column:8/span 5}
  .section-heading h2{grid-column:1/span 7}
  .section-heading>p:last-child{grid-column:8/span 5}
  .education-copy{grid-column:1/span 5}
  .learning-map{grid-column:6/span 7}
  .education-services-heading>p{grid-column:8/span 5}
  .tech-copy{grid-column:8/span 5}
  .solutions-intro{grid-column:1/span 4}
  .solution-explorer{grid-column:5/span 8}
  .team-title{grid-column:1/span 7}
  .team-copy{grid-column:8/span 5}
  .contact-copy{grid-column:1/span 4}
  .contact-form{grid-column:5/span 8}
}

@media (max-width:820px){
  :root{--gutter:1.5rem;--section:5.5rem}
  .site-header{backdrop-filter:none}
  .header-inner>.brand{position:relative;z-index:42}
  .page-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .menu-toggle{display:flex;position:relative;z-index:42}
  .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .site-nav{position:fixed;inset:0;z-index:41;padding:7rem var(--gutter) 2rem;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:.5rem;background:var(--p-paper);transform:translateX(100%);visibility:hidden;transition:transform .25s var(--ease),visibility .25s}
  .site-nav.is-open{transform:translateX(0);visibility:visible}
  .site-nav>a{min-height:3.75rem;font-size:1.65rem;border-bottom:1px solid var(--line)}
  .site-nav .nav-contact{margin-top:1rem;padding-inline:1rem;font-size:1.1rem;justify-content:space-between}
  .site-nav .language-switch{margin:1.5rem 0 0;padding:0;align-self:flex-start;border:0;font-size:1rem;gap:.65rem}
  .site-nav .language-switch>a{min-height:2.75rem}
  .hero{padding-top:5rem}
  .hero-grid{grid-template-columns:repeat(6,minmax(0,1fr));padding-top:3rem}
  .hero-copy{grid-column:1/span 6}
  .hero h1{font-size:clamp(3.1rem,11vw,5.75rem)}
  .hero-intro{max-width:36rem}
  .hero-visual{grid-column:1/span 6;min-height:28rem;margin-top:3rem}
  .hero-stage{grid-column:1/span 6;max-width:42rem;margin-top:3rem}
  .hero-media-primary{height:27rem}
  .hero-media-secondary{height:18rem}
  .hero-stage-link{width:42%}
  .hero::before{background:color-mix(in oklch,var(--p-paper) 78%,transparent)}
  .signal-inner{min-height:4rem;gap:.75rem;font-size:.58rem}
  .manifesto h2,.manifesto-copy{grid-column:1/span 6}
  .manifesto-copy{margin-top:2rem;max-width:38rem}
  .section-heading{grid-template-columns:repeat(6,minmax(0,1fr))}
  .section-heading .meta-label{grid-column:1/span 6}
  .section-heading h2{grid-column:1/span 6}
  .section-heading>p:last-child{grid-column:1/span 6;margin-top:1.5rem}
  .expertise-row{grid-template-columns:repeat(6,minmax(0,1fr))}
  .expertise-name,.expertise-detail{grid-column:1/span 6}
  .expertise-detail{margin-top:2rem}
  .education-copy,.learning-map{grid-column:1/span 6}
  .education-copy{position:static;grid-row:auto}
  .education-media{grid-column:1/span 6;min-height:26rem;margin-top:3rem}
  .learning-map{margin-top:1.5rem}
  .education-copy>p:not(.meta-label){max-width:40rem}
  .expertise-row{padding-inline:1.25rem}
  .tech-cinema{grid-column:1/span 6;height:52vw;min-height:22rem;margin-bottom:3rem}
  .tech-cinema figcaption{flex-direction:column;gap:.5rem}
  .education-services-heading{grid-template-columns:repeat(6,minmax(0,1fr))}
  .education-services-heading>div,.education-services-heading>p{grid-column:1/span 6}
  .education-services-heading>p{margin-top:1.5rem;max-width:40rem}
  .service-table-labels{display:none}
  .education-service-row{grid-template-columns:1fr;gap:1rem}
  .service-outcome{max-width:40rem}
  .tech-visual{grid-column:1/span 6;min-height:34rem}
  .tech-copy{grid-column:1/span 6;margin-top:3rem}
  .tech-copy>p:not(.meta-label){max-width:40rem}
  .solutions-intro{grid-column:1/span 6;position:static}
  .solution-explorer{grid-column:1/span 6;margin-top:3rem}
  .process-heading{grid-template-columns:repeat(6,minmax(0,1fr))}
  .process-heading .meta-label,.process-heading h2,.process-heading>p:last-child{grid-column:1/span 6}
  .process-heading>p:last-child{margin-top:1.5rem}
  .process-list li{grid-template-columns:1fr 5fr;gap:.75rem 1rem}
  .process-list h3{grid-column:2}
  .process-list p{grid-column:2}
  .example-top{grid-template-columns:repeat(6,minmax(0,1fr))}
  .example-top .meta-label{grid-column:1/span 6;margin-bottom:1rem}
  .example-top h2{grid-column:1/span 6}
  .example-scenario{grid-column:1/-1;margin-left:0}
  .team-title,.team-copy{grid-column:1/span 6}
  .team-copy{margin-top:2.5rem;max-width:40rem}
  .contact-copy{grid-column:1/span 6;position:static}
  .contact-form{grid-column:1/span 6;margin-top:3rem}
  .brand-footer{grid-column:1/span 3}
  .footer-grid>p{grid-column:4/span 3}
  .footer-grid>nav{grid-column:1/span 6;margin-top:2rem;flex-direction:row;gap:2rem}
}

@media (max-width:520px){
  :root{--gutter:1rem;--section:4.5rem}
  html{scroll-padding-top:5rem}
  .header-inner{min-height:4.5rem}
  .brand-symbol{width:1.8rem;height:1.8rem}
  .hero{padding-top:4.5rem;background-size:3rem 3rem}
  .hero-grid{padding-block:2.5rem}
  .hero h1{font-size:clamp(2.85rem,14vw,4.5rem);line-height:.95}
  .hero-intro{font-size:1rem}
  .hero-actions{align-items:stretch;flex-direction:column;gap:1rem}
  .hero-actions .button{width:100%}
  .hero-actions .text-link{width:100%;justify-content:space-between}
  .hero-visual{min-height:22rem;margin-top:2.5rem}
  .hero-stage-meta{align-items:flex-start;flex-direction:column;gap:.3rem}
  .hero-media-primary{height:20rem;margin-left:1rem}
  .hero-media-secondary{width:82%;height:15rem;margin:-3rem 0 0 -.5rem;border-width:5px}
  .hero-media-primary figcaption{flex-direction:column;gap:.3rem;font-size:.5rem}
  .hero-media-secondary figcaption{font-size:.43rem}
  .hero-stage-link{width:62%;font-size:.54rem}
  .education-media{min-height:18rem}
  .education-media figcaption{flex-direction:column;gap:.3rem;font-size:.5rem}
  .tech-cinema{height:65vw;min-height:20rem}
  .tech-cinema figcaption{padding:4rem .8rem .8rem;font-size:.5rem}
  .expertise-row{padding-inline:1rem}
  .visual-meta{font-size:.53rem}
  .hero-visual figcaption{gap:.6rem;font-size:.5rem}
  .hero-visual figcaption span+span::before{margin-right:.6rem}
  .signal-inner{align-items:flex-start;flex-direction:column;justify-content:center;gap:.35rem;padding-block:1rem}
  .signal-inner i{display:none}
  .manifesto h2,.section-heading h2,.team-title h2{font-size:clamp(2.35rem,11vw,3.5rem)}
  .expertise-name h3{font-size:2.15rem}
  .service-list{grid-template-columns:1fr}
  .education-copy h2{font-size:2.65rem}
  .learning-map{padding:1.25rem}
  .learning-map-head{align-items:flex-start;flex-direction:column;gap:.35rem}
  .learning-map-head span:last-child{text-align:left}
  .learning-steps li{grid-template-columns:2rem 1fr;padding-block:1.4rem}
  .learning-audience{flex-direction:column;gap:.5rem}
  .learning-audience span+span::before{content:none}
  .education-services{margin-top:4rem}
  .education-services-heading h3{font-size:2.25rem}
  .education-service-row{padding-block:1.5rem}
  .service-title h4{font-size:1.55rem}
  .tech-visual{min-height:28rem}
  .tech-diagram-nav button{min-height:3.75rem;padding:.55rem .3rem;font-size:.48rem;text-align:center}
  .tech-diagram-nav button span{display:block;margin:0 0 .2rem}
  .tech-diagram{inset:3.75rem 0 0}
  .tech-crosshair{display:none}
  .tech-diagram figcaption{font-size:.48rem;padding-inline:.65rem}
  .tech-copy h2{font-size:2.6rem}
  .solution-explorer{grid-template-columns:1fr;gap:2rem}
  .tab-panels{min-height:0}
  .tab-list button{min-height:4rem}
  .process-heading h2{font-size:3.5rem}
  .process-list li{padding-block:1.5rem}
  .example-top h2{font-size:3rem}
  .example-columns{grid-template-columns:1fr;gap:2rem}
  .example-result{padding-left:1rem}
  .contact-copy h2{font-size:4rem}
  .form-row{grid-template-columns:1fr;gap:1.5rem}
  .footer-grid{grid-template-columns:1fr}
  .brand-footer,.footer-grid>p,.footer-grid>nav,.footer-meta{grid-column:1}
  .footer-grid>p{margin-top:2rem}
  .footer-grid>nav{grid-column:1;flex-wrap:wrap}
  .footer-meta{align-items:flex-start;flex-direction:column;margin-top:2.5rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal,.js .reveal:not(.is-visible){transform:none!important}
  .hero-visual img{transform:scale(1.06)}
  .hero-stage img,.education-media img,.tech-cinema img{transform:none!important}
}

/* WordPress-integratie */
.admin-bar .site-header{top:32px}
.admin-bar .education-copy,.admin-bar .contact-copy{top:10rem}
.entry-content{font-size:1.05rem;line-height:1.75}
.entry-content>*+*{margin-top:1.25rem}
.entry-content img{max-width:100%;height:auto}
@media screen and (max-width:782px){
  .admin-bar .site-header{top:46px}
}