/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/wedding.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
/* 모바일 청첩장 — 편지지·에디토리얼 초대장 톤 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Cormorant+Infant:ital,wght@0,400;0,500;0,600;1,400&family=Great+Vibes&family=Noto+Sans+KR:wght@300;400;500;600&family=Noto+Serif+KR:wght@400;500;600&display=swap');

:root {
  --wedding-primary: #a8926a;
  --wedding-secondary: #f3efe8;
  --wedding-accent: #2c2825;
  --wedding-text: #1a1918;
  --wedding-light: #fdfcfa;
  --wedding-pink: #e8e0d6;
  --wedding-sage: #8a8478;

  --fs-bg: #f7f4ef;
  --fs-bg-card: #fdfcfa;
  --fs-border: #e5dfd4;
  --fs-gold: #9a8660;
  --fs-gold-light: #c4b08a;
  --fs-charcoal: #1f1d1b;
  --fs-muted: #6b6560;

  --fs-charcoal-soft: #4a4643;
  --fs-container-shadow: 0 0 0 1px var(--fs-border),
    0 24px 48px rgba(31, 29, 27, 0.06);
}

body {
  font-family: 'Noto Sans KR', system-ui, sans-serif;
  font-weight: 400;
  line-height: 1.75;
  color: var(--fs-charcoal);
  background: var(--fs-bg);
  min-height: 100vh;
  letter-spacing: -0.01em;
}

.fs-invitation {
  --wedding-primary: var(--fs-gold);
  --wedding-secondary: #ebe6dd;
  --wedding-accent: var(--fs-charcoal);
  --wedding-text: var(--fs-charcoal);
  --wedding-light: var(--fs-bg-card);
}

.wedding-container {
  max-width: 480px;
  margin: 0 auto;
  background: var(--fs-bg-card);
  box-shadow: 0 0 0 1px var(--fs-border), 0 24px 48px rgba(31, 29, 27, 0.06);
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}

.fs-invitation .wedding-container {
  background: var(
    --fs-container-bg,
    linear-gradient(180deg, #fffcf8 0%, #f9f5ef 48%, #f3eee6 100%)
  );
  box-shadow: var(--fs-container-shadow);
}

/* 히어로 — 이중선 프레임 + 일시 블록 */
.fs-hero {
  padding: 2rem 1.25rem 1.5rem;
  text-align: center;
  position: relative;
}

.fs-hero-frame {
  margin: 0 auto;
  max-width: 100%;
  padding: 2rem 1.35rem 1.75rem;
  border: 1px solid var(--fs-border);
  box-shadow: inset 0 0 0 1px rgba(255, 252, 248, 0.9), 0 1px 0 rgba(255, 255, 255, 0.6);
  background: linear-gradient(165deg, rgba(255, 252, 248, 0.95) 0%, rgba(250, 246, 240, 0.85) 100%);
}

.fs-hero-kicker {
  font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: var(--fs-muted);
  margin-bottom: 0.6rem;
}

.fs-hero-title {
  font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
  font-size: 2.65rem;
  font-weight: 500;
  color: var(--fs-charcoal);
  line-height: 1.12;
  margin-bottom: 0.65rem;
  letter-spacing: 0.02em;
}

.fs-hero-sub {
  font-size: var(--fs-hero-sub-size, 0.9rem);
  font-weight: 400;
  color: var(--fs-muted);
  margin-bottom: 1.35rem;
  letter-spacing: -0.01em;
  line-height: 1.65;
}

.fs-hero-ornament {
  width: 28px;
  height: 28px;
  margin: 0 auto 1.35rem;
  border: 1px solid var(--fs-gold);
  opacity: 0.45;
  transform: rotate(45deg);
}

.fs-hero-meta {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  max-width: 320px;
  margin: 0 auto 1.25rem;
  border-top: 1px solid var(--fs-border);
  border-bottom: 1px solid var(--fs-border);
  padding: 1rem 0;
}

.fs-hero-meta-block {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0 0.75rem;
}

.fs-hero-meta-label {
  font-size: var(--fs-meta-label-size, 0.65rem);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fs-muted);
  opacity: 0.9;
}

.fs-hero-meta-value {
  font-family: 'Noto Serif KR', serif;
  font-size: var(--fs-meta-value-size, 0.9rem);
  font-weight: 500;
  color: var(--fs-charcoal);
  line-height: 1.45;
}

.fs-hero-meta-divider {
  width: 1px;
  align-self: stretch;
  background: var(--fs-border);
  flex-shrink: 0;
}

.fs-hero-actions {
  margin-top: 0.25rem;
}

/* 오시는 길 전용 — 예식장 링크 */
.fs-location-venue {
  font-family: 'Noto Serif KR', serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--fs-charcoal);
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.fs-location-link {
  display: inline-block;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  color: var(--fs-gold);
  text-decoration: none;
  border-bottom: 1px solid rgba(154, 134, 96, 0.35);
  padding-bottom: 2px;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.fs-location-link:hover {
  color: var(--fs-charcoal);
  border-bottom-color: var(--fs-charcoal);
}

/* 오시는 길 — 지도/내비 앱 버튼 */
.fs-map-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.5rem 0.55rem !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.01em;
  white-space: nowrap;
  height: auto !important;
  min-height: 2.4rem;
}

.fs-map-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  border-radius: 4px;
  -o-object-fit: contain;
     object-fit: contain;
  background: rgba(255, 255, 255, 0.6);
}

.fs-map-icon-fallback {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed var(--fs-border);
  color: var(--fs-muted);
  font-size: 12px;
  font-weight: 500;
  border-radius: 4px;
  background: transparent;
}

/* 예식 정보 상세 블록 */
.fs-detail-block {
  text-align: center;
  padding-bottom: 0.25rem;
}

.fs-detail-label {
  font-size: 0.65rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--fs-muted);
  margin-bottom: 0.5rem;
}

.fs-detail-main {
  font-family: 'Noto Serif KR', serif;
  font-size: var(--fs-detail-main-size, 1.05rem);
  font-weight: 600;
  color: var(--fs-charcoal);
}

.fs-detail-sub {
  font-size: 0.9rem;
  color: var(--fs-charcoal);
  margin-top: 0.25rem;
}

.fs-detail-note {
  font-size: 0.8125rem;
  color: var(--fs-muted);
  line-height: 1.6;
}

/* 푸터 */
.fs-footer {
  text-align: center;
  padding: 2.25rem 1.5rem 2.75rem;
  position: relative;
}

.fs-footer-ornament {
  width: 40px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--fs-gold), transparent);
  margin: 0 auto 1.5rem;
  opacity: 0.65;
}

.fs-footer-names {
  font-family: 'Noto Serif KR', serif;
  font-size: 1rem;
  font-weight: 500;
  color: var(--fs-charcoal);
  letter-spacing: 0.04em;
  margin-bottom: 0.65rem;
}

.fs-footer-dot {
  display: inline-block;
  margin: 0 0.5rem;
  color: var(--fs-gold);
  font-weight: 400;
}

.fs-footer-line {
  font-size: 0.8125rem;
  color: var(--fs-muted);
  line-height: 1.7;
  letter-spacing: -0.01em;
  margin-bottom: 1.25rem;
}

.fs-footer-mark {
  width: 4px;
  height: 4px;
  margin: 0 auto;
  background: var(--fs-gold);
  border-radius: 50%;
  opacity: 0.5;
}

.wedding-section {
  padding: 1.75rem 1.5rem;
  position: relative;
}

.fs-section-head {
  text-align: center;
  margin-bottom: 1.35rem;
}

.fs-section-title {
  font-family: 'Noto Serif KR', serif;
  font-size: var(--fs-section-title-size, 1.2rem);
  font-weight: 500;
  color: var(--fs-charcoal);
  letter-spacing: -0.02em;
  margin-top: 0.15rem;
}

.wedding-title {
  font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
  font-size: 2.5rem;
  font-weight: 500;
  color: var(--fs-charcoal);
  text-align: center;
  margin-bottom: 1rem;
}

.wedding-subtitle {
  font-size: 0.9375rem;
  font-weight: 300;
  text-align: center;
  color: var(--fs-muted);
  margin-bottom: 2rem;
  letter-spacing: 0.06em;
}

.wedding-divider {
  width: 48px;
  height: 1px;
  background: var(--fs-gold);
  margin: 1.5rem auto;
  opacity: 0.6;
}

.wedding-card {
  background: var(--fs-card-surface, rgba(253, 252, 250, 0.85)) !important;
  border-radius: 2px !important;
  padding: 0;
  margin: 0.5rem 0;
  box-shadow: none !important;
  border: 1px solid var(--fs-border) !important;
}

.wedding-button {
  background: var(--fs-btn-bg, var(--fs-charcoal)) !important;
  color: var(--fs-btn-color, #faf8f5) !important;
  border: 1px solid var(--fs-btn-border, var(--fs-charcoal)) !important;
  padding: 0.65rem 1.35rem;
  border-radius: 1px;
  font-weight: 500;
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  box-shadow: none;
}

.wedding-button:hover {
  transform: none;
  background: var(--fs-btn-hover-bg, #3d3834) !important;
  border-color: var(--fs-btn-hover-bg, #3d3834) !important;
  box-shadow: none;
}

.fs-btn-outline {
  border-radius: 1px !important;
  border-color: var(--fs-border) !important;
  background: transparent !important;
  color: var(--fs-charcoal) !important;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
}

.fs-btn-outline:hover {
  background: var(--fs-outline-hover-bg, rgba(31, 29, 27, 0.04)) !important;
  border-color: var(--fs-gold) !important;
}

.wedding-icon {
  color: var(--fs-gold);
  stroke-width: 1.25;
}

.wedding-text {
  text-align: center;
  line-height: 2;
  color: var(--fs-muted);
  font-size: var(--fs-body-text-size, 0.9375rem);
  font-weight: 400;
}

.wedding-names {
  font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
  font-size: 2.05rem;
  font-weight: 500;
  color: var(--fs-charcoal);
  text-align: center;
  letter-spacing: 0.02em;
  margin-bottom: 1.35rem;
}

.wedding-names span {
  color: var(--fs-gold);
  font-size: 1rem;
  vertical-align: middle;
  margin: 0 0.35rem;
}

.wedding-contact {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1rem;
  background: var(--fs-contact-surface, rgba(245, 241, 234, 0.5));
  border: 1px solid var(--fs-border);
  border-radius: 1px;
  margin-bottom: 0.75rem;
}

.wedding-account {
  padding: 1rem 1rem;
  background: var(--fs-contact-surface, rgba(245, 241, 234, 0.5));
  border: 1px solid var(--fs-border);
  border-radius: 1px;
  margin-bottom: 0.75rem;
}

.wedding-dday {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--fs-gold);
  text-align: center;
  margin: 1.25rem 0 0.5rem;
  letter-spacing: 0.12em;
}

.fs-info-block {
  margin-top: 1rem;
  padding: 1rem 1rem;
  background: var(--fs-info-surface, rgba(245, 241, 234, 0.45));
  border: 1px solid var(--fs-border);
  border-radius: 1px;
}

.fs-info-block h4 {
  font-family: 'Noto Serif KR', serif;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--fs-charcoal);
  margin-bottom: 0.65rem;
  letter-spacing: 0.02em;
}

.fs-info-block p {
  font-size: 0.8125rem;
  color: var(--fs-muted);
  line-height: 1.65;
  margin: 0;
}

.fs-info-block p + p {
  margin-top: 0.35rem;
}

.fs-loading {
  background: var(--fs-bg) !important;
}

.fs-loading .border-wedding-accent {
  border-color: var(--fs-gold) !important;
}

.fs-loading p {
  color: var(--fs-muted) !important;
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
}

.wedding-fade-in {
  animation: fadeInUp 0.7s ease-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fs-gallery-more {
  background: var(--fs-gallery-more-bg, var(--fs-charcoal)) !important;
  color: var(--fs-gallery-more-color, #faf8f5) !important;
  box-shadow: 0 4px 16px rgba(31, 29, 27, 0.12);
}

.fs-gallery-more:hover {
  background: var(--fs-gallery-more-hover, #3d3834) !important;
}

/* 입력 필드 */
.fs-invitation input,
.fs-invitation textarea {
  border-radius: 1px !important;
  border-color: var(--fs-border) !important;
  background: var(--fs-input-bg, rgba(253, 252, 250, 0.9)) !important;
  font-size: 0.875rem;
}

.fs-invitation input:focus,
.fs-invitation textarea:focus {
  border-color: var(--fs-gold) !important;
  box-shadow: 0 0 0 1px var(--fs-input-focus-ring, rgba(154, 134, 96, 0.25)) !important;
}

/* 유틸리티 */
.bg-wedding-secondary {
  background-color: var(--fs-secondary-block, rgba(245, 241, 234, 0.55)) !important;
  border: 1px solid var(--fs-border) !important;
  border-radius: 1px !important;
}

.bg-wedding-primary {
  background-color: var(--fs-bg) !important;
}

.text-wedding-accent {
  color: var(--fs-charcoal) !important;
}

@media (max-width: 480px) {
  .wedding-section {
    padding: 1.5rem 1.1rem;
  }

  .fs-hero-title {
    font-size: 2.25rem;
  }

  .fs-hero-meta-value {
    font-size: 0.85rem;
  }

  .wedding-contact {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: var(--fs-bg);
}

::-webkit-scrollbar-thumb {
  background: var(--fs-gold-light);
  border-radius: 0;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--fs-gold);
}

/* ========== 블랙 오프닝 화면 + 스크롤 셸 ========== */
.wedding-page-shell {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  background: #0a0a0a;
}

.wedding-scroll-root {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  scroll-snap-type: y proximity;
}

.opening-screen {
  position: relative;
  flex-shrink: 0;
  min-height: 100dvh;
  width: 100%;
  overflow-x: hidden;
  background: #080808;
  color: rgba(238, 236, 233, 0.92);
  cursor: pointer;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  outline: none;
}

.opening-screen:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(255, 250, 245, 0.25);
}

.opening-screen-bg {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 100% 80% at 50% -5%, rgba(45, 44, 42, 0.5), transparent 52%),
    linear-gradient(to bottom, #0c0c0c 0%, #070707 45%, #040404 100%);
  z-index: 1;
}

.opening-pearl-layer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  /* 텍스트·사진 칼럼(z:6) 위에 얹혀야 효과가 보임 */
  z-index: 7;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.88;
}

.opening-pearl-star {
  color: rgba(255, 252, 248, 0.96);
}

.opening-pearl-star-rot {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.opening-pearl-star-svg {
  display: block;
  shape-rendering: geometricPrecision;
}

.opening-pearl-star--fall {
  --pearl-drift: 6px;
  position: absolute;
  top: -8vh;
  display: flex;
  align-items: center;
  justify-content: center;
  animation-name: opening-pearl-fall;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  opacity: 0;
  filter: drop-shadow(0 0 1px rgba(255, 252, 248, 0.45))
    drop-shadow(0 0 3px rgba(255, 246, 236, 0.18));
}

@keyframes opening-pearl-fall {
  0% {
    transform: translate3d(0, -12vh, 0) scale(0.65);
    opacity: 0;
  }
  6% {
    opacity: 0.22;
  }
  40% {
    opacity: 0.16;
    transform: translate3d(calc(var(--pearl-drift, 4px) * 0.35), 42vh, 0) scale(0.95);
  }
  88% {
    opacity: 0.1;
    transform: translate3d(var(--pearl-drift, 6px), 98vh, 0) scale(0.88);
  }
  100% {
    opacity: 0;
    transform: translate3d(var(--pearl-drift, 8px), 120vh, 0) scale(0.75);
  }
}

.opening-pearl-star--twinkle {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: opening-pearl-twinkle 2.8s ease-in-out infinite;
  opacity: 0.42;
  filter: drop-shadow(0 0 1.5px rgba(255, 253, 248, 0.55))
    drop-shadow(0 0 4px rgba(255, 245, 235, 0.2));
}

@keyframes opening-pearl-twinkle {
  0%,
  100% {
    opacity: 0.12;
    transform: scale(0.45);
  }
  45% {
    opacity: 0.55;
    transform: scale(1.05);
  }
  65% {
    opacity: 0.25;
    transform: scale(0.75);
  }
}

.opening-pearl-shimmer {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 85% 55% at 25% 0%, rgba(255, 255, 252, 0.09), transparent 58%),
    radial-gradient(circle at 78% 22%, rgba(255, 253, 249, 0.06), transparent 48%),
    radial-gradient(ellipse 60% 45% at 50% 92%, rgba(255, 251, 246, 0.04), transparent 55%);
  animation: opening-pearl-ambient 9s ease-in-out infinite alternate;
  mix-blend-mode: screen;
  opacity: 0.55;
}

@keyframes opening-pearl-ambient {
  from {
    opacity: 0.4;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0.82;
    transform: translateY(5px) scale(1.015);
  }
}

/* 좌우 여백(검정) 유지한 모바일 폭 칼럼 — PC에서도 동일 비율·크롭 */
.opening-screen-column {
  position: relative;
  z-index: 6;
  width: 100%;
  max-width: min(480px, 100%);
  margin: 0 auto;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow-x: hidden;
}

.opening-screen-inner {
  position: relative;
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  box-sizing: border-box;
  padding: clamp(1rem, 3.2vh, 1.65rem) 1rem clamp(4.75rem, 10vh, 6.75rem);
}

.opening-screen-copy {
  flex: 0 0 auto;
  text-align: center;
}

.opening-venue-logo {
  display: block;
  width: auto;
  max-width: min(180px, 52vw);
  max-height: clamp(32px, 6.8vw, 43px);
  height: auto;
  margin: 0 auto clamp(0.22rem, 1vh, 0.5rem);
  -o-object-fit: contain;
     object-fit: contain;
  opacity: 0.94;
  /* 검정 로고 → 어두운 배경용 흰색으로 반전 */
  filter: invert(1) brightness(1.07);
  pointer-events: none;
}

.opening-names {
  font-family: 'Great Vibes', 'Noto Serif KR', serif;
  font-size: clamp(2.1rem, 7.5vw, 3.35rem);
  font-weight: 400;
  line-height: 1.35;
  margin: 0 0 clamp(1.35rem, 3.5vh, 2rem);
  background: linear-gradient(
    120deg,
    rgba(253, 250, 245, 0.98) 0%,
    rgba(210, 205, 198, 0.88) 28%,
    rgba(253, 250, 245, 1) 45%,
    rgba(218, 213, 206, 0.9) 70%,
    rgba(251, 248, 244, 0.98) 100%
  );
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: opening-names-shimmer 16s ease-in-out infinite alternate;
  text-shadow: 0 0 40px rgba(255, 255, 255, 0.04);
}

@keyframes opening-names-shimmer {
  from {
    background-position: 0% 50%;
    filter: brightness(1);
  }
  to {
    background-position: 100% 50%;
    filter: brightness(1.05);
  }
}

.opening-invite-caps {
  font-family: 'Cormorant Infant', 'Noto Serif KR', serif;
  font-size: clamp(0.58rem, 2.65vw, 0.72rem);
  font-weight: 500;
  letter-spacing: 0.22em;
  line-height: 1.65;
  text-transform: uppercase;
  margin: 0 0 clamp(1.15rem, 3vh, 1.85rem);
  color: rgba(215, 210, 204, 0.78);
}

.opening-date-caps {
  font-family: 'Cormorant Infant', 'Noto Serif KR', serif;
  font-size: clamp(0.72rem, 3.1vw, 0.82rem);
  font-weight: 500;
  letter-spacing: 0.22em;
  color: rgba(232, 228, 222, 0.86);
  margin: 0 0 0.55rem;
  text-transform: uppercase;
}

.opening-time-italic {
  font-family: 'Cormorant Infant', 'Noto Serif KR', serif;
  font-size: clamp(0.78rem, 3vw, 0.9rem);
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0.06em;
  color: rgba(198, 192, 186, 0.72);
  margin: 0;
}

/* 두 번째 페이지 Our Wedding 타이틀: 오프닝 PLEASE JOIN US..와 동일 계열 폰트 */
.invite-main-title {
  font-family: 'Cormorant Infant', 'Noto Serif KR', serif;
  font-size: var(--invite-title-size, clamp(1.75rem, 7.2vw, 2.1rem));
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.06em;
  line-height: 1.2;
  color: var(--invite-title-color, rgba(198, 192, 186, 0.88));
  margin: 0;
}

/* 본문 인라인 보조 문구 (테마 텍스트 색상 사용) */
.fs-invite-soft-text {
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--fs-charcoal-soft, var(--fs-charcoal));
}

.fs-invite-muted-text {
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--fs-muted);
}

.fs-invite-muted-text-sm {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: var(--fs-muted);
}

.fs-gallery-dialog-btn {
  background: var(--fs-dialog-chrome-bg, rgba(31, 29, 27, 0.7));
  color: var(--fs-dialog-chrome-color, #faf8f5);
  transition:
    background 0.2s ease,
    opacity 0.2s ease;
}

.fs-gallery-dialog-btn:hover:not(:disabled) {
  background: var(--fs-dialog-chrome-hover, #1f1d1b);
}

.wedding-invitation-themed {
  transition:
    background 0.35s ease,
    color 0.25s ease;
}

.opening-photo-wrap {
  position: relative;
  flex: 1 1 auto;
  margin-top: auto;
  width: 100%;
  /* 화면 높이의 대략 60% 이상 차지 (텍스트 영역은 나머지) */
  min-height: max(60dvh, 260px);
  max-height: min(72dvh, 680px);
  overflow: hidden;
}

.opening-photo {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center 32%;
     object-position: center 32%;
  filter: grayscale(1) contrast(1.06) brightness(0.93);
}

.opening-photo-vignette {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(to bottom, #080808 0%, transparent 42%),
    linear-gradient(to top, #070707 0%, transparent 28%),
    radial-gradient(ellipse 90% 70% at 50% 68%, transparent 42%, rgba(5, 5, 5, 0.75) 100%);
}

/* 모바일: 사진만 좌우 끝까지 (풀블리드). 텍스트는 inner 패딩 유지 */
@media (max-width: 640px) {
  .opening-photo-wrap {
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
}

.opening-hint {
  position: absolute;
  bottom: max(1.25rem, env(safe-area-inset-bottom));
  left: 0;
  right: 0;
  z-index: 9;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  opacity: 0.35;
}

.opening-hint-text {
  font-family: 'Cormorant Infant', serif;
  font-size: 0.58rem;
  letter-spacing: 0.45em;
  text-transform: lowercase;
}

.opening-hint-icon {
  color: rgba(210, 205, 200, 0.45);
  animation: opening-hint-bob 2.8s ease-in-out infinite;
}

@keyframes opening-hint-bob {
  0%,
  100% {
    transform: translateY(0);
    opacity: 0.4;
  }
  50% {
    transform: translateY(5px);
    opacity: 0.85;
  }
}

.wedding-main-snap {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  background: var(--fs-bg);
}

/* Our Wedding — 손글씨 이름 PNG (밝은 크림 바탕 + multiply 로 흰 배경 무늬 제거와 유사하게 합성) */
.invite-couple-signature-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.3rem 0.85rem;
  margin: 0.85rem 0 clamp(1.35rem, 3.5vh, 2rem);
}

.invite-couple-signature-blend {
  mix-blend-mode: multiply;
  flex: 0 1 auto;
  line-height: 0;
  max-width: min(44%, 220px);
}

.invite-couple-signature-img {
  display: block;
  height: clamp(34px, 10vw, 54px);
  width: auto;
  max-width: 100%;
}

.invite-couple-signature-heart {
  font-family: 'Cormorant Garamond', 'Noto Serif KR', serif;
  font-size: clamp(1.1rem, 3.9vw, 1.55rem);
  color: var(--fs-gold);
  line-height: 1;
  flex-shrink: 0;
}

@media (prefers-reduced-motion: reduce) {
  .opening-pearl-star--fall,
  .opening-pearl-star--twinkle,
  .opening-pearl-shimmer,
  .opening-names,
  .opening-hint-icon {
    animation: none !important;
  }

  .opening-pearl-layer {
    opacity: 0.45;
    mix-blend-mode: screen;
  }
}