/* Dedicated cafe photo gallery */

.inside-intro {
  background:#f5e8d8;
  text-align:center;
  padding:85px 24px 45px;
}
.inside-eyebrow {
  color:#a64933;
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
}
.inside-intro h1 {
  font:500 clamp(58px,9vw,125px)/1 Georgia,serif;
  letter-spacing:-.045em;
  margin:25px 0;
}
.inside-intro h1 em {
  color:#ad4e37;
}
.inside-intro p {
  max-width:550px;
  margin:0 auto;
  font-size:17px;
  line-height:1.7;
}
.inside-gallery-section {
  background:#f5e8d8;
  padding:35px 5vw 100px;
}
.inside-gallery-grid {
  max-width:1380px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:30px 24px;
}
.inside-photo {
  margin:0;
  min-width:0;
}
.inside-photo-wide {grid-column:span 4}
.inside-photo-tall {grid-column:span 2}
.inside-photo-square {grid-column:span 3}

.inside-photo-button {
  display:block;
  position:relative;
  width:100%;
  padding:0;
  border:0;
  background:#74503f;
  border-radius:6px;
  overflow:hidden;
  cursor:zoom-in;
}
.inside-photo-wide .inside-photo-button {aspect-ratio:1.7}
.inside-photo-tall .inside-photo-button {aspect-ratio:.72}
.inside-photo-square .inside-photo-button {aspect-ratio:1.12}

.inside-photo-button img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.inside-photo-button:hover img {transform:scale(1.035)}

.inside-photo-overlay {
  position:absolute;
  right:14px;
  bottom:14px;
  background:#271b16dd;
  color:#fff2e2;
  padding:10px 14px;
  border-radius:25px;
  font-size:11px;
  font-weight:800;
}
.inside-photo figcaption {
  display:flex;
  gap:14px;
  padding:16px 0;
}
.inside-photo-number {color:#ac5a40;font-weight:800}
.inside-photo h2 {
  font:500 27px/1.2 Georgia,serif;
  margin:0 0 7px;
}
.inside-photo figcaption p {
  color:#725747;
  font-size:14px;
  line-height:1.5;
  margin:0;
}
.inside-closing {
  background:#ead1b3;
  text-align:center;
  padding:85px 24px;
}
.inside-closing h2 {
  font:500 clamp(45px,6vw,85px)/1.1 Georgia,serif;
}
.inside-closing h2 em {color:#ad4e37}
.inside-closing a {
  display:inline-block;
  color:#883d2f;
  font-weight:800;
  border-bottom:1px solid;
  padding-bottom:8px;
}

.inside-lightbox[hidden] {display:none!important}
.inside-lightbox {
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  flex-direction:column;
  background:#19120ff7;
  color:#fff0dc;
  padding:16px;
}
.inside-lightbox-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.inside-lightbox-stage {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex:1;
  min-height:0;
}
.inside-lightbox-stage img {
  display:block;
  max-width:calc(100% - 112px);
  max-height:100%;
  object-fit:contain;
}
.inside-lightbox button {
  width:44px;
  height:44px;
  flex-shrink:0;
  border:1px solid #89766a;
  border-radius:50%;
  color:#fff0dc;
  background:transparent;
  cursor:pointer;
}
.inside-lightbox-caption {
  text-align:center;
  padding:15px;
}
.inside-lightbox-caption h2 {margin:0 0 8px}
.inside-lightbox-caption p {margin:0}
.inside-lightbox button:focus-visible,
.inside-photo-button:focus-visible {
  outline:3px solid #e2b274;
  outline-offset:4px;
}
body.inside-lightbox-open {overflow:hidden}

@media(max-width:760px) {
  .inside-intro {padding:60px 20px 35px}
  .inside-gallery-section {padding:20px 16px 65px}
  .inside-gallery-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:25px 12px;
  }
  .inside-photo-wide {grid-column:span 2}
  .inside-photo-tall,.inside-photo-square {grid-column:span 1}
  .inside-photo-tall .inside-photo-button,
  .inside-photo-square .inside-photo-button {aspect-ratio:.8}
  .inside-photo h2 {font-size:19px}
  .inside-photo-overlay {font-size:9px;padding:7px}
  .inside-lightbox-stage img {max-width:calc(100% - 96px)}
  .inside-lightbox button {width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce) {
  .inside-photo-button img {transition:none}
}