
:root{ --bg:#fff; --fg:#111; --muted:#555; --line:#e9e9e9; --accent:#000; --hover:#f0f0f0; --shadow:0 1px 2px rgba(0,0,0,.05); }
*{box-sizing:border-box} html,body{height:100%}
body{margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial; background:var(--bg); color:var(--fg); line-height:1.6}
.container{max-width:1120px; margin:0 auto; padding:20px}
.header{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line); position:sticky; top:0; background:#fff; z-index:10}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit}
.brand img{width:56px; height:56px; object-fit:contain}
.brand .title{font-weight:800; text-transform:uppercase; letter-spacing:.4px}
.nav{display:flex; gap:8px; flex-wrap:wrap}
.nav a{color:var(--fg); text-decoration:none; padding:8px 12px; border-radius:8px}
.nav a:hover,.nav a:focus{background:var(--hover)}
.nav .nav-cta{border:2px solid #000; border-radius:10px; font-weight:700}
.nav .nav-cta:hover,.nav .nav-cta:focus{background:#000; color:#fff}
.hero{padding:64px 16px; text-align:center}
.hero h1{font-size:clamp(28px,5vw,48px); margin:0 0 10px}
.hero p{color:var(--muted); margin:0 auto 22px; max-width:70ch}
.cta,.btn{display:inline-block; padding:12px 18px; border:2px solid #000; color:#000; text-decoration:none; border-radius:10px; font-weight:700}
.cta:hover,.btn:hover,.cta:focus,.btn:focus{background:#000; color:#fff}
.section{padding:36px 0; border-top:1px solid var(--line)}
.grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:18px}
.card{border:1px solid #eaeaea; border-radius:12px; padding:18px; background:#fff; box-shadow:var(--shadow)}
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:10px 12px; border:1px solid var(--line); text-align:left}
.table tr:hover{background:var(--hover)}
.gallery{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:10px}
.gallery img{width:100%; height:160px; object-fit:cover; border:1px solid var(--line); border-radius:8px}
.footer{border-top:1px solid var(--line); padding:24px 0; color:var(--muted); font-size:14px; display:flex; align-items:center; justify-content:space-between; gap:12px}
.footer a{color:var(--fg); text-decoration:none}
.footer a:hover{text-decoration:underline}
.input, textarea, select{width:100%; padding:10px; border:1px solid #ccc; border-radius:8px}
/* Google Maps responsive */
.map-wrap{position:relative; padding-top:56.25%; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fafafa}
.map-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
