/* CPDREG homepage hero title — robust standard-color emphasized words */
.registry-hero-copy .hero-gradient-title{
  display:inline-block;
  color:#111;
  background:linear-gradient(102deg,#0f0f0f 0%,#111 60%,#17130f 80%,#a95624 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-wrap:balance;
}

/* Provider / activity deliberately use a normal solid font color.
   This avoids WebKit / Safari text-paint failures caused by nested
   background-clip:text and transparent text-fill. */
.registry-hero-copy .hero-drawn-word{
  position:relative;
  display:inline-block;
  white-space:nowrap;
  padding-bottom:.105em;
  isolation:isolate;
  color:#111 !important;
  -webkit-text-fill-color:#111 !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  visibility:visible !important;
  opacity:1 !important;
}

.registry-hero-copy .hero-drawn-word::after{
  content:"";
  position:absolute;
  z-index:3;
  left:-.035em;
  right:-.035em;
  bottom:-.035em;
  height:.19em;
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 24' preserveAspectRatio='none'%3E%3Cpath d='M3 15 C43 7 83 17 124 12 C166 7 207 16 250 11 C276 8 297 10 317 12' fill='none' stroke='%23c86f2d' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  transform:scaleX(0);
  transform-origin:left center;
  opacity:0;
  animation:cpdContinuousUnderline .92s cubic-bezier(.52,.05,.24,1) .28s forwards;
  pointer-events:none;
}

.registry-hero-copy .hero-drawn-word-delay::after{animation-delay:.93s}

@keyframes cpdContinuousUnderline{
  0%{transform:scaleX(0);opacity:.2}
  18%{opacity:1}
  100%{transform:scaleX(1);opacity:1}
}

@media(max-width:820px){
  /* On mobile use normal text painting for the whole title as the most
     compatible fallback. Provider / activity remain solid #111 on every browser. */
  .registry-hero-copy .hero-gradient-title{
    display:block;
    background:none !important;
    color:#111 !important;
    -webkit-text-fill-color:#111 !important;
    -webkit-background-clip:border-box !important;
    background-clip:border-box !important;
  }
  .registry-hero-copy .hero-drawn-word{
    color:#111 !important;
    -webkit-text-fill-color:#111 !important;
    background:none !important;
    padding-bottom:.12em;
  }
  .registry-hero-copy .hero-drawn-word::after{
    height:.205em;
    bottom:-.04em;
    display:block !important;
    visibility:visible !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .registry-hero-copy .hero-drawn-word::after{
    animation:none;
    transform:scaleX(1);
    opacity:1;
  }
}
