/* IRONCLAD AUTO SERVICE — styles.css */
html{scroll-behavior:smooth}
*{box-sizing:border-box}

.scroll-progress{position:fixed;top:0;left:0;height:3px;background:#991b1b;z-index:9999;width:0%;transition:width 0.1s linear}

/* NAV */
#navbar{background:rgba(28,28,28,0.95);backdrop-filter:blur(12px);transition:all 0.3s ease}
#navbar.scrolled{background:#1c1c1c;box-shadow:0 2px 20px rgba(0,0,0,0.4)}

/* BUTTONS */
.btn-primary{background:#991b1b;color:#fff;font-family:'Montserrat',sans-serif;font-weight:700;letter-spacing:0.08em;padding:0.75rem 1.75rem;border-radius:4px;border:none;cursor:pointer;transition:all 0.2s ease;display:inline-block;text-align:center}
.btn-primary:hover{background:#7f1d1d;transform:translateY(-1px);box-shadow:0 6px 20px rgba(153,27,27,0.4)}
.btn-outline{background:transparent;color:#991b1b;border:2px solid #991b1b;font-family:'Montserrat',sans-serif;font-weight:700;letter-spacing:0.08em;padding:0.7rem 1.5rem;border-radius:4px;cursor:pointer;transition:all 0.2s ease;display:inline-block;text-align:center}
.btn-outline:hover{background:#991b1b;color:#fff}

/* MOBILE MENU */
.mobile-menu{max-height:0;overflow:hidden;transition:max-height 0.35s ease}
.mobile-menu.open{max-height:500px}

/* REVEAL */
.reveal-section{opacity:0;transform:translateY(28px);transition:opacity 0.8s ease,transform 0.8s ease}
.reveal-section.revealed{opacity:1;transform:translateY(0)}

/* SERVICE CARDS */
.service-card{transition:all 0.3s ease;border:1px solid #e5e7eb}
.service-card:hover{border-color:#991b1b;transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,0.1)}

/* COUNTER */
.counter{font-variant-numeric:tabular-nums}

/* CAROUSEL */
.carousel-slide{display:none}
.carousel-slide.active{display:block;animation:fadeSlide 0.5s ease}
@keyframes fadeSlide{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
.carousel-dot{width:8px;height:8px;border-radius:50%;background:#d1d5db;cursor:pointer;border:none;padding:0;transition:all 0.3s}
.carousel-dot.active{background:#991b1b;width:24px;border-radius:4px}

/* FAQ */
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.4s ease,padding 0.3s ease}
.faq-item.open .faq-answer{max-height:300px}
.faq-icon{transition:transform 0.3s ease}
.faq-item.open .faq-icon{transform:rotate(180deg)}

/* MODALS */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.75);z-index:100;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity 0.3s ease}
.modal-overlay.active{opacity:1;pointer-events:all}
.modal-box{background:#fff;border-radius:12px;padding:2rem;max-width:480px;width:calc(100% - 2rem);max-height:90vh;overflow-y:auto;transform:scale(0.95);transition:transform 0.3s ease;box-shadow:0 25px 60px rgba(0,0,0,0.3)}
.modal-overlay.active .modal-box{transform:scale(1)}

/* BACK TO TOP */
.back-to-top{position:fixed;bottom:2rem;right:2rem;width:3rem;height:3rem;background:#991b1b;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all 0.3s ease;z-index:50;font-size:1.2rem}
.back-to-top.visible{opacity:1;visibility:visible}
.back-to-top:hover{background:#7f1d1d;transform:translateY(-3px)}

/* HERO ANIMATIONS */
@keyframes heroUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.hero-text-1{animation:heroUp 0.8s ease forwards 0.2s;opacity:0}
.hero-text-2{animation:heroUp 0.8s ease forwards 0.4s;opacity:0}
.hero-text-3{animation:heroUp 0.8s ease forwards 0.6s;opacity:0}
.hero-text-4{animation:heroUp 0.8s ease forwards 0.8s;opacity:0}
.hero-animate{animation:heroUp 0.8s ease forwards;opacity:0}

/* SCROLLBAR */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#f5f5f5}
::-webkit-scrollbar-thumb{background:#991b1b;border-radius:4px}
