/* Apply border-box to all elements for easier sizing */
*{
box-sizing:border-box;
}

/* Global styles */
body {
background:#171c2f;
color:#f2f2f6;
font-family:'Segoe UI', Arial, sans-serif;
margin:0;
padding:0;
overflow-x:hidden;
}

/* Header styles (same as other pages) */
.site-header {
background:#21274a;
width:100%;
min-height:64px;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 3px 6px rgba(0,0,0,0.4);
position:relative;
z-index:1000;
overflow-x:hidden;
}
.header-container {
max-width:1360px;
width:100%;
padding:0 10px;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
position:relative;
}
.logo-link {
display:inline-block;
width:160px;
height:40px;
flex-shrink:0;
}
.logo-img {
width:160px;
height:40px;
display:block;
}
.main-nav {
display:flex;
align-items:center;
gap:15px;
flex-grow:1;
min-width:0;
}
.nav-list {
display:flex;
list-style:none;
margin:0;
padding:0;
gap:20px;
flex-shrink:1;
min-width:0;
overflow-x:auto;
scrollbar-width:none;
-ms-overflow-style:none;
}
.nav-list::-webkit-scrollbar {
display:none;
}
.nav-item {
white-space:nowrap;
}
.nav-list .nav-current {
color:#ffe600;
font-weight:700;
}
.nav-item a, .nav-current {
text-decoration:none;
color:#fff;
font-size:18px;
padding:14px 8px;
display:block;
transition:.2s color ease-in-out;
}
.nav-item a:hover {
color:#ffe600;
}
.auth-btns {
display:flex;
gap:10px;
flex-shrink:0;
}
.auth-btns.desktop-auth-btns {
margin-left:auto;
display:flex;
gap:10px;
flex-shrink:0;
}
.register-btn, .login-btn {
background:#ffe600;
color:#21274a;
border:none;
border-radius:5px;
padding:10px 22px;
font-weight:600;
font-size:17px;
text-decoration:none;
box-shadow:0 2px 5px rgba(29,38,50,0.08);
transition:background .2s,color .2s;
white-space:nowrap;
}
.login-btn {
background:#fff;
color:#21274a;
}
.register-btn:hover, .login-btn:hover {
background:#21274a;
color:#ffe600;
}
.hamburger {
display:none;
flex-direction:column;
justify-content:center;
align-items:center;
width:44px;
height:44px;
cursor:pointer;
background:none;
border:none;
transition:all .2s ease-in-out;
flex-shrink:0;
}
.hamburger span {
display:block;
height:4px;
width:28px;
background:#fff;
border-radius:3px;
margin:4px 0;
}

/* Mobile nav styles */
@media(max-width:1080px){
.auth-btns.desktop-auth-btns {
display:none;
}
.hamburger {
display:flex;
}
.nav-list {
display:none;
}
.main-nav {
flex-grow:0;
}
}
.mobile-nav {
display:none;
position:fixed;
top:0;
right:0;
width:81vw;
max-width:370px;
height:100vh;
background:#161c29;
z-index:2001;
flex-direction:column;
padding:60px 10px 70px 10px;
box-shadow:-8px 0 22px rgba(18,20,32,0.25);
overflow-y:auto;
}
.mobile-nav.active {
display:flex;
}
.mobile-nav-list {
list-style:none;
padding:0;
margin:0;
flex-grow:1;
}
.mobile-nav-list li {
padding:18px 20px;
font-size:20px;
color:#ffe600;
border-bottom:1px solid #22304a;
white-space:nowrap;
}
.mobile-nav-list li a {
color:#ffe600;
text-decoration:none;
display:block;
}
.mobile-auth-btns {
position:absolute;
bottom:24px;
left:0;
width:100%;
display:flex;
justify-content:center;
gap:28px;
padding:0 10px;
}
.mobile-auth-btns .register-btn,
.mobile-auth-btns .login-btn {
width:120px;
font-size:19px;
padding:13px 0;
border-radius:5px;
text-align:center;
display:flex;
align-items:center;
justify-content:center;
white-space:nowrap;
box-sizing:border-box;
}

/* Betting banner section */
.section-betting-banner {
position:relative;
background:linear-gradient(135deg,#4caf50 0%,#2e7d32 50%,#1b5e20 100%);
padding:80px 10px;
text-align:center;
border-radius:13px;
box-shadow:0 6px 16px rgba(76,175,80,0.3);
margin:22px 10px 0 10px;
max-width:calc(100% - 20px);
overflow:hidden;
}
.section-betting-banner h1 {
font-size:2.4rem;
font-weight:800;
color:#fff;
margin-bottom:15px;
line-height:1.1;
text-shadow:2px 2px 4px rgba(0,0,0,0.3);
}
.section-betting-banner p {
font-size:1.25rem;
margin-bottom:25px;
color:#fff;
line-height:1.4;
text-shadow:1px 1px 2px rgba(0,0,0,0.2);
}
.cta-betting-btn {
display:inline-block;
background:#fff;
color:#2e7d32;
font-weight:800;
font-size:20px;
padding:17px 40px;
border-radius:8px;
text-decoration:none;
box-shadow:0 4px 12px rgba(0,0,0,0.2);
transition:all .3s ease;
margin-bottom:20px;
}
.cta-betting-btn:hover {
background:#21274a;
color:#ffe600;
transform:translateY(-2px);
}
.section-betting-banner img {
display:block;
margin:20px auto 0 auto;
max-width:100%;
height:auto;
border-radius:10px;
box-shadow:0 4px 12px rgba(0,0,0,0.2);
}

/* Betting content sections */
.betting-content {
overflow-x:hidden;
width:100%;
}
.betting-content section {
padding:30px 10px;
margin-left:auto;
margin-right:auto;
max-width:1240px;
width:100%;
box-sizing:border-box;
}

/* Section headings */
.section-popular-sports h2,
.section-live-betting h2,
.section-kenyan-football h2,
.section-betting-markets h2,
.section-jackpot h2,
.section-betting-odds h2,
.section-mobile-betting h2,
.section-responsible-betting h2 {
font-size:1.6rem;
color:#ffe600;
margin-bottom:20px;
font-weight:700;
line-height:1.2;
text-align:center;
}

/* Sports grid */
.sports-grid {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin-top:20px;
}
.sport-card {
background:#24335e;
padding:25px 20px;
border-radius:12px;
text-align:center;
transition:transform .3s ease,box-shadow .3s ease;
}
.sport-card:hover {
transform:translateY(-5px);
box-shadow:0 8px 20px rgba(76,175,80,0.15);
}
.sport-icon {
font-size:3rem;
display:block;
margin-bottom:15px;
}
.sport-card h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:10px;
}
.sport-card p {
color:#f2f2f6;
font-size:0.95rem;
line-height:1.4;
margin-bottom:15px;
}
.sport-features {
display:flex;
flex-wrap:wrap;
gap:5px;
justify-content:center;
margin-bottom:15px;
}
.sport-features span {
background:#214159;
color:#ffe600;
font-size:0.8rem;
font-weight:600;
padding:3px 8px;
border-radius:3px;
}
.sport-bet-btn {
background:#4caf50;
color:#fff;
border:none;
border-radius:6px;
font-weight:600;
font-size:16px;
padding:10px 20px;
text-decoration:none;
transition:background .3s ease;
}
.sport-bet-btn:hover {
background:#2e7d32;
}

/* Live betting section */
.live-betting-content {
display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;
margin-top:20px;
margin-bottom:20px;
}
.live-betting-features {
background:#24335e;
padding:25px;
border-radius:10px;
}
.live-betting-features h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.live-betting-features p {
color:#f2f2f6;
font-size:1rem;
line-height:1.5;
margin-bottom:15px;
}
.live-betting-features ul {
color:#f2f2f6;
line-height:1.6;
padding-left:40px;
}
.live-betting-features li {
margin-bottom:8px;
margin-left:20px;
}
.live-betting-stats {
background:#214159;
padding:25px;
border-radius:10px;
text-align:center;
}
.live-betting-stats h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:20px;
}
.live-stats-grid {
display:grid;
grid-template-columns:1fr;
gap:15px;
}
.live-stat {
display:flex;
flex-direction:column;
align-items:center;
padding:15px;
background:#24335e;
border-radius:8px;
}
.stat-number {
font-size:2rem;
font-weight:800;
color:#4caf50;
line-height:1;
}
.stat-label {
font-size:0.9rem;
color:#f2f2f6;
margin-top:5px;
}
.live-betting-btn {
display:inline-block;
background:#4caf50;
color:#fff;
font-weight:600;
font-size:18px;
padding:15px 35px;
border-radius:8px;
text-decoration:none;
box-shadow:0 3px 10px rgba(76,175,80,0.3);
transition:all .3s ease;
}
.live-betting-btn:hover {
background:#2e7d32;
transform:translateY(-2px);
}

/* Kenyan teams grid */
.kenyan-teams-grid {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin-top:20px;
}
.team-card {
background:#24335e;
padding:20px;
border-radius:10px;
text-align:center;
border:2px solid transparent;
transition:border-color .3s ease;
}
.team-card:hover {
border-color:#4caf50;
}
.team-card h3 {
color:#ffe600;
font-size:1.2rem;
margin-bottom:10px;
}
.team-card p {
color:#f2f2f6;
font-size:0.95rem;
line-height:1.4;
margin-bottom:15px;
}
.team-odds {
background:#214159;
color:#4caf50;
font-weight:600;
font-size:0.9rem;
padding:8px 12px;
border-radius:5px;
}

/* Betting markets */
.markets-content {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
margin-top:20px;
}
.market-category {
background:#24335e;
padding:25px;
border-radius:10px;
}
.market-category h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.market-category ul {
color:#f2f2f6;
line-height:1.6;
padding-left:40px;
}
.market-category li {
margin-bottom:8px;
margin-left:20px;
}

/* Jackpot section */
.jackpot-content {
display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;
margin-top:20px;
}
.jackpot-info {
background:#214159;
padding:25px;
border-radius:10px;
text-align:center;
}
.jackpot-info h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.jackpot-info p {
color:#f2f2f6;
font-size:1rem;
line-height:1.5;
margin-bottom:20px;
}
.current-jackpot {
display:flex;
flex-direction:column;
align-items:center;
}
.jackpot-amount {
font-size:2.5rem;
font-weight:800;
color:#4caf50;
line-height:1;
}
.jackpot-label {
font-size:1rem;
color:#f2f2f6;
margin-top:5px;
}
.jackpot-features {
background:#24335e;
padding:25px;
border-radius:10px;
}
.jackpot-features h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.jackpot-features ul {
color:#f2f2f6;
line-height:1.6;
padding-left:40px;
margin-bottom:20px;
}
.jackpot-features li {
margin-bottom:8px;
margin-left:20px;
}
.jackpot-btn {
background:#4caf50;
color:#fff;
border:none;
border-radius:8px;
font-weight:600;
font-size:18px;
padding:15px 35px;
text-decoration:none;
box-shadow:0 3px 10px rgba(76,175,80,0.3);
transition:all .3s ease;
}
.jackpot-btn:hover {
background:#2e7d32;
transform:translateY(-2px);
}

/* Odds section */
.odds-comparison {
display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;
margin-top:20px;
}
.odds-info {
background:#24335e;
padding:25px;
border-radius:10px;
}
.odds-info h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.odds-info p {
color:#f2f2f6;
font-size:1rem;
line-height:1.5;
margin-bottom:20px;
}
.odds-examples {
display:flex;
flex-direction:column;
gap:15px;
}
.odds-example {
background:#214159;
padding:15px;
border-radius:8px;
}
.match {
color:#ffe600;
font-weight:600;
font-size:1rem;
display:block;
margin-bottom:8px;
}
.odds-values {
display:flex;
gap:10px;
}
.odds-values span {
background:#24335e;
color:#4caf50;
font-weight:600;
font-size:0.9rem;
padding:5px 10px;
border-radius:4px;
}
.odds-guarantee {
background:#214159;
padding:25px;
border-radius:10px;
text-align:center;
}
.odds-guarantee h3 {
color:#ffe600;
font-size:1.3rem;
margin-bottom:15px;
}
.odds-guarantee p {
color:#f2f2f6;
font-size:1rem;
line-height:1.5;
margin-bottom:20px;
}
.odds-btn {
background:#4caf50;
color:#fff;
border:none;
border-radius:8px;
font-weight:600;
font-size:18px;
padding:15px 35px;
text-decoration:none;
box-shadow:0 3px 10px rgba(76,175,80,0.3);
transition:all .3s ease;
}
.odds-btn:hover {
background:#2e7d32;
transform:translateY(-2px);
}

/* Mobile betting section */
.mobile-betting-features {
margin:20px 0;
}
.mobile-betting-feature {
display:flex;
align-items:flex-start;
gap:15px;
background:#24335e;
padding:20px;
border-radius:10px;
margin-bottom:15px;
}
.mobile-betting-icon {
font-size:2rem;
flex-shrink:0;
}
.mobile-betting-feature h3 {
color:#ffe600;
font-size:1.2rem;
margin-bottom:8px;
}
.mobile-betting-feature p {
color:#f2f2f6;
font-size:1rem;
line-height:1.4;
}
.mobile-betting-download {
text-align:center;
margin-top:20px;
}
.mobile-betting-app {
display:inline-block;
background:#ffe600;
color:#21274a;
font-weight:600;
font-size:18px;
padding:15px 30px;
border-radius:8px;
text-decoration:none;
transition:all .3s ease;
}
.mobile-betting-app:hover {
background:#21274a;
color:#ffe600;
}

/* Responsible betting */
.responsible-betting-tips {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin:20px 0;
}
.responsible-betting-tip {
background:#214159;
padding:20px;
border-radius:10px;
}
.responsible-betting-tip h3 {
color:#ffe600;
font-size:1.2rem;
margin-bottom:10px;
}
.responsible-betting-tip p {
color:#f2f2f6;
font-size:0.95rem;
line-height:1.4;
}

/* Footer styles (same as other pages) */
.site-footer {
background:#27294b;
width:100%;
padding:25px 10px 15px 10px;
margin-top:50px;
display:flex;
flex-direction:column;
gap:14px;
align-items:center;
box-shadow:inset 0 1px 0 rgba(255,255,255,0.15);
overflow-x:hidden;
}
.footer-payments {
display:flex;
gap:18px;
margin-bottom:12px;
justify-content:center;
flex-wrap:wrap;
max-width:680px;
padding:0 10px;
box-sizing:border-box;
width:100%;
}
.footer-providers {
display:flex;
gap:22px;
margin-bottom:12px;
flex-wrap:wrap;
justify-content:center;
align-items:center;
max-width:810px;
width:100%;
padding:0 10px;
box-sizing:border-box;
}
.footer-providers img {
background:#0b1122;
border-radius:8px;
padding:7px 5px;
height:auto;
max-height:53px;
object-fit:contain;
}
.footer-company-details {
color:#f0ecef;
font-size:13px;
text-align:center;
margin-top:14px;
max-width:750px;
line-height:1.6em;
padding:0 10px;
width:100%;
box-sizing:border-box;
}

/* Responsive design */
@media(max-width:1080px){
.header-container {
height:54px;
padding:0 15px;
}
.nav-list {
display:none;
}
.hamburger {
display:flex;
margin-left:auto;
}
.main-nav {
width:auto;
flex-grow:0;
gap:10px;
}
.betting-content section,
.section-betting-banner {
padding-left:10px;
padding-right:10px;
margin-left:10px;
margin-right:10px;
max-width:calc(100% - 20px);
}
}

@media(max-width:768px){
.sports-grid {
grid-template-columns:repeat(2,1fr);
gap:15px;
}
.live-betting-content {
grid-template-columns:1fr;
gap:20px;
}
.kenyan-teams-grid {
grid-template-columns:repeat(2,1fr);
gap:15px;
}
.markets-content {
grid-template-columns:1fr;
gap:20px;
}
.jackpot-content {
grid-template-columns:1fr;
gap:20px;
}
.odds-comparison {
grid-template-columns:1fr;
gap:20px;
}
.responsible-betting-tips {
grid-template-columns:1fr;
gap:15px;
}
.section-betting-banner {
padding:40px 10px;
}
.section-betting-banner img {
max-width:calc(100% - 20px);
margin:15px auto 0 auto;
}
}

@media(max-width:480px){
.sports-grid {
grid-template-columns:1fr;
gap:12px;
}
.kenyan-teams-grid {
grid-template-columns:1fr;
gap:12px;
}
.section-betting-banner h1 {
font-size:1.8rem;
}
.section-betting-banner p {
font-size:1.1rem;
}
.mobile-betting-feature {
flex-direction:column;
text-align:center;
}
.section-betting-banner img {
max-width:calc(100% - 10px);
margin:10px auto 0 auto;
border-radius:6px;
}
}

@media(max-width:320px){
.logo-link, .logo-img {
width:110px;
height:28px;
}
.section-betting-banner h1 {
font-size:1.4rem;
}
.section-betting-banner p {
font-size:1rem;
}
.betting-content section {
padding:20px 5px;
}
.section-betting-banner img {
max-width:calc(100% - 5px);
margin:8px auto 0 auto;
border-radius:4px;
}
}