/* Ceremony detail page styles (isolated) */
.ceremony-hero { padding-top: 120px; padding-bottom: 2.4rem; background: linear-gradient(180deg, rgba(12,26,20,0.03), rgba(12,26,20,0.03)); }
.video-box { width: 100%; position:relative; border-radius:0; overflow:hidden; box-shadow: none; background:#000 }
.video-box video { width:100%; height:auto; display:block; max-height:720px; object-fit:cover }
.play-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background: linear-gradient(180deg, rgba(0,0,0,0.22), rgba(0,0,0,0.08)); border:none; color:#fff; font-size:2rem; cursor:pointer }
.hero-content { width:100%; padding:1.6rem 0 }
.hero-content.container { max-width:1200px; margin: 0 auto; padding: 1.6rem 1.2rem }
.hero-content .title { font-size:1.8rem; margin-bottom:0.4rem; color:var(--color-emerald-dark) }
.hero-content .meta { color:#666; margin-bottom:0.8rem }
.hero-content .summary { color:#444; line-height:1.6 }
.hero-actions { margin-top:1.1rem; display:flex; gap:0.8rem }
.hero-actions .btn-primary { padding:0.85rem 1.2rem }

.ceremony-main { padding:2.4rem 0 }
.ceremony-grid { display:grid; grid-template-columns: 1fr; gap:1.6rem }
.main-panel .card { padding:1.4rem; border-radius:12px; background:#fff; box-shadow: var(--shadow-soft) }
.video-player-wrap { background:#000; border-radius:10px; overflow:hidden }
.video-player-wrap video { width:100%; height:auto; display:block }

.gallery-grid { display:grid; grid-template-columns: repeat(2,1fr); gap:8px; margin-top:0.6rem }
.gallery-grid img { width:100%; height:150px; object-fit:cover; border-radius:8px; cursor:pointer }
.gallery-note { color:#666; margin-top:0.6rem }

.booking-card { padding:1rem; border-radius:12px; background:linear-gradient(180deg,#fff,#fbfbfb); box-shadow: var(--shadow-soft); display:flex; flex-direction:column; gap:10px }
.booking-card h3 { margin:0 }
.price-compact { font-weight:800; color:var(--color-emerald-dark) }
.trust { margin-top:0.6rem; color:var(--color-emerald-dark); display:flex; gap:8px; align-items:center }

/* Lightbox (reuse base style naming but isolated ids are used in HTML) */
.lightbox { position:fixed; inset:0; display:none; align-items:center; justify-content:center; background: rgba(0,0,0,0.85); z-index:9999 }
.lightbox[aria-hidden="false"] { display:flex }
.lightbox img { max-width:90%; max-height:85%; border-radius:6px }
.close-lb { position:absolute; top:18px; left:18px; background:transparent; color:#fff; border:none; font-size:1.2rem }
.lightbox .nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.06); color:#fff; border:none; padding:10px 14px; border-radius:8px }
.lightbox .prev { right:90%; }
.lightbox .next { left:90%; }

/* Modal (same base styles used across site) */
.modal { position:fixed; inset:0; display:none; align-items:center; justify-content:center; background: rgba(0,0,0,0.6); z-index:10000 }
.modal[aria-hidden="false"] { display:flex }
.modal-content { background:white; padding:1.6rem; border-radius:10px; max-width:420px; text-align:center }
.close-modal { position:absolute; top:18px; left:18px; background:transparent; border:none; font-size:1.2rem }

/* Responsive */
@media (max-width: 900px) {
    .ceremony-hero-inner { flex-direction:column }
    .video-box, .hero-content { width:100% }
    .ceremony-grid { grid-template-columns: 1fr }
    .gallery-grid { grid-template-columns: repeat(2,1fr) }
    .play-overlay { font-size:1.6rem }
}
