/* =========================================================
   EMERALD MODERN V2 — LUXURY EDITORIAL
   updated for new presets.php themes
========================================================= */

* {
  box-sizing: border-box;
}

:root {
  --em-bg: #0e0f10;
  --em-bg2: #1b1b1d;
  --em-paper: #222225;
  --em-ink: #fff9f0;
  --em-muted: #d7cec3;
  --em-line: rgba(255, 249, 240, .15);
  --em-accent: #d8c7b4;
  --em-accent-hover: #bfa98f;
  --em-accent2: #f5ede1;
  --em-accent-soft: rgba(216, 199, 180, .16);
  --em-accent-rgb: 216, 199, 180;
  --em-on-accent: #151515;

  --em-max: 1120px;
  --em-wide: 1240px;

  --em-radius-xl: 36px;
  --em-radius: 28px;
  --em-radius-sm: 18px;

  --em-section-y: clamp(76px, 9vw, 136px);

  --em-font-serif: "Cormorant Garamond", Georgia, serif;
  --em-font-sans: Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --em-surface: color-mix(in srgb, var(--em-paper) 78%, rgba(255, 255, 255, .055) 22%);
  --em-surface-2: color-mix(in srgb, var(--em-paper) 88%, var(--em-accent-soft) 12%);
  --em-surface-3: color-mix(in srgb, var(--em-bg2) 70%, var(--em-paper) 30%);

  --em-border: color-mix(in srgb, var(--em-line) 76%, var(--em-accent) 24%);
  --em-border-soft: color-mix(in srgb, var(--em-line) 82%, transparent 18%);

  --em-shadow-soft: 0 18px 54px rgba(0, 0, 0, .18);
  --em-shadow-card: 0 34px 96px rgba(0, 0, 0, .28);

  --em-field-bg: rgba(255, 255, 255, .94);
  --em-field-ink: #202020;

  --em-chip-bg: rgba(255, 255, 255, .105);
  --em-chip-bg-hover: rgba(255, 255, 255, .16);
  --em-chip-ink: var(--em-ink);
}

html[data-dark="0"] {
  --em-surface: color-mix(in srgb, var(--em-paper) 92%, var(--em-bg2) 8%);
  --em-surface-2: color-mix(in srgb, var(--em-paper) 80%, var(--em-bg) 20%);
  --em-surface-3: color-mix(in srgb, var(--em-bg2) 74%, var(--em-paper) 26%);

  --em-border: color-mix(in srgb, var(--em-line) 78%, var(--em-accent) 22%);
  --em-border-soft: color-mix(in srgb, var(--em-line) 86%, transparent 14%);

  --em-shadow-soft: 0 18px 54px rgba(38, 50, 45, .075);
  --em-shadow-card: 0 28px 76px rgba(38, 50, 45, .11);

  --em-field-bg: rgba(255, 255, 255, .92);
  --em-field-ink: #202020;

  --em-chip-bg: rgba(255, 255, 255, .62);
  --em-chip-bg-hover: rgba(255, 255, 255, .88);
  --em-chip-ink: var(--em-ink);
}

html {
  scroll-behavior: smooth;
}

html,
body {
  min-height: 100%;
  margin: 0;
  padding: 0;
}

body.emBody {
  min-height: 100%;
  color: var(--em-ink);
  font-family: var(--em-font-sans);
  overflow-x: hidden;
  background:
    radial-gradient(900px 540px at 50% -10%, color-mix(in srgb, var(--em-accent) 15%, transparent 85%), transparent 70%),
    radial-gradient(760px 520px at 6% 18%, color-mix(in srgb, var(--em-accent2) 8%, transparent 92%), transparent 74%),
    radial-gradient(680px 520px at 96% 32%, color-mix(in srgb, var(--em-accent) 11%, transparent 89%), transparent 76%),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--em-bg2) 94%, black 6%) 0%,
      var(--em-bg2) 22%,
      var(--em-bg) 58%,
      color-mix(in srgb, var(--em-bg) 88%, black 12%) 100%
    );
}

html[data-dark="0"] body.emBody {
  background:
    radial-gradient(900px 540px at 50% -12%, color-mix(in srgb, var(--em-accent) 13%, transparent 87%), transparent 70%),
    radial-gradient(760px 520px at 7% 18%, color-mix(in srgb, var(--em-accent2) 20%, transparent 80%), transparent 74%),
    radial-gradient(680px 520px at 96% 32%, color-mix(in srgb, var(--em-accent) 9%, transparent 91%), transparent 76%),
    linear-gradient(
      180deg,
      var(--em-bg2) 0%,
      var(--em-bg) 46%,
      color-mix(in srgb, var(--em-bg) 88%, var(--em-accent-soft) 12%) 100%
    );
}

body.emBody::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .032), transparent 24%, rgba(0, 0, 0, .10) 100%),
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .052) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 32%, rgba(255, 255, 255, .04) 0 1px, transparent 1.5px);
  background-size: auto, 86px 86px, 112px 112px;
  opacity: .84;
}

html[data-dark="0"] body.emBody::before {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .42), transparent 30%, rgba(255, 255, 255, .18) 100%),
    radial-gradient(circle at 18% 18%, rgba(0, 0, 0, .055) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 32%, rgba(0, 0, 0, .035) 0 1px, transparent 1.5px);
  opacity: .16;
}

body.emBody::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--em-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--em-line) 1px, transparent 1px);
  background-size: 92px 92px;
  opacity: .07;
}

html[data-dark="0"] body.emBody::after {
  opacity: .12;
}

.emPage {
  position: relative;
  z-index: 1;
  min-height: 100vh;
}

.emPage *,
.emStickyRsvp *,
.iviMusic * {
  box-sizing: border-box;
}

.emPage img {
  display: block;
  max-width: 100%;
}

.emPage a {
  color: var(--em-accent2);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

html[data-dark="0"] .emPage a {
  color: var(--em-accent);
}

.emPage p,
.emPage li {
  color: var(--em-muted);
  font-size: 16px;
  line-height: 1.72;
}

.emPage h1,
.emPage h2,
.emPage h3 {
  margin: 0;
  color: var(--em-ink);
  font-family: var(--em-font-serif);
  font-weight: 500;
}

.emPage h2 {
  font-size: clamp(46px, 7.4vw, 94px);
  line-height: .96;
  letter-spacing: -.045em;
  padding-bottom: .08em;
}

.emPage h3 {
  font-size: clamp(30px, 4vw, 46px);
  line-height: .98;
  letter-spacing: -.025em;
}

.emSmallTitle {
  margin: 0 0 14px;
  color: color-mix(in srgb, var(--em-accent2) 82%, white 18%);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .24em;
  text-transform: uppercase;
}

html[data-dark="0"] .emSmallTitle {
  color: color-mix(in srgb, var(--em-accent) 70%, var(--em-ink) 30%);
}

.emDivider {
  width: 168px;
  height: 1px;
  margin: 24px auto;
  background: linear-gradient(90deg, transparent, var(--em-accent), transparent);
}

.emDividerLeft {
  margin-left: 0;
  margin-right: auto;
}

.emSection {
  position: relative;
  padding: var(--em-section-y) 20px;
}

.emSection::before {
  content: "";
  position: absolute;
  inset: 28px max(16px, 4vw);
  z-index: -1;
  pointer-events: none;
  border-radius: 52px;
  background:
    radial-gradient(680px 320px at 50% 0%, color-mix(in srgb, var(--em-accent) 8%, transparent 92%), transparent 72%);
  opacity: .72;
}

html[data-dark="0"] .emSection::before {
  background:
    radial-gradient(680px 320px at 50% 0%, color-mix(in srgb, var(--em-accent) 7%, transparent 93%), transparent 72%);
  opacity: .7;
}

.emHead {
  width: min(var(--em-max), 100%);
  margin: 0 auto 48px;
  text-align: center;
}

.emHead p {
  max-width: 700px;
  margin: 18px auto 0;
  color: var(--em-muted);
}

.emReveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .7s ease, transform .7s ease;
}

.emReveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* =========================================================
   HERO
========================================================= */

.emHero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 76px 18px;
  overflow: hidden;
  background: var(--em-bg);
}

.emHeroImg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-pos, 50% 35%);
  filter: saturate(1.02) contrast(1.02);
  transform: scale(1.01);
}

.emHeroOverlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .34), rgba(0, 0, 0, .20) 44%, rgba(0, 0, 0, .64)),
    radial-gradient(920px 560px at 50% 48%, transparent 0%, rgba(0, 0, 0, .16) 52%, rgba(0, 0, 0, .44) 100%);
}

.emHeroInner {
  position: relative;
  z-index: 2;
  width: min(980px, 100%);
  text-align: center;
  color: #fff;
}

.emHeroInner .emSmallTitle {
  color: rgba(255, 255, 255, .82);
}

.emHeroTitle {
  color: #fff !important;
  font-size: clamp(76px, 13vw, 176px);
  line-height: 1;
  letter-spacing: -.06em;
  text-shadow: 0 28px 78px rgba(0, 0, 0, .36);
}

.emHeroText {
  max-width: 760px;
  margin: 0 auto;
  color: rgba(255, 255, 255, .88) !important;
  font-size: clamp(16px, 2vw, 20px);
}

.emHeroDate {
  margin-top: 24px;
  color: #fff;
  font-family: var(--em-font-serif);
  font-size: clamp(36px, 5vw, 72px);
  line-height: 1;
}

.emHeroDate span {
  color: var(--em-accent2);
  margin: 0 .24em;
}

.emHeroChips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 26px;
}

.emHeroChips span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 13px;
  border-radius: 999px;
  color: rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .20);
  font-size: 12px;
  backdrop-filter: blur(10px);
}

.emHeroActions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 34px;
}

/* =========================================================
   BUTTONS
========================================================= */

.emBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 52px;
  padding: 0 22px;
  border-radius: 999px;
  border: 1px solid var(--em-border);
  background: var(--em-surface);
  color: var(--em-ink);
  text-decoration: none;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease, filter .15s ease;
}

.emBtn .bi {
  font-size: 15px;
  line-height: 1;
}

.emBtn:hover {
  transform: translateY(-1px);
}

.emBtnMain {
  background: var(--em-accent) !important;
  border-color: var(--em-accent) !important;
  color: var(--em-on-accent) !important;
}

.emBtnMain:hover {
  background: var(--em-accent-hover) !important;
  border-color: var(--em-accent-hover) !important;
}

.emBtnSoft {
  background: rgba(255, 255, 255, .16);
  color: #fff;
  border-color: rgba(255, 255, 255, .26);
}

/* =========================================================
   TIMER
========================================================= */

.emTimerSection {
  --timer-title: var(--em-ink);
  --timer-text: var(--em-muted);
  --timer-kicker: var(--em-accent);
  --timer-card: color-mix(in srgb, var(--em-paper) 88%, var(--em-bg2) 12%);
  --timer-card-2: color-mix(in srgb, var(--em-paper) 76%, var(--em-bg) 24%);
  --timer-line: color-mix(in srgb, var(--em-line) 78%, var(--em-accent) 22%);
  --timer-number: var(--em-ink);
  --timer-label: var(--em-accent);
}

html[data-dark="1"] .emTimerSection {
  --timer-text: color-mix(in srgb, var(--em-muted) 88%, transparent 12%);
  --timer-kicker: var(--em-accent2);
  --timer-card: color-mix(in srgb, var(--em-paper) 74%, rgba(255, 255, 255, .055) 26%);
  --timer-card-2: color-mix(in srgb, var(--em-paper) 86%, var(--em-accent-soft) 14%);
  --timer-line: color-mix(in srgb, rgba(255, 255, 255, .15) 72%, var(--em-accent) 28%);
  --timer-label: var(--em-accent2);
}

.emTimerSection .emHead {
  margin-bottom: clamp(32px, 5vw, 58px) !important;
}

.emTimerSection .emHead .emSmallTitle {
  color: var(--timer-kicker) !important;
}

.emTimerSection .emHead h2 {
  color: var(--timer-title) !important;
  line-height: .96 !important;
  padding-bottom: .08em;
}

.emTimerSection .emHead p {
  color: var(--timer-text) !important;
  max-width: 720px;
}

.emTimer {
  width: min(980px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--timer-line);
  border-radius: 34px;
  background:
    radial-gradient(520px 180px at 50% 0%, rgba(var(--em-accent-rgb), .12), transparent 72%),
    linear-gradient(180deg, var(--timer-card), var(--timer-card-2));
  box-shadow:
    0 26px 70px rgba(0, 0, 0, .13),
    inset 0 1px 0 rgba(255, 255, 255, .08);
}

.emTimer div {
  min-height: clamp(126px, 13vw, 168px);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 14px;
  padding: 28px 16px;
  text-align: center;
  border-right: 1px solid var(--timer-line);
}

.emTimer div:last-child {
  border-right: 0;
}

.emTimer b {
  display: block;
  color: var(--timer-number) !important;
  font-family: var(--em-font-serif);
  font-size: clamp(54px, 7vw, 96px);
  font-weight: 600;
  line-height: .82;
  letter-spacing: -.045em;
  font-variant-numeric: tabular-nums;
}

.emTimer span {
  display: block;
  color: var(--timer-label) !important;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-top: 10px;
}

html[data-dark="0"] .emTimer {
  box-shadow:
    0 24px 60px rgba(39, 50, 46, .095),
    inset 0 1px 0 rgba(255, 255, 255, .65);
}

html[data-dark="0"] .emTimer div {
  background: rgba(255, 255, 255, .18);
}

/* =========================================================
   STORY
========================================================= */

.emStoryGrid {
  width: min(var(--em-max), 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .85fr);
  gap: clamp(30px, 5vw, 76px);
  align-items: center;
}

.emStoryContent {
  text-align: left;
}

.emText {
  margin-top: 22px;
}

.emText p + p {
  margin-top: 14px;
}

.emStoryImage {
  min-height: 540px;
  overflow: hidden;
  border-radius: var(--em-radius-xl);
  background: var(--em-surface);
  box-shadow: var(--em-shadow-soft);
  border: 1px solid var(--em-border-soft);
}

.emStoryImage img {
  width: 100%;
  height: 100%;
  min-height: 540px;
  object-fit: cover;
}

/* =========================================================
   PROGRAM — elegant flowing timeline
========================================================= */

.emProgramSection {
  overflow: hidden;
}

.emProgramRoad {
  position: relative;
  width: min(1040px, 100%);
  margin: 0 auto;
  padding: 10px 0;
}

.emProgramLine {
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      color-mix(in srgb, var(--em-accent) 34%, transparent 66%) 8%,
      color-mix(in srgb, var(--em-accent2) 52%, transparent 48%) 28%,
      color-mix(in srgb, var(--em-accent) 58%, transparent 42%) 52%,
      color-mix(in srgb, var(--em-accent2) 52%, transparent 48%) 76%,
      color-mix(in srgb, var(--em-accent) 34%, transparent 66%) 92%,
      transparent 100%
    );
  box-shadow:
    0 0 18px rgba(var(--em-accent-rgb), .12),
    0 0 42px rgba(var(--em-accent-rgb), .08);
}

.emProgramLine::before {
  content: "";
  position: absolute;
  inset: 10px -3px;
  border-radius: 999px;
  background:
    repeating-linear-gradient(
      180deg,
      transparent 0 18px,
      rgba(var(--em-accent-rgb), .30) 18px 21px,
      transparent 21px 42px
    );
  opacity: .45;
  pointer-events: none;
}

.emProgramLine::after {
  content: "";
  position: absolute;
  inset: 8% -18px;
  border-radius: 999px;
  background:
    radial-gradient(
      closest-side,
      rgba(var(--em-accent-rgb), .10),
      transparent 70%
    );
  filter: blur(10px);
  opacity: .55;
  pointer-events: none;
}

html[data-dark="0"] .emProgramLine {
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      color-mix(in srgb, var(--em-accent) 30%, transparent 70%) 8%,
      color-mix(in srgb, var(--em-accent) 48%, transparent 52%) 28%,
      color-mix(in srgb, var(--em-accent) 58%, transparent 42%) 52%,
      color-mix(in srgb, var(--em-accent) 48%, transparent 52%) 76%,
      color-mix(in srgb, var(--em-accent) 30%, transparent 70%) 92%,
      transparent 100%
    );
  box-shadow:
    0 0 18px rgba(var(--em-accent-rgb), .10),
    0 0 38px rgba(var(--em-accent-rgb), .06);
}

html[data-dark="0"] .emProgramLine::before {
  opacity: .38;
}

html[data-dark="0"] .emProgramLine::after {
  opacity: .36;
}

.emProgramStop {
  position: relative;
  min-height: 140px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr);
  align-items: center;
  margin: -2px 0;
}

.emProgramStop:nth-of-type(even) .emProgramCard {
  grid-column: 1;
  text-align: right;
  justify-self: end;
}

.emProgramStop:nth-of-type(odd) .emProgramCard {
  grid-column: 3;
  text-align: left;
  justify-self: start;
}

.emProgramPin {
  position: relative;
  z-index: 2;
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--em-on-accent);
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--em-accent2) 34%, var(--em-accent) 66%),
      var(--em-accent)
    );
  border: 1px solid color-mix(in srgb, var(--em-accent2) 24%, transparent 76%);
  box-shadow:
    0 12px 30px rgba(0, 0, 0, .14),
    0 0 0 6px color-mix(in srgb, var(--em-bg) 58%, transparent 42%);
}

html[data-dark="0"] .emProgramPin {
  box-shadow:
    0 12px 30px rgba(39, 50, 46, .10),
    0 0 0 6px color-mix(in srgb, var(--em-bg) 64%, transparent 36%);
}

.emProgramPin::before {
  content: "";
  position: absolute;
  inset: -10px;
  z-index: -1;
  border-radius: inherit;
  background:
    radial-gradient(circle, rgba(var(--em-accent-rgb), .14), transparent 64%);
  opacity: .9;
}

.emProgramPin .bi {
  font-size: 22px;
  line-height: 1;
}

.emProgramCard {
  position: relative;
  width: min(430px, 100%);
  padding: 24px 26px;
  border-radius: 28px;
  border: 1px solid var(--em-border);
  background:
    radial-gradient(260px 160px at 100% 0%, rgba(var(--em-accent-rgb), .09), transparent 70%),
    linear-gradient(180deg, var(--em-surface-2), var(--em-surface));
  box-shadow: var(--em-shadow-soft);
}

html[data-dark="0"] .emProgramCard {
  background:
    radial-gradient(260px 160px at 100% 0%, rgba(var(--em-accent-rgb), .075), transparent 70%),
    linear-gradient(180deg, var(--em-surface), var(--em-surface-2));
}

.emProgramCard::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 36px;
  height: 1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      color-mix(in srgb, var(--em-accent) 48%, transparent 52%)
    );
}

.emProgramStop:nth-of-type(even) .emProgramCard::before {
  right: -37px;
  transform: scaleX(-1);
}

.emProgramStop:nth-of-type(odd) .emProgramCard::before {
  left: -37px;
}

.emProgramCard time {
  display: inline-flex;
  align-items: center;
  margin-bottom: 10px;
  color: var(--em-accent2);
  font-family: var(--em-font-serif);
  font-size: clamp(38px, 4.5vw, 60px);
  font-weight: 600;
  line-height: .82;
  letter-spacing: -.04em;
}

html[data-dark="0"] .emProgramCard time {
  color: var(--em-accent);
}

.emProgramCard h3 {
  margin: 0 0 9px;
  color: var(--em-ink);
  font-size: clamp(28px, 3.4vw, 42px);
}

.emProgramCard p {
  margin: 0;
  color: var(--em-muted);
}

.emProgramStop:nth-of-type(4n + 1) .emProgramPin {
  transform: translateX(-6px);
}

.emProgramStop:nth-of-type(4n + 2) .emProgramPin {
  transform: translateX(7px);
}

.emProgramStop:nth-of-type(4n + 3) .emProgramPin {
  transform: translateX(2px);
}

.emProgramStop:nth-of-type(4n + 4) .emProgramPin {
  transform: translateX(-4px);
}

/* =========================================================
   INTEGRATED BLOCKS
========================================================= */

.emIntegratedBlock {
  width: min(var(--em-max), 100%);
  margin: 0 auto;
}

.emLocationBlock,
.emDressBlock,
.emRsvpBlock {
  padding: 0;
}

/* =========================================================
   LOCATION
========================================================= */

.emLocationBlock {
  --loc-bg: color-mix(in srgb, var(--em-paper) 72%, rgba(255, 255, 255, .045) 28%);
  --loc-bg-2: color-mix(in srgb, var(--em-paper) 86%, var(--em-accent-soft) 14%);
  --loc-ink: var(--em-ink);
  --loc-muted: color-mix(in srgb, var(--em-muted) 88%, transparent 12%);
  --loc-soft: color-mix(in srgb, var(--em-muted) 70%, transparent 30%);
  --loc-line: var(--em-border);
  --loc-accent: var(--em-accent);
  --loc-accent2: var(--em-accent2);
  --loc-on-accent: var(--em-on-accent);
}

html[data-dark="0"] .emLocationBlock {
  --loc-bg: color-mix(in srgb, var(--em-paper) 92%, var(--em-bg2) 8%);
  --loc-bg-2: color-mix(in srgb, var(--em-paper) 82%, #ffffff 18%);
  --loc-ink: var(--em-ink);
  --loc-muted: var(--em-muted);
  --loc-soft: color-mix(in srgb, var(--em-muted) 82%, transparent 18%);
}

.emLocationBlock .iviLoc {
  width: 100% !important;
  max-width: var(--em-max) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  color: var(--loc-ink) !important;
  text-align: left !important;
}

.emLocationBlock .iviLocHead,
.emLocationBlock .iviLocKicker,
.emLocationBlock .iviLocTitle {
  display: none !important;
}

.emLocationBlock .iviLocGrid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

.emLocationBlock .locSingle .iviLocGrid {
  grid-template-columns: 1fr !important;
}

.emLocationBlock .locSingle .iviLocCard {
  max-width: 720px !important;
  margin: 0 auto !important;
}

.emLocationBlock .iviLocCard {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 32px !important;
  border: 1px solid var(--loc-line) !important;
  background:
    radial-gradient(300px 260px at 100% 0%, rgba(var(--em-accent-rgb), .105), transparent 70%),
    linear-gradient(180deg, var(--loc-bg-2), var(--loc-bg)) !important;
  box-shadow: var(--em-shadow-card) !important;
  color: var(--loc-ink) !important;
}

.emLocationBlock .iviLocPhoto {
  position: relative !important;
  overflow: hidden !important;
  background: color-mix(in srgb, var(--em-bg2) 72%, black 28%) !important;
}

.emLocationBlock .iviLocPhoto::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(180deg, transparent 48%, rgba(0, 0, 0, .20)) !important;
  pointer-events: none !important;
}

.emLocationBlock .iviLocPhoto img {
  width: 100% !important;
  height: 304px !important;
  object-fit: cover !important;
  display: block !important;
  filter: saturate(1.02) contrast(1.015) !important;
}

.emLocationBlock .iviLocBody {
  position: relative !important;
  padding: 26px 24px 24px !important;
  color: var(--loc-ink) !important;
}

.emLocationBlock .iviLocBadge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: 7px 11px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(var(--em-accent-rgb), .16) !important;
  background: rgba(var(--em-accent-rgb), .105) !important;
  color: var(--loc-accent2) !important;
  font-family: var(--em-font-sans) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

html[data-dark="0"] .emLocationBlock .iviLocBadge {
  color: var(--loc-accent);
}

.emLocationBlock .iviLocName {
  margin: 18px 0 10px !important;
  color: var(--loc-ink) !important;
  font-family: var(--em-font-serif) !important;
  font-size: clamp(36px, 4vw, 52px) !important;
  line-height: .92 !important;
  font-weight: 500 !important;
  letter-spacing: -.035em !important;
}

.emLocationBlock .iviLocAddr,
.emLocationBlock .iviLocNote,
.emLocationBlock .iviLocText,
.emLocationBlock .iviLocMeta,
.emLocationBlock .iviLocBody p {
  color: var(--loc-muted) !important;
  font-family: var(--em-font-sans) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  opacity: 1 !important;
}

.emLocationBlock .iviLocNote {
  margin-top: 10px !important;
  color: var(--loc-soft) !important;
}

.emLocationBlock .iviLocActions {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin-top: 20px !important;
}

.emLocationBlock .iviLocActions a,
.emLocationBlock .iviLocActions .btn,
.emLocationBlock .iviLocActions .iviBtn {
  width: 100% !important;
  min-height: 52px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-family: var(--em-font-sans) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: transform .15s ease, filter .15s ease, background .15s ease, border-color .15s ease !important;
}

.emLocationBlock .iviLocActions a:first-child,
.emLocationBlock .iviLocActions .btn:first-child,
.emLocationBlock .iviLocActions .iviBtn:first-child {
  background: var(--loc-accent) !important;
  border: 1px solid var(--loc-accent) !important;
  color: var(--loc-on-accent) !important;
  box-shadow: 0 16px 34px rgba(var(--em-accent-rgb), .18) !important;
}

.emLocationBlock .iviLocActions a:nth-child(2),
.emLocationBlock .iviLocActions .btn:nth-child(2),
.emLocationBlock .iviLocActions .iviBtn:nth-child(2) {
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid var(--loc-line) !important;
  color: var(--loc-muted) !important;
}

html[data-dark="0"] .emLocationBlock .iviLocActions a:nth-child(2),
html[data-dark="0"] .emLocationBlock .iviLocActions .btn:nth-child(2),
html[data-dark="0"] .emLocationBlock .iviLocActions .iviBtn:nth-child(2) {
  background: rgba(255, 255, 255, .72) !important;
}

.emLocationBlock .iviLocActions a:hover,
.emLocationBlock .iviLocActions .btn:hover,
.emLocationBlock .iviLocActions .iviBtn:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.03) !important;
}

.emLocationBlock .iviLocName:empty,
.emLocationBlock .iviLocAddr:empty,
.emLocationBlock .iviLocNote:empty {
  display: none !important;
}

/* =========================================================
   DRESSCODE
========================================================= */

.emDressBlock .iviDress {
  width: min(940px, 100%);
  margin: 0 auto;
}

.emDressBlock .iviDressWrap {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.emDressBlock .iviDressKicker,
.emDressBlock .iviDressTitle,
.emDressBlock .iviDressText {
  display: none !important;
}

.emDressBlock .iviDressSwatches {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 14px;
  margin: 0 auto;
}

.emDressBlock .iviDressDot {
  width: clamp(62px, 9vw, 92px);
  height: clamp(62px, 9vw, 92px);
  border-radius: 50%;
  background: var(--c);
  border: 1px solid rgba(255, 255, 255, .18);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, .18),
    inset 0 0 0 1px rgba(255, 255, 255, .10);
}

html[data-dark="0"] .emDressBlock .iviDressDot {
  border-color: rgba(0, 0, 0, .10);
  box-shadow:
    0 18px 40px rgba(38, 50, 45, .10),
    inset 0 0 0 1px rgba(255, 255, 255, .48);
}

/* =========================================================
   GALLERY
========================================================= */

.emGalleryGrid {
  width: min(1220px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
}

.emGalleryItem {
  min-height: 350px;
  grid-column: span 4;
  overflow: hidden;
  background: var(--em-surface);
  color: inherit;
  text-decoration: none;
  border: 1px solid var(--em-border-soft);
}

.emGalleryItem:nth-child(5n + 1) {
  grid-column: span 5;
}

.emGalleryItem:nth-child(5n + 2) {
  grid-column: span 3;
}

.emGalleryItem img {
  width: 100%;
  height: 100%;
  min-height: 350px;
  object-fit: cover;
  transition: transform .35s ease, filter .35s ease;
}

.emGalleryItem:hover img {
  transform: scale(1.035);
  filter: saturate(1.05);
}

/* =========================================================
   NOTES
========================================================= */

.emNotesGrid {
  width: min(940px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 16px;
}

.emNotesGrid article {
  padding: 28px 0;
  border-top: 1px solid var(--em-border-soft);
  text-align: left;
}

.emNotesGrid article:last-child {
  border-bottom: 1px solid var(--em-border-soft);
}

.emNotesGrid h3 {
  margin-bottom: 10px;
}

.emNotesGrid h3 .bi {
  font-size: .72em;
  color: var(--em-accent);
}

/* =========================================================
   RSVP
========================================================= */

.emRsvp {
  overflow: hidden;
}

.emRsvp .emHead {
  position: relative;
  z-index: 2;
}

.emDeadline b {
  color: var(--em-accent2);
}

html[data-dark="0"] .emDeadline b {
  color: var(--em-accent);
}

.emRsvpBlock {
  --rsvp-bg: color-mix(in srgb, var(--em-paper) 72%, rgba(255, 255, 255, .045) 28%);
  --rsvp-bg-2: color-mix(in srgb, var(--em-paper) 86%, var(--em-accent-soft) 14%);
  --rsvp-ink: var(--em-ink);
  --rsvp-muted: color-mix(in srgb, var(--em-muted) 88%, transparent 12%);
  --rsvp-soft: color-mix(in srgb, var(--em-muted) 70%, transparent 30%);
  --rsvp-line: var(--em-border);
  --rsvp-input-bg: var(--em-field-bg);
  --rsvp-input-focus: #ffffff;
  --rsvp-input-ink: var(--em-field-ink);
  --rsvp-chip-bg: var(--em-chip-bg);
  --rsvp-chip-bg-hover: var(--em-chip-bg-hover);
  --rsvp-chip-ink: var(--em-chip-ink);
  --rsvp-accent: var(--em-accent);
  --rsvp-accent-hover: var(--em-accent-hover);
  --rsvp-on-accent: var(--em-on-accent);

  position: relative;
  width: min(980px, 100%);
  margin: 0 auto;
}

html[data-dark="0"] .emRsvpBlock {
  --rsvp-bg: color-mix(in srgb, var(--em-paper) 92%, var(--em-bg2) 8%);
  --rsvp-bg-2: color-mix(in srgb, var(--em-paper) 82%, #ffffff 18%);
  --rsvp-ink: var(--em-ink);
  --rsvp-muted: var(--em-muted);
  --rsvp-soft: color-mix(in srgb, var(--em-muted) 82%, transparent 18%);
}

.emRsvpBlock .rsvpSection {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  color: var(--rsvp-ink) !important;
}

.emRsvpBlock .rsvpSection > h2,
.emRsvpBlock .rose-line-svg {
  display: none !important;
}

.emRsvpBlock .rsvpGrid {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  display: block !important;
}

.emRsvpBlock .rsvpFormCard {
  position: relative;
  overflow: hidden;
  padding: clamp(26px, 4vw, 50px) !important;
  border-radius: 34px !important;
  border: 1px solid var(--rsvp-line) !important;
  background:
    radial-gradient(320px 280px at 98% 0%, rgba(var(--em-accent-rgb), .105), transparent 70%),
    linear-gradient(180deg, var(--rsvp-bg-2), var(--rsvp-bg)) !important;
  box-shadow: var(--em-shadow-card) !important;
  color: var(--rsvp-ink) !important;
  text-align: left !important;
}

.emRsvpBlock .rsvpFormCard::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 26px;
  border: 1px solid color-mix(in srgb, var(--rsvp-line) 42%, transparent 58%);
  pointer-events: none;
}

.emRsvpBlock .rsvpFormCard::after {
  content: "";
  position: absolute;
  right: -100px;
  top: -100px;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: rgba(var(--em-accent-rgb), .07);
  pointer-events: none;
}

.emRsvpBlock .rsvpHint {
  position: relative;
  z-index: 1;
  margin: 0 0 28px !important;
  color: var(--rsvp-muted) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

.emRsvpBlock #rsvpForm {
  position: relative;
  z-index: 1;
  display: grid !important;
  gap: 24px !important;
}

.emRsvpBlock #rsvpForm > * {
  margin: 0 !important;
}

.emRsvpBlock .row2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
}

.emRsvpBlock .formRow {
  margin: 0 !important;
}

.emRsvpBlock .label,
.emRsvpBlock label.label {
  display: block !important;
  margin: 0 0 9px !important;
  color: var(--rsvp-ink) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  opacity: .88 !important;
}

.emRsvpBlock .field,
.emRsvpBlock input[type="text"],
.emRsvpBlock input[type="tel"],
.emRsvpBlock input[type="email"],
.emRsvpBlock input[type="number"],
.emRsvpBlock textarea,
.emRsvpBlock select {
  width: 100% !important;
  min-height: 58px !important;
  padding: 16px 17px !important;
  border-radius: 18px !important;
  border: 1px solid color-mix(in srgb, var(--rsvp-line) 62%, rgba(0, 0, 0, .10) 38%) !important;
  background: var(--rsvp-input-bg) !important;
  color: var(--rsvp-input-ink) !important;
  font-family: var(--em-font-sans) !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
  outline: none !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .035) !important;
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    transform .18s ease !important;
}

.emRsvpBlock textarea {
  min-height: 132px !important;
  resize: vertical !important;
}

.emRsvpBlock .field::placeholder,
.emRsvpBlock input::placeholder,
.emRsvpBlock textarea::placeholder {
  color: rgba(32, 32, 32, .46) !important;
}

.emRsvpBlock .field:focus,
.emRsvpBlock input:focus,
.emRsvpBlock textarea:focus,
.emRsvpBlock select:focus {
  border-color: var(--rsvp-accent) !important;
  background: var(--rsvp-input-focus) !important;
  box-shadow:
    0 0 0 4px rgba(var(--em-accent-rgb), .15),
    0 12px 30px rgba(0, 0, 0, .045) !important;
}

.emRsvpBlock .chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

.emRsvpBlock .chip,
.emRsvpBlock .rsvpChip {
  min-height: 44px !important;
  padding: 11px 18px !important;
  border-radius: 999px !important;
  border: 1px solid var(--rsvp-line) !important;
  background: var(--rsvp-chip-bg) !important;
  color: var(--rsvp-chip-ink) !important;
  font-family: var(--em-font-sans) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  cursor: pointer !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease,
    color .15s ease,
    box-shadow .15s ease !important;
}

.emRsvpBlock .chip:hover,
.emRsvpBlock .rsvpChip:hover {
  transform: translateY(-1px) !important;
  border-color: var(--rsvp-accent) !important;
  background: var(--rsvp-chip-bg-hover) !important;
}

.emRsvpBlock .chip[data-active="true"],
.emRsvpBlock .chip.is-active,
.emRsvpBlock .rsvpChip[data-active="true"],
.emRsvpBlock .rsvpChip.is-active {
  background: var(--rsvp-accent) !important;
  border-color: var(--rsvp-accent) !important;
  color: var(--rsvp-on-accent) !important;
  box-shadow: 0 12px 28px rgba(var(--em-accent-rgb), .22) !important;
}

.emRsvpBlock .rsvpTotal {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  min-height: 40px !important;
  padding: 9px 14px !important;
  border-radius: 999px !important;
  background: rgba(var(--em-accent-rgb), .11) !important;
  color: var(--rsvp-muted) !important;
  border: 1px solid rgba(var(--em-accent-rgb), .11) !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

.emRsvpBlock .rsvpTotal b {
  margin-left: 4px !important;
  color: var(--rsvp-accent) !important;
}

.emRsvpBlock .consent {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 !important;
  color: var(--rsvp-muted) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

.emRsvpBlock .consent input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  margin: 2px 0 0 !important;
  accent-color: var(--rsvp-accent) !important;
  flex: 0 0 auto !important;
}

.emRsvpBlock .consent span {
  display: block !important;
}

.emRsvpBlock .consent small {
  display: inline-block !important;
  margin-top: 5px !important;
  color: var(--rsvp-soft) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  opacity: 1 !important;
}

.emRsvpBlock .consent a {
  color: var(--rsvp-accent) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  font-weight: 800 !important;
}

.emRsvpBlock button[type="submit"],
.emRsvpBlock .btn[type="submit"],
.emRsvpBlock .btn-full {
  width: 100% !important;
  min-height: 58px !important;
  margin-top: 2px !important;
  padding: 0 26px !important;
  border-radius: 999px !important;
  border: 1px solid var(--rsvp-accent) !important;
  background: var(--rsvp-accent) !important;
  color: var(--rsvp-on-accent) !important;
  font-family: var(--em-font-sans) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  box-shadow: 0 18px 42px rgba(var(--em-accent-rgb), .22) !important;
}

.emRsvpBlock button[type="submit"]:hover,
.emRsvpBlock .btn[type="submit"]:hover,
.emRsvpBlock .btn-full:hover {
  background: var(--rsvp-accent-hover) !important;
  border-color: var(--rsvp-accent-hover) !important;
  transform: translateY(-1px) !important;
}

.emRsvpBlock .statusBox {
  position: relative;
  z-index: 1;
  margin: 0 0 18px !important;
  padding: 14px 16px !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

.emRsvpBlock .previewLockNote {
  position: relative;
  z-index: 1;
  margin: 0 0 22px !important;
  border-radius: 22px !important;
  border: 1px solid var(--rsvp-line) !important;
  background: color-mix(in srgb, var(--em-accent-soft) 46%, var(--rsvp-bg) 54%) !important;
  box-shadow: none !important;
}

.emRsvpBlock .previewLockTitle {
  color: var(--rsvp-ink) !important;
}

.emRsvpBlock .previewLockText {
  color: var(--rsvp-muted) !important;
}

/* =========================================================
   MUSIC
========================================================= */

.emBody .iviMusic .iviMusicBtn {
  background: var(--em-surface) !important;
  border-color: var(--em-border) !important;
  color: var(--em-ink) !important;
  box-shadow: var(--em-shadow-soft) !important;
}

.emBody .iviMusic .iviMusicLabel,
.emBody .iviMusic .iviMusicIcon {
  color: var(--em-ink) !important;
}

.emBody .iviMusic .iviMusicIconWrap {
  background: var(--em-accent-soft) !important;
}

.emBody .iviMusic .iviMusicClose {
  background: rgba(255, 255, 255, .10) !important;
  color: var(--em-muted) !important;
  border-color: var(--em-border-soft) !important;
}

/* =========================================================
   FOOTER
========================================================= */

.emFooter {
  padding: 36px 20px 52px;
}

.emFooterInner {
  width: min(var(--em-max), 100%);
  margin: 0 auto;
  padding-top: 30px;
  border-top: 1px solid var(--em-border-soft);
  text-align: center;
}

.emFooterTitle {
  margin-bottom: 8px;
  color: var(--em-ink);
  font-family: var(--em-font-serif);
  font-size: clamp(34px, 5vw, 60px);
  line-height: 1;
}

.emFooter p {
  color: var(--em-muted);
}

.emFooter b {
  color: var(--em-accent2);
}

html[data-dark="0"] .emFooter b {
  color: var(--em-accent);
}

/* =========================================================
   STICKY RSVP
========================================================= */

.emStickyRsvp {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 1600;
  display: none;
  max-width: 620px;
  margin: 0 auto;
  transition: transform .22s ease, opacity .22s ease;
}

.emStickyRsvp .emBtn {
  width: 100%;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22);
}

.emStickyRsvp.is-hidden {
  transform: translateY(140%);
  opacity: 0;
  pointer-events: none;
}

/* =========================================================
   PLACEHOLDER
========================================================= */

.emPhotoPlaceholder {
  width: 100%;
  min-height: 280px;
  display: grid;
  place-items: center;
  text-align: center;
  background: color-mix(in srgb, var(--em-paper) 82%, var(--em-accent-soft) 18%);
  border: 1px dashed var(--em-border);
  color: var(--em-muted);
}

.emPhotoPlaceholderMark {
  width: 52px;
  height: 52px;
  margin: 0 auto 12px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--em-border);
  color: var(--em-accent2);
  font-size: 28px;
}

html[data-dark="0"] .emPhotoPlaceholderMark {
  color: var(--em-accent);
}

.emPhotoPlaceholderText {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (min-width: 1024px) {
  .emHero {
    min-height: clamp(760px, 122vh, 1120px);
  }

  .emHeroImg {
    object-position: var(--hero-pos-lg, var(--hero-pos, 50% 35%));
  }
}

@media (min-width: 1440px) {
  .emHeroImg {
    object-position: var(--hero-pos-xl, var(--hero-pos-lg, var(--hero-pos, 50% 35%)));
  }
}

@media (max-width: 980px) {
  .emStoryGrid {
    grid-template-columns: 1fr;
  }

  .emStoryImage,
  .emStoryImage img {
    min-height: 420px;
  }

  .emLocationBlock .iviLocGrid {
    grid-template-columns: 1fr !important;
  }

  .emGalleryItem,
  .emGalleryItem:nth-child(n) {
    grid-column: span 6;
  }
}

@media (max-width: 760px) {
  .emStickyRsvp {
    display: block;
  }

  .emFooter {
    padding-bottom: 116px;
  }

  .emTimer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 26px;
  }

  .emTimer div {
    min-height: 124px;
    padding: 22px 12px;
  }

  .emTimer div:nth-child(2) {
    border-right: 0;
  }

  .emTimer div:nth-child(1),
  .emTimer div:nth-child(2) {
    border-bottom: 1px solid var(--timer-line);
  }

  .emTimer b {
    font-size: clamp(48px, 15vw, 70px);
  }

  .emProgramRoad {
    width: min(620px, 100%);
    padding-left: 10px;
  }

  .emProgramLine {
    left: 30px;
    top: 18px;
    bottom: 18px;
  }

  .emProgramLine::before {
    inset: 8px -3px;
  }

  .emProgramLine::after {
    inset: 8% -14px;
    filter: blur(8px);
  }

  .emProgramStop {
    min-height: 0;
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 0;
    align-items: start;
    margin: 0 0 20px;
  }

  .emProgramStop:last-child {
    margin-bottom: 0;
  }

  .emProgramPin {
    grid-column: 1 !important;
    justify-self: start;
    width: 52px;
    height: 52px;
    transform: none !important;
    box-shadow:
      0 12px 26px rgba(0, 0, 0, .12),
      0 0 0 5px color-mix(in srgb, var(--em-bg) 62%, transparent 38%);
  }

  .emProgramPin .bi {
    font-size: 20px;
  }

  .emProgramStop:nth-of-type(even) .emProgramCard,
  .emProgramStop:nth-of-type(odd) .emProgramCard {
    grid-column: 2;
    text-align: left;
    justify-self: stretch;
    width: 100%;
  }

  .emProgramCard {
    padding: 22px 20px;
    border-radius: 24px;
  }

  .emProgramCard::before {
    top: 28px;
    left: -20px !important;
    right: auto !important;
    width: 20px;
    transform: none !important;
  }

  .emProgramCard time {
    font-size: 42px;
  }

  .emRsvpBlock .rsvpFormCard {
    padding: 22px 16px !important;
    border-radius: 26px !important;
  }

  .emRsvpBlock .rsvpFormCard::before {
    display: none;
  }

  .emRsvpBlock #rsvpForm {
    gap: 18px !important;
  }

  .emRsvpBlock .row2 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .emRsvpBlock .chips {
    gap: 8px !important;
  }

  .emRsvpBlock .chip,
  .emRsvpBlock .rsvpChip {
    min-height: 42px !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
  }
}

@media (max-width: 640px) {
  :root {
    --em-section-y: 64px;
  }

  .emSection {
    padding-left: 16px;
    padding-right: 16px;
  }

  .emSection::before {
    inset: 12px 8px;
    border-radius: 28px;
  }

  .emHero {
    padding: 70px 14px;
  }

  .emHeroTitle {
    font-size: clamp(58px, 18vw, 92px);
  }

  .emHeroDate {
    font-size: 34px;
  }

  .emHeroActions {
    flex-direction: column;
    align-items: stretch;
  }

  .emStoryImage,
  .emStoryImage img {
    min-height: 320px;
  }

  .emGalleryItem,
  .emGalleryItem:nth-child(n) {
    grid-column: span 12;
    min-height: 260px;
  }

  .emGalleryItem img {
    min-height: 260px;
  }

  .emLocationBlock .iviLocCard {
    border-radius: 24px !important;
  }

  .emLocationBlock .iviLocPhoto img {
    height: 240px !important;
  }

  .emLocationBlock .iviLocBody {
    padding: 20px 18px !important;
  }

  .emLocationBlock .iviLocName {
    font-size: 34px !important;
  }

  .emLocationBlock .iviLocActions a,
  .emLocationBlock .iviLocActions .btn,
  .emLocationBlock .iviLocActions .iviBtn {
    min-height: 48px !important;
  }
}

@media (max-width: 420px) {
  .emTimer div {
    min-height: 112px;
    padding: 18px 10px;
  }

  .emTimer b {
    font-size: 48px;
  }
}

/* =========================================================
   EMERALD MODERN DARK: RSVP + CONTACTS
   Только тёмные темы.
========================================================= */

/* RSVP */
html[data-dark="1"] #rsvpWrap .block-card,
html[data-dark="1"] #rsvpWrap .card,
html[data-dark="1"] #rsvpWrap .panel{
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.075),
      rgba(255,255,255,.045)
    ) !important;
  border:1px solid rgba(255,255,255,.11) !important;
  color:rgba(255,255,255,.94) !important;
  box-shadow:
    0 30px 90px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html[data-dark="1"] #rsvpWrap :where(#rsvp,#rsvpInner,.rsvpSection,.rsvp,[data-block="rsvp"]){
  --rsvp-paper:rgba(8,18,17,.78) !important;
  --rsvp-line:rgba(255,255,255,.16) !important;
  --rsvp-ink:rgba(255,255,255,.94) !important;
  --rsvp-muted:rgba(255,255,255,.66) !important;
  background:transparent !important;
  color:var(--rsvp-ink) !important;
}

html[data-dark="1"] #rsvpWrap :where(h2,h3,.section-title,.rsvpTitle){
  color:rgba(255,255,255,.96) !important;
}

html[data-dark="1"] #rsvpWrap :where(p,.section-subtitle,.rsvpHint,label,.label,legend){
  color:rgba(255,255,255,.68) !important;
}

html[data-dark="1"] #rsvpWrap :where(input[type="text"],input[type="tel"],textarea,select,.field){
  color:rgba(255,255,255,.94) !important;
  background:rgba(7,16,15,.84) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 14px 34px rgba(0,0,0,.20) !important;
}

html[data-dark="1"] #rsvpWrap :where(input,textarea)::placeholder{
  color:rgba(255,255,255,.40) !important;
}

html[data-dark="1"] #rsvpWrap .chip{
  color:rgba(255,255,255,.86) !important;
  background:rgba(7,16,15,.70) !important;
  border-color:rgba(255,255,255,.17) !important;
  box-shadow:none !important;
}

html[data-dark="1"] #rsvpWrap .chip[data-active="true"],
html[data-dark="1"] #rsvpWrap .chip.is-active,
html[data-dark="1"] #rsvpWrap .chip[aria-pressed="true"]{
  color:#fff !important;
  background:linear-gradient(135deg,var(--em-accent),var(--em-accent2)) !important;
  border-color:transparent !important;
  box-shadow:0 16px 36px rgba(0,0,0,.24) !important;
}

html[data-dark="1"] #rsvpWrap .consent{
  background:rgba(7,16,15,.76) !important;
  border-color:rgba(255,255,255,.13) !important;
}

html[data-dark="1"] #rsvpWrap .consent,
html[data-dark="1"] #rsvpWrap .consent :where(span,label,a){
  color:rgba(255,255,255,.62) !important;
}

html[data-dark="1"] #rsvpWrap :where(button[type="submit"],input[type="submit"]){
  color:#fff !important;
  background:linear-gradient(135deg,var(--em-accent),var(--em-accent2)) !important;
  border-color:transparent !important;
  box-shadow:0 18px 42px rgba(0,0,0,.26) !important;
}

/* CONTACTS */
html[data-dark="1"] .ivi-contacts{
  --ivi-contacts-bg:transparent !important;
  --ivi-contacts-card:
    linear-gradient(
      180deg,
      rgba(255,255,255,.075),
      rgba(255,255,255,.045)
    ) !important;
  --ivi-contacts-text:rgba(255,255,255,.96) !important;
  --ivi-contacts-muted:rgba(255,255,255,.66) !important;
  --ivi-contacts-accent:var(--em-accent) !important;
  --ivi-contacts-line:rgba(255,255,255,.13) !important;

  background:transparent !important;
  color:rgba(255,255,255,.96) !important;
  border:0 !important;
  box-shadow:none !important;
}

html[data-dark="1"] .ivi-contacts__kicker{
  color:var(--em-accent2) !important;
}

html[data-dark="1"] .ivi-contacts__title,
html[data-dark="1"] .ivi-contact__name,
html[data-dark="1"] .ivi-contact__phone{
  color:rgba(255,255,255,.96) !important;
}

html[data-dark="1"] .ivi-contacts__text,
html[data-dark="1"] .ivi-contact__role{
  color:rgba(255,255,255,.66) !important;
}

html[data-dark="1"] .ivi-contact{
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.08),
      rgba(255,255,255,.05)
    ) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:
    0 28px 76px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;
}

html[data-dark="1"] .ivi-contact__avatar{
  color:var(--em-accent2) !important;
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.14) !important;
}

html[data-dark="1"] .ivi-contact__action{
  color:rgba(255,255,255,.90) !important;
  background:rgba(7,16,15,.72) !important;
  border-color:rgba(255,255,255,.14) !important;
}

html[data-dark="1"] .ivi-contact__action:hover{
  color:#fff !important;
  background:linear-gradient(135deg,var(--em-accent),var(--em-accent2)) !important;
  border-color:transparent !important;
}

@media (max-width:640px){
  html[data-dark="1"] .ivi-contact,
  html[data-dark="1"] #rsvpWrap .block-card{
    border-radius:22px !important;
  }
}
