/* Existing 16:9 scenes, with nearby explanation and controls.
   Artwork stays proportional; core content fits a normal desktop viewport. */
.production-journey { position:relative; padding:28px 0; background:#fff; color:#131d3b; font-family:Montserrat,sans-serif; scroll-margin-top:84px; }
.production-journey * { box-sizing:border-box; }
.production-journey [hidden] { display:none !important; }
.production-journey__container { width:min(1140px,calc(100% - 48px)); margin:auto; }
.production-journey__anchor { position:absolute; top:0; width:1px; height:1px; scroll-margin-top:84px; }
.production-journey__intro { text-align:center; margin:0 auto 20px; }
.production-journey .production-journey__intro h2 { margin:0 0 6px; font:600 32px/42px Montserrat,sans-serif; color:#131d3b; letter-spacing:0; }
.production-journey .production-journey__intro p { margin:0; color:#4d5871; font:400 16px/26px Montserrat,sans-serif; }
.production-journey__chapters { display:flex; align-items:stretch; justify-content:center; max-width:1080px; margin:0 auto 18px; }
.production-journey__chapters a { display:flex; align-items:center; justify-content:center; flex:1 1 20%; min-width:0; padding:10px 12px; border-bottom:3px solid transparent; color:#46516a; background:transparent; text-decoration:none; text-align:center; font:400 14px/22px Montserrat,sans-serif; }
.production-journey__chapters a[aria-current="step"] { color:#131d3b; border-bottom-color:#04cc9e; font-weight:600; }
.production-journey__chapters a:hover { color:#131d3b; border-bottom-color:#04cc9e; }
.production-journey__body { --scene-width:clamp(560px,calc((100svh - 350px) * 16 / 9),760px); display:grid; grid-template-columns:minmax(0,1fr) 288px; align-items:center; gap:32px; width:min(100%,calc(var(--scene-width) + 320px)); margin:0 auto; }
.production-journey__visual { min-width:0; }
.production-journey__poster { position:relative; margin:0; background:#f2f6fc; }
.production-journey__poster img { display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:contain; }
.production-journey button { cursor:pointer; border-radius:0; font-family:Montserrat,sans-serif; }
.production-journey__poster button { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); min-height:52px; padding:13px 24px; border:0; background:#244d7f; color:#fff; font:600 16px/26px Montserrat,sans-serif; white-space:nowrap; }
.production-journey__poster button:hover { background:#193d68; }
.production-journey__poster button:disabled { cursor:progress; }
.production-journey__mount jotain-steel-life { display:block; width:100%; }
.production-journey__panel { min-width:0; }
.production-journey__eyebrow { display:block; margin:0 0 6px; color:#657086; font:500 13px/20px Montserrat,sans-serif; }
.production-journey .production-journey__panel h3 { margin:0 0 10px; color:#131d3b; font:600 24px/32px Montserrat,sans-serif; }
.production-journey .production-journey__description,.production-journey .production-journey__overview p { margin:0; color:#46516a; font:400 16px/24px Montserrat,sans-serif; }
.production-journey__stage-navigation { display:grid; grid-template-columns:32px minmax(0,1fr) 32px; gap:8px; align-items:center; margin-top:18px; }
.production-journey__stage-navigation select { width:100%; min-width:0; min-height:44px; padding:9px 26px 9px 9px; border:1px solid #d8dfe9; border-radius:0; background:#fff; color:#131d3b; font:400 14px/24px Montserrat,sans-serif; }
.production-journey__stage-navigation button { min-height:44px; padding:0; border:0; background:transparent; color:#244d7f; font:400 24px/30px Montserrat,sans-serif; }
.production-journey__actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:12px; }
.production-journey__actions button { min-height:44px; padding:9px 0; border:0; background:transparent; color:#244d7f; font:500 14px/24px Montserrat,sans-serif; text-decoration:underline; text-underline-offset:4px; }
.production-journey__actions [data-journey-play] { padding:10px 17px; background:#244d7f; color:#fff; font-weight:600; text-decoration:none; }
.production-journey button:disabled { opacity:.45; cursor:default; }
.production-journey__about { margin-top:16px; color:#657086; font:400 13px/21px Montserrat,sans-serif; }
.production-journey__about summary { width:fit-content; cursor:pointer; padding:3px 0; color:#526078; }
.production-journey .production-journey__about p { margin:10px 0 0; font:inherit; color:inherit; }
.production-journey .production-journey__status { margin:16px auto 0; color:#657086; font:400 14px/24px Montserrat,sans-serif; text-align:center; }
.production-journey a:focus-visible,.production-journey button:focus-visible,.production-journey select:focus-visible,.production-journey summary:focus-visible { outline:2px solid #244d7f; outline-offset:4px; }
@media(max-width:1050px) { .production-journey__body { grid-template-columns:minmax(0,1fr) 270px; gap:24px; } .production-journey__chapters a { padding-left:8px; padding-right:8px; } }
@media(max-width:767px) { .production-journey { padding:32px 0; } .production-journey__container { width:calc(100% - 40px); } .production-journey .production-journey__intro h2 { font-size:28px; line-height:36px; } .production-journey__intro { text-align:left; } .production-journey__body { display:block; width:100%; } .production-journey__panel { margin-top:22px; } .production-journey__chapters { flex-wrap:wrap; justify-content:flex-start; } .production-journey__chapters a { flex-basis:33%; padding:10px 8px; } .production-journey__actions { justify-content:flex-start; gap:24px; } }