/* Multipage portfolio: native navigation, bold outlines and pastel blocks. */
.nav-links a[aria-current=page]:after{width:100%}
.all-projects-link{display:flex;justify-content:flex-end;margin-bottom:22px}.contact-page-link{margin:20px 0}
.page-heading{position:relative;padding-top:90px;padding-bottom:65px;border-bottom:2px solid var(--line)}
.page-heading h1,.detail-heading h1{font-size:clamp(44px,6vw,78px);line-height:1.08;letter-spacing:-3px;max-width:850px;margin:20px 0}
.blue-dot{color:var(--blue-ink)}.page-intro{max-width:540px;color:var(--muted);font-size:16px}.page-star{position:absolute;right:25px;top:95px;font-size:100px;line-height:1;color:var(--blue-ink);transform:rotate(12deg)}
.collection-section{padding-block:40px 90px}.collection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:34px}.collection-toolbar label{display:flex;align-items:center;gap:15px;font-size:12px;font-weight:600}.collection-toolbar select{max-width:230px;padding:12px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:0;box-shadow:3px 3px 0 var(--line)}.collection-toolbar p{font-size:12px;letter-spacing:1px}
.collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:38px}.work-card{display:block;min-width:0;background:var(--card);border:2px solid var(--line);box-shadow:7px 7px 0 var(--line);transition:transform .18s,box-shadow .18s}.work-card:hover{transform:translate(-3px,-3px);box-shadow:10px 10px 0 var(--line)}.work-card:nth-child(3n+2) .work-visual{background:#e7d9f6}.work-card:nth-child(3n+3) .work-visual{background:#dbeacb}.work-visual{position:relative;aspect-ratio:16/10;background:#b9ddf5;border-bottom:2px solid var(--line);color:#202126;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:30px;gap:12px}.work-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:18px;transition:transform .25s}.work-card:hover img{transform:scale(1.025)}.work-art-label{font-size:10px;letter-spacing:2px}.work-visual strong{font-size:clamp(24px,3vw,40px);text-align:center;overflow-wrap:anywhere}.work-art-symbol{font-size:40px;font-weight:800}.work-number{position:absolute;left:15px;top:15px;font-size:11px;background:#fffcf7;border:2px solid #202126;padding:5px 10px;box-shadow:3px 3px 0 #202126}.work-arrow{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;width:42px;height:42px;font-size:25px;border:2px solid #202126;background:#fffcf7;box-shadow:3px 3px 0 #202126}.work-copy{padding:28px}.work-copy h2{font-size:26px;margin-bottom:14px}.work-description{color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.7;margin-bottom:18px}.work-link{display:block;margin-top:25px;font-size:13px;font-weight:800}.page-cta{padding:45px;margin-bottom:90px;background:var(--blue-soft);border:2px solid var(--line);box-shadow:7px 7px 0 var(--line);text-align:center}.page-cta p{font-size:10px;letter-spacing:2px}.page-cta h2{font-size:clamp(25px,4vw,40px);margin:18px 0 26px}
.detail-section{padding-block:45px 90px;min-height:65vh}.detail-heading{padding:45px 0}.detail-visual{aspect-ratio:16/9;border:2px solid var(--line);box-shadow:8px 8px 0 var(--line)}.detail-visual img{padding:25px}.detail-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(230px,1fr);gap:70px;margin:65px 0}.project-story h2{font-size:30px;margin:16px 0 20px}.story-description{white-space:pre-line;color:var(--muted);line-height:1.9}.project-story h2:not(:first-of-type){margin-top:35px}.project-facts{padding:28px;background:var(--blue-soft);border:2px solid var(--line);box-shadow:5px 5px 0 var(--line);align-self:start}.project-facts>.tech-tags{margin:20px 0}.project-facts>p:not(.section-label){margin-top:25px;font-size:13px}.detail-links{display:grid;gap:14px;margin-top:28px}.detail-bottom{display:flex;justify-content:space-between;gap:25px;border-top:2px solid var(--line);padding-top:28px}.detail-bottom a{overflow-wrap:anywhere}
.contact-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:65px;padding-block:65px 95px}.contact-note{align-self:start;background:var(--blue);color:#202126;border:2px solid #202126;padding:35px;box-shadow:8px 8px 0 #202126;transform:rotate(-2deg)}.note-icon{font-size:65px;line-height:1}.contact-note .section-label{margin-top:25px;color:#38617e}.contact-note h2{font-size:30px;margin:20px 0}.contact-note>p:not(.section-label){font-size:14px;line-height:1.8}.contact-address{display:block;font-weight:800;font-size:14px;overflow-wrap:anywhere;border-bottom:2px solid #202126;padding-bottom:8px;margin-top:30px}.contact-socials{display:flex;flex-wrap:wrap;gap:20px;margin-top:20px}.message-form h2{font-size:30px;margin:14px 0 30px}.message-form label{display:block;font-size:13px;font-weight:600;margin-bottom:22px}.message-form input,.message-form textarea,.message-form select{display:block;width:100%;min-width:0;margin-top:8px;border:2px solid var(--line);border-radius:0;background:var(--card);color:var(--ink);padding:13px 15px;font:inherit;font-weight:400;box-shadow:3px 3px 0 var(--line)}.message-form textarea{resize:vertical;min-height:145px}.message-form input:focus-visible,.message-form textarea:focus-visible{outline:3px solid var(--blue-ink);outline-offset:3px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-hint,#form-status{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 20px}#form-status{margin-top:16px}.faq-section{display:grid;grid-template-columns:1fr 1.5fr;gap:70px;padding-block:60px 100px;border-top:2px solid var(--line)}.faq-section h2{font-size:36px;margin:18px 0}.faq-section>div>p:last-child{font-size:13px;color:var(--muted)}.faq-list details{border-bottom:2px solid var(--line)}.faq-list details:first-child{border-top:2px solid var(--line)}.faq-list summary{display:flex;align-items:center;gap:18px;cursor:pointer;list-style:none;padding:23px 0;font-weight:600;font-size:15px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary>span{font-size:11px;color:var(--muted)}.faq-list summary i{font-style:normal;font-size:24px;margin-left:auto}.faq-list details[open] summary i{transform:rotate(45deg)}.faq-list details[open]{background:var(--blue-soft)}.faq-list details p{padding:0 24px 25px 33px;font-size:14px;color:var(--muted);line-height:1.8}
@media(max-width:850px){.page-heading{padding-top:55px}.page-star{font-size:65px;top:55px;right:0}.page-heading h1{max-width:80%}.contact-layout{gap:35px;grid-template-columns:1fr}.contact-note{transform:none}.detail-layout{gap:30px}.faq-section{gap:35px;grid-template-columns:1fr}.contact-note h2 br{display:none}}
@media(max-width:600px){.page-heading h1,.detail-heading h1{letter-spacing:-1.5px;font-size:42px}.page-star{font-size:45px;top:80px}.page-intro{font-size:14px}.collection-toolbar{align-items:flex-start}.collection-toolbar label{display:grid;gap:8px;max-width:70%}.collection-toolbar select{width:100%;font-size:12px}.collection-toolbar p{font-size:10px;white-space:nowrap}.collection-grid{grid-template-columns:1fr;gap:30px}.work-copy{padding:23px}.page-cta{padding:30px 20px}.detail-layout{grid-template-columns:1fr;margin:40px 0}.detail-bottom{flex-direction:column;align-items:flex-start}.detail-heading{padding:32px 0}.contact-layout{padding-block:40px 65px}.contact-note{padding:25px}.form-row{grid-template-columns:1fr;gap:0}.faq-section{padding-block:40px 65px}.faq-section h2{font-size:30px}.faq-list summary{font-size:14px;gap:12px}.message-form input,.message-form textarea,.message-form select{font-size:16px}.detail-visual img{padding:8px}.project-facts{padding:23px}}
@media(prefers-reduced-motion:reduce){.work-card,.work-visual img{transition:none}}

/* A distinct About page, keeping its portrait and story out of Home. */
.about-page-main {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  align-items: center;
  gap: clamp(42px, 7vw, 105px);
  padding-block: 86px 110px;
}
.about-page-photo {
  position: relative;
  display: flex;
  align-items: end;
  justify-content: center;
  min-height: 440px;
  background: #b9ddf5;
  border: 3px solid #202126;
  box-shadow: 12px 12px 0 #202126;
  transform: rotate(-2deg);
  overflow: hidden;
}
.about-page-photo img {
  width: min(100%, 480px);
  height: 440px;
  object-fit: contain;
  object-position: bottom;
}
.about-photo-fallback {
  align-self: center;
  color: #202126;
  font-size: clamp(120px, 22vw, 230px);
  font-weight: 800;
  line-height: 1;
}
.photo-caption {
  position: absolute;
  right: 18px;
  bottom: 20px;
  padding: 8px 12px;
  background: #fffcf7;
  border: 2px solid #202126;
  box-shadow: 4px 4px 0 #202126;
  color: #202126;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  transform: rotate(4deg);
}
.about-page-story h2 {
  margin: 20px 0;
  font-size: clamp(32px, 4vw, 54px);
  line-height: 1.12;
  letter-spacing: -1.8px;
}
.about-page-story h2 span { color: var(--blue-ink); }
.about-page-name { font-size: 14px; font-weight: 800; }
.about-page-bio, .about-page-note {
  max-width: 610px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.85;
}
.about-page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 32px; }
.about-page-socials { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 28px; }
.about-focus { padding-bottom: 110px; }
.about-focus-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px; margin-top: 50px; }
.about-focus-grid article {
  min-width: 0;
  padding: 30px;
  border: 2px solid var(--line);
  background: var(--card);
  box-shadow: 6px 6px 0 var(--line);
}
.about-focus-grid article:nth-child(1) { background: var(--blue-soft); }
.about-focus-grid article:nth-child(2) { background: #f7efff; color: #202126; }
.about-focus-grid article:nth-child(3) { background: #e9f1e2; color: #202126; }
.about-focus-grid span { font-size: 10px; letter-spacing: 1.5px; font-weight: 800; }
.about-focus-grid h3 { margin: 27px 0 15px; font-size: 22px; }
.about-focus-grid p { font-size: 13px; line-height: 1.7; }
.about-experience-link { display: inline-block; margin: 16px 0 0 20px; font-size: 12px; font-weight: 800; }
@media (max-width: 850px) {
  .about-page-main { grid-template-columns: 1fr; padding-block: 60px 80px; }
  .about-page-photo { max-width: 490px; }
  .about-focus-grid { grid-template-columns: 1fr; gap: 22px; }
}
@media (max-width: 600px) {
  .about-page-main { gap: 44px; padding-block: 42px 70px; }
  .about-page-photo { min-height: 320px; box-shadow: 7px 7px 0 #202126; }
  .about-page-photo img { height: 320px; }
  .about-focus { padding-bottom: 70px; }
  .about-focus-grid { margin-top: 32px; }
  .about-experience-link { display: block; margin: 22px 0 0; }
}