:root { --ink:#1d2020; --cream:#f6f2ed; --paper:#fffdfa; --pink:#e2b4b0; --coral:#d87669; --muted:#74716d; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:"DM Sans",sans-serif; } a { color:inherit; text-decoration:none; } .announcement { background:var(--ink); color:var(--paper); text-align:center; font:11px "DM Mono",monospace; letter-spacing:.09em; padding:11px; text-transform:uppercase; } .announcement span { color:var(--pink); padding:0 9px; }
body { transition:opacity .22s ease; } body.is-leaving-page { opacity:0; }
header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 5.5vw; border-bottom:1px solid #e9e4df; } .logo { font-size:24px; font-weight:600; letter-spacing:-.09em; } .logo span { color:var(--coral); font-size:9px; vertical-align:top; margin-left:3px; } nav { display:flex; align-items:center; gap:33px; font-size:13px; } nav a:not(.nav-book) { transition:color .2s; } nav a:hover { color:var(--coral); }.nav-book { border:1px solid var(--ink); padding:11px 16px; } .menu-toggle { display:none; border:0; background:transparent; font:12px "DM Mono",monospace; text-transform:uppercase; }
.hero { min-height:620px; display:grid; grid-template-columns:1.12fr .88fr; background:var(--cream); } .hero-copy { padding:clamp(60px,10vw,140px) 7vw; display:flex; flex-direction:column; justify-content:center; } .eyebrow { text-transform:uppercase; letter-spacing:.13em; font:11px "DM Mono",monospace; margin:0 0 22px; color:#625e5a; } h1,h2 { font:500 clamp(48px,6.3vw,94px)/.98 "Playfair Display",serif; letter-spacing:-.06em; margin:0; } h1 em,h2 em { font-weight:500; } .intro { font-size:16px; line-height:1.65; max-width:410px; margin:31px 0; color:#55514d; } .hero-actions { display:flex; align-items:center; gap:28px; flex-wrap:wrap; }.button { display:inline-flex; align-items:center; gap:29px; width:max-content; text-transform:uppercase; letter-spacing:.09em; font:11px "DM Mono",monospace; padding:17px 19px; transition:transform .2s; }.button:hover { transform:translateY(-3px); }.button-dark { color:white; background:var(--ink); }.button-light { color:var(--ink); background:var(--paper); }.button span { font-size:16px; }.text-link { font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:6px; }.text-link span { margin-left:8px; }
.hero-art { position:relative; overflow:hidden; background:var(--pink); min-height:500px; }.sun { position:absolute; width:74%; aspect-ratio:1; border-radius:50%; background:#f7d8bf; top:11%; left:12%; }.arch { position:absolute; border:1px solid rgba(255,253,250,.67); border-bottom:0; border-radius:300px 300px 0 0; }.arch-one { width:53%; height:72%; bottom:0; left:12%; }.arch-two { width:37%; height:51%; bottom:0; left:20%; }.hero-art p { z-index:1; position:absolute; color:var(--paper); bottom:9%; left:9%; font:500 clamp(32px,4.2vw,60px)/.87 "Playfair Display",serif; letter-spacing:-.06em; }.hero-art p i { color:var(--ink); }.hero-art small { z-index:1; position:absolute; right:7%; bottom:6%; font:10px "DM Mono",monospace; letter-spacing:.12em; }
.strip { display:flex; justify-content:space-around; align-items:center; padding:21px 4%; background:var(--coral); color:white; font:12px "DM Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }.strip i { font-style:normal; color:#f8d7ce; }
.services { padding:130px 7vw 110px; }.section-heading { display:grid; grid-template-columns:1.2fr 1fr; gap:22px; align-items:end; margin-bottom:64px; }.section-heading .eyebrow { grid-column:1/-1; }.section-heading h2 { font-size:clamp(44px,5vw,74px); }.section-heading > p:last-child { max-width:360px; line-height:1.65; color:var(--muted); }.service-list { border-top:1px solid #d9d4ce; }.service { display:grid; grid-template-columns:75px 1fr auto; gap:25px; align-items:center; padding:27px 0; border-bottom:1px solid #d9d4ce; transition:background .2s, padding .2s; }.service:hover { background:#f2e7e1; padding-left:16px; padding-right:16px; }.service-number { font:11px "DM Mono",monospace; color:var(--coral); }.service h3 { margin:0 0 7px; font:500 27px "Playfair Display",serif; letter-spacing:-.04em; }.service p { margin:0; color:var(--muted); font-size:14px; }.service-meta { text-align:right; font-size:13px; display:flex; flex-direction:column; gap:6px; }.service-meta strong { font-weight:500; }.service-meta span { font:10px "DM Mono",monospace; color:var(--muted); text-transform:uppercase; }.all-services { display:inline-block; margin-top:30px; }
.gallery { background:#e9c3bd; padding:113px 7vw 92px; }.gallery-heading h2 { font-size:clamp(44px,5vw,74px); }.gallery-grid { display:grid; grid-template-columns:1.18fr .82fr 1fr; gap:16px; margin-top:57px; }.gallery-card { min-height:355px; position:relative; display:flex; align-items:end; padding:20px; color:white; font:500 25px/1 "Playfair Display",serif; }.gallery-card:after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 40%,rgba(0,0,0,.28)); }.gallery-card span { z-index:1; }.card-one { background:#5c443d; }.card-two { background:#ab7267; margin-top:55px; }.card-three { background:#786d66; }.gallery-note { max-width:400px; font-size:13px; line-height:1.6; color:#51423e; margin:37px 0 0 auto; text-align:right; }
.gallery-card video,.gallery-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }.gallery-card.card-three img { object-position:center 42%; }.gallery-card:has(video):after { display:none; }
.about { display:grid; grid-template-columns:.45fr 1.45fr 1fr; gap:30px; align-items:center; padding:120px 7vw; }.about-mark { font:500 200px/.65 "Playfair Display",serif; color:var(--coral); }.about h2 { font-size:clamp(37px,4.2vw,63px); }.about-copy { color:var(--muted); line-height:1.7; max-width:335px; }.booking { text-align:center; background:var(--ink); color:var(--paper); padding:115px 20px; }.booking .eyebrow { color:#e5bbb5; }.booking h2 { font-size:clamp(47px,6vw,85px); }.booking > p:not(.eyebrow) { color:#ccc7c1; margin:25px auto 31px; line-height:1.6; }.booking .button { margin:auto; }
footer { display:grid; grid-template-columns:2fr 1fr 1fr; gap:30px; padding:53px 5.5vw 23px; background:var(--cream); }footer div p { margin:0 0 7px; text-transform:uppercase; font:10px "DM Mono",monospace; letter-spacing:.1em; color:var(--muted); } footer div a { font-size:14px; } footer small { grid-column:1/-1; padding-top:35px; font:10px "DM Mono",monospace; color:var(--muted); }
@media (max-width:700px) { header { height:72px; padding:0 6vw; }.menu-toggle { display:block; } nav { display:none; position:absolute; z-index:5; top:112px; left:0; right:0; padding:27px 6vw; background:var(--paper); flex-direction:column; align-items:flex-start; border-bottom:1px solid #ddd; } nav.open { display:flex; }.hero { grid-template-columns:1fr; }.hero-copy { min-height:490px; padding:70px 8vw; }.hero-art { min-height:370px; }.section-heading { grid-template-columns:1fr; }.services,.gallery { padding:80px 7vw; }.service { grid-template-columns:35px 1fr; gap:12px; }.service-meta { grid-column:2; text-align:left; flex-direction:row; align-items:center; }.service-meta span:before { content:"• "; }.gallery-grid { grid-template-columns:1fr 1fr; }.gallery-card { min-height:240px; }.card-one { grid-column:1/-1; }.card-two { margin-top:0; }.about { grid-template-columns:1fr; padding:85px 7vw; }.about-mark { font-size:120px; }.strip span:nth-of-type(n+4), .strip i:nth-of-type(n+3) { display:none; } footer { grid-template-columns:1fr 1fr; }.logo { grid-column:1/-1; }.intro { font-size:15px; } }
