/* Pixel Weavers — Optimized stylesheet
   Extracted from the production page to improve caching and maintainability.
*/

:root{
--onyx: #0a0a0e;
--onyx-raised: #121218;
--onyx-card: #16161d;
--line: rgba(245,245,247,0.09);
--white: #f5f5f7;
--muted: #8d8d99;
--violet: #8b5cf6;
--violet-soft: rgba(139,92,246,0.14);
--cyan: #2dd4e8;
--cyan-soft: rgba(45,212,232,0.14);
--display: 'Bricolage Grotesque', system-ui, sans-serif;
--body: 'Inter', system-ui, sans-serif;
--mono: 'JetBrains Mono', monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
background:var(--onyx);
color:var(--white);
font-family:var(--body);
line-height:1.5;
overflow-x:hidden;
-webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;}
::selection{background:var(--violet);color:#fff;}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}

/* Ambient background glow layer */
.glow-field{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.glow{position:absolute;border-radius:50%;filter:blur(120px);opacity:0.35;}
.glow-1{width:600px;height:600px;background:var(--violet);top:-200px;left:-150px;}
.glow-2{width:500px;height:500px;background:var(--cyan);top:400px;right:-200px;opacity:0.22;}
.glow-3{width:500px;height:500px;background:var(--violet);bottom:-100px;left:30%;opacity:0.18;}

section{position:relative;z-index:1;}

/* ===== HEADER ===== */
header{
position:sticky;top:0;z-index:50;
background:rgb(11 11 18 / 72%);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;}
.logo{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-0.02em;display:flex;align-items:center;gap:8px;}
.logo-mark{width:22px;height:22px;position:relative;flex-shrink:0;}
.nav-links{display:flex;align-items:center;gap:40px;}
.nav-links a{font-size:14.5px;color:var(--muted);font-weight:500;transition:color .25s;position:relative;}
.nav-links a.active{color:var(--white);}
.nav-links a:not(.nav-cta):hover{color:var(--white);}
.nav-links a:not(.nav-cta)::after{
content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--cyan);transition:width .3s ease;
}
.nav-links a.active::after{width:100%;}
.nav-links a:not(.nav-cta):hover::after{width:100%;}
.nav-cta{
border:1px solid rgba(245,245,247,0.28);
padding:9px 20px;border-radius:100px;font-size:13.5px;font-weight:500;color:var(--white)!important;
transition:all .3s ease;width: 130px;
}
.nav-cta:hover{border-color:var(--cyan);box-shadow:0 0 20px rgba(45,212,232,0.35);background:var(--cyan-soft);}
.nav-toggle{display:none;background:none;border:0;color:var(--white);font-size:24px;cursor:pointer;}

.hero-cursor-glow{
position:absolute;top:0;left:0;width:440px;height:440px;border-radius:50%;
background:radial-gradient(circle,rgba(139,92,246,0.4),rgba(45,212,232,0.18) 42%,transparent 72%);
filter:blur(50px);pointer-events:none;z-index:0;
transform:translate(-9999px,-9999px);
opacity:0;transition:opacity .5s ease;
will-change:transform;
}
.hero.glow-active .hero-cursor-glow{opacity:1;}

/* ===== HERO — PIXEL WEAVER INTERACTIVE MASCOT ===== */
.hero{padding:104px 0 24px;position:relative;overflow:hidden;min-height:720px;}
.hero .wrap{position:relative;z-index:2;}
.hero-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);gap:48px;align-items:center;}
.hero-copy-side{min-width:0;}
.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);display:flex;align-items:center;gap:10px;margin-bottom:24px;}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(42px,5.6vw,76px);line-height:1.02;letter-spacing:-.035em;max-width:760px;}
.hero h1 .accent{background:linear-gradient(100deg,var(--violet),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-sub{display:flex;gap:40px;margin-top:32px;align-items:flex-end;flex-wrap:wrap;}
.hero-copy p{font-size:16px;color:var(--muted);max-width:490px;line-height:1.65;}
.hero-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.btn-primary{background:var(--white);color:var(--onyx);padding:16px 30px;border-radius:100px;font-weight:600;font-size:15px;display:inline-flex;align-items:center;gap:10px;transition:all .3s ease;border:1px solid var(--white);}
.btn-primary:hover{background:transparent;color:var(--white);box-shadow:0 0 30px rgba(139,92,246,.4);}
.btn-ghost{color:var(--muted);font-size:14.5px;font-weight:500;display:inline-flex;align-items:center;gap:8px;padding:16px 4px;transition:color .3s;}
.btn-ghost:hover{color:var(--white);}

.pwbot-zone{position:relative;min-height:560px;display:grid;place-items:center;isolation:isolate;perspective:900px;}
.pwbot-zone::before{content:'';position:absolute;width:390px;height:390px;border-radius:50%;background:radial-gradient(circle,rgba(45,212,232,.15),rgba(139,92,246,.11) 45%,transparent 72%);filter:blur(34px);animation:pwbotAura 4s ease-in-out infinite;z-index:-2;}
.pwbot-grid{position:absolute;inset:8% 0 4%;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:34px 34px;mask-image:radial-gradient(circle at 50% 48%,black 0 46%,transparent 76%);z-index:-3;}
@keyframes pwbotAura{50%{transform:scale(1.12);opacity:.72}}
.pwbot-speech{position:absolute;top:40px;right:8px;max-width:190px;padding:11px 14px;border:1px solid rgba(45,212,232,.42);border-radius:10px;background:rgba(10,10,14,.88);backdrop-filter:blur(12px);font-family:var(--mono);font-size:10px;letter-spacing:.055em;color:var(--cyan);box-shadow:0 14px 36px rgba(0,0,0,.28);opacity:0;transform:translateY(8px);transition:.24s ease;z-index:8;}
.pwbot-speech.show{opacity:1;transform:translateY(0)}
.pwbot-speech::after{content:'';position:absolute;left:24px;bottom:-7px;width:12px;height:12px;background:rgba(10,10,14,.96);border-right:1px solid rgba(45,212,232,.42);border-bottom:1px solid rgba(45,212,232,.42);transform:rotate(45deg)}
.pwbot{--rx:0deg;--ry:0deg;--ex:0px;--ey:0px;--mode:var(--cyan);position:relative;width:310px;height:430px;transform-style:preserve-3d;animation:pwbotFloat 4.2s ease-in-out infinite;will-change:transform;cursor:pointer;}
.pwbot[data-mode="design"]{--mode:var(--violet)}.pwbot[data-mode="code"]{--mode:var(--cyan)}.pwbot[data-mode="growth"]{--mode:#54e6a5}
@keyframes pwbotFloat{0%,100%{translate:0 0}50%{translate:0 -13px}}
.pwbot-head{position:absolute;left:50%;top:34px;width:264px;height:166px;transform:translateX(-50%) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .08s linear;background:linear-gradient(145deg,#f7f7fb,#bec4d0);padding:8px;clip-path:polygon(7% 0,93% 0,100% 10%,100% 90%,93% 100%,7% 100%,0 90%,0 10%);box-shadow:0 28px 60px rgba(0,0,0,.36),inset -10px -10px 0 rgba(0,0,0,.13),inset 8px 8px 0 rgba(255,255,255,.82);}
.pwbot-browser{height:100%;background:#08101c;border:3px solid #1b2940;position:relative;overflow:hidden;clip-path:polygon(4% 0,96% 0,100% 8%,100% 92%,96% 100%,4% 100%,0 92%,0 8%)}
.pwbot-browserbar{height:25px;border-bottom:1px solid rgba(255,255,255,.09);display:flex;align-items:center;gap:5px;padding:0 10px}.pwbot-browserbar i{width:5px;height:5px;border-radius:50%;background:#6d7381}.pwbot-browserbar i:nth-child(2){background:var(--violet)}.pwbot-browserbar i:nth-child(3){background:var(--cyan)}.pwbot-url{margin-left:5px;width:90px;height:5px;border-radius:5px;background:rgba(255,255,255,.1)}
.pwbot-eyes{position:absolute;left:0;right:0;top:61px;display:flex;justify-content:center;gap:54px}.pwbot-eye{width:34px;height:27px;position:relative;overflow:hidden;background:#122b3c;box-shadow:0 0 14px rgba(45,212,232,.18)}.pwbot-pupil{position:absolute;width:15px;height:15px;left:9px;top:6px;background:var(--mode);box-shadow:0 0 12px var(--mode);transform:translate(var(--ex),var(--ey));transition:background .2s,box-shadow .2s}.pwbot-lid{position:absolute;inset:0;background:#08101c;transform:translateY(-105%);z-index:2}.pwbot-eye.blink .pwbot-lid{animation:pwBlink .18s ease-in-out}@keyframes pwBlink{0%,100%{transform:translateY(-105%)}48%,52%{transform:translateY(0)}}
.pwbot-mouth{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:grid;grid-template-columns:repeat(5,7px);grid-template-rows:repeat(2,7px);gap:1px}.pwbot-mouth i{background:var(--mode);box-shadow:0 0 8px var(--mode);transition:.2s}.pwbot-mouth i:nth-child(1){grid-column:1;grid-row:1}.pwbot-mouth i:nth-child(2){grid-column:2;grid-row:2}.pwbot-mouth i:nth-child(3){grid-column:3;grid-row:2}.pwbot-mouth i:nth-child(4){grid-column:4;grid-row:2}.pwbot-mouth i:nth-child(5){grid-column:5;grid-row:1}
.pwbot-antenna{position:absolute;top:-10px;left:50%;width:42px;height:53px;transform:translateX(-50%);z-index:3}.pwbot-antenna::before{content:'';position:absolute;width:9px;height:30px;background:#31384a;left:18px;bottom:0}.pwbot-cursor{position:absolute;left:8px;top:0;width:26px;height:30px;background:var(--mode);clip-path:polygon(0 0,0 100%,8px 76%,14px 95%,20px 92%,14px 72%,26px 70%);filter:drop-shadow(0 0 8px var(--mode));transition:background .2s;animation:cursorTick 1.7s steps(2,end) infinite}@keyframes cursorTick{50%{transform:translateY(-2px)}}
.pwbot-neck{position:absolute;top:194px;left:50%;width:48px;height:32px;transform:translateX(-50%);background:#293244;box-shadow:inset -8px -6px 0 #161d2b}.pwbot-body{position:absolute;top:220px;left:50%;width:184px;height:128px;transform:translateX(-50%);background:linear-gradient(145deg,#e7e9ef,#aeb5c2);border:7px solid #7c8597;clip-path:polygon(12% 0,88% 0,100% 17%,100% 83%,88% 100%,12% 100%,0 83%,0 17%);box-shadow:inset -10px -10px 0 rgba(0,0,0,.17)}
.pwbot-loom{position:absolute;left:50%;top:18px;width:100px;height:74px;transform:translateX(-50%);background:#090f1a;border:5px solid #c9ced8;overflow:hidden;box-shadow:inset 0 0 20px rgba(45,212,232,.12)}.pwbot-thread{position:absolute;inset:0;opacity:.8;background-image:repeating-linear-gradient(0deg,transparent 0 9px,rgba(45,212,232,.33) 9px 10px),repeating-linear-gradient(90deg,transparent 0 12px,rgba(139,92,246,.34) 12px 13px);animation:loomShift 3s linear infinite}@keyframes loomShift{to{background-position:0 20px,26px 0}}
.pwbot-pwmark{position:absolute;left:50%;top:50%;width:46px;height:38px;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(4,9px);grid-template-rows:repeat(3,9px);gap:2px;filter:drop-shadow(0 0 8px var(--mode))}.pwbot-pwmark i{background:var(--mode);transition:background .2s}.pwbot-pwmark i:nth-child(1){grid-area:1/1}.pwbot-pwmark i:nth-child(2){grid-area:1/2}.pwbot-pwmark i:nth-child(3){grid-area:2/1}.pwbot-pwmark i:nth-child(4){grid-area:3/1}.pwbot-pwmark i:nth-child(5){grid-area:2/2}.pwbot-pwmark i:nth-child(6){grid-area:1/4}.pwbot-pwmark i:nth-child(7){grid-area:2/4}.pwbot-pwmark i:nth-child(8){grid-area:3/4}.pwbot-pwmark i:nth-child(9){grid-area:3/3}.pwbot-mode{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);font-family:var(--mono);font-size:8px;letter-spacing:.14em;color:#3b4350;text-transform:uppercase;white-space:nowrap}
.pwbot-arm{position:absolute;top:238px;width:48px;height:106px;transform-origin:top center;transition:transform .3s ease}.pwbot-arm.left{left:20px;transform:rotate(11deg)}.pwbot-arm.right{right:20px;transform:rotate(-11deg)}.pwbot-arm .upper{display:block;width:37px;height:68px;margin:auto;background:#aeb6c3;border:5px solid #697386;box-shadow:inset -5px -5px 0 rgba(0,0,0,.15)}.pwbot-hand{display:grid;place-items:center;width:48px;height:38px;margin-top:-2px;background:#111a28;border:4px solid #697386;color:var(--mode);font-family:var(--mono);font-weight:700;font-size:16px;text-shadow:0 0 8px var(--mode)}.pwbot.wave .pwbot-arm.left{animation:pwWave .7s ease-in-out 2}@keyframes pwWave{0%,100%{transform:rotate(11deg)}35%{transform:translate(-8px,-16px) rotate(-60deg)}70%{transform:translate(-5px,-13px) rotate(-42deg)}}
.pwbot-legs{position:absolute;left:50%;top:338px;transform:translateX(-50%);width:142px;display:flex;justify-content:space-between}.pwbot-leg{position:relative;width:45px;height:72px;background:#273145;border-left:6px solid #8992a1;border-right:6px solid #8992a1}.pwbot-foot{position:absolute;left:-15px;bottom:-8px;width:62px;height:34px;background:#d9dde5;border:5px solid #7c8595;border-bottom:8px solid #171e2d}.pwbot-shadow{position:absolute;bottom:43px;width:190px;height:25px;border-radius:50%;background:rgba(45,212,232,.13);filter:blur(13px);animation:pwShadow 4.2s ease-in-out infinite;z-index:-1}@keyframes pwShadow{50%{transform:scale(.78);opacity:.4}}
.pwbot-node{position:absolute;display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:rgba(18,18,24,.76);backdrop-filter:blur(10px);font-family:var(--mono);font-size:9px;color:var(--muted);transition:.25s ease;z-index:5;cursor:pointer}.pwbot-node b{width:7px;height:7px;background:var(--cyan);box-shadow:0 0 9px var(--cyan)}.pwbot-node.design{left:0;top:142px}.pwbot-node.code{right:-3px;top:222px}.pwbot-node.seo{left:22px;bottom:70px}.pwbot-node:hover,.pwbot-node.active{color:var(--white);border-color:rgba(45,212,232,.45);transform:translateY(-3px)}.pwbot-node.design b{background:var(--violet);box-shadow:0 0 9px var(--violet)}.pwbot-node.seo b{background:#54e6a5;box-shadow:0 0 9px #54e6a5}
.pwbot-wire{position:absolute;height:1px;transform-origin:left center;opacity:.35;z-index:1;pointer-events:none}.pwbot-wire::before{content:'';display:block;width:100%;height:100%;background:linear-gradient(90deg,transparent,var(--violet),var(--cyan),transparent);background-size:200% 100%;animation:wireFlow 2.2s linear infinite}@keyframes wireFlow{to{background-position:-200% 0}}.wire-a{width:108px;left:88px;top:178px;transform:rotate(12deg)}.wire-b{width:96px;right:72px;top:252px;transform:rotate(168deg)}.wire-c{width:90px;left:110px;bottom:117px;transform:rotate(-16deg)}
.weave-strip{margin-top:34px;width:100%;overflow:hidden;line-height:0;opacity:.82}.weave-strip svg{width:100%;height:105px;display:block}.strand{fill:none;stroke-width:1.6;opacity:.6}.strand-violet{stroke:var(--violet);animation:weave-pulse 4.5s ease-in-out infinite}.strand-cyan{stroke:var(--cyan);animation:weave-pulse 4.5s ease-in-out infinite .9s}.weave-group{animation:weave-drift 16s linear infinite}@keyframes weave-drift{from{transform:translateX(0)}to{transform:translateX(-1200px)}}@keyframes weave-pulse{0%,100%{opacity:.4}50%{opacity:.85}}
@media(max-width:980px){.hero{padding-top:90px}.hero-layout{grid-template-columns:1fr}.hero-copy-side{text-align:center}.eyebrow{justify-content:center}.hero h1{margin:auto}.hero-sub{justify-content:center}.hero-copy p{margin:auto}.hero-actions{justify-content:center}.pwbot-zone{min-height:500px;margin-top:-10px}.pwbot-node.design{left:8%}.pwbot-node.code{right:8%}.pwbot-node.seo{left:12%}}
@media(max-width:620px){.hero{padding-top:74px}.hero h1{font-size:clamp(40px,13vw,60px)}.hero-sub{margin-top:24px}.pwbot-zone{min-height:395px;margin-top:20px}.pwbot{transform:scale(.76);transform-origin:center top}.pwbot-node,.pwbot-wire{display:none}.pwbot-speech{top:18px;right:14px}.weave-strip{margin-top:-25px}}
@media(prefers-reduced-motion:reduce){.pwbot,.pwbot-zone::before,.pwbot-thread,.pwbot-cursor,.pwbot-shadow,.weave-group,.strand{animation:none!important}.pwbot-head{transition:none}}

/* ===== LOGO MARQUEE ===== */
.logo-strip{padding:52px 0;border-top:1px solid var(--line);overflow:hidden;}
.logo-strip-head{
font-family:var(--mono);font-size:11.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);
margin-bottom:30px;
}
.marquee-mask{
position:relative;overflow:hidden;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee-track{display:flex;width:max-content;gap:0;animation:marquee 28s linear infinite;}
.marquee-track:hover{animation-play-state:paused;}
.logo-item{
display:flex;align-items:center;justify-content:center;padding:0 56px;
font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:-0.01em;color:#6b6b76;
white-space:nowrap;transition:color .35s;
}
.logo-item:hover{color:var(--white);}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ===== PRESS ===== */
.press{padding-bottom:50px;}
.press-card{
display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:space-between;
background:var(--onyx-card);border:1px solid var(--line);border-radius:18px;padding:26px 30px;
transition:all .35s ease;
}
.press-card:hover{border-color:var(--cyan);}
.press-left{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.press-label{
font-family:var(--mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);
border-right:1px solid var(--line);padding-right:18px;white-space:nowrap;
}
.press-name{font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-0.01em;}
.press-blurb{font-size:13.5px;color:var(--muted);max-width:520px;line-height:1.55;}
.press-cta{
font-size:13.5px;font-weight:500;color:var(--cyan);display:inline-flex;align-items:center;gap:6px;
white-space:nowrap;transition:gap .3s;
}
.press-card:hover .press-cta{gap:10px;}

/* ===== GOOGLE REVIEWS ===== */
.greviews{padding:110px 0;border-top:1px solid var(--line);}
.greviews-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:44px;flex-wrap:wrap;gap:20px;}
.greviews-title{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.greviews-title h2{font-family:var(--display);font-size:28px;font-weight:600;}
.g-badge{
display:flex;align-items:center;gap:9px;background:var(--onyx-card);border:1px solid var(--line);
padding:8px 16px 8px 12px;border-radius:100px;
}
.g-badge .g-icon{width:18px;height:18px;flex-shrink:0;}
.g-badge .g-score{font-family:var(--display);font-weight:700;font-size:15px;}
.g-badge .g-stars{display:flex;gap:1px;}
.g-badge .g-stars svg{width:13px;height:13px;}
.g-badge .g-count{font-size:12.5px;color:var(--muted);}
.greviews-nav{display:flex;gap:10px;}
.greviews-nav button{
width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--white);
cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;
}
.greviews-nav button:hover{border-color:var(--cyan);background:var(--cyan-soft);}
.greviews-track-wrap{overflow:hidden;}
.greviews-track{display:flex;gap:24px;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.greview-card{
min-width:calc(33.333% - 16px);
/*flex-shrink:0;*/
background:var(--onyx-card);border:1px solid var(--line);
border-radius:20px;padding:30px;display:flex;flex-direction:column;gap:16px;
}
.greview-top{display:flex;align-items:center;gap:12px;}
.greview-avatar{
width:42px;height:42px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
font-family:var(--display);font-weight:700;font-size:15px;color:var(--onyx);
}
.greview-name{font-size:14.5px;font-weight:600;}
.greview-date{font-size:12px;color:var(--muted);}
.greview-stars{color:#fbbf24;font-size:14px;letter-spacing:2px;}
.greview-text{font-size:14.5px;line-height:1.6;color:#dcdce2;flex-grow:1;}
.greview-source{
display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);
padding-top:12px;border-top:1px solid var(--line);
}
.greview-source .g-icon{width:13px;height:13px;}

/* ===== PHILOSOPHY ===== */
.philosophy{padding:120px 0;border-top:1px solid var(--line);}
.phi-grid{display:grid;grid-template-columns:0.9fr 1.6fr;gap:80px;}
.phi-label{font-family:var(--mono);font-size:12.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);padding-top:10px;}
.phi-statement{
font-family:var(--display);font-weight:500;font-size:clamp(26px,3vw,40px);line-height:1.32;letter-spacing:-0.015em;
color:var(--white);
}
.phi-statement em{
font-style:normal;color:var(--muted);
}
.phi-statement .hl{color:var(--white);position:relative;}
.phi-threads{display:flex;gap:56px;margin-top:56px;flex-wrap:wrap;}
.phi-thread{max-width:230px;}
.phi-thread .num{font-family:var(--mono);font-size:12px;color:var(--violet);margin-bottom:10px;display:block;}
.phi-thread h4{font-family:var(--display);font-size:18px;font-weight:600;margin-bottom:8px;}
.phi-thread p{font-size:14.5px;color:var(--muted);line-height:1.55;}

/* ===== VALUES (reuses services-card look) ===== */
.values{padding:110px 0;border-top:1px solid var(--line);}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px;gap:24px;flex-wrap:wrap;}
.section-head h2{font-family:var(--display);font-weight:700;font-size:clamp(30px,4vw,48px);letter-spacing:-0.02em;}
.section-head p{color:var(--muted);font-size:15px;max-width:340px;}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.value-card{
background:var(--onyx-card);border:1px solid var(--line);border-radius:20px;padding:30px 26px;
transition:all .4s ease;position:relative;overflow:hidden;
}
.value-card::after{
content:'';position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,0.5),rgba(139,92,246,0.35) 45%,transparent 72%);
filter:blur(36px);opacity:0;transition:opacity .5s ease;pointer-events:none;
}
.value-card:hover::after{opacity:1;}
.value-card:hover{border-color:var(--violet);transform:translateY(-4px);}
.value-num{font-family:var(--mono);font-size:12px;color:var(--violet);margin-bottom:20px;display:block;}
.value-card h3{font-family:var(--display);font-size:18px;font-weight:600;margin-bottom:10px;}
.value-card p{color:var(--muted);font-size:13.5px;line-height:1.6;}

/* ===== WORK ===== */
.work{padding:120px 0;border-top:1px solid var(--line);}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px;gap:24px;flex-wrap:wrap;}
.section-head h2{font-family:var(--display);font-weight:700;font-size:clamp(30px,4vw,48px);letter-spacing:-0.02em;}
.section-head p{color:var(--muted);font-size:15px;max-width:320px;}
.work-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;}
.work-grid .card:first-child{grid-row:span 2;}
.work-card{
position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line);
background:linear-gradient(155deg,var(--onyx-card),var(--onyx-raised));
min-height:0px;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;
cursor:pointer;transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .4s;
}
.work-grid .card:first-child{min-height:544px;}
.work-card::before{
content:'';position:absolute;inset:0;opacity:0;transition:opacity .5s;
background:radial-gradient(circle at 70% 20%,var(--violet-soft),transparent 60%);
}
.work-card:hover{transform:translateY(-6px);border-color:rgba(139,92,246,0.4);}
.work-card:hover::before{opacity:1;}
.work-tags{display:flex;gap:8px;margin-bottom:18px;position:relative;z-index:2;}
.tag{
font-family:var(--mono);font-size:11px;letter-spacing:0.05em;text-transform:uppercase;
padding:5px 11px;border-radius:100px;border:1px solid var(--line);color:var(--muted);
transition:all .3s;
}
.work-card:hover .tag{border-color:rgba(245,245,247,0.25);color:var(--white);}
.work-card h3{font-family:var(--display);font-size:26px;font-weight:600;margin-bottom:8px;position:relative;z-index:2;}
.work-card .desc{
color:var(--muted);font-size:14px;max-height:0;overflow:hidden;opacity:0;
transition:max-height .45s ease,opacity .35s ease,margin .4s;position:relative;z-index:2;
}
.work-card:hover .desc{max-height:60px;opacity:1;margin-top:8px;}
.work-card .arrow{
position:absolute;top:28px;right:28px;width:38px;height:38px;border-radius:50%;
border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
transition:all .35s;z-index:2;
}
.work-card:hover .arrow{background:var(--white);border-color:var(--white);transform:rotate(45deg);}
.work-card:hover .arrow svg{stroke:var(--onyx);}
.work-card .arrow svg{width:16px;height:16px;stroke:var(--white);}

/* ===== SERVICES ===== */
.services{padding:120px 0;border-top:1px solid var(--line);}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.service-card{
background:var(--onyx-card);border:1px solid var(--line);border-radius:20px;padding:36px 30px;
transition:all .4s ease;position:relative;overflow:hidden;
}
.service-card::after{
content:'';position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;
background:radial-gradient(circle,rgba(255,255,255,0.55),rgba(45,212,232,0.35) 45%,transparent 72%);
filter:blur(38px);opacity:0;transition:opacity .5s ease;pointer-events:none;
}
.service-card:hover::after{opacity:1;}
.service-card:nth-child(2){background:var(--onyx-raised);}
.service-card:hover{border-color:var(--cyan);transform:translateY(-4px);}
.service-card:hover .icon-wrap{background:var(--cyan-soft);border-color:var(--cyan);}
.icon-wrap{
width:48px;height:48px;border-radius:12px;border:1px solid var(--line);
display:flex;align-items:center;justify-content:center;margin-bottom:28px;transition:all .35s;
}
.icon-wrap svg{width:22px;height:22px;stroke:var(--white);}
.service-card h3{font-family:var(--display);font-size:21px;font-weight:600;margin-bottom:10px;}
.service-card p{color:var(--muted);font-size:14.5px;line-height:1.6;margin-bottom:22px;}
.service-list{list-style:none;display:flex;flex-direction:column;gap:9px;}
.service-list li{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:9px;font-family:var(--mono);}
.service-list li::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--violet);flex-shrink:0;}

/* ===== METRICS + TESTIMONIALS ===== */
.proof{padding:110px 0;border-top:1px solid var(--line);}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:100px;}
.metric{border-left:1px solid var(--line);padding-left:20px;}
.metric .num{
font-family:var(--display);font-weight:700;font-size:clamp(32px,4vw,52px);letter-spacing:-0.02em;
background:linear-gradient(100deg,var(--white),var(--muted));-webkit-background-clip:text;background-clip:text;color:transparent;
}
.metric .label{font-size:13.5px;color:var(--muted);margin-top:6px;}

.testi-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;}
.testi-head h2{font-family:var(--display);font-size:28px;font-weight:600;}
.testi-nav{display:flex;gap:10px;}
.testi-nav button{
width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--white);
cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;
}
.testi-nav button:hover{border-color:var(--violet);background:var(--violet-soft);}
.testi-track-wrap{overflow:hidden;}
.testi-track{display:flex;gap:28px;transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.testi-card{
min-width:calc(33.333% - 19px);background:var(--onyx-card);border:1px solid var(--line);border-radius:20px;
padding:34px;flex-shrink:0;
}
.testi-card .quote{font-size:15.5px;line-height:1.65;color:#dcdce2;margin-bottom:28px;min-height:130px;}
.testi-person{display:flex;align-items:center;gap:12px;}
.testi-avatar{
width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--cyan));
flex-shrink:0;
}
.testi-person .name{font-size:14.5px;font-weight:600;}
.testi-person .role{font-size:12.5px;color:var(--muted);}

/* ===== FOOTER CTA ===== */
.footer-cta{padding:130px 0 60px;border-top:1px solid var(--line);position:relative;}
.footer-cta h2{
font-family:var(--display);font-weight:700;font-size:clamp(38px,6vw,72px);letter-spacing:-0.03em;line-height:1.04;
max-width:820px;margin-bottom:70px;
}
.footer-cta h2 .accent{
background:linear-gradient(100deg,var(--violet),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent;
/*font-style:italic;*/
}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-bottom:80px;}
.contact-form{display:flex;flex-direction:column;gap:20px;}
.form-row{display:flex;gap:16px;}
.field{flex:1;}
.field label{
font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted);
display:block;margin-bottom:8px;
}
.field input,.field textarea{
width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);
color:var(--white);font-size:16px;padding:10px 2px;font-family:var(--body);transition:border-color .3s;
}
.field input:focus,.field textarea:focus{border-color:var(--cyan);}
.field input::placeholder,.field textarea::placeholder{color:#4a4a55;}
.form-submit{
margin-top:14px;align-self:flex-start;background:var(--white);color:var(--onyx);padding:15px 32px;
border-radius:100px;font-weight:600;font-size:14.5px;border:none;cursor:pointer;transition:all .3s;
display:inline-flex;align-items:center;gap:10px;
}
.form-submit:hover{background:var(--violet);color:#fff;box-shadow:0 0 30px rgba(139,92,246,0.45);}

.contact-info{display:flex;flex-direction:column;gap:36px;justify-content:center;}
.contact-info .row .k{
font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted);margin-bottom:8px;
}
.contact-info .row .v{font-size:16px;font-weight:500;}
.contact-info .row a.v:hover{color:var(--cyan);}
.social-row{display:flex;gap:18px;margin-top:8px;}
.social-row a{font-size:13.5px;color:var(--muted);border-bottom:1px solid transparent;transition:all .3s;}
.social-row a:hover{color:var(--white);border-color:var(--cyan);}

/* ===== ASK AI ===== */
.ask-ai{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);}
.ask-ai-title{font-family:var(--display);font-size:18px;font-weight:600;color:var(--white);margin-bottom:14px;}
.ask-ai-icons{display:flex;align-items:center;gap:13px;flex-wrap:wrap;}
.ask-ai-icons>a{
width:44px;height:44px;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;
position:relative;background:var(--onyx-card);transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.ask-ai-icons>a:hover{transform:translateY(-3px);border-color:var(--cyan);background:var(--cyan-soft);}
.ask-ai-icons svg{width:22px;height:22px;display:block;}
.ask-ai-icons svg path{fill:var(--muted);transition:fill .25s ease;}
.ask-ai-icons>a:hover svg path{fill:var(--white);}
.ask-ai-tooltip{
position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(4px);
background:#111118;color:var(--white);border:1px solid var(--line);border-radius:7px;padding:6px 8px;
font-size:11px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:.2s ease;z-index:5;
}
.ask-ai-icons>a:hover .ask-ai-tooltip,.ask-ai-icons>a:focus-visible .ask-ai-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}

.footer-bottom{
display:flex;justify-content:space-between;align-items:center;padding-top:32px;border-top:1px solid var(--line);
font-size:13px;color:var(--muted);flex-wrap:wrap;gap:12px;
}

/* ===== RESPONSIVE ===== */
@media (max-width:860px){
.wrap{padding:0 22px;}
.nav-links{
position:fixed;top:76px;left:0;right:0;bottom:0;background:var(--onyx);height: 100vh;
flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:36px 28px;gap:26px;
transform:translateX(100%);transition:transform .4s ease;z-index:40;
}
.nav-links.open{transform:translateX(0);}
.nav-links a{font-size:17px;}
.nav-toggle{display:block;}
.hero{padding:70px 0 60px;}
.hero-sub{flex-direction:column;align-items:flex-start;gap:28px;}
.phi-grid{grid-template-columns:1fr;gap:32px;}
.values-grid{grid-template-columns:1fr 1fr;}
.work-grid{grid-template-columns:1fr;}
.work-grid .card:first-child{min-height:320px;}
.services-grid{grid-template-columns:1fr;}
.metrics{grid-template-columns:repeat(2,1fr);row-gap:36px;}
.testi-card{min-width:100%;}
.footer-grid{grid-template-columns:1fr;gap:56px;}
.form-row{flex-direction:column;}
.footer-cta{padding:80px 0 40px;}
.philosophy,.work,.services,.proof,.greviews{padding:80px 0;}
.greview-card{min-width:100%;}
.logo-item{padding:0 34px;font-size:18px;}
}

@media (prefers-reduced-motion:reduce){
*{animation:none!important;transition-duration:.01ms!important;}
}

.whatsapp-float {
position: fixed;
right: 24px;
bottom: 24px;
width: 58px;
height: 58px;
display: flex;
align-items: center;
justify-content: center;
background: #25D366;
border-radius: 50%;
z-index: 99999;
text-decoration: none;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
transition: transform 0.3s ease, box-shadow 0.3s ease;
animation: whatsappPulse 2.5s infinite;
}

.whatsapp-float svg {
width: 31px;
height: 31px;
fill: #fff;
}

.whatsapp-float:hover {
transform: translateY(-4px) scale(1.06);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}

.whatsapp-tooltip {
position: absolute;
right: 70px;
white-space: nowrap;
background: #111;
color: #fff;
padding: 9px 14px;
border-radius: 8px;
font: 500 13px/1.2 Arial, sans-serif;
opacity: 0;
visibility: hidden;
transform: translateX(8px);
transition: all 0.25s ease;
pointer-events: none;
}

.whatsapp-tooltip::after {
content: "";
position: absolute;
right: -6px;
top: 50%;
width: 10px;
height: 10px;
background: #111;
transform: translateY(-50%) rotate(45deg);
}

.whatsapp-float:hover .whatsapp-tooltip {
opacity: 1;
visibility: visible;
transform: translateX(0);
}

@keyframes whatsappPulse {
0% {
box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.45),
0 10px 30px rgba(0, 0, 0, 0.18);
}

70% {
box-shadow: 0 0 0 13px rgba(37, 211, 102, 0),
0 10px 30px rgba(0, 0, 0, 0.18);
}

100% {
box-shadow: 0 0 0 0 rgba(37, 211, 102, 0),
0 10px 30px rgba(0, 0, 0, 0.18);
}
}

@media (max-width: 768px) {
.whatsapp-float {
right: 16px;
bottom: 16px;
width: 54px;
height: 54px;
}

.whatsapp-float svg {
width: 28px;
height: 28px;
}

.whatsapp-tooltip {
display: none;
}
}

@media (prefers-reduced-motion: reduce) {
.whatsapp-float {
animation: none;
}
}

/* ===== AEO FAQ ACCORDION ===== */
.faq{padding:120px 0;border-top:1px solid var(--line);}
.faq .section-head{margin-bottom:42px;}
.faq-list{max-width:980px;margin:0 auto;border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 0;background:none;border:0;color:var(--white);font-family:var(--display);font-size:clamp(17px,2vw,21px);font-weight:600;text-align:left;cursor:pointer;}
.faq-q:hover{color:var(--cyan);}
.faq-q .plus{position:relative;width:20px;height:20px;flex:0 0 20px;}
.faq-q .plus::before,.faq-q .plus::after{content:'';position:absolute;left:50%;top:50%;width:16px;height:1.5px;background:currentColor;transform:translate(-50%,-50%);transition:transform .3s ease;}
.faq-q .plus::after{transform:translate(-50%,-50%) rotate(90deg);}
.faq-item.open .faq-q .plus::after{transform:translate(-50%,-50%) rotate(0deg);}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease;}
.faq-a-inner{overflow:hidden;}
.faq-a p{max-width:850px;padding:0 50px 0 0;color:#dcdce2;font-size:15px;line-height:1.75;}
.faq-item.open .faq-a{grid-template-rows:1fr;}
.faq-item.open .faq-a p{padding-bottom:26px;}
@media(max-width:860px){.faq{padding:80px 0}.faq-q{padding:21px 0}.faq-a p{padding-right:20px;}}

/* ===== PIXEL WEAVER NAV VOICE + GO TOP ===== */
.pwbot-voice-toggle{
  position:absolute;top:38px;right:210px;z-index:9;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(245,245,247,.14);background:rgba(18,18,24,.82);color:var(--muted);
  display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(10px);transition:all .25s ease;
}
.pwbot-voice-toggle:hover,.pwbot-voice-toggle.active{color:var(--cyan);border-color:rgba(45,212,232,.5);box-shadow:0 0 20px rgba(45,212,232,.16)}
.pwbot-voice-toggle svg{width:17px;height:17px}
.go-top-btn{
  position:fixed;right:22px;bottom:22px;z-index:80;width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(245,245,247,.14);background:rgba(18,18,24,.86);color:var(--white);
  display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(12px);
  opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease,visibility .25s,border-color .25s,box-shadow .25s;
  box-shadow:0 12px 30px rgba(0,0,0,.25)
}
.go-top-btn.show{opacity:1;visibility:visible;transform:translateY(0)}
.go-top-btn:hover{border-color:var(--cyan);box-shadow:0 0 24px rgba(45,212,232,.22)}
.go-top-btn svg{width:18px;height:18px}
.nav-links a.pwbot-reacting{color:var(--white)}
.nav-links a.pwbot-reacting::after{width:100%!important}
@media(max-width:620px){.pwbot-voice-toggle{top:16px;right:202px;width:36px;height:36px}.go-top-btn{right:14px;bottom:14px}}

/* Floating Go to Top */
.pw-go-top{
  position:fixed;right:24px;bottom:24px;z-index:9999;
  width:54px;height:54px;border-radius:16px;border:1px solid rgba(45,212,232,.28);
  background:rgba(10,10,14,.88);backdrop-filter:blur(14px);
  color:var(--white);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;box-shadow:0 14px 38px rgba(0,0,0,.34),0 0 24px rgba(45,212,232,.08);
  opacity:0;visibility:hidden;transform:translateY(14px) scale(.94);
  transition:opacity .25s ease,transform .25s ease,visibility .25s,border-color .25s,box-shadow .25s;
  cursor:pointer;
}
.pw-go-top.show{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.pw-go-top:hover{border-color:var(--cyan);box-shadow:0 14px 38px rgba(0,0,0,.34),0 0 28px rgba(45,212,232,.22);transform:translateY(-3px)}
.pw-go-top svg{width:20px;height:20px;color:var(--cyan)}
.pw-go-top span{font-family:var(--mono);font-size:7px;letter-spacing:.14em;color:var(--muted)}
@media(max-width:620px){.pw-go-top{right:14px;bottom:14px;width:50px;height:50px;border-radius:14px}}