/*------------------------------------------------------
· apmedia Ver 2.0
· Type : intro.css
· 인트로 오버레이 보조 스타일 — module/intro.php 에서만 로드한다.
  (인트로가 뜨는 화면에서만 필요한 규칙이므로 전역 CSS 를 늘리지 않는다)
---------------------------------------------------------*/

/* 고정 스킵 버튼 — 마우스 추종 스킵은 hover 기기 전용이라 터치에서 안 보인다.
   진행바(.apmedia-intro-progress)와 같은 우측 끝선에 맞춰, 바 바로 위에 정원 화살표로 띄운다.
   위치 기준: 좌우 --intro-edge · 바닥 = 진행바 bottom + 바 위 여백. */
.apmedia-intro-skipfix {
    position: fixed;
    right: var(--intro-edge);
    bottom: calc(var(--intro-progress-bottom) + var(--intro-skipfix-gap));
    z-index: 3;
    display: none;
    align-items: center;
    justify-content: center;
    width: var(--intro-skipfix-size);
    height: var(--intro-skipfix-size);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--intro-skipfix-bg);
    color: var(--color-white);
    cursor: pointer;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: background var(--transition-base);
}

.apmedia-intro-skipfix svg {
    width: var(--intro-skipfix-ic);
    height: var(--intro-skipfix-ic);
}

/* 노출 조건은 화면 폭이 아니라 디바이스 — 모바일·태블릿(터치 기기)에서만 띄운다.
   html.is-touch 는 common.js(initTouchDeviceFlag)가 부여한다. */
html.is-touch .apmedia-intro-skipfix.is-active { display: inline-flex; }

/* 마우스 추종 스킵 원(.apmedia-intro-skip) — 터치 기기에서는 하단 고정 스킵이 대신하므로 숨긴다.
   JS 게이트(main.js)와 함께 이중 차단. any-pointer:coarse = 터치스크린이 있으면 참. */
@media (hover: none), (pointer: coarse), (any-pointer: coarse) {
    .apmedia-intro-skip { display: none; }
}

/* 카피 등장 애니메이션 리플로우 보정
   letter-spacing(-0.5em→0.04em) 펼침 중 텍스트가 1→2줄로 늘면 카피가 위아래로 밀린다.
   좁은 화면(2줄 필요 구간)에서 컨테이너를 미리 2줄 높이로 예약해 첫 줄 위치를 고정한다.
   → 애니메이션은 그대로 유지, 밀림만 제거. 데스크탑(1줄)은 여유높이가 생겨 위로 뜨므로 제외. */
@media (max-width: 48rem) {
    .apmedia-intro-copy { min-height: calc(2 * var(--lh-tight) * 1em); }
}