/* ===== Kinheart theme colors ===== */
:root{
  --header-bg: #1a1934;    /* deep midnight */
  --header-fg: #c0c0c0;    /* header text */
  --accent:    #a78bfa;    /* amethyst */
  --footer-bg: #1a1934;    /* footer */
  --footer-fg: #c0c0c0;    /* footer text */
  --link:      #a78bfa;    /* links */
  --link-hover:#d6bcfa;
  --rule:      #223047;    /* hr lines */
  --bg:        #f9f9fb;    /* page background */
  --ink:       #111111;    /* body text */
  --soft:      #e8e8ef;    /* soft panel bg */
}

/* Base */
* { box-sizing: border-box; }
body.site { margin:0; font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; color:var(--ink); background:var(--bg); }
.wrap { max-width: 900px; margin: 0 auto; padding: 0 1rem; }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; }
hr { border:0; border-top:1px solid var(--rule); }

/* Header */
.site-header{
  background: var(--header-bg);
  color: var(--header-fg);
  border-bottom: 1px solid var(--rule);
  padding: 1.25rem 0;
}
.site-header .brand a,
.site-header a { color: var(--header-fg); text-decoration: none; }
.tagline { opacity:.8; margin:.25rem 0 0 0; }
.nav { margin-top:.5rem; display:flex; gap:1rem; flex-wrap:wrap; }
.nav a { color: var(--header-fg); opacity:.9; }
.nav a:hover { opacity:1; text-decoration:underline; }

/* Main */
.site-main { padding: 2rem 0; background: var(--bg); }
.site-main a { color: var(--link); }
.site-main a:hover { color: var(--link-hover); }

/* Footer */
.site-footer{
  background: var(--footer-bg);
  color: var(--footer-fg);
  border-top: 1px solid var(--rule);
  margin-top: 2rem;
  padding: 1rem 0;
  font-size: .95rem;
}
.site-footer a { color: var(--footer-fg); text-decoration: underline; }

/* Forms */
.form { display:grid; gap:1rem; max-width: 640px; }
.form label { display:grid; gap:.4rem; }
input, textarea { border:1px solid #cfd3dc; padding:.6rem .7rem; border-radius:.5rem; background:white; }
button { border:0; background:var(--accent); color:#fff; padding:.6rem 1rem; border-radius:.5rem; cursor:pointer; }
button:hover { filter:brightness(1.05); }
.small.note { color:#555; font-size:.9rem; margin-top:.5rem; }

/* Video */
.hero { margin: 2rem 0; }
.video {
  max-width: 900px; margin: 0 auto; aspect-ratio: 16 / 9;
  background:#000; border-radius: 12px; overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.video iframe, .video video { width:100%; height:100%; display:block; }