/* Isolated background experiment for how-it-works clone */
body.how-it-works-bg-test{
  position:relative;
  isolation:isolate;
  background:transparent;
}

body.how-it-works-bg-test::before,
body.how-it-works-bg-test::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
}

/* Lowest layer: world map background */
body.how-it-works-bg-test::before{
  z-index:-2;
  background-image:url("../assets/img/small_world_map.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:brightness(.75) saturate(1.02) contrast(1.08);
}

/* Dark theme preservation layer */
body.how-it-works-bg-test::after{
  z-index:-1;
  background:
    radial-gradient(1100px 600px at 20% 0%, rgba(122,162,255,.14), transparent 60%),
    radial-gradient(900px 520px at 80% 10%, rgba(110,243,197,.09), transparent 55%),
    linear-gradient(180deg, rgba(8,11,22,.56) 0%, rgba(11,16,32,.68) 100%);
}

body.how-it-works-bg-test .header{
  background:rgba(8,11,22,.54);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  backdrop-filter:saturate(160%) blur(14px);
}

body.how-it-works-bg-test .card{
  background:linear-gradient(180deg, rgba(14,22,44,.42), rgba(12,19,38,.30));
}

body.how-it-works-bg-test .badge,
body.how-it-works-bg-test .cta{
  background:rgba(255,255,255,.04);
}

body.how-it-works-bg-test .callout{
  padding:16px 18px;
  gap:14px;
}

body.how-it-works-bg-test .callout h2{
  font-size:clamp(18px,2vw,24px);
  font-weight:600;
}

body.how-it-works-bg-test .callout p{
  font-size:clamp(14px,1.45vw,16px);
}