/* Selectta feasibility prototype: bounded sticky scroll, without wheel interception. */
.legacy.section{padding:0}
.legacy-frame{padding:70px var(--pad);background:var(--sage)}
.legacy-frame .section-index{margin-bottom:24px}
.legacy-frame .section-heading{margin-bottom:20px;gap:35px}
.legacy-frame .timeline-tabs{margin:20px 0}
.legacy-frame .legacy-stage{display:block;overflow:hidden;min-width:0}
.legacy-track{display:flex;transition:transform .55s ease;will-change:transform}
.legacy-slide{display:grid;grid-template-columns:1.5fr 1fr;flex:0 0 100%;min-width:0;align-items:stretch}
.legacy-slide>img{width:100%;height:clamp(220px,35vh,360px);object-fit:cover}
.legacy-slide .legacy-card{padding:28px}
.legacy-slide h3{font-size:clamp(28px,3vw,42px);margin:18px 0}
.legacy-footer .legacy-controls{padding-top:18px;margin:0}
.legacy-footer .timeline-progress{margin-top:14px}
.legacy-pinning{height:calc(var(--legacy-frame-height) + var(--legacy-travel));padding-bottom:0!important}
.legacy-pinning .legacy-frame{position:sticky;top:0;padding-top:28px;padding-bottom:28px}
.legacy-pinning .section-heading h2{font-size:clamp(32px,3.2vw,44px)}
.legacy-pinning .section-heading>div{display:flex;gap:20px;align-items:center;max-width:460px}
.legacy-pinning .selectta-logo{margin:0;width:80px}
.legacy-pinning .section-index{margin-bottom:16px}
.legacy-pinning .timeline-tabs button{font-size:22px;padding-bottom:12px}
@container(max-width:1050px){.legacy-frame{padding:55px 24px}.legacy-slide{grid-template-columns:1fr}.legacy-slide>img{height:280px}.legacy-slide .legacy-card{padding:25px}.legacy-frame .timeline-tabs{gap:8px}.legacy-frame .timeline-tabs button{color:var(--ink);font-size:20px;min-height:44px}.legacy-frame .timeline-tabs button[aria-pressed=true]{color:var(--bronze)}.legacy-frame .timeline-tabs button small{font-size:8px}.legacy-footer .round{min-width:44px;min-height:44px}}
@media(prefers-reduced-motion:reduce){.legacy-track{transition:none;will-change:auto}}
@container(max-width:700px){.legacy-frame .timeline-tabs{overflow-x:auto;justify-content:flex-start;gap:20px;padding-bottom:4px}.legacy-frame .timeline-tabs button{flex:0 0 auto;min-width:90px;white-space:nowrap}.legacy-frame .timeline-tabs button small{white-space:normal}.legacy-frame .legacy-slide h3{font-size:32px}}

.legacy-pinning .legacy-frame{min-height:100svh;display:flex;flex-direction:column}
.legacy-pinning .legacy-footer{margin-top:auto}


/* Eleven individual developments, with horizontally scrollable year selectors. */
.legacy-location-title{font-size:24px;margin:12px 0 4px}
.legacy-frame .timeline-tabs{display:flex;position:relative;overflow-x:auto;gap:12px;justify-content:flex-start;scrollbar-width:thin;padding-bottom:8px}
.legacy-frame .timeline-tabs button{flex:0 0 132px;min-width:0;text-align:left;white-space:normal}
.legacy-frame .timeline-tabs button small{display:block;white-space:normal;line-height:1.5;margin-top:5px;min-height:26px}
.legacy-pinning .legacy-location-title{font-size:21px;margin:4px 0}
@container(max-width:700px){.legacy-location-title{font-size:24px}.legacy-frame .timeline-tabs button{flex-basis:124px}}

/* Larger developer signature and square desktop portfolio photography. */
.legacy-frame .section-heading{grid-template-columns:1.6fr 1fr;align-items:center}
.legacy-frame .section-heading>.legacy-brand-heading{display:flex;align-items:center;gap:24px;max-width:none;justify-self:start}
.legacy-frame .legacy-brand-heading .selectta-logo{width:140px;max-width:140px;flex-shrink:0;margin:0}
.legacy-brand-heading h2{margin:0}
.legacy-frame .section-heading>.legacy-intro{display:block;max-width:390px}
@container(min-width:1051px){.legacy-slide{grid-template-columns:1fr 1fr}.legacy-slide>img{height:auto;aspect-ratio:1;object-fit:cover}.legacy-slide .legacy-card{display:flex;flex-direction:column;justify-content:center}}
@container(max-width:1050px){.legacy-frame .section-heading{grid-template-columns:1fr}.legacy-frame .legacy-brand-heading .selectta-logo{width:105px;max-width:105px}}
@container(max-width:700px){.legacy-frame .section-heading>.legacy-brand-heading{gap:16px}.legacy-frame .legacy-brand-heading .selectta-logo{width:80px;max-width:80px}.legacy-brand-heading h2{font-size:30px}}