/* ============================================================
   base.css — standalone structural framework
   Replaces Funnelish core.min.css for exported static pages.
   All cosmetic styling (colors, fonts, borders, spacing) stays
   in the page's own inline <style> blocks; this file only
   provides the layout skeleton those rules assume.
   ============================================================ */

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; padding: 0; }
img { max-width: 100%; height: auto; border: 0; }
a { text-decoration: none; color: inherit; }
ul, ol { margin: 0.4em 0; padding-left: 1.4em; }

/* ---------- page skeleton ---------- */
.page-root { width: 100%; min-height: 100%; }
.page-wrap { display: block; width: 100%; }

/* section = full-width band; centers its row */
.section {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  position: relative;
}

/* band-row = centered content row (max-width set inline, usually 1170px) */
.band-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* col-item = column inside a row; width set via inline style attr */
.col-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* every element sits in an elw; children are flex columns
   so the page's `display:inherit` rules resolve to flex */
.elw {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  position: relative;
}
.elw > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
}

/* nested containers */
.boxw { display: flex; flex-direction: column; width: 100%; min-width: 0; }
.container { display: flex; width: 100%; min-width: 0; }
.colbox { display: flex; flex-direction: column; min-width: 0; }

/* text elements */
.paragraph-inner, .headline-inner, .custom-inner { width: 100%; min-width: 0; }
.headline-inner :is(h1, h2, h3, h4, h5, h6) { margin: 0; }
.paragraph-inner > p:first-child { margin-top: 0; }
.paragraph-inner > p:last-child { margin-bottom: 0; }

/* buttons */
.btn-container { display: flex; flex-direction: column; }
.btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.25;
}
.btn-title, .btn-subtitle { display: block; }

/* images */
.img { align-items: center; }
.img picture { display: flex; justify-content: center; max-width: 100%; }

/* misc */
.pointer { cursor: pointer; }
.spacer .inner-spacer { width: 100%; }
.jump-anchor { display: block; width: 0; height: 0; overflow: hidden; }

/* popups need Funnelish runtime; keep them hidden in static builds */
[data-overlay="true"] { display: none !important; }

/* ---------- sticky bar ---------- */
.sticky {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 2147483000;
}
.sticky[data-sticky_position="bottom"] { bottom: 0; }
.sticky[data-sticky_position="top"] { top: 0; }
.sticky-defer {
  opacity: 0;
  visibility: hidden;
  transform: translateY(101%);
  transition: opacity .35s ease, transform .35s ease, visibility .35s;
}
.sticky[data-sticky_position="top"].sticky-defer { transform: translateY(-101%); }
.sticky-defer.is-visible {
  opacity: 1;
  visibility: visible;
  transform: none;
}

/* ---------- responsive ---------- */
@media only screen and (max-width: 600px) {
  .col-item { width: 100% !important; }
  .band-row { padding-left: 12px; padding-right: 12px; }
}