@charset "utf-8";
/* CSS Document */

@font-face {font-family: "Corporate A BQ"; 
src: url(fonts/corporate-a-bq.ttf);  }
 
@font-face {font-family: "Corporate S"; 
src: url(fonts/corporate-s-bq-regular.ttf);
}

body{
font-family:'Corporate S', sans-serif;
margin:0;
scroll-behavior:smooth;
}

.container{
width:90%;
max-width:1200px;
margin:auto;
}

header{
background:#000;
color:white;
position:sticky;
top:0;
}

.header{
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 0;
}

nav a{
color:white;
margin-left:20px;
text-decoration:none;
}

.menu-toggle{
display:none;
font-size:24px;
cursor:pointer;
}

.hero{
background:url('images/hero-concesionario.jpg') center/cover;
color:white;
padding:300px 20px;
text-align:right;
}

.section{
padding:40px 0;
}

.gray{
background:#f5f5f5;
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
}

.card{
background:white;
padding:25px;
border:1px solid #ddd;
}

.slider{
position:relative;
height:400px;
overflow:hidden;
}

.slide{
position:absolute;
width:100%;
height:100%;
object-fit:cover;
opacity:0;
transition:opacity .6s;
}

.slide.active{
opacity:1;
}

.full{
width:100%;
margin-top:20px;
}

.whatsapp{
position:fixed;
bottom:80px;
right:20px;
background:#25D366;
color:white;
padding:15px;
border-radius:50%;
}

.turnos-btn{
position:fixed;
bottom:140px;/*80px;*/
right:20px;
background:black;
color:white;
padding:15px;
border-radius:50%;
}

.chatbot{
position:fixed;
bottom:20px;
right:15px;
background:transparent;
padding:15px;
border-radius:50%;
}

.chat-window{
display:none;
background:white;
padding:15px;
width:220px;
box-shadow:0 4px 10px rgba(0,0,0,0.2);
}

.fade{
opacity:0;
transform:translateY(20px);
transition:all .8s;
}

.fade.visible{
opacity:1;
transform:none;
}

footer{background-color: #000; color: #FFFFFF; padding: 40px;}
.social a {color: #FFFFFF; position: relative; }
.iso{width: 150px; height: auto;}


@media(max-width:768px){

.menu-toggle{
display:block;
}

nav{
display:none;
flex-direction:column;
background:black;
}

nav a{
margin:10px;
}

.hero{
padding:100px 20px;
}

}