/* Phones only: the three things people open an ice cream shop's site to do,
   kept under the thumb once the hero has scrolled away. */
.dock{display:none}
@media(max-width:700px){
  .dock{position:fixed;z-index:90;left:50%;bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;gap:4px;width:max-content;max-width:calc(100% - 24px);padding:5px;border:2px solid var(--ink);border-radius:40px;background:var(--paper);box-shadow:3px 4px 0 var(--ink);transform:translate(-50%,calc(100% + 34px));visibility:hidden;transition:transform .45s var(--ease),visibility 0s .45s}
  .dock.is-up{transform:translate(-50%,0);visibility:visible;transition:transform .45s var(--ease),visibility 0s}
  .dock__a{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:0 15px;border-radius:30px;color:var(--ink);font-size:.86rem;font-weight:700;line-height:1;white-space:nowrap}
  .dock__a svg{flex:none;width:18px;height:18px}
  .dock__a--main{background:var(--ice);color:#fff}
  .dock__a:active{background:var(--ice-pale)}
  .dock__a--main:active{background:var(--ice-deep)}
  .dock__a:focus-visible{outline-offset:1px}
}
@media(max-width:350px){.dock__a{padding:0 11px;font-size:.8rem;gap:5px}}
@media(prefers-reduced-motion:reduce){.dock,.dock.is-up{transition:none}}