/* Hero v8 Animation Styles */

/* Initial fade — do NOT use Bootstrap .opacity-0 (it uses !important and blocks the animation end state) */
.hero-v8-fade--1,
.hero-v8-fade--2,
.hero-v8-fade--3,
.hero-v8-fade--4,
.hero-v8-fade--5 {
    opacity: 0;
}

.hero-v8-fade--1.animate-fade-in-up { animation-delay: 0.2s; }
.hero-v8-fade--2.animate-fade-in-up { animation-delay: 0.4s; }
.hero-v8-fade--3.animate-fade-in-up { animation-delay: 0.6s; }
.hero-v8-fade--4.animate-fade-in-up { animation-delay: 0.8s; }
.hero-v8-fade--5.animate-fade-in-up { animation-delay: 1s; }

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fade-in-up 0.8s ease-out forwards;
}

@keyframes wave {
    0%, 100% {
        transform: translateY(0px);
    }
    25% {
        transform: translateY(-10px);
    }
    50% {
        transform: translateY(0px);
    }
    75% {
        transform: translateY(10px);
    }
}

.animate-wave {
    animation: wave 3s ease-in-out infinite;
}

.hero-v8-decor-top {
    position: absolute;
    top: -5rem;
    left: 0;
    right: 0;
    pointer-events: none;
    z-index: 1;
}

.hero-v8-dot--1 { animation-delay: 0s; top: 5rem; left: 4rem; }
.hero-v8-dot--2 { animation-delay: 1s; top: 8rem; right: 5rem; }
.hero-v8-dot--3 { animation-delay: 2s; bottom: 6rem; left: 5rem; }
.hero-v8-dot--4 { animation-delay: 3s; bottom: 8rem; right: 4rem; }
.hero-v8-dot--5 { animation-delay: 4s; top: 50%; left: 25%; }
.hero-v8-dot--6 { animation-delay: 5s; top: 33%; right: 33%; }

.hero-v8-blob--delayed { animation-delay: 2s; }

.hero-v8-glow--top { top: 5rem; left: 5rem; }
.hero-v8-glow--bottom { bottom: 5rem; right: 5rem; }

/* Description max width when Bootstrap omits max-w-2xl */
.hero-v8-desc-max {
    max-width: 42rem;
}

.hero-testimonial-overlay__wave-line {
    height: var(--wave-h);
    animation-delay: var(--wave-d);
}

/* -- Button hover states -- */
.hero-btn-primary {
    transition: filter 0.2s ease, transform 0.15s ease;
}
.hero-btn-primary:hover,
.hero-btn-primary:focus {
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.hero-btn-outline-secondary {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.hero-btn-outline-secondary:hover,
.hero-btn-outline-secondary:focus {
    background-color: var(--bs-secondary) !important;
    color: #fff !important;
    border-color: var(--bs-secondary) !important;
    transform: translateY(-1px);
}

.hero-btn-outline-primary-light {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.hero-btn-outline-primary-light:hover,
.hero-btn-outline-primary-light:focus {
    background-color: var(--bs-primary) !important;
    color: #fff !important;
    border-color: var(--bs-primary) !important;
    transform: translateY(-1px);
}
/* Block: advantages-split-border-bars */
.advantages-split-border-bars__bar--hover {
    transition: transform 0.2s ease;
}

.advantages-split-border-bars__bar--hover:hover {
    transform: scale(1.05);
}

.advantages-split-border-bars__decor-circle--top {
    animation: advantages-split-border-bars-decor-drift-kf 9s ease-in-out infinite;
}

.advantages-split-border-bars__decor-circle--bottom {
    animation: advantages-split-border-bars-decor-drift-kf 12s ease-in-out infinite reverse;
}

@keyframes advantages-split-border-bars-decor-drift-kf {
    0%,
    100% {
        transform: translateY(0px) scale(1);
    }

    50% {
        transform: translateY(-24px) scale(1.04);
    }
}

/* Hover — поза @sem */
.services__tile--lift {
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.services__tile--lift:hover {
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}

@media (min-width: 640px) {
  .services__tile--lift:hover {
    transform: scale(1.05);
  }
}

.services__cta--lift {
  transition: filter 0.2s ease, transform 0.2s ease;
}

@media (min-width: 640px) {
  .services__cta--lift:hover {
    transform: scale(1.05);
  }
}

.services__cta--lift:hover {
  filter: brightness(0.92);
}

/* v30 checkerboard — icon container size (w-12 h-12 has no BS util) */
.perks-checker__icon {
    width: 3rem;
    height: 3rem;
    flex-shrink: 0;
}

/* process split — shell split, deck grid, marker, step numbers, stagger, panel borders */
.process-split__shell {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: start;
}

@media (min-width: 992px) {
    .process-split__shell {
        grid-template-columns: 1fr 1fr;
        gap: 3.5rem;
    }
}

.process-split__deck {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
}

.process-split__marker {
    width: 0.625rem;
    height: 0.625rem;
}

.process-split__num {
    font-size: clamp(2.75rem, 5vw, 4.5rem);
    line-height: 0.9;
    letter-spacing: -0.03em;
}

.process-split__rule {
    width: 100%;
    height: 1px;
}

.process-split__col .process-split__blade:last-child {
    border-bottom-width: 0;
}

@media (min-width: 992px) {
    .process-split__deck--ruled {
        border-left: 1px solid var(--bs-border-color);
        border-top-width: 0;
        padding-top: 3.5rem;
    }

    .process-split__col--shift {
        margin-top: -3.5rem;
    }
}

@media (max-width: 991px) {
    .process-split__col--shift {
        margin-top: 0;
    }
}

.process-split__blade {
    transition: transform 200ms ease;
}

.process-split__blade:hover {
    transform: translateY(-2px);
}

/* Лише layout / рух; кольори теми — у Blade */
.socialproof-card-hover {
    transition:
        box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.socialproof__stat-value,
.socialproof__stat-label {
    transition: transform 0.3s ease, color 0.2s ease;
}

@media (hover: hover) {
    .socialproof-card-hover:hover {
        box-shadow: 0 22px 44px -18px rgba(15, 23, 42, 0.2);
    }

    .dark .socialproof-card-hover:hover {
        box-shadow: 0 22px 44px -14px rgba(0, 0, 0, 0.5);
    }

    .socialproof-card-hover:hover .socialproof__stat-value {
        transform: scale(1.08);
    }
}

@media (hover: hover) and (min-width: 640px) {
    .socialproof-card-hover--lift:hover {
        transform: translateY(-4px) scale(1.02);
    }
}

@media (prefers-reduced-motion: reduce) {
    .socialproof-card-hover,
    .socialproof__stat-value,
    .socialproof__stat-label {
        transition: none;
    }

    .socialproof-card-hover:hover,
    .socialproof-card-hover:hover .socialproof__stat-value,
    .socialproof-card-hover--lift:hover {
        transform: none;
    }
}

.socialproof__blob-1 {
    background: radial-gradient(circle, var(--color-primary-400, #818cf8) 0%, transparent 70%);
    filter: blur(60px);
    animation: socialproof__float 8s ease-in-out infinite;
}

.socialproof__blob-2 {
    background: radial-gradient(circle, var(--color-primary-600, #4f46e5) 0%, transparent 70%);
    filter: blur(80px);
    animation: socialproof__float 10s ease-in-out infinite reverse;
}

@keyframes socialproof__float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(20px, -20px) scale(1.05); }
}

.socialproof__glass {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.15);
}

.dark .socialproof__glass {
    background: rgba(0,0,0,0.2);
    border-color: rgba(255,255,255,0.08);
}

.socialproof__gradient-text {
    background: linear-gradient(135deg, var(--color-primary-500, #6366f1), var(--color-primary-300, #a5b4fc));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Другий стовпець: 2×2 картки (TW grid + BS col-lg-6) */
.socialproof__grid-side {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-content: start;
}

@media (min-width: 992px) {
    .socialproof__grid-side {
        gap: 1.25rem;
    }
}

.socialproof__item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.socialproof__item.visible {
    opacity: 1;
    transform: translateY(0);
}

.socialproof__feat {
    min-height: 15rem;
}

.socialproof__mini-card {
    min-height: 7rem;
}

@media (prefers-reduced-motion: reduce) {
    .socialproof__item {
        transition: none;
    }
}

/* FAQ v8 — flip card states (no Tailwind in script) */
.primer-clarify-query-chapter.primer-clarify-prompt-latent {
    transform: translateY(-100%);
    opacity: 0;
}

.primer-clarify-query-chapter.primer-clarify-prompt-shown {
    transform: translateY(0);
    opacity: 1;
}

.primer-clarify-reply-chapter.primer-clarify-resolve-latent {
    transform: translateY(100%);
    opacity: 0;
}

.primer-clarify-reply-chapter.primer-clarify-resolve-shown {
    transform: translateY(0);
    opacity: 1;
}

.primer-clarify-query-chapter,
.primer-clarify-reply-chapter {
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

/* Card min-height for flip layout */
.primer-clarify__card-wrap { min-height: 20rem; }

/* Corner blob size */
.primer-clarify__corner-blob { width: 5rem; height: 5rem; }

/* Animation delays */
.primer-clarify__flare--delay-1 { animation-delay: 0.2s; }
.primer-clarify__flare--delay-2 { animation-delay: 0.4s; }
.primer-clarify__flare--delay-3 { animation-delay: 0.8s; }
.primer-clarify__flare--delay-4 { animation-delay: 1s; }
.primer-clarify__flare--delay-5 { animation-delay: 1.2s; }
.primer-clarify__flare--delay-6 { animation-delay: 1.5s; }
.primer-clarify__flare--delay-7 { animation-delay: 2s; }

/* Cluster positions */
.primer-clarify__cluster-a { top: 3rem; left: 2rem; transform: rotate(45deg); }
.primer-clarify__cluster-b { top: 33%; right: 3rem; transform: rotate(-12deg); }
.primer-clarify__cluster-c { bottom: 4rem; left: 25%; transform: rotate(12deg); }

/* Standalone dot positions */
.primer-clarify__dot-a { top: 5rem; right: 5rem; width: 0.5rem; height: 0.5rem; }
.primer-clarify__dot-b { bottom: 6rem; right: 33%; width: 0.75rem; height: 0.75rem; }

/* Inner cluster child positions */
.primer-clarify__inner-a { top: 1rem; left: 1rem; width: 0.75rem; height: 0.75rem; }
.primer-clarify__inner-b { top: 2rem; left: 2rem; width: 0.5rem; height: 0.5rem; }
.primer-clarify__inner-c { top: 1.5rem; left: 1.5rem; width: 0.5rem; height: 0.5rem; }
.primer-clarify__inner-d { top: 3rem; left: 3rem; width: 1rem; height: 1rem; }
.primer-clarify__inner-e { top: 0.75rem; left: 0.75rem; width: 0.75rem; height: 0.75rem; }

/* Decorative lines */
.primer-clarify__line-a { top: 0.25rem; left: 0.25rem; width: 3rem; height: 0.125rem; }
.primer-clarify__line-b { top: 1.25rem; left: 1.25rem; width: 2rem; height: 0.125rem; }
.primer-clarify__line-c { top: 0.75rem; left: 0.75rem; width: 4rem; height: 0.125rem; }
.primer-clarify__line-d { top: 0.25rem; left: 0.25rem; width: 2.5rem; height: 0.125rem; }

@keyframes primer-clarify-flare-ping-cycle {
    75%, 100% { transform: scale(2); opacity: 0; }
}
.primer-clarify__flare--ping {
    animation: primer-clarify-flare-ping-cycle 1s cubic-bezier(0,0,.2,1) infinite;
}

@keyframes primer-clarify-flare-throb-cycle {
    0%, 100% { opacity: 1; }
    50%       { opacity: .5; }
}
.primer-clarify__flare--throb {
    animation: primer-clarify-flare-throb-cycle 2s cubic-bezier(.4,0,.6,1) infinite;
}

@keyframes primer-clarify-flare-rebound-cycle {
    0%, 100% { transform: translateY(0); animation-timing-function: cubic-bezier(.8,0,1,1); }
    50%       { transform: translateY(-25%); animation-timing-function: cubic-bezier(0,0,.2,1); }
}
.primer-clarify__flare--rebound {
    animation: primer-clarify-flare-rebound-cycle 1s infinite;
}

.primer-clarify__flare--lift:hover { transform: scale(1.5); transition: transform .2s ease; }

.primer-clarify__control--lift:hover { transform: scale(1.05); transition: transform .2s ease; }


.spark-boost__section {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.spark-boost__inner {
    min-height: 500px;
    display: flex;
    align-items: center;
}

@media (min-width: 768px) {
    .spark-boost__inner { min-height: 600px; }
}

/* Bootstrap: как у Tailwind p-sm → md:p-lg → lg:p-xl → xl:p-4xl (без фиксированных 6rem на мобиле) */
.spark-boost__vessel-bs {
    box-sizing: border-box;
    padding: 0.5rem;
}

@media (min-width: 768px) {
    .spark-boost__vessel-bs { padding: 1.5rem; }
}

@media (min-width: 992px) {
    .spark-boost__vessel-bs { padding: 2rem; }
}

@media (min-width: 1280px) {
    .spark-boost__vessel-bs { padding: 6rem; }
}

/* Bootstrap: две колонки + стабильный gap (row/g-* часто «съедаются» сбросами) */
.spark-boost__split-grid-bs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    width: 100%;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .spark-boost__split-grid-bs { gap: 1.5rem; }
}

.spark-boost__split-grid-bs > * {
    flex: 1 1 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

@media (min-width: 992px) {
    .spark-boost__split-grid-bs {
        flex-wrap: nowrap;
    }

    .spark-boost__split-grid-bs > * {
        flex: 1 1 0;
        max-width: 50%;
    }
}

.spark-boost__slab--glass { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }

@keyframes spark-boost-highlight-throb-seq {
    0%, 100% { opacity: 1; }
    50%       { opacity: .5; }
}
.spark-boost__highlight--throb {
    animation: spark-boost-highlight-throb-seq 2s cubic-bezier(.4,0,.6,1) infinite;
}

.spark-boost__prompt--glow:hover { transform: scale(1.05); transition: transform .2s ease; }

.spark-boost__control--glow:hover { transform: scale(1.05); transition: transform .2s ease; }

.spark-boost__surface--glow:hover { transform: scale(1.05); transition: transform .2s ease; }


