/* ==========================================================================
   Efectele comune ale site-urilor model. Se încarcă împreună cu efecte.js.
   Nimic din ce e aici nu schimbă culorile sau tipografia site-ului gazdă —
   doar adaugă mișcare și câteva componente noi.
   ========================================================================== */

/* ---------- apariția la derulare ---------- */
.fx-activ .fx-apare{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.22,.7,.28,1) var(--fx-d,0ms),
             transform .7s cubic-bezier(.22,.7,.28,1) var(--fx-d,0ms);
  will-change:opacity,transform;
}
.fx-activ .fx-apare.fx-vazut{opacity:1;transform:none;will-change:auto}
.fx-calm .fx-apare{opacity:1!important;transform:none!important;transition:none!important}

/* privit prin iframe, in previzualizarea din portofoliu */
.fx-incadrat .fx-apare{opacity:1!important;transform:none!important;transition:none!important}
.fx-incadrat{overflow:hidden}
.fx-incadrat body{overflow:hidden}

/* ---------- bara de progres ---------- */
.fx-progres{
  position:fixed;top:0;left:0;right:0;height:3px;z-index:99998;pointer-events:none;
  background:transparent;
}
.fx-progres i{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,currentColor,currentColor);
  background-color:#FF5A1F;
  transition:width .08s linear;
  box-shadow:0 0 12px rgba(0,0,0,.18);
}

/* ---------- fundal animat ---------- */
.fx-ambient{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;z-index:0;opacity:.85;
}
[data-ambient] > *:not(.fx-ambient){position:relative;z-index:1}

/* ---------- galerie mărită ---------- */
.fx-zoomabil{cursor:zoom-in;position:relative}
.fx-zoomabil::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.14), transparent 60%);
  opacity:0;transition:opacity .25s ease;
}
.fx-zoomabil:hover::after{opacity:1}
.fx-zoomabil:focus-visible{outline:3px solid #FF5A1F;outline-offset:3px}

.fx-lightbox{
  position:fixed;inset:0;z-index:99999;display:none;
  background:rgba(10,12,20,.92);backdrop-filter:blur(6px);
  align-items:center;justify-content:center;padding:5vh 6vw;
}
.fx-lightbox.on{display:flex;animation:fxLbIn .22s ease}
@keyframes fxLbIn{from{opacity:0}to{opacity:1}}
.fx-lb__c{
  max-width:min(1100px,92vw);max-height:88vh;width:100%;
  display:flex;align-items:center;justify-content:center;
}
.fx-lb__c svg,.fx-lb__c img{
  max-width:100%;max-height:88vh;width:auto;height:auto;
  border-radius:10px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8);background:#fff;
}
.fx-lb__x,.fx-lb__n{
  position:absolute;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);
  color:#fff;cursor:pointer;border-radius:50%;display:grid;place-items:center;
  transition:background .18s ease, transform .18s ease;font-family:inherit;
}
.fx-lb__x{top:18px;right:18px;width:44px;height:44px;font-size:1.7rem;line-height:1}
.fx-lb__n{top:50%;transform:translateY(-50%);width:52px;height:52px;font-size:2rem;line-height:1}
.fx-lb__p{left:14px}
.fx-lb__u{right:14px}
.fx-lb__x:hover,.fx-lb__n:hover{background:rgba(255,255,255,.22)}
.fx-lb__n:hover{transform:translateY(-50%) scale(1.06)}
.fx-lb__x:focus-visible,.fx-lb__n:focus-visible{outline:3px solid #FF5A1F;outline-offset:2px}
@media(max-width:640px){
  .fx-lb__n{width:42px;height:42px;font-size:1.5rem}
  .fx-lightbox{padding:8vh 3vw}
}

/* ---------- meniuri derulante ---------- */
.fx-drop{
  position:absolute;top:100%;left:50%;transform:translate(-50%,10px);
  min-width:min(680px,92vw);
  background:#fff;border:1px solid rgba(0,0,0,.09);border-radius:16px;
  box-shadow:0 30px 70px -28px rgba(10,15,30,.5), 0 2px 8px rgba(10,15,30,.06);
  padding:22px;opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity .2s ease, transform .2s cubic-bezier(.2,.7,.3,1), visibility .2s;
  z-index:80;
}
.fx-drop.on{opacity:1;transform:translate(-50%,8px);pointer-events:auto;visibility:visible}
.fx-drop__g{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 18px}
.fx-drop h4{
  grid-column:1/-1;margin:0 0 2px;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:#8A94A5;font-weight:700;
}
.fx-drop a{
  display:block;padding:10px 12px;border-radius:10px;text-decoration:none;
  transition:background .15s ease, transform .15s ease;
}
.fx-drop a:hover{background:rgba(0,0,0,.045);transform:translateX(3px)}
.fx-drop a b{display:block;font-size:.94rem;font-weight:700;color:#141821;line-height:1.3}
.fx-drop a span{display:block;font-size:.8rem;color:#7B8494;margin-top:1px;line-height:1.4}
.fx-drop__jos{
  grid-column:1/-1;margin-top:12px;padding-top:14px;border-top:1px solid rgba(0,0,0,.07);
  display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  font-size:.86rem;color:#7B8494;
}
.fx-drop__jos a{padding:0;font-weight:700;color:#141821;text-decoration:underline;text-underline-offset:3px}
.fx-drop__jos a:hover{background:none;transform:none}
@media(max-width:940px){
  .fx-drop{position:static;transform:none;min-width:0;width:100%;box-shadow:none;border:0;
    padding:6px 0 12px;background:transparent}
  .fx-drop.on{transform:none}
  .fx-drop__g{grid-template-columns:1fr}
  .fx-drop a{padding:9px 0}
  .fx-drop a:hover{background:none;transform:none}
}

/* ---------- mici rafinamente comune ---------- */
.fx-activ img,.fx-activ .prod__img svg,.fx-activ .work__thumb svg{backface-visibility:hidden}

/* linkul de meniu care deschide panoul primește o săgeată */
[data-meniu]{position:relative}
[data-meniu]::after{
  content:"";display:inline-block;width:.42em;height:.42em;margin-left:.45em;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(45deg);transition:transform .2s ease;
}
[data-meniu][aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg)}

/* învelișul care poziționează panoul derulant sub linkul din meniu */
.fx-mn{position:relative;display:inline-block}
@media(max-width:940px){.fx-mn{display:block;width:100%}}