/*
Theme Name: Locksmith Landing
Author: AI Generated
Description: Fast mobile-first landing page for emergency lock opening services
Version: 1.0
*/

body{
font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial;
margin:0;
background:#f4f8fb;
color:#2b2b2b;
line-height:1.5;
}

.container{
padding:16px;
max-width:1000px;
margin:auto;
}

h1,h2,h3{margin-bottom:10px}

h1{font-size:26px}
h2{font-size:22px;text-align:center;margin:40px 0 20px}

.hero{text-align:center;padding:40px 10px}

.hero-sub{color:#555;margin-bottom:25px}

.call-btn{
display:block;
background:#1e88e5;
color:#fff;
padding:18px;
font-size:20px;
border-radius:10px;
text-decoration:none;
font-weight:bold;
max-width:320px;
margin:auto;
box-shadow:0 6px 14px rgba(0,0,0,0.15);
}

.call-btn:active{transform:scale(0.98)}

.service-grid{
display:grid;
grid-template-columns:1fr;
gap:16px;
}

.service-card{
background:#fff;
padding:20px;
border-radius:12px;
box-shadow:0 2px 8px rgba(0,0,0,0.08);
}

.price{
font-size:20px;
font-weight:bold;
color:#1e88e5;
}

.adv-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
}

.adv{
background:#fff;
padding:16px;
border-radius:10px;
text-align:center;
box-shadow:0 2px 8px rgba(0,0,0,0.08);
}

.about,.seo-text{margin-top:40px}

.contacts{text-align:center;margin-top:40px;padding-bottom:80px}

.phone{font-size:24px;font-weight:bold}

.map{
background:#d9e8f7;
height:200px;
border-radius:10px;
margin-top:20px;
display:flex;
align-items:center;
justify-content:center;
}

/* sticky call */

.sticky-call{
position:fixed;
bottom:15px;
left:50%;
transform:translateX(-50%);
background:#1976d2;
color:#fff;
padding:16px 28px;
border-radius:40px;
font-weight:bold;
text-decoration:none;
box-shadow:0 8px 20px rgba(0,0,0,0.25);
z-index:999;
}

/* whatsapp */

.whatsapp{
position:fixed;
right:16px;
bottom:80px;
background:#25D366;
color:#fff;
width:56px;
height:56px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-size:26px;
text-decoration:none;
box-shadow:0 6px 16px rgba(0,0,0,0.25);
z-index:998;
}

.instagram{
position:fixed;
right:16px;
bottom:150px;
background:#E4405F;
color:#fff;
width:56px;
height:56px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-size:24px;
text-decoration:none;
box-shadow:0 6px 16px rgba(0,0,0,0.25);
z-index:998;
}

@media(min-width:768px){

h1{font-size:36px}

.service-grid{
grid-template-columns:repeat(3,1fr);
}

.adv-grid{
grid-template-columns:repeat(4,1fr);
}

}