.hero-motion-wrap{display:flex;flex-direction:column;width:100%;min-width:0}
.quality-motion{position:relative;min-width:0;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden}
.quality-motion iframe{width:100%!important;height:100%!important;aspect-ratio:16/9!important;border:0;display:block;border-radius:0;pointer-events:none}
.quality-motion .motion-sequence-note,.quality-motion .motion-arrow{display:none!important}
.quality-motion .motion-toggle{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;border-radius:0;background:transparent;padding:0;display:grid;place-items:center;cursor:pointer;touch-action:pan-y;box-shadow:none}
.motion-toggle-symbol{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#fffdf3ee;color:#36543a;box-shadow:0 4px 20px #263a3026;font:700 25px/1 sans-serif;opacity:0;transform:scale(.92);transition:opacity .18s,transform .18s;pointer-events:none}
.quality-motion.motion-controls-visible .motion-toggle-symbol{opacity:1;transform:scale(1)}
.motion-toggle:focus-visible{outline:3px solid #52733b;outline-offset:-4px}
.quality-motion .motion-full{z-index:4;opacity:0;transition:opacity .18s}
.quality-motion.motion-controls-visible .motion-full{opacity:1}
.quality-motion .motion-bar{position:absolute;bottom:0;left:0;right:0;height:6px;background:rgba(0,0,0,0.35);z-index:20;pointer-events:auto;cursor:pointer;touch-action:none;opacity:0;transition:opacity .18s,height .18s}
.quality-motion .motion-bar::before{content:'';position:absolute;inset:-16px 0;z-index:21;cursor:pointer;touch-action:none}
.quality-motion.motion-controls-visible .motion-bar,.quality-motion .motion-bar.is-seeking{opacity:1;height:8px}
.quality-motion .motion-bar-fill{height:100%;width:0%;background:#52733b;box-shadow:0 0 6px rgba(82,115,59,0.6);position:relative;pointer-events:none}
.quality-motion .motion-bar-thumb{position:absolute;right:-7px;top:50%;transform:translateY(-50%) scale(0);width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,0.45);transition:transform .12s cubic-bezier(0.16,1,0.3,1);pointer-events:none}
.quality-motion.motion-controls-visible .motion-bar-thumb,.quality-motion .motion-bar.is-seeking .motion-bar-thumb{transform:translateY(-50%) scale(1)}
.quality-motion .motion-time-badge{position:absolute;bottom:10px;right:12px;background:rgba(18,22,18,0.78);color:#fff;font-family:Pretendard,sans-serif;font-size:12px;font-weight:600;padding:3px 8px;border-radius:4px;z-index:15;opacity:0;pointer-events:none;transition:opacity .18s;font-variant-numeric:tabular-nums;backdrop-filter:blur(4px)}
.quality-motion.motion-controls-visible .motion-time-badge{opacity:1}
.motion-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.motion-sequence .motion-dots{display:flex;justify-content:center;gap:8px;flex-wrap:nowrap;margin:8px auto 0;width:100%;height:28px}
.motion-sequence .motion-dots button{position:relative;display:grid;place-items:center;width:44px;height:28px;min-height:28px;border:0;padding:0;border-radius:0;background:transparent;cursor:pointer;font-size:0}
.motion-sequence .motion-dots button:after{content:'';display:block;width:34px;height:4px;border-radius:3px;background:#cbd2c2;transform:none;transition:background .15s}
.motion-sequence .motion-dots button[aria-selected=true]{background:transparent;color:inherit}
.motion-sequence .motion-dots button[aria-selected=true]:after{background:#52733b;transform:none}
#hero.motion-sequence{padding:30px 0 24px!important}
#hero.motion-sequence .wrap{max-width:1320px;padding:0 32px}
#hero.motion-sequence .hero-panel{display:grid;grid-template-columns:minmax(0,.38fr) minmax(0,.62fr);gap:24px;align-items:center;min-height:440px}
#hero.motion-sequence .hero-panel[hidden],.orev-sequence .hero-panel[hidden]{display:none!important}
#hero.motion-sequence .hero-copy{text-align:left;min-height:440px;display:flex;flex-direction:column;justify-content:center}
#hero.motion-sequence .eyebrow{display:block;font-size:26px!important;line-height:1.4!important;font-weight:700!important;margin-bottom:8px!important;background:transparent;padding:0}
#hero.motion-sequence h1{font-size:clamp(26px,2.6vw,36px)!important;line-height:1.38!important;margin:0 0 9px!important}
#hero.motion-sequence .lead{font-size:16px!important;line-height:1.6!important}
#hero.motion-sequence .hero-actions{justify-content:flex-start}
#hero.motion-sequence .motion-dots{width:calc((100% - 24px)*.62);margin:8px 0 0 auto}
.motion-detail.promo-hero,.motion-detail.showcase-section{padding:24px 0 28px!important}
.motion-detail .wrap{max-width:1240px}
.motion-detail .hero-panel{display:block!important}
.motion-detail .hero-copy,.motion-detail .sec-header{text-align:center;max-width:none;margin:0 0 18px!important;min-height:0!important}
.motion-detail .eyebrow{display:block;font-size:26px!important;margin-bottom:8px;background:transparent;padding:0}
.motion-detail h1,.motion-detail .sec-header h1{font-size:clamp(26px,2.6vw,36px)!important;line-height:1.38!important;max-width:none;margin:0 0 9px!important}
.motion-detail .lead,.motion-detail .sec-header p{font-size:16px!important;line-height:1.6!important;max-width:none;margin:0 auto!important}
.motion-detail .quality-motion,.motion-detail .orev-sequence{max-width:min(1120px,calc((100svh - 270px)*16/9));margin:0 auto!important}
.motion-detail .orev-sequence .quality-motion{max-width:100%}
.motion-detail .hero-actions{margin:18px auto 0!important;justify-content:center}
.tools-motion{max-width:none;margin:0 auto 20px!important}
.tools-intro{max-width:1000px;margin:18px auto 28px;text-align:center;line-height:1.8;color:var(--sub)}
.orev-real-screen{padding:35px 0!important}.orev-real-screen .orev-hero-screen{max-width:1060px;margin:auto}
.quality-motion:fullscreen,.quality-motion.motion-overlay{width:100vw!important;height:100dvh!important;max-width:none!important;aspect-ratio:auto;background:#fefdfc;display:grid;place-items:center;padding:0;overflow:hidden}
.quality-motion:fullscreen iframe,.quality-motion.motion-overlay iframe{width:min(100vw,calc(100dvh*16/9))!important;height:auto!important;max-height:100dvh;aspect-ratio:16/9!important}
@media(max-width:850px){
  #hero.motion-sequence .wrap{padding:0 20px;max-width:100%}
  #hero.motion-sequence .hero-panel{grid-template-columns:1fr;gap:18px;min-height:auto}
  #hero.motion-sequence .hero-copy{text-align:center;min-height:auto!important;justify-content:flex-start;margin-bottom:14px!important}
  #hero.motion-sequence .eyebrow,
  .motion-detail .eyebrow,
  .promo-hero .eyebrow{font-size:19px!important;line-height:1.4!important;margin-bottom:8px!important;display:block!important}
  #hero.motion-sequence h1{font-size:clamp(26px,2.6vw,36px)!important;line-height:1.38!important;letter-spacing:-0.03em!important;margin:0 auto 9px!important}
  #hero.motion-sequence h1 br{display:inline!important}
  #hero.motion-sequence .lead{font-size:15px!important;line-height:1.6!important;max-width:520px!important;margin:0 auto!important}
  /* 모바일 히어로 버튼 2개 1줄 가로 배치 */
  #hero.motion-sequence .hero-actions{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:390px!important;
    margin:14px auto 0!important;
  }
  #hero.motion-sequence .hero-actions .btn{
    width:auto!important;
    flex:1 1 0!important;
    min-height:42px!important;
    padding:10px 6px!important;
    font-size:14px!important;
    white-space:nowrap!important;
    letter-spacing:-0.03em!important;
    box-sizing:border-box!important;
    text-align:center!important;
  }
  #hero.motion-sequence .motion-dots{width:100%}
  .motion-detail .quality-motion,.motion-detail .orev-sequence{max-width:100%}
  /* 모바일 동영상 컨트롤: 평상시 숨김(opacity: 0, scale: 0), 터치/조작 시에만 노출 */
  .quality-motion .motion-bar{opacity:0!important;height:8px!important;z-index:50!important;touch-action:none!important;transition:opacity .18s,height .18s!important}
  .quality-motion.motion-controls-visible .motion-bar,.quality-motion .motion-bar.is-seeking{opacity:1!important;height:10px!important}
  .quality-motion .motion-bar-thumb{transform:translateY(-50%) scale(0)!important;width:18px!important;height:18px!important;right:-9px!important;border:2px solid #52733b!important;background:#ffffff!important;box-shadow:0 2px 8px rgba(0,0,0,0.45)!important;transition:transform .12s cubic-bezier(0.16,1,0.3,1)!important}
  .quality-motion.motion-controls-visible .motion-bar-thumb{transform:translateY(-50%) scale(1)!important}
  .quality-motion .motion-bar.is-seeking .motion-bar-thumb{transform:translateY(-50%) scale(1.25)!important}
  .quality-motion .motion-bar::before{inset:-32px 0 -12px 0!important;z-index:51!important;touch-action:none!important}
  .quality-motion.motion-controls-visible .motion-time-badge,.quality-motion .motion-bar.is-seeking ~ .motion-time-badge{opacity:1!important;z-index:45!important}
  .motion-detail.promo-hero,.motion-detail.showcase-section{padding:24px 0 28px!important}
  .motion-detail .hero-copy,.motion-detail .sec-header{margin-bottom:16px!important}
  .motion-detail .lead,.motion-detail .sec-header p{font-size:15px!important}
}
@media(hover:none){.motion-toggle-symbol{opacity:0}.quality-motion.motion-controls-visible .motion-toggle-symbol{opacity:1}}
@media(prefers-reduced-motion:reduce){.motion-toggle-symbol{transition:none}}