.fe-highlight {
  background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}

/* =====================================
   WHOPENGINE — REFERENCE STYLE HERO
===================================== */

.whop26-hero {
  position: relative;
  overflow: hidden;
  /* padding: 65px 0 85px; */
  text-align: center;

  /* background:
    radial-gradient(
      ellipse at 0% 70%,
      rgba(255, 150, 120, 0.12),
      transparent 38%
    ),
    radial-gradient(
      ellipse at 100% 15%,
      rgba(255, 199, 140, 0.13),
      transparent 40%
    ),
    #ffffff; */

  font-family: 'Inter', sans-serif;
}

/* .whop26-hero::before {
  content: "";
  position: absolute;
  inset: 0;

  background-image: radial-gradient(
    rgba(255, 155, 140, 0.15) 1px,
    transparent 1px
  );

  background-size: 24px 24px;
  opacity: 0.3;
  pointer-events: none;
} */

.whop26-hero .container {
  position: relative;
  z-index: 2;
}

/* TOP LABEL */

.whop26-top-label {
display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  margin-bottom: 0;
}

.whop26-label-line {
  width: 110px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #ff6469
  );
}

.whop26-label-line:last-child {
  transform: rotate(180deg);
}

.whop26-label-text {
  font-size: 24px;
  font-weight: 800;
  font-style: italic;
  letter-spacing: 0.4px;
  color: #202337;

  text-shadow: 2px 3px 0 rgba(255, 112, 95, 0.15);
}

/* MAIN HEADING */

.whop26-heading {
  max-width: 1180px;
  margin: 0 auto 20px;
  font-size: clamp(46px, 5.5vw, 76px);
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: -3px;
  color: #10121f;
}

.whop26-heading-line {
  display: block;
}

.whop26-heading-gradient {
  background: linear-gradient(
    90deg,
    #ff965b 0%,
    #ff6f62 48%,
    #ff4b70 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #ff6265;
}

.whop26-heading-underline {
  position: relative;
  display: inline-block;
  padding-bottom: 11px;
}

.whop26-heading-underline::after {
  content: "";
  position: absolute;

  left: 0;
  bottom: 3px;
  width: 100%;
  height: 4px;

  border-radius: 5px;

  background: linear-gradient(
    90deg,
    #ff985c,
    #ff536b
  );

  box-shadow: 0 3px 10px rgba(255, 90, 105, 0.12);
}

/* DIVIDER */

.whop26-divider {
display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin: 10px 0 10px;
}

.whop26-divider span {
  width: 115px;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    #ff7370
  );
}

.whop26-divider span:last-child {
  transform: rotate(180deg);
}

.whop26-divider i {
  font-style: normal;
  font-size: 20px;
  color: #202337;
  text-shadow: 2px 3px 0 rgba(255, 103, 100, 0.22);
}

/* SECONDARY HEADING */

.whop26-secondary-heading {
  max-width: 1120px;
  margin: 0 auto 27px;

  font-size: clamp(24px, 2.75vw, 26px);
  line-height: 1.5;
  letter-spacing: -1px;
  font-weight: 850;
  color: #202333;
}

.whop26-secondary-highlight {
  display: inline;
  color: #ff6266;
  font-weight: 900;

  text-decoration: underline;
  text-decoration-color: #ff8b75;
  text-decoration-thickness: 3px;
  text-underline-offset: 7px;
}

/* BENEFITS */

.whop26-benefits {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 13px;
  flex-wrap: wrap;
  margin: 25px 0 28px;
}

.whop26-benefit {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 9px 16px;
  border-radius: 100px;

  background: #ffffff;
  border: 1px solid #f5d9d2;

  box-shadow: 0 5px 15px rgba(255, 105, 90, 0.06);

  font-size: 15px;
  font-weight: 700;
  color: #263044;
}

.whop26-check {
  color: #ff6668;
  font-weight: 900;
}

/* DESCRIPTION */

.whop26-description {
  max-width: 1040px;
  margin: 0 auto 30px;

  font-size: 18px;
  line-height: 1.8;
  font-weight: 450;
  color: #50586a;
}

.whop26-description strong {
  font-weight: 850;
  color: #1f2638;
}

.whop26-description span {
  color: #f95e68;
  font-weight: 750;
}

/* CTA */

.whop26-cta-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.whop26-main-cta {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 13px;

  padding: 18px 30px;
  border-radius: 12px;

  background: linear-gradient(
    100deg,
    #ff995f,
    #ff5669
  );

  color: #ffffff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 850;

  box-shadow: 0 13px 28px rgba(255, 92, 105, 0.24);

  transition: all 0.3s ease;
}

.whop26-main-cta:hover {
  transform: translateY(-4px);
  color: #ffffff;
  box-shadow: 0 18px 35px rgba(255, 92, 105, 0.32);
}

.whop26-main-cta span {
  font-size: 23px;
}

/* TABLET */

@media (max-width: 991px) {
  .whop26-heading {
    font-size: 55px;
    letter-spacing: -2px;
  }

  .whop26-secondary-heading {
    font-size: 28px;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .whop26-hero {
    padding: 45px 0 60px;
  }

  .whop26-top-label {
    gap: 10px;
    margin-bottom: 28px;
  }

  .whop26-label-line {
    width: 35px;
  }

  .whop26-label-text {
    font-size: 16px;
  }

  .whop26-heading {
    font-size: clamp(36px, 8vw, 46px);
    line-height: 1.2;
    letter-spacing: -1.4px;
    margin-bottom: 22px;
  }

  .whop26-heading-underline {
    padding-bottom: 7px;
  }

  .whop26-heading-underline::after {
    height: 3px;
  }

  .whop26-divider {
    margin: 18px 0 23px;
    gap: 12px;
  }

  .whop26-divider span {
    width: 65px;
  }

  .whop26-secondary-heading {
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: -0.5px;
  }

  .whop26-secondary-highlight {
    text-decoration-thickness: 2px;
    text-underline-offset: 5px;
  }

  .whop26-benefits {
    gap: 8px;
  }

  .whop26-benefit {
    font-size: 12px;
    padding: 8px 12px;
  }

  .whop26-description {
    font-size: 16px;
    line-height: 1.75;
  }

  .whop26-main-cta {
    width: 100%;
    padding: 16px 15px;
    font-size: 15px;
    gap: 8px;
  }
}


/* =========================================
   WHOP ENGINE PREMIUM PRICE CARD
   Prefix: whep26-
========================================= */

.whep26-price-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  padding: 30px 25px;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(237, 89, 227, 0.07),
      transparent 48%
    ),
    #ffffff;

  border: 1px solid #efd6f6;
  border-radius: 24px;

  box-shadow:
    0 20px 60px rgba(95, 32, 120, 0.08),
    0 3px 12px rgba(94, 43, 105, 0.03);

  font-family: 'Inter', sans-serif;
  text-align: center;
}

.whep26-price-card * {
  box-sizing: border-box;
}

.whep26-price-content {
  position: relative;
  z-index: 2;
}

.whep26-card-glow {
  position: absolute;
  top: -150px;
  left: 50%;
  transform: translateX(-50%);
  width: 340px;
  height: 280px;

  background: radial-gradient(
    circle,
    rgba(237, 65, 217, 0.11),
    transparent 72%
  );

  filter: blur(35px);
  pointer-events: none;
  z-index: -1;
}

/* LICENSE BADGE */

.whep26-license-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  max-width: 100%;
  padding: 9px 14px;

  background: linear-gradient(
    110deg,
    #fdf1ff,
    #f5e7ff
  );

  border: 1px solid #edc9f7;
  border-radius: 50px;

  color: #9d24bb;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.4px;
  line-height: 1.5;
}

.whep26-license-badge i {
  color: #c12bd7;
  font-size: 13px;
}

/* HEADING */

.whep26-price-heading {
  margin-top: 22px;
}

.whep26-price-heading h3 {
  margin: 0 0 7px;

font-size: clamp(24px, 2.5vw, 24px);
  line-height: 1.2;
  letter-spacing: -1px;
  font-weight: 900;
  color: #1c1830;
}

.whep26-price-heading h3 span {
  background: linear-gradient(
    95deg,
    #f13ca9,
    #bc1bd7
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whep26-price-heading p {
  margin: 0;
  font-size: 15px;
  color: #666176;
  line-height: 1.55;
  font-weight: 600;
}

/* PRICE AREA */

.whep26-pricing-area {
  margin-top: 15px;
  padding: 12px 10px 0px;
  border-top: 1px solid #f2e5f5;
  border-bottom: 1px solid #f2e5f5;
}

.whep26-regular-price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  font-size: 15px;
  color: #777083;
  font-weight: 600;
}

.whep26-regular-price del {
  color: #ef536f;
  font-size: 18px;
  font-weight: 850;
  text-decoration-thickness: 2px;
}

.whep26-today-label {
  margin-top: 13px;
  color: #ac36b9;

  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.7px;
}

.whep26-main-price {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 8px 0 9px;
}

.whep26-currency {
  align-self: flex-start;
  padding-top: 14px;

  font-size: 35px;
  font-weight: 900;
  color: #bc24ca;
}

.whep26-price-number {
display: block;
  font-size: clamp(54px, 8vw, 60px);
  font-weight: 950;
  line-height: 1;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  background: linear-gradient( 135deg, #f15c9e, #c01bd3 );
    background-clip: border-box;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whep26-price-type {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  margin-left: 10px;
}

.whep26-price-type strong {
  font-size: 14px;
  color: #292038;
  font-weight: 900;
  white-space: nowrap;
}

.whep26-price-type small {
  font-size: 12px;
  color: #858092;
  font-weight: 600;
}

.whep26-saving-note {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;

  color: #198e78;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.5;
}

/* CTA AREA */

.whep26-action-area {
  margin-top: 23px;
}

.whep26-buy-button {
position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 50px;
  padding: 10px 15px;
  background: linear-gradient( 105deg, #ff8b75 0%, #f7489c 48%, #bd16d8 100% );
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 13px;
  color: #fff;
  font-size: 30px;
  font-weight: 900;
  text-decoration: none;
  text-align: center;
  box-shadow: 0 13px 26px rgba(218, 40, 171, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.whep26-buy-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;

  width: 60%;
  height: 100%;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.22),
    transparent
  );

  transform: skewX(-20deg);
  transition: left 0.7s ease;
}

.whep26-buy-button:hover {
  transform: translateY(-3px);
  color: #fff;
  box-shadow: 0 18px 35px rgba(218, 40, 171, 0.3);
}

.whep26-buy-button:hover::before {
  left: 150%;
}

.whep26-buy-button i {
  font-size: 15px;
}

.whep26-urgency-note {
  margin: 13px 0 0;
  color: #9b638e;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}

.whep26-urgency-note i {
  margin-right: 4px;
  color: #d65ca7;
}

/* TRUST SECTION */

.whep26-trust-section {
  margin-top: 20px;
}

.whep26-trust-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;

  color: #9890a0;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 1.1px;
  white-space: nowrap;
}

.whep26-trust-title span {
  flex: 1;
  height: 1px;
  background: #ede2ef;
}

.whep26-trust-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.whep26-trust-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;

  padding: 13px 5px;

  border: 1px solid #f1e7f1;
  border-radius: 12px;
  background: #fdfbfd;
}

.whep26-trust-icon {
  width: 37px;
  height: 37px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #edfff7;
  color: #189d75;
  border-radius: 50%;
  font-size: 16px;
}

.whep26-trust-item span {
  color: #555266;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.5;
}

/* RESPONSIVE */

@media (max-width: 991px) {
  .whep26-price-card {
    margin-top: 25px;
  }
}

@media (max-width: 767px) {
  .whep26-price-card {
    padding: 25px 17px;
    border-radius: 18px;
  }

  .whep26-price-heading h3 {
    font-size: 29px;
  }

  .whep26-price-heading p {
    font-size: 14px;
  }

  .whep26-price-number {
    font-size: 90px;
  }

  .whep26-currency {
    font-size: 29px;
  }

  .whep26-buy-button {
    font-size: 15px;
    min-height: 59px;
  }

  .whep26-license-badge {
    font-size: 10px;
    letter-spacing: 0;
  }
}

@media (max-width: 380px) {
  .whep26-price-number {
    font-size: 76px;
  }

  .whep26-price-type strong {
    font-size: 12px;
  }

  .whep26-trust-grid {
    gap: 6px;
  }

  .whep26-trust-item span {
    font-size: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whep26-buy-button,
  .whep26-buy-button::before {
    transition: none;
  }
}

.timer-box {
    height: 80px;
  margin-top: -27px;
}

/* ==============================================
   WHOP ENGINE VIDEO DEMO
   ULTRA PREMIUM DARK / GOLD THEME
   Prefix: whvd26-
============================================== */

.whvd26-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  padding: 90px 0 105px;

  background:
    radial-gradient(
      ellipse at 50% -18%,
      rgba(255, 156, 42, 0.42) 0%,
      rgba(112, 48, 12, 0.19) 32%,
      transparent 60%
    ),
    linear-gradient(
      180deg,
      #1d1009 0%,
      #080809 30%,
      #050506 100%
    );

  font-family: 'Inter', sans-serif;
  color: #ffffff;
}

.whvd26-section * {
  box-sizing: border-box;
}

.whvd26-section .container {
  z-index: 2;
}

/* ==============================================
   BACKGROUND
============================================== */

.whvd26-bg-glow {
  position: absolute;
  top: -260px;
  left: 50%;
  transform: translateX(-50%);

  width: 950px;
  height: 480px;

  background: radial-gradient(
    ellipse,
    rgba(255, 144, 35, 0.26),
    transparent 70%
  );

  filter: blur(60px);
  pointer-events: none;
}

.whvd26-bg-grid {
  position: absolute;
  inset: 0;

  background-image:
    radial-gradient(
      rgba(255, 255, 255, 0.12) 1px,
      transparent 1px
    );

  background-size: 28px 28px;
  opacity: 0.13;

  mask-image: linear-gradient(
    180deg,
    #000,
    transparent 75%
  );

  pointer-events: none;
}

/* ==============================================
   EYEBROW
============================================== */

.whvd26-eyebrow {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;

  max-width: 100%;
  padding: 11px 21px;

  border: 1px solid rgba(255, 190, 108, 0.25);
  border-radius: 100px;

  background: rgba(255, 168, 80, 0.07);

  color: #ffd39a;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.15px;

  margin-bottom: 32px;
}

.whvd26-live-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;

  background: #ffad4a;
  border-radius: 50%;

  box-shadow: 0 0 0 5px rgba(255, 173, 74, 0.12);

  animation: whvd26DotPulse 2s infinite;
}

.whvd26-eyebrow-star {
  color: #a7845c;
  margin: 0 3px;
}

/* ==============================================
   HEADING
============================================== */

.whvd26-heading {
  max-width: 1130px;
  margin: 0 auto;
font-size: clamp(37px, 4.3vw, 50px);
  line-height: 1.23;
  letter-spacing: -2.3px;

  font-weight: 900;
  color: #ffffff;
}

.whvd26-heading-line {
  /* display: block; */
}

.whvd26-gradient-text {
  background: linear-gradient(
    100deg,
    #ffe6a8 0%,
    #ffbd60 40%,
    #ff874f 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whvd26-underline {
  display: inline-block;
  position: relative;
  padding-bottom: 8px;
}

.whvd26-underline::after {
content: "";
  position: absolute;
  left: 0;
  bottom: 14px;
  width: 100%;
  height: 3px;
  background: linear-gradient( 90deg, #ffc66a, #ff8050 );
  border-radius: 10px;
}

.whvd26-heading-last {
  /* display: block; */
  margin-top: 7px;
}

.whvd26-time-highlight {
  display: inline-block;

  padding: 0 15px 5px;
  border-radius: 10px;

  background: linear-gradient(
    135deg,
    rgba(255, 189, 91, 0.17),
    rgba(255, 118, 55, 0.1)
  );

  border: 1px solid rgba(255, 189, 91, 0.2);

  color: #ffcb79;
  white-space: nowrap;
}

/* ==============================================
   DECORATIVE DIVIDER
============================================== */

.whvd26-divider {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 19px;

  margin: 30px 0 27px;
}

.whvd26-divider span {
  width: 108px;
  height: 1px;

  background: linear-gradient(
    90deg,
    transparent,
    #d08e4e
  );
}

.whvd26-divider span:last-child {
  transform: rotate(180deg);
}

.whvd26-divider i {
  font-style: normal;
  font-size: 19px;
  color: #ffc27b;
}

/* ==============================================
   BENEFIT CHIPS
============================================== */

.whvd26-benefits {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;

  gap: 12px;
  margin: 0 auto 38px;
}

.whvd26-benefit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;

  padding: 12px 18px;

  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.08),
    rgba(255, 255, 255, 0.035)
  );

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 100px;

  color: #f4e9dd;

  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;

  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.12);
}

.whvd26-benefit-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 21px;
  height: 21px;
  flex-shrink: 0;

  background: rgba(255, 192, 100, 0.14);
  border-radius: 50%;

  color: #ffbc70;
  font-size: 11px;
}

/* ==============================================
   WATCH LABEL
============================================== */

.whvd26-watch-label {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 26px;

  margin-bottom: 24px;

  color: #ffcf90;
  font-size: 14px;
  font-weight: 850;
  letter-spacing: 1.4px;
}

.whvd26-arrow-icon {
  color: #ffb866;
  font-size: 20px;

  animation: whvd26Bounce 2.2s ease-in-out infinite;
}

/* ==============================================
   VIDEO FRAME
============================================== */

.whvd26-video-outer {
  position: relative;
  max-width: 960px;
  margin: 0 auto;
}

.whvd26-video-glow {
  position: absolute;

  inset: -8px;
  border-radius: 23px;

  background: linear-gradient(
    110deg,
    rgba(255, 167, 69, 0.45),
    rgba(255, 110, 46, 0.17),
    rgba(255, 207, 104, 0.36)
  );

  filter: blur(28px);
  opacity: 0.57;
  pointer-events: none;
}

.whvd26-video-frame {
  position: relative;
  overflow: hidden;

  padding: 7px;

  background: linear-gradient(
    135deg,
    #e1a35f,
    #654123 22%,
    #282326 55%,
    #bb8249 100%
  );

  border-radius: 21px;

  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.65),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

/* Browser Top */

.whvd26-browser-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;

  min-height: 46px;
  padding: 0 17px;

  background: #19181a;
  border-radius: 15px 15px 0 0;

  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.whvd26-browser-dots {
  display: flex;
  gap: 6px;
}

.whvd26-browser-dots span {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.whvd26-browser-dots span:nth-child(1) {
  background: #ff6862;
}

.whvd26-browser-dots span:nth-child(2) {
  background: #ffbc50;
}

.whvd26-browser-dots span:nth-child(3) {
  background: #4cc68b;
}

.whvd26-browser-title {
  color: #bcb0a4;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.4px;
}

.whvd26-browser-title i {
  margin-right: 8px;
  color: #d4a576;
}

.whvd26-browser-badge {
  display: flex;
  align-items: center;
  gap: 6px;

  color: #ffc47a;

  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
}

.whvd26-browser-badge span {
  width: 7px;
  height: 7px;
  background: #ffb756;
  border-radius: 50%;
}

/* Actual Video */

.whvd26-video-area {
  position: relative;
  overflow: hidden;

  width: 100%;
  aspect-ratio: 16 / 9;

  background: #080808;

  border-radius: 0 0 14px 14px;
}

.whvd26-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #080808;
}

.whvd26-video-bottom-glow {
  position: absolute;
  bottom: -37px;
  left: 10%;

  width: 80%;
  height: 40px;

  border-radius: 50%;
  background: rgba(255, 142, 59, 0.26);

  filter: blur(40px);
  pointer-events: none;
}

/* ==============================================
   BOTTOM CAPTION
============================================== */

.whvd26-video-caption {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  margin-top: 32px;

  color: #d3c6ba;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
}

.whvd26-caption-icon {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 29px;
  height: 29px;

  color: #ffbc68;
  background: rgba(255, 190, 93, 0.12);

  border-radius: 50%;
}

.whvd26-video-caption strong {
  color: #ffc57d;
  font-weight: 850;
}

/* ==============================================
   ANIMATIONS
============================================== */

@keyframes whvd26DotPulse {
  0%, 100% {
    box-shadow: 0 0 0 4px rgba(255, 173, 74, 0.14);
  }

  50% {
    box-shadow: 0 0 0 8px rgba(255, 173, 74, 0.02);
  }
}

@keyframes whvd26Bounce {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(7px);
  }
}

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

@media (max-width: 991px) {

  .whvd26-section {
    padding: 70px 0 85px;
  }

  .whvd26-heading {
    font-size: clamp(38px, 5.6vw, 54px);
    letter-spacing: -1.5px;
  }

  .whvd26-benefit {
    font-size: 13px;
    padding: 10px 14px;
  }
}

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

@media (max-width: 767px) {

  .whvd26-section {
    padding: 52px 0 65px;
  }

  .whvd26-eyebrow {
    font-size: 10px;
    letter-spacing: 0.5px;
    gap: 7px;
    padding: 10px 13px;
    margin-bottom: 25px;
  }

  .whvd26-heading {
    font-size: clamp(31px, 8vw, 43px);
    line-height: 1.25;
    letter-spacing: -1px;
  }

  .whvd26-heading-last {
    margin-top: 10px;
  }

  .whvd26-time-highlight {
    padding: 0 9px 3px;
  }

  .whvd26-divider {
    gap: 12px;
    margin: 23px 0;
  }

  .whvd26-divider span {
    width: 63px;
  }

  .whvd26-benefits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 28px;
  }

  .whvd26-benefit {
    padding: 11px 9px;
    font-size: 11px;
    text-align: left;
    border-radius: 11px;
    justify-content: flex-start;
    gap: 7px;
  }

  .whvd26-benefit-icon {
    width: 19px;
    height: 19px;
    font-size: 10px;
  }

  .whvd26-watch-label {
    font-size: 10px;
    letter-spacing: 0.6px;
    gap: 12px;
    margin-bottom: 19px;
  }

  .whvd26-arrow-icon {
    font-size: 15px;
  }

  .whvd26-video-frame {
    padding: 4px;
    border-radius: 12px;
  }

  .whvd26-browser-bar {
    min-height: 34px;
    padding: 0 9px;
    border-radius: 8px 8px 0 0;
  }

  .whvd26-browser-dots {
    gap: 4px;
  }

  .whvd26-browser-dots span {
    width: 7px;
    height: 7px;
  }

  .whvd26-browser-title {
    font-size: 7px;
    letter-spacing: 0.4px;
  }

  .whvd26-browser-title i {
    margin-right: 3px;
  }

  .whvd26-browser-badge {
    font-size: 8px;
  }

  .whvd26-video-area {
    border-radius: 0 0 8px 8px;
  }

  .whvd26-video-caption {
    font-size: 12px;
    margin-top: 25px;
    gap: 8px;
  }

  .whvd26-caption-icon {
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    font-size: 11px;
  }
}

/* ==============================================
   REDUCED MOTION
============================================== */

@media (prefers-reduced-motion: reduce) {
  .whvd26-live-dot,
  .whvd26-arrow-icon {
    animation: none;
  }
}


/* WHOP ENGINE FAQ CTA */

.whop-faq-cta {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    padding: 19px 36px;
    background: linear-gradient(135deg, #7755ff, #5232de);
    color: #fff;
    border-radius: 12px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(96, 64, 220, 0.25);
    transition: all 0.3s ease;
}

.whop-faq-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(96, 64, 220, 0.35);
    color: #fff;
}

.whop-faq-cta-note {
    margin-top: 15px;
    font-size: 16px;
    color: #777;
}

.whop-faq-cta-note strong {
    font-weight: 800;
}

@media (max-width: 767px) {
    .whop-faq-cta {
        width: 100%;
        padding: 17px 18px;
        font-size: 16px;
        gap: 8px;
    }
}

/* =============================================
   WHOP ENGINE — 3 STEPS SECTION
   White Theme / Logo Orange-Red
   Unique Prefix: whstep26-
============================================= */

.whstep26-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 100px 0 90px;
  background:
    radial-gradient(ellipse at 0% 30%,
      rgba(255, 83, 38, .045), transparent 36%),
    radial-gradient(ellipse at 100% 70%,
      rgba(255, 119, 52, .05), transparent 36%),
    #fff;
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #141414;
}

.whstep26-section * {
  box-sizing: border-box;
}

.whstep26-section .container {
  z-index: 2;
}

.whstep26-bg-pattern {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .35;
  background-image: radial-gradient(
    rgba(255, 96, 55, .16) 1px,
    transparent 1px
  );
  background-size: 25px 25px;
  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    transparent 35%
  );
}

/* SECTION HEADING */

.whstep26-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 11px 22px;
  margin-bottom: 22px;
  border: 1px solid #ffded3;
  border-radius: 50px;
  background: #fff7f3;
  color: #ed431f;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.4px;
}

.whstep26-eyebrow-dot {
  width: 7px;
  height: 7px;
  background: #ff391c;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #ffe4dc;
}

.whstep26-main-heading {
  max-width: 950px;
  margin: 0 auto 20px;
  color: #0b0d13;
  font-size: clamp(36px, 4.5vw, 50px);
  font-weight: 900;
  letter-spacing: -2.5px;
  line-height: 1.18;
}

.whstep26-main-heading span {
   background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}

.whstep26-intro {
max-width: 1080px;
  margin: 0 auto;
  color: #667080;
  font-size: 18px;
  line-height: 1.8;
}

/* STEP ROWS */

.whstep26-step-row {
  position: relative;
  margin-top: 90px;
}

/* CONTENT */

.whstep26-content {
  position: relative;
  max-width: 540px;
}

.whstep26-step-label {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 22px;
  color: #ef421f;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 1.7px;
}

.whstep26-step-label span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  background: #fff0e9;
  border: 1px solid #ffd3c3;
  border-radius: 13px;
  color: #fb391b;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0;
  box-shadow: 0 5px 16px rgba(255, 65, 24, .06);
}

.whstep26-content h3 {
  margin: 0 0 23px;
  color: #0b101b;
  font-size: clamp(30px, 3vw, 43px);
  font-weight: 900;
  line-height: 1.23;
  letter-spacing: -1.5px;
}

.whstep26-content h3 span {
  display: block;
  color: #ff3216;
}

.whstep26-content p {
  margin: 0 0 15px;
  color: #596273;
  font-size: 18px;
  line-height: 1.8;
}

.whstep26-content p strong {
  color: #222633;
  font-weight: 800;
}

/* BENEFIT PILLS */

.whstep26-mini-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 25px;
}

.whstep26-mini-benefits span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 13px;
  border-radius: 50px;
  border: 1px solid #f4e0d8;
  background: #fffaf7;
  color: #303747;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
}

.whstep26-mini-benefits i {
  color: #ff391a;
  font-size: 11px;
}

/* SCREENSHOT VISUAL */

.whstep26-visual {
  position: relative;
  padding: 0px;
}

.whstep26-visual-glow {
  position: absolute;
  inset: 4%;
  z-index: -1;
  border-radius: 40px;
  background: linear-gradient(
    135deg,
    rgba(255, 94, 49, .15),
    rgba(255, 197, 151, .13)
  );
  filter: blur(30px);
}

.whstep26-screen-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #f1d9ce;
  border-radius: 18px;
  background: #ffffff;
  padding: 7px;
  box-shadow:
    0 25px 60px rgba(39, 31, 28, .10),
    0 5px 16px rgba(39, 31, 28, .04);
  transition: transform .35s ease,
              box-shadow .35s ease;
}

.whstep26-screen-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 30px 70px rgba(255, 75, 34, .13),
    0 8px 20px rgba(30, 30, 30, .04);
}

.whstep26-screen-top {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 11px 14px;
  background: #fff7f2;
  border-radius: 12px 12px 0 0;
  border-bottom: 1px solid #f5e1d7;
}

.whstep26-screen-top > span {
  display: block;
  flex-shrink: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.whstep26-screen-top > span:nth-child(1) {
  background: #ff615b;
}

.whstep26-screen-top > span:nth-child(2) {
  background: #ffbd60;
}

.whstep26-screen-top > span:nth-child(3) {
  background: #55c98b;
}

.whstep26-screen-top div {
  flex: 1;
  padding-right: 27px;
  color: #a27769;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .7px;
  text-align: center;
}

.whstep26-screen-card img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0 0 11px 11px;
}

/* FLOATING STATUS */

.whstep26-floating-badge {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  max-width: 85%;
  padding: 13px 18px;
  border: 1px solid #f5dacd;
  border-radius: 12px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 12px 35px rgba(34, 25, 20, .13);
  color: #202936;
  font-size: 13px;
  font-weight: 850;
}

.whstep26-floating-badge i {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 29px;
  height: 29px;
  border-radius: 8px;
  background: #fff0e9;
  color: #ff3216;
}

/* CONNECTING ARROWS */

.whstep26-flow-arrow {
  display: flex;
  justify-content: center;
  margin: 35px 0 -40px;
}

.whstep26-flow-arrow svg {
  width: 170px;
  height: 75px;
  filter: drop-shadow(0 4px 5px rgba(255, 74, 25, .12));
}

.whstep26-flow-reverse {
  transform: scaleX(-1);
}

/* BOTTOM CTA */

.whstep26-bottom-cta {
  position: relative;
  margin: 100px auto 0;
  padding: 40px 20px;
  max-width: 790px;
  text-align: center;
  border: 1px solid #ffe1d5;
  border-radius: 25px;
  background:
    radial-gradient(circle at 50% 0%,
      rgba(255, 89, 42, .09), transparent 65%),
    #fffaf7;
  box-shadow: 0 18px 45px rgba(255, 91, 35, .06);
}

.whstep26-cta-topline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 25px;
  color: #fa421c;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.2px;
}

.whstep26-cta-topline span {
  width: 45px;
  height: 1px;
  background: #ffb49d;
}

.whstep26-cta-button {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 13px;
  max-width: 100%;
  min-height: 68px;
  padding: 18px 31px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 13px;
  background: linear-gradient(
    110deg,
    #ff7046,
    #ff3216 60%,
    #e92c11
  );
  box-shadow:
    0 15px 30px rgba(255, 57, 22, .23),
    inset 0 1px 0 rgba(255, 255, 255, .3);
  color: #fff;
  font-size: 19px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .3s ease, box-shadow .3s ease;
}

.whstep26-cta-button:hover {
  transform: translateY(-4px);
  color: #fff;
  box-shadow: 0 20px 40px rgba(255, 57, 22, .3);
}

.whstep26-bottom-cta p {
  margin: 17px 0 0;
  color: #686b76;
  font-size: 14px;
  font-weight: 650;
}

.whstep26-bottom-cta p i {
  color: #ff421f;
  margin-right: 5px;
}

/* TABLET */

@media (max-width: 991px) {
  .whstep26-section {
    padding: 75px 0;
  }

  .whstep26-step-row {
    margin-top: 70px;
  }

  .whstep26-content {
    max-width: 100%;
  }

  .whstep26-flow-arrow {
    margin: 22px 0 -30px;
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .whstep26-section {
    padding: 60px 0;
  }

  .whstep26-eyebrow {
    font-size: 10px;
    padding: 10px 15px;
    letter-spacing: .7px;
  }

  .whstep26-main-heading {
    font-size: clamp(33px, 8vw, 45px);
    letter-spacing: -1.3px;
  }

  .whstep26-intro {
    font-size: 16px;
  }

  .whstep26-step-row {
    margin-top: 55px;
  }

  .whstep26-step-label {
    margin-bottom: 16px;
    font-size: 11px;
  }

  .whstep26-step-label span {
    width: 40px;
    height: 40px;
    font-size: 17px;
  }

  .whstep26-content h3 {
    font-size: 30px;
    letter-spacing: -.9px;
  }

  .whstep26-content p {
    font-size: 16px;
    line-height: 1.75;
  }

  .whstep26-mini-benefits {
    margin-top: 20px;
  }

  .whstep26-mini-benefits span {
    font-size: 11px;
    padding: 8px 10px;
  }

  .whstep26-visual {
    padding: 13px 12px 20px;
  }

  .whstep26-screen-card {
    border-radius: 13px;
    padding: 5px;
  }

  .whstep26-screen-top {
    padding: 9px;
  }

  .whstep26-screen-top div {
    font-size: 8px;
    padding-right: 0;
  }

  .whstep26-floating-badge {
    padding: 9px 11px;
    font-size: 10px;
    right: 1px;
    bottom: 3px;
  }

  .whstep26-floating-badge i {
    width: 25px;
    height: 25px;
  }

  .whstep26-flow-arrow {
    margin: 28px 0 -25px;
  }

  .whstep26-flow-arrow svg {
    width: 115px;
    height: 55px;
  }

  .whstep26-bottom-cta {
    margin-top: 70px;
    padding: 30px 15px;
    border-radius: 17px;
  }

  .whstep26-cta-topline {
    font-size: 9px;
    gap: 8px;
    letter-spacing: .5px;
  }

  .whstep26-cta-topline span {
    width: 20px;
  }

  .whstep26-cta-button {
    width: 100%;
    min-height: 60px;
    padding: 15px 10px;
    gap: 8px;
    font-size: 14px;
  }

  .whstep26-bottom-cta p {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whstep26-screen-card,
  .whstep26-cta-button {
    transition: none;
  }
}



/* ========== WHOP TESTIMONIAL SECTION ========== */

/* ==========================================
   WHOP ENGINE VIDEO TESTIMONIALS
   PREMIUM WHITE + RED LOGO THEME
========================================== */

.whev26-section {
    position: relative;
    padding: 100px 0;
    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(255, 55, 20, 0.055),
            transparent 55%
        ),
        #ffffff;
    color: #111111;
    font-size: 18px;
    overflow: hidden;
}

.whev26-section * {
    box-sizing: border-box;
}

/* ========== HEADING ========== */

.whev26-kicker {
    display: inline-block;
    font-family: "Caveat", cursive;
    font-size: 34px;
    font-weight: 700;
    color: #ff310d;
    transform: rotate(-2deg);
    margin-bottom: 24px;
}

.whev26-spark {
    color: #ff310d;
    margin-right: 8px;
}

.whev26-heading {
    font-size: clamp(32px, 4vw, 54px);
    font-weight: 800;
    line-height: 1.17;
    letter-spacing: -1.5px;
    color: #101010;
    margin-bottom: 24px;
}

.whev26-heading span {
    display: block;
    color: #ff310d;
}

.whev26-description {
    /* max-width: 780px; */
    margin: 0 auto;
    font-size: 19px;
    font-weight: 400;
    line-height: 1.75;
    color: #656565;
}

/* ========== VIDEO GRID ========== */

.whev26-grid {
    margin-top: 58px;
}

/* ========== TESTIMONIAL CARD ========== */

.whev26-card {
    position: relative;
    height: 100%;
    background: #ffffff;
    border: 1px solid #ededed;
    border-radius: 20px;
    overflow: hidden;

    box-shadow:
        0 5px 20px rgba(0, 0, 0, 0.035),
        0 18px 50px rgba(0, 0, 0, 0.025);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.whev26-card:hover {
    transform: translateY(-7px);
    border-color: rgba(255, 49, 13, 0.35);

    box-shadow:
        0 18px 45px rgba(0, 0, 0, 0.065),
        0 12px 35px rgba(255, 49, 13, 0.08);
}

/* ========== VIDEO FRAME ========== */

.whev26-video-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    background: #171717;
    overflow: hidden;
}

.whev26-video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #171717;
}

/* Video play button */

.whev26-play {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;

    width: 86px;
    height: 86px;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translate(-50%, -50%);
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 50%;

    background:
        linear-gradient(135deg, #ff9e59 0%, #ff6f5d 30%, #ff3610 100%);

    color: #ffffff;
    font-size: 27px;
    cursor: pointer;

    box-shadow:
        0 0 0 8px rgba(255, 66, 25, 0.20),
        0 0 0 15px rgba(255, 66, 25, 0.08),
        0 18px 42px rgba(255, 45, 0, 0.32),
        inset 0 2px 0 rgba(255, 255, 255, 0.33);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease,
        filter 0.25s ease;
}

.whev26-play::before {
    content: "";
    position: absolute;
    inset: 9px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.88);
    pointer-events: none;
}

.whev26-play i {
    position: relative;
    z-index: 2;
    margin-left: 4px;
    line-height: 1;
    text-shadow: 0 3px 8px rgba(0, 0, 0, 0.24);
}

.whev26-play:hover {
    transform: translate(-50%, -50%) scale(1.05);
    filter: saturate(1.08);
    box-shadow:
        0 0 0 10px rgba(255, 66, 25, 0.24),
        0 0 0 18px rgba(255, 66, 25, 0.10),
        0 22px 52px rgba(255, 45, 0, 0.42),
        inset 0 2px 0 rgba(255, 255, 255, 0.38);
}

.whev26-video-wrap.is-playing .whev26-play {
    opacity: 0;
    pointer-events: none;
}

/* Video badge */

.whev26-video-tag {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;

    padding: 8px 13px;

    background: rgba(0, 0, 0, 0.78);
    color: #ffffff;

    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 30px;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;

    backdrop-filter: blur(8px);
    pointer-events: none;
}

/* Small red indicator */

.whev26-video-tag::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 7px;
    border-radius: 50%;
    background: #ff310d;
}

/* ========== CARD CONTENT ========== */

.whev26-card-content {
    padding: 26px 26px 30px;
}

.whev26-card-content h3 {
    color: #111111;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 7px;
}

.whev26-person-meta {
    display: block;
    color: #767676;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 18px;
}

.whev26-quote {
    position: relative;
    color: #454545;
    font-size: 17px;
    font-weight: 400;
    font-style: italic;
    line-height: 1.7;

    padding-left: 17px;
    margin-bottom: 0;

    border-left: 3px solid #ff310d;
}

/* ========== BOTTOM CTA ========== */

.whev26-bottom {
    position: relative;
    margin-top: 75px;
    text-align: center;
}

.whev26-bottom h3 {
    color: #111111;
    font-size: clamp(28px, 3vw, 44px);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.7px;
    margin-bottom: 30px;
}

.whev26-bottom h3 span {
    color: #ff310d;
}

/* CTA button */

.whev26-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;

    padding: 21px 40px;

    background: linear-gradient(
        135deg,
        #ff4b23 0%,
        #ff2600 100%
    );

    border: 1px solid #ff310d;
    border-radius: 12px;

    color: #ffffff;
    text-decoration: none;

    font-size: 19px;
    font-weight: 800;
    line-height: 1.4;

    box-shadow:
        0 12px 30px rgba(255, 49, 13, 0.20);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.whev26-cta:hover {
    transform: translateY(-4px);

    background: linear-gradient(
        135deg,
        #ff2600,
        #d91f00
    );

    box-shadow:
        0 16px 38px rgba(255, 49, 13, 0.32);

    color: #ffffff;
}

.whev26-cta span {
    font-size: 25px;
    line-height: 1;
    transition: transform 0.3s ease;
}

.whev26-cta:hover span {
    transform: translateX(5px);
}

/* Access text */

.whev26-access {
    margin: 20px 0 0;
    color: #505050;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.7;
}

.whev26-access span {
    color: #ff310d;
    font-weight: 800;
}

.whev26-access .whev26-dot {
    margin: 0 11px;
    color: #a3a3a3;
}

/* Disclaimer */

.whev26-disclaimer {
    max-width: 720px;
    margin: 38px auto 0;

    padding-top: 22px;
    border-top: 1px solid #eeeeee;

    color: #888888;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
}

/* ========== RESPONSIVE ========== */

@media (max-width: 991px) {

    .whev26-section {
        padding: 80px 0;
    }

    .whev26-grid {
        margin-top: 45px;
    }

    .whev26-card-content {
        padding: 23px;
    }
}

@media (max-width: 767px) {

    .whev26-section {
        padding: 60px 0;
    }

    .whev26-kicker {
        font-size: 29px;
        margin-bottom: 18px;
    }

    .whev26-heading {
        font-size: 32px;
        line-height: 1.22;
        letter-spacing: -0.7px;
        margin-bottom: 18px;
    }

    .whev26-description {
        font-size: 17px;
        line-height: 1.7;
    }

    .whev26-grid {
        margin-top: 35px;
    }

    .whev26-video-wrap {
        aspect-ratio: 4 / 5;
    }

    .whev26-card {
        border-radius: 16px;
    }

    .whev26-card-content {
        padding: 22px;
    }

    .whev26-card-content h3 {
        font-size: 21px;
    }

    .whev26-quote {
        font-size: 16px;
    }

    .whev26-bottom {
        margin-top: 55px;
    }

    .whev26-bottom h3 {
        font-size: 30px;
        margin-bottom: 25px;
    }

    .whev26-cta {
        width: 100%;
        padding: 18px 15px;
        font-size: 16px;
        gap: 9px;
    }

    .whev26-access {
        font-size: 13px;
        line-height: 1.9;
    }

    .whev26-disclaimer {
        font-size: 12px;
        margin-top: 25px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .whev26-card,
    .whev26-cta,
    .whev26-play {
        transition: none;
    }
}


.whev26-play {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;

    width: 86px;
    height: 86px;
    transform: translate(-50%, -50%);

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 50%;
    background: linear-gradient(135deg, #ff9e59 0%, #ff6f5d 30%, #ff3610 100%);

    color: #ffffff;
    font-size: 27px;
    cursor: pointer;

    box-shadow:
        0 0 0 8px rgba(255, 66, 25, 0.20),
        0 0 0 15px rgba(255, 66, 25, 0.08),
        0 18px 42px rgba(255, 45, 0, 0.32),
        inset 0 2px 0 rgba(255, 255, 255, 0.33);

    transition: opacity .25s ease, transform .25s ease, box-shadow .3s ease, filter .25s ease;
}

.whev26-play::before {
    content: "";
    position: absolute;
    inset: 9px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.88);
    pointer-events: none;
}

.whev26-play i {
    position: relative;
    z-index: 2;
    margin-left: 4px;
    color: #ffffff;
    line-height: 1;
    text-shadow: 0 3px 8px rgba(0, 0, 0, 0.24);
}

.whev26-play:hover {
    transform: translate(-50%, -50%) scale(1.05);
    filter: saturate(1.08);
    box-shadow:
        0 0 0 10px rgba(255, 66, 25, 0.24),
        0 0 0 18px rgba(255, 66, 25, 0.10),
        0 22px 52px rgba(255, 45, 0, 0.42),
        inset 0 2px 0 rgba(255, 255, 255, 0.38);
}

@media (max-width: 767px) {
    .whev26-play {
        width: 76px;
        height: 76px;
        font-size: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .whev26-play {
        transition: none;
    }

    .whev26-play:hover {
        transform: translate(-50%, -50%);
    }
}


/* =============================================
   WHOP ENGINE OPPORTUNITY SECTION
   Ultra Premium Black + Orange Theme
   Unique Prefix: wopp26-
============================================= */

.wopp26-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  padding: 100px 0 90px;

  background:
    radial-gradient(
      ellipse at 8% 20%,
      rgba(255, 72, 21, 0.095),
      transparent 34%
    ),
    radial-gradient(
      ellipse at 95% 75%,
      rgba(255, 124, 42, 0.075),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      #090b10 0%,
      #0c1019 48%,
      #07090d 100%
    );

  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #ffffff;
}

.wopp26-section * {
  box-sizing: border-box;
}

.wopp26-section .container {
  z-index: 2;
}

/* =============================================
   BACKGROUND GRID
============================================= */

.wopp26-grid-pattern {
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.045) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.045) 1px,
      transparent 1px
    );

  background-size: 38px 38px;
  opacity: 0.35;

  pointer-events: none;
}

.wopp26-glow {
  position: absolute;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: -1;
}

.wopp26-glow-one {
  background: rgba(255, 67, 20, 0.11);
  top: 18%;
  left: -220px;
}

.wopp26-glow-two {
  background: rgba(255, 125, 31, 0.08);
  right: -200px;
  bottom: 5%;
}

/* =============================================
   EYEBROW
============================================= */

.wopp26-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  padding: 11px 22px;
  margin-bottom: 28px;

  border: 1px solid rgba(255, 98, 50, 0.28);
  border-radius: 100px;

  background: rgba(255, 75, 30, 0.07);

  color: #ff9b73;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.8px;
}

.wopp26-eyebrow-dot {
  width: 8px;
  height: 8px;
  min-width: 8px;

  background: #ff4d24;
  border-radius: 50%;

  box-shadow: 0 0 0 5px rgba(255, 77, 36, 0.12);
}

/* =============================================
   MAIN HEADING
============================================= */

.wopp26-heading {
  max-width: 1120px;
  margin: 0 auto;

  color: #ffffff;

font-size: clamp(38px, 4.3vw, 50px);
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: -2.5px;
}

.wopp26-heading-line {
  display: block;
  margin-top: 7px;
}

.wopp26-gradient-text {
  background: linear-gradient(
    100deg,
    #ffb16f 0%,
    #ff6b38 45%,
    #ff3216 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  color: #ff5b2b;
}

.wopp26-underline {
  position: relative;
  display: inline-block;
  padding-bottom: 8px;
}

.wopp26-underline::after {
  content: "";
  position: absolute;

  left: 0;
  bottom: 1px;

  width: 100%;
  height: 3px;
  border-radius: 10px;

  background: linear-gradient(
    90deg,
    #ff9c53,
    #ff3216
  );

  box-shadow: 0 3px 12px rgba(255, 80, 30, 0.24);
}

/* =============================================
   HEADING DIVIDER
============================================= */

.wopp26-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 17px;

  margin: 34px 0 0;
}

.wopp26-divider span {
  width: 105px;
  height: 1px;

  background: linear-gradient(
    90deg,
    transparent,
    #ff6538
  );
}

.wopp26-divider span:last-child {
  transform: rotate(180deg);
}

.wopp26-divider i {
  color: #ff7d45;
  font-size: 13px;
}

/* =============================================
   MAIN ROW
============================================= */

.wopp26-main-row {
  margin-top: 43px;
}

/* =============================================
   CONTENT CARD
============================================= */

.wopp26-content-card {
  position: relative;
  overflow: hidden;

  height: 100%;
  padding: 36px 32px;

  background: linear-gradient(
    145deg,
    rgba(21, 25, 34, 0.97),
    rgba(12, 15, 23, 0.98)
  );

  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 24px;

  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.wopp26-content-card::before {
  content: "";
  position: absolute;

  top: 0;
  left: 10%;

  width: 80%;
  height: 1px;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 125, 70, 0.65),
    transparent
  );
}

.wopp26-card-topline {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 25px;
}

.wopp26-card-line {
  width: 45px;
  height: 3px;

  background: linear-gradient(
    90deg,
    #ff3216,
    #ff935c
  );

  border-radius: 10px;
}

.wopp26-card-dot {
  width: 6px;
  height: 6px;

  background: #ff7a40;
  border-radius: 50%;
}

.wopp26-content-card p {
  margin: 0 0 21px;

  color: #c0c7d3;
  font-size: 18px;
  line-height: 1.85;
  font-weight: 450;
}

.wopp26-content-card p strong {
  color: #ffffff;
  font-weight: 850;
}

.wopp26-content-card p .wopp26-orange-text {
  color: #ff8e5c;
}

/* =============================================
   HIGHLIGHT STATEMENT
============================================= */

.wopp26-highlight-box {
  position: relative;

  display: flex;
  align-items: flex-start;
  gap: 15px;

  margin-top: 28px;
  padding: 21px 20px;

  background: linear-gradient(
    110deg,
    rgba(255, 86, 29, 0.13),
    rgba(255, 118, 50, 0.045)
  );

  border: 1px solid rgba(255, 108, 48, 0.24);
  border-left: 3px solid #ff5729;
  border-radius: 15px;
}

.wopp26-highlight-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;
  min-width: 42px;

  border-radius: 12px;

  background: linear-gradient(
    135deg,
    #ff914e,
    #ff3216
  );

  color: #ffffff;
  font-size: 17px;

  box-shadow: 0 8px 20px rgba(255, 80, 30, 0.18);
}

.wopp26-highlight-text {
  color: #e9eaf0;
  font-size: 17px;
  line-height: 1.75;
  font-weight: 550;
}

.wopp26-highlight-text strong {
  color: #ff9a67;
  font-weight: 900;
}

/* =============================================
   STATS WRAPPER
============================================= */

.wopp26-stats-wrapper {
  height: 100%;
  padding: 22px;

  background: linear-gradient(
    145deg,
    rgba(25, 25, 31, 0.82),
    rgba(12, 14, 21, 0.96)
  );

  border: 1px solid rgba(255, 128, 70, 0.12);
  border-radius: 25px;

  box-shadow: 0 25px 65px rgba(0, 0, 0, 0.2);
}

.wopp26-stats-wrapper > .row {
  height: 100%;
}

/* =============================================
   STAT CARDS
============================================= */

.wopp26-stat-card {
  position: relative;
  overflow: hidden;

  height: 100%;
  min-height: 190px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;

  padding: 23px 20px;

  background: linear-gradient(
    160deg,
    rgba(37, 39, 46, 0.72),
    rgba(18, 20, 28, 0.95)
  );

  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 18px;

  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.wopp26-stat-card::before {
  content: "";
  position: absolute;

  top: 0;
  left: 0;

  width: 100%;
  height: 2px;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 102, 45, 0.6),
    transparent
  );

  opacity: 0.55;
}

.wopp26-stat-card:hover {
  transform: translateY(-5px);

  border-color: rgba(255, 108, 48, 0.38);

  box-shadow:
    0 15px 35px rgba(0, 0, 0, 0.25),
    0 5px 20px rgba(255, 88, 30, 0.065);
}

/* ICON */

.wopp26-stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 43px;
  height: 43px;

  margin-bottom: 17px;

  border-radius: 12px;

  background: rgba(255, 101, 38, 0.09);
  border: 1px solid rgba(255, 119, 55, 0.19);

  color: #ff864e;
  font-size: 17px;
}

/* STAT NUMBER */

.wopp26-stat-number {
  margin-bottom: 7px;

  font-size: clamp(27px, 2.8vw, 39px);
  line-height: 1.12;

  font-weight: 950;
  letter-spacing: -1.3px;
  font-variant-numeric: tabular-nums;

  background: linear-gradient(
    110deg,
    #ffc186,
    #ff814a,
    #ff4b22
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  color: #ff8650;
}

/* LABEL */

.wopp26-stat-label {
  color: #b9c1ce;

  font-size: 14px;
  line-height: 1.55;
  font-weight: 650;
}

/* =============================================
   SOURCE NOTE
============================================= */

.wopp26-source-note {

  margin: 34px auto 0;
  color: #fff;
  font-size: 18px;
  line-height: 1.7;
  font-weight: 500;
}

/* =============================================
   RESPONSIVE - TABLET
============================================= */

@media (max-width: 991px) {

  .wopp26-section {
    padding: 75px 0;
  }

  .wopp26-heading {
    font-size: clamp(36px, 5vw, 53px);
    letter-spacing: -1.5px;
  }

  .wopp26-content-card {
    padding: 30px 25px;
  }

  .wopp26-stat-card {
    min-height: 180px;
  }

  .wopp26-stats-wrapper > .row {
    height: auto;
  }
}

/* =============================================
   RESPONSIVE - MOBILE
============================================= */

@media (max-width: 767px) {

  .wopp26-section {
    padding: 58px 0 65px;
  }

  .wopp26-eyebrow {
    padding: 10px 16px;
    font-size: 10px;
    letter-spacing: 1px;
    margin-bottom: 23px;
  }

  .wopp26-heading {
    font-size: clamp(31px, 8vw, 43px);
    letter-spacing: -1px;
    line-height: 1.23;
  }

  .wopp26-heading-line {
    margin-top: 8px;
  }

  .wopp26-divider {
    margin-top: 26px;
  }

  .wopp26-divider span {
    width: 66px;
  }

  .wopp26-main-row {
    margin-top: 25px;
  }

  .wopp26-content-card {
    padding: 25px 19px;
    border-radius: 18px;
  }

  .wopp26-content-card p {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 17px;
  }

  .wopp26-highlight-box {
    flex-direction: column;
    padding: 18px 16px;
    gap: 12px;
    margin-top: 22px;
  }

  .wopp26-highlight-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    font-size: 15px;
  }

  .wopp26-highlight-text {
    font-size: 16px;
  }

  .wopp26-stats-wrapper {
    padding: 12px;
    border-radius: 19px;
  }

  .wopp26-stats-wrapper .row {
    --bs-gutter-x: 10px;
    --bs-gutter-y: 10px;
  }

  .wopp26-stat-card {
    min-height: 155px;
    padding: 17px 12px;
    border-radius: 13px;
  }

  .wopp26-stat-icon {
    width: 36px;
    height: 36px;
    font-size: 14px;
    margin-bottom: 14px;
  }

  .wopp26-stat-number {
    font-size: clamp(25px, 6vw, 33px);
    letter-spacing: -0.8px;
  }

  .wopp26-stat-label {
    font-size: 12px;
    line-height: 1.5;
  }

  .wopp26-source-note {
    margin-top: 25px;
    font-size: 11px;
  }
}

@media (max-width: 380px) {

  .wopp26-heading {
    font-size: 29px;
  }

  .wopp26-stat-number {
    font-size: 25px;
  }

  .wopp26-stat-label {
    font-size: 11px;
  }
}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

  .wopp26-stat-card {
    transition: none;
  }

}

/* ==========================================
   WHOP DID YOU KNOW SECTION
   Ultra Premium White Theme
========================================== */

.whdid26-section {
    position: relative;
    padding: 100px 0;
    background:
        radial-gradient(circle at top center, rgba(255, 75, 35, 0.06), transparent 28%),
        #ffffff;
    overflow: hidden;
}

.whdid26-section * {
    box-sizing: border-box;
}

/* Eyebrow */
.whdid26-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border: 1px solid #ffd9cf;
    border-radius: 50px;
    background: #fff6f3;
    color: #f04b22;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.whdid26-eyebrow-icon {
    font-size: 15px;
    line-height: 1;
}

/* Heading */
.whdid26-heading {
    margin: 0;
    color: #111111;
    font-size: clamp(34px, 4.2vw, 62px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -1.6px;
}

.whdid26-heading span {
    /* display: block; */
    color: #ff4b23;
}

/* Grid */
.whdid26-grid {
    margin-top: 58px;
    margin-bottom: 55px;
}

/* Card */
.whdid26-card {
    position: relative;
    height: 100%;
    min-height: 290px;
    padding: 28px 26px 28px;
    background: #ffffff;
    border: 1px solid #ececec;
    border-radius: 24px;
    box-shadow:
        0 8px 24px rgba(15, 23, 42, 0.04),
        0 20px 45px rgba(15, 23, 42, 0.04);
    transition: all 0.35s ease;
    overflow: hidden;
}

.whdid26-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #ff4b23, #ff8a6d);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}

.whdid26-card:hover {
    transform: translateY(-8px);
    border-color: #ffd6ca;
    box-shadow:
        0 15px 35px rgba(15, 23, 42, 0.07),
        0 22px 50px rgba(255, 75, 35, 0.08);
}

.whdid26-card:hover::before {
    transform: scaleX(1);
}

.whdid26-card-top {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 22px;
}

.whdid26-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 48px;
    padding: 0 12px;
    border-radius: 14px;
    background: linear-gradient(135deg, #ff5d37, #ff3a10);
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 10px 22px rgba(255, 75, 35, 0.22);
}

.whdid26-stat {
    color: #111111;
    font-size: clamp(36px, 3.4vw, 56px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1.5px;
    margin-bottom: 14px;
}

.whdid26-card-title {
    color: #ff4b23;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 12px;
}

.whdid26-card-text {
    margin: 0;
    color: #4b5563;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.7;
}

.whdid26-source {
    display: inline;
    color: #8b95a7;
    font-size: 15px;
    font-weight: 500;
}

/* Highlight */
.whdid26-highlight {
    position: relative;
    padding: 36px 38px;
    border-radius: 28px;
    background:
        linear-gradient(180deg, #fff9f7 0%, #ffffff 100%);
    border: 1px solid #ffd9cf;
    box-shadow:
        0 10px 30px rgba(15, 23, 42, 0.05),
        0 20px 50px rgba(255, 75, 35, 0.06);
    overflow: hidden;
}

.whdid26-highlight::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at right top, rgba(255, 75, 35, 0.10), transparent 28%);
    pointer-events: none;
}

.whdid26-highlight-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 50px;
    background: #fff1ec;
    border: 1px solid #ffd8cc;
    color: #f04b22;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 18px;
}

.whdid26-highlight p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #1f2937;
    font-size: clamp(18px, 2vw, 26px);
    font-weight: 500;
    line-height: 1.7;
}

.whdid26-highlight p strong {
    color: #ff4b23;
    font-weight: 800;
}

/* Responsive */
@media (max-width: 991px) {
    .whdid26-section {
        padding: 80px 0;
    }

    .whdid26-grid {
        margin-top: 45px;
        margin-bottom: 45px;
    }

    .whdid26-card {
        min-height: 260px;
    }

    .whdid26-highlight {
        padding: 30px 28px;
    }
}

@media (max-width: 767px) {
    .whdid26-section {
        padding: 60px 0;
    }

    .whdid26-eyebrow {
        font-size: 12px;
        padding: 9px 15px;
        margin-bottom: 18px;
    }

    .whdid26-heading {
        font-size: 34px;
        letter-spacing: -0.8px;
        line-height: 1.18;
    }

    .whdid26-grid {
        margin-top: 35px;
        margin-bottom: 35px;
    }

    .whdid26-card {
        min-height: auto;
        padding: 24px 22px;
        border-radius: 20px;
    }

    .whdid26-stat {
        font-size: 40px;
    }

    .whdid26-card-title {
        font-size: 19px;
    }

    .whdid26-card-text {
        font-size: 16px;
    }

    .whdid26-source {
        font-size: 14px;
    }

    .whdid26-highlight {
        padding: 24px 20px;
        border-radius: 20px;
    }

    .whdid26-highlight p {
        font-size: 18px;
        line-height: 1.75;
    }
}

/* =========================================
   WHOP ENGINE - SUCCESS STORIES SECTION
   White Theme / Orange Gradient Accent
   Prefix: whcs26-
========================================= */

.whcs26-section {
  position: relative;
  overflow: hidden;
  padding: 100px 0 90px;
  background:
    radial-gradient(circle at 0% 0%, rgba(255, 90, 25, 0.05), transparent 24%),
    radial-gradient(circle at 100% 20%, rgba(255, 106, 0, 0.06), transparent 24%),
    #ffffff;
  font-family: 'Inter', Arial, sans-serif;
  color: #16181d;
  font-size: 18px;
}

.whcs26-section * {
  box-sizing: border-box;
}

/* =========================
   HEADER
========================= */

.whcs26-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 20px;
  margin-bottom: 20px;
  border-radius: 50px;
  border: 1px solid #ffd8cf;
  background: #fff6f3;
  color: #f14a1d;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.2px;
}

.whcs26-eyebrow-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff4d20;
  box-shadow: 0 0 0 4px rgba(255, 77, 32, 0.12);
}

.whcs26-main-title {
  max-width: 980px;
  margin: 0 auto 18px;
  font-size: clamp(36px, 4.8vw, 58px);
  line-height: 1.16;
  letter-spacing: -2px;
  font-weight: 900;
  color: #121722;
}

.whcs26-main-title span {
  display: block;
  background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whcs26-subtitle {
  /* max-width: 870px; */
  margin: 0 auto;
  color: #667085;
  font-size: 18px;
  line-height: 1.85;
}

.whcs26-subtitle strong {
  color: #1a1f2c;
  font-weight: 800;
}

/* =========================
   CARD GRID
========================= */

.whcs26-card-row {
  margin-top: 46px;
}

/* =========================
   STORY CARD
========================= */

.whcs26-story-card {
  height: 100%;
  overflow: hidden;
  border-radius: 26px;
  background: #ffffff;
  border: 1px solid #f2e5df;
  box-shadow:
    0 18px 50px rgba(20, 24, 35, 0.05),
    0 4px 14px rgba(20, 24, 35, 0.03);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.whcs26-story-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 24px 65px rgba(20, 24, 35, 0.08),
    0 10px 30px rgba(255, 85, 20, 0.08);
}

/* =========================
   IMAGE
========================= */

.whcs26-story-image-wrap {
  position: relative;
  overflow: hidden;
  /* background:
    linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  padding: 10px; */
}

.whcs26-story-image-wrap img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
  background: #f7f7f7;
}

.whcs26-story-tag {
  position: absolute;
  left: 22px;
  top: 22px;
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 50px;
  background: rgba(12, 18, 28, 0.88);
  color: #ffffff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.4px;
  box-shadow: 0 10px 18px rgba(0,0,0,0.18);
}

/* =========================
   CONTENT
========================= */

.whcs26-story-content {
  padding: 26px 24px 24px;
}

.whcs26-story-stat {
  display: inline-block;
  margin-bottom: 14px;
  padding: 8px 14px;
  border-radius: 50px;
  background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3px;
  box-shadow: 0 10px 20px rgba(255, 96, 20, 0.18);
}

.whcs26-story-title {
  margin: 0 0 14px;
  font-size: 28px;
  line-height: 1.28;
  font-weight: 900;
  color: #111827;
  letter-spacing: -0.8px;
}

.whcs26-story-content p {
  margin: 0 0 16px;
  font-size: 17px;
  line-height: 1.85;
  color: #5f697a;
}

/* =========================
   LESSON BOX
========================= */

.whcs26-lesson-box {
  padding: 17px 18px;
  border-radius: 18px;
  background:
    linear-gradient(135deg, #fff5ef 0%, #fffdfa 100%);
  border: 1px solid #ffdccc;
  color: #2d3645;
  font-size: 16px;
  line-height: 1.8;
}

.whcs26-lesson-box strong {
  color: #ff4a1e;
  font-weight: 900;
}

/* =========================
   SMALL PRINT
========================= */

.whcs26-smallprint {
  margin: 28px 0 0;
  color: #8b95a5;
  font-size: 13px;
  line-height: 1.7;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width: 991px) {
  .whcs26-section {
    padding: 80px 0;
  }

  .whcs26-story-title {
    font-size: 24px;
  }
}

@media (max-width: 767px) {
  .whcs26-section {
    padding: 60px 0;
  }

  .whcs26-main-title {
    font-size: 34px;
    letter-spacing: -1.2px;
  }

  .whcs26-subtitle {
    font-size: 16px;
    line-height: 1.8;
  }

  .whcs26-card-row {
    margin-top: 34px;
  }

  .whcs26-story-card {
    border-radius: 20px;
  }

  .whcs26-story-image-wrap {
    padding: 8px;
  }

  .whcs26-story-image-wrap img {
    border-radius: 14px;
  }

  .whcs26-story-tag {
    left: 16px;
    top: 16px;
    font-size: 10px;
    padding: 7px 10px;
  }

  .whcs26-story-content {
    padding: 20px 18px 18px;
  }

  .whcs26-story-stat {
    font-size: 12px;
    padding: 7px 11px;
  }

  .whcs26-story-title {
    font-size: 22px;
    line-height: 1.3;
  }

  .whcs26-story-content p,
  .whcs26-lesson-box {
    font-size: 15px;
    line-height: 1.75;
  }

  .whcs26-smallprint {
    font-size: 12px;
  }
}

/* ============================================
   WHOP ENGINE — SMART MONEY V2
   Premium Editorial Navy Theme
============================================ */

.whsmp27-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 95px 0 85px;
  background:
    radial-gradient(
      ellipse at 15% 30%,
      rgba(255, 93, 25, .10),
      transparent 35%
    ),
    radial-gradient(
      ellipse at 85% 75%,
      rgba(255, 106, 0, .055),
      transparent 38%
    ),
    linear-gradient(
      135deg,
      #070b14 0%,
      #101b2d 50%,
      #090e19 100%
    );
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #fff;
}

.whsmp27-section * {
  box-sizing: border-box;
}

.whsmp27-section .container {
  z-index: 2;
}

/* Background */

.whsmp27-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(
      rgba(255,255,255,.035) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.035) 1px,
      transparent 1px
    );
  background-size: 42px 42px;
  opacity: .4;
  pointer-events: none;
}

.whsmp27-glow {
  position: absolute;
  left: -220px;
  top: 20%;
  width: 470px;
  height: 470px;
  border-radius: 50%;
  background: rgba(255, 83, 22, .12);
  filter: blur(100px);
  pointer-events: none;
}

/* Eyebrow */

.whsmp27-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  margin-bottom: 24px;
  border-radius: 50px;
  border: 1px solid rgba(255, 121, 61, .3);
  background: rgba(255, 86, 27, .08);
  color: #ffad81;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.5px;
}

.whsmp27-eyebrow i {
  color: #ff6a32;
  font-size: 14px;
}

/* Heading */

.whsmp27-heading {
  max-width: 1050px;
  margin: 0 auto;
  color: #fff;
  font-size: clamp(37px, 4.5vw, 63px);
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -2.3px;
}

.whsmp27-heading span {
  display: block;
  background: linear-gradient(
    100deg,
    #ff2d12,
    #ff6a00
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whsmp27-heading-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 17px;
  margin-top: 28px;
}

.whsmp27-heading-divider span {
  width: 95px;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    #ff7038
  );
}

.whsmp27-heading-divider span:last-child {
  transform: rotate(180deg);
}

.whsmp27-heading-divider i {
  font-size: 12px;
  color: #ff824b;
}

/* Main Row */

.whsmp27-main-row {
  margin-top: 48px;
}

/* Image Visual */

.whsmp27-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  padding: 20px 8px 42px;
}

.whsmp27-visual-glow {
  position: absolute;
  z-index: -1;
  inset: 10%;
  border-radius: 50%;
  background: rgba(255, 100, 28, .18);
  filter: blur(70px);
}

.whsmp27-image-frame {
  position: relative;
  overflow: hidden;
  padding: 15px;
  border-radius: 24px;
  background: linear-gradient(
    145deg,
    rgba(255,255,255,.07),
    rgba(255,255,255,.015)
  );
  border: 1px solid rgba(255, 140, 76, .22);
  box-shadow: 0 25px 70px rgba(0,0,0,.32);
}

.whsmp27-image-frame img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px;
}

.whsmp27-image-caption {
  position: absolute;
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  max-width: 90%;
  padding: 13px 20px;
  border-radius: 14px;
  background: #151d2b;
  border: 1px solid rgba(255, 126, 63, .35);
  box-shadow: 0 15px 35px rgba(0,0,0,.3);
  color: #bfc8d7;
  font-size: 12px;
  font-weight: 700;
}

.whsmp27-image-caption i {
  font-size: 21px;
  color: #ff7135;
}

.whsmp27-image-caption strong {
  display: block;
  margin-top: 2px;
  color: #fff;
  font-size: 17px;
}

/* Quotes */

.whsmp27-quotes {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.whsmp27-quote-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 22px;
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    rgba(255,255,255,.065),
    rgba(255,255,255,.018)
  );
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 10px 25px rgba(0,0,0,.13);
  transition: transform .3s, border-color .3s;
}

.whsmp27-quote-card:hover {
  transform: translateX(5px);
  border-color: rgba(255, 100, 30, .4);
}

.whsmp27-quote-symbol {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  min-width: 43px;
  border-radius: 12px;
  background: linear-gradient(
    100deg,
    #ff2d12,
    #ff6a00
  );
  box-shadow: 0 8px 20px rgba(255, 67, 17, .2);
  font-size: 17px;
  color: #fff;
}

.whsmp27-quote-content {
  min-width: 0;
}

.whsmp27-quote-content blockquote {
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  font-size: 20px;
  line-height: 1.5;
  font-weight: 750;
  color: #fff;
}

.whsmp27-author {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.whsmp27-author strong {
  color: #ff9b6e;
  font-size: 14px;
  font-weight: 850;
}

.whsmp27-author span {
  color: #aeb8c8;
  font-size: 12px;
  line-height: 1.6;
}

/* Bottom */

.whsmp27-bottom-panel {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-top: 48px;
  padding: 27px 28px;
  border: 1px solid rgba(255, 107, 34, .35);
  border-radius: 20px;
  background:
    radial-gradient(
      ellipse at 0% 50%,
      rgba(255, 88, 25, .14),
      transparent 55%
    ),
    rgba(255,255,255,.035);
}

.whsmp27-bottom-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  min-width: 56px;
  border-radius: 15px;
  background: linear-gradient(
    100deg,
    #ff2d12,
    #ff6a00
  );
  font-size: 21px;
  color: #fff;
  box-shadow: 0 10px 24px rgba(255, 73, 18, .2);
}

.whsmp27-bottom-panel p {
  margin: 0;
  color: #d9e1ed;
  font-size: 18px;
  line-height: 1.85;
}

.whsmp27-bottom-panel strong {
  color: #ffab7b;
  font-weight: 850;
}

.whsmp27-disclaimer {
  max-width: 1000px;
  margin: 25px auto 0;
  text-align: center;
  color: #8e9cb1;
  font-size: 12px;
  line-height: 1.8;
}

/* Responsive */

@media (max-width: 991px) {
  .whsmp27-section {
    padding: 75px 0;
  }

  .whsmp27-visual {
    max-width: 580px;
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .whsmp27-section {
    padding: 58px 0;
  }

  .whsmp27-heading {
    font-size: clamp(32px, 8vw, 44px);
    letter-spacing: -1px;
  }

  .whsmp27-main-row {
    margin-top: 30px;
  }

  .whsmp27-quote-card {
    padding: 17px;
    gap: 12px;
    border-radius: 15px;
  }

  .whsmp27-quote-symbol {
    width: 36px;
    height: 36px;
    min-width: 36px;
    font-size: 14px;
  }

  .whsmp27-quote-content blockquote {
    font-size: 17px;
  }

  .whsmp27-bottom-panel {
    flex-direction: column;
    padding: 20px;
    margin-top: 30px;
  }

  .whsmp27-bottom-panel p {
    font-size: 16px;
  }

  .whsmp27-image-frame {
    padding: 9px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whsmp27-quote-card {
    transition: none;
  }
}
/* =============================================
   SMART MONEY V3 - PREMIUM INVESTOR CARDS
   Theme: Navy + Orange/Red
   Prefix: wsmv3-
============================================= */

.wsmv3-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 100px 0 90px;
  background:
    radial-gradient(ellipse at 0% 20%,
      rgba(255, 60, 20, .10), transparent 32%),
    radial-gradient(ellipse at 100% 80%,
      rgba(255, 106, 0, .07), transparent 35%),
    linear-gradient(135deg, #080d17, #101b2f 55%, #080e1a);
  font-family: 'Inter', Arial, sans-serif;
  color: #fff;
  font-size: 18px;
}

.wsmv3-section * {
  box-sizing: border-box;
}

.wsmv3-section .container {
  z-index: 2;
}

/* Background */

.wsmv3-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: .4;
  pointer-events: none;
}

.wsmv3-glow {
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(95px);
  pointer-events: none;
}

.wsmv3-glow-one {
  top: 10%;
  left: -220px;
  background: rgba(255, 60, 20, .12);
}

.wsmv3-glow-two {
  bottom: 0;
  right: -200px;
  background: rgba(255, 106, 0, .10);
}

/* Eyebrow */

.wsmv3-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 25px;
  padding: 11px 20px;
  border: 1px solid rgba(255, 110, 52, .3);
  border-radius: 50px;
  background: rgba(255, 75, 20, .08);
  color: #ffac7b;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.6px;
}

.wsmv3-eyebrow i {
  color: #ff7138;
}

/* Heading */

.wsmv3-heading {
  max-width: 1060px;
  margin: 0 auto;
  color: #fff;
  font-size: clamp(37px, 4.5vw, 62px);
  line-height: 1.18;
  letter-spacing: -2.2px;
  font-weight: 900;
}

.wsmv3-heading span {
  display: block;
  background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.wsmv3-divider {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 17px;
  margin: 30px 0 0;
}

.wsmv3-divider span {
  width: 100px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #ff7137);
}

.wsmv3-divider span:last-child {
  transform: rotate(180deg);
}

.wsmv3-divider i {
  color: #ff8750;
  font-size: 12px;
}

/* Grid */

.wsmv3-cards-row {
  margin-top: 48px;
}

/* Cards */

.wsmv3-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 320px;
  overflow: hidden;
  padding: 28px;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.11);
  background: linear-gradient(145deg,
    rgba(31,42,61,.92),
    rgba(14,23,40,.98));
  box-shadow: 0 22px 55px rgba(0,0,0,.18);
  transition: transform .3s ease,
              border-color .3s ease,
              box-shadow .3s ease;
}

.wsmv3-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  /* background-image: linear-gradient(100deg, #ff2d12 0%, #ff6a00 100%); */
}

.wsmv3-card::after {
  content: "";
  position: absolute;
  right: -80px;
  top: -80px;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: rgba(255, 89, 20, .07);
  filter: blur(45px);
  pointer-events: none;
}

.wsmv3-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 105, 36, .42);
  box-shadow: 0 28px 65px rgba(0,0,0,.28);
}

/* Card Header */

.wsmv3-card-top {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 16px;
}

.wsmv3-feature-image {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border-radius: 16px;
}

.wsmv3-feature-image img {
  display: block;
  width: 100%;
  height: auto;
}

.wsmv3-portrait-wrap {
  width: 82px;
  height: 82px;
  min-width: 82px;
  padding: 4px;
  border-radius: 20px;
  background: linear-gradient(135deg, #ff2d12, #ff6a00);
  box-shadow: 0 10px 28px rgba(255, 79, 23, .2);
}

.wsmv3-portrait-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 16px;
  object-fit: cover;
  object-position: center top;
  background: #192337;
}

.wsmv3-person {
  flex: 1;
  min-width: 0;
}

.wsmv3-person h3 {
  margin: 0 0 5px;
  font-size: 22px;
  font-weight: 850;
  letter-spacing: -.5px;
  color: #fff;
}

.wsmv3-person p {
  margin: 0;
  color: #aebdd0;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 500;
}

.wsmv3-quote-symbol {
  align-self: flex-start;
  color: #ff743d;
  font-size: 23px;
  opacity: .8;
}

/* Divider */

.wsmv3-card-divider {
  height: 1px;
  margin: 23px 0;
  background: linear-gradient(90deg,
    rgba(255, 115, 50, .45),
    rgba(255,255,255,.07) 70%,
    transparent);
}

/* Quote */

.wsmv3-card blockquote {
  flex: 1;
  margin: 0 0 25px;
  padding: 0;
  border: 0;
  color: #f5f8fc;
  font-size: 22px;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: -.3px;
}

/* Footer */

.wsmv3-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.wsmv3-card-footer > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #ffac7d;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 1.3px;
}

.wsmv3-card-index {
  color: #728096;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 1px;
}

/* Bottom Panel */

.wsmv3-bottom-panel {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-top: 45px;
  padding: 28px 30px;
  border: 1px solid rgba(255, 99, 35, .3);
  border-radius: 22px;
  background:
    radial-gradient(ellipse at 0% 50%,
      rgba(255, 70, 20, .13), transparent 60%),
    rgba(255,255,255,.04);
}

.wsmv3-bottom-symbol {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  min-width: 58px;
  border-radius: 16px;
  color: #fff;
  font-size: 22px;
  background-image: linear-gradient(100deg, #ff2d12, #ff6a00);
  box-shadow: 0 10px 28px rgba(255, 75, 20, .2);
}

.wsmv3-bottom-panel p {
  margin: 0;
  color: #d9e3ef;
  font-size: 18px;
  line-height: 1.85;
}

.wsmv3-bottom-panel strong {
  color: #ffac7e;
  font-weight: 850;
}

/* Disclaimer */

.wsmv3-disclaimer {
  max-width: 1000px;
  margin: 27px auto 0;
  color: #909db1;
  font-size: 12px;
  line-height: 1.8;
  text-align: center;
}

/* Responsive */

@media (max-width: 991px) {
  .wsmv3-section {
    padding: 75px 0;
  }

  .wsmv3-card {
    min-height: 280px;
  }
}

@media (max-width: 767px) {
  .wsmv3-section {
    padding: 60px 0;
  }

  .wsmv3-heading {
    font-size: clamp(32px, 8vw, 43px);
    letter-spacing: -1px;
  }

  .wsmv3-cards-row {
    margin-top: 32px;
  }

  .wsmv3-card {
    min-height: auto;
    padding: 20px 18px;
    border-radius: 18px;
  }

  .wsmv3-portrait-wrap {
    width: 62px;
    height: 62px;
    min-width: 62px;
    border-radius: 15px;
  }

  .wsmv3-portrait-wrap img {
    border-radius: 11px;
  }

  .wsmv3-card-top {
    gap: 12px;
  }

  .wsmv3-person h3 {
    font-size: 18px;
  }

  .wsmv3-person p {
    font-size: 12px;
  }

  .wsmv3-quote-symbol {
    font-size: 16px;
  }

  .wsmv3-card blockquote {
    font-size: 18px;
    margin-bottom: 20px;
  }

  .wsmv3-bottom-panel {
    flex-direction: column;
    padding: 22px 18px;
    margin-top: 30px;
  }

  .wsmv3-bottom-panel p {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wsmv3-card {
    transition: none;
  }
}


@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Caveat:wght@600;700&display=swap');

.rcg26-section {
  --rcg-green: #129657;
  --rcg-dark: #18251e;
  --rcg-muted: #65726b;
  background: #fff;
  padding: 110px 0 85px;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  color: var(--rcg-dark);
  overflow: hidden;
}

.rcg26-section * {
  box-sizing: border-box;
}

.rcg26-heading {
  text-align: center;
  max-width: 910px;
  margin: 0 auto 45px;
}

.rcg26-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  background: #eefaf2;
  border: 1px solid #d8f1e0;
  border-radius: 100px;
  color: #14874e;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  margin-bottom: 26px;
}

.rcg26-eyebrow-dot,
.rcg26-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #19b66a;
  box-shadow: 0 0 0 5px rgba(25,182,106,.10);
}

.rcg26-heading h2 {
  font-size: clamp(34px, 4.2vw, 54px);
  font-weight: 800;
  line-height: 1.14;
  letter-spacing: -2px;
  margin-bottom: 22px;
}

.rcg26-heading h2 span {
  display: block;
  color: var(--rcg-green);
}

.rcg26-heading p {
  font-size: 18px;
  line-height: 1.85;
  color: var(--rcg-muted);
  margin: 0;
}

.rcg26-heading p strong {
  color: #16894e;
}

/* MONTH PROGRESS */

.rcg26-progress-box {
  background: #fff;
  border: 1px solid #e6ede8;
  border-radius: 20px;
  padding: 24px 35px;
  box-shadow: 0 12px 35px rgba(19,48,29,.035);
  max-width: 770px;
  margin: 0 auto 35px;
}

.rcg26-progress-label {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: #7b8980;
  letter-spacing: 1.5px;
  font-weight: 800;
  margin-bottom: 20px;
}

.rcg26-steps {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rcg26-step {
  appearance: none;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #929d95;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: color .3s;
  padding: 4px;
  white-space: nowrap;
}

.rcg26-step-number {
  height: 32px;
  width: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #f0f3f1;
  font-size: 12px;
  transition: .3s;
}

.rcg26-step.active,
.rcg26-step.completed {
  color: #118a50;
}

.rcg26-step.active .rcg26-step-number {
  background: #159e5c;
  color: #fff;
  box-shadow: 0 0 0 5px #e6f8ed;
}

.rcg26-step.completed .rcg26-step-number {
  background: #d5f5e1;
  color: #118a50;
}

.rcg26-step-line {
  height: 3px;
  background: #e9eee9;
  border-radius: 10px;
  flex: 1;
  max-width: 105px;
  margin: 0 16px;
  overflow: hidden;
}

.rcg26-step-line span {
  display: block;
  height: 100%;
  width: 0;
  background: #23b66e;
  border-radius: inherit;
  transition: width .5s ease;
}

/* CARDS */

.rcg26-card {
  border-radius: 25px;
  padding: 28px;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: transform .35s, box-shadow .35s;
}

.rcg26-card:hover {
  transform: translateY(-5px);
}

.rcg26-once {
  background: #f8f9fa;
  border: 1px solid #e5e9e6;
  box-shadow: 0 15px 45px rgba(25,45,30,.035);
}

.rcg26-membership {
  background: linear-gradient(150deg, #f5fff8, #e9faef);
  border: 1px solid #9edbb5;
  box-shadow: 0 20px 55px rgba(15,145,75,.095);
}

.rcg26-card-top {
  display: flex;
  align-items: center;
  gap: 13px;
  position: relative;
  padding-bottom: 23px;
  border-bottom: 1px solid rgba(120,150,128,.17);
}

.rcg26-card-icon {
  width: 50px;
  height: 50px;
  min-width: 50px;
  border-radius: 14px;
  background: #e9edeb;
  color: #6b7670;
  display: grid;
  place-items: center;
  font-size: 22px;
}

.rcg26-membership .rcg26-card-icon {
  background: #d7f4e2;
  color: #159b58;
}

.rcg26-card-title {
  min-width: 0;
}

.rcg26-card-title > span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: #939e97;
}

.rcg26-membership .rcg26-card-title > span {
  color: #16894f;
}

.rcg26-card-title h3 {
  font-size: 17px;
  letter-spacing: -.4px;
  font-weight: 800;
  margin: 5px 0 0;
}

.rcg26-featured-badge {
  position: absolute;
  top: -44px;
  right: 0;
  background: #148d50;
  color: white;
  border-radius: 20px;
  padding: 7px 13px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  white-space: nowrap;
}

.rcg26-featured-badge i {
  margin-right: 4px;
}

/* REVENUE HEADER */

.rcg26-revenue-head {
  margin-top: 23px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.rcg26-small-label {
  display: block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: #89968c;
  margin-bottom: 6px;
}

.rcg26-big-number {
  font-size: clamp(33px, 3vw, 43px);
  letter-spacing: -2px;
  font-weight: 800;
  line-height: 1.25;
  color: #5d6860;
  font-variant-numeric: tabular-nums;
}

.rcg26-membership .rcg26-big-number {
  color: #119352;
}

.rcg26-revenue-tag {
  background: #e9ecea;
  color: #78837b;
  padding: 9px 12px;
  border-radius: 9px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .4px;
  white-space: nowrap;
}

.rcg26-membership .rcg26-revenue-tag {
  background: #d8f5e3;
  color: #129553;
}

/* CHART */

.rcg26-chart {
  height: 310px;
  background: white;
  border: 1px solid #e7ece8;
  border-radius: 19px;
  margin-top: 20px;
  position: relative;
  overflow: hidden;
  padding: 25px 22px 18px;
}

.rcg26-membership .rcg26-chart {
  border-color: #c8ead4;
}

.rcg26-gridlines {
  position: absolute;
  left: 22px;
  right: 22px;
  top: 25px;
  bottom: 46px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
}

.rcg26-gridlines span {
  width: 100%;
  border-top: 1px dashed #e9efeb;
}

.rcg26-bars {
  position: relative;
  z-index: 1;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.rcg26-bar-column {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  opacity: .38;
  transition: opacity .45s ease;
}

.rcg26-bar-column.visible,
.rcg26-bar-column.selected {
  opacity: 1;
}

.rcg26-bar-value {
  font-weight: 800;
  color: #7c8780;
  font-size: 15px;
  margin-bottom: 9px;
  white-space: nowrap;
  transition: color .3s;
}

.rcg26-membership .rcg26-bar-value {
  color: #139957;
}

.rcg26-bar-track {
  height: 220px;
  width: 100%;
  max-width: 88px;
  display: flex;
  align-items: flex-end;
}

.rcg26-bar {
  width: 100%;
  height: 0;
  border-radius: 12px 12px 3px 3px;
  transition: height 1s cubic-bezier(.18,.8,.25,1),
              box-shadow .3s;
  position: relative;
  overflow: hidden;
}

.rcg26-grey-bar {
  background: linear-gradient(180deg, #abb5ae, #d2d8d3);
}

.rcg26-green-bar {
  background: linear-gradient(180deg, #39db8a 0%, #16a660 58%, #10864c 100%);
  box-shadow: 0 6px 17px rgba(17,155,84,.17);
}

.rcg26-green-bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: 12%;
  right: 12%;
  height: 40%;
  background: linear-gradient(180deg, rgba(255,255,255,.25), transparent);
  border-radius: 10px;
}

.rcg26-bar-column.selected .rcg26-green-bar {
  box-shadow: 0 8px 24px rgba(18,171,89,.28);
}

.rcg26-bar-label {
  font-size: 13px;
  font-weight: 700;
  color: #77827a;
  padding-top: 14px;
  white-space: nowrap;
}

.rcg26-bar-column.selected .rcg26-bar-label {
  color: #138e51;
}

/* HANDWRITTEN */

.rcg26-hand-note {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  color: #128b4f;
  margin: 8px 2px -6px;
  transform: rotate(-3deg);
  pointer-events: none;
}

.rcg26-hand-note span {
  font-family: 'Caveat', cursive;
  font-size: 28px;
  font-weight: 700;
}

.rcg26-hand-note svg {
  width: 55px;
  height: 35px;
  transform: rotate(-22deg);
}

/* EXPLANATIONS */

.rcg26-card-bottom {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 28px 2px 3px;
  margin-top: auto;
}

.rcg26-bottom-icon {
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e5eae7;
  color: #6d7870;
  font-size: 20px;
}

.rcg26-membership .rcg26-bottom-icon {
  background: #d1f2dd;
  color: #159754;
}

.rcg26-card-bottom p {
  margin: 0;
  color: #68756c;
  line-height: 1.75;
  font-size: 16px;
}

.rcg26-card-bottom strong {
  color: #118b4e;
}

/* SUMMARY */

.rcg26-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  background: #f5fbf7;
  border: 1px solid #d7eddf;
  border-radius: 20px;
  padding: 30px 37px;
  margin-top: 30px;
}

.rcg26-summary-eyebrow {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: #178b51;
  margin-bottom: 10px;
}

.rcg26-summary h3 {
  font-size: clamp(19px, 2vw, 25px);
  font-weight: 700;
  line-height: 1.5;
  margin: 0;
  max-width: 600px;
}

.rcg26-summary h3 strong {
  font-weight: 800;
  color: #0f9853;
}

.rcg26-summary-stat {
  text-align: right;
  flex-shrink: 0;
}

.rcg26-summary-stat span {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: #86958b;
  letter-spacing: 1.1px;
  margin-bottom: 8px;
}

.rcg26-summary-stat strong {
  font-size: 38px;
  font-weight: 800;
  color: #119654;
  letter-spacing: -1.4px;
  font-variant-numeric: tabular-nums;
}

.rcg26-disclaimer {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 9px;
  color: #929d95;
  margin: 27px auto 0;
  text-align: center;
}

.rcg26-disclaimer i {
  font-size: 15px;
  margin-top: 2px;
}

.rcg26-disclaimer p {
  font-size: 12px;
  line-height: 1.7;
  margin: 0;
}

/* ANIMATION */

@keyframes rcg26Pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(25,182,106,.18); }
  50% { box-shadow: 0 0 0 7px rgba(25,182,106,0); }
}

.rcg26-live-dot {
  animation: rcg26Pulse 2s infinite;
}

/* RESPONSIVE */

@media (max-width: 991px) {
  .rcg26-section {
    padding: 75px 0;
  }

  .rcg26-card {
    padding: 25px;
  }

  .rcg26-membership {
    margin-top: 8px;
  }
}

@media (max-width: 575px) {
  .rcg26-section {
    padding: 60px 0;
  }

  .rcg26-heading h2 {
    font-size: 34px;
    letter-spacing: -1.2px;
  }

  .rcg26-heading p {
    font-size: 16px;
  }

  .rcg26-progress-box {
    padding: 22px 14px;
  }

  .rcg26-step {
    font-size: 12px;
    gap: 5px;
  }

  .rcg26-step-number {
    width: 27px;
    height: 27px;
    font-size: 11px;
  }

  .rcg26-step-line {
    margin: 0 5px;
  }

  .rcg26-card {
    padding: 18px;
    border-radius: 20px;
  }

  .rcg26-card-title h3 {
    font-size: 15px;
  }

  .rcg26-card-icon {
    width: 43px;
    height: 43px;
    min-width: 43px;
  }

  .rcg26-revenue-tag {
    font-size: 9px;
    padding: 8px;
  }

  .rcg26-chart {
    padding: 20px 12px 15px;
    height: 285px;
  }

  .rcg26-bars {
    gap: 9px;
  }

  .rcg26-bar-track {
    height: 200px;
  }

  .rcg26-bar-value {
    font-size: 13px;
  }

  .rcg26-bar-label {
    font-size: 12px;
  }

  .rcg26-hand-note span {
    font-size: 25px;
  }

  .rcg26-summary {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 20px;
  }

  .rcg26-summary-stat {
    text-align: left;
  }

  .rcg26-disclaimer {
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rcg26-section *,
  .rcg26-section *::before,
  .rcg26-section *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}



@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

.rsc26-section {
background: #fff;
  padding: 30px 0 41px 00;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  color: #121b2b;
  overflow: hidden;
}

.rsc26-section * {
  box-sizing: border-box;
}

/* MAIN CARDS */

.rsc26-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 26px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid #e5e7ee;
  box-shadow: 0 16px 45px rgba(20,30,55,.06);
  transition: transform .35s ease, box-shadow .35s ease;
}

.rsc26-card:hover {
  transform: translateY(-5px);
}

.rsc26-card-old {
  background: linear-gradient(150deg, #fffafa, #fff);
  border-top: 4px solid #e8768e;
}

.rsc26-card-new {
  background: linear-gradient(150deg, #f7fff9, #fff);
  border-top: 4px solid #27bd71;
}

.rsc26-card-old:hover {
  box-shadow: 0 22px 55px rgba(214,77,106,.10);
}

.rsc26-card-new:hover {
  box-shadow: 0 22px 55px rgba(35,171,95,.12);
}

/* HEADER */

.rsc26-card-header {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 24px;
  border-bottom: 1px solid #edf0f2;
  margin-bottom: 23px;
}

.rsc26-media-wrap {
  position: relative;
  flex-shrink: 0;
}

.rsc26-media-box {
  width: 82px;
  height: 82px;
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 24px rgba(0,0,0,.11);
}

.rsc26-media-old {
  background: linear-gradient(135deg, #f08095, #f1a144);
}

.rsc26-media-new {
  background: linear-gradient(135deg, #36d1a4, #138f56);
}

.rsc26-media-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rsc26-card-number {
  position: absolute;
  top: -9px;
  right: -9px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #0f172a;
  color: #fff;
  display: grid;
  place-items: center;
  border: 3px solid white;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 5px 15px rgba(0,0,0,.15);
}

.rsc26-heading-content {
  min-width: 0;
}

.rsc26-card-label {
display: inline-block;
  padding: 7px 13px;
  border-radius: 30px;
  font-size: 26px;
  font-weight: 800;
  margin-bottom: 11px;
  text-align: center;
}

.rsc26-label-old {
  background: #fff0f2;
  border: 1px solid #fbd0d8;
  color: #d5526b;
}

.rsc26-label-new {
  background: #e7faed;
  border: 1px solid #bcebcf;
  color: #138e4d;
}

.rsc26-card-title {
font-size: clamp(23px, 2vw, 25px);
  line-height: 1.5;
  letter-spacing: -.7px;
  font-weight: 800;
  color: #111827;
  margin: 0;
}

/* INDIVIDUAL POINT CARDS */

.rsc26-points {
  display: flex;
  flex-direction: column;
  gap: 15px;
  flex: 1;
}

.rsc26-point-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 13px;
  background: #ffffff;
  border: 1px solid #e9ebef;
  border-radius: 15px;
  padding: 19px 17px;
  box-shadow: 0 5px 16px rgba(23,37,58,.035);
  transition: transform .3s ease,
              box-shadow .3s ease,
              border-color .3s ease;
}

.rsc26-point-card:hover {
  transform: translateY(-3px);
}

.rsc26-card-old .rsc26-point-card:hover {
  border-color: #f1c3cd;
  box-shadow: 0 10px 25px rgba(220,90,114,.08);
}

.rsc26-card-new .rsc26-point-card:hover {
  border-color: #b7e8c9;
  box-shadow: 0 10px 25px rgba(23,166,87,.08);
}

/* POINT ICON */

.rsc26-point-icon {
  width: 37px;
  height: 37px;
  min-width: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  font-size: 18px;
  margin-top: 2px;
}

.rsc26-card-old .rsc26-point-icon {
  background: #fff0f3;
  color: #d95e78;
  border: 1px solid #f8d8df;
}

.rsc26-card-new .rsc26-point-icon {
  background: #e8f9ee;
  color: #169a58;
  border: 1px solid #c8eed6;
}

/* POINT TEXT */

.rsc26-point-card p {
  font-size: 16px;
  line-height: 1.8;
  color: #505c68;
  margin: 0;
}

.rsc26-point-card strong {
  color: #17202e;
  font-weight: 800;
}

.rsc26-card-old .rsc26-point-card strong {
  color: #c64e65;
}

/* FEATURED FINAL POINT */

.rsc26-point-featured {
  background: linear-gradient(135deg, #e9fbef, #f7fff9);
  border: 1px solid #bce8cb;
  margin-top: auto;
}

.rsc26-point-featured p {
  color: #137f48;
  font-size: 17px;
}

.rsc26-point-featured strong {
  color: #117e46;
}

/* REVEAL ANIMATION */

.rsc26-js .rsc26-card {
  opacity: 0;
  transform: translateY(30px);
}

.rsc26-js .rsc26-card.rsc26-show {
  animation: rsc26Reveal .75s ease forwards;
}

.rsc26-js .rsc26-card-new.rsc26-show {
  animation-delay: .12s;
}

@keyframes rsc26Reveal {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* RESPONSIVE */

@media (max-width: 1199px) {
  .rsc26-card {
    padding: 22px;
  }

  .rsc26-card-header {
    gap: 14px;
  }

  .rsc26-media-box {
    width: 68px;
    height: 68px;
  }

  .rsc26-card-title {
    font-size: 24px;
  }
}

@media (max-width: 991px) {
  .rsc26-section {
    padding: 70px 0;
  }

  .rsc26-card-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .rsc26-card-title {
    font-size: 23px;
  }

  .rsc26-point-card {
    padding: 15px 12px;
    gap: 10px;
  }

  .rsc26-point-card p {
    font-size: 15px;
    line-height: 1.7;
  }
}

@media (max-width: 767px) {
  .rsc26-section {
    padding: 55px 0;
  }

  .rsc26-card {
    padding: 20px;
    border-radius: 20px;
  }

  .rsc26-card-header {
    flex-direction: row;
    align-items: center;
  }

  .rsc26-media-box {
    width: 65px;
    height: 65px;
  }

  .rsc26-card-title {
    font-size: 22px;
  }

  .rsc26-point-card {
    padding: 16px 14px;
  }

  .rsc26-point-card p {
    font-size: 16px;
  }
}

@media (max-width: 420px) {
  .rsc26-card-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .rsc26-point-icon {
    width: 32px;
    height: 32px;
    min-width: 32px;
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rsc26-card,
  .rsc26-point-card {
    transition: none;
  }

  .rsc26-js .rsc26-card,
  .rsc26-js .rsc26-card.rsc26-show {
    opacity: 1;
    transform: none;
    animation: none;
  }
}


/* SECTION */

.whzig26-section {
padding: 50px 0 50px 0;
  background: #ffffff;
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
}

.whzig26-section * {
  box-sizing: border-box;
}

.whzig26-kicker {
  margin-bottom: 15px;
  font-family: "Segoe Print", cursive;
  font-size: 35px;
  font-weight: 800;
  font-style: italic;
  color: #ff391b;
}

.whzig26-heading {
  margin: 0 auto 20px;
  font-size: clamp(34px, 4.5vw, 60px);
  line-height: 1.17;
  letter-spacing: -2px;
  font-weight: 900;
  color: #10131b;
}

.whzig26-heading span {
  background: linear-gradient(100deg, #ff2d12, #ff6a00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whzig26-subtitle {
  /* max-width: 830px; */
  margin: 0 auto;
  color: #667085;
  font-size: 19px;
  line-height: 1.8;
}

/* SINGLE CARD PER ROW */

.whzig26-features {
  display: flex;
  flex-direction: column;
  gap: 25px;
  margin-top: 55px;
}

.whzig26-card {
  --whzig-accent: #ff5b36;
  --whzig-border: #ffd9cf;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #fff3ee;

  overflow: hidden;
  border: 1px solid var(--whzig-border);
  border-radius: 24px;

  background: linear-gradient(
    115deg,
    var(--whzig-bg1),
    var(--whzig-bg2)
  );

  box-shadow: 0 15px 40px rgba(16, 24, 40, .06);
  transition: transform .3s ease, box-shadow .3s ease;
}

.whzig26-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 23px 55px rgba(16, 24, 40, .10);
}

/* BOOTSTRAP ROW */

.whzig26-card > .row {
  min-height: 245px;
}

/* IMAGE */

.whzig26-image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 245px;
  padding: 20px;
}

.whzig26-image::before {
  content: "";
  position: absolute;
  width: 75%;
  height: 75%;
  border-radius: 50%;
  background: var(--whzig-accent);
  opacity: .07;
  filter: blur(25px);
}

.whzig26-image img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  /* max-width: 440px; */
max-height: 370px;
  object-fit: contain;
  filter: drop-shadow(0 12px 18px rgba(15, 23, 42, .1));
  transition: transform .35s ease;
}

.whzig26-card:hover .whzig26-image img {
  transform: scale(1.035);
}

/* CONTENT */

.whzig26-content {
  padding: 35px 38px;
}

.whzig26-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 17px;
}

.whzig26-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 45px;
  height: 45px;
  border-radius: 13px;
  color: var(--whzig-accent);
  background: rgba(255,255,255,.85);
  border: 1px solid var(--whzig-border);
  font-size: 17px;
}

.whzig26-number {
  color: var(--whzig-accent);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.5px;
}

.whzig26-content h3 {
  margin: 0 0 13px;
  color: #101828;
  font-size: clamp(25px, 2.8vw, 35px);
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -1px;
}

.whzig26-content p {
  margin: 0;
  color: #475467;
  font-size: 18px;
  line-height: 1.75;
}

/* 12 DIFFERENT THEMES */

.whzig26-theme-1 {
  --whzig-accent: #ff5738;
  --whzig-border: #ffd3c8;
  --whzig-bg1: #fffefe;
  --whzig-bg2: #fff0ea;
}

.whzig26-theme-2 {
  --whzig-accent: #2688e8;
  --whzig-border: #cce6ff;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #eaf6ff;
}

.whzig26-theme-3 {
  --whzig-accent: #8950d7;
  --whzig-border: #e6d8ff;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #f5edff;
}

.whzig26-theme-4 {
  --whzig-accent: #0aa89c;
  --whzig-border: #bcece6;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #e8fcf8;
}

.whzig26-theme-5 {
  --whzig-accent: #df4b86;
  --whzig-border: #ffd5e6;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #fff0f6;
}

.whzig26-theme-6 {
  --whzig-accent: #d78a14;
  --whzig-border: #f7e1ae;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #fff7df;
}

.whzig26-theme-7 {
  --whzig-accent: #5767dd;
  --whzig-border: #d8ddff;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #eff1ff;
}

.whzig26-theme-8 {
  --whzig-accent: #ec7656;
  --whzig-border: #ffdbcd;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #fff3e9;
}

.whzig26-theme-9 {
  --whzig-accent: #159cbc;
  --whzig-border: #c9edf5;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #eafaff;
}

.whzig26-theme-10 {
  --whzig-accent: #16994a;
  --whzig-border: #a9e6ba;
  --whzig-bg1: #fafffb;
  --whzig-bg2: #e1f9e9;
}

.whzig26-theme-11 {
  --whzig-accent: #a03fd1;
  --whzig-border: #edd2ff;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #faedff;
}

.whzig26-theme-12 {
  --whzig-accent: #4477a8;
  --whzig-border: #d2e3f1;
  --whzig-bg1: #ffffff;
  --whzig-bg2: #ecf5fb;
}

/* RESPONSIVE */

@media (max-width: 991px) {
  .whzig26-section {
    padding: 75px 0;
  }

  .whzig26-content {
    padding: 25px;
  }

  .whzig26-content h3 {
    font-size: 27px;
  }
}

@media (max-width: 767px) {
  .whzig26-section {
    padding: 55px 0;
  }

  .whzig26-kicker {
    font-size: 29px;
  }

  .whzig26-heading {
    font-size: clamp(32px, 8vw, 43px);
    letter-spacing: -1.1px;
  }

  .whzig26-subtitle {
    font-size: 16px;
  }

  .whzig26-features {
    margin-top: 35px;
    gap: 18px;
  }

  .whzig26-card {
    border-radius: 19px;
  }

  .whzig26-image {
    min-height: 210px;
    padding: 17px;
  }

  .whzig26-image img {
    max-height: 185px;
  }

  .whzig26-content {
    padding: 5px 22px 25px;
  }

  .whzig26-content h3 {
    font-size: 25px;
  }

  .whzig26-content p {
    font-size: 16px;
    line-height: 1.7;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whzig26-card,
  .whzig26-image img {
    transition: none;
  }
}

/* ===============================================
   WHOP ENGINE SHOWCASE — PREMIUM DARK
   Prefix: wshow26-
=============================================== */

.wshow26-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 100px 0 95px;

  background:
    radial-gradient(
      ellipse at 5% 15%,
      rgba(112, 54, 209, 0.10),
      transparent 35%
    ),
    radial-gradient(
      ellipse at 95% 75%,
      rgba(255, 75, 35, 0.07),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      #080b14 0%,
      #101426 48%,
      #080d18 100%
    );

  color: #ffffff;
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
}

.wshow26-section * {
  box-sizing: border-box;
}

.wshow26-section .container {
  z-index: 2;
}

/* ===============================================
   BACKGROUND DECORATION
=============================================== */

.wshow26-grid-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.035) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.035) 1px,
      transparent 1px
    );

  background-size: 42px 42px;
  opacity: 0.4;
}

.wshow26-glow {
  position: absolute;
  width: 440px;
  height: 440px;
  border-radius: 50%;
  filter: blur(95px);
  pointer-events: none;
}

.wshow26-glow-left {
  top: 12%;
  left: -230px;
  background: rgba(125, 64, 255, 0.13);
}

.wshow26-glow-right {
  right: -220px;
  bottom: 5%;
  background: rgba(255, 97, 22, 0.10);
}

/* ===============================================
   SECTION HEADER
=============================================== */

.wshow26-eyebrow {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 12px;

  padding: 11px 21px;
  margin-bottom: 25px;

  border: 1px solid rgba(255, 116, 52, 0.28);
  background: rgba(255, 86, 36, 0.08);
  border-radius: 50px;

  color: #ffab7a;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1.4px;
}

.wshow26-eyebrow-dot {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-radius: 50%;
  background: #ff6731;
  box-shadow: 0 0 0 4px rgba(255, 103, 49, 0.12);
}

.wshow26-main-heading {
  max-width: 1010px;
  margin: 0 auto;
  color: #ffffff;

  font-size: clamp(38px, 4.7vw, 64px);
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: -2.5px;
}

.wshow26-main-heading > span {
  background-image: linear-gradient(
    100deg,
    #ff2d12 0%,
    #ff6a00 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #ff5a25;
}

.wshow26-heading-underline {
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
}

.wshow26-heading-underline::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 10px;
  background: linear-gradient(90deg, #ff2d12, #ff6a00);
}

/* ===============================================
   SHOWCASE LIST
=============================================== */

.wshow26-showcase-list {
  display: flex;
  flex-direction: column;
  gap: 30px;
  max-width: 1150px;
  margin: 60px auto 0;
}

/* ===============================================
   MAIN SHOWCASE CARD
=============================================== */

.wshow26-card {
  --wshow-accent: #a65bff;
  --wshow-border: rgba(166, 91, 255, 0.43);
  --wshow-bg: rgba(140, 70, 255, 0.08);

  position: relative;
  overflow: hidden;
  border: 1px solid var(--wshow-border);
  border-radius: 24px;

  background:
    radial-gradient(
      ellipse at 50% 0%,
      var(--wshow-bg),
      transparent 70%
    ),
    linear-gradient(
      145deg,
      #181b2b,
      #101522
    );

  box-shadow:
    0 25px 65px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease;
}

.wshow26-card::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--wshow-accent);
  opacity: 0.9;
}

.wshow26-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 30px 75px rgba(0, 0, 0, 0.35);
}

.wshow26-card > .row {
  min-height: 315px;
}

/* ===============================================
   FOUR UNIQUE CARD COLORS
=============================================== */

/* Step 1 — Purple */
.wshow26-theme-purple {
  --wshow-accent: #b56bff;
  --wshow-border: rgba(181, 107, 255, 0.4);
  --wshow-bg: rgba(158, 72, 255, 0.12);
}

/* Step 2 — Electric Blue */
.wshow26-theme-blue {
  --wshow-accent: #36aaff;
  --wshow-border: rgba(54, 170, 255, 0.4);
  --wshow-bg: rgba(35, 148, 255, 0.11);
}

/* Step 3 — Orange */
.wshow26-theme-orange {
  --wshow-accent: #ff812e;
  --wshow-border: rgba(255, 129, 46, 0.4);
  --wshow-bg: rgba(255, 104, 25, 0.12);
}

/* Step 4 — Green */
.wshow26-theme-green {
  --wshow-accent: #43d995;
  --wshow-border: rgba(67, 217, 149, 0.4);
  --wshow-bg: rgba(34, 197, 111, 0.11);
}

/* ===============================================
   CARD CONTENT
=============================================== */

.wshow26-card-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  padding: 42px 38px;
}

.wshow26-step-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  align-self: flex-start;

  padding: 10px 15px;
  margin-bottom: 23px;

  border-radius: 50px;
  border: 1px solid var(--wshow-border);

  background: var(--wshow-bg);
  color: var(--wshow-accent);

  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1px;
}

.wshow26-step-badge i {
  font-size: 13px;
}

.wshow26-card-content h3 {
  margin: 0 0 19px;

  font-size: clamp(27px, 2.8vw, 37px);
  line-height: 1.25;
  letter-spacing: -1px;

  font-weight: 900;
  color: #ffffff;
}

.wshow26-card-content h3 span {
  color: var(--wshow-accent);
}

.wshow26-card-content p {
  margin: 0;
  color: #c2ccda;
  font-size: 18px;
  line-height: 1.8;
  font-weight: 450;
}

.wshow26-card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-top: 26px;
}

.wshow26-screenshot-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #bcc7da;
  font-size: 12px;
  font-weight: 700;
}

.wshow26-screenshot-tag i {
  color: var(--wshow-accent);
}

.wshow26-direction {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 39px;
  height: 39px;
  border-radius: 12px;

  background: var(--wshow-bg);
  border: 1px solid var(--wshow-border);
  color: var(--wshow-accent);
}

/* ===============================================
   BROWSER SCREENSHOT FRAME
=============================================== */

.wshow26-image-area {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 30px;
}

.wshow26-browser {
  width: 100%;
  overflow: hidden;
  border-radius: 17px;
  border: 1px solid var(--wshow-border);

  background: #090d16;
  box-shadow:
    0 22px 45px rgba(0, 0, 0, 0.35),
    0 0 35px var(--wshow-bg);
}

.wshow26-browser-top {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 41px;
  padding: 0 13px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  background: #171b29;
}

.wshow26-browser-dots {
  display: flex;
  gap: 5px;
  flex-shrink: 0;
}

.wshow26-browser-dots span {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.wshow26-browser-dots span:nth-child(1) {
  background: #ff625b;
}

.wshow26-browser-dots span:nth-child(2) {
  background: #ffc15e;
}

.wshow26-browser-dots span:nth-child(3) {
  background: #4dcb86;
}

.wshow26-browser-url {
  flex: 1;
  min-width: 0;
  text-align: center;
  padding-right: 27px;
  color: #9caabe;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
}

.wshow26-browser-url i {
  margin-right: 5px;
  color: var(--wshow-accent);
}

.wshow26-browser-screen {
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 10;
  background:
    linear-gradient(135deg, #1b2030, #0a0f19);
}

.wshow26-browser-screen img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ===============================================
   BOTTOM CTA PANEL
=============================================== */

.wshow26-cta-panel {
  position: relative;
  overflow: hidden;
  max-width: 1050px;
  margin: 60px auto 0;
  padding: 44px 30px;

  border: 1px solid rgba(255, 112, 47, 0.35);
  border-radius: 25px;

  background:
    radial-gradient(
      ellipse at 50% 0%,
      rgba(255, 101, 32, 0.12),
      transparent 75%
    ),
    linear-gradient(135deg, #191b29, #111724);

  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.22);
  text-align: center;
}

.wshow26-cta-glow {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  width: 380px;
  height: 230px;
  background: rgba(255, 101, 30, 0.13);
  border-radius: 50%;
  filter: blur(60px);
  pointer-events: none;
}

.wshow26-cta-inner {
  position: relative;
  z-index: 2;
}

.wshow26-cta-inner h3 {
  max-width: 850px;
  margin: 0 auto 29px;
  color: #fff;
  font-size: clamp(25px, 3vw, 39px);
  font-weight: 900;
  line-height: 1.4;
  letter-spacing: -1px;
}

.wshow26-cta-inner h3 span {
  color: #ff9559;
}

.wshow26-cta-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 13px;

  max-width: 100%;
  min-height: 67px;
  padding: 18px 30px;

  border-radius: 12px;
  background-image: linear-gradient(
    100deg,
    #ff2d12 0%,
    #ff6a00 100%
  );

  color: #fff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 900;

  box-shadow: 0 15px 30px rgba(255, 77, 19, 0.24);
  transition: transform .3s ease, box-shadow .3s ease;
}

.wshow26-cta-button:hover {
  transform: translateY(-4px);
  color: #fff;
  box-shadow: 0 20px 40px rgba(255, 77, 19, 0.35);
}

.wshow26-cta-inner > p {
  margin: 17px 0 0;
  color: #aeb9ca;
  font-size: 13px;
  font-weight: 650;
}

.wshow26-cta-inner > p i {
  margin-right: 5px;
  color: #ff9559;
}

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

@media (max-width: 991px) {

  .wshow26-section {
    padding: 75px 0;
  }

  .wshow26-card-content {
    padding: 30px 25px;
  }

  .wshow26-image-area {
    padding: 20px;
  }

  .wshow26-card-content h3 {
    font-size: 29px;
  }

  .wshow26-card-content p {
    font-size: 16px;
  }
}

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

@media (max-width: 767px) {

  .wshow26-section {
    padding: 60px 0;
  }

  .wshow26-main-heading {
    font-size: clamp(33px, 8vw, 45px);
    line-height: 1.23;
    letter-spacing: -1.2px;
  }

  .wshow26-eyebrow {
    font-size: 10px;
    padding: 10px 14px;
    letter-spacing: 0.7px;
  }

  .wshow26-showcase-list {
    margin-top: 35px;
    gap: 20px;
  }

  .wshow26-card {
    border-radius: 19px;
  }

  .wshow26-card > .row {
    min-height: auto;
  }

  .wshow26-card-content {
    padding: 25px 20px 15px;
  }

  .wshow26-card-content h3 {
    font-size: 27px;
  }

  .wshow26-card-content p {
    font-size: 16px;
    line-height: 1.75;
  }

  .wshow26-image-area {
    padding: 15px 20px 22px;
  }

  .wshow26-browser {
    border-radius: 12px;
  }

  .wshow26-browser-top {
    min-height: 34px;
  }

  .wshow26-browser-url {
    font-size: 9px;
  }

  .wshow26-cta-panel {
    padding: 30px 18px;
    margin-top: 35px;
    border-radius: 18px;
  }

  .wshow26-cta-inner h3 {
    font-size: 25px;
  }

  .wshow26-cta-button {
    width: 100%;
    min-height: 59px;
    padding: 15px 10px;
    font-size: 14px;
    gap: 8px;
  }

  .wshow26-cta-inner > p {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wshow26-card,
  .wshow26-cta-button {
    transition: none;
  }
}

 /* =========================================
       WHOP ENGINE - THE OLD WAY
       Ultra Premium Reference Style
       ========================================= */

    .whold26-section {
      padding: 95px 0;
      background: #fffdfa;
      font-family: 'Inter', sans-serif;
      font-size: 18px;
      color: #151515;
      overflow: hidden;
    }

    .whold26-section * {
      box-sizing: border-box;
    }

    /* HEADING */

    .whold26-header {
      text-align: center;
      max-width: 1040px;
      margin: 0 auto 48px;
    }

    .whold26-kicker {
      display: inline-block;
      padding: 9px 20px;
      background: #fff0e5;
      border: 1px solid #ffd4bc;
      border-radius: 50px;
      color: #ff421b;
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 1.3px;
      margin-bottom: 20px;
    }

    .whold26-heading {
 font-size: clamp(34px, 4.6vw, 50px);
  font-weight: 900;
  line-height: 1.17;
  letter-spacing: -2px;
  color: #101010;
  margin: 0;
    }

    .whold26-heading span {
      background: linear-gradient(
        100deg,
        #ff2d12 0%,
        #ff6a00 100%
      );
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    /* CARDS */

    .whold26-card {
      height: 100%;
      padding: 13px;
      border: 2px solid #ff6a00;
      border-radius: 20px;
      background: linear-gradient(
        180deg,
        #070707 0%,
        #351404 100%
      );
      transition: transform .3s ease,
                  box-shadow .3s ease;
    }

    /* ALTERNATING WHITE CARDS */

    .whold26-cards-row > div:nth-child(even)
    .whold26-card {
      background: #ffffff;
    }

    .whold26-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 35px
        rgba(255, 88, 20, .14);
    }

    /* IMAGE */

    .whold26-card-media {
      position: relative;
      overflow: hidden;
      border-radius: 13px;
      background: #161616;
    }

    .whold26-card-media img {
      display: block;
      width: 100%;
    height: 255px;
      object-fit: cover;
    }

    /* RED X BADGE */

    .whold26-badge {
      position: absolute;
      bottom: 10px;
      left: 10px;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 7px 13px;
      border-radius: 30px;
      background: linear-gradient(
        100deg,
        #ff2d12,
        #ff6a00
      );
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      box-shadow: 0 5px 15px rgba(0,0,0,.2);
    }

    .whold26-badge-icon {
      width: 21px;
      height: 21px;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
      background: #ffffff;
      color: #ff3216;
      font-size: 13px;
      font-weight: 900;
    }

    /* CARD CONTENT */

    .whold26-card-body {
      padding: 20px 8px 14px;
      text-align: center;
    }

    .whold26-card-body h3 {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 70px;
      padding: 12px;
      margin: 0 0 15px;
      border-radius: 7px;
      background: #ffffff;
      color: #111111;
      font-size: 19px;
      line-height: 1.35;
      font-weight: 900;
    }

    .whold26-cards-row > div:nth-child(even)
    .whold26-card-body h3 {
      background: linear-gradient(
        100deg,
        #a72208,
        #ff6a00
      );
      color: #ffffff;
    }

    .whold26-cost {
      margin: 0;
      color: #ffb581;
      font-size: 18px;
      font-weight: 800;
      line-height: 1.5;
    }

    .whold26-cards-row > div:nth-child(even)
    .whold26-cost {
      color: #e74b1c;
    }

    /* COMPARISON */

    .whold26-compare-row {
      margin-top: 50px;
    }

    .whold26-compare-box {
      height: 100%;
      padding: 30px 22px;
      border-radius: 20px;
      text-align: center;
      border: 2px solid;
    }

    .whold26-compare-old {
      background: #fff3ee;
      border-color: #ffd0bf;
    }

    .whold26-compare-new {
      background: linear-gradient(
        135deg,
        #241005,
        #090909
      );
      border-color: #ff6a00;
      box-shadow: 0 15px 35px
        rgba(255, 93, 20, .13);
    }

    .whold26-compare-label {
      font-size: 15px;
      font-weight: 850;
      margin-bottom: 10px;
      color: #ec4d24;
    }

    .whold26-compare-new
    .whold26-compare-label {
      color: #ffab74;
    }

    .whold26-compare-value {
      font-size: clamp(34px, 4vw, 52px);
      line-height: 1.2;
      font-weight: 900;
      letter-spacing: -1.5px;
      margin-bottom: 12px;
      color: #191919;
    }

    .whold26-compare-new
    .whold26-compare-value {
      color: #ff8d45;
    }

    .whold26-compare-box p {
      margin: 0;
      font-size: 18px;
      line-height: 1.7;
      color: #555;
    }

    .whold26-compare-new p {
      color: #ffffff;
    }

    /* SMALL PRINT */

    .whold26-note {
      margin: 30px 0 0;
      color: #777;
      text-align: center;
      font-size: 13px;
      line-height: 1.7;
    }

    /* RESPONSIVE */

    @media (max-width: 991px) {
      .whold26-section {
        padding: 75px 0;
      }

      .whold26-card-media img {
        height: 190px;
      }
    }

    @media (max-width: 767px) {
      .whold26-section {
        padding: 55px 0;
      }

      .whold26-heading {
        font-size: 34px;
        letter-spacing: -1px;
      }

      .whold26-header {
        margin-bottom: 32px;
      }

      .whold26-card {
        border-radius: 16px;
      }

      .whold26-card-body h3 {
        font-size: 18px;
      }

      .whold26-compare-row {
        margin-top: 32px;
      }

      .whold26-compare-box {
        padding: 24px 18px;
      }

      .whold26-compare-box p {
        font-size: 16px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .whold26-card {
        transition: none;
      }
    }


    
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

.whc26-section {
  --whc-green: #159b59;
  --whc-dark: #17231d;
  --whc-muted: #526358;

  position: relative;
  overflow: hidden;
  background:
    radial-gradient(
      ellipse at 90% 45%,
      rgba(40, 190, 110, .045),
      transparent 38%
    ),
    #ffffff;

padding: 30px 0 30px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  color: var(--whc-dark);
}

.whc26-section * {
  box-sizing: border-box;
}

/* CENTER HEADING */

.whc26-heading {
  max-width: 1000px;
  margin: 0 auto 60px;
  text-align: center;
}

.whc26-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px;
  min-height: 40px;
  border-radius: 100px;
  background: #eaf9f0;
  border: 1px solid #cdebd9;
  color: #148a50;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .5px;
  margin-bottom: 22px;
}

.whc26-title {
  max-width: 1000px;
  margin: 0 auto;
  color: #14221a;
font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.16;
  letter-spacing: -1.9px;
  font-weight: 800;
  text-align: center;
}

.whc26-title span {
  color: #139d58;
  background: linear-gradient(
    90deg,
    #108a4c 0%,
    #19b56a 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* LEFT CONTENT */

.whc26-content {
  position: relative;
  z-index: 2;
  width: 100%;
}

.whc26-points {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 32px;
}

/* PREMIUM POINT CARDS */

.whc26-point {
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 15px 18px;
  border-radius: 14px;

  background: #ffffff;
  border: 1px solid #e1eae4;

  box-shadow:
    0 5px 20px rgba(20, 65, 38, .035);

  transition:
    transform .3s ease,
    border-color .3s ease,
    background .3s ease,
    box-shadow .3s ease;
}

.whc26-point:hover {
  transform: translateX(5px);
  background: #f5fcf7;
  border-color: #b8e5c8;
  box-shadow:
    0 10px 28px rgba(20, 145, 73, .085);
}

/* CHECK ICON */

.whc26-point-icon {
  width: 30px;
  height: 30px;
  min-width: 30px;

  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;

  background: linear-gradient(
    135deg,
    #28c979,
    #119252
  );

  color: #ffffff;
  font-size: 17px;
  box-shadow: 0 5px 13px rgba(25, 164, 88, .15);
}

.whc26-point p {
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
  font-weight: 600;
  color: #344439;
}

/* CTA */

.whc26-cta-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.whc26-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;

  min-height: 60px;
  padding: 17px 34px;

  border-radius: 13px;
  border: 1px solid #108d4d;

  background: linear-gradient(
    100deg,
    #149653 0%,
    #27bd72 100%
  );

  color: #ffffff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 800;

  box-shadow:
    0 12px 28px rgba(21, 158, 83, .18),
    inset 0 1px 0 rgba(255,255,255,.18);

  transition:
    transform .3s ease,
    box-shadow .3s ease;
}

.whc26-btn i {
  font-size: 21px;
  transition: transform .3s ease;
}

.whc26-btn:hover {
  transform: translateY(-3px);
  color: #ffffff;
  box-shadow:
    0 18px 38px rgba(21,158,83,.24);
}

.whc26-btn:hover i {
  transform: translateX(5px);
}

.whc26-btn-note {
  font-size: 14px;
  color: #75857a;
  font-weight: 600;
  padding-left: 5px;
}

/* RIGHT IMAGE */

.whc26-visual-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 520px;
}

.whc26-image-card {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 470px;

  padding: 14px;
  border-radius: 26px;

  background:
    linear-gradient(145deg, #ffffff, #f2faf5);

  border: 1px solid #d8eadf;

  box-shadow:
    0 28px 70px rgba(22, 84, 47, .10),
    0 8px 24px rgba(20, 60, 35, .04);

  transition:
    transform .4s ease,
    box-shadow .4s ease;
}

.whc26-image-card:hover {
  transform: translateY(-7px);
  box-shadow:
    0 35px 85px rgba(22, 84, 47, .15);
}

.whc26-image-card img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
  object-fit: contain;
}

/* SOFT DECORATIVE GLOWS */

.whc26-visual-glow {
  position: absolute;
  z-index: 1;
  border-radius: 50%;
  filter: blur(55px);
  pointer-events: none;
}

.whc26-glow-one {
  width: 250px;
  height: 250px;
  background: rgba(53, 202, 116, .15);
  top: 9%;
  left: 2%;
}

.whc26-glow-two {
  width: 220px;
  height: 220px;
  background: rgba(28, 174, 89, .10);
  bottom: 7%;
  right: 0;
}

/* RESPONSIVE */

@media (max-width: 1199px) {
  .whc26-title {
    font-size: 48px;
  }

  .whc26-point p {
    font-size: 15px;
  }
}

@media (max-width: 991px) {
  .whc26-section {
    padding: 75px 0;
  }

  .whc26-heading {
    margin-bottom: 45px;
  }

  .whc26-title {
    font-size: 42px;
  }

  .whc26-point p {
    font-size: 16px;
  }

  .whc26-visual-wrap {
    min-height: 0;
    margin-top: 12px;
  }

  .whc26-image-card {
    max-width: 500px;
  }
}

@media (max-width: 575px) {
  .whc26-section {
    padding: 58px 0;
  }

  .whc26-heading {
    margin-bottom: 35px;
  }

  .whc26-eyebrow {
    font-size: 12px;
    padding: 9px 18px;
  }

  .whc26-title {
    font-size: 34px;
    line-height: 1.2;
    letter-spacing: -1.1px;
  }

  .whc26-point {
    padding: 13px 12px;
    gap: 11px;
    border-radius: 12px;
  }

  .whc26-point-icon {
    width: 27px;
    height: 27px;
    min-width: 27px;
    font-size: 15px;
  }

  .whc26-point p {
    font-size: 15px;
    line-height: 1.6;
  }

  .whc26-btn {
    width: 100%;
    padding: 16px 20px;
    font-size: 16px;
  }

  .whc26-cta-wrap {
    align-items: stretch;
    text-align: center;
  }

  .whc26-btn-note {
    padding: 0;
  }

  .whc26-image-card {
    padding: 10px;
    border-radius: 20px;
  }

  .whc26-image-card img {
    border-radius: 14px;
  }

  .whc26-glow-one,
  .whc26-glow-two {
    width: 140px;
    height: 140px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whc26-point,
  .whc26-btn,
  .whc26-btn i,
  .whc26-image-card {
    transition: none;
  }
}





@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

.wpr26-section {
  background: #08040e;
  padding: 85px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
}

.wpr26-section * {
  box-sizing: border-box;
}

/* PURPLE MAIN WRAPPER */

.wpr26-wrapper {
  max-width: 1140px;
  margin: 0 auto;
  padding: 45px 45px 48px;
  border-radius: 28px;
  background: linear-gradient(
    115deg,
    #7b00ff 0%,
    #a000ff 50%,
    #7600f4 100%
  );
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(92,0,203,.25);
}

.wpr26-wrapper::before {
  content: "";
  position: absolute;
  width: 350px;
  height: 350px;
  background: rgba(255,255,255,.07);
  border-radius: 50%;
  filter: blur(55px);
  left: -160px;
  top: -160px;
  pointer-events: none;
}

.wpr26-wrapper > * {
  position: relative;
  z-index: 1;
}

/* HEADING */

.wpr26-heading {
  margin-bottom: 30px;
}

.wpr26-eyebrow {
  display: inline-block;
  background: #101018;
  color: #ffffff;
  border-radius: 50px;
  padding: 9px 22px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 12px;
}

.wpr26-heading h2 {
  color: #ffffff;
  font-size: clamp(32px, 3.5vw, 48px);
  line-height: 1.15;
  letter-spacing: -1.5px;
  font-weight: 800;
  margin: 0;
}

/* CARDS */

.wpr26-card {
  background: #ffffff;
  border: 1px solid rgba(25,18,35,.13);
  border-radius: 16px;
  padding: 25px 22px 28px;
  height: 100%;
  min-height: 285px;
  color: #15131c;
  box-shadow: 0 12px 25px rgba(42,0,94,.13);
  transition: transform .35s ease, box-shadow .35s ease;
}

.wpr26-card:hover {
  transform: translateY(-7px);
  box-shadow: 0 22px 38px rgba(38,0,95,.23);
}

/* ICON AND BADGE */

.wpr26-card-top {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 20px;
}

.wpr26-icon {
  width: 65px;
  height: 65px;
  min-width: 65px;
  border-radius: 17px;
  display: grid;
  place-items: center;
  font-size: 29px;
  position: relative;
}

.wpr26-icon-one {
  color: #7254ed;
  background: linear-gradient(135deg,#f1e9ff,#e9e0ff);
}

.wpr26-icon-two {
  color: #188be5;
  background: linear-gradient(135deg,#e1f4ff,#e8eaff);
}

.wpr26-icon-three {
  color: #179b5d;
  background: linear-gradient(135deg,#e2ffed,#d5f7df);
}

.wpr26-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #7543f7;
  color: #ffffff;
padding: 5px 15px;
  border-radius: 30px;
  font-size: 20px;
  font-weight: 800;
  white-space: nowrap;
  letter-spacing: .4px;
}

/* TEXT */

.wpr26-card h3 {
  font-size: 21px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: -.5px;
  color: #15131c;
  margin: 0 0 14px;
}

.wpr26-card p {
  font-size: 16px;
  line-height: 1.75;
  font-weight: 500;
  color: #4b4655;
  margin: 0;
}

/* RESPONSIVE */

@media (max-width: 991px) {
  .wpr26-section {
    padding: 70px 0;
  }

  .wpr26-wrapper {
    padding: 38px 25px;
  }

  .wpr26-card {
    padding: 22px 17px;
  }

  .wpr26-card h3 {
    font-size: 19px;
  }

  .wpr26-card p {
    font-size: 15px;
  }

  .wpr26-icon {
    width: 53px;
    height: 53px;
    min-width: 53px;
    font-size: 25px;
  }
}

@media (max-width: 767px) {
  .wpr26-section {
    padding: 50px 0;
  }

  .wpr26-wrapper {
    padding: 35px 18px;
    border-radius: 22px;
  }

  .wpr26-heading h2 {
    font-size: 32px;
  }

  .wpr26-card {
    min-height: auto;
    padding: 24px 20px;
  }

  .wpr26-card h3 {
    font-size: 22px;
  }

  .wpr26-card p {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wpr26-card {
    transition: none;
  }
}



/* =========================================
   WHOP ENGINE - SIMPLE INTERFACE
   Additional CSS
========================================= */

/* Browser Frame */

.whsimple26-browser-frame {
  overflow: hidden;
  padding: 7px;
  border-radius: 20px;
  background: linear-gradient(
    135deg,
    #ff2d12 0%,
    #ff6a00 100%
  );
  box-shadow:
    0 20px 55px rgba(255, 87, 24, 0.15),
    0 8px 25px rgba(0, 0, 0, 0.08);
}

.whsimple26-browser-top {
  position: relative;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 43px;
  padding: 0 15px;
  border-radius: 14px 14px 0 0;
  background: #171b26;
}

.whsimple26-browser-top > span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.whsimple26-browser-top > span:nth-child(1) {
  background: #ff625e;
}

.whsimple26-browser-top > span:nth-child(2) {
  background: #ffbd4e;
}

.whsimple26-browser-top > span:nth-child(3) {
  background: #4bc98b;
}

.whsimple26-browser-label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  color: #d1d5db;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  letter-spacing: 0.4px;
}

.whsimple26-browser-frame > img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0 0 13px 13px;
}

/* Support Chips */

.whsimple26-support-chips {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
}

.whsimple26-chip {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 22px;
  border: 1px solid rgba(255, 106, 0, 0.35);
  border-radius: 100px;
  background: linear-gradient(
    135deg,
    rgba(255, 45, 18, 0.08),
    rgba(255, 106, 0, 0.06)
  );
  color: #ffffff;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.5;
  box-shadow: 0 8px 25px rgba(255, 88, 20, 0.06);
}

.whsimple26-chip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  border-radius: 50%;
  background: linear-gradient(
    100deg,
    #ff2d12,
    #ff6a00
  );
  color: #ffffff;
  font-size: 15px;
}

/* Responsive */

@media (max-width: 767px) {
  .whsimple26-browser-frame {
    padding: 4px;
    border-radius: 13px;
  }

  .whsimple26-browser-top {
    min-height: 34px;
    border-radius: 9px 9px 0 0;
  }

  .whsimple26-browser-top > span {
    width: 7px;
    height: 7px;
  }

  .whsimple26-browser-label {
    font-size: 9px;
  }

  .whsimple26-browser-frame > img {
    border-radius: 0 0 9px 9px;
  }

  .whsimple26-support-chips {
    gap: 12px;
  }

  .whsimple26-chip {
    width: 100%;
    justify-content: center;
    padding: 12px 15px;
    font-size: 15px;
  }

  .whsimple26-chip-icon {
    width: 34px;
    height: 34px;
    font-size: 13px;
  }
}


/* =========================================
   WHOP ORBIT NICHES SECTION
   NO OVERLAP VERSION
   Prefix: whorb26-
========================================= */

.whorb26-section {
  position: relative;
  overflow: hidden;
  padding: 95px 0 85px;
  background:
    radial-gradient(circle at 0% 0%, rgba(124, 58, 237, 0.08), transparent 25%),
    radial-gradient(circle at 100% 20%, rgba(6, 182, 212, 0.08), transparent 26%),
    radial-gradient(circle at 50% 100%, rgba(59, 130, 246, 0.06), transparent 20%),
    linear-gradient(180deg, #fbfbff 0%, #ffffff 100%);
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #101828;
}

.whorb26-section * {
  box-sizing: border-box;
}

/* HEADER */

.whorb26-mini-tag {
  display: inline-block;
  margin-bottom: 18px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid #dadcf2;
  background: rgba(255,255,255,0.85);
  color: #2f3a56;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.5px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

.whorb26-heading {
  max-width: 900px;
  margin: 0 auto;
  color: #081224;
  font-size: clamp(36px, 4.6vw, 64px);
  line-height: 1.1;
  letter-spacing: -2.4px;
  font-weight: 900;
}

.whorb26-heading span {
  background: linear-gradient(100deg, #6d28d9 0%, #2563eb 48%, #06b6d4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* STAGE */

.whorb26-stage {
  max-width: 1280px;
  margin: 55px auto 40px;
  display: grid;
  grid-template-columns: 1fr 360px 1fr;
  grid-template-rows: auto auto auto;
  grid-template-areas:
    "top top top"
    "left center right"
    "bottom bottom bottom";
  gap: 26px 26px;
  align-items: center;
}

/* TOP / BOTTOM */

.whorb26-top-pills,
.whorb26-bottom-pills {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
}

.whorb26-top-pills {
  grid-area: top;
}

.whorb26-bottom-pills {
  grid-area: bottom;
}

/* SIDES */

.whorb26-side {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.whorb26-side-left {
  grid-area: left;
  align-items: flex-start;
}

.whorb26-side-right {
  grid-area: right;
  align-items: flex-end;
}

/* CENTER */

.whorb26-center-wrap {
  grid-area: center;
  text-align: center;
}

.whorb26-center-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 16px;
  margin-bottom: 14px;
  border-radius: 999px;
  border: 1px solid #d8cef9;
  background: rgba(255,255,255,0.95);
  color: #5145cd;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 1px;
  box-shadow: 0 10px 24px rgba(79, 70, 229, 0.06);
}

.whorb26-center-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
}

.whorb26-center-image-wrap {
  position: relative;
  overflow: hidden;
  min-height: 400px;
  padding: 26px;
  border-radius: 32px;
  background:
    linear-gradient(145deg, #ffffff 0%, #f7f4ff 52%, #eefcff 100%);
  border: 1px solid #ddd2ff;
  box-shadow:
    0 30px 80px rgba(15, 23, 42, 0.08),
    0 10px 25px rgba(99, 102, 241, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
}

.whorb26-center-image-wrap img {
  position: relative;
  z-index: 2;
  display: block;
  max-width: 100%;
  max-height: 340px;
  object-fit: contain;
}

.whorb26-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  pointer-events: none;
}

.whorb26-glow-one {
  width: 180px;
  height: 180px;
  top: 25px;
  left: 15px;
  background: rgba(124, 58, 237, 0.20);
}

.whorb26-glow-two {
  width: 180px;
  height: 180px;
  right: 15px;
  bottom: 20px;
  background: rgba(6, 182, 212, 0.18);
}

/* PILLS */

.whorb26-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 18px;
  border-radius: 999px;
  border: 1px solid rgba(151, 161, 255, 0.25);
  color: #14213b;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 750;
  text-align: center;
  box-shadow:
    0 14px 30px rgba(15, 23, 42, 0.06),
    0 4px 10px rgba(124, 58, 237, 0.04);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  animation: whorb26-float 5.5s ease-in-out infinite;
  white-space: nowrap;
  max-width: 100%;
}

.whorb26-pill:hover {
  transform: translateY(-6px) scale(1.03);
  box-shadow:
    0 18px 34px rgba(15, 23, 42, 0.09),
    0 8px 18px rgba(124, 58, 237, 0.08);
  border-color: rgba(124, 58, 237, 0.28);
}

@keyframes whorb26-float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-8px); }
}

/* UNIQUE COLORS */

.whorb26-pill-c1  { background: linear-gradient(135deg, #fff6e9, #fff1d8); animation-delay: 0s; }
.whorb26-pill-c2  { background: linear-gradient(135deg, #f0edff, #e9e7ff); animation-delay: .2s; }
.whorb26-pill-c3  { background: linear-gradient(135deg, #e8fbf7, #dffaf1); animation-delay: .4s; }
.whorb26-pill-c4  { background: linear-gradient(135deg, #ebf4ff, #e2eeff); animation-delay: .6s; }
.whorb26-pill-c5  { background: linear-gradient(135deg, #ebfff8, #dcfff1); animation-delay: .8s; }
.whorb26-pill-c6  { background: linear-gradient(135deg, #fff0f5, #ffe6ef); animation-delay: 1s; }
.whorb26-pill-c7  { background: linear-gradient(135deg, #eefbff, #e0f8ff); animation-delay: 1.2s; }
.whorb26-pill-c8  { background: linear-gradient(135deg, #fff7ec, #ffefd8); animation-delay: 1.4s; }
.whorb26-pill-c9  { background: linear-gradient(135deg, #f5f0ff, #ede7ff); animation-delay: 1.6s; }
.whorb26-pill-c10 { background: linear-gradient(135deg, #ebfbff, #def8ff); animation-delay: 1.8s; }
.whorb26-pill-c11 { background: linear-gradient(135deg, #f2ffee, #e6ffe0); animation-delay: 2s; }
.whorb26-pill-c12 { background: linear-gradient(135deg, #fff2ea, #ffe8dd); animation-delay: 2.2s; }
.whorb26-pill-c13 { background: linear-gradient(135deg, #f8efff, #f0e7ff); animation-delay: .3s; }
.whorb26-pill-c14 { background: linear-gradient(135deg, #eafff8, #dffdf1); animation-delay: .5s; }
.whorb26-pill-c15 { background: linear-gradient(135deg, #fff4ec, #ffe9dc); animation-delay: .7s; }
.whorb26-pill-c16 { background: linear-gradient(135deg, #eef2ff, #e4ebff); animation-delay: .9s; }
.whorb26-pill-c17 { background: linear-gradient(135deg, #fff0fa, #ffe5f5); animation-delay: 1.1s; }
.whorb26-pill-c18 { background: linear-gradient(135deg, #eefcff, #dff7ff); animation-delay: 1.3s; }
.whorb26-pill-c19 { background: linear-gradient(135deg, #f7ffee, #edffe0); animation-delay: 1.5s; }
.whorb26-pill-c20 { background: linear-gradient(135deg, #fff5eb, #ffecd9); animation-delay: 1.7s; }
.whorb26-pill-c21 { background: linear-gradient(135deg, #ecfff5, #dffff0); animation-delay: 1.9s; }
.whorb26-pill-c22 { background: linear-gradient(135deg, #fff0f0, #ffe4e4); animation-delay: 2.1s; }
.whorb26-pill-c23 { background: linear-gradient(135deg, #efe9ff, #e7deff); animation-delay: 2.3s; }
.whorb26-pill-c24 { background: linear-gradient(135deg, #eef3ff, #e5ecff); animation-delay: 2.5s; }

/* NOTE BOX */

.whorb26-note-box {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 24px;
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.08), rgba(6, 182, 212, 0.07));
  border: 1px solid #d7cbff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.04);
}

.whorb26-note-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.whorb26-note-box p {
  margin: 0;
  color: #344054;
  font-size: 18px;
  line-height: 1.75;
}

.whorb26-note-box p strong {
  color: #101828;
  font-weight: 850;
}

/* RESPONSIVE */

@media (max-width: 1199px) {
  .whorb26-stage {
    grid-template-columns: 1fr 320px 1fr;
  }

  .whorb26-pill {
    font-size: 15px;
    padding: 11px 16px;
  }
}

@media (max-width: 991px) {
  .whorb26-section {
    padding: 75px 0;
  }

  .whorb26-stage {
    grid-template-columns: 1fr;
    grid-template-areas:
      "top"
      "center"
      "left"
      "right"
      "bottom";
    gap: 20px;
  }

  .whorb26-top-pills,
  .whorb26-bottom-pills,
  .whorb26-side {
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 14px;
  }

  .whorb26-center-wrap {
    max-width: 420px;
    margin: 0 auto;
  }

  .whorb26-pill {
    animation: none;
    white-space: normal;
  }
}

@media (max-width: 767px) {
  .whorb26-section {
    padding: 58px 0;
  }

  .whorb26-heading {
    font-size: 33px;
    line-height: 1.15;
    letter-spacing: -1.2px;
  }

  .whorb26-center-image-wrap {
    min-height: 300px;
    padding: 18px;
    border-radius: 22px;
  }

  .whorb26-center-image-wrap img {
    max-height: 250px;
  }

  .whorb26-pill {
    font-size: 14px;
    line-height: 1.35;
    min-height: 44px;
    padding: 10px 13px;
  }

  .whorb26-note-box {
    padding: 18px 16px;
    border-radius: 16px;
  }

  .whorb26-note-icon {
    width: 36px;
    height: 36px;
    font-size: 15px;
  }

  .whorb26-note-box p {
    font-size: 16px;
    line-height: 1.7;
  }
}


/* ============================================
   WHOP ENGINE - PERFECT FOR YOU
   PREMIUM DARK THEME
   Unique Prefix: whpf26-
============================================ */

.whpf26-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 95px 0;

  background:
    radial-gradient(
      ellipse at 0% 15%,
      rgba(255, 98, 0, 0.10),
      transparent 32%
    ),
    radial-gradient(
      ellipse at 100% 100%,
      rgba(208, 0, 255, 0.10),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      #060814 0%,
      #0c0f23 45%,
      #14051d 100%
    );

  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
  color: #ffffff;
}

.whpf26-section * {
  box-sizing: border-box;
}

.whpf26-section .container {
  position: relative;
  z-index: 2;
}

/* ============================================
   CENTER HEADING
============================================ */

.whpf26-heading-area {
  text-align: center;
  margin-bottom: 55px;
}

.whpf26-heading {
  max-width: 1050px;
  margin: 0 auto;

  color: #ffffff;
  text-align: center;

  font-size: clamp(36px, 4.5vw, 60px);
  line-height: 1.16;
  letter-spacing: -2px;
  font-weight: 900;
}

.whpf26-heading span {
  display: block;

  background: linear-gradient(
    100deg,
    #ff9a3c 0%,
    #ff5a65 45%,
    #d85cff 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  color: #ff7556;
}

/* ============================================
   MAIN ROW
============================================ */

.whpf26-main-row {
  position: relative;
}

/* ============================================
   IMAGE AREA
============================================ */

.whpf26-image-wrap {
  position: relative;
  width: 100%;
}

.whpf26-image-card {
  position: relative;
  z-index: 2;

  overflow: hidden;
  padding: 20px;
  border-radius: 28px;

  background: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.07),
    rgba(255, 255, 255, 0.025)
  );

  border: 1px solid rgba(255, 255, 255, 0.13);

  box-shadow:
    0 30px 70px rgba(0, 0, 0, 0.35),
    0 10px 30px rgba(255, 98, 0, 0.07);

  backdrop-filter: blur(10px);
}

.whpf26-image-card img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
}

.whpf26-image-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(75px);
  pointer-events: none;
}

.whpf26-image-glow-1 {
  width: 230px;
  height: 230px;
  top: 0;
  left: -45px;
  background: rgba(255, 94, 23, 0.22);
}

.whpf26-image-glow-2 {
  width: 230px;
  height: 230px;
  right: -30px;
  bottom: 0;
  background: rgba(211, 62, 255, 0.18);
}

/* ============================================
   RIGHT CONTENT
============================================ */

.whpf26-content {
  position: relative;
  z-index: 2;
  text-align: left;
}

.whpf26-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* ============================================
   CHECKLIST CARDS
============================================ */

.whpf26-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;

  padding: 16px 18px;
  border-radius: 17px;

  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.055),
    rgba(255, 255, 255, 0.018)
  );

  border: 1px solid rgba(255, 255, 255, 0.10);

  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);

  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.whpf26-item:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 117, 48, 0.35);

  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.20);
}

/* CHECK ICON */

.whpf26-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;
  min-width: 34px;
  margin-top: 1px;

  border-radius: 50%;

  background: linear-gradient(
    100deg,
    #ff5a2b 0%,
    #ff8b2b 100%
  );

  color: #ffffff;
  font-size: 16px;
  font-weight: 900;

  box-shadow: 0 8px 18px rgba(255, 99, 39, 0.20);
}

/* NORMAL TEXT - 18PX */

.whpf26-text {
  color: #edf1ff;
  font-size: 18px;
  line-height: 1.7;
  font-weight: 500;
  text-align: left;
}

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

@media (max-width: 991px) {

  .whpf26-section {
    padding: 75px 0;
  }

  .whpf26-heading-area {
    margin-bottom: 40px;
  }

  .whpf26-heading {
    font-size: clamp(35px, 5vw, 49px);
    letter-spacing: -1.5px;
  }

  .whpf26-image-wrap {
    max-width: 650px;
    margin: 0 auto;
  }

}

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

@media (max-width: 767px) {

  .whpf26-section {
    padding: 58px 0;
  }

  .whpf26-heading-area {
    margin-bottom: 30px;
  }

  .whpf26-heading {
    font-size: clamp(32px, 8vw, 42px);
    line-height: 1.22;
    letter-spacing: -1px;
  }

  .whpf26-image-card {
    padding: 12px;
    border-radius: 18px;
  }

  .whpf26-image-card img {
    border-radius: 12px;
  }

  .whpf26-list-wrap {
    gap: 12px;
  }

  .whpf26-item {
    padding: 14px;
    gap: 12px;
    border-radius: 14px;
  }

  .whpf26-icon {
    width: 32px;
    height: 32px;
    min-width: 32px;
    font-size: 15px;
  }

  .whpf26-text {
    font-size: 18px;
    line-height: 1.65;
  }

}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
  .whpf26-item {
    transition: none;
  }
}



@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

/* ======================================
   WHO IT'S FOR - PREMIUM WHITE THEME
====================================== */

.wif26-section {
  background: #ffffff;
  padding: 95px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  color: #111827;
  overflow: hidden;
}

.wif26-section * {
  box-sizing: border-box;
}

/* MAIN PREMIUM WRAPPER */

.wif26-shell {
  max-width: 1220px;
  margin: 0 auto;
  padding: 32px 28px 28px;
  background: linear-gradient(
    145deg,
    #fafbf9 0%,
    #f6f8f6 100%
  );
  border: 1px solid #e4e9e5;
  border-radius: 28px;
  box-shadow:
    0 25px 65px rgba(27, 44, 32, .065),
    0 3px 12px rgba(27, 44, 32, .025);
}

/* CENTER HEADING */

.wif26-heading {
  text-align: center;
  margin-bottom: 32px;
}

.wif26-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 20px;
  border-radius: 50px;
  background: #eef9f1;
  border: 1px solid #d4edda;
  color: #17834a;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .5px;
  margin-bottom: 19px;
}

.wif26-title {
  font-size: clamp(35px, 4vw, 58px);
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -2px;
  color: #111827;
  margin: 0;
}

.wif26-title span {
  display: inline-block;
background: linear-gradient( 100deg, #ff9a3c 0%, #ff5a65 45%, #d85cff 100% );
  color: #fff;
  padding: 2px 12px 5px;
  border-radius: 8px;
  box-shadow: 0 7px 18px rgba(160, 220, 45, .12);
}

/* GRID */

.wif26-grid {
  background: #ffffff;
  border: 1px solid #dfe5e0;
  border-radius: 20px;
  overflow: hidden;
}

/* GRID DIVIDERS - DESKTOP */

.wif26-grid > [class*="col-"] {
  border-right: 1px solid #e5e9e6;
  border-bottom: 1px solid #e5e9e6;
}

.wif26-grid > [class*="col-"]:nth-child(4n) {
  border-right: 0;
}

.wif26-grid > [class*="col-"]:nth-last-child(-n + 4) {
  border-bottom: 0;
}

/* INDIVIDUAL CARDS */

.wif26-card {
  position: relative;
  height: 100%;
  padding: 26px 14px 25px;
  text-align: center;
  background: #ffffff;
  transition:
    background .3s ease,
    box-shadow .3s ease;
}

.wif26-card:hover {
  background: #f9fdfb;
  box-shadow: inset 0 0 30px rgba(25, 160, 85, .025);
}

/* IMAGE WRAPPER */

.wif26-image-wrap {
  position: relative;
  height: 190px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 17px;
}

/* SOFT GLOW BEHIND IMAGE */

.wif26-image-wrap::before {
  content: "";
  position: absolute;
  width: 165px;
  height: 150px;
  top: 13px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(101, 218, 166, .17) 0%,
    rgba(93, 162, 245, .08) 50%,
    transparent 75%
  );
  filter: blur(9px);
  pointer-events: none;
}

/* PERSON IMAGE */

.wif26-image-wrap img {
  position: relative;
  z-index: 1;
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 165px;
  object-fit: contain;
  transition: transform .35s ease;
}

.wif26-card:hover .wif26-image-wrap img {
  transform: translateY(-5px) scale(1.035);
}

/* COLOR RIBBON LABELS */

.wif26-badge {
  position: absolute;
  z-index: 2;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 33px;
  padding: 7px 13px;
  border-radius: 8px 8px 3px 3px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
  color: #ffffff;
  box-shadow: 0 8px 16px rgba(16, 24, 40, .12);
}

.wif26-badge::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: -5px;
  height: 7px;
  background: rgba(0,0,0,.17);
  border-radius: 0 0 4px 4px;
  z-index: -1;
}

/* INDIVIDUAL LABEL COLORS */

.wif26-badge-green {
  background: linear-gradient(135deg, #20bc67, #159d55);
}

.wif26-badge-orange {
  background: linear-gradient(135deg, #f4a426, #e57b25);
}

.wif26-badge-purple {
  background: linear-gradient(135deg, #9870f4, #7047d9);
}

.wif26-badge-blue {
  background: linear-gradient(135deg, #35b7f5, #3772e6);
}

.wif26-badge-pink {
  background: linear-gradient(135deg, #f36baf, #c842c5);
}

.wif26-badge-teal {
  background: linear-gradient(135deg, #32c9bd, #139e9f);
}

.wif26-badge-yellow {
  background: linear-gradient(135deg, #e9b82e, #d09017);
}

.wif26-badge-indigo {
  background: linear-gradient(135deg, #7e87f5, #535bd3);
}

/* CARD DESCRIPTION */

.wif26-card-body p {
  max-width: 245px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 1.65;
  font-weight: 600;
  color: #4d5a51;
}

/* TABLET - 2 COLUMNS */

@media (max-width: 1199px) {
  .wif26-section {
    padding: 75px 0;
  }

  .wif26-shell {
    padding: 26px 22px 22px;
  }

  .wif26-grid > [class*="col-"]:nth-child(4n) {
    border-right: 1px solid #e5e9e6;
  }

  .wif26-grid > [class*="col-"]:nth-last-child(-n + 4) {
    border-bottom: 1px solid #e5e9e6;
  }

  .wif26-grid > [class*="col-"]:nth-child(2n) {
    border-right: 0;
  }

  .wif26-grid > [class*="col-"]:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .wif26-image-wrap img {
    max-height: 170px;
  }
}

/* MOBILE - SINGLE COLUMN */

@media (max-width: 767px) {
  .wif26-section {
    padding: 55px 0;
  }

  .wif26-shell {
    padding: 22px 15px 15px;
    border-radius: 22px;
  }

  .wif26-heading {
    margin-bottom: 25px;
  }

  .wif26-title {
    font-size: 37px;
    letter-spacing: -1.2px;
  }

  .wif26-title span {
    padding: 2px 9px 4px;
  }

  .wif26-grid {
    border-radius: 16px;
  }

  .wif26-grid > [class*="col-"] {
    border-right: 0 !important;
    border-bottom: 1px solid #e5e9e6 !important;
  }

  .wif26-grid > [class*="col-"]:last-child {
    border-bottom: 0 !important;
  }

  .wif26-card {
    padding: 24px 15px 23px;
  }

  .wif26-image-wrap {
    height: 170px;
  }

  .wif26-image-wrap img {
    max-height: 145px;
  }

  .wif26-card-body p {
    font-size: 16px;
  }

  .wif26-badge {
    font-size: 13px;
  }
}

/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {
  .wif26-card,
  .wif26-image-wrap img {
    transition: none;
  }
}



/* Updated heading intro */

.gmtripleadv73-intro {
  max-width: 850px;
  margin: 22px auto 38px;
  font-size: 18px;
  line-height: 1.75;
  font-weight: 500;
}

/* Dark section */
.gmtripleadv73-section:not(.light-theme)
.gmtripleadv73-intro {
  color: #000;
}

/* White section */
.gmtripleadv73-section.light-theme
.gmtripleadv73-intro {
  color: #000;
}


@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

.wmh26-section {
  background:
    radial-gradient(circle at 12% 18%, rgba(235, 122, 190, 0.08), transparent 20%),
    radial-gradient(circle at 85% 28%, rgba(255, 170, 82, 0.10), transparent 18%),
    #f4ecf9;
  padding: 95px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px;
  color: #18202c;
  overflow: hidden;
}

.wmh26-section * {
  box-sizing: border-box;
}

/* heading */

.wmh26-heading {
  max-width: 920px;
  margin: 0 auto 42px;
}

.wmh26-title {
  margin: 0;
  font-size: clamp(34px, 4.2vw, 58px);
  line-height: 1.12;
  letter-spacing: -1.8px;
  font-weight: 800;
  color: #131826;
}

.wmh26-title span {
  display: block;
  background: linear-gradient(90deg, #f59b52 0%, #ff6e79 48%, #d24cff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.wmh26-title-line {
  width: 72px;
  height: 5px;
  border-radius: 20px;
  margin: 16px auto 0;
  background: linear-gradient(90deg, #f59b52, #d24cff);
}

/* left card */

.wmh26-content-card {
  background: #ffffff;
  border: 1px solid #ebe7ef;
  border-radius: 24px;
  padding: 38px 34px;
  box-shadow:
    0 20px 55px rgba(39, 28, 54, 0.08),
    0 4px 14px rgba(39, 28, 54, 0.03);
  position: relative;
  overflow: hidden;
}

.wmh26-content-card::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 0;
  width: 4px;
  height: 60px;
  border-radius: 0 10px 10px 0;
  background: linear-gradient(180deg, #ff7b85 0%, #cf48ff 100%);
}

.wmh26-content-card p {
  margin: 0;
  font-size: 20px;
  line-height: 1.9;
  color: #465261;
  font-weight: 500;
}

.wmh26-cta-wrap {
  margin-top: 28px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.wmh26-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 58px;
  padding: 16px 30px;
  border-radius: 14px;
  text-decoration: none;
  color: #ffffff;
  font-size: 17px;
  font-weight: 800;
  background: linear-gradient(90deg, #f59b52 0%, #ff6e79 48%, #d24cff 100%);
  box-shadow: 0 16px 35px rgba(226, 92, 171, 0.22);
  transition: transform .3s ease, box-shadow .3s ease;
}

.wmh26-btn:hover {
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 22px 42px rgba(226, 92, 171, 0.30);
}

.wmh26-btn i {
  font-size: 20px;
}

.wmh26-btn-note {
  font-size: 18px;
  line-height: 1.5;
  color: #7a7f8b;
  font-weight: 600;
  padding-left: 4px;
}

/* right visual */

.wmh26-visual-wrap {
  position: relative;
  min-height: 560px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wmh26-image-box {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 430px;
}

.wmh26-image-box img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

.wmh26-shape {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.wmh26-shape-one {
  width: 150px;
  height: 150px;
  background: rgba(243, 170, 220, 0.25);
  top: 40px;
  left: 70px;
  z-index: 1;
}

.wmh26-shape-two {
  width: 110px;
  height: 110px;
  background: rgba(255, 196, 104, 0.18);
  bottom: 60px;
  right: 70px;
  z-index: 1;
}

.wmh26-dots {
  position: absolute;
  top: 135px;
  left: 80px;
  width: 90px;
  height: 90px;
  background-image: radial-gradient(#d79b2f 1.6px, transparent 1.6px);
  background-size: 12px 12px;
  opacity: .75;
  z-index: 1;
}

.wmh26-float {
  position: absolute;
  z-index: 4;
  background: #ffffff;
  border: 1px solid #ece8f1;
  border-radius: 14px;
  padding: 10px 14px;
  box-shadow: 0 14px 28px rgba(25, 20, 34, 0.08);
}

.wmh26-float span {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: #263040;
  line-height: 1.3;
}

.wmh26-float-one {
  top: 110px;
  left: 18px;
}

.wmh26-float-two {
  top: 265px;
  right: 18px;
}

.wmh26-float-three {
  bottom: 62px;
  left: 42px;
  max-width: 220px;
}

/* responsive */

@media (max-width: 1199px) {
  .wmh26-content-card p {
    font-size: 18px;
  }

  .wmh26-visual-wrap {
    min-height: 500px;
  }
}

@media (max-width: 991px) {
  .wmh26-section {
    padding: 75px 0;
  }

  .wmh26-heading {
    margin-bottom: 34px;
  }

  .wmh26-content-card {
    padding: 30px 24px;
  }

  .wmh26-visual-wrap {
    min-height: 430px;
    margin-top: 10px;
  }

  .wmh26-float-one {
    left: 8px;
  }

  .wmh26-float-two {
    right: 8px;
  }
}

@media (max-width: 767px) {
  .wmh26-section {
    padding: 55px 0;
  }

  .wmh26-title {
    font-size: 34px;
    letter-spacing: -1px;
  }

  .wmh26-content-card {
    padding: 24px 18px;
    border-radius: 18px;
  }

  .wmh26-content-card p {
    font-size: 17px;
    line-height: 1.8;
  }

  .wmh26-btn {
    width: 100%;
    font-size: 16px;
    padding: 15px 18px;
  }

  .wmh26-cta-wrap {
    align-items: stretch;
    text-align: center;
  }

  .wmh26-btn-note {
    padding-left: 0;
  }

  .wmh26-visual-wrap {
    min-height: 380px;
  }

  .wmh26-float {
    padding: 8px 11px;
    border-radius: 12px;
  }

  .wmh26-float span {
    font-size: 12px;
  }

  .wmh26-float-one {
    top: 85px;
    left: 0;
  }

  .wmh26-float-two {
    top: 225px;
    right: 0;
  }

  .wmh26-float-three {
    bottom: 28px;
    left: 12px;
    max-width: 180px;
  }

  .wmh26-shape-one {
    width: 100px;
    height: 100px;
    top: 30px;
    left: 30px;
  }

  .wmh26-shape-two {
    width: 80px;
    height: 80px;
    right: 25px;
    bottom: 40px;
  }

  .wmh26-dots {
    width: 70px;
    height: 70px;
    top: 105px;
    left: 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wmh26-btn,
  .wmh26-image-box img {
    transition: none;
  }
}


/* =============================================
   WHOP ENGINE BETA TESTIMONIALS
   Premium White + Orange/Red Gradient
   Prefix: whbeta26-
============================================= */

.whbeta26-section {
  position: relative;
  overflow: hidden;
  padding: 95px 0 85px;

  background:
    radial-gradient(
      ellipse at 0% 10%,
      rgba(255, 78, 30, 0.045),
      transparent 35%
    ),
    radial-gradient(
      ellipse at 100% 90%,
      rgba(255, 132, 34, 0.045),
      transparent 35%
    ),
    #ffffff;

  color: #101320;
  font-family: 'Inter', Arial, sans-serif;
  font-size: 18px;
}

.whbeta26-section * {
  box-sizing: border-box;
}

/* HEADING */

.whbeta26-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 15px;

  font-family: 'Segoe Print', cursive;
  font-size: 19px;
  font-style: italic;
  font-weight: 750;
  color: #ff431b;
}

.whbeta26-kicker span {
  font-size: 16px;
}

.whbeta26-heading {
  max-width: 950px;
  margin: 0 auto;

  font-size: clamp(34px, 4.6vw, 46px);
  font-weight: 900;
  line-height: 1.17;
  letter-spacing: -2px;
  color: #0d1018;
}

.whbeta26-heading span {
  display: block;

  background-image: linear-gradient(
    100deg,
    #ff2d12 0%,
    #ff6a00 100%
  );

  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.whbeta26-heading-line {
  width: 100px;
  height: 4px;
  margin: 24px auto 0;
  border-radius: 20px;

  background-image: linear-gradient(
    100deg,
    #ff2d12,
    #ff6a00
  );
}

/* CARD ROW */

.whbeta26-cards-row {
  margin-top: 45px;
}

/* TESTIMONIAL CARD */

.whbeta26-card {
  height: 100%;
  overflow: hidden;
  background: #ffffff;

  border: 1px solid #f1dfd5;
  border-radius: 22px;

  box-shadow:
    0 20px 55px rgba(16, 24, 40, 0.065),
    0 5px 15px rgba(16, 24, 40, 0.035);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease;
}

.whbeta26-card:hover {
  transform: translateY(-7px);
  border-color: #ffc3a7;

  box-shadow:
    0 28px 65px rgba(16, 24, 40, 0.10),
    0 10px 25px rgba(255, 85, 29, 0.08);
}

/* VIDEO AREA */

.whbeta26-video-wrap {
  position: relative;
  overflow: hidden;
  aspect-ratio: 9 / 12;

  background: #101015;
}

.whbeta26-video {
  display: block;
  width: 100%;
  height: 100%;

  object-fit: cover;
  background: #101015;
}

.whbeta26-video-top {
  position: absolute;
  z-index: 3;
  top: 15px;
  left: 15px;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 12px;
  border-radius: 30px;

  background: rgba(12, 12, 17, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.16);

  color: #ffffff;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 1px;
}

.whbeta26-video-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;

  background: #ff6234;
  box-shadow: 0 0 0 4px rgba(255, 98, 52, 0.15);
}

/* CUSTOM PLAY BUTTON */

.whbeta26-play {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  display: flex;
  align-items: center;
  justify-content: center;

  width: 78px;
  height: 78px;
  border: 2px solid #ffffff;
  border-radius: 50%;

  background: linear-gradient(
    135deg,
    #ff2d12,
    #ff6a00
  );

  color: #ffffff;
  font-size: 27px;

  cursor: pointer;

  box-shadow:
    0 0 0 11px rgba(255, 89, 31, 0.13),
    0 12px 30px rgba(255, 72, 20, 0.25);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    opacity 0.25s ease;
}

.whbeta26-play i {
  margin-left: 4px;
}

.whbeta26-play:hover {
  transform: translate(-50%, -50%) scale(1.08);

  box-shadow:
    0 0 0 15px rgba(255, 89, 31, 0.10),
    0 15px 35px rgba(255, 72, 20, 0.3);
}

.whbeta26-video-wrap.is-playing .whbeta26-play {
  opacity: 0;
  pointer-events: none;
}

.whbeta26-video-wrap.is-playing .whbeta26-video-top {
  opacity: 0;
}

/* CARD BODY */

.whbeta26-card-body {
  padding: 23px 22px 25px;
}

.whbeta26-tester-label {
  color: #ff5729;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.2px;
  margin-bottom: 8px;
}

.whbeta26-card-body h3 {
  margin: 0 0 7px;

  color: #111827;
  font-size: 23px;
  font-weight: 900;
  line-height: 1.3;
}

.whbeta26-tester-meta {
  margin-bottom: 15px;
  color: #647084;
  font-size: 13px;
  font-weight: 700;
}

.whbeta26-quote {
  position: relative;
  padding: 14px 15px;

  border-left: 3px solid #ff602f;
  border-radius: 0 10px 10px 0;

  background: #fff7f3;
  color: #445064;

  font-size: 15px;
  line-height: 1.7;
  font-weight: 550;
}

.whbeta26-quote-mark {
  color: #ff4b24;
  font-weight: 900;
}

/* CTA AREA */

.whbeta26-cta-area {
  margin-top: 50px;
}

.whbeta26-cta-button {
  position: relative;
  overflow: hidden;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 13px;

  min-height: 66px;
  max-width: 100%;
  padding: 18px 32px;

  border-radius: 13px;

  background-image: linear-gradient(
    100deg,
    #ff2d12 0%,
    #ff6a00 100%
  );

  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
  text-decoration: none;

  box-shadow: 0 15px 30px rgba(255, 83, 25, 0.22);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.whbeta26-cta-button:hover {
  transform: translateY(-4px);

  color: #ffffff;
  box-shadow: 0 20px 40px rgba(255, 83, 25, 0.34);
}

.whbeta26-cta-note {
  margin: 15px 0 0;
  color: #667085;
  font-size: 14px;
  font-weight: 650;
}

.whbeta26-cta-note i {
  margin-right: 5px;
  color: #ff642f;
}

/* TABLET */

@media (max-width: 991px) {
  .whbeta26-section {
    padding: 75px 0;
  }

  .whbeta26-heading {
    font-size: clamp(36px, 5vw, 50px);
  }
}

/* MOBILE */

@media (max-width: 767px) {
  .whbeta26-section {
    padding: 60px 0;
  }

  .whbeta26-kicker {
    font-size: 16px;
  }

  .whbeta26-heading {
    font-size: 33px;
    letter-spacing: -1px;
  }

  .whbeta26-cards-row {
    margin-top: 30px;
  }

  .whbeta26-card {
    max-width: 440px;
    margin: 0 auto;
    border-radius: 18px;
  }

  .whbeta26-video-wrap {
    aspect-ratio: 9 / 12;
  }

  .whbeta26-play {
    width: 66px;
    height: 66px;
    font-size: 22px;
  }

  .whbeta26-card-body {
    padding: 20px 18px;
  }

  .whbeta26-card-body h3 {
    font-size: 21px;
  }

  .whbeta26-cta-area {
    margin-top: 35px;
  }

  .whbeta26-cta-button {
    width: 100%;
    font-size: 15px;
    padding: 16px 13px;
    gap: 8px;
  }

  .whbeta26-cta-note {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whbeta26-card,
  .whbeta26-play,
  .whbeta26-cta-button {
    transition: none;
  }
}



@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800;900&family=Caveat:wght@600;700&display=swap');

/* ============================================
   WHOP ENGINE — ULTRA PREMIUM LAUNCH BONUSES
   WHITE THEME | BOOTSTRAP 5
============================================ */

.wb26-section {
    position: relative;
    background: #ffffff;
    padding: 100px 0;
    font-family: 'DM Sans', sans-serif;
    font-size: 18px;
    color: #172033;
    overflow: hidden;
}

.wb26-section *,
.wb26-section *::before,
.wb26-section *::after {
    box-sizing: border-box;
}

/* ============================================
   SECTION HEADING
============================================ */

.wb26-kicker {
    display: block;
    font-family: 'Caveat', cursive;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.2;
    color: #f27526;
    margin-bottom: 14px;
}

.wb26-heading {
    max-width: 930px;
    margin: 0 auto 55px;
    font-size: clamp(34px, 4.2vw, 50px);
    line-height: 1.15;
    letter-spacing: -1.8px;
    font-weight: 900;
    color: #141a27;
}

.wb26-heading span {
    color: #ff751e;
}

/* ============================================
   BONUS LIST
============================================ */

.wb26-bonus-list {
    display: flex;
    flex-direction: column;
    gap: 26px;
    max-width: 1080px;
    margin: 0 auto;
}

/* ============================================
   PREMIUM TICKET CARD
============================================ */

.wb26-ticket {
    position: relative;
    isolation: isolate;
    padding: 34px 44px;
    border-radius: 22px;

    background: linear-gradient(
        135deg,
        #fff8ec 0%,
        #ffe8b9 100%
    );

    border: 1px solid #f2dbac;

    /* box-shadow:
        0 16px 45px rgba(101, 66, 21, 0.07),
        0 4px 14px rgba(101, 66, 21, 0.025); */

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.wb26-ticket:hover {
    transform: translateY(-6px);
    border-color: #f1c985;

    /* box-shadow:
        0 26px 65px rgba(101, 66, 21, 0.13),
        0 7px 20px rgba(101, 66, 21, 0.045); */
}

/* Alternating backgrounds */

.wb26-ticket:nth-child(even) {
    background: linear-gradient(
        135deg,
        #ffebc7 0%,
        #fff8ec 100%
    );
}

/* ============================================
   TICKET CUTOUTS
============================================ */

.wb26-ticket::before,
.wb26-ticket::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ffffff;
    z-index: 2;
}

.wb26-ticket::before {
    left: -16px;
    border-right: 1px solid #f2dbac;
}

.wb26-ticket::after {
    right: -16px;
    border-left: 1px solid #f2dbac;
}

/* ============================================
   CARD CONTENT
============================================ */

.wb26-content {
    position: relative;
    z-index: 2;
    padding: 12px 4px;
}

/* Bonus Badge */

.wb26-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 43px;
    padding: 10px 24px;
    margin-bottom: 22px;

    background: linear-gradient(
        180deg,
        #ffb72c 0%,
        #ff8a09 48%,
        #ff6900 100%
    );

    border: 1px solid rgba(255, 121, 0, 0.2);
    border-radius: 12px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.5px;

    box-shadow:
        0 9px 20px rgba(255, 119, 13, 0.18),
        inset 0 1px 0 rgba(255,255,255,0.28);
}

/* Bonus Heading */

.wb26-content h3 {
    margin: 0 0 17px;
    font-size: clamp(27px, 2.8vw, 39px);
    font-weight: 900;
    line-height: 1.18;
    letter-spacing: -1.1px;
    color: #151a25;
}

/* Bonus Description */

.wb26-content p {
    margin: 0;
    max-width: 530px;
    color: #48515b;
    font-size: 17px;
    line-height: 1.8;
    font-weight: 500;
}

/* Bonus Value */

.wb26-value {
    display: inline-flex;
    align-items: center;
    margin-top: 22px;

    color: #ec4b18;
    font-size: 19px;
    font-style: italic;
    font-weight: 900;
    line-height: 1.4;
}

/* ============================================
   IMAGE AREA
============================================ */

.wb26-image-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 255px;
    padding: 10px 0;
}

/* Soft glow behind product image */

.wb26-image-wrap::before {
    content: "";
    position: absolute;
    z-index: -1;

    width: min(85%, 280px);
    aspect-ratio: 1;

    border-radius: 50%;

    background: radial-gradient(
        circle,
        rgba(255, 166, 52, 0.28) 0%,
        rgba(255, 194, 104, 0.15) 45%,
        transparent 72%
    );

    filter: blur(14px);
    pointer-events: none;
}

/* Product Box Image */

.wb26-image-wrap img {
    position: relative;
    z-index: 1;

    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 290px;

    object-fit: contain;

    filter: drop-shadow(
        0 18px 18px rgba(79, 50, 14, 0.14)
    );

    transition:
        transform 0.45s ease,
        filter 0.45s ease;
}

.wb26-ticket:hover .wb26-image-wrap img {
    transform: translateY(-7px) scale(1.035);

    filter: drop-shadow(
        0 24px 24px rgba(79, 50, 14, 0.19)
    );
}

/* ============================================
   BOOTSTRAP ROW ALIGNMENT
============================================ */

.wb26-ticket > .row {
    position: relative;
    z-index: 1;
}

.wb26-ticket .row > [class*="col-"] {
    min-width: 0;
}

.wb26-ticket .wb26-content,
.wb26-ticket .wb26-image-wrap {
    width: 100%;
}

/* ============================================
   RESPONSIVE — LARGE TABLET
============================================ */

@media (max-width: 1199px) {

    .wb26-section {
        padding: 85px 0;
    }

    .wb26-ticket {
        padding: 30px 32px;
    }

    .wb26-content h3 {
        font-size: 32px;
    }

    .wb26-content p {
        font-size: 16px;
    }

    .wb26-image-wrap img {
        max-height: 260px;
    }
}

/* ============================================
   RESPONSIVE — TABLET
============================================ */

@media (max-width: 991px) {

    .wb26-section {
        padding: 75px 0;
    }

    .wb26-kicker {
        font-size: 32px;
    }

    .wb26-heading {
        font-size: 43px;
        margin-bottom: 42px;
    }

    .wb26-bonus-list {
        gap: 23px;
    }

    .wb26-ticket {
        padding: 26px 25px;
        border-radius: 19px;
    }

    .wb26-content {
        padding: 8px 0;
    }

    .wb26-content h3 {
        font-size: 28px;
        letter-spacing: -0.7px;
    }

    .wb26-content p {
        font-size: 16px;
        line-height: 1.7;
    }

    .wb26-badge {
        min-height: 39px;
        padding: 9px 18px;
        font-size: 13px;
        margin-bottom: 17px;
    }

    .wb26-value {
        margin-top: 17px;
        font-size: 17px;
    }

    .wb26-image-wrap {
        min-height: 215px;
    }

    .wb26-image-wrap img {
        max-height: 235px;
    }
}

/* ============================================
   RESPONSIVE — MOBILE
============================================ */

@media (max-width: 767px) {

    .wb26-section {
        padding: 60px 0;
    }

    .wb26-kicker {
        font-size: 30px;
        margin-bottom: 12px;
    }

    .wb26-heading {
        font-size: 35px;
        line-height: 1.2;
        letter-spacing: -1px;
        margin-bottom: 35px;
    }

    .wb26-bonus-list {
        gap: 20px;
    }

    .wb26-ticket {
        padding: 24px 22px;
        border-radius: 18px;
    }

    .wb26-ticket::before,
    .wb26-ticket::after {
        width: 22px;
        height: 22px;
    }

    .wb26-ticket::before {
        left: -12px;
    }

    .wb26-ticket::after {
        right: -12px;
    }

    .wb26-content {
        padding: 0;
    }

    .wb26-badge {
        padding: 9px 17px;
        min-height: 37px;
        font-size: 13px;
        margin-bottom: 16px;
    }

    .wb26-content h3 {
        font-size: 28px;
        margin-bottom: 13px;
    }

    .wb26-content p {
        font-size: 16px;
        line-height: 1.7;
    }

    .wb26-value {
        margin-top: 16px;
        font-size: 17px;
    }

    .wb26-image-wrap {
        min-height: 180px;
        padding: 0;
    }

    .wb26-image-wrap img {
        max-height: 230px;
    }
}

/* ============================================
   RESPONSIVE — SMALL MOBILE
============================================ */

@media (max-width: 480px) {

    .wb26-section {
        padding: 50px 0;
    }

    .wb26-heading {
        font-size: 31px;
        letter-spacing: -0.8px;
        margin-bottom: 30px;
    }

    .wb26-kicker {
        font-size: 28px;
    }

    .wb26-ticket {
        padding: 20px 18px;
        border-radius: 16px;
    }

    .wb26-ticket > .row {
        --bs-gutter-y: 1.1rem;
    }

    .wb26-content h3 {
        font-size: 25px;
        line-height: 1.25;
    }

    .wb26-content p {
        font-size: 15px;
        line-height: 1.75;
    }

    .wb26-badge {
        font-size: 12px;
        padding: 8px 15px;
        min-height: 35px;
    }

    .wb26-value {
        font-size: 16px;
    }

    .wb26-image-wrap {
        min-height: 150px;
    }

    .wb26-image-wrap img {
        max-height: 205px;
    }
}

/* ============================================
   ACCESSIBILITY / REDUCED MOTION
============================================ */

@media (prefers-reduced-motion: reduce) {

    .wb26-ticket,
    .wb26-image-wrap img {
        transition: none !important;
    }

    .wb26-ticket:hover {
        transform: none;
    }

    .wb26-ticket:hover .wb26-image-wrap img {
        transform: none;
    }
}