/* Alu-Pro — dedicated gallery page. Inherits the existing website's palette/type. */
.navlinks a.current { color: var(--red); }
.gallery-hero { padding: 0; background: #171d1f; color: #fff; overflow: hidden; }
.gallery-hero-inner { min-height: 425px; display: grid; grid-template-columns: 1fr .72fr; gap: 80px; align-items: center; }
.gallery-hero-copy { padding: 65px 0; }
.gallery-hero .eyebrow { color: #efa0aa; }
.gallery-hero h1 { font: 800 clamp(43px, 5vw, 70px)/1.1 Manrope,sans-serif; letter-spacing: -.065em; margin: 25px 0 20px; }
.gallery-hero h1 span { color: #ff5869; }
.gallery-hero p { color: #bfc7c7; font-size: 14px; line-height: 1.9; max-width: 510px; }
.gallery-hero-stats { display: flex; align-items: center; gap: 26px; margin-top: 30px; font-size: 12px; color: #c9d1d1; }
.gallery-hero-stats strong { font: 800 19px Manrope,sans-serif; color: #fff; margin-right: 5px; }
.stat-rule { height: 25px; width: 1px; background: #51595c; }
.gallery-hero-art { height: 345px; position: relative; isolation: isolate; overflow: hidden; }
.gallery-hero-art:before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg,#303b3e,#151d20); transform: skewX(-10deg) translateX(45px); }
.frame { position: absolute; top: 29px; bottom: 42px; border: 8px solid #9aabad; box-shadow: 12px 15px 30px #0005, inset 0 0 0 5px #333f42; z-index: 1; }
.frame-one { left: 8%; width: 30%; transform: skewY(-5deg); }
.frame-two { left: 38%; width: 30%; border-color: #798c90; transform: skewY(5deg); }
.frame-three { left: 68%; width: 27%; border-color: #aab7b9; transform: skewY(-4deg); }
.frame:before { content: ''; position: absolute; inset: 6px; background: linear-gradient(125deg,#71858977,#efffff33 47%,#71858933); border: 1px solid #fff4; }
.hero-art-label { position: absolute; left: 5px; bottom: 22px; z-index: 2; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.hero-art-label span { color: #f56573; font-size: 20px; margin-left: 12px; }
.gallery-content { background: #faf9f6; min-height: 570px; padding: 84px 0 115px; }
.collection-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.collection-top h2 { font: 800 clamp(32px,3.6vw,48px)/1.15 Manrope,sans-serif; margin: 15px 0 14px; letter-spacing: -.065em; }
.collection-top p { font-size: 13px; line-height: 1.8; color: #728081; margin: 0; }
.back-link { color: #697779; font-size: 12px; font-weight: 800; padding-bottom: 8px; white-space: nowrap; }
.back-link:hover { color: var(--red); }
.folder-filters { display: flex; flex-wrap: wrap; gap: 10px; margin: 38px 0 39px; }
.filter-chip { border: 1px solid #e0e1dc; background: #fff; color: #415054; border-radius: 5px; padding: 12px 18px; font-size: 12px; font-weight: 800; transition: background .2s,color .2s; }
.filter-chip span { margin-left: 8px; color: #a2a9aa; font-size: 10px; }
.filter-chip:hover { border-color: #d1a0a4; }
.filter-chip.active { background: #20292b; border-color: #20292b; color: white; }
.filter-chip.active span { color: #bec5c6; }
.photo-count { font-size: 11px; font-weight: 800; color: #7f8b8d; margin-bottom: 17px; text-transform: uppercase; letter-spacing: .08em; }
.portfolio-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.portfolio-item { display: block; position: relative; min-height: 286px; aspect-ratio: 1.11; background: #dfe4e3; overflow: hidden; border-radius: 7px; }
.portfolio-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.portfolio-item:hover img { transform: scale(1.055); }
.portfolio-overlay { position: absolute; inset: 0; background: linear-gradient(180deg,transparent 35%,rgba(5,14,18,.73)); display: flex; align-items: flex-end; justify-content: space-between; padding: 23px; gap: 15px; color: #fff; }
.portfolio-label small { display: block; color: #ffabb4; font-size: 10px; margin-bottom: 8px; font-weight: 700; }
.portfolio-label strong { font: 800 16px Manrope,sans-serif; }
.zoom-icon { display: grid; flex-shrink: 0; place-items: center; width: 35px; height: 35px; border: 1px solid #ffffffa0; border-radius: 50%; font-size: 19px; }
.gallery-empty { text-align: center; background: #fff; padding: 58px 30px 75px; border: 1px solid #ededeb; border-radius: 8px; }
.gallery-empty h3 { font: 800 clamp(25px,3vw,39px)/1.2 Manrope,sans-serif; letter-spacing: -.055em; margin: 15px auto; }
.gallery-empty p { font-size: 13px; color: #778587; line-height: 1.85; max-width: 430px; margin: 0 auto 26px; }
.empty-graphic { width: 138px; height: 119px; margin: 0 auto 24px; position: relative; background: #e4e9e7; border: 6px solid #5d7376; box-shadow: 11px 12px 0 #cbd5d4; }
.empty-glass { position: absolute; inset: 7px 45% 7px 6px; background: linear-gradient(150deg,#fff9,#6c91934a); }
.empty-cross { position: absolute; right: -22px; bottom: -18px; background: var(--red); color: white; border-radius: 50%; width: 44px; height: 44px; font: 500 26px sans-serif; display: grid; place-items: center; }
.gallery-cta { padding: 62px 0; background: #1b2224; color: #fff; }
.gallery-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.gallery-cta .eyebrow { color: #e995a0; }
.gallery-cta h2 { font: 800 clamp(28px,3vw,41px)/1.18 Manrope,sans-serif; margin: 12px 0 0; letter-spacing: -.055em; }
.gallery-lightbox { padding: 50px 18px 22px; color: #fff; background: #121a1ceb; border: 0; border-radius: 8px; box-shadow: 0 15px 80px #000b; max-width: min(95vw,1100px); max-height: 94vh; overflow: visible; }
.gallery-lightbox::backdrop { background: #081013e8; }
.gallery-lightbox img { display: block; max-width: min(90vw,1050px); max-height: 70vh; object-fit: contain; border-radius: 4px; }
.lightbox-close { position: absolute; right: 0; top: 0; color: white; border: 0; font-size: 30px; background: transparent; width: 45px; height: 45px; }
.lightbox-caption { padding: 13px 2px 0; display: flex; flex-direction: column; gap: 5px; }
.lightbox-caption span { color: #f1929e; font-size: 10px; font-weight: 700; }
.lightbox-caption strong { font-size: 14px; }
@media(max-width:850px) { .gallery-hero-inner { grid-template-columns: 1fr .4fr; gap: 20px; } .portfolio-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .gallery-hero-inner { grid-template-columns: 1fr; } .gallery-hero-copy { padding: 65px 0 47px; } .gallery-hero-art { display: none; } .gallery-content { padding: 62px 0 85px; } }
@media(max-width:540px) { .collection-top { display: block; } .back-link { display: inline-block; margin-top: 20px; } .folder-filters { margin: 28px 0; } .filter-chip { padding: 10px 12px; } .portfolio-grid { grid-template-columns: 1fr; } .portfolio-item { aspect-ratio: 1.22; min-height: 240px; } .gallery-cta-inner { align-items: flex-start; flex-direction: column; } .gallery-hero-stats { gap: 15px; font-size: 10px; } }