/* A quiet watchmaking rhythm. All content is visible without JavaScript. */
:root { --motion-ease: cubic-bezier(.22,.68,.2,1); }
html { scroll-behavior: auto; }
.reveal-pending { opacity: 1; transform: none; }
.site-header.sticky { animation: none; }
.hero-image { animation: none; }
.button, .gallery-controls button, .dialog-close {
  transition: background-color .22s, color .22s, border-color .22s,
    box-shadow .22s, transform .22s var(--motion-ease);
}
.button:active, .gallery-controls button:active { transform: translateY(1px); }
.text-link { transition: color .22s, border-color .22s; }
:is(button,a,summary,select):focus-visible {
  outline: 3px solid #a67c40;
  outline-offset: 5px;
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .button:hover { box-shadow: inset 0 -2px 0 #49381026, 0 4px 12px #19291f0d; }
  .gallery-controls button:hover { background: #b99b6026; }
  .room-photo:hover img, .photo-grid button:hover img { transform: scale(1.025); }
}
.mobile-menu { overflow-y: auto; overscroll-behavior: contain; }
.mobile-menu nav a { width: fit-content; }
.mobile-menu nav a[aria-current=page] { text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 7px; text-decoration-thickness: 1px; }
.page-photo-stage { position: relative; }
.gallery-ghost { position: absolute; z-index: 1; pointer-events: none; }
.gallery-controls, .dialog-close { z-index: 2; }

/* A short reflection followed by a long rest; enabled only while visible. */
@media (prefers-reduced-motion:no-preference) and (min-width:701px) {
  .stay-invitation.is-reflecting .stay-invitation-glow { animation: stay-reflection 12s ease-in-out infinite; }
}
@keyframes stay-reflection {
  0% { transform: translateX(-35%); opacity: 0; }
  12% { transform: translateX(0); opacity: .75; }
  27%, 100% { transform: translateX(35%); opacity: 0; }
}

/* Live Swiss clock: small SVG, faceted hands, brushed metal and layered glass. */
.house-visual { isolation: isolate; align-self: start; }
.timepiece {
  position: absolute;
  right: -18px;
  bottom: -24px;
  width: clamp(154px,14vw,202px);
  aspect-ratio: 1;
  z-index: 2;
}
.timepiece-object {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  padding: 7px;
  background: repeating-radial-gradient(circle at center,transparent 0 1px,#f5f0dd30 1.2px 1.5px,transparent 1.8px 2.4px),
    conic-gradient(from 30deg,#716d60,#eeebe0 12%,#aaa89e 26%,#fffdf4 39%,#a49d88 52%,#686c64 65%,#e1dfd2 82%,#716d60);
  box-shadow: inset 0 0 0 1px #f4ead1, inset 0 0 0 2px #bbb6a37a, inset 0 0 0 4px #454b4226,
    1px 3px 0 #8d8879, 2px 6px 0 #53594f, 3px 8px 3px #18241c33, 5px 16px 24px #15221940;
  transform: perspective(800px) rotateX(8deg) rotateY(-12deg) rotateZ(-7deg);
  pointer-events: none;
}
.timepiece-object::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: -6px;
  top: 44%;
  width: 10px;
  height: 12%;
  border: 1px solid #8e724e;
  border-radius: 2px 3px 3px 2px;
  background: repeating-linear-gradient(0deg,#98734c 0 1px,#dec29a 1px 2px,#b2946b 2px 3px);
  box-shadow: 1px 2px 2px #101d1855;
}
.timepiece-object::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  box-shadow: inset 1px 1px 1px #fff8e66b, inset -1px -1px 2px #070f0b99;
  background: radial-gradient(ellipse at 28% 20%,#fffce50a,transparent 65%);
}
.timepiece-glass {
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  overflow: hidden;
  pointer-events: none;
}
.timepiece-glass::before {
  content: "";
  position: absolute;
  inset: -16%;
  background: linear-gradient(126deg,transparent 18%,#fffbed03 24%,#fffbed23 31%,#fffbed0c 36%,transparent 42% 64%,#fffbed0a 70%,transparent 77%);
  transform: translate3d(var(--glass-x,0px),var(--glass-y,0px),0);
}
.timepiece.is-awake .timepiece-glass::before {
  transition: transform .24s ease-out;
}
.timepiece-face {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: repeating-conic-gradient(from 8deg,#e2e5c805 0deg 1deg,#04150e08 1deg 2deg),
    conic-gradient(from 20deg,#244231,#4c6245 16%,#163528 34%,#3e5940 53%,#183226 73%,#456046 88%,#244231);
  box-shadow: inset 0 2px 8px #0009, 0 0 0 1px #45483c;
}
.timepiece-sweep { display: none; }
.timepiece.is-live .timepiece-sweep { display: block; }
@media (max-width:700px) {
  .timepiece { width: 118px; right: 12px; bottom: 14px; }
  .timepiece-object { padding: 5px; transform: rotate(-7deg); box-shadow: 1px 3px 0 #8d8879, 3px 8px 16px #15221930; }
  .timepiece-object::after, .timepiece-glass { inset: 5px; }
}
@media (max-height:650px) {
  .mobile-menu { padding-top: 100px; }
  .mobile-menu nav { gap: 10px; margin-bottom: 25px; }
  .mobile-menu nav a { font-size: 1.9rem; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .room-photo:hover img, .photo-grid button:hover img, .button:active { transform: none; }
  .timepiece.is-live .timepiece-sweep { display: none; }
}