/**
 * 포트폴리오 전역 CSS
 * - 기본·한글: Pretendard
 * - 영문만: Paperozi (페이퍼로지) — 작은 글 3 / 중간 5 / 큰 글 7
 */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

@font-face {
  font-family: "Paperozi";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-3Light.woff2") format("woff2");
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Paperozi";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-5Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Paperozi";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/2408-3@1.0/Paperlogy-7Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  --font-body: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
    "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  --font-en: "Paperozi", sans-serif;
  --color-primary-border-hover: rgba(195, 192, 255, 0.45);
}

html,
body,
input,
textarea,
button,
select,
label,
p,
li,
h1,
h2,
h3 {
  font-family: var(--font-body);
}

h2,
h3 {
  font-weight: 600;
  letter-spacing: -0.03em;
}

/* 라벨·배지·폼 라벨 등 한글 UI — Pretendard (Stitch 기본은 JetBrains Mono) */
.font-label-caps,
.text-label-caps {
  font-family: var(--font-body) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* 영문 소요소만 Paperozi — 작은 글 3, 조금 큰 영문 5 (히어로 제목 제외) */
.en {
  font-family: var(--font-en);
}

.en.text-\[10px\],
.en.text-xs,
.en.text-sm,
.tag-en,
.stack-en {
  font-weight: 300;
  letter-spacing: 0.02em;
}

.en.text-base,
.en.text-lg {
  font-weight: 500;
}

/* Stitch 히어로 stagger 영문 */
.stagger-reveal .en {
  font-family: var(--font-en);
  font-weight: 500;
}

/* SVG 드로잉 헤드라인 — 모바일 60px, PC 56px */
svg .drawing-text.draw-text-style {
  font-size: 60px;
  font-weight: 600;
}
@media (min-width: 768px) {
  svg .drawing-text.draw-text-style {
    font-size: 56px;
  }
}

/* 히어로 서브 — 제목과 대비 (3줄, 모바일 더 큼) */
.hero-sub {
  font-size: 1.25rem;
  line-height: 1.65;
  font-weight: 500;
}
@media (min-width: 768px) {
  .hero-sub {
    font-size: 1.375rem;
    line-height: 1.7;
  }
}

/* 작업물 카드 hover (Stitch .interactive-card 인라인 스타일은 덮어쓰지 않음) */
@media (hover: hover) {
  .portfolio-card,
  #work .glass-card,
  #work .group.rounded-2xl {
    transition:
      transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      border-color 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      background-color 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .portfolio-card:hover,
  #work .glass-card:hover,
  #work .group.rounded-2xl:hover {
    transform: scale(1.05) !important;
    border-color: var(--color-primary-border-hover) !important;
    background-color: rgba(255, 255, 255, 0.04) !important;
    box-shadow: 0 12px 40px rgba(99, 91, 255, 0.12);
  }
}