/* Homepage-only styles, 2026-11-01. Shared rules live in site-pass.css, which loads first. */

/* Catering services: food icons replace the 01 to 04 numbers */
.home-page .service-list summary{display:flex;align-items:center;gap:18px}
.home-page .service-icon{width:38px;height:38px;flex:none;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.home-page .service-list details[open] .service-icon,.home-page .service-list summary:hover .service-icon{transform:rotate(-8deg) scale(1.08)}
.home-page .service-all-link{margin-top:26px}

/* Package photos zoom slightly on hover */
.home-page .package-image{overflow:hidden}
.home-page .package-image img{transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.home-page .package-card:hover .package-image img{transform:scale(1.05)}

/* Guest feedback: two real quotes */
.home-page .guest-feedback-two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.home-page .guest-feedback-two{grid-template-columns:1fr}}

/* Manager help waits until the ordering tiles are passed */
.home-page.help-deferred .floating-help{opacity:0;visibility:hidden;translate:0 10px}

/* Phone: ordering box text stacks instead of running together */
@media(max-width:760px){
  .home-page .launcher-direct>span,.home-page .launcher-direct>strong,.home-page .launcher-direct>small{display:block}
  .home-page .launcher-direct>strong{margin:6px 0 4px}
}

@media(prefers-reduced-motion:reduce){
  .home-page .service-icon,.home-page .package-image img{transition:none}
}

/* Homepage ordering tiles size to however many delivery apps are listed (Grubhub removed site-wide at the client's request, 2026-11-01) */
@media(min-width:601px){.home-page .launcher-providers{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}}

/* Business cards are equal choices: same width, no highlighted middle card */
@media(min-width:901px){.home-page .business-offerings{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Business intro: one short sentence and a link whose arrow sits right beside it */
.home-page .business-intro-copy>p{font-size:17px;line-height:1.6;max-width:400px;margin-bottom:16px}
.home-page .business-page-link{gap:8px}

/* Ordering tiles: on hover or keyboard focus, each delivery logo fills with its own brand color.
   Two stacked images (black + brand-color copy) instead of a CSS mask: Chrome blocks mask images on pages opened as files. */
.home-page .launcher-provider-logo{position:relative;inset:auto;margin:0;display:block;width:110px;height:52px;flex-shrink:0}
.home-page .launcher-provider-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:left center;transition:opacity .3s}
.home-page .launcher-provider-logo .logo-color{opacity:0}
.home-page .launcher-providers>a:hover .launcher-provider-logo .logo-color,.home-page .launcher-providers>a:focus-visible .launcher-provider-logo .logo-color{opacity:1}
.home-page .launcher-providers>a:hover .launcher-provider-logo img:not(.logo-color),.home-page .launcher-providers>a:focus-visible .launcher-provider-logo img:not(.logo-color){opacity:0}
.home-page .launcher-providers small span{display:inline-block;transition:transform .25s}
.home-page .launcher-providers>a:hover small span,.home-page .launcher-providers>a:focus-visible small span{transform:translate(3px,-3px)}
.home-page .launcher-direct b span{display:inline-block;transition:transform .25s}
.home-page .launcher-direct:hover b span{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.home-page .launcher-provider-logo img,.home-page .launcher-direct b span,.home-page .launcher-providers small span{transition:none}}
.home-page .launcher-providers>a:hover,.home-page .launcher-providers>a:focus-visible{background:transparent}
