@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap");

.portfolio-restored-project {
  overflow-x: clip;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.portfolio-restored-project :is(h1, h2, h3, h4, h5, h6, p, a, span, strong, b, em, li, button, input, textarea, label, figcaption) {
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
}
.portfolio-restored-project :is(h1, .heading-font) { font-weight: 800 !important; }
.portfolio-restored-project :is(h2, h3, h4, h5, h6, strong, b) { font-weight: 700 !important; }
.portfolio-restored-project :is(p, li, figcaption) { font-weight: 400; }
.restored-shell-header {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.35rem max(2rem, 3vw);
  border: 0;
  background: transparent;
  color: #fff;
  font-family: "Inter", Helvetica, Arial, sans-serif;
  font-size: .88rem;
  font-weight: 700;
  mix-blend-mode: difference;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  pointer-events: none;
}
.restored-shell-header a {
  color: inherit;
  text-decoration: none;
  mix-blend-mode: normal;
  pointer-events: auto;
}
.restored-shell-header.is-over-dark {
  background: transparent;
  color: #fff;
}
.restored-shell-header.is-over-media {
  color: #fff;
  mix-blend-mode: difference;
}
.restored-shell-logo { font-size: 1rem; letter-spacing: -.07em; }
.restored-shell-logo span { color: inherit; }
.restored-shell-nav { display: flex; gap: clamp(1.2rem, 2.5vw, 2.7rem); }
.portfolio-restored-project #header { display: none !important; }
.portfolio-restored-project .header-announcement-bar-wrapper { display: none !important; }
.portfolio-project-intro {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(0, 2fr);
  gap: clamp(1.5rem, 4vw, 5rem);
  padding: clamp(3rem, 7vw, 7rem) max(2rem, 5vw);
  background: #f5f5f2;
  color: #111;
}
.portfolio-project-intro__label {
  margin: .3rem 0 0;
  font-size: .75rem;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.portfolio-project-intro > div { max-width: 54rem; }
.portfolio-project-intro h2 {
  margin: 0 0 1.25rem;
  font-size: clamp(2rem, 4vw, 4.5rem);
  letter-spacing: -.05em;
  line-height: .98;
}
.portfolio-project-intro > div > p {
  max-width: 48rem;
  margin: 0;
  font-size: clamp(1.05rem, 1.65vw, 1.45rem);
  line-height: 1.45;
}
.bug-hunters-redesign main {
  padding-top: 0;
  background: #0c0c0d;
  color: #f7f7f3;
}
.bug-hunters-hero {
  width: 100%;
  height: min(82svh, 58vw);
  min-height: 36rem;
  overflow: hidden;
  background: #050505;
}
.bug-hunters-hero video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bug-hunters-intro {
  min-height: 74svh;
  display: grid;
  grid-template-columns: minmax(8rem, .65fr) minmax(0, 2fr);
  align-content: end;
  gap: clamp(1.5rem, 4vw, 5rem);
  padding: clamp(9rem, 16vw, 13rem) max(1rem, 3vw) clamp(4rem, 8vw, 8rem);
}
.bug-hunters-intro__eyebrow {
  margin: .7rem 0 0;
  color: #a7a7a0;
  font-size: .72rem;
  font-weight: 700 !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.bug-hunters-intro h1 {
  margin: 0;
  max-width: 8ch;
  font-size: clamp(4rem, 11vw, 11rem);
  letter-spacing: -.075em;
  line-height: .82;
}
.bug-hunters-intro h1 span { color: #4285f4; }
.bug-hunters-intro__copy {
  grid-column: 2;
  max-width: 46rem;
  margin-top: clamp(2rem, 5vw, 5rem);
}
.bug-hunters-intro__copy p {
  margin: 0;
  color: #d4d4cf;
  font-size: clamp(1.1rem, 1.7vw, 1.5rem);
  line-height: 1.5;
}
.bug-hunters-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(.75rem, 1.5vw, 1.5rem);
  padding: 0 max(1rem, 3vw) clamp(4rem, 10vw, 10rem);
}
.bug-hunters-grid__item {
  display: grid;
  place-items: center;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: #171719;
}
.bug-hunters-grid__item--wide { grid-column: 1 / -1; }
.bug-hunters-grid__item img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}
.fun-hero {
  position: relative;
  width: 100%;
  height: min(82svh, 58vw);
  min-height: 36rem;
  overflow: hidden;
  background: #111;
}
.fun-hero iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100vw, 145.8svh);
  height: max(56.25vw, 82svh);
  border: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.fun-3d {
  overflow: hidden;
  padding: clamp(5rem, 9vw, 9rem) 0;
  background: #fff;
  color: #111;
  font-family: "Inter", Helvetica, Arial, sans-serif;
}
.fun-3d__heading {
  position: relative;
  padding: 0 max(1.25rem, 4vw) clamp(3rem, 5vw, 5rem);
}
.fun-3d__heading h2 {
  color: #111 !important;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-weight: 800;
}
.fun-3d__rail {
  display: flex;
  align-items: stretch;
  gap: clamp(.75rem, 1.4vw, 1.4rem);
  overflow-x: auto;
  padding: 0 max(1rem, 3vw) 1.2rem;
  cursor: grab;
  scroll-padding-inline: max(1rem, 3vw);
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: #aaa transparent;
  overscroll-behavior-inline: contain;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}
.fun-3d__rail.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.fun-3d__rail figure {
  flex: 0 0 auto;
  height: clamp(23rem, 38vw, 40rem);
  margin: 0;
  scroll-snap-align: start;
}
.fun-3d__rail img {
  display: block;
  width: auto;
  max-width: none;
  height: 100%;
  object-fit: contain;
  background: transparent;
  pointer-events: none;
}
.fun-3d__rail .fun-3d__video { aspect-ratio: 16 / 9; }
.fun-3d__rail iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #111;
  pointer-events: none;
}
.portfolio-restored-project .fun-section-title,
.fun-3d__heading .fun-section-title {
  width: max-content !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: max(1.25rem, 4vw) !important;
  color: #111 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  font-size: clamp(3.25rem, 6.6vw, 7.75rem) !important;
  line-height: .86 !important;
  letter-spacing: -.065em !important;
}
.fun-3d__heading .fun-section-title { margin-left: 0 !important; }
.portfolio-restored-project .page-section .fun-section-title {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  padding-left: max(1.25rem, 4vw) !important;
  box-sizing: border-box !important;
}
.portfolio-restored-project .fun-section-dot { color: #285d4a !important; }
.portfolio-restored-project .fun-section-description {
  width: min(42rem, 88vw) !important;
  max-width: 42rem !important;
  margin: 1.75rem auto 0 max(1.25rem, 4vw) !important;
  padding: 0 !important;
  color: #555 !important;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-size: clamp(1.05rem, 1.45vw, 1.3rem) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.fun-3d__heading .fun-section-description { margin-left: 0 !important; }
.portfolio-restored-project .page-section .fun-section-description {
  width: min(42rem, 88vw) !important;
  margin-left: calc(50% - 50vw + max(1.25rem, 4vw)) !important;
}
.portfolio-restored-project .fun-project-description {
  max-width: 28rem !important;
  margin: 1rem 0 2.5rem !important;
  padding: 0 !important;
  color: #666 !important;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-size: clamp(1rem, 1.15vw, 1.12rem) !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.portfolio-restored-project .fun-project-title {
  width: auto !important;
  max-width: 14ch !important;
  margin: 0 !important;
  color: #111 !important;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-size: clamp(2rem, 3.2vw, 3.75rem) !important;
  font-weight: 700 !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: normal !important;
}
.portfolio-restored-project .fun-category-heading-section {
  box-sizing: content-box !important;
  padding-top: clamp(5rem, 9vw, 9rem) !important;
}
.portfolio-restored-project .fun-project-section {
  box-sizing: content-box !important;
  padding-top: clamp(5rem, 9vw, 9rem) !important;
  padding-bottom: clamp(2rem, 4vw, 4rem) !important;
}
@media (max-width: 700px) {
  .restored-shell-header { padding: 1.1rem 1rem; font-size: .76rem; }
  .restored-shell-nav { gap: .8rem; }
  .restored-shell-nav a:nth-child(2) { display: none; }
  .portfolio-project-intro { grid-template-columns: 1fr; padding-right: 1rem; padding-left: 1rem; }
  .bug-hunters-intro { grid-template-columns: 1fr; min-height: 66svh; }
  .bug-hunters-hero,
  .fun-hero {
    height: 74svh;
    min-height: 30rem;
  }
  .fun-hero iframe {
    width: max(100vw, 131.6svh);
    height: max(56.25vw, 74svh);
  }
  .bug-hunters-intro__copy { grid-column: 1; }
  .bug-hunters-grid { grid-template-columns: 1fr; }
  .bug-hunters-grid__item--wide { grid-column: auto; }
  .fun-3d__heading { padding-bottom: 2rem; }
  .portfolio-restored-project .fun-section-title,
  .fun-3d__heading .fun-section-title {
    margin-left: 1rem !important;
    font-size: clamp(2.8rem, 13vw, 4.25rem) !important;
  }
  .portfolio-restored-project .page-section .fun-section-title {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    padding-left: 1rem !important;
  }
  .portfolio-restored-project .fun-section-description,
  .fun-3d__heading .fun-section-description {
    width: calc(100vw - 2rem) !important;
    margin-top: 1.25rem !important;
    margin-left: 1rem !important;
  }
  .portfolio-restored-project .page-section .fun-section-description {
    width: calc(100vw - 2rem) !important;
    margin-left: calc(50% - 50vw + 1rem) !important;
  }
  .portfolio-restored-project .fun-category-heading-section,
  .portfolio-restored-project .fun-project-section {
    padding-top: 4.5rem !important;
  }
  .portfolio-restored-project .fun-project-title {
    max-width: 16ch !important;
    font-size: clamp(2rem, 9vw, 3rem) !important;
  }
  .portfolio-restored-project .fun-project-description {
    width: min(28rem, calc(100vw - 2rem)) !important;
    margin-top: .85rem !important;
  }
  .fun-3d__rail figure { height: clamp(20rem, 105vw, 30rem); }
}