/* Palette aligned with KinElo branding */
:root{
  --navy:#0d121e;
  --gold:#f8c244;
  --gold-strong:#e6ad30;
  --cream:#fff3d3;
  --ink:#0d121e;
  --card:#121827;     /* slightly lighter than body for elevation */
}

/* Reset & base */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background: var(--navy);
  color: var(--cream);
  line-height: 1.6;
}

/* Layout helpers */
.wrap{max-width:900px;margin:0 auto;padding:2rem}
header.wrap{padding-top:5rem;text-align:center}

h1{
  font-size: clamp(2.2rem, 3.5vw, 3rem);
  letter-spacing: .5px;
  color: var(--gold);
  margin-bottom:.25rem;
}
.subtitle{opacity:.9;margin-bottom:1.25rem}
.subtitle a{color:var(--cream)}

.card{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding:2rem;
  box-shadow: 0 6px 30px rgba(0,0,0,.25);
}

h2{
  font-size:1.15rem;
  margin:1.25rem 0 .5rem;
  color:var(--gold);
}

.facts{
  list-style:none;
  margin-bottom:1rem;
}
.facts li{padding:.35rem 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.facts li:last-child{border-bottom:none}

.button{
  display:inline-block;
  padding:.75rem 1.5rem;
  border-radius:999px;
  background:var(--gold);
  color:var(--ink);
  font-weight:700;
  text-decoration:none;
  transition:transform .15s ease, background .2s ease;
}
.button:hover{transform:translateY(-2px);background:var(--gold-strong)}

.contact a{color:var(--cream);text-decoration:underline}

.footer{
  text-align:center;
  opacity:.85;
  padding-bottom:3rem;
}
.footer nav{margin-bottom:.25rem}
.footer a{color:var(--cream)}
.footer span{opacity:.6;margin:0 .5rem}