/* DataFish V3 : sous-ensemble de styles.css réellement utilisé par les pages générées (produit automatiquement, ne pas éditer). */
:root { --color-primary: #1e3a5f; --color-secondary: #2c3e50; --color-dark: #0f172a; --color-black: #000000; --color-text: #333; --color-text-light: #475569; --color-text-lighter: #64748b; --color-white: #ffffff; --color-bg-light: #f1f3f5; --color-bg-lighter: #f8f9fa; --color-border: rgba(30,58,95,0.1); --shadow-sm: 0 2px 10px rgba(0,0,0,0.1); --shadow-md: 0 4px 20px rgba(0,0,0,0.15); --shadow-lg: 0 12px 30px rgba(15, 23, 42, 0.12); --transition-base: 0.3s ease; }
* { margin: 0px; padding: 0px; box-sizing: border-box; }
.container { max-width: 1100px; margin: 0px auto; padding: 0px 2rem; }
#accueil, #partenaires, #services { scroll-margin-top: 100px; }
#tarifs { scroll-margin-top: 70px; }
body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: rgb(51, 51, 51); overflow-x: hidden; background: rgb(255, 255, 255); }
html { scroll-behavior: smooth; overflow-x: clip; }
header { background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(10px); box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 10px; position: fixed; width: 100%; top: 0px; z-index: 1000; transition: 0.3s; }
nav { max-width: 1100px; margin: 0px auto; padding: 0.75rem 0px; display: flex; justify-content: space-between; align-items: center; }
.logo { font-size: 1.8rem; font-weight: bold; color: rgb(44, 62, 80); text-decoration: none; display: flex; align-items: center; gap: 0.6rem; transition: 0.3s; }
.logo:hover { transform: translateY(-2px); }
.nav-links { display: flex; list-style: none; gap: 2rem; }
.nav-links a { text-decoration: none; color: rgb(51, 51, 51); font-weight: 500; transition: color 0.3s; position: relative; }
.nav-links a::after { content: ""; position: absolute; bottom: -5px; left: 0px; width: 0px; height: 2px; background: linear-gradient(90deg, var(--color-primary), #3498db); transition: width 0.3s; }
.nav-links a:hover { color: rgb(30, 58, 95); }
.nav-links a:hover::after { width: 100%; }
.nav-lang { display: flex; align-items: center; }
.lang-switch { display: inline-flex; align-items: center; border: 1px solid rgba(30, 58, 95, 0.18); border-radius: 999px; padding: 2px; background: rgba(30, 58, 95, 0.04); line-height: 1; }
.lang-switch .lang-option { display: inline-block; padding: 0.3rem 0.65rem; border-radius: 999px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.5px; color: rgb(107, 124, 143); text-decoration: none; transition: background 0.3s, color 0.3s; }
.lang-switch .lang-option.is-active { background: linear-gradient(135deg, var(--color-secondary), var(--color-primary)); color: rgb(255, 255, 255); cursor: default; }
.nav-item-with-dropdown { position: relative; }
.nav-link-with-dropdown { display: flex; align-items: center; gap: 0.4rem; cursor: pointer; }
.dropdown-icon { font-size: 0.75rem; transition: transform 0.3s; }
.nav-item-with-dropdown:hover .dropdown-icon, .nav-item-with-dropdown.active .dropdown-icon { transform: rotate(180deg); }
.dropdown-menu { position: absolute; top: calc(100% + 15px); left: 50%; background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(10px); min-width: 280px; border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.15) 0px 10px 40px; padding: 0.8rem 0px; list-style: none; opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(-10px); transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); z-index: 1002; border: 1px solid rgba(30, 58, 95, 0.1); }
.dropdown-menu::before { content: ""; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 0px; height: 0px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid rgba(255, 255, 255, 0.98); }
.nav-item-with-dropdown:hover .dropdown-menu, .nav-item-with-dropdown.active .dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0px); }
.dropdown-menu li { margin: 0px; }
.dropdown-menu a { display: flex; align-items: center; gap: 0.8rem; padding: 0.9rem 1.3rem; color: var(--color-secondary); text-decoration: none; transition: 0.3s; font-size: 0.95rem; position: relative; }
.dropdown-menu a::after { display: none; }
.dropdown-menu a i { color: var(--color-primary); font-size: 1rem; width: 20px; text-align: center; transition: transform 0.3s; }
.dropdown-menu a:hover { background: linear-gradient(135deg, rgba(30, 58, 95, 0.05), rgba(52, 152, 219, 0.05)); color: var(--color-primary); padding-left: 1.5rem; }
.dropdown-menu a:hover i { transform: scale(1.15); }
.dropdown-menu li:first-child a { border-radius: 12px 12px 0px 0px; }
.dropdown-menu li:last-child a { border-radius: 0px 0px 12px 12px; }
.menu-toggle { display: none; flex-direction: column; justify-content: space-around; width: 32px; height: 28px; background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; padding: 0px; z-index: 1001; transition: transform 0.3s; }
.menu-toggle:hover { transform: scale(1.1); }
.hamburger-line { width: 100%; height: 3px; background: var(--color-primary); border-radius: 3px; transition: 0.3s; transform-origin: center center; }
.menu-toggle.active .hamburger-line:nth-child(1) { transform: translateY(10px) rotate(45deg); }
.menu-toggle.active .hamburger-line:nth-child(2) { opacity: 0; transform: translateX(-20px); }
.menu-toggle.active .hamburger-line:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }
.cta-button { display: inline-block; padding: 16px 48px; background: linear-gradient(135deg, rgb(255, 255, 255) 0%, rgb(248, 249, 250) 100%); color: rgb(30, 58, 95); text-decoration: none; border-radius: 50px; font-weight: 700; font-size: 1.05rem; transition: 0.3s; box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 20px; border: 2px solid rgba(255, 255, 255, 0.3); position: relative; overflow: hidden; }
.cta-button::before { content: ""; position: absolute; top: 0px; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent); transition: left 0.5s; }
.cta-button:hover::before { left: 100%; }
.cta-button:hover { transform: translateY(-3px) scale(1.02); box-shadow: rgba(0, 0, 0, 0.3) 0px 8px 30px; background: linear-gradient(135deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 100%); }
.cta-button i { margin-right: 0.5rem; }
.cta-buttons-group { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-bottom: 1.5rem; }
.cta-button-compact { padding: 12px 28px; font-size: 0.95rem; display: inline-flex; align-items: center; gap: 0.5rem; }
@media (max-width: 360px) {
  .container { padding: 0px 1rem; }
}
footer { background: linear-gradient(rgb(248, 249, 250) 0%, rgb(255, 255, 255) 100%); box-shadow: rgba(0, 0, 0, 0.05) 0px -1px 0px; padding: 2.5rem 0px 1.5rem; position: relative; }
footer::before { content: ""; position: absolute; top: 0px; left: 50%; transform: translateX(-50%); width: 100px; height: 3px; background: linear-gradient(90deg, transparent, var(--color-primary), transparent); border-radius: 2px; }
.footer-content { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 3rem; padding-bottom: 2rem; margin-bottom: 2rem; border-bottom: 1px solid rgba(30, 58, 95, 0.1); }
.footer-section h3 { font-size: 1.5rem; color: var(--color-primary); margin-bottom: 0.5rem; font-weight: 700; }
.footer-tagline { color: var(--color-text-light); font-size: 0.95rem; font-style: italic; margin-bottom: 0.8rem; }
.footer-description { color: var(--color-text-light); font-size: 0.9rem; line-height: 1.6; max-width: 350px; }
.footer-links { list-style: none; padding: 0px; }
.footer-links li { margin-bottom: 0.6rem; }
.footer-links a { color: var(--color-text-light); text-decoration: none; transition: 0.3s; font-size: 0.95rem; display: inline-block; }
.footer-links a:hover { color: var(--color-primary); transform: translateX(5px); }
.footer-contact { list-style: none; padding: 0px; }
.footer-contact li { margin-bottom: 0.8rem; color: var(--color-text-light); font-size: 0.95rem; display: flex; align-items: center; gap: 0.6rem; }
.footer-contact i { color: var(--color-primary); width: 16px; }
.footer-contact a { color: var(--color-text-light); text-decoration: none; transition: color 0.3s; }
.footer-contact a:hover { color: var(--color-primary); }
.footer-bottom { text-align: center; max-width: 1100px; margin: 0px auto; padding: 1.5rem 0px 0px; }
.footer-bottom p { color: rgb(100, 116, 139); opacity: 0.9; font-size: 0.9rem; }
@media (max-width: 768px) {
  .container { padding: 0px 1.5rem; }
  .footer-content { grid-template-columns: 1fr; gap: 2rem; text-align: center; }
  .footer-description { max-width: 100%; }
  .footer-contact li { justify-content: center; }
  .footer-links a:hover { transform: translateX(0px); }
  .logo { font-size: 1.4rem; }
  .menu-toggle { display: flex; }
  nav { position: relative; }
  .nav-links { position: fixed; top: 60px; right: -100%; width: 280px; height: calc(-60px + 100vh); background: rgb(255, 255, 255); flex-direction: column; padding: 2rem 1.5rem; gap: 0px; box-shadow: rgba(0, 0, 0, 0.1) -5px 0px 20px; transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); z-index: 1000; overflow-y: auto; }
  .nav-links.active { right: 0px; }
  .nav-links li { width: 100%; margin-bottom: 0.5rem; opacity: 0; transform: translateX(20px); transition: opacity 0.3s, transform 0.3s; }
  .nav-links.active li { opacity: 1; transform: translateX(0px); }
  .nav-links.active li:nth-child(1) { transition-delay: 0.1s; }
  .nav-links.active li:nth-child(2) { transition-delay: 0.15s; }
  .nav-links.active li:nth-child(3) { transition-delay: 0.2s; }
  .nav-links.active li:nth-child(4) { transition-delay: 0.25s; }
  .nav-links.active li:nth-child(5) { transition-delay: 0.3s; }
  .nav-links.active li:nth-child(6) { transition-delay: 0.35s; }
  .nav-links a { display: block; padding: 1rem 1.2rem; font-size: 1.1rem; color: var(--color-secondary); border-radius: 8px; background: transparent; transition: 0.3s; }
  .nav-links a::after { display: none; }
  .nav-links a:hover { background: linear-gradient(135deg, rgba(30, 58, 95, 0.05), rgba(52, 152, 219, 0.05)); color: var(--color-primary); transform: translateX(5px); }
  .nav-lang { margin-top: 0.75rem; padding-top: 1rem; border-top: 1px solid rgba(30, 58, 95, 0.1); }
  .lang-switch { width: 100%; justify-content: center; padding: 4px; }
  .nav-item-with-dropdown .dropdown-menu { position: static; transform: none; box-shadow: none; background: rgba(30, 58, 95, 0.03); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 8px; min-width: 0px; width: auto; margin-top: 0px; margin-left: 1rem; padding: 0px; max-height: 0px; overflow: hidden; opacity: 1; visibility: visible; transition: max-height 0.4s, padding 0.4s, margin-top 0.4s; }
  .nav-item-with-dropdown .dropdown-menu::before { display: none; }
  .nav-item-with-dropdown.active .dropdown-menu { transform: none; max-height: 500px; margin-top: 0.5rem; padding: 0.5rem 0px; }
  .nav-link-with-dropdown { display: flex; align-items: center; justify-content: space-between; width: 100%; }
  .dropdown-menu a { padding: 0.8rem 1rem; font-size: 0.95rem; }
  .dropdown-menu a:hover { padding-left: 1.3rem; }
  body::before { content: ""; position: fixed; top: 60px; left: 0px; width: 100%; height: calc(-60px + 100vh); background: rgba(0, 0, 0, 0); pointer-events: none; transition: background 0.3s; z-index: 999; }
  body.menu-open::before { background: rgba(0, 0, 0, 0.5); pointer-events: all; }
  body.menu-open { overflow: hidden; }
  nav { padding: 1rem 0px; gap: 3rem; justify-content: space-between; }
  .nav-links { gap: 1rem; font-size: 0.85rem; }
  #tarifs { scroll-margin-top: 65px; }
  .cta-button-compact { padding: 11px 24px; font-size: 0.9rem; }
  .cta-buttons-group { gap: 0.9rem; }
  .cta-buttons-group .cta-button { min-width: 200px; padding: 15px 32px; font-size: 1rem; }
}
@media (max-width: 767px) and (min-width: 481px) {
  .cta-button-compact { padding: 12px 26px; font-size: 0.9rem; }
}
@media (max-width: 480px) {
  #tarifs { scroll-margin-top: 60px; }
  .cta-button-compact { padding: 10px 20px; font-size: 0.85rem; width: 100%; justify-content: center; }
  .cta-buttons-group { flex-direction: column; gap: 0.8rem; }
  .cta-buttons-group .cta-button { width: 100%; justify-content: center; display: flex; align-items: center; padding: 14px 28px; font-size: 0.95rem; }
}
@media (max-width: 768px) {
  .contact-coordinates a, .footer-contact a { display: inline-block; padding: 0.75rem 0.25rem; }
  .nav-links .lang-switch .lang-option { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
}