/*==============================
VG TECHWORLD
Author : VG TechWorld
==============================*/

:root{

--primary:#2563eb;
--secondary:#0f172a;
--accent:#06b6d4;
--white:#ffffff;
--gray:#94a3b8;
--light:#f8fafc;
--dark:#020617;

--radius:16px;

--transition:.35s;

--shadow:0 15px 35px rgba(0,0,0,.15);

}

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

html{
scroll-behavior:smooth;
}

body{

background:linear-gradient(135deg,#020617,#0f172a,#111827);

color:#fff;

overflow-x:hidden;

}

img{

max-width:100%;

display:block;

}

a{

text-decoration:none;

}

ul{

list-style:none;

}

section{

padding:90px 8%;

}

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

header{

position:fixed;

top:0;

left:0;

width:100%;

z-index:9999;

transition:.4s;

}

.navbar{

max-width:1400px;

margin:auto;

display:flex;

justify-content:space-between;

align-items:center;

padding:18px 40px;

background:rgba(10,15,30,.45);

backdrop-filter:blur(18px);

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

border-radius:18px;

margin-top:15px;

}

.logo{

font-size:30px;

font-weight:700;

color:#fff;

}

.logo span{

color:#3b82f6;

}

.nav-links{

display:flex;

gap:35px;

list-style:none;

}

.nav-links a{

color:#fff;

text-decoration:none;

font-weight:500;

position:relative;

transition:.3s;

}

.nav-links a::after{

content:"";

position:absolute;

left:0;

bottom:-8px;

width:0;

height:2px;

background:#3b82f6;

transition:.4s;

}

.nav-links a:hover::after{

width:100%;

}

header.sticky .navbar{

background:#081320;

box-shadow:0 15px 40px rgba(0,0,0,.35);

margin-top:0;

border-radius:0;

max-width:100%;

}

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

.hero{

min-height:100vh;

display:grid;

grid-template-columns:1fr 1fr;

align-items:center;

gap:60px;

padding-top:120px;

}

.badge{

display:inline-block;

padding:10px 20px;

background:rgba(37,99,235,.18);

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

border-radius:50px;

margin-bottom:25px;

}

.hero h1{

font-size:65px;

line-height:1.15;

margin-bottom:25px;

font-weight:800;

}

.hero h1 span{

color:var(--primary);

}

.hero p{

font-size:18px;

color:#cbd5e1;

line-height:1.9;

margin-bottom:35px;

max-width:650px;

}

.hero-buttons{

margin-bottom:50px;

}

.hero-stats{

display:flex;

gap:45px;

}

.hero-stats h2{

font-size:40px;

color:var(--primary);

}

.hero-right{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:25px;

}

.glass-card{

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

backdrop-filter:blur(15px);

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

padding:35px;

border-radius:20px;

text-align:center;

transition:.4s;

box-shadow:var(--shadow);

}

.glass-card:hover{

transform:translateY(-12px);

}

.glass-card i{

font-size:45px;

margin-bottom:15px;

color:var(--primary);

}

/*================ TECH =================*/

.trust{

text-align:center;

}

.tech-grid{

display:grid;

grid-template-columns:repeat(5,1fr);

gap:25px;

margin-top:50px;

}

.tech-grid div{

background:#111827;

padding:22px;

border-radius:15px;

font-weight:600;

transition:.3s;

}

.tech-grid div:hover{

background:var(--primary);

}

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

.services{

text-align:center;

}

.service-grid{

margin-top:60px;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.service-card{

background:#111827;

padding:45px;

border-radius:20px;

transition:.4s;

}

.service-card:hover{

transform:translateY(-10px);

background:var(--primary);

}

.service-card i{

font-size:55px;

margin-bottom:20px;

}

/*================ CTA =================*/

.cta{

text-align:center;

background:linear-gradient(135deg,#2563eb,#0ea5e9);

border-radius:30px;

margin:80px 8%;

}

.cta h2{

font-size:45px;

margin-bottom:20px;

}

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

footer{

padding:70px 20px;

text-align:center;

background:#020617;

}

.footer-logo{

font-size:34px;

font-weight:800;

margin-bottom:20px;

}

.footer-logo span{

color:var(--primary);

}

.social{

margin:35px 0;

}

.social i{

font-size:24px;

margin:0 12px;

cursor:pointer;

transition:.3s;

}

.social i:hover{

color:var(--primary);

}
/* Sticky Navbar */

.sticky{

background:#020617;

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

}


/* Animation */

.service-card,

.glass-card,

.tech-grid div{

opacity:0;

transform:translateY(60px);

transition:.7s;

}

.show{

opacity:1;

transform:translateY(0);

}

/*================ WHY US =================*/

.why-us{

padding:100px 8%;

background:#07111f;

}

.section-title{

text-align:center;

max-width:800px;

margin:auto;

margin-bottom:70px;

}

.section-title span{

color:#3b82f6;

font-weight:600;

letter-spacing:2px;

}

.section-title h2{

font-size:48px;

margin:20px 0;

line-height:1.3;

}

.section-title p{

color:#b8c5d0;

font-size:17px;

line-height:30px;

}

.why-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}

.why-card{

background:#0d1b2a;

padding:35px;

border-radius:20px;

text-align:center;

transition:.4s;

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

}

.why-card:hover{

transform:translateY(-12px);

background:#2563eb;

}

.icon{

width:80px;

height:80px;

margin:auto;

border-radius:50%;

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

display:flex;

justify-content:center;

align-items:center;

font-size:35px;

margin-bottom:25px;

}

.why-card h3{

margin-bottom:15px;

}

.why-card p{

color:#d6d6d6;

line-height:28px;

}

.counter-area{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

margin-top:80px;

}

.counter-box{

background:#0d1b2a;

padding:35px;

text-align:center;

border-radius:20px;

}

.counter-box h2{

font-size:48px;

color:#3b82f6;

margin-bottom:10px;

}
/*================ FEATURED PROJECT =================*/

.featured-project{

padding:120px 8%;

}

.featured-project .container{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

.project-left h2{

font-size:48px;

margin:20px 0;

line-height:1.3;

}

.project-left p{

color:#b8c5d0;

line-height:32px;

margin-bottom:35px;

}

.project-list{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-bottom:40px;

}

.project-list div{

display:flex;

align-items:center;

gap:12px;

font-weight:600;

}

.project-list i{

color:#2563eb;

}

.laptop{

background:#111827;

padding:20px;

border-radius:25px;

box-shadow:0 20px 50px rgba(37,99,235,.25);

transition:.5s;

}

.laptop:hover{

transform:translateY(-12px);

}

.laptop img{

width:100%;

border-radius:15px;

display:block;

}

/*================ PORTFOLIO =================*/

.portfolio{

padding:120px 8%;

background:#050d18;

}

.portfolio-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

margin-top:70px;

}

.portfolio-card{

background:#0f172a;

border-radius:22px;

overflow:hidden;

transition:.4s;

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

}

.portfolio-card:hover{

transform:translateY(-15px);

box-shadow:0 20px 50px rgba(37,99,235,.30);

}

.portfolio-image{

position:relative;

overflow:hidden;

}

.portfolio-image img{

width:100%;

display:block;

transition:.5s;

}

.portfolio-card:hover img{

transform:scale(1.08);

}

.overlay{

position:absolute;

inset:0;

background:rgba(0,0,0,.65);

display:flex;

justify-content:center;

align-items:center;

opacity:0;

transition:.4s;

}

.portfolio-card:hover .overlay{

opacity:1;

}

.view-btn{

padding:12px 28px;

background:#2563eb;

border-radius:40px;

color:#fff;

font-weight:600;

}

.portfolio-content{

padding:28px;

}

.project-type{

color:#60a5fa;

font-size:14px;

font-weight:600;

}

.portfolio-content h3{

margin:12px 0;

font-size:24px;

}

.portfolio-content p{

color:#b8c5d0;

line-height:28px;

margin-bottom:20px;

}

.tech{

display:flex;

gap:10px;

flex-wrap:wrap;

}

.tech span{

padding:8px 15px;

background:#1e293b;

border-radius:30px;

font-size:13px;

}

/*================ PROCESS =================*/

.process{

padding:120px 8%;

background:#081320;

}

.process-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:70px;

}

.process-card{

position:relative;

background:#0f172a;

padding:40px 30px;

border-radius:20px;

text-align:center;

overflow:hidden;

transition:.4s;

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

}

.process-card:hover{

transform:translateY(-12px);

box-shadow:0 20px 45px rgba(37,99,235,.35);

}

.process-number{

position:absolute;

top:15px;

right:20px;

font-size:60px;

font-weight:800;

color:rgba(255,255,255,.05);

}

.process-icon{

width:90px;

height:90px;

margin:auto;

border-radius:50%;

background:#2563eb;

display:flex;

justify-content:center;

align-items:center;

font-size:35px;

margin-bottom:25px;

color:#fff;

}

.process-card h3{

margin-bottom:15px;

font-size:24px;

}

.process-card p{

color:#b8c5d0;

line-height:30px;

}

/*==========================
BACKGROUND ANIMATION
==========================*/

.bg-animation{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

overflow:hidden;

z-index:-1;

}

.bg-animation span{

position:absolute;

display:block;

border-radius:50%;

background:rgba(37,99,235,.12);

animation:float 20s linear infinite;

filter:blur(10px);

}

.bg-animation span:nth-child(1){

width:250px;

height:250px;

left:5%;

top:20%;

animation-duration:18s;

}

.bg-animation span:nth-child(2){

width:180px;

height:180px;

right:8%;

top:15%;

animation-duration:25s;

}

.bg-animation span:nth-child(3){

width:300px;

height:300px;

left:35%;

bottom:5%;

animation-duration:30s;

}

.bg-animation span:nth-child(4){

width:140px;

height:140px;

right:30%;

bottom:20%;

animation-duration:22s;

}

.bg-animation span:nth-child(5){

width:220px;

height:220px;

left:70%;

top:45%;

animation-duration:28s;

}

@keyframes float{

0%{

transform:translateY(0) rotate(0deg);

}

50%{

transform:translateY(-80px) rotate(180deg);

}

100%{

transform:translateY(0) rotate(360deg);

}

}

/*==========================
CURSOR GLOW
==========================*/

.cursor-glow{

position:fixed;

width:260px;

height:260px;

border-radius:50%;

background:radial-gradient(circle,
rgba(37,99,235,.25),
transparent 70%);

pointer-events:none;

transform:translate(-50%,-50%);

z-index:0;

transition:.08s linear;

}

.hero h1 span{

color:#3b82f6;

display:inline-block;

animation:pop 2s infinite;

}

@keyframes pop{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}

.btn-primary{

transition:.4s;

}

.btn-primary:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(59,130,246,.4);

}

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

.contact{

padding:120px 8%;

background:#081320;

}

.contact-wrapper{

display:grid;

grid-template-columns:1fr 1fr;

gap:60px;

align-items:center;

}

.contact-left h2{

font-size:48px;

line-height:60px;

margin:20px 0;

}

.contact-left h2 span{

color:#3b82f6;

}

.contact-left p{

color:#b9c7d6;

line-height:30px;

margin-bottom:40px;

}

.contact-box{

display:flex;

align-items:center;

gap:20px;

margin-bottom:25px;

padding:20px;

background:#111d2f;

border-radius:18px;

transition:.4s;

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

}

.contact-box:hover{

transform:translateX(10px);

border-color:#3b82f6;

}

.contact-box .icon{

width:60px;

height:60px;

background:#2563eb;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:24px;

color:#fff;

}

.contact-right{

background:#0f172a;

padding:40px;

border-radius:25px;

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

}

.contact-right .row{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

margin-bottom:20px;

}

.contact-right input,

.contact-right select,

.contact-right textarea{

width:100%;

padding:16px;

background:#081320;

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

border-radius:12px;

color:#fff;

outline:none;

font-size:15px;

}

.contact-right input:focus,

.contact-right textarea:focus,

.contact-right select:focus{

border-color:#3b82f6;

}

.contact-right textarea{

margin-bottom:20px;

resize:none;

}

@media(max-width:991px){

.contact-wrapper{

grid-template-columns:1fr;

}

.contact-right .row{

grid-template-columns:1fr;

}

.contact-left h2{

font-size:36px;

line-height:48px;

}

}

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

.footer{

background:#050d18;

padding:80px 8% 20px;

border-top:1px solid rgba(255,255,255,.08);

}

.footer-grid{

display:grid;

grid-template-columns:2fr 1fr 1fr 1.5fr;

gap:50px;

padding-bottom:50px;

}

.footer h2{

font-size:34px;

margin-bottom:20px;

}

.footer h2 span{

color:#3b82f6;

}

.footer h3{

margin-bottom:20px;

font-size:22px;

}

.footer p{

color:#b9c7d6;

line-height:28px;

}

.footer ul{

list-style:none;

padding:0;

}

.footer ul li{

margin-bottom:12px;

}

.footer ul li a{

text-decoration:none;

color:#b9c7d6;

transition:.3s;

}

.footer ul li a:hover{

color:#3b82f6;

padding-left:8px;

}

.social{

display:flex;

gap:15px;

margin-top:25px;

}

.social a{

width:48px;

height:48px;

border-radius:50%;

background:#0f172a;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

font-size:20px;

transition:.3s;

}

.social a:hover{

background:#2563eb;

transform:translateY(-6px);

}

.footer-bottom{

border-top:1px solid rgba(255,255,255,.08);

padding-top:25px;

text-align:center;

color:#9aa9b8;

}

@media(max-width:991px){

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.social{

justify-content:center;

}

}

/*================ ABOUT PAGE =================*/

.page-hero{

padding:170px 8% 120px;

background:linear-gradient(135deg,#07111f,#10233d);

text-align:center;

}

.page-hero h1{

font-size:60px;

line-height:75px;

margin:25px 0;

}

.page-hero p{

max-width:800px;

margin:auto;

color:#b7c5d6;

font-size:18px;

line-height:32px;

}

.about-company{

padding:110px 8%;

background:#081320;

}

.about-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

.about-image img{

width:100%;

border-radius:25px;

}

.about-text h2{

font-size:42px;

margin:20px 0;

}

.about-text p{

color:#b8c5d4;

line-height:30px;

margin-bottom:20px;

}

.about-features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-top:35px;

}

.about-features div{

display:flex;

align-items:center;

gap:12px;

font-weight:500;

}

.about-features i{

color:#3b82f6;

}

.mission{

padding:110px 8%;

background:#0b1727;

}

.mission-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:35px;

margin-top:60px;

}

.mission-card{

background:#122038;

padding:40px;

border-radius:25px;

transition:.4s;

}

.mission-card:hover{

transform:translateY(-12px);

}

.mission-icon{

width:75px;

height:75px;

background:#2563eb;

display:flex;

align-items:center;

justify-content:center;

border-radius:20px;

font-size:32px;

margin-bottom:25px;

}

.founder{

padding:110px 8%;

background:#081320;

}

.founder-grid{

display:grid;

grid-template-columns:420px 1fr;

gap:70px;

align-items:center;

}

.founder-image img{

width:100%;

border-radius:25px;

}

.founder-info{

display:flex;

gap:35px;

margin:35px 0;

}

.skills{

display:flex;

flex-wrap:wrap;

gap:15px;

}

.skills span{

padding:12px 20px;

background:#122038;

border-radius:30px;

}

.timeline{

padding:110px 8%;

background:#0b1727;

}

.timeline-item{

display:flex;

gap:40px;

margin-bottom:50px;

}

.year{

min-width:100px;

height:100px;

background:#2563eb;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:24px;

font-weight:700;

}

.timeline-content{

background:#122038;

padding:35px;

border-radius:20px;

width:100%;

}

.technology{

padding:110px 8%;

background:#081320;

}

.tech-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:60px;

}

.tech-card{

background:#122038;

padding:40px;

text-align:center;

border-radius:20px;

transition:.4s;

}

.tech-card:hover{

transform:translateY(-10px);

}

.tech-card i{

font-size:45px;

color:#3b82f6;

margin-bottom:20px;

display:block;

}

.company-stats{

padding:90px 8%;

background:#10233d;

}

.stats-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}

.stat-card{

background:#122038;

padding:40px;

text-align:center;

border-radius:20px;

}

.stat-card h2{

font-size:50px;

color:#3b82f6;

margin-bottom:10px;

}

.about-cta{

padding:120px 8%;

background:#081320;

}

.cta-box{

background:linear-gradient(135deg,#2563eb,#0f172a);

padding:70px;

border-radius:30px;

text-align:center;

}

.cta-box h2{

font-size:48px;

margin-bottom:20px;

}

.cta-box p{

max-width:700px;

margin:auto;

margin-bottom:40px;

line-height:30px;

}

.cta-buttons{

display:flex;

justify-content:center;

gap:20px;

flex-wrap:wrap;

}

@media(max-width:991px){

.about-grid,

.founder-grid,

.mission-grid{

grid-template-columns:1fr;

}

.tech-grid{

grid-template-columns:repeat(2,1fr);

}

.stats-grid{

grid-template-columns:repeat(2,1fr);

}

.page-hero h1{

font-size:42px;

line-height:55px;

}

}

@media(max-width:576px){

.tech-grid,

.stats-grid,

.about-features{

grid-template-columns:1fr;

}

.cta-box{

padding:40px 25px;

}

}

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

.services-page{

padding:110px 8%;

background:#081320;

}

.services-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

gap:35px;

margin-top:70px;

}

.service-box{

background:#101d30;

padding:35px;

border-radius:22px;

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

transition:.4s;

position:relative;

overflow:hidden;

}

.service-box::before{

content:"";

position:absolute;

left:0;

top:0;

width:100%;

height:4px;

background:#2563eb;

transform:scaleX(0);

transition:.4s;

}

.service-box:hover::before{

transform:scaleX(1);

}

.service-box:hover{

transform:translateY(-12px);

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

border-color:#2563eb;

}

.service-icon{

width:80px;

height:80px;

background:linear-gradient(135deg,#2563eb,#4f46e5);

border-radius:20px;

display:flex;

align-items:center;

justify-content:center;

font-size:34px;

color:#fff;

margin-bottom:25px;

}

.service-box h3{

font-size:24px;

margin-bottom:15px;

}

.service-box p{

color:#b9c7d6;

line-height:28px;

margin-bottom:20px;

}

.service-box ul{

padding:0;

list-style:none;

margin-bottom:25px;

}

.service-box ul li{

margin-bottom:12px;

padding-left:22px;

position:relative;

}

.service-box ul li::before{

content:"✔";

position:absolute;

left:0;

color:#3b82f6;

}

.service-box a{

display:inline-flex;

align-items:center;

gap:8px;

color:#3b82f6;

text-decoration:none;

font-weight:600;

}

.service-box a:hover{

gap:14px;

}

@media(max-width:768px){

.services-page{

padding:80px 5%;

}

}

/*================ PORTFOLIO ================*/

.portfolio{

padding:120px 8%;

background:#081320;

}

.portfolio-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:35px;

margin-top:60px;

}

.project-card{

background:#122038;

border-radius:25px;

overflow:hidden;

transition:.4s;

}

.project-card:hover{

transform:translateY(-12px);

}

.project-card img{

width:100%;

height:280px;

object-fit:cover;

}

.project-content{

padding:30px;

}

.project-tag{

background:#2563eb;

padding:8px 18px;

border-radius:30px;

font-size:13px;

display:inline-block;

margin-bottom:18px;

}

.project-content h3{

font-size:28px;

margin-bottom:15px;

}

.project-content p{

line-height:28px;

color:#b9c7d6;

margin-bottom:25px;

}

.tech-used{

display:flex;

gap:12px;

flex-wrap:wrap;

margin-bottom:25px;

}

.tech-used span{

background:#081320;

padding:10px 16px;

border-radius:30px;

font-size:14px;

}

.project-btn a{

display:inline-block;

padding:14px 30px;

background:#2563eb;

border-radius:12px;

text-decoration:none;

color:#fff;

}

@media(max-width:991px){

.portfolio-grid{

grid-template-columns:1fr;

}

}

/*================ PRICING ================*/

.pricing-page{

padding:120px 8%;

background:#081320;

}

.pricing-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

margin-top:70px;

}

.price-card{

background:#122038;

padding:45px;

border-radius:25px;

text-align:center;

position:relative;

transition:.4s;

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

}

.price-card:hover{

transform:translateY(-15px);

}

.featured{

border:2px solid #2563eb;

transform:scale(1.05);

}

.popular{

position:absolute;

top:-15px;

left:50%;

transform:translateX(-50%);

background:#2563eb;

padding:8px 18px;

border-radius:30px;

font-size:14px;

}

.plan{

font-size:18px;

color:#3b82f6;

font-weight:600;

}

.price-card h2{

font-size:55px;

margin:20px 0;

}

.price-card ul{

list-style:none;

padding:0;

margin:35px 0;

text-align:left;

}

.price-card li{

margin-bottom:15px;

}

@media(max-width:991px){

.pricing-grid{

grid-template-columns:1fr;

}

.featured{

transform:none;

}

}

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

.contact-page{

padding:120px 8%;

background:#081320;

}

.contact-grid{

display:grid;

grid-template-columns:420px 1fr;

gap:60px;

}

.contact-details h2{

font-size:42px;

margin-bottom:20px;

}

.contact-details p{

color:#b8c5d6;

margin-bottom:35px;

}

.info-box{

display:flex;

gap:20px;

margin-bottom:30px;

align-items:flex-start;

}

.info-box i{

width:65px;

height:65px;

background:#2563eb;

border-radius:18px;

display:flex;

align-items:center;

justify-content:center;

font-size:25px;

}

.contact-form{

background:#122038;

padding:45px;

border-radius:25px;

}

.contact-form form{

display:flex;

flex-direction:column;

gap:20px;

}

.contact-form input,

.contact-form select,

.contact-form textarea{

padding:18px;

background:#081320;

border:none;

border-radius:14px;

color:#fff;

font-family:Poppins;

}

.contact-form input:focus,

.contact-form textarea:focus,

.contact-form select:focus{

outline:2px solid #2563eb;

}

.map iframe{

width:100%;

height:450px;

border:none;

}

@media(max-width:991px){

.contact-grid{

grid-template-columns:1fr;

}

}