/* ═══════════════════════════════════════════════════════════
   LAMPSIDE — Brand Stylesheet
   Lamplight Amber · Parchment · Deep Canvas · Card Brown · Midnight
   Used inside .ls-section blocks within TDIH chrome
═══════════════════════════════════════════════════════════ */

:root {
  --ls-canvas: #1A1714;
  --ls-card: #252018;
  --ls-card2: #2E2820;
  --ls-amber: #C17B2E;
  --ls-amber-deep: #9A6020;
  --ls-amber-glow: #E9A84C;
  --ls-parchment: #F5DEB3;
  --ls-cream: #FFFAEC;
  --ls-midnight: #0D0D2B;
  --ls-muted: #B8A88E;
  --ls-border: rgba(193, 123, 46, 0.18);
  --ls-border-strong: rgba(193, 123, 46, 0.42);
}

/* The Lampside brand block — a warm dark island */
.ls-section {
  background: var(--ls-canvas);
  color: var(--ls-parchment);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  position: relative;
  overflow: hidden;
}

/* Atmospheric warm glow on every section — the lamplight that gives the brand its name */
.ls-section::before {
  content: '';
  position: absolute;
  top: -300px;
  left: 50%;
  transform: translateX(-50%);
  width: 1000px;
  height: 800px;
  background: radial-gradient(circle, rgba(193, 123, 46, 0.16) 0%, rgba(26, 23, 20, 0) 55%);
  pointer-events: none;
  z-index: 0;
}

.ls-section > * { position: relative; z-index: 1; }

/* Container */
.ls-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.ls-container-narrow {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* ─── TYPOGRAPHY ─────────────────────────────── */

.ls-section h1,
.ls-section h2,
.ls-section h3,
.ls-section h4 {
  font-family: 'Cinzel', 'Copperplate', 'Trajan Pro', serif;
  color: var(--ls-cream);
  letter-spacing: 0.04em;
  line-height: 1.2;
  font-weight: 500;
  text-transform: uppercase;
}

.ls-section h1 {
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: none; /* h1 stays mixed case for impact */
}
.ls-section h2 {
  font-size: clamp(1.4rem, 2.8vw, 1.9rem);
  font-weight: 500;
  letter-spacing: 0.06em;
}
.ls-section h3 {
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.ls-section p {
  color: var(--ls-muted);
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  line-height: 1.8;
  font-weight: 300;
}

.ls-section .ls-eyebrow {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ls-amber);
  margin-bottom: 1rem;
  display: block;
}

.ls-section .ls-scripture {
  font-family: 'IM Fell English', 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-size: 1.1rem;
  color: var(--ls-cream);
  line-height: 1.7;
  border-left: 2px solid var(--ls-amber);
  padding-left: 1.4rem;
  max-width: 540px;
  margin: 1.5rem 0;
  opacity: 0.92;
}

.ls-section .ls-scripture-ref {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ls-amber);
  margin-top: 0.6rem;
  display: block;
}

/* Inline body links (not buttons) — buttons have their own color rules below */
.ls-section a:not(.ls-btn):not(.ls-btn-primary):not(.ls-btn-ghost):not(.ls-appstore-btn):not(.ls-testflight-btn) {
  color: var(--ls-amber-glow);
  text-decoration: none;
  transition: color 0.15s;
  border-bottom: 1px solid transparent;
}
.ls-section a:not(.ls-btn):not(.ls-btn-primary):not(.ls-btn-ghost):not(.ls-appstore-btn):not(.ls-testflight-btn):hover {
  color: var(--ls-cream);
  border-bottom-color: var(--ls-amber);
}

/* ─── BUTTONS ─────────────────────────────── */

.ls-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 0.95rem 1.8rem;
  border-radius: 999px;
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.2s;
  border-bottom: 0;
}
.ls-btn-primary {
  background: linear-gradient(135deg, #E9A84C 0%, #C17B2E 100%);
  color: var(--ls-canvas);
  box-shadow: 0 4px 24px rgba(193, 123, 46, 0.3);
}
.ls-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(193, 123, 46, 0.45);
  color: var(--ls-canvas);
}
.ls-btn-ghost {
  background: transparent;
  color: var(--ls-cream);
  border: 1px solid var(--ls-border-strong);
}
.ls-btn-ghost:hover {
  background: rgba(193, 123, 46, 0.08);
  border-color: var(--ls-amber);
  color: var(--ls-cream);
}

/* App Store badge button */
.ls-appstore-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.9rem 1.6rem;
  background: var(--ls-cream);
  color: var(--ls-canvas);
  border-radius: 12px;
  font-family: 'Inter', sans-serif;
  text-decoration: none;
  border-bottom: 0;
  transition: all 0.2s;
  box-shadow: 0 4px 24px rgba(255, 250, 236, 0.15);
}
.ls-appstore-btn:hover {
  transform: translateY(-2px);
  background: white;
  color: var(--ls-canvas);
  border-bottom: 0;
}
.ls-appstore-btn .ls-as-small {
  font-size: 0.65rem;
  letter-spacing: 0.05em;
  opacity: 0.7;
  display: block;
  line-height: 1.2;
}
.ls-appstore-btn .ls-as-large {
  font-size: 1.1rem;
  font-weight: 600;
  display: block;
  line-height: 1.2;
}

/* TestFlight beta button — secondary, slightly less prominent */
.ls-testflight-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.7rem 1.3rem;
  background: transparent;
  color: var(--ls-amber-glow);
  border: 1px solid var(--ls-border-strong);
  border-radius: 12px;
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s;
  border-bottom: 0;
}
.ls-testflight-btn:hover {
  background: rgba(193, 123, 46, 0.08);
  border-color: var(--ls-amber);
  color: var(--ls-cream);
  border-bottom: 0;
}

/* ─── HERO ─────────────────────────────── */

.ls-section.ls-hero::before { display: none; }
.ls-hero {
  padding: 6rem 0 5rem;
  text-align: center;
  position: relative;
  background-image:
    linear-gradient(
      180deg,
      rgba(26, 23, 20, 0.78) 0%,
      rgba(26, 23, 20, 0.55) 35%,
      rgba(26, 23, 20, 0.7) 75%,
      rgba(26, 23, 20, 0.92) 100%
    ),
    url('/lampside/img/lampside-watercolor.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.ls-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(26, 23, 20, 0.45) 100%);
  pointer-events: none;
  z-index: 0;
}
.ls-hero > * { position: relative; z-index: 1; }
.ls-hero-logo {
  width: 110px;
  height: 110px;
  margin: 0 auto 2rem;
  display: block;
  border-radius: 24px;
  box-shadow:
    0 0 0 1px rgba(193, 123, 46, 0.4),
    0 0 60px rgba(233, 168, 76, 0.45),
    0 12px 48px rgba(0, 0, 0, 0.6),
    0 4px 16px rgba(0, 0, 0, 0.5);
}
.ls-hero h1 {
  margin-bottom: 1rem;
}
.ls-hero .ls-tagline {
  font-family: 'IM Fell English', 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1.05rem, 2vw, 1.3rem);
  color: var(--ls-amber-glow);
  margin-bottom: 0.5rem;
}
.ls-hero .ls-subhead {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  color: var(--ls-muted);
  max-width: 580px;
  margin: 1.5rem auto 2.5rem;
  line-height: 1.7;
}
.ls-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 2rem;
}

/* Subtle gold rule */
.ls-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--ls-amber) 50%, transparent 100%);
  margin: 0 auto;
  max-width: 600px;
  opacity: 0.4;
}

/* ─── SECTIONS ─────────────────────────────── */

.ls-section-pad {
  padding: 5rem 0;
}
.ls-section-pad-sm {
  padding: 3rem 0;
}

.ls-section-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 3.5rem;
}
.ls-section-head h2 {
  margin-bottom: 1rem;
}
.ls-section-head p {
  font-size: 1.05rem;
  color: var(--ls-muted);
}

/* ─── FEATURES GRID ─────────────────────────────── */

.ls-features {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 700px) {
  .ls-features { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1000px) {
  .ls-features.ls-features-3 { grid-template-columns: 1fr 1fr 1fr; }
}

.ls-feature {
  background: var(--ls-card);
  border: 1px solid var(--ls-border);
  border-radius: 18px;
  padding: 2rem;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}
.ls-feature::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top right, rgba(193, 123, 46, 0.08) 0%, transparent 50%);
  pointer-events: none;
}
.ls-feature:hover {
  border-color: var(--ls-border-strong);
  transform: translateY(-3px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.ls-feature-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(233, 168, 76, 0.18) 0%, rgba(193, 123, 46, 0.14) 100%);
  border: 1px solid var(--ls-border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  color: var(--ls-amber-glow);
  font-family: 'Cinzel', serif;
  font-weight: 600;
  font-size: 0.95rem;
}
.ls-feature h3 {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ls-cream);
  margin-bottom: 0.7rem;
  font-weight: 500;
}
.ls-feature p {
  color: var(--ls-muted);
  font-size: 0.95rem;
  line-height: 1.7;
}

/* ─── ADVENTURES GRID ─────────────────────────────── */

.ls-adventures {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
  max-width: 920px;
  margin: 0 auto;
}
@media (min-width: 540px) {
  .ls-adventures { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 800px) {
  .ls-adventures { grid-template-columns: 1fr 1fr 1fr; }
}

.ls-adventure {
  background: var(--ls-card);
  border: 1px solid var(--ls-border);
  border-radius: 14px;
  padding: 1.1rem 1.2rem;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.ls-adventure:hover {
  border-color: var(--ls-border-strong);
  background: var(--ls-card2);
  transform: translateY(-2px);
}
.ls-adventure-num {
  font-family: 'Cinzel', serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--ls-amber);
  background: rgba(193, 123, 46, 0.12);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ls-adventure-name {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.88rem;
  letter-spacing: 0.04em;
  color: var(--ls-cream);
  font-weight: 500;
  line-height: 1.3;
}

/* ─── MOODS PILL CLOUD ─────────────────────────────── */

.ls-moods {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 1.5rem;
}
.ls-mood {
  background: var(--ls-card);
  border: 1px solid var(--ls-border-strong);
  color: var(--ls-cream);
  padding: 0.55rem 1.2rem;
  border-radius: 999px;
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* ─── PRICING ─────────────────────────────── */

.ls-pricing {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  max-width: 880px;
  margin: 0 auto;
}
@media (min-width: 720px) {
  .ls-pricing { grid-template-columns: 1fr 1fr; }
}

.ls-price-card {
  background: var(--ls-card);
  border: 1px solid var(--ls-border);
  border-radius: 22px;
  padding: 2.5rem 2rem;
  position: relative;
  text-align: center;
}
.ls-price-card.featured {
  border-color: var(--ls-amber);
  background: linear-gradient(180deg, rgba(193, 123, 46, 0.1) 0%, var(--ls-card) 60%);
  box-shadow: 0 16px 48px rgba(193, 123, 46, 0.18);
}
.ls-price-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--ls-amber);
  color: var(--ls-canvas);
  font-family: 'Cinzel', serif;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.35rem 0.95rem;
  border-radius: 999px;
}
.ls-price-name {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.85rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ls-amber);
  margin-bottom: 0.5rem;
}
.ls-price {
  font-family: 'Cinzel', serif;
  font-size: 2.6rem;
  color: var(--ls-cream);
  font-weight: 600;
  line-height: 1;
  margin-bottom: 0.4rem;
}
.ls-price-cycle {
  color: var(--ls-muted);
  font-size: 0.9rem;
  margin-bottom: 1.8rem;
}
.ls-price-list {
  list-style: none;
  text-align: left;
  margin-bottom: 2rem;
  padding: 0;
}
.ls-price-list li {
  padding: 0.55rem 0;
  color: var(--ls-cream);
  font-size: 0.93rem;
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  line-height: 1.6;
  border-bottom: 1px solid rgba(193, 123, 46, 0.1);
}
.ls-price-list li:last-child { border-bottom: 0; }
.ls-price-list li::before {
  content: '✦';
  color: var(--ls-amber);
  font-size: 0.8rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
}

/* ─── COMING SOON BANNER ─────────────────────────────── */

.ls-coming-soon {
  background: var(--ls-card);
  border: 1px solid var(--ls-amber);
  border-radius: 18px;
  padding: 2rem;
  max-width: 540px;
  margin: 0 auto;
  text-align: center;
}
.ls-coming-soon-label {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ls-amber);
  margin-bottom: 0.6rem;
}
.ls-coming-soon-date {
  font-family: 'Cinzel', serif;
  font-size: 1.6rem;
  color: var(--ls-cream);
  margin-bottom: 0.4rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.ls-coming-soon-text {
  color: var(--ls-muted);
  font-size: 0.95rem;
  margin-bottom: 1.5rem;
}
.ls-form-row {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media (min-width: 540px) {
  .ls-form-row { flex-direction: row; }
}
.ls-input {
  flex: 1;
  background: var(--ls-canvas);
  border: 1px solid var(--ls-border-strong);
  color: var(--ls-cream);
  padding: 0.95rem 1.1rem;
  border-radius: 12px;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.15s;
}
.ls-input::placeholder { color: var(--ls-muted); opacity: 0.6; }
.ls-input:focus { border-color: var(--ls-amber); }

/* TestFlight beta link below form */
.ls-beta-link {
  display: block;
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 1px solid rgba(193, 123, 46, 0.18);
  font-size: 0.85rem;
  color: var(--ls-muted);
  font-family: 'Inter', sans-serif;
}
.ls-beta-link a {
  color: var(--ls-amber-glow);
  font-weight: 500;
}

/* ─── COMPARISON TABLE ─────────────────────────────── */

.ls-compare {
  background: var(--ls-card);
  border: 1px solid var(--ls-border);
  border-radius: 18px;
  overflow: hidden;
  max-width: 760px;
  margin: 0 auto;
}
.ls-compare table {
  width: 100%;
  border-collapse: collapse;
}
.ls-compare th,
.ls-compare td {
  padding: 1rem 1.2rem;
  text-align: left;
  border-bottom: 1px solid var(--ls-border);
  color: var(--ls-cream);
  font-size: 0.95rem;
  font-family: 'Inter', sans-serif;
}
.ls-compare th {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ls-amber);
  font-weight: 600;
  background: rgba(0, 0, 0, 0.2);
}
.ls-compare th.featured-col,
.ls-compare td.featured-col {
  background: rgba(193, 123, 46, 0.08);
}
.ls-compare tr:last-child td { border-bottom: 0; }
.ls-compare-yes {
  color: var(--ls-amber-glow);
  font-weight: 600;
}
.ls-compare-no {
  color: var(--ls-muted);
  opacity: 0.5;
}

/* ─── FAQ ─────────────────────────────── */

.ls-faq {
  max-width: 760px;
  margin: 0 auto;
}
.ls-faq-item {
  border-bottom: 1px solid var(--ls-border);
  padding: 1.4rem 0;
}
.ls-faq-q {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ls-cream);
  margin-bottom: 0.7rem;
  font-weight: 500;
}
.ls-faq-a {
  color: var(--ls-muted);
  font-size: 0.95rem;
  line-height: 1.75;
}

/* ─── BREADCRUMB ─────────────────────────────── */

.ls-breadcrumb {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ls-muted);
  text-align: center;
  padding: 1.6rem 0 0.5rem;
}
.ls-breadcrumb a {
  color: var(--ls-muted);
  border-bottom: 0;
}
.ls-breadcrumb a:hover { color: var(--ls-amber); }
.ls-breadcrumb-sep {
  margin: 0 0.7rem;
  color: var(--ls-amber);
}

/* ─── HOW IT WORKS — 4-step ─────────────────────────────── */

.ls-steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 1000px;
  margin: 0 auto;
}
@media (min-width: 540px) {
  .ls-steps { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1000px) {
  .ls-steps { grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1.5rem; }
}
.ls-step {
  text-align: center;
}
.ls-step-num {
  width: 56px;
  height: 56px;
  margin: 0 auto 1.2rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ls-amber) 0%, var(--ls-amber-deep) 100%);
  color: var(--ls-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cinzel', serif;
  font-size: 1.3rem;
  font-weight: 600;
  border: 1px solid var(--ls-border-strong);
  box-shadow: 0 0 32px rgba(193, 123, 46, 0.35);
}
.ls-step h3 {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.92rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.7rem;
  color: var(--ls-cream);
}
.ls-step p {
  color: var(--ls-muted);
  font-size: 0.92rem;
  line-height: 1.6;
}

/* "Light My Path" callout */
.ls-light-callout {
  margin: 3rem auto 0;
  max-width: 600px;
  text-align: center;
  background: linear-gradient(135deg, rgba(233, 168, 76, 0.12) 0%, rgba(193, 123, 46, 0.08) 100%);
  border: 1px solid var(--ls-amber);
  border-radius: 18px;
  padding: 2rem 1.5rem;
}
.ls-light-callout-eyebrow {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.7rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ls-amber-glow);
  margin-bottom: 0.5rem;
}
.ls-light-callout h3 {
  font-family: 'Cinzel', serif;
  font-size: 1.25rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ls-cream);
  margin-bottom: 0.6rem;
}
.ls-light-callout p {
  color: var(--ls-muted);
  font-size: 0.95rem;
}

/* ─── CTA BAND ─────────────────────────────── */

.ls-cta-band {
  text-align: center;
  padding: 5rem 1.5rem;
  background:
    radial-gradient(ellipse at top, rgba(193, 123, 46, 0.16) 0%, transparent 60%),
    radial-gradient(ellipse at bottom, rgba(233, 168, 76, 0.1) 0%, transparent 60%),
    var(--ls-canvas);
}
.ls-cta-band h2 {
  margin-bottom: 1rem;
  color: var(--ls-cream);
}
.ls-cta-band-sub {
  color: var(--ls-muted);
  font-size: 1.1rem;
  margin-bottom: 2.5rem;
  font-family: 'IM Fell English', 'Playfair Display', serif;
  font-style: italic;
}

/* ─── BACK TO TDIH ─────────────────────────────── */

.ls-back-to-tdih {
  text-align: center;
  padding: 2.5rem 1.5rem;
  background: #14110d;
  border-top: 1px solid var(--ls-border);
}
.ls-back-to-tdih-text {
  font-family: 'IM Fell English', 'Playfair Display', serif;
  font-style: italic;
  color: var(--ls-muted);
  font-size: 0.95rem;
  margin-bottom: 0.6rem;
}
.ls-back-to-tdih a {
  font-family: 'Cinzel', 'Copperplate', serif;
  font-size: 0.78rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ls-amber);
  border-bottom: 0;
}
.ls-back-to-tdih a:hover { color: var(--ls-amber-glow); }

/* Subtle drifting starfield (decorative, behind everything) */
.ls-starfield {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(1px 1px at 18% 22%, rgba(245, 222, 179, 0.2), transparent),
    radial-gradient(1px 1px at 75% 12%, rgba(245, 222, 179, 0.14), transparent),
    radial-gradient(1px 1px at 42% 58%, rgba(245, 222, 179, 0.16), transparent),
    radial-gradient(1px 1px at 88% 72%, rgba(245, 222, 179, 0.12), transparent),
    radial-gradient(1px 1px at 12% 88%, rgba(245, 222, 179, 0.15), transparent),
    radial-gradient(1px 1px at 60% 35%, rgba(245, 222, 179, 0.1), transparent);
  background-size: 800px 800px;
  pointer-events: none;
  opacity: 0.6;
}