:root { --hw-orange: #f4511e; --hw-dark: #1a1a1a; --hw-border: #333; }
body { margin:0; font-family:'Inter', sans-serif; background:#1a1a1a; color:white; scroll-behavior: smooth; display:flex; flex-direction:column; min-height:100vh; }
.container {
	max-width:1100px;
	margin:0 auto;
	padding:0 20px;
	width:100%;
	box-sizing:border-box;
	text-align: center;
}
.flex-between { display:flex; justify-content:space-between; align-items:center; }
.nav { height:70px; background:rgba(26,26,26,0.9); backdrop-filter:blur(10px); position:sticky; top:0; z-index:100; border-bottom:1px solid var(--hw-border); }
.logo { font-size:24px; font-weight:800; cursor:pointer; } .logo span { color:var(--hw-orange); }
.nav-links { display:flex; list-style:none; gap:25px; } .nav-links a { color:#ccc; text-decoration:none; font-size:14px; }
.btn-hw { background:var(--hw-orange); color:white; border:none; padding:10px 25px; cursor:pointer; font-weight:bold; border-radius:4px; }
.hero { padding:140px 0; text-align:center; background:radial-gradient(circle at center, #3d2b26, #1a1a1a); }
.section { padding:80px 0; } .dark-bg { background:#111; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:30px; }
.card { padding:40px; border:1px solid var(--hw-border); background:#1a1a1a; border-radius:8px; transition:0.3s; }
.card:hover { border-color:var(--hw-orange); transform:translateY(-10px); }
footer { background: #0a0a0a; padding: 60px 0 30px; border-top: 1px solid #222; color: #888; margin-top:auto; }
.footer-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 40px; margin-bottom: 30px; }
.footer-section h4 { color: #fff; margin-bottom: 20px; } .footer-bottom { border-top: 1px solid #222; padding-top: 20px; text-align: center; }
.hw-input { width:100%; padding:15px; background:#000; border:1px solid #444; color:white; margin-bottom:15px; border-radius:4px; }