/* ==========================================================================
   Beemessenger teması — DC kaynağından (BeeMessenger Landing.dc.html + SiteNav
   + SiteFooter) taşınan stiller. Kaynak <helmet> içindeki temel gövde stilleri,
   @keyframes ve @media override'ları BURAYA taşındı; DC'ye özel `style-hover`
   attribute'ları eşdeğer `:hover` sınıflarına çevrildi (inline stili ezmek için
   !important gerekir). Palet: lacivert #0C2557, turuncu #F2782A.
   Build gerektirmez — sayfaya <link> ile gelir.
   ========================================================================== */

/* --- Kaynak gövde stilleri (helmet > style) --- */
body { margin: 0; background: #F3F6FC; font-family: 'Space Grotesk', system-ui, sans-serif; }
a { color: #F2782A; text-decoration: none; }
a:hover { color: #FF8A3C; }
::selection { background: #F2782A; color: #fff; }

/* --- Kaynak @keyframes (helmet) --- */
@keyframes bm-float { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-18px) rotate(2deg); } }
@keyframes bm-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
@keyframes bm-blink { 0%, 80%, 100% { opacity: 0.25; } 40% { opacity: 1; } }
@keyframes bm-pop { 0% { opacity: 0; transform: translateY(14px) scale(0.96); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes bm-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(242,120,42,0.5); } 60% { box-shadow: 0 0 0 14px rgba(242,120,42,0); } }
@keyframes bm-slideup { 0% { transform: translateY(100%); } 100% { transform: translateY(0); } }
@keyframes bm-slidein { 0% { transform: translateX(64px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } }
@keyframes bm-wipe { 0% { transform: translateX(100%); } 100% { transform: translateX(0); } }
@keyframes bm-fadein { 0% { opacity: 0; transform: scale(0.9); } 100% { opacity: 1; transform: scale(1); } }

/* --- style-hover → :hover (DC attribute karşılıkları) --- */
/* İnline style specificity'sini geçmek için !important kullanılır. */
.bm-btn-primary:hover { background: #FF8A3C !important; color: #fff !important; transform: translateY(-2px); }
.bm-btn-primary-flat:hover { background: #FF8A3C !important; color: #fff !important; }
.bm-btn-ghost:hover { border-color: #F2782A !important; color: #F2782A !important; }
.bm-wa-btn:hover { background: #25C971 !important; color: #fff !important; }
.bm-tier-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(12,37,87,0.12); }
.bm-feature-card:hover { border-color: #F2782A !important; transform: translateY(-3px); }
.bm-nav-link:hover { color: #F2782A !important; }
.bm-mega-link:hover { background: #F3F6FC !important; color: #101C36 !important; }
.bm-footer-link:hover { color: #F2782A !important; }

/* --- Mega menü aç/kapa (DC sc-if megaVisible → CSS :hover) --- */
/* Panel tüm inline stillerini korur (position:fixed, display:grid); yalnız
   görünürlük :hover ile toggle edilir → kaynak markup harfiyen kalır. */
.bm-mega-panel { opacity: 0; visibility: hidden; transition: opacity 0.15s ease; }
.bm-mega-parent:hover .bm-mega-panel { opacity: 1; visibility: visible; }

/* --- Telefon mockup sohbet balonları: SONSUZ döngü (ortak 11s zaman çizelgesi) --- */
/* Her balon aynı 11s döngüde kendi penceresinde belirir (pop), ~%85'e kadar kalır,
   birlikte söner ve döngü başa sarar (JS gerekmez). */
.bm-chat-msg { animation: bm-pop 0.45s ease-out both; }
@keyframes bm-chat-loop-1 { 0%, 1.8%  { opacity: 0; transform: translateY(14px) scale(0.96); } 5.9%,  85% { opacity: 1; transform: translateY(0) scale(1); } 90%, 100% { opacity: 0; transform: translateY(0) scale(1); } }
@keyframes bm-chat-loop-2 { 0%, 8.2%  { opacity: 0; transform: translateY(14px) scale(0.96); } 12.3%, 85% { opacity: 1; transform: translateY(0) scale(1); } 90%, 100% { opacity: 0; transform: translateY(0) scale(1); } }
@keyframes bm-chat-loop-3 { 0%, 14.5% { opacity: 0; transform: translateY(14px) scale(0.96); } 18.6%, 85% { opacity: 1; transform: translateY(0) scale(1); } 90%, 100% { opacity: 0; transform: translateY(0) scale(1); } }
@keyframes bm-chat-loop-4 { 0%, 21.8% { opacity: 0; transform: translateY(14px) scale(0.96); } 25.9%, 85% { opacity: 1; transform: translateY(0) scale(1); } 90%, 100% { opacity: 0; transform: translateY(0) scale(1); } }
@keyframes bm-chat-loop-5 { 0%, 28.2% { opacity: 0; transform: translateY(14px) scale(0.96); } 32.3%, 85% { opacity: 1; transform: translateY(0) scale(1); } 90%, 100% { opacity: 0; transform: translateY(0) scale(1); } }
.bm-chat-msg.bm-chat-1 { animation: bm-chat-loop-1 11s linear infinite; }
.bm-chat-msg.bm-chat-2 { animation: bm-chat-loop-2 11s linear infinite; }
.bm-chat-msg.bm-chat-3 { animation: bm-chat-loop-3 11s linear infinite; }
.bm-chat-msg.bm-chat-4 { animation: bm-chat-loop-4 11s linear infinite; }
.bm-chat-msg.bm-chat-5 { animation: bm-chat-loop-5 11s linear infinite; }

/* --- Kaynak @media (max-width: 880px) override'ları (helmet) --- */
@media (max-width: 880px) {
  h1 { font-size: 36px !important; letter-spacing: -0.01em !important; }
  h2 { font-size: 27px !important; }
  section { padding-left: 20px !important; padding-right: 20px !important; }
  section [style*="grid-template-columns"]:not([style*="72px"]):not([style*="1fr 1fr 1fr"]) { grid-template-columns: 1fr !important; }
  section [style*="repeat(4, 1fr)"] { grid-template-columns: 1fr 1fr !important; }
  aside { position: static !important; }
}
@media (max-width: 880px) {
  header { padding-left: 0 !important; padding-right: 0 !important; }
  header > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; padding: 44px 20px 24px !important; gap: 24px !important; }
  header [style*="gap: 36px"] { flex-wrap: wrap !important; gap: 20px !important; }
  [style*="scale(0.82)"] { transform: scale(0.58) !important; margin-bottom: -350px !important; }
  [style*="width: 400px"] { width: 100% !important; max-width: 400px !important; }
  #demo > div { flex-direction: column !important; text-align: center !important; padding: 32px 24px !important; }
  [data-screen-label="Ticker"] img { width: 110px !important; right: 16px !important; }
}
/* Nav (SiteNav helmet) */
@media (max-width: 880px) {
  nav > div > div[style*="flex: 1"] { display: none !important; }
  nav > div { padding: 10px 16px !important; justify-content: space-between !important; }
}
/* Footer (SiteFooter helmet) */
@media (max-width: 880px) {
  footer > div { padding: 44px 20px 20px !important; }
  footer [style*="grid-template-columns"] { grid-template-columns: 1fr 1fr !important; }
  footer [style*="grid-template-columns"] > div:first-child { grid-column: 1 / -1; }
  footer [style*="margin-top: 44px"] { flex-wrap: wrap !important; }
}

/* ==========================================================================
   ALT SAYFALAR — Blog listesi/detay, SSS akordeonu, ekip/değer kartları.
   Kaynak DC style-hover'ları + native <details> akordeon davranışı buraya taşındı.
   ========================================================================== */

/* --- Blog kart / öne çıkan hover (Blog.dc.html style-hover) --- */
.bm-blog-card { transition: transform 0.18s ease, box-shadow 0.18s ease; }
.bm-blog-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(12,37,87,0.12); color: #101C36 !important; }
.bm-blog-featured { transition: transform 0.18s ease, box-shadow 0.18s ease; }
.bm-blog-featured:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(12,37,87,0.25); color: #fff !important; }

/* --- SSS akordeonu: native <details>/<summary>, JS'siz +/- işareti (SSS.dc.html) --- */
.bm-faq > summary { list-style: none; }
.bm-faq > summary::-webkit-details-marker { display: none; }
.bm-faq > summary:hover { background: #F8FAFE; }
.bm-faq-mark::after { content: "+"; }
.bm-faq[open] .bm-faq-mark::after { content: "\2212"; } /* − */

/* --- Blog yazısı gövde tipografisi (admin içeriği: h2/p/ul/img/quote) --- */
.bm-article-body h2 { margin: 34px 0 14px; color: #0C2557; font-size: 26px; font-weight: 700; letter-spacing: -0.01em; scroll-margin-top: 96px; }
.bm-article-body h3 { margin: 26px 0 12px; color: #0C2557; font-size: 21px; font-weight: 700; }
.bm-article-body p { margin: 0 0 22px; }
.bm-article-body ul, .bm-article-body ol { margin: 0 0 22px; padding-left: 22px; }
.bm-article-body li { margin-bottom: 8px; }
.bm-article-body img { max-width: 100%; height: auto; border-radius: 16px; margin: 12px 0; }
.bm-article-body a { color: #F2782A; }
.bm-article-body blockquote { margin: 24px 0; padding: 12px 22px; border-left: 4px solid #F2782A; color: #4A5670; }

/* Blog yazısı 2 kolon → mobilde tek kolon (aside altta) */
@media (max-width: 880px) {
  article [style*="grid-template-columns: 1fr 300px"] { grid-template-columns: 1fr !important; }
}