:root{
    --ink:#fff;
    --cream:#f4ecdd;
    --cream-dim:#cdc4b2;
    --brass:#c8a44d;
    --brass-light:#e3c878;
    --line:rgba(244,236,221,0.2);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{ font-family: "Marcellus", sans-serif; background:var(--ink);}

.slider{
    position:relative;
    width:100%;
    height:85vh;
    min-height:560px;
    overflow:hidden;
    background:var(--ink);
}

.slide-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    opacity:0;
    transition:opacity .9s ease;
    z-index:1;
}
.slide-bg.active{opacity:1; z-index:2;}
.slide-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(19,17,15,0.1) 0%, rgba(19,17,15,0.55) 85%, rgba(19,17,15,0.92) 100%);
}

.slider-topbar{
    position:absolute;
    top:0; left:0; right:0;
    z-index:6;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:30px 56px;
}
.brand-mark{
    color:var(--cream);
    font-family:'Playfair Display',serif;
    font-size:20px;
    letter-spacing:0.06em;
    font-weight:600;
}
.brand-mark span{color:var(--brass-light);}

.slide-caption{
    position:absolute;
    left:56px;
    bottom:170px;
    z-index:6;
    max-width:600px;
    pointer-events:none;
}
.slide-caption .eyebrow{
    color:var(--brass-light);
    font-size:13px;
    letter-spacing:0.2em;
    text-transform:uppercase;
    font-weight:500;
    margin-bottom:14px;
}
.slide-caption h2{
    font-family: "Marcellus", sans-serif;
    font-weight:700;
    font-size:clamp(32px,5vw,60px);
    color:var(--cream);
    line-height:1.08;
}

.product-nav{
    position:absolute;
    left:0; right:0; bottom:0;
    z-index:7;
    display:flex;
    border-top:1px solid var(--line);
    background:rgba(19,17,15,0.55);
    backdrop-filter:blur(4px);
}
.product-nav-item{
    flex:1;
    text-align:center;
    padding:22px 10px;
    cursor:pointer;
    color:var(--cream-dim);
    font-size:13px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    font-weight:500;
    border-right:1px solid var(--line);
    position:relative;
    transition:color .25s ease, background .25s ease;
}
.product-nav-item:last-child{border-right:none;}
.product-nav-item::before{
    content:"";
    position:absolute;
    left:0; bottom:0; right:0;
    height:2px;
    background:var(--brass-light);
    transform:scaleX(0);
    transition:transform .3s ease;
}
.product-nav-item:hover,
.product-nav-item.active{
    color:var(--cream);
    background:rgba(244,236,221,0.06);
}
.product-nav-item:hover::before,
.product-nav-item.active::before{
    transform:scaleX(1);
}
.product-nav-item:focus-visible{outline:2px solid var(--brass-light); outline-offset:-4px;}

@media (max-width:900px){
    .product-nav{flex-wrap:wrap;}
    .product-nav-item{flex:1 1 33.33%; padding:14px 6px; font-size:11px;}
    .slide-caption{left:24px; bottom:150px;}
    .slider-topbar{padding:20px 24px;}
}

@media (prefers-reduced-motion: reduce){
    .slide-bg{transition:none !important;}
}