
:root{
  --brand:#6b4c3b;            /* From logo tone (brown) */
  --brand-2:#b08a6c;          /* Accent (gold-beige) */
  --ink:#2b2b2b;
  --bg:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;color:var(--ink);background:var(--bg);scroll-behavior:smooth}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1120px;margin:0 auto;padding:0 16px}
.header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.nav{display:flex;gap:24px;align-items:center;justify-content:space-between;padding:10px 0}
.logo{display:flex;align-items:center;gap:12px}
.logo img{width:44px;height:44px;border-radius:10px;object-fit:cover}
.brand{font-weight:800;letter-spacing:.3px}
.badge{display:inline-block;background:var(--brand);color:#fff;padding:2px 8px;border-radius:999px;font-size:12px;margin-left:8px}
.cta{background:var(--brand);color:#fff;border:none;padding:10px 16px;border-radius:10px;font-weight:600;cursor:pointer}
.cta.alt{background:#fff;color:var(--brand);border:2px solid var(--brand)}
.menu{display:flex;gap:18px;align-items:center}
.menu a{font-weight:600;color:#333}
.menu-toggle{display:none;background:transparent;border:none;font-size:28px}

.hero{position:relative;overflow:hidden}
.slider{position:relative;height:68vh;min-height:420px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 800ms ease}
.slide.active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.45))}
.hero-content{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;color:#fff;padding:0 16px}
.hero h1{font-size:clamp(28px,5vw,48px);margin:0 0 8px;font-weight:800}
.hero p{max-width:780px;margin:0 auto 20px;line-height:1.5}
.hero .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.section{padding:56px 0}
.section h2{font-size:clamp(24px,3.5vw,36px);margin:0 0 16px}
.section .lead{color:#555;max-width:860px}

.grid{display:grid;gap:18px}
.grid.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:#fff;border:1px solid #eee;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.card img{width:100%;height:180px;object-fit:cover}
.card .p{padding:14px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{background:#f1ebe6;color:#5d4738;border:1px solid #e6d9cc;padding:6px 10px;border-radius:999px;font-size:12px}

.split{display:grid;gap:22px;grid-template-columns:1.15fr .85fr;align-items:center}
.split img{width:100%;border-radius:16px}
.video{position:relative;padding-top:56.25%;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.video iframe{position:absolute;inset:0;width:100%;height:100%}

.gallery{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.gallery img{width:100%;height:160px;object-fit:cover;border-radius:10px}

.contact{display:grid;gap:24px;grid-template-columns:1.1fr .9fr}
form{display:grid;gap:12px}
input,textarea{width:100%;padding:12px;border:1px solid #ddd;border-radius:10px;font-size:16px}
textarea{min-height:120px;resize:vertical}

.fb-embed{border-radius:16px;overflow:hidden;height:420px;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.06)}

.footer{background:#111;color:#eee;padding:28px 0;margin-top:40px}
.footer a{color:#fff;opacity:.9}
.footer small{opacity:.7}

.whatsapp{position:fixed;right:18px;bottom:18px;background:#25D366;color:#fff;width:56px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 10px 24px rgba(0,0,0,.2);z-index:60}

@media (max-width:900px){
  .split,.contact{grid-template-columns:1fr}
  .slider{height:60vh}
  .menu{display:none}
  .menu.open{display:flex;flex-direction:column;gap:12px;padding-bottom:12px}
  .menu-toggle{display:block}
}
