:root {
  --burgundy: #641d35; --wine: #842d49; --blue: #243c68; --sapphire: #405d91; --milk: #f3efea; --line: rgba(243,239,234,.25);
  --serif: "Cormorant Garamond", Georgia, serif; --sans: "Manrope", sans-serif; --mono: "DM Mono", monospace;
}
* { box-sizing: border-box; }
html { overflow-x: hidden; scroll-snap-type: y proximity; }
body { width: 100%; margin: 0; color: var(--milk); background: var(--burgundy); font-family: var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body:has(.map-modal:not([hidden])) { overflow: hidden; }
button, a { color: inherit; font: inherit; } button { cursor: pointer; }
.page-loader { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; background: var(--burgundy); animation: loader-out 1s 1.1s forwards; pointer-events: none; }
.page-loader span { font: 500 25px var(--serif); letter-spacing: .15em; animation: loader-logo 1s ease-in-out infinite alternate; }
.page-loader i { position: absolute; bottom: 24%; width: 70px; height: 1px; background: var(--milk); transform-origin: left; animation: loader-line 1s ease-in-out; }
.site-nav { position: fixed; z-index: 5; top: 0; right: 0; left: 0; display: flex; align-items: center; justify-content: space-between; padding: 28px clamp(22px, 5vw, 75px); mix-blend-mode: screen; }
.brand { font: 500 25px/1 var(--serif); letter-spacing: .06em; text-decoration: none; }.brand em { color: #d998ac; font-size: .75em; font-style: normal; }
.nav-caption, .kicker, .scroll-cue, figcaption, .location-footer strong, .date-info, .countdown, .final-date { font: 10px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.scene { position: relative; min-height: 100svh; min-height: 100dvh; overflow: hidden; }
.hero-scene { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; background: var(--burgundy); isolation: isolate; }.hero-image { position: absolute; inset: -8%; z-index: 0; background: url("assets/roses.webp") center center/cover no-repeat; filter: saturate(.55) contrast(1.05); pointer-events: none; }.hero-wash { position: absolute; inset: 0; z-index: 1; display: block; background: linear-gradient(120deg, rgba(86,19,43,.82), rgba(44,37,83,.68) 65%, rgba(32,45,91,.5)); mix-blend-mode: multiply; opacity: 1; pointer-events: none; }.hero-scene::after { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(46,8,24,.08), transparent 40%, rgba(30,18,54,.36)); content: ""; pointer-events: none; }.hero-meta, .hero-title, .scroll-cue, .hero-date, .hero-countdown { z-index: 2; }.hero-title { position: relative; }
.date-bg { position: absolute; inset: 0; }
.hero-meta { position: absolute; top: 115px; right: 7%; left: 7%; display: flex; justify-content: space-between; color: rgba(243,239,234,.65); font: 10px var(--mono); letter-spacing: .16em; }.hero-title { width: min(1050px, 92vw); }.hero-title h1 { display: flex; margin: 0; flex-direction: column; gap: clamp(12px, 1.25vw, 24px); font: 500 clamp(72px, 14.5vw, 230px)/.72 var(--serif); letter-spacing: -.06em; }.hero-title h1 span { display: block; white-space: nowrap; }.hero-title h1 .line-indent { margin-left: 14%; color: #d7d8eb; }.surname { width: 100%; margin: 28px 0 0; text-align: center; font: 500 clamp(17px, 2vw, 27px) var(--sans); letter-spacing: .42em; }.hero-date { margin-top: clamp(28px, 4vh, 52px); color: var(--milk); font: 500 clamp(30px, 4vw, 58px) var(--serif); letter-spacing: .12em; }.hero-date i { color: #d998ac; font-style: normal; }.hero-countdown { position: absolute; bottom: 36px; left: 7%; display: flex; align-items: flex-start; flex-direction: column; gap: 8px; color: rgba(243,239,234,.7); font: 9px var(--mono); letter-spacing: .15em; text-transform: uppercase; }.hero-countdown strong { display: flex; align-items: baseline; gap: 10px; color: var(--milk); font: 21px var(--mono); font-weight: 400; }.hero-countdown strong b { display: flex; align-items: baseline; gap: 5px; font-weight: 400; }.hero-countdown strong em { font-style: normal; }.hero-countdown strong small { color: rgba(243,239,234,.64); font: 8px var(--sans); letter-spacing: 0; text-transform: lowercase; }.hero-countdown strong i { color: #d18ca2; font-style: normal; }
.invitation-scene { display: grid; place-items: center; background: linear-gradient(135deg, var(--burgundy), var(--wine) 45%, var(--blue)); }.scene-index { position: absolute; top: 135px; left: 7%; color: rgba(243,239,234,.66); }.scene-index span { margin: 0 8px; color: #d595aa; }.invitation-copy { position: relative; z-index: 1; width: min(580px, 82vw); }.invitation-copy .kicker { color: #ca88a1; }.invitation-copy h2 { margin: 22px 0 28px; font: 500 clamp(54px, 8.5vw, 120px)/.77 var(--serif); letter-spacing: -.04em; }.invitation-copy h2 i { color: #ced7eb; font-style: italic; }.body-copy { width: 240px; margin: 0; color: rgba(243,239,234,.75); font: 17px/1.45 var(--serif); }.date-note { margin: 30px 0 0; color: #dba3b4; font: 11px var(--mono); letter-spacing: .16em; text-transform: uppercase; }.orbit { position: absolute; border: 1px solid rgba(222,181,194,.35); border-radius: 50%; transform: rotate(-25deg); }.orbit-one { width: 55vw; height: 85vw; right: -19%; top: -4%; }.orbit-two { width: 30vw; height: 60vw; left: -9%; top: 27%; border-color: rgba(173,190,224,.29); transform: rotate(45deg); }.invitation-mark { position: absolute; right: 7%; bottom: 9%; color: rgba(243,239,234,.38); font: 20px var(--serif); }.invitation-mark span { padding: 0 7px; color: #cf8fa3; }
.location-scene { position: relative; min-height: 150svh; overflow: hidden; padding: 13vh 7% 9vh; background: var(--milk); color: var(--blue); }.location-header { display: flex; justify-content: space-between; align-items: baseline; overflow: hidden; color: var(--wine); font: 500 clamp(58px, 13vw, 190px)/.72 var(--serif); letter-spacing: -.06em; white-space: nowrap; }.location-word--right { margin-top: 85px; color: var(--blue); font-style: italic; }.location-intro { position: relative; z-index: 1; margin: 12vh 0 0 10%; }.location-intro .kicker { color: var(--wine); }.location-intro h2 { margin: 20px 0 8px; font: 500 clamp(38px, 5vw, 75px)/.78 var(--serif); letter-spacing: -.04em; }.location-intro h2 i { color: var(--wine); font-size: .67em; font-style: italic; }.location-intro > p:last-child { margin: 22px 0; color: var(--sapphire); font: 18px var(--serif); letter-spacing: .12em; }
.gallery { position: relative; width: min(1050px, 90vw); height: 650px; margin: -4vh auto 0; }.gallery-card { position: absolute; margin: 0; }.gallery-card--large { top: 0; left: 18%; width: 39%; }.gallery-card--top { top: 16%; right: 7%; width: 24%; }.gallery-card--bottom { bottom: 3%; left: 4%; width: 26%; }.image-wrap { overflow: hidden; background: var(--blue); }.gallery-card--large .image-wrap { height: 530px; }.gallery-card--small .image-wrap { height: 235px; }.gallery-card img { display: block; width: 100%; height: 120%; object-fit: cover; filter: saturate(.72); transform: translateY(-8%); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .5s; }.gallery-card:hover img { filter: saturate(1); transform: translateY(-8%) scale(1.04); }.gallery-card figcaption { display: flex; justify-content: space-between; padding-top: 10px; color: var(--sapphire); font-size: 8px; }.gallery-card figcaption span { color: var(--wine); }.location-footer { display: flex; max-width: 1050px; align-items: center; justify-content: space-between; margin: 3vh auto 0; border-top: 1px solid rgba(36,60,104,.25); padding-top: 22px; }.location-footer div { display: flex; flex-direction: column; gap: 8px; }.location-footer .kicker { color: var(--wine); }.location-footer strong { color: var(--blue); font-size: 9px; }.map-button { border: 1px solid var(--wine); border-radius: 0; background: none; padding: 13px 18px; color: var(--wine); font: 10px var(--mono); letter-spacing: .12em; transition: background .3s, color .3s; }.map-button:hover { background: var(--wine); color: var(--milk); }.map-button span { margin-left: 15px; font-size: 16px; }
.date-scene { position: relative; min-height: 100svh; background: var(--blue); isolation: isolate; }.date-bg { z-index: -2; opacity: .48; background: var(--blue); filter: none; }.date-scene::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(120deg, rgba(24,42,83,.84), rgba(105,27,56,.85)); content: ""; mix-blend-mode: multiply; }.date-layout { display: grid; grid-template-columns: 1fr 1.1fr 1fr; width: min(1180px, 86vw); align-items: center; margin: 0 auto; padding-top: 18vh; }.date-intro { align-self: start; padding-top: 9vh; }.date-intro .kicker { color: #a9bfdf; }.date-intro > p:last-child { margin-top: 35px; font: 400 clamp(38px, 5vw, 72px)/.8 var(--serif); }.date-intro i { color: #e2a2b3; font-style: italic; }.big-date { display: flex; justify-content: center; flex-direction: column; color: var(--milk); font: 500 clamp(130px, 21vw, 310px)/.66 var(--serif); letter-spacing: -.09em; }.big-date span:nth-child(2) { margin-left: 28%; color: #d28fa3; }.big-date span:nth-child(3) { margin-left: 55%; color: #a7b6dc; }.date-info { align-self: end; margin-bottom: 7vh; color: rgba(243,239,234,.85); line-height: 2.2; }.date-info p { margin: 0; }.countdown { position: absolute; bottom: 42px; left: 7%; color: rgba(243,239,234,.65); }.countdown > div { display: flex; align-items: baseline; gap: 12px; margin-top: 9px; color: var(--milk); font: 30px var(--mono); }.countdown b { font-weight: 400; }.countdown i { color: #d18ca2; font-style: normal; }.countdown small { display: block; margin-top: 5px; color: rgba(243,239,234,.4); font-size: 7px; }
.scene, .location-scene, .date-scene { scroll-snap-align: start; scroll-snap-stop: always; }
.final-scene { display: grid; place-items: center; background: var(--burgundy); text-align: center; isolation: isolate; }.final-scene::before { position: absolute; inset: 0; background: radial-gradient(circle at 75% 42%, rgba(64,93,145,.65), transparent 28%), linear-gradient(135deg, var(--burgundy), #42182f); content: ""; z-index: -2; }.final-glow { position: absolute; width: 45vw; height: 45vw; right: -10%; border-radius: 50%; background: #405d91; filter: blur(100px); opacity: .27; z-index: -1; }.final-copy .kicker { color: #d798ac; }.final-copy h2 { margin: 27px 0 20px; font: 500 clamp(62px, 11vw, 155px)/.72 var(--serif); letter-spacing: -.06em; }.final-copy h2 i { color: #c4d2ec; font-style: normal; }.final-surname { margin: 0; color: #deb0bd; font: 24px var(--serif); letter-spacing: .38em; text-transform: uppercase; }.final-date { display: inline-block; margin-top: 45px; color: rgba(243,239,234,.65); }.final-line { position: absolute; bottom: 7%; left: 7%; width: 86%; height: 1px; background: var(--line); }
.map-modal[hidden] { display: none; }.map-modal { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: 20px; }.modal-backdrop { position: absolute; inset: 0; background: rgba(21,18,39,.72); backdrop-filter: blur(9px); }.modal-card { position: relative; width: min(570px, 100%); background: var(--milk); color: var(--blue); padding: 40px; box-shadow: 0 25px 90px rgba(0,0,0,.3); animation: modal-in .45s ease both; }.modal-close { position: absolute; top: 11px; right: 16px; border: 0; background: none; color: var(--wine); font-size: 27px; }.modal-card .kicker { color: var(--wine); }.modal-card h2 { margin: 18px 0 0; font: 500 46px var(--serif); }.modal-card > p:not(.kicker) { margin: 4px 0 20px; font: 16px var(--serif); }.modal-card iframe { display: block; width: 100%; height: 240px; border: 0; filter: saturate(.7); }.modal-card a { display: inline-block; margin-top: 15px; color: var(--wine); font: 10px var(--mono); letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
@keyframes loader-out { to { opacity: 0; visibility: hidden; } } @keyframes loader-logo { to { opacity: .35; letter-spacing: .35em; } } @keyframes loader-line { from { transform: scaleX(0); } to { transform: scaleX(1); } } @keyframes bars { 50% { transform: scaleY(1.5); } } @keyframes arrow { 50% { transform: translateY(6px); } } @keyframes modal-in { from { opacity: 0; transform: translateY(15px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 700px) { .site-nav { padding: 20px; }.nav-caption { display: none; }.hero-meta { top: 92px; font-size: 8px; }.hero-meta span:last-child { display: none; }.hero-title { width: 94vw; }.hero-title h1 { gap: clamp(9px, 2.4vw, 15px); font-size: clamp(52px, 16vw, 104px); letter-spacing: -.07em; }.hero-title h1 .line-indent { margin-left: 3%; }.surname { margin-left: 0; font-size: 15px; letter-spacing: .3em; }.hero-date { margin-top: 28px; font-size: clamp(28px, 8vw, 38px); }.hero-countdown { right: auto; bottom: 28px; left: 20px; gap: 8px; font-size: 8px; }.hero-countdown strong { gap: 6px; font-size: 17px; }.hero-countdown strong small { font-size: 7px; }.location-scene { min-height: max(1280px, 150svh); padding: 80px 20px 55px; }.location-header { display: block; font-size: 20vw; line-height: .8; white-space: normal; }.location-word--right { display: block; margin: 28px 0 0 15%; }.location-intro { margin: 100px 0 0 7%; }.location-intro h2 { font-size: clamp(35px, 10vw, 54px); }.gallery { width: 100%; height: 560px; margin-top: 10px; }.gallery-card--large { left: 15%; width: 58%; }.gallery-card--large .image-wrap { height: 390px; }.gallery-card--top { top: 6%; right: 0; width: 30%; }.gallery-card--bottom { bottom: 4%; left: 0; width: 34%; }.gallery-card--small .image-wrap { height: 170px; }.location-footer { display: block; margin-top: 0; }.map-button { margin-top: 28px; }.date-layout { display: block; width: 86vw; padding-top: 19vh; }.date-intro { padding-top: 0; }.date-intro > p:last-child { margin-top: 20px; font-size: 42px; }.big-date { margin-top: 40px; font-size: 34vw; line-height: .65; }.date-info { margin: 50px 0 0; font-size: 9px; }.countdown { bottom: 28px; }.final-copy { max-width: 94vw; }.final-copy h2 { font-size: clamp(58px, 18vw, 112px); letter-spacing: -.07em; }.final-surname { font-size: 18px; }.modal-card { padding: 30px 21px 22px; } }
@supports (height: 100dvh) { .scene, .date-scene { min-height: 100dvh; } }
@media (pointer: fine) { html { scroll-behavior: smooth; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; scroll-snap-type: none; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Keep the long location scene freely scrollable while preserving scene snap points. */
.location-scene { min-height: 125svh; padding-top: 10vh; padding-bottom: 7vh; }
.location-word--right { margin-top: 60px; }
.location-intro { margin-top: 8vh; }
.gallery { height: 540px; margin-top: -2vh; }
.gallery-card--large .image-wrap { height: 430px; }
.gallery-card--small .image-wrap { height: 200px; }
.location-photo-placeholder { display: grid; place-items: center; border: 1px solid rgba(36,60,104,.35); background: linear-gradient(145deg, rgba(64,93,145,.26), rgba(132,45,73,.2)); color: var(--blue); }
.location-photo-placeholder::before { width: 70%; content: "ФОТО ВХОДА"; text-align: center; font: 10px var(--mono); letter-spacing: .18em; }
.location-footer { margin-top: 2vh; padding-top: 18px; }
@media (max-width: 700px) {
  .location-scene { min-height: 0; padding: 58px 20px 34px; }
  .location-word--right { margin-top: 20px; }
  .location-intro { margin-top: 52px; }
  .gallery { height: 430px; margin-top: 4px; }
  .gallery-card--large .image-wrap { height: 300px; }
  .gallery-card--small .image-wrap { height: 135px; }
  .location-footer { margin-top: 0; }
}
