/* Shared by the seven occasion landing pages (/wedding-photo-wall,
   /party-photo-wall, /surprise-party-photo-wall, /memorial-photo-wall,
   /reunion-photo-wall, /graduation-photo-wall, /corporate-event-photos).

   Only rules that were byte-identical in all seven are here, in the order they
   appeared, and no page defines any of these selectors separately — so the
   cascade is unchanged. Page-specific styling stays inline in each view.

   These pages cross-link to each other, so a visitor browsing two or more of
   them now fetches this once instead of inlining it per page. */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
.nav { padding: 20px 28px; border-bottom: 1px solid var(--card-border); display:flex; justify-content:space-between; align-items:center; }
.logo { text-decoration: none; display: inline-flex; align-items: center; }
.logo img { height: 28px; }
.nav-links { display: flex; gap: 20px; align-items: center; }
.nav-links a { color: var(--cream-60); text-decoration: none; font-size: 0.85rem; transition: color 0.2s; }
.container { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.btn { display: inline-block; border: none; border-radius: 8px; padding: 12px 28px; font-size: 0.88rem; font-weight: 500; text-decoration: none; cursor: pointer; transition: all 0.2s; }
.btn-large { padding: 14px 36px; font-size: 0.95rem; }
.hero-ctas { display: flex; gap: 12px; justify-content: center; margin-bottom: 16px; }
.hero-trust { font-size: 0.78rem; color: var(--cream-30); }
.section-heading { font-family: var(--font-display); font-weight: 300; font-size: 2rem; margin-bottom: 12px; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px; text-align: left; }
.faq-item { background: var(--card); border: 1px solid var(--card-border); border-radius: 14px; padding: 28px; }
.faq-item h3 { font-family: var(--font-display); font-size: 1.1rem; font-weight: 400; margin-bottom: 8px; color: var(--cream-90); }
.cta-box h2 { font-family: var(--font-display); font-size: 2rem; font-weight: 300; margin-bottom: 12px; }
.cta-box p { font-size: 0.92rem; color: var(--cream-60); margin-bottom: 24px; }
footer a { color: var(--cream-30); text-decoration: none; font-size: 0.8rem; margin: 0 12px; }
