body{
margin:0;
font-family:Arial;
background:#f2eee7;
color:#000;
text-align:center;
}

.box{
margin-top:40px;
}
/* TOP HEADER */
.toplogo{
width:90px;
margin-bottom:10px;
}

.iso{
color:#38bdf8;
font-size:14px;
letter-spacing:1px;
}

/* MARKSHEET BOX */
.marksheet{
position:relative;
background:#0f172a;
padding:40px;
border-radius:12px;
overflow:hidden;
}

/* ⭐ BIG LIGHT CENTER LOGO */
.watermark{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:420px;      /* 👈 बड़ा size */
opacity:0.08;     /* 👈 बहुत हल्का */
z-index:0;
filter:grayscale(100%);
}

/* Student details watermark के ऊपर */
.result-content{
position:relative;
z-index:3;
}




.header img{
width:110px;
display:block;
margin:auto;
}

.header h2{
margin-top:8px;
font-weight:normal;
}

input,button{
padding:12px;
margin:6px;
border:none;
border-radius:6px;
}

button{
background:#22c55e;
color:#fff;
cursor:pointer;
}

.card{
max-width:420px;
margin:25px auto;
background:#f9fafb;
color:#111827;
border:1px solid #d1d5db;
padding:25px;
border-radius:12px;
box-shadow:0 0 15px rgba(0,0,0,0.5);
}

.card img{
display:block;
margin:auto;
margin-bottom:10px;
}

.pass{color:#22c55e;font-weight:bold}
.fail{color:#ef4444;font-weight:bold}

.printbtn{
background:#3b82f6;
margin-top:10px;
}

.marksheet{
max-width:650px;
margin:25px auto;
background:#ffffff;
color:#000;
padding:30px;
border-radius:8px;
box-shadow:0 0 15px rgba(0,0,0,0.2);
}

.marksheet table{
width:100%;
border-collapse:collapse;
margin-top:15px;
}

.marksheet th,
.marksheet td{
border:1px solid #ccc;
padding:10px;
text-align:left;

}

.badge-pass{
background:#22c55e;
color:#fff;
padding:5px 12px;
border-radius:20px;
font-size:14px;
}

.badge-fail{
background:#ef4444;
color:#fff;
padding:5px 12px;
border-radius:20px;
font-size:14px;
}
.result-box{
background: rgba(15,23,42,0.85); /* Dark Navy Glass */
border:1px solid rgba(59,130,246,0.3);
color:#e2e8f0;
}
 /* index */
 
  /* Reset */
    * { margin:0; padding:0; box-sizing: border-box; font-family: Arial, sans-serif; }
    body { background: #000; color: #fff; }

    /* Top White Section */
    .top-header {
        background: #fff;
        color: #000;
        text-align: center;
        padding: 30px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .top-header img {
        max-width: 120px;
        margin-bottom: 15px;
    }

    .top-header h1 {
        font-size: 2rem;
        margin-bottom: 5px;
    }

    .top-header p {
        font-size: 1rem;
        color: #555;
    }

    .iso-badge {
        margin-top: 10px;
        display: inline-block;
        background: #0f172a;
        color: #fff;
        padding: 5px 12px;
        border-radius: 5px;
        font-size: 0.9rem;
    }

    /* Main Content Dark Section */
    .main-content {
        background: #0f172a;
        padding: 40px 20px;
        border-radius: 20px 20px 0 0;
        margin-top: -10px;
    }

    .welcome { text-align: center; margin-bottom: 40px; }
    .welcome h2 { font-size: 1.8rem; margin-bottom: 10px; }
    .welcome p { font-size: 1rem; color: #cbd5e1; }

    /* Courses Grid */
    .courses {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 20px;
        margin-bottom: 40px;
    }

    .course-card {
        background: #fff;
        color: #0f172a;
        padding: 20px;
        border-radius: 10px;
        text-align: center;
        box-shadow: 0 3px 10px rgba(0,0,0,0.2);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        cursor: pointer;
    }

    .course-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.3);
    }

    .course-card h3 { margin-bottom: 10px; }
    .course-card p { font-size: 0.9rem; }

    /* Login Button */
    .login-btn {
        display: inline-block;
        padding: 12px 30px;
        background: #fff;
        color: #0f172a;
        font-size: 1rem;
        border-radius: 8px;
        transition: background 0.3s ease, color 0.3s ease;
        text-decoration: none; /* remove underline */
        margin: 0 auto 40px auto;
    }

    .login-btn:hover {
        background: #1e293b;
        color: #fff;
    }

    /* Notices */
    .notices {
        background: #1e293b;
        padding: 20px;
        border-radius: 10px;
        margin-bottom: 40px;
    }

    .notices h3 { margin-bottom: 15px; color: #fff; }
    .notices ul { list-style-type: none; padding-left: 20px; }
    .notices li { margin-bottom: 10px; color: #cbd5e1; }

    /* Footer */
    footer {
        background: #000;
        color: #fff;
        text-align: center;
        padding: 20px 10px;
        font-size: 0.9rem;
    }