/* ==========================================================================
   Presencial · Figma 1:185 (1180 × 1117)
   Intro centralizada · "Em Juazeiro do Norte" (foto 725 + card 423) · galeria.
   Mobile (aprovado): desktop empilhado; galeria arrastável com 1,2 foto e pontos.
   ========================================================================== */

.cn-presencial { padding-top: var(--presencial-pad-top); }

.cn-presencial__intro { max-width: var(--presencial-intro-w); margin-inline: auto; display: flex; flex-direction: column; align-items: center; gap: var(--space-24); text-align: center; }
.cn-presencial__intro .t-body-l { color: var(--text-body); }

/* ---------- Local (1:190) ---------- */
.cn-local { margin-top: var(--space-24); display: flex; flex-direction: column; align-items: flex-start; }
.cn-local__title { margin-top: var(--space-20); }
.cn-local__row {
  align-self: stretch; margin-top: var(--space-40);
  display: grid; grid-template-columns: minmax(0, var(--local-photo-w)) minmax(0, var(--local-card-w)); justify-content: space-between; gap: var(--space-32);
  min-height: var(--local-row-h);
}
.cn-local__photo { height: var(--local-row-h); overflow: hidden; border-radius: var(--radius-lg); background: var(--gray-300); } /* altura fixa: senão a foto impõe a proporção dela (984 × 738) */
.cn-local__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; }

.cn-local__card {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--space-20);
  padding: var(--space-32);
  border: 4px solid var(--lilac-225); border-radius: var(--radius-tile);
  background: var(--grad-address-card);
  font-style: normal;
}
.cn-local__pin {
  display: grid; place-items: center; width: 83px; height: 73px;
  border: 2px solid var(--white); border-radius: var(--radius-tile);
  background: var(--purple-680); color: var(--white);
  box-shadow: var(--glow-pin);
}
.cn-local__name { font: var(--fw-semibold) var(--fs-address)/1.26 var(--font-sans); color: var(--address-title); }
.cn-local__address { font: var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-sans); color: var(--text-body); }

/* ---------- Galeria (1:212) ---------- */
.cn-galeria { margin-top: var(--space-80); }
.cn-galeria__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-24); }
.cn-galeria__head .t-h3 { color: var(--purple-900); }
.cn-galeria__arrows { display: flex; gap: var(--space-8); }
.cn-galeria__track {
  position: relative; margin-top: var(--space-32);
  display: flex; gap: var(--space-20);
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none;
  outline-offset: 3px;
}
.cn-galeria__track::-webkit-scrollbar { display: none; }
.cn-galeria__track.is-dragging { scroll-snap-type: none; cursor: grabbing; user-select: none; }
@media (hover: hover) and (pointer: fine) { .cn-galeria__track { cursor: grab; } }
.cn-galeria__slide { flex: 0 0 var(--gallery-slide-w); height: var(--gallery-slide-h); scroll-snap-align: start; }
.cn-galeria__foto {
  position: relative; display: block; width: 100%; height: 100%; padding: 0; overflow: hidden;
  border-radius: var(--radius-card); background: var(--gray-300); cursor: zoom-in;
}
.cn-galeria__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); -webkit-user-drag: none; user-select: none; }
/* ícone de ampliar, aparece no hover/foco */
.cn-galeria__zoom {
  position: absolute; right: var(--space-12); bottom: var(--space-12); display: grid; place-items: center;
  width: 40px; height: 40px; border-radius: 50%; background: color-mix(in srgb, var(--purple-900) 70%, transparent); color: var(--white);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; transform: scale(.85); transition: opacity .3s, transform .3s var(--ease-out);
}
.cn-galeria__foto:focus-visible .cn-galeria__zoom { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) {
  .cn-galeria__foto:hover img { transform: scale(1.05); }
  .cn-galeria__foto:hover .cn-galeria__zoom { opacity: 1; transform: none; }
}
@media (hover: none) { .cn-galeria__zoom { opacity: 1; transform: none; width: 34px; height: 34px; } }
.cn-galeria__track.is-dragging .cn-galeria__foto { cursor: grabbing; }

/* ---------- Lightbox ---------- */
.cn-lightbox {
  width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  background: color-mix(in srgb, var(--purple-950) 72%, transparent); color: var(--white);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.cn-lightbox::backdrop { background: transparent; }
.cn-lightbox[open] { display: grid; place-items: center; animation: cn-lb-in .3s var(--ease-out); }
.cn-lightbox__figure { display: flex; flex-direction: column; align-items: center; gap: var(--space-14); margin: 0; padding: var(--space-64) var(--space-80); max-width: 100%; }
.cn-lightbox__img {
  display: block; max-width: min(1400px, 100%); max-height: calc(100dvh - 180px); width: auto; height: auto;
  border-radius: var(--radius-sm); box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
}
.cn-lightbox__img.is-trocando { animation: cn-lb-troca .35s var(--ease-out); }
.cn-lightbox__caption { display: flex; gap: var(--space-16); align-items: baseline; max-width: 900px; font: var(--fw-regular) var(--fs-body-s)/1.5 var(--font-sans); color: color-mix(in srgb, var(--white) 78%, transparent); text-align: center; }
.cn-lightbox__count { flex: none; font-variant-numeric: tabular-nums; color: var(--lilac-300); font-weight: var(--fw-semibold); }
.cn-lightbox__btn {
  position: fixed; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  background: color-mix(in srgb, var(--white) 12%, transparent); color: var(--white);
  transition: background-color var(--dur-base), transform var(--dur-base) var(--ease-out);
}
.cn-lightbox__btn:hover { background: color-mix(in srgb, var(--white) 22%, transparent); }
.cn-lightbox__btn:focus-visible { outline: 2px solid var(--lime-500); outline-offset: 3px; }
.cn-lightbox__close { top: var(--space-20); right: var(--space-20); }
.cn-lightbox__prev { left: var(--space-24); top: 50%; translate: 0 -50%; }
.cn-lightbox__next { right: var(--space-24); top: 50%; translate: 0 -50%; }
.cn-lightbox__prev:hover { transform: translateX(-3px); }
.cn-lightbox__next:hover { transform: translateX(3px); }
@keyframes cn-lb-in { from { opacity: 0; } }
@keyframes cn-lb-troca { from { opacity: 0; transform: scale(.97); } }
@media (prefers-reduced-motion: reduce) { .cn-lightbox[open], .cn-lightbox__img.is-trocando { animation: none; } }
@media (max-width: 767px) {
  .cn-lightbox__figure { padding: var(--space-64) var(--space-12) var(--space-96); }
  .cn-lightbox__img { max-height: calc(100dvh - 220px); }
  .cn-lightbox__caption { flex-direction: column; gap: var(--space-4); align-items: center; }
  .cn-lightbox__prev, .cn-lightbox__next { top: auto; bottom: var(--space-20); translate: none; width: 48px; height: 48px; }
  .cn-lightbox__prev { left: calc(50% - 60px); }
  .cn-lightbox__next { right: calc(50% - 60px); }
}

.cn-galeria__dots { justify-content: center; margin-top: var(--space-32); }
.cn-galeria.is-static .cn-galeria__arrows, .cn-galeria.is-static .cn-galeria__dots { visibility: hidden; }

/* ---------- Movimento ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* foto revelada por máscara da esquerda para a direita, com zoom-out (js/modules/presencial.js) */
  .js .cn-local__photo { transition: clip-path 1.2s var(--ease-out); }
  .js .cn-local__photo img { transition: transform 1.6s var(--ease-out); }
  .js .cn-local__photo:not(.is-in) { clip-path: inset(0 100% 0 0 round var(--radius-lg)); }
  .js .cn-local__photo:not(.is-in) img { transform: scale(1.12); }
  .cn-local__pin { animation: cn-pin-glow 3s ease-in-out infinite; }
}
@keyframes cn-pin-glow { 50% { box-shadow: inset 0 0 30px var(--lilac-500), 0 0 90px var(--lilac-500); } }

/* ---------- ≤1023: empilhado ---------- */
@media (max-width: 1023px) {
  .cn-local__row { grid-template-columns: minmax(0, 1fr); gap: var(--space-20); min-height: 0; }
  .cn-local__photo { height: auto; aspect-ratio: 4 / 3; }
}
@media (max-width: 767px) {
  .cn-presencial { padding-top: var(--space-64); }
  .cn-local { margin-top: var(--space-40); }
  .cn-local__row { margin-top: var(--space-24); }
  .cn-local__card { padding: var(--space-24); }
  .cn-local__name { font-size: var(--fs-card-title); }
  .cn-galeria { margin-top: var(--space-64); }
  .cn-galeria__arrows { display: none; }
  .cn-galeria__track { margin-top: var(--space-24); scroll-padding-inline: 0; }
  .cn-galeria__dots { margin-top: var(--space-24); }
}
