/* ===== HERO „premium” ===== */
.ms-hero {
  position: relative;
  height: clamp(560px, 76vh, 900px);
background:
  radial-gradient(1200px 520px at 40% 78%, #ffb733 0%, transparent 55%),
  radial-gradient(1000px 480px at 62% 80%, #ff6a00 0%, transparent 55%),
  radial-gradient(900px 460px at 28% 12%, rgba(70,130,255,.10) 0%, transparent 55%); /* accent albastru fin */
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 64px;
  isolation: isolate;
}

.ms-hero{ position:relative; }
#flames-bg{
  position:absolute; inset:0; z-index:0;
  pointer-events:none;
  filter:none !important;         /* scoate BLUR-ul */
  opacity:.9;
}
.hero-overlay{ position:relative; z-index:2; }

/* LOGO mai mare pe desktop, se micșorează pe mobil */
.hero-logo {
  width: 340px; /* sau 380px dacă vrei mai mare */
  height: auto;
  filter: drop-shadow(0 0 18px rgba(255,191,43,.45));
}

@media (max-width: 700px) {
  .hero-logo {
    width: 120px;
  }
}

/* Titlu – mai solid */
.hero-overlay h1 {
  .hero-overlay h1::before,
.hero-overlay h1::after {
  content: none !important;
}
  margin: 4px 0;
  font-size: clamp(36px, 5.6vw, 62px);
  font-weight: 900;
  letter-spacing: 3px;
  color: #fff;
  text-shadow: 0 26px rgba(255,191,43,.35),
               0 1px rgba(0,0,0,.35);
}

/* Subtitlu */
.hero-overlay p {
  margin: 0 18px;
  font-size: clamp(14px, 2vw, 19px);
  color: #bdbdb2;
}
/* === Fix pentru hero și butonul Get a quote === */
.ms-hero {
  position: relative;
  overflow: hidden;
}

.ms-hero canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none; /* flăcările nu mai blochează clickurile */
}

.ms-hero .hero-overlay {
  position: relative;
  z-index: 1;
}
/* === HERO premium – fundal auriu + accent albastru, ANIMAT === */
.ms-hero{
  position: relative;
  overflow: hidden;
  /* culorile de bază */
  background:
    radial-gradient(1200px 520px at 40% 78%, #ffb733 0%, transparent 55%),
    radial-gradient(1000px 480px at 62% 80%, #ff6a00 0%, transparent 55%),
    radial-gradient(900px 460px  at 28% 12%, rgba(70,130,255,.10) 0%, transparent 55%);
  animation: goldPulse 14s ease-in-out infinite alternate;
}

/* canvas-ul rămâne în spate și clar */
#flames-bg{
  position:absolute; inset:0; z-index:0;
  pointer-events:none;
  filter:none !important;     /* fără blur */
  opacity:.9;
}

/* stratul de licăriri (particule) */
.sparkle{
  position:absolute; inset:-5%;
  z-index:1;                  /* sub overlay, peste fundal */
  pointer-events:none;
  background-image:
    radial-gradient(rgba(255,200,80,.65) 2px, transparent 3px),
    radial-gradient(rgba(100,150,255,.22) 1.5px, transparent 3px);
  background-size: 90px 90px, 120px 120px;
  background-position: 0 0, 30px 60px;
  animation: drift 40s linear infinite;
  opacity:.55;
  filter:none;
}

/* conținutul peste tot */
.hero-overlay{
  position:relative; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:12px; padding:20px;
  backdrop-filter:none;
}

/* Animațiile */
@keyframes goldPulse{
  0%{
    background-position: 40% 78%, 62% 80%, 28% 12%;
    background-size:     1200px 520px, 1000px 480px, 900px 460px;
    transform: scale(1);
  }
  100%{
    background-position: 36% 76%, 66% 82%, 26% 10%;
    background-size:     1400px 560px, 1150px 520px, 950px 480px;
    transform: scale(1.02);
  }
}

@keyframes drift{
  0%   { background-position: 0 0, 30px 60px;    transform: translateY(0); }
  100% { background-position: 0 700px, 30px 760px; transform: translateY(-2%); }
}