/* Agent Kit landing (agent.startupkit.com.br) — component stylesheet.
   Verbatim extract of the <style> block in
   agent-kit/.cursor/context/landing-agentkit/index.html (the deploy artifact).
   Everything is scoped under .ak-landing, so this file can be loaded next to
   STK or Mission Control tokens without collisions.
   Re-extracted 2026-08-02 after the MC-product-chrome redesign (PR #645/#646). */
.ak-landing {
  --bg-primary:#0b0e14; --bg-secondary:#111620; --bg-card:#161c2a; --bg-card-hover:#1b2335;
  --border:#1e2a3a; --border-active:#2a3a5a;
  --text-primary:#e2e8f0; --text-secondary:#8899aa; --text-muted:#7f93a8;
  --green:#22c55e; --green-bg:rgba(34,197,94,.12);
  --yellow:#eab308; --yellow-bg:rgba(234,179,8,.12);
  --blue:#3b82f6; --blue-cta:#2563eb; --blue-pill:#93c5fd; --blue-bg:rgba(59,130,246,.18);
  --cyan:#06b6d4; --cyan-bg:rgba(6,182,212,.12);
  --purple:#a855f7; --purple-bg:rgba(168,85,247,.12);
  --mc-radius-sm:4px; --mc-radius-chrome:6px; --mc-radius:8px; --mc-radius-lg:12px; --mc-radius-pill:999px;
  --mc-space-md:8px; --mc-card-padding:16px; --mc-chrome-meta-size:11px;
  --mc-font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-family:var(--mc-font-sans); color:var(--text-primary); line-height:1.45;
  background:
    radial-gradient(1200px 600px at 70% -10%, rgba(59,130,246,.18), transparent 60%),
    radial-gradient(900px 500px at 10% 20%, rgba(6,182,212,.10), transparent 55%),
    linear-gradient(180deg, #0b0e14 0%, #101826 45%, #0b0e14 100%);
  margin:0; padding:0 0 64px;
}
.ak-landing * { box-sizing:border-box; }
.ak-cta > br, .ak-badges > br { display:none; }
.ak-wrap { max-width:1080px; margin:0 auto; padding:0 24px; }
.ak-hero { padding:72px 0 40px; }
.ak-brand { font-size:14px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--cyan); margin:0 0 16px; }
.ak-hero h1 { font-size:clamp(28px,4.5vw,44px); line-height:1.15; font-weight:700; margin:0 0 8px; max-width:18ch; }
.ak-hero .ak-subline { font-size:20px; font-weight:500; color:var(--text-primary); margin:0 0 16px; opacity:0.9; }
.ak-hero p.lead { font-size:17px; color:var(--text-secondary); max-width:52ch; margin:0 0 28px; }
.ak-cta { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.ak-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:var(--mc-radius); font-size:14px; font-weight:600; text-decoration:none; border:1px solid transparent; }
.ak-btn:focus-visible { outline:2px solid var(--cyan); outline-offset:2px; }
.ak-btn-stk-primary { background:var(--blue-cta); color:#fff; border-radius:var(--mc-radius); padding:12px 24px; font-weight:600; }
.ak-btn-ghost { background:transparent; color:var(--text-primary); border-color:var(--border-active); }
.ak-code { font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; font-size:12px; color:var(--text-secondary); background:var(--bg-secondary); border:1px solid var(--border); padding:8px 12px; border-radius:var(--mc-radius-chrome); }
.ak-section { padding:48px 0 8px; }
.ak-section h2 { font-size:22px; margin:0 0 8px; }
.ak-section .sub { color:var(--text-secondary); margin:0 0 24px; max-width:60ch; font-size:15px; }
.ak-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:800px){ .ak-grid-3{ grid-template-columns:1fr; } .ak-hero{ padding-top:48px; } }
.ak-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--mc-radius); padding:var(--mc-card-padding); }
.ak-card h3 { margin:0 0 8px; font-size:15px; }
.ak-card p { margin:0; color:var(--text-secondary); font-size:13px; }
.ak-pill { display:inline-flex; align-items:center; gap:4px; font-size:var(--mc-chrome-meta-size); font-weight:600; letter-spacing:.02em; padding:2px 6px; border-radius:var(--mc-radius-pill); text-transform:uppercase; }
.ak-pill-executing { background:var(--blue-bg); color:var(--blue-pill); }
.ak-pill-backlog { background:var(--cyan-bg); color:var(--cyan); }
.ak-pill-completed { background:var(--green-bg); color:var(--green); }
.ak-pill-awaiting { background:var(--yellow-bg); color:var(--yellow); }
.ak-role { font-size:var(--mc-chrome-meta-size); font-weight:600; letter-spacing:.02em; text-transform:uppercase; padding:1px 6px; }
.ak-role-next { color:var(--blue); }
.ak-role-queued { color:var(--cyan); }
.ak-mc-frame { border:1px solid var(--border); border-radius:var(--mc-radius-lg); overflow:hidden; background:var(--bg-primary); box-shadow:0 24px 80px rgba(0,0,0,.45); max-width:560px; width:100%; }
.ak-mc-header { display:flex; align-items:center; gap:8px; height:36px; padding:0 12px; background:var(--bg-secondary); border-bottom:1px solid var(--border); }
.ak-mc-logo { width:20px; height:20px; border-radius:var(--mc-radius-chrome); }
.ak-mc-label { font-size:var(--mc-chrome-meta-size); font-weight:600; color:var(--text-secondary); }
.ak-mc-workspace { font-size:var(--mc-chrome-meta-size); color:var(--text-muted); margin-left:4px; }
.ak-mc-frame img { display:block; width:100%; height:auto; }
.ak-proof-row { display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center; padding:40px 0; border-bottom:1px solid var(--border); }
.ak-proof-row:last-child { border-bottom:0; }
.ak-proof-row--reverse { direction:rtl; }
.ak-proof-row--reverse > * { direction:ltr; }
.ak-proof-copy h3 { font-size:18px; margin:0 0 8px; }
.ak-proof-copy p { margin:0; color:var(--text-secondary); font-size:14px; line-height:1.5; }
@media (max-width:800px){ .ak-proof-row, .ak-proof-row--reverse { grid-template-columns:1fr; direction:ltr; } .ak-proof-row--reverse > * { direction:ltr; } .ak-mc-frame { max-width:100%; } }
.ak-steps { display:grid; gap:12px; }
.ak-step { display:flex; gap:14px; align-items:flex-start; background:var(--bg-card); border:1px solid var(--border); border-radius:var(--mc-radius); padding:14px 16px; }
.ak-step-num { width:28px; height:28px; border-radius:var(--mc-radius-chrome); background:var(--blue-bg); color:var(--blue-pill); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.ak-step h3 { margin:0 0 4px; font-size:14px; }
.ak-step p { margin:0; color:var(--text-secondary); font-size:13px; }
.ak-trust { border:1px solid var(--border-active); background:linear-gradient(135deg, rgba(59,130,246,.08), rgba(6,182,212,.05)); }
.ak-footer-cta { text-align:center; padding:56px 0 24px; }
.ak-footer-cta h2 { margin:0 0 12px; font-size:24px; }
.ak-footer-cta p { color:var(--text-secondary); margin:0 0 20px; }
.ak-meta { text-align:center; color:var(--text-muted); font-size:12px; padding-bottom:8px; }
.ak-badges { display:flex; flex-wrap:wrap; gap:6px; }
