/* Consistent gradient lift + shine behaviour for the site's content cards. */
@media (hover: hover) {
  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transition: transform 280ms ease, box-shadow 280ms ease, border-color 280ms ease, color 280ms ease;
  }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ) > * { position: relative; z-index: 1; }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  )::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    content: '';
    opacity: 0;
    background: linear-gradient(135deg, #27677c 0%, #174b5f 52%, #e96735 100%);
    transition: opacity 280ms ease;
  }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  )::after {
    position: absolute;
    z-index: 2;
    top: -40%;
    bottom: -40%;
    left: -45%;
    width: 28%;
    content: '';
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform: translateX(-170%) skewX(-20deg);
    transition: transform 720ms ease, opacity 160ms ease;
  }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ):is(:hover, :focus-within) {
    color: #fff;
    border-color: transparent;
    box-shadow: 0 22px 38px rgba(11, 32, 48, .26);
    transform: translateY(-8px);
  }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ):is(:hover, :focus-within)::before { opacity: 1; }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ):is(:hover, :focus-within)::after {
    opacity: 1;
    transform: translateX(620%) skewX(-20deg);
  }

  :is(
    .service-card,
    .issue-grid a,
    .benefit-grid article,
    .premium-review-card,
    .catalogue-grid article,
    .flow-grid li,
    .service-menu-grid a,
    .type-grid a,
    .faq-list details,
    .contact-details > div,
    .request-card,
    .privacy-nav a,
    .faq-support .shell,
    .review-contact
  ):is(:hover, :focus-within) :is(h2, h3, p, span, strong, b, li, blockquote, a, address, summary) { color: #fff !important; }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .flow-grid li) :is(.service-icon, .issue-grid span, .benefit-grid b, .review-avatar, .flow-grid b) {
    transition: transform 280ms ease, background 280ms ease, color 280ms ease, box-shadow 280ms ease;
  }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .flow-grid li):is(:hover, :focus-within) :is(.service-icon, .issue-grid span, .benefit-grid b, .review-avatar, .flow-grid b) {
    color: #27677c !important;
    background: #fff;
    box-shadow: 0 9px 18px rgba(11, 32, 48, .22);
    transform: translateY(-5px) scale(1.15);
  }

  .catalogue-grid article:is(:hover, :focus-within) .catalogue-link,
  .request-card:is(:hover, :focus-within) .button,
  .faq-support .shell:is(:hover, :focus-within) .button,
  .review-contact:is(:hover, :focus-within) .button { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .62); }

  .premium-review-card:is(:hover, :focus-within) footer { border-color: rgba(255, 255, 255, .3); }
  .premium-review-card:is(:hover, :focus-within) .verified-label { background: rgba(255, 255, 255, .18); }
}

@media (prefers-reduced-motion: reduce) {
  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact) { transition: none; }
}

/* Touch devices get the same visual response while a card is pressed. */
@media (hover: none) and (prefers-reduced-motion: no-preference) {
  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transition: transform 180ms ease, box-shadow 180ms ease, color 180ms ease;
  }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact)::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    content: '';
    opacity: 0;
    background: linear-gradient(135deg, #27677c 0%, #174b5f 52%, #e96735 100%);
    transition: opacity 180ms ease;
  }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact) > * {
    position: relative;
    z-index: 1;
  }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact):active {
    color: #fff;
    box-shadow: 0 14px 27px rgba(11, 32, 48, .22);
    transform: translateY(-4px) scale(.99);
  }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact):active::before { opacity: 1; }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .catalogue-grid article, .flow-grid li, .service-menu-grid a, .type-grid a, .faq-list details, .contact-details > div, .request-card, .privacy-nav a, .faq-support .shell, .review-contact):active :is(h2, h3, p, span, strong, b, li, blockquote, a, address, summary) { color: #fff !important; }

  :is(.service-card, .issue-grid a, .benefit-grid article, .premium-review-card, .flow-grid li):active :is(.service-icon, .issue-grid span, .benefit-grid b, .review-avatar, .flow-grid b) {
    color: #27677c !important;
    background: #fff;
    transform: translateY(-3px) scale(1.1);
  }
}
