.elementor-1612 .elementor-element.elementor-element-fa88219{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1612 .elementor-element.elementor-element-9081256{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1612 .elementor-element.elementor-element-f7a393b.elementor-element{--align-self:center;}.elementor-1612 .elementor-element.elementor-element-f7a393b{bottom:calc(50% + 240px);}.elementor-1612 .elementor-element.elementor-element-f7a393b .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:60px;font-weight:700;line-height:1em;letter-spacing:-0.05em;color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-fddb1d2{--display:flex;}.elementor-1612 .elementor-element.elementor-element-23f5141{--display:flex;}.elementor-1612 .elementor-element.elementor-element-b622c50 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-77091bd .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-3c74e21 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-588bafd{--display:flex;}.elementor-1612 .elementor-element.elementor-element-e0a2150 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-569726c .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-f45475a .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-8c5da90{--display:flex;}.elementor-1612 .elementor-element.elementor-element-ad528e9 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-a2a1fb4 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-a7defc3 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-7a9c41b{--display:flex;}.elementor-1612 .elementor-element.elementor-element-c76dc70 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-6daeaaf .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-21d726d .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-fa6a6f5{--display:flex;}.elementor-1612 .elementor-element.elementor-element-320fc7d .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-f12e3de .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-b619e93 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-d0bd1a4{--display:flex;}.elementor-1612 .elementor-element.elementor-element-a9edd45 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-f47d787 .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-f786f3c .elementor-heading-title{color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-17aa484{--display:flex;--position:absolute;--min-height:100%;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );top:0px;}.elementor-1612 .elementor-element.elementor-element-3c08391{width:100%;max-width:100%;top:0px;z-index:10;}body:not(.rtl) .elementor-1612 .elementor-element.elementor-element-3c08391{left:0px;}body.rtl .elementor-1612 .elementor-element.elementor-element-3c08391{right:0px;}.elementor-1612 .elementor-element.elementor-element-3c08391 img{width:100%;height:100%;object-fit:cover;object-position:center center;}.elementor-1612 .elementor-element.elementor-element-099670e{--display:flex;--position:absolute;--gap:16px 16px;--row-gap:16px;--column-gap:16px;--border-radius:5px 5px 5px 5px;--padding-top:21px;--padding-bottom:20px;--padding-left:30px;--padding-right:30px;top:47%;--z-index:15;}.elementor-1612 .elementor-element.elementor-element-099670e:not(.elementor-motion-effects-element-type-background), .elementor-1612 .elementor-element.elementor-element-099670e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#7777774D;}.elementor-1612 .elementor-element.elementor-element-099670e.e-con{--e-con-transform-translateY:-50%;--align-self:center;}.elementor-1612 .elementor-element.elementor-element-560761a{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1612 .elementor-element.elementor-element-c813a51{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1612 .elementor-element.elementor-element-29ed94d .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:500;color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-0ed123a > .elementor-widget-container{padding:1px 7px 2px 7px;border-radius:5px 5px 5px 5px;}.elementor-1612 .elementor-element.elementor-element-0ed123a .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:14px;font-weight:500;color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-5b79c60 .elementor-heading-title{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:500;color:#FFFFFF;}.elementor-1612 .elementor-element.elementor-element-422897a img{width:100%;height:440px;object-fit:cover;object-position:center center;}.elementor-1612 .elementor-element.elementor-element-dcb00e1 > .elementor-widget-container{padding:15px 10px 15px 10px;border-radius:5px 5px 5px 5px;}.elementor-1612 .elementor-element.elementor-element-dcb00e1 .elementor-button{font-family:"DM Sans", Sans-serif;font-size:16px;font-weight:400;}.elementor-1612 .elementor-element.elementor-element-c27f95f{--display:flex;--position:absolute;--min-height:170px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:1;--border-radius:100px 100px 100px 100px;top:30px;--z-index:20;}.elementor-1612 .elementor-element.elementor-element-c27f95f::before, .elementor-1612 .elementor-element.elementor-element-c27f95f > .elementor-background-video-container::before, .elementor-1612 .elementor-element.elementor-element-c27f95f > .e-con-inner > .elementor-background-video-container::before, .elementor-1612 .elementor-element.elementor-element-c27f95f > .elementor-background-slideshow::before, .elementor-1612 .elementor-element.elementor-element-c27f95f > .e-con-inner > .elementor-background-slideshow::before, .elementor-1612 .elementor-element.elementor-element-c27f95f > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#FFFFFF;--background-overlay:'';}.elementor-1612 .elementor-element.elementor-element-c27f95f.e-con{--align-self:center;}.elementor-1612 .elementor-element.elementor-element-ef32899{top:21px;}.elementor-1612 .elementor-element.elementor-element-ef32899 .elementor-heading-title{font-family:"DM Mono", Sans-serif;font-size:14px;font-weight:500;color:#000000;}.elementor-1612 .elementor-element.elementor-element-1070ce2 > .elementor-widget-container{--e-transform-translateY:-50%;}body:not(.rtl) .elementor-1612 .elementor-element.elementor-element-1070ce2{left:17px;}body.rtl .elementor-1612 .elementor-element.elementor-element-1070ce2{right:17px;}.elementor-1612 .elementor-element.elementor-element-1070ce2{top:50%;}.elementor-1612 .elementor-element.elementor-element-1070ce2 .elementor-icon-wrapper{text-align:center;}.elementor-1612 .elementor-element.elementor-element-1070ce2.elementor-view-stacked .elementor-icon{background-color:#000000;}.elementor-1612 .elementor-element.elementor-element-1070ce2.elementor-view-framed .elementor-icon, .elementor-1612 .elementor-element.elementor-element-1070ce2.elementor-view-default .elementor-icon{color:#000000;border-color:#000000;}.elementor-1612 .elementor-element.elementor-element-1070ce2.elementor-view-framed .elementor-icon, .elementor-1612 .elementor-element.elementor-element-1070ce2.elementor-view-default .elementor-icon svg{fill:#000000;}.elementor-1612 .elementor-element.elementor-element-1070ce2 .elementor-icon{font-size:18px;}.elementor-1612 .elementor-element.elementor-element-1070ce2 .elementor-icon svg{height:18px;}.elementor-1612 .elementor-element.elementor-element-5424d1b > .elementor-widget-container{--e-transform-translateY:-50%;}body:not(.rtl) .elementor-1612 .elementor-element.elementor-element-5424d1b{right:17px;}body.rtl .elementor-1612 .elementor-element.elementor-element-5424d1b{left:17px;}.elementor-1612 .elementor-element.elementor-element-5424d1b{top:50%;}.elementor-1612 .elementor-element.elementor-element-5424d1b .elementor-icon-wrapper{text-align:center;}.elementor-1612 .elementor-element.elementor-element-5424d1b.elementor-view-stacked .elementor-icon{background-color:#000000;}.elementor-1612 .elementor-element.elementor-element-5424d1b.elementor-view-framed .elementor-icon, .elementor-1612 .elementor-element.elementor-element-5424d1b.elementor-view-default .elementor-icon{color:#000000;border-color:#000000;}.elementor-1612 .elementor-element.elementor-element-5424d1b.elementor-view-framed .elementor-icon, .elementor-1612 .elementor-element.elementor-element-5424d1b.elementor-view-default .elementor-icon svg{fill:#000000;}.elementor-1612 .elementor-element.elementor-element-5424d1b .elementor-icon{font-size:18px;}.elementor-1612 .elementor-element.elementor-element-5424d1b .elementor-icon svg{height:18px;}.elementor-1612 .elementor-element.elementor-element-3ca967e{--display:flex;--min-height:65px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:1;--border-radius:100px 100px 100px 100px;}.elementor-1612 .elementor-element.elementor-element-3ca967e::before, .elementor-1612 .elementor-element.elementor-element-3ca967e > .elementor-background-video-container::before, .elementor-1612 .elementor-element.elementor-element-3ca967e > .e-con-inner > .elementor-background-video-container::before, .elementor-1612 .elementor-element.elementor-element-3ca967e > .elementor-background-slideshow::before, .elementor-1612 .elementor-element.elementor-element-3ca967e > .e-con-inner > .elementor-background-slideshow::before, .elementor-1612 .elementor-element.elementor-element-3ca967e > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#DBDBDB;--background-overlay:'';}.elementor-1612 .elementor-element.elementor-element-3ca967e.e-con{--align-self:center;}.elementor-1612 .elementor-element.elementor-element-06d7ebd{--divider-border-style:solid;--divider-color:#000000;--divider-border-width:2px;width:var( --container-widget-width, 20px );max-width:20px;--container-widget-width:20px;--container-widget-flex-grow:0;}.elementor-1612 .elementor-element.elementor-element-06d7ebd > .elementor-widget-container{--e-transform-rotateZ:45deg;}.elementor-1612 .elementor-element.elementor-element-06d7ebd .elementor-divider-separator{width:100%;}.elementor-1612 .elementor-element.elementor-element-06d7ebd .elementor-divider{padding-block-start:0px;padding-block-end:0px;}.elementor-1612 .elementor-element.elementor-element-d7537a4{--divider-border-style:solid;--divider-color:#000000;--divider-border-width:2px;width:var( --container-widget-width, 20px );max-width:20px;--container-widget-width:20px;--container-widget-flex-grow:0;}.elementor-1612 .elementor-element.elementor-element-d7537a4 > .elementor-widget-container{--e-transform-rotateZ:-45deg;}.elementor-1612 .elementor-element.elementor-element-d7537a4 .elementor-divider-separator{width:100%;}.elementor-1612 .elementor-element.elementor-element-d7537a4 .elementor-divider{padding-block-start:0px;padding-block-end:0px;}@media(min-width:768px){.elementor-1612 .elementor-element.elementor-element-099670e{--width:500px;}.elementor-1612 .elementor-element.elementor-element-c813a51{--width:Auto;}.elementor-1612 .elementor-element.elementor-element-c27f95f{--width:170px;}.elementor-1612 .elementor-element.elementor-element-3ca967e{--width:65px;}}/* Start custom CSS for container, class: .elementor-element-fa88219 *//* ===========================================
   1. GLOBAL & DEFAULT VARIABLES
   =========================================== */

:root {
    --pie-size: min(80vw, 700px) !important;
    --ring-gap: 60px !important;
    --ring-size: calc(var(--pie-size) + var(--ring-gap) * 2) !important;
    --shared-center-y: 90vh !important;
}

/* ===========================================
   2. MAIN CONTAINER BASE STYLES
   =========================================== */

#mainhero.main-container {
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    color: #fff !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mainhero.main-container .e-con,
#mainhero.main-container .e-con-inner {
    --gap: 0px !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

#mainhero.main-container .bg-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    transition: background-color 0.8s cubic-bezier(0.65, 0, 0.35, 1),
                background-image 0.8s cubic-bezier(0.65, 0, 0.35, 1) !important;
    z-index: 0 !important;
    display: block !important;
    min-height: 0 !important;
}

#mainhero.main-container .bg-overlay > .e-con-inner {
    display: none !important;
}

/* ===========================================
   3. BASE LAYERS (DESKTOP DEFAULT LAYOUT)
   =========================================== */

#mainhero.main-container .info-layer {
    position: absolute !important;
    top: 10% !important;
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    justify-content: center !important;
    z-index: 10 !important;
    min-height: 0 !important;
}

#mainhero.main-container .info-layer > .e-con-inner {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
}

#mainhero.main-container .text-content {
    text-align: center !important;
    max-width: 600px !important;
    padding: 0 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

#mainhero.main-container .title {
    font-family: 'Playfair Display', serif !important;
    margin-bottom: 20px !important;
    letter-spacing: 1px !important;
    width: 100% !important;
    overflow: visible !important;
}

#mainhero.main-container .title h1 {
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mainhero.main-container .description {
    opacity: 0.9;
    width: 100% !important;
    overflow: visible !important;
}

#mainhero.main-container .description p {
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mainhero.main-container .nav-layer {
    position: absolute !important;
    top: 55% !important;
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 0 5% !important;
    z-index: 10 !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

#mainhero.main-container .nav-btn {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    width: 60px !important;
    height: 60px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    color: #fff !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    z-index: 20 !important;
    pointer-events: auto !important;
}

#mainhero.main-container .nav-btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.8) !important;
}

#mainhero.main-container .flavors-data,
#mainhero.main-container #flavors-data {
    display: none !important;
}

#mainhero.main-container .circle-container {
    position: absolute !important;
    left: 50% !important;
    top: var(--shared-center-y) !important;
    width: var(--ring-size) !important;
    height: var(--ring-size) !important;
    max-width: none !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none !important;
    z-index: 6 !important;
    display: block !important;
    min-height: 0 !important;
}

#mainhero.main-container .ring {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    border-radius: 50% !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    display: block !important;
    min-height: 0 !important;
}

#mainhero.main-container .flavor-item {
    position: absolute !important;
    top: -40px !important;
    left: 50% !important;
    transform-origin: 50% calc(var(--ring-size) / 2 + 40px) !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
    transition: opacity 0.3s ease !important;
    margin-left: -50px !important;
    width: 100px !important;
}

#mainhero.main-container .flavor-char {
    position: absolute !important;
    top: 0 !important;
    left: 50% !important;
    width: 30px !important;
    margin-left: -15px !important;
    text-align: center !important;
    transform-origin: 50% calc(var(--ring-size) / 2 + 40px) !important;
}

#mainhero.main-container .flavor-item:hover {
    opacity: 0.8 !important;
}

#mainhero.main-container .flavor-item.active {
    opacity: 1 !important;
    font-weight: 600 !important;
}

#mainhero.main-container .indicator-ring {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    border-radius: 50% !important;
    display: block !important;
    min-height: 0 !important;
    transform-origin: center center !important;
    transition: transform 0.5s ease-out !important;
}

#mainhero.main-container .indicator-dot {
    position: absolute !important;
    top: -6px !important;
    left: 50% !important;
    width: 12px !important;
    height: 12px !important;
    max-width: none !important;
    background-color: #fff !important;
    border-radius: 50% !important;
    transform: translateX(-50%) !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5) !important;
    display: block !important;
    min-height: 0 !important;
    min-width: 0 !important;
}

#mainhero.main-container .hero-layer {
    position: absolute !important;
    top: var(--shared-center-y) !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: var(--pie-size) !important;
    height: var(--pie-size) !important;
    max-width: none !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 0 !important;
}

#mainhero.main-container .pie-container {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    position: relative !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5) !important;
    display: block !important;
    min-height: 0 !important;
}
#mainhero.main-container .flavor-item,
#mainhero.main-container .flavor-char {
    top: -20px !important;
    transform-origin: 50% calc(var(--ring-size) / 2 + 20px) !important;
}

#mainhero.main-container .pie-container > .elementor-widget,
#mainhero.main-container .hero-pie.elementor-widget {
    display: none !important;
}

#mainhero.main-container img.hero-pie {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    transform-origin: center center !important;
}

/* ===========================================
   4. DESKTOP OVERRIDES (1025px and above)
   =========================================== */
@media (min-width: 1025px) {
    #mainhero.main-container {
        min-height: 100vh !important;
    }

    #mainhero.main-container .info-layer {
        top: 10% !important;
    }

    #mainhero.main-container .nav-layer {
        top: 55% !important;
    }
}

/* ===========================================
   5. TABLET OVERRIDES (769px to 1024px)
   =========================================== */
@media (min-width: 769px) and (max-width: 1024px) {
    :root {
        --shared-center-y: 75vh !important;
    }

    #mainhero.main-container {
        margin-top: 0px !important;
        min-height: 80vh !important;
    }

    #mainhero.main-container .info-layer {
        top: 10% !important;
    }

    #mainhero.main-container .nav-layer {
        top: 60% !important;
    }
}

/* ===========================================
   6. MOBILE OVERRIDES (768px and below)
   =========================================== */
@media (max-width: 768px) {
    :root {
        --pie-size: 270px !important; 
        --ring-gap: 8px !important;
        --ring-size: calc(var(--pie-size) + var(--ring-gap) * 2) !important;
        --shared-center-y: 38vh !important; /* Line 255: Wheel/Ring Vertical Center Position */
    }

    #mainhero.main-container {
        margin-top: -60px !important;
        /* >>> LINE 260-261: MOBILE CONTAINER HEIGHT CONTROL <<< */
       height: 60vh !important; /* Yahan se mobile container ki height choti/badi karein (e.g. 45vh, 50vh, 60vh) */
    }

    #mainhero.main-container .info-layer {
        top: 6% !important; /* Line 265: Mobile Text Top Spacing */
    }

    #mainhero.main-container .nav-layer {
        top: 80% !important; /* Line 269: Mobile Buttons Top Position */
    }

    #mainhero.main-container .indicator-dot {
        display: block !important;
    }
}/* End custom CSS */