/* Shared design of every site skin (assets/site-skins/<id>/). Loaded only for a page whose theme has a skin, and scoped to .esite-skin,
   so designs without one never see it. Ceremono Classic is underneath: its layouts still work, so don't force display, columns or order
   here without a layout class in the selector.
   Art slots, all optional: --sk-cluster-a (top right spray), --sk-cluster-b (bottom left spray), --sk-ornament (above headings),
   --sk-wreath (gifts), --sk-frame-a-wide, --sk-frame-b-wide (hero outline), --sk-frame-a (around a photo).
   Colors from the colorway: --sk-deep, --sk-deep-ink. A skin tunes the --sk-* values below in its skin.css.
   A section's own Design settings always win: paint a section with --sk-sec-bg first (--sk-sec-ink for its text), and never put
   !important on spacing without handling .ss-pad-c and .ss-pad-s. Alignment comes from .ss-al-c, not from here. */
.esite-skin {
  --sk-line: color-mix(in srgb, var(--s-accent) 40%, transparent);
  --sk-measure: 1080px; --sk-radius: 0px; --sk-gap: 112px;
  --sk-accent-font: var(--s-fhead); --sk-accent-style: italic;
  --sk-photo-shape: none; --sk-photo-ratio: 4 / 5;
  --sk-deep: var(--s-text); --sk-deep-ink: var(--s-bg);
  --sk-cluster-size: clamp(320px, 43vw, 700px);
  --sk-paper: var(--s-bg); --sk-ink: var(--s-text);
  background: var(--s-bg); color: var(--s-text); font-family: var(--s-fbody);
}
.esite-skin .ss-h, .esite-skin .cl-names, .esite-skin .cd-n, .esite-skin .ss-loc-venue { font-weight: 400; letter-spacing: -.012em; }
.esite-skin .cl-btn, .esite-skin .ss-btn { border-color: var(--s-text); border-radius: var(--sk-radius); background: var(--s-text); color: var(--s-bg); }
.esite-skin .cl-btn.ghost { background: transparent; color: var(--s-text); }

/* ---- Top bar: stays with the guest down the page ---- */
.esite-skin .cl-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 40; gap: 28px; height: 68px; padding: 0 max(24px, calc((100% - 1200px) / 2)); background: color-mix(in srgb, var(--s-bg) 90%, transparent); border-bottom: 1px solid var(--sk-line); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.esite-skin:has(.esite-preview-bar) .cl-nav { top: 38px; }
.esite-skin .cl-brand { margin-right: auto; font-family: var(--s-fhead); font-size: 1.1875rem; font-weight: 400; letter-spacing: 0; color: var(--s-text) !important; }
.esite-skin .cl-links { gap: 28px; }
.esite-skin .cl-links a { color: var(--s-text); opacity: .78; font-size: .875rem; }
.esite-skin .cl-nav .ss-btn, .esite-skin .cl-nav .cl-btn { padding: 8px 18px; font-size: .8125rem; }

/* ---- Hero: the invitation, lying on its side across the screen ---- */
.esite-skin .ss-scope[data-type="hero"] { max-width: none; padding: 0; }
.esite-skin .ss-hero.hs-classic { padding: 0; background: var(--s-bg); }
.esite-skin .cl-panel { position: relative; isolation: isolate; overflow: hidden; gap: clamp(32px, 6vw, 96px); align-items: center; justify-items: center; min-height: 100svh; padding: 112px clamp(24px, 9vw, 150px) 72px; border-radius: 0; background: var(--s-bg); color: var(--s-text); }
.esite-skin .cl-panel::before {
  content: ""; position: absolute; inset: 68px 0 0; z-index: -1; pointer-events: none;
  background: var(--sk-frame-a-wide, none) 50% 50% / min(1300px, 92vw, 168svh) auto no-repeat, var(--sk-frame-b-wide, none) 50% 50% / min(1230px, 87vw, 159svh) auto no-repeat;
}
.esite-skin .cl-panel::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: var(--sk-cluster-a, none) calc(100% + 6vw) -2vw / var(--sk-cluster-size) auto no-repeat, var(--sk-cluster-b, none) -5vw calc(100% + 7vw) / var(--sk-cluster-size) auto no-repeat;
}
.esite-skin .cl-text { position: relative; z-index: 3; text-align: center; }
.esite-skin .cl-panel .h-kicker { margin: 0 0 14px; color: var(--s-accent); opacity: 1; font-family: var(--sk-accent-font); font-size: clamp(1.25rem, 2vw, 1.625rem); font-style: var(--sk-accent-style); letter-spacing: 0; line-height: 1.3; text-transform: none; }
/* the names step down across the sheet, as on the printed card */
.esite-skin .cl-names { display: grid; justify-content: center; font-size: calc(clamp(3.6rem, 8.6vw, 8rem) * var(--s-hscale, 1)); line-height: .98; }
.esite-skin .cl-names .cn-1 { justify-self: start; padding-right: .9em; }
.esite-skin .cl-names .cn-amp { justify-self: center; margin: -.12em 0 -.16em; color: var(--s-accent); font-family: var(--sk-accent-font); font-size: .52em; font-style: var(--sk-accent-style); line-height: 1; }
.esite-skin .cl-names .cn-2 { justify-self: end; padding-left: .9em; }
.esite-skin .cl-sub { max-width: none; margin: 24px auto 0; color: var(--s-accent); opacity: 1; font-size: .8125rem; letter-spacing: .14em; line-height: 1.6; text-transform: uppercase; }
.esite-skin .cl-facts { margin: 18px 0 26px; }
.esite-skin .cl-facts b { font-size: 1.125rem; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; }
.esite-skin .cl-facts span { display: block; margin-top: 6px; color: var(--s-accent); opacity: 1; font-size: .9375rem; text-wrap: balance; }
.esite-skin .cl-actions { justify-content: center; }
.esite-skin .cl-text .cl-btn { padding: 14px 40px; letter-spacing: .08em; text-transform: uppercase; font-size: .8125rem; }

/* A photo takes the frame's own shape, inside the sheet */
.esite-skin .hs-classic:not(.no-photo) .cl-panel::before { display: none; }
.esite-skin .hs-classic:not(.no-photo) .cl-names { font-size: calc(clamp(3rem, 5.4vw, 5.4rem) * var(--s-hscale, 1)); }
.esite-skin .cl-visual { z-index: 1; height: auto; min-height: 0; }
.esite-skin .hs-classic:not(.no-photo) .cl-visual { position: relative; height: min(72svh, 640px); aspect-ratio: var(--sk-photo-ratio); }
.esite-skin .cl-visual::after { content: ""; position: absolute; inset: -3.5%; pointer-events: none; background: var(--sk-frame-a, none) 50% 50% / 100% 100% no-repeat; }
.esite-skin .cl-photo { border-radius: 0; clip-path: var(--sk-photo-shape); }
.esite-skin .hv-center:not(.no-photo) .cl-visual { width: auto; height: min(46svh, 420px); justify-self: center; }
/* Photo behind: it fills the screen, the corners stay on top */
.esite-skin .hv-cover:not(.no-photo) .cl-panel { color: #fff; }
.esite-skin .hv-cover:not(.no-photo) .cl-visual { position: absolute; inset: 0; z-index: -1; width: auto; height: auto; aspect-ratio: auto; }
.esite-skin .hv-cover:not(.no-photo) .cl-visual::after { display: none; }
.esite-skin .hv-cover:not(.no-photo) .cl-photo { clip-path: none; }
.esite-skin .hv-cover:not(.no-photo) .cl-photo::after { background: rgba(0, 0, 0, .44); }
.esite-skin .hv-cover:not(.no-photo) .h-kicker, .esite-skin .hv-cover:not(.no-photo) .cl-sub, .esite-skin .hv-cover:not(.no-photo) .cl-facts span, .esite-skin .hv-cover:not(.no-photo) .cn-amp { color: #fff; }

/* ---- Sections: one measure, full-width color bands, generous air ---- */
.esite-skin .ss-scope:not([data-type="hero"]) { position: relative; isolation: isolate; overflow: clip; max-width: none; padding: 0 max(24px, calc((100% - var(--sk-measure)) / 2)); background-color: var(--sk-sec-bg, transparent); }
.esite-skin .ss-scope { --sk-on-deep: var(--sk-sec-ink, var(--sk-deep-ink)); }
.esite-skin .ss-scope.ss-hasbg { margin-top: 0; border-radius: 0; }
.esite-skin .ss { padding: var(--sk-gap) 0; }
.esite-skin .ss-scope:not([data-type="hero"]):not([data-type="countdown"]):not([data-type="none"]) .ss-h::before {
  content: "" !important; display: block !important; width: 160px; height: 42px; margin: 0 0 14px; opacity: 1;
  background: var(--sk-ornament, linear-gradient(var(--s-accent), var(--s-accent))) 50% 50% / contain no-repeat;
}
.esite-skin .ss-scope.ss-al-c:not([data-type="none"]) .ss-h::before, .esite-skin .ss-scope[data-type="rsvp"]:not([data-type="none"]) .ss-h::before { margin: 0 auto 14px !important; }
/* heading-beside layouts stay beside: Alignment then only centers nothing */
.esite-skin .ss-al-c .ss-schedule.schv-timeline .ss-wrap, .esite-skin .ss-al-c .ss-faq.faqv-side .ss-wrap, .esite-skin .ss-al-c .ss-gifts.gftv-side .ss-wrap { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); text-align: left; }
.esite-skin .ss-al-c .ss-gifts.gftv-side .ss-wrap > :not(.ss-h) { grid-column: 2; justify-self: start; }
.esite-skin .ss-al-c .ss-gifts.gftv-side .ss-p { text-align: left; margin-left: 0 !important; }
.esite-skin .ss-al-c .ss-faq.faqv-side .ss-faq-item { text-align: left; }
.esite-skin .ss-scope.ss-al-c:not([data-type="none"]) .schv-timeline .ss-h::before, .esite-skin .ss-scope.ss-al-c:not([data-type="none"]) .faqv-side .ss-h::before, .esite-skin .ss-scope.ss-al-c:not([data-type="none"]) .gftv-side .ss-h::before { margin: 0 0 14px !important; }
.esite-skin .ss-h { margin-bottom: 18px; font-size: calc(clamp(2.25rem, 4vw, 3.25rem) * var(--s-hscale, 1)); line-height: 1.12; }
.esite-skin .ss-p { opacity: .86; text-wrap: pretty; }
.esite-skin .ss-al-c .ss-p { margin-left: auto !important; margin-right: auto !important; }
.esite-skin .ss-scope[data-type="schedule"]::before, .esite-skin .ss-scope[data-type="story"]::before, .esite-skin .ss-scope[data-type="faq"]::before { content: ""; position: absolute; z-index: -1; width: clamp(180px, 24vw, 400px); aspect-ratio: 6 / 5; pointer-events: none; background-size: contain; background-repeat: no-repeat; }
.esite-skin .ss-scope[data-type="story"]::before, .esite-skin .ss-scope[data-type="faq"]::before { top: 0; right: -4vw; background-image: var(--sk-cluster-a, none); background-position: 100% 0; }
.esite-skin .ss-scope[data-type="schedule"]::before { bottom: -2vw; left: -4vw; background-image: var(--sk-cluster-b, none); background-position: 0 100%; }

/* Story: words as the centerpiece, a photo in the frame's shape */
.esite-skin .ss-al-c .ss-story-grid:not(.has-img) .ss-p { max-width: 32em; font-family: var(--sk-accent-font); font-size: calc(clamp(1.375rem, 2.2vw, 1.75rem) * var(--s-bscale, 1)); font-style: var(--sk-accent-style); line-height: 1.45; }
.esite-skin .stv-side .ss-story-grid.has-img, .esite-skin .stv-right .ss-story-grid.has-img { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.esite-skin .stv-side .ss-story-img, .esite-skin .stv-right .ss-story-img { justify-self: center; width: min(100%, 400px); }
/* the shape cuts the box, so a photo's own crop still works inside it */
.esite-skin .stv-side .ss-story-img, .esite-skin .stv-right .ss-story-img { overflow: hidden; clip-path: var(--sk-photo-shape); }
.esite-skin .stv-side .ss-story-img img, .esite-skin .stv-right .ss-story-img img { aspect-ratio: var(--sk-photo-ratio); border-radius: 0; }
.esite-skin .ss-story-img img { border-radius: var(--sk-radius); }
.esite-skin .stv-overlap .ss-story-grid.has-img .ss-story-text { border-radius: var(--sk-radius); background: var(--s-bg); }

/* Countdown: every layout carries the deep color, or the sheet of paper */
.esite-skin .ss-scope[data-type="countdown"]:has(.cdv-big), .esite-skin .ss-scope[data-type="countdown"]:has(.cdv-boxes) { background-color: var(--sk-sec-bg, var(--sk-deep)); color: var(--sk-on-deep); }
.esite-skin .ss-scope[data-type="countdown"]:has(.cdv-tiles) { background-color: var(--s-band); }
.esite-skin .ss-countdown .ss-h { opacity: 1; color: var(--s-accent); font-family: var(--sk-accent-font) !important; font-size: clamp(1.375rem, 2.2vw, 1.75rem); font-style: var(--sk-accent-style); letter-spacing: 0; }
.esite-skin .cdv-big .ss-h, .esite-skin .cdv-boxes .ss-h, .esite-skin .cdv-panel .ss-h { margin: 0; color: var(--sk-on-deep); }
.esite-skin .cdv-big .cd-n, .esite-skin .cdv-big .cd-l, .esite-skin .cdv-boxes .cd-n, .esite-skin .cdv-boxes .cd-l, .esite-skin .cdv-panel .cd-n, .esite-skin .cdv-panel .cd-l { color: var(--sk-on-deep); }
.esite-skin .cdv-big { padding: 52px 0 !important; }
.esite-skin .ss-pad-c .cdv-big, .esite-skin .ss-pad-c .cdv-tiles { padding: 28px 0 !important; }
.esite-skin .ss-pad-s .cdv-big, .esite-skin .ss-pad-s .cdv-tiles { padding: 96px 0 !important; }
.esite-skin .cdv-big .ss-h { margin-bottom: 18px; }
.esite-skin .ss-scope:not(.ss-al-c) .cdv-big { text-align: left; }
.esite-skin .cdv-big .ss-cd { justify-content: center; gap: 0; width: min(640px, 100%); margin: 0 auto; }
.esite-skin .ss-scope:not(.ss-al-c) .cdv-big .ss-cd { margin: 0; }
.esite-skin .cdv-big .cd-unit { flex: 1 1 0; }
.esite-skin .cdv-big .cd-unit + .cd-unit { border-left: 1px solid color-mix(in srgb, var(--sk-on-deep) 28%, transparent); border-radius: 0; }
.esite-skin .cdv-big .cd-n { font-size: clamp(2.6rem, 5.4vw, 4rem); }
.esite-skin .cdv-boxes { padding: 30px 0 !important; border: 0; }
.esite-skin .ss-pad-c .cdv-boxes { padding: 16px 0 !important; }
.esite-skin .ss-pad-s .cdv-boxes { padding: 64px 0 !important; }
.esite-skin .cdv-panel { margin: 56px 0; padding: 30px 48px !important; background: var(--sk-sec-bg, var(--sk-deep)); }
.esite-skin .cdv-tiles { padding: 56px 0 !important; }
.esite-skin .cdv-tiles .ss-h { margin-bottom: 8px; }
.esite-skin .cdv-tiles .cd-unit { background: var(--s-bg); outline: 1px solid var(--sk-line); outline-offset: -8px; }
.esite-skin .cd-n { font-weight: 400; }
.esite-skin .cd-l { font-size: .75rem; opacity: .75; }

/* The day: a tinted band, a line of moments */
.esite-skin .ss-scope[data-type="schedule"] { background-color: var(--s-band); }
.esite-skin .ss-scope .schv-cards .ss-timeline { position: relative; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 32px 20px; max-width: none; margin-top: 40px; }
.esite-skin .schv-cards .ss-timeline::before { content: ""; display: block; position: absolute; top: 5px; left: 0; right: 0; height: 1px; background: var(--sk-line); }
.esite-skin .schv-cards .ss-tl-item, .esite-skin .schv-cards .ss-tl-item:last-child { position: relative; padding: 30px 8px 0; border-radius: 0; background: none; text-align: center; }
.esite-skin .schv-cards .ss-tl-item::before { content: ""; display: block; position: absolute; top: 0; left: calc(50% - 5px); width: 11px; height: 11px; border-radius: 50%; background: var(--s-accent); box-shadow: 0 0 0 5px var(--s-band); }
.esite-skin .schv-cards .ss-tl-time { font-family: var(--sk-accent-font); font-size: 1.5rem; font-style: var(--sk-accent-style); }
.esite-skin .ss-tl-time { color: var(--s-accent); opacity: 1; }
.esite-skin .schv-wide .ss-timeline { max-width: 560px; margin: 24px auto 0; background: linear-gradient(var(--sk-line), var(--sk-line)) center / 1px 100% no-repeat; }
.esite-skin .schv-wide .ss-tl-item, .esite-skin .schv-wide .ss-tl-item:last-child { grid-template-columns: 1fr 1fr; gap: 0 56px; padding: 14px 0; border: 0; text-align: left; }
.esite-skin .schv-wide .ss-tl-time { text-align: right; }
.esite-skin .schv-timeline .ss-tl-time, .esite-skin .schv-rail .ss-tl-time { font-family: var(--sk-accent-font); font-size: 1.375rem; font-style: var(--sk-accent-style); }
.esite-skin .schv-rail .ss-timeline { max-width: 520px; margin: 28px auto 0; }
.esite-skin .schv-rail .ss-timeline::before { background: var(--sk-line); }

/* Location */
.esite-skin .ss-location .ss-wrap { border-radius: var(--sk-radius); background: none; padding: 0; }
.esite-skin .locv-panel .ss-wrap { padding: 56px 64px; background: var(--s-band); }
.esite-skin .ss-loc-venue { font-family: var(--sk-accent-font); font-size: 1.75rem; font-style: var(--sk-accent-style); }
.esite-skin .ss-map { border-radius: var(--sk-radius); box-shadow: none; outline: 1px solid var(--sk-line); outline-offset: 10px; overflow: hidden; }
.esite-skin .ss-map iframe { border-radius: 0; }
.esite-skin .ss-location .ss-dir { border-radius: var(--sk-radius) !important; background: transparent !important; color: var(--s-text) !important; }

/* Gifts: the words sit inside the wreath */
.esite-skin .gftv-panel .ss-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; width: min(720px, 100%); aspect-ratio: 1; margin: 0 auto; padding: 0 25%; border-radius: 0; background: var(--sk-wreath, none) 50% 50% / contain no-repeat; text-align: center; }
.esite-skin .gftv-panel .ss-h { margin-bottom: 10px; font-size: calc(clamp(2rem, 3.2vw, 2.75rem) * var(--s-hscale, 1)); }
.esite-skin .gftv-panel .ss-h::before { display: none !important; }
.esite-skin .gftv-panel .ss-p { margin-top: 0 !important; font-size: .9375rem; line-height: 1.55; text-align: center; }
.esite-skin .ss-scope[data-type="gifts"]:not(.ss-pad-c):not(.ss-pad-s) .ss { padding: calc(var(--sk-gap) * .6) 0; }

/* Questions */
.esite-skin .ss-scope[data-type="faq"] { background-color: var(--s-band); }
.esite-skin .ss-al-c .ss-faq-item { text-align: center; }
.esite-skin .faqv-wide .ss-faq-list { margin-top: 24px; }
.esite-skin .ss-faq-item, .esite-skin .ss-faq-item:last-child, .esite-skin .ss-tl-item { border-color: var(--sk-line); }
.esite-skin .ss-faq-q { font-family: var(--s-fhead); font-size: 1.25rem; font-weight: 400; }
.esite-skin .faqv-cards .ss-faq-item, .esite-skin .statv-panel .ss-wrap, .esite-skin .txtv-panel .ss-wrap, .esite-skin .ss-cta-inner, .esite-skin .cdv-panel, .esite-skin .cdv-tiles .cd-unit, .esite-skin .gftv-side .ss-wrap { border-radius: var(--sk-radius); }

/* RSVP: the page's closing moment, the form open on a sheet of paper */
.esite-skin .ss-scope[data-type="rsvp"]:has(.rsv-card) { background-color: var(--sk-sec-bg, var(--sk-deep)); color: var(--sk-on-deep); }
.esite-skin .ss-scope[data-type="rsvp"]:has(.rsv-tint) { background-color: var(--s-band); }
.esite-skin .ss-scope[data-type="rsvp"]:has(.rsv-tint) { color: var(--s-text); }
.esite-skin .ss-rsvp .ss-wrap { position: relative; border-radius: var(--sk-radius); background: none; color: inherit; padding: 0; }
.esite-skin .ss-rsvp .ss-h, .esite-skin .ss-rsvp .ss-p { color: inherit; }
.esite-skin .ss-scope[data-type="rsvp"]::before, .esite-skin .ss-scope[data-type="rsvp"]::after { content: ""; position: absolute; z-index: -1; width: clamp(200px, 30vw, 520px); aspect-ratio: 6 / 5; pointer-events: none; background-size: contain; background-repeat: no-repeat; }
.esite-skin .ss-scope[data-type="rsvp"]::before { top: -2vw; right: -5vw; background-image: var(--sk-cluster-a, none); background-position: 100% 0; }
.esite-skin .ss-scope[data-type="rsvp"]::after { bottom: -3vw; left: -5vw; background-image: var(--sk-cluster-b, none); background-position: 0 100%; }
.esite-skin .ss-rsvp-open { display: none !important; }
.esite-skin .ss-rsvp-form[hidden] { display: block; }
.esite-skin .ss-rsvp-form { max-width: 560px; margin: 8px auto 0; padding: 32px; border-radius: var(--sk-radius); --s-bg: var(--sk-paper); --s-text: var(--sk-ink); --s-soft: var(--sk-line); background: var(--sk-paper); color: var(--sk-ink); box-shadow: 0 24px 60px -30px rgba(0, 0, 0, .5); }
.esite-skin .rsvp-embed .pf-field { padding: 0 0 16px; margin: 0; border: 0; border-radius: 0; background: none; }
.esite-skin .rsvp-embed .form-label { font-weight: 500; }
.esite-skin .rsvp-embed .form-control { border-color: var(--sk-line); border-radius: var(--sk-radius); }
.esite-skin .ss-rsvp-form .btn-rsvp { border-radius: var(--sk-radius); border-color: var(--s-text); background: var(--s-text); color: var(--s-bg); letter-spacing: .08em; text-transform: uppercase; }

/* The last word */
.esite-skin .ss-closing { display: block; padding: 96px 24px 24px; background: var(--s-bg); text-align: center; }
.esite-skin .ss-closing .ss-flourish { display: none; }
.esite-skin .ss-closing::before { content: ""; display: block; width: 180px; height: 48px; margin: 0 auto 18px; background: var(--sk-ornament, none) 50% 50% / contain no-repeat; }
.esite-skin .ss-closing-names { font-family: var(--s-fhead); font-size: clamp(2.75rem, 6vw, 4.5rem); font-weight: 400; color: var(--s-text); }
.esite-skin .ss-closing-line { margin-top: 8px; color: var(--s-accent); font-family: var(--sk-accent-font); font-size: 1.375rem; font-style: var(--sk-accent-style); letter-spacing: 0; text-transform: none; }
.esite-skin .ss-brand { padding: 28px 16px; background: var(--s-bg); }

@media (max-width: 900px) {
  .esite-skin { --sk-gap: 80px; --sk-cluster-size: 300px; }
  .esite-skin .cl-links { display: none; }
  .esite-skin .cl-panel { padding: 112px 24px 150px; }
  .esite-skin .cl-panel::after { background-position: calc(100% + 60px) 40px, -56px calc(100% + 40px); }
  .esite-skin .hs-classic:not(.no-photo) .cl-visual { height: 340px; }
  .esite-skin .stv-side .ss-story-grid.has-img, .esite-skin .stv-right .ss-story-grid.has-img { grid-template-columns: minmax(0, 1fr); }
  .esite-skin .stv-side .ss-story-img, .esite-skin .stv-right .ss-story-img { width: min(100%, 300px); order: 0; }
  .esite-skin .locv-panel .ss-wrap { padding: 34px 22px; }
}
@media (max-width: 640px) {
  .esite-skin { --sk-gap: 68px; }
  .esite-skin .cl-names { font-size: calc(clamp(3rem, 14.6vw, 4rem) * var(--s-hscale, 1)); }
  .esite-skin .cl-names .cn-1 { padding-right: .55em; }
  .esite-skin .cl-names .cn-2 { padding-left: .55em; }
  .esite-skin .cl-sub { letter-spacing: .1em; }
  .esite-skin .ss-scope[data-type="schedule"]::before, .esite-skin .ss-scope[data-type="story"]::before, .esite-skin .ss-scope[data-type="faq"]::before { width: 130px; }
  .esite-skin .ss-scope .schv-cards .ss-timeline { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .esite-skin .schv-cards .ss-timeline::before { top: 0; bottom: 0; left: 50%; right: auto; width: 1px; height: auto; opacity: 0; }
  /* the wreath moves above the words: its center is too small for them on a phone */
  .esite-skin .hv-center:not(.no-photo) .cl-visual { width: auto; height: 300px; }
  .esite-skin .gftv-panel .ss-wrap { width: 100%; aspect-ratio: auto; padding: 200px 0 0; background-position: 50% 0; background-size: 190px auto; }
  .esite-skin .ss-scope[data-type="rsvp"]::before, .esite-skin .ss-scope[data-type="rsvp"]::after { width: 150px; }
  .esite-skin .ss-rsvp-form { padding: 24px 20px; }
}