/*
Theme Name: Jake's Hideout Custom Complete
Theme URI: https://example.com
Author: Jake / Custom
Author URI: https://example.com
Description: Full custom Jake's Hideout theme with demo content, admin panel, partner controls, and leaderboard layout. Designed to work great with WPBakery.
Version: 1.0.0
Text Domain: jh-custom-complete
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Bebas+Neue&display=swap');

:root {
    --jh-bg-main: #fff7ec;             /* soft cream base */
    --jh-bg-card: #f3f7ff;             /* pale baby blue cards */
    --jh-accent: #b4722f;              /* soft brown accent */
    --jh-accent-soft: rgba(180,114,47,0.22);
    --jh-text-main: #2e2520;           /* warm charcoal text */
    --jh-text-muted: #7a6a5f;          /* muted brown-grey */
    --jh-border-subtle: #e5d9c8;       /* light border */
}


*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    background:
        radial-gradient(circle at top, rgba(191,219,254,0.40), transparent 60%),
        radial-gradient(circle at bottom right, rgba(253,230,196,0.70), transparent 60%),
        #fff7ec;
    color: var(--jh-text-main);
    line-height: 1.6;
}


.jh-site { min-height:100vh; display:flex; flex-direction:column; }
.jh-main { flex:1; max-width:1120px; margin:0 auto; padding:1.75rem 1.25rem 3.5rem; }

/* Header */
.jh-header {
    position:sticky; top:0; z-index:40;
    backdrop-filter: blur(18px);
    background: linear-gradient(to bottom, rgba(255,247,236,0.96), rgba(243,247,255,0.94), rgba(243,247,255,0.88), transparent);
    border-bottom: 1px solid rgba(229,217,200,0.9);
}
.jh-header-inner {
    max-width:1120px; margin:0 auto;
    padding:0.9rem 1.25rem;
    display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.jh-brand { display:flex; align-items:center; gap:0.8rem; }
.jh-brand-logo {
    width:44px; height:44px; border-radius:999px;
    border:2px solid var(--jh-accent);
    background:radial-gradient(circle at 30% 25%, #fff7e3, #ffb347);
    box-shadow:0 0 20px rgba(255,139,36,0.7);
    display:inline-flex; align-items:center; justify-content:center; overflow:hidden;
}
.jh-brand-logo img { width:100%; height:100%; object-fit:cover; }
.jh-brand-text-main {
    font-family:'Bebas Neue', system-ui;
    letter-spacing:0.08em;
    font-size:1.7rem;
    text-transform:uppercase;
}
.jh-brand-text-sub {
    font-size:0.72rem;
    text-transform:uppercase;
    letter-spacing:0.18em;
    color:var(--jh-text-muted);
}

.jh-nav { display:flex; align-items:center; gap:1.75rem; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.16em; }
.jh-nav ul { list-style:none; display:flex; gap:1.2rem; padding:0; margin:0; }
.jh-nav a {
    text-decoration:none; color:var(--jh-text-muted);
    padding-bottom:0.15rem; border-bottom:2px solid transparent;
    transition:color .18s ease-out, border-color .18s ease-out, transform .18s ease-out;
}
.jh-nav a:hover,
.jh-nav .current-menu-item > a,
.jh-nav .current_page_item > a {
    color:#ffffff; border-color:var(--jh-accent); transform:translateY(-1px);
}

.jh-header-cta {
    padding:0.35rem 0.9rem;
    border-radius:999px;
    border:1px solid rgba(255,139,36,0.7);
    background:
        radial-gradient(circle at 0% 0%, rgba(255,139,36,0.45), transparent 70%),
        rgba(3, 6, 18, 0.9);
    font-size:0.7rem;
    text-transform:uppercase;
    letter-spacing:0.18em;
    color:#8b5a2b;
    display:inline-flex;
    align-items:center;
    gap:0.4rem;
    box-shadow:0 0 18px rgba(255,139,36,0.55);
}
.jh-header-cta-code { background:#b4722f; color:#161118; padding:0.1rem 0.55rem; border-radius:999px; font-weight:700; }

/* Hero */
.jh-hero {
    margin-top:1.6rem;
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(0,1.1fr);
    gap:2rem;
    align-items:center;
}
.jh-hero-card {
    background:
        radial-gradient(circle at top left, rgba(191,219,254,0.70), rgba(255,247,236,0.98));
    border-radius:2rem;
    border:1px solid rgba(255,139,36,0.35);
    padding:1.8rem 1.9rem;
    box-shadow:0 18px 40px rgba(15,23,42,0.22), 0 0 32px rgba(191,219,254,0.55);
    position:relative;
    overflow:hidden;
}
.jh-hero-pill {
    display:inline-flex; align-items:center; gap:0.4rem;
    padding:0.22rem 0.85rem;
    border-radius:999px;
    border:1px solid rgba(180,114,47,0.65);
    background:#fffaf2;
    font-size:0.7rem;
    text-transform:uppercase;
    letter-spacing:0.16em;
    color:#8b5a2b;
    margin-bottom:0.9rem;
}
.jh-hero-title {
    font-family:'Bebas Neue', system-ui;
    font-size:2.9rem;
    letter-spacing:0.09em;
    text-transform:uppercase;
    margin:0 0 0.6rem;
}
.jh-hero-text { font-size:0.96rem; color:var(--jh-text-muted); max-width:32rem; margin-bottom:1.25rem; }
.jh-hero-buttons { display:flex; flex-wrap:wrap; gap:0.8rem; }

.jh-btn-primary,
.jh-btn-ghost {
    border-radius:999px;
    padding:0.65rem 1.4rem;
    font-size:0.83rem;
    text-transform:uppercase;
    letter-spacing:0.16em;
    border:1px solid transparent;
    cursor:pointer;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:0.4rem;
}
.jh-btn-primary {
    background:linear-gradient(135deg,#b4722f,#ffb347);
    color:#161118;
    border-color:#b4722f;
    box-shadow:0 0 22px rgba(255,139,36,0.75);
}
.jh-btn-ghost {
    background:rgba(8,12,28,0.9);
    color:#ffffff;
    border-color:rgba(255,139,36,0.5);
}

.jh-hero-mascot-wrap {
    width:260px; height:260px; border-radius:50%;
    background:radial-gradient(circle at center, rgba(255,139,36,0.85), rgba(0,0,0,0.9));
    box-shadow:0 0 65px rgba(255,139,36,0.95), 0 0 120px rgba(0,0,0,0.9);
    display:flex; align-items:center; justify-content:center; overflow:hidden;
    margin-inline:auto;
}
.jh-hero-mascot-wrap img { width:88%; height:auto; }

/* Sections */
.jh-section-title {
    font-size:1.1rem;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:#e3e7ff;
    margin:2.4rem 0 1.4rem;
}

/* Sponsor grid */
.jh-sponsor-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:1.25rem;
}
.jh-sponsor-card {
    background:linear-gradient(180deg,#ffffff,#f3f7ff);
    border-radius:1.2rem;
    padding:1.15rem 1.1rem 1.1rem;
    border:1px solid #d5e4ff;
    box-shadow:0 16px 36px rgba(15,23,42,0.18);
    text-align:center;
    text-decoration:none;
    color:var(--jh-text-main);
    transition:transform .18s ease-out, box-shadow .18s ease-out, border-color .18s ease-out;
}
.jh-sponsor-card img {
    max-width:100%;
    height:auto;
    max-height:70px;
    display:block;
    margin:0 auto 0.75rem;
}
.jh-sponsor-name { font-size:0.9rem; font-weight:600; margin-bottom:0.15rem; }
.jh-sponsor-code { font-size:0.8rem; color:var(--jh-text-muted); margin-bottom:0.75rem; }
.jh-sponsor-btn {
    display:inline-block;
    padding:0.45rem 0.9rem;
    border-radius:999px;
    border:1px solid rgba(255,255,255,0.12);
    font-size:0.78rem;
    text-transform:uppercase;
    letter-spacing:0.15em;
    text-decoration:none;
    color:#ffffff;
    background:rgba(10,14,32,0.95);
}
.jh-sponsor-card:hover {
    transform:translateY(-6px);
    border-color:var(--jh-accent);
    box-shadow:0 0 25px rgba(255,139,36,0.7);
}

/* Two-column lower section */
.jh-two-col { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1.6fr); gap:2rem; margin-top:2.4rem; }
.jh-card {
    background:#ffffff;
    border-radius:1.5rem;
    border:1px solid #e0e7ff;
    padding:1.5rem 1.4rem 1.4rem;
    box-shadow:0 16px 34px rgba(15,23,42,0.18);
}
.jh-card p { font-size:0.9rem; color:var(--jh-text-muted); }

.jh-reward-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0.9rem; margin-top:0.5rem; }
.jh-reward-item {
    background:#e4edff;
    border-radius:1rem;
    padding:0.85rem 0.9rem;
    border:1px solid rgba(255,255,255,0.03);
}
.jh-reward-item h4 { margin:0 0 0.35rem; font-size:0.85rem; }

/* Leaderboard switcher */
.jh-lb-switcher {
    display:flex;
    gap:0.75rem;
    margin-bottom:1rem;
    flex-wrap:wrap;
}
.jh-lb-switcher-btn {
    padding:0.4rem 0.9rem;
    border-radius:999px;
    border:1px solid rgba(255,255,255,0.12);
    background:rgba(7,11,24,0.95);
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:0.4rem;
    font-size:0.78rem;
    text-transform:uppercase;
    letter-spacing:0.14em;
    color:var(--jh-text-muted);
    transition:background .18s ease-out, border-color .18s ease-out, color .18s ease-out, box-shadow .18s ease-out;
}
.jh-lb-switcher-btn img {
    height:20px;
    width:auto;
}
.jh-lb-switcher-btn.active {
    border-color:var(--jh-accent);
    color:#ffffff;
    box-shadow:0 0 20px rgba(255,139,36,0.55);
}
.jh-lb-card {
    background:linear-gradient(145deg,#eef3ff,#fff7ec);
    border-radius:1.5rem;
    border:1px solid rgba(255,255,255,0.03);
    padding:1.6rem 1.5rem 1.5rem;
    box-shadow:0 20px 52px rgba(0,0,0,0.9);
}
.jh-lb-meta { font-size:0.8rem; color:var(--jh-text-muted); margin-bottom:1rem; }
.jh-lb-panel { display:none; opacity:0; transition:opacity .25s ease-out; }
.jh-lb-panel.active { display:block; opacity:1; }

/* Footer */
.jh-footer {
    padding:2.2rem 1.5rem 2.6rem;
    border-top:1px solid #e5d9c8;
    background:radial-gradient(circle at top, rgba(191,219,254,0.45), #fff7ec);
    color:var(--jh-text-muted);
    font-size:0.8rem;
}
.jh-footer-inner {
    max-width:1120px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
}
.jh-footer-links { display:flex; flex-wrap:wrap; gap:1rem; }
.jh-footer-links a { color:var(--jh-text-muted); text-decoration:none; font-size:0.8rem; }

@media (max-width:900px) {
    .jh-main { padding-inline:1rem; }
    .jh-hero { grid-template-columns:minmax(0,1fr); }
    .jh-two-col { grid-template-columns:minmax(0,1fr); }
    .jh-header-inner { flex-wrap:wrap; }
}
@media (max-width:640px) {
    .jh-nav { display:none; }
}