/* Freightrix page-only water-drop ripples and pillar expand. */
.fx-panel{
  position:relative;
  overflow:hidden;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.fx-panel:focus{
  outline:none;
}
.fx-panel:focus-visible{
  outline:2px solid var(--goldb,#e9bb3e);
  outline-offset:2px;
}
.fx-ripple{
  position:absolute;
  left:var(--fx-x,50%);
  top:var(--fx-y,50%);
  width:0;
  height:0;
  pointer-events:none;
  z-index:4;
}
.fx-ring{
  position:absolute;
  left:0;
  top:0;
  width:14px;
  height:14px;
  margin:-7px 0 0 -7px;
  border-radius:50%;
  pointer-events:none;
  box-sizing:border-box;
  transform:scale(.35);
  opacity:.9;
}
.fx-ring-navy{
  border:2px solid rgba(11,33,52,.72);
  box-shadow:0 0 0 1px rgba(233,187,62,.28);
  animation:fx-drop .72s ease-out forwards;
}
.fx-ring-gold{
  border:2px solid rgba(233,187,62,.95);
  animation:fx-drop .78s .08s ease-out forwards;
}
.fx-ring-navy2{
  border:2px solid rgba(11,33,52,.42);
  box-shadow:0 0 14px rgba(201,161,64,.35);
  animation:fx-drop .84s .14s ease-out forwards;
}

@keyframes fx-drop{
  0%{transform:scale(.3);opacity:.9}
  55%{opacity:.4}
  100%{transform:scale(16);opacity:0}
}

@keyframes fx-pulse{
  0%{transform:scale(1)}
  38%{transform:scale(1.025)}
  100%{transform:scale(1)}
}

html.fx-ready .fx-panel.is-pulsing{
  animation:fx-pulse .55s ease;
}

/* JS + motion allowed: pillars start on number + title; lists expand open. */
@media (prefers-reduced-motion:no-preference){
  html.fx-ready .prose .pillars > .fx-pillar > ul{
    max-height:0;
    opacity:0;
    overflow:hidden;
    margin:0;
    visibility:hidden;
    transition:max-height .48s ease,opacity .36s ease,margin .36s ease;
  }
  html.fx-ready .prose .pillars > .fx-pillar.is-open > ul{
    max-height:28rem;
    opacity:1;
    visibility:visible;
    overflow:hidden;
    margin:10px 0 0;
  }
}

@media (prefers-reduced-motion:reduce){
  .fx-ring,
  .fx-ring-navy,
  .fx-ring-gold,
  .fx-ring-navy2,
  html.fx-ready .fx-panel.is-pulsing{
    animation:none;
  }
  html.fx-ready .prose .pillars > .fx-pillar > ul{
    max-height:none;
    opacity:1;
    visibility:visible;
    overflow:visible;
  }
}
