/* ==========================================================================
   Apex Facility Services
   Editorial corporate system — hairlines, flat planes, square geometry.
   Montserrat (display) / Roboto (text), per the brand manual.
   ========================================================================== */

/* ---------- Tokens ---------- */
:root{
  --ink:#0A1220;
  --ink-2:#111C2E;
  --ink-3:#1B2739;
  --paper:#FFFFFF;
  --bone:#F2F4F7;
  --bone-2:#E8EBF0;

  --blue:#0D47A1;
  --blue-b:#2B7BF3;
  --blue-l:#6FA8FF;
  --steel:#9FA3AA;

  --tx:#46536A;
  --tx-mute:#7A879C;
  --tx-inv:#A9B6C9;

  --line:rgba(10,18,32,.13);
  --line-2:rgba(10,18,32,.07);
  --line-inv:rgba(255,255,255,.14);
  --line-inv-2:rgba(255,255,255,.07);

  --u:8px;
  --s2:16px; --s3:24px; --s4:32px; --s5:40px; --s6:48px; --s8:64px;
  --s10:80px; --s12:96px; --s16:128px; --s20:160px;

  --pad:40px;
  --maxw:1560px;

  --e:cubic-bezier(.22,.61,.36,1);
  --e-out:cubic-bezier(.16,1,.3,1);
  --e-io:cubic-bezier(.65,.05,.36,1);

  --f-d:'Montserrat',-apple-system,'Segoe UI',sans-serif;
  --f-t:'Roboto',-apple-system,'Segoe UI',sans-serif;

  --hdr:92px;
  --vel:0;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-padding-top:120px;}
html.has-smooth{scroll-behavior:auto;}
html:not(.has-smooth){scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--tx);
  font-family:var(--f-t);font-size:17px;line-height:1.68;font-weight:400;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,h5{font-family:var(--f-d);color:var(--ink);margin:0;font-weight:800;letter-spacing:-.032em;line-height:1.02;}
p{margin:0;}
::selection{background:var(--blue-b);color:#fff;}
:focus-visible{outline:2px solid var(--blue-b);outline-offset:3px;}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);}
.sec{position:relative;padding-block:var(--s20);}
.sec--sm{padding-block:var(--s16);}
.sec--dark{background:var(--ink);color:var(--tx-inv);}
.sec--dark h1,.sec--dark h2,.sec--dark h3,.sec--dark h4,.sec--dark h5{color:#fff;}
.sec--bone{background:var(--bone);}
.rule{height:1px;background:var(--line);border:0;margin:0;}
.sec--dark .rule{background:var(--line-inv);}

/* Type scale */
.d1{font-size:clamp(42px,5.4vw,92px);font-weight:900;letter-spacing:-.042em;line-height:.98;}
.d2{font-size:clamp(32px,3.9vw,62px);font-weight:900;letter-spacing:-.038em;line-height:1.02;}
.d3{font-size:clamp(28px,2.9vw,46px);font-weight:800;letter-spacing:-.03em;line-height:1.08;}
.d4{font-size:clamp(20px,1.6vw,26px);font-weight:700;letter-spacing:-.02em;line-height:1.24;}
.body-l{font-size:clamp(18px,1.35vw,22px);line-height:1.6;color:var(--tx);}
.sec--dark .body-l{color:var(--tx-inv);}
.body-s{font-size:15.5px;line-height:1.65;color:var(--tx-mute);}

.idx{
  font-family:var(--f-d);font-size:11.5px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--blue);
}
.sec--dark .idx{color:var(--blue-l);}
.idx--mute{color:var(--tx-mute);}

.kicker{
  display:flex;align-items:baseline;gap:18px;
  padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:var(--s10);
}
.sec--dark .kicker{border-bottom-color:var(--line-inv);}
.kicker span:last-child{
  margin-left:auto;font-family:var(--f-d);font-size:11.5px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--tx-mute);
}
.band .kicker,.cta .kicker{border-bottom-color:var(--line-inv);}
.band .idx,.cta .idx{color:var(--blue-l);}

/* ---------- Buttons ---------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:19px 34px;border:1px solid transparent;border-radius:2px;overflow:hidden;
  font-family:var(--f-d);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  transition:color .4s var(--e),border-color .4s var(--e),background .4s var(--e);
  will-change:transform;
}
.btn span{position:relative;z-index:2;display:inline-flex;align-items:center;gap:12px;}
.btn::after{
  content:"";position:absolute;inset:0;z-index:1;
  transform:translateY(101%);transition:transform .5s var(--e-out);
}
.btn:hover::after{transform:translateY(0);}
.btn svg{width:15px;height:15px;transition:transform .4s var(--e);}
.btn:hover svg{transform:translateX(5px);}

.btn--solid{background:var(--blue);color:#fff;border-color:rgba(255,255,255,.55);}
.btn--solid::after{background:var(--ink);}
.btn--ink{background:var(--ink);color:#fff;}
.btn--ink::after{background:var(--blue);}
.btn--line{border-color:rgba(13,71,161,.5);color:var(--ink);}
.btn--line::after{background:var(--ink);}
.btn--line:hover{color:#fff;border-color:var(--ink);}
.sec--dark .btn--line,.hero .btn--line,.phero .btn--line,.cta .btn--line,.band .btn--line{border-color:rgba(255,255,255,.55);color:#fff;}
.sec--dark .btn--line::after,.hero .btn--line::after,.phero .btn--line::after,.cta .btn--line::after,.band .btn--line::after{background:#fff;}
.sec--dark .btn--line:hover,.hero .btn--line:hover,.phero .btn--line:hover,.cta .btn--line:hover,.band .btn--line:hover{color:var(--ink);border-color:#fff;}
.cta .tlink,.band .tlink{color:#fff;}
.btn--wa{background:#128C4A;color:#fff;border-color:rgba(255,255,255,.55);}
.btn--wa::after{background:#0B6435;}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;}

.tlink{
  display:inline-flex;align-items:center;gap:10px;position:relative;
  font-family:var(--f-d);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);padding-bottom:6px;
}
.tlink::before{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .55s var(--e-out);
}
.tlink:hover::before{transform:scaleX(1);transform-origin:left;}
.tlink svg{width:14px;height:14px;transition:transform .4s var(--e);}
.tlink:hover svg{transform:translateX(5px);}
.sec--dark .tlink{color:#fff;}

/* ---------- Header ---------- */
.hdr{
  position:fixed;inset:0 0 auto 0;z-index:90;height:var(--hdr);
  display:flex;align-items:center;
  transition:height .5s var(--e),background .5s var(--e),border-color .5s var(--e);
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  height:72px;background:rgba(255,255,255,.92);border-bottom-color:var(--line);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);width:100%;}
.hdr__logo{display:block;position:relative;height:58px;transition:height .5s var(--e);}
.hdr.is-stuck .hdr__logo{height:44px;}
.hdr__logo img{height:100%;width:auto;transition:opacity .4s var(--e);}
.hdr__logo .on-dark{position:absolute;inset:0;}
.hdr.is-stuck .on-dark{opacity:0;}
.hdr__logo .on-light{opacity:0;}
.hdr.is-stuck .on-light{opacity:1;}

.nav{display:flex;align-items:center;gap:2px;}
.nav a,.nav button{
  display:inline-flex;align-items:center;gap:7px;padding:11px 16px;
  font-family:var(--f-d);font-size:12px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  color:rgba(255,255,255,.82);transition:color .3s var(--e);position:relative;
}
.hdr.is-stuck .nav a,.hdr.is-stuck .nav button{color:var(--ink-3);}
.nav a::after{
  content:"";position:absolute;left:16px;right:16px;bottom:6px;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e-out);
}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left;}
.nav a:hover,.nav button:hover{color:#fff;}
.hdr.is-stuck .nav a:hover,.hdr.is-stuck .nav button:hover{color:var(--blue);}
.nav svg{width:9px;height:9px;transition:transform .4s var(--e);}
.hdr__drop[data-open="true"] svg{transform:rotate(180deg);}
.hdr__cta{display:flex;align-items:center;gap:16px;}
.hdr__tel{
  font-family:var(--f-d);font-size:12px;font-weight:700;letter-spacing:.1em;color:#fff;
  padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.3);transition:color .3s var(--e),border-color .3s var(--e);
}
.hdr.is-stuck .hdr__tel{color:var(--ink);border-bottom-color:var(--line);}
.hdr .btn{padding:15px 26px;}

/* Mega */
.hdr__drop{position:relative;}
.mega{
  position:fixed;left:50%;top:calc(var(--hdr) - 8px);transform:translate(-50%,-10px);
  width:min(1180px,calc(100vw - 80px));background:var(--paper);
  border:1px solid var(--line);padding:var(--s6);
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .4s var(--e),transform .4s var(--e),visibility .4s;
  box-shadow:0 40px 90px rgba(10,18,32,.16);
}
.hdr.is-stuck .mega{top:64px;}
.hdr__drop[data-open="true"] .mega{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);}
.mega h5{
  font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--blue);
  padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:8px;
}
.mega a{
  display:block;padding:13px 0;border-bottom:1px solid var(--line-2);
  font-family:var(--f-d);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em;
  transition:padding-left .4s var(--e),color .3s var(--e);
}
.mega a:hover{padding-left:12px;color:var(--blue);}
.mega a small{display:block;font-family:var(--f-t);font-size:12.5px;font-weight:400;color:var(--tx-mute);letter-spacing:0;margin-top:2px;}

/* Burger + drawer */
.burger{display:none;width:44px;height:44px;position:relative;border:1px solid rgba(255,255,255,.28);}
.hdr.is-stuck .burger{border-color:var(--line);}
.burger i{position:absolute;left:12px;width:20px;height:1.5px;background:#fff;transition:transform .45s var(--e),opacity .3s,background .4s;}
.hdr.is-stuck .burger i{background:var(--ink);}
.burger i:nth-child(1){top:16px;} .burger i:nth-child(2){top:26px;}
body.nav-open .burger i{background:var(--ink);}
body.nav-open .burger i:nth-child(1){transform:translateY(5px) rotate(45deg);}
body.nav-open .burger i:nth-child(2){transform:translateY(-5px) rotate(-45deg);}

.drawer{
  position:fixed;inset:0;z-index:88;background:var(--paper);
  padding:calc(var(--hdr) + 24px) var(--pad) var(--s10);overflow-y:auto;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--e-out);
}
body.nav-open{overflow:hidden;}
body.nav-open .drawer{clip-path:inset(0 0 0 0);}
.drawer h5{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--blue);margin:var(--s6) 0 4px;font-family:var(--f-d);}
.drawer a{
  display:flex;align-items:center;justify-content:space-between;padding:16px 0;
  border-bottom:1px solid var(--line-2);font-family:var(--f-d);font-weight:700;
  font-size:19px;color:var(--ink);letter-spacing:-.02em;
}
.drawer .btn{width:100%;margin-top:var(--s3);border:1px solid rgba(255,255,255,.55);}

/* main links: big and airy; service groups: collapsed accordions */
.drawer__main a{font-size:26px;padding:18px 0;}
.drawer__grp{border-bottom:1px solid var(--line-2);}
.drawer__grp summary{
  display:flex;align-items:center;justify-content:space-between;list-style:none;
  cursor:pointer;padding:16px 0;font-family:var(--f-d);font-weight:700;
  font-size:17px;color:var(--ink);letter-spacing:-.01em;-webkit-tap-highlight-color:transparent;
}
.drawer__grp summary::-webkit-details-marker{display:none;}
.drawer__grp summary b{
  font-weight:700;font-size:11px;color:var(--blue);border:1px solid var(--line);
  border-radius:99px;padding:3px 10px;letter-spacing:.06em;transition:transform .3s var(--e);
}
.drawer__grp[open] summary b{background:var(--blue);color:#fff;border-color:var(--blue);}
.drawer__grp > div{padding:0 0 10px 14px;}
.drawer__grp > div a{font-size:16px;font-weight:600;padding:12px 0;border-bottom-color:transparent;color:var(--tx-mute);}
.drawer__grp > div a i{font-style:normal;font-size:11px;color:var(--tx-mute);}
.drawer__ctas{margin-top:var(--s6);}

/* Scroll bar */
.bar{
  position:fixed;top:0;left:0;right:0;height:2px;z-index:95;background:var(--blue-b);
  transform:scaleX(0);transform-origin:left;
}

/* Cursor */
.cursor{position:fixed;inset:0;z-index:200;pointer-events:none;mix-blend-mode:difference;}
.cursor__dot,.cursor__ring{position:absolute;top:0;left:0;border-radius:50%;will-change:transform;}
.cursor__dot{width:6px;height:6px;background:#fff;margin:-3px 0 0 -3px;}
.cursor__ring{
  width:38px;height:38px;border:1px solid rgba(255,255,255,.6);margin:-19px 0 0 -19px;
  transition:width .35s var(--e),height .35s var(--e),margin .35s var(--e),opacity .35s;
}
.cursor.is-active .cursor__ring{width:62px;height:62px;margin:-31px 0 0 -31px;}
@media (pointer:coarse){.cursor{display:none;}}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  background:var(--ink);overflow:hidden;padding-top:var(--hdr);
}
/* Parallax layers are oversized so the translation never uncovers the edge.
   Overhang must exceed speed x (section height + viewport height) / 2. */
.hero__bg{position:absolute;top:-28%;left:0;right:0;height:156%;z-index:0;will-change:transform;}
.hero__bg video,.hero__bg img{width:100%;height:100%;object-fit:cover;}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,18,32,.86) 0%,rgba(10,18,32,.62) 42%,rgba(10,18,32,.94) 100%),
             linear-gradient(90deg,rgba(10,18,32,.90) 0%,rgba(10,18,32,.30) 62%,rgba(10,18,32,.55) 100%);
}
.hero__grid{display:none;}

.hero__in{position:relative;z-index:3;width:100%;padding-bottom:var(--s8);}
.hero__top{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s10);margin-bottom:var(--s10);}
.hero h1{color:#fff;}
.hero h1 em{font-style:normal;color:var(--blue-l);}
.hero__aside{max-width:340px;padding-left:var(--s4);border-left:1px solid var(--line-inv);}
.hero__aside p{color:var(--tx-inv);font-size:16px;line-height:1.62;}

.hero__meta{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line-inv);
}
.hero__meta > div{padding:var(--s4) var(--s4) 0 0;border-left:1px solid var(--line-inv);padding-left:var(--s4);}
.hero__meta > div:first-child{border-left:0;padding-left:0;}
.hero__meta strong{
  display:block;font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--blue-l);margin-bottom:12px;
}
.hero__meta p{color:#DCE3ED;font-size:15px;line-height:1.5;}

.hero__scroll{
  position:absolute;right:var(--pad);bottom:var(--s8);z-index:4;
  display:flex;align-items:center;gap:14px;
  font-family:var(--f-d);font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;
  color:rgba(255,255,255,.5);writing-mode:vertical-rl;
}
.hero__scroll i{width:1px;height:70px;background:rgba(255,255,255,.22);position:relative;overflow:hidden;}
.hero__scroll i::after{content:"";position:absolute;inset:0 auto auto 0;width:1px;height:24px;background:#fff;animation:trail 2.4s var(--e-io) infinite;}
@keyframes trail{0%{transform:translateY(-24px)}100%{transform:translateY(70px)}}

/* ---------- Ticker ---------- */
.ticker{
  background:var(--ink);color:#fff;padding:26px 0;overflow:hidden;
  border-top:1px solid var(--line-inv);border-bottom:1px solid var(--line-inv);
}
.ticker__t{
  display:flex;gap:var(--s8);width:max-content;animation:tick 44s linear infinite;
  transform:skewX(calc(var(--vel) * -0.09deg));transition:transform .3s var(--e);
}
.ticker__t span{
  display:inline-flex;align-items:center;gap:var(--s8);white-space:nowrap;
  font-family:var(--f-d);font-size:clamp(20px,2.4vw,34px);font-weight:800;
  letter-spacing:-.02em;color:rgba(255,255,255,.16);
}
.ticker__t span::after{content:"";width:7px;height:7px;background:var(--blue-b);}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---------- Editorial statement ---------- */
.state{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s12);align-items:start;}
.sec--clip .state{margin-top:var(--s20);}
.sec--clip .state h2{margin-top:var(--s8);}
.state__media{position:relative;overflow:hidden;aspect-ratio:3/4;}
.state__media img,.state__media video{
  position:absolute;top:0;left:0;width:100%;height:100%;
  object-fit:cover;will-change:transform;
}
.state__note{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line);}
.state p + p{margin-top:var(--s3);}

/* ---------- Service index list ---------- */
.svcx{border-top:1px solid var(--line);}
.sec--dark .svcx{border-top-color:var(--line-inv);}
.svcx__row{
  position:relative;display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,1.15fr) 150px;
  gap:var(--s6);align-items:center;padding:var(--s6) 0;
  border-bottom:1px solid var(--line);
  transition:padding-left .6s var(--e-out),background .5s var(--e);
}
.sec--dark .svcx__row{border-bottom-color:var(--line-inv);}
.svcx__row:hover{padding-left:26px;background:linear-gradient(90deg,rgba(27,86,225,.05),rgba(27,86,225,0) 70%);}
.svcx__num{font-family:var(--f-d);font-size:13px;font-weight:700;letter-spacing:.16em;color:var(--tx-mute);}
.svcx__row:hover .svcx__num{color:var(--blue);}
.sec--dark .svcx__row:hover .svcx__num{color:var(--blue-l);}
.svcx__name{
  font-family:var(--f-d);font-size:clamp(22px,2.3vw,36px);font-weight:800;
  letter-spacing:-.032em;line-height:1.06;color:var(--ink);transition:color .4s var(--e);
}
.sec--dark .svcx__name{color:#fff;}
.svcx__row:hover .svcx__name{color:var(--blue);}
.sec--dark .svcx__row:hover .svcx__name{color:var(--blue-l);}
.svcx__desc{font-size:15.5px;line-height:1.6;color:var(--tx-mute);}
.svcx__go{
  justify-self:end;display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--tx-mute);transition:color .4s var(--e),transform .5s var(--e-out);
}
.svcx__row:hover .svcx__go{color:var(--blue);transform:translateX(6px);}
.sec--dark .svcx__row:hover .svcx__go{color:var(--blue-l);}
.svcx__go svg{width:14px;height:14px;}

/* hover: the description fades away and the photo takes its place — full
   row height, flush against the CTA column, never over the title */
.svcx__peek{display:none;}
@media (hover:hover) and (min-width:1100px){
  .svcx__peek{
    display:block;position:absolute;top:0;right:150px;height:100%;width:320px;
    overflow:hidden;opacity:0;transform:translateX(28px);pointer-events:none;
    transition:opacity .45s var(--e),transform .55s var(--e-out);z-index:2;
  }
  .svcx__peek img{width:100%;height:100%;object-fit:cover;}
  .svcx__desc{transition:opacity .3s var(--e),transform .4s var(--e);}
  .svcx__row:hover .svcx__desc{opacity:0;transform:translateX(-16px);}
  .svcx__row:hover .svcx__peek{opacity:1;transform:none;}
}

/* ---------- Media card grid (services page / related) ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.sec--dark .cards{background:var(--line-inv);border-color:var(--line-inv);}
.card{position:relative;background:var(--paper);display:flex;flex-direction:column;}
.sec--dark .card{background:var(--ink);}
.card > a{display:flex;flex-direction:column;height:100%;}
.card__m{position:relative;overflow:hidden;aspect-ratio:16/11;background:var(--ink-2);}
.card__m img{width:100%;height:100%;object-fit:cover;transform:scale(1.01);transition:transform 1.4s var(--e-out),filter .8s var(--e);filter:saturate(.85);}
.card:hover .card__m img{transform:scale(1.08);filter:saturate(1);}
.card__m::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,32,.05),rgba(10,18,32,.55));}
.card__n{
  position:absolute;top:20px;left:20px;z-index:2;font-family:var(--f-d);
  font-size:11px;font-weight:700;letter-spacing:.18em;color:#fff;
}
.card__b{padding:var(--s4);display:flex;flex-direction:column;gap:14px;flex:1;}
.card__b h3{font-size:22px;font-weight:800;letter-spacing:-.028em;line-height:1.14;}
.card__b p{font-size:15px;line-height:1.6;color:var(--tx-mute);flex:1;}
.card__go{
  display:inline-flex;align-items:center;gap:10px;font-family:var(--f-d);
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);
}
.card__go svg{width:13px;height:13px;transition:transform .45s var(--e);}
.card:hover .card__go svg{transform:translateX(6px);}
.card::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:var(--blue-b);
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--e-out);z-index:3;
}
.card:hover::before{transform:scaleX(1);}

/* ---------- Sticky process ---------- */
.proc{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s12);align-items:start;}
.proc__stick{position:sticky;top:180px;}
.proc__big{
  font-family:var(--f-d);font-size:clamp(120px,17vw,260px);font-weight:900;
  line-height:.8;letter-spacing:-.06em;color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.20);margin-top:var(--s6);
}
.proc__step{padding:var(--s8) 0;border-bottom:1px solid var(--line-inv);}
.proc__step:first-child{padding-top:0;}
.proc__step:last-child{border-bottom:0;}
.proc__step h3{margin:14px 0 16px;}
.proc__step p{max-width:52ch;}

/* ---------- Stat band with media ---------- */
.band{position:relative;overflow:hidden;background:var(--ink);isolation:isolate;}
.band__bg{position:absolute;top:-34%;left:0;right:0;height:168%;z-index:0;will-change:transform;}
.band__bg video,.band__bg img{width:100%;height:100%;object-fit:cover;opacity:.34;}
.band__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,18,32,.95),rgba(10,18,32,.55));}
.band__in{position:relative;z-index:2;padding-block:var(--s16);}

.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-inv);margin-top:var(--s10);}
.stat{padding:var(--s5) var(--s4) 0 var(--s4);border-left:1px solid var(--line-inv);}
.stat:first-child{border-left:0;padding-left:0;}
.stat b{display:block;font-family:var(--f-d);font-size:clamp(38px,4.4vw,64px);font-weight:900;letter-spacing:-.045em;color:#fff;line-height:1;}
.stat span{display:block;margin-top:14px;font-size:14.5px;line-height:1.5;color:var(--tx-inv);}

/* ---------- Horizontal scroll ---------- */
.hs{height:320vh;position:relative;}
.hs__stick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;}
.hs__head{padding-inline:var(--pad);margin-bottom:var(--s5);}
.hs__head .kicker{margin-bottom:var(--s4);}
.hs__head .d2{font-size:clamp(28px,3.1vw,46px);}
.hs__track{display:flex;gap:24px;padding-inline:var(--pad);will-change:transform;}
.hs__item{flex:0 0 min(380px,74vw);position:relative;}
.hs__item figure{position:relative;overflow:hidden;aspect-ratio:3/4;margin:0;background:var(--ink-2);}
.hs__item img{width:100%;height:100%;object-fit:cover;filter:saturate(.82);transition:transform 1.3s var(--e-out),filter .7s var(--e);}
.hs__item:hover img{transform:scale(1.06);filter:saturate(1);}
.hs__item figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:26px;z-index:2;
  background:linear-gradient(180deg,transparent,rgba(10,18,32,.88));
}
.hs__item h3{color:#fff;font-size:24px;font-weight:800;letter-spacing:-.028em;}
.hs__item p{color:var(--tx-inv);font-size:14px;margin-top:8px;line-height:1.5;}
.hs__i{font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--blue-l);margin-bottom:10px;display:block;}

/* ---------- Two-column feature lists ---------- */
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s12);align-items:start;}
.dl{border-top:1px solid var(--line);}
.sec--dark .dl{border-top-color:var(--line-inv);}
.dl li{
  display:flex;gap:20px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line-2);
  font-size:16px;line-height:1.55;color:var(--tx);
}
.sec--dark .dl li{border-bottom-color:var(--line-inv-2);color:var(--tx-inv);}
.dl li b{font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--blue);min-width:28px;}
.sec--dark .dl li b{color:var(--blue-l);}

.tags{display:flex;flex-wrap:wrap;gap:10px;}
.tags li{
  padding:10px 20px;border:1px solid var(--line);border-radius:99px;
  font-family:var(--f-d);font-size:13px;font-weight:600;color:var(--ink);letter-spacing:-.005em;
  transition:background .4s var(--e),color .4s var(--e),border-color .4s var(--e),transform .4s var(--e);
}
.tags li:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-2px);}
.sec--dark .tags li,.band .tags li,.cta .tags li{border-color:var(--line-inv);color:#DCE3ED;}
.sec--dark .tags li:hover,.band .tags li:hover,.cta .tags li:hover{background:#fff;color:var(--ink);border-color:#fff;}

/* value / benefit rows */
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line);}
.sec--dark .vals{background:var(--line-inv);border-color:var(--line-inv);}
.val{background:var(--paper);padding:var(--s6) var(--s4);}
.sec--dark .val{background:var(--ink);}
.val b{display:block;font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--blue);margin-bottom:22px;}
.sec--dark .val b{color:var(--blue-l);}
.val h4{font-size:20px;font-weight:800;letter-spacing:-.024em;margin-bottom:12px;line-height:1.2;}
.val p{font-size:15px;line-height:1.62;color:var(--tx-mute);}

/* frequency */
.freq{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line-inv);border:1px solid var(--line-inv);}
.freq div{background:var(--ink);padding:var(--s5) var(--s4);transition:background .5s var(--e);}
.freq div:hover{background:var(--ink-3);}
.freq b{display:block;font-family:var(--f-d);font-size:19px;font-weight:800;color:#fff;letter-spacing:-.024em;}
.freq span{display:block;margin-top:8px;font-size:14px;color:var(--tx-inv);}

/* ---------- Accordion ---------- */
.qa{border-top:1px solid var(--line);}
.qa__item{border-bottom:1px solid var(--line);}
.qa__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--s4);
  padding:32px 0;text-align:left;font-family:var(--f-d);font-size:clamp(19px,1.7vw,26px);
  font-weight:700;letter-spacing:-.026em;color:var(--ink);transition:color .35s var(--e);
}
.qa__q:hover{color:var(--blue);}
.qa__ic{position:relative;width:20px;height:20px;flex:none;}
.qa__ic::before,.qa__ic::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;transform:translate(-50%,-50%);transition:transform .45s var(--e),opacity .35s;}
.qa__ic::before{width:16px;height:1.5px;}
.qa__ic::after{width:1.5px;height:16px;}
.qa__item[data-open="true"] .qa__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
.qa__a{height:0;overflow:hidden;transition:height .55s var(--e-out);}
.qa__a > div{padding-bottom:34px;max-width:70ch;}

/* ---------- Page hero (inner pages) ---------- */
.phero{position:relative;min-height:78svh;display:flex;align-items:flex-end;background:var(--ink);overflow:hidden;padding-top:var(--hdr);}
.phero__bg{position:absolute;top:-30%;left:0;right:0;height:160%;z-index:0;will-change:transform;}
/* the about hero shows people: keep the band high so faces stay in frame */
.phero--about .phero__bg{top:0;height:112%;}
.phero--about .phero__bg img{object-position:top;}
.phero__bg img,.phero__bg video{width:100%;height:100%;object-fit:cover;}
.phero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,32,.88),rgba(10,18,32,.52) 46%,rgba(10,18,32,.95));}
.phero__in{position:relative;z-index:2;width:100%;padding-block:var(--s12) var(--s8);}
.phero h1{color:#fff;max-width:17ch;}
.phero__lead{max-width:56ch;margin-top:var(--s4);color:var(--tx-inv);font-size:clamp(17px,1.35vw,20px);line-height:1.6;}
.crumb{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-family:var(--f-d);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-mute);margin-bottom:var(--s6);}
.crumb a:hover{color:#fff;}
.crumb i{font-style:normal;color:rgba(255,255,255,.24);}

/* ---------- Form ---------- */
.form{border-top:1px solid var(--line);padding-top:var(--s6);}
.f{margin-bottom:var(--s4);}
.f label{display:block;font-family:var(--f-d);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-mute);margin-bottom:10px;}
.f input,.f select,.f textarea{
  width:100%;min-height:56px;padding:16px 0;border:0;border-bottom:1px solid var(--line);
  background:transparent;font-family:var(--f-t);font-size:17px;color:var(--ink);
  transition:border-color .4s var(--e);border-radius:0;
}
.f textarea{min-height:120px;resize:vertical;line-height:1.6;}
.f input:focus,.f select:focus,.f textarea:focus{outline:0;border-bottom-color:var(--blue);}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);}
.form-msg{margin-top:var(--s3);padding:16px 20px;font-size:14.5px;display:none;}
.form-msg.is-ok{display:block;background:rgba(18,140,74,.08);color:#0B6435;border-left:2px solid #128C4A;}
.form-msg.is-err{display:block;background:rgba(200,30,30,.06);color:#8E1B1B;border-left:2px solid #C81E1E;}

.info{border-top:1px solid var(--line-inv);}
.info li{display:grid;grid-template-columns:130px 1fr;gap:var(--s4);padding:24px 0;border-bottom:1px solid var(--line-inv-2);align-items:baseline;}
.info b{font-family:var(--f-d);font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-mute);}
.info a,.info p{color:#fff;font-size:17px;line-height:1.5;}
.info a:hover{color:var(--blue-l);}

/* ---------- CTA ---------- */
.cta{position:relative;background:var(--ink);overflow:hidden;}
.cta__in{position:relative;z-index:2;padding-block:var(--s16);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:var(--s12);align-items:end;}
.cta h2{color:#fff;}
.cta p{color:var(--tx-inv);max-width:48ch;margin-top:var(--s4);}
.cta__glow{position:absolute;width:640px;height:640px;border-radius:50%;background:rgba(43,123,243,.20);filter:blur(120px);right:-160px;top:-200px;z-index:0;}

/* ---------- Footer ---------- */
.ftr{background:var(--ink);color:var(--tx-inv);padding-block:var(--s12) var(--s5);border-top:1px solid var(--line-inv);}
.ftr__top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.35fr;gap:var(--s8);padding-bottom:var(--s10);}
.ftr h5{font-family:var(--f-d);font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#fff;margin-bottom:24px;}
.ftr li{margin-bottom:12px;}
.ftr a{font-size:15px;color:var(--tx-inv);transition:color .3s var(--e),padding-left .4s var(--e);}
.ftr a:hover{color:#fff;}
.ftr__logo{height:56px;width:auto;margin-bottom:26px;}
.ftr__note{font-size:15px;max-width:34ch;color:var(--tx-mute);line-height:1.6;}
.ftr__soc{display:flex;gap:8px;margin-top:28px;}
.ftr__soc a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line-inv);transition:background .4s var(--e),color .4s var(--e),border-color .4s var(--e);}
.ftr__soc a:hover{background:#fff;color:var(--ink);border-color:#fff;}
.ftr__soc svg{width:17px;height:17px;}
.ftr__areas{display:flex;flex-wrap:wrap;gap:7px;}
.ftr__areas li{margin:0;}
.ftr__areas a{display:inline-block;padding:6px 12px;border:1px solid var(--line-inv);font-size:12.5px;}
.ftr__areas a:hover{background:rgba(255,255,255,.07);color:#fff;}
.ftr__bot{display:flex;flex-wrap:wrap;gap:16px var(--s6);justify-content:space-between;padding-top:var(--s5);border-top:1px solid var(--line-inv);font-size:13px;color:var(--tx-mute);}

/* ---------- WhatsApp float ---------- */
.wa{
  position:fixed;right:28px;bottom:28px;z-index:80;width:56px;height:56px;
  display:grid;place-items:center;background:#128C4A;color:#fff;border-radius:50%;
  transition:transform .45s var(--e-out),background .4s var(--e);
}
.wa svg{width:26px;height:26px;position:relative;z-index:2;}
.wa:hover{transform:scale(1.1);background:#0B6435;}
.wa::before{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(18,140,74,.6);animation:ping 2.8s var(--e) infinite;}
@keyframes ping{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.65);opacity:0}}

/* ==========================================================================
   Reveal states
   ========================================================================== */
[data-anim]{--d:0s;}
[data-anim="up"]{opacity:0;transform:translateY(72px);transition:opacity .8s var(--e-out) var(--d),transform 1.05s var(--e-out) var(--d);}
[data-anim="fade"]{opacity:0;transform:translateY(24px);transition:opacity .9s var(--e-out) var(--d),transform .9s var(--e-out) var(--d);}
[data-anim="left"]{opacity:0;transform:translateX(-72px);transition:opacity .85s var(--e-out) var(--d),transform 1.05s var(--e-out) var(--d);}
[data-anim="right"]{opacity:0;transform:translateX(72px);transition:opacity .85s var(--e-out) var(--d),transform 1.05s var(--e-out) var(--d);}
/* Masks and rules animate an inner child: an element clipped to zero area
   never intersects, so IntersectionObserver would never fire on it. */
[data-anim="mask"] > *{clip-path:inset(0 0 100% 0);transition:clip-path 1.25s var(--e-out) var(--d);}
[data-anim="mask"].in > *{clip-path:inset(0 0 0 0);}
[data-anim="maskr"] > *{clip-path:inset(0 100% 0 0);transition:clip-path 1.25s var(--e-out) var(--d);}
[data-anim="maskr"].in > *{clip-path:inset(0 0 0 0);}
[data-anim="rule"] > *{transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--e-out) var(--d);}
[data-anim="rule"].in > *{transform:scaleX(1);}
[data-anim="scale"]{opacity:0;transform:scale(1.08);transition:opacity 1.2s var(--e-out) var(--d),transform 1.4s var(--e-out) var(--d);}

/* Continuous, scroll-linked zoom. --p is written every frame by motion.js on
   any [data-progress] element, so this keeps moving the whole time the media
   is on screen instead of firing once and stopping. Uses the standalone
   `scale` property so it does not fight the parallax `transform`. */
[data-zoom] > img,[data-zoom] > video{scale:calc(1.16 - .16 * var(--p,0));}

[data-anim].in{opacity:1;transform:none;}

.ln{display:block;overflow:hidden;padding-bottom:.06em;}
.ln > i{display:block;font-style:normal;transform:translateY(108%);transition:transform 1.15s var(--e-out) var(--d);}
[data-anim="lines"].in .ln > i{transform:translateY(0);}

/* Scroll-scrubbed mode: motion.js drives opacity/transform inline every
   frame, so the time-based transitions must not fight it. */
.has-scrub [data-anim]{transition:none;}
.wd{display:inline-block;opacity:.1;}

/* character fly-in ([data-anim="chars"]) */
.chl{display:block;}
.chw{display:inline-block;white-space:nowrap;}
.ch{display:inline-block;font-style:normal;will-change:transform;backface-visibility:hidden;}
.sec--clip{overflow:hidden;}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  [data-anim]{opacity:1 !important;transform:none !important;}
  [data-anim] > *{clip-path:none !important;}
  .ln > i{transform:none !important;}
  .hs{height:auto;}
  .hs__stick{position:static;height:auto;}
  .hs__track{overflow-x:auto;}
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1280px){
  :root{--pad:32px;}
  .svcx__row{grid-template-columns:80px minmax(0,1fr) 130px;}
  .svcx__desc{display:none;}
  .hero__meta{grid-template-columns:repeat(2,1fr);}
  .hero__meta > div:nth-child(3){border-left:0;padding-left:0;}
  .hero__meta > div:nth-child(n+3){margin-top:var(--s4);}
}
@media (max-width:1080px){
  .state,.proc,.cols,.cta__in{grid-template-columns:1fr;gap:var(--s8);}
  .proc__stick{position:static;}
  .proc__big{display:none;}
  .cards,.vals{grid-template-columns:repeat(2,1fr);}
  .stats{grid-template-columns:repeat(2,1fr);}
  .stat:nth-child(3){border-left:0;padding-left:0;}
  .stat:nth-child(n+3){margin-top:var(--s5);}
  .hero__top{flex-direction:column;align-items:flex-start;gap:var(--s6);}
  .hero__aside{max-width:none;}
}
@media (max-width:980px){
  .nav,.hdr__tel,.hdr__cta .btn{display:none;}
  .burger{display:block;}
}
@media (max-width:760px){
  :root{--pad:20px;--hdr:70px;}
  body{font-size:16px;}
  .sec{padding-block:var(--s12);}
  .sec--sm{padding-block:var(--s10);}
  .kicker{margin-bottom:var(--s6);flex-wrap:wrap;gap:10px;}
  .kicker span:last-child{margin-left:0;width:100%;}
  .cards,.vals,.f-row,.hero__meta{grid-template-columns:1fr;}
  .hero__meta > div{border-left:0;padding-left:0;margin-top:var(--s3);}
  .stats{grid-template-columns:1fr 1fr;}
  .btn{width:100%;padding:18px 24px;}
  .btn-row{flex-direction:column;}
  .hdr .btn{width:auto;padding:13px 16px;font-size:10.5px;}
  .hdr__logo{height:42px;}
  .hdr.is-stuck .hdr__logo{height:36px;}
  .hero{min-height:auto;padding-top:calc(var(--hdr) + 24px);}
  .hero__in{padding-block:var(--s10) var(--s6);}
  .hero__aside{padding-left:var(--s3);}
  .hero__scroll{display:none;}
  .svcx__row{grid-template-columns:52px minmax(0,1fr) 24px;gap:var(--s3);padding:var(--s4) 0;}
  .svcx__row:hover{padding-left:0;}
  .svcx__go span{display:none;}
  .svcx__peek{display:none;}
  .hs{height:auto;}
  .hs__stick{position:static;height:auto;padding-block:var(--s6);}
  .hs__track{overflow-x:auto;transform:none !important;padding-bottom:var(--s3);scroll-snap-type:x mandatory;}
  .hs__item{scroll-snap-align:start;}
  .info li{grid-template-columns:1fr;gap:6px;}
  .ftr__top{grid-template-columns:1fr;gap:var(--s6);}
  .proc__step{padding:var(--s6) 0;}
  .state__media{aspect-ratio:4/5;}
}