@charset "UTF-8";

/* Simple, clean municipal site stylesheet (restored initial) */

* { box-sizing: border-box; margin:0; padding:0; }
html,body{ height:100%; }
body{
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Arial', sans-serif;
  background:#f6f7fb; color:#1a1a1a; -webkit-font-smoothing:antialiased;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; height:auto; display:block }

#wrap{ max-width:1200px; margin:0 auto; padding:1rem; }

/* Header */
.site-header{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.site-brand h1{ font-size:1.25rem; color:#0b5aa6 }
.tagline{ font-size:.9rem; color:#23456f }

/* nav */
nav ul{ list-style:none; display:flex; gap:1rem; align-items:center }
nav ul li a{ display:block; padding:.5rem .75rem; color:#0b5aa6; font-weight:600 }

/* hero */
.hero{ width:100%; border-radius:8px; overflow:hidden; margin-top:1rem; }
.hero img{ width:100%; height:320px; object-fit:cover }
.hero-overlay{ position:relative; padding:.75rem }
.hero-title{ font-size:1.6rem; color:#073a6b }

/* sections */
.announcements, .quick-links, .gallery{ margin-top:1rem }
.announcements{ background:#fff; padding:1rem; border-radius:8px; box-shadow:0 1px 4px rgba(0,0,0,0.06) }
.quick-links .grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:.75rem }
.card{ background:#fff; padding:1rem; border-radius:6px; text-align:center; color:#073a6b }

.container{ display:grid; grid-template-columns: 1fr; gap:12px; margin-top:.5rem }

footer{ margin-top:1.25rem; padding:1rem 0; text-align:center; background:#022b54; color:#dfeffb }

/* responsive nav: hide hamburger on wide screens */
#navBtn{ display:none }
.open{ display:none }

@media (max-width: 767px){
  .site-header{ align-items:flex-start }
  nav{ position:fixed; right:0; top:0; height:100vh; width:260px; transform:translateX(100%); background:#074a86; padding-top:3.5rem; transition:transform .3s ease; z-index:1200 }
  nav ul{ flex-direction:column; padding:0 1rem }
  nav ul li a{ color:#fff }
  /* show hamburger */
  .open{ display:block; position:fixed; top:12px; right:12px; z-index:1300; width:44px; height:36px; background:rgba(0,0,0,0.12); border-radius:6px; padding:6px }
  .open svg{ width:100%; height:100% }
  #navBtn:checked ~ nav{ transform:translateX(0) }
}
