/* heykove.com — kove web design system (BRAND.md): Inter body, Fraunces editorial, Nunito wordmark/numerics.
   Single-theme by design: the brand canvas is warm off-white on every surface. */
:root {
  --canvas: #F5F4F0;
  --card: #FFFFFF;
  --ink: #2C2C2C;
  --ink-2: #6E6D66;
  --sage: #7BAE8A;
  --sage-deep: #3F6B54;
  --line: #E3E1D9;
  --terracotta: #C0614A;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, -apple-system, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.7;
}
.wrap { max-width: 66ch; margin: 0 auto; padding: 0 1.25rem 5rem; }

/* Header / wordmark */
header.site {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 2.2rem 0 1.6rem;
}
.wordmark {
  font-family: Nunito, Inter, sans-serif;
  font-weight: 700;
  font-size: 1.6rem;
  letter-spacing: -0.012em;
  color: var(--sage-deep);
  text-decoration: none;
  line-height: 1;
}
.wordmark .o { position: relative; }
.wordmark .o .dot {
  position: absolute;
  width: 0.105em; height: 0.105em;
  border-radius: 50%;
  background: var(--sage);
  left: 50%; top: 54%;
  transform: translate(-50%, -50%);
}
nav.site { display: flex; gap: 1.4rem; }
nav.site a {
  font-size: .92rem; font-weight: 500;
  color: var(--ink-2); text-decoration: none;
}
nav.site a:hover { color: var(--sage-deep); }

/* Type */
h1 {
  font-family: Fraunces, Georgia, serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-size: clamp(1.9rem, 5vw, 2.7rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 2.2rem 0 1rem;
  text-wrap: balance;
}
h2 {
  font-family: Fraunces, Georgia, serif;
  font-weight: 600;
  font-size: 1.35rem;
  line-height: 1.3;
  margin: 2.6rem 0 .7rem;
  color: var(--sage-deep);
  text-wrap: balance;
}
h3 {
  font-family: Inter, sans-serif;
  font-weight: 650;
  font-size: 1.02rem;
  margin: 1.8rem 0 .4rem;
}
p { margin: 0 0 1rem; }
a { color: var(--sage-deep); text-decoration-thickness: 1px; text-underline-offset: 2px; }
ul, ol { padding-left: 1.3rem; margin: 0 0 1rem; }
li { margin-bottom: .4rem; }
hr { border: 0; border-top: 1px solid var(--line); margin: 2.6rem 0; }
strong { font-weight: 650; }
.lede {
  font-size: 1.18rem; line-height: 1.6; color: var(--ink);
  font-family: Fraunces, Georgia, serif; font-weight: 400;
}
.muted { color: var(--ink-2); font-size: .95rem; }

/* How-it-works trio */
.trio { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin: 1.6rem 0; }
.trio .step {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1.1rem 1.15rem;
}
.trio .step .k {
  font-family: Nunito, sans-serif; font-weight: 700;
  color: var(--sage); font-size: .8rem; letter-spacing: .1em;
  text-transform: uppercase; display: block; margin-bottom: .35rem;
}
.trio .step p { margin: 0; font-size: .95rem; }

/* Cards / notices */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1.2rem 1.3rem;
  margin: 1.4rem 0;
}
.notice {
  border-left: 3px solid var(--sage);
  background: var(--card);
  border-radius: 0 8px 8px 0;
  padding: .9rem 1.15rem;
  margin: 1.4rem 0;
  font-size: .95rem;
}
.draft-banner {
  border: 1px solid var(--terracotta);
  border-left-width: 3px;
  background: #F9EFEB;
  border-radius: 8px;
  padding: .8rem 1.1rem;
  margin: 1.4rem 0;
  font-size: .93rem;
  color: var(--ink);
}

/* FAQ */
details {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .9rem 1.15rem;
  margin-bottom: .7rem;
}
details summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 1rem;
  list-style: none;
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
details summary::-webkit-details-marker { display: none; }
details summary::after { content: "+"; color: var(--sage); font-family: Nunito, sans-serif; font-weight: 700; }
details[open] summary::after { content: "\2212"; }
details[open] summary { margin-bottom: .5rem; }
details p:last-child { margin-bottom: 0; }

/* Footer */
footer.site {
  margin-top: 4rem;
  border-top: 1px solid var(--line);
  padding-top: 1.4rem;
  font-size: .88rem;
  color: var(--ink-2);
}
footer.site nav { display: flex; gap: 1.2rem; margin-bottom: .7rem; }
footer.site a { color: var(--ink-2); }
footer.site a:hover { color: var(--sage-deep); }
footer.site .legal { max-width: 60ch; }

@media (max-width: 540px) {
  body { font-size: 16px; }
  header.site { padding-top: 1.6rem; }
}