/* About photo (proposal, 13 Nov 2026). Loaded only on /about. */
.ab-me-l{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s5)}
.ab-face{display:block;width:clamp(180px,19vw,260px);height:auto;margin-left:-6px;transform:rotate(-3deg);filter:drop-shadow(0 22px 34px rgba(0,0,0,.55));transition:transform .6s var(--ease)}
.ab-face:hover{transform:rotate(2deg) scale(1.03)}
@media (max-width:820px){
  .ab-me-l{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--s4)}
  .ab-face{width:clamp(108px,32vw,150px);margin:0 -4px 0 0}
}
@media (prefers-reduced-motion:reduce){.ab-face,.ab-face:hover{transition:none;transform:rotate(-3deg)}}
/* About: Fluq project block links to /projects/fluq (proposal, 13 Nov 2026) */
a.tile.ab-proj{grid-template-columns:auto 1fr auto}
a.tile.ab-proj:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:var(--r-lg);transform:translateY(-6px) rotate(-.4deg);box-shadow:var(--mat),0 28px 60px -24px var(--c)}
a.tile.ab-proj:focus-visible::before{opacity:1}
a.tile.ab-proj:focus-visible .go{opacity:1;transform:rotate(-45deg);background:rgba(255,255,255,.14)}
@media (max-width:560px){a.tile.ab-proj{grid-template-columns:auto 1fr}}
@media (prefers-reduced-motion:reduce){a.tile.ab-proj:focus-visible{transform:none}}