/* =========================================================
   Vertico Elevators Design System
   Four colours only: black, white, navy blue, light blue.
   Neutrals are true greyscale off black and white, never tinted,
   so navy and light blue stay the only hues on the page.
   ========================================================= */

:root{
  /* ---- the four ---- */
  --black:#000000;
  --white:#FFFFFF;
  --navy:#111F4A;          /* brand navy */
  --sky:#4B9BEF;           /* brand light blue */

  /* navy, for blocks and depth */
  --navy-950:#070D1F;      /* footer */
  --navy-900:#000000;      /* page base is pure black */
  --navy-800:#111F4A;      /* the navy block colour */
  --navy-700:#17255A;
  --navy-600:#1D2E6B;

  /* light blue, for accent and state */
  --blue-700:#1E4FA0;
  --blue-600:#2E6FD0;
  --blue-500:#3B87E0;
  --blue-400:#4B9BEF;
  --blue-300:#7FB6F5;
  --blue-200:#A8CDF9;

  /* surfaces: neutral grey off black */
  --bg:#000000;
  --bg-soft:#0A0A0C;
  --surface:#131316;
  --surface-2:#1D1D22;
  --line:rgba(255,255,255,.13);
  --line-2:rgba(255,255,255,.07);

  /* text: white through neutral grey */
  --ink:#FFFFFF;
  --ink-2:#E8E8EA;
  --muted:#ADADB4;
  --muted-2:#8B8B93;

  /* Type */
  /* Matches verticoelevators.com: Montserrat headings, Noto Sans body */
  --font:"Noto Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-display:"Montserrat","Noto Sans",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;

  /* Shape */
  --r-sm:5px; --r:7px; --r-lg:9px; --r-xl:11px; --r-full:999px;

  /* Elevation */
  --sh-xs:0 1px 2px rgba(0,0,0,.4);
  --sh-sm:0 2px 10px rgba(0,0,0,.35);
  --sh:0 8px 30px rgba(0,0,0,.45);
  --sh-lg:0 24px 60px rgba(0,0,0,.6);
  --sh-blue:0 4px 14px rgba(0,0,0,.38);

  /* Layout */
  --container:1200px;
  --gutter:20px;
  --section:96px;
  --header-h:76px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px);background:var(--bg)}
body{
  margin:0;font-family:var(--font);font-size:16px;line-height:1.65;
  color:var(--ink-2);background:var(--bg);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font:inherit;color:inherit}
ul,ol{margin:0;padding:0}
h1,h2,h3,h4,h5,p{margin:0}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:3px solid var(--blue-400);outline-offset:2px;border-radius:4px}
::selection{background:var(--blue-500);color:#fff}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--navy-900)}
::-webkit-scrollbar-thumb{background:#2A2A30;border-radius:8px;border:3px solid var(--black)}
::-webkit-scrollbar-thumb:hover{background:#3A3A42}

/* ---------- Typography ---------- */
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);font-weight:800;line-height:1.16;letter-spacing:-.012em}
h1{font-size:clamp(2.15rem,1.35rem + 3.5vw,3.9rem)}
h2{font-size:clamp(1.7rem,1.15rem + 2.3vw,2.7rem)}
h3{font-size:clamp(1.12rem,1rem + .55vw,1.4rem);font-weight:700;letter-spacing:-.008em}
h4{font-size:1.02rem;font-weight:700;letter-spacing:-.005em}
p{color:var(--muted)}
strong{color:var(--ink);font-weight:650}
.lede{font-size:clamp(1.02rem,.96rem + .35vw,1.2rem);line-height:1.72;color:var(--ink-2)}

/* ---------- Layout ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section);position:relative}
.section--tight{padding-block:calc(var(--section) * .66)}
.section--soft{background:var(--bg-soft)}
.section--navy{
  background:var(--navy);
  border-block:1px solid var(--line-2);
}
.section--navy::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:none;
}
.section--navy > *{position:relative}

.sec-head{max-width:720px;margin-bottom:52px}
.sec-head--center{margin-inline:auto;text-align:center}
.sec-head h2{margin-bottom:16px}
.sec-head p{font-size:1.06rem;line-height:1.72}

.grid{display:grid;gap:24px}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--font-display);
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 26px;border-radius:var(--r-full);
  font-size:.95rem;font-weight:650;letter-spacing:-.01em;white-space:nowrap;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease,border-color .18s ease;
  border:1.5px solid transparent;
}
.btn svg{width:18px;height:18px;flex:none}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--primary{background:var(--sky);color:var(--black)}
.btn--primary:hover{background:var(--blue-300)}
.btn--navy{background:var(--surface-2);color:var(--ink);border-color:var(--line);box-shadow:var(--sh-sm)}
.btn--navy:hover{background:var(--navy);border-color:rgba(75,155,239,.4);color:#fff}
.btn--ghost{background:rgba(255,255,255,.045);color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(75,155,239,.45);color:#fff}
.btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.btn--outline-light:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.55)}
.btn--wa{background:#25D366;color:#04140A}
.btn--wa:hover{background:#33E074}
.btn--sm{padding:10px 18px;font-size:.875rem}
.btn--lg{padding:16px 32px;font-size:1rem}
.btn--block{width:100%}

.link-arrow{
  font-family:var(--font-display);
  display:inline-flex;align-items:center;gap:7px;
  color:var(--blue-400);font-weight:650;font-size:.92rem;
}
.link-arrow svg{width:16px;height:16px;transition:transform .2s ease}
.link-arrow:hover{color:var(--blue-300)}
.link-arrow:hover svg{transform:translateX(4px)}

/* ---------- Header ---------- */
.header{
  position:sticky;top:0;z-index:100;background:rgba(0,0,0,.72);
  backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--line-2);transition:background .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.header.is-stuck{background:rgba(0,0,0,.94);box-shadow:0 8px 30px rgba(0,0,0,.5);border-color:var(--line)}
.header__inner{display:flex;align-items:center;gap:20px;height:var(--header-h)}
.brand{display:flex;align-items:center;flex:none;margin-right:auto}
.brand img{height:44px;width:auto}

.nav{display:flex;align-items:center;gap:2px}
.nav a{
  font-family:var(--font-display);
  padding:9px 14px;border-radius:var(--r-sm);
  font-size:.925rem;font-weight:550;color:var(--ink-2);
  transition:color .18s ease,background .18s ease;
}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav a[aria-current="page"]{color:var(--blue-300);font-weight:650;background:rgba(75,155,239,.1)}

.header__cta{display:flex;align-items:center;gap:10px;flex:none}
.tel-link{
  font-family:var(--font-display);
  display:inline-flex;align-items:center;gap:8px;
  font-size:.9rem;font-weight:650;color:var(--ink);
  padding:9px 12px;border-radius:var(--r-sm);transition:background .18s ease;
}
.tel-link:hover{background:rgba(255,255,255,.06)}
.tel-link svg{width:17px;height:17px;color:var(--blue-400)}

.burger{
  display:none;width:44px;height:44px;border-radius:var(--r-sm);
  align-items:center;justify-content:center;border:1px solid var(--line);
  background:rgba(255,255,255,.04);
}
.burger span{display:block;width:19px;height:2px;background:var(--ink);border-radius:2px;position:relative;transition:.25s}
.burger span::before,.burger span::after{
  content:"";position:absolute;left:0;width:19px;height:2px;background:var(--ink);border-radius:2px;transition:.25s;
}
.burger span::before{top:-6px}
.burger span::after{top:6px}
.burger.is-open span{background:transparent}
.burger.is-open span::before{top:0;transform:rotate(45deg)}
.burger.is-open span::after{top:0;transform:rotate(-45deg)}

.mobile-nav{
  position:fixed;inset:var(--header-h) 0 0;z-index:99;background:var(--navy-900);
  padding:22px var(--gutter) 40px;overflow-y:auto;
  transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  visibility:hidden;
}
.mobile-nav.is-open{transform:translateX(0);visibility:visible}
.mobile-nav a.m-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:15px 4px;border-bottom:1px solid var(--line-2);
  font-size:1.05rem;font-weight:600;color:var(--ink);
}
.mobile-nav a.m-link svg{width:16px;height:16px;color:var(--muted-2)}
.mobile-nav .m-actions{display:grid;gap:12px;margin-top:26px}

/* ---------- Hero: full-bleed photograph, as used on verticoelevators.com ---------- */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:clamp(580px,74vh,780px);
  display:flex;align-items:center;
  padding-block:clamp(76px,9vw,124px);
  text-align:center;
}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
/* Dark overlay mirroring the 0.65 overlay on verticoelevators.com, weighted at the
   top and bottom so the sticky header and the next section stay clean. */
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.42) 26%,rgba(0,0,0,.52) 58%,var(--bg) 100%),
    linear-gradient(90deg,rgba(0,0,0,.42),rgba(30,79,160,.16));
}
.hero__inner{position:relative;max-width:900px;margin-inline:auto}
.hero h1{color:#fff;margin-bottom:22px;text-shadow:0 2px 26px rgba(0,0,0,.55)}
.hero h1 .accent{
  color:var(--blue-300);
}
.hero .lede{max-width:680px;margin-inline:auto;margin-bottom:34px;color:#FFFFFF;text-shadow:0 1px 14px rgba(0,0,0,.55)}
.hero__actions{display:flex;flex-wrap:wrap;gap:13px;justify-content:center;margin-bottom:38px}

/* Glass fact chips, carrying the facts the old floating cards held */
.hero__badges{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hero__badge{
  font-family:var(--font-display);
  display:inline-flex;align-items:center;gap:10px;
  font-size:.875rem;font-weight:600;color:#FFFFFF;
  background:rgba(8,14,28,.62);border:1px solid rgba(255,255,255,.17);
  padding:11px 18px;border-radius:var(--r-full);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.hero__badge svg{width:19px;height:19px;color:var(--blue-300);flex:none}


/* Page hero (inner pages): banner photograph + overlay */
.phero{
  position:relative;isolation:isolate;color:#fff;background:var(--navy-800);
  padding-block:clamp(44px,4.5vw,70px) clamp(56px,6vw,86px);overflow:hidden;
  border-bottom:1px solid var(--line-2);
}
.phero__bg{position:absolute;inset:0;z-index:-2}
.phero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.phero::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.56) 46%,rgba(0,0,0,.93) 100%),
    linear-gradient(90deg,rgba(0,0,0,.5),rgba(30,79,160,.2));
}
/* pages without a banner keep the original blue glow */
.phero--plain::after{
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 60%);
}
.phero__inner{position:relative;max-width:820px}
.phero h1{color:#fff;margin-bottom:18px;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.phero p{color:#E8E8EA;font-size:clamp(1rem,.95rem + .3vw,1.14rem);line-height:1.72;max-width:660px;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.phero .btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.phero .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:.82rem;margin-bottom:20px;color:var(--muted-2)}
.crumbs a{color:var(--muted-2);transition:color .18s}
.crumbs a:hover{color:#fff}
.crumbs span[aria-current]{color:var(--blue-300);font-weight:600}
.crumbs .sep{opacity:.45}

/* ---------- Cards ---------- */
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease;
  display:flex;flex-direction:column;
}
.card:hover{transform:translateY(-2px);background:var(--surface-2);box-shadow:var(--sh);border-color:rgba(75,155,239,.35)}
.card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--surface-2)}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.6,.3,1)}
.card:hover .card__media img{transform:scale(1.055)}
.card__tag{
  font-family:var(--font-display);
  position:absolute;top:13px;left:13px;z-index:2;
  background:rgba(0,0,0,.78);color:var(--blue-200);
  border:1px solid rgba(75,155,239,.3);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font-size:.71rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:6px 12px;border-radius:var(--r-full);
}
.card__body{padding:24px;display:flex;flex-direction:column;gap:11px;flex:1}
.card__body h3{margin:0}
.card__body p{font-size:.925rem;line-height:1.68;flex:1}
.card__meta{display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;color:var(--muted-2)}
.card__meta svg{width:14px;height:14px;color:var(--blue-400);flex:none}
.card__foot{margin-top:4px;padding-top:15px;border-top:1px solid var(--line-2)}

/* Overlay card: copy sits on the photograph behind a bottom scrim */
.card--overlay{position:relative;min-height:clamp(330px,40vw,420px)}
.card--overlay .card__media{position:absolute;inset:0;aspect-ratio:auto;height:100%;width:100%}
.card--overlay .card__media::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.48) 42%,
    rgba(0,0,0,.86) 74%,
    rgba(0,0,0,.96) 100%);
}
.card--overlay .card__body{
  position:relative;z-index:2;margin-top:auto;padding:20px 20px 22px;gap:9px;
  flex:0 0 auto;                 /* hug the content so it sits on the bottom of the photo */
}
.card--overlay .card__body h3{color:#fff}
.card--overlay .card__body p{color:#E8E8EA;flex:0 1 auto}
.card--overlay .card__meta{color:#ADADB4}
.card--overlay .card__foot{border-top-color:rgba(255,255,255,.16);padding-top:13px}
.card--overlay .link-arrow{color:var(--blue-300)}
.card--overlay:hover .link-arrow{color:#fff}
/* projects cards carry only a caption line, so they need less height */
.card--overlay.card--caption{min-height:clamp(240px,28vw,320px)}
.card--overlay.card--caption .card__body{padding:16px 18px 18px}

/* Feature card (icon) */
.feature{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease;
}
.feature:hover{transform:translateY(-2px);background:var(--surface-2);box-shadow:var(--sh);border-color:rgba(75,155,239,.35)}
.feature__ico{
  width:46px;height:46px;border-radius:var(--r-sm);margin-bottom:20px;
  background:rgba(75,155,239,.08);border:1px solid rgba(75,155,239,.18);color:var(--blue-300);
  display:flex;align-items:center;justify-content:center;
}
.feature__ico svg{width:21px;height:21px}
.feature h3{margin-bottom:10px}
.feature p{font-size:.925rem;line-height:1.68}
.section--navy .feature{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.08)}
.section--navy .feature:hover{background:rgba(255,255,255,.06);border-color:rgba(75,155,239,.34)}

/* ---------- Stats ---------- */
/* Editorial stat row: hairline rules, no boxes. The figure carries the weight,
   the label sits under it small and tracked. */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.stat{
  padding:clamp(32px,4.2vw,58px) clamp(14px,2.2vw,30px);
  text-align:center;
  border-right:1px solid var(--line-2);
}
.stat:last-child{border-right:0}
.stat b{
  font-family:var(--font-display);
  display:block;
  font-size:clamp(2.7rem,1.8rem + 3.6vw,4.6rem);
  font-weight:600;
  letter-spacing:-.04em;line-height:.95;
  margin-bottom:16px;
  color:var(--white);
  font-variant-numeric:tabular-nums;
}
/* the direct child is the label; scoped with > so it never captures the
   counter <span> that lives inside <b> */
.stat > span{
  display:block;
  font-size:.715rem;font-weight:600;
  letter-spacing:.17em;text-transform:uppercase;
  color:var(--muted-2);line-height:1.5;
}
.stat b > span{font:inherit;color:inherit;letter-spacing:inherit}

/* ---------- Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.steps--5{grid-template-columns:repeat(5,1fr)}
.step{position:relative;padding-top:12px}
.step__n{
  font-family:var(--font-display);
  width:54px;height:54px;border-radius:16px;margin-bottom:20px;
  background:var(--surface);border:1.5px solid rgba(75,155,239,.32);color:var(--blue-300);
  display:flex;align-items:center;justify-content:center;
  font-size:1.18rem;font-weight:800;box-shadow:var(--sh-sm);position:relative;z-index:2;
}
.step:not(:last-child)::after{
  content:"";position:absolute;top:39px;left:60px;right:-26px;height:1.5px;
  background:linear-gradient(90deg,rgba(75,155,239,.35),rgba(255,255,255,.05));z-index:1;
}
.step h3{margin-bottom:9px}
.step p{font-size:.92rem;line-height:1.68}

/* ---------- Split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4.5vw,68px);align-items:center}
.split--rev .split__media{order:2}
.split__media img{
  width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r-xl);
  box-shadow:var(--sh-lg);border:1px solid rgba(255,255,255,.09);
}
.split__media.is-wide img{aspect-ratio:5/4}

.ticks{display:grid;gap:14px;margin-top:26px}
.ticks li{display:flex;gap:13px;align-items:flex-start;list-style:none;font-size:.95rem;line-height:1.6;color:var(--ink-2)}
.ticks li svg{width:22px;height:22px;flex:none;margin-top:1px;color:var(--blue-400)}

/* ---------- Gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.gallery figure{margin:0;border-radius:var(--r-lg);overflow:hidden;background:var(--surface);border:1px solid var(--line);transition:border-color .24s ease,transform .24s ease}
.gallery figure:hover{border-color:rgba(75,155,239,.4);transform:translateY(-3px)}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .5s cubic-bezier(.2,.6,.3,1)}
.gallery figure:hover img{transform:scale(1.06)}

/* =========================================================
   Horizontal scroller with centre-focus zoom
   Used for the "Recent work" project strip.
   ========================================================= */
.hscroll{position:relative;--hs-fade:var(--bg-soft);--hs-item:clamp(300px,44vw,620px)}
.section--navy .hscroll{--hs-fade:#111F4A}

.hscroll__track{
  display:flex;gap:0;list-style:none;margin:0;padding:0;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;
  overscroll-behavior-x:contain;
}
.hscroll__track::-webkit-scrollbar{display:none}
.hscroll__track:focus-visible{outline:3px solid var(--blue-400);outline-offset:-3px}

/* Frames butt straight up against each other. No scale transform, because
   scaling shrinks each card toward its own centre and that reads as a gap. */
.hscroll__item{
  flex:0 0 var(--hs-item);scroll-snap-align:center;margin:0;position:relative;
  opacity:.38;
  transition:opacity .55s ease;
}
.hscroll__item.is-center{opacity:1;z-index:2}

.hscroll__frame{
  position:relative;overflow:hidden;
  border:0;border-radius:0;background:var(--surface);box-shadow:none;
  margin:0;
}
.hscroll__frame img{
  width:100%;aspect-ratio:3/4;object-fit:cover;display:block;
}

.hscroll__cap{
  position:absolute;left:0;right:0;bottom:0;padding:44px 22px 20px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.9));
  font-family:var(--font-display);font-size:.9rem;font-weight:600;color:#FFFFFF;
  display:flex;align-items:center;gap:8px;
  opacity:0;transition:opacity .45s ease;
}
.hscroll__item.is-center .hscroll__cap{opacity:1}
.hscroll__cap svg{width:14px;height:14px;color:var(--blue-400);flex:none}

/* arrows sit over the strip */
.hscroll__nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;
  width:48px;height:48px;border-radius:50%;
  background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.22);color:#fff;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:background .2s ease,border-color .2s ease,opacity .2s ease;
}
.hscroll__nav:hover:not(:disabled){background:var(--sky);border-color:var(--sky);color:var(--black)}
.hscroll__nav:disabled{opacity:.25;cursor:default}
.hscroll__nav svg{width:20px;height:20px}
.hscroll__nav--prev{left:14px}
.hscroll__nav--next{right:14px}

.hscroll__hint{text-align:center;font-size:.8rem;color:var(--muted-2);margin-top:22px}

@media (max-width:860px){
  .hscroll{--hs-item:clamp(260px,78vw,420px)}
  .hscroll__nav{display:none}
}
@media (prefers-reduced-motion:reduce){
  .hscroll__track{scroll-behavior:auto}
  .hscroll__item{transform:none;opacity:1;filter:none}
  .hscroll__item.is-center{transform:none}
  .hscroll__item.is-center .hscroll__frame img{transform:none}
  .hscroll__cap{opacity:1;transform:none}
}

/* ---------- Spec table ---------- */
.spec-wrap{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--surface)}
.spec-scroll{overflow-x:auto}
.spec{min-width:520px;font-size:.93rem}
.spec th,.spec td{padding:15px 22px;text-align:left;border-bottom:1px solid var(--line-2)}
.spec thead th{font-family:var(--font-display);background:rgba(255,255,255,.04);font-weight:700;color:var(--ink);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.spec tbody th{font-weight:650;color:var(--ink);width:42%}
.spec td{color:var(--muted)}
.spec tbody tr:last-child th,.spec tbody tr:last-child td{border-bottom:0}
.spec tbody tr:hover{background:rgba(75,155,239,.07)}
.spec a{color:var(--blue-400)}

/* ---------- FAQ ---------- */
.faq{max-width:840px;margin-inline:auto;display:grid;gap:12px}
.faq details{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  transition:border-color .2s ease,background .2s ease;
}
.faq details:hover{border-color:rgba(75,155,239,.28)}
.faq details[open]{border-color:rgba(75,155,239,.4);background:var(--surface-2)}
.faq summary{
  font-family:var(--font-display);
  display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  padding:19px 22px;cursor:pointer;list-style:none;
  font-weight:650;font-size:1rem;color:var(--ink);line-height:1.5;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";flex:none;width:20px;height:20px;margin-top:3px;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234B9BEF' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  transition:transform .25s ease;
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .faq__a{padding:0 22px 21px;font-size:.945rem;line-height:1.72;color:var(--muted)}
.faq .faq__a p + p{margin-top:12px}
.faq .faq__a a{color:var(--blue-400);font-weight:600}

/* ---------- CTA band ---------- */
.cta-band{
  position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(135deg,var(--black) 0%,var(--navy) 60%,#1D2E6B 100%);
  border-block:1px solid var(--line-2);
}
.cta-band::before{
  content:"";position:absolute;top:-200px;right:-140px;width:660px;height:660px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.05),transparent 68%);pointer-events:none;
}
.cta-band__inner{position:relative;text-align:center;max-width:730px;margin-inline:auto;padding-block:clamp(58px,6vw,90px)}
.cta-band h2{color:#fff;margin-bottom:18px}
.cta-band p{color:var(--ink-2);font-size:1.06rem;line-height:1.72;margin-bottom:32px}
.cta-band .btn-row{display:flex;flex-wrap:wrap;gap:13px;justify-content:center}

/* ---------- Pricing calculator ---------- */
.calc{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,34px);align-items:start}
.calc__form{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,2.6vw,30px)}
.calc__form .field:last-child{margin-bottom:0}
.calc__radios{border:0;padding:0;margin-bottom:0}
.calc__radios legend{font-size:.845rem;font-weight:650;color:var(--ink-2);margin-bottom:10px;padding:0}
.calc__radio{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  padding:11px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  margin-bottom:8px;font-size:.93rem;transition:border-color .18s ease,background .18s ease;
}
.calc__radio:hover{border-color:var(--blue-400)}
.calc__radio input{accent-color:var(--blue-500);width:17px;height:17px;flex:none;margin:0}
.calc__radio:has(input:checked){border-color:var(--blue-500);background:rgba(46,123,214,.09)}

.calc__result{
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.6vw,30px);position:sticky;top:calc(var(--header-h) + 16px);
}
.calc__label{font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted-2);margin-bottom:8px}
.calc__amount{
  font-family:var(--font-display);font-size:clamp(1.35rem,1.05rem + 1.1vw,1.85rem);
  font-weight:800;color:var(--ink);line-height:1.25;letter-spacing:-.02em;margin-bottom:18px;
}
.calc__lines{list-style:none;display:grid;gap:9px;margin-bottom:18px;padding-top:16px;border-top:1px solid var(--line)}
.calc__lines li{display:flex;justify-content:space-between;gap:14px;font-size:.885rem;color:var(--muted)}
.calc__lines li span:last-child{color:var(--ink-2);font-weight:600;white-space:nowrap}
.calc__note{font-size:.8rem;line-height:1.62;color:var(--muted-2);margin-bottom:18px}
.calc__flag{
  display:block;margin-top:14px;padding:11px 14px;border-radius:var(--r-sm);
  background:rgba(255,190,60,.1);border:1px solid rgba(255,190,60,.32);
  color:#F0C97A;font-size:.8rem;line-height:1.6;
}
@media (max-width:860px){
  .calc{grid-template-columns:1fr}
  .calc__result{position:static}
}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,4vw,56px);align-items:start}
.form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(24px,3vw,38px);box-shadow:var(--sh)}
.field{margin-bottom:18px}
.field label{font-family:var(--font-display);display:block;font-size:.845rem;font-weight:650;color:var(--ink);margin-bottom:8px}
.field .req{color:#F87171}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  background:rgba(0,0,0,.28);color:var(--ink);font-size:.95rem;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field textarea{min-height:118px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--blue-400);background:rgba(0,0,0,.4);
  box-shadow:0 0 0 4px rgba(75,155,239,.16);
}
.field select{
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background:rgba(0,0,0,.28) no-repeat right 14px center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A4C1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  padding-right:40px;
}
.field select option{background:var(--surface);color:var(--ink)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-note{font-size:.8rem;color:var(--muted-2);margin-top:14px;text-align:center;line-height:1.6}
.form-note a{color:var(--blue-400)}

.info-list{display:grid;gap:14px}
.info-item{
  display:flex;gap:16px;align-items:flex-start;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:21px 22px;
  transition:border-color .2s ease,background .2s ease;
}
.info-item:hover{border-color:rgba(75,155,239,.32);background:var(--surface-2)}
.info-item__ico{
  width:44px;height:44px;border-radius:12px;flex:none;
  background:rgba(75,155,239,.14);color:var(--blue-300);
  display:flex;align-items:center;justify-content:center;
}
.info-item__ico svg{width:20px;height:20px}
.info-item h4{margin-bottom:5px}
.info-item p,.info-item a{font-size:.925rem;line-height:1.62;color:var(--muted);display:block}
.info-item a:hover{color:var(--blue-300)}

.map-embed{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);line-height:0;background:var(--surface)}
.map-embed iframe{
  width:100%;height:340px;border:0;display:block;
  filter:invert(92%) hue-rotate(180deg) saturate(.75) contrast(.92) brightness(.95);
}

/* ---------- Footer ---------- */
.footer{background:var(--navy-950);color:var(--muted);padding-top:70px;border-top:1px solid var(--line-2)}
.footer__top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.25fr;gap:44px;padding-bottom:52px}
.footer__brand img{height:52px;margin-bottom:20px}
.footer__brand p{color:var(--muted);font-size:.925rem;line-height:1.72;max-width:330px;margin-bottom:22px}
.socials{display:flex;gap:10px}
.socials a{
  width:38px;height:38px;border-radius:11px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink-2);
  transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease;
}
.socials a:hover{background:var(--blue-500);color:#fff;border-color:var(--blue-500);transform:translateY(-2px)}
.socials svg{width:17px;height:17px}
.footer h4{font-family:var(--font-display);color:#fff;font-size:.79rem;font-weight:750;letter-spacing:.11em;text-transform:uppercase;margin-bottom:19px}
.footer ul{list-style:none;display:grid;gap:11px}
.footer ul a{font-size:.915rem;color:var(--muted);transition:color .18s ease,padding-left .18s ease}
.footer ul a:hover{color:#fff;padding-left:4px}
.footer__contact li{display:flex;gap:12px;align-items:flex-start;font-size:.915rem;line-height:1.6;color:var(--muted)}
.footer__contact svg{width:16px;height:16px;flex:none;margin-top:4px;color:var(--blue-400)}
.footer__contact a{color:var(--ink-2)}
.footer__contact a:hover{color:#fff}
.footer__bottom{
  border-top:1px solid var(--line-2);padding-block:24px;
  display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:space-between;
  font-size:.855rem;color:var(--muted-2);
}
.footer__bottom nav{display:flex;flex-wrap:wrap;gap:22px}
.footer__bottom a:hover{color:#fff}

/* ---------- Floating WhatsApp ---------- */
.wa-float{
  position:fixed;right:20px;bottom:20px;z-index:90;
  width:56px;height:56px;border-radius:50%;background:#25D366;color:#04140A;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,.45);
  transition:transform .22s ease,box-shadow .22s ease;
}
.wa-float:hover{transform:scale(1.05)}
.wa-float svg{width:29px;height:29px;position:relative;z-index:2}

/* ---------- Reveal ---------- */
/* Only hide for animation when JS is confirmed present, so a script
   failure can never leave the page blank. */
.js .reveal{
  opacity:0;
  transform:perspective(1200px) translate3d(0,34px,-150px);
  transition:opacity 1.5s cubic-bezier(.25,.46,.45,.94),transform 1.7s cubic-bezier(.25,.46,.45,.94);
}
.js .reveal.is-in{opacity:1;transform:none}

/* Hero copy arrives from depth on load, staggered line by line, and the
   backdrop settles forward behind it. */
@keyframes rise-in{
  from{opacity:0;transform:perspective(1200px) translate3d(0,44px,-190px)}
  to{opacity:1;transform:none}
}
@keyframes bg-settle{
  from{transform:scale(1.085)}
  to{transform:none}
}
/* Hold the hero reveal until the preloader has lifted, otherwise it plays out
   behind the closed doors and the visitor never sees it. is-loaded is set when
   the doors open; no-preloader is set on later pages that skip it entirely. */
.js.is-loaded .hero__inner > *,
.js.is-loaded .phero__inner > *,
.js.no-preloader .hero__inner > *,
.js.no-preloader .phero__inner > *{animation:rise-in 1.7s cubic-bezier(.25,.46,.45,.94) both}
.js .hero__inner > *:nth-child(1),.js .phero__inner > *:nth-child(1){animation-delay:.18s}
.js .hero__inner > *:nth-child(2),.js .phero__inner > *:nth-child(2){animation-delay:.44s}
.js .hero__inner > *:nth-child(3),.js .phero__inner > *:nth-child(3){animation-delay:.70s}
.js .hero__inner > *:nth-child(4),.js .phero__inner > *:nth-child(4){animation-delay:.96s}
.js.is-loaded .hero__bg img,.js.is-loaded .phero__bg img,
.js.no-preloader .hero__bg img,.js.no-preloader .phero__bg img{animation:bg-settle 3s cubic-bezier(.25,.46,.45,.94) both}

/* ---------- Misc ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.pill{
  font-family:var(--font-display);
  font-size:.815rem;font-weight:600;padding:7px 14px;border-radius:var(--r-full);
  background:rgba(75,155,239,.1);color:var(--blue-300);border:1px solid rgba(75,155,239,.22);
}

.trust-strip{border-bottom:1px solid var(--line-2);background:var(--bg-soft);padding-block:26px}
.trust-strip ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:16px 44px}
.trust-strip li{font-family:var(--font-display);display:flex;align-items:center;gap:10px;font-size:.885rem;font-weight:600;color:var(--ink-2)}
.trust-strip svg{width:19px;height:19px;color:var(--blue-400);flex:none}

.prose{max-width:820px}
.prose h2{margin-top:44px;margin-bottom:16px}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:30px;margin-bottom:11px}
.prose p{margin-bottom:15px;line-height:1.78}
.prose ul,.prose ol{margin:0 0 18px 20px;display:grid;gap:9px}
.prose li{line-height:1.72;color:var(--muted)}
.prose a{color:var(--blue-400);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose em{color:var(--muted-2)}

.err-page{text-align:center;max-width:560px;margin-inline:auto;padding-block:clamp(70px,10vw,140px)}
.err-page .code{
  font-family:var(--font-display);
  font-size:clamp(4.5rem,3rem + 9vw,8rem);font-weight:800;line-height:1;letter-spacing:-.04em;margin-bottom:14px;
  color:var(--blue-400);
}

/* ---------- Install app ----------
   Buttons stay hidden until the browser actually offers an install, so the
   site never shows an action that would do nothing. */
.install-btn{display:none}
html.can-install .install-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px}
.footer__install{margin-top:18px;width:100%;max-width:230px}
.install-btn svg{width:18px;height:18px;flex:0 0 auto}

.ios-sheet{position:fixed;inset:0;z-index:9998;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.72);padding:16px}
.ios-sheet[hidden]{display:none}
.ios-sheet__box{width:100%;max-width:430px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 22px 20px}
.ios-sheet__box h3{font-size:1.16rem;margin-bottom:14px;color:var(--ink)}
.ios-sheet__box ol{margin:0 0 20px;padding-left:20px;display:grid;gap:10px}
.ios-sheet__box li{font-size:.95rem;line-height:1.6;color:var(--ink-2)}
.ios-sheet__box strong{color:var(--blue-300);font-weight:600}

/* ---------- Preloader ----------
   A cabin rises up the shaft from below, levels off at the floor, then its
   doors part to show the mark before the landing doors open onto the page.
   Hidden entirely without JS so a script failure can never trap anyone,
   and shown once per session so internal navigation is not interrupted. */
.preloader{display:none}
.js .preloader{display:block;position:fixed;inset:0;z-index:9999}
.js.no-preloader .preloader{display:none}
html.is-loading,html.is-loading body{overflow:hidden}

/* landing doors, the final reveal onto the page */
.preloader__door{
  position:absolute;top:0;bottom:0;width:50.2%;z-index:3;background:var(--bg);
  transition:transform .7s cubic-bezier(.65,0,.35,1) .1s;
}
.preloader__door--l{left:0;border-right:1px solid rgba(75,155,239,.22)}
.preloader__door--r{right:0;border-left:1px solid rgba(75,155,239,.22)}

.preloader__core{
  position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:20px;
  transition:opacity .4s ease,transform .4s ease;
}

/* floor indicator, digits step past a fixed window as the car climbs */
.preloader__readout{display:flex;align-items:center;gap:11px;flex:0 0 auto}
.preloader__up{
  width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;
  border-bottom:7px solid var(--blue-400);animation:pl-arrow .6s ease-in-out infinite;
}
@keyframes pl-arrow{0%,100%{opacity:.3;transform:translateY(2px)}50%{opacity:1;transform:translateY(-2px)}}
.preloader__window{
  display:block;height:1.3em;overflow:hidden;font-family:var(--font-display);
  font-size:1.02rem;font-weight:600;letter-spacing:.14em;color:var(--blue-300);
}
.preloader__digits{display:block;animation:pl-digits .78s steps(1) both}
.preloader__digits b{display:block;height:1.3em;line-height:1.3em;font-weight:600}
@keyframes pl-digits{
  0%,17%{transform:translateY(0)}
  22%,44%{transform:translateY(-25%)}
  50%,71%{transform:translateY(-50%)}
  77%,100%{transform:translateY(-75%)}
}

/* the shaft opening. overflow clips the car so it emerges from below */
.preloader__shaft{
  position:relative;overflow:hidden;flex:0 0 auto;
  width:clamp(148px,21vw,186px);height:clamp(186px,27vw,232px);
}
.preloader__rail{
  position:absolute;top:0;bottom:0;width:1px;z-index:3;
  background:linear-gradient(180deg,transparent,rgba(75,155,239,.55) 10%,rgba(75,155,239,.55) 90%,transparent);
}
.preloader__rail--l{left:0}
.preloader__rail--r{right:0}

.preloader__car{
  position:absolute;left:0;right:0;top:0;height:100%;overflow:hidden;
  background:#0D0D11;border:1px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;
  animation:pl-rise .78s cubic-bezier(.5,0,.2,1) both;
}
/* accelerate away, cruise, then ease hard into the landing */
@keyframes pl-rise{from{transform:translateY(108%)}to{transform:translateY(0)}}

.preloader__logo{width:64%;height:auto;position:relative;z-index:1;animation:pl-logo .3s ease .9s both}
@keyframes pl-logo{from{opacity:0}to{opacity:1}}

/* car doors, held shut until the car has levelled */
.preloader__cardoor{position:absolute;top:0;bottom:0;width:50%;z-index:2;background:linear-gradient(180deg,#26262E,#1B1B22)}
.preloader__cardoor--l{left:0;border-right:1px solid rgba(75,155,239,.45);animation:pl-cd-l .36s cubic-bezier(.65,0,.35,1) .81s both}
.preloader__cardoor--r{right:0;animation:pl-cd-r .36s cubic-bezier(.65,0,.35,1) .81s both}
@keyframes pl-cd-l{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@keyframes pl-cd-r{from{transform:translateX(0)}to{transform:translateX(100%)}}

/* floor line the car settles onto */
.preloader__sill{
  display:block;width:clamp(178px,26vw,224px);height:1px;
  background:linear-gradient(90deg,transparent,rgba(75,155,239,.6),transparent);
}

html.is-loaded .preloader__core{opacity:0;transform:translateY(-8px)}
html.is-loaded .preloader__door--l{transform:translateX(-100%)}
html.is-loaded .preloader__door--r{transform:translateX(100%)}

@media (prefers-reduced-motion:reduce){
  .js .preloader{display:none}
  html.is-loading,html.is-loading body{overflow:auto}
}
@media print{.preloader{display:none!important}}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  :root{--section:78px}
  .nav{display:none}
  .burger{display:flex}
  .header__cta .tel-link,.header__cta .btn{display:none}
  .footer__top{grid-template-columns:1fr 1fr;gap:38px}
  .footer__brand{grid-column:1/-1}
  .steps{grid-template-columns:repeat(2,1fr);gap:32px}
  .step:nth-child(2)::after{display:none}
  .steps--5{grid-template-columns:repeat(3,1fr);gap:28px}
  .steps--5 .step::after{display:none}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .g-4{grid-template-columns:repeat(2,1fr)}
  .g-3{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line-2)}
  .split{grid-template-columns:1fr;gap:36px}
  .split--rev .split__media{order:0}
  .split__media{max-width:460px;margin-inline:auto;width:100%}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .steps--5{grid-template-columns:repeat(2,1fr)}
  .hero{min-height:520px;padding-block:clamp(64px,11vw,96px)}
}
@media (max-width:600px){
  :root{--section:60px;--gutter:18px}
  .g-2,.g-3,.g-4{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .stat{border-right:0;border-bottom:1px solid var(--line-2)}
  .stat:last-child{border-bottom:0}
  .steps{grid-template-columns:1fr;gap:26px}
  .steps--5{grid-template-columns:1fr;gap:26px}
  .step::after{display:none!important}
  .sec-head{margin-bottom:36px}
  .hero{min-height:auto;padding-block:60px 66px}
  .hero__badge{font-size:.8rem;padding:9px 14px}
  .hero__actions .btn,.phero .btn-row .btn,.cta-band .btn-row .btn{width:100%}
  .field-row{grid-template-columns:1fr;gap:0}
  /* Stack the collage on phones: wide lead image, pair beneath.
     Keeps the block tall enough that the floating cards do not swamp it. */
  .footer__top{grid-template-columns:1fr;gap:34px}
  .footer__bottom{flex-direction:column;align-items:flex-start}
  .gallery{grid-template-columns:1fr 1fr;gap:12px}
  .wa-float{width:52px;height:52px;right:16px;bottom:16px}
  .trust-strip ul{gap:14px 26px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none}
  .js .hero__inner > *,.js .phero__inner > *{opacity:1;animation:none}
  .js .hero__bg img,.js .phero__bg img{animation:none;transform:none}
  }

@media print{
  .header,.mobile-nav,.wa-float,.cta-band,.footer__bottom nav,.hero__bg{display:none}
  body{color:#000;background:#fff}
  .js .reveal{opacity:1;transform:none}
  .js .hero__inner > *,.js .phero__inner > *{opacity:1;animation:none}
  .js .hero__bg img,.js .phero__bg img{animation:none;transform:none}
}