/*
Theme Name: Launch Check
Theme URI: https://theleancpto.com
Author: The Lean CPTO
Author URI: https://theleancpto.com
Description: Landing page theme for the Launch Check, a pre-launch safety check for apps built with AI help. Single dark visual world, no external fonts or images, mobile first.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: launch-check
*/

/* --------------------------------------------------------------
   Everything here is scoped under .lcx so nothing leaks into the
   WordPress admin bar, plugin markup, or any block you add later.
   Colours and fonts live in one place at the top. Change them there.
   -------------------------------------------------------------- */

.lcx {
  --bg: #08090a;
  --panel: #0b0d0e;
  --line: #22262a;
  --line-soft: #16191b;
  --lime: #d6ff3f;
  --red: #ff5c3d;
  --amber: #ffb03d;
  --ink: #f2f4f5;
  --ink-soft: #b9c0c4;
  --muted: #7d858c;

  --display: "Helvetica Neue", Helvetica, "Arial Black", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  background: var(--bg);
  color: var(--ink);
  font-family: var(--display);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* The brand commits to one dark world on purpose, so there is no light
   variant. If you ever want one, redefine the variables above under
   @media (prefers-color-scheme: light). */

html { background: #08090a; }
body { margin: 0; }

.lcx *,
.lcx *::before,
.lcx *::after { box-sizing: border-box; }

.lcx a { color: var(--lime); }
.lcx :focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

.lcx .wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.lcx .mono {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.lcx .skip {
  position: absolute; left: -9999px; top: 0;
  background: var(--lime); color: #08090a; padding: 10px 16px; z-index: 200;
}
.lcx .skip:focus { left: 12px; top: 12px; }

/* ---------------- masthead ---------------- */
.lcx .masthead { border-bottom: 1px solid var(--line); }
.lcx .masthead .wrap {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 64px; flex-wrap: wrap;
}
.lcx .brand {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--mono); font-size: 13px; letter-spacing: 0.16em;
  text-transform: uppercase; font-weight: 700; color: var(--ink);
  text-decoration: none;
}
.lcx .brand i { width: 9px; height: 9px; background: var(--lime); display: block; }
.lcx .masthead nav { display: flex; gap: 20px; flex-wrap: wrap; }
.lcx .masthead nav a {
  color: var(--muted); text-decoration: none; font-family: var(--mono);
  font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase;
}
.lcx .masthead nav a:hover { color: var(--ink); }

/* ---------------- hero ---------------- */
.lcx .hero {
  display: grid; grid-template-columns: 1.15fr 0.85fr;
  border-bottom: 1px solid var(--line);
}
.lcx .hero-left { padding: 56px 24px 48px; max-width: 720px; margin-left: auto; width: 100%; }
.lcx .flag {
  display: inline-block; border: 1px solid var(--line);
  padding: 8px 14px; color: var(--lime); margin-bottom: 28px;
}
.lcx h1 {
  font-size: clamp(44px, 8.5vw, 92px); line-height: 0.92; letter-spacing: -0.035em;
  font-weight: 900; text-transform: uppercase; margin: 0; text-wrap: balance;
}
.lcx h1 .dim { color: #4a4f54; }
.lcx h1 .hit { color: var(--lime); }
.lcx .lede { color: var(--ink-soft); margin: 26px 0 0; max-width: 52ch; }

.lcx form.drop {
  display: flex; margin-top: 32px; border: 1px solid var(--line);
  background: #0c0e0f; flex-wrap: wrap;
}
.lcx form.drop .sig {
  padding: 16px 14px; color: var(--lime);
  font-family: var(--mono); border-right: 1px solid var(--line);
}
.lcx form.drop input {
  flex: 1 1 240px; min-width: 0; background: transparent; border: 0;
  color: var(--ink); font-family: var(--mono); font-size: 14px; padding: 16px 12px;
}
.lcx form.drop input::placeholder { color: #5c646a; }
.lcx form.drop button {
  background: var(--lime); color: #08090a; border: 0; padding: 16px 26px;
  font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em;
  cursor: pointer; font-family: var(--display); font-size: 15px; flex: 0 0 auto;
}
.lcx form.drop button:hover { background: #e6ff6d; }
.lcx .ticks {
  display: flex; gap: 22px; margin-top: 16px; flex-wrap: wrap;
  color: var(--muted); font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.08em;
}
.lcx .ticks b { color: var(--lime); font-weight: 400; }

/* ---------------- hero panel ---------------- */
.lcx .hero-right {
  border-left: 1px solid var(--line); background: var(--panel);
  display: flex; flex-direction: column;
}
.lcx .panel-head {
  display: flex; justify-content: space-between; padding: 16px 22px;
  border-bottom: 1px solid var(--line); color: var(--muted);
}
.lcx .panel-head .crit { color: var(--red); }
.lcx .score { padding: 22px; }
.lcx .score .n { font-size: 34px; font-weight: 900; color: var(--red); line-height: 1; margin-top: 10px; }
.lcx .bar { height: 5px; background: var(--line); margin-top: 14px; }
.lcx .bar i { display: block; height: 100%; width: 34%; background: var(--red); }

.lcx ul.findings { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.lcx ul.findings li {
  display: flex; gap: 14px; align-items: flex-start; padding: 15px 22px;
  border-bottom: 1px solid var(--line-soft); font-size: 14.5px;
}
.lcx ul.findings .g { flex: 0 0 14px; font-family: var(--mono); }
.lcx ul.findings .tag {
  margin-left: auto; font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; flex: 0 0 auto;
}
.lcx .bad .g, .lcx .bad .tag { color: var(--red); }
.lcx .warn .g, .lcx .warn .tag { color: var(--amber); }
.lcx .ok { color: var(--muted); }
.lcx .ok .g, .lcx .ok .tag { color: var(--lime); }

.lcx .verdict { margin-top: auto; background: var(--lime); color: #08090a; padding: 22px; }
.lcx .verdict .mono { color: rgba(8, 9, 10, 0.65); }
.lcx .verdict p {
  margin: 8px 0 0; font-weight: 900; text-transform: uppercase;
  font-size: 20px; line-height: 1.12; letter-spacing: -0.02em;
}
.lcx .example {
  padding: 12px 22px; border-top: 1px solid var(--line); color: var(--muted);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em;
}

/* ---------------- sections ---------------- */
.lcx section { border-bottom: 1px solid var(--line); padding: 74px 0; }
.lcx .num { color: var(--lime); font-family: var(--mono); font-size: 12px; letter-spacing: 0.16em; }
.lcx h2 {
  font-size: clamp(30px, 5vw, 52px); line-height: 1; letter-spacing: -0.03em;
  font-weight: 900; text-transform: uppercase; margin: 14px 0 0; text-wrap: balance;
}
.lcx .sub { color: var(--muted); margin: 18px 0 0; max-width: 62ch; }

.lcx .stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--line); border: 1px solid var(--line); margin-top: 40px;
}
.lcx .stats > div { background: var(--bg); padding: 30px 26px; }
.lcx .stats .k { font-size: clamp(38px, 6vw, 60px); font-weight: 900; letter-spacing: -0.03em; line-height: 1; }
.lcx .stats .k.good { color: var(--lime); }
.lcx .stats .l { color: var(--muted); margin-top: 10px; font-size: 14.5px; }

.lcx .cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin-top: 44px; }
.lcx .card { border: 1px solid var(--line); padding: 26px; background: var(--panel); }
.lcx .card h3 { font-size: 19px; margin: 14px 0 0; font-weight: 800; letter-spacing: -0.01em; line-height: 1.2; }
.lcx .card p { color: var(--muted); margin: 12px 0 0; font-size: 15px; }

.lcx .two { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 44px; }
.lcx .list { list-style: none; margin: 16px 0 0; padding: 0; }
.lcx .list li {
  display: flex; gap: 12px; padding: 11px 0;
  border-bottom: 1px solid var(--line-soft); color: #c3c9cd; font-size: 15.5px;
}
.lcx .list .m { font-family: var(--mono); flex: 0 0 14px; }
.lcx .yes .m { color: var(--lime); }
.lcx .no .m { color: var(--red); }

.lcx .steps { margin-top: 40px; border-top: 1px solid var(--line); }
.lcx .steps .row {
  display: grid; grid-template-columns: 110px 1fr; gap: 26px;
  padding: 26px 0; border-bottom: 1px solid var(--line);
}
.lcx .steps .when { color: var(--lime); font-family: var(--mono); font-size: 12px; letter-spacing: 0.1em; }
.lcx .steps h3 { margin: 0; font-size: 21px; font-weight: 800; }
.lcx .steps p { color: var(--muted); margin: 8px 0 0; max-width: 60ch; font-size: 15.5px; }

.lcx .note {
  border-left: 3px solid var(--lime); padding: 4px 0 4px 22px;
  margin-top: 34px; color: #c3c9cd; max-width: 64ch;
}

.lcx .cta { text-align: center; padding: 86px 0; }
.lcx .cta .sub { margin-left: auto; margin-right: auto; }
.lcx .cta form.drop { max-width: 620px; margin: 32px auto 0; text-align: left; }
.lcx .cta .ticks { justify-content: center; }

.lcx footer.site { padding: 30px 0; color: var(--muted); }
.lcx footer.site .wrap { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; }

/* ---------------- responsive ---------------- */
@media (max-width: 1000px) {
  .lcx .hero { grid-template-columns: 1fr; }
  .lcx .hero-left { margin-left: 0; max-width: none; padding: 44px 24px 40px; }
  .lcx .hero-right { border-left: 0; border-top: 1px solid var(--line); }
  .lcx .stats, .lcx .cols, .lcx .two { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .lcx { font-size: 16px; }
  .lcx .masthead nav { display: none; }
  .lcx section { padding: 52px 0; }
  .lcx .cta { padding: 60px 0; }
  .lcx .steps .row { grid-template-columns: 1fr; gap: 8px; }
  .lcx form.drop .sig { display: none; }
  .lcx form.drop button { width: 100%; }
  .lcx .stats > div { padding: 24px 20px; }
  .lcx .wrap { padding: 0 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .lcx *, .lcx *::before, .lcx *::after { animation: none !important; transition: none !important; }
}

/* ---------------- WordPress bits ---------------- */
.screen-reader-text {
  border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute; width: 1px; white-space: nowrap;
}
.lcx .lc-prose { color: var(--ink-soft); }
.lcx .lc-prose h2, .lcx .lc-prose h3 { text-transform: none; letter-spacing: -0.01em; }
.lcx .lc-prose img { max-width: 100%; height: auto; }
.lcx .lc-prose a { color: var(--lime); }
.lcx article { padding: 0 0 40px; }
.lcx .pagination, .lcx .nav-links { margin-top: 30px; font-family: var(--mono); font-size: 13px; }
.lcx .nav-links a { margin-right: 14px; }

/* The admin bar is fixed, so give it room when logged in. */
body.admin-bar .lcx .masthead { top: 32px; }
@media (max-width: 782px) { body.admin-bar .lcx .masthead { top: 46px; } }
