/* Work archive additions — real portfolio media curated from the supplied Drive archive. */
.portfolio-proof {
  margin-top:clamp(44px,6vw,82px);
  padding-top:clamp(30px,4vw,48px);
  border-top:1px solid var(--soft-grey);
}
.dark-section .portfolio-proof { border-color:rgba(255,255,255,.14); }
.portfolio-proof-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin-bottom:22px;
}
.portfolio-proof-head .eyebrow { margin:0; }
.portfolio-proof-note {
  max-width:540px;
  margin:0;
  color:var(--text-grey);
  font-size:12px;
  line-height:1.7;
  text-align:end;
}
.dark-section .portfolio-proof-note { color:var(--dark-secondary); }
.portfolio-video-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  max-width:980px;
}
.portfolio-video-card {
  margin:0;
  border:1px solid var(--soft-grey);
  background:var(--paper);
  overflow:hidden;
}
.dark-section .portfolio-video-card {
  border-color:rgba(255,255,255,.14);
  background:#0C0F14;
}
.portfolio-video-card video {
  width:100%;
  height:clamp(420px,52vw,650px);
  object-fit:cover;
  background:#050608;
  display:block;
}
.portfolio-video-card figcaption {
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:14px 16px 16px;
  color:var(--text-grey);
  font-size:11px;
  line-height:1.5;
}
.dark-section .portfolio-video-card figcaption { color:#B7BDC8; }
.portfolio-video-card figcaption strong {
  color:var(--ink);
  font-weight:600;
}
.dark-section .portfolio-video-card figcaption strong { color:#F0F2F7; }
.portfolio-gallery {
  --portfolio-marquee-gap:12px;
  --portfolio-marquee-duration:32s;
  position:relative;
  width:100%;
  overflow:hidden;
  isolation:isolate;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
}
.portfolio-marquee-track {
  display:flex;
  width:max-content;
  will-change:transform;
  animation:portfolio-marquee var(--portfolio-marquee-duration) linear infinite;
}
.portfolio-marquee-group {
  display:flex;
  flex:none;
  gap:var(--portfolio-marquee-gap);
  padding-inline-end:var(--portfolio-marquee-gap);
}
.portfolio-gallery:hover .portfolio-marquee-track,
.portfolio-gallery:focus-within .portfolio-marquee-track {
  animation-play-state:paused;
}
.portfolio-gallery-button {
  position:relative;
  flex:0 0 clamp(250px,29vw,430px);
  width:clamp(250px,29vw,430px);
  aspect-ratio:4/3;
  padding:0;
  border:1px solid var(--soft-grey);
  background:#ECEEF2;
  overflow:hidden;
  cursor:zoom-in;
}
@keyframes portfolio-marquee {
  from { transform:translate3d(0,0,0); }
  to { transform:translate3d(-50%,0,0); }
}
.dark-section .portfolio-gallery-button {
  border-color:rgba(255,255,255,.14);
  background:#0E1219;
}
.portfolio-gallery-button img {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
}
.portfolio-gallery-button:hover img,
.portfolio-gallery-button:focus-visible img { transform:scale(1.025); }
.portfolio-gallery-button::after {
  content:'↗';
  position:absolute;
  inset-inline-end:10px;
  bottom:10px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(8,10,14,.78);
  color:#fff;
  font-size:11px;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .2s ease,transform .2s ease;
}
.portfolio-gallery-button:hover::after,
.portfolio-gallery-button:focus-visible::after { opacity:1; transform:none; }
.portfolio-lightbox {
  width:min(1180px,calc(100vw - 32px));
  height:min(88vh,900px);
  padding:0;
  border:0;
  background:#07090D;
  color:#fff;
  overflow:hidden;
}
.portfolio-lightbox::backdrop { background:rgba(4,6,9,.84); backdrop-filter:blur(8px); }
.portfolio-lightbox-shell { position:relative; width:100%; height:100%; display:grid; place-items:center; padding:54px 24px 24px; }
.portfolio-lightbox img { max-width:100%; max-height:100%; object-fit:contain; }
.portfolio-lightbox-close {
  position:absolute;
  top:12px;
  inset-inline-end:12px;
  z-index:2;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  background:rgba(7,9,13,.72);
  color:#fff;
  cursor:pointer;
  font-size:21px;
  line-height:1;
}
.portfolio-lightbox-caption {
  position:absolute;
  inset-inline-start:18px;
  top:18px;
  margin:0;
  color:#AEB5C1;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
html[lang="ar"] .portfolio-lightbox-caption { letter-spacing:0; text-transform:none; }
@media (max-width:820px) {
  .portfolio-proof-head { align-items:flex-start; flex-direction:column; }
  .portfolio-proof-note { text-align:start; }
  .portfolio-video-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .portfolio-video-card video { height:clamp(360px,75vw,560px); }
  .portfolio-gallery { --portfolio-marquee-gap:10px; }
  .portfolio-gallery-button {
    flex-basis:clamp(230px,58vw,360px);
    width:clamp(230px,58vw,360px);
  }
}
@media (max-width:520px) {
  .portfolio-video-grid { grid-template-columns:1fr; }
  .portfolio-video-card video { height:auto; aspect-ratio:9/16; }
  .portfolio-gallery {
    --portfolio-marquee-gap:8px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 2.5%,#000 97.5%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 2.5%,#000 97.5%,transparent 100%);
  }
  .portfolio-gallery-button {
    flex-basis:min(76vw,320px);
    width:min(76vw,320px);
    aspect-ratio:1/1;
  }
  .portfolio-lightbox-shell { padding:52px 12px 12px; }
}

@media (prefers-reduced-motion:reduce) {
  .portfolio-gallery {
    overflow-x:auto;
    -webkit-mask-image:none;
    mask-image:none;
    scrollbar-width:thin;
  }
  .portfolio-marquee-track {
    animation:none!important;
    transform:none!important;
  }
  .portfolio-marquee-group[aria-hidden="true"] { display:none; }
}

/* Six-item work index on this portfolio revision. */
.work-index-inner { grid-template-columns:repeat(6,minmax(0,1fr)); }
@media (max-width:1080px) {
  .work-index-inner { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .work-index-link:nth-child(odd) { border-inline-start:1px solid var(--soft-grey); }
  .work-index-link:nth-child(3n+1) { border-inline-start:0; }
}
@media (max-width:700px) {
  .work-index-inner { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .work-index-link:nth-child(3n+1) { border-inline-start:1px solid var(--soft-grey); }
  .work-index-link:nth-child(odd) { border-inline-start:0; }
}
@media (max-width:480px) {
  .work-index-inner { grid-template-columns:1fr; }
  .work-index-link { border-inline-start:0!important; }
}