/* AI key check page. Builds on /css/home.css tokens and components. */

.chk-hero .hero-inner { grid-template-columns:1fr 1.05fr; padding-block:88px 96px; }
.chk-hero h1 { font-size:clamp(36px,4.4vw,54px); text-wrap:balance; }
.chk-hero .lede { max-width:46ch; font-size:18px; }
.chk-hero .lede + .lede { margin-top:14px; }

/* illustrative terminal */
.term { background:linear-gradient(180deg,#0D2346,#0A1C38); border:1px solid rgba(255,255,255,.12); border-radius:12px; box-shadow:0 40px 80px -30px rgba(0,0,0,.7); font-family:var(--mono); font-size:12.5px; overflow:hidden; }
.term-head { display:flex; align-items:center; gap:14px; padding:14px 18px; border-bottom:1px solid var(--line-dark); color:var(--on-dark-2); letter-spacing:.06em; }
.term-head .dots { display:flex; gap:6px; }
.term-head .dots i { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.14); }
.term pre { margin:0; padding:18px 20px 20px; color:var(--on-dark); line-height:1.7; overflow-x:auto; white-space:pre; font:inherit; }
.term .dim { color:#6F84A2; }
.term .h { color:#fff; font-weight:500; }
.term .ok { color:var(--teal); }
.term .warn { color:#F6B04A; }
.term .gold { color:#E7C46B; }
.term .bad { color:#FF7A93; }
.term-cap { margin-top:12px; font-family:var(--mono); font-size:11px; color:#5E7391; letter-spacing:.06em; }

/* run steps */
.run-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; }
.run-step { background:#fff; border:1px solid var(--line); border-radius:12px; padding:28px; display:flex; flex-direction:column; gap:14px; min-width:0; }
.run-step .n { font-family:var(--mono); font-size:12px; letter-spacing:.16em; color:var(--teal-deep); }
.run-step h3 { font-size:21px; }
.run-step p { font-size:15.5px; }
.cmd { display:flex; align-items:center; gap:10px; background:var(--navy-3); border-radius:8px; padding:8px 8px 8px 14px; font-family:var(--mono); font-size:13px; color:var(--on-dark); min-width:0; }
.cmd code { flex:1; min-width:0; overflow-x:auto; white-space:nowrap; padding-block:4px; }
.cmd code::before { content:"$ "; color:#6F84A2; }
.copy { flex:none; height:30px; padding:0 10px; border-radius:6px; border:1px solid rgba(255,255,255,.18); background:transparent; color:var(--on-dark-2); font:500 12px var(--mono); letter-spacing:.06em; cursor:pointer; transition:color .15s, border-color .15s; }
.copy:hover { color:#fff; border-color:rgba(255,255,255,.4); }
.copy.done, .btn.done { color:var(--teal-deep); border-color:var(--teal-deep); }
.copy.done { color:var(--teal); border-color:rgba(20,228,208,.5); }
.btn-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.btn-sm { height:40px; padding:0 16px; font-size:14px; }
.hash { font-family:var(--mono); font-size:12px; line-height:1.6; color:var(--muted); overflow-wrap:anywhere; }
.hash b { color:var(--ink); font-weight:500; }
.run-step .hash b { display:block; margin-top:4px; }
.run-note { margin-top:28px; max-width:80ch; font-size:16px; padding:20px 24px; border:1px solid #CDEFEB; background:var(--mint); border-radius:12px; }
.run-note strong { color:var(--ink); font-weight:600; }

/* what it checks */
.checks { margin:48px 0 0; border-top:1px solid var(--line-2); }
.check-row { display:grid; grid-template-columns:280px 1fr; gap:10px 48px; padding:28px 0; border-bottom:1px solid var(--line); }
.check-row dt { font-weight:600; color:var(--ink); font-size:18px; line-height:1.35; }
.check-row dt span { display:block; margin-bottom:8px; font-family:var(--mono); font-size:11.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--teal-deep); }
.check-row dd { margin:0; font-size:16.5px; max-width:68ch; }
.check-row dd a { color:var(--teal-deep); text-decoration:underline; text-underline-offset:3px; }

/* never / can't */
.limits { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:48px; }
.limit { background:#fff; border:1px solid var(--line); border-radius:12px; padding:30px; min-width:0; }
.limit h3 { font-size:20px; }
.limit ul { list-style:none; margin:16px 0 0; padding:0; }
.limit li { position:relative; padding:12px 0 12px 30px; border-top:1px solid var(--line); font-size:16px; }
.limit li:first-child { border-top:0; }
.limit li::before { content:""; position:absolute; }
.limit.never li::before { left:6px; top:16px; width:6px; height:11px; border:solid var(--teal-deep); border-width:0 2px 2px 0; transform:rotate(45deg); }
.limit.cant li::before { left:3px; top:24px; width:13px; height:2px; border-radius:2px; background:var(--amber); }

/* this week */
.leaks { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
.leak { background:#fff; border:1px solid var(--line); border-top:2px solid var(--ink); border-radius:0 0 12px 12px; padding:26px; display:flex; flex-direction:column; gap:12px; min-width:0; }
.leak .when { font-family:var(--mono); font-size:11.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--teal-deep); }
.leak h3 { font-size:19px; line-height:1.3; letter-spacing:-0.015em; }
.leak p { font-size:15px; }
.leak .do { color:var(--ink); }
.leak .do b { font-weight:600; }
.leak a.src { margin-top:auto; padding-top:6px; font-family:var(--mono); font-size:12.5px; color:var(--teal-deep); text-decoration:none; }
.leak a.src:hover { text-decoration:underline; }
.patch-note { margin-top:24px; padding:20px 24px; border:1px dashed var(--line-2); border-radius:12px; font-size:16px; }
.patch-note a { color:var(--teal-deep); text-decoration:underline; text-underline-offset:3px; }

/* the script */
.code-view { margin-top:40px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 24px 48px -36px rgba(11,30,63,.3); }
.code-head { display:flex; flex-wrap:wrap; gap:12px 20px; align-items:center; justify-content:space-between; padding:14px 18px; background:var(--paper); border-bottom:1px solid var(--line); }
.code-head .fn { font-family:var(--mono); font-size:13px; color:var(--ink); font-weight:500; }
.code-head .fn span { color:var(--muted); font-weight:400; }
.code-head .hash { flex-basis:100%; order:3; }
.code-view pre { margin:0; max-height:620px; overflow:auto; padding:20px 22px; background:var(--navy-3); color:var(--on-dark); font-family:var(--mono); font-size:12.5px; line-height:1.6; tab-size:2; }

/* closing band */
.chk-next .demo-inner { align-items:start; }
.chk-next .cta-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.chk-next .form-card h3 { font-size:21px; }
.chk-next .form-card .intro { margin:6px 0 18px; font-size:15px; }

.chk-hero .hero-inner > *, .demo-inner > * { min-width:0; }

@media (max-width: 980px) {
  .chk-hero .hero-inner { grid-template-columns:1fr; padding-block:56px 64px; }
  .run-steps, .leaks, .limits { grid-template-columns:1fr; }
  .check-row { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .term { font-size:11px; }
  .code-view pre { font-size:11.5px; max-height:480px; padding:16px; }
  .run-step, .limit, .leak { padding:22px; }
}
@media (prefers-reduced-motion: reduce) {
  .copy { transition:none; }
}


/* the first-1,000 hook in the hero */
.chk-early { display:inline-flex; align-items:center; gap:9px; max-width:100%; margin-top:22px; padding:8px 15px; border:1px solid rgba(231,196,107,.4); border-radius:999px; background:rgba(231,196,107,.08); color:var(--on-dark); font-size:14.5px; line-height:1.4; }
.chk-early span { color:#E7C46B; }
.chk-early + .hero-cta { margin-top:22px; }
