/* The original J/bird is the first letter; AYLEX completes one wordmark. */
.jaylex-wordmark[data-brand-animate]{
  display:inline-flex;
  align-items:center;
  gap:0;
  flex-shrink:0;
  width:max-content;
  color:var(--ink);
  font-size:23px;
  font-weight:800;
  line-height:1;
  letter-spacing:-.045em;
  white-space:nowrap;
  isolation:isolate;
}
.jaylex-wordmark .brand-mark{
  display:block;
  flex:none;
  width:32px;
  height:32px;
  margin-right:-3px;
  overflow:visible;
}
.jaylex-wordmark .brand-word{
  display:inline-flex;
  align-items:baseline;
  line-height:1;
}
.jaylex-wordmark .brand-word .brand-letter{
  display:inline-block;
  color:inherit;
  opacity:1;
  transform:none;
}
.jaylex-wordmark .brand-word .brand-period{
  display:inline-block;
  color:var(--pink);
  transform-origin:50% 80%;
}
.jaylex-wordmark .letter-j{fill:currentColor;opacity:1}
.jaylex-wordmark .logo-container{filter:none}
.jaylex-wordmark .bird-group{
  transform-box:view-box;
  transform-origin:128px 128px;
  transform:translate(-2px,4px) scale(.88);
  opacity:1;
}
.jaylex-wordmark .wing-flap{
  transform-box:view-box;
  transform-origin:116px 76px;
  transform:rotate(0deg) scaleX(1);
}
/* Small settled marks in product illustrations share the same identity. */
.jaylex-wordmark[data-brand-static]{
  display:inline-flex;align-items:center;gap:0;flex-shrink:0;
  color:inherit;font-size:12px;font-weight:800;line-height:1;
  letter-spacing:-.045em;white-space:nowrap;
}
.jaylex-wordmark[data-brand-static] .brand-mark{width:22px;height:22px;margin-right:-2px}
.hero-phone .phone-app-head .jaylex-wordmark{font-size:10px}
.hero-phone .phone-app-head .brand-mark{width:17px;height:17px}
.paper-top .jaylex-wordmark{color:var(--ink)}
.paper-top .jaylex-wordmark .brand-mark{width:23px;height:23px}
.paper-format{font-size:8px;letter-spacing:.08em;border-left:1px solid var(--line);padding-left:8px}
.mock-sidebar .jaylex-wordmark--symbol{margin-bottom:18px}
.mock-sidebar .jaylex-wordmark--symbol .brand-mark{width:28px;height:28px;margin:0}
.jaylex-wordmark.is-brand-entering .bird-group{
  animation:jaylex-bird-arrive 980ms cubic-bezier(.16,1,.3,1) 60ms both;
}
.jaylex-wordmark.is-brand-entering .wing-flap{
  animation:jaylex-wing-land 1320ms ease-in-out 60ms both;
}
.jaylex-wordmark.is-brand-entering .logo-container{
  animation:jaylex-arrival-glow 1420ms ease-out both;
}
.jaylex-wordmark.is-brand-entering .brand-letter{
  animation:jaylex-letter-reveal 560ms cubic-bezier(.16,1,.3,1) both;
}
.jaylex-wordmark.is-brand-entering .brand-letter:nth-child(1){animation-delay:120ms}
.jaylex-wordmark.is-brand-entering .brand-letter:nth-child(2){animation-delay:165ms}
.jaylex-wordmark.is-brand-entering .brand-letter:nth-child(3){animation-delay:210ms}
.jaylex-wordmark.is-brand-entering .brand-letter:nth-child(4){animation-delay:255ms}
.jaylex-wordmark.is-brand-entering .brand-letter:nth-child(5){animation-delay:300ms}
.jaylex-wordmark.is-brand-entering .brand-period{
  animation:jaylex-period-arrive 620ms cubic-bezier(.16,1,.3,1) 380ms both;
}
.jaylex-wordmark.is-brand-fluttering .bird-group{
  animation:jaylex-bird-lift 700ms cubic-bezier(.2,.7,.25,1) both;
}
.jaylex-wordmark.is-brand-fluttering .wing-flap{
  animation:jaylex-wing-flutter 700ms ease-in-out both;
}
.jaylex-wordmark.is-brand-fluttering .logo-container{
  animation:jaylex-hover-glow 700ms ease-out both;
}
.jaylex-wordmark.is-brand-fluttering .brand-period{
  animation:jaylex-period-pulse 700ms ease-out both;
}
@keyframes jaylex-bird-arrive{
  0%{opacity:0;transform:translate(104px,-62px) rotate(15deg) scale(.56)}
  18%{opacity:1}
  64%{opacity:1;transform:translate(-6px,7px) rotate(-3deg) scale(.92)}
  82%{transform:translate(0px,2px) rotate(1deg) scale(.88)}
  100%{opacity:1;transform:translate(-2px,4px) rotate(0deg) scale(.88)}
}
@keyframes jaylex-wing-land{
  0%,100%{transform:rotate(0deg) scaleX(1)}
  18%{transform:rotate(-11deg) scaleX(.77)}
  34%{transform:rotate(7deg) scaleX(.97)}
  49%{transform:rotate(-8deg) scaleX(.81)}
  63%{transform:rotate(4deg) scaleX(.97)}
  77%{transform:rotate(-3deg) scaleX(.90)}
  89%{transform:rotate(1deg) scaleX(.99)}
}
@keyframes jaylex-arrival-glow{
  0%,100%{filter:drop-shadow(0 0 0 rgba(246,54,123,0))}
  42%{filter:drop-shadow(0 0 14px rgba(246,54,123,.4))}
  74%{filter:drop-shadow(0 0 5px rgba(246,54,123,.15))}
}
@keyframes jaylex-letter-reveal{
  from{opacity:.28;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes jaylex-period-arrive{
  0%{opacity:.2;transform:scale(.55)}
  70%{opacity:1;transform:scale(1.22)}
  100%{opacity:1;transform:scale(1)}
}
@keyframes jaylex-bird-lift{
  0%,100%{transform:translate(-2px,4px) rotate(0deg) scale(.88)}
  32%{transform:translate(-1px,-5px) rotate(-3deg) scale(.89)}
  62%{transform:translate(-3px,1px) rotate(1deg) scale(.88)}
}
@keyframes jaylex-wing-flutter{
  0%,100%{transform:rotate(0deg) scaleX(1)}
  20%{transform:rotate(-11deg) scaleX(.75)}
  39%{transform:rotate(7deg) scaleX(.98)}
  58%{transform:rotate(-6deg) scaleX(.84)}
  77%{transform:rotate(2deg) scaleX(.99)}
}
@keyframes jaylex-hover-glow{
  0%,100%{filter:drop-shadow(0 0 0 rgba(246,54,123,0))}
  36%{filter:drop-shadow(0 0 12px rgba(246,54,123,.45))}
}
@keyframes jaylex-period-pulse{
  0%,100%{transform:scale(1)}
  35%{transform:scale(1.22)}
}
@media(max-width:760px){
  .jaylex-wordmark[data-brand-animate]{font-size:21px}
  .jaylex-wordmark .brand-mark{width:29px;height:29px}
  .hero-phone .phone-app-head .jaylex-wordmark{font-size:8px}
  .hero-phone .phone-app-head .brand-mark{width:15px;height:15px}
  .mock-sidebar .jaylex-wordmark--symbol .brand-mark{width:23px;height:23px}
}
/* Cancelling motion always restores the same visible, settled geometry. */
html[data-motion=off] .jaylex-wordmark *,
html[data-motion=off] .jaylex-wordmark .brand-letter,
html[data-motion=off] .jaylex-wordmark .brand-period{
  animation:none!important;
  transition:none!important;
}
html[data-motion=off] .jaylex-wordmark .bird-group{opacity:1!important;transform:translate(-2px,4px) scale(.88)!important}
html[data-motion=off] .jaylex-wordmark .wing-flap{transform:rotate(0deg) scaleX(1)!important}
html[data-motion=off] .jaylex-wordmark .logo-container{filter:none!important}
html[data-motion=off] .jaylex-wordmark .brand-letter,
html[data-motion=off] .jaylex-wordmark .brand-period{opacity:1!important;transform:none!important}
@media(prefers-reduced-motion:reduce){
  .jaylex-wordmark *,
  .jaylex-wordmark .brand-letter,
  .jaylex-wordmark .brand-period{animation:none!important;transition:none!important}
  .jaylex-wordmark .bird-group{opacity:1!important;transform:translate(-2px,4px) scale(.88)!important}
  .jaylex-wordmark .wing-flap{transform:rotate(0deg) scaleX(1)!important}
  .jaylex-wordmark .logo-container{filter:none!important}
  .jaylex-wordmark .brand-letter,
  .jaylex-wordmark .brand-period{opacity:1!important;transform:none!important}
}
