:root{
  --sage:#A6B8A2;
  --terracotta:#C98A64;
  --ivory:#F9F8F5;
  --charcoal:#3D3D3D;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji','Segoe UI Emoji';
  color:var(--charcoal); background:var(--ivory); line-height:1.6;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--charcoal); text-decoration:none}
a:hover{opacity:.85}
.container{max-width:1100px; margin:0 auto; padding:0 20px}
.header{
  position:sticky; top:0; z-index:10; background:rgba(249,248,245,.9); backdrop-filter: blur(8px); border-bottom:1px solid #e7e3d9;
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 0}
.brand{display:flex; align-items:center; gap:10px}
.brand-logo{
  width:28px; height:28px;
}
.brand-name{font-family:'Playfair Display', serif; letter-spacing:.18em; font-size:20px}
.brand-accent{font-family:'Playfair Display', serif}
.menu{display:flex; gap:18px; flex-wrap:wrap}
.menu a{padding:6px 8px; border-radius:8px}
.menu a.active, .menu a:focus{background:#ece8df}
.btn{
  display:inline-block; padding:12px 18px; border-radius:12px; border:1px solid var(--charcoal);
  transition:.2s; font-weight:500
}
.btn-primary{background:var(--charcoal); color:white; border-color:var(--charcoal)}
.btn-primary:hover{transform:translateY(-1px)}
.btn-ghost{background:transparent}
.hero{
  padding:72px 0 36px; border-bottom:1px solid #e7e3d9;
}
.hero .title{font-family:'Playfair Display', serif; font-size:40px; line-height:1.2; margin:0 0 12px}
.hero .subtitle{color:#5A5A5A; max-width:740px}
.badge{display:inline-block; background:var(--sage); color:white; padding:6px 10px; border-radius:999px; font-size:12px; letter-spacing:.06em}
.grid{display:grid; gap:22px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:880px){.grid-2,.grid-3{grid-template-columns:1fr} .hero .title{font-size:32px}}
.card{
  background:white; border-radius:18px; padding:18px; border:1px solid #ece8df; box-shadow: 0 1px 0 rgba(0,0,0,.03);
}
.section{padding:56px 0}
.section h2{font-family:'Playfair Display', serif; margin:0 0 18px; font-size:28px}
.pill{display:inline-block; padding:6px 10px; background:#ece8df; border-radius:999px; font-size:12px}
.kicker{color:var(--terracotta); font-weight:600; letter-spacing:.12em; text-transform:uppercase; font-size:12px}
.footer{border-top:1px solid #e7e3d9; padding:28px 0; margin-top:40px; color:#666}
.list{margin:0; padding:0; list-style:none}
input, textarea{
  width:100%; padding:12px 14px; border:1px solid #ddd6c8; border-radius:12px; background:#fff;
}
form .row{display:grid; gap:16px; grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:720px){form .row{grid-template-columns:1fr}}
label{display:block; font-size:14px; margin:6px 0}
hr.line{border:0; border-top:1px solid #e7e3d9; margin:24px 0}
.small{font-size:13px; color:#6a6a6a}
.hero-img{border-radius:20px; overflow:hidden; border:1px solid #ece8df}
.color-sample{height:36px; border-radius:10px; border:1px solid #e7e3d9}
blockquote{
  margin:0; padding:18px; border-left:4px solid var(--sage); background:#f4f2ee; border-radius:0 12px 12px 0; font-style:italic
}

.lang-switch{display:flex; gap:10px; align-items:center}
.lang-switch a{font-size:12px; padding:6px 8px; background:#ece8df; border-radius:999px}
.lang-switch a.active{background:#A6B8A2; color:#fff}