/* Shared motion for the portal and the directories (see static/js/motion.js). */
@media (prefers-reduced-motion: no-preference) {
  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
  .reveal.is-visible{opacity:1;transform:none}
  .region-card.reveal,.network-platform-card.reveal,.directory-card.reveal{transform:translateY(26px) scale(.98)}
  .region-card.reveal.is-visible,.network-platform-card.reveal.is-visible,.directory-card.reveal.is-visible{transform:none}

  /* Hero entrance: the title and the main image stay static (they are the
     Largest Contentful Paint), the elements around them glide in. */
  .network-hero-copy>.seo-eyebrow,.network-hero-copy>.network-intro,.network-hero-copy>.network-quick-search,
  .network-hero-copy>.network-actions,.network-hero-copy>.hero-mini-proof,.directory-hero-badges,.directory-search-wrap{animation:dn-rise .8s cubic-bezier(.2,.7,.2,1) both}
  .network-hero-copy>.network-intro{animation-delay:.08s}
  .network-hero-copy>.network-quick-search,.directory-search-wrap{animation-delay:.16s}
  .network-hero-copy>.network-actions{animation-delay:.24s}
  .network-hero-copy>.hero-mini-proof,.directory-hero-badges{animation-delay:.32s}
  .network-hero h1 span{display:inline-block;background:linear-gradient(90deg,currentColor 0 40%,#7ff3f6 50%,currentColor 60% 100%) 100% 0/250% 100%;-webkit-background-clip:text;background-clip:text;animation:dn-shine 2.4s ease .6s 1 both}
  .network-hero h1 span{-webkit-text-fill-color:transparent}

  /* Hover depth on cards and buttons */
  .network-platform-card,.seo-grid-3>article,.quality-card,.region-service-grid>article,.directory-card{transition:transform .25s ease,box-shadow .25s ease}
  .network-platform-card:hover,.seo-grid-3>article:hover,.quality-card:hover,.region-service-grid>article:hover,.directory-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(7,28,61,.14)}
  .network-primary,.platform-btn,.cta-btn,.network-nav-cta,.brand-story-link,.directory-add-cta,.form-submit button{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
  .network-primary:hover,.platform-btn:hover,.cta-btn:hover,.network-nav-cta:hover,.directory-add-cta:hover,.form-submit button:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 12px 26px rgba(0,143,165,.28)}
  .seo-card-icon,.region-service-icon,.quality-icon{transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
  .network-platform-card:hover .seo-card-icon,.region-service-grid>article:hover .region-service-icon,.quality-card:hover .quality-icon{transform:scale(1.12) rotate(-6deg)}

  /* The chat button invites a first click, three times, then stays quiet. */
  .dn-assistant-toggle{animation:dn-invite 2.2s ease 3s 3}
  .dn-assistant-panel:not([hidden]){animation:dn-pop .28s cubic-bezier(.2,.9,.3,1.2) both;transform-origin:bottom right}
  [dir=rtl] .dn-assistant-panel:not([hidden]){transform-origin:bottom left}
  .dn-msg{animation:dn-msg .3s ease both}
}
@keyframes dn-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes dn-shine{from{background-position:100% 0}to{background-position:0 0}}
@keyframes dn-invite{0%,100%{box-shadow:0 14px 34px rgba(3,27,66,.32),0 0 0 0 rgba(39,199,210,.55)}60%{box-shadow:0 14px 34px rgba(3,27,66,.32),0 0 0 14px rgba(39,199,210,0)}}
@keyframes dn-pop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@keyframes dn-msg{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
