:root{
  --orange: #FF6B00;
  --green: #4CAF50;
  --brown: #6D4C41;
  --red: #E53935;
  --navy: #0b3d91;
  --text: #333333;
  --bg: #ffffff;
  --muted: #666;
  --radius: 12px;
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:"Poppins",system-ui,Arial; background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased}
.container{max-width:1100px;margin:32px auto;padding:20px}

/* Topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{height:150px; width:auto; object-fit:contain}
.socials{display:flex;gap:8px}
.social-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 10px;border-radius:8px;background:transparent;border:1px solid #eee;color:var(--muted);text-decoration:none;font-weight:600;font-size:14px}

/* Hero */
.hero{display:flex;gap:40px;align-items:stretch;margin-top:28px}
.left{flex:1}
.right{width:340px}

/* Heading */
h1{font-size:46px;margin:6px 0 6px;color:var(--navy);font-weight:700;letter-spacing:0.2px}
.tagline{font-size:18px;color:var(--muted);margin-bottom:18px}

/* Countdown */
.countdown{display:flex;gap:12px;margin:18px 0 22px}
.countdown > div{background:linear-gradient(180deg, #fff, #fff);padding:14px 18px;border-radius:10px;border:1px solid #f0f0f0;min-width:80px;text-align:center;box-shadow:0 6px 16px rgba(11,61,145,0.04)}
.countdown span{display:block;font-size:20px;font-weight:700;color:var(--navy)}
.countdown small{display:block;font-size:12px;color:var(--muted);margin-top:4px}

/* Subscribe */
.subscribe{display:flex;gap:10px;max-width:540px;margin-bottom:12px}
.subscribe input{flex:1;padding:12px 14px;border-radius:10px;border:1px solid #e8e8e8;font-size:15px}
.btn{padding:10px 16px;border-radius:10px;border:0;cursor:pointer;font-weight:700}
.btn.primary{background:var(--orange);color:#fff}
.btn.outline{background:transparent;border:2px solid var(--navy);color:var(--navy);padding:10px 14px;border-radius:10px;text-decoration:none;display:inline-block;margin-top:12px}

/* Card on right */
.card{border-radius:14px;padding:22px;background:#fff;border:1px solid #f2f2f2;box-shadow:0 8px 30px rgba(11,61,145,0.04)}
.card h3{margin:0 0 10px;color:var(--navy)}
.card ul{margin:8px 0 14px;padding-left:18px;color:var(--muted)}

/* Footer */
.footer{display:flex;align-items:center;justify-content:space-between;margin-top:36px;padding-top:18px;border-top:1px dashed #f2f2f2}
.palette span{display:inline-block;width:28px;height:18px;margin-right:8px;border-radius:4px;box-shadow:0 2px 6px rgba(0,0,0,0.06)}

/* Responsive */
@media (max-width:880px){
  .hero{flex-direction:column}
  .right{width:100%}
  h1{font-size:36px}
  .countdown{flex-wrap:wrap}
  .topbar{gap:12px}
}