:root{--bg:#ECECEC;--ink:#111111;--grey:#7A7A7A;--line:rgba(0,0,0,.18);--accent:#FF4A3D;
  --sans:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;--serif:"Instrument Serif",Georgia,serif;--light:"Inter Tight","Inter",sans-serif;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:500 12px/1.3 var(--sans);letter-spacing:.01em;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.grey{color:var(--grey)}
.u{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.u:hover{color:var(--grey)}

/* ===== shared chrome ===== */
.burger{position:fixed;left:20px;top:26px;width:58px;height:16px;z-index:40;background:none;border:0;cursor:pointer;padding:0}
.burger i{position:absolute;left:0;right:0;height:1px;background:var(--ink);transition:transform .5s var(--ease),top .5s var(--ease)}
.burger i:first-child{top:2px}.burger i:last-child{top:13px}
.burger.is-open i:first-child{top:7px;transform:rotate(12deg)}.burger.is-open i:last-child{top:7px;transform:rotate(-12deg)}
.logo{position:fixed;top:22px;left:50%;transform:translateX(-50%);z-index:40;font:800 20px/1 var(--sans);letter-spacing:-.03em;white-space:nowrap}
.logo sup{font-size:9px;font-weight:600;vertical-align:top;margin-left:1px}
.inq{position:fixed;left:20px;bottom:22px;z-index:12;display:grid;gap:4px}
.hint{position:fixed;right:20px;bottom:22px;z-index:12;color:var(--grey)}
@media (max-width:720px){.hint{display:none}}

/* ===== home ===== */
html.home,html.home body{height:100%;overflow:hidden;overscroll-behavior:none}
#gl{position:fixed;inset:0;width:100%;height:100%;z-index:1;touch-action:none}
.counter{position:fixed;left:20px;top:108px;z-index:12;display:flex;gap:12px;align-items:flex-start;pointer-events:none}
.counter b{font:300 90px/0.9 var(--light);letter-spacing:-.04em;display:inline-grid}
.counter b span{grid-area:1/1;transition:opacity .5s var(--ease),transform .6s var(--ease)}
.counter b span.out{opacity:0;transform:translateY(-30%)}
.counter b span.in{opacity:0;transform:translateY(30%)}
.counter small{font:500 12px var(--sans);margin-top:8px}
.caption{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);z-index:12;text-align:center;width:min(560px,88vw);pointer-events:none}
.caption .cat{color:var(--grey)}
.caption .title{font:400 42px/1.15 var(--serif);text-transform:uppercase;letter-spacing:.005em;margin:6px 0 12px;pointer-events:auto}
.caption .title a:hover{color:var(--grey)}
.caption .rule{width:24px;height:1px;background:var(--line);margin:0 auto 14px}
.caption .desc{max-width:46ch;margin:0 auto;line-height:1.35}
.caption>*{transition:opacity .45s var(--ease),transform .55s var(--ease)}
.caption.switch>*{opacity:0;transform:translateY(8px)}
.swatches{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:12;display:flex;gap:10px}
.swatches i{width:22px;height:22px;display:block;transition:background .6s}
@media (max-width:720px){.counter{top:92px}.counter b{font-size:64px}.caption{bottom:78px;width:86vw}.caption .title{font-size:28px}.caption .desc{font-size:12px}.swatches{bottom:26px}.swatches i{width:18px;height:18px}}

/* ===== overlays ===== */
.overlay{position:fixed;inset:0;z-index:30;background:var(--bg);opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s .5s}
.overlay.is-open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.menu-tag{position:absolute;left:20px;top:30vh;line-height:1.35}
.menu-links{position:absolute;left:20px;top:56vh;list-style:none}
.menu-links a{display:flex;align-items:center;gap:6px;font:400 clamp(40px,5.2vw,72px)/1 var(--serif);text-transform:uppercase;letter-spacing:.005em;padding:4px 0;transition:color .3s}
.menu-links a::before{content:"→";display:inline-block;width:0;overflow:hidden;transition:width .4s var(--ease);font-family:var(--sans);font-weight:300;font-size:.75em}
.menu-links a:hover::before,.menu-links a.is-active::before{width:1.1em}
.menu-links a:hover{color:var(--grey)}
.menu-foot-l{position:absolute;left:20px;bottom:22px;display:grid;gap:4px}
.menu-foot-r{position:absolute;right:20px;bottom:22px;text-align:right;display:grid;gap:4px}
.overlay .menu-links li{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.overlay.is-open .menu-links li{opacity:1;transform:none}
.overlay.is-open .menu-links li:nth-child(2){transition-delay:.06s}.overlay.is-open .menu-links li:nth-child(3){transition-delay:.12s}.overlay.is-open .menu-links li:nth-child(4){transition-delay:.18s}
.contact-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,88vw);display:grid;gap:22px}
.contact-card h2{font:400 34px/1 var(--serif);text-transform:uppercase}
.contact-card .crow{display:grid;gap:4px}
.contact-card .crow a{font-size:14px;width:max-content}
.close-x{position:absolute;right:20px;top:24px;cursor:pointer;background:none;border:0;font:inherit;color:var(--ink)}
@media (max-width:720px){.menu-tag{top:120px}.menu-links{top:34vh}}

/* ===== preloader ===== */
.pre{position:fixed;inset:0;z-index:100;background:#fff;display:grid;place-items:center;overflow:hidden}
.pre .name{font:400 clamp(44px,11vw,160px)/.92 var(--serif);text-transform:uppercase;color:var(--accent);text-align:center;letter-spacing:-.01em}
.pre .curtain{position:absolute;inset:0 0 0 auto;width:100%;background:#111;transform:translateX(100%)}
.pre.run .curtain{animation:wipe 1.5s var(--ease) .35s forwards}
.pre.run{animation:preout .01s linear 1.75s forwards}
.pre.run .name{animation:nameout .6s var(--ease) .9s forwards}
@keyframes wipe{0%{transform:translateX(100%)}50%{transform:translateX(0)}100%{transform:translateX(-100%)}}
@keyframes nameout{to{opacity:0;transform:translateY(-20px)}}
@keyframes preout{to{visibility:hidden;opacity:0}}
.pre.done{display:none}

/* ===== inner pages ===== */
.page{padding:0 20px 0;max-width:1800px;margin:0 auto}
.ptitle{text-align:center;font:400 clamp(44px,6.6vw,110px)/1 var(--serif);text-transform:uppercase;letter-spacing:.005em;color:var(--pcolor,var(--accent));padding:190px 0 100px;transition:opacity .8s var(--ease),transform .9s var(--ease)}
.rows{display:grid;gap:56px}
.row{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:start}
.row .label{color:var(--grey)}
.row .val{max-width:95ch;line-height:1.35}
.row .val p+p{margin-top:12px}
.inline{display:flex;gap:60px;flex-wrap:wrap}
.inline .pair{display:flex;gap:16px}
.visit{display:inline-block;font:500 22px/1 var(--sans);text-decoration:underline;text-underline-offset:4px;margin-top:10px}
.visit:hover{color:var(--grey)}
.gallery{margin-top:170px;display:grid;gap:16px}
.gallery figure{margin:0;overflow:hidden;background:#ddd}
.gallery img{width:100%;height:auto;display:block;transform:scale(1.04);transition:transform 1.4s var(--ease);will-change:transform}
.gallery figure.in img{transform:none}
.next{min-height:100vh;display:grid;place-items:center;text-align:center;gap:10px;align-content:center}
.next a{font:400 clamp(36px,4.6vw,64px)/1 var(--serif);text-transform:uppercase;transition:color .3s}
.next a:hover{color:var(--grey)}
.portrait{width:min(360px,70vw);aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);display:block;margin:0 auto 90px}
ul.plain{list-style:none;display:grid;gap:6px}
.xp{list-style:none;display:grid;gap:10px}
.xp li{display:grid;grid-template-columns:110px 1fr;gap:16px}
.xp li span{color:var(--grey)}
@media (max-width:720px){.row{grid-template-columns:1fr;gap:8px}.ptitle{padding:150px 0 70px}.rows{gap:40px}.gallery{margin-top:100px}}

/* ===== blueprint page ===== */
.bp-form{display:grid;gap:18px}
textarea{width:100%;min-height:120px;resize:vertical;background:transparent;border:0;border-bottom:1px solid var(--line);outline:0;color:var(--ink);font:400 clamp(24px,2.6vw,36px)/1.25 var(--serif);padding:8px 0 18px}
textarea::placeholder{color:#9a9a9a}
textarea:focus{border-bottom-color:var(--ink)}
.bp-row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.chips{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.chip{font:inherit;background:none;border:0;color:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.chip:hover{color:var(--grey)}
.btn-ink{font:500 12px var(--sans);letter-spacing:.01em;background:var(--ink);color:#fff;border:0;padding:14px 20px;border-radius:999px;cursor:pointer;transition:opacity .25s}
.btn-ink:hover{opacity:.8}
.btn-ink[disabled]{opacity:.5;cursor:progress}
.fine{color:var(--grey)}
.bp-status{padding:16px 0;border-top:1px solid var(--line);margin-top:20px}
.bp-status.err{color:var(--accent)}
.bp-status .spin{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ink);margin-right:10px;animation:pulse 1s infinite;vertical-align:middle}
@keyframes pulse{0%,100%{transform:scale(.6);opacity:.4}50%{transform:scale(1.2);opacity:1}}
.bp-status a{text-decoration:underline;text-underline-offset:3px}
.bp-result{margin-top:90px;padding-top:40px;border-top:1px solid var(--line)}
.bp-head{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.bp-head h2{font:400 clamp(32px,4.4vw,64px)/1.05 var(--serif);text-transform:uppercase;max-width:22ch}
.verdict{padding:7px 12px;border:1px solid var(--line);border-radius:999px}
.verdict.automate{background:var(--ink);color:#fff;border-color:var(--ink)}
.bp-summary{font-size:16px;line-height:1.4;max-width:60ch;margin-bottom:40px}
.flow{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.flow h3{color:var(--grey);font-weight:500;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.steps{list-style:none;counter-reset:st}
.step{counter-increment:st;display:grid;grid-template-columns:28px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid rgba(0,0,0,.08);opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.step::before{content:counter(st,decimal-leading-zero);color:var(--grey);padding-top:2px}
.step.in{opacity:1;transform:none}
.step .t{font-size:15px;line-height:1.3}
.step .m{grid-column:2;color:var(--grey);margin-top:6px;display:flex;gap:14px;flex-wrap:wrap}
.today .step.in .t{text-decoration:line-through;color:var(--grey)}
.mode{padding:2px 7px;border:1px solid var(--line);border-radius:999px}
.mode.automated{border-color:var(--ink);color:var(--ink)}
.arrow{display:none}
.bp-big{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:60px;padding-top:30px;border-top:1px solid var(--line)}
.big .n{font:400 clamp(90px,14vw,210px)/.85 var(--serif);letter-spacing:-.02em;color:var(--accent)}
.big .u{margin-top:14px;text-decoration:none}
.big .math{color:var(--grey);margin-top:14px;max-width:44ch;line-height:1.4}
.facts{display:grid;gap:22px;align-content:start}
.fact h4{color:var(--grey);font-weight:500;margin-bottom:6px}
.fact p{font-size:15px;line-height:1.4}
.tools{display:flex;gap:8px;flex-wrap:wrap}
.tools span{padding:4px 10px;border:1px solid var(--line);border-radius:999px}
.bp-cta{display:flex;gap:30px;flex-wrap:wrap;align-items:center;margin-top:50px;padding-top:24px;border-top:1px solid var(--line)}
.bp-cta p{flex:1;min-width:240px;font-size:15px}
.bp-cta .btn{all:unset;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.mock-note{color:var(--grey);margin-top:16px}
@media (max-width:760px){.flow,.bp-big{grid-template-columns:1fr;gap:40px}}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}.step{opacity:1;transform:none}.pre{display:none}}