/* V11: personal voice, PDF résumé, richer cases and timed image-to-video showcase. */

/* --- Detailed résumé lives in PDF; the site only presents the file. --- */
.resume-download {
  position: relative;
  isolation: isolate;
  min-height: 360px;
  padding: clamp(30px, 4.5vw, 64px);
  display: grid;
  grid-template-columns: 124px minmax(0, 1fr) minmax(210px, .34fr);
  gap: clamp(24px, 4vw, 58px);
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 12% 16%, rgba(232, 151, 72, .18), transparent 27%),
    radial-gradient(circle at 82% 86%, rgba(95, 151, 103, .18), transparent 30%),
    linear-gradient(135deg, color-mix(in srgb, var(--surface-2) 88%, transparent), color-mix(in srgb, var(--panel) 90%, transparent));
  box-shadow: var(--shadow);
}
.resume-download::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .42;
  background: linear-gradient(112deg, transparent 0 46%, rgba(255,255,255,.09) 50%, transparent 54% 100%);
  transform: translateX(-115%);
  animation: resume-glint 8s ease-in-out infinite;
}
.resume-file-mark {
  width: 116px;
  aspect-ratio: .78;
  position: relative;
  display: grid;
  place-items: center;
  border: 1px solid rgba(240, 163, 81, .48);
  border-radius: 12px 28px 12px 12px;
  color: var(--orange-soft);
  background: linear-gradient(145deg, rgba(12,34,22,.92), rgba(37,68,46,.72));
  box-shadow: 0 24px 60px rgba(0,0,0,.25), 0 0 34px rgba(233,137,56,.16);
}
.resume-file-mark::before {
  content: "";
  position: absolute;
  top: -1px;
  right: -1px;
  width: 31px;
  height: 31px;
  border-left: 1px solid rgba(240, 163, 81, .48);
  border-bottom: 1px solid rgba(240, 163, 81, .48);
  border-radius: 0 27px 0 9px;
  background: rgba(236,157,78,.13);
}
.resume-file-mark b { font: 800 22px/1 var(--display); letter-spacing: .12em; }
.resume-file-mark i {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 25px;
  height: 2px;
  background: linear-gradient(90deg, var(--orange), var(--green-bright));
  box-shadow: 0 0 14px rgba(232, 135, 56, .5);
}
.resume-download-copy h2 {
  max-width: 900px;
  margin: 10px 0 20px;
  font: 700 clamp(36px, 4.2vw, 66px)/1.02 var(--display);
  letter-spacing: -.045em;
}
.resume-download-copy > p:last-of-type {
  max-width: 850px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.68;
}
.resume-meta { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 8px; }
.resume-meta span {
  min-height: 34px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: color-mix(in srgb, var(--surface) 60%, transparent);
  font-size: 12px;
}
.resume-download-actions { display: grid; gap: 10px; align-content: center; }
.resume-download-actions .button { width: 100%; justify-content: space-between; }
.resume-contact-link {
  min-height: 44px;
  padding: 0 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font: 750 11px/1 var(--display);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.resume-contact-link:hover { color: var(--orange-soft); }
.resume-contact-link i { font-style: normal; }

/* --- Project media: still image, then muted video, then next project. --- */
.project-tabs { grid-template-columns: repeat(8, minmax(155px, 1fr)); }
.project-view { grid-template-columns: minmax(0, 1.08fr) minmax(460px, .92fr); min-height: 780px; }
.project-media { min-height: 780px; }
.project-media video,
.project-media > #project-image {
  display: block !important;
  opacity: 0;
  transform: scale(1.015);
  transition: opacity var(--media-transition, 650ms) ease, transform 1.3s ease;
}
.project-media.has-image.phase-image > #project-image { opacity: 1; transform: scale(1); }
.project-media.has-video.phase-video video { opacity: 1; transform: scale(1); }
.project-media .media-fallback {
  display: block !important;
  opacity: 1;
  transition: opacity var(--media-transition, 650ms) ease;
}
.project-media.has-image.phase-image .media-fallback,
.project-media.has-video.phase-video .media-fallback { opacity: 0; }
.project-media.phase-video > #project-image { opacity: 0; }
.project-media.phase-image video { opacity: 0; }
.media-phase-dots {
  position: absolute;
  z-index: 5;
  right: 22px;
  top: 64px;
  display: flex;
  gap: 7px;
}
.media-phase-dots i {
  width: 22px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255,247,232,.22);
  transition: background .25s ease, box-shadow .25s ease, transform .25s ease;
}
.media-phase-dots i.active {
  background: var(--orange-soft);
  box-shadow: 0 0 12px rgba(234, 145, 67, .72);
  transform: scaleX(1.15);
}
.project-copy { min-width: 0; padding: 44px 38px 34px; }
.project-copy h3 { font-size: clamp(39px, 3.6vw, 60px); }
.project-facts { margin-top: 32px; }
.project-case-grid {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.project-case-grid:not(.has-details) { display: none; }
.project-case-grid article {
  min-height: 160px;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.025), rgba(90,144,98,.045));
}
.project-case-grid article[hidden] { display: none; }
.project-case-grid small {
  display: block;
  margin-bottom: 13px;
  color: var(--orange-soft);
  font: 800 10px/1.35 var(--display);
  letter-spacing: .09em;
  text-transform: uppercase;
}
.project-case-grid p { margin: 0; color: var(--cream-soft); font-size: 13px; line-height: 1.62; }
.project-links { margin-top: 24px; padding-top: 0; }

/* --- Trust block: consistent logo plates and text-only fallback. --- */
.logo-belt {
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}
.trust-logo {
  min-height: 205px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 17px;
  border: 0 !important;
  background: linear-gradient(150deg, color-mix(in srgb, var(--surface-2) 94%, transparent), color-mix(in srgb, var(--panel) 90%, transparent));
}
.trust-logo-visual,
.trust-wordmark {
  width: 100%;
  min-height: 82px;
  padding: 14px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.trust-logo-visual img { max-width: 100%; max-height: 56px; object-fit: contain; opacity: 1; filter: none; }
.trust-wordmark {
  color: var(--cream);
  font: 780 clamp(19px, 2vw, 28px)/1.05 var(--display);
  letter-spacing: -.025em;
  text-align: center;
}
.mode-transparent { background: transparent; }
.mode-plate { background: color-mix(in srgb, var(--surface) 74%, transparent); }
.mode-light { background: #fffaf0; }
.mode-dark { background: #0a1b11; }
.mode-mono-light img { filter: grayscale(1) brightness(2.5) contrast(1.2); }
.mode-mono-dark img { filter: grayscale(1) brightness(.35) contrast(1.5); }
.trust-logo-copy { display: grid; gap: 7px; text-align: left; width: 100%; }
.trust-logo-copy strong {
  margin: 0;
  color: var(--cream);
  font: 730 14px/1.2 var(--display);
  letter-spacing: .01em;
  text-align: left;
}
.trust-logo-copy small { color: var(--muted); font-size: 12px; line-height: 1.5; }

@keyframes resume-glint {
  0%, 70% { transform: translateX(-115%); }
  92%, 100% { transform: translateX(115%); }
}

@media (max-width: 1180px) {
  .resume-download { grid-template-columns: 104px minmax(0, 1fr); }
  .resume-file-mark { width: 98px; }
  .resume-download-actions { grid-column: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .resume-contact-link { grid-column: 1 / -1; }
  .project-view { grid-template-columns: 1fr 1fr; }
  .project-media { min-height: 720px; }
  .project-case-grid { grid-template-columns: 1fr; }
  .project-case-grid article { min-height: 0; }
}

@media (max-width: 900px) {
  .resume-download { grid-template-columns: 88px minmax(0, 1fr); gap: 24px; }
  .resume-file-mark { width: 82px; }
  .project-view { grid-template-columns: 1fr; min-height: 0; }
  .project-media { min-height: 560px; border-right: 0; border-bottom: 1px solid var(--line); }
  .project-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .resume-download { min-height: 0; padding: 26px 22px; grid-template-columns: 1fr; }
  .resume-file-mark { width: 74px; }
  .resume-download-copy h2 { font-size: 38px; }
  .resume-download-actions { grid-column: auto; grid-template-columns: 1fr; }
  .resume-contact-link { grid-column: auto; }
  .project-tabs { grid-template-columns: repeat(8, minmax(142px, 1fr)); }
  .project-media { min-height: 430px; }
  .project-copy { padding: 30px 22px 25px; }
  .project-case-grid { grid-template-columns: 1fr; }
  .project-case-grid article { padding: 19px; }
  .media-phase-dots { right: 16px; top: 58px; }
  .trust-logo { min-height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  .resume-download::before { animation: none; }
  .project-media video,
  .project-media > #project-image,
  .project-media .media-fallback { transition: none; }
}

.trust-reference-note {
  margin-top: 24px; padding: 22px 24px; display: grid; grid-template-columns: 42px 1fr; gap: 16px; align-items: center;
  border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb,var(--surface-2) 86%,transparent);
}
.trust-reference-note > i { width: 42px; height: 42px; display:grid; place-items:center; border:1px solid var(--orange); border-radius:50%; color:var(--orange); font-style:normal; }
.trust-reference-note strong { color:var(--cream); font:750 18px/1.2 var(--display); }
.trust-reference-note p { margin:6px 0 0; color:var(--muted); font-size:14px; line-height:1.55; }
@media(max-width:600px){.trust-reference-note{grid-template-columns:1fr}.trust-reference-note>i{width:38px;height:38px}}