/* ==========================================================================
   HERO SLIDER (home.css)
   ========================================================================== */

.main-content {
    width: 75%;
    margin: 0 auto;
}

.slider-container {
    width: 100%;
    margin: 20px 0;
    height: 75vh;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background: #000;
}

.static-slider-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(rgba(0,0,0,0.65), rgba(0,0,0,0.65)), 
                url('../assets/home/2LeatherChairs.png') no-repeat center center;
    background-size: cover;
    z-index: 1;
}

.slider-wrapper { position: relative; height: 100%; z-index: 2; }

.slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease-in-out;
    display: flex;
    align-items: center; 
    padding: 100px;
}

.slide.active { opacity: 1; visibility: visible; }

/* PC ALIGNMENT */
.content-center { justify-content: center; text-align: center; }
.content-left { justify-content: flex-start; }
.content-right { justify-content: flex-end; }
.centered-block { text-align: center; max-width: 650px; }

/* PC TEXT SIZES */
.mission-content h2, .hero-content h1 { font-size: 3.2rem; font-weight: 800; margin-bottom: 20px; line-height: 1.1; }
.mission-content p, .hero-content p { font-size: 1.45rem; line-height: 1.7; }

/* NAVIGATION CARROTS */
.nav-carrot {
    display: none; 
    position: absolute;
    top: 15px;
    background: rgba(255,255,255,0.1);
    color: white;
    border: none;
    font-size: 2.5rem;
    width: 50px;
    height: 50px;
    z-index: 30;
    cursor: pointer;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}
.left-carrot { left: 15px; }
.right-carrot { right: 15px; }

/* PC CONTROLS */
.slider-controls {
    position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);
    display: flex; align-items: center; gap: 30px; z-index: 20;
    background: rgba(0,0,0,0.4); padding: 10px 25px; border-radius: 50px;
}
.dot { width: 10px; height: 10px; background: rgba(255,255,255,0.3); border-radius: 50%; cursor: pointer; }
.dot.active { background: #ffffff; transform: scale(1.4); }
.pause-btn { background: none; border: 1px solid rgba(255,255,255,0.5); color: white; width: 34px; height: 34px; border-radius: 50%; cursor: pointer; }

/* MOBILE OVERRIDES */
@media (max-width: 850px) {
    .main-content { width: 95%; }
    .slider-container { height: 85vh; border-radius: 10px; }
    .slide { padding: 120px 25px 40px; flex-direction: column; justify-content: flex-start; }
    .mission-content p, .hero-content p { font-size: 1.15rem; }
    .mission-content h2, .hero-content h1 { font-size: 1.25rem; }
    .pc-only { display: none !important; }
    .nav-carrot { display: flex; } 
}