.e8CreateTitleMobile,
.e8CreateLeadMobile {
  display: none;
}

.e8Create .h001Ready h1 .e8CreateTitleDesktop,
.e8Create .h001Ready h1 .e8CreateTitleMobile,
.e8Create .h001Ready h1 .e8CreateTitleMobile span {
  color: inherit;
}

@media (max-width: 980px) {
  .e8CreatePage .h001Create--ready {
    background: linear-gradient(135deg, #fff8ef 0%, #fbfbfd 58%, #ffffff 100%);
    overflow-x: hidden;
    padding: 24px clamp(22px, 6.2vw, 44px) 24px;
  }

  .e8CreatePage .h001CreateTop {
    max-width: 620px;
  }

  .e8CreatePage .h001CreateBrand .mktBrand__wordmark {
    max-width: min(225px, 58vw);
    width: 225px;
  }

  .e8CreatePage .h001CreateBack {
    align-items: center;
    color: #405064;
    display: inline-flex;
    font-size: 1rem;
    gap: 5px;
  }

  .e8CreatePage .h001CreateBack::before {
    content: "arrow_back";
    font-family: "Material Symbols Rounded";
    font-size: 21px;
    line-height: 1;
  }

  .e8Create .h001Ready {
    margin-top: 35px;
    max-width: 620px;
  }

  .e8Create .h001Ready__grid {
    gap: 24px;
    grid-template-columns: 1fr;
  }

  .e8Create .h001Ready--upload .h001Ready__story {
    padding: 0;
  }

  .e8Create .h001Ready--active h1 {
    color: #111827;
    font-size: 2.35rem;
    font-weight: 900;
    line-height: 1.08;
    margin: 0;
    max-width: 610px;
  }

  .e8CreateTitleDesktop,
  .e8CreateLeadDesktop {
    display: none;
  }

  .e8CreateTitleMobile,
  .e8CreateLeadMobile {
    display: inline;
  }

  .e8CreateLeadMobile {
    display: block;
    text-align: justify;
    text-align-last: left;
  }

  .e8CreateTitleMobile > span {
    display: block;
  }

  .e8Create .h001Ready--active .h001Ready__story > p {
    color: #4b5b72;
    font-size: 1.02rem;
    font-weight: 750;
    line-height: 1.42;
    margin: 16px 0 0;
    max-width: 590px;
  }

  .e8CreateLeadStrong {
    color: #111827;
    display: block;
    font-weight: 900;
  }

  .e8CreateBadges {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
  }

  .e8CreateBadges li {
    align-items: center;
    background: rgba(255, 255, 255, 0.74);
    border: 1px solid rgba(226, 232, 240, 0.92);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
    display: grid;
    gap: 9px;
    grid-template-columns: 34px minmax(0, 1fr);
    min-height: 58px;
    padding: 10px 12px;
  }

  .e8CreateBadges .material-symbols-rounded {
    align-items: center;
    background: #f0fdf4;
    border-radius: 999px;
    color: #20c997;
    display: inline-flex;
    font-size: 24px;
    height: 34px;
    justify-content: center;
    width: 34px;
  }

  .e8CreateBadges li:nth-child(2) .material-symbols-rounded {
    background: #faf5ff;
    color: #a855f7;
  }

  .e8CreateBadges li:nth-child(3) .material-symbols-rounded {
    background: #eff6ff;
    color: #3b82f6;
  }

  .e8CreateBadges strong {
    color: #172033;
    font-size: 0.83rem;
    font-weight: 900;
    line-height: 1.18;
  }

  .e8CreateHow {
    display: block;
    margin-top: 24px;
  }

  .e8CreateHow h2 {
    color: #111827;
    font-size: 1.15rem;
    line-height: 1.2;
    margin: 0 0 18px;
  }

  .e8CreateSteps {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .e8CreateSteps li {
    min-width: 0;
    position: relative;
  }

  .e8CreateSteps li:not(:last-child)::after {
    color: #cbd5e1;
    content: "east";
    font-family: "Material Symbols Rounded";
    font-size: 24px;
    position: absolute;
    right: -22px;
    top: 37px;
  }

  .e8CreateStepIcon {
    align-items: center;
    background: #fff4ed;
    border: 1px solid rgba(255, 105, 24, 0.34);
    border-radius: 12px;
    display: inline-flex;
    height: 76px;
    justify-content: center;
    width: 76px;
  }

  .e8CreateStepIcon .material-symbols-rounded {
    color: #ff681f;
    font-size: 38px;
  }

  .e8CreateStepIcon--2 {
    background: #faf5ff;
    border-color: rgba(168, 85, 247, 0.28);
  }

  .e8CreateStepIcon--2 .material-symbols-rounded {
    color: #a855f7;
  }

  .e8CreateStepIcon--3 {
    background: #ecfdf5;
    border-color: rgba(32, 201, 151, 0.3);
  }
}

@media (max-width: 480px) {
  .e8CreatePage .h001Create--ready {
    padding: 22px 20px 24px;
  }

  .e8CreatePage .h001CreateBrand .mktBrand__wordmark {
    max-width: min(206px, 55vw);
    width: 206px;
  }

  .e8Create .h001Ready {
    margin-top: 32px;
  }

  .e8Create .h001Ready--active h1 {
    font-size: 2rem;
    line-height: 1.08;
  }

  .e8Create .h001Ready--active .h001Ready__story > p {
    font-size: 0.94rem;
    line-height: 1.36;
    margin-top: 12px;
  }

  .e8CreateHow {
    margin-top: 22px;
  }

  .e8CreateHow h2 {
    font-size: 1.08rem;
    margin-bottom: 14px;
  }

  .e8CreateSteps {
    gap: 14px;
  }

  .e8CreateSteps li:not(:last-child)::after {
    font-size: 20px;
    right: -17px;
    top: 34px;
  }

  .e8CreateStepIcon {
    height: 66px;
    width: 66px;
  }

  .e8CreateStepIcon .material-symbols-rounded {
    font-size: 33px;
  }
}

@media (max-width: 980px) {
  .e8CreateBadges {
    display: none;
  }
}
