:root {

            --primary-color: #e91e63; /* Hot Pink - High Conversion */

            --primary-hover: #c2185b;

            --dark-bg: #1a1a1a;

            --light-bg: #f4f6f8;

            --text-main: #333;

            --text-muted: #666;

            --border-color: #e1e4e8;

            --card-shadow: 0 2px 8px rgba(0,0,0,0.08);

        }



        body {

            font-family: 'Inter', sans-serif;

            background-color: var(--light-bg);

            color: var(--text-main);

            margin: 0;

            line-height: 1.6;

            font-size: 16px;

        }



        a { color: var(--primary-color); text-decoration: none; transition: 0.2s; }

        a:hover { color: var(--primary-hover); text-decoration: underline; }



        /* Container */

        .container { max-width: 1100px; margin: 0 auto; padding: 20px; }



        /* Header */

        header.site-header {

            background: #ffffff;

            border-bottom: 1px solid var(--border-color);

            padding: 15px 0;

            position: sticky;

            top: 0;

            z-index: 100;

            box-shadow: 0 2px 4px rgba(0,0,0,0.03);

        }

        .header-inner {

            max-width: 1100px;

            margin: 0 auto;

            display: flex;

            align-items: center;

            justify-content: space-between;

            padding: 0 20px;

        }

        

        /* Logo Styling */

        .site-logo {

            font-size: 1.5rem;

            font-weight: 800;

            color: var(--dark-bg);

            text-transform: uppercase;

            letter-spacing: -0.5px;

            display: flex;

            align-items: center;

            gap: 8px;

        }

        .site-logo span { color: var(--primary-color); } /* The word 'Picks' */



        /* Search Bar */

        .search-box form { display: flex; }

        .search-box input {

            padding: 10px 15px;

            border: 2px solid #eee;

            border-radius: 25px 0 0 25px;

            outline: none;

            width: 220px;

            font-size: 0.9rem;

            transition: border 0.3s;

        }

        .search-box input:focus { border-color: var(--primary-color); }

        .search-box button {

            padding: 10px 20px;

            background: var(--primary-color);

            color: white;

            border: none;

            border-radius: 0 25px 25px 0;

            cursor: pointer;

            font-weight: 600;

        }

        .search-box button:hover { background: var(--primary-hover); }



        /* Navigation */

        nav.main-nav {

            background: var(--dark-bg);

            color: white;

        }

        nav.main-nav ul {

            list-style: none;

            padding: 0;

            margin: 0 auto;

            max-width: 1100px;

            display: flex;

            padding-left: 20px;

        }

        nav.main-nav a {

            display: block;

            padding: 12px 20px;

            color: #ddd;

            font-size: 0.9rem;

            font-weight: 500;

            text-decoration: none;

        }

        nav.main-nav a:hover { color: #fff; background: rgba(255,255,255,0.1); }

        

        /* Mobile Responsive */

        @media (max-width: 768px) {

            .header-inner { flex-direction: column; gap: 15px; }

            .search-box input { width: 100%; }

            nav.main-nav ul { flex-wrap: wrap; justify-content: center; }

        }