.villa-hero-video {
    position: relative;
    width: 100%;
    height: 700px;
    overflow: hidden;

    .hero-video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;

        video.video-bg {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: brightness(0.6); // dark overlay effect
        }
    }

    .content-info {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
        width: 1170px;
        padding: 0;

        @media only screen and (max-width: 767px) {
            width: 100%;
            padding: 0 30px;
        }

        h2 {
            font-size: 3rem;
            font-weight: 700;
            color: #ffffff;
            margin-bottom: 1rem;
        }

        p {
            font-size: 1.25rem;
            color: #f1f1f1;
            margin: 0;
            font-weight: 400;
        }

        a {
            display: inline-block;
            margin-top: 1.5rem;
            padding: 0.75rem 1.5rem;
            background-color: #ffffff;
            color: #333;
            font-weight: 600;
            text-decoration: none;
            border-radius: 50px;
            transition: all 0.3s ease;
        }
    }
}



//     .content-info {
//       position: relative;
//       z-index: 2;
//       height: 100%;
//       display: flex;
//       align-items: center;
//       padding: 0 2rem;

//       .container {
//         max-width: 1200px;
//         margin: 0 auto;
//       }

    //   h2 {
    //     font-size: 3rem;
    //     font-weight: 700;
    //     color: #ffffff;
    //     margin-bottom: 1rem;
    //     text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
    //   }

//       p {
        // font-size: 1.25rem;
        // color: #f1f1f1;
        // max-width: 600px;
        // text-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);

//         a {
//           display: inline-block;
//           margin-top: 1.5rem;
//           padding: 0.75rem 1.5rem;
//           background-color: #ffffff;
//           color: #333;
//           font-weight: 600;
//           text-decoration: none;
//           border-radius: 50px;
//           transition: all 0.3s ease;

//           &:hover {
//             background-color: #0066ff;
//             color: #fff;
//             box-shadow: 0 8px 24px rgba(0, 102, 255, 0.3);
//           }
//         }
//       }
//     }

//     // Responsive
//     @media (max-width: 768px) {
//       .content-info {
//         h2 {
//           font-size: 2.25rem;
//         }

//         p {
//           font-size: 1rem;

//           a {
//             padding: 0.6rem 1.2rem;
//           }
//         }
//       }
//     }

//     @media (max-width: 480px) {
//       .content-info {
//         padding: 0 1rem;

//         h2 {
//           font-size: 1.75rem;
//         }

//         p {
//           font-size: 0.95rem;
//         }
//       }
//     }
// }