.elementor-4438 .elementor-element.elementor-element-465269d{--display:flex;--min-height:600px;--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;--padding-top:0px;--padding-bottom:100px;--padding-left:0px;--padding-right:0px;}.elementor-4438 .elementor-element.elementor-element-943aa59{--display:flex;--min-height:400px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-4438 .elementor-element.elementor-element-00d53ff .elementor-heading-title{font-family:"Secular One", Sans-serif;color:var( --e-global-color-astglobalcolor4 );}.elementor-4438 .elementor-element.elementor-element-b87700c{width:var( --container-widget-width, 67% );max-width:67%;--container-widget-width:67%;--container-widget-flex-grow:0;text-align:center;}.elementor-4438 .elementor-element.elementor-element-b87700c .elementor-heading-title{font-family:"Varela Round", Sans-serif;color:var( --e-global-color-astglobalcolor4 );}.elementor-4438 .elementor-element.elementor-element-22d204c{--display:flex;--padding-top:100px;--padding-bottom:100px;--padding-left:0px;--padding-right:0px;}.elementor-4438 .elementor-element.elementor-element-7116990{width:100%;max-width:100%;text-align:right;}.elementor-4438 .elementor-element.elementor-element-7116990 > .elementor-widget-container{padding:10px 0px 10px 0px;}.elementor-4438 .elementor-element.elementor-element-7116990.elementor-element{--align-self:flex-start;}.elementor-4438 .elementor-element.elementor-element-7116990 .elementor-heading-title{font-family:"Varela Round", Sans-serif;font-size:18px;line-height:28px;word-spacing:1px;color:var( --e-global-color-astglobalcolor4 );}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:10px;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-10px;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group > label{font-family:"Varela Round", Sans-serif;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-type-html{padding-bottom:0px;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group .elementor-field, .elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-subgroup label{font-family:"Varela Round", Sans-serif;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .e-form__buttons__wrapper__button-next{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-button[type="submit"]{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-4438 .elementor-element.elementor-element-00e45e9 .elementor-message{font-family:"Varela Round", Sans-serif;}.elementor-4438 .elementor-element.elementor-element-00e45e9{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-4438 .elementor-element.elementor-element-22d204c{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-4438 .elementor-element.elementor-element-00d53ff{text-align:center;}.elementor-4438 .elementor-element.elementor-element-00d53ff .elementor-heading-title{font-size:3em;}.elementor-4438 .elementor-element.elementor-element-b87700c{--container-widget-width:315px;--container-widget-flex-grow:0;width:var( --container-widget-width, 315px );max-width:315px;}.elementor-4438 .elementor-element.elementor-element-b87700c .elementor-heading-title{font-size:1.1em;}.elementor-4438 .elementor-element.elementor-element-22d204c{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4438 .elementor-element.elementor-element-7116990 .elementor-heading-title{font-size:1.1em;}}/* Start custom CSS for container, class: .elementor-element-22d204c *//* ============================================================
   ✨ CUSTOM ORDER BOX — White Text + Responsive Fixes
   Applies to Elementor container with class: custom-order-box
============================================================ */
.custom-order-box {
    background: rgba(10, 8, 28, 0.55);
    padding: 100px;
    margin: 0 auto;
    max-width: calc(100% - 40px);
    border-radius: 26px;
    box-shadow:
        0 0 28px rgba(120, 70, 255, 0.28),
        inset 0 0 14px rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(160, 120, 255, 0.15);
}

/* Center the form within the container */
.custom-order-box .elementor-form {
    margin: 0 auto;
    max-width: 100%;
}

/* Make ALL text white inside */
.custom-order-box,
.custom-order-box * {
    color: #ffffff !important;
}

/* ============================================================
   ELEMENTOR FORM FIELDS
============================================================ */

/* Input fields, textarea, and select dropdowns */
.custom-order-box .elementor-field-group input[type="text"],
.custom-order-box .elementor-field-group input[type="email"],
.custom-order-box .elementor-field-group input[type="tel"],
.custom-order-box .elementor-field-group input[type="number"],
.custom-order-box .elementor-field-group input[type="url"],
.custom-order-box .elementor-field-group input[type="date"],
.custom-order-box .elementor-field-group textarea,
.custom-order-box .elementor-field-group select,
.custom-order-box .elementor-field-textual {
    background: rgba(15, 12, 40, 0.45) !important;
    border: 1px solid rgba(120, 90, 255, 0.22) !important;
    color: #ffffff !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    transition: 0.2s ease;
    width: 100%;
    box-sizing: border-box;
}

/* Placeholder text white */
.custom-order-box input::placeholder,
.custom-order-box textarea::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Focus glow */
.custom-order-box .elementor-field-group input:focus,
.custom-order-box .elementor-field-group textarea:focus,
.custom-order-box .elementor-field-group select:focus {
    border-color: rgba(180, 140, 255, 0.8) !important;
    box-shadow: 0 0 10px rgba(165, 120, 255, 0.35) !important;
    outline: none;
}

/* Labels */
.custom-order-box .elementor-field-label,
.custom-order-box label {
    color: #ffffff !important;
    margin-bottom: 8px;
    display: inline-block;
}

/* Required asterisk */
.custom-order-box .elementor-mark-required {
    color: #ff6b9d !important;
}

/* Radio buttons and checkboxes */
.custom-order-box .elementor-field-subgroup label {
    color: #ffffff !important;
    margin-left: 8px;
}

/* File upload field */
.custom-order-box .elementor-field-type-upload input[type="file"] {
    background: rgba(15, 12, 40, 0.45) !important;
    border: 1px solid rgba(120, 90, 255, 0.22) !important;
    color: #ffffff !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
}

.custom-order-box .elementor-upload-area {
    background: rgba(15, 12, 40, 0.45) !important;
    border: 1px dashed rgba(120, 90, 255, 0.22) !important;
    color: #ffffff !important;
}

/* Section headers / HTML field */
.custom-order-box h3,
.custom-order-box .elementor-field-type-html h3,
.custom-order-box .elementor-field-type-html p {
    color: #ffffff !important;
    text-shadow: 0 0 5px rgba(165, 120, 255, 0.25);
}

/* Submit button */
.custom-order-box .elementor-button,
.custom-order-box .elementor-field-type-submit button,
.custom-order-box button[type="submit"] {
    background: linear-gradient(90deg, #7f5cff, #3bb8ff) !important;
    color: #fff !important;
    padding: 14px 30px !important;
    font-size: 18px !important;
    border: none !important;
    border-radius: 50px !important;
    cursor: pointer;
    transition: 0.25s ease;
    width: 100%;
}

.custom-order-box .elementor-button:hover,
.custom-order-box .elementor-field-type-submit button:hover,
.custom-order-box button[type="submit"]:hover {
    box-shadow: 0 0 18px rgba(120, 90, 255, 0.6) !important;
    transform: translateY(-2px);
}

/* Success/Error messages */
.custom-order-box .elementor-message {
    color: #ffffff !important;
    padding: 14px;
    border-radius: 12px;
    margin-bottom: 20px;
}

.custom-order-box .elementor-message-success {
    background: rgba(46, 213, 115, 0.2) !important;
    border: 1px solid rgba(46, 213, 115, 0.4);
}

.custom-order-box .elementor-message-danger {
    background: rgba(255, 71, 87, 0.2) !important;
    border: 1px solid rgba(255, 71, 87, 0.4);
}

/* Field validation errors */
.custom-order-box .elementor-error .elementor-field {
    border-color: rgba(255, 71, 87, 0.6) !important;
}

.custom-order-box .elementor-message-danger {
    color: #ffffff !important;
}

/* ============================================================
   📱 TABLET (max-width: 768px)
============================================================ */
@media (max-width: 768px) {
    .custom-order-box {
        padding: 40px;
        margin: 0 auto;
        max-width: calc(100% - 40px);
        border-radius: 22px;
    }
    
    .custom-order-box h3 {
        font-size: 20px;
        margin-bottom: 14px;
    }
    
    .custom-order-box .elementor-field-group input,
    .custom-order-box .elementor-field-group textarea,
    .custom-order-box .elementor-field-group select {
        font-size: 15px !important;
        padding: 12px 14px !important;
    }
    
    .custom-order-box .elementor-button,
    .custom-order-box button[type="submit"] {
        font-size: 17px !important;
        padding: 13px 22px !important;
        border-radius: 42px !important;
    }
}

/* ============================================================
   📱 MOBILE (max-width: 480px)
============================================================ */
@media (max-width: 480px) {
    .custom-order-box {
        padding: 22px;
        margin: 0 auto;
        max-width: calc(100% - 30px);
        border-radius: 18px;
    }
    
    .custom-order-box h3 {
        font-size: 18px;
    }
    
    .custom-order-box .elementor-field-group input,
    .custom-order-box .elementor-field-group textarea,
    .custom-order-box .elementor-field-group select {
        font-size: 14px !important;
        padding: 10px 12px !important;
    }
    
    .custom-order-box .elementor-button,
    .custom-order-box button[type="submit"] {
        font-size: 16px !important;
        padding: 12px 18px !important;
        border-radius: 38px !important;
    }
}


/* ============================================================
   📄 TERMS & CONDITIONS POPUP LINK STYLING
   Matches your purple theme
============================================================ */

/* Style the T&C link inside the checkbox */
.custom-order-box .elementor-acceptance-field a,
.custom-order-box .open-tc-popup,
.custom-order-box .elementor-field-type-acceptance a {
    color: #a78bfa !important;
    text-decoration: none;
    font-weight: 600;
    position: relative;
    transition: all 0.3s ease;
    border-bottom: 1px solid rgba(167, 139, 250, 0.3);
}

/* Hover effect - glowing underline */
.custom-order-box .elementor-acceptance-field a:hover,
.custom-order-box .open-tc-popup:hover,
.custom-order-box .elementor-field-type-acceptance a:hover {
    color: #c4b5fd !important;
    border-bottom-color: #a78bfa;
    text-shadow: 0 0 8px rgba(167, 139, 250, 0.4);
}

/* Optional: Add a small icon after the link */
.custom-order-box .open-tc-popup::after {
    content: " ↗";
    font-size: 0.85em;
    opacity: 0.7;
    margin-right: 2px;
}

/* Make the entire acceptance text more readable */
.custom-order-box .elementor-acceptance-field label,
.custom-order-box .elementor-field-type-acceptance label {
    color: #ffffff !important;
    font-size: 15px;
    line-height: 1.6;
}

/* Style the checkbox itself */
.custom-order-box .elementor-acceptance-field input[type="checkbox"],
.custom-order-box .elementor-field-type-acceptance input[type="checkbox"] {
    accent-color: #7f5cff;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    cursor: pointer;
}

/* Custom checkbox styling (optional - more advanced) */
.custom-order-box .elementor-acceptance-field input[type="checkbox"]:checked,
.custom-order-box .elementor-field-type-acceptance input[type="checkbox"]:checked {
    background: linear-gradient(135deg, #7f5cff, #a78bfa);
}

/* ============================================================
   RESPONSIVE ADJUSTMENTS
============================================================ */
@media (max-width: 768px) {
    .custom-order-box .elementor-acceptance-field label,
    .custom-order-box .elementor-field-type-acceptance label {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .custom-order-box .elementor-acceptance-field label,
    .custom-order-box .elementor-field-type-acceptance label {
        font-size: 13px;
    }
    
    .custom-order-box .elementor-acceptance-field input[type="checkbox"],
    .custom-order-box .elementor-field-type-acceptance input[type="checkbox"] {
        width: 16px;
        height: 16px;
    }
}


/* ============================================================
   🔘 FAQ & PRICING BUTTONS STYLING
   Beautiful secondary buttons matching your purple theme
============================================================ */

/* Container for the buttons */
.custom-order-box .form-info-buttons {
    display: flex;
    gap: 16px;
    margin-top: 20px;
    margin-bottom: 20px;
    justify-content: center;
    flex-wrap: wrap;
    font-family: varela round;
}

/* Base button styling */
.custom-order-box .info-button {
    flex: 1;
    min-width: 180px;
    padding: 14px 24px;
    background: rgba(15, 12, 40, 0.6);
    border: 1.5px solid rgba(167, 139, 250, 0.4);
    border-radius: 16px;
    color: #ffffff !important;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    backdrop-filter: blur(4px);
}

/* Icon styling */
.custom-order-box .info-button span {
    font-size: 20px;
    transition: transform 0.3s ease;
}

/* Hover effect */
.custom-order-box .info-button:hover {
    background: rgba(127, 92, 255, 0.2);
    border-color: rgba(167, 139, 250, 0.8);
    box-shadow: 
        0 0 20px rgba(127, 92, 255, 0.4),
        inset 0 0 10px rgba(167, 139, 250, 0.1);
    transform: translateY(-2px);
}

.custom-order-box .info-button:hover span {
    transform: scale(1.15);
}

/* FAQ button specific styling */
.custom-order-box .faq-button {
    border-color: rgba(139, 167, 250, 0.4);
    color: #fff !important;
    padding: 14px 30px !important;
    font-size: 18px !important;
    border: none !important;
    border-radius: 50px !important;
    cursor: pointer;
    transition: 0.25s ease;
    width: 100%;
}

.custom-order-box .faq-button:hover {
    background: rgba(59, 130, 246, 0.15);
    border-color: rgba(139, 167, 250, 0.8);
    box-shadow: 
        0 0 20px rgba(59, 130, 246, 0.4),
        inset 0 0 10px rgba(139, 167, 250, 0.1);
}

/* Pricing button specific styling */
.custom-order-box .pricing-button {
    border-color: rgba(250, 167, 139, 0.4);
}

.custom-order-box .pricing-button:hover {
    background: rgba(251, 146, 60, 0.15);
    border-color: rgba(250, 167, 139, 0.8);
    box-shadow: 
        0 0 20px rgba(251, 146, 60, 0.4),
        inset 0 0 10px rgba(250, 167, 139, 0.1);
}

/* Active/Click state */
.custom-order-box .info-button:active {
    transform: translateY(0);
    box-shadow: 
        0 0 10px rgba(127, 92, 255, 0.3),
        inset 0 0 8px rgba(167, 139, 250, 0.15);
}

/* ============================================================
   📱 TABLET (max-width: 768px)
============================================================ */
@media (max-width: 768px) {
    .custom-order-box .form-info-buttons {
        gap: 12px;
        margin-top: 18px;
        margin-bottom: 18px;
    }
    
    .custom-order-box .info-button {
        min-width: 160px;
        padding: 12px 20px;
        font-size: 15px;
    }
    
    .custom-order-box .info-button span {
        font-size: 18px;
    }
}

/* ============================================================
   📱 MOBILE (max-width: 480px)
============================================================ */
@media (max-width: 480px) {
    .custom-order-box .form-info-buttons {
        flex-direction: column;
        gap: 10px;
        margin-top: 16px;
        margin-bottom: 16px;
    }
    
    .custom-order-box .info-button {
        width: 100%;
        min-width: 100%;
        padding: 12px 18px;
        font-size: 14px;
        border-radius: 14px;
    }
    
    .custom-order-box .info-button span {
        font-size: 16px;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0d50c22 */.floating-gallery-custom3 {
  position: relative;
  width: 100%;
  height: 520px;
  overflow: visible;
}

.floating-gallery-custom3::before {
  content: "";
  position: absolute;
  top: -180px;
  left: 50%;
  transform: translateX(-50%);
  width: 900px;
  height: 650px;
  background: radial-gradient(
    ellipse at center,
    rgba(255,255,255,0.32) 0%,
    rgba(255,255,255,0.15) 30%,
    rgba(255,255,255,0.06) 55%,
    transparent 85%
  );
  filter: blur(90px);
  opacity: 0.9;
  pointer-events: none;
  animation: moonPulseCustom 8s ease-in-out infinite;
  z-index: 0;
}

@keyframes moonPulseCustom {
  0% { transform: translateX(-50%) scale(1); opacity: 0.8; }
  50% { transform: translateX(-50%) scale(1.05); opacity: 1; }
  100% { transform: translateX(-50%) scale(1); opacity: 0.8; }
}

.floating-gallery-custom3 img {
  position: absolute;
  border-radius: 18px;
  cursor: pointer;
  width: clamp(110px, 17vw, 210px);
  animation: floatCustom 12s ease-in-out infinite alternate;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.35));
  transition: transform 0.75s cubic-bezier(.25,.8,.25,1), filter 0.5s ease;
}

/* Left column - 2 images stacked */
.floating-gallery-custom3 img:nth-child(1) { 
  top: 2%; 
  left: 15%; 
  animation-duration: 13s; 
}

.floating-gallery-custom3 img:nth-child(2) { 
  top: 22%; 
  left: 32%; 
  animation-duration: 11s; 
}

/* Center - 1 image */
.floating-gallery-custom3 img:nth-child(3) { 
  top: 5%; 
  left: 50%; 
  transform: translateX(-50%);
  animation-duration: 15s; 
}

/* Right column - 2 images stacked */
.floating-gallery-custom3 img:nth-child(4) { 
  bottom: 2%; 
  left: 12%; 
  animation-duration: 12s; 
}

.floating-gallery-custom3 img:nth-child(5) { 
  top: 5%; 
  right: 5%; 
  animation-duration: 14s; 
}

.floating-gallery-custom3 img:nth-child(6) { 
  bottom: 0; 
  right: 15%; 
  width: 400px;
  animation-duration: 14s; 
}

@keyframes floatCustom {
  0%   { transform: translateY(0px) translateX(0px) rotate(0deg); }
  50%  { transform: translateY(-16px) translateX(10px) rotate(1deg); }
  100% { transform: translateY(14px) translateX(-10px) rotate(-1deg); }
}

.floating-gallery-custom3 img:hover {
  transform: scale(1.65) translateY(-18px) !important;
  z-index: 9999 !important;
  animation-play-state: paused !important;
  filter:
    brightness(1.2)
    drop-shadow(0 0 35px rgba(255,255,255,0.6))
    drop-shadow(0 0 60px rgba(255,255,255,0.35)) !important;
}







/* ============================================
   HIDE/SHOW VERSIONS
============================================ */
.desktop-only { display: block; }
.mobile-only { display: none; }

@media (max-width: 1024px) {
  .desktop-only { display: none !important; }
  .mobile-only { display: block !important; }
}

/* ============================================
   DESKTOP VERSION — FLOATING GALLERY
============================================ */
.floating-gallery-custom {
  position: relative;
  width: 100%;
  height: 520px;
  overflow: visible;
}

.floating-gallery-custom::before {
  content: "";
  position: absolute;
  top: -180px;
  left: 50%;
  transform: translateX(-50%);
  width: 900px;
  height: 650px;
  background: radial-gradient(
    ellipse at center,
    rgba(255,255,255,0.32) 0%,
    rgba(255,255,255,0.15) 30%,
    rgba(255,255,255,0.06) 55%,
    transparent 85%
  );
  filter: blur(90px);
  opacity: 0.9;
  pointer-events: none;
  animation: moonPulseCustom 8s ease-in-out infinite;
  z-index: 0;
}

@keyframes moonPulseCustom {
  0% { transform: translateX(-50%) scale(1); opacity: 0.8; }
  50% { transform: translateX(-50%) scale(1.05); opacity: 1; }
  100% { transform: translateX(-50%) scale(1); opacity: 0.8; }
}

.floating-gallery-custom img {
  position: absolute;
  border-radius: 18px;
  cursor: pointer;
  width: clamp(110px, 17vw, 210px);
  animation: floatCustom 12s ease-in-out infinite alternate;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.35));
  transition: transform 0.75s cubic-bezier(.25,.8,.25,1), filter 0.5s ease;
}

.floating-gallery-custom img:nth-child(1) { top: 14%; left: 18%; animation-duration: 13s; }
.floating-gallery-custom img:nth-child(2) { top: 55%; left: 12%; animation-duration: 11s; }
.floating-gallery-custom img:nth-child(3) { top: 28%; left: 42%; animation-duration: 15s; }
.floating-gallery-custom img:nth-child(4) { top: 62%; left: 62%; animation-duration: 12s; }
.floating-gallery-custom img:nth-child(5) { top: 10%; left: 68%; animation-duration: 14s; }

@keyframes floatCustom {
  0%   { transform: translateY(0px) translateX(0px) rotate(0deg); }
  50%  { transform: translateY(-16px) translateX(10px) rotate(1deg); }
  100% { transform: translateY(14px) translateX(-10px) rotate(-1deg); }
}

.floating-gallery-custom img:hover {
  transform: scale(1.65) translateY(-18px) !important;
  z-index: 9999 !important;
  animation-play-state: paused !important;
  filter:
    brightness(1.2)
    drop-shadow(0 0 35px rgba(255,255,255,0.6))
    drop-shadow(0 0 60px rgba(255,255,255,0.35)) !important;
}

/* ============================================
   MOBILE/TABLET — SWIPER CAROUSEL
============================================ */
.mobile-gallery-carousel {
width: 100%;
padding: 40px 0;
position: relative;
}

.myGallerySwiper {
width: 100%;
height: 400px; /* Keep fixed height for container */
}

/* FIX 1: Allow the slide to fill the container and manage flex */
.swiper-slide {
display: flex;
align-items: center;
justify-content: center;
height: 100%; /* Use 100% here instead of 400px fixed */
}

/* FIX 2: Ensure the image scales correctly within the slide's container */
.mobile-gallery-carousel img {
max-width: 100%; /* Image should not exceed the slide width */
height: auto !important; /* Force height to scale proportionally based on width */
object-fit: contain !important; /* Ensure the entire image is visible */
 border-radius: 18px;
box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

/* ===== NAV BUTTONS ===== */
.swiper-button-next,
.swiper-button-prev {
  width: 50px !important;
  height: 50px !important;
  background: rgba(127, 92, 255, 0.8) !important;
  border-radius: 50% !important;
  color: white !important;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 15px rgba(127, 92, 255, 0.4);
  transition: all 0.3s ease;
}

.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 20px !important;
  font-weight: bold;
}

.swiper-button-next {
  left: 10px !important;
  right: auto !important;
}

.swiper-button-prev {
  right: 10px !important;
  left: auto !important;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
  background: rgba(127, 92, 255, 1) !important;
  transform: scale(1.1);
  box-shadow: 0 6px 20px rgba(127, 92, 255, 0.6);
}

/* ===== HIDE PAGINATION DOTS (AS REQUESTED) ===== */
.swiper-pagination {
  display: none !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .myGallerySwiper {
    height: 450px;
  }
  .swiper-slide {
    height: 450px;
  }
  .swiper-button-next,
  .swiper-button-prev {
    width: 45px !important;
    height: 45px !important;
  }
  .swiper-button-next:after,
  .swiper-button-prev:after {
    font-size: 18px !important;
  }
}

@media (max-width: 480px) {
  .myGallerySwiper {
    height: 400px;
  }
  .swiper-slide {
    height: 400px;
  }
  .swiper-button-next,
  .swiper-button-prev {
    width: 40px !important;
    height: 40px !important;
  }
  .swiper-button-next:after,
  .swiper-button-prev:after {
    font-size: 16px !important;
  }
}/* End custom CSS */