/* BMH-ADFX v2 — "2035" ad look: glass + depth + light. 26 places, 26 combinations of light colour, scene and motion.
   The advertiser's own logo, words, colours and link are untouched; only the stage around them changes. */
a.bmh-ad-card.bmhfx{
  --c1:#22d3ee;--c2:#a78bfa;--c3:#f472b6;--spd:9s;
  position:relative;isolation:isolate;overflow:hidden;border-radius:24px!important;border:0!important;
  box-shadow:0 22px 44px -22px rgba(2,6,23,.75),0 2px 0 rgba(255,255,255,.18) inset,0 -18px 40px -24px rgba(0,0,0,.55) inset!important;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;
  transform:perspective(1200px) translateZ(0);
}
a.bmh-ad-card.bmhfx:hover{transform:perspective(1200px) rotateX(3deg) translateY(-3px);box-shadow:0 34px 60px -24px rgba(2,6,23,.85),0 2px 0 rgba(255,255,255,.22) inset!important}
/* glass + aurora layer over the advertiser's colours */
a.bmh-ad-card.bmhfx::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:
    radial-gradient(60% 120% at 12% 0%,color-mix(in srgb,var(--c1) 55%,transparent),transparent 60%),
    radial-gradient(55% 120% at 92% 110%,color-mix(in srgb,var(--c2) 55%,transparent),transparent 60%),
    linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,0) 42%,rgba(0,0,0,.22));
  mix-blend-mode:screen;opacity:.75;background-size:140% 140%,140% 140%,100% 100%;
  animation:adAurora var(--spd) ease-in-out infinite alternate}
/* light running round the edge */
a.bmh-ad-card.bmhfx::after{content:""!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;left:0!important;top:0!important;
  transform:none!important;opacity:1!important;border-radius:inherit;padding:1.6px;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--a,0deg),transparent 0 55%,var(--c1) 65%,var(--c2) 75%,var(--c3) 82%,transparent 92%)!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:adEdge 6s linear infinite!important}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes adEdge{to{--a:360deg}}
@keyframes adAurora{0%{background-position:0% 0%,100% 100%,0 0}100%{background-position:30% 20%,70% 80%,0 0}}
/* label */
a.bmh-ad-card.bmhfx .bmh-ad-label{z-index:4;font:600 10px/1 system-ui,sans-serif!important;letter-spacing:.14em;text-transform:uppercase;padding:5px 9px!important;border-radius:999px!important;
  background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff!important}
/* logo: a lit glass tile standing in 3D */
a.bmh-ad-card.bmhfx .bmh-ad-logo{animation:none!important;opacity:1!important;z-index:2;border-radius:22px!important;background:linear-gradient(160deg,#fff,#eef2ff)!important;
  box-shadow:0 18px 30px -12px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.7) inset,0 0 28px -6px color-mix(in srgb,var(--c1) 70%,transparent)!important;
  transform:perspective(700px) rotateY(-14deg) rotateX(6deg);transform-style:preserve-3d}
a.bmh-ad-card.bmhfx .bmh-ad-logo::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.75) 45%,rgba(255,255,255,0) 60%);background-size:250% 100%;animation:adGloss 5.5s ease-in-out infinite}
@keyframes adGloss{0%,55%{background-position:150% 0}85%,100%{background-position:-60% 0}}
/* words */
a.bmh-ad-card.bmhfx .bmh-ad-text{animation:none!important;opacity:1!important;z-index:2;gap:3px}
a.bmh-ad-card.bmhfx .bmh-ad-text b{font-weight:800;letter-spacing:-.01em;background:linear-gradient(180deg,#fff 40%,#dbe4ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
a.bmh-ad-card.bmhfx .bmh-ad-text small{color:rgba(255,255,255,.92);opacity:1}
a.bmh-ad-card.bmhfx .bmh-ad-text em{font-style:normal;align-self:center;font-size:11.5px;padding:3px 11px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* button: a glowing pill */
a.bmh-ad-card.bmhfx .bmh-ad-cta{animation:none!important;opacity:1!important;z-index:2;font-weight:800!important;border-radius:999px!important;
  background:linear-gradient(180deg,#fff,#e9edff)!important;box-shadow:0 10px 24px -8px color-mix(in srgb,var(--c1) 80%,transparent),0 0 0 1px rgba(255,255,255,.8) inset!important}
a.bmh-ad-card.bmhfx .bmh-ad-cta::after{content:"";position:absolute;inset:-4px;border-radius:inherit;border:1px solid color-mix(in srgb,var(--c1) 70%,transparent);opacity:0;animation:adRing 3s ease-out infinite}
@keyframes adRing{0%{opacity:.9;transform:scale(.92)}70%,100%{opacity:0;transform:scale(1.18)}}

/* ---------- motions ---------- */
@keyframes mFloat{0%,100%{transform:perspective(700px) rotateY(-14deg) rotateX(6deg) translateY(0)}50%{transform:perspective(700px) rotateY(-8deg) rotateX(2deg) translateY(-7px)}}
@keyframes mOrbit{0%{transform:perspective(700px) rotateY(-18deg) rotateX(8deg)}25%{transform:perspective(700px) rotateY(0) rotateX(12deg)}50%{transform:perspective(700px) rotateY(18deg) rotateX(4deg)}75%{transform:perspective(700px) rotateY(0) rotateX(-6deg)}100%{transform:perspective(700px) rotateY(-18deg) rotateX(8deg)}}
@keyframes mTurn{0%,40%{transform:perspective(700px) rotateY(-14deg)}60%,100%{transform:perspective(700px) rotateY(346deg)}}
@keyframes mBreath{0%,100%{transform:perspective(700px) rotateY(-14deg) rotateX(6deg) scale(1)}50%{transform:perspective(700px) rotateY(-14deg) rotateX(6deg) scale(1.06)}}
@keyframes mRise{0%{opacity:0;transform:translateY(14px);filter:blur(6px)}12%,88%{opacity:1;transform:none;filter:blur(0)}100%{opacity:0;transform:translateY(-6px);filter:blur(4px)}}
@keyframes mFocus{0%{opacity:0;letter-spacing:.25em;filter:blur(8px)}14%,90%{opacity:1;letter-spacing:-.01em;filter:blur(0)}100%{opacity:0;filter:blur(6px)}}
@keyframes mCycle1{0%,30%{opacity:1;transform:none}36%,94%{opacity:0;transform:translateY(-10px)}100%{opacity:1}}
@keyframes mCycle2{0%,30%{opacity:0;transform:translateY(10px)}36%,63%{opacity:1;transform:none}69%,100%{opacity:0;transform:translateY(-10px)}}
@keyframes mCycle3{0%,63%{opacity:0;transform:translateY(10px)}69%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes sScan{0%{transform:translateY(-120%)}100%{transform:translateY(220%)}}
@keyframes sSweep{0%,40%{transform:translateX(-130%) skewX(-18deg)}75%,100%{transform:translateX(330%) skewX(-18deg)}}
@keyframes sDots{to{background-position:60px -60px,-40px 40px}}
@keyframes sGrid{to{background-position:0 44px}}
@keyframes sBeam{0%,100%{opacity:.25;transform:rotate(-20deg) translateX(-10%)}50%{opacity:.6;transform:rotate(-20deg) translateX(10%)}}
@keyframes sPulse{0%,100%{opacity:.35}50%{opacity:.85}}

/* scene layer (on the logo tile's parent area) is drawn with the text block's ::before so the card's own pseudos stay free */
a.bmh-ad-card.bmhfx .bmh-ad-text::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:24px}

/* light colours (8 palettes) */
a.bmh-ad-card.bmhfx.pal-1{--c1:#22d3ee;--c2:#a78bfa;--c3:#f472b6}
a.bmh-ad-card.bmhfx.pal-2{--c1:#34d399;--c2:#22d3ee;--c3:#a3e635}
a.bmh-ad-card.bmhfx.pal-3{--c1:#fbbf24;--c2:#fb7185;--c3:#f472b6}
a.bmh-ad-card.bmhfx.pal-4{--c1:#60a5fa;--c2:#818cf8;--c3:#e0e7ff}
a.bmh-ad-card.bmhfx.pal-5{--c1:#f472b6;--c2:#c084fc;--c3:#38bdf8}
a.bmh-ad-card.bmhfx.pal-6{--c1:#2dd4bf;--c2:#f0abfc;--c3:#fde68a}
a.bmh-ad-card.bmhfx.pal-7{--c1:#fb923c;--c2:#facc15;--c3:#fef3c7}
a.bmh-ad-card.bmhfx.pal-8{--c1:#a5f3fc;--c2:#ffffff;--c3:#c7d2fe}

/* logo motion (6) */
a.bmh-ad-card.bmhfx.lm-1 .bmh-ad-logo{animation:mFloat 5s ease-in-out infinite!important}
a.bmh-ad-card.bmhfx.lm-2 .bmh-ad-logo{animation:mOrbit 9s ease-in-out infinite!important}
a.bmh-ad-card.bmhfx.lm-3 .bmh-ad-logo{animation:mTurn 8s cubic-bezier(.6,0,.2,1) infinite!important}
a.bmh-ad-card.bmhfx.lm-4 .bmh-ad-logo{animation:mBreath 4s ease-in-out infinite!important}
a.bmh-ad-card.bmhfx.lm-5 .bmh-ad-logo{animation:mFloat 6.5s ease-in-out infinite reverse!important}
a.bmh-ad-card.bmhfx.lm-6 .bmh-ad-logo{animation:mOrbit 12s linear infinite reverse!important}

/* text motion (4) */
a.bmh-ad-card.bmhfx.tm-2 .bmh-ad-text{animation:mRise 8s ease infinite!important}
a.bmh-ad-card.bmhfx.tm-3 .bmh-ad-text b{animation:mFocus 8s ease infinite}
a.bmh-ad-card.bmhfx.tm-4 .bmh-ad-text{display:grid!important;align-content:center;justify-items:center}
a.bmh-ad-card.bmhfx.tm-4 .bmh-ad-text>*{grid-row:1;grid-column:1}
a.bmh-ad-card.bmhfx.tm-4 .bmh-ad-text b{animation:mCycle1 10s ease infinite}
a.bmh-ad-card.bmhfx.tm-4 .bmh-ad-text small{animation:mCycle2 10s ease infinite;font-size:1.08em}
a.bmh-ad-card.bmhfx.tm-4 .bmh-ad-text em{animation:mCycle3 10s ease infinite}

/* scenes (7) — drawn on the text block's ::before, stretched over the whole card */
a.bmh-ad-card.bmhfx .bmh-ad-text{position:static}
a.bmh-ad-card.bmhfx.sc-1 .bmh-ad-text::before{background:linear-gradient(180deg,transparent,rgba(255,255,255,.18) 50%,transparent);height:40%;animation:sScan 4.5s linear infinite}
a.bmh-ad-card.bmhfx.sc-2 .bmh-ad-text::before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);width:30%;animation:sSweep 6s ease-in-out infinite}
a.bmh-ad-card.bmhfx.sc-3 .bmh-ad-text::before{background:radial-gradient(circle,rgba(255,255,255,.55) 1px,transparent 1.6px) 0 0/22px 22px,radial-gradient(circle,color-mix(in srgb,var(--c1) 80%,transparent) 1px,transparent 1.8px) 11px 11px/30px 30px;opacity:.6;animation:sDots 9s linear infinite}
a.bmh-ad-card.bmhfx.sc-4 .bmh-ad-text::before{top:45%;background:linear-gradient(color-mix(in srgb,var(--c1) 45%,transparent) 1px,transparent 1px) 0 0/100% 22px,linear-gradient(90deg,color-mix(in srgb,var(--c1) 45%,transparent) 1px,transparent 1px) 0 0/34px 100%;transform:perspective(220px) rotateX(55deg);transform-origin:50% 0;opacity:.5;-webkit-mask:linear-gradient(transparent,#000 70%);mask:linear-gradient(transparent,#000 70%);animation:sGrid 2.4s linear infinite}
a.bmh-ad-card.bmhfx.sc-5 .bmh-ad-text::before{inset:-40% 10% -40% 30%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c2) 45%,transparent),transparent);filter:blur(10px);animation:sBeam 7s ease-in-out infinite}
a.bmh-ad-card.bmhfx.sc-6 .bmh-ad-text::before{background:radial-gradient(40% 90% at 50% 50%,color-mix(in srgb,var(--c3) 40%,transparent),transparent 70%);animation:sPulse 4s ease-in-out infinite}
a.bmh-ad-card.bmhfx.sc-7 .bmh-ad-text::before{display:none}

/* mirrored layout for a few places */
a.bmh-ad-card.bmhfx.mir{flex-direction:row-reverse}
a.bmh-ad-card.bmhfx.mir .bmh-ad-label{left:14px;right:auto}
a.bmh-ad-card.bmhfx.mir .bmh-ad-logo{transform:perspective(700px) rotateY(14deg) rotateX(6deg)}

@media (prefers-reduced-motion:reduce){a.bmh-ad-card.bmhfx,a.bmh-ad-card.bmhfx *,a.bmh-ad-card.bmhfx::before,a.bmh-ad-card.bmhfx::after,a.bmh-ad-card.bmhfx *::before,a.bmh-ad-card.bmhfx *::after{animation:none!important}}

/* BMH-ADFX-LABEL: the AD tag is a small chip in a corner, never a long bar */
a.bmh-ad-card.bmhfx .bmh-ad-label{left:auto!important;right:12px!important;width:auto!important;max-width:max-content}
a.bmh-ad-card.bmhfx.mir .bmh-ad-label{right:auto!important;left:14px!important}