/* 
 * Silk Curtain Glow Background for Showcase Posts
 * Adapted from original_5_curtainglow.html
 */

/* Prepare the post card wrappers */
/* Prepare the post card wrappers */
/* Prepare the post card wrappers */
.showcase-post,
.founder-info {
  background-color: transparent !important;
  border-radius: 0 !important;
  border: 1px solid var(--border-light, #e0e0e0);
  gap: 0 !important; /* CRITICAL: Remove gap so the content block touches the image seamlessly */
  align-items: stretch !important; /* CRITICAL: Force content to stretch full height */
}

[data-theme="dark"] .showcase-post,
[data-theme="dark"] .founder-info {
  border-color: var(--border-dark, #333);
}

/* Target the content sections to host the background */
.showcase-post__content,
.founder-info__items {
  position: relative;
  z-index: 1;
  background-color: transparent !important;
  overflow: hidden; /* Contain the pseudo-elements */
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important; /* Keep text vertically centered */
}

/* Ensure inner text stays above the backgrounds */
.showcase-post__content > *,
.founder-info__items > * {
  position: relative;
  z-index: 2;
}

/* 
 * LIGHT MODE (Default)
 */
.showcase-post__content::before,
.founder-info__items::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: -1;
  /* Light curtain glow gradient */
  background: 
    radial-gradient(circle at 50% -20%, oklch(0.30 0.01 55 / 0.08) 0%, transparent 65%),
    linear-gradient(90deg, 
      oklch(0.95 0.003 55) 0%, 
      oklch(0.92 0.003 55) 15%, 
      oklch(0.99 0.002 55) 30%, 
      oklch(0.92 0.003 55) 45%, 
      oklch(0.95 0.003 55) 60%, 
      oklch(0.92 0.003 55) 75%, 
      oklch(0.99 0.002 55) 90%, 
      oklch(0.95 0.003 55) 100%
    );
  opacity: 1;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover State - Light Mode */
.showcase-post:hover .showcase-post__content::before,
.showcase-post:hover .founder-info__items::before {
  background: 
    radial-gradient(circle at 50% -10%, oklch(0.30 0.01 55 / 0.12) 0%, transparent 75%),
    linear-gradient(90deg, oklch(0.95 0.003 55) 0%, oklch(0.92 0.003 55) 15%, oklch(0.99 0.002 55) 30%, oklch(0.92 0.003 55) 45%, oklch(0.95 0.003 55) 60%, oklch(0.92 0.003 55) 75%, oklch(0.99 0.002 55) 90%, oklch(0.95 0.003 55) 100%);
}

/* 
 * DARK MODE 
 */
.showcase-post__content::after,
.founder-info__items::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: -1;
  /* Dark curtain glow gradient */
  background: 
    radial-gradient(circle at 50% -20%, oklch(0.88 0.02 65 / 0.15) 0%, transparent 65%),
    linear-gradient(90deg, 
      oklch(0.14 0.005 55) 0%, 
      oklch(0.18 0.006 55) 15%, 
      oklch(0.12 0.004 55) 30%, 
      oklch(0.18 0.006 55) 45%, 
      oklch(0.14 0.005 55) 60%, 
      oklch(0.18 0.006 55) 75%, 
      oklch(0.12 0.004 55) 90%, 
      oklch(0.14 0.005 55) 100%
    );
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover State - Dark Mode */
.showcase-post:hover .showcase-post__content::after,
.showcase-post:hover .founder-info__items::after {
  background: 
    radial-gradient(circle at 50% -10%, oklch(0.88 0.02 65 / 0.22) 0%, transparent 75%),
    linear-gradient(90deg, oklch(0.14 0.005 55) 0%, oklch(0.18 0.006 55) 15%, oklch(0.12 0.004 55) 30%, oklch(0.18 0.006 55) 45%, oklch(0.14 0.005 55) 60%, oklch(0.18 0.006 55) 75%, oklch(0.12 0.004 55) 90%, oklch(0.14 0.005 55) 100%);
}

/* Cross-fade transition logic */
[data-theme="dark"] .showcase-post__content::before,
[data-theme="dark"] .founder-info__items::before { opacity: 0; }
[data-theme="dark"] .showcase-post__content::after,
[data-theme="dark"] .founder-info__items::after { opacity: 1; }


/* =========================================
 * ENHANCING THE DIM ORANGE ICONS
 * ========================================= */

/* Tag Icon in the first card */
.showcase-post__tag-icon {
  width: 26px !important;
  height: 26px !important;
  color: #ff8c00 !important; /* Vibrant Orange */
  filter: drop-shadow(0 0 6px rgba(255, 140, 0, 0.5)); /* Glow effect */
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), filter 0.4s ease !important;
}

/* Feature Icons in the second card */
.founder-info__icon {
  width: 42px !important;
  height: 42px !important;
  color: #ff8c00 !important; /* Vibrant Orange */
  filter: drop-shadow(0 0 8px rgba(255, 140, 0, 0.5)); /* Glow effect */
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), filter 0.4s ease !important;
}

/* CRITICAL: Override the inline opacity set in the SVGs that made them look dim */
.showcase-post__tag-icon *,
.founder-info__icon * {
  opacity: 1 !important;
  stroke-width: 1.5 !important;
}

/* Animation on Hover */
.showcase-post:hover .showcase-post__tag-icon,
.showcase-post:hover .founder-info__icon {
  transform: scale(1.2) translateY(-2px) !important;
  filter: drop-shadow(0 0 16px rgba(255, 140, 0, 0.9)); /* Intense Glow */
}