/*
Theme Name: AutoTech PRO UI
Version: 3.0
*/

:root{
 --primary:#ff6b00;
 --dark:#0f1720;
 --card:#1f2933;
 --text:#e5e7eb;
}

body{
 margin:0;
 font-family:'Segoe UI',sans-serif;
 background:var(--dark);
 color:var(--text);
}

header{
 position:sticky;
 top:0;
 background:#0b1117;
 padding:15px 0;
 border-bottom:2px solid var(--primary);
}

.container{
 width:90%;
 margin:auto;
}

h1,h2,h3{color:#fff}

a{color:var(--primary);text-decoration:none}

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

.card{
 background:var(--card);
 border-radius:12px;
 overflow:hidden;
 transition:0.3s;
}

.card:hover{
 transform:translateY(-5px);
}

.card img{
 width:100%;
 height:180px;
 object-fit:cover;
}

.card-content{
 padding:15px;
}

.btn{
 display:inline-block;
 background:var(--primary);
 color:#fff;
 padding:10px 15px;
 border-radius:8px;
}

.hero{
 position:relative;
 margin-bottom:30px;
}

.hero img{
 width:100%;
 height:400px;
 object-fit:cover;
}

.hero-text{
 position:absolute;
 bottom:30px;
 left:30px;
}

footer{
 background:#0b1117;
 text-align:center;
 padding:20px;
 margin-top:40px;
}

@media(max-width:768px){
 .hero img{height:250px;}
}
.hero {
    margin-bottom: 40px;
}

.hero img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 12px;
}

.hero-text {
    position: absolute;
    bottom: 30px;
    left: 30px;
    max-width: 500px;
}

section {
    margin-bottom: 40px;
}