:root { --brand:#10b981; --brand2:#06b6d4; --ink:#111827; --muted:#6b7280; }
* { box-sizing: border-box; }
body { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial; margin:0; color:var(--ink); }
header { position: sticky; top:0; background: rgba(255,255,255,.9); backdrop-filter: blur(6px); border-bottom:1px solid #e5e7eb; }
.container { max-width: 1100px; margin: 0 auto; padding: 16px; }
.logo { display:flex; align-items:center; gap:10px; font-weight: 800; }
.badge { font-size:12px; color:#4b5563; }
nav a { margin-right:14px; text-decoration:none; color:#111827; }
nav a:hover { color: var(--brand); }
.btn { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:12px; text-decoration:none; }
.btn.primary { background: var(--brand); color:white; }
.btn.outline { border:1px solid #d1d5db; color:#111827; }
.hero { background: linear-gradient(135deg,#ecfdf5, #f0f9ff); }
h1 { font-size: 40px; margin: 8px 0; }
h2 { font-size: 30px; margin: 0 0 16px; }
.grid { display:grid; gap:16px; }
.grid.cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid.cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.card { border:1px solid #e5e7eb; border-radius:16px; background:white; padding:16px;}
.gallery img { width:100%; height:190px; object-fit:cover; display:block; }
.tag { border:1px solid #e5e7eb; border-radius:999px; padding:6px 10px; font-size: 14px; background:white; }
footer { border-top:1px solid #e5e7eb; color:#4b5563; }
small { color:#6b7280; }
label { font-size: 14px; color:#374151; display:block; margin-bottom:6px; }
input, textarea { width:100%; border:1px solid #e5e7eb; border-radius:12px; padding:10px 12px; }
section { padding: 56px 0; }
.lang { border:1px solid #d1d5db; padding:8px 12px; border-radius:999px; background:white; }
.badge-star { color:#f59e0b; }
@media (max-width:800px){ .grid.cols-2, .grid.cols-3 { grid-template-columns: 1fr; } .gallery img{height:160px;} }