/* ==========================================================================
   BLEND — Container model
   Faithful re-implementation of Elementor's flexbox container (.e-con).
   Verified against the live site: default padding 10px, default gap 20px,
   boxed containers centre a 1140px inner, child containers flex:1 1 0.
   ========================================================================== */

.con{
  position:relative;
  display:flex;
  flex-direction:column;
  align-content:flex-start;
  gap:var(--con-gap);
  width:100%;
  padding:var(--con-padding);
  min-width:0;
}

.con--row{ flex-direction:row; }

/* boxed container: full-bleed background, 1140px centred content */
.con--boxed > .con__inner{
  display:flex;
  flex-direction:inherit;
  gap:inherit;
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  min-width:0;
}
.con--boxed{ gap:var(--con-gap); }
.con--boxed > .con__inner{ flex-direction:column; flex:1 1 auto; justify-content:inherit; align-items:stretch; }
.con--boxed.con--row > .con__inner{ flex-direction:row; }

/* nested containers share the row space equally unless given a width */
.con > .con,
.con__inner > .con{ flex:1 1 0%; min-width:0; }

/* widgets */
.w{ position:relative; width:100%; min-width:0; }
.w__in{ display:block; }

/* full-viewport sections */
.section-vh{ min-height:100vh; }

/* visibility helpers mirroring elementor-hidden-* */
@media (min-width:768px) and (max-width:1024px){ .hide-tablet{ display:none !important; } }
@media (max-width:767px) { .hide-mobile{ display:none !important; } }
@media (min-width:1025px){ .hide-desktop{ display:none !important; } }

/* background overlay used by Elementor containers */
.con__overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
}
