[x-cloak] { display: none !important; }
.hero-section {
    /* background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%); */
    background: var(--iv-accent);
    color: white;
    padding: 4rem 0;
    text-align: center;
}
.hero-container{max-width:1200px;margin:0 auto;padding:0 2rem}.hero-title{font-size:48px;font-weight:700;margin-bottom:1rem;color: var(--gray1);}
.hero-subtitle{font-size:1.15rem;opacity:.9;margin-bottom:0rem;max-width:670px;margin-left:auto;margin-right:auto;color: var(--gray1);}
.main-content{max-width:1200px;margin:0 auto;padding:4rem 2rem}
.upload-section{background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.1);padding:3rem;margin-bottom:3rem}
.section-title{font-size:2rem;font-weight:700;color:#1e3a8a;margin-bottom:1rem;text-align:center;color: var(--gray1);}
.section-subtitle{color:#999;text-align:center;margin-bottom:2rem}

.upload-area{border:2px dashed #ffccaa;border-radius:8px;padding:3rem;text-align:center;transition:.3s;cursor:pointer;background:#ff660014}
/* .upload-area:hover{border-color:#3b82f6;background:#f1f5f9} */
.upload-area.dragover{border-color:#3b82f6;background:#eff6ff}
.upload-icon{width:64px;height:64px;margin:0 auto 1rem;background:#ffcfaf;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2rem}
.upload-text{font-size:1.1rem;color:var(--gray1);margin-bottom:.5rem}
.upload-subtext{color:#999;font-size:.9rem}

.file-input{display:none}

.btn{background:#3b82f6;color:#fff;border:none;padding:.75rem 2rem;border-radius:6px;font-weight:600;cursor:pointer;transition:.3s;display:inline-block;text-decoration:none}
.btn:hover{background:#1e3a8a;transform:translateY(-2px)}
.btn-accent{background:#f97316}
.btn-accent:hover{background:#ea580c;color:#fff}

.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:3rem}
.feature-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 20px rgba(0,0,0,.08);text-align:center;transition:transform .3s}
.feature-card:hover{transform:translateY(-5px)}

.feature-icon{width:60px;height:60px;margin:0 auto 1.5rem;background:#ffcfaf;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem}
.feature-title{font-size:1.25rem;font-weight:700;color:var(--gray1);margin-bottom:.5rem}
.feature-description{color:#999;line-height:1.6;margin-bottom: 0px;}

.process-section{background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.1);padding:2rem;margin-top:3rem}
.process-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:2rem}
.process-step{text-align:center}


.step-number{width:50px;height:50px;background:#f97316;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;margin:0 auto 1rem}
.step-title{font-size:1.17em;font-weight:700;color:var(--gray1);margin-bottom:.5rem}
.step-description {color: #999; font-size: 0.9rem;}

.pricing-section{background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.1);padding:3rem;margin-top:3rem;text-align:center}
.pricing-highlight{background:linear-gradient(135deg,#f97316,#dc2626);color:#fff;padding:1rem 2rem;border-radius:6px;display:inline-block;margin-bottom:1rem;font-weight:700}

.price{font-size:3rem;font-weight:700;color:#f97316;margin:1rem 0}
.price-note{color:#999;margin-bottom:2rem}

.file-info,.uploaded-file{align-items:center;display:flex}
.uploaded-file{background:#f0f9ff;border:1px solid #bae6fd;border-radius:6px;padding:1rem;margin-top:1rem;justify-content:space-between}
.file-info{gap:.5rem}
.file-icon{width:40px;height:40px;background:#3b82f6;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff}

.processing-status{background:#fef3c7;border:1px solid #fbbf24;border-radius:6px;padding:1rem;margin-top:1rem;text-align:center;color:#92400e}
.progress-bar{width:100%;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden;margin-top:.5rem}
.progress-fill{height:100%;background:#f97316;width:45%;transition:width .3s}

.pt-5rem{padding-top: 5.1rem;}
.close-btn-original{
    position: absolute;
    right: -4px;
    top: -15px;
    border-radius: 50%;
    background: #f52727;
    border: #f57373;
    color: white;
    width: 28px;
    height: 28px;
    background: #ef4444;
    border: none;
    font-size: 16px;
    font-weight: 700;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3);
}
.close-btn-original:hover{
    background: #dc2626;
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);
}
    
/* Analysis Status Styles */
.analysis-status {
    margin: 1rem 0;
    padding: 1.5rem;
    border-radius: 12px;;
    border: 2px solid transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.status-queued {
    background: linear-gradient(135deg, #fef3c7, #fbbf24);
    border-color: #f59e0b;
    color: #92400e;
}

.status-processing {
    background: linear-gradient(135deg, #dbeafe, #3b82f6);
    border-color: #3b82f6;
    color: #1e40af;
}

.status-completed {
    background: linear-gradient(135deg, #d1fae5, #10b981);
    border-color: #e2e8f0;
    color: #065f46;
}

.status-failed {
    background: linear-gradient(135deg, #fee2e2, #ef4444);
    border-color: #ef4444;
    color: #991b1b;
}

.status-text {
    font-weight: 600;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.status-icon {font-size: 1.5rem;animation: pulse 2s infinite;}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

@media (max-width:1199px){
    .main-content{
        max-width: 1024px;
    }
    .hero-title{
        font-size: 40px;
    }
    .features-grid{
        grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
    }
}

@media (max-width:1023px){
    .pt-5rem{
        padding-top: 74px;
    }
    .features-grid{
        grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
        gap: 1.5rem;
    }
}

@media (max-width: 991px) {
    .hero-title {font-size: 2rem;} 
    .navbar-container {padding: 0 1rem;}
    .main-content {padding: 2rem 1rem;}
    .section-title{font-size: 1.65rem;}
    .upload-section, .process-section, .pricing-section {padding: 2rem;}
    .process-steps{grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1.5rem;}
    .features-grid {grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 1rem;}
    .feature-card{padding: 1rem;}
    .feature-title{font-size: 1rem;}
    .feature-description{font-size: 14px;}
}

@media (max-width:767px){
    .hero-title{font-size: 28px;}
    .hero-subtitle,
    .section-subtitle{font-size: 16px;}
    .section-title{font-size: 1.5rem;}
    .features-grid{grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));}
    .price{font-size: 2.5rem;}
}

@media (max-width:575px){
    .hero-section{padding: 3rem 0;}
    .upload-area{padding: 1rem 0;}
    .upload-text{font-size: 14px;}
    .upload-section, .process-section, .pricing-section{padding: 1.5rem 0;}
}