/* Keep touch controls and long translated content usable on narrow screens. */
@media(max-width:820px){
  .menubtn,.language-switcher summary{min-width:44px;min-height:44px}
  .navigation{max-height:calc(100svh - 80px);overflow-y:auto;overscroll-behavior:contain}
  .pagetop h1{overflow-wrap:anywhere}
  input,select,textarea{font-size:16px;min-height:44px}
}

/* Show the complete landscape film, followed by readable text and controls. */
@media(max-width:580px){
  .topline .wrap{min-height:26px;justify-content:flex-end}
  .topline .wrap>span{display:none}
  .topline .toplinks a{font-size:.75rem;line-height:26px}
  .navwrap{height:64px;gap:8px}
  .navigation{top:64px;max-height:calc(100svh - 64px)}
  .menubtn{padding:8px 10px}
  .language-switcher summary{padding:8px}
  .brand img{width:124px}
  .originalhero{height:auto;min-height:0;max-height:none;overflow:visible;background:#0b2842}
  .originalslide:not([hidden]){position:relative;inset:auto}
  .originalslide video{position:relative;inset:auto;display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;background:#020912}
  .originalcopy,html[dir=rtl] .originalcopy{position:static;width:100%;height:auto;padding:14px 20px 16px;background:#0b2842}
  .originalcopy h1,.originalcopy h2,html[dir=rtl] .originalcopy h1,html[dir=rtl] .originalcopy h2{font-size:clamp(1.55rem,6.7vw,2rem);line-height:1.25;margin:0 0 8px;text-shadow:none;overflow-wrap:break-word}
  .originalcopy p{font-size:.9rem;line-height:1.5;margin:0 0 12px;max-width:none;text-shadow:none}
  .originalcopy .button{min-height:44px;padding:9px 16px;font-size:.85rem}
  .originalcontrols{position:static;inset:auto;gap:12px;padding:0 20px 14px;flex-wrap:wrap}
  .slidebuttons{gap:8px}
  .slidebuttons button{width:44px;height:44px}
  .videotoggle{min-height:44px;padding:8px 14px;font-size:.8rem}
  .originaldown{display:none}
  .videostatus,html[dir=rtl] .videostatus{position:static;margin:0;padding:0 20px 14px;max-width:none}
  .client-strip{height:auto;min-height:104px;padding:6px 0 10px}
  .client-heading{margin-bottom:0}
  .client-toggle{width:44px;height:44px}
  .client-item{width:120px;height:44px}
  .client-item img{width:120px;max-width:120px;height:38px;max-height:38px}
  .client-item.compact img{width:44px;max-width:44px;height:44px;max-height:44px}
  .client-group{gap:30px;padding-inline-end:30px}
  .serviceband{width:100%}
  .banditem{padding:16px 12px;gap:10px}
  .banditem span{overflow-wrap:break-word}
  .section{padding:46px 0}
  .pagetop{padding:22px 0 32px}
  .pagetop h1{font-size:clamp(1.85rem,8vw,2.3rem)}
  .detailphoto,.aboutphoto{height:auto;aspect-ratio:auto;object-fit:contain}
  .featurephoto{min-height:0}
  .featurephoto img{position:static;width:100%;height:auto;object-fit:contain}
  .cardimage{aspect-ratio:auto}
  .cardimage img{height:auto;object-fit:contain}
  .newsrow img{height:auto;aspect-ratio:auto;object-fit:contain}
  .sidebar{padding:24px}
}
@media(max-width:350px){
  .brand img{width:108px}
  .navwrap{gap:6px}
  .originalcopy{padding-inline:16px}
  .originalcopy p{font-size:.85rem}
  .originalcontrols{padding-inline:16px}
}
@media(max-width:580px) and (max-height:640px){
  .topline{display:none}
  .originalcopy{padding-top:10px;padding-bottom:10px}
  .originalcopy h1,.originalcopy h2,html[dir=rtl] .originalcopy h1,html[dir=rtl] .originalcopy h2{font-size:1.5rem}
  .client-strip{min-height:96px;padding-top:2px;padding-bottom:6px}
}

/* All services remain reachable by touch, keyboard and reduced-motion users. */
.serviceband{display:block;border:none;padding-top:10px}
.aboutphoto{aspect-ratio:auto;object-fit:contain}
.featurephoto{display:flex;align-items:center;justify-content:center;min-height:0;background:#eef3f7}
img[src="/assets/rov.webp"]{height:auto;aspect-ratio:auto;object-fit:contain}
.featurephoto img[src="/assets/rov.webp"]{position:static;width:100%;height:auto;object-fit:contain}
.cardimage:has(img[src="/assets/rov.webp"]){aspect-ratio:auto}
.serviceband-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 14px 8px}
.serviceband-heading h2{margin:0;font-size:.8rem;font-weight:600;color:#466376}
.service-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #cbd6df;background:white;color:#274f6c}
.service-window{width:100%;overflow-x:auto;overflow-y:hidden;direction:ltr;scrollbar-width:thin;scrollbar-color:#a2c9dc #f5f9fb;overscroll-behavior-x:contain;border:1px solid #dce5ec;border-radius:6px}
@supports selector(::-webkit-scrollbar){
  .service-window{scrollbar-width:auto;scrollbar-color:auto}
  .service-window::-webkit-scrollbar{height:5px}
  .service-window::-webkit-scrollbar-track{background:#f5f9fb;border-radius:999px;margin-inline:14px}
  .service-window::-webkit-scrollbar-thumb{background:#a2c9dc;border-radius:999px}
  .service-window::-webkit-scrollbar-thumb:hover{background:#629fbf}
  .service-window::-webkit-scrollbar-button{display:none;width:0;height:0}
  .service-window::-webkit-scrollbar-corner{background:transparent}
}
.service-track,.service-group{display:flex;width:max-content;direction:ltr}
.service-group{flex-shrink:0}
.serviceband .banditem{width:280px;min-height:128px;flex-shrink:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:9px;padding:20px 24px;border:0;border-inline-end:1px solid #dce5ec}
.serviceband .banditem b{font-size:1rem;line-height:1.35;color:#087bc1}
.serviceband .banditem span{font-size:.9rem;line-height:1.5;overflow-wrap:normal}
html[dir=rtl] .serviceband .banditem{direction:rtl;text-align:right}
@media(max-width:580px){.serviceband .banditem{width:250px;min-height:120px;padding:18px 20px}}
@media(prefers-reduced-motion:reduce){.service-group[aria-hidden=true],.service-toggle{display:none}}
