/* ADA: skip link */
.skip-link{
  position:absolute; left:-999px; top:0; z-index:9999;
  background:#fff; color:#000; padding:.75rem 1rem; border:2px solid #000;
}
.skip-link:focus{ left:1rem; top:1rem; }

/* ADA: focus visibility */
:focus-visible{ outline:3px solid currentColor; outline-offset:3px; }

/* Layout */
:root{ --content-max: 760px; }
.content-narrow{ max-width: var(--content-max); }
.section-alt{ background:#f6f6f6; }
.hero-card{ max-width: 1100px; }

.tracking-wide{ letter-spacing:.08em; }
.letterspace-tight{ letter-spacing:.02em; }

/* =========================
   TYPOGRAPHY
   ========================= */

   body {
    font-family: "proxima-nova", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.75; /* increased slightly for long-form reading */
    color: #111;
  }
  
  /* Headings stay Brandon Grotesque */
  h1, h2, h3, h4, h5, h6,
  .display-1, .display-2, .display-3 {
    font-family: "brandon-grotesque", sans-serif;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }
  
  /* Emphasis precision (client is a stickler) */
  em {
    font-style: italic;
  }
  
  strong {
    font-weight: 600;
  }
  

.navbar .nav-link{
  padding: .75rem 1rem;
  color:#111;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus-visible{
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* Where to watch list */
.schedule-row{
  display:flex; gap:1.25rem; padding:.65rem 0;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.schedule-row:last-child{ border-bottom:0; }
.schedule-date{ min-width:140px; font-weight:700; }
.schedule-meta{ color: rgba(0,0,0,.75); }

/* Vimeo corners */
.ratio.rounded-4{ border-radius: 1rem; }



.ff-site-title {
  color: #868687;
  font-size: 2em;
}

/* Mobile */
@media (max-width: 576px) {
  .ff-site-title {
    font-size: 1.4em;
  }
}


.ff-site-subheader{
  font-size: 1.6em;
  font-family: "brandon-grotesque", sans-serif;
}

.ff-logo{
  background: #000;
  color: #ffffff;
  padding-left: 20px;
  padding-right: 20px;
  font-family: "brandon-grotesque", sans-serif;
  border-radius: 3px;
}


   .headshot img {
    height: 160px;  
    width: 100%;
    object-fit: cover;
    object-position: center center;
  }

  .center{
    text-align: center;
  }
  
  #watch p a{
    color:#868687;
  }

  .button{
    color:#fff;
    background: #000;
    border-radius: 5px;
    display: inline-block;
    padding: 10px 30px;
    text-decoration: none;
  }