/* Electric Sailboat Depot case study: values from the approved reference, scoped under .cs-esd (the article's class). */

/* hero */
.cs-esd .tw3-client img.tw7-logo.esd-logo { width: 190px; height: auto; }
.cs-esd .tw7-person b { display: block; }
.cs-esd .cs-stagecap { margin-top: 12px; }
.cs-esd .cs-stagecap + .tw3-client { margin-top: 22px; }

/* results: four plain tiles, "/5" beside the score */
.cs-esd .cs-tile__suffix { font-size: .42em; font-weight: 600; margin-left: 2px; color: inherit; opacity: .7; letter-spacing: 0; }

/* situation: the pull-quote is hidden on phones */
@media (max-width: 639px) { .cs-esd [aria-labelledby="cs-situation"] > blockquote { display: none; } }


/* the design */
.cs-esd .esd-mid { margin: 32px 0 0; }
.cs-esd .esd-mid__desk { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid rgba(0, 0, 0, .08); box-shadow: 0 16px 40px -24px rgba(0, 0, 0, .35); }
.cs-esd .esd-mid__tiles { display: none; list-style: none; margin: 0; padding: 0; }
.cs-esd .esd-mid__tiles img { display: block; width: 100%; height: auto; border-radius: 12px; }
.cs-esd .esd-mid__cap { margin-top: 10px; font-size: 14px; color: #4B5563; }
@media (max-width: 639px) {
  .cs-esd .esd-mid__desk { display: none; }
  .cs-esd .esd-mid__tiles { display: grid; gap: 10px; }
}

/* after launch: the shared card (tinted run column, white paragraphs column) */
.cs-esd .tw13-after { margin-top: 24px; }
@media (min-width: 768px) { .cs-esd .tw13-after { margin-top: 32px; } }
.cs-esd .esd-after__b > p:first-child { margin-top: 0; }

/* read next */
.cs-esd nav[aria-label="Read next"] > .cs-small { color: #4B5563; }
