/* Purple edition: independent palette, interaction and animated atmosphere. */
:root{--bg:#0a0521;--panel:#15102e;--line:#3a2d60;--text:#e6e6e1;--muted:#b2a8ca;--sage:#b3b2fb;--blue:#d3cee5}
.purple-page{background:#0a0521;color:#e6e6e1;isolation:isolate;--hero-ink:#e6e6e1;--hero-copy:#d3cee5;--hero-accent:#b3b2fb;--hero-detail:#9a92d9}
/* Reference palette: almost-black navy, subdued blue and localized dark violet. */
.ambient-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#0a0521}
.ambient-background:before{content:'';position:absolute;inset:-20%;background:radial-gradient(ellipse at 65% 30%,#160f39 0,transparent 46%),radial-gradient(ellipse at 20% 75%,#050a21 0,transparent 48%);animation:ambient-drift 24s ease-in-out infinite alternate}
.ambient-background:after{display:none}
.ambient-background canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:1}
.purple-page .fixed-header{background:#0a0521b8;border-color:transparent;backdrop-filter:blur(14px)}
.purple-page .portfolio-header{max-width:none;padding:0 clamp(24px,4.7vw,90px);gap:40px}
.purple-page .portfolio-header .brand{color:#e6e6e1;font-size:25px;font-weight:500;letter-spacing:.04em;min-width:170px;gap:12px}
.purple-page .portfolio-header .portfolio-nav{display:flex;flex:1;align-items:center;width:auto;gap:32px;grid-template-columns:none}
.purple-page .portfolio-nav .nav-links{display:flex;flex:1;justify-content:center;align-items:center;gap:clamp(28px,3.7vw,70px)}
.purple-page .portfolio-header .portfolio-nav a{height:48px;min-height:48px;padding:0;border:0;border-radius:0;background:transparent;color:#d3cee5;font-size:16px;font-weight:400;letter-spacing:.035em;transition:color .3s,background .35s,border-color .35s}
.purple-page .portfolio-header .portfolio-nav a>span:not(.nav-number){font-size:16px;font-weight:400}
.purple-page .portfolio-header .portfolio-nav a[aria-current='location']{background:transparent;border-color:transparent;color:#f7efd6}
.purple-page .portfolio-header .portfolio-nav a:hover{background:transparent;color:#b3b2fb}
.purple-page .portfolio-header .portfolio-nav .nav-cta{min-width:172px;border:1.5px solid #9a92d9;border-radius:999px;color:#e6e6e1;padding:0 28px}
.purple-page .portfolio-header .portfolio-nav .nav-cta[aria-current='location']{background:transparent;border-color:#b3b2fb}
.purple-page .portfolio-header .portfolio-nav .nav-cta:hover{background:#9a92d9;border-color:#9a92d9;color:#0a0521}
.purple-page .portfolio-header .portfolio-nav .nav-cta:active{background:#b3b2fb}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.purple-page .reading-progress span{background:#b3b2fb}
.purple-page .reveal-hero{min-height:760px;max-height:1080px;height:calc(100svh - 88px);border-color:#59407880}
.purple-page .hero-name{top:36px}.purple-page .hero-name h1{font-size:clamp(24px,2.1vw,32px);font-weight:400;color:#e6e6e1;letter-spacing:.055em}
.purple-page .hero-side{top:calc(17% - 40px);width:30%}.purple-page .hero-side h2{font-size:clamp(54px,4.8vw,82px);font-weight:500;color:#fff8eb;margin:16px 0 24px;letter-spacing:.02em}.purple-page .hero-side-label{color:#b3a8d2}.purple-page .hero-side p{color:#e8e3f3;font-size:clamp(18px,1.6vw,24px);line-height:1.85}
.purple-page .hero-art{top:24px;width:min(560px,45%);transform:translateX(calc(0% - var(--face-axis) + var(--shift)));mask-image:linear-gradient(#000 0 96%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0 96%,transparent 100%)}
.purple-page .portrait-business .hero-image{filter:brightness(.84) contrast(1.025)}
.purple-page .portrait-ai .hero-image{filter:grayscale(.8) brightness(.77)}
.purple-page .portrait-mesh{filter:none;mask-image:url('assets/hero-draped-purple.png');-webkit-mask-image:url('assets/hero-draped-purple.png')}
.purple-page .side-action{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;justify-content:center;align-items:center;min-height:48px;min-width:210px;border:1px solid #9a92d9;border-radius:999px;padding:11px 20px;color:#d3d1f6;background:transparent;font-size:15px;box-shadow:inset 0 0 0 1px #9a92d940;transition:color .4s,border-color .4s,box-shadow .4s}
.purple-page .side-action:before{content:'';position:absolute;inset:-1px;z-index:-1;background:#9a92d9;transform:translateY(105%);border-radius:50% 50% 0 0;transition:transform .5s cubic-bezier(.22,.8,.2,1),border-radius .5s}
.purple-page .hero-side:hover .side-action,.purple-page .hero-side:focus-visible .side-action{color:#0a0521;border-color:#b3b2fb;box-shadow:0 0 20px #7c5ba52b}
.purple-page .hero-side:hover .side-action:before,.purple-page .hero-side:focus-visible .side-action:before{transform:translateY(0);border-radius:0}
.purple-page .side-action .icon{transition:translate .3s}.purple-page .hero-business:hover .side-action .icon{translate:3px 0}.purple-page .hero-ai:hover .side-action .icon{translate:-3px 0}
.purple-page .hero-decoration{bottom:78px;height:200px;width:27%;color:#aaa0d2}.purple-page .tech-nodes>div>span{color:#aaa0d2}.purple-page .tech-nodes b{border-color:#8e80bd;background:#0c0626}.purple-page .tech-nodes:before{border-color:#8e80bd}.purple-page .data-trails{opacity:.65}
.purple-page .decoration-business{transform:rotate(-6deg);color:#aaa0d2}.purple-page .business-keyword{font-size:24px;transform:skewX(-13deg)}.purple-page .keyword-english{color:#aaa0d2}.purple-page .keyword-rule{border-color:#8e80bd}
.purple-page .keyword-progress{left:49%}.purple-page .keyword-confirmation{left:62%}
.purple-page .diagram{background:linear-gradient(140deg,#21143bde,#130d29ee);border-color:#594477}.purple-page .diagram-bar,.purple-page .diagram-foot{border-color:#49345f}
.purple-page .human-node{background:#281d3e;border-color:#6c5485}.purple-page .ai-node{background:linear-gradient(120deg,#443166,#291c49);border-color:#9a92d9}.purple-page .tools>div{background:#1b1433;border-color:#594576}.purple-page .review-node{background:#261c3c;border-color:#765e93}
.purple-page .button,.purple-page .primary{background:#9a92d9;color:#0a0521;border-color:#b3b2fb;transition:background .3s,box-shadow .3s,translate .2s}
.purple-page .button:hover,.purple-page .primary:hover{background:#c3b6f4;box-shadow:0 0 22px #9473c72b;translate:0 -1px}
.purple-page .button:active,.purple-page .primary:active{translate:0 1px}
.purple-page .hero-outline-button,.purple-page .quiet{border-color:#6c578e;color:#d3cee5}.purple-page .hero-outline-button:hover,.purple-page .quiet:hover{background:#35234e}
.purple-page .case-tabs button,.purple-page .workspace-tabs button,.purple-page .case-tab{transition:color .25s,background .25s,border-color .25s}
.purple-page .case-tabs button[aria-selected=true]{background:#423063;color:#e6e6e1}.purple-page .case-tabs button:hover{color:#f7efd6}
.purple-page #workflows{background:transparent;--bg:#0a0521;--panel:#15102e;--panel2:#1d1439;--text:#e6e6e1;--muted:#b2a8ca;--line:#493764;--sage:#b3b2fb;--blue:#b5b9ef;--purple:#c7a5eb;--amber:#d6b37b}
.purple-page .section-marker>span{border-color:#6b548f;color:#b3b2fb}.purple-page .eyebrow,.purple-page .section-marker>p{color:#aaa0c8}.purple-page .section-marker{scroll-margin-top:115px}
.purple-page .font-credit{color:#8f82af}.purple-page .single-footer{border-color:#493764}.purple-page .single-footer strong{color:#e6e6e1}.purple-page .single-footer p{color:#a99bc5}.purple-page .single-footer>a{color:#b3b2fb}
.purple-page .motion-reveal{opacity:0;translate:0 20px;transition:opacity .8s,translate .9s cubic-bezier(.22,.8,.2,1);transition-delay:var(--enter-delay,0ms)}
.purple-page .motion-reveal.is-in{opacity:1;translate:0 0}
.purple-ready .hero-name,.purple-ready .hero-art{animation:hero-enter 1.2s both}.purple-ready .hero-side>*{animation:hero-enter 1.2s .15s both}.purple-ready .hero-art{animation-delay:.22s}
.purple-page .reveal-hero[data-copy-side='ai'] .hero-business,.purple-page .reveal-hero[data-copy-side='ai'] .decoration-business,.purple-page .reveal-hero[data-copy-side='business'] .hero-ai,.purple-page .reveal-hero[data-copy-side='business'] .decoration-ai{opacity:0;visibility:hidden;pointer-events:none}
@keyframes ambient-drift{from{transform:translate(-8%,-5%) rotate(-9deg) scale(1)}to{transform:translate(9%,7%) rotate(12deg) scale(1.12)}}
@keyframes ambient-sweep{from{transform:translate(8%,-4%) rotate(9deg)}to{transform:translate(-9%,9%) rotate(-12deg)}}
@keyframes hero-enter{from{opacity:0;translate:0 15px}to{opacity:1;translate:0 0}}
@media(max-width:1100px) and (min-width:781px){
 .purple-page .reveal-hero{min-height:740px}.purple-page .hero-art{top:28px;width:46%}.purple-page .hero-side{top:calc(17% - 32px);width:30%}.purple-page .hero-side h2{font-size:clamp(40px,4.8vw,53px)}.purple-page .hero-side p{font-size:16px}.purple-page .side-action{min-width:170px;min-height:44px;font-size:12px;padding:9px 12px;gap:9px}.purple-page .hero-decoration{height:170px;width:27%;bottom:62px}.purple-page .business-keyword{font-size:18px}
}
@media(max-width:780px){
 .purple-page .portfolio-header{padding:14px 23px 12px;gap:11px}.purple-page .portfolio-header .brand{font-size:21px;min-width:0;width:100%}.purple-page .portfolio-header .portfolio-nav{width:100%;gap:12px;flex-basis:100%}.purple-page .portfolio-nav .nav-links{justify-content:space-between;gap:10px}.purple-page .portfolio-header .portfolio-nav a,.purple-page .portfolio-header .portfolio-nav a>span:not(.nav-number){font-size:11px;letter-spacing:0}.purple-page .portfolio-header .portfolio-nav a{height:36px;min-height:36px}.purple-page .portfolio-header .portfolio-nav .nav-cta{min-width:72px;padding:0 10px}.purple-page .portfolio-nav .nav-links{gap:8px}.purple-page .portfolio-header .brand img{width:29px;height:29px}
 .purple-page .reveal-hero{min-height:1000px;max-height:none;height:auto}.purple-page .hero-name{top:26px}.purple-page .hero-name h1{font-size:clamp(15px,4.3vw,22px)}
 .purple-page .hero-side{top:116px;width:49%}.purple-page .hero-side h2{font-size:clamp(28px,7.8vw,38px)}.purple-page .hero-side p{font-size:13px}.purple-page .side-action{min-width:0;width:100%;min-height:42px;font-size:10px;padding:9px 10px;gap:7px;margin-top:23px}.purple-page .side-action .icon{width:15px;height:15px}
 .purple-page .hero-art{top:395px;width:min(410px,112%);mask-image:none;-webkit-mask-image:none}.purple-page .hero-decoration{height:120px;bottom:15px;width:47%;z-index:4}.purple-page .tech-nodes b{background:#0b0623e6}.purple-page .business-keyword{font-size:12px}.purple-page .decoration-business{bottom:25px}.purple-page .keyword-english{font-size:4px}.purple-page .keyword-progress{left:30%}.purple-page .keyword-confirmation{left:46%}
}
@media(prefers-reduced-motion:reduce){.ambient-background:before,.ambient-background:after{animation:none}.purple-ready .hero-name,.purple-ready .hero-side>*,.purple-ready .hero-art{animation:none}.purple-page .motion-reveal{opacity:1;translate:none;transition:none}.purple-page .side-action:before{transition:none}.purple-page .side-action .icon{transition:none}}

/* The portrait's nose/lip axis is slightly right of the PNG canvas centre. */
.purple-page .portfolio-header .brand img{flex-shrink:0}
.purple-page #contact{scroll-margin-top:calc(var(--fixed-nav-height) + 22px)}
.purple-page .contact-footer{display:grid;grid-template-columns:1fr 1fr;gap:18px 40px;padding:32px 0 18px;margin-top:32px}
.purple-page .contact-intro h2{font-family:PortfolioSans,sans-serif;font-size:30px;font-weight:500;line-height:1.4;color:#fff8eb;margin:8px 0}
.purple-page .contact-intro p:not(.eyebrow){font-size:13px;line-height:1.9;color:#bdb5d3}
.purple-page .contact-details{font-style:normal;display:flex;flex-direction:column;gap:0px}
.purple-page .contact-details a{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid #3a2d60;color:#e8e3f3}
.purple-page .contact-details a>span{font-size:11px;letter-spacing:.06em;color:#aaa0c8}
.purple-page .contact-details strong{font-size:20px;font-weight:400;color:inherit}
.purple-page .contact-details a:hover{color:#b3b2fb;border-color:#9a92d9}
.purple-page .contact-details .icon{width:20px;height:20px;transform:rotate(-40deg)}
.purple-page .contact-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;padding-top:10px;border-top:1px solid #3a2d60}
.purple-page .contact-bottom .font-credit{margin:0}.purple-page .contact-bottom>a{font-size:12px;color:#b3b2fb;display:inline-flex;gap:8px;align-items:center}.purple-page .contact-bottom>a .icon{width:18px;height:18px;transform:rotate(-90deg)}
@media(max-width:780px){.purple-page .contact-footer{grid-template-columns:1fr;gap:18px;padding:26px 0 16px;margin-top:28px}.purple-page .contact-details a{grid-template-columns:80px minmax(0,1fr) auto;gap:8px}.purple-page .contact-details strong{font-size:16px}.purple-page .contact-intro h2{font-size:29px}.purple-page .portfolio-header .portfolio-nav a>span:not(.nav-number){font-size:10px}}

/* Selection follows the state already maintained by the explorer. */
.purple-page #workflows .workspace-tabs{gap:12px}
.purple-page #workflows .workspace-tabs>button{padding:0 12px;color:#aaa0c8;font-weight:400;border-radius:6px 6px 0 0;transition:background .2s,color .2s}
.purple-page #workflows .workspace-tabs>button:hover{color:#e6e6e1;background:#9a92d90d}
.purple-page #workflows .workspace-tabs>button[aria-selected="true"]{color:#fff8eb;font-weight:600;background:#9a92d91f}
.purple-page #workflows .workspace-tabs>button[aria-selected="true"]:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:#b3b2fb;border-radius:3px 3px 0 0}
.purple-page #workflows .workspace-tabs>button[aria-selected="true"] .tab-count{color:#fff8eb;background:#6e57a7;border-color:#9a92d9}
@media(max-width:780px){.purple-page #workflows .workspace-tabs{gap:5px}.purple-page #workflows .workspace-tabs>button{padding:0 7px}}