﻿body { margin:0; font-family:Arial,sans-serif; background:#f5f7fa; color:#333; }
        header { background:linear-gradient(rgba(0,71,133,0.85),rgba(0,71,133,0.85)), url('images/bg.jpg') center/cover no-repeat;
                 padding:60px 20px; text-align:center; color:#fff; }
        header h1 { font-size:36px; margin-bottom:10px; }
        header p { font-size:18px; }

        .plans-container { display:flex; justify-content:center; gap:20px; margin:40px auto; flex-wrap:nowrap; overflow-x:auto; }
        .plan { background:#fff; border-radius:12px; padding:20px; width:250px; text-align:center;
                box-shadow:0 6px 14px rgba(0,0,0,0.1); position:relative; }
        .plan h2 { color:#004785; font-size:22px; margin-bottom:10px; }
        .plan .price { font-size:20px; font-weight:bold; color:#ff6600; margin:10px 0; }
        .plan ul { list-style:none; padding:0; margin:20px 0; text-align:left; }
        .plan ul li { margin:8px 0; }
        .plan ul li i { margin-right:8px; }
        .plan .buy-btn { background:#004785; color:#fff; border:none; padding:10px 15px; border-radius:6px;
                         cursor:pointer; width:100%; font-size:14px; }
        .plan .buy-btn:hover { background:#002e5a; }

        .plan.popular { border:2px solid #ff9800; }
        .plan .badge { position:absolute; top:10px; right:10px; background:#ff9800; color:#fff;
                       font-size:12px; font-weight:bold; padding:4px 10px; border-radius:12px; }

        .social-links { text-align:center; margin:40px 0 20px 0; }
        .social-links a { margin:0 10px; font-size:24px; color:#004785; transition:color 0.3s; }
        .social-links a:hover { color:#ff6600; }
.most-popular {
            position: absolute;
            top: 0px;
            right: 0px;
            background: #ff9800;
            color: white;
            padding: 5px 10px;
            font-size: 12px;
            border-radius: 4px;
        }
/* Tick and Cross colors */
.text-success { color: green; }
.text-danger { color: red; }
        footer { background:#002e5a; color:#fff; text-align:center; padding:20px; font-size:14px; }