/* === Responsive tweaks (mobile-first additions) === */
@media (max-width: 900px) {
  .header-row { grid-template-columns: 1fr auto; }
  .primary-nav { display:none; } /* Simplify for mobile baseline; hook a burger later if needed */
  .hero,  .hero__sticky { height: 75dvh; min-height: 460px; }
  .logo-grid { grid-template-columns: repeat(4, 1fr); gap: 1rem; }
  .offices-row { grid-template-columns:1fr; }
  .intro-glow { width:min(96vw, 820px); height: 300px; }

  .hero__play-cursor {
    opacity: 1 !important;
    position: absolute;
    transition:none;
    justify-content: center;
    left:50%;
    transform:translateX(-47.5%) !important;
    top:calc(75vh - 50%);
    z-index:9999;
}

    .header-block {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        height: 25dvh;
        display: grid;
        align-content: space-between;
        bottom: 0;
    }
.header-block .tagline {
    order:1;
}
.header-block > * {
    grid-column: 1 !important;
    grid-row: auto !important;
}
.header-block .clocks {
    display: flex;
    flex-direction: column;
    gap: 0.8em;
    order:2;
}
.header-block .logo, .header-block .nav, .scroll-indicator, .sticky__nav {
    display: none;
}
  
.sf-closer__mark {
  display:none;
}

.sf-closer__top > * {
    grid-column: 1;
    grid-row: auto;
}
.sf-closer__offices {
    flex-direction: column;
}
.sf-closer__bigtype {
  bottom:-0.8em;
}
.sf-closer__bigtype img {
  width:100%;
}





}


@media (max-width: 520px) {
  .timezones { display:none; }
  .intro-title { font-size: clamp(2rem, 9vw, 3rem); }
  .logo-grid { grid-template-columns: repeat(3, 1fr); }
}


/* Mobile */
@media (max-width: 767px) {
  .hero__watermark {
    bottom: -1.5em;
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1440px) {
  .hero__watermark {
    bottom: -3em;
  }
}

@media (min-width: 1440px) and (max-width: 1768px) {
  .hero__watermark {
    bottom: -5em;
  }
}

/* Desktop */
@media (min-width: 1768px) {
  .hero__watermark {
    bottom: -8em;
  }
}
/* ===== HARD FIX: Subfracture team bio ===== */

/* Ensure nothing inside the bio is clipped */
.sf-team__block,
.sf-team__grid,
.sf-team__bio,
.sf-team__bio-body {
  max-width: 100vw !important;
  overflow: visible !important;
  box-sizing: border-box;
}

/* If some other parent is hiding horizontal overflow, ignore it for this block */
.sf-team__block { isolation: isolate; }

/* Tidy link colour in the bio + member list */
.sf-team__bio a,
.sf-team__grid a {
  color: inherit !important;
  text-decoration: none;
}
.sf-team__bio a:hover,
.sf-team__grid a:hover,
.sf-team__bio a:focus,
.sf-team__grid a:focus {
  text-decoration: underline;
}


/* Auto-carousel (mobile) — force flex track */
@media (max-width: 900px){
  .logo-strip { position: relative; overflow: hidden; }

  .logo-strip .logo-grid{
    display: flex !important;         /* override any grid rule */
    width: max-content;                /* track width = sum of items */
    gap: 7rem;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
    animation: logo-marquee var(--dur, 20s) linear infinite;
    will-change: transform;
  }

  .logo-grid__item { flex: 0 0 auto; }
  .logo-grid__item img,
  .logo-grid__item svg { height: 42px; width: auto; display: block; }
}

@keyframes logo-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-1 * var(--w, 0px))); }
}

/* Optional: don’t disable if you want to test motion */
@media (prefers-reduced-motion: reduce){
  .logo-strip .logo-grid { animation: none !important; }
}