:root{--black:#04050A;--bg:#04050A;--panel:rgba(16,19,30,.55);--panel-2:rgba(22,26,40,.6);--line:rgba(255,255,255,.09);--line-2:rgba(255,255,255,.16);--white:#F4F6FB;--text:#E4E7EF;--muted:#8A90A2;--faint:#757C90;--blue:#4D7CFF;--blue-soft:#6E93FF;--violet:#8A5CFF;--violet-soft:#A87BFF;--orange:#FF6B35;--cyan:#38E1FF;--grad-1:linear-gradient(120deg,#4D7CFF,#8A5CFF 60%,#FF6B35 120%);--grad-text:linear-gradient(120deg,#F4F6FB,#A87BFF 55%,#6E93FF 100%);--glow-violet:0 0 40px rgba(138,92,255,.35);--violet-btn:#8150FF;--blue-btn:#3268FF;--grad-btn:linear-gradient(120deg,#3268FF,#8150FF 60%,#E0561F 120%);--display:'Space Grotesk','Grotesk Fallback',system-ui,sans-serif;--body:'Inter','Inter Fallback',system-ui,sans-serif;--mono:'Space Mono','Mono Fallback',monospace;--ease:cubic-bezier(.22,1,.36,1);--gutter:clamp(1.5rem,5vw,6rem)}@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/space-grotesk.woff2') format('woff2')}@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/inter.woff2') format('woff2')}@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/space-mono.woff2') format('woff2')}@font-face{font-family:'Grotesk Fallback';src:local('Arial');size-adjust:107.91%;ascent-override:90.82%;descent-override:26.87%;line-gap-override:0%}@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:106.66%;ascent-override:90.94%;descent-override:22.50%;line-gap-override:0%}@font-face{font-family:'Mono Fallback';src:local('Courier New');size-adjust:101.98%;ascent-override:109.82%;descent-override:35.30%;line-gap-override:0%}@keyframes heroRise{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}@keyframes heroRiseOpaque{from{transform:translateY(44px)}to{transform:none}}#enter .ch-tag,#enter .ch-desc,#enter .hero-cred,#enter .hero-cta-row{animation:heroRise .95s cubic-bezier(.215,.61,.355,1) both}#enter .ch-title{animation:heroRiseOpaque .95s cubic-bezier(.215,.61,.355,1) both}#enter .ch-desc{animation-delay:.18s}#enter .hero-cred{animation-delay:.27s}#enter .hero-cta-row{animation-delay:.36s}@media(prefers-reduced-motion:reduce){#enter .ch-tag,#enter .ch-title,#enter .ch-desc,#enter .hero-cred,#enter .hero-cta-row{animation:none}}*{margin:0;padding:0;box-sizing:border-box}.ch-tag{max-width:100%;white-space:normal}:focus{outline:none}:focus-visible{outline:2px solid var(--violet-soft);outline-offset:3px;border-radius:6px}.nav-menu a:focus-visible,.nav-cta:focus-visible,.btn:focus-visible,.jprog a:focus-visible{outline:2px solid var(--violet-soft);outline-offset:3px}.c-card:focus-visible,.fcard:focus-visible,.xp-card:focus-visible{outline:2px solid var(--violet-soft);outline-offset:4px}.skip{position:absolute;left:-9999px;top:0;z-index:10001;padding:.9rem 1.4rem;border-radius:0 0 10px 0;background:var(--violet-btn);color:#fff;font-size:.95rem;font-weight:500}.skip:focus{left:0}html{-webkit-font-smoothing:antialiased;scroll-behavior:auto;overflow-x:hidden}body{font-family:var(--body);background:var(--bg);color:var(--text);line-height:1.55;overflow-x:hidden}body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:none}::selection{background:rgba(138,92,255,.35);color:#fff}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit}img{display:block;max-width:100%}canvas{display:block}#world{position:fixed;inset:0;z-index:0;pointer-events:none}.bg-orbs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.bg-orbs i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.4;mix-blend-mode:screen}.bg-orbs i:nth-child(1){width:50vw;height:50vw;left:-12vw;top:-12vw;background:radial-gradient(circle,rgba(77,124,255,.5),transparent 70%)}.bg-orbs i:nth-child(2){width:44vw;height:44vw;right:-12vw;top:30vh;background:radial-gradient(circle,rgba(138,92,255,.45),transparent 70%)}.bg-orbs i:nth-child(3){width:34vw;height:34vw;left:22vw;bottom:-14vw;background:radial-gradient(circle,rgba(255,107,53,.25),transparent 70%)}.grain{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.vignette{position:fixed;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.5) 100%)}.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%)}.cursor-dot{width:6px;height:6px;background:var(--white)}.cursor-ring{width:38px;height:38px;border:1px solid rgba(255,255,255,.35);transition:width .3s var(--ease),height .3s var(--ease),background .3s,border-color .3s}.cursor-ring.hover{width:64px;height:64px;background:rgba(138,92,255,.12);border-color:rgba(138,92,255,.6)}@media(pointer:coarse){.cursor-dot,.cursor-ring{display:none}}.loader{position:fixed;inset:0;z-index:10000;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.2rem;transition:opacity 1s ease}.loader .spark{width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 20px 6px rgba(138,92,255,.9),0 0 60px 20px rgba(77,124,255,.5);animation:sparkGrow 2.4s var(--ease) forwards}@keyframes sparkGrow{0%{transform:scale(0)}40%{transform:scale(1)}100%{transform:scale(1)}}.loader-mark{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,6vw,4rem);letter-spacing:-.03em;color:var(--white);opacity:0;animation:fadeUp 1s ease .8s forwards}.loader-mark .dot{color:var(--violet)}.loader-line{font-family:var(--mono);font-size:.72rem;letter-spacing:.4em;text-transform:uppercase;color:var(--muted);opacity:0;animation:fadeUp 1s ease 1.1s forwards}.loader-bar{width:min(300px,55vw);height:1px;background:rgba(255,255,255,.12);overflow:hidden;opacity:0;animation:fadeUp 1s ease 1.3s forwards}.loader-bar i{display:block;height:100%;width:0;background:var(--grad-1)}.loader-pct{font-family:var(--mono);font-size:.72rem;letter-spacing:.3em;color:var(--faint);opacity:0;animation:fadeUp 1s ease 1.3s forwards}@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.loader.done{opacity:0;pointer-events:none}.nav{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:1.3rem var(--gutter);transition:transform .5s var(--ease),background .4s;pointer-events:auto}.nav.hide{transform:translateY(-110%)}.nav.solid{background:rgba(4,5,10,.55);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav-logo{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.02em}.nav-logo b{color:var(--violet)}.nav-menu{display:flex;gap:.3rem;padding:.35rem;border:1px solid var(--line);border-radius:100px;background:var(--panel);backdrop-filter:blur(20px)}.nav-menu a{font-size:.9rem;padding:.5rem 1.05rem;border-radius:100px;color:var(--muted);transition:color .3s,background .3s}.nav-menu a:hover,.nav-menu a.active{color:var(--white);background:rgba(255,255,255,.07)}.nav-cta{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:500;padding:.65rem 1.2rem;border-radius:100px;border:1px solid var(--line-2);background:var(--panel);backdrop-filter:blur(20px);transition:border-color .3s,box-shadow .3s}.nav-cta:hover{border-color:var(--violet);box-shadow:var(--glow-violet)}.pulse{width:7px;height:7px;border-radius:50%;background:#3BE38B;box-shadow:0 0 10px #3BE38B;animation:pulse 2s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}@media(max-width:900px){.nav{padding:1rem 1.2rem;gap:.8rem}.nav-cta{display:none}.nav-menu{overflow-x:auto;max-width:70vw;scrollbar-width:none;-webkit-overflow-scrolling:touch}.nav-menu::-webkit-scrollbar{display:none}.nav-menu a{font-size:.72rem;padding:.8rem .85rem;white-space:nowrap;min-height:44px;display:flex;align-items:center}.nav-logo{min-height:44px;display:flex;align-items:center}}.jprog{position:fixed;right:1.6rem;top:50%;transform:translateY(-50%);z-index:800;display:flex;flex-direction:column;gap:.9rem;align-items:center}.jprog a{width:8px;height:8px;border-radius:50%;border:1px solid var(--faint);transition:all .3s;display:block}.jprog a.on{background:var(--violet);border-color:var(--violet);box-shadow:0 0 12px rgba(138,92,255,.8)}@media(max-width:900px){.jprog{display:none}}.chapter{position:relative;z-index:5;pointer-events:none}.chapter .pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:0 var(--gutter);max-width:1600px;margin:0 auto}.chapter .pin>*{pointer-events:auto}.ch-tag{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.76rem;letter-spacing:.3em;text-transform:uppercase;color:var(--blue-soft);padding:.5rem 1rem;border:1px solid var(--line);border-radius:100px;background:var(--panel);backdrop-filter:blur(12px);width:max-content;margin-bottom:1.8rem}.ch-title{font-family:var(--display);font-weight:700;line-height:.95;letter-spacing:-.04em;font-size:clamp(2.6rem,8.5vw,7.5rem);color:var(--white)}.ch-title em{font-style:normal;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}.ch-desc{margin-top:1.6rem;font-size:clamp(.95rem,1.3vw,1.12rem);color:var(--muted);max-width:480px;line-height:1.7}.ch-hint{position:absolute;bottom:2.2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.75rem;letter-spacing:.25em;color:var(--faint);text-transform:uppercase}.ch-hint .track{width:1px;height:44px;background:linear-gradient(var(--violet),transparent);overflow:hidden;position:relative}.ch-hint .track i{position:absolute;top:0;left:0;width:100%;height:40%;background:#fff;animation:scrolldot 2s var(--ease) infinite}@keyframes scrolldot{0%{transform:translateY(-100%)}100%{transform:translateY(280%)}}#enter{height:112svh}#enter .hero-cta-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.6rem}.btn{position:relative;display:inline-flex;align-items:center;gap:.7rem;font-weight:500;font-size:.9rem;padding:1rem 1.9rem;border-radius:100px;overflow:hidden;transition:transform .3s var(--ease),box-shadow .4s}.btn-primary{background:var(--grad-btn);color:#fff;box-shadow:0 8px 30px rgba(77,124,255,.3)}.btn-primary:hover{box-shadow:0 12px 45px rgba(138,92,255,.5)}.btn-ghost{border:1px solid var(--line-2);background:var(--panel);backdrop-filter:blur(14px);color:var(--white)}.btn-ghost:hover{border-color:var(--violet)}.btn svg{width:15px;height:15px}#showcase{height:128svh}#skills{height:112svh}#career{height:135svh}.chapter.right .pin{align-items:flex-end;text-align:right}.chapter.right .ch-desc{margin-left:auto}.floors{margin-top:2.4rem;display:flex;flex-direction:column;gap:.9rem;max-width:560px}.floor{display:flex;gap:1.4rem;align-items:flex-start;padding:1.2rem 1.5rem;border:1px solid var(--line);border-radius:14px;background:var(--panel);backdrop-filter:blur(16px);opacity:.35;transform:translateX(30px);transition:opacity .5s,transform .6s var(--ease),border-color .4s}.floor.on{opacity:1;transform:none;border-color:rgba(138,92,255,.4)}.floor-no{font-family:var(--mono);font-size:.75rem;color:var(--violet-soft);letter-spacing:.15em;padding-top:.25rem;white-space:nowrap}.floor-role{font-family:var(--display);font-weight:600;font-size:1.05rem;color:var(--white)}.floor-co{font-size:.95rem;color:var(--muted);margin-top:.15rem}.floor-note{font-size:.95rem;color:var(--faint);margin-top:.45rem;line-height:1.55}.skill-legend{margin-top:2.2rem;display:flex;flex-wrap:wrap;gap:.6rem;max-width:560px}.skill-chip{font-family:var(--mono);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;padding:.55rem 1rem;border:1px solid var(--line);border-radius:100px;background:var(--panel);backdrop-filter:blur(12px);color:var(--muted);transition:all .3s}.skill-chip b{font-weight:400}.skill-chip:hover{color:var(--white);border-color:var(--violet);box-shadow:var(--glow-violet)}.contact-card{margin-top:2.4rem;display:flex;flex-direction:column;gap:1rem;max-width:460px;padding:1.8rem;border:1px solid var(--line-2);border-radius:20px;background:var(--panel-2);backdrop-filter:blur(24px)}.contact-row{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem;border:1px solid var(--line);border-radius:12px;transition:border-color .3s,background .3s,transform .3s var(--ease)}.contact-row:hover{border-color:var(--violet);background:rgba(138,92,255,.08);transform:translateX(6px)}.contact-row svg{width:18px;height:18px;color:var(--violet-soft);flex-shrink:0}.contact-row .lbl{font-family:var(--mono);font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint)}.contact-row .val{font-size:1rem;color:var(--white)}#work{position:relative;z-index:5;background:rgba(4,5,10,.82);backdrop-filter:blur(6px);border-top:1px solid var(--line);padding:8rem var(--gutter);pointer-events:auto}.work-head{max-width:1600px;margin:0 auto 3rem}.work-head .ch-title{font-size:clamp(2.4rem,6.5vw,5.5rem)}.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin:2.4rem 0 3rem;max-width:1600px;margin-inline:auto}.fbtn{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;padding:.65rem 1.35rem;border:1px solid var(--line);border-radius:100px;color:var(--muted);background:var(--panel);backdrop-filter:blur(12px);transition:all .3s}.fbtn:hover{color:var(--white);border-color:var(--line-2)}.fbtn.on{background:var(--grad-1);border-color:transparent;color:#fff;box-shadow:0 6px 24px rgba(138,92,255,.35)}.feat-cta{max-width:1600px;margin:3.5rem auto 0;display:flex;justify-content:center}.c-stage{position:relative;width:100%;height:760px;perspective:2000px;perspective-origin:50% 50%;margin-top:3rem;overflow:hidden}.c-track{position:relative;width:100%;height:100%;transform-style:preserve-3d}.c-card{position:absolute;width:480px;height:720px;top:50%;left:50%;margin-top:-360px;margin-left:-240px;overflow:hidden;border-radius:20px;will-change:transform,opacity;border:1px solid var(--line);transition:transform .75s cubic-bezier(.4,0,.2,1),opacity .75s ease,filter .75s ease,border-color .4s,box-shadow .5s}.c-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}.c-card-grad{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,5,10,.98) 0%,rgba(4,5,10,.88) 28%,rgba(4,5,10,.45) 58%,rgba(4,5,10,.08) 100%)}.c-card-body{position:absolute;bottom:0;left:0;right:0;padding:2rem 2rem 2.2rem;transform:translateY(8px);opacity:0;transition:opacity .45s ease,transform .45s ease}.c-card-tag{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--violet-soft);margin-bottom:.6rem}.c-card-title{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2.6vw,2.2rem);line-height:1.1;letter-spacing:-.02em;color:#fff;margin-bottom:.55rem;text-shadow:0 2px 18px rgba(0,0,0,.6);overflow-wrap:anywhere}.c-card-sub{font-size:clamp(.85rem,1.1vw,.95rem);color:rgba(255,255,255,.82);margin-bottom:1.5rem;text-shadow:0 1px 10px rgba(0,0,0,.6)}.c-card-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.7rem;border-radius:100px;border:1px solid rgba(138,92,255,.55);background:transparent;color:var(--violet-soft);font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;transition:background .28s,color .28s,box-shadow .28s}.c-card-btn:hover{background:var(--grad-1);border-color:transparent;color:#fff;box-shadow:var(--glow-violet)}.c-card[data-pos="0"]{transform:translateX(0) rotateY(0) scale(1);opacity:1;filter:brightness(1);z-index:5;border-color:rgba(138,92,255,.45);box-shadow:0 40px 100px rgba(0,0,0,.65),var(--glow-violet)}.c-card[data-pos="0"] .c-card-body{opacity:1;transform:none}.c-card[data-pos="0"] img{transform:scale(1.03)}.c-card[data-pos="1"]{transform:translateX(520px) rotateY(-42deg) scale(.68);opacity:.7;filter:brightness(.55);z-index:3}.c-card[data-pos="-1"]{transform:translateX(-520px) rotateY(42deg) scale(.68);opacity:.7;filter:brightness(.55);z-index:3}.c-card[data-pos="2"]{transform:translateX(850px) rotateY(-56deg) scale(.48);opacity:.3;filter:brightness(.3);z-index:1}.c-card[data-pos="-2"]{transform:translateX(-850px) rotateY(56deg) scale(.48);opacity:.3;filter:brightness(.3);z-index:1}.c-card[data-pos="3"],.c-card[data-pos="-3"]{transform:translateX(0) scale(0);opacity:0;z-index:0;pointer-events:none}.c-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);background:rgba(8,10,17,.75);backdrop-filter:blur(14px);color:var(--muted);display:flex;align-items:center;justify-content:center;transition:border-color .25s,color .25s,background .25s,transform .3s,box-shadow .3s}.c-arrow:hover{border-color:var(--violet);color:var(--violet-soft);box-shadow:var(--glow-violet);transform:translateY(-50%) scale(1.08)}#c-prev{left:2rem}#c-next{right:2rem}.c-arrow svg{width:18px;height:18px}.c-below{display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap;margin-top:2.2rem}@media(max-width:600px){.c-below{gap:1rem}}.c-dots{display:flex;gap:.7rem;align-items:center}.c-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.22);border:none;padding:0;transition:background .3s,transform .3s}.c-dot.c-active{background:var(--violet);transform:scale(1.7);box-shadow:0 0 10px rgba(138,92,255,.8)}.c-counter{font-family:var(--mono);font-size:.78rem;letter-spacing:.2em;color:var(--muted)}.c-counter b{color:var(--violet-soft);font-weight:400}@media(max-width:1100px){.c-stage{height:640px}.c-card{width:340px;height:520px;margin-top:-260px;margin-left:-170px}.c-card-title{font-size:1.75rem}.c-card[data-pos="1"]{transform:translateX(360px) rotateY(-42deg) scale(.68)}.c-card[data-pos="-1"]{transform:translateX(-360px) rotateY(42deg) scale(.68)}.c-card[data-pos="2"]{transform:translateX(600px) rotateY(-56deg) scale(.48)}.c-card[data-pos="-2"]{transform:translateX(-600px) rotateY(56deg) scale(.48)}#c-prev{left:.8rem}#c-next{right:.8rem}}@media(max-width:600px){.c-stage{height:540px}.c-card{width:270px;height:420px;margin-top:-210px;margin-left:-135px}.c-card-title{font-size:1.45rem}.c-card-body{padding:1.4rem}.c-card[data-pos="1"]{transform:translateX(250px) rotateY(-42deg) scale(.65)}.c-card[data-pos="-1"]{transform:translateX(-250px) rotateY(42deg) scale(.65)}.c-card[data-pos="2"],.c-card[data-pos="-2"]{opacity:0;pointer-events:none}}.lb{position:fixed;inset:0;z-index:2000;background:rgba(3,4,8,.92);backdrop-filter:blur(24px);display:none;flex-direction:column;pointer-events:auto}.lb.open{display:flex}.lb-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem var(--gutter);border-bottom:1px solid var(--line)}.lb-info .t{font-family:var(--display);font-weight:600;font-size:1.15rem;color:var(--white)}.lb-info .s{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:.2rem}.lb-close{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;transition:all .3s;background:var(--panel)}.lb-close:hover{border-color:var(--orange);color:var(--orange);transform:rotate(90deg)}.lb-stage{flex:1;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:1.2rem}.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;box-shadow:0 30px 90px rgba(0,0,0,.6)}.lb-arrow{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);background:var(--panel);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;transition:all .3s;z-index:2}.lb-arrow:hover{border-color:var(--violet);box-shadow:var(--glow-violet)}.lb-arrow.prev{left:1.4rem}.lb-arrow.next{right:1.4rem}.lb-arrow svg{width:18px;height:18px}.lb-bottom{display:flex;gap:.5rem;padding:1rem var(--gutter);overflow-x:auto;border-top:1px solid var(--line)}.lb-thumb{width:76px;height:54px;flex-shrink:0;border-radius:6px;overflow:hidden;border:1.5px solid transparent;opacity:.45;transition:all .3s}.lb-thumb img{width:100%;height:100%;object-fit:cover}.lb-thumb.on{opacity:1;border-color:var(--violet)}.lb-count{font-family:var(--mono);font-size:.65rem;letter-spacing:.2em;color:var(--muted)}.hero-cred{display:flex;flex-wrap:wrap;gap:2.6rem;margin-top:2.4rem}.hero-cred .hc b{transition:transform .4s var(--ease-out)}.hero-cred .hc{display:flex;flex-direction:column}.hero-cred .hc b{font-family:var(--display);font-weight:700;font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-cred .hc span{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:.4rem}@media(max-width:600px){.hero-cred{gap:1.6rem}}#about,#education,#process,#services,#social,#contact.chapter-static{position:relative;z-index:5;background:rgba(4,5,10,.88);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:7rem var(--gutter);pointer-events:auto}#education,#services{background:rgba(6,8,14,.9)}#contact.chapter-static .contact-card{margin-top:2.4rem}#contact.chapter-static .ch-title{font-size:clamp(2.4rem,6.5vw,5rem)}.about-inner{max-width:1600px;margin:0 auto}.about-lead{display:grid;grid-template-columns:340px 1fr;gap:4rem;align-items:start;margin-top:2.5rem}.about-photo{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line-2);box-shadow:0 24px 70px rgba(0,0,0,.5),var(--glow-violet)}.about-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(4,5,10,.55));pointer-events:none}.about-photo img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .8s var(--ease)}.about-photo:hover img{transform:scale(1.04)}.about-bio{font-size:clamp(1.05rem,1.6vw,1.35rem);color:var(--text);line-height:1.75;font-weight:300}.about-bio strong{color:var(--white);font-weight:500}.stats{display:flex;gap:2.5rem;flex-wrap:wrap}.stat .n{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,4vw,3.6rem);background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}.stat .l{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:.4rem}.sub-h{font-family:var(--mono);font-size:.74rem;letter-spacing:.3em;text-transform:uppercase;color:var(--violet-soft);margin:4.5rem 0 1.6rem;display:flex;align-items:center;gap:1rem}.sub-h::after{content:'';flex:1;height:1px;background:var(--line)}.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:1rem}.gcard{padding:1.5rem;border:1px solid var(--line);border-radius:14px;background:var(--panel);backdrop-filter:blur(14px);transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}.gcard:hover{border-color:rgba(138,92,255,.45);transform:translateY(-4px);box-shadow:0 16px 44px rgba(0,0,0,.4)}.gcard .t{font-family:var(--display);font-weight:600;font-size:1.08rem;color:var(--white);margin-bottom:.4rem}.gcard .d{font-size:1rem;color:var(--muted);line-height:1.65}.gcard .num{font-family:var(--mono);font-size:.75rem;color:var(--orange);letter-spacing:.2em;margin-bottom:.7rem}.gcard .yr{font-family:var(--mono);font-size:.75rem;letter-spacing:.18em;color:var(--violet-soft);margin-bottom:.5rem}.langs{display:flex;flex-wrap:wrap;gap:1rem}.lang{display:flex;align-items:center;gap:.9rem;padding:.85rem 1.3rem;border:1px solid var(--line);border-radius:100px;background:var(--panel);backdrop-filter:blur(12px)}.lang .nm{font-size:1rem;color:var(--white)}.lang .lv{font-family:var(--mono);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}.socials{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:1rem}.soc{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.3rem;border:1px solid var(--line);border-radius:14px;background:var(--panel);backdrop-filter:blur(12px);transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}.soc:hover{border-color:var(--violet);transform:translateY(-4px);box-shadow:var(--glow-violet)}.soc svg{width:20px;height:20px;color:var(--violet-soft)}.soc .p{font-size:1rem;color:var(--white);font-weight:500}.soc .h{font-family:var(--mono);font-size:.75rem;letter-spacing:.15em;color:var(--muted);margin-top:.15rem}@media(max-width:900px){.about-lead{grid-template-columns:1fr;gap:2.5rem}#about{padding:5rem 1.5rem}.about-photo{max-width:300px}}footer{position:relative;z-index:5;background:rgba(4,5,10,.9);border-top:1px solid var(--line);padding:3rem var(--gutter);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;pointer-events:auto}footer .fl{font-family:var(--display);font-weight:700;font-size:1.2rem}footer .fl b{color:var(--violet)}footer .fc{font-size:.92rem;color:var(--faint)}footer .ft{font-family:var(--mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .3s}footer .ft:hover{color:var(--violet-soft)}footer{flex-direction:column;align-items:stretch;gap:1.4rem}footer .frow{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}footer .fdisc{margin:0;padding-top:1.4rem;border-top:1px solid var(--line);font-size:.8rem;line-height:1.65;color:var(--faint);max-width:110ch}@media(max-width:600px){footer{gap:1.1rem}footer .fdisc{font-size:.76rem;padding-top:1.1rem}}[data-reveal]{opacity:0;transform:translateY(40px)}@media(max-width:900px){.chapter .pin{padding:0 1.5rem}#work{padding:5rem 1.5rem}.pgrid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr))}.floors{max-width:100%}.c-dot{width:10px;height:10px;padding:17px;box-sizing:content-box;background-clip:content-box}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}[data-reveal]{opacity:1;transform:none}}.sw-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem;max-width:740px;margin-top:1.4rem}.sw-cat{grid-column:1/-1;margin:.45rem 0 .05rem;font-family:var(--mono);font-size:.63rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);display:flex;align-items:center;gap:.7rem}.sw-cat:first-child{margin-top:0}.sw-cat::after{content:"";flex:1;height:1px;background:var(--line)}.sw-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:12px;border:1px solid var(--line);background:rgba(12,15,24,.72);backdrop-filter:blur(16px);transition:border-color .35s,transform .45s var(--ease),box-shadow .45s,background .35s}.sw-item:hover{border-color:var(--k);transform:translateY(-3px);background:rgba(16,20,32,.86);box-shadow:0 12px 34px rgba(0,0,0,.45),0 0 26px -8px var(--k)}.sw-ic{flex-shrink:0;width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.6rem;font-weight:700;color:#fff;background:linear-gradient(140deg,var(--k),color-mix(in srgb,var(--k) 55%,#0b0e16));box-shadow:0 0 18px -6px var(--k)}.sw-item b{font-size:.83rem;font-weight:600;color:var(--white);line-height:1.2;min-width:0}@media(max-height:820px){#skills .ch-title{font-size:clamp(2rem,4.4vw,3.2rem)}#skills .ch-desc{display:none}.sw-grid{margin-top:1rem;gap:.4rem}.sw-cat{margin:.3rem 0 .05rem}.sw-item{padding:.42rem .6rem}.sw-ic{width:24px;height:24px;border-radius:7px;font-size:.55rem}}@media(max-width:1100px){.sw-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:560px}}@media(max-width:760px){.sw-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:100%}}@media(max-width:430px){.sw-grid{gap:.35rem}.sw-item{padding:.4rem .5rem;gap:.45rem}.sw-item b{font-size:.75rem}.sw-ic{width:22px;height:22px;border-radius:6px;font-size:.5rem}}.chapter .pin>.ch-tag,.chapter .pin>.ch-title,.chapter .pin>.ch-desc,.chapter .pin>.sw-grid,.chapter .pin>.floors,.chapter .pin>.hero-cred,.chapter .pin>.hero-cta-row{position:relative;z-index:2}.chapter .pin::before{content:'';position:absolute;inset:-40vh -30vw;z-index:0;pointer-events:none;background:radial-gradient(closest-side at 26% 50%,rgba(4,5,10,.90) 0%,rgba(4,5,10,.66) 38%,rgba(4,5,10,.28) 62%,transparent 80%)}.chapter.right .pin::before{background:radial-gradient(closest-side at 74% 50%,rgba(4,5,10,.90) 0%,rgba(4,5,10,.66) 38%,rgba(4,5,10,.28) 62%,transparent 80%)}.floors{gap:.7rem;max-width:600px}.floor{opacity:.62;transform:translateX(18px);border-radius:16px;padding:1.1rem 1.35rem;background:rgba(11,14,22,.78);backdrop-filter:blur(18px);transition:opacity .55s var(--ease),transform .6s var(--ease),border-color .45s,box-shadow .5s}.floor.on{opacity:1;transform:none;border-color:rgba(138,92,255,.45);box-shadow:0 14px 40px rgba(0,0,0,.5)}.floor.on .floor-no{color:#fff;background:var(--grad-1);border-color:transparent}.floor-no{display:inline-block;padding:.28rem .6rem;border-radius:100px;border:1px solid var(--line);background:rgba(255,255,255,.04);white-space:nowrap}.floor-note{color:var(--muted)}.floor.on .floor-note{color:var(--text)}#education .cardgrid{grid-auto-rows:1fr}#education .gcard{display:flex;flex-direction:column}#education .ch-title{margin-bottom:.4rem}#education .langs{margin-top:1.6rem}#about,#education,#process,#services,#social,#contact.chapter-static{isolation:isolate}#social{padding-bottom:2rem;border-bottom:none}#contact.chapter-static{padding-top:2rem;border-top:none}.contact-pair{display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:start;max-width:1600px;margin:0 auto}.contact-pair .cp-side .sub-h{margin-top:0}@media(max-width:900px){.contact-pair{grid-template-columns:1fr;gap:2.5rem}}:root{--ease-out:cubic-bezier(.33,1,.68,1);--ease-in:cubic-bezier(.32,0,.67,0);--ease-soft:cubic-bezier(.65,0,.35,1)}.nav-menu a,.nav-cta,.btn,.jprog a,.fbtn,.sw-item,.gcard,.soc,.lang,.contact-row,.c-card-btn,.c-arrow,.c-dot,.skip{transition-timing-function:var(--ease-out)}.loader{transition-timing-function:var(--ease-in)}.c-card{transition-timing-function:cubic-bezier(.4,0,.2,1)}.floor{transition-timing-function:var(--ease)}@media(max-width:380px){.chapter.right .pin{align-items:flex-start;text-align:left}.chapter.right .ch-desc{margin-left:0}.ch-tag{max-width:100%;white-space:normal}.ch-title{font-size:clamp(1.75rem,9vw,2.4rem)}}.c-card-btn{min-height:44px}.nav{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}.jprog{right:max(1.4rem,env(safe-area-inset-right))}footer{padding-bottom:max(2rem,env(safe-area-inset-bottom))}.chapter .pin{padding-left:max(var(--gutter),env(safe-area-inset-left));padding-right:max(var(--gutter),env(safe-area-inset-right))}@media(max-width:360px){.pp-index,.pg-index{padding-left:1rem;padding-right:1rem}.pp-index li,.pg-index li{word-break:break-word}.xp-card{padding-left:1rem;padding-right:1rem}.xp-card h3,.xp-card p{padding-right:.25rem}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.cta-dock{position:fixed;left:max(1.4rem,env(safe-area-inset-left));bottom:max(1.4rem,env(safe-area-inset-bottom));z-index:9000;display:inline-flex;align-items:center;gap:.6rem;min-height:48px;padding:0 1.4rem;border-radius:100px;background:var(--violet-btn);color:#fff;font-size:.9rem;font-weight:500;box-shadow:0 10px 34px rgba(0,0,0,.5),0 0 24px -6px var(--violet);transition:transform .45s var(--ease),box-shadow .4s,background .3s,opacity .35s}.cta-dock.gone{opacity:0;transform:translateY(18px) scale(.96);pointer-events:none}.cta-dock:hover{transform:translateY(-3px);background:var(--violet);box-shadow:0 16px 44px rgba(0,0,0,.55),0 0 34px -4px var(--violet-soft)}.cta-dock-pulse{width:7px;height:7px;border-radius:50%;background:#5BE49B;flex:none;animation:ctaPulse 2.4s ease-out infinite}@keyframes ctaPulse{0%{box-shadow:0 0 0 0 rgba(91,228,155,.6)}70%{box-shadow:0 0 0 9px rgba(91,228,155,0)}100%{box-shadow:0 0 0 0 rgba(91,228,155,0)}}@media(max-width:600px){.cta-dock{padding:0 1.1rem;font-size:.84rem}}@media(prefers-reduced-motion:reduce){.cta-dock-pulse{animation:none}}.after-cta{position:fixed;left:50%;bottom:2rem;transform:translate(-50%,140%);z-index:9500;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;justify-content:center;max-width:min(560px,calc(100vw - 2rem));padding:1rem 1.3rem;border-radius:16px;border:1px solid var(--line-2);background:rgba(12,15,24,.92);backdrop-filter:blur(18px);box-shadow:0 20px 60px rgba(0,0,0,.6);opacity:0;transition:transform .7s var(--ease),opacity .5s}.after-cta.show{transform:translate(-50%,0);opacity:1}.after-cta p{font-size:.94rem;color:var(--text);margin:0}.after-cta .ac-go{display:inline-flex;align-items:center;min-height:44px;padding:0 1.2rem;border-radius:100px;background:var(--violet-btn);color:#fff;font-size:.88rem;font-weight:500;flex:none}.after-cta .ac-x{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:var(--muted);flex:none}.after-cta .ac-x:hover{color:var(--white)}@media(prefers-reduced-motion:reduce){.after-cta{transition:opacity .3s}}.cs{display:grid;gap:1.6rem;max-width:70ch}.cs-row h3,.cs-row h4{font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--violet-soft);margin-bottom:.55rem}.cs-row p{font-size:1.02rem;line-height:1.72;color:var(--text)}@media(max-width:600px){.cs{gap:1.25rem}.cs-row p{font-size:.97rem}}.reply-time{display:inline-flex;align-items:center;gap:.6rem;margin:1.5rem 0 1.7rem;padding:.55rem 1rem;border-radius:100px;border:1px solid var(--line-2);background:rgba(12,15,24,.6);backdrop-filter:blur(12px);font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text)}@media(max-width:600px){.reply-time{font-size:.65rem;letter-spacing:.06em}}.sw-ic{background:#F2F4F8;box-shadow:0 1px 3px rgba(0,0,0,.4);padding:4px}.sw-item:hover .sw-ic{box-shadow:0 0 14px -3px var(--k)}.sw-ic img{width:100%;height:100%;object-fit:contain;display:block}@media(max-width:430px){.sw-ic{padding:3px}}.vr-row{margin:0 0 .2rem}.vr-btn{display:inline-flex;align-items:center;gap:.6rem;min-height:46px;padding:0 1.35rem;border-radius:100px;font-size:.9rem;font-weight:500;font-family:inherit;border:1px solid transparent;cursor:pointer;list-style:none;transition:transform .4s var(--ease),background .3s,border-color .3s,box-shadow .35s}.vr-btn .vr{flex:none;opacity:.9}.vr-btn .ext{flex:none;opacity:.75}.vr-btn.has-tour{background:var(--violet-btn);color:#fff;box-shadow:0 8px 26px rgba(0,0,0,.45),0 0 20px -6px var(--violet)}.vr-btn.has-tour:hover{transform:translateY(-2px);background:var(--violet);box-shadow:0 14px 36px rgba(0,0,0,.5),0 0 30px -4px var(--violet-soft)}.vr-btn.no-tour{background:rgba(255,255,255,.04);border-color:var(--line-2);color:var(--text)}.vr-btn.no-tour:hover{transform:translateY(-2px);border-color:var(--violet-soft);background:rgba(255,255,255,.07)}.pmh .vr-row{margin:.9rem 0 1.1rem}.pmh .vr-btn.no-tour{background:rgba(4,5,10,.55);backdrop-filter:blur(10px)}.vr-toast{position:fixed;left:50%;bottom:2rem;transform:translate(-50%,150%);z-index:10050;display:flex;flex-direction:column;gap:.35rem;width:min(460px,calc(100vw - 2rem));padding:1rem 1.25rem;border-radius:14px;border:1px solid var(--line-2);background:rgba(12,15,24,.95);backdrop-filter:blur(18px);box-shadow:0 22px 60px rgba(0,0,0,.65);opacity:0;pointer-events:none;transition:transform .55s var(--ease),opacity .4s}.vr-toast.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}.vr-toast strong{font-size:.95rem;color:var(--white);font-weight:600}.vr-toast span{font-size:.87rem;line-height:1.55;color:var(--muted)}.vr-toast a{color:var(--violet-soft);text-decoration:underline;text-underline-offset:2px}@media(prefers-reduced-motion:reduce){.vr-toast{transition:opacity .3s}.vr-btn:hover{transform:none}}@media(max-width:430px){.vr-btn{font-size:.85rem;padding:0 1.1rem}.vr-toast{bottom:1rem}}#voices{position:relative;z-index:5;background:rgba(4,5,10,.88);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:7rem var(--gutter);pointer-events:auto}.voices-grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr))}.tm{display:flex;flex-direction:column;gap:1.1rem;padding:1.9rem 1.75rem;border-radius:18px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(16px);transition:border-color .35s,transform .45s var(--ease),box-shadow .45s}.tm:hover{border-color:var(--line-2);transform:translateY(-4px);box-shadow:0 18px 50px rgba(0,0,0,.45)}.tm-q{color:var(--violet-soft);opacity:.75;flex:none}.tm-quote{margin:0}.tm-quote p{font-size:1.05rem;line-height:1.72;color:var(--text)}.tm-who{display:flex;flex-direction:column;gap:.2rem;margin-top:auto;padding-top:1.1rem;border-top:1px solid var(--line)}.tm-name{font-family:var(--display);font-weight:600;font-size:.98rem;color:var(--white)}.tm-role{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.tm-link{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--violet-soft)}.tm-link:hover{color:var(--white)}@media(max-width:600px){.tm{padding:1.5rem 1.35rem}.tm-quote p{font-size:.99rem}}
/* Credentials band — stands in for testimonials with verifiable facts only. */
#voices .work-head{margin-bottom:2.6rem}
.cred-band{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr))}
.cred{display:flex;flex-direction:column;gap:.35rem;padding:1.6rem 1.5rem;border-radius:18px;
  border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(16px);
  transition:border-color .35s,transform .45s var(--ease)}
.cred:hover{border-color:var(--line-2);transform:translateY(-4px)}
.cred b{font-family:var(--display);font-weight:700;font-size:clamp(2rem,4vw,2.9rem);
  line-height:1;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent}
.cred span{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted)}
.cred-note{margin-top:1.4rem;max-width:78ch;font-size:.92rem;line-height:1.7;color:var(--muted)}

/* ── Mobile breathing room ────────────────────────────────
   Measured on a 390px phone: section headings sat 0-6px above their card
   grids, grid gaps were 16px, and 42px display type ran on 40px leading, so
   two-line headings nearly touched. Everything below only relaxes spacing —
   no sizes, colours or layout change. */
@media(max-width:700px){
  /* headings: let the lines breathe, and clear the content beneath */
  .ch-title{line-height:1.04}
  .about-inner .ch-title,.work-head .ch-title{margin-bottom:1.6rem}
  #education .ch-title{margin-bottom:1.6rem}
  .ch-tag{margin-bottom:.9rem}

  /* card grids */
  .cardgrid,.voices-grid,.cred-band,.socials{gap:1.15rem}
  .gcard,.cred{padding:1.5rem 1.35rem}

  /* section rhythm — slightly tighter top, more air at the bottom so the
     next section's tag doesn't crowd the previous card row */
  #process,#services,#about,#education,#voices{padding-top:5.5rem;padding-bottom:6rem}
  #work{padding-top:5rem;padding-bottom:5.5rem}

  /* body copy */
  .ch-desc,.about-bio,.pp-lead,.cred-note{line-height:1.72}
  .gcard .d{line-height:1.62}
}
@media(max-width:430px){
  .cardgrid,.voices-grid,.cred-band,.socials{gap:1rem}
  #process,#services,#about,#education,#voices{padding-top:5rem;padding-bottom:5.5rem}
}

/* ═══════════════════════════════════════════════════════
   MOBILE DENSITY PASS  (<=700px only — desktop untouched)

   Measured at 375px before this: the Skills grid ran 14 tiles in 2 columns
   with a 6px gap, 6.4px padding and 37px tile height, with 0.8px under each
   category label. The Career floors sat 11px apart with 2px between a role
   and its company. That is what "congested" was.

   The fix is not smaller type — it is fewer things per screen. Skills and
   Career are 100svh-pinned chapters on desktop, which forces their content
   into one viewport. On phones they now scroll normally, so each item can
   have real space and the section can be as tall as it needs to be.
   ═══════════════════════════════════════════════════════ */
@media(max-width:700px){

  /* ── un-pin the two dense chapters so content isn't trapped in 100svh ── */
  #skills,#career{height:auto}
  #skills .pin,#career .pin{position:static;height:auto;
    padding-top:5.5rem;padding-bottom:5.5rem;justify-content:flex-start}

  /* ── Skills: one tile per row, sized to be read, not scanned ── */
  .sw-grid{grid-template-columns:1fr;gap:.7rem;margin-top:2.2rem;max-width:100%}
  .sw-item{padding:.95rem 1.1rem;gap:.9rem;border-radius:14px}
  .sw-ic{width:38px;height:38px;border-radius:10px;padding:5px}
  .sw-item b{font-size:.98rem}
  .sw-cat{margin:1.6rem 0 .55rem;font-size:.68rem}
  .sw-cat:first-child{margin-top:0}

  /* ── Career: each role reads as its own block ── */
  .floors{gap:1.15rem}
  .floor{padding:1.5rem 1.4rem;border-radius:16px}
  .floor-no{margin-bottom:.7rem}
  .floor-role{font-size:1.05rem;line-height:1.35;margin-bottom:.4rem}
  .floor-co{margin-bottom:.7rem;line-height:1.5}
  .floor-note{line-height:1.7}

  /* ── Hero: a touch more air between the four stacked blocks ── */
  #enter .ch-title{margin-bottom:1.5rem}
  #enter .ch-desc{margin-bottom:2.4rem}
  .hero-cred{gap:1.9rem;margin-bottom:2.4rem}
  .hero-cta-row{gap:.75rem}

  /* ── About stats + bio ── */
  .stats{gap:2.6rem}
  .about-bio{line-height:1.78}
  .about-bio + *{margin-top:1.4rem}

  /* ── Contact: links and socials stop stacking tight ── */
  .contact-pair{gap:3.4rem}
  .cp-item,.soc{padding:1.15rem 1.25rem}
  .socials{gap:1.2rem}
  .lang{gap:.7rem}

  /* ── Selected Work: give the carousel room above and below ── */
  .c-stage{margin-top:2rem}
  .c-below{margin-top:2.4rem}
}
@media(max-height:700px) and (max-width:700px){
  #enter .ch-title{margin-bottom:1rem}
  #enter .ch-desc{margin-bottom:1.4rem}
  .hero-cred{gap:1.4rem;margin-bottom:1.4rem}
  #enter .ch-title{font-size:clamp(1.9rem,7.5vw,2.4rem)}
}
@media(max-width:430px){
  .sw-item{padding:.9rem 1rem}
  .floor{padding:1.35rem 1.25rem}
  .contact-pair{gap:3rem}
}

/* ═══════════════════════════════════════════════════════
   ROUND OF FIXES — dock, carousel dot, project buttons,
   education spacing
   ═══════════════════════════════════════════════════════ */

/* 1 ── Floating CTA: moved to the right and made smaller on every device.
        Sits above the .jprog dots' vertical band, so they never meet. */
.cta-dock{left:auto;right:max(1.4rem,env(safe-area-inset-right));
  min-height:40px;padding:0 1.05rem;font-size:.82rem;gap:.5rem}
.cta-dock-pulse{width:6px;height:6px}
@media(max-width:600px){
  .cta-dock{min-height:38px;padding:0 .95rem;font-size:.78rem;
    right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom))}
}

/* 2 ── Carousel dot: the 17px tap padding is what `transform:scale(1.7)`
        was multiplying, so the active dot ballooned to ~50px. Keep the big
        touch target, shrink the mark, drop the scale. */
.c-dot{width:8px;height:8px}
.c-dot.c-active{transform:none;background:var(--violet);
  box-shadow:0 0 8px rgba(138,92,255,.65)}

/* 3 ── Project hero actions: both buttons now share the quiet outline
        treatment (the violet fill made the two read as different ranks) and
        sit on one row at a smaller size. 44px touch target preserved. */
.pp-actions{gap:.6rem}
.vr-btn,.pp-jump{min-height:44px;padding:0 1.05rem;font-size:.84rem;gap:.5rem}
.vr-btn.has-tour,.vr-btn.no-tour{background:rgba(255,255,255,.04);color:var(--text);
  border-color:var(--line-2);backdrop-filter:blur(10px);box-shadow:none}
.vr-btn.has-tour:hover,.vr-btn.no-tour:hover{background:rgba(255,255,255,.08);
  border-color:var(--violet-soft);box-shadow:none;transform:translateY(-2px)}
.vr-btn .vr{width:14px;height:14px}
@media(max-width:600px){
  .pp-actions{gap:.45rem;flex-wrap:nowrap}
  .vr-btn,.pp-jump{padding:0 .72rem;font-size:.72rem;gap:.35rem;white-space:nowrap}
  .vr-btn .vr{width:13px;height:13px}
  .pp-jump svg,.vr-btn .ext{width:10px;height:10px}
}

/* 5a ── "Academic background" descenders were landing on the cards below.
         .ch-title runs line-height .95, so the box is shorter than the glyphs. */
#education .ch-title{margin-bottom:1.6rem}

/* 5b ── Languages are a different kind of fact from qualifications, so they
         get a real break rather than sitting flush under the card grid. */
#education .langs{margin-top:3.4rem;padding-top:2.4rem;border-top:1px solid var(--line);
  position:relative}
#education .langs::before{content:'Languages';position:absolute;top:-.62rem;left:0;
  padding-right:.9rem;background:var(--bg);
  font-family:var(--mono);font-size:.63rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted)}
@media(max-width:700px){
  #education .langs{margin-top:2.8rem;padding-top:2.1rem}
  .langs{gap:.7rem}
  .lang{padding:.75rem 1.1rem}
}

/* Hero action pair: one row, one shared treatment. .pp-jump kept its own
   darker fill, so the two still read as different ranks. */
.pp-actions{flex-wrap:nowrap!important}
.pp-jump{background:rgba(255,255,255,.04);border-color:var(--line-2)}
.pp-jump:hover{background:rgba(255,255,255,.08);border-color:var(--violet-soft)}
@media(max-width:600px){
  .pp-actions{gap:.45rem}
  .vr-btn,.pp-jump{padding:0 .7rem;font-size:.71rem;gap:.32rem;white-space:nowrap;min-width:0}
  .vr-btn span,.pp-jump{overflow:hidden;text-overflow:ellipsis}
}

/* ── Carousel dot: smaller mark on phones (desktop stays 8px) ── */
@media(max-width:700px){
  .c-dot{width:6px;height:6px}
}

/* ── Motion tuned per device ──────────────────────────────
   The entrance timings were authored for a large desktop canvas. On a phone
   the same 44px travel over 0.95s reads as sluggish, because the distance is
   a much larger share of the screen. Shorter and shallower on small screens;
   desktop is untouched. */
@media(max-width:700px){
  @keyframes heroRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
  @keyframes heroRiseOpaque{from{transform:translateY(22px)}to{transform:none}}
  #enter .ch-tag,#enter .ch-desc,#enter .hero-cred,#enter .hero-cta-row,
  #enter .ch-title{animation-duration:.62s}
  #enter .ch-desc{animation-delay:.12s}
  #enter .hero-cred{animation-delay:.19s}
  #enter .hero-cta-row{animation-delay:.26s}
  .js-anim .pp-sec[data-anim="up"]{transform:translateY(18px)}
  .js-anim .pp-sec[data-anim="up"].in{transition:opacity .5s ease,transform .55s cubic-bezier(.22,1,.36,1)}
  .js-anim .pp-shot{transform:translateY(14px) scale(.99)}
  .js-anim .pp-shot.in{transition:opacity .45s ease,transform .5s cubic-bezier(.22,1,.36,1)}
  .pp-hero{animation-duration:.8s}
  .pp-hero img{animation-duration:1.05s}
  .pp-hero-in > [data-anim]{animation-duration:.6s}
  .pp-hero-in > [data-anim="1"]{animation-delay:.22s}
  .pp-hero-in > [data-anim="2"]{animation-delay:.3s}
  .pp-hero-in > [data-anim="3"]{animation-delay:.38s}
  .c-card{transition-duration:.55s}
  .fcard,.gcard,.cred,.sw-item,.floor{transition-duration:.3s}
}

/* ── Selected Work fits a laptop screen ───────────────────
   The section ran 1585px tall against a 900px viewport, so the "All projects"
   button could never share the screen with the carousel. Shorter cards bring
   the whole block within reach. */
@media(min-width:701px){
  .c-stage{height:580px;margin-top:2.2rem}
  .c-card{height:540px;margin-top:-270px;width:380px;margin-left:-190px}
  .c-below{margin-top:1.6rem}
  #work{padding-top:5rem;padding-bottom:4.5rem}
}
@media(min-width:1600px){
  .c-stage{height:640px}
  .c-card{height:600px;margin-top:-300px;width:420px;margin-left:-210px}
}

/* ═══════════════════════════════════════════════════════
   DEVICE TIER PASS
   ═══════════════════════════════════════════════════════ */

/* 3 ── Double-tap zoom: iOS waits ~300ms on every tap to see if a second
        one is coming. On controls that is both laggy and can fire an
        accidental zoom. Only applied to interactive elements, so pinch-zoom
        on renders still works. */
a,button,summary,.c-card,.fcard,.sw-item,.gcard,.cred,.soc,.lang,.pp-shot,.pp-zoom{
  touch-action:manipulation}

/* 5 ── iOS zooms the page when a control's text is under 16px and gets
        focus. Keep interactive text at 16px on phones. */
@media(max-width:700px){
  .nav-menu a,.btn,.cp-item,.soc,.lang,.vr-btn,.pp-jump,.c-card-btn{font-size:16px}
  .btn,.cp-item a{min-height:48px}
}

/* 6 ── Progress: a column of 3px dots is hard to see and impossible to hit
        on a phone. Replaced with a hairline bar across the top. */
@media(max-width:700px){
  .jprog{display:none}
  .scrollbar-top{position:fixed;top:0;left:0;height:2px;z-index:950;
    width:var(--scrolled,0%);background:var(--grad-1);
    transition:width .12s linear;pointer-events:none}
}
@media(min-width:701px){ .scrollbar-top{display:none} }

/* 1 ── TABLET (701-1024px). This tier was inheriting desktop density on a
        two-thirds-size screen, which is the classic squeeze. */
@media(min-width:701px) and (max-width:1024px){
  #process,#services,#about,#education,#voices{padding-top:6rem;padding-bottom:6.5rem}
  .cardgrid,.voices-grid,.cred-band,.socials{gap:1.35rem}
  .gcard,.cred{padding:1.7rem 1.6rem}
  .about-inner .ch-title,.work-head .ch-title{margin-bottom:1.9rem}
  .ch-title{line-height:1}
  .ch-desc,.about-bio,.cred-note{line-height:1.75;max-width:64ch}
  .floors{gap:1.1rem}
  .floor{padding:1.6rem 1.7rem}
  .sw-grid{gap:.75rem}
  .sw-item{padding:.8rem 1rem}
  .contact-pair{gap:3rem}
  /* 2 ── shorter cinematic hold: a tablet user scrolls faster than a
     desktop user sitting back, so the pinned chapters pay off sooner */
  #skills{height:104svh}
  #career{height:118svh}
}

/* 5 ── Measure: desktop can carry a wider line, phones cannot. */
@media(max-width:700px){
  .ch-desc,.about-bio,.pp-lead,.cred-note,.cs-row p,.gcard .d{max-width:38ch}
}

/* 2 ── Hover states have no touch equivalent, so bake them into the default
        view rather than leaving the information unreachable. */
@media(hover:none){
  .fcard .go{opacity:1;transform:none}
  .pp-zoom{opacity:.9;transform:none}
  .c-card-btn{opacity:1}
  .sw-item,.gcard,.cred,.fcard{transition:none}
}

/* Tablet was left with no progress indicator at all: the side dots hide at
   900px but the bar only appeared below 700px. Extend the bar to cover the
   gap, and lift control text to 16px there too (iPads zoom on focus the
   same way iPhones do). */
@media(max-width:900px){
  .scrollbar-top{display:block}
  .nav-menu a{font-size:16px;padding:.7rem .9rem}
}
@media(min-width:901px){ .scrollbar-top{display:none} }
