/* ══════════════════════════════════════════
   CRESCENT LOGO — Luna Crescentă
   Component reutilizabil extras din logo.html
══════════════════════════════════════════ */

.crescent-logo {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Inner mark — 140×140 baza */
.crescent-logo .cl-inner {
  position: absolute;
  width: 140px;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Dimensiuni ─────────────────────────── */
/* xs — 39px  (index.html nav) */
.crescent-logo.cl-xs  { width: 39px;  height: 39px; }
.crescent-logo.cl-xs  .cl-inner { transform: scale(0.280); }

/* sm — 49px  (preturi.html nav / dashboard header) */
.crescent-logo.cl-sm  { width: 49px;  height: 49px; }
.crescent-logo.cl-sm  .cl-inner { transform: scale(0.353); }

/* md — 99px  (auth screen dashboard) */
.crescent-logo.cl-md  { width: 99px;  height: 99px; }
.crescent-logo.cl-md  .cl-inner { transform: scale(0.706); }

/* lg — 166px (hero / viitoare utilizări) */
.crescent-logo.cl-lg  { width: 166px; height: 166px; }
.crescent-logo.cl-lg  .cl-inner { transform: scale(1.15); }

/* ── Mark elements ─────────────────────── */
.crescent-logo .cres-outer {
  position: absolute;
  width: 88px; height: 88px;
  border-radius: 50%;
  border: 1.5px solid rgba(200,149,108,.40);
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  animation: clArcPulse 5s ease-in-out infinite;
}

@keyframes clArcPulse {
  0%,100% { box-shadow: 0 0 8px rgba(200,149,108,.15); }
  50%      { box-shadow: 0 0 24px rgba(200,149,108,.35); }
}

.crescent-logo .cres-moon {
  position: relative; z-index: 2;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: rgba(200,149,108,.08);
  border: 1.5px solid rgba(200,149,108,.90);
  overflow: hidden;
  box-shadow: 0 0 20px rgba(200,149,108,.30);
  animation: clMoonGlow 4s ease-in-out infinite;
}

@keyframes clMoonGlow {
  0%,100% { box-shadow: 0 0 20px rgba(200,149,108,.25); }
  50%      { box-shadow: 0 0 40px rgba(200,149,108,.55); }
}

.crescent-logo .cres-moon::after {
  content: '';
  position: absolute;
  top: -8px; left: 16px;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: #0a0a16;
}

.crescent-logo .cres-star {
  position: absolute;
  width: 6px; height: 6px;
  top: calc(50% - 14px); left: calc(50% + 14px);
  transform: translate(-50%,-50%);
  background: rgba(200,149,108,1);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(200,149,108,.95), 0 0 20px rgba(200,149,108,.45);
  z-index: 3;
  animation: clStarTwinkle 3s ease-in-out infinite;
}

@keyframes clStarTwinkle {
  0%,100% { opacity: .75; transform: translate(-50%,-50%) scale(1); }
  50%      { opacity: 1;   transform: translate(-50%,-50%) scale(1.5); }
}

.crescent-logo .cres-line {
  position: absolute;
  background: rgba(200,149,108,.30);
}

.crescent-logo .cres-line--h {
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 110px; height: 1px;
}

.crescent-logo .cres-line--v {
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 1px; height: 110px;
}