:root {
  --gold:#c9a239;
  --gold-dark:#9f7f22;
  --ink:#0f1221;
  --muted:#7a7a7a;
  --bg:#0b0d17;
}

html,body{
  height:100%;
}

body {
  font-family: "Sora", sans-serif;
  background: radial-gradient(1500px 800px at 20% -10%, #1a1d2d 0%, #0b0d17 60%) fixed;
  background-color: #0b0d17; /* fallback for rest of the page */
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  color: #e7e9ee;
  min-height: 100vh;
}

.navbar-brand {
  font-weight:800; letter-spacing:.5px;
}

.badge-gold {
  background:linear-gradient(180deg, #d4b24c, #b38a1d);
  color:#111;
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset;
}

.btn-gold {
  background: linear-gradient(180deg, #e7c665, #b9932e);
  color:#111;
  border:0;
  box-shadow: 0 8px 20px rgba(185,147,46,.35);
}

.btn-gold:hover {
  filter:brightness(1.05); color:#000;
}

.btn-outline-gold {
  border:1px solid var(--gold);
  color:var(--gold);
}

.btn-outline-gold:hover {
  background:var(--gold);
  color:#111;
}

.hero {
  position:relative;
  padding: 96px 0 48px;
}

.hero h1 {
  font-weight:900;
  line-height:1.05;
}

.hero .lead {
  color:#b9bfd5;
}

.card-shot {
  width:100%;
  max-width:520px;
  aspect-ratio: 1.6/1;
  background: rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius: 22px;
  overflow:hidden;
  display:grid;
  place-items:center;
  box-shadow: 0 25px 60px rgba(0,0,0,.45);
}

.card-shot img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.section-title {
  font-weight:800;
  letter-spacing:.2px;
}

.pricing .plan {
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  padding: 28px;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.plan .qty {
  font-size: clamp(18px, 1.1vw + 16px, 22px);
  color:#cbd1e7;
}

.plan .price{
  font-size: clamp(28px, 2vw + 18px, 44px);
  font-weight:800;
}

.plan .cta {
  margin-top:auto;
}

.icon {
  width:24px;
  height:24px;
  display:inline-block;
  margin-right:8px;
  vertical-align:middle;
  opacity:.9;
}

.features .feature {
  background: rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  padding:18px;
  height:100%;
}

.faq .accordion-button {
  background:rgba(255,255,255,.03);
  color:#e7e9ee;
  border:1px solid rgba(255,255,255,.07);
}

.faq .accordion-body {
  color:#cbd1e7;
}

.ribbon {
  position:absolute;
  top:14px; left:14px;
  padding:6px 10px;
  border-radius:10px;
  font-size:12px;
}

.footer {
  color:#b9bfd5;
  border-top:1px dashed rgba(255,255,255,.1);
}

.smallprint {
  font-size:.875rem;
   color:#9aa1bb;
}