:root{
  --bg:#090c13;
  --bg-2:#0e1320;
  --paper:#f2f1ec;
  --paper-2:#e8e7e1;
  --ink:#111318;
  --muted:#858b99;
  --line:rgba(255,255,255,.09);
  --line-dark:rgba(10,12,18,.12);
  --divider-light:rgba(17,19,24,.16);
  --divider-dark:rgba(255,255,255,.16);
  --neon:#7c6cff;
  --brand-violet:#8B59FB;
  --neon-2:#52d6ff;
  --neon-3:#5effb6;
  --coral:#ff6f5f;
  --glow:0 0 24px rgba(124,108,255,.28),0 0 60px rgba(82,214,255,.10);
  --radius:28px;
  --container:min(1480px,calc(100vw - 64px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:#f4f6fb;background:var(--bg);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
::selection{background:var(--neon);color:white}
.container{width:var(--container);margin:0 auto;position:relative;z-index:2}
.section{position:relative;padding:120px 0}
.dark-section{background:linear-gradient(180deg,#090c13,#0a0d15 55%,#080b11)}
.noise{position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.055;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.cursor-glow{position:fixed;width:440px;height:440px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(90,98,255,.11),rgba(82,214,255,.06) 28%,transparent 68%);filter:blur(12px);transform:translate(-50%,-50%);left:50%;top:50%}
.progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:10000;background:rgba(255,255,255,.04)}
.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 16px var(--neon)}
.glass{background:rgba(13,17,28,.68);border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);box-shadow:0 20px 60px rgba(0,0,0,.22)}
.site-header{position:fixed;left:28px;right:28px;top:20px;height:64px;z-index:9999;border-radius:18px;display:flex;align-items:center;padding:0 16px 0 18px;gap:28px;box-shadow:0 8px 18px rgba(0,0,0,.16),0 14px 34px rgba(0,0,0,.14),0 1px 0 rgba(255,255,255,.035) inset,0 0 0 1px rgba(255,255,255,.03);}
.brand{display:flex;align-items:center;min-width:220px}.brand-logo{display:block;width:210px;height:auto;max-height:32px;object-fit:contain;object-position:left center}.brand-word{display:none!important}.brand-mark,.brand-type{display:none!important}.brand-mark{width:34px;height:34px;position:relative;display:inline-block}.brand-mark:before{content:"";position:absolute;inset:4px;border:1px solid #fff}.brand-mark i{position:absolute;width:14px;height:14px;right:0;bottom:0;border-radius:50%;background:var(--neon);box-shadow:0 0 18px rgba(124,108,255,.9)}.brand-mark b{position:absolute;width:7px;height:7px;border-radius:50%;right:3px;bottom:3px;background:white}.brand-type{display:flex;flex-direction:column;line-height:.82;font-size:14px;letter-spacing:.02em}.nav{display:flex;gap:24px;margin-left:auto;align-items:center}.nav a{position:relative;display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 8px;font-size:14px;font-weight:500;color:#c7ced9;letter-spacing:-.01em;transition:color .22s ease,opacity .22s ease}.nav a:before{content:"";position:absolute;left:-6px;right:-6px;top:5px;bottom:5px;border-radius:999px;background:radial-gradient(circle at 50% 100%,rgba(139,89,251,.14),rgba(82,214,255,.06) 48%,transparent 72%);opacity:0;transform:scale(.92);transition:opacity .22s ease,transform .22s ease}.nav a:after{content:"";position:absolute;left:8px;right:8px;bottom:1px;height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(139,89,251,0),rgba(139,89,251,.9) 24%,rgba(82,214,255,.85) 76%,rgba(82,214,255,0));box-shadow:0 0 12px rgba(139,89,251,.18);opacity:0;transform:scaleX(.55);transform-origin:center;transition:opacity .22s ease,transform .22s ease}.nav a:hover{color:#eef2fb}.nav a:hover:before{opacity:.48;transform:scale(1)}.nav a:hover:after{opacity:.65;transform:scaleX(.82)}.nav a.active{color:#f4f6fb}.nav a.active:before{opacity:.72;transform:scale(1)}.nav a.active:after{opacity:1;transform:scaleX(1)}
.button{position:relative;display:inline-flex;align-items:center;justify-content:space-between;gap:26px;min-height:54px;padding:0 18px 0 22px;border-radius:14px;border:1px solid rgba(147,139,255,.42);background:linear-gradient(180deg,rgba(124,108,255,.20),rgba(124,108,255,.10));color:white;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),var(--glow);overflow:hidden;transition:.3s;cursor:pointer}.button:before{content:"";position:absolute;inset:-1px;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.18),transparent 72%);transform:translateX(-120%);transition:.55s}.button:hover:before{transform:translateX(120%)}.button:hover{transform:translateY(-2px);border-color:rgba(130,213,255,.65);box-shadow:0 0 28px rgba(124,108,255,.28),0 14px 40px rgba(0,0,0,.25)}.button em{font-style:normal;color:#a7f3ff}.button-small{min-height:42px;padding:0 14px 0 16px;font-size:13px}.text-link{color:#9aa3b4;font-size:15px}.text-link span{color:white;border-bottom:1px solid rgba(255,255,255,.3)}
.hero{min-height:100vh;padding-top:160px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.hero-bg-grid,.process-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 95%)}.hero:before{content:"";position:absolute;width:900px;height:900px;left:-320px;top:-310px;border-radius:50%;background:radial-gradient(circle,rgba(124,108,255,.18),rgba(82,214,255,.05) 45%,transparent 69%);filter:blur(30px)}.hero-layout{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:80px}.hero-copy{position:relative;z-index:6}.hero-copy .eyebrow,.hero-copy .hero-lead,.hero-copy .hero-actions{position:relative;z-index:7}.eyebrow{display:flex;align-items:center;gap:11px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#aeb6c5}.eyebrow span{width:24px;height:1px;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 10px var(--neon)}.hero h1{position:relative;z-index:5;display:inline-block;overflow:visible;font-size:clamp(64px,7.1vw,126px);line-height:.89;letter-spacing:-.055em;margin:24px 0 34px;font-weight:760;color:#f4f6fb;--cast-x:12px;--cast-y:16px;--cast-x2:20px;--cast-y2:28px;--cast-x3:33px;--cast-y3:46px;filter:drop-shadow(var(--cast-x) var(--cast-y) 6px rgba(0,0,0,.40)) drop-shadow(var(--cast-x2) var(--cast-y2) 20px rgba(0,0,0,.24)) drop-shadow(var(--cast-x3) var(--cast-y3) 42px rgba(0,0,0,.12));transition:filter .08s linear;will-change:filter}.hero h1 .hero-accent{color:var(--brand-violet);text-shadow:none}.heading-accent{color:var(--brand-violet)}.hero h1 em{font-style:normal;color:inherit;text-shadow:none}.hero-lead{max-width:720px;color:#a8afbd;font-size:19px;line-height:1.65;margin:0}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:38px}.hero-stage{height:640px;position:relative;transform-style:preserve-3d;perspective:1200px}.stage-glow{position:absolute;width:420px;height:420px;left:50%;top:48%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(85,100,255,.28),rgba(82,214,255,.09) 35%,transparent 70%);filter:blur(12px)}.stage-frame{position:absolute;border:1px solid rgba(136,147,255,.35);border-radius:30px;box-shadow:inset 0 0 42px rgba(124,108,255,.04),0 0 42px rgba(124,108,255,.05)}.frame-back{width:77%;height:70%;left:9%;top:16%;transform:rotate(-8deg)}.frame-mid{width:68%;height:61%;right:4%;top:22%;transform:rotate(7deg);border-color:rgba(82,214,255,.28)}.stage-window{position:absolute;left:10%;right:3%;top:19%;bottom:8%;border-radius:30px;background:linear-gradient(160deg,rgba(22,29,46,.96),rgba(11,15,26,.96));border:1px solid rgba(255,255,255,.10);box-shadow:0 45px 90px rgba(0,0,0,.38),0 0 58px rgba(124,108,255,.14);overflow:hidden}.window-top{height:48px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:7px;padding:0 18px}.window-top span{width:7px;height:7px;border-radius:50%;background:#495064}.window-top span:first-child{background:var(--coral)}.window-top span:nth-child(2){background:#f0c76d}.window-top span:nth-child(3){background:var(--neon-3)}.window-body{padding:40px}.mock-title{font-size:34px;font-weight:780;letter-spacing:-.04em}.mock-rule{margin-top:14px;width:55%;height:8px;border-radius:999px;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 24px rgba(124,108,255,.25)}.mock-grid{display:grid;grid-template-columns:1.1fr .9fr;grid-template-rows:1fr 1fr;gap:16px;margin-top:42px;height:320px}.mock-card{border-radius:18px;border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden;background:#12192a}.mock-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(124,108,255,.26),transparent 45%)}.mock-card.c1{grid-row:1/3;background:linear-gradient(145deg,#171d2b,#111624)}.mock-card.c2{background:linear-gradient(135deg,#1b1835,#121729)}.mock-card.c3{background:linear-gradient(135deg,#14252d,#111725)}.mock-card.c4{display:none}.stage-chip{position:absolute;padding:11px 15px;border-radius:999px;background:rgba(12,16,26,.74);border:1px solid rgba(255,255,255,.13);font-size:11px;letter-spacing:.14em;color:#dfe7f8;backdrop-filter:blur(12px);box-shadow:0 0 24px rgba(124,108,255,.12)}.chip-a{right:0;top:13%}.chip-b{left:0;bottom:17%}.chip-c{right:10%;bottom:2%}.hero-orbit{position:absolute;border-radius:50%;border:1px solid rgba(124,108,255,.14);box-shadow:0 0 40px rgba(124,108,255,.04)}.orbit-a{width:680px;height:680px;right:-270px;top:120px}.orbit-b{width:440px;height:440px;right:-100px;top:250px;border-color:rgba(82,214,255,.15)}.hero-blob{position:absolute;border-radius:50%;filter:blur(2px)}.blob-a{width:12px;height:12px;background:var(--neon-2);box-shadow:0 0 24px var(--neon-2);right:16%;top:23%}.blob-b{width:8px;height:8px;background:var(--neon-3);box-shadow:0 0 18px var(--neon-3);left:11%;bottom:18%}.hero-ticker{position:absolute;bottom:0;left:0;right:0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);overflow:hidden;background:rgba(255,255,255,.02)}.ticker-track{display:flex;align-items:center;width:max-content;padding:17px 0;animation:ticker 112s linear infinite;color:#7f8795;font-size:12px;letter-spacing:.18em;will-change:transform}.ticker-group{display:flex;align-items:center;gap:28px;flex:none;padding-right:28px}.ticker-track i{width:5px;height:5px;flex:0 0 auto;border-radius:50%;background:var(--neon);box-shadow:0 0 12px var(--neon)}@keyframes ticker{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.statement{background:var(--paper);color:var(--ink)}.statement-grid{display:grid;grid-template-columns:180px 1fr 360px;gap:44px;align-items:start}.section-index{display:flex;align-items:center;gap:11px;font-size:11px;letter-spacing:.15em;color:#70757e;padding-top:9px}.section-index:before{content:"";width:24px;height:1px;flex:0 0 auto;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 10px rgba(124,108,255,.28)}.big-statement{font-size:clamp(38px,4vw,68px);letter-spacing:-.045em;line-height:1.03;margin:0;max-width:1050px}.big-statement strong{font-weight:760;color:var(--brand-violet)}.statement-side{font-size:18px;line-height:1.65;color:#5c626d;padding-left:0}.statement-side p{margin:0}.copy-divider,.section-head p,.process-copy p,.contact-copy p{position:relative;padding-left:28px}.copy-divider:before,.section-head p:before,.process-copy p:before,.contact-copy p:before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:1px;background:var(--divider-light)}.dark-section .copy-divider:before,.dark-section .section-head p:before,.dark-section .process-copy p:before,.dark-section .contact-copy p:before{background:var(--divider-dark)}
.section-head{display:grid;grid-template-columns:1fr 420px;gap:60px;align-items:end;margin-bottom:54px}.section-head h2{font-size:clamp(46px,5vw,80px);letter-spacing:-.05em;line-height:.95;margin:18px 0 0}.section-head p{color:#969eac;line-height:1.6;font-size:17px;margin:0;max-width:420px}.section-aura{position:absolute;border-radius:50%;filter:blur(50px);pointer-events:none}.aura-left{width:520px;height:520px;left:-220px;top:10%;background:rgba(124,108,255,.10)}.aura-right{width:560px;height:560px;right:-240px;bottom:2%;background:rgba(82,214,255,.08)}
.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.project-card{position:relative}.project-visual{height:520px;border-radius:26px;border:1px solid rgba(255,255,255,.10);overflow:hidden;position:relative;transform-style:preserve-3d;background:#111522;box-shadow:0 30px 60px rgba(0,0,0,.25);transition:border-color .3s,box-shadow .3s}.project-card:hover .project-visual{border-color:rgba(137,133,255,.36);box-shadow:0 38px 78px rgba(0,0,0,.35),0 0 40px rgba(124,108,255,.08)}.visual-light{position:absolute;width:420px;height:420px;border-radius:50%;right:-110px;top:-130px;background:radial-gradient(circle,rgba(124,108,255,.28),transparent 67%);filter:blur(10px);transition:transform .25s}.visual-1{background:linear-gradient(145deg,#151c2a,#0d1119)}.visual-layer{position:absolute;border-radius:24px;border:1px solid rgba(255,255,255,.1)}.visual-1 .l1{left:7%;right:12%;top:8%;height:28%;background:linear-gradient(120deg,rgba(82,214,255,.07),rgba(124,108,255,.12));transform:translateZ(24px)}.visual-1 .l2{left:10%;width:42%;bottom:9%;height:44%;background:linear-gradient(145deg,#1f2635,#121823);transform:translateZ(40px)}.visual-1 .l3{right:9%;width:35%;bottom:12%;height:35%;background:linear-gradient(145deg,#191d31,#111624);transform:translateZ(55px)}.fake-browser{position:absolute;left:11%;right:13%;top:17%;height:48%;border-radius:18px;background:#e9e5da;color:#141518;box-shadow:0 20px 45px rgba(0,0,0,.3);transform:translateZ(75px);overflow:hidden}.fb-top{height:26px;background:#d3d0c7}.fb-copy{padding:34px}.fb-copy b{font-size:34px;display:block}.fb-copy span{font-size:13px;color:#6c6d70}.visual-2{background:radial-gradient(circle at 70% 30%,#241e4a 0,#101522 45%,#0c1017 100%)}.neon-rim{position:absolute;border-radius:50%;border:1px solid rgba(127,112,255,.35);box-shadow:inset 0 0 30px rgba(124,108,255,.05),0 0 30px rgba(124,108,255,.06)}.rim-a{width:440px;height:440px;right:-120px;top:-90px}.rim-b{width:280px;height:280px;right:-35px;top:10px;border-color:rgba(82,214,255,.32)}.car-line{position:absolute;left:7%;right:7%;bottom:24%;height:130px;border-top:2px solid rgba(94,255,182,.75);border-radius:55% 45% 0 0/80% 80% 0 0;filter:drop-shadow(0 0 12px rgba(94,255,182,.45));transform:skewX(-14deg)}.fake-label{position:absolute;left:7%;bottom:8%;font-size:32px;font-weight:780;letter-spacing:-.04em}.visual-3{background:linear-gradient(145deg,#e9e6dd,#d9d5cb);color:#17181c}.identity-board{position:absolute;left:8%;right:8%;top:9%;height:31%;background:#f7f4ed;border:1px solid rgba(0,0,0,.12);padding:34px;transform:rotate(-1.2deg);box-shadow:0 20px 50px rgba(0,0,0,.12)}.identity-board b{font-size:54px;letter-spacing:.04em}.identity-board span{position:absolute;left:35px;bottom:20px;color:#777}.identity-board i{position:absolute;width:52px;height:52px;border-radius:50%;background:#ef603d;right:35px;top:50%;transform:translateY(-50%)}.graph{position:absolute;left:8%;bottom:10%;width:47%;height:38%;background:linear-gradient(145deg,#181b20,#111317);border-radius:2px}.graph:before{content:"";position:absolute;left:12%;right:12%;bottom:18%;height:2px;background:linear-gradient(90deg,#ef603d 0 18%,transparent 18% 34%,#ef603d 34% 52%,transparent 52% 67%,#ef603d 67% 100%);transform:skewY(-24deg);box-shadow:0 0 12px rgba(239,96,61,.35)}.visual-4{background:radial-gradient(circle at 65% 33%,#2b245b 0,#111629 40%,#09101b 100%)}.echo-orbit{position:absolute;width:440px;height:440px;border-radius:50%;right:-70px;top:-60px;border:1px solid rgba(126,108,255,.28);box-shadow:inset 0 0 60px rgba(124,108,255,.06)}.echo-orbit:before,.echo-orbit:after{content:"";position:absolute;inset:17%;border-radius:50%;border:1px solid rgba(126,108,255,.20)}.echo-orbit:after{inset:34%}.echo-hex{position:absolute;width:150px;height:130px;background:rgba(94,255,182,.08);border:1px solid rgba(94,255,182,.65);clip-path:polygon(25% 6%,75% 6%,100% 50%,75% 94%,25% 94%,0 50%);bottom:15%}.h1{left:10%}.h2{left:31%;background:rgba(124,108,255,.12);border-color:rgba(124,108,255,.8)}.echo-dot{position:absolute;width:48px;height:48px;border-radius:50%;background:rgba(255,111,95,.24);border:1px solid var(--coral);left:55%;bottom:22%;box-shadow:0 0 28px rgba(255,111,95,.14)}.project-meta{display:flex;align-items:end;justify-content:space-between;padding:20px 4px 8px}.project-meta small{font-size:11px;color:#7f8795;text-transform:uppercase;letter-spacing:.13em}.project-meta h3{font-size:26px;margin:7px 0 0;letter-spacing:-.025em}.project-meta a{font-size:13px;color:#a5adbb}
.services{background:var(--paper);color:var(--ink)}.services .section-head p{color:#676d77}.services .eyebrow{color:#6e727b}.service-list{border-top:1px solid var(--line-dark)}.service-row{display:grid;grid-template-columns:80px 1fr 1.25fr 30px;gap:28px;align-items:center;padding:32px 6px;border-bottom:1px solid var(--line-dark);transition:.3s}.service-row:hover{padding-left:18px;background:linear-gradient(90deg,rgba(92,93,247,.06),transparent)}.service-row span{font-size:clamp(22px,1.25vw,36px);line-height:1;color:var(--brand-violet);font-weight:820;letter-spacing:-.045em;font-variant-numeric:tabular-nums;opacity:.78;transition:opacity .25s ease,transform .25s ease,text-shadow .25s ease}.service-row:hover span{opacity:1;transform:translateX(3px);text-shadow:0 0 18px rgba(139,89,251,.18)}.service-row h3{font-size:30px;margin:0;letter-spacing:-.035em}.service-row p{margin:0;color:#6a7079;line-height:1.55}.service-row b{font-size:22px;color:#5c5df7}
.process-section{overflow:hidden}.process-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px;align-items:center}.process-copy h2{font-size:clamp(58px,6vw,96px);line-height:.92;letter-spacing:-.055em;margin:20px 0 28px}.process-copy p{color:#959dab;font-size:18px;line-height:1.65;max-width:560px}.process-stage{height:720px;border-radius:32px;border:1px solid rgba(255,255,255,.09);position:relative;overflow:hidden;background:linear-gradient(180deg,#0c1017 0%,#0a0f18 100%)}.process-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 74% 20%,rgba(124,108,255,.18),transparent 38%),radial-gradient(circle at 32% 58%,rgba(82,214,255,.10),transparent 33%)}.process-stage:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-110px;top:-110px;background:radial-gradient(circle,rgba(124,108,255,.20),transparent 72%);filter:blur(8px)}.process-flow{position:absolute;inset:0;pointer-events:none;z-index:1}.process-flow:before,.process-flow:after{content:"";position:absolute;height:1px;transform-origin:left center;opacity:.85}.process-flow:before{left:31%;top:34%;width:35%;background:linear-gradient(90deg,rgba(82,214,255,.10),rgba(124,108,255,.75),rgba(124,108,255,.16));box-shadow:0 0 24px rgba(124,108,255,.18);transform:rotate(14deg)}.process-flow:after{left:37%;top:60%;width:31%;background:linear-gradient(90deg,rgba(255,115,89,.14),rgba(82,214,255,.55),rgba(255,255,255,.12));box-shadow:0 0 18px rgba(82,214,255,.12);transform:rotate(-16deg)}.process-point{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--neon-2);box-shadow:0 0 18px var(--neon-2);z-index:1;opacity:.9}.process-point.pp1{left:32%;top:35%}.process-point.pp2{left:63%;top:44%}.process-point.pp3{left:47%;top:64%;background:var(--coral);box-shadow:0 0 16px rgba(255,115,89,.65)}.process-card{position:absolute;width:58%;padding:26px 28px 24px;border-radius:24px;border:1px solid rgba(255,255,255,.10);box-shadow:0 28px 50px rgba(0,0,0,.24);backdrop-filter:blur(12px);z-index:3;overflow:hidden;cursor:default;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,z-index 0s linear .02s}.process-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 30%);pointer-events:none}.process-card small{display:block;font-size:16px;line-height:1.2;letter-spacing:.055em;color:#a69cff;font-weight:780}.process-card h3{font-size:34px;letter-spacing:-.04em;margin:16px 0 8px}.process-card p{margin:0;color:#abb2c0;line-height:1.5}.process-visual{position:relative;height:132px;margin-top:18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);overflow:hidden;background:rgba(255,255,255,.03)}.process-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 40%)}.pc1{left:7%;top:7%;background:rgba(25,33,47,.92);z-index:3}.pc2{right:7%;top:36%;background:rgba(40,33,68,.93);border-color:rgba(124,108,255,.32);z-index:4}.pc3{left:14%;bottom:6%;background:rgba(241,239,233,.96);color:#17181c;z-index:5}.pc3 small{color:var(--coral)}.pc3 p{color:#696d72}.pv-context{background:linear-gradient(145deg,rgba(14,18,28,.88),rgba(21,27,41,.76))}.pv-context .context-users{position:absolute;left:16px;top:18px;display:flex;gap:10px}.pv-context .user-chip{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);font-size:12px;color:#aeb6c5}.pv-context .user-chip.active{background:rgba(82,214,255,.12);border-color:rgba(82,214,255,.35);color:#e9fbff;box-shadow:0 0 18px rgba(82,214,255,.12)}.pv-context .context-arrow{position:absolute;left:18px;right:18px;bottom:54px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(82,214,255,.8),rgba(255,255,255,.06))}.pv-context .context-arrow:after{content:"";position:absolute;right:-2px;top:-4px;width:10px;height:10px;border-top:1px solid rgba(82,214,255,.85);border-right:1px solid rgba(82,214,255,.85);transform:rotate(45deg)}.pv-context .context-goal{position:absolute;left:18px;bottom:14px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.04);font-size:12px;color:#dfe6f7}.pv-context .context-cta{position:absolute;right:16px;bottom:14px;padding:8px 12px;border-radius:11px;background:linear-gradient(135deg,rgba(124,108,255,.30),rgba(82,214,255,.18));border:1px solid rgba(124,108,255,.35);font-size:12px;color:#f1f4fb}.pv-system{background:linear-gradient(145deg,rgba(32,24,58,.78),rgba(26,28,54,.86))}.pv-system .sys-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:22px 22px;opacity:.45}.pv-system .sys-type{position:absolute;left:18px;right:130px;top:22px;height:44px}.pv-system .sys-type span{display:block;height:10px;margin-bottom:9px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.86),rgba(255,255,255,.16))}.pv-system .sys-type span:last-child{width:72%}.pv-system .sys-palette{position:absolute;right:18px;top:22px;display:grid;grid-template-columns:repeat(2,18px);gap:8px}.pv-system .sys-palette i{display:block;width:18px;height:18px;border-radius:6px;background:#7c6cff;box-shadow:0 0 14px rgba(124,108,255,.2)}.pv-system .sys-palette i:nth-child(2){background:#52d6ff}.pv-system .sys-palette i:nth-child(3){background:#ff7359}.pv-system .sys-palette i:nth-child(4){background:#f1efea}.pv-system .sys-modules{position:absolute;left:18px;right:18px;bottom:18px;display:grid;grid-template-columns:1.2fr .8fr;gap:10px}.pv-system .sys-modules b,.pv-system .sys-modules i{display:block;height:28px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}.pv-system .sys-modules i{height:28px}.pv-apply{background:linear-gradient(145deg,rgba(246,244,238,.92),rgba(237,234,225,.90))}.pv-apply:before{background:linear-gradient(180deg,rgba(0,0,0,.03),transparent 50%)}.pv-apply .apply-track{position:absolute;left:16px;right:16px;top:16px;bottom:16px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.pv-apply .apply-item{position:relative;border-radius:14px;background:rgba(255,255,255,.7);border:1px solid rgba(20,24,34,.08);overflow:hidden}.pv-apply .apply-item:before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:linear-gradient(90deg,var(--brand-violet),#52d6ff)}.pv-apply .apply-item:after{content:"";position:absolute;left:12px;right:12px;bottom:12px;height:26px;border-radius:8px;background:linear-gradient(90deg,rgba(0,0,0,.10),rgba(0,0,0,.04))}.pv-apply .apply-item span{position:absolute;left:12px;top:18px;right:12px;height:42px;border-radius:10px;background:rgba(10,13,19,.08)}.pv-apply .apply-item i{position:absolute;left:12px;right:12px;top:70px;height:10px;border-radius:999px;background:rgba(10,13,19,.08)}.pv-apply .apply-item i:last-child{top:88px;width:55%}.process-label{position:absolute;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#8d95a5;z-index:2;opacity:.88}.process-label.l1{left:9%;top:5%}.process-label.l2{right:10%;top:31%}.process-label.l3{left:18%;bottom:4.4%}
.articles{background:var(--paper);color:var(--ink)}.articles .section-head p{color:#686e78}.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.article-card{min-height:360px;padding:34px;border:1px solid var(--line-dark);border-radius:24px;display:flex;flex-direction:column;background:linear-gradient(180deg,#f8f7f2,#efeee8);transition:.3s;position:relative;overflow:hidden}.article-card:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-120px;top:-120px;background:radial-gradient(circle,rgba(92,93,247,.11),transparent 68%)}.article-card:hover{transform:translateY(-6px);box-shadow:0 28px 70px rgba(25,26,31,.1)}.article-card span{font-size:10px;font-weight:700;letter-spacing:.13em;color:#5c5df7}.article-card h3{font-size:31px;line-height:1.05;letter-spacing:-.04em;margin:24px 0 20px}.article-card p{color:#666c75;line-height:1.6;margin:0}.article-card a{margin-top:auto;font-size:13px;font-weight:700}
.contact{overflow:hidden}.contact-aura{position:absolute;width:900px;height:900px;border-radius:50%;right:-320px;top:-350px;background:radial-gradient(circle,rgba(124,108,255,.20),rgba(82,214,255,.07) 37%,transparent 70%);filter:blur(18px)}.contact-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:start}.contact-copy h2{font-size:clamp(58px,6vw,96px);line-height:.94;letter-spacing:-.055em;margin:22px 0 28px}.contact-copy h2 em{font-style:normal;color:#8d84ff}.contact-copy p{color:#989fad;line-height:1.65;font-size:18px;max-width:640px}.mail-link{display:inline-block;margin-top:38px;font-size:24px;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:6px}.contact-form{padding:34px;border-radius:28px}.contact-form label{display:block;font-size:11px;color:#aeb6c3;text-transform:uppercase;letter-spacing:.11em;margin-bottom:18px}.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;margin-top:9px;border-radius:13px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.045);color:white;padding:15px 16px;outline:none;transition:.25s}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:rgba(124,108,255,.68);box-shadow:0 0 0 4px rgba(124,108,255,.08),0 0 28px rgba(124,108,255,.06)}.contact-form option{background:#111624}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-note{font-size:11px;color:#747d8e;line-height:1.5}.form-success{display:none;margin-top:16px;border:1px solid rgba(94,255,182,.25);background:rgba(94,255,182,.07);padding:14px 16px;border-radius:12px;color:#c9ffe8;font-size:13px}.contact-form.sent .form-success{display:block}
.footer{background:#06080d;border-top:1px solid rgba(255,255,255,.07)}.footer-row{min-height:100px;display:flex;align-items:center;justify-content:space-between;color:#767e8e;font-size:12px;letter-spacing:.08em}
.reveal{opacity:1;transform:none}.js-reveal .reveal{opacity:0;transform:translateY(34px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}.js-reveal .reveal.is-visible{opacity:1;transform:none}.parallax{will-change:transform}.tilt-card,.parallax-tilt{will-change:transform;transition:transform .2s ease-out}
@media(max-width:1100px){.nav{display:none}.hero-layout,.process-layout,.contact-layout{grid-template-columns:1fr}.hero-stage{height:560px}.statement-grid{grid-template-columns:1fr}.statement-side{max-width:700px}.portfolio-grid{grid-template-columns:1fr}.section-head{grid-template-columns:1fr}.article-grid{grid-template-columns:1fr}.project-visual{height:480px}.process-stage{height:620px}.service-row{grid-template-columns:68px 1fr}.service-row p{grid-column:2}.service-row b{display:none}}
@media(max-width:700px){:root{--container:calc(100vw - 34px)}.section{padding:84px 0}.site-header{left:10px;right:10px;top:10px;height:62px;border-radius:16px}.brand{min-width:auto}.brand-type{font-size:12px}.site-header .button{display:none}.hero{padding-top:120px}.hero h1{font-size:56px}.hero-lead{font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-stage{height:430px;margin-top:30px}.stage-window{left:2%;right:2%;top:14%;bottom:6%}.window-body{padding:24px}.mock-grid{height:210px}.chip-a{right:2%}.chip-b{left:2%}.statement-grid{gap:24px}.big-statement{font-size:39px}.portfolio-grid{gap:40px}.project-visual{height:360px}.section-head h2{font-size:48px}.copy-divider,.section-head p,.process-copy p,.contact-copy p{padding-left:18px}.section-head p,.process-copy p,.contact-copy p{max-width:none}.service-row{grid-template-columns:56px 1fr;gap:12px}.service-row h3{font-size:25px}.process-stage{height:660px}.process-card{width:84%;padding:22px}.process-card small{font-size:13px}.pc1{left:5%}.pc2{right:5%}.pc3{left:8%}.process-card h3{font-size:28px}.process-visual{height:120px}.contact-copy h2{font-size:54px}.form-row{grid-template-columns:1fr}.article-card{min-height:310px}.footer-row{gap:14px;flex-wrap:wrap}.cursor-glow{display:none}}

/* =========================================================
   DESKTOP ADAPTIVE SYSTEM
   Viewport-based rather than device-name based.
   Covers compact laptops, MacBook-class viewports, standard
   desktops, Ultrawide/QHD and large 4K/5K browser viewports.
   ========================================================= */

/* Compact desktop / smaller laptop windows: 1101-1399 CSS px */
@media (min-width:1101px) and (max-width:1399px){
  :root{--container:min(1220px,calc(100vw - 44px))}
  .section{padding:96px 0}
  .site-header{left:18px;right:18px;top:14px;height:58px;border-radius:16px;padding:0 14px 0 16px;gap:22px}
  .brand{min-width:185px}.brand-logo{width:174px;max-height:28px}
  .nav{gap:16px}.nav a{height:32px;padding:0 6px;font-size:12.5px}
  .button-small{min-height:38px;padding:0 13px 0 14px;font-size:12px;border-radius:12px}
  .hero{padding-top:118px;min-height:100svh}.hero-layout{grid-template-columns:1.03fr .97fr;gap:42px}
  .hero h1{font-size:clamp(60px,6.25vw,88px);margin:20px 0 26px}
  .hero-lead{max-width:620px;font-size:16px;line-height:1.58}.hero-actions{gap:16px;margin-top:26px}
  .button{min-height:50px;padding:0 17px 0 20px;font-size:14px}
  .hero-stage,.hero-stage.logo-wire-stage{height:500px}
  .hero-ticker .ticker-track{padding:13px 0;font-size:10px}.hero-ticker .ticker-group{gap:22px;padding-right:22px}
  .statement-grid{grid-template-columns:120px minmax(0,1fr) 300px;gap:30px}.big-statement{font-size:clamp(40px,4vw,56px)}.statement-side{font-size:16px}
  .section-head{grid-template-columns:minmax(0,1fr) 320px;gap:38px;margin-bottom:44px}.section-head h2{font-size:clamp(46px,4.8vw,64px)}.section-head p{font-size:15px}
  .portfolio-grid{gap:20px}.project-visual{height:430px}.project-meta h3{font-size:23px}
  .service-row{grid-template-columns:72px 1fr 1.2fr 26px;gap:20px;padding:26px 6px}.service-row h3{font-size:26px}.service-row p{font-size:14px}
  .process-layout{gap:48px}.process-copy h2{font-size:clamp(54px,5.3vw,72px)}.process-copy p{font-size:16px}.process-stage{height:560px}.process-card{padding:22px 24px}.process-card small{font-size:12.5px}.process-card h3{font-size:29px;margin-top:16px}
  .article-grid{gap:16px}.article-card{min-height:315px;padding:28px}.article-card h3{font-size:27px}
  .contact-layout{gap:54px}.contact-copy h2{font-size:clamp(54px,5.3vw,72px)}.contact-copy p{font-size:16px}.contact-form{padding:28px}
}

/* MacBook / mainstream desktop: 1400-1799 CSS px */
@media (min-width:1400px) and (max-width:1799px){
  :root{--container:min(1460px,calc(100vw - 64px))}
  .section{padding:112px 0}
  .site-header{left:24px;right:24px;top:18px;height:62px}
  .brand{min-width:215px}.brand-logo{width:195px;max-height:31px}
  .nav{gap:21px}.nav a{font-size:13.5px}
  .hero{padding-top:142px}.hero-layout{gap:64px}
  .hero h1{font-size:clamp(72px,6vw,106px)}.hero-lead{font-size:18px;max-width:680px}
  .hero-stage,.hero-stage.logo-wire-stage{height:590px}
  .statement-grid{grid-template-columns:150px minmax(0,1fr) 340px;gap:38px}.big-statement{font-size:clamp(46px,3.8vw,64px)}
  .section-head{grid-template-columns:minmax(0,1fr) 380px;gap:48px}.section-head h2{font-size:clamp(52px,4.5vw,72px)}
  .project-visual{height:480px}
  .process-layout{gap:64px}.process-stage{height:630px}
  .contact-layout{gap:72px}
}

/* Large desktop / QHD: 1800-2199 CSS px */
@media (min-width:1800px) and (max-width:2199px){
  :root{--container:min(1720px,calc(100vw - 92px))}
  .section{padding:132px 0}
  .site-header{left:30px;right:30px;top:20px;height:66px;padding-left:20px;padding-right:18px}
  .brand{min-width:245px}.brand-logo{width:220px;max-height:34px}
  .nav{gap:27px}.nav a{font-size:14.5px}
  .hero{padding-top:158px}.hero-layout{gap:86px}
  .hero h1{font-size:clamp(84px,5.2vw,122px)}.hero-lead{font-size:20px;max-width:780px}
  .hero-stage,.hero-stage.logo-wire-stage{height:680px}
  .statement-grid{grid-template-columns:180px minmax(0,1fr) 400px;gap:48px}.big-statement{font-size:clamp(50px,3.4vw,74px)}.statement-side{font-size:19px}
  .section-head{grid-template-columns:minmax(0,1fr) 460px;gap:62px}.section-head h2{font-size:clamp(58px,4vw,86px)}.section-head p{font-size:18px}
  .project-visual{height:570px}.portfolio-grid{gap:30px}
  .process-layout{gap:88px}.process-stage{height:740px}.process-copy p{font-size:19px}.process-card small{font-size:15px}
  .article-card{min-height:390px;padding:38px}.article-card h3{font-size:34px}
  .contact-layout{gap:92px}
}

/* Wide / Ultrawide, including 2560x1080, 3440x1440, 3840x1600.
   Keep vertical sizing restrained so the site does not become gigantic
   simply because the screen is very wide. */
@media (min-width:2200px) and (max-height:1599px),
       (min-width:1800px) and (min-aspect-ratio:21/9){
  :root{--container:min(2100px,calc(100vw - 128px))}
  .section{padding:128px 0}
  .site-header{left:34px;right:34px;top:20px;height:68px;border-radius:20px;padding:0 20px 0 22px;gap:34px}
  .brand{min-width:270px}.brand-logo{width:235px;max-height:36px}
  .nav{gap:30px}.nav a{font-size:15px}
  .button-small{min-height:44px;font-size:13.5px}
  .hero{padding-top:150px;min-height:100svh}.hero-layout{grid-template-columns:1fr 1fr;gap:100px}
  .eyebrow{font-size:13px}.hero h1{font-size:clamp(82px,3.7vw,128px);margin:26px 0 32px}
  .hero-lead{font-size:20px;max-width:820px}.hero-actions{margin-top:34px}
  .button{min-height:58px;font-size:16px}
  .hero-stage,.hero-stage.logo-wire-stage{height:clamp(560px,58vh,720px)}
  .hero-ticker .ticker-track{padding:16px 0;font-size:12px}
  .statement-grid{grid-template-columns:190px minmax(0,1fr) 420px;gap:52px}.big-statement{font-size:clamp(52px,2.75vw,78px)}.statement-side{font-size:19px}
  .section-head{grid-template-columns:minmax(0,1fr) 480px;gap:66px;margin-bottom:58px}.section-head h2{font-size:clamp(60px,3vw,92px)}.section-head p{font-size:18px}
  .portfolio-grid{gap:30px}.project-visual{height:610px}
  .service-row{padding:34px 8px}.service-row h3{font-size:34px}.service-row p{font-size:17px}
  .process-layout{gap:96px}.process-copy h2{font-size:clamp(66px,3.4vw,100px)}.process-stage{height:720px}.process-copy p{font-size:19px}.process-card small{font-size:15px}
  .article-grid{gap:24px}.article-card{min-height:400px;padding:38px}.article-card h3{font-size:35px}
  .contact-layout{gap:96px}.contact-copy h2{font-size:clamp(66px,3.4vw,100px)}.contact-copy p{font-size:19px}
}

/* Tall high-resolution desktop / 4K class browser viewports. */
@media (min-width:2200px) and (min-height:1600px){
  :root{--container:min(2360px,calc(100vw - 180px))}
  .section{padding:158px 0}
  .site-header{left:42px;right:42px;top:26px;height:78px;border-radius:22px;padding:0 24px 0 26px;gap:40px}
  .brand{min-width:300px}.brand-logo{width:250px;max-height:40px}
  .nav{gap:35px}.nav a{font-size:16px}
  .button-small{min-height:50px;padding:0 18px;font-size:14.5px}
  .hero{padding-top:194px}.hero-layout{gap:114px}
  .eyebrow{font-size:14px;gap:14px}.eyebrow span{width:30px}
  .hero h1{font-size:clamp(100px,4.2vw,164px);margin:30px 0 40px}
  .hero-lead{max-width:940px;font-size:23px;line-height:1.6}.hero-actions{gap:30px;margin-top:44px}
  .button{min-height:64px;padding:0 24px 0 28px;font-size:17px}
  .hero-stage,.hero-stage.logo-wire-stage{height:830px}
  .hero-ticker .ticker-track{padding:20px 0;font-size:15px}.hero-ticker .ticker-group{gap:34px;padding-right:34px}
  .statement-grid{grid-template-columns:230px minmax(0,1fr) 470px;gap:62px}.section-index{font-size:13px}.big-statement{font-size:clamp(58px,2.8vw,92px);max-width:1500px}.statement-side{font-size:21px;padding-left:36px}
  .section-head{grid-template-columns:minmax(0,1fr) 550px;gap:78px;margin-bottom:70px}.section-head h2{font-size:clamp(70px,3.25vw,110px)}.section-head p{font-size:20px}
  .portfolio-grid{gap:34px}.project-visual{height:680px}.project-meta h3{font-size:32px}.project-meta small{font-size:13px}.project-meta a{font-size:15px}
  .service-row{grid-template-columns:118px 1fr 1.25fr 36px;gap:36px;padding:40px 10px}.service-row h3{font-size:38px}.service-row p{font-size:19px}
  .process-layout{gap:112px}.process-copy h2{font-size:clamp(76px,3.7vw,126px)}.process-copy p{font-size:21px;max-width:670px}.process-stage{height:840px}.process-card{padding:36px 38px}.process-card h3{font-size:42px}.process-card p{font-size:17px}
  .article-grid{gap:28px}.article-card{min-height:445px;padding:44px}.article-card h3{font-size:38px}.article-card p{font-size:17px}
  .contact-layout{gap:112px}.contact-copy h2{font-size:clamp(76px,3.7vw,126px)}.contact-copy p{font-size:21px;max-width:740px}.mail-link{font-size:28px}
  .contact-form{padding:42px}.contact-form input,.contact-form select,.contact-form textarea{padding:18px;font-size:17px}
  .footer-row{min-height:116px;font-size:14px}
}

/* Very large 5K/6K style viewports when the browser actually reports
   more than 4000 CSS px. Keep growth capped rather than scaling endlessly. */
@media (min-width:4000px) and (min-height:1900px){
  :root{--container:min(2860px,calc(100vw - 260px))}
  .section{padding:182px 0}
  .hero-layout{gap:138px}.hero h1{font-size:clamp(128px,3.65vw,190px)}.hero-lead{font-size:25px;max-width:1080px}
  .hero-stage,.hero-stage.logo-wire-stage{height:940px}
  .statement-grid{grid-template-columns:260px minmax(0,1fr) 540px}.big-statement{font-size:clamp(72px,2.35vw,106px)}
  .section-head{grid-template-columns:minmax(0,1fr) 620px}.section-head h2{font-size:clamp(84px,2.75vw,126px)}
  .project-visual{height:760px}
  .process-stage{height:930px}
  .article-card{min-height:500px}
}

/* Short-height desktop windows (e.g. 1366x768, 1440x810,
   ultrawide with browser chrome). Reduce vertical pressure only. */
@media (min-width:1101px) and (max-height:820px){
  .section{padding-top:88px;padding-bottom:88px}
  .site-header{top:12px}
  .hero{padding-top:104px;min-height:760px}
  .hero h1{font-size:clamp(58px,5.5vw,84px);margin-top:16px;margin-bottom:22px}
  .hero-lead{font-size:16px;line-height:1.5}.hero-actions{margin-top:22px}
  .hero-stage,.hero-stage.logo-wire-stage{height:460px}
  .hero-ticker .ticker-track{padding:11px 0}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.parallax,.tilt-card,.parallax-tilt{transform:none!important}}


/* =========================================================
   TRUE VISUAL / WEBGL + BUTTON SYSTEM v3
   ========================================================= */
.hero{isolation:isolate;background:#080b12}
.webgl-hero{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.92;filter:saturate(112%) contrast(104%)}
.webgl-vignette{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  radial-gradient(circle at 50% 48%,transparent 0 22%,rgba(6,8,14,.08) 56%,rgba(6,8,14,.62) 100%),
  linear-gradient(180deg,rgba(7,10,17,.05),rgba(7,10,17,.24) 72%,#090c13 100%)}
.hero .container,.hero .hero-ticker,.hero .hero-orbit,.hero .hero-blob,.hero .hero-bg-grid{z-index:2}
.hero-bg-grid{opacity:.72;mix-blend-mode:screen}
.hero:before{z-index:1;opacity:.45}
.hero-stage{z-index:3}

.hero-stage.logo-wire-stage{height:640px;position:relative;overflow:visible;cursor:crosshair;isolation:isolate}
.logo-wire-glow{position:absolute;inset:11% 7%;background:radial-gradient(circle at 50% 50%,rgba(108,100,255,.22),rgba(70,214,255,.10) 34%,rgba(70,214,255,.03) 52%,transparent 72%);filter:blur(18px);pointer-events:none}
.hero-stage.logo-wire-stage .wireframe-canvas{position:absolute;left:-6%;top:-8%;width:112%;height:116%;display:block;filter:drop-shadow(0 0 10px rgba(255,255,255,.10)) drop-shadow(0 0 24px rgba(120,136,255,.10))}
@media(max-width:1100px){.hero-stage.logo-wire-stage{height:560px}}
@media(max-width:700px){.hero-stage.logo-wire-stage{height:430px;margin-top:28px}}

.webgl-status{position:absolute;right:5%;top:7%;display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:.16em;color:#8d97a9;text-transform:uppercase;padding:9px 12px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(7,10,17,.48);backdrop-filter:blur(12px)}
.webgl-status i{width:6px;height:6px;border-radius:50%;background:#5effb6;box-shadow:0 0 12px #5effb6;animation:webglPulse 1.8s ease-in-out infinite}
@keyframes webglPulse{50%{opacity:.35;box-shadow:0 0 4px #5effb6}}

/* Button system v4: larger, heavier, no arrow glyphs */
.button{
  --mag-x:0px;--mag-y:0px;
  position:relative;isolation:isolate;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;
  min-height:64px;padding:0 30px;border:0;border-radius:17px;
  background:transparent;color:#fff;cursor:pointer;
  font-size:16px;font-weight:820;letter-spacing:-.015em;
  transform:translate3d(var(--mag-x),var(--mag-y),0);
  box-shadow:0 14px 36px rgba(0,0,0,.24),0 0 0 1px rgba(126,118,255,.14);
  transition:box-shadow .28s ease,filter .28s ease,transform .16s ease-out;
}
.button::before{
  content:"";position:absolute;z-index:-2;left:50%;top:50%;width:230%;aspect-ratio:1;
  transform:translate(-50%,-50%) rotate(0deg);
  background:conic-gradient(from 0deg,
    transparent 0 18%,rgba(124,108,255,.15) 24%,#7c6cff 31%,#52d6ff 38%,rgba(255,255,255,.96) 41%,#52d6ff 44%,#7c6cff 49%,rgba(124,108,255,.12) 56%,transparent 63% 100%);
  animation:buttonOrbit 6.2s linear infinite;opacity:.64;transition:opacity .25s ease,filter .25s ease;
}
.button::after{
  content:"";position:absolute;z-index:-1;inset:1px;border-radius:16px;
  background:
    radial-gradient(circle 90px at var(--pointer-x,50%) var(--pointer-y,50%),rgba(102,142,255,.22),rgba(82,214,255,.08) 35%,transparent 72%),
    linear-gradient(180deg,rgba(18,23,38,.985),rgba(9,13,23,.99));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.11),inset 0 0 28px rgba(124,108,255,.04);
}
.button span{position:relative;z-index:2;font-weight:820;letter-spacing:-.015em}
.button:hover{filter:brightness(1.09);box-shadow:0 20px 48px rgba(0,0,0,.30),0 0 34px rgba(124,108,255,.18),0 0 0 1px rgba(82,214,255,.18)}
.button:hover::before{opacity:1;filter:saturate(145%) brightness(1.14);animation-duration:2.4s}
.button:active{filter:brightness(.96);box-shadow:0 8px 18px rgba(0,0,0,.28),0 0 22px rgba(124,108,255,.12)}
.button-small{min-height:52px;padding:0 22px;border-radius:14px;font-size:14px}.button-small::after{border-radius:13px}
.button-secondary{box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.button-secondary::before{background:conic-gradient(from 20deg,transparent 0 30%,rgba(82,214,255,.05) 38%,rgba(82,214,255,.58) 44%,rgba(124,108,255,.48) 49%,transparent 57% 100%);opacity:.38;animation-duration:8s}
.button-secondary::after{background:radial-gradient(circle 82px at var(--pointer-x,50%) var(--pointer-y,50%),rgba(82,214,255,.12),transparent 72%),rgba(255,255,255,.028)}
.button-secondary:hover::before{opacity:.9;animation-duration:3.3s}
.contact-form .button[type="submit"]{width:100%;margin-top:4px;min-height:66px;font-size:17px}
@keyframes buttonOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
.button-ripple{position:absolute;z-index:1;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.28),rgba(82,214,255,.13) 38%,transparent 70%);width:12px;height:12px;transform:translate(-50%,-50%) scale(0);animation:btnRipple .7s ease-out forwards}
@keyframes btnRipple{to{transform:translate(-50%,-50%) scale(18);opacity:0}}

/* Disable any legacy heading hover animation on smaller headings. */
.project-card:hover .project-meta h3,.service-row:hover h3,.process-card:hover h3,.article-card:hover h3{animation:none!important;color:inherit;text-shadow:none!important;filter:none!important}.process-card:hover,.process-card:focus-within{z-index:12;transform:translateY(-10px) scale(1.015);border-color:rgba(124,108,255,.34);box-shadow:0 36px 86px rgba(0,0,0,.34),0 0 28px rgba(124,108,255,.12)}

/* Hero 3D modeling object */
.hero-stage.wireframe-stage{height:640px;position:relative;perspective:none;transform-style:flat;overflow:visible;cursor:crosshair}
.wire-shell{position:absolute;inset:3% 0 2% 0;border-radius:34px;border:1px solid rgba(120,145,255,.20);background:
  radial-gradient(circle at 50% 47%,rgba(94,91,255,.13),rgba(82,214,255,.025) 36%,transparent 67%),
  linear-gradient(180deg,rgba(14,20,34,.30),rgba(8,12,20,.10));
  box-shadow:inset 0 0 70px rgba(82,214,255,.025),0 0 80px rgba(95,88,255,.055);overflow:hidden}
.wire-shell::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(115,139,190,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(115,139,190,.07) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle at 50% 48%,#000 20%,transparent 76%)}
.wire-shell::after{content:"";position:absolute;inset:7%;border:1px solid rgba(110,207,255,.16);border-radius:50%;box-shadow:0 0 50px rgba(82,214,255,.045),inset 0 0 50px rgba(124,108,255,.035)}
.wireframe-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;filter:drop-shadow(0 0 8px rgba(95,135,255,.18))}
.wire-hud{position:absolute;z-index:4;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(7,11,19,.58);backdrop-filter:blur(12px);color:#aeb8cc;font-size:9px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}
.wire-hud i{width:6px;height:6px;border-radius:50%;background:#69e6ff;box-shadow:0 0 12px #69e6ff}
.wire-hud.top{right:3%;top:4%}.wire-hud.bottom{left:3%;bottom:4%}
.wire-axis{position:absolute;z-index:2;pointer-events:none;opacity:.72}.wire-axis.x{left:8%;right:8%;top:50%;height:1px;background:linear-gradient(90deg,transparent,rgba(82,214,255,.22),transparent)}.wire-axis.y{top:9%;bottom:9%;left:50%;width:1px;background:linear-gradient(180deg,transparent,rgba(124,108,255,.22),transparent)}
.wire-caption{position:absolute;left:6%;right:6%;bottom:9%;z-index:4;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;color:#7d8799;font-size:11px;line-height:1.5;pointer-events:none}
.wire-caption strong{display:block;color:#d9e4f5;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}.wire-caption span:last-child{text-align:right;max-width:240px}
.wire-pointer{position:absolute;z-index:1;width:120px;height:120px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(82,214,255,.11),rgba(124,108,255,.055) 38%,transparent 72%);filter:blur(4px);transform:translate(-50%,-50%);left:50%;top:50%;opacity:.65}
/* Additional tech finish without turning the interface into a game UI */
.project-visual:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(115deg,transparent 0 38%,rgba(116,204,255,.055) 48%,transparent 58%);transform:translateX(-120%);transition:transform .85s cubic-bezier(.2,.7,.2,1)}
.project-card:hover .project-visual:after{transform:translateX(120%)}
.project-visual{background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:34px 34px}
.project-meta a{position:relative;padding-bottom:5px}.project-meta a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:linear-gradient(90deg,#7c6cff,#52d6ff);box-shadow:0 0 10px rgba(82,214,255,.25);transition:right .28s ease}.project-meta a:hover:after{right:0}

@media(max-width:700px){.webgl-status{display:none}.button{width:100%;max-width:360px;min-height:60px;font-size:15px}.hero-actions{gap:12px}.webgl-hero{opacity:.72}.hero-stage.wireframe-stage{height:430px;margin-top:28px}.wire-hud.bottom,.wire-caption{display:none}.wire-hud.top{right:4%;top:4%}.wire-shell{inset:2% 0 0}}
@media(prefers-reduced-motion:reduce){.button::before,.webgl-status i{animation:none!important}.button{transform:none!important}}


/* v6.3.22 - convincing portfolio screenshot placeholders */
.project-visual{isolation:isolate}
.case-screens{position:absolute;inset:0;overflow:hidden;border-radius:inherit;z-index:2;pointer-events:none}
.case-screen{position:absolute;border-radius:16px;overflow:hidden;box-shadow:0 22px 55px rgba(0,0,0,.36);border:1px solid rgba(255,255,255,.13);background:#111722;transform-style:preserve-3d}
.case-screen .screen-bar{height:26px;display:flex;align-items:center;gap:6px;padding:0 10px;background:rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.08)}
.case-screen .screen-bar i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}
.case-screen .screen-bar i:nth-child(1){background:#ff6f5f}.case-screen .screen-bar i:nth-child(2){background:#f0c76d}.case-screen .screen-bar i:nth-child(3){background:#5effb6}
.case-screen .screen-body{position:relative;height:calc(100% - 26px);overflow:hidden}
.case-screen.light{background:#f4f1e8;color:#17191d;border-color:rgba(255,255,255,.24)}
.case-screen.light .screen-bar{background:#dedad0;border-color:rgba(0,0,0,.08)}
.case-screen.light .screen-bar i{background:#9b9a95}
.case-screen.light .screen-body{background:#f4f1e8}
.case-screen .mini-nav{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:7px;letter-spacing:.08em;text-transform:uppercase}
.case-screen.light .mini-nav{border-color:rgba(0,0,0,.08)}
.case-screen .mini-logo{font-weight:850;font-size:10px;letter-spacing:.04em}.case-screen .mini-links{display:flex;gap:10px;opacity:.58}
.case-screen .mini-pill{height:12px;width:46px;border-radius:999px;background:linear-gradient(90deg,var(--neon),var(--neon-2));opacity:.8}
.case-screen .mini-lines{display:grid;gap:5px}.case-screen .mini-lines span{display:block;height:5px;border-radius:999px;background:rgba(255,255,255,.13)}
.case-screen.light .mini-lines span{background:rgba(0,0,0,.12)}
.case-screen .mini-lines span:nth-child(2){width:82%}.case-screen .mini-lines span:nth-child(3){width:62%}
.case-screen .mini-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.case-screen .mini-card{border-radius:8px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045)}
.case-screen.light .mini-card{border-color:rgba(0,0,0,.08);background:rgba(0,0,0,.035)}
.case-screen .mini-card b{display:block;font-size:7px;line-height:1.2}.case-screen .mini-card small{display:block;font-size:5px;opacity:.55;margin-top:3px}

/* Технопласт */
.visual-1{background:radial-gradient(circle at 80% 18%,rgba(124,108,255,.20),transparent 34%),linear-gradient(145deg,#121925,#090d14)}
.tp-main{left:8%;top:9%;width:74%;height:61%;transform:rotate(-1.8deg) translateZ(50px)}
.tp-main .screen-body{padding:0;background:#efede5}
.tp-hero{display:grid;grid-template-columns:1.05fr .95fr;height:52%;background:#ebe8df}
.tp-copy{padding:18px 18px 10px}.tp-kicker{font-size:6px;letter-spacing:.16em;color:#76716a;text-transform:uppercase}.tp-title{font-size:18px;line-height:.9;font-weight:850;margin:8px 0 10px;letter-spacing:-.05em}.tp-text{font-size:6px;line-height:1.45;color:#706d68;max-width:85%}.tp-cta{width:58px;height:15px;border-radius:4px;background:#1f2022;margin-top:12px}.tp-photo{position:relative;background:linear-gradient(140deg,#b9bec2,#6f7880);overflow:hidden}.tp-photo:before{content:"";position:absolute;left:10%;right:10%;bottom:15%;height:48%;background:linear-gradient(160deg,#545f68,#30373d);clip-path:polygon(0 100%,14% 36%,28% 50%,42% 20%,58% 45%,72% 18%,100% 42%,100% 100%)}.tp-photo:after{content:"";position:absolute;left:13%;right:12%;bottom:13%;height:6%;background:#f18f32;opacity:.95}.tp-bottom{padding:12px 15px}.tp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tp-stat{padding:7px;border-top:1px solid rgba(0,0,0,.16)}.tp-stat b{font-size:10px}.tp-stat span{display:block;font-size:5px;color:#74716c;margin-top:2px}
.tp-catalog{right:5%;bottom:7%;width:48%;height:43%;transform:rotate(3deg) translateZ(75px)}
.tp-catalog .screen-body{padding:12px;background:#f6f3eb}.tp-catalog h4{font-size:10px;margin:0 0 10px}.tp-products{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.tp-product{height:52px;border:1px solid rgba(0,0,0,.08);background:white;padding:5px}.tp-product:before{content:"";display:block;height:25px;border-radius:3px;background:linear-gradient(145deg,#d8dadb,#a7adb0);margin-bottom:5px}.tp-product:nth-child(2):before{background:linear-gradient(145deg,#d4d1c9,#95938f)}.tp-product:nth-child(3):before{background:linear-gradient(145deg,#c5c9cb,#7c848a)}.tp-product:nth-child(4):before{background:linear-gradient(145deg,#ddd8cc,#9b958a)}.tp-product span{font-size:5px;color:#555}
.tp-mobile{left:5%;bottom:3%;width:22%;height:46%;transform:rotate(-5deg) translateZ(90px);border-radius:20px}.tp-mobile .screen-bar{height:16px}.tp-mobile .screen-body{height:calc(100% - 16px);padding:8px;background:#f4f1e8}.tp-mobile-logo{font-size:8px;font-weight:900}.tp-mobile-hero{height:48px;background:linear-gradient(145deg,#a9afb3,#5e666c);border-radius:6px;margin:8px 0}.tp-mobile .mini-lines{gap:4px}.tp-mobile .mini-lines span{height:4px}

/* MGS TUNING */
.visual-2{background:radial-gradient(circle at 77% 20%,rgba(90,74,255,.30),transparent 34%),linear-gradient(145deg,#0b1019,#090d14)}
.mgs-main{left:7%;top:8%;width:70%;height:63%;transform:rotate(-2.2deg) translateZ(55px);background:#0d1118}
.mgs-main .screen-body{background:#11161e}.mgs-nav{height:34px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.07)}.mgs-word{font-weight:900;font-size:9px}.mgs-word em{font-style:normal;color:#6effbd}.mgs-car{height:55%;position:relative;background:radial-gradient(circle at 56% 44%,rgba(82,214,255,.13),transparent 45%),linear-gradient(180deg,#101722,#0d121b)}.mgs-car:before{content:"";position:absolute;left:9%;right:8%;bottom:17%;height:42%;border-top:2px solid #6effbd;border-radius:52% 48% 0 0/85% 85% 0 0;transform:skewX(-13deg);box-shadow:0 0 14px rgba(94,255,182,.35)}.mgs-car:after{content:"";position:absolute;left:29%;right:26%;bottom:8%;height:17%;border-bottom:2px solid #6effbd;border-radius:0 0 50% 50%}.mgs-tags{position:absolute;left:11px;top:12px;display:flex;gap:5px}.mgs-tags span{font-size:5px;padding:3px 5px;border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#a9b4c4}.mgs-info{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 14px}.mgs-price{font-size:12px;font-weight:800}.mgs-info small{font-size:5px;color:#798494}.mgs-button{height:16px;border-radius:5px;background:linear-gradient(90deg,#6effbd,#52d6ff);margin-top:7px}
.mgs-filter{right:6%;top:19%;width:32%;height:49%;transform:rotate(3.5deg) translateZ(85px);background:#121924}.mgs-filter .screen-body{padding:12px}.mgs-filter h4{font-size:8px;margin:0 0 10px}.filter-row{height:18px;border:1px solid rgba(255,255,255,.09);border-radius:5px;margin-bottom:6px;padding:5px 7px;font-size:5px;color:#8390a2}.filter-row.active{border-color:rgba(94,255,182,.45);color:#dfffee}.mgs-product-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.mgs-product{height:48px;border-radius:6px;background:#0c1118;border:1px solid rgba(255,255,255,.06);padding:5px}.mgs-product:before{content:"";display:block;height:24px;border-radius:4px;background:linear-gradient(145deg,#26313d,#121820);margin-bottom:4px}.mgs-product span{font-size:4.5px;color:#9ba6b5}
.mgs-mobile{left:4%;bottom:5%;width:23%;height:42%;transform:rotate(-4deg) translateZ(92px);border-radius:20px;background:#0d131c}.mgs-mobile .screen-bar{height:16px}.mgs-mobile .screen-body{height:calc(100% - 16px);padding:8px}.mgs-mobile-car{height:52px;border-radius:7px;background:radial-gradient(circle at 60% 40%,rgba(82,214,255,.13),transparent 50%),#131a24;margin-bottom:8px;position:relative}.mgs-mobile-car:after{content:"";position:absolute;left:9%;right:8%;bottom:14px;height:20px;border-top:1px solid #6effbd;border-radius:50%}.mgs-mobile .mini-lines span{height:4px}

/* OPREX */
.visual-3{background:linear-gradient(145deg,#e5e2da,#cfcac0);color:#17191d}
.oprex-main{left:7%;top:7%;width:72%;height:61%;transform:rotate(-1.5deg) translateZ(50px)}
.oprex-main .screen-body{background:#f5f2ea;padding:0}.oprex-nav{height:34px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(0,0,0,.08)}.oprex-logo{font-size:11px;font-weight:950;letter-spacing:.04em}.oprex-hero{display:grid;grid-template-columns:1.1fr .9fr;height:55%}.oprex-copy{padding:17px}.oprex-copy h4{font-size:17px;line-height:.95;margin:0 0 10px;letter-spacing:-.04em}.oprex-copy p{font-size:6px;line-height:1.45;color:#6d6b66;margin:0;max-width:90%}.oprex-copy .oprex-cta{width:62px;height:15px;background:#17191d;margin-top:12px}.oprex-visual{background:#17191d;position:relative;overflow:hidden}.oprex-visual:before{content:"";position:absolute;left:13%;right:13%;bottom:18%;height:2px;background:#ef603d;transform:skewY(-15deg);box-shadow:0 0 0 1px rgba(239,96,61,.05)}.oprex-visual:after{content:"";position:absolute;width:34px;height:34px;border-radius:50%;background:#ef603d;right:18%;top:22%}.oprex-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 14px}.oprex-strip div{border-top:1px solid rgba(0,0,0,.12);padding-top:6px}.oprex-strip b{font-size:8px}.oprex-strip span{display:block;font-size:5px;color:#77736d;margin-top:2px}
.oprex-dashboard{right:5%;bottom:7%;width:47%;height:43%;transform:rotate(3deg) translateZ(80px);background:#191b20;color:white}.oprex-dashboard .screen-body{padding:11px;background:#191b20}.oprex-dashboard h4{font-size:8px;margin:0 0 8px}.oprex-chart{height:56px;position:relative;border-left:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);background:repeating-linear-gradient(to top,transparent 0 13px,rgba(255,255,255,.035) 13px 14px)}.oprex-chart:before{content:"";position:absolute;left:4%;right:3%;bottom:15%;height:2px;background:linear-gradient(90deg,#ef603d 0 18%,transparent 18% 28%,#ef603d 28% 46%,transparent 46% 62%,#ef603d 62% 80%,transparent 80% 88%,#ef603d 88%);transform:skewY(-17deg);box-shadow:0 0 10px rgba(239,96,61,.25)}.oprex-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.oprex-kpi div{padding:6px;border-radius:5px;background:#22252b}.oprex-kpi b{font-size:8px}.oprex-kpi span{display:block;font-size:4px;color:#8f959e;margin-top:2px}
.oprex-doc{left:5%;bottom:3%;width:25%;height:40%;transform:rotate(-5deg) translateZ(95px);background:#f8f5ee;color:#17191d}.oprex-doc .screen-body{background:#f8f5ee;padding:9px}.oprex-doc-title{font-size:8px;font-weight:900;margin-bottom:8px}.oprex-doc .mini-lines span{height:4px;background:rgba(0,0,0,.13)}.oprex-doc .mini-card-grid{grid-template-columns:1fr 1fr;margin-top:8px}.oprex-doc .mini-card{height:34px;border-color:rgba(0,0,0,.08);background:#eeeae2}

/* Эхо */
.visual-4{background:radial-gradient(circle at 72% 25%,rgba(124,108,255,.28),transparent 34%),linear-gradient(145deg,#09111b,#0a1020)}
.echo-main{left:7%;top:8%;width:72%;height:62%;transform:rotate(-2deg) translateZ(52px);background:#0b1220}.echo-main .screen-body{background:#0b1220}.echo-hud{height:32px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(82,214,255,.13);font-size:5px;color:#91a6bf;letter-spacing:.08em}.echo-hud b{font-size:8px;color:#e5efff}.echo-map{position:relative;height:calc(100% - 32px);background-image:linear-gradient(rgba(82,214,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(82,214,255,.06) 1px,transparent 1px);background-size:24px 24px;overflow:hidden}.echo-map:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;left:48%;top:45%;transform:translate(-50%,-50%);border:1px solid rgba(124,108,255,.35);box-shadow:inset 0 0 38px rgba(124,108,255,.08),0 0 28px rgba(82,214,255,.06)}.echo-map:after{content:"";position:absolute;left:18%;right:17%;top:50%;height:1px;background:linear-gradient(90deg,transparent,#52d6ff,transparent);transform:rotate(-18deg)}.echo-node{position:absolute;width:32px;height:28px;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);border:1px solid rgba(94,255,182,.8);background:rgba(94,255,182,.10)}.echo-node.n1{left:20%;top:35%}.echo-node.n2{left:41%;top:24%;border-color:#8b59fb;background:rgba(139,89,251,.14)}.echo-node.n3{left:57%;top:51%;border-color:#ff6f5f;background:rgba(255,111,95,.12)}.echo-node.n4{left:68%;top:31%}.echo-radar{position:absolute;right:8%;bottom:10%;width:64px;height:64px;border-radius:50%;border:1px solid rgba(82,214,255,.22)}.echo-radar:before,.echo-radar:after{content:"";position:absolute;inset:18%;border-radius:50%;border:1px solid rgba(82,214,255,.16)}.echo-radar:after{inset:36%}
.echo-units{right:5%;bottom:5%;width:42%;height:44%;transform:rotate(3deg) translateZ(82px);background:#10172a}.echo-units .screen-body{padding:10px;background:#10172a}.echo-units h4{font-size:8px;margin:0 0 8px}.unit-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.unit-card{height:48px;border-radius:6px;border:1px solid rgba(124,108,255,.16);background:linear-gradient(145deg,#171f36,#0e1525);padding:5px;position:relative}.unit-card:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;right:5px;top:5px;background:radial-gradient(circle,#52d6ff 0 24%,rgba(82,214,255,.15) 26% 100%)}.unit-card:nth-child(2):before{background:radial-gradient(circle,#8b59fb 0 24%,rgba(139,89,251,.16) 26% 100%)}.unit-card:nth-child(3):before{background:radial-gradient(circle,#ff6f5f 0 24%,rgba(255,111,95,.14) 26% 100%)}.unit-card b{font-size:5.5px}.unit-card small{display:block;font-size:4px;color:#7e8ba0;margin-top:13px}.echo-panel{left:5%;bottom:4%;width:26%;height:42%;transform:rotate(-4deg) translateZ(94px);background:#0d1523}.echo-panel .screen-body{padding:8px;background:#0d1523}.echo-panel-title{font-size:7px;font-weight:800;margin-bottom:7px;color:#e5efff}.echo-panel .mini-card{height:32px;border-color:rgba(82,214,255,.12);background:#121c2d}.echo-panel .mini-card-grid{grid-template-columns:1fr 1fr}.echo-panel .mini-lines span{height:3px;background:rgba(82,214,255,.12)}

/* Responsive screenshot composition */
@media(max-width:1100px){.case-screen{border-radius:14px}.tp-main,.mgs-main,.oprex-main,.echo-main{left:7%;width:76%}.tp-catalog,.mgs-filter,.oprex-dashboard,.echo-units{right:4%;width:46%}}
@media(max-width:700px){.case-screen{border-radius:10px}.case-screen .screen-bar{height:18px}.case-screen .screen-body{height:calc(100% - 18px)}.tp-main,.mgs-main,.oprex-main,.echo-main{left:5%;top:7%;width:82%;height:64%}.tp-catalog,.mgs-filter,.oprex-dashboard,.echo-units{right:3%;bottom:5%;width:50%;height:42%}.tp-mobile,.mgs-mobile,.oprex-doc,.echo-panel{left:3%;bottom:3%;width:28%;height:38%}}



/* =========================================================
   FIRST SCREEN FIT / LAPTOP HEIGHT SAFETY
   These rules intentionally live at the END of the stylesheet
   so they override later component defaults such as the 640px
   wireframe stage height. The ticker must remain inside the
   initial viewport on desktop/laptop browser windows.
   ========================================================= */
@media (min-width:1101px){
  .hero{
    min-height:100svh;
    box-sizing:border-box;
    padding-bottom:62px;
  }
}

/* Typical MacBook / laptop viewport after browser chrome. */
@media (min-width:1101px) and (max-height:900px){
  .hero{
    height:100svh;
    min-height:0;
    padding-top:92px;
    padding-bottom:46px;
    justify-content:center;
  }
  .hero-layout{gap:42px}
  .hero h1{font-size:clamp(56px,5.25vw,78px);margin:16px 0 20px}
  .hero-lead{font-size:15px;line-height:1.48;max-width:650px}
  .hero-actions{margin-top:20px;gap:14px}
  .hero-actions .button{min-height:46px;padding:0 16px;font-size:13px}
  .hero-stage,.hero-stage.logo-wire-stage{height:min(430px,55vh)!important;margin-top:0!important}
  .hero-stage.logo-wire-stage .wireframe-canvas{left:-4%;top:-5%;width:108%;height:110%}
  .hero-ticker .ticker-track{padding:9px 0;font-size:9.5px}
  .hero-ticker .ticker-group{gap:20px;padding-right:20px}
}

/* Short browser windows: 13-inch laptops, browser toolbars, split layouts. */
@media (min-width:1101px) and (max-height:760px){
  .site-header{top:10px;height:54px}
  .hero{
    height:100svh;
    min-height:0;
    padding-top:76px;
    padding-bottom:40px;
  }
  .hero h1{font-size:clamp(50px,4.8vw,68px);margin:12px 0 16px;line-height:.9}
  .eyebrow{font-size:10px}
  .hero-lead{font-size:14px;line-height:1.42;max-width:610px}
  .hero-actions{margin-top:16px}
  .hero-actions .button{min-height:42px}
  .hero-stage,.hero-stage.logo-wire-stage{height:min(365px,50vh)!important}
  .hero-ticker .ticker-track{padding:7px 0;font-size:9px}
}

/* Very short desktop viewport: keep the ticker visible rather than
   forcing an arbitrary minimum hero height below the fold. */
@media (min-width:1101px) and (max-height:660px){
  .hero{padding-top:68px;padding-bottom:36px}
  .hero h1{font-size:clamp(44px,4.25vw,60px)}
  .hero-lead{font-size:13px}
  .hero-stage,.hero-stage.logo-wire-stage{height:min(310px,46vh)!important}
  .hero-ticker .ticker-track{padding:6px 0}
}



/* =========================================================
   TRUE VISUAL DESKTOP RESPONSIVE SYSTEM v6.3.26
   Final authoritative desktop overrides.
   Uses both viewport width and height so notebooks, Retina
   Macs, 16:9 desktops, QHD, ultrawide and 4K scale cleanly.
   ========================================================= */
@media (min-width:1101px){
  :root{
    --desktop-gutter:clamp(24px,2.7vw,78px);
    --container:min(1760px,calc(100vw - (var(--desktop-gutter) * 2)));
  }
  .container{width:var(--container)}
  .section{padding:clamp(88px,9vh,168px) 0}

  .site-header{
    left:clamp(14px,1.45vw,38px);
    right:clamp(14px,1.45vw,38px);
    top:clamp(10px,1.4vh,24px);
    height:clamp(56px,6.2vh,72px);
    border-radius:clamp(15px,1vw,20px);
    padding:0 clamp(14px,1vw,22px) 0 clamp(16px,1.1vw,24px);
    gap:clamp(20px,1.8vw,38px);
  }
  .brand{min-width:clamp(180px,13vw,250px)}
  .brand-logo{width:clamp(170px,11vw,220px);max-height:clamp(28px,3.2vh,36px)}
  .nav{gap:clamp(18px,1.7vw,32px)}
  .nav a{font-size:clamp(13px,.78vw,15px);height:34px}
  .button-small{min-height:clamp(40px,4.4vh,46px);font-size:clamp(12px,.72vw,14px)}

  .hero{
    height:100svh;
    min-height:620px;
    padding-top:clamp(88px,11vh,154px);
    padding-bottom:clamp(58px,7vh,82px);
    justify-content:center;
  }
  .hero-layout{
    grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr);
    gap:clamp(34px,4.2vw,118px);
    width:var(--container);
    min-height:0;
  }
  .hero h1{
    font-size:clamp(60px,min(6vw,10.5vh),176px);
    line-height:.89;
    margin:clamp(16px,2.3vh,28px) 0 clamp(20px,3vh,36px);
  }
  .hero-lead{
    max-width:clamp(620px,38vw,1080px);
    font-size:clamp(16px,min(1.15vw,2.25vh),25px);
    line-height:1.58;
  }
  .hero-actions{margin-top:clamp(24px,3.5vh,42px);gap:clamp(14px,1.5vw,28px)}
  .hero-actions .button{min-height:clamp(50px,5.4vh,62px);font-size:clamp(14px,.82vw,17px)}
  .hero-stage,.hero-stage.logo-wire-stage{
    height:clamp(330px,min(36vw,60vh),920px)!important;
    margin-top:0!important;
  }
  .hero-stage.logo-wire-stage .wireframe-canvas{left:-5%;top:-6%;width:110%;height:112%}
  .hero-ticker{bottom:0}
  .ticker-track{padding:clamp(11px,1.4vh,17px) 0;font-size:clamp(10px,.7vw,13px)}

  .statement-grid{
    grid-template-columns:clamp(96px,8vw,190px) minmax(0,1fr) clamp(280px,22vw,440px);
    gap:clamp(26px,3vw,58px);
  }
  .section-index{font-size:clamp(11px,.68vw,14px)}
  .big-statement{font-size:clamp(40px,min(3.65vw,7vh),104px);max-width:1500px}
  .statement-side{font-size:clamp(16px,1vw,22px)}

  .section-head{
    grid-template-columns:minmax(0,1fr) clamp(320px,25vw,560px);
    gap:clamp(36px,4vw,84px);
    margin-bottom:clamp(44px,5.5vh,76px);
  }
  .section-head h2{font-size:clamp(48px,min(4.45vw,8vh),132px)}
  .section-head p{font-size:clamp(15px,.95vw,21px);max-width:560px}

  .portfolio-grid{gap:clamp(20px,1.8vw,36px)}
  .project-visual{height:clamp(400px,31vw,900px)}
  .project-meta{padding-top:clamp(16px,1.4vw,24px)}
  .project-meta h3{font-size:clamp(23px,1.55vw,34px)}
  .project-meta small{font-size:clamp(10px,.66vw,13px)}
  .project-meta a{font-size:clamp(12px,.72vw,15px)}

  .service-row{
    grid-template-columns:clamp(72px,6vw,116px) minmax(260px,1fr) minmax(360px,1.25fr) 32px;
    gap:clamp(18px,2vw,38px);
    padding:clamp(26px,3.1vh,42px) 8px;
  }
  .service-row span{font-size:clamp(24px,1.65vw,34px)}
  .service-row h3{font-size:clamp(27px,1.8vw,40px)}
  .service-row p{font-size:clamp(14px,.95vw,20px)}

  .process-layout{grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:clamp(48px,5vw,112px)}
  .process-copy h2{font-size:clamp(54px,min(4.8vw,8.6vh),126px)}
  .process-copy p{font-size:clamp(16px,1vw,22px);max-width:680px}
  .process-stage{height:clamp(620px,min(47vw,76vh),900px)}
  .process-card{padding:clamp(22px,1.9vw,38px)}
  .process-card h3{font-size:clamp(28px,2vw,44px)}
  .process-card p{font-size:clamp(14px,.86vw,18px)}.process-visual{height:clamp(118px,8vw,148px)}

  .article-grid{gap:clamp(18px,1.8vw,30px)}
  .article-card{min-height:clamp(320px,23vw,470px);padding:clamp(28px,2.2vw,42px)}
  .article-card h3{font-size:clamp(27px,1.8vw,38px)}
  .article-card p{font-size:clamp(14px,.9vw,19px)}

  .contact-layout{grid-template-columns:minmax(360px,.85fr) minmax(520px,1.15fr);gap:clamp(54px,5.5vw,120px)}
  .contact-copy h2{font-size:clamp(54px,min(4.8vw,8.6vh),126px)}
  .contact-copy p{font-size:clamp(16px,1vw,22px);max-width:760px}
  .mail-link{font-size:clamp(22px,1.45vw,30px)}
  .contact-form{padding:clamp(28px,2.2vw,42px)}
}

/* compact desktop / notebooks */
@media (min-width:1101px) and (max-width:1279px){
  :root{--desktop-gutter:22px;--container:min(1180px,calc(100vw - 44px))}
  .site-header{left:14px;right:14px}
  .brand{min-width:180px}.brand-logo{width:174px}
  .nav{gap:16px}.nav a{padding-left:5px;padding-right:5px}
  .hero-layout{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:30px}
  .statement-grid{grid-template-columns:92px minmax(0,1fr) 280px;gap:24px}
  .section-head{grid-template-columns:minmax(0,1fr) 300px;gap:32px}
  .service-row{grid-template-columns:68px minmax(240px,1fr) minmax(320px,1.18fr) 26px;gap:16px}
  .process-layout{gap:42px}
  .contact-layout{grid-template-columns:.88fr 1.12fr;gap:44px}
}

/* mainstream notebook / MacBook CSS viewports */
@media (min-width:1280px) and (max-width:1599px){
  :root{--desktop-gutter:clamp(26px,2.4vw,38px);--container:min(1420px,calc(100vw - (var(--desktop-gutter) * 2)))}
  .hero-layout{gap:clamp(38px,4vw,64px)}
}

/* Full HD / large notebook / standard desktop */
@media (min-width:1600px) and (max-width:2199px){
  :root{--container:min(1760px,calc(100vw - 96px))}
}

/* QHD and ultrawide, constrained by height rather than width */
@media (min-width:2200px) and (max-width:3199px){
  :root{--container:min(2200px,calc(100vw - 140px))}
  .hero-layout{gap:clamp(72px,4vw,110px)}
}

/* 3440 / 3840 ultrawide and 4K width */
@media (min-width:3200px) and (max-width:3999px){
  :root{--container:min(2900px,calc(100vw - 220px))}
  .site-header{left:42px;right:42px}
}

/* 4K/5K/6K CSS viewports */
@media (min-width:4000px){
  :root{--container:min(3400px,calc(100vw - 300px))}
  .site-header{left:54px;right:54px}
}

/* Ultrawide landscape: do not let width force vertical overflow */
@media (min-width:1800px) and (min-aspect-ratio:21/10){
  .hero{padding-top:clamp(92px,10vh,132px);padding-bottom:clamp(52px,6vh,68px)}
  .hero-layout{grid-template-columns:minmax(0,.98fr) minmax(420px,1.02fr)}
  .hero h1{font-size:clamp(68px,min(5vw,10vh),156px)}
  .hero-stage,.hero-stage.logo-wire-stage{height:clamp(360px,min(31vw,57vh),760px)!important}
  .section{padding:clamp(90px,8vh,138px) 0}
}

/* Height is the critical dimension on MacBooks and short desktop windows */
@media (min-width:1101px) and (max-height:900px){
  .section{padding:clamp(76px,8vh,96px) 0}
  .site-header{top:10px;height:56px}
  .hero{height:100svh;min-height:0;padding-top:78px;padding-bottom:52px}
  .hero h1{font-size:clamp(58px,min(5.7vw,9.8vh),96px);margin:14px 0 18px}
  .hero-lead{font-size:clamp(15px,min(1.05vw,2.1vh),18px);line-height:1.5}
  .hero-actions{margin-top:20px}.hero-actions .button{min-height:48px}
  .hero-stage,.hero-stage.logo-wire-stage{height:clamp(300px,50vh,450px)!important}
  .ticker-track{padding:10px 0}
  .process-stage{height:clamp(620px,74vh,720px)}
}

@media (min-width:1101px) and (max-height:760px){
  .site-header{top:8px;height:52px}
  .hero{padding-top:66px;padding-bottom:44px}
  .hero-layout{gap:26px}
  .hero h1{font-size:clamp(52px,min(5.2vw,9.2vh),78px);margin:10px 0 14px}
  .hero-lead{font-size:14px;line-height:1.42;max-width:640px}
  .hero-actions{margin-top:14px;gap:12px}.hero-actions .button{min-height:44px;padding-left:18px;padding-right:16px}
  .hero-stage,.hero-stage.logo-wire-stage{height:clamp(270px,47vh,360px)!important}
  .ticker-track{padding:8px 0;font-size:10px}
  .section{padding:72px 0}
}

@media (min-width:1101px) and (max-height:660px){
  .hero{padding-top:58px;padding-bottom:38px}
  .hero h1{font-size:clamp(48px,min(4.9vw,8.8vh),66px)}
  .hero-lead{font-size:13px}
  .hero-stage,.hero-stage.logo-wire-stage{height:clamp(230px,44vh,300px)!important}
  .hero-actions .button{min-height:40px}
}



/* =========================================================
   TRUE VISUAL multi-page system v7.0
   ========================================================= */
body.interior{padding-top:0}
.site-header .brand-logo{width:190px}
.page-main{position:relative;z-index:1}
.page-hero{position:relative;min-height:min(760px,82svh);padding:180px 0 110px;overflow:hidden;background:linear-gradient(180deg,#090c13,#0a0e18 68%,#090c13)}
.page-hero:before{content:"";position:absolute;width:850px;height:850px;border-radius:50%;right:-270px;top:-330px;background:radial-gradient(circle,rgba(124,108,255,.22),rgba(82,214,255,.06) 42%,transparent 70%);filter:blur(24px)}
.page-hero:after{content:"";position:absolute;inset:0;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:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 95%);pointer-events:none}
.page-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:80px;align-items:end}
.page-kicker,.crumbs{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:#aab2c2;font-weight:700}
.crumbs{margin-bottom:28px;color:#747d8e}.crumbs a{color:#9ca5b6}.crumbs a:hover{color:white}
.page-title{font-size:clamp(64px,6.5vw,118px);line-height:.9;letter-spacing:-.055em;margin:20px 0 30px;max-width:1100px}
.page-title .accent{color:var(--brand-violet)}
.page-lead{font-size:clamp(18px,1.35vw,24px);line-height:1.6;color:#a7afbd;max-width:820px;margin:0}
.page-hero-side{border-left:1px solid var(--divider-dark);padding-left:28px;color:#949dad;font-size:17px;line-height:1.65;max-width:500px}
.page-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:36px}
.page-section{position:relative;padding:120px 0}.page-section.paper{background:var(--paper);color:var(--ink)}.page-section.dark{background:linear-gradient(180deg,#090c13,#0a0d15 55%,#080b11)}
.page-section.soft{background:#e9e8e2;color:var(--ink)}
.section-label{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:760;letter-spacing:.14em;text-transform:uppercase;color:#767d89;margin-bottom:24px}.section-label:before{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--neon),var(--neon-2));box-shadow:0 0 10px rgba(124,108,255,.2)}
.dark .section-label{color:#aab2c2}
.content-title{font-size:clamp(46px,4.8vw,82px);line-height:.96;letter-spacing:-.05em;margin:0 0 30px}.content-title .accent{color:var(--brand-violet)}
.content-lead{font-size:20px;line-height:1.65;max-width:800px;color:#656c77}.dark .content-lead{color:#9aa3b2}
.split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:90px;align-items:start}.split.reverse{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.copy-block{font-size:18px;line-height:1.75;color:#636a75}.dark .copy-block{color:#9ca4b2}.copy-block p{margin:0 0 20px}.copy-block strong{color:inherit}
.divider-copy{position:relative;padding-left:28px}.divider-copy:before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:1px;background:var(--divider-light)}.dark .divider-copy:before{background:var(--divider-dark)}
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}.fact-card{padding:26px;border:1px solid rgba(18,22,31,.12);border-radius:20px;background:rgba(255,255,255,.35)}.dark .fact-card{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.035)}.fact-card small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#747c89;margin-bottom:12px}.fact-card b{display:block;font-size:24px;letter-spacing:-.03em}.dark .fact-card small{color:#7f8999}
.card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.info-card{position:relative;padding:36px;border:1px solid rgba(18,22,31,.12);border-radius:24px;background:rgba(255,255,255,.42);overflow:hidden;transition:.3s}.info-card:hover{transform:translateY(-5px);box-shadow:0 24px 60px rgba(20,24,34,.10)}.info-card small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-violet);font-weight:800}.info-card h3{font-size:32px;line-height:1.05;letter-spacing:-.04em;margin:20px 0 14px}.info-card p{font-size:16px;line-height:1.65;color:#656c77;margin:0}.dark .info-card{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.035)}.dark .info-card p{color:#9da6b5}
.link-row{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-size:14px;font-weight:700}.link-row:after{content:none!important}
.big-cta{position:relative;overflow:hidden;border-radius:32px;padding:60px;background:linear-gradient(135deg,rgba(124,108,255,.18),rgba(82,214,255,.07));border:1px solid rgba(255,255,255,.12)}.big-cta:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-150px;top:-180px;background:radial-gradient(circle,rgba(124,108,255,.24),transparent 70%)}.big-cta h2{position:relative;z-index:2;font-size:clamp(48px,5vw,88px);line-height:.95;letter-spacing:-.05em;margin:0 0 22px;max-width:1000px}.big-cta p{position:relative;z-index:2;color:#a4adbc;font-size:19px;line-height:1.6;max-width:760px}.big-cta .page-actions{position:relative;z-index:2}
/* works */
.works-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:34px}.work-tile{display:block}.work-tile .project-visual{height:520px}.work-tile .project-meta{padding-left:0;padding-right:0}.work-tile:hover .project-meta h3{color:var(--brand-violet)}
.work-filter{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 42px}.work-filter span{padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:12px;color:#9da6b4}.work-filter span:first-child{color:white;border-color:rgba(139,89,251,.45);background:rgba(139,89,251,.09)}
/* visual placeholders */
.case-stage{position:relative;height:620px;border-radius:32px;border:1px solid rgba(255,255,255,.10);background:#0b1019;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.25)}
.case-stage:before{content:"";position:absolute;inset:0;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:64px 64px}.case-stage:after{content:"";position:absolute;width:460px;height:460px;border-radius:50%;right:-120px;top:-130px;background:radial-gradient(circle,rgba(124,108,255,.26),transparent 70%)}
.screen{position:absolute;border-radius:22px;border:1px solid rgba(255,255,255,.12);box-shadow:0 34px 70px rgba(0,0,0,.32);overflow:hidden;background:#161d2a}.screen.light{background:#f0ede4;color:#17181c;border-color:rgba(0,0,0,.12)}.screen-head{height:34px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:7px;padding:0 14px}.light .screen-head{border-bottom-color:rgba(0,0,0,.08)}.screen-head i{width:6px;height:6px;border-radius:50%;background:#5a6374}.screen-body{padding:24px}.ui-line{height:9px;border-radius:999px;background:rgba(255,255,255,.12);margin-bottom:10px}.light .ui-line{background:rgba(15,18,25,.10)}.ui-line.accent{background:linear-gradient(90deg,var(--brand-violet),var(--neon-2));width:58%}.ui-block{height:90px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06);margin-top:18px}.light .ui-block{background:rgba(15,18,25,.05);border-color:rgba(15,18,25,.05)}
.screen-a{left:7%;top:10%;width:62%;height:62%;transform:rotate(-2deg)}.screen-b{right:5%;bottom:8%;width:46%;height:52%;transform:rotate(2.5deg)}.screen-c{left:20%;bottom:4%;width:28%;height:38%;transform:rotate(-4deg)}
.case-stage.mgs .screen-a{background:#111725}.case-stage.mgs .screen-b{background:#181331}.case-stage.mgs .ui-block{background:radial-gradient(circle at 70% 30%,rgba(94,255,182,.18),rgba(255,255,255,.04) 50%,transparent 72%)}
.case-stage.oprex .screen-a,.case-stage.oprex .screen-b{background:#f2efe7;color:#15171c}.case-stage.oprex .ui-line{background:rgba(20,22,28,.12)}.case-stage.oprex .ui-line.accent{background:#ef603d}.case-stage.oprex .ui-block{background:#171a1f}
.case-stage.echo .screen-a,.case-stage.echo .screen-b{background:radial-gradient(circle at 70% 30%,#251e4c,#111726 58%,#0b111d)}.case-stage.echo .ui-block{clip-path:polygon(25% 7%,75% 7%,100% 50%,75% 93%,25% 93%,0 50%);background:rgba(94,255,182,.12);border:1px solid rgba(94,255,182,.4)}
/* service pages */
.service-list-page{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.service-card-page{padding:38px;border-radius:26px;border:1px solid rgba(18,22,31,.12);background:#f8f7f2;min-height:330px;display:flex;flex-direction:column}.service-card-page small{font-size:12px;color:var(--brand-violet);font-weight:800}.service-card-page h2{font-size:38px;line-height:1.02;letter-spacing:-.04em;margin:24px 0 16px}.service-card-page p{color:#666d77;line-height:1.65;margin:0}.service-card-page .link-row{margin-top:auto}
.deliverables{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.deliverable{padding:24px 26px;border-radius:18px;border:1px solid rgba(18,22,31,.12);background:rgba(255,255,255,.38)}.deliverable b{display:block;font-size:19px;margin-bottom:8px}.deliverable p{margin:0;color:#6d737c;line-height:1.55;font-size:15px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.step{padding:28px;border-radius:20px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035)}.step small{font-weight:800;color:#a69cff}.step h3{font-size:24px;margin:18px 0 10px}.step p{color:#9ba4b3;line-height:1.55;margin:0;font-size:15px}
/* article */
.article-hero{min-height:620px}.article-shell{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:90px;align-items:start}.article-body{font-size:20px;line-height:1.8;color:#31363f;max-width:920px}.article-body h2{font-size:48px;line-height:1.05;letter-spacing:-.04em;margin:70px 0 22px;color:#111318}.article-body h3{font-size:30px;margin:44px 0 18px;color:#111318}.article-body p{margin:0 0 26px}.article-body ul{padding-left:24px;margin:0 0 30px}.article-body li{margin:10px 0}.article-quote{margin:38px 0;padding:28px 30px;border-left:3px solid var(--brand-violet);background:rgba(139,89,251,.07);border-radius:0 18px 18px 0;font-size:24px;line-height:1.55;color:#282c34}.article-aside{position:sticky;top:120px;padding-left:24px;border-left:1px solid var(--divider-light)}.article-aside b{display:block;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px}.article-aside a{display:block;color:#666d77;font-size:14px;line-height:1.5;margin:12px 0}.article-aside a:hover{color:var(--brand-violet)}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.related-card{padding:28px;border-radius:20px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035)}.related-card small{color:#8e97a8;font-size:11px;letter-spacing:.12em}.related-card h3{font-size:25px;margin:16px 0 12px}.related-card p{color:#949dab;line-height:1.55;font-size:14px}.related-card .link-row{margin-top:16px}
/* contact page */
.contact-page-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:start}.contact-info{display:grid;gap:18px}.contact-info-card{padding:26px;border-radius:20px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035)}.contact-info-card small{color:#828c9c;text-transform:uppercase;letter-spacing:.12em;font-size:11px}.contact-info-card b{display:block;margin-top:8px;font-size:22px}.contact-info-card p{color:#9aa3b1;line-height:1.5;margin:10px 0 0}
/* footer */
.site-footer{background:#06080d;border-top:1px solid rgba(255,255,255,.07);padding:56px 0}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:60px}.footer-brand img{width:180px}.footer-brand p{color:#717b8d;line-height:1.55;max-width:360px;margin:18px 0 0}.footer-col b{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8a93a2;margin-bottom:16px}.footer-col a{display:block;color:#aab2bf;margin:10px 0;font-size:14px}.footer-col a:hover{color:white}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:46px;padding-top:24px;border-top:1px solid rgba(255,255,255,.07);color:#687283;font-size:12px}
@media(max-width:1100px){.page-hero-grid,.split,.split.reverse,.article-shell,.contact-page-grid{grid-template-columns:1fr}.page-hero{padding-top:140px}.page-hero-side{max-width:760px}.works-grid,.service-list-page{grid-template-columns:1fr}.steps{grid-template-columns:repeat(2,1fr)}.article-aside{position:relative;top:auto;padding-left:0;border-left:0}.footer-grid{grid-template-columns:1fr 1fr}.case-stage{height:560px}}
@media(max-width:700px){.page-hero{padding:120px 0 80px;min-height:auto}.page-title{font-size:54px}.page-lead{font-size:17px}.page-hero-grid{gap:34px}.page-section{padding:82px 0}.content-title{font-size:46px}.fact-grid,.card-grid,.deliverables,.steps,.related,.footer-grid{grid-template-columns:1fr}.big-cta{padding:34px 26px}.case-stage{height:440px}.screen-a{left:4%;width:82%;height:58%}.screen-b{right:3%;width:62%;height:48%}.screen-c{display:none}.article-body{font-size:18px}.article-body h2{font-size:38px}.article-quote{font-size:20px}.footer-bottom{flex-direction:column}.service-card-page{min-height:280px}.site-header .brand-logo{width:165px}}


/* ==========================================================================\n   TRUE VISUAL v7.1 - global information architecture and navigation\n   ========================================================================== */
.site-header{overflow:visible}
.global-nav{display:flex;align-items:center;gap:6px;margin-left:auto;height:100%}
.nav-cluster{position:relative;height:100%;display:flex;align-items:center}
.global-nav-link{position:relative;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 10px;border-radius:11px;color:#c8cfdb;font-size:14px;font-weight:600;letter-spacing:-.01em;transition:color .22s ease,opacity .22s ease;background:transparent}
.global-nav-link:before{content:"";position:absolute;left:-6px;right:-6px;top:4px;bottom:4px;border-radius:999px;background:radial-gradient(circle at 50% 100%,rgba(139,89,251,.16),rgba(82,214,255,.07) 48%,transparent 72%);opacity:0;transform:scale(.92);transition:opacity .22s ease,transform .22s ease;pointer-events:none}
.global-nav-link:after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(139,89,251,0),rgba(139,89,251,.92) 24%,rgba(82,214,255,.88) 76%,rgba(82,214,255,0));box-shadow:0 0 12px rgba(139,89,251,.20);opacity:0;transform:scaleX(.55);transform-origin:center;transition:opacity .22s ease,transform .22s ease;pointer-events:none}
.global-nav-link:hover{color:#eef2fb}
.global-nav-link:hover:before{opacity:.48;transform:scale(1)}
.global-nav-link:hover:after{opacity:.65;transform:scaleX(.82)}
.global-nav-link.active{color:#f4f6fb}
.global-nav-link.active:before{opacity:.72;transform:scale(1)}
.global-nav-link.active:after{opacity:1;transform:scaleX(1)}
.nav-chevron{font-size:12px;color:#8993a5;transform:translateY(-1px);transition:transform .2s ease,color .2s ease}
.has-flyout:hover>.global-nav-link .nav-chevron,.has-flyout:focus-within>.global-nav-link .nav-chevron{transform:translateY(-1px) rotate(180deg);color:#dfe8fa}
.nav-flyout{position:absolute;top:calc(100% - 2px);left:50%;width:560px;transform:translate(-50%,12px);padding:18px;border:1px solid rgba(255,255,255,.11);border-radius:22px;background:rgba(10,14,23,.96);box-shadow:0 28px 90px rgba(0,0,0,.42),0 0 50px rgba(124,108,255,.06);backdrop-filter:blur(22px) saturate(125%);-webkit-backdrop-filter:blur(22px) saturate(125%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s ease;z-index:10020}
.nav-cluster:hover>.nav-flyout,.nav-cluster:focus-within>.nav-flyout{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.nav-flyout-wide{width:min(720px,calc(100vw - 64px))}
.nav-flyout-services{width:580px}
.nav-flyout-materials{width:620px;left:auto;right:0;transform:translate(0,12px)}
.nav-cluster:hover>.nav-flyout-materials,.nav-cluster:focus-within>.nav-flyout-materials{transform:translate(0,0)}
.nav-flyout-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:4px 4px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.nav-flyout-head small{display:block;color:#7f899c;font-size:10px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:5px}.nav-flyout-head b{font-size:18px}.nav-flyout-head>a{color:#aeb7c8;font-size:12px}.nav-flyout-head>a:hover{color:#fff}
.nav-flyout-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}
.nav-card{min-height:104px;padding:15px;border-radius:15px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);transition:.22s ease}.nav-card:hover{transform:translateY(-2px);background:rgba(124,108,255,.07);border-color:rgba(124,108,255,.24)}.nav-card small,.nav-card span{display:block;color:#828b9d;font-size:10px;letter-spacing:.07em}.nav-card b{display:block;margin:8px 0 5px;font-size:17px;color:#f2f5fb}.nav-card span{font-size:12px;letter-spacing:0}
.nav-link-list{display:grid;gap:4px;margin-top:10px}.nav-link-list>a{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;padding:11px 12px;border-radius:13px;transition:.2s ease}.nav-link-list>a:hover{background:rgba(255,255,255,.045)}.nav-link-list>a>span{font-size:11px;font-weight:800;color:var(--brand-violet)}.nav-link-list b{display:block;font-size:14px;color:#eef2fa}.nav-link-list small{display:block;margin-top:3px;color:#80899a;font-size:11px;line-height:1.35}.nav-link-list.compact>a{grid-template-columns:82px 1fr}.nav-link-list.compact>a>span{color:#8f98aa;font-size:9px;text-transform:uppercase;letter-spacing:.1em}
.header-actions{display:flex;align-items:center;gap:10px}.menu-toggle{display:none;align-items:center;gap:8px;height:42px;padding:0 13px;border-radius:13px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:#eef2fa;cursor:pointer}.menu-toggle span{font-size:12px;font-weight:700}.menu-toggle i{display:block;width:14px;height:1px;background:#dfe6f3}.menu-toggle i+ i{margin-left:-22px;margin-top:8px}
.site-menu{position:fixed;inset:0;z-index:11000;visibility:hidden;pointer-events:none}.site-menu.open{visibility:visible;pointer-events:auto}.site-menu-backdrop{position:absolute;inset:0;background:rgba(3,5,10,.66);backdrop-filter:blur(8px);opacity:0;transition:opacity .24s ease}.site-menu.open .site-menu-backdrop{opacity:1}.site-menu-panel{position:absolute;right:18px;top:18px;bottom:18px;width:min(760px,calc(100vw - 36px));padding:24px;border:1px solid rgba(255,255,255,.11);border-radius:24px;background:linear-gradient(160deg,rgba(17,22,35,.99),rgba(9,12,20,.99));box-shadow:0 40px 120px rgba(0,0,0,.5);overflow:auto;transform:translateX(24px);opacity:0;transition:transform .24s ease,opacity .24s ease}.site-menu.open .site-menu-panel{transform:none;opacity:1}.site-menu-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08);color:#8c96a7;font-size:11px;text-transform:uppercase;letter-spacing:.14em}.site-menu-top button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:white;font-size:25px;line-height:1;cursor:pointer}.site-menu-home{display:block;padding:24px 0 18px;font-size:30px;font-weight:760;letter-spacing:-.03em;border-bottom:1px solid rgba(255,255,255,.08)}.site-menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 46px;padding:28px 0}.site-menu-label{color:#7f899a;font-size:10px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:12px}.site-menu-grid section>a{display:block;padding:7px 0;color:#dce2ec;font-size:16px}.site-menu-grid section>a:first-of-type{font-weight:760;color:#fff}.site-menu-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08)}.site-menu-cta p{max-width:390px;margin:0;color:#a3acba;line-height:1.5}
body.menu-open{overflow:hidden}
.section-side-copy{display:grid;gap:14px}.section-more{display:inline-flex;width:max-content;color:#59606c;font-size:13px;font-weight:700;border-bottom:1px solid rgba(17,19,24,.18);padding-bottom:4px}.dark-section .section-more,.section-more.on-dark{color:#aab3c3;border-color:rgba(255,255,255,.18)}.section-more:hover{color:var(--brand-violet)}
.footer-grid-expanded{grid-template-columns:minmax(250px,1.3fr) repeat(3,minmax(150px,.7fr));gap:52px}.footer-col a{line-height:1.45}

@media(max-width:1320px){.global-nav{display:none}.menu-toggle{display:flex}.site-header{gap:14px}.brand{min-width:0}.header-actions{margin-left:auto}}
@media(max-width:760px){.site-header{padding-right:10px}.header-cta{display:none}.brand-logo{width:165px}.site-menu-panel{right:10px;top:10px;bottom:10px;width:calc(100vw - 20px);padding:20px}.site-menu-grid{grid-template-columns:1fr;gap:24px}.site-menu-home{font-size:27px}.site-menu-cta{align-items:flex-start;flex-direction:column}.footer-grid-expanded{grid-template-columns:1fr 1fr;gap:34px}.footer-brand{grid-column:1/-1}}
@media(max-width:520px){.footer-grid-expanded{grid-template-columns:1fr}.footer-brand{grid-column:auto}.menu-toggle span{display:none}.menu-toggle{width:42px;padding:0;justify-content:center}.site-menu-grid section>a{font-size:15px}}


/* TRUE VISUAL v7.3 - compact IA and contextual navigation */
.compact-nav{gap:12px}.compact-nav .global-nav-link{padding-inline:12px}.compact-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.breadcrumbs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:22px;font-size:12px;line-height:1.4;letter-spacing:.13em;text-transform:uppercase;color:#7f899a;font-weight:750}.breadcrumbs a{color:#aeb6c5;transition:color .2s ease}.breadcrumbs a:hover{color:#fff}.breadcrumbs span:last-child{color:#d9deea}.paper .breadcrumbs span:last-child{color:#555d69}
.section-jump{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:64px;padding-top:22px;border-top:1px solid rgba(255,255,255,.09)}.section-jump a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;color:#b2bac8;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);transition:.22s ease}.section-jump a:hover{color:#fff;border-color:rgba(139,89,251,.28);background:rgba(139,89,251,.06);transform:translateY(-2px)}.section-jump span{color:var(--brand-violet);font-weight:850;font-size:12px}
.service-direction{scroll-margin-top:110px}.service-direction .split{align-items:center}.inline-actions{display:flex;flex-wrap:wrap;gap:20px;margin-top:28px}.text-action{font-size:14px;font-weight:750;color:var(--brand-violet);border-bottom:1px solid rgba(139,89,251,.28);padding-bottom:4px}.service-steps{margin-top:42px}.dark-deliverables .deliverable{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.035)}.dark-deliverables .deliverable b{color:#f3f5fa}.dark-deliverables .deliverable p{color:#9da6b5}
.approach-intro{max-width:880px;margin-bottom:46px}.approach-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.approach-flow article{position:relative;padding:34px 30px;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(155deg,rgba(255,255,255,.05),rgba(255,255,255,.02));overflow:hidden}.approach-flow article:before{content:"";position:absolute;left:30px;right:30px;top:0;height:1px;background:linear-gradient(90deg,var(--brand-violet),var(--neon-2),transparent)}.approach-flow small{color:#a69cff;font-size:12px;font-weight:850;letter-spacing:.08em}.approach-flow h3{font-size:28px;line-height:1.05;letter-spacing:-.035em;margin:24px 0 12px}.approach-flow p{color:#9ba4b3;line-height:1.6;margin:0}.principle-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}.principle-grid article{padding:26px;border:1px solid rgba(16,20,29,.12);border-radius:20px;background:rgba(255,255,255,.34)}.principle-grid span{display:block;color:var(--brand-violet);font-size:20px;font-weight:850;margin-bottom:26px}.principle-grid h3{font-size:23px;line-height:1.05;letter-spacing:-.03em;margin:0 0 12px}.principle-grid p{color:#68707b;line-height:1.55;margin:0}.studio-related{margin-top:34px}.studio-related .related-card{border-color:rgba(16,20,29,.11);background:rgba(255,255,255,.28);color:#111318}.studio-related .related-card p{color:#68707b}.studio-related .related-card small{color:#7a8290}
.footer-grid-compact{grid-template-columns:1.35fr repeat(4,1fr);gap:42px}.footer-grid-compact .footer-brand{max-width:310px}
@media(max-width:1100px){.section-jump{grid-template-columns:repeat(2,1fr)}.approach-flow{grid-template-columns:1fr}.principle-grid{grid-template-columns:repeat(2,1fr)}.footer-grid-compact{grid-template-columns:1fr 1fr}.footer-grid-compact .footer-brand{grid-column:1/-1}}
@media(max-width:700px){.section-jump{grid-template-columns:1fr;margin-top:40px}.compact-menu-grid{grid-template-columns:1fr}.principle-grid{grid-template-columns:1fr}.footer-grid-compact{grid-template-columns:1fr}.footer-grid-compact .footer-brand{grid-column:auto}.breadcrumbs{font-size:10px;gap:7px}.approach-flow article{padding:28px 24px}}


/* TRUE VISUAL v7.4 - unified optical section intro
   Pattern: section label | heading | concise explanation */
.optical-section-head{
  display:grid;
  grid-template-columns:180px minmax(0,1fr) 360px;
  gap:44px;
  align-items:start;
  margin-bottom:56px;
}
.optical-section-head .optical-label{
  display:flex;
  align-items:center;
  gap:11px;
  padding-top:9px;
  font-size:11px;
  font-weight:760;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#70757e;
  white-space:nowrap;
}
.optical-section-head .optical-label:before{
  content:"";
  width:24px;
  height:1px;
  flex:0 0 auto;
  background:linear-gradient(90deg,var(--neon),var(--neon-2));
  box-shadow:0 0 10px rgba(124,108,255,.28);
}
.optical-section-head .optical-main h2{
  margin:0;
  max-width:1100px;
  font-size:clamp(50px,4.7vw,82px);
  line-height:.98;
  letter-spacing:-.05em;
}
.optical-section-head .optical-side{
  min-width:0;
  padding-left:28px;
  border-left:1px solid var(--divider-light);
  color:#5f6672;
  font-size:17px;
  line-height:1.62;
}
.optical-section-head .optical-side p{
  margin:0;
}
.optical-section-head .optical-side .section-more{
  margin-top:16px;
}
.dark-section .optical-section-head .optical-label{
  color:#9ca5b5;
}
.dark-section .optical-section-head .optical-side{
  border-left-color:var(--divider-dark);
  color:#99a2b1;
}
.optical-section-head + .portfolio-grid,
.optical-section-head + .service-list,
.optical-section-head + .article-grid{
  margin-top:0;
}
.process-section .process-stage-wide{
  width:100%;
  height:760px;
  margin-top:8px;
}
.process-stage-wide .process-card{
  width:50%;
}
.process-stage-wide .pc1{left:7%;top:7%}
.process-stage-wide .pc2{right:7%;top:36%}
.process-stage-wide .pc3{left:14%;bottom:6%}

.contact-optical{
  position:relative;
}
.contact-optical .optical-section-head{
  margin-bottom:0;
}
.contact-optical .optical-side .page-actions{
  margin-top:24px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
}
.contact-optical .mail-link{
  color:#aeb6c5;
}

@media(max-width:1100px){
  .optical-section-head{
    grid-template-columns:1fr;
    gap:22px;
    margin-bottom:42px;
  }
  .optical-section-head .optical-label{
    padding-top:0;
  }
  .optical-section-head .optical-side{
    max-width:760px;
  }
  .process-section .process-stage-wide{
    height:720px;
  }
  .process-stage-wide .process-card{
    width:64%;
  }
}
@media(max-width:700px){
  .optical-section-head{
    gap:18px;
    margin-bottom:34px;
  }
  .optical-section-head .optical-main h2{
    font-size:46px;
  }
  .optical-section-head .optical-side{
    padding-left:18px;
    font-size:16px;
  }
  .process-section .process-stage-wide{
    height:700px;
  }
  .process-stage-wide .process-card{
    width:84%;
  }
}


/* TRUE VISUAL v7.4.1
   One optical axis for all homepage section intros.
   The vertical divider of the description column must stay on the same X coordinate. */
@media (min-width:1101px){
  .statement-grid,
  .optical-section-head{
    grid-template-columns:
      clamp(96px,8vw,190px)
      minmax(0,1fr)
      clamp(280px,22vw,440px);
    gap:clamp(26px,3vw,58px);
  }
}
@media (min-width:1101px) and (max-width:1279px){
  .statement-grid,
  .optical-section-head{
    grid-template-columns:92px minmax(0,1fr) 280px;
    gap:24px;
  }
}
@media (max-width:1100px){
  .statement-grid,
  .optical-section-head{
    grid-template-columns:1fr;
    gap:24px;
  }
}


/* Cursor glow is a homepage-only atmospheric effect. */
.cursor-glow{display:none}
body[data-page="home"] .cursor-glow{display:block}
@media(max-width:700px){
  body[data-page="home"] .cursor-glow{display:none}
}


@keyframes portfolioIndicatorSheen{
  0%,100%{filter:brightness(1);}
  50%{filter:brightness(1.12);}
}

/* TRUE VISUAL v7.12 - homepage portfolio deck
   One cinematic preview + compact project index.
   Keeps the whole Works section coherent in one viewport. */

#work.section{
  padding-top:clamp(74px,8vh,108px);
  padding-bottom:clamp(74px,8vh,108px);
}

#work .tv-section-intro{
  margin-bottom:clamp(34px,4vh,50px);
}

.portfolio-deck{
  display:grid;
  grid-template-columns:minmax(0,2.25fr) minmax(240px,.75fr);
  gap:clamp(20px,2vw,32px);
  align-items:stretch;
}

.portfolio-stage{
  position:relative;
  min-width:0;
  height:clamp(390px,50vh,560px);
  border-radius:26px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:#0d1119;
  box-shadow:0 30px 70px rgba(0,0,0,.24);
}

.portfolio-stage:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:7;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
}

.portfolio-panel{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transform:scale(.985);
  transition:
    opacity .34s var(--tv-ease),
    transform .5s var(--tv-ease),
    visibility 0s linear .5s;
}

.portfolio-panel.is-active{
  opacity:1;
  visibility:visible;
  transform:scale(1);
  transition-delay:0s;
  z-index:2;
}

.portfolio-panel .project-visual{
  position:absolute;
  inset:0;
  width:100%;
  height:100%!important;
  border:0;
  border-radius:0;
  box-shadow:none;
  transform:none!important;
}

.portfolio-panel .project-visual:after{
  display:none;
}

.portfolio-stage-caption{
  position:absolute;
  z-index:8;
  left:20px;
  right:20px;
  bottom:18px;
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  gap:20px;
  padding:15px 16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(9,12,19,.72);
  -webkit-backdrop-filter:blur(16px) saturate(130%);
  backdrop-filter:blur(16px) saturate(130%);
  box-shadow:0 16px 36px rgba(0,0,0,.18);
}

.portfolio-stage-caption small,
.portfolio-stage-caption strong{
  display:block;
}

.portfolio-stage-caption small{
  margin-bottom:5px;
  color:#8d96a6;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.portfolio-stage-caption strong{
  color:#f4f6fb;
  font-size:clamp(20px,1.6vw,28px);
  line-height:1;
  letter-spacing:-.035em;
}


.portfolio-index{
  display:grid;
  grid-template-rows:repeat(4,1fr);
  min-width:0;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.portfolio-index-item{
  position:relative;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 20px;
  align-items:center;
  gap:12px;
  min-height:0;
  padding:18px 4px 18px 22px;
  color:#8791a2;
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:
    color .25s ease,
    padding-left .28s var(--tv-ease),
    background .25s ease;
}

.portfolio-index-item:last-child{
  border-bottom:0;
}

.portfolio-index-item:before{
  content:none;
}

.portfolio-index-item:after{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:4px;
  height:22px;
  transform:translateY(-50%);
  border-radius:999px;
  background:
    linear-gradient(180deg,
      rgba(139,89,251,0) 0%,
      rgba(139,89,251,.92) 18%,
      rgba(139,89,251,1) 42%,
      rgba(82,214,255,1) 76%,
      rgba(82,214,255,0) 100%);
  box-shadow:
    0 0 12px rgba(139,89,251,.34),
    0 0 24px rgba(82,214,255,.18);
  opacity:0;
  transition:
    height .30s var(--tv-ease),
    width .24s var(--tv-ease),
    opacity .24s ease,
    box-shadow .28s ease,
    transform .28s var(--tv-ease);
}

.portfolio-index-item:hover,
.portfolio-index-item:focus-visible{
  color:#dfe4ed;
  padding-left:26px;
}

.portfolio-index-item:hover:after,
.portfolio-index-item:focus-visible:after{
  height:34px;
  opacity:.9;
  box-shadow:
    0 0 16px rgba(139,89,251,.42),
    0 0 30px rgba(82,214,255,.24);
}

.portfolio-index-item.is-active{
  color:#fff;
  padding-left:28px;
  background:linear-gradient(90deg,rgba(139,89,251,.065),transparent 72%);
}

.portfolio-index-item.is-active:after{
  height:0;
  width:4px;
  opacity:0;
  box-shadow:none;
}

.portfolio-index-item.is-active:hover:after,
.portfolio-index-item.is-active:focus-visible:after{
  height:72px;
  opacity:1;
  animation:portfolioIndicatorSheen 2.8s ease-in-out infinite;
  box-shadow:
    0 0 18px rgba(139,89,251,.5),
    0 0 34px rgba(82,214,255,.32);
}

.portfolio-index-num{
  color:#667184;
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.portfolio-index-item.is-active .portfolio-index-num{
  color:#9f83ff;
}

.portfolio-index-copy small,
.portfolio-index-copy strong{
  display:block;
}

.portfolio-index-copy small{
  margin-bottom:7px;
  color:#707a8b;
  font-size:9px;
  line-height:1.15;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.portfolio-index-copy strong{
  color:inherit;
  font-size:clamp(18px,1.3vw,24px);
  line-height:1.04;
  letter-spacing:-.035em;
}

.portfolio-index-arrow{
  opacity:.34;
  transform:translateX(-4px);
  transition:opacity .22s ease,transform .22s ease;
}

.portfolio-index-item:hover .portfolio-index-arrow,
.portfolio-index-item.is-active .portfolio-index-arrow{
  opacity:1;
  transform:translateX(0);
}

@media(max-width:1279px){
  .portfolio-deck{
    grid-template-columns:minmax(0,1.9fr) minmax(220px,.8fr);
  }
  .portfolio-stage{
    height:clamp(350px,47vh,500px);
  }
  .portfolio-index-item{
    padding-top:14px;
    padding-bottom:14px;
  }
}

@media(max-width:1100px){
  .portfolio-deck{
    grid-template-columns:1fr;
  }
  .portfolio-stage{
    height:clamp(360px,55vw,520px);
  }
  .portfolio-index{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:auto auto;
    border-bottom:0;
  }
  .portfolio-index-item{
    min-height:92px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .portfolio-index-item:nth-child(odd){
    border-right:1px solid rgba(255,255,255,.08);
  }
}

@media(max-width:700px){
  #work.section{
    padding-top:76px;
    padding-bottom:76px;
  }
  .portfolio-stage{
    height:330px;
    border-radius:20px;
  }
  .portfolio-stage-caption{
    left:12px;
    right:12px;
    bottom:12px;
    padding:12px;
  }
  .portfolio-stage-caption a{
    display:none;
  }
  .portfolio-index{
    grid-template-columns:1fr;
  }
  .portfolio-index-item:nth-child(odd){
    border-right:0;
  }
}


/* TRUE VISUAL v7.12.1 - UX refinement package */

/* 04 / ПРОЦЕСС - remove the heavy backing plate so the cards work as independent layers */
.process-section .process-stage-wide{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
}
.process-section .process-stage-wide:before,
.process-section .process-stage-wide:after{
  display:none;
}
.process-section .process-stage-wide .process-grid{
  opacity:.5;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,.18) 82%, transparent 100%);
}

/* Make intro links read as actual actions instead of quiet underlined text */
.section-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(17,19,24,.16);
  background:rgba(255,255,255,.58);
  color:#1b1e25;
  font-size:13px;
  font-weight:780;
  box-shadow:0 10px 28px rgba(17,19,24,.06);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease, color .22s ease;
  padding-bottom:0;
}
.dark-section .section-more,
.section-more.on-dark{
  background:rgba(255,255,255,.045);
  color:#eef2f9;
  border-color:rgba(255,255,255,.16);
}
.section-more:hover{
  color:var(--brand-violet);
  border-color:rgba(139,89,251,.42);
  box-shadow:0 16px 40px rgba(139,89,251,.10);
  transform:translateY(-2px);
}
.tv-section-intro__side{
  display:grid;
  align-content:start;
  gap:16px;
}
.section-actions{
  margin-top:28px;
  display:flex;
  gap:14px;
}
.section-actions-center{
  justify-content:center;
}
.section-actions-materials{
  margin-top:24px;
}

/* Materials cards become obvious large buttons */
.article-grid{
  align-items:stretch;
}
.article-card-link{
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}
.article-card-link .article-card-cta{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:780;
  color:#171a21;
}
.article-card-link:hover,
.article-card-link:focus-visible{
  transform:translateY(-8px);
  border-color:rgba(139,89,251,.28);
  box-shadow:0 30px 72px rgba(25,26,31,.12), 0 0 0 1px rgba(139,89,251,.10);
}
.article-card-link:hover .article-card-cta,
.article-card-link:focus-visible .article-card-cta{
  color:var(--brand-violet);
}
.article-card-link:after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(139,89,251,0);
  transition:box-shadow .22s ease;
}
.article-card-link:hover:after,
.article-card-link:focus-visible:after{
  box-shadow:inset 0 0 0 1px rgba(139,89,251,.16);
}

/* Footer with legal links */
.footer-grid-compact{
  grid-template-columns:1.2fr .8fr .8fr .8fr .8fr .8fr;
  gap:40px;
}
.footer-legal-inline a{
  color:#8f98a8;
}
.footer-legal-inline a:hover{
  color:#fff;
}

/* Helper layouts for legal/sitemap pages */
.content-grid-single{
  display:block;
}
.legal-copy{
  max-width:980px;
}
.legal-copy .content-title{
  margin-top:58px;
}
.legal-copy .content-title:first-child{
  margin-top:0;
}
.legal-copy p{
  max-width:860px;
}
.sitemap-grid .service-card-page{
  text-decoration:none;
}
.sitemap-links{
  margin-top:28px;
}
.sitemap-links .step p{
  line-height:1.9;
}
.sitemap-links a:hover{
  color:var(--brand-violet);
}

@media(max-width:1400px){
  .footer-grid-compact{
    grid-template-columns:1.2fr repeat(3,.9fr) 1fr;
  }
}
@media(max-width:1100px){
  .footer-grid-compact{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:700px){
  .section-actions,
  .section-actions-center{
    justify-content:flex-start;
  }
}


/* TRUE VISUAL v7.12.2 - transition icon system
   Based on the supplied next-chevron silhouette. Kept local and recolored via CSS mask. */
.tv-next-icon{
  display:inline-block;
  flex:0 0 auto;
  width:.72em;
  height:.72em;
  margin-left:.44em;
  vertical-align:-.02em;
  background:currentColor;
  clip-path:polygon(35.6% 10.4%,29.2% 16.9%,62.3% 50%,29.2% 83.1%,35.6% 89.6%,75% 50%);
  -webkit-clip-path:polygon(35.6% 10.4%,29.2% 16.9%,62.3% 50%,29.2% 83.1%,35.6% 89.6%,75% 50%);
  transition:transform .22s var(--tv-ease),opacity .22s ease,color .22s ease;
}

a:hover > .tv-next-icon,
a:focus-visible > .tv-next-icon,
.section-more:hover .tv-next-icon,
.text-action:hover .tv-next-icon,
.article-card-link:hover .tv-next-icon,
.work-tile:hover .tv-next-icon,
.service-card-page:hover .tv-next-icon{
  transform:translateX(3px);
}

/* Light surfaces: use existing dark text tone. */
.paper .tv-next-icon,
.articles .tv-next-icon,
.page-section.paper .tv-next-icon,
.article-card-link .tv-next-icon,
.service-card-page .tv-next-icon,
.text-action .tv-next-icon{
  color:#171a21;
}

/* Dark surfaces: the icon becomes branded white and inherits violet on active/hover states. */
.dark-section .tv-next-icon,
.page-section.dark .tv-next-icon,
.section-more.on-dark .tv-next-icon,
.portfolio-index .tv-next-icon,
.portfolio-stage-caption .tv-next-icon{
  color:#f4f6fb;
}

.portfolio-index-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
}
.portfolio-index-arrow .tv-next-icon{
  width:12px;
  height:12px;
  margin-left:0;
}
.service-row > b{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.service-row > b .tv-next-icon{
  width:14px;
  height:14px;
  margin-left:0;
}
.article-card-cta,
.tv-link-action{
  display:inline-flex;
  align-items:center;
}


/* TRUE VISUAL v7.12.4 - compact transition actions.
   Not a generic outline pill: the label and icon are split into two visual zones. */
.section-more{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:48px;
  padding:0 49px 0 17px;
  border:1px solid rgba(116,107,224,.30);
  border-radius:13px;
  background:linear-gradient(180deg,#191d29,#10141d);
  color:#f5f7fb;
  font-size:13px;
  font-weight:780;
  letter-spacing:-.01em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 28px rgba(10,13,20,.12),
    0 0 0 1px rgba(139,89,251,.04);
  transition:transform .24s var(--tv-ease),border-color .24s ease,box-shadow .24s ease,color .24s ease,filter .24s ease;
}
.section-more:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 82% 20%,rgba(82,214,255,.13),transparent 28%),
    linear-gradient(110deg,transparent 0 54%,rgba(139,89,251,.08) 67%,transparent 82%);
  opacity:.72;
  transition:opacity .24s ease,transform .34s var(--tv-ease);
}
.section-more:after{
  content:"";
  position:absolute;
  top:9px;
  bottom:9px;
  right:38px;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.16),transparent);
}
.section-more .tv-next-icon{
  position:absolute;
  right:16px;
  top:50%;
  width:11px;
  height:11px;
  margin:0;
  color:#f4f6fb!important;
  transform:translateY(-50%);
}
.section-more:hover,
.section-more:focus-visible{
  color:#fff;
  border-color:rgba(82,214,255,.44);
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 16px 34px rgba(8,11,18,.18),
    0 0 24px rgba(139,89,251,.12),
    0 0 0 1px rgba(82,214,255,.08);
}
.section-more:hover:before,
.section-more:focus-visible:before{
  opacity:1;
  transform:translateX(4px);
}
.section-more:hover .tv-next-icon,
.section-more:focus-visible .tv-next-icon{
  transform:translate(3px,-50%);
}

/* On dark sections the same geometry becomes a deeper glass control. */
.dark-section .section-more,
.section-more.on-dark{
  background:linear-gradient(180deg,rgba(22,27,40,.94),rgba(10,14,22,.98));
  color:#f5f7fb;
  border-color:rgba(143,135,237,.25);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 12px 30px rgba(0,0,0,.20),
    0 0 18px rgba(139,89,251,.05);
}

/* Light-background secondary buttons must read as buttons immediately. */
.articles .button-secondary,
.paper .button-secondary,
.page-section.paper .button-secondary{
  color:#fff;
  box-shadow:
    0 16px 34px rgba(17,20,29,.16),
    0 0 0 1px rgba(72,63,153,.16),
    0 0 24px rgba(139,89,251,.08);
}
.articles .button-secondary::after,
.paper .button-secondary::after,
.page-section.paper .button-secondary::after{
  background:
    radial-gradient(circle 92px at var(--pointer-x,50%) var(--pointer-y,50%),rgba(139,89,251,.20),rgba(82,214,255,.08) 38%,transparent 72%),
    linear-gradient(180deg,#1b1f2b,#10141d);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 0 30px rgba(139,89,251,.035);
}
.articles .button-secondary::before,
.paper .button-secondary::before,
.page-section.paper .button-secondary::before{
  opacity:.68;
}
.articles .button-secondary .tv-next-icon,
.paper .button-secondary .tv-next-icon,
.page-section.paper .button-secondary .tv-next-icon{
  color:#fff!important;
}

/* All anchor buttons show the transition icon as a real part of the control. */
a.button .tv-next-icon{
  position:relative;
  z-index:3;
  width:11px;
  height:11px;
  margin-left:11px;
  color:currentColor;
}
a.button:hover .tv-next-icon,
a.button:focus-visible .tv-next-icon{
  transform:translateX(3px);
}

/* Portfolio caption link: same icon language. */
.portfolio-stage-caption a{
  display:inline-flex;
  align-items:center;
}
.portfolio-stage-caption a .tv-next-icon{
  width:10px;
  height:10px;
  color:#f4f6fb;
}

/* Keep the icon readable inside the compact project index. */
.portfolio-index-arrow .tv-next-icon{
  display:block!important;
  background:#f4f6fb!important;
  opacity:1!important;
}

/* Service list transition chevrons on light background. */
.service-row > b .tv-next-icon{
  display:block!important;
  background:#171a21!important;
  opacity:.72;
}
.service-row:hover > b .tv-next-icon{
  opacity:1;
  color:var(--brand-violet);
  background:var(--brand-violet)!important;
  transform:translateX(3px);
}


/* ==========================================================================\n   TRUE VISUAL v7.13.0 - shared interior-page system + button taxonomy\n   ========================================================================== */

/* --- Button taxonomy ------------------------------------------------------ */
.button-role-primary{
  justify-content:center;
  gap:0;
  padding-left:24px;
  padding-right:24px;
}
.button-role-primary .tv-next-icon,
.button-primary .tv-next-icon{
  display:none!important;
}

/* Secondary transition action. The chevron belongs ONLY to this family. */
.button-secondary-action.button{
  min-height:50px;
  padding:0 48px 0 18px;
  border-radius:13px;
  border-color:rgba(123,114,226,.30);
  background:transparent;
  box-shadow:0 12px 30px rgba(0,0,0,.13),0 0 0 1px rgba(139,89,251,.035);
  isolation:isolate;
}
.button-secondary-action.button::before{
  background:linear-gradient(110deg,transparent 0 50%,rgba(139,89,251,.16) 66%,rgba(82,214,255,.13) 76%,transparent 90%);
  opacity:.55;
  animation:none;
  transform:none;
  left:0;top:0;width:auto;aspect-ratio:auto;inset:0;
}
.button-secondary-action.button::after{
  inset:1px;
  border-radius:12px;
  background:
    radial-gradient(circle 88px at var(--pointer-x,78%) var(--pointer-y,35%),rgba(82,214,255,.11),transparent 70%),
    linear-gradient(180deg,#1a1e2a,#10141d);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.button-secondary-action.button .tv-next-icon{
  position:absolute;
  right:17px;
  top:50%;
  z-index:3;
  width:11px;
  height:11px;
  margin:0;
  color:#f4f6fb!important;
  transform:translateY(-50%);
}
.button-secondary-action.button::marker{display:none}
.button-secondary-action.button:hover .tv-next-icon,
.button-secondary-action.button:focus-visible .tv-next-icon{
  transform:translate(3px,-50%);
}

/* Section helper and standard secondary button share the same semantics. */
.section-more.button-secondary-action{
  min-height:50px;
}

.button-secondary-action-inline,
.link-row.button-secondary-action-inline{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  font-weight:750;
}
.button-secondary-action-inline .tv-next-icon{
  width:10px;
  height:10px;
  margin-left:2px;
}
.button-secondary-action-inline:hover .tv-next-icon,
.button-secondary-action-inline:focus-visible .tv-next-icon{
  transform:translateX(3px);
}

/* Menu and navigator controls never inherit transition chevrons. */
.nav-action .tv-next-icon,
.menu-action .tv-next-icon,
.portfolio-index-arrow{
  display:none!important;
}

/* --- Shared internal-page hero ------------------------------------------- */
body.interior .page-hero{
  min-height:auto;
  padding:152px 0 86px;
  background:
    radial-gradient(circle at 84% 8%,rgba(139,89,251,.13),transparent 28%),
    linear-gradient(180deg,#090c13,#0a0e17 68%,#090c13);
}
body.interior .page-hero:before{
  width:660px;
  height:660px;
  right:-230px;
  top:-280px;
  opacity:.72;
}
body.interior .page-hero:after{
  opacity:.48;
}
body.interior .page-hero-grid{
  grid-template-columns:minmax(0,1fr) clamp(300px,24vw,390px);
  gap:clamp(46px,5vw,86px);
  align-items:end;
}
body.interior .page-title{
  max-width:1120px;
  margin:18px 0 26px;
  font-size:clamp(60px,5.7vw,98px);
  line-height:.94;
  letter-spacing:-.055em;
}
body.interior .page-lead{
  max-width:820px;
  font-size:clamp(18px,1.25vw,22px);
  line-height:1.58;
  color:#a0a9b8;
}
body.interior .page-hero-side{
  align-self:end;
  max-width:390px;
  padding-left:26px;
  color:#939cac;
  font-size:16px;
  line-height:1.65;
}
body.interior .breadcrumbs{
  margin-bottom:18px;
  font-size:10px;
  letter-spacing:.12em;
  color:#697384;
}
body.interior .breadcrumbs a{color:#929cac}
body.interior .breadcrumbs a:hover{color:#fff}

/* Case pages need a hierarchy between project name and the descriptive line. */
.case-page .page-title{
  font-size:clamp(58px,5.3vw,92px);
}
.case-page .page-title > .accent{
  display:block;
  max-width:1000px;
  margin-top:14px;
  font-size:.58em;
  line-height:1.08;
  letter-spacing:-.045em;
}
.case-page .page-hero-side{max-width:360px}

/* Legal pages do not need an oversized commercial hero. */
.legal-page .page-hero,
.sitemap-page .page-hero{
  padding-bottom:72px;
}
.legal-page .page-title,
.sitemap-page .page-title{
  font-size:clamp(56px,5vw,88px);
}

/* --- Shared section rhythm ----------------------------------------------- */
body.interior .page-section{
  padding:104px 0;
}
body.interior .section-label{
  margin-bottom:28px;
  gap:11px;
  font-size:11px;
  letter-spacing:.15em;
}
body.interior .section-label:before{
  width:24px;
  background:linear-gradient(90deg,var(--brand-violet),var(--neon-2));
}
body.interior .content-title{
  font-size:clamp(46px,4.25vw,72px);
  line-height:.98;
  margin-bottom:24px;
}
body.interior .content-lead{
  max-width:760px;
  font-size:18px;
  line-height:1.62;
}
body.interior .split,
body.interior .split.reverse{
  gap:clamp(52px,5vw,82px);
}

/* Common card language on internal pages. */
body.interior .info-card,
body.interior .deliverable,
body.interior .step,
body.interior .related-card,
body.interior .service-card-page{
  border-radius:22px;
  transition:transform .24s var(--tv-ease),border-color .24s ease,box-shadow .24s ease,background .24s ease;
}
body.interior .page-section.paper .info-card,
body.interior .page-section.paper .deliverable,
body.interior .page-section.paper .service-card-page,
body.interior .page-section.paper .principle-grid article{
  border-color:rgba(17,19,24,.11);
  background:rgba(255,255,255,.34);
}
body.interior .page-section.dark .deliverable,
body.interior .page-section.dark .step,
body.interior .page-section.dark .related-card,
body.interior .page-section.dark .info-card{
  border-color:rgba(255,255,255,.09);
  background:linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
}
body.interior .info-card:hover,
body.interior .deliverable:hover,
body.interior .related-card:hover,
body.interior .service-card-page:hover{
  transform:translateY(-4px);
  border-color:rgba(139,89,251,.24);
  box-shadow:0 22px 55px rgba(17,19,24,.09),0 0 24px rgba(139,89,251,.045);
}

/* CTA sections use the same visual family as the homepage, without pretending to be content cards. */
body.interior .big-cta{
  max-width:1180px;
  margin-inline:auto;
  padding:clamp(42px,4vw,64px);
  border-radius:28px;
  border-color:rgba(139,89,251,.20);
  background:
    radial-gradient(circle at 88% 15%,rgba(82,214,255,.10),transparent 28%),
    linear-gradient(135deg,rgba(139,89,251,.12),rgba(255,255,255,.025));
}
body.interior .big-cta h2{
  font-size:clamp(46px,4.6vw,78px);
}
body.interior .big-cta p{
  font-size:17px;
  max-width:720px;
}

/* --- Navigator families -------------------------------------------------- */
.section-jump{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:52px;
  padding-top:0;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  overflow:hidden;
  background:rgba(255,255,255,.018);
}
.section-jump a{
  min-height:58px;
  border:0;
  border-right:1px solid rgba(255,255,255,.07);
  border-radius:0;
  background:transparent;
  padding:0 18px;
  transform:none!important;
}
.section-jump a:last-child{border-right:0}
.section-jump a:hover,
.section-jump a:focus-visible{
  background:linear-gradient(180deg,rgba(139,89,251,.08),rgba(82,214,255,.025));
  border-color:rgba(255,255,255,.07);
}
.section-jump a span{font-size:10px}

/* Work catalog filter is a real tab navigator. */
.work-filter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:34px;
}
.work-filter-tab{
  min-height:42px;
  padding:0 15px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.025);
  color:#8f99a9;
  cursor:pointer;
  transition:color .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.work-filter-tab:hover{
  color:#fff;
  border-color:rgba(139,89,251,.28);
  background:rgba(139,89,251,.05);
}
.work-filter-tab.is-active{
  color:#fff;
  border-color:rgba(139,89,251,.42);
  background:linear-gradient(180deg,rgba(139,89,251,.13),rgba(82,214,255,.045));
  box-shadow:0 0 20px rgba(139,89,251,.07);
}
.work-tile[hidden]{display:none!important}

/* Project switcher is a navigator: no chevron, selection is expressed by type + left rail. */
.portfolio-index-item{
  grid-template-columns:34px minmax(0,1fr)!important;
  padding-right:12px;
}

/* Homepage service rows are navigation rows, not helper buttons. */
.service-row{
  position:relative;
}
.service-row::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:22px;
  height:1px;
  transform:translateY(-50%) scaleX(.35);
  transform-origin:right center;
  background:linear-gradient(90deg,transparent,var(--brand-violet));
  opacity:0;
  transition:opacity .22s ease,transform .24s var(--tv-ease);
}
.service-row:hover::after{
  opacity:.72;
  transform:translateY(-50%) scaleX(1);
}

/* Work cards: keep helper action, but make the card itself the dominant click target. */
.works-grid{
  gap:28px;
}
.work-tile .project-visual{
  height:clamp(390px,31vw,500px);
}
.work-tile .project-meta{
  align-items:center;
  gap:22px;
  padding-top:18px;
}
.work-tile .project-meta > span{
  color:#aab3c2;
  font-size:12px;
}

/* Services: reduce visual fragmentation, keep text first. */
.service-direction .deliverables{
  gap:14px;
}
.service-direction .deliverable{
  padding:22px 24px;
}
.service-steps{
  margin-top:36px;
}

/* Studio cards use the same optical border/radius family. */
.studio-related .related-card .link-row,
.related-card .link-row{
  color:var(--brand-violet);
  font-size:13px;
  font-weight:760;
}
.page-section.dark .related-card .link-row{
  color:#c5cddd;
}

/* Design system samples */
.ds-button-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.ds-button-sample{
  padding:24px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  background:rgba(255,255,255,.03);
}
.ds-button-sample > small{
  display:block;
  margin-bottom:18px;
  color:#858fa0;
  font-size:10px;
  letter-spacing:.12em;
}
.ds-button-sample p{
  margin:18px 0 0;
  color:#8e98a9;
  font-size:13px;
  line-height:1.5;
}
.ds-menu-demo{
  min-height:46px;
  padding:0 18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.035);
  color:#fff;
}

@media(max-width:1100px){
  body.interior .page-hero-grid{grid-template-columns:1fr;gap:28px}
  body.interior .page-hero-side{max-width:720px}
  .section-jump{grid-template-columns:repeat(2,1fr)}
  .section-jump a:nth-child(2){border-right:0}
  .section-jump a:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.07)}
  .ds-button-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  body.interior .page-hero{padding:122px 0 68px}
  body.interior .page-title{font-size:52px}
  .case-page .page-title{font-size:52px}
  .case-page .page-title > .accent{font-size:.68em}
  body.interior .page-section{padding:78px 0}
  .section-jump{grid-template-columns:1fr}
  .section-jump a{border-right:0;border-bottom:1px solid rgba(255,255,255,.07)!important}
  .section-jump a:last-child{border-bottom:0!important}
  .ds-button-grid{grid-template-columns:1fr}
}


/* Taxonomy safety: menu and navigator families never show transition chevrons. */
.menu-action .tv-next-icon,
.nav-action .tv-next-icon{display:none!important}


/* TRUE VISUAL v7.13.2 ------------------------------------------------------ */

/* Footer: legal documents live only in their dedicated column. */
.footer-bottom{
  align-items:center;
  gap:18px 34px;
}
.footer-bottom .footer-copyright{
  color:#c2cad7;
}
.footer-bottom .footer-cms{
  margin-left:auto;
  color:#788293;
}

/* Materials taxonomy is editorial metadata, not microtext. */
body[data-page="materials"] .article-card > span:first-child,
.articles .article-card > span:first-child{
  font-size:13px;
  line-height:1.2;
  font-weight:820;
  letter-spacing:.105em;
  text-transform:uppercase;
  color:var(--brand-violet);
}
@media(min-width:1800px){
  body[data-page="materials"] .article-card > span:first-child,
  .articles .article-card > span:first-child{font-size:14px}
}

/* Service scope boards: one information panel instead of four fake buttons. */
.service-direction .deliverables.scope-board{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  overflow:hidden;
  border:1px solid rgba(17,19,24,.12);
  border-radius:26px;
  background:
    radial-gradient(circle at 96% 2%,rgba(139,89,251,.085),transparent 28%),
    rgba(255,255,255,.25);
}
.service-direction .scope-board-head{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 26px;
  border-bottom:1px solid rgba(17,19,24,.10);
}
.service-direction .scope-board-head span{
  font-size:11px;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#161920;
}
.service-direction .scope-board-head small{
  color:#858c98;
  font-size:11px;
}
.service-direction .scope-board .deliverable{
  min-height:170px;
  padding:26px 28px 30px;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
.service-direction .scope-board .deliverable:nth-child(2),
.service-direction .scope-board .deliverable:nth-child(4){
  border-right:1px solid rgba(17,19,24,.10)!important;
}
.service-direction .scope-board .deliverable:nth-child(2),
.service-direction .scope-board .deliverable:nth-child(3){
  border-bottom:1px solid rgba(17,19,24,.10)!important;
}
.service-direction .scope-index{
  display:block;
  margin-bottom:18px;
  color:var(--brand-violet);
  font-size:10px;
  font-weight:850;
  letter-spacing:.12em;
}
.service-direction .scope-board .deliverable b{
  font-size:21px;
  letter-spacing:-.02em;
}
.service-direction .scope-board .deliverable p{
  margin-top:9px;
  font-size:15px;
  line-height:1.55;
}
.page-section.dark .scope-board{
  border-color:rgba(255,255,255,.10)!important;
  background:
    radial-gradient(circle at 96% 2%,rgba(82,214,255,.06),transparent 30%),
    linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
}
.page-section.dark .scope-board-head{
  border-bottom-color:rgba(255,255,255,.09);
}
.page-section.dark .scope-board-head span{color:#f2f5fa}
.page-section.dark .scope-board-head small{color:#7f8999}
.page-section.dark .scope-board .deliverable:nth-child(2),
.page-section.dark .scope-board .deliverable:nth-child(4){border-right-color:rgba(255,255,255,.08)!important}
.page-section.dark .scope-board .deliverable:nth-child(2),
.page-section.dark .scope-board .deliverable:nth-child(3){border-bottom-color:rgba(255,255,255,.08)!important}

/* FAQ is decision support immediately before the contact form. */
.faq-layout{
  display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
  gap:clamp(56px,6vw,96px);
  align-items:start;
}
.faq-intro{
  position:sticky;
  top:150px;
}
.faq-list{
  border-top:1px solid rgba(17,19,24,.14);
}
.faq-item{
  border-bottom:1px solid rgba(17,19,24,.14);
}
.faq-item summary{
  list-style:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) 32px;
  align-items:center;
  gap:26px;
  min-height:88px;
  padding:18px 0;
  cursor:pointer;
  color:#181b21;
  font-size:20px;
  font-weight:760;
  letter-spacing:-.025em;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary i{
  position:relative;
  width:28px;
  height:28px;
  border-radius:50%;
  border:1px solid rgba(17,19,24,.16);
  transition:transform .25s var(--tv-ease),border-color .25s ease,background .25s ease;
}
.faq-item summary i:before,
.faq-item summary i:after{
  content:"";
  position:absolute;
  left:50%; top:50%;
  width:10px; height:1px;
  background:#161920;
  transform:translate(-50%,-50%);
}
.faq-item summary i:after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item[open] summary i{
  transform:rotate(45deg);
  border-color:rgba(139,89,251,.36);
  background:rgba(139,89,251,.06);
}
.faq-item summary:hover i{border-color:rgba(139,89,251,.42)}
.faq-item > div{
  padding:0 58px 28px 0;
}
.faq-item p{
  margin:0;
  max-width:760px;
  color:#68707b;
  font-size:16px;
  line-height:1.65;
}
.studio-jump{grid-template-columns:repeat(5,1fr)}

@media(max-width:1100px){
  .faq-layout{grid-template-columns:1fr;gap:38px}
  .faq-intro{position:static}
  .studio-jump{grid-template-columns:repeat(3,1fr)}
  .service-direction .scope-board .deliverable{min-height:150px}
}
@media(max-width:700px){
  .studio-jump{grid-template-columns:1fr}
  .service-direction .deliverables.scope-board{grid-template-columns:1fr}
  .service-direction .scope-board .deliverable{border-right:0!important}
  .service-direction .scope-board .deliverable:nth-child(2),
  .service-direction .scope-board .deliverable:nth-child(3),
  .service-direction .scope-board .deliverable:nth-child(4){border-bottom:1px solid rgba(17,19,24,.10)!important}
  .page-section.dark .scope-board .deliverable:nth-child(2),
  .page-section.dark .scope-board .deliverable:nth-child(3),
  .page-section.dark .scope-board .deliverable:nth-child(4){border-bottom-color:rgba(255,255,255,.08)!important}
  .scope-board-head{align-items:flex-start!important;flex-direction:column}
  .faq-item summary{font-size:18px}
}


/* TRUE VISUAL v7.13.3 - homepage service rows are transition rows, not navigator rows. */
.service-row.service-transition-row{
  text-decoration:none;
  color:inherit;
  grid-template-columns:80px 1fr 1.25fr 30px;
}
.service-row.service-transition-row::after{
  content:none!important;
  display:none!important;
}
.service-row.service-transition-row > .tv-next-icon{
  justify-self:end;
  display:block!important;
  width:14px;
  height:14px;
  margin:0;
  color:#171a21;
  background:currentColor;
  opacity:.66;
  transform:translateX(0);
  transition:transform .22s var(--tv-ease),opacity .22s ease,color .22s ease;
}
.service-row.service-transition-row:hover > .tv-next-icon,
.service-row.service-transition-row:focus-visible > .tv-next-icon{
  color:var(--brand-violet);
  opacity:1;
  transform:translateX(4px);
}
.service-row.service-transition-row:focus-visible{
  outline:none;
  background:linear-gradient(90deg,rgba(92,93,247,.06),transparent);
}

.link-row:after{content:none!important;display:none!important}


/* v7.13.4 - FAQ: branded interactive accordion */
.faq-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 14%,rgba(139,89,251,.075),transparent 26%),
    radial-gradient(circle at 68% 72%,rgba(82,214,255,.045),transparent 24%),
    #f2f1ec;
}
.faq-section:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(17,19,24,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(17,19,24,.022) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(90deg,transparent,black 44%,black 100%);
}
.faq-layout{position:relative;z-index:1}
.faq-list{
  display:grid;
  gap:10px;
  border-top:0;
}
.faq-item{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(17,19,24,.11);
  border-radius:18px;
  background:rgba(255,255,255,.38);
  box-shadow:0 10px 34px rgba(17,19,24,.025);
  transition:transform .26s var(--tv-ease),border-color .26s ease,box-shadow .26s ease,background .26s ease;
}
.faq-item:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(139,89,251,0),rgba(139,89,251,.045) 46%,rgba(82,214,255,.035),transparent 76%);
  opacity:0;
  transform:translateX(-14%);
  transition:opacity .28s ease,transform .45s var(--tv-ease);
}
.faq-item:hover{
  transform:translateY(-2px);
  border-color:rgba(139,89,251,.25);
  box-shadow:0 18px 46px rgba(79,65,154,.07);
}
.faq-item:hover:before{opacity:1;transform:translateX(0)}
.faq-item[open]{
  border-color:rgba(139,89,251,.35);
  background:linear-gradient(135deg,rgba(255,255,255,.66),rgba(139,89,251,.055));
  box-shadow:0 20px 60px rgba(82,64,160,.10);
}
.faq-item[open]:before{opacity:1;transform:translateX(0)}
.faq-item summary{
  position:relative;
  z-index:2;
  min-height:92px;
  padding:22px 24px 22px 28px;
  grid-template-columns:minmax(0,1fr) 42px;
  font-size:20px;
}
.faq-item summary i{
  width:38px;
  height:38px;
  border:1px solid rgba(17,19,24,.13);
  background:rgba(255,255,255,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
  transition:transform .28s var(--tv-ease),border-color .25s ease,background .25s ease,box-shadow .25s ease;
}
.faq-item summary i:before,.faq-item summary i:after{
  width:13px;
  height:2px;
  border-radius:999px;
  background:#1b1e25;
  transition:background .25s ease,box-shadow .25s ease;
}
.faq-item summary:hover i{
  border-color:rgba(139,89,251,.38);
  box-shadow:0 0 0 5px rgba(139,89,251,.055),0 0 24px rgba(139,89,251,.10);
}
.faq-item[open] summary i{
  transform:rotate(45deg);
  border-color:rgba(139,89,251,.54);
  background:linear-gradient(135deg,var(--brand-violet),#6d63ff 52%,var(--neon-2));
  box-shadow:0 0 0 6px rgba(139,89,251,.06),0 0 30px rgba(139,89,251,.20),0 0 30px rgba(82,214,255,.10);
}
.faq-item[open] summary i:before,.faq-item[open] summary i:after{
  background:#fff;
  box-shadow:0 0 9px rgba(255,255,255,.42);
}
.faq-item > div{
  position:relative;
  z-index:2;
  padding:0 84px 26px 28px;
}
.faq-item p{font-size:16px;line-height:1.68;color:#59616d}
@media(max-width:700px){
  .faq-item summary{padding:18px 18px;grid-template-columns:minmax(0,1fr) 38px;font-size:18px}
  .faq-item summary i{width:34px;height:34px}
  .faq-item > div{padding:0 18px 22px}
}


/* v7.13.4 - compact, balanced contact section */
#contact .contact-page-grid{
  grid-template-columns:minmax(360px,.92fr) minmax(520px,1.08fr);
  gap:clamp(44px,5vw,76px);
  align-items:center;
}
#contact .contact-info{gap:20px}
#contact .contact-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:8px;
}
#contact .contact-info-card{
  min-height:138px;
  padding:22px 24px;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.022));
}
#contact .contact-info-card:first-child{grid-column:1/-1;min-height:auto}
#contact .contact-info-card b{font-size:20px}
#contact .contact-form{
  width:100%;
  max-width:720px;
  justify-self:end;
  padding:28px;
  border-radius:24px;
  background:linear-gradient(150deg,rgba(18,23,35,.94),rgba(11,15,24,.88));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 28px 80px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.025);
}
#contact .contact-form label{margin-bottom:14px;font-size:10px}
#contact .contact-form input,#contact .contact-form select,#contact .contact-form textarea{
  margin-top:7px;
  padding:13px 14px;
  border-radius:11px;
}
#contact .contact-form textarea{min-height:118px;resize:vertical}
#contact .contact-form .button[type="submit"]{min-height:54px;margin-top:8px;font-size:15px}
.form-consents{display:grid;gap:9px;margin:14px 0 4px}
.form-consent{
  display:grid!important;
  grid-template-columns:18px minmax(0,1fr);
  align-items:start;
  gap:10px;
  margin:0!important;
  color:#8d96a6!important;
  font-size:10px!important;
  line-height:1.45;
  text-transform:none!important;
  letter-spacing:0!important;
}
.form-consent input{
  appearance:none;
  width:16px!important;height:16px!important;
  margin:0!important;padding:0!important;
  border-radius:4px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  background:rgba(255,255,255,.035)!important;
  display:grid!important;place-items:center;
}
.form-consent input:checked{
  border-color:rgba(139,89,251,.72)!important;
  background:linear-gradient(135deg,var(--brand-violet),var(--neon-2))!important;
  box-shadow:0 0 14px rgba(139,89,251,.20);
}
.form-consent input:checked:after{content:"";width:6px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:translateY(-1px) rotate(-45deg)}
.form-consent a{color:#c8d0dc;text-decoration:underline;text-decoration-color:rgba(200,208,220,.30);text-underline-offset:2px}
@media(max-width:1100px){
  #contact .contact-page-grid{grid-template-columns:1fr;align-items:start}
  #contact .contact-form{max-width:760px;justify-self:start}
}
@media(max-width:700px){
  #contact .contact-cards{grid-template-columns:1fr}
  #contact .contact-info-card:first-child{grid-column:auto}
  #contact .contact-form{padding:22px}
}


/* v7.13.4 - footer brand / ecosystem relationship */
.footer-brand .footer-tv-logo{width:152px;height:auto}
.footer-bottom{flex-wrap:wrap}
.footer-ecosystem{
  display:flex;
  align-items:center;
  gap:12px;
  color:#788293;
  line-height:1.45;
}
.footer-ecosystem > span a{color:#aeb7c5;text-decoration:none}
.footer-ecosystem > span a:hover{color:#fff}
.footer-tc-logo{
  display:inline-flex;
  align-items:center;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.footer-tc-logo:hover{border-color:rgba(139,89,251,.28);background:rgba(139,89,251,.05);transform:translateY(-1px)}
.footer-tc-logo img{width:112px;height:auto;display:block;opacity:.84;transition:opacity .2s ease}
.footer-tc-logo:hover img{opacity:1}
.footer-cms a{color:#8e98a8;text-decoration:none}.footer-cms a:hover{color:#fff}
@media(max-width:900px){.footer-bottom{align-items:flex-start}.footer-ecosystem{width:100%}.footer-cms{margin-left:0!important}}


/* v7.13.4 - legal documents */
.legal-page-hero{min-height:auto;padding-bottom:74px}
.legal-reading-shell{display:grid;grid-template-columns:220px minmax(0,880px);gap:70px;justify-content:center;align-items:start}
.legal-toc{position:sticky;top:150px;align-self:start}
.legal-toc-stick > span{display:block;margin-bottom:16px;color:#89919e;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.legal-toc nav{display:grid;gap:4px}
.legal-toc a{display:block;padding:7px 0;color:#7a818c;font-size:12px;line-height:1.35;border-left:1px solid rgba(17,19,24,.10);padding-left:12px;transition:color .2s ease,border-color .2s ease,transform .2s ease}
.legal-toc a:hover,.legal-toc a.active{color:var(--brand-violet);border-left-color:var(--brand-violet);transform:translateX(3px)}
.tv-legal-document{max-width:880px;font-size:17px;line-height:1.72;color:#333942}
.tv-legal-document .legal-meta{display:inline-block;margin:0 12px 12px 0;padding:8px 12px;border-radius:999px;border:1px solid rgba(17,19,24,.10);font-size:12px;color:#606773;background:rgba(255,255,255,.36)}
.tv-legal-document h2{scroll-margin-top:150px;margin:70px 0 20px;font-size:32px;line-height:1.08;letter-spacing:-.035em;color:#14171d}
.tv-legal-document h2:first-of-type{margin-top:34px}
.tv-legal-document p{margin:0 0 18px}
.tv-legal-document ul{margin:18px 0 26px;padding:18px 24px 18px 42px;border:1px solid rgba(17,19,24,.08);border-radius:16px;background:rgba(255,255,255,.34)}
.tv-legal-document li{margin:7px 0}.tv-legal-document li::marker{color:var(--brand-violet)}
.tv-legal-document a{color:#5d4ab2;text-decoration:underline;text-decoration-color:rgba(93,74,178,.25);text-underline-offset:3px}
@media(max-width:1000px){.legal-reading-shell{grid-template-columns:1fr}.legal-toc{position:static}.legal-toc nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}.legal-toc a{border-left:0;border-bottom:1px solid rgba(17,19,24,.08);padding:8px 0}}
@media(max-width:700px){.legal-toc nav{grid-template-columns:1fr}.tv-legal-document{font-size:16px}.tv-legal-document h2{font-size:27px}}

/* v7.13.5 - authoritative TRUE CREATOR logo supplied by user */
.footer-tc-logo{min-height:48px;padding:7px 10px}
.footer-tc-logo img{max-height:58px;object-fit:contain}


/* v7.13.9 - legal document geometry fix */
.legal-paper{
  overflow:hidden;
}
.legal-paper > .container{
  width:min(calc(100% - 64px),1320px);
  max-width:1320px;
}
.legal-reading-shell{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  grid-template-columns:200px minmax(0,860px);
  gap:56px;
  justify-content:center;
}
.legal-reading-shell > *{
  min-width:0;
}
.tv-legal-document{
  width:100%;
  max-width:860px;
  min-width:0;
  box-sizing:border-box;
  overflow-wrap:anywhere;
  word-break:normal;
}
.tv-legal-document p,
.tv-legal-document li,
.tv-legal-document a{
  max-width:100%;
  overflow-wrap:anywhere;
}
.tv-legal-document > .container,
.tv-legal-document > .narrow,
.tv-legal-document article.container{
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
.legal-toc{
  width:200px;
  max-width:200px;
}
@media(max-width:1000px){
  .legal-paper > .container{width:min(calc(100% - 40px),920px)}
  .legal-reading-shell{max-width:860px;grid-template-columns:1fr;gap:36px}
  .legal-toc{width:auto;max-width:none}
  .tv-legal-document{max-width:none}
}
@media(max-width:700px){
  .legal-paper > .container{width:min(calc(100% - 28px),680px)}
}

/* v7.13.9 - cleaner footer attribution */
.footer-bottom{
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto minmax(220px,1fr);
  align-items:center;
  gap:32px;
}
.footer-bottom .footer-copyright{
  justify-self:start;
  white-space:nowrap;
}
.footer-bottom .footer-cms{
  justify-self:end;
  color:#737d8d;
  white-space:nowrap;
}
.footer-ecosystem{
  justify-self:center;
  display:flex;
  align-items:center;
  gap:14px;
  color:#8f98a8;
  text-decoration:none;
  min-width:0;
  transition:color .22s ease,opacity .22s ease,transform .22s ease;
}
.footer-ecosystem img{
  width:58px;
  height:auto;
  display:block;
  opacity:.76;
  flex:0 0 auto;
  transition:opacity .22s ease;
}
.footer-ecosystem span{
  max-width:250px;
  line-height:1.35;
}
.footer-ecosystem:hover{
  color:#d7dde6;
  transform:translateY(-1px);
}
.footer-ecosystem:hover img{opacity:1}
.footer-bottom .footer-tc-logo{display:none!important}
@media(max-width:1100px){
  .footer-bottom{
    grid-template-columns:1fr 1fr;
    gap:20px 28px;
  }
  .footer-ecosystem{justify-self:end}
  .footer-bottom .footer-cms{justify-self:start;grid-column:1 / -1}
}
@media(max-width:700px){
  .footer-bottom{grid-template-columns:1fr;align-items:start}
  .footer-bottom .footer-copyright,
  .footer-ecosystem,
  .footer-bottom .footer-cms{justify-self:start;white-space:normal}
}


/* v7.13.11 - legal document reading layout
   Same sticky rhythm as article side navigation, but with the document TOC on the right. */
.legal-reading-shell{
  max-width:1180px;
  grid-template-columns:minmax(0,860px) 220px;
  gap:64px;
  justify-content:center;
  align-items:start;
}
.legal-reading-shell > .tv-legal-document{
  grid-column:1;
  grid-row:1;
}
.legal-reading-shell > .legal-toc{
  grid-column:2;
  grid-row:1;
  width:220px;
  max-width:220px;
  position:sticky;
  top:152px;
  align-self:start;
}
.legal-toc-stick{
  max-height:calc(100vh - 190px);
  overflow:auto;
  padding-right:6px;
  scrollbar-width:thin;
}
.legal-toc-stick > span{
  margin-bottom:18px;
}
.legal-toc a{
  padding:8px 0 8px 14px;
  font-size:12.5px;
  line-height:1.35;
}

/* Horizontal TRUE CREATOR lockup is better suited to the narrow footer attribution strip. */
.footer-ecosystem{
  gap:16px;
}
.footer-ecosystem img{
  width:142px;
  max-width:142px;
  height:auto;
  max-height:32px;
  object-fit:contain;
  opacity:.78;
}
.footer-ecosystem span{
  max-width:240px;
}

@media(max-width:1000px){
  .legal-reading-shell{
    max-width:860px;
    grid-template-columns:1fr;
    gap:36px;
  }
  .legal-reading-shell > .legal-toc,
  .legal-reading-shell > .tv-legal-document{
    grid-column:1;
    grid-row:auto;
  }
  .legal-reading-shell > .legal-toc{
    order:0;
    position:static;
    width:auto;
    max-width:none;
  }
  .legal-toc-stick{
    max-height:none;
    overflow:visible;
    padding-right:0;
  }
}

@media(max-width:700px){
  .footer-ecosystem{
    align-items:flex-start;
    gap:12px;
  }
  .footer-ecosystem img{
    width:128px;
    max-width:128px;
  }
}


/* v7.13.12 - legal TOC sticky fix
   Sticky was being cancelled by overflow:hidden on .legal-paper.
   Keep the legal reading section in the viewport scroll context. */
.legal-page .legal-paper,
.legal-page .legal-paper > .container,
.legal-page .legal-reading-shell{
  overflow:visible !important;
}

@media(min-width:1001px){
  .legal-page .legal-reading-shell > .legal-toc{
    position:sticky !important;
    top:152px !important;
    align-self:start !important;
    height:max-content;
  }

  .legal-page .legal-toc-stick{
    max-height:calc(100vh - 190px);
    overflow:auto;
    overscroll-behavior:contain;
  }
}


/* TRUE VISUAL v7.13.14 - contact form typography + global contact modal */

/* The standalone contact section remains on the Studio page, but its typography
   is deliberately larger so the form reads comfortably instead of like micro-UI. */
#contact .contact-form label{
  margin-bottom:16px;
  font-size:12px;
  line-height:1.25;
  letter-spacing:.09em;
}
#contact .contact-form input,
#contact .contact-form select,
#contact .contact-form textarea{
  margin-top:9px;
  padding:15px 16px;
  border-radius:12px;
  font-size:15px;
  line-height:1.45;
  letter-spacing:0;
  text-transform:none;
}
#contact .contact-form input::placeholder,
#contact .contact-form textarea::placeholder{
  color:#778191;
  opacity:1;
  font-size:14px;
}
#contact .contact-form select{font-size:15px}
#contact .contact-form textarea{min-height:138px}
#contact .contact-form .button[type="submit"]{
  min-height:58px;
  font-size:16px;
}
#contact .form-consent{
  grid-template-columns:20px minmax(0,1fr);
  gap:11px;
  font-size:12px!important;
  line-height:1.5;
}
#contact .form-consent input{
  width:18px!important;
  height:18px!important;
}
#contact .form-success{
  font-size:14px;
  line-height:1.5;
}

/* ---------- modal shell ---------- */
.contact-modal{
  position:fixed;
  inset:0;
  z-index:20000;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease,visibility 0s linear .28s;
}
.contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.contact-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,7,12,.78);
  -webkit-backdrop-filter:blur(14px) saturate(118%);
  backdrop-filter:blur(14px) saturate(118%);
}
.contact-modal__panel{
  position:relative;
  width:min(1060px,calc(100vw - 48px));
  max-height:min(820px,calc(100vh - 48px));
  overflow:auto;
  display:grid;
  grid-template-columns:minmax(300px,.78fr) minmax(480px,1.22fr);
  border:1px solid rgba(255,255,255,.11);
  border-radius:30px;
  color:#f5f7fb;
  background:
    radial-gradient(circle at 14% 16%,rgba(139,89,251,.16),transparent 30%),
    radial-gradient(circle at 88% 84%,rgba(82,214,255,.09),transparent 28%),
    linear-gradient(145deg,rgba(15,20,31,.985),rgba(7,10,17,.985));
  box-shadow:
    0 44px 120px rgba(0,0,0,.52),
    0 0 0 1px rgba(139,89,251,.025),
    inset 0 1px 0 rgba(255,255,255,.04);
  transform:translateY(20px) scale(.985);
  transition:transform .38s cubic-bezier(.2,.72,.2,1);
}
.contact-modal.is-open .contact-modal__panel{transform:translateY(0) scale(1)}
.contact-modal__panel:before{
  content:"";
  position:absolute;
  left:7%;right:7%;top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--brand-violet) 34%,var(--neon-2) 68%,transparent);
  box-shadow:0 0 24px rgba(139,89,251,.22);
  pointer-events:none;
}
.contact-modal__panel:after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.035),transparent 28%);
}
.contact-modal__intro{
  position:relative;
  z-index:1;
  padding:42px 38px 38px;
  border-right:1px solid rgba(255,255,255,.08);
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.contact-modal__brand{
  width:158px;
  height:auto;
  margin-bottom:46px;
}
.contact-modal__eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  color:#aeb7c7;
  font-size:11px;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-modal__eyebrow:before{
  content:"";
  width:30px;
  height:1px;
  background:linear-gradient(90deg,var(--brand-violet),var(--neon-2));
  box-shadow:0 0 12px rgba(139,89,251,.24);
}
.contact-modal__intro h2{
  margin:18px 0 18px;
  font-size:clamp(40px,4vw,62px);
  line-height:.96;
  letter-spacing:-.055em;
}
.contact-modal__intro h2 span{color:var(--brand-violet)}
.contact-modal__intro > p{
  margin:0;
  color:#9ba4b3;
  font-size:16px;
  line-height:1.62;
}
.contact-modal__facts{
  margin-top:auto;
  padding-top:38px;
  display:grid;
  gap:12px;
}
.contact-modal__fact{
  padding:15px 16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.contact-modal__fact small{
  display:block;
  margin-bottom:5px;
  color:#747f91;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-modal__fact strong{
  font-size:14px;
  font-weight:690;
}
.contact-modal__form-wrap{
  position:relative;
  z-index:1;
  padding:42px 42px 34px;
}
.contact-modal__close{
  position:absolute;
  z-index:3;
  right:18px;
  top:18px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.11);
  border-radius:50%;
  background:rgba(255,255,255,.025);
  color:#d8deea;
  cursor:pointer;
  transition:background .22s ease,border-color .22s ease,transform .26s cubic-bezier(.2,.72,.2,1),box-shadow .22s ease;
}
.contact-modal__close:before,
.contact-modal__close:after{
  content:"";
  position:absolute;
  width:15px;
  height:1.5px;
  border-radius:999px;
  background:currentColor;
}
.contact-modal__close:before{transform:rotate(45deg)}
.contact-modal__close:after{transform:rotate(-45deg)}
.contact-modal__close:hover{
  transform:rotate(90deg);
  border-color:rgba(139,89,251,.45);
  background:rgba(139,89,251,.08);
  box-shadow:0 0 24px rgba(139,89,251,.12);
}
.contact-modal__form-title{
  margin:2px 52px 26px 0;
  color:#9ca6b7;
  font-size:13px;
  line-height:1.55;
}
.contact-modal .contact-modal__form{
  display:grid;
  gap:0;
}
.contact-modal .contact-modal__form label{
  display:block;
  margin:0 0 16px;
  color:#aeb7c6;
  font-size:12px;
  font-weight:600;
  line-height:1.25;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.contact-modal .contact-modal__form input,
.contact-modal .contact-modal__form select,
.contact-modal .contact-modal__form textarea{
  display:block;
  width:100%;
  margin-top:9px;
  padding:15px 16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  outline:none;
  background:rgba(255,255,255,.045);
  color:#f5f7fb;
  font:inherit;
  font-size:15px;
  line-height:1.45;
  letter-spacing:0;
  text-transform:none;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.contact-modal .contact-modal__form textarea{min-height:116px;resize:vertical}
.contact-modal .contact-modal__form input::placeholder,
.contact-modal .contact-modal__form textarea::placeholder{color:#737d8e;opacity:1;font-size:14px}
.contact-modal .contact-modal__form input:focus,
.contact-modal .contact-modal__form select:focus,
.contact-modal .contact-modal__form textarea:focus{
  border-color:rgba(139,89,251,.58);
  background:rgba(255,255,255,.055);
  box-shadow:0 0 0 4px rgba(139,89,251,.07),0 0 26px rgba(82,214,255,.045);
}
.contact-modal .contact-modal__form option{background:#111624}
.contact-modal .form-row{gap:14px}
.contact-modal .button[type="submit"]{
  width:100%;
  min-height:58px;
  margin-top:4px;
  font-size:16px;
}
.contact-modal .form-consents{margin:15px 0 0;gap:9px}
.contact-modal .form-consent{
  grid-template-columns:20px minmax(0,1fr);
  gap:10px;
  font-size:11.5px!important;
  line-height:1.48;
}
.contact-modal .form-consent input{width:18px!important;height:18px!important}
.contact-modal .form-success{
  display:none;
  margin-top:14px;
  padding:14px 16px;
  border:1px solid rgba(94,255,182,.22);
  border-radius:12px;
  background:rgba(94,255,182,.06);
  color:#c9ffe8;
  font-size:13px;
  line-height:1.5;
}
.contact-modal .contact-modal__form.sent .form-success{display:block}
body.contact-modal-open,body.contact-success-open{overflow:hidden}

@media(max-width:900px){
  .contact-modal__panel{
    grid-template-columns:1fr;
    width:min(720px,calc(100vw - 32px));
  }
  .contact-modal__intro{
    min-height:auto;
    padding:32px 30px 26px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .contact-modal__brand{margin-bottom:26px;width:142px}
  .contact-modal__intro h2{font-size:42px}
  .contact-modal__facts{margin-top:24px;padding-top:0;grid-template-columns:1fr 1fr}
  .contact-modal__form-wrap{padding:30px}
}
@media(max-width:620px){
  .contact-modal{padding:10px}
  .contact-modal__panel{width:100%;max-height:calc(100vh - 20px);border-radius:22px}
  .contact-modal__intro{padding:26px 20px 22px}
  .contact-modal__brand{width:132px;margin-bottom:22px}
  .contact-modal__intro h2{font-size:37px}
  .contact-modal__intro > p{font-size:14px}
  .contact-modal__facts{grid-template-columns:1fr}
  .contact-modal__form-wrap{padding:24px 20px 22px}
  .contact-modal__close{right:14px;top:14px;width:38px;height:38px}
  .contact-modal .form-row{grid-template-columns:1fr}
}


/* TRUE VISUAL v7.13.15 - modal select chevron spacing */
.contact-modal .contact-modal__form select{
  -webkit-appearance:none;
  appearance:none;
  padding-right:52px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23E9EDF5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 19px center;
  background-size:14px 8px;
}

@media(max-width:700px){
  .contact-modal .contact-modal__form select{
    padding-right:48px;
    background-position:right 17px center;
  }
}


/* TRUE VISUAL v7.13.16 - custom modal task select */
:is(.contact-modal,#contact) .contact-modal__task-label{
  position:relative;
  z-index:12;
}

:is(.contact-modal,#contact) .tv-select{
  position:relative;
  width:100%;
  margin-top:9px;
  color:#f5f7fb;
  font-size:15px;
  line-height:1.4;
  letter-spacing:0;
  text-transform:none;
}

:is(.contact-modal,#contact) .tv-select__trigger{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:100%;
  min-height:54px;
  padding:14px 19px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  outline:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.034)),
    rgba(15,20,31,.90);
  color:#f5f7fb;
  font:inherit;
  font-weight:650;
  text-align:left;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease,
    transform .22s var(--tv-ease);
}

:is(.contact-modal,#contact) .tv-select__trigger:hover{
  border-color:rgba(139,89,251,.34);
  background:
    linear-gradient(180deg,rgba(139,89,251,.055),rgba(82,214,255,.018)),
    rgba(16,21,33,.95);
}

:is(.contact-modal,#contact) .tv-select__trigger:focus-visible,
:is(.contact-modal,#contact) .tv-select.is-open .tv-select__trigger{
  border-color:rgba(139,89,251,.62);
  box-shadow:
    0 0 0 4px rgba(139,89,251,.07),
    0 0 28px rgba(82,214,255,.055),
    inset 0 1px 0 rgba(255,255,255,.035);
}

:is(.contact-modal,#contact) .tv-select__chevron{
  position:relative;
  flex:0 0 17px;
  width:17px;
  height:17px;
  margin-right:1px;
}

:is(.contact-modal,#contact) .tv-select__chevron:before,
:is(.contact-modal,#contact) .tv-select__chevron:after{
  content:"";
  position:absolute;
  top:7px;
  width:9px;
  height:1.8px;
  border-radius:999px;
  background:#e9edf5;
  transition:
    transform .26s var(--tv-ease),
    background .22s ease,
    box-shadow .22s ease;
}

:is(.contact-modal,#contact) .tv-select__chevron:before{
  left:0;
  transform:rotate(42deg);
  transform-origin:right center;
}

:is(.contact-modal,#contact) .tv-select__chevron:after{
  right:0;
  transform:rotate(-42deg);
  transform-origin:left center;
}

:is(.contact-modal,#contact) .tv-select.is-open .tv-select__chevron:before{
  transform:rotate(-42deg);
  background:#bca9ff;
  box-shadow:0 0 10px rgba(139,89,251,.38);
}

:is(.contact-modal,#contact) .tv-select.is-open .tv-select__chevron:after{
  transform:rotate(42deg);
  background:#72dcff;
  box-shadow:0 0 10px rgba(82,214,255,.32);
}

:is(.contact-modal,#contact) .tv-select__menu{
  position:absolute;
  z-index:30;
  left:0;
  right:0;
  top:calc(100% + 9px);
  padding:8px;
  border:1px solid rgba(139,89,251,.20);
  border-radius:15px;
  background:
    radial-gradient(circle at 82% 8%,rgba(82,214,255,.09),transparent 34%),
    radial-gradient(circle at 12% 92%,rgba(139,89,251,.12),transparent 38%),
    rgba(10,14,23,.97);
  -webkit-backdrop-filter:blur(22px) saturate(135%);
  backdrop-filter:blur(22px) saturate(135%);
  box-shadow:
    0 24px 70px rgba(0,0,0,.44),
    0 0 0 1px rgba(255,255,255,.025) inset,
    0 0 36px rgba(139,89,251,.06);
  opacity:0;
  visibility:hidden;
  transform:translateY(-7px) scale(.985);
  transform-origin:top center;
  pointer-events:none;
  transition:
    opacity .18s ease,
    visibility .18s ease,
    transform .24s var(--tv-ease);
}

:is(.contact-modal,#contact) .tv-select.is-open .tv-select__menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

:is(.contact-modal,#contact) .tv-select__menu:before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--brand-violet) 36%,var(--neon-2) 70%,transparent);
  opacity:.75;
}

:is(.contact-modal,#contact) .tv-select__option{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 14px;
  align-items:center;
  gap:16px;
  width:100%;
  min-height:44px;
  padding:11px 13px 11px 18px;
  border:0;
  border-radius:10px;
  outline:none;
  background:transparent;
  color:#b8c1cf;
  font:inherit;
  font-size:14px;
  font-weight:560;
  text-align:left;
  cursor:pointer;
  transition:
    color .18s ease,
    padding-left .22s var(--tv-ease),
    background .18s ease;
}

:is(.contact-modal,#contact) .tv-select__option:before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  bottom:6px;
  width:3px;
  border-radius:999px;
  background:
    linear-gradient(
      180deg,
      rgba(139,89,251,0) 0%,
      rgba(139,89,251,.96) 24%,
      rgba(139,89,251,1) 48%,
      rgba(82,214,255,.96) 76%,
      rgba(82,214,255,0) 100%
    );
  opacity:0;
  transform:scaleY(.64);
  box-shadow:
    0 0 12px rgba(139,89,251,.34),
    0 0 20px rgba(82,214,255,.16);
  transition:
    opacity .18s ease,
    transform .22s var(--tv-ease),
    box-shadow .22s ease;
}

:is(.contact-modal,#contact) .tv-select__option:hover,
:is(.contact-modal,#contact) .tv-select__option:focus-visible{
  color:#fff;
  padding-left:22px;
  background:linear-gradient(90deg,rgba(139,89,251,.035),transparent 44%);
}

:is(.contact-modal,#contact) .tv-select__option:hover:before,
:is(.contact-modal,#contact) .tv-select__option:focus-visible:before{
  opacity:1;
  transform:scaleY(1);
  box-shadow:
    0 0 14px rgba(139,89,251,.42),
    0 0 24px rgba(82,214,255,.20);
}

:is(.contact-modal,#contact) .tv-select__option i{
  width:7px;
  height:7px;
  justify-self:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.20);
  background:rgba(255,255,255,.04);
  transition:
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

:is(.contact-modal,#contact) .tv-select__option.is-selected{
  color:#fff;
  background:linear-gradient(90deg,rgba(139,89,251,.025),transparent 46%);
}

:is(.contact-modal,#contact) .tv-select__option.is-selected:before{
  opacity:.72;
  transform:scaleY(.82);
}

:is(.contact-modal,#contact) .tv-select__option.is-selected i{
  border-color:rgba(139,89,251,.72);
  background:linear-gradient(135deg,var(--brand-violet),var(--neon-2));
  box-shadow:
    0 0 9px rgba(139,89,251,.42),
    0 0 15px rgba(82,214,255,.20);
  transform:scale(1.08);
}

/* The custom component fully replaces the modal native select. */
.contact-modal .contact-modal__form select{
  display:none!important;
}

@media(max-width:620px){
  :is(.contact-modal,#contact) .tv-select__menu{
    top:calc(100% + 7px);
    padding:7px;
    border-radius:13px;
  }
  :is(.contact-modal,#contact) .tv-select__option{
    min-height:42px;
    font-size:13.5px;
  }
}


/* TRUE VISUAL v7.13.19 - success modal + branded validation feedback */
.contact-modal .contact-modal__form input.is-invalid,
.contact-modal .contact-modal__form textarea.is-invalid,
.contact-modal .form-consent.is-invalid{
  border-color:rgba(255,122,122,.52)!important;
  box-shadow:0 0 0 4px rgba(255,88,88,.08), 0 0 24px rgba(255,94,94,.09)!important;
}
.contact-modal .form-consent.is-invalid{
  padding:4px 0;
  border-radius:10px;
}
.contact-modal .form-consent.is-invalid span{color:#ffd2d2}

.contact-modal-toast{
  position:fixed;
  right:28px;
  bottom:26px;
  z-index:1300;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:13px;
  width:min(420px,calc(100vw - 32px));
  padding:14px 16px 14px 14px;
  border:1px solid rgba(255,124,124,.24);
  border-radius:18px;
  background:
    radial-gradient(circle at 0% 100%,rgba(255,96,96,.14),transparent 38%),
    radial-gradient(circle at 100% 0%,rgba(139,89,251,.12),transparent 34%),
    rgba(12,16,25,.94);
  box-shadow:
    0 26px 60px rgba(0,0,0,.42),
    0 0 0 1px rgba(255,255,255,.03) inset;
  opacity:0;
  transform:translateY(12px) scale(.985);
  pointer-events:none;
  transition:opacity .22s ease, transform .28s var(--tv-ease);
}
.contact-modal-toast.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
.contact-modal-toast__icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:14px;
  background:linear-gradient(135deg,rgba(255,122,74,.92),rgba(255,91,91,.88));
  color:#fff;
  font-size:22px;
  font-weight:900;
  box-shadow:0 0 18px rgba(255,107,107,.28);
}
.contact-modal-toast__text{display:grid;gap:3px;align-content:center}
.contact-modal-toast__text strong{font-size:14px;line-height:1.3}
.contact-modal-toast__text span{color:#b7c0cf;font-size:13px;line-height:1.45}

.contact-success-modal{
  position:fixed;
  inset:0;
  z-index:5;
  display:grid;
  place-items:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease, visibility .28s ease;
}
.contact-success-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.contact-success-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,6,11,.62);
  -webkit-backdrop-filter:blur(12px) saturate(130%);
  backdrop-filter:blur(12px) saturate(130%);
}
.contact-success-modal__panel{
  position:relative;
  overflow:hidden;
  width:min(820px,calc(100% - 64px));
  min-height:min(560px,calc(100vh - 80px));
  padding:34px;
  border:1px solid rgba(98,255,196,.16);
  border-radius:28px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.01)),
    rgba(6,11,18,.86);
  box-shadow:
    0 40px 90px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,255,255,.03) inset,
    0 0 44px rgba(42,255,176,.09);
  transform:translateY(18px) scale(.985);
  transition:transform .34s cubic-bezier(.2,.72,.2,1);
}
.contact-success-modal.is-open .contact-success-modal__panel{transform:translateY(0) scale(1)}
.contact-success-modal__canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  opacity:.96;
}
.contact-success-modal__panel:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.08),transparent 22%,transparent 70%,rgba(86,255,187,.05));
  pointer-events:none;
}
.contact-success-modal__body{position:relative;z-index:1;display:grid;align-content:start;min-height:100%}
.contact-success-modal__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  color:#b8f8dd;
  font-size:11px;
  font-weight:760;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.contact-success-modal__eyebrow:before{
  content:"";
  width:34px;
  height:1px;
  background:linear-gradient(90deg,rgba(98,255,196,.3),rgba(134,255,235,1));
  box-shadow:0 0 18px rgba(98,255,196,.22);
}
.contact-success-modal h3{
  margin:0;
  font-size:clamp(40px,4.6vw,62px);
  line-height:.96;
  letter-spacing:-.055em;
}
.contact-success-modal h3 span{color:#69ffd1}
.contact-success-modal__lead{
  margin:18px 0 0;
  max-width:620px;
  color:#f4f6fb;
  font-size:16px;
  line-height:1.66;
}
.contact-success-modal__summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:28px;
}
.contact-success-modal__item{
  padding:18px 18px 16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(8,15,24,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.contact-success-modal__item small{
  display:block;
  margin-bottom:7px;
  color:#89a596;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-success-modal__item strong{display:block;font-size:18px;line-height:1.4}
.contact-success-modal__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:30px;
}
.contact-success-modal__actions .button{min-width:200px}
.contact-success-modal__hint{
  margin-top:auto;
  padding-top:24px;
  color:#8b9baa;
  font-size:12px;
  line-height:1.55;
}
.contact-success-modal__close{
  position:absolute;
  z-index:2;
  right:18px;
  top:18px;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  background:rgba(255,255,255,.03);
  color:#edf8f4;
  cursor:pointer;
  transition:transform .26s cubic-bezier(.2,.72,.2,1), border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.contact-success-modal__close:before,
.contact-success-modal__close:after{
  content:"";
  position:absolute;
  width:15px;
  height:1.5px;
  border-radius:999px;
  background:currentColor;
}
.contact-success-modal__close:before{transform:rotate(45deg)}
.contact-success-modal__close:after{transform:rotate(-45deg)}
.contact-success-modal__close:hover{
  transform:rotate(90deg);
  border-color:rgba(98,255,196,.4);
  background:rgba(98,255,196,.08);
  box-shadow:0 0 22px rgba(98,255,196,.12);
}
.contact-modal.is-success-open .contact-modal__panel{
  filter:blur(2px) brightness(.86);
  pointer-events:none;
  user-select:none;
}

@media(max-width:900px){
  .contact-success-modal__panel{width:min(680px,calc(100% - 40px));min-height:auto;padding:28px 24px 24px}
  .contact-success-modal__summary{grid-template-columns:1fr}
}
@media(max-width:620px){
  .contact-modal-toast{right:16px;bottom:16px;width:calc(100vw - 32px)}
  .contact-success-modal__panel{width:calc(100% - 20px);padding:24px 18px 18px;border-radius:22px}
  .contact-success-modal h3{font-size:36px}
  .contact-success-modal__lead{font-size:14px}
  .contact-success-modal__actions{flex-direction:column}
  .contact-success-modal__actions .button{width:100%;min-width:0}
}


/* TRUE VISUAL v7.13.20 - unified forms + premium modal motion */
#contact .contact-form .tv-select{
  margin-top:10px;
}
#contact .contact-form .tv-select__trigger{
  min-height:58px;
  padding:15px 18px;
  font-size:15px;
  border-radius:12px;
}
#contact .contact-form .tv-select__menu{
  z-index:60;
}
#contact .contact-form .tv-select__option{
  font-size:14px;
}
#contact .contact-form input.is-invalid,
#contact .contact-form textarea.is-invalid,
#contact .contact-form .form-consent.is-invalid{
  border-color:rgba(255,122,122,.52)!important;
  box-shadow:0 0 0 4px rgba(255,88,88,.07),0 0 24px rgba(255,94,94,.08)!important;
}
#contact .contact-form .form-consent.is-invalid{
  padding:4px 0;
  border-radius:10px;
}
#contact .contact-form .form-consent.is-invalid span{color:#ffd2d2}

/* Opening motion: a controlled reveal instead of a simple scale/fade. */
.contact-modal{
  transition:opacity .36s cubic-bezier(.22,.7,.2,1),visibility 0s linear .36s;
}
.contact-modal.is-open{transition-delay:0s}
.contact-modal__backdrop{
  opacity:0;
  -webkit-backdrop-filter:blur(0) saturate(100%);
  backdrop-filter:blur(0) saturate(100%);
  transition:opacity .38s ease,-webkit-backdrop-filter .55s ease,backdrop-filter .55s ease;
}
.contact-modal.is-open .contact-modal__backdrop{
  opacity:1;
  -webkit-backdrop-filter:blur(14px) saturate(118%);
  backdrop-filter:blur(14px) saturate(118%);
}
.contact-modal__panel{
  opacity:0;
  transform:perspective(1300px) translateY(34px) scale(.966) rotateX(2.2deg);
  transform-origin:50% 18%;
  filter:blur(7px) saturate(.82);
  transition:
    opacity .32s ease,
    transform .64s cubic-bezier(.16,.84,.2,1),
    filter .54s ease;
}
.contact-modal.is-open .contact-modal__panel{
  opacity:1;
  transform:perspective(1300px) translateY(0) scale(1) rotateX(0);
  filter:blur(0) saturate(1);
}
.contact-modal__panel:before{
  transform:scaleX(0);
  transform-origin:center;
  opacity:0;
  transition:transform .7s cubic-bezier(.16,.84,.2,1) .18s,opacity .32s ease .18s;
}
.contact-modal.is-open .contact-modal__panel:before{transform:scaleX(1);opacity:1}
.contact-modal__brand,
.contact-modal__eyebrow,
.contact-modal__intro h2,
.contact-modal__intro > p,
.contact-modal__facts,
.contact-modal__form-title,
.contact-modal__form{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .44s ease,transform .58s cubic-bezier(.16,.84,.2,1);
}
.contact-modal.is-open .contact-modal__brand{opacity:1;transform:none;transition-delay:.13s}
.contact-modal.is-open .contact-modal__eyebrow{opacity:1;transform:none;transition-delay:.18s}
.contact-modal.is-open .contact-modal__intro h2{opacity:1;transform:none;transition-delay:.22s}
.contact-modal.is-open .contact-modal__intro > p{opacity:1;transform:none;transition-delay:.27s}
.contact-modal.is-open .contact-modal__facts{opacity:1;transform:none;transition-delay:.32s}
.contact-modal.is-open .contact-modal__form-title{opacity:1;transform:none;transition-delay:.22s}
.contact-modal.is-open .contact-modal__form{opacity:1;transform:none;transition-delay:.28s}

/* Success reveal gets a soft light bloom and staggered content. */
.contact-success-modal{
  z-index:21000;
  transition:opacity .34s ease,visibility .34s ease;
}
.contact-success-modal__backdrop{
  opacity:0;
  transition:opacity .38s ease;
}
.contact-success-modal.is-open .contact-success-modal__backdrop{opacity:1}
.contact-success-modal__panel{
  opacity:0;
  transform:perspective(1200px) translateY(26px) scale(.955) rotateX(2deg);
  filter:blur(8px) saturate(.78);
  transition:opacity .32s ease,transform .68s cubic-bezier(.16,.84,.2,1),filter .58s ease;
}
.contact-success-modal.is-open .contact-success-modal__panel{
  opacity:1;
  transform:perspective(1200px) translateY(0) scale(1) rotateX(0);
  filter:blur(0) saturate(1);
}
.contact-success-modal__canvas{
  opacity:0;
  transform:scale(1.05);
  transition:opacity .7s ease .08s,transform 1.1s cubic-bezier(.16,.84,.2,1) .08s;
}
.contact-success-modal.is-open .contact-success-modal__canvas{opacity:.96;transform:scale(1)}
.contact-success-modal__eyebrow,
.contact-success-modal h3,
.contact-success-modal__lead,
.contact-success-modal__summary,
.contact-success-modal__actions,
.contact-success-modal__hint{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .42s ease,transform .6s cubic-bezier(.16,.84,.2,1);
}
.contact-success-modal.is-open .contact-success-modal__eyebrow{opacity:1;transform:none;transition-delay:.16s}
.contact-success-modal.is-open h3{opacity:1;transform:none;transition-delay:.21s}
.contact-success-modal.is-open .contact-success-modal__lead{opacity:1;transform:none;transition-delay:.27s}
.contact-success-modal.is-open .contact-success-modal__summary{opacity:1;transform:none;transition-delay:.33s}
.contact-success-modal.is-open .contact-success-modal__actions{opacity:1;transform:none;transition-delay:.39s}
.contact-success-modal.is-open .contact-success-modal__hint{opacity:1;transform:none;transition-delay:.44s}
.contact-success-modal.is-open:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(91,255,190,.10),transparent 46%);
  animation:tvSuccessBloom 1.05s cubic-bezier(.16,.84,.2,1) both;
}
@keyframes tvSuccessBloom{
  0%{opacity:0;transform:scale(.72)}
  44%{opacity:1}
  100%{opacity:.35;transform:scale(1.06)}
}

@media(prefers-reduced-motion:reduce){
  .contact-modal__backdrop,
  .contact-modal__panel,
  .contact-modal__panel:before,
  .contact-modal__brand,
  .contact-modal__eyebrow,
  .contact-modal__intro h2,
  .contact-modal__intro > p,
  .contact-modal__facts,
  .contact-modal__form-title,
  .contact-modal__form,
  .contact-success-modal__panel,
  .contact-success-modal__canvas,
  .contact-success-modal__eyebrow,
  .contact-success-modal h3,
  .contact-success-modal__lead,
  .contact-success-modal__summary,
  .contact-success-modal__actions,
  .contact-success-modal__hint{
    transition-duration:.01ms!important;
    transition-delay:0ms!important;
  }
  .contact-success-modal.is-open:before{animation:none}
}


/* TRUE VISUAL v7.13.22 - validation layer + unified field typography */

/* Validation feedback must always sit above the form, modal panel, backdrop,
   and success layer. Keep it in the root viewport stacking context. */
.contact-modal{
  isolation:isolate;
}
.contact-modal-toast{
  z-index:50000!important;
  right:clamp(16px,2vw,32px);
  bottom:clamp(16px,2vw,30px);
  filter:none!important;
  visibility:visible;
}
.contact-modal-toast.is-visible{
  opacity:1;
  visibility:visible;
}

/* Field values must use the same typography in the permanent contact form
   and the global modal form. Labels retain their own stronger hierarchy. */
#contact .contact-form input,
#contact .contact-form textarea,
#contact .contact-form .tv-select__trigger,
#contact .contact-form .tv-select__option,
.contact-modal .contact-modal__form input,
.contact-modal .contact-modal__form textarea,
.contact-modal .tv-select__trigger,
.contact-modal .tv-select__option{
  font-family:inherit;
  font-weight:400!important;
  font-style:normal;
}

#contact .contact-form input::placeholder,
#contact .contact-form textarea::placeholder,
.contact-modal .contact-modal__form input::placeholder,
.contact-modal .contact-modal__form textarea::placeholder{
  font-weight:400!important;
}

/* Old hint was removed from markup; keep no reserved visual rhythm for it. */
.contact-success-modal__hint{
  display:none!important;
}


/* TRUE VISUAL v7.13.23 - compact success geometry + inertial parallax tilt */
.contact-success-modal__panel{
  /* The removed technical hint must not leave an artificial empty floor. */
  min-height:0!important;
  height:auto;
  padding-bottom:30px;
  transform-style:preserve-3d;
  will-change:transform;
}
.contact-success-modal__body{
  min-height:0!important;
}
.contact-success-modal__actions{
  margin-top:26px;
}

/* Preserve the expensive reveal animation, then let pointer movement add only
   a few degrees of angle so the panel feels physical rather than gimmicky. */
.contact-success-modal.is-open .contact-success-modal__panel{
  transform:
    perspective(1350px)
    translateY(0)
    scale(1)
    rotateX(var(--success-tilt-x,0deg))
    rotateY(var(--success-tilt-y,0deg));
  transition:
    opacity .32s ease,
    transform .16s linear,
    filter .58s ease,
    box-shadow .28s ease;
}
.contact-success-modal.is-open .contact-success-modal__panel:hover{
  box-shadow:
    0 44px 100px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 52px rgba(42,255,176,.105);
}

@media(max-width:900px){
  .contact-success-modal__panel{padding-bottom:24px}
}
@media(max-width:620px){
  .contact-success-modal__panel{padding-bottom:18px}
}
@media(prefers-reduced-motion:reduce){
  .contact-success-modal.is-open .contact-success-modal__panel{
    transform:perspective(1350px) translateY(0) scale(1)!important;
  }
}


/* TRUE VISUAL v7.13.24 - optical centering for custom select */
:is(.contact-modal,#contact) .tv-select__trigger{
  min-height:58px;
  padding:0 20px;
  align-items:center;
}

:is(.contact-modal,#contact) .tv-select__value{
  display:flex;
  align-items:center;
  min-height:58px;
  line-height:1.2;
  transform:translateY(.5px);
}

:is(.contact-modal,#contact) .tv-select__chevron{
  align-self:center;
  margin-right:0;
  transform:translateY(1px);
}

/* Remove the contact-page-only geometry override so both forms use
   exactly the same select alignment. */
#contact .contact-form .tv-select__trigger{
  min-height:58px;
  padding:0 20px;
}


/* TRUE VISUAL v7.14.1 - readability pass for real interface typography.
   Tiny text inside visual mockups and the deliberately compact homepage rail
   remains untouched; this pass targets actual navigation, metadata and labels. */

/* Shared section markers */
.section-index{
  font-size:13px;
  line-height:1.3;
  font-weight:760;
}
.optical-section-head .optical-label{
  font-size:13px;
  line-height:1.3;
}
body.interior .section-label{
  font-size:13px;
  line-height:1.3;
}
body.interior .breadcrumbs{
  font-size:12px;
  line-height:1.45;
}

/* Portfolio metadata stays compact, but no longer microscopic. */
.project-meta small{
  font-size:12.5px;
  line-height:1.25;
}
.portfolio-index-num{
  font-size:12px;
}
.portfolio-index-copy small{
  font-size:11px;
  line-height:1.25;
}

/* Services: numbered navigation and scope indices are meaningful UI, not microcopy. */
.section-jump a{
  gap:14px;
}
.section-jump a span{
  min-width:24px;
  font-size:13px;
  line-height:1;
  letter-spacing:.08em;
}
.service-direction .scope-board-head span,
.service-direction .scope-board-head small{
  font-size:13px;
  line-height:1.35;
}
.service-direction .scope-index{
  margin-bottom:16px;
  font-size:15px;
  line-height:1;
  letter-spacing:.08em;
}
.service-steps .step small{
  display:block;
  font-size:15px;
  line-height:1;
  letter-spacing:.06em;
}

/* Small editorial / informational labels on real cards. */
.fact-card small,
.info-card small,
.related-card small,
.service-card-page small{
  font-size:12.5px;
  line-height:1.3;
}
.site-menu-label{
  font-size:12px;
  line-height:1.3;
}

/* Legal navigation is persistent reading UI and must be comfortably legible. */
.legal-toc-stick > span{
  font-size:12px;
}
.legal-toc a{
  font-size:13px;
  line-height:1.4;
}

/* Form/supporting labels remain subordinate but readable. */
.contact-modal__fact small,
.contact-success-modal__item small{
  font-size:11.5px;
}

/* The longer ecosystem attribution needs a little more room without changing footer rhythm. */
.footer-ecosystem span{
  max-width:330px;
}

@media(max-width:700px){
  .section-index,
  .optical-section-head .optical-label,
  body.interior .section-label{font-size:12px}
  body.interior .breadcrumbs{font-size:11px}
  .section-jump a span{font-size:12.5px}
  .service-direction .scope-index,
  .service-steps .step small{font-size:14px}
  .service-direction .scope-board-head span,
  .service-direction .scope-board-head small{font-size:12px}
}


/* TRUE VISUAL v7.14.2 - balanced two-line ecosystem attribution */
.footer-ecosystem > .footer-ecosystem-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
  max-width:none;
  line-height:1.28;
  white-space:nowrap;
}
.footer-ecosystem > .footer-ecosystem-copy > span{
  display:block;
  max-width:none;
  white-space:nowrap;
}
@media(max-width:700px){
  .footer-ecosystem > .footer-ecosystem-copy,
  .footer-ecosystem > .footer-ecosystem-copy > span{
    white-space:normal;
  }
}