/* Original About portrait with a softer, natural color treatment. */
.ab-hero__portrait img[src="about/ab-portrait.webp"] {
  filter:saturate(.97) drop-shadow(0 12px 20px #16151512);
}
.hm-about .ab-note { background:linear-gradient(135deg,#ffffff70,#ffffff20),var(--paper); }
.hm-about .ab-note:nth-child(1) { --paper:#edf0f5; }
.hm-about .ab-note:nth-child(2) { --paper:#e8edf3; }
.hm-about .ab-note:nth-child(3) { --paper:#f0f2f6; }
.hm-about .ab-note:nth-child(4) { --paper:#e9edf4; }
.hm-about .ab-note__stage { background:#ffffff60; border-radius:5px; padding:6px 8px; }
.folder-home .personal { gap:32px; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }
.folder-home .portrait-card { justify-self:start; }
.folder-home .portrait-spark svg { width:32px; height:32px; fill:currentColor; display:block; }
/* Clip the animated scene, not the page's sticky scrolling ancestor. */
.folder-home .folder-scroll { overflow:clip; }
@media(max-width:760px) {
  .folder-home .personal { grid-template-columns:1fr; gap:28px; }
  .folder-home .portrait-card { justify-self:center; }
  .folder-home .folder-scroll { margin-top:16px; }
  .folder-home .folder-scroll.is-animated { height:300svh; }
  .folder-home .is-animated .folder-stage { position:sticky; top:var(--mobile-stage-top,148px); height:calc(100svh - var(--mobile-stage-top,148px)); overflow:hidden; }
  .folder-home .folder-orbit { display:none; }
  .folder-home .is-animated .folder-cards { inset:0; z-index:2; clip-path:inset(12px 0 calc(var(--mobile-dock-lift,0px) + 8px)); }
  .folder-home .is-animated .folder-card {
    top:auto; bottom:90px; left:50%; width:min(280px,calc(100% - 64px)); padding:12px;
    transform:translate(calc(-50% + var(--mobile-preview-x,0px)),var(--mobile-card-y,250px)) rotate(var(--mobile-preview-r,0deg)); opacity:var(--mobile-card-opacity,0);
    pointer-events:var(--mobile-card-pointer,none); z-index:var(--mobile-card-z,1);
  }
  .folder-home .folder-card-art { height:clamp(60px,13svh,110px); }
  .folder-home .is-animated .folder-envelope { top:auto; bottom:var(--mobile-dock-lift,0px); width:min(360px,calc(100% - 32px)); height:auto; aspect-ratio:2 / 1; transform:translateX(-50%); opacity:1; z-index:4; pointer-events:none; }
  .folder-home .is-animated .folder-back { top:auto; bottom:calc(20px + var(--mobile-dock-lift,0px)); width:min(338px,calc(100% - 54px)); height:auto; aspect-ratio:2 / 1; transform:translateX(-50%); opacity:1; z-index:0; }
  .folder-home .folder-label { bottom:18px; left:20px; right:20px; }
  .folder-home .folder-label small { display:block; max-width:28ch; line-height:1.35; margin-top:4px; }
  .folder-home .folder-scroll-hint { display:none; }
  .folder-home .about-sheet { margin-top:0; }
  .folder-home .folder-scroll:not(.is-animated) .folder-stage { height:auto; padding:24px 20px; }
  .folder-home .folder-scroll:not(.is-animated) .folder-cards { position:static; display:grid; gap:24px; }
  .folder-home .folder-scroll:not(.is-animated) .folder-card { position:relative; width:100%; max-width:360px; margin:auto; left:auto; top:auto; transform:none; }
  .folder-home .folder-scroll:not(.is-animated) :is(.folder-envelope,.folder-back) { display:none; }
}
@media(max-width:760px) {
  .folder-home .site-header::before { inset:0 -20px; }
}

@media(max-width:760px) {
  .folder-home .folder-intro { padding-top:4px!important; }
  .folder-home .identity-row { margin-top:26px; }
}


@media(max-width:760px) { .folder-home .is-animated .folder-envelope > svg { display:block; position:absolute; inset:0; width:100%; height:100%; } }
/* On mobile, project context is readable without hover or tapping. */
@media(max-width:760px) {
  .folder-home .card-bottom { display:flex; flex-direction:column; gap:10px; }
  .folder-home .folder-card .card-default,
  .folder-home .folder-card .card-description { opacity:1; transition:none; }
  .folder-home .card-default :is(p,small) { font-weight:500!important; }
}
@media(max-width:760px) and (max-height:650px) {
  .folder-home .folder-card-art { height:42px; }
  .folder-home .card-bottom { gap:8px; }
}
