/* Shared only by the four refreshed templates. CMS owns resting backgrounds and copy. */
.rr-service-tile {
    --card-halo: rgba(23, 18, 69, .12);
    --card-hover-background: #171245;
    --card-hover-text: #F9F9F9;
    position: relative;
    isolation: isolate;
    box-shadow: 0 0 0 0 var(--card-halo), 0 0 0 0 var(--card-halo), 0 0 0 rgba(23, 18, 69, 0);
    transition: transform 220ms ease-out, background-color 220ms ease-out,
        color 220ms ease-out, box-shadow 300ms ease-out;
}
.rr-insights [data-card-surface="purple"] .rr-service-tile:not([style*="--insights-featured-card-background"]),
.rr-service-tile--artwork {
    --card-hover-background: #F9F9F9;
    --card-hover-text: #171245;
}
/* An overlay paints above artwork without changing the CMS background image. */
.rr-service-tile--artwork::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: #F9F9F9;
    opacity: 0;
    z-index: -1;
    pointer-events: none;
    transition: opacity 220ms ease-out;
}
html .rr-service-tile:is(:hover, :focus-within) {
    background-color: var(--card-hover-background);
    color: var(--card-hover-text);
    transform: translateY(-4px);
    box-shadow: 0 0 0 10px var(--card-halo),
        0 0 8px 10px var(--card-halo),
        0 10px 24px rgba(23, 18, 69, .12);
}
html .rr-insights .rr-service-tile:is(:hover, :focus-within) {
    --insights-card-background: var(--card-hover-background);
    background: var(--card-hover-background);
}
.rr-service-tile--artwork:is(:hover, :focus-within)::before { opacity: .97; }
/* Override legacy fixed text colours only within these cards. */
html .rr-service-tile:is(:hover, :focus-within) :is(h2, h3, p, .title, .description, .service-desription, .rr-country-locations__rte),
html .rr-service-tile:is(:hover, :focus-within) :is(h2, h3, p, .title, .description, .service-desription, .rr-country-locations__rte) :is(a, span, strong, em) {
    color: var(--card-hover-text) !important;
}
html .rr-service-tile .rr-country-card__name a:is(:hover, :focus-visible) { text-decoration: none; }
/* The single destination link stretches across the card. Secondary contact links remain usable. */
.rr-service-tile a { position: relative; z-index: 3; }
html .rr-service-tile :is(.rr-tile-link, .rr-insights__read) { position: static; }
.rr-service-tile :is(.rr-tile-link, .rr-insights__read)::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: inherit;
}
.rr-service-tile:has(:focus-visible) {
    outline: 3px solid #6A59FD;
    outline-offset: 4px;
}
.rr-service-tile :is(.rr-tile-link, .rr-insights__read):focus-visible::after {
    outline: 3px solid #6A59FD;
    outline-offset: -3px;
}
html .rr-service-tile :is(.rr-insights__card-footer, .rr-article__card-footer) {
    flex-direction: row;
    justify-content: flex-end;
}
html .rr-service-tile :is(time, .rr-insights__date) { order: -1; margin-right: auto; }
html .rr-service-tile :is(.rr-insights__read, .rr-article__button, .rr-tile-cta) {
    font-family: 'Archivo', sans-serif !important;
}
html .rr-service-tile .rr-tile-cta { display: table; margin-left: auto; border: 1px solid transparent; }
html .rr-service-tile:is(:hover, :focus-within) :is(.rr-insights__read, .rr-article__button, .rr-tile-cta),
html .rr-service-tile:is(:hover, :focus-within) :is(.rr-insights__read, .rr-article__button, .rr-tile-cta):is(:hover, :focus, :active) {
    background: #fff;
    border: 1px solid #171245;
    color: #171245 !important;
}
html .rr-service-tile:is(:hover, :focus-within) :is(time, .rr-insights__date) {
    color: var(--card-hover-text);
    opacity: .7;
}
/* Keep contact icons legible on the navy panel. */
.rr-service-tile:is(:hover, :focus-within) .rr-country-card__meta svg [stroke] { stroke: var(--card-hover-text); }
.rr-service-tile:is(:hover, :focus-within) .rr-country__actions a { background: #fff; }
@media (prefers-reduced-motion: reduce) {
    html .rr-service-tile,
    html .rr-service-tile *,
    html .rr-service-tile::before { transition: none !important; animation: none !important; }
    html .rr-service-tile:is(:hover, :focus-within) { transform: none; }
}


/* Legacy story panels are positioned; the covering link is their sibling. */
#china-success-stories-section .rr-service-tile .rr-tile-cta {
    display: table; margin-left: auto; font-family: 'Archivo', sans-serif !important;
}

/* Pass clicks on the positioned story panel through to the covering link. */
#china-success-stories-section .rr-service-tile .item-content {
    z-index: 3;
    pointer-events: none;
}
#china-success-stories-section .rr-service-tile .item-content a { pointer-events: auto; }