@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}
::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}
/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*/
/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}
::before,
::after {
  --tw-content: '';
}
/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/
html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}
/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}
/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}
/*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}
/*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
  color: inherit;
  text-decoration: inherit;
}
/*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
  font-weight: bolder;
}
/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}
/*
Add the correct font size in all browsers.
*/
small {
  font-size: 80%;
}
/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
/*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
  text-transform: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
/*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
  outline: auto;
}
/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
  box-shadow: none;
}
/*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
  vertical-align: baseline;
}
/*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}
/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
  -webkit-appearance: none;
}
/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/*
Add the correct display in Chrome and Safari.
*/
summary {
  display: list-item;
}
/*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}
fieldset {
  margin: 0;
  padding: 0;
}
legend {
  padding: 0;
}
ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/
textarea {
  resize: vertical;
}
/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}
input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}
/*
Set the default cursor for buttons.
*/
button,
[role="button"] {
  cursor: pointer;
}
/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}
/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
  max-width: 100%;
  height: auto;
}
/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}
.hidden{
  display: none;
}
:root { font-family: 'DM Sans', sans-serif; color: #24221e; background: #f8f4ec; font-synthesis: none; --charcoal: #24221e; --cream: #f8f4ec; --burgundy: #702d32; --olive: #626b43; --gold: #c6a46a; --muted: #8f897e; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--cream); -moz-user-select: none; user-select: none; -webkit-user-select: none; }
body, button, a { -webkit-tap-highlight-color: transparent; }
img { -webkit-user-drag: none; -moz-user-select: none; user-select: none; -webkit-user-select: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.site-shell { overflow: hidden; }
.content-width { width: min(1160px, calc(100% - 64px)); margin: 0 auto; }
.section-padding { padding: 136px 0; }
.site-header { height: 82px; padding: 0 max(32px, calc((100vw - 1160px) / 2)); display: flex; align-items: center; justify-content: space-between; position: absolute; top: 0; width: 100%; z-index: 20; color: #fff; transition: background .25s ease, color .25s ease; }
.brand { display: inline-flex; align-items: center; gap: 11px; letter-spacing: .04em; }
.brand-mark { display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: var(--gold); }
.brand strong { display: block; font-family: 'Playfair Display', serif; font-size: 17px; font-weight: 600; letter-spacing: .01em; }
.brand small { display: block; color: #c7c0b4; font-size: 8px; letter-spacing: .24em; margin-top: 2px; }
.main-nav { display: flex; align-items: center; gap: 29px; font-size: 12px; font-weight: 500; letter-spacing: .02em; }
.main-nav a { opacity: .82; transition: color .2s ease, opacity .2s ease; }
.main-nav a:hover { color: var(--gold); opacity: 1; }
.main-nav .nav-call { display: flex; gap: 7px; align-items: center; color: #fff; border: 1px solid rgba(255,255,255,.45); border-radius: 30px; padding: 11px 16px; opacity: 1; }
.menu-toggle { display: none; background: none; border: 0; color: inherit; cursor: pointer; }
.hero { min-height: 760px; height: 100vh; max-height: 920px; position: relative; display: flex; align-items: center; color: #fff; background: #161513; }
.hero-image { position: absolute; inset: 0; background-image: linear-gradient(90deg, rgba(13,13,12,.92) 0%, rgba(13,13,12,.62) 43%, rgba(13,13,12,.08) 100%), url('/images/%D0%9F%D1%80%D0%BE%D1%84%D0%B5%D1%81%D0%B8%D0%BE%D0%BD%D0%B0%D0%BB%D0%B5%D0%BD_%D0%BF%D0%BE%D1%80%D1%82%D1%80%D0%B5%D1%82_%D0%BD%D0%B0_%D0%B3%D0%BE%D1%82%D0%B2%D0%B0%D1%87.png'); background-size: cover; background-position: center; }
.hero-grain { position: absolute; inset: 0; opacity: .17; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; pointer-events: none; }
.hero-content { position: relative; z-index: 1; padding-top: 58px; }
.eyebrow { color: var(--burgundy); font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; display: flex; align-items: center; gap: 11px; margin: 0 0 22px; }
.eyebrow span { width: 29px; height: 1px; background: currentColor; display: inline-block; }
.eyebrow.light { color: var(--gold); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: 'Playfair Display', serif; font-weight: 500; line-height: 1.12; }
h1 { font-size: clamp(42px, 5.15vw, 76px); letter-spacing: -.04em; max-width: 760px; margin-bottom: 26px; }
h1 em, h2 em, h3 em { color: var(--gold); font-style: italic; }
.hero-lead { max-width: 484px; color: #d2ccc1; line-height: 1.72; font-size: 15px; margin-bottom: 33px; }
.hero-actions { display: flex; gap: 13px; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 49px; padding: 0 21px; border-radius: 2px; font-size: 12px; font-weight: 700; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-3px); }
.button-primary { color: #fff; background: var(--burgundy); }
.button-primary:hover { background: #843b40; }
.button-ghost { border: 1px solid rgba(255,255,255,.48); color: #fff; }
.button-ghost:hover { background: #fff; color: var(--charcoal); }
.button-gold { background: var(--gold); color: var(--charcoal); }
.button-gold:hover { background: #dbc18c; }
.hero-trust { margin-top: 90px; display: flex; align-items: center; gap: 13px; color: #b7b0a5; font-size: 10px; letter-spacing: .08em; }
.hero-trust i { width: 3px; height: 3px; border-radius: 50%; background: var(--gold); }
.hero-side-note { position: absolute; right: max(32px, calc((100vw - 1160px) / 2)); bottom: 46px; text-align: right; font-family: 'Playfair Display', serif; font-size: 18px; line-height: 1.05; color: var(--gold); font-style: italic; }
.hero-side-note span { font-family: 'DM Sans', sans-serif; color: #aaa398; font-size: 10px; letter-spacing: .16em; font-style: normal; text-transform: uppercase; }
.about { background: var(--cream); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(60px, 9vw, 130px); align-items: center; }
.about-photo-wrap { height: 585px; overflow: hidden; position: relative; background: #201e1a; }
.about-photo-wrap:after { content: ''; position: absolute; inset: 15px; border: 1px solid rgba(198,164,106,.42); pointer-events: none; }
.about-photo-wrap img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: 70% center; object-position: 70% center; filter: saturate(.83); }
.about-copy h2, .section-heading h2, .review-intro h2, .contact-layout h2 { font-size: clamp(39px, 4.3vw, 61px); letter-spacing: -.045em; margin-bottom: 27px; }
.about-copy h2 em, .gallery h2 em, .review-intro h2 em, .contact-layout h2 em { color: var(--burgundy); }
.about-copy > p:not(.eyebrow) { color: #6d685f; font-size: 14px; line-height: 1.76; max-width: 500px; margin-bottom: 15px; }
.benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; border-top: 1px solid #ddd5c8; margin-top: 112px; padding-top: 36px; }
.benefit-number { color: var(--gold); font-family: 'Playfair Display', serif; font-size: 19px; font-style: italic; }
.benefit h3 { margin: 20px 0 10px; font-family: 'Playfair Display', serif; font-size: 21px; font-weight: 600; }
.benefit p { color: #7e786e; line-height: 1.65; font-size: 13px; max-width: 280px; }
.dark-section { background: var(--charcoal); color: #f5f0e7; }
.section-heading { max-width: 690px; }
.section-heading.centered { text-align: center; margin: 0 auto 61px; }
.section-heading.centered .eyebrow { justify-content: center; }
.section-heading h2 { margin-bottom: 20px; }
.light-heading h2 { color: #f8f4ec; }
.section-heading > p:last-child { color: #aaa59c; font-size: 14px; line-height: 1.7; max-width: 570px; margin: auto; }
.services-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.service-card { min-width: 0; background: #2c2a25; transition: transform .25s ease; }
.service-card:hover { transform: translateY(-8px); }
.service-image { height: 215px; position: relative; overflow: hidden; }
.service-image:after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(19,18,15,.48), transparent 60%); }
.service-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: transform .5s ease; }
.service-card:hover img { transform: scale(1.06); }
.service-icon { position: absolute; z-index: 1; bottom: 14px; left: 15px; display: grid; place-items: center; width: 38px; height: 38px; background: var(--gold); color: var(--charcoal); border-radius: 50%; }
.service-card-copy { padding: 20px 17px 23px; }
.service-card h3 { font-family: 'Playfair Display', serif; font-size: 19px; margin-bottom: 9px; }
.service-card p { min-height: 57px; margin: 0; color: #aaa59c; font-size: 12px; line-height: 1.55; }
.service-banner { background: var(--burgundy); display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 38px 49px; margin-top: 64px; }
.service-banner .eyebrow { margin-bottom: 14px; }
.service-banner h3 { font-family: 'Playfair Display', serif; font-size: clamp(25px, 3vw, 37px); line-height: 1.08; font-weight: 500; margin: 0; }
.service-banner h3 em { color: #f0d5a1; }
.banner-action { text-align: right; color: #e7c5a8; font-size: 12px; }
.banner-action p { margin-bottom: 16px; }
.gallery { background: #eee8dc; }
.gallery-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; max-width: none; margin-bottom: 48px; }
.gallery-heading > p { max-width: 330px; color: #7e786f; font-size: 13px; line-height: 1.7; margin-bottom: 12px; }
.gallery-heading h2 { margin-bottom: 0; }
.gallery-slider { max-width: 1040px; margin: 0 auto; }
.gallery-stage { position: relative; height: min(62vw, 610px); min-height: 390px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #211f1b; box-shadow: 0 20px 50px rgba(54, 43, 28, .14); }
.gallery-stage:before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at center, rgba(255,255,255,.08), transparent 55%); pointer-events: none; }
.gallery-stage img { position: relative; z-index: 1; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; transition: opacity .3s ease; }
.gallery-stage-caption { position: absolute; z-index: 2; inset: auto 0 0; display: flex; align-items: end; justify-content: space-between; padding: 72px 31px 27px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.78)); }
.gallery-stage-caption span { display: grid; gap: 5px; }
.gallery-stage-caption small { color: var(--gold); font-size: 10px; letter-spacing: .2em; }
.gallery-stage-caption strong { font-family: 'Playfair Display', serif; font-size: clamp(21px, 2.5vw, 31px); font-weight: 500; }
.gallery-stage-caption button { display: grid; place-items: center; width: 45px; height: 45px; color: #fff; border: 1px solid rgba(255,255,255,.58); background: rgba(24,22,19,.3); cursor: pointer; transition: background .2s ease, color .2s ease; }
.gallery-stage-caption button:hover { background: var(--gold); color: var(--charcoal); }
.gallery-progress { position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255,255,255,.2); }
.gallery-progress span { display: block; height: 100%; background: var(--gold); transition: width .35s ease; }
.gallery-controls { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 21px; }
.gallery-arrows { display: flex; gap: 9px; }
.gallery-arrows button { display: grid; place-items: center; width: 43px; height: 43px; color: var(--charcoal); border: 1px solid #c7bdae; background: transparent; cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.gallery-arrows button:hover { border-color: var(--burgundy); background: var(--burgundy); color: #fff; }
.gallery-thumbnails { display: flex; gap: 10px; }
.gallery-thumbnails button { width: 78px; height: 57px; padding: 0; border: 2px solid transparent; background: #d7d0c3; cursor: pointer; opacity: .62; transition: opacity .2s ease, border-color .2s ease, transform .2s ease; }
.gallery-thumbnails button:hover, .gallery-thumbnails button.is-active { border-color: var(--burgundy); opacity: 1; transform: translateY(-3px); }
.gallery-thumbnails img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
.review-section { background: var(--cream); }
.review-layout { display: grid; grid-template-columns: .7fr .62fr 1.28fr; align-items: center; gap: 38px; }
.review-photo { height: 435px; overflow: hidden; background: #27241f; border: 1px solid rgba(198,164,106,.5); padding: 11px; }
.review-photo img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; filter: saturate(.86); }
.review-intro h2 { font-size: clamp(37px, 4vw, 55px); }
.review-intro > p:last-child { color: #7e786f; line-height: 1.7; font-size: 14px; max-width: 340px; }
.review-card { position: relative; background: #fffdf8; border: 1px solid #e2d9ca; padding: 48px 45px 42px; box-shadow: 14px 14px 0 #e1d8c9; }
.quote-icon { position: absolute; top: 27px; left: 25px; color: var(--gold); opacity: .7; }
.review-card > p { position: relative; color: #565149; line-height: 1.75; font-family: 'Playfair Display', serif; font-size: 15px; }
.review-card > a { display: inline-flex; align-items: center; gap: 4px; color: var(--burgundy); font-weight: 700; font-size: 13px; margin-top: 9px; border-bottom: 1px solid var(--gold); padding-bottom: 4px; }
.contact-section { background: #e9e2d5; }
.contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.contact-layout h2 { margin-bottom: 0; }
.contact-list { border-top: 1px solid #cfc5b5; }
.contact-item { min-height: 82px; border-bottom: 1px solid #cfc5b5; display: flex; align-items: center; gap: 16px; color: var(--charcoal); }
.contact-item > span:nth-child(2) { flex: 1; }
.contact-item > svg { color: var(--burgundy); }
.contact-icon { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #c8b7a1; border-radius: 50%; color: var(--burgundy); }
.contact-item small, .contact-item strong { display: block; }
.contact-item small { color: #898276; font-size: 10px; text-transform: uppercase; letter-spacing: .16em; margin-bottom: 4px; }
.contact-item strong { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 600; }
.floating-call { display: none; position: fixed; right: 18px; bottom: 18px; z-index: 10; background: var(--burgundy); color: #fff; width: 50px; height: 50px; border-radius: 50%; align-items: center; justify-content: center; box-shadow: 0 5px 20px rgba(0,0,0,.2); }
.lightbox { position: fixed; inset: 0; z-index: 40; display: flex; align-items: center; justify-content: center; background: rgba(19,18,16,.95); padding: 60px 8%; }
.lightbox img { max-width: min(100%, 1000px); max-height: 82vh; -o-object-fit: contain; object-fit: contain; box-shadow: 0 12px 50px rgba(0,0,0,.4); }
.lightbox p { position: absolute; bottom: 22px; left: 0; width: 100%; color: #f4ede1; text-align: center; font-family: 'Playfair Display', serif; font-size: 17px; }
.lightbox-close, .lightbox-arrow { position: absolute; display: grid; place-items: center; background: none; color: #fff; border: 1px solid rgba(255,255,255,.35); cursor: pointer; transition: background .2s ease; }
.lightbox-close:hover, .lightbox-arrow:hover { background: var(--burgundy); }
.lightbox-close { width: 44px; height: 44px; top: 24px; right: 24px; }
.lightbox-arrow { width: 48px; height: 48px; border-radius: 50%; top: calc(50% - 24px); }
.lightbox-prev { left: 25px; }
.lightbox-next { right: 25px; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 900px) { .content-width { width: min(100% - 40px, 650px); } .site-header { padding: 0 20px; height: 74px; } .menu-toggle { display: block; z-index: 22; } .main-nav { position: absolute; inset: 0 0 auto; top: 0; padding: 90px 28px 28px; background: var(--charcoal); display: none; flex-direction: column; align-items: stretch; gap: 0; font-size: 16px; } .menu-is-open .main-nav { display: flex; } .main-nav a { padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.1); } .main-nav .nav-call { justify-content: center; margin-top: 20px; border-color: var(--gold); color: var(--gold); } .hero { min-height: 730px; height: auto; } .hero-image { background-position: 62% center; } .hero-content { padding-top: 145px; padding-bottom: 90px; } .hero-trust { margin-top: 58px; flex-wrap: wrap; gap: 9px; } .hero-side-note { display: none; } .section-padding { padding: 92px 0; } .about-grid, .review-layout, .contact-layout { grid-template-columns: 1fr; gap: 52px; } .about-photo-wrap { height: 450px; } .benefits-grid { margin-top: 75px; } .services-grid { grid-template-columns: repeat(2, 1fr); } .service-image { height: 210px; } .service-banner { align-items: flex-start; flex-direction: column; padding: 34px 28px; } .banner-action { text-align: left; } .gallery-stage { height: min(70vw, 560px); min-height: 350px; } .review-layout { gap: 30px; } .floating-call { display: flex; } }
@media (max-width: 520px) { .content-width { width: calc(100% - 40px); } .hero { min-height: 700px; } h1 { font-size: 42px; } .hero-lead { font-size: 13px; } .hero-actions { flex-direction: column; align-items: stretch; max-width: 290px; } .hero-actions .button { width: 100%; } .hero-trust { font-size: 9px; } .about-photo-wrap { height: 370px; } .benefits-grid { grid-template-columns: 1fr; gap: 24px; } .benefit p { max-width: none; margin-bottom: 0; } .services-grid { grid-template-columns: 1fr; } .service-image { height: 230px; } .gallery-heading { display: block; } .gallery-heading > p { margin-top: 20px; } .gallery-stage { height: 72vw; min-height: 240px; } .gallery-stage-caption { padding: 55px 17px 18px; } .gallery-stage-caption button { width: 39px; height: 39px; } .gallery-controls { align-items: flex-start; } .gallery-thumbnails { gap: 6px; } .gallery-thumbnails button { width: 58px; height: 44px; } .review-photo { height: 380px; } .review-card { padding: 43px 26px 32px; box-shadow: 8px 8px 0 #e1d8c9; } .review-card > p { font-size: 14px; } .contact-layout { gap: 35px; } .contact-item strong { font-size: 17px; } .lightbox { padding: 60px 20px; } .lightbox-arrow { top: auto; bottom: 58px; } .lightbox-prev { left: calc(50% - 58px); } .lightbox-next { right: calc(50% - 58px); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }