/* PROTOTYPE (not approved): time-based section reveal for the Website Design page (see reveal.js).
   Transitions run only while a section is revealing (data-lw-reveal="in"), so marking hides instantly.
   Opacity and a 12px rise, eased out over about half a second; the individual `translate` property leaves every
   element's own `transform` (hover lifts, outlines, glows) untouched. The hidden state exists only while reveal.js
   has marked a section (data-lw-reveal=""), so without JavaScript, with reduced motion or in print the page is
   fully static. Side-by-side items follow one another at 120 ms intervals. */
@media (prefers-reduced-motion: no-preference) {
  .lw-reveal-ready [data-lw-reveal="in"],
  .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > * {
    transition: opacity .5s cubic-bezier(.22, .61, .36, 1), translate .6s cubic-bezier(.22, .61, .36, 1);
  }
  .lw-reveal-ready [data-lw-reveal=""],
  .lw-reveal-ready [data-lw-seq][data-lw-reveal=""] > * { opacity: 0; translate: 0 12px; }
  /* Package cards side by side: Starter, then Business 120 ms later, then Professional another 120 ms later. */
  .lw-reveal-ready [data-lw-reveal="in"][data-lw-step="1"] { transition-delay: .12s; }
  .lw-reveal-ready [data-lw-reveal="in"][data-lw-step="2"] { transition-delay: .24s; }
  .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(1) { transition-delay: .12s; }
  .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(2) { transition-delay: .24s; }
  .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(3) { transition-delay: .36s; }
  .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(4) { transition-delay: .48s; }
  /* Desktop (1024px and wider): larger panels read as abrupt at phone timing, so the same 12px rise and fade play
     over about a second with a gentle start and a long settle, and sequence items are 160 ms apart. */
  @media (min-width: 1024px) {
    .lw-reveal-ready [data-lw-reveal="in"],
    .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > * {
      transition: opacity .9s cubic-bezier(.25, .1, .25, 1), translate 1.1s cubic-bezier(.2, .65, .25, 1);
    }
    .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(1) { transition-delay: 0.14s; }
    .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(2) { transition-delay: 0.30s; }
    .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(3) { transition-delay: 0.46s; }
    .lw-reveal-ready [data-lw-seq][data-lw-reveal="in"] > :nth-child(4) { transition-delay: 0.62s; }
  }
  /* Keyboard and assistive focus: always fully visible, never mid-transition. */
  .lw-reveal-ready [data-lw-reveal]:focus-within,
  .lw-reveal-ready [data-lw-seq]:focus-within > * { opacity: 1; translate: none; transition: none; }
}
@media print {
  .lw-reveal-ready [data-lw-reveal], .lw-reveal-ready [data-lw-seq] > * { opacity: 1 !important; translate: none !important; }
}