/* NEROVYA — studio edition. Custom, dependency-free UI. */
:root{
  --ink:#17191d;
  --ink-2:#33353a;
  --muted:#777980;
  --paper:#f5f5f7;
  --white:#ffffff;
  --blue:#2368ef;
  --blue-hover:#1454d6;
  --line:#e3e4e8;
  --ease:cubic-bezier(.22,.61,.36,1);
  --fluid-title:clamp(3.8rem,7vw,7.2rem);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;color:var(--ink);background:var(--paper);font:400 16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.menu-open{overflow:hidden}
h1,h2,h3,h4,p{margin:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
::selection{background:#b9d0ff;color:#17191d}
:focus-visible{outline:3px solid #2368ef;outline-offset:4px}
.container,.wrap{width:min(calc(100% - 64px),1180px);margin-inline:auto}
.skip-link{position:fixed;left:12px;top:-80px;z-index:200;background:#fff;padding:12px 18px;border-radius:8px}
.skip-link:focus{top:12px}
.overline{font-size:12px;font-weight:650;letter-spacing:.055em;color:#595b62}
.overline-light{color:#aeb1bd}
.section-space{padding:clamp(98px,13vw,190px) 0}
.reveal{opacity:1;transform:none;transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .reveal{opacity:0;transform:translateY(44px)}
.js .reveal.is-visible{opacity:1;transform:none}

/* A single brand wordmark is used in all brand slots. */
.site-header{height:58px;position:sticky;top:0;z-index:70;background:rgba(249,249,250,.86);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid rgba(0,0,0,.05)}
.header-inner{height:100%;display:flex;align-items:center;gap:30px}
.brand img,.footer-logo img{width:130px;height:auto}
.desktop-nav{display:flex;align-items:center;gap:34px;margin-left:auto}
.desktop-nav a{font-size:12px;color:#3a3b40;transition:color .2s}
.desktop-nav a:hover{color:#0070e8}
.header-cta{margin-left:8px;font-size:12px;color:#fff;background:#17191d;padding:8px 17px;border-radius:999px;display:inline-flex;gap:13px;align-items:center;transition:background .24s}
.header-cta:hover{background:#363b46}
.menu-toggle{display:none;margin-left:auto;background:transparent;border:0;width:38px;height:38px;position:relative}
.menu-toggle span{position:absolute;width:20px;height:1.5px;left:9px;background:#16171a;transition:transform .25s,top .25s}
.menu-toggle span:first-child{top:15px}.menu-toggle span:last-child{top:22px}
.menu-open .menu-toggle span:first-child{top:18px;transform:rotate(45deg)}.menu-open .menu-toggle span:last-child{top:18px;transform:rotate(-45deg)}
.mobile-nav{display:none}

/* HERO — near-monochrome typography and the product itself as art. */
.hero{background:#fbfbfc;overflow:hidden;padding-top:68px}
.hero-intro{text-align:center;position:relative;z-index:2}
.hero-overline{margin-bottom:23px}
.hero h1{font-size:clamp(3.85rem,8.55vw,8.25rem);line-height:.99;letter-spacing:-.087em;font-weight:720;max-width:1130px;margin-inline:auto}
.word-highlight{color:#888b94}
.hero-lead{font-size:clamp(17px,1.85vw,23px);letter-spacing:-.022em;color:#5e6067;margin-top:22px}
.hero-actions{display:flex;gap:24px;align-items:center;justify-content:center;margin-top:30px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;white-space:nowrap;border-radius:999px;min-height:48px;padding:0 23px;font-weight:580;font-size:14px;border:0;transition:transform .24s var(--ease),background .24s var(--ease),color .24s var(--ease)}
.button:hover{transform:translateY(-2px)}
.button-primary{background:var(--blue);color:#fff}
.button-primary:hover{background:var(--blue-hover)}
.button-text{color:var(--blue);padding:0 4px}
.button-text:hover{color:var(--blue-hover)}
.hero-visual{position:relative;width:min(calc(100% - 28px),1230px);margin:58px auto 0;padding:0 4.5% 84px;perspective:1800px}
.hero-visual:before{content:"";position:absolute;width:96%;height:76%;bottom:0;left:2%;background:radial-gradient(ellipse at center,#d5dcf2 0%,#ebedf3 50%,transparent 74%);filter:blur(48px);opacity:.8}
.hero-device-perspective{position:relative;transform:translateY(32px) rotateX(9deg) rotateY(-5deg) scale(.93);transform-origin:center center;opacity:.15;transition:transform 1.5s cubic-bezier(.2,.8,.2,1),opacity 1.3s ease}
.hero-device-perspective.is-ready{transform:translateY(0) rotateX(3deg) rotateY(-2deg) scale(1);opacity:1}
.website-frame{border:1px solid #cdd0d5;background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 54px 105px rgba(34,39,55,.14),0 8px 25px rgba(27,35,46,.11)}
.website-top{height:32px;background:#f7f7f9;border-bottom:1px solid #e6e6e9;display:flex;align-items:center;gap:12px;padding:0 14px;color:#94969b}
.website-controls{display:flex;gap:6px}.website-controls i{width:8px;height:8px;border:1px solid #c9cbd0;border-radius:50%}
.website-url{font-size:11px;background:#eeeeef;border-radius:5px;line-height:20px;min-width:190px;margin:auto;text-align:center}
.website-top-icon{font-size:12px}
.editorial-website{height:clamp(340px,47vw,610px);background:#e9e7e1;position:relative;overflow:hidden}
.editorial-nav{position:absolute;z-index:4;left:4%;right:4%;top:4.3%;display:flex;align-items:center;justify-content:space-between;color:#262c2b;font-size:clamp(8px,1.15vw,14px)}
.editorial-nav strong{font-size:clamp(22px,2.6vw,34px);font-weight:800;letter-spacing:-.08em}.editorial-nav strong span{font-size:.35em;vertical-align:top;padding-left:2px}
.editorial-main{position:absolute;inset:0;display:grid;grid-template-columns:46% 54%}
.editorial-copy{position:relative;z-index:5;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:8% 4% 6% 9%}
.editorial-copy>span:first-child{font-size:clamp(7px,.95vw,12px);text-transform:uppercase;letter-spacing:.15em;color:#747776;font-weight:650}
.editorial-copy h2{font-size:clamp(48px,7vw,108px);font-weight:670;letter-spacing:-.09em;line-height:.96;margin:28px 0 16px;color:#303532}
.editorial-copy p{font-size:clamp(10px,1.6vw,18px);color:#747873}
.editorial-explore{display:inline-block;border-bottom:1px solid #303531;padding-bottom:8px;margin-top:clamp(20px,3.5vw,55px);font-size:clamp(9px,1.1vw,14px)!important;letter-spacing:0!important;text-transform:none!important;color:#303531!important}
.architecture-visual{position:relative;overflow:hidden;background:linear-gradient(165deg,#a0afb4,#d7d9d4 48%,#999c91)}
.architecture-sky{position:absolute;inset:0;background:linear-gradient(155deg,#8fabb4 0%,#e5e4da 55%,#c0bdb5 100%)}
.architecture-building{position:absolute;inset:10% 0 -18% 8%;filter:drop-shadow(-26px 17px 30px rgba(28,35,33,.24))}
.arch-face{position:absolute;left:20%;top:4%;height:106%;width:76%;background:linear-gradient(95deg,#bfc0b9 0%,#eeece3 24%,#d8d6ce 58%,#a0a198 100%);clip-path:polygon(0 6%,100% 0,100% 100%,0 100%)}
.arch-side{position:absolute;left:2%;top:8%;height:103%;width:22%;background:linear-gradient(90deg,#797b74,#b3b4ab);clip-path:polygon(0 0,100% 4%,100% 100%,0 100%)}
.arch-arch{position:absolute;top:18%;left:32%;height:92%;width:42%;border-radius:48% 48% 0 0 / 22% 22% 0 0;background:linear-gradient(115deg,#555954 3%,#777b75 25%,#aaa99f 55%,#313c3c 100%);box-shadow:inset 26px 0 35px rgba(0,0,0,.38),inset -9px 0 16px rgba(255,255,255,.1)}
.arch-window{position:absolute;top:20%;left:52%;height:70%;width:2px;background:rgba(229,227,211,.28)}
.arch-shadow{position:absolute;left:24%;right:3%;top:8%;height:12%;transform:skewY(-4deg);background:linear-gradient(180deg,rgba(50,57,53,.3),transparent)}
.editorial-bottom{position:absolute;z-index:4;left:4%;right:4%;bottom:4.6%;display:flex;align-items:center;justify-content:space-between;font-size:clamp(7px,.95vw,12px);color:#2f3432}
.hero-visual-note{position:relative;color:#8a8c91;text-align:right;font-size:11px;margin-top:17px}

/* Statement / reveal */
.belief{background:#fff}
.belief-wrap{max-width:1090px}
.belief-title{font-size:clamp(42px,6.2vw,92px);line-height:1.14;letter-spacing:-.071em;font-weight:675;margin-top:34px;color:#202126}
.belief-title span{color:#a0a2a8}
.word-unit{display:inline-block;opacity:.18;transform:translateY(18px);transition:opacity .55s var(--ease),transform .65s var(--ease)}
.word-unit.is-on{opacity:1;transform:none}
.word-unit.is-muted{color:#8f9198}

/* Scroll chapter is 360vh; the sticky viewport scrubs transforms in JS. */
.scrolly{height:350vh;background:#0a0c0f;color:#fff;position:relative}
.scrolly-sticky{position:sticky;top:0;height:100svh;min-height:660px;overflow:hidden;background:radial-gradient(ellipse at 65% 50%,#22262d,#0a0c0f 69%)}
.scrolly-sticky:before{content:"";position:absolute;inset:0;opacity:.23;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px);background-size:100% 80px;pointer-events:none}
.scrolly-content{position:relative;height:100%;display:grid;grid-template-columns:39% 61%;gap:12px;align-items:center}
.scrolly-copy{position:relative;z-index:4}
.scrolly-copy h2{font-size:clamp(52px,5.2vw,82px);line-height:1.02;font-weight:665;letter-spacing:-.075em;margin-top:28px}
.scrolly-copy h2 em{font-style:normal;color:#aaaeb9}
.chapter-copy{height:156px;position:relative;margin-top:38px}
.chapter{position:absolute;inset:0;opacity:0;transform:translateY(26px);font-size:clamp(25px,3vw,44px);line-height:1.15;letter-spacing:-.05em;color:#b6bac4;transition:none}
.chapter.is-current{opacity:1;transform:none}
.story-meter{height:2px;background:#3a3d43;width:215px;position:relative;overflow:hidden}
.story-meter span{position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
.scrolly-art{height:76vh;min-height:480px;position:relative;display:flex;justify-content:center;align-items:center;perspective:1350px}
.story-device{width:min(100%,720px);aspect-ratio:1.35;background:#eae9e5;border:8px solid #101216;border-radius:20px;box-shadow:0 45px 90px rgba(0,0,0,.5),0 0 0 1px #484c53;position:relative;transform-style:preserve-3d;overflow:hidden;transform:rotateY(-17deg) rotateX(7deg) scale(.8);will-change:transform}
.story-browser-head{height:30px;background:#f7f7f7;display:flex;align-items:center;gap:5px;padding:0 14px}
.story-browser-head i{width:6px;height:6px;border:1px solid #c5c4c4;border-radius:50%}
.story-browser-head span{font-size:10px;color:#999;position:absolute;left:43%}
.story-wireframe,.story-finished{position:absolute;inset:30px 0 0;transition:none}
.story-wireframe{background:#f5f5f5;opacity:1}
.story-wireframe span{position:absolute;display:block;background:#d7d9dd;border-radius:3px}
.wire-logo{top:9%;left:7%;height:11px;width:15%}.wire-menu{top:9%;right:7%;height:8px;width:24%}
.wire-title{left:7%;height:31px}.wire-title-a{top:28%;width:42%}.wire-title-b{top:37%;width:31%}
.wire-sub{left:7%;top:53%;width:34%;height:9px}.wire-image{right:6%;top:21%;width:42%;height:59%;border-radius:8px!important}.wire-footer{bottom:8%;left:7%;height:8px;width:80%}
.story-finished{background:#dddcd4;opacity:0;color:#313731;overflow:hidden}
.story-nav{position:absolute;z-index:3;top:6%;left:6%;right:6%;display:flex;justify-content:space-between;align-items:center}.story-nav b{font-size:clamp(14px,2vw,27px);letter-spacing:-.08em}.story-nav small{font-size:clamp(8px,1vw,13px)}
.story-finished h3{position:absolute;z-index:4;left:7%;top:27%;font-size:clamp(52px,6.5vw,92px);line-height:.95;letter-spacing:-.095em;font-weight:690}
.story-structure{position:absolute;left:48%;right:0;top:10%;bottom:0;overflow:hidden;filter:drop-shadow(-14px 16px 22px rgba(0,0,0,.2))}
.story-structure span{position:absolute;display:block;background:linear-gradient(90deg,#b9bbb2,#e8e5dc 30%,#b5b8ae 80%,#8c9087)}
.story-structure span:nth-child(1){inset:3% 5% -2% 26%;clip-path:polygon(0 9%,100% 0,100% 100%,0 100%)}
.story-structure span:nth-child(2){left:30%;top:35%;bottom:-8%;width:43%;background:linear-gradient(100deg,#484f4c,#767e76 35%,#a9aba0);border-radius:48% 48% 0 0 / 18% 18% 0 0;box-shadow:inset 12px 0 28px rgba(0,0,0,.28)}
.story-structure span:nth-child(3){left:3%;top:9%;bottom:0;width:25%;clip-path:polygon(0 0,100% 8%,100% 100%,0 100%);background:linear-gradient(100deg,#949991,#c0c2b8)}
.story-footer{position:absolute;z-index:5;left:6%;right:6%;bottom:5%;display:flex;justify-content:space-between;color:#39413d}.story-footer small{font-size:clamp(7px,1vw,11px)}
.story-phone{position:absolute;right:-2%;bottom:8%;width:160px;height:330px;border:7px solid #101113;border-radius:32px;background:#dddbd2;box-shadow:0 35px 70px rgba(0,0,0,.55);overflow:hidden;padding:22px 15px;opacity:0;transform:translate(110px,120px) rotate(18deg) scale(.8);will-change:transform,opacity}
.phone-island{position:absolute;top:7px;left:50%;transform:translateX(-50%);width:62px;height:15px;border-radius:999px;background:#121212}
.story-phone>span{display:block;font-size:13px;letter-spacing:-.08em;font-weight:800;margin-top:8px;color:#333}
.story-phone>strong{position:relative;z-index:2;display:block;font-size:35px;line-height:.95;letter-spacing:-.08em;color:#333;margin-top:32px}
.phone-building{position:absolute;left:28%;right:-25%;bottom:-10%;top:42%;background:linear-gradient(90deg,#b3b7ae,#e5e5da 40%,#949c94);clip-path:polygon(0 10%,100% 0,100% 100%,0 100%);box-shadow:-12px 10px 20px rgba(0,0,0,.3)}

/* Interactive work selector */
.interactive{background:#fff}
.section-head h2{font-size:clamp(46px,6.6vw,94px);line-height:1.08;font-weight:675;letter-spacing:-.077em;margin:22px 0 18px}
.section-head h2 span{color:#989ba2}
.section-head>p:last-child{color:#70747d;font-size:clamp(16px,1.8vw,20px)}
.design-lab{margin-top:68px;display:grid;grid-template-columns:265px minmax(0,1fr);gap:32px;align-items:stretch}
.design-picker{display:flex;flex-direction:column;justify-content:center;border-top:1px solid var(--line)}
.design-choice{appearance:none;border:0;border-bottom:1px solid var(--line);background:transparent;display:flex;justify-content:space-between;align-items:center;padding:26px 4px;text-align:left;font-size:18px;font-weight:580;color:#9c9fa6;transition:color .24s}
.design-choice span:last-child{font-size:21px;opacity:0;transform:translateX(-7px);transition:opacity .24s,transform .24s}
.design-choice:hover,.design-choice.is-selected{color:#17191d}
.design-choice.is-selected span:last-child{opacity:1;transform:none}
.design-picker p{font-size:11px;color:#9d9fa5;line-height:1.6;margin-top:22px;max-width:210px}
.lab-stage{height:520px;border-radius:22px;overflow:hidden;position:relative;background:#e9e7e1;isolation:isolate;box-shadow:0 26px 62px rgba(16,20,34,.13)}
.lab-scene{position:absolute;inset:0;opacity:0;transform:scale(1.055);pointer-events:none;transition:opacity .6s var(--ease),transform .8s var(--ease)}
.lab-scene.is-selected{opacity:1;transform:scale(1);pointer-events:auto}
.lab-atelier{background:#d8d7cb;color:#2a332c}
.lab-atelier-menu,.lab-mesa-menu,.lab-kin-menu{position:absolute;z-index:3;top:7%;left:7%;right:7%;display:flex;justify-content:space-between;align-items:center;font-size:12px}
.lab-atelier-menu strong{font-size:26px;letter-spacing:-.08em}
.lab-atelier-content,.lab-mesa-content,.lab-kin-content{position:absolute;inset:0;display:grid;grid-template-columns:52% 48%}
.lab-atelier-content>div:first-child,.lab-mesa-content>div:first-child,.lab-kin-content>div:first-child{padding:25% 0 10% 13%;position:relative;z-index:2}
.lab-atelier-content span,.lab-mesa-content span,.lab-kin-content span{font-size:12px;letter-spacing:.025em}
.lab-atelier-content h3,.lab-mesa-content h3,.lab-kin-content h3{font-size:clamp(46px,5vw,76px);line-height:.98;font-weight:620;letter-spacing:-.085em;margin-top:15px}
.lab-atelier-content b,.lab-mesa-content b,.lab-kin-content b{display:inline-block;margin-top:38px;font-size:13px;font-weight:580}
.lab-atelier-art{position:relative;overflow:hidden;background:linear-gradient(150deg,#b4bbc0,#d9dbd6 35%,#918f82 100%)}
.atelier-tower{position:absolute;left:8%;right:-22%;top:12%;bottom:-12%;background:linear-gradient(90deg,#a6a59e,#eeeae0 35%,#aeaca5 80%);clip-path:polygon(7% 7%,100% 0,100% 100%,0 100%);filter:drop-shadow(-12px 20px 28px rgba(0,0,0,.15))}
.atelier-window{position:absolute;z-index:2;left:31%;width:43%;height:80%;top:38%;background:linear-gradient(125deg,#3e4540,#929d95 48%,#2d3a35);border-radius:50% 50% 0 0 / 24% 24% 0 0;box-shadow:inset 18px 0 30px rgba(0,0,0,.32)}
.atelier-shade{position:absolute;z-index:2;left:0;right:0;bottom:0;height:20%;background:linear-gradient(transparent,rgba(12,15,12,.18))}
.lab-mesa{background:#17382c;color:#f7eede}
.lab-mesa-menu strong{font-family:Georgia,serif;font-size:31px;letter-spacing:-.05em}
.lab-mesa-content h3{font-family:Georgia,serif;font-size:clamp(47px,5vw,76px);font-weight:400;letter-spacing:-.065em}
.mesa-still-life{position:relative;overflow:hidden;background:radial-gradient(circle at 60% 45%,#47725a,#18382c 68%)}
.mesa-plate{position:absolute;width:335px;max-width:90%;aspect-ratio:1;top:13%;right:7%;border-radius:50%;background:radial-gradient(circle at 45% 37%,#faf7e8 0,#e7e4d6 55%,#b2bdaf 70%,#fffbe7 73%,#dddfd2 82%);box-shadow:16px 28px 48px rgba(0,0,0,.29)}
.mesa-rim{position:absolute;inset:13%;border-radius:50%;border:2px solid rgba(107,119,93,.24)}
.mesa-food{position:absolute;top:26%;left:33%;width:35%;height:35%;border-radius:50% 41% 53% 48%;background:radial-gradient(circle at 28% 28%,#d6e39e,#718a49 56%,#526d3a);box-shadow:4px 6px 12px rgba(24,55,33,.27);transform:rotate(28deg)}
.mesa-leaf{position:absolute;top:20%;left:50%;width:11%;height:24%;background:linear-gradient(145deg,#4f7d4a,#9fbc72);border-radius:5% 100% 5% 100%;transform:rotate(-25deg)}
.lab-kin{background:#11131a;color:#f2f5fc}
.lab-kin-menu strong{font-size:32px;letter-spacing:-.07em}
.lab-kin-menu strong span{color:#96ff73}
.lab-kin-content{background:radial-gradient(circle at 80% 45%,rgba(116,255,116,.12),transparent 40%)}
.lab-kin-content h3{font-size:clamp(50px,5vw,80px);font-weight:740}
.lab-kin-content b{color:#a7fa92}
.kin-headphones{position:absolute;left:58%;width:36%;top:22%;height:58%;transform:rotate(-17deg);filter:drop-shadow(18px 28px 23px rgba(0,0,0,.5))}
.kin-band{position:absolute;left:14%;top:0;width:72%;height:70%;border:27px solid #a9b9ad;border-bottom:0;border-radius:150px 150px 0 0;box-shadow:inset 7px 0 9px rgba(255,255,255,.34),6px -4px 15px rgba(0,0,0,.38)}
.kin-ear{position:absolute;top:49%;height:41%;width:27%;background:linear-gradient(90deg,#7e908a,#cedbd2 42%,#798985);border-radius:34px;box-shadow:7px 10px 17px rgba(0,0,0,.32)}
.kin-ear-l{left:7%;transform:rotate(6deg)}.kin-ear-r{right:7%;transform:rotate(-6deg)}
.kin-light{position:absolute;bottom:-8%;left:2%;right:2%;height:16px;background:#aaff8d;filter:blur(25px);opacity:.4}

/* Capabilities—no SaaS cards */
.offer{background:var(--paper)}
.offer-list{margin-top:75px;border-top:1px solid #d9d9df}
.offer-row{padding:30px 8px;border-bottom:1px solid #d9d9df;display:flex;justify-content:space-between;gap:20px;align-items:center;transition:color .28s,padding .28s}
.offer-row h3{font-size:clamp(24px,3vw,41px);font-weight:610;letter-spacing:-.05em}
.offer-row span{font-size:30px;font-weight:300}
.offer-row:hover{color:var(--blue);padding-left:20px}
.method{background:#fff}
.method-line{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:65px}
.method-part{border-top:1px solid #dadbdf;padding-top:24px}
.method-symbol{height:64px;display:flex;align-items:center;font-size:32px;font-weight:300;color:#979ba5}
.method-part h3{font-size:24px;letter-spacing:-.05em;font-weight:620;margin-bottom:8px}
.method-part p{color:#80838b;font-size:15px}

/* Finale */
.finale{background:#111317;color:#fff;position:relative;overflow:hidden}
.finale-wrap{min-height:650px;display:flex;align-items:center;padding:105px 0;position:relative}
.finale-text{position:relative;z-index:2}
.finale h2{font-size:clamp(74px,10vw,145px);line-height:.9;letter-spacing:-.09em;margin:28px 0 24px}
.finale h2 em{font-style:normal;color:#9d9fa6}
.finale-text>p:not(.overline){color:#bbbfc8;font-size:18px;max-width:450px;line-height:1.6}
.button-finale{margin-top:32px;background:#f5f5f7;color:#1b1b1f}
.button-finale:hover{background:#dedfe3}
.finale-graphic{position:absolute;right:0;top:12%;width:49%;height:80%;perspective:1000px;opacity:.85}
.finale-plane{position:absolute;display:block;width:300px;height:310px;border-radius:28px;border:1px solid rgba(255,255,255,.17);box-shadow:0 20px 80px rgba(0,0,0,.3)}
.finale-plane-one{left:8%;top:18%;background:linear-gradient(130deg,#858b96,#303741 65%,#0c0d11);transform:rotate(-25deg) skewY(7deg)}
.finale-plane-two{left:27%;top:7%;background:linear-gradient(130deg,rgba(248,250,255,.62),rgba(90,101,123,.27));transform:rotate(-7deg) skewY(7deg);backdrop-filter:blur(5px)}
.finale-plane-three{left:44%;top:22%;background:linear-gradient(130deg,#d4d8e0,#5c626a 66%,#1f242b);transform:rotate(19deg) skewY(6deg)}

/* Quote / PHP states and legal pages */
.quote-hero,.internal-header{padding:112px 0 55px;background:#fbfbfc}
.back-link{display:inline-block;color:#2368ef;font-size:14px;margin-bottom:26px}
.quote-hero h1,.internal-header h1{font-size:clamp(52px,7vw,100px);line-height:.98;letter-spacing:-.075em;margin:16px 0 22px}
.quote-hero>div>p:last-child,.internal-header>div>p:last-child{color:#6d7078;font-size:20px;max-width:520px}
.quote-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:75px;padding:65px 0 130px}
.quote-intro h2{font-size:30px;letter-spacing:-.05em;font-weight:670;margin-bottom:16px}
.quote-intro p{font-size:15px;line-height:1.75;color:#71747b}
.quote-intro .quote-steps{margin-top:34px;display:grid;gap:16px}
.quote-steps span{font-size:14px;color:#46494f;border-bottom:1px solid #dfe0e4;padding-bottom:12px}
.quote-form-shell{background:#fff;border-radius:24px;box-shadow:0 22px 68px rgba(20,23,37,.055);padding:43px 48px 46px}
.form-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:650;color:#737780;letter-spacing:.01em}
.form-meter{height:3px;background:#e8e8ed;margin:24px 0 36px;overflow:hidden;border-radius:10px}
.form-meter span{display:block;width:33.33%;height:100%;background:#2368ef;transition:width .4s ease}
.quote-form fieldset{border:0;padding:0;margin:0;display:none}
.quote-form fieldset.active{display:block}
.quote-form legend{font-size:37px;font-weight:660;letter-spacing:-.06em}
.form-subtext{margin:8px 0 33px;color:#8b8e96;font-size:14px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px}
.field{margin-bottom:21px}.field label{font-size:13px;font-weight:610;display:block;color:#32353d}.field label i{font-style:normal;color:#2368ef}
.field input,.field select,.field textarea{display:block;width:100%;border:1px solid #dcdee5;border-radius:10px;background:#fbfbfc;color:#202125;font-size:15px;margin-top:8px;padding:15px 16px;outline:none;min-height:51px;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:122px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#2368ef;box-shadow:0 0 0 3px rgba(35,104,239,.11)}
.field input::placeholder,.field textarea::placeholder{color:#a1a3aa}
.checkbox-row{display:flex;gap:12px;align-items:start;font-size:13px;color:#676a72;line-height:1.5}
.checkbox-row input{margin-top:4px}.checkbox-row a{color:#2368ef;text-decoration:underline}.checkbox-row b{color:#2368ef}
.form-actions{display:flex;gap:16px;margin-top:28px;align-items:center;flex-wrap:wrap}
.btn-primary{background:#2368ef;color:#fff;border:0;border-radius:999px;padding:14px 25px;font-weight:600}
.btn-back{border:0;background:none;color:#656971;padding:14px 7px}
.btn-primary[hidden],.btn-back[hidden]{display:none!important}
.form-error{background:#fff1f0;border:1px solid #ffa9a0;color:#8c271f;padding:14px 17px;margin-top:20px;border-radius:9px;font-size:14px}
.form-error[hidden]{display:none}
.honeypot{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.legal-wrap{padding:40px 0 120px}.legal-content{max-width:850px;font-size:16px;color:#575b64;line-height:1.8}
.legal-placeholder{background:#fff1d6;border-left:3px solid #bd7e15;padding:20px;margin-bottom:30px;color:#63451a}
.legal-content h2{font-size:25px;color:#1e2228;letter-spacing:-.035em;margin:30px 0 9px}
.legal-content p{line-height:1.8}
.page-thanks .internal-header{min-height:72vh;display:flex;align-items:center}

/* Footer */
.site-footer{background:#f5f5f7;border-top:1px solid #e7e7eb;padding:49px 0 28px}
.footer-main{display:grid;grid-template-columns:1fr 2fr;gap:45px 22px}
.footer-link-group{display:flex;align-items:center;justify-content:flex-end;gap:26px;flex-wrap:wrap;font-size:12px;color:#666970}
.footer-link-group a:hover{color:var(--blue)}
.footer-last{grid-column:1/-1;border-top:1px solid #e2e3e6;padding-top:21px;display:flex;justify-content:space-between;gap:20px;color:#92949a;font-size:11px}

/* Responsive */
@media(max-width:1100px){
  .scrolly-content{grid-template-columns:41% 59%}.story-phone{right:-4%}
  .hero-device-perspective{transform:none}
  .architecture-building{inset:10% 0 -18% 0}
  .method-line{gap:20px}
}
@media(max-width:820px){
  .container,.wrap{width:calc(100% - 40px)}.site-header{height:60px}
  .desktop-nav,.header-cta{display:none}.menu-toggle{display:block}
  .mobile-nav{position:fixed;top:60px;left:0;right:0;display:flex;flex-direction:column;padding:10px 24px 28px;background:rgba(249,249,251,.98);border-bottom:1px solid #dedee4;box-shadow:0 20px 30px rgba(0,0,0,.07)}
  .mobile-nav[hidden]{display:none!important}
  .mobile-nav a{padding:18px 0;font-size:20px;font-weight:600;border-bottom:1px solid #ececf0}
  .hero{padding-top:80px}.hero h1{font-size:clamp(52px,10vw,84px)}.hero-visual{margin-top:65px}
  .scrolly-sticky{min-height:600px}.scrolly-content{grid-template-columns:1fr;display:flex;flex-direction:column;justify-content:flex-start;padding-top:75px}
  .scrolly-copy{width:100%}.scrolly-copy h2{font-size:58px;margin-top:16px}.chapter-copy{height:65px;margin-top:20px}.chapter{font-size:25px}.story-meter{position:absolute;right:0;top:30px;width:100px}
  .scrolly-art{width:100%;flex:1;height:auto;min-height:300px}.story-device{max-width:570px}.story-phone{width:125px;height:250px;right:8%;bottom:2%;border-radius:26px}.story-phone>strong{font-size:27px}
  .design-lab{grid-template-columns:1fr;gap:24px}.design-picker{flex-direction:row;border:0;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}.design-choice{flex:1;min-width:150px;border-bottom:2px solid #dedfe3;padding:12px 0;font-size:15px}.design-choice.is-selected{border-color:#1b1d22}.design-picker p{width:100%;max-width:none;margin:4px 0 0}
  .lab-stage{height:520px}.lab-atelier-content h3,.lab-mesa-content h3,.lab-kin-content h3{font-size:65px}
  .method-line{grid-template-columns:repeat(2,1fr);row-gap:42px}
  .finale-graphic{right:-20%;opacity:.32}
  .quote-layout{grid-template-columns:1fr;gap:35px}.quote-intro .quote-steps{display:none}
}
@media(max-width:560px){
  .container,.wrap{width:calc(100% - 34px)}.brand img,.footer-logo img{width:120px}
  .hero{padding-top:65px}.hero-overline{font-size:11px}.hero h1{font-size:clamp(46px,12vw,66px)}
  .hero-lead{font-size:17px;max-width:300px;margin:18px auto 0}.hero-actions{flex-direction:column;gap:4px;margin-top:26px}
  .hero-visual{width:100%;padding:0 0 58px;margin-top:54px}.hero-device-perspective{margin-left:0;width:100%;transform:rotateX(0) rotateY(0) scale(1)}.hero-device-perspective.is-ready{transform:none}
  .website-frame{border-radius:8px}.website-top{height:23px}.website-url{font-size:8px;line-height:14px;min-width:110px}
  .editorial-website{height:310px}.editorial-nav{top:6%}.editorial-nav strong{font-size:18px}.editorial-nav>span{display:none}
  .editorial-main{grid-template-columns:54% 46%}.editorial-copy{padding-left:9%}.editorial-copy h2{font-size:46px;margin:18px 0 11px}.editorial-copy>span:first-child{font-size:7px}.editorial-copy p{font-size:9px}.editorial-explore{font-size:8px!important;margin-top:26px}
  .editorial-bottom{font-size:7px}.hero-visual-note{margin-right:18px;font-size:10px}
  .section-space{padding:104px 0}.belief-title{font-size:clamp(38px,10vw,58px)}
  .scrolly{height:300vh}.scrolly-sticky{height:100svh;min-height:0}.scrolly-content{padding-top:59px}.scrolly-copy h2{font-size:clamp(47px,13vw,60px)}
  .chapter-copy{height:59px;margin-top:24px}.chapter{font-size:23px}.story-meter{width:82px;top:27px}
  .scrolly-art{min-height:230px}.story-device{border-width:5px;border-radius:12px}.story-browser-head{height:18px}.story-browser-head span{font-size:7px}.story-wireframe,.story-finished{inset:18px 0 0}
  .story-finished h3{font-size:43px}.story-phone{right:-3%;width:95px;height:194px;border-width:5px;border-radius:20px;padding:14px 10px}.phone-island{width:36px;height:9px;top:5px}.story-phone>span{font-size:9px}.story-phone>strong{font-size:23px;margin-top:25px}
  .section-head h2{font-size:clamp(43px,11vw,62px)}.section-head>p:last-child{font-size:16px}.design-lab{margin-top:43px}.design-choice{font-size:14px;min-width:0}
  .lab-stage{height:410px;border-radius:14px}.lab-atelier-content,.lab-mesa-content,.lab-kin-content{grid-template-columns:1fr 1fr}
  .lab-atelier-content>div:first-child,.lab-mesa-content>div:first-child,.lab-kin-content>div:first-child{padding:54% 0 12% 15%}
  .lab-atelier-content h3,.lab-mesa-content h3,.lab-kin-content h3{font-size:clamp(34px,8vw,52px)}
  .lab-atelier-content span,.lab-mesa-content span,.lab-kin-content span{font-size:9px}.lab-atelier-content b,.lab-mesa-content b,.lab-kin-content b{font-size:10px;margin-top:24px}
  .lab-atelier-menu,.lab-mesa-menu,.lab-kin-menu{font-size:9px}.lab-atelier-menu strong,.lab-mesa-menu strong,.lab-kin-menu strong{font-size:20px}
  .mesa-plate{top:27%;width:230px;right:-13%}.kin-headphones{left:54%;width:52%;top:27%;height:50%}.kin-band{border-width:19px}.kin-ear{border-radius:22px}
  .offer-list{margin-top:47px}.offer-row{padding:27px 0}.offer-row h3{font-size:24px;max-width:280px}.offer-row span{font-size:25px}
  .method-line{grid-template-columns:1fr 1fr;gap:38px 15px;margin-top:43px}.method-symbol{font-size:27px;height:45px}.method-part h3{font-size:20px}.method-part p{font-size:13px}
  .finale-wrap{min-height:600px;padding:90px 0}.finale h2{font-size:clamp(63px,15vw,95px)}.finale-graphic{right:-70%;width:100%;opacity:.19}.finale-text>p:not(.overline){font-size:16px;max-width:310px}
  .quote-hero,.internal-header{padding:75px 0 50px}.quote-hero h1,.internal-header h1{font-size:58px}.quote-layout{padding:28px 0 90px}.quote-form-shell{padding:27px 19px 33px;border-radius:15px}.quote-form legend{font-size:31px}.field-grid{grid-template-columns:1fr;gap:0}.form-heading{font-size:11px}.form-actions .btn-primary{width:100%}
  .footer-main{display:flex;flex-direction:column;gap:25px}.footer-link-group{justify-content:flex-start;gap:14px 21px}.footer-last{width:100%;flex-direction:column;gap:7px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}
 .reveal,.hero-device-perspective{opacity:1!important;transform:none!important}
 .word-unit{opacity:1!important;transform:none!important}
}
