*{margin:0;padding:0;box-sizing:border-box;font-family:"Poppins",sans-serif}
body{
  background: radial-gradient(circle at top center, #ff3c00 0%, #660000 25%, #2b0008 60%, #000000 100%);
  color:#ffffff;
  min-height:100vh;
  background-attachment:fixed;
}

header{
  width:100%;position:fixed;top:0;left:0;
  padding:18px 40px;display:flex;justify-content:space-between;
  align-items:center;background:rgba(0,0,0,0.35);
  backdrop-filter:blur(6px);z-index:10;
}

.logo-text{
  font-size:24px;font-weight:700;
  background:linear-gradient(90deg,#ff4500,#ff0000);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}

.nav-menu{list-style:none;display:flex;gap:22px}
.nav-menu a{text-decoration:none;color:white;font-size:16px;transition:.25s}
.nav-menu a:hover{color:#ff6a33}

.hero{
  height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:120px 20px 60px;position:relative;
}

.hero-logo{width:200px;animation:fadeIn 1.6s ease}
.hero-title{font-size:44px;margin-top:22px;animation:slideUp .9s ease}
.hero-tagline{font-size:18px;margin:12px 0 30px;opacity:.9}

.cta-btn{
  padding:12px 28px;border-radius:40px;background:linear-gradient(90deg,#ff4400,#b30000);
  text-decoration:none;color:white;font-size:18px;transition:.25s;
}
.cta-btn:hover{transform:scale(1.06);background:white;color:#ff0000}

footer{text-align:center;padding:18px;font-size:14px;opacity:.9}

@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------------- CONTACT PAGE ---------------- */
.contact {
    width: 100%;
    padding: 50px 0;
    background: #10121a;
    color: #fff;
}

.contact h1 {
    text-align: center;
    font-size: 38px;
    margin-bottom: 10px;
    color: #ffdb4d;
}

.contact p {
    text-align: center;
    margin-bottom: 40px;
}

.contact-box {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
    width: 80%;
    margin: auto;
}

.contact-box .left,
.contact-box .right {
    width: 45%;
    background: #1c1f2b;
    padding: 30px;
    border-radius: 10px;
}

.contact-box h3 {
    color: #ffdb4d;
    margin-bottom: 20px;
}

.contact-box input,
.contact-box textarea {
    width: 100%;
    background: #2b3042;
    border: none;
    outline: none;
    padding: 12px;
    color: #fff;
    margin-bottom: 15px;
    border-radius: 6px;
}

.contact-box button {
    width: 100%;
    padding: 14px;
    border: none;
    outline: none;
    background: #ffdb4d;
    font-size: 16px;
    font-weight: bold;
    border-radius: 6px;
    cursor: pointer;
}

.contact-box button:hover {
    background: #d8b63c;
}