:root { color-scheme: light; background: #efede4; }
body { background: #efede4; }
.skip-animation {
  position: fixed; top: 12px; left: 12px; z-index: 20; padding: 12px 20px;
  background: #f7f4e9; color: #303c30; transform: translateY(-150%);
  font-family: 'DM Sans', sans-serif;
}
.skip-animation:focus { transform: translateY(0); }
.caption { font-family: 'Instrument Serif', Georgia, serif; bottom: 4%; }
.caption p { font-size: clamp(2rem, 4.4vw, 4.5rem); font-weight: 400; }
.continue {
  font-family: 'DM Sans', sans-serif; font-size: .75rem; letter-spacing: .04em;
  color: #fff; text-decoration: none; display: inline-flex; gap: 1.5rem;
  padding: .6rem; pointer-events: none; visibility: hidden;
}
.caption.is-visible .continue { pointer-events: auto; visibility: visible; }
.holiday { color: #344033; font-family: 'DM Sans', sans-serif; background: #efede4; }
.holiday a { color: inherit; }
.holiday button, .holiday input, .holiday select { font: inherit; }
.holiday button { cursor: pointer; }
.holiday a, .holiday button, .holiday input, .holiday select { -webkit-tap-highlight-color: transparent; }
.holiday :focus-visible, .image-dialog :focus-visible { outline: 2px solid #b1603c; outline-offset: 5px; }
.content, .holiday-header { width: min(88%, 1320px); margin-inline: auto; }
.holiday-header {
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
  padding: 2.25rem 0; border-bottom: 1px solid #34403330;
}
.wordmark { font-family: 'Instrument Serif', Georgia, serif; text-decoration: none; font-size: 2.1rem; line-height: 1; }
.wordmark span { display: block; font-family: 'DM Sans',sans-serif; font-size: .53rem; letter-spacing: .29em; margin-top: .65rem; }
nav { display: flex; align-items: center; gap: clamp(1rem, 3vw, 3rem); font-size: .8rem; }
nav a { text-decoration: none; padding-block: .5rem; }
nav a:hover { text-decoration: underline; text-underline-offset: 6px; }
.nav-plan { display: flex; gap: 2rem; }
.welcome { display: grid; grid-template-columns: 1.5fr 1fr; gap: 8%; align-items: end; padding-block: 6.5rem 4rem; }
.eyebrow { font-size: .65rem; letter-spacing: .17em; text-transform: uppercase; margin: 0 0 1.6rem; }
.holiday h1, .holiday h2, .holiday h3 { font-family: 'Instrument Serif',Georgia,serif; font-weight: 400; }
.holiday h1 { font-size: clamp(3.7rem, 6.6vw, 6.6rem); line-height: .97; letter-spacing: -.025em; margin: 0; }
.holiday h2 { font-size: clamp(2.9rem, 4.3vw, 4.8rem); line-height: 1.04; letter-spacing: -.02em; margin: 0 0 1.6rem; }
.holiday h3 { font-size: 2rem; line-height: 1.12; margin: 1rem 0; }
.holiday em { color: #737958; font-weight: 400; }
.welcome-copy { padding: 0 0 .3rem; max-width: 345px; justify-self: end; }
.welcome-copy p, .stay-copy > p:not(.eyebrow), .trip > div > p:not(.eyebrow) {
  font-size: .9rem; line-height: 1.85; color: #626858;
}
.welcome-copy p { margin: 0 0 1rem; }
.text-link { display: inline-flex; align-items: center; gap: 2rem; font-size: .8rem; text-decoration: none; border-bottom: 1px solid #34403370; padding: 0 0 .65rem; margin-top: 1rem; }
.photo-button { display: block; width: 100%; padding: 0; border: 0; position: relative; background: #d9d7ca; overflow: hidden; }
.photo-button img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.photo-button:hover img { transform: scale(1.018); }
.photo-expand { position: absolute; right: 1rem; bottom: 1rem; display: grid; place-items: center; width: 2rem; height: 2rem; background: #f7f3e7e8; color: #344033; font-size: 1.1rem; }
.wide-photo .photo-button { height: min(43vw, 580px); }
.holiday figure { margin-block: 0; }
.holiday figcaption { font-size: .72rem; color: #727668; margin-top: .9rem; }
.stay { display: grid; grid-template-columns: 1fr 1.15fr; gap: 11%; padding-block: 8.5rem; align-items: center; }
.stay-copy > p:not(.eyebrow) { max-width: 385px; }
.room-photo { margin-inline: 0; }
.room-photo .photo-button { aspect-ratio: 4/5; }
.room-photo img { object-position: 45% center; }
.details { list-style: none; padding: 0; margin: 2.2rem 0 0; font-size: .73rem; }
.details li { display: flex; gap: 1rem; justify-content: space-between; border-top: 1px solid #34403328; padding: 1rem 0; }
.details li span:last-child { color: #727668; text-align: right; }
.outside { background: #e3e4d8; padding-block: 5.7rem 5rem; }
.outside-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; }
.outside-heading h2 { margin-bottom: 0; }
.outside-heading > p { font-size: .85rem; line-height: 1.8; color: #626858; margin-bottom: .4rem; }
.moments { display: grid; grid-template-columns: repeat(3,1fr); gap: 5%; margin-block: 3rem 3.5rem; }
.moments article { border-top: 1px solid #3440333b; padding-top: 1.25rem; }
.moment-time { font-size: .65rem; letter-spacing: .09em; text-transform: uppercase; }
.moments p { font-size: .8rem; line-height: 1.8; color: #626858; max-width: 310px; }
.lake-photo .photo-button { aspect-ratio: 2.15; }
.lake-photo img { object-position: center 62%; }
.trip { display: grid; grid-template-columns: 1fr 1fr; gap: 14%; padding-block: 7.5rem; }
.trip > div > p:not(.eyebrow) { max-width: 340px; }
.trip-form { display: flex; flex-direction: column; gap: 1.35rem; padding-top: .5rem; }
.trip-form label { font-size: .7rem; display: flex; flex-direction: column; gap: .75rem; }
.date-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.trip-form input, .trip-form select {
  border: 0; border-bottom: 1px solid #3440336b; padding: .65rem 0; border-radius: 0;
  background: transparent; color: #344033; font-size: .87rem; width: 100%; min-width: 0;
}
.trip-summary { margin: .3rem 0 0; font-size: .78rem; min-height: 1.5rem; }
.primary-button { border: 0; background: #3b4936; color: #faf7ee; padding: 1.2rem 1.4rem; display: flex; justify-content: space-between; font-size: .78rem !important; }
.primary-button:hover { background: #515e40; }
.form-note { font-size: .65rem; line-height: 1.6; color: #76786c; margin: -.5rem 0 0; }
.holiday-footer { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding-block: 2.5rem; border-top: 1px solid #34403330; }
.holiday-footer p { font-family: 'Instrument Serif',serif; font-size: 1.4rem; }
.holiday-footer small { color: #797c70; font-size: .6rem; }
.image-dialog { border: 0; padding: 0; max-width: min(92vw, 1400px); max-height: 94svh; background: #efede4; color: #344033; overflow: auto; }
.image-dialog::backdrop { background: #141d14db; }
.image-dialog figure { margin: 0; }
.image-dialog img { display: block; max-width: 100%; max-height: 81svh; object-fit: contain; }
.image-dialog figcaption { font-family: 'DM Sans',sans-serif; padding: 1rem 1.4rem; font-size: .8rem; }
.close-dialog { position: absolute; right: .8rem; top: .8rem; border: 0; background: #f7f3e7; color: #344033; width: 2.4rem; height: 2.4rem; font-size: 1.6rem; cursor: pointer; }
@media (max-width: 760px) {
  .content, .holiday-header { width: 88%; }
  .holiday-header { padding-block: 1.6rem; gap: 1rem; }
  .wordmark { font-size: 1.75rem; }
  nav { gap: 1rem; font-size: .7rem; }
  nav a:not(.nav-plan) { display: none; }
  .nav-plan { gap: .8rem; }
  .welcome { grid-template-columns: 1fr; padding-block: 4rem 2.5rem; gap: 2rem; }
  .holiday h1 { font-size: clamp(3.3rem, 10.5vw, 5.6rem); }
  .welcome-copy { justify-self: start; max-width: 450px; }
  .wide-photo .photo-button { height: 60vw; }
  .stay { grid-template-columns: 1fr; gap: 2.5rem; padding-block: 4.5rem; }
  .room-photo .photo-button { aspect-ratio: 1.1; }
  .outside { padding-block: 4rem 3rem; }
  .outside-heading { display: block; }
  .outside-heading > p { margin-top: 1.5rem; }
  .moments { grid-template-columns: 1fr; gap: 1.4rem; margin-block: 2rem 2.5rem; }
  .moments article { display: grid; grid-template-columns: 95px 1fr; gap: .5rem 1rem; }
  .moment-time { padding-top: .45rem; }
  .moments h3 { margin: 0; font-size: 1.75rem; }
  .moments p { grid-column: 2; margin: .4rem 0 0; }
  .lake-photo .photo-button { aspect-ratio: 1.25; }
  .trip { grid-template-columns: 1fr; gap: 2rem; padding-block: 4.5rem; }
  .date-fields { gap: 1rem; }
  .holiday-footer { flex-wrap: wrap; gap: 1rem; }
  .holiday-footer p { font-size: 1.15rem; }
  .holiday-footer small { flex-basis: 100%; margin-top: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .photo-button img { transition: none; }
  .continue { visibility: visible; pointer-events: auto; }
}


/* Effects apply only after the browser has initialized motion support. */
.motion-enabled [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition: opacity .78s ease var(--reveal-delay, 0ms),
    transform .9s cubic-bezier(.2,.65,.25,1) var(--reveal-delay, 0ms);
}
.motion-enabled [data-reveal].is-revealed {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.motion-enabled .photo-button img {
  transform: translate3d(0, var(--photo-y, 0px), 0) scale(1.075);
  transition: filter .5s ease;
}
.motion-enabled .photo-button:hover img { filter: saturate(1.04); }
.photo-expand {
  transition: transform .35s ease, background-color .35s ease;
}
.photo-button:hover .photo-expand, .photo-button:focus-visible .photo-expand {
  transform: translate(2px, -2px);
  background-color: #fffdf5;
}
.text-link span, .nav-plan span, .primary-button span {
  display: inline-block;
  transition: transform .3s ease;
}
.text-link:hover span, .nav-plan:hover span { transform: translate(3px, -2px); }
.primary-button:hover span { transform: translateY(3px); }
.text-link { transition: border-color .3s, color .3s; }
.text-link:hover { color: #8c553b; border-color: #8c553b; }
.primary-button { transition: background-color .3s ease, box-shadow .3s ease; }
.primary-button:hover { box-shadow: 0 7px 20px #34403319; }
.motion-enabled .moments article {
  position: relative;
  border-top-color: transparent;
}
.motion-enabled .moments article::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: #3440333b;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s cubic-bezier(.2,.65,.25,1) var(--reveal-delay, 0ms);
}
.motion-enabled .moments article.is-revealed::before { transform: scaleX(1); }
@media (prefers-reduced-motion: no-preference) {
  .image-dialog[open] { animation: gallery-open .3s ease both; }
  .image-dialog[open]::backdrop { animation: backdrop-open .3s ease both; }
}
@keyframes gallery-open {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes backdrop-open { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .motion-enabled [data-reveal] { opacity: 1; transform: none; transition: none; }
  .motion-enabled .photo-button img, .photo-button:hover img { transform: none; filter: none; }
  .photo-expand, .text-link, .text-link span, .nav-plan span,
  .primary-button, .primary-button span { transition: none; }
  .photo-button:hover .photo-expand, .text-link:hover span,
  .nav-plan:hover span, .primary-button:hover span { transform: none; }
}
