/*====================================================
 MSRDC WEBSITE
 Maharashtra Softwares Research And Development Center
 Author : MSRDC
 Version : 1.0
======================================================*/

/*=====================================
 GOOGLE FONT
======================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

/*=====================================
 ROOT VARIABLES
======================================*/

:root{

--primary:#0A3D91;
--secondary:#FF7A00;
--success:#00A86B;
--danger:#dc3545;
--dark:#1f2937;
--light:#f8f9fa;
--white:#ffffff;
--gray:#6c757d;

--shadow:0 10px 30px rgba(0,0,0,.08);
--radius:12px;
--transition:.35s ease;

}

/*=====================================
 RESET
======================================*/

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{

font-family:'Poppins',sans-serif;
font-size:16px;
line-height:1.7;
background:#fff;
color:#333;
overflow-x:hidden;

}

/*=====================================
 LINKS
======================================*/

a{

text-decoration:none;
transition:all .3s;

}

a:hover{

color:var(--secondary);

}

/*=====================================
 HEADINGS
======================================*/

h1,h2,h3,h4,h5,h6{

font-weight:700;
color:var(--dark);

}

.section-title{

font-size:40px;
margin-bottom:20px;

}

.section-subtitle{

color:#777;
margin-bottom:40px;

}

/*=====================================
 IMAGES
======================================*/

img{

max-width:100%;
height:auto;

}

/*=====================================
 CONTAINER SPACING
======================================*/

section{

padding:90px 0;

}

/*=====================================
 TOP BAR
======================================*/

.top-bar{

background:var(--primary);
color:#fff;
font-size:14px;

}

.top-bar a{

color:#fff;

}

.top-bar i{

color:#FFD54F;
margin-right:5px;

}

/*=====================================
 NAVBAR
======================================*/

.navbar{

padding:15px 0;
background:#fff !important;
box-shadow:var(--shadow);
z-index:999;

}

.navbar-brand{

font-size:28px;
font-weight:800;
color:var(--primary)!important;

}

.navbar-brand img{

margin-right:10px;

}

.nav-link{

font-weight:600;
margin-left:10px;
margin-right:10px;
color:#333!important;

}

.nav-link:hover{

color:var(--primary)!important;

}

.navbar .dropdown-menu{

border:none;
box-shadow:var(--shadow);
border-radius:10px;

}

.dropdown-item{

padding:10px 18px;

}

.dropdown-item:hover{

background:var(--primary);
color:#fff;

}

/*=====================================
 BUTTONS
======================================*/

.btn{

border-radius:50px;
padding:12px 28px;
font-weight:600;
transition:all .35s;

}

.btn-primary{

background:var(--primary);
border:none;

}

.btn-primary:hover{

background:#062b67;
transform:translateY(-3px);

}

.btn-outline-primary{

border:2px solid var(--primary);
color:var(--primary);

}

.btn-outline-primary:hover{

background:var(--primary);
color:#fff;

}

.btn-success{

background:var(--success);
border:none;

}

/*=====================================
 CARD
======================================*/

.card{

border:none;
border-radius:var(--radius);
transition:all .35s;
box-shadow:var(--shadow);

}

.card:hover{

transform:translateY(-10px);

}

.card-body{

padding:30px;

}

/*=====================================
 ICONS
======================================*/

.fa-3x{

margin-bottom:20px;

}

.text-primary{

color:var(--primary)!important;

}

/*=====================================
 PRELOADER
======================================*/

#preloader{

position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#fff;
display:flex;
justify-content:center;
align-items:center;
z-index:99999;

}

.loader{

display:flex;
gap:8px;

}

.loader span{

width:15px;
height:15px;
background:var(--primary);
border-radius:50%;
animation:loader 1s infinite;

}

.loader span:nth-child(2){

animation-delay:.2s;

}

.loader span:nth-child(3){

animation-delay:.4s;

}

@keyframes loader{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

}

/*=====================================
 SCROLL TO TOP
======================================*/

#scrollTopBtn{

position:fixed;
bottom:30px;
right:30px;

width:55px;
height:55px;

border:none;

border-radius:50%;

background:var(--secondary);

color:#fff;

display:none;

cursor:pointer;

box-shadow:var(--shadow);

z-index:9999;

}

#scrollTopBtn:hover{

background:var(--primary);

}

/*=====================================
 UTILITIES
======================================*/

.shadow-custom{

box-shadow:var(--shadow);

}

.rounded-custom{

border-radius:var(--radius);

}

.text-orange{

color:var(--secondary);

}

.bg-primary-custom{

background:var(--primary);

}

.bg-light-custom{

background:#F4F7FC;

}

.mt-80{

margin-top:80px;

}

.mb-80{

margin-bottom:80px;

}

/*====================================================
 HERO SECTION
====================================================*/

.hero-section{

padding:120px 0;
background:linear-gradient(135deg,#eef5ff,#ffffff);
overflow:hidden;
position:relative;

}

.hero-section::before{

content:"";

position:absolute;

width:600px;
height:600px;

background:rgba(10,61,145,.05);

border-radius:50%;

top:-250px;
right:-200px;

}

.hero-section::after{

content:"";

position:absolute;

width:500px;
height:500px;

background:rgba(255,122,0,.05);

border-radius:50%;

bottom:-250px;
left:-200px;

}

.hero-section h1{

font-size:60px;
font-weight:800;
line-height:1.2;
margin-bottom:25px;
color:#0A3D91;

}

.hero-section h5{

font-size:18px;
letter-spacing:2px;
text-transform:uppercase;
color:#FF7A00;
font-weight:700;

}

.hero-section p{

font-size:18px;
color:#555;
margin-bottom:35px;

}

.hero-image{

animation:floatImage 5s ease-in-out infinite;
max-width:95%;

}

@keyframes floatImage{

0%{transform:translateY(0px);}
50%{transform:translateY(-20px);}
100%{transform:translateY(0px);}

}

/*====================================================
 ABOUT SECTION
====================================================*/

.about-section{

background:#ffffff;

}

.about-section img{

border-radius:20px;
box-shadow:0 15px 40px rgba(0,0,0,.15);

}

.about-section h2{

font-size:42px;
margin-bottom:20px;

}

.about-section p{

color:#666;
line-height:1.8;

}

.vision-card,
.mission-card{

background:#fff;
padding:30px;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.4s;

}

.vision-card:hover,
.mission-card:hover{

transform:translateY(-10px);

}

/*====================================================
 GLASS CARD
====================================================*/

.glass-card{

background:rgba(255,255,255,.6);

backdrop-filter:blur(15px);

border-radius:18px;

padding:30px;

border:1px solid rgba(255,255,255,.5);

box-shadow:0 10px 35px rgba(0,0,0,.08);

transition:.35s;

}

.glass-card:hover{

transform:translateY(-12px);

}

/*====================================================
 RESEARCH DOMAIN
====================================================*/

.domain-card{

background:#fff;

padding:35px;

text-align:center;

border-radius:15px;

box-shadow:0 8px 25px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.domain-card:hover{

background:#0A3D91;

color:#fff;

transform:translateY(-10px);

}

.domain-card:hover h5{

color:#fff;

}

.domain-card i{

font-size:50px;

color:#FF7A00;

margin-bottom:20px;

transition:.35s;

}

.domain-card:hover i{

color:#fff;

transform:rotate(360deg);

}

/*====================================================
 SERVICES
====================================================*/

.service-card{

background:#fff;

padding:35px;

text-align:center;

border-radius:20px;

box-shadow:0 10px 35px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.service-card:hover{

transform:translateY(-15px);

}

.service-card i{

font-size:55px;

color:#0A3D91;

margin-bottom:20px;

}

.service-card h4{

margin-bottom:20px;

}

/*====================================================
 PRODUCT CARD
====================================================*/

.product-card{

background:#fff;

border-radius:20px;

overflow:hidden;

box-shadow:0 12px 30px rgba(0,0,0,.10);

transition:.4s;

height:100%;

}

.product-card:hover{

transform:translateY(-12px);

}

.product-card img{

height:220px;

object-fit:cover;

}

.product-card-body{

padding:25px;

}

.product-card h3{

font-size:24px;

margin-bottom:15px;

}

.product-card p{

color:#666;

}

/*====================================================
 FEATURE ICON
====================================================*/

.feature-icon{

width:90px;

height:90px;

background:#0A3D91;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

margin:auto;

margin-bottom:20px;

}

.feature-icon i{

font-size:38px;

color:#fff;

}

/*====================================================
 SECTION TITLE
====================================================*/

.section-heading{

font-size:45px;

font-weight:800;

color:#0A3D91;

margin-bottom:15px;

}

.section-text{

max-width:750px;

margin:auto;

margin-bottom:60px;

color:#666;

font-size:18px;

}

/*====================================================
 HOVER BUTTON
====================================================*/

.btn-hover{

transition:.35s;

}

.btn-hover:hover{

transform:translateY(-5px);

box-shadow:0 12px 25px rgba(0,0,0,.15);

}

/*====================================================
 STATISTICS SECTION
====================================================*/

.stats-section{

background:linear-gradient(135deg,#0A3D91,#1A5FD0);
color:#fff;
padding:90px 0;

}

.stat-box{

text-align:center;
padding:30px;
transition:.35s;

}

.stat-box:hover{

transform:translateY(-10px);

}

.stat-box i{

font-size:55px;
color:#FFD54F;
margin-bottom:20px;

}

.stat-box h2{

font-size:52px;
font-weight:800;
color:#fff;

}

.stat-box p{

font-size:18px;
margin-top:10px;

}

/*====================================================
 PRODUCTS
====================================================*/

.products-section{

background:#F8FAFC;

}

.product-card{

border-radius:20px;
overflow:hidden;
background:#fff;
transition:.35s;
box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.product-card:hover{

transform:translateY(-12px);

}

.product-card img{

height:230px;
width:100%;
object-fit:cover;

}

.product-card-body{

padding:25px;

}

.product-card h4{

color:#0A3D91;
margin-bottom:15px;

}

.product-card .btn{

margin-top:15px;

}

/*====================================================
 RESEARCH PROJECTS
====================================================*/

.project-card{

background:#fff;
padding:30px;
border-radius:18px;
box-shadow:0 12px 25px rgba(0,0,0,.08);
transition:.35s;
height:100%;

}

.project-card:hover{

transform:translateY(-10px);

}

.project-card i{

font-size:50px;
color:#FF7A00;
margin-bottom:20px;

}

/*====================================================
 INTERNSHIP
====================================================*/

.internship-section{

background:#ffffff;

}

.internship-card{

background:#fff;
padding:30px;
border-radius:18px;
box-shadow:0 12px 30px rgba(0,0,0,.08);
transition:.35s;

}

.internship-card:hover{

transform:translateY(-10px);

}

.internship-card i{

font-size:45px;
color:#0A3D91;
margin-bottom:20px;

}

/*====================================================
 NEWS
====================================================*/

.news-card{

background:#fff;
border-radius:20px;
overflow:hidden;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.35s;

}

.news-card:hover{

transform:translateY(-10px);

}

.news-card img{

height:220px;
width:100%;
object-fit:cover;

}

.news-card-body{

padding:25px;

}

.news-date{

color:#FF7A00;
font-weight:600;

}

/*====================================================
 TESTIMONIALS
====================================================*/

.testimonial{

background:#fff;
padding:40px;
border-radius:20px;
box-shadow:0 12px 30px rgba(0,0,0,.08);
text-align:center;

}

.testimonial img{

width:90px;
height:90px;
border-radius:50%;
margin-bottom:20px;

}

.testimonial h5{

margin-top:15px;

}

.testimonial p{

font-style:italic;
color:#666;

}

/*====================================================
 GALLERY
====================================================*/

.gallery-item{

overflow:hidden;
border-radius:15px;

}

.gallery-item img{

transition:.4s;
width:100%;

}

.gallery-item:hover img{

transform:scale(1.1);

}

/*====================================================
 COUNTER
====================================================*/

.counter{

font-size:56px;
font-weight:800;
color:#fff;

}

/*====================================================
 PARTNER LOGOS
====================================================*/

.partner-logo{

padding:20px;
opacity:.75;
transition:.3s;

}

.partner-logo:hover{

opacity:1;
transform:scale(1.08);

}

/*====================================================
 CALL TO ACTION
====================================================*/

.cta-section{

background:linear-gradient(135deg,#FF7A00,#FF9D2F);
color:#fff;
padding:80px 0;
text-align:center;

}

.cta-section h2{

color:#fff;
font-size:42px;

}

.cta-section .btn{

background:#fff;
color:#0A3D91;
font-weight:700;

}

.cta-section .btn:hover{

background:#0A3D91;
color:#fff;

}

/*====================================================
 FOOTER
====================================================*/

.footer{

background:#0f172a;
color:#ffffff;
padding-top:70px;

}

.footer h4,
.footer h5{

color:#ffffff;
margin-bottom:20px;

}

.footer p{

color:#d1d5db;
line-height:1.8;

}

.footer ul{

padding:0;
list-style:none;

}

.footer ul li{

margin-bottom:12px;

}

.footer ul li a{

color:#d1d5db;
transition:.3s;

}

.footer ul li a:hover{

color:#ffffff;
padding-left:8px;

}

.footer .social-icons a{

display:inline-flex;

align-items:center;

justify-content:center;

width:42px;

height:42px;

background:#1e293b;

color:#fff;

border-radius:50%;

margin-right:10px;

transition:.35s;

}

.footer .social-icons a:hover{

background:#FF7A00;

transform:translateY(-5px);

}

/*====================================================
 NEWSLETTER
====================================================*/

.newsletter{

background:#16213E;

padding:40px;

border-radius:15px;

}

.newsletter input{

height:55px;

border-radius:50px;

padding-left:20px;

}

.newsletter button{

height:55px;

border-radius:50px;

}

/*====================================================
 CONTACT
====================================================*/

.contact-card{

background:#fff;

padding:35px;

border-radius:20px;

box-shadow:0 12px 30px rgba(0,0,0,.08);

height:100%;

}

.contact-card i{

font-size:42px;

color:#0A3D91;

margin-bottom:20px;

}

.contact-form input,
.contact-form textarea{

border-radius:12px;

padding:15px;

border:1px solid #ddd;

}

.contact-form input:focus,
.contact-form textarea:focus{

border-color:#0A3D91;

box-shadow:none;

}

/*====================================================
 GOOGLE MAP
====================================================*/

.map{

overflow:hidden;

border-radius:20px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

/*====================================================
 BACK TO TOP
====================================================*/

.back-to-top{

position:fixed;

right:25px;

bottom:25px;

width:55px;

height:55px;

background:#FF7A00;

color:#fff;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:22px;

box-shadow:0 8px 20px rgba(0,0,0,.2);

opacity:0;

visibility:hidden;

transition:.35s;

z-index:999;

}

.back-to-top.active{

opacity:1;

visibility:visible;

}

.back-to-top:hover{

background:#0A3D91;

color:#fff;

}

/*====================================================
 DARK MODE
====================================================*/

body.dark-mode{

background:#111827;

color:#f8f9fa;

}

body.dark-mode section{

background:#111827;

}

body.dark-mode .card,
body.dark-mode .glass-card,
body.dark-mode .product-card,
body.dark-mode .service-card{

background:#1f2937;

color:#ffffff;

}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5{

color:#ffffff;

}

body.dark-mode .navbar{

background:#111827 !important;

}

body.dark-mode .nav-link{

color:#ffffff !important;

}

body.dark-mode .footer{

background:#020617;

}

/*====================================================
 ANIMATIONS
====================================================*/

.fade-up{

animation:fadeUp .8s ease;

}

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(30px);

}

to{

opacity:1;

transform:translateY(0);

}

}

.zoom-in{

animation:zoomIn .6s ease;

}

@keyframes zoomIn{

from{

opacity:0;

transform:scale(.9);

}

to{

opacity:1;

transform:scale(1);

}

}

/*====================================================
 UTILITIES
====================================================*/

.text-primary{

color:#0A3D91 !important;

}

.text-orange{

color:#FF7A00 !important;

}

.bg-primary-custom{

background:#0A3D91;

}

.bg-orange{

background:#FF7A00;

}

.rounded-20{

border-radius:20px;

}

.shadow-lg-custom{

box-shadow:0 20px 40px rgba(0,0,0,.10);

}

/*====================================================
 RESPONSIVE
====================================================*/

@media(max-width:992px){

.hero-section{

padding:80px 0;

}

.hero-section h1{

font-size:42px;

}

.section-heading{

font-size:34px;

}

.navbar-brand{

font-size:22px;

}

}

@media(max-width:768px){

section{

padding:60px 0;

}

.hero-section{

text-align:center;

}

.hero-image{

margin-top:40px;

}

.stat-box{

margin-bottom:30px;

}

.footer{

text-align:center;

}

}

@media(max-width:576px){

.hero-section h1{

font-size:34px;

}

.btn{

padding:10px 20px;

font-size:14px;

}

.section-heading{

font-size:28px;

}

}

/*====================================================
 PRINT
====================================================*/

@media print{

.navbar,
.footer,
.back-to-top{

display:none;

}

body{

background:#fff;

}

}