:root{
  --ink:#160a2d;--muted:#716a7f;--purple:#7b28d9;--purple2:#9d45f2;--pink:#e65dc7;
  --lav:#f4effa;--lav2:#ece2f8;--line:#e7e1ee;--paper:#fff;--soft:#faf9fc;--dark:#160824;
  --shadow:0 28px 70px rgba(49,20,79,.14);--radius:28px;--radius-sm:18px;--max:1180px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.container{width:min(var(--max),calc(100% - 44px));margin:auto}
.announcement{background:#1b092d;color:#eee6f8;text-align:center;font-size:12px;letter-spacing:.04em;padding:8px 20px}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(225,218,234,.8)}
.nav-wrap{height:78px;display:flex;align-items:center;gap:30px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:10px;line-height:1.05;letter-spacing:.15em;white-space:nowrap}.brand b{font-size:12px}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#a746ef,#6820c4);color:#fff;display:grid;place-items:center;font-weight:800;font-size:22px;box-shadow:0 8px 22px rgba(123,40,217,.25)}
.desktop-nav{display:flex;align-items:center;gap:4px;margin-left:auto}.nav-link{border:0;background:none;color:#312442;padding:10px 12px;border-radius:999px;font-size:14px}.nav-link:hover{background:#f6f2fa}.desktop-cta{margin-left:6px}
.btn{border:0;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;background:linear-gradient(135deg,#7023c8,#9e45ee);color:#fff;font-weight:700;padding:14px 22px;box-shadow:0 12px 32px rgba(112,35,200,.22);transition:.25s transform,.25s box-shadow}.btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(112,35,200,.28)}.btn-sm{padding:11px 18px;font-size:13px}.btn-outline{background:#fff;color:var(--ink);box-shadow:none;border:1px solid var(--line)}.btn-light{background:#fff;color:#4d176f;box-shadow:none}
.menu-btn{display:none;margin-left:auto;border:0;background:none;width:42px;height:42px}.menu-btn span{display:block;width:24px;height:2px;background:#261534;margin:6px auto;transition:.25s}
.mega-menu{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 24px 50px rgba(26,13,40,.08);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.25s}.site-header.mega-open .mega-menu{opacity:1;visibility:visible;transform:none}
.mega-grid{display:grid;grid-template-columns:.8fr 1.5fr .8fr;gap:36px;padding:34px 0 38px}.mega-intro h3{font-size:26px;line-height:1.05;margin:8px 0 12px}.mega-intro p{font-size:13px;color:var(--muted)}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#7627cb;margin:0 0 10px}.text-link{font-weight:700;color:#6b20bd;font-size:13px}
.mega-links{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mega-links a{display:flex;gap:12px;padding:10px;border-radius:14px}.mega-links a:hover{background:#f8f5fb}.mega-links a>span{width:34px;height:34px;border-radius:10px;background:#f0e5fb;color:#7423cb;display:grid;place-items:center;font-size:11px;font-weight:800}.mega-links b{display:block;font-size:13px}.mega-links small{display:block;font-size:10px;color:#847b8e;line-height:1.3;margin-top:2px}.mega-side{border-left:1px solid var(--line);padding-left:30px}.mini-label{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#867b91}.mini-chart{background:linear-gradient(150deg,#fcfaff,#f1e9fb);border:1px solid #eadff4;border-radius:18px;padding:16px;margin:8px 0 12px}.chart-head{display:flex;justify-content:space-between;font-size:12px;color:black;}.chart-head span{color:#7c29da;font-weight:800}.mini-chart svg{width:100%;height:105px}.mega-side>a{font-size:12px;font-weight:700;color:#6d20bd}
.mobile-panel{display:none}

.hero{position:relative;padding:92px 0 70px;background:radial-gradient(circle at 78% 15%,rgba(187,116,241,.24),transparent 26%),radial-gradient(circle at 18% 60%,rgba(234,120,209,.14),transparent 30%),linear-gradient(#fff,#fbf9fd);overflow:hidden}.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:60px}.hero-copy{position:relative;z-index:2}.hero-copy h1,.page-hero h1{font-size:clamp(50px,6vw,78px);line-height:.96;letter-spacing:-.052em;margin:12px 0 22px;max-width:760px}.gradient-text{background:linear-gradient(90deg,#43107b,#8c2fe1,#da57c2);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy>p{font-size:18px;color:#625a6c;max-width:610px}.hero-actions{display:flex;gap:12px;margin:30px 0 24px;flex-wrap:wrap}.trust-line{display:flex;align-items:center;gap:12px;color:#6e6678;font-size:12px}.avatar-stack{display:flex}.avatar-stack i{width:26px;height:26px;border:2px solid white;border-radius:50%;margin-left:-7px;background:linear-gradient(145deg,#e6dbef,#b992dc)}.avatar-stack i:first-child{margin:0}
.hero-visual{position:relative;min-height:560px}.glow{position:absolute;border-radius:50%;filter:blur(4px);opacity:.7}.glow-a{width:430px;height:430px;background:radial-gradient(circle,#d6b2f3 0,#e8d6f8 45%,transparent 70%);right:-20px;top:50px}.glow-b{width:250px;height:250px;background:radial-gradient(circle,#f3c8e9 0,#f9e9f5 45%,transparent 70%);left:20px;bottom:20px}
.dashboard-card{background:rgba(255,255,255,.96);border:1px solid rgba(220,210,231,.9);box-shadow:var(--shadow);border-radius:28px}.main-dashboard{position:absolute;width:92%;right:0;top:56px;padding:28px 28px 20px;transform:rotate(-1.4deg);z-index:2}.dash-top{display:flex;align-items:start;justify-content:space-between}.dash-top span{font-size:13px;color:#766d80}.dash-top strong{display:block;font-size:30px}.status-pill{background:#efe4fa;color:#7626ce!important;border-radius:999px;padding:7px 10px;font-weight:800}.line-chart{width:100%;margin-top:10px}.chart-line{stroke:#812bdc;stroke-width:5;stroke-linecap:round;filter:drop-shadow(0 5px 6px rgba(125,41,218,.15))}.dash-axis{display:flex;justify-content:space-between;color:#9b94a3;font-size:10px}
.floating-card{position:absolute;background:white;border:1px solid #e8e0ef;box-shadow:0 20px 50px rgba(41,18,63,.15);border-radius:20px;z-index:4}.ad-card{left:-14px;bottom:45px;width:190px;padding:18px}.ad-card strong{display:block;font-size:31px}.ad-card small{color:#8a8291}.bars{height:48px;display:flex;gap:5px;align-items:end;margin-top:12px}.bars i{width:20%;border-radius:6px 6px 2px 2px;background:linear-gradient(#b65af1,#7126c7)}.rank-card{right:-15px;bottom:4px;width:170px;padding:16px;text-align:center}.search-dot{width:35px;height:35px;border-radius:12px;background:#8a32e2;color:#fff;display:grid;place-items:center;margin:-34px auto 9px;font-size:22px}.rank-card strong{display:block;font-size:36px}.rank-card small,.rank-card span{font-size:11px;color:#817789}.floating-badge{position:absolute;right:18px;top:16px;z-index:5;background:#1a0b2a;color:#fff;border-radius:18px;padding:12px 16px;box-shadow:0 12px 30px rgba(21,7,35,.2);display:grid;grid-template-columns:auto auto;column-gap:7px;align-items:center}.floating-badge span{color:#ffc54f}.floating-badge small{grid-column:1/3;color:#cfc4d7;font-size:9px}

.logo-strip{border-top:1px solid #f0ebf4;border-bottom:1px solid #f0ebf4;background:#fff}.logo-strip-inner{min-height:110px;display:flex;align-items:center;gap:38px;overflow:hidden}.logo-strip p{font-size:12px;max-width:150px;color:#6f6678}.brand-chips{display:flex;align-items:center;gap:12px;flex:1;justify-content:space-between}.brand-chips span{padding:12px 17px;border:1px solid #eee8f2;border-radius:999px;color:#5f5766;font-weight:800;font-size:12px;background:#fcfbfd}
.section{padding:105px 0}.section-soft{background:#faf8fc}.section-dark{background:#160824;color:white}.section-head{text-align:center;max-width:760px;margin:0 auto 50px}.section-head.align-left{text-align:left;margin-left:0}.section-head h2,.split-copy h2,.cta-shell h2{font-size:clamp(38px,4.5vw,58px);line-height:1.02;letter-spacing:-.045em;margin:10px 0 16px}.section-head p,.split-copy p{color:#746b7c}.section-dark .section-head p,.section-dark .split-copy p{color:#c9bfce}.eyebrow.light{color:#d7b4f4}
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.mock-search{position:relative;min-height:500px}.orb{position:absolute;width:420px;height:420px;border-radius:50%;left:40px;top:28px;background:radial-gradient(circle at 35% 35%,#f6d8f3 0,#d8b9f3 28%,#9c47e7 56%,rgba(126,34,203,.1) 76%,transparent 78%);filter:saturate(.95)}.search-window{position:absolute;left:90px;top:85px;width:72%;background:white;border-radius:24px;border:1px solid #e8e0ee;box-shadow:var(--shadow);padding:20px}.searchbar{height:34px;border-radius:999px;background:#eeeaf0;margin-bottom:20px;position:relative}.searchbar:before{content:"⌕";position:absolute;left:-42px;top:-9px;width:50px;height:50px;border-radius:16px;background:#8530df;color:white;display:grid;place-items:center;font-size:26px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.product-tile{height:115px;border-radius:14px;background:linear-gradient(#f4f1f5 55%,#fff 55%);border:1px solid #efeaf1;position:relative}.product-tile:before{content:"";position:absolute;width:45%;height:34%;background:#d7c1ea;border-radius:10px;top:14px;left:27%}.product-tile:after{content:"★★★★★";position:absolute;color:#e6ae32;font-size:8px;bottom:18px;left:13px;letter-spacing:1px}.review-card{position:absolute;left:30px;bottom:25px;width:220px;background:white;border-radius:20px;padding:18px;box-shadow:var(--shadow);z-index:3}.review-card b{display:block;font-size:15px}.review-card .stars{color:#e9af2e}.review-card small{color:#7a7282}
.check-list{display:grid;gap:14px;margin:28px 0}.check-item{display:flex;gap:13px;align-items:flex-start}.check-item i{font-style:normal;width:28px;height:28px;border-radius:9px;background:#eee2fa;color:#7826d1;display:grid;place-items:center;font-weight:900;flex:0 0 auto}.check-item b{display:block;font-size:14px}.check-item span{color:#81798a;font-size:13px}
.results-shell{display:grid;grid-template-columns:1.15fr .85fr;gap:28px}.result-visual{background:linear-gradient(145deg,#f7f2fb,#efe2fa);border-radius:32px;padding:30px;min-height:470px;position:relative;overflow:hidden;border:1px solid #eadff2}.result-visual .dashboard-card{padding:24px;position:absolute;left:34px;right:70px;top:55px}.result-score{position:absolute;bottom:34px;right:34px;background:#1b0a2d;color:#fff;border-radius:22px;padding:18px 22px;box-shadow:0 20px 40px rgba(36,11,58,.25)}.result-score strong{font-size:34px;display:block}.result-score span{font-size:11px;color:#d6c9df}.result-copy{display:flex;flex-direction:column;gap:18px}.metric-card,.case-card,.service-card,.review-quote,.feature-card,.article-card{background:#fff;border:1px solid #e9e3ee;border-radius:24px;padding:26px}.metric-card strong{font-size:40px;display:block;letter-spacing:-.04em}.metric-card span{color:#7b7285;font-size:13px}
.cases-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.case-card{position:relative;overflow:hidden}.case-card:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,#d5aff2,transparent 68%);right:-55px;top:-60px}.case-card .case-brand{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#7928d2;font-weight:800}.case-card h3{font-size:22px;line-height:1.08;margin:10px 0}.case-card p{font-size:13px;color:#776e80}.case-card a{font-size:12px;font-weight:800;color:#7624cc}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service-card{min-height:245px;transition:.25s;position:relative;overflow:hidden}.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(39,15,62,.09)}.service-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#f0e3fb,#e5d2f8);color:#7023c8;font-weight:900;font-size:12px;margin-bottom:36px}.service-card h3{font-size:20px;line-height:1.08;margin:0 0 10px}.service-card p{font-size:13px;color:#786f81}.service-card .go{position:absolute;right:20px;top:20px;border:1px solid #e7deee;border-radius:50%;width:36px;height:36px;display:grid;place-items:center}
.problem-solution{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}.ps-card{border-radius:28px;padding:34px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055)}.ps-card b{color:#c693f0;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.ps-card h3{font-size:26px;margin:10px 0}.ps-card p{color:#c8bdcf}
.testimonial-wrap{overflow:hidden}.testimonial-track{display:flex;gap:18px;transition:transform .5s ease}.review-quote{min-width:calc(33.333% - 12px)}.review-quote .stars{color:#e0a52b;letter-spacing:2px}.review-quote p{font-size:14px;color:#5f5768;min-height:130px}.review-quote strong{display:block;font-size:13px}.review-quote small{color:#8b8392}.slider-controls{display:flex;gap:8px;justify-content:center;margin-top:25px}.slider-controls button{width:42px;height:42px;border-radius:50%;border:1px solid #e7e0eb;background:white}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.stat{border-radius:22px;padding:28px;background:linear-gradient(145deg,#f3e7fb,#fff);border:1px solid #eadff2}.stat strong{font-size:42px;letter-spacing:-.05em;display:block}.stat span{font-size:12px;color:#786f81}
.review-platforms{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:25px}.platform{border:1px solid #e8e1ed;border-radius:20px;padding:22px;text-align:center}.platform strong{display:block;font-size:23px}.platform span{font-size:11px;color:#857d8d}
.cta-section{padding-top:40px}.cta-shell{background:radial-gradient(circle at 80% 10%,rgba(225,117,214,.28),transparent 28%),linear-gradient(135deg,#28103f,#5d1787 58%,#832dcc);color:#fff;border-radius:36px;padding:58px;display:grid;grid-template-columns:1.05fr .95fr;gap:55px;box-shadow:0 30px 80px rgba(70,22,103,.26)}.cta-shell>div>p{color:#d8cce0}.cta-points{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}.cta-points span{font-size:11px;background:rgba(255,255,255,.1);padding:8px 10px;border-radius:999px}.lead-form{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:25px;padding:22px;display:flex;flex-direction:column;gap:11px}.lead-form input,.lead-form textarea,.lead-form select{width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:white;border-radius:12px;padding:13px 14px;outline:none}.lead-form input::placeholder,.lead-form textarea::placeholder{color:#d8cbe0}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.lead-form small{color:#cdbfd6;text-align:center;font-size:9px}

.footer{margin-top:90px;background:#140721;color:#fff;padding:68px 0 20px}.footer-grid{display:grid;grid-template-columns:1.2fr .7fr .7fr 1fr;gap:50px}.brand-light{color:#fff}.footer-brand p{max-width:320px;color:#afa4b6;font-size:12px;margin:22px 0}.socials{display:flex;gap:15px}.footer h4{font-size:12px;margin:0 0 18px}.footer>div a:not(.brand){display:block;color:#b9afc0;font-size:12px;margin:9px 0}.newsletter p{font-size:11px;color:#aaa0b2}.newsletter form{display:flex;background:#22122f;border-radius:999px;border:1px solid #382843;overflow:hidden}.newsletter input{min-width:0;flex:1;border:0;background:transparent;color:#fff;padding:12px 14px;outline:none}.newsletter button{width:42px;border:0;background:#7a29d2;color:white}.footer-bottom{border-top:1px solid #2d1c39;margin-top:50px;padding-top:20px;display:flex;justify-content:space-between;color:#786d80;font-size:10px}
.toast{position:fixed;right:22px;bottom:22px;background:#170825;color:#fff;border-radius:14px;padding:13px 18px;box-shadow:0 16px 45px rgba(20,7,34,.25);font-size:12px;transform:translateY(20px);opacity:0;pointer-events:none;transition:.25s;z-index:200}.toast.show{opacity:1;transform:none}

.page-hero{padding:90px 0 76px;background:radial-gradient(circle at 75% 30%,rgba(196,126,240,.24),transparent 26%),linear-gradient(#fff,#faf7fc)}.page-hero-grid{display:grid;grid-template-columns:1fr .8fr;gap:60px;align-items:center}.page-hero h1{font-size:clamp(48px,6vw,74px)}.page-hero p{font-size:17px;color:#6d6475;max-width:650px}.page-orbit{height:410px;position:relative}.orbit-circle{position:absolute;width:320px;height:320px;border-radius:50%;right:10px;top:28px;background:radial-gradient(circle at 32% 28%,#f2d8ef,#ce9df0 38%,#7d2dd2 67%,#5a159e 100%);box-shadow:0 30px 60px rgba(104,31,167,.22)}.orbit-card{position:absolute;background:#fff;border:1px solid #e8dfef;border-radius:20px;padding:18px;box-shadow:0 20px 50px rgba(45,17,69,.16)}.orbit-card.one{left:10px;top:72px;width:225px}.orbit-card.two{right:0;bottom:25px;width:205px}.orbit-card.three{left:55px;bottom:20px;width:145px}.orbit-card strong{font-size:29px;display:block}.orbit-card span{font-size:10px;color:#817889}
.metric-strip{margin-top:-35px;position:relative;z-index:5}.metric-strip-grid{background:#fff;border:1px solid #e8e1ed;border-radius:24px;box-shadow:0 18px 50px rgba(40,16,60,.07);display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}.metric-strip-grid>div{padding:25px 28px}.metric-strip-grid>div+div{border-left:1px solid #ece6ef}.metric-strip-grid strong{display:block;font-size:30px}.metric-strip-grid span{font-size:11px;color:#7c7384}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature-card{min-height:215px}.feature-card .number{font-size:11px;color:#7929cf;font-weight:800}.feature-card h3{font-size:19px;margin:24px 0 10px}.feature-card p{font-size:13px;color:#756d7d}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:step}.process-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.11);border-radius:22px;padding:25px}.process-card:before{counter-increment:step;content:"0" counter(step);font-size:11px;color:#c48fee;font-weight:800}.process-card h3{font-size:18px}.process-card p{font-size:12px;color:#c7bdcc}
.faq{max-width:860px;margin:auto}.faq-item{border-bottom:1px solid #e7e0eb}.faq-q{width:100%;background:none;border:0;padding:22px 4px;display:flex;align-items:center;justify-content:space-between;text-align:left;font-weight:700}.faq-q span:last-child{font-size:22px;color:#7a29d2;transition:.25s}.faq-a{max-height:0;overflow:hidden;color:#756c7d;font-size:13px;transition:max-height .35s ease}.faq-a p{padding:0 40px 20px 4px;margin:0}.faq-item.open .faq-a{max-height:180px}.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.case-large{min-height:330px;display:flex;flex-direction:column;justify-content:flex-end;background:radial-gradient(circle at 80% 10%,rgba(176,90,235,.30),transparent 28%),linear-gradient(145deg,#fff,#f7f1fb)}.case-large .case-kpi{font-size:44px;letter-spacing:-.05em;color:#6f20c2;font-weight:900;margin-bottom:auto}.filter-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}.filter-chip{border:1px solid #e5deea;background:white;border-radius:999px;padding:9px 13px;font-size:11px}.filter-chip.active{background:#1a0a29;color:white}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px}.contact-card{border:1px solid #e8e0ed;border-radius:24px;padding:28px;background:#fff}.contact-card h3{margin-top:0}.contact-card p,.contact-card li{font-size:13px;color:#746b7c}.contact-form{background:#f7f2fb;color:var(--ink);border-color:#eadff1}.contact-form input,.contact-form textarea,.contact-form select{background:#fff;color:var(--ink);border-color:#e4dbe9}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#9a929f}.contact-form small{color:#847b8d}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.article-card{padding:0;overflow:hidden}.article-image{height:170px;background:radial-gradient(circle at 72% 35%,#dbb7f3,transparent 25%),linear-gradient(135deg,#f4e8fb,#e6d2f7);position:relative}.article-image:after{content:"↗";position:absolute;right:18px;top:18px;width:36px;height:36px;border-radius:50%;background:#fff;display:grid;place-items:center}.article-copy{padding:22px}.article-copy span{font-size:10px;text-transform:uppercase;color:#7c2ad1;font-weight:800;letter-spacing:.1em}.article-copy h3{font-size:19px;line-height:1.16}.article-copy p{font-size:12px;color:#756c7d}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}

@media(max-width:980px){
 .desktop-nav,.desktop-cta{display:none}.menu-btn{display:block}.site-header.menu-open .menu-btn span:first-child{transform:translateY(4px) rotate(45deg)}.site-header.menu-open .menu-btn span:last-child{transform:translateY(-4px) rotate(-45deg)}
 .mobile-panel{display:block;position:absolute;top:100%;left:0;right:0;background:white;border-top:1px solid var(--line);padding:16px 22px 24px;max-height:0;overflow:auto;opacity:0;visibility:hidden;transition:.3s}.site-header.menu-open .mobile-panel{max-height:78vh;opacity:1;visibility:visible}.mobile-panel a{display:block;padding:9px 4px;font-size:13px}.mobile-panel .btn{margin-top:10px;text-align:center}
 .hero-grid,.split,.results-shell,.cta-shell,.page-hero-grid,.contact-grid{grid-template-columns:1fr}.hero{padding-top:70px}.hero-copy{text-align:center}.hero-copy>p,.hero-copy h1{margin-left:auto;margin-right:auto}.hero-actions,.trust-line{justify-content:center}.hero-visual{min-height:520px;max-width:650px;width:100%;margin:auto}
 .services-grid,.feature-grid,.case-grid,.blog-grid{grid-template-columns:repeat(2,1fr)}.review-quote{min-width:calc(50% - 9px)}.stats-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.process{grid-template-columns:1fr 1fr}.page-orbit{max-width:580px;width:100%;margin:auto}.metric-strip{margin-top:0;padding-top:20px}
}
@media(max-width:640px){
 .container{width:min(100% - 28px,var(--max))}.announcement{font-size:9px}.nav-wrap{height:68px}.brand-mark{width:34px;height:34px}.hero{padding:55px 0 45px}.hero-copy h1,.page-hero h1{font-size:45px}.hero-copy>p,.page-hero p{font-size:15px}.hero-visual{min-height:430px}.main-dashboard{width:100%;top:48px;padding:18px}.dash-top strong{font-size:22px}.ad-card{left:-4px;bottom:20px;width:150px}.rank-card{right:-3px;width:140px}.floating-badge{right:4px;top:6px}.logo-strip-inner{display:block;padding:24px 0}.logo-strip p{max-width:none;text-align:center}.brand-chips{overflow:auto;justify-content:flex-start;padding-bottom:4px}
 .section{padding:72px 0}.section-head h2,.split-copy h2,.cta-shell h2{font-size:36px}.orb{width:330px;height:330px;left:50%;transform:translateX(-50%)}.mock-search{min-height:410px}.search-window{left:14%;width:80%;top:65px}.review-card{left:4%;width:190px;bottom:10px}.results-shell{gap:16px}.result-visual{min-height:390px}.result-visual .dashboard-card{left:18px;right:18px;top:38px}.services-grid,.feature-grid,.case-grid,.blog-grid,.cases-row,.problem-solution,.stats-grid,.review-platforms,.process{grid-template-columns:1fr}.service-card{min-height:215px}.review-quote{min-width:100%}.cta-shell{padding:32px 20px;border-radius:28px}.form-row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin:5px 0}
 .page-hero{padding:60px 0 42px}.page-orbit{height:330px}.orbit-circle{width:250px;height:250px;right:10px}.orbit-card.one{left:0;width:180px}.orbit-card.two{width:170px}.metric-strip-grid{grid-template-columns:1fr}.metric-strip-grid>div+div{border-left:0;border-top:1px solid #ece6ef}
}


/* =========================================================
   STRATALX Brand Refresh
   ========================================================= */
:root{
  --ink:#1c1c1c;
  --muted:#686868;
  --purple:#f140fe;
  --purple2:#f140fe;
  --pink:#f140fe;
  --lav:#fff3ff;
  --lav2:#ffe9ff;
  --line:#e8e8e8;
  --paper:#ffffff;
  --soft:#fafafa;
  --dark:#111111;
  --accent:#f140fe;
  --accent-dark:#da2ae7;
  --accent-soft:#fff0ff;
  --shadow:0 18px 50px rgba(20,20,20,.10);
  --radius:24px;
  --radius-sm:16px;
  --max:1180px;
}
html{font-size:16px}
body{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  line-height:1.62;
  letter-spacing:-.005em;
}
.announcement{
  background:#111;
  color:#f4f4f4;
  font-size:11px;
  letter-spacing:.035em;
  padding:7px 20px;
}
.site-header{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid #ececec;
  box-shadow:0 3px 18px rgba(0,0,0,.025);
}
.nav-wrap{height:74px;gap:24px}
.brand{display:inline-flex;align-items:center;flex:0 0 auto}
.brand-logo{display:block;width:170px;height:auto;max-height:38px;object-fit:contain}
.footer-logo{width:188px;max-height:44px}
.brand-mark{display:none}
.desktop-nav{gap:0}
.nav-link{
  color:#282828;
  padding:9px 12px;
  font-size:13px;
  font-weight:600;
  letter-spacing:-.01em;
}
.nav-link:hover{background:#f7f7f7;color:#000}
.btn{
  border-radius:11px;
  background:#111;
  color:#fff;
  font-weight:700;
  padding:13px 19px;
  box-shadow:none;
  font-size:13px;
  letter-spacing:-.01em;
}
.btn:hover{background:#242424;transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.10)}
.btn-sm{padding:10px 15px;font-size:12px}
.btn-sm span,.btn span{transition:transform .2s}
.btn:hover span{transform:translate(2px,-1px)}
.btn-outline{background:#fff;color:#1c1c1c;border:1px solid #dcdcdc}
.btn-outline:hover{background:#f8f8f8}
.btn-light{background:#fff;color:#111}
.btn-light:hover{background:#fff}
.menu-btn span{background:#1c1c1c}

.mega-menu{border-bottom:1px solid #e8e8e8;box-shadow:0 18px 40px rgba(0,0,0,.08)}
.mega-grid{grid-template-columns:.82fr 1.55fr .72fr;gap:30px;padding:30px 0 32px}
.mega-intro h3{font-size:23px;line-height:1.12;letter-spacing:-.03em}
.mega-intro p{font-size:12.5px}
.eyebrow{font-size:10px;color:#cf23da;letter-spacing:.16em}
.text-link,.mega-side>a{color:#c923d4}
.mega-links a{padding:9px;border-radius:12px}
.mega-links a:hover{background:#faf5fa}
.mega-links a>span.mega-icon{
  width:38px;height:38px;border-radius:11px;background:#fff1ff;border:1px solid #ffd9ff;display:grid;place-items:center;flex:0 0 auto;
}
.mega-icon img{width:20px;height:20px;display:block}
.mega-links b{font-size:12.5px}
.mega-links small{font-size:9.5px;color:#858585}
.mega-side{border-left:1px solid #ededed}
.mini-chart{background:linear-gradient(150deg,#fff,#fff4ff);border-color:#f4d8f5}
.chart-head span{color:#d72ae2}
.status-pill{background:#fff0ff;color:#cb25d6!important}

.hero{
  padding:78px 0 68px;
  background:
    radial-gradient(circle at 78% 16%,rgba(241,64,254,.14),transparent 27%),
    radial-gradient(circle at 14% 70%,rgba(241,64,254,.07),transparent 29%),
    linear-gradient(#fff,#fdfdfd);
}
.hero-grid{grid-template-columns:.94fr 1.06fr;gap:58px}
.hero-copy h1,.page-hero h1{
  font-size:clamp(44px,5.15vw,64px);
  line-height:1.02;
  letter-spacing:-.052em;
  margin:10px 0 19px;
  font-weight:760;
}
.gradient-text{
  background:linear-gradient(100deg,#1c1c1c 0%,#1c1c1c 12%,#f140fe 68%,#f140fe 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-copy>p{font-size:16px;line-height:1.7;color:#646464;max-width:575px}
.hero-actions{margin:25px 0 21px}
.trust-line{color:#707070;font-size:11.5px}
.avatar-stack i{background:linear-gradient(145deg,#f7f7f7,#dedede)}
.hero-visual{min-height:520px}
.glow-a{background:radial-gradient(circle,rgba(241,64,254,.20) 0,rgba(241,64,254,.10) 48%,transparent 70%)}
.glow-b{background:radial-gradient(circle,rgba(241,64,254,.13) 0,rgba(241,64,254,.04) 45%,transparent 70%)}
.dashboard-card{border-color:#e8e8e8;box-shadow:0 22px 55px rgba(0,0,0,.10)}
.main-dashboard{padding:25px 25px 18px;border-radius:24px}
.dash-top span{color:#737373}
.dash-top strong{font-size:27px}
.chart-line{stroke:#f140fe;filter:drop-shadow(0 5px 6px rgba(241,64,254,.18))}
.floating-card{border-color:#ededed;box-shadow:0 18px 40px rgba(0,0,0,.10)}
.bars i{background:linear-gradient(#f486fc,#f140fe)}
.search-dot{background:#fff0ff;border:1px solid #ffd8ff}
.search-dot img{width:19px;height:19px}
.floating-badge{background:#111;border:1px solid #252525}
.floating-badge span{color:#f140fe}

.logo-strip{border-color:#efefef}
.logo-strip-inner{min-height:94px}
.logo-strip p{font-size:11px}
.brand-chips span{border-color:#e9e9e9;color:#595959;background:#fff;font-size:10px;padding:10px 15px}

.section{padding:88px 0}
.section-soft{background:#fafafa}
.section-dark{background:#111;color:#fff}
.section-head{max-width:720px;margin-bottom:42px}
.section-head h2,.split-copy h2,.cta-shell h2{
  font-size:clamp(32px,3.5vw,46px);
  line-height:1.08;
  letter-spacing:-.045em;
  margin:8px 0 14px;
  font-weight:740;
}
.section-head p,.split-copy p{color:#707070;font-size:14px}
.section-dark .section-head p,.section-dark .split-copy p{color:#bdbdbd}
.eyebrow.light{color:#f686ff}
.split{gap:62px}
.orb{
  background:radial-gradient(circle at 35% 35%,#fff3ff 0,#ffd5ff 30%,#f140fe 58%,rgba(241,64,254,.10) 76%,transparent 78%);
}
.search-window,.review-card{border-color:#ebebeb;box-shadow:0 18px 45px rgba(0,0,0,.10)}
.searchbar{background:#f2f2f2}
.searchbar:before{background:#111;color:#fff}
.product-tile{border-color:#ececec;background:linear-gradient(#f4f4f4 55%,#fff 55%)}
.product-tile:before{background:#e8d9e8}
.check-item i{background:#fff0ff;color:#f140fe;border:1px solid #ffd7ff}
.check-item b{font-size:13.5px}
.check-item span{font-size:12.5px;color:#747474}

.result-visual{
  background:linear-gradient(145deg,#fafafa,#fff1ff);
  border-color:#efdfef;
  border-radius:26px;
}
.result-score{background:#111}
.metric-card,.case-card,.service-card,.review-quote,.feature-card,.article-card{
  border-color:#e9e9e9;border-radius:19px;box-shadow:0 3px 0 rgba(0,0,0,.01)
}
.metric-card strong{font-size:35px}
.case-card:before{background:radial-gradient(circle,rgba(241,64,254,.16),transparent 68%)}
.case-card .case-brand{color:#d025dc}
.case-card h3{font-size:20px}
.case-card p{color:#717171}
.case-card a{color:#c821d3}
.services-grid{gap:14px}
.service-card{min-height:224px;padding:23px;transition:.22s}
.service-card:hover{transform:translateY(-4px);box-shadow:0 15px 35px rgba(0,0,0,.08);border-color:#dedede}
.service-icon{
  width:45px;height:45px;border-radius:13px;background:#fff1ff;border:1px solid #ffd8ff;
  display:grid;place-items:center;margin-bottom:29px;
}
.service-icon img{width:23px;height:23px;display:block}
.service-card h3{font-size:18px}
.service-card p{font-size:12.5px;color:#6f6f6f;line-height:1.6}
.service-card .go{border-color:#e5e5e5;color:#111;font-size:13px}
.ps-card{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.045)}
.ps-card b{color:#f47bfc}
.ps-card h3{font-size:23px}
.ps-card p{color:#bdbdbd;font-size:13.5px}
.review-quote p{font-size:13px;color:#626262}
.review-quote .stars{color:#f140fe}
.stats-grid{gap:12px}
.stat{background:linear-gradient(145deg,#fff,#fff5ff);border-color:#eedfee;padding:25px}
.stat strong{font-size:36px}
.stat span{font-size:11.5px}
.platform{border-color:#e7e7e7}

.cta-section{padding-top:34px}
.cta-shell{
  background:
    radial-gradient(circle at 85% 10%,rgba(241,64,254,.30),transparent 28%),
    linear-gradient(135deg,#111,#171717 55%,#2a122b);
  border-radius:27px;padding:50px;gap:50px;box-shadow:0 24px 60px rgba(0,0,0,.16)
}
.cta-shell>div>p{color:#c8c8c8}
.cta-points span{background:rgba(255,255,255,.08)}
.lead-form{background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.12);border-radius:20px}
.lead-form input,.lead-form textarea,.lead-form select{border-radius:10px}
.lead-form small{color:#a9a9a9}

.footer{background:#0d0d0d;margin-top:80px;padding-top:60px}
.footer-brand p{color:#aaa}
.footer h4{font-size:11.5px}
.footer>div a:not(.brand){color:#aaa}
.socials a{border-color:#292929}
.newsletter form{background:#171717;border-color:#292929}
.newsletter button{background:#f140fe;color:#111;font-weight:800}
.footer-bottom{border-color:#222;color:#6f6f6f}

.page-hero{
  padding:76px 0 66px;
  background:radial-gradient(circle at 78% 28%,rgba(241,64,254,.13),transparent 27%),linear-gradient(#fff,#fdfdfd)
}
.page-hero h1{font-size:clamp(42px,4.8vw,60px)}
.page-hero p{font-size:15.5px;color:#686868}
.orbit-circle{
  background:radial-gradient(circle at 32% 28%,#fff3ff,#ffd4ff 38%,#f140fe 70%,#bf21ca 100%);
  box-shadow:0 24px 55px rgba(241,64,254,.16)
}
.orbit-card{border-color:#e9e9e9;box-shadow:0 17px 38px rgba(0,0,0,.09)}
.orbit-card strong{font-size:25px}
.metric-strip-grid{border-color:#e8e8e8;box-shadow:0 12px 35px rgba(0,0,0,.055)}
.metric-strip-grid strong{font-size:27px}
.feature-card{min-height:202px}
.feature-card .number{color:#d026dc}
.feature-card h3{font-size:17.5px}
.feature-card p{font-size:12.5px;color:#707070}
.process-card h3{font-size:16.5px}
.process-card p{color:#bdbdbd}
.faq-q{font-size:14px}
.faq-q span:last-child{color:#f140fe}
.faq-a{color:#707070}
.case-large .case-kpi{font-size:38px;color:#ef3afb}
.filter-chip{border-color:#e4e4e4}
.filter-chip.active{background:#111}
.contact-card{border-color:#e7e7e7}
.contact-card p,.contact-card li{color:#6d6d6d}
.contact-form{background:#fafafa;border-color:#e7e7e7}
.article-image{background:radial-gradient(circle at 72% 35%,rgba(241,64,254,.28),transparent 25%),linear-gradient(135deg,#fff5ff,#f5f5f5)}
.article-copy span{color:#d026dc}
.article-copy h3{font-size:17.5px}
.article-copy p{color:#707070}

@media(max-width:980px){
  .brand-logo{width:158px}
  .hero-copy h1,.page-hero h1{font-size:52px}
  .section{padding:78px 0}
}
@media(max-width:640px){
  .nav-wrap{height:66px}
  .brand-logo{width:145px;max-height:32px}
  .hero{padding:50px 0 42px}
  .hero-copy h1,.page-hero h1{font-size:39px;line-height:1.06}
  .hero-copy>p,.page-hero p{font-size:14.5px}
  .hero-visual{min-height:405px}
  .section{padding:64px 0}
  .section-head h2,.split-copy h2,.cta-shell h2{font-size:31px}
  .section-head p,.split-copy p{font-size:13px}
  .service-card{min-height:195px}
  .cta-shell{padding:30px 19px}
  .footer-logo{width:175px}
}


/* =========================================================
   STRATALX Visual Media Layer
   Temporary licensed/free imagery for richer presentation
   ========================================================= */
.media-feature{padding:54px 0 36px}
.media-feature-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:18px;
  align-items:stretch;
}
.media-panel{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  min-height:460px;
  background:#f3f3f3;
  border:1px solid #e9e9e9;
}
.media-panel img,.media-tile img,.service-visual-banner img,.article-image img,.case-thumb img,.contact-photo img{
  width:100%;height:100%;display:block;object-fit:cover;
}
.media-panel img{position:absolute;inset:0}
.media-panel:after,.media-tile:after,.service-visual-banner:after,.case-thumb:after,.contact-photo:after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.62));
}
.media-caption{
  position:absolute;left:24px;right:24px;bottom:22px;z-index:2;color:#fff;
}
.media-caption span{
  display:inline-flex;background:rgba(241,64,254,.94);color:#111;
  border-radius:999px;padding:6px 9px;font-size:9px;font-weight:900;
  letter-spacing:.10em;text-transform:uppercase;margin-bottom:8px;
}
.media-caption h3{font-size:23px;line-height:1.08;margin:0 0 6px;letter-spacing:-.03em}
.media-caption p{font-size:12px;max-width:520px;color:rgba(255,255,255,.82);margin:0}
.media-stack{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.media-tile{
  min-height:221px;position:relative;overflow:hidden;border-radius:24px;
  border:1px solid #e9e9e9;background:#f5f5f5;
}
.media-tile .media-caption{left:19px;bottom:17px}
.media-tile .media-caption h3{font-size:17px}
.media-tile.illustration-tile{background:#fff6ff}
.media-tile.illustration-tile img{object-fit:contain;padding:8px}
.media-tile.illustration-tile:after{background:linear-gradient(180deg,transparent 56%,rgba(17,17,17,.66))}

.image-story{padding-top:32px}
.image-story-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:18px}
.image-story-copy{
  border:1px solid #e8e8e8;border-radius:24px;padding:34px;
  display:flex;flex-direction:column;justify-content:center;background:#fff;
}
.image-story-copy h2{font-size:38px;line-height:1.08;letter-spacing:-.045em;margin:8px 0 14px}
.image-story-copy p{font-size:13px;color:#6f6f6f}
.image-story-photo{position:relative;min-height:430px;border-radius:24px;overflow:hidden}
.image-story-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.image-story-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.12),transparent)}

.service-media-wrap{padding:42px 0 0}
.service-visual-banner{
  position:relative;height:385px;overflow:hidden;border-radius:25px;
  border:1px solid #e7e7e7;background:#f5f5f5;
}
.service-visual-banner.illustration img{object-fit:contain;padding:26px;background:#fff7ff}
.service-visual-banner.illustration:after{background:linear-gradient(180deg,transparent 58%,rgba(0,0,0,.64))}
.service-visual-label{
  position:absolute;z-index:2;left:25px;bottom:24px;color:#fff;
  background:rgba(17,17,17,.86);backdrop-filter:blur(8px);
  padding:12px 15px;border-radius:13px;font-size:11px;font-weight:700;
}
.service-visual-label b{color:#f140fe}

.case-thumb{height:155px;position:relative;margin:-26px -26px 23px;overflow:hidden}
.case-thumb:after{background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.10))}
.case-large{overflow:hidden}
.case-large .case-kpi{position:relative;z-index:2}
.article-image{overflow:hidden}
.article-image img{transition:transform .45s ease}
.article-card:hover .article-image img{transform:scale(1.035)}
.article-image:after{z-index:2}
.contact-photo{
  height:245px;position:relative;overflow:hidden;border-radius:18px;margin:-4px -4px 24px;
}
.contact-photo:after{background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.30))}
.client-photo-wide{
  position:relative;height:460px;border-radius:26px;overflow:hidden;border:1px solid #e8e8e8;
}
.client-photo-wide img{width:100%;height:100%;object-fit:cover}
.client-photo-wide:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.38),transparent 58%)}
.client-photo-copy{position:absolute;left:38px;bottom:36px;z-index:2;color:#fff;max-width:440px}
.client-photo-copy span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#f988ff;font-weight:900}
.client-photo-copy h2{font-size:36px;line-height:1.08;letter-spacing:-.04em;margin:8px 0 0}

.media-credit{
  text-align:right;color:#999;font-size:9px;margin:8px 3px 0;
}
.media-credit a{color:#777;text-decoration:underline;text-underline-offset:2px}

@media(max-width:980px){
  .media-feature-grid,.image-story-grid{grid-template-columns:1fr}
  .media-panel{min-height:420px}
  .media-stack{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .service-visual-banner{height:330px}
}
@media(max-width:640px){
  .media-feature{padding:32px 0 20px}
  .media-panel{min-height:350px}
  .media-stack{grid-template-columns:1fr}
  .media-tile{min-height:270px}
  .media-caption h3{font-size:20px}
  .image-story-copy{padding:25px}
  .image-story-copy h2{font-size:30px}
  .image-story-photo{min-height:330px}
  .service-media-wrap{padding-top:26px}
  .service-visual-banner{height:285px}
  .client-photo-wide{height:370px}
  .client-photo-copy{left:23px;right:23px;bottom:24px}
  .client-photo-copy h2{font-size:29px}
}


/* =========================================================
   STRATALX Professional Fidelity Pass
   ========================================================= */

/* Infinite brand marquee */
.brand-marquee-section{
  padding:28px 0 34px;
  border-top:1px solid #ededed;
  border-bottom:1px solid #ededed;
  background:#fff;
  overflow:hidden;
}
.brand-marquee-head{
  display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:24px
}
.brand-marquee-head .eyebrow{margin:0;color:#222;font-size:10px}
.brand-marquee-head p{margin:0;color:#858585;font-size:11px}
.brand-marquee{width:100%;overflow:hidden;position:relative}
.brand-marquee:before,.brand-marquee:after{
  content:"";position:absolute;top:0;bottom:0;width:11vw;z-index:3;pointer-events:none
}
.brand-marquee:before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.brand-marquee:after{right:0;background:linear-gradient(-90deg,#fff,rgba(255,255,255,0))}
.brand-marquee-track{
  width:max-content;display:flex;align-items:center;gap:18px;
  animation:stratalxMarquee 26s linear infinite;will-change:transform
}
.brand-marquee:hover .brand-marquee-track{animation-play-state:paused}
.brand-logo-item{
  min-width:172px;height:72px;border:1px solid #ededed;border-radius:16px;background:#fff;
  display:flex;align-items:center;justify-content:center;gap:10px;padding:0 18px;
  color:#242424;box-shadow:0 3px 10px rgba(0,0,0,.018)
}
.brand-logo-item i{
  width:31px;height:31px;border-radius:10px;background:#111;color:#f140fe;
  display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:900
}
.brand-logo-item b{font-size:13px;letter-spacing:.055em}
.brand-logo-item img{max-width:100%;max-height:52px;width:auto;height:auto;object-fit:contain;display:block}
.marquee-note{text-align:right;margin-top:10px;color:#aaa;font-size:8.5px}
@keyframes stratalxMarquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 9px))}}

/* Premium visual system */
.commerce-showcase{padding:88px 0 94px;background:#fafafa}
.commerce-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:65px;align-items:center}
.commerce-copy h2{
  font-size:clamp(34px,3.7vw,48px);line-height:1.07;letter-spacing:-.047em;margin:9px 0 16px
}
.commerce-copy>p{color:#6d6d6d;font-size:14px;max-width:460px}
.commerce-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:28px 0}
.commerce-kpis>div{padding:15px 8px 15px 0;border-top:1px solid #ddd}
.commerce-kpis strong{display:block;font-size:21px;letter-spacing:-.035em}
.commerce-kpis span{display:block;font-size:9.5px;color:#818181;margin-top:3px}
.commerce-canvas{min-height:565px;position:relative}
.commerce-canvas:before{
  content:"";position:absolute;width:440px;height:440px;border-radius:50%;right:20px;top:30px;
  background:radial-gradient(circle,rgba(241,64,254,.17),rgba(241,64,254,.035) 55%,transparent 72%)
}
.commerce-browser{
  position:absolute;left:28px;right:28px;top:48px;background:#fff;border:1px solid #e5e5e5;border-radius:23px;
  box-shadow:0 28px 65px rgba(0,0,0,.11);overflow:hidden;z-index:2
}
.browser-top{height:42px;border-bottom:1px solid #ededed;display:flex;align-items:center;gap:6px;padding:0 13px;background:#fbfbfb}
.browser-top>span{width:7px;height:7px;border-radius:50%;background:#d8d8d8}
.browser-url{height:23px;border:1px solid #ececec;background:#fff;border-radius:7px;margin-left:10px;flex:1;display:flex;align-items:center;padding:0 10px;color:#a1a1a1;font-size:8.5px}
.browser-body{display:grid;grid-template-columns:54px 1fr;min-height:380px}
.browser-side{border-right:1px solid #ededed;padding:16px 0;display:flex;flex-direction:column;align-items:center;gap:17px;background:#fdfdfd}
.browser-side b{width:27px;height:27px;border-radius:9px;background:#111;color:#f140fe;display:grid;place-items:center;font-size:10px}
.browser-side i{width:17px;height:4px;border-radius:999px;background:#e0e0e0}
.browser-main{padding:24px 27px 19px}
.browser-heading{display:flex;justify-content:space-between;align-items:start}
.browser-heading small{color:#969696;font-size:9px}
.browser-heading h3{font-size:25px;margin:2px 0 0;letter-spacing:-.04em}
.browser-heading>span{background:#fff0ff;color:#ca20d4;padding:6px 8px;border-radius:999px;font-size:9px;font-weight:800}
.browser-tabs{display:flex;gap:19px;border-bottom:1px solid #eee;margin-top:15px}
.browser-tabs>*{padding:0 0 9px;font-size:8.5px;color:#9a9a9a}
.browser-tabs b{color:#111;border-bottom:2px solid #f140fe}
.performance-chart{height:180px;margin-top:7px}
.performance-chart svg{width:100%;height:100%}
.browser-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.browser-bottom div{padding:10px;border:1px solid #ededed;border-radius:10px}
.browser-bottom small{display:block;color:#959595;font-size:8px}
.browser-bottom strong{font-size:13px}
.commerce-product-card{
  position:absolute;width:180px;background:#fff;border:1px solid #e5e5e5;border-radius:17px;padding:10px;
  z-index:5;box-shadow:0 18px 40px rgba(0,0,0,.13);display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:center
}
.commerce-product-card img{width:58px;height:66px;object-fit:cover;border-radius:11px;background:#f3f3f3}
.commerce-product-card span,.commerce-product-card small{display:block;color:#888;font-size:7.5px}
.commerce-product-card strong{display:block;font-size:20px;letter-spacing:-.04em}
.product-one{left:-7px;bottom:36px}
.product-two{right:-5px;bottom:14px}
.commerce-mini-card{
  position:absolute;right:9px;top:17px;z-index:5;background:#111;color:#fff;border-radius:16px;padding:13px 16px;
  box-shadow:0 15px 36px rgba(0,0,0,.18)
}
.commerce-mini-card span{display:block;font-size:7.5px;color:#aaa}
.commerce-mini-card strong{font-size:25px;line-height:1.1}
.commerce-mini-card i{display:block;font-style:normal;color:#f140fe;font-size:8px}

/* Marketplace result mockup */
.search-window{padding:16px!important}
.market-searchbar{
  display:grid;grid-template-columns:27px 1fr auto;align-items:center;gap:9px;border:1px solid #dedede;background:#fff;
  height:42px;border-radius:10px;padding:0 8px 0 9px
}
.market-searchbar>span{color:#777}.market-searchbar>div{font-size:9px;color:#7e7e7e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.market-searchbar>b{background:#111;color:#fff;border-radius:7px;padding:7px 9px;font-size:8px}
.market-results-head{display:flex;justify-content:space-between;align-items:center;margin:16px 1px 11px}
.market-results-head b{font-size:10px}.market-results-head span{font-size:7.5px;color:#969696}
.market-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.market-product{border:1px solid #ededed;border-radius:11px;padding:8px;min-width:0;position:relative;background:#fff}
.market-product.featured{border-color:#f4c0f8;box-shadow:0 8px 20px rgba(241,64,254,.07)}
.market-product img{width:100%;height:82px;object-fit:cover;border-radius:7px;background:#f5f5f5}
.market-product>b{display:block;font-size:7.5px;line-height:1.25;margin:3px 0}
.market-product>strong{display:block;font-size:10px}
.market-stars{font-size:6.5px;color:#f140fe;white-space:nowrap}.market-stars small{color:#888}
.sponsored{position:absolute;left:12px;top:12px;background:#111;color:#fff;border-radius:999px;padding:3px 5px;font-size:5.5px;z-index:2}

/* Creative image composition */
.product-creative-section{background:#fff}
.product-creative-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center}
.product-creative-stage{position:relative;min-height:540px}
.product-creative-stage:before{
  content:"";position:absolute;width:430px;height:430px;border-radius:50%;left:28px;top:36px;
  background:radial-gradient(circle,rgba(241,64,254,.18),rgba(241,64,254,.035) 60%,transparent 73%)
}
.creative-main-photo{
  position:absolute;left:60px;right:55px;top:42px;bottom:40px;border-radius:25px;overflow:hidden;
  border:1px solid #e5e5e5;box-shadow:0 25px 60px rgba(0,0,0,.11);background:#f6f6f6
}
.creative-main-photo img{width:100%;height:100%;object-fit:cover}
.creative-floating-panel{
  position:absolute;z-index:4;background:#fff;border:1px solid #e8e8e8;border-radius:16px;padding:13px 15px;
  box-shadow:0 16px 36px rgba(0,0,0,.11)
}
.creative-floating-panel span,.creative-floating-panel small{display:block;font-size:8px;color:#8a8a8a}
.creative-floating-panel strong{font-size:24px;letter-spacing:-.04em}
.creative-panel-a{left:4px;bottom:70px}
.creative-panel-b{right:4px;top:70px}.creative-panel-b b{font-size:24px;color:#f140fe}
.creative-swatch{position:absolute;right:18px;bottom:12px;background:#111;color:#fff;border-radius:14px;padding:11px 13px;z-index:5;display:flex;align-items:center;gap:6px}
.creative-swatch i{width:12px;height:12px;border-radius:50%;background:#f140fe}.creative-swatch i:nth-child(2){background:#fff}.creative-swatch i:nth-child(3){background:#555}
.creative-swatch span{font-size:8px;color:#bbb;margin-left:3px}

@media(max-width:980px){
 .commerce-grid,.product-creative-grid{grid-template-columns:1fr}
 .commerce-copy{max-width:650px}
 .commerce-canvas{max-width:760px;width:100%;margin:auto}
 .product-creative-stage{max-width:700px;width:100%;margin:auto}
}
@media(max-width:640px){
 .brand-marquee-head{display:block}.brand-marquee-head p{margin-top:5px}
 .brand-logo-item{min-width:145px;height:62px}.brand-logo-item b{font-size:11px}
 .commerce-showcase{padding:64px 0}
 .commerce-grid{gap:32px}
 .commerce-copy h2{font-size:32px}
 .commerce-kpis{grid-template-columns:1fr 1fr 1fr}
 .commerce-canvas{min-height:435px}
 .commerce-browser{left:0;right:0;top:35px}
 .browser-body{grid-template-columns:37px 1fr;min-height:310px}
 .browser-main{padding:18px 14px}
 .browser-heading h3{font-size:20px}
 .performance-chart{height:132px}
 .commerce-product-card{width:145px;grid-template-columns:45px 1fr}
 .commerce-product-card img{width:45px;height:52px}
 .commerce-product-card strong{font-size:16px}
 .product-one{left:-3px;bottom:10px}.product-two{right:-3px;bottom:-18px}
 .commerce-mini-card{top:7px;right:5px}
 .market-product-grid{gap:5px}.market-product{padding:5px}.market-product img{height:62px}
 .market-product>b{font-size:6.5px}.market-product>strong{font-size:8px}
 .product-creative-stage{min-height:430px}
 .creative-main-photo{left:30px;right:25px;top:30px;bottom:35px}
 .creative-panel-b{right:0;top:45px}
}


/* =========================================================
   STRATALX Motion System V3
   Premium interactions, parallax, reveal, cursor, tilt
   ========================================================= */

:root{
  --ease-premium:cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.16,1,.3,1);
}

/* page-level polish */
body{
  background:
    radial-gradient(circle at 18% 5%,rgba(241,64,254,.035),transparent 23%),
    #fff;
}
::selection{background:#f140fe;color:#111}

/* top scroll progress */
.scroll-progress{
  position:fixed;left:0;top:0;height:2px;width:100%;z-index:999;
  transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,#f140fe,#ff91ff);
  box-shadow:0 0 18px rgba(241,64,254,.4);
  pointer-events:none;
}

/* subtle custom cursor glow */
.cursor-glow{
  position:fixed;left:0;top:0;width:240px;height:240px;border-radius:50%;
  pointer-events:none;z-index:0;opacity:0;
  background:radial-gradient(circle,rgba(241,64,254,.12),rgba(241,64,254,.035) 36%,transparent 68%);
  transform:translate(-50%,-50%);
  transition:opacity .25s ease;
  mix-blend-mode:multiply;
}
body.cursor-active .cursor-glow{opacity:1}
.site-header,main,.footer{position:relative;z-index:1}

/* richer hero */
.hero{
  min-height:calc(100vh - 110px);
  display:flex;align-items:center;
}
.hero-copy .eyebrow{
  display:inline-flex;align-items:center;gap:9px;
}
.hero-copy .eyebrow:before{
  content:"";width:24px;height:1px;background:#f140fe;box-shadow:0 0 10px rgba(241,64,254,.4)
}
.hero-copy h1 .gradient-text{
  position:relative;
}
.hero-copy h1 .gradient-text:after{
  content:"";position:absolute;left:0;bottom:-5px;height:3px;width:100%;
  transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,#f140fe,transparent);
  animation:underlineGrow 1.1s .8s var(--ease-spring) forwards;
}
@keyframes underlineGrow{to{transform:scaleX(1)}}

.hero-visual{
  transform-style:preserve-3d;
  perspective:1200px;
}
.main-dashboard,.floating-card,.floating-badge{
  will-change:transform;
  transition:transform .35s var(--ease-premium),box-shadow .35s var(--ease-premium);
}
.main-dashboard:hover{
  box-shadow:0 34px 80px rgba(0,0,0,.14);
}

/* floating loop animations */
.floating-card{animation:floatCard 6.5s ease-in-out infinite}
.floating-badge{animation:floatBadge 7.6s ease-in-out infinite}
.ad-card{animation-delay:-1.4s}
.rank-card{animation-delay:-3.1s}
@keyframes floatCard{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-9px,0)}
}
@keyframes floatBadge{
  0%,100%{transform:translate3d(0,0,0) rotate(0)}
  50%{transform:translate3d(0,-7px,0) rotate(.8deg)}
}

/* animated chart drawing */
.chart-line,
.performance-chart path[stroke="#F140FE"],
.performance-chart path[stroke="#f140fe"]{
  stroke-dasharray:1200;
  stroke-dashoffset:1200;
  transition:stroke-dashoffset 1.45s var(--ease-spring);
}
.visible .chart-line,
.visible.performance-chart path[stroke="#F140FE"],
.visible.performance-chart path[stroke="#f140fe"],
.performance-chart.visible path[stroke="#F140FE"],
.performance-chart.visible path[stroke="#f140fe"]{
  stroke-dashoffset:0;
}

/* reveal variants */
.reveal{
  opacity:0;
  transform:translate3d(0,26px,0);
  filter:blur(4px);
  transition:
    opacity .75s var(--ease-spring),
    transform .75s var(--ease-spring),
    filter .75s var(--ease-spring);
}
.reveal.visible{
  opacity:1;transform:translate3d(0,0,0);filter:blur(0)
}
.reveal-stagger>*{
  opacity:0;transform:translateY(18px);
}
.reveal-stagger.visible>*{
  opacity:1;transform:none;
  transition:opacity .65s var(--ease-spring),transform .65s var(--ease-spring)
}
.reveal-stagger.visible>*:nth-child(1){transition-delay:.03s}
.reveal-stagger.visible>*:nth-child(2){transition-delay:.08s}
.reveal-stagger.visible>*:nth-child(3){transition-delay:.13s}
.reveal-stagger.visible>*:nth-child(4){transition-delay:.18s}
.reveal-stagger.visible>*:nth-child(5){transition-delay:.23s}
.reveal-stagger.visible>*:nth-child(6){transition-delay:.28s}
.reveal-stagger.visible>*:nth-child(7){transition-delay:.33s}
.reveal-stagger.visible>*:nth-child(8){transition-delay:.38s}

/* magnetic buttons */
.btn{
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .22s var(--ease-premium),box-shadow .22s var(--ease-premium),background .22s ease;
}
.btn:before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(115deg,#111 0%,#242424 55%,#f140fe 170%);
  opacity:0;transition:opacity .25s ease;
}
.btn:hover:before{opacity:1}
.btn:after{
  content:"";position:absolute;top:-120%;left:-45%;width:45%;height:340%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transform:rotate(18deg);transition:left .65s var(--ease-premium)
}
.btn:hover:after{left:120%}
.btn-outline:before{background:#f8f8f8}
.btn-outline:after{background:linear-gradient(90deg,transparent,rgba(241,64,254,.14),transparent)}

/* card tilt glow */
[data-tilt]{
  transform-style:preserve-3d;
  transition:transform .22s var(--ease-premium),box-shadow .22s var(--ease-premium),border-color .22s ease;
  will-change:transform;
}
[data-tilt]:after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(241,64,254,.085),transparent 40%);
  opacity:0;transition:opacity .2s ease;
}
[data-tilt]:hover:after{opacity:1}
[data-tilt]:hover{border-color:#e1d7e2;box-shadow:0 20px 46px rgba(0,0,0,.08)}

/* services icon motion */
.service-card .service-icon{
  transition:transform .35s var(--ease-spring),background .25s ease,border-color .25s ease;
}
.service-card:hover .service-icon{
  transform:translateY(-3px) rotate(-3deg) scale(1.04);
  background:#f140fe;border-color:#f140fe;
}
.service-card:hover .service-icon img{filter:brightness(0) saturate(100%)}
.service-card .go{
  transition:transform .28s var(--ease-spring),background .25s ease,color .25s ease,border-color .25s ease
}
.service-card:hover .go{
  transform:translate(3px,-3px) rotate(-4deg);
  background:#111;color:#fff;border-color:#111
}

/* marquee layers */
.brand-marquee-section{position:relative}
.brand-marquee-track{animation-duration:30s}
.brand-logo-item{
  transition:transform .3s var(--ease-spring),border-color .25s ease,box-shadow .25s ease,background .25s ease;
}
.brand-logo-item:hover{
  transform:translateY(-4px);
  border-color:#f3c6f5;
  box-shadow:0 12px 28px rgba(0,0,0,.07);
  background:#fffaff
}
.brand-logo-item:hover i{
  transform:rotate(-6deg) scale(1.06)
}
.brand-logo-item i{transition:transform .3s var(--ease-spring)}

/* commerce dashboard depth */
.commerce-browser{
  transition:transform .45s var(--ease-premium),box-shadow .45s var(--ease-premium);
  transform-style:preserve-3d;
}
.commerce-canvas:hover .commerce-browser{
  box-shadow:0 38px 78px rgba(0,0,0,.14)
}
.commerce-product-card,.commerce-mini-card{
  transition:transform .32s var(--ease-spring),box-shadow .32s ease;
}
.commerce-product-card:hover,.commerce-mini-card:hover{
  box-shadow:0 24px 52px rgba(0,0,0,.15)
}
.product-one{animation:floatOne 6.2s ease-in-out infinite}
.product-two{animation:floatTwo 7s ease-in-out infinite}
.commerce-mini-card{animation:floatThree 7.4s ease-in-out infinite}
@keyframes floatOne{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-10px) rotate(1deg)}}
@keyframes floatTwo{0%,100%{transform:translateY(0) rotate(1.2deg)}50%{transform:translateY(-8px) rotate(-1deg)}}
@keyframes floatThree{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* product card motion */
.market-product{
  transition:transform .28s var(--ease-spring),box-shadow .28s ease,border-color .28s ease
}
.market-product:hover{
  transform:translateY(-6px);
  border-color:#f1c9f3;
  box-shadow:0 14px 30px rgba(0,0,0,.085)
}
.market-product img{transition:transform .45s var(--ease-spring)}
.market-product:hover img{transform:scale(1.045)}

/* creative section motion */
.creative-main-photo{
  transition:transform .55s var(--ease-premium),box-shadow .55s ease;
}
.product-creative-stage:hover .creative-main-photo{
  transform:scale(1.015) rotate(-.25deg);
  box-shadow:0 32px 70px rgba(0,0,0,.14)
}
.creative-floating-panel{animation:creativeFloat 7s ease-in-out infinite}
.creative-panel-b{animation-delay:-3.4s}
@keyframes creativeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.creative-swatch{animation:creativeFloat 8.3s ease-in-out infinite;animation-delay:-1.7s}

/* dark-section ambient line */
.section-dark{
  position:relative;overflow:hidden;
}
.section-dark:before{
  content:"";position:absolute;inset:auto -10% -45% auto;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(241,64,254,.13),transparent 68%);
  pointer-events:none;
}
.section-dark:after{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,#f140fe 50%,transparent);
  opacity:.35
}

/* testimonial hover */
.review-quote{
  transition:transform .3s var(--ease-spring),box-shadow .3s ease,border-color .3s ease
}
.review-quote:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(0,0,0,.08);
  border-color:#ecd8ee
}

/* stats visual pulse */
.stat strong{position:relative}
.stat strong:after{
  content:"";position:absolute;left:0;bottom:-7px;width:22px;height:2px;background:#f140fe;border-radius:999px
}
.stat:hover strong:after{animation:statPulse 1.1s ease infinite alternate}
@keyframes statPulse{to{width:48px}}

/* cta glow */
.cta-shell{
  position:relative;overflow:hidden;
}
.cta-shell:before{
  content:"";position:absolute;width:380px;height:380px;border-radius:50%;
  right:-140px;top:-150px;
  background:radial-gradient(circle,rgba(241,64,254,.34),transparent 68%);
  animation:ctaGlow 8s ease-in-out infinite alternate;
  pointer-events:none
}
@keyframes ctaGlow{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(-35px,30px,0) scale(1.12)}
}
.cta-shell>*{position:relative;z-index:2}

/* nav active scroll state */
.site-header.scrolled{
  box-shadow:0 12px 32px rgba(0,0,0,.055);
  background:rgba(255,255,255,.985)
}
.site-header.scrolled .nav-wrap{height:68px}

/* image zoom / shine */
.media-panel,.media-tile,.service-visual-banner,.case-thumb,.contact-photo,.client-photo-wide,.article-image{
  overflow:hidden
}
.media-panel img,.media-tile img,.service-visual-banner img,.case-thumb img,.contact-photo img,.client-photo-wide img{
  transition:transform .8s var(--ease-premium),filter .8s ease
}
.media-panel:hover img,.media-tile:hover img,.service-visual-banner:hover img,.case-thumb:hover img,.contact-photo:hover img,.client-photo-wide:hover img{
  transform:scale(1.035)
}

/* accessible reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
  }
  .cursor-glow{display:none}
}

/* mobile: keep motion elegant and performant */
@media(max-width:640px){
  .hero{min-height:auto}
  .cursor-glow{display:none}
  .brand-marquee-track{animation-duration:24s}
  [data-tilt]{transform:none!important}
  .floating-card,.floating-badge,.creative-floating-panel,.commerce-product-card,.commerce-mini-card{
    animation-duration:8s
  }
}


/* =========================================================
   STRATALX Production Navigation V4
   Fixes stacking, dropdown visibility, mobile nav + final UX
   ========================================================= */

/* Critical stacking fix:
   V3 set header/main/footer to same z-index, allowing main to paint
   over the mega menu. Header must own the top navigation layer. */
.site-header{
  position:sticky!important;
  top:0!important;
  z-index:1200!important;
  overflow:visible!important;
  isolation:isolate;
}
main{position:relative;z-index:0!important}
.footer{position:relative;z-index:0!important}
.cursor-glow{z-index:0}
.scroll-progress{z-index:2000}

/* Desktop nav backdrop is injected by JS */
.nav-backdrop{
  position:fixed;
  inset:0;
  z-index:1100;
  background:rgba(10,10,10,.28);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .25s ease,visibility .25s ease;
  backdrop-filter:blur(2px);
}
body.mega-active .nav-backdrop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
body.mobile-nav-active{overflow:hidden}

/* Mega dropdown */
.mega-menu{
  position:absolute!important;
  top:100%!important;
  left:0!important;
  right:0!important;
  z-index:1250!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-10px) scale(.995);
  transform-origin:50% 0;
  background:rgba(255,255,255,.985);
  backdrop-filter:blur(20px);
  border-top:1px solid #f3f3f3;
  border-bottom:1px solid #e6e6e6;
  box-shadow:0 26px 70px rgba(0,0,0,.14);
  max-height:calc(100vh - 74px);
  overflow-y:auto;
  overscroll-behavior:contain;
  transition:
    opacity .22s ease,
    transform .28s cubic-bezier(.16,1,.3,1),
    visibility .22s ease;
}
.site-header.mega-open .mega-menu{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
}
.site-header.mega-open .services-trigger{
  background:#f7f7f7;
  color:#111;
}
.nav-caret{
  display:inline-block;
  font-size:11px;
  margin-left:2px;
  transition:transform .25s cubic-bezier(.16,1,.3,1);
}
.site-header.mega-open .nav-caret{transform:rotate(180deg)}
.mega-grid{
  min-height:360px;
}
.mega-links a{
  position:relative;
  transition:transform .18s ease,background .18s ease;
}
.mega-links a:hover{transform:translateX(2px)}
.mega-links a:focus-visible,
.nav-link:focus-visible,
.menu-btn:focus-visible,
.mobile-services-toggle:focus-visible,
.mobile-panel a:focus-visible{
  outline:2px solid #f140fe;
  outline-offset:3px;
}
.services-trigger.active,
.desktop-nav .nav-link.active{
  color:#111;
  background:#fff1ff;
}

/* Mobile nav - hidden on desktop */
.mobile-panel{
  display:none;
}
@media(max-width:980px){
  .site-header{z-index:1500!important}
  .nav-backdrop{z-index:1400}
  body.mega-active .nav-backdrop{display:none}

  .mobile-panel{
    display:block!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:var(--mobile-nav-top, 68px)!important;
    bottom:0!important;
    z-index:1490!important;
    background:rgba(255,255,255,.99)!important;
    backdrop-filter:blur(20px);
    border-top:1px solid #ededed;
    padding:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none;
    transform:translateY(-8px);
    transition:
      opacity .22s ease,
      transform .26s cubic-bezier(.16,1,.3,1),
      visibility .22s ease!important;
  }
  .site-header.menu-open .mobile-panel{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto;
    transform:none;
  }
  .mobile-nav-inner{
    width:min(100% - 28px,760px);
    margin:0 auto;
    padding:20px 0 38px;
  }
  .mobile-services-toggle{
    width:100%;
    min-height:54px;
    border:0;
    border-bottom:1px solid #ececec;
    background:none;
    padding:0 4px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#171717;
    font-weight:750;
    font-size:17px;
    text-align:left;
  }
  .mobile-plus{
    width:30px;height:30px;border:1px solid #e5e5e5;border-radius:10px;
    display:grid;place-items:center;font-size:19px;font-weight:400;
    transition:transform .25s ease,background .2s ease,border-color .2s ease;
  }
  .mobile-services-toggle[aria-expanded="true"] .mobile-plus{
    transform:rotate(45deg);
    background:#111;color:#fff;border-color:#111;
  }
  .mobile-services-list{
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1),opacity .25s ease;
    border-bottom:1px solid transparent;
  }
  .mobile-services-list > *{
    overflow:hidden;
  }
  .mobile-services-list.open{
    grid-template-rows:1fr;
    opacity:1;
    border-bottom-color:#ececec;
    padding-bottom:10px;
  }
  /* wrapper behavior for grid animation */
  .mobile-services-list{
    display:block;
    max-height:0;
    overflow:hidden;
    transition:max-height .42s cubic-bezier(.16,1,.3,1),opacity .25s ease,padding .25s ease;
  }
  .mobile-services-list.open{
    max-height:620px;
    padding:8px 0 12px;
  }
  .mobile-services-list a{
    min-height:46px;
    padding:8px 8px!important;
    margin:2px 0;
    display:flex!important;
    align-items:center;
    gap:11px;
    border-radius:12px;
    color:#444;
    font-size:13px!important;
  }
  .mobile-services-list a:hover{background:#faf3fb}
  .mobile-services-list a img{
    width:19px;height:19px;flex:0 0 auto;
  }
  .mobile-services-list .mobile-all-services{
    color:#111;
    font-weight:750;
    justify-content:space-between;
    background:#fafafa;
    padding-left:13px!important;
  }
  .mobile-main-link{
    display:flex!important;
    align-items:center;
    min-height:54px;
    padding:0 4px!important;
    border-bottom:1px solid #ececec;
    color:#171717!important;
    font-size:16px!important;
    font-weight:700;
  }
  .mobile-main-link.active{color:#d326df!important}
  .mobile-audit-btn{
    margin-top:20px!important;
    min-height:50px;
    width:100%;
  }
  .menu-btn{position:relative;z-index:1510}
  .menu-btn span{transition:transform .25s ease,opacity .2s ease}
  .site-header.menu-open .menu-btn span:first-child{transform:translateY(4px) rotate(45deg)}
  .site-header.menu-open .menu-btn span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .mega-menu{display:none!important}
}

/* Better FAQ animation/interaction */
.faq-a{
  max-height:0!important;
  opacity:0;
  overflow:hidden;
  transition:max-height .35s cubic-bezier(.16,1,.3,1),opacity .25s ease!important;
}
.faq-item.open .faq-a{opacity:1}
.faq-q:hover{color:#c822d3}
.faq-q:focus-visible{outline:2px solid #f140fe;outline-offset:3px;border-radius:7px}

/* Prevent animated elements from accidentally covering nav */
.hero,.page-hero,.commerce-showcase,.product-creative-section,
.section,.brand-marquee-section{isolation:isolate}

/* Final micro-polish */
.desktop-nav .nav-link{position:relative}
.desktop-nav a.nav-link:after{
  content:"";
  position:absolute;
  left:12px;right:12px;bottom:5px;height:1px;
  background:#f140fe;
  transform:scaleX(0);
  transition:transform .22s ease;
}
.desktop-nav a.nav-link:hover:after,
.desktop-nav a.nav-link.active:after{transform:scaleX(1)}

@media(max-width:640px){
  .mobile-panel{top:var(--mobile-nav-top,66px)!important}
}


/* =========================================================
   STRATALX V4.1 Mobile Containing-Block Fix
   Sticky header uses backdrop-filter, so a fixed descendant
   would be fixed to the header rather than the viewport.
   Keep the panel absolute below the sticky header and give it
   an exact viewport-remaining height from JS.
   ========================================================= */
@media(max-width:980px){
  .mobile-panel{
    position:absolute!important;
    top:100%!important;
    bottom:auto!important;
    height:var(--mobile-panel-height,calc(100dvh - 67px))!important;
    max-height:none!important;
  }
}


/* =========================================================
   STRATALX V4.2 Mobile Menu Visual Polish
   ========================================================= */
@media(max-width:980px){
  .mobile-panel{
    background:#fff!important;
    backdrop-filter:none!important;
  }
  .mobile-services-toggle[aria-expanded="true"] .mobile-plus{
    transform:none!important;
    border-radius:10px;
  }
}


/* =========================================================
   STRATALX RESPONSIVE PRO V5
   Final canonical responsive layer.
   This block intentionally comes last and normalizes earlier
   breakpoint rules so mobile/tablet/desktop behave consistently.
   ========================================================= */

/* Global resilience */
html{overflow-x:clip}
body{overflow-x:clip;min-width:320px}
img,svg,video,canvas{max-width:100%;height:auto}
input,textarea,select,button{max-width:100%}
.container{width:min(var(--max),calc(100% - 40px))}
.hero-grid,.page-hero-grid,.split,.results-shell,.cta-shell,.contact-grid,
.commerce-grid,.product-creative-grid,.image-story-grid,.footer-grid,
.services-grid,.feature-grid,.case-grid,.blog-grid,.stats-grid,.review-platforms,
.problem-solution,.process,.cases-row{min-width:0}
.hero-grid>*,.page-hero-grid>*,.split>*,.results-shell>*,.cta-shell>*,
.contact-grid>*,.commerce-grid>*,.product-creative-grid>*,.image-story-grid>*,
.footer-grid>*{min-width:0}
h1,h2,h3,p{overflow-wrap:break-word}

/* Desktop polish */
@media(min-width:1200px){
  .container{width:min(1180px,calc(100% - 64px))}
  .hero{min-height:auto;padding:84px 0 76px}
  .hero-grid{gap:72px}
  .hero-visual{min-height:535px}
  .section{padding:92px 0}
  .page-hero{padding:82px 0 72px}
  .page-orbit{min-height:400px}
  .mega-grid{gap:34px}
}

/* Laptop / small desktop */
@media(min-width:981px) and (max-width:1199px){
  .container{width:min(1040px,calc(100% - 44px))}
  .nav-wrap{gap:15px}
  .brand-logo{width:148px}
  .nav-link{padding:9px 9px;font-size:12px}
  .desktop-cta{padding:10px 13px}
  .mega-grid{grid-template-columns:.78fr 1.55fr .67fr;gap:22px}
  .mega-side{padding-left:20px}
  .hero{padding:70px 0 62px;min-height:auto}
  .hero-grid{gap:38px}
  .hero-copy h1{font-size:clamp(42px,5vw,56px)}
  .hero-visual{min-height:470px}
  .main-dashboard{width:96%}
  .commerce-grid{gap:40px}
  .section{padding:78px 0}
}

/* Tablet / mobile nav range */
@media(max-width:980px){
  :root{--mobile-header-h:66px}
  .announcement{
    font-size:9.5px;
    line-height:1.35;
    padding:6px 16px;
    min-height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .nav-wrap{height:66px!important;gap:12px}
  .brand-logo{width:150px!important;max-height:34px!important}
  .menu-btn{display:block;width:42px;height:42px;flex:0 0 42px}
  .desktop-nav,.desktop-cta{display:none!important}

  /* mobile panel: exact sticky-header descendant behavior */
  .mobile-panel{
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:100%!important;
    bottom:auto!important;
    height:var(--mobile-panel-height,calc(100dvh - 92px))!important;
    max-height:var(--mobile-panel-height,calc(100dvh - 92px))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    padding-bottom:max(18px,env(safe-area-inset-bottom))!important;
  }
  .mobile-nav-inner{
    width:min(100% - 30px,720px);
    padding:14px 0 34px;
  }
  .mobile-services-toggle,.mobile-main-link{min-height:52px}
  .mobile-services-list.open{max-height:620px}
  .mobile-services-list a{min-height:43px;font-size:12.5px!important}
  .mobile-audit-btn{min-height:48px}

  /* Hero */
  .hero{
    min-height:auto!important;
    padding:58px 0 52px;
  }
  .hero-grid,.page-hero-grid,.split,.results-shell,.cta-shell,.contact-grid,
  .commerce-grid,.product-creative-grid,.image-story-grid{
    grid-template-columns:1fr!important;
  }
  .hero-grid{gap:34px}
  .hero-copy{text-align:center}
  .hero-copy h1,.page-hero h1{
    font-size:clamp(40px,7vw,52px)!important;
    line-height:1.04;
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
  }
  .hero-copy>p,.page-hero p{max-width:650px;margin-left:auto;margin-right:auto}
  .hero-actions,.trust-line{justify-content:center}
  .hero-visual{
    width:min(680px,100%);
    min-height:475px!important;
    margin:0 auto;
  }
  .main-dashboard{width:94%;right:1%;top:48px}
  .ad-card{left:0}
  .rank-card{right:0}
  .floating-badge{right:10px}

  /* page hero art */
  .page-hero{padding:60px 0 48px}
  .page-hero-grid{gap:26px}
  .page-orbit{
    width:min(560px,100%);
    height:360px;
    min-height:360px;
    margin:0 auto;
  }

  /* sections */
  .section{padding:70px 0}
  .section-head{margin-bottom:36px}
  .section-head h2,.split-copy h2,.cta-shell h2{
    font-size:clamp(31px,5vw,41px);
  }
  .split{gap:44px}
  .mock-search{min-height:470px;width:min(650px,100%);margin:0 auto}
  .results-shell{gap:20px}

  /* cards/grids */
  .services-grid,.feature-grid,.case-grid,.blog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .stats-grid,.review-platforms,.process{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .cases-row,.problem-solution{grid-template-columns:1fr 1fr!important}
  .service-card{min-height:215px}
  .review-quote{min-width:calc(50% - 9px)!important}

  /* premium visual sections */
  .commerce-showcase{padding:70px 0}
  .commerce-grid{gap:36px}
  .commerce-copy{max-width:720px;margin:0 auto;text-align:center}
  .commerce-copy>p{margin-left:auto;margin-right:auto}
  .commerce-kpis{max-width:560px;margin-left:auto;margin-right:auto}
  .commerce-canvas{width:min(720px,100%);min-height:520px;margin:0 auto}
  .product-creative-grid{gap:42px}
  .product-creative-stage{width:min(680px,100%);margin:0 auto}
  .image-story-grid{gap:24px}
  .service-visual-banner{height:330px}

  /* CTA */
  .cta-shell{gap:30px;padding:38px;border-radius:24px}
  .cta-shell>div{text-align:center}
  .cta-points{justify-content:center}
  .lead-form{max-width:680px;width:100%;margin:0 auto}

  /* Footer */
  .footer-grid{grid-template-columns:1.2fr 1fr!important;gap:34px}
  .footer{padding-top:52px}
}

/* Portrait tablet */
@media(min-width:641px) and (max-width:820px){
  .container{width:min(100% - 34px,760px)}
  .hero{padding-top:52px}
  .hero-copy h1,.page-hero h1{font-size:46px!important}
  .hero-visual{min-height:445px!important}
  .main-dashboard{top:42px;padding:21px}
  .ad-card{width:175px}
  .rank-card{width:155px}
  .commerce-canvas{min-height:485px}
  .commerce-browser{left:15px;right:15px}
  .product-creative-stage{min-height:500px}
  .footer-grid{grid-template-columns:1fr 1fr!important}
}

/* Mobile */
@media(max-width:640px){
  .container{width:min(100% - 28px,var(--max))!important}
  .announcement{font-size:8.5px;padding:5px 12px}
  .nav-wrap{height:62px!important}
  .brand-logo{width:138px!important;max-height:31px!important}
  .menu-btn{width:40px;height:40px;flex-basis:40px}

  .hero{padding:44px 0 42px!important}
  .hero-grid{gap:26px}
  .hero-copy h1,.page-hero h1{
    font-size:clamp(34px,10.4vw,41px)!important;
    line-height:1.06!important;
    letter-spacing:-.045em;
  }
  .hero-copy>p,.page-hero p{font-size:14px!important;line-height:1.65}
  .hero-actions{gap:9px;margin:22px 0 18px}
  .hero-actions .btn{width:100%;min-height:46px}
  .trust-line{font-size:10.5px;align-items:flex-start}
  .avatar-stack{flex:0 0 auto}

  /* Hero dashboard: keep all floating pieces inside viewport */
  .hero-visual{
    min-height:390px!important;
    width:100%;
  }
  .main-dashboard{
    width:100%!important;
    right:0!important;
    top:42px!important;
    padding:15px 15px 13px!important;
    border-radius:18px!important;
    transform:none!important;
  }
  .dash-top strong{font-size:20px}
  .dash-top span{font-size:10px}
  .status-pill{font-size:9px;padding:5px 7px}
  .line-chart{margin-top:4px}
  .dash-axis{font-size:8px}
  .floating-badge{
    right:4px!important;
    top:8px!important;
    padding:8px 10px!important;
    border-radius:12px!important;
  }
  .floating-badge b{font-size:12px}
  .floating-badge small{font-size:7px}
  .ad-card{
    left:0!important;
    bottom:10px!important;
    width:142px!important;
    padding:12px!important;
    border-radius:15px!important;
  }
  .ad-card strong{font-size:22px}
  .ad-card .bars{height:34px}
  .rank-card{
    right:0!important;
    bottom:0!important;
    width:132px!important;
    padding:12px!important;
    border-radius:15px!important;
  }
  .rank-card strong{font-size:28px}
  .rank-card span,.rank-card small{font-size:9px}
  .search-dot{width:30px;height:30px;margin:-27px auto 7px}

  /* marquee */
  .brand-marquee-section{padding:22px 0 26px}
  .brand-marquee-head{margin-bottom:16px}
  .brand-marquee-head p{font-size:9.5px}
  .brand-logo-item{min-width:132px;height:56px;border-radius:13px;padding:0 13px}
  .brand-logo-item img{max-height:40px}
  .brand-logo-item i{width:27px;height:27px}
  .marquee-note{display:none}

  /* general section rhythm */
  .section{padding:58px 0!important}
  .section-head{margin-bottom:28px}
  .section-head h2,.split-copy h2,.cta-shell h2{
    font-size:clamp(28px,8vw,33px)!important;
    line-height:1.1;
  }
  .section-head p,.split-copy p{font-size:12.5px!important}
  .eyebrow{font-size:9px}

  .split{gap:32px}
  .mock-search{min-height:365px!important}
  .orb{
    width:300px!important;height:300px!important;
    left:50%!important;top:20px!important;transform:translateX(-50%)!important;
  }
  .search-window{
    left:5%!important;right:auto!important;width:90%!important;
    top:52px!important;padding:11px!important;border-radius:17px!important;
  }
  .market-searchbar{height:36px;grid-template-columns:22px 1fr auto;gap:5px;padding:0 5px}
  .market-searchbar>div{font-size:7.5px}
  .market-searchbar>b{font-size:7px;padding:5px 6px}
  .market-results-head{margin:10px 1px 7px}
  .market-product-grid{gap:4px}
  .market-product{padding:4px;border-radius:8px}
  .market-product img{height:58px!important}
  .review-card{
    left:3%!important;bottom:5px!important;width:174px!important;
    padding:12px!important;border-radius:15px!important;
  }

  /* grids become true 1-column */
  .services-grid,.feature-grid,.case-grid,.blog-grid,
  .stats-grid,.review-platforms,.process,.cases-row,.problem-solution{
    grid-template-columns:1fr!important;
  }
  .service-card{min-height:0!important;padding:20px}
  .service-icon{margin-bottom:20px}
  .feature-card{min-height:0}
  .review-quote{min-width:100%!important}
  .stat{padding:22px}

  /* result visual */
  .result-visual{min-height:350px!important;padding:16px}
  .result-visual .dashboard-card{left:14px!important;right:14px!important;top:28px!important;padding:17px!important}
  .result-score{right:16px!important;bottom:16px!important;padding:13px 15px!important}
  .result-score strong{font-size:26px}

  /* commerce dashboard */
  .commerce-showcase{padding:56px 0}
  .commerce-copy{text-align:left}
  .commerce-copy h2{font-size:30px}
  .commerce-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .commerce-kpis strong{font-size:18px}
  .commerce-kpis span{font-size:8px}
  .commerce-canvas{min-height:405px!important}
  .commerce-browser{left:0!important;right:0!important;top:32px!important;border-radius:16px}
  .browser-top{height:34px}
  .browser-body{grid-template-columns:34px 1fr!important;min-height:275px!important}
  .browser-side{gap:13px;padding-top:12px}
  .browser-main{padding:14px 10px!important}
  .browser-heading h3{font-size:18px!important}
  .browser-tabs{gap:10px;overflow:hidden}
  .browser-tabs>*{font-size:7px;white-space:nowrap}
  .performance-chart{height:115px!important}
  .browser-bottom{gap:4px}
  .browser-bottom div{padding:7px 5px}
  .browser-bottom strong{font-size:10px}
  .commerce-product-card{width:130px!important;grid-template-columns:39px 1fr!important;padding:7px!important;gap:7px!important}
  .commerce-product-card img{width:39px!important;height:47px!important}
  .commerce-product-card strong{font-size:14px!important}
  .product-one{left:0!important;bottom:5px!important}
  .product-two{right:0!important;bottom:-12px!important}
  .commerce-mini-card{top:3px!important;right:3px!important;padding:9px 11px!important}
  .commerce-mini-card strong{font-size:20px!important}

  /* creative */
  .product-creative-grid{gap:30px}
  .product-creative-stage{min-height:390px!important}
  .product-creative-stage:before{width:300px;height:300px;left:10px}
  .creative-main-photo{left:22px!important;right:18px!important;top:26px!important;bottom:35px!important;border-radius:19px}
  .creative-floating-panel{padding:9px 11px!important}
  .creative-floating-panel strong,.creative-panel-b b{font-size:19px!important}
  .creative-panel-a{left:0!important;bottom:52px!important}
  .creative-panel-b{right:0!important;top:42px!important}
  .creative-swatch{right:5px!important;bottom:7px!important;padding:8px 9px!important}

  /* page hero orbit */
  .page-hero{padding:48px 0 38px!important}
  .page-hero-grid{gap:18px}
  .page-orbit{height:300px!important;min-height:300px!important}
  .orbit-circle{width:220px!important;height:220px!important;right:4px!important;top:25px!important}
  .orbit-card{padding:12px!important;border-radius:15px!important}
  .orbit-card.one{left:0!important;top:58px!important;width:160px!important}
  .orbit-card.two{right:0!important;bottom:18px!important;width:150px!important}
  .orbit-card.three{left:30px!important;bottom:9px!important;width:115px!important}
  .orbit-card strong{font-size:19px!important}

  /* metric strip */
  .metric-strip{margin-top:0!important;padding-top:14px}
  .metric-strip-grid{grid-template-columns:1fr!important;border-radius:18px}
  .metric-strip-grid>div{padding:18px 20px!important}
  .metric-strip-grid>div+div{border-left:0!important;border-top:1px solid #ececec}
  .metric-strip-grid strong{font-size:24px!important}

  /* service visuals / client images */
  .service-media-wrap{padding-top:20px}
  .service-visual-banner{height:245px!important;border-radius:19px}
  .service-visual-label{left:14px;bottom:14px;font-size:9px}
  .client-photo-wide{height:330px!important;border-radius:20px}
  .client-photo-copy{left:20px!important;right:20px!important;bottom:20px!important}
  .client-photo-copy h2{font-size:26px!important}
  .contact-photo{height:205px!important}

  /* forms */
  .cta-shell{padding:26px 18px!important;border-radius:20px!important}
  .cta-shell>div{text-align:left}
  .cta-points{justify-content:flex-start;gap:7px}
  .cta-points span{font-size:9px}
  .form-row{grid-template-columns:1fr!important}
  .lead-form{padding:16px!important;border-radius:16px}
  .lead-form input,.lead-form textarea,.lead-form select{font-size:16px!important} /* prevents iOS zoom */
  .contact-card{padding:20px}
  .contact-grid{gap:22px}

  /* filters */
  .filter-row{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px;scrollbar-width:none}
  .filter-row::-webkit-scrollbar{display:none}
  .filter-chip{flex:0 0 auto}

  /* footer */
  .footer{margin-top:58px;padding-top:45px}
  .footer-grid{grid-template-columns:1fr!important;gap:28px!important}
  .footer-brand p{max-width:100%}
  .footer-bottom{display:block!important;margin-top:34px}
  .footer-bottom span{display:block;margin:5px 0}
  .newsletter form{max-width:100%}
  .footer-logo{width:168px!important}

  /* mobile menu */
  .mobile-panel{
    height:var(--mobile-panel-height,calc(100dvh - 88px))!important;
    max-height:var(--mobile-panel-height,calc(100dvh - 88px))!important;
  }
  .mobile-nav-inner{width:calc(100% - 24px);padding-top:10px}
  .mobile-services-toggle,.mobile-main-link{min-height:49px;font-size:15px!important}
  .mobile-services-list a{min-height:40px!important;font-size:12px!important}
}

/* Small phones */
@media(max-width:420px){
  .container{width:calc(100% - 24px)!important}
  .brand-logo{width:130px!important}
  .hero-copy h1,.page-hero h1{font-size:35px!important}
  .hero-visual{min-height:370px!important}
  .main-dashboard{top:38px!important}
  .ad-card{width:132px!important}
  .rank-card{width:124px!important}
  .commerce-canvas{min-height:390px!important}
  .commerce-product-card{width:122px!important}
  .product-creative-stage{min-height:370px!important}
  .page-orbit{height:282px!important;min-height:282px!important}
  .orbit-circle{width:205px!important;height:205px!important}
}

/* Very small devices */
@media(max-width:360px){
  .container{width:calc(100% - 20px)!important}
  .announcement{font-size:8px}
  .brand-logo{width:122px!important}
  .hero-copy h1,.page-hero h1{font-size:32px!important}
  .hero-copy>p,.page-hero p{font-size:13.5px!important}
  .btn{font-size:12px;padding:12px 15px}
  .hero-visual{min-height:350px!important}
  .ad-card{width:122px!important}
  .rank-card{width:116px!important}
  .commerce-kpis{gap:3px}
  .commerce-kpis>div{padding-right:3px}
  .commerce-canvas{min-height:372px!important}
  .commerce-product-card{width:115px!important}
  .product-creative-stage{min-height:350px!important}
}

/* landscape phone / short viewport */
@media(max-height:620px) and (max-width:980px){
  .mobile-nav-inner{padding-top:8px;padding-bottom:20px}
  .mobile-services-toggle,.mobile-main-link{min-height:44px}
  .mobile-services-list a{min-height:36px!important}
  .mobile-audit-btn{min-height:44px;margin-top:12px!important}
}

/* Touch devices: remove hover-only motion that can stick after taps */
@media(hover:none){
  .service-card:hover,.review-quote:hover,.market-product:hover,.brand-logo-item:hover{
    transform:none!important;
  }
  [data-tilt]{transform:none!important}
}


/* =========================================================
   STRATALX TESTIMONIALS PRO V6
   ========================================================= */
.testimonial-wrap{
  position:relative;
  overflow:visible!important;
  outline:none;
}
.testimonial-wrap:focus-visible{
  outline:2px solid rgba(241,64,254,.75);
  outline-offset:8px;
  border-radius:24px;
}
.testimonial-viewport{
  overflow:hidden;
  width:100%;
  border-radius:22px;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  touch-action:pan-y;
}
.testimonial-viewport:active{cursor:grabbing}
.testimonial-track{
  display:flex;
  gap:18px;
  width:100%;
  will-change:transform;
  transition-property:transform;
  transition-timing-function:cubic-bezier(.22,.61,.36,1);
  transition-duration:520ms;
}
.testimonial-track.is-dragging{cursor:grabbing}
.testimonial-track .review-quote{
  min-width:0!important;
  flex-shrink:0!important;
  height:auto;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
  padding:28px;
  background:
    radial-gradient(circle at 100% 0,rgba(241,64,254,.075),transparent 30%),
    #fff;
}
.testimonial-track .review-quote:before{
  content:"“";
  position:absolute;
  right:20px;
  top:8px;
  font-family:Georgia,serif;
  font-size:76px;
  line-height:1;
  color:rgba(241,64,254,.09);
  pointer-events:none;
}
.testimonial-track .review-quote .stars{
  position:relative;
  z-index:1;
  font-size:12px;
  letter-spacing:2px;
  margin-bottom:13px;
}
.testimonial-track .review-quote p{
  position:relative;
  z-index:1;
  min-height:0!important;
  flex:1;
  margin:0 0 24px;
  font-size:13px;
  line-height:1.72;
  color:#575757;
}
.testimonial-track .review-quote strong{
  position:relative;
  padding-left:41px;
  min-height:32px;
  display:flex!important;
  align-items:center;
  font-size:12.5px;
}
.testimonial-track .review-quote strong:before{
  content:"";
  position:absolute;
  left:0;
  width:31px;
  height:31px;
  border-radius:50%;
  border:1px solid #ffd8ff;
  background:
    radial-gradient(circle at 34% 30%,#fff 0 16%,transparent 17%),
    linear-gradient(145deg,#f140fe,#111);
  box-shadow:0 5px 14px rgba(241,64,254,.14);
}
.testimonial-track .review-quote small{
  padding-left:41px;
  margin-top:-6px;
  font-size:9.5px;
  color:#999;
}
.testimonial-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:24px;
}
.testimonial-dots{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:42px;
}
.testimonial-dot{
  appearance:none;
  width:7px;
  height:7px;
  min-width:7px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#d9d9d9;
  cursor:pointer;
  transition:
    width .3s cubic-bezier(.16,1,.3,1),
    background .25s ease,
    transform .2s ease;
}
.testimonial-dot:hover{transform:scale(1.2);background:#bcbcbc}
.testimonial-dot.active{
  width:28px;
  background:#f140fe;
}
.testimonial-dot:focus-visible{
  outline:2px solid #f140fe;
  outline-offset:4px;
}
.testimonial-footer .slider-controls{
  margin:0!important;
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.testimonial-footer .slider-controls button{
  position:relative;
  width:44px;
  height:44px;
  border:1px solid #dedede;
  border-radius:50%;
  background:#fff;
  color:#111;
  display:grid;
  place-items:center;
  font-size:16px;
  transition:
    transform .24s cubic-bezier(.16,1,.3,1),
    background .2s ease,
    color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}
.testimonial-footer .slider-controls button:hover:not(:disabled){
  transform:translateY(-2px);
  background:#111;
  color:#fff;
  border-color:#111;
  box-shadow:0 9px 20px rgba(0,0,0,.10);
}
.testimonial-footer .slider-controls button:active:not(:disabled){
  transform:translateY(0) scale(.96);
}
.testimonial-footer .slider-controls button:focus-visible{
  outline:2px solid #f140fe;
  outline-offset:3px;
}
.testimonial-footer .slider-controls button:disabled{
  opacity:.32;
  cursor:not-allowed;
}

/* Make testimonial tilt not fight carousel drag. */
.testimonial-track .review-quote[data-tilt]{
  transform:none!important;
}

@media(max-width:980px){
  .testimonial-track{gap:14px}
  .testimonial-track .review-quote{padding:24px}
}

@media(max-width:640px){
  .testimonial-viewport{
    overflow:hidden;
    border-radius:18px;
  }
  .testimonial-track{gap:12px}
  .testimonial-track .review-quote{
    min-width:0!important;
    padding:22px 20px;
    border-radius:18px;
  }
  .testimonial-track .review-quote p{
    font-size:12.5px;
    line-height:1.7;
    margin-bottom:22px;
  }
  .testimonial-footer{margin-top:17px}
  .testimonial-dots{gap:5px;min-height:40px}
  .testimonial-dot.active{width:22px}
  .testimonial-footer .slider-controls button{
    width:40px;
    height:40px;
  }
}

@media(prefers-reduced-motion:reduce){
  .testimonial-track{transition-duration:.001ms!important}
}

/* Mobile menu scroll-position fix: keep the sticky header in its scroll context
   when the navigation is opened after the page has been scrolled. The panel
   itself covers the viewport and contains overscroll, so body locking is not
   needed on mobile. */
@media(max-width:980px){
  body.mobile-nav-active{
    overflow-x:clip;
    overflow-y:visible;
  }
}

/* =========================================================
   Case Studies — document-backed content + detail modal
   ========================================================= */
.case-studies-page .case-hero .page-orbit{min-height:390px}
.case-studies-page .case-library-head{max-width:820px}
.case-studies-page .case-study-grid{align-items:stretch}
.case-studies-page .case-study-card{
  min-height:500px;
  display:flex;
  flex-direction:column;
  padding:24px;
  background:#fff;
  border:1px solid #e9e9e9;
  box-shadow:0 16px 48px rgba(0,0,0,.055);
  transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s ease,border-color .28s ease;
}
.case-studies-page .case-study-card:before{display:none}
.case-studies-page .case-study-card:hover{
  border-color:#e8b8ec;
  box-shadow:0 22px 58px rgba(0,0,0,.085);
}
.case-studies-page .case-study-card .case-thumb{
  height:190px;
  margin:-24px -24px 22px;
  border-bottom:1px solid #ededed;
  background:linear-gradient(145deg,#fff,#fafafa);
  display:grid;
  place-items:center;
}
.case-studies-page .case-study-card .case-thumb:after{display:none}
.case-studies-page .case-study-card .case-thumb img{
  width:100%;height:100%;object-fit:contain;
  padding:14px;
  background:#fff;
}
.case-card-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.case-number,.case-market{
  font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
}
.case-number{color:#d326df}
.case-market{color:#8a8a8a;text-align:right}
.case-studies-page .case-study-card .case-kpi{
  font-size:38px;line-height:1;letter-spacing:-.045em;color:#111;font-weight:850;
  margin:0 0 14px;
}
.case-studies-page .case-study-card .case-kpi small{
  display:block;font-size:10px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:#777;margin-top:7px;font-weight:750;
}
.case-studies-page .case-study-card .case-brand{color:#d026dc}
.case-studies-page .case-study-card h3{font-size:21px;line-height:1.15;margin:9px 0 11px}
.case-studies-page .case-study-card p{font-size:13px;line-height:1.65;margin:0 0 22px;color:#6d6d6d}
.case-open-btn{
  margin-top:auto;align-self:flex-start;border:0;background:none;padding:0;color:#111;
  font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:8px;
}
.case-open-btn span{color:#d026dc;transition:transform .2s ease}
.case-open-btn:hover span{transform:translate(3px,-3px)}
.case-open-btn:focus-visible,.case-modal-close:focus-visible{outline:2px solid #f140fe;outline-offset:4px}

.creative-proof-section{border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0}
.creative-proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:980px;margin:auto}
.creative-proof-card{margin:0;background:#fff;border:1px solid #e8e8e8;border-radius:24px;overflow:hidden;box-shadow:0 16px 42px rgba(0,0,0,.05)}
.creative-proof-card figcaption{padding:16px 20px;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.11em;border-bottom:1px solid #ededed}
.creative-proof-card img{display:block;width:100%;height:460px;object-fit:contain;background:#fff;padding:16px}

body.case-modal-open{overflow:hidden}
.case-modal{
  position:fixed;inset:0;z-index:3000;display:grid;place-items:center;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,visibility .22s ease;
}
.case-modal.is-open{opacity:1;visibility:visible;pointer-events:auto}
.case-modal-backdrop{position:absolute;inset:0;background:rgba(10,10,10,.66);backdrop-filter:blur(8px)}
.case-modal-dialog{
  position:relative;z-index:1;width:min(1180px,calc(100% - 42px));height:min(90vh,900px);
  background:#fff;border-radius:28px;box-shadow:0 34px 100px rgba(0,0,0,.28);overflow:hidden;
  transform:translateY(18px) scale(.985);transition:transform .28s cubic-bezier(.16,1,.3,1);
}
.case-modal.is-open .case-modal-dialog{transform:none}
.case-modal-close{
  position:absolute;right:18px;top:18px;z-index:10;width:44px;height:44px;border-radius:50%;
  border:1px solid #e5e5e5;background:rgba(255,255,255,.94);color:#111;font-size:28px;line-height:1;
  box-shadow:0 8px 26px rgba(0,0,0,.08);
}
.case-modal-close:hover{background:#111;color:#fff;border-color:#111}
.case-modal-scroll{height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.case-detail{padding:0 0 34px}
.case-detail-hero{
  display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end;
  padding:50px 74px 38px 44px;background:radial-gradient(circle at 82% 14%,rgba(241,64,254,.17),transparent 24%),linear-gradient(145deg,#fff,#fbf7fb);
  border-bottom:1px solid #ececec;
}
.case-detail-hero h2{font-size:clamp(34px,4vw,54px);line-height:1;letter-spacing:-.045em;margin:8px 0 13px;max-width:760px}
.case-detail-hero p:last-child{margin:0;color:#6d6d6d;font-size:14px}
.case-detail-highlight{min-width:190px;background:#111;color:#fff;border-radius:20px;padding:18px 20px}
.case-detail-highlight span,.case-detail-highlight small{display:block;color:#bdbdbd;font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.case-detail-highlight strong{display:block;font-size:29px;line-height:1.1;margin:5px 0 7px;letter-spacing:-.035em;color:#fff}
.case-detail-highlight small{color:#f08af6}
.case-detail-meta{display:flex;flex-wrap:wrap;gap:8px;padding:18px 44px;border-bottom:1px solid #ececec;background:#fff}
.case-detail-meta span{font-size:10px;font-weight:750;border:1px solid #e4e4e4;border-radius:999px;padding:7px 10px;color:#5c5c5c;background:#fafafa}
.case-detail-section{padding:36px 44px 0}
.case-detail-section>h3{font-size:25px;line-height:1.2;letter-spacing:-.03em;margin:0 0 18px}
.case-detail-section>ul,.case-strategy-grid ul{margin:0;padding-left:20px}
.case-detail-section li,.case-strategy-grid li{font-size:13.5px;line-height:1.7;color:#5f5f5f;margin:7px 0}
.case-strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.case-strategy-grid>div{border:1px solid #e8e8e8;border-radius:18px;padding:20px;background:#fcfcfc}
.case-strategy-grid>div.wide{grid-column:1/-1}
.case-strategy-grid h4{font-size:15px;margin:0 0 10px;letter-spacing:-.01em}
.case-strategy-grid p{font-size:13.5px;line-height:1.7;color:#5f5f5f;margin:0}
.case-table-wrap{overflow:auto;border:1px solid #e8e8e8;border-radius:18px}
.case-table{border-collapse:collapse;width:100%;min-width:620px;background:#fff;font-size:13px}
.case-table th,.case-table td{text-align:left;padding:13px 15px;border-bottom:1px solid #ececec;white-space:nowrap}
.case-table th{background:#111;color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.case-table tbody tr:last-child td{border-bottom:0}
.case-table tbody tr:nth-child(even){background:#fafafa}
.case-metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.case-metric-grid>div{border:1px solid #e7e7e7;border-radius:16px;padding:16px;background:#fcfcfc}
.case-metric-grid span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#777;font-weight:750}
.case-metric-grid strong{display:block;font-size:20px;line-height:1.2;margin-top:5px;letter-spacing:-.025em}
.case-image-grid{display:grid;gap:14px}
.case-image-grid.two{grid-template-columns:repeat(2,1fr)}
.case-image-grid.three{grid-template-columns:repeat(3,1fr)}
.case-image-grid figure{margin:0;border:1px solid #e8e8e8;border-radius:18px;overflow:hidden;background:#fff}
.case-image-grid img{display:block;width:100%;height:270px;object-fit:contain;background:#fff;padding:10px}
.case-image-grid figcaption{font-size:10px;font-weight:750;color:#666;padding:10px 13px;border-top:1px solid #eeeeee;background:#fafafa}
.case-detail-footer{padding:38px 44px 4px}
.case-detail-footer .btn{font-size:12px}

@media(max-width:980px){
  .case-studies-page .case-study-grid{grid-template-columns:repeat(2,1fr)}
  .case-modal-dialog{width:calc(100% - 28px);height:92vh;border-radius:22px}
  .case-detail-hero{grid-template-columns:1fr;padding:42px 62px 30px 28px;gap:22px}
  .case-detail-highlight{min-width:0;max-width:260px}
  .case-detail-meta,.case-detail-section,.case-detail-footer{padding-left:28px;padding-right:28px}
  .case-metric-grid{grid-template-columns:repeat(3,1fr)}
  .case-image-grid.three{grid-template-columns:1fr 1fr}
  .creative-proof-card img{height:380px}
}

@media(max-width:640px){
  .case-studies-page .case-study-grid{grid-template-columns:1fr}
  .case-studies-page .case-study-card{min-height:0}
  .case-studies-page .case-study-card .case-thumb{height:175px}
  .case-studies-page .case-study-card .case-kpi{font-size:34px}
  .case-studies-page .case-study-card h3{font-size:19px}
  .creative-proof-grid{grid-template-columns:1fr}
  .creative-proof-card img{height:auto;max-height:430px}
  .case-modal{place-items:stretch}
  .case-modal-dialog{width:100%;height:100dvh;border-radius:0}
  .case-modal-close{right:12px;top:12px;width:40px;height:40px}
  .case-detail-hero{padding:54px 18px 25px;gap:18px}
  .case-detail-hero h2{font-size:31px}
  .case-detail-meta{padding:14px 18px}
  .case-detail-section{padding:28px 18px 0}
  .case-detail-footer{padding:30px 18px 4px}
  .case-detail-section>h3{font-size:22px}
  .case-strategy-grid{grid-template-columns:1fr}
  .case-strategy-grid>div.wide{grid-column:auto}
  .case-metric-grid{grid-template-columns:1fr 1fr}
  .case-image-grid.two,.case-image-grid.three{grid-template-columns:1fr}
  .case-image-grid img{height:auto;max-height:330px}
  .case-table{min-width:560px}
}

/* 2026 service content refresh */
.service-tagline{display:inline-block;color:#191919;font-weight:800;line-height:1.35;margin-bottom:7px}
.service-card-tagline{margin-bottom:8px!important;color:#242424!important}
.service-card-tagline strong{font-weight:800}
.feature-card{height:100%}
.feature-card p{line-height:1.65;margin:0}
@media (max-width: 720px){.service-tagline{font-size:.98em}.feature-card p{font-size:12.5px}}

/* Mega menu service overview copy */
.mega-intro .mega-summary{
  max-width:285px;
  margin:0 0 15px;
  color:#6f6f6f;
  font-size:11.5px;
  line-height:1.62;
}
.mega-platforms{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  max-width:285px;
  margin:0 0 17px;
}
.mega-platforms span{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 9px;
  border:1px solid #f2d7f4;
  border-radius:999px;
  background:#fff8ff;
  color:#383838;
  font-size:9.5px;
  font-weight:700;
  line-height:1;
}