/* ------------------------------------------------------------------
   Website theme — modern DARK, clean & rounded (inspired by academy sites).
   Retints the DaisyUI "night" base theme: deep slate-navy surfaces, vivid
   indigo primary, violet secondary, cyan accent, light slate text. Loaded
   after DaisyUI so these variable overrides win.
   ------------------------------------------------------------------ */
[data-theme="night"] {
    color-scheme: dark;

    --p: 62% 0.19 277;        /* primary   — indigo  #6366F1 */
    --pc: 100% 0 0;           /* primary content — white     */
    --s: 66% 0.19 295;        /* secondary — violet  #8B5CF6 */
    --sc: 100% 0 0;
    --a: 80% 0.13 200;        /* accent    — cyan    #22D3EE */
    --ac: 22% 0.05 230;

    --n: 27% 0.04 264;        /* neutral   — slate-800       */
    --nc: 90% 0.015 256;

    --b1: 21% 0.035 265;      /* base-100  — slate-900 #0F172A */
    --b2: 26% 0.04 264;       /* base-200  — slate-800        */
    --b3: 33% 0.04 260;       /* base-300  — slate-700        */
    --bc: 90% 0.015 256;      /* base content — slate-200 ink */

    --rounded-box: 1.25rem;
    --rounded-btn: 0.85rem;
    --rounded-badge: 1.9rem;
    --animation-btn: 0.25s;
    --border-btn: 1px;
}

/* Typography ------------------------------------------------------- */
body {
    font-feature-settings: "cv02", "cv03", "cv04";
    letter-spacing: -0.01em;
}

h1, h2, h3, .card-title {
    font-family: '"Plus Jakarta Sans"', 'Poppins', sans-serif;
    letter-spacing: -0.02em;
}

h1 { font-weight: 800; }
h2, h3 { font-weight: 700; }

html { scroll-behavior: smooth; }

/* Buttons — confident, rounded, glowing on dark -------------------- */
.btn {
    font-weight: 600;
    text-transform: none;
}
.btn-primary {
    box-shadow: 0 10px 26px -10px oklch(var(--p) / 0.7);
}
.btn-primary:hover {
    box-shadow: 0 12px 30px -10px oklch(var(--p) / 0.85);
}

/* Cards — soft dark elevation + gentle hover lift ------------------ */
.card {
    box-shadow: 0 12px 34px -20px rgba(0, 0, 0, 0.7);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card.shadow-md:hover,
.card.shadow:hover,
.card.shadow-xl:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 44px -22px rgba(0, 0, 0, 0.8);
}

/* Header — translucent dark glass --------------------------------- */
header.sticky {
    backdrop-filter: saturate(160%) blur(12px);
}

/* Helpers ---------------------------------------------------------- */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.testimonials-swiper .swiper-slide {
    height: auto;
}

.swiper-pagination-bullet {
    background: oklch(var(--bc) / 0.4);
}
.swiper-pagination-bullet-active {
    background: oklch(var(--p));
}

/* Soft brand glow used by hero / CTA sections --------------------- */
.bg-brand-soft {
    background:
        radial-gradient(1100px 520px at 82% -10%, oklch(var(--s) / 0.22), transparent 60%),
        radial-gradient(900px 520px at 0% 0%, oklch(var(--p) / 0.22), transparent 55%),
        oklch(var(--b1));
}

/* Site-wide animated background — aurora glow + aligned grid.
   Fixed behind ALL content (z-index:-1), pure CSS, never intercepts taps,
   pauses under prefers-reduced-motion. Content sits above it naturally. */
.page-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background: oklch(var(--b1));
}
.page-bg > * {
    position: absolute;
}

/* Aligned grid across the viewport, fading out toward the edges. */
.page-bg__grid {
    inset: 0;
    background-image:
        linear-gradient(to right,  oklch(var(--bc) / 0.07) 1px, transparent 1px),
        linear-gradient(to bottom, oklch(var(--bc) / 0.07) 1px, transparent 1px);
    background-size: 54px 54px;
    -webkit-mask-image: radial-gradient(120% 120% at 70% 0%, #000 0%, transparent 80%);
            mask-image: radial-gradient(120% 120% at 70% 0%, #000 0%, transparent 80%);
}

/* Three soft glows drifting slowly from different corners. */
.page-bg__aurora {
    border-radius: 50%;
    filter: blur(54px);
    opacity: 0.85;
    will-change: transform;
}
.page-bg__aurora--1 {
    width: 46vw;
    height: 46vw;
    right: -8vw;
    top: -10vh;
    background: radial-gradient(circle at center, oklch(var(--p) / 0.95), transparent 68%);
    animation: page-drift-1 30s ease-in-out infinite alternate;
}
.page-bg__aurora--3 {
    width: 40vw;
    height: 40vw;
    left: 48vw;
    top: 32vh;
    background: radial-gradient(circle at center, oklch(var(--s) / 0.8), transparent 66%);
    animation: page-drift-3 44s ease-in-out infinite alternate;
}
@keyframes page-drift-1 {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(-6vw, 5vh, 0) scale(1.14); }
}
@keyframes page-drift-3 {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(5vw, -6vh, 0) scale(1.12); }
}

@media (prefers-reduced-motion: reduce) {
    .page-bg__aurora { animation: none; }
}