.gallery-page { background:#090909; color:#f7f7f7; }
.gallery-page main { overflow:hidden; }
.gallery-page .gallery-hero {
  position:relative;
  height:100svh;
  min-height:100svh;
  box-sizing:border-box;
  align-items:flex-end;
  padding:clamp(90px,12vw,160px) clamp(24px,8vw,120px) clamp(60px,8vw,100px);
  background-image:url('/img/Untitled5HQ.png');
  background-position:center;
  background-size:cover;
}
.gallery-page .gallery-hero::after {
  background:linear-gradient(90deg,rgba(9,9,9,.9),rgba(9,9,9,.32) 78%),linear-gradient(0deg,#090909 0%,transparent 55%);
}
.gallery-page .gallery-hero__content { position:relative; z-index:2; max-width:880px; }
.gallery-page .projects-kicker { color:#fff36d; font:700 12px/1.5 var(--font-ibm); letter-spacing:.08em; }
.gallery-page .gallery-hero__content h1 { margin:22px 0; color:#f7f7f7; font:700 clamp(82px,15vw,190px)/.76 var(--font-greycliff); letter-spacing:-.075em; }
.gallery-page .gallery-hero__content > p:not(.projects-kicker) { max-width:500px; margin:0; color:#ddd; font:400 14px/1.6 var(--font-ibm); }
.gallery-page .projects-scroll-link { display:inline-flex; gap:18px; align-items:center; margin-top:28px; padding-bottom:8px; border-bottom:1px solid #fff36d; color:#fff36d; font:700 12px var(--font-ibm); }
.gallery-page .projects-scroll-link:hover { color:#f2ad73; border-color:#f2ad73; }
.projects-ribbons { position:relative; height:210px; margin:26px 0 40px; overflow:hidden; }
.projects-ribbon { position:absolute; top:50%; left:-7.5%; width:115%; height:94px; }
.projects-ribbon--rainbow { transform:translateY(-50%) rotate(4deg); background:linear-gradient(105deg,#f8ee72 0%,#f2ad73 22%,#dc4760 50%,#9b3b7d 75%,#1489b4 100%); background-size:220% 220%; background-position:0% 50%; animation:skills-gradient-flow 10s ease-in-out infinite; }
.projects-ribbon--yellow { transform:translateY(-50%) rotate(-4deg); background:#fff36d; }
.gallery-page .gallery { width:min(calc(100% - clamp(40px,11vw,160px)),1360px); margin:0 auto; padding:0 0 100px; color:#f7f7f7; }
.projects-archive__heading { display:grid; grid-template-columns:1fr minmax(240px,420px); align-items:end; gap:30px; margin-bottom:34px; }
.projects-archive__heading h2 { margin-top:14px; color:#f7f7f7; font:700 clamp(48px,7vw,88px)/.82 var(--font-greycliff); letter-spacing:-.06em; }
.projects-archive__heading > p { padding-bottom:5px; color:#aaa; font:400 13px/1.6 var(--font-ibm); }
.gallery-page .gallery__grid { display:block; column-count:4; column-gap:20px; }
.gallery-page .gallery__item { display:inline-block; vertical-align:top; width:100%; margin:0 0 20px; break-inside:avoid; overflow:hidden; border-radius:12px; background:#171717; }
.gallery-page .gallery__item img { filter:saturate(.9); transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .55s ease; }
.gallery-page a.gallery__item:hover img,.gallery-page a.gallery__item:focus-visible img { transform:scale(1.035); filter:saturate(1.08) brightness(1.04); }
.gallery-page .site-footer { margin-top:0; }
@media(max-width:900px) {
  .gallery-page .gallery__grid { column-count:3; }
}
@media(max-width:700px) {
  .gallery-page .gallery-hero { min-height:100svh; height:100svh; padding:100px 24px 56px; }
  .gallery-page .gallery-hero__content h1 { font-size:clamp(76px,18vw,130px); }
  .projects-ribbons { height:170px; margin:18px 0 28px; }
  .projects-ribbon { height:76px; }
  .gallery-page .gallery { width:calc(100% - 40px); padding-bottom:65px; }
  .projects-archive__heading { grid-template-columns:1fr; gap:18px; margin-bottom:24px; }
  .gallery-page .gallery__grid { column-count:2; column-gap:12px; }
  .gallery-page .gallery__item { margin-bottom:12px; border-radius:9px; }
}
@media(prefers-reduced-motion:reduce) { .projects-ribbon--rainbow { animation:none; background-position:50% 50%; } }