/* Lernhive — shared site styles. Utilitarian, professional, theme-aware. */
:root{
  --ink:#141210; --paper:#faf8f4; --card:#ffffff; --muted:#6b6560;
  --accent:#c9821f; --accent-ink:#3a2708; --hair:#e7e0d6; --maxw:64ch;
}
@media (prefers-color-scheme: dark){
  :root{ --ink:#f1ece4; --paper:#141210; --card:#1c1915; --muted:#a49b8e;
    --accent:#f0b657; --accent-ink:#141210; --hair:#2c2822; }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}
header.site{display:flex; align-items:center; justify-content:space-between; padding:22px 0; border-bottom:1px solid var(--hair)}
.brand{display:inline-flex; align-items:center; gap:9px; font-weight:800; font-size:20px; letter-spacing:-.01em; text-decoration:none; color:var(--ink)}
.mark{display:inline-grid; place-items:center; width:28px; height:28px; border-radius:8px; background:var(--accent); color:var(--accent-ink); font-weight:900; font-size:15px}
nav.site a{color:var(--muted); text-decoration:none; margin-left:18px; font-size:14px}
nav.site a:hover{color:var(--ink)}
main{padding:56px 0 24px}
h1{font-size:clamp(30px,5vw,44px); line-height:1.1; letter-spacing:-.02em; text-wrap:balance; margin:.2em 0 .35em}
h2{font-size:22px; letter-spacing:-.01em; margin:1.8em 0 .5em}
h3{font-size:16px; margin:1.4em 0 .3em}
.lede{font-size:19px; color:var(--muted); max-width:52ch}
.pill{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-ink); background:var(--accent); padding:4px 10px; border-radius:999px}
.features{list-style:none; padding:0; margin:28px 0; display:grid; gap:14px}
.features li{padding-left:26px; position:relative}
.features li::before{content:"▹"; position:absolute; left:0; color:var(--accent); font-weight:900}
.card{background:var(--card); border:1px solid var(--hair); border-radius:14px; padding:28px; margin:24px 0}
a{color:var(--accent)}
.legal{color:var(--ink)}
.legal p,.legal li{color:var(--ink)}
.muted{color:var(--muted)}
.center{text-align:center}
.big-emoji{font-size:52px; line-height:1; margin-bottom:8px}
footer.site{border-top:1px solid var(--hair); margin-top:56px; padding:26px 0 44px; color:var(--muted); font-size:13px}
footer.site a{color:var(--muted)}
footer.site a:hover{color:var(--ink)}
.footlinks{display:flex; flex-wrap:wrap; gap:16px; margin-bottom:10px}
hr{border:0; border-top:1px solid var(--hair); margin:2em 0}
code{background:var(--card); border:1px solid var(--hair); border-radius:5px; padding:1px 5px; font-size:.9em}
