.szoneapp-floating-section{
  padding: 30px 0;
  color: #fff;
  border-radius: 18px;
}

.szoneapp-floating-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 40px;
}

/* Layout switch via prefix_class:
   .szoneapp-floating-layout-text_left (default)
   .szoneapp-floating-layout-text_right
*/
.szoneapp-floating-layout-text_right .szoneapp-floating-grid{
  direction: rtl;
}
.szoneapp-floating-layout-text_right .szoneapp-floating-text,
.szoneapp-floating-layout-text_right .szoneapp-floating-media{
  direction: ltr;
}

.szoneapp-floating-text{
  padding: 8px 0;
}

.szoneapp-floating-title{
  font-size: 44px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 14px 0;
}

.szoneapp-floating-desc{
  color: rgba(255,255,255,.72);
  font-size: 16px;
  line-height: 1.75;
  margin: 0 0 14px 0;
}

.szoneapp-floating-p{
  margin: 0 0 14px 0;
}
.szoneapp-floating-p:last-child{ margin-bottom: 0; }

.szoneapp-floating-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 12px 16px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);

  color: #fff;
  text-decoration: none;
  font-weight: 700;
  border-radius: 14px;
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
  transition: all 0.2s ease;
}

.szoneapp-floating-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.20);
}

.szoneapp-floating-btn.is-disabled{
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}

.szoneapp-floating-btn-icon{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.szoneapp-floating-btn-icon i,
.szoneapp-floating-btn-icon svg{
  display: block;
  width: 1em;
  height: 1em;
  font-size: 18px;
  line-height: 1;
  vertical-align: middle;
}

.szoneapp-floating-btn-text{
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
}

.szoneapp-floating-media{
  position: relative;
  min-height: 420px;
}

/* Collage */
.szoneapp-floating-collage{
  position: relative;
  width: 100%;
  height: 520px;
  display: grid;
  place-items: center;
  overflow: visible;
}

.szoneapp-floating-collage-inner{
  position: relative;
  width: 100%;
  height: 100%;
  transform: translate3d(0, var(--szoneapp-parallax-y, 0px), 0);
  will-change: transform;
}

/* Images base */
.szoneapp-floating-img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: 260px; /* default via control */
  aspect-ratio: 1 / 1.55; /* default via control */
}

.szoneapp-floating-img img{
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  display: block;
  vertical-align: middle;
}

.szoneapp-floating-img-inner{
  width: 100%;
  height: 100%;
  transform: translate3d(0,0,0);
  will-change: transform;
  overflow: hidden;
  border-radius: inherit;
}

/* Position rules:
   center: exactly centered
   left: touch center's left edge, then apply offsets
   right: touch center's right edge, then apply offsets
*/
.szoneapp-floating-img-center{
  z-index: 3;
  transform: translate3d(-50%, -50%, 0);
}

.szoneapp-floating-img-left{
  z-index: 2;
  opacity: .92;
  transform:
    translate3d(calc(-50% - 50%), -50%, 0)
    translate3d(var(--szoneapp-left-x, -40px), var(--szoneapp-left-y, 22px), 0);
}

.szoneapp-floating-img-right{
  z-index: 1;
  opacity: .92;
  transform:
    translate3d(calc(-50% + 50%), -50%, 0)
    translate3d(var(--szoneapp-right-x, 40px), var(--szoneapp-right-y, -10px), 0);
}

/* Idle float animations with CSS variables */
.szoneapp-floating-img-center .szoneapp-floating-img-inner{
  animation: szoneappFloatCenter var(--szoneapp-duration-center, 3.2s) ease-in-out infinite;
}

.szoneapp-floating-img-left .szoneapp-floating-img-inner{
  animation: szoneappFloatSide var(--szoneapp-duration-side, 2.8s) ease-in-out infinite;
}

.szoneapp-floating-img-right .szoneapp-floating-img-inner{
  animation: szoneappFloatSide var(--szoneapp-duration-side, 2.6s) ease-in-out infinite;
}

/* Idle float:
   side amplitude bigger, center smaller
*/
@keyframes szoneappFloatSide{
  0%   { transform: translate3d(0, 0px, 0); }
  50%  { transform: translate3d(0, calc(-1 * var(--szoneapp-float-side, 16px)), 0); }
  100% { transform: translate3d(0, 0px, 0); }
}

@keyframes szoneappFloatCenter{
  0%   { transform: translate3d(0, 0px, 0); }
  50%  { transform: translate3d(0, calc(-1 * var(--szoneapp-float-center, 7px)), 0); }
  100% { transform: translate3d(0, 0px, 0); }
}



/* ===== Entrance animation helpers ===== */
.szoneapp-sr-only{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0);
  white-space:nowrap; border:0;
}

/* ✅ 默认先隐藏：避免页面刚打开闪一下（JS 还没来得及加 class 时） */
.szoneapp-floating-section .szoneapp-floating-desc,
.szoneapp-floating-section .szoneapp-floating-btn,
.szoneapp-floating-section .szoneapp-floating-img{
  opacity: 0;
  will-change: transform, opacity;
}

/* 默认给文字一个轻位移（即使 JS 没加 ready，也不会先露出来） */
.szoneapp-floating-section .szoneapp-floating-desc,
.szoneapp-floating-section .szoneapp-floating-btn{
  transform: translate3d(0, 14px, 0);
}

/* 标题逐字母：每个字母初始隐藏，JS 用 WAAPI 播放并 fill:forwards */
.szoneapp-floating-title.szoneapp-title-split .szoneapp-title-letter{
  display: inline-block;
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  will-change: transform, opacity;
}

/* ✅ 动画完成后强制显示：防止 Elementor 重渲染 / 样式回跳 */
.szoneapp-floating-section.szoneapp-entrance-done .szoneapp-floating-desc,
.szoneapp-floating-section.szoneapp-entrance-done .szoneapp-floating-btn{
  opacity: 1;
  transform: none;
}

/* 图片：done 后恢复可见（注意左右图你原本是 0.92，不要被覆盖成 1） */
.szoneapp-floating-section.szoneapp-entrance-done .szoneapp-floating-img-center{
  opacity: 1;
}
.szoneapp-floating-section.szoneapp-entrance-done .szoneapp-floating-img-left,
.szoneapp-floating-section.szoneapp-entrance-done .szoneapp-floating-img-right{
  opacity: .92;
}

/* Reduced motion：确保直接显示，不做位移/动画 */
@media (prefers-reduced-motion: reduce){
  .szoneapp-floating-section .szoneapp-floating-desc,
  .szoneapp-floating-section .szoneapp-floating-btn,
  .szoneapp-floating-section .szoneapp-floating-img,
  .szoneapp-floating-title.szoneapp-title-split .szoneapp-title-letter{
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* Accessibility（保留你原本的，避免视差/浮动造成不适） */
@media (prefers-reduced-motion: reduce){
  .szoneapp-floating-collage-inner{ transform: none !important; }
  .szoneapp-floating-img-inner{ animation: none !important; transform: none !important; }
}



/* Responsive */
@media (max-width: 991px){
  .szoneapp-floating-grid{
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .szoneapp-floating-media{
    min-height: 380px;
  }
  .szoneapp-floating-collage{
    height: 460px;
  }
  .szoneapp-floating-title{
    font-size: 30px;
  }
}

@media (max-width: 767px){
  .szoneapp-floating-title{
    font-size: 24px;
  }
  .szoneapp-floating-desc{
    font-size: 14px;
  }
  .szoneapp-floating-btn{
    padding: 10px 14px;
    font-size: 14px;
  }
  .szoneapp-floating-btn-icon i,
  .szoneapp-floating-btn-icon svg{
    font-size: 16px;
  }
  .szoneapp-floating-section{
    overflow-x: clip;
  }
  @supports not (overflow: clip){
    .szoneapp-floating-section{
      overflow-x: hidden;
    }
  }
}