/**
 * MEO Safety cross-promotion cards.
 *
 * Both cards share one responsive structure. The tracker tile keeps its
 * translucent product layer, while ROLA uses one honest product photograph.
 */
.ufm-footer-meo-promos{
  box-sizing:border-box;width:min(1320px,100%);margin:32px auto 0;
  grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;
}
.ufm-footer-meo-promo{
  box-sizing:border-box;min-width:0;padding:18px;display:grid;
  grid-template-columns:minmax(150px,42%) minmax(0,1fr);align-items:center;gap:20px;
  overflow:hidden;border:1px solid #ffffff26;border-radius:24px;color:#171327;
  background:linear-gradient(135deg,#f8f4ec 0%,#effbfa 100%);box-shadow:0 20px 46px #0003;
}
.ufm-footer-meo-promo--rola{background:linear-gradient(135deg,#f5fbfa 0%,#eee8f8 100%)}
.ufm-footer-meo-promo figure{min-width:0;margin:0;overflow:hidden;border-radius:18px;background:#e4f7f4}
.ufm-footer-meo-visual{
  --ufm-tracker-tile-width:clamp(82px,39%,116px);--ufm-tracker-tile-right:9px;
  --ufm-tracker-tile-bottom:9px;--ufm-tracker-tile-radius:14px;
  position:relative;isolation:isolate;aspect-ratio:7/5;
}
.ufm-footer-meo-lifestyle{width:100%;height:100%;display:block;object-fit:cover;object-position:58% 50%}
.ufm-footer-meo-promo--tracker .ufm-footer-meo-visual::after{
  content:"";width:var(--ufm-tracker-tile-width);aspect-ratio:640/425;
  right:var(--ufm-tracker-tile-right);bottom:var(--ufm-tracker-tile-bottom);z-index:1;
  position:absolute;display:block;border:1px solid #ffffff8a;
  border-radius:var(--ufm-tracker-tile-radius);
  background:linear-gradient(135deg,rgba(255,255,255,.52),rgba(255,255,255,.18));
  -webkit-backdrop-filter:blur(4px) saturate(1.04);backdrop-filter:blur(4px) saturate(1.04);
  box-shadow:0 12px 26px #09233336;transform:rotate(2deg);pointer-events:none;
}
.ufm-footer-meo-product{
  width:var(--ufm-tracker-tile-width);height:auto;right:var(--ufm-tracker-tile-right);
  bottom:var(--ufm-tracker-tile-bottom);z-index:2;position:absolute;display:block;
  border:0;border-radius:var(--ufm-tracker-tile-radius);background:transparent;
  box-shadow:none;mix-blend-mode:multiply;opacity:.82;transform:rotate(2deg);
}
.ufm-footer-rola-visual{aspect-ratio:1}
.ufm-footer-rola-visual .ufm-footer-meo-lifestyle{object-position:center}
.ufm-footer-meo-copy{min-width:0;display:grid;justify-items:start;align-content:center;gap:8px}
.ufm-footer .ufm-footer-meo-eyebrow{
  max-width:none;margin:0;color:#167f83;font-size:.7rem;font-weight:850;
  line-height:1.3;letter-spacing:.12em;text-transform:uppercase;
}
.ufm-footer-meo-copy h2{
  max-width:30ch;margin:0;color:#171327;font-size:clamp(1.15rem,1.55vw,1.55rem);
  line-height:1.12;letter-spacing:-.025em;
}
.ufm-footer .ufm-footer-meo-copy>p:not(.ufm-footer-meo-eyebrow){
  max-width:54ch;margin:0;color:#514b58;font-size:.82rem;line-height:1.5;
}
.ufm-footer .ufm-footer-meo-cta{
  box-sizing:border-box;min-height:44px;margin-top:5px;padding:11px 14px;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:1px solid #173657;border-radius:12px;color:#fff;background:#173657;
  font-size:.78rem;font-weight:800;line-height:1.25;text-align:center;
}
.ufm-footer .ufm-footer-meo-cta:hover{border-color:#0b6e73;color:#fff;background:#0b6e73;text-decoration:none}
.ufm-footer .ufm-footer-meo-cta:focus-visible{outline:3px solid #ff8066;outline-offset:3px;color:#fff;text-decoration:none}
.ufm-footer-meo-cta span{font-size:1rem;line-height:1}

@media(max-width:1023px){
  .ufm-footer-meo-promos{grid-template-columns:1fr}
  .ufm-footer-meo-promo{grid-template-columns:minmax(190px,280px) minmax(0,1fr)}
}
@media(max-width:599px){
  .ufm-footer-meo-promos{margin-top:24px;gap:14px}
  .ufm-footer-meo-promo{padding:13px;grid-template-columns:1fr;gap:16px;border-radius:20px}
  .ufm-footer-meo-promo figure{border-radius:14px}
  .ufm-footer-meo-visual{aspect-ratio:16/9}
  .ufm-footer-rola-visual{aspect-ratio:3/2}
  .ufm-footer-meo-lifestyle{object-position:62% 50%}
  .ufm-footer-meo-visual{
    --ufm-tracker-tile-width:min(32%,112px);--ufm-tracker-tile-right:8px;
    --ufm-tracker-tile-bottom:8px;--ufm-tracker-tile-radius:11px;
  }
  .ufm-footer-meo-copy{padding:2px 3px 4px}
  .ufm-footer-meo-copy h2{font-size:1.22rem}
  .ufm-footer .ufm-footer-meo-copy>p:not(.ufm-footer-meo-eyebrow){font-size:.83rem}
  .ufm-footer .ufm-footer-meo-cta{width:100%;font-size:.79rem}
}
