/* FLEXORA e-invite · free blocks.
   One stylesheet for every design. A block takes its look from the --fxb-* roles each design's design.json
   maps to its own variables, so it reads as part of that design. Visible without JavaScript; no motion. */

.fxb {
  box-sizing: border-box;
  display: block;
  margin: 0;
  padding: clamp(2.2rem, 8vw, 3.6rem) var(--gutter, 1.25rem);
  background: var(--fxb-bg, #fbf5ea);
  color: var(--fxb-text, #2b2b2b);
  font-family: var(--fxb-body, Georgia, serif);
  font-size: 1.06rem;
  line-height: 1.65;
  text-align: center;
  position: relative;
  overflow-wrap: anywhere;
}
.fxb *, .fxb *::before, .fxb *::after { box-sizing: border-box; }
.fxb__inner { max-width: 34rem; margin: 0 auto; }

.fxb__title {
  margin: 0 0 1.1rem;
  font-family: var(--fxb-heading, Georgia, serif);
  font-weight: 500;
  font-size: clamp(1.55rem, 6.4vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: var(--fxb-accent, currentColor);
}
.fxb__title::after {
  content: "";
  display: block;
  width: 3.2rem;
  height: 1px;
  margin: 0.9rem auto 0;
  background: var(--fxb-ornament, currentColor);
}

.fxb__body p { margin: 0 0 0.9rem; }
.fxb__body p:last-child { margin-bottom: 0; }
.fxb__body ul { margin: 0 0 0.9rem; padding: 0; list-style: none; }
.fxb__body li { margin: 0.35rem 0; }
.fxb__body li::before { content: "\2726"; color: var(--fxb-accent, currentColor); margin-right: 0.55em; font-size: 0.75em; vertical-align: 0.1em; }
.fxb__body a { color: var(--fxb-accent, inherit); text-decoration: underline; text-underline-offset: 0.18em; }
.fxb__body strong { font-weight: 700; }

/* Note: a callout set in a frame */
.fxb--note .fxb__inner {
  padding: 1.5rem 1.25rem;
  border: 1px solid var(--fxb-ornament, currentColor);
  outline: 1px solid var(--fxb-ornament, currentColor);
  outline-offset: 5px;
  border-radius: 2px;
}
.fxb--note .fxb__title { font-size: 1.3rem; margin-bottom: 0.7rem; }
.fxb--note .fxb__title::after { display: none; }

/* Map */
.fxb__venue { font-family: var(--fxb-heading, inherit); font-size: 1.35rem; color: var(--fxb-accent, inherit); margin: 0 0 0.35rem; }
.fxb__address { margin: 0 0 1rem; }
.fxb__howto { margin: 0 0 1rem; font-size: 0.98rem; opacity: 0.92; }

/* Buttons: links that look like buttons (map, WhatsApp, call, email) */
.fxb__actions { display: flex; flex-wrap: wrap; gap: 0.7rem; justify-content: center; margin: 1.1rem 0 0; }
.fxb__btn {
  display: inline-block;
  min-height: 2.75rem;
  padding: 0.7rem 1.4rem;
  border: 1px solid var(--fxb-accent, currentColor);
  border-radius: 999px;
  background: var(--fxb-accent, #333);
  color: var(--fxb-onAccent, #fff) !important;
  font-family: var(--fxb-body, inherit);
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none !important;
  line-height: 1.3;
}
.fxb__btn:hover { filter: brightness(1.08); }
.fxb a:focus-visible, .fxb__btn:focus-visible { outline: 3px solid var(--fxb-accent, currentColor); outline-offset: 3px; }
.fxb__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Gallery */
.fxb--gallery .fxb__inner { max-width: 44rem; }
.fxb__gallery { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.fxb__gallery--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fxb__gallery--column { grid-template-columns: minmax(0, 1fr); }
.fxb__gallery figure { margin: 0; }
.fxb__gallery img { display: block; width: 100%; height: auto; border: 1px solid var(--fxb-ornament, transparent); background: rgba(0,0,0,0.04); }
.fxb__gallery--grid img { aspect-ratio: 4 / 5; object-fit: cover; }
.fxb__gallery figcaption { margin-top: 0.4rem; font-size: 0.9rem; font-style: italic; opacity: 0.9; }
@media (min-width: 640px) {
  .fxb__gallery--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}