@import url('../nav-dropdown.css');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --blue:#1a6fb5; --blue-dark:#134f85; --blue-light:#e8f2fb;
      --green:#17a589; --green-light:#e6f7f4;
      --dark:#1a1f2e; --gray:#64748b; --gray-light:#f1f5f9;
      --white:#ffffff; --border:#e2e8f0; --radius:12px;
    }
    html { scroll-behavior: smooth; }
    body { font-family:'Inter',system-ui,sans-serif; color:var(--dark); background:var(--white); line-height:1.6; font-size:16px; }
    .container { max-width:1100px; margin:0 auto; padding:0 24px; }
    .btn { display:inline-block; padding:14px 32px; border-radius:50px; font-weight:600; font-size:15px; cursor:pointer; text-decoration:none; transition:all .25s ease; border:none; }
    .btn-primary { background:var(--blue); color:var(--white); box-shadow:0 4px 16px rgba(26,111,181,.35); }
    .btn-primary:hover { background:var(--blue-dark); transform:translateY(-2px); }
    .btn-outline { background:transparent; color:var(--blue); border:2px solid var(--blue); }
    .btn-outline:hover { background:var(--blue-light); }
    nav { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.95); backdrop-filter:blur(10px); border-bottom:1px solid var(--border); padding:0 24px; }
    .nav-inner { max-width:1100px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; height:78px; }
    .logo { font-size:clamp(20px, 2.2vw, 24px); font-weight:800; color:var(--blue); text-decoration:none; display:flex; align-items:center; gap:10px; line-height:1; letter-spacing:-0.02em; }
    .logo span { color:var(--dark); }
    footer .logo { font-size:clamp(17px,1.8vw,21px); gap:8px; letter-spacing:-0.02em; }
    .nav-links { display:flex; align-items:center; gap:32px; list-style:none; }
    .nav-links a { text-decoration:none; color:var(--dark); font-size:14px; font-weight:500; transition:color .2s; }
    .nav-links a:visited { color:var(--dark); text-decoration:none; }
    .nav-links a:hover { color:var(--blue); }
    .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }
    .hamburger span { display:block; width:24px; height:2px; background:var(--dark); border-radius:2px; }
    .mobile-menu { display:none; flex-direction:column; background:var(--white); border-top:1px solid var(--border); padding:16px 24px 24px; }
    .mobile-menu.open { display:flex; }
    .mobile-menu a:not(.btn):not(.btn-helpe-formation) { text-decoration:none; color:var(--dark); font-size:16px; font-weight:500; padding:12px 0; border-bottom:1px solid var(--border); }
    .mobile-menu .btn, .mobile-menu a.btn-helpe-formation { display:inline-block; margin-top:10px; text-align:center; width:100%; box-sizing:border-box; border-bottom:none; padding:14px 32px; font-size:15px; font-weight:600; border-radius:50px; text-decoration:none; }
    .mobile-menu a.btn-primary { background:var(--blue); color:var(--white) !important; border:none; box-shadow:0 4px 16px rgba(26,111,181,.35); }
    .mobile-menu a.btn-outline { background:var(--white); color:var(--blue) !important; border:2px solid var(--blue); }
    .mobile-menu a.btn-helpe-formation { color:#fff !important; background:#17a589; border:none; box-shadow:0 4px 14px rgba(23,165,137,.35); }
    @media (max-width:768px) { .nav-links,.helpe-nav-actions { display:none; } .hamburger { display:flex; } }
    .page-hero { background:linear-gradient(135deg,#f0f7ff 0%,#e8f4f8 100%); padding:56px 0 48px; border-bottom:1px solid var(--border); }
    .breadcrumb { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--gray); margin-bottom:16px; }
    .breadcrumb a { color:var(--blue); text-decoration:none; }
    .breadcrumb a:hover { text-decoration:underline; }
    .page-hero h1 { font-size:clamp(24px,3.5vw,36px); font-weight:800; color:var(--dark); margin-bottom:10px; }
    .page-hero p { font-size:15px; color:var(--gray); }
    .legal-section { padding:64px 0 88px; }
    .legal-inner { display:grid; grid-template-columns:240px 1fr; gap:56px; align-items:start; }
    .legal-nav { position:sticky; top:88px; background:var(--gray-light); border-radius:var(--radius); padding:24px 20px; }
    .legal-nav-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:var(--gray); margin-bottom:16px; }
    .legal-nav ul { list-style:none; display:flex; flex-direction:column; gap:4px; }
    .legal-nav a { display:block; font-size:13px; color:var(--gray); text-decoration:none; padding:6px 10px; border-radius:8px; transition:all .15s; font-weight:500; }
    .legal-nav a:hover { background:var(--blue-light); color:var(--blue); }
    .legal-content { max-width:720px; }
    .legal-article { padding-bottom:44px; margin-bottom:44px; border-bottom:1px solid var(--border); }
    .legal-article:last-child { border-bottom:none; padding-bottom:0; margin-bottom:0; }
    .legal-article-num { display:inline-block; background:var(--blue-light); color:var(--blue); font-size:11px; font-weight:700; padding:3px 12px; border-radius:50px; text-transform:uppercase; letter-spacing:.5px; margin-bottom:10px; }
    .legal-article h2 { font-size:20px; font-weight:800; color:var(--dark); margin-bottom:20px; padding-bottom:12px; border-bottom:2px solid var(--blue-light); }
    .legal-article h3 { font-size:15px; font-weight:700; color:var(--dark); margin:24px 0 10px; }
    .legal-article h3::before { content:'▸ '; color:var(--blue); }
    .legal-article p { font-size:14.5px; color:#374151; line-height:1.8; margin-bottom:14px; }
    .legal-article ul { padding-left:20px; margin:10px 0 16px; }
    .legal-article li { font-size:14px; color:#374151; line-height:1.75; margin-bottom:6px; }
    .legal-article a { color:var(--blue); text-decoration:none; }
    .legal-article a:hover { text-decoration:underline; }
    .info-box { background:var(--blue-light); border-left:4px solid var(--blue); border-radius:0 10px 10px 0; padding:16px 20px; margin:16px 0; font-size:14px; color:var(--dark); line-height:1.7; }
    .info-box strong { color:var(--blue); }
    .data-table { width:100%; border-collapse:collapse; font-size:13.5px; margin:16px 0 20px; }
    .data-table th { background:var(--dark); color:var(--white); padding:10px 14px; text-align:left; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.4px; }
    .data-table td { padding:10px 14px; border-bottom:1px solid var(--border); vertical-align:top; line-height:1.5; color:#374151; }
    .data-table tr:nth-child(even) td { background:var(--gray-light); }
    .update-badge { display:inline-flex; align-items:center; gap:6px; background:var(--green-light); color:var(--green); font-size:12px; font-weight:600; padding:4px 14px; border-radius:50px; margin-bottom:32px; }
    footer { background:var(--dark); color:#94a3b8; padding:48px 0 32px; }
    .footer-inner { display:grid; grid-template-columns:2fr 1fr 1fr; gap:48px; margin-bottom:40px; }
    .footer-brand p { font-size:14px; line-height:1.7; max-width:280px; margin-top:12px; }
    .footer-col h4 { font-size:13px; font-weight:700; color:var(--white); text-transform:uppercase; letter-spacing:.6px; margin-bottom:16px; }
    .footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
    .footer-col a { color:#94a3b8; text-decoration:none; font-size:14px; transition:color .2s; }
    .footer-col a:hover { color:var(--white); }
    .footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:24px; display:flex; align-items:center; justify-content:space-between; font-size:13px; flex-wrap:wrap; gap:12px; }
    .footer-bottom a { color:#64748b; text-decoration:none; }
    .footer-bottom a:hover { color:var(--white); }
    .helpe-social { display: inline-flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; }
    .footer-bottom .helpe-social a { color: #64748b; text-decoration: none; }
    .footer-bottom .helpe-social a:hover { color: var(--white); }
    @media (max-width:900px) { .legal-inner { grid-template-columns:1fr; } .legal-nav { position:static; } }
    @media (max-width:768px) { .footer-inner { grid-template-columns:1fr; gap:32px; } .footer-bottom { flex-direction:column; text-align:center; } }

/* HelpE — bouton « Ma formation » (barre de navigation + menus mobiles) */
.helpe-nav-actions {
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

@media (min-width: 769px) {
  .helpe-nav-actions {
    display: flex;
  }
}

@media (max-width: 768px) {
  .nav-links,
  .helpe-nav-actions {
    display: none !important;
  }
  .hamburger {
    display: flex !important;
  }
  nav {
    padding: 0 16px;
  }
  .container {
    padding-left: 16px;
    padding-right: 16px;
    max-width: 100%;
  }
}

.helpe-nav-actions .btn.nav-cta,
.helpe-nav-actions .btn.nav-cta-guides {
  padding: 10px 24px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

a.btn-helpe-formation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  line-height: 1.2;
  color: #fff !important;
  background: #17a589;
  border: none;
  border-radius: 50px;
  text-decoration: none !important;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(23, 165, 137, 0.35);
  transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

a.btn-helpe-formation:hover {
  background: #139a7a;
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(23, 165, 137, 0.45);
}

.mobile-menu a.btn-helpe-formation {
  width: 100%;
  margin-top: 8px;
  box-sizing: border-box;
}

/* Barres internes (formation / espace membre / démo) */
a.btn-helpe-formation--compact {
  padding: 7px 16px;
  font-size: 13px;
  box-shadow: 0 3px 12px rgba(23, 165, 137, 0.28);
}

/* Page login : entête avec bouton site */
.login-header-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.login-header-inner .logo {
  flex-shrink: 0;
}
