/* The visual sequence is progressive enhancement: the original image is the poster. */
.hero-reel{min-width:0;width:100%;margin:0;color:#10486e}
.hero-reel-media{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid #dce3e8;border-radius:7px;background:#f7f6f2;isolation:isolate}
.hero-reel-stage{position:absolute;inset:0;opacity:0;z-index:0;pointer-events:none;transition:opacity 1200ms ease}
.hero-reel-stage.is-active{opacity:1;z-index:1}
.hero-reel-stage>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.hero-reel-stage--workshop>img{object-fit:cover;object-position:56% center}
.hero-reel-stage--model>img{object-fit:contain}
.hero-reel-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(16,72,110,.12);z-index:3;pointer-events:none}
.hero-reel-progress:after{content:"";display:block;width:100%;height:100%;background:#b86c32;transform-origin:left;transform:scaleX(0)}
.hero-reel.is-running .hero-reel-progress:after{animation:hero-reel-hold 5400ms linear forwards}
@keyframes hero-reel-hold{to{transform:scaleX(1)}}
.hero-reel figcaption{position:static;padding:12px 2px 0;background:none;color:#526d80}
.hero-reel-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:32px}
.hero-reel-heading>strong{font:700 13px/1.45 Manrope,Arial,sans-serif;color:#10486e}
.hero-reel-detail{font:400 11px/1.55 "DM Sans",Arial,sans-serif;margin:1px 0 9px;color:#526d80;min-height:17px}
.hero-reel-controls{display:none}
.hero-reel.is-ready .hero-reel-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.hero-reel-controls button{display:flex;align-items:center;justify-content:center;min-height:34px;padding:7px 5px;border:1px solid #dce3e8;border-radius:4px;background:#fffdf9;color:#526d80;font:600 10.5px/1.35 Manrope,Arial,sans-serif;white-space:nowrap;transition:background 160ms ease,border-color 160ms ease}
.hero-reel-controls button:hover{border-color:#b86c32;color:#10486e;background:#f4eee6}
.hero-reel-controls button[aria-pressed="true"]{background:#10486e;border-color:#10486e;color:#fff}
.hero-reel-toggle{display:none;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:5px 9px;border:1px solid #dce3e8;border-radius:4px;color:#10486e;background:#fffdf9;font:600 10px/1.3 Manrope,Arial,sans-serif;white-space:nowrap}
.hero-reel.is-ready .hero-reel-toggle{display:inline-flex}
.hero-reel-toggle:hover{background:#f4eee6;border-color:#b86c32}
.hero-reel-toggle [data-reel-toggle-icon]{font-size:11px;width:11px;text-align:center}
.hero-reel button:focus-visible{outline:2px solid #985321;outline-offset:3px}
.hero-reel-note{font:400 9px/1.5 "DM Sans",Arial,sans-serif;color:#647888;margin-top:8px}
.hero-reel-announcer{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.hero-reel.is-reduced-motion .hero-reel-stage{transition:none}
.hero-reel.is-reduced-motion .hero-reel-progress:after{animation:none}
.stock-hero-image.hero-reel{height:auto;overflow:visible;border-radius:0;background:none;isolation:auto}
.stock-hero-image.hero-reel figcaption{padding:12px 2px 0;font-size:11px}
.stock-hero-image.hero-reel .hero-reel-heading>strong{font-size:13px}
.stock-hero-image.hero-reel .hero-reel-detail{font-size:11px}
.stock-hero-image.hero-reel:after{display:none}
@media(min-width:1600px){.hero-reel{max-width:720px;justify-self:end}}
@media(max-width:1000px) and (min-width:761px){
 .hero-reel-media{aspect-ratio:1.12}
 .hero-reel-controls{gap:4px}
 .hero-reel-controls button{font-size:9px;padding:7px 2px}
 .hero-reel-heading>strong{font-size:12px}
 .hero-reel-detail{font-size:10px;min-height:31px}
}
@media(max-width:760px){
 .hero-reel-media{aspect-ratio:4/3}
 .hero-reel figcaption,.stock-hero-image.hero-reel figcaption{padding:10px 1px 0}
 .hero-reel-heading>strong,.stock-hero-image.hero-reel .hero-reel-heading>strong{font-size:13px}
 .hero-reel-detail,.stock-hero-image.hero-reel .hero-reel-detail{font-size:12px;min-height:19px;margin-bottom:10px}
 .hero-reel-toggle{font-size:11px;min-height:35px;padding:6px 10px}
 .hero-reel-controls button{font-size:11px;min-height:37px}
 .hero-reel-note{font-size:10px;line-height:1.6;margin-top:9px}
}
@media(max-width:360px){.hero-reel-controls{gap:4px}.hero-reel-controls button{font-size:10px}.hero-reel-detail{font-size:11px}}
@media(prefers-reduced-motion:reduce){.hero-reel-stage{transition:none}.hero-reel.is-running .hero-reel-progress:after{animation:none}.hero-reel-controls button{transition:none}}
