/*
 * Components that mirror Hub's widgets (used by the converter and the patterns).
 * Icon shapes: Font Awesome Free (CC BY 4.0).
 */

:root {
  --swa-mask-dot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8C119.033 8 8 119.033 8 256s111.033 248 248 248 248-111.033 248-248S392.967 8 256 8zm80 248c0 44.112-35.888 80-80 80s-80-35.888-80-80 35.888-80 80-80 80 35.888 80 80z'/%3E%3C/svg%3E");
  --swa-mask-check-circle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'/%3E%3C/svg%3E");
  --swa-mask-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3E%3C/svg%3E");
  --swa-mask-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z'/%3E%3C/svg%3E");
  --swa-mask-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z'/%3E%3C/svg%3E");
  --swa-mask-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z'/%3E%3C/svg%3E");
}

/* ---------- Icon (swa/icon) ---------- */
.swa-icon {
  display: flex;
  line-height: 0;
}

.swa-icon.aligncenter {
  justify-content: center;
}

.swa-icon.alignright {
  justify-content: flex-end;
}

.swa-icon__num {
  font-size: var(--swa-icon-size);
  font-weight: 700;
  line-height: 1;
}
.swa-icon__num::before {
  content: attr(data-num);
}
/* An uploaded SVG icon with a colour set: paths that have no fill of their own take it (multi-colour files keep theirs). */
.swa-icon.has-text-color .swa-icon__svg--file {
  fill: currentColor;
}

.swa-icon__img {
  width: var(--swa-icon-size);
  height: auto;
}

/* ---------- Kicker: small label bar (Hub "divider + heading") ---------- */
.is-style-kicker {
  display: flex;
  align-items: center;
  gap: 24px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wp--preset--color--line);
  font-size: var(--wp--preset--font-size--size-12);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
}

.is-style-kicker::before {
  content: "";
  flex: 0 0 50px;
  border-top: 1px solid currentColor;
}

/* ---------- Lists with icons ---------- */
.wp-block-list[class*="is-style-icon-"] {
  padding-left: 0;
  list-style: none;
}

.wp-block-list[class*="is-style-icon-"] > li {
  position: relative;
  margin-bottom: 8px;
  padding-left: var(--swa-list-indent, 28px);
}

.wp-block-list[class*="is-style-icon-"] > li::before {
  content: "";
  position: absolute;
  top: 0.15em;
  top: calc(0.5lh - var(--swa-list-icon-size, 16px) / 2);
  left: 0;
  width: var(--swa-list-icon-size, 16px);
  height: var(--swa-list-icon-size, 16px);
  background: var(--swa-list-icon-color, currentColor);
  -webkit-mask: var(--swa-list-icon) center / contain no-repeat;
  mask: var(--swa-list-icon) center / contain no-repeat;
}

.is-style-icon-dot {
  --swa-list-icon: var(--swa-mask-dot);
}
.is-style-icon-check-circle {
  --swa-list-icon: var(--swa-mask-check-circle);
}
.is-style-icon-check {
  --swa-list-icon: var(--swa-mask-check);
}
.is-style-icon-chevron {
  --swa-list-icon: var(--swa-mask-chevron);
}

/* Icon colour for lists: add one of these classes next to the style. */
.swa-icon-brick {
  --swa-list-icon-color: var(--wp--preset--color--brick);
}
.swa-icon-blue {
  --swa-list-icon-color: var(--wp--preset--color--blue);
}
.swa-icon-navy {
  --swa-list-icon-color: var(--wp--preset--color--navy);
}
.swa-icon-contrast {
  --swa-list-icon-color: var(--wp--preset--color--contrast);
}
.swa-icon-base {
  --swa-list-icon-color: var(--wp--preset--color--base);
}
.swa-icon-slate {
  --swa-list-icon-color: var(--wp--preset--color--slate);
}

/* ---------- Icon boxes ---------- */
.is-style-icon-box {
  text-align: center;
}

.is-style-icon-box > .swa-icon {
  justify-content: center;
}

.is-style-icon-box-left {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 16px;
  align-items: start;
}

.is-style-icon-box-left > .swa-icon {
  grid-row: 1 / span 4;
}

.is-style-icon-box-left > :not(.swa-icon) {
  grid-column: 2;
  margin-top: 0;
}

.is-style-icon-card {
  height: 100%;
  padding: 30px;
  border: 1px solid var(--wp--preset--color--line);
  background: var(--wp--preset--color--base);
}

[class*="is-style-icon-box"] h1,
[class*="is-style-icon-box"] h2,
[class*="is-style-icon-box"] h3,
[class*="is-style-icon-box"] h4,
[class*="is-style-icon-box"] h5,
[class*="is-style-icon-box"] h6,
.is-style-icon-card h3,
.is-style-icon-card h4,
.is-style-icon-card h5 {
  margin-bottom: 0;
}

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link {
  padding: 16px 30px;
  border: 1px solid currentColor;
  background: transparent;
  color: var(--wp--preset--color--contrast);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}

.wp-block-button.is-style-arrow > .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  background: none;
  color: inherit;
  font-weight: 600;
}

.wp-block-button.is-style-arrow > .wp-block-button__link::after {
  content: "";
  width: 12px;
  height: 12px;
  background: currentColor;
  -webkit-mask: var(--swa-mask-arrow) center / contain no-repeat;
  mask: var(--swa-mask-arrow) center / contain no-repeat;
  transition: transform 0.2s ease;
}

.wp-block-button.is-style-arrow > .wp-block-button__link:hover::after {
  transform: translateX(3px);
}

/* ---------- Accordion (core/accordion): lined list like Hub's ---------- */
.wp-block-accordion-item {
  border-bottom: 1px solid var(--wp--preset--color--silver);
}

.wp-block-accordion-heading {
  margin: 0;
  font-size: var(--wp--preset--font-size--size-13);
  font-weight: 600;
  line-height: 1.4;
}

.wp-block-accordion-heading__toggle {
  padding: 12px 0;
}

.wp-block-accordion-heading__toggle:hover
  .wp-block-accordion-heading__toggle-title {
  text-decoration: none;
}

.wp-block-accordion-panel {
  padding-bottom: 15px;
  font-size: var(--wp--preset--font-size--size-13);
}

.wp-block-accordion-panel > :first-child {
  margin-top: 0;
}

/* The "+" glyph is drawn here (removed from the heading text in inc/blocks.php). */
.wp-block-accordion-heading__toggle-icon:empty::before {
  content: "+";
}

/* FAQ style: no lines, larger questions, chevron */
.wp-block-accordion.is-style-faq .wp-block-accordion-item {
  border-bottom: 0;
}

.wp-block-accordion.is-style-faq .wp-block-accordion-heading {
  font-size: var(--wp--preset--font-size--size-16);
}

.wp-block-accordion.is-style-faq .wp-block-accordion-heading__toggle-icon {
  width: 14px;
  height: 16px;
  font-size: 0;
}

.wp-block-accordion.is-style-faq
  .wp-block-accordion-heading__toggle-icon::before {
  content: "";
  width: 14px; /* Hub's Font Awesome chevron at 16px */
  height: 16px;
  background: currentColor;
  -webkit-mask: var(--swa-mask-chevron-down) center / contain no-repeat;
  mask: var(--swa-mask-chevron-down) center / contain no-repeat;
}

.wp-block-accordion.is-style-faq
  .wp-block-accordion-item.is-open
  > .wp-block-accordion-heading
  .wp-block-accordion-heading__toggle-icon {
  transform: rotate(180deg);
}

/* ---------- Call-to-action box ---------- */
.is-style-cta-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 30px;
  padding: 15px 15px 15px 25px;
  border: 1px solid var(--wp--preset--color--contrast);
  background: var(--wp--preset--color--cream);
}

.is-style-cta-box > * {
  margin: 0 !important;
}

/* ---------- White box over an image (hero / promo) ---------- */
.is-style-overlay-box {
  padding: 40px 35px 30px 50px;
  background: rgb(255 255 255 / 0.85);
  color: var(--wp--preset--color--contrast);
}

/* ---------- Carousel strip: horizontal scroll with snap ---------- */
.is-style-carousel {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.is-style-carousel::-webkit-scrollbar {
  display: none;
}

.is-style-carousel > * {
  flex: 0 0 calc((100% - 60px) / 4);
  margin: 0 !important;
  scroll-snap-align: start;
}

@media (max-width: 781px) {
  .is-style-carousel > * {
    flex-basis: 80%;
  }
}

/* ---------- Numbered steps with a large faint number ---------- */
.is-style-step {
  position: relative;
  padding-top: 10px;
}

.is-style-step > .swa-step__number {
  position: absolute;
  top: -20px;
  right: 10px;
  margin: 0;
  color: var(--wp--preset--color--mist);
  font-size: 110px;
  font-weight: 700;
  line-height: 1;
  z-index: -1;
}

/* ---------- Stats ---------- */
.is-style-stat .swa-stat__number {
  margin: 0;
  font-size: var(--wp--preset--font-size--size-40);
  font-weight: 700;
  line-height: 1;
}

/* ---------- Testimonial ---------- */
.wp-block-quote.is-style-testimonial {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: var(--wp--preset--font-size--size-20);
  line-height: 1.6;
}

.wp-block-quote.is-style-testimonial cite {
  display: block;
  margin-top: 20px;
  font-size: var(--wp--preset--font-size--size-13);
  font-style: normal;
}

/* ---------- Tech stack row (icon + label) ---------- */
.swa-tech {
  gap: 28px;
  justify-content: center;
}

.swa-tech .is-style-icon-box p {
  margin: 8px 0 0;
  font-size: var(--wp--preset--font-size--size-12);
}

/* ---------- Case studies grid (portfolio query) ---------- */
.swa-case-studies .wp-block-post-title {
  margin-top: 14px;
  font-weight: 700;
}

.swa-case-studies .wp-block-post-title a {
  color: var(--wp--preset--color--contrast);
}

.swa-case-studies .wp-block-post-terms,
.swa-case-studies .wp-block-post-terms a {
  color: var(--wp--preset--color--slate);
}

.swa-case-studies .wp-block-post-excerpt {
  color: var(--wp--preset--color--grey);
}

/* ==========================================================================
   Utilities used by pages converted from Elementor (migration/tools/convert).
   ========================================================================== */

/* Responsive visibility (Elementor breakpoints: desktop >= 1200px, phone <= 767px). */
@media (min-width: 1200px) {
  .swa-hide-desktop {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .swa-hide-mobile {
    display: none !important;
  }
}

/* Width and self-alignment of fit-content items. */
.swa-fit {
  width: fit-content;
  max-width: 100%;
}
.swa-self-center {
  align-self: center;
  margin-left: auto !important;
  margin-right: auto !important;
}
.swa-self-end {
  align-self: flex-end;
  margin-left: auto !important;
}

/* Columns that stack their content like Elementor containers. */
.wp-block-column.swa-col-flex {
  display: flex;
  flex-direction: column;
}
.swa-col-flex.swa-items-center {
  align-items: center;
}
.swa-col-flex.swa-items-start {
  align-items: flex-start;
}
.swa-col-flex.swa-items-end {
  align-items: flex-end;
}
.swa-col-flex.swa-justify-center {
  justify-content: center;
}
.swa-col-flex.swa-justify-bottom {
  justify-content: flex-end;
}
/* A column whose card fills it (widget-wrap card split): the card's content takes the column's vertical alignment. */
.swa-col-flex.swa-justify-center > .swa-grow.is-vertical {
  justify-content: center;
}
.swa-col-flex.swa-justify-bottom > .swa-grow.is-vertical {
  justify-content: flex-end;
}
.swa-col-flex.swa-justify-space-between {
  justify-content: space-between;
}

/* Tall boxes (min-height): the inner group fills the height and aligns its own content. */
.swa-v-fill {
  display: flex;
  flex-direction: column;
}
.swa-v-fill > * {
  width: 100%;
}
.swa-v-fill > .swa-grow {
  flex-grow: 1;
}

/* Fixed widths (Elementor "custom width"), full width on phones where the original was. */
.swa-w-5 {
  width: 5%;
  max-width: 100%;
}
.swa-w-10 {
  width: 10%;
  max-width: 100%;
}
.swa-w-15 {
  width: 15%;
  max-width: 100%;
}
.swa-w-20 {
  width: 20%;
  max-width: 100%;
}
.swa-w-25 {
  width: 25%;
  max-width: 100%;
}
.swa-w-30 {
  width: 30%;
  max-width: 100%;
}
.swa-w-35 {
  width: 35%;
  max-width: 100%;
}
.swa-w-40 {
  width: 40%;
  max-width: 100%;
}
.swa-w-45 {
  width: 45%;
  max-width: 100%;
}
.swa-w-50 {
  width: 50%;
  max-width: 100%;
}
.swa-w-55 {
  width: 55%;
  max-width: 100%;
}
.swa-w-60 {
  width: 60%;
  max-width: 100%;
}
.swa-w-65 {
  width: 65%;
  max-width: 100%;
}
.swa-w-70 {
  width: 70%;
  max-width: 100%;
}
.swa-w-75 {
  width: 75%;
  max-width: 100%;
}
.swa-w-80 {
  width: 80%;
  max-width: 100%;
}
.swa-w-85 {
  width: 85%;
  max-width: 100%;
}
.swa-w-90 {
  width: 90%;
  max-width: 100%;
}
.swa-w-95 {
  width: 95%;
  max-width: 100%;
}
@media (max-width: 767px) {
  [class*="swa-w-"].swa-w-m-100 {
    width: 100%;
  }
}

.swa-grid-middle {
  align-items: center;
}

/* Grids with fewer columns on tablets and phones. */
@media (max-width: 1199px) {
  .is-layout-grid.swa-grid-t-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-t-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-t-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-t-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-t-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-t-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 767px) {
  .is-layout-grid.swa-grid-m-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-m-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-m-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-m-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-m-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
  .is-layout-grid.swa-grid-m-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

/* Lists: spacing between items, icon size and text indent. */
.wp-block-list.swa-list-plain {
  padding-left: 0;
  list-style: none;
}
/* Paragraphs inside list items (<li><p>) space like the live site's p: none above, 1.5em below (not the browser's 1em). */
.wp-block-list li > p {
  margin-top: 0;
  margin-bottom: 1.5em;
}
.wp-block-list > li:last-child > p:last-child {
  margin-bottom: 0;
} /* the widget wrapper carries the trailing space */
/* A list inside a list item has no bottom margin (Bootstrap's ul ul on the live site), only the outer list. */
.wp-block-list .wp-block-list {
  margin-bottom: 0;
}
.wp-block-list[class*="swa-li-gap-"] > li {
  margin-top: 0;
  margin-bottom: 0;
}
.wp-block-list.swa-li-gap-0 > li + li {
  margin-top: 0px;
}
.wp-block-list.swa-li-gap-2 > li + li {
  margin-top: 2px;
}
.wp-block-list.swa-li-gap-4 > li + li {
  margin-top: 4px;
}
.wp-block-list.swa-li-gap-6 > li + li {
  margin-top: 6px;
}
.wp-block-list.swa-li-gap-8 > li + li {
  margin-top: 8px;
}
.wp-block-list.swa-li-gap-10 > li + li {
  margin-top: 10px;
}
.wp-block-list.swa-li-gap-12 > li + li {
  margin-top: 12px;
}
.wp-block-list.swa-li-gap-14 > li + li {
  margin-top: 14px;
}
.wp-block-list.swa-li-gap-16 > li + li {
  margin-top: 16px;
}
.wp-block-list.swa-li-gap-20 > li + li {
  margin-top: 20px;
}
.wp-block-list.swa-li-gap-24 > li + li {
  margin-top: 24px;
}
.wp-block-list.swa-li-gap-30 > li + li {
  margin-top: 30px;
}
.swa-li-icon-8 {
  --swa-list-icon-size: 8px;
}
.swa-li-icon-10 {
  --swa-list-icon-size: 10px;
}
.swa-li-icon-12 {
  --swa-list-icon-size: 12px;
}
.swa-li-icon-14 {
  --swa-list-icon-size: 14px;
}
.swa-li-icon-16 {
  --swa-list-icon-size: 16px;
}
.swa-li-icon-18 {
  --swa-list-icon-size: 18px;
}
.swa-li-icon-20 {
  --swa-list-icon-size: 20px;
}
.swa-li-icon-24 {
  --swa-list-icon-size: 24px;
}
.swa-li-indent-0 {
  --swa-list-indent: 0px;
}
.swa-li-indent-12 {
  --swa-list-indent: 12px;
}
.swa-li-indent-16 {
  --swa-list-indent: 16px;
}
.swa-li-indent-18 {
  --swa-list-indent: 18px;
}
.swa-li-indent-20 {
  --swa-list-indent: 20px;
}
.swa-li-indent-22 {
  --swa-list-indent: 22px;
}
.swa-li-indent-24 {
  --swa-list-indent: 24px;
}
.swa-li-indent-26 {
  --swa-list-indent: 26px;
}
.swa-li-indent-28 {
  --swa-list-indent: 28px;
}
.swa-li-indent-32 {
  --swa-list-indent: 32px;
}
.swa-li-indent-36 {
  --swa-list-indent: 36px;
}
.swa-li-indent-40 {
  --swa-list-indent: 40px;
}
.wp-block-list.swa-list-inline {
  display: flex;
  flex-wrap: wrap;
  column-gap: 24px;
}

/* Separators drawn like Elementor's divider. */
.wp-block-separator.swa-hr {
  width: 100% !important;
  max-width: none;
  height: 0;
  margin-left: 0;
  margin-right: 0;
  border: 0;
  border-top: 1px solid currentColor;
  background: none !important;
  opacity: 1;
}
.wp-block-separator.swa-hr-2 {
  border-top-width: 2px;
}
.wp-block-separator.swa-hr-3 {
  border-top-width: 3px;
}
.wp-block-separator.swa-hr-4 {
  border-top-width: 4px;
}
.wp-block-separator.swa-hr-6 {
  border-top-width: 6px;
}
.wp-block-separator.swa-hr-8 {
  border-top-width: 8px;
}
.wp-block-separator.swa-hr-dashed {
  border-top-style: dashed;
}
.wp-block-separator.swa-hr-dotted {
  border-top-style: dotted;
}
.wp-block-separator.swa-hr-double {
  border-top-style: double;
}
.wp-block-separator.swa-hr-w-10 {
  width: 10% !important;
}
.wp-block-separator.swa-hr-w-20 {
  width: 20% !important;
}
.wp-block-separator.swa-hr-w-25 {
  width: 25% !important;
}
.wp-block-separator.swa-hr-w-30 {
  width: 30% !important;
}
.wp-block-separator.swa-hr-w-40 {
  width: 40% !important;
}
.wp-block-separator.swa-hr-w-50 {
  width: 50% !important;
}
.wp-block-separator.swa-hr-w-60 {
  width: 60% !important;
}
.wp-block-separator.swa-hr-w-70 {
  width: 70% !important;
}
.wp-block-separator.swa-hr-w-75 {
  width: 75% !important;
}
.wp-block-separator.swa-hr-w-80 {
  width: 80% !important;
}
.wp-block-separator.swa-hr-w-90 {
  width: 90% !important;
}
.wp-block-separator.swa-hr-center {
  margin-left: auto;
  margin-right: auto;
}

/* Carousels converted to scrolling strips: items per view. */
.is-style-carousel.swa-carousel-1 > * {
  flex-basis: calc((100% - 0px) / 1);
}
.is-style-carousel.swa-carousel-2 > * {
  flex-basis: calc((100% - 20px) / 2);
}
.is-style-carousel.swa-carousel-3 > * {
  flex-basis: calc((100% - 40px) / 3);
}
.is-style-carousel.swa-carousel-4 > * {
  flex-basis: calc((100% - 60px) / 4);
}
.is-style-carousel.swa-carousel-5 > * {
  flex-basis: calc((100% - 80px) / 5);
}
.is-style-carousel.swa-carousel-6 > * {
  flex-basis: calc((100% - 100px) / 6);
}
/* Phones: the original's own slides-per-view (swa-carousel-m-N); a sliver of the next slide shows that it scrolls. */
@media (max-width: 781px) {
  .is-style-carousel[class*="swa-carousel-"]:not(.swa-marquee) > * {
    flex-basis: 85%;
  }
  .is-style-carousel.swa-carousel-m-2:not(.swa-marquee) > * {
    flex-basis: calc((100% - 20px) / 2.15);
  }
  .is-style-carousel.swa-carousel-m-3:not(.swa-marquee) > * {
    flex-basis: calc((100% - 40px) / 3.15);
  }
  .is-style-carousel.swa-carousel-m-4:not(.swa-marquee) > * {
    flex-basis: calc((100% - 60px) / 4.15);
  }
}

/* Icon in a shape (circle, rounded square). */
.swa-icon.swa-icon--shape {
  width: fit-content;
  align-items: center;
  justify-content: center;
}
.swa-icon.swa-icon--shape.aligncenter {
  margin-left: auto;
  margin-right: auto;
}
.swa-icon.swa-icon--shape.alignright {
  margin-left: auto;
}

/* Tables (Hub table look: header row in small caps, lines between rows). */
.wp-block-table.swa-table table {
  width: 100%;
  border-collapse: collapse;
}
.wp-block-table.swa-table th,
.wp-block-table.swa-table td {
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid var(--wp--preset--color--line);
  text-align: left;
}
.wp-block-table.swa-table thead {
  border-bottom: 0;
}
.wp-block-table.swa-table th {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Phone-only alignment and stacking (Elementor per-device settings). */
@media (max-width: 767px) {
  .swa-m-align-left {
    text-align: left !important;
  }
  .swa-m-align-center {
    text-align: center !important;
  }
  .swa-m-align-right {
    text-align: right !important;
  }
  .wp-block-buttons.swa-m-justify-left {
    justify-content: flex-start !important;
  }
  .wp-block-buttons.swa-m-justify-center {
    justify-content: center !important;
  }
  .wp-block-buttons.swa-m-justify-right {
    justify-content: flex-end !important;
  }
  .is-layout-flex.swa-m-stack {
    flex-direction: column;
    align-items: stretch;
  }
  .is-layout-flex.swa-m-stack > * {
    flex-basis: auto !important;
    max-width: 100%;
  }
  .is-layout-flex.swa-m-stack.swa-m-items-center {
    align-items: center;
  }
  .is-layout-flex.swa-m-stack.swa-m-items-start {
    align-items: flex-start;
  }
  .is-layout-flex.swa-m-stack.swa-m-items-end {
    align-items: flex-end;
  }
  .swa-col-flex.swa-m-items-center {
    align-items: center;
  }
  .swa-col-flex.swa-m-items-start {
    align-items: flex-start;
  }
  .swa-col-flex.swa-m-items-end {
    align-items: flex-end;
  }
  .swa-col-flex.swa-m-items-stretch {
    align-items: stretch;
  }
  .swa-m-self-center {
    align-self: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .swa-m-self-start {
    align-self: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .swa-m-self-end {
    align-self: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .swa-m-self-stretch {
    align-self: stretch !important;
  }
}

/* Rows spread with space around / evenly (Elementor), which WordPress's layout control has no option for. */
.is-layout-flex.swa-justify-around {
  justify-content: space-around;
}
.is-layout-flex.swa-justify-evenly {
  justify-content: space-evenly;
}

/* Order flipped on phones. */
@media (max-width: 767px) {
  .is-layout-flex.is-vertical.swa-m-reverse,
  .is-layout-flex.swa-m-stack.swa-m-reverse {
    flex-direction: column-reverse;
  }
}
@media (max-width: 781px) {
  .wp-block-columns.swa-m-reverse {
    flex-direction: column-reverse;
  }
}

/* Featured image narrower than its column, centred (the width applies to the image). */
.wp-block-post-featured-image.aligncenter {
  width: fit-content;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}
.wp-block-post-featured-image.aligncenter img {
  height: auto;
} /* a fixed width (e.g. 1000px) shrinks to the column on phones */

/* ---------- Cards linked as a whole (swa/card-link) ---------- */
.swa-card {
  position: relative;
}
.swa-card-link {
  position: absolute;
  inset: 0;
  z-index: 2;
}

/* ---------- Portfolio grid (Hub "style 2" cards) ---------- */
/* Portfolio grid gap: from the block (measured per grid); 40px only for grids without one. */
.wp-block-post-template.swa-pf-grid:not(
    [class*="wp-container-core-post-template-is-layout-"]
  ) {
  gap: 40px;
}
.swa-pf-card__img {
  margin: 0 0 16px;
  overflow: hidden;
  border-radius: 6px;
}
.swa-pf-card__img img {
  transition: transform 0.6s ease;
}
.swa-pf-card:hover .swa-pf-card__img img {
  transform: scale(1.05);
}
.swa-pf-card .swa-pf-card__title {
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.32px;
}
.swa-pf-card__excerpt {
  color: rgb(0 0 0 / 0.55);
  font-size: 16px;
  line-height: 21px;
}
.swa-pf-card__excerpt p {
  margin: 0;
}
.swa-pf-card__cat {
  display: none;
} /* in the HTML, not shown (as on the Hub site) */

/* ---------- Star ratings (Elementor star rating) ---------- */
.swa-stars {
  position: relative;
  display: inline-block;
  letter-spacing: 0.15em;
  color: var(--wp--preset--color--silver);
}
.swa-rating .swa-stars {
  background: linear-gradient(
    90deg,
    currentColor var(--swa-rating, 100%),
    #ccd6df var(--swa-rating, 100%)
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.swa-rating-10 {
  --swa-rating: 10%;
}
.swa-rating-20 {
  --swa-rating: 20%;
}
.swa-rating-30 {
  --swa-rating: 30%;
}
.swa-rating-40 {
  --swa-rating: 40%;
}
.swa-rating-50 {
  --swa-rating: 50%;
}
.swa-rating-60 {
  --swa-rating: 60%;
}
.swa-rating-70 {
  --swa-rating: 70%;
}
.swa-rating-80 {
  --swa-rating: 80%;
}
.swa-rating-90 {
  --swa-rating: 90%;
}
.swa-rating-100 {
  --swa-rating: 100%;
}

/* ---------- Former tabs (stacked) ---------- */
.swa-tab + .swa-tab {
  margin-top: 30px;
}
.swa-tab-title {
  margin-bottom: 10px;
}

/* ---------- Blog grid (Hub blog "style 20" cards) ---------- */
.wp-block-post-template.swa-blog-grid {
  gap: 30px;
}
.swa-blog-card__img {
  margin: 0 0 16px;
  overflow: hidden;
}
.swa-blog-card__img img {
  transition: transform 0.6s ease;
}
.swa-blog-card:hover .swa-blog-card__img img {
  transform: scale(1.05);
}
.swa-blog-card__cat {
  margin: 0 0 16px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.swa-blog-card__cat a {
  position: relative;
  z-index: 3;
  display: inline-block;
  padding: 4px 10px;
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}
.swa-blog-card .swa-blog-card__title {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.3;
}
.swa-blog-card__title a {
  color: inherit;
}
.swa-blog-card__excerpt {
  margin: 0 0 1rem;
}
.swa-blog-card__excerpt p {
  margin: 0;
}

/* ---------- Link box (whole box is a link) ---------- */
a.wp-block-swa-link-box {
  display: block;
  color: inherit;
  text-decoration: none;
}
a.wp-block-swa-link-box:hover {
  text-decoration: none;
}

/* ---------- Page numbers (swa/pagination) ---------- */
.swa-pagination {
  margin-top: 40px;
}
.swa-pagination ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.swa-pagination a,
.swa-pagination span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  color: inherit;
  text-decoration: none;
}
.swa-pagination .current {
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}
.swa-blog-card__more {
  position: relative;
  z-index: 3;
  display: inline-block;
  margin-top: 8px;
  font-weight: 600;
}

/* ---------- Category filter (swa/term-filter) ---------- */
.swa-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 30px;
  margin-bottom: 48px !important;
  font-size: var(--swa-filter-fs, 13px);
  line-height: 21px;
}
.swa-filter__label {
  color: var(--swa-filter-label, inherit);
}
.swa-filter__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 2.5em;
  margin: 0;
  padding: 0;
  list-style: none;
}
.swa-filter__list li {
  color: var(--swa-filter-color, #747474);
  cursor: pointer;
}
.swa-filter__list li.is-active,
.swa-filter__list li:hover {
  color: var(--swa-filter-active, #16171e);
}
.swa-filter__select {
  display: none;
}
/* Hub below 992px: the label on its own line, then a dropdown. */
@media (max-width: 991px) {
  .swa-filter {
    flex-direction: column;
    align-items: flex-start;
    gap: 23px;
    margin-bottom: 24px !important;
  }
  .swa-filter__list {
    display: none;
  }
  .swa-filter__select {
    display: block;
    width: 279px;
    max-width: 100%;
    height: 38px;
    padding: 0 12px;
    font-size: 13px;
  }
}

/* ---------- Video with poster (swa/video) ---------- */
.swa-video {
  position: relative;
  margin: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.swa-video__frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.swa-video__poster {
  position: absolute;
  inset: 0;
  z-index: 1;
  padding: 0;
  border: 0;
  background: #000;
  cursor: pointer;
}
.swa-video__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.swa-video__play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 72px;
  height: 72px;
  margin: -36px 0 0 -36px;
  border-radius: 50%;
  background: rgb(255 255 255 / 0.9);
}
.swa-video__play::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  border-style: solid;
  border-width: 12px 0 12px 20px;
  border-color: transparent transparent transparent #000;
  transform: translate(-50%, -50%);
}

/* ---------- Rotating words in a heading (Hub text rotator) ---------- */
.swa-rotate {
  display: inline-grid;
}
.swa-rotate > span {
  grid-area: 1 / 1;
  opacity: 0;
  animation: swa-rotate calc(var(--swa-rotate-n) * 2.5s) infinite;
  animation-delay: calc(var(--i) * 2.5s);
}
@keyframes swa-rotate {
  0%,
  30% {
    opacity: 1;
  }
  34%,
  100% {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .swa-rotate > span {
    animation: none;
  }
  .swa-rotate > span:first-child {
    opacity: 1;
  }
}

/* Widgets with a pixel width (converted from Elementor): never wider than their row. */
.swa-max-w-full {
  max-width: 100%;
}

/* Columns that wrap to N per row on phones (Elementor sections whose columns are 50% / 33% wide on mobile). */
.wp-block-columns[class*="swa-cols-m-"] {
  width: 100%;
  align-self: stretch;
}
.wp-block-columns[class*="swa-cols-m-"] > .wp-block-column {
  box-sizing: border-box;
}
@media (max-width: 781px) {
  .wp-block-columns[class*="swa-cols-m-"] {
    flex-wrap: wrap !important;
  }
  .wp-block-columns.swa-cols-m-1 > .wp-block-column {
    flex-basis: 100% !important;
  }
  .wp-block-columns.swa-cols-m-2 > .wp-block-column {
    flex-basis: calc(50% - 1px) !important;
    flex-grow: 0;
  }
  .wp-block-columns.swa-cols-m-3 > .wp-block-column {
    flex-basis: calc(33.333% - 1px) !important;
    flex-grow: 0;
  }
  .wp-block-columns.swa-cols-m-4 > .wp-block-column {
    flex-basis: calc(25% - 1px) !important;
    flex-grow: 0;
  }
}

/* Converted Elementor pages: full-width sections sit edge to edge as on the original (their own padding, captured
   from the original, is set inline and still applies). The theme's global side padding is for theme templates. */
.swa-converted .entry-content .alignfull.has-global-padding {
  padding-left: 0;
  padding-right: 0;
}
.swa-converted .entry-content.has-global-padding {
  padding-left: 0;
  padding-right: 0;
}
.swa-converted .entry-content.has-global-padding > .alignfull {
  margin-left: 0;
  margin-right: 0;
}

/* Tall sections that centre / bottom-align their content (Elementor section "vertical align"). */
.swa-v-center,
.swa-v-bottom {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.swa-v-bottom {
  justify-content: flex-end;
}
.swa-v-center > *,
.swa-v-bottom > * {
  width: 100%;
}

/* Absolutely positioned elements (Elementor "position: absolute"), offsets set by inc/blocks.php. */
:where(*):has(> .swa-abs) {
  position: relative;
}
/* As Elementor stacks them: every element is positioned, so whatever comes later in the page paints on top
   (a backdrop shape placed before a testimonial stays behind its text; a badge placed after stays in front). */
:where(*):has(> .swa-abs) > :where(:not(.swa-abs)) {
  position: relative;
}
.swa-abs {
  position: absolute !important;
  left: var(--swa-abs-l, 0);
  top: var(--swa-abs-t, 0);
  width: var(--swa-abs-w, auto);
  max-width: none;
  margin: 0 !important;
}
@media (max-width: 781px) {
  .swa-abs {
    left: var(--swa-abs-ml, var(--swa-abs-l, 0));
    top: var(--swa-abs-mt, var(--swa-abs-t, 0));
    width: var(--swa-abs-mw, var(--swa-abs-w, auto));
  }
  .swa-abs.swa-abs-m-static {
    position: static !important;
    width: auto;
  }
}

/* Hub outline headings (e.g. the large step numbers): the digits drawn as an outline. */
.swa-text-outline {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1px currentColor;
}

/* Columns are sized border-box, as Elementor's: padding is inside the column's width, not added to it. */
.wp-block-columns > .wp-block-column {
  box-sizing: border-box;
}

/* Side-by-side widgets measured on one line on the original desktop layout: no wrapping there. */
@media (min-width: 782px) {
  .swa-nowrap-d {
    flex-wrap: nowrap !important;
  }
  .swa-nowrap-d > * {
    flex-shrink: 0;
  }
}

/* Hub accordion "underlined titles": no item lines, a 1px line under each title (text colour), 10px between items, +/- icon. */
.wp-block-accordion.swa-acc-underlined .wp-block-accordion-item {
  border-bottom: 0;
  margin-bottom: 0;
} /* Hub: rows touch; an item margin set on the original comes from the converter */
.wp-block-accordion.swa-acc-underlined .wp-block-accordion-heading__toggle {
  border-bottom: 1px solid currentColor;
}
.wp-block-accordion.swa-acc-underlined
  .wp-block-accordion-item.is-open
  > .wp-block-accordion-heading
  .wp-block-accordion-heading__toggle-icon:empty::before {
  content: "\2212";
}

/* Portfolio card titles: the client name under the title (<br><small>), as on Hub. */
.wp-block-post-title small {
  font-size: 0.75em;
  font-weight: 400;
  color: #777;
  line-height: 1;
}
/* A full-width container inside a centred vertical flex group (Elementor containers default to 100%). */
.swa-self-stretch {
  align-self: stretch !important;
}
/* Short accent rules with a pixel length. */
.wp-block-separator.swa-hr-px-20 {
  width: 20px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-30 {
  width: 30px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-40 {
  width: 40px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-48 {
  width: 48px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-50 {
  width: 50px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-60 {
  width: 60px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-70 {
  width: 70px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-80 {
  width: 80px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-100 {
  width: 100px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-120 {
  width: 120px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-150 {
  width: 150px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-200 {
  width: 200px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-250 {
  width: 250px !important;
  max-width: 100%;
}
.wp-block-separator.swa-hr-px-300 {
  width: 300px !important;
  max-width: 100%;
}
/* Grid gap on phones when Elementor set a different mobile gap. */
@media (max-width: 767px) {
  .swa-gap-m-0 {
    gap: 0px !important;
  }
  .swa-gap-m-5 {
    gap: 5px !important;
  }
  .swa-gap-m-10 {
    gap: 10px !important;
  }
  .swa-gap-m-15 {
    gap: 15px !important;
  }
  .swa-gap-m-20 {
    gap: 20px !important;
  }
  .swa-gap-m-25 {
    gap: 25px !important;
  }
  .swa-gap-m-30 {
    gap: 30px !important;
  }
  .swa-gap-m-40 {
    gap: 40px !important;
  }
  .swa-gap-m-50 {
    gap: 50px !important;
  }
  .swa-gap-m-60 {
    gap: 60px !important;
  }
}
/* Card carousels: room for the cards' shadow inside the scrolling strip. */
.is-style-carousel.swa-carousel-cards {
  padding: 10px 20px 70px;
  margin-left: -20px;
  margin-right: -20px;
}
/* A linked image sized in % fills its box (WordPress makes the link inline-block, which shrinks it to the file's width). */
.wp-block-image.is-resized > a {
  display: block;
}
.swa-clip {
  overflow: hidden;
}
/* Fixed-width boxes centred in their row (Elementor container width in px); shrink with the screen. */
[class*="swa-maxw-"] {
  width: 100%;
  max-width: var(--swa-maxw, 100%);
}
@media (max-width: 781px) {
  /* One card at a time on phones, full width, as Hub's stacked carousel. */
  .is-style-carousel.swa-carousel-cards:not(.swa-marquee) > * {
    flex-basis: 100%;
  }
  .is-style-carousel.swa-carousel-cards {
    padding: 10px 10px 50px;
    margin-left: -10px;
    margin-right: -10px;
  }
}
.wp-block-separator.swa-hr-right {
  margin-left: auto;
  margin-right: 0;
}
@media (max-width: 767px) {
  /* A share of a desktop row that becomes full width on phones. */
  .swa-basis-m-100 {
    flex-basis: 100% !important;
    width: 100% !important;
  }
}
@media (max-width: 767px) {
  /* Same semantics as Elementor's mobile width: a share of the row. */
  .swa-basis-m-50 {
    flex-basis: 50% !important;
    flex-grow: 0 !important;
  }
  .swa-basis-m-33 {
    flex-basis: 33.333% !important;
    flex-grow: 0 !important;
  }
  .swa-basis-m-25 {
    flex-basis: 25% !important;
    flex-grow: 0 !important;
  }
}

/* Hub content box (fancy box) cards: image along the top at its own aspect, a shade over the card, icon and
   title at the bottom, the whole card a link. Proportions from the original (swa-ar-W-H -> --swa-ar); a card
   grows when its text needs more room (phones). */
.swa-fbox {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--swa-ar, auto);
}
.swa-fbox > .swa-fbox__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  margin: 0 !important;
  z-index: 0;
}
.swa-fbox > .swa-fbox__img img {
  display: block;
  width: 100%;
  height: auto;
}
.swa-fbox > .swa-fbox__shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  margin: 0 !important;
}
.swa-fbox > :not(.swa-fbox__img):not(.swa-fbox__shade):not(.swa-card-link) {
  position: relative;
  z-index: 2;
}
.swa-fbox > .swa-card-link {
  z-index: 3;
}
/* Elementor "fit to screen" sections: a screen tall on the sizes where the original was (also over swa-cover-auto). */
@media (min-width: 768px) {
  .swa-vh-d,
  .wp-block-cover.swa-cover-auto.swa-vh-d {
    min-height: 100vh;
  }
}
@media (max-width: 767px) {
  .swa-vh-m,
  .wp-block-cover.swa-cover-auto.swa-vh-m {
    min-height: 100vh;
  }
}
/* Portfolio cards: title (with the client in <small>) then the excerpt 4px below, no block gap between. */
.swa-pf-card > * + * {
  margin-block-start: 0;
}
@media (max-width: 767px) {
  .swa-fbox {
    aspect-ratio: var(--swa-ar-m, var(--swa-ar, auto));
  }
}
@media (max-width: 767px) {
  .wp-block-image[class*="swa-imgw-m-"] img {
    width: var(--swa-imgw-m) !important;
  }
}
/* Hub gradient text: letters filled with the block's gradient; with no gradient they are invisible (as on Hub). */
.swa-text-gradient {
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent;
  padding: 0 !important;
} /* over the inline background shorthand and core's has-background padding */
.swa-text-gradient.swa-fh-ib {
  width: fit-content;
  max-width: 100%;
} /* Hub inline-block: the gradient spans the text, not the column */
.swa-text-gradient.swa-fh-ib.has-text-align-center {
  margin-left: auto;
  margin-right: auto;
}
.swa-text-invisible {
  -webkit-text-fill-color: transparent;
  color: transparent !important;
}
/* Pagination as Hub's: 35px squares 6px apart, 14px bold; the current page black with white text, prev/next on light grey. */
.swa-pagination ul {
  gap: 6px;
}
.swa-pagination a,
.swa-pagination span.page-numbers {
  min-width: 35px;
  width: 35px;
  height: 35px;
  padding: 0;
  border-radius: 6%;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  color: var(--wp--preset--color--contrast);
}
.swa-pagination .page-numbers.current {
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base) !important;
}
.swa-pagination a.next,
.swa-pagination a.prev {
  background: #f4f4f8;
}
.swa-last-mb0 > :last-child {
  margin-bottom: 0 !important;
}

/* Elementor icon-list "Divider": a line under each item but the last, centred in the gap to the next one. */
.wp-block-list.swa-li-gap-0 {
  --swa-li-gap: 0px;
}
.wp-block-list.swa-li-gap-2 {
  --swa-li-gap: 2px;
}
.wp-block-list.swa-li-gap-4 {
  --swa-li-gap: 4px;
}
.wp-block-list.swa-li-gap-6 {
  --swa-li-gap: 6px;
}
.wp-block-list.swa-li-gap-8 {
  --swa-li-gap: 8px;
}
.wp-block-list.swa-li-gap-10 {
  --swa-li-gap: 10px;
}
.wp-block-list.swa-li-gap-12 {
  --swa-li-gap: 12px;
}
.wp-block-list.swa-li-gap-14 {
  --swa-li-gap: 14px;
}
.wp-block-list.swa-li-gap-16 {
  --swa-li-gap: 16px;
}
.wp-block-list.swa-li-gap-20 {
  --swa-li-gap: 20px;
}
.wp-block-list.swa-li-gap-24 {
  --swa-li-gap: 24px;
}
.wp-block-list.swa-li-gap-30 {
  --swa-li-gap: 30px;
}
.wp-block-list.swa-li-divider > li {
  position: relative;
}
.wp-block-list.swa-li-divider > li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: calc(var(--swa-li-gap, 0px) / -2);
  width: 100%;
  border-top: var(--swa-li-divider-weight, 1px) solid
    var(--swa-li-divider-color, #ddd);
  pointer-events: none;
}
.swa-li-divider-2px {
  --swa-li-divider-weight: 2px;
}
.swa-li-divider-3px {
  --swa-li-divider-weight: 3px;
}
.swa-li-divider-4px {
  --swa-li-divider-weight: 4px;
}
.swa-li-divider-contrast {
  --swa-li-divider-color: var(--wp--preset--color--contrast);
}
.swa-li-divider-base {
  --swa-li-divider-color: var(--wp--preset--color--base);
}
.swa-li-divider-steel {
  --swa-li-divider-color: var(--wp--preset--color--steel);
}
.swa-li-divider-silver {
  --swa-li-divider-color: var(--wp--preset--color--silver);
}
.swa-li-divider-slate {
  --swa-li-divider-color: var(--wp--preset--color--slate);
}
/* Icon centred on a multi-line item's text (Elementor's default icon vertical alignment). */
.wp-block-list.swa-li-icon-mid > li::before {
  top: calc(50% - var(--swa-list-icon-size, 16px) / 2);
}
.swa-li-divider-ink {
  --swa-li-divider-color: var(--wp--preset--color--ink);
}
.swa-li-divider-midnight {
  --swa-li-divider-color: var(--wp--preset--color--midnight);
}
.swa-li-divider-navy {
  --swa-li-divider-color: var(--wp--preset--color--navy);
}
.swa-li-divider-grey {
  --swa-li-divider-color: var(--wp--preset--color--grey);
}
.swa-li-divider-line {
  --swa-li-divider-color: var(--wp--preset--color--line);
}
.swa-li-divider-mist {
  --swa-li-divider-color: var(--wp--preset--color--mist);
}
.swa-li-divider-cloud {
  --swa-li-divider-color: var(--wp--preset--color--cloud);
}
.swa-li-divider-cream {
  --swa-li-divider-color: var(--wp--preset--color--cream);
}
.swa-li-divider-blue {
  --swa-li-divider-color: var(--wp--preset--color--blue);
}
.swa-li-divider-brick {
  --swa-li-divider-color: var(--wp--preset--color--brick);
}
@media (max-width: 767px) {
  .swa-m-no-border {
    border-width: 0 !important;
  }
}
.wp-block-column.swa-col-flex > .swa-grow {
  flex-grow: 1;
}
/* Legacy section columns that wrap onto several lines (Hub "wrap columns") keep their measured shares. */
@media (min-width: 782px) {
  .wp-block-columns.swa-cols-wrap {
    flex-wrap: wrap !important;
  }
}
/* Columns that do not fill their row, spread as Elementor's justify-content did. */
.wp-block-columns.swa-cols-justify-between {
  justify-content: space-between;
}
.wp-block-columns.swa-cols-justify-around {
  justify-content: space-around;
}
.wp-block-columns.swa-cols-justify-evenly {
  justify-content: space-evenly;
}
.wp-block-columns.swa-cols-justify-center {
  justify-content: center;
}
.wp-block-columns.swa-cols-justify-end {
  justify-content: flex-end;
}
/* Elementor grid rows (default two 1fr rows). */
.swa-grid-rows-2 {
  grid-template-rows: repeat(2, 1fr);
}
.swa-grid-rows-3 {
  grid-template-rows: repeat(3, 1fr);
}
.swa-grid-rows-4 {
  grid-template-rows: repeat(4, 1fr);
}
.swa-grid-rows-5 {
  grid-template-rows: repeat(5, 1fr);
}
.swa-grid-rows-6 {
  grid-template-rows: repeat(6, 1fr);
}
@media (max-width: 767px) {
  .swa-gap-m-14 {
    gap: 14px !important;
  }
}
.wp-block-cover.swa-cover-auto {
  min-height: 0;
}
.swa-fbox.swa-fbox--zoom > .swa-fbox__img {
  top: -6.25%;
  left: -6.25%;
  width: 112.5%;
  max-width: none;
}
/* Carousel slide spacing from Elementor (swa-carousel-gap-N); arrows placed outside inset the slides 30px. */
.is-style-carousel[class*="swa-carousel-gap-"] {
  --swa-car-gap: 20px;
  gap: var(--swa-car-gap);
}
.is-style-carousel.swa-carousel-gap-0 {
  --swa-car-gap: 0px;
}
.is-style-carousel.swa-carousel-gap-10 {
  --swa-car-gap: 10px;
}
.is-style-carousel.swa-carousel-gap-20 {
  --swa-car-gap: 20px;
}
.is-style-carousel.swa-carousel-gap-30 {
  --swa-car-gap: 30px;
}
@media (min-width: 782px) {
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-2 > * {
    flex-basis: calc((100% - var(--swa-car-gap)) / 2);
  }
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-3 > * {
    flex-basis: calc((100% - 2 * var(--swa-car-gap)) / 3);
  }
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-4 > * {
    flex-basis: calc((100% - 3 * var(--swa-car-gap)) / 4);
  }
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-5 > * {
    flex-basis: calc((100% - 4 * var(--swa-car-gap)) / 5);
  }
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-6 > * {
    flex-basis: calc((100% - 5 * var(--swa-car-gap)) / 6);
  }
}
.is-style-carousel.swa-carousel-arrows-out {
  margin-inline: 30px !important;
}
@media (max-width: 781px) {
  .is-style-carousel.swa-carousel-m-1:not(.swa-marquee) > * {
    flex-basis: 100%;
  }
  .is-style-carousel[class*="swa-carousel-gap-"].swa-carousel-m-2:is(
      .swa-carousel-arrows,
      .swa-carousel-dots
    ):not(.swa-marquee)
    > * {
    flex-basis: calc((100% - var(--swa-car-gap)) / 2);
  }
}

/* Hub accordion expander: Liquid's thin "ios add / remove" glyphs as masks, at the measured size. */
:root {
  --swa-mask-plus-thin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath transform='matrix%281 0 0 -1 0 256%29' d='M130.4 201.52A7.520 7.520 0 0 0 137.92 193.92V133.28H198.56A7.520 7.520 0 1 0 198.56 118.08H137.92V57.44A7.520 7.520 0 1 0 122.72 57.44V118.08H62.08A7.520 7.520 0 1 0 62.08 133.28H122.72V193.92A7.520 7.520 0 0 0 130.4 201.52z'/%3E%3C/svg%3E");
  --swa-mask-minus-thin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath transform='matrix%281 0 0 -1 0 256%29' d='M54.56 127.36A7.520 7.520 0 0 0 62.16 134.96H198.8A7.520 7.520 0 1 0 198.8 119.92H62.16A7.520 7.520 0 0 0 54.56 127.36z'/%3E%3C/svg%3E");
}
.wp-block-accordion.swa-acc-ios .wp-block-accordion-heading__toggle-icon {
  width: var(--swa-acc-icon, 20px);
  height: var(--swa-acc-icon, 20px);
  font-size: 0;
  flex: 0 0 auto;
}
.wp-block-accordion.swa-acc-ios
  .wp-block-accordion-heading__toggle-icon::before {
  content: "" !important;
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  -webkit-mask: var(--swa-mask-plus-thin) center / contain no-repeat;
  mask: var(--swa-mask-plus-thin) center / contain no-repeat;
}
.wp-block-accordion.swa-acc-ios
  .wp-block-accordion-item.is-open
  > .wp-block-accordion-heading
  .wp-block-accordion-heading__toggle-icon::before {
  -webkit-mask-image: var(--swa-mask-minus-thin);
  mask-image: var(--swa-mask-minus-thin);
}
.swa-acc-icon-12 {
  --swa-acc-icon: 12px;
}
.swa-acc-icon-15 {
  --swa-acc-icon: 15px;
}
.swa-acc-icon-18 {
  --swa-acc-icon: 18px;
}
.swa-acc-icon-20 {
  --swa-acc-icon: 20px;
}
.swa-acc-icon-24 {
  --swa-acc-icon: 24px;
}
.swa-acc-icon-30 {
  --swa-acc-icon: 30px;
}
@media (max-width: 767px) {
  .swa-acc-icon-m-12 {
    --swa-acc-icon: 12px;
  }
  .swa-acc-icon-m-15 {
    --swa-acc-icon: 15px;
  }
  .swa-acc-icon-m-18 {
    --swa-acc-icon: 18px;
  }
  .swa-acc-icon-m-20 {
    --swa-acc-icon: 20px;
  }
  .swa-acc-icon-m-24 {
    --swa-acc-icon: 24px;
  }
  .swa-acc-icon-m-30 {
    --swa-acc-icon: 30px;
  }
}
@media (max-width: 767px) {
  /* Icon size on phones (Elementor per-device icon size). */
  .swa-icon[class*="swa-isz-m-"] {
    --swa-icon-size: var(--swa-icon-size-m) !important;
  }
  .swa-icon[class*="swa-isz-m-"] > .swa-icon__svg {
    height: var(--swa-icon-size-m);
    width: auto;
  }
  .swa-icon[class*="swa-isz-m-"] > .swa-icon__img {
    width: var(--swa-icon-size-m);
  }
  /* Column share on phones for columns that stay side by side. */
  .wp-block-columns > .wp-block-column[class*="swa-colw-m-"] {
    flex-basis: var(--swa-colw-m) !important;
    flex-grow: 0 !important;
  }
}
@media (max-width: 767px) {
  .is-layout-flex.swa-m-wrap {
    flex-wrap: wrap !important;
  }
}
.wp-block-accordion.is-style-faq .wp-block-accordion-heading__toggle-icon {
  margin-inline-start: 16px;
  flex-shrink: 0;
}
.swa-video {
  background: #000;
}

/* Portfolio categories shown as pills over the image (Hub custom CSS on the results / home / services grids). */
.swa-pf-card__cat.swa-pf-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 15px;
  pointer-events: none;
}
.swa-pf-pills .wp-block-post-terms__separator {
  display: none;
}
.swa-pf-pills a {
  display: inline-block;
  margin: 6px 10px 2px 0;
  padding: 4px 10px;
  border: 1px solid #fff;
  border-radius: 100px;
  background: rgb(0 0 0 / 0.5);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
}
.swa-pf-pills a[href*="/homepage-featured/"],
.swa-pf-pills a[href*="/our-top-projects/"] {
  display: none;
}
@media (max-width: 1199px) {
  .swa-pf-pills a {
    margin: 12px 10px 6px 0;
    font-size: 8px;
    line-height: 12px;
  }
}
.swa-pf-rad-0 {
  border-radius: 0;
}
.swa-pf-rad-4 {
  border-radius: 4px;
}
.swa-pf-rad-8 {
  border-radius: 8px;
}
.swa-pf-rad-10 {
  border-radius: 10px;
}
.swa-pf-rad-12 {
  border-radius: 12px;
}
.swa-pf-rad-15 {
  border-radius: 15px;
}
.swa-pf-rad-20 {
  border-radius: 20px;
}
@media (min-width: 768px) {
  .wp-block-post-template[class*="swa-pf-stagger-"]
    > .wp-block-post:nth-child(even) {
    margin-top: var(--swa-pf-stagger);
  }
}

/* Hub process box (ld_process_box): the number in a dashed circle beside the step's title and text. */
.swa-steps > .swa-step {
  display: flex;
  align-items: center;
  position: relative;
  margin: 0;
}
.swa-step > .swa-step__num {
  flex: 0 0 150px;
  width: 150px;
  height: 150px;
  margin: 0 40px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 2px dashed #dfe2e6;
  border-radius: 50%;
  background: #fff;
}
.swa-step > .swa-step__body {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
}
@media (min-width: 768px) {
  .swa-steps--zigzag > .swa-step {
    padding: 20px 0 25px;
  }
  .swa-steps--zigzag > .swa-step > .swa-step__body {
    flex: 0 0 60%;
  }
  .swa-steps--zigzag > .swa-step:nth-child(even) {
    flex-direction: row-reverse;
    text-align: right;
  }
  .swa-steps--zigzag > .swa-step:nth-child(even) > .swa-step__num {
    margin: 0 0 0 40px !important;
  } /* over the icon's own (inline) right margin */
  .swa-steps--zigzag > .swa-step:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 90px;
    right: 90px;
    bottom: 0;
    border-bottom: 2px dashed #dfe2e6;
  }
}

/* ---------- Hub contact form (ld_cf7: underlined thick inputs, large full-width rounded button) ---------- */
.swa-cf7 .wpcf7-form p {
  margin: 0;
}
.swa-cf7 .wpcf7-form .row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.swa-cf7 .wpcf7-form .row > [class*="col-"] {
  box-sizing: border-box;
  width: 100%;
  padding: 0 15px;
}
@media (min-width: 992px) {
  .swa-cf7 .wpcf7-form .row > .col-md-6 {
    width: 50%;
  }
}
.swa-cf7 .wpcf7-form-control-wrap {
  display: block;
  margin-bottom: 20px;
}
.swa-cf7 .wpcf7-form-control:not(.wpcf7-submit) {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  margin: 0;
  padding: 1px 0;
  border: 0;
  border-bottom: 2px solid #d0d7de;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  outline: 0;
  color: #000;
  font: inherit;
  font-size: 14px;
  line-height: 21px;
  transition: border-color 0.3s;
}
.swa-cf7 textarea.wpcf7-form-control:not(.wpcf7-submit) {
  height: 114px;
  padding: 14px 0;
  resize: vertical;
}
.swa-cf7 .wpcf7-form-control::placeholder {
  color: #000;
  opacity: 1;
}
.swa-cf7 .wpcf7-form-control:not(.wpcf7-submit):hover,
.swa-cf7 .wpcf7-form-control:not(.wpcf7-submit):focus {
  border-color: #000;
}
.swa-cf7 label {
  font-size: 12px;
  color: rgb(0 0 0 / 0.3);
}
.swa-cf7 .wpcf7-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 60px;
  padding: 0 44.8px;
  border: 2px solid #0a0f1e;
  border-radius: 4px;
  background: #0a0f1e;
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 21px;
  cursor: pointer;
  transition:
    background 0.3s,
    border-color 0.3s;
}
.swa-cf7 .wpcf7-submit:hover {
  background: #000;
  border-color: #000;
}
.swa-cf7 .wpcf7-form p:has(> .wpcf7-submit) {
  position: relative;
}
.swa-cf7 .wpcf7-spinner {
  position: absolute;
}
.swa-text-outline-2 {
  -webkit-text-stroke-width: 2px;
}
.swa-text-outline-3 {
  -webkit-text-stroke-width: 3px;
}
.swa-text-outline-4 {
  -webkit-text-stroke-width: 4px;
}
/* Hub button icons: drawn inside the link beside the text, at the measured gap. */
.wp-block-button.swa-btn-icon > .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--swa-bi-gap, 8px);
}
.swa-btn__icon {
  display: inline-flex;
  line-height: 0;
  flex: 0 0 auto;
}
.swa-btn__icon svg,
.swa-btn__icon img {
  display: block;
}
.wp-block-button.swa-btn-nowrap > .wp-block-button__link {
  white-space: nowrap;
}
/* Elementor shape dividers (inc/blocks.php): an SVG at the block's top or bottom edge, under the content. */
:where(.wp-block-group, .wp-block-cover):has(> .swa-shape) {
  position: relative;
}
:where(.wp-block-group):has(> .swa-shape) > :not(.swa-shape):not(.swa-abs) {
  position: relative;
  z-index: 1;
}
.swa-shape {
  position: absolute;
  left: 0;
  width: 100%;
  line-height: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
  direction: ltr;
}
.swa-shape--bottom {
  bottom: -1px;
}
.swa-shape--top {
  top: -1px;
}
.swa-shape--bottom:not(.is-negative),
.swa-shape--top.is-negative {
  transform: rotate(180deg);
}
.swa-shape svg {
  display: block;
  width: calc(100% + 1.3px);
  height: var(--swa-shape-h, auto);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.swa-shape path {
  fill: var(--swa-shape-fill, #fff);
}
@media (max-width: 767px) {
  .swa-shape svg {
    height: var(--swa-shape-hm, var(--swa-shape-h, auto));
  }
}
/* Elementor shape dividers (inc/blocks.php): an SVG at the block's top or bottom edge, under the content. */
:where(.wp-block-group, .wp-block-cover):has(> .swa-shape) {
  position: relative;
}
:where(.wp-block-group):has(> .swa-shape) > :not(.swa-shape):not(.swa-abs) {
  position: relative;
  z-index: 1;
}
.swa-shape {
  position: absolute;
  left: 0;
  width: 100%;
  line-height: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
  direction: ltr;
}
.swa-shape--bottom {
  bottom: -1px;
}
.swa-shape--top {
  top: -1px;
}
.swa-shape--bottom:not(.is-negative),
.swa-shape--top.is-negative {
  transform: rotate(180deg);
}
.swa-shape svg {
  display: block;
  width: calc(100% + 1.3px);
  height: var(--swa-shape-h, auto);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.swa-shape path {
  fill: var(--swa-shape-fill, #fff);
}
@media (max-width: 767px) {
  .swa-shape svg {
    height: var(--swa-shape-hm, var(--swa-shape-h, auto));
  }
}
/* Hub portfolio "load more" button. */
.swa-loadmore {
  display: flex;
  justify-content: center;
  margin-top: 16px;
  padding-bottom: 16px;
} /* Hub page-nav (16px around it; padding, as a last child loses its bottom margin); the grid keeps its last-row gap above */
.swa-loadmore__btn {
  display: inline-block;
  min-width: 200px;
  box-sizing: border-box;
  padding: 18.75px 37.5px;
  background: #292929;
  color: #fff;
  font-size: 15px;
  line-height: 17.25px;
  text-align: center;
  text-decoration: none;
}
.swa-loadmore__btn:hover {
  background: #000;
  color: #fff;
}
.wp-block-post-title.swa-pf-small-inherit small {
  color: inherit;
}
.wp-block-post-title.swa-pf-small-50 small {
  font-size: 0.5em;
}
.wp-block-post-title.swa-pf-small-55 small {
  font-size: 0.55em;
}
.wp-block-post-title.swa-pf-small-60 small {
  font-size: 0.6em;
}
.wp-block-post-title.swa-pf-small-65 small {
  font-size: 0.65em;
}
.wp-block-post-title.swa-pf-small-70 small {
  font-size: 0.7em;
}
.wp-block-post-title.swa-pf-small-80 small {
  font-size: 0.8em;
}
.wp-block-post-title.swa-pf-small-85 small {
  font-size: 0.85em;
}
.wp-block-post-title.swa-pf-small-90 small {
  font-size: 0.9em;
}
/* Carousel arrows and dots (assets/js/carousel.js), as Elementor's: chevrons at the sides, centred; dots below. */
.swa-carousel-wrap {
  position: relative;
}
.swa-carousel-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  width: 25px;
  height: 25px;
  margin-top: -12.5px;
  padding: 0;
  border: 0;
  background: currentColor;
  color: inherit;
  cursor: pointer;
  -webkit-mask: var(--swa-mask-chevron) center / contain no-repeat;
  mask: var(--swa-mask-chevron) center / contain no-repeat;
  opacity: 0.9;
}
.swa-carousel-arrow--prev {
  left: 10px;
  transform: scaleX(-1);
}
.swa-carousel-arrow--next {
  right: 10px;
}
.swa-carousel-wrap:has(> .swa-carousel-arrows-out) .swa-carousel-arrow--prev {
  left: 0;
}
.swa-carousel-wrap:has(> .swa-carousel-arrows-out) .swa-carousel-arrow--next {
  right: 0;
}
.swa-carousel-dots-nav {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
}
.swa-carousel-dots-nav button {
  width: 6px;
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.2;
  cursor: pointer;
}
.swa-carousel-dots-nav button.is-active {
  opacity: 1;
}

/* Portfolio grids wider than their container (Hub row margin beyond the column padding). */
.swa-pf-grid[class*="swa-pf-bleed-"] {
  margin-left: calc(-1 * var(--swa-pf-bleed, 0px)) !important;
  margin-right: calc(-1 * var(--swa-pf-bleed, 0px)) !important;
  max-width: none;
  width: auto;
}
.swa-pf-bleed-5 {
  --swa-pf-bleed: 5px;
}
.swa-pf-bleed-10 {
  --swa-pf-bleed: 10px;
}
.swa-pf-bleed-15 {
  --swa-pf-bleed: 15px;
}
.swa-pf-bleed-20 {
  --swa-pf-bleed: 20px;
}
.swa-pf-bleed-25 {
  --swa-pf-bleed: 25px;
}
.swa-pf-bleed-30 {
  --swa-pf-bleed: 30px;
}
.swa-pf-bleed-40 {
  --swa-pf-bleed: 40px;
}
@media (max-width: 767px) {
  .swa-pf-bleed-m-0 {
    --swa-pf-bleed: 0px;
  }
  .swa-pf-bleed-m-5 {
    --swa-pf-bleed: 5px;
  }
  .swa-pf-bleed-m-10 {
    --swa-pf-bleed: 10px;
  }
  .swa-pf-bleed-m-15 {
    --swa-pf-bleed: 15px;
  }
  .swa-pf-bleed-m-20 {
    --swa-pf-bleed: 20px;
  }
  .swa-pf-bleed-m-25 {
    --swa-pf-bleed: 25px;
  }
  .swa-pf-bleed-m-30 {
    --swa-pf-bleed: 30px;
  }
  .swa-pf-bleed-m-40 {
    --swa-pf-bleed: 40px;
  }
}

/* Elementor rotate transform on a widget (swa-rot-N; inc/blocks.php sets --swa-rot). */
[class*="swa-rot-"] {
  transform: rotate(var(--swa-rot, 0deg));
}

/* The site's own carousel bar (HTML widget "custom-carousel-nav"): ← • → at the end, centred on tablets and phones. */
.swa-carousel-nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
  margin-top: 20px;
}
.swa-carousel-nav button {
  padding: 1px 6px;
  border: 0;
  background: none;
  color: var(--swa-cnav-color, #fff);
  font-size: 24px;
  line-height: normal;
  cursor: pointer;
  transition: color 0.3s ease;
}
.swa-carousel-nav button:hover {
  color: #0073ff;
}
.swa-carousel-nav__dot {
  color: #888;
  font-size: 24px;
}
@media (max-width: 1024px) {
  .swa-carousel-nav {
    justify-content: center;
  }
}

/* A page title added at the top (SEO spec) where Hub's title bar showed it: its size and spacing
   (bar padding 50px above the 60px title, 15px below it, then the content section's own padding). */
h1.swa-titlebar-h1 {
  margin: 45px 0 105px !important;
  font-size: 60px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.32px;
}
@media (max-width: 767px) {
  h1.swa-titlebar-h1 {
    font-size: 37px;
  }
}

/* Hub "icon block" buttons: the icon on its own line under the label (e.g. a "learn more" arrow). */
.wp-block-button.swa-btn-icon.swa-bi-block > .wp-block-button__link {
  flex-direction: column;
  min-width: 200px;
} /* Hub block-icon buttons are 200px wide */

/* Icon shapes at their own size around a narrow glyph (swa-ishape-N; inc/blocks.php sets the variables). */
.swa-icon.swa-icon--shape[class*="swa-ishape-"] {
  box-sizing: border-box;
  flex-shrink: 0;
  width: var(--swa-ishape);
  height: var(--swa-ishape);
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 767px) {
  .swa-icon.swa-icon--shape[class*="swa-ishape-m-"] {
    width: var(--swa-ishape-m);
    height: var(--swa-ishape-m);
  }
}

/* Text that never wraps (e.g. Hub counter digits). */
.swa-ws-nowrap {
  white-space: nowrap;
}

/* Carousels with a fractional number of slides per view (swa-cpv-d-N / swa-cpv-m-N, N = per view x 100) and
   the slider's own height when Hub's Flickity left room under the slides (swa-carousel-minh-N). */
.is-style-carousel[class*="swa-carousel-minh-"] {
  min-height: var(--swa-car-minh, auto);
}
@media (min-width: 782px) {
  .is-style-carousel.is-style-carousel[class*="swa-cpv-d-"] > * {
    flex-basis: calc(
      (100% - (var(--swa-cpv) - 1) * var(--swa-car-gap, 20px)) / var(--swa-cpv)
    );
  }
}
@media (max-width: 781px) {
  .is-style-carousel.is-style-carousel[class*="swa-cpv-m-"]:not(.swa-marquee)
    > * {
    flex-basis: calc(
      (100% - (var(--swa-cpv-m) - 1) * var(--swa-car-gap, 20px)) /
        var(--swa-cpv-m)
    );
  }
  .is-style-carousel[class*="swa-carousel-minh-m-"] {
    min-height: var(--swa-car-minh-m);
  }
}

/* Centred carousels (Hub cellAlign "center"; carousel.js centres the first slide on load). */
.is-style-carousel.swa-carousel-center > * {
  scroll-snap-align: center;
}
/* Grouped centring sits between snap points: no snapping there. */
.is-style-carousel.swa-carousel-center.swa-carousel-group {
  scroll-snap-type: none;
}

/* Logo-strip images that fill their slide on phones (fixed width on desktop). */
@media (max-width: 781px) {
  .wp-block-image.swa-img-m-fill,
  .wp-block-image.swa-img-m-fill img {
    width: 100% !important;
  }
}
/* Hub "middle align content": slides centred vertically on the strip. */
.is-style-carousel.swa-carousel-middle {
  align-items: center;
}

/* Phones: a stacked column's own bottom margin (Elementor mobile margin on a container). */
@media (max-width: 781px) {
  .swa-mb-m-5 {
    margin-bottom: 5px !important;
  }
  .swa-mb-m-10 {
    margin-bottom: 10px !important;
  }
  .swa-mb-m-15 {
    margin-bottom: 15px !important;
  }
  .swa-mb-m-20 {
    margin-bottom: 20px !important;
  }
  .swa-mb-m-25 {
    margin-bottom: 25px !important;
  }
  .swa-mb-m-30 {
    margin-bottom: 30px !important;
  }
  .swa-mb-m-40 {
    margin-bottom: 40px !important;
  }
  .swa-mb-m-50 {
    margin-bottom: 50px !important;
  }
  .swa-mb-m-60 {
    margin-bottom: 60px !important;
  }
  .swa-mb-m-80 {
    margin-bottom: 80px !important;
  }
  .swa-mb-m-100 {
    margin-bottom: 100px !important;
  }
}

/* Phones: images at a fixed height there (swa-imgh-m-N), cropped to fill it. */
@media (max-width: 781px) {
  .wp-block-image[class*="swa-imgh-m-"] img {
    height: var(--swa-imgh-m) !important;
    object-fit: cover;
  }
}

/* Hub fancy headings are inline-blocks: at least as wide as their longest word (swa-fh-ib). */
.swa-fh-ib {
  min-width: min-content;
}

/* Grids with unequal columns (swa-gtc-*; inc/blocks.php sets --swa-gtc), above the phone breakpoint. */
@media (min-width: 782px) {
  .is-layout-grid[class*="swa-gtc-"] {
    grid-template-columns: var(--swa-gtc) !important;
  }
}

/* Hub process box, icons variant (swa-steps--icons): the step's icon in a bordered circle (size, border, gap from
   the converter) with Hub's small black number badge at its top-left; title and text top-aligned beside it. */
.swa-steps--icons {
  counter-reset: swa-step;
}
.swa-steps--icons > .swa-step {
  align-items: flex-start;
  counter-increment: swa-step;
}
.swa-steps--icons .swa-step > .swa-step__icon {
  flex: 0 0 auto;
  position: relative;
  border-style: solid;
}
.swa-steps--icons .swa-step > .swa-step__icon::after {
  content: counter(swa-step);
  position: absolute;
  top: -2px;
  left: -2px;
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #f8f9fd;
  border-radius: 50%;
  background: #000;
  color: #fff;
  font-size: 11px;
  line-height: 1;
}

/* Hub list bullets (swa-lb-N): a solid round dot, not the ring icon. */
.wp-block-list[class*="swa-lb-"] > li::before {
  -webkit-mask: none;
  mask: none;
  border-radius: 50%;
}

/* Hub icon box text: a span directly in a paragraph is an inline-block (.iconbox .contents > p > span). */
.swa-ib-p > span {
  display: inline-block;
}

/* Phones: a section's own minimum height there (swa-mh-m-*), content placed as on the original. */
@media (max-width: 781px) {
  [class*="swa-mh-m-"] {
    min-height: var(--swa-mh-m);
  }
  .swa-m-vjust-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .swa-m-vjust-end {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
}

/* WordPress pads any paragraph with a background (1.25em 2.375em); the originals do not. Converted content sets
   its own padding when there is one (inline styles still win). */
.wp-block-post-content p.has-background {
  padding: 0;
}

/* WooCommerce products grid (Elementor Pro products widget, kept as Hub's card markup): 3 columns of cards with
   the add-to-cart bar over the image on hover; one column on phones with the bar under the image. */
.wp-block-list.products.elementor-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 20px;
  row-gap: 40px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wp-block-list.products.elementor-grid > li {
  margin: 0;
}
.products .ld-sp-img {
  position: relative;
  margin: 0 0 20px;
}
.products .ld-sp-img img {
  display: block;
  width: 100%;
  height: auto;
}
.products .ld-sp-add-to-cart {
  position: absolute;
  left: 17px;
  right: 17px;
  bottom: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 9.75px 13px;
  background: rgba(0, 0, 0, 0.9);
  color: #fff;
  font-size: 13px;
  line-height: 19.5px;
  font-weight: 700;
  letter-spacing: 2.405px;
  text-transform: uppercase;
  text-decoration: none;
  opacity: 0;
  transition: opacity 0.3s;
}
.products .ld-sp:hover .ld-sp-add-to-cart,
.products .ld-sp-add-to-cart:focus {
  opacity: 1;
}
.products .ld-sp-info {
  padding: 10px 1px 0 11px;
}
.products .ld-sp-info h3 {
  margin: 0;
  font-size: 16px;
  line-height: 21.328px;
  font-weight: 600;
}
.products .ld-sp-info h3 a {
  color: inherit;
  text-decoration: none;
}
.products .ld-sp-info .price {
  display: block;
  font-size: 14.4px;
  line-height: 27px;
  color: #191919;
}
@media (max-width: 767px) {
  .wp-block-list.products.elementor-grid {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 35px;
    margin: 0 -5px;
  }
  .wp-block-list.products.elementor-grid > li {
    padding: 0 5px;
  }
  .products .ld-sp-add-to-cart {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    margin-top: 13px;
    opacity: 1;
  }
  .wp-block-list.products.elementor-grid > li {
    text-align: center;
  }
}

/* Elementor "Order" start / end (swa-order-*, tablet swa-t-order-* from 1024px down, phones swa-m-order-*). */
.swa-order-start {
  order: -99999;
}
.swa-order-end {
  order: 99999;
}
@media (max-width: 1024px) {
  .swa-t-order-start {
    order: -99999;
  }
  .swa-t-order-end {
    order: 99999;
  }
}
@media (max-width: 767px) {
  .swa-m-order-start {
    order: -99999;
  }
  .swa-m-order-end {
    order: 99999;
  }
}

/* Centred buttons wider than the screen start at the left edge and run off the right, as on the live site
   (an overflowing inline button), instead of hanging off both sides. */
.wp-block-buttons.is-content-justification-center.is-layout-flex {
  justify-content: safe center;
}

/* Hub carousel item spacing (swa-csp-d-N / swa-csp-m-N): N px inside each side of every slide and the strip widened
   by N on both sides, as Flickity's viewport; a slide is then exactly 1 / (slides per view) of that width. */
@media (min-width: 782px) {
  .is-style-carousel.is-style-carousel[class*="swa-csp-d-"] {
    gap: 0;
    margin-inline: calc(-1 * var(--swa-csp));
  }
  .is-style-carousel.is-style-carousel[class*="swa-csp-d-"] > * {
    flex-basis: calc(100% / var(--swa-cpv, 1));
    padding-inline: var(--swa-csp);
    box-sizing: border-box;
  }
}
@media (max-width: 781px) {
  .is-style-carousel.is-style-carousel[class*="swa-csp-m-"]:not(.swa-marquee) {
    gap: 0;
    margin-inline: calc(-1 * var(--swa-csp-m));
  }
  .is-style-carousel.is-style-carousel[class*="swa-csp-m-"]:not(.swa-marquee)
    > * {
    flex-basis: calc(100% / var(--swa-cpv-m, 1));
    padding-inline: var(--swa-csp-m);
    box-sizing: border-box;
  }
}

/* Rows that line their items up differently on phones (Elementor justify-content, mobile): swa-m-row-center etc. */
@media (max-width: 767px) {
  .swa-m-row-center {
    justify-content: center !important;
  }
  .swa-m-row-start {
    justify-content: flex-start !important;
  }
  .swa-m-row-end {
    justify-content: flex-end !important;
  }
}

/* Hub icon boxes narrower than their content (0–10px wide widgets, swa-ov-min): the content overflows the box,
   centred on it, at its narrowest (min-content), as on the live site. */
.swa-ov-min {
  overflow: visible;
  align-items: center !important;
}
.swa-ov-min > * {
  flex: none;
  width: min-content !important;
  max-width: none !important;
}
.swa-ov-min,
.swa-ov-min * {
  overflow-wrap: normal !important;
  word-break: normal !important;
} /* narrowest = the longest word, not one letter */
@media (max-width: 767px) {
  [class*="swa-maxw-m-"] {
    max-width: var(--swa-maxw-m) !important;
  }
}

/* A video has no width of its own: in a column that centres its items it (and the group around it) would shrink to
   nothing. Fill the column, as Elementor's video widget does. */
.wp-block-swa-video {
  width: 100%;
  align-self: stretch;
}
:is(.is-layout-flex, .swa-col-flex)
  > .wp-block-group:has(> .wp-block-swa-video:only-child) {
  align-self: stretch;
  width: 100%;
}

/* Hub icon boxes whose description grows (swa-ib-grow): the boxes of a grid row share a height and the text column
   fills it, so each button sits at the bottom. */
.swa-ib-grow {
  align-self: stretch;
  box-sizing: border-box;
}
.is-layout-grid > .swa-ib-grow {
  height: 100%;
} /* the whole cell, as the live widget box */
.swa-ib-grow > .wp-block-group:last-child {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.swa-ib-grow > .wp-block-group:last-child > .swa-ib-p:last-of-type {
  flex-grow: 1;
}

/* Elementor containers never grow past their row for a long unbreakable line (min-width: 0): the same for
   groups placed side by side in a flex row. */
.is-layout-flex:not(.is-vertical) > .wp-block-group {
  min-width: 0;
}

/* Elementor Pro price table (swa-price-table): centred; features with a check before each, spaced as Elementor's
   list (15px, then 17px above each next item where its divider sits); the button 200px wide as measured. */
.swa-price-table {
  text-align: center;
}
.swa-price-table > * {
  margin-block: 0;
}
.wp-block-list.swa-pt-features {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 1;
}
.swa-pt-features > li {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 15px;
  margin: 0;
  padding-inline: 15px;
}
.swa-pt-features > li + li {
  margin-top: 15px;
  padding-top: 17px;
}
.swa-pt-features > li::before {
  content: "";
  flex: none;
  width: 13px;
  height: 13px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M173.9 439.4l-166.4-166.4c-10-10-10-26.2 0-36.2l36.2-36.2c10-10 26.2-10 36.2 0L192 312.7 432.1 72.6c10-10 26.2-10 36.2 0l36.2 36.2c10 10 10 26.2 0 36.2l-294.4 294.4c-10 10-26.2 10-36.2 0z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M173.9 439.4l-166.4-166.4c-10-10-10-26.2 0-36.2l36.2-36.2c10-10 26.2-10 36.2 0L192 312.7 432.1 72.6c10-10 26.2-10 36.2 0l36.2 36.2c10 10 10 26.2 0 36.2l-294.4 294.4c-10 10-26.2 10-36.2 0z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}
.swa-pt-btn .wp-block-button__link {
  min-width: 200px;
  text-decoration: none;
}

/* Inline code as on the live site (Bootstrap): pink on light pink, 90%, in the text's own font. */
:where(.wp-block-post-content, .entry-content) :not(pre) > code {
  padding: 2px 4px;
  font-family: inherit;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px;
}
/* The live site's CSS shows <del> as inline code too (no strike-through): authors use it for code lines. */
:where(.wp-block-post-content, .entry-content) del {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px;
  text-decoration: none;
}
/* The slider's arrow wrapper (added by carousel.js) is as wide as its place, never as wide as the strip of slides. */
.swa-carousel-wrap {
  min-width: 0;
  max-width: 100%;
}
.is-layout-flex > .swa-carousel-wrap {
  flex: 1 1 100%;
}

/* Icon lists with their items centred (swa-list-center; swa-list-m-center on phones only): as Elementor, each item
   stays full width and its icon and text sit together in the middle (the icon becomes the first flex item). */
.wp-block-list.swa-list-center:not(.swa-list-inline) > li {
  display: flex;
  justify-content: center;
  padding-left: 0;
}
.wp-block-list.swa-list-center:not(.swa-list-inline) > li::before {
  position: static;
  flex: none;
  margin: calc(0.5lh - var(--swa-list-icon-size, 16px) / 2)
    calc(var(--swa-list-indent, 28px) - var(--swa-list-icon-size, 16px)) 0 0;
}
@media (max-width: 767px) {
  .wp-block-list.swa-list-center > li,
  .wp-block-list.swa-list-m-center > li {
    display: flex;
    justify-content: center;
    padding-left: 0;
  }
  .wp-block-list.swa-list-center > li::before,
  .wp-block-list.swa-list-m-center > li::before {
    position: static;
    flex: none;
    margin: calc(0.5lh - var(--swa-list-icon-size, 16px) / 2)
      calc(var(--swa-list-indent, 28px) - var(--swa-list-icon-size, 16px)) 0 0;
  }
  .swa-fh-ib.swa-m-align-center {
    align-self: center;
    margin-left: auto;
    margin-right: auto;
  } /* a centred heading line in a column that lines items up at the left */
}

/* A right-aligned image in a column (Hub image "align right"): against the right edge, its own width, no float gap. */
:is(.swa-col-flex, .is-layout-flex) > .wp-block-image.alignright {
  width: fit-content;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: 0 !important;
  float: none;
}
/* Any featured image placed in the content with a fixed width shrinks to the column on phones, keeping its shape. */
.wp-block-post-content .wp-block-post-featured-image {
  max-width: 100%;
}
.wp-block-post-content .wp-block-post-featured-image[style*="width"] img {
  height: auto;
}

/* WooCommerce login: "Lost your password?" small and plain, as on the live site (Hub). */
.woocommerce .lost_password,
.woocommerce .lost_password a {
  font-size: 12px;
  color: #000;
}

/* Lists whose icon is a different size on phones (and so the text sits further in). */
@media (max-width: 767px) {
  .swa-li-icon-m-8 {
    --swa-list-icon-size: 8px;
  }
  .swa-li-icon-m-10 {
    --swa-list-icon-size: 10px;
  }
  .swa-li-icon-m-12 {
    --swa-list-icon-size: 12px;
  }
  .swa-li-icon-m-14 {
    --swa-list-icon-size: 14px;
  }
  .swa-li-icon-m-16 {
    --swa-list-icon-size: 16px;
  }
  .swa-li-icon-m-18 {
    --swa-list-icon-size: 18px;
  }
  .swa-li-icon-m-20 {
    --swa-list-icon-size: 20px;
  }
  .swa-li-icon-m-24 {
    --swa-list-icon-size: 24px;
  }
  .swa-li-indent-m-12 {
    --swa-list-indent: 12px;
  }
  .swa-li-indent-m-16 {
    --swa-list-indent: 16px;
  }
  .swa-li-indent-m-18 {
    --swa-list-indent: 18px;
  }
  .swa-li-indent-m-20 {
    --swa-list-indent: 20px;
  }
  .swa-li-indent-m-22 {
    --swa-list-indent: 22px;
  }
  .swa-li-indent-m-24 {
    --swa-list-indent: 24px;
  }
  .swa-li-indent-m-26 {
    --swa-list-indent: 26px;
  }
  .swa-li-indent-m-28 {
    --swa-list-indent: 28px;
  }
  .swa-li-indent-m-32 {
    --swa-list-indent: 32px;
  }
  .swa-li-indent-m-36 {
    --swa-list-indent: 36px;
  }
  .swa-li-indent-m-40 {
    --swa-list-indent: 40px;
  }
}
/* Exact list indents (quarter pixels, set by inc/blocks.php): desktop swa-lix-N, phones swa-lixm-N. */
.wp-block-list[class*="swa-lix-"] {
  --swa-list-indent: var(--swa-lix);
}
@media (max-width: 767px) {
  .wp-block-list.wp-block-list[class*="swa-lixm-"] {
    --swa-list-indent: var(--swa-lixm);
  }
}
/* A width-capped box with side margins fills what is left beside them (100% would overflow by the margins). */
[class*="swa-maxw-"][style*="margin-left"],
[class*="swa-maxw-"][style*="margin-right"] {
  width: -webkit-fill-available;
  width: stretch;
}
/* Phones: the widget's own rotate angle there (swa-rotm-N). */
@media (max-width: 767px) {
  [class*="swa-rotm-"] {
    transform: rotate(var(--swa-rot-m, 0deg));
  }
}
/* Bootstrap-look snippets that were coloured spans on Hub (not <code>): no padding or rounding. */
:where(.wp-block-post-content, .entry-content) :not(pre) > code.swa-code-span {
  padding: 0;
  border-radius: 0;
}
/* Hub's thin expander: a 16px icon option, and the space kept before it (swa-acc-gap-N). */
.swa-acc-icon-16 {
  --swa-acc-icon: 16px;
}
@media (max-width: 767px) {
  .swa-acc-icon-m-16 {
    --swa-acc-icon: 16px;
  }
}
.wp-block-accordion.swa-acc-ios[class*="swa-acc-gap-"]
  .wp-block-accordion-heading__toggle-icon {
  margin-inline-start: var(--swa-acc-gap);
}
.swa-acc-gap-4 {
  --swa-acc-gap: 4px;
}
.swa-acc-gap-8 {
  --swa-acc-gap: 8px;
}
.swa-acc-gap-10 {
  --swa-acc-gap: 10px;
}
.swa-acc-gap-12 {
  --swa-acc-gap: 12px;
}
.swa-acc-gap-15 {
  --swa-acc-gap: 15px;
}
.swa-acc-gap-16 {
  --swa-acc-gap: 16px;
}
.swa-acc-gap-20 {
  --swa-acc-gap: 20px;
}
.swa-acc-gap-24 {
  --swa-acc-gap: 24px;
}
.swa-acc-gap-30 {
  --swa-acc-gap: 30px;
}

/* swa/author-box: Hub's "Written By" box under a post (measured on the original). */
.swa-author-box {
  margin-top: 40px;
  padding: 50px 15px 30px;
}
.swa-author-box__heading {
  font-size: 22px;
  line-height: 29px;
  font-weight: 700;
  letter-spacing: -0.32px;
  margin: 16.5px 0 11px;
}
.swa-author-box__card {
  display: flex;
  gap: 30px;
  margin: 32px 0;
  padding: 48px 0;
  border-top: 1px solid #d8dbe2;
  border-bottom: 1px solid #d8dbe2;
}
.swa-author-box__photo {
  flex: 0 0 88px;
  margin: 0;
}
.swa-author-box__photo img {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  display: block;
}
.swa-author-box__info {
  flex: 1 1 auto;
  min-width: 0;
}
.swa-author-box__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 41px;
}
.swa-author-box__name {
  font-size: 19px;
  line-height: 28.5px;
  font-weight: 700;
  color: #181b31;
  margin: 0 0 12.35px;
}
.swa-author-box__name a {
  color: inherit;
  text-decoration: none;
}
.swa-author-box__all {
  display: none;
} /* in Hub's markup, hidden by the site's CSS */
.swa-author-box__bio {
  font-size: 16px;
  line-height: 1.32;
  margin: 0;
}
.swa-author-box__social {
  display: flex;
  gap: 12px;
  margin-top: 20px;
  align-items: center;
}
.swa-author-box__social a {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f5f5;
  color: #111;
  text-decoration: none;
}
@media (max-width: 767px) {
  .swa-author-box {
    margin: 30px 0;
    padding: 20px 0 30px;
  }
  .swa-author-box__card {
    flex-wrap: wrap;
    gap: 0;
  }
  .swa-author-box__photo {
    margin-bottom: 8px;
  }
  .swa-author-box__info {
    flex-basis: 100%;
  }
}

/* Code blocks: a light panel with syntax colours (Prism tokens, GitHub-like palette). */
.wp-block-code {
  background: #f6f8fa;
  border: 1px solid #e1e4e8;
  border-radius: 6px;
  padding: 16px 20px;
  overflow-x: auto;
  color: #24292e;
}
.wp-block-code code {
  display: block;
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 14px;
  line-height: 1.6;
  white-space: pre;
  tab-size: 4;
  background: none;
  padding: 0;
  color: inherit;
}
.wp-block-code .token.comment,
.wp-block-code .token.prolog,
.wp-block-code .token.doctype,
.wp-block-code .token.cdata {
  color: #6a737d;
  font-style: italic;
}
.wp-block-code .token.punctuation {
  color: #24292e;
}
.wp-block-code .token.tag,
.wp-block-code .token.selector,
.wp-block-code .token.keyword,
.wp-block-code .token.important,
.wp-block-code .token.delimiter {
  color: #d73a49;
}
.wp-block-code .token.attr-name,
.wp-block-code .token.property,
.wp-block-code .token.function,
.wp-block-code .token.class-name {
  color: #6f42c1;
}
.wp-block-code .token.string,
.wp-block-code .token.attr-value,
.wp-block-code .token.char,
.wp-block-code .token.regex {
  color: #032f62;
}
.wp-block-code .token.number,
.wp-block-code .token.boolean,
.wp-block-code .token.constant,
.wp-block-code .token.symbol,
.wp-block-code .token.variable {
  color: #005cc5;
}
.wp-block-code .token.operator,
.wp-block-code .token.entity,
.wp-block-code .token.url {
  color: #d73a49;
}
.wp-block-code .token.builtin,
.wp-block-code .token.inserted {
  color: #22863a;
}
.wp-block-code .token.deleted {
  color: #b31d28;
}
.wp-block-code .token.bold {
  font-weight: 600;
}
.wp-block-code .token.italic {
  font-style: italic;
}

/* Text links in body text: underlined so they read as links (not by colour alone), the line in the link's own
   colour, softened. Not in designed elements that set their own colours (link lists, cards, dark sections). */
:where(.wp-block-post-content)
  :is(p, li, td, th, dd, figcaption, blockquote):not(
    .has-text-color,
    .has-link-color,
    :is(.has-text-color, .has-link-color, .has-background) *
  )
  a:where(:not(.wp-element-button, .swa-icon__link)) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
}
:where(.wp-block-post-content)
  :is(p, li, td, th, dd, figcaption, blockquote):not(
    .has-text-color,
    .has-link-color,
    :is(.has-text-color, .has-link-color, .has-background) *
  )
  a:where(:not(.wp-element-button, .swa-icon__link)):hover {
  text-decoration-color: currentColor;
}

/* Image opacity from the original (swa-op-N = N%). */
.swa-op-5 {
  opacity: 0.05;
}
.swa-op-10 {
  opacity: 0.1;
}
.swa-op-15 {
  opacity: 0.15;
}
.swa-op-20 {
  opacity: 0.2;
}
.swa-op-25 {
  opacity: 0.25;
}
.swa-op-30 {
  opacity: 0.3;
}
.swa-op-35 {
  opacity: 0.35;
}
.swa-op-40 {
  opacity: 0.4;
}
.swa-op-45 {
  opacity: 0.45;
}
.swa-op-50 {
  opacity: 0.5;
}
.swa-op-55 {
  opacity: 0.55;
}
.swa-op-60 {
  opacity: 0.6;
}
.swa-op-65 {
  opacity: 0.65;
}
.swa-op-70 {
  opacity: 0.7;
}
.swa-op-75 {
  opacity: 0.75;
}
.swa-op-80 {
  opacity: 0.8;
}
.swa-op-85 {
  opacity: 0.85;
}
.swa-op-90 {
  opacity: 0.9;
}
.swa-op-95 {
  opacity: 0.95;
}
/* Hub headings set to "no wrap": one line from tablet up; on phones they wrap, with room between the lines. */
@media (min-width: 768px) {
  .swa-ws-nowrap-d {
    white-space: nowrap;
  }
}
@media (max-width: 767px) {
  .swa-ws-nowrap-d {
    line-height: 1.15 !important;
  }
}
/* Price table: per-feature icons (instead of the check) and Elementor's corner ribbon. */
.swa-pt-features.swa-pt-has-icons > li::before {
  display: none;
}
.swa-pt-features .swa-pt-icon {
  width: 16px;
  height: 16px;
  flex: none;
  object-fit: contain;
}
.swa-price-table {
  position: relative;
  overflow: hidden;
}
.swa-price-table > .swa-pt-ribbon {
  position: absolute;
  top: 20px;
  right: -40px;
  z-index: 1;
  width: 150px;
  margin: 0;
  padding: 4px 0;
  transform: rotate(45deg);
  background: #000;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.5px;
  text-align: center;
  text-transform: uppercase;
}
.swa-pt-cur {
  font-size: 0.32em;
  vertical-align: top;
  position: relative;
  top: 0.55em;
  margin-right: 3px;
}
/* Masonry galleries (assets/js/masonry.js places the images); natural image heights, no cropping. */
.wp-block-gallery.swa-gallery-masonry.is-masonry {
  position: relative;
  display: block !important;
}
.wp-block-gallery.swa-gallery-masonry.is-masonry > figure.wp-block-image {
  margin: 0 !important;
}
.wp-block-gallery.swa-gallery-masonry.is-masonry > figure.wp-block-image img {
  height: auto !important;
  object-fit: initial;
}
/* Portfolio cards with the title over the bottom of the image (Hub's absolute title), 20px in from the left. */
.swa-pf-card.swa-pf-title-over {
  display: grid;
  grid-template-columns: 100%;
  position: relative;
}
.swa-pf-title-over > .swa-pf-card__img {
  grid-area: 1 / 1;
}
.swa-pf-card.swa-pf-title-over > .swa-pf-card__title {
  grid-area: 1 / 1;
  align-self: end;
  z-index: 1;
  margin: 0 20px 16px;
}
/* Carousel arrows as set in Elementor: round chevron / round arrow icons, their size and colour. */
.swa-carousel-wrap:has(> [class*="swa-car-asz-"]) .swa-carousel-arrow {
  width: var(--swa-car-asz);
  height: var(--swa-car-asz);
  margin-top: calc(var(--swa-car-asz) / -2);
  opacity: 1;
}
.swa-carousel-wrap:has(> .swa-car-asz-30) {
  --swa-car-asz: 30px;
}
.swa-carousel-wrap:has(> .swa-car-asz-40) {
  --swa-car-asz: 40px;
}
.swa-carousel-wrap:has(> .swa-car-ico-chevron-circle) .swa-carousel-arrow {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm113.9 231L234.4 103.5c-9.4-9.4-24.6-9.4-33.9 0l-17 17c-9.4 9.4-9.4 24.6 0 33.9L285.1 256 183.5 357.6c-9.4 9.4-9.4 24.6 0 33.9l17 17c9.4 9.4 24.6 9.4 33.9 0L369.9 273c9.4-9.4 9.4-24.6 0-34z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm113.9 231L234.4 103.5c-9.4-9.4-24.6-9.4-33.9 0l-17 17c-9.4 9.4-9.4 24.6 0 33.9L285.1 256 183.5 357.6c-9.4 9.4-9.4 24.6 0 33.9l17 17c9.4 9.4 24.6 9.4 33.9 0L369.9 273c9.4-9.4 9.4-24.6 0-34z'/%3E%3C/svg%3E");
}
.swa-carousel-wrap:has(> .swa-car-ico-arrow-circle) .swa-carousel-arrow {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8c137 0 248 111 248 248S393 504 256 504 8 393 8 256 119 8 256 8zm-28.9 143.6l75.5 72.4H120c-13.3 0-24 10.7-24 24v16c0 13.3 10.7 24 24 24h182.6l-75.5 72.4c-9.7 9.3-9.9 24.8-.4 34.3l11 10.9c9.4 9.4 24.6 9.4 33.9 0L404.3 273c9.4-9.4 9.4-24.6 0-33.9L271.6 106.3c-9.4-9.4-24.6-9.4-33.9 0l-11 10.9c-9.5 9.6-9.3 25.1.4 34.4z'/%3E%3C/svg%3E");
}
.swa-carousel-wrap:has(> .swa-car-acol-ffffff) .swa-carousel-arrow {
  color: #fff;
}
.swa-carousel-wrap:has(> .swa-car-acol-000000) .swa-carousel-arrow {
  color: #000;
}
.swa-abs.swa-abs-cx {
  left: 50% !important;
  transform: translateX(-50%);
  max-width: 100%;
}

/* Product pages as on Hub: a title banner (the page's H1), thumbnails in a column left of the image, the name
   beside the image (H2, sized as before) and the share icons in a row. */
.swa-product-titlebar {
  padding-block: 50px;
  margin-bottom: 50px;
}
.swa-product-titlebar .wp-block-post-title {
  margin: 0;
  font-size: clamp(36px, calc(36px + 24 * (100vw - 390px) / 1050), 60px);
  font-weight: 600;
  line-height: 1;
}
.swa-product .summary h2.product_title {
  margin: 0 0 10px;
  font-size: 36px;
  font-weight: 700;
  line-height: 1;
}
@media (min-width: 768px) {
  .swa-product .woocommerce-product-gallery {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    column-gap: 45px;
    align-items: start;
  }
  .swa-product
    .woocommerce-product-gallery
    > .woocommerce-product-gallery__trigger {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    z-index: 2;
  }
  .swa-product .woocommerce-product-gallery > .flex-viewport,
  .swa-product
    .woocommerce-product-gallery
    > .woocommerce-product-gallery__wrapper {
    grid-column: 2;
    grid-row: 1;
  }
  .swa-product .woocommerce-product-gallery .flex-control-thumbs {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
  }
  .swa-product .woocommerce-product-gallery .flex-control-thumbs li {
    width: 70px !important;
    float: none !important;
    margin: 0 !important;
  }
}
.swa-share {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 15px 0 0;
  padding: 0;
  list-style: none;
}
.swa-share li {
  margin: 0;
}
.swa-share a {
  color: #000;
  display: inline-flex;
}
@media (max-width: 767px) {
  .swa-lh-m-safe {
    line-height: 1.1 !important;
  }
}
@media (max-width: 767px) {
  [class*="swa-fsm-"] {
    font-size: var(--swa-fs-m) !important;
  }
}

/* Card Container */
.swa-card.swa-fbox {
  position: relative;
  overflow: hidden;
  height: 100%;
}

/* Image Wrapper - Full Card Height */
.swa-card.swa-fbox .swa-fbox__img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  z-index: 0;
}

/* Image - Cover Entire Card */
.swa-card.swa-fbox .swa-fbox__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Gradient Overlay */
.swa-card.swa-fbox .swa-fbox__shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* Keep Icon and Heading Above Image */
.swa-card.swa-fbox > .swa-icon,
.swa-card.swa-fbox > .wp-block-heading {
  position: relative;
  z-index: 2;
}

/* Keep Card Link Clickable */
.swa-card.swa-fbox > .swa-card-link {
  position: absolute;
  inset: 0;
  z-index: 3;
}