/* ===== Home Page ===== */

.hero-carousel { position: relative; height: 100vh; min-height: 620px; overflow: hidden; background: var(--bg); }
.hero-slide { position: absolute; inset: 0; display: block; }
.hero-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: rdpl-kb 7s ease-out both; }
.hero-slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(14,14,12,.35) 0%, rgba(14,14,12,0) 30%, rgba(14,14,12,0) 50%, rgba(14,14,12,.8) 100%);
}
.hero-caption {
    position: absolute;
    left: 34px;
    right: 34px;
    bottom: 38px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    pointer-events: none;
}
.hero-caption-text { max-width: 60%; pointer-events: auto; }
.hero-caption-cat {
    font-size: var(--font-size-sm);
    letter-spacing: var(--letter-spacing-wider);
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 14px;
}
.hero-caption-title {
    font-family: var(--font-primary);
    font-weight: 300;
    font-size: var(--font-size-hero);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--cream);
    margin: 0;
    max-width: 20ch;
}
.hero-controls {
    display: flex;
    align-items: center;
    gap: 16px;
    pointer-events: auto;
}
.hero-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(243,241,234,.4);
    background: transparent;
    color: var(--cream);
    font-size: 16px;
    cursor: pointer;
    transition: all var(--transition-fast);
}
.hero-btn:hover { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.hero-counter {
    font-family: var(--font-primary);
    font-size: 13px;
    letter-spacing: .08em;
    color: var(--cream);
    min-width: 56px;
    text-align: center;
}
.hero-dots {
    position: absolute;
    left: 34px;
    bottom: 20px;
    display: flex;
    gap: 7px;
}
.hero-dot {
    width: 34px;
    height: 3px;
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: background var(--transition-fast);
}
