/* A restrained 3D identity scene; the rest of the portfolio stays easy to read. */
html{scroll-snap-type:none}
.hero{grid-template-columns:minmax(0,1fr) minmax(420px,1.05fr);gap:clamp(24px,5vw,84px);padding-top:120px}
.hero-art.perspective-art{
  --tilt-x:0deg;--tilt-y:0deg;--scroll-shift:0px;
  min-height:clamp(390px,45vw,590px);height:auto;padding:26px 18px 30px;border:0;border-radius:0;
  background:radial-gradient(ellipse at 50% 47%,#d7f58212,transparent 56%);overflow:visible;
  transform:perspective(1050px) translate3d(0,var(--scroll-shift),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
  transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.7,.2,1);will-change:transform
}
.perspective-art:before{content:"";position:absolute;z-index:-2;left:50%;top:49%;width:min(66%,330px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) translateZ(-22px);background:radial-gradient(circle at 31% 25%,#f2f4d7 0,#b7c78f 8%,#778466 22%,#3a4533 43%,#1e271b 62%,#10140f 70%);box-shadow:inset -28px -20px 45px #050705, inset 8px 8px 24px #eff6d640,0 0 70px #d7f58212}
.perspective-art:after{content:"";position:absolute;z-index:-1;left:50%;top:49%;width:min(92%,470px);height:32%;border:1px solid #d7f58271;border-radius:50%;transform:translate(-50%,-50%) translateZ(22px) rotate(-27deg);box-shadow:0 0 25px #d7f58212}
.perspective-top{position:absolute;inset:0 0 auto;z-index:2;color:#8f9884;font-size:9px}
.motion-toggle{border-color:#4d5b3d;color:#c5d0b7;backdrop-filter:blur(8px)}
.perspective-nodes{position:absolute;inset:0;margin:0;display:block;transform-style:preserve-3d}
.perspective-nodes:before{display:none}
.perspective-node{position:absolute;width:clamp(118px,15vw,170px);min-height:96px;justify-content:center;gap:5px;padding:15px 12px;border:1px solid #d7f58235;border-radius:50%;background:linear-gradient(145deg,#20281beF,#10140fdd);box-shadow:0 16px 45px #0008, inset 0 1px #ffffff12;backdrop-filter:blur(9px);animation:float-orbit 7s ease-in-out infinite;transform:translate3d(-50%,-50%,var(--depth,0px))}
.perspective-node:focus-visible{outline-offset:7px}
.perspective-node svg{width:25px;height:25px;padding:0;border-radius:0;background:none;box-shadow:none;animation:none;stroke:#d7f582}
.perspective-node strong{font-size:14px;letter-spacing:.02em}
.perspective-node span{font-size:10px;color:#a6af9c}
.node-0{left:22%;top:37%;--depth:28px;animation-delay:-1.5s}
.node-1{left:79%;top:41%;--depth:66px;animation-delay:-4s}
.node-2{left:50%;top:76%;--depth:42px;animation-delay:-2.5s}
.perspective-statement{position:absolute;left:0;right:0;bottom:4px;z-index:1;border-top:0;padding:0;margin:0;text-align:center;font-size:12px;color:#9da692}
.perspective-foot{display:none}
.hero-identity{gap:12px;margin-top:24px}.hero-portrait{width:54px;height:54px;border-radius:50%;object-position:center 24%}.hero-identity .small{font-size:9px}
.hero-bottom{margin-top:26px}
@keyframes float-orbit{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media(max-width:1000px){.hero{grid-template-columns:1fr;gap:10px}.hero-art.perspective-art{max-width:760px;width:100%;min-height:420px;margin:0 auto}.hero h1{font-size:clamp(58px,9vw,100px)}.hero .desc{max-width:600px}}
@media(max-width:700px){.hero{padding-top:128px}.hero-art.perspective-art{order:0;min-height:330px;margin:10px auto 0;padding:20px 10px}.perspective-art:before{width:min(62%,240px)}.perspective-art:after{width:90%;height:28%}.perspective-top{font-size:8px}.perspective-node{width:114px;min-height:84px;padding:10px;border-radius:46%;gap:4px}.perspective-node strong{font-size:13px}.perspective-node span{font-size:10px}.perspective-node svg{width:21px;height:21px}.node-0{left:20%;top:38%}.node-1{left:80%;top:40%}.node-2{left:50%;top:74%}.perspective-statement{font-size:11px;bottom:0}.hero-identity{margin-top:22px}.hero-portrait{width:46px;height:46px}}
@media(max-width:390px){.hero-art.perspective-art{min-height:300px}.perspective-node{width:100px;min-height:78px}.node-0{left:18%}.node-1{left:82%}}
@media(prefers-reduced-motion:reduce){.hero-art.perspective-art{transition:none;transform:none!important}.perspective-node{animation:none!important}}
.publisher-heading{display:flex;align-items:center;gap:16px;margin:42px 0 18px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.publisher-heading img{display:block;width:auto;height:30px;max-width:160px;object-fit:contain}
.publisher-heading .miilk-logo{height:32px}
.publisher-heading .brunch-logo{height:25px;filter:brightness(0) invert(1)}
.publisher-heading span{font:10px ui-monospace,monospace;letter-spacing:1.2px;color:#929b86}
.series-heading{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.series-heading .publisher-heading{margin:0;padding:0;border:0}
.series-heading h3{flex-basis:100%}
.contact-action{display:flex;align-items:center;gap:20px}
.contact-mark{width:34px;height:34px;display:grid;place-items:center;flex:none;color:var(--lime);border:1px solid #46523a;border-radius:50%;transition:background .2s,transform .2s}
.contact-mark svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.contact-mark .icon-dot{fill:currentColor;stroke:none}
.contact-mark-linkedin svg path{fill:currentColor;stroke:none}
.contact-info{flex:1;display:flex;flex-direction:column;gap:7px}
.contact-info small{font:9px ui-monospace,monospace;letter-spacing:1.2px;color:#909887}
.contact-arrow{flex:none}
.contact-action:hover .contact-mark{background:#d7f58212;transform:translateY(-2px)}
@media(max-width:700px){.publisher-heading{margin:30px 0 12px}.publisher-heading span{font-size:9px}.publisher-heading img{height:27px}.publisher-heading .miilk-logo{height:29px}.publisher-heading .brunch-logo{height:23px}}
