.elementor-28 .elementor-element.elementor-element-43cf65d{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-28 .elementor-element.elementor-element-519438f > .elementor-widget-container{background-color:var( --e-global-color-73faeee );}.elementor-28 .elementor-element.elementor-element-519438f .deensimc-scroll-text{font-family:"Poppins", Sans-serif;font-size:16px;color:#FFFFFF;}.elementor-28 .elementor-element.elementor-element-519438f .deensimc-text-wrapper svg{fill:#FFFFFF;height:24px;width:24px;align-self:center;flex-shrink:0;}.elementor-28 .elementor-element.elementor-element-519438f .deensimc-text-wrapper i{color:#FFFFFF;font-size:24px;align-self:center;flex-shrink:0;}.elementor-28 .elementor-element.elementor-element-519438f .deensimc-text-wrapper{gap:8px;}.elementor-28 .elementor-element.elementor-element-0b4aa27{--display:flex;--min-height:100vh;--justify-content:center;--padding-top:44px;--padding-bottom:47px;--padding-left:0px;--padding-right:0px;}.elementor-28 .elementor-element.elementor-element-0b4aa27:not(.elementor-motion-effects-element-type-background), .elementor-28 .elementor-element.elementor-element-0b4aa27 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;background-image:url("https://quiz.drinkdye.com/wp-content/uploads/2026/06/Untitled-design-1-1-scaled.jpg");background-position:center center;background-size:cover;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-28 .elementor-element.elementor-element-95a20af{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -50px) 0px;text-align:center;font-family:"Roboto", Sans-serif;font-size:16px;font-weight:400;color:#101010;}.elementor-widget-animated-headline .elementor-headline-plain-text{color:var( --e-global-color-secondary );}.elementor-widget-animated-headline .elementor-headline{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-animated-headline{--dynamic-text-color:var( --e-global-color-secondary );}.elementor-widget-animated-headline .elementor-headline-dynamic-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-animated-headline .elementor-headline-dynamic-wrapper path{stroke:var( --e-global-color-accent );}.elementor-28 .elementor-element.elementor-element-60c26e3{--iteration-count:infinite;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -32px) 0px;--dynamic-text-color:var( --e-global-color-73faeee );}.elementor-28 .elementor-element.elementor-element-60c26e3 .elementor-headline{text-align:center;font-family:"Poppins", Sans-serif;font-size:56px;font-weight:400;}.elementor-28 .elementor-element.elementor-element-60c26e3 .elementor-headline-plain-text{color:#111111;}.elementor-28 .elementor-element.elementor-element-60c26e3 .elementor-headline-dynamic-text{font-family:"Poppins", Sans-serif;font-weight:400;}.elementor-28 .elementor-element.elementor-element-45666e0{text-align:center;font-family:"Poppins", Sans-serif;font-size:18px;font-weight:400;color:#232323;}.elementor-28 .elementor-element.elementor-element-8f0060f{--display:flex;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#313131B0;--border-color:#313131B0;--border-radius:20px 20px 20px 20px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-28 .elementor-element.elementor-element-8f0060f.e-con{--align-self:center;}.elementor-28 .elementor-element.elementor-element-7c80ba1{width:100%;max-width:100%;}.elementor-28 .elementor-element.elementor-element-7c80ba1.elementor-element{--align-self:center;}.elementor-28 .elementor-element.elementor-element-eade9bf{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-28 .elementor-element.elementor-element-66c6f08 > .elementor-widget-container{background-color:var( --e-global-color-73faeee );}.elementor-28 .elementor-element.elementor-element-66c6f08 .deensimc-scroll-text{font-family:"Poppins", Sans-serif;font-size:16px;color:#FFFFFF;}.elementor-28 .elementor-element.elementor-element-66c6f08 .deensimc-text-wrapper svg{fill:#FFFFFF;height:24px;width:24px;align-self:center;flex-shrink:0;}.elementor-28 .elementor-element.elementor-element-66c6f08 .deensimc-text-wrapper i{color:#FFFFFF;font-size:24px;align-self:center;flex-shrink:0;}.elementor-28 .elementor-element.elementor-element-66c6f08 .deensimc-text-wrapper{gap:8px;}@media(min-width:768px){.elementor-28 .elementor-element.elementor-element-8f0060f{--width:75%;}}@media(max-width:767px){.elementor-28 .elementor-element.elementor-element-0b4aa27{--padding-top:22px;--padding-bottom:22px;--padding-left:22px;--padding-right:22px;}.elementor-28 .elementor-element.elementor-element-95a20af{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -32px) 0px;}.elementor-28 .elementor-element.elementor-element-60c26e3{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -25px) 0px;}.elementor-28 .elementor-element.elementor-element-60c26e3 .elementor-headline{text-align:center;font-size:28px;line-height:0.6em;}.elementor-28 .elementor-element.elementor-element-45666e0{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -10px) 0px;font-size:16px;}.elementor-28 .elementor-element.elementor-element-7c80ba1{margin:-22px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}/* Start custom CSS for shortcode, class: .elementor-element-7c80ba1 *//* =========================
   GLOBAL TEXT ALIGNMENT
========================= */
.wpforms-title,
.wpforms-field-label {
    text-align: center !important;
    justify-content: center;
    color: black !important;
}

/* FIELD LABELS (Q1, Q2 headings) */
.wpforms-field-label {
    display: flex;
    justify-content: center;
    width: 100%;
    color: black!important;
}

/* LEGEND HEADINGS */
.wpforms-field legend {
    text-align: center !important; 
    width: 100%;
    color: black!important;
}
span.wpforms-page-indicator-steps {
    color: white;
}
/* FORM CENTER ALIGNMENT */
.wpforms-container-full {
    text-align: center;
    max-width: 100% !important;
    width: 100% !important;
}

span.wpforms-page-indicator-steps {
    color: black;
}
/* =========================
   GLASS FORM CONTAINER (DEEP BLUE LIGHT)
========================= */
.elementor-28 .elementor-element.elementor-element-7c80ba1 {
    background: #FBF6EC;
    border-radius: 16px;

    border: 1px solid rgba(255, 255, 255, 0.14);

    padding: 25px;
    position: relative;
    overflow: hidden;
}


/* =========================
   Q2 LAYOUT (IMAGE OPTIONS)
========================= */
#wpforms-7-field_4 {
    display: flex !important;
    gap: 20px;
    align-items: stretch;
    justify-content: space-between;
}


/* =========================
   OPTION CARDS
========================= */


/* =========================
   IMAGE CHOICES OPTION CARDS
========================= */
.wpforms-field-required.wpforms-image-choices.wpforms-image-choices-modern li.wpforms-image-choices-item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 16px;
    padding: 2px;
    transition: all 0.25s ease;
}

/* HOVER EFFECT */
.wpforms-field-required.wpforms-image-choices.wpforms-image-choices-modern li.wpforms-image-choices-item:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.30);
    box-shadow: 0 10px 25px rgba(0, 80, 150, 0.25);
}

.wpforms-field-required.wpforms-image-choices.wpforms-image-choices-modern .wpforms-image-choices-image img {
    width: 310px !important;
    height: 140px !important;
    object-fit: cover;
    border-radius: 14px;
    display: block;
    max-width: 100% ! IMPORTANT;
    border-radius: 11px !important;
}

/* =========================
   INLINE LABEL (IMAGE TEXT BOX)
========================= */
label.wpforms-field-label-inline {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    color: black!important;

    padding: 10px 14px;
    border-radius: 16px !important;

    border: 1px solid rgba(0, 0, 0, 0.08);

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

    transition: all 0.25s ease;
}


/* LABEL HOVER */
label.wpforms-field-label-inline:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: translateY(-2px);
}


/* =========================
   OPTION LABEL TEXT
========================= */
#wpforms-7-field_4 .wpforms-image-choices-label {
    margin-top: 10px;
    text-align: center;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000 !important;
}


/* =========================
   BUTTON CENTER FIX
========================= */
.wpforms-page-button-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px;
    width: 100%;
}


/* BUTTON STYLE */
.wpforms-page-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;

    padding: 10px 24px;
    border-radius: 12px;

    background: rgba(25, 107, 170, 0.15);
    color: #fff;

    border: 1px solid rgba(255, 255, 255, 0.15);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    transition: all 0.25s ease;
}


/* BUTTON HOVER */
.wpforms-page-button:hover {
    transform: translateY(-2px);
    background: rgba(25, 107, 170, 0.25);
}


/* =========================
   MOBILE RESPONSIVE
========================= */
@media (max-width: 768px) {
    #wpforms-7-field_4 {
        flex-direction: column !important;
    }

    #wpforms-7-field_4 li {
        width: 100%;
    }
}

.wpforms-field-label-inline {
    background-color: white !important;
}

.wpforms-field legend {
    text-align: center !important;
    width: 100%;
    color: black!important;
        font-family: 'Poppins', sans-serif;
    font-size: 22px ! IMPORTANT;
    line-height: 26px !important;
    padding-top: 10px ! IMPORTANT;
    padding-bottom: 10px ! IMPORTANT;
font-weight:400 !important;
font-size:22px !important;
}
div.wpforms-container-full .wpforms-form .wpforms-pagebreak-left {
    text-align: center;
}
div.wpforms-container-full .wpforms-form .wpforms-pagebreak-left .wpforms-page-button {
    margin: 0 10px 0 0;
    padding: 25px 170px 25px 169px;
}
div.wpforms-container-full .wpforms-form .wpforms-image-choices-modern .wpforms-image-choices-item.wpforms-selected .wpforms-image-choices-image:after, div.wpforms-container-full .wpforms-form .wpforms-image-choices-modern .wpforms-image-choices-item:has(input:checked) .wpforms-image-choices-image:after {
    background-color: #ffffff;
}

.wpforms-container input.wpforms-field-medium, .wpforms-container select.wpforms-field-medium, .wpforms-container .wpforms-field-row.wpforms-field-medium, .wp-core-ui div.wpforms-container input.wpforms-field-medium, .wp-core-ui div.wpforms-container select.wpforms-field-medium, .wp-core-ui div.wpforms-container .wpforms-field-row.wpforms-field-medium {
    max-width: 100%;
}
#wpforms-7-field_17-container label.wpforms-field-label {
    color: black!important;
}
.results-container {

    max-width: 100% !important;
}
@media (max-width:767px) {
    div.wpforms-container-full .wpforms-form .wpforms-pagebreak-left .wpforms-page-button {
    margin: 0 10px 0 0;
    padding: 20px 30px 20px 30px !important;
}
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-8f0060f */@keyframes rotateWhiteGlow {
    0% {
        --angle: 0deg;
    }
    100% {
        --angle: 360deg;
    }
}

/* MAIN CARD */
.glowy-white {
    position: relative;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;

    border: 1px solid rgba(255, 255, 255, 0.35);

    transition: all 0.25s ease;
}

/* ANIMATED WHITE BORDER */
.glowy-white::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;

    background: conic-gradient(
        from var(--angle),
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.4) 20%,
        rgba(255, 255, 255, 0.9) 40%,
        #ffffff 55%,
        rgba(255, 255, 255, 0.4) 75%,
        rgba(255, 255, 255, 0) 100%
    );

    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;

    animation: rotateWhiteGlow 3.8s linear infinite;
    pointer-events: none;
}

/* HOVER IMPROVE VISIBILITY */
.glowy-white:hover::before {
    filter: brightness(1.4);
}

/* OPTIONAL: STRONGER EDGE ON HOVER */
.glowy-white:hover {
    border-color: rgba(255, 255, 255, 0.6);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0b4aa27 *//* Target the container holding the quiz */
.elementor-element.elementor-element-0b4aa27  {
    position: relative;
    overflow: hidden; /* make sure pseudo-element stays behind content */
}

/* Background pseudo-element */
.elementor-element.elementor-element-0b4aa27::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 120%; /* slightly bigger for animation */
    height: 120%;
    background-image: url(https://quiz.drinkdye.com/wp-content/uploads/2026/06/ChatGPT-Image-Jun-25-2026-12_12_12-PM.png");
    background-size: cover;
    background-position: center;
    opacity:1 !important ; /* subtle, doesn’t overpower content */
    z-index: 0;
    pointer-events: none;
    transform: translate(0,0);
    animation: floatBackground 25s linear infinite;
}

/* Ensure content is above the background */
.elementor-element.elementor-element-0b4aa27 > .elementor-container {
    position: relative;
    z-index: 1;
}

/* Smooth floating animation */
@keyframes floatBackground {
    0% {
        transform: translate(0%, 0%);
    }
    50% {
        transform: translate(-5%, -5%);
    }
    100% {
        transform: translate(0%, 0%);
    }
}/* End custom CSS */