/* Boho Sun: a desert evening. The sun rises behind the names, the file's pieces stand at the hero's sides and a horizon of bowls,
   leaves and the low disc runs along its foot. Down the page the moon goes through its phases: each section's heading carries the
   next phase, the countdown is the four phases from crescent to full. Names in spaced capitals, headings in the suite's script. */
.esite-skin-boho-sun {
  --sk-accent-font: "Corinthia", cursive;
  --sk-accent-style: normal;
  --sk-photo-shape: none;
  --sk-gap: 88px;
  --sk-measure: 880px;
}
.esite-skin-boho-sun .ss-h, .esite-skin-boho-sun .ss-closing-names { font-weight: 400; letter-spacing: 0; }
.esite-skin-boho-sun .ss-h { font-size: calc(clamp(3rem, 5vw, 4.4rem) * var(--s-hscale, 1)); line-height: 1.05; }
.esite-skin-boho-sun .cl-names { font-family: var(--s-fbody) !important; font-weight: 400; letter-spacing: .24em; text-transform: uppercase; }

/* ---- hero: the sun behind the names, a horizon at the foot ---- */
.esite-skin-boho-sun .hs-classic.no-photo .cl-panel {
  container-type: inline-size; grid-template-columns: minmax(0, 1fr); justify-items: center; min-height: calc(100svh - 38px); padding: calc(84px + min(1cqw, 12px) * 16) 24px calc(min(1cqw, 12px) * 19);
  overflow: hidden; background: var(--s-bg);
}
/* the pieces keep their own sizes (--u: one hundredth of the card, capped so a very wide screen doesn't blow them up) and their own rows,
   so nothing lands on anything else; the horizon is the full panel, its pieces stand on the foot and are never cut */
.esite-skin-boho-sun .hs-classic.no-photo .cl-panel { --u: min(1cqw, 12px); }
.esite-skin-boho-sun .hs-classic.no-photo .cl-panel::before {
  display: block; inset: 0; z-index: 0;
  background:
    var(--sk-sun, none) 50% 70px / calc(var(--u) * 24) auto no-repeat,
    var(--sk-dots-tl, none) left 0 top 96px / calc(var(--u) * 8) auto no-repeat,
    var(--sk-stones, none) left 0 top calc(110px + var(--u) * 24) / calc(var(--u) * 8) auto no-repeat,
    var(--sk-half-moons, none) left 0 top calc(110px + var(--u) * 42) / calc(var(--u) * 6) auto no-repeat,
    var(--sk-dots-tr, none) right 0 top 96px / calc(var(--u) * 8) auto no-repeat,
    var(--sk-moon, none) right calc(var(--u) * 2) top calc(110px + var(--u) * 30) / calc(var(--u) * 7) auto no-repeat,
    var(--sk-star-a, none) left calc(var(--u) * 20) top calc(90px + var(--u) * 14) / calc(var(--u) * 3.6) auto no-repeat,
    var(--sk-star-s, none) right calc(var(--u) * 20) top calc(90px + var(--u) * 10) / calc(var(--u) * 2.8) auto no-repeat,
    var(--sk-sparkle, none) left calc(var(--u) * 14) top calc(110px + var(--u) * 34) / calc(var(--u) * 2.4) auto no-repeat;
}
.esite-skin-boho-sun .hs-classic.no-photo .cl-panel::after {
  display: block; inset: 0; height: auto; z-index: 1;
  background:
    var(--sk-leaves, none) left 0 bottom 0 / calc(var(--u) * 24) auto no-repeat,
    var(--sk-bowls, none) left calc(var(--u) * 10) bottom 0 / calc(var(--u) * 20) auto no-repeat,
    var(--sk-branch, none) left 0 bottom calc(var(--u) * 9) / calc(var(--u) * 13) auto no-repeat,
    var(--sk-dots-b, none) left calc(var(--u) * 36) bottom calc(var(--u) * 1.5) / calc(var(--u) * 17) auto no-repeat,
    var(--sk-star-b, none) right calc(var(--u) * 34) bottom 0 / calc(var(--u) * 11) auto no-repeat,
    var(--sk-leaves-br, none) right 0 bottom 0 / calc(var(--u) * 19) auto no-repeat,
    var(--sk-disc, none) right 0 bottom 0 / calc(var(--u) * 17) auto no-repeat;
}
.esite-skin-boho-sun .hs-classic .cl-text { position: relative; z-index: 3; max-width: 760px; }
.esite-skin-boho-sun .cl-panel .h-kicker { font-family: var(--s-fbody); font-size: .8125rem; letter-spacing: .3em; text-transform: uppercase; color: var(--s-text); }
.esite-skin-boho-sun .hs-classic .cl-names { justify-items: center; font-size: calc(clamp(2.6rem, 4.8cqw, 4.6rem) * var(--s-hscale, 1)); line-height: 1.05; }
.esite-skin-boho-sun .hs-classic .cl-names .cn-1, .esite-skin-boho-sun .hs-classic .cl-names .cn-2 { justify-self: center; padding: 0 0 0 .24em; }
.esite-skin-boho-sun .hs-classic .cl-names .cn-amp { margin: .04em 0; font-family: var(--s-fhead); font-size: 1.2em; letter-spacing: 0; text-transform: none; }
.esite-skin-boho-sun .cl-sub { letter-spacing: .24em; }
.esite-skin-boho-sun .cl-facts b { font-family: var(--s-fbody); font-weight: 400; letter-spacing: .2em; }
.esite-skin-boho-sun .cl-facts span { font-family: var(--s-fbody); font-size: .9375rem; letter-spacing: .04em; }
/* a photo: the sun rises behind it */
.esite-skin-boho-sun .hs-classic:not(.no-photo):not(.hv-cover) .cl-panel::after { display: none; }
.esite-skin-boho-sun .hs-classic:not(.no-photo):not(.hv-cover) .cl-photo, .esite-skin-boho-sun .ss-story-img img { border-radius: 999px 999px 0 0; }
.esite-skin-boho-sun .hs-classic:not(.no-photo):not(.hv-cover) .cl-visual { overflow: visible; }
.esite-skin-boho-sun .hs-classic:not(.no-photo):not(.hv-cover) .cl-visual::after { inset: -18% -16% auto auto; width: 56%; aspect-ratio: 1; z-index: -1; border: 0; background: var(--sk-sun, none) 50% 50% / contain no-repeat; }
.esite-skin-boho-sun .hs-classic:not(.no-photo) .cl-names { font-size: calc(clamp(2.4rem, 4.4vw, 4.2rem) * var(--s-hscale, 1)); }

/* ---- the moon's phases above the headings, one section after another ---- */
.esite-skin-boho-sun .ss-scope:not([data-type="hero"]):not([data-type="countdown"]):not([data-type="none"]) .ss-h::before { width: 46px; height: 46px; margin-bottom: 10px; }
.esite-skin-boho-sun .ss-scope[data-type="story"] .ss-h::before { background-image: var(--sk-moon-0) !important; }
.esite-skin-boho-sun .ss-scope[data-type="schedule"] .ss-h::before { background-image: var(--sk-moon-1) !important; }
.esite-skin-boho-sun .ss-scope[data-type="location"] .ss-h::before, .esite-skin-boho-sun .ss-scope[data-type="gifts"] .ss-h::before { background-image: var(--sk-moon-2) !important; }
.esite-skin-boho-sun .ss-scope[data-type="faq"] .ss-h::before, .esite-skin-boho-sun .ss-scope[data-type="rsvp"] .ss-h::before { background-image: var(--sk-moon-3) !important; }
.esite-skin-boho-sun .ss-closing::before { width: 260px; height: 130px; background: var(--sk-sun, none) 50% 100% / contain no-repeat; }
.esite-skin-boho-sun .ss-scope[data-type="story"]::before { top: 0; right: 0; left: auto; width: clamp(140px, 14vw, 220px); aspect-ratio: 1; background: var(--sk-monstera, none) 100% 0 / contain no-repeat; }
.esite-skin-boho-sun .ss-scope[data-type="schedule"]::before { bottom: 0; left: 0; top: auto; right: auto; width: clamp(140px, 14vw, 220px); aspect-ratio: 1; background: var(--sk-branch, none) 0 100% / contain no-repeat; }
.esite-skin-boho-sun .ss-scope[data-type="faq"]::before { bottom: 0; right: 0; top: auto; left: auto; width: clamp(140px, 14vw, 220px); aspect-ratio: 1; background: var(--sk-leaves-br, none) 100% 100% / contain no-repeat; }
.esite-skin-boho-sun .ss-scope[data-type="schedule"], .esite-skin-boho-sun .ss-scope[data-type="faq"] { background-color: var(--sk-sec-bg, var(--s-band)); }

/* ---- countdown: crescent to full ---- */
.esite-skin-boho-sun .ss-scope[data-type="countdown"]:has(.cdv-tiles) { background-color: var(--sk-sec-bg, var(--s-bg)); }
.esite-skin-boho-sun .cdv-tiles .ss-cd { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(10px, 3vw, 34px); }
.esite-skin-boho-sun .cdv-tiles .cd-unit {
  display: flex !important; flex-direction: column; align-items: center; justify-content: center !important; gap: 0; width: clamp(92px, 12vw, 150px); aspect-ratio: 1;
  padding: 0; border: 0 !important; border-radius: 50%; outline: 0; color: var(--s-text); box-shadow: none; background: var(--sk-phase-0, none) 50% 50% / contain no-repeat !important;
}
.esite-skin-boho-sun .cdv-tiles .cd-unit:nth-child(2) { background-image: var(--sk-phase-1, none) !important; }
.esite-skin-boho-sun .cdv-tiles .cd-unit:nth-child(3) { background-image: var(--sk-phase-2, none) !important; }
.esite-skin-boho-sun .cdv-tiles .cd-unit:nth-child(4) { background-image: var(--sk-phase-3, none) !important; }
.esite-skin-boho-sun .cdv-tiles .cd-unit::before, .esite-skin-boho-sun .cdv-tiles .cd-unit::after { display: none !important; }
.esite-skin-boho-sun .ss-countdown .cd-n { font-family: var(--s-fbody) !important; font-weight: 400; font-size: clamp(1.9rem, 3.4vw, 2.8rem); line-height: 1; letter-spacing: .04em; }
.esite-skin-boho-sun .cd-l { margin-top: 4px; text-transform: uppercase; letter-spacing: .22em; font-size: .625rem; }
.esite-skin-boho-sun .cdv-tiles .ss-h { color: var(--s-accent); font-size: 2.6rem; }

/* other countdown layouts the host may pick: plain figures on the band, not on a colored panel */
.esite-skin-boho-sun .ss-scope[data-type="countdown"]:not(:has(.cdv-tiles)) { background-color: var(--sk-sec-bg, var(--s-band)); color: var(--s-text); }
.esite-skin-boho-sun .ss-scope[data-type="countdown"]:not(:has(.cdv-tiles)) :is(.ss-h, .cd-n, .cd-l) { color: var(--s-text); }
.esite-skin-boho-sun .schv-wide .ss-tl-title, .esite-skin-boho-sun .ss-tl-title { font-family: var(--s-fhead); }
.esite-skin-boho-sun :is(.schv-cards, .schv-timeline, .schv-rail) .ss-tl-time { font-family: var(--s-fbody); font-style: normal; font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; }

/* ---- the day, questions ---- */
.esite-skin-boho-sun .schv-wide .ss-tl-time { letter-spacing: .18em; text-transform: uppercase; font-size: .8125rem; }
.esite-skin-boho-sun .ss-tl-title { font-family: var(--s-fhead); font-size: 2rem; font-weight: 400; line-height: 1.1; }
.esite-skin-boho-sun .ss-faq-q { font-family: var(--s-fbody); font-size: 1rem; font-weight: 600; letter-spacing: .04em; }
.esite-skin-boho-sun .ss-loc-venue { font-size: 2.2rem; }

/* small script reads poorly: the venue's address and the closing line in the body face */
.esite-skin-boho-sun .ss-closing-line { font-family: var(--s-fbody); font-size: .9375rem; letter-spacing: .14em; text-transform: uppercase; }

/* ---- registry ---- */
.esite-skin-boho-sun .gftv-panel .ss-wrap { aspect-ratio: auto; width: min(600px, 100%); padding: 0; background: none; }
.esite-skin-boho-sun .gftv-panel .ss-h::before { display: block !important; }

/* ---- RSVP: the card between the bowls and the low sun ---- */
.esite-skin-boho-sun .ss-scope[data-type="rsvp"]::before { top: auto; bottom: 0; left: 0; right: auto; width: clamp(150px, 18vw, 280px); aspect-ratio: 1 / 1.1; background: var(--sk-bowls, none) 0 100% / contain no-repeat; }
.esite-skin-boho-sun .ss-scope[data-type="rsvp"]::after { top: 30px; right: 0; bottom: auto; left: auto; width: clamp(120px, 14vw, 220px); aspect-ratio: 1; background: var(--sk-disc, none) 100% 0 / contain no-repeat; }
.esite-skin-boho-sun .ss-rsvp-form { position: relative; max-width: 580px; padding: 44px 40px 40px; border-radius: 0; box-shadow: 0 22px 46px -30px rgba(40, 25, 10, .45); }
.esite-skin-boho-sun .ss-rsvp-form::before { content: ""; position: absolute; top: -56px; right: 24px; width: 64px; aspect-ratio: 63 / 102; pointer-events: none; background: var(--sk-arch, none) 50% 100% / contain no-repeat; }

@media (max-width: 900px) {
  .esite-skin-boho-sun .hs-classic.no-photo .cl-panel { min-height: 0; padding: calc(84px + 36vw) 20px 44vw; }
  .esite-skin-boho-sun .hs-classic.no-photo .cl-panel::before {
    background:
      var(--sk-sun, none) 50% 70px / 40vw auto no-repeat, var(--sk-dots-tl, none) left 2vw top 80px / 12vw auto no-repeat,
      var(--sk-dots-tr, none) right 2vw top 80px / 12vw auto no-repeat, var(--sk-star-a, none) left 14vw top calc(70px + 30vw) / 5vw auto no-repeat;
  }
  .esite-skin-boho-sun .hs-classic.no-photo .cl-panel::after { background:
      var(--sk-leaves, none) left 0 bottom 0 / 34vw auto no-repeat, var(--sk-bowls, none) left 16vw bottom 0 / 28vw auto no-repeat,
      var(--sk-dots-b, none) left 46vw bottom 2vw / 20vw auto no-repeat, var(--sk-leaves-br, none) right 0 bottom 0 / 28vw auto no-repeat, var(--sk-disc, none) right 0 bottom 0 / 24vw auto no-repeat; }
  .esite-skin-boho-sun .hs-classic .cl-names { font-size: calc(2.4rem * var(--s-hscale, 1)); letter-spacing: .16em; }
  .esite-skin-boho-sun .ss-scope[data-type="story"]::before, .esite-skin-boho-sun .ss-scope[data-type="schedule"]::before, .esite-skin-boho-sun .ss-scope[data-type="faq"]::before { display: none; }
  .esite-skin-boho-sun .ss-scope[data-type="rsvp"]::before, .esite-skin-boho-sun .ss-scope[data-type="rsvp"]::after { width: 110px; }
  .esite-skin-boho-sun .ss-rsvp-form { padding: 36px 20px 28px; }
}
@media (max-width: 640px) {
  .esite-skin-boho-sun .cdv-tiles .ss-cd { flex-wrap: nowrap; gap: 6px; }
  .esite-skin-boho-sun .cdv-tiles .cd-unit { width: 22vw; }
  .esite-skin-boho-sun .ss-countdown .cd-n { font-size: 1.5rem; }
  .esite-skin-boho-sun .cd-l { letter-spacing: .08em; font-size: .5rem; }
}