/* LifeByDesign website type system and hero readability pass. */

:root {
  --ivory: #F2ECDD;
  --cream: #FAF5E8;
  --cream-el: #FFFCF3;
  --ink: #1F2E2A;
  --ink-soft: #45554F;
  --ink-mut: #6B7A73;
  --ink-faint: #8A9590;
  --sage: #4F7A71;
  --sage-deep: #2D514A;
  --sage-night: #16302B;
  --sage-tint: #E6EDE9;
  --orange: #D4734A;
  --orange-deep: #B85A33;
  --sand: #F0D7B8;
  --paper-line: #E2D9C4;
  --paper-line-2: #D3C8AE;
  --font-display: "Newsreader", Georgia, serif;
  --font-ui: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
}

/* Site-wide type scale from Claude Design. */
.lbd-display {
  font-family: "Newsreader", Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(36px, 5vw, 60px) !important;
  line-height: 1.0 !important;
  letter-spacing: -0.03em !important;
  color: var(--ink) !important;
}
.lbd-h1 {
  font-family: "Newsreader", Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(32px, 3.4vw, 44px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.025em !important;
}
.lbd-h2 {
  font-family: "Newsreader", Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(25px, 2.4vw, 32px) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}
.lbd-h3 {
  font-family: "Newsreader", Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(20px, 1.7vw, 23px) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
}
.lbd-lede {
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 400 !important;
  font-size: clamp(17px, 1.45vw, 20px) !important;
  line-height: 1.55 !important;
  color: var(--ink-soft) !important;
  max-width: min(68ch, 100%) !important;
}
.lbd-body {
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 400 !important;
  font-size: clamp(16px, 1.18vw, 17px) !important;
  line-height: 1.65 !important;
  color: var(--ink-soft) !important;
  max-width: min(68ch, 100%);
}
.lbd-body-sm {
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 400 !important;
  font-size: clamp(13.5px, 1vw, 14.5px) !important;
  line-height: 1.6 !important;
  color: #5D6B64 !important;
}
.eyebrow,
.lbd-label {
  font-family: "JetBrains Mono", monospace !important;
  font-weight: 600 !important;
  font-size: clamp(13.5px, 1.04vw, 14.5px) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
.lbd-mono {
  font-family: "JetBrains Mono", monospace !important;
  font-variant-numeric: tabular-nums !important;
}

/* Dark surfaces keep a strong readable cream floor. */
.section--sage-deep .lbd-lede,
.section--sage-deep .lbd-body,
.section--sage-deep .lbd-body-sm {
  color: rgba(250, 245, 232, .86) !important;
}
.section--sage-deep .lbd-display,
.section--sage-deep .lbd-h1,
.section--sage-deep .lbd-h2,
.section--sage-deep .lbd-h3 {
  color: var(--cream-elevated) !important;
}

/* Hero revised composition. */
.lbd-home .lbd-hero-stage {
  min-height: clamp(620px, 76vh, 760px) !important;
  background-position: center 42% !important;
}
.lbd-home .lbd-hero-stage .reveal {
  z-index: 3 !important;
  max-width: min(1180px, 94vw) !important;
}
.lbd-home .lbd-hero-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 180px;
  background: linear-gradient(180deg, rgba(243, 233, 214, .9), transparent);
  pointer-events: none;
  z-index: 1;
}
.lbd-home .lbd-hero-stage::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 60%;
  background: linear-gradient(180deg, transparent 0%, rgba(242, 236, 221, .35) 42%, rgba(242, 236, 221, .82) 74%, #F2ECDD 100%);
  pointer-events: none;
  z-index: 1;
}

/* Remove the extra supporting sentence visually: hero becomes headline + one support line. */
.lbd-home .lbd-hero-stage .hz-hero-lede {
  display: none !important;
}

.lbd-home .lbd-hero-stage .hz-hero-h1 {
  position: relative !important;
  z-index: 0 !important;
  display: inline-block !important;
  max-width: 1040px !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(60px, 6.8vw, 88px) !important;
  line-height: 1.0 !important;
  letter-spacing: -0.03em !important;
  color: var(--ink) !important;
  text-shadow: none !important;
}
.lbd-home .lbd-hero-stage .hz-hero-h1::before {
  content: "";
  position: absolute;
  inset: -30px -60px;
  background: radial-gradient(ellipse at center, rgba(242, 236, 221, .86) 0%, rgba(242, 236, 221, .55) 55%, rgba(242, 236, 221, .12) 82%, transparent 100%);
  border-radius: 40px;
  pointer-events: none;
  z-index: -1;
}
.lbd-home .lbd-hero-stage .hz-hero-h1 .lbd-italic {
  font-family: "Newsreader", Georgia, serif !important;
  font-style: italic !important;
  font-weight: 500 !important;
  color: var(--orange-deep) !important;
}

/* Supporting line: plain editorial text on a soft radial text band, not a boxed pill. */
.lbd-home .lbd-hero-stage p.lbd-body.hz-hero-lede-extra {
  display: block !important;
  position: relative !important;
  max-width: 680px !important;
  margin: 26px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ink-soft) !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: clamp(17px, 1.45vw, 20px) !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  text-shadow: none !important;
}
.lbd-home .lbd-hero-stage p.lbd-body.hz-hero-lede-extra::before {
  content: "";
  position: absolute;
  inset: -14px -30px;
  background: radial-gradient(ellipse at center, rgba(242, 236, 221, .82) 0%, rgba(242, 236, 221, .3) 70%, transparent 100%);
  border-radius: 999px;
  z-index: -1;
}
.lbd-home .lbd-hero-stage .lbd-hero-cta-primary {
  margin-top: 0 !important;
  padding: 16px 32px !important;
  font-size: 16px !important;
  min-height: 44px !important;
  box-shadow: 0 12px 30px -8px rgba(212, 115, 74, .55) !important;
}
.lbd-home .lbd-hero-stage .lbd-hero-cta-primary + * {
  font-size: 0 !important;
  margin-top: 13px !important;
  color: var(--ink-mut) !important;
  text-shadow: none !important;
}
.lbd-home .lbd-hero-stage .lbd-hero-cta-primary + *::after {
  content: "No credit pull · no application · about a minute";
  font-family: "Inter", system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.6;
}

@media (max-width: 640px) {
  .lbd-home .lbd-hero-stage {
    min-height: 620px !important;
  }
  .lbd-home .lbd-hero-stage .hz-hero-h1 {
    font-size: clamp(36px, 10.5vw, 40px) !important;
    max-width: 360px !important;
  }
  .lbd-home .lbd-hero-stage .hz-hero-h1::before {
    inset: -18px -24px;
  }
  .lbd-home .lbd-hero-stage p.lbd-body.hz-hero-lede-extra {
    display: block !important;
    max-width: 330px !important;
    font-size: 17px !important;
  }
  .lbd-home .lbd-hero-stage .lbd-hero-cta-primary {
    width: min(320px, 92vw) !important;
    justify-content: center !important;
  }
}
