/* =====================================
   /* =====================================================
      Baseline minimal stylesheet (revert & clean)
      Keeps user-approved changes: sections removed, pale role,
      simplified aesthetic, consistent spacing.
      ===================================================== */
  :root {
     --brand-900:#102434; --brand-700:#1d4159; --brand-600:#24546f; --brand-500:#2d6685; --brand-300:#6a97af; --brand-100:#d8e6ed; --brand-050:#f2f6f8;
     --ink-900:#132029; --ink-700:#2d3a44; --ink-600:#41515c; --ink-500:#5a6c78; --ink-400:#7a8993;
     --focus:#2d6685; --radius:12px; --radius-sm:5px;
     --shadow-sm:0 2px 4px -2px rgba(25,40,60,.18),0 1px 2px rgba(0,0,0,.08);
     --shadow:0 10px 34px -16px rgba(15,40,65,.28),0 4px 12px -4px rgba(0,0,0,.08);
     --side-pad:clamp(20px,5vw,70px);
   /* Gap par défaut entre les steps services */
   --diag-step-gap:80px;
    }
    * { box-sizing:border-box; }
    html { font:400 16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; -webkit-text-size-adjust:100%; }
    body { margin:0; background:var(--brand-050); color:var(--ink-700); -webkit-font-smoothing:antialiased; }
    /* Inputs et textarea: s'assurer d'une police unifiée (certains UA mobiles appliquent une monospace par défaut au textarea) */
    input, textarea { font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; }
    img { max-width:100%; height:auto; display:block; }
    a { color:var(--brand-600); text-decoration:none; }
    a:hover, a:focus-visible { text-decoration:underline; }
    h1,h2,h3 { line-height:1.12; font-weight:650; letter-spacing:.6px; color:var(--ink-900); margin:0 0 .6em; }
    p { margin:0 0 1.1em; }
    :focus-visible { outline:2px solid var(--focus); outline-offset:2px; border-radius:3px; }
    .skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
    .skip-link:focus { position:fixed; top:10px; left:10px; width:auto; height:auto; background:#fff; padding:10px 16px; z-index:1000; border-radius:6px; box-shadow:var(--shadow-sm); }

    /* Hero */
    header.site-hero {
      /* Reintroduced photographic layer */
      --hero-img: url('img/Viewlookingup.jpg');
      background:
        linear-gradient(155deg,rgba(16,40,60,.82),rgba(20,55,85,.78) 44%,rgba(18,50,78,.82)),
        var(--hero-img) center/cover no-repeat;
      color:#fff; padding:86px var(--side-pad) 92px; position:relative; overflow:hidden; isolation:isolate;
    }
    header.site-hero:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 68% 32%,rgba(255,255,255,.18),transparent 62%); mix-blend-mode:overlay; opacity:.55; pointer-events:none; }
    .topbar { display:flex; align-items:center; gap:40px; justify-content:space-between; margin:0 0 42px; flex-wrap:wrap; }
    .brand { display:flex; align-items:center; gap:18px; font-size:1.35rem; font-weight:640; letter-spacing:.6px; }
  /* Logo sizing: ensure visible at left (minimal explicit width) */
  .brand__logo { height:auto; width:72px; }
    .brand__name { display:flex; flex-wrap:wrap; line-height:1.05; font-size:clamp(1.5rem,2.4vw,2.05rem); font-weight:650; letter-spacing:.9px; }
    .brand__primary { color:#fff; text-shadow:0 2px 6px rgba(0,0,0,.35); }
  .brand__role { font-size:18px; letter-spacing:1.6px; text-transform:uppercase; color:var(--brand-100); font-weight:600; margin-left:10px; align-self:flex-end; text-shadow:0 1px 2px rgba(0,0,0,.4); }
    nav.primary { display:flex; gap:46px; font-size:.95rem; font-weight:500; margin-left:auto; flex-wrap:wrap; }
    nav.primary a { position:relative; padding:4px 2px; color:#fff; letter-spacing:.4px; }
    nav.primary a:after { content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--brand-300); transform:scaleX(0); transform-origin:right; transition:.35s; }
    nav.primary a:hover:after, nav.primary a:focus-visible:after, nav.primary a.active:after { transform:scaleX(1); transform-origin:left; }
    .lang-toggle { display:inline-flex; gap:6px; font-size:.68rem; letter-spacing:.9px; background:rgba(255,255,255,.16); padding:6px 10px; border-radius:32px; }
    .lang-toggle button { background:none; border:none; color:#fff; cursor:pointer; font:inherit; padding:0 4px; opacity:.6; }
    .lang-toggle button.active { opacity:1; font-weight:600; }
  h1.hero-title { margin:56px auto 34px; font-size:clamp(2.5rem,5.2vw,4rem); line-height:1.03; letter-spacing:.95px; font-weight:750; max-width:1080px; text-wrap:balance; text-align:center; color:#e8f3f9; /* léger bleu pâle */ }
  .hero-lead { margin:0 auto 72px; max-width:880px; font-size:clamp(1.03rem,1.5vw,1.28rem); line-height:1.5; opacity:.94; text-align:center; color:rgba(255,255,255,.92); }
    .hero-ctas { display:flex; gap:22px; flex-wrap:wrap; justify-content:center; }

    /* Buttons */
    .btn { --btn-bg:var(--brand-600); --btn-color:#fff; display:inline-flex; align-items:center; justify-content:center; gap:.55em; font-weight:600; letter-spacing:.55px; font-size:.95rem; padding:15px 34px; border:none; border-radius:50px; cursor:pointer; background:var(--btn-bg); color:var(--btn-color); box-shadow:0 6px 18px -6px rgba(15,40,70,.55); transition:.35s; text-decoration:none; }
    .btn:hover { transform:translateY(-3px); text-decoration:none; background:var(--brand-500); }
    .btn.outline { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.35); box-shadow:none; }
    .btn.outline:hover { background:rgba(255,255,255,.18); }
    .btn.small { padding:10px 22px; font-size:.78rem; font-weight:600; }

    main { max-width:1320px; margin:-54px auto 90px; padding:0 var(--side-pad); }
    .panel { background:#fff; padding:54px clamp(22px,3.8vw,70px) 56px; border-radius:var(--radius); box-shadow:0 8px 28px -12px rgba(0,40,70,.18),0 2px 6px -2px rgba(0,0,0,.08); position:relative; }
    .panel + .panel { margin-top:70px; }
    .cta-panel { background:linear-gradient(135deg,var(--brand-600),#0b2238); color:#fff; text-align:center; }
    h2.section-title { margin:0 0 22px; font-size:clamp(1.55rem,2.5vw,2.2rem); letter-spacing:.55px; line-height:1.18; }
    .muted { color:var(--ink-500); }

    .cards-grid { --min:250px; display:grid; gap:30px; grid-template-columns:repeat(auto-fit,minmax(var(--min),1fr)); margin-top:30px; }
    .card { background:linear-gradient(145deg,#ffffff,#f1f5f8); border:1px solid #e1e8ee; padding:24px 22px 28px; border-radius:14px; position:relative; overflow:hidden; transition:.45s; display:flex; flex-direction:column; }
    .card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 0%,rgba(180,190,200,.22),transparent 60%); opacity:.5; pointer-events:none; }
    .card:hover { transform:translateY(-6px); box-shadow:0 14px 34px -16px rgba(0,40,70,.35),0 4px 10px -4px rgba(0,0,0,.08); }
    .card h3 { margin:0 0 10px; font-size:1.05rem; letter-spacing:.4px; color:var(--brand-600); }
    .card p { margin:0 0 14px; font-size:.9rem; line-height:1.5; }
    .bullets { list-style:none; margin:0 0 6px; padding:0; font-size:.8rem; line-height:1.55; }
    .bullets li { padding-left:14px; position:relative; margin:0 0 4px; }
    .bullets li:before { content:"•"; position:absolute; left:0; color:var(--brand-600); opacity:.55; }

    /* About section paragraph justification */
    #a-propos .about-text p { text-align:justify; }

    /* Fix portrait display issue */
    .about-portrait {
      flex: 0 0 auto !important;
      width: 380px !important;
      max-width: 100% !important;
    }
    .about-portrait img {
      width: 100% !important;
      height: auto !important;
      display: block !important;
    }

  footer { text-align:center; padding:60px 16px 90px; font-size:.78rem; background:linear-gradient(180deg,#0b1e2c,#0e3046 58%,#103a55); color:#9fb4c2; position:relative; overflow:hidden; }
  footer:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 68% 22%,rgba(70,140,190,.18),transparent 60%); pointer-events:none; opacity:.7; }
  footer nav { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-bottom:18px; }
  footer nav a { color:#d0e4ef; font-weight:500; text-decoration:none; }
  footer nav a:hover, footer nav a:focus-visible { text-decoration:underline; }
  footer .legal { color:#8599a6; }
    .footer-brand { display:flex; flex-direction:column; align-items:center; gap:12px; margin:0 0 26px; }
    .footer-brand img { width:68px; height:auto; }
  .f-brand-text { font-weight:600; letter-spacing:.6px; color:#c7ddee; }
    .footer-contact { margin:10px 0 24px; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; font-size:.8rem; }
    .footer-contact a { color:#fff; text-decoration:none; font-weight:500; letter-spacing:.4px; }
    .footer-contact a:hover, .footer-contact a:focus-visible { text-decoration:underline; }
    .legal { max-width:880px; margin:0 auto; color:#6c7a86; font-size:.72rem; line-height:1.45; }

  @media (max-width:767px){
      h1.hero-title { font-size:clamp(2.4rem,7vw,3.3rem); }
      .topbar { gap:24px; }
  nav.primary { gap:30px; }
    }
    @media (max-width:680px){
      header.site-hero { padding:70px var(--side-pad) 80px; }
  /* Keep original responsive intent without forcing height if intrinsic differs */
  .brand__logo { height:auto; max-height:70px; }
      nav.primary { gap:20px; font-size:.9rem; }
      h1.hero-title { margin-top:40px; }
      .hero-lead { margin-bottom:60px; font-size:1.02rem; }
      .panel { padding:46px 24px 50px; }
    }
    /* Mobile: keep logo left, only adjust role alignment slightly */
    @media (max-width:640px){
      .brand { flex-direction:row; align-items:center; gap:14px; }
      .brand__name { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; text-align:left; line-height:1.05; position:relative; }
      .brand__primary { display:block; }
  .brand__role { margin-left:0; margin-top:2px; align-self:flex-start; letter-spacing:1.25px; font-size:18px; }
  .brand__logo { align-self:center; max-height:68px; }
    }
    @media print { header.site-hero, .btn { background:none !important; box-shadow:none !important; color:#000 !important; } }
.section { padding: clamp(3.5rem, 8vw, 6.2rem) 0; position:relative; }
/* (Typing effect removed on request) */
@keyframes hero-caret { 50% { opacity:0; } }

/* ===============================
   Hero entrance reveal (refined: smoother, no blur/bounce)
   =============================== */
.reveal-seq { opacity:0; transform:translateY(32px); will-change:transform,opacity; }
.reveal-seq.revealed { animation:revealUp .9s cubic-bezier(.22,.8,.32,1) forwards; animation-delay:var(--rev-delay,0s); }
@keyframes revealUp { from { opacity:0; transform:translateY(32px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce){
  .reveal-seq { opacity:1 !important; transform:none !important; }
  .reveal-seq.revealed { animation:none !important; }
}

/* Scroll reveal for panels */
.panel.reveal-on-scroll { opacity:0; visibility:hidden; transform:translateY(46px); transition:opacity .85s cubic-bezier(.22,.8,.32,1), transform .85s cubic-bezier(.22,.8,.32,1), visibility 0s linear .2s; will-change:transform,opacity; }
.panel.reveal-on-scroll.visible { opacity:1; visibility:visible; transform:translateY(0); transition-delay:0s,0s,0s; }
@media (prefers-reduced-motion:reduce){
  .panel.reveal-on-scroll { opacity:1; transform:none; }
}

/* (Old journey styles removed after diagonal redesign) */

/* ===============================
   Diagonal Journey (New) Layout
   =============================== */
.diag-journey { --gap:70px; display:flex; flex-direction:column; gap:90px; position:relative; margin-top:10px; }
.diag-phase { position:relative; display:flex; flex-direction:column; gap:46px; }
.diag-phase-head { max-width:860px; }
.diag-phase-title { margin:0 0 10px; font-size:clamp(1.35rem,2.2vw,2rem); letter-spacing:.6px; color:var(--ink-900); }
.diag-phase-lead { margin:0; font-size:.95rem; line-height:1.5; color:var(--ink-600); }

.diag-steps { display:flex; flex-direction:column; gap:var(--diag-step-gap); position:relative; }
.diag-step { display:grid; grid-template-columns:repeat(12,1fr); align-items:stretch; gap:32px; position:relative; opacity:0; transform:translateY(42px); transition:opacity .9s cubic-bezier(.22,.8,.32,1), transform .9s cubic-bezier(.22,.8,.32,1); }
.diag-step.visible { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce){ .diag-step { opacity:1; transform:none; transition:none; } }

/* Alternating alignment */
.diag-step.side-left .diag-media-wrap { grid-column:1 / span 5; }
.diag-step.side-left .diag-content { grid-column:6 / -1; }
.diag-step.side-right .diag-media-wrap { grid-column:8 / -1; }
.diag-step.side-right .diag-content { grid-column:1 / span 7; }

@media (max-width:960px){
  .diag-step.side-left .diag-media-wrap,
  .diag-step.side-left .diag-content,
  .diag-step.side-right .diag-media-wrap,
  .diag-step.side-right .diag-content { grid-column:1 / -1; }
  .diag-step { gap:26px; }
}

.diag-media-wrap { position:relative; border-radius:18px; overflow:hidden; aspect-ratio:4/3; background:linear-gradient(135deg,#e6eef3,#f5f9fb); box-shadow:0 10px 34px -18px rgba(10,35,60,.4),0 4px 10px -4px rgba(0,0,0,.08); display:flex; }
.diag-media-wrap img { width:100%; height:100%; object-fit:cover; filter:brightness(.9) contrast(1.05); transition:transform 1.1s cubic-bezier(.22,.8,.32,1); }
.diag-step:hover .diag-media-wrap img { transform:scale(1.06); }
.diag-badge { position:absolute; top:14px; left:14px; width:48px; height:48px; background:var(--brand-600); color:#fff; font-weight:650; font-size:1rem; display:flex; align-items:center; justify-content:center; border-radius:50%; box-shadow:0 6px 16px -6px rgba(15,40,60,.45); }

.diag-content { position:relative; background:linear-gradient(150deg,#ffffff,#f5f8fa); border:1px solid #e2e9ee; padding:28px 30px 30px; border-radius:18px; box-shadow:0 8px 28px -14px rgba(10,35,60,.18),0 2px 6px -2px rgba(0,0,0,.08); display:flex; flex-direction:column; }
.diag-step-title { margin:0 0 12px; font-size:clamp(1.25rem,1.55vw,1.6rem); letter-spacing:.6px; color:var(--brand-600); font-weight:640; line-height:1.22; }
@media (max-width:640px){
  .diag-step-title { font-size:1.28rem; }
}
.diag-step-text { margin:0 0 18px; font-size:.85rem; line-height:1.55; color:var(--ink-600); text-align:justify; }
.diag-points { list-style:none; margin:0; padding:0; font-size:.74rem; line-height:1.55; display:grid; gap:6px; }
.diag-points li { position:relative; padding-left:14px; }
.diag-points li:before { content:"•"; position:absolute; left:0; color:var(--brand-600); opacity:.55; }

/* Diagonal connective accent (subtle) */
.diag-step:before { content:""; position:absolute; width:42%; height:2px; background:linear-gradient(90deg,rgba(36,84,111,.0),rgba(36,84,111,.4)); top:50%; transform:translateY(-50%); pointer-events:none; }
.diag-step.side-left:before { left:calc(5/12*100% + 16px); }
.diag-step.side-right:before { right:calc(5/12*100% + 16px); transform:translateY(-50%) scaleX(-1); }
@media (max-width:960px){ .diag-step:before { display:none; } }

/* Hover elevation */
.diag-step:hover .diag-content { box-shadow:0 16px 42px -18px rgba(10,35,60,.38),0 6px 18px -6px rgba(0,0,0,.12); }

/* Focus accessibility */
.diag-step:focus-within .diag-content { outline:3px solid var(--brand-300); outline-offset:4px; }

/* ===============================
   Inline Timeline Variant (Option 1)
   =============================== */
.diag-steps { --spine-x: 50%; }
.diag-steps.inline-mode:before { content:""; position:absolute; left:var(--spine-x); top:0; bottom:0; width:2px; background:linear-gradient(var(--brand-100),var(--brand-300)); pointer-events:none; }

/* Activate inline-mode automatically when any .inline step exists */
.diag-step.inline { grid-template-columns:unset; display:flex; gap:42px; align-items:stretch; }
.diag-step.inline.side-left { flex-direction:row; }
.diag-step.inline.side-right { flex-direction:row-reverse; }

/* Re-scope media + content width */
.diag-step.inline .diag-media-wrap { flex:0 0 clamp(260px,32%,360px); aspect-ratio:5/3; }
.diag-step.inline .diag-content { flex:1 1 auto; max-width:62ch; font-size:.93rem; }
.diag-step.inline .diag-step-text { font-size:.9rem; line-height:1.55; }
.diag-step.inline .diag-points { font-size:.76rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); display:grid; }

/* Spine dots aligned behind badge center */
.diag-step.inline .diag-badge { z-index:2; }
.diag-step.inline:after { content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:14px; height:14px; background:#fff; border:3px solid var(--brand-600); border-radius:50%; box-shadow:0 0 0 5px var(--brand-100); }

/* Remove diagonal connector line for inline variant */
.diag-step.inline:before { display:none; }

@media (max-width:1100px){
  .diag-step.inline { gap:30px; }
  .diag-step.inline .diag-media-wrap { flex:0 0 clamp(220px,40%,300px); }
}
@media (max-width:880px){
  .diag-step.inline { flex-direction:column !important; }
  .diag-step.inline .diag-media-wrap { width:100%; }
  .diag-step.inline:after { left:var(--spine-x); }
}
@media (max-width:640px){
  .diag-step.inline .diag-content { font-size:.9rem; }
  .diag-step.inline .diag-step-text { font-size:.87rem; }
}

/* Add a utility class to mark container in JS (optional future) */
.diag-steps:has(.diag-step.inline) { position:relative; }

/* =====================================
   User adjustments (visibility & readability tweaks)
   ===================================== */
#services.panel { background:linear-gradient(180deg,#eef5f9,#e5eef4); }
/* Hide spine & center dots now that images overlap */
/* Restore vertical spine (requested) */
.diag-steps.inline-mode:before { display:block; opacity:.9; }
.diag-step.inline:after { display:none; }
/* Increase readability: enlarge body text and list */
.diag-step.inline .diag-content { font-size:1rem; line-height:1.55; }
.diag-step.inline .diag-step-text { font-size:1rem; line-height:1.58; }
.diag-step.inline .diag-points { font-size:.85rem; }
.diag-step.inline .diag-points li { margin-bottom:8px; }
/* Widen content slightly for new narrative style */
.diag-step.inline .diag-content { max-width:68ch; }
/* Meta label styling */
.step-meta { display:inline-block; font-size:.63rem; letter-spacing:1.4px; text-transform:uppercase; font-weight:600; background:var(--brand-100); color:var(--brand-600); padding:4px 10px 3px; border-radius:30px; margin:0 0 12px; }
/* Enhance list bullets to checkmarks */
.diag-step.inline .diag-points li { padding-left:28px; position:relative; }
.diag-step.inline .diag-points li:before { content:""; position:absolute; left:0; top:.24em; width:16px; height:16px; border:2px solid var(--brand-600); border-radius:4px; background:linear-gradient(145deg,#fff,#eef5f9); box-shadow:0 1px 3px rgba(0,0,0,.08); }
.diag-step.inline .diag-points li:after { content:""; position:absolute; left:5px; top:8px; width:9px; height:5px; border:3px solid var(--brand-600); border-top:none; border-right:none; transform:rotate(-45deg); border-radius:1px; }

/* ===============================
   No-images variant (requested)
   =============================== */
/* No-images alternate mode: preserve left/right rhythm with a phantom media column */
#services.no-images .diag-media-wrap { visibility:hidden; pointer-events:none; }
#services.no-images .diag-step.inline { flex-direction:row !important; }
#services.no-images .diag-step.inline.side-right { flex-direction:row-reverse !important; }
#services.no-images .diag-step.inline .diag-content { max-width:66ch; font-size:1.02rem; }
#services.no-images .diag-step.inline .diag-step-text { font-size:1.02rem; }
#services.no-images .diag-step.inline .diag-points { font-size:.9rem; }
#services.no-images .diag-step.inline { gap:42px; }
#services.no-images .diag-steps { gap:var(--diag-step-gap); }
#services.no-images .step-meta { margin-top:2px; }
@media (max-width:960px){
  #services.no-images .diag-step.inline { flex-direction:column !important; }
  #services.no-images .diag-step.inline.side-right { flex-direction:column !important; }
  #services.no-images .diag-step.inline .diag-content { max-width:100%; }
  #services.no-images .diag-step.inline { gap:26px; }
}
@media (max-width:640px){
  #services.no-images .diag-step.inline .diag-content { font-size:1rem; }
  #services.no-images .diag-step.inline .diag-points { font-size:.85rem; }
}
/* Reversible: remove class no-images on #services to restore visuals */
@media (max-width:640px){
  .diag-step.inline .diag-content { font-size:.97rem; }
  .diag-step.inline .diag-step-text { font-size:.97rem; }
  .diag-step.inline .diag-points { font-size:.8rem; }
}

/* =====================================
   Final Services CTA Block
   ===================================== */
.diag-final-cta { position:relative; margin:70px auto 0; max-width:980px; padding:0 20px 10px; }
.diag-final-cta .cta-line { position:absolute; top:-70px; left:50%; width:2px; height:70px; background:linear-gradient(to bottom,var(--brand-300),transparent); transform:translateX(-50%); opacity:.9; }
.diag-final-cta .cta-card { background:linear-gradient(140deg,#ffffffee,#f2f8fcee); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border:1px solid #d4e2ea; padding:40px 44px 46px; border-radius:26px; box-shadow:0 14px 48px -18px rgba(15,45,75,.3),0 4px 14px -4px rgba(0,0,0,.1); position:relative; overflow:hidden; }
.diag-final-cta .cta-card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 75% 28%,rgba(60,120,170,.12),transparent 62%); pointer-events:none; }
.diag-final-cta .cta-heading { margin:0 0 18px; font-size:clamp(1.4rem,2.2vw,2rem); letter-spacing:.5px; color:var(--brand-700); line-height:1.18; }
.diag-final-cta .cta-text { margin:0 0 26px; font-size:1.05rem; line-height:1.55; max-width:760px; color:var(--ink-600); }
.diag-final-cta .cta-btn { font-size:1.02rem; padding:16px 30px; font-weight:600; box-shadow:0 6px 20px -8px rgba(25,60,95,.45); }
.diag-final-cta .cta-btn:hover { transform:translateY(-4px); }
.diag-final-cta .cta-btn:focus-visible { outline:3px solid var(--brand-300); outline-offset:3px; }
@media (max-width:860px){
  .diag-final-cta { margin:64px auto 0; }
  .diag-final-cta .cta-card { padding:38px 34px 42px; border-radius:24px; }
  .diag-final-cta .cta-heading { font-size:1.55rem; }
  .diag-final-cta .cta-text { font-size:1rem; }
}
@media (max-width:600px){
  .diag-final-cta .cta-card { padding:34px 26px 40px; }
  .diag-final-cta .cta-heading { font-size:1.4rem; }
  .diag-final-cta .cta-text { font-size:.98rem; }
  .diag-final-cta .cta-line { top:-56px; height:56px; }
}
@media (prefers-reduced-motion:reduce){
  .diag-final-cta .cta-btn:hover { transform:none; }
}

/* Brand alignment fix */
.topbar { justify-content:flex-start; }
.topbar .brand { margin-right:auto; }
/* Ensure nav stays to the right but with space */
nav.primary { margin-left:40px; }
@media (max-width:767px){ nav.primary { margin-left:0; } }
/* Explicitly display brand name inline on larger screens */
.brand__name { flex-direction:row; }

/* Contact title override */
#contact h2.section-title { color:#fff; }

/* Responsive: réduire l'espacement des steps services sur mobile pour compacité */
@media (max-width:767px){
  :root { --diag-step-gap:40px; }
}

/* Assurance: réappliquer le gap mobile même dans variantes (#services.no-images) */
@media (max-width:767px){
  #services .diag-steps, #services.no-images .diag-steps { gap:var(--diag-step-gap); }
}