@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{color-scheme:dark;--bg:#111211;--text:#e9e9e0;--muted:#82857e;--line:rgba(225,230,210,.12);--accent:#c6d7a5;font-family:'DM Sans',Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-width:320px;min-height:100svh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-library{position:absolute;width:0;height:0;overflow:hidden}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,#35413a25 0%,transparent 56%),linear-gradient(90deg,transparent calc(50% - .5px),#d9e6cb03 50%,transparent calc(50% + .5px));z-index:-2}.grain{position:fixed;inset:0;opacity:.035;pointer-events:none;z-index:10;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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.site-header{height:112px;margin:0 5%;display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{display:flex;align-items:center;font-weight:650;font-size:26px;letter-spacing:-1.2px}.wordmark-star{font-size:33px;line-height:1;margin:0 2px 0 4px;color:#cbd6bc}.wordmark-domain{font-weight:450}.header-note{font-size:12px;color:var(--muted);position:absolute;left:50%;transform:translateX(-50%)}.header-link{font-size:12px;display:flex;align-items:center;gap:14px}.header-link svg{width:15px;height:15px}.header-link:hover{color:var(--accent)}main{flex:1;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:24px 24px 42px}.intro{display:flex;align-items:center;gap:10px;margin-bottom:34px}.intro p,.material-label,.identity-caption,.card-overline,.card-domain,.edge-text,.footer-left,.back-top{font-family:'IBM Plex Mono',monospace}.intro p{font-size:9px;letter-spacing:2.2px;margin:0;color:#a1a59a}.tiny-square{width:5px;height:5px;background:var(--accent)}.stage{width:min(740px,100%);aspect-ratio:1.7;perspective:1400px;position:relative;isolation:isolate}.card-position{position:relative;width:100%;height:100%;transform-style:preserve-3d;will-change:transform;transform:rotateX(4deg) rotateY(-7deg) rotateZ(-2deg)}.card{width:100%;height:100%;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.23,1,.32,1);position:relative}.card.flipped{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;border-radius:23px;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #bec7b238;overflow:hidden;background:#202320;box-shadow:inset 0 1px 0 #edf5d21a,inset 0 -1px 0 #0008,0 30px 75px #0006}.card-front{transform:translateZ(1px);background:#1e221e radial-gradient(ellipse at 82% 20%,#343d37 0%,#252a26 40%,#1e221e 85%)}.card-texture{position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0px,transparent 3px,#ecf5dd02 3.5px,#ecf5dd02 4px);pointer-events:none}.card-front:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at var(--light-x,70%) var(--light-y,20%),#f5f8e914,transparent 65%);pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 60px #0002}.card-top,.card-bottom{position:absolute;left:34px;right:34px;display:flex;align-items:center;justify-content:space-between;z-index:2}.card-top{top:29px}.identity{display:flex;align-items:center;gap:12px}.identity img{border-radius:50%;filter:saturate(.55);border:1px solid #e5ecc72e;object-fit:cover}.identity>div{display:flex;flex-direction:column;gap:5px}.identity>div>span:first-child{font-size:13px;font-weight:500;letter-spacing:.1px}.identity-caption{font-size:7px;color:#b9c2ad;letter-spacing:1.4px}.round-button{background:#c0d2b408;border:1px solid #dfebcc28;border-radius:50%;width:35px;height:35px;display:grid;place-items:center;transition:background .2s,transform .4s}.round-button svg{width:17px;height:17px}.round-button:hover{background:#c4d5b424;transform:rotate(25deg)}.card-name{position:absolute;left:36px;top:132px;z-index:2;pointer-events:none}.card-overline{font-size:7px;letter-spacing:1.6px;color:#b5bead;margin:0 0 16px}h1{font-size:58px;letter-spacing:-3px;line-height:.99;font-weight:500;margin:0 0 24px}.name-period{color:#c6d7a5}.role{font-size:12px;line-height:1.65;margin:0;font-weight:450;color:#d5dccd}.role span{color:#9da994}.card-bottom{bottom:25px}.card-domain{font-size:13px;letter-spacing:-.6px;display:flex;align-items:flex-start;gap:4px}.card-domain>span{font-size:7px}.connect-button{display:flex;align-items:center;gap:18px;background:transparent;padding:8px 0;font-size:11px;color:#e0e9d5}.connect-button svg{width:15px;height:15px}.connect-button:hover{color:var(--accent)}.edge-text{position:absolute;right:12px;top:46%;writing-mode:vertical-rl;font-size:6px;letter-spacing:1.8px;color:#a4b69580;z-index:2}.card-shadow{position:absolute;inset:85% 8% -10%;background:#000;filter:blur(35px);border-radius:50%;z-index:-1;opacity:.7}.interaction-note{margin:35px 0 23px;color:#8d9388;font-size:10px;display:flex;align-items:center;gap:7px}.interaction-note svg{width:13px;height:13px;stroke-width:1.2}.materials{display:flex;align-items:center;gap:4px;border:1px solid var(--line);padding:5px;border-radius:30px;background:#191b1880}.material-label{font-size:7px;letter-spacing:1.2px;color:#767e70;padding:0 13px}.material{display:flex;align-items:center;gap:7px;font-size:10px;border-radius:25px;background:transparent;color:#90978b;padding:9px 13px;transition:background .25s,color .25s}.material.active{background:#e4ead615;color:#e2e7d9;box-shadow:inset 0 0 0 1px #e5ebd512}.material:hover{color:#f1f6e9}.swatch{height:10px;width:10px;border-radius:50%;border:1px solid #e1e8d44c}.chrome{background:linear-gradient(135deg,#e9f2dc,#636e60 35%,#d5dec9 60%,#434a40)}.spectrum{background:linear-gradient(120deg,#d3acf0,#e7c8a8 40%,#9de1ca 70%,#b2baed)}.wire{background:#53818b;box-shadow:inset 0 0 0 2px #243c45}.closing-note{font-size:11px;color:#747d6e;margin:25px 0 0}.site-footer{margin:0 5%;height:83px;border-top:1px solid #c7d4b512;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:20px}.footer-left{font-size:8px;letter-spacing:1.3px;display:flex;align-items:center;gap:9px;color:#8b9580}.live-dot{width:5px;height:5px;border-radius:50%;background:#acbf93;box-shadow:0 0 8px #c7e0a224}.site-footer nav{display:flex;align-items:center;justify-content:center;gap:24px}.site-footer nav a{color:#92998c;transition:color .2s,transform .2s;display:flex;padding:8px}.site-footer nav svg{width:16px;height:16px}.site-footer nav a:hover{color:#d9e9c5;transform:translateY(-2px)}.experience-controls{justify-self:end;display:flex;align-items:center;gap:17px}.experience-controls button{display:flex;align-items:center;gap:7px;font-size:9px;white-space:nowrap;color:#9ba491;background:transparent;padding:8px 0}.experience-controls svg{width:12px;height:12px}.control-divider{height:12px;width:1px;background:var(--line)}.sound-bars{display:flex;align-items:center;gap:2px;height:12px}.sound-bars i{display:block;width:1.5px;height:3px;background:#94a487}.sound-bars i:nth-child(2){height:8px}.sound-bars i:nth-child(3){height:5px}.sound-bars i:nth-child(4){height:10px}#sound[aria-pressed=true] .sound-bars i{animation:bars 1.2s ease-in-out infinite alternate}#sound[aria-pressed=true] .sound-bars i:nth-child(2){animation-delay:-.3s}#sound[aria-pressed=true] .sound-bars i:nth-child(3){animation-delay:-.7s}.card-back{transform:rotateY(180deg) translateZ(1px);padding:29px 34px;background:#222720 radial-gradient(ellipse at 100% 0%,#3a4536,#222720 70%)}.back-top{display:flex;align-items:center;justify-content:space-between}.back-top .card-overline{margin:0}.card-back h2{font-size:35px;line-height:1.13;letter-spacing:-1.4px;font-weight:450;margin:21px 0 24px}.card-back h2 em{font-style:normal;color:#c6d7a5}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.contact-grid>a{display:flex;align-items:center;gap:12px;padding:15px 0;border-top:1px solid #ccd7bd26}.contact-grid>a>svg{width:18px;height:18px;color:#b2bda8}.contact-grid>a>span{display:flex;flex-direction:column;font-size:12px;gap:5px}.contact-grid small{font-size:8px;color:#96a38c}.contact-grid .contact-arrow{margin-left:auto;width:13px;height:13px;transition:transform .2s}.contact-grid a:hover .contact-arrow{transform:translate(3px,-3px);color:#e0ebd3}.back-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:22px;font-size:9px;color:#a0ae94}.back-bottom a{color:#dce6d2;display:flex;gap:10px}.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}#art{position:absolute;right:0;top:0;width:63%;height:100%;z-index:1;pointer-events:none}.art-fallback{display:none;position:absolute;right:8%;top:22%;width:31%;aspect-ratio:1;border:38px solid #bac8b2;border-radius:45%;transform:rotate(-30deg);box-shadow:inset 8px 9px 18px #0008,8px 9px 24px #0008,inset -8px -5px 14px #fff5;background:transparent}.no-webgl .art-fallback{display:block}.no-webgl #art{display:none}@keyframes bars{to{transform:scaleY(.3)}}
@media(min-height:850px) and (min-width:800px){main{padding-bottom:65px}.intro{margin-bottom:42px}.interaction-note{margin-top:44px}}@media(max-width:700px){.site-header{height:90px;margin:0 6%}.header-note{display:none}.header-link{font-size:10px}.wordmark{font-size:23px}.wordmark-star{font-size:29px}main{padding:30px 22px 40px}.intro p{font-size:7px;letter-spacing:1.8px}.intro{margin-bottom:30px}.stage{max-width:460px;aspect-ratio:.76;perspective:1100px}.card-position{transform:rotateX(3deg) rotateY(-5deg) rotateZ(-2deg)}.card-face{border-radius:22px}.card-top{left:25px;right:25px;top:24px}.identity img{width:37px;height:37px}.identity-caption{font-size:6px}.identity>div>span:first-child{font-size:12px}.card-name{left:27px;top:auto;bottom:92px}h1{font-size:52px;letter-spacing:-2.5px;margin-bottom:16px}.card-overline{font-size:6px;letter-spacing:1.2px;margin-bottom:12px}.role{font-size:10px}.card-bottom{left:27px;right:26px;bottom:22px}.card-domain{font-size:11px}.connect-button{font-size:9px;gap:10px}.edge-text{top:30%;right:10px;font-size:5px}#art{width:100%;height:70%;top:10px;right:-8%}.art-fallback{top:15%;right:20%;width:40%;border-width:30px}.interaction-note{margin-top:30px;margin-bottom:20px;font-size:9px}.material-label{font-size:6px;padding:0 8px}.material{font-size:9px;padding:8px 10px}.closing-note{font-size:10px;margin-top:22px}.site-footer{height:auto;min-height:112px;grid-template-columns:1fr 1fr;gap:0 10px;margin:0 6%;padding:14px 0}.site-footer nav{grid-column:1/-1;grid-row:1;gap:25px;margin-bottom:10px}.footer-left{font-size:6px;letter-spacing:.6px}.experience-controls{gap:12px}.experience-controls button{font-size:8px}.card-back{padding:24px}.card-back h2{font-size:34px;margin:30px 0}.contact-grid{grid-template-columns:1fr;gap:0}.contact-grid>a{padding:13px 0}.contact-grid>a>span{font-size:11px}.contact-grid small{font-size:8px}.back-bottom{margin-top:20px;font-size:8px}.back-bottom>span{max-width:130px}}
@media(max-width:370px){main{padding-left:18px;padding-right:18px}.card-name{bottom:78px}h1{font-size:45px}.role{font-size:9px}.card-back h2{font-size:29px;margin:18px 0}.contact-grid>a{padding:10px 0}.card-top{left:22px;right:22px}.card-back{padding:22px}.back-bottom{margin-top:14px}.material-label{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.card-position{will-change:auto}.card{transition:none}.card-shadow{opacity:.5}}
/* Keep the complete calling card on one desktop screen, with proportional type. */
@media(min-width:701px){
  .site-header,.site-footer{flex-shrink:0}.stage{container-type:inline-size}
  .card-top{left:4.6%;right:4.6%;top:6.7%}.identity{gap:1.62cqw}.identity img{width:5.68cqw;height:5.68cqw}.identity>div{gap:.68cqw}.identity>div>span:first-child{font-size:1.76cqw}.identity-caption{font-size:.95cqw;letter-spacing:.19cqw}.round-button{width:4.73cqw;height:4.73cqw}.round-button svg{width:2.3cqw;height:2.3cqw}
  .card-name{left:4.86%;top:30.3%}.card-overline{font-size:.95cqw;letter-spacing:.216cqw;margin-bottom:2.16cqw}h1{font-size:7.84cqw;letter-spacing:-.405cqw;margin-bottom:3.24cqw}.role{font-size:1.62cqw}.card-bottom{left:4.6%;right:4.6%;bottom:5.75%}.card-domain{font-size:1.76cqw}.connect-button{font-size:1.49cqw;gap:2.43cqw}.connect-button svg{width:2.03cqw;height:2.03cqw}.edge-text{font-size:.81cqw}.card-face{border-radius:3.1cqw}
  .card-back{padding:3.92cqw 4.6cqw}.card-back h2{font-size:4.73cqw;margin:2.84cqw 0 3.24cqw}.contact-grid{gap:0 4.05cqw}.contact-grid>a{padding:2.03cqw 0;gap:1.62cqw}.contact-grid>a>span{font-size:1.62cqw;gap:.68cqw}.contact-grid small{font-size:1.08cqw}.contact-grid>a>svg{width:2.43cqw;height:2.43cqw}.contact-grid .contact-arrow{width:1.76cqw;height:1.76cqw}.back-bottom{margin-top:2.97cqw;font-size:1.22cqw}
}
@media(min-width:701px) and (max-height:950px){
  .site-header{height:80px}.site-footer{height:64px}main{padding:12px 24px 18px}.stage{width:min(740px,max(480px,calc((100svh - 370px)*1.7)))}.intro{margin-bottom:23px}.interaction-note{margin:25px 0 17px}.closing-note{margin-top:18px}
}
@media(min-width:701px) and (max-height:800px){.site-header{height:70px}.closing-note{display:none}.site-footer{height:60px}.interaction-note{margin:23px 0 15px}}
.chrome{background:linear-gradient(135deg,#d6e9a0,#85b65c 45%,#3b6246)}
.art-fallback{border:0;border-radius:0;box-shadow:none;transform:rotateX(50deg) rotateZ(-30deg);background:repeating-conic-gradient(#8bb762 0% 25%,#2e4834 0% 50%) 50% / 28px 28px;filter:drop-shadow(10px 18px 3px #0004);aspect-ratio:1.6;width:42%;right:5%;top:30%}
body[data-material="1"] .art-fallback{filter:hue-rotate(90deg) drop-shadow(10px 18px 3px #0004)}body[data-material="2"] .art-fallback{filter:hue-rotate(145deg) drop-shadow(10px 18px 3px #0004)}
@media(max-width:700px){
  #art{width:100%;height:44%;top:14px;right:-2%}.card-back h2{font-size:29px;margin:18px 0 20px}.contact-grid>a{padding:10px 0}.contact-grid>a>span{gap:3px}.back-bottom{margin-top:18px}.art-fallback{top:23%;width:60%;right:16%}
}
@media(max-width:370px){.card-back{padding:20px}.card-back h2{font-size:24px;margin:14px 0 16px}.contact-grid>a{padding:7px 0}.back-bottom{margin-top:14px}}