.elementor .woc-opportunity-card{background-color:#ffffff00;flex-direction:column;/* =========================================================
 WORLD OF COFFEE — DYNAMIC OPPORTUNITY CARD
 Image, title and description all remain dynamic
 ========================================================= */

selector {
width: 100%;
height: 100%;
}

.woc-opportunity-card {
--woc-dark: #063f3d;
--woc-orange: #ed8124;
--woc-white: #ffffff;

position: relative;
display: flex;
flex-direction: column;
width: 100%;
max-width: 481px;
min-height: 602px;
margin: 0 auto;
overflow: visible;
background: transparent !important;
transition: transform 0.35s ease;
}

.woc-opportunity-card:hover {
transform: translateY(-7px);
}

/* =========================================================
 REMOVE ELEMENTOR DEFAULT SPACING
 ========================================================= */

.woc-opportunity-card > .e-con-inner {
display: flex;
flex: 1;
flex-direction: column;
width: 100%;
max-width: none;
padding: 0 !important;
gap: 0 !important;
background: transparent !important;
}

.woc-opportunity-card,
.woc-opportunity-card > .e-con-inner,
.woc-opportunity-content,
.woc-opportunity-content > .e-con-inner {
border: 0 !important;
box-shadow: none !important;

}

/* =========================================================
 DYNAMIC FEATURED IMAGE
 ========================================================= */

.woc-opportunity-image {
position: relative;
z-index: 2;
display: block;
width: 100%;
height: 326px;
margin: 0;
overflow: hidden;

clip-path: polygon(
  0% 17%,
  2% 12%,
  6% 7%,
  13% 4%,
  22% 2%,
  34% 3%,
  48% 6%,
  64% 9%,
  79% 13%,
  90% 18%,
  97% 24%,
  100% 31%,
  100% 100%,
  0% 100%
);
}

.woc-opportunity-image,
.woc-opportunity-image .elementor-widget-container,
.woc-opportunity-image a,
.woc-opportunity-image picture {
display: block;
width: 100%;
height: 326px;
}

.woc-opportunity-image img {
display: block;
width: 100%;
height: 326px;
margin: 0;
object-fit: cover;
object-position: center;
transition: transform 0.5s ease;
}

.woc-opportunity-card:hover .woc-opportunity-image img {
transform: scale(1.04);
}

/* =========================================================
 WHITE TITLE + DESCRIPTION SHAPE
 ========================================================= */

.woc-opportunity-content {
position: relative;
z-index: 3;
display: flex;
flex: 1;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 100%;
min-height: 245px;
margin-top: -1px;
padding: 52px 36px 58px;
overflow: hidden;

text-align: center;

/*
 * This creates the wide curved bottom from the design.
 */
clip-path: polygon(
  0% 0%,
  100% 0%,
  100% 66%,
  99% 73%,
  97% 80%,
  93% 86%,
  87% 91%,
  79% 95%,
  69% 98%,
  58% 99.5%,
  50% 100%,
  42% 99.5%,
  31% 98%,
  21% 95%,
  13% 91%,
  7% 86%,
  3% 80%,
  1% 73%,
  0% 66%
);
}

/*
 * Creates the very soft curved transition between
 * the image and the white text area.
 */
.woc-opportunity-content::before {
content: "";
position: absolute;
z-index: -1;
top: -34px;
left: -4%;
width: 108%;
height: 70px;
background: var(--woc-white);
border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

/* Elementor inner container */
.woc-opportunity-content > .e-con-inner {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: none;
padding: 0 !important;
gap: 0 !important;
background: transparent !important;
}

/* =========================================================
 DYNAMIC POST TITLE
 ========================================================= */

.woc-opportunity-title {
position: relative;
z-index: 2;
width: 100%;
margin: 0 0 18px;
padding: 0;
}

.woc-opportunity-title .elementor-heading-title,
.woc-opportunity-title .elementor-heading-title a,
.woc-opportunity-title a {
display: block;
margin: 0;
padding: 0;
color: var(--woc-orange);
font-family: "OnehungaSans", Arial, sans-serif;
font-size: 36px;
font-weight: 500;
line-height: 1;
text-align: center;
text-decoration: none;
text-transform: uppercase;
}

/* =========================================================
 DYNAMIC POST EXCERPT
 ========================================================= */

.woc-opportunity-description {
position: relative;
z-index: 2;
width: 100%;
margin: 0;
padding: 0;
}

.woc-opportunity-description,
.woc-opportunity-description .elementor-widget-container,
.woc-opportunity-description p {
margin: 0;
color: var(--woc-dark);
font-family: Arial, sans-serif;
font-size: 20px;
font-weight: 400;
line-height: 1.28;
text-align: center;
}

.woc-opportunity-description p:last-child {
margin-bottom: 0;
}

/* =========================================================
 LOOP CAROUSEL FIXES
 ========================================================= */

.elementor-loop-container .swiper-slide {
height: auto;
}

.elementor-loop-container .swiper-slide > .elementor-element {
height: 100%;
}

.elementor-loop-container .swiper-slide .woc-opportunity-card {
height: 100%;
}

/* =========================================================
 TABLET
 ========================================================= */

@media (max-width: 1024px) {
.woc-opportunity-card {
  max-width: 420px;
  min-height: 535px;
}

.woc-opportunity-image,
.woc-opportunity-image .elementor-widget-container,
.woc-opportunity-image a,
.woc-opportunity-image picture,
.woc-opportunity-image img {
  height: 285px;
}

.woc-opportunity-content {
  min-height: 220px;
  padding: 46px 28px 52px;
}

.woc-opportunity-title {
  margin-bottom: 15px;
}

.woc-opportunity-title .elementor-heading-title,
.woc-opportunity-title .elementor-heading-title a,
.woc-opportunity-title a {
  font-size: 31px;
}

.woc-opportunity-description,
.woc-opportunity-description .elementor-widget-container,
.woc-opportunity-description p {
  font-size: 18px;
}
}

/* =========================================================
 MOBILE
 ========================================================= */

@media (max-width: 767px) {
.woc-opportunity-card {
  max-width: 360px;
  min-height: 480px;
}

.woc-opportunity-image,
.woc-opportunity-image .elementor-widget-container,
.woc-opportunity-image a,
.woc-opportunity-image picture,
.woc-opportunity-image img {
  height: 245px;
}

.woc-opportunity-content {
  min-height: 195px;
  padding: 40px 22px 46px;
}

.woc-opportunity-title {
  margin-bottom: 13px;
}

.woc-opportunity-title .elementor-heading-title,
.woc-opportunity-title .elementor-heading-title a,
.woc-opportunity-title a {
  font-size: 28px;
}

.woc-opportunity-description,
.woc-opportunity-description .elementor-widget-container,
.woc-opportunity-description p {
  font-size: 16px;
}\n}