/* Official home only; the flow experiment keeps its existing presentation. */
/* This unused, transparent decoration extended 60px beyond the support gallery.
   Remove its layout overflow without clipping the sticky partners' ancestors. */
:root:root .support-proof__gallery::before { content:none; }

@media (max-width:760px) {
  :root:root .guarantee__seal { width:100%; max-width:340px; }
}

@media (max-width:700px) {
  :root:root .features--journey :is(.journey-card--sales,.journey-card--closing) {
    background:#fff;
  }
}

/* The replacement artwork is wider; keep the fox centered on narrow screens. */
@media (max-width:760px) {
  :root:root .hero-loop > .hero-loop__image { object-position:50% center; }
}
.skip-link { position:fixed; top:12px; left:12px; z-index:9999; padding:12px 18px; background:#fff; color:#20283b; border:2px solid #6366f1; border-radius:8px; transform:translateY(-200%); }
.skip-link:focus { transform:translateY(0); }
/* Above-the-fold copy should paint immediately instead of waiting for a blur reveal. */
:root:root .hero-next :is(h1,.hero-next__eyebrow,.hero-next__description,.hero-next__actions,.hero-next__assurance) { animation:none; }

/* One desktop composition, anchored to the copy instead of the browser edge.
   The replacement artwork restores the original film framing at 3344 × 1882. */
:root:root .hero-loop {
  aspect-ratio:3344 / 1882;
  height:auto;
  transition:none;
}
:root:root .hero-loop > .hero-loop__image {
  inset:0;
  width:100%;
  max-width:none;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
}
@media (min-width:1024px) {
  :root:root .site-header {
    position:absolute;
    inset:0 0 auto;
    background:transparent;
  }
  :root:root .hero-next--video {
    padding-top:104px;
    background:radial-gradient(ellipse at 90% 5%,#e5edf5 0,transparent 58%),linear-gradient(180deg,#fbfcfe,#f3f7fc);
  }
  :root:root .hero-next--video .hero-next__layout {
    grid-template-columns:480px minmax(0,1fr);
    min-height:clamp(680px,calc(100svh - 104px),820px);
  }
  :root:root .hero-next--video .hero-next__copy {
    width:480px;
    max-width:100%;
    padding:42px 0 72px;
  }
  :root:root .hero-next--video h1 { font-size:54px; }
  :root:root .hero-next--video .hero-next__description { max-width:480px; font-size:16px; }
  :root:root .hero-loop {
    position:absolute;
    left:240px;
    right:auto;
    top:auto;
    bottom:-70px;
    width:clamp(1550px,calc(1190px + 40svh),1620px);
    max-width:none;
    margin:0;
    transform:none;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 24%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 77%,transparent 94%);
    mask-image:linear-gradient(90deg,transparent,#000 24%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 77%,transparent 94%);
    -webkit-mask-composite:source-in;
    mask-composite:intersect;
  }
}
@media (max-width:1023.98px) {
  :root:root .hero-next--video .hero-next__layout { grid-template-columns:minmax(0,1fr); min-height:0; }
  :root:root .hero-next--video .hero-next__copy { width:100%; padding:32px 0 0; }
  :root:root .hero-next--video .hero-next__description { max-width:650px; }
  :root:root .hero-loop {
    position:relative;
    inset:auto;
    justify-self:center;
    width:100vw;
    max-width:none;
    margin:24px 0 0;
    transform:none;
    aspect-ratio:1.9;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(180deg,transparent,#000 24%);
    mask-image:linear-gradient(180deg,transparent,#000 24%);
    -webkit-mask-composite:source-over;
    mask-composite:add;
  }
}
@media (max-width:760px) {
  :root:root .hero-loop { aspect-ratio:1.4; margin-top:16px; }
}

/* Compact desktop keeps a fixed canvas too; only the outer platforms crop. */
@media (min-width:1024px) and (max-width:1279.98px) {
  :root:root .hero-next--video .hero-next__layout { grid-template-columns:440px minmax(0,1fr); }
  :root:root .hero-next--video .hero-next__copy { width:440px; }
  :root:root .hero-next--video h1 { font-size:48px; }
  :root:root .hero-loop {
    width:1270px; left:110px; bottom:-40px;
    -webkit-mask-image:linear-gradient(90deg,transparent 24%,#000 38%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 77%,transparent 94%);
    mask-image:linear-gradient(90deg,transparent 24%,#000 38%,#000 88%,transparent),linear-gradient(180deg,transparent,#000 25%,#000 77%,transparent 94%);
  }
}

/* Use the filled WhatsApp mark and proportions from the Contasy contact button. */
:root:root .lead-launcher { padding:0; background:#25d366; }
:root:root .lead-launcher svg { width:32px; height:32px; fill:#fff; stroke:none; }
:root:root .lead-launcher svg path { fill:inherit; stroke:none; }
@media (max-width:480px) {
  :root:root .lead-launcher svg { width:28px; height:28px; }
}

/* System access stays prominent in both desktop navigation and the mobile menu. */
:root:root .has-hero-next .navbar .navbar__login {
  width:auto;
  min-width:84px;
  gap:16px;
  padding:5px 6px 5px 16px;
  background:var(--lt-accent, #555ae8);
  border:1px solid var(--lt-accent, #555ae8);
  color:#fff;
  box-shadow:inset 0 1px 0 #ffffff26, 0 4px 10px #555ae819;
}
:root:root .navbar__login-icon {
  display:grid;
  place-items:center;
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:4px;
  background:#ffffff1a;
}
:root:root .navbar__login-icon svg { width:18px; height:18px; }
:root:root .has-hero-next .navbar .navbar__login:hover {
  background:var(--lt-accent-hover, #464bd0);
  border-color:var(--lt-accent-hover, #464bd0);
}
:root:root .has-hero-next .navbar .navbar__login:focus-visible {
  outline:2px solid var(--lt-accent, #555ae8);
  outline-offset:4px;
}
:root:root .has-hero-next .navbar .navigation__login { display:none; }
@media (min-width:601px) and (max-width:1279.98px) {
  :root:root .has-hero-next .navbar__actions .button--outline { display:none; }
}
@media (min-width:601px) and (max-width:700px) {
  :root:root .has-hero-next .navbar__actions .button--primary:not(.navbar__login) { display:none; }
}
@media (max-width:600px) {
  :root:root .has-hero-next .navbar .navigation__login {
    display:flex;
    flex-shrink:0;
    width:100%;
    min-height:48px;
    margin-top:20px;
    font-size:16px;
    justify-content:space-between;
  }
  :root:root .navigation__login .navbar__login-icon { width:36px; height:36px; flex-basis:36px; }
}