/* GLOBAL */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
font-family:'Poppins',sans-serif;
background:#f8fafc;
overflow-x:hidden;
color:#1e293b;
line-height:1.7;
}

/* COLORS */

:root{
--primary:#FF5A1F;
--primary2:#FF7A3D;
--dark:#111827;
--light:#ffffff;
--gray:#64748b;
--section:#F8FAFC;
}

section{
padding:100px 0;
position:relative;
overflow:hidden;
}

.container{
position:relative;
z-index:2;
}

/* NAVBAR */
.custom-nav{
height:90px;
background:rgba(10,15,25,.95);
backdrop-filter:blur(18px);
padding:0;
transition:.4s;
box-shadow:0 10px 30px rgba(0,0,0,.35);
}

.logo-img{
height:60px;
transition:.4s;
}

.navbar-brand:hover .logo-img{
transform:scale(1.05);
}

.navbar-nav{
margin-left:auto;
align-items:center;
}

.nav-link{
color:#fff!important;
font-weight:500;
margin-left:28px;
position:relative;
transition:.4s;
}

.nav-link::after{
content:'';
position:absolute;
left:0;
bottom:-6px;
width:0;
height:3px;
background:var(--primary);
transition:.4s;
border-radius:30px;
}

.nav-link:hover::after,
.nav-link.active::after{
width:100%;
}

.nav-link:hover{
color:var(--primary)!important;
}

/* CONTACT HERO */
.contact-banner{
min-height:60vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
background:
linear-gradient(rgba(10,15,25,.78),
rgba(10,15,25,.82)),
url('../assets/about/Factory.jpeg');
background-size:cover;
background-position:center;
background-attachment:fixed;
position:relative;
}

.contact-banner::before{
content:'';
position:absolute;
width:550px;
height:550px;
background:rgba(255,90,31,.12);
filter:blur(120px);
border-radius:50%;
}

.contact-banner .container{
position:relative;
z-index:2;
}

.section-badge{
display:inline-block;
padding:8px 22px;
background:rgba(255,90,31,.12);
color:#FF5A1F;
border-radius:30px;
font-size:14px;
font-weight:600;
letter-spacing:2px;
margin-bottom:18px;
}

.contact-title{
font-size:68px;
font-weight:800;
color:#fff;
margin-bottom:20px;
}

.contact-subtitle{
font-size:20px;
color:#ddd;
max-width:720px;
margin:auto;
line-height:1.8;
}

/* CONTACT SECTION */
.contact-section{
background:#f8fafc;
padding:100px 0;
position:relative;
overflow:hidden;
}

.contact-section::before{
content:'';
position:absolute;
top:-180px;
left:-140px;
width:420px;
height:420px;
background:rgba(255,90,31,.08);
border-radius:50%;
filter:blur(120px);
}

.contact-section::after{
content:'';
position:absolute;
right:-180px;
bottom:-180px;
width:420px;
height:420px;
background:rgba(255,90,31,.06);
border-radius:50%;
filter:blur(120px);
}

/* Left Contact Card */

.contact-info-card{
background:#111827;
border-radius:28px;
padding:45px;
color:#fff;
box-shadow:0 25px 60px rgba(0,0,0,.18);
height:100%;
position:relative;
overflow:hidden;
}

.contact-info-card::before{
content:'';
position:absolute;
top:-120px;
right:-120px;
width:260px;
height:260px;
background:rgba(255,90,31,.10);
border-radius:50%;
filter:blur(80px);
}

.contact-heading{
font-size:36px;
font-weight:800;
margin:18px 0;
line-height:1.2;
}

.contact-text{
color:#cbd5e1;
line-height:1.8;
margin-bottom:35px;
}

.info-item{
display:flex;
align-items:flex-start;
gap:18px;
margin-bottom:28px;
}

.info-icon{
width:58px;
height:58px;
border-radius:18px;
background:linear-gradient(135deg,#FF5A1F,#FF7A3D);
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
box-shadow:0 12px 25px rgba(255,90,31,.28);
}

.info-icon i{
font-size:22px;
color:#fff;
}

.info-item h5{
font-size:18px;
font-weight:700;
margin-bottom:6px;
}

.info-item p{
margin:0;
color:#cbd5e1;
line-height:1.6;
}

/* Right Form Card */

.contact-form-card{
background:#fff;
border-radius:28px;
padding:45px;
box-shadow:0 25px 60px rgba(15,23,42,.10);
border:1px solid rgba(15,23,42,.06);
}

.contact-form-card h3{
font-size:34px;
font-weight:800;
color:#111827;
margin-bottom:28px;
}

.form-control{
border:1px solid #e5e7eb;
border-radius:16px;
padding:16px 18px;
font-size:15px;
transition:.3s;
box-shadow:none;
}

.form-control:focus{
border-color:#FF5A1F;
box-shadow:0 0 0 4px rgba(255,90,31,.12);
}

textarea.form-control{
resize:none;
}

.btn-contact{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
padding:16px 32px;
border:none;
border-radius:16px;
background:linear-gradient(135deg,#FF5A1F,#FF7A3D);
color:#fff;
font-weight:700;
font-size:16px;
transition:.35s;
box-shadow:0 18px 35px rgba(255,90,31,.28);
}

.btn-contact:hover{
transform:translateY(-4px);
box-shadow:0 24px 45px rgba(255,90,31,.36);
}

/* MAP SECTION */
.map-section{
padding:0;
background:#f8fafc;
}

.map-card{
border-radius:28px;
overflow:hidden;
box-shadow:0 25px 60px rgba(15,23,42,.12);
}

.map-card iframe{
width:100%;
height:450px;
border:0;
display:block;
}

/*==================================
FOOTER
==================================*/

.footer{

background:#111827;

padding:90px 0 30px;

color:#d1d5db;

}

.footer-logo{

height:70px;

margin-bottom:25px;

}

.footer-text{

line-height:1.9;

margin-bottom:30px;

color:#9ca3af;

}

.footer h4{

color:#fff;

margin-bottom:25px;

font-weight:700;

}

.footer ul{

list-style:none;

padding:0;

margin:0;

}

.footer ul li{

margin-bottom:15px;

}

.footer ul li a{

color:#9ca3af;

text-decoration:none;

transition:.3s;

}

.footer ul li a:hover{

color:#FF5A1F;

padding-left:8px;

}

.contact-info li{

display:flex;

gap:12px;

align-items:flex-start;

}

.contact-info i{

color:#FF5A1F;

margin-top:5px;

}

.footer-social{

display:flex;

gap:15px;

margin-top:20px;

}

.footer-social a{

width:45px;

height:45px;

background:#1f2937;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

transition:.35s;

}

.footer-social a:hover{

background:#FF5A1F;

transform:translateY(-5px);

}

.footer hr{

margin:50px 0 25px;

border-color:rgba(255,255,255,.08);

}

.footer-bottom{

text-align:center;

color:#9ca3af;

}

/* RESPONSIVE */

@media (max-width:991px){
.contact-title{
font-size:48px;
}
.contact-info-card,
.contact-form-card{
padding:34px;
}
.contact-heading{
font-size:30px;
}
.contact-form-card h3{
font-size:28px;
}
}
@media (max-width:576px){
.contact-title{
font-size:38px;
}
.contact-subtitle{
font-size:17px;
}
.section{
padding:70px 0;
}
}
/* ==========================================
   TONCHI GET DIRECTIONS BUTTON
========================================== */

.btn-tonchi {
    position: relative;
    overflow: hidden;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    padding: 12px 26px !important;

    border: 2px solid #ff5a1f !important;
    border-radius: 10px !important;

    background: #ff5a1f !important;
    color: #ffffff !important;

    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 600;

    text-decoration: none;

    cursor: pointer;

    box-shadow: 0 6px 18px rgba(255, 90, 31, 0.18);

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


/* Shine effect */

.btn-tonchi::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 70%;
    height: 100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.4),
        transparent
    );

    transform: skewX(-20deg);

    transition: left 0.6s ease;
}


/* Icon */

.btn-tonchi i {
    position: relative;
    z-index: 2;

    font-size: 16px;

    transition:
        transform 0.3s ease;
}


/* Text */

.btn-tonchi {
    text-align: center;
}


/* Hover */

.btn-tonchi:hover {
    background: #111827 !important;
    border-color: #111827 !important;

    color: #ffffff !important;

    transform: translateY(-4px);

    box-shadow:
        0 12px 28px rgba(17, 24, 39, 0.22);
}


/* Shine animation */

.btn-tonchi:hover::before {
    left: 140%;
}


/* Icon animation */

.btn-tonchi:hover i {
    transform: translateX(4px) rotate(-8deg);
}


/* Click */

.btn-tonchi:active {
    transform: translateY(-1px);

    box-shadow:
        0 5px 12px rgba(17, 24, 39, 0.15);
}


/* Focus */

.btn-tonchi:focus-visible {
    outline: 3px solid rgba(255, 90, 31, 0.25);
    outline-offset: 4px;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 576px) {

    .btn-tonchi {
        padding: 11px 20px !important;

        font-size: 13px;
    }

    .btn-tonchi i {
        font-size: 15px;
    }
}

.phone-link {
    color: inherit;
    text-decoration: none;
}

.phone-link:hover {
    text-decoration: underline;
}

.email-link {
    color: inherit;
    text-decoration: none;
}

.email-link:hover {
    text-decoration: underline;
}
.contact-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.contact-link:hover {
    text-decoration: underline;
}