/* === Afghan Host — modern motion + visual effects === */

:root {
    --ahfx-grad-1: linear-gradient(135deg, #0099d8 0%, #00d9ff 50%, #ff7a00 100%);
    --ahfx-grad-2: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);
    --ahfx-grad-glow: radial-gradient(circle at 50% 50%, rgba(0, 153, 216, .25), transparent 60%);
    --ahfx-glass: rgba(255, 255, 255, 0.08);
    --ahfx-glass-border: rgba(255, 255, 255, 0.15);
    --ahfx-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    --ahfx-card-shadow-hover: 0 24px 64px rgba(0, 153, 216, 0.22);
    --ahfx-text-grad: linear-gradient(135deg, #0099d8 0%, #ff7a00 100%);
    --ahfx-bg-soft: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

/* Gradient text */
.ahfx-grad-text, .ahfx-grad-heading,
.hero h1 .gradient, .hero-title .gradient,
[data-ahfx="gradient-text"] {
    background: var(--ahfx-text-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    background-size: 200% 200%;
    animation: ahfx-grad-shift 6s ease-in-out infinite;
}

@keyframes ahfx-grad-shift {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* Animated underline */
.ahfx-underline { position: relative; }
.ahfx-underline::after,
.menu a:not(.btn)::after,
.primary-nav a:not(.btn)::after,
.site-nav a:not(.btn)::after {
    content: "";
    position: absolute;
    left: 0; bottom: -4px;
    width: 100%; height: 2px;
    background: var(--ahfx-text-grad);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1);
}
.ahfx-underline:hover::after,
.menu a:hover::after,
.primary-nav a:hover::after,
.site-nav a:hover::after,
.menu .current-menu-item > a::after {
    transform: scaleX(1);
}

/* Scroll-triggered fade up */
[data-ahfx-fade] {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-delay: var(--ahfx-delay, 0s);
}
[data-ahfx-fade].in-view {
    opacity: 1;
    transform: translateY(0);
}

[data-ahfx-fade-left] {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
[data-ahfx-fade-left].in-view {
    opacity: 1;
    transform: translateX(0);
}

[data-ahfx-fade-right] {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
[data-ahfx-fade-right].in-view {
    opacity: 1;
    transform: translateX(0);
}

/* Stagger children */
[data-ahfx-stagger] > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.65, 0, 0.35, 1);
}
[data-ahfx-stagger].in-view > *:nth-child(1) { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }
[data-ahfx-stagger].in-view > *:nth-child(2) { transition-delay: 0.2s; opacity: 1; transform: translateY(0); }
[data-ahfx-stagger].in-view > *:nth-child(3) { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }
[data-ahfx-stagger].in-view > *:nth-child(4) { transition-delay: 0.4s; opacity: 1; transform: translateY(0); }
[data-ahfx-stagger].in-view > *:nth-child(5) { transition-delay: 0.5s; opacity: 1; transform: translateY(0); }
[data-ahfx-stagger].in-view > *:nth-child(n+6) { transition-delay: 0.6s; opacity: 1; transform: translateY(0); }

/* Glassmorphism cards */
.ahfx-glass-card,
.feature-card, .pricing-card, .stat-card, .service-card {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 24px;
    box-shadow: var(--ahfx-card-shadow);
    transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1), box-shadow 0.4s ease, border-color 0.4s;
    position: relative;
    overflow: hidden;
}

.ahfx-glass-card::before,
.feature-card::before, .pricing-card::before, .stat-card::before, .service-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,153,216,0.04) 0%, transparent 50%, rgba(255,122,0,0.04) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.ahfx-glass-card:hover,
.feature-card:hover, .pricing-card:hover, .stat-card:hover, .service-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--ahfx-card-shadow-hover);
    border-color: rgba(0, 153, 216, 0.3);
}
.ahfx-glass-card:hover::before,
.feature-card:hover::before, .pricing-card:hover::before, .stat-card:hover::before, .service-card:hover::before {
    opacity: 1;
}

/* Magnetic CTA buttons (sweep shine effect) */
.btn-magnetic, .ahfx-btn, .btn-primary, .ah-btn-primary {
    position: relative;
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1), box-shadow 0.3s ease;
    isolation: isolate;
}
.btn-magnetic::before, .ahfx-btn::before, .btn-primary::before, .ah-btn-primary::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.18) 0%, transparent 100%);
    transform: translateX(-100%) skewX(-15deg);
    transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);
    z-index: -1;
}
.btn-magnetic:hover::before, .ahfx-btn:hover::before, .btn-primary:hover::before, .ah-btn-primary:hover::before {
    transform: translateX(100%) skewX(-15deg);
}
.btn-magnetic:hover, .ahfx-btn:hover, .btn-primary:hover, .ah-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 153, 216, 0.35);
}

/* Animated icon containers */
.ahfx-icon, .feature-icon, .service-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px; height: 64px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(0,153,216,0.1) 0%, rgba(255,122,0,0.1) 100%);
    color: #0099d8;
    transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1), background 0.4s, color 0.4s;
}
.ahfx-glass-card:hover .ahfx-icon,
.feature-card:hover .feature-icon,
.feature-card:hover .service-icon,
.service-card:hover .service-icon {
    transform: scale(1.1) rotate(-5deg);
    background: var(--ahfx-text-grad);
    color: #fff;
}

/* Floating blob backgrounds */
.ahfx-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.4;
    pointer-events: none;
    animation: ahfx-blob 20s ease-in-out infinite;
    z-index: 0;
}
.ahfx-blob-1 {
    width: 500px; height: 500px;
    background: radial-gradient(circle at 30% 30%, #0099d8, transparent 70%);
    top: -200px; left: -200px;
}
.ahfx-blob-2 {
    width: 600px; height: 600px;
    background: radial-gradient(circle at 70% 70%, #ff7a00, transparent 70%);
    bottom: -250px; right: -250px;
    animation-delay: -10s;
}
@keyframes ahfx-blob {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(50px, -50px) scale(1.1); }
    66%      { transform: translate(-30px, 30px) scale(0.95); }
}

/* Number counter */
.ahfx-counter { display: inline-block; font-variant-numeric: tabular-nums; }

/* Marquee */
.ahfx-marquee {
    display: flex;
    gap: 3rem;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.ahfx-marquee-track {
    display: flex;
    gap: 3rem;
    animation: ahfx-marquee 30s linear infinite;
    flex-shrink: 0;
}
@keyframes ahfx-marquee {
    to { transform: translateX(-50%); }
}

/* Cursor glow (desktop only) */
@media (pointer: fine) {
    .ahfx-cursor-glow {
        position: fixed;
        width: 300px; height: 300px;
        border-radius: 50%;
        background: var(--ahfx-grad-glow);
        pointer-events: none;
        mix-blend-mode: screen;
        z-index: 9999;
        opacity: 0;
        transition: opacity 0.3s ease;
        transform: translate(-50%, -50%);
    }
    body.ahfx-cursor-ready .ahfx-cursor-glow { opacity: 1; }
}

/* Hero ambient gradient */
.hero, .ah-hero,
section.hero, [class*="hero-section"] {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Smooth scroll & selection */
html { scroll-behavior: smooth; }
::selection { background: rgba(0, 153, 216, 0.25); color: #02527a; }

/* Tilt effect (set via JS data-ahfx-tilt) */
[data-ahfx-tilt] {
    transform-style: preserve-3d;
    transition: transform 0.15s ease-out;
    will-change: transform;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
    .ahfx-cursor-glow { display: none; }
    .ahfx-blob { animation: none; }
}