/* UI refinement layer: more depth on desktop, more breathing room on mobile */
:root{
  --blue-strong:#0b63d8;
  --blue-mid:#2d8bf0;
  --ink-dark:#071a3a;
  --surface-blue:#f3f8ff;
  --shadow-soft:0 18px 50px rgba(8,55,125,.09);
}

::selection{background:#b9dcff;color:#061a3d}
.site-header{background:linear-gradient(120deg,#052864 0%,#0a438f 100%)}
.topbar{background:#041632}
.nav-wrap{border-top:1px solid rgba(255,255,255,.16)}
.nav-inner{min-height:82px}
.primary-nav a:not(.nav-cta){position:relative;padding:10px 0}
.primary-nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:4px;background:#8bc5ff;transform:scaleX(0);transform-origin:right;transition:transform .25s ease}
.primary-nav a:not(.nav-cta):hover::after,.primary-nav a.is-active::after{transform:scaleX(1);transform-origin:left}
.primary-nav .nav-cta{box-shadow:0 8px 20px rgba(1,18,54,.2);transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.primary-nav .nav-cta:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(1,18,54,.25)}

.hero-section{background:radial-gradient(circle at 90% 12%,rgba(122,190,255,.2),transparent 30%),linear-gradient(180deg,#eef6ff 0,#fff 90%)}
.hero-grid{min-height:650px;gap:54px;padding:84px 0 102px}
.hero-copy{max-width:650px}
.hero-copy h1{font-size:clamp(50px,6.3vw,82px);letter-spacing:-.06em}
.hero-lead{max-width:560px}
.hero-actions{margin:38px 0 30px}
.hero-visual{isolation:isolate}
.hero-visual::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(86,165,255,.2),transparent 66%);filter:blur(4px);z-index:-1}
.hero-card{box-shadow:0 24px 70px rgba(8,55,125,.14)}
.card-main{border-color:#d4e4f7}
.float-top,.float-bottom{backdrop-filter:blur(10px);background:rgba(255,255,255,.92)}
.ticker-strip{background:#fbfdff}
.ticker-inner{min-height:64px;color:#687e9d}

.section{padding:116px 0}
.services-preview{background:linear-gradient(180deg,#f7faff,#f1f7ff)}
.section-heading{margin-bottom:48px}
.service-card,.insight-card,.value-card,.blog-card{box-shadow:0 1px 0 rgba(10,53,115,.02);border-color:#d7e4f2}
.service-card:hover,.insight-card:hover,.blog-card:hover,.value-card:hover{box-shadow:var(--shadow-soft)}
.service-card h3{letter-spacing:-.035em}
.service-icon{background:linear-gradient(135deg,#e7f2ff,#d4e9ff);box-shadow:inset 0 0 0 1px rgba(68,139,215,.1)}
.emi-panel,.location-panel{background:radial-gradient(circle at 90% 15%,rgba(107,191,255,.34),transparent 30%),linear-gradient(120deg,#062b6b,#0874df)}
.cta-panel{background:radial-gradient(circle at 90% 20%,rgba(36,113,220,.55),transparent 33%),#041b43}

.whatsapp-float{transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.whatsapp-float:hover{box-shadow:0 13px 30px rgba(9,117,71,.32)}

/* Accessible, touch-friendly mobile navigation and layout */
@media(max-width:650px){
  .container{width:calc(100% - 32px)}
  .nav-inner{min-height:68px}
  .brand,.brand img{width:160px}
  .menu-toggle{width:46px;height:46px;display:grid;place-content:center;padding:0;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:rgba(255,255,255,.08)}
  .menu-toggle span:not(.sr-only){width:21px;height:2px;margin:3px 0}
  .primary-nav{top:68px;padding:14px 16px 18px;border-top:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#06265d,#041b43);gap:3px}
  .primary-nav a:not(.nav-cta){padding:14px 8px;border-radius:9px;font-size:15px}
  .primary-nav a:not(.nav-cta):hover,.primary-nav a.is-active{background:rgba(255,255,255,.08)}
  .primary-nav a:not(.nav-cta)::after{display:none}
  .primary-nav .nav-cta{min-height:48px;margin-top:8px;padding:12px 16px}
  .hero-grid{min-height:0;gap:12px;padding:58px 0 64px}
  .hero-section h1{font-size:clamp(42px,12vw,52px);line-height:1.03;letter-spacing:-.065em;margin-bottom:22px}
  .hero-lead{font-size:16px;line-height:1.65}
  .hero-actions{align-items:stretch;gap:12px;margin:28px 0 24px}
  .hero-actions .btn{width:100%;min-height:52px}
  .hero-actions .text-link{min-height:44px}
  .hero-proof{margin-top:28px}
  .hero-visual{height:328px;margin-top:14px;transform:translateX(1px)}
  .hero-visual::before{width:250px;height:250px}
  .orbit-one{width:292px;height:158px}
  .orbit-two{width:350px;height:200px}
  .card-main{width:266px;padding:12px}
  .mini-chart{height:126px;margin:14px 0 10px}
  .chart-meta b{font-size:18px}
  .float-top{right:-4px;top:27px;transform:scale(.76);transform-origin:right top}
  .float-bottom{left:2px;bottom:27px;transform:scale(.76);transform-origin:left bottom}
  .hero-ring{right:12px;bottom:1px;transform:scale(.72)}
  .ticker-inner{min-height:56px}
  .section{padding:76px 0}
  .section-heading{margin-bottom:32px}
  .section h2{font-size:34px;line-height:1.1}
  .service-card{min-height:250px;padding:23px 20px}
  .service-card h3{font-size:20px;margin-top:53px}
  .emi-panel,.cta-panel,.location-panel{padding:34px 22px;border-radius:18px}
  .emi-panel h2,.cta-panel h2{font-size:33px}
  .emi-foot{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .footer-grid{grid-template-columns:1fr;gap:29px}
  .footer-brand,.footer-grid>div:last-child{grid-column:auto}
  .footer-brand img{width:205px}
  .footer-bottom{font-size:10px}
  .whatsapp-float{right:14px;bottom:14px;padding:9px;border-radius:16px}
  .wa-icon{width:38px;height:38px}
  .wa-label{display:none}
}
@media(min-width:651px) and (max-width:1050px){
  .container{width:calc(100% - 48px)}
  .hero-grid{gap:30px}
  .hero-copy h1{font-size:clamp(48px,6vw,68px)}
  .primary-nav{gap:17px}
}
