
:root{
  --bg:#EAE3D6;
  --paper:#F6F1E8;
  --ink:#3E2F25;
  --muted:#7A6A5F;
  --accent:#5E6B4A;
  --accent-dark:#3F4A34;
  --line:#D6C7B2;
  --shadow:0 16px 40px rgba(40,25,12,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:#EAE3D6;
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.6;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; justify-content:space-between; align-items:center; gap:24px;
  padding:18px 24px; background:rgba(251,247,242,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(112,95,83,.12);
}
.brand-wrap{display:flex; align-items:center; gap:16px}
.logo-slot{
  width:120px; height:120px; border-radius:0px; border:1px solid var(--line);
  background:#fff; display:grid; place-items:center; overflow:hidden; box-shadow:var(--shadow);
}
.logo-slot.small{width:62px;height:62px}
.logo-slot img{width:100%; height:100%; object-fit:cover; object-position:center}
.logo-slot.missing::before{
  content:"Logo";
  color:var(--muted); font-size:14px;
}
.eyebrow,.section-label,.hero-kicker{
  text-transform:uppercase; letter-spacing:.14em; font-size:.78rem; color:var(--muted); font-weight:700;
}
h1,h2,h3,h4{
  font-family:'Cormorant Garamond',serif;
  line-height:1.02; margin:0 0 8px;
}
h1{font-size:clamp(2rem,4vw,3rem)}
h2{font-size:clamp(2.2rem,5vw,4rem)}
h3{font-size:clamp(2rem,4vw,3rem)}
h4{font-size:1.8rem}
.top-actions{display:flex; align-items:center; gap:14px}
.lang-toggle{
  display:flex; background:#fff; border:1px solid var(--line); border-radius:999px; padding:4px;
}
.lang-btn{
  border:none; background:transparent; padding:8px 12px; border-radius:999px; font-weight:700; cursor:pointer;
}
.lang-btn.active{background:var(--ink); color:#fff}
.phone-link{
  background:var(--accent); color:#fff; padding:12px 16px; border-radius:999px; font-weight:700;
}
.hero{
  position:relative; min-height:86vh; display:grid; align-items:end;
}
.hero-image{position:absolute; inset:0; overflow:hidden}
.hero-image img{width:100%; height:100%; object-fit:cover}
.hero-image.placeholder{
  background:
    linear-gradient(180deg,rgba(26,23,20,.18),rgba(26,23,20,.48)),
    radial-gradient(circle at 20% 20%,#9db39b 0%, #7d8f76 32%, #6b5f46 100%);
}
.hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg,rgba(30,25,20,.15),rgba(30,25,20,.55))}
.hero-card{
  position:relative; margin:0 24px 28px; max-width:780px;
  background:rgba(251,247,242,.92); border:1px solid rgba(255,255,255,.4);
  padding:28px; border-radius:28px; box-shadow:var(--shadow);
}
.hero-kicker{color:var(--accent-dark)}
.hero-copy{max-width:58ch}
.hero-buttons{display:flex; flex-wrap:wrap; gap:12px; margin-top:18px}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:180px; padding:14px 20px; border-radius:999px; font-weight:700;
}
.btn-primary{background:var(--accent); color:#fff}
.btn-secondary{background:#fff; border:1px solid var(--line)}
.section{padding:72px 24px}
.alt{background:rgba(255,255,255,.42)}
.section-heading{max-width:820px; margin:0 auto 28px}
.intro-grid{
  max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:26px; align-items:center;
}
.copy-card,.cta-box,.collection-card{
  background:var(--paper); border:1px solid var(--line); border-radius:28px; padding:28px; box-shadow:var(--shadow);
}
.feature-image{
  border-radius:28px; overflow:hidden; min-height:320px; background:#e8ddd0; border:1px solid var(--line);
}
.feature-image img{width:100%; height:100%; object-fit:cover}
.feature-image.placeholder::before{
  content:"Add image here";
  height:100%; display:grid; place-items:center; color:var(--muted)
}
.room-grid{
  max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:22px;
}
.room-card{
  background:var(--paper); border-radius:24px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow)
}
.room-card img{height:280px; width:100%; object-fit:cover; background:#e8ddd0}
.room-copy{padding:18px 18px 22px}
.mosaic{
  max-width:1180px; margin:0 auto; display:grid; gap:14px;
  grid-template-columns:repeat(12,1fr);
}
.mosaic img{
  width:100%; height:100%; object-fit:cover; border-radius:22px; border:1px solid var(--line); min-height:180px;
}
.mosaic img:nth-child(1){grid-column:span 4; grid-row:span 2}
.mosaic img:nth-child(2){grid-column:span 3}
.mosaic img:nth-child(3){grid-column:span 5}
.mosaic img:nth-child(4){grid-column:span 5}
.mosaic img:nth-child(5){grid-column:span 4}
.mosaic img:nth-child(6){grid-column:span 3}
.collection-card{
  max-width:980px; margin:0 auto; display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center;
}
.cta-box{
  max-width:820px; margin:0 auto; text-align:center
}
.footer{
  padding:32px 24px 44px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; max-width:1180px; margin:0 auto;
}
@media (max-width: 900px){
  .intro-grid,.room-grid{grid-template-columns:1fr}
  .mosaic{grid-template-columns:repeat(2,1fr)}
  .mosaic img,.mosaic img:nth-child(n){grid-column:auto; grid-row:auto}
  .topbar{align-items:flex-start; flex-direction:column}
  .top-actions{width:100%; justify-content:space-between}
}
@media (max-width: 600px){
  .hero-card{margin:0 14px 16px; padding:20px}
  .section{padding:56px 14px}
  .btn{min-width:unset; width:100%}
  .phone-link{padding:10px 14px}
  .logo-slot{width:60px;height:60px}
  .mosaic{grid-template-columns:1fr}
}
