:root {
            --primary: #0059ff;
            --secondary: #003298;
            --dark: #12355b;
            --light: #fff;
            --accent: #f36f36;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height: 1.6; color: #333; background: #f4f7fa; }

        header { background: var(--primary); color: white; padding: 1rem; text-align: center; }
        .logo { max-width: 200px; display: block; margin: 0 auto; }

        nav { background: var(--secondary); padding: 0.5rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
        nav a { color: white; text-decoration: none; font-size: 0.8rem; padding: 5px 10px; border: 1px solid rgba(255,255,255,0.2); }

        .hero { position: relative; height: 300px; background: var(--dark); background: url('/assets/REBHCBanner.jpg') center/cover; }
        
        main { max-width: 1000px; margin: 20px auto; padding: 0 15px; display: grid; gap: 20px; }
        article { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }

        .grid-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; margin-top: 2rem; }
        .action-card { border: 1px solid #ddd; padding: 1rem; text-align: center; }
        .action-card img { max-width: 60px; display: block; margin: 0 auto 10px; }

        footer { background: #000; color: #777; text-align: center; padding: 2rem; margin-top: 2rem; font-size: 0.9rem; }

        @media (min-width: 768px) {
            main { grid-template-columns: 2fr 1fr; }
        }