*,
*::before,
*::after {
    box-sizing: border-box;
}

    body {
      margin: 0;
      padding-top: 0;
      background-color: #fff;
      font-family: "Century Gothic", sans-serif;
      min-height: 100vh;
      text-align: center;
    }

    main {
        flex: 1;
        width: 100%;
        max-width: 800px;
        margin: 0 auto;
        padding: 0 1rem;
        display: flex;
        flex-direction: column;
        justify-content: flex-start; /* not fully centered */
        margin-top: 1rem; /* adjust as needed */
    }

    main > *:not(.sponsor-row) {
        max-width: 100%;
    }

    header {
        width: 100%;
        padding-top: 0;
        text-align: center;
    }

    footer {
        font-family: "Century Gothic", sans-serif;
        color: #000;
        font-size: 18px;
        text-align: center;
        padding: 1.5rem;
    }

    .logo {
      margin: 20px 0 20px 0; /* increased bottom margin */
      max-width: 350px;
      width: 80%;
      height: auto;
    }
    
    .footerlogo {
        margin: 20px 0 0 0;
        max-width: 180px;
        width: 80%;
        height: auto;
    }

    h1 {
      font-size: 18px;
      font-weight: bold;
      color: #000;
      margin-bottom: 30px; /* extra space below as well */
      line-height: 1.4;
    }

    h1 .highlight {
      color: #08BD08;
    }

    h2 {
        font-size: 16px;
        font-weight: bold;
        color: #000;
        margin-bottom: 20px;
    }
    
    main h2 {
        align-self: stretch;
        text-align: left;
    }

    p {
        font-size: 16px;
      font-weight: normal;
      text-align: justify;
      color: #000;
      margin-bottom: 10px; /* extra space below as well */
      line-height: 1.4;
    }

    main ul:not(.sponsor-row) {
        align-self: stretch;
        text-align: left;
        list-style: none;
    }
    
    main ul li {
  margin-bottom: 0.75rem; /* or 12px, adjust to taste */
  line-height: 1.4;       /* keeps text readable */
}

main ul li:last-child {
  margin-bottom: 0;
}

    .button-container {
      margin: 30px auto 0 auto;
      display: block;
      gap: 20px;
      width: 100%;
      max-width: 400px;
      padding: 0;
      text-align: center;
    }

    .link-button {
      display: inline-block;
      text-align: center;
      padding: 15px;
      border: 2px solid #08BD08;
      border-radius: 25px;
      color: #08BD08;
      text-decoration: none;
      font-weight: bold;
      font-size: 18px;
      background: transparent;
      width: 100%;
      max-width: 400px;
      margin-bottom: 20px;
      box-sizing: border-box;
      transition: all 0.3s ease;
    }

    .link-button:hover {
      background-color: #08BD08;
      color: #fff;
    }
    
    .register-button {
        text-align: center;
        font-size: 16px;
        display: block;
        margin: 20px auto 20px;
        background-color: #990000;
        width: 100px;
        line-height: 2.5em;
        border-radius: 25px;
    }
    
    .conference-year {
  font-size: 36px;
  font-weight: bold;
  margin: 1.5rem 0 1.5rem;
  text-align: center;
  color: #08BD08; /* ISfL green */
}
    
    :target {
  scroll-margin-top: 1.5rem;
}
    
    .agenda {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 2rem;
}

.agenda caption {
  text-align: left;
  font-weight: bold;
  margin-bottom: 0.75rem;
}

.agenda th,
.agenda td {
  padding: 0.6rem 0.75rem;
  text-align: left;
  vertical-align: top;
}

.agenda th {
  width: 4.5rem;
  font-weight: bold;
  white-space: nowrap;
}

.agenda tr:not(.block) {
  border-bottom: 1px solid #e0e0e0;
}

/* Green blocks: breaks, registration, lunch */
.agenda tr.block {
  background-color: #990000;
  color: white;
  font-weight: bold;
}

/* Light highlight rows */
.agenda tr.highlight {
  background-color: #fcbd93;
}

.agenda td ul {
    list-style: none !important;
    padding-left: 1.5rem;
    margin: 0;
}

.agenda td li {
    list-style: none !important;
}

/* Mobile friendliness */
.table-wrapper {
  overflow-x: auto;
}

.speaker {
  margin-bottom: 2.5rem;
}

.speaker-photo {
  float: right;
  margin: 0 0 1rem 1.5rem;
  width: 120px;
  height: auto;
  border-radius: 4px; /* optional */
}

/* Clear float after each speaker */
.speaker::after {
  content: "";
  display: block;
  clear: both;
}

.speaker h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-size: 16px;
  font-weight: bold;
  color: #000;
  text-align: left;
}

.sponsors {
  margin-top: 3rem;
}

.sponsor-row {
  list-style: none;
  padding: 0;
  margin: 2rem 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  align-items: center;
  align-self: stretch;
  gap: 2rem;
  width: 100%;
}

.sponsor-row li {
    display: flex;
    justify-content: center;
}

.sponsor-row img {
  max-width: 180px;
  width: 100%;
  height: auto;
}

@media (max-width: 480px) {
    .sponsor-row {
    grid-template-columns: repeat(auto-fit, minmax(80px, max-content));
    gap: 1rem;                          /* smaller gap for small screens */
    justify-content: center;
  }

  .sponsor-row img {
    max-width: 100px;  /* shrink logos for mobile */
    width: 100%;
    height: auto;
  }
}