/* Start custom CSS *//* Skinmedical About (page 49): premium-minimal chapters + brand colour layer + thread + layered steps + flow handoff. m8 */
.elementor section.sx-chap { position: relative; padding: 0; width: 100%; min-width: 0; }
.elementor div.sx-ch-split { position: relative; padding: 18vh 8vw 14vh; min-width: 0; max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr .9fr; gap: 6vw; align-items: center; }
.elementor div.sx-ch-copy { position: relative; z-index: 1; padding: 0; min-width: 0; }
.elementor .sx-ch-copy > * + * { margin-top: 18px; }
.elementor div.sx-ch-media { position: relative; z-index: 1; overflow: hidden; padding: 0; min-width: 0; aspect-ratio: 4 / 5; border-radius: 28px; border: 1px solid rgba(154,206,235,.6); background-color: #D9EAF3; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; box-shadow: 0 40px 80px -50px rgba(0,49,83,.5); }
.elementor div.sx-ch-head { padding: 0; min-width: 0; max-width: 720px; margin: 0 auto; text-align: center; }
.elementor .sx-ch-head > * + * { margin-top: 16px; }

/* type */
.elementor p.sx-ab-eb { display: block; font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: #2a6f98; }
.elementor p.sx-ab-eb::before { content: ""; display: inline-block; width: 28px; height: 1px; margin-inline-end: 12px; vertical-align: middle; background: #9ACEEB; }
.elementor h1.sx-ab-h, .elementor h2.sx-ab-h { display: block; margin: 0; font-family: "Frank Ruhl Libre", serif; font-weight: 300; letter-spacing: -.01em; color: #003153; }
.elementor h1.sx-ab-h { font-size: clamp(2.8rem, 6vw, 5.8rem); line-height: 1.02; }
.elementor h1.sx-ab-h span { display: block; }
.elementor h1.sx-ab-h span:nth-child(2) { color: rgba(0,49,83,.36); }
.elementor h2.sx-ab-h { font-size: clamp(2rem, 3.6vw, 3.3rem); line-height: 1.1; }
.elementor p.sx-ab-t { display: block; font-size: clamp(1rem, 1.12vw, 1.1rem); line-height: 1.8; font-weight: 300; color: #3a5f78; max-width: 560px; }
.elementor p.sx-ab-note { display: block; font-size: .84rem; line-height: 1.6; color: #5b7a90; }
.elementor p.sx-ab-names { display: block; font-size: .8rem; letter-spacing: .06em; direction: ltr; text-align: right; color: #2a6f98; font-weight: 500; }
.elementor .sx-ch-head p.sx-ab-t { margin-left: auto; margin-right: auto; }

/* the thread: one line drawn through the routine (static = fully drawn) */
.elementor section.sx-chap::before { content: ""; position: absolute; z-index: 2; top: 0; bottom: 0; right: 3.4vw; width: 1px; background: #9ACEEB; transform-origin: top; pointer-events: none; }
.elementor section.sx-ch1::before { top: 20vh; }
.elementor section.sx-ch2::before, .elementor section.sx-ch4::before { background: rgba(0,49,83,.24); }
.elementor section.sx-ch3::before { display: none; }
.elementor section.sx-ch6::before { bottom: 42%; }
.elementor section.sx-ch6::after { content: ""; position: absolute; z-index: 2; right: calc(3.4vw - 4px); top: 58%; width: 9px; height: 9px; border-radius: 50%; background: #9ACEEB; outline: 5px solid rgba(154,206,235,.25); }

/* ch1 hero (pure + refraction glow) */
.elementor section.sx-ch1 { background: radial-gradient(52vw 52vw at 20% 46%, rgba(154,206,235,.38), rgba(154,206,235,0) 70%), #FDFDFD; }
.elementor .sx-ch1 div.sx-ch-split { min-height: 100vh; padding-top: 16vh; }
.elementor .sx-ch1 div.sx-ch-media { background-image: url(https://www.skinmedical.co.il/wp-content/uploads/2026/10/sm-hero-plinth.webp); }

/* ch2 founder (ice deepening to refraction) */
.elementor section.sx-ch2 { background: radial-gradient(60vw 40vw at 85% 100%, rgba(154,206,235,.55), rgba(154,206,235,0) 70%), #D9EAF3; }
.elementor .sx-ch2 div.sx-ch-media { background-image: url(https://www.skinmedical.co.il/wp-content/uploads/2026/10/sm-tex-serum.webp); }
.elementor div.sx-ch-books { padding: 0; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 34px; }
.elementor div.sx-ch-book { position: relative; padding: 22px 0 0; min-width: 0; }
.elementor div.sx-ch-book::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 2px; border-radius: 2px; background: #9ACEEB; transform-origin: right; }
.elementor p.sx-ch-num { display: block; font-family: "Frank Ruhl Libre", serif; font-size: clamp(2.4rem, 3.6vw, 3.4rem); line-height: 1; font-weight: 300; color: #003153; font-variant-numeric: tabular-nums; }
.elementor .sx-ch-book p.sx-ab-note { margin-top: 10px; direction: ltr; text-align: right; }

/* ch3 timeline (pure, refraction accents, rail) */
.elementor section.sx-ch3 { background: #FDFDFD; }
.elementor .sx-ch3 div.sx-ch-stage { position: relative; padding: 16vh 0 14vh; min-width: 0; display: flex; flex-direction: column; gap: 6vh; }
.elementor .sx-ch3 div.sx-ch-stage::after { content: ""; display: block; height: 2px; margin: 0 8vw; border-radius: 2px; background-color: #D9EAF3; background-image: linear-gradient(#9ACEEB, #9ACEEB); background-repeat: no-repeat; background-position: right center; background-size: 100% 100%; }
.elementor .sx-ch3 div.sx-ch-copy { padding: 0 8vw; max-width: 760px; }
.elementor div.sx-ch-track { --cw: clamp(260px, 25vw, 360px); --g: 22px; padding: 0 8vw; min-width: 0; display: flex; flex-wrap: wrap; gap: var(--g); }
.elementor div.sx-ch-card { padding: 30px 30px 32px; min-width: 0; min-height: 300px; width: var(--cw); flex: 0 0 var(--cw); display: flex; flex-direction: column; justify-content: space-between; background: linear-gradient(180deg, #F4F9FC, #FDFDFD); border: 1px solid rgba(0,49,83,.07); border-top: 3px solid #9ACEEB; border-radius: 24px; }
.elementor .sx-ch-card p.sx-ab-yr { display: block; font-family: "Frank Ruhl Libre", serif; font-size: clamp(2.6rem, 3.8vw, 3.6rem); line-height: 1; font-weight: 300; color: #003153; font-variant-numeric: tabular-nums; }
.elementor .sx-ch-card p.sx-ab-mt { display: block; margin-top: 18px; font-size: .98rem; line-height: 1.65; font-weight: 300; color: #3a5f78; }

/* ch4 method (ice + refraction panels) */
.elementor section.sx-ch4 { background: radial-gradient(50vw 40vw at 10% 0%, rgba(154,206,235,.45), rgba(154,206,235,0) 70%), #D9EAF3; }
.elementor .sx-ch4 div.sx-ch-stage { padding: 16vh 8vw 12vh; min-width: 0; max-width: 1440px; margin: 0 auto; display: flex; flex-direction: column; gap: 12vh; }
/* each step is a layer card (layering = how the routine is applied) */
.elementor div.sx-ch-step { position: relative; padding: 3vw 3.4vw; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4vw; align-items: center; border-radius: 36px; background: linear-gradient(160deg, #FDFDFD 0%, #F4F9FC 60%, #EAF4FA 100%); border: 1px solid rgba(154,206,235,.55); box-shadow: 0 40px 80px -60px rgba(0,49,83,.45); }
.elementor div.sx-ch-step::before { content: ""; position: absolute; top: -1px; right: 40px; left: 40px; width: auto; height: 3px; opacity: 1; mix-blend-mode: normal; border-radius: 0 0 3px 3px; background: #9ACEEB; transform-origin: right; }
.elementor div.sx-ch-panel { padding: 7% 8%; min-width: 0; border-radius: 26px; background: linear-gradient(160deg, #EEF6FA 0%, rgba(154,206,235,.42) 100%); overflow: hidden; }
.elementor .sx-ch-panel .sx-ab-prod { display: block; width: 100%; }
.elementor .sx-ab-prod img { display: block; width: 100%; height: auto; }
/* flow bottle (ch1 -> ch2): hidden unless scroll timelines + anchor positioning are supported */
.elementor div.sx-flow-wrap { position: static; padding: 0; min-width: 0; height: 0; }
.elementor img.sx-flow { display: none; }

/* ch5 protect (navy + refraction light) */
.elementor section.sx-ch5 { background: radial-gradient(60vw 60vw at 78% 30%, rgba(154,206,235,.2), rgba(154,206,235,0) 70%), #003153; }
.elementor section.sx-ch5::before { background: rgba(154,206,235,.7); }
.elementor .sx-ch5 div.sx-ch-media { background-image: url(https://www.skinmedical.co.il/wp-content/uploads/2026/10/sm2-vibe-sunscreen-b.webp); border-color: rgba(154,206,235,.35); box-shadow: 0 40px 80px -40px rgba(0,0,0,.5); }
.elementor .sx-ch5 div.sx-ch-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, rgba(217,234,243,0) 35%, rgba(217,234,243,.34) 50%, rgba(217,234,243,0) 65%); transform: translate3d(-120%, 0, 0); pointer-events: none; }
.elementor .sx-ch5 h2.sx-ab-h { color: #FDFDFD; }
.elementor .sx-ch5 p.sx-ab-t { color: rgba(253,253,253,.8); }
.elementor .sx-ch5 p.sx-ab-names { color: #9ACEEB; }

/* ch6 arrival (pure, ice chips) */
.elementor section.sx-ch6 { background: radial-gradient(50vw 30vw at 50% 100%, rgba(217,234,243,.9), rgba(217,234,243,0) 70%), #FDFDFD; }
.elementor .sx-ch6 div.sx-ch-stage { padding: 18vh 16px 18vh; min-width: 0; }
.elementor div.sx-ab-chips { padding: 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 26px; }
.elementor p.sx-ab-chip { display: inline-block; padding: 7px 16px; border-radius: 999px; background: #D9EAF3; border: 1px solid rgba(154,206,235,.8); font-size: .85rem; color: #003153; }
.elementor div.sx-ab-ctas { padding: 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; margin-top: 30px; }
.elementor .sx-ab-ctas .e-button-base { white-space: nowrap; }
.elementor .sx-ab-ctas a.sx-cp-ghost.e-button-base { background: transparent; color: #003153; border: 1px solid rgba(0,49,83,.35); border-radius: 999px; padding: 12px 24px; font-size: .95rem; transition: transform 160ms var(--ease-out), background-color 150ms ease, border-color 150ms ease; }
.elementor .sx-ab-ctas a.sx-cp-ghost.e-button-base:hover { background: #D9EAF3; border-color: #003153; }
.elementor .sx-ab-ctas a.sx-cp-ghost.e-button-base:focus-visible { outline: 2px solid #9ACEEB; outline-offset: 3px; }

@media (max-width: 1024px) {
  .elementor div.sx-ch-split, .elementor div.sx-ch-step { gap: 5vw; }
}
@media (max-width: 767px) {
  .elementor div.sx-ch-split { grid-template-columns: 1fr; padding: 14vh 22px 10vh 16px; gap: 32px; }
  .elementor .sx-ch1 div.sx-ch-split { min-height: 0; padding-top: 130px; }
  .elementor div.sx-ch-step { grid-template-columns: 1fr; gap: 22px; padding: 16px 16px 26px; border-radius: 28px; }
  .elementor div.sx-ch-step::before { right: 28px; left: 28px; }
  .elementor div.sx-ch-step div.sx-ch-panel { order: -1; }
  .elementor .sx-ch3 div.sx-ch-copy { padding: 0 22px 0 16px; }
  .elementor div.sx-ch-track { --cw: 78vw; --g: 14px; padding: 0 22px 0 16px; }
  .elementor .sx-ch3 div.sx-ch-stage::after { margin: 0 22px 0 16px; }
  .elementor div.sx-ch-card { min-height: 240px; }
  .elementor .sx-ch4 div.sx-ch-stage { padding: 12vh 22px 10vh 16px; gap: 9vh; }
  .elementor section.sx-chap::before { right: 9px; }
  .elementor section.sx-ch6::after { right: 5px; }
}

/* ---------- motion: content is visible first; scroll only refines it ---------- */
@supports (animation-timeline: view()) {
@media (prefers-reduced-motion: no-preference) {
  @keyframes mrise { from { opacity: .3; transform: translate3d(0, 26px, 0); } to { opacity: 1; transform: none; } }
  @keyframes mframe { from { clip-path: inset(5% 5% 5% 5% round 28px); } to { clip-path: inset(0 0 0 0 round 28px); } }
  @keyframes mdrift { from { background-position: 50% 30%; } to { background-position: 50% 70%; } }
  @keyframes mfloat { from { transform: translate3d(0, 22px, 0); } to { transform: translate3d(0, -22px, 0); } }
  @keyframes mdraw { from { transform: scaleY(0); } to { transform: scaleY(1); } }
  @keyframes mrule { from { transform: scaleX(0); } to { transform: scaleX(1); } }

  /* text stays still: headings and copy are read, not performed (the frames, panels, thread and layered cards carry the motion) */
  .elementor div.sx-ch-media { background-size: auto 116%; animation: mframe linear both, mdrift linear both; animation-timeline: view(), view(); animation-range: entry 0% cover 40%, cover 0% cover 100%; }
  .elementor div.sx-ch-panel { animation: mrise linear both; animation-timeline: view(); animation-range: entry 0% entry 70%; }
  .elementor .sx-ch-panel .sx-ab-prod { animation: mfloat linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
  .elementor div.sx-ch-book::before { animation: mrule linear both; animation-timeline: view(); animation-range: entry 20% cover 45%; }

  /* the thread draws itself through each chapter */
  .elementor section.sx-ch1, .elementor section.sx-ch2, .elementor section.sx-ch4, .elementor section.sx-ch6 { view-timeline: --sec block; }
  .elementor section.sx-chap::before { animation: mdraw linear both; animation-timeline: --sec; animation-range: cover 8% cover 62%; }
  .elementor section.sx-ch1::before { animation-range: cover 30% cover 80%; }
  .elementor section.sx-ch6::after { animation: mrise linear both; animation-timeline: --sec; animation-range: cover 40% cover 60%; }

  /* ch1 -> ch2 (product use): the Brightalive bottle lifts off the hero plinth, flows down and dissolves into the serum drop, which ripples.
     Anchor positioning: the bottle (root-level, absolute in the page wrapper) interpolates between the two photo frames at any layout. */
  @supports (anchor-name: --a) {
    body { timeline-scope: --hero; }
    .elementor.elementor-49 { position: relative; }
    .elementor section.sx-ch1 { z-index: 3; view-timeline: --sec block, --hero block; }
    .elementor section.sx-ch1 div.sx-ch-media { anchor-name: --a1; background-image: url(https://d2ol7oe51mr4n9.cloudfront.net/user_34kM4qqAXkMxiwfbQCUDvrbiPbl/f7afa40c-a85e-4035-b423-5e26bb5e7a71.webp); background-size: auto 116%; background-position: 50% 50%; animation: none; }
    .elementor section.sx-ch2 div.sx-ch-media { anchor-name: --a2; }
    .elementor img.sx-flow { display: block; position: absolute; z-index: 5; margin: 0; max-width: none; height: auto; pointer-events: none; filter: drop-shadow(0 18px 22px rgba(0,49,83,.28)); animation: flow linear both; animation-timeline: --hero; animation-range: exit 0% exit 100%; }
    @keyframes flow {
      0%   { left: calc(anchor(--a1 left) + anchor-size(--a1 width) * .605); top: calc(anchor(--a1 top) + anchor-size(--a1 height) * .398); width: calc(anchor-size(--a1 width) * .52); transform: translate(-50%, -50%) rotate(0deg); opacity: 1; }
      14%  { left: calc(anchor(--a1 left) + anchor-size(--a1 width) * .62); top: calc(anchor(--a1 top) + anchor-size(--a1 height) * .35); width: calc(anchor-size(--a1 width) * .52); transform: translate(-50%, -50%) rotate(-4deg); opacity: 1; }
      48%  { left: calc((anchor(--a1 left) + anchor-size(--a1 width) * .7) * .45 + (anchor(--a2 left) + anchor-size(--a2 width) * .1) * .55); top: calc((anchor(--a1 top) + anchor-size(--a1 height) * .6) * .5 + (anchor(--a2 top) + anchor-size(--a2 height) * .05) * .5); width: calc(anchor-size(--a1 width) * .46); transform: translate(-50%, -50%) rotate(9deg); opacity: 1; }
      80%  { left: calc(anchor(--a2 left) + anchor-size(--a2 width) * .24); top: calc(anchor(--a2 top) + anchor-size(--a2 height) * .345); width: calc(anchor-size(--a2 width) * .34); transform: translate(-50%, -50%) rotate(-5deg); opacity: 1; filter: drop-shadow(0 18px 22px rgba(0,49,83,.28)) blur(0); }
      100% { left: calc(anchor(--a2 left) + anchor-size(--a2 width) * .24); top: calc(anchor(--a2 top) + anchor-size(--a2 height) * .38); width: calc(anchor-size(--a2 width) * .2); transform: translate(-50%, -50%) rotate(0deg); opacity: 0; filter: drop-shadow(0 0 0 rgba(0,49,83,0)) blur(6px); }
    }
    .elementor section.sx-ch2 div.sx-ch-media::before, .elementor section.sx-ch2 div.sx-ch-media::after { content: ""; position: absolute; z-index: 1; left: 24%; top: 36.5%; width: 34%; height: auto; aspect-ratio: 1; border-radius: 50%; border: 1.5px solid rgba(253,253,253,.85); box-shadow: 0 0 24px rgba(217,234,243,.55); mix-blend-mode: normal; pointer-events: none; transform: translate(-50%, -50%) scale(.4); opacity: 0; animation: ripple linear both; animation-timeline: --hero; animation-range: exit 80% exit 100%; }
    .elementor section.sx-ch2 div.sx-ch-media::after { animation-range: exit 86% exit 100%; }
    @keyframes ripple { 0% { transform: translate(-50%, -50%) scale(.4); opacity: 0; } 25% { opacity: .9; } 100% { transform: translate(-50%, -50%) scale(2.4); opacity: 0; } }
  }

  /* ch3: pinned horizontal pan; the thread turns into the rail and fills with the years */
  .elementor section.sx-ch3 { height: 260vh; height: 260svh; view-timeline: --c3 block; }
  .elementor .sx-ch3 div.sx-ch-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; justify-content: center; padding: 0; }
  .elementor div.sx-ch-track { flex-wrap: nowrap; width: max-content; animation: c3pan linear both; animation-timeline: --c3; animation-range: contain 10% contain 92%; }
  @keyframes c3pan { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(8 * var(--cw) + 7 * var(--g) + 16vw - 100vw), 0, 0); } }
  .elementor .sx-ch3 div.sx-ch-stage::after { animation: c3rail linear both; animation-timeline: --c3; animation-range: contain 10% contain 92%; }
  @keyframes c3rail { from { background-size: 12% 100%; } to { background-size: 100% 100%; } }
  .elementor .sx-ch3 div.sx-ch-copy > * { animation: none; }

  /* ch4 (layering): step 1 holds, step 2 slides over it as the next layer, step 3 (navy) closes over both */
  .elementor .sx-ch4 div.sx-ch-stage { timeline-scope: --s2; padding-bottom: 0; }
  .elementor .sx-ch4 div.sx-ch-stage::after { content: ""; display: block; flex: 0 0 50vh; }
  .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step { position: sticky; top: 12vh; }
  .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step:nth-child(3) { margin-top: 14vh; top: calc(12vh + 22px); view-timeline: --s2 block; box-shadow: 0 -30px 70px -44px rgba(0,49,83,.4), 0 40px 80px -60px rgba(0,49,83,.45); }
  .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step:nth-child(2) { transform-origin: 50% 0; animation: c4under linear both; animation-timeline: --s2; animation-range: entry 70% contain 55%; }
  @keyframes c4under { to { transform: scale(.94); } }
  .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step:nth-child(2)::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; background: #D9EAF3; opacity: 0; pointer-events: none; animation: c4veil linear both; animation-timeline: --s2; animation-range: entry 85% contain 60%; }
  @keyframes c4veil { to { opacity: .5; } }
  .elementor div.sx-ch-step::before { animation: mrule linear both; animation-timeline: view(); animation-range: entry 25% entry 90%; }
  .elementor section.sx-ch5 { z-index: 1; margin-top: -22vh; border-radius: 48px 48px 0 0; }
  .elementor section.sx-ch5::before { top: 56px; }

  /* ch5 (peak): pinned with everything visible; the frame settles, light sweeps the photo, the navy brightens */
  .elementor section.sx-ch5 { height: 190vh; height: 190svh; view-timeline: --c5 block, --sec block; }
  .elementor section.sx-ch5::after { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(55vw 55vw at 76% 34%, rgba(154,206,235,.3), rgba(154,206,235,0) 70%); opacity: 0; animation: c5light linear both; animation-timeline: --c5; animation-range: contain 10% contain 75%; }
  @keyframes c5light { to { opacity: 1; } }
  .elementor .sx-ch5 div.sx-ch-split { z-index: 1; }
  .elementor section.sx-ch5::before { animation-range: contain 0% contain 70%; }
  .elementor .sx-ch5 div.sx-ch-split { position: sticky; top: 0; height: 100vh; height: 100svh; padding-top: 12vh; padding-bottom: 8vh; }
  .elementor .sx-ch5 div.sx-ch-media { animation: c5frame linear both, mdrift linear both; animation-timeline: --c5, --c5; animation-range: contain 0% contain 45%, contain 0% contain 100%; }
  @keyframes c5frame { from { clip-path: inset(7% 7% 7% 7% round 28px); transform: scale(.97); } to { clip-path: inset(0 0 0 0 round 28px); transform: none; } }
  .elementor .sx-ch5 div.sx-ch-media::after { animation: c5sheen linear both; animation-timeline: --c5; animation-range: contain 35% contain 80%; }
  @keyframes c5sheen { from { transform: translate3d(-120%, 0, 0); } to { transform: translate3d(120%, 0, 0); } }

  @media (max-width: 1024px) {
    .elementor div.sx-ch-media { background-size: cover; animation-name: mframe, none; }
    .elementor .sx-ch5 div.sx-ch-media { animation-name: c5frame, none; }
  }
  @media (max-width: 767px) {
    @keyframes c3pan { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(8 * var(--cw) + 7 * var(--g) + 38px - 100vw), 0, 0); } }
    .elementor section.sx-ch5 { height: auto; animation: none; view-timeline: --sec block; }
    .elementor .sx-ch5 div.sx-ch-split { position: relative; height: auto; padding: 14vh 22px 10vh 16px; }
    .elementor .sx-ch5 div.sx-ch-media { animation: mframe linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    .elementor .sx-ch5 div.sx-ch-media::after { display: none; }
    .elementor section.sx-ch5::before { animation-range: cover 8% cover 62%; top: 40px; }
    .elementor .sx-ch4 div.sx-ch-stage::after { flex-basis: 40vh; }
    .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step { top: 72px; }
    .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step:nth-child(3) { top: 90px; margin-top: 22vh; }
    .elementor section.sx-ch5 { margin-top: -12vh; border-radius: 32px 32px 0 0; }
  }
  @media (max-height: 560px) {
    .elementor .sx-ch4 div.sx-ch-stage > div.sx-ch-step { position: relative; top: auto; }
  }
}
}/* End custom CSS */