html {
  scroll-behavior: smooth;
}

/* Radial vignette behind the hero, closer to the reference banner than a flat linear gradient */
.hero-bg {
  background: radial-gradient(ellipse at center, #2a160a 0%, #1a0e08 70%);
}

/* Faint paisley/ring texture: a handful of large, low-opacity concentric circles, decorative only */
.paisley-texture {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.06;
  background-image:
    radial-gradient(circle at 15% 25%, transparent 0 38px, #c89b3c 39px 40px, transparent 41px),
    radial-gradient(circle at 85% 20%, transparent 0 54px, #c89b3c 55px 56px, transparent 57px),
    radial-gradient(circle at 20% 80%, transparent 0 60px, #c89b3c 61px 62px, transparent 63px),
    radial-gradient(circle at 80% 75%, transparent 0 44px, #c89b3c 45px 46px, transparent 47px);
}

/* Ornate open-corner gold frame, applied to the hero content box and menu cards */
.frame-corners {
  position: relative;
}

.frame-corners > .corner-tl,
.frame-corners > .corner-tr,
.frame-corners > .corner-bl,
.frame-corners > .corner-br {
  content: "";
  position: absolute;
  width: 22px;
  height: 22px;
  border-color: #8a6d2f;
  pointer-events: none;
}

.frame-corners > .corner-tl {
  top: 10px;
  left: 10px;
  border-top: 2px solid #8a6d2f;
  border-left: 2px solid #8a6d2f;
}

.frame-corners > .corner-tr {
  top: 10px;
  right: 10px;
  border-top: 2px solid #8a6d2f;
  border-right: 2px solid #8a6d2f;
}

.frame-corners > .corner-bl {
  bottom: 10px;
  left: 10px;
  border-bottom: 2px solid #8a6d2f;
  border-left: 2px solid #8a6d2f;
}

.frame-corners > .corner-br {
  bottom: 10px;
  right: 10px;
  border-bottom: 2px solid #8a6d2f;
  border-right: 2px solid #8a6d2f;
}