* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; }

.site-shell a, .site-shell button { -webkit-tap-highlight-color: transparent; }

.nav-link { position: relative; transition: color 180ms ease; }
.mobile-nav-closed { display: none !important; }
.nav-link::after { content: ''; position: absolute; left: 0; right: 100%; bottom: -7px; height: 1px; background: currentColor; transition: right 180ms ease; }
.nav-link:hover, .nav-link:focus-visible { color: white; }
.nav-link:hover::after, .nav-link:focus-visible::after { right: 0; }

.site-button { display: inline-flex; align-items: center; gap: 0.6rem; min-height: 2.9rem; padding: 0.75rem 1.05rem; font-family: var(--font-body); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease; }
.site-button:hover { transform: translateY(-2px); }
.site-button-light { background: var(--background); color: var(--text); }
.site-button-light:hover { background: white; }
.site-button-ghost { border: 1px solid color-mix(in srgb, currentColor 34%, transparent); color: inherit; }
.site-button-ghost:hover { border-color: currentColor; }

.section-space { padding-top: clamp(4.5rem, 10vw, 9rem); padding-bottom: clamp(4.5rem, 10vw, 9rem); }
.section-kicker { font-family: var(--font-body); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--primary); }
.section-kicker.reviews-kicker { color: #f5cf63; }
.section-title { max-width: 30rem; font-family: var(--font-heading); font-size: clamp(2.2rem, 4vw, 4rem); font-weight: 600; line-height: 0.98; letter-spacing: -0.055em; }

.hero-photo { background: var(--primary); }

.attribute-card { transition: transform 200ms ease, border-color 200ms ease, background-color 200ms ease; }
.attribute-card:hover { transform: translateY(-4px); border-color: var(--primary); }

.gallery-track { scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: var(--primary) transparent; }
.gallery-track::-webkit-scrollbar { height: 4px; }
.gallery-track::-webkit-scrollbar-thumb { background: var(--primary); }
.gallery-slide { width: min(76vw, 22rem); height: clamp(20rem, 52vw, 31rem); background: color-mix(in srgb, var(--text) 10%, transparent); }
.gallery-slide-wide { width: min(88vw, 34rem); }
.gallery-slide img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2,.7,.2,1); }
.gallery-slide:hover img { transform: scale(1.035); }
.gallery-control { display: flex; width: 2.6rem; height: 2.6rem; align-items: center; justify-content: center; border: 1px solid color-mix(in srgb, var(--text) 20%, transparent); color: var(--text); transition: transform 180ms ease, border-color 180ms ease; background: transparent; cursor: pointer; }
.gallery-control:hover { transform: translateY(-2px); border-color: var(--primary); }

.reviews-masonry { columns: 1; column-gap: 1rem; }
.review-card { display: inline-block; width: 100%; margin-bottom: 1rem; break-inside: avoid; vertical-align: top; transition: transform 180ms ease, border-color 180ms ease; }
.review-card:hover { transform: translateY(-4px); border-color: var(--accent); }
@media (min-width: 640px) { .reviews-masonry { columns: 2; } }
@media (min-width: 1024px) { .reviews-masonry { columns: 3; } }

.footer-heading { margin-bottom: 1.1rem; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--background); }
.footer-detail { display: flex; align-items: flex-start; gap: 0.3rem; margin-top: 0.65rem; max-width: 18rem; font-size: 0.78rem; line-height: 1.55; color: color-mix(in srgb, var(--background) 55%, transparent); }
.footer-link { display: inline-flex; align-items: center; gap: 0.3rem; transition: color 180ms ease; }
.footer-link:hover { color: var(--background); }

.fade-in-up { animation: fadeInUp 0.7s ease both; }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}