:root{
  --red:#d60000;
  --red-dark:#9f0000;
  --red-soft:#ffe8e8;
  --black:#141414;
  --gray:#6b7280;
  --light:#f6f7f9;
  --white:#ffffff;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--light);color:var(--black)}
a{text-decoration:none}
.topbar{background:var(--black);color:#fff;padding:10px 24px;font-size:14px}
.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.brand{font-weight:900;font-size:28px;color:var(--red);display:flex;align-items:center;gap:10px}
.brand img{max-height:48px;max-width:180px;object-fit:contain}
.brand span{color:var(--black)}
.hero{min-height:520px;display:flex;align-items:center;padding:56px 8%;background:linear-gradient(135deg,#fff 0%,#fff 60%,#ffe5e5 100%)}
.hero h1{font-size:54px;line-height:1.05;margin:0 0 18px;max-width:750px}
.hero h1 strong{color:var(--red)}
.hero p{font-size:20px;color:var(--gray);max-width:650px}
.btn{display:inline-block;background:var(--red);color:#fff;padding:14px 22px;border-radius:10px;font-weight:700;border:0;cursor:pointer}
.btn:hover{filter:brightness(.9)}
.btn.secondary{background:#333}
.btn.danger{background:#991b1b}
.btn.small{padding:8px 12px;font-size:14px}
.section{padding:60px 8%}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 8px 28px rgba(0,0,0,.06);border-top:4px solid var(--red)}
.price{font-size:34px;font-weight:900;color:var(--red)}
.login-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#151515,#2b0000)}
.login-card{width:min(420px,92vw);background:#fff;border-radius:18px;padding:32px;box-shadow:0 18px 60px rgba(0,0,0,.28)}
.login-logo{max-width:220px;max-height:90px;display:block;margin-bottom:16px}
label{display:block;margin:14px 0 6px;font-weight:700}
input,textarea,select{width:100%;padding:13px 14px;border:1px solid #ddd;border-radius:10px;font-size:16px;background:#fff}
textarea{min-height:110px;resize:vertical}
.alert{padding:12px 14px;border-radius:10px;background:var(--red-soft);color:#8e0000;margin-bottom:14px}
.alert.success{background:#e7f8ec;color:#17642d}
.admin{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.sidebar{background:#171717;color:#fff;padding:26px 18px}
.sidebar .brand{color:#fff;margin-bottom:20px}
.sidebar .brand img{max-height:58px;max-width:190px}
.sidebar .brand b{color:#ff2a2a}
.sidebar a{display:block;color:#eee;padding:12px;margin:5px 0;border-radius:8px}
.sidebar a:hover,.sidebar a.active{background:#2d2d2d}
.main{padding:32px}
.stat{font-size:30px;font-weight:900;color:var(--red)}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.table-wrap{overflow:auto;background:#fff;border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.05)}
table{border-collapse:collapse;width:100%;min-width:760px}
th,td{text-align:left;padding:14px;border-bottom:1px solid #eee}
th{background:#fafafa}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.form-card{background:#fff;padding:24px;border-radius:16px;box-shadow:0 8px 28px rgba(0,0,0,.05)}
.preview-logo{max-width:260px;max-height:120px;object-fit:contain;background:#f8f8f8;padding:10px;border-radius:10px}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700}
.badge.ok{background:#dcfce7;color:#166534}
.badge.off{background:#fee2e2;color:#991b1b}
@media(max-width:760px){
  .hero h1{font-size:40px}
  .admin{grid-template-columns:1fr}
  .sidebar{position:static}
  .grid2{grid-template-columns:1fr}
  .page-head{align-items:flex-start;flex-direction:column}
}
