/* ===========================================================================
   Logo-ul animat din antet și din subsol
   ---------------------------------------------------------------------------
   Emblema din antet este o imagine în picioare (408×612). O punem la o
   înălțime fixă și lăsăm lățimea să se calculeze singură, ca să nu se
   deformeze niciodată.

   Animația are trei părți, toate pornite de la aceeași regulă: să se vadă că
   e vie, fără să tragă atenția de la conținutul paginii.
     1. o plutire foarte lentă, continuă
     2. o lumină caldă care trece peste emblemă din când în când
     3. o reacție la trecerea cu mouse-ul: se apropie ușor și strălucește
   =========================================================================== */

/* ---------------------------------------------------------------------------
   1. Emblema din antet
   --------------------------------------------------------------------------- */

/*
 * Emblema este decupată din `navbar-logo.png` și salvată separat, ca
 * `navbar-emblema.png`.
 *
 * Motivul: fișierul original este o imagine în picioare, care conține și
 * numele scris sub emblemă. La înălțimea unui antet — 54 px — acel nume
 * ajungea de vreo 9 px și devenea o pată colorată ilizibilă. Emblema singură,
 * pătrată, se citește perfect la 44 px, iar numele este scris alături cu text
 * adevărat: clar la orice mărime, selectabil și găsit de motoarele de căutare.
 */
.logo-navbar-wow {
  position: relative;
  display: inline-block;
  height: 82px;
  width: 82px;
  /* Identic cu emblema de la poarta de login: chenar rotund, umplut, cu inel
     auriu și fundal navy (vezi .academic-sigla din login/assets/css/layout.css). */
  object-fit: cover;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 28%, #24354f 0%, #14203a 46%, #070c18 100%);
  box-shadow: 0 0 0 1px rgba(220, 180, 95, 0.45), 0 4px 14px rgba(0, 0, 0, 0.4);
  filter: drop-shadow(0 3px 10px rgba(212, 169, 78, 0.22));
  transform-origin: center bottom;
  transition:
    transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 420ms ease,
    filter 420ms ease;
  animation: logo-plutire 6s ease-in-out infinite;
  will-change: transform;
}

/* Plutirea: trei pixeli în șase secunde, cu o rotire de o jumătate de grad.
   Suficient cât să nu pară o imagine lipită, prea puțin cât să distragă. */
@keyframes logo-plutire {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-3px) rotate(-0.6deg); }
}

/* La trecerea cu mouse-ul emblema se apropie de privitor și se aprinde. */
.logo:hover .logo-navbar-wow,
a:hover > .logo-navbar-wow {
  transform: translateY(-4px) scale(1.1) rotate(2deg);
  filter: drop-shadow(0 8px 22px rgba(212, 169, 78, 0.65))
          saturate(1.2) brightness(1.08);
}

/*
   Lumina care trece peste emblemă.

   Este un element separat, așezat peste imagine, nu un filtru: un gradient
   care se plimbă lateral și este decupat pe forma emblemei prin
   `mix-blend-mode`. Astfel lumina urmează conturul, în loc să treacă peste un
   dreptunghi.
*/
/*
 * `overflow: hidden` este necesar ca dâra de lumină să nu iasă din logo, dar
 * tăia emblema: animația de plutire o urcă 3 px, iar la hover crește la 110%
 * — și tot ce depășea cutia dispărea. De aici „logo-ul nu se vede complet".
 * Spațiul interior dă loc de mișcare, iar marginile negative îl compensează,
 * ca așezarea în antet să rămână neschimbată.
 */
.logo-navbar-invelis {
  position: relative;
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  border-radius: 10px;
  padding: 8px 9px;
  margin: -8px -9px;
}

.logo-navbar-invelis::after {
  content: "";
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -70%;
  width: 45%;
  background: linear-gradient(100deg,
    transparent 0%,
    rgba(255, 245, 210, 0.55) 45%,
    rgba(255, 245, 210, 0.75) 50%,
    rgba(255, 245, 210, 0.55) 55%,
    transparent 100%);
  transform: skewX(-16deg);
  mix-blend-mode: overlay;
  pointer-events: none;
  animation: logo-lumina 7s ease-in-out 2s infinite;
}

@keyframes logo-lumina {
  /* Lumina trece o singură dată la fiecare ciclu, în prima cincime a lui;
     restul timpului stă în afara cadrului. */
  0%, 78%, 100% { left: -70%; opacity: 0; }
  80%           { opacity: 1; }
  95%           { left: 130%; opacity: 0; }
}

/* ---------------------------------------------------------------------------
   1b. Numele, scris alături de emblemă
   --------------------------------------------------------------------------- */

.logo-navbar-invelis {
  gap: 0.55rem;
}

/*
 * Numele poartă tricolorul românesc, în mișcare de val.
 *
 * Gradientul repetă albastru → galben → roșu de două ori pe o bandă de trei
 * ori mai lată decât textul; animația plimbă banda continuu spre stânga, deci
 * culorile curg prin litere ca un steag în vânt. Nuanțele sunt luate din
 * steagul oficial (#002B7F, #FCD116, #CE1126), deschise puțin ca să rămână
 * lizibile pe fundalul închis al antetului.
 */
.logo-navbar-nume {
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1;
  white-space: nowrap;
  background-image: linear-gradient(95deg,
    #4f7cff 0%,  #6d9bff 12%,
    #ffd54a 26%, #fbc116 38%,
    #ff5a5a 52%, #e0242e 62%,
    #4f7cff 76%, #6d9bff 88%,
    #ffd54a 100%);
  background-size: 300% 100%;
  background-position: 0 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: tricolor-val 7s linear infinite;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes tricolor-val {
  from { background-position: 0% 0; }
  to   { background-position: -300% 0; }
}

/* Fiecare literă se leagănă puțin pe verticală? Nu: textul este un singur
   element, deci valul vertical se face pe tot cuvântul, discret. */
.logo-navbar-invelis:hover .logo-navbar-nume { animation-duration: 2.5s; }

.logo-navbar-nume b {
  font-weight: 800;
  letter-spacing: 0.02em;
}

.logo:hover .logo-navbar-nume,
a:hover > .logo-navbar-invelis .logo-navbar-nume {
  transform: translateX(2px);
}

/* Browserele fără decupare pe text primesc o culoare plină, ca numele să nu
   fie invizibil. */
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  .logo-navbar-nume {
    background: none;
    -webkit-text-fill-color: #eaf2ff;
    color: #eaf2ff;
  }
}

/* ---------------------------------------------------------------------------
   2. Logo-ul din subsol
   --------------------------------------------------------------------------- */

.logo-footer-wow {
  /* `!important` este necesar aici: foile de stil ale subsolului fixează
     `.logo-img` la dimensiuni mici prin selectoare mai specifice, iar logo-ul
     rămânea la 41 px oricât îl măream de aici. */
  /* 84px făcea plăcuța din subsol să domine coloana (234×92); la cererea
     proprietarului, mai mică și mai puțin înaltă — aceeași scară ca antetul. */
  height: 56px !important;
  width: auto !important;
  max-height: none !important;
  opacity: 0.9;
  transition: opacity 320ms ease, transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
              filter 420ms ease;
}

.footer-logo-v2:hover .logo-footer-wow,
a:hover > .logo-footer-wow {
  opacity: 1;
  transform: translateY(-2px) scale(1.03);
  filter: drop-shadow(0 6px 16px rgba(212, 169, 78, 0.4));
}

/* ---------------------------------------------------------------------------
   3. Mai puțină mișcare
   --------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .logo-navbar-wow,
  .logo-navbar-nume,
  .logo-navbar-invelis::after {
    animation: none !important;
  }
  .logo-navbar-nume {
    background: none;
    -webkit-text-fill-color: #eaf2ff;
    color: #eaf2ff;
  }
  .logo-navbar-wow { transform: none !important; }
}

/* ---------------------------------------------------------------------------
   4. Ecrane mici
   --------------------------------------------------------------------------- */

@media (max-width: 640px) {
  .logo-navbar-wow { height: 50px; width: 50px; }
  .logo-navbar-nume { font-size: 1.2rem; }
  .logo-footer-wow { height: 46px !important; }
}