/* WA Promo Cards - Modern Glow Cards
   - Font Awesome supported (theme/site loads FA)
   - Inline SVG supported via icon_svg and automatically glows/strokes using currentColor
*/

.wa-row{
  display:flex;
  flex-wrap:wrap;
  gap: var(--wa-gap, 24px);
  margin: 40px 0;
  align-items: stretch;
}

.wa-column{
  box-sizing:border-box;
  display:flex; /* lets the card fill height cleanly */
}

/* Gap-safe flex-basis sizing */
.wa-col-full{ flex: 0 0 100%; }
.wa-col-1-2{  flex: 0 0 calc(50% - (var(--wa-gap, 24px) / 2)); }
.wa-col-1-3{  flex: 0 0 calc(33.333% - (var(--wa-gap, 24px) * 2 / 3)); }
.wa-col-1-4{  flex: 0 0 calc(25% - (var(--wa-gap, 24px) * 3 / 4)); }
.wa-col-2-3{  flex: 0 0 calc(66.666% - (var(--wa-gap, 24px) / 3)); }
.wa-col-3-4{  flex: 0 0 calc(75% - (var(--wa-gap, 24px) / 4)); }

@media (max-width: 800px){
  .wa-column{ flex: 0 0 100% !important; }
}

/* Card */
.wa-promo-card{
  width: 100%;
  background: var(--wa-bg, rgba(10,20,40,.85));
  border: 1px solid var(--wa-border, rgba(0,200,255,.20));
  border-radius: var(--wa-radius, 14px);
  padding: 30px;
  color: #fff;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(10px);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.wa-promo-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 18% 10%, var(--wa-accent, #00ccff), transparent 55%);
  opacity:.18;
  pointer-events:none;
}

.wa-promo-card::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.06) 35%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .6s ease;
  pointer-events:none;
}

.wa-promo-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .35), 0 0 28px rgba(0, 200, 255, var(--wa-glow, .35));
}

@supports (color: color-mix(in srgb, #fff 50%, transparent)){
  .wa-promo-card:hover{
    border-color: color-mix(in srgb, var(--wa-accent, #00ccff) 55%, transparent);
  }
}

.wa-promo-card:hover::after{ transform: translateX(120%); }

/* Icon wrapper */
.wa-promo-icon{
  font-size: 32px;
  color: var(--wa-icon, var(--wa-accent, #00ccff));
  margin-bottom: 14px;
  text-shadow: 0 0 18px rgba(0,200,255,.25);
  line-height: 1;
}

/* Inline SVG defaults (automatic glow) */
.wa-promo-icon svg.wa-promo-svg{
  width: 56px;
  height: 56px;
  display: block;
  color: var(--wa-icon, var(--wa-accent, #00ccff));
  filter: drop-shadow(0 0 10px rgba(0,200,255,.35));
}
.wa-promo-icon svg.wa-promo-svg *{
  stroke: currentColor;
}

/* If SVG uses fills, keep them off by default */
.wa-promo-icon svg.wa-promo-svg [fill]:not([fill="none"]){
  fill: none;
}

.wa-promo-title{
  font-size: 1.3rem;
  margin: 0 0 10px 0;
  line-height: 1.2;
}

.wa-promo-text{
  font-size: .95rem;
  opacity: .92;
}

.wa-promo-text p{ margin: 0 0 10px 0; }
.wa-promo-text p:last-child{ margin-bottom: 0; }

.wa-promo-link{
  display:inline-block;
  margin-top: 12px;
  color: var(--wa-accent, #00ccff);
  text-decoration:none;
  font-weight: 600;
}
.wa-promo-link:hover{ text-decoration: underline; }

/* Animations */
.wa-anim-none{ animation: none !important; }
.wa-anim-fade{  animation: waFadeIn .6s ease both; }
.wa-anim-slide{ animation: waSlideIn .6s ease both; }

@keyframes waFadeIn{
  from{ opacity:0; transform: translateY(12px); }
  to{ opacity:1; transform: translateY(0); }
}
@keyframes waSlideIn{
  from{ opacity:0; transform: translateY(18px); }
  to{ opacity:1; transform: translateY(0); }
}