/* codigma × Industry — Industry's blueprint grammar retuned to codigma's Forest & Cream tokens. */
:root{
  --forest-950:#0B1F16;--forest-900:#122C1F;--forest-800:#183D2B;--forest-700:#1F5238;--forest-600:#2A6B49;--forest-300:#93C4A9;--forest-100:#DFEDE5;--forest-50:#EEF5F1;
  --cream-50:#FBF8F2;--cream-100:#F5F0E6;--cream-200:#EAE2D2;--cream-300:#D9CDB6;
  --ink-900:#1B1A16;--ink-700:#33312B;--ink-500:#5A574D;
  --brass:#B5892F;--brass-600:#7D5C17;
  --color-bg:var(--cream-50);--color-surface:var(--cream-100);--color-text:var(--ink-900);
  --color-accent:var(--forest-800);--color-accent-2:var(--forest-700);
  --color-divider:color-mix(in srgb,var(--ink-900) 16%,transparent);
  --color-accent-100:var(--forest-50);--color-accent-200:var(--forest-100);--color-accent-300:var(--forest-300);--color-accent-400:#5E9C7A;--color-accent-500:var(--forest-600);--color-accent-600:var(--forest-700);--color-accent-700:var(--forest-800);--color-accent-800:var(--forest-900);--color-accent-900:var(--forest-950);
  --font-body:"Nebula Sans","Barlow",system-ui,sans-serif;
  --leading:24px;--half:12px;--edge:clamp(20px,5vw,72px);--rail:56px;
  --ease:cubic-bezier(.22,1,.36,1);
}
html{scroll-behavior:smooth}
body{margin:0;font-size:17px;line-height:var(--leading);text-wrap:pretty;-webkit-font-smoothing:antialiased;overflow-x:clip}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:linear-gradient(to right,color-mix(in srgb,var(--ink-900) 4%,transparent) 1px,transparent 1px) 0 0/var(--leading) var(--leading),linear-gradient(to bottom,color-mix(in srgb,var(--ink-900) 4%,transparent) 1px,transparent 1px) 0 0/var(--leading) var(--leading);mask:radial-gradient(ellipse at 70% 0%,#000 0%,transparent 70%)}
a{color:var(--color-accent)}a:hover{color:var(--forest-600)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--edge);position:relative}
.kicker{display:flex;align-items:center;gap:var(--half);font-family:var(--font-heading);font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-600);line-height:var(--half);margin:0 0 var(--half);font-feature-settings:"tnum" 1}
.kicker::after{content:"";flex:1;height:1px;background:var(--color-divider)}
.corner{position:absolute;width:15px;height:15px;color:var(--brass);pointer-events:none}
.corner::before,.corner::after{content:"";position:absolute;background:currentColor}
.corner::before{left:7px;top:0;width:1px;height:100%}.corner::after{top:7px;left:0;width:100%;height:1px}
.corner.tl{top:-8px;left:-8px}.corner.tr{top:-8px;right:-8px}.corner.bl{bottom:-8px;left:-8px}.corner.br{bottom:-8px;right:-8px}
.frame{position:relative;border:1px solid var(--color-divider)}
.blueprint>.corner{width:15px;height:15px;color:var(--brass)}
.blueprint>.corner::before{left:7px}.blueprint>.corner::after{top:7px}
.blueprint>.corner.tl{top:-8px;left:-8px}.blueprint>.corner.tr{top:-8px;right:-8px}.blueprint>.corner.bl{bottom:-8px;left:-8px}.blueprint>.corner.br{bottom:-8px;right:-8px}

/* rail */
.rail{position:fixed;left:0;top:0;bottom:0;width:var(--rail);border-right:1px solid var(--color-divider);z-index:5;background:linear-gradient(to bottom,transparent calc(var(--leading) - 1px),var(--color-divider) calc(var(--leading) - 1px),var(--color-divider) var(--leading),transparent var(--leading)) 0 0/100% calc(var(--leading) * 4),linear-gradient(to bottom,transparent calc(var(--leading) - 1px),color-mix(in srgb,var(--ink-900) 8%,transparent) calc(var(--leading) - 1px),color-mix(in srgb,var(--ink-900) 8%,transparent) var(--leading),transparent var(--leading)) 0 0/40% var(--leading);background-repeat:repeat-y;background-position:right top}
.rail .fill{position:absolute;left:0;top:0;width:3px;height:var(--p,0%);background:var(--color-accent);transition:height .15s linear}
.rail .label{position:absolute;left:50%;bottom:var(--leading);transform:translateX(-50%) rotate(180deg);writing-mode:vertical-rl;font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-500);white-space:nowrap}
.rail .label b{color:var(--brass-600);font-weight:600}
@media(max-width:1199px){.rail{display:none}}
@media(min-width:1200px){body{padding-left:var(--rail)}}

/* nav */
.nav{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--cream-50) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--half) max(var(--edge),calc((100% - 1240px)/2 + var(--edge)));border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-bottom-color:var(--color-divider)}
.nav .nav-brand{font-size:24px;letter-spacing:0;text-transform:none;display:flex;align-items:center;gap:10px;color:var(--forest-900);text-decoration:none}
.nav-brand i{width:9px;height:9px;border:1px solid var(--brass);position:relative;display:inline-block}
.nav-brand i::after{content:"";position:absolute;inset:2px;background:var(--color-accent)}
.nav a{font-family:var(--font-heading);font-weight:600;font-size:18px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:var(--ink-900)}
.nav a[aria-current="location"]{color:var(--brass-600)}
.nav-links{display:flex;align-items:center;gap:var(--space-4);margin-left:auto}
.nav-toggle{display:none;margin-left:auto;width:44px;height:44px;padding:0;background:none;border:1px solid var(--color-divider);border-radius:0;cursor:pointer;position:relative;color:var(--forest-900)}
.nav-toggle span{position:absolute;left:12px;right:12px;height:1.5px;background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
.nav-toggle span:first-child{top:17px}.nav-toggle span:last-child{top:25px}
.nav-toggle:hover{background:color-mix(in srgb,var(--forest-50) 70%,transparent)}
.nav[aria-expanded="true"] .nav-toggle span:first-child{top:21px;transform:rotate(45deg)}
.nav[aria-expanded="true"] .nav-toggle span:last-child{top:21px;transform:rotate(-45deg)}
@media(max-width:820px){
  .nav{flex-wrap:wrap}
  .nav-toggle{display:block}
  .nav-links{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;margin:var(--half) 0 0;border-top:1px solid var(--color-divider)}
  .nav[aria-expanded="true"] .nav-links{display:flex}
  .nav[aria-expanded="true"]{border-bottom-color:var(--color-divider);background:var(--cream-50)}
  .nav-links a{padding:var(--half) 0;border-bottom:1px solid var(--color-divider);font-size:20px}
  .nav-links a:last-child{border-bottom:0}
}
.btn{font-size:15px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:11px 20px;position:relative;line-height:1.2}
.btn-primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--cream-50)}
.btn-primary:hover{background:var(--forest-700);color:var(--cream-50)}
.btn-primary:active{background:var(--forest-900)}
.btn-ghost{color:var(--color-accent)}
.btn.blueprint>.corner{color:var(--brass)}

/* hero */
.hero{position:relative;padding:calc(4*var(--leading)) 0 calc(4*var(--leading))}
.hero .grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:calc(2*var(--leading)) clamp(24px,5vw,80px);align-items:center}
.hero .grid>div:first-child{container-type:inline-size;min-width:0}
.display{font-family:var(--font-heading);font-weight:600;font-size:clamp(52px,7.6vw,118px);line-height:.98;letter-spacing:-.015em;margin:0 0 0 -.03em;color:var(--forest-900)}
html[lang="de"] .display{font-size:min(clamp(48px,6.8vw,104px),10.6cqw)}
.display .line span{white-space:nowrap;padding-right:.06em}
.display .line{display:block;overflow:hidden}
.display .line span{display:block;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.loaded .display .line span{transform:none}
.display .line:nth-child(2) span{transition-delay:.12s}.display .line:nth-child(3) span{transition-delay:.24s}
.hero .sub{font-size:19px;line-height:calc(1.25*var(--leading));color:var(--ink-700);max-width:none;margin:calc(1.5*var(--leading)) 0 0;opacity:0;transform:translateY(12px);transition:opacity .9s var(--ease) .5s,transform .9s var(--ease) .5s}
.loaded .hero .sub{opacity:1;transform:none}
.hero .row{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center;margin-top:calc(1.5*var(--leading));opacity:0;transition:opacity .9s var(--ease) .7s}
.loaded .hero .row{opacity:1}
.plate{position:relative;border:1px solid var(--color-divider);background:color-mix(in srgb,var(--cream-100) 60%,transparent);opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease) .3s,transform 1s var(--ease) .3s}
.loaded .plate{opacity:1;transform:none}
.plate svg{display:block;width:100%;height:auto}
.plate .tb{display:flex;border-top:1px solid var(--color-divider);font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500)}
.plate .tb span{padding:6px var(--half);line-height:var(--half)}
.plate .tb span+span{border-left:1px solid var(--color-divider)}
.plate .tb span:first-child{flex:1;color:var(--forest-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.schem text{font-family:var(--font-heading);font-weight:600;font-size:17px;letter-spacing:.08em;text-transform:uppercase;fill:var(--forest-800);dominant-baseline:middle}
.schem text.dim{font-size:13px;letter-spacing:.12em;dominant-baseline:auto}
.schem .dim{fill:var(--brass-600)}
.schem .draw{stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600);transition:stroke-dashoffset 1.8s var(--ease)}
.loaded .schem .draw{stroke-dashoffset:0}
.schem .d1{transition-delay:.5s}.schem .d2{transition-delay:.9s}.schem .d3{transition-delay:1.3s}.schem .d4{transition-delay:1.7s}
.schem .spin{transform-origin:var(--ox) var(--oy);transform-box:view-box;animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.schem .pulse{animation:pulse 3s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.25}50%{opacity:1}}
@media(max-width:900px){.hero{padding-top:calc(2*var(--leading))}.hero .grid{grid-template-columns:1fr}html[lang="de"] .display{font-size:min(clamp(44px,9vw,96px),10.6cqw)}}

/* reveal */
.rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}

/* vision */
.vision{padding:calc(4*var(--leading)) 0 calc(4*var(--leading));border-top:1px solid var(--color-divider)}
.vision .line{font-family:var(--font-heading);font-weight:600;font-size:clamp(30px,4.2vw,62px);line-height:1.04;letter-spacing:-.01em;color:var(--forest-900);max-width:none;margin:0}
.vision .line .w{display:inline-block;opacity:.12;transition:opacity .6s var(--ease)}
.vision.in .line .w{opacity:1}
.vision .sep{color:var(--brass);margin:0 .25em;font-weight:400}
.vision .sub{margin:calc(1.5*var(--leading)) 0 0;max-width:none;color:var(--ink-700);font-size:18px;line-height:calc(1.2*var(--leading))}

/* rules — the drawn sheet */
.rules{padding:calc(3*var(--leading)) 0 calc(4*var(--leading))}
.sheet{position:relative;border:1px solid var(--color-divider)}
.title-block{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--color-divider);font-family:var(--font-heading);font-weight:600;font-size:13px;letter-spacing:.1em;}
.title-block span{padding:var(--half) var(--leading);line-height:var(--leading)}
.tb-title{flex:1;min-width:16ch;color:var(--forest-900);font-size:17px;letter-spacing:0}
.tb-cell{text-transform:uppercase}
.tb-cell{border-left:1px solid var(--color-divider);color:var(--ink-500);white-space:nowrap;font-feature-settings:"tnum" 1}
.cells{display:grid;grid-template-columns:repeat(3,1fr)}
.cell{padding:calc(1.5*var(--leading)) var(--leading) calc(2*var(--leading));position:relative;transition:background .4s}
.cell+.cell{border-left:1px solid var(--color-divider)}
.cell:hover{background:color-mix(in srgb,var(--forest-50) 70%,transparent)}
.cell .n{font-family:var(--font-heading);font-weight:600;font-size:clamp(64px,7vw,112px);line-height:1;color:transparent;-webkit-text-stroke:1px var(--brass);display:block;margin:0 0 var(--leading) -.03em;transition:color .5s var(--ease)}
.cell:hover .n{color:var(--brass)}
.cell h3{font-size:clamp(24px,2.2vw,30px);line-height:1.08;letter-spacing:.01em;color:var(--forest-900);margin:0 0 var(--leading)}
.cell p{margin:0;color:var(--ink-700);font-size:16px;line-height:var(--leading)}
.sheet-note{margin:0;padding:var(--half) var(--leading);border-top:1px solid var(--color-divider);font-size:13px;line-height:var(--leading);color:var(--ink-500);font-family:var(--font-heading);letter-spacing:.06em;text-transform:uppercase}
@media(max-width:900px){.cells{grid-template-columns:1fr}.cell+.cell{border-left:0;border-top:1px solid var(--color-divider)}.tb-title{flex-basis:100%;border-bottom:1px solid var(--color-divider)}.tb-title+.tb-cell{border-left:0}}

/* about */
.about-wrap{padding:calc(3*var(--leading)) 0 calc(4*var(--leading))}
.about{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:calc(2*var(--leading)) clamp(24px,6vw,110px)}
.about h2{font-size:clamp(34px,3.6vw,54px);line-height:1;letter-spacing:-.01em;color:var(--forest-900);margin:0;overflow-wrap:anywhere;hyphens:auto}
.about .fig{margin:calc(2*var(--leading)) 0 0}
.about .fig img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.about .fig-cap{font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin-top:var(--leading);display:flex;justify-content:space-between}
.prose{display:flex;flex-direction:column;gap:var(--leading);font-size:18px;line-height:calc(1.25*var(--leading));color:var(--ink-700);padding-top:calc(var(--leading) + 12px)}
.prose p{margin:0}
.prose p:first-child{font-size:22px;line-height:calc(1.3*var(--leading));color:var(--ink-900)}
@media(max-width:900px){.about{grid-template-columns:1fr}.prose{padding-top:0}}

/* approach */
.approach{padding:calc(3*var(--leading)) 0 calc(4*var(--leading));border-top:1px solid var(--color-divider)}
.approach h2{font-size:clamp(34px,3.6vw,54px);line-height:1;color:var(--forest-900);margin:0}
.approach .lead{font-size:18px;color:var(--ink-700);margin:var(--leading) 0 0;max-width:none}
.track{position:relative;margin-top:calc(3*var(--leading));height:2px;background:var(--color-divider)}
.track .prog{position:absolute;left:0;top:0;height:100%;width:0;background:var(--color-accent);transition:width 1.6s var(--ease)}
.approach.in .track .prog{width:100%}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px);margin-top:calc(-1*var(--half) - 1px)}
.step{position:relative;padding-top:calc(2*var(--leading))}
.step::before{content:"";position:absolute;top:0;left:0;width:23px;height:23px;border:1px solid var(--color-accent);background:var(--cream-50);transform:rotate(45deg) scale(0);transition:transform .6s var(--ease)}
.step::after{content:"";position:absolute;top:8px;left:8px;width:7px;height:7px;background:var(--brass);transform:rotate(45deg) scale(0);transition:transform .6s var(--ease) .15s}
.approach.in .step::before,.approach.in .step::after{transform:rotate(45deg) scale(1)}
.approach.in .step:nth-child(2)::before{transition-delay:.5s}.approach.in .step:nth-child(2)::after{transition-delay:.65s}
.approach.in .step:nth-child(3)::before{transition-delay:1s}.approach.in .step:nth-child(3)::after{transition-delay:1.15s}
.step .n{font-family:var(--font-heading);font-weight:600;font-size:13px;letter-spacing:.12em;color:var(--brass-600);font-feature-settings:"tnum" 1}
.step h4{font-size:28px;line-height:1.05;letter-spacing:.01em;color:var(--forest-900);margin:var(--half) 0 var(--leading)}
.step p{margin:0;color:var(--ink-700);font-size:16px}
.note{margin:calc(3*var(--leading)) 0 0;position:relative;border:1px solid var(--color-divider);padding:var(--leading) calc(1.5*var(--leading));max-width:none;font-size:18px;line-height:calc(1.25*var(--leading));color:var(--ink-900);background:color-mix(in srgb,var(--cream-100) 60%,transparent)}
.note::before{content:attr(data-label);position:absolute;top:-7px;left:var(--leading);padding:0 6px;background:var(--cream-50);font-family:var(--font-heading);font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-600);line-height:14px}
@media(max-width:900px){.steps{grid-template-columns:1fr;gap:calc(2*var(--leading))}.track{display:none}.steps{margin-top:calc(2*var(--leading))}}

/* contact — the one deep field */
.contact{background:var(--forest-950);color:var(--cream-50);padding:calc(5*var(--leading)) 0;position:relative;overflow:hidden}
.contact::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,color-mix(in srgb,var(--cream-50) 5%,transparent) 1px,transparent 1px) 0 0/var(--leading) var(--leading),linear-gradient(to bottom,color-mix(in srgb,var(--cream-50) 5%,transparent) 1px,transparent 1px) 0 0/var(--leading) var(--leading);mask:radial-gradient(ellipse at 100% 100%,#000,transparent 65%)}
.contact .kicker{color:var(--forest-300)}.contact .kicker::after{background:color-mix(in srgb,var(--cream-50) 18%,transparent)}
.contact h2{font-size:clamp(34px,4.6vw,72px);line-height:.98;letter-spacing:-.01em;color:var(--cream-50);margin:0;max-width:none}
.contact p{margin:calc(1.5*var(--leading)) 0 0;color:#B9DCC7;max-width:none;font-size:18px}
.contact .mail{display:inline-flex;align-items:center;gap:var(--leading);margin-top:calc(2*var(--leading));font-family:var(--font-heading);font-weight:600;font-size:clamp(26px,3vw,44px);letter-spacing:.02em;color:var(--cream-50);text-decoration:none;padding:var(--half) var(--leading);border:1px solid color-mix(in srgb,var(--cream-50) 30%,transparent);position:relative;transition:background .3s,color .3s}
.mail>.corner{color:var(--brass)}
.contact .mail:hover{background:var(--cream-50);color:var(--forest-950)}
.contact .mail svg{width:.8em;height:.8em;transition:transform .4s var(--ease)}
.contact .mail:hover svg{transform:translateX(6px)}
@media(max-width:600px){.contact .mail{font-size:22px;gap:var(--half);max-width:100%;overflow-wrap:anywhere}}
.contact .grid{display:block}

/* footer */
footer.site{background:var(--forest-950);color:#B9DCC7;padding:calc(3*var(--leading)) 0 calc(1.5*var(--leading));border-top:1px solid color-mix(in srgb,var(--cream-50) 12%,transparent)}
footer.site .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:calc(2*var(--leading))}
footer.site .brand{font-family:var(--font-heading);font-weight:600;font-size:28px;text-transform:uppercase;color:var(--cream-50);text-decoration:none;letter-spacing:.02em}
footer.site .cap{margin:var(--leading) 0 0;max-width:34rem;font-size:15px;line-height:var(--leading)}
footer.site h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-50);margin:0 0 var(--half)}
footer.site ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:15px}
footer.site a{color:#B9DCC7;text-decoration:none}footer.site a:hover{color:var(--cream-50)}
footer.site .legal{margin-top:calc(2.5*var(--leading));padding-top:var(--leading);border-top:1px solid color-mix(in srgb,var(--cream-50) 12%,transparent);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--half);font-family:var(--font-heading);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
@media(max-width:900px){footer.site .cols{grid-template-columns:1fr 1fr}}
@media(max-width:600px){footer.site .cols{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:0s!important;animation:none!important}.display .line span,.hero .sub,.hero .row,.plate,.rv{opacity:1;transform:none}.schem .draw{stroke-dashoffset:0}.vision .line .w{opacity:1}}
