:root{
          --accent:#0070a3; /* bluish accent similar to municipal sites */
          --dark:#0b2b3a;
          --muted:#6b7280;
          --card:#ffffff;
          --bg:#f5f7f9;
          --max-width:1200px;
          color-scheme: light;
          font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, "Helvetica Neue", Arial;
        }
        *{box-sizing:border-box}
        body{margin:0;background:var(--bg);color:#0b2b3a;line-height:1.5}
        .container{max-width:var(--max-width);margin:0 auto;padding:0 16px}

        /* Top header */
        header.site-header{background:linear-gradient(180deg,var(--dark),#12323f);color:#fff}
        .topbar{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
        .branding{display:flex;align-items:center;gap:12px}
        .branding img{width:54px;height:54px;object-fit:cover;border-radius:6px;background:#fff}
        .branding h1{font-family:'Roboto Slab', serif;font-size:18px;margin:0}
        nav.main-nav{margin-top:6px}
        .nav-list{display:flex;gap:14px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
        .nav-list a{color:#e6f7ff;text-decoration:none;padding:8px 10px;border-radius:6px;font-weight:600}
        .nav-list a:hover{background:rgba(255,255,255,0.06)}

        /* hero */
        .hero{position:relative;padding:28px 0}
        .hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px;align-items:start}
        .hero-card{background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));padding:20px;border-radius:10px;min-height:220px;color:#fff}
        .hero-card h2{margin:0 0 6px;font-size:22px}
        .hero-carousel{height:220px;border-radius:10px;overflow:hidden;background-size:cover;background-position:center}
        .services-grid{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}
        .service{background:var(--card);padding:12px;border-radius:8px;min-width:120px;flex:1;box-shadow:0 8px 18px rgba(8,20,24,0.06);text-align:center}
        .service small{display:block;color:var(--muted)}

        /* main content */
        main{padding:20px 0}
        .card{background:var(--card);padding:18px;border-radius:10px;box-shadow:0 6px 18px rgba(11,43,58,0.06)}
        .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
        .news-item{display:flex;gap:12px}
        .news-thumb{width:110px;height:70px;background:#ddd;border-radius:6px;flex-shrink:0}

        /* sidebar */
        .sidebar .list{display:flex;flex-direction:column;gap:10px}
        .event{background:#fff;padding:10px;border-radius:8px;border-left:4px solid var(--accent)}

        /* footer */
        footer{margin-top:26px;background:#0f1720;color:#e6eef2;padding:18px 0}
        footer .cols{display:grid;grid-template-columns:1fr 220px 220px;gap:18px}
        .contacts small{display:block;color:var(--muted)}

        /* cookie banner */
        .cookie{position:fixed;right:18px;bottom:18px;background:var(--card);padding:14px;border-radius:10px;box-shadow:0 10px 30px rgba(2,6,23,0.12);max-width:360px;z-index:80}
        .cookie button{background:var(--accent);color:#fff;border:0;padding:8px 10px;border-radius:6px}

        /* responsive */
        @media (max-width:900px){
          .hero-grid{grid-template-columns:1fr}
          .grid-3{grid-template-columns:1fr}
          footer .cols{grid-template-columns:1fr}
          .nav-list{display:none}
        }