*{
            margin:0;
            padding:0;
            box-sizing:border-box;
        }

        body{

            background:
            linear-gradient(rgba(4,4,4,0.96), rgba(6,6,6,0.98)),
            url('../images/case-bg.jpg') center/cover fixed;

            color:#d9cfbe;

            font-family:'Cormorant Garamond', serif;

            overflow-x:hidden;

        }

        body::before{

            content:"";
            position:fixed;
            inset:0;

            background:
            url('../images/black-paper.png');

            opacity:0.18;

            pointer-events:none;

            z-index:-1;

        }

        a{
            text-decoration:none;
            color:inherit;
        }

        img{
            max-width:100%;
            display:block;
        }

        /* ============================================
           HEADER
        ============================================ */

        header{

            width:100%;
            padding:25px 0;

            position:sticky;
            top:0;

            z-index:999;

            background:rgba(0,0,0,0.84);

            backdrop-filter:blur(5px);

            border-bottom:
            1px solid rgba(200,169,106,0.15);

        }

        .nav-container{

            width:90%;
            max-width:1450px;

            margin:auto;

            display:flex;
            justify-content:space-between;
            align-items:center;

        }

        .logo{

            font-family:'Cinzel', serif;

            font-size:30px;

            letter-spacing:4px;

            text-transform:uppercase;

            color:#c8a96a;

        }

        nav{

            display:flex;
            gap:35px;

        }

        nav a{

            color:#c5b69b;

            font-size:18px;

            transition:0.3s ease;

            position:relative;

        }

        nav a::after{

            content:"";

            position:absolute;

            left:0;
            bottom:-6px;

            width:0%;
            height:1px;

            background:#c8a96a;

            transition:0.4s ease;

        }

        nav a:hover{
            color:#fff;
        }

        nav a:hover::after{
            width:100%;
        }

        /* ============================================
           HERO
        ============================================ */

        .hero{

            height:70vh;

            position:relative;

            display:flex;
            align-items:center;
            justify-content:center;

            overflow:hidden;

        }

        .hero::before{

            content:"";

            position:absolute;
            inset:0;

            background:
            linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.92)),
            url('../images/prinnylanebanner.png') center/cover;

            transform:scale(1.05);

        }

        .hero-content{

            position:relative;

            z-index:5;

            width:90%;
            max-width:1200px;

            text-align:center;

        }

        .case-number{

            color:#c8a96a;

            font-size:20px;

            letter-spacing:5px;

            text-transform:uppercase;

            margin-bottom:25px;

        }

        .hero h1{

            font-family:'Cinzel', serif;

            font-size:86px;

            letter-spacing:6px;

            text-transform:uppercase;

            color:#f1e8db;

            margin-bottom:25px;

            line-height:1.2;

        }

        .hero p{

            max-width:900px;

            margin:auto;

            font-size:30px;

            line-height:1.8;

            color:#beaf93;

        }

        /* ============================================
           MAIN LAYOUT
        ============================================ */

        .case-layout{

            width:90%;
            max-width:1500px;

            margin:120px auto;

            display:grid;

            grid-template-columns:380px 1fr;

            gap:60px;

            align-items:start;

        }

        /* ============================================
           SIDEBAR
        ============================================ */

        .sidebar{

            position:sticky;
            top:120px;

            display:flex;
            flex-direction:column;
            gap:35px;

        }

        .sidebar-box{

            background:rgba(10,10,10,0.96);

            border:
            1px solid rgba(200,169,106,0.14);

            padding:35px;

            position:relative;

        }

        .sidebar-box::before{

            content:"";

            position:absolute;

            top:0;
            left:0;

            width:100%;
            height:2px;

            background:#c8a96a;

            opacity:0.45;

        }

        .sidebar-box h2{

            font-family:'Cinzel', serif;

            font-size:28px;

            color:#f0e5d4;

            margin-bottom:20px;

            letter-spacing:2px;

            text-transform:uppercase;

        }

        .sidebar-box p{

            font-size:24px;

            line-height:1.8;

            color:#b9aa92;

        }

        .sidebar-box ul{

            list-style:none;

            display:flex;
            flex-direction:column;
            gap:15px;

        }

        .sidebar-box li{

            font-size:23px;

            line-height:1.7;

            color:#b7a88f;

            border-bottom:
            1px solid rgba(255,255,255,0.05);

            padding-bottom:12px;

        }

        /* ============================================
           MAIN CONTENT
        ============================================ */

        .main-content{

            display:flex;
            flex-direction:column;
            gap:70px;

        }

        .content-box{

            background:rgba(10,10,10,0.96);

            border:
            1px solid rgba(200,169,106,0.14);

            padding:55px;

            position:relative;

            overflow:hidden;

        }

        .content-box::before{

            content:"";

            position:absolute;

            top:0;
            left:0;

            width:100%;
            height:2px;

            background:#c8a96a;

            opacity:0.4;

        }

        .content-box h2{

            font-family:'Cinzel', serif;

            font-size:42px;

            color:#f1e8db;

            margin-bottom:30px;

            letter-spacing:3px;

            text-transform:uppercase;

        }

        .content-box p{

            font-size:28px;

            line-height:2;

            color:#b9ab93;

            margin-bottom:30px;

        }

        /* ============================================
           GALLERY
        ============================================ */

        .gallery-grid{

            display:grid;

            grid-template-columns:
            repeat(auto-fit, minmax(280px, 1fr));

            gap:30px;

            margin-top:40px;

        }

        .gallery-item{

            background:#080808;

            border:
            1px solid rgba(200,169,106,0.12);

            overflow:hidden;

            transition:0.4s ease;

        }

        .gallery-item:hover{

            transform:translateY(-8px);

            border-color:#c8a96a;

            box-shadow:
            0 25px 45px rgba(0,0,0,0.65);

        }

        .gallery-image{

            height:280px;

            overflow:hidden;

        }

        .gallery-image img{

            width:100%;
            height:100%;

            object-fit:cover;

            filter:grayscale(20%);

            transition:0.5s ease;

        }

        .gallery-item:hover .gallery-image img{

            transform:scale(1.05);

            filter:grayscale(0%);

        }

        .gallery-content{

            padding:25px;

        }

        .gallery-content h3{

            font-family:'Cinzel', serif;

            font-size:24px;

            color:#f0e5d4;

            margin-bottom:15px;

            letter-spacing:2px;

        }

        .gallery-content p{

            font-size:22px;

            line-height:1.7;

            color:#ab9c84;

            margin:0;

        }

        /* ============================================
           TIMELINE
        ============================================ */

        .timeline{

            position:relative;

            padding-left:40px;

            margin-top:20px;

        }

        .timeline::before{

            content:"";

            position:absolute;

            left:8px;
            top:0;

            width:2px;
            height:100%;

            background:
            rgba(200,169,106,0.35);

        }

        .timeline-item{

            position:relative;

            margin-bottom:50px;

        }

        .timeline-item::before{

            content:"";

            position:absolute;

            left:-39px;
            top:12px;

            width:14px;
            height:14px;

            border-radius:50%;

            background:#c8a96a;

            box-shadow:
            0 0 15px rgba(200,169,106,0.4);

        }

        .timeline-item h3{

            font-family:'Cinzel', serif;

            font-size:28px;

            color:#f0e5d4;

            margin-bottom:12px;

            letter-spacing:2px;

        }

        .timeline-item p{

            font-size:25px;

            line-height:1.8;

            color:#b7a88f;

        }

        /* ============================================
           FOOTER
        ============================================ */

        footer{

            text-align:center;

            padding:60px 20px;

            background:#050505;

            border-top:
            1px solid rgba(200,169,106,0.12);

        }

        footer p{

            color:#857764;

            font-size:20px;

            letter-spacing:1px;

        }

        /* ============================================
           RESPONSIVE
        ============================================ */

        @media(max-width:1200px){

            .case-layout{
                grid-template-columns:1fr;
            }

            .sidebar{
                position:relative;
                top:auto;
            }

        }

        @media(max-width:768px){

            .hero h1{
                font-size:50px;
            }

            .hero p{
                font-size:22px;
            }

            .content-box{
                padding:35px 25px;
            }

            .content-box p{
                font-size:24px;
            }

            nav{
                flex-wrap:wrap;
                justify-content:center;
            }

            .nav-container{
                flex-direction:column;
                gap:20px;
            }

        }
/* ============================================
   VIDEO SECTION
============================================ */

.video-wrapper{

    position:relative;

    width:100%;

    padding-bottom:56.25%;

    margin-top:40px;

    border:
    1px solid rgba(200,169,106,0.15);

    overflow:hidden;

    background:#000;

    box-shadow:
    0 20px 40px rgba(0,0,0,0.6);

}

.video-wrapper iframe{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:100%;

}

.video-description{

    margin-top:35px;

    padding:30px;

    background:#080808;

    border:
    1px solid rgba(200,169,106,0.12);

}

.video-description h3{

    font-family:'Cinzel', serif;

    font-size:28px;

    color:#f0e5d4;

    margin-bottom:18px;

    letter-spacing:2px;

    text-transform:uppercase;

}

.video-description p{

    font-size:24px;

    line-height:1.9;

    color:#b6a88f;

    margin:0;

}
/* ============================================
   WATCH BUTTON
============================================ */

.watch-btn{

    display:inline-block;

    margin-top:40px;

    padding:18px 38px;

    background:
    rgba(0,0,0,0.55);

    border:
    1px solid rgba(200,169,106,0.35);

    color:#f0e5d4;

    font-family:'Cinzel', serif;

    font-size:18px;

    letter-spacing:3px;

    text-transform:uppercase;

    transition:0.4s ease;

    backdrop-filter:blur(3px);

    box-shadow:
    0 10px 25px rgba(0,0,0,0.45);

}

.watch-btn:hover{

    background:#c8a96a;

    color:#111;

    transform:translateY(-4px);

    box-shadow:
    0 15px 35px rgba(0,0,0,0.6);

}
body{

    background:
    linear-gradient(rgba(4,4,4,0.96), rgba(6,6,6,0.98)),
    url('images/case-bg.jpg') center/cover fixed;

    color:#d9cfbe;

    font-family:'Cormorant Garamond', serif;

    overflow-x:hidden;

    scroll-behavior:smooth;

}
scroll-behavior:smooth;