:root{
  --bg:#ffffff; --ink:#16181d; --muted:#5b6472; --line:#e6e8ec;
  --accent:#1f6feb; --accent-ink:#0b4bbf; --soft:#f6f8fa; --radius:12px;
  --maxw:760px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent); text-decoration:none}
a:hover{color:var(--accent-ink); text-decoration:underline}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}

/* Header */
.site-header{border-bottom:1px solid var(--line); background:var(--bg)}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; height:64px}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; color:var(--ink); font-size:16px}
.brand:hover{text-decoration:none}
.brand .dot{width:22px;height:22px;border-radius:6px;background:var(--accent);display:inline-block;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.35)}
.nav{display:flex; gap:18px; font-size:14px}
.nav a{color:var(--muted)}
.nav a:hover{color:var(--accent-ink)}

/* Hero / page head */
main{padding:48px 0 64px}
.eyebrow{font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--accent-ink); font-weight:600; margin:0 0 10px}
h1{font-size:34px; line-height:1.15; letter-spacing:-.02em; margin:0 0 14px}
h2{font-size:20px; margin:34px 0 10px; letter-spacing:-.01em}
.lede{font-size:18px; color:var(--muted); margin:0 0 8px}
.meta{font-size:14px; color:var(--muted); margin:6px 0 0}
p{margin:0 0 14px}
ul{margin:0 0 14px; padding-left:22px}
li{margin:6px 0}
hr{border:0; border-top:1px solid var(--line); margin:34px 0}
.note{background:var(--soft); border:1px solid var(--line); border-radius:var(--radius);
  padding:14px 16px; font-size:14px; color:var(--muted); margin:0 0 22px}

/* Cards (landing) */
.cards{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:26px 0}
.card{border:1px solid var(--line); border-radius:var(--radius); padding:18px 18px; background:var(--bg);
  transition:border-color .15s, box-shadow .15s}
.card:hover{border-color:#c9d4e3; box-shadow:0 4px 18px rgba(20,40,80,.06)}
.card h3{margin:0 0 6px; font-size:16px}
.card p{margin:0; font-size:14px; color:var(--muted)}
.contact-box{border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; background:var(--soft); margin:24px 0}
.contact-box .row{display:flex; gap:10px; align-items:baseline; margin:8px 0; font-size:15px}
.contact-box .k{width:90px; color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.03em}

/* Footer */
.site-footer{border-top:1px solid var(--line); color:var(--muted); font-size:13px; padding:26px 0 40px}
.site-footer .wrap{display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; justify-content:space-between}
.site-footer a{color:var(--muted)}
.foot-links{display:flex; gap:16px; flex-wrap:wrap}

@media (max-width:560px){
  h1{font-size:27px}
  .cards{grid-template-columns:1fr}
  .nav{gap:14px}
}
