
        /* Header */
        header{
            background:linear-gradient(135deg,#1a1a1a,#2c2c2c);
            padding:1.2rem 5%;
            display:flex;
            justify-content:space-between;
            align-items:center;
            top:0;
            z-index:1000;
            box-shadow:0 3px 15px rgba(0,0,0,.6);
        }
        .logo{
            font-size:1.9rem;
            font-weight:700;
            color:#ffc107;
        }
        nav a{
            margin-left:1.8rem;
            font-weight:600;
            color:#ddd;
            transition:.3s;
        }
        nav a:hover{color:#ffc107;}

        /* Hero */
        .hero{
            background:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,.75)),url('https://images.unsplash.com/photo-1621570074028-9f8c7c2b5e8d?auto=format&fit=crop&w=1350&q=80') center/cover;
            text-align:center;
            padding:7rem 5% 5rem;
        }
        .hero h1{
            font-size:3.2rem;
            color:#ffc107;
            margin-bottom:.8rem;
        }
        .hero h2{
            font-size:1.8rem;
            color:#fff;
            margin-bottom:1rem;
        }
        .hero p{
            max-width:900px;
            margin:1rem auto;
            font-size:1.1rem;
        }

        /* Badge */
        .badge{
            display:inline-block;
            background:#ffc107;
            color:#111;
            padding:.5rem 1.3rem;
            border-radius:50px;
            font-weight:600;
            margin-bottom:1.5rem;
            font-size:.95rem;
        }

        /* Buttons */
        .btn{
            display:inline-block;
            background:#ffc107;
            color:#111;
            padding:.9rem 2.2rem;
            border-radius:50px;
            font-weight:600;
            margin:1rem .6rem;
            transition:.3s;
        }
        .btn:hover{
            background:#ffb300;
            transform:translateY(-4px);
            box-shadow:0 5px 15px rgba(255,193,7,.4);
        }
        .btn-outline{
            background:transparent;
            border:2px solid #ffc107;
            color:#ffc107;
        }
        .btn-outline:hover{
            background:#ffc107;
            color:#111;
        }

        /* Section */
        .section{
            padding:4rem 5%;
            max-width:1200px;
            margin:auto;
        }
        .section h3{
            font-size:1.8rem;
            color:#ffc107;
            margin-bottom:1rem;
            text-align:center;
        }
        .section p{
            margin-bottom:1.2rem;
        }
        .list{
            display:grid;
            grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
            gap:1.5rem;
            margin:2rem 0;
        }
        .list li{
            background:#fff;
            padding:1.2rem;
            border-radius:10px;
            border-left:4px solid #ffc107;
            transition:.3s;
        }
        .list li:hover{
            transform:translateX(8px);
            box-shadow:0 4px 12px rgba(255,193,7,.1);
        }

        /* WhatsApp Float */
        .whatsapp{
            position:fixed;
            right:20px;
            bottom:20px;
            background:#25d366;
            color:#fff;
            width:62px;
            height:62px;
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:2rem;
            box-shadow:0 5px 15px rgba(0,0,0,.5);
            z-index:999;
            transition:.3s;
        }
        .whatsapp:hover{transform:scale(1.15);}

        /* Footer */
        footer{
            background:#111;
            text-align:center;
            padding:2.5rem 5%;
            font-size:.9rem;
            border-top:1px solid #333;
        }
        footer a{color:#ffc107;}

        /* Responsive */
        @media (max-width:768px){
            .hero h1{font-size:2.4rem;}
            .hero h2{font-size:1.5rem;}
            .list{grid-template-columns:1fr;}
        }
        #bgdarki{
          background: #000;
        }