*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;line-height:1.6;color:#333;background:#fff}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
header{background:#1a1a2e;padding:18px 0}
header .container{display:flex;justify-content:space-between;align-items:center}
.logo{color:#e94560;font-size:24px;font-weight:700;letter-spacing:1px}
nav a{color:#ccc;text-decoration:none;margin-left:28px;font-size:15px;transition:color .2s}
nav a:hover{color:#e94560}
.hero{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);color:#fff;padding:100px 0 90px;text-align:center}
.hero h1{font-size:42px;margin-bottom:18px}
.hero p{font-size:18px;color:#b0b0b0;max-width:600px;margin:0 auto 30px}
.btn{display:inline-block;background:#e94560;color:#fff;padding:14px 36px;border-radius:6px;text-decoration:none;font-weight:600;transition:background .2s}
.btn:hover{background:#c73650}
section{padding:70px 0}
h2{text-align:center;font-size:32px;margin-bottom:40px;color:#1a1a2e}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
.card{background:#f8f9fa;border-radius:10px;padding:32px;text-align:center;border:2px solid transparent;transition:border-color .2s}
.card:hover{border-color:#e94560}
.card h3{margin-bottom:12px;color:#1a1a2e}
.card.featured{border-color:#e94560;background:#fff0f3}
.price{font-size:38px;font-weight:700;color:#e94560;margin:10px 0 18px}
.price span{font-size:16px;color:#888}
ul{list-style:none;text-align:left;padding:0 10px}
ul li{padding:6px 0;border-bottom:1px solid #eee}
ul li:last-child{border:none}
.about{background:#f8f9fa}
.about p{max-width:700px;margin:0 auto;text-align:center;font-size:17px}
footer{background:#1a1a2e;color:#888;padding:24px 0;text-align:center;font-size:14px}
@media(max-width:768px){.hero h1{font-size:28px}.grid{grid-template-columns:1fr}header .container{flex-direction:column;gap:12px}}