@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;400;700;800&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");

/* css reset */

abbr,article,aside,audio,blockquote,body,code,div,em,fieldset,footer,form,h1,h2,h3,h4,h5,h6,header,html,iframe,img,label,legend,li,nav,object,ol,p,pre,section,small,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,video{margin:0;padding:0;border:0;font-size:100%;font-weight:inherit;vertical-align:baseline;background:0 0}input[type=checkbox],th{vertical-align:middle}article,aside,figure,footer,header,nav,section{display:block}html{box-sizing:border-box;}*,:after,:before{box-sizing:inherit}img,object{max-width:100%}ul{list-style:none}table{border-collapse:collapse;border-spacing:0}th{font-weight:700}td{font-weight:400;vertical-align:top}input,select{vertical-align:middle}input[type=radio]{vertical-align:middle}strong{font-weight:700}button,input[type=file],label{cursor:pointer}button,input,select,textarea{margin:0;border:0}button::-moz-focus-inner{padding:0;border:0}


body {
	margin:0;
	font-family:Roboto, sans-serif;
	overflow-x:hidden;
}

#mobile-contact-buttons {
      position: fixed;
      right: 14px;
      bottom: calc(50px + env(safe-area-inset-bottom));
      display: flex;
      flex-direction: column;
      gap: 18px;
      z-index: 9999;
  }

  #mobile-contact-buttons .contact-btn {
      width: 66px;
      height: 66px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      text-decoration: none;
      box-shadow: 0 8px 18px rgba(0,0,0,0.28);
      transition: transform 0.15s ease, box-shadow 0.15s ease;
      -webkit-tap-highlight-color: transparent;
  }

  /* iconita un pic mai mare */
 #mobile-contact-buttons .contact-btn svg {
    width: 40px;
    height: 40px;
    fill: #ffffff;
}

  #mobile-contact-buttons .phone {
		background:#007AFF;
	}
	
  #mobile-contact-buttons .whatsapp {
    background: #34C759;
  }

  #mobile-contact-buttons .contact-btn:active {
      transform: scale(0.93);
  }
	
a {
	text-decoration:none;
}

header {
	box-sizing:border-box;
	background-color:#fff;
	color:#fff;
	padding:0 calc(50% - 600px);
	display:flex;
	justify-content:space-between;
	width:100%;
	align-items:center;
	z-index:10;
}

/* comun */
.lp-advantages {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* LI comun */
.lp-advantages li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 7px;
  font-size: 20px;
  line-height: 1.3;
  color: #222;
}

/* UL – bifa ✔ */
ul.lp-advantages li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: -0.2em;
  color: #16a34a !important;
	-webkit-text-fill-color: #16a34a !important; /* extra pentru Safari */
  font-weight: 700;
  font-size: 27px;
}

/* OL – reset counter */
ol.lp-advantages {
  counter-reset: step;
}

/* OL – cifra custom (badge rotund) */
ol.lp-advantages li::before {
  counter-increment: step;
  content: counter(step);

  position: absolute;
  left: 0;
  top: -0.05em;

  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;

  background: #000;
  color: #fff;

  font-weight: 800;
  font-size: 16px;

  border-radius: 50%;
}

.cta-call{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

	width:100%;
	max-width:400px;
	margin:20px 0;
  padding: 14px 22px;
  min-height: 48px;

  background: #0a84ff;           /* iOS blue */
  color: #fff;
  text-decoration: none;

  font-size: 18px;
  font-weight: 700;

  border-radius: 999px;          /* Apple-style pill */

	touch-action: manipulation;         /* ← aici e perfect */
  -webkit-tap-highlight-color: transparent;
}

.cta-call:hover{
  transform: translateY(-1px);
}

.cta-call:active{
  transform: translateY(0);
}

.verde {
	background-color:#2CAA4C;
}

.google-rating{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  font-size: 15px;
  font-weight: 600;
  color: #111;

  margin-top: 14px;
}

.google-rating span{
  color: #555;
  font-weight: 500;
}

.faq{
  margin-top: 24px;
}

.faq-item{
  padding: 16px 18px;
  margin-bottom: 12px;

  background: #fff;
  border-radius: 14px;
  border: 1px solid #eef2f7;

  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}

.faq-item h3{
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 700;
  color: #111;
}

.faq-item p{
  margin: 0;
  font-size: 18px;
  color: #555;
  line-height: 1.4;
}


.hLogo {
	width:100px;
	margin:10px 0 7px 15px;
}

.hLogo img {
	height:64px;
}

.hMenu {
	display:block;
}

.hMenu > ul {
	display:flex;
	justify-content:space-between;
	padding:0;
}

.hMenu a:link, .hMenu a:visited {
	color:#777;
	font-size:1.2rem;
	padding:12px;
}

.hMenu a:hover, .hMenu a:active {
	background-color:#ddd;
}

.hContactNum {
	width:200px;
	background-color:#000;
	position:relative;
	padding:35px;
}

.hContactNum a {
	top: 50%;
	position: absolute;
	transform: translate(-50%, -50%);
	left: 50%;
	color: #fff;
	font-weight:bold;
	font-size:1.3rem;
}

.telicon {
	padding:20px;
	background-color:#c1b694;
	color:#fff;
	display:none;
}

.carousel {
	position:relative;
	height:450px;
}

.carousel img {
	display:block;
	margin-left:auto;
	margin-right:auto;
	width:100%;
  height:100%; 
	object-fit:cover; 
}

section {
	padding:30px calc(50% - 600px);
}

section table {
	width:100%;
	margin:20px 0 20px 0;
}

section td {
	border:1px solid grey;
	padding:10px;
}

section th {
	border:1px solid grey;
	padding:10px;
	background-color:#f4f4f4;
	width:50%;
}

.explic {
	font-size:0.9rem;
	color:#777;
	display:block;
}

form {
	background-color:#4a4a4a;
	padding:20px;
	text-align:left;
	width:100%;
	margin:30px 0 30px 0;
}

section form p {
	font-size:1em;
	margin:0;
}

form button {
	padding:10px;
	background-color:#5fe3ea;
	text-transform:uppercase;
	font-size:0.9em;
	font-weight:bold;
	padding:10px 25px;
	display:block;
	margin:0 auto;
}

label {
	display:block;
	color:#5fe3ea;
	margin:10px 0 5px 0;
	font-weight:bold;
}

form h2 {
	margin:0 auto 20px auto;
	color:#5fe3ea;
}

input, select {
	-webkit-appearance: none;
	border:1px solid #ddd;
	padding:10px;
	display:block;
	margin:3px auto 20px auto;
	width:100%;
	font-size:1rem;
}

form span {
	font-weight:bold;
}

.alb {
	color:#fff;
}

.galben {
	color:#eadb5f;
}



.garantat {
	width:100px;
	margin-bottom:10px;
}

.cta:link, .cta:visited {
	padding:10px 30px;
	background-color:#c1b694;
	color:#fff;
	display:inline-block;
	margin:10px 0;
	border-radius:7px;
	font-weight:bold;
	font-size:1.2em;
}

.cta:hover, .cta:active  {
	text-decoration:underline;
}

.pills {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}

.pills div {
	width:25%;
	box-sizing:border-box;
	display:flex;
	flex-flow:column;
	padding:10px;
}

.pills .material-icons {
	font-size:60px;
	color:#c1b694;
}

.pills div span:nth-of-type(1) {
	font-weight:bold;
	text-transform:uppercase;
	margin:10px 0;
}

.pills div span:nth-of-type(2) {
	font-weight:normal;
	text-transform:none;
}

.hero-text {
	background-color:#000;
	color:#fff;
	padding:20px calc(50% - 600px);
	text-align:left;
}

.blight {
	background-color:#ececec;
}

.negru {
	color:#000;
}

figure {
	margin:20px;
}

blockquote {
	font-size:1.3em;
	color:#777;
	font-style:italic;
}

cite {
	margin-top:10px;
	display:inline-block;
	font-size:1rem;
}

.centru {
	text-align:center;
}

.stanga {
	text-align:left;
}

h1 {
	font-family:Manrope, Roboto, sans-serif;
	font-size:2rem;
	font-weight:800;
	line-height:1.2em;
}

h2 {
	font-family:Manrope, Roboto, sans-serif;
	font-size:1.7rem;
	font-weight:800;
	line-height:1.1em;
	color:#c1b694;
	margin-top:10px;
}

h3 {
	font-family:Manrope, Roboto, sans-serif;
	font-size:1.5rem;
	font-weight:800;
	line-height:1.1em;
	color:#c1b694;
	margin-top:10px;
}

.promo {
	padding:30px;
	background-color:#70bee4;
	color:#fff;
	margin:20px auto;
}

.price {
	font-size:2em;
	font-weight:bold;
}

.priceold {
	text-decoration: line-through;
	text-decoration-thickness:3px;
	opacity:0.5;
}


.titlu-margine-sus h2 {
	margin-top:30px;
}

.hero-text p {
	font-size:1.2em;
	margin-top:10px;
}

section p {
	font-size:1.1em;
	line-height:1.4em;
	margin-top:10px;
}

footer {
	text-align:left;
}

.foot {
	 background-color:#000; 
	 overflow:hidden; 
	 padding:30px calc(50% - 600px);
	 display:flex;
}

#hamburger {
	color:#777;
	padding:18px;
	display:none;
}

.dreapta {
	display:flex;
	justify-content:flex-end;
	position:relative;
}

.closebtn {
	display:none;
}



.jos {
	text-align:left;
	flex-grow:1;
	flex-basis:20%;
}

.jos:first-child {
	flex-grow:2;
	flex-basis:40%;
}

.jos a:link, .jos a:visited {
	text-decoration:none;
	color:#aaa;
	display:block;
	margin-bottom:12px;
}

.jos a:hover, .jos a:active {
	color:#fff;
}

.w33 {
	overflow:hidden;
	
}
.w33 div {
	padding:30px calc(50% - 600px);
	width:33%;
	float:left;
}

#logojos {
	width:90%;
}

/* Ecrane mici */

@media screen and (max-width:1200px) {
	section, .hero-text {
		padding-left:20px;
		padding-right:20px;
	}
}

@media screen and (max-width:800px) {
	
	.hMenu {
		display:none;
		position:fixed;
		height:100%;
		width:100%;
		top:0;
		left:0;
		overflow-x:hidden;
		background-color:#fff;
		z-index:1;
		padding-top:60px;
	}

	.hMenu ul {
		flex-direction:column;
	}
	
	.hMenu ul li {
		margin-top:25px;
	}
	
	.hMenu a:link, .hMenu a:visited {
		font-size:1.5rem;
	}
	
	.hMenu a.closebtn {
		display:block;
		position: absolute;
		top: 0;
		right:10px;
		font-size:35px;
	}
	
	.carousel {
		height:180px;
	}
	
	.hLogo {
		width:100px;
	}
	
	.hero-text {
		padding:20px;
	}
	
	header {
		position:fixed;
		top:0;
		height:80px;
	}
	
	main {
		margin-top:80px;
	}
	
	.pills {
		flex-wrap:wrap;
	}
	
	.pills div {
		width:50%;
	}
	
	section table {
		margin:20px auto;
	}
	
	.garantat {
		width:25%;
	}
	
	form {
		position:relative;
		margin:20px auto;
	}
	
	#comanda {
		display:block;
		position:relative;
		top:-100px;
		margin:0;
	}
	
	.hContactNum {
		display:none;
	}
	
	.telicon {
		display:block;
	}
	
	#hamburger {
		display:block;
	}
	
	.foot {
		padding:30px 20px;
	}
	
	#logojos {
		width:90%;
	}
}

@media screen and (max-width:640px) {

.foot {
 flex-wrap:wrap;
}

.jos {
	flex-basis:100%;
	text-align:center;
}

.w33 div {
	width:100%;
}
}