.nfc-glass{
  position:relative;
  border-radius:var(--glass-radius,var(--nfc-radius-lg));
  background:
    linear-gradient(180deg, rgba(255,255,255,var(--glass-top,.122)), rgba(255,255,255,var(--glass-bottom,.052)));
  border:1px solid rgba(255,255,255,var(--glass-border,.13));
  box-shadow:
    0 26px 90px rgba(0,0,0,var(--glass-shadow,.34)),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(var(--glass-blur,28px)) saturate(170%) brightness(1.08);
  -webkit-backdrop-filter:blur(var(--glass-blur,28px)) saturate(170%) brightness(1.08);
  overflow:hidden;
}
.nfc-glass::before{
  content:"";
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);
  opacity:.9;
  pointer-events:none;
}
.nfc-glass::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(320px circle at var(--shine-x,22%) var(--shine-y,0%), rgba(255,255,255,.18), rgba(255,255,255,.072) 22%, transparent 48%),
    radial-gradient(140px circle at 86% 12%, rgba(255,255,255,.09), transparent 55%),
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 26%,transparent 70%,rgba(255,255,255,.025));
}
.nfc-glass--deep{
  --glass-top:.082;
  --glass-bottom:.04;
  --glass-border:.105;
  --glass-shadow:.42;
}
.nfc-glass--bright{
  --glass-top:.16;
  --glass-bottom:.07;
  --glass-border:.18;
}
.nfc-glass--thin{
  --glass-top:.075;
  --glass-bottom:.035;
  --glass-border:.1;
  --glass-blur:22px;
}
.nfc-motion{
  transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.nfc-motion:hover{
  border-color:rgba(255,255,255,.19);
  box-shadow:
    0 32px 100px rgba(0,0,0,.42),
    0 0 0 1px rgba(155,122,255,.12),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.nfc-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:48px;
  padding:0 21px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  overflow:hidden;
}
.nfc-btn:hover{transform:translateY(-1px)}
.nfc-btn--primary{
  color:#fff;
  background:linear-gradient(180deg,#b99bff 0%,#8a52ff 20%,#7b3dff 60%,#6b30ed 100%);
  box-shadow:0 14px 36px rgba(123,61,255,.38), inset 0 1px 0 rgba(255,255,255,.28);
}
.nfc-btn--primary::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(160px circle at 25% 0%,rgba(255,255,255,.32),transparent 42%);
}
.nfc-btn--secondary{
  color:rgba(255,255,255,.84);
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.058));
  border-color:rgba(255,255,255,.13);
  backdrop-filter:blur(20px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.11);
}
.nfc-btn--ghost{
  color:rgba(232,237,255,.7);
  background:transparent;
  border-color:rgba(255,255,255,.12);
}
.nfc-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 13px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  color:rgba(232,237,255,.68);
  background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.105);
  backdrop-filter:blur(18px) saturate(150%);
}
.nfc-chip__dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--nfc-purple-2);
  box-shadow:0 0 16px rgba(157,116,255,.8);
}
.nfc-icon{
  width:42px;height:42px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.11);
}
.nfc-icon svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:900px){
  .nfc-motion{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}


/* v4.1: dynamic, but no "mouse flashlight" */
.nfc-spotlight{
  opacity:.16!important;
  background:
    radial-gradient(900px circle at 50% 18%, rgba(255,255,255,.028), transparent 58%),
    radial-gradient(620px circle at var(--mouse-x) var(--mouse-y), rgba(167,132,255,.026), transparent 62%)!important;
}

.nfc-btn--wa{
  color:#fff;
  background:
    radial-gradient(130px circle at 22% 0%, rgba(255,255,255,.25), transparent 44%),
    linear-gradient(180deg, rgba(65,224,128,.95), rgba(35,185,96,.90) 46%, rgba(22,148,76,.92));
  border-color:rgba(133,255,182,.20);
  box-shadow:0 14px 36px rgba(35,185,96,.28), inset 0 1px 0 rgba(255,255,255,.26);
}
.nfc-btn--wa:hover{box-shadow:0 18px 44px rgba(35,185,96,.36), inset 0 1px 0 rgba(255,255,255,.30)}
.nfc-btn--brand{
  color:#fff;
  background:
    radial-gradient(130px circle at 22% 0%, rgba(255,255,255,.25), transparent 44%),
    linear-gradient(180deg, #b99bff 0%, #8a52ff 18%, #7b3dff 62%, #6b30ed 100%);
  box-shadow:0 14px 36px rgba(123,61,255,.34), inset 0 1px 0 rgba(255,255,255,.24);
}
