
    :root{
      --brand:#10b981;        /* yeşil ana */
      --brand-dark:#0d8f6b;   /* koyu yeşil */
      --accent:#facc15;       /* altın vurgu */
      --ink:#0f172a;          /* koyu metin */
      --muted:#5b6576;
      --bg-gradient:linear-gradient(135deg,#f7fdfa 0%, #ffffff 100%);
    }
    html{scroll-behavior:smooth}
    body{font-family:'Poppins','Segoe UI',sans-serif;background:var(--bg-gradient);color:var(--ink)}

    /* Top mini bar */
    .topbar{background:#fff;border-bottom:1px solid rgba(0,0,0,.06)}

    /* Navbar */
    .navbar{background:#ffffffcc;backdrop-filter:blur(6px);box-shadow:0 2px 10px rgba(0,0,0,.05)}
    .navbar-brand{font-weight:800; letter-spacing:.1px; font-size:1.05rem;} /* biraz daha küçük */
    .navbar-brand .brand-accent{color:var(--brand)}
    .btn-outline-brand{border-color:var(--brand); color:var(--brand)}
    .btn-outline-brand:hover{background:var(--brand); color:#fff}

    /* Offcanvas */
    .offcanvas{background:linear-gradient(180deg,#f3fff8 0%, #eafdf4 100%); border-left:2px solid rgba(16,185,129,.12)}
    .offcanvas-header{background:linear-gradient(135deg,#10b981,#7cd4b7); color:#0b1b13}
    .offcanvas-title{font-weight:700}
    .menu-top{background:#fff; padding:1rem 1.25rem; border-bottom:1px solid rgba(0,0,0,.05)}
    .menu-top a.btn{border-radius:.75rem; font-weight:600; box-shadow:0 4px 12px rgba(16,185,129,.08)}
    .menu-top a.btn:hover{transform:translateY(-2px); box-shadow:0 6px 18px rgba(16,185,129,.15)}
    .menu-top .btn-success{background:#10b981; border:none}
    .menu-top .btn-success:hover{background:#0d8f6b}
    .menu-list{list-style:none; margin:0; padding:.5rem 0}
    .menu-list a{display:flex; align-items:center; gap:.8rem; padding:.9rem 1.25rem; color:#0b1220; font-weight:600; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.03); transition:.25s}
    .menu-list a:hover{background:rgba(16,185,129,.10); color:var(--brand); transform:translateX(4px)}
    .menu-footer{padding:.8rem 1.25rem; font-size:.82rem; color:#64748b; border-top:1px solid rgba(0,0,0,.05); text-align:center}
    .offcanvas.showing,.offcanvas.hiding{opacity:0; transform:translateX(100%); transition:all .35s ease}
    .offcanvas.show,.offcanvas.showing{opacity:1; transform:translateX(0)}
    .offcanvas-backdrop.show{opacity:.4; background:rgba(0,0,0,.45); transition:opacity .35s ease}
.menu-list {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
}

.menu-list li a {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 0.85rem 1.25rem;
    color: #0b1220;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.25s, color 0.25s, transform 0.25s;
    font-size: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, .03);
}

.menu-list li a:hover {
    background: rgba(14, 165, 233, 0.08);
    color: #0ea5e9;
    transform: translateX(4px);
}

.menu-list li:last-child a {
    border-bottom: none;
}

/* Emoji’ler */
.menu-list li a span {
    font-size: 1.2rem;
    line-height: 1;
}

.menu-list li a span.blue {
    color: #0ea5e9;
}

.menu-list li a span.pink {
    color: #ec4899;
}

.menu-list li a span.green {
    color: #22c55e;
}

.menu-list li a span.gold {
    color: #facc15;
}

.menu-list li a span.red {
    color: #ef4444;
}

.menu-list li a span.purple {
    color: #8b5cf6;
}
    /* Hero */
    .hero{padding:52px 0}
    .glass{background:rgba(255,255,255,.78); border:1px solid rgba(16,185,129,.12); border-radius:1rem; box-shadow:0 10px 40px rgba(13,143,107,.12)}
    .badge-accent{background:var(--accent); color:#1f2937}

    /* Cards & buttons */
    .card{border:1px solid rgba(16,185,129,.14); border-radius:1rem}
    .card-hover:hover{transform:translateY(-4px); transition:.25s; box-shadow:0 16px 40px rgba(13,143,107,.15)}
    .btn-brand{background:var(--brand); border:none; color:#fff}
    .btn-brand:hover{background:var(--brand-dark)}
    .btn-ghost{border:1px solid var(--brand); color:var(--brand); background:transparent}
    .btn-ghost:hover{background:var(--brand); color:#fff}

    /* Float buttons */
    .float-btn{position:fixed; right:20px; width:54px; height:54px; border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.6rem; z-index:1055; transition:.3s; box-shadow:0 4px 15px rgba(0,0,0,.2)}
    .float-btn.wa{bottom:22px; background:#10b981}
    .float-btn.tel{bottom:85px; background:#0d8f6b}
    .float-btn:hover{transform:translateY(-3px) scale(1.05)}

    /* Minor tweaks */
    .text-green{color:var(--brand)}
    .list-check li i{color:var(--brand)}
