/* Final, scoped refinements to the established restaurant design. */
.button,
.button.light,
.header-order,
.contact-buttons .button,
.closing .button,
.hero-actions .button,
.mobile-order .button {
  background: #242a21;
  color: var(--text);
  border: 1px solid #c3aa7b80;
  transition: background .2s, border-color .2s, color .2s;
}

.button:hover,
.button.light:hover,
.button.outline:hover {
  background: #2c3428;
  color: var(--text);
  border-color: var(--gold);
}

.button:active { background: #20261e; }
.button svg { color: var(--gold); }
.contact-buttons .button { min-height: 52px; padding: 13px 20px; }

/* Additional contact channel, following the existing phone styling. */
.contact-email {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-top: 8px;
}
.contact-email,
.footer-email { overflow-wrap: anywhere; }

.secondary-brands img[src$="logo-kitchen.webp"] {
  width: 80px;
  height: auto;
  max-height: 40px;
  object-fit: contain;
}
.secondary-brands a[data-brand="kitchen"] { opacity: 1; }
.secondary-brands .papito-logo,
.mobile-kitchens .papito-logo {
  width: auto;
  height: 28px;
  object-fit: contain;
}
.secondary-brands a[data-brand="papito"] { opacity: 1; }
.mobile-kitchens > div { align-items: center; }

/* Retain the existing header height and controls on narrow laptop screens. */
@media (min-width: 1261px) and (max-width: 1320px) {
  .header-inner { gap: 12px; }
  .desktop-nav { gap: 10px; }
}

.kitchen-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  min-height: 0;
}

.kitchen-visual {
  position: relative;
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  width: 100%;
}

:is(#panel-sushi, #panel-kitchen, #panel-papito) .kitchen-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  /* Keep the uncropped image's inner edge the same distance from the copy. */
  object-position: right center;
}

.kitchen-copy { min-width: 0; padding-top: 0; padding-bottom: 0; }
.kitchen-copy .eyebrow { margin-top: 0; }

/* Position original artwork by its transparent bounds, without editing it.
   The shared slot follows the established Domino Sushi spacing. */
.kitchen-logo-frame {
  --mark-height: 62px;
  --mark-inset: 10px;
  position: relative;
  display: block;
  height: 82px;
  margin: 0 0 26px;
}
.kitchen-logo-frame .kitchen-logo {
  position: absolute;
  width: calc(var(--mark-height) * var(--mark-width-factor));
  height: calc(var(--mark-height) * var(--mark-height-factor));
  left: calc(var(--mark-height) * var(--mark-left-factor));
  bottom: calc(var(--mark-inset) + var(--mark-height) * var(--mark-bottom-factor));
  max-width: none;
  margin: 0;
  object-fit: contain;
  object-position: left center;
}
#panel-sushi .kitchen-logo-frame {
  /* Original 2400 x 1313; nontransparent bounds (30,32) to (2368,1281). */
  --mark-width-factor: 1.921537;
  --mark-height-factor: 1.051241;
  --mark-left-factor: -.024019;
  --mark-bottom-factor: -.025620;
}
#panel-kitchen .kitchen-logo-frame {
  /* Original 2048 x 682; nontransparent bounds (236,18) to (2014,675). */
  --mark-width-factor: 3.117199;
  --mark-height-factor: 1.038052;
  --mark-left-factor: -.359209;
  --mark-bottom-factor: -.010654;
}
#panel-papito .kitchen-logo-frame {
  /* Original 248 x 240; nontransparent bounds (38,34) to (209,206). */
  --mark-width-factor: 1.441860;
  --mark-height-factor: 1.395349;
  --mark-left-factor: -.220930;
  --mark-bottom-factor: -.197674;
}

/* The shared background also fills the image's letterbox area. */
.product-card,
.product-image { background: var(--surface-raised); }
.product-image { isolation: isolate; }
.product-image img { mix-blend-mode: lighten; }
.product-index { top: 18px; left: 18px; z-index: 1; }

.review-carousel {
  display: grid;
  max-width: 900px;
  margin: 0 auto;
  touch-action: pan-y;
}

.review-slide { grid-area: 1 / 1; align-self: center; }
.reviews blockquote { margin-bottom: 0; }
.review-credit { margin-top: 28px; }
.review-rating { color: var(--gold); font-variant-numeric: tabular-nums; }
.review-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 28px auto 22px;
}

.review-arrow,
.review-pause {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #c3aa7b70;
  border-radius: 50%;
  background: transparent;
  color: var(--gold);
  transition: background .2s, border-color .2s;
}

.review-arrow { font-size: 24px; line-height: 1; }
.review-pause { font-size: 15px; }
.review-arrow:hover,
.review-pause:hover { background: #2c3428; border-color: var(--gold); }
.review-indicators { display: flex; align-items: center; }
.review-indicator {
  display: grid;
  place-items: center;
  width: 26px;
  height: 44px;
  border: 0;
  padding: 0;
  background: transparent;
}

.review-indicator span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c3aa7b65;
  transition: background .2s, transform .2s;
}

.review-indicator[aria-pressed="true"] span {
  background: var(--gold);
  transform: scale(1.5);
}

@media (max-width: 1050px) {
  .kitchen-panel { min-height: 0; }
}

@media (max-width: 760px) {
  .kitchen-panel { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .kitchen-panel .kitchen-visual { aspect-ratio: 4 / 3; }
  /* Show the complete square Sushi photo 11.1% larger on mobile. */
  #panel-sushi .kitchen-visual { aspect-ratio: 6 / 5; }
  :is(#panel-sushi, #panel-kitchen, #panel-papito) .kitchen-visual > img { object-position: center; }
  .kitchen-logo-frame {
    --mark-height: 48px;
    --mark-inset: 8px;
    height: 65px;
    margin-bottom: 22px;
  }
  .product-index { top: 17px; left: 12px; }
  .review-controls { gap: 8px; margin-top: 24px; }
  .review-indicator { width: 21px; }
  .review-arrow,
  .review-pause { width: 40px; height: 44px; flex-shrink: 0; }
  .review-credit { line-height: 1.6; }
}

@media (max-width: 400px) {
  .review-controls { gap: 4px; }
  .review-indicator { width: 20px; }
}

/* One thin SVG family for link arrows, separate from carousel controls. */
.text-link.arrow-link,
.footer-social .arrow-link {
  gap: 12px;
  align-items: center;
}
.text-link.arrow-link > span[aria-hidden="true"] {
  display: inline-flex;
  align-items: center;
}
.link-arrow,
.button svg.action-arrow {
  display: block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  color: inherit;
}
.button.action-link { gap: 12px; }
.button svg.action-arrow { color: var(--gold); }
.footer-social .arrow-link {
  display: inline-flex;
  width: fit-content;
}
.footer-social .link-arrow { color: var(--gold); }
.strip-address.arrow-link { gap: 10px; align-items: center; }
.strip-address .link-arrow { width: 14px; height: 14px; flex-basis: 14px; }

@media (min-width: 761px) {
  .strip-address.arrow-link { display: inline-flex; }
}
/* Keep the existing SVG source and circular Papito artwork. */
#panel-sushi .kitchen-logo-source {
  display: contents;
}
#panel-sushi .kitchen-visual { background: transparent; }
#panel-papito .kitchen-visual { background: #090a0c; }