/* ================================================================
   Print / PDF — 웹 화면과 동일한 다크 테마를 16:9 슬라이드로 출력
   (밝은 인쇄 테마가 아니라, HTML 그대로의 문서를 만든다)
   ================================================================ */
@media print {
  @page { size: 338mm 190mm; margin: 0; }

  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  html { scroll-behavior: auto; }
  html, body { background: var(--bg) !important; }

  /* 화면 전용 요소 숨김 */
  .nav, .lab-toolbar, .file-banner, video, .live-dot { display: none !important; }

  /* 히어로 = 표지, 반드시 한 페이지 안에 (오버플로 → 고아 줄 방지) */
  .hero {
    min-height: 0;
    padding: 44px 6vw 30px;
    page-break-after: always;
  }
  .hero .eyebrow { margin-bottom: 12px; font-size: 11.5px; }
  .hero h1 { font-size: 54px; margin-bottom: 16px; }
  .hero .lead { font-size: 14.5px; margin-bottom: 26px; max-width: 720px; }
  .hero .stat-row { margin-bottom: 24px; gap: 10px; }
  .stat { padding: 12px 20px; min-width: 132px; }
  .stat .num { font-size: 24px; }
  .stat .num span + span { font-size: 14px; }
  .cta-row .btn { padding: 10px 20px; font-size: 13px; }
  .hero-note { margin-top: 18px; font-size: 11.5px; }
  .hero .cta-row .btn, .hero .txt-link { pointer-events: none; }

  /* 머리글·소제목이 페이지 바닥에 고립되지 않게 — 뒤따르는 콘텐츠와 함께 넘김 */
  .sec-head, .sub-title, .proj-head, .cb-head, h2, h3, h4 {
    break-after: avoid-page; page-break-after: avoid;
  }
  p, li, figcaption { orphans: 3; widows: 3; }

  /* ── 한 페이지 수납을 위한 전역 컴팩트 ── */
  section { padding: 24px 5vw 32px; }
  .sec-head { margin-bottom: 20px; }
  .sec-head h2 { font-size: 25px; }
  .sec-head p { font-size: 12.5px; }
  .sec-head .tag { font-size: 10px; padding: 4px 11px; margin-bottom: 10px; }
  .feature-cols { gap: 10px; margin: 14px 0; }
  .feature { padding: 13px 15px; }
  .feature h4 { font-size: 13px; }
  .feature p { font-size: 11.5px; }
  .sub-title { margin: 16px 0 10px; font-size: 14px; }
  .proj-desc { font-size: 12.5px; margin-bottom: 14px; }
  .chip { font-size: 10.5px; padding: 3px 10px; }
  .code-wrap pre { font-size: 10.5px; padding: 12px 14px; line-height: 1.55; }

  /* 크레딧 블록 — 프레임을 납작하게 해서 페이지 수납 */
  .credit-block { padding: 14px 16px; margin-bottom: 10px; }
  .credit-block .game { font-size: 18px; }
  .cb-head { margin-bottom: 8px; }
  #ref .sec-head { margin-bottom: 14px; }
  .credit-strip, .credit-gallery, .credit-grid2, .credit-stack { gap: 4px; margin-bottom: 4px; }
  /* 프레임 높이를 px로 확정 (비율 상속 이슈 회피) */
  .credit-strip .credit-frame img { height: 170px !important; aspect-ratio: auto !important; }
  .credit-gallery .credit-frame img { height: 100px !important; aspect-ratio: auto !important; }
  .credit-gallery.four { grid-template-columns: repeat(4, 1fr) !important; }
  .credit-gallery.four .credit-frame img { height: 115px !important; }
  .credit-grid2 .credit-frame img { height: 115px !important; aspect-ratio: auto !important; }
  .credit-stack .credit-frame img { height: 95px !important; aspect-ratio: auto !important; }
  .credit-frame.wide img { height: 430px !important; aspect-ratio: auto !important; }
  /* 크레딧 블록은 각자 새 페이지에서 시작 — 이전 페이지 꼬리에 끼어 쪼개지는 것 방지 */
  #ref .credit-block + .credit-block { break-before: page; page-break-before: always; }
  #ref .ref-grid { break-before: page; page-break-before: always; }
  .credit-block ul, .ref-card ul, .credit-block li, .ref-card li { break-inside: avoid; }
  .credit-block li, .ref-card li { font-size: 11.5px; padding: 3px 0 3px 18px; }
  .yt-row .btn { padding: 6px 12px; font-size: 11px; }
  /* 세나2 HUD 와이드 + 불릿은 다음 페이지에서 함께 시작 (불릿 고아 방지) */
  .credit-frame.wide { break-before: page; }
  .credit-frame.wide img { aspect-ratio: 21/8; }

  /* VFX Lab / BI 카드 그리드 — 6열 + 납작 캔버스로 한 페이지 수납 */
  .fx-grid { grid-template-columns: repeat(6, 1fr) !important; gap: 8px; }
  .fx-card canvas { aspect-ratio: 1.25 !important; }
  .sec-head p { font-size: 12px; }
  .shot-strip img { aspect-ratio: 16/9; }
  .shot-strip figcaption { font-size: 10px; padding: 6px 9px; }
  #lab { break-inside: avoid-page; }
  #lab .fx-grid, #lab .badge-legend { break-before: avoid-page; }
  .fx-meta { padding: 7px 9px 9px; }
  .fx-name { font-size: 10.5px; }
  .fx-sub { font-size: 9px; }
  .badge-legend { margin: -4px 0 14px; font-size: 10.5px; gap: 6px 12px; }

  /* 파이프라인 — 머리글+스텝+피처+v3 스샷 한 페이지, 코드는 다음 장 */
  .pipe-node { padding: 12px; margin-right: 26px; }
  .pipe-node p { font-size: 10.5px; }
  #pipeline .shot-strip img { aspect-ratio: 16/6 !important; }
  #pipeline .shot-strip figcaption { font-size: 10px; padding: 6px 9px; }
  #pipeline .code-cols { break-before: page; }
  #pipeline .sub-title, #pipeline .shot-strip { break-before: avoid-page; }
  #pipeline .pipe-node h5 { font-size: 12px; }
  #pipeline .pipe-node p { font-size: 10px; }
  #pipeline .feature { padding: 10px 12px; }
  #pipeline .feature p { font-size: 10.5px; }
  #pipeline .sec-head { margin-bottom: 14px; }
  #pipeline .sub-title { margin: 12px 0 8px; }
  #pipeline .shot-strip { grid-template-columns: repeat(2, 1fr) !important; }
  #pipeline .shot-strip img { height: 150px !important; aspect-ratio: auto !important; object-fit: cover; }

  /* BI 갤러리 페이지 — 인게임+UI+아틀라스 한 페이지 수납 */
  #bi .sub-title { margin: 10px 0 6px; }
  #bi .fx-card canvas { aspect-ratio: 1.35 !important; }
  #bi .atlas-item img { height: 110px !important; aspect-ratio: auto !important; }
  #bi .atlas-item .cap { font-size: 9px; padding: 5px 8px; }

  /* 페이지 그룹핑 래퍼 — 묶음 유지 / 새 페이지 시작 */
  .pdf-group { break-inside: avoid-page; page-break-inside: avoid; }
  .pdf-newpage { break-before: page; page-break-before: always; }
  .atlas-row { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .atlas-item img { aspect-ratio: 16/9; }
  .atlas-item .cap { font-size: 10px; padding: 7px 10px; }

  /* 울사가 — 비디오 figure는 인쇄에서 통째로 제거(빈 박스 방지) */
  .shot-strip figure:has(video) { display: none !important; }

  /* 세로 스크린샷 스트립 — 4컷 한 줄 수납 */
  .phone-strip { grid-template-columns: repeat(4, 200px); gap: 10px; }
  .phone-strip img { aspect-ratio: 9/15.5; }
  .phone-strip figcaption { font-size: 10px; padding: 6px 9px; }

  /* 데모 카드 — 머리글과 카드 3장 한 페이지 */
  .demo-grid { gap: 12px; }
  .demo-card .shot { aspect-ratio: 16/8; }
  .demo-card .shot.portrait { aspect-ratio: 16/9; }
  .demo-card .body { padding: 12px 14px 14px; gap: 6px; }
  .demo-card p { font-size: 11.5px; }
  .demo-card h4 { font-size: 14px; }

  /* K2 · 마나서바이버 · Grid Rush — 머리글부터 인게임까지 한 페이지 수납 */
  #k2 .phone-strip img { height: 220px !important; aspect-ratio: auto !important; }
  #vsl .phone-strip img { height: 260px !important; aspect-ratio: auto !important; }
  #more .phone-strip img { height: 195px !important; aspect-ratio: auto !important; }
  #k2 .feature, #more .feature { padding: 10px 12px; }
  #k2 .feature p, #vsl .feature p, #more .feature p { font-size: 10.5px; }
  #k2 .proj-desc, #vsl .proj-desc, #more .proj-desc { font-size: 12px; margin-bottom: 10px; }
  #k2 .sub-title, #vsl .sub-title, #more .sub-title { margin: 10px 0 6px; }
  #more .cta-row { margin-top: 10px !important; }
  #more .cta-row .btn { padding: 8px 16px; font-size: 12px; }

  /* PDF에는 PDF 다운로드 버튼 불필요 */
  .pdf-dl { display: none !important; }
  footer { padding: 50px 6vw 40px; }

  /* 섹션 = 새 페이지에서 시작 (웹 레이아웃 그대로 흐름) */
  section { page-break-before: always; padding: 36px 6vw 44px; }
  .sec-head { margin-bottom: 30px; }
  footer { page-break-before: always; }

  /* 등장 애니메이션 강제 표시 */
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }

  /* 카드류는 페이지 경계에서 잘리지 않게 */
  .fx-card, .pillar, .feature, .demo-card, .ref-card, .atlas-item,
  .code-wrap, .pipe-node, .credit-frame, .credit-strip,
  .phone-strip figure, .shot-strip figure, .stat, .badge-legend,
  .sec-head, .proj-head, .sub-title, .timing-chart, .yt-row {
    break-inside: avoid; page-break-inside: avoid;
  }

  /* 세나2 갤러리 — 인쇄에서는 6컷 한 줄 */
  .credit-gallery { grid-template-columns: repeat(6, 1fr) !important; }

  /* 호버 전용 효과 제거 */
  .fx-card:hover, .demo-card:hover { transform: none; box-shadow: none; }

  /* 데모 버튼에 실행 안내 부기 */
  .demo-card .btn::after, .cta-row .btn.gold::after {
    content: " (START_PORTFOLIO.bat 실행 후 접속)";
    font-size: 10px; font-weight: 400; opacity: .75;
  }
  .hero .cta-row .btn::after { content: "" !important; }
}