:root {
--ink: #07266b;
--blue: #064da6;
--blue-dark: #003f91;
--sky: #eaf4ff;
--orange: #ff8426;
--orange-dark: #f36c12;
--muted: #526074;
--line: #dce7f5;
--shadow: 0 16px 42px rgba(7, 38, 107, .12);
}

* {
letter-spacing: 0;
}

html {
scroll-behavior: smooth;
}

body {
color: #1d2d44;
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background: #fff;
}

body::before {
content: "";
position: fixed;
inset: 0;
pointer-events: none;
background:
radial-gradient(circle at 14% 20%, rgba(4, 77, 166, .055), transparent 28%),
radial-gradient(circle at 90% 48%, rgba(255, 132, 38, .065), transparent 26%);
z-index: -2;
}

.site-header {
border-bottom: 1px solid rgba(7, 38, 107, .16);
background: rgba(255, 255, 255, .94);
backdrop-filter: blur(18px);
}

.brand-mark {
color: var(--ink);
font-weight: 900;
font-size: clamp(2rem, 3vw, 3.05rem);
line-height: .85;
}

.brand-mark span {
color: var(--orange);
}

.brand-caption {
color: var(--blue);
font-size: .66rem;
font-weight: 800;
line-height: 1;
}

.navbar-nav .nav-link {
color: var(--ink);
font-size: .83rem;
font-weight: 800;
padding-inline: 1rem;
position: relative;
text-transform: uppercase;
}

.navbar-nav .nav-link::after {
content: "";
position: absolute;
left:0;
top:0;
height: 100%;
width:100%;
border-radius:25px;
z-index:-1;
background:#257199;
transform: scaleX(0);
transform-origin: center;
transition:ease .25s all;
opacity:0;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
transform: scaleX(1);
opacity:1;
}

.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active{
color:#fff;
}

.navbar-brand {
    padding: 0;
    height: 65px;
    margin-top: 0px;
    background: url(https://www.ruhics.com/img/logo-3d.png) no-repeat scroll 0 0 / 100% auto;
    position: relative;
    z-index: 1;
    display: inline-block;
    width: 190px;
    text-indent: -9999px;
}
.navbar-brand img {margin:0;}
.navbar-brand:focus {outline: 0;}

.navbar-toggler {
border: 0;
color: var(--ink);
box-shadow: none !important;
}

.btn-ruhi {
--bs-btn-bg: var(--blue);
--bs-btn-border-color: var(--blue);
--bs-btn-hover-bg: var(--ink);
--bs-btn-hover-border-color: var(--ink);
--bs-btn-color: #fff;
--bs-btn-hover-color: #fff;
border-radius: 5px;
padding: .95rem 1.2rem;
}

.btn-outline-ruhi {
--bs-btn-color: var(--orange-dark);
--bs-btn-border-color: rgba(255, 132, 38, .6);
--bs-btn-hover-bg: var(--orange);
--bs-btn-hover-border-color: var(--orange);
--bs-btn-hover-color: #fff;
border-radius: 5px;
padding: .95rem 1.2rem;
}

.btn-ruhi,
.btn-outline-ruhi,
.hover-lift {
transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background-color .28s ease;
}

.btn-ruhi,
.btn-outline-ruhi{
padding-right:2.5rem; position:relative;
}
.btn-ruhi .bi,
.btn-outline-ruhi .bi{
position:absolute; right:1rem; top:1rem;
}

.btn-ruhi:hover,
.btn-outline-ruhi:hover,
.hover-lift:hover {
transform: translateY(-4px);
}

section {
overflow: hidden;
}

.section-pad {
padding: clamp(3rem, 7vw, 5.6rem) 0;
}

.hero {
min-height: calc(100vh - 88px);
display: grid;
align-items: center;
position:relative;
z-index:0;
}

.hero:before{
content:'';
position:absolute; 
right:0;
top:0;
width:100%;
height:100%;
z-index:-1;
background-image:url(../images/worldmap.png);
background-size:55%;
background-repeat:no-repeat;
background-position:right center;
opacity:.25;
}

.eyebrow {
color: var(--orange);
display: inline-flex;
align-items: center;
gap: .55rem;
font-weight: 900;
text-transform: uppercase;
}

.eyebrow::after,
.section-title::after {
content: "";
display: block;
width: 42px;
height: 3px;
border-radius: 999px;
background: #257199;
}

.section-title {
color: var(--ink);
font-weight: 900;
line-height: 1.08;
}

.section-title.centered::after {
margin: .8rem auto 0;
}

.hero h1 {
color: var(--ink);
font-size: clamp(2.65rem, 5.6vw, 3.5rem);
font-weight: 900;
line-height: .98;
}

.hero-lead {
color: var(--orange);
font-size: clamp(1.05rem, 2.2vw, 1.5rem);
font-weight: 900;
}

.copy {
color: #27364e;
font-size: clamp(1rem, 1.7vw, 1.12rem);
line-height: 1.78;
}

.world-panel {
min-height: 520px;
position: relative;
isolation: isolate;
}

.world-panel::after {
content: "";
position: absolute;
inset: 12% 11% 7% 22%;
border: 4px dashed rgba(6, 77, 166, .55);
border-left-color: transparent;
border-bottom-color: transparent;
border-radius: 50%;
transform: rotate(16deg);
z-index: -1;
animation: orbitPulse 4.8s ease-in-out infinite;
}

@keyframes orbitPulse {
50% {
opacity: .45;
transform: rotate(16deg) scale(1.025);
}
}

.city-badge {
position: absolute;
width: clamp(142px, 16vw, 190px);
aspect-ratio: 1;
border: 10px solid rgba(255, 255, 255, .92);
border-radius: 50%;
box-shadow: var(--shadow);
background-size: cover;
background-position: center;
}

.city-badge.usa {
top: 5%;
left: 28%;
background-image: linear-gradient(rgba(7, 38, 107, .05), rgba(7, 38, 107, .08)), url("../images/statue.jpg");
}

.city-badge.india {
right: 10%;
bottom: 10%;
background-image: linear-gradient(rgba(255, 132, 38, .03), rgba(255, 132, 38, .1)), url("../images/india-gate.jpg");
}

.city-badge .tag {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -2.6rem;
border-radius: 7px;
background: var(--blue);
color: #fff;
font-size: .9rem;
font-weight: 900;
padding: .35rem .9rem;
}

.city-badge.india .tag {
top: auto;
bottom: -2.8rem;
background: var(--orange);
}

.plane {
position: absolute;
top: 30%;
left: 83.5%;
color: var(--ink);
font-size: 2.2rem;
transform: rotate(330deg);
animation: floatPlane 3.6s ease-in-out infinite;
}

@keyframes floatPlane {
50% {
transform: translate(10px, 20px) rotate(340deg);
}
}

.collab-label {
color: var(--blue);
font-size: clamp(1.1rem, 2.1vw, 1rem);
font-weight: 900;
left: 50%;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 50%;
transform: translate(-50%, -50%);
}

.process-map {
min-height: 440px;
position: relative;
}

.process-map::before {
content: "";
position: absolute;
inset:0% 0%;
background-image:url(../images/worldmap.png);
background-size:100%;
background-repeat:no-repeat;
background-position:center center;
opacity:.2;
}

.process-stack {
position: relative;
z-index: 1;
max-width: 360px;
margin: 0 auto;
}

.process-label{
width:max-content; margin:-8px auto; background:#fff; text-align:center; border:4px solid #cfe0f7; padding:.5rem; border-radius:.25rem; line-height:1; position:relative; z-index:1;
}

.process-node {
background: #fff;
border: 2px solid #a9c6ec;
border-radius: 7px;
box-shadow: 0 12px 28px rgba(6, 77, 166, .11);
color: var(--blue);
font-weight: 900;
margin: 1.3rem auto;
padding: .85rem 1.2rem;
text-align: center;
text-transform: uppercase;
width: min(100%, 270px);
}

.process-icon {
align-items: center;
background: #fff;
border: 4px solid #cfe0f7;
border-radius: 50%;
box-shadow: var(--shadow);
color: var(--blue);
display: flex;
font-size: 2rem;
height: 82px;
justify-content: center;
margin: 0 auto;
width: 82px;
}

.process-stack::after {
content: "";
position: absolute;
top: 76px;
bottom: 76px;
left: 50%;
width: 2px;
background: #a9c6ec;
z-index: -1;
}

.service-card {
height: 100%;
border: 1px solid rgba(7, 38, 107, .08);
border-radius: 8px;
background: #fff;
box-shadow: 0 12px 28px rgba(7, 38, 107, .1);
padding: 1.65rem 1.35rem;
}

.service-card:hover {
border-color: rgba(255, 132, 38, .48);
box-shadow: 0 22px 42px rgba(7, 38, 107, .16);
}

.service-icon {
color: var(--blue);
font-size: 3rem;
line-height: 1;
}

.service-card h3 {
color: var(--blue);
font-size: .98rem;
font-weight: 900;
margin: 1.05rem 0 1rem;
min-height: 2.35rem;
text-transform: uppercase;
}

.service-card li {
color: #24344c;
font-size: .94rem;
margin-bottom: .55rem;
}

.service-card li::marker {
color: var(--orange);
}

.benefits {
color: #fff;
background:
radial-gradient(circle at 18% 14%, rgba(255, 255, 255, .16), transparent 16%),
radial-gradient(circle at 82% 82%, rgba(0, 154, 255, .18), transparent 26%),
linear-gradient(135deg, #003a8b 0%, #0058b8 58%, #00357e 100%);
}

.benefit-item {
position: relative;
height: 100%;
padding: 0 clamp(.8rem, 2vw, 2rem);
}

.benefit-item:not(:last-child)::after {
content: "";
position: absolute;
right: 0;
top: 18%;
bottom: 14%;
width: 1px;
background: rgba(255, 255, 255, .35);
}

.benefit-icon {
align-items: center;
background: #fff;
border: 5px solid var(--orange);
border-radius: 50%;
color: var(--orange);
display: inline-flex;
font-size: 2.15rem;
height: 92px;
justify-content: center;
margin-bottom: 1rem;
width: 92px;
}

.brand-combo {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: clamp(1.2rem, 4vw, 3rem);
justify-content: center;
}

.partner-logo {
align-items: center;
color: var(--ink);
display: inline-flex;
gap: .9rem;
line-height: 1;
}

footer {background:#333;padding:25px 0; *float:left; *width:100%;}
.MILogo{width:170px;}
footer p{color:#fff;margin:15px 0 10px;}
.social-icons {overflow: hidden;text-align: center;margin:15px 0px;}
.social-icons ul {margin: 0;padding: 0;list-style: none;}
.social-icons ul li {margin: 0 5px 10px;display: inline-block; text-align:center;}
.social-icons ul li a{display: block; background:3F3F3F;width: 40px;height: 40px;font-size: 18px;color:#fff;line-height: 36px;border-radius:50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;-o-border-radius: 50%;border-radius: 50%;border: 2px solid #3F3F3F;-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-ms-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;}
.social-icons ul li a:hover {background:#AF946D;border: 2px solid #AF946D;color:#FFF;-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-ms-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;}


.footer_links a{
color: var(--ink); text-decoration:none; margin:0 .5rem;
}
.footer_links a:hover{
color:var(--blue);
}

.partner-logo img {
height:80px; width:auto;
}

.partner-logo .word {
font-size: clamp(1.5rem, 3vw, 2.55rem);
letter-spacing: .22rem;
}

.plus {
color: var(--blue);
font-size: clamp(2rem, 4vw, 3.3rem);
font-weight: 400;
}

.workflow {
position: relative;
}

.workflow-line {
position: absolute;
top:75px;
left: 8%;
right: 8%;
border-top: 2px dashed #c4d7ef;
}

.workflow-step {
position: relative;
text-align: center;
z-index: 1;
}

.workflow-dot {
align-items: center;
background: #fff;
border: 4px solid #cfe0f7;
border-radius: 50%;
box-shadow: var(--shadow);
color: var(--blue);
display: inline-flex;
font-size: 2rem;
height: 90px;
justify-content: center;
outline: 8px solid #fff;
width: 90px;
transition:ease .3s all;
}

.workflow-step:hover .workflow-dot{
background:#cfe0f7;
transition:ease-in-out .3s all;
}

.workflow-step::after {
content: "";
position: absolute;
right: -12px;
top: 45px;
width: 14px;
height: 14px;
background: var(--orange);
border-radius: 50%;
}

.workflow-step:last-child::after {
display: none;
}

.workflow-step small {
color: var(--blue);
display: block;
font-weight: 900;
margin-top: .8rem;
}

.workflow-step p {
color: var(--ink);
font-size: .82rem;
font-weight: 800;
line-height: 1.25;
margin: .2rem auto 0;
max-width: 116px;
}


@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .nav-link{        
padding-left:1rem;
padding-right:1rem;
    }
.row-cols-lg-7 > * {
flex: 0 0 auto;
width: 14.285714%;
}
}

.cta {
color: #fff;
background:
linear-gradient(90deg, rgba(0, 54, 130, .92), rgba(0, 54, 130, .78)),
url("https://images.unsplash.com/photo-1503387762-592deb58ef4e?auto=format&fit=crop&w=1800&q=80") center / cover;
}

.support-strip {
background:
linear-gradient(90deg, #fff, rgba(234, 244, 255, .78)),
radial-gradient(circle at 85% 50%, rgba(6, 77, 166, .1), transparent 27%);
}

.globe-icon {
align-items: center;
border: 3px solid #cfe0f7;
border-radius: 50%;
color: var(--blue);
display: flex;
flex: 0 0 auto;
font-size: 2.8rem;
height: 92px;
justify-content: center;
width: 92px;
}

.reveal {
opacity: 0;
transform: translateY(28px);
transition: opacity .7s ease, transform .7s ease;
}

.reveal.in-view {
opacity: 1;
transform: translateY(0);
}

.reveal.delay-1 {
transition-delay: .1s;
}

.reveal.delay-2 {
transition-delay: .2s;
}

.reveal.delay-3 {
transition-delay: .3s;
}

@media (max-width: 1199.98px) {
.navbar-nav .nav-link {
padding-inline: .62rem;
}

.world-panel {
min-height: 460px;
}
}

@media (max-width: 991.98px) {
.hero {
padding-top: 2rem;
}

.world-panel {
min-height: 430px;
margin-top: 2rem;
}

.city-badge.usa {
left: 16%;
}

.collab-label {
left: 50%;
}

.benefit-item:not(:last-child)::after,
.workflow-line,
.workflow-step::after {
display: none;
}

.workflow-step {
padding-bottom: 1.2rem;
}
}

@media (max-width: 575.98px) {
.site-header .container {
padding-inline: 1.1rem;
}

.brand-mark {
font-size: 2rem;
}

.hero h1 {
font-size: 2.55rem;
}

.hero .btn {
width: 100%;
}

.world-panel {
min-height: 365px;
}

.world-panel::after {
inset: 18% 6% 12% 9%;
}

.city-badge {
width: 122px;
border-width: 7px;
}

.city-badge.usa {
left: 6%;
top: 9%;
}

.city-badge.india {
right: 2%;
bottom: 14%;
}

.city-badge .tag {
font-size: .78rem;
}

.collab-label {
font-size: .96rem;
top: 54%;
width: 150px;
}

.section-pad {
padding: 3rem 0;
}

.service-card h3 {
min-height: auto;
}
}

@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-duration: .01ms !important;
}

.reveal {
opacity: 1;
transform: none;
}
}