/* Extracted from astraveda.php so the browser can cache it. */
.astra-page { --av-ease: cubic-bezier(.22, 1, .36, 1); }

            /* Scroll progress bar */
            .av-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 2000; pointer-events: none; }
            .av-progress span { display: block; height: 100%; transform-origin: 0 50%; transform: scaleX(0);
                background: linear-gradient(90deg, #10b981, #f97316); }

            /* Scroll reveal (content is only hidden while JS is running) */
            .av-js .astra-page [data-reveal] {
                opacity: 0;
                transform: translate3d(0, 32px, 0);
                transition: opacity .9s var(--av-ease), transform .9s var(--av-ease);
                transition-delay: var(--d, 0ms);
            }
            .av-js .astra-page [data-reveal="left"]  { transform: translate3d(-44px, 0, 0); }
            .av-js .astra-page [data-reveal="right"] { transform: translate3d(44px, 0, 0); }
            .av-js .astra-page [data-reveal="zoom"]  { transform: scale(.94); }
            .av-js .astra-page [data-reveal="fade"]  { transform: none; }
            .av-js .astra-page [data-reveal].is-in   { opacity: 1; transform: none; }

            /* ---------- Hero ---------- */
            .astra-hero::before { animation: avDots 40s linear infinite; }
            @keyframes avDots { to { background-position: 280px 280px; } }
            .astra-hero::after { animation: avRing 9s ease-in-out infinite; }
            @keyframes avRing {
                0%, 100% { transform: scale(1); opacity: 1; }
                50%      { transform: scale(1.06); opacity: .65; }
            }
            .av-orbs span {
                position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none;
                animation: avDrift 20s ease-in-out infinite alternate;
            }
            .av-orbs span:nth-child(1) { width: 340px; height: 340px; background: rgba(249, 115, 22, .22); top: -80px; right: 18%; }
            .av-orbs span:nth-child(2) { width: 300px; height: 300px; background: rgba(16, 185, 129, .20); bottom: -120px; left: -60px; animation-duration: 24s; }
            .av-orbs span:nth-child(3) { width: 200px; height: 200px; background: rgba(241, 189, 138, .14); top: 40%; left: 40%; animation-duration: 28s; }
            @keyframes avDrift { to { transform: translate(50px, 36px) scale(1.15); } }

            .astra-kicker i { display: inline-block; animation: avTwinkle 2.6s ease-in-out infinite; }
            @keyframes avTwinkle { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(-14deg) scale(1.2); } }

            /* Title words rise one after another */
            .av-js .astra-hero h1[data-split-words] av-w { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .1em; }
            .av-js .astra-hero h1[data-split-words] av-wi {
                display: inline-block; transform: translateY(110%); opacity: 0;
                transition: transform 1s var(--av-ease), opacity 1s var(--av-ease); transition-delay: var(--d, 0ms);
            }
            .av-js .astra-hero h1[data-split-words].is-in av-wi { transform: none; opacity: 1; }

            /* "AstraVeda": moving warm shine */
            .astra-hero h1 span,
            .astra-hero h1 span av-wi {
                background: linear-gradient(100deg, #ffd7b0 0%, #fb923c 30%, #f97316 50%, #ffd7b0 75%, #fb923c 100%);
                background-size: 250% 100%;
                -webkit-background-clip: text; background-clip: text;
                -webkit-text-fill-color: transparent; color: transparent;
                animation: avShine 6s linear infinite;
            }
            @keyframes avShine { to { background-position: -250% 0; } }

            /* Hero visual card: gentle float + 3D tilt on mouse */
            .astra-visual-card { animation: avFloat 7s ease-in-out infinite; transform-style: preserve-3d; }
            @keyframes avFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
            .astra-visual-card[data-tilt] { transition: transform .5s var(--av-ease), box-shadow .5s var(--av-ease); }
            .astra-visual-card.is-tilting { transition: transform .12s linear; }
            .astra-visual-card::after {
                content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
                background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .12), transparent 60%);
                opacity: 0; transition: opacity .4s ease;
            }
            .astra-visual-card.is-tilting::after { opacity: 1; }
            .astra-visual-brand i { animation: avSpin 14s linear infinite; }
            @keyframes avSpin { to { transform: rotate(375deg); } }

            /* Magic square: cells pop in, centre glows */
            .av-js .astra-magic[data-pop] span { opacity: 0; scale: .5; }
            .av-js .astra-magic[data-pop].is-in span {
                animation: avCellPop .7s var(--av-ease) forwards;
                animation-delay: calc(600ms + var(--i, 0) * 80ms);
            }
            @keyframes avCellPop { 60% { opacity: 1; scale: 1.08; } 100% { opacity: 1; scale: 1; } }
            .astra-magic span.is-core::before {
                content: ""; position: absolute; inset: -4px; border-radius: 19px; pointer-events: none;
                border: 2px solid rgba(255, 215, 176, .7); animation: avCore 2.4s ease-out infinite;
            }
            .astra-magic span.is-core { position: relative; }
            @keyframes avCore { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.35); } }
            .astra-magic span:hover { box-shadow: 0 10px 22px rgba(0, 0, 0, .25); }

            /* ---------- Section headings ---------- */
            .astra-eyebrow::before { transition: width .9s var(--av-ease) .3s; }
            .av-js .astra-page [data-reveal] .astra-eyebrow::before { width: 0; }
            .av-js .astra-page [data-reveal].is-in .astra-eyebrow::before,
            .av-js .astra-page .av-done .astra-eyebrow::before { width: 26px; }

            /* ---------- Feature cards ---------- */
            .astra-feature { position: relative; overflow: hidden; }
            .astra-feature::before {
                content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
                background: linear-gradient(90deg, #047857, #f97316);
                transform: scaleX(0); transform-origin: left; transition: transform .6s var(--av-ease);
            }
            .astra-feature:hover::before { transform: scaleX(1); }
            .astra-feature::after {
                content: ""; position: absolute; width: 180px; height: 180px; right: -70px; bottom: -70px; border-radius: 50%;
                background: radial-gradient(circle, rgba(249, 115, 22, .10), transparent 70%);
                transform: scale(.4); opacity: 0; transition: transform .7s var(--av-ease), opacity .5s ease; pointer-events: none;
            }
            .astra-feature:hover::after { transform: scale(1.4); opacity: 1; }
            .astra-feature-icon { transition: background-color .25s ease, color .25s ease, transform .6s var(--av-ease), box-shadow .5s ease; }
            .astra-feature:hover .astra-feature-icon { transform: rotate(-10deg) scale(1.1); box-shadow: 0 10px 22px rgba(249, 115, 22, .3); }
            .astra-feature h3 { transition: color .3s ease; }
            .astra-feature:hover h3 { color: var(--astra-green); }
            .av-js .astra-feature[data-reveal] .astra-feature-icon { transform: scale(.5) rotate(-30deg); }
            .av-js .astra-feature[data-reveal].is-in .astra-feature-icon { transform: none; transition-delay: calc(var(--d, 0ms) + 250ms); }

            /* ---------- Checklist ---------- */
            .astra-checklist-card { transition: transform .5s var(--av-ease), box-shadow .5s var(--av-ease); }
            .astra-checklist-card:hover { transform: translateY(-4px); box-shadow: 0 28px 56px rgba(6, 45, 31, .12); }
            .av-js .astra-checklist li[data-reveal] i { transform: scale(0); transition: transform .6s var(--av-ease); }
            .av-js .astra-checklist li[data-reveal].is-in i { transform: scale(1); transition-delay: calc(var(--d, 0ms) + 200ms); }
            .astra-checklist li:hover i { background: #f97316; color: #fff; transition: background-color .3s, color .3s; }

            /* ---------- Buttons & links ---------- */
            .astra-btn { position: relative; overflow: hidden; isolation: isolate; }
            .astra-btn::after {
                content: ""; position: absolute; top: 0; bottom: 0; left: -75%; width: 50%; pointer-events: none;
                background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .4), transparent); transform: skewX(-20deg);
            }
            .astra-btn:hover::after { animation: avSweep .9s var(--av-ease); }
            @keyframes avSweep { to { left: 130%; } }
            .astra-btn i { transition: transform .35s var(--av-ease); }
            .astra-btn:hover i { transform: translate(3px, -3px); }
            .astra-btn-primary { animation: avBtnGlow 3.2s ease-in-out infinite; }
            @keyframes avBtnGlow { 0%, 100% { box-shadow: 0 12px 32px rgba(249, 115, 22, .30); } 50% { box-shadow: 0 14px 40px rgba(249, 115, 22, .55); } }
            .astra-inline-link i { transition: transform .35s var(--av-ease); }
            .astra-inline-link:hover i { transform: translate(3px, -3px); }

            /* ---------- CTA ---------- */
            .astra-cta-inner { background-size: 160% 160%, auto; animation: avCtaGlow 12s ease-in-out infinite alternate; }
            @keyframes avCtaGlow { from { background-position: 0% 0%, 0 0; } to { background-position: 100% 60%, 0 0; } }

            /* Phones: shorter moves, no tilt */
            @media (max-width: 767.98px) {
                .av-js .astra-page [data-reveal="left"], .av-js .astra-page [data-reveal="right"] { transform: translate3d(0, 26px, 0); }
                .av-orbs span { filter: blur(50px); }
            }

            /* People who prefer less motion */
            @media (prefers-reduced-motion: reduce) {
                .astra-page *, .astra-page *::before, .astra-page *::after,
                .astra-hero::before, .astra-hero::after { animation: none !important; transition: none !important; }
                .av-js .astra-page [data-reveal], .av-js .astra-hero h1 av-wi, .av-js .astra-magic[data-pop] span,
                .av-js .astra-page [data-reveal] .astra-feature-icon, .av-js .astra-checklist li i { opacity: 1 !important; transform: none !important; scale: 1 !important; }
                .av-js .astra-page [data-reveal] .astra-eyebrow::before { width: 26px; }
                .av-progress { display: none; }
            }