/* ========= Language Switcher ========= */
.lang-bar{
  position: sticky;
  top: 0;
  z-index: 9000;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: linear-gradient(90deg, #2a0f1f 0%, #4a1b35 50%, #2a0f1f 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.lang-bar::-webkit-scrollbar{ display: none; }
.lang-bar .lang-label{
  color: #f5d7c0;
  font-weight: 700;
  align-self: center;
  margin-inline-end: 4px;
  font-size: .78rem;
  opacity: .85;
  white-space: nowrap;
  flex-shrink: 0;
}
.lang-bar a{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: .88rem;
  border: 1px solid rgba(255,255,255,.15);
  transition: .25s;
  backdrop-filter: blur(6px);
  white-space: nowrap;
  flex-shrink: 0;
}
.lang-bar a:hover{
  background: rgba(255,255,255,.18);
  transform: translateY(-1px);
}
.lang-bar a.active{
  background: linear-gradient(135deg,#d4a373,#b07c5a);
  border-color: transparent;
  color: #2a0f1f;
}
.lang-bar a .flag{
  font-size: 1.15rem;
  line-height: 1;
}


/* ========= LTR overrides for EN / FR ========= */
html[dir="ltr"] .hero-contact-numbers{ text-align: left; }
html[dir="ltr"] body{ font-family: var(--font-body, 'Poppins','Cairo',system-ui,sans-serif); }
html[dir="ltr"] .hero h1,
html[dir="ltr"] .section-heading h2,
html[dir="ltr"] .info-card h2,
html[dir="ltr"] .why-copy h2,
html[dir="ltr"] .contact-panel h2{ font-family: var(--font-heading, 'Playfair Display','Cairo',serif); }

/* ========= Sticky header (desktop + mobile) ========= */
.topbar{
  position: sticky !important;
  top: 8px;
  z-index: 50;
}

/* ========= Mobile polish ========= */
@media (max-width: 980px){
  .lang-bar{ padding: 6px 8px; gap: 4px; }
  .lang-bar a{ padding: 5px 8px; font-size: .78rem; gap: 4px; }
  .lang-bar .lang-label{ font-size: .72rem; margin-inline-end: 2px; }
  .lang-bar a .flag{ font-size: 1rem; }


  /* Sticky stacked header: brand / nav / CTA */
  .topbar{
    position: sticky !important;
    top: 6px;
    display: grid !important;
    grid-template-columns: 1fr !important;
    flex-direction: initial !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 10px 12px !important;
    margin-top: 8px;
  }
  .brand{ justify-content: center; gap: 10px; }
  .brand-logo{ width: 56px; height: 36px; }
  .brand strong{ font-size: .98rem; }
  .brand span{ font-size: .78rem; }

  .nav{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between;
    align-items: center;
    gap: 2px !important;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .nav::-webkit-scrollbar{ display: none; }
  .nav a{
    font-size: .78rem !important;
    padding: 4px 6px !important;
    white-space: nowrap;
    flex: 0 0 auto;
  }
  .nav a::after{ display: none; }

  .nav-cta{
    width: 100% !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    font-size: .95rem;
  }
}
@media (max-width: 640px){
  .lang-bar{ padding: 5px 6px; gap: 3px; }
  .lang-bar a{ padding: 4px 6px; font-size: .7rem; gap: 3px; }
  .lang-bar .lang-label{ font-size: .65rem; margin-inline-end: 1px; }
  .lang-bar a .flag{ font-size: .95rem; }

  .hero h1{ font-size: 1.9rem !important; line-height: 1.25; }
  .hero-text{ font-size: 1rem; }
  .hero-actions{ flex-direction: column; }
  .hero-actions .button{ width: 100%; text-align: center; }
  .mini-stats{ grid-template-columns: 1fr 1fr !important; }
  .services-grid,.gallery-grid,.reviews-grid,.reasons-grid,.contact-grid,.social-grid{
    grid-template-columns: 1fr !important;
  }
  .service-photo,.gallery-card img{ height: 200px; object-fit: cover; }
  .footer{ padding: 24px 16px; }
  .footer-qr{ max-width: 140px; }
  img{ max-width: 100%; height: auto; }
  .floating-call{ bottom: 84px !important; width: 52px !important; height: 52px !important; font-size: 22px !important; }
  .floating-whatsapp{ width: 52px !important; height: 52px !important; font-size: 26px !important; }

  .nav a{ font-size: .72rem !important; padding: 3px 4px !important; }
  .brand-logo{ width: 48px; height: 32px; }
  .brand strong{ font-size: .9rem; }
  .brand span{ font-size: .72rem; }
}

/* AI / structured data visibility */
.ai-data{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
