/* Native media rails: full-color photography, visible controls, no scroll hijacking. */
.media-rail{--rail-gap:16px;position:relative;min-width:0;overflow:hidden;padding-block:16px 24px}
.rail-controls{display:flex;justify-content:flex-end;gap:8px;margin:0 var(--gutter,22px) 16px}
.rail-controls button{display:inline-flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;padding:12px;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;transition:background .2s,color .2s}
.rail-controls button:disabled{opacity:.3;cursor:default}
.rail-controls button:not(:disabled):hover{background:var(--blue,#0016c9);color:#fff}
.rail-controls [data-rail-prev] svg{transform:rotate(180deg)}
.rail-track{display:flex;gap:var(--rail-gap);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,22px);padding:4px var(--gutter,22px) 22px;scrollbar-width:thin;scrollbar-color:var(--blue,#0016c9) transparent;-webkit-overflow-scrolling:touch}
.rail-track:focus-visible{outline:3px solid #fa8e32;outline-offset:-3px}
.rail-panel{position:relative;flex:0 0 86%;min-width:0;margin:0;scroll-snap-align:start}
.rail-panel>img,.rail-panel>video,.rail-panel>.motion-frame{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;background:#151515}
.rail-panel:nth-child(even)>img{border-radius:100vw 100vw 0 0}
.rail-panel figcaption{padding-top:14px;font-size:1rem;line-height:1.5}
.rail-panel figcaption:empty{display:none}
.motion-frame{position:relative;overflow:hidden;isolation:isolate;background:#151515}
.motion-frame>video,.motion-frame>img{display:block;width:100%;height:100%;object-fit:cover}
[data-video-toggle]{position:absolute;bottom:20px;right:20px;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 18px;border:1px solid #fff;border-radius:0;background:#0016c9;color:#fff;font-size:.875rem;font-weight:600;line-height:1.3;cursor:pointer}
[data-video-toggle]:hover{background:#000c70}
[data-video-toggle]:focus-visible,.rail-controls button:focus-visible{outline:3px solid #fa8e32;outline-offset:4px}
/* Optional registration frame; decorative geometry stays outside image content. */
.crop-frame{position:relative;padding:12px}
.crop-frame:before,.crop-frame:after{content:"";position:absolute;width:25px;height:25px;border-color:var(--blue,#0016c9);border-style:solid;pointer-events:none}
.crop-frame:before{top:0;left:0;border-width:1px 0 0 1px}
.crop-frame:after{bottom:0;right:0;border-width:0 1px 1px 0}
.js-motion .reveal{transition:opacity .65s ease var(--reveal-delay,0ms),transform .65s cubic-bezier(.22,.61,.36,1) var(--reveal-delay,0ms),padding .3s,background .3s,filter .4s}
.js-motion .reveal[data-pending]{transform:translateY(16px)}
@media(min-width:700px){
  .media-rail{--rail-gap:24px;padding-block:24px 40px}
  .rail-panel{flex-basis:57%}
  .rail-panel>img,.rail-panel>video,.rail-panel>.motion-frame{aspect-ratio:4/3}
}
@media(min-width:1100px){
  .rail-panel{flex-basis:42%}
  .rail-controls{margin-bottom:24px}
  .crop-frame{padding:18px}
  .crop-frame:before,.crop-frame:after{width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){
  .rail-track{scroll-behavior:auto}
  .reveal,.rail-controls button{transition:none}
  .js-motion .reveal[data-pending]{opacity:1;transform:none}
}
.img-fade{opacity:0;transition:opacity .3s ease-out}.img-fade.is-loaded{opacity:1}
