.gymful-featured-article {
  width: 100%;
}

.gfa-featured-card {
  --gfa-media-width: 52%;
  --gfa-card-min-height: 520px;
  --gfa-content-gap: 18px;
  position: relative;
  display: flex;
  width: 100%;
  min-height: var(--gfa-card-min-height);
  overflow: hidden;
  background: #F8F4ED;
  border-radius: 12px;
}

.gfa-layout-split_right .gfa-featured-card {
  flex-direction: row-reverse;
}

.gfa-layout-stacked .gfa-featured-card {
  flex-direction: column;
}

.gfa-media {
  position: relative;
  display: block;
  flex: 0 0 var(--gfa-media-width);
  min-height: var(--gfa-card-min-height);
  overflow: hidden;
  background: rgba(198,176,78,0.12);
  isolation: isolate;
  text-decoration: none !important;
  color: inherit;
}

.gfa-layout-stacked .gfa-media {
  flex-basis: auto;
  min-height: 420px;
}

.gfa-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: rgba(0,0,0,0.16);
}

.gfa-media img {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover;
  transform: scale(1.001);
  transition: transform 0.55s cubic-bezier(.22,1,.36,1);
}

.gfa-featured-card:hover .gfa-media img,
.gfa-featured-card:focus-within .gfa-media img {
  transform: scale(1.045);
}

.gfa-content {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--gfa-content-gap);
  padding: 48px 56px;
}

.gfa-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

.gfa-category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 8px 18px 7px;
  border: 1px solid #C6B04E;
  border-radius: 999px;
  font-family: "Cerebri Sans", sans-serif;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5A4B3F;
  text-decoration: none !important;
}

.gfa-reading-time {
  font-family: "Cerebri Sans", sans-serif;
  font-size: 12px;
  line-height: 1.25;
  font-weight: 400;
  color: #5A4B3F;
}

.gfa-title {
  margin: 0;
  max-width: 760px;
  font-family: "Alte Haas Grotesk", "AlteHaasGrotesk", sans-serif;
  font-size: clamp(34px, 4vw, 68px);
  line-height: 0.96;
  font-weight: 700;
  letter-spacing: -0.035em;
  color: #1F1712;
}

.gfa-title a {
  color: inherit !important;
  text-decoration: none !important;
}

.gfa-excerpt {
  max-width: 620px;
  font-family: "Cerebri Sans", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  font-weight: 400;
  color: #5A4B3F;
}

.gfa-button {
  --gfa-button-bg: transparent;
  --gfa-button-hover-bg: #C6B04E;
  --gfa-button-gap: 9px;
  align-self: flex-start;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gfa-button-gap);
  min-height: 0;
  padding: 13px 22px;
  border: 1px solid #C6B04E;
  border-radius: 999px;
  background: var(--gfa-button-bg);
  color: #1F1712 !important;
  font-family: "Cerebri Sans", sans-serif;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none !important;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.35s ease, color 0.35s ease, border-color 0.35s ease, background-color 0.35s ease;
}

.gfa-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--gfa-button-hover-bg, #C6B04E);
  clip-path: circle(0% at 0% 100%);
  transition: clip-path 0.55s cubic-bezier(.22, 1, .36, 1);
}

.gfa-button:hover,
.gfa-button:focus-visible {
  transform: translateY(-1px);
}

.gfa-button:hover::before,
.gfa-button:focus-visible::before {
  clip-path: circle(155% at 0% 100%);
}

.gfa-btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  color: currentColor;
  flex: 0 0 auto;
  overflow: visible;
  transition: transform 0.35s ease;
}

.gfa-button:hover .gfa-btn-icon,
.gfa-button:focus-visible .gfa-btn-icon {
  transform: translate(2px, -2px);
}

.gfa-btn-icon svg,
.gfa-btn-icon .e-font-icon-svg {
  display: block;
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  overflow: visible;
  color: currentColor;
}

.gfa-btn-icon .e-font-icon-svg,
.gfa-btn-icon .e-font-icon-svg * {
  fill: currentColor;
  stroke: none;
}

.gfa-btn-icon svg:not(.e-font-icon-svg) [fill]:not([fill="none"]) {
  fill: currentColor;
}

.gfa-btn-icon svg:not(.e-font-icon-svg) [fill="none"] {
  fill: none;
}

.gfa-btn-icon svg:not(.e-font-icon-svg) [stroke]:not([stroke="none"]) {
  stroke: currentColor;
}

.gfa-btn-icon i {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
}

@media (max-width: 1024px) {
  .gfa-featured-card,
  .gfa-layout-split_left .gfa-featured-card,
  .gfa-layout-split_right .gfa-featured-card {
    flex-direction: column;
    min-height: 0;
  }

  .gfa-media,
  .gfa-layout-stacked .gfa-media {
    flex-basis: auto;
    min-height: 360px;
  }

  .gfa-content {
    padding: 34px 28px;
  }
}

@media (max-width: 767px) {
  .gfa-media,
  .gfa-layout-stacked .gfa-media {
    min-height: 280px;
  }

  .gfa-content {
    padding: 28px 22px;
    gap: 14px;
  }

  .gfa-title {
    font-size: clamp(30px, 11vw, 46px);
  }

  .gfa-excerpt {
    font-size: 15px;
  }
}
