/* Enhanced Animations and Interactions */

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Loading animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

/* Animate elements on scroll */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

.animate-on-scroll.animated {
    opacity: 1;
    transform: translateY(0);
}

/* Enhanced button interactions */
.btn {
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s;
}

.btn:hover::before {
    left: 100%;
}

/* Enhanced card hover effects */
.calculator-card,
.feature-card,
.tip-card,
.status-card,
.result-card,
.roi-card {
    position: relative;
    overflow: hidden;
}

.calculator-card::after,
.feature-card::after,
.tip-card::after,
.status-card::after,
.result-card::after,
.roi-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(247,144,9,0.1), rgba(217,119,6,0.1));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.calculator-card:hover::after,
.feature-card:hover::after,
.tip-card:hover::after,
.status-card:hover::after,
.result-card:hover::after,
.roi-card:hover::after {
    opacity: 1;
}

/* Enhanced form interactions */
.form-input,
.form-select {
    position: relative;
    transition: all 0.3s ease;
}

.form-input:focus,
.form-select:focus {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(247, 144, 9, 0.15);
}

/* Progress bars animation */
.risk-fill,
.breakdown-fill {
    position: relative;
    overflow: hidden;
}

.risk-fill::before,
.breakdown-fill::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: shimmer 2s infinite;
}

/* Enhanced table interactions */
.comparison-table tr {
    transition: all 0.3s ease;
}

.comparison-table tr:hover {
    background: linear-gradient(135deg, #f8fafc, #f1f5f9);
    transform: scale(1.01);
}

/* Enhanced icon animations */
.calculator-icon,
.feature-icon,
.tip-icon {
    transition: all 0.3s ease;
}

.calculator-card:hover .calculator-icon,
.feature-card:hover .feature-icon,
.tip-card:hover .tip-icon {
    transform: scale(1.1) rotate(5deg);
}

/* Enhanced chart placeholders */
.chart-placeholder {
    position: relative;
    overflow: hidden;
}

.chart-placeholder::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 3px solid #e5e7eb;
    border-top: 3px solid #f79009;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Enhanced badge animations */
.score-badge,
.tip-savings,
.recommendation-score,
.scenario-roi {
    position: relative;
    overflow: hidden;
}

.score-badge::before,
.tip-savings::before,
.recommendation-score::before,
.scenario-roi::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    transition: left 0.5s;
}

.score-badge:hover::before,
.tip-savings:hover::before,
.recommendation-score:hover::before,
.scenario-roi:hover::before {
    left: 100%;
}

/* Enhanced tab animations */
.tab-btn {
    position: relative;
    overflow: hidden;
}

.tab-btn.active::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.2), rgba(255,255,255,0.1));
    animation: pulse 2s infinite;
}

/* Enhanced checkbox animations */
.miner-checkbox input[type="checkbox"] {
    transition: all 0.3s ease;
}

.miner-checkbox input[type="checkbox"]:checked {
    transform: scale(1.1);
}

/* Enhanced status indicators */
.status-change {
    position: relative;
    overflow: hidden;
}

.status-change.positive::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    animation: shimmer 3s infinite;
}

/* Enhanced comparison cards */
.comparison-card {
    position: relative;
    overflow: hidden;
}

.comparison-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(59,130,246,0.05), rgba(16,185,129,0.05));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.comparison-card:hover::before {
    opacity: 1;
}

/* Enhanced metric animations */
.metric,
.info-item,
.stat-item {
    transition: all 0.3s ease;
}

.metric:hover,
.info-item:hover,
.stat-item:hover {
    transform: translateX(5px);
    background: linear-gradient(135deg, #f8fafc, #f1f5f9);
}

/* Enhanced analysis items */
.analysis-item {
    position: relative;
    overflow: hidden;
}

.analysis-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(135deg, #f79009, #d97706);
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

.analysis-item:hover::before {
    transform: scaleY(1);
}

/* Enhanced provider cards */
.provider-card {
    position: relative;
    overflow: hidden;
}

.provider-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(247,144,9,0.05), rgba(217,119,6,0.05));
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.provider-card:hover::after {
    opacity: 1;
}

/* Enhanced data visualization */
.data-chart .chart-bar {
    position: relative;
    overflow: hidden;
}

.data-chart .chart-bar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.3), transparent);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.data-chart .chart-bar:hover::before {
    opacity: 1;
}

/* Enhanced timeline chart */
.timeline-chart {
    position: relative;
    overflow: hidden;
}

.timeline-chart::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, rgba(247,144,9,0.1), rgba(217,119,6,0.1));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.timeline-chart:hover::after {
    opacity: 1;
}

/* Enhanced scenario cards */
.scenario-card {
    position: relative;
    overflow: hidden;
}

.scenario-card.conservative::before {
    background: linear-gradient(135deg, rgba(239,68,68,0.1), rgba(220,38,38,0.1));
}

.scenario-card.realistic::before {
    background: linear-gradient(135deg, rgba(247,144,9,0.1), rgba(217,119,6,0.1));
}

.scenario-card.optimistic::before {
    background: linear-gradient(135deg, rgba(16,185,129,0.1), rgba(5,150,105,0.1));
}

.scenario-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.scenario-card:hover::before {
    opacity: 1;
}

/* Enhanced FAQ items */
.faq-item {
    position: relative;
    overflow: hidden;
}

.faq-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(135deg, #f79009, #d97706);
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

.faq-item:hover::before {
    transform: scaleY(1);
}

/* Enhanced breadcrumb animations */
.breadcrumb-link {
    position: relative;
    transition: all 0.3s ease;
}

.breadcrumb-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: #f79009;
    transition: width 0.3s ease;
}

.breadcrumb-link:hover::after {
    width: 100%;
}

/* Enhanced hero animations */
.calculator-hero .hero-content {
    animation: fadeInUp 1s ease;
}

.calculator-hero .feature-item {
    animation: fadeInUp 1s ease;
    animation-delay: calc(var(--i) * 0.2s);
}

.feature-item:nth-child(1) { --i: 1; }
.feature-item:nth-child(2) { --i: 2; }
.feature-item:nth-child(3) { --i: 3; }

/* Enhanced section animations */
.section-title {
    animation: fadeInUp 0.8s ease;
}

.calculator-container {
    animation: fadeInUp 1s ease;
    animation-delay: 0.2s;
}

/* Enhanced results animations */
.calculator-results {
    animation: fadeInUp 0.8s ease;
}

.results-grid .result-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.result-card:nth-child(1) { --i: 1; }
.result-card:nth-child(2) { --i: 2; }
.result-card:nth-child(3) { --i: 3; }
.result-card:nth-child(4) { --i: 4; }

/* Enhanced grid animations */
.features-grid .feature-card,
.tips-grid .tip-card,
.rates-grid .rate-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.feature-card:nth-child(1), .tip-card:nth-child(1), .rate-card:nth-child(1) { --i: 1; }
.feature-card:nth-child(2), .tip-card:nth-child(2), .rate-card:nth-child(2) { --i: 2; }
.feature-card:nth-child(3), .tip-card:nth-child(3), .rate-card:nth-child(3) { --i: 3; }
.feature-card:nth-child(4), .tip-card:nth-child(4), .rate-card:nth-child(4) { --i: 4; }
.feature-card:nth-child(5), .tip-card:nth-child(5), .rate-card:nth-child(5) { --i: 5; }
.feature-card:nth-child(6), .tip-card:nth-child(6), .rate-card:nth-child(6) { --i: 6; }

/* Enhanced table animations */
.comparison-table tr {
    animation: fadeInLeft 0.5s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.comparison-table tr:nth-child(1) { --i: 1; }
.comparison-table tr:nth-child(2) { --i: 2; }
.comparison-table tr:nth-child(3) { --i: 3; }
.comparison-table tr:nth-child(4) { --i: 4; }
.comparison-table tr:nth-child(5) { --i: 5; }

/* Enhanced FAQ animations */
.faq-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.faq-item:nth-child(1) { --i: 1; }
.faq-item:nth-child(2) { --i: 2; }
.faq-item:nth-child(3) { --i: 3; }
.faq-item:nth-child(4) { --i: 4; }

/* Enhanced status grid animations */
.status-grid .status-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.status-card:nth-child(1) { --i: 1; }
.status-card:nth-child(2) { --i: 2; }
.status-card:nth-child(3) { --i: 3; }
.status-card:nth-child(4) { --i: 4; }

/* Enhanced data grid animations */
.data-grid .data-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.2s);
}

.data-card:nth-child(1) { --i: 1; }
.data-card:nth-child(2) { --i: 2; }

/* Enhanced analysis grid animations */
.analysis-grid .analysis-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.analysis-item:nth-child(1) { --i: 1; }
.analysis-item:nth-child(2) { --i: 2; }
.analysis-item:nth-child(3) { --i: 3; }
.analysis-item:nth-child(4) { --i: 4; }

/* Enhanced recommendations grid animations */
.recommendations-grid .recommendation-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.recommendation-card:nth-child(1) { --i: 1; }
.recommendation-card:nth-child(2) { --i: 2; }
.recommendation-card:nth-child(3) { --i: 3; }
.recommendation-card:nth-child(4) { --i: 4; }

/* Enhanced scenarios grid animations */
.scenarios-grid .scenario-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.scenario-card:nth-child(1) { --i: 1; }
.scenario-card:nth-child(2) { --i: 2; }
.scenario-card:nth-child(3) { --i: 3; }

/* Enhanced providers grid animations */
.providers-grid .provider-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.provider-card:nth-child(1) { --i: 1; }
.provider-card:nth-child(2) { --i: 2; }
.provider-card:nth-child(3) { --i: 3; }

/* Enhanced difficulty summary animations */
.difficulty-summary .summary-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.summary-card:nth-child(1) { --i: 1; }
.summary-card:nth-child(2) { --i: 2; }
.summary-card:nth-child(3) { --i: 3; }
.summary-card:nth-child(4) { --i: 4; }

/* Enhanced ROI summary animations */
.roi-summary .roi-card {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.roi-card:nth-child(1) { --i: 1; }
.roi-card:nth-child(2) { --i: 2; }
.roi-card:nth-child(3) { --i: 3; }
.roi-card:nth-child(4) { --i: 4; }

/* Enhanced breakdown animations */
.breakdown-grid .breakdown-item {
    animation: fadeInLeft 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.breakdown-item:nth-child(1) { --i: 1; }
.breakdown-item:nth-child(2) { --i: 2; }
.breakdown-item:nth-child(3) { --i: 3; }
.breakdown-item:nth-child(4) { --i: 4; }

/* Enhanced comparison metrics animations */
.comparison-metrics .metric {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.metric:nth-child(1) { --i: 1; }
.metric:nth-child(2) { --i: 2; }
.metric:nth-child(3) { --i: 3; }
.metric:nth-child(4) { --i: 4; }
.metric:nth-child(5) { --i: 5; }

/* Enhanced analysis items animations */
.comparison-analysis .analysis-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.comparison-analysis .analysis-item:nth-child(1) { --i: 1; }
.comparison-analysis .analysis-item:nth-child(2) { --i: 2; }
.comparison-analysis .analysis-item:nth-child(3) { --i: 3; }
.comparison-analysis .analysis-item:nth-child(4) { --i: 4; }

/* Enhanced provider info animations */
.provider-info .info-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.info-item:nth-child(1) { --i: 1; }
.info-item:nth-child(2) { --i: 2; }
.info-item:nth-child(3) { --i: 3; }
.info-item:nth-child(4) { --i: 4; }

/* Enhanced frequency stats animations */
.frequency-stats .stat-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.stat-item:nth-child(1) { --i: 1; }
.stat-item:nth-child(2) { --i: 2; }
.stat-item:nth-child(3) { --i: 3; }
.stat-item:nth-child(4) { --i: 4; }

/* Enhanced rate list animations */
.rate-list .rate-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.rate-item:nth-child(1) { --i: 1; }
.rate-item:nth-child(2) { --i: 2; }
.rate-item:nth-child(3) { --i: 3; }
.rate-item:nth-child(4) { --i: 4; }

/* Enhanced specs grid animations */
.specs-grid .spec-category {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.2s);
}

.spec-category:nth-child(1) { --i: 1; }
.spec-category:nth-child(2) { --i: 2; }

/* Enhanced factor grid animations */
.factor-grid .factor-item {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.factor-item:nth-child(1) { --i: 1; }
.factor-item:nth-child(2) { --i: 2; }
.factor-item:nth-child(3) { --i: 3; }
.factor-item:nth-child(4) { --i: 4; }

/* Enhanced chart animations */
.chart-container {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced tab content animations */
.tab-content.active {
    animation: fadeInUp 0.5s ease;
}

/* Enhanced miner selection animations */
.miner-selection .miner-checkbox {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.miner-checkbox:nth-child(1) { --i: 1; }
.miner-checkbox:nth-child(2) { --i: 2; }
.miner-checkbox:nth-child(3) { --i: 3; }
.miner-checkbox:nth-child(4) { --i: 4; }
.miner-checkbox:nth-child(5) { --i: 5; }

/* Enhanced comparison settings animations */
.comparison-settings .setting-group {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.setting-group:nth-child(1) { --i: 1; }
.setting-group:nth-child(2) { --i: 2; }
.setting-group:nth-child(3) { --i: 3; }

/* Enhanced form section animations */
.form-section {
    animation: fadeInUp 0.6s ease;
    animation-delay: calc(var(--i) * 0.1s);
}

.form-section:nth-child(1) { --i: 1; }
.form-section:nth-child(2) { --i: 2; }
.form-section:nth-child(3) { --i: 3; }
.form-section:nth-child(4) { --i: 4; }

/* Enhanced calculator actions animations */
.calculator-actions {
    animation: fadeInUp 0.8s ease;
    animation-delay: 0.5s;
}

/* Enhanced comparison controls animations */
.comparison-controls {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced calculator tabs animations */
.calculator-tabs {
    animation: fadeInUp 0.6s ease;
}

/* Enhanced network status animations */
.network-status-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced detailed analysis animations */
.detailed-analysis-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced historical data animations */
.historical-data-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced global rates animations */
.global-rates-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced investment tips animations */
.investment-tips-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced features animations */
.features-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced providers animations */
.providers-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced difficulty calculator animations */
.difficulty-calculator-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced electricity calculator animations */
.electricity-calculator-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced cloud calculator animations */
.cloud-calculator-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced ROI calculator animations */
.roi-calculator-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced comparison section animations */
.comparison-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced calculator section animations */
.calculator-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced FAQ section animations */
.faq-section {
    animation: fadeInUp 0.8s ease;
}

/* Enhanced hero section animations */
.calculator-hero {
    animation: fadeInUp 1s ease;
}

/* Performance optimizations */
* {
    will-change: auto;
}

.calculator-card,
.feature-card,
.tip-card,
.status-card,
.result-card,
.roi-card,
.btn,
.form-input,
.form-select,
.comparison-table tr,
.miner-checkbox,
.tab-btn {
    will-change: transform, box-shadow;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
