@font-face{font-family:Inter;src:url('assets/Inter-Variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{font-family:Inter,Arial,sans-serif;color:#222;background:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
body{margin:0;min-width:280px;min-height:100svh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:2px solid #222;outline-offset:8px;border-radius:6px}
.header{display:flex;align-items:center;justify-content:space-between;padding:28px 4.5vw;gap:24px}
.brand{display:block;flex:0 0 auto}.brand img{display:block;width:154px;height:auto}
.nav-link{font-size:13px;font-weight:500;display:flex;align-items:center;gap:18px;min-height:44px}.nav-link span{font-size:20px}.nav-link:hover{text-decoration:underline;text-underline-offset:5px}
main{flex:1;text-align:center;padding:55px 24px 65px}
.intro{animation:arrive 1s cubic-bezier(.16,1,.3,1) both}
.eyebrow{margin:0 0 23px;font-size:10px;font-weight:550;letter-spacing:.17em;color:#737373}
h1{margin:0;font-size:clamp(44px,5.3vw,72px);font-weight:450;line-height:1.065;letter-spacing:-.057em}
.subheading{font-size:16px;line-height:1.6;color:#707070;margin:24px 0 0;letter-spacing:-.025em}
.team{position:relative;margin:39px auto 0;width:min(440px,100%);padding:30px 0 0;isolation:isolate}
.orbit{position:absolute;z-index:-1;width:332px;height:332px;border:1px solid #ececea;border-radius:50%;top:-5px;left:50%;transform:translateX(-50%);animation:ring-arrive 1.4s ease-out both}
.orbit:after{content:'';position:absolute;inset:-35px;border:1px solid #f5f5f3;border-radius:50%}
.orbit span{position:absolute;width:7px;height:7px;border-radius:50%;background:#c6cbc2;top:53px;right:42px;box-shadow:0 0 0 5px #fff}
.employee{display:inline-flex;align-items:center;flex-direction:column;position:relative;border-radius:140px 140px 16px 16px;animation:settle 4.6s cubic-bezier(.22,.61,.36,1) both}
.portrait-wrap{position:relative;width:242px;height:242px;border-radius:50%}
.portrait{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 10px 35px -22px #0007;transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.portrait-arrow{position:absolute;bottom:8px;right:7px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#222;border:1px solid #e8e8e6;box-shadow:0 3px 9px #00000008;font-size:22px;transition:transform .3s}
.identity{display:flex;align-items:center;gap:11px;margin-top:24px;background:#fff;padding:0 8px}
h2{font-size:22px;font-weight:500;letter-spacing:-.045em;margin:0}.role{font-size:11px;background:#f3f3f1;color:#686861;border-radius:30px;padding:5px 9px}
.meet{background:#fff;padding:0 8px;font-size:12px;color:#737373;display:flex;gap:7px;align-items:center;margin-top:12px;min-height:30px}
.employee:hover .portrait,.employee:focus-visible .portrait{transform:translateY(-4px);box-shadow:0 18px 42px -24px #0009}.employee:hover .portrait-arrow,.employee:focus-visible .portrait-arrow{transform:translate(2px,-2px)}.employee:hover .meet,.employee:focus-visible .meet{color:#222;text-decoration:underline;text-underline-offset:4px}
footer{margin:0 4.5vw;border-top:1px solid #efefed;padding:22px 0 26px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#797979}
@keyframes arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ring-arrive{from{opacity:0;transform:translateX(-50%) scale(.93)}to{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes settle{0%{opacity:0;transform:translateY(23px)}22%{opacity:1;transform:translateY(-6px)}60%{transform:translateY(3px)}100%{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){main{padding-top:70px}}
@media(max-width:600px){.header{padding:20px 24px}.brand img{width:128px}.nav-link{font-size:12px;gap:10px}main{padding:46px 20px 46px}h1{font-size:clamp(39px,10.9vw,58px)}.eyebrow{font-size:9px;margin-bottom:20px}.subheading{font-size:13px;margin-top:21px}.team{margin-top:36px;padding-top:28px}.portrait-wrap{width:210px;height:210px}.orbit{width:286px;height:286px;top:-10px}.orbit:after{inset:-23px}.orbit span{top:44px;right:37px}.identity{margin-top:22px}footer{margin:0 24px;padding:19px 0 22px;font-size:9px;gap:12px}}
@media(max-width:350px){.orbit:after{display:none}.orbit{width:260px;height:260px}.subheading{max-width:240px;margin-left:auto;margin-right:auto}footer{flex-direction:column;gap:8px}.header{padding-left:20px;padding-right:20px}.brand img{width:112px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.backing{margin:57px auto 0;max-width:480px}
.backing h2{font-size:11px;line-height:1.6;font-weight:400;letter-spacing:0;color:#737373;margin:0 0 24px}
.backing-logos{display:flex;align-items:center;justify-content:center;gap:42px}
.backing-logos img{display:block;flex:0 0 auto;height:auto;filter:grayscale(1) brightness(0);opacity:.65}
.logo-lovable{width:105px}.logo-openai{width:83px}.logo-a16z{width:95px}
@media(max-width:600px){.backing{margin-top:47px}.backing h2{font-size:10px;margin-bottom:22px}.backing-logos{gap:29px}.logo-lovable{width:89px}.logo-openai{width:73px}.logo-a16z{width:80px}}
@media(max-width:350px){.backing-logos{gap:23px}.logo-lovable{width:83px}.logo-openai{width:68px}.logo-a16z{width:70px}}

/* Parent-company hierarchy: company first, live employees second. */
h1{font-size:clamp(39px,4.8vw,65px)}
.subheading{max-width:620px;margin-left:auto;margin-right:auto}
.employees{margin:64px auto 0;scroll-margin-top:30px}
.section-heading h2{font-size:15px;font-weight:500;letter-spacing:-.02em}
.section-heading p{font-size:12px;color:#737373;margin:10px 0 0}
.team{margin-top:37px}
.live-status{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:10px;color:#686861;background:#fff;padding:0 8px}
.live-status>span{width:5px;height:5px;border-radius:50%;background:#61785e}
.meet{margin-top:5px}
@media(max-width:600px){h1{font-size:clamp(32px,8.7vw,49px)}.employees{margin-top:47px}.subheading{font-size:13px;max-width:340px}.team{margin-top:34px}}

/* Live and upcoming employees: preserve a clear difference in availability. */
.employee-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:62px;max-width:780px;margin:0 auto}
.employee-grid .team{width:100%;min-width:0}
.upcoming{animation-delay:.15s;color:#828282}
.upcoming-portrait{overflow:hidden;background:#ececeb;border:1px solid #e6e6e4;box-shadow:inset 0 0 50px #fff6}
.silhouette{width:100%;height:100%;fill:#c9c9c7;filter:blur(5px);opacity:.58}
.unrevealed{position:absolute;inset:0;display:grid;place-items:center;font-size:34px;font-weight:400;color:#999;letter-spacing:-.05em}
.upcoming .identity{margin-top:24px}
.soon-status{margin-top:8px;font-size:10px;line-height:16px;padding:3px 9px;border-radius:20px;background:#f0f0ee;color:#777}
.upcoming .meet{font-size:11px;color:#8a8a88;margin-top:5px}
.upcoming-team .orbit{border-color:#f0f0ee}.upcoming-team .orbit span{background:#dededb}
@media(max-width:700px){.employee-grid{gap:25px;max-width:530px}.employee-grid .portrait-wrap{width:180px;height:180px}.employee-grid .orbit{width:220px;height:220px;top:7px}.employee-grid .orbit:after{inset:-13px}.upcoming .meet{max-width:165px;line-height:1.5}}
@media(max-width:440px){.employee-grid{grid-template-columns:1fr;gap:48px;max-width:330px}.employee-grid .portrait-wrap{width:210px;height:210px}.employee-grid .orbit{width:270px;height:270px;top:0}.employee-grid .team{margin-top:30px}.upcoming .meet{max-width:none}}

/* Match visible wordmark height instead of arbitrary unequal widths. */
.backing-logos .logo-lovable{width:117px;height:auto}
.backing-logos .logo-openai{width:83px;height:auto}
.backing-logos .logo-a16z{width:52px;height:auto}
@media(max-width:600px){.backing-logos .logo-lovable{width:105px}.backing-logos .logo-openai{width:75px}.backing-logos .logo-a16z{width:47px}}
@media(max-width:350px){.backing-logos .logo-lovable{width:94px}.backing-logos .logo-openai{width:67px}.backing-logos .logo-a16z{width:42px}}

.enzo-portrait{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;filter:grayscale(1);opacity:.46}

.hero-mark{display:block;width:64px;height:64px;object-fit:contain;margin:0 auto 26px}

/* First-screen composition: brand lives in the header, proof stays visible. */
.header{padding-top:18px;padding-bottom:18px}
main{padding-top:12px;padding-bottom:24px}
h1{font-size:clamp(34px,4.2vw,56px)}
.subheading{margin-top:16px;font-size:14px}
.employees{margin-top:25px}
.section-heading p{margin-top:6px}
.employee-grid{max-width:650px;gap:50px}
.employee-grid .team{margin-top:15px;padding-top:16px}
.employee-grid .portrait-wrap{width:180px;height:180px}
.employee-grid .orbit{width:218px;height:218px;top:0}
.employee-grid .orbit:after{inset:-14px}
.identity,.upcoming .identity{margin-top:16px}
.backing{margin-top:22px}.backing h2{margin-bottom:14px}
footer{padding-top:14px;padding-bottom:16px}
@media(max-width:600px){main{padding:12px 18px 22px}.header{padding:14px 20px}h1{font-size:clamp(30px,8vw,44px)}.subheading{font-size:12px;margin-top:14px}.employees{margin-top:23px}.employee-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:440px}.employee-grid .team{margin-top:15px;padding-top:12px}.employee-grid .portrait-wrap{width:clamp(105px,31vw,150px);height:clamp(105px,31vw,150px)}.employee-grid .orbit{width:clamp(130px,37vw,176px);height:clamp(130px,37vw,176px);top:0}.employee-grid .orbit:after{inset:-7px}.identity,.upcoming .identity{gap:6px;margin-top:14px;padding:0}.identity h2{font-size:19px}.role{font-size:9px;padding:4px 6px}.meet,.upcoming .meet{font-size:10px;max-width:145px;min-height:30px;line-height:1.4}.portrait-arrow{width:28px;height:28px;font-size:17px;bottom:2px;right:2px}.backing{margin-top:22px}.backing-logos{gap:25px}.backing h2{margin-bottom:14px}footer{font-size:8px}}

@media(min-width:601px){.employees{margin-top:18px}.employee-grid .team{margin-top:10px;padding-top:10px}.employee-grid .portrait-wrap{width:160px;height:160px}.employee-grid .orbit{width:198px;height:198px}.backing{margin-top:18px}}

/* Approved minimal Joinery relationship — production v12. */
.connection{max-width:780px;margin:24px auto 0}.connection .diagram{display:block;width:100%;font-family:Inter,Arial,sans-serif;overflow:visible}.connection text{text-anchor:middle}.connection .name{font-size:17px;fill:#30352b}.connection .role{font-size:11px;fill:#8c9183}.connection .track{stroke:#d0d4c8;stroke-width:1.5;fill:none}.connection .pulse,.connection .packet{opacity:0}.connection .joint-a path,.connection .joint-b path{transition:fill .2s ease}.connection-caption{font-size:12px;color:#838a77;line-height:1.7;margin:18px 0 0}.connection-status{font-size:10px;color:#989f8d;margin:12px 0 0}.connection a:hover .name{text-decoration:underline}.connection a:focus-visible{outline:2px solid #222}.backing{margin-top:23px}
@media(max-width:600px){.connection{margin-top:28px}.connection .name{font-size:25px}.connection .role{font-size:18px}.connection-caption{font-size:11px;margin-top:23px}.connection-status{font-size:9px;margin-top:12px}.backing{margin-top:24px}}
