/* =========================================================
   iOS 26 Liquid Glass Premium Override - Clean Text Edition
   ========================================================= */
:root{
  --lg-milk: rgba(235,248,255,.22);
  --lg-milk-2: rgba(255,255,255,.13);
  --lg-border: rgba(236,252,255,.42);
  --lg-border-soft: rgba(255,255,255,.24);
  --lg-cyan: #8FEFFF;
  --lg-blue: #5EA9FF;
  --lg-violet: #A979FF;
  --lg-pink: #EF72FF;
  --lg-gold: #FFE3A3;
  --lg-ink: #F8FDFF;
}

body{
  background:
    radial-gradient(1050px 680px at 12% 6%, rgba(143,239,255,.26), transparent 62%),
    radial-gradient(920px 640px at 89% 12%, rgba(169,121,255,.34), transparent 60%),
    radial-gradient(780px 580px at 52% 100%, rgba(255,227,163,.16), transparent 66%),
    linear-gradient(145deg,#050713 0%,#071528 38%,#14102a 68%,#080913 100%) !important;
}

body::before{
  opacity:.115 !important;
  background-size:92px 92px !important;
  mask-image:radial-gradient(circle at center, #000 0 46%, transparent 84%) !important;
}

.shell{
  background:
    linear-gradient(145deg, rgba(255,255,255,.70), rgba(255,255,255,.10) 26%, rgba(143,239,255,.42) 48%, rgba(169,121,255,.46) 72%, rgba(255,227,163,.28)),
    linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.035)) !important;
  box-shadow:
    0 42px 120px rgba(0,0,0,.52),
    0 0 92px rgba(94,169,255,.18),
    0 0 110px rgba(169,121,255,.16),
    inset 0 1px 0 rgba(255,255,255,.58) !important;
}

.shell::before{
  background:linear-gradient(120deg,rgba(143,239,255,.34),rgba(255,227,163,.16),rgba(169,121,255,.35)) !important;
  filter:blur(30px) !important;
  opacity:.66 !important;
}

.card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.245), rgba(255,255,255,.078) 48%, rgba(255,255,255,.112)),
    radial-gradient(680px 360px at 50% -8%, rgba(255,255,255,.24), transparent 66%),
    radial-gradient(650px 420px at 12% 18%, rgba(143,239,255,.22), transparent 72%),
    radial-gradient(650px 420px at 88% 20%, rgba(169,121,255,.24), transparent 74%),
    rgba(7,12,28,.38) !important;
  border:1px solid rgba(236,252,255,.34) !important;
  backdrop-filter:blur(42px) saturate(210%) brightness(1.05) !important;
  -webkit-backdrop-filter:blur(42px) saturate(210%) brightness(1.05) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 -1px 0 rgba(255,255,255,.14),
    inset 18px 0 55px rgba(255,255,255,.035),
    inset -18px 0 55px rgba(143,239,255,.055),
    0 30px 82px rgba(0,0,0,.30) !important;
}

.card::before{
  opacity:.55 !important;
  background:
    linear-gradient(120deg, transparent 0 28%, rgba(255,255,255,.105) 36%, transparent 48%),
    radial-gradient(520px 260px at 18% 18%, rgba(143,239,255,.12), transparent 72%),
    radial-gradient(520px 260px at 84% 20%, rgba(169,121,255,.12), transparent 74%) !important;
}
.card::after{opacity:.045 !important;}

.name{
  background:linear-gradient(110deg,#fff 0%,var(--lg-gold) 28%,var(--lg-cyan) 55%,var(--lg-violet) 78%,#fff 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  text-shadow:0 14px 42px rgba(0,0,0,.24) !important;
}
.role,.section-title,footer{color:rgba(248,253,255,.74) !important;}

.intro,
.cta,
.social a,
.chip,
#toTop{
  -webkit-tap-highlight-color:transparent;
  will-change:transform, box-shadow, background;
}

.intro{
  background:
    linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.075)),
    linear-gradient(120deg, rgba(143,239,255,.22), rgba(94,169,255,.16), rgba(169,121,255,.18)) !important;
  border:1px solid rgba(236,252,255,.38) !important;
  color:rgba(255,255,255,.94) !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -18px 34px rgba(0,0,0,.10),
    inset 0 0 0 1px rgba(255,255,255,.07) !important;
  backdrop-filter:blur(30px) saturate(210%) !important;
  -webkit-backdrop-filter:blur(30px) saturate(210%) !important;
}

.social{
  padding:8px 10px;
  border-radius:30px;
  background:linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.04));
  border:1px solid rgba(236,252,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32), 0 14px 38px rgba(0,0,0,.18);
  backdrop-filter:blur(26px) saturate(190%);
  -webkit-backdrop-filter:blur(26px) saturate(190%);
}

.social a{
  border-color:rgba(255,255,255,.36) !important;
  box-shadow:
    0 15px 32px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.46),
    inset 0 -14px 24px rgba(0,0,0,.15) !important;
  transition:transform .18s cubic-bezier(.2,.9,.2,1), box-shadow .18s ease, filter .18s ease !important;
}
.social a:active{
  transform:scale(.90) translateY(2px) !important;
  filter:brightness(1.18) saturate(1.12) !important;
  box-shadow:
    0 8px 22px rgba(0,0,0,.28),
    inset 0 2px 12px rgba(255,255,255,.32),
    inset 0 -8px 18px rgba(0,0,0,.22) !important;
}

.cta{
  background:
    linear-gradient(145deg,rgba(255,255,255,.255),rgba(255,255,255,.075) 43%,rgba(255,255,255,.145)),
    linear-gradient(135deg,rgba(143,239,255,.30),rgba(94,169,255,.32),rgba(169,121,255,.34)) !important;
  border:1px solid rgba(236,252,255,.40) !important;
  box-shadow:
    0 22px 58px rgba(0,0,0,.32),
    0 0 38px rgba(143,239,255,.11),
    inset 0 1px 0 rgba(255,255,255,.52),
    inset 0 -18px 34px rgba(0,0,0,.11),
    inset 0 0 0 1px rgba(255,255,255,.07) !important;
  backdrop-filter:blur(34px) saturate(220%) brightness(1.08) !important;
  -webkit-backdrop-filter:blur(34px) saturate(220%) brightness(1.08) !important;
  transition:transform .18s cubic-bezier(.2,.9,.2,1), box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}
.cta::before{
  opacity:.56 !important;
  background:
    radial-gradient(180px 75px at var(--mx, 20%) var(--my, 0%), rgba(255,255,255,.44), transparent 72%),
    linear-gradient(115deg,transparent 0 30%,rgba(255,255,255,.20) 43%,transparent 58%) !important;
  translate:0 0 !important;
}
.cta:hover{
  transform:translateY(-3px) scale(1.01) !important;
  border-color:rgba(255,227,163,.42) !important;
  box-shadow:
    0 28px 68px rgba(0,0,0,.38),
    0 0 42px rgba(143,239,255,.16),
    inset 0 1px 0 rgba(255,255,255,.60),
    inset 0 -16px 34px rgba(0,0,0,.10) !important;
}
.cta:active,
.cta.is-pressing{
  transform:scale(.965) translateY(2px) !important;
  border-color:rgba(255,255,255,.54) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.34),rgba(255,255,255,.10) 45%,rgba(255,255,255,.20)),
    linear-gradient(135deg,rgba(143,239,255,.38),rgba(94,169,255,.36),rgba(169,121,255,.42)) !important;
  box-shadow:
    0 12px 32px rgba(0,0,0,.32),
    inset 0 3px 18px rgba(255,255,255,.26),
    inset 0 -12px 28px rgba(0,0,0,.15) !important;
}
.pay-cta{
  background:
    linear-gradient(145deg,rgba(255,255,255,.27),rgba(255,255,255,.08) 42%,rgba(255,255,255,.15)),
    linear-gradient(135deg,rgba(255,227,163,.18),rgba(143,239,255,.30),rgba(169,121,255,.36)) !important;
}

.chip{
  border-color:rgba(255,255,255,.25) !important;
  filter:saturate(.92) brightness(1.05) !important;
  transition:transform .18s ease, filter .18s ease !important;
}
.chip:active{transform:scale(.96) !important;filter:brightness(1.12) saturate(1.06) !important;}

/* Floating draggable liquid glass bead */
.glass-orb{
  position:fixed;
  left:0;
  top:0;
  width:72px;
  height:72px;
  border-radius:999px;
  z-index:9999;
  opacity:0;
  pointer-events:none;
  transform:translate3d(-50%,-50%,0) scale(.74);
  transition:opacity .18s ease, transform .20s cubic-bezier(.2,.9,.2,1);
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.86), rgba(255,255,255,.20) 28%, transparent 56%),
    radial-gradient(circle at 70% 78%, rgba(143,239,255,.36), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.30), rgba(255,255,255,.08));
  border:1px solid rgba(236,252,255,.58);
  box-shadow:
    0 18px 45px rgba(0,0,0,.34),
    0 0 32px rgba(143,239,255,.20),
    inset 0 1px 1px rgba(255,255,255,.80),
    inset 0 -16px 26px rgba(94,169,255,.14),
    inset 12px 0 22px rgba(255,255,255,.08);
  backdrop-filter:blur(20px) saturate(230%) brightness(1.14);
  -webkit-backdrop-filter:blur(20px) saturate(230%) brightness(1.14);
}
.glass-orb::before{
  content:"";
  position:absolute;
  inset:9px 14px 36px 14px;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.04));
  filter:blur(.2px);
  opacity:.74;
}
.glass-orb::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  border:1px solid rgba(255,255,255,.30);
  box-shadow:inset 0 0 18px rgba(255,255,255,.10);
}
.glass-orb.show{
  opacity:1;
  transform:translate3d(-50%,-50%,0) scale(1);
}
.glass-orb.over-link{
  width:82px;
  height:82px;
  box-shadow:
    0 22px 58px rgba(0,0,0,.38),
    0 0 45px rgba(255,227,163,.26),
    0 0 32px rgba(143,239,255,.22),
    inset 0 1px 1px rgba(255,255,255,.86),
    inset 0 -16px 26px rgba(169,121,255,.18);
}
.orb-targeting{
  outline:1px solid rgba(255,227,163,.58) !important;
  box-shadow:
    0 26px 62px rgba(0,0,0,.40),
    0 0 34px rgba(255,227,163,.24),
    inset 0 1px 0 rgba(255,255,255,.58) !important;
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important;}
}


/* RazahPAY action icons fixed size */
.cta img{
  width:35px !important;
  height:35px !important;
  min-width:35px !important;
  min-height:35px !important;
  border-radius:10px;
}
.cta svg{
  width:28px;
  height:28px;
}
@media(max-width:620px){
  .cta img{
  width:35px !important;
  height:35px !important;
  min-width:35px !important;
  min-height:35px !important;
  border-radius:10px;
}
}
