/* Horizontal development gallery concept: scroll position is never intercepted. */
#developments{height:calc(100svh + clamp(1710px,378svh,3060px));scroll-margin-top:0;overflow-anchor:none;position:relative;background:#fff;padding:0;overflow:visible;--card-width:min(64vw,900px);--card-gap:28px;--gallery-gutter:5vw}
#developments .development-stage{position:sticky;top:0;height:calc(100svh - 32px);min-height:540px;display:flex;flex-direction:column;gap:24px;padding:36px 0 28px;background:#fff;overflow:hidden}
.development-heading{display:block;padding:0 var(--gallery-gutter);flex-shrink:0}
#gallery-title{font:400 clamp(40px,4.9vw,76px)/1.05 Clearface,Georgia,serif;letter-spacing:-.04em;color:#db365e;margin:0;max-width:1100px}
.development-heading>a{display:flex;margin-top:16px;width:max-content;align-items:center;gap:20px;white-space:nowrap;font:400 16px/1.4 Walsheim,sans-serif;color:#172239}
.development-viewport{flex:1;min-height:0;overflow:hidden;padding:8px 0}
#developments #gallery{display:flex;gap:var(--card-gap);width:max-content;height:100%;padding:0 calc(100vw - var(--card-width) - var(--gallery-gutter)) 0 var(--gallery-gutter);margin:0;will-change:transform}
#developments .photo-tile{grid-area:auto;flex:none;width:var(--card-width);height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto;border-radius:22px;opacity:1;transform:none;transition:none;background:#172239;box-shadow:none}
#developments .photo-tile img{height:100%;width:100%;object-fit:cover;transform:none;transition:transform .8s ease}
#developments .photo-tile:hover img{transform:scale(1.035)}
#developments .tile-caption{position:static;padding:21px 82px 22px 27px;min-height:98px;display:flex;flex-direction:column;gap:7px;background:#172239;color:#fff;font-family:Walsheim,sans-serif}
#developments .tile-caption strong{font-size:clamp(20px,2.1vw,32px);font-weight:400;line-height:1.16;color:#fff;letter-spacing:-.025em}
#developments .tile-caption>span{font-size:14px;line-height:1.4;color:#fff;opacity:.88}
#developments .tile-plus{position:absolute;right:23px;bottom:24px;top:auto;width:43px;height:43px;border:1px solid #ffffffab;border-radius:50%;opacity:1;transform:none;background:transparent;color:#fff;display:grid;place-items:center}
#developments .tile-plus svg{width:22px;height:22px}
#developments .photo-tile:focus-visible{outline-offset:-5px;outline:3px solid #db365e}
.development-controls{display:flex;align-items:center;gap:28px;width:min(70vw,900px);margin:0 auto;flex-shrink:0;color:#172239}
.development-scroll-cue{font:400 14px/1.3 Walsheim,sans-serif;margin:0;white-space:nowrap}
.development-progress{height:4px;border-radius:4px;background:#f4d6de;flex:1;overflow:hidden}
.development-progress>span{display:block;background:#db365e;height:100%;width:100%;transform:scaleX(0);transform-origin:left}
.development-arrows{display:flex;gap:14px}.development-arrows button{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#172239;border:0;color:white;padding:0}.development-arrows button:hover{background:#db365e}.development-arrows button:disabled{opacity:.3}
#data-note{padding:0 5vw;font-size:14px;margin:0}
#developments.is-static .development-stage{position:relative;height:760px;max-height:95svh}
#developments.is-static .development-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--gallery-gutter);scrollbar-width:thin;scrollbar-color:#db365e #f4d6de}
#developments.is-static #gallery{transform:none!important;will-change:auto}
#developments.is-static .photo-tile{scroll-snap-align:start}
@media(max-width:760px){
 #developments{--card-width:84vw;--card-gap:18px;--gallery-gutter:6vw}
 #developments .development-stage{padding:26px 0 24px;gap:20px;min-height:530px}
 .development-heading{display:block;padding:0 6vw}
 #gallery-title{font-size:clamp(34px,8vw,52px);line-height:1.07}
 .development-heading>a{font-size:14px;margin-top:16px;gap:14px;width:max-content}
 #developments .tile-caption{padding:16px 53px 18px 18px;min-height:112px;gap:8px}
 #developments .tile-caption strong{font-size:21px;line-height:1.15}
 #developments .tile-caption>span{font-size:12px;line-height:1.4}
 #developments .tile-plus{width:30px;height:30px;bottom:24px;right:14px}
 #developments .tile-plus svg{width:17px;height:17px}
 .development-controls{width:88vw;gap:16px}.development-scroll-cue{font-size:12px;white-space:normal;max-width:64px}.development-arrows{gap:10px}.development-arrows button{width:40px;height:40px}
 #developments .photo-tile:hover img{transform:none}
}
@media(prefers-reduced-motion:reduce){#developments .photo-tile img{transform:none!important;transition:none}}
@media(max-width:760px){#developments .development-stage{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}}

/* Match the customer stories shuffle button. */
#developments .development-heading>a{gap:14px;border:1px solid #db365e;border-radius:999px;color:#db365e;background:#fff;padding:15px 23px;font:400 16px/1.4 Walsheim,sans-serif;transition:background .2s,color .2s}
#developments .development-heading>a:hover{background:#db365e;color:#fff}
#developments.is-empty{height:auto!important}
#developments.is-empty .development-stage{position:relative;height:auto;min-height:0}
#developments.is-empty .development-viewport,#developments.is-empty .development-controls{display:none}
@media(max-width:760px){#developments .development-heading>a{font-size:15px}}

#developments .development-intro{max-width:1100px;margin:16px 0 0;color:#000;font:400 18px/1.5 Walsheim,Arial,sans-serif;letter-spacing:normal}
@media(max-width:760px){#developments .development-intro{font-size:15px;line-height:1.45;margin-top:14px}#developments .development-stage{min-height:740px}}

#main #gallery-title{color:#000}#main #gallery-title>span{color:#db365e}