/* Zenirha cinematic portfolio. Scoped to the two work showcases. */
.work-section{padding-block:100px;overflow:hidden;background:radial-gradient(ellipse at 15% 30%,#35203755,transparent 60%)}
.work-section .section-head{max-width:760px;margin:0 auto 48px;text-align:center}

.showcase-kicker,.film-number,.film-format,.showcase-status,.archive-toolbar{font:500 11px/1.5 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}
.showcase-kicker{display:flex;align-items:center;gap:12px;color:var(--muted);margin:0 0 22px}
.showcase-kicker:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--magenta);box-shadow:0 0 18px #f250ff66}
.work-section .video-grid{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 3px 20px;align-items:start}
.work-section .video-grid::-webkit-scrollbar{display:none}
.work-section .video-card{flex:0 0 82%;min-width:0;scroll-snap-align:start;opacity:1;transform:none!important;border:0;background:transparent;text-align:left;position:relative}
.work-section .video-frame{aspect-ratio:16/9;border-radius:6px;overflow:hidden;border:1px solid #ffffff24;background:linear-gradient(135deg,#2c2035,#100d16);box-shadow:none;transform:none!important}
.work-section .video-frame::after,.project-grid .project-media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0004,transparent 38%,#0007);border:0;opacity:1;transform:none;pointer-events:none}
.work-section .video-frame::before,.project-grid .project-media::before{display:none}
.work-section .video-art{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.work-section .video-card:hover .video-art{transform:scale(1.035)}
.film-number{position:absolute;top:20px;left:22px;z-index:2;color:white}
.film-format{position:absolute;right:20px;top:18px;z-index:2;border:1px solid #ffffff66;border-radius:30px;padding:5px 10px;color:white;background:#0004;backdrop-filter:blur(12px)}
.work-section .video-meta{padding:23px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.work-section .video-title{font-size:clamp(1.25rem,2.1vw,1.9rem);line-height:1.2;letter-spacing:-.025em;margin:0}
.work-section .video-desc{font-size:12px;line-height:1.8;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted)}
.work-section .play-btn,.project-grid .play-btn{width:72px;height:72px;border:1px solid #fff8;border-radius:50%;background:#13101840;backdrop-filter:blur(14px);box-shadow:none;z-index:3;transition:background .3s,transform .4s}
.work-section .play-btn{left:50%;top:50%;transform:translate(-50%,-50%)}
.work-section .video-card:hover .play-btn{transform:translate(-50%,-50%) scale(1.08);background:#b52fc7aa}
.showcase-controls{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:10px;padding-top:20px;border-top:1px solid #ffffff26}
.showcase-pagination{display:flex;gap:8px}
.showcase-pagination button,.showcase-arrow,.archive-switch button{color:var(--muted);background:transparent;border:1px solid transparent;font:inherit;cursor:pointer;min-width:44px;min-height:44px;transition:color .25s,background .25s,border-color .25s}
.showcase-pagination button{font:12px var(--font-mono);border-bottom:1px solid #ffffff26}
.showcase-pagination button[aria-current=true]{color:var(--magenta);border-bottom-color:var(--magenta)}
.showcase-arrows{display:flex;gap:8px}.showcase-arrow{border-color:#ffffff30;border-radius:50%;font-size:21px}.showcase-arrow:disabled{opacity:.25;cursor:default}
.showcase-arrow:not(:disabled):hover,.archive-switch button[aria-pressed=true]{background:var(--text);color:var(--bg)}
.showcase-status{color:var(--muted);margin-left:auto;margin-right:20px}
.work-section .work-cta{margin-top:32px;text-align:left}
body:has(.project-grid) .page-hero{padding-block:90px 45px}
body:has(.project-grid) .page-hero h1{font-size:clamp(3.5rem,9vw,8rem);line-height:.98;letter-spacing:-.055em;max-width:1000px}
body:has(.project-grid) .page-hero .lede{max-width:600px;color:var(--muted)}
.archive-toolbar{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff26;padding:20px 0 38px;gap:20px;color:var(--muted)}
.archive-switch{display:flex;border:1px solid #ffffff26;border-radius:30px;padding:4px;gap:4px}.archive-switch button{padding:8px 18px;border-radius:24px;min-height:36px;font:11px var(--font-mono);letter-spacing:0}
.project-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:70px 36px;align-items:start}
.project-grid .project-card{grid-column:span 7;min-width:0;transform:none!important;--tilt:0deg;background:none;border:0;box-shadow:none;padding:0;text-align:left}
.project-grid .project-card:nth-child(4n+2),.project-grid .project-card:nth-child(4n+3){grid-column:span 5}
.project-grid .project-card:nth-child(4n+2){margin-top:110px}
.project-grid .project-card:nth-child(4n+4){margin-top:75px}
.project-grid .project-media{aspect-ratio:16/10;border-radius:5px;overflow:hidden;border:1px solid #ffffff26;transform:none!important;box-shadow:none!important;background:linear-gradient(135deg,#2c2035,#100d16)}
.project-grid .media-art{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.project-grid .project-card:hover .media-art{transform:scale(1.045)}
.project-grid .project-meta{padding:22px 0 0;border-top:0}
.project-grid .project-client:empty{display:none}
.project-grid .project-title{font-size:clamp(1.35rem,2.4vw,2.1rem);line-height:1.15;letter-spacing:-.03em;margin:0 0 12px}
.project-grid .project-desc{font-size:13px;color:var(--muted);line-height:1.8;max-width:570px;margin:0}
.project-grid .play-btn{width:58px;height:58px;opacity:0;transform:translate(-50%,-40%);left:50%;top:50%}
.project-grid .project-card:hover .play-btn,.project-grid .project-card:focus-visible .play-btn{opacity:1;transform:translate(-50%,-50%)}
.project-grid.is-index{display:block}
.project-grid.is-index .project-card{display:grid;width:100%;grid-template-columns:240px 1fr;align-items:center;gap:36px;margin:0;padding:25px 0;border-top:1px solid #ffffff26}
.project-grid.is-index .project-media{aspect-ratio:16/9}.project-grid.is-index .project-meta{padding:0}.project-grid.is-index .film-format{display:none}
.media-unavailable{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font:12px var(--font-mono);letter-spacing:.15em}
.lightbox-panel{border-radius:10px!important;overflow:hidden}.lightbox-backdrop{backdrop-filter:blur(18px)}
.film-error{padding:12px 24px;color:var(--text);font-size:14px;text-align:center}
.showcase-pagination button:focus-visible,.showcase-arrow:focus-visible,.archive-switch button:focus-visible{outline:2px solid var(--magenta);outline-offset:4px}
@media(hover:none){.project-grid .play-btn{opacity:1;transform:translate(-50%,-50%)}}
@media(max-width:760px){.work-section{padding-block:60px}.work-section .video-card{flex-basis:92%}.work-section .video-grid{gap:14px}.work-section .video-meta{grid-template-columns:1fr;gap:10px}.work-section .play-btn{width:54px;height:54px}.showcase-status{display:none}.project-grid{gap:38px 18px}.project-grid .project-card:nth-child(n){grid-column:1/-1;margin-top:0}.film-number{top:15px;left:15px}.film-format{top:12px;right:12px;font-size:9px}.project-grid.is-index .project-card{grid-template-columns:100px 1fr;gap:18px}.project-grid.is-index .project-desc,.project-grid.is-index .film-number,.project-grid.is-index .play-btn{display:none}.project-grid.is-index .project-title{font-size:1.1rem;margin:0}.archive-toolbar{font-size:9px}.archive-switch button{padding:8px 12px}.work-section .video-desc{font-size:12px}}
@media(prefers-reduced-motion:reduce){.work-section *,.project-grid *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.work-section .video-title,.project-grid .project-title,body:has(.project-grid) .page-hero h1{text-transform:none}

.work-section .video-art{position:relative;z-index:1}
.project-grid .project-media{aspect-ratio:16/9}
.film-number,.film-format,.showcase-status,.archive-toolbar,.showcase-pagination button,.archive-switch button{font-family:var(--font-ui);font-weight:600;letter-spacing:.045em;}

/* Only the homepage work showcase spans the viewport; other containers are unchanged. */
.work-section > .container { width:100%;max-width:none;padding-inline:min(var(--showcase-gutter,16px),8vw); }
/* Reduce the gap between the hero and Our Best Work */
.hero {
  min-height: 0;
  padding-bottom: 16px;
}

.hero + .work-section {
  padding-top: 20px;
}
