/* Editorial bridge from the Sally Something homepage into The Letter. */
.letter-introduction {
  background:#fdfdfc;
  color:#2F4858;
  font-family:'Nunito',Arial,sans-serif;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.letter-introduction .brand-header { flex:0 0 auto; width:100%; }

.letter-introduction .letter-app {
  display:flex;
  flex:1 0 auto;
  min-height:0;
  align-items:center;
  justify-content:center;
  padding:clamp(48px,6vw,88px) 48px;
  overflow:hidden;
  background:#fdfdfc;
}

.letter-introduction .letter-flow {
  width:min(1180px,100%);
  max-width:none;
  margin:0 auto;
}

.letter-introduction .letter-flow__inner {
  min-height:0;
  display:block;
  padding:0;
  text-align:left;
}

.letter-introduction .intro-copy { max-width:900px; margin:0 auto; text-align:left; }

.letter-introduction .letter-flow__eyebrow {
  margin:0 0 28px;
  color:#2F4858;
  font:700 1rem/1.5 'Nunito',Arial,sans-serif;
  letter-spacing:.14em;
}

.letter-introduction .letter-flow__title {
  width:auto;
  max-width:none;
  margin:0 0 36px;
  color:#2F4858;
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(3rem,4.8vw,4.25rem);
  font-weight:400;
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
}

.letter-introduction .letter-flow__subtitle {
  width:auto;
  max-width:54ch;
  margin:0;
  color:#2F4858;
  font:400 1.25rem/1.8 'Nunito',Arial,sans-serif;
}

.letter-introduction .letter-flow__actions {
  margin-top:42px;
}

.letter-introduction .button.button--primary {
  display:inline-flex;
  min-height:56px;
  align-items:center;
  justify-content:center;
  padding:0 30px;
  border:1px solid #0B7A85;
  border-radius:7px;
  background:#0B7A85;
  color:#fff;
  font:700 .85rem/1.4 'Nunito',Arial,sans-serif;
  letter-spacing:.07em;
  text-decoration:none;
}

.letter-introduction .button.button--primary:hover {
  border-color:#075c64;
  background:#075c64;
}

.letter-introduction .intro-home {
  display:inline-block;
  margin-top:22px;
  color:#2F4858;
  font:600 .92rem/1.5 'Nunito',Arial,sans-serif;
  text-underline-offset:4px;
}

.letter-introduction .brand-footer { flex:0 0 auto; width:100%; margin-top:0; }

@media(max-width:850px) {
  .letter-introduction .letter-app { padding-inline:32px; }
  .letter-introduction .letter-flow__title { font-size:clamp(2.8rem,5.6vw,4rem); }
}

@media(max-width:650px) {
  .letter-introduction .letter-app { padding:48px 22px 54px; }
  .letter-introduction .letter-flow__inner {
    display:block;
  }
  .letter-introduction .letter-flow__eyebrow { margin-bottom:22px; }
  .letter-introduction .desktop-title-break { display:none; }
  .letter-introduction .letter-flow__title {
    max-width:15ch;
    margin-bottom:28px;
    font-size:clamp(2.65rem,11vw,3.6rem);
  }
  .letter-introduction .letter-flow__subtitle { font-size:1.1875rem; }
  .letter-introduction .letter-flow__actions { margin-top:36px; }
  .letter-introduction .button.button--primary { min-height:54px; padding-inline:24px; }
}