/* ==========================================================
   PARUDE — 공통 디자인 토큰
   색·폰트를 여기 한 곳에서 바꾸면 사이트 전체가 바뀝니다.
   예외 2곳(의도된 것):
     · index.html — 시간대/스크롤에 따라 색이 변해서 자체 변수 사용
     · photo.html — ARCHIVE는 흰 배경이라 색만 따로 덮어씀
   ========================================================== */
:root{
  /* 로고 — 파일로 분리해 한 번만 내려받고 캐시됩니다 */
  --logo:url('parude-logo-white.png');
  --wordmark:url('parude-wordmark-white.png');

  /* 색 */
  --bg:#060607;          /* 배경 */
  --bg-2:#0D0D0F;        /* 보조 배경 */
  --panel:#121215;       /* 카드/패널 */
  --ink:#F3F3F1;         /* 본문 글자 */
  --muted:#8B8B8E;       /* 흐린 글자 */
  --faint:#54545A;       /* 더 흐린 글자 */
  --cold:#94A7B4;        /* 포인트(스틸 블루) */
  --line:rgba(255,255,255,.11);
  --line-soft:rgba(255,255,255,.06);

  /* 폰트 */
  --display:'Archivo','Pretendard',sans-serif;  /* 제목·영문 */
  --mono:'Archivo','Pretendard',sans-serif;     /* 라벨·버튼 */
  --sans:'Pretendard','Archivo',sans-serif;     /* 한글 본문 */

  /* 모션 */
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ---- 스크롤 등장 모션 (전 페이지 공통) ---- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---- 페이지 전환 페이드 ---- */
.pagefade{position:fixed;inset:0;z-index:300;background:#060607;pointer-events:none;opacity:1;transition:opacity .45s ease}
.pagefade.clear{opacity:0}
.pagefade.out{opacity:1;pointer-events:all}

@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .pagefade{display:none}
}

  .skip{position:absolute;left:-9999px;top:0;z-index:400;background:#fff;color:#000;padding:12px 18px;font-size:13px}
  .skip:focus{left:12px;top:12px}
  .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- 상품 상태 배지 ---- */
.badge{position:absolute;top:12px;left:12px;z-index:3;
  font-family:'Archivo',sans-serif;font-weight:700;font-size:9.5px;letter-spacing:2px;
  padding:6px 10px;border:1px solid currentColor;background:rgba(6,6,7,.72);backdrop-filter:blur(4px)}
.badge-new{color:#fff}
.badge-soon{color:#94A7B4}
.badge-sold{color:#C77}
.pd-main .badge{top:16px;left:16px}