
        body {
            /*background-color: #FCE7DF;*/
            background-image: url('assets/Whole.png');
            background-repeat: no-repeat;
            background-size: cover;
            font-family: 'Segoe UI', sans-serif;
        }
        .header {
            background: white;
            padding: 15px 40px;
            box-shadow: 0 2px 6px rgba(0,0,0,0.05);
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .header a {
            text-decoration: none;
            font-weight: 600;
            margin-left: 20px;
            color: #333;
        }
        .btn-login {
            background-color: #e98a6f;
            color: white !important;
            padding: 8px 18px;
            border-radius: 6px;
        }
        .btn-login:hover {
            background-color: #d47860;
        }
        .hero-left {
            display: flex;
            flex-direction: column;
            padding: 50px;
            gap: 100px;
            position: relative;
        }
        .hero-title {
            font-size: 2rem;
            font-weight: 200;
            font-family: cursive;
        }
        .hero-text {
            color: #444;
            font-size: 1.1rem;
            margin-bottom: 30px;
        }
        .btn-dark-purple {
            background-color: #4b1f47;
            padding: 12px 24px;
            color: white;
            border-radius: 8px;
            font-weight: 600;
            border: none;
        }
        .btn-dark-purple:hover {
            background-color: #3d1739;
        }
        .btn-light {
            background-color: white;
            padding: 12px 24px;
            border-radius: 8px;
            border: 1px solid #ddd;
            font-weight: 600;
        }
        .preview-card {
            background: white;
            border-radius: 12px;
            padding: 20px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
            margin-bottom: 20px;
            font-family: cursive;
        }
        img.preview-img {
            width: 100%;
            border-radius: 12px;
            margin-bottom: 15px;
        }
        .title_wrapper{
            
            pointer-events: none;
            position: relative;
            z-index: 2;
            display: flex;
            align-items: center;
            justify-content: center;
            bottom: -50px;
            left: -100px;
            
        }
        .title_wrapper .logo{
           max-width: 20%;
           height: auto;
        }
         .title_wrapper .flavour_text{
            flex-direction: column;
         }
         .start .start_img{
            width: 80%;
         }
         .start{
            position: absolute;
            z-index: 1;
         }