/* Text-slide conversions for Ruuh case study (agent 4) */
.tx-slide {
  box-sizing: border-box;
  width: 100vw;
  max-width: 100vw;
  height: auto;
  background: #fff;
  color: #666;
  font-family: Montserrat, Generalsans, sans-serif;
  font-weight: 400;
  text-align: left;
}
.tx-slide h2,
.tx-slide h3,
.tx-slide p,
.tx-slide ul { margin: 0; padding: 0; font-family: inherit; }
.tx-slide .tx-title {
  color: #e9475a;
  font-weight: 700;
  font-size: 3.25vw;
  line-height: 1.15;
  letter-spacing: 0;
}
.tx-slide .tx-sub {
  color: #ee6b7a;
  font-weight: 700;
  font-size: .95vw;
  letter-spacing: .07em;
  line-height: 1.4;
}
.tx-slide .tx-sub strong { font-weight: 700; color: #e9475a; }
.tx-slide .tx-rule {
  width: 5vw;
  height: 2px;
  background: #e9475a;
}
.tx-slide strong { font-weight: 700; color: #555; }

/* Slide 2: About the project */
.tx-about { padding: 6.4vw 8vw 5vw 8.2vw; }
.tx-about .tx-sub { margin-top: 2.4vw; }
.tx-about .tx-rule { margin-top: 2.4vw; }
.tx-about .tx-cols {
  display: grid;
  grid-template-columns: 38fr 38fr;
  column-gap: 7.6vw;
  margin-top: 2.6vw;
  max-width: 83.5vw;
}
.tx-about .tx-col p {
  font-size: 1.08vw;
  line-height: 1.4;
  text-align: justify;
  color: #666;
  margin-bottom: 1.4em;
}
.tx-about .tx-col p:last-child { margin-bottom: 0; }

/* Slide 3: Brief */
.tx-brief { padding: 5.5vw 8vw 4.5vw 7.2vw; }
.tx-brief .tx-title { font-size: 3.9vw; }
.tx-brief .tx-sub { font-weight: 400; margin-top: 1.9vw; letter-spacing: .05em; color: #ef7482; }
.tx-brief .tx-rule { margin-top: 1.6vw; }
.tx-brief .tx-body { margin-top: 2vw; max-width: 65vw; }
.tx-brief .tx-body p,
.tx-brief .tx-body li,
.tx-brief .tx-body h3 {
  font-size: 1.17vw;
  line-height: 1.82;
  color: #6a6a6a;
  margin-top: 0;
  font-weight: 400;
}
.tx-brief .tx-body h3 { font-weight: 700; color: #555; }
.tx-brief .tx-body p,
.tx-brief .tx-body h3 { margin-bottom: 1.95vw; }
.tx-brief .tx-body ul { list-style: none; }
.tx-brief .tx-body li {
  position: relative;
  padding-left: .95vw;
  margin-bottom: 0;
}
.tx-brief .tx-body li::before {
  content: "\00b7";
  position: absolute;
  left: 0;
  font-weight: 700;
}

@media screen and (max-width: 991px) {
  .tx-about { padding: 40px 24px; }
  .tx-slide .tx-title, .tx-brief .tx-title { font-size: 34px; }
  .tx-slide .tx-sub { font-size: 13px; margin-top: 16px; }
  .tx-slide .tx-rule { width: 56px; margin-top: 16px; }
  .tx-about .tx-cols { display: block; margin-top: 28px; max-width: none; }
  .tx-about .tx-col p { font-size: 15px; line-height: 1.65; text-align: left; margin-bottom: 1.2em; }
  .tx-about .tx-col + .tx-col { margin-top: 1.2em; }
  .tx-brief { padding: 40px 24px; }
  .tx-brief .tx-body { margin-top: 24px; max-width: none; }
  .tx-brief .tx-body p,
  .tx-brief .tx-body li,
  .tx-brief .tx-body h3 { font-size: 15px; line-height: 1.7; }
  .tx-brief .tx-body p,
  .tx-brief .tx-body h3 { margin-bottom: 20px; }
  .tx-brief .tx-body li { padding-left: 14px; margin-bottom: 4px; }
}
@media screen and (max-width: 479px) {
  .tx-about, .tx-brief { padding: 32px 16px; }
  .tx-slide .tx-title, .tx-brief .tx-title { font-size: 30px; }
}