/* An editorial diptych: the people and their roles stay visible together. */
.founders-copy{
  left:7%;right:7%;top:17%;bottom:16%;
  display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  align-items:center;gap:5vw;
}
.founders-lede{min-width:0}
.founders-copy h2{
  font-size:clamp(52px,5.35vw,93px);line-height:.98;
  margin:25px 0 25px;max-width:100%;
}
.founders-intro{font-size:10px;line-height:1.9}
.founders-signature{display:flex;align-items:flex-end;gap:17px;margin-top:42px;color:var(--muted);font:8px/1.7 var(--mono)}
.founders-signature [data-yucca]{width:40px;color:var(--ink)}
.founders-signature>span{padding-bottom:3px}
.founder-list{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:26px;max-width:100%;margin:0}
.founder{min-width:0;border:0;padding:0;pointer-events:auto;outline:none}
.founder-johann{margin-top:38px}
.founder:after{top:auto;bottom:-13px}
.founder-portrait{position:relative;overflow:visible;width:100%;aspect-ratio:4/5;max-height:43dvh;margin:0 0 20px;border-radius:var(--portrait-radius)}
.founder-portrait-frame{
  position:absolute;inset:0;overflow:hidden;background:var(--paper);isolation:isolate;
  border-radius:var(--portrait-radius);
  /* Clip the complete composited group, including filtered/scaled image layers. */
  clip-path:inset(0 round var(--portrait-radius));
}
/* Opposite corners give the two perspectives one complementary contour. */
.founder-ben{--portrait-radius:44% 3px 30% 3px / 35% 3px 25% 3px}
.founder-johann{--portrait-radius:3px 44% 3px 30% / 3px 35% 3px 25%}
.founder-portrait img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:50% 35%;
  filter:grayscale(1) contrast(.97);mix-blend-mode:multiply;
  transition:filter .85s cubic-bezier(.2,.7,.2,1);transform-origin:50% 45%;
}
.founder-johann .founder-portrait img{object-position:50% 0%}
.founder-caption{border-top:1px solid var(--rule);padding-top:14px;display:grid;grid-template-columns:18px minmax(0,1fr);gap:7px 10px}
.founder-number{grid-column:1;grid-row:1;font:8px/1.9 var(--mono);padding-top:2px}
.founder h3{grid-column:2;margin:0;font:400 clamp(11px,1vw,15px)/1.65 var(--mono);letter-spacing:-.045em}
.founder p{grid-column:2;margin:0;max-width:100%;font:10px/1.85 var(--mono);color:var(--muted)}
.founder:hover .founder-portrait img,.founder:focus-visible .founder-portrait img{filter:grayscale(0) contrast(.97)}
.founder:focus-visible .founder-portrait{outline:1px solid var(--brand);outline-offset:5px}
.founder:focus-visible:after{transform:scaleX(1)}
@media(max-width:1000px) and (min-width:621px){
  .founders-copy{gap:3.5vw;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .founders-copy h2{font-size:5.5vw}
  .founder-list{gap:18px}.founder-johann{margin-top:26px}
  .founder-caption{grid-template-columns:14px minmax(0,1fr);gap:6px 7px}
  .founder h3{font-size:11px}.founder p{font-size:8px}
}
@media(max-width:620px){
  .founders-copy{top:15%;bottom:16%;left:7%;right:7%;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:29px}
  .founders-copy h2{font-size:13.5vw;line-height:.97;margin:17px 0 16px}
  .founders-bridge{font-size:8px;line-height:1.7}.founders-intro{font-size:8px;line-height:1.85}
  .founders-signature{display:none}
  .founder-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;margin:0}
  .founder-johann{margin-top:26px}
  .founder-portrait{max-height:29dvh;margin-bottom:14px}
  .founder-caption{grid-template-columns:12px minmax(0,1fr);gap:6px 6px;padding-top:11px}
  .founder-number{font-size:7px;padding-top:1px}
  .founder h3{font-size:11px;line-height:1.7;letter-spacing:-.055em;margin:0}
  .founder p{font-size:9px;line-height:1.85}
}
@media(min-width:621px) and (max-height:650px){
  .founders-copy{top:19%;bottom:17%}
  .founders-copy h2{font-size:min(5.3vw,10.8dvh);margin:19px 0 18px}
  .founders-bridge,.founders-intro{font-size:8px}
  .founders-signature{margin-top:25px;font-size:7px}.founders-signature [data-yucca]{width:28px}
  .founder-johann{margin-top:23px}
  .founder-portrait{max-height:43dvh;margin-bottom:13px}
  .founder-ben .founder-portrait img{object-position:50% 20%}
  .founder-caption{padding-top:10px;gap:5px 7px}
  .founder h3{font-size:11px;line-height:1.6;margin:0}.founder p{font-size:8px;line-height:1.75}
}
@media(max-width:620px) and (max-height:650px){
  .founders-copy{top:15%;bottom:15%;gap:21px}
  .founders-copy h2{font-size:12.8vw;margin:14px 0 12px}
  .founders-bridge,.founders-intro{font-size:7px}
  .founder-johann{margin-top:20px}
  .founder-portrait{max-height:25dvh;margin-bottom:10px}
  .founder-caption{padding-top:9px;gap:4px 5px}
  .founder h3{font-size:9px;line-height:1.6;margin:0}.founder p{font-size:7px;line-height:1.7}
}
@media(min-width:621px) and (max-height:460px){
  .founders-copy{top:21%;bottom:17%}
  .founders-copy h2{font-size:min(5.3vw,10.5dvh);margin:13px 0 13px}
  .founders-bridge,.founders-intro{font-size:7px}
  .founders-signature{margin-top:18px}.founders-signature [data-yucca]{width:24px}
  .founder-johann{margin-top:16px}
  .founder-portrait{max-height:43dvh;margin-bottom:10px}
  .founder-caption{padding-top:8px;gap:4px 6px}
  .founder h3{font-size:9px;line-height:1.55}.founder p{font-size:7px;line-height:1.7}
}
@media(hover:none){.founder-portrait img{filter:grayscale(0) contrast(.97)}}
@media(prefers-reduced-motion:reduce){.founder-portrait img,.founder:after{transition:none}}
