/* GENERATED by packages/design-system/scripts/build-wp.mjs in lonestar-launchpad-com. Do not edit; regenerate.
   Source: build/homepage/css/site.css */
/* ===========================================================================
   LoneStar LaunchPad — homepage.

   Imports the design-system tokens, then ONLY the components this page uses.
   No page imports a stylesheet named for a page it is not.
   =========================================================================== */

/* --- page-specific: layout and regions that belong to this page only --- */
/* ===========================================================================
   SECTION 1 — HERO
   =========================================================================== */
.lslp-hero {
  position: relative;
  background-image: url("../../images/homepage/hero-bg-texas-at-night.jpeg");
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.lslp-hero__overlay {
  position: absolute;
  inset: 0;
  background: var(--lslp-navy);
  opacity: 0.5;
}
.lslp-hero__container { position: relative; }
/* Clears the absolutely positioned header — 233px on the live page at every
   width (logged deviation: it over-clears on mobile). */
.lslp-hero__clearance { height: 233px; }

.lslp-hero__content { display: flex; flex-direction: column; }
.lslp-hero__title {
  font-family: var(--lslp-font-serif);
  /* The token is the ceiling. The calc only binds below ~390px, where the
     smallest documented display step (44px) plus the non-breaking space in
     "LoneStar LaunchPad." would otherwise force horizontal scroll. Type Scale
     v3 documents no step below 44px. */
  font-size: min(var(--lslp-display-size), calc(10.2vw - 2px));   /* fits "LoneStar LaunchPad." inside the 24px mobile margin */
  line-height: var(--lslp-display-line);
  letter-spacing: var(--lslp-display-tracking);
  font-weight: var(--lslp-display-weight);
  color: var(--lslp-white);
  text-align: center;
}
.lslp-hero__title em { font-style: italic; color: var(--lslp-gold); }
.lslp-hero__subtitle {
  padding-top: var(--lslp-space-4);
  font-size: 30px;                       /* live */
  line-height: 1.3;                      /* live 23.8px overlaps when it wraps at 390 */
  color: var(--lslp-white);
  text-align: center;
}
.lslp-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--lslp-space-4);
  padding-top: var(--lslp-space-7);     /* 48px = 32px block pad + 16px row gap */
}@media (max-width: 767px){

  .lslp-hero__actions { flex-direction: column; align-items: center; }}


/* ===========================================================================
   SECTION 2 — STAT BAR
   =========================================================================== */
.lslp-stats { background: var(--lslp-red); }
/* The stat bar keeps 16px/24px at every width on the live page — it does not
   follow the responsive section gutter the other sections use. */
.lslp-stats__container { padding: var(--lslp-space-4) var(--lslp-space-5); }
.lslp-stats__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--lslp-space-6);
  align-items: center;
  padding: var(--lslp-space-2) var(--lslp-space-6) 0;   /* 8px 32px 0 */
}
.lslp-stats__tagline {
  font-family: var(--lslp-font-serif);
  font-size: var(--lslp-h5-size);
  line-height: var(--lslp-h5-line);
  font-weight: var(--lslp-h5-weight);
  font-style: italic;
  color: var(--lslp-white);
}

/* COMPONENT: stat-item */
.lslp-stat { display: flex; flex-direction: column; align-items: center; text-align: center; }@media (max-width: 767px){

  .lslp-stats__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--lslp-space-4);
    padding-inline: 0;
  }
  .lslp-stats__tagline { grid-column: 1 / -1; text-align: center; }}


/* ===========================================================================
   SECTION 3 — DISCOVER
   =========================================================================== */
.lslp-discover__body { display: flex; flex-direction: column; gap: var(--lslp-space-4); }
.lslp-keytopics { padding-block: var(--lslp-space-5); }
.lslp-keytopics__title {
  margin-bottom: var(--lslp-space-3);
  font-family: var(--lslp-font-serif);
  font-size: var(--lslp-h5-size);        /* live: 24/700 */
  line-height: var(--lslp-h5-line);
  font-weight: 700;
  color: var(--lslp-red);
}

/* ===========================================================================
   SECTION 4 — EXPLORE THE RESOURCES (tabs)
   Container matches every other section at 1352 (live ran 1368).
   =========================================================================== */
.lslp-tabs-section { background: var(--lslp-limestone); }
.lslp-tabs-section__head {
  display: flex;
  flex-direction: column;
  gap: var(--lslp-space-4);
  margin-bottom: var(--lslp-space-6);
}

/* ===========================================================================
   SECTION 5 — MEET THE PARTNERS
   =========================================================================== */
.lslp-partners__split { margin-top: var(--lslp-space-6); }
.lslp-partners__organizer,
.lslp-partners__ecosystem { display: flex; flex-direction: column; gap: var(--lslp-space-4); }
.lslp-partners__heading {
  font-family: var(--lslp-font-serif);
  font-size: var(--lslp-h4-size);
  line-height: var(--lslp-h4-line);
  letter-spacing: var(--lslp-h4-tracking);
  font-weight: var(--lslp-h4-weight);
  color: var(--lslp-navy);
}
.lslp-partners__heading em { font-style: italic; color: var(--lslp-red); }

/* ===========================================================================
   SECTION 6 — CONNECT
   =========================================================================== */
.lslp-connect { background: var(--lslp-navy); }
.lslp-connect__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--lslp-space-6);
}
.lslp-connect__head { display: flex; flex-direction: column; gap: var(--lslp-space-4); }
.lslp-connect__lede { color: var(--lslp-x-on-navy-50); }

/* ===========================================================================
   Live one-offs: the serif section eyebrows ("Discover", "Connect") are h3-sized
   bold upright on live, not the italic eyebrow role; the figure captions each
   carry their own size.
   =========================================================================== */
.lslp-discover .lslp-eyebrow,
.lslp-connect .lslp-eyebrow {
  font-size: var(--lslp-h3-size);
  line-height: var(--lslp-h3-line);
  font-weight: 700;
  font-style: normal;
}
.lslp-discover .lslp-figure__caption { font-size: var(--lslp-h4-size); line-height: var(--lslp-h4-line); }
.lslp-panel .lslp-figure__caption    { font-size: 20px; line-height: 23.8px; }
@media (max-width: 1024px) { .lslp-panel .lslp-figure__caption { font-size: 18.4px; } }
@media (max-width: 767px)  { .lslp-panel .lslp-figure__caption { font-size: 17.6px; } }