/* DiceHeart photo page headers (inc/page-headers.php) + per-page photo swaps.
   Loaded only on booking, events, menu, board games, shop and the two loyalty pages (/card/, /stamp/).
   The nav is fixed and transparent over the top 70px, so the header reserves that space. */

.ph2 {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 56vh; min-height: 56dvh;
  display: grid; align-items: end;
  margin: 0; padding: calc(70px + 2rem) 0 clamp(2.2rem, 5vw, 4rem);
  background: #0e0b06; color: #f0e8d8;
}
.ph2-bg { position: absolute; inset: 0; z-index: -2; }
.ph2-bg picture { display: block; width: 100%; height: 100%; }
.ph2-bg img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); display: block; }
.ph2-scrim {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(14, 11, 6, .55) 0%, rgba(14, 11, 6, .15) 30%, rgba(14, 11, 6, .35) 60%, rgba(14, 11, 6, .94) 100%),
    linear-gradient(90deg, rgba(14, 11, 6, .55) 0%, rgba(14, 11, 6, .1) 60%, transparent 100%);
}
.ph2-inner { max-width: 1200px; margin: 0 auto; padding: 0 2.5rem; width: 100%; }
.ph2-eyebrow {
  margin: 0 0 1rem; display: flex; align-items: center; gap: .9rem;
  font-family: 'Cinzel', serif; font-size: .64rem; letter-spacing: .3em; text-transform: uppercase; color: #c9913a;
}
.ph2-eyebrow::before { content: ''; width: 36px; height: 1px; background: #c9913a; opacity: .7; }
.ph2 h1 {
  font-family: 'Cinzel Decorative', serif; font-weight: 700; color: #f0e8d8;
  font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.1; margin: 0 0 .7rem; letter-spacing: .02em;
  text-shadow: 0 8px 36px rgba(0, 0, 0, .8);
}
.ph2-sub {
  font-family: 'IM Fell English', Georgia, serif; font-style: italic; font-size: 1.05rem; line-height: 1.6;
  color: #e8dcc4; max-width: 52ch; margin: 0;
}
.ph2 .ph2-inner > * { animation: ph2-up .8s cubic-bezier(.23, 1, .32, 1) both; }
.ph2 .ph2-inner > :nth-child(2) { animation-delay: .1s; }
.ph2 .ph2-inner > :nth-child(3) { animation-delay: .2s; }
@keyframes ph2-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.ph2 .ph2-inner > h1 { animation-name: ph2-slide; animation-delay: 0s; }
@keyframes ph2-slide { from { transform: translateY(10px); } to { transform: none; } }

.ph2-text {
  font-family: 'Caudex', Georgia, serif; font-size: .98rem; line-height: 1.7; color: #d8cdb6;
  max-width: 68ch; margin: 1.1rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(201, 145, 58, .25);
}
.ph2 .ph2-inner > :nth-child(4) { animation-delay: .3s; }

@media (max-width: 768px) {
  .ph2-text { font-size: .92rem; }
  .ph2 { min-height: 46vh; min-height: 46dvh; padding-top: calc(70px + 1rem); }
  .ph2-inner { padding: 0 1.25rem; }
  .ph2 h1 { font-size: clamp(1.7rem, 8vw, 2.4rem); }
  .ph2-sub { font-size: .98rem; }
}
@media (prefers-reduced-motion: reduce) {
  .ph2 .ph2-inner > * { animation: none; }
}

/* ---------------------------------------------------------------- per-page swaps */

/* booking: the old Elementor video hero is replaced by the header; the widget section gets the character sheet behind it */
body.dh-ph-booking .elementor-element-71e8b70 { display: none !important; }
body.dh-ph-booking .elementor-element-d12910a {
  background-image: linear-gradient(rgba(14, 11, 6, .72), rgba(14, 11, 6, .86)), url(/wp-content/themes/astra-child/img/photo/sheet-1920.webp) !important;
  background-size: cover !important; background-position: center !important; background-attachment: scroll !important;
}

/* events: the empty spacer section above the list is not needed under a photo header */
body.dh-ph-events .elementor-element-9242da3 { display: none !important; }

/* menu: the stock fireplace behind the flipbook becomes the café itself */
body.dh-ph-menu .elementor-element-eda7a6b {
  background-image: linear-gradient(rgba(14, 11, 6, .62), rgba(14, 11, 6, .78)), url(/wp-content/themes/astra-child/img/photo/room5-1920.webp) !important;
  background-size: cover !important; background-position: center 40% !important;
}

/* board games: keep the page's own hero, swap its phone photo for the professional shelf shot */
body.dh-ph-boardgames .ph-bg {
  background-image: url(/wp-content/themes/astra-child/img/photo/shelf-1200.webp) !important;
  background-position: center 45% !important;
  filter: brightness(.55) saturate(.85) !important;
}

/* shop: Astra's plain archive title is replaced by the header */
body.dh-ph-shop .ast-archive-description { display: none !important; }
body.dh-ph-shop #content { padding-top: 1.5rem; }

/* ---------------------------------------------------------------- loyalty pages (diceheart-loyalty plugin)
   /card/ ([dh_loyalty_card]) and /stamp/ ([dh_loyalty_stamp]) are plain Astra pages, not Elementor ones, so Astra's
   boxed layout paints them white. Everything below is scoped to body.dh-loyalty (added in inc/page-headers.php); the
   plugin's own CSS styles the card / staff screen and reads the theme's --bg, --gold ... variables. */

/* dark page: body and every Astra layer around the content (the stamp screen's sticky button dock fades into #0e0b06) */
body.dh-loyalty { background: #0e0b06 !important; color: #f0e8d8; }
body.dh-loyalty #page,
body.dh-loyalty #content,
body.dh-loyalty #primary,
body.dh-loyalty .site-content,
body.dh-loyalty .ast-separate-container,
body.dh-loyalty .ast-separate-container #primary,
body.dh-loyalty .ast-article-single,
body.dh-loyalty .ast-separate-container .ast-article-single,
body.dh-loyalty .entry-content { background: transparent !important; color: #f0e8d8; }

/* single narrow column: no sidebar, none of Astra's boxed-article padding */
body.dh-loyalty #secondary { display: none !important; }
body.dh-loyalty .ast-container { display: block; max-width: 100%; padding: 0 1rem; }
body.dh-loyalty #primary { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
body.dh-loyalty .ast-article-single,
body.dh-loyalty .ast-separate-container .ast-article-single { margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none; }
body.dh-loyalty .entry-content { margin: 0; padding: 0; }
body.dh-loyalty .entry-content > * { margin-top: 0; margin-bottom: 0; }

/* /card/: the photo header carries the H1, so Astra's own title is dropped; the card sits under it */
body.dh-ph-card .entry-header { display: none; }
body.dh-ph-card .ph2 { min-height: 38vh; min-height: 38dvh; padding-bottom: clamp(1.8rem, 4vw, 3rem); }
body.dh-ph-card .ph2-eyebrow { margin-bottom: .8rem; }
body.dh-ph-card #content { padding: clamp(1.5rem, 4vw, 2.5rem) 0 clamp(3rem, 8vw, 5rem); }

/* /stamp/: plain dark page, no photo; room under the fixed nav. Astra's H1 stays for screen readers but is not
   shown (the staff screen prints its own titles, and every pixel counts on a phone held in one hand). */
body.dh-ph-stamp #content { padding: calc(70px + 1.5rem) 0 clamp(2.5rem, 6vw, 4rem); }
body.dh-ph-stamp .entry-header {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
}

/* the staff login box is printed by the plugin with no CSS of its own (visitors get no plugin stylesheet) */
body.dh-ph-stamp .dhl-stamp-login {
  box-sizing: border-box; max-width: 420px; margin: 0 auto; padding: 1.6rem 1.25rem 1.5rem; text-align: center;
  border: 1px solid rgba(201, 145, 58, .25); border-radius: 18px;
  background: linear-gradient(180deg, rgba(201, 145, 58, .08), transparent 40%) #1f1609;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .5);
}
body.dh-ph-stamp .dhl-stamp-login p {
  margin: 0 0 1.1rem; color: #f2e8d5;
  font-family: 'IM Fell English', 'Caudex', Georgia, serif; font-size: 1.15rem; line-height: 1.5;
}
body.dh-ph-stamp .dhl-stamp-login p:last-child { margin-bottom: 0; }
body.dh-ph-stamp .dhl-stamp-login .dhl-stamp-login-btn {
  display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
  min-width: 11rem; min-height: 52px; margin: 0; padding: .7rem 2rem;
  border: 2px solid #c9913a; border-radius: 999px; background: #c9913a; color: #0e0b06;
  font: 700 1.05rem/1.2 'Cinzel', 'Caudex', Georgia, serif; letter-spacing: .04em; text-decoration: none;
  touch-action: manipulation; transition: background-color .15s ease, border-color .15s ease;
}
body.dh-ph-stamp .dhl-stamp-login .dhl-stamp-login-btn:hover { background: #e8b96a; border-color: #e8b96a; color: #0e0b06; }
body.dh-ph-stamp .dhl-stamp-login .dhl-stamp-login-btn:focus-visible { outline: 3px solid #e8b96a; outline-offset: 3px; }

@media (max-width: 768px) {
  body.dh-ph-card .ph2 { min-height: 32vh; min-height: 32dvh; }
}