@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-bottom: 1px solid rgba(17, 17, 17, .08);
  background: rgba(245, 245, 242, .82);
  color: #111;
  font-family: "Inter", Helvetica, Arial, sans-serif;
  font-size: .88rem;
  font-weight: 700;
  mix-blend-mode: normal;
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  pointer-events: none;
}
.restored-shell-header a { color: inherit; text-decoration: none; pointer-events: auto; }
.restored-shell-logo { font-size: 1rem; letter-spacing: -.07em; }
.restored-shell-logo span { color: #ff5c35; }
.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-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-3d {
  overflow: hidden;
  padding: clamp(4rem, 8vw, 8rem) 0;
  background: #111;
  color: #f6f6f2;
  font-family: "Inter", Helvetica, Arial, sans-serif;
}
.fun-3d-source-hidden { display: none !important; }
.fun-3d__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding: 0 max(1rem, 3vw) clamp(2rem, 4vw, 4rem);
}
.fun-3d__heading p {
  margin: 0 0 1rem;
  color: #9b9b95;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.fun-3d__heading h2 {
  margin: 0;
  font-family: "Inter", Helvetica, Arial, sans-serif !important;
  font-size: clamp(3.5rem, 9vw, 9rem);
  font-weight: 800;
  letter-spacing: -.075em;
  line-height: .82;
}
.fun-3d__heading h2 span { color: #ff5c35; }
.fun-3d__controls { display: flex; gap: .55rem; }
.fun-3d__controls button {
  width: 3.25rem;
  height: 3.25rem;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 50%;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: 1.25rem;
  transition: background 180ms ease, color 180ms ease;
}
.fun-3d__controls button:hover { background: #f6f6f2; color: #111; }
.fun-3d__rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(17rem, 30vw, 31rem);
  gap: clamp(.75rem, 1.4vw, 1.4rem);
  overflow-x: auto;
  padding: 0 max(1rem, 3vw) 1.2rem;
  scroll-padding-inline: max(1rem, 3vw);
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: #666 transparent;
  overscroll-behavior-inline: contain;
}
.fun-3d__rail figure { margin: 0; scroll-snap-align: start; }
.fun-3d__rail img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #f3f3ef;
}
.fun-3d__rail figcaption {
  padding-top: .75rem;
  color: #8f8f89;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
}
@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-intro__copy { grid-column: 1; }
  .bug-hunters-grid { grid-template-columns: 1fr; }
  .bug-hunters-grid__item--wide { grid-column: auto; }
  .fun-3d__heading { align-items: center; }
  .fun-3d__controls button { width: 2.8rem; height: 2.8rem; }
  .fun-3d__rail { grid-auto-columns: 82vw; }
}
