.elementor-kit-7598{--e-global-color-primary:#7B3AD6;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#1C1C1C;--e-global-color-accent:#EEBB00;--e-global-color-118c3c9:#555555;--e-global-color-82866b6:#D4C8F3;--e-global-typography-primary-font-family:"All Round Gothic";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"All Round Gothic";--e-global-typography-secondary-font-weight:200;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"All Round Gothic";--e-global-typography-accent-font-weight:500;font-family:"Inter", inter;font-size:18px;line-height:1.7px;}.elementor-kit-7598 button,.elementor-kit-7598 input[type="button"],.elementor-kit-7598 input[type="submit"],.elementor-kit-7598 .elementor-button{background-color:#EEBB00;font-family:"All Round Gothic", inter;font-weight:500;text-shadow:0px 0px 10px rgba(0,0,0,0.3);color:#1C1C1C;border-radius:18px 18px 18px 18px;padding:18px 32px 18px 32px;}.elementor-kit-7598 button:hover,.elementor-kit-7598 button:focus,.elementor-kit-7598 input[type="button"]:hover,.elementor-kit-7598 input[type="button"]:focus,.elementor-kit-7598 input[type="submit"]:hover,.elementor-kit-7598 input[type="submit"]:focus,.elementor-kit-7598 .elementor-button:hover,.elementor-kit-7598 .elementor-button:focus{background-color:#9F7D02;color:#FFFFFF;border-radius:18px 18px 18px 18px;}.elementor-kit-7598 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7598 h1{font-family:"All Round Gothic", inter;font-size:82px;font-weight:600;line-height:1px;letter-spacing:-2px;}.elementor-kit-7598 h2{font-family:"All Round Gothic", inter;font-size:56px;font-weight:200;line-height:1px;letter-spacing:-2px;}.elementor-kit-7598 h3{font-family:"All Round Gothic", inter;font-size:36px;font-weight:500;line-height:1px;letter-spacing:-2px;}.elementor-kit-7598 h4{font-family:"All Round Gothic", inter;font-weight:500;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:24px;}.elementor-element{--widgets-spacing:24px 24px;--widgets-spacing-row:24px;--widgets-spacing-column:24px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* Wrapper setting: Height wahi rakhi hai taaki kate nahi */
.hero-reels-wrapper {
    position: relative;
    perspective: 1500px;
    transform-style: preserve-3d;
    height: 700px;
    width: 100%;
    margin-top: -30px;
}

/* Base phone style */
.hero-reel {
    position: absolute !important;
    width: 280px; 
    height: 540px; 
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
    border: 2px solid rgba(255, 255, 255, 0.1);
    top: 35%;
    left: 50%;
    transform-origin: center center; 
}

/* 🎯 PERFECT SYMMETRY: Fixed 160px distance from center */
.reel-1 { transform: translate(calc(-50% - 160px), -50%) translateZ(-100px) rotateY(-12deg) rotateZ(-3deg); z-index: 5; }
.reel-2 { transform: translate(-50%, -50%) translateZ(50px); z-index: 10; }
.reel-3 { transform: translate(calc(-50% + 160px), -50%) translateZ(-100px) rotateY(12deg) rotateZ(3deg); z-index: 5; }

/* Video fit hone ke liye */
.hero-reel .elementor-widget-video {
    height: 100%;
    width: 100%;
}
.hero-reel .elementor-wrapper, 
.hero-reel video {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important; 
}

/* Tablet Portrait ke liye Master Fix */
@media (min-width: 768px) and (max-width: 1024px) {
    
    /* 1. Wrapper ki zidd khatam karo */
    .hero-reels-wrapper {
        height: auto !important;
        min-height: 400px !important; /* Reels ki height ke liye */
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    /* 2. Reels ka size fix karo taaki wo screen se bahar na bhagein */
    .hero-reel {
        position: relative !important; /* Absolute hata diya */
        width: 180px !important;
        height: 360px !important;
        margin: 0 5px !important;
        top: auto !important;
        left: auto !important;
        transform: none !important; /* Pehle 3D hata kar dekho ki gap jata hai ya nahi */
    }

    /* 3. Sabse zaroori: Elementor ke dhabbe ko kill karo */
    .hero-main-container, 
    .elementor-container {
        min-height: auto !important;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
}/* End custom CSS */