:root{--bg:#ff775c;--ink:#271e1c;--paper:#fff7ee;--line:#271e1c55;}
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px;align-items:center;min-height:760px}.cut-heading h1{font-weight:900;margin:35px 0}.hero-bottom{display:grid;gap:28px;justify-items:start}.cut-heading .small{font-family:monospace}.hero .scene{margin-right:-6vw}.stack-card{position:sticky;top:26px;background:var(--paper);border:1px solid var(--ink);padding:30px;margin-bottom:80px}.stack-card:nth-child(2){top:46px}.stack-card:nth-child(3){top:66px}.stack-card p{margin-top:16px}.landscape{height:230px;background:#d9bba0;position:relative;overflow:hidden;margin:25px 0}.landscape:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;background:#fff7ee;top:25px;right:20%}.landscape:after{content:"";position:absolute;inset:100px -10% -80px;background:#706e51;transform:rotate(16deg)}.landscape-1{background:#c6c8a5}.landscape-1:after{transform:rotate(-13deg)}.landscape-2:before{width:280px;height:280px;top:70px}.frame-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,.8fr);gap:45px}.frame-grid p{margin-top:18px}.connection{max-width:1280px;width:92%;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:45px}.match-shapes{grid-column:1/-1;display:flex;justify-content:center;align-items:center;gap:12%;padding:25px}.match-shapes i{width:130px;height:130px;border:16px solid var(--ink);border-radius:50%}.match-shapes i:last-child{border-radius:0}.sound-lines{height:240px;display:flex;align-items:center;justify-content:space-around;background:var(--ink);padding:40px}.sound-lines i{height:var(--h);width:9px;background:var(--bg)}.login-page main{max-width:1150px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:50px;background:var(--paper);border:1px solid var(--ink);margin:60px auto;min-height:650px;padding:45px}.login-scene{border-right:2px dashed var(--ink);padding-right:35px}.login-page{background:var(--bg)}@media(max-width:850px){.hero,.connection,.frame-grid{grid-template-columns:minmax(0,1fr)}.hero{min-height:0}.hero .scene{margin-right:0}.stack-card{position:relative;top:auto!important;margin-bottom:30px}.login-page main{width:90%;grid-template-columns:minmax(0,1fr);padding:28px;margin:28px auto}.login-scene{border:0;padding:0}.match-shapes{gap:30px}.match-shapes i{width:80px;height:80px}.hero h1{font-size:clamp(54px,13vw,95px)}}@media(max-height:650px){.stack-card{position:relative;top:auto!important}}