/* styles.css */
/* Reset */
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }

/* Body flex */
body { display:flex; flex-direction:column; background:#dfdede; padding:0 10px; font-family:Arial,sans-serif; color:#333; line-height:1.6; }

/* Wrapper */
.wrapper { width:960px; max-width:95%; margin:0 auto; background:#fff; box-shadow:0 0 20px rgba(0,0,0,0.1); padding:20px 40px; display:flex; flex-direction:column; flex:1; min-height:100vh; }

/* Header */
header { background:#b62c2c; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:15px 0; position:relative; }
.nav-toggle { display:none; font-size:24px; background:none; border:none; cursor:pointer; }

/* Navigation */
nav.nav-menu { display:flex; }
nav.nav-menu ul { list-style:none; display:flex; width:100%; justify-content:center; }
nav.nav-menu ul li + li { margin-left:20px; }
nav.nav-menu ul li a { color:#000; text-decoration:none; padding:8px 12px; transition:background-color .3s, color .3s; }
nav.nav-menu ul li a:hover, nav.nav-menu ul li a.active { background:#cfcfcf; color:#000; border-radius:3px; }

/* Main */
main { padding:30px 0; flex:1; }
main section { padding:0 20px; }
h1 { font-size:32px; margin-bottom:15px; }
h2 { font-size:24px; margin:25px 0 10px; }
p, ul { margin-bottom:20px; }
.contact-list li { margin-bottom:8px; }

/* Footer */
footer { background:#b62c2c; padding:15px 0; text-align:center; font-size:14px; }
.footer-inner p { color:#000; }

/* Mobile */
@media(max-width:768px) {
  .wrapper { width:100%; max-width:100%; padding:15px 20px; }
  main section { padding:0 10px; }
  .nav-toggle { display:block; }
  nav.nav-menu { display:none; flex-direction:column; position:absolute; top:100%; left:0; width:100%; background:#fff; box-shadow:0 2px 5px rgba(0,0,0,0.1); }
  .wrapper.nav-open nav.nav-menu { display:flex; }
  nav.nav-menu ul { flex-direction:column; padding:20px; }
  nav.nav-menu ul li + li { margin:15px 0 0; }
}

/* Desktop center nav */
@media(min-width:769px) {
  .header-inner { justify-content:center; }
  .nav-toggle { display:none !important; }
  nav.nav-menu { display:flex !important; position:static; box-shadow:none; }
  nav.nav-menu ul { justify-content:center; }
}