/* Selected genuine project captures. No background video or canvas download. */
.hero-capture{min-height:800px;max-height:1000px}
.hero-capture .hero-fallback{object-position:62% center}
.hero-capture .hero-atmosphere{background:linear-gradient(90deg,#03080fe8,rgba(3,8,15,.65) 26%,rgba(3,8,15,.08) 58%,transparent 80%),linear-gradient(0deg,#060b11 0%,transparent 30%)}
.hero-capture .hero-coordinate{color:#d2e3ed;margin-bottom:130px}
.hero-film{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:48px;border:1px solid #a7cad462;padding:13px 19px;background:#09151ee6;color:#e4f1f4;font-size:12px;border-radius:3px}
.hero-film small{color:#a1b7c4;font:10px Consolas,monospace}
.hero-film:hover{background:#163142;border-color:var(--cyan)}
.hero-film:focus-visible,.featured-moments button:focus-visible{outline:2px solid var(--amber);outline-offset:4px}
.featured-moments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-top:40px}
.featured-moments button{display:block;position:relative;text-align:left;padding:0;overflow:hidden;border:1px solid var(--line);background:#060c12}
.featured-moments img{display:block;width:100%;height:auto;aspect-ratio:16/8;object-fit:cover}
.featured-moments button>span{display:block;padding:17px 18px 19px}
.featured-moments small{display:block;color:#93afbf;font:9px/1.6 Consolas,monospace;letter-spacing:.5px}
.featured-moments strong{display:block;margin-top:6px;font-size:17px;font-weight:500;color:#e6edf2}
.featured-moments b{float:right;color:var(--cyan);font-weight:400}
.selection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.selection-grid .current-frame>img{object-fit:contain;background:#03080f}
/* Decorative ship lettering must not widen the page on small screens. */
.fleet-image{overflow:hidden}
@media(max-width:800px){.hero-capture{min-height:940px;max-height:none}.hero-capture .hero-fallback{object-fit:contain;object-position:center 70%;background:#03080f}.hero-capture .hero-atmosphere{background:linear-gradient(180deg,#03080f 0%,#03080fd9 35%,transparent 55%,transparent 76%,#060b11 94%)}.hero-capture .hero-layout{display:block}.hero-capture .hero-scene-controls{align-items:start}.hero-capture .hero-coordinate{display:none}.hero-capture .hero-content{padding-bottom:0}.featured-moments{gap:12px}.featured-moments button>span{padding:12px}.featured-moments strong{font-size:13px}.featured-moments small{font-size:8px}.hero-film{padding:10px 12px;font-size:11px;gap:7px;max-width:175px}}
@media(max-width:540px){.hero-capture .hero-scene-controls{bottom:100px;align-items:center;gap:15px}.hero-capture .hero-scene-controls p{max-width:54%}.hero-capture .hero-film{max-width:44%;justify-content:center;text-align:center}.hero-capture .hero-scene-controls small{margin-left:0}.featured-moments{grid-template-columns:1fr;padding-top:25px}.featured-moments button{display:grid;grid-template-columns:42% 1fr;align-items:center}.featured-moments img{aspect-ratio:16/10}.featured-moments strong{font-size:16px}.selection-grid{grid-template-columns:1fr}.hero-capture .hero-fallback{object-position:center 68%}}

/* Let translated content determine hero height; never overlay its controls. */
.hero-capture{display:flex;flex-direction:column;height:auto;max-height:none;padding:130px 0 28px}
.hero-capture .hero-layout{height:auto;flex:1;grid-template-columns:minmax(0,1fr) minmax(0,.8fr)}
.hero-capture .hero-content{min-width:0;max-width:680px;padding:0}
.hero-capture h1{font-size:clamp(52px,5.2vw,80px);overflow-wrap:break-word}
.hero-capture .hero-coordinate{margin-bottom:35px}
.hero-capture .hero-scene-controls,.hero-capture .hero-foot{position:relative;inset:auto;flex-shrink:0}
.hero-capture .hero-scene-controls{margin-top:40px}
.hero-capture .hero-foot{margin-top:24px;gap:24px;align-items:center}
.hero-capture .hero-foot>div{min-width:0}
.hero-capture .scroll-cue{flex-shrink:0}
@media(max-width:800px){
  .hero-capture{min-height:0;padding-top:112px}
  .hero-capture .hero-layout{padding-bottom:clamp(140px,30vw,220px)}
  .hero-capture .hero-content{max-width:600px}
  .hero-capture h1{font-size:clamp(44px,9vw,64px);letter-spacing:-2px}
  .hero-capture .hero-scene-controls{margin-top:24px}
}
@media(max-width:540px){
  .hero-capture .hero-scene-controls{flex-direction:column;align-items:flex-start;gap:18px}
  .hero-capture .hero-scene-controls p{max-width:100%}
  .hero-capture .hero-film{max-width:100%;justify-content:flex-start;text-align:left}
  .hero-capture .hero-foot small{max-width:none}
}