@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&display=swap');
:root{color-scheme:dark;font-family:'DM Sans',Arial,sans-serif;color:#f4f4f4;background:#080808;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;position:relative;overflow-x:hidden}#stars{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}main{position:relative;max-width:1440px;min-height:calc(100svh - 90px);padding:76px 48px 90px;margin:auto}header{text-align:center;animation:reveal 1.3s cubic-bezier(.2,.7,.2,1) both}h1{margin:0;font-size:clamp(3rem,6.3vw,6.25rem);line-height:.95;font-weight:400;letter-spacing:-.065em}h1 span{display:block;font-size:clamp(.88rem,1.25vw,1.05rem);letter-spacing:.49em;font-weight:300;margin:24px 0 0 .49em;text-transform:uppercase}.founders{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:140px;max-width:840px;margin:92px auto 0;text-align:center}.founder{min-width:0;animation:reveal 1.5s cubic-bezier(.2,.7,.2,1) var(--delay) both}.portrait{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:236px;height:236px;border-radius:50%;border:1px solid #434343;background:radial-gradient(ellipse at 38% 30%,#242424,#0e0e0e 68%);margin:0 auto 40px;box-shadow:0 0 0 9px #080808,0 0 0 10px #242424;transition:transform .7s ease,border-color .7s ease,box-shadow .7s ease}.portrait-initial{font-size:4.4rem;font-weight:300;letter-spacing:-.07em;color:#696969;line-height:1}.portrait-caption{font-size:.625rem;letter-spacing:.19em;margin-top:20px;color:#717171}.orbit{position:absolute;inset:-11px;border:1px solid transparent;border-top-color:#aaa;border-radius:50%;clip-path:inset(0 0 75% 0);animation:orbit 24s linear infinite}.founder:nth-of-type(2) .orbit{animation-direction:reverse;animation-delay:-9s}.founder:hover .portrait{transform:translateY(-7px);border-color:#aaa;box-shadow:0 0 0 9px #080808,0 0 0 10px #484848}h2{font-size:2rem;font-weight:400;letter-spacing:-.035em;line-height:1.15;margin:0}.rule{height:1px;width:28px;background:#797979;margin:23px auto 20px;transition:width .6s}.founder:hover .rule{width:58px}.bio{font-size:1rem;line-height:1.85;letter-spacing:-.01em;font-weight:300;color:#969696;margin:0}.connection{position:absolute;left:calc(50% - 74px);top:112px;display:flex;align-items:center;gap:20px;width:148px;opacity:.55;animation:appear 2s 1s both}.connection i{height:1px;background:linear-gradient(90deg,transparent,#777);flex:1}.connection i:last-child{transform:rotate(180deg)}.connection svg{width:17px;height:25px;fill:none;stroke:#b1b1b1;stroke-width:1}footer{position:relative;display:flex;align-items:center;gap:30px;margin:0 48px;height:90px;font-size:.625rem;letter-spacing:.16em;color:#666;animation:appear 2s 1s both}.footer-line{height:1px;background:#242424;flex:1}body.motion-paused *,body.motion-paused *::before{animation-play-state:paused!important}@keyframes reveal{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes appear{from{opacity:0}}@keyframes orbit{to{transform:rotate(360deg)}}@media(min-height:950px) and (min-width:760px){main{padding-top:100px}.founders{margin-top:120px}}@media(max-width:760px){main{padding:60px 24px 60px}.founders{gap:65px;margin-top:72px;grid-template-columns:1fr;max-width:390px}.portrait{width:210px;height:210px;margin-bottom:32px}.connection{display:none}h1{font-size:clamp(3.4rem,12vw,5rem)}h2{font-size:1.85rem}footer{margin:0 24px;height:80px;gap:16px}footer>span:first-child{font-size:.55rem;letter-spacing:.09em}}@media(prefers-reduced-motion:reduce){*,*::before{animation:none!important;transition:none!important}}

/* Contact opens in the same space as the founder profiles. */
.contact-stage{position:relative;max-width:980px;margin:92px auto 0;min-height:410px;perspective:1200px}
.contact-stage .founders{margin:0 auto;transition:height .8s ease}
.founder{animation-fill-mode:backwards;transition:translate 1.15s cubic-bezier(.22,.8,.2,1),opacity .85s ease .1s,filter .95s ease}
.connection{animation-fill-mode:backwards;transition:opacity .4s ease}
.contact-open .founder:first-of-type{translate:max(-34vw,-450px) 0;opacity:0;filter:blur(5px);pointer-events:none}
.contact-open .founder:last-of-type{translate:min(34vw,450px) 0;opacity:0;filter:blur(5px);pointer-events:none}
.contact-open .connection{opacity:0}
.contact-panel{position:absolute;top:0;left:50%;width:min(560px,100%);padding:32px 34px;background:linear-gradient(145deg,rgba(28,28,28,.76),rgba(10,10,10,.8));border:1px solid #ffffff24;border-radius:20px;box-shadow:0 26px 90px #0009,inset 0 1px #ffffff09;backdrop-filter:blur(14px);opacity:0;visibility:hidden;transform:translate(-50%,210px) scale(.72) rotateX(12deg);transform-origin:50% 100%;transition:transform 1.1s cubic-bezier(.16,1,.3,1),opacity .65s ease,visibility 0s 1.1s;pointer-events:none}
.contact-open .contact-panel{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1) rotateX(0);transition-delay:.25s,.25s,0s;pointer-events:auto}
.contact-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.contact-heading h2{font-size:2.25rem;outline:none}
button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:1px solid #eee;outline-offset:5px}
.close-contact{border:0;border-radius:50%;background:transparent;color:#999;font-size:1.7rem;width:44px;height:44px;transition:color .2s,background .2s}.close-contact:hover{background:#ffffff0a;color:white}
.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:24px}.contact-panel label{display:flex;flex-direction:column;gap:10px;font-size:.875rem;color:#bbb;margin-bottom:26px}
.contact-panel input,.contact-panel textarea{border:0;border-bottom:1px solid #ffffff2b;border-radius:0;background:transparent;color:#fff;font-size:1rem;padding:4px 0 12px;width:100%;min-width:0;transition:border-color .2s}.contact-panel textarea{resize:vertical;min-height:95px;max-height:220px}.contact-panel input::placeholder,.contact-panel textarea::placeholder{color:#666}.contact-panel input:focus,.contact-panel textarea:focus{border-color:#ccc;outline:none}
.form-bottom{display:flex;flex-direction:column;align-items:stretch;gap:14px}.form-bottom p{font-size:.75rem;line-height:1.6;color:#999;max-width:none;margin:0}.form-bottom p:empty{display:none}.send-contact{display:flex;align-items:center;justify-content:space-between;width:100%;min-block-size:52px;border:1px solid #ffffff38;border-radius:30px;padding:13px 20px;background:#ffffff09;color:#eee;font-size:.875rem;letter-spacing:.02em;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s}.send-contact:hover{background:#ffffff12;border-color:#aaa;box-shadow:0 8px 26px #0005;transform:translateY(-2px)}
.contact-alternative{position:absolute;top:calc(100% + 18px);left:50%;width:max-content;max-width:calc(100% - 24px);margin:0;padding:10px 18px;transform:translateX(-50%);border:1px solid #ffffff17;border-radius:999px;background:#0b0b0be6;box-shadow:0 12px 35px #0008;color:#888;font-size:.78rem;line-height:1.6;text-align:center;backdrop-filter:blur(10px)}.contact-alternative a{color:#ddd;text-decoration:none;border-bottom:1px solid #ffffff40;transition:color .25s,border-color .25s,text-shadow .25s}.contact-alternative a:hover{color:#fff;border-color:#fff;text-shadow:0 0 12px #ffffff40}.contact-alternative a:focus-visible{outline:1px solid #eee;outline-offset:5px}
.contact-panel[aria-hidden="true"] .contact-alternative{display:none}
.website-field{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}.contact-panel input:user-invalid,.contact-panel textarea:user-invalid{border-color:#e59595}.form-bottom p[data-state="success"]{color:#a8d5b5}.form-bottom p[data-state="error"]{color:#e9a3a3}.send-contact:disabled{cursor:wait;opacity:.65;transform:none}
.contact-action{display:flex;justify-content:center;margin-top:56px}.open-contact{display:flex;align-items:center;border:1px solid #434343;border-radius:999px;background:#0e0e0ecc;color:#eee;padding:15px 29px;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;box-shadow:0 0 0 5px #080808,0 0 0 6px #242424;user-select:none;transition:opacity .3s,transform .45s cubic-bezier(.2,.7,.2,1),border-color .4s,box-shadow .4s,color .4s,visibility 0s .5s}.arrow-icon{display:block;width:16px;height:16px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.open-contact .contact-arrow{margin-left:20px;transition:transform .35s ease}.open-contact:hover{transform:translateY(-4px) scale(1.035);border-color:#aaa;color:#fff;box-shadow:0 0 0 5px #080808,0 0 0 6px #484848,0 8px 26px #ffffff14}.open-contact:hover .contact-arrow{transform:translate(3px,-3px)}.open-contact:active{transform:translateY(-1px) scale(.985)}.contact-open .open-contact{opacity:0;transform:translateY(-20px) scale(.85);visibility:hidden;pointer-events:none}
.confirmation-dialog{width:min(430px,calc(100% - 40px));margin:auto;padding:38px 36px 34px;border:1px solid #ffffff2b;border-radius:22px;background:linear-gradient(145deg,#202020f7,#0d0d0df7);color:#f4f4f4;box-shadow:0 28px 100px #000d;text-align:center}.confirmation-dialog[open]{animation:confirmation-in .35s cubic-bezier(.16,1,.3,1) both}.confirmation-dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}.confirmation-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 23px;border:1px solid #9fc9aa80;border-radius:50%;background:#9fc9aa14;color:#b9ddc2;font-size:1.6rem}.confirmation-dialog h2{font-size:1.9rem}.confirmation-dialog p{margin:13px auto 27px;color:#aaa;font-size:.95rem;line-height:1.65}.confirmation-dialog form{margin:0}.confirmation-close{width:100%;min-height:50px;border:1px solid #ffffff38;border-radius:999px;background:#ffffff0c;color:#f4f4f4;transition:background .2s,border-color .2s,transform .2s}.confirmation-close:hover{background:#ffffff17;border-color:#aaa;transform:translateY(-1px)}@keyframes confirmation-in{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:none}}
@media(min-height:950px) and (min-width:761px){.contact-stage{margin-top:120px}.contact-stage .founders{margin-top:0}}
@media(max-width:760px){.contact-stage{margin-top:72px;min-height:460px}.contact-stage .founders{margin-top:0;max-height:1100px;transition:max-height 1.1s cubic-bezier(.22,.8,.2,1)}.contact-open .founders{max-height:460px}.contact-panel{padding:25px 22px;transform:translate(-50%,180px) scale(.8) rotateX(8deg)}.contact-fields{grid-template-columns:1fr;gap:0}.contact-heading{margin-bottom:22px}.contact-panel label{margin-bottom:22px}.contact-action{margin-top:44px}.form-bottom{gap:15px}.form-bottom p{max-width:none;font-size:.75rem}.send-contact{padding:12px 15px}.contact-open .founder:first-of-type{translate:-65vw 0}.contact-open .founder:last-of-type{translate:65vw 0}.confirmation-dialog{width:calc(100% - max(32px,env(safe-area-inset-left) + env(safe-area-inset-right)));padding:32px 24px 26px;border-radius:20px}.confirmation-dialog h2{font-size:1.7rem}.confirmation-dialog p{font-size:.9rem}.confirmation-close{min-height:52px}}
@media(prefers-reduced-motion:reduce){.contact-panel,.founder,.connection,.open-contact,.founders,.confirmation-dialog[open]{transition:none!important;animation:none!important;filter:none!important}}

.portrait-photo{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.portrait-crop{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden}
.portrait-mesut{object-position:50% 67%;filter:saturate(.95) brightness(.98) contrast(1.04)}
.portrait-mario{object-position:50% 12%;transform:scale(1.14);transform-origin:50% 0;filter:saturate(.95) brightness(1.1) contrast(1.04)}
.profile h2{font-size:clamp(1.5rem,2.5vw,2rem);text-wrap:balance}
.portrait,.portrait *,header{user-select:none}.portrait-photo{-webkit-user-drag:none}
header h1{display:inline-block;transition:transform .35s ease,text-shadow .35s ease,filter .35s ease}
header h1:hover{transform:scale(1.04);filter:brightness(1.18);text-shadow:0 0 16px #ffffff52,0 0 38px #ffffff26}
.linkedin-link{display:inline-grid;place-items:center;width:44px;height:44px;margin-top:10px;border-radius:50%;color:#777;transition:color .25s,background-color .25s,transform .25s}
.linkedin-link svg{width:17px;height:17px;fill:currentColor}
.linkedin-link:hover{color:#ddd;background:#ffffff0a;transform:translateY(-2px)}
.linkedin-link:focus-visible{outline:1px solid #eee;outline-offset:3px;color:#eee}

/* Compact language menu. */
.language-switcher{position:absolute;z-index:10;top:26px;right:48px}
.language-button{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid #ffffff1a;border-radius:50%;background:#0d0d0dbf;color:#888;box-shadow:0 6px 24px #0003;backdrop-filter:blur(12px);transition:color .2s,border-color .2s,background .2s}
.language-button:hover,.language-button[aria-expanded="true"]{color:#eee;border-color:#ffffff52;background:#161616e8}
.language-icon{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.35}
.current-language,.language-chevron{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.language-menu{position:absolute;top:calc(100% + 8px);right:0;width:172px;margin:0;padding:6px;list-style:none;border:1px solid #ffffff24;border-radius:14px;background:#111111f2;box-shadow:0 18px 50px #000b;backdrop-filter:blur(16px)}
.language-menu[hidden]{display:none}
.language-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:42px;padding:9px 11px;border:0;border-radius:9px;background:transparent;color:#bbb;font-size:.8rem;text-align:left;transition:color .15s,background .15s}
.language-menu button:not(:disabled):hover,.language-menu button:not(:disabled):focus-visible{color:#fff;background:#ffffff0c;outline:none}
.language-menu button:disabled{cursor:default;color:#fff;background:#ffffff0a}
.language-check{visibility:hidden;color:#999}
.language-menu button:disabled .language-check{visibility:visible}

/* Responsive polish for phones, tablets, and short landscape screens. */
h1,.profile h2,.contact-heading h2{text-wrap:balance}
.bio{text-wrap:pretty}
.open-contact,.close-contact,.linkedin-link,.send-contact,.language-button,.language-menu button{touch-action:manipulation}

@media(max-width:760px){
  main{
    padding-top:max(18px,env(safe-area-inset-top));
    padding-right:max(20px,env(safe-area-inset-right));
    padding-bottom:64px;
    padding-left:max(20px,env(safe-area-inset-left));
  }
  h1{font-size:clamp(2.9rem,14.2vw,4.4rem)}
  h1 span{font-size:clamp(.7rem,3vw,.86rem);letter-spacing:.42em;margin-top:18px;margin-left:.42em}
  .contact-stage{margin-top:clamp(54px,14vw,72px);scroll-margin-top:max(16px,env(safe-area-inset-top))}
  .founders{gap:clamp(48px,14vw,65px)}
  .portrait{width:clamp(174px,52vw,210px);height:auto;aspect-ratio:1;margin-bottom:28px}
  h2,.profile h2{font-size:clamp(1.55rem,7vw,1.85rem)}
  .rule{margin:18px auto}
  .bio{max-width:32ch;margin-inline:auto;font-size:.96rem;line-height:1.75}
  .linkedin-link{margin-top:8px}
  .contact-panel{width:100%;border-radius:18px}
  .contact-heading h2{font-size:clamp(1.9rem,9vw,2.25rem)}
  .contact-panel input{min-height:44px}
  .contact-panel textarea{min-height:104px}
  .contact-alternative{max-width:calc(100% - 8px);border-radius:18px}
  .contact-action{margin-top:40px}
  .open-contact{min-height:48px}
  .contact-open .founders{overflow:hidden}
  .contact-open .contact-stage{min-height:620px}
  footer{
    height:72px;
    margin-right:max(20px,env(safe-area-inset-right));
    margin-left:max(20px,env(safe-area-inset-left));
  }
  footer>span:first-child{font-size:.625rem;letter-spacing:.12em}
  .language-switcher{position:relative;top:auto;right:auto;width:100%;margin-bottom:24px}
  .language-button{width:44px;height:44px;min-height:44px;margin-left:auto}
  .language-menu{position:static;display:grid;grid-template-columns:1fr 1fr;gap:4px;width:100%;margin-top:10px}
  .language-menu[hidden]{display:none}
  .language-menu button{min-height:46px}
}

@media(max-width:360px){
  main{
    padding-right:max(16px,env(safe-area-inset-right));
    padding-left:max(16px,env(safe-area-inset-left));
  }
  .contact-stage{margin-top:48px}
  .contact-panel{padding:22px 18px}
  .contact-heading{margin-bottom:18px}
  .contact-panel label{margin-bottom:18px}
  .contact-alternative{padding:10px 12px;font-size:.75rem}
  .contact-open .contact-stage{min-height:610px}
  footer{
    margin-right:max(16px,env(safe-area-inset-right));
    margin-left:max(16px,env(safe-area-inset-left));
  }
}

@media(min-width:640px) and (max-width:760px){
  .contact-stage{max-width:680px}
  .contact-stage .founders{grid-template-columns:1fr 1fr;gap:56px;max-width:680px}
  .portrait{width:190px}
  .contact-stage{min-height:390px}
  .contact-open .contact-stage{min-height:620px}
}

@media(min-width:640px) and (max-width:760px) and (max-height:600px){
  main{padding-top:32px}
  .contact-stage{margin-top:46px}
  .contact-action{margin-top:34px}
}

@media(min-width:761px) and (max-height:900px){
  main{padding-top:48px;padding-bottom:28px}
  .contact-stage{margin-top:68px}
  .portrait{width:210px;height:210px;margin-bottom:32px}
  .contact-action{margin-top:40px}
  footer{height:72px}
}

@media(hover:none){
  header h1:hover{transform:none;filter:none;text-shadow:none}
  .founder:hover .portrait{transform:none;border-color:#434343;box-shadow:0 0 0 9px #080808,0 0 0 10px #242424}
  .founder:hover .rule{width:28px}
  .linkedin-link:hover,.send-contact:hover,.open-contact:hover{transform:none}
  .language-button:hover{color:#aaa;border-color:#ffffff20;background:#0d0d0dd9}
  .language-button[aria-expanded="true"]{color:#eee;border-color:#ffffff52;background:#161616e8}
  .open-contact:hover .contact-arrow{transform:none}
}
