/* IBA PUNCH v23 — admin controlled public appearance */
:root{
    --site-radius:6px;
    --site-max-width:1280px;
    --site-section-space:0px;
    --site-bg-position:center center;
    --site-bg-fit:cover;
    --site-nav-bg:rgba(5,5,5,.92);
}
body.site-design-applied{position:relative;min-height:100vh;isolation:isolate}
#site-bg-layer{position:fixed;inset:0;z-index:-1;overflow:hidden;background:var(--bg);pointer-events:none}
#site-bg-layer .site-bg-image,#site-bg-layer .site-bg-video{position:absolute;inset:-20px;width:calc(100% + 40px);height:calc(100% + 40px);object-fit:var(--site-bg-fit);object-position:var(--site-bg-position);transition:opacity .85s ease;will-change:opacity}
#site-bg-layer .site-bg-image{opacity:0}
#site-bg-layer .site-bg-video{opacity:0;background:#050505}
#site-bg-layer .site-bg-overlay{position:absolute;inset:0;background:var(--site-overlay-color,#050505);opacity:var(--site-overlay-opacity,.56);z-index:5;transition:opacity .25s ease,background .25s ease}
body.site-bg-scope-hero #site-bg-layer{position:absolute;top:0;bottom:auto;height:100vh}
body.site-custom-background{background:transparent!important}
body.site-custom-background .hero-bg{background:none!important;filter:none!important}
body.site-custom-background .hero-bg::after{content:none!important;display:none!important;background:none!important;mix-blend-mode:normal!important}
body.site-bg-scope-all.site-custom-background section{background:transparent!important}
body.site-bg-scope-all.site-custom-background .nav{background:linear-gradient(180deg,var(--site-nav-bg) 0%,rgba(5,5,5,.18) 100%)!important}
body.site-bg-scope-all.site-custom-background .stats-strip,
body.site-bg-scope-all.site-custom-background .hub,
body.site-bg-scope-all.site-custom-background .gallery,
body.site-bg-scope-all.site-custom-background .leagues,
body.site-bg-scope-all.site-custom-background .howto,
body.site-bg-scope-all.site-custom-background .map-section{position:relative}
body.site-bg-scope-all.site-custom-background .stats-strip::before,
body.site-bg-scope-all.site-custom-background .hub::before,
body.site-bg-scope-all.site-custom-background .gallery::before,
body.site-bg-scope-all.site-custom-background .leagues::before,
body.site-bg-scope-all.site-custom-background .howto::before,
body.site-bg-scope-all.site-custom-background .stats-strip>.container,
body.site-bg-scope-all.site-custom-background .hub>.container,
body.site-bg-scope-all.site-custom-background .gallery>.container,
body.site-bg-scope-all.site-custom-background .leagues>.container,
body.site-bg-scope-all.site-custom-background .howto>.container,
body.site-bg-scope-all.site-custom-background .map-section>.container{position:relative;z-index:1}

body.site-design-applied .container,
body.site-design-applied .nav-inner,
body.site-design-applied .hero-content{max-width:var(--site-max-width)!important}
body.site-design-applied .btn-primary,
body.site-design-applied .btn-secondary,
body.site-design-applied .nav-cta,
body.site-design-applied .hub-tab,
body.site-design-applied .league-card,
body.site-design-applied .gal-item,
body.site-design-applied .stat-card,
body.site-design-applied .strip-grid,
body.site-design-applied .hit-card,
body.site-design-applied .tournament-card,
body.site-design-applied .banner-card,
body.site-design-applied .map-card,
body.site-design-applied .auth-box,
body.site-design-applied .treg-box{border-radius:var(--site-radius)!important}
body.site-design-applied .stat-card,
body.site-design-applied .league-card,
body.site-design-applied .hit-card,
body.site-design-applied .tournament-card,
body.site-design-applied .strip-grid{background-color:var(--bg-card)!important;border-color:var(--border)!important}
body.site-spacing-custom section:not(.hero):not(.banners){padding-top:var(--site-section-space)!important;padding-bottom:var(--site-section-space)!important}
body.site-motion-reduced *,body.site-motion-reduced *::before,body.site-motion-reduced *::after{animation-duration:.35s!important;transition-duration:.25s!important;animation-iteration-count:1!important}
body.site-motion-off *,body.site-motion-off *::before,body.site-motion-off *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}

@media(max-width:768px){
 #site-bg-layer .site-bg-image,#site-bg-layer .site-bg-video{inset:-10px;width:calc(100% + 20px);height:calc(100% + 20px)}
 body.site-bg-scope-all.site-custom-background .stats-strip::before,
 body.site-bg-scope-all.site-custom-background .hub::before,
 body.site-bg-scope-all.site-custom-background .gallery::before,
 body.site-bg-scope-all.site-custom-background .leagues::before,
 body.site-bg-scope-all.site-custom-background .howto::before,
 body.site-bg-scope-all.site-custom-background .map-section::before{background:color-mix(in srgb,var(--bg) 72%,transparent)}
}

/* ============================================================
   IBA PUNCH V3 — unified public UI
   - Hero CTA buttons share one component language
   - Fighter Center tabs are an even grid
   - Public cards use one radius/border/shadow system
   ============================================================ */
:root{
    --iba-ui-radius:18px;
    --iba-ui-radius-sm:14px;
    --iba-ui-border:rgba(255,255,255,.105);
    --iba-ui-border-red:rgba(231,30,35,.34);
    --iba-ui-surface:linear-gradient(145deg,rgba(255,255,255,.055),rgba(10,10,12,.88));
    --iba-ui-surface-hover:linear-gradient(145deg,rgba(255,255,255,.075),rgba(24,9,10,.90));
    --iba-ui-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 18px 48px rgba(0,0,0,.22);
}

/* HERO CTA — same geometry, red primary variant */
.hero-buttons{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    width:min(100%,620px)!important;
    align-items:stretch!important;
}
.hero-buttons .btn-primary,
.hero-buttons .btn-secondary{
    width:100%!important;
    min-height:54px!important;
    margin:0!important;
    padding:0 24px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:var(--iba-ui-radius-sm)!important;
    border:1px solid var(--iba-ui-border-red)!important;
    clip-path:none!important;
    box-sizing:border-box!important;
    font-size:clamp(.78rem,1.1vw,.98rem)!important;
    font-weight:800!important;
    line-height:1.15!important;
    letter-spacing:.09em!important;
    white-space:nowrap!important;
    text-align:center!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 30px rgba(0,0,0,.20)!important;
    transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease,color .2s ease!important;
}
.hero-buttons .btn-primary{
    color:#fff!important;
    background:linear-gradient(135deg,#ec2027 0%,#b50910 100%)!important;
    border-color:rgba(255,58,63,.72)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 30px rgba(215,16,24,.24)!important;
}
.hero-buttons .btn-secondary{
    color:#ddd!important;
    background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(8,8,10,.74))!important;
    border-color:rgba(231,30,35,.28)!important;
}
.hero-buttons .btn-primary:hover,
.hero-buttons .btn-secondary:hover{
    transform:translateY(-2px)!important;
    border-color:rgba(255,61,66,.78)!important;
}
.hero-buttons .btn-primary:hover{
    background:linear-gradient(135deg,#fa2930 0%,#c20c14 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 16px 36px rgba(215,16,24,.34)!important;
}
.hero-buttons .btn-secondary:hover{
    color:#fff!important;
    background:linear-gradient(145deg,rgba(231,30,35,.08),rgba(255,255,255,.035))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 14px 32px rgba(0,0,0,.24)!important;
}

/* FIGHTER CENTER navigation — clean 4-column desktop / 2x2 mobile */
.hub-tabs{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:980px!important;
    margin:28px auto 26px!important;
    padding:8px!important;
    border:1px solid var(--iba-ui-border)!important;
    border-radius:calc(var(--iba-ui-radius) + 2px)!important;
    background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(5,5,7,.72))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 44px rgba(0,0,0,.18)!important;
    box-sizing:border-box!important;
}
.hub-tab,
.hub-tab-fund{
    grid-column:auto!important;
    min-width:0!important;
    width:100%!important;
    min-height:54px!important;
    margin:0!important;
    padding:10px 12px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid transparent!important;
    border-radius:var(--iba-ui-radius-sm)!important;
    background:rgba(255,255,255,.018)!important;
    color:#8f8f96!important;
    font-size:clamp(.67rem,.95vw,.82rem)!important;
    line-height:1.25!important;
    letter-spacing:.075em!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
    box-sizing:border-box!important;
}
.hub-tab:hover{
    color:#fff!important;
    border-color:rgba(255,255,255,.09)!important;
    background:rgba(255,255,255,.045)!important;
}
.hub-tab.active{
    color:#fff!important;
    border-color:rgba(255,61,66,.68)!important;
    background:linear-gradient(135deg,#ec2027 0%,#a70910 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px rgba(215,16,24,.24)!important;
}

/* Unified public card geometry. Individual sections keep their own content/background art. */
:is(
    .strip-grid,
    .stat-card,
    .hit-card,
    .league-card,
    .tournament-card,
    .banner-card,
    .mapapp-card,
    .step-row,
    .impact-chip,
    .tournament-mini-card,
    .ranking-card,
    .tournament-rules-card,
    .prize-fund-head,
    .fund-overview-card,
    .fund-calculator,
    .bonus-block,
    .payout-preview,
    .news-click-card
){
    border-radius:var(--iba-ui-radius)!important;
    border-color:var(--iba-ui-border)!important;
    box-shadow:var(--iba-ui-shadow)!important;
}
:is(.stat-card,.tournament-mini-card,.fund-overview-card,.bonus-block,.news-click-card){
    background:var(--iba-ui-surface)!important;
}
:is(.stat-card,.hit-card,.league-card,.tournament-card,.banner-card,.mapapp-card,.step-row,.impact-chip,.tournament-mini-card,.ranking-card,.fund-overview-card,.news-click-card){
    transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease!important;
}
:is(.stat-card,.hit-card,.league-card,.tournament-card,.banner-card,.mapapp-card,.step-row,.impact-chip,.tournament-mini-card,.ranking-card,.fund-overview-card,.news-click-card):hover{
    border-color:rgba(231,30,35,.26)!important;
}

@media(max-width:768px){
    .hero-buttons{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
        width:100%!important;
    }
    .hero-buttons .btn-primary,
    .hero-buttons .btn-secondary{
        min-height:50px!important;
        padding:0 10px!important;
        border-radius:14px!important;
        font-size:clamp(.62rem,2.65vw,.78rem)!important;
        letter-spacing:.055em!important;
    }
    .hub-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
        padding:8px!important;
        border-radius:18px!important;
    }
    .hub-tab,
    .hub-tab-fund{
        grid-column:auto!important;
        min-height:58px!important;
        padding:9px 8px!important;
        border-radius:13px!important;
        font-size:clamp(.62rem,2.6vw,.75rem)!important;
        line-height:1.22!important;
        letter-spacing:.055em!important;
    }
    :is(
        .strip-grid,.stat-card,.hit-card,.league-card,.tournament-card,.banner-card,.mapapp-card,
        .step-row,.impact-chip,.tournament-mini-card,.ranking-card,.tournament-rules-card,
        .prize-fund-head,.fund-overview-card,.fund-calculator,.bonus-block,.payout-preview,.news-click-card
    ){
        border-radius:16px!important;
    }
}

@media(max-width:360px){
    .hero-buttons .btn-primary,
    .hero-buttons .btn-secondary{
        font-size:.58rem!important;
        padding:0 7px!important;
    }
    .hub-tab,
    .hub-tab-fund{
        font-size:.58rem!important;
        letter-spacing:.035em!important;
    }
}
