/* === HERO / SIGNATURE === */
#signature-animate::after{
  content:'|';
  color:#A47764;
  opacity:.6;
  margin-left:.06em;
  animation:blink .9s infinite;
}
@keyframes blink{0%,100%{opacity:.6}50%{opacity:0}}

/* === ABOUT: централният кръг + орбити === */
.pulse-ring{
  position:absolute; top:50%; left:50%;
  width:370px; height:370px;
  background: rgba(108,62,39,0.16);
  border-radius: 50%;
  transform: translate(-50%,-50%) scale(.99);
  z-index:0; filter: blur(8px); pointer-events:none;
  animation: pulseSingleWave 2.3s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes pulseSingleWave{
  0%{ transform: translate(-50%,-50%) scale(1); opacity:.60; }
  50%{ transform: translate(-50%,-50%) scale(1.15); opacity:.22; }
  90%{ transform: translate(-50%,-50%) scale(1.22); opacity:.01; }
  100%{ transform: translate(-50%,-50%) scale(1); opacity:0; }
}

.orbit-little{ position:absolute; width:56px; height:56px; z-index:3; }
.orbit1{ left:70%; top:2%;   animation:drift1 14s cubic-bezier(.47,1.2,.41,.8) infinite alternate; }
.orbit2{ left:-20px; top:34%; animation:drift2 15.2s cubic-bezier(.47,1.2,.41,.8) infinite alternate; }
.orbit3{ left:83%; top:78%;  animation:drift3 13.4s cubic-bezier(.47,1.2,.41,.8) infinite alternate; }
.orbit4{ left:1%;  top:85%;  animation:drift4 16.1s cubic-bezier(.47,1.2,.41,.8) infinite alternate; }
@media (max-width: 768px){ .orbit2{ left:-10px; top:30%; } }

@keyframes drift1{
  0%{transform:translate(0,0)}19%{transform:translate(8px,-10px)}
  47%{transform:translate(-6px,16px)}72%{transform:translate(14px,22px)}
  100%{transform:translate(0,0)}
}
@keyframes drift2{
  0%{transform:translate(0,0)}22%{transform:translate(14px,-8px)}
  54%{transform:translate(-7px,8px)}80%{transform:translate(10px,18px)}
  100%{transform:translate(0,0)}
}
@keyframes drift3{
  0%{transform:translate(0,0)}18%{transform:translate(-8px,7px)}
  39%{transform:translate(16px,14px)}62%{transform:translate(8px,-16px)}
  100%{transform:translate(0,0)}
}
@keyframes drift4{
  0%{transform:translate(0,0)}28%{transform:translate(10px,-10px)}
  53%{transform:translate(16px,9px)}77%{transform:translate(-6px,-8px)}
  100%{transform:translate(0,0)}
}

.orbit-img{
  width:56px; height:56px; border-radius:50%; object-fit:cover;
  padding:3px; background: linear-gradient(45deg,#d4af37,#f9e076,#b38728);
  background-size:200% 200%; animation: gold-shine 6s ease-in-out infinite;
  box-shadow:0 4px 12px rgba(108,62,39,0.25);
}
@keyframes gold-shine{
  0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}
}

/* === SERVICES: scroll-reveal === */
.reveal-card{
  opacity:0; transform: translateY(12px);
  transition: transform .9s cubic-bezier(.2,.65,.2,1), opacity .9s ease;
  will-change: transform, opacity;
}
.reveal-left{ transform: translateX(-70px); }
.reveal-right{ transform: translateX(70px); }
.reveal-card.in-view{ opacity:1; transform: translateX(0) translateY(0); }
@media (max-width:1024px){
  .reveal-left{ transform: translateX(-40px); }
  .reveal-right{ transform: translateX(40px); }
}
@media (max-width:640px){
  .reveal-left{ transform: translateX(-28px); }
  .reveal-right{ transform: translateX(28px); }
}
@media (prefers-reduced-motion: reduce){
  .reveal-card, .reveal-card.in-view{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* === CLIENT LOGOS: infinite marquee === */
.marquee{ animation: marquee 38s linear infinite; }
@keyframes marquee{ 0%{transform:translateX(0)}100%{transform:translateX(-50%)} }
@media (max-width:640px){ .marquee img{ height:38px; } }

/* === NUMBERS: counters + particles === */
.counter{ display:inline-block; min-width:2ch; }
.particle{
  position:absolute; width:8px; height:8px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, rgba(164,119,100,0.55), rgba(108,62,39,0.15));
  filter: blur(1px); opacity:.65;
}
.p1{ top:16%; left:18%; animation: float1 9s ease-in-out infinite; }
.p2{ top:28%; left:76%; animation: float2 11s ease-in-out infinite; }
.p3{ top:58%; left:12%; animation: float3 10s ease-in-out infinite; }
.p4{ top:68%; left:72%; animation: float1 12s ease-in-out infinite reverse; }
.p5{ top:38%; left:46%; animation: float2 13s ease-in-out infinite; width:10px; height:10px; }
.p6{ top:78%; left:38%; animation: float3 14s ease-in-out infinite; width:6px; height:6px; }
@keyframes float1{ 0%{transform:translate(0,0);opacity:.55}50%{transform:translate(12px,-10px);opacity:.85}100%{transform:translate(0,0);opacity:.55} }
@keyframes float2{ 0%{transform:translate(0,0);opacity:.55}50%{transform:translate(-10px,14px);opacity:.9}100%{transform:translate(0,0);opacity:.55} }
@keyframes float3{ 0%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(14px,8px) scale(1.1);opacity:.9}100%{transform:translate(0,0) scale(1);opacity:.55} }

/* === PROCESS: reveal === */
#process .process-step{
  opacity:0; transform: translateY(22px) scale(.98);
  transition: opacity .45s ease-out, transform .45s ease-out;
  will-change: opacity, transform;
}
#process .process-step.in-view{ opacity:1; transform: translateY(0) scale(1); }
@media (prefers-reduced-motion: reduce){
  #process .process-step, #process .process-step.in-view{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
}

/* === TESTIMONIALS === */
.t-card{
  background: rgba(255,255,255,0.9);
  border: 1px solid #e3d7cf;
  border-radius: 1.5rem;
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
  padding: 1.25rem; min-width: 280px;
}
@media (min-width:640px){ .t-card{ min-width:320px; } }
@media (min-width:1024px){ .t-card{ min-width:360px; } }
.t-head{ display:flex; align-items:center; gap:.75rem; margin-bottom:.35rem; }
.t-avatar{
  width:42px; height:42px; border-radius:9999px; border:2px solid #d3b8a2;
  background:#fff; object-fit:cover; box-shadow:0 4px 14px rgba(192,156,133,.25);
}
.t-name{ font-weight:700; color:#6C3E27; line-height:1.1; }
.t-role{ font-size:.85rem; color:#8c6a59; line-height:1.1; }
.t-stars{ color:#c59d7c; letter-spacing:.15em; margin:.35rem 0 .5rem; }
.t-quote{ color:#232022; font-style:italic; line-height:1.55; }
.t-marquee{ animation: t-marquee 70s linear infinite; }
@keyframes t-marquee{ 0%{transform:translateX(0)}100%{transform:translateX(-50%)} }

/* === FAQ === */
.faq-item{
  background: rgba(255,255,255,0.9);
  border: 1px solid #e3d7cf;
  border-radius: 1.25rem;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
  overflow: hidden;
}
.faq-summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  gap:.75rem; padding:1rem 1.25rem;
}
.faq-summary::-webkit-details-marker{ display:none; }
.faq-q{ font-weight:700; color:#6C3E27; line-height:1.2; }
.faq-icon{
  width:28px; height:28px; flex:0 0 28px; border-radius:9999px; border:2px solid #d3b8a2;
  display:grid; place-items:center; position:relative; box-shadow:0 4px 12px rgba(192,156,133,.25);
}
.faq-icon svg{ width:18px; height:18px; stroke:#6C3E27; fill:none; stroke-width:2; }
.faq-icon .minus{ opacity:0; position:absolute; }
.faq-content{
  color:#232022; padding:0 1.25rem 0 1.25rem; max-height:0; overflow:hidden;
  transition:max-height .35s ease, padding .35s ease;
}
.faq-item[open] .faq-content{ padding:0 1.25rem 1rem 1.25rem; max-height:320px; }
.faq-item[open] .faq-icon .minus{ opacity:1; }

/* === Emoji burst – ЕДИННА версия (ползвай .like-burst-btn) === */
.like-burst-btn{ position:relative; overflow:visible; }
.like-burst-emoji{
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%) scale(.7);
  opacity:0; font-size:18px; pointer-events:none;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.15));
  animation: like-burst 900ms ease-out forwards;
}
@keyframes like-burst{
  0%{opacity:0; transform:translate(-50%,-50%) scale(.6)}
  12%{opacity:1}
  100%{opacity:0; transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.15)}
}
@media (prefers-reduced-motion: reduce){
  .like-burst-emoji{ animation: none; opacity:0; }
}
.t-marquee,
.t-marquee * {
  -webkit-animation-play-state: running !important;
  animation-play-state: running !important;
}
