/* Watercolor editorial opening — each visible layer is independently animated. */
@font-face {
  font-family: "SVN Wedding Signature";
  src: url("../assets/fonts/svn-signatie.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

body.landing-active {
  --landing-ink: #795845;
  --landing-gold: #c7a663;
  --landing-blush: #f8e9e4;
}

.landing-screen {
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.98) 0 25%, rgba(255,248,244,.88) 58%, rgba(246,229,222,.92) 100%) !important;
}

.landing-phone-frame {
  overflow: hidden !important;
  background: #fffaf7 !important;
}

.landing-paper-grain {
  opacity: .2 !important;
  mix-blend-mode: multiply;
}

.landing-bg-petals {
  display: none !important;
}

body.landing-active .petal-layer,
body.landing-active .heart-canvas {
  display: none !important;
}

.landing-card-shell {
  inset: 0 0 max(62px, calc(env(safe-area-inset-bottom) + 56px)) !important;
  padding: max(7px, env(safe-area-inset-top)) 0 6px !important;
  overflow: hidden !important;
}

.landing-content-stack {
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  background: linear-gradient(180deg, #fffaf7 0%, #fff8f4 100%) !important;
}

.landing-editorial-scene.landing-main-card {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  flex: 1 1 0 !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 0 10px 10px !important;
  background:
    linear-gradient(180deg, rgba(255,251,248,.98), rgba(255,248,243,.93)),
    radial-gradient(circle at 48% 64%, rgba(239,210,191,.22), transparent 45%) !important;
  box-shadow: none !important;
}

.landing-editorial-scene.landing-main-card::before,
.landing-editorial-scene.landing-main-card::after {
  content: none !important;
  display: none !important;
}

.landing-editorial-glow {
  position: absolute;
  z-index: 0;
  inset: 25% 8% 12%;
  background:
    radial-gradient(circle at 55% 42%, rgba(255,255,255,.96), rgba(252,236,225,.66) 39%, transparent 72%);
  filter: blur(2px);
  pointer-events: none;
}

.landing-editorial-watercolor {
  position: absolute;
  z-index: 1;
  top: 27%;
  bottom: 7%;
  left: 50%;
  width: min(326px, 80.5vw) !important;
  overflow: hidden;
  border-radius: 50% 50% 5% 5% / 24% 24% 4% 4%;
  background:
    radial-gradient(ellipse at 18% 45%, rgba(205,219,188,.48), transparent 32%),
    radial-gradient(ellipse at 82% 40%, rgba(237,202,192,.56), transparent 34%),
    radial-gradient(ellipse at 50% 66%, rgba(244,215,196,.72), transparent 50%),
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.94), rgba(250,232,217,.42) 59%, transparent 78%);
  filter: blur(4px) saturate(.82);
  opacity: .94;
  transform: translateX(-50%);
  pointer-events: none;
}

.landing-editorial-watercolor::before,
.landing-editorial-watercolor::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.landing-editorial-watercolor::before {
  background:
    radial-gradient(circle at 15% 39%, rgba(255,255,255,.95) 0 1px, transparent 2px),
    radial-gradient(circle at 24% 53%, rgba(255,247,218,.96) 0 1.5px, transparent 2.6px),
    radial-gradient(circle at 38% 36%, rgba(255,255,255,.9) 0 1px, transparent 2.2px),
    radial-gradient(circle at 58% 44%, rgba(255,247,217,.95) 0 1.2px, transparent 2.4px),
    radial-gradient(circle at 72% 32%, rgba(255,255,255,.92) 0 1px, transparent 2.2px),
    radial-gradient(circle at 84% 52%, rgba(255,243,205,.94) 0 1.4px, transparent 2.5px),
    radial-gradient(circle at 31% 69%, rgba(255,255,255,.94) 0 1.3px, transparent 2.6px),
    radial-gradient(circle at 67% 74%, rgba(255,247,218,.92) 0 1px, transparent 2.3px);
  filter: drop-shadow(0 0 4px rgba(255,239,185,.85));
  opacity: .88;
}

.landing-editorial-watercolor::after {
  background:
    linear-gradient(90deg, rgba(231,216,192,.2), transparent 22% 78%, rgba(229,210,190,.18)),
    radial-gradient(ellipse at 50% 92%, rgba(255,250,245,.96), transparent 54%);
  mix-blend-mode: screen;
}

.landing-editorial-botanical-overlay {
  position: absolute;
  z-index: 3;
  top: 27%;
  right: auto;
  bottom: 7%;
  left: 50%;
  width: min(310px, 76%);
  height: 66%;
  object-fit: fill;
  border-radius: 50% 50% 3px 3px / 25.5% 25.5% 3px 3px;
  clip-path: inset(0 round 50% 50% 3px 3px / 25.5% 25.5% 3px 3px);
  opacity: .66;
  filter: saturate(.78) contrast(.9) brightness(1.06);
  mix-blend-mode: multiply;
  transform: translateX(-50%);
  pointer-events: none;
}

.landing-editorial-side-floral {
  position: absolute;
  z-index: 3;
  display: block;
  height: auto;
  max-width: none;
  opacity: .3;
  filter: saturate(.72) blur(.35px);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.landing-editorial-side-floral-left {
  top: 36%;
  left: max(11%, calc(50% - 156px));
  width: 112px;
  transform: rotate(9deg) scale(.92);
}

.landing-editorial-side-floral-right {
  top: 40%;
  right: max(10.5%, calc(50% - 160px));
  width: 116px;
  transform: rotate(-7deg) scale(.9);
}

.landing-editorial-frame {
  position: absolute;
  z-index: 2;
  top: 18px;
  bottom: 18px;
  left: 50%;
  width: min(326px, 80.5%);
  transform: translateX(-50%);
  pointer-events: none;
}

.landing-editorial-frame::before,
.landing-editorial-frame::after {
  content: "";
  position: absolute;
  border-style: solid;
  border-radius: 50% 50% 3px 3px / 25.5% 25.5% 3px 3px;
  box-sizing: border-box;
}

.landing-editorial-frame::before {
  inset: 0;
  border-width: 1px;
  border-color: rgba(194,154,78,.82);
  box-shadow: 0 0 15px rgba(218,183,116,.08);
}

.landing-editorial-frame::after {
  inset: 6px 7px 7px;
  border-width: 1px;
  border-color: rgba(215,181,111,.62);
  border-bottom-color: rgba(215,181,111,.62);
  border-radius: 50% 50% 2px 2px / 25.2% 25.2% 2px 2px;
}

.landing-editorial-frame span,
.landing-editorial-frame i {
  position: absolute;
  bottom: -5px;
  width: 38px;
  height: 28px;
  border-bottom: 1px solid rgba(190,151,78,.7);
  opacity: .82;
}

.landing-editorial-frame span {
  right: -3px;
  border-right: 1px solid rgba(190,151,78,.7);
  transform: skew(-20deg);
}

.landing-editorial-frame i {
  left: -3px;
  border-left: 1px solid rgba(190,151,78,.7);
  transform: skew(20deg);
}

.landing-editorial-frame b {
  position: absolute;
  top: 26.5%;
  right: -5px;
  width: 9px;
  height: 9px;
  border: 1px solid rgba(194,154,78,.66);
  transform: rotate(45deg);
  opacity: .72;
}

.landing-editorial-frame b::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 7px;
  width: 1px;
  height: 23px;
  background: linear-gradient(rgba(194,154,78,.58), transparent);
  transform: rotate(-45deg);
  transform-origin: top;
}

.landing-editorial-frame-vine {
  position: absolute;
  z-index: 9;
  bottom: 17px;
  left: 50%;
  width: min(312px, 77%);
  height: 100px;
  overflow: visible;
  filter: drop-shadow(0 2px 4px rgba(128,108,65,.08));
  transform: translateX(-50%);
  pointer-events: none;
}

.landing-vine-stem,
.landing-vine-branch {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.landing-vine-stem {
  stroke: rgba(195,155,80,.72);
  stroke-width: 1.15;
}

.landing-vine-branch {
  opacity: 0;
}

.landing-vine-leaves {
  opacity: 0;
}

.landing-editorial-floral {
  position: absolute;
  z-index: 8;
  display: block;
  height: auto;
  max-width: none;
  pointer-events: none;
  filter: saturate(.88) contrast(.96) drop-shadow(0 7px 9px rgba(92,63,48,.1));
  user-select: none;
}

.landing-editorial-floral-top {
  top: -9px;
  left: -15px;
  width: clamp(182px, 51%, 214px);
  transform-origin: 8% 7%;
}

.landing-editorial-floral-bottom {
  right: -24px;
  bottom: -16px;
  width: clamp(205px, 58%, 245px);
  transform-origin: 92% 93%;
}

.landing-editorial-copy {
  position: absolute !important;
  z-index: 7;
  top: clamp(82px, 9.6vh, 92px);
  left: 50%;
  display: grid !important;
  width: min(292px, 75%);
  margin: 0 !important;
  gap: 2px;
  justify-items: center;
  transform: translateX(-50%);
  text-align: center;
}

.landing-editorial-copy .landing-couple-title {
  display: grid !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  gap: 4px !important;
  align-items: baseline !important;
  justify-content: center !important;
  color: #a8794f !important;
  font: 400 clamp(27px, 7.7vw, 34px)/1.03 "SVN Wedding Signature", "Great Vibes", cursive !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 9px rgba(163,113,66,.08) !important;
}

.landing-editorial-copy .landing-couple-title > span {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.landing-editorial-copy .landing-couple-title > i {
  display: block !important;
  width: 100% !important;
  margin: 3px 0 4px !important;
  color: #9e7958 !important;
  font: 400 clamp(19px, 5vw, 23px)/1 "SVN Wedding Signature", "Great Vibes", cursive !important;
  text-align: center !important;
}

.landing-editorial-ceremony-copy {
  position: absolute;
  z-index: 7;
  top: clamp(207px, 25.4vh, 226px);
  right: 0;
  left: 0;
  display: grid;
  width: min(310px, 82%);
  gap: 4px;
  justify-items: center;
  margin: 0 auto;
  text-align: center;
}

.landing-editorial-invite {
  margin: 0 !important;
  color: #9a806b;
  font: 500 clamp(10px, 2.7vw, 12px)/1.15 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .035em;
}

.landing-editorial-wedding {
  margin: 0 !important;
  color: #a78150;
  font: 600 clamp(18px, 5.2vw, 23px)/1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .19em;
  text-indent: .19em;
  text-transform: uppercase;
}

.landing-editorial-couple {
  position: absolute;
  z-index: 4;
  inset: clamp(195px, 25.6vh, 218px) -18px 24px;
  margin: 0;
  pointer-events: none;
}

.landing-editorial-couple img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center 33%;
  filter: saturate(.88) contrast(.97) drop-shadow(0 10px 18px rgba(116,82,65,.06));
}

.landing-editorial-details {
  position: absolute;
  z-index: 9;
  right: 0;
  bottom: 78px;
  left: 0;
  display: grid;
  width: min(292px, 76%);
  margin: 0 auto;
  gap: 6px;
  justify-items: center;
  color: #9a785b;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255,255,255,.85);
}

.landing-editorial-details .landing-date {
  min-height: 0 !important;
  margin: 0 !important;
  color: #9b744b !important;
  font-family: "Playfair Display", "Times New Roman", serif !important;
  font-size: clamp(22px, 5.8vw, 27px) !important;
  font-style: normal !important;
  font-weight: 600 !important;
  font-variant-numeric: lining-nums tabular-nums !important;
  font-feature-settings: "lnum" 1, "tnum" 1 !important;
  line-height: 1.08 !important;
  letter-spacing: .065em !important;
}

.landing-editorial-details p {
  display: flex;
  margin: 0;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font: 600 clamp(9px, 2.45vw, 11px)/1.25 "Montserrat", sans-serif;
  letter-spacing: .075em;
}

.landing-editorial-details p span:last-child {
  flex-basis: 100%;
}

.landing-editorial-details b {
  color: #caa664;
  font-size: 7px;
}

.landing-editorial-sparkles {
  position: absolute;
  z-index: 6;
  inset: 0;
  pointer-events: none;
}

.landing-editorial-sparkles i {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #e5c57f;
  box-shadow: 0 0 8px rgba(222,185,110,.75);
}
.landing-editorial-sparkles i:nth-child(1) { top: 23%; left: 17%; }
.landing-editorial-sparkles i:nth-child(2) { top: 35%; right: 17%; width: 3px; height: 3px; }
.landing-editorial-sparkles i:nth-child(3) { top: 56%; left: 13%; width: 3px; height: 3px; }
.landing-editorial-sparkles i:nth-child(4) { top: 67%; right: 12%; }
.landing-editorial-sparkles i:nth-child(5) { top: 81%; left: 25%; width: 2px; height: 2px; }

.landing-quick-actions {
  position: relative !important;
  z-index: 15 !important;
  flex: 0 0 68px !important;
  width: min(268px, 74vw) !important;
  min-height: 68px !important;
  margin: 5px 0 3px !important;
  gap: 28px !important;
  background: transparent !important;
}

.landing-quick-actions .landing-action-icon {
  width: 46px !important;
  height: 46px !important;
}

.landing-quick-actions b {
  display: block !important;
  margin-top: 2px !important;
  color: #94705f !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
}

.landing-quick-actions small {
  min-height: 0 !important;
  font-size: 7px !important;
}

.landing-enter-button {
  position: relative !important;
  z-index: 16 !important;
  flex: 0 0 47px !important;
  width: min(310px, 82vw) !important;
  min-height: 47px !important;
  height: 47px !important;
  margin: 0 !important;
  background: linear-gradient(135deg, #bd8e7f, #d9aaa0) !important;
  font-size: 11px !important;
  letter-spacing: .18em !important;
}

/* Match the lower navigation to the RSVP / QR label above it. */
body.landing-active .landing-bottom-nav button,
body.landing-active .landing-bottom-nav button.is-active,
body.landing-active .landing-bottom-nav button b,
body.landing-active .landing-bottom-nav button svg {
  color: #94705f !important;
}

.landing-editorial-scene + .landing-quick-actions,
.landing-quick-actions + .landing-enter-button {
  box-shadow: none !important;
}

/* Independent staged entrance. */
.landing-screen.is-motion-preparing .landing-editorial-frame,
.landing-screen.is-motion-preparing .landing-editorial-frame-vine,
.landing-screen.is-motion-preparing .landing-editorial-watercolor,
.landing-screen.is-motion-preparing .landing-editorial-botanical-overlay,
.landing-screen.is-motion-preparing .landing-editorial-side-floral,
.landing-screen.is-motion-preparing .landing-editorial-floral,
.landing-screen.is-motion-preparing .landing-editorial-copy > *,
.landing-screen.is-motion-preparing .landing-editorial-ceremony-copy,
.landing-screen.is-motion-preparing .landing-editorial-couple,
.landing-screen.is-motion-preparing .landing-editorial-details,
.landing-screen.is-motion-preparing .landing-editorial-sparkles {
  opacity: 0 !important;
}

.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-frame {
  animation: editorialFrameDraw 1.25s cubic-bezier(.22,.7,.2,1) .12s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-frame-vine {
  animation: editorialVineGrow 1.15s cubic-bezier(.22,.7,.2,1) .62s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-watercolor {
  animation: editorialWatercolorIn 1.3s ease-out .38s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-botanical-overlay {
  animation: editorialBotanicalIn 1.45s cubic-bezier(.22,.7,.2,1) .62s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-side-floral-left {
  animation: editorialSideLeftIn 1.15s ease-out .55s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-side-floral-right {
  animation: editorialSideRightIn 1.15s ease-out .7s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-floral-top {
  animation: editorialFloralTopIn 1.15s cubic-bezier(.18,.83,.25,1) .2s both, editorialFloralTopFloat 8s ease-in-out 1.7s infinite alternate;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-floral-bottom {
  animation: editorialFloralBottomIn 1.2s cubic-bezier(.18,.83,.25,1) .42s both, editorialFloralBottomFloat 8.8s ease-in-out 1.9s infinite alternate;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-copy .landing-couple-title {
  animation: editorialTextIn .9s cubic-bezier(.18,.82,.24,1) .5s both !important;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-ceremony-copy {
  animation: editorialTextIn .75s ease-out .76s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-wedding {
  animation: editorialTrackingIn .9s ease-out .9s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-couple {
  animation: editorialCoupleIn 1.25s cubic-bezier(.18,.78,.2,1) .72s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-details {
  animation: editorialTextIn .85s ease-out 1.25s both;
}
.landing-screen.landing-motion-ready:not(.is-leaving) .landing-editorial-sparkles {
  animation: editorialSparkleIn .8s ease-out 1.25s both;
}
.landing-screen.landing-motion-ready .landing-editorial-sparkles i {
  animation: editorialSparkle 2.2s ease-in-out infinite alternate;
}
.landing-screen.landing-motion-ready .landing-editorial-sparkles i:nth-child(2) { animation-delay: .4s; }
.landing-screen.landing-motion-ready .landing-editorial-sparkles i:nth-child(3) { animation-delay: .8s; }
.landing-screen.landing-motion-ready .landing-editorial-sparkles i:nth-child(4) { animation-delay: 1.1s; }
.landing-screen.landing-motion-ready .landing-editorial-sparkles i:nth-child(5) { animation-delay: 1.5s; }

@keyframes editorialFrameDraw {
  from { opacity: 0; clip-path: inset(0 100% 100% 0); filter: blur(2px); }
  to { opacity: 1; clip-path: inset(0); filter: blur(0); }
}
@keyframes editorialVineGrow {
  from { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-50%) translateY(5px); }
  to { opacity: 1; clip-path: inset(0); transform: translateX(-50%) translateY(0); }
}
@keyframes editorialWatercolorIn {
  from { opacity: 0; transform: translateX(-50%) scale(.94); filter: blur(12px) saturate(.65); }
  to { opacity: .94; transform: translateX(-50%) scale(1); filter: blur(4px) saturate(.82); }
}
@keyframes editorialBotanicalIn {
  from { opacity: 0; clip-path: inset(100% 0 0); transform: translateX(-50%) translateY(10px) scale(.97); filter: blur(8px) saturate(.58); }
  to { opacity: .66; clip-path: inset(0 round 50% 50% 3px 3px / 25.5% 25.5% 3px 3px); transform: translateX(-50%) translateY(0) scale(1); filter: saturate(.78) contrast(.9) brightness(1.06); }
}
@keyframes editorialSideLeftIn {
  from { opacity: 0; transform: translateX(-22px) rotate(4deg) scale(.84); filter: blur(5px) saturate(.6); }
  to { opacity: .3; transform: rotate(9deg) scale(.92); filter: blur(.35px) saturate(.72); }
}
@keyframes editorialSideRightIn {
  from { opacity: 0; transform: translateX(22px) rotate(-2deg) scale(.82); filter: blur(5px) saturate(.6); }
  to { opacity: .3; transform: rotate(-7deg) scale(.9); filter: blur(.35px) saturate(.72); }
}
@keyframes editorialFloralTopIn {
  from { opacity: 0; transform: translate(-24px,-20px) scale(.84) rotate(-4deg); filter: blur(5px) saturate(.75); }
  to { opacity: 1; transform: translate(0) scale(1) rotate(0); filter: blur(0) saturate(.88) contrast(.96) drop-shadow(0 7px 9px rgba(92,63,48,.1)); }
}
@keyframes editorialFloralBottomIn {
  from { opacity: 0; transform: translate(26px,22px) scale(.84) rotate(4deg); filter: blur(5px) saturate(.75); }
  to { opacity: 1; transform: translate(0) scale(1) rotate(0); filter: blur(0) saturate(.88) contrast(.96) drop-shadow(0 7px 9px rgba(92,63,48,.1)); }
}
@keyframes editorialFloralTopFloat {
  from { translate: 0 0; }
  to { translate: 2px 4px; }
}
@keyframes editorialFloralBottomFloat {
  from { translate: 0 0; }
  to { translate: -3px -2px; }
}
@keyframes editorialTextIn {
  from { opacity: 0; transform: translateY(14px); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes editorialTrackingIn {
  from { opacity: 0; letter-spacing: .36em; transform: translateY(10px); filter: blur(4px); }
  to { opacity: 1; letter-spacing: .19em; transform: translateY(0); filter: blur(0); }
}
@keyframes editorialCoupleIn {
  from { opacity: 0; clip-path: inset(16% 4% 0); transform: translateY(24px) scale(.97); filter: blur(7px) saturate(.7); }
  to { opacity: 1; clip-path: inset(0); transform: translateY(0) scale(1); filter: blur(0) saturate(1); }
}
@keyframes editorialSparkleIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes editorialSparkle {
  from { opacity: .25; transform: scale(.7); }
  to { opacity: .95; transform: scale(1.45); }
}

@media (max-height: 740px) {
  .landing-editorial-copy { top: 62px; }
  .landing-editorial-copy .landing-couple-title { font-size: clamp(26px, 7.5vw, 32px) !important; }
  .landing-editorial-ceremony-copy { top: 174px; }
  .landing-editorial-wedding { font-size: clamp(16px, 4.6vw, 20px); }
  .landing-editorial-couple { inset: 177px -9px 23px; }
  .landing-editorial-details { bottom: 62px; }
  .landing-editorial-floral-top { width: 176px; }
  .landing-editorial-floral-bottom { width: 195px; }
  .landing-quick-actions { flex-basis: 61px !important; min-height: 61px !important; margin-top: 3px !important; }
  .landing-quick-actions .landing-action-icon { width: 41px !important; height: 41px !important; }
  .landing-quick-actions b { font-size: 8px !important; }
  .landing-enter-button { flex-basis: 43px !important; min-height: 43px !important; height: 43px !important; }
}

@media (max-height: 620px) {
  .landing-editorial-copy { top: 46px; }
  .landing-editorial-copy .landing-couple-title { font-size: clamp(24px, 7.1vw, 29px) !important; }
  .landing-editorial-ceremony-copy { top: 147px; }
  .landing-editorial-invite { font-size: 9px; }
  .landing-editorial-couple { inset: 151px 3px 18px; }
  .landing-editorial-details { bottom: 48px; }
  .landing-editorial-floral-top { width: 148px; }
  .landing-editorial-floral-bottom { width: 170px; }
  .landing-quick-actions { flex-basis: 53px !important; min-height: 53px !important; gap: 20px !important; }
  .landing-quick-actions .landing-action-icon { width: 35px !important; height: 35px !important; }
  .landing-quick-actions b { font-size: 7px !important; }
}

/* Edge-to-edge mobile canvas with safe zones for notches and gesture bars. */
@media (max-width: 600px) {
  html,
  body,
  .landing-screen,
  .landing-phone-frame {
    width: 100% !important;
    max-width: none !important;
    min-height: 100dvh !important;
    height: 100dvh !important;
  }

  .landing-screen,
  .landing-phone-frame {
    border: 0 !important;
    border-radius: 0 !important;
  }

  .landing-music-control {
    top: max(12px, calc(env(safe-area-inset-top) + 8px)) !important;
    right: max(12px, calc(env(safe-area-inset-right) + 10px)) !important;
  }

  .landing-bottom-nav {
    height: max(62px, calc(56px + env(safe-area-inset-bottom))) !important;
    padding-right: max(6px, env(safe-area-inset-right)) !important;
    padding-bottom: max(5px, env(safe-area-inset-bottom)) !important;
    padding-left: max(6px, env(safe-area-inset-left)) !important;
  }
}

@supports not (height: 100dvh) {
  @media (max-width: 600px) {
    html,
    body,
    .landing-screen,
    .landing-phone-frame {
      min-height: 100vh !important;
      height: 100vh !important;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-screen.is-motion-preparing .landing-editorial-frame,
  .landing-screen.is-motion-preparing .landing-editorial-frame-vine,
  .landing-screen.is-motion-preparing .landing-editorial-watercolor,
  .landing-screen.is-motion-preparing .landing-editorial-botanical-overlay,
  .landing-screen.is-motion-preparing .landing-editorial-side-floral,
  .landing-screen.is-motion-preparing .landing-editorial-floral,
  .landing-screen.is-motion-preparing .landing-editorial-copy > *,
  .landing-screen.is-motion-preparing .landing-editorial-ceremony-copy,
  .landing-screen.is-motion-preparing .landing-editorial-couple,
  .landing-screen.is-motion-preparing .landing-editorial-details,
  .landing-screen.is-motion-preparing .landing-editorial-sparkles {
    opacity: 1 !important;
  }
}
