:root{--c-dark: #323a42;--c-grey: #849298;--c-green-light: #83bc3a;--c-green: #27a737;--c-white: #ffffff;--c-paper: #fdfdfc;--c-line: rgba(50, 58, 66, .1);--c-error: #c0392b;--font-title: "Advent Pro", "Raleway", sans-serif;--font-body: "Raleway", sans-serif;--section-pad-y: clamp(4.5rem, 9vw, 9rem);--section-pad-x: clamp(1.5rem, 6vw, 6rem);--content-max: 1240px;--ease-out: cubic-bezier(.22, 1, .36, 1)}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--c-paper);color:var(--c-dark);font-family:var(--font-body);font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}ul{margin:0;padding:0;list-style:none}h1,h2,h3{font-family:var(--font-title);font-weight:600;letter-spacing:.02em;margin:0}p{margin:0}button{font-family:inherit;cursor:pointer}.skip-link{position:absolute;left:-999px;top:0;background:var(--c-dark);color:var(--c-white);padding:.75rem 1.25rem;z-index:1000}.skip-link:focus{left:1rem;top:1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}section[id]{scroll-margin-top:2rem}.nav-mark{position:fixed;top:1.5rem;left:1.5rem;width:60px;z-index:110;transition:opacity .3s var(--ease-out)}.nav-mark:hover{opacity:1}.nav{position:fixed;top:1.5rem;right:1.5rem;z-index:110}.nav-links{display:flex;align-items:center;gap:clamp(1rem,2vw,1.75rem);padding:.65rem 1.5rem .4rem;background-color:#ffffff6e;border-radius:2em;transition:background .4s var(--ease-out),box-shadow .4s var(--ease-out)}.nav-links a{position:relative;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:var(--c-dark);padding-bottom:.2rem}.nav-links a:after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:1.5px;background:var(--c-green);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-out)}.nav-links a:hover:after,.nav-links a.is-active:after{transform:scaleX(1)}.nav-links a.is-active{color:var(--c-green)}@media(max-width:640px){.nav-mark{width:50px;top:1rem;left:1rem}.nav{top:1rem;right:1rem;left:1rem;display:flex;justify-content:flex-end}.nav-links{gap:.85rem;padding:.55rem 1rem .4rem;overflow-x:auto;max-width:calc(100vw - 2rem)}.nav-links a{font-size:.7rem;white-space:nowrap}}@media(max-width:320px){.nav-mark{width:40px;left:.3rem}}.hero{max-width:none;margin:0;padding:0;position:relative;height:140vh}.hero-pin{--logo-w: 190px;position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--c-paper)}.hero-blocks{position:absolute;top:50%;left:50%;width:calc(var(--logo-w) * 3.6);height:calc(var(--logo-w) * 4.6);display:flex;transform:translate(-50%,-50%) rotate(37.6deg);z-index:0;will-change:transform;margin-left:-80px}.hero-blocks .block{height:100%;will-change:transform,opacity}.block-dark{flex:7.8;background:var(--c-dark);z-index:2}.block-grey{flex:6;background:var(--c-grey);height:120%!important;margin-left:-107px;z-index:1;margin-top:-50px}.block-green-light{flex:7;background:var(--c-green-light);z-index:3;height:150%!important;margin-left:-81px;margin-top:-206px}.block-green{flex:9;background:var(--c-green);z-index:4;margin-left:-191px;margin-top:-118px}.hero-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.75rem;padding:0 1.5rem}.hero-logo{width:var(--logo-w);height:auto;will-change:transform,opacity}.hero-tagline{font-family:var(--font-title);font-style:italic;font-size:1.6rem;color:var(--c-white);will-change:transform,opacity}.hero-skills{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem .9rem;max-width:550px;will-change:transform,opacity}.hero-skills li{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-dark);padding:.4rem .9rem;border:1px solid var(--c-line);border-radius:999px;background:#ffffff8c}.scroll-cue{margin-top:1.5rem;width:26px;height:42px;border:1.5px solid var(--c-dark);border-radius:999px;background:transparent;position:relative;padding:0;will-change:transform,opacity}.scroll-cue-dot{position:absolute;top:7px;left:50%;width:4px;height:8px;margin-left:-2px;border-radius:999px;background:var(--c-dark);animation:scroll-cue-move 1.8s ease-in-out infinite}@keyframes scroll-cue-move{0%{transform:translateY(0);opacity:1}60%{transform:translateY(14px);opacity:0}61%{transform:translateY(0);opacity:0}to{transform:translateY(0);opacity:1}}.scroll-cue-finger{display:none}@media(max-width:640px){.hero{height:200vh}.hero-skills{max-width:320px}.hero-blocks{width:calc(var(--logo-w) * 3.6);height:calc(var(--logo-w) * 11.6);margin-left:-90px}.scroll-cue{border:none}.scroll-cue-dot{display:none}.scroll-cue-finger{display:block;position:relative;width:100%;height:100%}.scroll-cue-finger-track{position:absolute;left:50%;top:2px;bottom:2px;width:1.5px;margin-left:-.75px;background:var(--c-line)}.scroll-cue-finger-tip{position:absolute;left:50%;bottom:2px;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:var(--c-dark);box-shadow:0 0 0 4px var(--c-paper);animation:scroll-cue-swipe 1.6s ease-in-out infinite}}@keyframes scroll-cue-swipe{0%{transform:translateY(0);opacity:0}20%{opacity:1}75%{opacity:1}to{transform:translateY(-34px);opacity:0}}main>section{position:relative;padding:var(--section-pad-y) var(--section-pad-x);max-width:var(--content-max);margin:0 auto}.section-head{display:flex;flex-direction:column;gap:clamp(0,.75rem);margin-bottom:clamp(2.5rem,5vw,4rem);max-width:640px}.section-index{font-family:var(--font-title);font-size:.9rem;letter-spacing:.15em;color:var(--c-green)}.section-head h2{font-size:clamp(1.8rem,4.5vw,3rem)}.section-lead{font-size:1.05rem;color:var(--c-grey);max-width:46ch}.real-wrap{max-width:none;margin:0;padding:0;position:relative}.real-pin{--real-title-space: 8rem;--real-content-max: 1440px;position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--section-pad-y) + var(--real-title-space)) var(--section-pad-x) var(--section-pad-y);max-width:var(--real-content-max);margin:0 auto}.real-title{position:fixed;top:var(--section-pad-y);left:0;right:0;max-width:var(--real-content-max);margin:0 auto;padding:0 var(--section-pad-x);z-index:2;pointer-events:none;opacity:0}.real-stage{display:grid;grid-template-columns:minmax(0,min(788px,calc((100vh - var(--section-pad-y) * 2 - var(--real-title-space)) * 4 / 3))) minmax(300px,460px);gap:clamp(1rem,5vw,4rem);align-items:center}.real-visuals-viewport{position:relative;overflow:hidden;border-radius:20px;border:1px solid var(--c-line);will-change:transform,opacity;aspect-ratio:4 / 3;width:100%}.real-visuals{display:flex;height:100%;will-change:transform}.real-visual{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:.8rem;background:var(--c-line)}.real-visual img{width:100%;height:100%;object-fit:cover}.real-visual-label{font-family:var(--font-title);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-grey)}.real-info{display:flex;flex-direction:column;gap:.85rem;will-change:transform,opacity}.real-info-meta{display:flex;flex-direction:column;gap:.4rem}.real-info-count{font-family:var(--font-title);font-size:.85rem;letter-spacing:.1em;color:var(--c-grey)}.real-info-type{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-green)}.real-info-name{font-size:clamp(1.5rem,3vw,2.2rem)}.real-info-desc{color:var(--c-grey);max-width:42ch}@media(max-width:1024px){.real-stage{grid-template-columns:1fr}.real-pin{justify-content:flex-start;--real-title-space: 3.5rem}.real-title{flex-direction:row;align-items:baseline;gap:.85rem}.real-info-meta{flex-direction:row;justify-content:space-between;align-items:baseline}.real-visuals-viewport{width:min(100%,calc(38vh * 4 / 3));margin:0 auto}.real-info-desc{max-width:none}}.webdev-wrap{max-width:none;margin:0;padding:0;position:relative}.webdev-pin{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(2rem,5vw,3.5rem);padding:var(--section-pad-y) var(--section-pad-x);max-width:var(--content-max);margin:0 auto}.webdev-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5rem);align-items:center}.webdev-subtitle{font-family:var(--font-title);font-size:clamp(1.3rem,2.4vw,1.75rem);color:var(--c-dark);line-height:1.5}.dev-word{display:inline-block}.dev-char{display:inline-block;will-change:clip-path}.webdev-stack{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.tech-item{position:relative;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;padding:.9rem;border:1px solid var(--c-line);border-radius:12px;will-change:transform,opacity}.tech-item img{width:100%;max-width:52px;height:auto;object-fit:contain;filter:grayscale(1);transition:filter .3s var(--ease-out)}.tech-item:hover img{filter:grayscale(0)}.tech-tooltip{position:absolute;bottom:calc(100% + .6rem);left:50%;transform:translate(-50%,4px);font-family:var(--font-title);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:var(--c-white);background:var(--c-dark);padding:.4rem .85rem;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .25s var(--ease-out),transform .25s var(--ease-out)}.tech-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:var(--c-dark)}.tech-item:hover .tech-tooltip,.tech-item:focus-visible .tech-tooltip{opacity:1;transform:translate(-50%)}@media(max-width:860px){.webdev-grid{grid-template-columns:1fr}.webdev-pin{gap:1.5rem}.webdev-grid{gap:1.25rem}.webdev-stack{grid-template-columns:repeat(5,1fr);gap:.5rem}.tech-item{padding:.4rem;border-radius:8px}.tech-item img{max-width:26px}}.clients-wrap{max-width:none;margin:0;padding:0;position:relative}.clients-pin{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(2rem,5vw,3.5rem);padding:var(--section-pad-y) var(--section-pad-x);max-width:var(--content-max);margin:0 auto}.clients-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.25rem}.client-logo{aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;padding:1.25rem;border:1px solid var(--c-line);border-radius:12px;will-change:transform,opacity}.client-logo img{width:100%;max-width:210px;height:auto;object-fit:contain;filter:grayscale(1);transition:filter .3s var(--ease-out)}.client-logo:hover img{filter:grayscale(0)}.client-logo img.is-narrow{width:70%;max-width:147px}@media(max-width:1024px){.clients-pin{gap:1.25rem;padding-top:clamp(2.5rem,6vw,var(--section-pad-y));padding-bottom:clamp(2.5rem,6vw,var(--section-pad-y))}.clients-grid{grid-template-columns:repeat(3,1fr);gap:.6rem;max-width:380px;margin:0 auto}.client-logo{padding:.5rem;border-radius:10px}}.contact-wrap{max-width:none;margin:0;padding:0;position:relative}.contact-pin{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(2rem,5vw,3.5rem);padding:var(--section-pad-y) var(--section-pad-x);max-width:var(--content-max);margin:0 auto}.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(2.5rem,6vw,5rem);align-items:start}.contact-info ul{display:flex;flex-direction:column;gap:1.75rem}.js [data-contact-phone],.js [data-contact-email]{clip-path:inset(0 100% 0 0);will-change:clip-path}.contact-label{display:block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-grey);margin-bottom:.3rem}.contact-info a{font-family:var(--font-title);font-size:1.3rem;border-bottom:1px solid transparent;transition:border-color .3s var(--ease-out),color .3s var(--ease-out)}.contact-info a:hover{color:var(--c-green);border-color:var(--c-green)}.contact-form{display:flex;flex-direction:column;gap:1.5rem}.form-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.js [data-form-item]{opacity:0;will-change:opacity,transform}.form-row{display:flex;flex-direction:column;gap:.5rem}.form-row label{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-grey)}.form-row input,.form-row textarea{font-family:var(--font-body);font-size:1rem;color:var(--c-dark);background:transparent;border:none;border-bottom:1px solid var(--c-line);padding:.6rem .1rem;resize:vertical;transition:border-color .3s var(--ease-out)}.form-row input:focus,.form-row textarea:focus{outline:none;border-color:var(--c-green)}.btn-submit{align-self:flex-start;margin-top:.5rem;font-family:var(--font-title);font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-white);background:var(--c-dark);border:none;border-radius:999px;padding:.85rem 2.2rem;transition:background .3s var(--ease-out),transform .3s var(--ease-out)}.btn-submit:hover{background:var(--c-green);transform:translateY(-2px)}.btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}.form-row.has-error input,.form-row.has-error textarea{border-color:var(--c-error)}.form-actions{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}.form-status{font-size:.85rem}.form-status[data-state=error]{color:var(--c-error)}.form-status[data-state=success]{color:var(--c-green)}@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:1rem}.contact-pin{justify-content:flex-start;gap:.25rem;padding-top:max(clamp(2rem,6vw,var(--section-pad-y)),5.5rem);padding-bottom:clamp(1rem,6vw,var(--section-pad-y))}.contact-pin .section-head{margin-bottom:.5rem}.contact-info ul{gap:.5rem}.contact-form{gap:.6rem}.form-row{gap:.25rem}.form-row textarea{height:3.75rem}}.site-footer{display:flex;flex-direction:column;align-items:center;gap:1.1rem;text-align:center;padding:4.5rem var(--section-pad-x) 3rem;border-top:1px solid var(--c-line);color:var(--c-grey)}.footer-logo{width:60px}.footer-tagline{font-family:var(--font-title);font-style:italic;color:var(--c-green)}.footer-contact{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.5rem;font-size:.85rem}.footer-contact a:hover{color:var(--c-green)}.footer-copy{font-size:.78rem;margin-top:.5rem}