body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:15px;line-height:1.6;color:#333;background:#f7f7f5}
a{color:#1a6f8a}
.container{width:960px;max-width:94%;margin:0 auto}
header{background:#fff;border-bottom:1px solid #ddd;box-shadow:0 1px 3px rgba(0,0,0,.06)}
header .container{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-weight:bold;font-size:22px;text-decoration:none;color:#c2552a;letter-spacing:-.5px}
.brand span{color:#1a6f8a}
nav a{text-transform:uppercase;font-size:12px;letter-spacing:1px;text-decoration:none;color:#555;margin-left:22px}
nav a:hover,nav a.active{color:#c2552a}
.hero{background:linear-gradient(rgba(18,70,90,.72),rgba(18,70,90,.72)),url(/img/hero.jpg) center/cover no-repeat;text-shadow:0 1px 3px rgba(0,0,0,.4);color:#fff;padding:70px 0;text-align:center}
.hero h1{font-size:38px;margin:0 0 10px;font-weight:600}
.hero p{font-size:18px;margin:0 0 26px;opacity:.95}
.btn{display:inline-block;background:linear-gradient(#e0693a,#c2552a);color:#fff;text-decoration:none;padding:12px 26px;border-radius:4px;font-weight:bold;box-shadow:0 2px 4px rgba(0,0,0,.2);border:0;font-size:15px;cursor:pointer}
.btn:hover{background:linear-gradient(#e87848,#cf5d2f)}
section{padding:44px 0}
section.alt{background:#fff;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5}
h2{font-size:26px;margin:0 0 18px;color:#222;font-weight:600}
h3{font-size:18px;margin:0 0 8px;color:#1a6f8a}
.cols{display:flex;gap:28px;flex-wrap:wrap}
.cols>div{flex:1 1 230px;background:#fff;border:1px solid #e2e2e2;border-radius:4px;padding:20px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.plain .cols>div{background:transparent;border:0;box-shadow:none;padding:0}
ul.tech{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
ul.tech li{background:#eef3f5;border:1px solid #d5e1e6;padding:4px 12px;border-radius:14px;font-size:13px;color:#1a6f8a}
blockquote{margin:0;padding:16px 20px;background:#fff;border-left:4px solid #c2552a;font-style:italic;color:#444}
blockquote cite{display:block;margin-top:8px;font-style:normal;font-size:13px;color:#777}
footer{background:#2b2b2b;color:#bbb;padding:30px 0;font-size:13px}
footer a{color:#ddd}
footer .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
form label{display:block;font-weight:bold;margin:14px 0 4px;font-size:13px;color:#444}
form input,form select,form textarea{width:100%;box-sizing:border-box;padding:9px;border:1px solid #ccc;border-radius:3px;font:inherit;background:#fff}
form textarea{min-height:140px}
.hp{position:absolute;left:-9999px}
.news li{margin-bottom:10px}
.news small{color:#888}
.notice{background:#fff8e6;border:1px solid #f0d9a0;padding:10px 14px;border-radius:3px;font-size:13px;color:#6b5a2b}
@media(max-width:700px){header .container{height:auto;flex-direction:column;padding:12px 0}nav a{margin:0 10px}.hero h1{font-size:28px}}
img.band{width:100%;height:340px;object-fit:cover;border-radius:4px;margin-bottom:24px;display:block;border:1px solid #ddd}
img.side{float:right;width:420px;max-width:45%;margin:0 0 16px 24px;border-radius:4px;border:1px solid #ddd}
/* layout tweaks */
.cols{align-items:flex-start;gap:0}
.cols>div{flex:0 0 31%;margin-right:2.6%;box-sizing:border-box}
.cols>div:nth-child(2){padding:22px 24px 14px 18px;flex-basis:32.5%}
.cols>div:nth-child(3){margin-top:7px;margin-right:0;flex-basis:30%;padding-bottom:26px}
.cols>div:nth-child(2) h3{font-size:17px;margin-bottom:11px}
.cols>div:nth-child(3) p{line-height:1.5}
.plain .cols>div:nth-child(3){margin-top:0;padding-top:4px}
.plain .cols>div:nth-child(2) blockquote{margin-top:9px;border-left-width:3px;padding:14px 18px 18px 22px}
.hero .container{text-align:left;padding-left:34px;box-sizing:border-box}
.hero h1{margin-left:2px}
.hero .btn{margin-left:14px;margin-top:4px}
nav a:last-child{margin-left:27px}
section h2{margin-bottom:18px}
section.alt h2{margin-bottom:23px;margin-left:3px}
ul.news{padding-left:22px}
ul.news li:nth-child(2){margin-bottom:16px;margin-left:5px}
footer .container{align-items:flex-start}
footer .container div:last-child{padding-top:5px;margin-right:12px}
img.band{margin-left:-4px;width:calc(100% + 4px)}
img.side{margin-top:-6px;margin-right:-8px}
form p:last-child{margin-left:3px;margin-top:22px}
form select{width:97%}
.contact-side{padding-top:28px;margin-left:10px}
@media(max-width:700px){.cols>div{flex-basis:100%;margin-right:0}}
