@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700&display=swap');
:root{--ink:#505054;--muted:#949499;--line:#f0f0f3;--blue:#2862e8;--pink:#fa0064;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#fff;color:var(--ink);font-family:Geist,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #777;outline-offset:5px}button{text-align:left}.page{max-width:1176px;padding:0 30px;margin:auto}.topbar{height:104px;display:flex;align-items:center;justify-content:space-between;position:relative}.monogram{font-size:27px;letter-spacing:-3px;font-weight:650;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;padding:0;line-height:1;color:#85858a;transition:color .3s,transform .4s}.monogram>span{display:block;transform:translate(-1px,-2px)}.monogram:hover{color:var(--ink);transform:rotate(-8deg)}.location{font-size:12px;color:var(--muted)}.work-menu{position:absolute;left:50%;transform:translateX(-50%);z-index:10}.work-menu summary{list-style:none;cursor:pointer;border:1px solid var(--line);border-radius:30px;padding:10px 17px;color:#85858b;font-size:14px;display:flex;align-items:center;gap:9px;background:#fff}.work-menu summary::-webkit-details-marker{display:none}.menu-mark{font-size:20px;color:#b1b1b5;line-height:1}.chevron{margin-left:4px}.work-menu nav{position:absolute;top:49px;left:0;right:0;background:#fff;border:1px solid var(--line);padding:7px;border-radius:17px;box-shadow:0 12px 30px #0000000a}.work-menu nav a{display:flex;justify-content:space-between;padding:12px 10px;border-radius:10px;font-size:14px}.work-menu nav a:hover{background:#f7f7f9}.work-menu nav span{font-size:12px;color:#aaa}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:245px 245px 285px;gap:22px}.tile{position:relative;border:1px solid var(--line);border-radius:26px;background:#fff;overflow:hidden;min-width:0;isolation:isolate}.intro{grid-column:1/3;grid-row:1/3;padding:28px 28px 20px;display:flex;flex-direction:column}.intro h1{font-size:23px;font-weight:400;line-height:1.34;letter-spacing:-.6px;margin:0 0 22px}.intro h1 strong{font-weight:550;color:#4b4b50}.intro h1>span{color:#a0a0a5}.intro p{font-size:16px;line-height:1.55;letter-spacing:-.2px;margin:0 0 19px;max-width:460px}.blue-link{color:var(--blue)}.pink-link{color:var(--pink)}.intro p a:hover{text-decoration:underline;text-underline-offset:4px}.intro-bottom{margin-top:auto;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:15px}.handwritten{font-size:14px;color:#929297}.asterisk{font-size:38px;color:#d7ba52;display:inline-block;transition:transform 1s var(--ease)}.intro:hover .asterisk{transform:rotate(100deg)}.tile-eyebrow{position:absolute;left:24px;top:23px;z-index:3;font-size:10px;font-weight:500;letter-spacing:1.1px;color:#a1a1a7;pointer-events:none}.phone-tile{grid-column:3;grid-row:1/3;padding:0;transition:background .65s var(--ease),border-color .65s;z-index:2}.phone-stage{position:absolute;inset:0;perspective:1100px}.phone{position:absolute;top:88px;left:72px;width:226px;height:489px;display:block;border:4px solid #282727;border-radius:35px;background:#f7edef;box-shadow:2px 3px 0 #72706e,5px 12px 17px #00000013;overflow:hidden;transform:rotateY(-17deg) rotateZ(-3deg);transform-origin:center;transition:transform .8s var(--ease),left .8s var(--ease),top .8s var(--ease),box-shadow .8s var(--ease)}.phone-screen{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:0;transition:opacity .45s ease}.phone-screen.is-visible{opacity:1}.recording-glow{position:absolute;top:43%;left:20%;width:60%;height:27%;border-radius:50%;background:radial-gradient(ellipse,#ff277a22,transparent 70%);opacity:0;mix-blend-mode:multiply;pointer-events:none}.phone-caption{position:absolute;left:22px;right:22px;bottom:65px;display:flex;flex-direction:column;align-items:center;gap:13px;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s var(--ease);font-size:12px}.screen-progress{display:flex;gap:5px}.screen-progress i{width:4px;height:4px;border-radius:50%;background:#d9bcc6;transition:width .3s,background .3s}.screen-progress i.current{width:15px;border-radius:5px;background:var(--pink)}.tile-action{position:absolute;left:15px;bottom:15px;display:flex;align-items:center;gap:9px;z-index:4;opacity:0;transform:translateY(7px);transition:opacity .3s,transform .5s var(--ease)}.circle-arrow{width:31px;height:31px;border:1px solid #00000012;background:#ffffffce;border-radius:50%;display:grid;place-items:center;font-family:Arial,sans-serif;font-size:21px;color:#62626b}.action-text{font-size:12px;color:#71717b}.phone-tile:is(:hover,:focus-visible,.active){background:#fff5f8;border-color:#eed6df}.phone-tile:is(:hover,:focus-visible,.active) .phone{left:calc(50% - 99px);top:57px;transform:rotateY(0) rotateZ(0) scale(.83);transform-origin:top left;box-shadow:2px 3px 0 #72706e,4px 12px 22px #63283c20}.phone-tile:is(:hover,:focus-visible,.active) .phone-caption{opacity:1;transform:translateY(0)}.phone-tile:is(:hover,:focus-visible,.active) .recording-glow{opacity:1;animation:breathe 1.7s ease-in-out infinite}.tile:is(:hover,:focus-visible,.active) .tile-action{opacity:1;transform:translateY(0)}.next-logo{grid-column:4;grid-row:1;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:background .5s,border-color .5s}.next-symbol{font-size:72px;font-weight:750;font-style:italic;letter-spacing:-8px;padding-right:8px;color:#d0d0d4;transition:color .5s,transform .65s var(--ease)}.brand-name{font-size:22px;font-weight:650;letter-spacing:-.9px;opacity:0;max-height:0;transform:translateY(10px);transition:all .55s var(--ease)}.brand-caption{font-size:12px;line-height:1.5;text-align:center;color:#929297;opacity:0;transform:translateY(12px);max-height:0;transition:all .55s var(--ease)}.next-logo:is(:hover,:focus-visible){background:#f4f7ff;border-color:#e0e8fd}.next-logo:is(:hover,:focus-visible) .next-symbol{color:var(--blue);transform:translateY(-8px) scale(.83)}.next-logo:is(:hover,:focus-visible) .brand-name{opacity:1;max-height:40px;transform:translateY(-7px)}.next-logo:is(:hover,:focus-visible) .brand-caption{opacity:1;max-height:50px;transform:translateY(0)}.hum-logo{grid-column:4;grid-row:2;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;transition:background .5s,border-color .5s}.hum-lockup{display:flex;align-items:center;gap:12px;transform:translateY(4px);transition:transform .6s var(--ease);color:#ceced2}.wave{height:52px;display:flex;align-items:center;gap:5px}.wave i{width:5px;border-radius:10px;background:currentColor;height:24px;transition:height .5s var(--ease)}.wave i:nth-child(1){height:42px}.wave i:nth-child(2){height:22px}.wave i:nth-child(3){height:49px}.wave i:nth-child(4){height:30px}.wave i:nth-child(5){height:43px}.hum-word{font-size:40px;letter-spacing:-2px;font-weight:650;max-width:0;opacity:0;overflow:hidden;transition:all .65s var(--ease)}.hum-logo:is(:hover,:focus-visible){background:#ffedf3;border-color:#f5d5e1}.hum-logo:is(:hover,:focus-visible) .hum-lockup{color:#251e21;transform:translateY(-12px)}.hum-logo:is(:hover,:focus-visible) .hum-word{max-width:110px;opacity:1}.hum-logo:is(:hover,:focus-visible) .brand-caption{opacity:1;max-height:50px;transform:translateY(0)}.hum-logo:is(:hover,:focus-visible) .wave i{animation:wave 1s ease-in-out infinite alternate}.hum-logo .wave i:nth-child(2){animation-delay:-.3s}.hum-logo .wave i:nth-child(3){animation-delay:-.6s}.hum-logo .wave i:nth-child(4){animation-delay:-.2s}.hum-logo .wave i:nth-child(5){animation-delay:-.7s}.next-preview{grid-column:1/3;grid-row:3;padding:0;background:#fafbfe;transition:background .6s,border-color .6s}.dashboard-frame{position:absolute;top:68px;left:55px;width:calc(100% - 45px);border:3px solid #e0e5ee;border-radius:12px;overflow:hidden;box-shadow:0 8px 25px #15213c10;transform:rotate(-4deg);transform-origin:50% 50%;transition:transform .75s var(--ease),left .75s var(--ease),top .75s var(--ease),width .75s var(--ease)}.dashboard-frame img{display:block;width:100%;height:auto;filter:saturate(.12);opacity:.76;transition:filter .6s,opacity .6s}.next-preview:is(:hover,:focus-visible,.active){background:#edf3ff;border-color:#d4dff8}.next-preview:is(:hover,:focus-visible,.active) .dashboard-frame{transform:rotate(0);left:35px;top:49px;width:calc(100% - 70px)}.next-preview:is(:hover,:focus-visible,.active) img{filter:saturate(1);opacity:1}.note{grid-column:3/5;grid-row:3;padding:55px 30px 24px;display:flex;flex-direction:column}.note p{font-size:38px;letter-spacing:-1.8px;line-height:1.16;font-weight:450;margin:0;color:#c0c0c5}.changing-word{color:#727278;transition:color .4s}.note:hover .changing-word{color:var(--pink)}.note-bottom{font-size:12px;line-height:1.6;margin-top:auto;color:#99999e}footer{display:flex;justify-content:space-between;gap:20px;color:#a3a3a8;font-size:12px;padding:30px 5px 35px}@keyframes breathe{0%,100%{transform:scale(.85);opacity:.3}50%{transform:scale(1.15);opacity:1}}@keyframes wave{to{transform:scaleY(.55)}}
@media(min-width:1250px){.page{padding-top:12px}}
@media(max-width:1000px) and (min-width:701px){.page{padding:0 22px}.grid{gap:16px;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:250px 250px 260px}.intro{padding:24px}.intro h1{font-size:21px}.intro p{font-size:15px}.phone{left:35px;width:210px;height:455px}.phone-tile:is(:hover,:focus-visible,.active) .phone{left:calc(50% - 89px);transform:scale(.85);top:66px}.tile-eyebrow{font-size:9px;left:17px}.note p{font-size:32px}.hum-lockup{gap:7px}.hum-word{font-size:30px}.wave{gap:4px}.wave i{width:4px}}
@media(max-width:700px){.page{padding:0 18px}.topbar{height:86px}.location{display:none}.work-menu{left:auto;right:0;transform:none}.grid{grid-template-columns:1fr 1fr;grid-template-rows:auto 440px 200px 260px auto;gap:15px}.tile{border-radius:23px}.intro{grid-column:1/3;grid-row:1;padding:25px}.intro h1{font-size:23px;margin-bottom:22px}.intro p{font-size:16px}.intro-bottom{padding-top:15px}.phone-tile{grid-column:1/3;grid-row:2;background:#fff5f8}.phone{width:184px;height:398px;left:calc(50% - 92px);top:51px;transform:rotate(-5deg)}.phone-tile:is(:hover,:focus-visible,.active) .phone{left:calc(50% - 80px);top:49px;transform:scale(.86)}.phone-caption{bottom:45px}.phone-tile .tile-action{opacity:1;transform:none}.phone-tile .action-text{display:none}.next-logo{grid-column:1;grid-row:3;background:#f7f9fe}.hum-logo{grid-column:2;grid-row:3;background:#fff6f9}.next-symbol{color:var(--blue);font-size:57px}.next-logo .brand-name{opacity:1;max-height:40px;transform:none;font-size:19px}.hum-word{opacity:1;max-width:90px;font-size:31px}.hum-lockup{color:#292528;gap:8px}.wave{transform:scale(.8)}.next-preview{grid-column:1/3;grid-row:4}.next-preview .tile-action{opacity:1;transform:none}.dashboard-frame{left:25px;width:calc(100% - 30px);top:61px}.dashboard-frame img{filter:none;opacity:1}.note{grid-column:1/3;grid-row:5;min-height:250px;padding:58px 25px 23px}.note p{font-size:37px}.note-bottom{padding-top:20px}footer{font-size:11px;line-height:1.5}footer span:last-child{max-width:150px;text-align:right}.tile-eyebrow{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.phone{transform:none}.dashboard-frame{transform:none}}

/* Reference-measured layout and interactions */
:root{--ink:rgba(37,36,41,.8);--muted:rgba(37,36,41,.4);--line:#f7f7f9;--reveal:cubic-bezier(.22,.8,.25,1)}
.page{max-width:1152px;padding:0 24px}.topbar{height:88px}.grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,258px);gap:24px}.tile{border:2px solid var(--line);border-radius:24px}.intro{padding:24px;gap:24px}.intro h1{font-size:24px;line-height:1.3;letter-spacing:normal;margin:0;font-weight:500}.intro h1 strong{font-weight:600;color:#515054}.intro h1>span{color:var(--muted)}.intro p{font-size:18px;line-height:1.3;letter-spacing:normal;margin:0;max-width:none}.intro-bottom{display:block;margin-top:auto;padding:0}.handwritten{font:inherit;font-size:18px;line-height:1.3;color:var(--ink)}.asterisk{display:block;margin-top:8px;font-size:30px;width:32px}.phone-tile{grid-column:3;grid-row:2/4}.next-logo{grid-column:3;grid-row:1}.hum-logo{grid-column:4;grid-row:1}.next-preview{grid-column:1/3;grid-row:3/5}.note{grid-column:3/5;grid-row:4}.dashboard-frame{top:90px;width:calc(100% - 50px)}.cv-tile{grid-column:4;grid-row:2}.monogram{border-width:2px;width:44px;height:44px}

.work-menu{top:22px;perspective:900px}.work-toggle{display:flex;align-items:center;gap:8px;white-space:nowrap;background:#fff;border:2px solid #f7f7f9;border-radius:999px;height:46px;padding:0 20px 0 16px;font-size:14px;line-height:1;font-weight:600;color:rgba(37,36,41,.4);transition:color .22s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}.work-menu.is-open .work-toggle,.work-toggle:focus-visible{color:#45434b;background:#f5f5f6;border-color:#d9d9e3;box-shadow:0 1px 2px #25242905}.menu-mark{position:relative;display:block;width:24px;height:24px;flex:none;color:#afafb4;transition:transform .5s cubic-bezier(.16,1,.3,1)}.menu-mark svg{position:absolute;inset:0;width:24px;height:24px;transition:opacity .25s ease,transform .48s cubic-bezier(.16,1,.3,1)}.menu-mark .mark-color{opacity:0;transform:rotate(-55deg) scale(.7)}.work-menu.is-open .menu-mark{transform:none;color:inherit}.work-menu.is-open .menu-mark svg:first-child{opacity:0;transform:rotate(45deg) scale(.8)}.work-menu.is-open .menu-mark .mark-color{opacity:1;transform:rotate(0) scale(1)}
.work-menu nav{display:flex;flex-direction:column;gap:4px;box-sizing:border-box;width:182px;left:50%;right:auto;top:52px;padding:10px 8px;border-radius:15px;border:1px solid #e2e2e7;background:#fffffff7;backdrop-filter:blur(16px);box-shadow:0 1px 2px #2524290a,0 5px 8px -5px #25242924,0 15px 24px -16px #2524292b;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,14px) scale(.96);filter:blur(5px);transform-origin:50% 0;transition:opacity .24s ease,transform .38s cubic-bezier(.22,1,.36,1),filter .24s ease,visibility 0s linear .38s;will-change:transform,opacity}.work-menu nav::before{content:"";position:absolute;left:0;right:0;height:10px;bottom:100%}.work-menu.is-open nav{visibility:visible;pointer-events:auto;opacity:1;filter:blur(0);transform:translate(-50%,0) scale(1);transition:opacity .24s ease,transform .46s cubic-bezier(.16,1,.3,1),filter .3s ease,visibility 0s}.work-menu nav a{position:relative;display:flex;justify-content:flex-start;align-items:center;gap:12px;min-height:52px;padding:8px;border-radius:9px;font-size:18px;font-weight:600;line-height:1.3;letter-spacing:0;color:#545258;opacity:1;transform:none;transition:background .22s ease,color .22s ease}.work-menu.is-open nav a,.work-menu.is-open nav a:nth-child(2){opacity:1;transform:none;transition-delay:0s}.work-menu nav a:first-child:is(:hover,:focus-visible){background:#eff4ff;color:#2862e8}.work-menu nav a:last-child:is(:hover,:focus-visible){background:#fff0f6;color:#ed1766}.work-menu nav .project-icon{font-size:23px;font-weight:700;display:grid;place-items:center;width:36px;height:36px;flex:none;border-radius:9px;background:linear-gradient(#fff,#fafbfc);border:1px solid #e7e8eb;box-shadow:0 1px 2px #2524290a,0 4px 6px -4px #25242930,inset 0 1px 1px white;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}/* Place the supplied 100px logo square inside the 36px icon slot;
   clip the blue source shadow; use the same neutral icon shadow as hum. */
.work-menu nav .project-icon.next-icon{position:relative;overflow:hidden;border:0;background:none;mix-blend-mode:multiply}
.next-icon img{position:absolute;display:block;width:48.6px;height:51.48px;max-width:none;left:-5.76px;top:-6.12px}
.hum-icon{color:#fa0064!important}.hum-icon svg{width:23px;height:23px}.work-menu nav a:is(:hover,:focus-visible) .project-icon{transform:translateY(-1px);box-shadow:0 2px 3px #2524290a,0 7px 10px -5px #25242930,inset 0 1px 1px white}
.contact-link{position:relative;width:46px;height:46px;display:flex;justify-content:center;align-items:center;gap:0;padding:0 9px;border:2px solid #f7f7f9;border-radius:999px;color:rgba(37,36,41,.4);transition:width .5s cubic-bezier(.4,0,.2,1),gap .5s cubic-bezier(.4,0,.2,1),background-color .4s ease,border-color .4s ease,color .4s ease,box-shadow .4s ease;z-index:11}.contact-link svg{display:block;width:24px;height:24px;flex:0 0 24px;margin:0;stroke:currentColor;stroke-width:2;transition:transform .5s cubic-bezier(.4,0,.2,1)}.contact-label{position:static;display:block;max-width:0;overflow:hidden;white-space:nowrap;font-size:15px;line-height:24px;font-weight:600;letter-spacing:0;opacity:0;filter:blur(2px);transform:none;transition:max-width .5s cubic-bezier(.4,0,.2,1),opacity .4s ease-in-out,filter .4s ease-in-out}.contact-link:is(:hover,:focus-visible){width:148px;gap:8px;background:#f5f5f6;border-color:#d9d9e3;color:#48464d;box-shadow:0 1px 2px #25242905}.contact-link:is(:hover,:focus-visible) .contact-label{max-width:96px;opacity:1;filter:blur(0);transform:none}.contact-link:is(:hover,:focus-visible) svg{transform:rotate(-6deg)}
/* The paper and its printed lines share one centered coordinate system. */
.cv-tile{--cv-ink:#65616c;--cv-border:#d7d2e7;cursor:default;transition:none}
/* Tile entry swaps the pose immediately; only control-hover zoom interpolates. */
.cv-art{position:absolute;left:50%;top:50%;width:258px;height:258px;margin:-129px 0 0 -129px;pointer-events:none;mix-blend-mode:multiply;translate:0 0;transform:scale(1);scale:1;transition:scale .55s var(--reveal)}
.cv-paper{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;clip-path:inset(9%)}
.cv-lines{position:absolute;left:94px;top:82px;width:84px;display:grid;gap:11px;transform:rotate(15deg);transform-origin:center;opacity:0;transition:none}
.cv-lines i{display:block;height:10px;background:#f3c8d1;border:1px solid #d9b6c0;border-radius:999px}
.cv-lines i:last-child{width:56px}
.cv-actions{position:absolute;left:24px;right:24px;bottom:22px;height:40px;display:flex;align-items:center;justify-content:space-between;gap:16px;opacity:0;visibility:hidden;transition:none}
.cv-actions :is(a,button){text-decoration:none;display:inline-flex;align-items:center;justify-content:center;flex:none;box-sizing:border-box;height:40px;margin:0;padding:0;background:transparent;border:2px solid var(--cv-border);color:var(--cv-ink);border-radius:999px;font-size:16px;line-height:1;font-weight:500;text-align:center;transition:background-color .3s ease-in-out,border-color .3s ease-in-out,color .3s ease-in-out,box-shadow .3s ease-in-out}
.cv-actions svg{display:block;width:24px;height:24px;flex:none}
.cv-actions .cv-download{width:36px;height:36px}
.cv-download:is(:hover,:focus-visible){background-color:#fffafa;border-color:#b9abad;color:#141314;box-shadow:0 2px 4px #3820302b}
.cv-actions .cv-open{position:relative;isolation:isolate;min-width:128px;padding:0 14px;gap:8px}
.cv-open::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,#ffffff24,transparent 85%);opacity:0;transition:opacity .3s ease-in-out}
.cv-open>*{position:relative;z-index:1}
.cv-open span{display:block;white-space:nowrap}
.cv-open:is(:hover,:focus-visible){color:#fff;background-color:#171719;border-color:#777174;box-shadow:inset 0 1px 1px #ffffff73,inset 0 -1px 1px #0009,0 3px 5px #281e2438}
.cv-open:is(:hover,:focus-visible)::before{opacity:1}
.cv-open:active{background-color:#0d0d0f;box-shadow:inset 0 2px 3px #0009,0 1px 2px #281e2426}
.cv-tile:is(:hover,:focus-within){background-color:#edeafd;border-color:var(--cv-border)}
.cv-tile:is(:hover,:focus-within) .cv-art{translate:0 -27px;transform:scale(.94)}
/* Enlarge the entire sheet from its center; keep both controls anchored. */
.cv-tile:has(.cv-actions :is(a,button):is(:hover,:focus-visible)) .cv-art{scale:calc(104 / 94)}
.cv-tile:not(:hover):not(:focus-within) .cv-art{transition:none!important}
.cv-tile:is(:hover,:focus-within) .cv-lines{opacity:1}
.cv-tile:is(:hover,:focus-within) .cv-actions{opacity:1;visibility:visible;transition:opacity .4s ease-in-out,visibility 0s}
@media(min-width:701px) and (max-width:1100px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto 258px 258px 258px auto;max-width:714px;margin:auto}.intro{grid-column:1/3;grid-row:1;min-height:540px}.phone-tile{grid-column:1;grid-row:2/4}.next-logo{grid-column:2;grid-row:2}.cv-tile{grid-column:2;grid-row:3}.hum-logo{grid-column:2;grid-row:4}.next-preview{grid-column:1;grid-row:4}.note{grid-column:1/3;grid-row:5;min-height:258px}.intro p{font-size:18px}.intro h1{font-size:24px}}
@media(max-width:700px){.page{padding:0 18px}.topbar{height:86px}.work-menu{left:50%;right:auto;transform:translateX(-50%);top:21px}.work-toggle{padding:0 12px;gap:7px}.contact-link:is(:hover,:focus-visible){width:44px}.contact-label{top:48px;right:0;background:#fff;border-radius:12px;padding:8px;box-shadow:0 5px 20px #0001}.grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto 440px 200px 240px 260px auto;gap:16px}.intro{grid-column:1/3;grid-row:1;padding:24px;gap:24px}.intro h1{font-size:24px}.intro p{font-size:18px}.phone-tile{grid-column:1/3;grid-row:2}.next-logo{grid-column:1;grid-row:3}.hum-logo{grid-column:2;grid-row:3}.cv-tile{grid-column:1/3;grid-row:4}.cv-art{translate:0 -27px;transform:scale(.94)}.cv-actions{left:calc(50% - 103px);right:calc(50% - 103px);opacity:1;visibility:visible;transform:none}.next-preview{grid-column:1/3;grid-row:5}.note{grid-column:1/3;grid-row:6}.intro-bottom{padding:0}.dashboard-frame{top:65px}footer{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

@media(min-width:1101px){.next-logo{grid-column:3/5;grid-row:1}.hum-logo{grid-column:4;grid-row:3}}

/* Coordinated dissolve: entry and exit share a continuous opacity transition. */
.work-menu nav{transform:translate(-50%,8px) scale(.985);filter:blur(2px);transition:opacity .38s ease-in-out,transform .48s cubic-bezier(.4,0,.2,1),filter .38s ease-in-out,visibility 0s linear .48s}
.work-menu.is-open nav{transform:translate(-50%,0) scale(1);transition:opacity .38s ease-in-out,transform .48s cubic-bezier(.4,0,.2,1),filter .38s ease-in-out,visibility 0s}
.work-toggle{transition:color .38s ease-in-out,background-color .38s ease-in-out,border-color .38s ease-in-out,box-shadow .38s ease-in-out}
.menu-mark svg{transition:opacity .4s ease-in-out,transform .5s cubic-bezier(.4,0,.2,1)}
.work-menu nav a{transition:background-color .34s ease-in-out,color .34s ease-in-out}

.tile-action,.phone-caption{transition:opacity .4s ease-in-out,transform .5s cubic-bezier(.4,0,.2,1)}
.phone-screen{transition:opacity .6s ease-in-out}
.hum-lockup{transition:color .4s ease-in-out,transform .6s var(--ease)}
@media(max-width:700px){.contact-link:is(:hover,:focus-visible){width:46px;gap:0}.contact-label{position:absolute;top:52px;right:0;max-width:none;overflow:visible;visibility:hidden;padding:8px 12px;border-radius:12px;background:#fff;line-height:24px;box-shadow:0 5px 20px #0001;transition:opacity .35s ease-in-out,filter .35s ease-in-out,visibility 0s linear .35s}.contact-link:is(:hover,:focus-visible) .contact-label{max-width:none;visibility:visible;transition:opacity .35s ease-in-out,filter .35s ease-in-out,visibility 0s}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:opacity .2s ease-in-out,color .2s ease-in-out,background-color .2s ease-in-out!important}}

/* Approved biography: retain the type scale and distribute the longer copy. */
.intro.intro-bio{gap:12px;justify-content:space-between;font-weight:300}
.intro-bio h1{font-weight:500}
.intro-bio h1 strong{font-weight:600}
.intro-bio p strong{font-weight:500}
.intro-bio .bio-equation{display:block;white-space:nowrap;font-weight:500;color:#252429;margin-bottom:12px;flex-shrink:0}
.intro-bio .bio-equation strong{font-weight:inherit;color:inherit}
.intro-bio .bio-rocket{display:inline-block;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:26px;line-height:1;vertical-align:-4px;margin-left:3px}
.intro-bio .asterisk{margin-top:0;line-height:1}
.bio-research{color:#8244ff}
.intro-bio .bio-ai-i{font-weight:600}
.bio-focus{color:#259cad}
.bio-ai{color:#ed7a19}

/* NextMove: a staged screen reveal and one stationary project-link control. */
.next-pair{--nm-motion:cubic-bezier(.22,.8,.25,1);--nm-tile-gap:24px;position:relative;grid-column:3/5;grid-row:1;min-width:0;isolation:isolate}
.next-pair .tile{position:absolute;top:0;bottom:0;width:calc((100% - 24px)/2);border-color:#f0f1f5}
.nm-brand{left:0;text-align:center;transition:background-color .5s ease,border-color .5s ease,opacity .4s ease;z-index:1}
.nm-logo-art{position:absolute;width:80px;height:80px;left:50%;margin-left:-40px;top:calc(50% - 40px);overflow:hidden;border-radius:18px;filter:grayscale(1);opacity:.55;transform:translateY(0) scale(1);transition:transform .65s var(--nm-motion),filter .55s ease,opacity .5s ease;mix-blend-mode:multiply}
.nm-logo-art img{position:absolute;display:block;width:108px;height:114.4px;left:-12.8px;top:-13.6px;max-width:none}
.nm-brand.is-engaged{background:#f5f8ff;border-color:#dce6fa}
.nm-brand.is-engaged .nm-logo-art{opacity:1;filter:grayscale(0);transform:translateY(-52px) scale(.85)}

/* 1. Show a held stack. 2. Fan into a row, one card at a time. 3. Add blue frames. */
.nm-filmstrip{position:absolute;left:16px;right:16px;bottom:60px;height:64px;pointer-events:none;opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .55s var(--nm-motion)}
.nm-filmstrip>span{--index:0;--stack-x:0px;--stack-y:0px;--stack-angle:-9deg;--row-shift:-150%;--row-gap:-10.5px;position:absolute;top:0;left:50%;display:block;width:52px;height:100%;overflow:hidden;border:1px solid #e6e8ed;border-radius:5px;background:#fff;box-shadow:0 2px 5px #273c6914;z-index:4;transform:translate(calc(-50% + var(--stack-x)),var(--stack-y)) rotate(var(--stack-angle));transition:transform .52s var(--nm-motion),width .52s var(--nm-motion)}
.nm-filmstrip>span:nth-child(2){--index:1;--stack-x:-7px;--stack-y:-4px;--stack-angle:-17deg;--row-shift:-50%;--row-gap:-3.5px;z-index:3}
.nm-filmstrip>span:nth-child(3){--index:2;--stack-x:7px;--stack-y:-7px;--stack-angle:6deg;--row-shift:50%;--row-gap:3.5px;z-index:2}
.nm-filmstrip>span:nth-child(4){--index:3;--stack-x:13px;--stack-y:-10px;--stack-angle:13deg;--row-shift:150%;--row-gap:10.5px;z-index:1}
.nm-filmstrip img{display:block;width:180px;height:115px;max-width:none;object-fit:cover;transform:translate(-6px,-16px);filter:saturate(.2);transition:filter .35s ease}
.nm-filmstrip>span:nth-child(2) img{transform:translate(-46px,-16px)}
.nm-filmstrip>span:nth-child(3) img{transform:translate(-86px,-16px)}
.nm-filmstrip>span:nth-child(4) img{transform:translate(-121px,-16px)}
.nm-filmstrip>span::after{content:"";position:absolute;inset:0;border:1px solid #9ebfe8;border-radius:4px;opacity:0;pointer-events:none;transition:opacity .35s ease}
.nm-brand.is-engaged .nm-filmstrip{opacity:1;transform:translateY(0);transition-delay:.1s}
.nm-brand.is-spread .nm-filmstrip>span{width:calc((100% - 21px)/4);max-width:60px;transform:translate(calc(-50% + var(--row-shift) + var(--row-gap)),0) rotate(0);transition-delay:calc(var(--index)*.14s)!important}
.nm-brand.is-framed .nm-filmstrip>span::after{opacity:.45;transition-delay:calc(var(--index)*.1s)!important}
.nm-brand.is-framed .nm-filmstrip img{filter:saturate(1);transition-delay:calc(var(--index)*.1s)}

/* This sits above both tiles so the pill can cross the seam without clipping. */
.nm-project-link{position:absolute;left:12px;bottom:12px;z-index:5;display:flex;align-items:center;gap:0;height:36px;max-width:calc(100% - 24px);border-radius:999px;opacity:0;visibility:hidden;pointer-events:none;transition:gap .4s var(--nm-motion),opacity .3s ease,visibility 0s linear .3s}
.next-pair:has(.nm-brand.is-engaged) .nm-project-link,.next-pair.is-expanded .nm-project-link,.nm-project-link:focus-visible{opacity:1;visibility:visible;pointer-events:auto;transition:gap .4s var(--nm-motion),opacity .3s ease,visibility 0s}
.nm-link-icon{width:36px;height:36px;display:grid;place-items:center;flex:none;border:1.5px solid #d8dbe1;border-radius:50%;background:#fffffff2;color:#6a707a;box-shadow:0 1px 2px #2524290d;transition:background .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}
.nm-link-icon svg{display:block;width:22px;height:22px}
.nm-one-liner{display:block;min-width:0;max-width:0;overflow:hidden;padding:6px 0;background:#ffffffed;border:1px solid transparent;border-radius:999px;box-shadow:0 2px 4px #25242900;color:#7d818b;font-size:13px;line-height:18px;white-space:nowrap;opacity:0;transform:translateX(-6px);filter:blur(2px);transition:max-width .5s var(--nm-motion),padding .5s var(--nm-motion),opacity .35s ease,transform .45s var(--nm-motion),filter .35s ease,border-color .35s ease,box-shadow .35s ease}
.nm-one-liner>span{display:block}
.nm-one-liner strong{color:#4c535e;font-weight:600}
.nm-football{display:inline-block;font-size:13px;vertical-align:baseline;margin-right:2px}
.nm-link-dash{color:#a5a8af}
.nm-project-link:is(:hover,:focus-visible,.is-open){gap:6px}
.nm-project-link:is(:hover,:focus-visible,.is-open) .nm-link-icon{color:#171b22;background:#fff;border-color:#bdc3cd;box-shadow:0 2px 4px #25242926}
.nm-project-link:is(:hover,:focus-visible,.is-open) .nm-one-liner{max-width:480px;padding:6px 12px;opacity:1;transform:translateX(0);filter:blur(0);border-color:#e1e3e8;box-shadow:0 2px 4px #25242912}

.nm-play-rest{left:calc((100% + var(--nm-tile-gap))/2);z-index:2;pointer-events:none;transition:opacity .24s linear!important}
/* Keep both frames at their final proportions and dissolve between them.
   Only the right half receives pointer events until the wide view is open. */
.next-pair .tile.nm-play{left:0;width:100%;z-index:3;background:#f6f8fa;border-color:#e0e5ea;opacity:0;pointer-events:none;container-type:inline-size}
.nm-play::after{content:"";position:absolute;inset:0 0 0 calc((100% + var(--nm-tile-gap))/2);pointer-events:auto}
.next-pair.is-expanded .nm-play{opacity:1;pointer-events:auto}
.next-pair.is-expanded .nm-play-rest{opacity:0}
.next-pair.is-expanded .nm-brand{opacity:0;pointer-events:none}
/* Pale machined frame, recessed field and fine bevelled marks around its rim. */
.nm-pitch-window{position:absolute;left:50%;top:50%;width:88%;max-width:360px;max-height:calc(100% - 32px);aspect-ratio:1.12;transform:translate(-50%,-50%);padding:18px 10px;background:linear-gradient(140deg,#f3f4f4 0%,#e5e7e7 48%,#f0f1f1 100%);border:1px solid #c9cdce;border-radius:6px;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #aeb4b43d,0 2px 3px #343b4012,0 5px 10px #343b400b;transition:transform .24s var(--nm-motion),box-shadow .24s ease,border-color .24s ease!important;isolation:isolate;pointer-events:none}
.nm-play .nm-pitch-window{aspect-ratio:1.9}
.nm-pitch-window::before{content:"";position:absolute;inset:5px;pointer-events:none;z-index:2;background:repeating-linear-gradient(90deg,#bac0c266 0 1px,#fff9 1px 2px,#c9cdce66 2px 3px,transparent 3px 7px) center top/calc(100% - 12px) 4px no-repeat,repeating-linear-gradient(90deg,#bac0c266 0 1px,#fff9 1px 2px,#c9cdce66 2px 3px,transparent 3px 7px) center bottom/calc(100% - 12px) 4px no-repeat,repeating-linear-gradient(0deg,#bac0c266 0 1px,#fff9 1px 2px,#c9cdce66 2px 3px,transparent 3px 7px) left center/4px calc(100% - 12px) no-repeat,repeating-linear-gradient(0deg,#bac0c266 0 1px,#fff9 1px 2px,#c9cdce66 2px 3px,transparent 3px 7px) right center/4px calc(100% - 12px) no-repeat}
.nm-pitch-window::after{content:"";position:absolute;inset:12px;pointer-events:none;z-index:0;border:1px solid #c8cccd;border-radius:12px;background:linear-gradient(135deg,#e4e7e7,#eceeee 55%,#e4e7e7);box-shadow:0 1px 0 #fff,0 0 0 3px #f3f4f499,inset 0 1px 3px #66717725,inset 0 -1px 0 #ffffffb3}
.nm-pitch{position:relative;z-index:1;width:100%;height:100%;display:block;overflow:visible}
.nm-field-lines{color:#b8bec1;filter:drop-shadow(0 .7px 0 #ffffffb3);transition:color .5s ease}
.nm-team{fill:#acb3b7;stroke:#f2f4f4;transition:fill .38s ease,stroke .38s ease}
.nm-opponents{fill:#c7ccce;stroke:#f2f4f4;transition:fill .38s ease,stroke .38s ease}
.nm-pass-path{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.nm-shot-path{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.nm-run-path,.nm-target{opacity:0}
.nm-ball{opacity:0}
.nm-corner{position:absolute;z-index:3;width:4px;height:4px;background:#367afd;border-radius:50%;box-shadow:0 0 7px #367afd70;opacity:0}
.nm-corner:nth-of-type(1){top:5px;left:5px}
.nm-corner:nth-of-type(2){top:5px;right:5px}
.nm-corner:nth-of-type(3){bottom:5px;right:5px}
.nm-corner:nth-of-type(4){bottom:5px;left:5px}
.next-pair.is-expanded .nm-play .nm-pitch-window{border-color:#c3cbd1;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #aeb4b43d,0 3px 5px #343b4010,0 7px 16px #3d536013}
.next-pair.is-expanded .nm-play .nm-field-lines{color:#b4c2cf}
.next-pair.is-expanded .nm-play .nm-team{fill:#2563eb;stroke:#fff}
.next-pair.is-expanded .nm-play .nm-opponents{fill:#cbd3dc;stroke:#fff}
.next-pair.is-expanded .nm-play .nm-pass-path{opacity:.65;animation:nm-pass 1.5s .75s ease-in-out both!important}
/* The approved receiving position holds briefly, then the ball is shot into goal. */
.next-pair.is-expanded .nm-play .nm-run-path{opacity:.65;animation:nm-dashes 4.4s .75s linear both!important}
.next-pair.is-expanded .nm-play .nm-runner{animation:nm-run-cycle 8.8s .75s ease-in-out .5 both!important}
.next-pair.is-expanded .nm-play .nm-ball{opacity:1;animation:nm-ball-cycle 8.8s .75s ease-in-out .5 both,nm-shot .68s 5.55s cubic-bezier(.15,.65,.35,1) forwards!important}
.next-pair.is-expanded .nm-play .nm-target{animation:nm-possession 8.8s .75s ease-in-out .5 both,nm-shot-possession .22s 5.55s ease-out forwards!important}
.next-pair.is-expanded .nm-play .nm-shot-path{animation:nm-shot-trail 1s 5.55s ease-out forwards!important}
.next-pair.is-expanded .nm-play .nm-opponents circle{animation:nm-defend 8.8s .75s ease-in-out .5 both!important}
.next-pair.is-expanded .nm-play .nm-opponents circle:nth-child(even){animation-direction:reverse!important}
.next-pair.is-expanded .nm-play .nm-corner{animation:nm-corner-glow 2.2s .7s ease-in-out infinite!important}
.next-pair.is-expanded .nm-play .nm-corner:nth-of-type(2),.next-pair.is-expanded .nm-play .nm-corner:nth-of-type(4){animation-delay:1.1s}
@keyframes nm-pass{to{stroke-dashoffset:0}}
@keyframes nm-dashes{to{stroke-dashoffset:-54}}
@keyframes nm-run-cycle{0%,15%,85%,100%{transform:translate(0,0)}40%,62%{transform:translate(44px,-37px)}}
@keyframes nm-ball-cycle{0%,8%,100%{transform:translate(0,0)}24%,34%{transform:translate(85px,-57px)}50%,62%{transform:translate(179px,-21px)}78%,86%{transform:translate(-28px,-49px)}}
@keyframes nm-shot{from{transform:translate(179px,-21px)}to{transform:translate(259.5px,-38px)}}
@keyframes nm-shot-possession{from{opacity:.65}to{opacity:0}}
@keyframes nm-shot-trail{0%{stroke-dashoffset:1;opacity:.28}68%{stroke-dashoffset:0;opacity:.28}100%{stroke-dashoffset:0;opacity:0}}
@keyframes nm-possession{
  0%,8%,100%{transform:translate(0,0);opacity:.65}
  12%{transform:translate(0,0);opacity:0}
  24%,34%{transform:translate(85px,-57px);opacity:.65}
  38%{transform:translate(85px,-57px);opacity:0}
  50%,62%{transform:translate(179px,-21px);opacity:.65}
  66%{transform:translate(179px,-21px);opacity:0}
  78%,86%{transform:translate(-28px,-49px);opacity:.65}
  90%{transform:translate(-28px,-49px);opacity:0}
}
@keyframes nm-defend{0%,100%{transform:translate(0,0)}30%{transform:translate(-6px,5px)}65%{transform:translate(5px,-4px)}}
@keyframes nm-corner-glow{0%,100%{opacity:.3;box-shadow:0 0 3px #367afd30}50%{opacity:1;box-shadow:0 0 10px #367afd90}}
@media(min-width:701px) and (max-width:1100px){
  .grid{grid-template-rows:auto 258px 258px 258px 300px auto}
  .next-pair{grid-column:1/3;grid-row:2}
  .phone-tile{grid-column:1;grid-row:3/5}
  .cv-tile{grid-column:2;grid-row:3}
  .hum-logo{grid-column:2;grid-row:4}
  .next-preview{grid-column:1/3;grid-row:5}
  .note{grid-row:6}
}
@media(max-width:700px){
  .grid{grid-template-rows:auto 216px 440px 180px 240px 260px auto}
  .next-pair{grid-column:1/3;grid-row:2}
  .next-pair{--nm-tile-gap:16px}
  .next-pair .tile{width:calc((100% - 16px)/2)}
  .nm-logo-art{transform:scale(.8)}
  .nm-brand.is-engaged .nm-logo-art{transform:translateY(-40px) scale(.66)}
  .nm-filmstrip{left:8px;right:8px;height:48px;bottom:56px}
  .nm-filmstrip>span{width:44px}
  .nm-project-link{left:10px;bottom:10px;max-width:calc(100% - 20px);align-items:flex-end}
  .nm-one-liner{white-space:normal;line-height:16px}
  .nm-one-liner>span{width:max-content;max-width:calc(100vw - 132px)}
  .phone-tile{grid-row:3}
  .hum-logo{grid-column:1/3;grid-row:4}
  .cv-tile{grid-row:5}
  .next-preview{grid-row:6}
  .note{grid-row:7}
}
/* The requested hover demo keeps its staged motion; page-wide preferences
   still govern the rest of the portfolio. These declarations also prevent
   broad transition shorthands from collapsing the stack straight to a row. */
.nm-brand .nm-logo-art{transition:transform .65s var(--nm-motion),filter .55s ease,opacity .5s ease!important}
.nm-brand .nm-filmstrip{transition:opacity .35s ease,transform .55s var(--nm-motion)!important}
.nm-brand .nm-filmstrip>span{transition:transform .6s var(--nm-motion),width .6s var(--nm-motion)!important}
.nm-brand .nm-filmstrip>span::after{transition:opacity .35s ease!important}
.next-pair .nm-play{transition:opacity .24s linear,background-color .24s ease,border-color .24s ease!important}

/* HUM: the supplied home, details sheet and publication confirmation.
   The surface clips the phone; its sibling arrow can reveal a pill across tiles. */
.phone-tile.hum-showcase{overflow:visible;background:#fff;border-color:#f0f1f5;transition:background-color .55s ease,border-color .55s ease!important}
.phone-tile.hum-showcase.is-engaged{background:#fff7fa;border-color:#f2dce5;z-index:6}
.hum-preview{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:transparent;overflow:hidden;text-align:initial;cursor:pointer}
.hum-stage{position:absolute;inset:0;display:block;pointer-events:none}
/* Reference pose: upright left edge, right edge receding into the tile crop.
   Local perspective makes the upper/lower edges fan out without a Z rotation. */
.hum-device{position:absolute;top:56px;left:calc(100% - 74px);display:block;width:206px;padding:4px;border:2px solid #17181a;border-radius:33px;background:linear-gradient(110deg,#b0b1b2 0%,#65676b 1.2%,#18191b 2.5%,#08090a 6%,#1e2023 94%,#939597 98%,#292b2e 100%);transform:translateX(-50%) perspective(1800px) rotateY(-26deg);transform-origin:50% 50%;box-shadow:0 0 0 .8px #727477,inset 0 0 0 1px #9e9fa2,1.5px 1px 1px #1117,3px 7px 12px #25152010;transition:transform .85s var(--ease),left .85s var(--ease),top .85s var(--ease),box-shadow .65s ease!important}
.hum-device::before,.hum-device::after{content:"";position:absolute;left:-3.5px;width:2px;height:27px;border-radius:2px 0 0 2px;background:linear-gradient(90deg,#8e8f91,#27292b);box-shadow:-.5px 0 .5px #2226}
.hum-device::before{top:96px}
.hum-device::after{top:135px}
.hum-showcase.is-engaged .hum-device{left:50%;top:36px;transform:translateX(-50%) perspective(1800px) rotateY(0deg);box-shadow:0 0 0 .8px #727477,inset 0 0 0 1px #9e9fa2,1.5px 1px 1px #1117,2px 10px 20px #71314b18}
.hum-viewport{position:relative;display:block;width:100%;aspect-ratio:795/1724;overflow:hidden;border-radius:27px;background:#f9e7eb;isolation:isolate}
.hum-home-screen{position:absolute;inset:0;display:block;overflow:hidden}
/* Crop only the export's surrounding shadow; retain its original screen pixels. */
.hum-home-screen>img{position:absolute;width:140.754717%;height:118.735499%;max-width:none;left:-20.377358%;top:-6.554524%;display:block}
/* Use the quieter supplied PNG at rest, then retain the full home in the preview. */
.hum-home-screen>img:is(.hum-home-rest,.hum-home-active){transition:filter .38s var(--motion-fill),opacity .24s linear!important}
.hum-home-screen>img.hum-home-active{opacity:0}
.hum-showcase.is-engaged .hum-home-screen>img.hum-home-rest{opacity:0}
.hum-showcase.is-engaged .hum-home-screen>img.hum-home-active{opacity:1}
.hum-record-button{position:absolute;left:34.213836%;top:43.329466%;width:31.572327%;aspect-ratio:1;display:block}
.hum-record-halo{position:absolute;inset:-32%;border:1px solid #f75b9945;border-radius:50%;background:radial-gradient(circle,#fa2f7e52 12%,#fa3c8226 52%,transparent 74%);box-shadow:0 0 24px 12px #ff438038;animation:hum-record-halo 3.2s ease-in-out infinite!important}
.hum-record-face{position:absolute;inset:0;display:block;overflow:hidden;border-radius:50%;background:#f9f5f2;animation:hum-record-breathe 3.2s ease-in-out infinite!important}
.hum-record-face::before{content:"";position:absolute;inset:0;background:#f9f5f2}
.hum-record-face::after{content:"";position:absolute;inset:33%;border-radius:50%;background:#db5358}
/* Quiet the resting screen's pink while keeping the approved halo untouched. */
.hum-home-screen>img,.hum-record-face::before{filter:saturate(.5) brightness(1.025);transition:filter .6s ease!important}
.hum-showcase.is-engaged .hum-home-screen>img,.hum-showcase.is-engaged .hum-record-face::before{filter:saturate(1) brightness(1)}
.hum-showcase.is-engaged .hum-record-face{animation:hum-record-tap .55s .35s ease-in-out both!important}
.hum-showcase.is-engaged .hum-record-halo{animation:none!important;opacity:0;transition:opacity .4s ease!important}
.hum-sheet{position:absolute;left:0;right:0;bottom:0;display:block;line-height:0;transform:translateY(104%);border-radius:20px 20px 0 0;overflow:hidden;box-shadow:0 -3px 12px #372a3012;transition:transform .72s var(--ease)!important;z-index:2;container-type:inline-size}
.hum-sheet>img{display:block;width:100%;height:auto}
.hum-showcase.is-details .hum-sheet,.hum-showcase.is-shared .hum-sheet{transform:translateY(0)}
/* Neutral tags cover the selected pixels until each original colour is revealed. */
.hum-chip,.hum-release{position:absolute;display:block;left:calc(var(--x)*100%/983);top:calc(var(--y)*100%/2048);width:calc(var(--w)*100%/983);height:calc(var(--h)*100%/2048);background:#f7f3f0}
.hum-chip-neutral{position:absolute;inset:.203459cqw;display:grid;place-items:center;border:.254323cqw solid #d9d5d3;border-radius:999px;background:#f7f3f0;color:#90867e;font:400 3.255341cqw/1 Geist,Arial,sans-serif;white-space:nowrap}
.hum-crop-layer{position:absolute;inset:0;display:block;overflow:hidden}
.hum-crop-layer>img{position:absolute;display:block;max-width:none;width:calc(98300%/var(--w));height:calc(204800%/var(--h));left:calc(var(--x)*-100%/var(--w));top:calc(var(--y)*-100%/var(--h))}
.hum-chip-color{opacity:0;transition:opacity .38s ease!important}
.hum-showcase.is-tagged .hum-chip-color{opacity:1;transition-delay:calc(var(--order)*.17s)!important}
.hum-release-face{border-radius:4.272635cqw;transform-origin:50% 50%}
.hum-release-face::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse at center,#ffffff38,transparent 65%);opacity:0}
.hum-showcase.is-releasing .hum-release-face{animation:hum-release-tap .55s ease-in-out both!important}
.hum-showcase.is-releasing .hum-release-face::after{animation:hum-release-light .55s ease-in-out both!important}
@keyframes hum-release-tap{0%,100%{transform:translateY(0) scale(1);filter:brightness(1)}40%,60%{transform:translateY(.5px) scale(.968);filter:brightness(1.25)}}
@keyframes hum-release-light{0%,100%{opacity:0}40%,60%{opacity:1}}
.hum-published-screen{position:absolute;inset:0;display:block;opacity:0;z-index:3;background:#f9e7eb;transition:opacity .6s ease!important}
.hum-published-screen>img{display:block;width:100%;height:100%;object-fit:fill}
.hum-showcase.is-shared .hum-published-screen{opacity:1}
.hum-published-mark{position:absolute;left:42.372881%;top:21.484375%;width:15.254237%;height:7.421875%;display:block;overflow:hidden}
.hum-published-mark>img{position:absolute;display:block;max-width:none;width:655.555556%;height:1347.368421%;left:-277.777778%;top:-289.473684%}
.hum-showcase.is-shared .hum-published-mark{animation:hum-published-breathe 4s .6s ease-in-out infinite!important}
.hum-screen-sheen{position:absolute;inset:0;background:linear-gradient(110deg,#ffffff0a,transparent 40%);pointer-events:none;z-index:4}
.hum-showcase.is-paused .hum-record-halo,.hum-showcase.is-paused .hum-record-face,.hum-showcase.is-paused .hum-published-mark{animation-play-state:paused!important}
@keyframes hum-record-halo{0%,12%,100%{transform:scale(.88);opacity:.2}50%{transform:scale(1.28);opacity:1}80%{transform:scale(1.06);opacity:.5}}
@keyframes hum-record-breathe{0%,12%,100%{transform:scale(1)}50%{transform:scale(1.055)}80%{transform:scale(1.015)}}
@keyframes hum-record-tap{0%,100%{transform:scale(1)}45%{transform:scale(.965)}}
@keyframes hum-published-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}

/* Match the approved NextMove arrow and keep it stationary during the reveal. */
.hum-project-link{position:absolute;left:12px;bottom:12px;z-index:5;display:flex;align-items:center;gap:0;width:max-content;height:36px;margin:0;padding:0;border:0;border-radius:999px;background:transparent;font:inherit;opacity:0;visibility:hidden;pointer-events:none;transition:gap .4s var(--reveal),opacity .3s ease,visibility 0s linear .3s!important}
.hum-showcase.is-engaged .hum-project-link,.hum-project-link:focus-visible{opacity:1;visibility:visible;pointer-events:auto;transition:gap .4s var(--reveal),opacity .3s ease,visibility 0s!important}
.hum-link-icon{width:36px;height:36px;display:grid;place-items:center;flex:none;border:1.5px solid #d8dbe1;border-radius:50%;background:#fffffff2;color:#6a707a;box-shadow:0 1px 2px #2524290d;transition:background .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease!important}
.hum-link-icon svg{display:block;width:22px;height:22px}
.hum-one-liner{display:block;min-width:0;max-width:0;overflow:hidden;padding:6px 0;background:#ffffffed;border:1px solid transparent;border-radius:999px;box-shadow:0 2px 4px #25242900;color:#7d818b;font-size:13px;line-height:18px;white-space:nowrap;opacity:0;transform:translateX(-6px);filter:blur(2px);transition:max-width .5s var(--reveal),padding .5s var(--reveal),opacity .35s ease,transform .45s var(--reveal),filter .35s ease,border-color .35s ease,box-shadow .35s ease!important}
.hum-one-liner>span{display:block;width:max-content}
.hum-one-liner strong{color:#4c535e;font-weight:600}
.hum-link-mark{display:inline-block;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:15px;line-height:1;vertical-align:-1px;margin-right:3px}
.hum-link-dash{color:#a5a8af}
.hum-project-link:is(:hover,:focus-visible,.is-open){gap:6px}
.hum-project-link:is(:hover,:focus-visible,.is-open) .hum-link-icon{color:#171b22;background:#fff;border-color:#bdc3cd;box-shadow:0 2px 4px #25242926}
.hum-project-link:is(:hover,:focus-visible,.is-open) .hum-one-liner{max-width:520px;padding:6px 12px;opacity:1;transform:translateX(0);filter:blur(0);border-color:#e1e3e8;box-shadow:0 2px 4px #25242912}
.hum-showcase.is-engaged:has(.hum-project-link:is(:hover,:focus-visible,.is-open)) .hum-device{top:28px}
@media(max-width:700px){
  .hum-device{width:174px;top:36px;left:calc(100% - 64px);border-radius:29px}
  .hum-viewport{border-radius:23px}
  .hum-showcase.is-engaged .hum-device{left:50%;top:20px}
  .hum-showcase.is-engaged:has(.hum-project-link:is(:hover,:focus-visible,.is-open)) .hum-device{top:14px}
  .hum-project-link{left:10px;bottom:10px}
  .hum-one-liner{white-space:normal;line-height:16px}
  .hum-one-liner>span{max-width:calc(100vw - 132px)}
}
@media(prefers-reduced-motion:reduce){
  /* Keep a subtle ambient glow, with less travel in the unsolicited motion. */
  .hum-record-halo{animation-name:hum-record-soft!important}
  .hum-record-face{animation:none!important}
  .hum-showcase.is-engaged .hum-record-face{animation:hum-record-tap .55s .35s ease-in-out both!important}
  .hum-showcase.is-shared .hum-published-mark{animation-duration:6s!important}
}
@keyframes hum-record-soft{0%,100%{opacity:.2;transform:scale(.96)}50%{opacity:1;transform:scale(1.15)}}

/* HUM identity: a quiet grey mark becomes a pink, staged brand reveal. */
.tile.hum-brand{display:block;padding:0;overflow:visible;background:#fff;border-color:#f0f1f5;transition:background-color .55s ease,border-color .55s ease!important}
.tile.hum-brand.is-engaged{background:#fa0064;border-color:#ed1269;z-index:7}
.hum-brand-preview{position:absolute;inset:0;display:block;border-radius:inherit;overflow:hidden}
.hum-brand-symbol{position:absolute;left:50%;top:50%;display:block;width:132px;height:130px;color:#ceced2;transform:translate(-50%,-50%);transition:color .5s ease,transform .75s var(--reveal)!important;pointer-events:none}
.hum-brand-symbol svg{display:block;width:100%;height:100%;overflow:visible}
.hum-brand-bar{transform-box:fill-box;transform-origin:center;transform:scaleY(1)}
.hum-brand.is-engaged .hum-brand-symbol{color:#fff}
.hum-brand.is-playing .hum-brand-bar{animation:hum-brand-wave 1.4s ease-in-out 1 both!important;animation-delay:calc(var(--bar)*.12s)!important}
.hum-brand.is-raised .hum-brand-symbol{transform:translate(-50%,calc(-50% - 30px)) scale(.84)}
.hum-brand-word{position:absolute;left:50%;top:calc(50% + 30px);display:block;margin:0;color:#fff;font-size:46px;font-weight:700;line-height:1;letter-spacing:-2px;opacity:0;filter:blur(2px);transform:translate(-50%,10px);transition:opacity .45s ease,filter .45s ease,transform .6s var(--reveal)!important;pointer-events:none}
.hum-brand.is-named .hum-brand-word{opacity:1;filter:blur(0);transform:translate(-50%,0)}
.hum-brand.is-engaged .hum-project-link{opacity:1;visibility:visible;pointer-events:auto;transition:gap .4s var(--reveal),opacity .3s ease,visibility 0s!important}
/* Always reveal to the right of the stationary arrow, wrapping at the viewport. */
.hum-brand .hum-project-link{left:12px;right:auto;flex-direction:row;align-items:flex-end}
.hum-brand .hum-one-liner{white-space:normal;transform:translateX(-6px)}
.hum-brand .hum-one-liner>span{max-width:calc(var(--hum-pill-room,180px) - 26px)}
.hum-brand-link:is(:hover,:focus-visible,.is-open) .hum-one-liner{max-width:min(520px,var(--hum-pill-room,180px));transform:translateX(0)}
@keyframes hum-brand-wave{0%,100%{transform:scaleY(1)}22%{transform:scaleY(.35)}48%{transform:scaleY(1.08)}76%{transform:scaleY(.6)}}
@media(max-width:700px){
  .hum-brand-symbol{width:108px;height:106px}
  .hum-brand.is-raised .hum-brand-symbol{transform:translate(-50%,calc(-50% - 23px)) scale(.76)}
  .hum-brand-word{top:calc(50% + 22px);font-size:36px;letter-spacing:-1.5px}
  .hum-brand .hum-project-link{left:10px;right:auto;flex-direction:row}
  .hum-brand .hum-one-liner{transform:translateX(-6px)}
  .hum-brand-link:is(:hover,:focus-visible,.is-open) .hum-one-liner{transform:translateX(0)}
}

/* Homepage footer: measurements from the supplied Sellers reference. */
.home-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 24px;min-height:48px;margin:24px 0 48px;padding:24px 48px 0;color:#25242966;font-size:16px;font-weight:400;line-height:24px;letter-spacing:0}
.home-footer p{margin:0}
.home-footer .footer-contact{display:flex;align-items:center;gap:4px;white-space:nowrap}
.home-footer .footer-arrow{display:block;flex:none;width:14px;height:14px}
.home-footer a{color:#252429cc;font-weight:500}
.home-footer a:is(:hover,:focus-visible){text-decoration:underline;text-underline-offset:3px}
@media(min-width:701px) and (max-width:1100px){.home-footer{max-width:714px;margin-inline:auto;padding-inline:24px}}
@media(max-width:700px){.home-footer{padding-inline:12px;margin-bottom:32px}}

/* The grass reveal is reserved for the mobile pitch. */
.nm-pitch-grass {display:none}