/* =========================================
   HONEYCOLD LANDING — Premium SaaS Stylesheet
   Dark. Focused. Amber. Flagship.
========================================= */

:root {
    --ease-apple: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.15);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
    --hc-amber: #F59E0B;
    --hc-honey: #FBBF24;
    --hc-amber-dark: #D97706;
    --hc-amber-deep: #92400E;
}

html { scroll-behavior: smooth; background: #000; }
::selection { background: rgba(245, 158, 11, 0.3); color: #fff; }

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(245, 158, 11, 0.15); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(245, 158, 11, 0.35); }

/* ── ATMOSPHERIC LAYERS ── */
.noise-overlay {
    position: fixed; inset: 0; z-index: 1; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    opacity: 0.02; mix-blend-mode: screen;
}

.bg-grid-hero {
    position: fixed; top: 0; left: 0; right: 0; height: 100vh;
    background-image:
        linear-gradient(to right, rgba(245,158,11,0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(245,158,11,0.03) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 70% 55% at 50% 0%, black 10%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse 70% 55% at 50% 0%, black 10%, transparent 70%);
    z-index: 0; pointer-events: none;
}

/* ── 6 AMBIENT ORBS — increased visibility ── */
.ambient-orb { position: fixed; border-radius: 50%; pointer-events: none; z-index: 0; }

.orb-1 {
    top: -18%; left: 25%; width: 55vw; height: 55vw;
    background: radial-gradient(ellipse, rgba(245,158,11,0.16) 0%, rgba(217,119,6,0.04) 40%, transparent 65%);
    filter: blur(80px);
    animation: orb-1 14s ease-in-out infinite alternate;
}
.orb-2 {
    bottom: -15%; right: 15%; width: 50vw; height: 50vw;
    background: radial-gradient(ellipse, rgba(245,158,11,0.10) 0%, rgba(251,191,36,0.03) 40%, transparent 65%);
    filter: blur(100px);
    animation: orb-2 18s ease-in-out infinite alternate;
}
.orb-3 {
    top: 35%; left: -8%; width: 40vw; height: 40vw;
    background: radial-gradient(ellipse, rgba(251,191,36,0.08) 0%, transparent 60%);
    filter: blur(90px);
    animation: orb-3 22s ease-in-out infinite alternate;
}
.orb-4 {
    top: 15%; right: -5%; width: 35vw; height: 35vw;
    background: radial-gradient(ellipse, rgba(245,158,11,0.07) 0%, transparent 60%);
    filter: blur(70px);
    animation: orb-4 16s ease-in-out infinite alternate;
}
.orb-5 {
    top: 60%; left: 40%; width: 30vw; height: 30vw;
    background: radial-gradient(ellipse, rgba(251,191,36,0.06) 0%, transparent 60%);
    filter: blur(80px);
    animation: orb-5 20s ease-in-out infinite alternate;
}
.orb-6 {
    bottom: 30%; left: 60%; width: 25vw; height: 25vw;
    background: radial-gradient(ellipse, rgba(245,158,11,0.08) 0%, transparent 60%);
    filter: blur(60px);
    animation: orb-6 24s ease-in-out infinite alternate;
}

@keyframes orb-1 { from { opacity:.7; transform: translate(0,0) scale(1); } to { opacity:1; transform: translate(4vw,3vh) scale(1.15); } }
@keyframes orb-2 { from { opacity:.5; transform: translate(0,0) scale(1); } to { opacity:.9; transform: translate(-5vw,-4vh) scale(1.18); } }
@keyframes orb-3 { from { opacity:.4; transform: translate(0,0) scale(1); } to { opacity:.8; transform: translate(6vw,-3vh) scale(1.12); } }
@keyframes orb-4 { from { opacity:.3; transform: translate(0,0) scale(1); } to { opacity:.7; transform: translate(-4vw,5vh) scale(1.1); } }
@keyframes orb-5 { from { opacity:.25; transform: translate(0,0) scale(1); } to { opacity:.6; transform: translate(3vw,-4vh) scale(1.2); } }
@keyframes orb-6 { from { opacity:.35; transform: translate(0,0) scale(1); } to { opacity:.7; transform: translate(-3vw,3vh) scale(1.14); } }

/* ── FLOATING PARTICLES — varied paths ── */
.particle {
    position: fixed; pointer-events: none; z-index: 0; border-radius: 50%;
    background: rgba(245,158,11,0.5);
    box-shadow: 0 0 10px rgba(245,158,11,0.4);
}
.particle-1 { width:3px; height:3px; top:25%; left:15%; animation: p-drift-1 16s ease-in-out infinite; }
.particle-2 { width:2px; height:2px; top:60%; left:75%; animation: p-drift-2 20s ease-in-out infinite; animation-delay:-5s; }
.particle-3 { width:4px; height:4px; top:45%; left:45%; animation: p-drift-3 24s ease-in-out infinite; animation-delay:-10s; box-shadow: 0 0 14px rgba(245,158,11,0.5); }
.particle-4 { width:2px; height:2px; top:80%; left:30%; animation: p-drift-1 18s ease-in-out infinite; animation-delay:-3s; }
.particle-5 { width:3px; height:3px; top:15%; left:85%; animation: p-drift-2 22s ease-in-out infinite; animation-delay:-8s; }
.particle-6 { width:2px; height:2px; top:70%; left:55%; animation: p-drift-3 17s ease-in-out infinite; animation-delay:-6s; }

@keyframes p-drift-1 {
    0%   { opacity:0; transform: translate(0,0) scale(.5); }
    10%  { opacity:.8; }
    50%  { opacity:.5; transform: translate(20px,-20vh) scale(1); }
    90%  { opacity:.3; }
    100% { opacity:0; transform: translate(-10px,-40vh) scale(1.2); }
}
@keyframes p-drift-2 {
    0%   { opacity:0; transform: translate(0,0) scale(.4); }
    15%  { opacity:.7; }
    50%  { opacity:.4; transform: translate(-25px,-18vh) scale(1.1); }
    85%  { opacity:.2; }
    100% { opacity:0; transform: translate(15px,-35vh) scale(1.3); }
}
@keyframes p-drift-3 {
    0%   { opacity:0; transform: translate(0,0) scale(.3); }
    12%  { opacity:.9; }
    40%  { transform: translate(30px,-12vh) scale(.9); }
    70%  { opacity:.5; transform: translate(-20px,-28vh) scale(1.1); }
    100% { opacity:0; transform: translate(5px,-42vh) scale(1.4); }
}

/* ── AURORA WAVE — horizontal light sweep ── */
.aurora-wave {
    position: fixed; top: 0; left: 0; right: 0; height: 60vh;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(245,158,11,0.03) 20%,
        rgba(251,191,36,0.05) 40%,
        rgba(245,158,11,0.02) 60%,
        transparent 80%
    );
    background-size: 200% 100%;
    animation: aurora-sweep 12s ease-in-out infinite alternate;
    pointer-events: none; z-index: 0;
    mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
}
@keyframes aurora-sweep {
    0%   { background-position: 0% 0%; opacity: .4; }
    100% { background-position: 100% 0%; opacity: .8; }
}

/* ── SPOTLIGHT CARDS (rotating conic border) ── */
@property --angle { syntax:'<angle>'; initial-value:0deg; inherits:false; }
@keyframes border-spin { from{--angle:0deg} to{--angle:360deg} }

.spotlight-card {
    position: relative;
    background: rgba(10,10,10,0.7);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-radius: 1.25rem; overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 4px 20px rgba(0,0,0,0.5);
    transition: transform .5s var(--ease-spring), box-shadow .5s var(--ease-apple);
}
.spotlight-card::before {
    content:""; position:absolute; inset:-2px; border-radius:inherit;
    background: conic-gradient(from var(--angle), rgba(255,255,255,0.03) 0deg, rgba(245,158,11,0) 60deg, rgba(245,158,11,0.4) 180deg, rgba(245,158,11,0) 300deg, rgba(255,255,255,0.03) 360deg);
    z-index:-1; animation: border-spin 6s linear infinite;
    opacity:0; transition: opacity .5s var(--ease-apple);
}
.spotlight-card::after { content:""; position:absolute; inset:1px; border-radius:inherit; background:#0A0A0A; z-index:-1; }
.spotlight-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: inset 0 1px 0 rgba(245,158,11,0.15), 0 20px 50px -10px rgba(0,0,0,0.8), 0 0 40px -5px rgba(245,158,11,0.15); }
.spotlight-card:hover::before { opacity:1; }
.spotlight-content { position:relative; z-index:2; }

/* ── CARD GLOW (hover amber top line + mouse follow) ── */
.card-glow { position:relative; transition: all .35s var(--ease-apple); }
.card-glow::before { content:''; position:absolute; top:0; left:10%; right:10%; height:1px; background: linear-gradient(90deg, transparent, rgba(245,158,11,0.5), transparent); opacity:0; transition: opacity .35s; }
.card-glow:hover::before { opacity:1; }
.card-glow:hover { border-color: rgba(245,158,11,0.15) !important; box-shadow: 0 8px 40px rgba(0,0,0,0.4), 0 0 25px rgba(245,158,11,0.06); }

/* ── SHIMMER TEXT — dramatic glow-pulse + gradient ── */
.shimmer-text {
    background: linear-gradient(
        110deg,
        rgba(255,255,255,0.85) 0%,
        var(--hc-honey) 20%,
        var(--hc-amber) 35%,
        rgba(255,255,255,0.9) 50%,
        var(--hc-amber) 65%,
        var(--hc-honey) 80%,
        rgba(255,255,255,0.85) 100%
    );
    background-size: 300% auto;
    -webkit-background-clip: text; background-clip: text; color: transparent;
    animation: shimmer-flow 8s ease-in-out infinite, text-glow-pulse 4s ease-in-out infinite;
}
@keyframes shimmer-flow {
    0%   { background-position: 300% center; }
    100% { background-position: -300% center; }
}
@keyframes text-glow-pulse {
    0%, 100% { filter: drop-shadow(0 0 20px rgba(245,158,11,0.15)); }
    50%      { filter: drop-shadow(0 0 40px rgba(245,158,11,0.4)) drop-shadow(0 0 80px rgba(245,158,11,0.15)); }
}

/* ── GRADIENT TITLE — with subtle breathing glow ── */
.title-gradient {
    background: linear-gradient(180deg, #ffffff 20%, rgba(251,191,36,0.8) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    animation: title-breathe 6s ease-in-out infinite;
}
@keyframes title-breathe {
    0%, 100% { filter: drop-shadow(0 0 0px transparent); }
    50%      { filter: drop-shadow(0 2px 20px rgba(245,158,11,0.12)); }
}

.title-warm {
    background: linear-gradient(135deg, #ffffff 0%, #FDE68A 50%, var(--hc-amber) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ── HERO WORD REVEAL — staggered clip animation ── */
.word-reveal {
    display: inline-block; overflow: hidden;
}
.word-reveal > span {
    display: inline-block;
    transform: translateY(110%);
    transition: transform .9s var(--ease-spring);
}
.word-reveal.active > span {
    transform: translateY(0);
}

/* ── FLOATING ANIMATIONS ── */
.float-breathe { animation: float-b 5s ease-in-out infinite; }
@keyframes float-b { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }

.hero-badge-float { animation: badge-f 5s ease-in-out infinite; z-index: 20; position: relative; }
@keyframes badge-f { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-8px) scale(1.04)} }

.logo-hex { animation: logo-r 8s ease-in-out infinite; filter: drop-shadow(0 0 14px rgba(245,158,11,0.4)); }
@keyframes logo-r { 0%,100%{transform:rotate(0) scale(1)} 25%{transform:rotate(3deg) scale(1.02)} 75%{transform:rotate(-3deg) scale(1.02)} }

@keyframes scroll-marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── CRM MOCKUP ── */
.mock-crm-ring {
    position:absolute; inset:0; border-radius:inherit;
    background: conic-gradient(from 45deg, transparent 20%, rgba(245,158,11,0.25) 50%, transparent 80%);
    animation: border-spin 8s linear infinite; z-index:-1;
}

/* Scan beam across mockup */
.mockup-scan {
    position: absolute; top: 0; left: -100%; width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent 0%, rgba(245,158,11,0.04) 30%, rgba(245,158,11,0.08) 50%, rgba(245,158,11,0.04) 70%, transparent 100%);
    animation: scan-sweep 6s ease-in-out infinite;
    pointer-events: none; z-index: 5;
}
@keyframes scan-sweep {
    0%   { left: -50%; opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}

/* Typing cursor blink */
.typing-cursor::after {
    content: '|';
    color: var(--hc-amber);
    animation: cursor-blink 1s step-end infinite;
    font-weight: 300;
}
@keyframes cursor-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

/* Live indicator pulse on mockup */
.live-dot {
    position: relative;
}
.live-dot::before {
    content: ''; position: absolute; inset: -3px; border-radius: 50%;
    background: rgba(245,158,11,0.4);
    animation: live-ping 2s ease-out infinite;
}
@keyframes live-ping {
    0% { transform: scale(1); opacity: .6; }
    100% { transform: scale(2.5); opacity: 0; }
}

/* ── MARQUEE — upgraded with gradient accent ── */
.marquee-wrap {
    position: relative;
    background: linear-gradient(180deg, rgba(245,158,11,0.02) 0%, transparent 100%);
    border-top: 1px solid rgba(245,158,11,0.08);
    border-bottom: 1px solid rgba(245,158,11,0.04);
}
.marquee-wrap::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(245,158,11,0.3) 30%, rgba(251,191,36,0.5) 50%, rgba(245,158,11,0.3) 70%, transparent 100%);
    background-size: 200% 100%;
    animation: marquee-glow 4s ease-in-out infinite alternate;
}
@keyframes marquee-glow {
    0%   { background-position: 0% 0%; opacity: .5; }
    100% { background-position: 100% 0%; opacity: 1; }
}

.marquee-track { display:flex; animation: scroll-marquee 35s linear infinite; width:max-content; }
.marquee-track:hover { animation-play-state: paused; }

/* ── REVEAL ANIMATIONS — more dramatic ── */
.reveal { opacity:0; transform: translateY(32px) scale(.96); transition: opacity .9s var(--ease-apple), transform .9s var(--ease-spring); }
.reveal.active { opacity:1; transform: translateY(0) scale(1); }
.reveal-scale { opacity:0; transform: scale(.88); filter: blur(6px); transition: all 1.2s var(--ease-apple); }
.reveal-scale.active { opacity:1; transform: scale(1); filter: blur(0); }

.stagger-children > *:nth-child(1){transition-delay:.05s} .stagger-children > *:nth-child(2){transition-delay:.15s}
.stagger-children > *:nth-child(3){transition-delay:.25s} .stagger-children > *:nth-child(4){transition-delay:.35s}
.stagger-children > *:nth-child(5){transition-delay:.45s} .stagger-children > *:nth-child(6){transition-delay:.55s}

/* ── SECTION DIVIDER — glowing line ── */
.section-glow-divider {
    width: 100%; height: 1px; border: none; margin: 0;
    background: linear-gradient(90deg, transparent, rgba(245,158,11,0.2) 30%, rgba(251,191,36,0.35) 50%, rgba(245,158,11,0.2) 70%, transparent);
    animation: divider-pulse 5s ease-in-out infinite;
}
@keyframes divider-pulse {
    0%, 100% { opacity: .4; }
    50%      { opacity: .9; }
}

/* ── BUTTONS ── */
.btn-honey {
    position:relative; overflow:hidden;
    background: linear-gradient(135deg, var(--hc-amber) 0%, var(--hc-amber-dark) 100%);
    box-shadow: 0 0 25px rgba(245,158,11,0.25), inset 0 1px 0 rgba(255,255,255,0.3);
    transition: all .25s var(--ease-apple);
}
.btn-honey:hover { box-shadow: 0 0 40px rgba(245,158,11,0.4), 0 8px 32px rgba(245,158,11,0.2), inset 0 1px 0 rgba(255,255,255,0.5); transform: translateY(-2px); filter: brightness(1.1); }
.btn-honey:active { transform: translateY(0); filter: brightness(.95); }
.btn-honey::after { content:''; position:absolute; inset:0; background: radial-gradient(circle at var(--rx,50%) var(--ry,50%), rgba(255,255,255,0.3) 0%, transparent 60%); opacity:0; transition: opacity .3s; }
.btn-honey:hover::after { opacity:1; }

.btn-ghost { position:relative; border:1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.02); transition: all .25s var(--ease-apple); }
.btn-ghost:hover { border-color: rgba(245,158,11,0.2); background: rgba(245,158,11,0.04); transform: translateY(-1px); box-shadow: 0 4px 20px rgba(0,0,0,0.3); }

/* ── FAQ ── */
details.faq-item { transition: background .3s ease; }
details.faq-item summary { list-style:none; outline:none; }
details.faq-item summary::-webkit-details-marker { display:none; }
details.faq-item[open] .faq-chevron { transform: rotate(180deg); }
.faq-chevron { transition: transform .35s var(--ease-spring); }
details.faq-item[open] > div { animation: faq-in .4s var(--ease-apple) forwards; }
details.faq-item[open] { background: rgba(245,158,11,0.03); border-color: rgba(245,158,11,0.12) !important; }
@keyframes faq-in { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

/* ── NAVBAR ── */
.nav-scrolled { background: rgba(0,0,0,0.92) !important; border-bottom-color: rgba(245,158,11,0.1) !important; box-shadow: 0 4px 30px rgba(0,0,0,0.6), 0 0 40px rgba(245,158,11,0.03); }

/* ── STATUS DOT ── */
.status-dot { animation: s-breathe 3s ease-in-out infinite; }
@keyframes s-breathe { 0%,100%{box-shadow:0 0 4px rgba(245,158,11,0.4)} 50%{box-shadow:0 0 14px rgba(245,158,11,0.9)} }

/* ── CAROUSEL ── */
.testimonial-track {
    display: flex; gap: 1.5rem;
    animation: testimonial-scroll 40s linear infinite;
    width: max-content;
}
.testimonial-track:hover { animation-play-state: paused; }
@keyframes testimonial-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── CURSOR GLOW ── */
#mouse-glow {
    position:fixed; width:600px; height:600px; border-radius:50%;
    background: radial-gradient(circle, rgba(245,158,11,0.08) 0%, rgba(251,191,36,0.03) 30%, transparent 65%);
    transform: translate(-50%,-50%); pointer-events:none; z-index:2;
    opacity:0; transition: opacity .6s;
}

/* ── LANGUAGE TOGGLE ── */
.lang-toggle {
    position: relative;
    display: flex; align-items: center; gap: 2px;
    padding: 2px; border-radius: 8px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
}
.lang-toggle button {
    padding: 4px 10px; border-radius: 6px; font-size: 10px; font-weight: 700;
    color: #64748B; background: transparent;
    transition: all .25s var(--ease-apple); cursor: pointer; border: none;
    text-transform: uppercase; letter-spacing: 0.05em;
}
.lang-toggle button.active {
    color: #000; background: var(--hc-amber);
    box-shadow: 0 0 12px rgba(245,158,11,0.3);
}
.lang-toggle button:not(.active):hover { color: #94A3B8; }

/* ── MOCKUP LIVE SIMULATION ── */
@keyframes score-flash {
    0% { opacity: 1; }
    50% { opacity: 0.4; }
    100% { opacity: 1; }
}
.score-tick { animation: score-flash 0.3s var(--ease-apple); }

@keyframes status-fade {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
.status-transition { animation: status-fade 0.6s var(--ease-apple); }

@keyframes live-notify {
    0% { box-shadow: 0 0 4px rgba(245,158,11,0.4); }
    30% { box-shadow: 0 0 20px rgba(245,158,11,1), 0 0 40px rgba(245,158,11,0.4); }
    100% { box-shadow: 0 0 4px rgba(245,158,11,0.4); }
}
.live-dot-notify { animation: live-notify 0.8s var(--ease-apple); }

/* ── EXPANDABLE CARD DETAILS ── */
.mock-card-details {
    max-height: 0; overflow: hidden; opacity: 0;
    transition: max-height 0.5s var(--ease-spring), opacity 0.4s var(--ease-apple), padding 0.4s;
    padding: 0 0;
    border-top: 1px solid transparent;
}
.mock-card-details.expanded {
    max-height: 200px; opacity: 1;
    padding: 0.75rem 0 0;
    border-top-color: rgba(245,158,11,0.1);
}
[data-mock-expandable] {
    cursor: pointer;
    transition: border-color 0.3s var(--ease-apple), box-shadow 0.3s var(--ease-apple);
}
[data-mock-expandable]:hover {
    border-color: rgba(245,158,11,0.25) !important;
    box-shadow: 0 4px 20px rgba(245,158,11,0.08);
}
[data-mock-expandable].card-expanded {
    border-color: rgba(245,158,11,0.3) !important;
    box-shadow: 0 8px 30px rgba(245,158,11,0.12);
}

/* ── DIRECTIONAL REVEALS ── */
.reveal-left { opacity:0; transform: translateX(-40px) scale(0.96); transition: opacity .9s var(--ease-apple), transform .9s var(--ease-spring); }
.reveal-left.active { opacity:1; transform: translateX(0) scale(1); }
.reveal-right { opacity:0; transform: translateX(40px) scale(0.96); transition: opacity .9s var(--ease-apple), transform .9s var(--ease-spring); }
.reveal-right.active { opacity:1; transform: translateX(0) scale(1); }

/* ── PROGRESSIVE REVEAL ── */
.reveal-progressive { opacity:0; transform: translateY(40px) scale(0.94); will-change: transform, opacity; }
.reveal-progressive.revealed { opacity:1; transform: translateY(0) scale(1); }

/* ── SECTION ENTRANCE GLOW ── */
@keyframes section-enter-glow {
    0% { opacity: 0.2; transform: scaleX(0.3); }
    50% { opacity: 1; transform: scaleX(1.1); }
    100% { opacity: 0.4; transform: scaleX(1); }
}
.section-glow-divider.active { animation: section-enter-glow 1.2s var(--ease-apple) forwards; }

/* ── DIGIT ROLL ── */
@keyframes digit-roll {
    0% { transform: translateY(-6px); opacity: 0.3; }
    100% { transform: translateY(0); opacity: 1; }
}
.counter-rolling { animation: digit-roll 0.15s var(--ease-apple); }

/* ── MOBILE ── */
@media (max-width:768px) {
    .orb-1{width:80vw;height:80vw;filter:blur(60px)} .orb-2{width:70vw;height:70vw;filter:blur(60px)}
    .orb-3,.orb-4,.orb-5,.orb-6{display:none} .particle-4,.particle-5,.particle-6{display:none}
    #mouse-glow{display:none} .marquee-track{animation-duration:22s}
    .spotlight-card:hover,.card-glow:hover{transform:none}
    .testimonial-track{animation-duration:25s}
    .aurora-wave{display:none}
    .mockup-scan{display:none}
    .reveal-left,.reveal-right { transform: translateY(32px) scale(0.96); }
    .reveal-left.active,.reveal-right.active { transform: translateY(0) scale(1); }
    .mock-card-details.expanded { max-height: 160px; }
}

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
    .reveal,.reveal-scale,.reveal-left,.reveal-right,.reveal-progressive{opacity:1;transform:none;filter:none}
    .shimmer-text{animation:none;background:none;color:var(--hc-amber);filter:none}
    .title-gradient{animation:none;filter:none}
    .word-reveal > span{transform:none}
    .ambient-orb,.particle,.aurora-wave{display:none}
    .score-tick,.status-transition,.live-dot-notify,.counter-rolling{animation:none}
    .mock-card-details{transition:none}
}