/* Service-specific cloud architecture animations */
.vx-visual{--vx:#39e4ef;--vx2:#a28bff;position:relative;min-height:410px;border:1px solid rgba(75,207,226,.24);border-radius:20px;background:radial-gradient(ellipse at 50% 50%,rgba(34,119,165,.16),transparent 62%),linear-gradient(145deg,#0b1c2c,#070f1c);isolation:isolate}
.vx-topline,.vx-bottomline{position:absolute;left:17px;right:17px;display:flex;justify-content:space-between;gap:10px;font:9px "DM Mono",monospace;letter-spacing:.12em;color:#7fa8bc}.vx-topline{top:16px}.vx-topline b{color:var(--vx);font-weight:500;text-align:right}.vx-bottomline{bottom:14px;font-size:8px;opacity:.7}
.vx-circuit{position:absolute;inset:15% 7%;background-image:linear-gradient(90deg,transparent 49.7%,rgba(75,207,226,.12) 50%,transparent 50.3%),linear-gradient(transparent 49.7%,rgba(75,207,226,.12) 50%,transparent 50.3%);background-size:44px 44px;mask-image:radial-gradient(ellipse,#000,transparent 72%)}
.vx-node{position:absolute;z-index:4;min-width:128px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--vx),transparent 55%);border-radius:9px;background:rgba(5,19,32,.94);box-shadow:0 0 20px color-mix(in srgb,var(--vx),transparent 88%);animation:vxHover 4.8s ease-in-out infinite}
.vx-node small{display:block;color:var(--vx);font:8px "DM Mono",monospace;letter-spacing:.1em}.vx-node b{display:block;font-size:10px;margin-top:3px}.vx-node:nth-of-type(4){top:20%;left:4%}.vx-node:nth-of-type(5){top:20%;right:4%;animation-delay:-1.2s}.vx-node:nth-of-type(6){bottom:20%;left:4%;animation-delay:-2.2s}.vx-node:nth-of-type(7){bottom:20%;right:4%;animation-delay:-.7s}
@keyframes vxHover{0%,100%{translate:0 0}50%{translate:0 -7px}}
/* AWS: layered infrastructure stack with amber compute glow */
.aws-stack{--vx:#ffad45;--vx2:#f06e35}.vx-stack{position:absolute;left:50%;top:52%;width:180px;height:190px;transform:translate(-50%,-50%);display:flex;align-items:center;flex-direction:column;justify-content:center;gap:5px;perspective:600px}.vx-cloud{font-size:24px;font-weight:800;color:#ffbf69;text-shadow:0 0 20px #ff8b28}.vx-layer{width:150px;padding:9px;text-align:center;border:1px solid #ff9c3e;background:linear-gradient(90deg,#422512,#182233);font:9px "DM Mono",monospace;box-shadow:0 8px 24px #ff8b2825;transform:rotateX(48deg);animation:awsLayer 3.5s ease-in-out infinite}.layer-2{animation-delay:-1s}.layer-3{animation-delay:-2s}.vx-platform{color:#ffbf69;font:8px "DM Mono",monospace;margin-top:5px}@keyframes awsLayer{50%{transform:translateY(-7px) rotateX(48deg);box-shadow:0 12px 30px #ff8b2850}}
/* Azure: hexagonal identity and workload mesh */
.azure-mesh{--vx:#57aaff;--vx2:#7b8cff}.vx-azure-core{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:120px;height:120px;border-radius:28px;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#123d69,#101c42);border:1px solid #56aaff;box-shadow:0 0 55px #2589ff55;animation:azurePulse 4s ease-in-out infinite}.azure-mark{font-size:44px;font-weight:800;color:#7dc8ff}.vx-azure-core b{font-size:12px}.vx-azure-core small{font:8px "DM Mono",monospace;color:#8bcaff}@keyframes azurePulse{50%{box-shadow:0 0 85px #2589ff88;scale:1.06}}.vx-hex{position:absolute;width:72px;height:72px;border:1px solid #60baff;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);animation:hexFloat 5s ease-in-out infinite}.h1{left:34%;top:18%}.h2{right:30%;bottom:18%;animation-delay:-2s}.h3{right:19%;top:26%;animation-delay:-3s}@keyframes hexFloat{50%{transform:translateY(-12px) rotate(30deg);background:#3c9fff18}}
/* Migration: workloads traverse a directional migration track */
.migration-flow{--vx:#b08cff;--vx2:#51dcff}.vx-flowline{position:absolute;left:20%;right:20%;top:49%;height:3px;background:linear-gradient(90deg,#4b9aff,#c28aff,#52e2ef);box-shadow:0 0 18px #7e9fff;animation:flowGlow 3s linear infinite}.vx-flowline i{position:absolute;top:-4px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 0 14px var(--vx);animation:flowDot 3.5s linear infinite}.vx-flowline i:nth-child(2){animation-delay:-.9s}.vx-flowline i:nth-child(3){animation-delay:-1.8s}.vx-flowline i:nth-child(4){animation-delay:-2.7s}.vx-transfer{position:absolute;left:50%;top:38%;font-size:54px;color:var(--vx);transform:translateX(-50%);text-shadow:0 0 24px var(--vx)}@keyframes flowDot{from{left:0;opacity:0}15%{opacity:1}85%{opacity:1}to{left:100%;opacity:0}}@keyframes flowGlow{50%{filter:brightness(1.7)}}
/* Hybrid: pulsing bridge between local data centre and cloud */
.hybrid-bridge{--vx:#50e2d0;--vx2:#7daaff}.vx-bridge{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px}.vx-bridge div{padding:19px 12px;border:1px solid var(--vx);background:#0d2b35;border-radius:10px;font:9px "DM Mono",monospace;text-align:center;box-shadow:0 0 25px #50e2d033}.vx-bridge b{font-size:35px;color:var(--vx);animation:bridgePulse 1.5s ease-in-out infinite}@keyframes bridgePulse{50%{text-shadow:0 0 25px var(--vx);transform:scale(1.2)}}
/* Security: shield and scanning perimeter */
.security-shield{--vx:#57e9c1;--vx2:#54aaff}.vx-shield{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:145px;height:165px;clip-path:polygon(50% 0,93% 17%,86% 70%,50% 100%,14% 70%,7% 17%);background:linear-gradient(145deg,#0f665c,#102a4b);border:0;display:grid;place-content:center;text-align:center;filter:drop-shadow(0 0 24px #37e9bd66);animation:shieldPulse 3s ease-in-out infinite}.vx-shield span{font-size:42px;color:#aaffdf}.vx-shield b{font:11px "DM Mono",monospace;color:#fff}.vx-scan{position:absolute;left:18%;right:18%;top:18%;height:2px;background:#8bffe1;box-shadow:0 0 20px #57e9c1;animation:scanMove 3s ease-in-out infinite}@keyframes shieldPulse{50%{filter:drop-shadow(0 0 45px #37e9bd99);scale:1.04}}@keyframes scanMove{50%{top:78%}}
/* Managed services: live network operations dashboard */
.managed-noc{--vx:#6de4ff;--vx2:#8e9dff}.vx-monitor{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:240px;padding:13px;border:1px solid #5dd9f0;border-radius:10px;background:#071727;box-shadow:0 0 40px #34d9f033}.vx-monitor-head{font:8px "DM Mono",monospace;color:#8cecff}.vx-monitor-head i{float:right;color:#6cffc2;font-style:normal}.vx-chart{height:95px;display:flex;align-items:end;gap:8px;margin-top:16px;border-bottom:1px solid #27516b}.vx-chart i{flex:1;background:linear-gradient(#55e7f3,#3868ba);height:var(--h,50%);animation:chartPulse 1.8s ease-in-out infinite alternate}.vx-chart i:nth-child(2n){--h:70%;animation-delay:-.4s}.vx-chart i:nth-child(3n){--h:38%;animation-delay:-.8s}.vx-pulse{position:absolute;inset:-9px;border:1px solid #6de4ff66;border-radius:14px;animation:nocPulse 2.8s ease-out infinite}@keyframes chartPulse{to{height:88%;opacity:.55}}@keyframes nocPulse{to{transform:scale(1.12);opacity:0}}
/* Backup: mirrored storage volumes and replication cycle */
.backup-recovery{--vx:#6ecbff;--vx2:#9d8bff}.vx-disks{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:14px}.vx-disk{width:74px;height:112px;border:2px solid var(--vx);border-radius:13px;background:linear-gradient(90deg,#0c3851,#11213d);display:flex;flex-direction:column;justify-content:space-evenly;padding:10px;box-shadow:0 0 24px #4bb9ff33;animation:diskLift 3s ease-in-out infinite}.vx-disk i{height:5px;border-radius:50%;background:var(--vx);opacity:.7}.disk-b{animation-delay:-1.5s}.vx-repl{font-size:37px;color:var(--vx);animation:replicate 4s linear infinite}@keyframes diskLift{50%{translate:0 -9px}}@keyframes replicate{to{transform:rotate(360deg)}}
/* DevOps: continuous CI/CD pipeline */
.devops-pipeline{--vx:#bb8cff;--vx2:#5de2f1}.vx-pipeline{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;white-space:nowrap}.vx-pipeline span{padding:12px 9px;border:1px solid var(--vx);border-radius:8px;background:#191635;font:9px "DM Mono",monospace;box-shadow:0 0 20px #ad82ff24}.vx-pipeline b{color:var(--vx);animation:pipeArrow 1s ease-in-out infinite alternate}.vx-pipeline-beam{position:absolute;left:0;right:0;bottom:-13px;height:2px;background:linear-gradient(90deg,transparent,var(--vx),transparent);animation:pipeBeam 2s linear infinite}@keyframes pipeArrow{to{opacity:.25;transform:translateX(4px)}}@keyframes pipeBeam{to{transform:translateX(40px)}}
/* FinOps: live cost curve and utilisation bars */
.finops-dashboard{--vx:#a8ed8b;--vx2:#56d6cb}.vx-finops{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:240px;padding:16px;border:1px solid var(--vx);border-radius:12px;background:#10251f;box-shadow:0 0 40px #82e57b22}.vx-finops-head{font:9px "DM Mono",monospace;color:#d5f6c6}.vx-finops-head b{float:right;color:#9cff84}.vx-bars{height:100px;display:flex;align-items:end;gap:8px;margin:12px 0}.vx-bars i{flex:1;height:var(--bar,60%);background:linear-gradient(#b8f58b,#4cae94);border-radius:3px 3px 0 0;animation:finopsBar 2s ease-in-out infinite alternate}.vx-bars i:nth-child(2n){--bar:40%;animation-delay:-.5s}.vx-bars i:nth-child(3n){--bar:85%;animation-delay:-1s}.vx-finops small{font:8px "DM Mono",monospace;color:#9bc4a1}@keyframes finopsBar{to{height:32%;opacity:.6}}
@media(max-width:700px){.vx-visual{min-height:360px}.vx-node{min-width:106px;padding:8px}.vx-node b{font-size:9px}.vx-stack{scale:.85}.vx-pipeline{scale:.72}.vx-monitor,.vx-finops{scale:.82}.vx-bridge{scale:.82}.vx-disks{scale:.85}}
@media(prefers-reduced-motion:reduce){.vx-visual *{animation:none!important;transition:none!important}}
/* Request-a-survey modal */
.survey-trigger{display:inline-flex;align-items:center;gap:9px;padding:12px 16px;border:1px solid rgba(54,226,237,.55);border-radius:8px;background:linear-gradient(110deg,#36e2ed,#8bd9ff);color:#04121d!important;font-weight:800;text-decoration:none!important;box-shadow:0 0 22px rgba(54,226,237,.12)}
.survey-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:18px}.survey-modal.is-open{display:flex}.survey-backdrop{position:absolute;inset:0;background:rgba(1,7,14,.82);backdrop-filter:blur(8px)}.survey-dialog{position:relative;z-index:1;width:min(680px,100%);max-height:min(92vh,900px);overflow:auto;padding:30px;border:1px solid rgba(54,226,237,.6);border-radius:18px;background:radial-gradient(ellipse at 90% 0,rgba(54,226,237,.14),transparent 45%),linear-gradient(145deg,#0c2134,#07111f);box-shadow:0 20px 90px #000b,0 0 40px #2edce522}.survey-close{position:absolute;right:15px;top:12px;border:0;background:transparent;color:#dffaff;font-size:30px;cursor:pointer}.survey-kicker{font:9px "DM Mono",monospace;letter-spacing:.14em;color:#52e4ec}.survey-dialog h2{font-size:clamp(1.7rem,4vw,2.5rem);letter-spacing:-.05em;margin:8px 35px 8px 0}.survey-intro{color:#a9bfce;font-size:.9rem;max-width:590px}.survey-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}.survey-fields label{display:flex;flex-direction:column;gap:6px;color:#d9eaf1;font-size:.77rem;font-weight:700}.survey-fields input,.survey-fields select,.survey-fields textarea{width:100%;min-width:0;padding:12px;border:1px solid rgba(124,188,213,.28);border-radius:7px;background:#0a1a2b;color:#f4fbff;font:inherit;font-size:.82rem}.survey-fields input::placeholder,.survey-fields textarea::placeholder{color:#738d9f}.survey-fields select option{background:#0a1a2b}.survey-wide{grid-column:1/-1}.survey-submit{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:16px;padding:14px 17px;border:0;border-radius:7px;background:linear-gradient(100deg,#35e4ed,#8ad7ff);color:#03121c;font-weight:900;cursor:pointer}.survey-privacy,.survey-status{font-size:.72rem;color:#8fa7b8}.survey-status{color:#7ff0cb}@media(max-width:580px){.survey-dialog{padding:25px 18px}.survey-fields{grid-template-columns:1fr}.survey-wide{grid-column:auto}}

.vx-node.vx-pos-1{top:19%;left:4%}.vx-node.vx-pos-2{top:19%;right:4%;animation-delay:-1.2s}.vx-node.vx-pos-3{bottom:19%;left:4%;animation-delay:-2.2s}.vx-node.vx-pos-4{bottom:19%;right:4%;animation-delay:-.7s}
@media(max-width:700px){.vx-node.vx-pos-1{top:18%;left:2%}.vx-node.vx-pos-2{top:18%;right:2%}.vx-node.vx-pos-3{bottom:18%;left:2%}.vx-node.vx-pos-4{bottom:18%;right:2%}}

.cloud-breadcrumb{display:flex;align-items:center;gap:9px;padding-top:16px;padding-bottom:0;color:#7895a8;font-size:.72rem}.cloud-breadcrumb a{color:#7edce6;text-decoration:none}.cloud-breadcrumb a:hover{text-decoration:underline}.cloud-breadcrumb span[aria-current]{color:#c4d6df}

/* Distinct page compositions: each service page has its own visual language and accent. */
.page-aws{--page-accent:#ffad45;--page-glow:rgba(255,151,51,.12)}
.page-azure{--page-accent:#63adff;--page-glow:rgba(61,143,255,.14)}
.page-migration{--page-accent:#b58cff;--page-glow:rgba(157,113,255,.14)}
.page-hybrid{--page-accent:#4ce1c9;--page-glow:rgba(53,215,185,.12)}
.page-security{--page-accent:#65edbd;--page-glow:rgba(57,229,173,.13)}
.page-managed{--page-accent:#68dcff;--page-glow:rgba(68,198,255,.13)}
.page-backup{--page-accent:#70baff;--page-glow:rgba(67,143,255,.13)}
.page-devops{--page-accent:#c28cff;--page-glow:rgba(170,105,255,.14)}
.page-finops{--page-accent:#b6ed83;--page-glow:rgba(131,222,101,.13)}
[class^="page-"] .p-hero:before{background:linear-gradient(90deg,rgba(5,11,20,.98),rgba(5,11,20,.76) 65%,rgba(5,11,20,.42)),radial-gradient(circle at 80% 40%,var(--page-glow),transparent 42%)}
[class^="page-"] .p-kicker{color:var(--page-accent)}
[class^="page-"] .p-card{border-color:color-mix(in srgb,var(--page-accent),transparent 82%)}
[class^="page-"] .p-card:hover{border-color:color-mix(in srgb,var(--page-accent),transparent 40%);box-shadow:0 16px 42px var(--page-glow)}
[class^="page-"] .p-icon{color:var(--page-accent);border-color:color-mix(in srgb,var(--page-accent),transparent 65%);background:var(--page-glow)}
[class^="page-"] .p-step{border-color:var(--page-accent)}
[class^="page-"] .p-callout{border-color:color-mix(in srgb,var(--page-accent),transparent 65%);background:radial-gradient(ellipse at 90% 0,var(--page-glow),transparent 52%),linear-gradient(120deg,#0d2539,#111a35)}
[class^="page-"] .p-btn{background:linear-gradient(110deg,var(--page-accent),#e8f7ff)}
.page-aws .p-grid:not(.two){grid-template-columns:repeat(2,minmax(0,1fr))}
.page-aws .p-card{border-radius:8px;background:linear-gradient(140deg,#2b2016,#0a1725)}
.page-azure .p-card{border-radius:5px;border-top:2px solid var(--page-accent);background:linear-gradient(180deg,#102747,#081525)}
.page-migration .p-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative}
.page-migration .p-step{position:relative;padding:22px 14px 18px;border:1px solid rgba(181,140,255,.2);background:linear-gradient(145deg,#211a3b,#0b1829);border-radius:0}
.page-migration .p-step:not(:last-child):after{content:"➜";position:absolute;right:-12px;top:22px;z-index:2;color:var(--page-accent)}
.page-hybrid .p-grid:not(.two){grid-template-columns:repeat(2,minmax(0,1fr))}
.page-hybrid .p-card{border-radius:30px 8px 30px 8px;background:linear-gradient(135deg,#0d3034,#0b1b2a)}
.page-security .p-grid:not(.two){grid-template-columns:repeat(2,minmax(0,1fr))}
.page-security .p-card{border-left:3px solid var(--page-accent);border-radius:4px 14px 14px 4px}
.page-managed .p-card{border-radius:10px;background:linear-gradient(150deg,#0d2b40,#081725)}
.page-managed .p-grid:not(.two) .p-card:nth-child(1){grid-column:span 2}
.page-backup .p-card{border-radius:12px 12px 12px 2px;border-bottom:3px solid var(--page-accent)}
.page-devops .p-steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-devops .p-step{border:1px solid rgba(194,140,255,.28);border-radius:12px;background:linear-gradient(145deg,#251b3d,#0a1728)}
.page-finops .p-grid:not(.two){grid-template-columns:repeat(4,minmax(0,1fr))}
.page-finops .p-card{border-radius:5px 5px 16px 16px;background:linear-gradient(180deg,#122c24,#081a1d);border-bottom:3px solid var(--page-accent)}
@media(max-width:900px){.page-finops .p-grid:not(.two){grid-template-columns:repeat(2,minmax(0,1fr))}.page-migration .p-steps,.page-devops .p-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.page-aws .p-grid:not(.two),.page-hybrid .p-grid:not(.two),.page-security .p-grid:not(.two),.page-finops .p-grid:not(.two){grid-template-columns:1fr}.page-managed .p-grid:not(.two) .p-card:nth-child(1){grid-column:auto}.page-migration .p-steps,.page-devops .p-steps{grid-template-columns:1fr 1fr}.page-migration .p-step:not(:last-child):after{display:none}}

.survey-submit:disabled{opacity:.65;cursor:wait}.survey-status.is-success{color:#78f0bd}.survey-status.is-error{color:#ff9b9b}