/* ══════════════════════════════════════
   SHERRY SCRAWLS — CLARITY REFRESH (Oct 2026)
   Loaded after style.css / theme.css on every page.
   Goal: calmer, more readable typography; one accent; clear hierarchy.
══════════════════════════════════════ */

html { scroll-behavior: smooth; }

/* Headlines: upright, sentence case, tighter, balanced */
.hero-headline,
.section-heading,
.contact-hero-headline,
.contact-cta-heading {
  font-style: normal;
  text-transform: none;
  font-weight: 800;
  letter-spacing: -0.035em;
  text-wrap: balance;
}
.hero-headline { font-size: clamp(2.6rem, 6.2vw, 5.4rem); line-height: 1.02; }
.section-heading { font-size: clamp(2rem, 4.2vw, 3.4rem); line-height: 1.06; }
.hero-headline em, .section-heading em, .accent-lime, .accent-blue { font-style: normal; }

/* One accent color in headlines (lime); blue stays for UI only */
.section-heading .accent-blue, .hero-headline .accent-blue { color: var(--lime); }
[data-theme="light"] .section-heading .accent-blue,
[data-theme="light"] .section-heading .accent-lime { color: var(--blue); }

/* Calmer labels and buttons */
.section-label, .hero-badge { letter-spacing: 0.14em; }
.btn { letter-spacing: 0.06em; font-size: 0.85rem; }
.btn:active { transform: translateY(1px) scale(0.99); }
:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

/* Readable body copy */
.body-text, .hero-sub, .qe-sub { line-height: 1.7; text-wrap: pretty; }
.hero-sub { color: rgba(255,255,255,0.78); max-width: 60ch; }
p { text-wrap: pretty; }

/* Hero: copy left, offer card right */
.hero-inner.hero-split {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.8fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  max-width: 1320px;
}
.hero-split .hero-ctas { margin-bottom: 1.4rem; }
.hero-card {
  background: rgba(13, 20, 25, 0.86);
  border: 1px solid rgba(198, 220, 0, 0.45);
  padding: 2rem;
  position: relative;
  box-shadow: 0 30px 80px -30px rgba(0, 40, 220, 0.45);
  backdrop-filter: blur(6px);
}
.hero-card .hc-tag {
  font-family: var(--font-head); font-weight: 700; font-size: 0.7rem;
  letter-spacing: 0.14em; color: var(--lime); text-transform: uppercase;
}
.hero-card .hc-title {
  font-family: var(--font-head); font-weight: 800; font-size: 1.45rem;
  line-height: 1.2; color: #fff; margin: 0.6rem 0 1rem; letter-spacing: -0.02em;
}
.hero-card ul { list-style: none; padding: 0; margin: 0 0 1.2rem; }
.hero-card li {
  padding: 0.55rem 0 0.55rem 1.6rem; position: relative; color: rgba(255,255,255,0.86);
  border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 0.98rem; line-height: 1.4;
}
.hero-card li::before { content: "✓"; position: absolute; left: 0; color: var(--lime); font-weight: 700; }
.hero-card .hc-price {
  font-family: var(--font-head); font-weight: 800; color: #fff; font-size: 1.9rem;
  letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
}
.hero-card .hc-price small { font-size: 0.85rem; color: rgba(255,255,255,0.6); font-weight: 600; letter-spacing: 0; }
.hero-card .hc-guar {
  margin-top: 1rem; padding: 0.8rem 1rem; background: rgba(198,220,0,0.1);
  border-left: 3px solid var(--lime); color: #fff; font-weight: 700; font-size: 0.95rem; line-height: 1.4;
}
.hero-card .hc-link {
  display: inline-block; margin-top: 1.1rem; color: var(--lime); font-family: var(--font-head);
  font-weight: 700; font-size: 0.9rem; text-decoration: none;
}
.hero-card .hc-link:hover { text-decoration: underline; }
@media (max-width: 960px) {
  .hero-inner.hero-split { grid-template-columns: 1fr; }
}

/* Offer section: small "other options" line under the price card */
.qe-alt { margin-top: 1.2rem; font-size: 0.92rem; color: var(--qm, rgba(255,255,255,.7)); line-height: 1.6; }
.qe-alt a { color: var(--qacc, var(--lime)); }

/* Step and card titles: sentence case reads faster */
.qe-step h3, .qe-path h3, .qe-guar h3 { text-transform: none; letter-spacing: -0.01em; font-size: 1.15rem; }
.qe-tier h3 { letter-spacing: -0.01em; }

/* Tighter section rhythm so the page feels shorter */
.qe-sec { padding: clamp(4rem, 7vw, 5.5rem) 0; }

/* Stats strip: compact 2x2 on phones */
@media (max-width: 700px) {
  #stats .stats-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem 1rem; }
  #stats .stat-divider { display: none; }
}

/* Homepage offer: price card + free audit card stacked in the right column */
.qe-side { display: flex; flex-direction: column; gap: 1.2rem; }
.qe-side .qe-price { position: static; }
.qe-side .qe-free { background: var(--qbg2, #0d1419); }
.qe-side .qe-free .btn { align-self: stretch; }

/* Above the fold is visible immediately (no waiting for scroll-reveal JS) */
#hero .reveal-up, #hero .reveal-left, #hero .reveal-right,
#stats .reveal-up { opacity: 1; transform: none; transition: none; }