.landing-pro { background: #070b14; color: #e2e8f0; margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.lp-nav {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px clamp(16px, 4vw, 48px); position: sticky; top: 0; z-index: 20;
  background: rgba(7,11,20,.85); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.lp-nav nav { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.lp-nav nav a { color: #cbd5e1; text-decoration: none; font-weight: 600; font-size: .9rem; }
.lp-nav nav a:hover { color: #fff; }
.lp-hero {
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 40px;
  padding: 64px clamp(16px, 4vw, 48px) 48px; align-items: center;
  max-width: 1120px; margin: 0 auto;
}
.lp-hero .eyebrow {
  display: inline-block; color: #86efac; font-size: .75rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; margin-bottom: 12px;
}
.lp-hero h1 {
  margin: 0 0 14px; font-size: clamp(2rem, 4.5vw, 3rem);
  letter-spacing: -.03em; line-height: 1.12; color: #fff;
}
.lp-hero .lead { color: #94a3b8; font-size: 1.05rem; line-height: 1.6; max-width: 34rem; }
.lp-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0; }
.lp-cta .btn.ghost, .btn.ghost {
  background: transparent; color: #e2e8f0; border: 1px solid rgba(255,255,255,.15);
}
.lp-stats { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 12px; }
.lp-stats strong { display: block; font-size: 1.25rem; color: #fff; }
.lp-stats span { font-size: .8rem; color: #64748b; }
.lp-hero-card {
  background: linear-gradient(145deg, rgba(34,197,94,.2), rgba(99,102,241,.25));
  border: 1px solid rgba(255,255,255,.1); border-radius: 24px; padding: 28px;
  min-height: 280px; display: grid; place-items: center;
}
.mock-cv {
  width: 100%; max-width: 280px; background: #fff; border-radius: 12px;
  padding: 20px; box-shadow: 0 25px 50px rgba(0,0,0,.35);
}
.mock-bar { height: 10px; width: 40%; background: #22c55e; border-radius: 4px; margin-bottom: 16px; }
.mock-line { height: 8px; background: #e2e8f0; border-radius: 4px; margin-bottom: 10px; }
.mock-line.w80 { width: 80%; } .mock-line.w60 { width: 60%; } .mock-line.w90 { width: 90%; }
.mock-tags { display: flex; gap: 6px; margin-top: 16px; }
.mock-tags span { height: 22px; width: 48px; background: #eef2ff; border-radius: 6px; }
.lp-section { padding: 64px clamp(16px, 4vw, 48px); max-width: 1120px; margin: 0 auto; }
.lp-section.alt { max-width: none; background: rgba(255,255,255,.03); border-block: 1px solid rgba(255,255,255,.05); }
.lp-section.alt > * { max-width: 1120px; margin-left: auto; margin-right: auto; }
.lp-section h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 3vw, 2rem); color: #fff; letter-spacing: -.02em; text-align: center; }
.section-sub { text-align: center; color: #94a3b8; margin: 0 0 36px; }
.lp-features {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.lp-features article {
  background: rgba(15,23,42,.8); border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px; padding: 22px;
}
.lp-features h3 { margin: 8px 0; color: #fff; font-size: 1.05rem; }
.lp-features p { margin: 0; color: #94a3b8; font-size: .9rem; line-height: 1.55; }
.fi { font-size: 1.5rem; }
.lp-styles {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.lp-styles span {
  padding: 10px 16px; border-radius: 999px; font-weight: 700; font-size: .85rem;
  background: rgba(34,197,94,.12); color: #86efac; border: 1px solid rgba(34,197,94,.25);
}
.lp-split { display: grid; grid-template-columns: 1.2fr .8fr; gap: 28px; align-items: start; }
.lp-steps { margin: 0; padding-left: 1.2rem; color: #cbd5e1; line-height: 1.9; }
.lp-cta-panel {
  background: linear-gradient(160deg, rgba(99,102,241,.25), rgba(34,197,94,.12));
  border: 1px solid rgba(255,255,255,.1); border-radius: 20px; padding: 28px;
}
.lp-cta-panel h3 { margin: 0 0 8px; color: #fff; }
.lp-cta-panel p { color: #94a3b8; margin: 0 0 18px; line-height: 1.5; }
.lp-footer {
  padding: 36px clamp(16px, 4vw, 48px); border-top: 1px solid rgba(255,255,255,.06);
  display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: center;
  color: #64748b; font-size: .85rem;
}
.lp-footer a { color: #94a3b8; margin-left: 14px; text-decoration: none; }
.lp-footer .logo-text.on-light .work { color: #e2e8f0; }
@media (max-width: 900px) {
  .lp-hero, .lp-features, .lp-split { grid-template-columns: 1fr; }
  .lp-hero-card { min-height: 200px; }
}
