body { font-family: Arial,sans-serif; margin:0; color:#181818; background:#fff;}
header { display:flex; align-items:center; background:#fff; border-bottom:2px solid #ba2323; padding:10px 20px;}
.logo { height:36px; margin-right:12px;}
nav { display:flex; gap:12px;}
nav a { color:#ba2323; text-decoration:none; font-weight:bold;}
nav a.on, nav a:hover { text-decoration:underline; color:#181818;}
.hero { display:flex; align-items:center; background:#fff3f3; padding:18px 8px;}
.hero .big { width:180px; border-radius:8px; margin-right:14px; box-shadow:0 2px 8px #bb222233;}
.hero h1 { color:#ba2323; margin:0 0 7px 0;}
.hero p { margin:0 0 12px 0;}
.btn { background:#ba2323; color:#fff; padding:7px 18px; border:none; border-radius:5px; text-decoration:none;}
.row { display:flex; justify-content:space-between; background:#fff6f4; border-radius:7px; max-width:350px; margin:16px auto 8px; padding:7px 12px; font-size:.98em;}
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin:18px 0 10px 0; padding:0 7px;}
.cards div { background:#f6f6f6; border-radius:7px; box-shadow:0 1px 3px #ba232218; text-align:center; padding:9px;}
.cards img { width:100%; height:55px; object-fit:cover; border-radius:5px;}
.cards h3 { color:#ba2323; margin:6px 0 2px; font-size:.98em;}
.cards p { margin:0; }
.slider { display:flex; overflow:hidden; max-width:260px; margin:14px auto 8px; border-radius:7px; background:#fff;}
.slider img { min-width:100%; transition:.4s; object-fit:cover; height:75px; border-radius:7px;}
.abt { width:70px; float:left; margin:0 8px 6px 0; border-radius:7px;}
form { max-width:180px; margin:13px auto 9px auto; background:#f6f6f6; padding:9px; border-radius:7px; box-shadow:0 1px 2px #ba23220a;}
input, textarea { width:100%; padding:4px; margin:3px 0 6px 0; border-radius:3px; border:1px solid #ccc; font-size:1em;}
button[type="submit"] { background:#ba2323; color:#fff; border:none; border-radius:3px; padding:6px 11px; font-size:.97em;}
footer { text-align:center; color:#ba2323; font-size:.98em; margin:10px 0 0 0; padding:8px 0; border-top:1.2px solid #dfbfbf; background:#fff8f8;}
footer a { color:#ba2323; text-decoration:none;}
footer a:hover { text-decoration:underline;}
@media (max-width: 500px) {
  header { flex-direction:column; align-items:flex-start;}
  nav { flex-direction:column; gap:5px;}
  .hero { flex-direction:column; }
  .hero .big { margin:0 0 10px 0;}
  .row { flex-direction:column; text-align:center; gap:4px;}
  .abt { float:none; display:block; margin:7px auto;}
}
