/* ============================================================
   about-tour.css — 둘러보기 페이지 (갤러리 + 라이트박스)
   ★ 정본 about-tour-full.html <style> 에서 기계 추출(§0-1). 값을 바꾸지 않았다.
   ⚠ 진입 연출의 시작 조건만 `.is-js` 로 옮겼다(§0-5).
   ============================================================ */
.wf-11 { aspect-ratio:1/1; }
.t1-hero { padding:clamp(88px,70px + 3vw,140px) 24px clamp(12px,10px + 0.3vw,16px);text-align:center; }
.t1-title { color:#111;font-size:clamp(32px,25px + 2vw,58px);line-height:1.18;letter-spacing:-0.02em;font-weight:400; }
.t1-title strong { font-weight:700; }
.t1-gal { padding:clamp(24px,20px + 0.6vw,34px) 0 clamp(72px,56px + 2vw,110px);background:#FBFAF8; }
.t1-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:14px;width:100vw;margin-left:calc(50% - 50vw);padding:0 14px; }
.t1-cell { display:block;width:100%;padding:0;text-align:inherit;background:none;border:none;cursor:pointer; }
.t1-cell:focus,.t1-cell:focus-visible { outline:none; }
.t1-cell .wf-img { transition:opacity .2s; }
.t1-cell:hover .wf-img { opacity:0.8; }
.t1-hint { margin-top:18px;font-size:12px;color:#9a9a9a;letter-spacing:0.04em;text-align:center; }

.t1-lb { position:fixed;inset:0;z-index:200;background:rgba(17,17,17,0.94);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 24px 28px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility .32s; }
.t1-lb.open { opacity:1;visibility:visible;pointer-events:auto; }
.t1-lb .t1-stage { transform:scale(0.95);transition:transform .38s cubic-bezier(0.2,0.7,0.3,1); }
.t1-lb.open .t1-stage { transform:none; }
.t1-lb-close { position:absolute;top:16px;right:20px;color:rgba(255,255,255,0.7);font-size:28px;line-height:1;padding:8px;z-index:210;background:none;border:none;cursor:pointer; }
.t1-lb-close:hover { color:#fff; }
.t1-stage { position:relative;width:min(70vw, calc(72vh * 1.7778)); }
.t1-view { overflow:hidden;width:100%; }
.t1-track { display:flex;transition:transform .45s ease; }
.t1-slide { flex:0 0 100%;min-width:0;display:flex;align-items:center;justify-content:center;padding:0 8px; }
.t1-slide .wf-img { background:#2E2E2E;color:rgba(255,255,255,0.4); }
.t1-slide .wf-h { width:100%; }
.t1-arrow { position:absolute;top:50%;transform:translateY(-50%);width:72px;height:120px;display:flex;align-items:center;justify-content:center;padding:0;background:none;border:none;cursor:pointer;font-size:0;z-index:210; }
.t1-arrow::before { content:'';display:block;width:58px;height:58px;border:solid rgba(255,255,255,0.85);border-width:0;transition:border-color .2s; }
.t1-arrow:hover::before { border-color:#fff; }
.t1-prev { left:-104px; }
.t1-next { right:-104px; }
.t1-prev::before { border-left-width:1px;border-bottom-width:1px;transform:rotate(45deg); }
.t1-next::before { border-top-width:1px;border-right-width:1px;transform:rotate(45deg); }
.t1-thumbs { display:flex;gap:8px;margin-top:22px;justify-content:center;flex-wrap:wrap; }
.t1-thumb { width:54px;height:54px;background:#2E2E2E;color:rgba(255,255,255,0.45);font-size:10px;display:flex;align-items:center;justify-content:center;opacity:0.5;transition:opacity .2s;border:none;padding:0;cursor:pointer; }
.t1-thumb:hover { opacity:0.85; }
.t1-thumb.on { opacity:1; }

@media (max-width:900px) { .t1-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:768px) {
  .t1-hero { padding-top:88px; }
  .t1-grid { grid-template-columns:1fr; }
}

/* ── 진입 연출 — 시작 조건만 .is-js. 딜레이는 정본 그대로 ── */
.t1-gal.is-js .t1-grid .t1-cell { animation:rvFade 1.05s ease both; }
.t1-gal.is-js .t1-grid .t1-cell:nth-child(5n+1) { animation-delay:0.39s; }
.t1-gal.is-js .t1-grid .t1-cell:nth-child(5n+2) { animation-delay:0.49s; }
.t1-gal.is-js .t1-grid .t1-cell:nth-child(5n+3) { animation-delay:0.59s; }
.t1-gal.is-js .t1-grid .t1-cell:nth-child(5n+4) { animation-delay:0.7s; }
.t1-gal.is-js .t1-grid .t1-cell:nth-child(5n)   { animation-delay:0.8s; }
.t1-gal.is-js .t1-hint { animation:rvFade 1.05s ease 0.98s both; }
.t1-hero.is-js .t1-title { animation:aboutRise 1.1s cubic-bezier(0.22,0.61,0.36,1) .25s both; }
@media (prefers-reduced-motion: reduce) {
  .t1-gal.is-js .t1-cell, .t1-gal.is-js .t1-hint, .t1-hero.is-js .t1-title { animation:none;opacity:1; }
}
