body{font-family:sans-serif;margin:0 0 4rem;text-align:center;padding:2rem;color:#222}
img.cover{max-width:340px;width:70%;height:auto;border-radius:8px;
          box-shadow:0 4px 12px rgba(0,0,0,.15);margin:0.5rem auto 1rem}
img.logo{position:fixed;top:0.5rem;right:1rem;width:90px;height:auto;opacity:.9}
a.button{display:inline-block;margin-top:1rem;padding:.7rem 1.4rem;
         background:#ffbf00;color:#000;text-decoration:none;border-radius:6px;font-weight:600}
section{max-width:780px;margin:2.5rem auto;text-align:left;line-height:1.6}
h2{margin-top:2.5rem;font-size:1.6rem}
.contact a{color:#0077cc;text-decoration:none}
.contact a:hover{text-decoration:underline}
hr{border:0;border-top:1px solid #ddd;margin:3rem auto;width:70%}
@media (max-width: 600px) {
  img.logo {
    /* switch off fixed positioning */
    position: relative;
    top: auto;
    right: auto;

    /* shrink & center it */
    display: block;
    margin: 1rem auto;
    width: 60px;
  }
  img.cover {
    /* optionally make the cover a bit larger on phones */
    width: 90%;
    max-width: 340px;
  }
}


/* ── Site Navigation Tabs ── */
.site-nav {
    background: #fff;
    border-bottom: 1px solid #ddd;
    padding: 0.5rem 2rem;
  }
  .site-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 2rem;
  }
  .site-nav a {
    text-decoration: none;
    color: #222;
    font-weight: bold;
    padding: 0.5rem;
  }
  .site-nav a:hover {
    color: #ffbf00;
  }
  .site-nav a.active {
    border-bottom: 3px solid #ffbf00;
  }