/* JOB CONNECT v6.9.9 — Item-level Sequential Reveal + Calm Footer
   그리드/목록을 통째로 관찰하지 않고 항목 하나하나가 실제로 화면에 들어오는
   순간에만 부드럽게 등장하도록 처리한다. 이렇게 하면 (1) 목록이 길어도 스크롤을
   내리는 순서 그대로 자연스럽게 나타나고, (2) 뒤쪽 항목들이 한꺼번에 튀어나오는
   끊김 없이 매끄럽게 이어진다. 푸터 정보영역은 별도의 차분한 페이드 방식 유지. */

/* 페이지 자체가 열릴 때 아주 약하게 밝아지는 느낌 */
body:not(.admin-shell){
  animation:jc-page-soft-open .62s cubic-bezier(.22,1,.36,1) both;
}
@keyframes jc-page-soft-open{
  from{opacity:.86}
  to{opacity:1}
}

/* 기존 reveal도 조금 더 느리고 부드럽게 */
.motion-ready [data-reveal]{
  transform:translate3d(0,14px,0);
  transition-duration:.9s;
  transition-timing-function:cubic-bezier(.22,1,.36,1);
}
.motion-ready [data-reveal="soft"]{transform:translate3d(0,9px,0)}
.motion-ready body[data-page="home"] .hero-copy.is-intro-visible > *{
  transition-duration:.9s;
  transition-timing-function:cubic-bezier(.22,1,.36,1);
}
.site-header{
  transition-duration:.38s;
}

/* JS가 준비된 뒤, 항목은 화면에 들어오기 전까지 이 상태로 대기한다.
   (그룹 단위 게이트 없이 항목 자체 클래스만으로 제어 — 그룹이 아무리 길어도
   각 항목이 실제로 보이는 시점에만 애니메이션이 시작된다) */
.stagger-motion-ready .agency-stagger-item{
  --stagger-x:0px;
  --stagger-delay:0ms;
  opacity:0;
  translate:var(--stagger-x) 30px;
  scale:.98;
  filter:blur(2.5px);
  transform-origin:50% 80%;
  will-change:opacity,translate,scale,filter;
}

/* 동적 카드가 삽입될 때 한 프레임 번쩍임 방지 */
.stagger-motion-ready .agency-stagger-group > :is(.job-card,.job-row,.photo-card,.guide-card,.talent-card,.gallery-card,.quick,.qna-example-card,.qna-list-row,.about-point,.stat):not(.agency-stagger-item){
  opacity:0;
}

/* 좌우 출발은 거의 느껴지지 않을 만큼만 */
.stagger-motion-ready .agency-stagger-item:nth-child(odd){--stagger-x:-4px}
.stagger-motion-ready .agency-stagger-item:nth-child(even){--stagger-x:4px}

/* 튕기지 않고 천천히 제자리로 안착 — 항목이 화면에 들어와 is-item-visible이
   붙는 순간에만 시작된다 */
.stagger-motion-ready .agency-stagger-item.is-item-visible{
  animation:agency-card-soft-place 1.02s cubic-bezier(.22,1,.36,1) both;
  animation-delay:var(--stagger-delay);
}
@keyframes agency-card-soft-place{
  0%{opacity:0;translate:var(--stagger-x) 30px;scale:.98;filter:blur(2.5px)}
  52%{opacity:.9;filter:blur(.4px)}
  100%{opacity:1;translate:0 0;scale:1;filter:blur(0)}
}

/* 그룹 자체 reveal과 충돌 방지 */
.stagger-motion-ready .agency-stagger-group[data-reveal]{
  opacity:1!important;
  transform:none!important;
  transition:none!important;
}

/* 상세/폼 영역은 더 차분하게 */
.stagger-motion-ready .agency-stagger-group.agency-stagger-flow > .agency-stagger-item{
  translate:0 20px;
  scale:.992;
  filter:blur(1.5px);
}
.stagger-motion-ready .agency-stagger-group.agency-stagger-flow > .agency-stagger-item:nth-child(odd),
.stagger-motion-ready .agency-stagger-group.agency-stagger-flow > .agency-stagger-item:nth-child(even){--stagger-x:0px}
.stagger-motion-ready .agency-stagger-group.agency-stagger-flow > .agency-stagger-item.is-item-visible{
  animation-name:agency-flow-soft-place;
  animation-duration:.94s;
}
@keyframes agency-flow-soft-place{
  0%{opacity:0;translate:0 20px;scale:.992;filter:blur(1.5px)}
  100%{opacity:1;translate:0 0;scale:1;filter:blur(0)}
}

/* --------------------------------------------------------------------------
   Calm Footer — 카드처럼 떠오르지 않고 정보가 천천히 정리되어 나타나는 방식
   -------------------------------------------------------------------------- */
.footer{
  overflow:hidden;
}
.footer:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 18%,rgba(69,137,225,.09),transparent 31%),
    radial-gradient(circle at 84% 12%,rgba(71,125,196,.055),transparent 26%);
}
.footer > .container{position:relative;z-index:1}

.footer-calm-ready .footer-grid > div{
  opacity:0;
  transform:translate3d(0,8px,0);
  transition:
    opacity 1.08s cubic-bezier(.22,1,.36,1),
    transform 1.08s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--footer-delay,0ms);
}
.footer-calm-ready.is-footer-visible .footer-grid > div{
  opacity:1;
  transform:translate3d(0,0,0);
}

/* 푸터 제목은 선명도만 천천히 올라오게 */
.footer-calm-ready .footer-grid h3{
  transition:color .7s ease;
}
.footer-calm-ready.is-footer-visible .footer-grid h3{color:#fff}

/* 아래 사업자정보는 하나의 정보판처럼 한 번에 천천히 등장 */
.footer-calm-ready .footer-bottom{
  position:relative;
  border-top:0!important;
  opacity:0;
  transform:none;
  transition:opacity 1.15s ease .62s;
}
.footer-calm-ready.is-footer-visible .footer-bottom{opacity:1}
.footer-calm-ready .footer-bottom:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:1px;
  background:rgba(255,255,255,.16);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 1.35s cubic-bezier(.22,1,.36,1) .34s;
}
.footer-calm-ready.is-footer-visible .footer-bottom:before{transform:scaleX(1)}

/* 링크는 위로 튀지 않고 밝기만 변함 */
.footer .footer-grid a,
.footer .footer-legal-links a{
  transform:none!important;
  transition:color .32s ease,opacity .32s ease!important;
}
.footer .footer-grid a:hover,
.footer .footer-legal-links a:hover{
  color:#fff;
  opacity:1;
}

@media(max-width:700px){
  body:not(.admin-shell){animation-duration:.48s}
  .stagger-motion-ready .agency-stagger-item{
    translate:0 22px;
    scale:.988;
    filter:blur(1.8px);
  }
  .stagger-motion-ready .agency-stagger-item:nth-child(odd),
  .stagger-motion-ready .agency-stagger-item:nth-child(even){--stagger-x:0px}
  @keyframes agency-card-soft-place{
    0%{opacity:0;translate:0 22px;scale:.988;filter:blur(1.8px)}
    100%{opacity:1;translate:0 0;scale:1;filter:blur(0)}
  }
  .footer-calm-ready .footer-grid > div{
    transform:translate3d(0,5px,0);
    transition-duration:.88s;
  }
}

@media(prefers-reduced-motion:reduce){
  body:not(.admin-shell){animation:none!important}
  .stagger-motion-ready .agency-stagger-item,
  .stagger-motion-ready .agency-stagger-item.is-item-visible,
  .footer-calm-ready .footer-grid > div,
  .footer-calm-ready .footer-bottom{
    opacity:1!important;
    translate:0 0!important;
    transform:none!important;
    scale:1!important;
    filter:none!important;
    animation:none!important;
    transition:none!important;
  }
  .footer-calm-ready .footer-bottom:before{transform:scaleX(1)!important;transition:none!important}
}