/* Warmcorner — shared stylesheet */

:root{
  --bg:#fbfaf8;
  --panel:#ffffff;
  --ink:#1c1a17;
  --muted:#6b6560;
  --line:#e6e2dc;
  --accent:#b8442e;
  --accent-soft:#fdf3f0;
}

@media (prefers-color-scheme: dark){
  :root{
    --bg:#141311;
    --panel:#1c1b18;
    --ink:#eeeae4;
    --muted:#9d968d;
    --line:#2e2b27;
    --accent:#e8836a;
    --accent-soft:#241a17;
  }
}

*{ box-sizing:border-box }

html{ -webkit-text-size-adjust:100% }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.65 ui-sans-serif,-apple-system,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}

a{
  color:var(--accent);
  text-decoration:none;
  border-bottom:1px solid rgba(184,68,46,.35);
}
a:hover{ border-bottom-color:var(--accent) }

.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:650;
  letter-spacing:-.01em;
  color:var(--ink);
  border-bottom:0;
}
.dot{
  width:10px; height:10px;
  border-radius:50%;
  background:var(--accent);
  flex:none;
}

/* ---------- Home / under construction ---------- */

.stage{
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 24px;
  text-align:center;
}
.stage-inner{ max-width:520px }

.stage h1{
  font-size:clamp(30px,6vw,46px);
  line-height:1.12;
  letter-spacing:-.03em;
  margin:26px 0 14px;
}
.stage p{
  color:var(--muted);
  font-size:17px;
  margin:0 auto 28px;
  max-width:44ch;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:7px 15px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:999px;
  font-size:13.5px;
  letter-spacing:.02em;
  color:var(--muted);
}
.pulse{
  width:7px; height:7px;
  border-radius:50%;
  background:var(--accent);
  flex:none;
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{ opacity:1; transform:scale(1) }
  50%    { opacity:.35; transform:scale(.82) }
}
@media (prefers-reduced-motion: reduce){
  .pulse{ animation:none }
}

.stage-links{
  margin-top:34px;
  padding-top:22px;
  border-top:1px solid var(--line);
  font-size:14.5px;
  color:var(--muted);
}
.stage-links a{ margin:0 10px }

/* ---------- Document pages ---------- */

.wrap{ max-width:760px; margin:0 auto; padding:56px 24px 96px }

.doc header{
  border-bottom:1px solid var(--line);
  padding-bottom:28px;
  margin-bottom:8px;
}
.doc h1{
  font-size:clamp(28px,5vw,40px);
  line-height:1.15;
  letter-spacing:-.025em;
  margin:22px 0 10px;
}
.sub{ color:var(--muted); margin:0 }
.meta{ color:var(--muted); font-size:14px; margin-top:18px }

.doc h2{ font-size:19px; letter-spacing:-.015em; margin:40px 0 10px; padding-top:4px }
.doc p{ margin:0 0 14px }
.doc ul{ margin:0 0 14px; padding-left:20px }
.doc li{ margin:6px 0 }

.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px 22px;
  margin:18px 0;
}
.card p:last-child, .card ul:last-child{ margin-bottom:0 }

.kv{ display:grid; grid-template-columns:180px 1fr; gap:10px 18px; font-size:15px }
.kv dt{ color:var(--muted) }
.kv dd{ margin:0 }
@media (max-width:560px){
  .kv{ grid-template-columns:1fr; gap:2px 0 }
  .kv dd{ margin-bottom:12px }
}

footer{
  margin-top:56px;
  padding-top:22px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:14px;
}
