.pt-overlay{position:fixed;inset:0;z-index:99999;pointer-events:none;overflow:hidden}
.pt-overlay.is-active{pointer-events:all}
.pt-shape{position:absolute}
.pt-mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0;text-align:center;white-space:nowrap;transition:opacity .4s .45s;z-index:2}
.pt-overlay.is-active .pt-mark{opacity:1}

/* generic — used when Jarvis navigates from a page without its own themed variant */
.pt-home .pt-shape,.pt-generic .pt-shape{position:absolute;inset:0;background:#111;clip-path:circle(0% at 50% 50%);transition:clip-path .85s cubic-bezier(.76,0,.24,1)}
.pt-home.is-active .pt-shape,.pt-generic.is-active .pt-shape{clip-path:circle(150% at 50% 50%)}
.pt-home .pt-mark,.pt-generic .pt-mark{color:#fff;font:400 13px/1 "DM Sans",Arial,sans-serif;letter-spacing:.4em}

/* about — minimal dark iris */
.pt-about .pt-shape{position:absolute;inset:0;background:#111;clip-path:circle(0% at 50% 50%);transition:clip-path .85s cubic-bezier(.76,0,.24,1)}
.pt-about.is-active .pt-shape{clip-path:circle(150% at 50% 50%)}
.pt-about .pt-mark{color:#fff;font:400 13px/1 "DM Sans",Arial,sans-serif;letter-spacing:.4em}

/* approach — graph node collapsing to a point, then flooding out */
.pt-approach .pt-shape{position:absolute;left:50%;top:50%;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;background:#111;transform:scale(0);transition:transform .85s cubic-bezier(.6,0,.2,1)}
.pt-approach.is-active .pt-shape{transform:scale(60)}
.pt-approach .pt-mark{color:#fff;font:400 12px/1 "DM Sans",Arial,sans-serif;letter-spacing:.3em}

/* business-challenges — diagnostic bar filling to 100% */
.pt-diagnostic .pt-shape{position:absolute;inset:0;background:#111;transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.76,0,.24,1)}
.pt-diagnostic.is-active .pt-shape{transform:scaleX(1)}
.pt-diagnostic .pt-mark{color:#fff;font:500 11px/1 "IBM Plex Mono",monospace;letter-spacing:.25em}

/* capabilities — 10-direction color wheel iris */
.pt-capabilities .pt-shape{position:absolute;inset:0;background:conic-gradient(from 0deg,#ff285f,#5a2dff,#ff4a34,#181818,#ff285f);clip-path:circle(0% at 50% 50%);transition:clip-path .9s cubic-bezier(.76,0,.24,1)}
.pt-capabilities.is-active .pt-shape{clip-path:circle(145% at 50% 50%)}
.pt-capabilities .pt-mark{background:#111;color:#fff;padding:10px 22px;border-radius:999px;font:600 10px/1 "DM Sans",Arial,sans-serif;letter-spacing:.25em}

/* careers — letter flap unfolding, wax seal mark */
.pt-careers .pt-shape{position:absolute;inset:0;background:#e8e5de;clip-path:polygon(0 0,100% 0,100% 0,0 0);transition:clip-path .85s cubic-bezier(.76,0,.24,1)}
.pt-careers.is-active .pt-shape{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.pt-careers .pt-mark{width:72px;height:72px;border-radius:50%;background:#211c19;color:#e8e5de;display:flex;align-items:center;justify-content:center;font:15px/1 Georgia,serif;white-space:normal}

/* contacts — blueprint grid wipe with accent edge */
.pt-contacts .pt-shape{position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fff calc(100% - 4px),#4ebf78 calc(100% - 4px),#4ebf78 100%);background-image:linear-gradient(90deg,#fff 0%,#fff calc(100% - 4px),#4ebf78 calc(100% - 4px),#4ebf78 100%),linear-gradient(#f0f0ee 1px,transparent 1px),linear-gradient(90deg,#f0f0ee 1px,transparent 1px);background-size:100% 100%,36px 36px,36px 36px;transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.76,0,.24,1)}
.pt-contacts.is-active .pt-shape{transform:scaleX(1)}
.pt-contacts .pt-mark{color:#111;font:600 11px/1 "DM Sans",Arial,sans-serif;letter-spacing:.25em}

/* faq — mail closing, envelope slides down */
.pt-faq .pt-shape{position:absolute;inset:0;background:#111;transform:translateY(-100%);transition:transform .8s cubic-bezier(.76,0,.24,1)}
.pt-faq.is-active .pt-shape{transform:translateY(0)}
.pt-faq .pt-mark{color:#fff;font:400 12px/1 "DM Sans",Arial,sans-serif;letter-spacing:.3em}

/* industries — terminal block cursor, stepped reveal */
.pt-industries .pt-shape{position:absolute;left:0;top:0;width:0;height:100%;background:#1e1e1e;transition:width .8s steps(14,end)}
.pt-industries.is-active .pt-shape{width:100%}
.pt-industries .pt-mark{color:#4ec9b0;font:400 13px/1 "SF Mono",Menlo,monospace;letter-spacing:.05em}

/* ai-automation — radial pulse iris */
.pt-ai .pt-shape{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#8ba8ff 0%,#000 60%);clip-path:circle(0% at 50% 50%);transition:clip-path .9s cubic-bezier(.76,0,.24,1)}
.pt-ai.is-active .pt-shape{clip-path:circle(150% at 50% 50%)}
.pt-ai .pt-mark{color:#fff;font:400 12px/1 "IBM Plex Mono",monospace;letter-spacing:.2em}

/* brand-design — yellow identity block rotating in */
.pt-brand .pt-shape{position:absolute;inset:0;background:#ffdc4d;transform:scale(0) rotate(-12deg);transition:transform .8s cubic-bezier(.34,1.56,.64,1)}
.pt-brand.is-active .pt-shape{transform:scale(1.4) rotate(0deg)}
.pt-brand .pt-mark{font:italic 700 72px Georgia,serif;color:#2e1110}

/* cloud-devops — night sky slide with starfield */
.pt-cloud .pt-shape{position:absolute;inset:0;background:#0b1020;transform:translateY(100%);transition:transform .85s cubic-bezier(.76,0,.24,1)}
.pt-cloud .pt-shape:before{content:"";position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 70% 60%,#fff,transparent),radial-gradient(1px 1px at 40% 80%,#fff,transparent),radial-gradient(1px 1px at 85% 20%,#fff,transparent),radial-gradient(1px 1px at 55% 45%,#fff,transparent);opacity:.7}
.pt-cloud.is-active .pt-shape{transform:translateY(0)}
.pt-cloud .pt-mark{color:#4ec9b0;font:400 12px/1 "IBM Plex Mono",monospace;letter-spacing:.15em}

/* editorial-content — page corner unfolding from top right */
.pt-editorial .pt-shape{position:absolute;top:0;right:0;width:0;height:0;background:#eee7d9;clip-path:polygon(100% 0,100% 100%,0 100%);transition:width .85s cubic-bezier(.76,0,.24,1),height .85s cubic-bezier(.76,0,.24,1)}
.pt-editorial.is-active .pt-shape{width:200%;height:200%}
.pt-editorial .pt-mark{color:#1f1b17;font:italic 400 15px/1 "DM Serif Display",Georgia,serif;letter-spacing:.08em}

/* horeca — warm oval iris */
.pt-horeca .pt-shape{position:absolute;inset:0;background:#6f251d;clip-path:ellipse(0% 0% at 50% 50%);transition:clip-path .85s cubic-bezier(.76,0,.24,1)}
.pt-horeca.is-active .pt-shape{clip-path:ellipse(150% 150% at 50% 50%)}
.pt-horeca .pt-mark{color:#f4e9d8;font:italic 400 14px/1 Georgia,serif;letter-spacing:.15em}

/* mobile-apps — phone sheet sliding up */
.pt-mobile .pt-shape{position:absolute;left:50%;bottom:-10%;width:70%;height:0;margin-left:-35%;background:#dfff36;border-radius:40px 40px 0 0;transition:height .95s cubic-bezier(.76,0,.24,1),border-radius .95s}
.pt-mobile.is-active .pt-shape{height:130%;border-radius:0}
.pt-mobile .pt-mark{color:#111;font:700 12px/1 "DM Sans",Arial,sans-serif;letter-spacing:.2em}

/* motion-content — film frame wipe */
.pt-motion .pt-shape{position:absolute;inset:0;background:#5b37ff;transform:scaleY(0);transition:transform .8s cubic-bezier(.76,0,.24,1)}
.pt-motion.is-active .pt-shape{transform:scaleY(1)}
.pt-motion .pt-mark{color:#fff;font:400 12px/1 "IBM Plex Mono",monospace;letter-spacing:.1em}

/* security — radar circle with sweeping scan */
.pt-security .pt-shape{position:absolute;inset:0;background:#f3f4f2;clip-path:circle(0% at 50% 50%);transition:clip-path .85s cubic-bezier(.76,0,.24,1)}
.pt-security .pt-shape:after{content:"";position:absolute;inset:0;background:conic-gradient(from 0deg,rgba(34,211,166,.45),transparent 40%);opacity:0}
.pt-security.is-active .pt-shape{clip-path:circle(150% at 50% 50%)}
.pt-security.is-active .pt-shape:after{opacity:1;animation:ptRadarSpin 1.4s linear infinite}
@keyframes ptRadarSpin{to{transform:rotate(360deg)}}
.pt-security .pt-mark{color:#111;font:400 12px/1 "IBM Plex Mono",monospace;letter-spacing:.2em}

/* websites — lab scan-line wipe */
.pt-websites .pt-shape{position:absolute;inset:0;background:linear-gradient(90deg,#082d24 0%,#082d24 calc(100% - 3px),#7cffcb calc(100% - 3px),#7cffcb 100%);transform:translateX(-100%);transition:transform .8s cubic-bezier(.76,0,.24,1)}
.pt-websites.is-active .pt-shape{transform:translateX(0)}
.pt-websites .pt-mark{color:#7cffcb;font:400 12px/1 "IBM Plex Mono",monospace;letter-spacing:.15em}

@media (max-width:650px){
  .pt-capabilities .pt-mark{font-size:9px;padding:8px 16px}
  .pt-brand .pt-mark{font-size:52px}
  .pt-careers .pt-mark{width:58px;height:58px;font-size:13px}
}
@media (prefers-reduced-motion: reduce){
  .pt-overlay *{transition:none!important;animation:none!important}
}