/* S2 Spa — Flatsome adapter, loaded BEFORE the reference CSS (s2-home/s2-pages/s2-shop) and written with
   low specificity (:where), so it beats flatsome.css on ties while every rule of the reference still wins.
   UX Builder wrappers: section > .section-content > .row (= the reference's .container + grid) > .col > .col-inner. */

#content > .section { align-items: stretch; }
:where(#content > .section) > .section-bg { display: none; }
:where(#content > .section) > .section-content { width: 100%; }

/* Rows directly in a section = the reference's .container (90rem, gutter) */
:where(.s2-site .section > .section-content) > .row {
  max-width: var(--container-max);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--bed-gutter);
  padding-right: var(--bed-gutter);
}
:where(.s2-site .section) .row::before,
:where(.s2-site .section) .row::after { display: none; content: none; }

/* Columns: no Flatsome gutters; the reference's grid/flex decides */
:where(.s2-site .section-content > .row) > .col {
  padding: 0;
  max-width: none;
  flex-basis: auto;
}
:where(.s2-site .section-content > .row:not(.s2-flex):not([class*="__grid"])) > .col {
  width: 100%;
  flex: 0 0 100%;
}
:where(.s2-site .section-content > .row.s2-flex) > .col { width: auto; flex: 0 1 auto; }

/* Images */
:where(.s2-site .section) .img { margin: 0; }
:where(.s2-site .section) .img .img-inner > img { width: 100%; }

/* Lists inside text */
:where(.s2-site .section) .col-inner :is(ul, ol) li { margin-left: 0; }
:where(.s2-site .section) .col-inner :is(ul, ol) { margin-left: 0; padding-left: 0; }

/* Grid rows: cells size like the reference's divs (stretch, or shrink when the reference justifies them) */
:where(.s2-site .row[class*="__grid"]) > .col { width: auto; }