/* =========================================================================
   IRON — scroll motion (pairs with js/iron-motion.js).
   Hidden states ONLY under html.iron-motion, so a failed script can never
   leave content invisible. Easing: one expressive curve, short durations.
   ========================================================================= */
:root {
    --iron-ease: cubic-bezier(.16, 1, .3, 1);
}

/* ---- fade / rise --------------------------------------------------------- */
.iron-motion [data-reveal="fade"],
.iron-motion [data-reveal="rise"] {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    transition: opacity .7s var(--iron-ease), transform .8s var(--iron-ease);
    transition-delay: calc(var(--stagger, 0) * 90ms + var(--delay, 0ms));
}
.iron-motion [data-reveal="rise"] { transform: translate3d(0, 42px, 0) scale(.985); }
.iron-motion [data-reveal].is-in { opacity: 1; transform: none; }

/* ---- line-by-line headline unmask ---------------------------------------- */
[data-reveal="lines"] > * { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
[data-reveal="lines"] > * > * { display: inline-block; }
.iron-motion [data-reveal="lines"] > * > * {
    transform: translate3d(0, 105%, 0);
    transition: transform .95s var(--iron-ease);
    transition-delay: calc(var(--line, 0) * 110ms + 80ms);
}
.iron-motion [data-reveal="lines"].is-in > * > * { transform: none; }
.iron-motion [data-reveal="lines"] { opacity: 1; transform: none; }

/* ---- word-by-word, scroll-linked ----------------------------------------- */
.iron-word { transition: opacity .35s ease, color .35s ease; }
.iron-motion [data-reveal="words"] .iron-word { opacity: .22; }
.iron-motion [data-reveal="words"] .iron-word.is-lit { opacity: 1; }
.iron-motion [data-reveal="words"] { opacity: 1 !important; transform: none; }

/* ---- reading progress ------------------------------------------------------ */
.iron-progress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 2147483000;
    background: #f3df04;
    transform: scaleX(0);
    transform-origin: 0 50%;
    pointer-events: none;
    will-change: transform;
}
/* Sit below the admin bar when an admin is browsing the site. */
body.show-admin-bar .iron-progress { top: 40px; }

/* ---- services showcase meter ---------------------------------------------- */
.iron-showcase-meter {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: 14px;
    color: #050900;
}
.iron-showcase-meter .iron-showcase-total { color: #9aa1a8; }
.iron-showcase-track {
    position: relative;
    flex: 0 1 160px;
    height: 2px;
    background: rgba(5, 9, 0, .12);
    overflow: hidden;
}
.iron-showcase-track span {
    position: absolute;
    inset: 0;
    background: #050900;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .45s var(--iron-ease);
}
/* Only meaningful while the section is the sticky scroll-through. */
@media (max-width: 991px) {
    .iron-showcase-meter { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .iron-motion [data-reveal],
    .iron-motion [data-reveal="lines"] > * > * { opacity: 1 !important; transform: none !important; transition: none !important; }
    .iron-motion [data-reveal="words"] .iron-word { opacity: 1; }
}
