/* ==========================================================================
   DigiCard — custom.css
   All styles extracted from the design. Organised as:
   1. Base & reset   2. Sections (one block per section)   3. Responsive container & scale
   ========================================================================== */

/* 1. Base & reset ---------------------------------------------------------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Poppins', system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: clip; }
body.landing-page { background: #0B0B0F; color: #fff; }
:where(img) { display: block; max-width: 100%; }
:where(svg, video) { max-width: 100%; }
::selection { background: #5B6CFF; color: #fff; }
:where(.landing-page a) { color: #8FA8FF; text-decoration: none; }
:where(.landing-page a:hover) { color: #fff; }
[hidden] { display: none !important; }
@keyframes dcProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* 2. Sections --------------------------------------------------------------- */

/* ===== Page wrapper — .page-wrapper ===== */
.page-wrapper__div-1 {
  min-height: 100vh;
  background: rgb(11, 11, 15);
  overflow-x: clip;
}
.page-wrapper__div-2 {
  min-height: 100vh;
  background: rgb(241, 244, 245);
  display: flex;
  flex-direction: column;
}

/* ===== Header (landing) — .header-section ===== */
.header-section {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 50;
  transition: background 0.3s, border-color 0.3s, backdrop-filter 0.3s;
  background: transparent;
  backdrop-filter: none;
  border-bottom: 1px solid transparent;
}
.header-section__div-1 {
  max-width: 1248px;
  margin: 0px auto;
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.header-section__a-2 {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}
.header-section__img-3 {
  height: 46px;
  width: auto;
}
.header-section__nav-4 {
  flex: 0 1 auto;
  min-width: 0px;
  overflow-x: auto;
  scrollbar-width: none;
  display: flex;
  gap: 2px;
  padding: 4px;
  border-radius: 12px;
  background: rgba(18, 18, 26, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
}
.header-section__a-5 {
  position: relative;
  flex: 0 0 auto;
  padding: 8px 14px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  color: rgb(168, 168, 179);
  background: transparent;
  box-shadow: none;
  transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}
.header-section__a-5:hover {
  color: rgb(255, 255, 255) !important;
}
.header-section__div-6 {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.header-section__a-7 {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  white-space: nowrap;
  border-radius: 10px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  color: rgb(255, 255, 255);
  font-weight: 600;
  font-size: 14px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.header-section__a-7:hover {
  transform: translateY(-2px) !important;
  box-shadow: rgba(110, 110, 255, 0.45) 0px 8px 28px !important;
  color: rgb(255, 255, 255) !important;
}
.header-section__a-8 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 10px;
  border: 1.5px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.04);
  color: rgb(255, 255, 255);
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
  transition: transform 0.2s, border-color 0.2s, background 0.2s;
}
.header-section__a-8:hover {
  transform: translateY(-2px) !important;
  border-color: rgb(124, 140, 255) !important;
  background: rgba(124, 140, 255, 0.12) !important;
  color: rgb(255, 255, 255) !important;
}
.header-section__img-9 {
  height: 16px;
  width: auto;
  display: block;
}
.header-section__div-10 {
  position: absolute;
  left: 0px;
  bottom: -1px;
  height: 2px;
  width: 100%;
  transform-origin: left center;
  transform: scaleX(0);
  background: linear-gradient(90deg, rgb(79, 123, 255), rgb(139, 92, 246));
  transition: transform 0.1s linear;
}
.header-section.is-scrolled {
  background: rgba(11, 11, 15, 0.72);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.header-section__a-5.is-active {
  color: #fff;
  background: linear-gradient(135deg, #4F7BFF, #8B5CF6);
  box-shadow: 0 6px 18px rgba(91, 108, 255, 0.4);
}

/* ===== Hero — .hero-section ===== */
.hero-section {
  position: relative;
  padding: clamp(104px, 11vw, 136px) 24px clamp(40px, 5vw, 72px);
}
.hero-section__div-1 {
  position: absolute;
  inset: 0px;
  background: linear-gradient(rgb(14, 14, 26) 0%, rgb(11, 11, 15) 100%);
  pointer-events: none;
}
.hero-section__div-2 {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(70% 70% at 60% 40%, rgb(0, 0, 0) 20%, transparent 75%);
  pointer-events: none;
}
.hero-section__div-3 {
  position: absolute;
  inset: 0px;
  background: radial-gradient(55% 55% at 78% 40%, rgba(91, 108, 255, 0.3), transparent 70%), radial-gradient(35% 45% at 8% 20%, rgba(139, 92, 246, 0.2), transparent 70%), radial-gradient(40% 30% at 50% 100%, rgba(64, 111, 197, 0.18), transparent 70%);
  pointer-events: none;
}
.hero-section__div-4 {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  height: 160px;
  background: linear-gradient(transparent, rgb(11, 11, 15));
  pointer-events: none;
}
.hero-section__div-5 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
  gap: clamp(48px, 6vw, 80px);
  align-items: center;
}
.hero-section__div-6 {
  display: flex;
  flex-direction: column;
  gap: 28px;
  position: relative;
  z-index: 2;
}
.hero-section__h1-7 {
  margin: 0px;
  font-size: clamp(40px, 5.6vw, 68px);
  line-height: 1.04;
  letter-spacing: -0.035em;
  font-weight: 800;
  text-wrap: balance;
}
.hero-section__span-8 {
  background: linear-gradient(90deg, rgb(110, 139, 255), rgb(167, 123, 255)) text;
  color: transparent;
}
.hero-section__p-9 {
  margin: 0px;
  font-size: 17px;
  line-height: 1.6;
  color: rgb(154, 154, 165);
  max-width: 460px;
  text-wrap: pretty;
}
.hero-section__div-10 {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}
.hero-section__a-11 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 30px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  color: rgb(255, 255, 255);
  font-weight: 700;
  font-size: 16px;
  box-shadow: rgba(91, 108, 255, 0.35) 0px 10px 40px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.hero-section__a-11:hover {
  transform: translateY(-2px) !important;
  box-shadow: rgba(120, 110, 255, 0.55) 0px 14px 48px !important;
  color: rgb(255, 255, 255) !important;
}
.hero-section__span-12 {
  font-size: 14px;
  color: rgb(154, 154, 165);
}
.hero-section__div-13 {
  position: relative;
  height: 50px;
  width: 100%;
}
.hero-section__div-14 {
  position: absolute;
  left: 10%;
  top: 0px;
  width: 90%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(96, 110, 255, 0.4), rgba(139, 92, 246, 0.14) 60%, transparent);
  filter: blur(40px);
  pointer-events: none;
}
.hero-section__div-15 {
  position: absolute;
  left: 0px;
  top: 50px;
  width: min(160%, 1120px, 95vw);
}
.hero-section__div-16 {
  position: relative;
  transform: rotate(-22deg) skewX(24deg) scaleY(0.9);
  transform-origin: 50% 50%;
}
.hero-section__div-17 {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: rgba(0, 0, 0, 0.6) 0px 60px 120px, rgba(110, 130, 255, 0.2) 0px 0px 0px 1px, rgba(91, 108, 255, 0.25) 0px 0px 80px;
  background: rgb(255, 255, 255);
}
.hero-section__img-18 {
  width: 100%;
  aspect-ratio: 1900 / 910;
  object-fit: cover;
  object-position: left top;
}
.hero-section__div-19 {
  position: absolute;
  left: 14%;
  top: -9%;
  width: 26%;
  padding: 16px 18px;
  border-radius: 12px;
  background: rgb(255, 255, 255);
  border: 1px solid rgb(220, 227, 245);
  box-shadow: rgba(0, 0, 0, 0.35) 0px 30px 60px;
  color: rgb(11, 11, 15);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hero-section__span-20 {
  font-size: 30px;
  font-weight: 800;
  color: rgb(64, 111, 197);
  line-height: 1;
}
.hero-section__span-21 {
  font-size: 9px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(91, 94, 107);
}
.hero-section__div-22 {
  position: absolute;
  left: 60%;
  top: -4%;
  width: 20%;
  min-width: 150px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(18, 26, 48, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 60px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hero-section__span-23 {
  font-size: 8px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(140, 147, 168);
  padding: 0px 8px;
}
.hero-section__span-24 {
  font-size: 12px;
  font-weight: 600;
  padding: 7px 8px;
  border-radius: 6px;
  background: rgb(64, 111, 197);
}
.hero-section__span-25 {
  font-size: 12px;
  font-weight: 600;
  padding: 7px 8px;
  color: rgb(200, 206, 221);
}
.hero-section__div-26 {
  position: absolute;
  left: 30%;
  bottom: -8%;
  padding: 12px 18px;
  border-radius: 10px;
  background: rgb(64, 111, 197);
  box-shadow: rgba(64, 111, 197, 0.5) 0px 20px 40px;
  font-size: 13px;
  font-weight: 700;
}
.hero-section__div-27 {
  position: absolute;
  left: -4%;
  top: 38%;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(22, 22, 30, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: rgba(0, 0, 0, 0.4) 0px 20px 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
}
.hero-section__span-28 {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(61, 220, 132);
}

/* ===== Digital business card — .digital-card-section ===== */
.digital-card-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
}
.digital-card-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(rgba(79, 107, 232, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 107, 232, 0.07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(65% 55% at 50% 55%, rgb(0, 0, 0) 25%, transparent 85%);
  pointer-events: none;
}
.digital-card-section__div-2 {
  position: absolute;
  right: -12%;
  top: -20%;
  width: 50%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 120, 255, 0.18), transparent);
  pointer-events: none;
}
.digital-card-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.digital-card-section__div-4 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: clamp(40px, 6vw, 80px);
  align-items: center;
}
.digital-card-section__div-5 {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.digital-card-section__div-6 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.digital-card-section__span-7 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(79, 107, 232);
}
.digital-card-section__h2-8 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.digital-card-section__p-9 {
  margin: 0px;
  color: rgb(91, 94, 107);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
}
.digital-card-section__div-10 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 22px 28px;
}
.digital-card-section__div-11 {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.digital-card-section__span-12 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: rgb(238, 241, 252);
  border: 1px solid transparent;
  display: grid;
  place-items: center;
}
.digital-card-section__span-13 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 1px;
}
.digital-card-section__strong-14 {
  font-size: 16px;
  font-weight: 700;
  color: rgb(11, 11, 15);
}
.digital-card-section__span-15 {
  font-size: 14px;
  line-height: 1.6;
  color: rgb(91, 94, 107);
}
.digital-card-section__div-16 {
  place-self: center;
  width: min(100%, 340px);
  border-radius: 32px;
  padding: 10px;
  background: rgb(15, 15, 22);
  box-shadow: rgba(20, 24, 60, 0.28) 0px 50px 100px, rgba(15, 20, 40, 0.08) 0px 0px 0px 1px;
}
.digital-card-section__div-17 {
  border-radius: 24px;
  overflow: hidden;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
}
.digital-card-section__div-18 {
  height: 96px;
  background: linear-gradient(135deg, rgb(62, 75, 255), rgb(139, 92, 246));
  position: relative;
}
.digital-card-section__span-19 {
  position: absolute;
  left: 16px;
  top: 14px;
  font: 500 11px Poppins, sans-serif;
  color: rgba(255, 255, 255, 0.85);
}
.digital-card-section__div-20 {
  padding: 0px 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: -40px;
  position: relative;
}
.digital-card-section__span-21 {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgb(15, 15, 22), rgb(42, 47, 90));
  border: 4px solid rgb(255, 255, 255);
  display: grid;
  place-items: center;
  color: rgb(255, 255, 255);
  font-weight: 700;
  font-size: 24px;
}
.digital-card-section__div-22 {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.digital-card-section__span-23 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.digital-card-section__strong-24 {
  font-size: 20px;
  letter-spacing: -0.01em;
}
.digital-card-section__span-25 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgb(232, 247, 238);
  color: rgb(30, 138, 76);
  font-size: 10px;
  font-weight: 700;
}
.digital-card-section__span-26 {
  font-size: 13px;
  color: rgb(91, 94, 107);
}
.digital-card-section__div-27 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.digital-card-section__span-28 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: rgb(58, 61, 74);
}
.digital-card-section__span-29 {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgb(238, 241, 252);
  display: grid;
  place-items: center;
}
.digital-card-section__span-30 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px;
  border-radius: 10px;
  background: rgb(11, 11, 15);
  color: rgb(255, 255, 255);
  font-size: 14px;
  font-weight: 600;
}
.digital-card-section__div-31 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.digital-card-section__span-32 {
  font-size: 11px;
  letter-spacing: 0.12em;
  font-weight: 700;
  color: rgb(154, 157, 170);
}
.digital-card-section__span-33 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 11px 12px;
  border-radius: 10px;
  background: rgb(245, 246, 250);
  font-size: 13px;
  font-weight: 600;
}
.digital-card-section__span-34 {
  color: rgb(79, 107, 232);
}

/* ===== AI twin — .ai-twin-section ===== */
.ai-twin-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: linear-gradient(rgb(11, 11, 15) 0%, rgb(16, 16, 42) 50%, rgb(11, 11, 15) 100%);
  color: rgb(255, 255, 255);
}
.ai-twin-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: radial-gradient(55% 60%, rgb(0, 0, 0) 20%, transparent 80%);
  pointer-events: none;
}
.ai-twin-section__div-2 {
  position: absolute;
  inset: 0px;
  background: radial-gradient(40% 50% at 70% 40%, rgba(91, 108, 255, 0.22), transparent 70%), radial-gradient(25% 35% at 10% 85%, rgba(139, 92, 246, 0.16), transparent 70%);
  pointer-events: none;
}
.ai-twin-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.ai-twin-section__div-4 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: clamp(40px, 6vw, 80px);
  align-items: center;
}
.ai-twin-section__div-5 {
  border-radius: 22px;
  padding: clamp(24px, 3vw, 36px);
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  box-shadow: rgba(20, 24, 60, 0.2) 0px 30px 80px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
  align-self: center;
}
.ai-twin-section__div-6 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.ai-twin-section__span-7 {
  display: flex;
  align-items: center;
  gap: 12px;
}
.ai-twin-section__span-8 {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 14px;
}
.ai-twin-section__span-9 {
  display: flex;
  flex-direction: column;
}
.ai-twin-section__strong-10 {
  font-size: 15px;
}
.ai-twin-section__span-11 {
  font-size: 12px;
  color: rgb(143, 227, 168);
}
.ai-twin-section__span-12 {
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  font-size: 11px;
  color: rgb(168, 168, 179);
}
.ai-twin-section__div-13 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 14px;
  line-height: 1.55;
}
.ai-twin-section__span-14 {
  align-self: flex-end;
  max-width: 80%;
  padding: 11px 15px;
  border-radius: 16px 16px 4px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(107, 92, 246));
}
.ai-twin-section__span-15 {
  align-self: flex-start;
  max-width: 86%;
  padding: 11px 15px;
  border-radius: 16px 16px 16px 4px;
  background: rgba(255, 255, 255, 0.07);
  color: rgb(228, 228, 234);
}
.ai-twin-section__span-16 {
  display: inline-block;
  width: 7px;
  height: 15px;
  margin-left: 3px;
  vertical-align: -2px;
  background: rgb(175, 192, 255);
  border-radius: 1px;
}
.ai-twin-section__div-17 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ai-twin-section__span-18 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255, 170, 80, 0.12);
  color: rgb(255, 197, 138);
  font-size: 12px;
  font-weight: 600;
}
.ai-twin-section__span-19 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(61, 220, 132, 0.12);
  color: rgb(143, 227, 168);
  font-size: 12px;
  font-weight: 600;
}
.ai-twin-section__div-20 {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.ai-twin-section__div-21 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ai-twin-section__span-22 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.ai-twin-section__h2-23 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.ai-twin-section__span-24 {
  background: linear-gradient(90deg, rgb(110, 139, 255), rgb(167, 123, 255)) text;
  color: transparent;
}
.ai-twin-section__p-25 {
  margin: 0px;
  color: rgb(154, 154, 165);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
}
.ai-twin-section__div-26 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 22px 28px;
}
.ai-twin-section__div-27 {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.ai-twin-section__span-28 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: rgba(124, 140, 255, 0.14);
  border: 1px solid rgba(143, 168, 255, 0.22);
  display: grid;
  place-items: center;
}
.ai-twin-section__span-29 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 1px;
}
.ai-twin-section__strong-30 {
  font-size: 16px;
  font-weight: 700;
  color: rgb(255, 255, 255);
}
.ai-twin-section__span-31 {
  font-size: 14px;
  line-height: 1.6;
  color: rgb(154, 154, 165);
}

/* ===== Lead capture & events — .leads-events-section ===== */
.leads-events-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: rgb(241, 244, 245);
  color: rgb(11, 11, 15);
}
.leads-events-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(rgba(79, 107, 232, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 107, 232, 0.07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(65% 55% at 50% 55%, rgb(0, 0, 0) 25%, transparent 85%);
  pointer-events: none;
}
.leads-events-section__div-2 {
  position: absolute;
  right: -12%;
  top: -20%;
  width: 50%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 120, 255, 0.18), transparent);
  pointer-events: none;
}
.leads-events-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.leads-events-section__div-4 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 20px 64px;
  align-items: end;
}
.leads-events-section__div-5 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.leads-events-section__span-6 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(79, 107, 232);
}
.leads-events-section__h2-7 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.leads-events-section__p-8 {
  margin: 0px;
  color: rgb(91, 94, 107);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
  max-width: 480px;
}
.leads-events-section__div-9 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 20px;
  align-items: stretch;
}
.leads-events-section__div-10 {
  border-radius: 22px;
  padding: clamp(24px, 3vw, 36px);
  background: rgb(255, 255, 255);
  border: 1px solid rgba(15, 20, 40, 0.06);
  box-shadow: rgba(20, 24, 60, 0.06) 0px 10px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
}
.leads-events-section__div-11 {
  display: flex;
  align-items: center;
  gap: 14px;
}
.leads-events-section__span-12 {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  display: grid;
  place-items: center;
  box-shadow: rgba(91, 108, 255, 0.3) 0px 10px 24px;
}
.leads-events-section__span-13 {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.leads-events-section__h3-14 {
  margin: 0px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.leads-events-section__span-15 {
  font-size: 14px;
  color: rgb(91, 94, 107);
}
.leads-events-section__div-16 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border-radius: 16px;
  background: rgb(247, 248, 252);
  border: 1px solid rgba(15, 20, 40, 0.06);
}
.leads-events-section__div-17 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.leads-events-section__span-18 {
  display: flex;
  align-items: center;
  gap: 10px;
}
.leads-events-section__span-19 {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
}
.leads-events-section__span-20 {
  display: flex;
  flex-direction: column;
}
.leads-events-section__strong-21 {
  font-size: 14px;
}
.leads-events-section__span-22 {
  font-size: 12px;
  color: rgb(91, 94, 107);
}
.leads-events-section__span-23 {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgb(255, 237, 227);
  color: rgb(210, 85, 30);
  font-size: 12px;
  font-weight: 700;
}
.leads-events-section__div-24 {
  display: flex;
  gap: 6px;
}
.leads-events-section__span-25 {
  flex: 1 1 0px;
  min-width: 0px;
  text-align: center;
  padding: 10px 6px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  background: rgb(243, 244, 248);
  color: rgb(91, 94, 107);
}
.leads-events-section__span-26 {
  flex: 1 1 0px;
  min-width: 0px;
  text-align: center;
  padding: 10px 6px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  color: rgb(255, 255, 255);
}
.leads-events-section__ul-27 {
  margin: 0px;
  padding: 0px;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.leads-events-section__li-28 {
  display: flex;
  gap: 12px;
  font-size: 15px;
  line-height: 1.55;
  color: rgb(58, 61, 74);
}
.leads-events-section__span-29 {
  flex: 0 0 auto;
  margin-top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgb(238, 241, 252);
  display: grid;
  place-items: center;
}
.leads-events-section__div-30 {
  border-radius: 22px;
  padding: clamp(24px, 3vw, 36px);
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  box-shadow: rgba(20, 24, 60, 0.2) 0px 30px 80px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
}
.leads-events-section__div-31 {
  position: absolute;
  right: -90px;
  top: -90px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 110, 255, 0.35), transparent);
  pointer-events: none;
}
.leads-events-section__span-32 {
  font-size: 14px;
  color: rgb(154, 154, 165);
}
.leads-events-section__div-33 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.leads-events-section__span-34 {
  font-size: 12px;
  letter-spacing: 0.12em;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.leads-events-section__div-35 {
  display: flex;
  gap: 10px;
}
.leads-events-section__span-36 {
  flex: 1 1 0px;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.leads-events-section__span-37 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: rgb(255, 154, 107);
}
.leads-events-section__span-38 {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(255, 154, 107);
}
.leads-events-section__strong-39 {
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.02em;
}
.leads-events-section__span-40 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: rgb(255, 211, 107);
}
.leads-events-section__span-41 {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(255, 211, 107);
}
.leads-events-section__span-42 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.leads-events-section__span-43 {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(143, 168, 255);
}
.leads-events-section__li-44 {
  display: flex;
  gap: 12px;
  font-size: 15px;
  line-height: 1.55;
  color: rgb(200, 200, 210);
}
.leads-events-section__span-45 {
  flex: 0 0 auto;
  margin-top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(124, 140, 255, 0.16);
  display: grid;
  place-items: center;
}

/* ===== Product gallery — .gallery-section ===== */
.gallery-section {
  scroll-margin-top: 72px;
  position: relative;
  padding: clamp(80px, 10vw, 136px) 24px;
  overflow: hidden;
  background: linear-gradient(rgb(11, 11, 15) 0%, rgb(15, 15, 36) 40%, rgb(20, 16, 53) 70%, rgb(11, 11, 15) 100%);
}
.gallery-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(transparent, rgb(0, 0, 0) 30%, rgb(0, 0, 0) 70%, transparent);
  pointer-events: none;
}
.gallery-section__div-2 {
  position: absolute;
  left: 50%;
  top: 62%;
  width: min(1300px, 140vw);
  height: min(560px, 60vw);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(143, 168, 255, 0.14);
  pointer-events: none;
}
.gallery-section__div-3 {
  position: absolute;
  left: 50%;
  top: 62%;
  width: min(900px, 100vw);
  height: min(380px, 42vw);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(143, 168, 255, 0.2);
  pointer-events: none;
}
.gallery-section__div-4 {
  position: absolute;
  inset: 0px;
  background: radial-gradient(50% 45% at 50% 62%, rgba(91, 108, 255, 0.28), transparent 70%), radial-gradient(30% 35% at 10% 20%, rgba(139, 92, 246, 0.16), transparent 70%), radial-gradient(30% 35% at 90% 20%, rgba(64, 111, 197, 0.16), transparent 70%);
  pointer-events: none;
}
.gallery-section__div-5 {
  position: absolute;
  inset: 0px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 26px 26px;
  mask-image: radial-gradient(55% 50% at 50% 60%, rgb(0, 0, 0) 20%, transparent 80%);
  pointer-events: none;
}
.gallery-section__div-6 {
  position: relative;
  max-width: 1100px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.gallery-section__span-7 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.gallery-section__h2-8 {
  margin: 0px;
  font-size: clamp(24px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  white-space: nowrap;
}
.gallery-section__span-9 {
  background: linear-gradient(90deg, rgb(110, 139, 255), rgb(167, 123, 255)) text;
  color: transparent;
}
.gallery-section__p-10 {
  margin: 0px;
  color: rgb(154, 154, 165);
  font-size: 17px;
  line-height: 1.7;
  max-width: 560px;
  text-wrap: pretty;
}
.gallery-section__div-11 {
  position: relative;
  max-width: 1000px;
  margin: 36px auto 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.gallery-section__button-12 {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgb(21, 21, 28);
  color: rgb(255, 255, 255);
  font-size: 18px;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.gallery-section__button-12:hover {
  border-color: rgb(124, 140, 255) !important;
  transform: translateY(-2px) !important;
}
.gallery-section__div-13 {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  padding: 4px;
}
.gallery-section__button-14 {
  flex: 0 0 auto;
  font-style: inherit;
  font-variant: inherit;
  font-weight: 600;
  font-stretch: inherit;
  font-size: 13px;
  line-height: inherit;
  font-family: inherit;
  font-optical-sizing: inherit;
  font-size-adjust: inherit;
  font-kerning: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-language-override: inherit;
  cursor: pointer;
  padding: 9px 16px;
  border-radius: 10px;
  white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgb(154, 154, 165);
  transition: 0.3s;
}
.gallery-section__button-15 {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  border-width: medium;
  border-style: none;
  border-color: currentcolor;
  border-image: none;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  color: rgb(255, 255, 255);
  font-size: 18px;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}
.gallery-section__button-15:hover {
  transform: translateY(-2px) !important;
  box-shadow: rgba(120, 110, 255, 0.45) 0px 10px 30px !important;
}
.gallery-section__div-16 {
  position: relative;
  max-width: 1280px;
  margin: 48px auto 0px;
  height: clamp(240px, 40vw, 540px);
}
.gallery-section__button-17 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(820px, 76%);
  padding: 0px;
  font: inherit;
  color: inherit;
  text-align: left;
  border-radius: 16px;
  overflow: hidden;
  background: rgb(21, 21, 28);
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.7s, box-shadow 0.7s, border-color 0.7s;
}
.gallery-section__span-18 {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: rgb(27, 27, 36);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.gallery-section__span-19 {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgb(255, 95, 87);
}
.gallery-section__span-20 {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgb(254, 188, 46);
}
.gallery-section__span-21 {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgb(40, 200, 64);
}
.gallery-section__span-22 {
  flex: 1 1 0%;
  margin-left: 10px;
  height: 22px;
  border-radius: 6px;
  background: rgb(15, 15, 21);
  font: 500 11px Poppins, sans-serif;
  color: rgb(107, 107, 120);
  display: flex;
  align-items: center;
  padding-left: 10px;
}
.gallery-section__span-23 {
  position: relative;
  display: block;
}
.gallery-section__img-24 {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: left top;
  background: rgb(255, 255, 255);
}
.gallery-section__span-25 {
  position: absolute;
  inset: 0px;
  transition: background 0.7s;
}
.gallery-section__button-14.is-active {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: transparent;
  background-image: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  background-color: initial;
  color: rgb(255, 255, 255);
}

/* ===== Staff app & admin panel — .staff-admin-section ===== */
.staff-admin-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
}
.staff-admin-section__div-1 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.staff-admin-section__div-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 20px 64px;
  align-items: end;
}
.staff-admin-section__div-3 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.staff-admin-section__span-4 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(79, 107, 232);
}
.staff-admin-section__h2-5 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.staff-admin-section__p-6 {
  margin: 0px;
  color: rgb(91, 94, 107);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
  max-width: 480px;
}
.staff-admin-section__div-7 {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
}
.staff-admin-section__div-8 {
  border-radius: 22px;
  padding: clamp(24px, 3vw, 36px);
  background: rgb(255, 255, 255);
  border: 1px solid rgba(15, 20, 40, 0.06);
  box-shadow: rgba(20, 24, 60, 0.06) 0px 10px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
  flex: 1 1 320px;
}
.staff-admin-section__div-9 {
  display: flex;
  align-items: center;
  gap: 14px;
}
.staff-admin-section__span-10 {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  display: grid;
  place-items: center;
  box-shadow: rgba(91, 108, 255, 0.3) 0px 10px 24px;
}
.staff-admin-section__span-11 {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.staff-admin-section__h3-12 {
  margin: 0px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.staff-admin-section__span-13 {
  font-size: 14px;
  color: rgb(91, 94, 107);
}
.staff-admin-section__div-14 {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.staff-admin-section__div-15 {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  align-items: start;
}
.staff-admin-section__span-16 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: rgb(238, 241, 252);
  border: 1px solid transparent;
  display: grid;
  place-items: center;
}
.staff-admin-section__span-17 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 1px;
}
.staff-admin-section__strong-18 {
  font-size: 16px;
  font-weight: 700;
  color: rgb(11, 11, 15);
}
.staff-admin-section__span-19 {
  font-size: 14px;
  line-height: 1.6;
  color: rgb(91, 94, 107);
}
.staff-admin-section__div-20 {
  border-radius: 22px;
  padding: clamp(24px, 3vw, 36px);
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  box-shadow: rgba(20, 24, 60, 0.2) 0px 30px 80px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
  flex: 2 1 560px;
}
.staff-admin-section__div-21 {
  position: absolute;
  left: -80px;
  bottom: -120px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 110, 255, 0.3), transparent);
  pointer-events: none;
}
.staff-admin-section__span-22 {
  font-size: 14px;
  color: rgb(154, 154, 165);
}
.staff-admin-section__div-23 {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 20px 28px;
}
.staff-admin-section__span-24 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: rgba(124, 140, 255, 0.14);
  border: 1px solid rgba(143, 168, 255, 0.22);
  display: grid;
  place-items: center;
}
.staff-admin-section__strong-25 {
  font-size: 16px;
  font-weight: 700;
  color: rgb(255, 255, 255);
}
.staff-admin-section__span-26 {
  font-size: 14px;
  line-height: 1.6;
  color: rgb(154, 154, 165);
}

/* ===== The DigiCard app (PWA) — .mobile-section ===== */
.mobile-section {
  scroll-margin-top: 72px;
  padding: clamp(72px, 9vw, 120px) 0px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(rgb(11, 11, 15) 0%, rgb(16, 16, 42) 45%, rgb(22, 18, 58) 70%, rgb(11, 11, 15) 100%);
}
.mobile-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(60% 60% at 50% 55%, rgb(0, 0, 0) 30%, transparent 80%);
  pointer-events: none;
}
.mobile-section__div-2 {
  position: absolute;
  left: 50%;
  top: 58%;
  width: min(1100px, 120vw);
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(143, 168, 255, 0.14);
  pointer-events: none;
}
.mobile-section__div-3 {
  position: absolute;
  left: 50%;
  top: 58%;
  width: min(760px, 90vw);
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(143, 168, 255, 0.18);
  pointer-events: none;
}
.mobile-section__div-4 {
  position: absolute;
  inset: 0px;
  background: radial-gradient(40% 40% at 50% 60%, rgba(91, 108, 255, 0.35), transparent 70%), radial-gradient(30% 35% at 15% 30%, rgba(139, 92, 246, 0.22), transparent 70%), radial-gradient(30% 35% at 85% 80%, rgba(64, 111, 197, 0.22), transparent 70%);
  pointer-events: none;
}
.mobile-section__div-5 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  padding: 0px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
.mobile-section__span-6 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.mobile-section__h2-7 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.08;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
}
.mobile-section__p-8 {
  margin: 0px;
  color: rgb(154, 154, 165);
  font-size: 17px;
  line-height: 1.7;
  max-width: none;
}
.mobile-section__p-9 {
  margin: 0px;
  color: rgb(200, 200, 210);
  font-size: 15px;
  line-height: 1.6;
}
.mobile-section__strong-10 {
  color: rgb(255, 255, 255);
}
.mobile-section__div-11 {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}
.mobile-section__span-12 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 14px;
  font-weight: 600;
  color: rgb(228, 228, 234);
}
.mobile-section__span-13 {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: rgba(124, 140, 255, 0.16);
  display: grid;
  place-items: center;
}
.mobile-section__div-14 {
  position: relative;
  margin-top: 56px;
  display: flex;
  gap: 28px;
  justify-content: center;
  align-items: center;
  overflow-x: auto;
  padding: 24px 24px 40px;
  scrollbar-width: none;
}
.mobile-section__figure-15 {
  margin: 0px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: center;
}
.mobile-section__div-16 {
  width: 200px;
  border-radius: 34px;
  padding: 7px;
  background: rgb(28, 28, 38);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: rgba(0, 0, 0, 0.55) 0px 40px 80px;
}
.mobile-section__img-17 {
  width: 100%;
  aspect-ratio: 300 / 648;
  object-fit: cover;
  object-position: center top;
  border-radius: 28px;
}
.mobile-section__figcaption-18 {
  font-size: 14px;
  font-weight: 600;
  color: rgb(200, 200, 210);
}
.mobile-section__div-19 {
  width: 220px;
  border-radius: 34px;
  padding: 7px;
  background: rgb(28, 28, 38);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: rgba(0, 0, 0, 0.55) 0px 40px 80px;
}
.mobile-section__div-20 {
  width: 250px;
  border-radius: 34px;
  padding: 7px;
  background: rgb(28, 28, 38);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: rgba(0, 0, 0, 0.55) 0px 40px 80px;
}

/* ===== Accounts, security & platform — .security-platform-section ===== */
.security-platform-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: rgb(241, 244, 245);
  color: rgb(11, 11, 15);
}
.security-platform-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: radial-gradient(rgba(79, 107, 232, 0.16) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: radial-gradient(60% 50% at 50% 45%, rgb(0, 0, 0) 20%, transparent 80%);
  pointer-events: none;
}
.security-platform-section__div-2 {
  position: absolute;
  left: 50%;
  top: 0px;
  width: min(900px, 120vw);
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -55%);
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 120, 255, 0.2), transparent);
  pointer-events: none;
}
.security-platform-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.security-platform-section__div-4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
}
.security-platform-section__span-5 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(79, 107, 232);
}
.security-platform-section__h2-6 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
  max-width: 760px;
}
.security-platform-section__p-7 {
  margin: 0px;
  color: rgb(91, 94, 107);
  font-size: 17px;
  line-height: 1.7;
  max-width: 560px;
  text-wrap: pretty;
}
.security-platform-section__div-8 {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
}
.security-platform-section__div-9 {
  flex: 3 1 460px;
  border-radius: 24px;
  padding: clamp(24px, 3vw, 34px);
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  box-shadow: rgba(20, 24, 60, 0.2) 0px 30px 80px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0px;
}
.security-platform-section__div-10 {
  position: absolute;
  right: -100px;
  top: -100px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 110, 255, 0.35), transparent);
  pointer-events: none;
}
.security-platform-section__div-11 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
}
.security-platform-section__span-12 {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgb(79, 123, 255), rgb(139, 92, 246));
  display: grid;
  place-items: center;
  box-shadow: rgba(91, 108, 255, 0.35) 0px 10px 24px;
}
.security-platform-section__span-13 {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.security-platform-section__h3-14 {
  margin: 0px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.security-platform-section__span-15 {
  font-size: 14px;
  color: rgb(154, 154, 165);
}
.security-platform-section__div-16 {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.security-platform-section__div-17 {
  flex: 1 1 240px;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.security-platform-section__div-18 {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.security-platform-section__span-19 {
  font-size: 11px;
  font-weight: 600;
  color: rgb(138, 141, 153);
}
.security-platform-section__div-20 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 14px;
  color: rgb(228, 228, 234);
}
.security-platform-section__span-21 {
  letter-spacing: 0.2em;
}
.security-platform-section__span-22 {
  font-size: 11px;
  font-weight: 600;
  color: rgb(143, 227, 168);
}
.security-platform-section__div-23 {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(124, 140, 255, 0.1);
  border: 1px dashed rgba(143, 168, 255, 0.3);
  font-size: 11px;
  line-height: 1.5;
  color: rgb(175, 192, 255);
  word-break: break-all;
}
.security-platform-section__span-24 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgb(255, 197, 138);
}
.security-platform-section__div-25 {
  flex: 1 1 240px;
  min-width: 0px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  justify-content: center;
}
.security-platform-section__div-26 {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 12px;
  align-items: start;
}
.security-platform-section__span-27 {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(124, 140, 255, 0.14);
  border: 1px solid rgba(143, 168, 255, 0.22);
  display: grid;
  place-items: center;
}
.security-platform-section__strong-28 {
  font-size: 15px;
}
.security-platform-section__span-29 {
  font-size: 13px;
  line-height: 1.55;
  color: rgb(154, 154, 165);
}
.security-platform-section__div-30 {
  flex: 2 1 340px;
  border-radius: 24px;
  padding: clamp(24px, 3vw, 34px);
  background: rgb(15, 15, 22);
  color: rgb(255, 255, 255);
  box-shadow: rgba(20, 24, 60, 0.2) 0px 30px 80px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0px;
}
.security-platform-section__div-31 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.security-platform-section__span-32 {
  display: flex;
  align-items: center;
  gap: 14px;
}
.security-platform-section__div-33 {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 6px 18px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.security-platform-section__div-34 {
  position: relative;
  display: grid;
  grid-template-columns: 32px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0px;
}
.security-platform-section__span-35 {
  position: absolute;
  left: 15px;
  top: 44px;
  bottom: -12px;
  width: 2px;
  background: rgba(255, 255, 255, 0.08);
}
.security-platform-section__span-36 {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgb(59, 75, 216);
  display: grid;
  place-items: center;
}
.security-platform-section__span-37 {
  display: flex;
  flex-direction: column;
  min-width: 0px;
}
.security-platform-section__strong-38 {
  font-size: 14px;
}
.security-platform-section__span-39 {
  font-size: 12px;
  color: rgb(138, 141, 153);
}
.security-platform-section__span-40 {
  font-size: 12px;
  color: rgb(138, 141, 153);
  white-space: nowrap;
}
.security-platform-section__span-41 {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgb(106, 79, 216);
  display: grid;
  place-items: center;
}
.security-platform-section__span-42 {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgb(30, 138, 76);
  display: grid;
  place-items: center;
}
.security-platform-section__span-43 {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgb(196, 98, 46);
  display: grid;
  place-items: center;
}
.security-platform-section__div-44 {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: clamp(24px, 3vw, 36px);
  background: linear-gradient(135deg, rgb(62, 75, 255) 0%, rgb(106, 79, 240) 55%, rgb(42, 31, 107) 100%);
  color: rgb(255, 255, 255);
  box-shadow: rgba(91, 80, 255, 0.28) 0px 40px 100px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.security-platform-section__div-45 {
  position: absolute;
  right: -120px;
  top: -160px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.18);
  pointer-events: none;
}
.security-platform-section__div-46 {
  position: absolute;
  right: -60px;
  top: -100px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.14);
  pointer-events: none;
}
.security-platform-section__div-47 {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px 32px;
}
.security-platform-section__span-48 {
  font-size: 12px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.75);
}
.security-platform-section__h3-49 {
  margin: 0px;
  font-size: clamp(24px, 2.6vw, 32px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 800;
}
.security-platform-section__div-50 {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.security-platform-section__div-51 {
  flex: 1 1 240px;
  min-width: 0px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(10px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: transform 0.3s, background 0.3s;
}
.security-platform-section__div-51:hover {
  transform: translateY(-4px) !important;
  background: rgba(255, 255, 255, 0.16) !important;
}
.security-platform-section__div-52 {
  height: 128px;
  display: grid;
  place-items: center;
  padding: 16px;
}
.security-platform-section__div-53 {
  width: 100%;
  max-width: 230px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.security-platform-section__div-54 {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
  box-shadow: rgba(10, 10, 40, 0.3) 0px 14px 30px;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
}
.security-platform-section__span-55 {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgb(15, 15, 22);
  display: grid;
  place-items: center;
}
.security-platform-section__img-56 {
  width: 14px;
  height: 14px;
}
.security-platform-section__strong-57 {
  font-size: 12px;
}
.security-platform-section__span-58 {
  font-size: 11px;
  color: rgb(91, 94, 107);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.security-platform-section__span-59 {
  font-size: 10px;
  color: rgb(154, 157, 170);
}
.security-platform-section__div-60 {
  margin: 0px 10px;
  height: 10px;
  border-radius: 0px 0px 10px 10px;
  background: rgba(255, 255, 255, 0.45);
}
.security-platform-section__div-61 {
  padding: 0px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.security-platform-section__span-62 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.security-platform-section__span-63 {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.18);
  display: grid;
  place-items: center;
}
.security-platform-section__strong-64 {
  font-size: 16px;
}
.security-platform-section__span-65 {
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.8);
}
.security-platform-section__div-66 {
  width: 100%;
  max-width: 230px;
  padding: 12px;
  border-radius: 14px;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
  box-shadow: rgba(10, 10, 40, 0.3) 0px 14px 30px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.security-platform-section__span-67 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: linear-gradient(135deg, rgb(62, 75, 255), rgb(139, 92, 246));
  display: grid;
  place-items: center;
}
.security-platform-section__img-68 {
  width: 20px;
  height: 20px;
}
.security-platform-section__span-69 {
  flex: 1 1 0%;
  min-width: 0px;
  display: flex;
  flex-direction: column;
}
.security-platform-section__span-70 {
  font-size: 11px;
  color: rgb(30, 138, 76);
  font-weight: 600;
}
.security-platform-section__span-71 {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 7px 10px;
  border-radius: 8px;
  background: rgb(11, 11, 15);
  color: rgb(255, 255, 255);
  font-size: 11px;
  font-weight: 600;
}
.security-platform-section__div-72 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.security-platform-section__div-73 {
  display: flex;
  gap: 6px;
}
.security-platform-section__span-74 {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgb(79, 107, 232);
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(10, 10, 40, 0.25) 0px 6px 14px;
}
.security-platform-section__span-75 {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgb(15, 15, 22);
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(10, 10, 40, 0.25) 0px 6px 14px;
}
.security-platform-section__span-76 {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgb(30, 138, 76);
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(10, 10, 40, 0.25) 0px 6px 14px;
}
.security-platform-section__span-77 {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgb(224, 102, 58);
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(10, 10, 40, 0.25) 0px 6px 14px;
}
.security-platform-section__span-78 {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgb(242, 201, 76);
  border: 3px solid rgb(255, 255, 255);
  box-shadow: rgba(10, 10, 40, 0.25) 0px 6px 14px;
}
.security-platform-section__span-79 {
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: rgb(58, 61, 74);
  font-size: 11px;
  font-weight: 600;
}

/* ===== Technology — .technology-section ===== */
.technology-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: linear-gradient(rgb(11, 11, 15) 0%, rgb(16, 16, 42) 50%, rgb(11, 11, 15) 100%);
  color: rgb(255, 255, 255);
}
.technology-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: radial-gradient(55% 60%, rgb(0, 0, 0) 20%, transparent 80%);
  pointer-events: none;
}
.technology-section__div-2 {
  position: absolute;
  inset: 0px;
  background: radial-gradient(40% 50% at 70% 40%, rgba(91, 108, 255, 0.22), transparent 70%), radial-gradient(25% 35% at 10% 85%, rgba(139, 92, 246, 0.16), transparent 70%);
  pointer-events: none;
}
.technology-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.technology-section__div-4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
}
.technology-section__span-5 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(143, 168, 255);
}
.technology-section__h2-6 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
  max-width: 760px;
}
.technology-section__span-7 {
  background: linear-gradient(90deg, rgb(110, 139, 255), rgb(167, 123, 255)) text;
  color: transparent;
}
.technology-section__p-8 {
  margin: 0px;
  color: rgb(154, 154, 165);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
  max-width: 560px;
}
.technology-section__div-9 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
  gap: 16px;
}
.technology-section__div-10 {
  padding: 24px;
  border-radius: 18px;
  background: rgba(18, 18, 26, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  gap: 18px;
  transition: border-color 0.3s, transform 0.3s;
}
.technology-section__div-10:hover {
  border-color: rgba(143, 168, 255, 0.4) !important;
  transform: translateY(-4px) !important;
}
.technology-section__span-11 {
  display: flex;
  align-items: center;
  gap: 12px;
}
.technology-section__span-12 {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: rgba(124, 140, 255, 0.14);
  border: 1px solid rgba(143, 168, 255, 0.22);
  display: grid;
  place-items: center;
}
.technology-section__strong-13 {
  font-size: 16px;
}
.technology-section__div-14 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.technology-section__span-15 {
  padding: 7px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 13px;
  font-weight: 500;
  color: rgb(228, 228, 234);
}

/* ===== Make it your own — .modify-with-section ===== */
.modify-with-section {
  scroll-margin-top: 72px;
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 9vw, 120px) 24px;
  background: rgb(255, 255, 255);
  color: rgb(11, 11, 15);
}
.modify-with-section__div-1 {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(rgba(79, 107, 232, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 107, 232, 0.07) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(65% 55% at 50% 55%, rgb(0, 0, 0) 25%, transparent 85%);
  pointer-events: none;
}
.modify-with-section__div-2 {
  position: absolute;
  right: -12%;
  top: -20%;
  width: 50%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(110, 120, 255, 0.18), transparent);
  pointer-events: none;
}
.modify-with-section__div-3 {
  position: relative;
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.modify-with-section__div-4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
}
.modify-with-section__span-5 {
  font-size: 13px;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: rgb(79, 107, 232);
}
.modify-with-section__h2-6 {
  margin: 0px;
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 800;
  text-wrap: balance;
  max-width: 760px;
}
.modify-with-section__p-7 {
  margin: 0px;
  color: rgb(91, 94, 107);
  font-size: 17px;
  line-height: 1.7;
  text-wrap: pretty;
  max-width: 560px;
}
.modify-with-section__div-8 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 16px;
  max-width: 760px;
  width: 100%;
  margin: 0px auto;
}
.modify-with-section__div-9 {
  padding: 18px 20px;
  border-radius: 16px;
  background: rgb(255, 255, 255);
  border: 1px solid rgba(15, 20, 40, 0.06);
  box-shadow: rgba(20, 24, 60, 0.06) 0px 10px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.modify-with-section__div-9:hover {
  transform: translateY(-4px) !important;
  box-shadow: rgba(40, 50, 140, 0.12) 0px 24px 60px !important;
}
.modify-with-section__div-10 {
  width: 100%;
  height: 96px;
  display: grid;
  place-items: center;
}
.modify-with-section__img-11 {
  max-width: 92px;
  max-height: 96px;
  width: auto;
  height: auto;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.modify-with-section__span-12 {
  font-size: 14px;
  color: rgb(91, 94, 107);
}
.modify-with-section__img-13 {
  max-width: 140px;
  max-height: 96px;
  width: auto;
  height: auto;
  object-fit: contain;
  mix-blend-mode: multiply;
}

/* ===== Footer (landing) — .footer-section ===== */
.footer-section {
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#0B0B0F 0%,#0E0E22 100%);
  padding:clamp(56px,7vw,88px) 24px 28px;
}
.footer-section__div-1 {
  position:absolute;
  left:50%;
  top:-240px;
  width:min(1000px,120vw);
  height:480px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(closest-side,rgba(91,108,255,.22),transparent);
  pointer-events:none;
}
.footer-section__div-2 {
  position:relative;
  max-width:1200px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:clamp(40px,5vw,64px);
}
.footer-section__div-3 {
  position:relative;
  overflow:hidden;
  border-radius:24px;
  padding:clamp(28px,4vw,48px);
  background:linear-gradient(135deg,#3E4BFF 0%,#6A4FF0 55%,#2A1F6B 100%);
  box-shadow:0 40px 100px rgba(91,80,255,.28);
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:24px 40px;
}
.footer-section__div-4 {
  position:absolute;
  right:-120px;
  top:-160px;
  width:420px;
  height:420px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  pointer-events:none;
}
.footer-section__div-5 {
  position:absolute;
  right:-50px;
  top:-90px;
  width:280px;
  height:280px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  pointer-events:none;
}
.footer-section__div-6 {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  max-width:560px;
}
.footer-section__h2-7 {
  margin:0;
  font-size:clamp(28px,3.4vw,42px);
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:800;
  color:#fff;
  text-wrap:balance;
}
.footer-section__p-8 {
  margin:0;
  font-size:16px;
  line-height:1.6;
  color:rgba(255,255,255,.85);
}
.footer-section__div-9 {
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.footer-section__a-10 {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 26px;
  border-radius:10px;
  background:#fff;
  color:#0B0B0F;
  font-weight:700;
  font-size:15px;
  transition:transform .2s,box-shadow .2s;
}
.footer-section__a-10:hover {
  transform:translateY(-2px) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.25) !important;
  color:#0B0B0F !important;
}
.footer-section__a-11 {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 22px;
  border-radius:10px;
  border:1.5px solid rgba(255,255,255,.5);
  color:#fff;
  font-weight:600;
  font-size:15px;
  transition:transform .2s,background .2s;
}
.footer-section__a-11:hover {
  transform:translateY(-2px) !important;
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
}
.footer-section__img-12 {
  height:18px;
  width:auto;
}
.footer-section__div-13 {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
  gap:36px 32px;
}
.footer-section__div-14 {
  display:flex;
  flex-direction:column;
  gap:16px;
  min-width:0;
  grid-column:span 2;
}
.footer-section__img-15 {
  height:36px;
  width:auto;
  align-self:flex-start;
}
.footer-section__p-16 {
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:#9A9AA5;
  max-width:340px;
}
.footer-section__div-17 {
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
}
.footer-section__span-18 {
  font-size:12px;
  letter-spacing:.14em;
  font-weight:700;
  color:#8FA8FF;
}
.footer-section__a-19 {
  color:#A8A8B3;
  font-size:14px;
  transition:color .2s;
}
.footer-section__a-19:hover {
  color:#fff !important;
}
.footer-section__div-20 {
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:13px;
  color:#6B6B78;
}
.footer-section__span-21 {
  display:flex;
  align-items:center;
  gap:20px;
}
.footer-section__a-22 {
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(135deg,#4F7BFF,#8B5CF6);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:18px;
  font-weight:700;
  box-shadow:0 10px 26px rgba(91,108,255,.45);
  transition:transform .2s,box-shadow .2s;
}
.footer-section__a-22:hover {
  transform:translateY(-3px) !important;
  box-shadow:0 14px 34px rgba(91,108,255,.6) !important;
  color:#fff !important;
}

/* ===== Gallery lightbox — .lightbox-section ===== */
.lightbox-section {
  position:fixed;
  inset:0;
  z-index:100;
  background:rgba(5,5,10,.86);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(16px,4vw,56px);
}
.lightbox-section__div-1 {
  position:relative;
  width:min(1180px,100%);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.lightbox-section__div-2 {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.lightbox-section__span-3 {
  display:flex;
  flex-direction:column;
  gap:2px;
}
.lightbox-section__strong-4 {
  font-size:18px;
}
.lightbox-section__span-5 {
  font:500 12px 'Poppins',sans-serif;
  color:#9A9AA5;
}
.lightbox-section__span-6 {
  display:flex;
  gap:8px;
}
.lightbox-section__button-7 {
  width:44px;
  height:44px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.16);
  background:#15151C;
  color:#fff;
  font-size:18px;
  cursor:pointer;
}
.lightbox-section__button-7:hover {
  border-color:#7C8CFF !important;
}
.lightbox-section__button-8 {
  width:44px;
  height:44px;
  border-radius:10px;
  border:none;
  background:linear-gradient(135deg,#4F7BFF,#8B5CF6);
  color:#fff;
  font-size:18px;
  cursor:pointer;
}
.lightbox-section__img-9 {
  width:100%;
  max-height:78vh;
  object-fit:contain;
  border-radius:14px;
  background:#fff;
  box-shadow:0 40px 120px rgba(0,0,0,.6);
}