/* Small additions on top of the shared portfolio stylesheet (../web-development/styles.css) */
.hero__aka { font: 600 0.72rem/1.4 var(--font-mono, ui-monospace, monospace); letter-spacing: 0.16em; text-transform: uppercase; color: #fff; opacity: 0.92; text-align: center; max-width: 90%; }
.aka { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; margin-top: 1.25rem; list-style: none; padding: 0; }
.aka li { padding: 0.55rem 1rem; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 99rem; font-size: 0.85rem; font-weight: 800; font-stretch: 85%; letter-spacing: 0.04em; text-transform: uppercase; }
.intro .display { overflow-wrap: anywhere; }
img { -webkit-user-drag: none; -webkit-touch-callout: none; }

.go-back {
  position: fixed; left: 50%; bottom: 1.1rem; transform: translateX(-50%); z-index: 90;
  display: inline-flex; align-items: center; gap: 0.6rem; min-height: 3rem; padding: 0 1.6rem;
  background: var(--text, #f5f5f5); color: #080808; border: 2px solid #080808; border-radius: 99rem;
  font-size: 1.05rem; font-weight: 800; font-stretch: 68%; letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none;
  box-shadow: 0 0.25rem 0 #080808, 0 0.9rem 1.8rem rgba(0, 0, 0, 0.4); transition: transform 0.15s, box-shadow 0.15s;
}
.go-back:active { transform: translateX(-50%) translateY(0.2rem); box-shadow: 0 0 0 #080808; }
@media (hover: hover) and (pointer: fine) { .go-back:hover { transform: translateX(-50%) translateY(0.12rem); box-shadow: 0 0.12rem 0 #080808, 0 0.9rem 1.8rem rgba(0, 0, 0, 0.4); } }
@media (max-width: 899.98px) { .to-top { bottom: 4.6rem; } }
/* keep the floating Go Back button clear of the hero buttons on the first screen */
.hero__panel { padding-bottom: clamp(5.25rem, 9vw, 6.5rem); }
/* sections that follow a checker strip need their own top spacing */
#what, #stack { padding-top: var(--section-y); }
#what .specs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 899.98px) { #what .specs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 559.98px) { #what .specs { grid-template-columns: 1fr; } }
/* longer wordmark than ELIJAH / DEV, so scale it down to fit */
.footer__wordmark { font-size: 10.1vw; }
