/* ============================================================
   Base layout & typography — replicates the original site's
   rendered appearance (Avada theme options → clean CSS).
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  /* clip instead of hidden where supported: hidden creates a scroll
     container that would break the sticky parallax hero */
  overflow-x: hidden;
  overflow-x: clip;
  font-family: var(--font-body);
  font-size: var(--body-size);
  font-weight: var(--body-weight);
  line-height: var(--body-lh);
  color: var(--body-color);
  background: var(--white);
  -webkit-hyphens: auto;
  hyphens: auto;
}

/* sticky footer: main grows, footer stays at the bottom on short pages */
main.site-main { flex: 1 0 auto; }
.site-footer { flex-shrink: 0; margin-top: auto; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--heading-color);
  line-height: var(--heading-lh);
  margin: 0 0 0.6em;
  font-weight: 700;
}
h1 { font-size: var(--h1-size); }
h2 { font-size: var(--h2-size); }
h3 { font-size: var(--h3-size); font-weight: 900; }
h4 { font-size: var(--h4-size); }
h5 { font-size: var(--h5-size); }
h6 { font-size: var(--h6-size); }

p { margin: 0 0 1.1em; }

a {
  color: var(--link-color);
  text-decoration: none;
  transition: color .2s ease;
}
a:hover { color: var(--link-hover); }

img { max-width: 100%; height: auto; }

hr { border: 0; border-top: 1px solid var(--grey-line); margin: 2em 0; }

ul, ol { margin: 0 0 1.1em; padding-left: 1.4em; }

table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 1.5em;
}
th, td {
  border: 1px solid var(--grey-line);
  padding: .5em .8em;
  text-align: left;
  vertical-align: top;
}

/* content pages style quotes gold, larger and centered; the homepage recolors it */
blockquote {
  border: 0;
  margin: 1.5em 0;
  padding: 0;
  font-style: italic;
  text-align: center;
  color: var(--gold);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.4;
}

/* ---- Layout containers ---- */
.container {
  max-width: var(--site-width);
  margin: 0 auto;
  padding: 0 30px;
}

main.site-main { min-height: 50vh; }

.page-content { padding: 60px 0 80px; }

/* Fusion-builder column remnants → clean flex grid */
.frow {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin: 0 auto;
  max-width: var(--site-width);
}
.fcol { flex: 1 1 100%; min-width: 0; }
.fcol-1-1 { flex-basis: 100%; }
.fcol-1-2 { flex-basis: calc(50% - 20px); }
.fcol-1-3 { flex-basis: calc(33.333% - 27px); }
.fcol-2-3 { flex-basis: calc(66.666% - 14px); }
.fcol-1-4 { flex-basis: calc(25% - 30px); }
.fcol-3-4 { flex-basis: calc(75% - 10px); }
.fcol-1-5 { flex-basis: calc(20% - 32px); }
.fcol-2-5 { flex-basis: calc(40% - 24px); }
.fcol-3-5 { flex-basis: calc(60% - 16px); }
.fcol-4-5 { flex-basis: calc(80% - 8px); }
.fcol-1-6 { flex-basis: calc(16.666% - 34px); }
.fcol-5-6 { flex-basis: calc(83.333% - 7px); }
@media (max-width: 800px) {
  .fcol-1-2, .fcol-1-3, .fcol-2-3, .fcol-1-4, .fcol-3-4,
  .fcol-1-5, .fcol-2-5, .fcol-3-5, .fcol-4-5, .fcol-1-6, .fcol-5-6 {
    flex-basis: 100%;
  }
}

/* full-width sections: background bleeds edge-to-edge, inner rows stay
   centered; default vertical rhythm 50/25 like the original (a section's
   own padding_top/bottom values override via inline style) */
section.section {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 50px calc(50vw - 50%) 25px;
  background-size: cover;
  background-position: center;
}
.sep { height: 24px; }
.bg-beige { background-color: var(--beige); }

/* a beige band that ends the page runs flush into the footer instead of
   leaving the page-content bottom padding as a white strip
   (home and Programm manage their own bottom spacing) */
.page-content:not(.home-content):not(.events-page) > .container > .section.bg-beige:last-child {
  margin-bottom: -80px;
  padding-bottom: 50px;
}

/* the original renders content h4 headings oversized (widget titles excluded) */
.section .fcol h4:not(.event-widget-title):not(.news-widget-title) {
  font-size: 33px;
  font-weight: 800;
}
/* ...except on the Tsa Lung pages, where the live site sizes them 25px/700
   and constrains the booklet covers to 400px (montage 600px) */
.page-tsa-lung-tibetisches-yoga .section .fcol h4:not(.event-widget-title):not(.news-widget-title),
.page-tsa-lung-tibetan-yoga .section .fcol h4:not(.event-widget-title):not(.news-widget-title) {
  font-size: 25px;
  font-weight: 700;
}
.page-tsa-lung-tibetisches-yoga .fcol-1-2 img,
.page-tsa-lung-tibetan-yoga .fcol-1-2 img { width: 400px; max-width: 100%; }
.page-tsa-lung-tibetisches-yoga .fcol-1-1 img,
.page-tsa-lung-tibetan-yoga .fcol-1-1 img { width: 600px; max-width: 100%; }

/* per-column text alignment (mirrors the original page layouts) */
.fcol.align-center { text-align: center; }
.fcol.align-justify { text-align: justify; }
.fcol.align-center ul, .fcol.align-center ol {
  list-style-position: inside;
  padding-left: 0;
}

/* sections on dark/colored backgrounds use white text */
.section-light,
.section-light h1, .section-light h2, .section-light h3,
.section-light h4, .section-light h5, .section-light h6 { color: var(--white); }

/* links inside page content: gold + underline like the original */
.fcol a:not(.btn),
.order-intro a,
.event-single-content a,
.item-body a {
  color: var(--gold);
  font-weight: 500;
  text-decoration: underline;
}
.fcol a:not(.btn):hover,
.order-intro a:hover,
.event-single-content a:hover,
.item-body a:hover { color: var(--red); }
.section-gallery a, .fcol a:has(> img) { text-decoration: none; }

/* structured-section image galleries */
.section-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin: 10px 0 20px;
}
@media (max-width: 900px) { .section-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .section-gallery { grid-template-columns: 1fr; } }
.section-gallery-item img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
  border-radius: 10px;
  transition: transform .25s ease, opacity .25s ease;
}
.section-gallery-item a:hover img { transform: scale(1.02); opacity: .92; }

/* ---- Buttons (original: uppercase dark-red pill, white text) ---- */
.btn, button.btn, input[type=submit] {
  display: inline-block;
  background: var(--btn-bg);
  color: var(--btn-color);
  font-family: var(--font-body);
  font-size: var(--btn-font-size);
  font-weight: 400;
  letter-spacing: .5px;
  line-height: 17px;
  text-transform: uppercase;
  text-decoration: none;
  padding: 13px 29px;
  border: 0;
  border-radius: 25px;
  cursor: pointer;
  transition: background .2s ease;
}
.btn:hover, input[type=submit]:hover { background: var(--btn-bg-hover); color: var(--btn-color); }

/* ---- Utility ---- */
.text-center { text-align: center; }
.title-heading-center { text-align: center; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---- Lightbox overlay (used by the global lightbox.js on any
   content image link: galleries, shop products, event images) ---- */
.lb-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, .88);
  display: flex;
  align-items: center;
  justify-content: center;
}
.lb-overlay img {
  max-width: 92vw;
  max-height: 88vh;
  border-radius: 6px;
  box-shadow: 0 8px 40px rgba(0,0,0,.5);
}
.lb-btn {
  position: absolute;
  background: none;
  border: 0;
  color: #fff;
  font-size: 42px;
  line-height: 1;
  cursor: pointer;
  padding: 16px;
  opacity: .8;
}
.lb-btn:hover { opacity: 1; }
.lb-close { top: 12px; right: 18px; }
.lb-prev { left: 10px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 10px; top: 50%; transform: translateY(-50%); }