/* Capabilities uses the approved plate once; overlays describe its real architecture. */
.capabilities-layer{visibility:hidden;position:absolute;inset:0;z-index:8;pointer-events:none;overflow:visible}
.capabilities-layer.is-positioned{visibility:visible}
.capabilities-layer[hidden]{display:none}.capabilities-cards{display:contents}
.capability-card{position:absolute;padding:15px 17px 12px;background:linear-gradient(125deg,#0b1e2af5,#071620eb);border:1px solid #56717d80;border-radius:3px;color:#eef2ee;pointer-events:auto;box-shadow:0 6px 22px #00000026;transition:border-color .22s,background-color .22s}
.capability-card:before{content:'';position:absolute;top:31px;width:18px;height:1px;background:#a78962;opacity:.75;right:-19px}
.capability-card[data-service="ai"]:before,.capability-card[data-service="software"]:before{right:auto;left:-19px}
.capability-select{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer;font:inherit;font-size:clamp(15px,.94vw,24px);font-weight:550;line-height:1.2}
.capability-select svg{width:22px;height:24px;flex:none;fill:none;stroke:#ffac70;stroke-width:1.2;stroke-linejoin:round;stroke-linecap:round}
.capability-card p{font-size:clamp(12px,.72vw,19px);line-height:1.45;color:#bcced6;max-width:29ch;margin:5px 0 10px}
.capability-action{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px;color:#e6c4a6;font-size:clamp(11px,.65vw,17px);text-decoration:none;border-top:1px solid #52708055;padding-top:6px}
.capability-action span{color:#ffa868;font-size:18px}
.capability-card.is-selected,.capability-card:focus-within{border-color:#ffa364;background:#102735;box-shadow:0 0 0 1px #ff9b4226}
.capability-card.is-selected .capability-action,.capability-card:focus-within .capability-action{color:#fff}
.capability-select:focus-visible,.capability-action:focus-visible{outline:2px solid #ffb270;outline-offset:4px;border-radius:2px}
.capability-shading{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;display:none;opacity:1}
.capabilities-mode .capability-shading{display:block;animation:capability-environment 1s ease-out both}.capability-environment-dim{opacity:1}
.capability-activations{display:none;pointer-events:none;fill:none;stroke:#ffcb95;stroke-width:2.4;stroke-linecap:round}
.capabilities-mode .capability-activations{display:block}.capability-activation-pulse{stroke-dasharray:.07 .93;stroke-dashoffset:1;opacity:0}
.capabilities-mode .city-extensions{z-index:3}.capabilities-mode .city-canvas{translate:var(--cap-fitx,0px) calc(-1 * var(--cap-pan,0px))}
.capabilities-active .story-copy{pointer-events:none}.architecture-story.capabilities-active .story-copy{width:31%;max-width:600px;top:12%}
.architecture-story.capabilities-active .story-copy h1{font-size:clamp(31px,2.75vw,68px);line-height:1.12;letter-spacing:-.035em;white-space:pre-line;margin-bottom:19px}
.capabilities-active .story-kicker,.capabilities-active .story-description,.capabilities-active #story-cta{display:none}
.architecture-story.capabilities-active .story-line{font-size:clamp(14px,.93vw,24px);color:#c0d1da;line-height:1.55;max-width:40ch;margin:0}
@media(min-width:2400px){.capability-card{padding:20px 24px 16px}.capability-select{min-height:56px;gap:16px}.capability-select svg{width:30px;height:32px}.capability-card p{margin:10px 0 16px}.capability-action{min-height:44px;padding-top:10px}}
@media(max-width:1100px){
 .architecture-story.capabilities-active .story-copy{top:24px;left:24px;width:calc(100% - 48px);max-width:none;transform:translateY(calc(-1 * var(--cap-pan,0px)))}
 .architecture-story.capabilities-active .story-copy h1{font-size:clamp(27px,4vw,39px);max-width:600px;line-height:1.12;margin-bottom:12px}
 .architecture-story.capabilities-active .story-line{font-size:13px;max-width:510px;line-height:1.45}
 .capabilities-cards{position:absolute;display:grid;grid-template-columns:1fr 1fr;gap:10px;pointer-events:none}
 .capability-card{position:relative;width:auto;padding:9px 11px 7px;box-shadow:none}
 .capability-card:before{display:none}.capability-select{font-size:13px;gap:7px;min-height:44px}.capability-select svg{width:18px;height:20px}
 .capability-card p{font-size:11px;line-height:1.35;margin:3px 0 6px}.capability-action{min-height:44px;font-size:10px;padding-top:4px}
 .capabilities-mode .city-canvas{mask-image:linear-gradient(transparent,#000 4%,#000 77%,transparent 96%)}
 .capabilities-mode .city-service-link{pointer-events:none}
}
@media(min-width:701px) and (max-width:1100px) and (min-height:700px){.capability-card{padding:14px 18px}.capability-select{font-size:18px;gap:12px}.capability-card p{font-size:14px}.capability-action{font-size:12px;min-height:40px}}
@media(max-width:1100px) and (max-height:650px) and (min-aspect-ratio:4/3){.architecture-story.capabilities-active .story-copy{width:45%;top:20px}.architecture-story.capabilities-active .story-copy h1{font-size:24px}.architecture-story.capabilities-active .story-line{font-size:12px}.capabilities-mode .city-canvas{mask-image:linear-gradient(#000 0%,#000 80%,transparent 99%)}}

@media(max-width:1100px){.capabilities-active .story-navigation{background:linear-gradient(#06131ef5,#06131e)}}
@media(max-width:1100px) and (max-height:650px) and (min-aspect-ratio:4/3){.capabilities-mode .city-canvas{mask-image:linear-gradient(90deg,transparent,#000 12%,#000 98%)}}

@keyframes capability-environment{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.capability-shading{animation:none!important}}
/* Only the animated signal layer is 25% thicker; the architecture and hero are untouched. */
.capabilities-mode .city-data-fiber{stroke-width:.625}
.capabilities-mode .city-data-outbound{stroke-width:2;stroke-dasharray:.055 1.025;filter:drop-shadow(0 0 1px #ffa25b)}
.capabilities-mode .city-data-return{stroke-width:1.75;stroke-dasharray:.055 1.025;filter:drop-shadow(0 0 1px #ffa25b)}
.capabilities-mode .city-data-outbound.is-secondary,.capabilities-mode .city-data-return.is-secondary{stroke-width:.75;stroke-dasharray:.03 1.05}
.capabilities-mode .city-arrival,.capabilities-mode .city-facade-response{stroke-width:1}
.capabilities-mode .capability-activations{stroke-width:3}
.cinematic-city.capabilities-mode[data-selected]:not([data-selected=""]) .city-flow{--connection-intensity:.7}
.cinematic-city.capabilities-mode[data-selected="digital"] .city-flow[data-destination="digital"],.cinematic-city.capabilities-mode[data-selected="process"] .city-flow[data-destination="process"],.cinematic-city.capabilities-mode[data-selected="software"] .city-flow[data-destination="software"],.cinematic-city.capabilities-mode[data-selected="ai"] .city-flow[data-destination="ai"]{--connection-intensity:1.65}
.capability-emitter{display:none;position:absolute;z-index:2;pointer-events:none;mix-blend-mode:screen}
@supports(mix-blend-mode:plus-lighter){.capability-emitter{mix-blend-mode:plus-lighter}}
.capabilities-mode .capability-emitter{display:block}
.architecture-story .world .capability-emission{position:absolute;inset:0;left:0;top:0;width:100%;height:100%;object-fit:fill;opacity:1;mask-image:none;pointer-events:none;transition:none}
@media(max-width:700px){.capabilities-mode .city-data-fiber{stroke-width:.6875}.capabilities-mode .city-data-outbound,.capabilities-mode .city-data-return{stroke-width:1.5;filter:none}.capabilities-mode .city-data-outbound.is-secondary,.capabilities-mode .city-data-return.is-secondary{stroke-width:.75}}
@media(prefers-reduced-motion:reduce){.capability-activation-pulse{display:none}}

@media(prefers-reduced-motion:reduce){.capability-card{transition:none}}

.capabilities-layer.is-awaiting-activation .capability-card{opacity:0;pointer-events:none}
/* Very small phones: keep the heading and explanation compact so they fit with the cards. */
@media(max-width:340px){.architecture-story.capabilities-active .story-copy h1{font-size:22px;margin-bottom:6px}.architecture-story.capabilities-active .story-copy .story-description,.architecture-story.capabilities-active .story-copy .story-line{font-size:11px;line-height:1.35}}