/* Portraits and the shared digital business card. */
.hero-portrait{position:relative;overflow:hidden;margin:0;border-radius:12px;background:#11131a;aspect-ratio:4/5;align-self:center;box-shadow:0 25px 50px #19232d14}.hero-portrait>img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 30%}.hero-portrait:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(0deg,#0d1224d9,transparent);pointer-events:none}.hero-portrait figcaption{position:absolute;bottom:29px;left:30px;right:30px;z-index:1;display:flex;justify-content:space-between;gap:20px;align-items:flex-end;color:#fff}.hero-portrait figcaption span{display:block;font-size:8px;letter-spacing:.15em;color:#d5d6e0;margin-bottom:9px}.hero-portrait figcaption strong{display:block;font-size:43px;letter-spacing:-.05em;line-height:1;font-weight:500}.hero-portrait figcaption>a{width:46px;height:46px;border-radius:50%;border:1px solid #ffffff70;display:grid;place-items:center;font-size:24px;background:#ffffff12}.hero-portrait figcaption>a:hover{background:#5b44d5}.design-lab-row{display:grid;grid-template-columns:.75fr 1.35fr;gap:65px;align-items:center;padding-bottom:60px;border-bottom:1px solid #465142;margin-bottom:55px}.design-lab-copy h3{font-size:37px;margin:22px 0;line-height:1.15}.design-lab-copy>p{font-size:13px;max-width:280px}.design-lab-skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;max-width:300px}.design-lab-skills span{font:9px var(--mono);border:1px solid #55614d;border-radius:4px;padding:6px 9px;color:#c4d6b9}.playground .hero-studio{transform:none;max-width:600px;width:100%;justify-self:end;align-self:center}.playground .hero-studio .studio-caption p{color:#283129}.playground .hero-studio .mini-label{color:#667064}.playground .hero-studio .mini-content h2 em{color:var(--demo-accent)}.playground .hero-studio .studio-top{color:#283129}.playground .hero-studio .preview-stage{min-height:325px}.teaching-layout{align-items:start}.teaching-photo{margin:24px 0}.teaching-photo img{display:block;width:100%;height:auto;border-radius:7px;border:1px solid var(--line)}.teaching-photo figcaption{font-size:9px;line-height:1.6;color:var(--muted);margin-top:8px}.teaching-layout .course-list{max-height:465px}.cv-portrait-intro{display:flex;align-items:center;gap:17px;margin-bottom:19px}.cv-portrait-intro img{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 30%;flex:none;border:1px solid var(--line)}.cv-portrait-intro strong{font-size:15px;font-weight:500;color:var(--text)}.cv-portrait-intro span{display:block;font-size:10px;color:var(--muted);margin-top:4px}.contact-card-cta{margin-top:28px;background:#5b44d5;color:white;font-size:12px;min-height:45px;gap:32px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
dialog.business-card-dialog{padding:0;width:min(570px,calc(100% - 28px));max-height:90svh;border:0;border-radius:16px;overflow:auto;background:#fff;color:#222b35;box-shadow:0 30px 100px #0005}dialog.business-card-dialog .dialog-close{z-index:3;background:#151c30b3;color:#fff;border:1px solid #ffffff45;right:13px;top:12px;width:31px;height:31px;font-size:22px}dialog.business-card-dialog .dialog-close:hover{background:#5b44d5}.business-card{--card-ink:#252a39;--card-purple:#5b44d5;--card-muted:#696c76;font-family:Arial,Helvetica,sans-serif;line-height:1.5;background:#fff;color:var(--card-ink);border-radius:16px;overflow:hidden;text-align:left;color-scheme:light}.business-card a,.business-card button{color:inherit}.business-card button:focus-visible,.business-card a:focus-visible,.business-card input:focus-visible,.business-card summary:focus-visible{outline:3px solid #9177f0;outline-offset:4px}.business-card-top{background:#232735;color:#fff;position:relative;display:grid;grid-template-columns:1fr 125px;align-items:center;gap:25px;padding:38px 36px 32px}.business-card .card-kicker{font:8px var(--mono);letter-spacing:.11em;color:#c8bcf2;line-height:1.6;margin:0 0 14px}.business-card .card-identity h2{font-size:48px;line-height:1.05;font-weight:500;letter-spacing:-.055em;margin:0 0 15px;color:#fff}.card-identity h2>span{color:#b4a0f4}.business-card .card-role{color:#eff0f5;font-size:13px;line-height:1.5;margin:0}.business-card .card-department{font-size:10px;line-height:1.65;color:#bac0d1;margin:9px 0 0}.card-photo{overflow:hidden;width:125px;height:145px;background:#11131a;border-radius:9px;border:1px solid #ffffff2b}.card-photo>img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 20%;transform:scale(2.25);transform-origin:80% 6%}.business-card-body{padding:24px 36px 26px}.business-card .card-intro{color:var(--card-ink);font-size:17px;letter-spacing:-.035em;margin:0 0 17px}.card-contact-list>a{display:flex;gap:13px;align-items:center;padding:12px 0;border-bottom:1px solid #e6e7eb;font-size:13px;line-height:1.4}.card-contact-list>a:hover{color:var(--card-purple)}.card-contact-list>a>span:last-child{margin-left:auto;color:#8a8b94;font-size:16px}.card-contact-list small{display:block;font:7px var(--mono);letter-spacing:.07em;color:var(--card-muted);margin-bottom:4px}.card-contact-icon{width:29px;flex:none;color:#5b44d5;font-size:20px;text-align:center}.card-contact-icon svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.4;margin:auto}.card-office{padding:14px 0 17px;color:var(--card-muted)}.card-office summary{list-style:none;font-size:10px;line-height:1.5;cursor:pointer;display:flex;gap:12px;align-items:center;justify-content:space-between}.card-office summary::-webkit-details-marker{display:none}.card-office summary>span:last-child{font-size:17px}.card-office address{font-size:11px;font-style:normal;line-height:1.7;padding-top:10px}.card-primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.card-button{display:flex;align-items:center;justify-content:center;gap:22px;min-height:46px;border:1px solid #d7d5df;border-radius:6px;font-size:12px;font-weight:600;padding:10px 12px;cursor:pointer;transition:background .2s}.business-card .card-save{background:#5b44d5;color:#fff;border-color:#5b44d5}.business-card .card-save:hover{background:#4936b0}.business-card .card-share{background:#efedf8;color:#443292;border-color:#e1dbee}.business-card .card-share:hover{background:#e1daf5}.card-button>span{font-size:18px}.card-secondary-actions{display:flex;justify-content:center;gap:35px;margin-top:16px}.card-secondary-actions button{border:0;border-bottom:1px solid #d1ccd9;padding:5px 0;background:transparent;font-size:10px;color:#5c5869;min-height:34px}.card-secondary-actions button>span{margin-left:7px}.card-qr-panel{background:#f5f3f9;border:1px solid #e3ddef;padding:18px;margin-top:20px;border-radius:8px;text-align:center}.card-qr-code{width:200px;max-width:100%;margin:auto;background:#fff;border-radius:3px;line-height:0}.card-qr-code svg{display:block;width:100%;height:auto;max-width:100%}.business-card .card-qr-panel p{font-size:11px;color:#635c70;margin:12px 0 5px}.card-qr-panel>a{font-size:10px;text-decoration:underline;text-underline-offset:3px;color:#5b44d5}.card-copy-fallback{margin-top:17px}.card-copy-fallback label{display:block;font-size:10px;color:#635c70;margin-bottom:6px}.card-copy-fallback input{background:#f5f3f9;border:1px solid #ded8e9;color:#433456;padding:10px;border-radius:5px;width:100%;font-size:12px;min-width:0}.business-card .card-status{font-size:11px;color:#4d3d85;margin:12px 0 0;line-height:1.55}.card-status:empty{display:none}.business-card .card-hint{font-size:9px;line-height:1.6;color:#73707e;margin:17px auto 0;text-align:center;max-width:315px}.business-card .card-permalink{display:block;font-size:9px;color:#665488;text-align:center;margin-top:11px}.card-page{min-height:100svh;background:#efeee8;color:#242628;padding:30px 24px 35px}.card-page-header{max-width:930px;margin:0 auto 32px;display:flex;justify-content:space-between;align-items:center;gap:20px}.card-page-header>a:last-child{font-size:11px;color:#665488}.card-page-header .wordmark{font-size:9px}.card-page-header .monogram{font-size:30px}.card-page-main{width:100%;max-width:525px;margin:auto}.card-page .business-card{box-shadow:0 18px 60px #30294d17;border:1px solid #ddd9e7}.card-page .card-permalink{display:none}.card-page-footer{text-align:center;font-family:Georgia,'Times New Roman',serif;font-style:italic;color:#716a7b;font-size:14px;margin-top:27px}.card-noscript{font-size:12px;max-width:440px;margin:25px auto;color:#64626b;text-align:center}
@media(max-width:1100px){.design-lab-row{gap:35px;grid-template-columns:.8fr 1.3fr}.business-card-top{padding:35px 30px 29px}.business-card-body{padding:23px 30px}.hero-portrait figcaption{left:25px;right:25px;bottom:25px}.hero-portrait figcaption strong{font-size:37px}.hero-portrait figcaption span{font-size:7px}.hero-portrait{aspect-ratio:.75}}
@media(max-width:860px){.design-lab-row{grid-template-columns:1fr;gap:25px;margin-bottom:35px;padding-bottom:35px}.design-lab-copy h3{font-size:33px;margin:17px 0}.design-lab-copy>p{max-width:400px}.design-lab-skills{max-width:none;margin-top:18px}.playground .hero-studio{max-width:none}.hero-portrait figcaption{left:21px;right:21px;bottom:21px}.hero-portrait figcaption strong{font-size:32px}.hero-portrait figcaption>a{width:36px;height:36px;font-size:20px}.hero-portrait figcaption span{font-size:6px;max-width:135px}.teaching-layout .course-list{max-height:440px}}
@media(max-width:700px){.hero-portrait{width:100%;max-width:520px;aspect-ratio:4/4.8}.hero-portrait figcaption{left:26px;right:26px;bottom:25px}.hero-portrait figcaption strong{font-size:39px}.hero-portrait figcaption span{font-size:7px;max-width:none}.hero-portrait figcaption>a{width:42px;height:42px;font-size:23px}.hero{padding-bottom:50px;gap:30px}.design-lab-copy h3{font-size:31px}.playground .hero-studio{margin:0;align-self:center}.design-lab-row{gap:25px;margin-bottom:30px;padding-bottom:30px}.teaching-photo{margin:22px 0}.teaching-layout .course-list{max-height:300px}.cv-portrait-intro{margin-bottom:16px}.cv-portrait-intro img{width:60px;height:60px}.cv-portrait-intro strong{font-size:14px}.contact-card-cta{font-size:11px;margin-top:22px;min-height:43px}.business-card-top{grid-template-columns:1fr 93px;gap:18px;padding:35px 24px 25px}.business-card .card-identity h2{font-size:39px;margin-bottom:12px}.business-card .card-kicker{font-size:7px;letter-spacing:.05em;max-width:170px;margin-bottom:12px}.business-card .card-role{font-size:11px}.business-card .card-department{font-size:8px}.card-photo{width:93px;height:120px}.business-card-body{padding:21px 24px}.business-card .card-intro{font-size:16px}.card-contact-list>a{font-size:12px;padding:11px 0}.card-contact-list small{font-size:7px}.card-button{font-size:11px;gap:17px;padding:9px;min-height:45px}.card-secondary-actions{gap:30px;margin-top:13px}.card-office summary{font-size:9px}.card-page{padding:24px 15px 30px}.card-page-header{margin-bottom:24px;gap:16px}.card-page-header>a:last-child{font-size:9px}.card-page-header .wordmark{font-size:8px;gap:9px}.card-page-header .monogram{font-size:28px}.card-page-footer{font-size:12px;margin-top:22px}.business-card .card-hint{font-size:9px}.card-qr-code{width:190px}}
@media(max-width:370px){.business-card-top{grid-template-columns:1fr 80px;padding:31px 20px 23px;gap:12px}.card-photo{width:80px;height:105px}.business-card .card-identity h2{font-size:35px}.business-card .card-kicker{font-size:6px}.business-card-body{padding:19px 20px}.business-card .card-role{font-size:10px}.business-card .card-department{font-size:8px}.card-contact-list>a{font-size:11px}.card-contact-icon{width:25px}.card-button{font-size:10px;gap:12px}.card-office summary{font-size:8px}.hero-portrait figcaption strong{font-size:35px}}
@media print{.card-page{background:white;padding:0}.card-page-header,.card-page-footer,.card-primary-actions,.card-secondary-actions,.card-hint,.card-status,.card-copy-fallback,.card-permalink{display:none!important}.card-page-main{max-width:500px}.business-card{print-color-adjust:exact;-webkit-print-color-adjust:exact}.card-page .business-card{box-shadow:none}}