/* naykip.kovanex.dev — "keyboard cowboy & his AI gang".
   Palette: Cognac & Cream — warm, aged, premium/collectible; high-contrast ink on parchment.
   Distinct from the kovanex product look on purpose. */
:root{
  --bg:#efe4ce;        /* parchment */
  --paper:#f7efdd;     /* poster interior / lifted panel */
  --surface:#fbf6ea;   /* cards, nav */
  --surface2:#ebdfc7;
  --border:#cdb98f;    /* aged paper edge */
  --ink:#241c14;       /* text — high contrast */
  --dim:#6b5c44;       /* tobacco */
  --faint:#9a8766;
  --cognac:#a35f2a;    /* primary accent */
  --teal:#2f5f63;      /* secondary — the "blues" */
  --gold:#8a6820;      /* price / signal */
  --code:#e7dabd;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Inter",ui-sans-serif,system-ui,"Segoe UI",Roboto,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
.mono,.kicker,.section-kicker,.stat .num,.price .num,.price .from,.badge,.travel{
  font-family:"JetBrains Mono","SF Mono",ui-monospace,Menlo,monospace}
a{color:var(--cognac);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1080px;margin:0 auto;padding:0 24px}
h1,h2,h3{line-height:1.22;font-weight:800;letter-spacing:-0.015em}
h2{font-size:1.7rem;margin:0 0 8px}
code{background:var(--code);padding:2px 6px;border-radius:4px;font-family:"JetBrains Mono",monospace;font-size:0.9em}

/* nav */
nav{position:sticky;top:0;z-index:100;background:rgba(251,246,234,0.9);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border);padding:14px 0}
nav .container{display:flex;align-items:center;justify-content:space-between}
nav .logo{font-weight:800;letter-spacing:-0.02em;font-size:1.05rem;color:var(--ink)}
nav .logo::before{content:"~/";color:var(--cognac);font-family:"JetBrains Mono",monospace}
nav .links{display:flex;gap:22px;align-items:center}
nav .links a{color:var(--dim);font-size:0.92rem}
nav .links a:hover{color:var(--ink);text-decoration:none}

/* buttons */
.btn{display:inline-block;padding:11px 22px;border-radius:6px;font-weight:600;font-size:0.95rem;
  border:1px solid transparent;transition:transform .08s ease}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:var(--cognac);color:var(--surface)}
.btn-signal{background:var(--cognac);color:var(--surface)}
.btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

/* WANTED poster (home hero) */
.poster{margin:36px 0 8px;border:2px solid var(--ink);border-radius:4px;background:var(--paper);
  box-shadow:0 2px 0 var(--border),0 16px 34px rgba(60,40,15,0.10);padding:32px 36px 36px;position:relative}
.poster::before,.poster::after{content:"";position:absolute;left:14px;right:14px;border-top:1px solid var(--faint)}
.poster::before{top:9px}.poster::after{bottom:9px}
.wanted{text-align:center;font-family:"JetBrains Mono",monospace;letter-spacing:0.42em;
  font-weight:700;font-size:1.55rem;color:var(--ink);text-transform:uppercase}
.reward{text-align:center;font-family:"JetBrains Mono",monospace;font-size:0.72rem;letter-spacing:0.22em;
  color:var(--cognac);text-transform:uppercase;margin:8px 0 6px}
.poster hr,.rule{border:0;border-top:1px solid var(--border);margin:16px 0}
.kicker{color:var(--cognac);font-size:0.8rem;letter-spacing:0.05em;margin-bottom:10px}
.poster h1{font-size:2.9rem;margin:0}
.poster h1 .g{color:var(--cognac)}
.travel{color:var(--teal);font-size:1rem;margin-top:10px;letter-spacing:0.01em}
.hero-lead{color:var(--dim);font-size:1.14rem;max-width:610px;margin:16px 0 0}
.hero-lead strong{color:var(--ink)}
.badge{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border-radius:4px;
  border:1px solid var(--border);background:var(--surface);font-size:0.74rem;color:var(--gold);
  text-transform:uppercase;letter-spacing:0.12em;margin-top:18px}
.badge .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(138,104,32,0.20)}

/* announcement ribbon (home, above the poster — first thing seen) */
.announce{display:flex;gap:14px 18px;align-items:center;flex-wrap:wrap;margin:28px 0 0;
  padding:15px 20px;border:2px solid var(--ink);border-radius:4px;background:var(--paper);
  box-shadow:0 2px 0 var(--border),0 10px 22px rgba(60,40,15,0.08);color:var(--ink)}
.announce:hover{text-decoration:none;background:var(--surface)}
.announce-tag{font-family:"JetBrains Mono",monospace;font-size:0.7rem;font-weight:700;
  letter-spacing:0.2em;text-transform:uppercase;color:var(--surface);background:var(--cognac);
  padding:5px 11px;border-radius:3px;white-space:nowrap}
.announce-text{flex:1;min-width:260px;font-size:1rem;color:var(--dim)}
.announce-text strong{color:var(--ink)}
.announce-cta{font-family:"JetBrains Mono",monospace;font-size:0.82rem;font-weight:700;
  color:var(--cognac);white-space:nowrap}
.announce:hover .announce-cta{text-decoration:underline}

/* stats */
.stats{display:flex;gap:36px;flex-wrap:wrap;margin:36px 0;padding:22px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.stat .num{font-size:2rem;font-weight:700;color:var(--cognac)}
.stat .label{font-size:0.82rem;color:var(--dim)}

/* sections */
section.block{padding:44px 0;border-top:1px solid var(--border)}
.section-kicker{color:var(--cognac);font-size:0.8rem;letter-spacing:0.06em;text-transform:uppercase;margin-bottom:8px}
.sub{color:var(--dim);max-width:680px;margin:0 0 24px}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:22px}
.card h3{margin:0 0 8px;color:var(--ink)}
.card p{margin:0;color:var(--dim);font-size:0.95rem}
.card .tag{display:inline-block;margin-top:12px;font-size:0.75rem;color:var(--cognac);border:1px solid var(--border);border-radius:6px;padding:2px 8px}
.card.accent{border-color:var(--cognac)}

/* prices */
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:8px}
.price{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:24px;display:flex;flex-direction:column}
.price.feature{border-color:var(--cognac);box-shadow:0 0 0 1px rgba(163,95,42,0.28)}
.price .name{font-size:0.98rem;color:var(--ink);font-weight:700}
.price .who{font-size:0.8rem;color:var(--faint);margin:2px 0 14px}
.price .num{font-size:1.85rem;font-weight:700;color:var(--gold)}
.price .num small{font-size:0.85rem;color:var(--dim);font-weight:400}
.price .from{font-size:0.72rem;color:var(--faint);text-transform:uppercase;letter-spacing:0.06em}
.price ul{list-style:none;padding:0;margin:16px 0 0;font-size:0.9rem;color:var(--dim)}
.price li{padding:6px 0 6px 22px;position:relative}
.price li::before{content:"→";position:absolute;left:0;color:var(--cognac)}
.pay-note{margin-top:18px;padding:14px 18px;border-left:3px solid var(--teal);color:var(--dim);background:var(--surface);border-radius:0 8px 8px 0}
.pay-note strong{color:var(--ink)}

/* prose (blog / articles) */
.prose{max-width:720px;margin:0 auto}
.prose h2{margin:32px 0 12px;color:var(--cognac)}
.prose p{margin:0 0 16px}
.prose hr{border:0;border-top:1px solid var(--border);margin:32px 0}
.page-header{padding:52px 0 8px}
.page-header h1{font-size:2.4rem;margin:12px 0 8px}

/* footer */
footer{border-top:1px solid var(--border);margin-top:60px;padding:34px 0;color:var(--faint);background:var(--surface2)}
footer a{color:var(--dim)}
footer .container{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;align-items:center}
footer .fnav a{margin-right:16px;font-size:0.9rem}

@media(max-width:720px){
  .poster h1{font-size:2rem}
  .wanted{font-size:1.1rem;letter-spacing:0.3em}
  nav .links{gap:14px}
  nav .links a:not(:first-child):not(:last-child){display:none}
}