:root{
  --brand:#4f46e5; --brand-2:#7c3aed;
  --ink:#0d1224; --muted:#6b7280; --line:#e8eaf2; --soft:#f7f8fc;
  --gold-1:#f59e0b; --gold-2:#d97706; --gold-soft:#fff7e6; --gold-ink:#7c4a03;
  --premium-1:#7c3aed; --premium-soft:#f3ecff;
  --semi-1:#0ea5e9; --semi-soft:#e6f6ff;
  --danger-soft:#fdecec; --danger-ink:#b42318;
  --success:#12a150; --wa:#25d366;
  --app-1:#14b8a6; --app-2:#0f766e; --app-soft:#e6fbf7; --app-ink:#0f5132;
  --xl-1:#217346; --xl-soft:#e6f2ea; --xl-ink:#14532d;
  --resale-1:#e11d48; --resale-2:#be123c; --resale-soft:#fff1f2; --resale-ink:#881337;
  --email-1:#8b5cf6; --email-2:#6d28d9; --email-soft:#f5f0ff; --email-ink:#4c1d95;
  --geo-1:#0ea5e9; --geo-2:#0369a1; --geo-soft:#e0f2fe; --geo-ink:#0c4a6e;
}
*{ -webkit-font-smoothing:antialiased; }
html{ scroll-behavior:smooth; }
body{ font-family:'Plus Jakarta Sans',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:#fff; overflow-x:hidden; }
.serif{ font-family:'Fraunces',Georgia,serif; font-weight:700; letter-spacing:-.02em; }
h1,h2,h3,h4,h5,h6{ font-weight:800; letter-spacing:-.02em; }
a{ text-decoration:none; }
.text-muted-2{ color:var(--muted)!important; }
.section{ padding:96px 0; }
.section-sm{ padding:64px 0; }

/* ---------- Buttons ---------- */
.btn{ font-weight:700; border-radius:12px; padding:.7rem 1.35rem; transition:.2s; }
.btn-brand{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; border:0; box-shadow:0 10px 24px rgba(79,70,229,.32); }
.btn-brand:hover{ color:#fff; transform:translateY(-1px); box-shadow:0 14px 30px rgba(79,70,229,.42); }
.btn-gold{ background:linear-gradient(135deg,var(--gold-1),var(--gold-2)); color:#3a2400; border:0; box-shadow:0 10px 24px rgba(245,158,11,.32); }
.btn-gold:hover{ color:#3a2400; transform:translateY(-1px); box-shadow:0 14px 30px rgba(245,158,11,.42); }
.btn-app{ background:linear-gradient(135deg,var(--app-1),var(--app-2)); color:#fff; border:0; box-shadow:0 10px 24px rgba(20,184,166,.32); }
.btn-app:hover{ color:#fff; transform:translateY(-1px); }
.btn-resale{ background:linear-gradient(135deg,#fb7185,var(--resale-1)); color:#fff; border:0; box-shadow:0 10px 24px rgba(225,29,72,.32); }
.btn-resale:hover{ color:#fff; transform:translateY(-1px); }
.btn-xl{ background:linear-gradient(135deg,#2f9e57,var(--xl-1)); color:#fff; border:0; box-shadow:0 10px 24px rgba(33,115,70,.28); }
.btn-xl:hover{ color:#fff; transform:translateY(-1px); }
.btn-wa{ background:linear-gradient(135deg,#25d366,#128c7e); color:#fff; border:0; box-shadow:0 10px 24px rgba(37,211,102,.32); }
.btn-wa:hover{ color:#fff; transform:translateY(-1px); }
.btn-email{ background:linear-gradient(135deg,var(--email-1),var(--email-2)); color:#fff; border:0; box-shadow:0 10px 24px rgba(139,92,246,.32); }
.btn-email:hover{ color:#fff; transform:translateY(-1px); }
.btn-geo{ background:linear-gradient(135deg,var(--geo-1),var(--geo-2)); color:#fff; border:0; box-shadow:0 10px 24px rgba(14,165,233,.32); }
.btn-geo:hover{ color:#fff; transform:translateY(-1px); }
.btn-ghost{ background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.22); }
.btn-ghost:hover{ background:rgba(255,255,255,.16); color:#fff; }
.btn-outline-brand{ border:1.5px solid var(--brand); color:var(--brand); background:#fff; }
.btn-outline-brand:hover{ background:var(--brand); color:#fff; }
.btn-outline-app{ border:1.5px solid var(--app-1); color:var(--app-2); background:#fff; }
.btn-outline-app:hover{ background:var(--app-1); color:#fff; }
.btn-outline-resale{ border:1.5px solid var(--resale-1); color:var(--resale-2); background:#fff; }
.btn-outline-resale:hover{ background:var(--resale-1); color:#fff; }
.btn-outline-dark-2{ border:1.5px solid var(--ink); color:var(--ink); background:#fff; }
.btn-outline-dark-2:hover{ background:var(--ink); color:#fff; }

/* ========== SITE HEADER ========== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1050;
}

/* ---------- Topbar ---------- */
.topbar{
  background:#05070f;
  color:rgba(255,255,255,.72);
  font-size:.78rem;
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:.5rem 0;
}
.topbar .container{
  display:flex; justify-content:space-between; align-items:center;
  gap:1rem; flex-wrap:wrap;
}
.topbar-left, .topbar-right{
  display:flex; align-items:center; gap:1rem;
  flex-wrap:wrap;
}
.topbar a{
  color:rgba(255,255,255,.72);
  font-weight:600;
  display:inline-flex; align-items:center; gap:.35rem;
  transition:.2s;
}
.topbar a:hover{ color:#fff; }
.topbar .mdi{ color:var(--gold-1); font-size:.95rem; }
.topbar .divider{
  width:1px; height:14px; background:rgba(255,255,255,.15);
  display:inline-block;
}
.btn-topbar-cta{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff !important;
  padding:.32rem .85rem;
  border-radius:999px;
  font-weight:700 !important;
  font-size:.76rem;
  box-shadow:0 6px 16px rgba(79,70,229,.35);
  transition:.2s;
}
.btn-topbar-cta:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(79,70,229,.5);
}
.btn-topbar-cta .mdi{ color:#fff !important; }
.topbar-login{
  padding:.32rem .85rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  color:#fff !important;
  font-size:.76rem;
  font-weight:700;
  transition:.2s;
}
.topbar-login:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.35);
}

/* ---------- Navbar / Brand ---------- */
.navbar{
  background:rgba(11,16,32,.92);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:.75rem 0;
  position:relative !important;
  top:auto !important;
  transition:.3s;
}
.brand-lockup{ display:flex; align-items:center; gap:1rem; }
.brand-mark{
  width:46px; height:46px; border-radius:12px;
  background:#fff; display:grid; place-items:center;
  box-shadow:0 8px 20px rgba(79,70,229,.35);
  overflow:hidden; flex:0 0 auto; padding:4px;
  position:relative;
}
.brand-mark img{ width:100%; height:100%; object-fit:contain; display:block; }
.brand-mark i{ font-size:1.35rem; color:var(--brand); }
.brand-text{ line-height:1.1; }
.brand-name{ display:block; font-weight:800; font-size:1.24rem; color:#fff; letter-spacing:-.03em; margin-bottom:5px; }
.brand-sub{ display:block; font-size:.6rem; color:rgba(255,255,255,.58); font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.brand-sub b{ color:var(--gold-1); font-weight:700; }

.navbar .nav-link{ color:rgba(255,255,255,.78)!important; font-weight:600; font-size:.86rem; padding:.5rem .68rem!important; display:inline-flex; align-items:center; gap:.35rem; transition:.2s; }
.navbar .nav-link:hover{ color:#fff!important; }
.navbar .nav-link .mdi{ font-size:1.1rem; opacity:.8; transition:.2s; }
.navbar .nav-link:hover .mdi{ opacity:1; color:var(--gold-1); transform:translateY(-1px); }
.cart-btn{ position:relative; }
.cart-badge{ position:absolute; top:-6px; right:-6px; font-size:.65rem; background:var(--gold-1); color:#3a2400; border-radius:999px; padding:.15rem .42rem; font-weight:800; min-width:18px; }

/* ---------- Hero ---------- */
.hero{ position:relative; padding:186px 0 96px; color:#fff; overflow:hidden;
  background:
    radial-gradient(1100px 560px at 10% -14%, rgba(99,102,241,.44), transparent 62%),
    radial-gradient(880px 460px at 92% 4%, rgba(245,158,11,.18), transparent 62%),
    radial-gradient(700px 380px at 50% 110%, rgba(225,29,72,.16), transparent 60%),
    linear-gradient(165deg,#0b1020 0%, #141c3a 55%, #0b1020 100%);
}
.hero::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.32;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(70% 60% at 50% 30%, #000 30%, transparent 100%);
  -webkit-mask-image:radial-gradient(70% 60% at 50% 30%, #000 30%, transparent 100%);
}
.hero > .container{ position:relative; z-index:2; }
.hero-badge{ display:inline-flex; align-items:center; gap:.55rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); color:#e5e7ff; border-radius:999px; padding:.45rem 1rem; font-size:.82rem; font-weight:700; }
.hero-badge .dot{ width:7px;height:7px;border-radius:50%;background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.25); }
.hero h1{ font-size:clamp(2.05rem,4.6vw,3.5rem); line-height:1.1; letter-spacing:-.035em; }
.hero h1 .grad{ background:linear-gradient(100deg,#a5b4fc,#f0abfc 45%,#fcd34d); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero h1 .grad-app{ background:linear-gradient(100deg,#5eead4,#14b8a6 55%,#0f766e); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero .lead{ color:rgba(255,255,255,.74); max-width:700px; font-size:1.06rem; }

/* ---------- Search ---------- */
.search-shell{ background:#fff; border-radius:999px; padding:9px; display:flex; align-items:center; gap:6px; box-shadow:0 30px 70px rgba(4,8,24,.5); max-width:760px; }
.search-shell .icon-pill{ width:44px;height:44px;border-radius:50%;display:grid;place-items:center; background:var(--soft); color:var(--brand); font-size:1.15rem; flex:0 0 auto; }
.search-shell .form-control{ border:0!important; box-shadow:none!important; font-size:1.05rem; font-weight:600; color:var(--ink); background:transparent; padding:.5rem .25rem; }
.search-shell .form-control::placeholder{ color:#9ca3af; font-weight:500; }
.search-shell .suffix{ font-weight:800; color:var(--brand); white-space:nowrap; font-size:1.02rem; padding: 0 .35rem 0 .65rem; border-left:1px dashed #d9dcf0; margin-left:.1rem; }
.search-shell .btn{ border-radius:999px; padding:.72rem 1.6rem; }
.chip{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); color:#dbe0ff; border-radius:999px; padding:.4rem .9rem; font-size:.82rem; font-weight:600; cursor:pointer; transition:.2s; display:inline-flex; align-items:center; gap:.35rem; }
.chip:hover{ background:rgba(255,255,255,.18); color:#fff; }
.chip .tag{ font-size:.62rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:.1rem .4rem; border-radius:999px; background:var(--gold-soft); color:var(--gold-ink); }
.chip.premium-chip .tag{ background:var(--premium-soft); color:var(--premium-1); }
.chip.resale-chip .tag{ background:var(--resale-soft); color:var(--resale-ink); }

/* ---------- Result card ---------- */
.result-card{ background:#fff; color:var(--ink); border-radius:22px; padding:1.25rem 1.4rem; box-shadow:0 26px 60px rgba(4,8,24,.45); animation:pop .38s cubic-bezier(.2,.9,.3,1); max-width:760px; position:relative; overflow:hidden; }
.result-card.tier-ultra{ border-top:4px solid var(--gold-1); }
.result-card.tier-premium{ border-top:4px solid var(--premium-1); }
.result-card.tier-semi{ border-top:4px solid var(--semi-1); }
.result-card.tier-standard{ border-top:4px solid var(--success); }
.result-card.tier-reserved{ border-top:4px solid #d97706; }
.result-card.tier-resale{ border-top:4px solid var(--resale-1); }
@keyframes pop{ from{opacity:0; transform:translateY(12px);} to{opacity:1; transform:none;} }
.result-icon{ width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:1.55rem; background:#e9fbf0; color:var(--success); flex:0 0 auto; }
.result-icon.gold{ background:linear-gradient(135deg,#fff1d6,#ffe0a8); color:var(--gold-2); }
.result-icon.premium{ background:var(--premium-soft); color:var(--premium-1); }
.result-icon.semi{ background:var(--semi-soft); color:var(--semi-1); }
.result-icon.resale{ background:var(--resale-soft); color:var(--resale-1); }
.result-icon.no{ background:var(--danger-soft); color:var(--danger-ink); }
.tier-badge{ display:inline-flex; align-items:center; gap:.3rem; font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:.24rem .6rem; border-radius:999px; margin-left:.5rem; vertical-align:middle; }
.tier-badge.ultra{ background:linear-gradient(135deg,#fef3c7,#fde68a); color:var(--gold-ink); }
.tier-badge.premium{ background:var(--premium-soft); color:var(--premium-1); }
.tier-badge.semi{ background:var(--semi-soft); color:#0369a1; }
.tier-badge.standard{ background:#e9fbf0; color:var(--success); }
.tier-badge.reserved{ background:#fef3c7; color:var(--gold-ink); }
.tier-badge.resale{ background:var(--resale-soft); color:var(--resale-ink); }
.result-name{ font-weight:800; font-size:1.15rem; letter-spacing:-.02em; }
.result-price{ font-weight:800; font-size:1.35rem; color:var(--ink); letter-spacing:-.02em; }
.result-price.resale-price{ color:var(--resale-1); }
.result-price small{ font-weight:600; color:var(--muted); font-size:.72rem; display:block; }
.alt-item{ display:flex; align-items:center; justify-content:space-between; gap:1rem; border:1px solid var(--line); border-radius:14px; padding:.65rem 1rem; background:#fff; font-weight:600; font-size:.9rem; transition:.2s; cursor:pointer; }
.alt-item:hover{ border-color:var(--brand); background:#fafaff; transform:translateX(2px); }

/* ---------- Trust ---------- */
.trust{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; border-top:1px solid rgba(255,255,255,.1); margin-top:3.4rem; padding-top:1.8rem; }
.trust-item{ display:flex; align-items:center; gap:.7rem; color:rgba(255,255,255,.82); font-size:.9rem; font-weight:600; }
.trust-item i{ font-size:1.25rem; color:var(--gold-1); }
@media (max-width:767px){ .trust{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Section headers ---------- */
.eyebrow{ display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:.4rem .9rem; border-radius:999px; margin-bottom:.9rem; }
.eyebrow.brand{ background:#eef0ff; color:var(--brand); }
.eyebrow.gold{ background:linear-gradient(135deg,#fef3c7,#fde68a); color:var(--gold-ink); }
.eyebrow.wa{ background:#e6fbf0; color:#0e8a44; }
.eyebrow.sms{ background:#e6f2ff; color:#0369a1; }
.eyebrow.app{ background:var(--app-soft); color:var(--app-ink); }
.eyebrow.xl{ background:var(--xl-soft); color:var(--xl-ink); }
.eyebrow.resale{ background:var(--resale-soft); color:var(--resale-ink); }
.eyebrow.email{ background:var(--email-soft); color:var(--email-ink); }
.eyebrow.geo{ background:var(--geo-soft); color:var(--geo-ink); }

.toast-warning .toast-body { background: #fff7e6; color: #7c4a03; }

.cart-feedback {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .6rem .9rem;
    border-radius: 12px;
    font-size: .86rem;
    font-weight: 600;
    animation: pop .35s cubic-bezier(.2,.9,.3,1);
}
.cart-feedback-success { background: #e9fbf0; color: #0e8a44; border: 1px solid #b9efce; }
.cart-feedback-warning { background: #fff7e6; color: #7c4a03; border: 1px solid #fde68a; }
.cart-feedback-error   { background: #fdecec; color: #b42318; border: 1px solid #fecaca; }
.cart-feedback .cf-close {
    background: transparent; border: 0; color: inherit; opacity: .6;
    cursor: pointer; padding: .15rem; line-height: 1;
}
.cart-feedback .cf-close:hover { opacity: 1; }

/* ---------- Premium ---------- */
.premium-showcase{ background:linear-gradient(180deg,#fbfaff,#fff); border:1px solid var(--line); border-radius:28px; padding:2.4rem; }
.premium-tile{ border:1px solid var(--line); border-radius:18px; padding:1.15rem 1.25rem; background:#fff; transition:.28s; position:relative; overflow:hidden; display:flex; flex-direction:column; gap:.6rem; height:100%; }
.premium-tile:hover{ transform:translateY(-6px); box-shadow:0 24px 50px rgba(20,20,60,.14); border-color:#dcdff4; }
.premium-tile.ultra{ border-top:3px solid var(--gold-1); }
.premium-tile.premium{ border-top:3px solid var(--premium-1); }
.premium-tile.semi{ border-top:3px solid var(--semi-1); }
.premium-tile.reserved{ border-top:3px solid #d97706; background:linear-gradient(180deg,#fffdf7,#fff); }
.premium-domain{ font-weight:800; font-size:1.05rem; letter-spacing:-.02em; line-height:1.2; word-break:break-all; }
.premium-domain .sld{ color:var(--ink); }
.premium-domain .tld{ color:var(--muted); font-weight:600; }
.premium-price{ font-weight:800; font-size:1.35rem; letter-spacing:-.025em; color:var(--ink); }
.premium-price small{ font-weight:600; color:var(--muted); font-size:.72rem; }
.premium-tile .meta{ font-size:.76rem; color:var(--muted); font-weight:600; }
/* ---------- SOLD state ---------- */
.premium-tile.sold {
    background: linear-gradient(180deg, #fafafa, #ffffff);
    border-color: #e5e7eb;
    opacity: .92;
}
.premium-tile.sold:hover {
    transform: none;                            /* no lift on hover — it's not interactive */
    box-shadow: 0 12px 28px rgba(0,0,0,.06);
    border-color: #e5e7eb;
}
.premium-tile.sold .premium-domain .sld,
.premium-tile.sold .premium-domain .tld {
    color: #9ca3af;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
    text-decoration-color: #d1d5db;
}
.premium-tile.sold .meta {
    color: #b0b5c0;
}

/* Diagonal ribbon across the top-right corner */
.sold-ribbon {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: linear-gradient(135deg, #12a150, #0e8a44);
    color: #fff;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .3rem .7rem;
    border-radius: 999px;
    box-shadow: 0 6px 16px rgba(18, 161, 80, .35);
    z-index: 2;
}
.sold-ribbon .mdi { font-size: .85rem; }

/* Sold info strip at bottom of tile */
.sold-info {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem .75rem;
    border-radius: 10px;
    background: #f0fdf4;
    color: #0e8a44;
    font-weight: 700;
    font-size: .82rem;
    border: 1px dashed #a7f3d0;
}
.sold-info .mdi { font-size: 1rem; }
.sold-info .sold-date {
    margin-left: auto;
    font-size: .72rem;
    color: #4b9f6c;
    font-weight: 600;
}

/* Tier header counter */
.sold-count-pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 800;
    padding: .22rem .65rem;
    border-radius: 999px;
    background: #f0fdf4;
    color: #0e8a44;
    border: 1px solid #a7f3d0;
}
.sold-count-pill .mdi { font-size: .85rem; }

/* Ensure the tile is a positioning context for the ribbon */
.premium-tile { position: relative; }

/* ---------- Resale ---------- */
.resale-hero{ background: radial-gradient(700px 340px at 90% 0%, rgba(225,29,72,.22), transparent 62%), radial-gradient(560px 300px at 5% 100%, rgba(124,58,237,.14), transparent 60%), linear-gradient(135deg,#170610,#2b0a16 55%,#170610); border-radius:30px; padding:3rem 2.6rem; color:#fff; position:relative; overflow:hidden; }
.resale-hero::after{ content:""; position:absolute; width:380px;height:380px;border-radius:50%; background:rgba(251,113,133,.14); right:-100px; bottom:-140px; }
.resale-hero > *{ position:relative; z-index:2; }
.resale-hero .stat-pill{ display:inline-flex; align-items:center; gap:.45rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); color:#fecdd3; border-radius:999px; padding:.4rem .9rem; font-size:.78rem; font-weight:700; }
.resale-hero .stat-box{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:16px; padding:1rem 1.1rem; }
.resale-hero .stat-box .num{ font-size:1.35rem; font-weight:800; color:#fff; letter-spacing:-.03em; }
.resale-hero .stat-box .lbl{ font-size:.72rem; color:rgba(255,255,255,.65); font-weight:600; }
.resale-tile{ border:1px solid var(--line); border-radius:22px; padding:1.5rem 1.55rem; background:#fff; transition:.28s; height:100%; display:flex; flex-direction:column; position:relative; overflow:hidden; border-top:4px solid var(--resale-1); }
.resale-tile:hover{ transform:translateY(-7px); box-shadow:0 28px 60px rgba(225,29,72,.16); border-color:#fecdd3; border-top-color:var(--resale-1); }
.resale-tile.flagship{ border-top:4px solid var(--gold-1); background:linear-gradient(180deg,#fffcf5,#fff); box-shadow:0 22px 54px rgba(245,158,11,.14); }
.resale-tile.flagship:hover{ box-shadow:0 30px 66px rgba(245,158,11,.24); border-color:#fde68a; border-top-color:var(--gold-1); }
.resale-tile .flagship-ribbon{ position:absolute; top:-1px; right:1rem; background:linear-gradient(135deg,var(--gold-1),var(--gold-2)); color:#3a2400; font-size:.66rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .85rem; border-radius:0 0 10px 10px; box-shadow:0 6px 16px rgba(245,158,11,.4); }
.resale-domain{ font-weight:800; font-size:1.15rem; letter-spacing:-.025em; line-height:1.2; word-break:break-all; }
.resale-domain .sld{ color:var(--ink); }
.resale-domain .tld{ color:var(--muted); font-weight:600; }
.resale-listed{ display:inline-flex; align-items:center; gap:.35rem; margin-top:.45rem; background:var(--resale-soft); color:var(--resale-ink); font-size:.68rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; padding:.22rem .6rem; border-radius:999px; }
.resale-price-line{ margin:1rem 0 .35rem; display:flex; align-items:flex-end; gap:.4rem; }
.resale-price-line .cur{ font-weight:800; font-size:1.15rem; color:var(--resale-1); margin-bottom:.4rem; }
.resale-price-line .amt{ font-size:2.1rem; font-weight:800; line-height:1; letter-spacing:-.04em; color:var(--resale-1); }
.resale-tile.flagship .resale-price-line .cur{ color:var(--gold-2); }
.resale-tile.flagship .resale-price-line .amt{ color:var(--gold-2); }
.resale-seller{ display:flex; align-items:center; gap:.55rem; margin:.75rem 0 1rem; padding-top:.85rem; border-top:1px dashed var(--line); }
.resale-seller .avatar{ width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:.85rem; background:linear-gradient(135deg,#fb7185,var(--resale-1)); color:#fff; font-weight:800; flex:0 0 auto; }
.resale-seller .info{ font-size:.78rem; line-height:1.25; }
.resale-seller .info b{ font-weight:700; color:var(--ink); display:block; font-size:.82rem; }
.resale-seller .info small{ color:var(--muted); font-weight:600; }
.resale-seller .verified{ color:#12a150; font-size:.7rem; font-weight:800; margin-left:auto; display:flex; align-items:center; gap:.25rem; }
.resale-tile ul{ list-style:none; padding:0; margin:.2rem 0 1rem; display:grid; gap:.45rem; }
.resale-tile ul li{ font-size:.82rem; color:#374151; display:flex; gap:.5rem; align-items:flex-start; }
.resale-tile ul li i{ color:var(--resale-1); margin-top:.15rem; }
.resale-tile.flagship ul li i{ color:var(--gold-2); }
.resale-tile .cta-row{ margin-top:auto; display:flex; flex-direction:column; gap:.5rem; }
.resale-info{ border:1px solid var(--line); border-radius:22px; padding:1.9rem; background:#fff; height:100%; display:flex; flex-direction:column; gap:.6rem; }
.resale-info .ri-icon{ width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem; color:#fff; margin-bottom:.4rem; }
.resale-info.buy .ri-icon{ background:linear-gradient(135deg,var(--resale-1),var(--resale-2)); }
.resale-info.sell .ri-icon{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); }
.resale-info h5{ font-size:1.05rem; margin:.2rem 0 .4rem; }
.resale-info p{ color:var(--muted); font-size:.88rem; margin-bottom:.85rem; }
.resale-info ol{ padding-left:1.1rem; margin:0 0 .9rem; color:#374151; font-size:.86rem; line-height:1.7; }
.resale-info ol li::marker{ font-weight:800; color:var(--brand); }
/* ---------- SOLD state for resale tiles ---------- */
.resale-tile.sold {
    background: linear-gradient(180deg, #fafafa, #ffffff);
    border-top-color: #9ca3af !important;    /* override the rose top border */
    opacity: .92;
}
.resale-tile.sold:hover {
    transform: none;
    box-shadow: 0 12px 28px rgba(0,0,0,.06);
    border-color: var(--line);
}
.resale-tile.sold .resale-domain .sld,
.resale-tile.sold .resale-domain .tld {
    color: #9ca3af;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
    text-decoration-color: #d1d5db;
}
.resale-tile.sold .resale-listed {
    background: #f0fdf4;
    color: #0e8a44;
}
.resale-tile.sold .resale-price-line .cur,
.resale-tile.sold .resale-price-line .amt {
    color: #9ca3af;
    opacity: .7;
}

/* Sold ribbon — top-right corner */
.sold-ribbon {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: linear-gradient(135deg, #12a150, #0e8a44);
    color: #fff;
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .3rem .7rem;
    border-radius: 999px;
    box-shadow: 0 6px 16px rgba(18, 161, 80, .35);
    z-index: 2;
}
.sold-ribbon .mdi { font-size: .85rem; }

/* Sold info strip at bottom of tile */
.sold-info {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem .75rem;
    border-radius: 10px;
    background: #f0fdf4;
    color: #0e8a44;
    font-weight: 700;
    font-size: .82rem;
    border: 1px dashed #a7f3d0;
}
.sold-info .mdi { font-size: 1rem; }
.sold-info .sold-date {
    margin-left: auto;
    font-size: .72rem;
    color: #4b9f6c;
    font-weight: 600;
}

/* Sold count pill in header */
.sold-count-pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 800;
    padding: .22rem .65rem;
    border-radius: 999px;
    background: #f0fdf4;
    color: #0e8a44;
    border: 1px solid #a7f3d0;
}
.sold-count-pill .mdi { font-size: .85rem; }
/* ---------- Saved billing address picker ---------- */
.billing-option {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: .9rem 1.05rem;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    cursor: pointer;
    transition: .18s;
    background: #fff;
    position: relative;
}
.billing-option:hover {
    border-color: #c7cbfa;
    background: #fafaff;
}
.billing-option.active {
    border-color: var(--brand);
    background: #fafaff;
    box-shadow: 0 8px 20px rgba(79, 70, 229, .08);
}
.billing-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.bo-radio {
    font-size: 1.2rem;
    color: #d1d5db;
    flex: 0 0 auto;
    margin-top: .05rem;
    transition: .18s;
}
.billing-option.active .bo-radio {
    color: var(--brand);
}
.bo-body {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    flex-grow: 1;
    min-width: 0;
}
.bo-name {
    font-weight: 700;
    font-size: .92rem;
    color: var(--ink);
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
}
.bo-address {
    font-size: .84rem;
    color: #374151;
    line-height: 1.45;
}
.bo-meta {
    font-size: .76rem;
    color: var(--muted);
    font-weight: 600;
}

.checkout-section {
    padding-top: 140px;
    padding-bottom: 80px;
    min-height: 100vh;
}

@media (max-width: 767px) {
    .checkout-section {
        padding-top: 120px;
        padding-bottom: 60px;
    }
}
/* Ensure tiles are positioning contexts */
.resale-tile { position: relative; }
/* ---------- Templates ---------- */
.tpl-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-bottom:2rem; }
.tpl-tabs .nav-link{ border:1px solid var(--line); background:#fff; color:var(--ink); border-radius:999px; font-weight:700; font-size:.86rem; padding:.5rem 1.1rem; transition:.2s; }
.tpl-tabs .nav-link:hover{ border-color:#c7cbfa; }
.tpl-tabs .nav-link.active{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; border-color:transparent; box-shadow:0 10px 22px rgba(79,70,229,.3); }
.template-card{ border:1px solid var(--line); border-radius:22px; overflow:hidden; background:#fff; transition:.3s; height:100%; display:flex; flex-direction:column; }
.template-card:hover{ transform:translateY(-6px); box-shadow:0 28px 56px rgba(20,20,60,.14); border-color:#dcdff4; }
.template-preview{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.template-preview .mockup{ position:absolute; inset:0; padding:1rem; display:flex; flex-direction:column; gap:.4rem; }
.template-preview .chrome{ display:flex; gap:.3rem; margin-bottom:.4rem; }
.template-preview .chrome span{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.45); }
.template-preview .bar{ height:6px; border-radius:3px; background:rgba(255,255,255,.28); }
.template-preview .bar-lg{ height:14px; border-radius:4px; background:rgba(255,255,255,.5); width:60%; }
.template-preview .bar-sm{ height:5px; border-radius:3px; background:rgba(255,255,255,.22); }
.template-preview .grid-mock{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:.4rem; margin-top:.35rem; flex:1; }
.template-preview .tile-mock{ border-radius:6px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.25); }
.tpl-1{ background:linear-gradient(135deg,#4f46e5,#7c3aed); }
.tpl-2{ background:linear-gradient(135deg,#0ea5e9,#0284c7); }
.tpl-3{ background:linear-gradient(135deg,#f59e0b,#d97706); }
.tpl-4{ background:linear-gradient(135deg,#ec4899,#be185d); }
.tpl-5{ background:linear-gradient(135deg,#10b981,#047857); }
.tpl-6{ background:linear-gradient(135deg,#6366f1,#0f172a); }
.tpl-7{ background:linear-gradient(135deg,#ef4444,#991b1b); }
.tpl-8{ background:linear-gradient(135deg,#8b5cf6,#4c1d95); }
.template-body{ padding:1.25rem 1.35rem 1.4rem; display:flex; flex-direction:column; flex:1; }
.template-body h6{ font-weight:800; font-size:1.05rem; margin-bottom:.25rem; }
.template-body .cat{ font-size:.72rem; color:var(--muted); font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.template-body p{ color:var(--muted); font-size:.85rem; margin:.5rem 0 .85rem; flex:1; }
.template-tags{ display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:1rem; }
.template-tags .ttag{ font-size:.68rem; font-weight:700; padding:.24rem .55rem; border-radius:999px; background:var(--soft); color:var(--muted); }
.template-tags .ttag.pg{ background:#e9fbf0; color:var(--success); }
.template-tags .ttag.nopg{ background:#fff4d6; color:var(--gold-ink); }
.template-tags .ttag.listing{ background:#eef0ff; color:var(--brand); }
.template-tags .ttag.app{ background:var(--app-soft); color:var(--app-ink); }

/* ---------- Listing toggle ---------- */
.listing-toggle{ display:inline-flex; gap:4px; background:var(--soft); border-radius:999px; padding:5px; border:1px solid var(--line); }
.listing-toggle button{ border:0; background:transparent; font-weight:700; font-size:.86rem; color:var(--muted); border-radius:999px; padding:.55rem 1.15rem; transition:.2s; display:flex; align-items:center; gap:.4rem; }
.listing-toggle button.active{ background:#fff; color:var(--brand); box-shadow:0 4px 14px rgba(20,20,60,.12); }
.listing-panel{ border:1px solid var(--line); border-radius:22px; padding:1.8rem; background:#fff; display:none; }
.listing-panel.active{ display:block; }
.listing-feature{ display:flex; align-items:flex-start; gap:.8rem; padding:.85rem 0; border-bottom:1px dashed var(--line); }
.listing-feature:last-child{ border-bottom:0; padding-bottom:0; }
.listing-feature .icon{ width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:1.05rem; flex:0 0 auto; }

/* ---------- Mobile App ---------- */
.app-hero{ background:linear-gradient(135deg,#0b1020,#0d3f3d 55%,#0b1020); border-radius:30px; padding:3rem 2.6rem; color:#fff; position:relative; overflow:hidden; }
.app-hero::after{ content:""; position:absolute; width:420px;height:420px;border-radius:50%; background:radial-gradient(circle,rgba(20,184,166,.28),transparent 65%); right:-110px; top:-130px; }
.app-hero::before{ content:""; position:absolute; width:340px;height:340px;border-radius:50%; background:radial-gradient(circle,rgba(245,158,11,.14),transparent 65%); left:-110px; bottom:-150px; }
.app-hero > *{ position:relative; z-index:2; }
.device-pair{ position:relative; height:280px; }
.device{ position:absolute; border-radius:24px; padding:10px; background:#0f172a; box-shadow:0 30px 60px rgba(0,0,0,.55), 0 0 0 2px rgba(255,255,255,.08) inset; }
.device .screen{ width:100%; height:100%; border-radius:16px; overflow:hidden; background:linear-gradient(135deg,#14b8a6,#0f766e); position:relative; }
.device .screen::before{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.15), transparent 30%), radial-gradient(circle at 60% 40%, rgba(255,255,255,.28), transparent 55%); }
.device .notch{ position:absolute; top:14px; left:50%; transform:translateX(-50%); width:52px; height:5px; border-radius:3px; background:rgba(0,0,0,.55); }
.device.d1{ width:150px; height:290px; top:0; left:12%; transform:rotate(-6deg); }
.device.d2{ width:160px; height:310px; top:-10px; right:14%; transform:rotate(5deg); z-index:3; background:#0b1020; }
.app-tier{ border:1px solid var(--line); border-radius:24px; padding:1.9rem 1.7rem; background:#fff; height:100%; transition:.28s; display:flex; flex-direction:column; position:relative; }
.app-tier:hover{ transform:translateY(-7px); box-shadow:0 28px 60px rgba(20,20,60,.13); border-color:#cbeae5; }
.app-tier.popular{ border:2px solid var(--app-1); box-shadow:0 28px 60px rgba(20,184,166,.2); }
.app-tier.popular:hover{ box-shadow:0 34px 76px rgba(20,184,166,.28); }
.app-tier .ribbon{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,var(--app-1),var(--app-2)); color:#fff; font-size:.7rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; border-radius:999px; padding:.35rem 1rem; white-space:nowrap; box-shadow:0 8px 20px rgba(20,184,166,.42); }
.app-tier h5{ font-size:1.2rem; margin-bottom:.25rem; }
.app-tier .desc{ color:var(--muted); font-size:.87rem; min-height:38px; }
.app-price{ display:flex; align-items:flex-end; gap:.35rem; margin:1rem 0 .35rem; }
.app-price .cur{ font-weight:800; font-size:1.1rem; color:var(--app-2); margin-bottom:.4rem; }
.app-price .amt{ font-size:2.4rem; font-weight:800; line-height:1; letter-spacing:-.04em; }
.app-renew{ font-size:.78rem; color:var(--muted); font-weight:600; margin-bottom:1.1rem; }
.app-renew b{ color:var(--app-2); }
.app-tier hr{ border-color:var(--line); opacity:1; margin:1.2rem 0; }
.app-tier .feat{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.app-tier .feat li{ display:flex; gap:.6rem; font-size:.88rem; color:#374151; align-items:flex-start; }
.app-tier .feat li i{ color:var(--app-1); font-size:.95rem; margin-top:.2rem; flex:0 0 auto; }
.app-tier .feat li.off{ color:#9ca3af; }
.app-tier .feat li.off i{ color:#d1d5db; }
.app-tier .feat li.hl{ font-weight:600; color:var(--ink); }
.app-tier .feat li.hl i{ color:var(--gold-1); }
.platform-toggle{ display:inline-flex; gap:4px; background:var(--soft); border-radius:999px; padding:5px; border:1px solid var(--line); }
.platform-toggle button{ border:0; background:transparent; font-weight:700; font-size:.86rem; color:var(--muted); border-radius:999px; padding:.55rem 1.1rem; transition:.2s; display:flex; align-items:center; gap:.4rem; }
.platform-toggle button.active{ background:#fff; color:var(--app-2); box-shadow:0 4px 14px rgba(20,20,60,.12); }
.platform-toggle button i{ font-size:1.1rem; }
.app-feature{ border:1px solid var(--line); border-radius:18px; padding:1.35rem; background:#fff; height:100%; transition:.25s; display:flex; gap:.95rem; align-items:flex-start; }
.app-feature:hover{ transform:translateY(-4px); box-shadow:0 20px 42px rgba(20,20,60,.1); border-color:#cbeae5; }
.app-feature .fi{ width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.25rem; background:var(--app-soft); color:var(--app-2); flex:0 0 auto; }
.app-feature h6{ font-weight:800; font-size:.98rem; margin-bottom:.25rem; }
.app-feature p{ color:var(--muted); font-size:.84rem; margin:0; line-height:1.55; }
.bundle-band{ background:linear-gradient(135deg,#0f766e,#14b8a6 55%,#5eead4); border-radius:24px; padding:2rem 2.2rem; color:#fff; position:relative; overflow:hidden; display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.bundle-band::after{ content:""; position:absolute; width:260px;height:260px;border-radius:50%; background:rgba(255,255,255,.15); right:-70px; top:-80px; }
.bundle-band > *{ position:relative; z-index:2; }
.bundle-band .save-pill{ display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.22); border:1px solid rgba(255,255,255,.35); border-radius:999px; padding:.4rem .9rem; font-size:.78rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.mobile-strip{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; background:var(--app-soft); border:1px dashed #a7e5db; border-radius:14px; padding:.75rem .95rem; margin-top:1.1rem; font-size:.83rem; }
.mobile-strip .lbl{ font-weight:700; color:var(--app-ink); display:flex; align-items:center; gap:.45rem; }
.mobile-strip .lbl i{ font-size:1.05rem; }
.mobile-strip .amt{ font-weight:800; color:var(--app-2); font-size:.95rem; }
.mobile-strip .btn{ font-size:.76rem; padding:.3rem .7rem; }

/* ---------- Packages ---------- */
.billing-toggle{ display:inline-flex; gap:4px; background:var(--soft); border-radius:999px; padding:5px; border:1px solid var(--line); }
.billing-toggle button{ border:0; background:transparent; font-weight:700; font-size:.9rem; color:var(--muted); border-radius:999px; padding:.55rem 1.2rem; transition:.2s; display:flex; align-items:center; gap:.4rem; }
.billing-toggle button.active{ background:#fff; color:var(--brand); box-shadow:0 4px 14px rgba(20,20,60,.12); }
.billing-toggle .save{ background:#e9fbf0; color:#0e8a44; font-size:.66rem; font-weight:800; border-radius:999px; padding:.12rem .45rem; }
.freebie-strip{ display:inline-flex; align-items:center; gap:.6rem; background:linear-gradient(135deg,#fef3c7,#fde68a); border:1px dashed #f59e0b; color:var(--gold-ink); padding:.55rem 1.15rem; border-radius:999px; font-size:.86rem; font-weight:700; margin-bottom:1.1rem; transition:.25s; }
.freebie-strip i.mdi-gift-outline{ font-size:1.05rem; }
.freebie-strip .price-tag{ background:#fff; color:var(--gold-2); border-radius:999px; padding:.2rem .65rem; font-weight:800; font-size:.84rem; border:1px solid #fcd34d; }
.pkg{ border:1px solid var(--line); border-radius:26px; padding:2rem 1.8rem; height:100%; background:#fff; transition:.28s; position:relative; display:flex; flex-direction:column; }
.pkg:hover{ transform:translateY(-7px); box-shadow:0 28px 60px rgba(20,20,60,.14); border-color:#dcdff4; }
.pkg.popular{ border:2px solid var(--brand); box-shadow:0 28px 66px rgba(79,70,229,.22); }
.pkg.popular:hover{ box-shadow:0 34px 76px rgba(79,70,229,.3); }
.pkg-ribbon{ position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; border-radius:999px; padding:.35rem 1rem; white-space:nowrap; box-shadow:0 8px 20px rgba(79,70,229,.42); }
.pkg h5{ font-size:1.25rem; margin-bottom:.25rem; }
.pkg .desc{ color:var(--muted); font-size:.88rem; min-height:40px; }
.price{ display:flex; align-items:flex-end; gap:.35rem; margin:1.15rem 0 1.25rem; }
.price .cur{ font-weight:800; font-size:1.15rem; color:var(--brand); margin-bottom:.4rem; }
.price .amt{ font-size:2.6rem; font-weight:800; line-height:1; letter-spacing:-.045em; }
.price .per{ color:var(--muted); font-weight:600; font-size:.85rem; margin-bottom:.45rem; }
.pkg hr{ border-color:var(--line); opacity:1; margin:1.2rem 0; }
.feat{ list-style:none; padding:0; margin:0; display:grid; gap:.65rem; }
.feat li{ display:flex; gap:.62rem; font-size:.9rem; color:#374151; align-items:flex-start; }
.feat li i{ color:var(--success); font-size:.95rem; margin-top:.18rem; flex:0 0 auto; }
.feat li.off{ color:#9ca3af; }
.feat li.off i{ color:#d1d5db; }
.feat li.hl{ color:var(--ink); font-weight:600; }
.feat li.hl i{ color:var(--gold-1); }
.pkg .mt-auto{ margin-top:1.6rem; }
.pkg-note{ font-size:.76rem; color:var(--muted); text-align:center; margin-top:.75rem; }
.domain-allowance{ background:var(--soft); border-radius:14px; padding:.7rem .9rem; margin-bottom:1rem; font-size:.8rem; font-weight:600; color:var(--muted); display:flex; align-items:center; gap:.5rem; }
.domain-allowance i{ color:var(--brand); font-size:1rem; }
.domain-allowance b{ color:var(--ink); }
.domain-allowance.freebie-active{ background:linear-gradient(135deg,#fef3c7,#fde68a); color:var(--gold-ink); border:1px dashed #f59e0b; }
.domain-allowance.freebie-active i{ color:var(--gold-2); }
.domain-allowance.freebie-active b{ color:var(--gold-ink); }

/* ========== OTHER MARKETING SERVICES — REDESIGNED ========== */
.mkt-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  padding:1.6rem 1.5rem;
  height:100%;
  display:flex;
  flex-direction:column;
  transition:.28s;
  position:relative;
}
.mkt-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 56px rgba(20,20,60,.12);
  border-color:#dcdff4;
}
.mkt-top{
  display:flex;
  align-items:center;
  gap:1rem;
  margin-bottom:1.1rem;
}
.mkt-badge{
  width:56px; height:56px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:1.5rem;
  flex:0 0 auto;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
  position:relative;
}
.mk-social{ background:linear-gradient(135deg,#f472b6,#ec4899); box-shadow:0 8px 20px rgba(236,72,153,.35); }
.mk-seo{ background:linear-gradient(135deg,#fbbf24,#f97316); box-shadow:0 8px 20px rgba(249,115,22,.35); }
.mk-ads{ background:linear-gradient(135deg,#a78bfa,#7c3aed); box-shadow:0 8px 20px rgba(124,58,237,.35); }
.mk-content{ background:linear-gradient(135deg,#38bdf8,#2563eb); box-shadow:0 8px 20px rgba(37,99,235,.35); }
.mkt-head-text h5{
  font-size:1.05rem;
  font-weight:800;
  margin:0 0 .15rem;
  letter-spacing:-.02em;
  line-height:1.2;
}
.mkt-head-text span{
  font-size:.78rem;
  color:var(--muted);
  font-weight:600;
}
.mkt-desc{
  font-size:.87rem;
  color:var(--muted);
  margin-bottom:1rem;
  line-height:1.55;
}
.mkt-list{
  list-style:none;
  padding:0;
  margin:0 0 1.1rem;
  display:grid;
  gap:.5rem;
}
.mkt-list li{
  font-size:.84rem;
  color:#374151;
  display:flex;
  gap:.5rem;
  align-items:flex-start;
  line-height:1.45;
}
.mkt-list li i{
  color:var(--success);
  font-size:1rem;
  margin-top:.1rem;
  flex:0 0 auto;
}
.mkt-foot{
  margin-top:auto;
  padding-top:1rem;
  border-top:1px dashed var(--line);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
}
.mkt-price{
  display:flex;
  align-items:baseline;
  gap:.15rem;
}
.mkt-price .cur{
  font-size:.9rem;
  font-weight:800;
  color:var(--brand);
}
.mkt-price .amt{
  font-size:1.5rem;
  font-weight:800;
  color:var(--ink);
  letter-spacing:-.03em;
  line-height:1;
}
.mkt-price .per{
  font-size:.78rem;
  color:var(--muted);
  font-weight:600;
}

/* ---------- Messaging ---------- */
.messaging-card{ border:1px solid var(--line); border-radius:26px; padding:1.9rem 1.75rem; background:#fff; height:100%; position:relative; overflow:hidden; display:flex; flex-direction:column; }
.messaging-card.sms{ border-top:4px solid #0ea5e9; }
.messaging-card.wa{ border-top:4px solid var(--wa); }
.messaging-card.email{ border-top:4px solid var(--email-1); }
.messaging-head{ display:flex; align-items:center; gap:.9rem; margin-bottom:1.25rem; }
.messaging-icon{ width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:1.55rem; color:#fff; flex:0 0 auto; }
.messaging-icon.sms{ background:linear-gradient(135deg,#38bdf8,#2563eb); box-shadow:0 12px 28px rgba(56,189,248,.4); }
.messaging-icon.wa{ background:linear-gradient(135deg,#25d366,#128c7e); box-shadow:0 12px 28px rgba(37,211,102,.4); }
.messaging-icon.email{ background:linear-gradient(135deg,var(--email-1),var(--email-2)); box-shadow:0 12px 28px rgba(139,92,246,.4); }
.messaging-head h5{ margin:0; font-size:1.1rem; }
.messaging-head .sub{ font-size:.8rem; color:var(--muted); font-weight:600; margin-top:.1rem; }
.onboard-strip{ background:linear-gradient(135deg,#fff7e6,#ffefcc); border:1px solid #ffe0a8; border-radius:16px; padding:1.1rem 1.2rem; margin-bottom:1.25rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.onboard-strip .lbl{ font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-ink); margin-bottom:.2rem; display:block; }
.onboard-strip .val{ font-weight:800; font-size:1.05rem; color:var(--ink); letter-spacing:-.02em; }
.onboard-strip .val small{ font-weight:600; color:var(--muted); font-size:.72rem; }
.onboard-strip .note{ font-size:.75rem; color:var(--gold-ink); font-weight:600; }
.onboard-strip.wa-strip{ background:linear-gradient(135deg,#e6fbf0,#d1f7e0); border-color:#a7f3d0; }
.onboard-strip.wa-strip .lbl{ color:#0e8a44; }
.onboard-strip.wa-strip .note{ color:#0e8a44; }
.onboard-strip.email-strip{ background:linear-gradient(135deg,#f5f0ff,#ece4ff); border-color:#ddd0ff; }
.onboard-strip.email-strip .lbl{ color:var(--email-ink); }
.onboard-strip.email-strip .note{ color:var(--email-ink); }
.credit-packs{ display:grid; gap:.55rem; margin-bottom:1.15rem; }
.credit-pack{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; border:1px solid var(--line); border-radius:14px; padding:.65rem .95rem; font-size:.85rem; font-weight:600; transition:.2s; cursor:pointer; }
.credit-pack:hover{ border-color:var(--brand); background:#fafaff; }
.credit-pack .qty{ color:var(--ink); }
.credit-pack .qty small{ color:var(--muted); font-weight:600; display:block; font-size:.7rem; }
.credit-pack .amt{ font-weight:800; color:var(--ink); margin-right:.35rem; font-size:.88rem; }
.credit-pack .btn{ font-size:.74rem; padding:.28rem .65rem; }
.lead-strip{ background:#f7f8fc; border:1px dashed #c7cbfa; border-radius:14px; padding:.9rem 1.1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:auto; }
.lead-strip .lbl{ font-weight:700; font-size:.86rem; }
.lead-strip .lbl small{ display:block; color:var(--muted); font-weight:600; font-size:.74rem; margin-top:.15rem; }
.lead-strip .rate{ font-weight:800; font-size:1.15rem; color:var(--brand); letter-spacing:-.02em; }
.lead-strip .rate small{ font-weight:600; color:var(--muted); font-size:.72rem; }

/* ---------- Leads ---------- */
.lead-hero{ background:linear-gradient(135deg,#0b1020,#1a1f4a 55%,#0b1020); border-radius:30px; padding:3rem 2.6rem; color:#fff; position:relative; overflow:hidden; }
.lead-hero::after{ content:""; position:absolute; width:400px;height:400px;border-radius:50%; background:radial-gradient(circle,rgba(245,158,11,.22),transparent 65%); right:-100px; top:-120px; }
.lead-hero::before{ content:""; position:absolute; width:360px;height:360px;border-radius:50%; background:radial-gradient(circle,rgba(99,102,241,.28),transparent 65%); left:-120px; bottom:-160px; }
.lead-hero > *{ position:relative; z-index:2; }
.lead-tile{ border:1px solid var(--line); border-radius:20px; padding:1.5rem; background:#fff; transition:.28s; height:100%; display:flex; flex-direction:column; }
.lead-tile:hover{ transform:translateY(-6px); box-shadow:0 24px 50px rgba(20,20,60,.13); border-color:#dcdff4; }
.lead-tile.best{ border:2px solid var(--brand); box-shadow:0 22px 52px rgba(79,70,229,.18); position:relative; }
.lead-tile.best::before{ content:"Best value"; position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:.28rem .8rem; border-radius:999px; white-space:nowrap; }
.lead-tile .qty{ font-size:2rem; font-weight:800; letter-spacing:-.03em; line-height:1; }
.lead-tile .qty small{ font-size:.85rem; font-weight:600; color:var(--muted); display:block; margin-top:.3rem; }
.lead-tile .rate-pill{ display:inline-flex; align-items:center; gap:.35rem; background:#eef0ff; color:var(--brand); border-radius:999px; padding:.28rem .7rem; font-size:.72rem; font-weight:800; margin:.85rem 0; }
.lead-tile .rate-pill.gold{ background:var(--gold-soft); color:var(--gold-ink); }
.lead-tile ul{ list-style:none; padding:0; margin:0 0 1.2rem; display:grid; gap:.5rem; }
.lead-tile ul li{ font-size:.84rem; color:#374151; display:flex; gap:.5rem; align-items:flex-start; }
.lead-tile ul li i{ color:var(--success); margin-top:.15rem; }
.lead-tile .price-line{ margin-top:auto; }
.delivery-tile{ border:1px solid var(--line); border-radius:22px; padding:1.75rem 1.6rem; background:#fff; height:100%; transition:.3s; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.delivery-tile:hover{ transform:translateY(-6px); box-shadow:0 26px 56px rgba(20,20,60,.13); border-color:#dcdff4; }
.delivery-tile.xl{ border-top:4px solid var(--xl-1); }
.delivery-tile.crm{ border-top:4px solid var(--brand); }
.delivery-tile.geo{ border-top:4px solid var(--geo-1); }
.delivery-tile .head{ display:flex; align-items:center; gap:.9rem; margin-bottom:1rem; }
.delivery-tile .logo{ width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font-size:1.5rem; color:#fff; flex:0 0 auto; }
.delivery-tile.xl .logo{ background:linear-gradient(135deg,#2f9e57,var(--xl-1)); box-shadow:0 12px 26px rgba(33,115,70,.35); }
.delivery-tile.crm .logo{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); box-shadow:0 12px 26px rgba(79,70,229,.35); }
.delivery-tile.geo .logo{ background:linear-gradient(135deg,var(--geo-1),var(--geo-2)); box-shadow:0 12px 26px rgba(14,165,233,.35); }
.delivery-tile h5{ margin:0; font-size:1.05rem; }
.delivery-tile .sub{ font-size:.78rem; color:var(--muted); font-weight:600; margin-top:.15rem; }
.delivery-tile p{ color:var(--muted); font-size:.86rem; margin-bottom:1rem; }
.delivery-tile ul{ list-style:none; padding:0; margin:0 0 1.2rem; display:grid; gap:.5rem; }
.delivery-tile ul li{ font-size:.83rem; color:#374151; display:flex; gap:.5rem; align-items:flex-start; }
.delivery-tile ul li i{ margin-top:.15rem; flex:0 0 auto; }
.delivery-tile.xl ul li i{ color:var(--xl-1); }
.delivery-tile.crm ul li i{ color:var(--brand); }
.delivery-tile.geo ul li i{ color:var(--geo-1); }
.delivery-tile .cta-row{ margin-top:auto; display:flex; gap:.5rem; flex-wrap:wrap; }
.format-pill{ display:inline-flex; align-items:center; gap:.35rem; font-size:.7rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; padding:.28rem .65rem; border-radius:999px; }
.format-pill.xl{ background:var(--xl-soft); color:var(--xl-ink); }
.format-pill.crm{ background:#eef0ff; color:var(--brand); }
.format-pill.geo{ background:var(--geo-soft); color:var(--geo-ink); }
.format-pill.both{ background:var(--gold-soft); color:var(--gold-ink); }
.geo-form{ display:flex; gap:.4rem; margin-bottom:.75rem; }
.geo-form select{ flex:1; border:1px solid var(--line); border-radius:10px; padding:.45rem .6rem; font-size:.82rem; font-weight:600; color:var(--ink); background:#fff; }
.geo-form select:focus{ outline:0; border-color:var(--geo-1); }

/* ---------- Comparison ---------- */
.cmp-wrap{ border:1px solid var(--line); border-radius:24px; overflow:hidden; }
.cmp-table{ margin:0; min-width:800px; }
.cmp-table thead th{ background:var(--soft); border-bottom:1px solid var(--line); font-size:.82rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:800; padding:1.1rem 1.15rem; vertical-align:middle; }
.cmp-table thead th.cmp-hl{ background:#eef0ff; color:var(--brand); }
.cmp-table tbody td{ padding:1.05rem 1.15rem; border-color:var(--line); font-size:.92rem; }
.cmp-table tbody tr:hover td{ background:#fafbff; }
.cmp-table tbody td:first-child{ font-weight:600; }
.cmp-table .cmp-hl{ background:#f7f8ff; }
.cmp-table .cmp-app{ background:#f3fbf9; }
.cmp-table .cmp-resale{ background:#fff5f7; }
.cmp-yes{ color:var(--success); font-size:1.05rem; }
.cmp-no{ color:#d1d5db; font-size:1.05rem; }
.cmp-app-tag{ display:inline-flex; align-items:center; gap:.35rem; background:var(--app-soft); color:var(--app-ink); border-radius:999px; padding:.22rem .6rem; font-size:.72rem; font-weight:800; }
.cmp-resale-tag{ display:inline-flex; align-items:center; gap:.35rem; background:var(--resale-soft); color:var(--resale-ink); border-radius:999px; padding:.22rem .6rem; font-size:.72rem; font-weight:800; }

/* ---------- FAQ ---------- */
.accordion-item{ border:1px solid var(--line); border-radius:16px!important; margin-bottom:.8rem; overflow:hidden; }
.accordion-button{ font-weight:700; font-size:1rem; padding:1.2rem 1.35rem; color:var(--ink); background:#fff; }
.accordion-button:not(.collapsed){ background:#f7f8ff; color:var(--brand); box-shadow:none; }
.accordion-button:focus{ box-shadow:none; border-color:transparent; }
.accordion-button::after{ background-size:1rem; }
.accordion-body{ color:var(--muted); font-size:.94rem; line-height:1.75; padding-top:0; }

/* ---------- CTA ---------- */
.cta-band{ border-radius:30px; padding:3.4rem 2.6rem; color:#fff; position:relative; overflow:hidden;
  background: radial-gradient(700px 340px at 90% 0%, rgba(245,158,11,.24), transparent 62%),
              radial-gradient(560px 300px at 5% 100%, rgba(225,29,72,.18), transparent 60%),
              linear-gradient(135deg,#4f46e5,#7c3aed 55%,#312e81);
}
.cta-band::after{ content:""; position:absolute; width:380px;height:380px;border-radius:50%; background:rgba(255,255,255,.07); right:-100px; bottom:-160px; }

/* ---------- Footer ---------- */
footer{ background:#0b1020; color:rgba(255,255,255,.66); padding:72px 0 28px; }
footer h6{ color:#fff; font-weight:800; font-size:.82rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem; display:flex; align-items:center; gap:.4rem; }
footer h6 .mdi{ color:var(--gold-1); font-size:1rem; }
footer a{ color:rgba(255,255,255,.66); font-size:.92rem; display:flex; align-items:center; gap:.4rem; padding:.3rem 0; transition:.2s; }
footer a:hover{ color:#fff; padding-left:5px; }
footer a .mdi{ font-size:.9rem; opacity:.5; }
footer a:hover .mdi{ opacity:1; color:var(--gold-1); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); margin-top:2.8rem; padding-top:1.5rem; font-size:.85rem; }
.soc{ width:38px;height:38px;border-radius:11px;display:grid; place-items:center; background:rgba(255,255,255,.08); color:#fff; transition:.2s; }
.soc:hover{ background:var(--brand); color:#fff; }

/* ---------- Toast ---------- */
.toast-container{ z-index:1090; }
.toast{ border-radius:14px; border:1px solid var(--line); box-shadow:0 20px 44px rgba(20,20,60,.18); }

/* ========== FLOATING CHAT ========== */
.floating-chat{
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:1080;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.85rem;
  pointer-events:none;
}
.floating-chat > *{ pointer-events:auto; }

.fc-btn{
  width:60px; height:60px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--wa),#128c7e);
  color:#fff;
  border:0;
  font-size:1.7rem;
  display:grid;
  place-items:center;
  box-shadow:0 15px 35px rgba(37,211,102,.45), 0 4px 12px rgba(0,0,0,.15);
  cursor:pointer;
  position:relative;
  transition:.28s cubic-bezier(.2,.9,.3,1);
}
.fc-btn:hover{
  transform:scale(1.08);
  box-shadow:0 20px 45px rgba(37,211,102,.6), 0 6px 16px rgba(0,0,0,.2);
}
.fc-btn:active{ transform:scale(.96); }
.fc-btn .fc-icon-main,
.fc-btn .fc-icon-close{
  display:grid;
  place-items:center;
  transition:.25s;
}
.fc-btn .fc-icon-close{
  display:none;
  font-size:1.4rem;
}
.fc-btn.active .fc-icon-main{ display:none; }
.fc-btn.active .fc-icon-close{ display:grid; }
.fc-pulse{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:rgba(37,211,102,.5);
  animation:fc-pulse 2.2s ease-out infinite;
  z-index:-1;
  pointer-events:none;
}
.fc-btn.active .fc-pulse{ display:none; }
@keyframes fc-pulse{
  0%{ transform:scale(1); opacity:.65; }
  80%{ transform:scale(1.75); opacity:0; }
  100%{ transform:scale(1.75); opacity:0; }
}

.fc-panel{
  background:#fff;
  border-radius:22px;
  box-shadow:0 30px 70px rgba(4,8,24,.35), 0 0 0 1px rgba(20,20,60,.05);
  padding:1.15rem;
  width:310px;
  max-width:calc(100vw - 2rem);
  display:none;
  opacity:0;
  transform:translateY(12px) scale(.95);
  transform-origin:bottom right;
  transition:opacity .25s ease, transform .28s cubic-bezier(.2,.9,.3,1);
}
.fc-panel.active{
  display:block;
  opacity:1;
  transform:translateY(0) scale(1);
}
.fc-head{
  display:flex;
  align-items:center;
  gap:.75rem;
  margin-bottom:.9rem;
  position:relative;
}
.fc-avatar{
  width:42px;height:42px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--wa),#128c7e);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:1.25rem;
  flex:0 0 auto;
  position:relative;
}
.fc-avatar::after{
  content:"";
  position:absolute;
  bottom:0; right:0;
  width:12px; height:12px;
  border-radius:50%;
  background:#4ade80;
  border:2px solid #fff;
}
.fc-name{
  font-weight:800;
  font-size:.95rem;
  color:var(--ink);
  letter-spacing:-.02em;
}
.fc-status{
  font-size:.72rem;
  color:var(--success);
  font-weight:700;
  display:flex;
  align-items:center;
  gap:.3rem;
  margin-top:.15rem;
}
.fc-status::before{
  content:"";
  width:6px;height:6px;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px rgba(18,161,80,.15);
}
.fc-close{
  margin-left:auto;
  background:transparent;
  border:0;
  color:var(--muted);
  font-size:1.1rem;
  cursor:pointer;
  padding:.15rem;
  border-radius:8px;
  transition:.2s;
  line-height:1;
}
.fc-close:hover{ color:var(--ink); background:var(--soft); }

.fc-greeting{
  font-size:.84rem;
  color:var(--muted);
  margin-bottom:1rem;
  line-height:1.5;
  padding:.7rem .85rem;
  background:var(--soft);
  border-radius:12px;
  position:relative;
}
.fc-greeting strong{ color:var(--ink); }

.fc-actions{ display:grid; gap:.4rem; }
.fc-action{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.7rem .85rem;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  transition:.2s;
  text-decoration:none;
}
.fc-action:hover{
  border-color:var(--brand);
  background:#fafaff;
  transform:translateX(2px);
  color:var(--ink);
}
.fc-action > i{
  width:34px;height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-size:1.1rem;
  color:#fff;
  flex:0 0 auto;
}
.fc-action.wa > i{ background:linear-gradient(135deg,#25d366,#128c7e); }
.fc-action.phone > i{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); }
.fc-action.email > i{ background:linear-gradient(135deg,var(--email-1),var(--email-2)); }
.fc-action.form > i{ background:linear-gradient(135deg,var(--gold-1),var(--gold-2)); }
.fc-action b{
  display:block;
  font-size:.86rem;
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--ink);
}
.fc-action small{
  display:block;
  font-size:.72rem;
  color:var(--muted);
  font-weight:600;
  margin-top:.1rem;
}

/* ---------- Responsive ---------- */
@media (max-width:991.98px){
  .device-pair{ height:240px; margin-bottom:1.5rem; }
  .device.d1{ width:120px; height:230px; left:8%; }
  .device.d2{ width:130px; height:250px; right:10%; }
  .hero{ padding:176px 0 80px; }
  .topbar{ font-size:.72rem; padding:.4rem 0; }
  .topbar .container{ gap:.6rem; }
}
@media (max-width:767px){
  .topbar-left .divider,
  .topbar-left .topbar-extra{ display:none !important; }
}
@media (max-width:575.98px){
  .section{ padding:64px 0; }
  .hero{ padding:150px 0 60px; }
  .search-shell{ border-radius:22px; flex-wrap:wrap; padding:14px; }
  .search-shell .icon-pill{ display:none; }
  .search-shell .form-control{ width:100%; padding:.4rem .2rem; }
  .search-shell .suffix{ border-left:0; padding-left:0; }
  .search-shell .btn{ width:100%; }
  .price .amt,.app-price .amt{ font-size:2.15rem; }
  .cta-band,.lead-hero,.app-hero,.resale-hero{ padding:2.4rem 1.5rem; }
  .premium-showcase{ padding:1.6rem; }
  .bundle-band{ padding:1.5rem; }
  .resale-price-line .amt{ font-size:1.75rem; }
  .brand-name{ font-size:1.15rem; }
  .brand-sub{ font-size:.55rem; letter-spacing:.12em; }
  .brand-mark{ width:40px; height:40px; }
  .topbar{ font-size:.7rem; }
  .topbar-right a:not(.btn-topbar-cta){ display:none; }
  .topbar-right{ gap:.5rem; }
  .floating-chat{ bottom:1rem; right:1rem; }
  .fc-btn{ width:54px; height:54px; font-size:1.5rem; }
  .fc-panel{ width:calc(100vw - 2rem); }
  .mkt-badge{ width:50px; height:50px; font-size:1.35rem; }
  .mkt-price .amt{ font-size:1.3rem; }
}