/* =====================================================================
   EcomVideoLab homepage (v2). Layout, spacing, radii, shadows and motion follow the
   measured reference spec (desktop 1440px); colors/typefaces are EcomVideoLab's own.
   Everything is scoped to body.v2 so other pages and the admin panel are unaffected.
   ===================================================================== */
body.v2{
  --x-bg:#F5F5F5; --x-ink:#1C1C1C; --x-mute:#6E6E6E; --x-white:#FFFFFF;
  --x-strip:#333333; --x-dark1:#1A1A1A; --x-dark2:#1C1C1C; --x-card:#242424;
  --x-warm:#ff6a45; --x-warm-ink:#d4421c; --x-violet:#9d5cf5; --x-violet-ink:#6b3fd8; --x-cool:#54d6f0;
  --x-grad:linear-gradient(90deg,#ff6a45 0%,#c45bd0 48%,#7a4cf2 100%);
  --x-display:"Archivo",system-ui,sans-serif; --x-body:"Space Grotesk",system-ui,sans-serif;
  /* measured shadows */
  --x-sh-btn:rgba(255,255,255,.15) 0 0 9px 4.64px inset,rgba(0,0,0,.13) 0 .84px .5px -.31px,rgba(0,0,0,.13) 0 1.99px 1.19px -.63px,rgba(0,0,0,.13) 0 3.63px 2.18px -.94px,rgba(0,0,0,.13) 0 6.04px 3.62px -1.25px,rgba(0,0,0,.13) 0 9.75px 5.85px -1.56px,rgba(0,0,0,.13) 0 15.96px 9.57px -1.88px,rgba(0,0,0,.13) 0 27.48px 16.49px -2.19px,rgba(0,0,0,.13) 0 50px 30px -2.5px;
  --x-sh-card:rgba(0,0,0,.13) 0 .84px .5px -.31px,rgba(0,0,0,.13) 0 1.99px 1.19px -.63px,rgba(0,0,0,.13) 0 3.63px 2.18px -.94px,rgba(0,0,0,.13) 0 6.04px 3.62px -1.25px,rgba(0,0,0,.13) 0 9.75px 5.85px -1.56px,rgba(0,0,0,.13) 0 15.96px 9.57px -1.88px,rgba(0,0,0,.13) 0 27.48px 16.49px -2.19px,rgba(0,0,0,.13) 0 50px 30px -2.5px;
  --x-sh-pill:rgba(0,0,0,.04) 0 .71px .42px -.42px,rgba(0,0,0,.04) 0 1.81px 1.08px -.83px,rgba(0,0,0,.04) 0 3.62px 2.17px -1.25px,rgba(0,0,0,.04) 0 6.87px 4.12px -1.67px,rgba(0,0,0,.04) 0 13.65px 8.19px -2.08px,rgba(0,0,0,.04) 0 30px 18px -2.5px;
  --x-ease:cubic-bezier(.2,.9,.25,1);
  background:var(--x-bg);color:var(--x-ink);font-family:var(--x-body);letter-spacing:0;line-height:1.4;
}
html:has(body.v2){scroll-behavior:smooth;scroll-padding-top:90px}
body.v2 .shell{position:static}
body.v2 section{padding:0}
body.v2 h1,body.v2 h2,body.v2 h3{font-family:var(--x-display);line-height:1.05}
body.v2 a{color:inherit}
body.v2 ::selection{background:var(--x-warm);color:#fff}
.v2 .xc{max-width:1200px;margin:0 auto;width:100%}

/* ---------- Text roll-over (nav + buttons): duplicate label slides up 26px in a clipped box ---------- */
.v2 .roll{display:inline-block;height:25.6px;overflow:hidden;vertical-align:top}
.v2 .roll-i{display:flex;flex-direction:column;transition:transform .45s var(--x-ease)}
.v2 .roll-i>span{display:block;height:25.6px;line-height:25.6px;white-space:nowrap}
.v2 a:hover .roll-i,.v2 a:focus-visible .roll-i,.v2 button:hover .roll-i{transform:translateY(-25.6px)}
.v2 .xh-link .roll-i>span+span{color:var(--x-warm-ink)}

/* ---------- Buttons ---------- */
.v2 .xbtn{display:inline-flex;align-items:center;gap:8px;height:49px;padding:12px 20px;border-radius:36px;border:0;cursor:pointer;
  font:600 16px/25.6px var(--x-body);letter-spacing:-.16px;white-space:nowrap;text-decoration:none;transition:transform .3s var(--x-ease)}
.v2 .xbtn-dark{background:var(--x-ink);color:#fff;box-shadow:var(--x-sh-btn)}
.v2 .xbtn-white{background:#fff;color:var(--x-ink)}
.v2 .xbtn:active{transform:scale(.98)}
.v2 .xbtn-ic{width:18px;height:18px;flex:none}
.v2 :focus-visible{outline:2px solid var(--x-violet);outline-offset:3px}
.v2 .xmark{width:24px;height:24px;flex:none;border-radius:50%;background:conic-gradient(from 0deg,var(--x-warm),var(--x-violet),var(--x-cool),var(--x-warm));box-shadow:0 0 14px rgba(157,92,245,.45)}

/* ---------- Header (fixed, 89px, white 30% + blur 46px + vertical fade mask) ---------- */
.v2 header.xh{position:fixed;top:0;left:0;right:0;z-index:60;padding:20px 60px;height:auto;background:none;border:0;backdrop-filter:none}
.v2 header.xh.scrolled{background:none;backdrop-filter:none;border-bottom:0}
.v2 .xh-blur{position:absolute;inset:0;background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(46px);backdrop-filter:blur(46px);
  -webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 45%,#000 100%);mask-image:linear-gradient(0deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 45%,#000 100%);pointer-events:none}
.v2 .xh-in{position:relative;max-width:1200px;height:49px;margin:0 auto;display:flex;align-items:center}
.v2 .xh-logo{flex:0 0 420px;display:flex;align-items:center;gap:10px;font:800 19px/1 var(--x-display);letter-spacing:-.01em;color:var(--x-ink)}
.v2 .xh-logo .xmark{width:30px;height:30px}
.v2 .xh-nav{display:flex;gap:20px;font:600 16px/25.6px var(--x-body);letter-spacing:-.16px;color:var(--x-ink)}
.v2 .xh-cta{margin-left:auto;padding:12px 20px}
.v2 .xh-cta .xmark{width:22px;height:22px}
.v2 .promo-bar{position:relative;z-index:1;margin:-20px -60px 12px;background:var(--x-ink);color:#fff;border:0}
.v2 .promo-bar .promo-x{border-color:rgba(255,255,255,.3)}

/* ---------- Scroll entrances (only for content below the fold at load) ---------- */
.v2 .x-pending{opacity:0;transform:translateY(24px)}
.v2 .x-pending.in{opacity:1;transform:none;transition:opacity .7s ease,transform .8s var(--x-ease)}

/* ---------- A. Hero ---------- */
.v2 .xhero{background:var(--x-bg);padding:calc(113px + var(--promo-h,0px)) 60px 80px}
.v2 .xhero-in{display:flex;justify-content:space-between;align-items:center;min-height:648px}
.v2 .xhero-text{width:651px;max-width:100%}
.v2 .xbadge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:100px;border:1px solid var(--x-warm);background:rgba(255,106,69,.1);
  color:var(--x-warm-ink);font:600 10px/16px var(--x-body);text-transform:uppercase;letter-spacing:.02em}
.v2 .xbadge-dot{width:10px;height:10px;border-radius:50%;background:var(--x-warm);box-shadow:0 0 0 3px rgba(255,106,69,.25);animation:xpulse 2s ease-in-out infinite}
@keyframes xpulse{50%{box-shadow:0 0 0 6px rgba(255,106,69,0)}}
.v2 .xhero-h1{margin:28px 0 0;font:700 57px/57px var(--x-display);letter-spacing:-2.28px;color:var(--x-ink)}
.v2 .xhero-l{display:block}
.v2 .xrot{position:relative;height:75px;overflow:hidden;margin-left:-4px}
.v2 .xrot-w{position:absolute;left:0;top:0;padding:0 14px 0 4px;white-space:nowrap;font:italic 700 68px/68px var(--x-display);letter-spacing:-2.72px;
  background:var(--x-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  transform:translateY(100%);opacity:0;transition:transform .65s var(--x-ease),opacity .5s ease}
.v2 .xrot-w.is-on{transform:none;opacity:1}
.v2 .xrot-w.is-out{transform:translateY(-100%);opacity:0}
.v2 .xhero-sub{margin:12px 0 0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:var(--x-mute);max-width:630px}
.v2 .xhero-btns{display:flex;gap:8px;margin-top:33px;flex-wrap:wrap}
.v2 .xtrust{margin:34px 0 0;font:600 10px/16px var(--x-body);text-transform:uppercase;letter-spacing:.02em;color:#3d3d3d}
.v2 .xtrust-marks{display:flex;margin-top:8px;min-height:36px}
.v2 .xtrust-marks span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;margin-left:-10px;border:2px solid var(--x-bg);
  color:#fff;font:800 11px/1 var(--x-display);letter-spacing:-.02em;box-shadow:0 6px 14px rgba(0,0,0,.18)}
.v2 .xtrust-marks span:first-child{margin-left:0}
.v2 .xhero-media{position:relative;width:370px;height:648px;flex:none}
.v2 .xmedia{position:absolute;inset:0;border-radius:40px;background:#fff;box-shadow:var(--x-sh-card)}
.v2 .xmedia-in{position:absolute;inset:0;border-radius:36px;overflow:hidden;background:#111;cursor:pointer;isolation:isolate}
.v2 .xmedia-stack>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:translateY(-100%);transition:transform .5s cubic-bezier(.22,1,.36,1)}
.v2 .xmedia-stack>.is-on{transform:none;z-index:1}
.v2 .xmedia-stack>.is-out{transform:translateY(100%)}
.v2 .xmedia-in::after{content:"";position:absolute;inset:auto 0 0;height:30%;z-index:2;background:linear-gradient(transparent,rgba(0,0,0,.55));pointer-events:none}
.v2 .xmedia-label{position:absolute;left:16px;bottom:36px;z-index:3;display:flex;align-items:center;gap:10px;color:#fff;font:600 16px/1.2 var(--x-body);text-shadow:0 1px 6px rgba(0,0,0,.4)}
.v2 .xava{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;font:800 11px/1 var(--x-display);color:#fff;border:2px solid rgba(255,255,255,.85)}
.v2 .xfloat{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:6px;height:40px;padding:8px 12px;border-radius:24px;background:#fff;box-shadow:var(--x-sh-pill);
  font:700 16px/24px var(--x-body);color:#4a4a4a;white-space:nowrap}
.v2 .xfloat svg{width:18px;height:18px}
.v2 .xfloat-tl{left:-60px;top:12px}
.v2 .xfloat-br{right:-24px;top:490px}

/* ---------- B. Client strip ---------- */
.v2 .xlogos{background:var(--x-strip);height:100px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.v2 .xlogos-row{height:50px;display:flex;align-items:center;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 12.5%,#000 87.5%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 12.5%,#000 87.5%,rgba(0,0,0,0) 100%)}
.v2 .xlogos-track{display:flex;align-items:center;width:max-content;animation:xmarq var(--dur,60s) linear infinite}
.v2 .xlogos-track span{padding:0 38px;color:#fff;opacity:.92;white-space:nowrap;font:800 20px/1 var(--x-display);letter-spacing:-.02em}
.v2 .xlogos-track span:nth-child(3n+2){font:500 21px/1 var(--x-body);letter-spacing:-.04em}
.v2 .xlogos-track span:nth-child(3n){font:900 17px/1 var(--x-display);text-transform:uppercase;letter-spacing:.08em}
@keyframes xmarq{to{transform:translateX(-50%)}}

/* ---------- C. Services + phones ---------- */
.v2 .xsvc{background:var(--x-bg);padding:55px 0 0;overflow:hidden}
.v2 .xsvc-h{margin:0 auto;max-width:1080px;text-align:center;text-transform:uppercase;font:700 52px/52px var(--x-display);letter-spacing:-.5px;color:#000}
.v2 .xsvc-h span{display:block}
.v2 .xgrad{background:var(--x-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v2 .xsvc-body{max-width:1080px;display:grid;grid-template-columns:360px 1fr;margin-top:101px;padding:0}
.v2 .xsvc-feats{display:flex;flex-direction:column;gap:32px;padding-top:24px;align-items:flex-start}
.v2 .xfeat{display:flex;flex-direction:column;gap:8px;width:360px;padding:20px;text-align:left;border:0;border-radius:20px;background:transparent;cursor:pointer;color:inherit;font:inherit;
  transition:background .45s ease,box-shadow .45s ease}
.v2 .xfeat[aria-selected="true"]{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.75) 55%,rgba(255,106,69,.07) 100%);box-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 30px rgba(0,0,0,.04)}
.v2 .xfeat-t{font:800 28px/33.6px var(--x-display);letter-spacing:-.84px;text-transform:uppercase;color:var(--x-ink)}
.v2 .xfeat-d{font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:var(--x-mute)}
.v2 .xsvc-more{margin:-8px 0 0 20px;font:600 15px/1 var(--x-body);color:var(--x-ink);text-decoration:underline;text-underline-offset:4px}
.v2 .xphones{position:relative;height:664px;
  -webkit-mask-image:linear-gradient(to bottom,#000 70%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,#000 70%,rgba(0,0,0,0) 100%)}
.v2 .xphone{position:absolute;width:354px;height:634px;padding:12px;border-radius:54px;background:#121212;
  box-shadow:inset 0 0 0 2px #3a3a3a,0 0 0 1.5px #c9c9c9,0 2px 0 3px #e9e9e9,0 40px 60px -20px rgba(0,0,0,.28);transition:transform .7s var(--x-ease)}
.v2 .xphone::before{content:"";position:absolute;top:24px;left:50%;width:96px;height:28px;margin-left:-48px;border-radius:20px;background:#000;z-index:2}
.v2 .xphone-screen{position:relative;width:100%;height:100%;border-radius:42px;overflow:hidden;background:#222}
.v2 .xphone-screen>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease}
.v2 .xphone-screen>.is-old{opacity:0}
.v2 .xphone-1{left:88px;top:0;z-index:3;transform:rotate(-6deg)}
.v2 .xphone-2{left:218px;top:19px;z-index:2;transform:rotate(9deg)}
.v2 .xphone-3{left:312px;top:82px;z-index:1;transform:rotate(18deg)}
.v2 .xphones-nav{display:none}
.v2 .xround{width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;background:#6b6b6b;color:#fff;cursor:pointer}
.v2 .xround-dark{background:var(--x-ink)}
.v2 .xround svg{width:22px;height:22px}

/* ---------- D. Showcase + mission ---------- */
.v2 .xshow{background:var(--x-dark1);padding:80px 60px;display:flex;flex-direction:column;gap:98px;color:#fff}
.v2 .xshow-top{display:grid;grid-template-columns:minmax(0,1fr) 439px;align-items:center;gap:61px}
.v2 .xshow-media{position:relative;height:400px}
.v2 .xcol{position:absolute;top:0;bottom:0;width:193px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0%,#000 18%,#000 82%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0%,#000 18%,#000 82%,rgba(0,0,0,0) 100%)}
.v2 .xcol-down{left:130px}.v2 .xcol-up{left:368px}
.v2 .xcol-track{display:flex;flex-direction:column;gap:4px;animation:xcolup var(--dur,40s) linear infinite}
.v2 .xcol-down .xcol-track{animation-name:xcoldown}
.v2 .xcol-track img,.v2 .xcol-track video{display:block;width:193px;height:var(--h,193px);object-fit:cover;background:#2a2a2a}
@keyframes xcolup{to{transform:translateY(-50%)}}
@keyframes xcoldown{from{transform:translateY(-50%)}to{transform:none}}
.v2 .xpill{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:6px;height:40px;padding:8px 12px;border-radius:24px;background:#fff;box-shadow:var(--x-sh-pill);
  font:700 16px/24px var(--x-body);color:var(--x-mute);white-space:nowrap}
.v2 .xpill svg{width:18px;height:18px}
.v2 .xpill-a{left:27px;top:8px}.v2 .xpill-b{left:592px;top:240px}
.v2 .xshow-h{margin:0;font:700 48px/50.4px var(--x-display);letter-spacing:-1.92px;color:#fff}
.v2 .xunder{position:relative;display:inline-block;white-space:nowrap}
.v2 .xunder svg{position:absolute;left:-4%;bottom:-14px;width:108%;height:20px;overflow:visible}
.v2 .xmission{max-width:992px;margin:0 auto;display:grid;grid-template-columns:439px 532px;gap:21px;align-items:center}
.v2 .xmission-h{margin:28px 0 12px;font:700 48px/50.4px var(--x-display);letter-spacing:-1.92px;color:#fff}
.v2 .xmission-text p{margin:0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:#fff}
.v2 .xmission-video{position:relative;width:532px;height:303px;padding:0;border:0;background:#000;cursor:pointer;overflow:hidden;display:block}
.v2 .xmission-media>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v2 .xplay{position:absolute;left:50%;top:50%;width:96px;height:64px;margin:-32px 0 0 -48px;border-radius:14px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(130deg,var(--x-warm),var(--x-violet));box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .35s var(--x-ease)}
.v2 .xplay svg{width:30px;height:30px}
.v2 .xmission-video:hover .xplay{transform:scale(1.06)}
.v2 .xlabel{display:inline-block;padding:7px 16px;border-radius:100px;border:1px solid var(--x-warm-ink);color:var(--x-warm-ink);font:600 11px/16px var(--x-body);text-transform:uppercase;letter-spacing:.02em}
.v2 .xlabel-dark{border-color:var(--x-warm);color:var(--x-warm)}

/* ---------- E. Portfolio ---------- */
.v2 .xwork{background:var(--x-bg);padding:43px 60px 80px}
.v2 .xwork-head{text-align:center}
.v2 .xwork-h{margin:12px auto 0;font:700 29px/30.45px var(--x-display);letter-spacing:-1.16px;color:var(--x-ink)}
.v2 .xgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
.v2 .xv{position:relative;height:560px;border-radius:32px;overflow:hidden;background:#000;box-shadow:var(--x-sh-card);cursor:pointer;isolation:isolate;transition:transform .5s var(--x-ease)}
.v2 .xv:hover{transform:translateY(-4px)}
.v2 .xv>img,.v2 .xv>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v2 .xv::before,.v2 .xv::after{content:"";position:absolute;left:0;right:0;z-index:1;pointer-events:none}
.v2 .xv::before{top:0;height:120px;background:linear-gradient(rgba(0,0,0,.45),transparent)}
.v2 .xv::after{bottom:0;height:140px;background:linear-gradient(transparent,rgba(0,0,0,.6))}
.v2 .xv-top{position:absolute;left:24px;top:22px;right:24px;z-index:2;display:flex;align-items:center;gap:10px;color:#fff;font:600 16px/1.2 var(--x-body);text-shadow:0 1px 6px rgba(0,0,0,.35)}
.v2 .xv-top .xava{width:32px;height:32px}
.v2 .xv-bar{position:absolute;left:16px;right:16px;bottom:22px;z-index:2;display:flex;align-items:center;gap:12px;color:#fff;font:500 13px/1 var(--x-body)}
.v2 .xv-bar svg{width:18px;height:18px;flex:none}
.v2 .xv-bar .sp{flex:1}
.v2 .xv-prog{position:absolute;left:16px;right:16px;bottom:12px;height:3px;border-radius:3px;background:rgba(255,255,255,.35);z-index:2}
.v2 .xv-prog::after{content:"";position:absolute;left:0;top:0;bottom:0;width:7%;border-radius:3px;background:#fff}
.v2 .xv.no-thumb{background:linear-gradient(140deg,#2a2a2a,#151225)}
.v2 .xv-skel{background:linear-gradient(100deg,#e9e9e9 30%,#f3f3f3 50%,#e9e9e9 70%);background-size:300% 100%;animation:shimmer 1.4s ease-in-out infinite;box-shadow:none}
.v2 .xwork-foot{display:flex;justify-content:center;margin-top:48px}

/* ---------- G. Process ---------- */
.v2 .xproc{background:var(--x-dark2);padding:68px 60px;color:#fff}
.v2 .xproc-head,.v2 .xtesti-head{text-align:center}
.v2 .xsec-h{margin:24px auto 12px;max-width:628px;font:700 48px/50.4px var(--x-display);letter-spacing:-1.92px;color:#fff}
.v2 .xtesti-head .xsec-h{max-width:none;margin-top:0}
.v2 .xsec-sub{margin:0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:#cfcfcf}
.v2 .xproc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:49px}
.v2 .xstep{background:var(--x-card);border-radius:32px;padding:24px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.v2 .xstep-n{font-size:10px}
.v2 .xstep h3{margin:0;font:500 22px/30.8px var(--x-body);letter-spacing:-.66px;color:#fff}
.v2 .xstep p{margin:-20px 0 0;font:400 16px/24px var(--x-body);color:#c4c4c4;max-width:544px}
.v2 .xstep-media{width:100%;height:264px;border-radius:24px;background:#1d1d1d;position:relative;overflow:hidden;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
.v2 .xdocs{display:flex;justify-content:center;align-items:center;gap:12px}
.v2 .xdoc{width:221px;height:236px;border-radius:16px;background:#fff;padding:18px 16px;color:var(--x-ink);transform:rotate(-2deg)}
.v2 .xdoc-2{transform:rotate(2deg) translateY(6px)}
.v2 .xdoc b{display:block;font:800 15px/1.2 var(--x-display);margin-bottom:12px}
.v2 .xdoc i{display:block;height:7px;border-radius:4px;background:#e4e4e4;margin:9px 0}
.v2 .xdoc-chip{display:inline-block;margin:6px 0;padding:4px 9px;border-radius:20px;background:rgba(255,106,69,.14);color:var(--x-warm-ink);font:600 11px/1.3 var(--x-body)}
.v2 .xdoc-chip-2{background:rgba(157,92,245,.14);color:var(--x-violet-ink)}
.v2 .xrows{padding:14px;display:flex;flex-direction:column;gap:8px;-webkit-mask-image:linear-gradient(to bottom,#000 55%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,#000 55%,rgba(0,0,0,0) 100%)}
.v2 .xrow{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:63px;padding:8px 8px 8px 24px;border-radius:32px;background:#fff;color:var(--x-ink)}
.v2 .xrow:nth-child(3){background:#cfcfcf}.v2 .xrow:nth-child(4){background:#7a7a7a}
.v2 .xrow b{display:block;font:500 16px/1.4 var(--x-body)}
.v2 .xrow span{display:block;font:700 13px/18.2px var(--x-body);letter-spacing:.52px;text-transform:uppercase;color:#6b4a40}
.v2 .xrow i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font:800 13px/1 var(--x-display);font-style:normal;color:#fff;background:linear-gradient(130deg,var(--x-warm),var(--x-violet))}
.v2 .xchat{padding:0 40px}
.v2 .xchat-track{position:absolute;left:40px;right:40px;bottom:24px;display:flex;flex-direction:column;gap:14px;transition:transform .6s var(--x-ease)}
.v2 .xmsg{display:flex;align-items:center;gap:10px;max-width:240px;padding:10px 14px;border-radius:24px;background:#2c2c2c;font:400 12.5px/1.4 var(--x-body);color:#fff;
  opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .6s var(--x-ease)}
.v2 .xmsg.in{opacity:1;transform:none}
.v2 .xmsg.me{align-self:flex-end}
.v2 .xmsg .xava{width:24px;height:24px;font-size:9px;border-width:1px}
.v2 .xformats{display:flex;justify-content:center;align-items:flex-end;gap:18px;padding:0 24px 40px}
.v2 .xfmt{width:var(--w);height:var(--h);border:2px solid rgba(255,255,255,.85);border-radius:12px;display:grid;place-items:center;font:600 13px/1 var(--x-body);color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.14));transform-origin:bottom;animation:xfmt 4s var(--x-ease) infinite}
.v2 .xfmt:nth-child(2){animation-delay:.25s}.v2 .xfmt:nth-child(3){animation-delay:.5s}.v2 .xfmt:nth-child(4){animation-delay:.75s}
@keyframes xfmt{0%,8%{opacity:.25;transform:scaleY(.35)}30%,85%{opacity:1;transform:none}100%{opacity:.25;transform:scaleY(.35)}}

/* ---------- H. Testimonials ---------- */
.v2 .xtesti{background:var(--x-dark2);padding:72px 0 80px;color:#fff}
.v2 .xtesti[hidden]{display:none}
.v2 .xtesti-rows{display:flex;flex-direction:column;gap:24px;margin-top:56px}
.v2 .xtesti-row{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0),#000 8%,#000 92%,rgba(0,0,0,0));mask-image:linear-gradient(to right,rgba(0,0,0,0),#000 8%,#000 92%,rgba(0,0,0,0))}
.v2 .xtesti-track{display:flex;gap:16px;width:max-content;animation:xmarq var(--dur,60s) linear infinite}
.v2 .xtesti-row.rev .xtesti-track{animation-direction:reverse}
.v2 .xtesti-row.static{justify-content:center;-webkit-mask-image:none;mask-image:none;padding:0 60px}
.v2 .xtesti-row.static .xtesti-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}
.v2 .xtc{flex:none;width:570px;max-width:calc(100vw - 32px);background:var(--x-card);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:18px}
.v2 .xtc-q{font:800 26px/1 var(--x-display);color:#bdbdbd;height:14px}
.v2 .xtc blockquote{margin:0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:#fff;white-space:pre-line;overflow-wrap:anywhere}
.v2 .xtc figcaption{display:flex;align-items:center;gap:12px;font:700 15px/1.3 var(--x-body)}
.v2 .xtc figcaption .xava{width:40px;height:40px;font-size:13px}
.v2 .xtc figcaption small{display:block;font:400 13px/1.3 var(--x-body);color:#a8a8a8}
.v2 .xtc-stars{color:#ffc24a;letter-spacing:2px;font-size:14px}
.v2 .xtesti-foot{display:flex;justify-content:center;margin-top:44px}

/* ---------- J. Closing CTA ---------- */
.v2 .xcta{background:var(--x-dark2);padding:80px 60px 110px;color:#fff;text-align:center}
.v2 .xcta-in{display:flex;flex-direction:column;align-items:center}
.v2 .xbadge-dark{color:var(--x-warm);background:rgba(255,106,69,.08)}
.v2 .xcta-h{margin:32px 0;font:700 68px/68px var(--x-display);letter-spacing:-2.72px;color:#fff}
.v2 .xfan{position:relative;width:892px;max-width:100%;height:540px;margin-top:60px}
.v2 .xfan .xv{position:absolute;width:278px;height:475px;top:23px}
.v2 .xfan .xv:nth-child(1){left:0;z-index:1}
.v2 .xfan .xv:nth-child(2){left:278px;width:336px;height:522px;top:0;z-index:2}
.v2 .xfan .xv:nth-child(3){left:614px;z-index:1}

/* ---------- K. FAQ ---------- */
.v2 .xfaq{position:relative;padding:80px 16px;color:#fff;overflow:hidden;
  background:radial-gradient(40% 52% at 0% 58%,rgba(123,77,255,.42),rgba(123,77,255,0) 72%),radial-gradient(40% 52% at 100% 52%,rgba(255,106,69,.32),rgba(255,106,69,0) 72%),var(--x-dark2)}
.v2 .xfaq-in{max-width:800px;margin:0 auto}
.v2 .xfaq-h{margin:0;text-align:center;font:800 52px/52px var(--x-display);color:#fff}
.v2 .xfaq-sub{margin:28px 0 56px;text-align:center;font:500 16px/1.4 var(--x-body);color:#fff}
.v2 .xq{border-bottom:1px solid rgba(255,255,255,.4)}
.v2 .xq h3{margin:0}
.v2 .xq button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;background:none;border:0;color:#fff;cursor:pointer;text-align:left;
  font:700 24px/33.6px var(--x-display);letter-spacing:-.4px}
.v2 .xq-ic{position:relative;flex:none;width:32px;height:32px;border-radius:50%;background:#fff;transition:background .3s}
.v2 .xq-ic::before,.v2 .xq-ic::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--x-ink);transition:transform .35s var(--x-ease)}
.v2 .xq-ic::after{transform:rotate(90deg)}
.v2 .xq.is-open .xq-ic{background:rgba(255,255,255,.55)}
.v2 .xq.is-open .xq-ic::after{transform:rotate(0)}
.v2 .xq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--x-ease)}
.v2 .xq.is-open .xq-a{grid-template-rows:1fr}
.v2 .xq-a>div{overflow:hidden}
.v2 .xq-a p{margin:0;padding:0 64px 24px 0;font:400 16px/1.45 var(--x-body);color:#fff}
.v2 .xq-a a{text-decoration:underline;text-underline-offset:3px}

/* ---------- L. Footer ---------- */
.v2 footer.xf{background:var(--x-dark2);border-top:1px solid rgba(255,255,255,.85);padding:80px 60px 20px;color:#fff}
.v2 .xf-in{max-width:1200px;margin:0 auto}
.v2 .xf-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.v2 .xf-logo{display:flex;align-items:center;gap:18px;font:800 46px/1 var(--x-display);letter-spacing:-.03em;color:#fff}
.v2 .xf-logo .xmark{width:58px;height:58px}
.v2 .xf-brand p{margin:24px 0 0;max-width:300px;font:400 16px/24px var(--x-body);letter-spacing:-.16px;color:#d1d1d1}
.v2 .xf-cols{display:flex;gap:40px}
.v2 .xf-col a{display:block;margin-bottom:13px;font:600 16px/24px var(--x-body);color:#fff}
.v2 .xf-col a:hover{color:var(--x-warm)}
.v2 .xf-copy{margin:120px 0 0;font:400 16px/24px var(--x-body);color:#d1d1d1}

/* ---------- Tablet ---------- */
@media (max-width:1199px){
  .v2 .xhero{padding:calc(113px + var(--promo-h,0px)) 40px 70px}
  .v2 .xhero-in{gap:40px}
  .v2 .xhero-text{width:auto;flex:1}
  .v2 .xhero-h1{font-size:46px;line-height:46px;letter-spacing:-1.8px}
  .v2 .xrot{height:62px}.v2 .xrot-w{font-size:56px;line-height:56px;letter-spacing:-2.2px}
  .v2 .xhero-media{width:320px;height:560px}
  .v2 .xsvc-body{grid-template-columns:320px 1fr;padding:0 32px}
  .v2 .xfeat{width:320px}
  .v2 .xphones{transform:scale(.82);transform-origin:top left;height:560px}
  .v2 .xshow{padding:72px 40px}
  .v2 .xshow-top{grid-template-columns:minmax(0,1fr);gap:48px}
  .v2 .xshow-h{text-align:center;max-width:620px;margin:0 auto;order:-1}
  .v2 .xshow-media{width:100%;max-width:700px;margin:0 auto}
  .v2 .xmission{grid-template-columns:minmax(0,1fr);max-width:640px;text-align:center}
  .v2 .xmission-video{width:100%;height:auto;aspect-ratio:532/303}
  .v2 .xwork,.v2 .xproc{padding-left:32px;padding-right:32px}
  .v2 .xgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v2 .xfan{transform:scale(.85);transform-origin:top center;height:470px}
}

/* ---------- Mobile (reference: logo-only centred header, stacked centred hero) ---------- */
@media (max-width:809px){
  html:has(body.v2){scroll-padding-top:70px}
  .v2 header.xh{padding:16px 12px}
  .v2 .xh-in{justify-content:center;height:40px}
  .v2 .xh-logo{flex:none;font-size:17px}
  .v2 .xh-logo .xmark{width:26px;height:26px}
  .v2 .xh-nav,.v2 .xh-cta{display:none}
  .v2 .promo-bar{margin:-16px -12px 10px}
  .v2 .xhero{padding:calc(84px + var(--promo-h,0px)) 16px 48px}
  .v2 .xhero-in{flex-direction:column;align-items:center;min-height:0;gap:0}
  .v2 .xhero-text{width:100%;text-align:center;display:flex;flex-direction:column;align-items:center}
  .v2 .xhero-h1{margin-top:14px;font-size:26px;line-height:26px;letter-spacing:-1.04px}
  .v2 .xrot{height:40px;width:100%;margin-left:0}
  .v2 .xrot-w{left:50%;font-size:34px;line-height:38px;letter-spacing:-1.36px;translate:-50% 0}
  .v2 .xhero-sub{font-size:11px;line-height:15.4px;letter-spacing:-.22px;margin-top:6px}
  .v2 .xhero-btns{justify-content:center;margin-top:30px}
  .v2 .xtrust{margin-top:28px}
  .v2 .xtrust-marks{justify-content:center}
  .v2 .xhero-media{width:254px;height:498px;margin-top:22px}
  .v2 .xmedia{border-radius:32px}.v2 .xmedia-in{border-radius:28px}
  .v2 .xfloat{height:36px;font-size:15px;padding:6px 10px}
  .v2 .xfloat-tl{left:-32px;top:6px}
  .v2 .xfloat-br{right:-38px;top:auto;bottom:-14px}
  .v2 .xlogos-track span{padding:0 26px;font-size:18px}
  .v2 .xsvc{padding-top:34px}
  .v2 .xsvc-h{font-size:28px;line-height:28px;padding:0 16px}
  .v2 .xsvc-body{grid-template-columns:minmax(0,1fr);margin-top:40px;padding:0 16px}
  .v2 .xphones{order:-1;width:100%;max-width:390px;height:560px;margin:0 auto;transform:none;-webkit-mask-image:none;mask-image:none}
  .v2 .xphone{width:290px;height:520px;padding:10px;border-radius:46px}
  .v2 .xphone-screen{border-radius:36px}
  .v2 .xphone-1{left:12px}.v2 .xphone-2{left:120px}.v2 .xphone-3{left:190px;top:60px}
  .v2 .xphones-nav{display:flex;gap:12px;justify-content:center;position:absolute;left:0;right:0;bottom:6px;z-index:5}
  .v2 .xsvc-feats{padding:8px 0 40px;gap:0;align-items:stretch}
  .v2 .xfeat{width:100%}
  .v2 .xfeat[aria-selected="false"]{display:none}
  .v2 .xsvc-more{margin:12px 0 0 20px}
  .v2 .xshow{padding:40px 16px 56px;gap:64px}
  .v2 .xshow-h{font-size:34px;line-height:35.7px;letter-spacing:-1.36px}
  .v2 .xshow-media{height:420px}
  .v2 .xcol{width:calc(50% - 6px)}
  .v2 .xcol-down{left:0}.v2 .xcol-up{left:auto;right:0}
  .v2 .xcol-track img,.v2 .xcol-track video{width:100%}
  .v2 .xpill-a{left:0;top:6px}.v2 .xpill-b{left:auto;right:-6px;top:auto;bottom:40px}
  .v2 .xmission-h{font-size:34px;line-height:35.7px;letter-spacing:-1.36px;margin-top:20px}
  .v2 .xmission-text p{text-align:left}
  .v2 .xwork{padding:40px 16px 56px}
  .v2 .xwork-h{font-size:21px;line-height:22.05px;letter-spacing:-.84px}
  .v2 .xgrid{grid-template-columns:1fr;max-width:330px;margin-left:auto;margin-right:auto}
  .v2 .xproc{padding:48px 16px}
  .v2 .xsec-h{font-size:37px;line-height:38.85px;letter-spacing:-1.48px}
  .v2 .xproc-grid{grid-template-columns:minmax(0,1fr)}
  .v2 .xfmt{width:calc(var(--w) * .62);height:calc(var(--h) * .62);font-size:11px}
  .v2 .xdoc{width:min(221px,100%)}
  .v2 .xstep-media{height:auto;min-height:240px}
  .v2 .xdocs{flex-direction:column;padding:20px 0}
  .v2 .xchat{min-height:250px}
  .v2 .xchat,.v2 .xchat-track{padding:0}.v2 .xchat-track{left:16px;right:16px}
  .v2 .xformats{gap:10px;min-height:200px}
  .v2 .xfmt{transform-origin:bottom}
  .v2 .xtesti{padding:56px 0}
  .v2 .xtesti-row.static{padding:0 16px}
  .v2 .xtc{width:86vw}
  .v2 .xcta{padding:56px 16px 72px}
  .v2 .xcta-h{font-size:40px;line-height:42px;letter-spacing:-1.6px}
  .v2 .xfan{width:min(358px,100%);height:380px;margin-top:40px;transform:none}
  .v2 .xfan .xv{width:41.9%;height:300px;top:40px}
  .v2 .xfan .xv:nth-child(1){left:0}
  .v2 .xfan .xv:nth-child(2){left:26.3%;width:47.5%;height:360px;top:0}
  .v2 .xfan .xv:nth-child(3){left:58.1%}
  .v2 .xfan .xv-bar,.v2 .xfan .xv-prog{display:none}
  .v2 .xfaq{padding:56px 16px}
  .v2 .xfaq-h{font-size:34px;line-height:34px}
  .v2 .xfaq-sub{margin:20px 0 32px}
  .v2 .xq button{font-size:20px;line-height:28px}
  .v2 .xq-a p{padding-right:0}
  .v2 footer.xf{padding:40px 12px 20px}
  .v2 .xf-logo{font-size:32px}.v2 .xf-logo .xmark{width:42px;height:42px}
  .v2 .xf-cols{gap:28px;flex-wrap:wrap}
  .v2 .xf-copy{margin-top:48px}
}

@media (prefers-reduced-motion:reduce){
  .v2 .xlogos-track,.v2 .xcol-track,.v2 .xtesti-track,.v2 .xfmt,.v2 .xbadge-dot{animation:none !important}
  .v2 .x-pending{opacity:1;transform:none}
  .v2 .roll-i,.v2 .xphone,.v2 .xmedia-stack>*,.v2 .xrot-w{transition:none !important}
}

.v2 [hidden]{display:none !important}

/* Popups keep the site-wide dark theme on the light homepage */
.v2 .modal{color:#f2f0ec}
.v2 .modal h2,.v2 .modal h3{color:#f2f0ec}