
:root{--bc-blue:#08245c;--bc-blue2:#061b47;--bc-gold:#d99a23;--bc-cream:#fff8ea;--bc-bg:#f2eadc;--bc-text:#17213b;--bc-muted:#5f6475;--bc-card:#ffffff;--bc-border:#ead8b8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#f8f1e6 0%,#eee1cf 100%);color:var(--bc-text);font-family:Arial,Helvetica,sans-serif;line-height:1.55}.bc-site-nav{position:sticky;top:0;z-index:50;background:rgba(8,36,92,.96);box-shadow:0 6px 20px rgba(0,0,0,.12);backdrop-filter:blur(8px)}.bc-nav-inner{max-width:1180px;margin:0 auto;padding:10px 18px;display:flex;align-items:center;gap:14px}.bc-brand{display:flex;align-items:center;gap:10px;color:white;text-decoration:none;font-weight:900;letter-spacing:.5px;white-space:nowrap}.bc-brand-badge{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff4cf,#d99a23);color:#08245c;font-size:22px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}.bc-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-left:auto}.bc-links a{color:#fff;text-decoration:none;font-weight:800;font-size:14px;padding:8px 10px;border-radius:999px;transition:.2s;background:rgba(255,255,255,.04)}.bc-links a:hover,.bc-links a:focus{background:rgba(255,255,255,.16);color:#fff3c3}.bc-main{max-width:1180px;margin:0 auto;padding:28px 18px}.bc-section-title{font-size:clamp(24px,3vw,38px);line-height:1.1;margin:0 0 10px;color:#08245c}.bc-lead{font-size:18px;color:#4b5063;max-width:850px;margin:0 auto 22px}.bc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.bc-card{background:rgba(255,255,255,.92);border:1px solid var(--bc-border);border-radius:20px;padding:22px;box-shadow:0 10px 28px rgba(69,43,12,.10);text-decoration:none;color:var(--bc-text);transition:.2s;overflow:hidden}.bc-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(69,43,12,.16)}.bc-card .icon{font-size:34px;display:block;margin-bottom:8px}.bc-card h3{margin:0 0 6px;color:#08245c;font-size:21px}.bc-card p{margin:0;color:#565d70}.bc-hero-image{width:100%;display:block;border-radius:0}.bc-hero-wrap{max-width:1534px;margin:0 auto;background:#eadfce;line-height:0}.bc-home-section{padding:34px 18px}.bc-home-section .inner{max-width:1180px;margin:0 auto}.bc-home-section.center{text-align:center}.bc-feature-strip{background:#08245c;color:#fff;text-align:center;padding:28px 18px}.bc-feature-strip h2{margin:0 0 10px;font-size:30px}.bc-feature-strip p{margin:0 auto;max-width:780px;color:#dbe7ff;font-size:17px}.bc-footer{background:#061b47;color:#dbe7ff;text-align:center;padding:26px 18px;margin-top:44px;border-top:4px solid #d99a23}.bc-footer strong{color:#fff;font-size:18px}.bc-footer a{color:#fff;text-decoration:none;font-weight:800}.bc-footer a:hover{text-decoration:underline}.bc-social{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:14px 0}.bc-social a{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.10)}.bc-small{font-size:13px;color:#c8d5f1}.table-wrap,.rating-table-wrap,.scroll-table{overflow-x:auto;-webkit-overflow-scrolling:touch}table{max-width:100%}img{max-width:100%;height:auto}@media(max-width:900px){.bc-nav-inner{align-items:flex-start;flex-direction:column}.bc-links{justify-content:flex-start;margin-left:0}.bc-grid{grid-template-columns:1fr 1fr}.bc-main{padding-top:22px}}@media(max-width:560px){.bc-grid{grid-template-columns:1fr}.bc-links a{font-size:13px;padding:7px 9px}.bc-brand{font-size:15px}.bc-home-section{padding:26px 14px}.bc-card{padding:18px}.bc-footer{margin-top:28px}}


/* Compact dropdown navigation */
.bc-nav-inner{align-items:center;gap:18px}
.bc-menu{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;flex-wrap:nowrap}
.bc-menu-item{position:relative}
.bc-menu>a,.bc-menu-item>.bc-menu-title{display:inline-flex;align-items:center;gap:6px;color:#fff;text-decoration:none;font-weight:900;font-size:14px;padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.05);border:0;cursor:pointer;font-family:inherit;white-space:nowrap}
.bc-menu>a:hover,.bc-menu>a:focus,.bc-menu-item:hover>.bc-menu-title,.bc-menu-item:focus-within>.bc-menu-title{background:rgba(255,255,255,.16);color:#fff3c3}
.bc-menu-title::after{content:"▾";font-size:11px;line-height:1;opacity:.9}
/* Dropdown: bez praznog prostora između glavnog linka i podmenija */
.bc-menu-item::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px;display:block}
.bc-submenu{position:absolute;top:100%;left:0;min-width:220px;background:#fff8ea;color:#17213b;border:1px solid #ead8b8;border-radius:16px;padding:8px;box-shadow:0 18px 38px rgba(0,0,0,.18);display:none;z-index:80;margin-top:0}
.bc-menu-item:hover .bc-submenu,.bc-menu-item:focus-within .bc-submenu{display:block}
.bc-submenu a{display:block;color:#08245c;text-decoration:none;font-weight:800;font-size:14px;padding:9px 12px;border-radius:10px;white-space:nowrap}
.bc-submenu a:hover,.bc-submenu a:focus{background:#efe0c3;color:#061b47}
.bc-submenu.right{left:auto;right:0}
@media(max-width:900px){.bc-nav-inner{flex-direction:row;align-items:center;flex-wrap:wrap}.bc-menu{width:100%;margin-left:0;justify-content:center;flex-wrap:wrap}.bc-menu>a,.bc-menu-item>.bc-menu-title{font-size:13px;padding:8px 10px}.bc-submenu{position:absolute}}
@media(max-width:560px){.bc-menu{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.bc-menu-item{position:static}.bc-submenu{left:12px;right:12px;min-width:auto}.bc-submenu.right{left:12px;right:12px}}

/* School competition page helpers */
.bc-submenu{max-height:80vh;overflow-y:auto}


/* Final professional site polish */
.bc-site-nav, .bc-site-nav *{box-sizing:border-box}
.bc-site-nav{position:sticky!important;top:0!important;z-index:9999!important;background:rgba(8,36,92,.97)!important;color:#fff!important;box-shadow:0 8px 24px rgba(0,0,0,.16)!important}
.bc-site-nav a,.bc-site-nav button,.bc-site-nav span{color:#fff!important;text-decoration:none!important}
.bc-brand{color:#fff!important}.bc-brand:hover{text-decoration:none!important}
.bc-menu-title{appearance:none!important;-webkit-appearance:none!important}
.bc-submenu{background:#fff8ea!important;color:#17213b!important;z-index:10000!important}
.bc-submenu a{color:#08245c!important;background:transparent!important;text-decoration:none!important}
.bc-submenu a:hover,.bc-submenu a:focus{background:#efe0c3!important;color:#061b47!important;text-decoration:none!important}
.bc-footer{background:#061b47!important;color:#dbe7ff!important;text-align:center!important;padding:28px 18px!important;margin-top:44px!important;border-top:4px solid #d99a23!important;font-family:Arial,Helvetica,sans-serif!important}
.bc-footer *{color:#dbe7ff!important}
.bc-footer strong{color:#fff!important;font-size:18px!important}
.bc-footer a{color:#fff!important;text-decoration:none!important;font-weight:800!important}
.bc-footer a:hover{text-decoration:underline!important}
.bc-social a{display:inline-flex!important;align-items:center!important;gap:6px!important;padding:8px 12px!important;border-radius:999px!important;background:rgba(255,255,255,.10)!important;color:#fff!important}
.bc-small{font-size:13px!important;color:#c8d5f1!important}
.bc-page-hero{background:linear-gradient(135deg,#08245c,#123f73)!important;color:#fff!important;padding:44px 22px!important;border-bottom:5px solid #d99a23!important;text-align:center!important}
.bc-page-hero h1{margin:0 auto 10px!important;max-width:1040px!important;font-size:clamp(30px,4vw,52px)!important;line-height:1.08!important;color:#fff!important;border:0!important;padding:0!important}
.bc-page-hero p{margin:0 auto!important;max-width:850px!important;font-size:18px!important;color:#dbe7ff!important}
.bc-content{max-width:1180px;margin:30px auto;padding:0 18px}.bc-content-card{background:#fff;border:1px solid #ead8b8;border-radius:22px;padding:28px;box-shadow:0 14px 36px rgba(69,43,12,.10)}
.bc-two{display:grid;grid-template-columns:1.3fr .7fr;gap:22px}.bc-list-card{background:#fff8ea;border:1px solid #ead8b8;border-radius:18px;padding:18px}.bc-list-card h3{margin-top:0;color:#08245c}.bc-list-card li{margin:8px 0}.bc-photo-card{background:#f8f1e6;border:1px solid #ead8b8;border-radius:20px;padding:18px;text-align:center}.bc-photo-card img{border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.12)}
.bc-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.bc-gallery figure{margin:0;background:#fff;border:1px solid #ead8b8;border-radius:18px;padding:12px;box-shadow:0 8px 20px rgba(69,43,12,.10)}.bc-gallery img{width:100%;height:180px;object-fit:cover;border-radius:12px}.bc-gallery figcaption{font-weight:800;color:#08245c;margin-top:8px;text-align:center}
@media(max-width:800px){.bc-two{grid-template-columns:1fr}.bc-content-card{padding:22px}.bc-page-hero{padding:34px 16px}}

/* External links and trainer page final checks */
.bc-site-nav a[target="_blank"]::after,.bc-footer a[target="_blank"]::after{content:""}
.trainer-photo img{max-height:520px;object-fit:cover;object-position:center}


/* V6 unified imported educational pages */
.bc-site-nav + .wrap, .bc-site-nav + header + main, .bc-site-nav + .bc-dictionary{margin-top:0!important}
.bc-dictionary{max-width:1180px!important;padding:28px 18px 40px!important}
.bc-dictionary .bc-hero{border-radius:24px!important}
.bc-table td{text-transform:none!important}
.bc-table td:first-letter{text-transform:uppercase}
/* Allow internal FA anchor nav to remain visually separate from main site menu */
body > nav:not(.bc-site-nav){position:sticky;top:58px;z-index:20}
@media(max-width:900px){body > nav:not(.bc-site-nav){position:static}.bc-dictionary{padding:18px 10px 30px!important}}

/* V8 – potpuno usklađivanje dodatnih HTML stranica sa Benko Chess koloritetom */
:root{--bc-blue:#08245c;--bc-blue-mid:#123f73;--bc-blue-light:#1d4f93;--bc-gold:#d99a23;--bc-cream:#fff8ea;--bc-border:#ead8b8;--bc-text:#17213b}
/* Hero/blok na vrhu svake uvezene edukativne stranice mora biti u boji sajta */
body > header:not(.bc-site-nav),
body .wrap > .hero,
body .bc-dictionary > .bc-hero,
body header.hero,
body .hero{
  background:linear-gradient(135deg,var(--bc-blue) 0%, var(--bc-blue-mid) 62%, var(--bc-blue-light) 100%)!important;
  color:#fff!important;
  border-bottom:5px solid var(--bc-gold)!important;
  box-shadow:0 18px 45px rgba(8,36,92,.18)!important;
}

/* ===== JEDINSTVENI RAZMAK IZRAVNIH HERO ZAGLAVLJA ===== */
/* Samo header koji JE hero kartica dobija spoljašnji razmak.
   Wrapper headeri (simple-hero, history-hero, learn-hero...) ne smeju
   istovremeno imati i margin-top i padding-top, jer to duplira razmak. */
html:root body > nav.bc-site-nav + header.bc-hero-standard{
  margin-top:34px!important;
}
@media(max-width:560px){
  html:root body > nav.bc-site-nav + header.bc-hero-standard{
    margin-top:20px!important;
  }
}
body > header:not(.bc-site-nav) h1,
body .wrap > .hero h1,
body .bc-dictionary > .bc-hero h1,
body header.hero h1,
body .hero h1{
  color:#fff!important;
  border:0!important;
  text-shadow:none!important;
}
body > header:not(.bc-site-nav) p,
body .wrap > .hero p,
body .bc-dictionary > .bc-hero p,
body header.hero p,
body .hero p{
  color:#dbe7ff!important;
}
body .badge,
body .bc-badge,
body .bc-language-strip span{
  background:rgba(255,255,255,.12)!important;
  border:1px solid rgba(255,255,255,.28)!important;
  color:#fff3c3!important;
}
body .pill,
body .bc-chip{
  background:#fff2cf!important;
  border:1px solid #e5bf66!important;
  color:#08245c!important;
}
body .pill:hover,
body .bc-chip:hover{
  background:#f4c65a!important;
  color:#061b47!important;
}
/* Kartice, tabele i naslovi na dodatnim stranicama u istom tonu sajta */
body .card,
body .bc-card,
body .intro,
body .sources,
body .key,
body .container,
body .bc-content-card{
  border-color:var(--bc-border)!important;
  box-shadow:0 12px 30px rgba(69,43,12,.08)!important;
}
body h2,
body .test h2,
body .card h2,
body .bc-card h2{
  color:#08245c!important;
}
body th,
body .bc-table th{
  background:#08245c!important;
  color:#fff!important;
}
body .bc-card-head,
body .important{
  background:linear-gradient(90deg,#08245c,#123f73)!important;
  color:#fff!important;
}
body .bc-card-head h2,
body .important h2,
body .important strong{color:#fff!important}
body .exam{border-left-color:#d99a23!important;background:#fff8ea!important}
body .note{border-left-color:#d99a23!important;background:#fff8ea!important}
body .danger{border-left-color:#b42318!important;background:#fff3f0!important}
/* Rečnik: ne forsira svaku reč velikim slovom, samo prvo slovo celog pojma */
.bc-table td{text-transform:none!important}
.bc-table td:first-letter{text-transform:uppercase!important}

/* ===== BENKO CHESS – GLOBAL STANDARD UVODNE KARTICE 2026 ===== */
.bc-hero-standard::before,.bc-hero-standard::after{content:none!important;display:none!important;background:none!important;opacity:0!important}
.bc-hero-standard{background:linear-gradient(135deg,#08245c 0%,#123f73 62%,#1b4d7d 100%)!important;color:#fff!important;border-bottom:6px solid #d99a23!important;border-radius:30px!important;box-shadow:0 22px 52px rgba(8,36,92,.20)!important;overflow:hidden!important}
.bc-hero-standard h1,.bc-hero-standard .bc-hero-title-standard{font-size:clamp(32px,3.4vw,38px)!important;line-height:1.12!important;color:#fff!important;text-shadow:none!important}
.bc-hero-standard p,.bc-hero-standard .bc-hero-desc-standard{font-size:clamp(16px,1.35vw,17px)!important;line-height:1.62!important;color:#e8f0ff!important}
.bc-hero-standard .bc-hero-badge-standard{background:rgba(242,223,189,.18)!important;border:1px solid rgba(242,223,189,.48)!important;color:#f2dfbd!important;font-size:14px!important;padding:7px 14px!important;border-radius:999px!important;box-shadow:none!important;text-shadow:none!important}

/* ===== BENKO CHESS CLUB - JEDINSTVENI GORNJI MENI v62 ===== */
/* Jedinstveni gornji Benko Chess meni na svim stranicama */
.bc-site-nav{
  position:sticky!important;
  top:0!important;
  z-index:9999!important;
  background:rgba(8,36,92,.97)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 8px 24px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
.bc-site-nav,.bc-site-nav *{box-sizing:border-box!important;}
.bc-site-nav .bc-nav-inner{
  width:min(1535px, calc(100% - 36px))!important;
  max-width:1535px!important;
  margin:0 auto!important;
  padding:10px 0!important;
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
}
.bc-site-nav .bc-brand{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:#fff!important;
  text-decoration:none!important;
  font-weight:900!important;
  letter-spacing:.5px!important;
  white-space:nowrap!important;
  line-height:1!important;
}
.bc-site-nav .bc-brand:hover,.bc-site-nav .bc-brand:focus{text-decoration:none!important;color:#fff3c3!important;}
.bc-site-nav .bc-brand-badge{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  border-radius:50%!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(135deg,#fff4cf,#d99a23)!important;
  color:#08245c!important;
  font-size:22px!important;
  font-weight:900!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)!important;
}
.bc-site-nav .bc-menu{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  margin-left:auto!important;
  flex-wrap:nowrap!important;
}
.bc-site-nav .bc-menu-item{position:relative!important;}
.bc-site-nav .bc-menu>a,
.bc-site-nav .bc-menu-item>.bc-menu-title{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  color:#fff!important;
  text-decoration:none!important;
  font-weight:900!important;
  font-size:14px!important;
  line-height:1.2!important;
  padding:9px 12px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.05)!important;
  border:0!important;
  cursor:pointer!important;
  font-family:Arial,Helvetica,sans-serif!important;
  white-space:nowrap!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.bc-site-nav .bc-menu>a:hover,
.bc-site-nav .bc-menu>a:focus,
.bc-site-nav .bc-menu-item:hover>.bc-menu-title,
.bc-site-nav .bc-menu-item:focus-within>.bc-menu-title{
  background:rgba(255,255,255,.16)!important;
  color:#fff3c3!important;
  text-decoration:none!important;
}
.bc-site-nav .bc-menu-title::after{content:"▾";font-size:11px;line-height:1;opacity:.9;}
.bc-site-nav .bc-menu-item::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px;display:block;}
.bc-site-nav .bc-submenu{
  position:absolute!important;
  top:100%!important;
  left:0!important;
  min-width:220px!important;
  max-height:80vh!important;
  overflow-y:auto!important;
  background:#fff8ea!important;
  color:#17213b!important;
  border:1px solid #ead8b8!important;
  border-radius:16px!important;
  padding:8px!important;
  box-shadow:0 18px 38px rgba(0,0,0,.18)!important;
  display:none!important;
  z-index:10000!important;
  margin-top:0!important;
}
.bc-site-nav .bc-menu-item:hover .bc-submenu,
.bc-site-nav .bc-menu-item:focus-within .bc-submenu{display:block!important;}
.bc-site-nav .bc-submenu.right{left:auto!important;right:0!important;}
.bc-site-nav .bc-submenu a{
  display:block!important;
  color:#08245c!important;
  background:transparent!important;
  text-decoration:none!important;
  font-weight:800!important;
  font-size:14px!important;
  line-height:1.25!important;
  padding:9px 12px!important;
  border-radius:10px!important;
  white-space:nowrap!important;
}
.bc-site-nav .bc-submenu a:hover,
.bc-site-nav .bc-submenu a:focus{background:#efe0c3!important;color:#061b47!important;text-decoration:none!important;}
@media(max-width:900px){
  .bc-site-nav .bc-nav-inner{width:calc(100% - 24px)!important;flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;gap:12px!important;padding:9px 0!important;}
  .bc-site-nav .bc-menu{width:100%!important;margin-left:0!important;justify-content:center!important;flex-wrap:wrap!important;gap:6px!important;}
  .bc-site-nav .bc-menu>a,.bc-site-nav .bc-menu-item>.bc-menu-title{font-size:13px!important;padding:8px 10px!important;}
}
@media(max-width:560px){
  .bc-site-nav .bc-nav-inner{width:calc(100% - 20px)!important;}
  .bc-site-nav .bc-menu{justify-content:flex-start!important;overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:4px!important;}
  .bc-site-nav .bc-menu-item{position:static!important;}
  .bc-site-nav .bc-submenu{left:10px!important;right:10px!important;min-width:auto!important;}
  .bc-site-nav .bc-submenu.right{left:10px!important;right:10px!important;}
}

/* ===== BENKO CHESS CLUB - STANDARD HERO BADGE TEMPLATE v1 ===== */
:root{
  --bc-badge-light-bg:#ffffff;
  --bc-badge-light-border:#ead8b8;
  --bc-badge-light-text:#08245c;
  --bc-badge-dark-bg:#efe0c7;
  --bc-badge-dark-border:#dcc49d;
  --bc-badge-dark-text:#08245c;
}
html body .bc-hero-standard .bc-hero-badge-standard,
html body .bc-hero-standard .badge.bc-hero-badge-standard,
html body .bc-hero-standard .eyebrow.bc-hero-badge-standard,
html body .bc-hero-standard .learn-eyebrow.bc-hero-badge-standard,
html body .bc-hero-standard .gt-badge.bc-hero-badge-standard,
html body .bc-hero-standard .trainer-eyebrow.bc-hero-badge-standard,
html body .bc-hero-standard .trainer-badge.bc-hero-badge-standard,
html body .bc-hero-standard .badge-soft.bc-hero-badge-standard,
html body .bc-hero-standard .tour-badge.bc-hero-badge-standard,
html body .bc-hero-standard .pb-badge.bc-hero-badge-standard,
html body .bc-hero-standard .bc-badge.bc-hero-badge-standard,
html body .bc-hero-standard .nt-badge.bc-hero-badge-standard,
html body .bc-hero-standard .sym-badge.bc-hero-badge-standard,
html body .bc-hero-standard .z-eyebrow.bc-hero-badge-standard{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:auto!important;
  margin:0 0 16px!important;
  padding:7px 14px!important;
  border-radius:999px!important;
  background:var(--bc-badge-dark-bg)!important;
  border:1px solid var(--bc-badge-dark-border)!important;
  color:var(--bc-badge-dark-text)!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html body .index-intro.bc-hero-standard .bc-hero-badge-standard{
  background:var(--bc-badge-light-bg)!important;
  border:1px solid var(--bc-badge-light-border)!important;
  color:var(--bc-badge-light-text)!important;
  box-shadow:0 6px 18px rgba(69,43,12,.06)!important;
  padding:9px 16px!important;
  font-size:14px!important;
}
html body .wcc-hero .wcc-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 16px!important;
  padding:7px 14px!important;
  border-radius:999px!important;
  background:var(--bc-badge-dark-bg)!important;
  border:1px solid var(--bc-badge-dark-border)!important;
  color:var(--bc-badge-dark-text)!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  box-shadow:none!important;
  text-shadow:none!important;
}

/* ===== BENKO CHESS CLUB - STANDARD PAGE WIDTH TEMPLATE v1 ===== */
:root{
  --bc-page-width:1320px;
  --bc-nav-width:1535px;
  --bc-page-gutter:36px;
  --bc-page-gutter-wide:56px;
}
html:root body .bc-main,
html:root body .bc-content,
html:root body .bc-hero-wrap,
html:root body .bc-page-hero,
html:root body .bc-home-section .inner,
html:root body .bc-dictionary,
html:root body .club-wrap,
html:root body .classroom-wrap,
html:root body .schedule-wrap,
html:root body .db-shell,
html:root body .index-shell,
html:root body .bcrl-shell,
html:root body .page,
html:root body .z-page,
html:root body .placeholder-hero .wrap,
html:root body .blog-ideas,
html:root body .simple-wrap,
html:root body .gt-shell,
html:root body .trainer-shell,
html:root body .history-wrap,
html:root body .parent-wrap,
html:root body .z-wrap,
html:root body .learn-shell,
html:root body .learn-page .wrap,
html:root body .clock-shell,
html:root body .fa-shell,
html:root body .test-wrap,
html:root body .nt-shell,
html:root body .sym-shell,
html:root body .pb-shell,
html:root body .tour-wrap,
html:root body .course-wrap,
html:root body .interview-page,
html:root body .story-page,
html:root body .school-hero,
html:root body .school-layout,
html:root body .wcc-shell,
html:root body .wrap,
html:root body.simple-light .wrap,
html:root body.fa-light .wrap,
html:root body.history-light .wrap,
html:root body.rules-light .wrap,
html:root body.turniri-light .tour-wrap,
html:root body.sah-recnik-light .bc-dictionary,
html:root body.fa-tests-light > header,
html:root body.fa-tests-light .fa-test-nav,
html:root body.fa-tests-light main,
html:root body .footer{
  width:min(var(--bc-page-width), calc(100% - var(--bc-page-gutter)))!important;
  max-width:var(--bc-page-width)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html:root body .bc-footer{
  width:min(var(--bc-page-width), calc(100% - var(--bc-page-gutter)))!important;
  max-width:var(--bc-page-width)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  border-radius:22px!important;
  padding:20px 18px 18px!important;
}
html:root body .bc-footer-line{
  margin:0!important;
  line-height:1.4!important;
}
html:root body .bc-footer-main{
  font-size:15px!important;
  color:#dbe7ff!important;
}
html:root body .bc-footer-main strong{
  font-size:16px!important;
}
html:root body .bc-footer-social{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  flex-wrap:wrap!important;
  margin:8px auto 7px!important;
  line-height:1.35!important;
}
html:root body .bc-footer-social a{
  display:inline-flex!important;
  align-items:center!important;
  padding:2px 0!important;
  background:transparent!important;
  border-radius:0!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:800!important;
  text-decoration:none!important;
}
html:root body .bc-footer-social a + a::before{
  content:"\2022";
  display:inline-block;
  padding:0 9px;
  color:#d99a23;
  font-weight:900;
}
html:root body .bc-footer-copy{
  font-size:13px!important;
  color:#c8d5f1!important;
}
/* Header ima sopstvenu sirinu i ne sme da nasledjuje uzu sirinu sadrzaja stranice.
   Ovo je kljucno za stranice bez lokalnog benko-site-chrome-final bloka
   (npr. Benko Chess Program, BCRS i BCRL). */
html:root body .bc-site-nav{
  width:100%!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
}
html:root body .bc-site-nav .bc-nav-inner{
  width:min(var(--bc-nav-width), calc(100% - var(--bc-page-gutter)))!important;
  max-width:var(--bc-nav-width)!important;
}
html:root body .bc-page-hero.bc-hero-standard,
html:root body .school-hero.bc-hero-standard{
  width:min(var(--bc-page-width), calc(100% - var(--bc-page-gutter)))!important;
  max-width:var(--bc-page-width)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html:root body .table-wrap,
html:root body .table-scroll,
html:root body .ratings-table-wrap,
html:root body .bcrl-table-wrap,
html:root body .fide-table-wrap,
html:root body .wcc-table-wrap{
  max-width:100%!important;
  overflow-x:auto!important;
}
@media(max-width:900px){
  html:root body .bc-footer{
    width:min(var(--bc-page-width), calc(100% - 28px))!important;
  }

  html:root body .bc-page-hero.bc-hero-standard,
  html:root body .school-hero.bc-hero-standard{
    width:min(var(--bc-page-width), calc(100% - 28px))!important;
  }
  html:root body .bc-main,
  html:root body .bc-content,
  html:root body .bc-hero-wrap,
  html:root body .bc-page-hero,
  html:root body .bc-home-section .inner,
  html:root body .bc-dictionary,
  html:root body .club-wrap,
  html:root body .classroom-wrap,
  html:root body .schedule-wrap,
  html:root body .db-shell,
  html:root body .index-shell,
  html:root body .bcrl-shell,
  html:root body .page,
  html:root body .z-page,
  html:root body .placeholder-hero .wrap,
  html:root body .blog-ideas,
  html:root body .simple-wrap,
  html:root body .gt-shell,
  html:root body .trainer-shell,
  html:root body .history-wrap,
  html:root body .parent-wrap,
  html:root body .z-wrap,
  html:root body .learn-shell,
  html:root body .learn-page .wrap,
  html:root body .clock-shell,
  html:root body .fa-shell,
  html:root body .test-wrap,
  html:root body .nt-shell,
  html:root body .sym-shell,
  html:root body .pb-shell,
  html:root body .tour-wrap,
  html:root body .course-wrap,
  html:root body .interview-page,
  html:root body .story-page,
  html:root body .school-hero,
  html:root body .school-layout,
  html:root body .wcc-shell,
  html:root body .wrap,
  html:root body.simple-light .wrap,
  html:root body.fa-light .wrap,
  html:root body.history-light .wrap,
  html:root body.rules-light .wrap,
  html:root body.turniri-light .tour-wrap,
  html:root body.sah-recnik-light .bc-dictionary,
  html:root body.fa-tests-light > header,
  html:root body.fa-tests-light .fa-test-nav,
  html:root body.fa-tests-light main,
  html:root body .footer{
    width:min(var(--bc-page-width), calc(100% - 28px))!important;
  }
}
@media(max-width:560px){
  html:root body .bc-footer{
    width:calc(100% - 20px)!important;
    border-radius:18px!important;
  }

  html:root body .bc-page-hero.bc-hero-standard,
  html:root body .school-hero.bc-hero-standard{
    width:calc(100% - 20px)!important;
  }
  html:root body .bc-main,
  html:root body .bc-content,
  html:root body .bc-hero-wrap,
  html:root body .bc-page-hero,
  html:root body .bc-home-section .inner,
  html:root body .bc-dictionary,
  html:root body .club-wrap,
  html:root body .classroom-wrap,
  html:root body .schedule-wrap,
  html:root body .db-shell,
  html:root body .index-shell,
  html:root body .bcrl-shell,
  html:root body .page,
  html:root body .z-page,
  html:root body .placeholder-hero .wrap,
  html:root body .blog-ideas,
  html:root body .simple-wrap,
  html:root body .gt-shell,
  html:root body .trainer-shell,
  html:root body .history-wrap,
  html:root body .parent-wrap,
  html:root body .z-wrap,
  html:root body .learn-shell,
  html:root body .learn-page .wrap,
  html:root body .clock-shell,
  html:root body .fa-shell,
  html:root body .test-wrap,
  html:root body .nt-shell,
  html:root body .sym-shell,
  html:root body .pb-shell,
  html:root body .tour-wrap,
  html:root body .course-wrap,
  html:root body .interview-page,
  html:root body .story-page,
  html:root body .school-hero,
  html:root body .school-layout,
  html:root body .wcc-shell,
  html:root body .wrap,
  html:root body.simple-light .wrap,
  html:root body.fa-light .wrap,
  html:root body.history-light .wrap,
  html:root body.rules-light .wrap,
  html:root body.turniri-light .tour-wrap,
  html:root body.sah-recnik-light .bc-dictionary,
  html:root body.fa-tests-light > header,
  html:root body.fa-tests-light .fa-test-nav,
  html:root body.fa-tests-light main,
  html:root body .footer{
    width:calc(100% - 20px)!important;
  }
}

/* ===== BENKO CHESS CLUB - UNIFIED TOP GAP FINAL v1 =====
   Referenca: index.html
   Desktop: 34px od donje ivice glavnog menija do prvog gornjeg bloka.
   Mobilni (<=560px): 20px.

   Važno: stranice koriste različite DOM šablone. Zato se razmak ne sme
   rešavati jednim pravilom za svaki <header>. Kod wrapper stranica razmak
   pravi padding-top spoljnog kontejnera; kod stranica gde je prvi element
   sama hero kartica razmak pravi margin-top te kartice.
*/
:root{
  --bc-top-gap:34px;
}
@media(max-width:560px){
  :root{--bc-top-gap:20px;}
}

/* A) Prvi element posle menija JE standardna hero kartica. */
html:root body > nav.bc-site-nav + .bc-hero-standard{
  margin-top:var(--bc-top-gap)!important;
}

/* B) Prvi element posle menija je wrapper koji negde u sebi sadrži
      standardnu hero karticu. Spoljašnji wrapper jedini nosi top-gap. */
html:root body > nav.bc-site-nav + main:has(.bc-hero-standard):not(.bc-hero-standard),
html:root body > nav.bc-site-nav + section:has(.bc-hero-standard):not(.bc-hero-standard),
html:root body > nav.bc-site-nav + div:has(.bc-hero-standard):not(.bc-hero-standard),
html:root body > nav.bc-site-nav + header:has(.bc-hero-standard):not(.bc-hero-standard){
  margin-top:0!important;
  padding-top:var(--bc-top-gap)!important;
}

/* Sprečava dupli razmak kod šablona gde prvi unutrašnji wrapper već ima
   sopstveni padding-top (index-top, trainer-hero, learn-hero, gt-hero...). */
html:root body > nav.bc-site-nav + main:has(.bc-hero-standard):not(.bc-hero-standard) > :first-child:not(.bc-hero-standard),
html:root body > nav.bc-site-nav + section:has(.bc-hero-standard):not(.bc-hero-standard) > :first-child:not(.bc-hero-standard),
html:root body > nav.bc-site-nav + div:has(.bc-hero-standard):not(.bc-hero-standard) > :first-child:not(.bc-hero-standard),
html:root body > nav.bc-site-nav + header:has(.bc-hero-standard):not(.bc-hero-standard) > :first-child:not(.bc-hero-standard){
  margin-top:0!important;
  padding-top:0!important;
}

/* Ako je standardna hero kartica prvi direktni potomak wrappera,
   njen stari margin-top se uklanja, ali unutrašnji padding kartice ostaje. */
html:root body > nav.bc-site-nav + main:has(.bc-hero-standard):not(.bc-hero-standard) > .bc-hero-standard:first-child,
html:root body > nav.bc-site-nav + section:has(.bc-hero-standard):not(.bc-hero-standard) > .bc-hero-standard:first-child,
html:root body > nav.bc-site-nav + div:has(.bc-hero-standard):not(.bc-hero-standard) > .bc-hero-standard:first-child,
html:root body > nav.bc-site-nav + header:has(.bc-hero-standard):not(.bc-hero-standard) > .bc-hero-standard:first-child{
  margin-top:0!important;
}

/* C) Stariji / posebni šabloni koji još nemaju .bc-hero-standard. */
html:root body > nav.bc-site-nav + main.story-page,
html:root body > nav.bc-site-nav + main.interview-page,
html:root body > nav.bc-site-nav + main.z-page{
  padding-top:var(--bc-top-gap)!important;
}

/* Trenerski kutak: razmak je margin-top cele stranice. */
html:root body > nav.bc-site-nav + main.page{
  margin-top:var(--bc-top-gap)!important;
}

/* Diagram Builder: prvi vidljivi blok je .db-hero. */
html:root body > nav.bc-site-nav + main.db-shell > .db-hero:first-child{
  margin-top:var(--bc-top-gap)!important;
}

/* Takmičarska arhiva: svih WCC/arhivskih stranica koriste isti hero-area. */
html:root body > nav.bc-site-nav + main.wcc-shell > .wcc-hero-area:first-child{
  padding-top:var(--bc-top-gap)!important;
}

/* Benko Chess Clock: u setup režimu .app je prvi vizuelni omotač. */
html:root body:not(.clock-game-mode) > nav.bc-site-nav + div.app{
  padding-top:var(--bc-top-gap)!important;
}


/* ===== BENKO CHESS CLUB - UNIFIED BOTTOM GAP FINAL v1 =====
   Standardni vizuelni razmak od poslednjeg sadržajnog bloka do plavog footera.
   Desktop: 44px
   Mobilni (<=560px): 28px

   Različiti šabloni su ranije dodavali sopstveni padding-bottom / margin-bottom
   neposredno pre footera, pa se 44px footera sabiralo sa još 18-54px praznog prostora.
   Ovo pravilo uklanja samo završni višak na spoljašnjem kontejneru i poslednjem
   direktnom sadržajnom bloku, a footer zadržava jedan jedini standardni razmak.
*/
:root{
  --bc-bottom-gap:44px;
}
@media(max-width:560px){
  :root{--bc-bottom-gap:28px;}
}

/* Footer je jedini nosilac spoljnog razmaka. Ovo pravilo je namerno na kraju
   fajla da pregazi starija !important pravila (uključujući mobilnih 44px). */
html:root body .bc-footer.bc-footer{
  margin-top:var(--bc-bottom-gap)!important;
}

/* Neposredni glavni kontejner pre footera ne sme dodavati drugi donji razmak. */
html:root body > :has(+ .bc-footer){
  padding-bottom:0!important;
  margin-bottom:0!important;
}

/* Uklanja samo završni margin poslednjeg direktnog sadržajnog elementa.
   :nth-last-child(... of ...) preskače script/style/noscript elemente. */
html:root body > :has(+ .bc-footer) > :nth-last-child(1 of :not(script,style,noscript)){
  margin-bottom:0!important;
}

/* bcrl.html sadrži stari pogrešno napisan <scriat> element neposredno pre footera.
   Kao nepoznat inline element dodavao je približno 4.8px praznog reda.
   Sakrivamo samo taj završni artefakt; pravi <script> elementi nisu pogođeni. */
html:root body > scriat:has(+ .bc-footer){
  display:none!important;
}


/* ===== BENKO MOBILE v7: na telefonu postoji samo hamburger navigacija. ===== */
@media (max-width:760px){
  html body .bc-site-nav .bc-menu{display:none!important;}
}
/* ===== BENKO CHESS SITE LANGUAGE SWITCH v1 ===== */
.bc-language-switch{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;margin-left:2px;color:#d8e4ff;font:900 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.04em;white-space:nowrap}
.bc-language-switch a{color:#d8e4ff;text-decoration:none;padding:6px 4px;border-radius:6px;opacity:.72}
.bc-language-switch a:hover,.bc-language-switch a:focus{color:#fff3c3;opacity:1}
.bc-language-switch a.active{color:#fff3c3;opacity:1;text-decoration:underline;text-underline-offset:3px}
.bc-language-switch span{opacity:.55}
@media(max-width:900px){.bc-site-nav .bc-language-switch{display:none!important}.bc-mnav-lang{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;padding:10px 12px!important;border-top:1px solid #ead8b8!important;background:#fff9ef!important}.bc-mnav-lang .bc-language-switch{display:inline-flex!important;margin:0!important;color:#08245c!important}.bc-mnav-lang .bc-language-switch a{color:#08245c!important}.bc-mnav-lang .bc-language-switch a.active{color:#9a6812!important}}
