@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,500&display=swap');
:root{color-scheme:dark;--bg:#101111;--surface:#151717;--surface-2:#1b1e1e;--surface-3:#202424;--fg:#f0f0ec;--muted:#a1a7a3;--muted-2:#777f7b;--line:rgba(230,235,228,.14);--line-strong:rgba(230,235,228,.24);--accent:#ff625b;--accent-ink:#21100f;--art-bg:#171a1a;--display:'DM Sans',Arial,sans-serif;--serif:'Playfair Display',Georgia,serif;--mono:'DM Mono',monospace;--gutter:clamp(22px,6.1vw,96px);scroll-behavior:smooth;scroll-padding-top:90px}
:root[data-theme=light]{color-scheme:light;--bg:#f5f5f2;--surface:#eeeeeb;--surface-2:#e9eae7;--surface-3:#e0e2df;--fg:#1c1e1e;--muted:#606765;--muted-2:#858c89;--line:rgba(28,33,31,.14);--line-strong:rgba(28,33,31,.25);--accent:#c62828;--accent-ink:#fff;--art-bg:#ebece9}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--display);-webkit-font-smoothing:antialiased;transition:background-color .35s,color .35s}a{color:inherit;text-decoration:none}button,textarea{font:inherit}.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}.skip-link{position:fixed;z-index:30;top:8px;left:8px;background:var(--accent);color:var(--accent-ink);padding:12px 18px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}::selection{background:var(--accent);color:var(--accent-ink)}
.site-header{height:84px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);transition:height .25s,background-color .3s}.site-header.scrolled{height:68px}.wordmark{display:flex;gap:12px;align-items:center;font-size:13px;font-weight:600;letter-spacing:-.02em}.monogram{width:33px;height:33px;border:1px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;font:10px var(--mono);letter-spacing:-.09em;color:var(--fg);transition:border-color .2s,transform .3s}.wordmark:hover .monogram{transform:rotate(-12deg);border-color:var(--accent)}.wordmark-dot{color:var(--accent)}.header-controls{display:flex;align-items:center;gap:14px}.site-nav{display:flex;align-items:center;gap:31px;font-size:11px;color:var(--muted)}.site-nav>a:not(.nav-contact){display:flex;gap:7px;align-items:flex-start;transition:color .2s}.site-nav>a:hover{color:var(--fg)}.nav-num{font:8px var(--mono);color:var(--muted-2);margin-top:-2px}.nav-contact{border:1px solid var(--line-strong);border-radius:2px;padding:11px 14px;color:var(--fg)!important;transition:background .2s,border-color .2s}.nav-contact:hover{background:var(--surface-2);border-color:var(--muted-2)}.nav-contact span{padding-left:13px;color:var(--accent)}.theme-toggle,.menu-toggle{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--fg);display:grid;place-items:center;cursor:pointer;transition:color .2s,border-color .2s,background .2s,transform .2s}.theme-toggle:hover,.menu-toggle:hover{border-color:var(--accent);color:var(--accent);transform:rotate(-8deg)}.theme-toggle svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.icon-moon{display:none}:root[data-theme=light] .icon-sun{display:none}:root[data-theme=light] .icon-moon{display:block}.menu-toggle{display:none}
.hero{padding:clamp(58px,7.2vw,104px) var(--gutter) 0;min-height:calc(100svh - 84px);display:grid;grid-template-columns:1.04fr .96fr;grid-template-rows:1fr 48px;column-gap:5vw}.hero-copy{position:relative;z-index:2;align-self:center;padding:0 0 58px}.eyebrow{font:9px var(--mono);letter-spacing:.055em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px;margin:0 0 27px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 60%,transparent)}.eyebrow-divider{height:1px;background:var(--line-strong);width:33px;margin-left:1px}.hero h1{font-size:clamp(57px,7.6vw,108px);line-height:.96;letter-spacing:-.088em;font-weight:500;margin:0;max-width:760px}.hero h1 em,.about h2 em,.experiment h2 em,.contact h2 em{font-family:var(--serif);font-weight:500;letter-spacing:-.075em;color:var(--accent)}.hero-intro{font-size:14px;line-height:1.85;color:var(--muted);max-width:390px;margin:27px 0 28px}.hero-actions{display:flex;align-items:center;gap:27px}.button{display:inline-flex;align-items:center;gap:24px;border-radius:2px;padding:15px 17px;font-size:10px;font-weight:600;letter-spacing:.005em;transition:transform .22s,background .22s,color .22s,border-color .22s}.button:hover{transform:translateY(-2px)}.button-accent{background:var(--accent);color:var(--accent-ink)}.button-accent:hover{background:color-mix(in srgb,var(--accent) 85%,white)}.text-link{font-size:10px;border-bottom:1px solid var(--line-strong);padding-bottom:7px;color:var(--fg);transition:color .2s,border-color .2s}.text-link:hover{color:var(--accent);border-color:var(--accent)}.text-link span{margin-left:10px;color:var(--accent)}
.hero-art{min-height:460px;position:relative;overflow:hidden;background:var(--art-bg);border:1px solid var(--line);display:grid;place-items:center;isolation:isolate}.hero-art:before{content:'';position:absolute;inset:10%;z-index:-1;background:radial-gradient(ellipse at 49% 49%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 62%);filter:blur(18px)}.art-grain{position:absolute;inset:0;opacity:.16;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E")}.art-caption,.art-index{position:absolute;z-index:3;left:22px;right:22px;display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:.07em;color:var(--muted-2)}.art-caption{top:20px}.art-caption b{color:var(--fg);font-weight:400;margin-left:8px}.art-index{bottom:18px;align-items:flex-end}.art-index span:last-child{text-align:right;line-height:1.6;color:var(--muted)}.art-coordinate{color:var(--accent)!important}.ring-one,.ring-two{position:absolute;width:84%;height:25%;border:1px solid color-mix(in srgb,var(--muted-2) 32%,transparent);border-radius:50%;transform:rotate(-34deg);pointer-events:none}.ring-two{width:68%;height:19%;transform:rotate(61deg);border-color:color-mix(in srgb,var(--accent) 20%,transparent)}.art-cross{position:absolute;font:14px var(--mono);color:var(--muted-2)}.cross-a{top:21%;left:16%}.cross-b{bottom:20%;right:15%}.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);font:8px var(--mono);letter-spacing:.075em;color:var(--muted-2)}.hero-bottom a{color:var(--muted)}.hero-bottom a:hover{color:var(--accent)}.hero-bottom a span{margin-left:8px;color:var(--accent)}
.section-pad{padding:clamp(91px,11.8vw,165px) var(--gutter)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:52px}.section-heading .eyebrow{margin-bottom:19px}.eyebrow>span:not(.status-dot){color:var(--accent)}.section-heading h2,.about h2,.experiment h2{font-size:clamp(39px,5.3vw,70px);line-height:1.06;letter-spacing:-.072em;font-weight:500;margin:0}.period{color:var(--accent)}.section-aside{font-size:10px;line-height:1.85;color:var(--muted);margin:0 0 5px}.work-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:20px;align-items:start}.work-card{min-width:0}.work-visual{height:clamp(220px,24vw,330px);position:relative;overflow:hidden;display:grid;place-items:center;border:1px solid var(--line);transition:border-color .3s,transform .4s}.work-card:hover .work-visual{border-color:var(--line-strong)}.work-card-large .work-visual{height:clamp(270px,31vw,410px)}.visual-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.09),transparent 68%);pointer-events:none}.visual-kicker,.visual-number{position:absolute;z-index:2;font:8px var(--mono);letter-spacing:.08em;color:rgba(244,245,240,.55)}.visual-kicker{top:16px;left:17px}.visual-number{bottom:14px;right:16px}.visual-chalk{background:radial-gradient(ellipse at 47% 47%,#37403d,#202624 66%,#191d1c)}.chalk-mark{font:clamp(100px,13vw,160px) var(--serif);letter-spacing:-.15em;color:#e4e4da;transform:rotate(-10deg);text-shadow:4px 7px 20px rgba(0,0,0,.38)}.chalk-mark span{color:var(--accent)}.chalk-lines{position:absolute;left:18%;bottom:18%;width:43%;transform:rotate(-10deg)}.chalk-lines i{display:block;height:1px;background:rgba(224,229,213,.34);margin:12px 0;width:100%}.chalk-lines i:nth-child(2){width:78%}.chalk-lines i:nth-child(3){width:55%}.visual-shield{background:radial-gradient(circle at 50% 51%,#343c3d,#202627 68%,#1a1e1f)}.shield-shape{width:110px;height:133px;background:linear-gradient(130deg,#f4f2e7,#929a95 42%,#d7ded6 65%,#535d59);clip-path:polygon(50% 0,94% 16%,88% 68%,50% 100%,12% 68%,6% 16%);display:grid;place-items:center;filter:drop-shadow(10px 17px 18px rgba(0,0,0,.4));font:20px var(--mono);color:#34403c;z-index:1;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.work-card:hover .shield-shape{transform:rotate(4deg) translateY(-3px)}.shield-ring{position:absolute;width:170px;height:170px;border:1px solid rgba(216,232,219,.18);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 56px rgba(255,255,255,.018)}.visual-byte{background:radial-gradient(ellipse at 50% 50%,#3a332d,#27221f 68%,#1c1917)}.byte-word{position:relative;z-index:1;font-size:clamp(40px,5vw,55px);font-weight:600;letter-spacing:-.1em;color:#e8e1d8}.byte-word span{font:italic 23px var(--serif);color:#c7a887;padding:0 7px}.byte-grid{position:absolute;inset:30% 12%;background-image:linear-gradient(rgba(227,211,192,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(227,211,192,.14) 1px,transparent 1px);background-size:22px 22px;mask-image:radial-gradient(ellipse,#000,transparent 68%)}.project-meta{padding:16px 0 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start}.project-type{font:8px var(--mono);letter-spacing:.06em;color:var(--muted-2);margin:0 0 8px}.project-type span{color:var(--muted-2)}.project-meta h3{font-size:18px;font-weight:500;letter-spacing:-.04em;margin:0 0 14px}.project-arrow{font-size:16px;color:var(--accent);align-self:flex-start;margin-top:2px;transition:transform .25s}.work-card:hover .project-arrow{transform:translate(3px,-3px)}.project-note{font-size:10px;line-height:1.75;color:var(--muted);max-width:330px;margin:11px 0}.work-footnote{font-size:9px;line-height:1.7;color:var(--muted);border-top:1px solid var(--line);padding-top:15px;margin:37px 0 0}.footnote-mark{display:inline-grid;place-items:center;font:italic 10px var(--serif);border:1px solid var(--line-strong);border-radius:50%;width:16px;height:16px;margin-right:8px;color:var(--accent)}
.about{background:var(--surface);display:grid;grid-template-columns:.7fr 1.3fr;gap:5vw;position:relative;overflow:hidden}.about-index{display:flex;flex-direction:column;justify-content:space-between;position:relative;z-index:1}.big-index{font-size:clamp(90px,15vw,205px);font-weight:500;letter-spacing:-.12em;line-height:.8;color:var(--surface-3)}.about-content{position:relative;z-index:1}.about h2{font-size:clamp(49px,6.5vw,86px)}.about h2 em{color:var(--accent)}.about-copy{max-width:480px;margin:36px 0 28px auto;color:var(--muted);font-size:12px;line-height:1.9}.about-copy p{margin:0 0 15px}.about-signature{margin-left:auto;max-width:480px;font:italic 22px var(--serif);color:var(--fg)}.about-signature span{font:8px var(--mono);color:var(--muted-2);padding-left:10px;letter-spacing:0}.about-sheen{position:absolute;width:440px;height:440px;border-radius:50%;right:-200px;top:-220px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 7%,transparent),transparent 70%);pointer-events:none}
.capabilities .section-heading{margin-bottom:66px}.capability-list{border-top:1px solid var(--line)}.capability-list article{display:grid;grid-template-columns:.22fr 1fr 1.2fr .15fr;gap:25px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line);transition:padding .25s}.capability-list article:hover{padding-left:8px}.cap-num{font:9px var(--mono);color:var(--accent)}.capability-list h3{font-size:18px;font-weight:500;letter-spacing:-.04em;margin:0}.capability-list p{font-size:10px;line-height:1.75;color:var(--muted);margin:0;max-width:370px}.cap-symbol{font-size:18px;text-align:right;color:var(--muted-2);transition:color .2s,transform .2s}.capability-list article:hover .cap-symbol{color:var(--accent);transform:rotate(12deg)}.cap-note{font:8px var(--mono);color:var(--muted-2);margin:15px 0}
.experiment{padding-top:clamp(56px,8vw,100px);padding-bottom:clamp(70px,9vw,120px);background:var(--surface);display:flex;align-items:center;justify-content:space-between;overflow:hidden}.experiment-info{max-width:500px}.experiment-info .eyebrow{margin-bottom:18px}.experiment h2{font-size:clamp(42px,6vw,78px)}.experiment h2 em{color:var(--accent)}.experiment-info>p:not(.eyebrow){font-size:11px;line-height:1.9;color:var(--muted);max-width:370px;margin:22px 0}.contact{background:#202424;color:#f1f1ec;padding-top:80px;padding-bottom:80px;position:relative;overflow:hidden}.contact:after{content:'VG';position:absolute;right:3vw;bottom:-.39em;font-size:clamp(200px,35vw,500px);font-weight:600;letter-spacing:-.14em;color:rgba(255,255,255,.018);pointer-events:none}.contact .eyebrow{color:#a9b0ab}.contact-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}.contact-orbit{font-size:20px;color:var(--accent)}.contact h2{position:relative;z-index:1;font-size:clamp(60px,10vw,132px);font-weight:500;line-height:.92;letter-spacing:-.09em;margin:10px 0 55px}.contact h2 em{color:var(--accent)}.contact-bottom{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:8vw;border-top:1px solid rgba(255,255,255,.16);padding-top:24px}.contact-bottom>p{max-width:300px;font-size:11px;line-height:1.85;color:#bdc3bd;margin:0}.contact form{display:flex;flex-direction:column;align-items:flex-start}.contact label{font:8px var(--mono);color:#b4bbb5;margin-bottom:8px}.contact textarea{resize:vertical;width:100%;min-height:75px;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.25);color:#fff;padding:8px 0;font-size:11px;line-height:1.7;border-radius:0}.contact textarea::placeholder{color:#929a94}.contact textarea:focus{outline:0;border-color:var(--accent)}.contact .button{margin-top:17px;border:0;cursor:pointer}.button-light{background:#f0f0ea;color:#191d19}.button-light:hover{background:var(--accent)}.form-status{font-size:9px;line-height:1.7;color:#adb5ae;margin:11px 0 0}.form-status[data-state=error]{color:#ffe2a8}.site-footer{padding:22px var(--gutter);display:flex;align-items:center;justify-content:space-between;min-height:80px}.site-footer>p{font-size:9px;color:var(--muted-2);margin:0}.site-footer>p span{padding-left:5px;color:var(--accent)}.site-footer>div{display:flex;gap:25px;align-items:center;font:8px var(--mono);color:var(--muted-2)}.site-footer>div a{color:var(--muted)}.site-footer>div a:hover{color:var(--accent)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.hero{column-gap:2.5vw}.hero h1{font-size:clamp(56px,8.3vw,84px)}.work-grid{grid-template-columns:1fr 1fr}.work-card-large{grid-column:1/-1}.work-card-large .work-visual{height:clamp(260px,44vw,390px)}.work-visual{height:clamp(230px,36vw,320px)}.site-nav{gap:20px}.about{grid-template-columns:.45fr 1.55fr}.capability-list article{grid-template-columns:.12fr 1fr 1.2fr .1fr;gap:16px}}
@media(max-width:640px){:root{scroll-padding-top:66px}.site-header{height:66px}.site-header.scrolled{height:58px}.wordmark-name{font-size:12px}.header-controls{gap:9px}.theme-toggle,.menu-toggle{width:35px;height:35px}.menu-toggle{display:grid}.menu-lines{display:flex;flex-direction:column;gap:5px}.menu-lines i{display:block;width:14px;height:1px;background:currentColor;transition:transform .2s}.menu-toggle[aria-expanded=true] .menu-lines i:first-child{transform:translateY(3px) rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-lines i:last-child{transform:translateY(-3px) rotate(-45deg)}.site-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:12px var(--gutter) 22px;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.site-nav.open{display:flex}.site-nav a:not(.nav-contact){padding:14px 0;border-bottom:1px solid var(--line);font-size:12px;justify-content:space-between}.site-nav .nav-contact{border:0;padding:15px 0;font-size:12px}.hero{min-height:auto;padding-top:55px;grid-template-columns:1fr;grid-template-rows:auto clamp(300px,91vw,410px) 42px;row-gap:23px}.hero-copy{padding:0}.hero .eyebrow{font-size:7px;margin-bottom:19px;gap:7px}.hero h1{font-size:clamp(54px,13.5vw,78px)}.hero-intro{font-size:12px;max-width:340px;margin:18px 0 20px}.hero-actions{gap:16px}.button{padding:14px 13px;font-size:9px;gap:13px}.hero-actions .text-link{font-size:9px}.hero-art{min-height:0}.art-caption,.art-index{left:15px;right:15px;font-size:7px}.hero-bottom{font-size:7px;letter-spacing:.025em}.hero-bottom>span:last-child{display:none}.section-pad{padding:80px var(--gutter)}.section-heading{display:block;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:15px}.section-heading h2{font-size:clamp(38px,10.7vw,56px)}.section-aside{font-size:9px;margin-top:13px}.work-grid{grid-template-columns:1fr;gap:27px}.work-card-large{grid-column:auto}.work-card-large .work-visual,.work-visual{height:clamp(235px,75vw,350px)}.project-meta h3{font-size:17px}.work-footnote{margin-top:26px}.about{display:block}.about-index{display:block;margin-bottom:43px}.big-index{display:none}.about h2{font-size:clamp(46px,11.7vw,65px)}.about-copy{margin:27px 0 23px;font-size:11px}.about-signature{margin:0;font-size:20px}.about-signature span{display:block;padding:5px 0 0}.capabilities .section-heading{margin-bottom:35px}.capability-list article{grid-template-columns:26px 1fr 20px;gap:11px;align-items:start;padding:20px 0}.capability-list h3{font-size:15px}.capability-list p{grid-column:2/3;grid-row:2;font-size:9px}.cap-symbol{grid-column:3;grid-row:1/3}.cap-note{font-size:7px;line-height:1.7}.experiment{padding-top:62px;padding-bottom:62px;min-height:350px}.experiment-info{position:relative;z-index:1}.experiment h2{font-size:46px}.experiment-info>p:not(.eyebrow){font-size:10px;max-width:270px}.contact{padding-top:59px;padding-bottom:56px}.contact h2{font-size:clamp(57px,14.5vw,86px);margin:8px 0 38px}.contact-bottom{grid-template-columns:1fr;gap:21px;padding-top:19px}.contact-bottom>p{font-size:10px}.site-footer{min-height:105px;flex-wrap:wrap;gap:14px;padding-top:19px;padding-bottom:19px}.site-footer>p{order:3;width:100%}.site-footer>div{gap:12px;font-size:7px}}
@media(max-width:370px){:root{--gutter:18px}.hero h1{font-size:53px}.hero-actions{gap:11px}.button{gap:9px}.hero-actions .text-link{font-size:8px}.hero-bottom{font-size:6px}.site-footer>div{gap:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Product proof, project status, and the public-facing portfolio details. */
.visual-image{display:block;background:var(--surface-2);color:white}
.visual-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .35s}
.visual-botbytes img{object-position:center 42%}
.visual-chalk-shot img{object-position:center 37%}
.work-card:hover .visual-image img{transform:scale(1.025)}
.visual-image:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(8,10,12,.26),transparent 32%,transparent 72%,rgba(8,10,12,.14))}
.visual-image .visual-kicker,.visual-image .visual-number{z-index:2;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.visual-image:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.status-label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.status-label i{width:5px;height:5px;border-radius:50%;background:currentColor;display:inline-block}
.status-live{color:#ff918b}
.status-prototype{color:#efbf83}
.status-building{color:#aeb8f2}
.project-type .status-live{color:#ff918b}
.project-type .status-prototype{color:#efbf83}
.project-type .status-building{color:#aeb8f2}
.project-tags{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 0}
.project-tags span{font:7px var(--mono);letter-spacing:.035em;color:var(--muted);border:1px solid var(--line);padding:5px 7px}
.visual-auction{isolation:isolate;background:radial-gradient(ellipse at 50% 48%,#563b2e 0,#31251f 46%,#1a1b1b 100%);color:#f4eee5}
.visual-auction:before{content:'';position:absolute;inset:11%;border:1px solid rgba(240,207,154,.19);border-radius:50%;transform:rotate(-27deg) scaleY(.52);box-shadow:0 0 0 28px rgba(240,207,154,.025),0 0 0 64px rgba(240,207,154,.02)}
.auction-orbit{position:absolute;width:66%;height:28%;border:1px solid rgba(237,198,138,.24);border-radius:50%;transform:rotate(32deg)}
.auction-orbit-two{width:55%;height:68%;transform:rotate(-28deg);border-color:rgba(237,198,138,.12)}
.auction-ball{position:absolute;width:42px;height:42px;right:18%;top:27%;border-radius:50%;background:radial-gradient(circle at 35% 29%,#fff7df,#d6a96b 46%,#704727 80%);box-shadow:0 12px 28px rgba(0,0,0,.42)}
.auction-ball:after{content:'';position:absolute;width:41px;height:20px;top:10px;left:0;border:1px solid rgba(61,37,22,.55);border-radius:50%;transform:rotate(-31deg)}
.auction-board{position:relative;z-index:1;width:72%;min-height:45%;padding:clamp(15px,2vw,24px);display:flex;flex-direction:column;justify-content:center;gap:14px;border:1px solid rgba(255,238,205,.2);background:linear-gradient(130deg,rgba(42,34,30,.86),rgba(24,27,27,.9));box-shadow:0 22px 50px rgba(0,0,0,.35);transform:rotate(-3deg);backdrop-filter:blur(8px)}
.auction-board>span,.auction-board small{font:7px var(--mono);letter-spacing:.1em;color:rgba(242,231,211,.6)}
.auction-board>b{font-size:clamp(20px,2.6vw,34px);font-weight:500;letter-spacing:-.065em;display:flex;justify-content:space-between;align-items:center}
.auction-board b i{font:normal 17px var(--mono);color:#e5bd81}
.auction-board small{font-size:6px;letter-spacing:.055em}
.auction-rule{height:1px;width:100%;background:linear-gradient(90deg,rgba(230,190,131,.6),rgba(230,190,131,.08))}
.workshop-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin:clamp(68px,9vw,118px) 0 32px;padding-top:35px;border-top:1px solid var(--line)}
.workshop-heading .eyebrow{margin-bottom:14px}
.workshop-heading h3{font-size:clamp(28px,4.3vw,49px);line-height:1.07;letter-spacing:-.065em;font-weight:500;margin:0}
.workshop-heading .section-aside{flex:none}
.workshop-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.workshop-card{display:grid;grid-template-columns:58px 1fr;align-items:start;gap:18px;min-width:0;padding:24px 25px 24px 0;border-bottom:1px solid var(--line);transition:background-color .25s,transform .25s}
.workshop-card:nth-child(odd){border-right:1px solid var(--line);padding-right:26px}
.workshop-card:nth-child(even){padding-left:26px}
.workshop-card:hover{background:color-mix(in srgb,var(--surface) 56%,transparent)}
.workshop-symbol{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--line-strong);color:var(--fg);font:16px var(--mono);position:relative;overflow:hidden}
.symbol-shield{color:#d8e7a5;background:radial-gradient(circle at 50% 50%,rgba(177,209,125,.12),transparent 70%)}
.symbol-shield span{position:absolute;right:5px;top:4px;font-size:8px;color:var(--muted-2)}
.symbol-build{font-size:19px;letter-spacing:-.1em;color:#e1c8a7}
.symbol-build span{font:italic 12px var(--serif);padding-left:3px}
.symbol-friday{border-radius:50%;background:radial-gradient(circle,rgba(158,171,243,.18),transparent 75%)}
.symbol-friday i{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 34% 27%,#eaf0ff,#7886d7 54%,#252a4d);box-shadow:0 0 19px rgba(119,136,224,.48)}
.symbol-bytebrowse{display:flex;gap:4px;align-items:center;justify-content:center}
.symbol-bytebrowse span{height:22px;width:12px;border:1px solid var(--line-strong);border-radius:2px;background:var(--surface-2)}
.symbol-bytebrowse span:first-child{height:28px;background:color-mix(in srgb,var(--accent) 24%,var(--surface-2))}
.workshop-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font:7px var(--mono);letter-spacing:.04em;color:var(--muted-2)}
.workshop-meta .status-label{font-size:6px;color:#b8c0f5}
.workshop-meta .status-building{color:#b8c0f5}
.workshop-meta .status-prototype{color:#efbf83}
.workshop-card h3{font-size:19px;letter-spacing:-.045em;font-weight:500;margin:10px 0 7px}
.workshop-card p{max-width:430px;font-size:10px;line-height:1.75;color:var(--muted);margin:0}
.archive-details{margin-top:24px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 30%,transparent)}
.archive-details summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:15px;padding:17px 19px;min-height:54px;font-size:11px;color:var(--fg)}
.archive-details summary::-webkit-details-marker{display:none}
.archive-details summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.archive-count{font:7px var(--mono);letter-spacing:.05em;color:var(--muted-2);margin-left:auto}
.archive-chevron{font:14px var(--mono);color:var(--accent);transition:transform .2s}
.archive-details[open] .archive-chevron{transform:rotate(45deg)}
.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.archive-grid article{padding:20px 18px;min-height:140px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.archive-grid article:nth-child(3n){border-right:0}
.archive-grid article>span{font:6px var(--mono);letter-spacing:.07em;color:var(--muted-2)}
.archive-grid h4{font-size:14px;font-weight:500;letter-spacing:-.03em;margin:10px 0 7px}
.archive-grid p{font-size:9px;line-height:1.75;color:var(--muted);margin:0}
.ecosystem-note{display:flex;align-items:center;gap:13px;max-width:480px;margin:0 0 27px auto;padding:12px;border:1px solid var(--line)}
.ecosystem-mark{width:34px;height:34px;display:grid;place-items:center;flex:none;border:1px solid var(--line-strong);border-radius:50%;font:8px var(--mono);color:var(--accent)}
.ecosystem-note p{font-size:9px;line-height:1.7;color:var(--muted);margin:0}
.ecosystem-note b{color:var(--fg);font-weight:500}
.toolkit-groups{border-top:1px solid var(--line)}
.toolkit-groups article{display:grid;grid-template-columns:55px 1fr 30px;align-items:center;gap:20px;padding:23px 0;border-bottom:1px solid var(--line)}
.toolkit-index{font:9px var(--mono);color:var(--accent)}
.toolkit-groups h3{font-size:17px;font-weight:500;letter-spacing:-.035em;margin:0 0 8px}
.toolkit-groups p{font-size:10px;line-height:1.8;color:var(--muted);margin:0}
.toolkit-spark{font-size:19px;text-align:right;color:var(--muted-2)}
.contact-intro{display:flex;flex-direction:column;align-items:flex-start;gap:13px}
.contact-email,.contact-github{font-size:10px;color:#f1f1ec;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:6px}
.contact-email span,.contact-github span{color:var(--accent);padding-left:9px}
.contact-email:hover,.contact-github:hover{color:var(--accent);border-color:var(--accent)}
:root[data-theme=light] .status-live,:root[data-theme=light] .project-type .status-live{color:#a82020}
:root[data-theme=light] .status-prototype,:root[data-theme=light] .project-type .status-prototype{color:#8b530e}
:root[data-theme=light] .status-building,:root[data-theme=light] .project-type .status-building{color:#505c9e}
:root[data-theme=light] .workshop-meta .status-building{color:#505c9e}
:root[data-theme=light] .workshop-meta .status-prototype{color:#8b530e}
@media(max-width:900px){.workshop-grid{grid-template-columns:1fr}.workshop-card,.workshop-card:nth-child(odd),.workshop-card:nth-child(even){padding:21px 0;border-right:0}.archive-grid{grid-template-columns:1fr 1fr}.archive-grid article:nth-child(3n){border-right:1px solid var(--line)}.archive-grid article:nth-child(2n){border-right:0}.workshop-heading{align-items:flex-start}}
@media(max-width:640px){.project-tags span{font-size:6px}.auction-board{width:75%;min-height:43%;gap:12px;padding:15px}.auction-board>b{font-size:26px}.auction-board>span{font-size:6px}.workshop-heading{display:block;margin-top:62px;margin-bottom:22px;padding-top:26px}.workshop-heading .section-aside{margin-top:11px}.workshop-card,.workshop-card:nth-child(odd),.workshop-card:nth-child(even){grid-template-columns:42px 1fr;gap:13px;padding:18px 0}.workshop-symbol{width:40px;height:40px}.workshop-meta{align-items:flex-start;flex-direction:column;gap:7px;font-size:6px}.workshop-meta .status-label{font-size:6px}.workshop-card h3{font-size:17px;margin:8px 0 6px}.workshop-card p{font-size:9px}.archive-details summary{padding:15px 13px;font-size:10px;gap:8px}.archive-count{font-size:6px}.archive-grid{grid-template-columns:1fr}.archive-grid article,.archive-grid article:nth-child(3n){min-height:0;padding:17px 14px;border-right:0}.ecosystem-note{margin:0 0 24px}.toolkit-groups article{grid-template-columns:28px 1fr 18px;gap:11px;padding:18px 0}.toolkit-groups h3{font-size:15px}.toolkit-groups p{font-size:9px}.toolkit-spark{font-size:16px}.contact-intro{gap:11px}}

/* BorgByteHub brand section and live product links. */
.brand-section{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brand-kicker{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:clamp(30px,4vw,54px)}
.brand-kicker .eyebrow{margin:0}
.brand-edition,.brand-logo-index,.brand-logo-action{font:7px var(--mono);letter-spacing:.1em;color:var(--muted-2)}
.brand-layout{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);align-items:center;gap:clamp(35px,7vw,100px)}
.brand-logo-panel{position:relative;display:block;min-width:0;min-height:420px;aspect-ratio:1.08;overflow:hidden;border:1px solid var(--line-strong);background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--accent) 8%,var(--surface-2)),transparent 66%),var(--bg);transition:border-color .3s,transform .35s}
.brand-logo-panel:hover{border-color:var(--accent);transform:translateY(-3px)}
.brand-logo-panel:focus-visible,.brand-product:focus-visible,.brand-home-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.brand-logo-index,.brand-logo-action{position:absolute;z-index:2;left:19px;right:19px;display:flex;justify-content:space-between;align-items:center}
.brand-logo-index{top:18px}
.brand-logo-index b{font-weight:400;color:var(--accent)}
.brand-logo-action{bottom:18px;color:var(--fg)}
.brand-logo-action b{font-size:13px;font-weight:400;color:var(--accent)}
.brand-logo-frame{position:absolute;inset:9% 7% 15%;display:grid;place-items:center;overflow:hidden}
.brand-logo-frame img{position:absolute;left:50%;top:50%;width:170%;height:auto;max-width:none;transform:translate(-50%,-50%)}
.brand-story>.eyebrow{margin:0 0 17px}
.brand-story h2{font-size:clamp(38px,5.2vw,69px);line-height:.99;letter-spacing:-.075em;font-weight:500;margin:0}
.brand-story h2 em{font-family:var(--serif);font-weight:400;color:var(--accent);letter-spacing:-.065em}
.brand-description{max-width:500px;margin:20px 0 0;color:var(--muted);font-size:11px;line-height:1.85}
.brand-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:27px}
.brand-product{position:relative;min-width:0;min-height:153px;padding:14px 14px 18px;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 42%,transparent);transition:transform .25s,border-color .25s,background-color .25s}
.brand-product:hover{transform:translateY(-3px);border-color:var(--line-strong);background:color-mix(in srgb,var(--bg) 68%,transparent)}
.brand-product-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font:7px var(--mono);color:var(--muted-2)}
.brand-product-top .status-label{font-size:7px}
.brand-product h3{font-size:17px;font-weight:500;letter-spacing:-.045em;margin:21px 0 5px}
.brand-product p{max-width:210px;margin:0;color:var(--muted);font-size:9px;line-height:1.55}
.brand-product-arrow{position:absolute;right:14px;bottom:14px;color:var(--accent);font-size:13px;transition:transform .2s}
.brand-product:hover .brand-product-arrow{transform:translate(2px,-2px)}
.brand-home-link{display:inline-flex;align-items:center;gap:14px;margin-top:18px;padding-bottom:6px;border-bottom:1px solid var(--line-strong);font-size:9px;color:var(--fg)}
.brand-home-link span{color:var(--accent)}
.brand-home-link:hover{border-color:var(--accent)}
/* Let the hero lead with real work instead of a detached abstract object. */
.hero-project-scene{position:absolute;inset:65px 20px 58px;z-index:2}
.hero-project-card{position:absolute;display:block;overflow:hidden;border:1px solid var(--line-strong);background:#111516;box-shadow:0 23px 52px rgba(0,0,0,.42);transform:translate3d(var(--shift-x,0px),var(--shift-y,0px),0) rotate(var(--tilt));transition:transform .22s ease-out,border-color .25s,box-shadow .25s}
.hero-project-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.hero-project-card:hover{border-color:var(--accent);box-shadow:0 28px 60px rgba(0,0,0,.52)}
.hero-project-main{--tilt:-3deg;left:8%;top:0;width:58%;height:96%;z-index:2}
.hero-project-secondary{--tilt:6deg;right:2%;bottom:0;width:46%;height:59%;z-index:3}
.hero-project-visual{position:absolute;inset:0 0 41px;display:block;overflow:hidden;background:#111516}
.hero-project-visual img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.72) brightness(.88);transition:transform .5s,filter .35s}
.hero-project-main .hero-project-visual img{object-fit:contain;object-position:center;background:#090d14;filter:none}
.hero-project-secondary .hero-project-visual img{object-position:center 24%;filter:saturate(.6) brightness(.86)}
.hero-project-card:hover .hero-project-visual img{transform:scale(1.025);filter:saturate(.88) brightness(.94)}
.hero-project-footer{position:absolute;bottom:0;left:0;right:0;height:41px;padding:0 11px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;background:var(--bg);border-top:1px solid var(--line);color:var(--fg)}
.hero-project-footer .status-label{font:6px var(--mono);letter-spacing:.035em}
.hero-project-footer strong{font-size:10px;font-weight:500;letter-spacing:-.025em;white-space:nowrap}
.hero-project-footer>span:last-child{font-size:11px;color:var(--accent)}
.hero-project-secondary .hero-project-footer{height:38px;padding:0 8px;gap:6px}
.hero-project-secondary .hero-project-footer strong{font-size:8px}
.hero-project-secondary .hero-project-footer .status-label{font-size:5px}
.hero-project-gallery .art-caption,.hero-project-gallery .art-index{z-index:5}
.hero-project-gallery .art-cross{z-index:4}
.hero-project-gallery .ring-one,.hero-project-gallery .ring-two{z-index:1;opacity:.55}
.hero-project-main:hover .hero-project-visual img{filter:none;transform:scale(1.012)}
@media(max-width:900px){.hero-project-scene{inset:62px 18px 56px}.hero-project-main{left:5%;width:63%;height:94%}.hero-project-secondary{width:45%;height:58%}}
@media(max-width:640px){.hero-project-scene{inset:58px 12px 54px}.hero-project-main{--tilt:-3deg;left:5%;top:1%;width:62%;height:94%}.hero-project-secondary{--tilt:4deg;right:1%;bottom:0;width:48%;height:59%}.hero-project-footer{height:37px;padding:0 8px;gap:7px}.hero-project-footer .status-label{font-size:5px}.hero-project-footer strong{font-size:8px}.hero-project-main .hero-project-footer{grid-template-columns:1fr auto;gap:4px;padding:0 6px}.hero-project-main .hero-project-footer .status-label{grid-column:1/-1;align-self:end;font-size:4.8px}.hero-project-main .hero-project-footer strong{grid-column:1;align-self:start}.hero-project-main .hero-project-footer>span:last-child{grid-column:2;grid-row:2}.hero-project-secondary .hero-project-footer{height:34px;grid-template-columns:1fr auto}.hero-project-secondary .hero-project-footer .status-label{display:none}.hero-project-secondary .hero-project-footer strong{font-size:7px}.hero-project-visual{bottom:37px}.hero-project-secondary .hero-project-visual{bottom:34px}.hero-project-gallery .art-caption,.hero-project-gallery .art-index{font-size:6px}}
@media(max-width:900px){.brand-layout{grid-template-columns:1fr;gap:38px}.brand-logo-panel{min-height:0;aspect-ratio:1.65}.brand-logo-frame img{width:150%}.brand-story{max-width:700px}}
@media(max-width:640px){.brand-section{padding-top:64px;padding-bottom:67px}.brand-kicker{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:25px}.brand-edition{font-size:6px}.brand-layout{gap:31px}.brand-logo-panel{aspect-ratio:1.18}.brand-logo-index,.brand-logo-action{left:13px;right:13px;font-size:6px}.brand-logo-index{top:13px}.brand-logo-action{bottom:13px}.brand-logo-frame{inset:10% 6% 16%}.brand-logo-frame img{width:168%}.brand-story h2{font-size:clamp(39px,10.5vw,57px)}.brand-description{font-size:10px;margin-top:16px}.brand-products{grid-template-columns:1fr;gap:8px;margin-top:22px}.brand-product{min-height:138px;padding:13px}.brand-product h3{margin-top:17px}.brand-home-link{margin-top:16px}}

/* Small, tactile motion supports the portfolio's studio feel. */
.hero-copy>.eyebrow,.hero h1,.hero-intro,.hero-actions{animation:portfolio-rise .72s cubic-bezier(.2,.75,.25,1) both}
.hero-copy>.eyebrow{animation-delay:.06s}.hero h1{animation-delay:.13s}.hero-intro{animation-delay:.21s}.hero-actions{animation-delay:.29s}
.hero-project-main{animation:portfolio-card-enter .86s cubic-bezier(.18,.76,.25,1) .12s both}
.hero-project-secondary{animation:portfolio-card-enter .86s cubic-bezier(.18,.76,.25,1) .28s both}
@keyframes portfolio-rise{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
@keyframes portfolio-card-enter{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
.portfolio-cursor{position:fixed;z-index:1000;top:0;left:0;width:42px;height:42px;pointer-events:none;opacity:0;visibility:hidden;transform:translate(-50%,-50%);transition:opacity .18s,visibility .18s,left .075s ease-out,top .075s ease-out;color:var(--accent)}
.portfolio-cursor.is-visible{opacity:1;visibility:visible}
.portfolio-cursor-ring{position:absolute;inset:4px;border:1px solid currentColor;border-radius:50%;background:color-mix(in srgb,var(--accent) 8%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 13%,transparent);transition:inset .24s cubic-bezier(.2,.8,.2,1),background .24s,box-shadow .24s,scale .24s}
.portfolio-cursor-ring:before{content:'';position:absolute;top:-4px;left:50%;width:1px;height:7px;background:currentColor;transform:translateX(-50%);transform-origin:50% 24px;animation:cursor-orbit 8s linear infinite}
.portfolio-cursor-core{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;background:currentColor;transform:translate(-50%,-50%);transition:scale .2s}
.portfolio-cursor-label{position:absolute;left:50%;top:35px;transform:translate(-50%,4px);padding:4px 6px 3px;border-radius:2px;background:var(--accent);color:var(--accent-ink);font:6px var(--mono);letter-spacing:.13em;opacity:0;transition:opacity .18s,transform .18s;white-space:nowrap}
.portfolio-cursor.is-link .portfolio-cursor-ring{inset:0;background:color-mix(in srgb,var(--accent) 13%,transparent);box-shadow:0 0 24px color-mix(in srgb,var(--accent) 25%,transparent)}
.portfolio-cursor.is-link .portfolio-cursor-core{scale:.55}
.portfolio-cursor.is-link .portfolio-cursor-label{opacity:1;transform:translate(-50%,0)}
.portfolio-cursor.is-down .portfolio-cursor-ring{scale:.78}
@keyframes cursor-orbit{to{rotate:360deg}}
body.cursor-enabled,body.cursor-enabled *{cursor:none!important}
body.cursor-enabled input,body.cursor-enabled textarea{cursor:text!important}
@media(hover:hover) and (pointer:fine){.portfolio-cursor{display:block}}
@media(hover:none),(pointer:coarse){.portfolio-cursor{display:none}}

/* Studio note: a small product workflow panel instead of the old metallic sphere. */
.experiment{gap:5vw}
.experiment h2{max-width:540px}
.studio-interface{position:relative;width:clamp(300px,36vw,440px);height:clamp(250px,27vw,320px);padding:16px;display:flex;align-items:center;flex:none;overflow:hidden;isolation:isolate;border:1px solid var(--line-strong);background:var(--bg);box-shadow:0 22px 55px rgba(0,0,0,.2)}
.studio-interface:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 86% 5%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 52%)}
.studio-interface:after{content:'';position:absolute;inset:0;z-index:-1;opacity:.22;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(135deg,black,transparent 80%)}
.studio-console{position:relative;width:100%;padding:13px 14px 11px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 86%,var(--bg));box-shadow:0 10px 24px rgba(0,0,0,.16)}
.studio-console-header,.studio-console-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;font:6px var(--mono);letter-spacing:.08em;color:var(--muted-2)}
.studio-console-lights{display:flex;gap:4px}.studio-console-lights i{width:4px;height:4px;border-radius:50%;background:var(--muted-2)}.studio-console-lights i:first-child{background:var(--accent);box-shadow:0 0 8px color-mix(in srgb,var(--accent) 60%,transparent)}
.studio-console-title{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:22px 0 16px}.studio-console-title>span{font:6px var(--mono);letter-spacing:.08em;color:var(--muted-2)}.studio-console-title b{font-size:12px;line-height:1.3;font-weight:500;letter-spacing:-.035em;color:var(--fg)}.studio-console-title b span{color:var(--accent)}
.studio-flow{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.studio-flow-line{position:absolute;z-index:0;left:13%;right:13%;top:34px;height:1px;background:var(--line-strong);overflow:hidden}.studio-flow-line:after{content:'';position:absolute;top:0;left:-25%;width:25%;height:1px;background:var(--accent);box-shadow:0 0 8px var(--accent);animation:studio-signal 3.8s ease-in-out infinite}
.studio-step{position:relative;z-index:1;min-height:70px;padding:7px 8px;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto;align-items:center;border:1px solid var(--line);background:var(--bg);color:var(--muted-2)}.studio-step>span{font:6px var(--mono)}.studio-step>b{grid-column:1/-1;font:7px var(--mono);letter-spacing:.1em;color:var(--muted)}.studio-step>i{grid-column:2;grid-row:1/3;width:22px;height:22px;display:grid;place-items:center;border:1px solid var(--line);color:var(--fg);font:10px var(--mono);font-style:normal}.studio-step-idea{color:var(--accent)!important}.studio-step-design{display:flex!important;align-items:center;justify-content:center;gap:2px}.studio-step-design i{width:3px;height:8px;background:var(--muted-2)}.studio-step-design i:nth-child(2){height:13px;background:var(--accent)}.studio-step-build{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--bg))}.studio-step-build-icon{font-size:7px!important;color:var(--accent)!important}
.studio-console-footer{padding-top:12px;margin-top:11px;border-top:1px solid var(--line)}.studio-console-footer span:last-child{color:var(--accent)}.studio-console-footer i{display:inline-block;width:4px;height:4px;margin-right:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 7px color-mix(in srgb,var(--accent) 65%,transparent);animation:studio-status 1.8s ease-in-out infinite}
@keyframes studio-signal{0%{left:-25%;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}@keyframes studio-status{50%{opacity:.35;box-shadow:0 0 2px transparent}}
@media(max-width:900px){.studio-interface{width:clamp(300px,40vw,400px);height:280px;padding:13px}.studio-console{padding:12px}}
@media(max-width:640px){.experiment{display:block;min-height:0}.experiment-info{max-width:520px}.experiment h2{font-size:clamp(42px,11vw,60px)}.studio-interface{width:100%;max-width:440px;height:clamp(245px,72vw,290px);margin:34px auto 0;padding:12px}.studio-console{padding:12px}.studio-console-title{margin:18px 0 14px}.studio-console-title b{font-size:11px}.studio-step{min-height:67px;padding:6px}}

/* Depth responds gently to scroll; motion stays small and compositor-friendly. */
.scroll-progress{position:fixed;z-index:31;top:0;left:0;right:0;height:2px;pointer-events:none;background:transparent}
.scroll-progress span{display:block;width:100%;height:100%;transform:scaleX(var(--scroll-progress,0));transform-origin:left center;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 62%,white));box-shadow:0 0 10px color-mix(in srgb,var(--accent) 42%,transparent)}
[data-parallax-speed]{translate:0 var(--scroll-parallax-y,0px);will-change:translate}
.work-grid .work-card:nth-child(1){--reveal-delay:.04s}.work-grid .work-card:nth-child(2){--reveal-delay:.13s}.work-grid .work-card:nth-child(3){--reveal-delay:.22s}.work-grid .work-card.reveal{transition-delay:var(--reveal-delay,0s)}
.capability-list article:nth-child(2){--reveal-delay:.08s}.capability-list article:nth-child(3){--reveal-delay:.16s}.capability-list article.reveal{transition-delay:var(--reveal-delay,0s)}
@media(prefers-reduced-motion:reduce){[data-parallax-speed]{translate:none!important;will-change:auto}.scroll-progress span{box-shadow:none}}

/* Current age and certificate collection. */
.hero .eyebrow>.hero-age{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;margin-left:3px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 7%,transparent);color:var(--fg);letter-spacing:0;text-transform:none;white-space:nowrap}
.hero-age strong{font:600 15px/1 var(--display);letter-spacing:-.06em;color:var(--accent)}
.hero-age span{font:7px/1 var(--mono);color:var(--muted)}
.certifications{background:var(--surface)}
.certifications h2 em{font-family:var(--serif);font-weight:500;letter-spacing:-.075em;color:var(--accent)}
.certifications-heading{align-items:flex-end}
.certification-summary{display:flex;align-items:center;gap:13px;margin-bottom:5px;padding-left:16px;border-left:1px solid var(--line-strong)}
.certification-summary strong{font:500 48px/.9 var(--display);letter-spacing:-.09em;color:var(--accent)}
.certification-summary span{font-size:10px;line-height:1.5;color:var(--muted)}
.certification-summary i{align-self:flex-start;margin:3px 0 0 5px;color:var(--muted-2);font:7px var(--mono);letter-spacing:.08em;font-style:normal}
.certificate-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.certificate-group{position:relative;overflow:hidden;padding:21px 23px 17px;border:1px solid var(--line);background:var(--bg);transition:border-color .3s,background-color .3s,transform .35s}
.certificate-group:before{content:'';position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--accent),transparent 68%);opacity:.65}
.certificate-group:hover{border-color:color-mix(in srgb,var(--accent) 62%,var(--line));transform:translateY(-3px)}
.certificate-group-head{display:grid;grid-template-columns:39px minmax(0,1fr) auto;align-items:center;gap:12px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.certificate-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line-strong);color:var(--accent);font:500 16px var(--mono);letter-spacing:-.08em}
.certificate-mark-hackerrank{font-weight:600}
.certificate-mark-google{font:600 18px var(--display)}
.certificate-mark-ibm{font:600 9px var(--mono);letter-spacing:-.08em}
.certificate-mark-learn,.certificate-mark-skillup{font:600 15px var(--display)}
.certificate-group-head>div>p{margin:0 0 5px;color:var(--muted-2);font:7px var(--mono);letter-spacing:.08em}
.certificate-group-head h3{margin:0;font-size:17px;font-weight:500;letter-spacing:-.04em}
.certificate-count{align-self:start;padding:5px 6px;border:1px solid var(--line);color:var(--muted-2);font:7px var(--mono)}
.certificate-group ul{list-style:none;margin:11px 0 0;padding:0}
.certificate-group li{position:relative;padding:8px 0 8px 13px;border-bottom:1px solid var(--line);font-size:10px;line-height:1.5;color:var(--muted)}
.certificate-group li:last-child{border-bottom:0}
.certificate-group li:before{content:'';position:absolute;left:0;top:14px;width:4px;height:4px;border-radius:50%;background:var(--accent)}
.certificate-note{margin:0 0 0 13px;color:var(--muted-2);font-size:9px;line-height:1.6}
.certificate-footnote{margin:30px 0 0;padding-top:15px;border-top:1px solid var(--line);color:var(--muted-2);font-size:9px;line-height:1.6}
.certificate-group:nth-child(2){transition-delay:.07s}.certificate-group:nth-child(3){transition-delay:.11s}.certificate-group:nth-child(4){transition-delay:.15s}.certificate-group:nth-child(5){transition-delay:.19s}.certificate-group:nth-child(6){transition-delay:.23s}
@media(max-width:820px){.header-controls{gap:9px}.menu-toggle{display:grid}.site-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:12px var(--gutter) 22px;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.site-nav.open{display:flex}.site-nav a:not(.nav-contact){padding:14px 0;border-bottom:1px solid var(--line);font-size:12px;justify-content:space-between}.site-nav .nav-contact{border:0;padding:15px 0;font-size:12px}}
@media(max-width:640px){.certifications-heading{display:block}.certification-summary{width:max-content;margin:22px 0 0;padding-left:12px}.certification-summary strong{font-size:40px}.certification-summary i{margin-left:2px}.certificate-grid{grid-template-columns:1fr;gap:10px}.certificate-group{padding:18px 16px 14px}.certificate-group-head h3{font-size:16px}.certificate-group li{font-size:10px}.certificate-footnote{margin-top:23px}}
@media(prefers-reduced-motion:reduce){.certificate-group{transition:none}}

/* Certificates open as watermarked, image-only previews inside the portfolio. */
.certificate-group li{padding:0}
.certificate-open{position:relative;width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:8px 19px 8px 13px;border:0;background:transparent;color:var(--muted);font:inherit;text-align:left;cursor:pointer;transition:color .2s}
.certificate-open:hover{color:var(--fg)}
.certificate-open:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.certificate-open-arrow{position:absolute;right:1px;color:var(--accent);opacity:.35;transform:translate(-2px,2px);transition:opacity .2s,transform .2s}
.certificate-open:hover .certificate-open-arrow,.certificate-open:focus-visible .certificate-open-arrow{opacity:1;transform:translate(0,0)}
.certificate-viewer{width:min(1160px,calc(100vw - 28px));height:min(92dvh,920px);max-width:none;max-height:none;padding:0;overflow:hidden;border:0;background:transparent;color:var(--fg)}
.certificate-viewer::backdrop{background:rgba(5,7,8,.8);backdrop-filter:blur(12px)}
.certificate-viewer-shell{height:100%;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden;border:1px solid var(--line-strong);background:var(--bg);box-shadow:0 35px 100px rgba(0,0,0,.55)}
.certificate-viewer-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:17px 20px 15px;border-bottom:1px solid var(--line)}
.certificate-viewer-header .eyebrow{margin:0 0 7px;font-size:7px}.certificate-viewer-header .eyebrow span{color:var(--accent)}
.certificate-viewer-header h2{margin:0;font-size:clamp(17px,2vw,22px);font-weight:500;letter-spacing:-.045em}
.certificate-viewer-header>div>p:last-child{margin:5px 0 0;color:var(--muted);font-size:9px}
.certificate-close,.certificate-zoom-tools button,.certificate-viewer-footer button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-strong);background:transparent;color:var(--fg);cursor:pointer;transition:color .2s,border-color .2s,background-color .2s}
.certificate-close{width:35px;height:35px;flex:none;border-radius:50%;font:20px/1 var(--display)}
.certificate-close:hover,.certificate-zoom-tools button:hover,.certificate-viewer-footer button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}
.certificate-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 17px;border-bottom:1px solid var(--line);color:var(--muted-2);font:7px var(--mono);letter-spacing:.08em}
.certificate-zoom-tools{display:flex;align-items:center;gap:6px}
.certificate-zoom-tools button{min-width:28px;height:27px;padding:0 8px;font:11px var(--mono)}
.certificate-zoom-tools button:last-child{font-size:7px;letter-spacing:.06em;text-transform:uppercase}
.certificate-zoom-tools button:disabled,.certificate-viewer-footer button:disabled{opacity:.35;cursor:default}
.certificate-zoom-tools>span{min-width:34px;text-align:center;color:var(--fg);font:7px var(--mono)}
.certificate-stage{position:relative;overflow:auto;background:#0a0c0d;overscroll-behavior:contain;scrollbar-color:rgba(255,255,255,.25) transparent;scrollbar-width:thin}
.certificate-image-wrap{width:max-content;min-width:100%;min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.certificate-page{display:block;max-width:none;flex:none;object-fit:contain;box-shadow:0 16px 48px rgba(0,0,0,.42);user-select:none;-webkit-user-drag:none;transition:width .2s ease,height .2s ease}
.certificate-watermark{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-20deg);color:var(--accent);font:500 clamp(18px,3vw,34px) var(--mono);letter-spacing:.12em;white-space:nowrap;opacity:.12;text-shadow:0 2px 14px rgba(0,0,0,.6);pointer-events:none;user-select:none}
.certificate-viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 17px;border-top:1px solid var(--line);background:var(--bg)}
.certificate-viewer-footer button{min-height:32px;gap:10px;padding:0 11px;font-size:8px}
.certificate-viewer-footer>span{color:var(--muted-2);font:7px var(--mono);letter-spacing:.08em}
@media(max-width:640px){.certificate-viewer{width:calc(100vw - 12px);height:94dvh}.certificate-viewer-header{padding:13px 13px 12px}.certificate-viewer-header .eyebrow{font-size:6px}.certificate-viewer-header h2{font-size:16px}.certificate-viewer-header>div>p:last-child{font-size:8px}.certificate-toolbar{padding:7px 10px;font-size:6px}.certificate-zoom-tools{gap:4px}.certificate-zoom-tools button{min-width:26px;height:26px}.certificate-image-wrap{padding:14px}.certificate-watermark{font-size:clamp(14px,5vw,22px);letter-spacing:.06em}.certificate-viewer-footer{padding:9px 10px}.certificate-viewer-footer button{min-height:30px;padding:0 8px;font-size:7px}}
@media(prefers-reduced-motion:reduce){.certificate-open,.certificate-open-arrow,.certificate-page,.certificate-close,.certificate-zoom-tools button,.certificate-viewer-footer button{transition:none}}