/* ============================================================
   Cuba Infotech — Design System (Light)
   Brand accents: #ff3b00 (flame) · #0396d7 (aqua)
   Supporting palette: amber · indigo · teal · violet · rose
   ============================================================ */

/* ===== Tokens ===== */
:root{
  --bg:#ffffff;
  --bg-2:#f6f9fd;
  --bg-3:#eef3fa;
  --dark:#0a1020;
  --dark-2:#111a2e;

  --ink:#0b1220;
  --body:#57637b;
  --muted:#8b96aa;
  --line:#e7edf6;
  --line-2:#d8e2ef;
  --card:#ffffff;

  --flame:#ff3b00;
  --flame-2:#ff7a2f;
  --aqua:#0396d7;
  --aqua-2:#38c0f5;
  --amber:#ff9f1c;
  --indigo:#4361ee;
  --teal:#06b6a4;
  --violet:#7c5cff;
  --rose:#f43f6e;

  --ac:var(--flame);
  --ac-2:var(--flame-2);
  --ac-soft:rgba(255,59,0,.09);

  --flame-dark:#c92e00;
  --grad:linear-gradient(100deg,#ff3b00 0%,#ff6a1c 55%,#ff9f1c 100%);
  --grad-deep:linear-gradient(100deg,#c92e00 0%,#e0530f 55%,#e08213 100%);
  --grad-cool:linear-gradient(100deg,#0396d7 0%,#38c0f5 100%);

  --r-sm:10px;
  --r:16px;
  --r-lg:22px;
  --r-xl:30px;

  --sh-xs:0 1px 2px rgba(13,26,51,.05);
  --sh-sm:0 4px 14px -6px rgba(13,26,51,.12),0 1px 3px rgba(13,26,51,.05);
  --sh:0 18px 44px -22px rgba(13,26,51,.24),0 2px 8px rgba(13,26,51,.05);
  --sh-lg:0 40px 90px -38px rgba(13,26,51,.35),0 4px 16px rgba(13,26,51,.06);

  --nav-h:80px; --cut:16px; --cut-r:4px; --cut-k:.12; --cut-xxxl: 50px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --sp:clamp(66px,7.4vw,112px);
}

*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--bg);
  color:var(--body);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:16px;
  line-height:1.74;
  letter-spacing:-.005em;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.is-locked{overflow:hidden}

h1,h2,h3,h4,h5,h6{
  font-family:'Sora',system-ui,sans-serif;
  font-weight:700;line-height:1.14;letter-spacing:-.028em;
  color:var(--ink);margin:0 0 .6em;
}
h1{font-size:clamp(2.25rem,5vw,4.1rem);font-weight:800;letter-spacing:-.038em}
h2{font-size:clamp(1.85rem,3.5vw,2.9rem);letter-spacing:-.032em}
h3{font-size:clamp(1.2rem,1.9vw,1.55rem)}
h4{font-size:1.1rem}

p{margin:0 0 1.1em}
a{color:var(--aqua);text-decoration:none;transition:color .3s var(--ease)}
a:hover{color:var(--flame)}
img{max-width:100%;height:auto;display:block}
ul{margin:0;padding:0;list-style:none}
section{position:relative}
strong,b{color:var(--ink);font-weight:600}
::selection{background:rgba(255,59,0,.16);color:var(--ink)}

.container{width:min(1220px,calc(100% - 44px));margin-inline:auto}
.container-wide{width:min(1480px,calc(100% - 44px));margin-inline:auto}
.sec{padding-block:var(--sp)}
.sec-sm{padding-block:clamp(52px,6vw,88px)}
.sec-tint{background:var(--bg-2)}
.sec-tint::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(900px 400px at 12% 0%,rgba(255,59,0,.028),transparent 72%),radial-gradient(900px 400px at 88% 100%,rgba(3,150,215,.032),transparent 72%)}
.sec-tint>*{position:relative}
.lead{font-size:clamp(1.03rem,1.3vw,1.15rem);color:var(--body);line-height:1.72}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace}
.grad-txt{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ===== Accent rotation across grids ===== */
.row>[class*="col-"]:nth-child(7n+1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.row>[class*="col-"]:nth-child(7n+2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.row>[class*="col-"]:nth-child(7n+3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.row>[class*="col-"]:nth-child(7n+4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.row>[class*="col-"]:nth-child(7n+5){--ac:#ff9f1c;--ac-2:#ffbe5c;--ac-soft:rgba(255,159,28,.13)}
.row>[class*="col-"]:nth-child(7n+6){--ac:#4361ee;--ac-2:#7089ff;--ac-soft:rgba(67,97,238,.1)}
.row>[class*="col-"]:nth-child(7n+7){--ac:#f43f6e;--ac-2:#ff7396;--ac-soft:rgba(244,63,110,.1)}

/* ===== Scrollbar (hidden, scroll still works) ===== */
html{scrollbar-width:none;-ms-overflow-style:none}
::-webkit-scrollbar{width:0;height:0;display:none}

/* ===== Ambient background ===== */
.bg-fx{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.bg-fx .aurora{position:absolute;border-radius:50%;filter:blur(120px);animation:drift 30s var(--ease) infinite alternate}
.aurora.a1{width:44vw;height:44vw;background:radial-gradient(circle,rgba(255,110,40,.16),transparent 66%);top:-16vw;left:-12vw}
.aurora.a2{width:40vw;height:40vw;background:radial-gradient(circle,rgba(3,150,215,.15),transparent 66%);top:10vh;right:-14vw;animation-delay:-10s}
.aurora.a3{width:36vw;height:36vw;background:radial-gradient(circle,rgba(124,92,255,.1),transparent 70%);bottom:-14vw;left:32vw;animation-delay:-18s}
@keyframes drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(5vw,-4vh,0) scale(1.14)}100%{transform:translate3d(-4vw,5vh,0) scale(.92)}}
.bg-grid{
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(11,18,32,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(11,18,32,.035) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 55% at 50% 0%,#000 10%,transparent 76%);
  -webkit-mask-image:radial-gradient(ellipse 80% 55% at 50% 0%,#000 10%,transparent 76%);
}
.bg-noise{display:none}

.sprk{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.has-sprk{position:relative}
.has-sprk>.container{position:relative;z-index:1}

/* ===== Preloader ===== */
#preloader{
  position:fixed;inset:0;z-index:9999;overflow:hidden;cursor:none;
  display:grid;place-items:center;
  background-color:#0a1424;
  background-image:
    /* radial-gradient(70% 60% at 8% 104%,rgba(3,150,215,.24),transparent 62%), */
    /* radial-gradient(60% 55% at 96% -6%,rgba(56,192,245,.16),transparent 60%), */
    /* radial-gradient(58% 52% at 64% 102%,rgba(124,92,255,.14),transparent 64%), */
    /* radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px), */
    /* linear-gradient(160deg,#111e36,#0a1424 58%,#070f1d), */
    radial-gradient(780px 470px at 10% 8%, rgba(3, 150, 215, .24), transparent 64%),
    radial-gradient(840px 490px at 88% 78%, rgba(56, 192, 245, .16), transparent 64%),
    radial-gradient(620px 350px at 62% 4%, rgba(124, 92, 255, .14), transparent 66%),
    radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px);
  background-size:auto,auto,auto,22px 22px,auto;
  transition:opacity .45s var(--ease),visibility .45s;  
}
#preloader.done{opacity:0;visibility:hidden}
#preloader ~ .cur-dot,#preloader ~ .cur-ring{opacity:0}

.pl-logo{
  height:60px;width:auto;margin-bottom:clamp(30px,4.5vh,46px);
  filter:drop-shadow(0 6px 18px rgba(255,59,0,.28));
}

.pl-inner{position:relative;display:grid;justify-items:center;text-align:center}
.pl-inner::before{
  content:'';position:absolute;z-index:-1;pointer-events:none;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(1040px,150vw);height:min(790px,124vh);border-radius:50%;
  background:
    radial-gradient(closest-side at 64% 98%,rgba(124,92,255,.11),transparent 62%),
    radial-gradient(closest-side,rgba(9,21,44,.62),rgba(9,21,44,.28) 54%,transparent 82%);
  backdrop-filter:blur(12px) saturate(135%);
  -webkit-backdrop-filter:blur(12px) saturate(135%);
  -webkit-mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.5) 66%,transparent 88%);
  mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.5) 66%,transparent 88%);
}

.pl-tag{
  display:flex;align-items:center;gap:14px;margin:0;
  font-family:'Sora',sans-serif;font-size:1.02rem;text-transform:uppercase;
  letter-spacing:.01em;color:#fff;
}
.pl-tag i{
  font-size:.86rem;color:var(--flame-2);
  animation:plStar 2.4s var(--ease) infinite;
}
.pl-tag i:nth-of-type(2){animation-delay:.4s}
@keyframes plStar{0%,100%{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}

.pl-rule{
  position:relative;overflow:hidden;
  width:clamp(200px,24vw,300px);height:1px;margin:28px 0 26px;
  background:rgba(255,255,255,.13);
}
.pl-rule::after{
  content:'';position:absolute;top:0;left:0;height:100%;width:32%;
  background:linear-gradient(90deg,transparent,var(--flame) 40%,var(--flame-2) 70%,transparent);
  animation:plShuttle 1.15s var(--ease) infinite;
}
@keyframes plShuttle{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(320%)}
}

.pl-line{
  margin:0;font-family:'Sora',sans-serif;font-size:1.3rem;font-weight:700;
  line-height:1.32;letter-spacing:-.015em;color:#fff;
}
.pl-line em{
  font-style:normal;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}

.pl-icons{display:flex;gap:18px;margin-top:32px}
.pl-icons img{
  width:46px;height:46px;display:block;
  filter:brightness(0) invert(1);
  opacity:0;animation:plIcon .7s var(--ease-out) forwards;
}
.pl-icons img:nth-child(1){animation-delay:.10s}
.pl-icons img:nth-child(2){animation-delay:.22s}
.pl-icons img:nth-child(3){animation-delay:.34s}
.pl-icons img:nth-child(4){animation-delay:.46s}
@keyframes plIcon{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media (max-width:575px){
  .pl-tag{font-size:.88rem;gap:10px}
  .pl-line{font-size:1.1rem}
  .pl-logo{height:48px;margin-bottom:26px}
  .pl-icons{gap:13px;margin-top:26px}
  .pl-icons img{width:40px;height:40px}
}

/* ===== Cursor ===== */
.cur-dot{
  position:fixed;top:0;left:0;width:8px;height:8px;border-radius:50%;
  background:var(--flame);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);will-change:transform;
  transition:width .2s ease,height .2s ease,background .2s ease,opacity .3s ease;
  --shadow-op:0;--shadow-rot:0deg;--shadow-dist:0px;--shadow-scale:1;
}
.cur-dot.hover{width:11px;height:11px;background:var(--flame-dark)}
.cur-dot.hover::after{background:var(--flame-dark)}
.cur-dot::after{
  content:'';position:absolute;top:50%;left:50%;width:7px;height:7px;border-radius:50%;
  background:var(--flame);filter:blur(2.5px);opacity:var(--shadow-op);
  transform:translate(-50%,-50%) rotate(var(--shadow-rot)) translateX(var(--shadow-dist)) scaleX(var(--shadow-scale));
  pointer-events:none;z-index:-1;
}
.cur-ring{
  position:fixed;top:0;left:0;width:35px;height:35px;border-radius:50%;
  border:1.5px solid var(--flame);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);will-change:transform;
  transition:width .2s ease,height .2s ease,border-color .2s ease,opacity .3s ease;
}
.cur-ring.hover{width:38px;height:38px;border-color:var(--flame-dark)}
@media (hover:none),(max-width:991px){.cur-dot,.cur-ring{display:none}}

/* ===== Scroll progress ===== */
.scroll-bar{position:fixed;top:0;left:0;height:3px;width:0;z-index:1200;background:var(--grad)}

/* ===== Page transition ===== */
.curtain{
  position:fixed;inset:0;z-index:9990;pointer-events:none;
  display:grid;place-items:center;
  background-color:#0a1424;
  background-image:
    /* radial-gradient(70% 60% at 8% 104%,rgba(3,150,215,.24),transparent 62%),
    radial-gradient(60% 55% at 96% -6%,rgba(56,192,245,.16),transparent 60%),
    radial-gradient(58% 52% at 64% 102%,rgba(124,92,255,.14),transparent 64%),
    radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px),
    linear-gradient(160deg,#111e36,#0a1424 58%,#070f1d); */
    radial-gradient(780px 470px at 10% 8%, rgba(3, 150, 215, .24), transparent 64%),
    radial-gradient(840px 490px at 88% 78%, rgba(56, 192, 245, .16), transparent 64%),
    radial-gradient(620px 350px at 62% 4%, rgba(124, 92, 255, .14), transparent 66%),
    radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px);
  background-size:auto,auto,auto,22px 22px,auto;
  opacity:0;visibility:hidden;
  transition:opacity .34s var(--ease),visibility .34s;
}
.curtain.in{opacity:1;visibility:visible}
.curtain.out{opacity:0;visibility:hidden}
.curtain .pl-inner{opacity:0;transform:translateY(6px);transition:opacity .3s var(--ease) .06s,transform .4s var(--ease-out) .06s}
.curtain.in .pl-inner{opacity:1;transform:none}


/* ===== Navbar ===== */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1160;height:var(--nav-h);display:flex;align-items:center;
  transition:background .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.stuck{
  background:#fff;
  border-bottom-color:var(--line);box-shadow:0 6px 28px -18px rgba(13,26,51,.3);
}
.nav .container{display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand img{height:60px;width:auto}

.nav-menu{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav-menu>li{position:relative}
.nav-link{display:block;padding:9px 14px 11px;font-size:.9rem;font-weight:500;color:var(--body);position:relative;white-space:nowrap;transition:color .3s var(--ease)}
.nav-link::after{
  content:'';position:absolute;left:14px;right:14px;bottom:4px;height:1.5px;border-radius:1.5px;
  background:var(--flame);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--ease-out);
  will-change:transform;
  backface-visibility:hidden;
}
.nav-link:hover::after,.nav-link.active::after{transform:scaleX(1);transform-origin:left}
.nav-link:hover,.nav-link.active{color:var(--ink)}
.nav-link.active{color:var(--flame)}
.has-sub>.nav-link{padding-right:25px}
.has-sub>.nav-link::before{content:'';position:absolute;right:11px;top:50%;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg) translateZ(0);opacity:.6;transition:transform .3s var(--ease);backface-visibility:hidden}
.has-sub:hover>.nav-link::before{transform:translateY(-30%) rotate(225deg) translateZ(0)}

.sub{
  position:absolute;top:calc(100% + 10px);left:0;min-width:266px;padding:9px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-lg);
  opacity:0;visibility:hidden;transform:translateY(12px) scale(.98);transform-origin:top left;
  transition:opacity .32s var(--ease),transform .32s var(--ease-out),visibility .32s;
}
.has-sub:hover>.sub{opacity:1;visibility:visible;transform:none}
.sub a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;font-size:.87rem;font-weight:500;color:var(--body);transition:background .3s,color .3s}
.sub a i{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:var(--bg-2);color:var(--aqua);font-size:.92rem;flex-shrink:0;transition:background .3s,color .3s}
.sub a:hover{background:var(--bg-2);color:var(--ink)}
.sub a:hover i{background:var(--grad);color:#fff}

.nav-cta{display:flex;align-items:center;gap:12px;flex-shrink:0}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line-2);border-radius:12px;background:#fff;cursor:pointer;padding:0;place-items:center}
.burger i{display:block;width:18px;height:1.8px;background:var(--ink);border-radius:2px;position:relative;transition:background .3s}
.burger i::before,.burger i::after{content:'';position:absolute;left:0;width:18px;height:1.8px;background:var(--ink);border-radius:2px;transition:transform .4s var(--ease-out)}
.burger i::before{top:-6px}
.burger i::after{top:6px}
.burger.open i{background:transparent}
.burger.open i::before{transform:translateY(6px) rotate(45deg)}
.burger.open i::after{transform:translateY(-6px) rotate(-45deg)}

/* ===== Mobile drawer ===== */
.drawer-scrim{
  position:fixed;inset:0;z-index:1140;background:rgba(11,18,32,.5);
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s;
}
.drawer-scrim.on{opacity:1;visibility:visible}
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:1150;
  width:min(360px,80vw);
  background:#fff;border-left:1px solid var(--line);
  padding:calc(var(--nav-h) + 26px) 24px 34px;
  overflow-y:auto;overscroll-behavior:contain;
  transform:translateX(102%);
  box-shadow:-24px 0 60px -34px rgba(13,26,51,.6);
  transition:transform .55s var(--ease-out);
}
.drawer.open{transform:none}
body.is-locked .nav{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 2px 14px -10px rgba(13,26,51,.4)}
body.hero-dark.is-locked .nav .burger,
body.is-locked .nav .burger{background:#fff;border-color:var(--line-2)}
body.hero-dark.is-locked .nav:not(.stuck) .burger i,
body.hero-dark.is-locked .nav:not(.stuck) .burger i::before,
body.hero-dark.is-locked .nav:not(.stuck) .burger i::after,
body.is-locked .nav .burger i,
body.is-locked .nav .burger i::before,
body.is-locked .nav .burger i::after{background:var(--ink)}
body.hero-dark.is-locked .nav:not(.stuck) .burger.open i,
body.is-locked .nav .burger.open i{background:transparent}
.drawer ul{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.drawer>ul>li{opacity:0;transform:translateX(16px);transition:opacity .5s var(--ease),transform .5s var(--ease-out)}
.drawer.open>ul>li{opacity:1;transform:none;transition-delay:calc(.12s + var(--i,0)*.045s)}
.drawer a{
  display:block;padding:15px 2px;
  font-family:'Sora',sans-serif;font-size:1.02rem;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--line);transition:color .3s var(--ease)
}
.drawer a:hover{color:var(--flame)}
.drawer .sub-m{padding-left:14px;margin-bottom:6px;display:none}
.drawer .sub-m.show{display:flex}
.drawer .sub-m a{font-size:.9rem;font-weight:500;color:var(--body);padding:11px 2px}
.drawer .m-toggle{display:flex;align-items:center;justify-content:space-between}
.drawer .m-toggle span{
  width:22px;height:22px;display:grid;place-items:center;border-radius:50%;
  background:rgba(255,59,0,.1);color:var(--flame);
  font-size:1rem;line-height:1;transition:transform .35s var(--ease)
}
.drawer .m-toggle.on span{transform:rotate(135deg)}
.drawer-foot{margin-top:28px;display:flex;flex-direction:column;gap:12px}
.drawer-foot{align-items:flex-start}
.drawer-foot .btn-sq,.drawer-foot .btn-sq-alt{
  display:inline-flex;width:auto;padding:0;border-bottom:0;font-size:.89rem;
}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 27px;border:1px solid transparent;border-radius:var(--cut) var(--cut-r) var(--cut-r) var(--cut-r);corner-shape:superellipse(var(--cut-k)) round round round;cursor:pointer;
  font-family:'Sora',sans-serif;font-size:.9rem;font-weight:600;
  color:#fff;background:var(--grad);position:relative;overflow:hidden;isolation:isolate;
  box-shadow:0 10px 26px -12px rgba(255,59,0,.55);
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease),color .3s;
  will-change:transform;
}
.btn::after{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--grad-cool);opacity:0;transition:opacity .45s var(--ease)}
.btn:hover{color:#fff;box-shadow:0 16px 36px -14px rgba(3,150,215,.6)}
.btn:hover::after{opacity:1}
.btn:active{transform:scale(.975)}
.btn i{transition:transform .4s var(--ease-out)}
.btn:hover i{transform:translateX(3px)}

.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line-2);box-shadow:var(--sh-xs)}
.btn-ghost::after{background:var(--grad)}
.btn-ghost:hover{color:#fff;border-color:transparent;box-shadow:0 16px 36px -16px rgba(13,26,51,.4)}
.btn-dark{background:var(--dark);box-shadow:0 12px 30px -14px rgba(10,16,32,.6)}
.btn-dark::after{background:var(--grad)}
.btn-sm{padding:10px 19px;font-size:.82rem}
.btn-lg{padding:17px 34px;font-size:.96rem}
.btn-block{width:100%}

.btn-txt{display:inline-flex;align-items:center;gap:8px;font-family:'Sora',sans-serif;font-size:.87rem;font-weight:600;color:var(--ac);position:relative}
.btn-txt i{transition:transform .4s var(--ease-out)}
.btn-txt::after{content:'';position:absolute;left:0;bottom:-3px;height:1.5px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out);will-change:transform;backface-visibility:hidden}
.btn-txt:hover{color:var(--ac)}
.btn-txt:hover::after{transform:scaleX(1);transform-origin:left}
.btn-txt:hover i{transform:translate(4px,-4px)}

/* ===== Eyebrow / section head ===== */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;padding:6px 15px 6px 11px;margin-bottom:20px;
  border:1px solid var(--line-2);border-radius:99px;background:#fff;box-shadow:var(--sh-xs);
  font-family:'JetBrains Mono',monospace;font-size:.69rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--body);
}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--flame);box-shadow:0 0 0 0 rgba(255,59,0,.5);animation:ping 2.2s var(--ease) infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(255,59,0,.5)}70%{box-shadow:0 0 0 11px rgba(255,59,0,0)}100%{box-shadow:0 0 0 0 rgba(255,59,0,0)}}

.sec-head{max-width:750px;margin-bottom:clamp(40px,4.6vw,64px)}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head p{font-size:1.04rem;margin-bottom:0}

/* ===== Reveal engine ===== */
[data-reveal]{opacity:0;will-change:transform,opacity,filter,clip-path;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out),filter .9s var(--ease-out),clip-path 1.05s var(--ease-out);transition-delay:var(--d,0s)}
[data-reveal="up"]{transform:translateY(40px)}
[data-reveal="down"]{transform:translateY(-34px)}
[data-reveal="left"]{transform:translateX(-46px)}
[data-reveal="right"]{transform:translateX(46px)}
[data-reveal="zoom"]{transform:scale(.9)}
[data-reveal="blur"]{filter:blur(14px);transform:translateY(20px)}
[data-reveal="flip"]{transform:perspective(1200px) rotateX(-24deg) translateY(34px);transform-origin:top}
[data-reveal="tiltin"]{transform:perspective(1400px) rotateY(-14deg) translateX(40px);transform-origin:right}
[data-reveal="clip-x"]{opacity:1;clip-path:inset(0 100% 0 0)}
[data-reveal="mask"]{opacity:1;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}
[data-reveal].seen{opacity:1;transform:none;filter:none}
[data-reveal="clip-x"].seen{clip-path:inset(0 0 0 0)}
[data-reveal="mask"].seen{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
[data-reveal].clipped{clip-path:none}

.split-char{display:inline-block;opacity:0;transform:translateY(60%);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.split-char.seen{opacity:1;transform:none}

/* ===== Hero ===== */
.hero{position:relative;display:flex;align-items:center;padding:calc(var(--nav-h) + 46px) 0 clamp(50px,5.5vw,76px);overflow:hidden}

/* ===== Dark hero ===== */
.hero-dark .hero{background:var(--dark);color:rgba(255,255,255,.72)}
.hero-dark .hero::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(780px 470px at 10% 8%,rgba(3,150,215,.24),transparent 64%),
    radial-gradient(840px 490px at 88% 78%,rgba(56,192,245,.16),transparent 64%),
    radial-gradient(620px 350px at 62% 4%,rgba(124,92,255,.14),transparent 66%);
}
.hero-dark .hero .lead{color:rgba(255,255,255,.72)}
.hero-dark .hero .eyebrow{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.82);box-shadow:none}
.hero-dark .orbit{border-color:rgba(255,255,255,.13)}
.hero-dark .scroll-cue{color:rgba(255,255,255,.45)}
.hero-dark .scroll-cue .rail{background:rgba(255,255,255,.16)}
.hero-dark .hero .btn-sq-alt{background:transparent;color:#fff;box-shadow:none}
.hero-dark .hero .btn-sq-alt::after{border-color:rgba(255,255,255,.3)}
.hero-dark .hero .btn-sq-alt::before{background:rgba(255,255,255,.14)}
.hero-dark .hero .btn-sq-alt .btn-sq-ico{background:transparent;border-right-color:rgba(255,255,255,.2);color:#fff}
.hero-dark .hero .btn-sq-alt:hover{color:#fff;box-shadow:none}
.hero-dark .hero .btn-sq-alt:hover::after{border-color:#fff}
.hero-dark .hero .btn-sq-alt:hover .btn-sq-ico{background:#fff;color:var(--ink);border-right-color:transparent}

.hero-dark .nav:not(.stuck) .nav-link{color:rgba(255,255,255,.74)}
.hero-dark .nav:not(.stuck) .nav-link:hover{color:#fff}
.hero-dark .nav:not(.stuck) .nav-link.active{color:var(--flame-2)}
.hero-dark .nav:not(.stuck) .burger{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.hero-dark .nav:not(.stuck) .burger i,
.hero-dark .nav:not(.stuck) .burger i::before,
.hero-dark .nav:not(.stuck) .burger i::after{background:#fff}
#heroCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.5}
.hero .container{position:relative;z-index:2}
.hero-spot{position:absolute;width:560px;height:560px;border-radius:50%;z-index:1;pointer-events:none;background:radial-gradient(circle,rgba(3,150,215,.14),transparent 62%);transform:translate(-50%,-50%);filter:blur(16px)}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:58px;align-items:center}
.hero h1{margin-bottom:22px}

.type-h1{display:grid;align-items:start}
.type-live,.type-src{grid-area:1/1}
.type-src{visibility:hidden;pointer-events:none}
.type-src::after{content:'';display:inline-block;width:11px}
.type-out{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

.hero-eb{display:grid;justify-items:start;margin-bottom:22px}
.eb-live,.eb-src{
  grid-area:1/1;display:inline-flex;align-items:center;gap:10px;
  padding:7px 17px 7px 13px;border-radius:99px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.17);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  font-family:'JetBrains Mono',monospace;font-size:.68rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.92);white-space:nowrap;
}
.eb-src{visibility:hidden;pointer-events:none}
.eb-live::before,.eb-src::before{content:'';width:6px;height:6px;border-radius:50%;flex-shrink:0}
.eb-live::before{background:var(--flame);box-shadow:0 0 0 0 rgba(255,59,0,.6);animation:ping 2.2s var(--ease) infinite}
.eb-live{transition:opacity .4s var(--ease),transform .5s var(--ease-out)}
.eb-live.out{opacity:0;transform:translateY(-10px)}

.hero-copy{display:grid;margin:26px 0 0}
.hc-live,.hc-src{grid-area:1/1}
.hc-src{visibility:hidden;pointer-events:none}
.hc-live{transition:opacity .4s var(--ease),transform .5s var(--ease-out)}
.hc-live.out{opacity:0;transform:translateY(14px)}
.hero-desc{font-size:clamp(1.02rem,1.3vw,1.12rem);line-height:1.72;color:rgba(255,255,255,.7);margin:0;max-width:56ch}
.caret{
  display:inline-block;width:2px;height:.86em;margin-left:7px;vertical-align:-.06em;
  border-radius:2px;background:#fff;
  animation:caretBlink 1s steps(1) infinite;
}
@keyframes caretBlink{0%,49%{opacity:1}50%,100%{opacity:0}}

.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:32px}

.hero-vis{position:relative;perspective:1700px}
.hero-float{
  position:absolute;z-index:3;display:flex;align-items:center;gap:11px;padding:12px 16px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid var(--line);border-radius:15px;box-shadow:var(--sh);
  font-size:.79rem;font-weight:600;color:var(--ink);white-space:nowrap;
  animation:bob 5.5s var(--ease) infinite;
}
.hero-float i{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--grad);font-size:.98rem;color:#fff;flex-shrink:0}
.hero-float:nth-of-type(2) i{background:var(--grad-cool)}
.hero-float:nth-of-type(3) i{background:linear-gradient(100deg,#06b6a4,#2fd3c2)}
.hero-float small{display:block;font-size:.68rem;color:var(--muted);font-weight:400}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}

.orbit{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1px dashed var(--line-2);border-radius:50%;pointer-events:none}
.orbit.o1{width:112%;aspect-ratio:1;animation:spin 38s linear infinite}
.orbit.o2{width:134%;aspect-ratio:1;animation:spin 58s linear infinite reverse}
.orbit::before{content:'';position:absolute;top:-4px;left:50%;width:9px;height:9px;border-radius:50%;background:var(--flame);box-shadow:0 0 0 5px rgba(255,59,0,.14)}
.orbit.o2::before{background:var(--aqua);box-shadow:0 0 0 5px rgba(3,150,215,.14)}
@keyframes spin{to{transform:rotate(360deg)}}

.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;display:grid;justify-items:center;gap:9px;font-family:'JetBrains Mono',monospace;font-size:.63rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.scroll-cue .rail{width:1.5px;height:48px;background:var(--line-2);position:relative;overflow:hidden;border-radius:2px}
.scroll-cue .rail::after{content:'';position:absolute;top:-100%;left:0;width:100%;height:100%;background:var(--grad);animation:railRun 2s var(--ease) infinite}
@keyframes railRun{0%{top:-100%}60%,100%{top:100%}}

/* ===== Browser frame ===== */
.browser{border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-lg);transform:rotateY(-9deg) rotateX(4deg);transform-style:preserve-3d;transition:transform .9s var(--ease-out)}
.hero-vis:hover .browser{transform:rotateY(-3deg) rotateX(1deg)}
.browser-bar{display:flex;align-items:center;gap:7px;padding:11px 15px;background:var(--bg-2);border-bottom:1px solid var(--line)}
.browser-bar em{width:10px;height:10px;border-radius:50%;background:#ff5f57}
.browser-bar em:nth-child(2){background:#febc2e}
.browser-bar em:nth-child(3){background:#28c840}
.browser-bar span{flex:1;margin-left:10px;height:22px;border-radius:99px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;padding:0 12px;font-size:.66rem;color:var(--muted);font-family:'JetBrains Mono',monospace}
.browser img{width:100%;display:block}

/* ===== Page hero (inner) ===== */
.phero{padding:calc(var(--nav-h) + 76px) 0 clamp(50px,6vw,84px);text-align:center;overflow:hidden}
.phero h1{font-size:clamp(2.05rem,4.4vw,3.5rem);margin-bottom:16px}
.phero p{max-width:660px;margin-inline:auto}
.crumb{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:26px;font-size:.82rem;color:var(--muted)}
.crumb a{color:var(--body)}
.crumb span{color:var(--flame);font-weight:500}
.phero-ring{position:absolute;top:-46%;left:50%;transform:translateX(-50%);width:min(860px,120vw);aspect-ratio:1;border-radius:50%;border:1px solid var(--line);pointer-events:none}
.phero-ring::after{content:'';position:absolute;inset:11%;border-radius:50%;border:1px solid var(--line)}

.phero-x{display:block}
.phero-x h1{max-width:19ch;margin-inline:auto}
.phero-x .lead{max-width:660px;margin-inline:auto}
.phero-x .hero-actions{justify-content:center;margin-top:34px}
.phero-x .hero-std{max-width:660px;margin-inline:auto;justify-content:center}
.hero-dark .phero{background:var(--dark)}
.hero-dark .phero h1{color:#fff}
.hero-dark .phero .phero-ring,
.hero-dark .phero .phero-ring::after{border-color:rgba(255,255,255,.12)}
.hero-dark .phero .crumb{color:rgba(255,255,255,.42)}
.hero-dark .phero .crumb a{color:rgba(255,255,255,.72)}
.hero-dark .phero .crumb a:hover{color:#fff}
.hero-dark .phero .crumb span{color:var(--flame-2)}

/* ===== Marquee ===== */
.mq{display:flex;overflow:hidden;user-select:none;mask-image:linear-gradient(90deg,transparent,#000 var(--fade,8%),#000 calc(100% - var(--fade,8%)),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--fade,8%),#000 calc(100% - var(--fade,8%)),transparent)}
.mq-track{display:flex;flex-shrink:0;align-items:center;gap:var(--gap,48px);padding-right:var(--gap,48px);animation:mqRun var(--dur,36s) linear infinite}
.mq:hover .mq-track,.mq.is-away .mq-track{animation-play-state:paused}
.mq.rev .mq-track{animation-direction:reverse}
@keyframes mqRun{to{transform:translateX(-100%)}}

.mq-word{display:flex;align-items:center;gap:var(--gap,48px);font-family:'Sora',sans-serif;font-size:clamp(1.9rem,5vw,3.8rem);font-weight:800;letter-spacing:-.035em;color:transparent;-webkit-text-stroke:1px var(--line-2);white-space:nowrap}
.mq-word i{
  font-style:normal;font-size:.34em;-webkit-text-stroke:0;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.mq-dark{background:var(--dark);padding-block:clamp(32px,3.6vw,50px)}
.mq-dark .mq-word{-webkit-text-stroke:1px rgba(255,255,255,.3)}

.logo-chip{flex-shrink:0;height: 80px;display:grid;place-items:center;padding: 10px 15px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-xs);filter:grayscale(1);opacity:.72;transition:opacity .4s var(--ease),filter .4s var(--ease),transform .45s var(--ease-out),box-shadow .4s}
.logo-chip img{max-height:52px;width:auto;object-fit:contain}
.logo-chip:hover{opacity:1;filter:none;transform:translateY(-6px);box-shadow:var(--sh)}

/* ===== Cards ===== */
.card-g{
  position:relative;padding:32px;border-radius:var(--r-lg);height:100%;
  background:var(--card);border:1px solid var(--line);box-shadow:var(--sh-xs);
  overflow:hidden;isolation:isolate;
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease),border-color .4s;
}
.card-g::before{content:'';position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .5s var(--ease);background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),var(--ac-soft),transparent 62%)}
.card-g:hover{transform:translateY(-8px);box-shadow:var(--sh);border-color:var(--line-2)}
.card-g:hover::before{opacity:1}
.card-g h3{margin-bottom:10px}
.card-g p{font-size:.93rem;margin-bottom:0}
.card-g .btn-txt{margin-top:20px}
.card-g .tick{margin-top:18px}

.tilt{transform-style:preserve-3d;transition:transform .4s var(--ease-out),box-shadow .5s var(--ease)}

.ic{
  width:58px;height:58px;display:grid;place-items:center;border-radius:17px;margin-bottom:22px;
  font-size:1.42rem;color:var(--ac);background:var(--ac-soft);position:relative;flex-shrink:0;
  transition:transform .5s var(--ease-out),background .45s,color .45s,box-shadow .45s;
}
.ic::after{content:'';position:absolute;inset:-6px;border-radius:21px;border:1px dashed var(--ac);opacity:0;transform:scale(.86);transition:opacity .5s var(--ease),transform .6s var(--ease-out)}
.card-g:hover .ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg);box-shadow:0 12px 26px -12px var(--ac)}
.card-g:hover .ic::after{opacity:.3;transform:scale(1) rotate(16deg)}
.ic-sm{width:46px;height:46px;font-size:1.1rem;border-radius:14px;margin-bottom:0}

.card-num{position:absolute;top:20px;right:24px;font-family:'Sora',sans-serif;font-size:2.9rem;font-weight:800;line-height:1;color:transparent;-webkit-text-stroke:1px var(--line-2);pointer-events:none;transition:-webkit-text-stroke-color .5s}
.card-g:hover .card-num{-webkit-text-stroke-color:var(--ac)}

.tick{display:flex;flex-direction:column;gap:10px}
.tick li{display:flex;gap:11px;font-size:.9rem;line-height:1.62}
.tick li i{color:var(--ac);font-size:1rem;margin-top:4px;flex-shrink:0}

/* ===== Stats ===== */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat{padding:34px 26px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-xs);position:relative;overflow:hidden;transition:transform .5s var(--ease-out),box-shadow .5s}
.stat::before{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--ac),var(--ac-2));transform:scaleX(0);transition:transform .5s var(--ease-out)}
.stat:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f}
.stat:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5}
.stat:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff}
.stat:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2}
.stat:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.stat:hover::before{transform:scaleX(1)}
.stat b{display:block;font-family:'Sora',sans-serif;font-size:clamp(2.1rem,3.4vw,2.9rem);font-weight:800;line-height:1.15;color:var(--ink);background:linear-gradient(120deg,var(--ac),var(--ac-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat b span{font:inherit;color:inherit;letter-spacing:inherit;text-transform:none}
.stat>span{display:block;margin-top:6px;font-size:.75rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* ===== How we work (stepper) ===== */
.step-track{position:relative;display:grid;grid-template-columns:repeat(6,1fr);margin-bottom:36px}
.step-line{position:absolute;left:calc(100% / 12);right:calc(100% / 12);top:27px;height:2px;border-radius:2px;background:var(--line-2);overflow:hidden}
.step-line i{display:block;height:100%;width:0;background:var(--grad);border-radius:2px;transition:width .8s cubic-bezier(.32,.72,0,1)}
.step-node{display:flex;flex-direction:column;align-items:center;gap:13px;padding:0 6px;border:0;background:none;cursor:pointer}
.step-node b{
  position:relative;z-index:2;isolation:isolate;
  width:56px;height:56px;display:grid;place-items:center;border-radius:50%;
  background:#fff;border:1px solid var(--line-2);
  font-family:'JetBrains Mono',monospace;font-size:.82rem;font-weight:600;color:var(--muted);
  transition:color .5s cubic-bezier(.32,.72,0,1),border-color .5s cubic-bezier(.32,.72,0,1),transform .6s cubic-bezier(.32,.72,0,1),box-shadow .6s cubic-bezier(.32,.72,0,1);
}
.step-node b::before{
  content:'';position:absolute;inset:-1px;z-index:-1;border-radius:50%;
  background:var(--grad);opacity:0;
  transition:opacity .55s cubic-bezier(.32,.72,0,1);
}
.step-node.on b::before{opacity:1}
.step-node em{font-style:normal;font-family:'Sora',sans-serif;font-size:.82rem;font-weight:600;color:var(--muted);text-align:center;transition:color .45s cubic-bezier(.32,.72,0,1)}
.step-node:hover b{border-color:var(--flame);color:var(--flame)}
.step-node.on b{border-color:transparent;color:#fff;transform:scale(1.07);box-shadow:0 12px 26px -12px rgba(255,59,0,.65)}
.step-node.on em{color:var(--ink)}

.step-panels{display:grid}
.step-panel{
  grid-area:1/1;opacity:0;visibility:hidden;will-change:transform,opacity;
  transform:translateY(18px) scale(.985);
  transition:opacity .4s cubic-bezier(.32,.72,0,1),transform .65s cubic-bezier(.32,.72,0,1),visibility .4s;
}
.step-panel.on{opacity:1;visibility:visible;transform:none;transition-delay:.14s}
.step-card{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,44px);align-items:center;
  padding:clamp(26px,3vw,40px);border-radius:var(--r-lg);
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
}
.step-big{
  font-family:'Sora',sans-serif;font-size:clamp(3rem,6vw,4.8rem);font-weight:800;
  line-height:.88;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--line-2);
}
.step-card h3{font-size:clamp(1.18rem,2vw,1.48rem);margin-bottom:10px}
.step-card p{font-size:.97rem;margin:0;max-width:74ch}

/* ===== Split ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,78px);align-items:center}
.split.flip>*:first-child{order:2}
.frame{position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:var(--sh)}
.frame img{width:100%;transition:transform 1.2s var(--ease-out)}
.frame:hover img{transform:scale(1.04)}
.frame-glow{position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}

.badge-row{display:flex;flex-wrap:wrap;gap:10px}
.badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:9px 17px 9px 10px;border-radius:99px;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  font-size:.86rem;line-height:1.4;color:var(--ink);
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease),border-color .4s var(--ease)
}
.badge i{
  width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;
  background:rgba(3,150,215,.12);color:var(--aqua);font-size:.74rem;
  transition:background .4s var(--ease),color .4s var(--ease)
}
.badge i::before{display:block;line-height:1;vertical-align:0}
.badge:hover{
  transform:translateY(-2px);border-color:rgba(3,150,215,.45);
  box-shadow:0 12px 24px -14px rgba(3,150,215,.6),0 2px 5px rgba(13,26,51,.05)
}
.badge:hover i{background:var(--grad-cool);color:#fff}
@media (max-width:575px){
  .badge-row{gap:8px}
  .badge{font-size:.82rem;padding:8px 14px 8px 9px}
}

/* ===== Product cards ===== */
.prod{position:relative;border-radius:var(--r-lg);overflow:hidden;height:100%;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);display:flex;flex-direction:column;transition:transform .5s var(--ease-out),box-shadow .5s,border-color .4s}
.prod:hover{transform:translateY(-9px);box-shadow:var(--sh);border-color:var(--line-2)}
.prod-shot{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3)}
.prod-shot img{width:100%;height:100%;object-fit:cover;object-position:var(--op,0% 0%);transition:transform 1.1s var(--ease-out)}
.prod-shot img.v1{--op:0% 0%}
.prod-shot img.v2{--op:100% 0%}
.prod-shot img.v3{--op:50% 100%}
.prod-shot img.v4{--op:0% 50%}
.prod-shot img.v5{--op:100% 50%}
.prod-shot img.v6{--op:50% 0%}
.prod:hover .prod-shot img{transform:scale(1.06)}
.prod-shot::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(255,255,255,.55))}
.prod-tag{position:absolute;top:14px;left:14px;z-index:2;padding:6px 13px;border-radius:99px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:var(--sh-xs);font-family:'JetBrains Mono',monospace;font-size:.64rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--ac)}
.prod-body{padding:26px 28px 30px;display:flex;flex-direction:column;flex:1}
.prod-body .prod-tag{position:static;align-self:flex-start;margin-bottom:16px;box-shadow:none;backdrop-filter:none}
.prod-ic{width:50px;height:50px;display:grid;place-items:center;border-radius:15px;margin-bottom:18px;font-size:1.24rem;color:var(--ac);background:var(--ac-soft);transition:background .45s var(--ease),color .45s var(--ease),transform .5s var(--ease-out)}
.prod:hover .prod-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}

/* fanned screenshot collage */
.suite-shots{display:flex;justify-content:center;align-items:center;margin-bottom:clamp(36px,4.4vw,60px)}
.suite-shots figure{
  margin:0;flex:0 0 auto;width:clamp(170px,25%,310px);aspect-ratio:16/11;
  overflow:hidden;border-radius:var(--r-lg);background:var(--bg-3);
  border:1px solid var(--line);box-shadow:var(--sh);
  transition:transform .6s var(--ease-out),box-shadow .5s var(--ease);
}
.suite-shots figure + figure{margin-left:-4.5%}
.suite-shots img{width:100%;height:100%;object-fit:cover;object-position:top left}
.suite-shots figure:nth-child(1){transform:rotate(-3.5deg) translateY(12px);z-index:1}
.suite-shots figure:nth-child(2){transform:rotate(2deg) translateY(-10px);z-index:3}
.suite-shots figure:nth-child(3){transform:rotate(-2deg) translateY(8px);z-index:2}
.suite-shots figure:nth-child(4){transform:rotate(3.5deg) translateY(-6px);z-index:1}
.suite-shots figure:hover{transform:rotate(0deg) translateY(-16px) scale(1.06);z-index:9;box-shadow:var(--sh-lg)}
@media (max-width:767px){
  .suite-shots figure:nth-child(n+3){display:none}
  .suite-shots figure{width:44%}
}
.prod-body h3{font-size:1.2rem;margin-bottom:9px}
.prod-body p{font-size:.91rem}
.prod-meta{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0 22px}
.prod-meta span{padding:5px 11px;border-radius:8px;background:var(--bg-2);border:1px solid var(--line);font-size:.72rem;font-weight:500;color:var(--body)}
.prod-body .btn-txt{margin-top:auto;align-self:flex-start}

/* ===== Filter pills / tabs ===== */
.pills{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:42px}
.pill{padding:9px 20px;border-radius:99px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);font-family:'Sora',sans-serif;font-size:.84rem;font-weight:600;color:var(--body);cursor:pointer;transition:all .35s var(--ease)}
.pill:hover{color:var(--ink);border-color:var(--line-2)}
.pill.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 12px 26px -14px rgba(255,59,0,.7)}
.filt-item{transition:opacity .5s var(--ease),transform .5s var(--ease-out)}
.filt-item.hide{opacity:0;transform:scale(.92);position:absolute;pointer-events:none;visibility:hidden}

.tabs{display:flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:99px;background:var(--bg-2);border:1px solid var(--line);width:fit-content;max-width:100%;margin-bottom:42px}
.tab{padding:10px 22px;border-radius:99px;border:0;background:transparent;font-family:'Sora',sans-serif;font-size:.85rem;font-weight:600;color:var(--body);cursor:pointer;transition:all .35s var(--ease);white-space:nowrap}
.tab.on{background:#fff;color:var(--ink);box-shadow:var(--sh-sm)}
.tab-pane{display:none}
.tab-pane.on{display:block;animation:paneIn .6s var(--ease-out)}
@keyframes paneIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ===== Testimonials ===== */
.tsm{position:relative}
.tsm-view{overflow:hidden;margin-inline:-8px}
.tsm-track{display:flex;transition:transform .8s var(--ease-out)}

/* focus mode: past on the left, current in the middle, upcoming on the right */
.tsm-focus{
  --sc-a:1.05;--sc-s:.88;
  --colw:min(430px,86%);--colgap:20px;--rowh:284px;
  --step:calc(96.5% + var(--colgap));
}
/* active(1.05) + 2 sides(.88) + 2 gaps = container width; step = (1.05+.88)/2 = 96.5% */
@media (min-width:992px){.tsm-focus{--colw:calc((100% - var(--colgap) * 2) / 2.81)}}
.tsm-focus .tsm-view{position:relative;height:var(--rowh);margin-inline:0;overflow:visible}
.tsm-focus .tsm-slide{
  position:absolute;top:0;bottom:0;left:50%;width:var(--colw);padding:0;
  opacity:0;pointer-events:none;z-index:1;
  transform:translateX(calc(-50% + var(--d,0) * var(--step))) scale(.86);
  transition:transform .9s cubic-bezier(.32,.72,0,1),opacity .9s cubic-bezier(.32,.72,0,1);
}
.tsm-focus .tsm-slide.is-side{
  opacity:.75;z-index:2;
  transform:translateX(calc(-50% + var(--d,0) * var(--step))) scale(var(--sc-s));
}
.tsm-focus .tsm-slide.is-active{opacity:1;pointer-events:auto;z-index:3;transform:translateX(-50%) scale(var(--sc-a))}
.tsm-focus .tsm-slide.is-active .tsm-card{background:#fff;box-shadow:0 2px 6px rgba(13,26,51,.05),0 26px 50px -26px rgba(13,26,51,.3)}
.tsm-focus .tsm-card{height:100%;padding:22px 24px;transition:box-shadow .9s cubic-bezier(.32,.72,0,1)}
.tsm-focus .tsm-qmark{display:none}
.tsm-focus q{flex:0 1 auto;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tsm-focus .tsm-who{margin-top:auto}
.tsm-x .tsm-foot{justify-content:space-between;gap:30px;margin-top:12px}
.tsm-slide{flex:0 0 calc(100% / var(--per,1));padding:2px 8px;display:flex}
.tsm-card{width:100%;padding:24px;border-radius:var(--r-lg);background:var(--bg-soft);border:1px solid var(--line);display:flex;flex-direction:column;transition:background .9s cubic-bezier(.32,.72,0,1)}
.tsm-card q{flex:1}
.tsm-card q{display:block;font-family:'Sora',sans-serif;font-size:.95rem;font-weight:500;line-height:1.66;color:var(--ink);quotes:none;margin:0}
.tsm-who{display:flex;align-items:center;gap:12px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.tsm-who strong{display:block;font-family:'Sora',sans-serif;font-size:.89rem;color:var(--ink)}
.tsm-who small{color:var(--muted);font-size:.77rem}
.tsm-nav{display:flex;gap:10px}
.tsm-btn{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#fff;border:1px solid var(--line-2);color:var(--ink);cursor:pointer;box-shadow:var(--sh-xs);transition:all .4s var(--ease)}
.tsm-btn:hover{background:#e9f5fd;border-color:var(--aqua);color:var(--aqua);box-shadow:0 4px 10px -2px rgba(3,150,215,.22)}
.stars{display:flex;gap:3px;margin-bottom:18px;color:#ffb020;font-size:.92rem}

/* ===== Blog ===== */
.post{display:flex;flex-direction:column;height:100%;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);transition:transform .5s var(--ease-out),box-shadow .5s,border-color .4s}
.post:hover{transform:translateY(-6px);box-shadow:var(--sh);border-color:var(--line-2)}
.post-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3)}
.post-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out)}
.post:hover .post-img img{transform:scale(1.07)}
.post-cat{position:absolute;z-index:2;top:14px;left:14px;padding:6px 13px;border-radius:99px;background:linear-gradient(100deg,var(--ac),var(--ac-2));font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff;box-shadow:var(--sh-sm)}
.post-body{padding:24px 26px 28px;display:flex;flex-direction:column;flex:1}
.post-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:.77rem;color:var(--muted);margin-bottom:12px}
.post-meta i{color:var(--ac);margin-right:5px}
.post-body h3{font-size:1.1rem;line-height:1.45;margin-bottom:10px}
.post-body h3 a{color:var(--ink)}
.post-body h3 a:hover{color:var(--ac)}
.post-body p{font-size:.89rem}
.post-body .btn-txt{margin-top:auto;align-self:flex-start}

/* ===== Team ===== */
.mem{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);transition:transform .5s var(--ease-out),box-shadow .5s}
.mem:hover{transform:translateY(-9px);box-shadow:var(--sh)}
.mem-img{position:relative;aspect-ratio:1;overflow:hidden;background:var(--bg-3)}
.mem-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .6s var(--ease),transform 1.1s var(--ease-out)}
.mem:hover .mem-img img{filter:none;transform:scale(1.05)}
.mem-soc{position:absolute;bottom:14px;left:0;right:0;z-index:2;display:flex;justify-content:center;gap:8px}
.mem-soc a{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border:1px solid var(--line);color:var(--ink);font-size:.88rem;box-shadow:var(--sh-sm);opacity:0;transform:translateY(14px);transition:all .45s var(--ease-out);transition-delay:calc(var(--i,0)*.06s)}
.mem:hover .mem-soc a{opacity:1;transform:none}
.mem-soc a:hover{background:var(--grad);border-color:transparent;color:#fff}
.mem-body{padding:20px 22px 24px;text-align:center}
.mem-body h4{margin-bottom:2px;font-size:1.04rem}
.mem-body span{font-size:.81rem;color:var(--ac);font-weight:500}

/* ===== Accordion ===== */
.acc-item{
  border:1px solid var(--line);border-radius:var(--r);background:#ffffff;overflow:hidden;
  transition:transform .45s var(--ease-out),border-color .4s,box-shadow .45s var(--ease),background .45s var(--ease);
}
.acc-item:hover{transform:translateX(6px)}
.acc-item.on{transform:none;border-color:var(--line-2);box-shadow:var(--sh)}
.acc-head{
  width:100%;display:flex;align-items:center;gap:16px;padding:19px 22px;
  border:0;background:transparent;cursor:pointer;text-align:left;
  font-family:'Sora',sans-serif;font-size:.98rem;font-weight:600;color:var(--ink);
}
.acc-n{
  flex-shrink:0;font-family:'JetBrains Mono',monospace;font-size:.72rem;font-weight:600;
  letter-spacing:.05em;color:var(--muted);transition:color .4s var(--ease);
}
.acc-item.on .acc-n{color:var(--flame)}
.acc-q{flex:1;line-height:1.4}
.acc-head .sign{
  width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;
  background:transparent;border:1px solid var(--line-2);position:relative;
  transition:background .45s var(--ease),border-color .45s var(--ease),transform .45s var(--ease-out);
}
.acc-head .sign::before,.acc-head .sign::after{content:'';position:absolute;background:var(--ink);border-radius:2px;transition:transform .45s var(--ease-out),background .45s}
.acc-head .sign::before{width:11px;height:1.6px}
.acc-head .sign::after{width:1.6px;height:11px}
.acc-item:hover .sign{border-color:var(--flame)}
.acc-item.on .sign{background:var(--flame);border-color:var(--flame);transform:rotate(180deg)}
.acc-item.on .sign::before,.acc-item.on .sign::after{background:#fff}
.acc-item.on .sign::after{transform:scaleY(0)}
.acc-body{max-height:0;overflow:hidden;transition:max-height .55s var(--ease-out)}
.acc-body div{padding:0 22px 22px 58px;font-size:.92rem;max-width:86ch}

/* ===== Forms ===== */
.field{margin-bottom:17px}
.field label{display:block;margin-bottom:7px;font-size:.81rem;font-weight:600;color:var(--ink)}
.field input,.field select,.field textarea{width:100%;padding:13px 16px;border-radius:13px;color:var(--ink);font-family:inherit;font-size:.92rem;background:#fff;border:1px solid var(--line-2);outline:none;transition:border-color .3s,box-shadow .3s}
.field textarea{resize:vertical;min-height:130px}
.field input::placeholder,.field textarea::placeholder{color:#a8b2c4}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--aqua);box-shadow:0 0 0 4px rgba(3,150,215,.12)}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238b96aa' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.form-note{font-size:.79rem;color:var(--muted);margin-top:13px}
.form-ok{display:none;padding:14px 18px;border-radius:13px;background:rgba(6,182,164,.1);border:1px solid rgba(6,182,164,.3);color:#048577;font-size:.88rem;font-weight:500;margin-bottom:16px}
.form-ok.show{display:block;animation:paneIn .5s var(--ease-out)}

/* ===== Custom select ===== */
.sel{position:relative}
.field .sel select{position:absolute;width:1px;height:1px;padding:0;opacity:0;pointer-events:none}
.sel-btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 16px;border-radius:13px;background:#fff;border:1px solid var(--line-2);
  font-family:inherit;font-size:.92rem;font-weight:400;color:var(--ink);text-align:left;cursor:pointer;
  transition:border-color .3s,box-shadow .3s;
}
.sel-btn>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sel.ph .sel-btn>span{color:#a8b2c4}
.sel-btn>i{flex-shrink:0;font-size:.82rem;color:var(--muted);transition:transform .42s var(--ease-out),color .3s}
.sel-btn:hover{border-color:var(--line-2)}
.sel.on .sel-btn{border-color:var(--aqua);box-shadow:0 0 0 4px rgba(3,150,215,.12)}
.sel.on .sel-btn>i{transform:rotate(180deg);color:var(--aqua)}

.sel-menu{
  position:absolute;z-index:20;top:calc(100% + 8px);left:0;right:0;
  max-height:0;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-8px);
  border-radius:14px;background:#fff;border:1px solid var(--line-2);box-shadow:var(--sh);
  transition:max-height .42s var(--ease-out),transform .42s var(--ease-out),opacity .28s var(--ease),visibility .28s;
}
.sel.on .sel-menu{max-height:272px;opacity:1;visibility:visible;transform:none}
.sel-menu-in{display:flex;flex-direction:column;gap:2px;padding:10px 7px}
.sel-opt{
  width:100%;display:flex;align-items:center;gap:11px;padding:10px 13px;
  border:0;border-radius:10px;background:transparent;
  font-family:inherit;font-size:.9rem;color:var(--body);text-align:left;cursor:pointer;
  transition:background .28s var(--ease),color .28s var(--ease);
}
.sel-opt::before{
  content:'';flex-shrink:0;width:6px;height:6px;border-radius:50%;background:var(--line-2);
  transition:background .28s var(--ease),box-shadow .28s var(--ease);
}
.sel-opt:hover{background:var(--bg-2);color:var(--ink)}
.sel-opt:hover::before{background:var(--aqua)}
.sel-opt.on{background:rgba(255,59,0,.08);color:var(--ink);font-weight:500}
.sel-opt.on::before{background:var(--flame);box-shadow:0 0 0 3px rgba(255,59,0,.16)}

/* ===== Contact / spec ===== */
.ci{display:flex;gap:16px;padding:24px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);height:100%;transition:transform .5s var(--ease-out),box-shadow .45s}
.ci:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.ci h4{font-size:.99rem;margin-bottom:4px}
.ci p,.ci a{font-size:.89rem;color:var(--body);margin:0;display:block}
.ci a:hover{color:var(--ac)}
.map-wrap{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh-sm);filter:grayscale(.75) contrast(1.02);transition:filter .6s var(--ease)}
.map-wrap:hover{filter:none}
.map-wrap iframe{display:block;width:100%;height:430px;border:0}

.spec-table{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff;box-shadow:var(--sh-xs)}
.spec-row{display:grid;grid-template-columns:.62fr 1fr;gap:18px;padding:16px 22px;border-bottom:1px solid var(--line);transition:background .35s}
.spec-row:last-child{border-bottom:0}
.spec-row:hover{background:var(--bg-2)}
.spec-row span{font-size:.79rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.spec-row strong{font-size:.92rem;font-weight:500;color:var(--ink)}

/* ===== Jobs ===== */
.job{display:flex;flex-wrap:wrap;align-items:center;gap:22px;padding:26px 30px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);position:relative;overflow:hidden;transition:transform .5s var(--ease-out),box-shadow .45s,border-color .4s}
.job::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--ac),var(--ac-2));transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease-out)}
.job:hover{transform:translateX(6px);box-shadow:var(--sh);border-color:var(--line-2)}
.job:hover::before{transform:scaleY(1);transform-origin:top}
.job-main{flex:1;min-width:230px}
.job-main h3{font-size:1.14rem;margin-bottom:9px}
.job-tags{display:flex;flex-wrap:wrap;gap:8px}
.job-tags span{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:8px;background:var(--bg-2);border:1px solid var(--line);font-size:.75rem;font-weight:500;color:var(--body)}
.job-tags i{color:var(--ac)}

/* ===== CTA band ===== */
.cta-band{position:relative;padding:clamp(46px,6vw,80px);border-radius:var(--r-xl);overflow:hidden;text-align:center;background:var(--dark);box-shadow:var(--sh-lg)}
.cta-band::before{content:'';position:absolute;inset:0;opacity:.85;background:radial-gradient(circle at 16% 18%,rgba(255,59,0,.42),transparent 48%),radial-gradient(circle at 84% 84%,rgba(3,150,215,.4),transparent 48%),radial-gradient(circle at 60% 10%,rgba(124,92,255,.22),transparent 42%);animation:ctaShift 15s var(--ease) infinite alternate}
@keyframes ctaShift{to{transform:scale(1.22) rotate(8deg)}}
.cta-band>*{position:relative;z-index:1}
.cta-band h2{color:#fff;margin-bottom:15px}
.cta-band p{max-width:610px;margin:0 auto 30px;color:rgba(255,255,255,.72)}
.cta-band .eyebrow{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.85)}
.cta-band .grad-txt{background:linear-gradient(100deg,#ff8a3d,#ffb347);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta-band .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.cta-actions{display:flex;flex-wrap:wrap;gap:13px;justify-content:center}

/* ===== Stats band (dark, borderless) ===== */
.stats-x{
  position:relative;overflow:hidden;padding-block:clamp(34px,3.6vw,50px);
  border-bottom:1px solid var(--line);
  background-color:#e8f0f9;
  background-image:radial-gradient(rgba(11,18,32,.075) 1px,transparent 1px);
  background-size:22px 22px;
  animation:statsDots 26s linear infinite;
}
@keyframes statsDots{to{background-position:22px 22px}}
.stats-x::before{
  content:'';position:absolute;inset:-40% -15%;pointer-events:none;
  background:
    radial-gradient(560px 260px at 24% 44%,rgba(3,150,215,.13),transparent 65%),
    radial-gradient(520px 240px at 76% 58%,rgba(56,192,245,.11),transparent 66%),
    radial-gradient(420px 220px at 58% 4%,rgba(124,92,255,.08),transparent 66%);
  animation:statsOrbit 18s var(--ease) infinite alternate;
}
@keyframes statsOrbit{
  0%{transform:translate3d(-4%,-2%,0) scale(1)}
  100%{transform:translate3d(6%,3%,0) scale(1.16)}
}
.stats-x::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(105% 130% at 50% 50%,rgba(255,255,255,.28) 0%,transparent 58%);
}
.stats-x>*{position:relative;z-index:2}
.stats-x .stats{gap:0;border:0;border-radius:0;background:none;overflow:visible}
.stats-x .stat{
  padding:4px clamp(14px,2vw,28px);background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;
}
.stats-x .stat::before{display:none}
.stats-x .stat + .stat::before{
  content:'';display:block;left:0;right:auto;top:50%;bottom:auto;
  width:1px;height:42px;transform:translateY(-50%);
  background:linear-gradient(rgba(11,18,32,0),rgba(11,18,32,.16),rgba(11,18,32,0));
}
.stats-x .stat:hover{transform:none;background:none;box-shadow:none}
.stats-x .stat + .stat:hover::before{transform:translateY(-50%)}
.stats-x .stat b{font-size:clamp(1.95rem,3.1vw,2.7rem);letter-spacing:-.02em}
.stats-x .stat>span{
  margin-top:5px;font-family:'JetBrains Mono',monospace;font-size:.7rem;
  letter-spacing:.18em;color:var(--muted);
}

/* ===== Client strip ===== */
.clients-x{
  position:relative;overflow:hidden;padding-block:clamp(46px,5vw,72px);
  background-color:var(--dark);
  background-image:radial-gradient(rgba(255,255,255,.11) 1px,transparent 1px);
  background-size:22px 22px;
  animation:statsDots 30s linear infinite;
}
.clients-x::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(780px 470px at 10% 8%,rgba(3,150,215,.24),transparent 64%),
    radial-gradient(840px 490px at 88% 78%,rgba(56,192,245,.16),transparent 64%),
    radial-gradient(620px 350px at 62% 4%,rgba(124,92,255,.14),transparent 66%);
}
.clients-x::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 145% at 50% 50%,transparent 40%,rgba(4,9,18,.6) 100%);
}
.clients-x>*{position:relative;z-index:2}
.clients-x .mq{--fade:15%;padding-block:14px}
.clients-x .mq + .mq{margin-top:-14px}
.clients-label{
  text-align:center;font-family:'JetBrains Mono',monospace;font-size:.72rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.52);margin-bottom:36px;
}
.clients-label::after{content:'';display:block;width:34px;height:2px;margin:16px auto 0;background:var(--grad)}
.mq .logo-chip{
  position:relative;
  height: 85px;
  padding: 0 20px;
  display:grid;
  place-items:center;
  background:#fff;
  border:0;
  border-radius:var(--r);
  box-shadow:0 10px 26px -18px rgba(0,0,0,.9);
  opacity:1;
  filter:none;
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease);
}
.mq .logo-chip img{max-height:46px;object-fit:contain;transition:transform .5s var(--ease-out)}
.mq .logo-chip:hover{transform:translateY(-6px);box-shadow:0 24px 42px -20px rgba(0,0,0,.95)}
.mq .logo-chip:hover img{transform:scale(1.06)}

/* ===== Testimonials section ===== */
.tsm-x h2{font-size:clamp(1.85rem,3.1vw,2.6rem);line-height:1.14;margin:0 0 16px}
.tsm-x h2 span{color:var(--flame)}
.tsm-x>.container p{font-size:.99rem;max-width:46ch;margin:0}
.tsm-qmark{
  width:34px;height:34px;display:grid;place-items:center;border-radius:11px;margin-bottom:14px;
  background:rgba(255,59,0,.09);color:var(--flame);font-size:.98rem;
}
.tsm-x .stars{font-size:.78rem;margin-bottom:11px}
.tsm-slide:nth-child(4n+1) .tsm-card{--ac:#ff3b00;--ac-soft:rgba(255,59,0,.1)}
.tsm-slide:nth-child(4n+2) .tsm-card{--ac:#0396d7;--ac-soft:rgba(3,150,215,.1)}
.tsm-slide:nth-child(4n+3) .tsm-card{--ac:#7c5cff;--ac-soft:rgba(124,92,255,.1)}
.tsm-slide:nth-child(4n+4) .tsm-card{--ac:#06b6a4;--ac-soft:rgba(6,182,164,.11)}
.tsm-ava{
  width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;
  font-family:'Sora',sans-serif;font-size:.84rem;font-weight:700;letter-spacing:.02em;
  background:var(--ac-soft);color:var(--ac);
}
.tsm-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px}
.tsm-count{font-family:'JetBrains Mono',monospace;font-size:.76rem;letter-spacing:.1em;color:var(--muted)}
.tsm-count b{font-size:1rem;color:var(--ink);font-weight:600}

/* ===== Testimonial card: speech bubble, quote mark riding the top edge =====
   Overrides the tinted/bordered card above - must stay after those rules.
   drop-shadow (not box-shadow) so the tail is shadowed along with the body. */
/* Square bottom-left so the tail grows straight out of the corner.
   box-shadow is killed on purpose - it only follows the rectangular border box,
   so it stopped at the card's bottom edge and left the tail looking like a
   separate piece. One drop-shadow instead: it traces the alpha of the whole
   shape, pseudo-element included, so body and tail share one continuous edge.
   Keep it to a single drop-shadow - stacking two shadows the second one also
   shadows the first, which shows up as a seam where the tail meets the card. */
.tsm-x .tsm-card{
  position:relative;overflow:visible;border-radius:14px 14px 14px 0;
  background:#fff;border:0;padding:30px 28px 26px;
  box-shadow:none;
  filter:drop-shadow(0 10px 16px rgba(13,26,51,.14))
}
.tsm-x .tsm-slide.is-active .tsm-card{
  box-shadow:none;
  filter:drop-shadow(0 16px 26px rgba(13,26,51,.18))
}
/* the bubble tail, hanging straight off the bottom-left corner */
.tsm-x .tsm-card::after{
  content:'';position:absolute;left:0;bottom:2px;width:0;height:0;
  transform:translateY(100%);
  border-top:27px solid #fff;border-right:25px solid transparent
}
/* the quote mark sits above the card, overlapping its top-left corner */
.tsm-x .tsm-qmark{
  position:absolute;top:-25px;left:22px;z-index:2;
  display:block;width:auto;height:auto;margin:0;padding:0;
  border-radius:0;background:none;color:var(--flame);
  font-size:3.1rem;line-height:1
}
.tsm-x .stars{margin-bottom:13px}
/* name and role sat apart on the body line-height (1.74) - pull them together */
.tsm-x .tsm-who strong{line-height:1.3}
.tsm-x .tsm-who small{display:block;line-height:1.3}
/* the mark rides above the cards and the tails hang below, so the slider needs
   clearance at both ends */
.tsm-x .tsm{padding-top:34px}
.tsm-x .tsm-foot{margin-top:100px}
/* dot grid behind the cards, top-left and bottom-right */
.tsm-x{position:relative;isolation:isolate}
.tsm-x::before,.tsm-x::after{
  content:'';position:absolute;z-index:-1;pointer-events:none;
  width:min(320px,24vw);height:clamp(120px,15vw,190px);
  background-image:radial-gradient(circle,rgba(13,26,51,.17) 1.5px,transparent 1.6px);
  background-size:13px 13px
}
.tsm-x::before{
  top:clamp(90px,12vw,150px);left:0;
  mask-image:radial-gradient(78% 78% at 0% 0%,#000,transparent 74%);
  -webkit-mask-image:radial-gradient(78% 78% at 0% 0%,#000,transparent 74%)
}
.tsm-x::after{
  bottom:0;right:0;
  mask-image:radial-gradient(78% 78% at 100% 100%,#000,transparent 74%);
  -webkit-mask-image:radial-gradient(78% 78% at 100% 100%,#000,transparent 74%)
}
@media (max-width:767px){.tsm-x::before,.tsm-x::after{display:none}}

/* ===== Hero compliance strip ===== */
.hero-std{display:flex;flex-wrap:wrap;gap:10px clamp(12px,1.2vw,18px);margin-top:26px;padding-top:22px;border-top:1px solid rgba(255,255,255,.13)}
.hero-std span{
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  font-family:'JetBrains Mono',monospace;font-size:.63rem;font-weight:500;
  letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.55);
}
.hero-std i{font-size:.82rem;color:var(--aqua-2)}

/* ===== Who It's For ===== */
/* OLD AUDIENCE CARD DESIGN
.aud{display:grid;grid-template-columns:repeat(6,1fr)}
.aud-item{
  position:relative;padding:28px clamp(10px,1.4vw,18px);text-align:center;
  transition:transform .5s var(--ease-out);
}
.aud-item::before{
  content:'';position:absolute;inset:0;z-index:-1;border-radius:var(--r-lg);
  background:linear-gradient(180deg,#f7fafd,#eef4fa);
  opacity:0;transition:opacity .45s var(--ease),box-shadow .5s var(--ease);
}
.aud-item:nth-child(2n)::before{opacity:1}
.aud-item:nth-child(2n):hover::before{box-shadow:0 22px 40px -28px rgba(13,26,51,.6)}
.aud-item:hover{transform:translateY(-6px)}
.aud-ic{
  position:relative;width:130px;height:130px;margin:0 auto 16px;
  display:grid;place-items:center;
  color:var(--ac);font-size:1.7rem;
  transition:color .5s var(--ease);
}
.aud-ic svg{position:absolute;inset:0;width:100%;height:100%}
.aud>*:nth-child(1) .aud-ic svg{transform:rotate(0deg)}
.aud>*:nth-child(2) .aud-ic svg{transform:rotate(45deg)}
.aud>*:nth-child(3) .aud-ic svg{transform:rotate(90deg)}
.aud>*:nth-child(4) .aud-ic svg{transform:rotate(135deg)}
.aud>*:nth-child(5) .aud-ic svg{transform:rotate(180deg)}
.aud>*:nth-child(6) .aud-ic svg{transform:rotate(225deg)}
.aud-ic path{
  fill:var(--ac);stroke:var(--ac);stroke-width:16;stroke-linejoin:round;
  opacity:.12;transition:opacity .5s var(--ease);
}
.aud-ic i{position:relative;z-index:1}
.aud-item:hover .aud-ic{color:#fff}
.aud-item:hover .aud-ic path{opacity:1}
.aud-item h3{font-size:.98rem;margin-bottom:7px;transition:color .4s var(--ease)}
.aud-item:hover h3{color:var(--ac)}
.aud-item p{font-size:.84rem;line-height:1.6;margin:0}
*/

.aud{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(12px,1.3vw,18px)}
.aud>*:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-c1:#fff9f7;--ac-c2:#fff5f2;--ac-c3:#ffcebf}
.aud>*:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-c1:#f7fcfe;--ac-c2:#f2fafd;--ac-c3:#c0e5f5}
.aud>*:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-c1:#fbfaff;--ac-c2:#f8f7ff;--ac-c3:#ded6ff}
.aud>*:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-c1:#f8fdfc;--ac-c2:#f2fbfa;--ac-c3:#c0ede8}
.aud>*:nth-child(5){--ac:#ff9f1c;--ac-2:#ffbe5c;--ac-c1:#fffcf8;--ac-c2:#fffaf3;--ac-c3:#ffe7c6}
.aud>*:nth-child(6){--ac:#4361ee;--ac-2:#7089ff;--ac-c1:#f9fafe;--ac-c2:#f5f7fe;--ac-c3:#d0d8fb}

.aud-i{
  position:relative;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;align-items:center;text-align:center;height:100%;
  padding:clamp(22px,2vw,30px) clamp(14px,1.4vw,20px) 78px;
  border-radius:var(--r-lg);color:var(--ink);text-decoration:none;
  background:var(--ac-c1);
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease)
}
.aud-i::after{
  content:'';position:absolute;z-index:-1;left:-12%;bottom:-19%;width:50.4%;padding-top:50.4%;
  background:var(--ac-c2);border-radius:50%
}
.aud-i:hover{transform:translateY(-8px);box-shadow:0 28px 52px -30px rgba(13,26,51,.42)}
.aud-i-ic{
  position:relative;width:clamp(80px,6.56vw,99px);aspect-ratio:1;margin-bottom:10px;
  display:grid;place-items:center;font-size:clamp(1.2rem,1.52vw,1.48rem);color:var(--ac);
  transition:transform .55s var(--ease-out),color .45s var(--ease)
}
.aud-i-ic svg{position:absolute;inset:0;width:100%;height:100%}
.aud-i-ic path{fill:var(--ac-c3);stroke:var(--ac-c3);stroke-width:16;stroke-linejoin:round}
.aud-i-ic i{position:relative;z-index:1}
.aud>*:nth-child(1) .aud-i-ic svg{transform:rotate(0deg)}
.aud>*:nth-child(2) .aud-i-ic svg{transform:rotate(45deg)}
.aud>*:nth-child(3) .aud-i-ic svg{transform:rotate(90deg)}
.aud>*:nth-child(4) .aud-i-ic svg{transform:rotate(135deg)}
.aud>*:nth-child(5) .aud-i-ic svg{transform:rotate(180deg)}
.aud>*:nth-child(6) .aud-i-ic svg{transform:rotate(225deg)}
.aud-i:hover .aud-i-ic{transform:scale(1.07)}
.aud-i h3{font-size:.98rem;margin:0 0 7px;transition:color .4s var(--ease)}
.aud-i:hover h3{color:var(--ac)}
.aud-i p{font-size:.84rem;line-height:1.6;margin:0;color:var(--body)}
.aud-i-go{
  position:absolute;right:clamp(14px,1.4vw,20px);bottom:clamp(16px,1.6vw,22px);
  width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
  background:#fff;color:var(--ac);font-size:.86rem;box-shadow:var(--sh-sm);
  transition:background .45s var(--ease),color .45s var(--ease),transform .5s var(--ease-out)
}
.aud-i:hover .aud-i-go{
  background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:translateX(4px)
}
/* ===== Services: borderless feature items ===== */
.feat{display:flex;gap:17px;height:100%}
.feat-ic{
  position:relative;overflow:hidden;
  width:50px;height:50px;flex-shrink:0;display:grid;place-items:center;
  background:var(--ac-soft);color:var(--ac);font-size:1.18rem;
  animation:borderTransform 9s linear infinite alternate forwards;
  transition:background .5s var(--ease),color .5s var(--ease),transform .55s var(--ease-out);
}
#services .row>*:nth-child(1) .feat-ic{animation-duration:9s;animation-delay:-2.1s}
#services .row>*:nth-child(2) .feat-ic{animation-duration:12.5s;animation-delay:-7.4s}
#services .row>*:nth-child(3) .feat-ic{animation-duration:10.5s;animation-delay:-4.2s}
#services .row>*:nth-child(4) .feat-ic{animation-duration:14s;animation-delay:-9.8s}
#services .row>*:nth-child(5) .feat-ic{animation-duration:11s;animation-delay:-1.3s}
#services .row>*:nth-child(6) .feat-ic{animation-duration:13s;animation-delay:-6.5s}
.feat-ic i{grid-area:1/1;transition:transform .55s cubic-bezier(.32,.72,0,1)}
.feat-ic i:last-child{transform:translateY(150%)}
.feat:hover .feat-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:scale(1.06)}
.feat:hover .feat-ic i:first-child{transform:translateY(-150%)}
.feat:hover .feat-ic i:last-child{transform:translateY(0)}
.feat h3{font-size:1.08rem;margin-bottom:8px;transition:color .4s var(--ease)}
.feat:hover h3{color:var(--ac)}
.feat p{font-size:.92rem;margin:0 0 14px}
.feat .btn-txt{color:var(--ac)}

/* ===== Products: catalogue cards ===== */
.pcard{
  position:relative;display:grid;grid-template-columns:auto 1fr;gap:22px;height:100%;
  padding:clamp(24px,2.4vw,30px);border-radius:var(--r-lg);
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);overflow:hidden;isolation:isolate;
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease),border-color .4s;
}
.pcard::before{content:'';position:absolute;top:0;right:0;width:130px;height:130px;z-index:-1;border-radius:0 0 0 100%;background:var(--ac-soft);opacity:.55;transition:opacity .5s var(--ease),transform .6s var(--ease-out);transform:translate(30%,-30%)}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--sh);border-color:var(--line-2)}
.pcard:hover::before{opacity:1;transform:translate(14%,-14%)}
.pcard-ic{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:var(--ac-soft);color:var(--ac);font-size:1.3rem;transition:background .45s var(--ease),color .45s,transform .55s var(--ease-out)}
.pcard:hover .pcard-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-7deg)}
.pcard h3{font-size:1.14rem;margin-bottom:8px}
.pcard p{font-size:.92rem;margin:0}
.pcard .prod-meta{margin:15px 0 18px}
@media (max-width:575px){.pcard{grid-template-columns:1fr;gap:16px}}

/* ===== AI: compact cards (scanner brackets + pulse) ===== */
.ai-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:32px}
.ai-cell{
  position:relative;padding:20px;border-radius:var(--r);
  background:#fff;border:1px solid var(--line);
}
.ai-cell::before,.ai-cell::after{
  content:'';position:absolute;width:18px;height:18px;pointer-events:none;
  border:2px solid var(--ac);opacity:0;
  transition:opacity .35s var(--ease),transform .5s var(--ease-out);
}
.ai-cell::before{top:9px;left:9px;border-right:0;border-bottom:0;border-radius:7px 0 0 0;transform:translate(7px,7px)}
.ai-cell::after{bottom:9px;right:9px;border-left:0;border-top:0;border-radius:0 0 7px 0;transform:translate(-7px,-7px)}
.ai-cell:hover::before,.ai-cell:hover::after{opacity:1;transform:none}
.ai-n{
  position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;margin-bottom:13px;
  background:var(--ac-soft);color:var(--ac);font-size:1rem;
  transition:background .45s var(--ease),color .45s var(--ease);
}
.ai-n::after{content:'';position:absolute;inset:0;border-radius:inherit;border:1.5px solid var(--ac);opacity:0}
.ai-cell:hover .ai-n{background:var(--ac);color:#fff}
.ai-cell:hover .ai-n::after{animation:aiPulse 1.2s var(--ease-out) infinite}
@keyframes aiPulse{0%{opacity:.55;transform:scale(1)}100%{opacity:0;transform:scale(1.65)}}
.ai-cell h3{font-size:.98rem;margin-bottom:5px;transition:color .4s var(--ease)}
.ai-cell:hover h3{color:var(--ac)}
.ai-cell p{font-size:.87rem;margin:0}
.ai-cell .btn-txt{margin-top:13px}
.ai-grid>*:nth-child(1){--ac:#ff3b00;--ac-soft:rgba(255,59,0,.1)}
.ai-grid>*:nth-child(2){--ac:#0396d7;--ac-soft:rgba(3,150,215,.1)}
.ai-grid>*:nth-child(3){--ac:#7c5cff;--ac-soft:rgba(124,92,255,.1)}
.ai-grid>*:nth-child(4){--ac:#06b6a4;--ac-soft:rgba(6,182,164,.11)}
@media (max-width:575px){.ai-grid{grid-template-columns:1fr}}

/* ===== Layered image stack (mouse parallax) ===== */
/* ---- AI Integrated: offset collage ---- */
.gxc{
  --cut:clamp(22px,2.6vw,38px);
  display:grid;gap:clamp(14px,1.7vw,22px);
  padding:20px;
}
.gx-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.5vw,20px)}
.gx-row-a{align-items:end}
.gx-row-b{align-items:start}

.gx-t{
  position:relative;margin:0;overflow:hidden;background:transparent;
  border-radius:var(--cut) 0 var(--cut) 0;
  corner-shape:bevel;
  transition:translate .6s var(--ease-out),box-shadow .6s var(--ease);
}
.gx-t img{display:block;width:100%;height:auto;border-radius:6px}
.gx-t:hover{translate:0 -6px;box-shadow:0 26px 44px -30px rgba(13,26,51,.6)}
.gx-card{
  border-radius:var(--cut) 6px var(--cut) 6px;
  corner-shape:bevel round bevel round;
  position:relative;
  display:flex;
  flex-direction:column;
  padding:clamp(20px,2.4vw,30px);
  aspect-ratio: 1/1;
  border:1px solid rgba(255,255,255,.18);
  background-color:#0a1424;
  background-image:
    radial-gradient(115% 85% at 10% 110%,rgba(255,59,0,.3),transparent 62%),
    radial-gradient(95% 70% at 98% -10%,rgba(3,150,215,.26),transparent 60%),
    radial-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(158deg,#16243f,#0a1424 62%,#070f1d);
  background-size:auto,auto,16px 16px,auto;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
.gxc-ic{
  align-self: flex-end;
  width:2.1em;
  height:2.1em;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.09);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
  color:var(--flame-2);
  font-size:.86rem;
}
.gxc-rule{
  display:block;width:100%;height:1px;margin-top:auto;
  background:linear-gradient(90deg,rgba(255,122,47,.75),rgba(255,255,255,.16) 42%,transparent);
}
.gxc-l{
  font-family:'Sora',sans-serif;font-size:clamp(.86rem,1.15vw,1.02rem);font-weight:700;
  letter-spacing:-.01em;color:#fff;
}
.gxc-l em{font-style:normal;color:var(--flame-2)}
.gxc-r{
  align-self:flex-end;margin-top:2px;
  font-family:'Sora',sans-serif;font-size:clamp(.86rem,1.15vw,1.02rem);font-weight:700;
  color:#fff;
}
.gx-card b{
  margin-top:clamp(14px,1.6vw,20px);
  font-family:'Sora',sans-serif;font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:800;
  letter-spacing:-.03em;line-height:1;color:#fff;
  text-shadow:0 6px 24px rgba(255,122,47,.35);
}

@media (max-width:767px){
  .gxc{padding:20px 20px 20px 24px}
  .gx-row{grid-template-columns:1fr;gap:14px}
  .gx-row-a,.gx-row-b{align-items:stretch}
  .gx-card{aspect-ratio:auto;min-height:200px}
}


/* ---- Who We Are images ---- */
 .wwa{
  position: relative;
  width: calc(100% - 48px);
  border-radius: var(--cut-xxxl) 6px var(--cut-xxxl) 6px;
  corner-shape: bevel round bevel round;
  margin-left: auto;
  background-color: #0a1424;
  background-image: radial-gradient(115% 85% at 10% 110%, rgba(255, 59, 0, .3), transparent 62%), radial-gradient(95% 70% at 98% -10%, rgba(3, 150, 215, .26), transparent 60%), radial-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px), linear-gradient(158deg, #16243f, #0a1424 62%, #070f1d);
  background-size: auto, auto, 16px 16px, auto;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}
.wwa-img{
  position: relative;
  margin: 0;
  overflow: hidden;
  background: transparent;
  border-radius: var(--cut-xxxl) 6px var(--cut-xxxl) 6px;
  corner-shape: bevel round bevel round;
  transition: translate .6s var(--ease-out), box-shadow .6s var(--ease);
  transform: translate(-48px, 48px) !important;
}
.wwa-chip{
  position:absolute;z-index:3;right:18px;bottom:-74px;
  animation:wwaFloat 4.6s var(--ease) infinite;
  display:grid;grid-template-columns:auto 1fr;align-items:center;
  column-gap:12px;
  padding:12px 20px 12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 20px 40px -22px rgba(13,26,51,.6),0 0 0 1px rgba(13,26,51,.05);
  white-space:nowrap;
}
.wwa-chip i{
  grid-row:1/3;width:36px;height:36px;display:grid;place-items:center;
  border-radius:10px;
  background:var(--grad);color:#fff;font-size:.94rem;
  box-shadow:0 8px 16px -9px rgba(255,59,0,.85);
}
.wwa-chip em{
  grid-column:2;align-self:end;font-style:normal;display:block;
  font-family:'Sora',sans-serif;font-size:.88rem;font-weight:700;color:var(--ink);line-height:1.15;
}
.wwa-chip em b{color:var(--flame)}
.wwa-chip small{grid-column:2;align-self:start;display:block;font-size:.7rem;color:var(--muted);margin-top:1px}
@keyframes wwaFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -11px}
}
@media (max-width:575px){
  .wwa-chip{right:8px;bottom:-56px;padding:10px 14px 10px 11px;column-gap:9px}
  .wwa-chip i{width:28px;height:28px;font-size:.8rem}
  .wwa-chip em{font-size:.78rem}
  .wwa-chip small{font-size:.64rem}
}
.wwa-img{z-index:1}
.wwa img{display:block;width:100%;height:auto;border-radius:0}
.wwa:hover{translate:0 -6px;box-shadow:0 26px 44px -30px rgba(13,26,51,.6)}

.stack{position:relative;aspect-ratio:1/.94;--px:0px;--py:0px}
.stack figure{
  position:absolute;margin:0;overflow:hidden;border-radius:var(--r-lg);
  background:var(--bg-3);border:1px solid var(--line);box-shadow:var(--sh);
  transform:translate3d(calc(var(--px) * var(--dep)),calc(var(--py) * var(--dep)),0) rotate(var(--rot));
  transition:transform .55s var(--ease-out),box-shadow .5s var(--ease);
}
.stack figure::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);pointer-events:none}
.stack img{width:100%;height:100%;object-fit:cover;display:block}
.stack figure:hover{
  z-index:9;box-shadow:var(--sh-lg);
  transform:translate3d(calc(var(--px) * var(--dep)),calc(var(--py) * var(--dep) - 8px),0) rotate(0deg) scale(1.04);
}
.stack .s1{left:0;top:5%;width:60%;aspect-ratio:16/10;--rot:-3deg;--dep:1;z-index:2}
.stack .s2{right:0;top:0;width:37%;aspect-ratio:3/4;--rot:4deg;--dep:2;z-index:4}
.stack .s3{right:3%;bottom:0;width:53%;aspect-ratio:16/10;--rot:-2.5deg;--dep:2.8;z-index:5}
.stack .s4{left:2%;bottom:6%;width:37%;aspect-ratio:4/3;--rot:5deg;--dep:1.5;z-index:3}
.stack-tag{
  position:absolute;right:-4%;bottom:16%;z-index:6;display:flex;align-items:center;gap:9px;
  padding:9px 15px;border-radius:99px;white-space:nowrap;
  background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border:1px solid var(--line);
  box-shadow:var(--sh);font-family:'Sora',sans-serif;font-size:.78rem;font-weight:600;color:var(--ink);
  transform:translate3d(calc(var(--px) * 3.4),calc(var(--py) * 3.4),0);
  transition:transform .55s var(--ease-out);
}
.stack-tag i{color:var(--flame);font-size:.95rem}
@media (max-width:575px){.stack-tag{display:none}}

/* ===== Section backgrounds ===== */
.bg-white{background:#fff}
.bg-soft{background:#f4f8fd}
.bg-soft h2 span,.bg-white h2 span{color:var(--flame)}

/* ===== FAQ section ===== */
.faq-x{position:relative}
.head-row{
  display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(22px,3vw,52px);align-items:center;
  margin-bottom:clamp(32px,3.6vw,46px);
}
.head-row h2{font-size:clamp(1.85rem,3.1vw,2.6rem);line-height:1.14;margin:0 0 16px;text-wrap:balance}
.head-row h2 span{color:var(--flame)}
.head-row p{font-size:.99rem;margin:0;max-width:52ch}
.head-row-act{display:flex;justify-content:flex-end}
.faq-list{display:flex;flex-direction:column;gap:14px}

/* ===== Closing CTA ===== */
.cta-pro{
  position:relative;overflow:hidden;padding-block:clamp(54px,6vw,88px);
  background-color:#e8f0f9;
  background-image:radial-gradient(rgba(11,18,32,.075) 1px,transparent 1px);
  background-size:22px 22px;
  border-top:1px solid var(--line);
}
.cta-pro .container{position:relative;z-index:2}
.cta-lines,.cta-dots{position:absolute;pointer-events:none}

.cta-lines{
  top:-8%;right:-2%;width:min(400px,34vw);height:290px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' fill='none'%3E%3Cg stroke='%230396d7' stroke-opacity='.4' stroke-width='1'%3E%3Cpath d='M0 16h18l10 10h36M16 0v18l10 10v36M64 48H46L36 38'/%3E%3C/g%3E%3Cg fill='%230396d7' fill-opacity='.42'%3E%3Ccircle cx='18' cy='16' r='2.6'/%3E%3Ccircle cx='28' cy='26' r='2.6'/%3E%3Ccircle cx='46' cy='48' r='2.6'/%3E%3C/g%3E%3C/svg%3E");
  background-size:64px 64px;
  mask-image:radial-gradient(74% 74% at 100% 0%,#000,transparent 76%);
  -webkit-mask-image:radial-gradient(74% 74% at 100% 0%,#000,transparent 76%);
}

.cta-dots{
  bottom:9%;right:4%;width:240px;height:130px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='30'%3E%3Ctext x='0' y='12' font-family='monospace' font-size='12' fill='%230396d7' fill-opacity='.34'%3E1011%3C/text%3E%3Ctext x='7' y='27' font-family='monospace' font-size='12' fill='%23ff3b00' fill-opacity='.28'%3E0110%3C/text%3E%3C/svg%3E");
  background-size:46px 30px;
  mask-image:linear-gradient(135deg,transparent,#000);-webkit-mask-image:linear-gradient(135deg,transparent,#000);
}
.cta-plus{
  position:absolute;left:46%;bottom:9%;width:150px;height:96px;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Cpath d='M13 8.5v9M8.5 13h9' stroke='%23ff3b00' stroke-opacity='.4' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size:26px 26px;
  mask-image:linear-gradient(60deg,#000,transparent);-webkit-mask-image:linear-gradient(60deg,#000,transparent);
}
.cta-wave{
  position:absolute;right:0;top:38%;width:min(300px,26vw);height:190px;pointer-events:none;
  background:repeating-linear-gradient(180deg,transparent 0 17px,rgba(3,150,215,.11) 17px 18px);
  mask-image:radial-gradient(80% 80% at 100% 50%,#000,transparent 74%);
  -webkit-mask-image:radial-gradient(80% 80% at 100% 50%,#000,transparent 74%);
}

.cta-pro-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:clamp(30px,3.4vw,50px);align-items:stretch}
.cta-pro-left{display:flex;flex-direction:column;justify-content:center}

.kicker{
  display:inline-flex;align-items:center;gap:14px;margin-bottom:18px;
  font-family:'Sora',sans-serif;font-size:.78rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--aqua);
}
.kicker::after{content:'';width:38px;height:2px;border-radius:2px;background:var(--aqua);opacity:.5}

.cta-head{margin-bottom:16px}
.cta-head h2{font-size:clamp(1.85rem,3.1vw,2.65rem);line-height:1.14;margin:0}
.cta-head h2 span{color:var(--flame)}
.cta-pro-left>p{font-size:1rem;max-width:46ch;margin:0 0 28px}

.cta-pro-act{display:flex;flex-wrap:wrap;gap:16px}
.btn-sq,.btn-sq-alt{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:stretch;border-radius:var(--cut) var(--cut-r) var(--cut-r) var(--cut-r);corner-shape:superellipse(var(--cut-k)) round round round;border:0;
  padding:0;appearance:none;-webkit-appearance:none;text-align:left;cursor:pointer;
  font-family:'Sora',sans-serif;font-size:.89rem;font-weight:600;
  transition:color .35s var(--ease),box-shadow .45s var(--ease),transform .42s var(--ease-out);
}
.btn-sq::before,.btn-sq-alt::before{
  content:'';position:absolute;inset:0;z-index:1;
  transform:translateX(-101%);transition:transform .52s var(--ease-out);
}
.btn-sq:hover::before,.btn-sq-alt:hover::before{transform:translateX(0)}

.btn-sq-ico{
  position:relative;z-index:2;flex-shrink:0;overflow:hidden;
  width:50px;display:grid;place-items:center;
  transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);
}
.btn-sq-ico i{
  grid-area:1/1;font-size:.98rem;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:transform .5s var(--ease-out);
}
.btn-sq-ico i::before{vertical-align:0;line-height:1}
.btn-sq-ico i:last-child{transform:translateX(-46px)}
.btn-sq:hover .btn-sq-ico i:first-child,
.btn-sq-alt:hover .btn-sq-ico i:first-child{transform:translateX(46px)}
.btn-sq:hover .btn-sq-ico i:last-child,
.btn-sq-alt:hover .btn-sq-ico i:last-child{transform:translateX(0)}
.btn-sq-lbl{position:relative;z-index:2;display:flex;align-items:center;padding:14px 24px;white-space:nowrap}

.btn-sq{
  background:var(--grad);color:#fff;
  box-shadow:0 3px 8px -2px rgba(255,59,0,.42),0 16px 30px -12px rgba(255,59,0,.5);
}
.btn-sq::before{background:var(--grad-deep)}
.btn-sq .btn-sq-ico{background:rgba(255,255,255,.2);border-right:1px solid rgba(255,255,255,.28);color:#fff}
.btn-sq:hover{
  color:#fff;transform:translateY(-2px);
  box-shadow:0 5px 12px -2px rgba(201,46,0,.45),0 24px 44px -14px rgba(201,46,0,.55);
}

.btn-sq-alt{
  background:#fff;color:var(--ink);
  box-shadow:0 2px 5px rgba(13,26,51,.06),0 14px 28px -14px rgba(13,26,51,.32);
}
.btn-sq-alt::before{background:#e9f5fd}
.btn-sq-alt::after{
  content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
  border:1px solid var(--line-2);border-radius:inherit;corner-shape:inherit;
  transition:border-color .45s var(--ease);
}
.btn-sq-alt:hover::after{border-color:var(--aqua)}
.btn-sq-alt .btn-sq-ico{background:transparent;border-right:1px solid var(--line);color:var(--aqua)}
.btn-sq-alt:hover{
  color:var(--aqua);transform:translateY(-2px);
  box-shadow:0 5px 12px -2px rgba(3,150,215,.22),0 24px 44px -16px rgba(3,150,215,.38);
}
.btn-sq-alt:hover .btn-sq-ico{background:var(--aqua);border-right-color:var(--aqua);color:#fff}
.btn-sq-block{display:flex;width:100%}
.btn-sq-block .btn-sq-lbl{flex:1;justify-content:center}
.btn-sq:disabled,.btn-sq-alt:disabled{opacity:.72;cursor:not-allowed;transform:none}
@supports not (corner-shape:bevel){
  .btn,.btn-sq,.btn-sq-alt{border-radius:0}
}


.cta-pro-right{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--line)}
.cta-pill{display:flex;flex-direction:column;justify-content:center;text-align:center;padding:clamp(6px,1.6vw,18px) clamp(10px,1.5vw,22px)}
.cta-pill+.cta-pill{border-left:1px solid var(--line)}
.cta-pill:nth-child(1){--ac:#ff3b00;--ac-soft:rgba(255,59,0,.09)}
.cta-pill:nth-child(2){--ac:#7c5cff;--ac-soft:rgba(124,92,255,.1)}
.cta-pill:nth-child(3){--ac:#0396d7;--ac-soft:rgba(3,150,215,.1)}
.cta-ic{
  width:64px;height:64px;margin:0 auto 15px;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--line-2);background:#fff;color:var(--ac);font-size:1.38rem;
  transition:transform .5s var(--ease-out),background .45s,color .45s,border-color .45s,box-shadow .45s;
}
.cta-pill:hover .cta-ic{background:var(--ac-soft);border-color:var(--ac);transform:translateY(-5px);box-shadow:0 14px 28px -14px var(--ac)}
.cta-pill h4{font-size:.95rem;letter-spacing:-.015em;margin-bottom:6px}
.cta-pill p{font-size:.83rem;line-height:1.58;margin:0}

/* ===== Footer ===== */
.foot{position:relative;padding-top:clamp(62px,7vw,96px);background:var(--dark);color:rgba(255,255,255,.62);overflow:hidden}
.foot::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(1100px 460px at 50% -14%,rgba(3,150,215,.11),transparent 64%),radial-gradient(700px 340px at 96% 88%,rgba(3,150,215,.06),transparent 62%)}
.foot>*{position:relative}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.35fr;gap:44px;padding-bottom:50px}
.foot-brand img{height:60px;width:auto;margin-bottom:22px}
.foot-brand p{font-size:.9rem;max-width:330px;color:rgba(255,255,255,.6)}
.foot h5{font-family:'Sora',sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:#fff;margin-bottom:19px}
.foot-links li{margin-bottom:10px}
.foot-links a{font-size:.89rem;color:rgba(255,255,255,.62);display:inline-flex;align-items:center;gap:8px;transform:translateX(-8px);transition:transform .35s var(--ease-out),color .35s}
.foot-links a::before{content:'';width:0;height:1.5px;background:var(--grad);border-radius:2px;transition:width .35s var(--ease-out)}
.foot-links a:hover{color:#fff;transform:none}
.foot-links a:hover::before{width:14px}
.foot-ci{display:flex;align-items:flex-start;gap:12px;margin-bottom:15px;font-size:.89rem;line-height:1.62;color:rgba(255,255,255,.62)}
.foot-ci i{color:var(--flame-2);font-size:1rem;line-height:inherit;flex-shrink:0}
.foot-ci a{color:rgba(255,255,255,.62)}
.foot-ci a:hover{color:#fff}
.soc{display:flex;gap:9px;margin-top:22px}
.soc a{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.75);font-size:.98rem;position:relative;overflow:hidden;transition:color .4s,transform .45s var(--ease-out),border-color .4s}
.soc a::before{content:'';position:absolute;inset:0;background:var(--grad);transform:translateY(101%);transition:transform .45s var(--ease-out)}
.soc a i{position:relative}
.soc a:hover{color:#fff;transform:translateY(-5px);border-color:transparent}
.soc a:hover::before{transform:translateY(0)}
.foot-bot{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;padding:22px 0;border-top:1px solid rgba(255,255,255,.1);font-size:.83rem;color:rgba(255,255,255,.5)}
.foot-bot a{color:rgba(255,255,255,.5)}
.foot-bot a:hover{color:#fff}
.foot-mark{font-family:'Sora',sans-serif;font-size:clamp(3rem,13vw,11rem);font-weight:800;letter-spacing:-.05em;line-height:.82;text-align:center;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.09);user-select:none;pointer-events:none;margin-bottom:-.15em;overflow:hidden}

/* ===== Back to top ===== */
.top-btn{
  position:fixed;right:26px;bottom:26px;z-index:1050;
  width:50px;height:50px;display:flex;align-items:center;justify-content:center;
  padding:0;border:0;cursor:pointer;font-size:1.05rem;color:#fff;
  background:var(--grad);box-shadow:0 14px 30px -12px rgba(255,59,0,.65);
  opacity:0;visibility:hidden;transform:translateY(15px);
  transition:opacity .3s ease,transform .3s ease,visibility .3s,background .4s var(--ease),box-shadow .4s var(--ease);
  animation:borderTransform 10s linear infinite alternate forwards;
}
.top-btn.show{opacity:1;visibility:visible;transform:translateY(0)}
.top-btn:hover{background:var(--grad-deep);box-shadow:0 18px 38px -12px rgba(190,45,0,.7)}
.top-btn svg{width:15px;height:15px;fill:currentColor;display:block;transition:transform .4s var(--ease-out)}
.top-btn:hover svg{transform:translateY(-2px)}
@keyframes borderTransform{
  0%,100%{border-radius:63% 37% 54% 46% / 55% 48% 52% 45%}
  14%{border-radius:40% 60% 54% 46% / 49% 60% 40% 51%}
  28%{border-radius:54% 46% 38% 62% / 49% 70% 30% 51%}
  42%{border-radius:61% 39% 55% 45% / 61% 38% 62% 39%}
  56%{border-radius:61% 39% 67% 33% / 70% 50% 50% 30%}
  70%{border-radius:50% 50% 34% 66% / 56% 68% 32% 44%}
  84%{border-radius:46% 54% 50% 50% / 35% 61% 39% 65%}
}

/* ===== Utilities ===== */
.mt-40{margin-top:38px}
.mb-0{margin-bottom:0}
.rel{position:relative}
.text-center{text-align:center}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line-2),transparent)}

/* ===== Responsive ===== */
@media (max-width:1199px){
  .hero-grid{gap:40px}
  .hero-float.f1{left:-2%}
  .hero-float.f2{right:0}
  .foot-grid{grid-template-columns:1.45fr 1fr 1fr 1.35fr;gap:28px}
}
@media (max-width:991px){
  :root{--nav-h:68px}
  .nav-menu{display:none}
  .burger{display:grid}
  .nav-cta .btn-sq{display:none}
  .hero{padding-top:calc(var(--nav-h) + 50px)}
  .hero-grid{grid-template-columns:1fr;gap:60px}
  .browser{transform:none}
  .scroll-cue{display:none}
  .split{grid-template-columns:1fr;gap:40px}
  .step-node em{display:none}
  .step-node b{width:46px;height:46px;font-size:.74rem}
  .step-line{top:22px}
  .step-card{grid-template-columns:1fr;gap:12px}
  .head-row{grid-template-columns:1fr;gap:26px;align-items:start}
  .cta-pro-grid{grid-template-columns:1fr;gap:44px}
  .cta-pro-right{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:36px}
  .split.flip>*:first-child{order:0}
  .proc-stick{position:static}
  .stats{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr;gap:42px 34px}
}
@media (max-width:767px){
  :root{--sp:clamp(58px,10vw,80px)}
  .cta-pro-right{grid-template-columns:1fr;gap:26px}
  .cta-pill{display:flex;align-items:flex-start;gap:16px;text-align:left;padding:0}
  .cta-pill+.cta-pill{border-left:0;border-top:1px solid var(--line);padding-top:26px}
  .cta-ic{margin:0;flex-shrink:0;width:52px;height:52px;font-size:1.2rem}
  .cta-dots{display:none}
  .container,.container-wide{width:100%;margin-inline:0;padding-inline:12px}
  .card-g{padding:26px}
  .foot-grid{grid-template-columns:1fr 1fr;gap:34px 26px}
  .hero-float.f3{display:none}
  .job{padding:22px}
  .tsm-card::before{display:none}
  .spec-row{grid-template-columns:1fr;gap:4px}
}
@media (max-width:479px){
  .foot-grid{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .hero-float{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
}


/* ===== 404 — Page Not Found (shared base) ===== */
.err404{
  position:relative;min-height:100vh;display:grid;place-items:center;overflow:hidden;
  padding:clamp(120px,14vw,168px) 0 clamp(64px,8vw,96px);
}
.err404::before,.err404::after{content:'';position:absolute;inset:0;pointer-events:none}
.err404::before{z-index:0}
.err404::after{z-index:1}
.err-wrap{position:relative;z-index:3;text-align:center;width:min(680px,90vw);margin:0 auto}
.err-logo{display:block;height:44px;width:auto;margin:0 auto 26px}

.err-badge{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:26px;padding:8px 18px 8px 14px;
  border-radius:99px;font-family:'Sora',sans-serif;font-size:.76rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;
}
.err-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--flame-2);box-shadow:0 0 0 4px rgba(255,122,47,.18)}

.err-num{
  display:flex;align-items:center;justify-content:center;gap:.06em;
  font-family:'Sora',sans-serif;font-weight:800;
  font-size:clamp(5rem,14vw,9rem);line-height:.85;letter-spacing:-.01em;
  margin-bottom:14px;
}
.err-num span{
  color:transparent;
  -webkit-text-stroke:2px var(--aqua);
  text-stroke:2px var(--aqua);
}
.err-num .err-num-o{color:transparent;-webkit-text-stroke:2px var(--aqua);text-stroke:2px var(--aqua)}

.err-wrap h1{font-size:clamp(1.6rem,3.4vw,2.35rem);line-height:1.2;letter-spacing:-.02em;margin:0 0 14px}
.err-wrap p{font-size:1rem;max-width:44ch;margin:0 auto;line-height:1.65}
.err-wrap p + p{margin-top:2px}

.err-act{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin:32px 0 40px}

.err-help{
  display:flex;align-items:center;gap:16px;text-align:left;
  padding:18px 22px;border-radius:var(--r-lg);margin:0 auto;max-width:540px;
}
.err-help-ic{
  flex-shrink:0;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:var(--grad);color:#fff;font-size:1.05rem;box-shadow:0 10px 22px -10px rgba(255,59,0,.55);
}
.err-help-txt{flex:1;min-width:0}
.err-help h4{font-family:'Sora',sans-serif;font-size:.96rem;font-weight:700;margin:0 0 3px}
.err-help p{margin:0;font-size:.86rem;line-height:1.5;max-width:none}
.err-help-link{
  flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  font-family:'Sora',sans-serif;font-size:.84rem;font-weight:600;
  white-space:nowrap;transition:gap .3s var(--ease)
}
.err-help-link:hover{gap:10px}

@media (max-width:576px){
  .err-act{flex-direction:column;align-items:stretch}
  .err-act .btn-sq,.err-act .btn-sq-alt{justify-content:center}
  .err-help{flex-direction:column;text-align:center;gap:12px}
  .err-help-link{margin-top:2px}
}

/* --- Variant: maintenance-style light background --- */
.err-maint{
  background-color:var(--bg-2);
  background-image:radial-gradient(rgba(11,18,32,.075) 1px,transparent 1px);
  background-size:22px 22px;
  animation:maintDots 30s linear infinite;
  color:var(--body);
}
.err-maint::before{
  background:
    radial-gradient(900px 420px at 12% 2%,rgba(255,59,0,.07),transparent 72%),
    radial-gradient(900px 420px at 88% 98%,rgba(3,150,215,.08),transparent 72%);
}
.err-maint::after{background:radial-gradient(96% 120% at 50% 50%,rgba(255,255,255,.72) 0%,transparent 62%)}
.err-maint .err-wrap h1{color:var(--ink)}
.err-maint .err-num .err-num-o{color:transparent}
.err-maint .err-badge{background:#fff;border:1px solid var(--line);color:var(--body);box-shadow:var(--sh-xs)}
.err-maint .err-help{background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs)}
.err-maint .err-help-link{color:var(--ac)}
.err-maint .err-help-link i{color:var(--ac)}

/* --- Variant: loading-screen-style dark background --- */
.err-load{
  background-color:#0a1424;
  background-image:
    radial-gradient(780px 470px at 10% 8%, rgba(3,150,215,.24), transparent 64%),
    radial-gradient(840px 490px at 88% 78%, rgba(56,192,245,.16), transparent 64%),
    radial-gradient(620px 350px at 62% 4%, rgba(124,92,255,.14), transparent 66%),
    radial-gradient(rgba(255,255,255,.075) 1px,transparent 1px);
  background-size:auto,auto,auto,22px 22px;
  color:rgba(255,255,255,.7);
}
.err-load::before{
  left:50%;top:50%;transform:translate(-50%,-50%);position:absolute;
  width:min(1040px,150vw);height:min(790px,124vh);border-radius:50%;inset:auto;
  background:
    radial-gradient(closest-side at 64% 98%,rgba(124,92,255,.11),transparent 62%),
    radial-gradient(closest-side,rgba(9,21,44,.62),rgba(9,21,44,.28) 54%,transparent 82%);
  backdrop-filter:blur(12px) saturate(135%);-webkit-backdrop-filter:blur(12px) saturate(135%);
  -webkit-mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.5) 66%,transparent 88%);
  mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.5) 66%,transparent 88%);
}
.err-load::after{content:none}
.err-load .err-wrap h1{color:#fff}
.err-load .err-num .err-num-o{color:transparent}
.err-load .err-badge{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85)}
.err-load .err-help{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.err-load .err-help h4{color:#fff}
.err-load .err-help-link{color:var(--flame-2)}
.err-load .err-help-link i{color:var(--flame-2)}


/* ===== Under maintenance ===== */
.maint-body{background:var(--bg-2)}
.maint{
  position:relative;min-height:100vh;display:grid;place-items:center;overflow:hidden;
  padding:clamp(56px,8vw,104px) 0;
  background-color:var(--bg-2);
  background-image:radial-gradient(rgba(11,18,32,.075) 1px,transparent 1px);
  background-size:22px 22px;
  animation:maintDots 30s linear infinite;
}
@keyframes maintDots{to{background-position:22px 22px}}
.maint::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 420px at 12% 2%,rgba(255,59,0,.07),transparent 72%),
    radial-gradient(900px 420px at 88% 98%,rgba(3,150,215,.08),transparent 72%);
}
.maint::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(96% 120% at 50% 50%,rgba(255,255,255,.72) 0%,transparent 62%);
}

.maint-in{position:relative;z-index:3;text-align:center;width:min(620px,88vw)}
.maint-logo{display:block;height:56px;width:auto;margin:0 auto 30px}
.maint-badge{
  display:inline-flex;align-items:center;gap:14px;margin-bottom:18px;
  font-family:'Sora',sans-serif;font-size:.78rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--aqua);
}
.maint-badge::after{content:'';width:38px;height:2px;border-radius:2px;background:var(--aqua);opacity:.5}
.maint-in h1{font-size:clamp(1.85rem,4vw,2.85rem);line-height:1.13;margin:0 0 16px;letter-spacing:-.02em}
.maint-in h1 span{color:var(--flame)}
.maint-in p{font-size:1.01rem;max-width:46ch;margin:0 auto 32px}
.maint-act{display:flex;justify-content:center}


/* ===== Laptop device (photo) ===== */
.device{position:relative;z-index:2;width:128%;margin-left:-14%;transform-style:preserve-3d;will-change:transform}
.dev-img{
  display:block;width:100%;height:auto;
  filter:drop-shadow(0 34px 44px rgba(3,8,18,.75));
  transition:opacity .5s var(--ease);
}
.dev-screen,.dev-keys{transition:opacity .35s var(--ease)}

.dev-screen{
  position:absolute;left:20%;top:12%;right:20%;height:50%;
  overflow:hidden;border-radius:2px;background:#f4f7fb;
  display:flex;flex-direction:column;
}
.dev-screen::after{
  content:'';position:absolute;inset:0;z-index:6;pointer-events:none;
  background:linear-gradient(116deg,rgba(255,255,255,.13) 0 15%,rgba(255,255,255,.04) 27%,transparent 44%);
}
.device .browser{
  flex:1;min-height:0;display:flex;flex-direction:column;
  transform:none;border:0;border-radius:0;box-shadow:none;overflow:hidden;background:#fff;
}
.hero-vis:hover .device .browser{transform:none}
.device .browser-bar{flex-shrink:0;padding:.38em .6em;background:#f4f7fb;font-size:clamp(5px,.52vw,7.4px);white-space:nowrap;overflow:hidden}
.device .browser-bar em{width:6px;height:6px}
.device .lims{flex:1;min-height:0;aspect-ratio:auto}

/* key flashes mapped onto the photo keyboard */
.dev-keys{position:absolute;inset:0;z-index:3;pointer-events:none}
.dkr{position:absolute;display:flex;gap:.5%}
.dkr1{left:21.25%;width:57.63%;top:67.83%;height:1.17%}
.dkr2{left:21.00%;width:58.25%;top:69.00%;height:1.67%}
.dkr3{left:21.50%;width:57.00%;top:70.67%;height:1.83%}
.dkr4{left:21.25%;width:57.63%;top:72.50%;height:1.83%}
.dkr5{left:20.88%;width:58.38%;top:74.33%;height:2.00%}
.dkr6{left:20.38%;width:59.25%;top:76.33%;height:2.50%}
.dk{position:relative;flex:var(--u,1) 1 0;border-radius:1px;background:transparent}
.dk::before,.dk::after{content:'';position:absolute;inset:0;border-radius:inherit}
.dk[style*="--kd"]{animation:keyTap var(--T,25s) linear infinite;animation-delay:var(--kd)}
.dk[style*="--kd2"]::before{animation:keyTap var(--T,25s) linear infinite;animation-delay:var(--kd2)}
.dk[style*="--kd3"]::after{animation:keyTap var(--T,25s) linear infinite;animation-delay:var(--kd3)}
@keyframes keyTap{
  0%,.08%{background:transparent;box-shadow:none}
  .28%{background:rgba(126,206,255,.9);box-shadow:0 0 .45em rgba(96,180,240,.95)}
  .5%{background:rgba(126,206,255,.5);box-shadow:0 0 .28em rgba(96,180,240,.5)}
  .8%,100%{background:transparent;box-shadow:none}
}

/* ===== Hero LIMS billing workflow ===== */
.lims{
  --T:25s;
  --navy:#1b2842; --blue:#2f5d9e; --blue2:#3f7fd0; --teal:#00a99d; --grn:#22b573;
  --ln:#e0e7f1; --fld:#eef2f7; --focus:#fffbdd; --thead:#eaf1fa;
  --red:#e2574c;
  position:relative;display:flex;aspect-ratio:16/10;overflow:hidden;
  background:#f4f7fb;font-family:'Inter',sans-serif;color:#233149;
  font-size:clamp(5.4px,.66vw,9px);line-height:1.35;
}

/* ---- rail + flyout ---- */
.a-rail{width:2.7em;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:.55em;padding:.75em 0;background:var(--navy);z-index:4}
.ar-logo{width:1.35em;height:1.35em;border-radius:.38em;background:linear-gradient(135deg,var(--grn),#3fa9e0);margin-bottom:.25em}
.ar-i{width:1.1em;height:1.1em;border-radius:.28em;background:rgba(255,255,255,.15)}
.ar-i.on{background:var(--blue2)}
.ar-i.pt{animation:arOn var(--T) linear infinite;animation-delay:1.9s}
@keyframes arOn{0%,.576%{background:rgba(255,255,255,.15);color:rgba(255,255,255,.55)}1.7%,6.82%{background:var(--blue2);color:#fff}8.6%,100%{background:rgba(255,255,255,.15);color:rgba(255,255,255,.55)}}

.a-fly{
  position:absolute;top:0;bottom:0;left:2.7em;width:12.6em;z-index:5;
  display:flex;flex-direction:column;gap:.08em;padding:.7em .5em;
  background:#22304e;opacity:0;transform:translateX(-.8em);
  animation:aFly var(--T) var(--ease-out) infinite;animation-delay:1.95s;
}
@keyframes aFly{0%{opacity:0;transform:translateX(-.8em)}1.344%{opacity:1;transform:none}6.816%{opacity:1;transform:none}8.33%,100%{opacity:0;transform:translateX(-.5em)}}
.af-s{display:flex;align-items:center;gap:.45em;margin:0 .1em .5em;padding:.4em .55em;border-radius:.28em;background:rgba(255,255,255,.08);color:rgba(255,255,255,.45);font-size:.85em}
.af-t{padding:.36em .55em;border-radius:.28em;color:rgba(255,255,255,.82);font-size:.93em;font-weight:500}
.af-t.open{color:#fff}
.af-i{padding:.3em .55em .3em 1.4em;border-radius:.28em;color:rgba(255,255,255,.55);font-size:.88em;position:relative}
.af-i::before{content:'';position:absolute;left:.72em;top:50%;width:.32em;height:1px;background:currentColor;opacity:.8}
.af-i.on{background:rgba(255,255,255,.14);color:#fff;animation:aFlyOn var(--T) var(--ease) infinite;animation-delay:1.95s}
@keyframes aFlyOn{0%,2.718%{background:transparent;color:rgba(255,255,255,.55)}4.3%,100%{background:rgba(255,255,255,.14);color:#fff}}

/* ---- chrome ---- */
.a-main{flex:1;display:flex;flex-direction:column;min-width:0;background:#f4f7fb}
.a-top{display:flex;align-items:center;padding:.42em .9em;background:#fff;border-bottom:1px solid var(--ln)}
.a-branch{font-size:.98em;font-weight:600}
.a-branch b{color:var(--blue2)}
.a-usr{margin-left:auto;display:flex;align-items:center;gap:.45em}
.a-usr i{width:1.35em;height:1.35em;border-radius:50%;background:var(--blue2)}
.a-usr em{font-style:normal;font-size:.86em;color:#4a5568}
.a-title{display:flex;align-items:center;justify-content:space-between;padding:.36em .9em;background:linear-gradient(180deg,#3a6cae,#2c568f);color:#fff}
.at-set{display:grid}
.at-set i{grid-area:1/1;font-style:normal;font-size:.92em;font-weight:600;letter-spacing:.09em;text-transform:uppercase;opacity:0}
.at-set .t1{animation:atS1 var(--T) var(--ease) infinite}
.at-set .t2{animation:atS2 var(--T) var(--ease) infinite;animation-delay:3.9s}
.at-set .t3{animation:atS3 var(--T) var(--ease) infinite;animation-delay:19.9s}
@keyframes atS1{0%{opacity:1}15.2%{opacity:1}16%,100%{opacity:0}}
@keyframes atS2{0%{opacity:0}.86%{opacity:1}63.2%{opacity:1}64%,100%{opacity:0}}
@keyframes atS3{0%{opacity:0}.86%{opacity:1}19.2%{opacity:1}20%,100%{opacity:0}}
.at-crumb{width:3.2em;height:.42em;border-radius:.25em;background:rgba(255,255,255,.35)}

/* ---- stage ---- */
.a-stage{position:relative;flex:1;overflow:hidden}
.lscr{position:absolute;inset:0;padding:.58em;opacity:0;display:flex;flex-direction:column;animation:lscr var(--T) var(--ease) infinite}
@keyframes lscr{
  0%{opacity:0;transform:translateY(.5em) scale(.995)}
  1.327%{opacity:1;transform:none}
  6.281%{opacity:1;transform:none}
  7.37%{opacity:0;transform:translateY(-.35em) scale(.997)}
  100%{opacity:0;transform:translateY(.5em) scale(.995)}
}
.lscr.s1{animation-delay:0s}
.lscr.s2{animation-delay:2s}
.lscr.s3{animation-delay:4s}
.lscr.s4{animation-delay:6s}
.lscr.s5{animation-delay:8s}
.lscr.s6{animation-delay:10s}
.lscr.s7{animation-delay:12s}
.lscr.s8{animation-delay:14s}
.lscr.s9{animation-delay:16s}
.lscr.s10{animation-delay:18s}
.lscr.s11{animation-delay:20s}
.lscr.s12{animation-delay:22s;animation-name:lscrLast}
@keyframes lscrLast{
  0%{opacity:0;transform:translateY(.5em) scale(.995)}
  1.44%{opacity:1;transform:none}
  10.8%{opacity:1;transform:none}
  12%{opacity:0;transform:translateY(-.35em) scale(.997)}
  100%{opacity:0;transform:translateY(.5em) scale(.995)}
}

.a-card{position:relative;background:#fff;border:1px solid var(--ln);border-radius:.45em;padding:.5em .6em;box-shadow:0 4px 14px -10px rgba(22,35,63,.55)}
.ac-h{display:flex;align-items:center;padding-left:.5em;margin-bottom:.4em;font-size:1.02em;font-weight:600;color:#1f3355;border-left:.22em solid #ff6a1c}
.ac-h em{margin-left:auto;font-style:normal;font-size:.74em;font-weight:500;color:#5a6b85;background:#f2f6fb;border:1px solid var(--ln);border-radius:.28em;padding:.12em .45em}
.ac-h .ac-b{color:var(--blue2);background:#eef5fd;border-color:#cfe1f6}

/* ---- dashboard ---- */
.a-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:.45em;margin-bottom:.5em}
.a-kpi i{font-style:normal;display:flex;align-items:flex-start;gap:.4em;padding:.45em .5em;border-radius:.42em;border:1px solid rgba(22,35,63,.06)}
.a-kpi .ki{width:1.5em;height:1.5em;flex-shrink:0;border-radius:.3em;background:#fff;box-shadow:0 2px 5px -3px rgba(22,35,63,.6);text-decoration:none;position:relative}
.a-kpi .ki::after{content:'';position:absolute;inset:.4em;border-radius:.1em;background:currentColor;opacity:.85}
.a-kpi small{display:block;font-size:.72em;letter-spacing:.03em;text-transform:uppercase;color:#5a6b85}
.a-kpi u{display:block;text-decoration:none;font-size:.72em;color:#6b7c96}
.a-kpi b{display:block;font-family:'Sora',sans-serif;font-size:1.02em;color:#1f3355}
.a-kpi .k1{background:#e9f3fd;color:#2f7fd0}
.a-kpi .k2{background:#eeeefb;color:#6b5ce0}
.a-kpi .k3{background:#e6f7ef;color:#1ba86f}
.a-kpi .k4{background:#fdedec;color:#e2574c}
.a-kpi .k1 b{color:#1ba86f}
.a-kpi .k2 u,.a-kpi .k3 u,.a-kpi .k4 u{color:var(--blue2)}
.a-panels{flex:1;display:grid;grid-template-columns:1fr 1.05fr .95fr;gap:.5em;min-height:0}
.a-panels .a-card{display:flex;flex-direction:column;min-height:0}
.ac-body{flex:1;display:flex;align-items:center;gap:.55em;min-height:0}
.a-donut{
  position:relative;width:5.2em;height:5.2em;border-radius:50%;flex-shrink:0;
  background:conic-gradient(#22b573 0 79%,#f5a623 79% 80.5%,#f47f8f 80.5% 87%,#2f7fd0 87% 100%);
}
.a-donut::before{content:'';position:absolute;inset:20%;border-radius:50%;background:#fff}
.a-donut b{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.66em;font-weight:400;color:#6b7c96}
.a-donut u{text-decoration:none;font-family:'Sora',sans-serif;font-size:1.08em;font-weight:700;color:#1f3355}
.a-leg{list-style:none;margin:0;padding:0;flex:1;font-size:.8em}
.a-leg li{display:flex;align-items:center;gap:.35em;padding:.12em 0;color:#4a5568}
.a-leg s{width:.46em;height:.46em;border-radius:50%;background:#2f7fd0;text-decoration:none}
.a-leg li:nth-child(2) s{background:#22b573}
.a-leg li:nth-child(3) s{background:#f5a623}
.a-leg li:nth-child(4) s{background:#f47f8f}
.a-leg b{margin-left:auto;color:#233149;font-weight:600}
.a-bars{flex:1;height:100%;display:flex;align-items:flex-end;gap:.2em}
.a-bars s{flex:1;border-radius:.12em .12em 0 0;background:#f5a623;text-decoration:none;transform-origin:bottom;animation:aBar 2.4s var(--ease) infinite alternate}
.a-bars s:nth-child(3n){background:#2f7fd0}
.a-bars s:nth-child(7){background:#e2574c}
.a-bars s:nth-child(1){height:24%;animation-delay:-.1s}.a-bars s:nth-child(2){height:12%;animation-delay:-.3s}
.a-bars s:nth-child(3){height:9%;animation-delay:-.5s}.a-bars s:nth-child(4){height:16%;animation-delay:-.7s}
.a-bars s:nth-child(5){height:22%;animation-delay:-.9s}.a-bars s:nth-child(6){height:14%;animation-delay:-1.1s}
.a-bars s:nth-child(7){height:44%;animation-delay:-1.3s}.a-bars s:nth-child(8){height:10%;animation-delay:-1.5s}
.a-bars s:nth-child(9){height:78%;animation-delay:-1.7s}.a-bars s:nth-child(10){height:36%;animation-delay:-1.9s}
.a-bars s:nth-child(11){height:46%;animation-delay:-2.1s}.a-bars s:nth-child(12){height:40%;animation-delay:-2.3s}
.a-bars s:nth-child(13){height:30%;animation-delay:-.6s}.a-bars s:nth-child(14){height:56%;animation-delay:-1.8s}
@keyframes aBar{from{transform:scaleY(.82)}to{transform:scaleY(1)}}
.a-line{
  flex:1;height:100%;
  background:
    linear-gradient(180deg,transparent 0 96%,#eef3f9 96%) 0 0/100% 25%,
    conic-gradient(from 0deg,transparent 0) 0 0;
  position:relative;
}
.a-line::before{
  content:'';position:absolute;inset:12% 0 6%;
  background:
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 0 100%/8.5% 22% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 16% 100%/8.5% 58% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 32% 100%/8.5% 90% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 48% 100%/8.5% 34% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 64% 100%/8.5% 46% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 80% 100%/8.5% 40% no-repeat,
    linear-gradient(90deg,#f9c2ce 0 5%,transparent 5%) 96% 100%/8.5% 62% no-repeat;
  background-repeat:no-repeat;
}
.a-line::after{
  content:'';position:absolute;left:0;right:0;top:16%;bottom:8%;
  clip-path:polygon(0 88%,10% 84%,20% 26%,30% 60%,42% 8%,54% 66%,64% 40%,74% 58%,84% 22%,94% 74%,100% 80%,100% 100%,0 100%);
  background:linear-gradient(180deg,rgba(0,169,157,.22),transparent 70%);
  border-top:0;
}
@media (max-width:1199px){.a-panels{grid-template-columns:1fr 1fr}.a-panels .a-card:last-child{display:none}}

/* ---- S2 dim ---- */
.a-dim{position:absolute;inset:0;background:rgba(22,35,63,.3)}

/* ---- form ---- */
.a-form{flex:1;display:flex;flex-direction:column;min-height:0}
.a-fs{border:1px solid var(--ln);border-radius:.34em;padding:.36em .5em .46em;margin:0 0 .4em}
.a-fs legend{padding:0 .32em;font-size:.8em;font-weight:600;color:#5a6b85}
.a-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.34em}
.a-grid.g2{grid-template-columns:repeat(2,1fr)}
.a-f{display:block;position:relative}
.a-f>span{display:block;font-size:.74em;color:#5a6b85;margin-bottom:.12em}
.a-f>em{
  display:block;font-style:normal;font-size:.86em;min-height:1.6em;line-height:1.6em;
  padding:0 .5em;border:1px solid var(--ln);border-radius:.26em;background:var(--fld);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.a-wide{margin-bottom:.5em}
.a-focus>em{background:var(--focus);border-color:#e3ce74}
.a-sel>em{background:#fff;border-color:#b9c7da}

/* typing */
.ty{position:relative;display:inline-block;white-space:nowrap;font-weight:inherit}
.ty::after{
  content:'';position:absolute;top:.1em;bottom:.1em;right:-1px;left:0;
  background:var(--focus);
  animation:tyRun var(--T) steps(4,end) infinite;
}
.ty::before{
  content:'';position:absolute;top:.12em;bottom:.12em;width:1px;background:#233149;z-index:1;
  animation:tyCaret var(--T) steps(1,end) infinite;
}
@keyframes tyRun{0%{left:0}1.402%{left:100%}100%{left:100%}}
@keyframes tyCaret{
  0%{left:0;opacity:1}
  1.346%{left:100%;opacity:1}
  1.797%{opacity:0}2.212%{opacity:1}2.627%{opacity:0}3.041%{opacity:1}
  5.622%{left:100%;opacity:0}100%{opacity:0}
}
.ty1::after,.ty1::before{animation-delay:6.45s}
.ty2::after,.ty2::before{animation-delay:8.45s}
.ty3::after,.ty3::before{animation-delay:10.45s}
.ty4::after,.ty4::before{animation-delay:16.45s}
.ty5::after,.ty5::before{animation-delay:18.55s}

.a-val{color:transparent;animation:aVal var(--T) var(--ease) infinite}
@keyframes aVal{0%{color:transparent}1.248%{color:#233149}6.816%{color:#233149}8.33%,100%{color:transparent}}
@keyframes aFadeIn{0%{opacity:0}1.198%{opacity:1}6.543%{opacity:1}8.33%,100%{opacity:0}}
.v1{animation-delay:7.5s}.v2{animation-delay:7.58s}.v3{animation-delay:7.66s}.v4{animation-delay:7.74s}

.a-drop{
  position:absolute;z-index:6;top:calc(100% + 2px);left:0;
  background:#fff;border:1px solid #b9c7da;border-radius:.26em;
  box-shadow:0 12px 24px -12px rgba(22,35,63,.8);
  opacity:0;transform:translateY(-.3em);
  animation:aDrop var(--T) var(--ease-out) infinite;
}
.d-pat{width:19em;animation-delay:7s}
.d-dr{width:17em;animation-delay:9s}
.d-test{width:25em;animation-delay:11s}
.d-disc{width:11.5em;animation-delay:15s}
@keyframes aDrop{0%{opacity:0;transform:translateY(-.3em)}1.056%{opacity:1;transform:none}4.8%{opacity:1;transform:none}6.1%,100%{opacity:0;transform:translateY(-.2em)}}
.ad-i{display:block;padding:.28em .5em;font-size:.84em;color:#33465f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-i.on{background:#2b3f66;color:#fff;font-weight:600}

.a-tbl{width:100%;border-collapse:collapse;font-size:.84em}
.a-tbl th{background:var(--thead);color:#1f4f8f;font-weight:600;text-align:left;padding:.3em .45em;border-bottom:1px solid var(--ln)}
.a-tbl td{padding:.3em .45em;border-bottom:1px solid #f0f4f9;color:#33465f}
.a-tbl th:last-child,.a-tbl td:last-child{text-align:right}
.a-tbl-sm{font-size:.79em}
.a-tbl .r1,.a-tbl .r2,.a-tbl .r3{opacity:0;animation:aFadeIn var(--T) var(--ease) infinite}
.a-tbl .r1{animation-delay:10.1s}.a-tbl .r2{animation-delay:10.2s}.a-tbl .r3{animation-delay:12.4s}
.chip{display:inline-block;padding:.06em .4em;border-radius:.2em;background:#e9f3fd;color:#2f6cb5;font-size:.92em;text-decoration:none;white-space:nowrap}
.a-tot-strip{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding:.5em .7em;border-radius:.34em;background:#f2f7fc;border:1px solid #dbe8f6;font-size:.94em}
.a-tot-strip b{font-family:'Sora',sans-serif;font-size:1.12em;color:var(--blue)}

/* ---- split / summary ---- */
.a-split{flex:1;display:grid;grid-template-columns:1.12fr 1fr;gap:.5em;min-height:0}
.a-split .a-card{display:flex;flex-direction:column;min-height:0}
.a-sum-row{display:flex;align-items:baseline;justify-content:space-between;padding:.24em 0;font-size:.9em}
.a-sum-row b{font-family:'Sora',sans-serif}
.a-sum-row.sm{font-size:.8em;color:#5a6b85;padding:.1em 0}
.a-sum-row.big{border-top:1px solid var(--ln);margin-top:.2em;padding-top:.34em;font-size:1.02em}
.a-sum-row.big b{color:var(--blue)}
.a-sum .a-fs{margin-top:.4em}
.d0{animation-delay:15.55s}.d3{animation-delay:16.9s}.d3r{animation-delay:17.05s}
.a-sum-row .d3b{opacity:0;animation:aFadeIn var(--T) var(--ease) infinite;animation-delay:17s}
.a-sum-row .d4{opacity:0;animation:aFadeIn var(--T) var(--ease) infinite;animation-delay:17.1s}
.pd{color:#1ba86f}.due{color:var(--red)}

.a-btn{
  margin-top:auto;align-self:flex-end;padding:.36em .95em;color:#fff;background:var(--teal);
  font-family:'Sora',sans-serif;font-size:.86em;font-weight:600;border-radius:.24em;
  box-shadow:0 5px 12px -7px rgba(0,169,157,.9);
}
.a-prn{background:var(--blue);box-shadow:0 5px 12px -7px rgba(47,93,158,.9)}
.a-save{animation:aPress var(--T) var(--ease-out) infinite;animation-delay:19.35s}
.a-prn{animation:aPress var(--T) var(--ease-out) infinite;animation-delay:21.4s}
@keyframes aPress{0%,.528%{transform:none;filter:none}1.344%{transform:scale(.94);filter:brightness(.86)}2.7%,100%{transform:none;filter:none}}

/* ---- bill details ---- */
.lscr.s11 .a-card{flex:1;display:flex;flex-direction:column;min-height:0}
.a-book{display:grid;grid-template-columns:repeat(4,1fr);gap:.35em;padding:.45em .55em;margin-bottom:.45em;border:1px solid var(--ln);border-radius:.34em;background:#fafcfe}
.a-book small{display:block;font-size:.72em;color:#6b7c96}
.a-book b{font-size:.84em;color:#33465f}
.a-bill{flex:1;display:grid;grid-template-columns:1.5fr 1fr;gap:.55em;min-height:0}
.a-paid{margin-top:.35em;font-size:.82em;color:#5a6b85}
.a-paid s{display:inline-block;margin-left:.3em;padding:.12em .5em;border-radius:.2em;background:#e6f7ef;color:#177a4d;font-weight:600;text-decoration:none}

/* ---- print ---- */
.a-print{flex:1;position:relative}
@keyframes aLed{0%,46.08%{opacity:1}51%,100%{opacity:.2}}
.ap-paper{
  position:absolute;left:50%;bottom:.15em;width:94%;padding:.35em .42em .24em;
  background:#fff;border:1px solid var(--ln);border-radius:.18em;overflow:hidden;
  box-shadow:0 10px 22px -14px rgba(22,35,63,.85);
  transform:translate(-50%,99.84%);font-size:.66em;
  animation:aPaper var(--T) var(--ease-out) infinite;animation-delay:22.2s;
}
@keyframes aPaper{0%{transform:translate(-50%,99.84%)}3.552%{transform:translate(-50%,1.92%)}5.2%,100%{transform:translate(-50%,0)}}
.ap-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.6em;padding-bottom:.4em;border-bottom:2px solid #2f7fd0}
.ap-logo{height:1.6em;max-width:34%;width:auto;object-fit:contain}
.ap-org{text-align:right;font-family:'Sora',sans-serif;font-size:.86em;font-weight:700;color:#1f3355}
.ap-org em{display:block;font-family:'Inter',sans-serif;font-style:normal;font-size:.86em;font-weight:600;color:#33465f;margin-top:.15em}
.ap-org u{display:block;text-decoration:none;font-family:'Inter',sans-serif;font-size:.86em;font-weight:700;color:#1f3355}
.ap-info{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5em;padding:.45em 0 .4em;border-bottom:1px solid #e6eff8}
.ap-info .ap-col:last-of-type{justify-self:end}
.ap-col{display:flex;flex-direction:column;gap:.08em;font-size:.78em}
.ap-col span{display:grid;grid-template-columns:5.6em .5em 1fr;gap:.12em}
.ap-col i{font-style:normal;color:#33465f}
.ap-col b{color:#1f3355;white-space:nowrap}
.ap-qrw{display:flex;flex-direction:column;align-items:center;gap:.12em;flex-shrink:0}
.ap-qr{width:2.5em;height:2.5em;background:repeating-conic-gradient(#12203a 0 25%,#fff 0 50%) 0 0/.4em .4em}
.ap-qrw small{font-size:.6em;font-weight:600;color:#33465f}
.ap-band{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:.38em 0}
.ap-tag{grid-column:2;padding:.26em 1.5em;border-radius:1.6em;background:#e6f0fb;color:#1f6dc0;font-family:'Sora',sans-serif;font-size:.85em;font-weight:700;letter-spacing:.06em}
.ap-st{grid-column:3;justify-self:end;padding:.24em .65em;border-radius:.2em;background:#eef5fc;font-size:.75em;font-weight:600;color:#33465f;white-space:nowrap}
.ap-st b{margin-left:.25em;color:#17a54a;font-size:1.08em}
.ap-tbl{width:100%;border-collapse:collapse;font-size:.73em}
.ap-tbl th{background:#e6f0fb;color:#1f6dc0;font-weight:700;text-align:center;padding:.26em .32em;border:1px solid #d5e5f6}
.ap-tbl td{padding:.24em .32em;border:1px solid #e6eff8;color:#33465f;text-align:center}
.ap-tbl th,.ap-tbl td{white-space:nowrap}
.ap-org em,.ap-col i{white-space:nowrap}
.ap-tbl td:nth-child(2),.ap-tbl th:nth-child(2),.ap-tbl td:nth-child(3),.ap-tbl th:nth-child(3){text-align:left}
.ap-tbl td:last-child,.ap-tbl th:last-child{text-align:right}
.ap-foot{display:flex;gap:.6em;align-items:flex-start;justify-content:flex-end;margin-top:.42em}
.ap-tot{width:15.5em;flex-shrink:0;font-size:.66em;border:1px solid #cfe0f3;border-radius:.12em;overflow:hidden}
.ap-tot div{display:flex;justify-content:space-between;gap:1em;padding:.26em .55em;border-bottom:1px solid #dfeaf7}
.ap-tot div:last-child{border-bottom:0}
.ap-tot span,.ap-tot b{white-space:nowrap}
.ap-tot b{font-weight:600;color:#1f3355}
.ap-tot .hl{background:#eaf3fc}
.ap-tot .hl span,.ap-tot .hl b{font-weight:700}
.ap-tag-line{margin-top:.5em;padding-top:.4em;border-top:1px solid #e6eff8;text-align:center}
.ap-tag-line span{font-size:.72em;font-weight:700;letter-spacing:.04em;color:#1f6dc0}

/* ---- realism additions ---- */
.ar-i{display:grid;place-items:center;color:rgba(255,255,255,.55);font-size:.66em}
.ar-i.on{color:#fff}
.a-ico{margin-left:auto;display:flex;align-items:center;gap:.8em;color:#8fa2bb;font-size:.9em}
.a-usr{margin-left:1em}
.a-foot{display:flex;justify-content:space-between;padding:.28em .9em;background:#fff;border-top:1px solid var(--ln);font-size:.76em;color:#9aa8bd}
.a-chat{
  position:absolute;right:.8em;bottom:2.2em;z-index:7;
  width:1.9em;height:1.9em;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(140deg,#6b5ce0,#4f7ff0);color:#fff;font-size:.9em;
  box-shadow:0 8px 18px -8px rgba(79,127,240,.9);
}
.a-line{flex:1;width:100%;height:100%;overflow:visible}
.al-area{fill:rgba(0,169,157,.14)}
.al-ln{fill:none;stroke:#00a99d;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;
  stroke-dasharray:260;stroke-dashoffset:260;animation:alDraw 2.6s var(--ease-out) infinite}
@keyframes alDraw{0%{stroke-dashoffset:260}42%,100%{stroke-dashoffset:0}}
.a-tbl tr.flash td{animation:rowFlash var(--T) var(--ease) infinite;animation-delay:12.4s}
@keyframes rowFlash{0%,0.922%{background:rgba(0,169,157,.22)}4.5%,100%{background:transparent}}
.a-toast{
  position:absolute;right:.7em;bottom:.7em;z-index:8;
  display:inline-flex;align-items:center;gap:.45em;
  padding:.42em .8em;border-radius:.34em;
  background:#0f7a54;color:#fff;font-size:.84em;font-weight:600;
  box-shadow:0 10px 20px -12px rgba(15,122,84,.95);opacity:0;
  animation:aToast var(--T) var(--ease-out) infinite;animation-delay:19.65s;
}
@keyframes aToast{0%{opacity:0;transform:translateY(.6em)}0.96%{opacity:1;transform:none}4.8%{opacity:1;transform:none}6.2%,100%{opacity:0;transform:translateY(.3em)}}

/* ---- cursor ---- */
.lims-cur{
  position:absolute;z-index:10;left:52%;top:50%;pointer-events:none;
  translate:-.18em -.43em;
  font-size:clamp(9px,1.02vw,14px);color:#0b1220;
  filter:drop-shadow(0 2px 5px rgba(22,35,63,.55));
  animation:limsCur var(--T) var(--ease-out) infinite;
}
.lims-cur .bi{display:block;transform:rotate(-12deg)}
@keyframes limsCur{
  0%{left:55%;top:56%}
  4%{left:34%;top:62%}
  6.92%{left:2.89%;top:22.38%}
  7.36%{left:2.89%;top:22.38%;transform:scale(.74)}
  7.8%{left:2.89%;top:22.38%;transform:scale(1)}
  10.92%{left:19.31%;top:45.02%}
  11.36%{left:19.31%;top:45.02%;transform:scale(.74)}
  11.8%{left:19.31%;top:45.02%;transform:scale(1)}
  19.5%{left:37.98%;top:46.30%}
  24.92%{left:23.97%;top:42.61%}
  25.36%{left:23.97%;top:42.61%;transform:scale(.74)}
  25.8%{left:23.97%;top:42.61%;transform:scale(1)}
  29.32%{left:30.25%;top:58.33%}
  29.76%{left:30.25%;top:58.33%;transform:scale(.74)}
  30.2%{left:30.25%;top:58.33%;transform:scale(1)}
  32.92%{left:81.82%;top:42.44%}
  33.36%{left:81.82%;top:42.44%;transform:scale(.74)}
  33.8%{left:81.82%;top:42.44%;transform:scale(1)}
  37.32%{left:85.95%;top:51.98%}
  37.76%{left:85.95%;top:51.98%;transform:scale(.74)}
  38.2%{left:85.95%;top:51.98%;transform:scale(1)}
  40.92%{left:52.9%;top:33.21%}
  41.36%{left:52.9%;top:33.21%;transform:scale(.74)}
  41.8%{left:52.9%;top:33.21%;transform:scale(1)}
  45.32%{left:35.38%;top:48.93%}
  45.76%{left:35.38%;top:48.93%;transform:scale(.74)}
  46.2%{left:35.38%;top:48.93%;transform:scale(1)}
  53.79%{left:64.69%;top:46.99%}
  59.12%{left:77.38%;top:43.98%}
  59.56%{left:77.38%;top:43.98%;transform:scale(.74)}
  60%{left:77.38%;top:43.98%;transform:scale(1)}
  61.52%{left:71.15%;top:59.3%}
  61.96%{left:71.15%;top:59.3%;transform:scale(.74)}
  62.4%{left:71.15%;top:59.3%;transform:scale(1)}
  64.92%{left:67.92%;top:54.32%}
  65.36%{left:67.92%;top:54.32%;transform:scale(.74)}
  65.8%{left:67.92%;top:54.32%;transform:scale(1)}
  73.32%{left:77.38%;top:68.65%}
  73.76%{left:77.38%;top:68.65%;transform:scale(.74)}
  74.2%{left:77.38%;top:68.65%;transform:scale(1)}
  76.52%{left:90.96%;top:85.97%}
  76.96%{left:90.96%;top:85.97%;transform:scale(.74)}
  77.4%{left:90.96%;top:85.97%;transform:scale(1)}
  84.72%{left:89.79%;top:85.97%}
  85.16%{left:89.79%;top:85.97%;transform:scale(.74)}
  85.6%{left:89.79%;top:85.97%;transform:scale(1)}
  94%,100%{left:55%;top:56%}
}

@media (prefers-reduced-motion:reduce){
  .lims *,.lims{animation:none !important}
  .lscr.s9{opacity:1}
  .lims-cur,.a-fly,.lgn{display:none}
}

/* ===== Responsive: home page ===== */
@media (max-width:1199px){
  .device{width:112%;margin-left:-6%}
  .aud{gap:16px}
}
@media (max-width:991px){
  .head-row-act{justify-content:flex-start}
  .orbit{display:none}
  .stats-x .stat:nth-child(3)::before{display:none}
  .nav-cta{margin-left:auto}
  .device{width:100%;margin-left:0}
  .hero-vis{perspective:none}
  .hero .container{position:relative}
  .aud{grid-template-columns:repeat(3,1fr);gap:16px}
  .aud-i{padding:24px 14px 74px}
  .gxc{padding:16px}
  .duo{padding:20px 0 32px 20px}
  .a-panels{grid-template-columns:1fr 1fr}
  .a-panels .a-card:last-child{display:none}
  .tsm-x .split,.blog-x .split{grid-template-columns:1fr}
}
@media (max-width:767px){
  .stats-x .stat + .stat::before{display:none}
  .hero h1{font-size:clamp(2rem,7.6vw,2.6rem);margin-bottom:18px}
  .hero-desc{font-size:.98rem;line-height:1.62}
  .hero-std{gap:8px 14px;margin-top:20px;padding-top:18px}
  .hero-actions{gap:10px}
  .lims{font-size:clamp(5px,1.4vw,8px)}
  .dev-screen{border-radius:1px}
  .aud{grid-template-columns:repeat(2,1fr);gap:12px}
  .aud-i-ic{width:83px;font-size:1.12rem}
  .aud-i h3{font-size:.94rem}
  .duo{grid-template-columns:1fr;gap:16px;padding:16px 0 0 16px}
  .duo-a,.duo-b{margin-top:0}
  .duo-b{width:64%;justify-self:end}
  .duo-plate{width:88%;height:60%}
  .duo-tag{position:static;margin-top:16px;display:inline-flex}
  .gx-card{aspect-ratio:auto;min-height:180px}
  .mq .logo-chip{min-width:150px;height:72px;padding:0 18px}
  .mq .logo-chip img{max-height:38px;max-width:110px}
  .stats-x .stat b{font-size:clamp(1.6rem,6vw,2.1rem)}
  .clients-x .mq{--fade:10%}
}
@media (max-width:575px){
  .aud{grid-template-columns:1fr;gap:10px}
  .gxc{padding:0}
  .gx-t{transform:none !important}
  .duo-b{width:78%}
  .drawer{width:min(320px,86vw)}
  .lims{font-size:clamp(4.4px,1.7vw,7px)}
}
@media (max-width:479px){
  .hero h1{font-size:clamp(1.8rem,8.4vw,2.2rem)}
  .hero-desc{font-size:.92rem}
  .drawer a{font-size:.96rem;padding:13px 2px}
}

/* ===== Contact page ===== */
#contact-form{scroll-margin-top:calc(var(--nav-h) + 18px)}
.ct-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(36px,4vw,62px);align-items:start}
.ct-grid h2{font-size:clamp(1.75rem,2.9vw,2.4rem);line-height:1.14;margin:0 0 16px;text-wrap:balance}
.ct-grid h2 span{color:var(--flame)}
.ct-side>p{font-size:.99rem;max-width:48ch;margin-bottom:0}

.ct-info{display:flex;flex-direction:column;gap:13px;margin-top:34px}
.ct-info .ci{align-items:center;padding:20px 22px}
.ct-info .ci:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.ct-info .ci:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.ct-info .ci:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.ci-ic{
  width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;border-radius:15px;
  background:var(--ac-soft);color:var(--ac);font-size:1.14rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out);
}
.ci:hover .ci-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}
.ci-ic + div{min-width:0}

.ct-hours{
  display:flex;align-items:center;gap:16px;margin-top:13px;padding:18px 22px;
  border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .5s var(--ease-out),box-shadow .45s var(--ease);
}
.ct-hours:hover{transform:translateY(-4px);box-shadow:var(--sh-sm)}
.ct-hours-ic{
  width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;border-radius:14px;
  background:rgba(6,182,164,.11);color:var(--teal);font-size:1.1rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out);
}
.ct-hours:hover .ct-hours-ic{background:linear-gradient(140deg,var(--teal),#2fd3c2);color:#fff;transform:rotate(-6deg)}
.ct-hours-txt{flex:1;min-width:0}
.ct-hours-txt span{
  display:block;margin-bottom:5px;font-family:'JetBrains Mono',monospace;
  font-size:.63rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
}
.ct-hours-txt b{font-family:'Sora',sans-serif;font-size:.92rem;color:var(--ink);margin-right:9px}
.ct-hours-txt em{font-style:normal;font-size:.88rem;color:var(--body)}

.ct-form{
  position:relative;padding:clamp(26px,2.8vw,38px);
  border-radius:var(--r-xl);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);
}
.ct-form h3{font-size:1.26rem;margin-bottom:7px}
.ct-form>p{font-size:.9rem;margin-bottom:26px}
.ct-form .field label em{font-style:normal;color:var(--flame);margin-left:3px}
.ct-form .btn-sq-block{margin-top:7px}

#help .row>*:nth-child(1) .feat-ic{animation-duration:9.5s;animation-delay:-3.2s}
#help .row>*:nth-child(2) .feat-ic{animation-duration:12s;animation-delay:-8.1s}
#help .row>*:nth-child(3) .feat-ic{animation-duration:10.8s;animation-delay:-5.4s}
#help .row>*:nth-child(4) .feat-ic{animation-duration:13.4s;animation-delay:-1.7s}

.vis-win{
  border-radius:var(--r-xl);overflow:hidden;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-lg)
}
.vis-body{display:grid;grid-template-columns:.68fr 1.32fr}
.vis-rail{
  display:flex;flex-direction:column;padding:clamp(26px,2.6vw,36px);
  border-right:1px solid var(--line);
  background-color:#fbfcfe;
  background-image:radial-gradient(rgba(11,18,32,.05) 1px,transparent 1px);
  background-size:22px 22px
}
.vis-map{position:relative;overflow:hidden;filter:grayscale(.6) contrast(1.03);transition:filter .6s var(--ease)}
.vis-map:hover{filter:none}
.vis-map iframe{display:block;width:100%;height:100%;min-height:clamp(470px,58vh,600px);border:0}
.vis-pin{
  position:relative;width:52px;height:52px;display:grid;place-items:center;margin-bottom:20px;
  border-radius:17px;background:rgba(255,59,0,.09);color:var(--flame);font-size:1.26rem
}
.vis-pin::after{
  content:'';position:absolute;inset:0;border-radius:inherit;border:1px solid var(--flame);
  animation:visPing 2.6s var(--ease) infinite
}
@keyframes visPing{
  0%{transform:scale(1);opacity:.4}
  70%,100%{transform:scale(1.3);opacity:0}
}
.vis-rail h3{font-size:1.3rem;margin-bottom:12px}
.vis-org{
  display:flex;align-items:center;gap:12px;margin:0 0 6px;
  font-family:'JetBrains Mono',monospace;font-size:.66rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted)
}
.vis-org::after{content:'';flex:1;height:1px;background:var(--line-2)}
.vis-row{display:flex;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}
.vis-row i{flex-shrink:0;margin-top:3px;font-size:1.04rem;color:var(--ac)}
.vis-rows .vis-row:nth-child(1){--ac:#0396d7}
.vis-rows .vis-row:nth-child(2){--ac:#7c5cff}
.vis-rows .vis-row:nth-child(3){--ac:#06b6a4}
.vis-row span{
  display:block;margin-bottom:5px;font-family:'JetBrains Mono',monospace;
  font-size:.66rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)
}
.vis-row p{margin:0;font-size:.93rem;line-height:1.62;color:var(--ink)}
.vis-row a{color:var(--ink)}
.vis-row a:hover{color:var(--flame)}
.vis-row:last-child{border-bottom:0}
.vis-rows{margin-bottom:26px}
.vis-rail .btn-sq{margin-top:auto}

@media (max-width:1199px){
  .vis-body{grid-template-columns:.78fr 1.22fr}
}
@media (max-width:991px){
  .ct-grid{grid-template-columns:1fr;gap:44px}
  .ct-side>p{max-width:none}
  .vis-body{grid-template-columns:1fr}
  .vis-rail{border-right:0;border-bottom:1px solid var(--line)}
  .vis-map iframe{min-height:clamp(340px,46vh,440px)}
}
@media (max-width:575px){
  .ct-form{padding:22px}
  .ct-info .ci{padding:17px 18px;gap:13px}
  .ci-ic{width:42px;height:42px;font-size:1rem;border-radius:13px}
  .ct-hours{padding:16px 18px;gap:13px}
  .ct-hours-ic{width:40px;height:40px;font-size:1rem;border-radius:13px}
  .ct-hours-txt b{display:block;margin-right:0;margin-bottom:2px}
}

/* ===== Why-us: staggered proof blocks (home + about) ===== */
.why{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,3.4vw,52px) clamp(30px,4vw,66px)}
.why-i{padding-top:26px;border-top:2px solid var(--ac)}
.why-i:nth-child(even){margin-top:clamp(0px,5vw,64px)}
.why-i:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.why-i:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.why-i:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.why-i:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.why-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.why-n{
  font-family:'Sora',sans-serif;font-size:clamp(2.5rem,3.8vw,3.3rem);font-weight:800;
  line-height:.85;letter-spacing:-.05em;color:transparent;
  -webkit-text-stroke:1.5px var(--ac);opacity:.5;transition:opacity .5s var(--ease)
}
.why-i:hover .why-n{opacity:1}
.why-ic{
  width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;border-radius:15px;
  background:var(--ac-soft);color:var(--ac);font-size:1.16rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out)
}
.why-i:hover .why-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}
.why-i h3{font-size:1.16rem;margin-bottom:9px}
.why-i p{font-size:.93rem;margin:0 0 20px}
.why-proof{
  display:inline-flex;align-items:center;gap:9px;padding:7px 15px;border-radius:99px;
  background:var(--ac-soft);color:var(--ac);
  font-family:'JetBrains Mono',monospace;font-size:.67rem;font-weight:500;
  letter-spacing:.09em;text-transform:uppercase
}
.why-proof i{font-size:.8rem}
@media (max-width:767px){
  .why{grid-template-columns:1fr;gap:30px}
  .why-i:nth-child(even){margin-top:0}
}

/* ===== Why us: compact tinted nubs =====
   Four small rounded blocks, each washed in its own accent. Round white icon
   badge, tight type, tiny proof tag. Deliberately snug - the whole section is
   one short band rather than four tall columns. */
.nub{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.2vw,16px);margin-top:clamp(20px,2.4vw,30px)}
.nub-i{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;
  padding:20px 18px 18px;border-radius:20px;
  background:var(--ac-wash);border:1px solid var(--ac-edge);
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease)
}
.nub-ic{
  width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
  background:#fff;color:var(--ac);font-size:1rem;
  box-shadow:0 5px 12px -6px var(--ac-edge);
  transition:transform .5s var(--ease-out)
}
.nub-i h3{font-size:.99rem;line-height:1.35;margin:14px 0 6px}
.nub-i p{font-size:.83rem;line-height:1.58;margin:0 0 14px}
/* tags line up along the bottom whatever the text length */
.nub-tag{
  margin-top:auto;display:inline-block;padding:5px 11px;border-radius:99px;background:#fff;color:var(--ac);
  font-family:'JetBrains Mono',monospace;font-size:.59rem;font-weight:500;
  letter-spacing:.07em;text-transform:uppercase;line-height:1.5
}
.nub-i:hover{transform:translateY(-5px) rotate(-.7deg);box-shadow:0 18px 30px -20px var(--ac)}
.nub-i:nth-child(even):hover{rotate:1.4deg}
.nub-i:hover .nub-ic{transform:scale(1.1) rotate(-8deg)}
.nub-i:nth-child(1){--ac:#ff3b00;--ac-wash:rgba(255,59,0,.07);--ac-edge:rgba(255,59,0,.2)}
.nub-i:nth-child(2){--ac:#0396d7;--ac-wash:rgba(3,150,215,.07);--ac-edge:rgba(3,150,215,.2)}
.nub-i:nth-child(3){--ac:#7c5cff;--ac-wash:rgba(124,92,255,.07);--ac-edge:rgba(124,92,255,.2)}
.nub-i:nth-child(4){--ac:#06b6a4;--ac-wash:rgba(6,182,164,.08);--ac-edge:rgba(6,182,164,.22)}

@media (max-width:920px){.nub{grid-template-columns:1fr 1fr}}
@media (max-width:540px){
  .nub{grid-template-columns:1fr;gap:10px}
  .nub-i{padding:17px 16px 15px;border-radius:17px}
}

/* ===== Why-us: reason / evidence explorer ===== */
.whyx-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(28px,3.2vw,56px);align-items:start}

.whyx-rail{
  flex-direction:column;flex-wrap:nowrap;gap:clamp(10px,1.1vw,16px);width:100%;max-width:none;
  padding:0;margin-bottom:0;background:none;border:0;border-radius:0
}
.whyx-rail .tab{
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(14px,1.4vw,22px);
  width:100%;padding:0;border-radius:0;white-space:normal;text-align:left;
  background:none;box-shadow:none;color:var(--ink)
}
.whyx-rail .tab>b{
  font-family:'Sora',sans-serif;font-size:1.25rem;font-weight:700;color:var(--muted);
  transition:color .4s var(--ease)
}
.whyx-rail .tab.on>b{color:var(--flame)}
.whyx-card{
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(14px,1.5vw,22px);
  padding:clamp(9px,1vw,14px) 0
}
.whyx-card-ic{
  width:clamp(48px,3.7vw,58px);aspect-ratio:1;flex-shrink:0;
  display:grid;place-items:center;border:0;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);
  font-size:clamp(1.15rem,1.35vw,1.4rem);color:var(--muted);
  transition:background .45s var(--ease),color .45s var(--ease),
    box-shadow .5s var(--ease),transform .55s var(--ease-out)
}
.whyx-card-ic i{display:block;line-height:1}
.whyx-card-ic i::before{display:block;line-height:1;vertical-align:0}
.whyx-card-t{
  display:block;min-width:0;font-family:'Sora',sans-serif;font-size:clamp(.93rem,1.02vw,1.03rem);
  font-weight:700;line-height:1.3;color:var(--ink);transition:color .4s var(--ease)
}
.whyx-card-t em{
  display:block;margin-top:3px;font-family:'Inter',sans-serif;font-size:.85rem;
  font-style:normal;font-weight:400;line-height:1.5;color:var(--body)
}
.whyx-rail .tab:hover .whyx-card-ic{box-shadow:inset 0 0 0 1px var(--flame);color:var(--flame)}
.whyx-rail .tab:hover .whyx-card-t{color:var(--flame)}
.whyx-rail .tab.on .whyx-card-ic{
  background:var(--grad);color:#fff;transform:scale(1.1);
  box-shadow:0 4px 10px -3px rgba(255,59,0,.5),0 16px 30px -12px rgba(255,59,0,.6)
}

.whyx-main{position:relative;padding-left:clamp(25px,2.7vw,47px)}
.whyx-main::after{
  content:'';position:absolute;left:0;top:0;width:2px;height:var(--rail-h,100%);border-radius:99px;
  background:var(--line-2)
}
.whyx-main::before{
  content:'';position:absolute;z-index:1;left:-5px;top:var(--dot,50%);width:12px;height:12px;border-radius:50%;
  background:var(--flame);box-shadow:0 0 0 7px rgba(255,59,0,.15);
  transform:translateY(-50%);transition:top .5s var(--ease-out)
}
.whyx-panes{min-height:clamp(380px,28vw,440px)}
.whyx-pane{position:relative;isolation:isolate}
.whyx-num{
  position:absolute;z-index:-1;top:-16px;right:0;pointer-events:none;user-select:none;
  font-family:'Sora',sans-serif;font-size:clamp(5.5rem,8.6vw,8.4rem);font-weight:800;
  line-height:.8;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.6px rgba(255,59,0,.17)
}
.whyx-k{
  display:flex;align-items:center;gap:14px;margin-bottom:16px;
  font-family:'JetBrains Mono',monospace;font-size:.68rem;
  font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--flame)
}
.whyx-k::before{content:'';flex-shrink:0;width:26px;height:2px;border-radius:2px;background:var(--flame)}
.whyx-pane h3{
  font-size:clamp(1.5rem,2.3vw,2.1rem);line-height:1.16;margin-bottom:16px;text-wrap:balance;
  max-width:calc(100% - clamp(115px,11vw,175px))
}
.whyx-pane>p{font-size:.99rem;margin:0 0 clamp(24px,2.6vw,34px);max-width:50ch}

.whyx-proof-h{
  display:flex;align-items:center;gap:13px;margin-bottom:16px;
  font-family:'JetBrains Mono',monospace;font-size:.63rem;
  font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)
}
.whyx-proof-h::after{content:'';flex:1;height:1px;background:var(--line-2)}

.tab-pane.on .whyx-pane .badge{animation:paneIn .55s var(--ease-out) backwards;animation-delay:calc(.18s + .05s * var(--i,0))}
.whyx-pane .badge:nth-child(2){--i:1}
.whyx-pane .badge:nth-child(3){--i:2}
.whyx-pane .badge:nth-child(4){--i:3}
.whyx-pane .badge:nth-child(5){--i:4}
.whyx-pane .badge:nth-child(6){--i:5}

@media (max-width:991px){
  .whyx-grid{grid-template-columns:1fr;gap:34px}
  .whyx-main{padding-left:0}
  .whyx-main::before,.whyx-main::after{display:none}
  .whyx-panes{min-height:0}
  .whyx-num{font-size:clamp(4.4rem,12vw,6rem);top:-10px}
}

/* ===== Home: challenges & case studies ===== */
.chal{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(36px,4.4vw,66px);align-items:start}
.chal-side{position:sticky;top:calc(var(--nav-h) + 30px)}
.chal-side h2{font-size:clamp(1.75rem,2.9vw,2.4rem);line-height:1.14;margin:0 0 16px;text-wrap:balance}
.chal-side h2 span{color:var(--flame)}
.chal-side>p{font-size:.99rem;max-width:46ch}
.chal-side .chal-note{
  margin:clamp(26px,2.8vw,38px) 0;max-width:27ch;
  font-family:'Sora',sans-serif;font-size:clamp(1.1rem,1.55vw,1.34rem);font-weight:600;
  line-height:1.44;letter-spacing:-.015em;color:var(--ink);text-wrap:balance
}
.chal-note em{font-style:normal;color:var(--flame)}
.chal-note-soft{color:var(--muted);font-weight:500}
.chal-note-hint{
  display:flex;align-items:center;gap:11px;margin-top:18px;
  font-family:'JetBrains Mono',monospace;font-size:.66rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted)
}
.chal-note-hint i{font-size:.82rem;color:var(--flame);animation:hintNudge 1.9s var(--ease) infinite}
@keyframes hintNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}

.chal-stage{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,2.6vw,38px);align-items:start}

.chal-rail{display:grid;justify-items:center}
.chal-step{
  position:relative;display:grid;place-items:center;
  padding:9px;border:0;border-radius:50%;background:transparent;cursor:pointer
}
.chal-step-ic{
  position:relative;z-index:2;
  width:44px;height:44px;display:grid;place-items:center;border-radius:50%;font-size:1.02rem;
  background:#fff;border:0;box-shadow:inset 0 0 0 1px var(--line);color:var(--muted);
  transition:background .4s var(--ease),color .4s var(--ease),
             box-shadow .45s var(--ease),transform .5s var(--ease-out)
}
.chal-step-ic i{display:block;line-height:1}
.chal-step-ic i::before{display:block;line-height:1;vertical-align:0}
.chal-step::after,.chal-step::before{
  content:'';position:absolute;top:calc(100% - 9px);left:50%;margin-left:-1px;width:2px;height:18px
}
.chal-step::after{background:rgba(255,59,0,.22)}
.chal-step::before{background:var(--flame);transform:scaleY(0);transform-origin:top;z-index:1}
.chal-step:last-child::after,.chal-step:last-child::before{display:none}
.chal-step:hover .chal-step-ic{box-shadow:inset 0 0 0 1px var(--flame);color:var(--flame);transform:scale(1.06)}

.chal-step.on .chal-step-ic{
  background:var(--grad);color:#fff;transform:scale(1.16);
  box-shadow:0 4px 10px -3px rgba(255,59,0,.5),0 16px 30px -12px rgba(255,59,0,.6)
}
.chal-step.on::before{animation:chalFill var(--dwell,3s) linear forwards}
.chal-stage.is-hold .chal-step.on::before{animation-play-state:paused}
@keyframes chalFill{from{transform:scaleY(0)}to{transform:scaleY(1)}}

.chal-panels{display:grid}
.chal-slide{
  grid-area:1/1;display:grid;align-content:start;gap:clamp(14px,1.5vw,18px);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .45s var(--ease),visibility .45s
}
.chal-slide.on{opacity:1;visibility:visible;pointer-events:auto}
.chal-slide .chal-card{
  transform:translateX(calc(36px * var(--dir,1)));
  transition:transform .6s var(--ease-out)
}
.chal-slide.on .chal-card{transform:none}
.chal-slide.on .chal-card+.chal-card{transition-delay:.08s}
.chal-slide.out .chal-card{transform:translateX(calc(-36px * var(--dir,1)))}
.chal-slide.out .chal-card+.chal-card{transition-delay:.05s}

.chal-slide{--fx:#0396d7;--fx-2:#38c0f5;--fx-soft:rgba(3,150,215,.17);--fx-sh:rgba(3,150,215,.3)}

.chal-card{
  position:relative;overflow:hidden;
  padding:clamp(20px,2.2vw,28px) clamp(20px,2.4vw,30px);
  border-radius:var(--r-lg);background:#fff
}
.chal-card>*{position:relative;z-index:1}
.chal-card-lbl{
  display:block;margin-bottom:16px;
  font-family:'JetBrains Mono',monospace;font-size:.66rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase
}
.chal-card-row{display:grid;grid-template-columns:auto auto 1fr;gap:18px;align-items:start}
.chal-card-row>b{
  padding-top:14px;font-family:'JetBrains Mono',monospace;font-size:.78rem;font-weight:600
}
.chal-card-ic{
  width:54px;height:54px;display:grid;place-items:center;border-radius:16px;font-size:1.28rem;
  transition:transform .55s var(--ease-out)
}
.chal-card:hover .chal-card-ic{transform:rotate(-6deg)}
.chal-card h3{font-size:1.06rem;margin:0 0 6px}
.chal-card p{font-size:.9rem;line-height:1.62;margin:0}

.chal-card.is-now{background:none;box-shadow:none}
.chal-card.is-now .chal-card-lbl{color:var(--muted)}
.chal-card.is-now .chal-card-row>b{color:var(--muted)}
.chal-card.is-now h3{color:var(--body)}
.chal-card.is-now .chal-card-ic{background:var(--bg-2);border:1px solid var(--line);color:var(--muted)}

.chal-card.is-fix{
  background:
    radial-gradient(125% 100% at 100% 0%,var(--fx-soft),rgba(255,255,255,0) 64%),
    radial-gradient(120% 100% at 0% 100%,var(--fx-soft),rgba(255,255,255,0) 60%),
    linear-gradient(158deg,#fff,#fbfdff);
  box-shadow:0 22px 48px -28px var(--fx-sh),0 2px 6px rgba(13,26,51,.035),inset 0 1px 0 #fff
}
.chal-card.is-fix::before{
  content:'';position:absolute;z-index:0;top:-60%;left:-18%;width:64%;height:220%;
  transform:rotate(18deg);pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.62) 48%,rgba(255,255,255,0))
}
.chal-card.is-fix .chal-card-lbl{color:var(--fx)}
.chal-card.is-fix .chal-card-row>b{color:var(--fx)}
.chal-card.is-fix .chal-card-ic{
  background:var(--fx-soft);border:1px solid var(--fx-soft);color:var(--fx);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8)
}

.cs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,28px)}
.cs-i{
  display:flex;flex-direction:column;height:100%;padding:clamp(24px,2.4vw,30px);
  border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease),border-color .4s
}
.cs-i:hover{transform:translateY(-8px);box-shadow:var(--sh);border-color:var(--line-2)}
.cs-i:nth-child(1){--ac:#ff3b00;--ac-soft:rgba(255,59,0,.09)}
.cs-i:nth-child(2){--ac:#0396d7;--ac-soft:rgba(3,150,215,.1)}
.cs-i:nth-child(3){--ac:#7c5cff;--ac-soft:rgba(124,92,255,.1)}
.cs-tag{
  align-self:flex-start;margin-bottom:24px;padding:6px 13px;border-radius:99px;
  background:var(--ac-soft);color:var(--ac);
  font-family:'JetBrains Mono',monospace;font-size:.64rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase
}
.cs-s{position:relative;padding-left:22px}
.cs-s+.cs-s{margin-top:22px}
.cs-s::before{content:'';position:absolute;left:2px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.cs-s+.cs-s::after{content:'';position:absolute;left:6px;top:-20px;width:1.5px;height:20px;background:var(--line)}
.cs-s span{display:block;margin-bottom:6px;font-family:'JetBrains Mono',monospace;font-size:.63rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.cs-s b{font-family:'Sora',sans-serif;font-size:.96rem;font-weight:600;color:var(--ink);line-height:1.42}
.cs-s.res::before{background:var(--ac);box-shadow:0 0 0 4px var(--ac-soft)}
.cs-s.res b{color:var(--ac)}
.cs-i .btn-txt{margin-top:auto;padding-top:26px;align-self:flex-start}

@media (max-width:991px){
  .chal{grid-template-columns:1fr;gap:38px}
  .chal-side{position:static}
  .chal-side>p{max-width:none}
  .cs{grid-template-columns:1fr}
}
@keyframes chalFillX{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (max-width:767px){
  .chal-stage{grid-template-columns:1fr;gap:22px}
  .chal-rail{grid-auto-flow:column;justify-content:start;align-items:center;padding:4px 0}
  .chal-step{padding:9px 13px}
  .chal-step::after,.chal-step::before{
    top:50%;bottom:auto;margin:-1px 0 0;left:calc(100% - 13px);width:26px;height:2px
  }
  .chal-step::before{transform:scaleX(0);transform-origin:left}
  .chal-step.on::before{animation-name:chalFillX}
}
@media (max-width:575px){
  .chal-step{padding:9px 10px}
  .chal-step-ic{width:40px;height:40px;font-size:.95rem}
  .chal-step::after,.chal-step::before{left:calc(100% - 10px);width:20px}
  .chal-card-row{gap:13px}
  .chal-card-row>b{padding-top:11px;font-size:.68rem}
  .chal-card-ic{width:42px;height:42px;font-size:1.05rem;border-radius:13px}
}

/* ===== About page ===== */
.whyc{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.whyc-i{
  display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:16px;
  padding:15px 19px;border-radius:var(--r);
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .45s var(--ease-out),box-shadow .4s var(--ease),border-color .4s
}
.whyc-i:hover{transform:translateY(-3px);box-shadow:var(--sh-sm);border-color:var(--line-2)}
.whyc-i:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.whyc-i:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.whyc-i:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.whyc-i:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.whyc-n{
  font-family:'Sora',sans-serif;font-size:1.32rem;font-weight:800;line-height:1;
  letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px var(--ac);
  opacity:.55;transition:opacity .5s var(--ease)
}
.whyc-i:hover .whyc-n{opacity:1}
.whyc-ic{
  width:42px;height:42px;display:grid;place-items:center;border-radius:13px;
  background:var(--ac-soft);color:var(--ac);font-size:1.06rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out)
}
.whyc-i:hover .whyc-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}
.whyc-i h3{font-size:1.01rem;margin:0 0 3px}
.whyc-i p{font-size:.87rem;line-height:1.6;margin:0}

/* Open role tickets (career) */
.hire-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:stretch}
.tkts{display:flex;flex-direction:column;gap:12px;min-width:0}
.tkt{
  --stub:172px;
  position:relative;isolation:isolate;
  display:grid;grid-template-columns:auto minmax(190px,1fr) 1.2fr var(--stub);align-items:center;
  min-height:84px;flex:1;border-radius:var(--r);overflow:hidden;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  color:inherit;text-decoration:none;
  transition:transform .45s var(--ease-out),box-shadow .4s var(--ease),border-color .4s
}
.tkt::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--ac),var(--ac-2));
  transform:scaleY(.35)
}
/* ticket notches on the tear line */
.tkt-stub::before,.tkt-stub::after{
  content:"";position:absolute;left:-9px;width:18px;height:18px;border-radius:50%;
  background:#fff;border:1px solid var(--line)
}
.tkt-stub::before{top:-10px}
.tkt-stub::after{bottom:-10px}
.tkt:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:color-mix(in srgb,var(--ac) 30%,var(--line));color:inherit}

.tkt-ic{
  width:46px;height:46px;margin:0 18px 0 24px;display:grid;place-items:center;border-radius:13px;font-size:1.15rem;
  color:var(--ac);background:color-mix(in srgb,var(--ac) 10%,transparent);
  transition:background .4s var(--ease),color .4s var(--ease),transform .5s var(--ease-out)
}
.tkt:hover .tkt-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}

.tkt-main{display:flex;flex-direction:column;gap:3px;padding:16px 0}
.tkt-dept{font-family:'JetBrains Mono',monospace;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ac)}
.tkt h3{font-size:1.08rem;margin:0}
.tkt-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:3px;font-size:.76rem;color:var(--muted)}
.tkt-meta span{display:inline-flex;align-items:center;gap:5px}

.tkt-desc{padding:16px 24px;font-size:.85rem;line-height:1.6;color:var(--muted)}

.tkt-stub{
  position:relative;align-self:stretch;
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 18px 0 22px;
  border-left:2px dashed color-mix(in srgb,var(--ac) 30%,var(--line));
  background:color-mix(in srgb,var(--ac) 6%,#fff);
  transition:background .45s var(--ease)
}
.tkt-exp{display:flex;flex-direction:column;line-height:1;white-space:nowrap}
.tkt-exp b{font-family:'Sora',sans-serif;font-size:1.7rem;font-weight:800;letter-spacing:-.04em;color:var(--ac);transition:color .45s}
.tkt-exp small{margin-top:5px;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);transition:color .45s}
.tkt-go{
  width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;
  font-size:1.2rem;color:var(--ac);border:1px solid color-mix(in srgb,var(--ac) 35%,transparent);
  transition:transform .5s var(--ease-out),background .4s,color .4s,border-color .4s
}
.tkt-go i{display:block;line-height:1}
.tkt-go i::before{display:block;vertical-align:0}
.tkt:hover .tkt-stub{background:linear-gradient(140deg,var(--ac),var(--ac-2))}
.tkt:hover .tkt-exp b,.tkt:hover .tkt-exp small{color:#fff}
.tkt:hover .tkt-go{background:#fff;color:var(--ac);border-color:#fff;transform:rotate(45deg)}

/* "Don't see the right role?" side card */
.hire-ask{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;align-items:flex-start;
  padding:26px 26px 24px;border-radius:var(--r-lg);
  background:#fff;
  border:1.5px dashed rgba(255,59,0,.28)
}
.hire-ask-ic{
  width:54px;height:54px;display:grid;place-items:center;margin-bottom:16px;border-radius:50%;
  font-size:1.3rem;color:#fff;background:linear-gradient(140deg,#ff3b00,#ff9f1c);
  box-shadow:0 12px 24px -12px rgba(255,59,0,.7);
  animation:askFloat 3.2s ease-in-out infinite
}
.hire-ask-ic i{display:block;line-height:1;transform:rotate(-8deg)}
.hire-ask-ic i::before{display:block;vertical-align:0}
@keyframes askFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(6deg)}}
.hire-ask h3{font-size:1.15rem;margin:0 0 8px}
.hire-ask p{font-size:.86rem;line-height:1.65;margin:0 0 20px}
@media (prefers-reduced-motion:reduce){.hire-ask-ic{animation:none}}

@media (max-width:1199px){
  .tkt{grid-template-columns:auto 1fr var(--stub)}
  .tkt-desc{display:none}
}
@media (max-width:991px){
  .hire-grid{grid-template-columns:1fr}
}
@media (max-width:575px){
  .tkt{--stub:146px}
  .tkt-ic{width:40px;height:40px;margin:0 12px 0 16px;font-size:1rem}
  .tkt h3{font-size:.98rem}
  .tkt-meta{gap:10px}
  .tkt-stub{padding:0 12px 0 16px}
  .tkt-exp b{font-size:1.35rem}
  .tkt-go{width:34px;height:34px;font-size:1rem}
}

/* Growth path (career) */
.gpath{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 0;
  list-style:none;margin:36px 0 0;padding:0
}
.gpath li{display:flex;align-items:center}
.gpath li:nth-child(1){--ac:#ff3b00}
.gpath li:nth-child(2){--ac:#0396d7}
.gpath li:nth-child(3){--ac:#7c5cff}
.gpath li:nth-child(4){--ac:#06b6a4}
.gpath li+li::before{
  content:"\F285";font-family:'bootstrap-icons';font-size:.72rem;
  color:var(--muted);margin:0 10px
}
.gpath-s{
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  font-family:'Sora',sans-serif;font-size:.9rem;font-weight:600;letter-spacing:-.01em;
  color:var(--ac);transition:transform .45s var(--ease-out)
}
.gpath-s i{font-size:1rem}
.gpath-s:hover{transform:translateY(-2px)}
@media (max-width:575px){
  .gpath li+li::before{margin:0 6px}
  .gpath-s{font-size:.82rem}
}

.story{--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.1);--ac-glow:rgba(255,59,0,.5)}
.story[data-i="1"]{--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.11);--ac-glow:rgba(3,150,215,.5)}
.story[data-i="2"]{--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.11);--ac-glow:rgba(124,92,255,.5)}
.story[data-i="3"]{--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.12);--ac-glow:rgba(6,182,164,.5)}
.story h2{font-size:clamp(1.72rem,2.8vw,2.35rem);line-height:1.14;margin:0 0 14px;text-wrap:balance}
.story h2 span{color:var(--flame)}
.story-lede{font-size:1rem;margin:0 0 26px;max-width:52ch}

.story-rail{
  flex-wrap:wrap;gap:clamp(16px,2vw,30px);width:100%;max-width:none;
  padding:0;margin-bottom:26px;background:none;border:0;border-radius:0
}
.story-rail .tab{
  position:relative;display:grid;grid-template-columns:auto auto;align-items:center;
  gap:clamp(10px,1vw,14px);padding:0 0 11px;border-radius:0;
  background:none;box-shadow:none;color:var(--ink)
}
.story-rail .tab>b{
  font-family:'Sora',sans-serif;font-size:clamp(.95rem,1.1vw,1.15rem);font-weight:700;
  color:var(--muted);transition:color .4s var(--ease)
}
.story-rail .tab.on>b{color:var(--ac)}
.story-yr-ic{
  width:clamp(42px,3.3vw,52px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);
  font-size:clamp(1rem,1.2vw,1.22rem);color:var(--muted);
  transition:background .45s var(--ease),color .45s var(--ease),
    box-shadow .5s var(--ease),transform .55s var(--ease-out)
}
.story-yr-ic i{display:block;line-height:1}
.story-yr-ic i::before{display:block;line-height:1;vertical-align:0}
.story-rail .tab:hover .story-yr-ic{box-shadow:inset 0 0 0 1px var(--ac);color:var(--ac)}
.story-rail .tab.on .story-yr-ic{
  background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:scale(1.1);
  box-shadow:0 4px 10px -3px var(--ac-glow),0 16px 30px -12px var(--ac-glow)
}
.story-yr em{
  position:absolute;left:0;bottom:0;width:100%;height:2px;border-radius:2px;
  background:var(--ac);transform:scaleX(0);transform-origin:left
}
.story-yr.on em{animation:storyDwell var(--dwell,3000ms) linear forwards}
.story.hold .story-yr.on em{animation-play-state:paused}
@keyframes storyDwell{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.story-panels{display:grid}
.story-pane{
  grid-area:1/1;padding:22px 24px 20px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:var(--bg-2);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .5s var(--ease),transform .55s var(--ease-out),visibility .5s
}
.story-pane.on{opacity:1;visibility:visible;transform:none}
.story-pane h3{font-size:1.1rem;margin:0 0 9px}
.story-pane p{font-size:.93rem;margin:0}
.story-mark{
  display:inline-flex;align-items:center;gap:9px;margin-top:16px;padding:6px 13px;border-radius:999px;
  background:#fff;border:1px solid var(--line-2);color:var(--ink);
  font-size:.76rem;font-weight:600;letter-spacing:-.01em
}
.story-mark i{color:var(--ac);font-size:.9rem}

.bld{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-2)}
.bld-i{position:relative;padding:32px 26px 30px 0}
.bld-i:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.bld-i:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.bld-i:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.bld-i:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.bld-i+.bld-i{padding-left:26px;border-left:1px solid var(--line)}
.bld-i::before{content:'';position:absolute;left:0;top:-1px;width:0;height:2px;background:linear-gradient(90deg,var(--ac),var(--ac-2));transition:width .6s var(--ease-out)}
.bld-i:hover::before{width:100%}
.bld-ic{
  width:50px;height:50px;display:grid;place-items:center;border-radius:16px;margin-bottom:20px;
  background:var(--ac-soft);color:var(--ac);font-size:1.22rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out)
}
.bld-i:hover .bld-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}
.bld-i h3{font-size:1.06rem;margin-bottom:9px}
.bld-i p{font-size:.9rem;margin:0 0 16px}

/* ===== Stair steps (Understand > Build > Connect > Grow) =====
   No boxes: each step is an icon and text closed by a rule underneath, sitting
   one step higher than the last. Each step keeps its own accent colour, and a
   dashed riser drops from the rule down to where the next step starts. */
.stair{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:0 34px;align-items:end;margin-top:20px}
.stair-i{position:relative;padding-bottom:calc(var(--step) * 40px)}
.stair-i:nth-child(1){--step:0;--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.13)}
.stair-i:nth-child(2){--step:1;--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.14)}
.stair-i:nth-child(3){--step:2;--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.14)}
.stair-i:nth-child(4){--step:3;--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.15)}
/* the riser: drops from this step's rule down to the next step's level.
   The dashes travel upward on a loop, so the climb keeps moving. */
.stair-i::after{
  content:'';position:absolute;left:0;bottom:0;width:1px;
  height:calc(var(--step) * 40px);
  background:repeating-linear-gradient(to bottom,var(--line-2) 0 4px,transparent 4px 9px);
  background-size:1px 9px;
  animation:stairFlow 1.1s linear infinite
}
@keyframes stairFlow{from{background-position:0 0}to{background-position:0 -9px}}
@media (prefers-reduced-motion:reduce){.stair-i::after{animation:none}}
.stair-card{position:relative;padding:0 0 26px;border-bottom:1px solid var(--line-2)}
/* the tread: a short accent segment sitting on the rule */
.stair-card::before{
  content:'';position:absolute;left:0;bottom:-1px;height:2px;width:44px;
  background:linear-gradient(90deg,var(--ac),var(--ac-2));
  transition:width .6s var(--ease-out)
}
/* same treatment as .step-big / .card-num elsewhere on the site */
.stair-num{
  position:absolute;top:-6px;right:0;line-height:.88;pointer-events:none;
  font-family:'Sora',sans-serif;font-size:clamp(2.6rem,3.4vw,3.6rem);font-weight:800;letter-spacing:-.05em;
  color:transparent;-webkit-text-stroke:1.5px var(--line-2);
  transition:-webkit-text-stroke-color .5s var(--ease)
}
.stair-ic{
  position:relative;display:block;margin-bottom:18px;
  color:var(--ac);font-size:1.6rem;line-height:1;
  transition:transform .55s var(--ease-out)
}
.stair-card h3{position:relative;font-size:1.06rem;margin-bottom:9px}
.stair-card p{position:relative;font-size:.9rem;margin:0;max-width:27ch}
.stair-i:hover .stair-card::before{width:100%}
.stair-i:hover .stair-ic{transform:translateY(-4px)}
.stair-i:hover .stair-num{-webkit-text-stroke-color:var(--ac)}

@media (max-width:1100px){
  .stair{grid-template-columns:1fr 1fr;gap:0 30px}
  .stair-i:nth-child(1),.stair-i:nth-child(3){--step:0}
  .stair-i:nth-child(2),.stair-i:nth-child(4){--step:1}
  .stair-i:nth-child(n+3){margin-top:34px}
}
@media (max-width:640px){
  .stair{grid-template-columns:1fr;gap:0}
  .stair-i{--step:0!important;padding-bottom:0}
  .stair-i:nth-child(n+2){margin-top:26px}
  .stair-i::after{display:none}
  .stair-num{font-size:2.8rem}
}

.eco{
  position:relative;display:grid;grid-template-columns:repeat(7,1fr);
  padding:clamp(30px,3.4vw,46px) clamp(18px,2vw,28px);
  border-radius:var(--r-xl);background:#fff;border:1px solid var(--line);box-shadow:var(--sh)
}
.eco-n{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:13px;padding:0 6px}
.eco-n:nth-child(7n+1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.eco-n:nth-child(7n+2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.eco-n:nth-child(7n+3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.eco-n:nth-child(7n+4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.eco-n:nth-child(7n+5){--ac:#ff9f1c;--ac-2:#ffbe5c;--ac-soft:rgba(255,159,28,.13)}
.eco-n:nth-child(7n+6){--ac:#4361ee;--ac-2:#7089ff;--ac-soft:rgba(67,97,238,.1)}
.eco-n:nth-child(7n+7){--ac:#f43f6e;--ac-2:#ff7396;--ac-soft:rgba(244,63,110,.1)}
.eco-ic{
  position:relative;z-index:2;width:62px;height:62px;display:grid;place-items:center;border-radius:20px;
  background:var(--ac-soft);color:var(--ac);font-size:1.46rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out)
}
.eco-n:hover .eco-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:translateY(-5px)}
.eco-n:not(:last-child)::after{
  content:'';position:absolute;top:30px;left:calc(50% + 39px);right:calc(-50% + 39px);height:2px;
  background:repeating-linear-gradient(90deg,var(--line-2) 0 5px,transparent 5px 11px);
  background-size:11px 2px;animation:ecoFlow 1.1s linear infinite
}
@keyframes ecoFlow{to{background-position:11px 0}}
.eco-n b{font-family:'Sora',sans-serif;font-size:.87rem;font-weight:600;color:var(--ink);line-height:1.3}
.eco-n span{font-size:.74rem;line-height:1.5;color:var(--muted)}
.eco-note{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 22px;margin-top:30px;
  font-family:'Sora',sans-serif;font-size:.92rem;font-weight:600;color:var(--ink)
}
.eco-note i{
  font-size:.8rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent
}

.exp{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:32px 0 34px}
.exp-i{
  display:flex;align-items:center;gap:13px;padding:15px 17px;border-radius:14px;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .45s var(--ease-out),box-shadow .4s var(--ease),border-color .4s
}
.exp-i:hover{transform:translateY(-3px);box-shadow:var(--sh-sm);border-color:var(--line-2)}
.exp-i i{flex-shrink:0;font-size:1.06rem;color:var(--ac)}
.exp-i:nth-child(7n+1){--ac:#ff3b00}
.exp-i:nth-child(7n+2){--ac:#0396d7}
.exp-i:nth-child(7n+3){--ac:#7c5cff}
.exp-i:nth-child(7n+4){--ac:#06b6a4}
.exp-i:nth-child(7n+5){--ac:#ff9f1c}
.exp-i:nth-child(7n+6){--ac:#4361ee}
.exp-i:nth-child(7n+7){--ac:#f43f6e}
.exp-i span{font-family:'Sora',sans-serif;font-size:.87rem;font-weight:600;color:var(--ink)}

.svc-ph{
  aspect-ratio:4/3;display:grid;align-content:center;justify-items:center;gap:12px;
  padding:34px;text-align:center;
  background:
    radial-gradient(560px 260px at 50% 0%,var(--ac-soft),transparent 72%),
    linear-gradient(160deg,var(--bg-2),#fff 62%)
}
.svc-ph i{font-size:2rem;color:var(--ac)}
.svc-ph b{font-family:'Sora',sans-serif;font-size:1rem;letter-spacing:-.02em;color:var(--ink)}
.svc-ph span{
  font-family:'JetBrains Mono',monospace;font-size:.7rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--muted)
}

.impg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.impg-i{
  padding:26px 24px 24px;border-radius:var(--r-lg);
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .45s var(--ease-out),box-shadow .4s var(--ease),border-color .4s
}
.impg-i:hover{transform:translateY(-4px);box-shadow:var(--sh-sm);border-color:var(--line-2)}
.impg-i:nth-child(1){--ac:#ff3b00;--ac-2:#ff7a2f;--ac-soft:rgba(255,59,0,.09)}
.impg-i:nth-child(2){--ac:#0396d7;--ac-2:#38c0f5;--ac-soft:rgba(3,150,215,.1)}
.impg-i:nth-child(3){--ac:#7c5cff;--ac-2:#a08cff;--ac-soft:rgba(124,92,255,.1)}
.impg-i:nth-child(4){--ac:#06b6a4;--ac-2:#2fd3c2;--ac-soft:rgba(6,182,164,.11)}
.impg-ic{
  width:46px;height:46px;display:grid;place-items:center;border-radius:14px;margin-bottom:20px;
  background:var(--ac-soft);color:var(--ac);font-size:1.14rem;
  transition:background .45s var(--ease),color .45s var(--ease),transform .55s var(--ease-out)
}
.impg-i:hover .impg-ic{background:linear-gradient(140deg,var(--ac),var(--ac-2));color:#fff;transform:rotate(-6deg)}
.impg-i b{
  display:block;font-family:'Sora',sans-serif;font-size:clamp(2.1rem,3.4vw,2.9rem);font-weight:800;
  line-height:1;letter-spacing:-.045em;
  background:linear-gradient(100deg,var(--ac),var(--ac-2));
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.impg-l{display:block;margin-top:12px;font-size:.9rem;line-height:1.55;color:var(--body)}

.imp{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-2)}
.imp-i{padding:36px 24px 0}
.imp-i+.imp-i{padding-left:28px;border-left:1px solid var(--line)}
.imp-i b{
  display:block;font-family:'Sora',sans-serif;font-size:clamp(2.5rem,5vw,4rem);font-weight:800;
  line-height:1;letter-spacing:-.045em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent
}
.imp-i:nth-child(2) b{background:var(--grad-cool);-webkit-background-clip:text;background-clip:text}
.imp-i:nth-child(3) b{background:linear-gradient(100deg,#7c5cff,#a08cff);-webkit-background-clip:text;background-clip:text}
.imp-i:nth-child(4) b{background:linear-gradient(100deg,#06b6a4,#2fd3c2);-webkit-background-clip:text;background-clip:text}
.imp-i span{display:block;margin-top:12px;font-size:.9rem;line-height:1.5;color:var(--body)}
.imp-note{
  display:flex;align-items:center;gap:12px;margin-top:38px;padding-top:26px;border-top:1px solid var(--line);
  font-size:.95rem;color:var(--body)
}
.imp-note i{color:var(--flame);font-size:1.05rem}

.apr{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.2vw,26px)}
.apr-i{
  padding:30px 26px;border-radius:var(--r-lg);height:100%;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs);
  transition:transform .5s var(--ease-out),box-shadow .5s var(--ease),border-color .4s
}
.apr-i:hover{transform:translateY(-7px);box-shadow:var(--sh);border-color:var(--line-2)}
.apr-i b{
  display:block;margin-bottom:16px;font-family:'Sora',sans-serif;font-size:3.2rem;font-weight:800;
  line-height:.9;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--line-2);
  transition:-webkit-text-stroke-color .5s var(--ease)
}
.apr-i:hover b{-webkit-text-stroke-color:var(--ac)}
.apr-i:nth-child(1){--ac:#ff3b00}
.apr-i:nth-child(2){--ac:#0396d7}
.apr-i:nth-child(3){--ac:#7c5cff}
.apr-i:nth-child(4){--ac:#06b6a4}
.apr-i h3{font-size:1.08rem;margin-bottom:8px}
.apr-i p{font-size:.9rem;margin:0}

.vsn{max-width:860px;margin-inline:auto;text-align:center}
.vsn .kicker{justify-content:center}
.vsn h2{font-size:clamp(1.85rem,3.2vw,2.7rem);line-height:1.16;margin-bottom:20px;text-wrap:balance}
.vsn h2 span{color:var(--flame)}
.vsn p{font-size:clamp(1.02rem,1.35vw,1.16rem);line-height:1.72;margin:0}

@media (max-width:1199px){
  .eco{grid-template-columns:repeat(4,1fr);gap:34px 0}
  .eco-n::after{display:none}
}
@media (max-width:991px){
  .bld,.imp,.impg{grid-template-columns:1fr 1fr}
  .bld-i:nth-child(3){border-left:0}
  .bld-i:nth-child(n+3){border-top:1px solid var(--line)}
  .imp-i:nth-child(3){border-left:0;padding-left:24px}
  .imp-i:nth-child(n+3){border-top:1px solid var(--line)}
  .apr{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .eco{grid-template-columns:repeat(2,1fr);gap:30px 0}
  .exp{grid-template-columns:1fr}
  .eco-note{font-size:.86rem;gap:8px 16px}
}
@media (max-width:575px){
  .bld,.imp,.apr,.impg{grid-template-columns:1fr}
  .bld-i,.imp-i{padding-right:0}
  .bld-i+.bld-i,.imp-i+.imp-i{padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .imp-i{padding-top:28px}
  .story-rail{gap:14px}
  .story-yr-ic{width:40px}
  .story-pane{padding:18px 18px 17px}
}