{"id":22,"date":"2026-02-17T05:54:22","date_gmt":"2026-02-17T05:54:22","guid":{"rendered":"https:\/\/www.kosmaagency.com\/?page_id=22"},"modified":"2026-02-26T18:51:16","modified_gmt":"2026-02-26T18:51:16","slug":"accueil","status":"publish","type":"page","link":"https:\/\/www.kosmaagency.com\/","title":{"rendered":"Accueil"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"22\" class=\"elementor elementor-22\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bb5407d e-con-full e-flex e-con e-parent\" data-id=\"bb5407d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6908dd2 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"6908dd2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"kosmaHeroV2\" id=\"top\">\n  <style>\n    .kosmaHeroV2{\n      --ink:#0b1220;\n\n      --turqA:#0486a7;\n      --turqB:#13b28f;\n      --turqC:#0aa7c2;\n\n      --sun:#f6b21a;\n      --sun2:#ffcc47;\n\n      --ctaBlue:#2f8fe0;\n      --ctaTurq:#1aa7b8;\n\n      --headerBg: rgba(255,255,255,.80);\n      --headerLine: rgba(11,18,32,.08);\n      --headerShadow: 0 18px 46px rgba(11,18,32,.12);\n    }\n\n    .kosmaHeroV2, .kosmaHeroV2 *{ box-sizing:border-box; }\n    .kosmaHeroV2 a{ text-decoration:none; color:inherit; }\n    .kosmaHeroV2 button{ font:inherit; }\n    html{ scroll-behavior:smooth; }\n\n    \/* ===== HERO ===== *\/\n    .kh2-hero{\n      position:relative;\n      width:100%;\n      overflow:hidden;\n      padding: 22px 0 0;\n      background:\n        radial-gradient(900px 520px at 18% 18%, rgba(255,255,255,.10), transparent 65%),\n        radial-gradient(780px 520px at 70% 55%, rgba(255,255,255,.08), transparent 70%),\n        linear-gradient(90deg, var(--turqA) 0%, var(--turqB) 55%, var(--turqC) 100%);\n    }\n\n    .kh2-hero:before{\n      content:\"\";\n      position:absolute; inset:0;\n      opacity:.20;\n      background-image:\n        linear-gradient(rgba(255,255,255,.10) 1px, transparent 1px),\n        linear-gradient(90deg, rgba(255,255,255,.10) 1px, transparent 1px);\n      background-size: 64px 64px;\n      mix-blend-mode: overlay;\n      pointer-events:none;\n    }\n\n    .kh2-arcs{\n      position:absolute; inset:-120px -120px -120px -120px;\n      pointer-events:none;\n      opacity:.35;\n    }\n    .kh2-arcs svg{ width:100%; height:100%; }\n\n    \/* BUBBLES: yoyo \/ reverse path (no reset) *\/\n    .kh2-bubbles{ position:absolute; inset:0; pointer-events:none; }\n    .kh2-bubble{\n      position:absolute;\n      width:7px;height:7px;border-radius:999px;\n      background: rgba(255,255,255,.45);\n      opacity:.58;\n      filter: blur(.15px);\n      transform: translate3d(0,0,0);\n      animation: kh2-drift var(--dur, 10s) ease-in-out infinite alternate;\n      will-change: transform;\n    }\n    @keyframes kh2-drift{\n      0%   { transform: translate3d(0,0,0); }\n      100% { transform: translate3d(var(--dx, 22px), var(--dy, -20px), 0); }\n    }\n\n    .kh2-container{\n      position:relative;\n      max-width: 1160px;\n      margin: 0 auto;\n      padding: 0 44px;\n    }\n    @media(max-width: 980px){\n      .kh2-container{ padding: 0 18px; }\n    }\n\n    \/* ===== HERO HEADER (burger only here) ===== *\/\n    .kh2-heroHeader{\n      display:flex;\n      align-items:center;\n      justify-content:space-between;\n      padding: 8px 0 0;\n      min-height: 56px;\n      transition: opacity .18s ease;\n    }\n    .kh2-brand{\n      display:flex; align-items:center; gap:12px;\n    }\n    .kh2-logoBox{\n      width:44px; height:44px;\n      border-radius: 14px;\n      background: linear-gradient(135deg, #0ea5e9, #14b8a6);\n      display:grid; place-items:center;\n      box-shadow: 0 16px 36px rgba(11,18,32,.20);\n      color:#fff; font-weight:900;\n      flex:0 0 auto;\n    }\n    .kh2-brandName{\n      font-weight: 900;\n      letter-spacing: -0.2px;\n      font-size: 18px;\n      color: rgba(11,18,32,.92);\n    }\n\n    \/* BURGER BUTTON *\/\n    .kh2-burgerBtn{\n      width:52px; height:52px;\n      border-radius: 14px;\n      border: 1px solid rgba(255,255,255,.30);\n      background: rgba(255,255,255,.16);\n      backdrop-filter: blur(10px);\n      display:flex; align-items:center; justify-content:center;\n      cursor:pointer;\n      box-shadow: 0 18px 42px rgba(11,18,32,.18);\n      transition: transform .15s ease, background .15s ease, box-shadow .15s ease;\n      color: #ffffff;\n      padding: 0;\n    }\n    .kh2-burgerBtn:hover{\n      background: rgba(255,255,255,.20);\n      transform: translateY(-1px);\n      box-shadow: 0 22px 52px rgba(11,18,32,.22);\n    }\n    .kh2-burgerIcon{\n      width:22px; height:22px;\n      display:block;\n      transform: translateY(-0.5px);\n    }\n\n    \/* ===== HERO CONTENT ===== *\/\n    .kh2-content{ padding: 38px 0 78px; }\n\n    .kh2-pill{\n      display:inline-flex;\n      align-items:center;\n      gap:10px;\n      padding: 10px 16px;\n      border-radius:999px;\n      background: rgba(255,255,255,.14);\n      border: 1px solid rgba(255,255,255,.20);\n      color: rgba(255,255,255,.92);\n      font-weight: 700;\n      font-size: 14px;\n      backdrop-filter: blur(10px);\n    }\n    .kh2-pill .bolt{ color: var(--sun); }\n\n    .kh2-h1{\n      margin: 18px 0 0;\n      color:#fff;\n      font-weight: 850;\n      letter-spacing: -0.6px;\n      line-height: 1.10;\n      font-size: clamp(38px, 5.2vw, 66px);\n      text-shadow: 0 16px 44px rgba(0,0,0,.18);\n      position:relative;\n      z-index: 1;\n    }\n\n    \/* UNDERLINE *\/\n    .kh2-hl{\n      position:relative;\n      display:inline-block;\n      padding-bottom: 14px;\n      isolation:isolate;\n      z-index: 0;\n    }\n    .kh2-hl:after{\n      content:\"\";\n      position:absolute;\n      left: -2px;\n      right: -6px;\n      bottom: 3px;\n      height: 10px;\n      background: linear-gradient(90deg, var(--sun) 0%, var(--sun2) 100%);\n      border-radius: 999px;\n      transform: rotate(-0.9deg);\n      filter: drop-shadow(0 10px 18px rgba(0,0,0,.10));\n      opacity: .95;\n      z-index: -1;\n    }\n\n    .kh2-sub{\n      margin: 18px 0 0;\n      max-width: 560px;\n      color: rgba(255,255,255,.82);\n      font-size: 18px;\n      line-height: 1.65;\n      font-weight: 520;\n    }\n\n    .kh2-ctas{\n      display:flex;\n      gap: 16px;\n      flex-wrap:wrap;\n      align-items:center;\n      margin-top: 22px;\n    }\n\n    .kh2-btn{\n      display:inline-flex;\n      align-items:center;\n      gap:12px;\n      padding: 16px 26px;\n      border-radius: 999px;\n      border: 1px solid transparent;\n      font-weight: 850;\n      letter-spacing: .12px;\n      font-size: 16px;\n      transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;\n      will-change: transform;\n    }\n\n    \/* CTA Yellow: WHITE text *\/\n    .kh2-btn.primary{\n      background: linear-gradient(90deg, var(--sun) 0%, var(--sun2) 100%);\n      color: #ffffff !important;\n      box-shadow: 0 18px 40px rgba(0,0,0,.22);\n    }\n    .kh2-btn.primary *{ color:#ffffff !important; }\n    .kh2-btn.primary:hover{\n      transform: translateY(-2px);\n      box-shadow: 0 22px 52px rgba(0,0,0,.26);\n    }\n\n    .kh2-btn.secondary{\n      background: rgba(255,255,255,.10);\n      border-color: rgba(255,255,255,.28);\n      color: #fff;\n      backdrop-filter: blur(10px);\n    }\n    .kh2-btn.secondary:hover{\n      transform: translateY(-2px);\n      background: rgba(255,255,255,.14);\n      border-color: rgba(255,255,255,.36);\n    }\n\n    .kh2-arrow{ width:18px; height:18px; transition: transform .18s ease; }\n    .kh2-btn:hover .kh2-arrow{ transform: translateX(2px); }\n\n    .kh2-checks{\n      display:flex;\n      gap: 26px;\n      flex-wrap:wrap;\n      margin-top: 18px;\n      align-items:center;\n      color: rgba(255,255,255,.78);\n      font-weight: 700;\n      font-size: 14px;\n    }\n    .kh2-check{ display:inline-flex; align-items:center; gap:10px; }\n    .kh2-check svg{ width:18px; height:18px; filter: drop-shadow(0 10px 16px rgba(0,0,0,.12)); }\n\n    .kh2-wave{\n      position:absolute;\n      left:0; right:0; bottom:-1px;\n      width:100%;\n      height: 96px;\n      pointer-events:none;\n    }\n    .kh2-sep{\n      position:absolute;\n      left:0; right:0; bottom:0;\n      height:3px;\n      background: linear-gradient(90deg, var(--ctaTurq) 0%, var(--ctaBlue) 45%, var(--sun) 100%);\n      opacity:.95;\n      pointer-events:none;\n    }\n\n    \/* ===== STICKY SCROLL HEADER ===== *\/\n    .kh2-stickyHeader{\n      position: fixed;\n      top: 0;\n      left: 0; right: 0;\n      z-index: 99999;\n      opacity: 0;\n      pointer-events: none;\n      transform: translateY(-10px);\n      transition: opacity .18s ease, transform .18s ease;\n    }\n    .kh2-stickyHeader.isOn{\n      opacity: 1;\n      pointer-events: auto;\n      transform: translateY(0);\n    }\n    .kh2-stickyBar{\n      width:100%;\n      background: var(--headerBg);\n      backdrop-filter: blur(10px);\n      box-shadow: var(--headerShadow);\n      border-bottom: 1px solid var(--headerLine);\n    }\n    .kh2-stickyInner{\n      max-width: 1160px;\n      margin: 0 auto;\n      padding: 14px 44px;\n      display:flex;\n      align-items:center;\n      justify-content:space-between;\n      gap: 18px;\n    }\n    @media(max-width:980px){\n      .kh2-stickyInner{ padding: 12px 18px; }\n    }\n\n    .kh2-nav{\n      display:flex;\n      align-items:center;\n      justify-content:center;\n      gap: 28px;\n      flex: 1 1 auto;\n    }\n    .kh2-nav a{\n      font-weight: 600;\n      letter-spacing: .12px;\n      color: rgba(11,18,32,.76);\n      font-size: 14.5px;\n      padding: 8px 2px;\n      white-space: nowrap;\n      transition: color .16s ease;\n      position:relative;\n    }\n    .kh2-nav a:hover{ color: rgba(11,18,32,.92); }\n    .kh2-nav a:after{\n      content:\"\";\n      position:absolute; left:0; right:0; bottom:2px;\n      height:2px;\n      background: linear-gradient(90deg, var(--ctaBlue), var(--ctaTurq), var(--sun));\n      transform: scaleX(0);\n      transform-origin:left;\n      transition: transform .18s ease;\n      border-radius:999px;\n      opacity:.9;\n    }\n    .kh2-nav a:hover:after{ transform: scaleX(1); }\n\n    .kh2-stickyCTA{\n      display:flex;\n      align-items:center;\n      gap: 12px;\n      justify-content:flex-end;\n      min-width: 190px;\n    }\n    .kh2-stickyCTA a{\n      display:inline-flex;\n      align-items:center;\n      gap: 10px;\n      padding: 12px 18px;\n      border-radius: 999px;\n      font-weight: 900;\n      font-size: 14px;\n      color:#fff;\n      background: linear-gradient(90deg, var(--ctaBlue), var(--ctaTurq));\n      box-shadow: 0 16px 34px rgba(11,18,32,.14);\n      transition: transform .18s ease, box-shadow .18s ease;\n      white-space:nowrap;\n    }\n    .kh2-stickyCTA a:hover{\n      transform: translateY(-2px);\n      box-shadow: 0 20px 44px rgba(11,18,32,.18);\n    }\n    .kh2-stickyCTA svg{ width:16px; height:16px; }\n\n    @media(max-width: 980px){\n      .kh2-nav{ display:none; }\n      .kh2-stickyCTA{ min-width:auto; }\n    }\n\n    \/* ===== BURGER MENU OVERLAY ===== *\/\n    .kh2-menuOverlay{\n      position: fixed;\n      inset: 0;\n      z-index: 100000;\n      display: none;\n    }\n    .kh2-menuOverlay.isOpen{ display:block; }\n\n    .kh2-menuBackdrop{\n      position:absolute; inset:0;\n      background: rgba(11,18,32,.35);\n      backdrop-filter: blur(10px);\n    }\n\n    .kh2-menuPanel{\n      position: relative;\n      max-width: 1040px;\n      margin: 64px auto 0;\n      padding: 18px;\n    }\n    @media(max-width: 980px){\n      .kh2-menuPanel{ margin: 22px auto 0; padding: 14px; }\n    }\n\n    .kh2-menuBox{\n      background:#fff;\n      border-radius: 18px;\n      box-shadow: 0 26px 80px rgba(11,18,32,.28);\n      overflow:hidden;\n      border: 1px solid rgba(11,18,32,.06);\n    }\n\n    .kh2-menuTop{\n      display:flex;\n      align-items:center;\n      justify-content:space-between;\n      padding: 18px 18px 12px;\n    }\n    .kh2-menuTopLeft{\n      display:flex; align-items:center; gap:12px;\n    }\n\n    \/* \u2705 CLOSE BUTTON: pixel-perfect center *\/\n    .kh2-menuClose{\n      width:46px;\n      height:38px;\n      border-radius: 8px;\n      border: 2px solid rgba(11,18,32,.75);\n      background:#0b5bbf;\n      display:flex;\n      align-items:center;\n      justify-content:center;\n      cursor:pointer;\n      padding:0;\n      line-height:0;      \/* \u2705 remove text baseline shift *\/\n      position:relative;\n    }\n    .kh2-menuClose svg{\n      width:18px !important;\n      height:18px !important;\n      display:block;\n      position:absolute;   \/* \u2705 forces true center *\/\n      left:50%;\n      top:50%;\n      transform: translate(-50%, -50%);\n      pointer-events:none;\n    }\n    .kh2-menuClose svg path{\n      stroke:#fff !important;\n      stroke-width:2.6 !important;\n      stroke-linecap:round !important;\n    }\n\n    .kh2-menuList{ padding: 6px 18px 10px; }\n    .kh2-menuItem{\n      display:flex;\n      align-items:center;\n      justify-content:space-between;\n      padding: 18px 0;\n      font-weight: 700;\n      color: rgba(11,18,32,.85);\n      border-top: 1px solid rgba(11,18,32,.08);\n      font-size: 18px;\n    }\n    .kh2-menuItem:first-child{ border-top: 0; }\n\n    .kh2-menuCtaWrap{\n      padding: 14px 18px 20px;\n      border-top: 1px solid rgba(11,18,32,.08);\n    }\n\n    \/* Burger CTA text WHITE *\/\n    .kh2-menuCta{\n      width:100%;\n      display:flex;\n      align-items:center;\n      justify-content:center;\n      gap: 12px;\n      padding: 18px 18px;\n      border-radius: 999px;\n      color:#ffffff !important;\n      font-weight: 900;\n      background: linear-gradient(90deg, #2f8fe0, #1aa7b8, #13b28f);\n      box-shadow: 0 18px 44px rgba(11,18,32,.18);\n      transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;\n      text-align:center;\n    }\n    .kh2-menuCta *{ color:#ffffff !important; }\n    .kh2-menuCta:hover{\n      transform: translateY(-2px);\n      box-shadow: 0 22px 56px rgba(11,18,32,.22);\n      filter: saturate(1.03);\n    }\n    .kh2-menuCta svg{ width:18px;height:18px; }\n    .kh2-menuCta svg path{ stroke:#ffffff !important; }\n  <\/style>\n\n  <!-- STICKY SCROLL HEADER -->\n  <div class=\"kh2-stickyHeader\" id=\"kh2Sticky\">\n    <div class=\"kh2-stickyBar\">\n      <div class=\"kh2-stickyInner\">\n        <div class=\"kh2-brand\">\n          <div class=\"kh2-logoBox\">K<\/div>\n          <div class=\"kh2-brandName\" style=\"color: rgba(11,18,32,.92);\">Kosma<\/div>\n        <\/div>\n\n        <nav class=\"kh2-nav\" aria-label=\"Navigation\">\n          <a href=\"#services\">Services<\/a>\n          <a href=\"#pourquoi\">Pourquoi nous<\/a>\n          <a href=\"#resultats\">R\u00e9sultats<\/a>\n          <a href=\"#processus\">Processus<\/a>\n          <a href=\"#contact\">Contact<\/a>\n        <\/nav>\n\n        <div class=\"kh2-stickyCTA\">\n          <a href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n            R\u00e9server un audit\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M5 12h13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n              <path d=\"M13 6l6 6-6 6\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- HERO -->\n  <section class=\"kh2-hero\">\n    <div class=\"kh2-arcs\" aria-hidden=\"true\">\n      <svg viewBox=\"0 0 1600 900\" fill=\"none\" preserveAspectRatio=\"none\">\n        <path d=\"M-50 820C220 560 420 520 720 520C1040 520 1230 660 1660 240\" stroke=\"rgba(255,255,255,.35)\" stroke-width=\"2\"\/>\n        <path d=\"M-120 660C160 430 420 380 700 380C1040 380 1240 560 1710 160\" stroke=\"rgba(255,255,255,.28)\" stroke-width=\"2\"\/>\n        <path d=\"M-140 520C140 320 420 260 680 260C1030 260 1280 470 1730 90\" stroke=\"rgba(255,255,255,.22)\" stroke-width=\"2\"\/>\n        <circle cx=\"220\" cy=\"190\" r=\"240\" stroke=\"rgba(255,255,255,.20)\" stroke-width=\"2\"\/>\n        <circle cx=\"220\" cy=\"190\" r=\"360\" stroke=\"rgba(255,255,255,.14)\" stroke-width=\"2\"\/>\n      <\/svg>\n    <\/div>\n\n    <div class=\"kh2-bubbles\" aria-hidden=\"true\">\n      <span class=\"kh2-bubble\" style=\"left:62%;top:24%;--dx:18px;--dy:-16px;--dur:6.8s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:72%;top:38%;--dx:-14px;--dy:-22px;--dur:8.2s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:58%;top:54%;--dx:16px;--dy:-18px;--dur:9.1s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:80%;top:58%;--dx:-18px;--dy:-16px;--dur:10.0s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:66%;top:70%;--dx:14px;--dy:-20px;--dur:8.6s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:50%;top:42%;--dx:20px;--dy:-15px;--dur:7.4s;\"><\/span>\n      <span class=\"kh2-bubble\" style=\"left:88%;top:34%;--dx:-16px;--dy:-19px;--dur:9.7s;\"><\/span>\n    <\/div>\n\n    <div class=\"kh2-container\">\n      <div class=\"kh2-heroHeader\" id=\"kh2HeroHeader\">\n        <div class=\"kh2-brand\">\n          <div class=\"kh2-logoBox\">K<\/div>\n          <div class=\"kh2-brandName\">Kosma<\/div>\n        <\/div>\n\n        <button class=\"kh2-burgerBtn\" id=\"kh2BurgerOpen\" aria-label=\"Ouvrir le menu\">\n          <svg class=\"kh2-burgerIcon\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n            <path d=\"M5 7h14\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"\/>\n            <path d=\"M5 12h14\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"\/>\n            <path d=\"M5 17h14\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"\/>\n          <\/svg>\n        <\/button>\n      <\/div>\n\n      <div class=\"kh2-content\">\n        <div class=\"kh2-pill\">\n          <span class=\"bolt\">\u26a1<\/span>\n          Agence de Marketing Digital Premium\n        <\/div>\n\n        <h1 class=\"kh2-h1\">\n          Boostez vos ventes gr\u00e2ce \u00e0 un <span class=\"kh2-hl\">marketing digital<\/span> efficace\n        <\/h1>\n\n        <p class=\"kh2-sub\">\n          Nous cr\u00e9ons des campagnes email et des contenus qui convertissent, avec des sites web performants et un SEO optimis\u00e9.\n        <\/p>\n\n        <div class=\"kh2-ctas\">\n          <a class=\"kh2-btn primary\" href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n            Demandez votre audit gratuit\n            <svg class=\"kh2-arrow\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M5 12h13\" stroke=\"#ffffff\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n              <path d=\"M13 6l6 6-6 6\" stroke=\"#ffffff\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n          <\/a>\n\n          <a class=\"kh2-btn secondary\" href=\"#resultats\">Voir nos r\u00e9sultats<\/a>\n        <\/div>\n\n        <div class=\"kh2-checks\">\n          <div class=\"kh2-check\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M20 6L9 17l-5-5\" stroke=\"#f6b21a\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n            Audit 100% gratuit\n          <\/div>\n          <div class=\"kh2-check\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M20 6L9 17l-5-5\" stroke=\"#f6b21a\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n            Sans engagement\n          <\/div>\n          <div class=\"kh2-check\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M20 6L9 17l-5-5\" stroke=\"#f6b21a\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n            +150 clients satisfaits\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <svg class=\"kh2-wave\" viewBox=\"0 0 1440 120\" preserveAspectRatio=\"none\" aria-hidden=\"true\">\n      <path fill=\"#ffffff\" d=\"M0,70 C260,110 520,110 780,80 C1020,52 1220,30 1440,40 L1440,120 L0,120 Z\"><\/path>\n    <\/svg>\n    <div class=\"kh2-sep\" aria-hidden=\"true\"><\/div>\n  <\/section>\n\n  <!-- MENU OVERLAY -->\n  <div class=\"kh2-menuOverlay\" id=\"kh2Menu\" aria-hidden=\"true\">\n    <div class=\"kh2-menuBackdrop\" id=\"kh2MenuBackdrop\"><\/div>\n\n    <div class=\"kh2-menuPanel\">\n      <div class=\"kh2-menuBox\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Menu\">\n        <div class=\"kh2-menuTop\">\n          <div class=\"kh2-menuTopLeft\">\n            <div class=\"kh2-logoBox\">K<\/div>\n            <div class=\"kh2-brandName\" style=\"color: rgba(11,18,32,.92);\">Kosma<\/div>\n          <\/div>\n\n          <button class=\"kh2-menuClose\" id=\"kh2MenuClose\" aria-label=\"Fermer le menu\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M6 6l12 12\"\/>\n              <path d=\"M18 6L6 18\"\/>\n            <\/svg>\n          <\/button>\n        <\/div>\n\n        <div class=\"kh2-menuList\">\n          <a class=\"kh2-menuItem\" href=\"#services\">Services<\/a>\n          <a class=\"kh2-menuItem\" href=\"#pourquoi\">Pourquoi nous<\/a>\n          <a class=\"kh2-menuItem\" href=\"#resultats\">R\u00e9sultats<\/a>\n          <a class=\"kh2-menuItem\" href=\"#processus\">Processus<\/a>\n          <a class=\"kh2-menuItem\" href=\"#contact\">Contact<\/a>\n        <\/div>\n\n        <div class=\"kh2-menuCtaWrap\">\n          <a class=\"kh2-menuCta\" href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n            Demandez votre audit gratuit\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n              <path d=\"M5 12h13\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n              <path d=\"M13 6l6 6-6 6\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <script>\n    (function(){\n      const sticky = document.getElementById('kh2Sticky');\n      const heroHeader = document.getElementById('kh2HeroHeader');\n      const burgerOpen = document.getElementById('kh2BurgerOpen');\n\n      const menu = document.getElementById('kh2Menu');\n      const menuClose = document.getElementById('kh2MenuClose');\n      const menuBackdrop = document.getElementById('kh2MenuBackdrop');\n\n      const onScroll = () => {\n        const showSticky = window.scrollY > 18;\n        if (showSticky){\n          sticky.classList.add('isOn');\n          if(heroHeader) heroHeader.style.opacity = \"0\";\n          if(burgerOpen) burgerOpen.style.pointerEvents = \"none\";\n        } else {\n          sticky.classList.remove('isOn');\n          if(heroHeader) heroHeader.style.opacity = \"1\";\n          if(burgerOpen) burgerOpen.style.pointerEvents = \"auto\";\n        }\n      };\n      onScroll();\n      window.addEventListener('scroll', onScroll, {passive:true});\n\n      function openMenu(){\n        menu.classList.add('isOpen');\n        menu.setAttribute('aria-hidden','false');\n        document.documentElement.style.overflow = 'hidden';\n      }\n      function closeMenu(){\n        menu.classList.remove('isOpen');\n        menu.setAttribute('aria-hidden','true');\n        document.documentElement.style.overflow = '';\n      }\n\n      if(burgerOpen) burgerOpen.addEventListener('click', openMenu);\n      if(menuClose) menuClose.addEventListener('click', closeMenu);\n      if(menuBackdrop) menuBackdrop.addEventListener('click', closeMenu);\n\n      document.addEventListener('keydown', (e) => {\n        if(e.key === 'Escape' && menu.classList.contains('isOpen')) closeMenu();\n      });\n\n      menu.querySelectorAll('a').forEach(a => a.addEventListener('click', closeMenu));\n    })();\n  <\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9ac634c e-con-full e-flex e-con e-parent\" data-id=\"9ac634c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e8613da elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"e8613da\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"kosma2\" id=\"problemes\">\n  <style>\n    .kosma2{\n      --ink:#0f172a;\n      --muted:#475569;\n      --muted2:#64748b;\n\n      --turq:#1aa7b8;\n      --ctaBlue:#2f8fe0;\n      --sun:#f6b21a;\n\n\n      --card:#ffffff;\n      --line: rgba(15,23,42,.08);\n      --shadow: 0 16px 36px rgba(15,23,42,.08);\n    }\n\n    .kosma2 *{box-sizing:border-box}\n    .kosma2 a{text-decoration:none}\n\n    \/* SECTION WRAP (ne pas faire \u201c2 sites\u201d) *\/\n    .kosma2 .k2-wrap{\n      background: #ffffff;\n      padding: 76px 26px 72px;\n    }\n\n    .kosma2 .k2-container{\n      max-width:1120px;\n      margin:0 auto;\n    }\n\n    .kosma2 .k2-title{\n      text-align:center;\n      margin:0 auto;\n      max-width: 980px;\n      color:var(--ink);\n      font-weight: 850;\n      letter-spacing:-1px;\n      line-height: 1.08;\n      font-size: clamp(30px, 4.2vw, 56px);\n    }\n\n    .kosma2 .k2-title .hot{\n  background: linear-gradient(\n    90deg,\n    rgba(245,158,11,.95) 0%,   \/* orange coucher de soleil *\/\n    rgba(246,178,26,.85) 70%,  \/* jaune doux *\/\n    rgba(255,211,95,.75) 100%\n  );\n  -webkit-background-clip: text;\n  background-clip: text;\n  color: transparent;\n  font-weight: 900;\n}\n\n    .kosma2 .k2-sub{\n      margin: 18px auto 0;\n      text-align:center;\n      max-width: 860px;\n      color: var(--muted);\n      font-size: clamp(15px, 1.25vw, 18px);\n      line-height: 1.7;\n      font-weight: 520;\n    }\n\n    .kosma2 .k2-sub .linkish{\n      color: var(--ctaBlue);\n      font-weight: 800;\n    }\n\n    \/* Info pill *\/\n    .kosma2 .k2-pill{\n      margin: 34px auto 0;\n      max-width: 920px;\n      display:flex;\n      align-items:center;\n      justify-content:center;\n      gap:12px;\n      padding: 16px 18px;\n      border-radius: 999px;\n      background: rgba(47,143,224,.08);\n      border: 1px solid rgba(47,143,224,.18);\n      color: #334155;\n      font-weight: 800;\n      text-align:center;\n    }\n\n    .kosma2 .k2-pill .icon{\n      width:38px;height:38px;border-radius:12px;\n      display:grid;place-items:center;\n      background: rgba(246,178,26,.18);\n      border: 1px solid rgba(246,178,26,.30);\n      flex: 0 0 auto;\n    }\n    .kosma2 .k2-pill svg{width:18px;height:18px;display:block}\n    .kosma2 .k2-pill strong{color:#0f172a}\n    .kosma2 .k2-pill span{color:#475569;font-weight:700}\n\n    \/* Grid cards *\/\n    .kosma2 .k2-grid{\n      margin-top: 42px;\n      display:grid;\n      grid-template-columns: repeat(2, minmax(0,1fr));\n      gap: 22px;\n    }\n\n    .kosma2 .k2-card{\n      background: var(--card);\n      border: 1px solid var(--line);\n      border-radius: 18px;\n      box-shadow: var(--shadow);\n      padding: 26px 24px;\n      min-height: 190px;\n      transition: transform .18s ease, box-shadow .18s ease;\n    }\n    .kosma2 .k2-card:hover{\n      transform: translateY(-3px);\n      box-shadow: 0 24px 56px rgba(15,23,42,.12);\n    }\n\n    .kosma2 .k2-cardTop{\n      display:flex;\n      align-items:flex-start;\n      gap:14px;\n      margin-bottom: 14px;\n    }\n\n    .kosma2 .k2-ic{\n      width:52px;height:52px;border-radius:16px;\n      display:grid;place-items:center;\n      background: rgba(239,68,68,.10);\n      border: 1px solid rgba(239,68,68,.18);\n      flex: 0 0 auto;\n    }\n    .kosma2 .k2-ic.alt1{ background: rgba(47,143,224,.10); border-color: rgba(47,143,224,.18); }\n    .kosma2 .k2-ic.alt2{ background: rgba(26,167,184,.12); border-color: rgba(26,167,184,.20); }\n    .kosma2 .k2-ic.alt3{ background: rgba(246,178,26,.14); border-color: rgba(246,178,26,.28); }\n    .kosma2 .k2-ic svg{width:22px;height:22px;display:block}\n\n    .kosma2 .k2-h3{\n      margin: 2px 0 0;\n      font-size: 18px;\n      font-weight: 900;\n      color: var(--ink);\n    }\n\n    .kosma2 .k2-p{\n      margin: 10px 0 0;\n      color: var(--muted2);\n      line-height: 1.7;\n      font-weight: 540;\n      font-size: 15px;\n    }\n\n    \/* Animations (entr\u00e9e + scroll) *\/\n    .kosma2 .reveal{\n      opacity: 0;\n      transform: translateY(18px);\n      transition: opacity .55s ease, transform .55s cubic-bezier(.2,.8,.2,1);\n      will-change: opacity, transform;\n    }\n    .kosma2 .reveal.in{\n      opacity: 1;\n      transform: translateY(0);\n    }\n\n    .kosma2 .stagger .reveal{ transition-delay: var(--d, 0ms); }\n\n    \/* Responsive *\/\n    @media(max-width: 860px){\n      .kosma2 .k2-wrap{ padding: 60px 18px 60px; }\n      .kosma2 .k2-grid{ grid-template-columns: 1fr; }\n      .kosma2 .k2-pill{ border-radius: 18px; } \/* sur mobile \u00e7a casse moins *\/\n    }\n  <\/style>\n\n  <section class=\"k2-wrap\">\n    <div class=\"k2-container\">\n      <h2 class=\"k2-title reveal\">\n        Vous perdez des clients \u00e0 cause de <span class=\"hot\">campagnes inefficaces<\/span> ?\n      <\/h2>\n\n      <p class=\"k2-sub reveal\" style=\"--d:120ms\">\n        De nombreuses entreprises peinent \u00e0 convertir leurs visiteurs en clients.\n        Emails qui n'ouvrent pas, sites qui ne vendent pas, SEO inexistant \u2026\n        <span class=\"linkish\">Nous comprenons vos frustrations et avons la solution.<\/span>\n      <\/p>\n\n      <div class=\"k2-pill reveal\" style=\"--d:180ms\">\n        <div class=\"icon\" aria-hidden=\"true\">\n          <!-- ampoule -->\n          <svg viewBox=\"0 0 24 24\" fill=\"none\">\n            <path d=\"M9 18h6M10 21h4\" stroke=\"#0f172a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n            <path d=\"M12 3a7 7 0 0 0-4 12c.6.5 1 1.2 1 2h6c0-.8.4-1.5 1-2A7 7 0 0 0 12 3Z\"\n                  stroke=\"#0f172a\" stroke-width=\"2\" stroke-linejoin=\"round\"\/>\n          <\/svg>\n        <\/div>\n        <div>\n          <strong>Bonne nouvelle :<\/strong>\n          <span>Nous avons r\u00e9solu ces probl\u00e8mes pour +150 entreprises<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"k2-grid stagger\">\n        <!-- Card 1 -->\n        <div class=\"k2-card reveal\" style=\"--d:120ms\">\n          <div class=\"k2-cardTop\">\n            <div class=\"k2-ic alt1\" aria-hidden=\"true\">\n              <!-- users -->\n              <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                <path d=\"M16 11a4 4 0 1 0-8 0\" stroke=\"#2f8fe0\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n                <path d=\"M4 21c.8-4 3.9-6 8-6s7.2 2 8 6\" stroke=\"#2f8fe0\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n              <\/svg>\n            <\/div>\n            <div>\n              <div class=\"k2-h3\">Manque de leads qualifi\u00e9s<\/div>\n              <div class=\"k2-p\">Votre pipeline est vide et vous passez plus de temps \u00e0 chercher des clients qu\u2019\u00e0 les servir.<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <!-- Card 2 -->\n        <div class=\"k2-card reveal\" style=\"--d:180ms\">\n          <div class=\"k2-cardTop\">\n            <div class=\"k2-ic\" aria-hidden=\"true\">\n              <!-- trend down -->\n              <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                <path d=\"M4 7v13h16\" stroke=\"#ef4444\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n                <path d=\"M7 10l4 4 4-4 4 4\" stroke=\"#ef4444\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n              <\/svg>\n            <\/div>\n            <div>\n              <div class=\"k2-h3\">Taux de conversion trop bas<\/div>\n              <div class=\"k2-p\">Beaucoup de visiteurs, peu de ventes. Votre site attire du monde mais ne convertit pas.<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <!-- Card 3 -->\n        <div class=\"k2-card reveal\" style=\"--d:240ms\">\n          <div class=\"k2-cardTop\">\n            <div class=\"k2-ic alt2\" aria-hidden=\"true\">\n              <!-- mail -->\n              <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                <path d=\"M4 7h16v10H4V7Z\" stroke=\"#1aa7b8\" stroke-width=\"2\" stroke-linejoin=\"round\"\/>\n                <path d=\"M4 7l8 6 8-6\" stroke=\"#1aa7b8\" stroke-width=\"2\" stroke-linejoin=\"round\"\/>\n              <\/svg>\n            <\/div>\n            <div>\n              <div class=\"k2-h3\">Emails ignor\u00e9s<\/div>\n              <div class=\"k2-p\">Vos campagnes finissent dans les spams ou restent non ouvertes. Z\u00e9ro engagement, z\u00e9ro r\u00e9sultat.<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <!-- Card 4 -->\n        <div class=\"k2-card reveal\" style=\"--d:300ms\">\n          <div class=\"k2-cardTop\">\n            <div class=\"k2-ic alt3\" aria-hidden=\"true\">\n              <!-- globe -->\n              <svg viewBox=\"0 0 24 24\" fill=\"none\">\n                <path d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z\" stroke=\"#f6b21a\" stroke-width=\"2\"\/>\n                <path d=\"M3 12h18\" stroke=\"#f6b21a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n                <path d=\"M12 3c3 3 3 15 0 18\" stroke=\"#f6b21a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n                <path d=\"M12 3c-3 3-3 15 0 18\" stroke=\"#f6b21a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n              <\/svg>\n            <\/div>\n            <div>\n              <div class=\"k2-h3\">Invisible sur Google<\/div>\n              <div class=\"k2-p\">Vos concurrents apparaissent en premier. Vous, vous \u00eates introuvable par vos clients potentiels.<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <script>\n    (function(){\n      const root = document.querySelector('.kosma2');\n      if(!root) return;\n\n      const els = root.querySelectorAll('.reveal');\n\n      \/\/ Respect \u201cprefers-reduced-motion\u201d\n      const reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n      if(reduce){\n        els.forEach(el=>el.classList.add('in'));\n        return;\n      }\n\n      const io = new IntersectionObserver((entries)=>{\n        entries.forEach(entry=>{\n          if(entry.isIntersecting){\n            entry.target.classList.add('in');\n            io.unobserve(entry.target);\n          }\n        });\n      }, {threshold: 0.12, rootMargin: '0px 0px -10% 0px'});\n\n      els.forEach(el=>{\n        const d = el.style.getPropertyValue('--d');\n        if(d) el.style.transitionDelay = d;\n        io.observe(el);\n      });\n    })();\n  <\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-14c304b e-con-full e-flex e-con e-parent\" data-id=\"14c304b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ba7172d elementor-widget elementor-widget-html\" data-id=\"ba7172d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"kosma3\" id=\"services\">\n  <style>\n    .kosma3{\n      --ink:#0f172a;\n      --muted:#64748b;\n\n      --turq:#1aa7b8;\n      --ctaBlue:#2f8fe0;\n      --sun:#f6b21a;\n\n      --card:#ffffff;\n      --line:rgba(15,23,42,.08);\n      --shadow:0 18px 40px rgba(15,23,42,.08);\n    }\n\n    .kosma3 *{box-sizing:border-box}\n\n    .kosma3 .k3-wrap{\n      background:#f9fbfd;\n      padding:80px 26px 90px;\n    }\n\n    .kosma3 .k3-container{\n      max-width:1120px;\n      margin:0 auto;\n    }\n\n    .kosma3 .k3-title{\n      text-align:center;\n      font-weight:850;\n      font-size:clamp(30px,4.2vw,54px);\n      letter-spacing:-1px;\n      color:var(--ink);\n      margin:0;\n    }\n\n    .kosma3 .k3-sub{\n      text-align:center;\n      margin:18px auto 0;\n      max-width:820px;\n      color:var(--muted);\n      font-size:17px;\n      line-height:1.7;\n      font-weight:520;\n    }\n\n    .kosma3 .k3-grid{\n      margin-top:48px;\n      display:grid;\n      grid-template-columns:repeat(4,minmax(0,1fr));\n      gap:24px;\n    }\n\n    .kosma3 .k3-card{\n      background:var(--card);\n      border:1px solid var(--line);\n      border-radius:20px;\n      padding:30px 24px;\n      box-shadow:var(--shadow);\n      transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;\n      position:relative;\n    }\n\n    .kosma3 .k3-card:hover{\n      transform:translateY(-4px);\n      box-shadow:0 26px 60px rgba(15,23,42,.12);\n      border-color:rgba(47,143,224,.25);\n    }\n\n    \/* Priorit\u00e9 visuelle *\/\n    .kosma3 .k3-card.priority{\n      border:1px solid rgba(47,143,224,.25);\n      box-shadow:0 22px 50px rgba(47,143,224,.12);\n    }\n\n    .kosma3 .k3-badge{\n      position:absolute;\n      top:16px;\n      right:16px;\n      font-size:11px;\n      font-weight:800;\n      padding:6px 10px;\n      border-radius:999px;\n      background:linear-gradient(90deg,var(--ctaBlue),var(--turq));\n      color:#fff;\n      letter-spacing:.5px;\n    }\n\n    .kosma3 .k3-icon{\n      width:60px;\n      height:60px;\n      border-radius:16px;\n      display:grid;\n      place-items:center;\n      margin-bottom:18px;\n      background:rgba(47,143,224,.10);\n      border:1px solid rgba(47,143,224,.18);\n    }\n\n    .kosma3 .k3-icon.alt{\n      background:rgba(246,178,26,.14);\n      border-color:rgba(246,178,26,.28);\n    }\n\n    .kosma3 .k3-icon svg{\n      width:26px;\n      height:26px;\n    }\n\n    .kosma3 .k3-h3{\n      font-size:19px;\n      font-weight:900;\n      color:var(--ink);\n      margin:0;\n    }\n\n    .kosma3 .k3-p{\n      margin:12px 0 0;\n      color:var(--muted);\n      line-height:1.7;\n      font-size:15px;\n      font-weight:520;\n    }\n\n    \/* Animations *\/\n    .kosma3 .reveal{\n      opacity:0;\n      transform:translateY(20px);\n      transition:opacity .6s ease, transform .6s cubic-bezier(.2,.8,.2,1);\n    }\n\n    .kosma3 .reveal.in{\n      opacity:1;\n      transform:translateY(0);\n    }\n\n    \/* Responsive *\/\n    @media(max-width:1100px){\n      .kosma3 .k3-grid{\n        grid-template-columns:repeat(2,1fr);\n      }\n    }\n\n    @media(max-width:700px){\n      .kosma3 .k3-wrap{padding:60px 18px 70px;}\n      .kosma3 .k3-grid{\n        grid-template-columns:1fr;\n      }\n    }\n  <\/style>\n\n  <section class=\"k3-wrap\">\n    <div class=\"k3-container\">\n\n      <h2 class=\"k3-title reveal\">\n        Nos expertises pour acc\u00e9l\u00e9rer votre croissance\n      <\/h2>\n\n      <p class=\"k3-sub reveal\" style=\"transition-delay:120ms\">\n        Nous combinons strat\u00e9gie, design et performance pour transformer votre pr\u00e9sence en ligne en v\u00e9ritable machine d\u2019acquisition.\n      <\/p>\n\n      <div class=\"k3-grid\">\n\n        <!-- SEO -->\n        <div class=\"k3-card priority reveal\" style=\"transition-delay:180ms\">\n          <div class=\"k3-badge\">TOP<\/div>\n          <div class=\"k3-icon\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M21 21l-4.3-4.3M10 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16Z\"\n                stroke=\"#2f8fe0\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k3-h3\">SEO strat\u00e9gique<\/h3>\n          <p class=\"k3-p\">\n            Positionnez-vous en t\u00eate sur Google et attirez des prospects qualifi\u00e9s gr\u00e2ce \u00e0 une strat\u00e9gie SEO durable et orient\u00e9e ROI.\n          <\/p>\n        <\/div>\n\n        <!-- Site Web -->\n        <div class=\"k3-card priority reveal\" style=\"transition-delay:240ms\">\n          <div class=\"k3-badge\">TOP<\/div>\n          <div class=\"k3-icon\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"2\"\n                stroke=\"#2f8fe0\" stroke-width=\"2\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k3-h3\">Cr\u00e9ation de site web<\/h3>\n          <p class=\"k3-p\">\n            Des sites modernes, rapides et optimis\u00e9s conversion pour transformer vos visiteurs en clients.\n          <\/p>\n        <\/div>\n\n        <!-- Email -->\n        <div class=\"k3-card reveal\" style=\"transition-delay:300ms\">\n          <div class=\"k3-icon alt\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M4 7h16v10H4V7Z\"\n                stroke=\"#f6b21a\" stroke-width=\"2\"\/>\n              <path d=\"M4 7l8 6 8-6\"\n                stroke=\"#f6b21a\" stroke-width=\"2\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k3-h3\">Email marketing<\/h3>\n          <p class=\"k3-p\">\n            Automatisez vos ventes et augmentez la valeur client gr\u00e2ce \u00e0 des s\u00e9quences email performantes.\n          <\/p>\n        <\/div>\n\n        <!-- Copy -->\n        <div class=\"k3-card reveal\" style=\"transition-delay:360ms\">\n          <div class=\"k3-icon alt\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01\"\n                stroke=\"#f6b21a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k3-h3\">Copywriting<\/h3>\n          <p class=\"k3-p\">\n            Des messages percutants qui captivent votre audience et d\u00e9clenchent l\u2019action.\n          <\/p>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <script>\n    (function(){\n      const root = document.querySelector('.kosma3');\n      if(!root) return;\n\n      const els = root.querySelectorAll('.reveal');\n\n      const io = new IntersectionObserver((entries)=>{\n        entries.forEach(entry=>{\n          if(entry.isIntersecting){\n            entry.target.classList.add('in');\n            io.unobserve(entry.target);\n          }\n        });\n      },{threshold:0.15});\n\n      els.forEach(el=>io.observe(el));\n    })();\n  <\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bc0184f e-con-full e-flex e-con e-parent\" data-id=\"bc0184f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-875871b elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"875871b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"kosma4\" id=\"pourquoi\">\n  <style>\n    .kosma4{\n      --ink:#0f172a;\n      --muted:#64748b;\n\n      --turq:#1aa7b8;\n      --ctaBlue:#2f8fe0;\n      --sun:#f6b21a;\n\n      --bgSoft:#ffffff;\n      --line:rgba(15,23,42,.08);\n      --shadow:0 18px 40px rgba(15,23,42,.08);\n    }\n\n    .kosma4 *{box-sizing:border-box}\n\n    .kosma4 .k4-wrap{\n      background: var(--bgSoft);\n      padding: 90px 26px 100px;\n    }\n\n    .kosma4 .k4-container{\n      max-width:1120px;\n      margin:0 auto;\n    }\n\n    .kosma4 .k4-title{\n      text-align:center;\n      font-weight:850;\n      font-size:clamp(30px,4.2vw,54px);\n      letter-spacing:-1px;\n      margin:0;\n      color:var(--ink);\n    }\n\n    .kosma4 .k4-title .accent{\n      background: linear-gradient(\n        90deg,\n        rgba(26,167,184,.95),\n        rgba(246,178,26,.85)\n      );\n      -webkit-background-clip:text;\n      background-clip:text;\n      color:transparent;\n    }\n\n    .kosma4 .k4-sub{\n      text-align:center;\n      margin:18px auto 0;\n      max-width:820px;\n      color:var(--muted);\n      font-size:17px;\n      line-height:1.7;\n      font-weight:520;\n    }\n\n    .kosma4 .k4-grid{\n      margin-top:60px;\n      display:grid;\n      grid-template-columns:repeat(4,minmax(0,1fr));\n      gap:28px;\n    }\n\n    .kosma4 .k4-card{\n      background:#fff;\n      border:1px solid var(--line);\n      border-radius:20px;\n      padding:28px 24px;\n      box-shadow:var(--shadow);\n      transition:transform .2s ease, box-shadow .2s ease;\n    }\n\n    .kosma4 .k4-card:hover{\n      transform:translateY(-4px);\n      box-shadow:0 26px 60px rgba(15,23,42,.12);\n    }\n\n    .kosma4 .k4-icon{\n      width:60px;\n      height:60px;\n      border-radius:16px;\n      display:grid;\n      place-items:center;\n      margin-bottom:18px;\n      background:rgba(47,143,224,.10);\n      border:1px solid rgba(47,143,224,.18);\n    }\n\n    .kosma4 .k4-icon.alt{\n      background:rgba(246,178,26,.15);\n      border-color:rgba(246,178,26,.30);\n    }\n\n    .kosma4 .k4-icon svg{\n      width:26px;\n      height:26px;\n    }\n\n    .kosma4 .k4-h3{\n      font-size:18px;\n      font-weight:900;\n      color:var(--ink);\n      margin:0;\n    }\n\n    .kosma4 .k4-p{\n      margin:12px 0 0;\n      color:var(--muted);\n      line-height:1.7;\n      font-size:15px;\n      font-weight:520;\n    }\n\n    \/* CTA discret *\/\n    .kosma4 .k4-cta{\n      margin-top:60px;\n      text-align:center;\n    }\n\n    .kosma4 .k4-cta a{\n      display:inline-flex;\n      align-items:center;\n      gap:10px;\n      padding:14px 24px;\n      border-radius:999px;\n      font-weight:900;\n      color:#fff;\n      background:linear-gradient(90deg,var(--ctaBlue),var(--turq));\n      box-shadow:0 14px 30px rgba(15,23,42,.15);\n      transition:.2s ease;\n    }\n\n    .kosma4 .k4-cta a:hover{\n      transform:translateY(-2px);\n    }\n\n    \/* Animations *\/\n    .kosma4 .reveal{\n      opacity:0;\n      transform:translateY(20px);\n      transition:opacity .6s ease, transform .6s cubic-bezier(.2,.8,.2,1);\n    }\n\n    .kosma4 .reveal.in{\n      opacity:1;\n      transform:translateY(0);\n    }\n\n    \/* Responsive *\/\n    @media(max-width:1100px){\n      .kosma4 .k4-grid{\n        grid-template-columns:repeat(2,1fr);\n      }\n    }\n\n    @media(max-width:700px){\n      .kosma4 .k4-wrap{\n        padding:60px 18px 70px;\n      }\n      .kosma4 .k4-grid{\n        grid-template-columns:1fr;\n      }\n    }\n  <\/style>\n\n  <section class=\"k4-wrap\">\n    <div class=\"k4-container\">\n\n      <h2 class=\"k4-title reveal\">\n        Pourquoi choisir <span class=\"accent\">Kosma Agency<\/span> ?\n      <\/h2>\n\n      <p class=\"k4-sub reveal\" style=\"transition-delay:120ms\">\n        Nous accompagnons les entreprises francophones en Espagne avec une approche strat\u00e9gique,\n        orient\u00e9e performance et r\u00e9sultats mesurables.\n      <\/p>\n\n      <div class=\"k4-grid\">\n\n        <div class=\"k4-card reveal\" style=\"transition-delay:180ms\">\n          <div class=\"k4-icon\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z\"\n                stroke=\"#2f8fe0\" stroke-width=\"2\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k4-h3\">Expertise march\u00e9 francophone Espagne<\/h3>\n          <p class=\"k4-p\">\n            Nous comprenons les enjeux culturels et \u00e9conomiques des francophones install\u00e9s en Espagne.\n          <\/p>\n        <\/div>\n\n        <div class=\"k4-card reveal\" style=\"transition-delay:240ms\">\n          <div class=\"k4-icon alt\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M4 20h16M6 16l4-4 4 4 4-8\"\n                stroke=\"#f6b21a\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k4-h3\">Strat\u00e9gie avant design<\/h3>\n          <p class=\"k4-p\">\n            Chaque site et chaque action marketing sont pens\u00e9s pour g\u00e9n\u00e9rer du chiffre d\u2019affaires.\n          <\/p>\n        <\/div>\n\n        <div class=\"k4-card reveal\" style=\"transition-delay:300ms\">\n          <div class=\"k4-icon\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M3 12h18M12 3v18\"\n                stroke=\"#2f8fe0\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k4-h3\">Performance mesurable<\/h3>\n          <p class=\"k4-p\">\n            Trafic, conversion, ROI : nous travaillons avec des indicateurs concrets et mesurables.\n          <\/p>\n        <\/div>\n\n        <div class=\"k4-card reveal\" style=\"transition-delay:360ms\">\n          <div class=\"k4-icon alt\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M12 21c4-4 8-7 8-11a8 8 0 1 0-16 0c0 4 4 7 8 11Z\"\n                stroke=\"#f6b21a\" stroke-width=\"2\"\/>\n            <\/svg>\n          <\/div>\n          <h3 class=\"k4-h3\">Accompagnement personnalis\u00e9<\/h3>\n          <p class=\"k4-p\">\n            Un interlocuteur d\u00e9di\u00e9, une strat\u00e9gie adapt\u00e9e et un suivi constant.\n          <\/p>\n        <\/div>\n\n      <\/div>\n\n      <div class=\"k4-cta reveal\" style=\"transition-delay:420ms\">\n        <a href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n          Discuter de votre projet \u2192\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <script>\n    (function(){\n      const root = document.querySelector('.kosma4');\n      if(!root) return;\n\n      const els = root.querySelectorAll('.reveal');\n\n      const io = new IntersectionObserver((entries)=>{\n        entries.forEach(entry=>{\n          if(entry.isIntersecting){\n            entry.target.classList.add('in');\n            io.unobserve(entry.target);\n          }\n        });\n      },{threshold:0.15});\n\n      els.forEach(el=>io.observe(el));\n    })();\n  <\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a9a91f7 e-con-full e-flex e-con e-parent\" data-id=\"a9a91f7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d88bd9 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"1d88bd9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"kosma5\" id=\"resultats\">\n  <style>\n    .kosma5{\n      --ink:#0f172a;\n      --muted:#64748b;\n\n      --turq:#1aa7b8;\n      --ctaBlue:#2f8fe0;\n      --sun:#f6b21a;\n\n      --bg:#f4f8fc;\n      --card:#ffffff;\n      --shadow:0 20px 50px rgba(15,23,42,.08);\n    }\n\n    .kosma5 *{box-sizing:border-box}\n\n    .kosma5 .k5-wrap{\n      background:var(--bg);\n      padding:100px 26px;\n    }\n\n    .kosma5 .k5-container{\n      max-width:1120px;\n      margin:0 auto;\n    }\n\n    .kosma5 .k5-title{\n      text-align:center;\n      font-size:clamp(30px,4vw,54px);\n      font-weight:850;\n      color:var(--ink);\n      margin:0;\n      letter-spacing:-1px;\n    }\n\n    .kosma5 .k5-title .accent{\n      background:linear-gradient(\n        90deg,\n        rgba(26,167,184,.95),\n        rgba(246,178,26,.85)\n      );\n      -webkit-background-clip:text;\n      background-clip:text;\n      color:transparent;\n    }\n\n    .kosma5 .k5-sub{\n      text-align:center;\n      margin:18px auto 0;\n      max-width:780px;\n      color:var(--muted);\n      font-size:17px;\n      line-height:1.7;\n    }\n\n    \/* Big stats *\/\n    .kosma5 .k5-stats{\n      margin-top:60px;\n      display:grid;\n      grid-template-columns:repeat(3,1fr);\n      gap:30px;\n      text-align:center;\n    }\n\n    .kosma5 .k5-stat strong{\n      font-size:48px;\n      font-weight:900;\n      display:block;\n      background:linear-gradient(90deg,var(--ctaBlue),var(--turq));\n      -webkit-background-clip:text;\n      background-clip:text;\n      color:transparent;\n    }\n\n    .kosma5 .k5-stat span{\n      margin-top:10px;\n      display:block;\n      color:var(--muted);\n      font-weight:600;\n    }\n\n    \/* Case cards *\/\n    .kosma5 .k5-cases{\n      margin-top:70px;\n      display:grid;\n      grid-template-columns:repeat(2,1fr);\n      gap:28px;\n    }\n\n    .kosma5 .k5-card{\n      background:var(--card);\n      border-radius:20px;\n      padding:28px;\n      box-shadow:var(--shadow);\n      transition:transform .2s ease;\n    }\n\n    .kosma5 .k5-card:hover{\n      transform:translateY(-4px);\n    }\n\n    .kosma5 .k5-h3{\n      font-size:18px;\n      font-weight:900;\n      color:var(--ink);\n      margin:0;\n    }\n\n    .kosma5 .k5-p{\n      margin-top:12px;\n      color:var(--muted);\n      line-height:1.7;\n      font-size:15px;\n    }\n\n    .kosma5 .k5-highlight{\n      margin-top:18px;\n      font-weight:900;\n      color:#0f172a;\n    }\n\n    \/* CTA *\/\n    .kosma5 .k5-cta{\n      margin-top:80px;\n      text-align:center;\n    }\n\n    .kosma5 .k5-cta a{\n      display:inline-flex;\n      align-items:center;\n      gap:10px;\n      padding:16px 28px;\n      border-radius:999px;\n      font-weight:900;\n      color:#fff;\n      background:linear-gradient(90deg,var(--ctaBlue),var(--turq));\n      box-shadow:0 16px 40px rgba(15,23,42,.15);\n      transition:.2s ease;\n    }\n\n    .kosma5 .k5-cta a:hover{\n      transform:translateY(-3px);\n    }\n\n    \/* Animations *\/\n    .kosma5 .reveal{\n      opacity:0;\n      transform:translateY(20px);\n      transition:opacity .6s ease, transform .6s cubic-bezier(.2,.8,.2,1);\n    }\n\n    .kosma5 .reveal.in{\n      opacity:1;\n      transform:translateY(0);\n    }\n\n    \/* Responsive *\/\n    @media(max-width:900px){\n      .kosma5 .k5-stats{\n        grid-template-columns:1fr;\n        gap:40px;\n      }\n\n      .kosma5 .k5-cases{\n        grid-template-columns:1fr;\n      }\n\n      .kosma5 .k5-wrap{\n        padding:70px 18px;\n      }\n    }\n  <\/style>\n\n  <section class=\"k5-wrap\">\n    <div class=\"k5-container\">\n\n      <h2 class=\"k5-title reveal\">\n        Des r\u00e9sultats <span class=\"accent\">concrets et mesurables<\/span>\n      <\/h2>\n\n      <p class=\"k5-sub reveal\" style=\"transition-delay:120ms\">\n        Notre approche strat\u00e9gique permet \u00e0 nos clients d\u2019augmenter leur visibilit\u00e9,\n        leurs leads et leur chiffre d\u2019affaires.\n      <\/p>\n\n      <div class=\"k5-stats\">\n        <div class=\"k5-stat reveal\" style=\"transition-delay:180ms\">\n          <strong>+210%<\/strong>\n          <span>Augmentation moyenne du trafic SEO<\/span>\n        <\/div>\n\n        <div class=\"k5-stat reveal\" style=\"transition-delay:240ms\">\n          <strong>+68%<\/strong>\n          <span>Am\u00e9lioration du taux de conversion<\/span>\n        <\/div>\n\n        <div class=\"k5-stat reveal\" style=\"transition-delay:300ms\">\n          <strong>+35%<\/strong>\n          <span>Hausse moyenne du chiffre d\u2019affaires<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"k5-cases\">\n        <div class=\"k5-card reveal\" style=\"transition-delay:360ms\">\n          <h3 class=\"k5-h3\">Cabinet de coaching \u2013 Espagne<\/h3>\n          <p class=\"k5-p\">\n            Refonte compl\u00e8te du site + strat\u00e9gie SEO locale.\n          <\/p>\n          <div class=\"k5-highlight\">\n            R\u00e9sultat : +120% de demandes en 6 mois.\n          <\/div>\n        <\/div>\n\n        <div class=\"k5-card reveal\" style=\"transition-delay:420ms\">\n          <h3 class=\"k5-h3\">E-commerce bien-\u00eatre<\/h3>\n          <p class=\"k5-p\">\n            Optimisation conversion + s\u00e9quences email automatis\u00e9es.\n          <\/p>\n          <div class=\"k5-highlight\">\n            R\u00e9sultat : +47% de ventes en 4 mois.\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"k5-cta reveal\" style=\"transition-delay:480ms\">\n        <a href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n          R\u00e9server un audit strat\u00e9gique \u2192\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <script>\n    (function(){\n      const root = document.querySelector('.kosma5');\n      if(!root) return;\n\n      const els = root.querySelectorAll('.reveal');\n\n      const io = new IntersectionObserver((entries)=>{\n        entries.forEach(entry=>{\n          if(entry.isIntersecting){\n            entry.target.classList.add('in');\n            io.unobserve(entry.target);\n          }\n        });\n      },{threshold:0.15});\n\n      els.forEach(el=>io.observe(el));\n    })();\n  <\/script>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-310bb8e e-con-full e-flex e-con e-parent\" data-id=\"310bb8e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c4e3bbc elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"c4e3bbc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =======================\n     CODE 6 \u2014 Processus (3 \u00e9tapes)\n     Colle tout dans 1 widget HTML Elementor\n======================= -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800;900&display=swap\" rel=\"stylesheet\">\n\n<section class=\"k6-wrap\" id=\"processus\">\n  <div class=\"k6-container\">\n\n    <div class=\"k6-head\">\n      <div class=\"k6-pill\">\n        <span class=\"k6-pill-ico\">\ud83d\udd52<\/span>\n        <span>Notre Processus<\/span>\n      <\/div>\n\n      <h2 class=\"k6-title\">\n        Notre m\u00e9thode en 3\n        <span class=\"k6-grad\">\u00e9tapes simples<\/span>\n      <\/h2>\n\n      <p class=\"k6-sub\">\n        Un processus clair, transparent et \u00e9prouv\u00e9 pour transformer votre marketing digital.\n      <\/p>\n    <\/div>\n\n    <!-- \u00c9TAPE 01 (ouverte) -->\n    <article class=\"k6-card k6-card--open\" data-step=\"1\">\n      <header class=\"k6-cardTop\">\n        <div class=\"k6-icobox\">\n          <span class=\"k6-ico\">\ud83d\udd0e<\/span>\n        <\/div>\n\n        <div class=\"k6-topText\">\n          <div class=\"k6-stepLabel\">\u00c9TAPE 01<\/div>\n          <div class=\"k6-stepTitle\">Audit et compr\u00e9hension de vos besoins<\/div>\n        <\/div>\n\n        <div class=\"k6-topRight\">\n          <div class=\"k6-timeBadge\">\n            <span class=\"k6-timeIco\">\ud83d\udd52<\/span>\n            <span>Gratuit \u2014 30 min<\/span>\n          <\/div>\n\n          <!-- Fl\u00e8che DOIT pointer vers le haut -->\n          <button class=\"k6-toggle\" type=\"button\" aria-label=\"R\u00e9duire l'\u00e9tape 01\" aria-expanded=\"true\">\n            <span class=\"k6-chevron k6-chevron--up\">\u2191<\/span>\n          <\/button>\n        <\/div>\n      <\/header>\n\n      <div class=\"k6-body\">\n        <div class=\"k6-bodyGrid\">\n          <div class=\"k6-left\">\n            <p class=\"k6-par\">\n              Nous analysons votre situation actuelle, vos objectifs et vos d\u00e9fis.\n              Un \u00e9change approfondi pour comprendre votre business et identifier les opportunit\u00e9s de croissance.\n            <\/p>\n\n            <!-- R\u00c9DUIT LES BLANCS: le livrable remonte -->\n            <div class=\"k6-deliverable\">\n              <span class=\"k6-check\">\u2713<\/span>\n              <span><strong>Livrable :<\/strong> Rapport d\u2019audit personnalis\u00e9<\/span>\n            <\/div>\n          <\/div>\n\n          <div class=\"k6-right\">\n            <div class=\"k6-rightTitle\">Ce qu\u2019on fait concr\u00e8tement :<\/div>\n            <ul class=\"k6-list\">\n              <li><span class=\"k6-dot\">\u2713<\/span> Analyse de vos emails &amp; site actuel<\/li>\n              <li><span class=\"k6-dot\">\u2713<\/span> Identification des points de friction<\/li>\n              <li><span class=\"k6-dot\">\u2713<\/span> Benchmark concurrentiel rapide<\/li>\n              <li><span class=\"k6-dot\">\u2713<\/span> D\u00e9finition de vos KPIs prioritaires<\/li>\n            <\/ul>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/article>\n\n    <!-- \u00c9TAPE 02 (ferm\u00e9e) -->\n    <article class=\"k6-card k6-card--closed\" data-step=\"2\">\n      <header class=\"k6-cardTop\">\n        <div class=\"k6-icobox k6-icobox--muted\">\n          <span class=\"k6-ico\">\ud83d\udca1<\/span>\n        <\/div>\n\n        <div class=\"k6-topText\">\n          <div class=\"k6-stepLabel k6-stepLabel--muted\">\u00c9TAPE 02<\/div>\n          <div class=\"k6-stepTitle k6-stepTitle--muted\">Strat\u00e9gie personnalis\u00e9e et cr\u00e9ation de contenu<\/div>\n        <\/div>\n\n        <div class=\"k6-topRight\">\n          <div class=\"k6-timeBadge k6-timeBadge--muted\">\n            <span class=\"k6-timeIco\">\ud83d\udd52<\/span>\n            <span>48\u201372h<\/span>\n          <\/div>\n\n          <button class=\"k6-toggle k6-toggle--muted\" type=\"button\" aria-label=\"Ouvrir l'\u00e9tape 02\" aria-expanded=\"false\">\n            <span class=\"k6-chevron\">\u2193<\/span>\n          <\/button>\n        <\/div>\n      <\/header>\n    <\/article>\n\n    <!-- \u00c9TAPE 03 (ferm\u00e9e) -->\n    <article class=\"k6-card k6-card--closed\" data-step=\"3\">\n      <header class=\"k6-cardTop\">\n        <div class=\"k6-icobox k6-icobox--muted\">\n          <span class=\"k6-ico\">\ud83d\udcca<\/span>\n        <\/div>\n\n        <div class=\"k6-topText\">\n          <div class=\"k6-stepLabel k6-stepLabel--muted\">\u00c9TAPE 03<\/div>\n          <div class=\"k6-stepTitle k6-stepTitle--muted\">Suivi, optimisation et r\u00e9sultats mesurables<\/div>\n        <\/div>\n\n        <div class=\"k6-topRight\">\n          <div class=\"k6-timeBadge k6-timeBadge--muted\">\n            <span class=\"k6-timeIco\">\ud83d\udd52<\/span>\n            <span>En continu<\/span>\n          <\/div>\n\n          <button class=\"k6-toggle k6-toggle--muted\" type=\"button\" aria-label=\"Ouvrir l'\u00e9tape 03\" aria-expanded=\"false\">\n            <span class=\"k6-chevron\">\u2193<\/span>\n          <\/button>\n        <\/div>\n      <\/header>\n    <\/article>\n\n    <!-- 3 mini-cadres (emoji ic\u00f4nes) -->\n    <div class=\"k6-miniRow\">\n      <div class=\"k6-mini\">\n        <div class=\"k6-miniIco\">\ud83c\udf81<\/div>\n        <div class=\"k6-miniTxt\">\n          <div class=\"k6-miniTop\">Appel d\u00e9couverte<\/div>\n          <div class=\"k6-miniStrong\">Gratuit<\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"k6-mini\">\n        <div class=\"k6-miniIco\">\u26a1<\/div>\n        <div class=\"k6-miniTxt\">\n          <div class=\"k6-miniTop\">Premiers r\u00e9sultats<\/div>\n          <div class=\"k6-miniStrong\">30 jours<\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"k6-mini\">\n        <div class=\"k6-miniIco\">\ud83d\udcc8<\/div>\n        <div class=\"k6-miniTxt\">\n          <div class=\"k6-miniTop\">ROI moyen constat\u00e9<\/div>\n          <div class=\"k6-miniStrong\">3.2x<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<style>\n  :root{\n    --k6-bg: #ffffff;\n    --k6-text: #0f172a;\n    --k6-muted: rgba(15, 23, 42, .65);\n\n    \/* BLEU plus \u201ccolor\u00e9\u201d (moins p\u00e2le) *\/\n    --k6-blue: #00B6E6;         \/* accent *\/\n    --k6-blue-2: #0097D3;       \/* ombres\/CTA *\/\n    --k6-blue-soft: rgba(0, 182, 230, .16);\n\n    --k6-border: rgba(15, 23, 42, .10);\n    --k6-cardShadow: 0 14px 40px rgba(15,23,42,.08);\n    --k6-softShadow: 0 10px 24px rgba(15,23,42,.06);\n\n    --k6-radius: 22px;\n  }\n\n  .k6-wrap{\n    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;\n    background: var(--k6-bg);\n    padding: clamp(38px, 5vw, 70px) 0 clamp(40px, 6vw, 84px);\n  }\n\n  .k6-container{\n    width: min(1160px, calc(100% - 40px));\n    margin: 0 auto;\n  }\n\n  \/* Head *\/\n  .k6-head{\n    text-align: center;\n    margin-bottom: 26px;\n  }\n  .k6-pill{\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    padding: 10px 16px;\n    border-radius: 999px;\n    border: 1px solid rgba(255, 170, 0, .55);\n    background: rgba(255, 170, 0, .08);\n    color: #ff8a00;\n    font-weight: 600;\n    font-size: 14px;\n  }\n  .k6-pill-ico{ font-size: 16px; }\n\n  .k6-title{\n    margin: 18px auto 8px;\n    font-weight: 900;\n    letter-spacing: -0.03em;\n    line-height: 1.06;\n    font-size: clamp(34px, 4.6vw, 56px);\n    color: var(--k6-text);\n  }\n  .k6-grad{\n    background: linear-gradient(90deg, #00B6E6 0%, #18C7A0 55%, #F6B100 100%);\n    -webkit-background-clip: text;\n    background-clip: text;\n    color: transparent;\n  }\n  .k6-sub{\n    max-width: 760px;\n    margin: 0 auto;\n    font-size: clamp(15px, 1.25vw, 18px);\n    color: rgba(15,23,42,.62);\n    line-height: 1.65;\n  }\n\n  \/* Cards *\/\n  .k6-card{\n    border-radius: var(--k6-radius);\n    border: 2px solid rgba(0, 182, 230, .10);\n    background: rgba(255,255,255,.92);\n    box-shadow: var(--k6-softShadow);\n    overflow: hidden;\n    margin-top: 18px;\n  }\n\n  .k6-card--open{\n    border-color: rgba(0, 182, 230, .55);\n    box-shadow: var(--k6-cardShadow);\n  }\n\n  .k6-cardTop{\n    display: grid;\n    grid-template-columns: 66px 1fr auto;\n    gap: 18px;\n    align-items: center;\n    padding: 18px 18px 18px 18px;\n    border-bottom: 1px solid rgba(0,182,230,.25);\n  }\n\n  .k6-icobox{\n    width: 54px;\n    height: 54px;\n    border-radius: 16px;\n    display: grid;\n    place-items: center;\n    background: var(--k6-blue-soft);\n    border: 1px solid rgba(0, 182, 230, .35);\n    box-shadow: 0 10px 18px rgba(0, 182, 230, .10);\n  }\n  .k6-icobox--muted{\n    background: rgba(15,23,42,.04);\n    border-color: rgba(15,23,42,.06);\n    box-shadow: none;\n  }\n  .k6-ico{ font-size: 22px; }\n\n  .k6-topText{ min-width: 0; }\n  .k6-stepLabel{\n    font-size: 12px;\n    letter-spacing: .18em;\n    font-weight: 800;\n    color: rgba(15,23,42,.45);\n    margin-bottom: 6px;\n  }\n  .k6-stepLabel--muted{ opacity: .55; }\n\n  .k6-stepTitle{\n    font-size: clamp(18px, 1.7vw, 22px);\n    font-weight: 800;\n    color: var(--k6-text);\n    line-height: 1.2;\n  }\n  .k6-stepTitle--muted{ color: rgba(15,23,42,.65); font-weight: 750; }\n\n  .k6-topRight{\n    display: inline-flex;\n    align-items: center;\n    gap: 14px;\n  }\n\n  \/* Badge \"Gratuit \u2014 30 min\" plus bleu (moins p\u00e2le) *\/\n  .k6-timeBadge{\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    padding: 10px 14px;\n    border-radius: 999px;\n    background: rgba(0, 182, 230, .14);\n    border: 1px solid rgba(0, 182, 230, .42);\n    color: rgba(0, 151, 211, 1);\n    font-weight: 700;\n    font-size: 14px;\n    white-space: nowrap;\n  }\n  .k6-timeBadge--muted{\n    background: rgba(15,23,42,.04);\n    border-color: rgba(15,23,42,.06);\n    color: rgba(15,23,42,.45);\n  }\n\n  .k6-timeIco{ font-size: 15px; }\n\n  .k6-toggle{\n    width: 44px;\n    height: 44px;\n    border-radius: 999px;\n    border: 1px solid rgba(0, 182, 230, .35);\n    background: rgba(0, 182, 230, .10);\n    color: rgba(0, 151, 211, 1);\n    font-weight: 900;\n    cursor: default; \/* visuel seulement, comme ta maquette *\/\n    display: grid;\n    place-items: center;\n  }\n  .k6-toggle--muted{\n    border-color: rgba(15,23,42,.06);\n    background: rgba(15,23,42,.04);\n    color: rgba(15,23,42,.45);\n  }\n  .k6-chevron{\n    display: inline-block;\n    font-size: 18px;\n    line-height: 1;\n    transform: translateY(-1px);\n  }\n  .k6-chevron--up{ transform: translateY(-2px); }\n\n  \/* Body *\/\n  .k6-body{\n    padding: 18px 22px 18px; \/* r\u00e9duit un peu pour \u00e9viter trop de blanc *\/\n  }\n\n  .k6-bodyGrid{\n    display: grid;\n    grid-template-columns: 1.05fr .95fr;\n    gap: 26px;\n    align-items: start;\n  }\n\n  .k6-par{\n    margin: 0;\n    color: rgba(15,23,42,.62);\n    line-height: 1.75;\n    font-size: 16px;\n  }\n\n  \/* Livrable remonte + moins de blanc *\/\n  .k6-deliverable{\n    margin-top: 14px;\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    border-radius: 999px;\n    border: 1px solid rgba(0,182,230,.42);\n    background: rgba(0,182,230,.10);\n    color: rgba(0, 151, 211, 1);\n    font-weight: 700;\n    font-size: 14px;\n  }\n  .k6-check{\n    width: 22px;\n    height: 22px;\n    border-radius: 999px;\n    display: grid;\n    place-items: center;\n    background: rgba(0,182,230,.16);\n    border: 1px solid rgba(0,182,230,.30);\n    font-weight: 900;\n  }\n\n  .k6-rightTitle{\n    font-weight: 900;\n    color: rgba(15,23,42,.78);\n    margin-bottom: 10px;\n    font-size: 14px;\n  }\n\n  .k6-list{\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    display: grid;\n    gap: 10px;\n    color: rgba(15,23,42,.60);\n    font-size: 15px;\n    line-height: 1.55;\n  }\n\n  .k6-dot{\n    display: inline-grid;\n    place-items: center;\n    width: 22px;\n    height: 22px;\n    border-radius: 999px;\n    margin-right: 10px;\n    background: rgba(0,182,230,.16);\n    border: 1px solid rgba(0,182,230,.30);\n    color: rgba(0, 151, 211, 1);\n    font-weight: 900;\n    font-size: 13px;\n  }\n\n  \/* Closed cards look *\/\n  .k6-card--closed{\n    opacity: .95;\n    background: rgba(245, 248, 252, .75);\n    border-color: rgba(15,23,42,.06);\n  }\n\n  \/* Minis *\/\n  .k6-miniRow{\n    margin-top: 22px;\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 18px;\n  }\n\n  .k6-mini{\n    border-radius: 16px;\n    border: 1px solid rgba(15,23,42,.08);\n    background: rgba(255,255,255,.92);\n    box-shadow: 0 10px 24px rgba(15,23,42,.05);\n    padding: 14px 16px;\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n  .k6-miniIco{\n    width: 34px;\n    height: 34px;\n    border-radius: 12px;\n    display: grid;\n    place-items: center;\n    background: rgba(0,182,230,.12);\n    border: 1px solid rgba(0,182,230,.25);\n    font-size: 18px;\n  }\n  .k6-miniTop{\n    font-size: 12px;\n    color: rgba(15,23,42,.52);\n    font-weight: 600;\n    margin-bottom: 2px;\n  }\n  .k6-miniStrong{\n    font-size: 18px;\n    font-weight: 900;\n    color: rgba(15,23,42,.86);\n    letter-spacing: -0.02em;\n  }\n\n  \/* Responsive *\/\n  @media (max-width: 980px){\n    .k6-cardTop{\n      grid-template-columns: 56px 1fr;\n      grid-auto-rows: auto;\n    }\n    .k6-topRight{\n      grid-column: 1 \/ -1;\n      justify-content: flex-start;\n    }\n    .k6-bodyGrid{\n      grid-template-columns: 1fr;\n    }\n    .k6-miniRow{\n      grid-template-columns: 1fr;\n    }\n  }\n<\/style>\n\n<script>\n  \/\/ Visuel statique (on garde l'\u00e9tat comme ta vitrine: \u00e9tape 01 ouverte, 02\/03 ferm\u00e9es).\n  \/\/ Aucun JS de toggle ici pour \u00e9viter les surprises dans Elementor.\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-08f5325 e-con-full e-flex e-con e-parent\" data-id=\"08f5325\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e9e5374 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"e9e5374\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  \/* ============ CODE 7 (CTA FINAL \/ ROTATOR) ============ *\/\n  .kosma-cta7{\n    position:relative;\n    width:100%;\n    padding:96px 24px 96px;\n    color:#fff;\n    overflow:hidden;\n    background:\n      radial-gradient(1100px 700px at 20% 10%, rgba(0,165,255,.28) 0%, rgba(0,165,255,0) 55%),\n      radial-gradient(900px 650px at 85% 15%, rgba(0,210,185,.25) 0%, rgba(0,210,185,0) 55%),\n      radial-gradient(900px 650px at 80% 80%, rgba(255,196,0,.16) 0%, rgba(255,196,0,0) 60%),\n      linear-gradient(90deg, #00a7ff 0%, #00d4b7 55%, #00a7ff 120%);\n  }\n\n  \/* Subtle grid overlay *\/\n  .kosma-cta7::before{\n    content:\"\";\n    position:absolute; inset:0;\n    background-image:\n      linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);\n    background-size: 70px 70px;\n    opacity:.18;\n    pointer-events:none;\n  }\n\n  \/* soft curves lines (very light) *\/\n  .kosma-cta7::after{\n    content:\"\";\n    position:absolute; inset:-10%;\n    background:\n      radial-gradient(800px 380px at 25% 30%, rgba(255,255,255,.18), rgba(255,255,255,0) 65%),\n      radial-gradient(900px 420px at 75% 55%, rgba(255,255,255,.12), rgba(255,255,255,0) 70%);\n    opacity:.25;\n    filter: blur(2px);\n    pointer-events:none;\n    transform: rotate(-6deg);\n  }\n\n  .kosma-cta7 .wrap{\n    position:relative;\n    max-width:1200px;\n    margin:0 auto;\n    text-align:center;\n  }\n\n  .kosma-cta7 .pill{\n    display:inline-flex;\n    align-items:center;\n    gap:10px;\n    padding:10px 18px;\n    border-radius:999px;\n    border:1px solid rgba(255,255,255,.22);\n    background: rgba(255,255,255,.08);\n    backdrop-filter: blur(10px);\n    -webkit-backdrop-filter: blur(10px);\n    font-weight:650;\n    letter-spacing:.2px;\n    font-size:14px;\n  }\n  .kosma-cta7 .pill .offer{\n    margin-left:6px;\n    padding:4px 10px;\n    border-radius:999px;\n    font-weight:800;\n    font-size:12px;\n    color:#0b1528;\n    background:#ffc400;\n  }\n\n  .kosma-cta7 h2{\n    margin:22px auto 14px;\n    font-size: clamp(38px, 5vw, 72px);\n    line-height: 1.06;\n    font-weight: 850;\n    letter-spacing: -0.02em;\n  }\n\n  .kosma-cta7 .white-strong{\n    font-weight:850;\n  }\n\n  \/* Rotating word in yellow *\/\n  .kosma-cta7 .rotator{\n    display:inline-grid;\n    position:relative;\n    vertical-align:baseline;\n    color:#ffc400;\n    font-weight:900;\n    letter-spacing:-0.02em;\n    padding:0 .06em;\n  }\n  .kosma-cta7 .rotator span{\n    grid-area:1\/1;\n    opacity:0;\n    transform: translateY(22px);\n    filter: blur(0px);\n    transition: opacity .42s ease, transform .42s cubic-bezier(.2,.9,.2,1);\n    will-change: opacity, transform;\n  }\n  .kosma-cta7 .rotator span.is-active{\n    opacity:1;\n    transform: translateY(0px);\n  }\n  .kosma-cta7 .rotator span.is-out{\n    opacity:0;\n    transform: translateY(-22px);\n  }\n\n  .kosma-cta7 .subtitle{\n    margin:18px auto 0;\n    max-width:760px;\n    font-size:18px;\n    line-height:1.6;\n    color: rgba(255,255,255,.92);\n  }\n\n  .kosma-cta7 .chips{\n    margin:26px auto 0;\n    display:flex;\n    gap:14px;\n    justify-content:center;\n    flex-wrap:wrap;\n  }\n  .kosma-cta7 .chip{\n    display:inline-flex;\n    align-items:center;\n    gap:10px;\n    padding:10px 16px;\n    border-radius:999px;\n    border:1px solid rgba(255,255,255,.20);\n    background: rgba(255,255,255,.07);\n    backdrop-filter: blur(10px);\n    -webkit-backdrop-filter: blur(10px);\n    font-size:14px;\n    font-weight:650;\n    color: rgba(255,255,255,.92);\n  }\n  .kosma-cta7 .chip svg{ width:16px; height:16px; opacity:.95; }\n\n  .kosma-cta7 .actions{\n    margin:34px auto 0;\n    display:flex;\n    gap:18px;\n    justify-content:center;\n    flex-wrap:wrap;\n  }\n\n  .kosma-cta7 .btn{\n    display:inline-flex;\n    align-items:center;\n    justify-content:center;\n    gap:12px;\n    padding:16px 24px;\n    border-radius:18px;\n    font-weight:800;\n    letter-spacing:.2px;\n    text-decoration:none;\n    transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;\n    white-space:nowrap;\n  }\n  .kosma-cta7 .btn-primary{\n    background:#ffc400;\n    color:#fff; \/* demand\u00e9 : texte blanc *\/\n    box-shadow: 0 18px 45px rgba(0,0,0,.22);\n  }\n  .kosma-cta7 .btn-primary:hover{\n    transform: translateY(-2px);\n    filter: brightness(1.05);\n  }\n\n  .kosma-cta7 .btn-ghost{\n    color:#fff;\n    border:2px solid rgba(255,255,255,.30);\n    background: rgba(255,255,255,.06);\n    backdrop-filter: blur(10px);\n    -webkit-backdrop-filter: blur(10px);\n  }\n  .kosma-cta7 .btn-ghost:hover{\n    transform: translateY(-2px);\n    background: rgba(255,255,255,.10);\n  }\n\n  .kosma-cta7 .trust{\n    margin:26px auto 0;\n    display:flex;\n    align-items:center;\n    justify-content:center;\n    gap:14px;\n    flex-wrap:wrap;\n    color: rgba(255,255,255,.9);\n    font-weight:700;\n    font-size:14px;\n  }\n\n  .kosma-cta7 .avatars{\n    display:flex;\n    align-items:center;\n  }\n  .kosma-cta7 .avatar{\n    width:34px; height:34px;\n    border-radius:999px;\n    border:3px solid rgba(0,0,0,.18);\n    margin-left:-10px;\n    background:#0b1528;\n    overflow:hidden;\n    box-shadow: 0 10px 20px rgba(0,0,0,.20);\n  }\n  .kosma-cta7 .avatar:first-child{ margin-left:0; }\n  .kosma-cta7 .avatar img{ width:100%; height:100%; object-fit:cover; display:block; }\n\n  .kosma-cta7 .stars{\n    display:inline-flex; gap:4px; align-items:center;\n    color:#ffc400;\n  }\n  .kosma-cta7 .stars svg{ width:16px; height:16px; }\n\n  \/* responsive spacing left\/right like screenshots *\/\n  @media(max-width:900px){\n    .kosma-cta7{ padding:78px 18px 78px; }\n    .kosma-cta7 .wrap{ text-align:left; }\n    .kosma-cta7 .chips, .kosma-cta7 .actions, .kosma-cta7 .trust{ justify-content:flex-start; }\n  }\n<\/style>\n\n<section class=\"kosma-cta7\" id=\"cta-final\">\n  <div class=\"wrap\">\n\n    <div class=\"pill\">\n      <span>\u2728<\/span>\n      <span>Audit gratuit & sans engagement<\/span>\n      <span class=\"offer\">OFFERT<\/span>\n    <\/div>\n\n    <h2>\n      Pr\u00eat \u00e0 transformer<br>\n      <span class=\"white-strong\">votre marketing et<\/span><br>\n      <span class=\"rotator\" aria-label=\"mots rotatifs\">\n        <span class=\"is-active\">vos leads<\/span>\n        <span>vos ROI<\/span>\n        <span>vos ventes<\/span>\n        <span>vos emails<\/span>\n        <span>votre croissance<\/span>\n      <\/span>\n      <span class=\"white-strong\"> ?<\/span>\n    <\/h2>\n\n    <div class=\"subtitle\">\n      Obtenez un audit gratuit et des recommandations concr\u00e8tes pour booster votre croissance.\n      R\u00e9ponse en moins de 24h.\n    <\/div>\n\n    <div class=\"chips\">\n      <div class=\"chip\">\n        <!-- check icon -->\n        <svg viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M20 6.5 9.5 17 4 11.5\" stroke=\"white\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\n        Audit personnalis\u00e9 offert\n      <\/div>\n      <div class=\"chip\">\n        <!-- bolt icon -->\n        <svg viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13 2 3 14h8l-1 8 11-14h-8l0-6Z\" stroke=\"white\" stroke-width=\"2.2\" stroke-linejoin=\"round\"\/><\/svg>\n        Recommandations actionnables\n      <\/div>\n      <div class=\"chip\">\n        <!-- clock icon -->\n        <svg viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M12 8v5l3 2\" stroke=\"white\" stroke-width=\"2.3\" stroke-linecap=\"round\"\/><path d=\"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z\" stroke=\"white\" stroke-width=\"2\"\/><\/svg>\n        R\u00e9ponse en moins de 24h\n      <\/div>\n    <\/div>\n\n    <div class=\"actions\">\n      <a class=\"btn btn-primary\" href=\"https:\/\/calendly.com\/kosmaagency\/30min\" target=\"_blank\" rel=\"noopener\">\n        <!-- calendar icon -->\n        <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><path d=\"M7 2v3M17 2v3\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\/><path d=\"M3.5 9h17\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\"\/><path d=\"M6 6h12a2.5 2.5 0 0 1 2.5 2.5V19A2.5 2.5 0 0 1 18 21.5H6A2.5 2.5 0 0 1 3.5 19V8.5A2.5 2.5 0 0 1 6 6Z\" stroke=\"white\" stroke-width=\"2\"\/><\/svg>\n        R\u00e9servez votre audit gratuit maintenant\n        <span style=\"display:inline-flex;transform:translateY(1px);\">\u2192<\/span>\n      <\/a>\n\n      <a class=\"btn btn-ghost\" href=\"#services\">\n        D\u00e9couvrir nos services <span style=\"display:inline-flex;transform:translateY(1px);\">\u2192<\/span>\n      <\/a>\n    <\/div>\n\n    <div class=\"trust\">\n      <div class=\"avatars\" aria-hidden=\"true\">\n        <span class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/i.pravatar.cc\/80?img=32\" alt=\"\"><\/span>\n        <span class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/i.pravatar.cc\/80?img=12\" alt=\"\"><\/span>\n        <span class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/i.pravatar.cc\/80?img=7\"  alt=\"\"><\/span>\n        <span class=\"avatar\"><img decoding=\"async\" src=\"https:\/\/i.pravatar.cc\/80?img=49\" alt=\"\"><\/span>\n      <\/div>\n\n      <span class=\"stars\" aria-label=\"5 \u00e9toiles\">\n        <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 17.3 18.2 21l-1.6-7 5.4-4.6-7.1-.6L12 2 9.1 8.8 2 9.4l5.4 4.6L5.8 21z\"\/><\/svg>\n        <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 17.3 18.2 21l-1.6-7 5.4-4.6-7.1-.6L12 2 9.1 8.8 2 9.4l5.4 4.6L5.8 21z\"\/><\/svg>\n        <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 17.3 18.2 21l-1.6-7 5.4-4.6-7.1-.6L12 2 9.1 8.8 2 9.4l5.4 4.6L5.8 21z\"\/><\/svg>\n        <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 17.3 18.2 21l-1.6-7 5.4-4.6-7.1-.6L12 2 9.1 8.8 2 9.4l5.4 4.6L5.8 21z\"\/><\/svg>\n        <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 17.3 18.2 21l-1.6-7 5.4-4.6-7.1-.6L12 2 9.1 8.8 2 9.4l5.4 4.6L5.8 21z\"\/><\/svg>\n      <\/span>\n\n      <span>+150 entrepreneurs nous font confiance<\/span>\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<script>\n  (function(){\n    const root = document.querySelector('.kosma-cta7');\n    if(!root) return;\n    const spans = Array.from(root.querySelectorAll('.rotator span'));\n    if(spans.length < 2) return;\n\n    let i = 0;\n    const next = () => {\n      const current = spans[i];\n      const nextIndex = (i + 1) % spans.length;\n      const incoming = spans[nextIndex];\n\n      \/\/ animate out\n      current.classList.remove('is-active');\n      current.classList.add('is-out');\n\n      \/\/ prepare incoming\n      incoming.classList.remove('is-out');\n      \/\/ force reflow to ensure transition\n      void incoming.offsetWidth;\n      incoming.classList.add('is-active');\n\n      \/\/ cleanup old\n      setTimeout(()=> current.classList.remove('is-out'), 520);\n\n      i = nextIndex;\n    };\n\n    setInterval(next, 2200);\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-06deae8 e-con-full e-flex e-con e-parent\" data-id=\"06deae8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-736bf41 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"736bf41\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  .kosma-footer {\n    position: relative;\n    background: linear-gradient(180deg, #06101f 0%, #040b16 100%);\n    color: rgba(255,255,255,0.85);\n    padding: 90px 24px 40px;\n    overflow: hidden;\n  }\n\n  \/* fine gradient line on top *\/\n  .kosma-footer::before{\n    content:\"\";\n    position:absolute;\n    top:0; left:0; right:0;\n    height:3px;\n    background: linear-gradient(90deg,#00a7ff,#00d4b7,#ffc400);\n  }\n\n  .footer-container{\n    max-width:1200px;\n    margin:0 auto;\n  }\n\n  .footer-grid{\n    display:grid;\n    grid-template-columns: 1.3fr 1fr 1fr 1.2fr;\n    gap:60px;\n  }\n\n  @media(max-width:1000px){\n    .footer-grid{\n      grid-template-columns:1fr 1fr;\n      gap:40px;\n    }\n  }\n\n  @media(max-width:640px){\n    .footer-grid{\n      grid-template-columns:1fr;\n    }\n  }\n\n  .footer-logo{\n    display:flex;\n    align-items:center;\n    gap:14px;\n    margin-bottom:20px;\n  }\n\n  .footer-logo-box{\n    width:48px;height:48px;\n    border-radius:14px;\n    background: linear-gradient(135deg,#00d4b7,#00a7ff);\n    display:grid;\n    place-items:center;\n    font-weight:800;\n    color:#fff;\n  }\n\n  .footer-logo b{\n    font-size:20px;\n    font-weight:800;\n    letter-spacing:.3px;\n  }\n\n  .footer-desc{\n    line-height:1.6;\n    font-size:15px;\n    margin-bottom:24px;\n    opacity:.85;\n  }\n\n  .footer-contact-item{\n    display:flex;\n    align-items:center;\n    gap:12px;\n    margin-bottom:14px;\n    font-size:14px;\n    opacity:.9;\n  }\n\n  .footer-contact-item svg{\n    width:18px;height:18px;\n    opacity:.6;\n  }\n\n  .footer-title{\n    font-weight:700;\n    font-size:14px;\n    letter-spacing:.12em;\n    text-transform:uppercase;\n    opacity:.6;\n    margin-bottom:20px;\n  }\n\n  .footer-links a{\n    display:block;\n    margin-bottom:14px;\n    font-size:15px;\n    opacity:.85;\n    transition:.2s;\n  }\n\n  .footer-links a:hover{\n    opacity:1;\n    transform:translateX(4px);\n  }\n\n  .newsletter-text{\n    font-size:14px;\n    line-height:1.6;\n    opacity:.85;\n    margin-bottom:16px;\n  }\n\n  .newsletter-input{\n    width:100%;\n    padding:14px 16px;\n    border-radius:14px;\n    border:1px solid rgba(255,255,255,0.12);\n    background:rgba(255,255,255,0.05);\n    color:#fff;\n    outline:none;\n    margin-bottom:14px;\n  }\n\n  .newsletter-input::placeholder{\n    color:rgba(255,255,255,0.5);\n  }\n\n  .newsletter-btn{\n    width:100%;\n    padding:14px;\n    border-radius:14px;\n    border:none;\n    font-weight:700;\n    background:linear-gradient(90deg,#00a7ff,#00d4b7);\n    color:#fff;\n    cursor:pointer;\n    transition:.2s;\n  }\n\n  .newsletter-btn:hover{\n    filter:brightness(1.1);\n    transform:translateY(-1px);\n  }\n\n  .newsletter-note{\n    margin-top:10px;\n    font-size:12px;\n    opacity:.5;\n  }\n\n  .footer-bottom{\n    margin-top:60px;\n    padding-top:30px;\n    border-top:1px solid rgba(255,255,255,0.08);\n    display:flex;\n    justify-content:space-between;\n    align-items:center;\n    flex-wrap:wrap;\n    gap:20px;\n  }\n\n  .footer-bottom-left{\n    display:flex;\n    gap:20px;\n    flex-wrap:wrap;\n    font-size:13px;\n    opacity:.6;\n  }\n\n  .footer-social{\n    display:flex;\n    gap:12px;\n  }\n\n  .footer-social a{\n    width:38px;height:38px;\n    border-radius:12px;\n    background:rgba(255,255,255,0.05);\n    display:grid;\n    place-items:center;\n    transition:.2s;\n  }\n\n  .footer-social a:hover{\n    background:rgba(255,255,255,0.12);\n    transform:translateY(-3px);\n  }\n\n  .footer-social svg{\n    width:16px;height:16px;\n    fill:white;\n    opacity:.7;\n  }\n\n<\/style>\n\n<footer class=\"kosma-footer\">\n  <div class=\"footer-container\">\n    <div class=\"footer-grid\">\n\n      <!-- Col 1 -->\n      <div>\n        <div class=\"footer-logo\">\n          <div class=\"footer-logo-box\">K<\/div>\n          <b>Kosma Agency<\/b>\n        <\/div>\n        <div class=\"footer-desc\">\n          Agence de marketing digital sp\u00e9cialis\u00e9e en email marketing et copywriting.\n          On transforme votre pr\u00e9sence digitale en moteur de croissance r\u00e9el.\n        <\/div>\n\n        <div class=\"footer-contact-item\">\n          \u2709admin@kosmaagency.com\n        <\/div>\n        <div class=\"footer-contact-item\">\n          \ud83d\udcde +33 4 651 746 243\n        <\/div>\n        <div class=\"footer-contact-item\">\n          \ud83d\udccd Madrid, Espagne\n        <\/div>\n      <\/div>\n\n      <!-- Col 2 -->\n      <div>\n        <div class=\"footer-title\">Services<\/div>\n        <div class=\"footer-links\">\n          <a href=\"#\">Email Marketing<\/a>\n          <a href=\"#\">Copywriting<\/a>\n          <a href=\"#\">Cr\u00e9ation de Site Web<\/a>\n          <a href=\"#\">SEO<\/a>\n        <\/div>\n      <\/div>\n\n      <!-- Col 3 -->\n      <div>\n        <div class=\"footer-title\">Entreprise<\/div>\n        <div class=\"footer-links\">\n          <a href=\"#\">\u00c0 propos<\/a>\n          <a href=\"#\">\u00c9tudes de cas<\/a>\n          <a href=\"#\">Blog<\/a>\n          <a href=\"#\">Contact<\/a>\n        <\/div>\n      <\/div>\n\n      <!-- Col 4 -->\n      <div>\n        <div class=\"footer-title\">Newsletter<\/div>\n        <div class=\"newsletter-text\">\n          Recevez chaque semaine nos meilleures astuces marketing directement dans votre bo\u00eete mail.\n        <\/div>\n        <input class=\"newsletter-input\" type=\"email\" placeholder=\"votre@email.com\">\n        <button class=\"newsletter-btn\">Rejoindre la newsletter<\/button>\n        <div class=\"newsletter-note\">\n          Pas de spam \u00b7 D\u00e9sinscription en 1 clic\n        <\/div>\n      <\/div>\n\n    <\/div>\n\n    <div class=\"footer-bottom\">\n      <div class=\"footer-bottom-left\">\n        <span>Mentions l\u00e9gales<\/span>\n        <span>Politique de confidentialit\u00e9<\/span>\n        <span>CGV<\/span>\n        <span>\u00a9 2026 Kosma Agency \u00b7 Fait avec \u2764 \u00e0 Madrid<\/span>\n      <\/div>\n\n      <div class=\"footer-social\">\n        <a href=\"#\"><svg viewBox=\"0 0 24 24\"><path d=\"M22 5.8a8.4 8.4 0 0 1-2.4.7 4.2 4.2 0 0 0 1.8-2.3 8.5 8.5 0 0 1-2.7 1A4.2 4.2 0 0 0 12 9a12 12 0 0 1-8.7-4.4 4.2 4.2 0 0 0 1.3 5.6 4.1 4.1 0 0 1-1.9-.5v.1A4.2 4.2 0 0 0 6 13a4.3 4.3 0 0 1-1.9.1 4.2 4.2 0 0 0 3.9 2.9A8.5 8.5 0 0 1 2 18.6 12 12 0 0 0 8.5 20c7.8 0 12-6.4 12-12v-.5A8.4 8.4 0 0 0 22 5.8Z\"\/><\/svg><\/a>\n        <a href=\"#\"><svg viewBox=\"0 0 24 24\"><path d=\"M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 1 0-4 0v7h-4v-12h4v2a4 4 0 0 1 4-2ZM2 9h4v12H2Z\"\/><circle cx=\"4\" cy=\"4\" r=\"2\"\/><\/svg><\/a>\n        <a href=\"#\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 2C8 2 6 4 6 8v8c0 4 2 6 6 6s6-2 6-6V8c0-4-2-6-6-6Zm0 3a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm6 13a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2v-2h12v2Z\"\/><\/svg><\/a>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/footer>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>K Kosma Services Pourquoi nous R\u00e9sultats Processus Contact R\u00e9server un audit K Kosma &#x26a1; Agence de Marketing Digital Premium Boostez [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-22","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/pages\/22","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=22"}],"version-history":[{"count":89,"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/pages\/22\/revisions"}],"predecessor-version":[{"id":146,"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=\/wp\/v2\/pages\/22\/revisions\/146"}],"wp:attachment":[{"href":"https:\/\/www.kosmaagency.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=22"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}