/* ===== Digital Business Card v2 ===== */
.card-preview {
  --card-primary:#d4af37; --card-bg:#0c0c0e; --card-surface:#121214; --card-overlay:.45;
  min-height:100%; display:grid; place-items:start center; padding:40px;
  background:radial-gradient(circle at 50% 0%, color-mix(in srgb,var(--card-primary) 10%,transparent), transparent 34%), var(--card-bg);
}
.digital-card { position:relative; isolation:isolate; width:min(100%,430px); overflow:hidden; border:1px solid rgba(255,255,255,.09); border-radius:30px; background:var(--card-surface); box-shadow:0 30px 80px rgba(0,0,0,.30); }
.digital-card--image { background:#101012; }
.digital-card__background { position:absolute; inset:0; z-index:-2; background-image:var(--card-bg-image); background-size:cover; background-position:center; transform:scale(1.02); }
.digital-card--image::after { content:""; position:absolute; inset:0; z-index:-1; background:rgba(0,0,0,var(--card-overlay)); pointer-events:none; }
.digital-card__content { position:relative; z-index:1; }
.digital-card__top { padding:26px 24px 22px; display:grid; grid-template-columns:92px minmax(0,1fr); gap:18px; align-items:center; }
.digital-card__photo { width:92px; height:112px; overflow:hidden; border-radius:24px; border:1px solid color-mix(in srgb,var(--card-primary) 40%,transparent); background:color-mix(in srgb,var(--card-primary) 10%,transparent); display:grid; place-items:center; color:var(--card-primary); font-size:2.2rem; font-weight:700; box-shadow:0 10px 30px rgba(0,0,0,.18); }
.digital-card__photo img { width:100%; height:100%; display:block; object-fit:cover; }
.digital-card__eyebrow { margin:0 0 8px; color:var(--card-primary); font-size:.68rem; font-weight:700; letter-spacing:.15em; }
.digital-card__identity h1 { margin:0; color:#fff; font-size:1.65rem; line-height:1.05; letter-spacing:-.035em; text-shadow:0 2px 14px rgba(0,0,0,.2); }
.digital-card__role,.digital-card__business { margin:8px 0 0; color:rgba(255,255,255,.72); line-height:1.4; font-size:.88rem; }
.digital-card__business { color:rgba(255,255,255,.90); font-weight:600; }
.digital-card__actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:0 24px 18px; }
.digital-card__actions a,.digital-card__save { min-height:44px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-size:.82rem; font-weight:700; }
.digital-card__actions a { border:1px solid rgba(255,255,255,.12); color:#fff; background:rgba(15,15,17,.48); backdrop-filter:blur(9px); }
.digital-card__actions a:hover { border-color:color-mix(in srgb,var(--card-primary) 58%,transparent); }
.digital-card__social { display:flex; flex-wrap:wrap; gap:8px; padding:0 24px 18px; }
.digital-card__social a { padding:9px 12px; border:1px solid rgba(255,255,255,.10); border-radius:999px; color:rgba(255,255,255,.76); background:rgba(15,15,17,.34); backdrop-filter:blur(8px); text-decoration:none; font-size:.76rem; }
.digital-card__social a:hover { color:var(--card-primary); border-color:color-mix(in srgb,var(--card-primary) 48%,transparent); }
.digital-card__save { width:calc(100% - 48px); margin:0 24px 22px; border:0; background:var(--card-primary); color:#0b0b0c; cursor:pointer; }
.digital-card__footer { padding:16px 24px 20px; border-top:1px solid rgba(255,255,255,.08); text-align:center; color:rgba(255,255,255,.44); font-size:.72rem; background:rgba(8,8,10,.14); backdrop-filter:blur(8px); }
.digital-card__footer a { color:rgba(255,255,255,.66); text-decoration:none; font-weight:600; }
.preview-frame[data-device="mobile"] .card-preview { padding:18px; }
.preview-frame[data-device="mobile"] .digital-card { width:100%; }
.preview-frame[data-device="mobile"] .digital-card__top { grid-template-columns:82px minmax(0,1fr); padding:22px 18px 18px; }
.preview-frame[data-device="mobile"] .digital-card__photo { width:82px; height:100px; border-radius:20px; }
.preview-frame[data-device="mobile"] .digital-card__actions { grid-template-columns:1fr; padding-left:18px; padding-right:18px; }
.preview-frame[data-device="mobile"] .digital-card__social { padding-left:18px; padding-right:18px; }
.preview-frame[data-device="mobile"] .digital-card__save { width:calc(100% - 36px); margin-left:18px; margin-right:18px; }