:root{
  --royal-900: #04102a;
  --royal-700: #0b2a56;
  --royal-600: #163a86;
  --gold: #f5c25b;
  --muted: #7b8aa3;
  --bg: #f6f9fc;
  --glass: rgba(255,255,255,0.06);
  --maxw: 1100px;
  --radius: 12px;
  --shadow: 0 10px 30px rgba(6,18,40,0.18);
  font-family: 'Poppins', Arial, sans-serif;
}

/* basic reset */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:linear-gradient(180deg,var(--bg) 0%, #ffffff 100%);color:#0b1a2b;line-height:1.45}

/* container */
.container{max-width:var(--maxw);margin:0 auto;padding:20px}

/* header */
.site-header{
  position:sticky;top:0;z-index:9999;
  display:flex;align-items:center;justify-content:space-between;
  gap:6px;padding:14px 20px;background:linear-gradient(90deg,var(--royal-900),var(--royal-700));
  color:#fff;box-shadow:0 4px 18px rgba(3,10,30,0.28);
  backdrop-filter: blur(4px);
}
.brand{display:flex;align-items:center;gap:12px;font-weight:700}
.brand .logo-circle{width:46px;height:46px;border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;color:var(--royal-900);font-weight:800}
.site-nav{display:flex;gap:14px;align-items:center}
.site-nav a{color:rgba(255,255,255,0.92);text-decoration:none;padding:8px 10px;border-radius:8px;font-weight:600}
.site-nav a:hover{background:rgba(255,255,255,0.06)}

/* mobile hamburger */
.hamburger{display:none;width:44px;height:44px;border-radius:10px;align-items:center;justify-content:center;background:rgba(255,255,255,0.04);cursor:pointer}
@media (max-width:900px){
  .site-nav{display:none}
  .hamburger{display:flex}
}

/* floating quick bar */
.quick-bar{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:9999}
.quick-bar a{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;background:var(--gold);color:var(--royal-900);font-weight:700;text-decoration:none;box-shadow:0 8px 20px rgba(13,24,50,0.18)}
.quick-call{background:linear-gradient(90deg,var(--gold),#ffd77a)}

/* hero */
.hero{
  margin-top:22px;background:
  linear-gradient(180deg, rgba(2,18,40,0.04), rgba(255,255,255,0.6));
  border-radius:var(--radius);padding:32px;display:grid;grid-template-columns:1fr 380px;gap:22px;align-items:center;box-shadow:var(--shadow)
}
.hero-left h1{font-family:'Lora', serif;color:var(--royal-900);font-size:32px;margin:0 0 12px}
.hero-left p{color:var(--muted);margin:0 0 18px}
.hero-ctas{display:flex;gap:10px;flex-wrap:wrap}
.btn-primary{background:linear-gradient(90deg,var(--royal-600),var(--royal-700));color:#fff;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:700;box-shadow:0 8px 20px rgba(12,30,80,0.18)}
.btn-outline{border:2px solid var(--gold);color:var(--royal-900);padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:700;background:#fff}

/* hero right card */
.hero-card{background:linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,255,255,0.98));padding:18px;border-radius:10px;box-shadow:0 8px 30px rgba(7,18,40,0.06)}
.hero-card h4{margin:0 0 8px;color:var(--royal-700)}

/* features grid */
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
.feature-card{background:#fff;padding:14px;border-radius:10px;box-shadow:0 8px 24px rgba(7,18,40,0.04);text-align:center}
.feature-card h3{margin:8px 0 4px;color:var(--royal-700)}
.feature-card p{margin:0;color:var(--muted)}

/* updates ticker */
.updates{margin-top:18px;padding:12px;border-radius:10px;background:linear-gradient(90deg, rgba(255,255,255,0.9), rgba(255,255,255,0.98));display:flex;align-items:center;gap:12px;box-shadow:0 8px 24px rgba(7,18,40,0.04)}
.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--gold);color:var(--royal-900);font-weight:700}

/* footer include - small override */
.site-footer{background:var(--royal-900);color:#fff;padding:20px;border-radius:10px;margin-top:26px}
.site-footer a{color:#fff;text-decoration:none}

/* Mobile nav reliable */
.site-nav{display:flex;gap:14px;align-items:center}
@media (max-width:900px){
  .site-nav{display:none;flex-direction:column;background:linear-gradient(180deg,var(--royal-900),var(--royal-700));position:fixed;top:68px;right:12px;padding:12px;border-radius:10px;z-index:9998;min-width:200px}
  body.nav-open .site-nav{display:flex}
  .site-nav a{padding:10px 12px;border-radius:8px}
  /* ensure header sits above nav */
  .site-header{z-index:9999}
}

/* responsive */
@media (max-width:1100px){ .hero{grid-template-columns:1fr 320px} .features{grid-template-columns:repeat(2,1fr)} }
@media (max-width:760px){
  .container{padding:14px}
  .hero{grid-template-columns:1fr; padding:20px}
  .hero-left h1{font-size:24px}
  .features{grid-template-columns:1fr}
  .quick-bar{right:12px;bottom:12px}
}

/* Quick Bar Buttons */
/* floating quick bar */
.quick-bar{
  position:fixed;
  right:18px;
  bottom:150px; /* BOT (86px) + gap (≈60px) -> mela move */
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:9998; /* bot 9999, so bot top-la */
}
.quick-bar a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:999px;
  background:var(--gold);
  color:var(--royal-900);
  font-weight:700;
  text-decoration:none;
  box-shadow:0 8px 20px rgba(13,24,50,0.18);
}
.quick-call{background:linear-gradient(90deg,var(--gold),#ffd77a);}
.quick-apply{background:linear-gradient(90deg,#f5c25b,#eab94a);}

/* optional: desktop little adjust */
@media (min-width:1000px){
  .quick-bar{
    right:24px;
    bottom:170px;
  }
}

/* mobile tweak – still bot mela thane */
@media (max-width:760px){
  .quick-bar{
    right:12px;
    bottom:160px;
  }
}

/* Logo */
.logo-circle {
    width: 70px;      /* Desktop size */
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Mobile resize */
@media (max-width: 768px) {
    .logo-circle {
        width: 55px;   /* Smaller on mobile */
        height: 55px;
    }
}

/* Announcement */
.announcement-hero {
  margin-top: 80px;          /* already irundha keep */
  display: flex;
  justify-content: center;
}

.announcement-hero .carousel {
  max-width: 900px;          /* desktop-la width limit */
  width: 100%;
}

.announcement-hero img {
  width: 100%;
  max-height: 280px;         /* height limit – need na 220/250-ku maathalaam */
  object-fit: contain;       /* image crop aagama */
  margin: 0 auto;
  background: #ffffff;
}

@media (max-width: 768px) {
  .announcement-hero {
    margin-top: 60px;
  }
  .announcement-hero img {
    max-height: 220px;
  }
}