/* ============================================================
   Solvence gold theme (transformation step 3, 2026-07-14).
   Inner pages only (services / plans / about / contact / payments):
   brings them onto the homepage's black / blue / gold system.
   Loads AFTER styles.css; later-file order does the overriding.
   The homepage gets the same treatment from hero-ribbon.css
   (scoped body.story-dark); consolidation is a cleanup task for
   when styles.css itself is rewritten.

   Palette (owner brief): near-black #050505 · navy #12335F ·
   royal blue #2A6BE2 (artwork-sampled) · gold #D4A84F ·
   text #F7F9FC
   ============================================================ */

:root {
  --bg: #050505;
  --bg-2: #07080C;
  --panel: #0B0D13;
  --panel-2: #10131B;
  --gold: #D4A84F;
  --gold-soft: #DDBA6E;
  --gold-hot: #F3DCA8;
  /* artwork-matched royal blue family (sampled from the reference mock) */
  --primary: #1D6BE8;
  --primary-dark: #0549B4;
  --accent: #2A6BE2;
  --baby: #6FA5EF;
  --baby-soft: #9FC2F5;
}

/* ---------- backdrop: one black canvas, navy light from above ---------- */
.bg {
  background:
    radial-gradient(90% 60% at 78% -8%, rgba(18, 51, 95, 0.55) 0%, rgba(5, 5, 5, 0) 60%),
    radial-gradient(70% 55% at 8% 30%, rgba(18, 51, 95, 0.28) 0%, rgba(5, 5, 5, 0) 65%),
    linear-gradient(180deg, #050505 0%, #040507 100%);
}
.bg-beam { display: none; }
.bg-orb { opacity: .26; }
.bg-grid { opacity: .55; }

.site-header {
  background: rgba(5, 5, 5, 0.35);
  border-bottom-color: rgba(247, 249, 252, 0.06);
}
.site-header .brand-logo { height: 62px; }
@media (max-width: 560px) { .site-header .brand-logo { height: 48px; } }
@media (min-width: 900px) { .nav-links { gap: 2.2rem; } }
.nav-links a { position: relative; font-size: clamp(.96rem, .82vw, 1.35rem); }
.nav-links a[aria-current="page"]::after {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: -8px; width: 22px; height: 2px; border-radius: 2px;
  background: #2A6BE2;
}
@media (min-width: 1800px) {
  .nav { height: 100px; }
  .site-header .brand-logo { height: 84px; }
  .nav-links { gap: 3.4rem; }
  .nav-cta { padding: 1.15rem 2.1rem; font-size: 1.2rem; }
}
.nav-cta, .nav-cta:hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 4px 14px -6px rgba(29, 107, 232, 0.40);
}

/* ---------- gold voice on shared components ---------- */
.eyebrow {
  color: var(--gold-soft);
  border-color: rgba(212, 168, 79, 0.30);
  background: rgba(212, 168, 79, 0.05);
}
.eyebrow::before {
  background: var(--gold);
  box-shadow: 0 0 8px rgba(212, 168, 79, 0.8);
}

.btn-primary {
  background: linear-gradient(180deg, #1D6BE8 0%, #0549B4 100%);
  color: #fff;
  border: 1px solid rgba(80, 140, 240, 0.45);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 10px 30px -8px rgba(29, 107, 232, 0.50);
}
.btn-primary:hover {
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 14px 36px -8px rgba(29, 107, 232, 0.65);
}
.btn-ghost {
  background: rgba(212, 168, 79, 0.06);
  color: var(--gold-soft);
  border: 1px solid rgba(212, 168, 79, 0.50);
}
.btn-ghost:hover {
  background: rgba(212, 168, 79, 0.14);
  border-color: rgba(221, 186, 110, 0.75);
  color: var(--gold-hot);
}

.card {
  background: rgba(255, 255, 255, 0.030);
  border-color: rgba(150, 175, 205, 0.13);
}
.card .ico {
  background: rgba(212, 168, 79, 0.07);
  border-color: rgba(212, 168, 79, 0.35);
  color: var(--gold);
  box-shadow: none;
}
.card-hover:hover .ico {
  background: rgba(212, 168, 79, 0.16);
  color: var(--gold-hot);
  box-shadow: 0 10px 26px -8px rgba(212, 168, 79, 0.45);
}
.card-hover:hover {
  border-color: rgba(212, 168, 79, 0.35);
  box-shadow: var(--shadow), 0 0 44px rgba(212, 168, 79, 0.10);
}

.value-num { color: var(--gold); }
.price-card.featured {
  border-color: rgba(212, 168, 79, 0.40);
  box-shadow: var(--shadow), 0 0 44px rgba(212, 168, 79, 0.12);
}
.price-tag {
  color: #1A1204;
  background: linear-gradient(180deg, #EDCB86, var(--gold));
  box-shadow: 0 8px 20px -6px rgba(212, 168, 79, 0.7);
}
.feature-list li::before {
  background: rgba(212, 168, 79, 0.10) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23D4A84F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
  border-color: rgba(212, 168, 79, 0.35);
}

.pill { border-color: rgba(150, 175, 205, 0.16); }
.pill svg { color: var(--gold); }
.tag { border-color: rgba(150, 175, 205, 0.16); }

/* contact page: gold instruments, blue focus (focus stays high-contrast) */
.contact-meta .ico {
  background: rgba(212, 168, 79, 0.10);
  border: 1px solid rgba(212, 168, 79, 0.40);
  color: var(--gold);
  box-shadow: none;
}

.cta-band {
  background:
    radial-gradient(120% 130% at 80% 0%, rgba(18, 51, 95, 0.75), rgba(5, 6, 10, 0.85)),
    #05060A;
  border-color: rgba(212, 168, 79, 0.32);
  box-shadow: var(--shadow-lg), 0 0 60px rgba(212, 168, 79, 0.10);
}
.cta-band .eyebrow { background: rgba(212, 168, 79, 0.08); }
