/* =================== page-hero.css =================== */
.page-hero__quicklink {
position: relative; overflow: hidden; transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease; padding: 6px 14px; background: rgba(255, 255, 255, 0.6); border: 0.5px solid rgba(180, 151, 115, 0.18); border-radius: 999px; text-decoration: none; color: var(--hc-ink-mid, rgba(26, 23, 20, 0.7)); font-size: 13px; display: inline-flex; align-items: center
}
.page-hero__quicklink::before {
content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, var(--hc-glow-color), transparent 60%); opacity: 0; transition: opacity 0.3s ease; z-index: -1
}
.page-hero__quicklink:hover {
transform: translateY(-1px); border-color: rgba(185, 154, 111, 0.42); color: var(--hc-ink, #1a1714); background: var(--hc-paper, #ffffff)
}
.page-hero__quicklink:hover::before {
opacity: 1
}
.page-hero, .cp-hero {
position: relative; padding: var(--hc-sp-8) 0 var(--hc-sp-7); background: var(--hc-bg-warm); overflow: hidden; margin-bottom: var(--hc-sp-6)
}
.page-hero__surface, .cp-hero__body {
position: relative; z-index: 2; max-width: 820px; padding: var(--hc-sp-6); background: linear-gradient(135deg, rgba(248,246,243,.85), rgba(248,246,243,.72)); backdrop-filter: blur(3px); border-radius: var(--hc-r-xl)
}
.page-hero__eyebrow {
display: inline-block; font-family: var(--hc-mono, "JetBrains Mono", monospace); letter-spacing: 0.14em; text-transform: uppercase; font-size: 11px; color: var(--hc-accent-dark, #7a6548); margin-bottom: 8px
}
.page-hero__title {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif); font-size: clamp(28px, 4vw, 48px); line-height: 1.05; letter-spacing: var(--hc-ls-tight); margin: 0 0 12px; font-weight: 400; color: var(--hc-ink, #1a1714)
}
.page-hero__lede {
font-size: clamp(15px, 1.4vw, 17px); color: var(--hc-ink-mid, rgba(26, 23, 20, 0.7)); line-height: 1.5; max-width: 60ch; margin: 0 0 16px
}
.page-hero__quicklinks {
display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px
}
.page-delivery .page-hero, .page-static .page-hero {
padding: clamp(26px,3.4vw,40px) 0 clamp(20px,2.8vw,32px); margin-bottom: clamp(14px,1.8vw,24px)
}

.page-hero {
position: relative; overflow: hidden; padding: clamp(20px, 2.6vw, 32px) 0 clamp(16px, 2vw, 24px); margin-bottom: clamp(12px, 1.6vw, 20px)
}
.page-hero__bgfx {
position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden
}
.page-hero__mesh {
position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.5
}
.page-hero__orb {
position: absolute; width: clamp(220px, 28vw, 360px); height: clamp(220px, 28vw, 360px); border-radius: 50%; background: radial-gradient(circle, rgba(212, 184, 150, 0.22) 0%, transparent 70%); filter: blur(40px); pointer-events: none; animation: hz-orb-float 18s ease-in-out infinite
}
.page-hero__orb--a {
top: -8%; right: -6%
}
.page-hero__orb--b {
bottom: -10%; left: -8%; animation-delay: -9s
}
.page-hero__surface {
max-width: min(960px, 100%); padding: clamp(20px, 2.4vw, 32px); background: rgba(255, 252, 247, 0.7); backdrop-filter: blur(12px); border: 0.5px solid rgba(180, 151, 115, 0.18); border-radius: 18px; box-shadow: 0 1px 2px rgba(27, 20, 13, 0.04), 0 12px 40px rgba(27, 20, 13, 0.06)
}
.page-hero:empty, .page-hero > .hc-wrap:empty {
display: none
}
@media(max-width:1024px) {
  .page-hero, .hc-page-hero {background: linear-gradient(160deg, var(--hc-bg-warm, #f5efde) 0%, var(--hc-paper-3, #ede2c9) 100%); border: 0.5px solid var(--hc-gold-border, rgba(212, 184, 150, 0.32)); border-radius: 24px; padding: 48px 56px; margin-bottom: 32px; position: relative; overflow: hidden}
}

.page-hero__orb {
animation-timing-function: cubic-bezier(0.45, 0.05, 0.55, 0.95);
  animation-duration: 9s;
}

.page-blog-detail .page-hero__pill-bar {
display: none
}

.page-delivery .page-hero__surface, .page-static .page-hero__surface {
max-width: min(980px,100%); padding: clamp(18px,2.1vw,28px)
}