 :root{--primary: #0b5ed7;--primary-dark: #073b8c;--primary-light: #e6f0ff;--accent: #0ea5e9;--bg: #f3f6fb;--bg-alt: #ffffff;--text: #1f2933;--muted: #6b7280;--border: rgba(148, 163, 184, 0.4);--shadow-soft: 0 18px 45px rgba(15, 23, 42, 0.18);--radius-lg: 18px;--radius-md: 12px;} *, *::before, *::after{box-sizing: border-box;} html, body{margin: 0;padding: 0;} body{font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;background: radial-gradient(circle at top left, #e0edff 0, #f5f7fb 40%, #ffffff 100%);color: var(--text);line-height: 1.6;} a{color: inherit;text-decoration: none;} a:hover{text-decoration: none;} .app-shell{min-height: 100vh;display: flex;flex-direction: column;} header{position: sticky;top: 0;z-index: 50;background: #1d4ed8;color: #e5e7eb;padding: 0.9rem 0;box-shadow: 0 8px 20px rgba(0,0,0,0.15);} .nav{max-width: 1180px;margin: 0 auto;padding: 0 1.25rem;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 0.5rem;} .brand{display: flex;flex-direction: column;align-items: center;gap: 0rem;} .brand-logo{height: 60px;} .brand-text-title{font-weight: 800;font-size: 1.1rem;letter-spacing: 0.06em;text-transform: uppercase;color: var(--primary-dark);} .brand-text-sub{font-size: 1rem;color: #e5e7eb;font-weight: 600;font-style: italic;margin-top:-22px;} .brand-text-sub span{color: var(--primary);font-weight: 600;} .nav-right{display: flex;flex-direction: column;align-items: center;gap: 0.35rem;} .nav-links{display: flex;flex-wrap: nowrap;gap: 0.9rem;justify-content: center;} .nav-links a{font-size: 0.9rem;padding: 0;color: #f0f4ff;border: none;position: relative;text-decoration: none;transition: color 0.2s ease;} .nav-links a:hover{color: #bfdbfe;} .nav-links a.active{color: #bfdbfe;} .lang-switch{font-size: 0.8rem;display: inline-flex;align-items: center;gap: 0.25rem;padding: 0.3rem 0.6rem;border-radius: 999px;border: 1px solid rgba(15, 23, 42, 0.18);background: #f9fafb;} .lang-switch a{font-weight: 500;} .lang-switch span.sep{color: var(--muted);} .lang-switch a.active-lang{color: var(--primary-dark);text-decoration: underline;} .hero{max-width: 1180px;margin: 1.7rem auto 0;padding: 0 1.25rem 1.75rem;display: grid;grid-template-columns: minmax(0, 3fr) minmax(0, 2.5fr);gap: 1.6rem;align-items: center;} .hero--simple{grid-template-columns: minmax(0, 1.4fr);} .hero-main{position: relative;} .hero-kicker{font-size: 0.78rem;text-transform: uppercase;letter-spacing: 0.18em;color: var(--primary-dark);margin-bottom: 0.5rem;display: inline-flex;align-items: center;gap: 0.35rem;} .hero-kicker-dot{width: 6px;height: 6px;border-radius: 999px;background: linear-gradient(135deg, var(--primary), var(--accent));} .hero-title{font-size: clamp(2rem, 3.2vw, 2.6rem);color: var(--primary-dark);margin-bottom: 0.45rem;} .hero-title span{color: var(--primary);} .hero-lead{font-size: 0.99rem;color: var(--muted);max-width: 34rem;margin-bottom: 0.9rem;} .hero-tags{display: flex;flex-wrap: wrap;gap: 0.4rem;margin-bottom: 1.2rem;} .tag{font-size: 0.75rem;padding: 0.25rem 0.7rem;border-radius: 999px;background: #ffffff;color: var(--primary-dark);border: 1px solid rgba(148, 163, 184, 0.5);display: inline-flex;align-items: center;gap: 0.25rem;} .tag-dot{width: 6px;height: 6px;border-radius: 999px;background: var(--primary);} .hero-actions{display: flex;flex-wrap: wrap;gap: 0.75rem;margin-top: 0.6rem;} .btn-primary, .btn-outline{font-size: 0.9rem;padding: 0.65rem 1.3rem;border-radius: 999px;border: 1px solid transparent;cursor: pointer;display: inline-flex;align-items: center;gap: 0.35rem;transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.12s, box-shadow 0.2s;} .btn-primary{background: linear-gradient(135deg, var(--primary), var(--accent));color: #ffffff;box-shadow: 0 16px 40px rgba(15, 23, 42, 0.35);} .btn-primary:hover{transform: translateY(-1px);box-shadow: 0 20px 52px rgba(15, 23, 42, 0.45);} .btn-outline{background: rgba(255, 255, 255, 0.9);color: var(--primary-dark);border-color: rgba(148, 163, 184, 0.8);} .btn-outline:hover{background: var(--primary-light);border-color: var(--primary);transform: translateY(-1px);} .hero-side{background: linear-gradient(145deg, #0b5ed7, #0ea5e9);border-radius: 26px;padding: 1.1rem 1.1rem 1.3rem;box-shadow: var(--shadow-soft);color: #e5edff;position: relative;overflow: hidden;} .hero-side::before{content: "";position: absolute;inset: 0;background: radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.12), transparent 55%), radial-gradient(circle at 80% 100%, rgba(15, 23, 42, 0.25), transparent 60%);opacity: 0.9;} .hero-side-inner{position: relative;} .hero-side-title{font-size: 0.95rem;font-weight: 600;margin-bottom: 0.5rem;display: flex;align-items: center;gap: 0.4rem;} .hero-side-title span.badge{font-size: 0.7rem;padding: 0.15rem 0.55rem;border-radius: 999px;background: rgba(15, 23, 42, 0.5);border: 1px solid rgba(255, 255, 255, 0.6);} .hero-grid{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 0.55rem;} .hero-mini-card{background: rgba(15, 23, 42, 0.25);border-radius: 14px;padding: 0.55rem 0.65rem;border: 1px solid rgba(226, 232, 240, 0.4);font-size: 0.78rem;} .hero-mini-title{font-weight: 600;margin-bottom: 0.15rem;} .hero-mini-p{font-size: 0.75rem;opacity: 0.92;} .hero-mini-meta{margin-top: 0.25rem;display: inline-flex;align-items: center;gap: 0.25rem;font-size: 0.72rem;padding: 0.15rem 0.5rem;border-radius: 999px;background: rgba(15, 23, 42, 0.4);} main{max-width: 1180px;margin: 0 auto 2.5rem;padding: 0 1.25rem 2.5rem;} .section-header{margin-top: 0.25rem;margin-bottom: 0.9rem;} .section-title{font-size: 1.4rem;color: var(--primary-dark);margin-bottom: 0.25rem;} .section-subtitle{font-size: 0.9rem;color: var(--muted);} .cards{display: grid;grid-template-columns: repeat(3, 1fr);gap: 1.1rem;margin-top: 0.8rem;} .card{background: var(--bg-alt);border-radius: var(--radius-lg);padding: 1rem 1.1rem;box-shadow: 0 14px 36px rgba(15, 23, 42, 0.14);border: 1px solid var(--border);position: relative;overflow: hidden;} .card::before{content: "";position: absolute;inset-inline: 0;top: 0;height: 3px;background: linear-gradient(135deg, var(--primary), var(--accent));opacity: 0.7;} .card h3{font-size: 1rem;margin-bottom: 0.35rem;color: var(--primary-dark);} .card p{font-size: 0.9rem;color: var(--muted);margin-bottom: 0.5rem;} .card ul{list-style: none;padding-left: 0;margin: 0;font-size: 0.87rem;color: var(--text);} .card ul li{padding-left: 1.05rem;position: relative;margin-bottom: 0.25rem;} .card ul li::before{content: "";position: absolute;left: 0;top: 0.52rem;width: 6px;height: 6px;border-radius: 999px;background: var(--primary);} .card-tagline{font-size: 0.8rem;margin-top: 0.4rem;padding: 0.4rem 0.55rem;border-radius: 10px;background: var(--primary-light);color: var(--primary-dark);} .contact-grid{display: grid;grid-template-columns: minmax(0, 3fr) minmax(0, 2.3fr);gap: 1.3rem;margin-top: 1rem;} .contact-block, .info-block{background: var(--bg-alt);border-radius: var(--radius-lg);padding: 1rem 1.1rem;box-shadow: 0 14px 36px rgba(15, 23, 42, 0.14);border: 1px solid var(--border);font-size: 0.9rem;} .contact-block label{display: block;font-size: 0.84rem;margin-bottom: 0.2rem;color: var(--primary-dark);} .contact-block input, .contact-block textarea{width: 100%;padding: 0.55rem 0.6rem;border-radius: 10px;border: 1px solid rgba(148, 163, 184, 0.9);font-size: 0.9rem;margin-bottom: 0.6rem;font-family: inherit;background: #ffffff;} .contact-block textarea{min-height: 130px;resize: vertical;} .contact-note{font-size: 0.78rem;color: var(--muted);margin-top: 0.4rem;} .info-block p{margin-bottom: 0.35rem;} .info-label{font-weight: 600;color: var(--primary-dark);} footer{margin-top: auto;border-top: 1px solid var(--border);padding: 0.9rem 1.25rem;text-align: center;font-size: 0.8rem;color: var(--muted);background: rgba(255, 255, 255, 0.96);} footer a{color: var(--primary);font-weight: 500;} [dir="rtl"] body, body[dir="rtl"]{direction: rtl;} [dir="rtl"] .nav{flex-direction: column;align-items: center;justify-content: center;} [dir="rtl"] .nav-links{justify-content: center;} [dir="rtl"] .brand{flex-direction: column;align-items: center;} [dir="rtl"] .hero{direction: rtl;} [dir="rtl"] .cards, [dir="rtl"] main, [dir="rtl"] .section-header, [dir="rtl"] .contact-grid{direction: rtl;} [dir="rtl"] .card ul li{padding-left: 0;padding-right: 1.05rem;} [dir="rtl"] .card ul li::before{left: auto;right: 0;} @media (max-width: 900px){.hero{grid-template-columns: minmax(0, 1fr);} .hero--simple{padding-bottom: 1.25rem;} .hero-side{order: -1;} .hero{padding-top: 1.2rem;}} @media (max-width: 720px){.nav{align-items: flex-start;} .nav-links{margin-top: 0.35rem;} main{padding-bottom: 2rem;} .contact-grid{grid-template-columns: minmax(0, 1fr);}} .table-formats{width: 100%;border-collapse: collapse;margin-top: 0.5rem;font-size: 0.95rem;} .table-formats th, .table-formats td{border: 1px solid rgba(255,255,255,0.12);padding: 0.45rem 0.6rem;text-align: left;} .table-formats th{font-weight: 600;} .quote-form{display: flex;flex-direction: column;gap: 0.6rem;margin-top: 0.5rem;} .quote-form .form-row{display: flex;flex-direction: column;gap: 0.2rem;} .quote-form label{font-size: 0.9rem;} .quote-form input, .quote-form textarea{border-radius: 6px;border: 1px solid rgba(0,0,0,0.16);padding: 0.4rem 0.5rem;font: inherit;background: #ffffff;color: #000000;} .quote-form button{align-self: flex-start;border-radius: 999px;border: none;padding: 0.4rem 0.9rem;font: inherit;cursor: pointer;} .help-text{margin-top: 8px;font-size: 0.95rem;color: #333;} .privacy-box{margin-top: 15px;padding: 12px;background: #eef4ff;border-left: 4px solid #0052cc;border-radius: 5px;font-size: 0.95rem;} .quote-form button, .quote-form .whatsapp-button{align-self: flex-start;border-radius: 999px;border: none;padding: 0.6rem 1.4rem;font: inherit;cursor: pointer;background: #0052cc;color: #ffffff;transition: 0.25s ease;display: inline-flex;align-items: center;gap: 0.4rem;} .quote-form button:hover, .quote-form .whatsapp-button:hover{background: #003d99;} .price-note{margin-top: 10px;font-size: 0.9rem;color: #444444;} .quote-form .whatsapp-button{margin-top: 10px;text-decoration: none;} nav ul{display: flex;flex-direction: row;gap: 20px;align-items: center;justify-content: center;} nav ul li{display: inline-block;} .lang-switch{font-size: 0.8rem;display: inline-flex;align-items: center;gap: 0.25rem;padding: 0.3rem 0.6rem;border-radius: 999px;border: 1px solid rgba(15, 23, 42, 0.18);background: #f9fafb;} .lang-switch a{font-weight: 600;color: #111827;} .lang-switch span.sep{color: #9ca3af;} .lang-switch a.active-lang{color: #1d4ed8;text-decoration: underline;} .data-plans{padding-top: 2.5rem;padding-bottom: 2.5rem;} .data-plans .container-narrow{max-width: 900px;margin: 0 auto;} .section-title{font-size: 1.6rem;margin-bottom: 0.5rem;text-align: center;} .section-intro{font-size: 0.98rem;color: #4b5563;text-align: center;margin-bottom: 1.5rem;} .compare-wrapper{overflow-x: auto;margin-bottom: 1.8rem;} .compare-table{width: 100%;border-collapse: collapse;font-size: 0.9rem;background: #fff;border-radius: 12px;overflow: hidden;box-shadow: 0 8px 20px rgba(15,23,42,0.08);} .compare-table th, .compare-table td{padding: 0.75rem 0.9rem;border-bottom: 1px solid #e5e7eb;vertical-align: top;} .compare-table thead th{background: #eff6ff;font-weight: 600;text-align: left;} .compare-table thead th:nth-child(2), .compare-table thead th:nth-child(3){text-align: center;} .compare-table tbody td:nth-child(1){font-weight: 600;width: 22%;} .compare-table .price{color: #1d4ed8;font-weight: 700;} .plans-cards{display: grid;grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));gap: 1.3rem;margin-bottom: 1.5rem;} .plan-card{background: #fff;border-radius: 14px;padding: 1.2rem 1.3rem;box-shadow: 0 8px 22px rgba(15,23,42,0.10);border: 1px solid #e5e7eb;} .plan-card h3{font-size: 1.1rem;margin-bottom: 0.5rem;} .plan-card p{font-size: 0.92rem;color: #4b5563;margin-bottom: 0.7rem;} .plan-card ul{list-style: none;padding-left: 0;margin: 0 0 0.8rem 0;} .plan-card ul li{font-size: 0.9rem;color: #374151;padding-left: 1.1rem;position: relative;margin-bottom: 0.25rem;} .plan-card ul li::before{content: "•";position: absolute;left: 0;color: #1d4ed8;} .plan-note{font-size: 0.86rem;color: #4b5563;} .plan-premium{border-color: #bfdbfe;background: #eff6ff;} .justify-text{text-align: justify;} .hero-lead.justify-text{max-width: 100%;} .lang-switch a{position: relative;display: inline-block;width: 28px;height: 18px;border-radius: 4px;overflow: hidden;text-indent: -9999px;border: 1px solid rgba(15, 23, 42, 0.25);background-size: cover;background-position: center;background-repeat: no-repeat;} .lang-switch span.sep{display: none;} .lang-switch a.active-lang{outline: 2px solid var(--primary-dark);outline-offset: 2px;text-decoration: none;}    .hero-title{text-align: center;} [dir="rtl"] .hero-main, [dir="rtl"] .hero-lead, [dir="rtl"] .card, [dir="rtl"] .section-header, [dir="rtl"] .section-title, [dir="rtl"] .section-subtitle, [dir="rtl"] .info-block, [dir="rtl"] .contact-block{text-align: right;} [dir="rtl"] input[type="tel"]{direction: rtl;text-align: right;} [dir="rtl"] .info-block a[href^="tel"]{direction: ltr;unicode-bidi: bidi-override;text-align: right;} header .lang-switch{position: absolute;right: 24rem;top: 3rem;} @media (max-width: 720px){header .lang-switch{position: static;margin-top: 0.35rem;}} .genea-link-card{display: flex;justify-content: center;} .genea-link-card .card{max-width: 720px;margin: 0 auto;box-shadow: 0 0.9rem 2.2rem rgba(15, 23, 42, 0.28);border-radius: 1.25rem;} .before-after{display: flex;flex-wrap: wrap;gap: 1.5rem;justify-content: center;align-items: flex-start;margin-top: 1.5rem;} .before-after figure{max-width: 260px;text-align: center;} .before-after img{width: 100%;height: auto;border-radius: 0.75rem;box-shadow: 0 0.75rem 1.8rem rgba(15, 23, 42, 0.28);} .before-after figcaption{margin-top: 0.5rem;font-size: 0.9rem;opacity: 0.9;} .gallery-note{margin-top: 1.5rem;text-align: center;font-size: 0.95rem;} .hero-actions--inline{margin-top: 0.75rem;} 

/* Auto Dark Mode */
@media (prefers-color-scheme: dark) {
  body { background:#0d1117 !important; color:#e6edf3 !important; }
  header, nav { background:#161b22 !important; }
  a { color:#58a6ff !important; }
}

#loader {
  position:fixed;
  top:0;left:0;width:100%;height:100%;
  background:#fff;
  display:flex;justify-content:center;align-items:center;
  z-index:9999;
}
#loader div {
  width:40px;height:40px;border:5px solid #003366;
  border-top-color:transparent;border-radius:50%;
  animation:spin 1s linear infinite;
}
@keyframes spin {100%{transform:rotate(360deg);}}


/* Global visible blue background (override any page-inline backgrounds) */
html, body { min-height: 100%; }
body{
  background: linear-gradient(180deg,#e6f0ff 0%,#c7ddff 55%,#8fb8ff 100%) !important;
}

/* White content surface to make blue clearly visible around */
.page-surface{
  max-width: 1180px;
  margin: 26px auto 28px;
  background: rgba(255,255,255,0.96);
  border-radius: 20px;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.22);
  border: 2px solid rgba(143, 184, 255, 0.75);
  overflow: hidden;
}

/* Ensure footer doesn’t paint over the blue */
footer{ background: transparent !important; }
@media (max-width: 720px){
  .page-surface{
    margin: 14px 12px 22px;
    border-radius: 16px;
  }
}

/* A11Y Contrast Fix v2: mobile nav active/links */
@media (max-width: 760px){
  /* Ensure nav text contrast is always sufficient on mobile */
  nav.nav-links, .nav-links{
    background: rgba(8, 63, 160, 0.98) !important;
  }
  nav.nav-links a, .nav-links a{
    color: #ffffff !important;
    opacity: 1 !important;
    font-weight: 700 !important;
    text-shadow: none !important;
  }
  /* Active/current page link */
  nav.nav-links a.active,
  nav.nav-links a[aria-current="page"],
  .nav-links a.active,
  .nav-links a[aria-current="page"]{
    background: rgba(255,255,255,0.22) !important;
    color: #ffffff !important;
    border: 2px solid rgba(255,255,255,0.55) !important;
    border-radius: 10px !important;
  }
  /* Some pages use class="active" directly without .nav-links specificity */
  nav a.active, a.active{
    color: #ffffff !important;
  }
  /* Focus visible for keyboard */
  nav.nav-links a:focus-visible, .nav-links a:focus-visible{
    outline: 3px solid rgba(255,255,255,0.75) !important;
    outline-offset: 2px !important;
  }
}

/* Active nav underline */
.nav-links a.active,
.nav-links a[aria-current="page"]{text-decoration: underline; text-underline-offset: 6px;}


/* ===========================
   Mobile drawer menu (CLEAN)
   - Desktop: menu horizontal
   - Mobile <= 768px: bouton ☰ + drawer
   =========================== */

/* Toggle button (hidden by default) */
.menu-toggle{
  display:none;
  gap:8px;
  align-items:center;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  border-radius:999px;
  font-weight:600;
}

/* Burger icon */
.menu-toggle .burger{
  width:18px; height:12px; position:relative; display:inline-block;
}
.menu-toggle .burger::before,
.menu-toggle .burger::after,
.menu-toggle .burger span{
  content:"";
  position:absolute; left:0; right:0;
  height:2px;
  background:#1d4ed8;
  border-radius:2px;
}
.menu-toggle .burger::before{ top:0; }
.menu-toggle .burger span{ top:5px; }
.menu-toggle .burger::after{ bottom:0; }

/* Overlay */
.menu-overlay{
  position:fixed; inset:0;
  background: rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition: opacity .2s ease;
  z-index: 9998;
}
.menu-overlay.show{
  opacity:1;
  pointer-events:auto;
}

/* Drawer */
.mobile-drawer{
  position:fixed;
  top:0;
  left:0;
  width: min(75vw, 340px);  /* <-- largeur du panneau */
  height:100vh;
  background: #f9fbff;
  transform: translateX(-105%);
  transition: transform .22s ease;
  z-index: 9999;
  box-shadow: 0 12px 35px rgba(0,0,0,.25);
  display:flex;
  flex-direction:column;
}
.mobile-drawer.open{ transform: translateX(0); }

/* Drawer header */
.mobile-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 14px 10px;
  border-bottom:1px solid rgba(29,78,216,.12);
}
.mobile-drawer__title{
  font-weight:800;
  color:#1d4ed8;
}
.mobile-drawer__close{
  border:0;
  background: transparent;
  font-size: 22px;
  line-height:1;
  cursor:pointer;
  padding:6px 8px;
  border-radius:10px;
}
.mobile-drawer__close:hover{ background: rgba(29,78,216,.08); }

/* Scroll area (this is what DevTools shows: nav.mobile-drawer__nav) */
.mobile-drawer__nav{
  padding:10px 10px 18px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling: touch;
}

/* If links are inside ul/li */
.mobile-drawer__nav ul,
.mobile-drawer__nav li{
  list-style:none;
  margin:0;
  padding:0;
}

/* Links style */
.mobile-drawer__nav a{
  display:block;
  width: min(82%, 280px);   /* <-- largeur des "boutons" */
  margin: 8px auto;
  padding:10px 12px;
  border-radius:14px;
  text-decoration:none;
  font-weight:700;
  color:#1d4ed8;
  text-align:center;
  background:#ffffff;
  border:1px solid rgba(29,78,216,.18);
}
.mobile-drawer__nav a:hover{
  background:#1d4ed8;
  color:#ffffff;
}

/* RTL: open from right */
html[dir="rtl"] .mobile-drawer{
  left:auto;
  right:0;
  transform: translateX(105%);
}
html[dir="rtl"] .mobile-drawer.open{
  transform: translateX(0);
}

/* Mobile behaviour: hide horizontal links, show toggle */
@media (max-width: 768px){
  .nav-links{ display:none !important; }
  .menu-toggle{ display:inline-flex !important; }

  /* top row: menu + flags on same line */
  header .nav-right{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    width:100% !important;
    flex-wrap:nowrap !important;
  }

  header .menu-toggle,
  header .lang-switch{
    white-space:nowrap !important;
    background:#ffffff !important;
    border:1px solid rgba(29,78,216,.28) !important;
    color:#1d4ed8 !important;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.10) !important;
  }

  body.menu-open{ overflow:hidden; }
}

/* Ensure desktop keeps nav-links visible */
@media (min-width: 769px){
  .nav-links{ display:flex; }
}


.lang-switch a[data-lang="fr"]{background-image:url("photos/flags/flag-fr.svg");}.lang-switch a[data-lang="en"]{background-image:url("photos/flags/flag-en.svg");}.lang-switch a[data-lang="he"]{background-image:url("photos/flags/flag-he.svg");}


/* =========================================================
   GLOBAL TEXT CENTERING + CTA CENTERING (FINAL)
   ========================================================= */

/* Center all text globally */
body{
  text-align: center;
}
body *{
  text-align: inherit;
}

/* Neutralize RTL forced alignment but keep RTL direction */
[dir="rtl"] .hero-main,
[dir="rtl"] .hero-lead,
[dir="rtl"] .card,
[dir="rtl"] .section-header,
[dir="rtl"] .section-title,
[dir="rtl"] .section-subtitle,
[dir="rtl"] .info-block,
[dir="rtl"] .contact-block{
  text-align: inherit;
}

/* ==============================
   GLOBAL CENTERING FOR CTA BUTTONS
   (Devis / WhatsApp)
   ============================== */

/* Containers */
.hero-actions,
.hero-actions--inline,
.quote-form,
.quote-form .form-row{
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Buttons */
.btn-primary,
.btn-outline,
.quote-form button,
.quote-form .whatsapp-button,
a.whatsapp-button{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}

/* Remove left bias */
.quote-form button,
.quote-form .whatsapp-button{
  align-self: center;
}


/* =========================================================
   GLOBAL CARDS LAYOUT — FORCE 3 + 3
   ========================================================= */

/* Desktop & large screens: always 3 cards per row */
.cards,
.plans-cards{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  justify-items: center;
}

/* Normalize card width */
.cards > .card,
.plans-cards > .plan-card{
  width: 100%;
  max-width: 360px;
}

/* Tablet: 2 cards per row */
@media (max-width: 900px){
  .cards,
  .plans-cards{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: 1 card per row */
@media (max-width: 520px){
  .cards,
  .plans-cards{
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   GLOBAL CENTERING FOR PAGE SUBTITLES / TAGLINES
   (Text under titles on all pages)
   ========================================================= */

/* Common subtitle classes */
.section-subtitle,
.section-intro,
.hero-lead,
.card p,
.plan-card p,
.gallery-note,
.price-note,
.help-text{
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}


/* =========================================================
   SINGLE CARD — FULL WIDTH
   If only one card exists in a grid, make it full width
   ========================================================= */

/* One single card in cards grid */
.cards:has(> .card:only-child){
  grid-template-columns: 1fr !important;
}

.cards:has(> .card:only-child) > .card{
  max-width: 100% !important;
  width: 100% !important;
}

/* One single card in plans grid */
.plans-cards:has(> .plan-card:only-child){
  grid-template-columns: 1fr !important;
}

.plans-cards:has(> .plan-card:only-child) > .plan-card{
  max-width: 100% !important;
  width: 100% !important;
}


/* =========================================================
   TWO CARDS — FULL WIDTH (2 cards only)
   ========================================================= */

/* Exactly two cards in cards grid */
.cards:has(> .card:nth-child(2):last-child){
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.cards:has(> .card:nth-child(2):last-child) > .card{
  max-width: 100% !important;
  width: 100% !important;
}

/* Exactly two plan cards */
.plans-cards:has(> .plan-card:nth-child(2):last-child){
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.plans-cards:has(> .plan-card:nth-child(2):last-child) > .plan-card{
  max-width: 100% !important;
  width: 100% !important;
}


/* =========================================================
   CENTER BULLET POINTS (Lists)
   ========================================================= */

/* Center list container */
.cards ul,
.plan-card ul,
.info-block ul,
.hero ul{
  padding-left: 0 !important;
  list-style-position: inside;
  text-align: center;
}

/* Replace custom left bullets with centered bullets */
.cards ul li,
.plan-card ul li,
.info-block ul li{
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center;
}

/* Disable custom ::before bullets that force left alignment */
.cards ul li::before,
.plan-card ul li::before,
.card ul li::before{
  content: "•";
  position: static;
  display: inline-block;
  margin-right: 0.35em;
  color: var(--primary);
}

/* =========================================================
   BULLETS FIX v2 — CENTER BULLET + TEXT TOGETHER
   (Uses flex on <li> so the bullet cannot "stick" left)
   ========================================================= */

.cards ul,
.plan-card ul,
.info-block ul,
.hero ul,
.card ul{
  list-style: none !important;   /* remove browser marker */
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0;
  margin-right: 0;
}

/* Center each line as a unit: [• text] */
.cards ul li,
.plan-card ul li,
.info-block ul li,
.hero ul li,
.card ul li{
  display: flex;
  justify-content: center;       /* centers the whole bullet+text group */
  align-items: baseline;
  gap: 0.45em;
  text-align: center;
  margin-bottom: 0.35rem;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Bullet */
.cards ul li::before,
.plan-card ul li::before,
.info-block ul li::before,
.hero ul li::before,
.card ul li::before{
  content: "•";
  position: static !important;
  flex: 0 0 auto;
  color: var(--primary);
  line-height: 1;
}

/* RTL: keep same visual centering */
html[dir="rtl"] .cards ul li,
html[dir="rtl"] .plan-card ul li,
html[dir="rtl"] .info-block ul li,
html[dir="rtl"] .hero ul li,
html[dir="rtl"] .card ul li{
  flex-direction: row-reverse;
}

.mobile-drawer[hidden], .menu-overlay[hidden]{display:none !important;}


/* --- FIX: Force flag buttons to render on all viewports (desktop + mobile) --- */
.lang-switch a{
  position: relative;
  display: inline-block;
  width: 28px;
  height: 18px;
  border-radius: 4px;
  overflow: hidden;
  text-indent: -9999px;
  border: 1px solid rgba(15, 23, 42, 0.25);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


/* --- FIX: Center home hero block (FR/EN/HE) --- */
.hero.hero--home{
  grid-template-columns: 1fr !important;
  justify-items: center;
  text-align: center;
}
.hero.hero--home .hero-main{
  width: 100%;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}
.hero.hero--home .hero-actions{
  justify-content: center;
}
.hero.hero--home .hero-cards,
.hero.hero--home .cards,
.hero.hero--home .home-cards{
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}
/* =====================================================
   GLOBAL — TRANSPARENT PAGE SURFACE (FR / EN / HE)
   Same layout as depannage & studio-photo:
   - Keep small cards
   - Remove big white page container
   ===================================================== */

html[lang="fr"] .page-surface,
html[lang="en"] .page-surface,
html[lang="he"] .page-surface{
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Keep spacing consistent */
html[lang="fr"] .page-surface > *,
html[lang="en"] .page-surface > *,
html[lang="he"] .page-surface > *{
  margin-left: auto;
  margin-right: auto;
}

/* Cards stay as-is */
html[lang="fr"] .card,
html[lang="en"] .card,
html[lang="he"] .card{
  background: var(--card-bg, #fff);
  box-shadow: var(--card-shadow, 0 8px 24px rgba(0,0,0,.08));
}
/* =====================================================
   MENU BUTTON — MOBILE ONLY (FINAL FIX)
   ===================================================== */

/* Desktop: hide menu button everywhere */
.menu-toggle,
.menu-btn{
  display: none !important;
}

/* Mobile only */
@media (max-width: 768px){
  .menu-toggle,
  .menu-btn{
    display: inline-flex !important;
  }
}

/* =====================================================
   FIX DRAPEAUX — chemins ABSOLUS (FR/EN/HE)
   dossier en minuscules : photos/
   ===================================================== */
.lang-switch a{
  position: relative;
  display: inline-block;
  width: 28px;
  height: 18px;
  border-radius: 4px;
  overflow: hidden;
  text-indent: -9999px;
  border: 1px solid rgba(15, 23, 42, 0.25);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.lang-switch a[data-lang="fr"]{ background-image:url("photos/flags/flag-fr.svg") !important; }
.lang-switch a[data-lang="en"]{ background-image:url("photos/flags/flag-en.svg") !important; }
.lang-switch a[data-lang="he"]{ background-image:url("photos/flags/flag-he.svg") !important; }

/* Fallback si data-lang absent */
.lang-switch a[href*="/FR/"]{ background-image:url("photos/flags/flag-fr.svg"); }
.lang-switch a[href*="/EN/"]{ background-image:url("photos/flags/flag-en.svg"); }
.lang-switch a[href*="/HE/"]{ background-image:url("photos/flags/flag-he.svg"); }

/* =====================================================
   MOBILE FIX — LIVRES (exact)
   ===================================================== */
@media (max-width: 900px){

  html, body{
    overflow-x: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  *, *::before, *::after{
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  .page-surface{
    transform: none !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* =====================================================
   MOBILE FIX — HEADER logo + slogan centré (FORCE FR/EN/HE)
   ===================================================== */
@media (max-width: 900px){

  header{
    width: 100% !important;
  }

  header .header-inner{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  header .brand,
  header .brand-wrap,
  header .logo-wrap{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  header img,
  header .logo{
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  header .slogan,
  header .tagline{
    display: block !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* === FIX footer mobile: 2 lignes propres (tel + mail ensemble) === */
@media (max-width:600px){
  footer{
    display:block;
    text-align:center;
    line-height:1.35;
  }
  footer a[href^="tel"]{
    display:block;
    margin-top:.3rem;
  }
}

/* =========================================================
   FIX: Mobile drawer menu links should be BLACK (not blue)
   Some pages were showing blue menu text on mobile.
   ========================================================= */
.mobile-drawer__nav a{
  color: #111827 !important; /* near-black */
}
.mobile-drawer__nav a:hover{
  color: #ffffff !important;
}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;}
.table-scroll table{min-width:640px;}

@media (max-width:600px){.hero-lead{white-space:normal;}}
@media (max-width:720px){.apropos-cards>.card{max-width:100% !important;width:100% !important;}.apropos-cards{justify-items:stretch !important;}}
@media (max-width:520px){.cards:has(> .card:nth-child(2):last-child){grid-template-columns:1fr !important;justify-items:stretch !important;}.cards:has(> .card:nth-child(2):last-child)>.card{width:100% !important;max-width:100% !important;}}

/* FIX TITRES – pages matériel EN & HE (lang sur <html>) */
html:not([lang="fr"]) .hero-title,
html:not([lang="fr"]) .hero h1,
html:not([lang="fr"]) .hero h2,
html:not([lang="fr"]) .hero h3{
  display: block !important;
  visibility: visible !important;
}

/* SUPPRESSION DES MAUVAIS TITRES – FR uniquement */
html[lang="fr"] .hero-kicker:not(h1):not(h2):not(h3){
  display: none !important;
}

/* Ultra-réduction espace au-dessus des titres (toutes langues) */
.hero{
  margin-top: 0.4rem !important;
}

.hero--simple{
  padding-top: 0.2rem !important;
}

/* Zéro marge parasite au-dessus du titre */
.hero-title,
.hero h1,
.hero h2,
.hero h3{
  margin-top: 0 !important;
}

/* Harmonisation "hero--simple" (comme FR): centre le texte sous le titre */
.hero--simple .hero-main{ text-align: center; }
.hero--simple .hero-lead{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  white-space: normal;
}
/* À PROPOS : forcer une seule colonne comme FR (EN + HE) */
html[lang="en"] .apropos-cards,
html[lang="he"] .apropos-cards{
  grid-template-columns: 1fr !important;
}


/* ===== MENU MOBILE SANS SCROLL (FORCE) ===== */
.mobile-drawer {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body.menu-open {
  overflow: hidden;
}


/* ===== MENU MOBILE – LARGEUR RÉDUITE ===== */
.mobile-drawer {
  width: 80vw !important;
  max-width: 340px !important;
}

@media (min-width: 768px) {
  .mobile-drawer {
    width: 320px !important;
  }
}
