
    :root { --primary: #0f172a; --accent: #0ea5e9; --white: #fff; --light: #f8fafc; --text: #334155; }
    * { margin:0; padding:0; box-sizing:border-box; }
    html { overflow-y: scroll; }
    html, body { height: 100%; width: 100%; font-family: 'Segoe UI', sans-serif; background: var(--light); color: var(--text); line-height: 1.6; display: flex; flex-direction: column; }
    a { text-decoration:none; color:inherit; transition:0.3s; }
    .container { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

    .navbar { background:var(--white); height:80px; display:flex; align-items:center; position:sticky; top:0; z-index:1000; box-shadow:0 2px 10px rgba(0,0,0,0.05); }
    .nav-container { width:100%; display:flex; justify-content:space-between; align-items:center; }
    .logo-link { display: flex; align-items: center; }
    .logo-img { height: 60px; width: auto; }
    .nav-links { display:flex; gap:30px; list-style:none; }
    .nav-links a { font-weight:600; color:var(--primary); }
    .btn-nav { background:var(--primary); color:var(--white)!important; padding:10px 20px; border-radius:6px; }

    .header-section { background: linear-gradient(135deg, var(--primary), #1e293b); color: var(--white); padding: 100px 0; text-align: center; min-height: 350px; display: flex; flex-direction: column; justify-content: center; }
    .header-section h1 { font-size:3rem; margin-bottom:20px; line-height: 1.2; }
    .highlight { color:var(--accent); }
    .hero-buttons { display:flex; gap:20px; justify-content:center; margin-top:30px;}
    .btn-primary { background:var(--accent); color:var(--white); padding:12px 30px; border-radius:6px; border:none; cursor:pointer; font-weight:600;}
    .btn-secondary { border:2px solid var(--white); color:var(--white); padding:12px 30px; border-radius:6px; font-weight:600;}

    .section { padding:80px 0; flex: 1; }
    .section-title { text-align:center; font-size:2rem; margin-bottom:50px; color:var(--primary); }
    .grid-3 { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:30px; }
    .card { background:var(--white); padding:30px; border-radius:10px; text-align:center; box-shadow:0 4px 6px rgba(0,0,0,0.05); }
    .card .icon { font-size:3rem; margin-bottom:20px; }

    .service-row { display:flex; align-items:center; gap:50px; margin:60px 0; }
    .service-row.reverse { flex-direction: row-reverse; }
    .service-text { flex: 1; }
    .service-img-container { flex: 1; height: 350px; background-color: #e2e8f0; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
    .service-img-container img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .check-list { list-style:none; margin-top:20px; }
    .check-list li { margin-bottom:10px; padding-left:25px; position:relative; }
    .check-list li::before { content:"✔"; color:var(--accent); position:absolute; left:0; }
    .divider { border:0; height:1px; background:#e2e8f0; margin:40px 0; }

    .contact-wrapper { display:flex; gap:50px; background:var(--white); padding:40px; border-radius:10px; box-shadow:0 4px 15px rgba(0,0,0,0.05); }
    .contact-info, .contact-form-box { flex:1; }
    .form-group { margin-bottom:20px; }
    input, select, textarea { width:100%; padding:10px; border:1px solid #cbd5e1; border-radius:5px; box-sizing: border-box; }
    .full-width { width:100%; }

    footer { background:var(--primary); color:#94a3b8; padding:50px 0 20px; margin-top:auto; }
    .footer-content { display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px; }
    .footer-bottom { text-align:center; border-top:1px solid #1e293b; padding-top:20px; margin-top: 40px;}

    @media (max-width:768px) {
        .navbar { height:auto; min-height: auto; padding:15px 0 20px 0; background: var(--white); border-bottom: 1px solid #e2e8f0; position: relative; }
        .nav-container { flex-direction:column; gap:20px; }
        .nav-links { flex-direction:column; width:100%; align-items:center; gap:15px; display: flex; }
        
        .service-row, .service-row.reverse, .contact-wrapper { flex-direction:column; }
        .service-img-container { height: 250px; width: 100%; }
        .header-section { min-height: auto; padding: 60px 0; }
    }
    