/* AllDeez Project Gallery — the dark copper blueprint presentation board */
.gallery-page{background:#0e0c0a;color:#f4ece2}
.gallery-page .shell{background:#0e0c0a;min-height:100vh}
.gallery-page main{background:#0e0c0a}
.gallery-page .sidebar{
  background:
    linear-gradient(180deg,rgba(24,16,10,.93),rgba(19,12,8,.96)),
    url('assets/gallery-architectural-backdrop.svg') 60% 103%/830px auto no-repeat,
    #21140e;
  border-right:1px solid rgba(181,121,68,.55);
}
.gallery-page .sidebar-note{color:#e8b976}
.gallery-page .sidebar-note span{color:#bd9d7c!important}
.gallery-page .sidebar-admin{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:-15px 18px 24px;padding:11px 12px;
  border:1px solid rgba(215,154,100,.35);color:#d9b98f;text-decoration:none;
  font:600 11px "Barlow Condensed",sans-serif;letter-spacing:1.7px;text-transform:uppercase;
  background:rgba(255,255,255,.025)
}
.gallery-page .sidebar-admin:hover{background:rgba(176,112,65,.14);color:#fff}

.gallery-hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:205px;padding:37px clamp(18px,3vw,48px) 20px;
  display:flex;align-items:center;
  border-bottom:1px solid rgba(179,117,63,.42);
  background:linear-gradient(107deg,#14100d 0%,#17110d 42%,#211710 100%);
}
.gallery-hero::before{
  content:"";position:absolute;z-index:-1;inset:0;
  background:
    linear-gradient(90deg,#14100d 0%,rgba(20,16,13,.95) 31%,rgba(20,15,12,.38) 67%,rgba(19,14,11,.12) 100%),
    url('assets/gallery-architectural-backdrop.svg') right center/auto 160% no-repeat;
  opacity:.95;pointer-events:none
}
.gallery-hero::after{
  content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg,transparent 0,transparent 53px,rgba(181,117,66,.045) 54px),
    linear-gradient(0deg,rgba(6,4,3,.28),transparent 40%)
}
.gallery-hero-copy{max-width:880px;position:relative;z-index:1}
.gallery-hero .eyebrow{
  font:600 12px "Barlow Condensed",sans-serif!important;letter-spacing:3.6px;
  color:#d4a069;display:flex;gap:18px;align-items:center;margin:0 0 8px
}
.gallery-hero .eyebrow::after{content:"";height:1px;background:#b37a47;width:155px;max-width:24vw}
.gallery-hero h1{
  color:#fff7ed;font:400 clamp(48px,5.2vw,78px)/1.03 "DM Serif Display",Georgia,serif;
  letter-spacing:-1.5px;margin:0 0 8px;text-shadow:0 5px 20px rgba(0,0,0,.35)
}
.gallery-hero h1 em{
  font-style:normal;color:#d9a263;
  background:linear-gradient(130deg,#e6be83,#b87b3f 66%,#f0ca92);
  background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent
}
.gallery-hero-copy>p:not(.eyebrow){font:400 13px/1.55 Inter,Arial,sans-serif;color:#e1d5c8;max-width:760px;margin:0}

.gallery-wall{
  background:
    linear-gradient(rgba(14,11,9,.90),rgba(14,11,9,.96)),
    url('assets/dale-blueprint-overlay.svg') center top/1050px auto repeat-y,
    #130f0b;
  padding:12px clamp(10px,1.1vw,18px) 20px;
  min-height:240px;
}
.gallery-mosaic{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:clamp(145px,14.1vw,235px);
  gap:8px;grid-auto-flow:row dense;
  margin:0 0 15px;
}
.gallery-mosaic:last-child{margin-bottom:0}
.gallery-tile{
  display:block;width:100%;min-width:0;height:100%;position:relative;
  overflow:hidden;cursor:zoom-in;
  padding:0;border:1px solid rgba(195,137,83,.72);
  background:#201a14;box-shadow:0 0 0 1px rgba(0,0,0,.36);
  appearance:none;text-align:left;
}
.gallery-tile:focus-visible{outline:3px solid #e1b77d;outline-offset:2px;z-index:2}
.gallery-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease,filter .45s ease}
.gallery-tile:hover img{transform:scale(1.027);filter:saturate(1.06)}
.gallery-tile::after{
  content:"+";position:absolute;left:14px;bottom:13px;
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  border:1.6px solid #fff5df;
  background:rgba(20,16,13,.60);
  color:#fff;font:400 26px/1 Inter,Arial,sans-serif;
  transition:background .2s,transform .2s;
  box-shadow:0 2px 10px rgba(0,0,0,.28)
}
.gallery-tile:hover::after{background:rgba(170,106,53,.88);transform:scale(1.06)}
.gallery-caption{
  position:absolute;top:0;left:0;right:0;
  padding:20px 12px 12px;
  opacity:0;transform:translateY(-5px);
  color:#fff6eb;background:linear-gradient(rgba(0,0,0,.63),transparent);
  font:600 12px "Barlow Condensed",sans-serif;letter-spacing:1.6px;text-transform:uppercase;
  transition:opacity .22s ease,transform .22s ease;
  pointer-events:none
}
.gallery-tile:hover .gallery-caption,.gallery-tile:focus-visible .gallery-caption{opacity:1;transform:none}
.gallery-tile-feature{grid-column:span 2;grid-row:span 2}
.gallery-tile-feature::after{width:40px;height:40px;font-size:29px}
.gallery-mosaic.count-1{grid-template-columns:1fr;grid-auto-rows:clamp(320px,42vw,650px)}
.gallery-mosaic.count-1 .gallery-tile-feature{grid-column:1;grid-row:1}
.gallery-mosaic.count-2{grid-template-columns:2fr 1fr;grid-auto-rows:clamp(260px,35vw,580px)}
.gallery-mosaic.count-2 .gallery-tile-feature{grid-column:1;grid-row:1}
.gallery-mosaic.count-3 .gallery-tile:not(.gallery-tile-feature){grid-column:span 2}
.gallery-mosaic.count-4 .gallery-tile:nth-child(4){grid-column:span 2}

.gallery-page footer{background:#120e0b!important;color:#d5bca3!important;border-top:1px solid rgba(181,119,70,.3)}
.footer-admin-link{color:#c9a379;text-decoration:none}
.footer-admin-link:hover{text-decoration:underline}

/* Full screen, image-focused viewer */
.gallery-lightbox{
 position:fixed;inset:0;z-index:9999;
 display:none;align-items:center;justify-content:center;
 padding:44px 74px 25px;
 background:rgba(6,6,6,.96);
 opacity:0;transition:opacity .22s ease
}
.gallery-lightbox.open{display:flex;opacity:1}
.gallery-lightbox figure{
 margin:0;max-width:min(1500px,90vw);max-height:92vh;
 display:flex;flex-direction:column;align-items:center;gap:9px
}
.gallery-lightbox img{
 max-width:100%;max-height:84vh;object-fit:contain;
 box-shadow:0 18px 70px rgba(0,0,0,.54);
 animation:galleryReveal .25s ease both
}
.gallery-lightbox figcaption{color:#d8c4a9;font:600 12px "Barlow Condensed",sans-serif;letter-spacing:1.5px;text-transform:uppercase}
.lightbox-close,.lightbox-nav{position:absolute;border:0;background:transparent;color:#fff;cursor:pointer;z-index:2}
.lightbox-close{right:24px;top:18px;font-size:40px;line-height:1}
.lightbox-nav{top:50%;transform:translateY(-50%);font-size:58px;padding:16px;color:#e1b77d}
.lightbox-nav.prev{left:10px}.lightbox-nav.next{right:10px}
.lightbox-close:hover,.lightbox-nav:hover{color:#fff4e1}
@keyframes galleryReveal{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}

@media(max-width:1080px){
 .gallery-hero{min-height:200px;padding:32px 4% 24px}
 .gallery-hero::before{background-size:auto 135%}
 .gallery-mosaic{grid-auto-rows:clamp(135px,18vw,220px)}
}
@media(max-width:780px){
 .gallery-hero{min-height:180px;padding:32px 5% 23px}
 .gallery-hero::before{opacity:.6;background-size:auto 120%}
 .gallery-hero h1{font-size:clamp(46px,8vw,64px)}
 .gallery-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(145px,27vw,215px)}
 .gallery-tile-feature{grid-column:span 2;grid-row:span 2}
 .gallery-mosaic.count-2{grid-template-columns:2fr 1fr;grid-auto-rows:clamp(235px,38vw,380px)}
 .gallery-mosaic.count-2 .gallery-tile-feature{grid-column:1;grid-row:1}
 .gallery-mosaic.count-3 .gallery-tile:not(.gallery-tile-feature){grid-column:span 1}
 .gallery-mosaic.count-4 .gallery-tile:nth-child(4){grid-column:span 1}
 .gallery-lightbox{padding:58px 44px 25px}
 .lightbox-nav{font-size:44px;padding:8px}
}
@media(max-width:520px){
 .gallery-hero{min-height:165px;padding:27px 5% 20px}
 .gallery-hero h1{font-size:44px}
 .gallery-hero-copy>p:not(.eyebrow){font-size:12px;line-height:1.5}
 .gallery-hero .eyebrow::after{width:90px}
 .gallery-wall{padding:8px}
 .gallery-mosaic{gap:6px;grid-auto-rows:clamp(125px,37vw,195px)}
 .gallery-mosaic.count-1{grid-auto-rows:300px}
 .gallery-mosaic.count-2{grid-template-columns:1fr;grid-auto-rows:220px}
 .gallery-mosaic.count-2 .gallery-tile-feature{grid-column:1;grid-row:1}
 .gallery-mosaic.count-3 .gallery-tile-feature{grid-column:span 2;grid-row:span 2}
 .gallery-mosaic.count-3 .gallery-tile:not(.gallery-tile-feature){grid-column:span 1}
 .gallery-tile::after{width:29px;height:29px;left:9px;bottom:9px;font-size:23px}
 .gallery-lightbox{padding:60px 30px 35px}
 .gallery-lightbox figure{max-width:100%}
 .lightbox-nav.prev{left:0}.lightbox-nav.next{right:0}
 .lightbox-nav{font-size:36px}
 .lightbox-close{right:13px;top:11px}
}
@media(prefers-reduced-motion:reduce){
 .gallery-tile img,.gallery-tile::after,.gallery-caption,.gallery-lightbox{transition:none}
 .gallery-lightbox img{animation:none}
}
