/*
Theme Name: BitanBit
Theme URI: http://localhost/bitanbit
Author: BitanBit
Description: Lagana, samostalna WordPress tema za BitanBit. Semantički HTML, responzivan dizajn, bez ovisnosti o Elementoru ili page builder pluginovima. Kompatibilna s pluginom BitanBit Edukacije.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bitanbit
Tags: custom-menu, featured-images, translation-ready, block-styles, right-sidebar, threaded-comments
*/

/* Design tokens — BitanBit brand */
:root{
	--bb-accent:#da2f3b;--bb-accent-dark:#b71f2b;
	--bb-ink:#1f2933;--bb-muted:#6b7280;--bb-line:#e5e7eb;--bb-bg:#ffffff;--bb-soft:#f7f8fa;
	--bb-max:1140px;--bb-radius:10px;
	--bb-font:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
	--bb-font-head:'Roboto Slab',Georgia,serif;
}

*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
body{margin:0;font-family:var(--bb-font);color:var(--bb-ink);line-height:1.65;background:var(--bb-bg);font-size:17px}
/* Guard: keep Elementor decorative overflow (hexagons, 100vw sections) from creating horizontal scroll */
.site-content{overflow-x:clip}
h1,h2,h3,h4,h5,h6{font-family:var(--bb-font-head);line-height:1.25;color:var(--bb-ink)}
a{color:var(--bb-accent);text-decoration:none}
a:hover,a:focus{color:var(--bb-accent-dark);text-decoration:underline}
img{max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--bb-accent);outline-offset:2px}

.bb-container{max-width:var(--bb-max);margin:0 auto;padding:0 1.25rem}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--bb-accent);color:#fff;padding:.6rem 1rem;z-index:1000}
.skip-link:focus{left:.5rem;top:.5rem}

/* Header */
.site-header{border-bottom:1px solid var(--bb-line);background:#fff;position:sticky;top:0;z-index:200;box-shadow:0 1px 6px rgba(0,0,0,.04)}
.site-header__inner{display:flex;align-items:center;gap:1.5rem;padding:.7rem 1.25rem;max-width:var(--bb-max);margin:0 auto}
.site-branding{flex:0 0 auto;line-height:0}
.site-branding img,.custom-logo{max-height:50px;width:auto;height:auto}
.site-title{font-size:1.4rem;margin:0;line-height:1;font-family:var(--bb-font-head)}
.site-title a{color:var(--bb-ink)}
.main-navigation{margin-left:auto}
.main-navigation>ul{list-style:none;display:flex;align-items:center;gap:1.4rem;margin:0;padding:0}
.main-navigation li{position:relative}
.main-navigation a{color:var(--bb-ink);font-weight:600;padding:.4rem 0;display:inline-block}
.main-navigation a:hover{color:var(--bb-accent);text-decoration:none}
.main-navigation .current-menu-item>a,.main-navigation .current-menu-ancestor>a{color:var(--bb-accent)}
/* Dropdown menus */
.main-navigation .menu-item-has-children>a::after{content:"";display:inline-block;margin-left:.35em;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.main-navigation ul ul{position:absolute;top:100%;left:0;min-width:230px;background:#fff;border:1px solid var(--bb-line);border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.1);padding:.4rem 0;margin:0;list-style:none;display:block;opacity:0;visibility:hidden;transform:translateY(6px);transition:.15s;z-index:250}
.main-navigation li:hover>ul,.main-navigation li:focus-within>ul{opacity:1;visibility:visible;transform:translateY(0)}
.main-navigation ul ul li{width:100%}
.main-navigation ul ul a{display:block;padding:.5rem 1.1rem;font-weight:500}
.main-navigation ul ul a:hover{background:var(--bb-soft)}
.site-header__actions{flex:0 0 auto}
.bb-btn--header{padding:.55rem 1.15rem}
.menu-toggle{display:none;background:var(--bb-accent);color:#fff;border:0;border-radius:6px;padding:.6rem .7rem;cursor:pointer;margin-left:auto;position:relative;width:44px;height:40px}
.menu-toggle__bar,.menu-toggle__bar::before,.menu-toggle__bar::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:20px;height:2px;background:#fff}
.menu-toggle__bar{top:50%}
.menu-toggle__bar::before{top:-6px}
.menu-toggle__bar::after{top:6px}

/* Layout */
.site-main{padding:2.5rem 0;min-height:50vh}
.content-area{display:grid;grid-template-columns:1fr 300px;gap:2.5rem;max-width:var(--bb-max);margin:0 auto;padding:0 1.25rem}
.content-area--full{grid-template-columns:1fr}
.entry-header{margin-bottom:1.25rem}
.entry-title{margin:0 0 .5rem;font-size:2rem}
.entry-meta{color:var(--bb-muted);font-size:.9rem}
.entry-content{font-size:1.05rem}
.entry-content h2{margin-top:2rem}
.entry-content img{border-radius:var(--bb-radius)}
.entry-content blockquote{border-left:4px solid var(--bb-accent);margin:1.5rem 0;padding:.5rem 1.25rem;color:var(--bb-muted);background:var(--bb-soft)}
.post-thumbnail img{border-radius:var(--bb-radius);margin-bottom:1.5rem;width:100%;object-fit:cover}

/* Post cards (archive) */
.post-card{border-bottom:1px solid var(--bb-line);padding:1.5rem 0}
.post-card__title{margin:0 0 .4rem;font-size:1.4rem}
.post-card__excerpt{color:#374151}

/* Buttons */
.bb-btn{display:inline-block;background:var(--bb-accent);color:#fff;padding:.7rem 1.4rem;border-radius:6px;font-weight:600}
.bb-btn:hover{background:var(--bb-accent-dark);color:#fff;text-decoration:none}

/* Widgets / sidebar */
.widget-area .widget{margin-bottom:2rem}
.widget-title{font-size:1.15rem;border-bottom:2px solid var(--bb-line);padding-bottom:.4rem}
.widget ul{list-style:none;padding:0;margin:0}
.widget li{padding:.3rem 0;border-bottom:1px solid var(--bb-line)}

/* Forms */
input[type=text],input[type=email],input[type=url],input[type=search],input[type=tel],textarea,select{
	width:100%;max-width:100%;padding:.6rem .7rem;border:1px solid #cbd2d9;border-radius:6px;font:inherit}
.search-form{display:flex;gap:.5rem}
.search-form .search-submit{width:auto}

/* Pagination */
.pagination{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:2rem}
.pagination .page-numbers{padding:.45rem .8rem;border:1px solid var(--bb-line);border-radius:6px;color:var(--bb-ink)}
.pagination .current{background:var(--bb-accent);color:#fff;border-color:var(--bb-accent)}

/* CTA band above footer */
.footer-cta{background:var(--bb-accent);color:#fff;margin-top:3rem}
.footer-cta__inner{max-width:var(--bb-max);margin:0 auto;padding:2.2rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.footer-cta__title{color:#fff;margin:0;font-size:1.6rem;max-width:780px}
.bb-btn--light{background:#fff;color:var(--bb-accent)}
.bb-btn--light:hover{background:#f1f1f1;color:var(--bb-accent-dark)}

/* Footer */
.site-footer{background:#1f2933;color:#cbd5e1}
.site-footer a{color:#fff}
.site-footer a:hover{color:var(--bb-accent);text-decoration:none}
.site-footer__inner{max-width:var(--bb-max);margin:0 auto;padding:3rem 1.25rem 2rem;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.site-footer__logo{max-height:56px;width:auto;margin-bottom:1rem;filter:brightness(0) invert(1)}
.site-footer__logo-text{font-size:1.3rem;color:#fff;display:block;margin-bottom:.75rem}
.site-footer__tagline{color:#9aa7b5;max-width:340px}
.site-footer__heading{color:#fff;font-size:1.1rem;margin:0 0 1rem}
.social-icons{list-style:none;display:flex;gap:.6rem;padding:0;margin:1.25rem 0 0}
.social-icons a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;transition:.15s}
.social-icons a:hover{background:var(--bb-accent);color:#fff}
.contact-list{list-style:none;padding:0;margin:0;line-height:1.9}
.contact-list__label{display:inline-block;min-width:52px;color:#9aa7b5}
.contact-list__address{color:#cbd5e1;margin-top:.5rem}
.contact-list__oib{color:#9aa7b5;font-size:.9rem}
.footer-menu{list-style:none;padding:0;margin:0;line-height:2}
.site-footer__bottom{border-top:1px solid rgba(255,255,255,.1)}
.site-footer__bottom-inner{max-width:var(--bb-max);margin:0 auto;padding:1.1rem 1.25rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:#94a3b8;font-size:.9rem}

/* Comments */
.comment-list{list-style:none;padding:0}
.comment-body{border-bottom:1px solid var(--bb-line);padding:1rem 0}

/* 404 */
.error-404{text-align:center;padding:3rem 0}
.error-404 .error-code{font-size:5rem;color:var(--bb-accent);margin:0}

/* Accessibility helpers */
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);word-wrap:normal}

/* Elementor full-width compatibility: don't let the theme constrain Elementor pages. */
.elementor-page .site-main,.elementor-page.page .site-main{padding:0}
.page-template-elementor_header_footer .site-main{padding:0}
body.elementor-page #content>.content-area{display:block;max-width:none;padding:0}
/* Neutralize Elementor "stretched section" JS width (root cause of horizontal overflow
   now that sections stretch to the old body, not the new theme wrapper). */
.elementor-section.elementor-section-stretched{width:100%!important;left:0!important;right:auto!important;margin-left:0!important;margin-right:0!important}
.elementor-section .elementor-container{max-width:100%}
img,svg,video,iframe{max-width:100%;height:auto}

/* Responsive */
@media(max-width:960px){
	.content-area{grid-template-columns:1fr}
	.site-footer__inner{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
	.menu-toggle{display:block;margin-left:0;order:3}
	.site-header__inner{flex-wrap:wrap;gap:.6rem}
	.site-branding{order:0;margin-right:auto}
	.site-branding img,.custom-logo{max-height:40px}
	.site-header__actions{order:2;margin-left:0}
	.bb-btn--header{padding:.5rem .9rem;font-size:.95rem}
	.main-navigation{order:4;flex:1 0 100%;margin-left:0;display:none}
	.main-navigation.is-open{display:block}
	.main-navigation>ul{flex-direction:column;align-items:stretch;gap:0}
	.main-navigation>ul>li{border-top:1px solid var(--bb-line)}
	.main-navigation a{padding:.75rem .25rem}
	.main-navigation .menu-item-has-children>a::after{float:right;margin-top:.5em}
	/* Mobile: show submenus statically (accordion-lite via focus/hover kept simple) */
	.main-navigation ul ul{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-radius:0;padding:0 0 .3rem 1rem;min-width:0}
	.main-navigation ul ul a{padding:.5rem .25rem}
}
@media(max-width:640px){
	.site-footer__inner{grid-template-columns:1fr;gap:2rem}
	.footer-cta__inner{flex-direction:column;align-items:flex-start}
	.footer-cta__title{font-size:1.35rem}
	.entry-title{font-size:1.6rem}
}

/* Final UI pass: premium header/footer/CTA system */
.site-header{
	border-bottom:1px solid rgba(31,41,51,.08);
	background:rgba(255,255,255,.96);
	backdrop-filter:saturate(140%) blur(14px);
	box-shadow:0 8px 28px rgba(31,41,51,.06);
}
.site-header__inner{
	max-width:1180px;
	min-height:72px;
	padding:.72rem 1.4rem;
	gap:1.6rem;
}
.site-branding img,.custom-logo{
	max-height:46px;
}
.main-navigation>ul{
	gap:1.05rem;
}
.main-navigation a{
	position:relative;
	color:#18212f;
	font-size:15.5px;
	font-weight:700;
	padding:.65rem .16rem;
	letter-spacing:0;
}
.main-navigation>ul>li>a::before{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:.34rem;
	height:2px;
	border-radius:999px;
	background:var(--bb-accent);
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .18s ease;
}
.main-navigation>ul>li>a:hover::before,
.main-navigation>ul>.current-menu-item>a::before,
.main-navigation>ul>.current-menu-ancestor>a::before{
	transform:scaleX(1);
}
.main-navigation .current-menu-item>a,
.main-navigation .current-menu-ancestor>a{
	color:var(--bb-accent);
}
.main-navigation ul ul{
	min-width:250px;
	border:1px solid rgba(31,41,51,.08);
	border-radius:8px;
	box-shadow:0 18px 45px rgba(31,41,51,.13);
	padding:.55rem;
}
.main-navigation ul ul a{
	border-radius:6px;
	padding:.62rem .75rem;
	font-size:14.5px;
}
.main-navigation ul ul a:hover{
	background:#f6f7f9;
}
.bb-btn--header{
	border-radius:6px;
	padding:.68rem 1.16rem;
	box-shadow:0 10px 22px rgba(218,47,59,.18);
}
.menu-toggle{
	border-radius:7px;
	box-shadow:0 10px 22px rgba(218,47,59,.18);
}
.footer-cta{
	margin-top:0;
	background:#f7f8fa;
	color:var(--bb-ink);
	border-top:1px solid var(--bb-line);
}
.footer-cta__inner{
	max-width:1180px;
	padding:1.2rem 1.4rem;
	display:grid;
	grid-template-columns:minmax(0,1fr) auto;
	align-items:center;
	gap:1.5rem;
}
.footer-cta__title{
	color:var(--bb-ink);
	font-family:var(--bb-font);
	font-size:clamp(21px,1.9vw,27px);
	line-height:1.18;
	max-width:760px;
}
.footer-cta .bb-btn--light{
	background:var(--bb-accent);
	color:#fff;
	box-shadow:0 12px 26px rgba(218,47,59,.18);
}
.footer-cta .bb-btn--light:hover{
	background:var(--bb-accent-dark);
	color:#fff;
}
.site-footer{
	background:#0e1822;
	color:#d6dde5;
}
.site-footer__inner{
	max-width:1180px;
	padding:2.45rem 1.4rem 2.05rem;
	grid-template-columns:1.2fr .95fr .85fr;
	gap:3rem;
}
.site-footer__logo{
	max-height:50px;
	margin-bottom:1.1rem;
}
.site-footer__tagline{
	color:#b7c2ce;
	font-size:15.5px;
	line-height:1.65;
}
.site-footer__heading{
	font-family:var(--bb-font);
	font-size:14px;
	font-weight:800;
	text-transform:uppercase;
	letter-spacing:.04em;
	margin-bottom:1.1rem;
}
.contact-list,
.footer-menu{
	line-height:1.85;
}
.contact-list li,
.footer-menu li{
	margin-bottom:.22rem;
}
.site-footer__bottom-inner{
	max-width:1180px;
	padding:.9rem 1.4rem;
}
@media(max-width:900px){
	.site-header__inner{min-height:64px}
	.main-navigation>ul>li>a::before{display:none}
	.footer-cta__inner{grid-template-columns:1fr;gap:1rem}
	.site-footer__inner{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
	.site-branding img,.custom-logo{max-height:38px}
	.site-header__actions{margin-left:auto}
	.footer-cta__inner{padding:1.25rem 1.25rem}
	.site-footer__inner{grid-template-columns:1fr;padding:2.35rem 1.25rem 1.8rem;gap:1.9rem}
}