:root{
  --font-display:"IBM Plex Sans",system-ui,sans-serif;
  --font-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --bg:#f3f1ea;--bg-2:#ebe8de;--fg:#10233a;--muted:#5b6a7b;--line:rgba(16,35,58,.16);--accent:#cf5427;--card:#faf9f5;--grid:rgba(16,35,58,.055);--grid-major:rgba(16,35,58,.1);
  --art-sky1:#eef3f5;--art-sky2:#d9e4ea;--art-sun:#f0a27a;--art-ground:#d4d8d6;--art-line:rgba(16,35,58,.08);--art-shadow:rgba(16,35,58,.14);
  --art-a:#f6f5f1;--art-a-side:#cfd6dc;--art-a-top:#ffffff;--art-b:#d58a5c;--art-b-side:#ad6740;--art-b-top:#e7a37b;
  --art-roof:#3b5168;--art-roof-side:#2a3c50;--art-win:#9fc0d4;
  color-scheme:light;
}
[data-theme="dark"]{
  --bg:#071a33;--bg-2:#0b2244;--fg:#e8f0fb;--muted:#8ea4bf;--line:rgba(232,240,251,.16);--accent:#ff9a52;--card:#0c2547;--grid:rgba(160,200,255,.06);--grid-major:rgba(160,200,255,.12);
  --art-sky1:#0f2c52;--art-sky2:#163a66;--art-sun:#ff9a52;--art-ground:#0a2140;--art-line:rgba(160,200,255,.1);--art-shadow:rgba(0,0,0,.35);
  --art-a:#2c4a6e;--art-a-side:#1d3858;--art-a-top:#3b5d85;--art-b:#a8673f;--art-b-side:#7a472a;--art-b-top:#c27e54;
  --art-roof:#0e2340;--art-roof-side:#081a31;--art-win:#7fb2d9;
  color-scheme:dark;
}
.mono-label{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0}
.brand{font-weight:600;font-family:var(--font-body)}
.brand-mark{display:inline-grid;place-items:center;width:30px;height:30px;border:1.5px solid currentColor;font-family:var(--font-mono);font-size:12px;letter-spacing:0;margin-right:4px;align-self:center}
.btn{border-radius:2px}
.chip{border-radius:2px;font-family:var(--font-mono)}
.grid-paper{background-color:var(--bg);background-image:linear-gradient(var(--grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--grid-major) 1px,transparent 1px),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:110px 110px,110px 110px,22px 22px,22px 22px;background-position:-1px -1px}
.h2{font-weight:500;font-size:clamp(30px,4.4vw,62px);line-height:1.04;letter-spacing:-.025em;margin:14px 0 0;max-width:18ch}
.section-head{padding:clamp(80px,11vw,150px) 0 clamp(32px,4vw,56px)}
.section-note{color:var(--muted);max-width:56ch;margin:18px 0 0}

.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;isolation:isolate;cursor:crosshair}
.hero-gl{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(var(--grid-major) 1px,transparent 1px) 0 0/110px 110px,linear-gradient(90deg,var(--grid-major) 1px,transparent 1px) 0 0/110px 110px,radial-gradient(70% 60% at 30% 40%,color-mix(in srgb,#7fb8d6 30%,transparent),transparent),var(--bg)}
.hero[data-gl]::before{display:none}
.hero-frame{position:absolute;inset:84px clamp(14px,2.4vw,34px) 24px;border:1px solid var(--line);pointer-events:none}
.corner{position:absolute;width:14px;height:14px;border-color:var(--accent);border-style:solid;border-width:0}
.corner.tl{left:-1px;top:-1px;border-left-width:2px;border-top-width:2px}.corner.tr{right:-1px;top:-1px;border-right-width:2px;border-top-width:2px}
.corner.bl{left:-1px;bottom:-1px;border-left-width:2px;border-bottom-width:2px}.corner.br{right:-1px;bottom:-1px;border-right-width:2px;border-bottom-width:2px}
.hero-inner{padding:120px 0 160px;pointer-events:none}
.hero-inner a{pointer-events:auto}
.hero-title{font-weight:500;font-size:clamp(40px,7.2vw,116px);line-height:.98;letter-spacing:-.04em;margin:22px 0 0;max-width:13ch}
.hero-lead{max-width:46ch;font-size:clamp(16px,1.35vw,19px);color:var(--muted);margin:26px 0 0;font-weight:400}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.stamp{position:absolute;right:clamp(14px,2.4vw,34px);bottom:24px;display:grid;grid-template-columns:repeat(3,auto);border-top:1px solid var(--fg);border-left:1px solid var(--fg);background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(6px);font-family:var(--font-mono);font-size:11px}
.stamp-row{display:grid;gap:2px;padding:7px 12px;border-right:1px solid var(--fg);border-bottom:1px solid var(--fg);min-width:84px}
.stamp-wide{grid-column:span 3}
.stamp span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:10px}
.stamp b{font-weight:500;font-variant-numeric:tabular-nums}
.hero-hint{position:absolute;left:clamp(30px,4vw,60px);bottom:40px}
@media (max-width:720px){.stamp{display:none}.hero-hint{left:24px;right:24px}}

.anatomy{padding-bottom:clamp(60px,8vw,120px)}
.anatomy-board{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,2.1fr) minmax(200px,1fr);gap:clamp(16px,2.5vw,40px);align-items:center}
.board-figure{position:relative;aspect-ratio:1/1.06;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 70%,transparent)}
.board-figure .house-frame{position:absolute;inset:0}
.dim{position:absolute;color:var(--accent);font-family:var(--font-mono);font-size:11px;pointer-events:none}
.dim i{font-style:normal;background:var(--bg);padding:0 6px}
.dim-top{left:12%;right:12%;top:-22px;height:1px;background:currentColor;display:grid;place-items:center}
.dim-top::before,.dim-top::after{content:"";position:absolute;top:-5px;width:1px;height:11px;background:currentColor}
.dim-top::before{left:0}.dim-top::after{right:0}
.dim-side{top:10%;bottom:18%;right:-22px;width:1px;background:currentColor;display:grid;place-items:center}
.dim-side::before,.dim-side::after{content:"";position:absolute;left:-5px;width:11px;height:1px;background:currentColor}
.dim-side::before{top:0}.dim-side::after{bottom:0}
.dim-side i{transform:rotate(-90deg);white-space:nowrap}
.callouts{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.callouts li{position:relative;padding:14px 16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 88%,transparent);cursor:pointer;transition:border-color .3s,transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.callouts li:hover{border-color:var(--fg)}
.callouts li.is-active{border-color:var(--accent);box-shadow:4px 4px 0 var(--accent);transform:translate(-2px,-2px)}
.callouts-left li::after,.callouts-right li::after{content:"";position:absolute;top:50%;width:clamp(16px,2.5vw,40px);height:1px;background:var(--line);transition:background-color .3s}
.callouts-left li::after{left:100%}.callouts-right li::after{right:100%}
.callouts li.is-active::after{background:var(--accent)}
.callout-num{font-family:var(--font-mono);font-size:11px;color:var(--accent)}
.callouts h3{font-size:18px;font-weight:600;margin:2px 0 2px}
.callouts p{margin:0;font-size:13px;color:var(--muted)}
.callouts dl{display:grid;gap:4px;margin:10px 0 0;font-size:12px;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s,opacity .4s}
.callouts li.is-active dl{max-height:120px;opacity:1}
.callouts dl div{display:flex;justify-content:space-between;gap:8px;border-top:1px dashed var(--line);padding-top:4px}
.callouts dt{color:var(--muted)}.callouts dd{margin:0;text-align:right;font-family:var(--font-mono);font-size:11px}
@media (max-width:1000px){
  .anatomy-board{grid-template-columns:1fr 1fr}
  .board-figure{grid-column:1/-1;grid-row:1;aspect-ratio:1/1.1}
  .callouts li::after{display:none}
  .dim-side{right:6px}
}
@media (max-width:560px){.anatomy-board{grid-template-columns:1fr}.callouts dl{max-height:none;opacity:1}}

.gallery{position:relative;background:var(--bg-2);border-block:1px solid var(--line)}
.gallery-pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;gap:clamp(18px,3vh,36px)}
.gallery-head{display:flex;flex-wrap:wrap;align-items:end;gap:8px 28px;padding-top:56px}
.gallery-head .h2{flex:1 1 auto;margin:0}
.gallery-head .mono-label:first-child{flex-basis:100%}
.gallery-track{display:flex;gap:clamp(16px,2vw,32px);padding-inline:max(24px,calc((100vw - 1240px) / 2));width:max-content;will-change:transform}
.sheet{--shift:0;flex:0 0 auto;width:clamp(280px,40vw,600px);background:var(--card);border:1px solid var(--line);padding:12px;transform:rotate(calc(var(--shift) * -2deg));transition:transform .2s linear}
.sheet-art{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--line)}
.sheet-art .art{position:absolute;inset:-8% -12%;width:124%;height:116%;max-width:none;transform:translateX(calc(var(--shift) * -8%))}
.sheet footer{display:grid;grid-template-columns:auto 1fr;gap:2px 16px;align-items:baseline;padding:14px 4px 4px}
.sheet h3{margin:0;font-size:clamp(18px,1.6vw,24px);font-weight:500;letter-spacing:-.01em}
.sheet p{grid-column:2;margin:0;color:var(--muted);font-size:14px}
.gallery-rail{height:1px;background:var(--line)}
.gallery-rail span{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}

.services{padding-bottom:clamp(60px,8vw,110px);overflow:hidden}
.carousel{outline:none}
.carousel-stage{position:relative;height:clamp(340px,44vh,440px);perspective:1400px}
.slide{--o:0;--a:0;position:absolute;left:50%;top:0;width:min(440px,78vw);height:100%;margin-left:calc(min(440px,78vw) / -2);display:flex;flex-direction:column;padding:clamp(22px,3vw,36px);background:var(--card);border:1px solid var(--line);cursor:pointer;transform:translateX(calc(var(--o) * 80%)) translateZ(calc(var(--a) * -200px)) rotateY(calc(var(--o) * -14deg));opacity:calc(1 - var(--a) * .38);z-index:calc(10 - var(--a));transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .6s,border-color .4s,box-shadow .4s;user-select:none}
.slide.is-current{cursor:default;border-color:var(--fg);box-shadow:8px 8px 0 color-mix(in srgb,var(--accent) 80%,transparent)}
.slide-code{font-family:var(--font-mono);font-size:clamp(48px,6vw,80px);line-height:1;color:var(--accent);letter-spacing:-.04em}
.slide h3{margin:auto 0 10px;font-size:clamp(24px,2.4vw,32px);font-weight:500}
.slide p{margin:0;color:var(--muted)}
.carousel-nav{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:28px}
.carousel-dots{display:flex;gap:8px}
.carousel-dots button{width:28px;height:4px;padding:0;border:0;background:var(--line);cursor:pointer;transition:background-color .3s,width .3s}
.carousel-dots button[aria-current="true"]{background:var(--accent);width:44px}

.numbers{padding:clamp(60px,8vw,110px) 0;border-top:1px solid var(--line)}
.numbers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:28px 0 0;border-left:1px solid var(--line)}
.numbers-grid div{padding:18px 22px;border-right:1px solid var(--line)}
.numbers-grid dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.numbers-grid dd{margin:10px 0 0;font-size:clamp(40px,5.4vw,80px);font-weight:300;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
@media (max-width:760px){.numbers-grid{grid-template-columns:1fr 1fr}.numbers-grid div{border-bottom:1px solid var(--line)}}

.contact{padding:clamp(80px,11vw,150px) 0;border-top:1px solid var(--line)}
.contact-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end}
.contact-title{font-weight:500;font-size:clamp(40px,6.6vw,100px);line-height:.98;letter-spacing:-.04em;margin:18px 0 0}
.form{display:grid;gap:14px;padding:24px;border:1px solid var(--line);background:var(--card)}
.form label{display:grid;gap:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.form input,.form textarea{font:inherit;font-family:var(--font-body);font-size:16px;letter-spacing:0;text-transform:none;color:var(--fg);background:transparent;border:0;border-bottom:1px solid var(--line);padding:10px 0;border-radius:0;resize:vertical}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--accent)}
.form .btn{justify-self:start;margin-top:10px}
.form-note{min-height:1.5em;margin:0;color:var(--accent);font-size:14px}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr}}