/* =========================================================
   Detail pages
   Each menu (marriage / corporate / about / birthday / reach)
   now lives on its own page. The blob "open" animation plays on
   index.html and then redirects here, where the content is shown
   as the already-opened panel over a background that matches the
   colour of that menu's blob.
   ========================================================= */

/* The base theme hides the body (.js body { opacity:0 }) until the
   home page's animation script adds the .render class. Detail pages
   don't run that script, so reveal the body here. */
body.detail-page {
  opacity: 1 !important;
}

/* Reveal the panel (on index it starts hidden until the blob opens) */
body.detail-page .content--reveal.detail-reveal {
  pointer-events: auto;
}

body.detail-page .content__inner {
  opacity: 1 !important;
  background: transparent !important;
}

/* Back-to-home arrow stays visible and pinned while scrolling */
body.detail-page .content__close {
  position: fixed;
  opacity: 1;
}

/* Themed backgrounds — gradients match the colour of the blob that
   expands for each menu position in index.html:
     1 Traditional Events  -> blob-1 (red)
     2 Corporate           -> blob-2 (teal)
     3 Entertainment & Others -> blob-3 (pink)
     4 About Us            -> blob-4 (purple)
     5 Reach Us -> contact.html (styled separately) */
body.theme-traditional {
  background: linear-gradient(135deg, #bf2f55, #cd2e4a) !important;
}

body.theme-corporate {
  background: linear-gradient(135deg, #087ec3, #07b8aa) !important;
}

body.theme-entertainment {
  background: linear-gradient(135deg, #ee8881, #f0a0b7) !important;
}

body.theme-about {
  background: linear-gradient(135deg, #4a34a2, #552ea8) !important;
}

/* Legacy themes (marriage / birthday / reach pages still exist, now unlinked) */
body.theme-marriage {
  background: linear-gradient(135deg, #bf2f55, #cd2e4a) !important;
}

body.theme-birthday {
  background: linear-gradient(135deg, #4a34a2, #552ea8) !important;
}

body.theme-reach {
  background: linear-gradient(135deg, #f1532a, #f7b733) !important;
}