/*
 Theme Name: Hello SowasVon
 Theme URI: https://sowasvon.com/
 Description: Child theme of Hello Biz for SowasVon site
 Author: SowasVon
 Template: hello-biz
 Version: 1.0.0
 Text Domain: hello-sowasvon
*/
@media (max-width: 768px){
  body{
  }
}


.forminator-radio-label {
  word-break: break-all;
}

.elementor-button.elementor-button-link, .elementor-button {
	transition: .3s;
}

.elementor-button.elementor-button-link:hover, .elementor-button:hover {
  background-color: #B77E00 !important;
  color: inherit !important;
}

.elementor-button.elementor-button-link:active, .elementor-button:active {
	background-color: #8F6304 !important;
}


.black-but .elementor-button.elementor-button-link:hover {
  background-color: #000 !important;
  color: #fff !important;
}

.black-but .elementor-button.elementor-button-link:active {
  color: #000 !important;
  background-color: #fff !important;
}

footer .elementor-button-text {
	text-transform: uppercase;
}

.bold {
  font-weight: 700 !important;
}
.semibold {
  font-weight: 600 !important;
}


.elementor-element .swiper .elementor-swiper-button svg, .elementor-element .swiper ~ .elementor-swiper-button svg, .elementor-lightbox .swiper .elementor-swiper-button svg, .elementor-lightbox .swiper ~ .elementor-swiper-button svg {
  fill: hsla(0, 0%, 33.7%, 0.9) !important;
	height: 1em;
	width: 1em;
}

.elementor-nav-menu__container a {
	line-height: 1.5 !important;
}

.dynamic-hover-menu .menu-item.current-menu-parent .elementor-item::before, .dynamic-hover-menu .current-menu-item .elementor-item::before {
	content: "";
	display: inline-block;
	width: 22px;
	height: 20px;
	margin-left: -35px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='22' viewBox='0 0 28 22' fill='none'><path d='M0.734863 20.4429L9.85707 10.5605L0.734863 0.678098' stroke='%23F5A800' stroke-width='2'/><path d='M17.459 20.4429L26.5812 10.5605L17.459 0.678098' stroke='%23F5A800' stroke-width='2'/></svg>");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
	opacity: 1 !important;
}

.has-submenu svg {
  transition: .3s;
}

.has-submenu.highlighted svg {
	fill: var( --e-global-color-primary );
	transform: rotate(90deg);
}

.menu-item-object-page.current-menu-item svg {
	fill: var( --e-global-color-primary );
}

#menu-2-deda44c {
	padding-left: 20px;
}

#menu-image-target {
	height: 100%;
}

#menu-image-target img {
    transition: opacity 0.4s ease-in-out !important;
    opacity: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#menu-image-target img.is-switching {
    opacity: 0;
}

.sub-menu.elementor-nav-menu--dropdown a {
  font-size: 17px !important;
  padding: 5px 40px !important;
}

.pixeled-border-after {
  position: relative;
}
.pixeled-border-after::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 29px !important;
    background-image: url('data:image/svg+xml;utf8,<svg width="1727" height="29" viewBox="0 0 1727 29" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="31.1261" height="29" fill="%23C6C7C9"/><rect x="30.1211" width="31.1261" height="29" fill="%23122330"/><rect x="61.25" width="26.1058" height="29" fill="%2358585A"/><rect x="87.3555" width="175.712" height="29" fill="%239D9B9B"/><rect x="263.066" width="29.118" height="29" fill="%2358585A"/><rect x="292.184" width="87.3539" height="29" fill="%239D9B9B"/><rect x="379.535" width="87.3539" height="29" fill="%2358585A"/><rect x="466.891" width="29.118" height="29" fill="%239D9B9B"/><rect x="496.008" width="29.118" height="29" fill="%2358585A"/><rect x="525.129" width="29.118" height="29" fill="%23C6C7C9"/><rect x="553.242" width="58.2359" height="29" fill="%2358585A"/><rect x="611.477" width="29.118" height="29" fill="%23C6C7C9"/><rect x="668.711" width="29.118" height="29" fill="%23C6C7C9"/><rect x="957.879" width="29.118" height="29" fill="%23C6C7C9"/><rect x="985.996" width="29.118" height="29" fill="%239D9B9B"/><rect x="1333.4" width="29.118" height="29" fill="%2358585A"/><rect x="1015.11" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1305.29" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1362.52" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1391.64" width="59.24" height="29" fill="%239D9B9B"/><rect x="1507.11" width="146.594" height="29" fill="%2358585A"/><rect x="1450.88" width="28.1139" height="29" fill="%2358585A"/><rect x="1681.81" width="46.1871" height="29" fill="%2358585A"/><rect x="1478.99" width="28.1139" height="29" fill="%23C6C7C9"/><rect x="1653.7" width="28.1139" height="29" fill="%23122330"/><rect x="1043.23" width="29.118" height="29" fill="%2321263D"/><rect x="1072.34" width="29.118" height="29" fill="%23F5A800"/><rect x="1101.46" width="116.472" height="29" fill="%2358585A"/><rect x="1217.93" width="30.122" height="29" fill="%239D9B9B"/><rect x="1248.05" width="57.2318" height="29" fill="%2358585A"/><rect x="639.59" width="29.118" height="29" fill="%2358585A"/><rect x="696.824" width="29.118" height="29" fill="%2358585A"/><rect x="928.762" width="29.118" height="29" fill="%2358585A"/><rect x="725.941" width="58.2359" height="29" fill="%23C6C7C9"/><rect x="783.172" width="58.2359" height="29" fill="%2358585A"/><rect x="841.41" width="87.3539" height="29" fill="%239D9B9B"/></svg>');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
}
.pixeled-border-before::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 29px !important;
    background-image: url('data:image/svg+xml;utf8,<svg width="1727" height="29" viewBox="0 0 1727 29" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="31.1261" height="29" fill="%23C6C7C9"/><rect x="30.1211" width="31.1261" height="29" fill="%23122330"/><rect x="61.25" width="26.1058" height="29" fill="%2358585A"/><rect x="87.3555" width="175.712" height="29" fill="%239D9B9B"/><rect x="263.066" width="29.118" height="29" fill="%2358585A"/><rect x="292.184" width="87.3539" height="29" fill="%239D9B9B"/><rect x="379.535" width="87.3539" height="29" fill="%2358585A"/><rect x="466.891" width="29.118" height="29" fill="%239D9B9B"/><rect x="496.008" width="29.118" height="29" fill="%2358585A"/><rect x="525.129" width="29.118" height="29" fill="%23C6C7C9"/><rect x="553.242" width="58.2359" height="29" fill="%2358585A"/><rect x="611.477" width="29.118" height="29" fill="%23C6C7C9"/><rect x="668.711" width="29.118" height="29" fill="%23C6C7C9"/><rect x="957.879" width="29.118" height="29" fill="%23C6C7C9"/><rect x="985.996" width="29.118" height="29" fill="%239D9B9B"/><rect x="1333.4" width="29.118" height="29" fill="%2358585A"/><rect x="1015.11" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1305.29" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1362.52" width="29.118" height="29" fill="%23C6C7C9"/><rect x="1391.64" width="59.24" height="29" fill="%239D9B9B"/><rect x="1507.11" width="146.594" height="29" fill="%2358585A"/><rect x="1450.88" width="28.1139" height="29" fill="%2358585A"/><rect x="1681.81" width="46.1871" height="29" fill="%2358585A"/><rect x="1478.99" width="28.1139" height="29" fill="%23C6C7C9"/><rect x="1653.7" width="28.1139" height="29" fill="%23122330"/><rect x="1043.23" width="29.118" height="29" fill="%2321263D"/><rect x="1072.34" width="29.118" height="29" fill="%23F5A800"/><rect x="1101.46" width="116.472" height="29" fill="%2358585A"/><rect x="1217.93" width="30.122" height="29" fill="%239D9B9B"/><rect x="1248.05" width="57.2318" height="29" fill="%2358585A"/><rect x="639.59" width="29.118" height="29" fill="%2358585A"/><rect x="696.824" width="29.118" height="29" fill="%2358585A"/><rect x="928.762" width="29.118" height="29" fill="%2358585A"/><rect x="725.941" width="58.2359" height="29" fill="%23C6C7C9"/><rect x="783.172" width="58.2359" height="29" fill="%2358585A"/><rect x="841.41" width="87.3539" height="29" fill="%239D9B9B"/></svg>');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
}



/* Mobile & Tablet */
@media (max-width: 1024px) {
    .vorteile-slider-parent {
        display: block !important;
    }

    .slick-track {
        display: flex !important;
    }

    .pixeled-border-before::before, .pixeled-border-after::after {
      height: 20px !important;
    }
}

/* 1. Base Arrow Style - Cleaning up the 'fuck-up' backgrounds */
.vorteile-slider-parent .slick-arrow {
    font-size: 0;
    line-height: 0;
    color: transparent;
    background-color: transparent !important; /* Force no background color */
    border: none !important;
    outline: none !important; /* Removes the blue box on click */
    box-shadow: none !important;
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 50px;
    padding: 0;
    display: block;
    opacity: 0.6; /* Default state slightly faded */
    transition: all 0.3s ease; /* Smooth transition for everything */
    -webkit-tap-highlight-color: transparent; /* Fix for mobile blue tap highlight */
}

/* 2. Left Arrow SVG */
.vorteile-slider-parent .slick-prev {
    left: 0px;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='25' viewBox='0 0 16 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.7299 1L1.52994 12.4L14.7299 23.8' stroke='%23122330' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* 3. Right Arrow SVG */
.vorteile-slider-parent .slick-next {
    right: 0px;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='25' viewBox='0 0 16 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.2701 1L14.4701 12.4L1.2701 23.8' stroke='%23122330' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* 4. Hover & Active States */
.vorteile-slider-parent .slick-arrow:hover,
.vorteile-slider-parent .slick-arrow:focus {
    opacity: 1; /* Full visibility on hover */
    background-color: transparent !important;
}

.vorteile-slider-parent .slick-prev:hover {
    transform: translateY(-50%) translateX(-3px); /* Slight nudge left */
}

.vorteile-slider-parent .slick-next:hover {
    transform: translateY(-50%) translateX(3px); /* Slight nudge right */
}

/* 5. Clean up for Desktop */
@media (min-width: 1025px) {
    .vorteile-slider-parent .slick-arrow {
        display: none !important;
    }
}

/* ==================================================
   1. LAYOUT & FLEXBOX (CENTERED CARDS 3 & 2)
   ================================================== */
/* Makes the radio groups wrap and center the bottom row automatically */
.forminator-row.forminator-action-buttons {
	display: none;
}

.forminator-pagination-steps {
	display: none;
}

.forminator-field-radio .forminator-field {
	display: flex;
	gap: 50px 75px;
	flex-wrap: wrap;
}

.small-radios-ico .forminator-field-radio .forminator-field {
	gap: 50px;
}

.forminator-radio input {
	display: none;
}


.forminator-radio-group {
    display: flex !important;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 40px;
}

.forminator-row {
	display: flex;
	justify-content: space-between;
  margin-bottom: 15px;
}
.forminator-col-6 {
	width: 48%;
}
.forminator-col-12 {
	width: 100%;
}
.forminator-field-textarea .forminator-label {
  font-family: var( --e-global-typography-text-font-family ), Sans-serif;
  font-size: var( --e-global-typography-text-font-size );
  font-weight: var( --e-global-typography-text-font-weight );
  line-height: var( --e-global-typography-text-line-height );
  font-style: normal;
  text-transform: none;
  margin-top: 10px;
}

#consent-1 .forminator-checkbox__wrapper {
	display: flex;
	align-items: end;
	gap: 10px;
}

body .forminator-consent__label a {
	color: #fff !important;
	text-decoration: underline !important;
}

.mecotec-hilfe {
	position: absolute;
	right: 0 !important;
	left: auto !important;
	top: 20px;
	width: 65px;
}

.forminator-pagination-footer [type="button"], .forminator-pagination-footer [type="submit"], .forminator-pagination-footer button {
  border: 1px solid #fbfbfb;
}
/* ==================================================
   2. THE CARD DESIGN (Standard State)
   ================================================== */
.forminator-radio {
    flex: 0 1 calc(33.333% - 50px); /* 3 cards per row */
    min-width: 150px;
    min-height: 210px;
    border: 1px solid #121E28 !important; /* 1px Dark Border */
    box-shadow: 0 0 1px 1px #fff0;
    padding: 20px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: transparent !important;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.image-radios .forminator-radio {
	padding: 5px !important;
	border: none !important;
}

.small-radios-ico .forminator-radio {
  min-height: 150px;
  flex: 0 1 calc( 20% - 40px );
}

.small-radios-ico .forminator-radio img {
	width: 50px;
	height: 40px;
	object-fit: contain;
}
/* Hide standard Forminator radio circles */
.forminator-radio-bullet {
    display: none !important;
}

/* Image styling inside the card */
.forminator-radio-image {
    margin-bottom: 15px !important;
}
.forminator-radio-image img {
    max-height: 120px; /* Adjust based on your icons/images */
    object-fit: contain;
}

/* Text styling inside the card */
.forminator-radio-label {
    color: #121E28 !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 16px !important;
    word-break: break-word;
    order: 2;
    line-height: 1.4;
}
#forminator-field-radio-7-label-2 .forminator-radio-label {
	word-break: normal;
}

.forminator-button.forminator-button-back {
	background: #00000008;
}

/* ==================================================
   3. DESIGNER LOGIC (Hover, Click, Checked)
   ================================================== */
/* Hover -> Thicker border */
/* 1. Hover State (Existing dark thin border) */
.forminator-radio:hover {
    box-shadow: 0 0 0 1px #121E28;
    transition: all 0.3s ease;
}

/* 2. The "Millisecond" Click (Active State -> White border) */
.forminator-radio:active {
    box-shadow: 0 0 0 2px #fff !important;
    border-color: #fff !important;
}

/* 3. Selected (Checked) -> Thick Dark Contour */
/* We use a 3px box-shadow or border to make it "thick" */
.forminator-radio.forminator-is_checked {
    box-shadow: 0 0 0 3px #121E28 !important;
    border: 1px solid #121E28 !important;
    background: rgba(18, 30, 40, 0.05) !important;
}

/* Keep the text bold when selected */
.forminator-radio.forminator-is_checked .forminator-radio-label {
    font-weight: bold !important;
    color: #121E28 !important;
}

/* Optional: Ensure the radio circle inside also matches or disappears if you're using 'Tile' mode */
.forminator-radio.forminator-is_checked .forminator-radio-bullet {
    border-color: #121E28 !important;
}
/* --- SCOPED LOGIC FOR IMAGE ONLY --- */

/* 1. Hover -> Image gets thin border */
.only-image-border .forminator-radio:hover .forminator-radio-image {
    box-shadow: 0 0 0 1px #121E28;
    transition: all 0.3s ease;
}

/* 2. Active -> Image gets white flash */
.only-image-border .forminator-radio:active .forminator-radio-image {
    box-shadow: 0 0 0 2px #fff !important;
    border-color: #fff !important;
}

/* 3. Checked -> Image gets thick dark contour */
.only-image-border .forminator-radio.forminator-is_checked .forminator-radio-image {
    box-shadow: 0 0 0 3px #121E28 !important;
    border: 1px solid #121E28 !important;
}

/* 4. Remove borders from the main container so they don't double up */
.only-image-border .forminator-radio {
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
}

/* 5. Keep text bold when selected (even if outside the border) */
.only-image-border .forminator-radio.forminator-is_checked .forminator-radio-label {
    font-weight: bold !important;
    color: #121E28 !important;
}

/* 6. Ensure image is block so it stays separate from text */
.only-image-border .forminator-radio-image {
    display: block;
    margin-bottom: 10px;
}

.only-image-border img {
  height: 100% !important;
	width: auto;
	object-fit: cover;
}

.multiple-require .forminator-required {
  display: none;
}
/* ==================================================
   4. CHECKBOXES (Step 4 - The "X" Boxes)
   ================================================== */
.forminator-checkbox-group {
    display: flex !important;
    flex-direction: column;
    gap: 15px;
}
.forminator-checkbox {
	display: flex !important;
	align-items: center;
	margin-bottom: 30px !important;
	cursor: pointer;
	margin-top: 40px;
}
/* The square box */
.forminator-checkbox-box {
    width: 35px !important;
    height: 35px !important;
    border: 1px solid #121E28 !important;
    background: transparent !important;
    border-radius: 0 !important;
    margin-right: 15px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
/* The "X" when checked */
.forminator-checkbox.forminator-is_checked .forminator-checkbox-box::after {
    content: "X";
    font-size: 24px;
    font-family: sans-serif;
    color: #121E28;
    position: absolute;
}
/* Hide default check icon */
.forminator-checkbox-box[class^="forminator-icon-"] {
    display: none !important;
}
.forminator-checkbox-label {
    color: #121E28 !important;
    font-size: 16px !important;
}

/* ==================================================
   5. TEXT INPUTS & FINAL FORM (Step 5)
   ================================================== */
.forminator-input,
.forminator-textarea {
    background-color: #FFFFFF !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 15px 20px !important;
    color: #121E28 !important;
    font-family: inherit !important;
}
.forminator-input::placeholder,
.forminator-textarea::placeholder {
    color: #888888 !important;
}

.forminator-checkbox input {
	display: none;
}

/* ==================================================
   6. BUTTONS (Next, Back, Submit) & TITLES
   ================================================== */
/* Align buttons to the right */
.forminator-pagination-footer {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 15px;
    margin-top: 30px;
}

.forminator-button-next,
.forminator-button-submit {
    background-color: #121E28 !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 15px 40px !important;
    text-transform: uppercase;
    font-weight: 500 !important;
    letter-spacing: 1px;
}

/* Title text size */
.forminator-label {
    font-family: var( --e-global-typography-secondary-font-family ), Sans-serif;
    font-size: var( --e-global-typography-secondary-font-size );
    font-weight: var( --e-global-typography-secondary-font-weight );
    text-transform: var( --e-global-typography-secondary-text-transform );
    color: var( --e-global-color-f20d33f );
    letter-spacing: 1.5px;
    line-height: 1.4;
    margin-bottom: 25px !important;
    max-width: 50vw;
}

.forminator-description {
    font-family: var( --e-global-typography-dbead9a-font-family ), Sans-serif;
    font-size: var( --e-global-typography-dbead9a-font-size );
    font-weight: var( --e-global-typography-dbead9a-font-weight );
    color: var( --e-global-color-f20d33f );
    margin-bottom: 30px;
    margin-top: 10px;
    display: block;
}

@media(max-width: 950px){
  .forminator-field-radio .forminator-field, .small-radios-ico .forminator-field-radio .forminator-field {
  	gap: 15px;
  }
  .forminator-radio {
  	flex: 0 1 48%;
  }
  .forminator-label {
  	max-width: 100%;
  }
  .mecotec-hilfe {
  	top: -40px;
  	width: 35px;
  }
  .only-image-border img {
  	width: 100%;
  }
  .forminator-radio-label {
  	font-weight: bold;
    min-height: 60px;
  }
}
@media(max-width: 450px){
  .forminator-radio {
    min-width: 100%;
  }
  .forminator-pagination-footer {
  	flex-direction: column;
  }
}
@media(max-width: 768px){
  .forminator-field-radio .forminator-field {
  	display: grid;
  	grid-template-columns: 1fr 1fr;
  }
}


#meco-gallery-btn {
	font-family: "Roboto Condensed", Sans-serif;
	font-size: 22px;
	font-weight: 600;
	text-transform: uppercase;
	color: #000000;
  transition: .3s;
}
#meco-gallery-btn:hvoer {
  opacity: .9;
}


.leistung-icon-boxes .elementor-icon svg {
	width: 75px;
	height: 50px;
  margin-bottom: 30px;
}

.leistung-icon-boxes .elementor-icon-box-title {
	min-height: 50px;
	margin-bottom: 15px;
	display: flex;
	justify-content: center;
	align-items: start;
}


.projects-after-speech {
  position: relative;
}
.projects-after-speech::after {
	content: '' !important;
	display: block !important;
	position: absolute;
	bottom: -100px;
	width: 50px;
	height: 50px;
	border-right: 50px solid #ddd0;
	border-left: 50px solid #ddd0;
	border-bottom: 50px solid #ddd0;
	border-top: 50px solid #d0d0d0;
	left: calc( 50% - 50px );
  z-index: 2;
}
/* 1. The Wrapper that cuts off the gallery */
.meco-gallery-clip {
    max-height: 750px; /* Adjust this so exactly 2 rows show */
    overflow: hidden !important;
    position: relative;
    transition: max-height 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 2. When expanded */
.meco-gallery-clip.is-open {
    max-height: 5000px; /* Big enough to fit all 12 images */
}

/* 3. The Fade-Out Overlay (Matches your grey background) */
.meco-gallery-clip::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 150px;
    /* IMPORTANT: Change the RGB values to match your exact grey background */
    background: linear-gradient(to bottom, rgba(204,204,204,0) 0%, rgba(204,204,204,1) 100%);
    pointer-events: none;
    transition: opacity 0.4s ease;
}

/* 4. Hide overlay when expanded */
.meco-gallery-clip.is-open::after {
    opacity: 0;
}

/* 5. Give mobile a bit more height since columns stack */
@media (max-width: 768px) {
    .meco-gallery-clip {
        max-height: 1000px;
    }
}


.dark-with-ul ul {
  margin: 40px 0 30px 15px;
}
.dark-with-ul ul li {
  list-style: none;
  position: relative;
  margin-bottom: 30px;
  padding-left: 55px;
  font-weight: 600;
}
.dark-with-ul ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='6' cy='6' r='5' stroke='%23F5A800' stroke-width='2'/%3E%3C/svg%3E") no-repeat center;
  background-size: contain;
}

.dark-with-ul.plus-style ul li::before {
	background: url("data:image/svg+xml,%3Csvg width='45' height='45' viewBox='0 0 45 45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='22.4511' cy='22.4511' r='21.4511' stroke='%23F5A800' stroke-width='2'/%3E%3Cpath d='M22.8906 11.4459L22.8906 34.3372' stroke='white' stroke-width='2'/%3E%3Cline x1='34.3359' y1='23.0111' x2='11.4446' y2='23.0111' stroke='white' stroke-width='2'/%3E%3C/svg%3E") no-repeat center;
	background-size: 30px 30px;
	width: 100%;
	height: 100%;
  top: 0;
	left: 0;
	background-position: left center;
}

.dark-with-ul ul li ul {
  list-style: disc;
  margin: 10px 0 30px 35px;
}
.dark-with-ul ul li ul li {
	list-style: disc;
	padding-left: 4px;
	font-weight: 300;
	margin-bottom: 10px;
}
.dark-with-ul ul li ul li::before {
  display: none;
}

/* Numbered Style */
.nr-ul ul {
  counter-reset: nr-counter;
  margin: 40px 0 30px 15px;
}

.nr-ul ul li {
  list-style: none;
  position: relative;
  margin-bottom: 30px;
  padding-left: 70px; /* little more space for numbers */
  font-weight: 600;
  counter-increment: nr-counter;
}

.nr-ul ul li::before {
  content: counter(nr-counter, decimal-leading-zero) ".";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 36px; /* large numbers */
  font-weight: 300;
  color: #F5A800;
  line-height: 1;
}



/* Reset counter on accordion */
.e-n-accordion {
  counter-reset: acc-counter;
}

.e-n-accordion .e-n-accordion-item {
	counter-increment: acc-counter;
	padding: 20px 5px;
	border-bottom: 1px solid;
}

body .e-n-accordion-item-title {
	padding-left: 0 !important;
}

.e-n-accordion .e-n-accordion-item-title-text::before {
	content: counter(acc-counter, decimal-leading-zero) ".";
	margin-right: 5px;
	color: #F5A800;
	font-weight: 300;
	font-size: 36px;
}

.e-n-accordion-item-title-icon svg {
	fill: none !important;
}






/* 1. Hide every card from the 4th one onwards */
.meco-reports-wrapper > .e-con:nth-child(n+4) {
    display: none !important;
}

/* 2. When the button is clicked (JS adds this class), show them as flex containers */
.meco-reports-wrapper.is-expanded > .e-con:nth-child(n+4) {
    display: flex !important; /* Or block, but flex is usually right for Elementor containers */
    animation: fadeUpReport 0.5s ease-out forwards;
}

/* 3. Smooth entrance animation */
@keyframes fadeUpReport {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#meco-reports-btn, #meco-reports-btn h5 {
  color: #F5A800 !important;
	text-align: center;
	font-family: "Roboto Condensed";
	font-size: 24px !important;
	font-style: normal;
  font-weight: 700 !important;
	line-height: normal;
	letter-spacing: 2.616px;
	text-transform: uppercase !important;
}



/* Bio - Restrict the text height */
.meco-bio-text {
    max-height: 120px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* When expanded */
.meco-bio-text.is-open {
    max-height: 1500px; /* Large enough to fit the whole text */
}

/* Hide the fade-out when open */
.meco-bio-text.is-open::after {
    opacity: 0;
}

/* Make the read more text look like a clickable link */
.meco-bio-btn {
    cursor: pointer;
    display: inline-block;
    color: #F0B400; /* Your yellow */
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
}



.white-speech-after {
  position: relative;
}
.white-speech-after::after {
	display: block;
	content: " ";
	border-top: 45px solid #fff;
	border-left: 50px solid #0000;
	border-right: 50px solid #0000;
	border-bottom: 20px solid #0000;
	width: 100px;
	position: absolute;
	left: calc( 50% - 50px );
	right: calc( 50% - 50px );
  bottom: -62px;
	z-index: 2;
}




@media (max-width: 768px){
  .page-content .elementor-button span {
    text-align: center !important;
  }
}



/* --- STYLING THE BUTTON --- */
.mobile-read-more .read-more-toggle {
    display: block;
    text-align: center;
    color: #F3B329;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    margin-top: 15px;
}

.mobile-read-more .read-more-toggle:hover {
    color: #d89b1c; /* Slightly darker yellow on hover */
    text-decoration: none;
}

/* --- ENSURE IT IS MOBILE ONLY --- */
@media (min-width: 768px) {
    .mobile-read-more .more-text-wrapper {
        display: block !important;
    }
    /* Hide the button on desktop */
    .mobile-read-more .read-more-toggle {
        display: none !important;
    }
}