:root{
  --c-primary:var(--c-primary); --c-dark:var(--c-dark); --c-accent:#ffb100;
  --font-head:var(--font-head),sans-serif; --font-body:var(--font-body),sans-serif;
  --red:var(--c-primary); --ink:var(--c-dark);
}
/* ================================================
   Jagan India Global Services - jaganindia.com
   Brand: signal red on ink navy, engineered & bold
   ================================================ */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body),system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.7;font-size:16px;margin:0}
h1,h2,h3,h4,h5,.display-font{font-family:var(--font-head),sans-serif;font-weight:800;letter-spacing:-.02em;line-height:1.15}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--red-dark)}
img{max-width:100%}
.section{padding:80px 0}
.section-sm{padding:52px 0}
.bg-paper{background:var(--paper)}
.bg-ink{background:var(--ink);color:#c9d1e0}
.bg-ink h1,.bg-ink h2,.bg-ink h3{color:#fff}
.text-red{color:var(--red)!important}
.eyebrow{font-family:var(--font-head),sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--red);display:inline-flex;align-items:center;gap:10px;margin-bottom:14px}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--red)}
.sec-title{font-size:clamp(1.7rem,3.4vw,2.6rem);margin-bottom:14px}

/* ---------- Navbar ---------- */
.jn-nav{background:rgba(16,22,35,.94);backdrop-filter:blur(10px);position:sticky;top:0;z-index:1030;border-bottom:1px solid rgba(255,255,255,.08)}
.jn-nav .navbar-brand{font-family:var(--font-head);font-weight:800;color:#fff;font-size:1.25rem;letter-spacing:-.01em}
.jn-nav .navbar-brand .dot{color:var(--red)}
.jn-nav .navbar-brand small{display:block;font-size:.62rem;letter-spacing:.28em;color:#9aa5b8;font-weight:600;text-transform:uppercase}
.jn-nav .nav-link{color:#dfe4ee!important;font-weight:600;font-size:.94rem;padding:.9rem 1rem!important}
.jn-nav .nav-link:hover,.jn-nav .nav-link.active{color:#fff!important}
.jn-nav .nav-link.active{box-shadow:inset 0 -3px 0 var(--red)}
.jn-nav .dropdown-menu{background:var(--ink-2);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.5rem}
.jn-nav .dropdown-item{color:#dfe4ee;border-radius:7px;padding:.55rem .9rem;font-size:.92rem}
.jn-nav .dropdown-item:hover{background:var(--red);color:#fff}
.btn-quote{background:var(--red);color:#fff!important;border-radius:8px;padding:.6rem 1.2rem!important;font-weight:700;margin-left:.5rem}
.btn-quote:hover{background:var(--red-dark)}
.navbar-toggler{border-color:rgba(255,255,255,.3)}
.navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,.9)' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")}

/* ---------- Hero ---------- */
.hero{background:var(--ink);color:#c9d1e0;position:relative;overflow:hidden;padding:110px 0 90px}
.hero::after{content:"";position:absolute;right:-180px;top:-180px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(237,28,36,.28),transparent 65%)}
.hero .grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(#000 30%,transparent)}
.hero h1{color:#fff;font-size:clamp(2.1rem,5vw,3.6rem);margin-bottom:18px}
.hero h1 .stroke{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.75)}
.hero p.lead-text{font-size:1.08rem;max-width:620px;color:#a9b3c6}
.hero .hero-tags span{display:inline-block;border:1px solid rgba(255,255,255,.18);border-radius:100px;padding:.3rem .85rem;font-size:.8rem;margin:.2rem .3rem .2rem 0;color:#c9d1e0}
.btn-red{background:var(--red);border:none;color:#fff;font-weight:700;border-radius:9px;padding:.85rem 1.7rem}
.btn-red:hover{background:var(--red-dark);color:#fff}
.btn-ghost{border:1.5px solid rgba(255,255,255,.35);color:#fff;font-weight:600;border-radius:9px;padding:.85rem 1.6rem;background:transparent}
.btn-ghost:hover{border-color:#fff;color:#fff}
.hero-stats{display:flex;gap:38px;margin-top:44px;flex-wrap:wrap}
.hero-stats .num{font-family:var(--font-head);font-weight:800;font-size:2rem;color:#fff}
.hero-stats .num span{color:var(--red)}
.hero-stats .lbl{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:#8b96ab}

/* ---------- Page banner ---------- */
.page-banner{background:var(--ink);color:#fff;padding:76px 0 56px;position:relative;overflow:hidden}
.page-banner::after{content:"";position:absolute;right:-120px;bottom:-160px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(237,28,36,.3),transparent 65%)}
.page-banner h1{font-size:clamp(1.9rem,4vw,3rem);margin:0}
.page-banner .crumb{color:#9aa5b8;font-size:.86rem;margin-top:10px}
.page-banner .crumb a{color:#c9d1e0}

/* ---------- Cards ---------- */
.svc-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:30px 26px;height:100%;transition:.25s;position:relative;overflow:hidden}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(16,22,35,.1);border-color:transparent}
.svc-card .icn{width:56px;height:56px;border-radius:12px;background:rgba(237,28,36,.09);color:var(--red);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:18px}
.svc-card h4{font-size:1.12rem;margin-bottom:10px}
.svc-card p{color:var(--muted);font-size:.93rem;margin-bottom:14px}
.svc-card .go{font-weight:700;font-size:.9rem}
.card-img-top-fixed{height:210px;object-fit:cover;border-radius:14px 14px 0 0;width:100%;background:var(--paper)}
.blog-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;height:100%;transition:.25s}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(16,22,35,.1)}
.blog-card .body{padding:22px}
.blog-card .cat{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.blog-card h5{margin:.5rem 0}
.blog-card h5 a{color:var(--ink)}
.blog-card .meta{font-size:.8rem;color:var(--muted)}

/* ---------- Job / project ---------- */
.job-card{border:1px solid var(--line);border-left:4px solid var(--red);border-radius:12px;padding:24px;background:#fff;transition:.2s}
.job-card:hover{box-shadow:0 14px 34px rgba(16,22,35,.09)}
.job-meta span{display:inline-block;background:var(--paper);border-radius:7px;padding:.3rem .8rem;font-size:.82rem;margin:.2rem .35rem .2rem 0;color:var(--ink-3)}

/* ---------- CTA strip ---------- */
.cta-strip{background:linear-gradient(120deg,var(--red),var(--red-dark));border-radius:18px;color:#fff;padding:44px 40px}
.cta-strip h3{color:#fff}

/* ---------- Forms ---------- */
.form-control,.form-select{border:1.5px solid var(--line);border-radius:9px;padding:.7rem .95rem;font-size:.95rem}
.form-control:focus,.form-select:focus{border-color:var(--red);box-shadow:0 0 0 .2rem rgba(237,28,36,.12)}
label.form-label{font-weight:600;font-size:.88rem}
.contact-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:34px}
.contact-info-item{display:flex;gap:16px;margin-bottom:22px}
.contact-info-item .ic{width:46px;height:46px;flex:none;border-radius:10px;background:rgba(237,28,36,.09);color:var(--red);display:flex;align-items:center;justify-content:center;font-size:1.2rem}

/* ---------- Footer ---------- */
footer.site-footer{background:var(--ink);color:#9aa5b8;padding:64px 0 0;font-size:.93rem}
footer .ft-title{font-family:var(--font-head);font-weight:700;color:#fff;font-size:1rem;margin-bottom:18px;letter-spacing:.02em}
footer ul{list-style:none;padding:0;margin:0}
footer ul li{margin-bottom:9px}
footer ul a{color:#9aa5b8}
footer ul a:hover{color:#fff}
footer .social a{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#c9d1e0;margin-right:8px}
footer .social a:hover{background:var(--red);border-color:var(--red);color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:48px;padding:18px 0;font-size:.83rem;color:#77839a}

/* ---------- Misc ---------- */
.content-html p{margin-bottom:1rem;color:#333c4e}
.content-html ul{padding-left:1.2rem}
.back-top{position:fixed;bottom:22px;right:22px;width:44px;height:44px;border-radius:10px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;z-index:99;box-shadow:0 8px 22px rgba(237,28,36,.4)}
.back-top:hover{color:#fff;background:var(--red-dark)}
.thanks-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:56px 36px;text-align:center;max-width:560px;margin:0 auto}
.thanks-card .tick{width:84px;height:84px;border-radius:50%;background:rgba(25,170,90,.12);color:#19aa5a;font-size:2.4rem;display:flex;align-items:center;justify-content:center;margin:0 auto 22px}
@media (max-width:767px){.section{padding:56px 0}.hero{padding:78px 0 64px}.hero-stats{gap:24px}}

/* ---------- Site search + auto-suggest ---------- */
.btn-search-toggle{background:transparent;border:1px solid rgba(255,255,255,.25);color:#fff;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:.2s}
.btn-search-toggle:hover{background:var(--red,var(--c-primary));border-color:var(--red,var(--c-primary))}
.site-search-bar{background:#0b111c;border-bottom:1px solid rgba(255,255,255,.08);padding:14px 0}
.site-search-bar .form-control,.site-search-bar .input-group-text{border-color:#2a3345;background:#141c2b;color:#fff}
.site-search-bar .form-control::placeholder{color:#8794a8}
.site-search-bar .form-control:focus{box-shadow:0 0 0 .2rem rgba(237,28,36,.25);border-color:var(--c-primary)}
.suggest-box{position:absolute;left:12px;right:12px;top:100%;margin-top:6px;background:#fff;border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.25);overflow:hidden;z-index:1080;max-height:70vh;overflow-y:auto}
.sg-head{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#8794a8;padding:10px 16px 4px;font-weight:700}
.sg-item{display:flex;align-items:center;gap:12px;padding:10px 16px;color:var(--c-dark);text-decoration:none;font-weight:500;border-left:3px solid transparent}
.sg-item i{color:var(--c-primary);font-size:1.05rem;width:20px;text-align:center}
.sg-item span{display:flex;flex-direction:column;line-height:1.25}
.sg-item small{color:#6c757d;font-weight:400;font-size:.78rem}
.sg-item mark{background:#ffe9ea;color:var(--c-primary);padding:0;font-weight:700}
.sg-item:hover,.sg-item.active{background:#f6f7fa;border-left-color:var(--c-primary);color:var(--c-dark)}
.sg-all{background:var(--c-dark);color:#fff!important;font-weight:600}
.sg-all i{color:#fff}
.sg-all:hover{background:var(--c-primary);border-left-color:var(--c-primary)}
@media (max-width:991px){.btn-search-toggle{margin-top:8px}}

/* ---------- Topbar ---------- */
.topbar{background:var(--c-dark);color:#cfd6e4;font-size:.8rem;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.topbar a{color:#fff;text-decoration:none}
.topbar i{color:var(--c-primary)}
