:root { --primary: #2c3e50; --secondary: #e67e22; --accent: #0984e3; --light: #f5f6fa; }
body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--light); color: #333; line-height:1.7; }
.navbar { background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.05); padding: 12px 0; border-top: 4px solid var(--secondary); }
.navbar-brand img { height: 50px; width: auto; }
.hero-header { position:relative; background: #2c3e50; color:#fff; padding: 100px 0; text-align:center; overflow:hidden; }
.hero-header img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; opacity: 0.35; z-index:0; }
.hero-header .container { position:relative; z-index:1; }
.btn-primary { background: var(--secondary); border:none; padding: 12px 30px; border-radius:50px; font-weight:700; transition:0.3s; }
.btn-primary:hover { background: #d35400; transform: translateY(-2px); }
.card-service { background: #fff; border-radius: 15px; border:none; padding:30px; transition:0.3s; height:100%; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
.card-service:hover { transform: translateY(-8px); box-shadow: 0 12px 30px rgba(0,0,0,0.1); }
.icon-box { width: 70px; height: 70px; background: #fff5eb; color: var(--secondary); display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:2rem; margin: 0 auto 20px; }
.footer { background: #1a252f; color: #fff; padding: 70px 0 20px; font-size: 0.95rem; }
.footer a { color: #bdc3c7; }
.content-body h2, .content-body h3 { margin-top:35px; color: var(--primary); font-weight:700; border-left: 5px solid var(--secondary); padding-left: 15px; }
.content-body p { margin-bottom: 20px; text-align: justify; }
.check-list { list-style:none; padding:0; margin: 25px 0; }
.check-list li { position:relative; padding-left:30px; margin-bottom:12px; }
.check-list li::before { content:'\f058'; font-family:'Font Awesome 5 Free'; font-weight:900; color:#27ae60; position:absolute; left:0; }
.search-bar { height:60px; border-radius:30px; border: 2px solid #ddd; padding:0 25px; font-size: 1.1rem; }
.badge-ozel { background: #c0392b; color: #fff; font-size: 0.7rem; padding: 2px 8px; border-radius:4px; vertical-align: middle; }
@media (max-width: 768px) { .hero-header { padding: 60px 0; } .hero-header h1 { font-size: 2rem; } }