/* A shared acceptance list, followed by a server-rendered booking illustration. */
body.homepage .payment-methods { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0; padding: 0; list-style: none; }
body.homepage .payment-method { display: flex; align-items: center; justify-content: center; gap: .375rem; min-width: 5.5rem; min-height: 4rem; padding: 0 .375rem; color: var(--ink); font-size: .8125rem; font-weight: 500; }
body.homepage .payment-method img { display: block; max-width: 100%; height: auto; object-fit: contain; }
body.homepage .payment-method--apple img { width: 3.875rem; }
body.homepage .payment-method--google img { width: 5.75rem; }
body.homepage .payment-method--mbway img { width: 4.25rem; }
body.homepage .payment-method--card { align-self: center; justify-self: center; min-height: 2.5rem; padding: .4375rem .625rem; border: 1px solid var(--line); border-radius: .4375rem; background: var(--paper); }
body.homepage .payment-method--card .site-icon { width: 1.375rem; height: 1.375rem; flex-shrink: 0; }
body.homepage .payment-hero { margin-top: 1.125rem; }
body.homepage .payment-hero > p { margin-bottom: .5rem; color: var(--primary); font-size: .8125rem; font-weight: 500; }
body.homepage .payment-hero .payment-methods { gap: .375rem; }
body.homepage .payment-hero .payment-method { min-width: 5rem; padding-inline: .375rem; }
body.homepage .pricing-payment-offer { padding: 1.75rem 2rem 1rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--accent-soft); }
body.homepage .pricing-payment-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2.5rem; }
body.homepage .pricing-payment-heading .eyebrow { color: var(--primary); font-size: .6875rem; }
body.homepage .pricing-payment-heading h2 { margin-block: .625rem .75rem; font-size: clamp(1.1875rem, 2vw, 1.625rem); letter-spacing: -.04em; line-height: 1.5; }
body.homepage .pricing-payment-heading > div > p:last-child { max-width: 43rem; color: color-mix(in srgb, var(--ink) 75%, var(--paper)); font-size: .875rem; line-height: 1.75; }
body.homepage .pricing-payment-heading > .payment-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; min-width: 13rem; }
body.homepage .payment-method-details { margin-top: 1.25rem; border-top: 1px solid color-mix(in srgb, var(--ink) 15%, transparent); }
body.homepage .payment-method-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; padding-block: .625rem; list-style: none; color: var(--primary); font-size: .8125rem; font-weight: 500; cursor: pointer; }
body.homepage .payment-method-details > summary::marker { content: ''; }
body.homepage .payment-method-details > summary::-webkit-details-marker { display: none; }
body.homepage .payment-method-details > summary > .site-icon { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
body.homepage .payment-method-details[open] > summary > .site-icon { transform: rotate(180deg); }
body.homepage .payment-method-details > p { max-width: 52rem; margin-block: .4375rem .875rem; color: color-mix(in srgb, var(--ink) 75%, var(--paper)); font-size: .8125rem; line-height: 1.75; }
body.homepage .payment-method-details a { display: inline-flex; align-items: center; gap: .3125rem; min-height: 2.75rem; color: var(--primary); text-decoration: underline; text-underline-offset: .1875rem; }
body.homepage .payment-method-details a > .site-icon { width: 1rem; height: 1rem; flex-shrink: 0; }
body.homepage .business-payment-offer { padding-block: 2.5rem; border-bottom: 1px solid var(--line); }
body.homepage .business-payments-heading { display: grid; grid-template-columns: 1.1fr 1fr; align-items: end; gap: 2rem; margin-bottom: 1.25rem; }
body.homepage .business-payments-heading .business-eyebrow { color: var(--primary); font-size: .6875rem; font-weight: 600; letter-spacing: .11em; line-height: 1.6; text-transform: uppercase; }
body.homepage .business-payments-heading h2 { margin-top: .625rem; font-size: clamp(1.4375rem, 3vw, 2.0625rem); line-height: 1.4; letter-spacing: -.055em; }
body.homepage .business-payments-heading h2 > span { color: var(--primary); }
body.homepage .business-payments-heading > p { max-width: 28rem; justify-self: end; color: var(--muted); font-size: .9375rem; line-height: 1.75; }
body.homepage .business-payment-journey { margin: 0; padding: 1rem 1.25rem 1.25rem; border: 1px solid color-mix(in srgb, var(--primary) 12%, transparent); border-radius: .875rem; background: var(--lavender); }
body.homepage .business-payment-journey > figcaption { margin-bottom: .875rem; color: var(--muted); font-size: .6875rem; text-align: right; }
body.homepage .business-payment-steps { display: grid; grid-template-columns: 1fr .9fr 1.1fr; gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
body.homepage .business-payment-step { display: flex; min-width: 0; flex-direction: column; }
body.homepage .business-payment-step-label { display: flex; align-items: center; gap: .5rem; margin-bottom: .625rem; font-size: .8125rem; font-weight: 600; }
body.homepage .business-payment-step-label > span { display: grid; place-items: center; flex-shrink: 0; width: 1.625rem; height: 1.625rem; border: 1px solid color-mix(in srgb, var(--primary) 25%, transparent); border-radius: 50%; color: var(--primary); font-size: .6875rem; font-weight: 500; }
body.homepage .business-payment-pair { display: grid; grid-template-rows: 1fr 1fr; flex: 1; gap: .75rem; }
body.homepage .business-payment-example { min-width: 0; border: 1px solid var(--line); border-radius: .625rem; background: var(--paper); }
body.homepage .business-payment-choice { padding: .875rem 1rem; }
body.homepage .business-payment-choice-top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .375rem; }
body.homepage .business-payment-choice-top > span { display: flex; align-items: center; gap: .375rem; color: var(--primary); font-size: .6875rem; }
body.homepage .business-payment-choice-top .site-icon { width: 1rem; height: 1rem; flex-shrink: 0; }
body.homepage .business-payment-choice-top > strong { font-size: 1rem; font-weight: 600; white-space: nowrap; }
body.homepage .business-payment-choice h3, body.homepage .business-payment-booking h3, body.homepage .business-payment-ticket h3 { margin-block: 0 .25rem; font-size: .875rem; line-height: 1.5; }
body.homepage .business-payment-choice > p, body.homepage .business-payment-outcome-time { color: var(--muted); font-size: .6875rem; line-height: 1.6; }
body.homepage .business-payment-checkout { display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 1rem; border-color: color-mix(in srgb, var(--primary) 45%, var(--paper)); box-shadow: 0 .375rem 1rem color-mix(in srgb, var(--primary) 6%, transparent); }
body.homepage .business-payment-options-label { margin-bottom: .625rem; color: var(--primary); font-size: .75rem; font-weight: 500; text-align: center; }
body.homepage .payment-methods--checkout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .375rem; }
body.homepage .payment-methods--checkout .payment-method { min-width: 0; min-height: 3.5rem; padding-inline: .25rem; }
body.homepage .payment-methods--checkout .payment-method--card { min-height: 2.5rem; padding-inline: .625rem; }
body.homepage .business-payment-checkout-note { margin-top: .625rem; color: var(--muted); font-size: .6875rem; line-height: 1.6; text-align: center; }
body.homepage .business-payment-booking, body.homepage .business-payment-ticket { display: flex; align-items: center; gap: .75rem; padding: .875rem 1rem; }
body.homepage .business-payment-booking > div, body.homepage .business-payment-ticket > div { min-width: 0; }
body.homepage .business-payment-confirmed-icon { display: grid; place-items: center; flex-shrink: 0; width: 2.25rem; height: 2.25rem; border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent); border-radius: 50%; background: var(--lavender); color: var(--primary); }
body.homepage .business-payment-confirmed-icon .site-icon { width: 1.25rem; height: 1.25rem; }
body.homepage .business-payment-outcome-label { margin-bottom: .375rem; color: var(--primary); font-size: .6875rem; font-weight: 500; line-height: 1.5; }
body.homepage .business-payment-ticket { justify-content: space-between; border-style: dashed; }
body.homepage .business-payment-ticket-qr { flex-shrink: 0; width: 3.25rem; height: 3.25rem; padding: .25rem; color: var(--ink); background: var(--paper); }
body.homepage .business-payments-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .625rem; font-size: .8125rem; }
body.homepage .business-payments-footer > p { color: var(--muted); }
body.homepage .business-payments-footer > a { display: inline-flex; align-items: center; gap: .4375rem; min-height: 2.75rem; color: var(--primary); text-decoration: underline; text-underline-offset: .1875rem; }
body.homepage .business-payments-footer .site-icon { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
body.homepage .business-payments-availability { margin-top: .25rem; color: var(--muted); font-size: .6875rem; line-height: 1.7; }
@media (max-width: 68.75rem) {
  body.homepage .business-payment-steps { gap: .875rem; }
  body.homepage .business-payment-choice, body.homepage .business-payment-checkout, body.homepage .business-payment-booking, body.homepage .business-payment-ticket { padding-inline: .75rem; }
}
@media (max-width: 50rem) {
  body.homepage .pricing-payment-offer { padding: 1.5rem 1.5rem .875rem; }
  body.homepage .pricing-payment-heading { grid-template-columns: 1fr; gap: 1.25rem; }
  body.homepage .pricing-payment-heading > .payment-methods { display: flex; min-width: 0; gap: .5rem; }
  body.homepage .business-payments-heading { grid-template-columns: 1fr; gap: .75rem; }
  body.homepage .business-payments-heading > p { max-width: 36rem; justify-self: start; }
  body.homepage .business-payment-journey > figcaption { text-align: left; }
  body.homepage .business-payment-steps { grid-template-columns: 1fr; gap: 1rem; }
  body.homepage .business-payment-pair { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  body.homepage .business-payment-checkout { padding: .875rem 1rem; }
  body.homepage .business-payment-checkout .payment-methods--checkout { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 30rem; width: 100%; margin-inline: auto; }
  body.homepage .business-payments-footer { display: block; }
  body.homepage .business-payments-footer > a { margin-top: .25rem; }
}
@media (max-width: 32.5rem) {
  body.homepage .payment-methods, body.homepage .pricing-payment-heading > .payment-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 20rem; }
  body.homepage .payment-method { min-width: 0; }
  body.homepage .payment-hero .payment-method { min-width: 0; }
  body.homepage .pricing-payment-offer { padding: 1.25rem 1.25rem .75rem; }
  body.homepage .business-payment-offer { padding-block: 2rem; }
  body.homepage .business-payment-journey { padding: .875rem; }
  body.homepage .business-payment-pair { grid-template-columns: 1fr; gap: .625rem; }
  body.homepage .business-payment-checkout .payment-methods--checkout { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 17rem; }
}
