/* Speaker collection: original portraits, pearl B background and independent ribbon layers. */
/* Clip at main: WebKit does not contain overflowing SVG/canvas descendants
   when overflow-x:clip is set only on the viewport body. */
.speakers-page,.speakers-page main{overflow-x:clip}
.speakers-intro{padding-block:78px 68px}
.speakers-intro h1{font-size:clamp(64px,7.7vw,118px);font-weight:400;line-height:.98;letter-spacing:-.06em;margin:36px 0 46px}
.speakers-intro h1 span,.speaker-tickets h2 span{color:var(--red)}
.speakers-intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:40px;font-size:22px;line-height:1.45}
.speakers-intro-bottom p:last-child{font-size:14px;line-height:1.5;text-align:right}
.speaker-collection{padding-block:20px 110px}
.collection-heading{display:flex;justify-content:space-between;align-items:center;padding:22px 0 30px;border-top:1px solid #ffffff60;margin-bottom:30px}
.collection-heading h2,.collection-heading p{font-size:13px;font-weight:400;letter-spacing:.06em}
.collection-heading h2{text-transform:uppercase}
.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:78px 74px}
.collection-grid .speaker-card{position:relative;min-width:0;scroll-margin-top:130px}
.collection-grid .collection-photo{aspect-ratio:1122/1402;border-radius:12px;overflow:visible;background:transparent;isolation:isolate}
.collection-photo .speaker-ribbon-fallback{position:absolute;inset:0;display:block;pointer-events:none;border-radius:inherit;overflow:hidden}
.collection-photo .speaker-ribbon-fallback img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;transform:none!important}
.collection-photo .speaker-layer{object-fit:contain;object-position:center}
.collection-photo .speaker-ribbon-vector{top:0;left:0;transform:none;height:100%;width:100%;overflow:visible}
.collection-photo .speaker-background{border-radius:inherit}
.collection-photo .speaker-person{pointer-events:none}
.collection-grid .speaker-caption{padding-top:24px}
.collection-grid .speaker-number{font-size:10px;letter-spacing:.12em;line-height:1.2}
.collection-grid .speaker-card h3{font-size:clamp(25px,2.35vw,35px);letter-spacing:-.035em;line-height:1.06;font-weight:400;margin-top:0}
.collection-grid .speaker-role{font-size:15px;line-height:1.45;margin-top:10px}
.collection-grid .talk-title{font-size:17px;line-height:1.4;margin-top:20px;padding-top:16px;border-top:1px solid #ffffff40}
.collection-page-link{display:flex;align-items:center;justify-content:center;gap:12px;width:fit-content;margin:60px auto 0}
.collection-page-link+.all-talks{margin-top:25px}
.collection-grid .speaker-open-hint{right:13px;bottom:13px}
.collection-modal .profile-portrait{position:relative;aspect-ratio:1122/1402;max-height:none;border-radius:12px}
.collection-modal .profile-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
.collection-modal [hidden]{display:none!important}
.collection-modal .profile-identity h2{font-weight:400}
.speaker-tickets{padding-block:80px 100px;border-top:1px solid #ffffff60;text-align:center}
.speaker-tickets h2{font-weight:400;font-size:clamp(60px,6.8vw,98px);letter-spacing:-.05em;line-height:1;margin:30px 0 36px}
.speaker-tickets .button{display:inline-flex;gap:30px}
@media(min-width:761px) and (max-width:1100px){.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:70px 74px}.collection-grid .speaker-card h3{font-size:32px}}
@media(max-width:760px){
 .speakers-intro{padding-block:52px 44px}.speakers-intro h1{font-size:clamp(50px,9.8vw,72px);letter-spacing:-.055em;margin:28px 0 28px}
 .speakers-intro-bottom{display:block;font-size:18px}.speakers-intro-bottom p:last-child{text-align:left;margin-top:24px;font-size:12px}
 .speaker-collection{padding-top:8px;padding-bottom:64px}.collection-heading{padding:18px 0 20px;margin-bottom:20px;gap:20px}.collection-heading h2,.collection-heading p{font-size:11px}
 .collection-grid{grid-template-columns:1fr;gap:58px;width:calc(100% - 14px);max-width:440px;margin-inline:auto}
 .collection-grid .speaker-caption{padding-top:22px}.collection-grid .speaker-card h3{font-size:34px}.collection-grid .speaker-role{font-size:16px}.collection-grid .talk-title{font-size:18px}
 .collection-grid .speaker-open-hint{right:12px;bottom:12px}.collection-grid .speaker-photo{border-radius:12px}
 .collection-modal .profile-portrait{width:100%;max-width:280px;margin-inline:auto;aspect-ratio:1122/1402;max-height:none}
 .collection-modal .profile-identity h2{font-size:40px}.speaker-tickets{padding-block:55px 65px}.speaker-tickets h2{font-size:54px}.speaker-tickets .button{width:100%;justify-content:space-between;font-size:15px;padding-inline:20px;gap:10px}
}

/* The shadow is static and independent of the animated ribbon. */
.collection-photo .portrait-composition{display:block;width:100%;height:100%}
.collection-modal .profile-shadow-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.collection-modal #profile-photo{transform-origin:0 0}

/* Fill the background box; portrait bleed is shared by fallback, ribbon and detail. */
.collection-photo .speaker-background,.collection-photo .speaker-layer{object-fit:cover}