/* =========================================================================
   Social Stardom — Ready-to-grow section
   Direct port of mwg_landing4 from the supplied 08-ready-to-grow.html.
   Scoped under .l-sentence > .mwg_landing4 so the .container/.text/.pin
   class names cannot collide with anything else on the page.
   ========================================================================= */

.l-sentence {
  background: #F1F1F1;
  color: #121212;
  position: relative;
  z-index: 2;
}

.l-sentence .mwg_landing4 { overflow: hidden; }

.l-sentence .mwg_landing4 .container {
  display: flex;
  align-items: center;
  height: 100vh;
  position: relative;
  width: 100%;
  margin: -100vh 0;
  /* Override any global .container max-width */
  max-width: none;
  padding: 0;
}

.l-sentence .mwg_landing4 .bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 25px;
  display: flex;
  gap: 0;
}

.l-sentence .mwg_landing4 .bottom p {
  padding: 0 15px 0 0;
  margin: 0;
  font-family: "IBM Plex Mono", "Geist Mono", ui-monospace, monospace;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #777;
}

.l-sentence .mwg_landing4 .bottom p:first-child {
  width: clamp(220px, 56vw, 720px);
}

.l-sentence .mwg_landing4 .container .text {
  padding: 0 101vw;
  display: flex;
  width: max-content;
  white-space: nowrap;
  margin: 0;
  font-family: "Inter Tight", -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 500;
  font-size: 250px;
  line-height: 0.8;
  letter-spacing: -0.04em;
  color: #121212;
  z-index: 4;
}

.l-sentence .mwg_landing4 .letter { display: inline-block; }
.l-sentence .mwg_landing4 .text br { display: none; }

@media (max-width: 1024px) {
  .l-sentence .mwg_landing4 .container .text { font-size: 200px; }
  .l-sentence .mwg_landing4 .bottom p:first-child { width: clamp(160px, 40vw, 360px); }
}

@media (max-width: 768px) {
  .l-sentence .mwg_landing4 { transform: none; }
  .l-sentence .mwg_landing4 .container {
    margin: 0;
    height: auto;
    padding: 56px 18px;
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
  }
  .l-sentence .mwg_landing4 .container .text {
    font-size: 64px;
    padding: 0;
    width: 100%;
    white-space: normal;
    line-height: 0.92;
    overflow: hidden;
  }
  .l-sentence .mwg_landing4 .text br { display: inline; }
  .l-sentence .mwg_landing4 .ss-rtg-line {
    display: block;
    overflow: hidden;
    padding: 0 0 0.05em 0;
  }
  .l-sentence .mwg_landing4 .ss-rtg-word {
    display: inline-block;
  }
  .l-sentence .mwg_landing4 .bottom {
    position: relative;
    flex-direction: column;
    gap: 6px;
    padding: 0;
  }
  .l-sentence .mwg_landing4 .bottom p:first-child { width: 100%; }
}
