/* NextGen Theme Polishing (non-breaking, structure-safe) */

/* Typography */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Inter, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; letter-spacing: .01em; }
h1,h2,h3 { letter-spacing: -0.01em; }
h1 { font-weight: 800; }
h2 { font-weight: 800; }
h3 { font-weight: 700; }

/* Container rhythm */
section { scroll-margin-top: 70px; } /* better anchor land under fixed header */
.section { scroll-margin-top: 70px; }

@media (min-width: 640px) {
  section { scroll-margin-top: 84px; }
  .section { scroll-margin-top: 84px; }
}

@media (min-width: 768px) {
  section { scroll-margin-top: 88px; }
  .section { scroll-margin-top: 88px; }
}

/* Navigation Dropdowns */
.nav-dropdown button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  color: inherit;
}

.nav-dropdown-menu {
  z-index: 50;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.98) !important;
  backdrop-filter: blur(24px);
  overflow: hidden;
}

.nav-dropdown:hover .nav-dropdown-menu {
  pointer-events: auto;
}

.nav-dropdown-menu a {
  transition: background-color 0.15s ease;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.85);
}

.nav-dropdown-menu a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Mobile Menu */
.mobile-menu {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.98) !important;
  backdrop-filter: blur(24px);
  height: 100vh;
  height: 100dvh; /* Dynamic viewport height for mobile */
  width: 100vw;
  max-height: 100vh;
  max-height: 100dvh;
}

.mobile-menu.active {
  transform: translateX(0);
}

/* Container de navigation mobile */
.mobile-menu nav {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  height: 100%;
}

.mobile-menu nav > div {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 100%;
}

.mobile-dropdown {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.mobile-dropdown-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  font-family: inherit;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  flex-shrink: 0;
  min-height: 56px;
}

.mobile-dropdown-content {
  display: none;
  flex-direction: column;
  width: 100%;
  gap: 0.25rem;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 12px;
  padding: 0.5rem 0;
  margin-top: 0.5rem;
  overflow: visible;
  height: auto;
}

.mobile-dropdown-content a {
  display: block;
  width: 100%;
  text-align: left;
  flex-shrink: 0;
  min-height: 48px;
}

/* Liens directs dans le menu mobile */
.mobile-menu nav > div > a {
  display: block;
  width: 100%;
  text-align: left;
  flex-shrink: 0;
  min-height: 56px;
}

.mobile-dropdown.active .mobile-dropdown-btn svg {
  transform: rotate(180deg);
}

.mobile-dropdown.active .mobile-dropdown-content {
  display: flex;
  animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    max-height: 600px;
    transform: translateY(0);
  }
}

/* Prevent body scroll when mobile menu is open */
body.menu-open {
  overflow: hidden !important;
  position: fixed;
  width: 100%;
  height: 100%;
}

/* CTA harmonization (only affects generic .btn / .btn-primary / .btn-wa / .btn-ghost created earlier) */
.btn { border-radius: .9rem; font-weight: 700; padding: .8rem 1.1rem; transition: transform .15s ease, box-shadow .15s ease, opacity .2s; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background-image: linear-gradient(90deg,#fde047,#34d399); color: #111; }
.btn-wa { background: #10b981; color: #fff; }
.btn-ghost { background: #27272a; color: #fff; }
.btn:focus { outline: none; box-shadow: 0 0 0 2px rgba(255,255,255,.2); }

/* Cards polish */
.card, .press-card { backdrop-filter: saturate(130%) blur(2px); }
.card { border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.05); border-radius: 1rem; overflow: hidden; }
.card-cover { background: rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.08); }
.card-body { padding: 1rem; }
.press-card { border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.05); border-radius: 1rem; }
.press-card .cover { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); border-radius: .75rem; }

/* Media grid refinement */
#media .grid > *,
#results .grid > * { border-radius: 1rem; }
#media img { object-fit: cover; display: block; }

/* Header spacing & hover clarity (non-structural) */
header nav a, .nav a { transition: color .15s ease, opacity .15s ease; }
header .cta, header .btn { font-weight: 700; }

/* Hero logo strip (only if present) */
#hero-logos img { height: 160px; max-height: 160px; width: auto; filter: grayscale(1) contrast(1.2) brightness(1.08); opacity: .99; }@media (max-width: 1024px){ #hero-logos img { height: 128px; max-height: 128px; } }@media (max-width: 640px){ #hero-logos img { height: 96px; max-height: 96px; } }
@media (max-width: 640px){
  #hero-logos img { height: 160px; max-height: 160px; width: auto; filter: grayscale(1) contrast(1.2) brightness(1.08); opacity: .99; }@media (max-width: 1024px){ #hero-logos img { height: 128px; max-height: 128px; } }@media (max-width: 640px){ #hero-logos img { height: 96px; max-height: 96px; } }
}

/* Contact tabs */
#contact .role-btn,
#contact #contact-tabs button,
#contact .tab-btn { border: 1px solid rgba(255,255,255,.10); }
#contact input, #contact textarea { box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }

/* ===== Logo Animations ===== */
.logo-container {
  perspective: 1000px;
  display: inline-block;
}

.logo-animated {
  animation: logoFloat 6s ease-in-out infinite, logoRotate 20s linear infinite, logoPulse 3s ease-in-out infinite;
  transform-style: preserve-3d;
  transition: all 0.3s ease;
}

/* Animation 1: Float (mouvement vertical) */
@keyframes logoFloat {
  0%, 100% { transform: translateY(0) rotateY(0deg); }
  25% { transform: translateY(-10px) rotateY(5deg); }
  50% { transform: translateY(0) rotateY(0deg); }
  75% { transform: translateY(-10px) rotateY(-5deg); }
}

/* Animation 2: Rotation lente */
@keyframes logoRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Animation 3: Pulse (effet de respiration) */
@keyframes logoPulse {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.05); filter: brightness(1.1); }
}

/* Animation au hover */
.logo-container:hover .logo-animated {
  animation: logoSpin 1s ease-in-out, logoGlow 1s ease-in-out;
  transform: scale(1.1) rotateY(180deg);
}

/* Spin rapide au hover */
@keyframes logoSpin {
  0% { transform: rotateY(0deg) scale(1); }
  100% { transform: rotateY(360deg) scale(1.1); }
}

/* Effet de glow au hover */
@keyframes logoGlow {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(52, 211, 153, 0.3)); }
  50% { filter: drop-shadow(0 0 30px rgba(52, 211, 153, 0.8)); }
}

/* Responsive: réduire les animations sur mobile */
@media (max-width: 768px) {
  .logo-animated {
    animation: logoFloat 4s ease-in-out infinite;
  }
}

/* Préférences utilisateur: réduire les animations si demandé */
@media (prefers-reduced-motion: reduce) {
  .logo-animated {
    animation: none;
  }
  .logo-container:hover .logo-animated {
    animation: none;
    transform: scale(1.05);
  }
}
#contact input:focus, #contact textarea:focus { outline: none; box-shadow: 0 0 0 2px rgba(255,255,255,.20); }

/* Footer subtle lift */
footer { backdrop-filter: blur(2px); }
#hero-logos { display:flex; flex-wrap:wrap; justify-content:space-evenly; align-items:center; gap: clamp(24px, 3vw, 56px); width:100%; }