.hero { display: flex; flex: 1 1 auto; flex-direction: column; align-items: center; justify-content: center; max-width: 1100px; min-height: 0; padding: 1rem 6vw; text-align: center; }
.heroTitle { max-width: 11.5em; margin: 0 0 clamp(1rem, 3.5dvh, 2.2rem); font-size: clamp(1.7rem, 4.4vw, 3.2rem); line-height: 1.25; text-wrap: balance; }
.heroTitle .word { display: inline-block; animation: wordIn var(--dur) var(--ease) calc(var(--i) * var(--step) * .7 + var(--step)) backwards; }
@keyframes wordIn { from { opacity: 0; transform: translateY(.55em); } }
.homeIcon { flex: 0 1 auto; width: auto; max-width: min(300px, 70vw); height: min(40dvh, 320px); overflow: visible; aspect-ratio: 240 / 260; color: var(--colorInk); }
.homeIcon .stroke { fill: none; stroke: currentColor; stroke-width: 8; stroke-linecap: round; stroke-linejoin: round; }
.homeIcon .badge { fill: var(--colorBg); }
.homeIcon .ring { fill: none; stroke: currentColor; stroke-width: 2; opacity: 0; transform-box: fill-box; transform-origin: center; animation: ring calc(var(--loop) * 2) ease-out infinite; }
.homeIcon .ringLate { animation-delay: var(--loop); }
.homeIcon .shadow { fill: currentColor; opacity: .12; transform-box: fill-box; transform-origin: center; animation: shadowBeat calc(var(--loop) * 1.5) ease-in-out infinite; }
.boxGroup { animation: float calc(var(--loop) * 1.5) ease-in-out infinite; }
.badgeGroup { transform-box: fill-box; transform-origin: center; animation: pop var(--dur) cubic-bezier(.34, 1.56, .64, 1) calc(var(--step) * 7) backwards; }
.homeIcon .check { stroke-dasharray: 60; animation: drawCheck var(--dur) var(--ease) calc(var(--step) * 12) backwards; }
@keyframes ring { from { opacity: .28; transform: scale(.55); } to { opacity: 0; transform: scale(1.15); } }
@keyframes shadowBeat { 50% { opacity: .06; transform: scale(.8); } }
@keyframes pop { from { opacity: 0; transform: scale(0); } }
@keyframes drawCheck { from { stroke-dashoffset: 60; } }
html.isHome, html.isHome body { overflow: hidden; }
html.isHome { height: 100dvh; }
html.isHome body { height: 100%; min-height: 0; }
.siteFooter { flex: none; padding: 1.1rem 6vw calc(1.1rem + var(--safeBottom)); font-size: .85rem; text-align: center; animation: revealIn var(--dur) var(--ease) calc(var(--step) * 14) backwards; }
.siteFooter p { margin: 0; opacity: .75; }
.footerNav { display: flex; flex-wrap: wrap; justify-content: center; gap: .1rem 1.4rem; margin-bottom: .5rem; }
.footerLink { padding: .45rem 0; background: linear-gradient(currentColor, currentColor) no-repeat left bottom / 0 2px; font-size: .9rem; font-weight: 600; transition: background-size var(--dur) var(--ease); }
.footerLink:hover { background-size: 100% 2px; }
@media (pointer: coarse) { .footerLink { padding: .65rem 0; } }
@media (max-width: 640px) {
  .hero { padding: .75rem 7vw; }
  .heroTitle { max-width: 100%; font-size: clamp(1.5rem, 7vw, 2rem); }
  .siteFooter { padding-top: .9rem; font-size: .75rem; }
}
@media (max-height: 640px) {
  .homeIcon { height: 30dvh; }
  .heroTitle { margin-bottom: .8rem; }
}
@media (max-height: 520px) {
  html.isHome { height: auto; min-height: 100dvh; overflow: auto; }
  html.isHome body { height: auto; overflow: visible; }
  .hero { padding: 1.5rem 6vw; }
  .homeIcon { height: 200px; }
}