/* Approved constellation, scoped to preserve the existing v5 offer layout. */
.operational-areas { position:relative; color:#fff; }
.operational-areas .section-intro h2 { color:#fff; }
.operational-areas .oa-visual {
  position:relative;
  height:clamp(340px,35vw,460px);
  max-width:1040px;
  margin:20px auto 0;
  isolation:isolate;
}
.operational-areas canvas { display:block; width:100%; height:100%; touch-action:pan-y; }
.operational-areas .oa-spheres { position:absolute; inset:0; pointer-events:none; }
.operational-areas button { font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.operational-areas .oa-spheres button {
  position:absolute;
  pointer-events:auto;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:0 0 4px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#a5e6f2;
  font-size:14px;
  font-weight:500;
  line-height:1.3;
  white-space:nowrap;
  transform:translateX(-50%);
  touch-action:manipulation;
}
.operational-areas .oa-spheres button[aria-pressed="true"] { color:#fff; font-weight:600; }
.operational-areas .oa-nav { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); margin:0; }
.operational-areas .oa-nav button {
  min-height:64px;
  padding:14px 6px;
  border:0;
  border-bottom:1px solid rgba(165,204,224,.28);
  background:transparent;
  color:#b5d1df;
  font-size:16px;
  line-height:1.3;
  font-weight:500;
}
.operational-areas .oa-nav button[aria-pressed="true"] { color:#fff; border-bottom:3px solid #ff6b21; }
.operational-areas button:focus-visible { outline:2px solid #ff8a4e; outline-offset:4px; }
.operational-areas .oa-panel { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr); gap:clamp(30px,5vw,70px); padding-top:32px; }
.operational-areas .oa-panel[hidden] { display:none; }
.operational-areas .oa-title { margin:0 0 12px; color:#fff; font-size:clamp(30px,3.3vw,42px); line-height:1.12; letter-spacing:-.04em; }
.operational-areas .oa-tagline { margin:0; max-width:330px; color:#9cdeeb; font-size:clamp(20px,2vw,26px); line-height:1.3; }
.operational-areas .oa-description p { margin:0 0 16px; color:#c1d4df; font-size:17px; line-height:1.65; }
.operational-areas .oa-description p:last-child { margin-bottom:0; }
.operational-areas .oa-divider { margin:36px 0 58px; border:0; border-top:1px solid rgba(165,204,224,.3); }
/* Keep motion control available on keyboard focus, matching the framework. */
.operational-areas .oa-motion:focus-visible { clip:auto; clip-path:none; width:auto; height:auto; bottom:4px; left:8px; z-index:4; padding:10px 14px; border:1px solid #94c4d7; border-radius:4px; background:#102f4a; color:#fff; font-size:14px; }
.operational-areas [data-oa-fallback] { color:#c1d4df; font-size:16px; }
@media(max-width:760px) {
  .operational-areas .oa-visual { height:300px; margin-top:16px; }
  .operational-areas .oa-nav { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .operational-areas .oa-nav button { font-size:14px; min-height:54px; }
  .operational-areas .oa-panel { grid-template-columns:1fr; gap:22px; padding-top:28px; }
  .operational-areas .oa-tagline { max-width:none; }
  .operational-areas .oa-description p { font-size:16px; }
  .operational-areas .oa-divider { margin:32px 0 52px; }
}
@media(max-width:400px) {
  .operational-areas .oa-visual { height:280px; }
  .operational-areas .oa-spheres button { font-size:12px; }
  .operational-areas .oa-nav button { padding-inline:0; font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { .operational-areas * { transition:none!important; } }