/* UnitDime R12R6: mobile hero decorative cluster refinement over R12R5. */
@media (max-width:700px) {
  body.mp-public .mp-hero {
    background:
      radial-gradient(120px 92px at 88% 18%, rgba(162,134,255,.14), rgba(162,134,255,0) 72%),
      radial-gradient(88px 74px at 77% 31%, rgba(127,218,196,.10), rgba(127,218,196,0) 72%),
      linear-gradient(180deg, rgba(253,251,255,.97), rgba(249,246,255,.97)) !important;
  }
  body.mp-public .mp-hero .mp-hero-grid-bg {
    opacity:.28;
    background-image:
      linear-gradient(rgba(141,119,212,.055) 1px, transparent 1px),
      linear-gradient(90deg, rgba(141,119,212,.055) 1px, transparent 1px);
    background-size:42px 42px;
    background-position:center center;
    mask-image:linear-gradient(to bottom, rgba(0,0,0,.88), rgba(0,0,0,.78) 52%, rgba(0,0,0,.32) 88%, transparent 100%);
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,.88), rgba(0,0,0,.78) 52%, rgba(0,0,0,.32) 88%, transparent 100%);
  }
  body.mp-public .mp-hero .mp-hero-copy {
    padding-top:8px;
  }
  body.mp-public .mp-hero .mp-hero-copy h1 {
    max-width:8.3ch !important;
    font-size:clamp(40px,11.3vw,50px)!important;
    line-height:1.03!important;
    letter-spacing:-.06em!important;
  }
  body.mp-public .mp-hero .mp-hero-copy .mp-lead {
    max-width:29ch!important;
    margin-top:16px!important;
  }
  body.mp-public .mp-hero .mp-hero-copy .mp-actions {
    margin-top:20px!important;
  }
  body.mp-public .mp-hero .mp-hero-copy .mp-hero-proof {
    margin-top:14px!important;
  }

  /* Reposition existing accents into a clean top-right cluster. */
  body.mp-public .mp-hero .ud-r12r5-mobile-accents {
    top:8px;
    right:4px;
    gap:10px;
    height:40px;
    z-index:1;
  }
  body.mp-public .mp-hero .ud-r12r5-accent {
    position:relative;
    width:38px;
    height:38px;
    border-radius:13px;
    border:1px solid rgba(138,110,220,.18);
    box-shadow:
      0 8px 18px rgba(78,56,150,.09),
      inset 0 1px 0 rgba(255,255,255,.96),
      0 0 0 1px rgba(255,255,255,.55);
    backdrop-filter:none;
    overflow:visible;
  }
  body.mp-public .mp-hero .ud-r12r5-accent svg {
    width:19px;
    height:19px;
    stroke-width:1.9;
  }
  body.mp-public .mp-hero .ud-r12r5-accent:first-child {
    transform:rotate(-9deg);
    background:linear-gradient(155deg, #fff 0%, #f3ebff 84%);
  }
  body.mp-public .mp-hero .ud-r12r5-accent:nth-child(2) {
    transform:rotate(8deg);
    background:linear-gradient(155deg, #fff 0%, #e8faf3 84%);
  }
  body.mp-public .mp-hero .ud-r12r5-accent::after {
    content:"";
    position:absolute;
    inset:auto auto -5px -5px;
    width:10px;
    height:10px;
    border-radius:999px;
    background:rgba(255,255,255,.72);
    box-shadow:0 0 0 1px rgba(135,109,214,.14);
  }
  /* Add premium abstract supporting shapes without extra markup. */
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::before,
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    content:"";
    position:absolute;
    pointer-events:none;
  }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::before {
    right:56px;
    top:36px;
    width:48px;
    height:18px;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(181,161,245,.24), rgba(181,161,245,.06));
    transform:rotate(-15deg);
  }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    right:-10px;
    top:42px;
    width:74px;
    height:74px;
    border-radius:22px;
    background:radial-gradient(circle at 36% 35%, rgba(255,255,255,.62), rgba(255,255,255,.12) 42%, rgba(186,165,246,.14) 74%, rgba(186,165,246,0) 100%);
    opacity:.9;
    filter:none;
    transform:rotate(12deg);
  }
  @keyframes ud-r12r6-drift-a {
    0%,100%{transform:translate3d(0,0,0) rotate(-9deg)}
    50%{transform:translate3d(0,-4px,0) rotate(-6deg)}
  }
  @keyframes ud-r12r6-drift-b {
    0%,100%{transform:translate3d(0,0,0) rotate(8deg)}
    50%{transform:translate3d(0,-5px,0) rotate(4deg)}
  }
  @keyframes ud-r12r6-glow {
    0%,100%{transform:translate3d(0,0,0) rotate(12deg); opacity:.86}
    50%{transform:translate3d(0,-4px,0) rotate(9deg); opacity:1}
  }
  :root:not(.mp-reduce-motion) body.mp-public .mp-hero .ud-r12r5-accent:first-child {
    animation:ud-r12r6-drift-a 7.2s ease-in-out infinite;
  }
  :root:not(.mp-reduce-motion) body.mp-public .mp-hero .ud-r12r5-accent:nth-child(2) {
    animation:ud-r12r6-drift-b 8s ease-in-out infinite;
  }
  :root:not(.mp-reduce-motion) body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    animation:ud-r12r6-glow 8.8s ease-in-out infinite;
  }

  /* Keep the lower hero clean. */
  body.mp-public .mp-hero .mp-hero-visual {
    margin-top:2px!important;
  }
  body.mp-public .mp-hero .mp-hero-visual > .mp-hero-floaters { display:none!important; }
}

@media (max-width:430px) {
  body.mp-public .mp-hero .mp-hero-copy h1 {
    max-width:8.05ch!important;
  }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents {
    top:6px;
    right:0;
    gap:8px;
  }
  body.mp-public .mp-hero .ud-r12r5-accent {
    width:35px;
    height:35px;
  }
  body.mp-public .mp-hero .ud-r12r5-accent svg {
    width:18px;
    height:18px;
  }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::before {
    right:48px;
    top:33px;
    width:42px;
  }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    right:-8px;
    top:38px;
    width:64px;
    height:64px;
  }
}

@media (max-width:360px) {
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::before { display:none; }
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    right:-6px;
    top:34px;
    width:56px;
    height:56px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mp-public .mp-hero .ud-r12r5-accent,
  body.mp-public .mp-hero .ud-r12r5-mobile-accents::after {
    animation:none!important;
  }
}