/* Service landing carousels use the card proportions and details of the
   homepage's Dikторы deck. Catalogue speaker cards remain independent. */
body:not(.homepage-refresh-page) .content .s-first--game .s-first__subtitle {
  color: #fff;
}

body:not(.homepage-refresh-page) .s-ar-speakers__cards .service-voice-card {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: minmax(30px, auto) 1fr;
  gap: 8px;
  width: 235px;
  min-width: 235px;
  margin: 0 12px;
  color: #273052;
  font-family: Roboto, sans-serif;
}

body:not(.homepage-refresh-page) .service-voice-card__role {
  box-sizing: border-box;
  align-self: end;
  width: 100%;
  margin: 0;
  color: #273052;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.25;
  text-align: center;
}

/* The public-page paragraph default loads before this component stylesheet. */
body:not(.homepage-refresh-page) .content .s-ar-speakers__cards .service-voice-card__role {
  color: #273052;
}

/* Master keeps fixed-width Slick slides on the game page so its arrows move
   through the deck. Centre the homepage-sized card inside each slide. */
body:not(.homepage-refresh-page) .s-ar-speakers__cards--game-famous .service-voice-card__role,
body:not(.homepage-refresh-page) .s-ar-speakers__cards--game-famous .service-voice-card__body {
  width: min(100%, 235px);
  margin-right: auto;
  margin-left: auto;
}

/* Slick clips overflowing shadows at the bottom of its viewport. Give the
   game deck enough room for every card shadow, including taller price rows. */
body:not(.homepage-refresh-page) .s-ar-speakers__cards--game-famous .slick-list {
  padding-bottom: 28px;
}

body:not(.homepage-refresh-page) .s-ar-speakers__cards--game-famous .service-voice-card {
  margin-right: 7px;
  margin-left: 7px;
}

body:not(.homepage-refresh-page) .service-voice-card__body {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 370px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(39, 55, 120, .12);
  border-radius: 19px;
  background: #fff;
  box-shadow: 0 16px 24px -10px rgba(36, 49, 80, .25), inset 0 1px #fff;
  text-align: center;
  transition: transform .28s, border-color .28s, box-shadow .28s;
}

body:not(.homepage-refresh-page) .service-voice-card:is(:hover, :focus-within) .service-voice-card__body {
  transform: translateY(-3px);
  border-color: rgba(193, 73, 46, .4);
  box-shadow: 0 24px 38px -20px rgba(36, 49, 80, .32), inset 0 1px #fff;
}

body:not(.homepage-refresh-page) .service-voice-card__portrait {
  position: relative;
  flex: none;
  width: 140px;
  height: 140px;
  margin: 0 auto 20px;
}

body:not(.homepage-refresh-page) .service-voice-card__player.player--img,
body:not(.homepage-refresh-page) .service-voice-card__player.player--img .player__back {
  width: 140px;
  height: 140px;
}

body:not(.homepage-refresh-page) .service-voice-card__player.player--img .player__back img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

body:not(.homepage-refresh-page) .service-voice-card__player.player--img .player__button {
  top: 14.645%;
  left: 14.645%;
  width: 56px;
  height: 56px;
  border: 3px solid #fffdfa;
  background: linear-gradient(145deg, #dc6845, #b53e25);
  box-shadow: inset 0 1px 1px #ffffff80, inset 0 -2px 3px #87331c40, 0 4px #e8d5c9, 0 7px 12px #74301830;
}

body:not(.homepage-refresh-page) .service-voice-card__player.player--img .player__icon-play {
  border-left-color: #fff;
}

body:not(.homepage-refresh-page) .service-voice-card__player.player--img .player__icon-pause {
  background: #fff;
}

body:not(.homepage-refresh-page) .service-voice-card__name {
  display: block;
  width: 100%;
  margin: 0 0 6px;
  color: #273052;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.12;
  text-align: center;
  text-decoration: none;
}

body:not(.homepage-refresh-page) .service-voice-card__name:is(:hover, :focus-visible) {
  color: #c1492e;
  text-decoration: underline;
}

body:not(.homepage-refresh-page) .service-voice-card__contact {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin-top: auto;
  padding: 0 18px;
  border: 1px solid #c1492e;
  border-radius: 12px;
  background: #c1492e;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  text-decoration: none;
}

body:not(.homepage-refresh-page) .service-voice-card__contact:is(:hover, :focus-visible) {
  border-color: #a93c25;
  background: #a93c25;
  color: #fff;
  text-decoration: none;
}

body:not(.homepage-refresh-page) .service-voice-card__contact span {
  display: none;
}

body:not(.homepage-refresh-page) .service-voice-card__price {
  display: block;
  margin-top: 8px;
  color: #69708d;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
}

@media (max-width: 650px) {
  body:not(.homepage-refresh-page) .s-ar-speakers__cards .service-voice-card {
    width: min(74vw, 250px);
    min-width: min(74vw, 250px);
  }

  /* A legacy inline rule enlarges all players inside #voices on phones. */
  body:not(.homepage-refresh-page) #voices .service-voice-card__player.player--img,
  body:not(.homepage-refresh-page) #voices .service-voice-card__player.player--img .player__back {
    width: 140px;
    height: 140px;
  }
}