*  {
  margin:0;
  padding:0;
  box-sizing:border-box
}
html  {
  scroll-behavior:smooth
}
body  {
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  line-height:1.6;
  color:#333
}
.container  {
  max-width:1200px;
  margin:0 auto;
  padding:0 20px
}
nav  {
  position:fixed;
  top:0;
  width:100%;
  background:#000000e6;
  backdrop-filter:blur(10px);
  z-index:1000;
  padding:1rem 0
}
.nav-container  {
  max-width:1400px;
  margin:0 auto;
  padding:0 2rem;
  display:flex;
  justify-content:space-between;
  align-items:center
}
.logo img  {
  height:60px;
  width:auto
}
.nav-links  {
  display:flex;
  gap:2rem;
  align-items:center;
  list-style:none
}
.nav-links a  {
  color:#fff;
  text-decoration:none;
  transition:color .3s
}
.nav-links a:hover  {
  color:#d4af37
}
.btn  {
  background:#d4af37;
  color:#000;
  padding:.75rem 1.5rem;
  border-radius:50px;
  text-decoration:none;
  font-weight:600;
  transition:background .3s;
  border:none;
  cursor:pointer;
  display:inline-block
}
.btn:hover  {
  background:#b8941f
}
.btn-large  {
  padding:1.25rem 3rem;
  font-size:1.1rem
}
.mobile-menu-btn  {
  display:none;
  background:none;
  border:none;
  color:#fff;
  font-size:1.8rem;
  cursor:pointer
}
.mobile-menu  {
  display:none;
  background:#000000f2;
  padding:1rem 2rem 2rem
}
.mobile-menu.active  {
  display:block
}
.mobile-menu a  {
  display:block;
  color:#fff;
  text-decoration:none;
  padding:.75rem 0;
  transition:color .3s
}
.mobile-menu a:hover  {
  color:#d4af37
}
.hero  {
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background-color:#fff;
  background-image:url(/imagini/header-bg.png);
  background-repeat:no-repeat;
  background-size:contain;
  background-position:top center;
  color:#000;
  padding:140px 20px 80px
}
.hero-content  {
  max-width:900px
}
.hero img  {
  max-width:300px;
  margin-bottom:2rem
}
.hero h1  {
  font-size:2.5rem;
  margin-bottom:2rem;
  line-height:1.3
}
.hero-content  {
  max-width:950px;
  margin:0 auto;
  text-align:center;
  padding:160px 20px 80px
}
.hero img.hero-logo  {
  display:block;
  margin:0 auto 450px;
  max-width:340px;
  height:auto
}
.hero h1  {
  font-size:2rem;
  line-height:1.5;
  color:#fff;
  font-weight:600
}
.stats  {
  background:#fff;
  padding:5rem 2rem
}
.stats h2  {
  text-align:center;
  font-size:2rem;
  margin-bottom:3rem;
  color:#333
}
.stats-grid  {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:2rem;
  text-align:center
}
.stat-item  {
  padding:1rem
}
.stat-number  {
  font-size:3.5rem;
  font-weight:700;
  color:#d4af37;
  margin-bottom:.5rem
}
.stat-label  {
  font-size:1.2rem;
  color:#666
}
.free-training  {
  background:#f5f5f5;
  padding:5rem 2rem
}
.two-column  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  align-items:center;
  max-width:1200px;
  margin:0 auto
}
.two-column img  {
  width:100%;
  border-radius:10px;
  box-shadow:0 10px 30px #0003
}
.two-column h2  {
  font-size:2.5rem;
  margin-bottom:1.5rem;
  color:#333
}
.two-column p  {
  font-size:1.1rem;
  margin-bottom:2rem;
  color:#555;
  line-height:1.8
}
.before-after  {
  background:#000;
  color:#fff;
  padding:5rem 2rem
}
.before-after h2  {
  text-align:center;
  font-size:2.5rem;
  margin-bottom:3rem
}
.comparison-grid  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  max-width:1200px;
  margin:0 auto
}
.comparison-card  {
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 30px #0000004d
}
.comparison-card img  {
  width:100%;
  height:250px;
  object-fit:cover
}
.comparison-card-content  {
  padding:2rem;
  color:#333
}
.comparison-card h3  {
  font-size:1.8rem;
  margin-bottom:1.5rem
}
.comparison-list  {
  list-style:none
}
.comparison-list li  {
  display:flex;
  align-items:flex-start;
  gap:1rem;
  margin-bottom:1rem;
  font-weight:500
}
.icon-x  {
  color:#ef4444;
  font-size:1.3rem;
  flex-shrink:0
}
.icon-check  {
  color:#22c55e;
  font-size:1.3rem;
  flex-shrink:0
}
.benefits  {
  background:linear-gradient(#000000b3,#000000b3),url(https://ext.same-assets.com/619753800/993601211.png);
  background-size:cover;
  background-position:center;
  color:#fff;
  padding:5rem 2rem;
  text-align:center
}
.benefits h2  {
  font-size:2.5rem;
  margin-bottom:1rem
}
.benefits h3  {
  font-size:3rem;
  margin-bottom:1rem
}
.benefits h4  {
  font-size:2rem;
  margin-bottom:3rem
}
.benefits-grid  {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:1.5rem;
  max-width:1200px;
  margin:0 auto 2rem
}
.benefit-item  {
  background:#ffffff1a;
  backdrop-filter:blur(10px);
  border:2px solid #d4af37;
  border-radius:10px;
  padding:1.5rem;
  display:flex;
  align-items:center;
  gap:1rem
}
.benefit-item .icon-check  {
  font-size:1.5rem
}
.testimonials  {
  background:linear-gradient(#000c,#000c),url(https://ext.same-assets.com/619753800/2713294103.png);
  background-size:cover;
  background-position:center;
  color:#fff;
  padding:5rem 2rem
}
.testimonials h2  {
  text-align:center;
  font-size:3rem;
  margin-bottom:1rem
}
.testimonials-subtitle  {
  text-align:center;
  font-size:1.2rem;
  margin-bottom:3rem
}
.testimonials-grid  {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:2rem;
  max-width:1200px;
  margin:0 auto
}
.testimonial-card  {
  background:#000c;
  border:2px solid #d4af37;
  border-radius:10px;
  padding:2rem
}
.quote  {
  color:#d4af37;
  font-size:3rem;
  line-height:1
}
.testimonial-amount  {
  font-size:2.5rem;
  font-weight:700;
  margin:.5rem 0
}
.testimonial-days  {
  font-size:1.1rem;
  margin-bottom:1.5rem
}
.testimonial-text  {
  margin-bottom:2rem;
  line-height:1.6
}
.testimonial-author  {
  display:flex;
  align-items:center;
  gap:1rem
}
.author-avatar  {
  width:50px;
  height:50px;
  background:#666;
  border-radius:50%
}
.faq  {
  background:#000;
  color:#fff;
  padding:5rem 2rem
}
.faq h2  {
  text-align:center;
  font-size:3rem;
  margin-bottom:3rem
}
.faq-container  {
  max-width:900px;
  margin:0 auto
}
.faq-item  {
  border-bottom:1px solid #444;
  padding:2rem 0
}
.faq-question  {
  display:flex;
  gap:1rem;
  margin-bottom:1rem
}
.faq-q  {
  color:#d4af37;
  font-size:1.3rem;
  font-weight:700
}
.faq-question h3  {
  font-size:1.3rem;
  font-weight:700
}
.faq-answer  {
  color:#d4af37;
  line-height:1.8;
  padding-left:2.5rem
}
.contact  {
  background:#000;
  color:#fff;
  padding:5rem 2rem
}
.contact h2  {
  text-align:center;
  color:#d4af37;
  font-size:3rem;
  margin-bottom:3rem
}
.contact-form  {
  max-width:700px;
  margin:0 auto
}
.form-row  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin-bottom:1.5rem
}
.form-group  {
  margin-bottom:1.5rem
}
input,textarea  {
  width:100%;
  padding:1rem;
  border:none;
  border-radius:5px;
  font-size:1rem;
  font-family:inherit
}
textarea  {
  min-height:150px;
  resize:vertical
}
.checkbox-group  {
  display:flex;
  gap:1rem;
  align-items:flex-start;
  margin-bottom:1.5rem
}
.checkbox-group input[type="checkbox"]  {
  width:auto;
  margin-top:.25rem
}
.checkbox-group label  {
  font-size:.9rem;
  line-height:1.6
}
.btn-submit  {
  width:100%;
  padding:1.25rem;
  font-size:1.2rem
}
footer  {
  background:#000;
  color:#fff;
  padding:3rem 2rem;
  border-top:1px solid #333
}
.footer-content  {
  max-width:1400px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:2rem
}
.footer-logo img  {
  height:80px
}
.footer-links  {
  display:flex;
  gap:1.5rem;
  flex-wrap:wrap;
  align-items:center
}
.footer-links a  {
  color:#d4af37;
  text-decoration:none;
  font-size:.9rem
}
.footer-links a:hover  {
  color:#fff
}
.separator  {
  color:#666
}
.stars  {
  display:flex;
  gap:.25rem;
  margin-bottom:1.5rem
}
.star  {
  color:#d4af37;
  font-size:2rem
}
.social-section  {
  background:#f5f5f5;
  padding:5rem 2rem;
  text-align:center
}
.social-section h2  {
  font-size:2rem;
  margin-bottom:2rem;
  color:#333
}
.social-buttons  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  max-width:600px;
  margin:0 auto
}
.social-btn  {
  border:2px solid #d4af37;
  background:#fff;
  color:#d4af37;
  padding:1.5rem;
  border-radius:5px;
  font-size:1.1rem;
  font-weight:600;
  cursor:pointer;
  transition:all .3s;
  text-decoration:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.75rem
}
.social-btn:hover  {
  background:#d4af37;
  color:#000
}
@media (max-width: 768px)  {
.nav-links  {
  display:none
}
.mobile-menu-btn  {
  display:block
}
.hero h1  {
  font-size:1.8rem
}
.two-column  {
  grid-template-columns:1fr
}
.comparison-grid  {
  grid-template-columns:1fr
}
.form-row  {
  grid-template-columns:1fr
}
.social-buttons  {
  grid-template-columns:1fr
}
.footer-content  {
  flex-direction:column;
  text-align:center
}
.stat-number  {
  font-size:2.5rem
}
.benefits h2  {
  font-size:1.8rem
}
.benefits h3  {
  font-size:2rem
}
.benefits h4  {
  font-size:1.5rem
}
}
.hero-stats  {
  margin-top:3rem;
  text-align:center
}
.hero-stats h2  {
  font-size:1.3rem;
  font-weight:700;
  margin-bottom:2rem;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.8px
}
.hero-stats .stats-grid  {
  display:flex;
  justify-content:center;
  align-items:stretch;
  gap:2rem;
  flex-wrap:nowrap;
  max-width:1100px;
  margin:0 auto;
  margin-bottom:10rem
}
.hero-stats .stat-item  {
  flex:1 1 0;
  min-width:0;
  text-align:center
}
.hero-stats .stat-number  {
  font-size:2.2rem;
  font-weight:800;
  color:#d4af37;
  margin-bottom:.4rem;
  white-space:nowrap
}
.hero-stats .stat-label  {
  font-size:1rem;
  color:#bbb;
  letter-spacing:.3px
}
@media (max-width: 768px)  {
.hero-stats .stats-grid  {
  flex-wrap:wrap;
  gap:1.5rem
}
.hero-stats .stat-item  {
  flex:1 1 45%
}
.hero-stats .stat-number  {
  font-size:1.8rem
}
}
.about  {
  background:#fff;
  color:#333;
  padding:6rem 2rem
}
.about-grid  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:center;
  max-width:1200px;
  margin:0 auto
}
.about h2  {
  font-size:2.5rem;
  color:#000;
  margin-bottom:1.5rem;
  line-height:1.3
}
.about-intro  {
  font-size:1.15rem;
  color:#555;
  line-height:1.8;
  margin-bottom:2.5rem
}
.about-text h3  {
  font-size:1.4rem;
  color:#000;
  margin:2rem 0 1rem
}
.about-text p  {
  font-size:1.05rem;
  line-height:1.8;
  margin-bottom:1.5rem;
  color:#555
}
.about-list  {
  list-style:none;
  margin-bottom:3rem
}
.about-list li  {
  margin-bottom:.9rem;
  font-size:1rem;
  color:#444;
  line-height:1.6
}
.about-image img  {
  width:100%;
  border-radius:10px;
  box-shadow:0 10px 30px #00000026;
  object-fit:cover
}
@media (max-width: 900px)  {
.about-grid  {
  grid-template-columns:1fr;
  gap:3rem
}
.about-image  {
  order:-1;
  text-align:center
}
.about-image img  {
  max-width:80%
}
.about h2  {
  text-align:center
}
.about-intro  {
  text-align:center
}
.about-text  {
  text-align:center
}
}
.translate-item  {
  margin-left:1rem
}
#google_translate_element  {
  font-size:.8rem
}
#google_translate_element select  {
  padding:4px 6px;
  border-radius:4px;
  border:1px solid #ddd
}
.notranslate {
  translate: no;
}
/* ========= TABLETE (sub ~992px) ========= */
@media (max-width: 992px) {
  .nav-container {
    padding: 0 1.25rem;
  }

  .hero {
    padding: 120px 16px 60px;
    background-size: cover;
    background-position: top center;
  }

  .hero-content {
    padding: 0; /* anulăm padding-ul mare de desktop */
    max-width: 100%;
  }

  .two-column,
  .comparison-grid {
    gap: 2rem;
  }
}

/* ========= MOBILE (sub ~768px) ========= */
@media (max-width: 768px) {
  body {
    font-size: 15px;
  }

  /* NAVBAR */
  .nav-container {
    padding: 0 1rem;
  }

  .logo img {
    height: 46px;
  }

  .nav-links {
    display: none;
  }

  .mobile-menu-btn {
    display: block;
  }

  /* HERO */
  .hero {
    min-height: auto;
    padding: 110px 16px 40px;
    background-size: cover;
    background-position: top center;
    text-align: center;
  }

  .hero-content {
    padding: 0;
  }

  .hero img.hero-logo {
    max-width: 260px;
    margin: 0 auto 2rem;   /* îndepărtăm margin-bottom: 450px */
  }

  .hero h1 {
    font-size: 1.7rem;
    line-height: 1.4;
    padding: 0 0.5rem;
  }

  /* HERO STATS */
  .hero-stats {
    margin-top: 2rem;
  }

  .hero-stats h2 {
    font-size: 1.1rem;
  }

  .hero-stats .stats-grid {
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 3rem;  /* mai puțin spațiu gol */
  }

  .hero-stats .stat-item {
    flex: 1 1 48%;
  }

  .hero-stats .stat-number {
    font-size: 1.5rem;
  }

  /* SECTIUNI GENERALE – mai puțin padding pe mobil */
  .stats,
  .free-training,
  .before-after,
  .benefits,
  .testimonials,
  .faq,
  .contact,
  .social-section,
  .about {
    padding: 3rem 1.5rem;
  }

  /* GRID-URI -> 1 coloană */
  .two-column,
  .comparison-grid {
    grid-template-columns: 1fr;
  }

  .comparison-card img {
    height: 200px;
  }

  .benefits-grid,
  .testimonials-grid,
  .social-buttons {
    grid-template-columns: 1fr;
  }

  /* ABOUT */
  .about-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .about-image img {
    max-width: 90%;
    margin: 0 auto;
  }

  .about h2 {
    font-size: 2rem;
    text-align: center;
  }

  .about-intro,
  .about-text {
    text-align: center;
  }

  /* FORMULAR CONTACT */
  .form-row {
    grid-template-columns: 1fr;
  }

  .contact-form {
    max-width: 100%;
    padding: 0 0.25rem;
  }

  .checkbox-group {
    align-items: flex-start;
  }

  .btn-submit {
    font-size: 1.05rem;
  }

  /* FOOTER */
  .footer-content {
    flex-direction: column;
    text-align: center;
    gap: 1.5rem;
  }

  .footer-logo img {
    height: 60px;
  }

  .footer-links {
    justify-content: center;
  }

  /* TEXT / TITLURI MAI MICI */
  .stats h2,
  .free-training h2,
  .before-after h2,
  .benefits h2,
  .benefits h3,
  .benefits h4,
  .testimonials h2,
  .faq h2,
  .contact h2,
  .social-section h2 {
    font-size: 1.6rem;
  }

  .testimonial-amount {
    font-size: 2rem;
  }

  .stat-number {
    font-size: 2.3rem;
  }
}

/* ========= TELEFOANE MICI (sub ~480px) ========= */
@media (max-width: 480px) {
  .hero {
    padding: 100px 12px 32px;
  }

  .hero img.hero-logo {
    max-width: 220px;
  }

  .hero h1 {
    font-size: 1.4rem;
  }

  .hero-stats .stat-item {
    flex: 1 1 100%;
  }

  .benefit-item {
    flex-direction: column;
    align-items: flex-start;
  }

  .social-btn {
    padding: 1.1rem;
    font-size: 1rem;
  }

  .testimonial-card {
    padding: 1.5rem;
  }

  .faq-question {
    flex-direction: row;
  }

  .faq-answer {
    padding-left: 1.5rem;
  }
}