/* GENERATED by packages/design-system/scripts/build-wp.mjs in lonestar-launchpad-com. Do not edit; regenerate. */
/* --- COMPONENT: featured-carousel ------------------------------------------
   Kept and repaired. Controls sit OUTSIDE the slide (live overlapped the
   eyebrow), the region is labelled, and it is keyboard-operable.
   --------------------------------------------------------------------------- */
.lslp-carousel { display: flex; flex-direction: column; gap: var(--lslp-space-4); }
.lslp-carousel__label {
  font-size: var(--lslp-label-size);
  font-weight: var(--lslp-label-weight);
  letter-spacing: var(--lslp-x-track-colhead);
  text-transform: uppercase;
  color: var(--lslp-text-muted);
}
.lslp-carousel__viewport { overflow: hidden; min-width: 0; }
.lslp-carousel__track {
  display: flex;
  min-width: 0;
  transition: transform 320ms ease;
}@media (prefers-reduced-motion: reduce){
 .lslp-carousel__track { transition: none; }}

.lslp-carousel__slide { flex: 0 0 100%; min-width: 0; container-type: inline-size; } /* cqw: a framed picture (below) */

/* the slide itself — background photo + navy scrim + text, like the homepage figure */
.lslp-featured-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 420px;
  padding: var(--lslp-space-5);
  background-size: var(--lslp-frame-size, cover);
  background-position: var(--lslp-frame-pos, var(--lslp-focal-card, 50% 50%)); /* per image (lslp_focal_style) */
  background-repeat: no-repeat;
  background-color: var(--lslp-navy); /* under a framed picture's lower edge, behind the text's scrim */
  overflow: hidden;
}
/* A FRAMED picture (lslp_frame_card, off by default): a chosen rectangle of the photo fills the
   card's width, pinned to the top, so its subject sits in the clear band above the text. For a
   wide photo whose subject is mid-frame (Austin MedTech Connect's panel, F10): at cover size the
   card shows the projector screen, and the panel sits under the text at every width. */
.lslp-featured-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--lslp-x-scrim-figure);
  opacity: 0.89;
}
.lslp-featured-card > * { position: relative; }
/* The text's own scrim. The card's gradient is fixed to the card (clear down to 53%), so where the
   text block was taller (390px, long titles) the title sat on bare picture: 17 of 24 text checks
   failed AA on light pictures (tools/parity/carousel-contrast.mjs, 2026-10-01). This band is sized
   by the text: it fades in over 64px ABOVE the eyebrow, then holds navy at 94% behind every line,
   so the worst case, pure white behind the gold eyebrow, still reads 5.4:1. */
.lslp-featured-card__body {
  margin: 0 calc(-1 * var(--lslp-space-5)) calc(-1 * var(--lslp-space-5));
  padding: 64px var(--lslp-space-5) var(--lslp-space-5);
  background-image: linear-gradient(rgba(11, 42, 74, 0), rgba(11, 42, 74, 0.94) 64px);
}
.lslp-featured-card__eyebrow {
  font-family: var(--lslp-font-mono);
  font-size: var(--lslp-mono-size);
  letter-spacing: var(--lslp-x-track-mono);
  text-transform: uppercase;
  color: var(--lslp-gold);
}
.lslp-featured-card__title {
  margin-top: var(--lslp-space-2);
  font-family: var(--lslp-font-serif);
  font-size: var(--lslp-h2-size);
  line-height: var(--lslp-h2-line);
  letter-spacing: var(--lslp-h2-tracking);
  font-weight: var(--lslp-h2-weight);
  color: var(--lslp-white);
}
.lslp-featured-card__excerpt {
  margin-top: var(--lslp-space-3);
  color: var(--lslp-x-on-navy-75);
}
.lslp-featured-card__cta {
  margin-top: var(--lslp-space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--lslp-space-2);
  font-size: var(--lslp-label-size);
  font-weight: var(--lslp-label-weight);
  color: var(--lslp-white);
  text-decoration: none;
}
.lslp-featured-card__cta:hover { text-decoration: underline; }
/* the whole slide is the link target */
.lslp-featured-card__link { position: absolute; inset: 0; z-index: 1; }

.lslp-carousel__controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--lslp-space-3);
}
.lslp-carousel__status {
  margin-right: auto;
  font-family: var(--lslp-font-mono);
  font-size: var(--lslp-mono-size);
  color: var(--lslp-text-muted);
}
.lslp-carousel__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--lslp-navy);
  background: transparent;
  color: var(--lslp-navy);
  cursor: pointer;
}
.lslp-carousel__btn:hover { background: var(--lslp-navy); color: var(--lslp-white); }
.lslp-carousel__btn[disabled] { opacity: 0.35; cursor: default; }
.lslp-carousel__btn[disabled]:hover { background: transparent; color: var(--lslp-navy); }