@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:wght@500;600&display=swap');

:root{
  --ink:#24302d; --muted:#65706c; --paper:#f7f5ef; --cream:#ece8dc;
  --accent:#526b63; --line:#d9d6cc; --white:#fffdf8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"DM Sans",sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}
.site-header{height:76px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;background:rgba(247,245,239,.95);position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line)}
.brand{font-weight:600;letter-spacing:.01em}.brand span{font-weight:400;color:var(--muted);margin-left:7px;font-size:.82em}
nav{display:flex;gap:30px;font-size:.9rem}nav a:hover,.text-link:hover{color:var(--accent)}
.menu{display:none;background:none;border:0;font:inherit}
.hero{min-height:82vh;display:flex;align-items:center;padding:9vw 10vw;position:relative;overflow:hidden;background:url("hero-lake.jpg") center 58%/cover no-repeat}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.83) 42%,rgba(247,245,239,.20) 72%,rgba(247,245,239,.05) 100%)}
.hero-copy{max-width:780px;position:relative;z-index:1}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:600;color:var(--accent);margin:0 0 18px}
h1,h2{font-family:"Playfair Display",serif;font-weight:500;line-height:1.12;margin:0 0 24px}
h1{font-size:clamp(3rem,6.2vw,6.2rem);max-width:900px}
h2{font-size:clamp(2.1rem,4vw,4rem)}
h3{font-size:1.2rem;margin:0 0 9px}
.lead{font-size:1.2rem;max-width:680px;color:var(--muted)}
.actions{display:flex;gap:25px;align-items:center;margin-top:35px}
.button{display:inline-block;background:var(--accent);color:white;padding:14px 21px;border-radius:3px;font-size:.92rem}
.button:hover{opacity:.88}.text-link{border-bottom:1px solid currentColor;padding-bottom:3px}
.intro,.about-section,.services,.sleep,.contact{padding:110px 10vw}
.intro{max-width:1100px}.intro h2{max-width:920px}
.intro>p:last-child{max-width:720px;color:var(--muted);font-size:1.08rem}
.about-section{display:grid;grid-template-columns:minmax(280px,.9fr) 1.1fr;gap:8vw;align-items:center;background:var(--cream)}
.about-photo-wrap{position:relative}
.about-photo{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 45%;display:block;border-radius:2px;box-shadow:0 18px 50px rgba(36,48,45,.13)}
.about-copy p{color:var(--muted);font-size:1.02rem}
.services{background:var(--white)}.section-heading{max-width:700px;margin-bottom:45px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.cards article{background:var(--white);padding:32px;min-height:190px}.cards p{color:var(--muted);margin:0}
.sleep{background:#e2e9e3;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}
.sleep-image{min-height:520px;background:linear-gradient(rgba(20,35,42,.22),rgba(20,35,42,.38)),url("hero-lake.jpg") center 72%/cover no-repeat;filter:saturate(.72) brightness(.78);border-radius:2px}
.sleep-copy{max-width:650px}
.sleep p{color:#53615c}.sleep .text-link{display:inline-block;margin-top:10px}
.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:9vw;align-items:center}
.contact>div:first-child p:last-child{color:var(--muted);max-width:650px}
.contact-card{background:var(--white);padding:40px;border:1px solid var(--line)}
.contact-card p{color:var(--muted)}.contact-card small{display:block;color:var(--muted);font-size:.75rem;margin-top:16px}
footer{padding:40px 6vw;display:flex;justify-content:space-between;gap:30px;border-top:1px solid var(--line);color:var(--muted);font-size:.82rem}
@media(max-width:800px){
 nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--paper);padding:20px 6vw;flex-direction:column;gap:15px;border-bottom:1px solid var(--line)}
 nav.open{display:flex}.menu{display:block}
 .hero{min-height:70vh;padding:70px 7vw}h1{font-size:3.3rem}
 .intro,.about-section,.services,.sleep,.contact{padding:75px 7vw}
 .about-section,.sleep,.contact{grid-template-columns:1fr;gap:35px}
 .about-photo{aspect-ratio:5/4;object-position:50% 42%}
 .sleep-image{min-height:360px}
 .cards{grid-template-columns:1fr}
 footer{flex-direction:column;padding:35px 7vw}
}

.contact-email{margin-top:18px;font-size:.9rem}
