@font-face{font-family:"Cormorant Garamond Variable";font-style:normal;font-display:swap;font-weight:300 700;src:url("../fonts/cormorant-garamond-latin-wght-normal.woff2") format("woff2-variations")}
@font-face{font-family:"DM Sans Variable";font-style:normal;font-display:swap;font-weight:100 1000;src:url("../fonts/dm-sans-latin-wght-normal.woff2") format("woff2-variations")}

html{scroll-behavior:smooth;scroll-padding-top:4.5rem;background:rgb(var(--color-ink))}
body{background:rgb(var(--color-paper));color:rgb(var(--color-body));-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:rgb(var(--color-gold)/.35)}

.icon{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

/* Photo placeholders. Replace each with <img class="h-full w-full object-cover"> when photos arrive. */
.ph{position:relative;overflow:hidden;background:linear-gradient(145deg,#eadfca,#cbb68a)}
.ph::before{content:"";position:absolute;inset:0;background:url("../img/logo.webp") center/34% no-repeat;opacity:.16}
.ph::after{content:"Photo coming soon";position:absolute;left:1rem;bottom:.85rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--color-gold-dark))}
.ph-dark{background:linear-gradient(145deg,#2f261f,#17120e);box-shadow:inset 0 0 0 1px rgb(var(--color-gold)/.28)}
.ph-dark::before{opacity:.22}
.ph-dark::after{color:rgb(var(--color-gold))}

/* Offset gold frame behind a photo */
.frame{position:relative;isolation:isolate}
.frame::after{content:"";position:absolute;inset:0;transform:translate(12px,12px);border:1px solid rgb(var(--color-gold));z-index:-1;pointer-events:none}

.no-scrollbar{scrollbar-width:none}.no-scrollbar::-webkit-scrollbar{display:none}

.field{width:100%;min-width:0;height:3rem;max-width:100%;background:#fff;border:1px solid rgb(var(--color-ink)/.2);border-radius:.25rem;
  padding:.8rem .9rem;color:rgb(var(--color-ink));font-size:1rem;transition:border-color .2s,box-shadow .2s}
.field::placeholder{color:rgb(var(--color-body)/.55)}
.field:focus,.dd-btn:focus-visible{outline:none;border-color:rgb(var(--color-gold-dark));box-shadow:0 0 0 3px rgb(var(--color-gold)/.25)}
input[type=date].field{display:block;-webkit-appearance:none;appearance:none;text-align:left}
input[type=date].field::-webkit-date-and-time-value{text-align:left;min-height:1.5em}

.dd{position:relative}
.dd-btn{display:flex;width:100%;align-items:center;justify-content:space-between;gap:.75rem;text-align:left;cursor:pointer}
.dd-btn .icon{transition:transform .2s;color:rgb(var(--color-gold-dark))}
.dd.open .dd-btn{border-color:rgb(var(--color-gold-dark))}
.dd.open .dd-btn .icon{transform:rotate(180deg)}
.dd-list{position:absolute;left:0;right:0;top:calc(100% + .35rem);z-index:20;margin:0;padding:.35rem;list-style:none;
  background:#fff;border:1px solid rgb(var(--color-ink)/.15);border-radius:.375rem;
  box-shadow:0 16px 36px -10px rgb(var(--color-ink)/.35);display:none}
.dd.open .dd-list{display:block}
.dd-opt{display:flex;align-items:center;justify-content:space-between;padding:.7rem .75rem;border-radius:.25rem;cursor:pointer;color:rgb(var(--color-ink))}
.dd-opt:hover,.dd-opt.active{background:rgb(var(--color-sand)/.6)}
.dd-opt .icon{visibility:hidden;color:rgb(var(--color-gold-dark))}
.dd-opt[aria-selected=true]{font-weight:600}
.dd-opt[aria-selected=true] .icon{visibility:visible}

html.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
html.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .reveal{opacity:1;transform:none;transition:none}
}

textarea.field{height:auto}