/* Shared feedback for linked cards, including CMS-rendered content.
   Load after page styles so every catalogue uses the same interaction. */
body.premium-site {
  --card-lift: -5px;
  --card-shadow: 0 14px 32px rgb(52 88 212 / 10%), 0 3px 8px rgb(52 88 212 / 4%);
  --card-edge: #adbef3;
  --card-surface: #fff;
  --card-focus: var(--brand-blue, #3458d4);
}

body.premium-site :is(
  a.service-card[href],
  .service-premium-nav > a[href],
  .scenario-entries > a[href],
  a.home-article[href],
  a.product-card[href],
  .about-office-card:has(a[href]),
  a.detail-scenario-card[href],
  .content-related > a[href],
  .article-service-links > a[href],
  .article-downloads > a[href],
  .header-nav a.mega-menu-link[href],
  .header-nav a.mega-recommendation-link[href],
  .cms-richtext a.cms-card[href],
  .cms-richtext a[href]:has(> .cms-card),
  .featured-case:has(.featured-case-copy > a[href]),
  .page-case-card:has(.page-case-content > a[href]),
  .page-insight-feature:has(.page-feature-copy > a[href]),
  .page-article-card:has(.page-article-card-bottom > a[href]),
  .page-related-card:has(> a.page-text-link[href])
) {
  position: relative;
  transition: transform 220ms cubic-bezier(.2,.65,.3,1), box-shadow 220ms ease,
    border-color 220ms ease, background-color 220ms ease;
}

/* Each editorial card has one destination. Extend its existing reading link
   to the card surface while preserving native links and keyboard navigation. */
body.premium-site :is(
  .featured-case-copy > a[href],
  .page-case-content > a.page-text-link[href],
  .page-feature-copy > a.page-text-link[href],
  .page-article-card-bottom > a[href],
  .page-related-card > a.page-text-link[href]
)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
}

body.premium-site .cms-richtext :is(a.cms-card[href], a[href]:has(> .cms-card)) {
  display: block;
}
body.premium-site .page-block-theme-dark .cms-richtext :is(a.cms-card[href], a[href]:has(> .cms-card)) {
  --card-surface: rgb(255 255 255 / 12%);
  --card-edge: rgb(226 234 255 / 55%);
  --card-focus: var(--on-blue, #fff);
  --card-shadow: 0 14px 32px rgb(32 59 136 / 18%);
}

/* Compact rows and navigation use a quieter lift. */
body.premium-site :is(.article-downloads > a[href], .header-nav a.mega-menu-link[href], .header-nav a.mega-recommendation-link[href]) {
  --card-lift: -3px;
  --card-shadow: 0 8px 20px rgb(52 88 212 / 9%);
}
body.premium-site .header-nav :is(a.mega-menu-link[href], a.mega-recommendation-link[href]) {
  --card-surface: var(--nav-hover, rgb(52 88 212 / 7%));
  --card-focus: var(--nav-active, var(--brand-blue, #3458d4));
}
/* This row sits inside the clipped hero; keep its focus ring inside. */
body.premium-site .service-premium-nav > a[href] {
  --card-lift: -4px;
  --card-surface: var(--brand-mid, #4669dc);
  --card-edge: rgb(226 234 255 / 55%);
  --card-shadow: 0 8px 22px rgb(32 59 136 / 20%), inset 0 0 0 1px rgb(226 234 255 / 26%);
  --card-focus: var(--on-blue, #fff);
  --card-focus-offset: -3px;
}

/* Touch devices keep their natural tap behaviour without sticky hover. */
@media (hover: hover) and (pointer: fine) {
body.premium-site :is(
  a.service-card[href],
  .service-premium-nav > a[href],
  .scenario-entries > a[href],
  a.home-article[href],
  a.product-card[href],
  .about-office-card:has(a[href]),
  a.detail-scenario-card[href],
  .content-related > a[href],
  .article-service-links > a[href],
  .article-downloads > a[href],
  .header-nav a.mega-menu-link[href],
  .header-nav a.mega-recommendation-link[href],
  .cms-richtext a.cms-card[href],
  .cms-richtext a[href]:has(> .cms-card),
  .featured-case:has(.featured-case-copy > a[href]),
  .page-case-card:has(.page-case-content > a[href]),
  .page-insight-feature:has(.page-feature-copy > a[href]),
  .page-article-card:has(.page-article-card-bottom > a[href]),
  .page-related-card:has(> a.page-text-link[href])
):hover {
    transform: translateY(var(--card-lift));
    box-shadow: var(--card-shadow);
    border-color: var(--card-edge);
    background-color: var(--card-surface);
    z-index: 3;
  }
}

body.premium-site :is(
  a.service-card[href],
  .service-premium-nav > a[href],
  .scenario-entries > a[href],
  a.home-article[href],
  a.product-card[href],
  .about-office-card:has(a[href]),
  a.detail-scenario-card[href],
  .content-related > a[href],
  .article-service-links > a[href],
  .article-downloads > a[href],
  .header-nav a.mega-menu-link[href],
  .header-nav a.mega-recommendation-link[href],
  .cms-richtext a.cms-card[href],
  .cms-richtext a[href]:has(> .cms-card),
  .featured-case:has(.featured-case-copy > a[href]),
  .page-case-card:has(.page-case-content > a[href]),
  .page-insight-feature:has(.page-feature-copy > a[href]),
  .page-article-card:has(.page-article-card-bottom > a[href]),
  .page-related-card:has(> a.page-text-link[href])
):is(:focus-visible, :has(a:focus-visible)) {
  transform: translateY(var(--card-lift));
  box-shadow: var(--card-shadow);
  border-color: var(--card-edge);
  outline: 2px solid var(--card-focus);
  outline-offset: var(--card-focus-offset, 3px);
  z-index: 3;
}

@media (prefers-reduced-motion: reduce) {
body.premium-site :is(
  a.service-card[href],
  .service-premium-nav > a[href],
  .scenario-entries > a[href],
  a.home-article[href],
  a.product-card[href],
  .about-office-card:has(a[href]),
  a.detail-scenario-card[href],
  .content-related > a[href],
  .article-service-links > a[href],
  .article-downloads > a[href],
  .header-nav a.mega-menu-link[href],
  .header-nav a.mega-recommendation-link[href],
  .cms-richtext a.cms-card[href],
  .cms-richtext a[href]:has(> .cms-card),
  .featured-case:has(.featured-case-copy > a[href]),
  .page-case-card:has(.page-case-content > a[href]),
  .page-insight-feature:has(.page-feature-copy > a[href]),
  .page-article-card:has(.page-article-card-bottom > a[href]),
  .page-related-card:has(> a.page-text-link[href])
) {
    --card-lift: 0px;
    transition: none;
  }
}
