/* Vision Pro · Consolidated production enhancements · 2026 */
:root { --vpc-echo-duration: 12s; --vpc-echo-strength: .67; }
html[data-vpc-motion-speed="slow"] { --vpc-echo-duration:20s; }
html[data-vpc-motion-speed="normal"] { --vpc-echo-duration:14s; }
html[data-vpc-motion-speed="lively"] { --vpc-echo-duration:10s; }
html[data-vpc-motion-intensity="subtle"] { --vpc-echo-strength:.39; }
html[data-vpc-motion-intensity="balanced"] { --vpc-echo-strength:.70; }
html[data-vpc-motion-intensity="vivid"] { --vpc-echo-strength:.90; }
/* More visible Aurora / gentle echo, rather than opaque floating balls. */
.hero, .projects-hero, .team-section { position:relative; isolation:isolate; }
.team-section{overflow:hidden;}
.hero::before, .projects-hero::before, .team-section::before {
  content:""; position:absolute; inset:-12% -8%; pointer-events:none; z-index:0;
  background: radial-gradient(ellipse 45% 47% at 17% 30%, rgba(0,212,255,.26),transparent 74%),
    radial-gradient(ellipse 38% 43% at 72% 22%, rgba(63,104,255,.35),transparent 75%),
    radial-gradient(ellipse 43% 45% at 76% 75%, rgba(199,40,211,.24),transparent 72%),
    radial-gradient(ellipse 33% 32% at 32% 85%, rgba(255,81,123,.16),transparent 74%);
  opacity:var(--vpc-echo-strength); filter:blur(24px); transform:translate3d(0,0,0);
  animation:vpcAurora var(--vpc-echo-duration) ease-in-out infinite alternate;
}
.hero::after,.projects-hero::after {content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 background: radial-gradient(ellipse 35% 30% at 75% 55%, rgba(48,153,255,.13),transparent 75%);
 animation:vpcEcho calc(var(--vpc-echo-duration) * 1.2) ease-in-out infinite alternate;}
.hero > .container, .projects-hero > .container, .team-section > .container{position:relative;z-index:1;}
.hero .glass-orb,.projects-hero .glass-orb {opacity:.14;filter:blur(12px);}
@keyframes vpcAurora {0%{transform:translate3d(-2%,-2%,0) rotate(-3deg) scale(1)}50%{transform:translate3d(5%,3%,0) rotate(3deg) scale(1.14)}100%{transform:translate3d(-3%,5%,0) rotate(-4deg) scale(1.04)}}
@keyframes vpcEcho{from{opacity:.25;transform:scale(.86)}to{opacity:.9;transform:scale(1.2)}}
html[data-vpc-motion="off"] .hero::before,html[data-vpc-motion="off"] .hero::after,
html[data-vpc-motion="off"] .projects-hero::before,html[data-vpc-motion="off"] .projects-hero::after,
html[data-vpc-motion="off"] .team-section::before {display:none;}
/* Chronological, horizontal process cards. CMS list order is the visual order. */
.services-cms-section{overflow:visible;position:relative;}
.service-detail {padding:clamp(55px,7vw,100px) 0;}
.service-detail-inner{max-width:1150px;margin-inline:auto;}
.service-detail-heading{max-width:960px;}
.service-detail-heading h2 {font-size:clamp(38px,5vw,68px);line-height:1.02;letter-spacing:-.055em;margin-bottom:14px;}
.service-detail-heading p {color:#aebdd4;max-width:780px;line-height:1.75;}
.service-timeline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;list-style:none;margin:38px 0 0;padding:0;}
.service-step{display:flex;align-items:center;gap:17px;min-height:102px;padding:25px 25px 25px 23px;border:1px solid rgba(141,184,255,.23);border-radius:21px;
  background:linear-gradient(115deg,rgba(18,35,65,.90),rgba(15,17,40,.88));box-shadow:0 16px 40px rgba(0,0,0,.15);color:#f2f6ff;
  animation:vpcFloatSide 9s ease-in-out infinite alternate;transition:transform .28s cubic-bezier(.2,.7,.2,1),border-color .25s,box-shadow .25s,background .25s;position:relative;z-index:1;}
.service-step:nth-child(even){animation-delay:-4.5s;}
.step-marker {width:13px;height:13px;flex:none;border-radius:50%;background:linear-gradient(135deg,#20daff,#7562f1,#df35b6);box-shadow:0 0 0 7px rgba(0,192,244,.08),0 0 25px rgba(54,147,252,.32);}
.step-label{font-size:clamp(15px,1.5vw,18px);font-weight:650;line-height:1.5;letter-spacing:-.015em;}
.service-step:hover,.service-step:focus-within{animation-play-state:paused;transform:scale(1.38) translateX(7px);z-index:5;border-color:rgba(51,203,255,.7);
  background:linear-gradient(120deg,#17375a,#1c214b);box-shadow:0 26px 65px rgba(5,16,36,.7);}
@keyframes vpcFloatSide{from{translate:-5px 0}to{translate:5px 0}}
/* Inline Google map */
.contact-map-card{width:100%;margin:16px 0 2px;overflow:hidden;border:1px solid rgba(118,161,255,.23);border-radius:18px;background:#121b2f;}
.contact-map-card iframe{width:100%;height:240px;border:0;display:block;filter:saturate(.83);}
/* Delicate photo and gallery refinements */
.team-card{transition:transform .3s ease,box-shadow .3s ease,background .3s ease;}
.team-card:hover{box-shadow:0 24px 52px rgba(0,0,0,.3);}
.project-detail-gallery .gallery-item{cursor:zoom-in;}
@media(max-width:900px){.service-timeline{grid-template-columns:1fr}.service-step:hover{transform:scale(1.04)}.contact-map-card iframe{height:215px}}
@media(max-width:560px){.service-step{padding:19px;min-height:84px;animation:none}.service-step:hover{transform:none}.team-card{align-items:start}.hero::before,.projects-hero::before{filter:blur(40px)}}
@media(prefers-reduced-motion:reduce){.hero::before,.hero::after,.projects-hero::before,.projects-hero::after,.team-section::before,.service-step{animation:none!important}.service-step:hover{transform:none!important}}

/* Project photography: accessible enlarged view */
.vpc-photo-viewer{border:1px solid rgba(126,180,255,.38);border-radius:21px;max-width:min(94vw,1180px);max-height:94vh;padding:14px;background:#080f1e;box-shadow:0 35px 110px #000a;color:#fff;}
.vpc-photo-viewer::backdrop{background:rgba(0,5,16,.85);backdrop-filter:blur(9px);}
.vpc-photo-viewer img{max-width:calc(94vw - 30px);max-height:calc(90vh - 90px);display:block;object-fit:contain;margin:auto;border-radius:10px;}
.vpc-photo-viewer-close{display:block;margin:0 0 12px auto;padding:10px 16px;color:#fff;background:#243751;border:1px solid #4b6688;border-radius:12px;cursor:pointer;}
.project-gallery-section .gallery-item img:focus-visible{outline:3px solid #23caff;outline-offset:4px;}


/* ===========================================================
   VISION PRO · REFINED CORPORATE MINIMAL · 2026
   Single-row smaller tiles in every service category; subtle
   moving brand wave. Preserves SQ/EN and CMS fields unchanged.
   =========================================================== */
:root {
  --vpc-cyan: #1d9af2;
  --vpc-blue: #4465dd;
  --vpc-violet: #8555d8;
  --vpc-pink: #c44e9a;
  --vpc-orange: #df8447;
  --vpc-wave-alpha: .40;
  --vpc-wave-duration: 28s;
}
html[data-vpc-motion-intensity="subtle"] { --vpc-wave-alpha: .20; }
html[data-vpc-motion-intensity="balanced"] { --vpc-wave-alpha: .40; }
html[data-vpc-motion-intensity="vivid"] { --vpc-wave-alpha: .58; }
html[data-vpc-motion-speed="slow"] { --vpc-wave-duration: 38s; }
html[data-vpc-motion-speed="normal"] { --vpc-wave-duration: 28s; }
html[data-vpc-motion-speed="lively"] { --vpc-wave-duration: 21s; }

/* Use native cursors: remove animated rings/points which felt distracting. */
.custom-cursor,.cursor-glow{display:none !important;}
body{cursor:auto;}
a,button,.btn,.menu-toggle,[role="button"]{cursor:pointer;}

/* Minimal professional, low contrast: replace old large coloured fog spheres. */
.hero, .projects-hero { background: radial-gradient(ellipse at 74% 46%, rgba(35,59,107,.12), transparent 60%), #090e19; }
.hero-bg .glass-orb, .hero-bg .smoke,
.projects-hero-bg .glass-orb, .projects-hero-bg .smoke,
.hero-bg .hero-grid { display:none !important; }
.hero::before, .projects-hero::before, .team-section::before {
  inset: -8% -12%;
  background: url("assets/images/vpc-subtle-wave.svg") center 52% / 117% auto no-repeat;
  opacity: var(--vpc-wave-alpha);
  filter: none;
  transform:translate3d(-4%, 0, 0);
  animation: vpcCorporateWave var(--vpc-wave-duration) ease-in-out infinite alternate;
  will-change: transform, opacity;
}
.hero::after, .projects-hero::after {
  inset: 0;
  background:radial-gradient(ellipse 30% 40% at 65% 36%, rgba(26,63,125,.085), transparent 84%);
  animation:none;
  opacity:1;
}
.team-section { background:linear-gradient(125deg,#0a1427,#111f42 64%,#10182c); }
.team-section::before { opacity:calc(var(--vpc-wave-alpha) * .40); }
@keyframes vpcCorporateWave {
  0% { transform: translate3d(-5%,1%,0) scale(1.04); opacity:calc(var(--vpc-wave-alpha) * .64); }
  50% { transform: translate3d(1%,-1%,0) scale(1.025); opacity:var(--vpc-wave-alpha); }
  100% { transform: translate3d(5%,1%,0) scale(1.04); opacity:calc(var(--vpc-wave-alpha) * .8); }
}
html[data-vpc-motion="off"] .hero::before,
html[data-vpc-motion="off"] .projects-hero::before,
html[data-vpc-motion="off"] .team-section::before { display:none !important; }

/* Each workflow is ONE horizontal row, including Business, Marketing and Events. */
.services-cms-section { background:#080d18; padding:12px 0 78px; }
.services-cms-section .service-detail { padding:60px 0 55px; border-color:rgba(174,198,249,.09); }
.services-cms-section .service-detail-inner { max-width:1180px; }
.services-cms-section .service-detail-heading h2 {
  font-size:clamp(30px,3.8vw,51px);
  line-height:1.08; letter-spacing:-.045em; margin-bottom:9px;
}
.services-cms-section .service-detail-heading p {
  font-size:15px; line-height:1.55; color:#a6b1c6;
}
.services-cms-section .service-timeline {
  display:flex; flex-flow:row nowrap; align-items:flex-start;
  gap:10px; list-style:none;
  margin:24px -12px 0; padding:18px 12px 24px;
  min-height:205px;
  max-width:none;
  overflow-x:auto; overflow-y:hidden;
  overscroll-behavior-x:contain; scroll-snap-type:x proximity;
  scrollbar-width:thin; scrollbar-color:#354969 transparent;
}
.services-cms-section .service-timeline::-webkit-scrollbar {height:5px;}
.services-cms-section .service-timeline::-webkit-scrollbar-thumb {background:#354969;border-radius:5px;}
.services-cms-section .service-step {
  --tile-accent:#1b99e9; --tile-rgb:27,153,233;
  flex:0 0 126px; width:126px; min-width:0; min-height:139px;
  padding:17px 10px 12px; gap:9px;
  flex-direction:column; justify-content:center; align-items:center;
  text-align:center; position:relative; isolation:isolate;
  border:1px solid rgba(var(--tile-rgb),.26); border-radius:15px;
  background:linear-gradient(160deg,rgba(20,32,54,.88),rgba(9,16,31,.97));
  color:#eaf0fb; box-shadow:0 10px 27px rgba(0,0,0,.10);
  cursor:default; scroll-snap-align:start;
  animation:none; translate:none;
  transition: flex-basis .3s ease, min-height .3s ease,
     border-color .3s ease, background .3s ease, box-shadow .3s ease, transform .3s ease;
}
.services-cms-section .service-step[data-tone="1"] { --tile-accent:#8159db;--tile-rgb:129,89,219; }
.services-cms-section .service-step[data-tone="2"] { --tile-accent:#c553a9;--tile-rgb:197,83,169; }
.services-cms-section .service-step[data-tone="3"] { --tile-accent:#d98347;--tile-rgb:217,131,71; }
.services-cms-section .service-step .step-number {
  position:absolute;right:12px;top:8px;font-size:10px;letter-spacing:.04em;
  color:#7a8aa7;font-variant-numeric:tabular-nums;
}
.services-cms-section .service-step .step-icon {
  width:40px;height:40px;min-height:40px; display:grid;place-items:center;
  border:1px solid rgba(var(--tile-rgb),.58); border-radius:12px;
  background:rgba(var(--tile-rgb),.11);color:var(--tile-accent);
  box-shadow:0 0 15px rgba(var(--tile-rgb),.08);
}
.services-cms-section .service-step .step-icon svg { width:20px;height:20px; }
.services-cms-section .service-step .step-marker {display:none;}
.services-cms-section .service-step .step-label {
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;
  line-clamp:4;overflow:hidden; max-width:100%;
  font-size:11.5px;line-height:1.35;font-weight:570;letter-spacing:-.014em;
  text-wrap:pretty;overflow-wrap:anywhere;
}
@media (hover:hover) and (pointer:fine) {
  .services-cms-section .service-step:hover {
    flex-basis:170px; min-height:171px;
    transform:translateY(-4px);
    border-color:rgba(var(--tile-rgb),.70);
    background:linear-gradient(154deg,rgba(30,50,83,.96),rgba(13,19,37,.98));
    box-shadow:0 14px 30px rgba(0,0,0,.28),0 0 20px rgba(var(--tile-rgb),.11);
  }
  .services-cms-section .service-step:hover .step-icon {width:45px;height:45px;min-height:45px;}
  .services-cms-section .service-step:hover .step-label {
    -webkit-line-clamp:6;line-clamp:6;font-size:12.4px;
  }
}
.services-cms-section .service-step:focus-visible {
  outline:2px solid var(--tile-accent);outline-offset:3px;
  flex-basis:170px;min-height:171px;
  border-color:var(--tile-accent);
}
@media (max-width:700px) {
  .services-cms-section .service-timeline{margin:20px -4vw 0;padding:15px 4vw 22px;min-height:191px;}
  .services-cms-section .service-step{flex-basis:118px;width:118px;min-height:137px;padding:14px 9px 12px;animation:none;}
  .services-cms-section .service-detail{padding:48px 0 38px;}
  .services-cms-section .service-step .step-label{font-size:11px;}
  .hero::before,.projects-hero::before{background-size:auto 93%;}
}
@media (prefers-reduced-motion:reduce) {
  .hero::before,.projects-hero::before,.team-section::before{animation:none!important;}
  .services-cms-section .service-step{animation:none!important;transition:none!important;}
  .services-cms-section .service-step:hover{transform:none!important;}
}

/* VPC Ghost Trail: unobtrusive translucent light behind the normal pointer. */
.vpc-ghost-trail {
  position:fixed; inset:0; display:block; width:100vw; height:100vh;
  pointer-events:none !important; user-select:none; z-index:99997;
  opacity:.86; mix-blend-mode:screen; contain:strict;
}
@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) {
  .vpc-ghost-trail { display:none !important; }
}