/* Fonturi locale. Restul (Roboto, Roboto Condensed, Teko, Archivo) vin din Google Fonts.
   2026-11-01: șterse 3 reguli @font-face care cereau fișiere inexistente (404) - rămase dintr-un
   find/replace "Lumberjack" -> "Roboto condensed" - și care încurcau fontul Google "Roboto Condensed".
   Șters și NexaRustScriptL (nefolosit). */
@font-face {
	font-family: 'Proximanova';
	src: url('../fonts/ProximaNova-Light.otf') format('opentype');
	font-display: swap;
}

body {
	padding-top:40px;
	    background-color: #ffffff;
	background-image: url('../img/bg-fundal.png');
	background-repeat: repeat;
	font-family: 'Roboto', serif !important;
	font-size:20px;
	color: #fcfcfc;
	font-weight: 200;
}

a,a:active,a:hover {
	color: #ffffff;
}

h3 {
	font-family: 'Roboto condensed', sans-serif;
	font-weight: 200;
	color: #ff3737;
	border-bottom: 2px solid #ffffff;

	margin-top: 0;
}

.shadow {
	-webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.72);
	-moz-box-shadow: 0px 5px 40px 0px rgba(0,0,0,0.72);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.72);
}

.row {
	margin-bottom:20px;
}

.footer {
	font-size:16px;
	background-color: rgba(0,0,0,0.8);
	padding-top:10px;
}

ul.sidebar {
	margin-top:5%;
	padding:0;
	text-align: left;
	padding-left: 3%;
}

ul.sidebar li {
	list-style: none;
	margin-top:2px;
	margin-bottom:2px;
	font-family: 'Proximanova', sans-serif;
}

ul.sidebar li.active a {
	color: #ff3737;
	font-weight: 700;
}

.logo img {
	width: 100%;
}

#sidebar {
  background-color: #000000;
  box-shadow: 0px 2px 37.26px 8.74px rgba(4, 7, 7, 0.004);
  	padding-top:2%;
  	padding-bottom: 2%;
  	font-size: 16px;
}

.products-list {
    display: block;
}

#menu {
	position: fixed;
	top:30px;
	left: 20px;
	z-index:9999;
}

#menu.menu-open {
	position: fixed;
	top:30px;
	right: 20px;
	text-align: right;
}

#sidebar.fixed {
    position: fixed;
    top: 0;
    z-index: 9999;
}


.ancora {
	background: url('../img/fundal-ancora.png');
	position: relative;
}

 h2 {
	font-family: 'Teko', sans-serif;
	font-size: 70px;
	font-weight: bold;
	color:#fffefe;
}

.cat h2 {
	font-size: 35px;
}

 .title {
	font-family: 'Teko', sans-serif;
	font-weight: 900;
	font-size: 25px;
	margin-top: 2%;
	color:#ffffff;
}

 .description {
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-size: 14px;
	color:#ffffff;
}

.element .description {
	font-size: 13px;
}

.titlecategorie{
    color: #ffffff;
}

.old {
 	position: relative;
 	font-family: 'Teko', sans-serif;
 	font-weight: 100;
 	font-size: 35px;
 	color:#ffffff;
}

 .old:before {
	content: '';
	position: absolute;
	height: 2px;
	    width: 107%;
    transform: rotate(-8deg);
    left: -3%;
    bottom: 25px;
	background: #ff3737;
}

 .new {
 	position: relative;
 	font-family: 'Teko', sans-serif;
 	font-size: 60px;
 	line-height: 1;
 	font-weight: bold;
 	color: #ff3737;
}

 .tag {
	position: absolute;
	/*background: url('../img/chenar-discount.png') no-repeat top center;*/
	background-size: 70%;
    top: 0;
    padding: 2% 2% 2% 2%;
    color: #c52d2d;
    font-family: "Roboto Condensed";
    font-weight: bold;
}

.ancora .tag {
	right: 5%;
}

.tag .tag-price {
	font-family: "Roboto Condensed", sans-serif;
	font-size: 50px;
}

.prod-img {
    margin-top: 30%;
}

.element {
	position: relative;
	background: url('../img/fundal-prod.png');
	padding-top: 12%;
	min-height: 355px;
}

.element .tag {
	right: -4%;
	background-size: 75%;
	    z-index: 100;
    right: 0;
top: 0;
}	

.element .tag .tag-price {
	font-size: 36px;
	color: #c52d2d;
}

.element h2 {
	font-size: 40px;
	margin-bottom: 0;
	font-family: 'Teko', sans-serif;
}

.element .old {
	font-size: 40px;
}

.element .new {
	font-size: 45px;
	margin-left: 3%;
}

.element .title {
	font-size: 29px;
}

.element .old:before {
	bottom: 30px;
}

@media screen and (max-width: 991px){
	#sidebar {
		position: fixed;
	    top: 0;
	    z-index: 9999;
	    height: 100%;
	    width: 80%;
	    left: -80%;
	}
	#sidebar.open {
		left:0;
	}
}

@media screen and (max-width: 500px){
	.header {
		width: 100% !important;
		margin-left:auto !important;
	}
	.logo {
		text-align:center;
	}
	.logo img {
		width:80%;
	}
	.link {
		text-align: center;
		font-size: 15px;
	}
	#sidebar {
		position: fixed;
	    top: 0;
	    z-index: 9999;
	    height: 100%;
	    width: 80%;
	    left: -80%;
	}
	#sidebar.open {
		left:0;
	}
	.products-container .col-md-4 {
		margin-bottom: 20px;
	}

	ul.sidebar li {
		font-size:16px;
	}

	h2, .element h2 {
		font-size: 30px;
	}

	.title, .element .title {
		font-size: 16px;
	}

	.description {
		font-size: 11px;
	}

	.old, .element .old {
		font-size: 18px;
	}

	.old:before, .element .old:before {
		bottom: 13px;
	}

	.new, .element .new {
		font-size: 28px;
		display: block;
		margin-left: 0 !important;
	}

	.ancora .tag, .element .tag {
		right: 0;
	}
	.element .tag {
		    padding: 10%;
	}
	.tag .tag-price {
		font-size: 20px;
	}

	 .element .tag .tag-price {
	 	font-size: 26px;
	 }

	.element .description {
		font-size: 15px;
	}
}

.price{
    margin-top: 5%;
}

@media screen and (max-width: 500px){
.price {
margin-top: 50%;
}
.element .price{
margin-top:5%;
}
}

.element .tag {
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0.75;
}
.ancora .tag {
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0.75;
}

.banner-pickup {
          background-image: url('../img/fundal-ancora.png');
          background-color: #000000;
          background-size: cover;
          background-position: center;
          padding: 60px 20px;
          text-align: center;
          font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
          color: #ffffff;
          margin-bottom: 20px;
        }

.titlu-pickup {
font-family: 'Teko', sans-serif;
	font-size: 50px;
	font-weight: bold;
	color:#ffffff;
}

.subtitlu-pickup {
          font-size: 30px;
          font-weight: 500;
          margin: 0 0 20px 0;
          letter-spacing: 0.5px;
          color: #ffffff;
        }

.buton-contact {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          background-color: #ff3737;
          color: #ffffff; 
          text-decoration: none;
          padding: 12px 24px;
          border-radius: 6px;
          font-size: 20px;
          font-weight: 700;
          letter-spacing: 1px;
          transition: transform 0.2s ease, box-shadow 0.2s ease;
        }
        
.buton-contact:hover, .buton-contact:focus {
          transform: translateY(-2px);
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
          color: #0b1320;
          text-decoration: none;
        }

.icon-whatsapp {
          margin-right: 12px;
        }

/* ==========================================================================
   RESPONSIVE (2026-11-04)
   ========================================================================== */
/* Bannerul din header: lățimea 124% + margin-left -110px e gândită pentru desktop mare.
   Sub 1200px ieșea din ecran și dădea scroll orizontal. */
@media screen and (max-width: 1199px){
	.header {
		width: 100% !important;
		margin-left: 0 !important;
	}
}

/* Tabletă / telefon (meniul ☰ e fix în stânga sus): logo-ul nu mai stă sub buton */
@media screen and (max-width: 991px){
	header .logo {
		padding-left: 60px;
	}
	#menu a {
		display: inline-block;
		padding: 6px 8px;
		background: rgba(0,0,0,0.6);
		border-radius: 4px;
	}
}
@media screen and (max-width: 500px){
	header .logo {
		padding-left: 15px;
	}
}

/* Titluri lungi (brand-uri, "Vrei alt produs decât ... AMPLIFICATOARE?"):
   se micșorează pe ecrane mici și se rup pe rând nou în loc să iasă din card */
.ancora h2, .element h2, .titlu-pickup {
	overflow-wrap: break-word;
	word-wrap: break-word;
}
@media screen and (max-width: 767px){
	.titlu-pickup {
		font-size: 34px;
		line-height: 1.05;
	}
	.subtitlu-pickup {
		font-size: 22px;
	}
	.banner-pickup {
		padding: 35px 15px;
	}
	.buton-contact {
		font-size: 18px;
		padding: 12px 18px;
	}
}

/* Plasă de siguranță: nimic nu mai poate produce scroll orizontal pe telefon.
   Doar pe body (nu și pe html) - altfel body devine container de scroll și nu mai merge
   sidebar-ul fix la scroll. */
body {
	overflow-x: hidden;
}