/* ShopWordWeb V13 · native UI adaptation of Lightswind connection-graph,
   perspective-card and stepper concepts. Grayscale glossy brand preserved. */
:root{--sww13-ink:#0b0b0d;--sww13-silver:#e9e9e9;--sww13-glass:rgba(26,26,29,.9)}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Header consistency: Scope Lab now uses the exact .nav/.navin system used on all other pages. */
body.sww7Sim.swwBrandV7{margin:0;background:#fafafa;overflow-x:clip;color:#1b1b1d}
body.sww7Sim.swwBrandV7 .nav{position:sticky!important;top:12px!important;z-index:130!important;margin:0!important;padding:0 14px!important;height:auto!important;display:block!important;pointer-events:none!important}
body.sww7Sim.swwBrandV7 .navin{width:min(1220px,100%)!important;height:72px!important;margin:auto!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:13px!important;padding:0 16px!important;pointer-events:auto!important}
body.sww7Sim.swwBrandV7 .nav .logo{display:flex!important;flex:0 0 auto!important;align-items:center!important;text-decoration:none}
body.sww7Sim.swwBrandV7 .nav .logo img{width:clamp(145px,14vw,205px)!important;height:48px!important;object-fit:contain!important}
body.sww7Sim.swwBrandV7 .nav .links{display:flex!important;align-items:center!important;gap:4px!important;min-width:0;flex-shrink:1;padding:5px!important}
body.sww7Sim.swwBrandV7 .nav .links a{text-decoration:none!important;white-space:nowrap!important;font-size:12px!important;font-weight:700!important;padding:9px 10px!important;border-radius:999px!important}
body.sww7Sim.swwBrandV7 .nav .navCtas{display:flex!important;gap:7px!important;align-items:center!important}
body.sww7Sim.swwBrandV7 .nav .navCtas .pill{display:inline-flex!important;align-items:center!important;justify-content:center!important;text-decoration:none!important;font-size:11px!important;font-weight:800!important;padding:12px 13px!important;border-radius:999px!important;white-space:nowrap!important;border:1px solid #ffffff55!important}
body.sww7Sim.swwBrandV7 .nav .mobileMenuBtn{display:none!important}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel{display:none!important}
body.sww7Sim.swwBrandV7 .nav .mobileMenuLinks{display:flex;flex-direction:column;gap:3px}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel a{display:block;padding:13px 16px;border-radius:9px;color:#fafafa;font-size:13px;text-decoration:none;font-weight:700}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel .projectLink{background:#f3f3f3;color:#111}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel .mobileMenuFoot{display:flex;flex-direction:column;gap:4px}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel.sww13Open{display:block!important;position:absolute!important;top:79px!important;left:3%!important;right:3%!important;z-index:140!important;padding:12px!important;background:#131316!important;border:1px solid #666!important;border-radius:21px!important;box-shadow:0 24px 48px #0008!important;visibility:visible!important;opacity:1!important;transform:none!important;pointer-events:auto!important}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel.sww13Open .mobileMenuLinks{max-height:none!important}
body.sww7Sim.swwBrandV7 .nav .mobileMenuPanel.sww13Open a:hover{background:#ffffff20}
body.sww7Sim.swwBrandV7 .sww7SimHero{margin-top:-84px;padding-top:185px!important}
@media(max-width:1190px){
 body.sww7Sim.swwBrandV7 .nav .navCtas .pill.line{display:none!important}
 body.sww7Sim.swwBrandV7 .nav .links{gap:2px!important}
 body.sww7Sim.swwBrandV7 .nav .links a{font-size:11px!important;padding:9px 7px!important}
}
@media(max-width:1000px){
 body.sww7Sim.swwBrandV7 .nav .links,body.sww7Sim.swwBrandV7 .nav .navCtas{display:none!important}
 body.sww7Sim.swwBrandV7 .nav .mobileMenuBtn{width:44px!important;height:44px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;margin-left:auto!important;border-radius:14px!important;cursor:pointer!important}
 body.sww7Sim.swwBrandV7 .nav .mobileMenuBtn span{display:block!important;width:20px!important;height:2px!important;border-radius:9px!important;background:#f3f3f3!important}
 body.sww7Sim.swwBrandV7 .sww7SimHero{padding-top:160px!important}
}
@media(max-width:620px){
 body.sww7Sim.swwBrandV7 .nav .navin{height:68px!important;padding:0 15px!important}
 body.sww7Sim.swwBrandV7 .nav .logo img{width:159px!important;height:46px!important}
 body.sww7Sim.swwBrandV7 .sww7SimHero{margin-top:-79px!important;padding-top:151px!important}
}
/* Connected-systems simulator: an actually responsive project-graph, not false "live APIs". */
body.sww7Sim .sww7SimOrb{perspective:1000px!important;transform:rotateX(var(--sww13-rx,0deg)) rotateY(var(--sww13-ry,0deg));transition:transform .2s ease-out!important;overflow:visible!important;isolation:isolate}
body.sww7Sim .sww7SimOrb:before{display:none!important}
.sww13NetworkFloor{position:absolute;inset:12%;border:1px solid #ffffff20;border-radius:50%;transform:rotateX(60deg) translateZ(-35px);box-shadow:0 0 0 19px #ffffff08,0 0 0 43px #ffffff05;background:repeating-linear-gradient(90deg,#ffffff08 0 1px,transparent 1px 19px),repeating-linear-gradient(0deg,#ffffff08 0 1px,transparent 1px 19px);z-index:0;pointer-events:none}
.sww13NetworkPaths{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;z-index:1!important;overflow:visible!important;pointer-events:none!important}
.sww13NetworkPaths path{stroke:#ffffff56;stroke-width:1.5;fill:none}
.sww13NetworkPaths path.sww13LineGlow{stroke:#f7f7f7;stroke-width:1.8;stroke-dasharray:6 12;animation:sww13Flow 6s linear infinite;filter:drop-shadow(0 0 3px #fff6)}
@keyframes sww13Flow{to{stroke-dashoffset:-180}}
.sww13NetworkHub{position:relative;z-index:3;width:45%;aspect-ratio:1;max-width:165px;border-radius:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;color:#fff;background:linear-gradient(147deg,#353538,#131314);border:1px solid #aaa;box-shadow:8px 12px 20px #0008,inset 0 2px #ffffff45;transform:rotateX(9deg) rotateY(-7deg)}
.sww13NetworkHub span{font:750 9px ui-monospace,monospace;color:#bababa;letter-spacing:.1em}
.sww13NetworkHub strong{font:900 clamp(17px,2.2vw,28px) ui-sans-serif,Arial,sans-serif;letter-spacing:-.055em;color:#fff;overflow-wrap:anywhere}
.sww13NetworkHub small{font:650 9px ui-monospace,monospace;color:#dbdbdb}
.sww13Satellite{position:absolute;z-index:4;min-width:85px;height:49px;border-radius:12px;padding:7px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:750 10px ui-sans-serif,Arial,sans-serif;color:#f5f5f5;background:linear-gradient(140deg,#3b3b40,#19191b)!important;border:1px solid #8c8c8c;box-shadow:3px 7px 16px #0008,inset 0 1px #ffffff27;text-align:center;white-space:nowrap}
.sww13Satellite b{font:850 10px ui-monospace,monospace;color:#dadada}
.sww13SatTop{top:-10px;left:50%;transform:translateX(-50%)}
.sww13SatRight{right:-19px;top:50%;transform:translateY(-50%)}
.sww13SatBottom{bottom:-10px;left:50%;transform:translateX(-50%)}
.sww13SatLeft{left:-19px;top:50%;transform:translateY(-50%)}
@media(max-width:950px){.sww13Satellite{min-width:76px;height:42px;font-size:9px}.sww13SatRight{right:-20px}.sww13SatLeft{left:-20px}}
@media(max-width:550px){.sww13Satellite{min-width:66px;height:37px;border-radius:9px;font-size:9px;padding:4px}.sww13NetworkHub span,.sww13NetworkHub small{font-size:7px}.sww13SatRight{right:-17px}.sww13SatLeft{left:-17px}}
/* 8-stage interactive process: no scroll jail, clear readable cards and 3D object */
body.sww13ProcessReady .swwProcessTrack{display:none!important}
.sww13ProcessExperience{padding:clamp(65px,8vw,108px) 0;background:linear-gradient(180deg,#f2f2f2,#fff);color:#1b1b1d;position:relative;z-index:3}
.sww13ProcessIntro,.sww13ProcessLayout{width:min(1210px,calc(100% - 42px));margin-left:auto;margin-right:auto}
.sww13Eyebrow{font:850 10px ui-monospace,monospace;letter-spacing:.15em;color:#757575}
.sww13ProcessIntro h2,.sww13ServicesHeading h2{font-size:clamp(36px,5.5vw,76px);line-height:1.04;letter-spacing:-.067em;margin:18px 0;color:#181819}
.sww13ProcessIntro h2 em,.sww13ServicesHeading h2 em{font:italic 500 1em Georgia,serif;color:#666}
.sww13ProcessIntro p,.sww13ServicesHeading p{font-size:15px;line-height:1.85;color:#656565;max-width:650px}
.sww13ProcessLayout{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:22px;margin-top:36px;align-items:stretch}
.sww13ProcessRail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;align-content:start}
.sww13StageBtn{background:#fff;border:1px solid #d4d4d4;border-radius:21px;padding:20px 17px;text-align:left;display:flex;flex-direction:column;gap:23px;min-height:130px;color:#171719;cursor:pointer;position:relative;transition:transform .25s ease,background .25s,border-color .25s,box-shadow .25s}
.sww13StageBtn:hover,.sww13StageBtn:focus-visible{transform:translateY(-3px);border-color:#666;box-shadow:0 16px 28px #00000013}
.sww13StageBtn[aria-pressed=true]{background:linear-gradient(140deg,#303032,#101012);border-color:#6c6c6c;color:#fff;box-shadow:0 14px 30px #0004}
.sww13StageNumber{font:800 12px ui-monospace,monospace;color:#888;letter-spacing:.1em}
.sww13StageBtn[aria-pressed=true] .sww13StageNumber{color:#ededed}
.sww13StageText{display:flex;flex-direction:column;gap:6px}
.sww13StageText strong{font-size:clamp(14px,1.5vw,19px);letter-spacing:-.035em;line-height:1.12}
.sww13StageText small{font-size:10px;color:#828282}
.sww13StageBtn[aria-pressed=true] .sww13StageText small{color:#d8d8d8}
.sww13StageArrow{position:absolute;right:14px;top:15px;font-size:17px;color:#999}
.sww13StageBtn[aria-pressed=true] .sww13StageArrow{color:#eee}
.sww13ProcessPanel{background:radial-gradient(circle at 75% 23%,#444 0,transparent 39%),linear-gradient(145deg,#28282a,#0d0d0e);color:#fff;border:1px solid #565656;border-radius:29px;min-height:560px;padding:clamp(21px,3.2vw,38px);display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:0 30px 55px #0004}
.sww13ProcessPanelTop{display:flex;justify-content:space-between;gap:16px;font:750 10px ui-monospace,monospace;color:#cbcbcb;letter-spacing:.08em}
.sww13ProcessScene{position:relative;min-height:205px;margin:18px 0 10px;display:grid;place-items:center;perspective:850px;overflow:hidden}
.sww13SceneGrid{position:absolute;inset:0;background-image:linear-gradient(#ffffff0d 1px,transparent 1px),linear-gradient(90deg,#ffffff0d 1px,transparent 1px);background-size:25px 25px;mask-image:radial-gradient(ellipse,#000,transparent 74%);transform:rotateX(50deg) scale(1.25)}
.sww13SceneCube{height:108px;width:108px;position:relative;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(calc(-31deg + var(--sww13-scene-rotation,0deg)));transition:transform .8s cubic-bezier(.19,.8,.2,1);filter:drop-shadow(0 20px 19px #0008)}
.sww13SceneFront,.sww13SceneSide,.sww13SceneTop{position:absolute;width:108px;height:108px;display:grid;place-items:center;border:1px solid #fff9;backface-visibility:hidden}
.sww13SceneFront{background:linear-gradient(145deg,#f6f6f6,#999);color:#1a1a1a;font:900 49px ui-monospace,monospace;transform:translateZ(54px)}
.sww13SceneSide{background:linear-gradient(120deg,#646464,#262626);transform:rotateY(90deg) translateZ(54px)}
.sww13SceneTop{background:linear-gradient(80deg,#fff,#888);transform:rotateX(90deg) translateZ(54px)}
.sww13SceneOrbit{position:absolute;width:200px;height:200px;border:1px dashed #ffffff52;border-radius:50%;transform:rotateX(66deg);pointer-events:none}
.sww13SceneOrbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:#eee;box-shadow:0 0 8px #fff}
.sww13SceneOrbit i:nth-child(1){top:-3px;left:50%}.sww13SceneOrbit i:nth-child(2){right:-3px;top:50%}.sww13SceneOrbit i:nth-child(3){bottom:-3px;left:50%}.sww13SceneOrbit i:nth-child(4){left:-3px;top:50%}
.sww13PanelText .sww13Eyebrow{color:#c7c7c7}
.sww13PanelText h3{font-size:clamp(32px,4vw,55px);letter-spacing:-.065em;color:#fff;margin:12px 0}
.sww13PanelText p{font-size:14px;line-height:1.75;color:#d4d4d4;margin:0}
.sww13Deliverables{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.sww13Deliverables span{padding:8px 10px;border:1px solid #777;border-radius:99px;background:#ffffff13;font:700 10px ui-monospace,monospace;color:#f5f5f5}
.sww13ProcessBottom{margin-top:auto;padding-top:20px;display:flex;align-items:center;gap:17px;justify-content:space-between}
.sww13ProcessMeter{height:3px;flex:1;background:#606060;border-radius:4px;overflow:hidden}
.sww13ProcessMeter i{display:block;height:100%;width:12.5%;background:#fff;transition:width .5s}
.sww13StageNext{border-radius:50px;border:1px solid #8d8d8d;background:#fff;color:#1c1c1c;font:800 11px ui-sans-serif,Arial,sans-serif;padding:12px 15px;white-space:nowrap;cursor:pointer}
.sww13StageNext:hover{background:#dedede}
@media(max-width:980px){.sww13ProcessLayout{grid-template-columns:1fr}.sww13ProcessPanel{min-height:570px;grid-row:1}.sww13ProcessRail{grid-template-columns:repeat(4,minmax(0,1fr))}.sww13StageBtn{min-height:112px;padding:13px}}
@media(max-width:640px){.sww13ProcessLayout{gap:18px}.sww13ProcessPanel{min-height:585px}.sww13ProcessRail{grid-template-columns:repeat(2,minmax(0,1fr))}.sww13StageBtn{min-height:100px;padding:13px;gap:13px}.sww13ProcessScene{min-height:185px}.sww13ProcessIntro h2{font-size:clamp(34px,9vw,48px)}}
@media(prefers-reduced-motion:reduce){.sww13SceneCube,.sww13StageBtn,.sww13ProcessMeter i{transition:none!important}}
/* Services connection map: Lightswind-style node composition, but truthful conceptual flow. */
.sww13ServicesLinkMap{padding:clamp(70px,8vw,116px) 0;background:linear-gradient(180deg,#f0f0f0,#fff)}
.sww13ServicesHeading{max-width:870px}
.sww13ServicesGrid{display:grid;grid-template-columns:1fr minmax(220px,.86fr) 1fr;grid-template-rows:repeat(2,minmax(145px,1fr));gap:15px;align-items:stretch;margin-top:37px}
.sww13ServicesGrid>a{display:flex;flex-direction:column;gap:10px;padding:26px;background:#fff;color:#222;text-decoration:none;border:1px solid #dedede;border-radius:24px;position:relative;box-shadow:0 15px 33px #0000000b;transition:transform .3s,border-color .3s,box-shadow .3s}
.sww13ServicesGrid>a:hover{transform:translateY(-5px) rotateX(3deg);border-color:#747474;box-shadow:0 19px 32px #0000001c}
.sww13ServicesGrid>a b{font:750 11px ui-monospace,monospace;color:#8a8a8a}
.sww13ServicesGrid>a strong{font-size:clamp(17px,1.8vw,24px);letter-spacing:-.04em;margin-top:auto}
.sww13ServicesGrid>a span{font-size:11px;color:#666}
.sww13ServicesCore{grid-column:2;grid-row:1/3;position:relative;background:linear-gradient(145deg,#333,#0c0c0e);border:1px solid #5c5c5c;border-radius:29px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;text-align:center;overflow:hidden;color:#fff;isolation:isolate;box-shadow:0 24px 49px #0004}
.sww13ServicesCore:before{content:"";position:absolute;inset:12%;border:1px dashed #ffffff55;border-radius:50%;animation:sww13CoreOrbit 40s linear infinite;z-index:-1}
.sww13ServicesCore:after{content:"";position:absolute;inset:25%;border:1px solid #ffffff22;border-radius:50%;z-index:-1}
.sww13CoreHalo{position:absolute;inset:-20%;background:radial-gradient(circle,#ffffff17,transparent 60%);z-index:-1}
@keyframes sww13CoreOrbit{to{transform:rotate(360deg)}}
.sww13ServicesCore span{font:750 10px ui-monospace,monospace;letter-spacing:.1em;color:#c8c8c8}
.sww13ServicesCore strong{font-size:clamp(25px,3vw,43px);line-height:1.12;letter-spacing:-.07em;color:#fff;text-shadow:0 2px 17px #000a}
.sww13ServicesCore small{font-size:11px;color:#d3d3d3}
.sww13ServicesGrid>a:nth-child(2){grid-column:3;grid-row:1}
.sww13ServicesGrid>a:nth-child(4){grid-column:1;grid-row:2}
.sww13ServicesGrid>a:nth-child(5){grid-column:3;grid-row:2}
@media(max-width:750px){.sww13ServicesGrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.sww13ServicesCore{grid-column:1/3;grid-row:1;min-height:245px}.sww13ServicesGrid>a:nth-child(2),.sww13ServicesGrid>a:nth-child(4),.sww13ServicesGrid>a:nth-child(5){grid-column:auto;grid-row:auto}}
@media(max-width:480px){.sww13ServicesGrid{gap:9px}.sww13ServicesGrid>a{padding:16px;min-height:148px}.sww13ServicesGrid>a strong{font-size:16px}.sww13ServicesGrid>a span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.sww13ServicesCore:before{animation:none}}
/* Existing service cards get 3D character without GPU-heavy libraries */
body.swwBrandV7 .serviceGrid .service,body.swwBrandV7 .sww5ServiceHubGrid a,body.swwBrandV7 .swwFeatureGrid .swwFeature{position:relative;overflow:hidden;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;transform-style:preserve-3d}
@media(hover:hover) and (prefers-reduced-motion:no-preference){body.swwBrandV7 .serviceGrid .service:hover,body.swwBrandV7 .sww5ServiceHubGrid a:hover,body.swwBrandV7 .swwFeatureGrid .swwFeature:hover{transform:perspective(850px) translateY(-4px) rotateX(2deg);box-shadow:0 27px 49px #00000024;border-color:#999}}

@media(max-width:1000px){body.sww7Sim.swwBrandV7 .nav .navin{height:62px!important}}
@media(max-width:620px){body.sww7Sim.swwBrandV7 .nav .navin{height:58px!important}}
