:root { --navy: #1F2F61; --cream: #F2F3EE; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--navy);
  color: var(--cream);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans Thai", "Sukhumvit Set", Roboto, sans-serif;
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main {
  flex: 1;
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
  padding: 48px 16px 32px;
  text-align: center;
}
.logo { width: 200px; max-width: 60%; height: auto; }
.slogan { margin: 16px 0 40px; font-size: 1.05rem; letter-spacing: .02em; }
h1, h2 { font-size: 1.15rem; margin: 0 0 8px; font-weight: 700; }
section { margin: 0 0 32px; }
ul { list-style: none; padding: 0; margin: 0; }
li { margin: 4px 0; }
p { margin: 4px 0; }
a { color: var(--cream); text-underline-offset: 3px; }
a:focus-visible { outline: 2px solid var(--cream); outline-offset: 3px; }
.follow { margin-top: 8px; }
footer { text-align: center; padding: 16px; font-size: .85rem; opacity: .8; }
