/* ==========================================================================
   SVAC — Culture Feature
   ========================================================================== */

.svac-mod-culture-feature{
  container-type:inline-size;
  width:100%;
  max-width:100%;
}

/* =====================================================
   Grid
===================================================== */

.svac-mod-culture-feature__grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(180px, 240px); /* defined badge column */
  align-items:center;
  gap:64px; /* tighter so badge doesn’t feel far right */
}

/* =====================================================
   Content
===================================================== */

.svac-mod-culture-feature__content{
  min-width:0;
}

/* Heading can extend wider */
.svac-mod-culture-feature__heading-wrap{
  max-width:920px; /* controls ONLY heading line length */
}

.svac-mod-culture-feature__heading{
  margin:0 0 32px;
}

/* Body remains constrained */
.svac-mod-culture-feature__body-wrap{
  max-width:720px; /* controls ONLY body/subhead width */
}

.svac-mod-culture-feature__body{
  margin:0 0 40px;
}

/* =====================================================
   Eyebrow (System Canonical + Lines Fix)
===================================================== */

.svac-mod-culture-feature__eyebrow{
  display:flex;
  align-items:stretch; /* critical: enables paintable height for lines */
  gap:16px;
  margin:0 0 32px;
}

.svac-mod-culture-feature__eyebrow-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 22px;
  border:2px solid currentColor;
  color:var(--svac-bright-blue);
  font-weight:500;
  font-size:20px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  line-height:1;
  background:transparent;
  border-radius:0;
}

.svac-mod-culture-feature__eyebrow-lines{
  display:block;
  flex:0 0 auto;
  height:44px; /* REQUIRED: explicit paintable height */
  width:calc(var(--eyebrow-line-count, 7) * (2px + 15px) - 15px);

  pointer-events:none;
  color:var(--svac-bright-blue);

  background-image:repeating-linear-gradient(
    to right,
    currentColor 0 2px,
    transparent 2px 17px
  );
  background-repeat:no-repeat;
  background-position:left center;
  background-size:100% 100%;

  -webkit-mask-image:linear-gradient(to right,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,0.85) 14%,
    rgba(0,0,0,0.70) 28%,
    rgba(0,0,0,0.55) 42%,
    rgba(0,0,0,0.40) 56%,
    rgba(0,0,0,0.25) 70%,
    rgba(0,0,0,0.12) 84%,
    rgba(0,0,0,0.05) 100%
  );
  mask-image:linear-gradient(to right,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,0.85) 14%,
    rgba(0,0,0,0.70) 28%,
    rgba(0,0,0,0.55) 42%,
    rgba(0,0,0,0.40) 56%,
    rgba(0,0,0,0.25) 70%,
    rgba(0,0,0,0.12) 84%,
    rgba(0,0,0,0.05) 100%
  );
}

/* =====================================================
   CTA (Text-only, underline hover only)
===================================================== */

.svac-mod-culture-feature__cta{
  font-size:24px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--svac-bright-blue);
  text-decoration:none;
  display:inline-block;
}

.svac-mod-culture-feature__cta:hover{
  text-decoration:underline;
  text-underline-offset:4px;
}

/* =====================================================
   Badge
===================================================== */

.svac-mod-culture-feature__badge{
  display:flex;
  align-items:center;
  justify-content:center; /* centers badge within its column */
}

.svac-mod-culture-feature__badge img{
  display:block;
  width:100%;
  max-width:200px;
  height:auto;
}

/* =====================================================
   Responsive
===================================================== */

@container (max-width: 900px){
  .svac-mod-culture-feature__grid{
    grid-template-columns:1fr;
    gap:56px;
  }

  .svac-mod-culture-feature__badge{
    justify-content:center; /* ✅ center badge on mobile */
  }
}



}