@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--ground:#ffda30;--accent:#eb633e;--ink:#263e3d;--paper:#f4f5f2;--margin:clamp(22px,4.4vw,80px);--display:'Manrope',Arial,sans-serif;--body:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:17px}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid currentColor;outline-offset:7px}header{padding:26px var(--margin);display:flex;align-items:center;justify-content:space-between;background:var(--ground);position:relative;z-index:4}.logo{font-family:var(--display);font-size:36px;font-weight:800;letter-spacing:-2.5px}.logo-dot{color:var(--ink)}nav{display:flex;align-items:center;gap:38px;font-size:15px;font-weight:600}nav a{transition:transform .2s}nav a:hover{transform:translateY(-3px)}.nav-contact{background:var(--ink);color:var(--ground);padding:13px 21px;border-radius:30px}.nav-contact span{margin-left:22px}.hero{min-height:calc(100svh - 100px);padding:28px var(--margin) 24px;display:grid;grid-template-columns:1fr 1.07fr;position:relative;align-items:center;overflow:hidden}.hero-copy{z-index:2;padding:28px 0 70px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display)}h1{font-size:clamp(60px,7.6vw,126px);font-weight:800;line-height:.99;letter-spacing:-.075em}h1+p{font-size:19px;line-height:1.55;margin-top:28px}.button{display:inline-flex;gap:32px;align-items:center;justify-content:space-between;background:var(--ink);color:var(--ground);padding:17px 25px;border:0;border-radius:40px;font-size:15px;font-weight:600;transition:transform .25s,background .25s}.button:hover{transform:translateY(-4px);background:#333}.hero-copy .button{margin-top:31px}.drawing-column{min-width:0;position:relative;margin-top:-45px}.drawing{width:100%;aspect-ratio:1;position:relative;--progress:0%;isolation:isolate}.drawing img,.drawing canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.drawing img{clip-path:inset(0 calc(100% - var(--progress)) 0 0);mix-blend-mode:multiply}.drawing canvas{clip-path:inset(0 0 0 var(--progress));mix-blend-mode:multiply}.reveal-line{position:absolute;top:17%;bottom:10%;left:var(--progress);width:0;opacity:1;transition:opacity .3s}.pen{position:absolute;width:47px;height:141px;top:36%;left:-8px;transform:translate(-50%,-85%) rotate(28deg);filter:drop-shadow(4px 7px 2px #0002)}.drawing-note{position:absolute;right:5%;top:7%;font-size:15px;line-height:1.3;transform:rotate(7deg);max-width:170px}.studio-control{max-width:360px;margin:-12px auto 36px;position:relative;z-index:3}.range-label{display:flex;justify-content:space-between;align-items:center;font-size:14px}.range-label button{background:none;border:0;font-size:13px;padding:8px}input[type=range]{width:100%;accent-color:var(--ink);cursor:ew-resize;height:24px}input[type=range]::-webkit-slider-runnable-track{height:4px;background:#263e3d40;border-radius:4px}input[type=range]::-webkit-slider-thumb{appearance:none;margin-top:-6px}.hint{text-align:center;font-size:13px;margin-top:5px}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;font-size:13px;padding-top:12px}.approach{background:var(--ink);color:var(--paper);padding:110px var(--margin) 95px;min-height:90svh}.section-top{display:grid;grid-template-columns:1.3fr 1fr;gap:12%;align-items:end}h2{font-size:clamp(42px,5vw,80px);line-height:1.06;letter-spacing:-.06em;font-weight:700}.section-top>p{max-width:390px;line-height:1.7;font-size:18px}.capabilities{display:grid;grid-template-columns:repeat(3,1fr);gap:7%;margin-top:60px}.capabilities svg{width:90%;height:165px;overflow:visible}.ink{fill:none;stroke:var(--ground);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:800;stroke-dashoffset:800;transition:stroke-dashoffset 1.8s}.secondary{stroke:var(--accent)}.visible .ink{stroke-dashoffset:0}.capabilities h3{font-size:25px;letter-spacing:-1px;margin:22px 0 15px}.capabilities p{line-height:1.6;max-width:280px}.brand{background:var(--accent);min-height:90svh;display:grid;grid-template-columns:1fr 1fr;padding:70px var(--margin);align-items:center;overflow:hidden;gap:6%}.brand h2{font-size:clamp(55px,7vw,110px)}.brand p{margin-top:26px;line-height:1.6;font-size:19px}.brand .button{margin-top:30px;color:var(--accent)}.brand-art{position:relative;aspect-ratio:1;min-width:0}.brand-word{font-size:clamp(80px,12vw,190px);font-family:var(--display);font-weight:800;letter-spacing:-.08em;line-height:.82;position:absolute;left:0;top:0;color:var(--ink)}.brand-art img{position:absolute;right:-16%;bottom:-5%;width:90%;height:auto;mix-blend-mode:multiply;transform:rotate(-13deg);clip-path:ellipse(44% 37% at 50% 54%)}.concept-caption{position:absolute;bottom:-25px;font-size:13px;right:0}.contact{background:var(--paper);padding:100px var(--margin) 28px;min-height:75svh;display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px}.contact p{line-height:1.6;margin-top:25px}.contact-arrow{width:150px;height:150px;border:0;background:var(--ground);border-radius:50%;font-size:90px;transition:transform .3s}.contact-arrow:hover{transform:rotate(45deg)}footer{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-top:45px;font-size:13px}dialog{border:0;max-width:600px;width:calc(100% - 40px);padding:50px;background:var(--ground);color:var(--ink);max-height:90svh;overflow:auto}dialog::backdrop{background:#0009}dialog h2{font-size:48px}dialog p{line-height:1.6;margin:20px 0}dialog img{display:block;width:100%;height:250px;object-fit:contain;mix-blend-mode:multiply}dialog .close{position:absolute;right:20px;top:12px;background:none;border:0;font-size:30px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.reveal-item{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.reveal-item.visible{opacity:1;transform:none}@media(min-width:1600px){.hero{min-height:850px}}@media(max-width:850px){nav{gap:20px}.hero{grid-template-columns:1fr 1fr}.hero-copy{padding-bottom:40px}h1{font-size:8vw}.drawing-note{font-size:12px}.section-top{gap:7%}.section-top>p{font-size:16px}.capabilities{gap:5%}.capabilities h3{font-size:22px}.brand{gap:3%}.brand h2{font-size:7vw}.contact-arrow{width:110px;height:110px;font-size:65px}}@media(max-width:600px){header{padding-top:20px;padding-bottom:20px}.logo{font-size:30px}nav{gap:17px;font-size:13px}.nav-contact{padding:10px 15px}.nav-contact span{margin-left:9px}.hero{grid-template-columns:1fr;padding-top:20px;min-height:auto}.hero-copy{padding:10px 0 0}h1{font-size:clamp(57px,14vw,84px)}h1+p{font-size:16px;margin-top:22px}.hero-copy .button{margin-top:22px;padding:14px 21px}.drawing-column{margin-top:5px}.drawing{width:100%;margin:auto}.drawing-note{font-size:13px;right:0;top:4%}.studio-control{max-width:290px;margin:-10px auto 30px}.hero-bottom{font-size:11px;gap:15px;padding-bottom:5px}.hero-bottom span{max-width:150px}.approach{padding:70px var(--margin)}.section-top{grid-template-columns:1fr;gap:25px}h2{font-size:42px}.section-top>p{font-size:17px}.capabilities{grid-template-columns:1fr;margin-top:30px;gap:20px}.capabilities article{display:grid;grid-template-columns:110px 1fr;column-gap:18px;align-items:center}.capabilities svg{grid-row:1/3;width:105px;height:120px}.capabilities h3{font-size:23px;margin:0;align-self:end}.capabilities p{font-size:15px;align-self:start;margin-top:9px}.brand{grid-template-columns:1fr;padding:65px var(--margin);gap:35px}.brand h2{font-size:64px}.brand p{font-size:17px}.brand-art{max-height:390px}.brand-word{font-size:110px}.brand-art img{width:85%;right:-4%;bottom:1%}.contact{padding-top:70px;grid-template-columns:1fr;gap:30px}.contact h2{font-size:42px}.contact p{font-size:16px}.contact-arrow{width:90px;height:90px;font-size:58px;justify-self:end}.contact footer{padding-top:10px;flex-wrap:wrap;gap:20px}.contact footer span:last-child{width:100%}dialog{padding:40px 25px}dialog h2{font-size:40px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.reveal-item{opacity:1;transform:none}.ink{stroke-dashoffset:0}}
.brand-art img{mix-blend-mode:normal;clip-path:none;width:68%;right:-2%;bottom:0;transform:rotate(-12deg)}.drawing canvas{clip-path:inset(0 calc(100% - var(--ink-progress,100%)) 0 var(--progress))}