/* group-orders-2: Group order is the headline feature of the front page. */
.go-hero{margin:.25rem 0 1rem;padding:1rem 1.1rem;border:3px solid var(--c-accent);border-radius:1rem;background:var(--c-surface)}
.go-hero-h{margin:0 0 .35rem;font-size:1.6rem;line-height:1.2;color:var(--c-heading)}
.go-hero-what{margin:0 0 .75rem;font-size:1.05rem;line-height:1.45;color:var(--c-text);overflow-wrap:anywhere}
.go-hero-actions,.go-hero-pending{display:flex;flex-wrap:wrap;gap:.6rem;margin:0}
.go-hero-pending{margin-top:.6rem}
.go-hero-pending[hidden]{display:none}
.go-hero .btn{min-height:var(--tap-min,44px)}
.go-hero-btn{flex:1 1 100%;font-size:1.5rem;min-height:4.5rem}
@media (min-width:48rem){.go-hero-btn{flex:0 1 auto;min-width:22rem}}
.go-hero-pending .btn{flex:1 1 100%}
@media (min-width:48rem){.go-hero-pending .btn{flex:0 1 auto;min-width:22rem}}
/* wide screens: the home top area is two columns; the headline spans both, above the tiles */
@media (min-width:1000px){
  #homeTop>.go-hero{grid-column:1/-1;grid-row:1}
  #homeTop .tiles{grid-row:2/4}
  #homeTop .board{grid-row:4}
  .go-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem 2rem;align-items:center}
  .go-hero-h,.go-hero-what{grid-column:1}
  .go-hero-actions{grid-column:2;grid-row:1/3}
  .go-hero-pending{grid-column:2;margin-top:0}
}