:root { color-scheme: dark; }
  * { box-sizing: border-box; }
  body {
    margin: 0; min-height: 100vh; display: grid; place-items: center;
    background: radial-gradient(120% 90% at 50% 0%, #1E2A24 0%, #0F1512 62%);
    color: #F2EEE4; text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    padding: 2rem 1rem;
  }
  img { width: 130px; margin: 0 auto 1.4rem; display: block; }
  h1 {
    font-family: 'Iowan Old Style', Palatino, 'Times New Roman', serif;
    font-size: clamp(1.5rem, 5vw, 2.3rem); margin: 0 0 .4rem; color: #FBF7ED;
  }
  p.sub { font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: #F2B705; margin: 0 0 2.2rem; }
  .langs { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; max-width: 560px; margin: 0 auto; }
  .langs a {
    display: block; padding: .8rem 1.35rem; min-width: 130px;
    border: 1px solid rgba(255,255,255,.22); border-radius: 3px;
    color: #F2EEE4; text-decoration: none; font-size: .95rem;
    transition: border-color .18s, background .18s, transform .18s;
  }
  .langs a:hover { border-color: #F2B705; background: rgba(242,183,5,.08); transform: translateY(-2px); }
  .langs a small { display: block; font-size: .68rem; letter-spacing: .12em; color: #9AA49C; margin-top: .25rem; text-transform: uppercase; }
  .strip { position: fixed; top: 0; left: 0; right: 0; height: 4px; display: flex; }
  .strip i { flex: 1; }
  .strip i:nth-child(1){background:#1F7A3D}.strip i:nth-child(2){background:#FAFAF7}.strip i:nth-child(3){background:#C8102E}.strip i:nth-child(4){background:#F2B705}