body{margin:0;background:#d8d8d8;font-family:Arial,Helvetica,sans-serif;color:#4b4b4b;font-size:12px}
*{box-sizing:border-box}
img{max-width:100%;height:auto}
a{color:#5b6c8a;text-decoration:none}a:hover{text-decoration:underline}
.wrapper{width:980px;max-width:100%;margin:4px auto 0;background:#d8d8d8;border-top:3px solid #111}
.header{display:flex;justify-content:space-between;align-items:flex-start;padding:6px 8px 8px;gap:16px}
.logo{width:230px;height:auto;display:block}
.head-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;padding-top:2px}
.social{display:flex;gap:5px}.social img{width:26px;height:26px;display:block}
.search{display:flex;gap:8px;align-items:center}.search input{width:120px;height:18px;border:1px solid #777;background:#f2f2f2;font-size:11px;padding:0 6px}.search button{border:none;background:transparent;color:#bbb;font-size:11px}
.hero{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 10px}
.hero .card{background:#f3f3f3;border:1px solid #444;text-align:center;min-width:0}.hero img{display:block;width:100%;height:140px;object-fit:cover}.hero .title{padding:9px 4px 10px;font:700 14px Georgia,serif;color:#222}
.menu{display:flex;gap:28px;padding:12px 14px 10px;font-size:12px;color:#888;flex-wrap:wrap}.menu a{color:#666}
.content{display:grid;grid-template-columns:215px minmax(0,1fr) 180px;gap:9px;padding:0 10px 12px}
.box{background:#efefef;border:1px solid #c9c9c9;margin-bottom:9px}.box h3{margin:0;padding:8px 10px;background:#f4f4f4;border-bottom:1px solid #d8d8d8;color:#2980c3;font:bold 14px Arial}.box .inner{padding:10px}
.left-list,.contact-list{list-style:none;margin:0;padding:0}.left-list li{padding:4px 0;border-bottom:0}.checks li{padding:3px 0 3px 14px;position:relative}.checks li:before{content:"";position:absolute;left:0;top:6px;width:10px;height:10px;background:url('assets/velos.jpg') no-repeat center/contain}
.sidebar-image{width:100%;display:block}
.main{min-width:0}.main p{margin:0 0 10px;line-height:1.45}.main h2{margin:0;padding:8px 10px;background:#f4f4f4;border-bottom:1px solid #d8d8d8;color:#2980c3;font:bold 14px Arial}.signature{margin-top:10px}.signature img{width:170px}
.info-item{display:flex;align-items:center;gap:8px;margin-bottom:9px}.info-item img{width:22px;height:22px}
.program-item{display:grid;grid-template-columns:68px 1fr;gap:10px;padding:10px;border-top:1px solid #ddd}.program-item:first-child{border-top:none}.program-item img{width:68px;height:68px;object-fit:cover}.program-item h4{margin:0 0 6px;color:#2980c3;font:bold 13px Arial}.program-item p{margin:0;line-height:1.35}
.footer{padding:18px 10px 10px;text-align:center;color:#7a7a7a;font-size:11px}.footer .links{display:flex;justify-content:center;gap:18px;margin-bottom:8px;flex-wrap:wrap}.footer .links span{color:#999}
.table-wrap{border:2px solid #111;display:inline-block;margin:10px 0;max-width:100%;overflow-x:auto;background:#fff}.ath-table{border-collapse:collapse;font-size:12px;color:#333;min-width:520px}.ath-table th,.ath-table td{border:1px solid #111;padding:6px 8px;vertical-align:top}.ath-table th{background:#f0f0f0;text-align:left}
.gallery-col img{display:block;width:100%;margin-bottom:10px}
.small-note{font-size:10px;color:#777;margin-top:6px}
.main .source{font-weight:bold;color:#2a67a0}
.right{ width: 230px;}

@media (max-width: 900px){
  .wrapper{margin-top:0;border-top-width:2px}
  .hero{grid-template-columns:repeat(2,1fr)}
  .content{grid-template-columns:200px minmax(0,1fr)}
  .right{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:9px;align-items:start}
  .right .box{margin-bottom:0}
  .small-note{grid-column:1/-1}
}

@media (max-width: 640px){
  body{font-size:13px}
  .header{flex-direction:column;align-items:flex-start;padding:8px 10px}
  .logo{width:100%;max-width:280px}
  .head-right{width:100%;align-items:flex-start}
  .search{width:100%;justify-content:flex-start}
  .search input{width:160px;max-width:100%}
  .hero{grid-template-columns:1fr 1fr;padding:0 10px;gap:6px}
  .hero img{height:110px}
  .hero .title{font-size:13px;padding:8px 3px}
  .menu{gap:10px;padding:10px;font-size:11px}
  .content{grid-template-columns:1fr;padding:0 10px 12px}
  .left,.main,.right{grid-column:auto}
  .right{display:block}
  .program-item{grid-template-columns:56px 1fr;gap:8px}
  .program-item img{width:56px;height:56px}
  .box h3,.main h2{font-size:13px}
  .footer .links{gap:10px;font-size:10px}
}

@media (max-width: 420px){
  .hero{grid-template-columns:1fr}
  .menu{display:grid;grid-template-columns:1fr 1fr}
  .social img{width:24px;height:24px}
  .search input{width:140px}
}