/* SlowUp Valais: Strapi ranking only. Editorial page styles remain untouched. */
.strapi-ranking-hero .strapi-rank-wrap { max-width: 1080px; }
.sr-rating { width: 100%; margin: 0 auto; color: #f7f5f5; font-family: Inter, sans-serif; }
.sr-updated { margin: 0 0 14px !important; color: #f2d9dc; font-size: 14px; font-style: italic; }
.sr-updated time { color: #fff; font-weight: 650; }
.sr-unavailable { padding: 18px; border: 1px solid #944651; border-radius: 12px; background: #271920; }
.sr-card {
  position: relative;
  margin: 0 0 16px;
  padding: 22px 24px 20px;
  border: 1px solid #6b3740;
  border-radius: 18px;
  background: linear-gradient(125deg, #211c22 0%, #191a21 55%, #25151e 100%);
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
  overflow: hidden;
}
.sr-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, #9c0000, #d74e45, #cba173); }
.sr-card-first { border-color: #bd7968; padding-top: 32px; }
.sr-choice { position: absolute; top: 3px; left: 22px; padding: 3px 11px 4px; border-radius: 0 0 9px 9px; background: #e2aa69; color: #27171a; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.sr-card-main { display: grid; grid-template-columns: 150px minmax(0,1fr) 155px; gap: 20px; align-items: center; }
.sr-brand { min-width: 0; text-align: center; }
.sr-logo { display: grid; place-items: center; width: 150px; height: 83px; max-width: 100%; margin: 0 auto 8px; border: 1px solid #3a333a; border-radius: 11px; background: #101116; overflow: hidden; }
.sr-logo img { max-width: 92%; max-height: 76%; object-fit: contain; }
.sr-logo span { color: #fff; font-size: 16px; font-weight: 700; }
.sr-brand-name { display: block; color: #f7eded; font-size: 14px; line-height: 1.2; overflow-wrap: anywhere; }
.sr-score { display: block; margin-top: 4px; color: #f2bf76; font-size: 15px; font-weight: 700; }
.sr-score small { color: #d0b9bc; font-size: 11px; font-weight: 500; }
.sr-content { min-width: 0; }
.sr-offer { display: block; margin-bottom: 10px; color: #fff; font-size: clamp(19px,2vw,25px); font-weight: 750; line-height: 1.2; }
.sr-features { display: grid; gap: 5px; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.sr-features li { position: relative; padding-left: 18px; color: #e2d9dd; font-size: 14px; font-weight: 450; line-height: 1.3; }
.sr-features li::before { content: "✓"; position: absolute; left: 0; color: #e7ad7d; font-weight: 800; }
.sr-action { align-self: center; }
.sr-cta { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #ed7468; border-radius: 11px; background: linear-gradient(180deg, #bb2630, #881723); color: #fff !important; box-shadow: 0 8px 18px rgba(119,12,24,.28); font-size: 15px; font-weight: 750; text-align: center; text-transform: uppercase; }
.sr-cta:hover, .sr-cta:focus-visible { background: linear-gradient(180deg,#d2383d,#a31e2a); color: #fff !important; }
.sr-details-desktop { margin: 18px 0 0 170px; padding-top: 16px; border-top: 1px solid #54343e; }
.sr-details-mobile { display: none; }
.sr-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.sr-metric { min-width: 0; padding: 9px 12px; border: 1px solid #514147; border-radius: 10px; background: #29232b; }
.sr-metric span { display: block; color: #cbb8bd; font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.sr-metric strong { display: block; color: #fff; font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
.sr-payments { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.sr-payments span { padding: 3px 8px; border: 1px solid #654a51; border-radius: 7px; color: #f2dfe2; font-size: 11px; }
.sr-special,.sr-promo,.sr-responsible { margin: 9px 0 !important; color: #e3d3d7; font-size: 13px; }
.sr-review { color: #ffb6ad !important; font-size: 13px; text-decoration: underline !important; }
@media (max-width: 900px) and (min-width: 768px) {
  .sr-card-main { grid-template-columns: 125px minmax(0,1fr) 125px; gap: 12px; }
  .sr-logo { width: 120px; height: 70px; }
  .sr-details-desktop { margin-left: 137px; }
}
@media (max-width: 767px) {
  .section-hero.strapi-ranking-hero { padding: 18px 0 36px; }
  .strapi-ranking-hero .container { padding-left: 13px; padding-right: 13px; }
  .strapi-ranking-hero .row > .col-lg-3 { display: none !important; }
  .strapi-ranking-hero h1 { font-size: 34px !important; line-height: 1.03 !important; text-align: left; margin: 0 0 8px !important; }
  .strapi-ranking-hero .col-lg-12 > p { max-width: 100%; margin: 0 0 9px !important; color: #f4dedf; font-size: 12.5px; line-height: 1.36; }
  .strapi-ranking-hero .strapi-rank-wrap { padding-top: 6px !important; }
  .sr-updated { margin-bottom: 8px !important; font-size: 12px; }
  .sr-card { margin-bottom: 11px; padding: 16px; border-radius: 14px; }
  .sr-card-first { padding-top: 31px; }
  .sr-choice { left: 16px; padding: 3px 10px 4px; font-size: 10px; }
  .sr-card-main { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
  .sr-brand { display: grid; grid-template-columns: 120px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 13px; min-height: 82px; text-align: left; align-items: center; }
  .sr-logo { grid-row: 1 / 3; width: 120px; height: 82px; margin: 0; border-radius: 9px; }
  .sr-brand-name { grid-column: 2; font-size: 15px; }
  .sr-score { grid-column: 2; font-size: 15px; }
  .sr-score small { display: block; font-size: 11px; }
  .sr-content { width: 100%; }
  .sr-offer { margin-bottom: 10px; font-size: 19px; line-height: 1.2; }
  .sr-features { gap: 6px; }
  .sr-features li { padding-left: 17px; font-size: 14px; line-height: 1.3; }
  .sr-action { width: 100%; }
  .sr-cta { min-height: 44px; padding: 8px 12px; font-size: 14px; border-radius: 9px; }
  .sr-details-desktop { display: none; }
  .sr-details-mobile { display: block; margin-top: 9px; border-top: 1px solid #54343e; color: #f6eaea; }
  .sr-details-mobile summary { padding: 7px 0 0; color: #ffc4b3; cursor: pointer; font-size: 11px; font-weight: 700; }
  .sr-details-mobile[open] summary { margin-bottom: 8px; }
  .sr-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
  .sr-metric { padding: 7px; }
  .sr-metric strong { font-size: 12px; }
  .sr-payments span { font-size: 10px; }
}