/* ============================================================
   LOADER — "Farias Montador" sendo martelado
   ============================================================ */
#loader {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background:
    radial-gradient(120% 90% at 50% 18%, #3a2b1c, #241a10 70%);
  overflow: hidden;
  cursor: pointer;
  transition: opacity .55s ease, visibility .55s ease;
}
#loader.hide { opacity: 0; visibility: hidden; pointer-events: none; }

/* textura sutil de serragem no fundo */
#loader::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    radial-gradient(#c89a63 1px, transparent 1.6px),
    radial-gradient(#a8623b 1px, transparent 1.6px);
  background-size: 150px 150px, 210px 210px;
  background-position: 0 0, 80px 100px;
  -webkit-mask-image: radial-gradient(70% 60% at 50% 45%, #000, transparent 78%);
  mask-image: radial-gradient(70% 60% at 50% 45%, #000, transparent 78%);
}

.ld-stage {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  z-index: 2;
}
.ld-stage.shake { animation: ldShake .36s cubic-bezier(.36,.07,.19,.97); }
@keyframes ldShake {
  0% { transform: translate(0,0); }
  15% { transform: translate(-6px, 3px); }
  30% { transform: translate(7px, -2px); }
  45% { transform: translate(-5px, 4px); }
  60% { transform: translate(4px, -3px); }
  78% { transform: translate(-3px, 1px); }
  100% { transform: translate(0,0); }
}

/* — palco das palavras — */
.ld-words { position: relative; text-align: center; }
.ld-strike-point { position: absolute; left: 50%; top: -6px; width: 1px; height: 1px; }

.ld-word {
  display: block;
  font-family: "Montserrat", sans-serif;
  color: var(--off-white, #faf6ef);
  line-height: .92;
  opacity: 0;
  transform: scale(1.7) translateY(-12px);
  filter: blur(3px);
  will-change: transform, opacity;
}
.ld-word.in {
  animation: ldSlam .42s cubic-bezier(.2,1.3,.35,1) forwards;
}
@keyframes ldSlam {
  0%   { opacity: 0; transform: scale(1.7) translateY(-14px); filter: blur(3px); }
  55%  { opacity: 1; transform: scale(.92) translateY(2px); filter: blur(0); }
  75%  { transform: scale(1.04) translateY(0); }
  100% { opacity: 1; transform: scale(1) translateY(0); filter: blur(0); }
}
.ld-farias {
  font-weight: 900; letter-spacing: -.03em;
  font-size: clamp(58px, 13vw, 150px);
  color: #faf6ef;
}
.ld-montador {
  font-weight: 600; letter-spacing: .42em; text-transform: uppercase;
  font-size: clamp(15px, 3.2vw, 34px);
  color: var(--oak-soft, #d8b483);
  margin-top: 6px; padding-left: .42em;
}

/* — o martelo — */
.ld-hammer {
  position: absolute;
  left: 50%; bottom: 72%;
  width: clamp(116px, 15vw, 152px);
  transform-origin: 50% 90%;
  transform: translate(38%, 0) rotate(90deg);
  z-index: 5;
  filter: drop-shadow(0 16px 20px rgba(0,0,0,.5));
  pointer-events: none;
}

/* — lascas de madeira / faíscas — */
.ld-burst { position: absolute; left: 72%; top: 34%; width: 0; height: 0; z-index: 4; pointer-events: none; }
.ld-chip {
  position: absolute; left: 0; top: 0;
  width: var(--w, 9px); height: var(--h, 4px);
  background: var(--c, #c89a63);
  border-radius: 1px;
  transform: translate(0,0) rotate(0deg);
  opacity: 0;
  animation: ldChip .6s cubic-bezier(.15,.7,.4,1) forwards;
}
@keyframes ldChip {
  0%   { opacity: 1; transform: translate(0,0) rotate(0deg) scale(1); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(var(--rot)) scale(.6); }
}
.ld-flash {
  position: absolute; left: 0; top: 0; margin: -34px 0 0 -34px;
  width: 68px; height: 68px; border-radius: 50%;
  border: 2px solid #f0d9a8; opacity: 0;
  animation: ldFlash .42s ease-out forwards;
}
@keyframes ldFlash {
  0% { opacity: .9; transform: scale(.3); }
  100% { opacity: 0; transform: scale(1.9); }
}

/* — rodapé do loader: barra + selo — */
.ld-foot {
  position: absolute; bottom: 64px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  opacity: 0; transition: opacity .5s ease; z-index: 3;
}
.ld-foot.show { opacity: 1; }
.ld-bar { width: 200px; height: 3px; border-radius: 3px; background: rgba(216,180,131,.22); overflow: hidden; }
.ld-bar span { display: block; height: 100%; width: 0; border-radius: 3px;
  background: linear-gradient(90deg, var(--oak-soft,#d8b483), var(--clay,#a8623b));
  animation: ldBar 1.1s cubic-bezier(.5,0,.2,1) forwards; }
@keyframes ldBar { to { width: 100%; } }
.ld-tag {
  font-family: "Montserrat", sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .34em; text-transform: uppercase; color: rgba(216,180,131,.7);
}
@media (max-width: 480px) {
  .ld-farias {
    font-size: clamp(40px, 15vw, 58px);
  }
  .ld-montador {
    font-size: clamp(10px, 3.5vw, 15px);
    letter-spacing: .18em;
    padding-left: .18em;
  }
  .ld-hammer {
    width: clamp(72px, 22vw, 116px);
  }
  .ld-foot {
    bottom: 28px;
  }
  .ld-bar {
    width: 140px;
  }
  .ld-tag {
    font-size: 9px;
    letter-spacing: .2em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ld-hammer { display: none; }
  .ld-word { opacity: 1; transform: none; filter: none; animation: none; }
  .ld-burst, .ld-flash { display: none; }
}