/* Light editorial homepage inspired by the supplied reference. */
.home-page { background: #fff; color: #1c1d1e; }
.home-page .hero h1, .home-page .hero-description > p:first-child { font-family: "Cascadia Code", "Cascadia Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace; }
.home-banner { background: #6450ed; color: #fff; text-align: center; padding: .55rem 1rem; font-size: .8125rem; }
.home-banner a:hover { color: #fff; text-decoration: underline; }
.home-banner span { margin-left: .75rem; }
.home-page .site-header { padding: 1.5rem max(5%, calc((100% - 80rem) / 2)); background: #fff; border-bottom: .0625rem solid #eff0ed; gap: 2rem; }
.home-page .site-header nav { font-size: .875rem; }
.home-page .landing { background-image: linear-gradient(#eef0ed99 .0625rem, transparent .0625rem), linear-gradient(90deg, #eef0ed99 .0625rem, transparent .0625rem); background-size: 2.5rem 2.5rem; }
.home-page .hero { display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 10%; text-align: left; width: 88%; max-width: 80rem; margin: auto; padding: 4.5rem 0 2rem; overflow: visible; }
.home-page .hero .eyebrow { font-size: .6875rem; letter-spacing: .08em; color: #636861; }
.home-page .hero h1 { font-size: clamp(3.5rem, 6.7vw, 6.5rem); font-weight: 550; letter-spacing: -.055em; line-height: 1.04; margin: 1.25rem 0 0; }
.home-page .hero h1 span { color: #1c1d1e; }
.hero-description { padding-top: 2rem; }
.hero-description > p:first-child { font-size: clamp(1.25rem, 1.9vw, 1.65rem); line-height: 1.45; letter-spacing: -.02em; margin-bottom: .75rem; }
.hero-description .hero-support { font-size: .9375rem; color: #656963; line-height: 1.7; }
.home-page .hero .hero-actions { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: .8rem; margin: 1.5rem 0 0; }
.home-page .hero .button.secondary { background: #fff; color: #283d2d; border-color: #cdd6ca; }
.home-page .hero .button.secondary:hover { background: #f1f4ee; }
.home-page .button { background: #202820; border-color: #202820; border-radius: .25rem; }
.home-page .hero .button { padding: .8rem 1.15rem; }
.home-page .hero .text-link { font-size: .8125rem; }
.home-page .technology-carousel { margin: 3.5rem auto 2rem; max-width: 80rem; }
.home-page .technology-carousel .kicker { margin-bottom: 1rem; }
.home-page .technology-carousel .kicker h2 { font-size: .625rem; }
.home-page .technology-carousel .tech-chip { background: #ffffffd9; border-color: #e6e9e2; height: 2.75rem; }
.home-page .technology-carousel .marquee { margin-bottom: .5rem; }
.home-page .technology-carousel .carousel-bottom { margin-top: .25rem; min-height: 1.75rem; }
.home-page .preview-stage { width: 88%; max-width: 80rem; margin: 2.5rem auto 5rem; padding: 4rem 3.5rem 0; border-radius: .4rem; overflow: hidden; background: radial-gradient(ellipse at 15% 95%, #e8d4ad 0, transparent 48%), radial-gradient(ellipse at 90% 5%, #b8cfd2, transparent 55%), linear-gradient(145deg, #527c87, #86a5a4 60%, #d5c9ad); box-shadow: inset 0 0 0 .0625rem #526e7422; }
.home-page .preview { transform: scale(var(--preview-scale, .9)); transform-origin: center bottom; box-shadow: 0 1rem 4rem #203c4430; border-radius: .55rem .55rem 0 0; }
.home-page .home-stack { background: #fff; padding: 2rem 5% 4rem; }
.home-page .how { background: #fff; padding: 4rem 2rem; }
.home-page .home-features { background: #fff; padding: 0 2rem; }
.home-page .home-feature { border-top: .0625rem solid #e4e8e1; padding: 4rem 0; }
.home-page .feature-board, .home-page .feature-matrix, .home-page .feature-toolkit { border-radius: .4rem; box-shadow: none; }
.home-page .closing { width: min(40rem, 88%); margin: 3rem auto 5rem; padding: 2rem 0; background: transparent; border: 0; border-radius: 0; display: flex; flex-direction: column; align-items: center; gap: 1.5rem; text-align: center; }
.home-page .closing h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-bottom: 1rem; }
.home-page .closing p { max-width: 34rem; margin: 0 auto; color: var(--muted); line-height: 1.8; }
@media (max-width: 55rem) {
  .home-page .hero { gap: 5%; grid-template-columns: 1fr 1fr; padding-top: 3rem; }
  .home-page .preview-stage { padding: 2rem 1.5rem 0; }
  .home-page .site-header { padding: 1.25rem 5%; }
}
@media (max-width: 38rem) {
  .home-page .hero { grid-template-columns: 1fr; gap: 0; }
  .home-page .hero h1 { font-size: clamp(3.5rem, 16vw, 5rem); }
  .hero-description { padding-top: 1.5rem; }
  .home-page .site-header { justify-content: center; }
  .home-page .site-header nav { flex-wrap: wrap; justify-content: center; }
  .home-page .preview-stage { width: 94%; padding: 1.25rem .65rem 0; }
  .home-page .preview { transform: none; }
  .home-page .how, .home-page .home-features { padding-left: 0; padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .home-page .preview { transform: none; } }

.home-page .dashboard-preview-image { display: block; width: 100%; height: auto; }

/* Let the dashboard screenshot fill the preview container. */
.home-page .preview-stage { position: relative; z-index: 1; padding: 0; margin-bottom: 0; background: none; box-shadow: none; }
.home-page .preview-stage .preview { width: 100%; max-width: none; margin: 0; transform: none; box-shadow: none; }

.home-page .step-illustration { display: block; width: 2.75rem; height: 2.75rem; object-fit: contain; margin-bottom: 1rem; }

.home-page .steps { margin-top: 4rem; }
.home-page .steps article { border-top: 0; padding-top: 0; }

.feature-scores { min-width: 0; background: #eff3ec; border: 1px solid #dce4d7; border-radius: .4rem; padding: 2rem; }
.feature-scores-heading, .profile-score-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; }
.feature-scores-heading { margin-bottom: 1.25rem; }
.feature-scores-heading h3 { margin: 0; }
.feature-scores-heading > span { color: #656963; font-size: .75rem; }
.profile-score { background: #fff; border: 1px solid #dce4d7; border-radius: .4rem; padding: 1.25rem; margin-top: .85rem; }
.profile-score h4 { display: flex; align-items: center; gap: .6rem; margin: 0; font-size: 1rem; }
.profile-score h4 img { width: 1.5rem; height: 1.5rem; object-fit: contain; }
.profile-score-value { display: flex; align-items: baseline; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.profile-score-value strong { font-size: 2.5rem; line-height: 1.2; color: #365d40; }
.profile-score-value strong span { font-size: 1.25rem; }
.profile-score-value > span, .home-page .profile-score p { font-size: .75rem; color: #656963; }
.home-page .profile-score p { margin: .5rem 0 0; line-height: 1.6; }
.home-page .feature-scores-note { font-size: .8125rem; margin: 1.25rem 0 0; line-height: 1.6; }
.score-availability { display: block; margin-top: 1rem; color: #656963; line-height: 1.6; }
@media (max-width: 38rem) { .feature-scores { padding: 1.25rem; } }

.home-footer { align-items: center; flex-wrap: wrap; }
.home-footer nav { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; }
.home-footer a:hover { text-decoration: underline; }
.privacy-content { width: min(44rem, 90%); margin: 4rem auto; line-height: 1.8; }
.privacy-content h1 { margin-bottom: 1.5rem; }
.privacy-content h2 { margin: 1.5rem 0 .5rem; font-size: 1.25rem; }