body {
  margin: 0;
  padding: 0;
  background: #00333f;
  color: #d9e9eb;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;
  min-height: 100vh;
}
    img.logo {
      width: 220px;
      max-width: 70vw;
    }
.page {
  display: flex;
  justify-content: center;
  width: 100%;
}

.content {
  max-width: 1000px;
  width: 100%;
  padding: 0 20px;
}


.content.left { text-align:left }
    a {
      color: #9dd0d8;
      text-decoration: underline;
      font-weight: 100;
    }
a:hover {
  color: #bfe4ea;
  text-decoration: none;
}
/* active nav item (desktop + mobile) */
.nav-desktop a.active,
.nav-mobile a.active {
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
  cursor: default;
  pointer-events: none;
}

img.logo:hover { opacity:0.5 }
    .social-bar {
      margin-top: 2rem;
      display: flex;
      gap: 0.75rem;
      justify-content: center;
padding-bottom:20px
    }

    .social-link {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #9dd0d8;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #9dd0d8;
      text-decoration: none;
      font-size: 0.9rem;
      transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    }

    .social-link:hover {
      background: #9dd0d8;
      color: #00333f;
      border-color: #9dd0d8;
    }

    .social-link i {
      font-size: 1rem;
      line-height: 1;
    }

    .social-link.cb span {
      font-weight: 700;
      text-transform: lowercase;
      letter-spacing: 0.02em;
      font-size: 0.8rem;
    }

.equation {
  text-align: center;
  font-family: "Times New Roman", serif;
  font-style: italic;
  line-height: 1.2;
}
.equation .equals {
  font-style: normal;
}
.equation strong {
  font-style: normal;
}

#lower-nav { color:#d9e9eb; line-height:150%; margin-top:20px; text-align:center }

.tagline, .status {
  text-align: center;
  color: rgba(217, 233, 235, 0.25);
}
.tagline p { font-variant: small-caps;letter-spacing: 0.08em;margin-bottom:0; font-weight:500 }

.status, .contact-footer { margin-top:20px }
.status strong { font-weight:600 }

.contact-footer a { color: rgba(217, 233, 235, 0.25); }

.dash { margin-top:20px; text-align:center }

#home #upper-nav { display:none; visibility: hidden }

.nav-mobile a.active {
  color: #d9e9eb;
  text-decoration: none;
  cursor: default;
  pointer-events: none;
  font-weight: 500;
}


#header-container,
#footer-container {
  position: relative;
  z-index: 10;
text-align:center
}

/* --- header layout --- */
.header-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
margin-top:-20px;
margin-bottom:20px
}

/* hamburger button */
.nav-toggle {
  display: none;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: none;
  border: 0;
  color: #d9e9eb;
  font-size: 1.8rem;
  cursor: pointer;
  padding: 0.5rem;
}


/* desktop */
@media (min-width: 769px) {
  .nav-mobile,
  .nav-toggle {
    display: none;
  }
}

/* mobile */
@media (max-width: 768px) {
  .nav-desktop {
    display: none;
  }

  .nav-toggle {
    display: block;
  }

  .nav-mobile {
    display: flex;
    flex-direction: column;
    align-items: left;
padding-left:40px;
    gap: 1.5rem;
    margin-top: 2rem;
  }

  .nav-mobile a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    font-size: 1.05rem;
  }
}
[hidden] {
  display: none !important;
}

.contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 900px;
  margin: 3rem auto;
  text-align: center;
}

.contact-card {
  border: 1px solid rgba(0,0,0,0.1);
  padding: 2rem 1.5rem;
}

.contact-card h3 {
  margin-bottom: 1rem;
  font-weight: 600;
}

.contact-card a {
  color: ##9dd0d8;
  text-decoration: underline;
  font-weight: 500;
}

.contact-card a:hover {
  text-decoration: none;
}

.qr {
  width: 160px;
  height: auto;
  margin: 0 auto;
}

/* VISIBILITY HELPERS */
.desktop-only {
  display: block;
}

.mobile-only {
  display: none;
}

/* MOBILE */
@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .desktop-only {
    display: none;
  }

  .mobile-only {
    display: inline-block;
    padding: 0.75rem 1rem;
    border: 1px solid #00333f;
    border-radius: 4px;
  }
}

.contact-icon { font-size:50px }
.contact-icon img { opacity:.85 }