:root{
  --dc-ice:#FDFEFF;
  --dc-cyan:#00CFE8;
  --dc-indigo:#3F51B5;
  --dc-navy:#10152A;
  --dc-gold:#D8B45A;
  --dc-soft:#F1F7FF;
  --dc-card:rgba(255,255,255,.82);
  --dc-border:rgba(63,81,181,.18);
  --dc-shadow:0 24px 70px rgba(16,21,42,.14);
}
*{box-sizing:border-box}
body.kingdom-commerce{
  margin:0;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  color:var(--dc-navy);
  background:
    radial-gradient(circle at top left, rgba(0,207,232,.26), transparent 28rem),
    radial-gradient(circle at top right, rgba(63,81,181,.22), transparent 26rem),
    linear-gradient(135deg,#FDFEFF 0%,#F3FBFF 48%,#F7F5FF 100%);
  min-height:100vh;
}
.dc-page{max-width:1220px;margin:0 auto;padding:24px}
.dc-hero{
  position:relative;
  overflow:hidden;
  border:1px solid var(--dc-border);
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(241,247,255,.76));
  box-shadow:var(--dc-shadow);
  padding:42px;
}
.dc-hero:before{
  content:"";
  position:absolute;
  inset:-40%;
  background:conic-gradient(from 120deg,transparent,rgba(0,207,232,.28),transparent,rgba(216,180,90,.22),transparent);
  animation:dc-aurora 10s linear infinite;
}
.dc-hero>*{position:relative;z-index:1}
@keyframes dc-aurora{to{transform:rotate(360deg)}}
.dc-badge{
  display:inline-flex;gap:8px;align-items:center;
  padding:10px 14px;border-radius:999px;
  background:rgba(0,207,232,.12);
  border:1px solid rgba(0,207,232,.32);
  font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:12px;
}
.dc-hero h1{font-size:clamp(36px,6vw,72px);line-height:1;margin:18px 0 14px;letter-spacing:-.05em}
.dc-hero p{font-size:clamp(16px,2.1vw,22px);line-height:1.65;max-width:850px;color:#34405F}
.dc-cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px}
.dc-btn{
  appearance:none;border:0;text-decoration:none;cursor:pointer;
  padding:15px 22px;border-radius:18px;font-weight:900;
  background:linear-gradient(135deg,var(--dc-cyan),var(--dc-indigo));
  color:white;box-shadow:0 12px 34px rgba(63,81,181,.28);
  transform:translateY(0);transition:.24s ease;
}
.dc-btn:hover{transform:translateY(-2px);filter:saturate(1.08)}
.dc-btn.secondary{background:white;color:var(--dc-indigo);border:1px solid var(--dc-border)}
.dc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:18px;margin:28px 0}
.dc-card{
  border:1px solid var(--dc-border);
  background:var(--dc-card);
  backdrop-filter:blur(16px);
  border-radius:28px;
  padding:24px;
  box-shadow:0 16px 45px rgba(16,21,42,.08);
}
.dc-card h2,.dc-card h3{margin:0 0 10px;letter-spacing:-.03em}
.dc-chip{display:inline-flex;margin:5px 6px 5px 0;padding:8px 11px;border-radius:999px;background:#fff;border:1px solid var(--dc-border);font-weight:750;font-size:13px}
.dc-price{font-size:28px;font-weight:950;color:var(--dc-indigo)}
.dc-filter{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:22px 0;
  border:1px solid var(--dc-border);background:rgba(255,255,255,.72);border-radius:24px;padding:16px;
}
.dc-filter input,.dc-filter select,.dc-form input,.dc-form select,.dc-form textarea{
  width:100%;padding:13px 14px;border:1px solid rgba(63,81,181,.22);border-radius:16px;background:white;font:inherit;
}
.dc-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.dc-form .wide{grid-column:1/-1}
.dc-secure-note{font-size:13px;color:#4D5A76;background:#F7FBFF;border:1px solid var(--dc-border);border-radius:18px;padding:12px}
.dc-robot{
  position:absolute;right:38px;bottom:24px;width:120px;height:120px;border-radius:36px;
  background:linear-gradient(135deg,#fff,#EAFBFF);
  border:1px solid rgba(0,207,232,.32);
  box-shadow:0 20px 55px rgba(0,207,232,.18);
}
.dc-robot:before{content:"";position:absolute;left:28px;right:28px;top:30px;height:30px;border-radius:18px;background:linear-gradient(90deg,var(--dc-cyan),var(--dc-indigo))}
.dc-robot:after{content:"DC Care";position:absolute;left:0;right:0;bottom:24px;text-align:center;font-size:12px;font-weight:950;color:var(--dc-indigo)}
.dc-reveal{opacity:0;transform:translateY(16px);transition:.6s ease}
.dc-reveal.is-visible{opacity:1;transform:none}
@media(max-width:760px){.dc-page{padding:14px}.dc-hero{padding:26px}.dc-robot{display:none}.dc-hero h1{font-size:38px}}