/* ============================================
   PRINT / PDF LAYOUT — Portfolio PDF (A4, dark)
   Target: ~7 balanced pages, no whitespace waste
   ============================================ */

@page {
  size: A4;
  margin: 14mm 13mm;
}

* {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

html, body {
  background: #0a0a0a !important;
  color: #f0ece3 !important;
  font-size: 10pt !important;
  line-height: 1.45 !important;
}

body::before { display: none !important; }

/* Hide web chrome */
.nav,
.cursor-glow,
.lang-toggle,
.carousel-arrow,
.carousel-dots,
.carousel-counter,
.hero-grid,
.hero-meta-sep {
  display: none !important;
}

/* Hide "Scrollen" hint (first meta span) in print */
.hero-meta > span:first-child { display: none !important; }

/* Force reveal visible */
.reveal {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}

/* ==========================================================
   PAGE 1 — COVER (Hero only, filling the page)
   ========================================================== */
.hero {
  min-height: auto !important;
  height: 253mm !important;          /* fill A4 content height */
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  page-break-after: always;
  break-after: page;
}
.hero-inner {
  padding: 10mm 0 0 0 !important;
  max-width: none !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}
.hero-eyebrow {
  font-size: 9pt !important;
  padding: 5pt 12pt !important;
  margin-bottom: 18mm !important;
  display: inline-flex !important;
  align-self: flex-start !important;
}
.hero-name {
  font-size: 72pt !important;
  line-height: 0.92 !important;
  margin-bottom: 12mm !important;
  letter-spacing: -0.02em !important;
}
.hero-sub {
  font-size: 14pt !important;
  line-height: 1.4 !important;
  max-width: 155mm !important;
  margin-bottom: 14mm !important;
}
.hero-meta {
  font-size: 9pt !important;
  letter-spacing: 1.2pt !important;
  display: flex !important;
  gap: 8mm !important;
}
.hero-footer {
  position: static !important;
  padding-top: 6mm !important;
  border-top: 1px solid rgba(255,255,255,0.15) !important;
  font-size: 8pt !important;
  display: flex !important;
  justify-content: space-between !important;
  letter-spacing: 0.6pt !important;
}

/* ==========================================================
   PAGE 2 — ABOUT (full-page)
   ========================================================== */
.about {
  padding: 0 !important;
  page-break-after: always;
  break-after: page;
}
.about-label {
  font-size: 8.5pt !important;
  letter-spacing: 1.6pt !important;
  margin-bottom: 10mm !important;
}
.about-grid {
  grid-template-columns: 1.4fr 1fr !important;
  gap: 14mm !important;
}
.about-lead {
  font-size: 22pt !important;
  line-height: 1.15 !important;
  margin-bottom: 8mm !important;
}
.about-copy p {
  font-size: 11pt !important;
  margin-bottom: 6mm !important;
  line-height: 1.55 !important;
}
.about-outro {
  font-size: 10.5pt !important;
  color: #a29f97 !important;
}
.about-stats {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 6mm !important;
  align-self: start !important;
}
.stat { padding: 8mm !important; }
.stat-num { font-size: 44pt !important; line-height: 1 !important; margin-bottom: 4mm !important; }
.stat-label { font-size: 7.5pt !important; letter-spacing: 1.4pt !important; }

/* ==========================================================
   PROJECTS SECTION HEADER
   ========================================================== */
.work { padding: 0 !important; }
.section-head { margin-bottom: 10mm !important; }
.section-label {
  font-size: 8.5pt !important;
  letter-spacing: 1.6pt !important;
  margin-bottom: 4mm !important;
}
.section-title {
  font-size: 24pt !important;
  line-height: 1.1 !important;
}

/* ==========================================================
   PAGE 3 — MindCorr (hero project, 2×3 image grid + meta)
   ========================================================== */
.project {
  page-break-inside: avoid;
  margin-bottom: 8mm !important;
  padding: 8mm !important;
}
.project-num {
  font-size: 7.5pt !important;
  letter-spacing: 1.6pt !important;
  margin-bottom: 3mm !important;
}
.project-name {
  font-size: 30pt !important;
  line-height: 1.05 !important;
  margin-bottom: 2mm !important;
}
.project-tag {
  font-size: 10.5pt !important;
  margin-bottom: 3mm !important;
  color: #c8a96a !important;
}
.project-desc, .project-desc-small {
  font-size: 9.5pt !important;
  line-height: 1.5 !important;
}
.project-highlights li {
  font-size: 8.8pt !important;
  padding-left: 4mm !important;
  margin-bottom: 1.5mm !important;
  line-height: 1.4 !important;
}
.project-stack { gap: 1mm !important; margin-top: 3mm !important; }
.project-stack span {
  font-size: 7pt !important;
  padding: 2pt 6pt !important;
}
.project-link {
  font-size: 9.5pt !important;
  margin-top: 4mm !important;
}

.project-hero {
  grid-template-columns: 1.1fr 1fr !important;
  gap: 6mm !important;
  align-items: start !important;
  page-break-after: always;
  break-after: page;
}

/* Carousel → 2×3 grid all 6 visible */
.project-media-carousel {
  aspect-ratio: auto !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  background: #0d0d0d !important;
  padding: 3mm !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
.project-media-carousel::before,
.project-media-carousel::after { display: none !important; }
.carousel-track {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-template-rows: repeat(3, 1fr) !important;
  gap: 3mm !important;
  transform: none !important;
  transition: none !important;
  width: 100% !important;
  height: auto !important;
}
.carousel-slide {
  flex: unset !important;
  min-width: 0 !important;
  width: auto !important;
  display: block !important;
  padding: 2mm !important;
  background: rgba(255,255,255,0.02) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 4px !important;
}
.carousel-slide img {
  width: 100% !important;
  height: 38mm !important;
  object-fit: contain !important;
  box-shadow: none !important;
  border-radius: 3px !important;
}
.carousel-slide figcaption {
  font-size: 6.5pt !important;
  margin-top: 1mm !important;
  color: #a29f97 !important;
  text-align: center !important;
  letter-spacing: 0.4pt !important;
  text-transform: none !important;
  background: none !important;
  padding: 0 !important;
}

/* ==========================================================
   PAGE 4 — SuitePlace (full page)
   ========================================================== */
.project:not(.project-hero):not(.project-compact) {
  grid-template-columns: 1fr 1fr !important;
  gap: 8mm !important;
  align-items: start !important;
}
.project:not(.project-hero):not(.project-compact) .project-media img {
  max-height: 62mm !important;
  object-fit: cover !important;
  border-radius: 4px !important;
}
/* Keep SuitePlace compact so Kate+SuperCar can share the page */
#p-suiteplace {
  page-break-after: avoid !important;
  break-after: avoid !important;
  margin-bottom: 6mm !important;
}

/* ==========================================================
   PAGE 5 — Kate + SuperCar (side-by-side)
   ========================================================== */
.project-pair {
  grid-template-columns: 1fr 1fr !important;
  gap: 6mm !important;
  page-break-inside: avoid;
  page-break-before: avoid !important;
  break-before: avoid !important;
}
.project-compact {
  grid-template-columns: 1fr !important;
  padding: 6mm !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}
.project-compact .project-media img { max-height: 42mm !important; }
.project-compact .project-name { font-size: 16pt !important; margin-bottom: 1mm !important; }
.project-compact .project-tag { font-size: 9.5pt !important; margin-bottom: 2mm !important; }
.project-compact .project-desc-small { font-size: 8.5pt !important; line-height: 1.4 !important; margin-bottom: 2mm !important; }
.project-compact .project-stack { margin-top: 2mm !important; }
.project-compact .project-link { margin-top: 2mm !important; font-size: 8.5pt !important; padding-bottom: 1mm !important; }

/* ==========================================================
   PAGE 6 — Skills + Experience together
   ========================================================== */
.skills {
  padding: 0 !important;
  page-break-before: always;
  break-before: page;
  page-break-after: avoid !important;
  break-after: avoid !important;
  margin-bottom: 8mm !important;
}
.skills-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4mm !important;
}
.skill-cat {
  padding: 4mm !important;
  page-break-inside: avoid;
}
.skill-cat-label {
  font-size: 8pt !important;
  margin-bottom: 2mm !important;
  letter-spacing: 1.2pt !important;
}
.skill-chips { gap: 1.5mm !important; }
.skill-chips span {
  font-size: 6.8pt !important;
  padding: 1.5pt 5pt !important;
}

.experience {
  padding: 0 !important;
  page-break-before: avoid !important;
  break-before: avoid !important;
  margin-top: 8mm !important;
}
.timeline-item {
  grid-template-columns: 32mm 1fr !important;
  gap: 6mm !important;
  padding: 3mm 0 !important;
  page-break-inside: avoid;
}
.timeline-date { font-size: 8pt !important; letter-spacing: 1pt !important; }
.timeline-role { font-size: 10.5pt !important; margin-bottom: 1mm !important; }
.timeline-place { font-size: 8.5pt !important; margin-bottom: 2mm !important; }
.timeline-body p { font-size: 8.8pt !important; line-height: 1.4 !important; }

/* ==========================================================
   PAGE 7 — Languages + Contact together
   ========================================================== */
.languages {
  padding: 0 !important;
  page-break-before: always;
  break-before: page;
  page-break-after: avoid !important;
  break-after: avoid !important;
  margin-bottom: 6mm !important;
}
.languages .section-head { margin-bottom: 5mm !important; }
.lang-list {
  gap: 0 !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}
.lang-row {
  grid-template-columns: 30mm 1fr 52mm !important;
  gap: 4mm !important;
  padding: 1.4mm 0 !important;
  align-items: center !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}
.lang-name { font-size: 9.5pt !important; }
.lang-level {
  font-size: 7pt !important;
  letter-spacing: 0.6pt !important;
  white-space: nowrap !important;
  text-align: right !important;
}
.lang-bar { height: 3pt !important; }

.contact {
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  display: block !important;
  background: none !important;
  border-top: none !important;
  page-break-before: avoid !important;
  break-before: avoid !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}
.contact-inner {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.contact-methods {
  margin-bottom: 0 !important;
}
.contact-label {
  font-size: 8.5pt !important;
  letter-spacing: 1.6pt !important;
  margin-bottom: 4mm !important;
}
.contact-title {
  font-size: 22pt !important;
  line-height: 1.1 !important;
  margin-bottom: 6mm !important;
}
.contact-methods {
  grid-template-columns: 1fr 1fr !important;
  gap: 3mm !important;
}
.contact-item {
  padding: 4mm !important;
  page-break-inside: avoid;
}
.contact-method-label {
  font-size: 7.5pt !important;
  letter-spacing: 1.2pt !important;
}
.contact-method-value { font-size: 11pt !important; }
.footer {
  font-size: 7.5pt !important;
  margin-top: 6mm !important;
  padding-top: 3mm !important;
  border-top: 1px solid rgba(255,255,255,0.12) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1.5mm !important;
  letter-spacing: 0.6pt !important;
  page-break-before: avoid !important;
  break-before: avoid !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}
.footer > div { white-space: normal !important; }

/* Typography hygiene */
h1, h2, h3 { page-break-after: avoid; break-after: avoid; }
p, li { orphans: 2; widows: 2; }