/* ══════════════════════════════════════════════════════════════
   메인 화면 움직임 — 경기광주역 롯데캐슬 시그니처

   한 화면에 한 덩어리씩 넘어간다.
     1) 비주얼    조감도 두 장이 7초마다 바뀌며 카피가 떠오른다
     2) POINT 5   다섯 장이 배경으로 넘어간다
     3) 캐슬서비스 사진 카드 다섯 장
     4) 시간표    강남·판교까지 걸리는 시간 (숫자가 올라간다)

   스크롤 스냅은 쓰지 않는다. 예전 현장에서 붙여 봤더니
   푸터까지 내려가지지 않고 위로 되튕겼다.
   한 화면씩 보이는 느낌은 min-height:100vh 만으로 충분하다.
   ══════════════════════════════════════════════════════════════ */

.lc{--lc-nav:78px}

.lc__sec{position:relative;min-height:100vh;display:flex;align-items:center;
  overflow:hidden;color:#fff}

/* ── 1) 비주얼 ─────────────────────────────── */
.lc__slides{position:absolute;inset:0;z-index:0}
.lc__slide{position:absolute;inset:0;background:center/cover no-repeat;
  opacity:0;transform:scale(1.07);
  transition:opacity 1.5s ease,transform 8s linear}
.lc__slide.is-on{opacity:1;transform:scale(1)}

.lc__sec--visual::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(104deg,
    rgba(4,24,15,.70) 0%, rgba(4,24,15,.34) 48%, rgba(4,24,15,.05) 100%)}

.lc__in{position:relative;z-index:2;width:100%;max-width:1200px;
  margin:0 auto;padding:0 56px}
@media (max-width:1080px){ .lc__in{padding:0 22px} }

/* 꼬리표 — 금색 선 하나가 옆으로 늘어나며 글이 따라 나온다 */
.lc__tag{display:inline-flex;align-items:center;gap:12px;margin:0 0 22px;
  font-size:13px;font-weight:600;letter-spacing:.12em;
  color:var(--wine-soft);text-transform:uppercase}
.lc__tag::before{content:"";display:block;width:0;height:1px;
  background:var(--wine-soft);transition:width .9s ease .25s}
.lc__sec--visual.is-in .lc__tag::before{width:52px}
.lc__tag{opacity:0;transform:translateY(10px);
  transition:opacity .7s ease,transform .7s ease}
.lc__sec--visual.is-in .lc__tag{opacity:1;transform:none}

.lc__h1{margin:0;font-family:var(--font-serif);
  font-size:clamp(34px,5.4vw,78px);font-weight:700;line-height:1.14;
  letter-spacing:-.04em;text-shadow:0 4px 26px rgba(0,0,0,.4)}
/* 글자 하나씩 떠오르는 연출은 feel.css 의 [data-ani] 가 맡는다.
   (한강 푸르지오 때 쓴 것과 같은 방식 — 여기서 따로 흐리게 만들지 않는다) */
.lc__h1 b{color:var(--wine-soft);font-weight:700}

.lc__lead{margin:24px 0 0;max-width:560px;
  font-size:clamp(14.5px,1.5vw,18px);line-height:1.8;color:rgba(255,255,255,.86)}

/* 숫자 넷 */
.lc__nums{display:flex;flex-wrap:wrap;gap:38px;margin:44px 0 0;padding:0;list-style:none}
.lc__nums li{opacity:0;transform:translateY(18px);
  transition:opacity .8s ease,transform .8s ease}
.lc__sec--visual.is-in .lc__nums li:nth-child(1){opacity:1;transform:none;transition-delay:.95s}
.lc__sec--visual.is-in .lc__nums li:nth-child(2){opacity:1;transform:none;transition-delay:1.08s}
.lc__sec--visual.is-in .lc__nums li:nth-child(3){opacity:1;transform:none;transition-delay:1.21s}
.lc__sec--visual.is-in .lc__nums li:nth-child(4){opacity:1;transform:none;transition-delay:1.34s}
.lc__nums em{display:block;font-style:normal;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;color:rgba(255,255,255,.58);margin-bottom:7px}
.lc__nums b{font-size:clamp(24px,2.9vw,40px);font-weight:800;letter-spacing:-.03em;
  line-height:1;color:#fff}
.lc__nums small{display:block;margin-top:6px;font-size:12.5px;
  color:rgba(255,255,255,.7)}
@media (max-width:640px){ .lc__nums{gap:26px} }

.lc__note{position:absolute;left:0;right:0;bottom:22px;z-index:2;margin:0;
  padding:0 56px;font-size:11.5px;line-height:1.6;color:rgba(255,255,255,.55)}
@media (max-width:1080px){ .lc__note{padding:0 22px;font-size:10.5px;bottom:14px} }

/* 슬라이드 표시 점 */
.lc__dots{position:absolute;left:56px;bottom:76px;z-index:3;display:flex;gap:10px}
.lc__dots button{width:36px;height:3px;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.3);transition:background .3s}
.lc__dots button.is-on{background:var(--wine-soft)}
@media (max-width:1080px){ .lc__dots{left:22px;bottom:62px} }

/* 아래로 내려가라는 표시 */
.lc__cue{position:absolute;right:56px;bottom:76px;z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  font-size:10.5px;letter-spacing:.2em;color:rgba(255,255,255,.6)}
.lc__cue i{display:block;width:1px;height:52px;background:rgba(255,255,255,.25);
  position:relative;overflow:hidden}
.lc__cue i::after{content:"";position:absolute;left:0;top:-52px;width:1px;height:52px;
  background:var(--wine-soft);animation:lcDrop 2.2s cubic-bezier(.6,0,.3,1) infinite}
@keyframes lcDrop{0%{transform:translateY(0)}60%,100%{transform:translateY(104px)}}
@media (max-width:1080px){ .lc__cue{display:none} }

/* ── 2) POINT ──────────────────────────────── */
.lc__sec--pt::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(4,24,15,.34) 0%,rgba(4,24,15,.78) 100%)}
.lc__ptitle{position:absolute;left:0;right:0;top:calc(var(--lc-nav) + 44px);z-index:2;
  text-align:center;margin:0;
  font-size:clamp(26px,3.8vw,50px);font-weight:800;letter-spacing:.08em;
  color:rgba(255,255,255,.9)}
.lc__ptitle small{display:block;margin-top:10px;font-size:12.5px;font-weight:500;
  letter-spacing:.16em;color:var(--wine-soft)}

.lc__pitem{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 56px;
  opacity:0;transform:translateY(20px);
  transition:opacity .7s ease,transform .7s ease}
.lc__pitem.is-on{opacity:1;transform:none}
@media (max-width:1080px){ .lc__pitem{padding:0 22px} }
.lc__pno{margin:0 0 16px;font-size:clamp(36px,4.4vw,62px);font-weight:800;
  line-height:1;color:var(--wine-soft);letter-spacing:-.03em}
.lc__ph{margin:0 0 16px;font-size:clamp(22px,2.7vw,38px);font-weight:700;
  letter-spacing:-.035em}
.lc__pp{margin:0;font-size:clamp(14px,1.4vw,17px);line-height:1.85;
  color:rgba(255,255,255,.82)}

.lc__pdots{position:absolute;left:0;right:0;bottom:58px;z-index:3;
  display:flex;justify-content:center;gap:9px}
.lc__pdots button{width:9px;height:9px;border:0;padding:0;border-radius:50%;
  background:rgba(255,255,255,.3);cursor:pointer;transition:background .3s,transform .3s}
.lc__pdots button.is-on{background:var(--wine-soft);transform:scale(1.3)}

/* ── 3) 캐슬서비스 ─────────────────────────── */
.lc__sec--svc{background:var(--bg);color:var(--ink);min-height:0;display:block}
.lc__svc{max-width:1200px;margin:0 auto;padding:110px 56px 100px}
@media (max-width:1080px){ .lc__svc{padding:80px 22px 70px} }
.lc__shead{text-align:center;margin:0 0 52px}
.lc__shead em{display:block;font-style:normal;font-size:11.5px;font-weight:700;
  letter-spacing:.24em;color:var(--wine);margin-bottom:14px}
.lc__shead h2{margin:0;font-family:var(--font-serif);
  font-size:clamp(26px,3.2vw,42px);font-weight:700;letter-spacing:-.035em;
  color:var(--ink)}
.lc__shead p{margin:16px 0 0;font-size:15px;line-height:1.8;color:var(--ink-soft)}

.lc__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:900px){ .lc__cards{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .lc__cards{grid-template-columns:1fr} }
.lc__card{background:#fff;border:1px solid var(--line);overflow:hidden;
  opacity:0;transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease,box-shadow .3s ease}
.lc__sec--svc.is-in .lc__card{opacity:1;transform:none}
.lc__sec--svc.is-in .lc__card:nth-child(1){transition-delay:.05s}
.lc__sec--svc.is-in .lc__card:nth-child(2){transition-delay:.15s}
.lc__sec--svc.is-in .lc__card:nth-child(3){transition-delay:.25s}
.lc__sec--svc.is-in .lc__card:nth-child(4){transition-delay:.35s}
.lc__sec--svc.is-in .lc__card:nth-child(5){transition-delay:.45s}
.lc__card:hover{box-shadow:0 14px 40px rgba(7,41,32,.13)}
.lc__card figure{margin:0;overflow:hidden}
.lc__card img{width:100%;height:190px;object-fit:cover;display:block;
  transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.lc__card:hover img{transform:scale(1.06)}
.lc__cbody{padding:22px 24px 26px}
.lc__cbody em{display:block;font-style:normal;font-size:10.5px;font-weight:700;
  letter-spacing:.2em;color:var(--wine);margin-bottom:10px}
.lc__cbody h3{margin:0 0 12px;font-size:17.5px;font-weight:700;letter-spacing:-.03em;
  color:var(--ink)}
.lc__cbody p{margin:0;font-size:13.5px;line-height:1.78;color:var(--ink-soft)}

/* ── 4) 시간표 ─────────────────────────────── */
.lc__sec--time{background:var(--navy);color:#fff;min-height:0;display:block}
.lc__time{max-width:1200px;margin:0 auto;padding:104px 56px 96px}
@media (max-width:1080px){ .lc__time{padding:76px 22px 70px} }
.lc__time .lc__shead h2{color:#fff}
.lc__time .lc__shead p{color:rgba(255,255,255,.72)}
.lc__time .lc__shead em{color:var(--wine-soft)}

.lc__trips{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:8px}
@media (max-width:760px){ .lc__trips{grid-template-columns:1fr} }
.lc__trip{border:1px solid rgba(255,255,255,.16);padding:32px 30px;
  opacity:0;transform:translateY(20px);
  transition:opacity .7s ease,transform .7s ease}
.lc__sec--time.is-in .lc__trip{opacity:1;transform:none}
.lc__sec--time.is-in .lc__trip:nth-child(2){transition-delay:.12s}
.lc__sec--time.is-in .lc__trip:nth-child(3){transition-delay:.24s}
.lc__sec--time.is-in .lc__trip:nth-child(4){transition-delay:.36s}
.lc__trip em{display:block;font-style:normal;font-size:12px;font-weight:600;
  letter-spacing:.14em;color:var(--wine-soft);margin-bottom:16px}
.lc__trip b{font-size:clamp(30px,3.6vw,48px);font-weight:800;letter-spacing:-.04em;
  line-height:1}
.lc__trip b i{font-style:normal;font-size:.46em;font-weight:600;margin-left:6px;
  letter-spacing:0;color:rgba(255,255,255,.72)}
.lc__trip p{margin:16px 0 0;font-size:13.5px;line-height:1.75;
  color:rgba(255,255,255,.68)}

.lc__tnote{margin:34px 0 0;font-size:11.5px;line-height:1.7;
  color:rgba(255,255,255,.44)}