/* Real Wedding — single + archive page styles.
 * Tokens only (--sdwd-*). BEM, single-class selectors, mobile-first.
 */

/* ─── s1 hero ─────────────────────────────────────────── */
.rw-s1 {
    position: relative;
    min-height: 60vh;
    background-color: var(--sdwd-dark);
    background-size: cover;
    background-position: center;
    color: var(--sdwd-bg);
    display: flex;
    align-items: center;
    padding: var(--sdwd-section-gap-lg) 0;
}
.rw-s1__overlay {
    position: absolute;
    inset: 0;
    background: var(--sdwd-overlay);
    pointer-events: none;
}
.rw-s1__inner {
    position: relative;
    text-align: center;
}
.rw-s1__eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: var(--sdwd-h6);
    margin-bottom: var(--sdwd-title-gap);
    opacity: 0.85;
}
.rw-s1__title {
    font-family: var(--sdwd-heading-font);
    font-size: clamp( 2.25rem, 6vw, 4rem );
    margin: 0 0 1.5rem;
    line-height: 1.1;
}
.rw-s1__amp {
    font-style: italic;
    opacity: 0.85;
    margin: 0 0.5rem;
}
.rw-s1__meta {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
}
.rw-s1__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--sdwd-h5);
}
.rw-s1__meta-item a {
    color: inherit;
    text-decoration: underline;
}
.rw-s1__meta-item a:hover { opacity: 0.85; }

/* ─── s2 story ────────────────────────────────────────── */
.rw-s2 { padding: var(--sdwd-section-gap-lg) 0; }
.rw-s2__inner { max-width: 760px; margin: 0 auto; text-align: center; }
.rw-s2__title { font-size: var(--sdwd-h2); margin-bottom: var(--sdwd-title-gap); }
.rw-s2__body { font-size: var(--sdwd-body); line-height: 1.7; color: var(--sdwd-body-text); }

/* ─── s3 gallery ──────────────────────────────────────── */
.rw-s3 { padding: var(--sdwd-section-gap-lg) 0; background: var(--sdwd-soft); }
.rw-s3__title { font-size: var(--sdwd-h2); text-align: center; margin-bottom: var(--sdwd-title-gap); }
.rw-s3__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat( 2, 1fr );
    gap: 0.75rem;
}
@media (min-width: 600px) { .rw-s3__grid { grid-template-columns: repeat( 3, 1fr ); } }
@media (min-width: 900px) { .rw-s3__grid { grid-template-columns: repeat( 4, 1fr ); gap: 1rem; } }
.rw-s3__item { aspect-ratio: 1 / 1; overflow: hidden; border-radius: var(--sdwd-radius); }
.rw-s3__link { display: block; width: 100%; height: 100%; }
.rw-s3__link img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.rw-s3__link:hover img { transform: scale( 1.04 ); }
.rw-s3__lightbox {
    position: fixed;
    inset: 0;
    background: var(--sdwd-overlay);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.rw-s3__lightbox[hidden] { display: none; }
.rw-s3__lightbox-img { max-width: 92vw; max-height: 88vh; object-fit: contain; }
.rw-s3__lightbox-close,
.rw-s3__lightbox-prev,
.rw-s3__lightbox-next {
    position: absolute;
    background: var(--sdwd-bg);
    color: var(--sdwd-dark);
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.rw-s3__lightbox-close { top: 1rem; right: 1rem; }
.rw-s3__lightbox-prev  { left: 1rem; top: 50%; transform: translateY(-50%); }
.rw-s3__lightbox-next  { right: 1rem; top: 50%; transform: translateY(-50%); }
body.rw-lightbox-open { overflow: hidden; }

/* ─── s4 info ─────────────────────────────────────────── */
.rw-s4 { padding: var(--sdwd-section-gap-lg) 0; }
.rw-s4__inner { max-width: 880px; margin: 0 auto; text-align: center; }
.rw-s4__title { font-size: var(--sdwd-h2); margin-bottom: var(--sdwd-title-gap); }
.rw-s4__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
@media (min-width: 600px) { .rw-s4__grid { grid-template-columns: 1fr 1fr; } }
.rw-s4__person {
    padding: 1.5rem;
    background: var(--sdwd-soft);
    border-radius: var(--sdwd-radius);
}
.rw-s4__role {
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-size: var(--sdwd-h6);
    color: var(--sdwd-muted);
    margin: 0 0 0.5rem;
}
.rw-s4__name { font-size: var(--sdwd-h3); margin: 0; }
.rw-s4__snippet {
    color: var(--sdwd-body-text);
    margin: 0 auto 1rem;
    max-width: 640px;
    line-height: 1.6;
}
.rw-s4__chips {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
}
.rw-s4__chip {
    background: var(--sdwd-accent-bg);
    border-radius: var(--sdwd-radius-lg);
    padding: 0.4rem 0.9rem;
    font-size: var(--sdwd-h6);
}
.rw-s4__chip a { color: var(--sdwd-accent-dark); text-decoration: none; }
.rw-s4__chip--season { background: var(--sdwd-soft-accent); }

/* ─── s5 vendors ──────────────────────────────────────── */
.rw-s5 { padding: var(--sdwd-section-gap-lg) 0; background: var(--sdwd-soft); }
.rw-s5__title { font-size: var(--sdwd-h2); text-align: center; margin-bottom: var(--sdwd-title-gap); }
.rw-s5__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}
@media (min-width: 600px) { .rw-s5__grid { grid-template-columns: repeat( 2, 1fr ); } }
@media (min-width: 900px) { .rw-s5__grid { grid-template-columns: repeat( 3, 1fr ); } }
.rw-s5__cell--venue { grid-column: 1 / -1; }
@media (min-width: 600px) { .rw-s5__cell--venue { grid-column: span 2; } }
@media (min-width: 900px) { .rw-s5__cell--venue { grid-column: span 3; } }
.rw-s5__fallback {
    display: block;
    background: var(--sdwd-bg);
    border-radius: var(--sdwd-radius);
    padding: 1rem;
    text-decoration: none;
    color: var(--sdwd-subtext);
    border: 1px solid var(--sdwd-border);
}
.rw-s5__fallback-image { width: 100%; height: auto; border-radius: var(--sdwd-radius); }
.rw-s5__fallback-title { font-size: var(--sdwd-h4); margin: 0.75rem 0 0.25rem; }
.rw-s5__fallback-role { font-size: var(--sdwd-h6); color: var(--sdwd-muted); margin: 0; }

/* ─── s6 similar ──────────────────────────────────────── */
.rw-s6 { padding: var(--sdwd-section-gap-lg) 0; }
.rw-s6__title { font-size: var(--sdwd-h2); text-align: center; margin-bottom: var(--sdwd-title-gap); }
.rw-s6__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}
@media (min-width: 600px) { .rw-s6__grid { grid-template-columns: repeat( 2, 1fr ); } }
@media (min-width: 900px) { .rw-s6__grid { grid-template-columns: repeat( 4, 1fr ); } }

/* ─── archive ─────────────────────────────────────────── */
.rw-archive { padding: var(--sdwd-section-gap-lg) 0; }
.rw-archive__title { font-size: var(--sdwd-h1); text-align: center; margin-bottom: var(--sdwd-title-gap); }
.rw-archive__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}
@media (min-width: 600px) { .rw-archive__grid { grid-template-columns: repeat( 2, 1fr ); } }
@media (min-width: 900px) { .rw-archive__grid { grid-template-columns: repeat( 3, 1fr ); } }
.rw-archive__pagination {
    margin-top: var(--sdwd-section-gap-md);
    text-align: center;
}
.rw-archive__empty {
    text-align: center;
    color: var(--sdwd-muted);
    padding: var(--sdwd-section-gap-lg) 0;
}