:root{--dark:#0f2a52;--blue:#1e5bb8;--green:#16a34a;--gray:#f8fafc;--text:#1e293b}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter,system-ui,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--gray);line-height:1.65}
a{color:var(--blue);text-decoration:none}
.topbar{background:var(--dark);color:#cbd5e1;font-size:.82rem;padding:6px 20px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.site-header{background:white;box-shadow:0 2px 12px rgba(0,0,0,.07);position:sticky;top:0;z-index:100}
.site-header .container{max-width:1220px;margin:0 auto;padding:12px 20px;display:flex;justify-content:space-between;align-items:center}
.logo{font-weight:900;font-size:1.45rem;color:var(--dark)} .logo span{color:var(--blue)}
.main-nav ul{list-style:none;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.main-nav a{font-weight:600;font-size:.95rem} .phone{background:var(--green);color:white!important;padding:9px 18px;border-radius:8px}
.hero{padding:50px 20px;background:white}
.hero .container{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.badge{display:inline-flex;gap:8px;background:#eff6ff;color:var(--blue);padding:6px 12px;border-radius:50px;font-size:.8rem;font-weight:700;margin-bottom:12px}
.hero h1{font-size:2.7rem;line-height:1.05;font-weight:900;color:var(--dark);margin-bottom:14px} .hero h1 em{color:var(--blue);font-style:normal}
.hero p{color:#475569;font-size:1.05rem}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border-radius:10px;font-weight:800}
.btn-primary{background:var(--dark);color:white} .btn-secondary{border:2px solid var(--dark);color:var(--dark)}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px} .pills a{background:white;border:1px solid #e2e8f0;padding:6px 12px;border-radius:50px;font-size:.82rem;font-weight:600;color:#334155}
.trustbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px} .trustbar div{background:var(--gray);border:1px solid #e2e8f0;padding:10px 14px;border-radius:10px;font-size:.85rem;font-weight:600}
.hero figure{position:relative} .hero img{width:100%;height:420px;object-fit:cover;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.section{padding:60px 20px} .section .container{max-width:1220px;margin:0 auto}
.section h2{font-size:2rem;font-weight:900;color:var(--dark);margin-bottom:8px}
.section .lead{color:#64748b;margin-bottom:28px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:white;border:1px solid #e2e8f0;border-radius:14px;padding:22px;transition:.2s} .card:hover{box-shadow:0 8px 24px rgba(0,0,0,.08)}
.card h3{font-size:1.05rem;margin:10px 0 6px} .card p{font-size:.92rem;color:#475569}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;background:var(--dark);color:white;border-radius:16px;padding:22px}
.stat b{font-size:1.8rem;display:block} .stat span{font-size:.85rem;color:#cbd5e1}
.masonry{columns:3;column-gap:16px} .masonry figure{background:white;border-radius:12px;overflow:hidden;margin-bottom:16px;break-inside:avoid;border:1px solid #e2e8f0}
.masonry img{width:100%;height:230px;object-fit:cover;display:block} .masonry figcaption{padding:10px 12px;font-weight:600;font-size:.85rem}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} .step{background:white;border:1px solid #e2e8f0;border-radius:14px;padding:22px}
.step .num{width:44px;height:44px;background:var(--dark);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;margin-bottom:10px}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.review{background:white;border:1px solid #e2e8f0;border-radius:14px;padding:20px} .stars{color:#f59e0b}
.long-seo{background:white;border-top:1px solid #e2e8f0;padding:60px 20px} .long-seo .container{max-width:860px;margin:0 auto}
.long-seo p{margin-bottom:14px;color:#334155}
.faq dl{max-width:900px;margin:0 auto;border:1px solid #e2e8f0;border-radius:14px;overflow:hidden;background:white}
.faq dt{padding:16px 20px;font-weight:700;background:#f8fafc;border-bottom:1px solid #e2e8f0;cursor:pointer}
.faq dd{padding:14px 20px;border-bottom:1px solid #e2e8f0;color:#475569;font-size:.94rem;margin:0}
.cta{background:linear-gradient(135deg,var(--dark),var(--blue));color:white;text-align:center;padding:50px 20px;border-radius:16px}
.site-footer{background:var(--dark);color:#cbd5e1;padding:50px 20px;margin-top:40px} .site-footer .container{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
.site-footer h4{color:white;margin-bottom:10px} .site-footer a{color:#cbd5e1}
.fixed-call{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:9999;background:var(--dark);color:white;padding:18px 10px;writing-mode:vertical-rl;border-radius:12px 0 0 12px;font-weight:800;box-shadow:-4px 0 20px rgba(0,0,0,.3)}
.floating{position:fixed;bottom:20px;right:20px;z-index:9998;display:flex;flex-direction:column;gap:12px}
.float-btn{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:22px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.float-call{background:var(--green)} .float-wa{background:#22c55e}
@media(max-width:900px){.hero .container{grid-template-columns:1fr} .cards,.steps,.reviews,.stats{grid-template-columns:1fr 1fr} .masonry{columns:2} .site-footer .container{grid-template-columns:1fr}}
@media(max-width:600px){.cards,.steps,.reviews,.stats{grid-template-columns:1fr} .masonry{columns:1} .hero h1{font-size:1.9rem}}