/* A photographic mosaic inspired by the user's Palmea reference. */
@media(min-width:1081px){
  #gallery{margin:0 12px 28px;padding:16px 0;border-radius:36px;background:#fff;color:var(--blue)}
  #gallery .gallery-heading{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:32px}
  #gallery .eyebrow{font-size:13px;letter-spacing:.12em;color:#5e6e74;margin-bottom:22px}
  #gallery h2{font-family:Geologica,Manrope,sans-serif;font-size:52px;font-weight:600;line-height:1.06;letter-spacing:-.05em;max-width:900px}
  #gallery .gallery-lead{font-size:16px;line-height:1.65;max-width:760px;margin-top:12px;color:#5e6e74}
  #gallery .gallery-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,320px);gap:0;width:min(1440px,calc(100% - 120px));margin:auto;padding:0;overflow:hidden;border-radius:24px;scroll-snap-type:none;background:#fff}
  #gallery .gallery-photo{width:100%;height:100%;min-width:0;flex:none;border-radius:0;background:#fff}
  #gallery .gallery-photo:nth-child(3) img{object-position:50% 50%}
  #gallery .gallery-photo:nth-child(6) img{object-position:57% 50%}
  #gallery .gallery-photo:nth-child(9) img{object-position:50% 57%}
  #gallery .gallery-photo:after{background:linear-gradient(0deg,#071d2bbd,transparent 42%)}
  #gallery .gallery-photo>span{left:20px;bottom:18px;font-size:16px;font-weight:600;max-width:calc(100% - 76px)}
  #gallery .gallery-photo>.image-zoom{left:auto;right:16px;bottom:14px;width:32px;height:32px;border:0;background:#ffffff1f;max-width:none}
  #gallery .gallery-photo img{transition:transform 650ms cubic-bezier(.2,.7,.2,1)}
  #gallery .gallery-photo:focus-visible{outline:3px solid var(--orange);outline-offset:-5px}
  #photo-dialog{width:min(1180px,calc(100% - 80px));padding:18px;border-radius:24px;background:var(--review-bg);color:var(--on-accent);overflow:visible}
  #photo-dialog .photo-viewer{margin:0}
  #photo-dialog #large-photo{height:min(70svh,760px);max-height:none;object-fit:contain;border-radius:14px}
  #photo-dialog figcaption{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px 10px 4px;font-size:17px;line-height:1.4}
  #photo-counter{color:#b2c1c2;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
  #photo-dialog .dialog-close{top:28px;right:28px;width:44px;height:44px;background:var(--on-accent);color:var(--blue);border:0}
  #photo-dialog .photo-nav{position:absolute;top:calc(50% - 42px);display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:50%;background:var(--blue);color:var(--on-accent);padding:0;transition:background 180ms ease}
  #photo-dialog .photo-prev{left:30px}
  #photo-dialog .photo-next{right:30px}
  #photo-dialog .photo-nav:hover{background:var(--blue-hover)}
  #photo-dialog button:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
}
@media(min-width:1081px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  #gallery .gallery-photo:hover img,#gallery .gallery-photo:focus-visible img{transform:scale(1.025)}
}
@media(prefers-reduced-motion:reduce){
  #gallery .gallery-photo img{transition:none}
  #gallery .gallery-photo:hover img{transform:none}
}
