var/cache/dev/twig/53/53f6a6248bee9e9c2b12d5129ecf484c.php line 49

Open in your IDE?
  1. <?php
  3. use Twig\Environment;
  4. use Twig\Error\LoaderError;
  5. use Twig\Error\RuntimeError;
  6. use Twig\Extension\CoreExtension;
  7. use Twig\Extension\SandboxExtension;
  8. use Twig\Markup;
  9. use Twig\Sandbox\SecurityError;
  10. use Twig\Sandbox\SecurityNotAllowedTagError;
  11. use Twig\Sandbox\SecurityNotAllowedFilterError;
  12. use Twig\Sandbox\SecurityNotAllowedFunctionError;
  13. use Twig\Source;
  14. use Twig\Template;
  15. use Twig\TemplateWrapper;
  17. /* application/whileresume/website/candidates/homepage.html.twig */
  18. class __TwigTemplate_3021bd991837ee306d1f78dd01b7ec9e extends Template
  19. {
  20.     private Source $source;
  21.     /**
  22.      * @var array<string, Template>
  23.      */
  24.     private array $macros = [];
  26.     public function __construct(Environment $env)
  27.     {
  28.         parent::__construct($env);
  30.         $this->source = $this->getSourceContext();
  32.         $this->blocks = [
  33.             'title' => [$this, 'block_title'],
  34.             'description' => [$this, 'block_description'],
  35.             'robots' => [$this, 'block_robots'],
  36.             'canonical' => [$this, 'block_canonical'],
  37.             'css' => [$this, 'block_css'],
  38.             'body' => [$this, 'block_body'],
  39.             'footer_js' => [$this, 'block_footer_js'],
  40.         ];
  41.     }
  43.     protected function doGetParent(array $context): bool|string|Template|TemplateWrapper
  44.     {
  45.         // line 1
  46.         return "application/whileresume/website/layout-social.html.twig";
  47.     }
  49.     protected function doDisplay(array $context, array $blocks = []): iterable
  50.     {
  51.         $macros = $this->macros;
  52.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  53.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "application/whileresume/website/candidates/homepage.html.twig"));
  55.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  56.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "application/whileresume/website/candidates/homepage.html.twig"));
  58.         // line 3
  59.         $context["isFR"] = (CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 3, $this->source); })()), "request", [], "any", false, false, false, 3), "locale", [], "any", false, false, false, 3) == "fr");
  60.         // line 5
  61.         $context["_keys"] = ["hero_eyebrow", "hero_title_pre", "hero_title_accent", "hero_title_post", "hero_title_accent2", "hero_title_2", "hero_lede_pre", "hero_lede_brand", "hero_lede_mid", "hero_lede_word", "hero_lede_post", "hero_cta_signup", "hero_cta_login", "hero_search_placeholder", "hero_popular_label", "hero_btn_ios", "hero_btn_android", "hero_default_title", "hero_search_button", "hero_byline_jobs", "hero_byline_apps", "hero_byline_free", "hero_kbd_enter", "search_loading", "search_no_results", "search_no_results_hint", "search_results_count", "search_view_all", "search_view_offer", "search_clear", "how_eyebrow", "how_title", "how_lede", "how1_title", "how1_desc", "how2_title", "how2_desc", "how3_title", "how3_desc", "feat1_label", "feat1_title", "feat1_p1", "feat1_p2", "feat1_quote", "feat1_author", "feat1_role", "feat2_label", "feat2_title", "feat2_p1", "feat2_p2", "feat2_quote", "feat2_author", "feat2_role", "feat3_label", "feat3_title", "feat3_p1", "feat3_p2", "feat3_quote", "feat3_author", "feat3_role", "feat4_label", "feat4_title", "feat4_p1", "feat4_p2", "feat4_quote", "feat4_author", "feat4_role", "signup_eyebrow", "signup_title", "signup_lede", "signup_email_ph", "signup_pass_ph", "signup_pass2_ph", "signup_terms_pre", "signup_terms_link", "signup_btn", "signup_login_pre", "signup_login_link", "signup_perk1", "signup_perk2", "signup_perk3", "apps_eyebrow", "apps_title", "apps_lede", "apps_ios", "apps_android", "apps_web", "apps_ios_desc", "apps_android_desc", "apps_web_desc", "articles_title", "articles_view_all", "read_article", "final_eyebrow", "final_title", "final_recruiter_label", "final_recruiter_title", "final_recruiter_desc", "final_candidate_label", "final_candidate_title", "final_candidate_desc", "final_candidate", "final_recruiter"];
  62.         // line 29
  63.         $context["t"] = [];
  64.         // line 30
  65.         $context['_parent'] = $context;
  66.         $context['_seq'] = CoreExtension::ensureTraversable((isset($context["_keys"]) || array_key_exists("_keys", $context) ? $context["_keys"] : (function () { throw new RuntimeError('Variable "_keys" does not exist.', 30, $this->source); })()));
  67.         foreach ($context['_seq'] as $context["_key"] => $context["k"]) {
  68.             // line 31
  69.             $context["t"] = Twig\Extension\CoreExtension::merge((isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 31, $this->source); })()), [ (string)$context["k"] => $this->extensions['Symfony\Bridge\Twig\Extension\TranslationExtension']->trans(("homepage." . $context["k"]), [], "whr-public")]);
  70.         }
  71.         $_parent = $context['_parent'];
  72.         unset($context['_seq'], $context['_key'], $context['k'], $context['_parent']);
  73.         $context = array_intersect_key($context, $_parent) + $_parent;
  74.         // line 1
  75.         $this->parent = $this->load("application/whileresume/website/layout-social.html.twig", 1);
  76.         yield from $this->parent->unwrap()->yield($context, array_merge($this->blocks, $blocks));
  77.         
  78.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  80.         
  81.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  83.     }
  85.     // line 35
  86.     /**
  87.      * @return iterable<null|scalar|\Stringable>
  88.      */
  89.     public function block_title(array $context, array $blocks = []): iterable
  90.     {
  91.         $macros = $this->macros;
  92.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  93.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  95.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  96.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));
  98.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["page"]) || array_key_exists("page", $context) ? $context["page"] : (function () { throw new RuntimeError('Variable "page" does not exist.', 35, $this->source); })()), "shortTitle", [], "any", false, false, false, 35), "html", null, true);
  99.         
  100.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  102.         
  103.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  105.         yield from [];
  106.     }
  108.     // line 36
  109.     /**
  110.      * @return iterable<null|scalar|\Stringable>
  111.      */
  112.     public function block_description(array $context, array $blocks = []): iterable
  113.     {
  114.         $macros = $this->macros;
  115.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  116.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "description"));
  118.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  119.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "description"));
  121.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["page"]) || array_key_exists("page", $context) ? $context["page"] : (function () { throw new RuntimeError('Variable "page" does not exist.', 36, $this->source); })()), "shortDescription", [], "any", false, false, false, 36), "html", null, true);
  122.         
  123.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  125.         
  126.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  128.         yield from [];
  129.     }
  131.     // line 37
  132.     /**
  133.      * @return iterable<null|scalar|\Stringable>
  134.      */
  135.     public function block_robots(array $context, array $blocks = []): iterable
  136.     {
  137.         $macros = $this->macros;
  138.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  139.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "robots"));
  141.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  142.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "robots"));
  144.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["page"]) || array_key_exists("page", $context) ? $context["page"] : (function () { throw new RuntimeError('Variable "page" does not exist.', 37, $this->source); })()), "robots", [], "any", false, false, false, 37), "html", null, true);
  145.         
  146.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  148.         
  149.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  151.         yield from [];
  152.     }
  154.     // line 38
  155.     /**
  156.      * @return iterable<null|scalar|\Stringable>
  157.      */
  158.     public function block_canonical(array $context, array $blocks = []): iterable
  159.     {
  160.         $macros = $this->macros;
  161.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  162.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "canonical"));
  164.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  165.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "canonical"));
  167.         yield from $this->load("/vitrine/lexend/components/languages/canonical_classic.html.twig", 38)->unwrap()->yield($context);
  168.         
  169.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  171.         
  172.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  174.         yield from [];
  175.     }
  177.     // line 40
  178.     /**
  179.      * @return iterable<null|scalar|\Stringable>
  180.      */
  181.     public function block_css(array $context, array $blocks = []): iterable
  182.     {
  183.         $macros = $this->macros;
  184.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  185.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));
  187.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  188.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));
  190.         // line 41
  191.         yield "    ";
  192.         yield from $this->yieldParentBlock("css", $context, $blocks);
  193.         yield "
  194.     <style>
  195.         :root{
  196.             --wr-bg:#FBFCFE;
  197.             --wr-bg-2:#F4F6FB;
  198.             --wr-card:#FFFFFF;
  199.             --wr-violet:#8A63C1;
  200.             --wr-violet-2:#A98AD3;
  201.             --wr-violet-soft:#F2EDFA;
  202.             --wr-violet-softer:#F8F4FD;
  203.             --wr-violet-dark:#6B47A6;
  204.             --wr-ink:#1E1B2E;
  205.             --wr-ink-2:#374151;
  206.             --wr-muted:#6B7280;
  207.             --wr-muted-2:#9CA3AF;
  208.             --wr-line:#EEF1F7;
  209.             --wr-line-2:#E5E9F0;
  210.             --wr-shadow:0 1px 2px rgba(30,27,46,.04),0 4px 16px rgba(30,27,46,.04);
  211.             --wr-shadow-hover:0 4px 8px rgba(138,99,192,.08),0 12px 32px rgba(138,99,192,.1);
  212.             /* Accents colorés pour les logos d'offres (lettres) */
  213.             --wr-acc-yellow:#FEF3C7;  --wr-acc-yellow-fg:#B45309;
  214.             --wr-acc-green:#D1FAE5;   --wr-acc-green-fg:#047857;
  215.             --wr-acc-pink:#FCE7F3;    --wr-acc-pink-fg:#BE185D;
  216.             --wr-acc-blue:#DBEAFE;    --wr-acc-blue-fg:#1E40AF;
  217.             --wr-acc-orange:#FED7AA;  --wr-acc-orange-fg:#C2410C;
  218.             --wr-acc-violet:#EDE9FE;  --wr-acc-violet-fg:#6D28D9;
  219.             --wr-acc-cyan:#CFFAFE;    --wr-acc-cyan-fg:#0E7490;
  220.         }
  222.         /* ═══════════════════════════════════════════════════════════════════
  223.            PLEINE LARGEUR — On retire la réservation d'espace de la sidebar droite
  224.            ═══════════════════════════════════════════════════════════════════ */
  225.         body .main-content.right-chat-active{padding-right:0!important}
  226.         body .main-content{padding-right:0!important}
  227.         body .right-chat{display:none!important}
  228.         body .middle-sidebar-bottom .middle-sidebar-left{padding-right:0!important;max-width:none!important;width:100%!important}
  229.         body .middle-sidebar-bottom{max-width:none!important}
  231.         .wr{margin:-15px -15px 0;background:var(--wr-bg);color:var(--wr-ink);font-family:inherit;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
  232.         @media(max-width:991px){.wr{margin:0 -15px}}
  233.         .wr *{box-sizing:border-box}
  234.         .wr a{color:inherit;text-decoration:none}
  236.         /* ═══════════════════════════════════════════════════════════════════
  237.            SECTIONS GENERIC — Fond UNIFIÉ partout (pas d'alternance)
  238.            ═══════════════════════════════════════════════════════════════════ */
  239.         .wr-section{padding:80px 32px;background:var(--wr-bg);position:relative}
  240.         .wr-section--tight{padding:48px 32px}
  241.         @media(max-width:768px){.wr-section{padding:56px 20px}.wr-section--tight{padding:36px 20px}}
  243.         /* Filet décoratif au lieu d'un changement de couleur */
  244.         .wr-section + .wr-section::before{
  245.             content:\"\";
  246.             position:absolute;top:0;left:50%;transform:translateX(-50%);
  247.             width:80px;height:1px;
  248.             background:linear-gradient(90deg,transparent,var(--wr-line-2),transparent);
  249.         }
  251.         .wr-container{max-width:1200px;margin:0 auto;position:relative}
  253.         /* ═══ Eyebrow ═══ */
  254.         .wr-eyebrow{
  255.             display:inline-flex;align-items:center;gap:8px;
  256.             padding:6px 14px;border-radius:100px;
  257.             background:var(--wr-violet-soft);
  258.             color:var(--wr-violet-dark);
  259.             font-size:11.5px;font-weight:600;
  260.             text-transform:uppercase;letter-spacing:.12em;
  261.             margin-bottom:22px;
  262.         }
  263.         .wr-eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--wr-violet);animation:wrPulse 2.4s ease-in-out infinite}
  264.         @keyframes wrPulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
  266.         /* ═══ Titres ═══ */
  267.         .wr-title{
  268.             font-family:inherit;
  269.             font-weight:700;
  270.             font-size:28px;line-height:1.15;letter-spacing:-0.025em;
  271.             color:var(--wr-ink);
  272.             margin:0 auto 16px;
  273.             max-width:1200px;
  274.         }
  275.         @media(min-width:768px){.wr-title{font-size:34px}}
  276.         @media(min-width:1024px){.wr-title{font-size:40px}}
  277.         .wr-title--sm{font-size:24px}
  278.         @media(min-width:768px){.wr-title--sm{font-size:30px}}
  279.         .wr-title em{font-style:normal;font-weight:700;color:var(--wr-violet)}
  281.         .wr-lede{
  282.             font-size:17px;line-height:1.55;font-weight:400;
  283.             color:var(--wr-ink-2);
  284.             margin:0 auto;max-width:680px;
  285.         }
  287.         .wr-section-head{text-align:center;margin-bottom:56px}
  289.         /* ═══════════════════════════════════════════════════════════════════
  290.            HERO — Style soft, recherche dashboard, boutons pleins
  291.            ═══════════════════════════════════════════════════════════════════ */
  292.         @keyframes wrFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
  293.         @keyframes wrPulse2{0%{box-shadow:0 0 0 0 rgba(16,185,129,.4)}70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
  295.         /* ═══ Reveal au scroll (Intersection Observer ajoute .is-revealed) ═══ */
  296.         .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
  297.         .reveal.is-revealed{opacity:1;transform:translateY(0)}
  298.         .reveal--left{transform:translateX(-32px) translateY(0)}
  299.         .reveal--left.is-revealed{transform:translateX(0)}
  300.         .reveal--right{transform:translateX(32px) translateY(0)}
  301.         .reveal--right.is-revealed{transform:translateX(0)}
  302.         .reveal--scale{transform:scale(.96);opacity:0}
  303.         .reveal--scale.is-revealed{transform:scale(1);opacity:1}
  304.         .reveal[data-reveal-delay=\"1\"]{transition-delay:.08s}
  305.         .reveal[data-reveal-delay=\"2\"]{transition-delay:.16s}
  306.         .reveal[data-reveal-delay=\"3\"]{transition-delay:.24s}
  307.         .reveal[data-reveal-delay=\"4\"]{transition-delay:.32s}
  308.         @media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important}}
  310.         .hero{
  311.             position:relative;
  312.             background:var(--wr-bg);
  313.             padding:24px 32px 0;
  314.             overflow:hidden;
  315.         }
  316.         @media(max-width:768px){.hero{padding:18px 18px 0}}
  318.         /* Décor : 2 blobs très flous violet pâle */
  319.         .hero::before{
  320.             content:\"\";position:absolute;
  321.             top:-260px;right:-180px;width:560px;height:560px;
  322.             background:radial-gradient(circle,rgba(138,99,192,.14) 0%,transparent 65%);
  323.             pointer-events:none;filter:blur(50px);
  324.         }
  325.         .hero::after{
  326.             content:\"\";position:absolute;
  327.             top:120px;left:-180px;width:480px;height:480px;
  328.             background:radial-gradient(circle,rgba(138,99,192,.09) 0%,transparent 65%);
  329.             pointer-events:none;filter:blur(50px);
  330.         }
  332.         .hero-inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;text-align:center}
  334.         /* ═══ Eyebrow ═══ */
  335.         .hero-badge{
  336.             display:inline-flex;align-items:center;gap:8px;
  337.             padding:7px 16px;border-radius:100px;
  338.             background:var(--wr-violet-soft);
  339.             color:var(--wr-violet-dark);
  340.             font-size:12px;font-weight:600;
  341.             text-transform:uppercase;letter-spacing:.1em;
  342.             margin-bottom:10px;
  343.             opacity:0;transform:translateY(8px);
  344.             animation:wrFadeUp .8s ease forwards;
  345.         }
  346.         .hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--wr-violet);animation:wrPulse2 2s ease infinite}
  348.         /* ═══ Titre — 57px desktop, plein largeur conteneur ═══ */
  349.         .hero-title{
  350.             font-weight:700;
  351.             font-size:24px;line-height:1.05;letter-spacing:-0.04em;
  352.             color:var(--wr-ink);
  353.             margin:0 auto 12px;
  354.             width:100%;max-width:1200px;
  355.             opacity:0;transform:translateY(12px);
  356.             animation:wrFadeUp .9s cubic-bezier(.2,.7,.2,1) .15s forwards;
  357.         }
  358.         @media(min-width:768px){.hero-title{font-size:40px;letter-spacing:-0.045em}}
  359.         @media(min-width:1100px){.hero-title{font-size:57px;letter-spacing:-0.045em}}
  361.         .hero-title-accent{
  362.             color:var(--wr-violet);
  363.         }
  365.         .hero-lede{
  366.             font-size:15px;line-height:1.5;color:var(--wr-ink-2);font-weight:400;
  367.             margin:0 auto 16px;max-width:680px;
  368.             opacity:0;animation:wrFadeUp .9s ease .4s forwards;
  369.         }
  370.         @media(min-width:768px){.hero-lede{font-size:17px}}
  371.         .hero-lede-accent{color:var(--wr-violet);font-weight:600}
  373.         /* ═══ Recherche — pleine largeur (alignée sur la liste 1200px) ═══ */
  374.         .hero-search-wrap{
  375.             max-width:1200px;margin:0 auto 12px;
  376.             opacity:0;animation:wrFadeUp .9s ease .55s forwards;
  377.             position:relative;z-index:5;
  378.         }
  379.         .hero-search{
  380.             background:var(--wr-card);
  381.             border-radius:14px;
  382.             box-shadow:0 0 20px 0 rgba(0,0,0,0.05),0 16px 40px rgba(138,99,192,.06);
  383.             padding:10px;
  384.             position:relative;
  385.         }
  386.         .hero-search-inner{
  387.             display:flex;align-items:center;gap:10px;
  388.             padding:10px 14px;border-radius:10px;
  389.             background:#F9FAFB;border:1px solid #E5E7EB;
  390.             transition:border-color .2s,background .2s;
  391.         }
  392.         .hero-search-inner:focus-within{
  393.             border-color:rgba(138,99,192,.4);
  394.             background:#fff;
  395.         }
  396.         .hero-search-icon{color:var(--wr-muted-2);display:flex;flex-shrink:0}
  397.         .hero-search-icon svg{width:16px;height:16px}
  398.         .hero-search-input{
  399.             flex:1;border:0;outline:0;background:transparent;
  400.             font-size:14.5px;font-family:inherit;color:var(--wr-ink);
  401.             padding:6px 0;min-width:0;
  402.         }
  403.         .hero-search-input::placeholder{color:var(--wr-muted-2)}
  404.         .hero-search-clear{
  405.             background:none;border:0;color:var(--wr-muted-2);cursor:pointer;
  406.             padding:4px;display:none;font-family:inherit;
  407.             border-radius:6px;transition:background .15s,color .15s;
  408.         }
  409.         .hero-search-clear:hover{background:var(--wr-violet-soft);color:var(--wr-violet)}
  410.         .hero-search-clear.is-visible{display:flex;align-items:center}
  411.         .hero-search-clear svg{width:14px;height:14px}
  412.         .hero-search-kbd{
  413.             display:none;align-items:center;
  414.             padding:3px 8px;background:#fff;border:1px solid #E5E7EB;border-radius:6px;
  415.             font-size:10.5px;font-weight:600;color:var(--wr-muted);
  416.             font-family:inherit;letter-spacing:.02em;white-space:nowrap;flex-shrink:0;
  417.         }
  418.         .hero-search-inner:focus-within .hero-search-kbd{display:inline-flex}
  420.         /* ═══ États de la liste de jobs (header, empty, loading) ═══ */
  421.         .hero-jobs-header{
  422.             display:flex;align-items:center;justify-content:space-between;gap:10px;
  423.             padding:14px 22px 10px;
  424.             border-bottom:1px solid var(--wr-line);
  425.             margin-bottom:4px;
  426.         }
  427.         @media(max-width:540px){.hero-jobs-header{padding:12px 16px 8px}}
  428.         .hero-jobs-count{
  429.             font-size:11.5px;color:var(--wr-muted);
  430.             text-transform:uppercase;letter-spacing:.08em;font-weight:600;
  431.         }
  432.         .hero-jobs-count strong{color:var(--wr-violet);font-weight:800;font-size:13px;margin-right:4px}
  433.         .hero-jobs-link{
  434.             font-size:11px;font-weight:700;
  435.             color:var(--wr-violet);
  436.             text-transform:uppercase;letter-spacing:.08em;
  437.             text-decoration:none;
  438.             display:inline-flex;align-items:center;gap:5px;
  439.             transition:color .15s,transform .15s;
  440.         }
  441.         .hero-jobs-link:hover{color:var(--wr-violet-dark);text-decoration:none;transform:translateX(2px)}
  442.         .hero-jobs-link svg{width:11px;height:11px}
  444.         .hero-jobs-empty{text-align:center;padding:48px 20px;color:var(--wr-muted)}
  445.         .hero-jobs-empty-icon{width:48px;height:48px;border-radius:14px;background:var(--wr-violet-soft);color:var(--wr-violet);display:inline-flex;align-items:center;justify-content:center;margin-bottom:14px}
  446.         .hero-jobs-empty-icon svg{width:22px;height:22px}
  447.         .hero-jobs-empty-title{font-weight:600;font-size:14px;color:var(--wr-ink);margin:0 0 4px}
  448.         .hero-jobs-empty-hint{font-size:13px;margin:0;color:var(--wr-muted)}
  450.         .hero-jobs-loading{text-align:center;padding:36px 20px;color:var(--wr-muted);font-size:13px;display:flex;align-items:center;justify-content:center;gap:10px}
  451.         .hero-jobs-spinner{width:16px;height:16px;border-radius:50%;border:2px solid var(--wr-violet-soft);border-top-color:var(--wr-violet);animation:wrSpin .7s linear infinite}
  452.         @keyframes wrSpin{to{transform:rotate(360deg)}}
  454.         /* ═══ Pills \"Populaire\" sous la recherche ═══ */
  455.         .hero-popular{
  456.             display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
  457.             margin-bottom:18px;
  458.             opacity:0;animation:wrFadeUp .9s ease .7s forwards;
  459.         }
  460.         .hero-popular-label{
  461.             font-size:11px;font-weight:600;color:var(--wr-muted);
  462.             text-transform:uppercase;letter-spacing:.06em;
  463.             margin-right:4px;
  464.         }
  465.         .hero-popular-pill{
  466.             display:inline-flex;align-items:center;gap:5px;
  467.             padding:6px 12px;border-radius:100px;
  468.             background:var(--wr-violet-soft);
  469.             color:var(--wr-violet);
  470.             font-size:12.5px;font-weight:500;font-family:inherit;
  471.             text-decoration:none;cursor:pointer;
  472.             border:1px solid transparent;
  473.             transition:background .15s,border-color .15s,transform .15s,color .15s;
  474.         }
  475.         .hero-popular-pill:hover{
  476.             background:#EDE9FE;
  477.             border-color:rgba(138,99,192,.2);
  478.             transform:translateY(-1px);
  479.             color:var(--wr-violet);
  480.             text-decoration:none;
  481.         }
  482.         .hero-popular-pill.is-active{
  483.             background:var(--wr-violet);color:#fff;border-color:var(--wr-violet);
  484.         }
  485.         .hero-popular-pill.is-active:hover{background:var(--wr-violet-dark);color:#fff}
  486.         .hero-popular-pill-icon{font-size:13px;line-height:1}
  488.         /* ═══ CTA hero (boutons inscription + connexion pour anonymes) ═══ */
  489.         .hero-cta{
  490.             display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  491.             margin:24px 0 8px;
  492.             opacity:0;animation:wrFadeUp .9s ease 1.1s forwards;
  493.         }
  494.         .hero-cta-btn,
  495.         .hero-cta-btn:link,
  496.         .hero-cta-btn:visited,
  497.         .hero-cta-btn:hover,
  498.         .hero-cta-btn:focus,
  499.         .hero-cta-btn:active{
  500.             color:#fff !important;
  501.             text-decoration:none !important;
  502.         }
  503.         .hero-cta-btn{
  504.             display:inline-flex;align-items:center;gap:8px;
  505.             padding:11px 20px;border-radius:11px;
  506.             font-size:13.5px;font-weight:700;font-family:inherit;
  507.             line-height:1;
  508.             background:var(--wr-violet);border:1px solid var(--wr-violet);
  509.             box-shadow:0 4px 14px rgba(138,99,193,.32);
  510.             transition:background .15s,border-color .15s,transform .15s,box-shadow .15s;
  511.         }
  512.         .hero-cta-btn:hover{
  513.             background:var(--wr-violet-dark);border-color:var(--wr-violet-dark);
  514.             transform:translateY(-2px);
  515.             box-shadow:0 6px 20px rgba(138,99,193,.4);
  516.         }
  517.         .hero-cta-btn svg{width:15px;height:15px;flex-shrink:0;stroke:#fff !important;color:#fff !important}
  518.         .hero-cta-btn span{color:#fff !important}
  519.         @media(max-width:540px){.hero-cta{flex-direction:column;align-items:stretch}.hero-cta-btn{justify-content:center}}
  521.         /* ═══ Boutons stores — VIOLET PLEIN BLANC ═══ */
  522.         .hero-stores{
  523.             display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  524.             margin-bottom:48px;
  525.             opacity:0;animation:wrFadeUp .9s ease .85s forwards;
  526.         }
  527.         .hero-store-btn{
  528.             display:inline-flex;align-items:center;gap:10px;
  529.             padding:13px 24px;border-radius:12px;
  530.             background:var(--wr-violet);
  531.             border:0;
  532.             color:#fff;
  533.             font-size:14px;font-weight:600;
  534.             text-decoration:none;
  535.             transition:background .15s,transform .15s,box-shadow .15s;
  536.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  537.         }
  538.         .hero-store-btn:hover{
  539.             background:var(--wr-violet-dark);
  540.             color:#fff;
  541.             transform:translateY(-2px);
  542.             box-shadow:0 8px 22px rgba(138,99,192,.4);
  543.             text-decoration:none;
  544.         }
  545.         .hero-store-btn-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px}
  546.         .hero-store-btn-icon svg{width:18px;height:18px}
  547.         @media(max-width:540px){.hero-stores{flex-direction:column;align-items:stretch;gap:10px}.hero-store-btn{justify-content:center}}
  549.         /* ═══════════════════════════════════════════════════════════════════
  550.            LISTE PAR DÉFAUT SOUS LE HERO (offres récentes)
  551.            ═══════════════════════════════════════════════════════════════════ */
  552.         .hero-default-jobs{
  553.             position:relative;z-index:2;
  554.             max-width:1200px;margin:0 auto;
  555.             background:var(--wr-card);
  556.             border:1px solid var(--wr-line);
  557.             border-radius:18px;
  558.             padding:8px 0;
  559.             box-shadow:var(--wr-shadow);
  560.             opacity:0;animation:wrFadeUp .9s ease 1s forwards;
  561.             text-align:left;
  562.         }
  563.         .hero-default-job{
  564.             display:flex;align-items:center;gap:16px;
  565.             padding:14px 22px;
  566.             text-decoration:none;color:inherit;
  567.             border-bottom:1px solid var(--wr-line);
  568.             transition:background .15s;
  569.         }
  570.         .hero-default-job:last-child{border-bottom:0}
  571.         .hero-default-job:hover{background:var(--wr-violet-softer);text-decoration:none;color:inherit}
  572.         .hero-default-job-logo{
  573.             width:42px;height:42px;border-radius:11px;flex-shrink:0;
  574.             display:flex;align-items:center;justify-content:center;
  575.             font-weight:700;font-size:16px;overflow:hidden;
  576.         }
  577.         .hero-default-job-logo img{width:100%;height:100%;object-fit:cover}
  578.         /* 7 variantes de couleurs cyclées par index */
  579.         .hero-default-job:nth-child(7n+1) .hero-default-job-logo{background:var(--wr-acc-yellow);color:var(--wr-acc-yellow-fg)}
  580.         .hero-default-job:nth-child(7n+2) .hero-default-job-logo{background:var(--wr-acc-green);color:var(--wr-acc-green-fg)}
  581.         .hero-default-job:nth-child(7n+3) .hero-default-job-logo{background:var(--wr-acc-pink);color:var(--wr-acc-pink-fg)}
  582.         .hero-default-job:nth-child(7n+4) .hero-default-job-logo{background:var(--wr-acc-blue);color:var(--wr-acc-blue-fg)}
  583.         .hero-default-job:nth-child(7n+5) .hero-default-job-logo{background:var(--wr-acc-orange);color:var(--wr-acc-orange-fg)}
  584.         .hero-default-job:nth-child(7n+6) .hero-default-job-logo{background:var(--wr-acc-violet);color:var(--wr-acc-violet-fg)}
  585.         .hero-default-job:nth-child(7n+7) .hero-default-job-logo{background:var(--wr-acc-cyan);color:var(--wr-acc-cyan-fg)}
  586.         .hero-default-job-info{flex:1;min-width:0}
  587.         .hero-default-job-title{
  588.             font-weight:600;font-size:14.5px;color:var(--wr-ink);
  589.             margin:0 0 2px;line-height:1.3;
  590.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  591.         }
  592.         .hero-default-job-meta{
  593.             font-size:12.5px;color:var(--wr-muted);margin:0;
  594.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  595.             display:flex;align-items:center;gap:8px;
  596.         }
  597.         .hero-default-job-meta-sep{display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--wr-muted-2);flex-shrink:0}
  598.         .hero-default-job-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  599.         .hero-default-job-arrow svg{width:15px;height:15px}
  600.         .hero-default-job:hover .hero-default-job-arrow{color:var(--wr-violet);transform:translateX(3px)}
  602.         @media(max-width:768px){
  603.             .hero-default-jobs{margin:0 -18px;border-radius:14px}
  604.             .hero-default-job{padding:12px 16px;gap:12px}
  605.             .hero-default-job-logo{width:36px;height:36px;font-size:13px}
  606.             .hero-default-job-title{font-size:13.5px}
  607.             .hero-default-job-meta{font-size:11.5px;gap:6px;flex-wrap:wrap;white-space:normal}
  608.         }
  610.         /* ═══════════════════════════════════════════════════════════════════
  611.            SECTION : 3 PARCOURS
  612.            ═══════════════════════════════════════════════════════════════════ */
  613.         .paths-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  614.         @media(max-width:991px){.paths-grid{grid-template-columns:1fr;gap:14px}}
  616.         .path-card{
  617.             position:relative;
  618.             background:var(--wr-card);
  619.             border:1px solid var(--wr-line);
  620.             border-radius:20px;padding:28px;
  621.             display:flex;flex-direction:column;
  622.             transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  623.             box-shadow:var(--wr-shadow);
  624.         }
  625.         .path-card:hover{transform:translateY(-4px);box-shadow:var(--wr-shadow-hover);border-color:var(--wr-violet-2)}
  626.         .path-card-illu{
  627.             width:64px;height:64px;border-radius:16px;
  628.             background:var(--wr-violet-soft);color:var(--wr-violet);
  629.             display:flex;align-items:center;justify-content:center;
  630.             margin-bottom:22px;
  631.         }
  632.         .path-card-illu svg{width:30px;height:30px}
  633.         .path-card-label{
  634.             display:inline-block;
  635.             font-size:11px;font-weight:600;
  636.             color:var(--wr-violet-dark);text-transform:uppercase;letter-spacing:.1em;
  637.             margin-bottom:10px;align-self:flex-start;
  638.         }
  639.         .path-card-title{
  640.             font-weight:500;font-size:22px;line-height:1.25;letter-spacing:-0.015em;
  641.             color:var(--wr-ink);margin:0 0 10px;
  642.         }
  643.         .path-card-desc{
  644.             font-size:14px;line-height:1.6;color:var(--wr-muted);
  645.             margin:0 0 22px;flex:1;
  646.         }
  647.         .path-card-cta{
  648.             display:inline-flex;align-items:center;justify-content:center;gap:6px;
  649.             background:var(--wr-violet);color:#fff;
  650.             padding:12px 18px;border-radius:11px;
  651.             font-size:13px;font-weight:600;
  652.             align-self:stretch;
  653.             transition:background .15s,transform .15s,box-shadow .15s;
  654.             box-shadow:0 2px 8px rgba(138,99,192,.2);
  655.         }
  656.         .path-card-cta:hover{background:var(--wr-violet-dark);color:#fff;text-decoration:none;transform:translateY(-1px);box-shadow:0 4px 12px rgba(138,99,192,.3)}
  657.         .path-card-cta svg{width:13px;height:13px;transition:transform .15s}
  658.         .path-card-cta:hover svg{transform:translateX(3px)}
  660.         /* ═══════════════════════════════════════════════════════════════════
  661.            COMMENT ÇA MARCHE — Card crème englobante avec 3 sous-cards
  662.            ═══════════════════════════════════════════════════════════════════ */
  663.         .how-card{
  664.             background:#F4ECE1;
  665.             border-radius:24px;
  666.             padding:32px 24px;
  667.             display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  668.             position:relative;
  669.         }
  670.         @media(max-width:991px){.how-card{grid-template-columns:1fr;gap:8px;padding:24px 16px}}
  671.         @media(min-width:992px){
  672.             /* Séparateurs verticaux entre les 3 cellules */
  673.             .how-card .how-step + .how-step{border-left:1px solid rgba(28,25,22,.08)}
  674.         }
  676.         .how-step{
  677.             display:flex;flex-direction:column;align-items:center;text-align:center;
  678.             padding:16px 20px;
  679.             gap:16px;
  680.         }
  681.         .how-step-illu{
  682.             width:100%;max-width:280px;aspect-ratio:1/1;
  683.             border-radius:16px;
  684.             background:rgba(255,255,255,.5);
  685.             display:flex;align-items:center;justify-content:center;
  686.             margin-bottom:4px;
  687.             overflow:hidden;
  688.         }
  689.         .how-step-illu img{width:100%;height:100%;object-fit:contain;display:block}
  690.         .how-step-illu svg{width:55%;height:55%;opacity:.85}
  691.         .how-step-title{
  692.             font-weight:700;font-size:18px;line-height:1.3;letter-spacing:-0.01em;
  693.             color:var(--wr-ink);margin:0;
  694.         }
  695.         @media(min-width:992px){.how-step-title{font-size:20px}}
  696.         .how-step-desc{
  697.             font-size:14px;line-height:1.55;color:var(--wr-ink-2);
  698.             margin:0;max-width:320px;
  699.         }
  701.         /* ═══════════════════════════════════════════════════════════════════
  702.            FEATURES 01-04 — Splits alternés image/texte avec témoignages
  703.            ═══════════════════════════════════════════════════════════════════ */
  704.         .feat-block{
  705.             display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
  706.             margin-bottom:64px;
  707.         }
  708.         .feat-block:last-child{margin-bottom:0}
  709.         @media(max-width:991px){
  710.             .feat-block{grid-template-columns:1fr;gap:24px;margin-bottom:48px}
  711.         }
  713.         /* Alterner : 01 illu droite, 02 illu gauche, 03 illu droite, 04 illu gauche */
  714.         .feat-block:nth-child(odd) .feat-illu{order:2}
  715.         .feat-block:nth-child(odd) .feat-content{order:1}
  716.         .feat-block:nth-child(even) .feat-illu{order:1}
  717.         .feat-block:nth-child(even) .feat-content{order:2}
  718.         @media(max-width:991px){
  719.             .feat-block .feat-illu{order:1}
  720.             .feat-block .feat-content{order:2}
  721.         }
  723.         .feat-illu{
  724.             background:#F5EDE3;
  725.             border-radius:20px;
  726.             aspect-ratio:1/1;
  727.             display:flex;align-items:center;justify-content:center;
  728.             color:var(--wr-violet);
  729.             overflow:hidden;
  730.             position:relative;
  731.         }
  732.         .feat-illu img{width:100%;height:100%;object-fit:contain;display:block}
  733.         .feat-illu svg{width:50%;height:50%;opacity:.85}
  735.         .feat-content{display:flex;flex-direction:column;gap:18px}
  736.         .feat-label{
  737.             font-size:30px;font-weight:800;
  738.             color:var(--wr-ink);
  739.             letter-spacing:-0.02em;
  740.             margin:0;line-height:1;
  741.         }
  742.         .feat-title{
  743.             font-weight:700;font-size:24px;line-height:1.2;letter-spacing:-0.02em;
  744.             color:var(--wr-ink);margin:0;
  745.         }
  746.         @media(min-width:768px){.feat-title{font-size:28px}}
  747.         @media(min-width:1100px){.feat-title{font-size:30px}}
  748.         .feat-desc{
  749.             display:flex;flex-direction:column;gap:14px;
  750.         }
  751.         .feat-desc p{
  752.             font-size:15px;line-height:1.6;color:var(--wr-ink-2);
  753.             margin:0;opacity:.85;
  754.         }
  755.         @media(min-width:1100px){.feat-desc p{font-size:16px}}
  756.         .feat-desc strong{color:var(--wr-ink);font-weight:700;opacity:1}
  758.         .feat-quote{
  759.             background:var(--wr-card);
  760.             border:1px solid var(--wr-line);
  761.             border-radius:14px;
  762.             padding:18px 20px;
  763.             display:flex;flex-direction:column;gap:10px;
  764.             margin-top:8px;
  765.         }
  766.         .feat-quote-text{
  767.             font-size:14px;line-height:1.55;color:var(--wr-ink-2);
  768.             margin:0;font-style:italic;
  769.         }
  770.         .feat-quote-author{
  771.             display:flex;flex-direction:column;
  772.         }
  773.         .feat-quote-name{font-size:13px;font-weight:700;color:var(--wr-ink);margin:0}
  774.         .feat-quote-role{font-size:12px;color:var(--wr-muted);margin:0}
  776.         /* ═══════════════════════════════════════════════════════════════════
  777.            MATCH
  778.            ═══════════════════════════════════════════════════════════════════ */
  779.         .match-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
  780.         @media(max-width:991px){.match-grid{grid-template-columns:1fr;gap:40px}}
  781.         .match-text .wr-title{margin-left:0;text-align:left}
  782.         .match-text .wr-lede{margin-left:0;text-align:left}
  783.         .match-text .wr-eyebrow{margin-bottom:20px}
  785.         .match-features{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:32px}
  786.         @media(max-width:540px){.match-features{grid-template-columns:1fr}}
  787.         .match-feature{
  788.             background:var(--wr-card);border:1px solid var(--wr-line);
  789.             border-radius:14px;padding:18px;
  790.             transition:transform .15s,border-color .15s,box-shadow .15s;
  791.         }
  792.         .match-feature:hover{transform:translateY(-2px);border-color:var(--wr-violet-soft);box-shadow:var(--wr-shadow)}
  793.         .match-feature-icon{
  794.             width:34px;height:34px;border-radius:10px;
  795.             background:var(--wr-violet-soft);color:var(--wr-violet);
  796.             display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px;
  797.         }
  798.         .match-feature-icon svg{width:16px;height:16px}
  799.         .match-feature-title{font-weight:600;font-size:14px;line-height:1.3;color:var(--wr-ink);margin:0 0 5px}
  800.         .match-feature-desc{font-size:12.5px;line-height:1.5;color:var(--wr-muted);margin:0}
  802.         .match-visual{position:relative;display:flex;justify-content:center;align-items:center;padding:40px 0}
  803.         .match-stack{position:relative;width:100%;max-width:340px;height:340px}
  804.         .match-stack-card{
  805.             position:absolute;
  806.             background:var(--wr-card);border:1px solid var(--wr-line);
  807.             border-radius:16px;padding:14px;
  808.             display:flex;align-items:center;gap:12px;
  809.             box-shadow:var(--wr-shadow);width:100%;
  810.             transition:transform .3s ease,box-shadow .3s ease;
  811.             cursor:pointer;
  812.         }
  813.         .match-stack-card:hover{
  814.             transform:translateY(-4px) rotate(0deg)!important;
  815.             box-shadow:0 20px 50px rgba(138,99,192,.22)!important;
  816.             z-index:10!important;
  817.         }
  818.         .match-stack-card:nth-child(1){top:0;transform:rotate(-6deg) translateX(-10px);z-index:1;animation:wrFloat1 6s ease-in-out infinite}
  819.         .match-stack-card:nth-child(2){top:78px;left:14px;transform:rotate(2deg);z-index:3;box-shadow:0 16px 40px rgba(138,99,192,.18);animation:wrFloat2 6s ease-in-out -2s infinite}
  820.         .match-stack-card:nth-child(3){top:156px;transform:rotate(-3deg) translateX(8px);z-index:2;animation:wrFloat3 6s ease-in-out -4s infinite}
  821.         .match-stack-card:nth-child(4){top:234px;left:20px;transform:rotate(4deg);z-index:1;animation:wrFloat4 6s ease-in-out -1s infinite}
  822.         @keyframes wrFloat1{0%,100%{transform:rotate(-6deg) translate(-10px,0)}50%{transform:rotate(-6deg) translate(-10px,-8px)}}
  823.         @keyframes wrFloat2{0%,100%{transform:rotate(2deg) translate(0,0)}50%{transform:rotate(2deg) translate(0,-6px)}}
  824.         @keyframes wrFloat3{0%,100%{transform:rotate(-3deg) translate(8px,0)}50%{transform:rotate(-3deg) translate(8px,-7px)}}
  825.         @keyframes wrFloat4{0%,100%{transform:rotate(4deg) translate(0,0)}50%{transform:rotate(4deg) translate(0,-5px)}}
  826.         .match-stack-logo{
  827.             width:38px;height:38px;border-radius:10px;
  828.             background:var(--wr-violet-soft);color:var(--wr-violet);
  829.             display:flex;align-items:center;justify-content:center;
  830.             font-weight:700;font-size:14px;flex-shrink:0;
  831.         }
  832.         .match-stack-info{flex:1;min-width:0}
  833.         .match-stack-title{font-weight:600;font-size:13px;color:var(--wr-ink);margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
  834.         .match-stack-meta{font-size:11px;color:var(--wr-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  835.         .match-stack-heart{
  836.             width:28px;height:28px;border-radius:50%;
  837.             background:#FEE2E2;color:#EF4444;
  838.             display:flex;align-items:center;justify-content:center;flex-shrink:0;
  839.             animation:wrHeartbeat 1.6s ease-in-out infinite;
  840.         }
  841.         .match-stack-card:nth-child(1) .match-stack-heart{animation-delay:0s}
  842.         .match-stack-card:nth-child(2) .match-stack-heart{animation-delay:.4s}
  843.         .match-stack-card:nth-child(3) .match-stack-heart{animation-delay:.8s}
  844.         .match-stack-card:nth-child(4) .match-stack-heart{animation-delay:1.2s}
  845.         .match-stack-heart svg{width:13px;height:13px;fill:currentColor}
  846.         @keyframes wrHeartbeat{
  847.             0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(239,68,68,.4)}
  848.             10%{transform:scale(1.18);box-shadow:0 0 0 0 rgba(239,68,68,.4)}
  849.             20%{transform:scale(1)}
  850.             30%{transform:scale(1.12)}
  851.             40%{transform:scale(1);box-shadow:0 0 0 10px rgba(239,68,68,0)}
  852.             100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}
  853.         }
  855.         /* ═══════════════════════════════════════════════════════════════════
  856.            SIGNUP FORM (entre feat 02 et 03)
  857.            ═══════════════════════════════════════════════════════════════════ */
  858.         .signup-card{
  859.             position:relative;
  860.             max-width:980px;margin:64px auto;
  861.             background:linear-gradient(135deg, #FFFFFF 0%, #FAF7FF 100%);
  862.             border:1px solid var(--wr-line);
  863.             border-radius:32px;
  864.             padding:48px 40px;
  865.             box-shadow:0 4px 12px rgba(30,27,46,.04), 0 24px 64px rgba(138,99,192,.1);
  866.             overflow:hidden;
  867.         }
  868.         @media(max-width:768px){.signup-card{padding:32px 22px;border-radius:24px;margin:48px auto}}
  870.         /* Décor : 2 blobs violet pâle dans les coins */
  871.         .signup-card::before{
  872.             content:\"\";position:absolute;
  873.             top:-120px;right:-120px;width:340px;height:340px;
  874.             background:radial-gradient(circle,rgba(138,99,192,.12) 0%,transparent 65%);
  875.             pointer-events:none;filter:blur(40px);
  876.         }
  877.         .signup-card::after{
  878.             content:\"\";position:absolute;
  879.             bottom:-100px;left:-80px;width:280px;height:280px;
  880.             background:radial-gradient(circle,rgba(138,99,192,.08) 0%,transparent 65%);
  881.             pointer-events:none;filter:blur(40px);
  882.         }
  884.         .signup-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center}
  885.         @media(max-width:880px){.signup-inner{grid-template-columns:1fr;gap:28px}}
  887.         .signup-text{display:flex;flex-direction:column;gap:14px}
  888.         .signup-eyebrow{
  889.             display:inline-flex;align-items:center;gap:8px;
  890.             padding:7px 14px;border-radius:100px;
  891.             background:var(--wr-violet-soft);color:var(--wr-violet-dark);
  892.             font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  893.             align-self:flex-start;
  894.         }
  895.         .signup-title{
  896.             font-weight:700;font-size:28px;line-height:1.15;letter-spacing:-0.02em;
  897.             color:var(--wr-ink);margin:0;
  898.         }
  899.         @media(min-width:768px){.signup-title{font-size:34px}}
  900.         .signup-lede{font-size:15px;line-height:1.55;color:var(--wr-ink-2);margin:0;opacity:.85}
  902.         .signup-perks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
  903.         .signup-perk{
  904.             display:inline-flex;align-items:center;gap:6px;
  905.             padding:6px 12px;border-radius:100px;
  906.             background:var(--wr-card);border:1px solid var(--wr-line-2);
  907.             font-size:12px;font-weight:600;color:var(--wr-ink-2);
  908.         }
  909.         .signup-perk svg{width:13px;height:13px;color:#10B981;stroke-width:3;flex-shrink:0}
  911.         .signup-form{
  912.             background:var(--wr-card);
  913.             border:1px solid var(--wr-line);
  914.             border-radius:20px;
  915.             padding:24px;
  916.             display:flex;flex-direction:column;gap:12px;
  917.             box-shadow:0 1px 2px rgba(30,27,46,.03);
  918.         }
  919.         .signup-form-error{
  920.             background:#FEF2F2;border:1px solid #FECACA;
  921.             color:#991B1B;
  922.             border-radius:12px;
  923.             padding:10px 14px;
  924.             font-size:13px;line-height:1.45;
  925.             margin:0;
  926.         }
  927.         .signup-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  928.         @media(max-width:540px){.signup-row{grid-template-columns:1fr}}
  929.         .signup-field{display:flex;flex-direction:column;gap:0}
  930.         .signup-card .signup-form input[type=\"email\"],
  931.         .signup-card .signup-form input[type=\"password\"],
  932.         .signup-card .signup-form input[type=\"text\"]{
  933.             width:100%;
  934.             padding:13px 14px;
  935.             border:1px solid var(--wr-line-2);border-radius:11px;
  936.             background:#FAFBFD;
  937.             font-size:14px;font-family:inherit;color:var(--wr-ink);
  938.             outline:none;
  939.             transition:border-color .15s,background .15s,box-shadow .15s;
  940.             box-sizing:border-box;
  941.         }
  942.         .signup-card .signup-form input[type=\"email\"]:focus,
  943.         .signup-card .signup-form input[type=\"password\"]:focus,
  944.         .signup-card .signup-form input[type=\"text\"]:focus{
  945.             border-color:var(--wr-violet);background:#fff;
  946.             box-shadow:0 0 0 3px rgba(138,99,192,.12);
  947.         }
  948.         .signup-card .signup-form input::placeholder{color:var(--wr-muted-2)}
  950.         .signup-terms{
  951.             display:flex;align-items:flex-start;gap:10px;
  952.             font-size:12.5px;line-height:1.45;color:var(--wr-muted);
  953.             margin:4px 0 0;
  954.         }
  955.         .signup-card .signup-form input[type=\"checkbox\"]{
  956.             width:16px;height:16px;flex-shrink:0;margin-top:2px;accent-color:var(--wr-violet);cursor:pointer;
  957.         }
  958.         .signup-terms a{color:var(--wr-violet);font-weight:600;text-decoration:underline}
  959.         .signup-terms a:hover{color:var(--wr-violet-dark)}
  961.         .signup-recaptcha{margin:4px 0 0}
  962.         .signup-recaptcha > div{max-width:100%}
  964.         .signup-submit{
  965.             width:100%;
  966.             padding:14px 22px;border-radius:12px;
  967.             background:var(--wr-violet);color:#fff;border:0;
  968.             font-size:14.5px;font-weight:700;font-family:inherit;
  969.             cursor:pointer;
  970.             display:inline-flex;align-items:center;justify-content:center;gap:8px;
  971.             box-shadow:0 4px 14px rgba(138,99,192,.32);
  972.             transition:background .15s,transform .15s,box-shadow .15s;
  973.             margin-top:6px;
  974.         }
  975.         .signup-submit:hover{background:var(--wr-violet-dark);transform:translateY(-1px);box-shadow:0 6px 20px rgba(138,99,192,.4)}
  976.         .signup-submit svg{width:14px;height:14px;transition:transform .15s}
  977.         .signup-submit:hover svg{transform:translateX(3px)}
  979.         .signup-login{
  980.             text-align:center;font-size:13px;color:var(--wr-muted);margin:6px 0 0;
  981.         }
  982.         .signup-login a{color:var(--wr-violet);font-weight:600;text-decoration:none}
  983.         .signup-login a:hover{color:var(--wr-violet-dark);text-decoration:underline}
  985.         /* ═══════════════════════════════════════════════════════════════════
  986.            APPS
  987.            ═══════════════════════════════════════════════════════════════════ */
  988.         .apps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  989.         @media(max-width:768px){.apps-grid{grid-template-columns:1fr}}
  990.         .app-card{
  991.             background:var(--wr-card);border:1px solid var(--wr-line);
  992.             border-radius:18px;padding:24px;
  993.             display:flex;flex-direction:column;align-items:flex-start;
  994.             transition:transform .2s,border-color .2s,box-shadow .2s;
  995.         }
  996.         .app-card:hover{transform:translateY(-3px);border-color:var(--wr-violet-2);box-shadow:var(--wr-shadow-hover);color:inherit;text-decoration:none}
  997.         .app-card-icon{
  998.             width:48px;height:48px;border-radius:14px;
  999.             background:var(--wr-violet-soft);color:var(--wr-violet);
  1000.             display:inline-flex;align-items:center;justify-content:center;
  1001.             margin-bottom:18px;
  1002.         }
  1003.         .app-card-icon svg{width:22px;height:22px}
  1004.         .app-card-name{font-weight:500;font-size:18px;letter-spacing:-0.01em;color:var(--wr-ink);margin:0 0 6px}
  1005.         .app-card-desc{font-size:13px;line-height:1.5;color:var(--wr-muted);margin:0 0 16px;flex:1}
  1006.         .app-card-cta{font-size:12px;font-weight:600;color:var(--wr-violet);text-transform:uppercase;letter-spacing:.1em;display:inline-flex;align-items:center;gap:6px}
  1007.         .app-card-cta svg{width:11px;height:11px;transition:transform .15s}
  1008.         .app-card:hover .app-card-cta svg{transform:translateX(3px)}
  1010.         /* ═══════════════════════════════════════════════════════════════════
  1011.            KEYWORDS
  1012.            ═══════════════════════════════════════════════════════════════════ */
  1013.         .keywords-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:1200px;margin:0 auto}
  1014.         .keyword-pill{
  1015.             display:inline-flex;align-items:center;gap:8px;
  1016.             padding:9px 16px;border-radius:100px;
  1017.             background:var(--wr-card);border:1px solid var(--wr-line-2);
  1018.             color:var(--wr-ink-2);
  1019.             font-size:13.5px;font-weight:500;
  1020.             transition:transform .15s,border-color .15s,background .15s,color .15s,box-shadow .15s;
  1021.         }
  1022.         .keyword-pill:hover{transform:translateY(-2px);border-color:var(--wr-violet);background:var(--wr-violet-soft);color:var(--wr-violet-dark);text-decoration:none;box-shadow:0 4px 10px rgba(138,99,192,.12)}
  1023.         .keyword-pill-icon{font-size:14px;line-height:1}
  1025.         /* ═══════════════════════════════════════════════════════════════════
  1026.            OFFRES POPULAIRES
  1027.            ═══════════════════════════════════════════════════════════════════ */
  1028.         .listings-block{margin-bottom:32px}
  1029.         .listings-block:last-child{margin-bottom:0}
  1030.         .listings-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
  1031.         .listings-block-title{
  1032.             display:inline-flex;align-items:center;gap:10px;
  1033.             font-weight:500;font-size:18px;letter-spacing:-0.005em;
  1034.             color:var(--wr-ink);margin:0;
  1035.         }
  1036.         .listings-block-icon{font-size:20px;line-height:1}
  1037.         .listings-block-link{
  1038.             display:inline-flex;align-items:center;gap:4px;
  1039.             padding:6px 12px;border-radius:100px;
  1040.             font-size:12px;font-weight:600;
  1041.             color:var(--wr-violet);
  1042.             text-transform:uppercase;letter-spacing:.06em;
  1043.             border:1px solid var(--wr-violet-soft);
  1044.             background:var(--wr-card);
  1045.             transition:background .15s,border-color .15s,transform .15s;
  1046.         }
  1047.         .listings-block-link:hover{background:var(--wr-violet-soft);border-color:var(--wr-violet);text-decoration:none;color:var(--wr-violet-dark);transform:translateX(2px)}
  1048.         .listings-block-link svg{width:11px;height:11px}
  1050.         .listings-jobs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  1051.         @media(max-width:768px){.listings-jobs{grid-template-columns:1fr}}
  1052.         .listing-job{
  1053.             display:flex;align-items:center;gap:14px;
  1054.             background:var(--wr-card);border:1px solid var(--wr-line);
  1055.             border-radius:14px;padding:12px;
  1056.             transition:transform .15s,border-color .15s,box-shadow .15s;
  1057.         }
  1058.         .listing-job:hover{transform:translateY(-2px);border-color:var(--wr-violet-soft);box-shadow:var(--wr-shadow);color:inherit;text-decoration:none}
  1059.         .listing-job-logo{
  1060.             width:42px;height:42px;border-radius:11px;flex-shrink:0;
  1061.             background:var(--wr-violet-soft);color:var(--wr-violet);
  1062.             display:flex;align-items:center;justify-content:center;
  1063.             font-weight:700;font-size:14px;overflow:hidden;
  1064.         }
  1065.         .listing-job-logo img{width:100%;height:100%;object-fit:cover}
  1066.         .listing-job-info{flex:1;min-width:0}
  1067.         .listing-job-title{font-weight:600;font-size:13.5px;color:var(--wr-ink);margin:0 0 2px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  1068.         .listing-job-meta{font-size:11.5px;color:var(--wr-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  1069.         .listing-job-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  1070.         .listing-job-arrow svg{width:14px;height:14px}
  1071.         .listing-job:hover .listing-job-arrow{color:var(--wr-violet);transform:translateX(2px)}
  1073.         /* ═══════════════════════════════════════════════════════════════════
  1074.            ARTICLES — Liste sans miniatures (style identique aux jobs-card)
  1075.            ═══════════════════════════════════════════════════════════════════ */
  1076.         .articles-list{display:flex;flex-direction:column;gap:10px;max-width:1200px;margin:0 auto}
  1077.         .wr-article{
  1078.             background:var(--wr-card);border-radius:14px;padding:14px;
  1079.             box-shadow:0 0 16px 0 rgba(0,0,0,0.04);
  1080.             display:flex;align-items:center;gap:14px;
  1081.             text-decoration:none;color:inherit;
  1082.             transition:transform .15s,box-shadow .2s;
  1083.         }
  1084.         .wr-article:hover{
  1085.             transform:translateY(-1px);
  1086.             box-shadow:0 4px 20px rgba(138,99,192,.1);
  1087.             color:inherit;text-decoration:none;
  1088.         }
  1089.         .wr-article-logo{
  1090.             width:50px;height:50px;border-radius:12px;flex-shrink:0;
  1091.             background:linear-gradient(135deg,#EDE9FE,#DDD6FE);
  1092.             display:flex;align-items:center;justify-content:center;
  1093.             color:var(--wr-violet);overflow:hidden;
  1094.         }
  1095.         .wr-article-logo svg{width:24px;height:24px;opacity:.9}
  1096.         .wr-article-info{flex:1;min-width:0}
  1097.         .wr-article-title{
  1098.             font-size:14px;font-weight:700;color:var(--wr-ink);
  1099.             line-height:1.3;margin:0 0 4px;
  1100.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  1101.         }
  1102.         .wr-article-meta{
  1103.             font-size:12px;color:var(--wr-muted);
  1104.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  1105.             display:flex;align-items:center;gap:8px;margin:0;
  1106.         }
  1107.         .wr-article-meta-sep{display:inline-block;width:3px;height:3px;border-radius:50%;background:#D1D5DB;flex-shrink:0}
  1108.         .wr-article-badge{
  1109.             font-size:11px;font-weight:600;
  1110.             color:var(--wr-violet);background:var(--wr-violet-soft);
  1111.             padding:3px 9px;border-radius:100px;
  1112.             white-space:nowrap;flex-shrink:0;
  1113.             text-transform:uppercase;letter-spacing:.04em;
  1114.         }
  1115.         .wr-article-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  1116.         .wr-article:hover .wr-article-arrow{color:var(--wr-violet);transform:translateX(2px)}
  1117.         .wr-article-arrow svg{width:18px;height:18px}
  1118.         @media(max-width:540px){
  1119.             .wr-article{padding:12px;gap:10px}
  1120.             .wr-article-logo{width:42px;height:42px}
  1121.             .wr-article-logo svg{width:20px;height:20px}
  1122.             .wr-article-title{font-size:13px}
  1123.             .wr-article-meta{font-size:11px;gap:6px;flex-wrap:wrap;white-space:normal}
  1124.             .wr-article-badge{display:none}
  1125.         }
  1127.         .articles-cta{text-align:center;margin-top:36px}
  1128.         .articles-cta a{
  1129.             display:inline-flex;align-items:center;gap:8px;
  1130.             padding:12px 22px;border-radius:11px;
  1131.             background:var(--wr-violet);color:#fff;
  1132.             font-size:13px;font-weight:600;
  1133.             text-decoration:none;
  1134.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  1135.             transition:background .15s,transform .15s,box-shadow .15s;
  1136.         }
  1137.         .articles-cta a:hover{background:var(--wr-violet-dark);transform:translateY(-2px);box-shadow:0 6px 18px rgba(138,99,192,.4);text-decoration:none;color:#fff}
  1138.         .articles-cta svg{width:12px;height:12px;transition:transform .15s}
  1139.         .articles-cta a:hover svg{transform:translateX(3px)}
  1141.         /* ═══════════════════════════════════════════════════════════════════
  1142.            CTA FINAL — Card violet plein avec eyebrow + 2 sous-cards
  1143.            ═══════════════════════════════════════════════════════════════════ */
  1144.         .final-card{
  1145.             position:relative;
  1146.             background:linear-gradient(135deg,#8A63C0 0%,#9D7BCC 100%);
  1147.             border-radius:28px;
  1148.             padding:48px 40px;
  1149.             color:#fff;overflow:hidden;
  1150.             box-shadow:0 20px 60px -12px rgba(138,99,192,.4);
  1151.         }
  1152.         @media(max-width:768px){.final-card{padding:32px 22px;border-radius:22px}}
  1154.         .final-eyebrow{
  1155.             display:inline-flex;align-items:center;gap:8px;
  1156.             padding:8px 18px;border-radius:100px;
  1157.             background:rgba(255,255,255,.2);
  1158.             color:#fff;
  1159.             font-size:12px;font-weight:700;
  1160.             text-transform:uppercase;letter-spacing:.12em;
  1161.             margin-bottom:20px;
  1162.             backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  1163.         }
  1164.         .final-eyebrow svg{width:13px;height:13px;fill:currentColor}
  1166.         .final-title{
  1167.             font-weight:800;font-size:28px;line-height:1.15;letter-spacing:-0.02em;
  1168.             color:#fff;margin:0 0 36px;
  1169.             max-width:780px;
  1170.         }
  1171.         @media(min-width:768px){.final-title{font-size:38px}}
  1173.         /* Grille 2 sous-cards */
  1174.         .final-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  1175.         @media(max-width:768px){.final-grid{grid-template-columns:1fr;gap:14px}}
  1177.         .final-sub{
  1178.             background:#fff;
  1179.             border-radius:18px;
  1180.             padding:28px;
  1181.             display:flex;flex-direction:column;
  1182.         }
  1183.         @media(max-width:768px){.final-sub{padding:22px}}
  1185.         .final-sub-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
  1186.         .final-sub-icon{
  1187.             width:44px;height:44px;border-radius:11px;
  1188.             background:var(--wr-violet-soft);color:var(--wr-violet);
  1189.             display:flex;align-items:center;justify-content:center;flex-shrink:0;
  1190.         }
  1191.         .final-sub-icon svg{width:22px;height:22px}
  1192.         .final-sub-label{
  1193.             font-size:12.5px;font-weight:700;
  1194.             color:var(--wr-violet);
  1195.             text-transform:uppercase;letter-spacing:.1em;
  1196.         }
  1197.         .final-sub-title{
  1198.             font-weight:800;font-size:18px;line-height:1.3;letter-spacing:-0.01em;
  1199.             color:var(--wr-ink);margin:0 0 10px;
  1200.         }
  1201.         .final-sub-desc{
  1202.             font-size:14px;line-height:1.55;color:var(--wr-muted);
  1203.             margin:0 0 24px;flex:1;
  1204.         }
  1205.         .final-sub-btn{
  1206.             display:flex;align-items:center;justify-content:center;gap:8px;
  1207.             background:var(--wr-violet);color:#fff;
  1208.             padding:14px 18px;border-radius:11px;
  1209.             font-size:14px;font-weight:700;
  1210.             text-decoration:none;
  1211.             transition:background .15s,transform .15s,box-shadow .15s;
  1212.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  1213.         }
  1214.         .final-sub-btn:hover{
  1215.             background:var(--wr-violet-dark);color:#fff;
  1216.             transform:translateY(-2px);
  1217.             box-shadow:0 6px 18px rgba(138,99,192,.4);
  1218.             text-decoration:none;
  1219.         }
  1220.         .final-sub-btn svg{width:14px;height:14px;transition:transform .15s}
  1221.         .final-sub-btn:hover svg{transform:translateX(3px)}
  1222.     </style>
  1223. ";
  1224.         
  1225.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  1227.         
  1228.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  1230.         yield from [];
  1231.     }
  1233.     // line 1073
  1234.     /**
  1235.      * @return iterable<null|scalar|\Stringable>
  1236.      */
  1237.     public function block_body(array $context, array $blocks = []): iterable
  1238.     {
  1239.         $macros = $this->macros;
  1240.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  1241.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  1243.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  1244.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));
  1246.         // line 1074
  1247.         yield "    <div class=\"wr\">
  1249.         ";
  1250.         // line 1077
  1251.         yield "        <section class=\"hero\">
  1252.             <div class=\"hero-inner\">
  1253.             <span class=\"hero-badge\">
  1254.                 <span class=\"hero-badge-dot\"></span>
  1255.                 ";
  1256.         // line 1081
  1257.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1081, $this->source); })()), "hero_eyebrow", [], "any", false, false, false, 1081), "html", null, true);
  1258.         yield "
  1259.             </span>
  1261.                 <h1 class=\"hero-title\">
  1262.                     <span class=\"hero-title-accent\">";
  1263.         // line 1085
  1264.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1085, $this->source); })()), "hero_title_accent", [], "any", false, false, false, 1085), "html", null, true);
  1265.         yield "</span> ";
  1266.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1085, $this->source); })()), "hero_title_post", [], "any", false, false, false, 1085), "html", null, true);
  1267.         yield "<br>
  1268.                     <span class=\"hero-title-accent\">";
  1269.         // line 1086
  1270.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1086, $this->source); })()), "hero_title_accent2", [], "any", false, false, false, 1086), "html", null, true);
  1271.         yield "</span> ";
  1272.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1086, $this->source); })()), "hero_title_2", [], "any", false, false, false, 1086), "html", null, true);
  1273.         yield "
  1274.                 </h1>
  1276.                 <p class=\"hero-lede\">
  1277.                     ";
  1278.         // line 1090
  1279.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1090, $this->source); })()), "hero_lede_pre", [], "any", false, false, false, 1090), "html", null, true);
  1280.         yield "
  1281.                     <span class=\"hero-lede-accent\">";
  1282.         // line 1091
  1283.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1091, $this->source); })()), "hero_lede_brand", [], "any", false, false, false, 1091), "html", null, true);
  1284.         yield "</span>
  1285.                     ";
  1286.         // line 1092
  1287.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1092, $this->source); })()), "hero_lede_mid", [], "any", false, false, false, 1092), "html", null, true);
  1288.         yield "
  1289.                     <span class=\"hero-lede-accent\">";
  1290.         // line 1093
  1291.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1093, $this->source); })()), "hero_lede_word", [], "any", false, false, false, 1093), "html", null, true);
  1292.         yield "</span>
  1293.                     ";
  1294.         // line 1094
  1295.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1094, $this->source); })()), "hero_lede_post", [], "any", false, false, false, 1094), "html", null, true);
  1296.         yield "
  1297.                 </p>
  1299.                 ";
  1300.         // line 1098
  1301.         yield "                ";
  1302.         if ((array_key_exists("popularKeywords", $context) && (Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["popularKeywords"]) || array_key_exists("popularKeywords", $context) ? $context["popularKeywords"] : (function () { throw new RuntimeError('Variable "popularKeywords" does not exist.', 1098, $this->source); })())) > 0))) {
  1303.             // line 1099
  1304.             yield "                    <div class=\"hero-popular\">
  1305.                         <span class=\"hero-popular-label\">";
  1306.             // line 1100
  1307.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1100, $this->source); })()), "hero_popular_label", [], "any", false, false, false, 1100), "html", null, true);
  1308.             yield "</span>
  1309.                         ";
  1310.             // line 1101
  1311.             $context['_parent'] = $context;
  1312.             $context['_seq'] = CoreExtension::ensureTraversable(Twig\Extension\CoreExtension::slice($this->env->getCharset(), (isset($context["popularKeywords"]) || array_key_exists("popularKeywords", $context) ? $context["popularKeywords"] : (function () { throw new RuntimeError('Variable "popularKeywords" does not exist.', 1101, $this->source); })()), 0, 5));
  1313.             foreach ($context['_seq'] as $context["_key"] => $context["kw"]) {
  1314.                 // line 1102
  1315.                 yield "                            <button type=\"button\"
  1316.                                     class=\"hero-popular-pill\"
  1317.                                     data-keyword=\"";
  1318.                 // line 1104
  1319.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["kw"], "keyword", [], "any", false, false, false, 1104), "html", null, true);
  1320.                 yield "\"
  1321.                                     data-label=\"";
  1322.                 // line 1105
  1323.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["kw"], "label", [], "any", false, false, false, 1105), "html", null, true);
  1324.                 yield "\">
  1325.                                 ";
  1326.                 // line 1106
  1327.                 if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["kw"], "icon", [], "any", false, false, false, 1106)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1328.                     yield "<span class=\"hero-popular-pill-icon\">";
  1329.                     yield CoreExtension::getAttribute($this->env, $this->source, $context["kw"], "icon", [], "any", false, false, false, 1106);
  1330.                     yield "</span>";
  1331.                 }
  1332.                 // line 1107
  1333.                 yield "                                <span>";
  1334.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["kw"], "label", [], "any", false, false, false, 1107), "html", null, true);
  1335.                 yield "</span>
  1336.                             </button>
  1337.                         ";
  1338.             }
  1339.             $_parent = $context['_parent'];
  1340.             unset($context['_seq'], $context['_key'], $context['kw'], $context['_parent']);
  1341.             $context = array_intersect_key($context, $_parent) + $_parent;
  1342.             // line 1110
  1343.             yield "                    </div>
  1344.                 ";
  1345.         }
  1346.         // line 1112
  1347.         yield "
  1348.                 ";
  1349.         // line 1114
  1350.         yield "                <div class=\"hero-search-wrap\">
  1351.                     <div class=\"hero-search\" id=\"wrHeroSearch\"
  1352.                          data-search-url=\"";
  1353.         // line 1116
  1354.         if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1116, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1355.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_api_jobs_search", ["_locale" => "fr"]);
  1356.         } else {
  1357.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("api_jobs_search");
  1358.         }
  1359.         yield "\"
  1360.                          data-jobs-list-url=\"";
  1361.         // line 1117
  1362.         if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1117, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1363.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_whileresume_jobs_list", ["_locale" => "fr"]);
  1364.         } else {
  1365.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("whileresume_jobs_list");
  1366.         }
  1367.         yield "\">
  1368.                         <div class=\"hero-search-inner\">
  1369.                         <span class=\"hero-search-icon\">
  1370.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  1371.                                 <circle cx=\"11\" cy=\"11\" r=\"8\"/><path d=\"M21 21l-4.35-4.35\"/>
  1372.                             </svg>
  1373.                         </span>
  1374.                             <input type=\"text\" name=\"q\" id=\"wrHeroSearchInput\" class=\"hero-search-input\"
  1375.                                    placeholder=\"";
  1376.         // line 1125
  1377.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1125, $this->source); })()), "hero_search_placeholder", [], "any", false, false, false, 1125), "html", null, true);
  1378.         yield "\"
  1379.                                    autocomplete=\"off\" />
  1380.                             <span class=\"hero-search-kbd\">↵ ";
  1381.         // line 1127
  1382.         yield (((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1127, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) ? ("Entrée") : ("Enter"));
  1383.         yield "</span>
  1384.                             <button type=\"button\" class=\"hero-search-clear\" id=\"wrHeroSearchClear\" aria-label=\"";
  1385.         // line 1128
  1386.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1128, $this->source); })()), "search_clear", [], "any", false, false, false, 1128), "html", null, true);
  1387.         yield "\">
  1388.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  1389.                                     <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"/><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"/>
  1390.                                 </svg>
  1391.                             </button>
  1392.                         </div>
  1393.                     </div>
  1394.                 </div>
  1396.                 ";
  1397.         // line 1138
  1398.         yield "                ";
  1399.         // line 1139
  1400.         yield "                ";
  1401.         $context["_heroCount"] = 0;
  1402.         // line 1140
  1403.         yield "
  1404.                 <div class=\"hero-default-jobs\" id=\"wrHeroJobsList\">
  1405.                     <div class=\"hero-jobs-header\" id=\"wrHeroJobsHeader\">
  1406.                     <span class=\"hero-jobs-count\" id=\"wrHeroJobsCount\">
  1407.                         <strong>";
  1408.         // line 1144
  1409.         yield (((array_key_exists("totalJobs", $context) &&  !(null === $context["totalJobs"]))) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($context["totalJobs"], "html", null, true)) : (0));
  1410.         yield "</strong>";
  1411.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1144, $this->source); })()), "search_results_count", [], "any", false, false, false, 1144), "html", null, true);
  1412.         yield "
  1413.                     </span>
  1414.                         <a href=\"";
  1415.         // line 1146
  1416.         if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1146, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1417.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_whileresume_jobs_list", ["_locale" => "fr"]);
  1418.         } else {
  1419.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("whileresume_jobs_list");
  1420.         }
  1421.         yield "\" class=\"hero-jobs-link\" id=\"wrHeroJobsLink\">
  1422.                             ";
  1423.         // line 1147
  1424.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1147, $this->source); })()), "search_view_all", [], "any", false, false, false, 1147), "html", null, true);
  1425.         yield "
  1426.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  1427.                                 <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/>
  1428.                             </svg>
  1429.                         </a>
  1430.                     </div>
  1432.                     <div id=\"wrHeroJobsBody\">
  1433.                         ";
  1434.         // line 1155
  1435.         if ((array_key_exists("randomJobs", $context) && (Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["randomJobs"]) || array_key_exists("randomJobs", $context) ? $context["randomJobs"] : (function () { throw new RuntimeError('Variable "randomJobs" does not exist.', 1155, $this->source); })())) > 0))) {
  1436.             // line 1156
  1437.             yield "                            ";
  1438.             $context['_parent'] = $context;
  1439.             $context['_seq'] = CoreExtension::ensureTraversable((isset($context["randomJobs"]) || array_key_exists("randomJobs", $context) ? $context["randomJobs"] : (function () { throw new RuntimeError('Variable "randomJobs" does not exist.', 1156, $this->source); })()));
  1440.             foreach ($context['_seq'] as $context["_key"] => $context["j"]) {
  1441.                 // line 1157
  1442.                 yield "                                ";
  1443.                 if (((isset($context["_heroCount"]) || array_key_exists("_heroCount", $context) ? $context["_heroCount"] : (function () { throw new RuntimeError('Variable "_heroCount" does not exist.', 1157, $this->source); })()) < 6)) {
  1444.                     // line 1158
  1445.                     yield "                                    <a href=\"";
  1446.                     if ((CoreExtension::getAttribute($this->env, $this->source, $context["j"], "locale", [], "any", false, false, false, 1158) == "fr")) {
  1447.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_cvs_application_job_show", ["_locale" => CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1158, $this->source); })()), "request", [], "any", false, false, false, 1158), "locale", [], "any", false, false, false, 1158), "slug" => CoreExtension::getAttribute($this->env, $this->source, $context["j"], "slug", [], "any", false, false, false, 1158)]), "html", null, true);
  1448.                     } else {
  1449.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("cvs_application_job_show", ["slug" => CoreExtension::getAttribute($this->env, $this->source, $context["j"], "slug", [], "any", false, false, false, 1158)]), "html", null, true);
  1450.                     }
  1451.                     yield "\" class=\"hero-default-job\">
  1452.                                         <div class=\"hero-default-job-logo\">
  1453.                                             ";
  1454.                     // line 1160
  1455.                     if ((CoreExtension::getAttribute($this->env, $this->source, $context["j"], "image", [], "any", false, false, false, 1160) && CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, $context["j"], "image", [], "any", false, false, false, 1160), "name", [], "any", false, false, false, 1160))) {
  1456.                         // line 1161
  1457.                         yield "                                                <img src=\"";
  1458.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Vich\UploaderBundle\Twig\Extension\UploaderExtension']->asset($context["j"], "imageFile"), "html", null, true);
  1459.                         yield "\" alt=\"\">
  1460.                                             ";
  1461.                     } else {
  1462.                         // line 1163
  1463.                         yield "                                                ";
  1464.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(Twig\Extension\CoreExtension::upper($this->env->getCharset(), Twig\Extension\CoreExtension::slice($this->env->getCharset(), ((CoreExtension::getAttribute($this->env, $this->source, $context["j"], "companyName", [], "any", true, true, false, 1163)) ? (Twig\Extension\CoreExtension::default(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "companyName", [], "any", false, false, false, 1163), "?")) : ("?")), 0, 1)), "html", null, true);
  1465.                         yield "
  1466.                                             ";
  1467.                     }
  1468.                     // line 1165
  1469.                     yield "                                        </div>
  1470.                                         <div class=\"hero-default-job-info\">
  1471.                                             <h3 class=\"hero-default-job-title\">";
  1472.                     // line 1167
  1473.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "jobTitle", [], "any", false, false, false, 1167), "html", null, true);
  1474.                     yield "</h3>
  1475.                                             <p class=\"hero-default-job-meta\">
  1476.                                                 ";
  1477.                     // line 1169
  1478.                     if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["j"], "companyName", [], "any", false, false, false, 1169)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1479.                         yield "<span>";
  1480.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "companyName", [], "any", false, false, false, 1169), "html", null, true);
  1481.                         yield "</span>";
  1482.                     }
  1483.                     // line 1170
  1484.                     yield "                                                ";
  1485.                     if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["j"], "city", [], "any", false, false, false, 1170)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1486.                         // line 1171
  1487.                         yield "                                                    <span class=\"hero-default-job-meta-sep\"></span>
  1488.                                                     <span>";
  1489.                         // line 1172
  1490.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "city", [], "any", false, false, false, 1172), "html", null, true);
  1491.                         if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["j"], "country", [], "any", false, false, false, 1172)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1492.                             yield ", ";
  1493.                             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "country", [], "any", false, false, false, 1172), "html", null, true);
  1494.                         }
  1495.                         yield "</span>
  1496.                                                 ";
  1497.                     }
  1498.                     // line 1174
  1499.                     yield "                                                ";
  1500.                     if ((($tmp = CoreExtension::getAttribute($this->env, $this->source, $context["j"], "employmentType", [], "any", false, false, false, 1174)) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1501.                         // line 1175
  1502.                         yield "                                                    <span class=\"hero-default-job-meta-sep\"></span>
  1503.                                                     <span>";
  1504.                         // line 1176
  1505.                         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["j"], "employmentType", [], "any", false, false, false, 1176), "html", null, true);
  1506.                         yield "</span>
  1507.                                                 ";
  1508.                     }
  1509.                     // line 1178
  1510.                     yield "                                            </p>
  1511.                                         </div>
  1512.                                         <span class=\"hero-default-job-arrow\">
  1513.                                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"9 18 15 12 9 6\"/></svg>
  1514.                                         </span>
  1515.                                     </a>
  1516.                                     ";
  1517.                     // line 1184
  1518.                     $context["_heroCount"] = ((isset($context["_heroCount"]) || array_key_exists("_heroCount", $context) ? $context["_heroCount"] : (function () { throw new RuntimeError('Variable "_heroCount" does not exist.', 1184, $this->source); })()) + 1);
  1519.                     // line 1185
  1520.                     yield "                                ";
  1521.                 }
  1522.                 // line 1186
  1523.                 yield "                            ";
  1524.             }
  1525.             $_parent = $context['_parent'];
  1526.             unset($context['_seq'], $context['_key'], $context['j'], $context['_parent']);
  1527.             $context = array_intersect_key($context, $_parent) + $_parent;
  1528.             // line 1187
  1529.             yield "                        ";
  1530.         }
  1531.         // line 1188
  1532.         yield "                    </div>
  1533.                 </div>
  1535.                 ";
  1536.         // line 1192
  1537.         yield "                ";
  1538.         if ((null === CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1192, $this->source); })()), "user", [], "any", false, false, false, 1192))) {
  1539.             // line 1193
  1540.             yield "                    <div class=\"hero-cta\">
  1541.                         <a href=\"#register\" class=\"hero-cta-btn\">
  1542.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  1543.                                 <path d=\"M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/><circle cx=\"8.5\" cy=\"7\" r=\"4\"/><line x1=\"20\" y1=\"8\" x2=\"20\" y2=\"14\"/><line x1=\"23\" y1=\"11\" x2=\"17\" y2=\"11\"/>
  1544.                             </svg>
  1545.                             ";
  1546.             // line 1198
  1547.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1198, $this->source); })()), "hero_cta_signup", [], "any", false, false, false, 1198), "html", null, true);
  1548.             yield "
  1549.                         </a>
  1550.                         <a href=\"";
  1551.             // line 1200
  1552.             if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1200, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1553.                 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_app_login", ["_locale" => "fr"]);
  1554.             } else {
  1555.                 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("app_login");
  1556.             }
  1557.             yield "\" class=\"hero-cta-btn\">
  1558.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  1559.                                 <path d=\"M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4\"/><polyline points=\"10 17 15 12 10 7\"/><line x1=\"15\" y1=\"12\" x2=\"3\" y2=\"12\"/>
  1560.                             </svg>
  1561.                             ";
  1562.             // line 1204
  1563.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1204, $this->source); })()), "hero_cta_login", [], "any", false, false, false, 1204), "html", null, true);
  1564.             yield "
  1565.                         </a>
  1566.                     </div>
  1567.                 ";
  1568.         }
  1569.         // line 1208
  1570.         yield "            </div>
  1571.         </section>
  1573.         ";
  1574.         // line 1212
  1575.         yield "        <section class=\"wr-section\">
  1576.             <div class=\"wr-container\">
  1577.                 <div class=\"wr-section-head\">
  1578.                     <h2 class=\"wr-title\">";
  1579.         // line 1215
  1580.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1215, $this->source); })()), "how_title", [], "any", false, false, false, 1215), "html", null, true);
  1581.         yield "</h2>
  1582.                 </div>
  1584.                 <div class=\"how-card\">
  1585.                     <div class=\"how-step reveal\" data-reveal-delay=\"1\">
  1586.                         <div class=\"how-step-illu\">
  1587.                             <img src=\"/uploads/rh/mascotte_register.png\" alt=\"";
  1588.         // line 1221
  1589.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1221, $this->source); })()), "how1_title", [], "any", false, false, false, 1221), "html", null, true);
  1590.         yield "\" loading=\"lazy\">
  1591.                         </div>
  1592.                         <h3 class=\"how-step-title\">";
  1593.         // line 1223
  1594.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1223, $this->source); })()), "how1_title", [], "any", false, false, false, 1223), "html", null, true);
  1595.         yield "</h3>
  1596.                         <p class=\"how-step-desc\">";
  1597.         // line 1224
  1598.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1224, $this->source); })()), "how1_desc", [], "any", false, false, false, 1224), "html", null, true);
  1599.         yield "</p>
  1600.                     </div>
  1602.                     <div class=\"how-step reveal\" data-reveal-delay=\"2\">
  1603.                         <div class=\"how-step-illu\">
  1604.                             <img src=\"/uploads/rh/mascotte_upload2.png\" alt=\"";
  1605.         // line 1229
  1606.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1229, $this->source); })()), "how2_title", [], "any", false, false, false, 1229), "html", null, true);
  1607.         yield "\" loading=\"lazy\">
  1608.                         </div>
  1609.                         <h3 class=\"how-step-title\">";
  1610.         // line 1231
  1611.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1231, $this->source); })()), "how2_title", [], "any", false, false, false, 1231), "html", null, true);
  1612.         yield "</h3>
  1613.                         <p class=\"how-step-desc\">";
  1614.         // line 1232
  1615.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1232, $this->source); })()), "how2_desc", [], "any", false, false, false, 1232), "html", null, true);
  1616.         yield "</p>
  1617.                     </div>
  1619.                     <div class=\"how-step reveal\" data-reveal-delay=\"3\">
  1620.                         <div class=\"how-step-illu\">
  1621.                             <img src=\"/uploads/rh/mascotte_reunion.png\" alt=\"";
  1622.         // line 1237
  1623.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1237, $this->source); })()), "how3_title", [], "any", false, false, false, 1237), "html", null, true);
  1624.         yield "\" loading=\"lazy\">
  1625.                         </div>
  1626.                         <h3 class=\"how-step-title\">";
  1627.         // line 1239
  1628.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1239, $this->source); })()), "how3_title", [], "any", false, false, false, 1239), "html", null, true);
  1629.         yield "</h3>
  1630.                         <p class=\"how-step-desc\">";
  1631.         // line 1240
  1632.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1240, $this->source); })()), "how3_desc", [], "any", false, false, false, 1240), "html", null, true);
  1633.         yield "</p>
  1634.                     </div>
  1635.                 </div>
  1636.             </div>
  1637.         </section>
  1639.         ";
  1640.         // line 1247
  1641.         yield "        <section class=\"wr-section\">
  1642.             <div class=\"wr-container\">
  1644.                 ";
  1645.         // line 1251
  1646.         yield "                <div class=\"feat-block reveal\">
  1647.                     <div class=\"feat-illu\">
  1648.                         <img src=\"/uploads/rh/mascotte_filtrage3.png\" alt=\"";
  1649.         // line 1253
  1650.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1253, $this->source); })()), "feat1_title", [], "any", false, false, false, 1253), "html", null, true);
  1651.         yield "\" loading=\"lazy\">
  1652.                     </div>
  1653.                     <div class=\"feat-content\">
  1654.                         <span class=\"feat-label\">";
  1655.         // line 1256
  1656.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1256, $this->source); })()), "feat1_label", [], "any", false, false, false, 1256), "html", null, true);
  1657.         yield "</span>
  1658.                         <h3 class=\"feat-title\">";
  1659.         // line 1257
  1660.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1257, $this->source); })()), "feat1_title", [], "any", false, false, false, 1257), "html", null, true);
  1661.         yield "</h3>
  1662.                         <div class=\"feat-desc\">
  1663.                             <p>";
  1664.         // line 1259
  1665.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1259, $this->source); })()), "feat1_p1", [], "any", false, false, false, 1259);
  1666.         yield "</p>
  1667.                             <p>";
  1668.         // line 1260
  1669.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1260, $this->source); })()), "feat1_p2", [], "any", false, false, false, 1260);
  1670.         yield "</p>
  1671.                         </div>
  1672.                         <div class=\"feat-quote\">
  1673.                             <p class=\"feat-quote-text\">";
  1674.         // line 1263
  1675.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1263, $this->source); })()), "feat1_quote", [], "any", false, false, false, 1263), "html", null, true);
  1676.         yield "</p>
  1677.                             <div class=\"feat-quote-author\">
  1678.                                 <p class=\"feat-quote-name\">";
  1679.         // line 1265
  1680.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1265, $this->source); })()), "feat1_author", [], "any", false, false, false, 1265), "html", null, true);
  1681.         yield "</p>
  1682.                                 <p class=\"feat-quote-role\">";
  1683.         // line 1266
  1684.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1266, $this->source); })()), "feat1_role", [], "any", false, false, false, 1266), "html", null, true);
  1685.         yield "</p>
  1686.                             </div>
  1687.                         </div>
  1688.                     </div>
  1689.                 </div>
  1691.                 ";
  1692.         // line 1273
  1693.         yield "                <div class=\"feat-block reveal\">
  1694.                     <div class=\"feat-illu\">
  1695.                         <img src=\"/uploads/rh/mascotte_upload.png\" alt=\"";
  1696.         // line 1275
  1697.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1275, $this->source); })()), "feat2_title", [], "any", false, false, false, 1275), "html", null, true);
  1698.         yield "\" loading=\"lazy\">
  1699.                     </div>
  1700.                     <div class=\"feat-content\">
  1701.                         <span class=\"feat-label\">";
  1702.         // line 1278
  1703.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1278, $this->source); })()), "feat2_label", [], "any", false, false, false, 1278), "html", null, true);
  1704.         yield "</span>
  1705.                         <h3 class=\"feat-title\">";
  1706.         // line 1279
  1707.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1279, $this->source); })()), "feat2_title", [], "any", false, false, false, 1279), "html", null, true);
  1708.         yield "</h3>
  1709.                         <div class=\"feat-desc\">
  1710.                             <p>";
  1711.         // line 1281
  1712.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1281, $this->source); })()), "feat2_p1", [], "any", false, false, false, 1281);
  1713.         yield "</p>
  1714.                             <p>";
  1715.         // line 1282
  1716.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1282, $this->source); })()), "feat2_p2", [], "any", false, false, false, 1282);
  1717.         yield "</p>
  1718.                         </div>
  1719.                         <div class=\"feat-quote\">
  1720.                             <p class=\"feat-quote-text\">";
  1721.         // line 1285
  1722.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1285, $this->source); })()), "feat2_quote", [], "any", false, false, false, 1285), "html", null, true);
  1723.         yield "</p>
  1724.                             <div class=\"feat-quote-author\">
  1725.                                 <p class=\"feat-quote-name\">";
  1726.         // line 1287
  1727.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1287, $this->source); })()), "feat2_author", [], "any", false, false, false, 1287), "html", null, true);
  1728.         yield "</p>
  1729.                                 <p class=\"feat-quote-role\">";
  1730.         // line 1288
  1731.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1288, $this->source); })()), "feat2_role", [], "any", false, false, false, 1288), "html", null, true);
  1732.         yield "</p>
  1733.                             </div>
  1734.                         </div>
  1735.                     </div>
  1736.                 </div>
  1738.                 ";
  1739.         // line 1294
  1740.         if ((null === CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1294, $this->source); })()), "user", [], "any", false, false, false, 1294))) {
  1741.             // line 1295
  1742.             yield "                    ";
  1743.             // line 1296
  1744.             yield "                    <div class=\"signup-card reveal reveal--scale\" id=\"register\">
  1745.                         <div class=\"signup-inner\">
  1746.                             <div class=\"signup-text\">
  1747.                             <span class=\"signup-eyebrow\">
  1748.                                 <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/><circle cx=\"8.5\" cy=\"7\" r=\"4\"/><line x1=\"20\" y1=\"8\" x2=\"20\" y2=\"14\"/><line x1=\"23\" y1=\"11\" x2=\"17\" y2=\"11\"/></svg>
  1749.                                 ";
  1750.             // line 1301
  1751.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1301, $this->source); })()), "signup_eyebrow", [], "any", false, false, false, 1301), "html", null, true);
  1752.             yield "
  1753.                             </span>
  1754.                                 <h3 class=\"signup-title\">";
  1755.             // line 1303
  1756.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1303, $this->source); })()), "signup_title", [], "any", false, false, false, 1303), "html", null, true);
  1757.             yield "</h3>
  1758.                                 <p class=\"signup-lede\">";
  1759.             // line 1304
  1760.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1304, $this->source); })()), "signup_lede", [], "any", false, false, false, 1304), "html", null, true);
  1761.             yield "</p>
  1762.                                 <div class=\"signup-perks\">
  1763.                                 <span class=\"signup-perk\">
  1764.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  1765.                                     ";
  1766.             // line 1308
  1767.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1308, $this->source); })()), "signup_perk1", [], "any", false, false, false, 1308), "html", null, true);
  1768.             yield "
  1769.                                 </span>
  1770.                                     <span class=\"signup-perk\">
  1771.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  1772.                                     ";
  1773.             // line 1312
  1774.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1312, $this->source); })()), "signup_perk2", [], "any", false, false, false, 1312), "html", null, true);
  1775.             yield "
  1776.                                 </span>
  1777.                                     <span class=\"signup-perk\">
  1778.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  1779.                                     ";
  1780.             // line 1316
  1781.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1316, $this->source); })()), "signup_perk3", [], "any", false, false, false, 1316), "html", null, true);
  1782.             yield "
  1783.                                 </span>
  1784.                                 </div>
  1785.                             </div>
  1787.                             ";
  1788.             // line 1321
  1789.             if (array_key_exists("form", $context)) {
  1790.                 // line 1322
  1791.                 yield "                                ";
  1792.                 // line 1323
  1793.                 yield "                                ";
  1794.                 yield                 $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1323, $this->source); })()), 'form_start', ["attr" => ["class" => "signup-form", "novalidate" => "novalidate"]]);
  1795.                 yield "
  1796.                                 ";
  1797.                 // line 1324
  1798.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1324, $this->source); })()), 'errors');
  1799.                 yield "
  1800.                                 ";
  1801.                 // line 1325
  1802.                 $context['_parent'] = $context;
  1803.                 $context['_seq'] = CoreExtension::ensureTraversable(CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1325, $this->source); })()), "flashes", ["danger"], "method", false, false, false, 1325));
  1804.                 foreach ($context['_seq'] as $context["_key"] => $context["message"]) {
  1805.                     // line 1326
  1806.                     yield "                                    <p class=\"signup-form-error\">";
  1807.                     yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($context["message"], "html", null, true);
  1808.                     yield "</p>
  1809.                                 ";
  1810.                 }
  1811.                 $_parent = $context['_parent'];
  1812.                 unset($context['_seq'], $context['_key'], $context['message'], $context['_parent']);
  1813.                 $context = array_intersect_key($context, $_parent) + $_parent;
  1814.                 // line 1328
  1815.                 yield "
  1816.                                 <div class=\"signup-field\">
  1817.                                     ";
  1818.                 // line 1330
  1819.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1330, $this->source); })()), "email", [], "any", false, false, false, 1330), 'widget', ["attr" => ["placeholder" => CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1330, $this->source); })()), "signup_email_ph", [], "any", false, false, false, 1330)]]);
  1820.                 yield "
  1821.                                 </div>
  1823.                                 <div class=\"signup-row\">
  1824.                                     <div class=\"signup-field\">
  1825.                                         ";
  1826.                 // line 1335
  1827.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1335, $this->source); })()), "password", [], "any", false, false, false, 1335), "first", [], "any", false, false, false, 1335), 'widget', ["attr" => ["placeholder" => CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1335, $this->source); })()), "signup_pass_ph", [], "any", false, false, false, 1335)]]);
  1828.                 yield "
  1829.                                     </div>
  1830.                                     <div class=\"signup-field\">
  1831.                                         ";
  1832.                 // line 1338
  1833.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1338, $this->source); })()), "password", [], "any", false, false, false, 1338), "second", [], "any", false, false, false, 1338), 'widget', ["attr" => ["placeholder" => CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1338, $this->source); })()), "signup_pass2_ph", [], "any", false, false, false, 1338)]]);
  1834.                 yield "
  1835.                                     </div>
  1836.                                 </div>
  1838.                                 <label class=\"signup-terms\">
  1839.                                     ";
  1840.                 // line 1343
  1841.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1343, $this->source); })()), "acceptTerm", [], "any", false, false, false, 1343), 'widget');
  1842.                 yield "
  1843.                                     <span>
  1844.                                         ";
  1845.                 // line 1345
  1846.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1345, $this->source); })()), "signup_terms_pre", [], "any", false, false, false, 1345), "html", null, true);
  1847.                 yield "
  1848.                                         <a href=\"";
  1849.                 // line 1346
  1850.                 if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1346, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  1851.                     yield "/fr/protections-donnees-candidats";
  1852.                 } else {
  1853.                     yield "/data-protection-candidates";
  1854.                 }
  1855.                 yield "\" target=\"_blank\" rel=\"noopener\">";
  1856.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1346, $this->source); })()), "signup_terms_link", [], "any", false, false, false, 1346), "html", null, true);
  1857.                 yield "</a>.
  1858.                                     </span>
  1859.                                 </label>
  1861.                                 ";
  1862.                 // line 1350
  1863.                 if (CoreExtension::getAttribute($this->env, $this->source, ($context["form"] ?? null), "recaptcha", [], "any", true, true, false, 1350)) {
  1864.                     // line 1351
  1865.                     yield "                                    <div class=\"signup-recaptcha\">";
  1866.                     yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock(CoreExtension::getAttribute($this->env, $this->source, (isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1351, $this->source); })()), "recaptcha", [], "any", false, false, false, 1351), 'widget');
  1867.                     yield "</div>
  1868.                                 ";
  1869.                 }
  1870.                 // line 1353
  1871.                 yield "
  1872.                                 <button type=\"submit\" class=\"signup-submit\">
  1873.                                     ";
  1874.                 // line 1355
  1875.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1355, $this->source); })()), "signup_btn", [], "any", false, false, false, 1355), "html", null, true);
  1876.                 yield "
  1877.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  1878.                                 </button>
  1880.                                 ";
  1881.                 // line 1359
  1882.                 yield $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->searchAndRenderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1359, $this->source); })()), 'rest');
  1883.                 yield "
  1884.                                 ";
  1885.                 // line 1360
  1886.                 yield                 $this->env->getRuntime('Symfony\Component\Form\FormRenderer')->renderBlock((isset($context["form"]) || array_key_exists("form", $context) ? $context["form"] : (function () { throw new RuntimeError('Variable "form" does not exist.', 1360, $this->source); })()), 'form_end');
  1887.                 yield "
  1888.                             ";
  1889.             }
  1890.             // line 1362
  1891.             yield "                        </div>
  1892.                     </div>
  1893.                 ";
  1894.         }
  1895.         // line 1365
  1896.         yield "
  1897.                 ";
  1898.         // line 1367
  1899.         yield "                <div class=\"feat-block reveal\">
  1900.                     <div class=\"feat-illu\">
  1901.                         <img src=\"/uploads/rh/mascotte_register.png\" alt=\"";
  1902.         // line 1369
  1903.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1369, $this->source); })()), "feat3_title", [], "any", false, false, false, 1369), "html", null, true);
  1904.         yield "\" loading=\"lazy\">
  1905.                     </div>
  1906.                     <div class=\"feat-content\">
  1907.                         <span class=\"feat-label\">";
  1908.         // line 1372
  1909.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1372, $this->source); })()), "feat3_label", [], "any", false, false, false, 1372), "html", null, true);
  1910.         yield "</span>
  1911.                         <h3 class=\"feat-title\">";
  1912.         // line 1373
  1913.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1373, $this->source); })()), "feat3_title", [], "any", false, false, false, 1373), "html", null, true);
  1914.         yield "</h3>
  1915.                         <div class=\"feat-desc\">
  1916.                             <p>";
  1917.         // line 1375
  1918.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1375, $this->source); })()), "feat3_p1", [], "any", false, false, false, 1375);
  1919.         yield "</p>
  1920.                             <p>";
  1921.         // line 1376
  1922.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1376, $this->source); })()), "feat3_p2", [], "any", false, false, false, 1376);
  1923.         yield "</p>
  1924.                         </div>
  1925.                         <div class=\"feat-quote\">
  1926.                             <p class=\"feat-quote-text\">";
  1927.         // line 1379
  1928.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1379, $this->source); })()), "feat3_quote", [], "any", false, false, false, 1379), "html", null, true);
  1929.         yield "</p>
  1930.                             <div class=\"feat-quote-author\">
  1931.                                 <p class=\"feat-quote-name\">";
  1932.         // line 1381
  1933.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1381, $this->source); })()), "feat3_author", [], "any", false, false, false, 1381), "html", null, true);
  1934.         yield "</p>
  1935.                                 <p class=\"feat-quote-role\">";
  1936.         // line 1382
  1937.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1382, $this->source); })()), "feat3_role", [], "any", false, false, false, 1382), "html", null, true);
  1938.         yield "</p>
  1939.                             </div>
  1940.                         </div>
  1941.                     </div>
  1942.                 </div>
  1944.                 ";
  1945.         // line 1389
  1946.         yield "                <div class=\"feat-block reveal\">
  1947.                     <div class=\"feat-illu\">
  1948.                         <img src=\"/uploads/rh/mascotte_reunion.png\" alt=\"";
  1949.         // line 1391
  1950.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1391, $this->source); })()), "feat4_title", [], "any", false, false, false, 1391), "html", null, true);
  1951.         yield "\" loading=\"lazy\">
  1952.                     </div>
  1953.                     <div class=\"feat-content\">
  1954.                         <span class=\"feat-label\">";
  1955.         // line 1394
  1956.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1394, $this->source); })()), "feat4_label", [], "any", false, false, false, 1394), "html", null, true);
  1957.         yield "</span>
  1958.                         <h3 class=\"feat-title\">";
  1959.         // line 1395
  1960.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1395, $this->source); })()), "feat4_title", [], "any", false, false, false, 1395), "html", null, true);
  1961.         yield "</h3>
  1962.                         <div class=\"feat-desc\">
  1963.                             <p>";
  1964.         // line 1397
  1965.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1397, $this->source); })()), "feat4_p1", [], "any", false, false, false, 1397);
  1966.         yield "</p>
  1967.                             <p>";
  1968.         // line 1398
  1969.         yield CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1398, $this->source); })()), "feat4_p2", [], "any", false, false, false, 1398);
  1970.         yield "</p>
  1971.                         </div>
  1972.                         <div class=\"feat-quote\">
  1973.                             <p class=\"feat-quote-text\">";
  1974.         // line 1401
  1975.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1401, $this->source); })()), "feat4_quote", [], "any", false, false, false, 1401), "html", null, true);
  1976.         yield "</p>
  1977.                             <div class=\"feat-quote-author\">
  1978.                                 <p class=\"feat-quote-name\">";
  1979.         // line 1403
  1980.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1403, $this->source); })()), "feat4_author", [], "any", false, false, false, 1403), "html", null, true);
  1981.         yield "</p>
  1982.                                 <p class=\"feat-quote-role\">";
  1983.         // line 1404
  1984.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1404, $this->source); })()), "feat4_role", [], "any", false, false, false, 1404), "html", null, true);
  1985.         yield "</p>
  1986.                             </div>
  1987.                         </div>
  1988.                     </div>
  1989.                 </div>
  1991.             </div>
  1992.         </section>
  1995.         ";
  1996.         // line 1415
  1997.         yield "        <section class=\"wr-section\">
  1998.             <div class=\"wr-container\">
  1999.                 <div class=\"apps-grid\">
  2000.                     <a href=\"";
  2001.         // line 1418
  2002.         yield (((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1418, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((array_key_exists("ios_fr", $context)) ? (Twig\Extension\CoreExtension::default((isset($context["ios_fr"]) || array_key_exists("ios_fr", $context) ? $context["ios_fr"] : (function () { throw new RuntimeError('Variable "ios_fr" does not exist.', 1418, $this->source); })()), "#")) : ("#")), "html", null, true)) : ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((array_key_exists("ios_us", $context)) ? (Twig\Extension\CoreExtension::default((isset($context["ios_us"]) || array_key_exists("ios_us", $context) ? $context["ios_us"] : (function () { throw new RuntimeError('Variable "ios_us" does not exist.', 1418, $this->source); })()), "#")) : ("#")), "html", null, true)));
  2003.         yield "\" class=\"app-card\">
  2004.                     <span class=\"app-card-icon\">
  2005.                         <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z\"/></svg>
  2006.                     </span>
  2007.                         <h3 class=\"app-card-name\">";
  2008.         // line 1422
  2009.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1422, $this->source); })()), "apps_ios", [], "any", false, false, false, 1422), "html", null, true);
  2010.         yield "</h3>
  2011.                         <p class=\"app-card-desc\">";
  2012.         // line 1423
  2013.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1423, $this->source); })()), "apps_ios_desc", [], "any", false, false, false, 1423), "html", null, true);
  2014.         yield "</p>
  2015.                         <span class=\"app-card-cta\">App Store
  2016.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2017.                     </span>
  2018.                     </a>
  2019.                     <a href=\"";
  2020.         // line 1428
  2021.         yield (((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1428, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((array_key_exists("android_fr", $context)) ? (Twig\Extension\CoreExtension::default((isset($context["android_fr"]) || array_key_exists("android_fr", $context) ? $context["android_fr"] : (function () { throw new RuntimeError('Variable "android_fr" does not exist.', 1428, $this->source); })()), "#")) : ("#")), "html", null, true)) : ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(((array_key_exists("android_us", $context)) ? (Twig\Extension\CoreExtension::default((isset($context["android_us"]) || array_key_exists("android_us", $context) ? $context["android_us"] : (function () { throw new RuntimeError('Variable "android_us" does not exist.', 1428, $this->source); })()), "#")) : ("#")), "html", null, true)));
  2022.         yield "\" class=\"app-card\">
  2023.                     <span class=\"app-card-icon\">
  2024.                         <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.523 15.34c-.583 0-1.06-.477-1.06-1.06 0-.582.477-1.06 1.06-1.06.583 0 1.06.478 1.06 1.06 0 .583-.477 1.06-1.06 1.06m-11.046 0c-.583 0-1.06-.477-1.06-1.06 0-.582.477-1.06 1.06-1.06.583 0 1.06.478 1.06 1.06 0 .583-.477 1.06-1.06 1.06m11.427-6.176l2.114-3.66a.439.439 0 0 0-.16-.6.439.439 0 0 0-.6.16l-2.142 3.71a13.07 13.07 0 0 0-5.116-1.034c-1.823 0-3.55.376-5.116 1.034l-2.14-3.71a.439.439 0 1 0-.76.44l2.113 3.66C2.486 10.78.659 13.658.5 17h23c-.16-3.342-1.987-6.22-5.595-7.836\"/></svg>
  2025.                     </span>
  2026.                         <h3 class=\"app-card-name\">";
  2027.         // line 1432
  2028.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1432, $this->source); })()), "apps_android", [], "any", false, false, false, 1432), "html", null, true);
  2029.         yield "</h3>
  2030.                         <p class=\"app-card-desc\">";
  2031.         // line 1433
  2032.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1433, $this->source); })()), "apps_android_desc", [], "any", false, false, false, 1433), "html", null, true);
  2033.         yield "</p>
  2034.                         <span class=\"app-card-cta\">Google Play
  2035.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2036.                     </span>
  2037.                     </a>
  2038.                     <a href=\"";
  2039.         // line 1438
  2040.         if ((CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1438, $this->source); })()), "request", [], "any", false, false, false, 1438), "locale", [], "any", false, false, false, 1438) == "en")) {
  2041.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("whileresume_homepage");
  2042.         } else {
  2043.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_whileresume_homepage", ["_locale" => CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1438, $this->source); })()), "request", [], "any", false, false, false, 1438), "locale", [], "any", false, false, false, 1438)]), "html", null, true);
  2044.         }
  2045.         yield "#register\" class=\"app-card\">
  2046.                         <span class=\"app-card-icon\">
  2047.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><line x1=\"2\" y1=\"12\" x2=\"22\" y2=\"12\"/><path d=\"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"/></svg>
  2048.                         </span>
  2049.                         <h3 class=\"app-card-name\">";
  2050.         // line 1442
  2051.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1442, $this->source); })()), "apps_web", [], "any", false, false, false, 1442), "html", null, true);
  2052.         yield "</h3>
  2053.                         <p class=\"app-card-desc\">";
  2054.         // line 1443
  2055.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1443, $this->source); })()), "apps_web_desc", [], "any", false, false, false, 1443), "html", null, true);
  2056.         yield "</p>
  2057.                         <span class=\"app-card-cta\">whileresume.com
  2058.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2059.                     </span>
  2060.                     </a>
  2061.                 </div>
  2062.             </div>
  2063.         </section>
  2066.         ";
  2067.         // line 1454
  2068.         yield "        ";
  2069.         if ((array_key_exists("articles", $context) && (Twig\Extension\CoreExtension::length($this->env->getCharset(), (isset($context["articles"]) || array_key_exists("articles", $context) ? $context["articles"] : (function () { throw new RuntimeError('Variable "articles" does not exist.', 1454, $this->source); })())) > 0))) {
  2070.             // line 1455
  2071.             yield "            <section class=\"wr-section\">
  2072.                 <div class=\"wr-container\">
  2073.                     <div class=\"wr-section-head\">
  2074.                         <h2 class=\"wr-title wr-title--sm\">";
  2075.             // line 1458
  2076.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1458, $this->source); })()), "articles_title", [], "any", false, false, false, 1458), "html", null, true);
  2077.             yield "</h2>
  2078.                     </div>
  2080.                     <div class=\"articles-list\">
  2081.                         ";
  2082.             // line 1462
  2083.             $context['_parent'] = $context;
  2084.             $context['_seq'] = CoreExtension::ensureTraversable(Twig\Extension\CoreExtension::slice($this->env->getCharset(), (isset($context["articles"]) || array_key_exists("articles", $context) ? $context["articles"] : (function () { throw new RuntimeError('Variable "articles" does not exist.', 1462, $this->source); })()), 0, 6));
  2085.             foreach ($context['_seq'] as $context["_key"] => $context["a"]) {
  2086.                 // line 1463
  2087.                 yield "                            ";
  2088.                 $context["prefix"] = "";
  2089.                 // line 1464
  2090.                 yield "                            ";
  2091.                 $context["urlA"] = $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("cvs_website_article", ["slug" => CoreExtension::getAttribute($this->env, $this->source, $context["a"], "slug", [], "any", false, false, false, 1464)]);
  2092.                 // line 1465
  2093.                 yield "                            ";
  2094.                 if ((CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1465, $this->source); })()), "request", [], "any", false, false, false, 1465), "locale", [], "any", false, false, false, 1465) != (isset($context["default_locale"]) || array_key_exists("default_locale", $context) ? $context["default_locale"] : (function () { throw new RuntimeError('Variable "default_locale" does not exist.', 1465, $this->source); })()))) {
  2095.                     // line 1466
  2096.                     yield "                                ";
  2097.                     $context["urlA"] = $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_cvs_website_article", ["_locale" => CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1466, $this->source); })()), "request", [], "any", false, false, false, 1466), "locale", [], "any", false, false, false, 1466), "slug" => CoreExtension::getAttribute($this->env, $this->source, $context["a"], "slug", [], "any", false, false, false, 1466)]);
  2098.                     // line 1467
  2099.                     yield "                                ";
  2100.                     $context["prefix"] = ("/" . CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1467, $this->source); })()), "request", [], "any", false, false, false, 1467), "locale", [], "any", false, false, false, 1467));
  2101.                     // line 1468
  2102.                     yield "                            ";
  2103.                 }
  2104.                 // line 1469
  2105.                 yield "                            ";
  2106.                 if ((($tmp =  !Twig\Extension\CoreExtension::testEmpty(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug3", [], "any", false, false, false, 1469))) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2107.                     // line 1470
  2108.                     yield "                                ";
  2109.                     $context["urlA"] = (((((((isset($context["prefix"]) || array_key_exists("prefix", $context) ? $context["prefix"] : (function () { throw new RuntimeError('Variable "prefix" does not exist.', 1470, $this->source); })()) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug", [], "any", false, false, false, 1470)) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug2", [], "any", false, false, false, 1470)) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug3", [], "any", false, false, false, 1470));
  2110.                     // line 1471
  2111.                     yield "                            ";
  2112.                 } elseif ((($tmp =  !Twig\Extension\CoreExtension::testEmpty(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug2", [], "any", false, false, false, 1471))) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2113.                     // line 1472
  2114.                     yield "                                ";
  2115.                     $context["urlA"] = (((((isset($context["prefix"]) || array_key_exists("prefix", $context) ? $context["prefix"] : (function () { throw new RuntimeError('Variable "prefix" does not exist.', 1472, $this->source); })()) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug", [], "any", false, false, false, 1472)) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug2", [], "any", false, false, false, 1472));
  2116.                     // line 1473
  2117.                     yield "                            ";
  2118.                 } elseif ((($tmp =  !Twig\Extension\CoreExtension::testEmpty(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug", [], "any", false, false, false, 1473))) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2119.                     // line 1474
  2120.                     yield "                                ";
  2121.                     $context["urlA"] = (((isset($context["prefix"]) || array_key_exists("prefix", $context) ? $context["prefix"] : (function () { throw new RuntimeError('Variable "prefix" does not exist.', 1474, $this->source); })()) . "/") . CoreExtension::getAttribute($this->env, $this->source, $context["a"], "pageslug", [], "any", false, false, false, 1474));
  2122.                     // line 1475
  2123.                     yield "                            ";
  2124.                 }
  2125.                 // line 1476
  2126.                 yield "
  2127.                             <a href=\"";
  2128.                 // line 1477
  2129.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((isset($context["urlA"]) || array_key_exists("urlA", $context) ? $context["urlA"] : (function () { throw new RuntimeError('Variable "urlA" does not exist.', 1477, $this->source); })()), "html", null, true);
  2130.                 yield "\" class=\"wr-article\">
  2131.                                 <div class=\"wr-article-logo\">
  2132.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  2133.                                         <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\"/>
  2134.                                         <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\"/>
  2135.                                     </svg>
  2136.                                 </div>
  2137.                                 <div class=\"wr-article-info\">
  2138.                                     <h3 class=\"wr-article-title\">";
  2139.                 // line 1485
  2140.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "title", [], "any", false, false, false, 1485), "html", null, true);
  2141.                 yield "</h3>
  2142.                                     <div class=\"wr-article-meta\">
  2143.                                         ";
  2144.                 // line 1487
  2145.                 if ((($tmp =  !Twig\Extension\CoreExtension::testEmpty(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "subtitle", [], "any", false, false, false, 1487))) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2146.                     // line 1488
  2147.                     yield "                                            <span>";
  2148.                     yield (((Twig\Extension\CoreExtension::length($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["a"], "subtitle", [], "any", false, false, false, 1488)) > 60)) ? ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape((Twig\Extension\CoreExtension::slice($this->env->getCharset(), CoreExtension::getAttribute($this->env, $this->source, $context["a"], "subtitle", [], "any", false, false, false, 1488), 0, 60) . "…"), "html", null, true)) : ($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, $context["a"], "subtitle", [], "any", false, false, false, 1488), "html", null, true)));
  2149.                     yield "</span>
  2150.                                         ";
  2151.                 }
  2152.                 // line 1490
  2153.                 yield "                                    </div>
  2154.                                 </div>
  2155.                                 <span class=\"wr-article-badge\">";
  2156.                 // line 1492
  2157.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1492, $this->source); })()), "read_article", [], "any", false, false, false, 1492), "html", null, true);
  2158.                 yield "</span>
  2159.                                 <span class=\"wr-article-arrow\">
  2160.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  2161.                                     <polyline points=\"9 18 15 12 9 6\"/>
  2162.                                 </svg>
  2163.                             </span>
  2164.                             </a>
  2165.                         ";
  2166.             }
  2167.             $_parent = $context['_parent'];
  2168.             unset($context['_seq'], $context['_key'], $context['a'], $context['_parent']);
  2169.             $context = array_intersect_key($context, $_parent) + $_parent;
  2170.             // line 1500
  2171.             yield "                    </div>
  2173.                     <div class=\"articles-cta\">
  2174.                         <a href=\"";
  2175.             // line 1503
  2176.             if ((($tmp = (isset($context["isFR"]) || array_key_exists("isFR", $context) ? $context["isFR"] : (function () { throw new RuntimeError('Variable "isFR" does not exist.', 1503, $this->source); })())) && $tmp instanceof Markup ? (string) $tmp : $tmp)) {
  2177.                 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_cvs_website_articles", ["_locale" => "fr"]);
  2178.             } else {
  2179.                 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("cvs_website_articles");
  2180.             }
  2181.             yield "\">
  2182.                             ";
  2183.             // line 1504
  2184.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1504, $this->source); })()), "articles_view_all", [], "any", false, false, false, 1504), "html", null, true);
  2185.             yield "
  2186.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2187.                         </a>
  2188.                     </div>
  2189.                 </div>
  2190.             </section>
  2191.         ";
  2192.         }
  2193.         // line 1511
  2194.         yield "
  2195.         ";
  2196.         // line 1513
  2197.         yield "        ";
  2198.         if ((null === CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1513, $this->source); })()), "user", [], "any", false, false, false, 1513))) {
  2199.             // line 1514
  2200.             yield "            <section class=\"wr-section\">
  2201.                 <div class=\"wr-container\">
  2202.                     <div class=\"final-card\">
  2204.                         <h2 class=\"final-title\">";
  2205.             // line 1518
  2206.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1518, $this->source); })()), "final_title", [], "any", false, false, false, 1518), "html", null, true);
  2207.             yield "</h2>
  2209.                         <div class=\"final-grid\">
  2210.                             ";
  2211.             // line 1522
  2212.             yield "                            <div class=\"final-sub\">
  2213.                                 <div class=\"final-sub-head\">
  2214.                             <span class=\"final-sub-icon\">
  2215.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  2216.                                     <rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
  2217.                                     <path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"/>
  2218.                                 </svg>
  2219.                             </span>
  2220.                                     <span class=\"final-sub-label\">";
  2221.             // line 1530
  2222.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1530, $this->source); })()), "final_recruiter_label", [], "any", false, false, false, 1530), "html", null, true);
  2223.             yield "</span>
  2224.                                 </div>
  2225.                                 <h3 class=\"final-sub-title\">";
  2226.             // line 1532
  2227.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1532, $this->source); })()), "final_recruiter_title", [], "any", false, false, false, 1532), "html", null, true);
  2228.             yield "</h3>
  2229.                                 <p class=\"final-sub-desc\">";
  2230.             // line 1533
  2231.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1533, $this->source); })()), "final_recruiter_desc", [], "any", false, false, false, 1533), "html", null, true);
  2232.             yield "</p>
  2233.                                 <a href=\"";
  2234.             // line 1534
  2235.             yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath(("whileresume_business_" . CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1534, $this->source); })()), "request", [], "any", false, false, false, 1534), "locale", [], "any", false, false, false, 1534)));
  2236.             yield "\" class=\"final-sub-btn\">
  2237.                                     ";
  2238.             // line 1535
  2239.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1535, $this->source); })()), "final_recruiter", [], "any", false, false, false, 1535), "html", null, true);
  2240.             yield "
  2241.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2242.                                 </a>
  2243.                             </div>
  2245.                             ";
  2246.             // line 1541
  2247.             yield "                            <div class=\"final-sub\">
  2248.                                 <div class=\"final-sub-head\">
  2249.                                 <span class=\"final-sub-icon\">
  2250.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  2251.                                         <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
  2252.                                         <circle cx=\"12\" cy=\"7\" r=\"4\"/>
  2253.                                     </svg>
  2254.                                 </span>
  2255.                                     <span class=\"final-sub-label\">";
  2256.             // line 1549
  2257.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1549, $this->source); })()), "final_candidate_label", [], "any", false, false, false, 1549), "html", null, true);
  2258.             yield "</span>
  2259.                                 </div>
  2260.                                 <h3 class=\"final-sub-title\">";
  2261.             // line 1551
  2262.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1551, $this->source); })()), "final_candidate_title", [], "any", false, false, false, 1551), "html", null, true);
  2263.             yield "</h3>
  2264.                                 <p class=\"final-sub-desc\">";
  2265.             // line 1552
  2266.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1552, $this->source); })()), "final_candidate_desc", [], "any", false, false, false, 1552), "html", null, true);
  2267.             yield "</p>
  2268.                                 <a href=\"";
  2269.             // line 1553
  2270.             if ((CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1553, $this->source); })()), "request", [], "any", false, false, false, 1553), "locale", [], "any", false, false, false, 1553) == "en")) {
  2271.                 yield $this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("whileresume_homepage");
  2272.             } else {
  2273.                 yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->extensions['Symfony\Bridge\Twig\Extension\RoutingExtension']->getPath("locale_whileresume_homepage", ["_locale" => CoreExtension::getAttribute($this->env, $this->source, CoreExtension::getAttribute($this->env, $this->source, (isset($context["app"]) || array_key_exists("app", $context) ? $context["app"] : (function () { throw new RuntimeError('Variable "app" does not exist.', 1553, $this->source); })()), "request", [], "any", false, false, false, 1553), "locale", [], "any", false, false, false, 1553)]), "html", null, true);
  2274.             }
  2275.             yield "#register\" class=\"final-sub-btn\">
  2276.                                     ";
  2277.             // line 1554
  2278.             yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1554, $this->source); })()), "final_candidate", [], "any", false, false, false, 1554), "html", null, true);
  2279.             yield "
  2280.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  2281.                                 </a>
  2282.                             </div>
  2283.                         </div>
  2284.                     </div>
  2285.                 </div>
  2286.             </section>
  2287.         ";
  2288.         }
  2289.         // line 1563
  2290.         yield "    </div>
  2291. ";
  2292.         
  2293.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  2295.         
  2296.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  2298.         yield from [];
  2299.     }
  2301.     // line 1566
  2302.     /**
  2303.      * @return iterable<null|scalar|\Stringable>
  2304.      */
  2305.     public function block_footer_js(array $context, array $blocks = []): iterable
  2306.     {
  2307.         $macros = $this->macros;
  2308.         $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
  2309.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "footer_js"));
  2311.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
  2312.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "footer_js"));
  2314.         // line 1567
  2315.         yield "    ";
  2316.         yield from $this->yieldParentBlock("footer_js", $context, $blocks);
  2317.         yield "
  2318.     <script>
  2319.         (function(){
  2320.             var search   = document.getElementById('wrHeroSearch');
  2321.             var input    = document.getElementById('wrHeroSearchInput');
  2322.             var clearBtn = document.getElementById('wrHeroSearchClear');
  2323.             var jobsBody = document.getElementById('wrHeroJobsBody');
  2324.             var countEl  = document.getElementById('wrHeroJobsCount');
  2325.             var linkEl   = document.getElementById('wrHeroJobsLink');
  2326.             if (!search || !input || !jobsBody) return;
  2328.             var searchUrl   = search.dataset.searchUrl;
  2329.             var jobsListUrl = search.dataset.jobsListUrl;
  2331.             // On garde l'état initial pour pouvoir le restaurer
  2332.             var defaultBodyHtml  = jobsBody.innerHTML;
  2333.             var defaultCountHtml = countEl ? countEl.innerHTML : '';
  2334.             var defaultLinkHref  = linkEl ? linkEl.getAttribute('href') : jobsListUrl;
  2336.             var debounceTimer = null;
  2337.             var currentRequest = null;
  2338.             var lastQuery = '';
  2340.             var T = {
  2341.                 loading:      '";
  2342.         // line 1591
  2343.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1591, $this->source); })()), "search_loading", [], "any", false, false, false, 1591), "js"), "html", null, true);
  2344.         yield "',
  2345.                 empty:        '";
  2346.         // line 1592
  2347.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1592, $this->source); })()), "search_no_results", [], "any", false, false, false, 1592), "js"), "html", null, true);
  2348.         yield "',
  2349.                 emptyHint:    '";
  2350.         // line 1593
  2351.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1593, $this->source); })()), "search_no_results_hint", [], "any", false, false, false, 1593), "js"), "html", null, true);
  2352.         yield "',
  2353.                 count:        '";
  2354.         // line 1594
  2355.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1594, $this->source); })()), "search_results_count", [], "any", false, false, false, 1594), "js"), "html", null, true);
  2356.         yield "',
  2357.                 viewAll:      '";
  2358.         // line 1595
  2359.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1595, $this->source); })()), "search_view_all", [], "any", false, false, false, 1595), "js"), "html", null, true);
  2360.         yield "',
  2361.                 view:         '";
  2362.         // line 1596
  2363.         yield $this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape($this->env->getRuntime('Twig\Runtime\EscaperRuntime')->escape(CoreExtension::getAttribute($this->env, $this->source, (isset($context["t"]) || array_key_exists("t", $context) ? $context["t"] : (function () { throw new RuntimeError('Variable "t" does not exist.', 1596, $this->source); })()), "search_view_offer", [], "any", false, false, false, 1596), "js"), "html", null, true);
  2364.         yield "'
  2365.             };
  2367.             function escHtml(s){
  2368.                 if (s == null) return '';
  2369.                 return String(s).replace(/[&<>\"']/g, function(c){
  2370.                     return {'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[c];
  2371.                 });
  2372.             }
  2374.             function setHeaderCount(total){
  2375.                 if (!countEl) return;
  2376.                 countEl.innerHTML = '<strong>' + total + '</strong>' + escHtml(T.count);
  2377.             }
  2379.             function setHeaderLink(href){
  2380.                 if (!linkEl) return;
  2381.                 linkEl.setAttribute('href', href);
  2382.             }
  2384.             function setLoading(){
  2385.                 jobsBody.innerHTML =
  2386.                     '<div class=\"hero-jobs-loading\">' +
  2387.                     '<span class=\"hero-jobs-spinner\"></span>' +
  2388.                     '<span>' + escHtml(T.loading) + '</span>' +
  2389.                     '</div>';
  2390.             }
  2392.             function setEmpty(){
  2393.                 jobsBody.innerHTML =
  2394.                     '<div class=\"hero-jobs-empty\">' +
  2395.                     '<div class=\"hero-jobs-empty-icon\">' +
  2396.                     '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">' +
  2397.                     '<circle cx=\"11\" cy=\"11\" r=\"8\"/><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"/>' +
  2398.                     '</svg>' +
  2399.                     '</div>' +
  2400.                     '<p class=\"hero-jobs-empty-title\">' + escHtml(T.empty) + '</p>' +
  2401.                     '<p class=\"hero-jobs-empty-hint\">' + escHtml(T.emptyHint) + '</p>' +
  2402.                     '</div>';
  2403.             }
  2405.             function restoreDefault(){
  2406.                 jobsBody.innerHTML = defaultBodyHtml;
  2407.                 if (countEl) countEl.innerHTML = defaultCountHtml;
  2408.                 if (linkEl) linkEl.setAttribute('href', defaultLinkHref);
  2409.             }
  2411.             function renderResults(payload, query){
  2412.                 var jobs  = (payload && payload.jobs)  || [];
  2413.                 var total = (payload && typeof payload.total === 'number') ? payload.total : jobs.length;
  2415.                 setHeaderCount(total);
  2416.                 setHeaderLink(jobsListUrl + '?q=' + encodeURIComponent(query));
  2418.                 if (!jobs.length){
  2419.                     setEmpty();
  2420.                     return;
  2421.                 }
  2423.                 var html = '';
  2424.                 jobs.slice(0, 6).forEach(function(j){
  2425.                     var title   = j.jobTitle || j.title || '';
  2426.                     var company = j.companyName || j.company || '';
  2427.                     var city    = j.city || '';
  2428.                     var country = j.country || '';
  2429.                     var et      = j.employmentType || '';
  2430.                     var img     = j.image || j.imageUrl || '';
  2431.                     var url     = j.url || (jobsListUrl + '?q=' + encodeURIComponent(query));
  2432.                     var initial = (company || title || '?').charAt(0).toUpperCase();
  2434.                     var location = city + (country ? ', ' + country : '');
  2435.                     var metaParts = [];
  2436.                     if (company)  metaParts.push('<span>' + escHtml(company) + '</span>');
  2437.                     if (location) metaParts.push('<span class=\"hero-default-job-meta-sep\"></span><span>' + escHtml(location) + '</span>');
  2438.                     if (et)       metaParts.push('<span class=\"hero-default-job-meta-sep\"></span><span>' + escHtml(et) + '</span>');
  2440.                     html +=
  2441.                         '<a href=\"' + escHtml(url) + '\" class=\"hero-default-job\">' +
  2442.                         '<div class=\"hero-default-job-logo\">' +
  2443.                         (img
  2444.                             ? '<img src=\"' + escHtml(img) + '\" alt=\"\">'
  2445.                             : escHtml(initial)) +
  2446.                         '</div>' +
  2447.                         '<div class=\"hero-default-job-info\">' +
  2448.                         '<h3 class=\"hero-default-job-title\">' + escHtml(title) + '</h3>' +
  2449.                         '<p class=\"hero-default-job-meta\">' + metaParts.join('') + '</p>' +
  2450.                         '</div>' +
  2451.                         '<span class=\"hero-default-job-arrow\">' +
  2452.                         '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"9 18 15 12 9 6\"/></svg>' +
  2453.                         '</span>' +
  2454.                         '</a>';
  2455.                 });
  2457.                 jobsBody.innerHTML = html;
  2458.             }
  2460.             function doSearch(query){
  2461.                 if (currentRequest && currentRequest.abort) {
  2462.                     try { currentRequest.abort(); } catch(e){}
  2463.                 }
  2464.                 setLoading();
  2465.                 var url = searchUrl + (searchUrl.indexOf('?') > -1 ? '&' : '?') + 'q=' + encodeURIComponent(query);
  2467.                 var ctrl = (typeof AbortController !== 'undefined') ? new AbortController() : null;
  2468.                 currentRequest = ctrl;
  2470.                 fetch(url, { headers: { 'Accept': 'application/json' }, signal: ctrl ? ctrl.signal : undefined })
  2471.                     .then(function(r){ return r.ok ? r.json() : Promise.reject(r.status); })
  2472.                     .then(function(data){ renderResults(data, query); })
  2473.                     .catch(function(err){
  2474.                         if (err && err.name === 'AbortError') return;
  2475.                         setEmpty();
  2476.                     });
  2477.             }
  2479.             // Input live (debounce 280ms)
  2480.             input.addEventListener('input', function(){
  2481.                 var q = input.value.trim();
  2482.                 clearBtn.classList.toggle('is-visible', q.length > 0);
  2484.                 if (debounceTimer) clearTimeout(debounceTimer);
  2486.                 if (q.length < 2){
  2487.                     restoreDefault();
  2488.                     lastQuery = '';
  2489.                     return;
  2490.                 }
  2491.                 if (q === lastQuery) return;
  2493.                 debounceTimer = setTimeout(function(){
  2494.                     lastQuery = q;
  2495.                     doSearch(q);
  2496.                 }, 280);
  2497.             });
  2499.             // Enter → page de résultats complète
  2500.             input.addEventListener('keydown', function(e){
  2501.                 if (e.key === 'Enter'){
  2502.                     e.preventDefault();
  2503.                     var q = input.value.trim();
  2504.                     if (!q) return;
  2505.                     window.location.href = jobsListUrl + '?q=' + encodeURIComponent(q);
  2506.                 }
  2507.                 if (e.key === 'Escape'){
  2508.                     input.value = '';
  2509.                     clearBtn.classList.remove('is-visible');
  2510.                     restoreDefault();
  2511.                     lastQuery = '';
  2512.                     input.blur();
  2513.                 }
  2514.             });
  2516.             // Clear
  2517.             clearBtn.addEventListener('click', function(){
  2518.                 input.value = '';
  2519.                 clearBtn.classList.remove('is-visible');
  2520.                 restoreDefault();
  2521.                 lastQuery = '';
  2522.                 input.focus();
  2523.             });
  2525.             // Pills \"Populaire\" — au clic, on remplit l'input et on lance la recherche
  2526.             document.querySelectorAll('.hero-popular-pill').forEach(function(pill){
  2527.                 pill.addEventListener('click', function(){
  2528.                     var keyword = pill.dataset.keyword || pill.dataset.label || '';
  2529.                     if (!keyword) return;
  2531.                     // Visuel actif
  2532.                     document.querySelectorAll('.hero-popular-pill').forEach(function(p){ p.classList.remove('is-active'); });
  2533.                     pill.classList.add('is-active');
  2535.                     input.value = keyword;
  2536.                     clearBtn.classList.add('is-visible');
  2537.                     lastQuery = keyword;
  2538.                     doSearch(keyword);
  2539.                     input.focus();
  2540.                 });
  2541.             });
  2542.         })();
  2544.         /* ═══ Reveal au scroll (Intersection Observer) ═══ */
  2545.         (function(){
  2546.             var els = document.querySelectorAll('.reveal');
  2547.             if (!els.length) return;
  2549.             if (!('IntersectionObserver' in window)){
  2550.                 // Fallback : tout révéler
  2551.                 els.forEach(function(el){ el.classList.add('is-revealed'); });
  2552.                 return;
  2553.             }
  2555.             var io = new IntersectionObserver(function(entries){
  2556.                 entries.forEach(function(entry){
  2557.                     if (entry.isIntersecting){
  2558.                         entry.target.classList.add('is-revealed');
  2559.                         io.unobserve(entry.target);
  2560.                     }
  2561.                 });
  2562.             }, { threshold: 0.12, rootMargin: '0px 0px -60px 0px' });
  2564.             els.forEach(function(el){ io.observe(el); });
  2565.         })();
  2566.     </script>
  2567. ";
  2568.         
  2569.         $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);
  2571.         
  2572.         $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);
  2574.         yield from [];
  2575.     }
  2577.     /**
  2578.      * @codeCoverageIgnore
  2579.      */
  2580.     public function getTemplateName(): string
  2581.     {
  2582.         return "application/whileresume/website/candidates/homepage.html.twig";
  2583.     }
  2585.     /**
  2586.      * @codeCoverageIgnore
  2587.      */
  2588.     public function isTraitable(): bool
  2589.     {
  2590.         return false;
  2591.     }
  2593.     /**
  2594.      * @codeCoverageIgnore
  2595.      */
  2596.     public function getDebugInfo(): array
  2597.     {
  2598.         return array (  2363 => 1596,  2359 => 1595,  2355 => 1594,  2351 => 1593,  2347 => 1592,  2343 => 1591,  2315 => 1567,  2302 => 1566,  2290 => 1563,  2278 => 1554,  2270 => 1553,  2266 => 1552,  2262 => 1551,  2257 => 1549,  2247 => 1541,  2239 => 1535,  2235 => 1534,  2231 => 1533,  2227 => 1532,  2222 => 1530,  2212 => 1522,  2206 => 1518,  2200 => 1514,  2197 => 1513,  2194 => 1511,  2184 => 1504,  2176 => 1503,  2171 => 1500,  2157 => 1492,  2153 => 1490,  2147 => 1488,  2145 => 1487,  2140 => 1485,  2129 => 1477,  2126 => 1476,  2123 => 1475,  2120 => 1474,  2117 => 1473,  2114 => 1472,  2111 => 1471,  2108 => 1470,  2105 => 1469,  2102 => 1468,  2099 => 1467,  2096 => 1466,  2093 => 1465,  2090 => 1464,  2087 => 1463,  2083 => 1462,  2076 => 1458,  2071 => 1455,  2068 => 1454,  2055 => 1443,  2051 => 1442,  2040 => 1438,  2032 => 1433,  2028 => 1432,  2021 => 1428,  2013 => 1423,  2009 => 1422,  2002 => 1418,  1997 => 1415,  1984 => 1404,  1980 => 1403,  1975 => 1401,  1969 => 1398,  1965 => 1397,  1960 => 1395,  1956 => 1394,  1950 => 1391,  1946 => 1389,  1937 => 1382,  1933 => 1381,  1928 => 1379,  1922 => 1376,  1918 => 1375,  1913 => 1373,  1909 => 1372,  1903 => 1369,  1899 => 1367,  1896 => 1365,  1891 => 1362,  1886 => 1360,  1882 => 1359,  1875 => 1355,  1871 => 1353,  1865 => 1351,  1863 => 1350,  1850 => 1346,  1846 => 1345,  1841 => 1343,  1833 => 1338,  1827 => 1335,  1819 => 1330,  1815 => 1328,  1806 => 1326,  1802 => 1325,  1798 => 1324,  1793 => 1323,  1791 => 1322,  1789 => 1321,  1781 => 1316,  1774 => 1312,  1767 => 1308,  1760 => 1304,  1756 => 1303,  1751 => 1301,  1744 => 1296,  1742 => 1295,  1740 => 1294,  1731 => 1288,  1727 => 1287,  1722 => 1285,  1716 => 1282,  1712 => 1281,  1707 => 1279,  1703 => 1278,  1697 => 1275,  1693 => 1273,  1684 => 1266,  1680 => 1265,  1675 => 1263,  1669 => 1260,  1665 => 1259,  1660 => 1257,  1656 => 1256,  1650 => 1253,  1646 => 1251,  1641 => 1247,  1632 => 1240,  1628 => 1239,  1623 => 1237,  1615 => 1232,  1611 => 1231,  1606 => 1229,  1598 => 1224,  1594 => 1223,  1589 => 1221,  1580 => 1215,  1575 => 1212,  1570 => 1208,  1563 => 1204,  1552 => 1200,  1547 => 1198,  1540 => 1193,  1537 => 1192,  1532 => 1188,  1529 => 1187,  1523 => 1186,  1520 => 1185,  1518 => 1184,  1510 => 1178,  1505 => 1176,  1502 => 1175,  1499 => 1174,  1490 => 1172,  1487 => 1171,  1484 => 1170,  1478 => 1169,  1473 => 1167,  1469 => 1165,  1463 => 1163,  1457 => 1161,  1455 => 1160,  1445 => 1158,  1442 => 1157,  1437 => 1156,  1435 => 1155,  1424 => 1147,  1416 => 1146,  1409 => 1144,  1403 => 1140,  1400 => 1139,  1398 => 1138,  1386 => 1128,  1382 => 1127,  1377 => 1125,  1362 => 1117,  1354 => 1116,  1350 => 1114,  1347 => 1112,  1343 => 1110,  1333 => 1107,  1327 => 1106,  1323 => 1105,  1319 => 1104,  1315 => 1102,  1311 => 1101,  1307 => 1100,  1304 => 1099,  1301 => 1098,  1295 => 1094,  1291 => 1093,  1287 => 1092,  1283 => 1091,  1279 => 1090,  1270 => 1086,  1264 => 1085,  1257 => 1081,  1251 => 1077,  1247 => 1074,  1234 => 1073,  191 => 41,  178 => 40,  155 => 38,  132 => 37,  109 => 36,  86 => 35,  75 => 1,  69 => 31,  65 => 30,  63 => 29,  61 => 5,  59 => 3,  46 => 1,);
  2599.     }
  2601.     public function getSourceContext(): Source
  2602.     {
  2603.         return new Source("{% extends 'application/whileresume/website/layout-social.html.twig' %}
  2605. {% set isFR = app.request.locale == 'fr' %}
  2607. {% set _keys = [
  2608.     'hero_eyebrow','hero_title_pre','hero_title_accent','hero_title_post','hero_title_accent2','hero_title_2',
  2609.     'hero_lede_pre','hero_lede_brand','hero_lede_mid','hero_lede_word','hero_lede_post',
  2610.     'hero_cta_signup','hero_cta_login',
  2611.     'hero_search_placeholder','hero_popular_label','hero_btn_ios','hero_btn_android',
  2612.     'hero_default_title','hero_search_button','hero_byline_jobs','hero_byline_apps','hero_byline_free','hero_kbd_enter',
  2613.     'search_loading','search_no_results','search_no_results_hint','search_results_count','search_view_all','search_view_offer','search_clear',
  2614.     'how_eyebrow','how_title','how_lede',
  2615.     'how1_title','how1_desc','how2_title','how2_desc','how3_title','how3_desc',
  2616.     'feat1_label','feat1_title','feat1_p1','feat1_p2','feat1_quote','feat1_author','feat1_role',
  2617.     'feat2_label','feat2_title','feat2_p1','feat2_p2','feat2_quote','feat2_author','feat2_role',
  2618.     'feat3_label','feat3_title','feat3_p1','feat3_p2','feat3_quote','feat3_author','feat3_role',
  2619.     'feat4_label','feat4_title','feat4_p1','feat4_p2','feat4_quote','feat4_author','feat4_role',
  2620.     'signup_eyebrow','signup_title','signup_lede','signup_email_ph','signup_pass_ph','signup_pass2_ph',
  2621.     'signup_terms_pre','signup_terms_link','signup_btn','signup_login_pre','signup_login_link',
  2622.     'signup_perk1','signup_perk2','signup_perk3',
  2623.     'apps_eyebrow','apps_title','apps_lede','apps_ios','apps_android','apps_web','apps_ios_desc','apps_android_desc','apps_web_desc',
  2624.     'articles_title','articles_view_all','read_article',
  2625.     'final_eyebrow','final_title',
  2626.     'final_recruiter_label','final_recruiter_title','final_recruiter_desc',
  2627.     'final_candidate_label','final_candidate_title','final_candidate_desc',
  2628.     'final_candidate','final_recruiter'
  2629. ] %}
  2631. {% set t = {} %}
  2632. {% for k in _keys %}
  2633.     {% set t = t|merge({(k): ('homepage.' ~ k)|trans({}, 'whr-public')}) %}
  2634. {% endfor %}
  2637. {% block title %}{{ page.shortTitle }}{% endblock %}
  2638. {% block description %}{{ page.shortDescription }}{% endblock %}
  2639. {% block robots %}{{ page.robots }}{% endblock %}
  2640. {% block canonical %}{% include \"/vitrine/lexend/components/languages/canonical_classic.html.twig\" %}{% endblock %}
  2642. {% block css %}
  2643.     {{ parent() }}
  2644.     <style>
  2645.         :root{
  2646.             --wr-bg:#FBFCFE;
  2647.             --wr-bg-2:#F4F6FB;
  2648.             --wr-card:#FFFFFF;
  2649.             --wr-violet:#8A63C1;
  2650.             --wr-violet-2:#A98AD3;
  2651.             --wr-violet-soft:#F2EDFA;
  2652.             --wr-violet-softer:#F8F4FD;
  2653.             --wr-violet-dark:#6B47A6;
  2654.             --wr-ink:#1E1B2E;
  2655.             --wr-ink-2:#374151;
  2656.             --wr-muted:#6B7280;
  2657.             --wr-muted-2:#9CA3AF;
  2658.             --wr-line:#EEF1F7;
  2659.             --wr-line-2:#E5E9F0;
  2660.             --wr-shadow:0 1px 2px rgba(30,27,46,.04),0 4px 16px rgba(30,27,46,.04);
  2661.             --wr-shadow-hover:0 4px 8px rgba(138,99,192,.08),0 12px 32px rgba(138,99,192,.1);
  2662.             /* Accents colorés pour les logos d'offres (lettres) */
  2663.             --wr-acc-yellow:#FEF3C7;  --wr-acc-yellow-fg:#B45309;
  2664.             --wr-acc-green:#D1FAE5;   --wr-acc-green-fg:#047857;
  2665.             --wr-acc-pink:#FCE7F3;    --wr-acc-pink-fg:#BE185D;
  2666.             --wr-acc-blue:#DBEAFE;    --wr-acc-blue-fg:#1E40AF;
  2667.             --wr-acc-orange:#FED7AA;  --wr-acc-orange-fg:#C2410C;
  2668.             --wr-acc-violet:#EDE9FE;  --wr-acc-violet-fg:#6D28D9;
  2669.             --wr-acc-cyan:#CFFAFE;    --wr-acc-cyan-fg:#0E7490;
  2670.         }
  2672.         /* ═══════════════════════════════════════════════════════════════════
  2673.            PLEINE LARGEUR — On retire la réservation d'espace de la sidebar droite
  2674.            ═══════════════════════════════════════════════════════════════════ */
  2675.         body .main-content.right-chat-active{padding-right:0!important}
  2676.         body .main-content{padding-right:0!important}
  2677.         body .right-chat{display:none!important}
  2678.         body .middle-sidebar-bottom .middle-sidebar-left{padding-right:0!important;max-width:none!important;width:100%!important}
  2679.         body .middle-sidebar-bottom{max-width:none!important}
  2681.         .wr{margin:-15px -15px 0;background:var(--wr-bg);color:var(--wr-ink);font-family:inherit;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
  2682.         @media(max-width:991px){.wr{margin:0 -15px}}
  2683.         .wr *{box-sizing:border-box}
  2684.         .wr a{color:inherit;text-decoration:none}
  2686.         /* ═══════════════════════════════════════════════════════════════════
  2687.            SECTIONS GENERIC — Fond UNIFIÉ partout (pas d'alternance)
  2688.            ═══════════════════════════════════════════════════════════════════ */
  2689.         .wr-section{padding:80px 32px;background:var(--wr-bg);position:relative}
  2690.         .wr-section--tight{padding:48px 32px}
  2691.         @media(max-width:768px){.wr-section{padding:56px 20px}.wr-section--tight{padding:36px 20px}}
  2693.         /* Filet décoratif au lieu d'un changement de couleur */
  2694.         .wr-section + .wr-section::before{
  2695.             content:\"\";
  2696.             position:absolute;top:0;left:50%;transform:translateX(-50%);
  2697.             width:80px;height:1px;
  2698.             background:linear-gradient(90deg,transparent,var(--wr-line-2),transparent);
  2699.         }
  2701.         .wr-container{max-width:1200px;margin:0 auto;position:relative}
  2703.         /* ═══ Eyebrow ═══ */
  2704.         .wr-eyebrow{
  2705.             display:inline-flex;align-items:center;gap:8px;
  2706.             padding:6px 14px;border-radius:100px;
  2707.             background:var(--wr-violet-soft);
  2708.             color:var(--wr-violet-dark);
  2709.             font-size:11.5px;font-weight:600;
  2710.             text-transform:uppercase;letter-spacing:.12em;
  2711.             margin-bottom:22px;
  2712.         }
  2713.         .wr-eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--wr-violet);animation:wrPulse 2.4s ease-in-out infinite}
  2714.         @keyframes wrPulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
  2716.         /* ═══ Titres ═══ */
  2717.         .wr-title{
  2718.             font-family:inherit;
  2719.             font-weight:700;
  2720.             font-size:28px;line-height:1.15;letter-spacing:-0.025em;
  2721.             color:var(--wr-ink);
  2722.             margin:0 auto 16px;
  2723.             max-width:1200px;
  2724.         }
  2725.         @media(min-width:768px){.wr-title{font-size:34px}}
  2726.         @media(min-width:1024px){.wr-title{font-size:40px}}
  2727.         .wr-title--sm{font-size:24px}
  2728.         @media(min-width:768px){.wr-title--sm{font-size:30px}}
  2729.         .wr-title em{font-style:normal;font-weight:700;color:var(--wr-violet)}
  2731.         .wr-lede{
  2732.             font-size:17px;line-height:1.55;font-weight:400;
  2733.             color:var(--wr-ink-2);
  2734.             margin:0 auto;max-width:680px;
  2735.         }
  2737.         .wr-section-head{text-align:center;margin-bottom:56px}
  2739.         /* ═══════════════════════════════════════════════════════════════════
  2740.            HERO — Style soft, recherche dashboard, boutons pleins
  2741.            ═══════════════════════════════════════════════════════════════════ */
  2742.         @keyframes wrFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
  2743.         @keyframes wrPulse2{0%{box-shadow:0 0 0 0 rgba(16,185,129,.4)}70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
  2745.         /* ═══ Reveal au scroll (Intersection Observer ajoute .is-revealed) ═══ */
  2746.         .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
  2747.         .reveal.is-revealed{opacity:1;transform:translateY(0)}
  2748.         .reveal--left{transform:translateX(-32px) translateY(0)}
  2749.         .reveal--left.is-revealed{transform:translateX(0)}
  2750.         .reveal--right{transform:translateX(32px) translateY(0)}
  2751.         .reveal--right.is-revealed{transform:translateX(0)}
  2752.         .reveal--scale{transform:scale(.96);opacity:0}
  2753.         .reveal--scale.is-revealed{transform:scale(1);opacity:1}
  2754.         .reveal[data-reveal-delay=\"1\"]{transition-delay:.08s}
  2755.         .reveal[data-reveal-delay=\"2\"]{transition-delay:.16s}
  2756.         .reveal[data-reveal-delay=\"3\"]{transition-delay:.24s}
  2757.         .reveal[data-reveal-delay=\"4\"]{transition-delay:.32s}
  2758.         @media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important}}
  2760.         .hero{
  2761.             position:relative;
  2762.             background:var(--wr-bg);
  2763.             padding:24px 32px 0;
  2764.             overflow:hidden;
  2765.         }
  2766.         @media(max-width:768px){.hero{padding:18px 18px 0}}
  2768.         /* Décor : 2 blobs très flous violet pâle */
  2769.         .hero::before{
  2770.             content:\"\";position:absolute;
  2771.             top:-260px;right:-180px;width:560px;height:560px;
  2772.             background:radial-gradient(circle,rgba(138,99,192,.14) 0%,transparent 65%);
  2773.             pointer-events:none;filter:blur(50px);
  2774.         }
  2775.         .hero::after{
  2776.             content:\"\";position:absolute;
  2777.             top:120px;left:-180px;width:480px;height:480px;
  2778.             background:radial-gradient(circle,rgba(138,99,192,.09) 0%,transparent 65%);
  2779.             pointer-events:none;filter:blur(50px);
  2780.         }
  2782.         .hero-inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;text-align:center}
  2784.         /* ═══ Eyebrow ═══ */
  2785.         .hero-badge{
  2786.             display:inline-flex;align-items:center;gap:8px;
  2787.             padding:7px 16px;border-radius:100px;
  2788.             background:var(--wr-violet-soft);
  2789.             color:var(--wr-violet-dark);
  2790.             font-size:12px;font-weight:600;
  2791.             text-transform:uppercase;letter-spacing:.1em;
  2792.             margin-bottom:10px;
  2793.             opacity:0;transform:translateY(8px);
  2794.             animation:wrFadeUp .8s ease forwards;
  2795.         }
  2796.         .hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--wr-violet);animation:wrPulse2 2s ease infinite}
  2798.         /* ═══ Titre — 57px desktop, plein largeur conteneur ═══ */
  2799.         .hero-title{
  2800.             font-weight:700;
  2801.             font-size:24px;line-height:1.05;letter-spacing:-0.04em;
  2802.             color:var(--wr-ink);
  2803.             margin:0 auto 12px;
  2804.             width:100%;max-width:1200px;
  2805.             opacity:0;transform:translateY(12px);
  2806.             animation:wrFadeUp .9s cubic-bezier(.2,.7,.2,1) .15s forwards;
  2807.         }
  2808.         @media(min-width:768px){.hero-title{font-size:40px;letter-spacing:-0.045em}}
  2809.         @media(min-width:1100px){.hero-title{font-size:57px;letter-spacing:-0.045em}}
  2811.         .hero-title-accent{
  2812.             color:var(--wr-violet);
  2813.         }
  2815.         .hero-lede{
  2816.             font-size:15px;line-height:1.5;color:var(--wr-ink-2);font-weight:400;
  2817.             margin:0 auto 16px;max-width:680px;
  2818.             opacity:0;animation:wrFadeUp .9s ease .4s forwards;
  2819.         }
  2820.         @media(min-width:768px){.hero-lede{font-size:17px}}
  2821.         .hero-lede-accent{color:var(--wr-violet);font-weight:600}
  2823.         /* ═══ Recherche — pleine largeur (alignée sur la liste 1200px) ═══ */
  2824.         .hero-search-wrap{
  2825.             max-width:1200px;margin:0 auto 12px;
  2826.             opacity:0;animation:wrFadeUp .9s ease .55s forwards;
  2827.             position:relative;z-index:5;
  2828.         }
  2829.         .hero-search{
  2830.             background:var(--wr-card);
  2831.             border-radius:14px;
  2832.             box-shadow:0 0 20px 0 rgba(0,0,0,0.05),0 16px 40px rgba(138,99,192,.06);
  2833.             padding:10px;
  2834.             position:relative;
  2835.         }
  2836.         .hero-search-inner{
  2837.             display:flex;align-items:center;gap:10px;
  2838.             padding:10px 14px;border-radius:10px;
  2839.             background:#F9FAFB;border:1px solid #E5E7EB;
  2840.             transition:border-color .2s,background .2s;
  2841.         }
  2842.         .hero-search-inner:focus-within{
  2843.             border-color:rgba(138,99,192,.4);
  2844.             background:#fff;
  2845.         }
  2846.         .hero-search-icon{color:var(--wr-muted-2);display:flex;flex-shrink:0}
  2847.         .hero-search-icon svg{width:16px;height:16px}
  2848.         .hero-search-input{
  2849.             flex:1;border:0;outline:0;background:transparent;
  2850.             font-size:14.5px;font-family:inherit;color:var(--wr-ink);
  2851.             padding:6px 0;min-width:0;
  2852.         }
  2853.         .hero-search-input::placeholder{color:var(--wr-muted-2)}
  2854.         .hero-search-clear{
  2855.             background:none;border:0;color:var(--wr-muted-2);cursor:pointer;
  2856.             padding:4px;display:none;font-family:inherit;
  2857.             border-radius:6px;transition:background .15s,color .15s;
  2858.         }
  2859.         .hero-search-clear:hover{background:var(--wr-violet-soft);color:var(--wr-violet)}
  2860.         .hero-search-clear.is-visible{display:flex;align-items:center}
  2861.         .hero-search-clear svg{width:14px;height:14px}
  2862.         .hero-search-kbd{
  2863.             display:none;align-items:center;
  2864.             padding:3px 8px;background:#fff;border:1px solid #E5E7EB;border-radius:6px;
  2865.             font-size:10.5px;font-weight:600;color:var(--wr-muted);
  2866.             font-family:inherit;letter-spacing:.02em;white-space:nowrap;flex-shrink:0;
  2867.         }
  2868.         .hero-search-inner:focus-within .hero-search-kbd{display:inline-flex}
  2870.         /* ═══ États de la liste de jobs (header, empty, loading) ═══ */
  2871.         .hero-jobs-header{
  2872.             display:flex;align-items:center;justify-content:space-between;gap:10px;
  2873.             padding:14px 22px 10px;
  2874.             border-bottom:1px solid var(--wr-line);
  2875.             margin-bottom:4px;
  2876.         }
  2877.         @media(max-width:540px){.hero-jobs-header{padding:12px 16px 8px}}
  2878.         .hero-jobs-count{
  2879.             font-size:11.5px;color:var(--wr-muted);
  2880.             text-transform:uppercase;letter-spacing:.08em;font-weight:600;
  2881.         }
  2882.         .hero-jobs-count strong{color:var(--wr-violet);font-weight:800;font-size:13px;margin-right:4px}
  2883.         .hero-jobs-link{
  2884.             font-size:11px;font-weight:700;
  2885.             color:var(--wr-violet);
  2886.             text-transform:uppercase;letter-spacing:.08em;
  2887.             text-decoration:none;
  2888.             display:inline-flex;align-items:center;gap:5px;
  2889.             transition:color .15s,transform .15s;
  2890.         }
  2891.         .hero-jobs-link:hover{color:var(--wr-violet-dark);text-decoration:none;transform:translateX(2px)}
  2892.         .hero-jobs-link svg{width:11px;height:11px}
  2894.         .hero-jobs-empty{text-align:center;padding:48px 20px;color:var(--wr-muted)}
  2895.         .hero-jobs-empty-icon{width:48px;height:48px;border-radius:14px;background:var(--wr-violet-soft);color:var(--wr-violet);display:inline-flex;align-items:center;justify-content:center;margin-bottom:14px}
  2896.         .hero-jobs-empty-icon svg{width:22px;height:22px}
  2897.         .hero-jobs-empty-title{font-weight:600;font-size:14px;color:var(--wr-ink);margin:0 0 4px}
  2898.         .hero-jobs-empty-hint{font-size:13px;margin:0;color:var(--wr-muted)}
  2900.         .hero-jobs-loading{text-align:center;padding:36px 20px;color:var(--wr-muted);font-size:13px;display:flex;align-items:center;justify-content:center;gap:10px}
  2901.         .hero-jobs-spinner{width:16px;height:16px;border-radius:50%;border:2px solid var(--wr-violet-soft);border-top-color:var(--wr-violet);animation:wrSpin .7s linear infinite}
  2902.         @keyframes wrSpin{to{transform:rotate(360deg)}}
  2904.         /* ═══ Pills \"Populaire\" sous la recherche ═══ */
  2905.         .hero-popular{
  2906.             display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
  2907.             margin-bottom:18px;
  2908.             opacity:0;animation:wrFadeUp .9s ease .7s forwards;
  2909.         }
  2910.         .hero-popular-label{
  2911.             font-size:11px;font-weight:600;color:var(--wr-muted);
  2912.             text-transform:uppercase;letter-spacing:.06em;
  2913.             margin-right:4px;
  2914.         }
  2915.         .hero-popular-pill{
  2916.             display:inline-flex;align-items:center;gap:5px;
  2917.             padding:6px 12px;border-radius:100px;
  2918.             background:var(--wr-violet-soft);
  2919.             color:var(--wr-violet);
  2920.             font-size:12.5px;font-weight:500;font-family:inherit;
  2921.             text-decoration:none;cursor:pointer;
  2922.             border:1px solid transparent;
  2923.             transition:background .15s,border-color .15s,transform .15s,color .15s;
  2924.         }
  2925.         .hero-popular-pill:hover{
  2926.             background:#EDE9FE;
  2927.             border-color:rgba(138,99,192,.2);
  2928.             transform:translateY(-1px);
  2929.             color:var(--wr-violet);
  2930.             text-decoration:none;
  2931.         }
  2932.         .hero-popular-pill.is-active{
  2933.             background:var(--wr-violet);color:#fff;border-color:var(--wr-violet);
  2934.         }
  2935.         .hero-popular-pill.is-active:hover{background:var(--wr-violet-dark);color:#fff}
  2936.         .hero-popular-pill-icon{font-size:13px;line-height:1}
  2938.         /* ═══ CTA hero (boutons inscription + connexion pour anonymes) ═══ */
  2939.         .hero-cta{
  2940.             display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  2941.             margin:24px 0 8px;
  2942.             opacity:0;animation:wrFadeUp .9s ease 1.1s forwards;
  2943.         }
  2944.         .hero-cta-btn,
  2945.         .hero-cta-btn:link,
  2946.         .hero-cta-btn:visited,
  2947.         .hero-cta-btn:hover,
  2948.         .hero-cta-btn:focus,
  2949.         .hero-cta-btn:active{
  2950.             color:#fff !important;
  2951.             text-decoration:none !important;
  2952.         }
  2953.         .hero-cta-btn{
  2954.             display:inline-flex;align-items:center;gap:8px;
  2955.             padding:11px 20px;border-radius:11px;
  2956.             font-size:13.5px;font-weight:700;font-family:inherit;
  2957.             line-height:1;
  2958.             background:var(--wr-violet);border:1px solid var(--wr-violet);
  2959.             box-shadow:0 4px 14px rgba(138,99,193,.32);
  2960.             transition:background .15s,border-color .15s,transform .15s,box-shadow .15s;
  2961.         }
  2962.         .hero-cta-btn:hover{
  2963.             background:var(--wr-violet-dark);border-color:var(--wr-violet-dark);
  2964.             transform:translateY(-2px);
  2965.             box-shadow:0 6px 20px rgba(138,99,193,.4);
  2966.         }
  2967.         .hero-cta-btn svg{width:15px;height:15px;flex-shrink:0;stroke:#fff !important;color:#fff !important}
  2968.         .hero-cta-btn span{color:#fff !important}
  2969.         @media(max-width:540px){.hero-cta{flex-direction:column;align-items:stretch}.hero-cta-btn{justify-content:center}}
  2971.         /* ═══ Boutons stores — VIOLET PLEIN BLANC ═══ */
  2972.         .hero-stores{
  2973.             display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  2974.             margin-bottom:48px;
  2975.             opacity:0;animation:wrFadeUp .9s ease .85s forwards;
  2976.         }
  2977.         .hero-store-btn{
  2978.             display:inline-flex;align-items:center;gap:10px;
  2979.             padding:13px 24px;border-radius:12px;
  2980.             background:var(--wr-violet);
  2981.             border:0;
  2982.             color:#fff;
  2983.             font-size:14px;font-weight:600;
  2984.             text-decoration:none;
  2985.             transition:background .15s,transform .15s,box-shadow .15s;
  2986.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  2987.         }
  2988.         .hero-store-btn:hover{
  2989.             background:var(--wr-violet-dark);
  2990.             color:#fff;
  2991.             transform:translateY(-2px);
  2992.             box-shadow:0 8px 22px rgba(138,99,192,.4);
  2993.             text-decoration:none;
  2994.         }
  2995.         .hero-store-btn-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px}
  2996.         .hero-store-btn-icon svg{width:18px;height:18px}
  2997.         @media(max-width:540px){.hero-stores{flex-direction:column;align-items:stretch;gap:10px}.hero-store-btn{justify-content:center}}
  2999.         /* ═══════════════════════════════════════════════════════════════════
  3000.            LISTE PAR DÉFAUT SOUS LE HERO (offres récentes)
  3001.            ═══════════════════════════════════════════════════════════════════ */
  3002.         .hero-default-jobs{
  3003.             position:relative;z-index:2;
  3004.             max-width:1200px;margin:0 auto;
  3005.             background:var(--wr-card);
  3006.             border:1px solid var(--wr-line);
  3007.             border-radius:18px;
  3008.             padding:8px 0;
  3009.             box-shadow:var(--wr-shadow);
  3010.             opacity:0;animation:wrFadeUp .9s ease 1s forwards;
  3011.             text-align:left;
  3012.         }
  3013.         .hero-default-job{
  3014.             display:flex;align-items:center;gap:16px;
  3015.             padding:14px 22px;
  3016.             text-decoration:none;color:inherit;
  3017.             border-bottom:1px solid var(--wr-line);
  3018.             transition:background .15s;
  3019.         }
  3020.         .hero-default-job:last-child{border-bottom:0}
  3021.         .hero-default-job:hover{background:var(--wr-violet-softer);text-decoration:none;color:inherit}
  3022.         .hero-default-job-logo{
  3023.             width:42px;height:42px;border-radius:11px;flex-shrink:0;
  3024.             display:flex;align-items:center;justify-content:center;
  3025.             font-weight:700;font-size:16px;overflow:hidden;
  3026.         }
  3027.         .hero-default-job-logo img{width:100%;height:100%;object-fit:cover}
  3028.         /* 7 variantes de couleurs cyclées par index */
  3029.         .hero-default-job:nth-child(7n+1) .hero-default-job-logo{background:var(--wr-acc-yellow);color:var(--wr-acc-yellow-fg)}
  3030.         .hero-default-job:nth-child(7n+2) .hero-default-job-logo{background:var(--wr-acc-green);color:var(--wr-acc-green-fg)}
  3031.         .hero-default-job:nth-child(7n+3) .hero-default-job-logo{background:var(--wr-acc-pink);color:var(--wr-acc-pink-fg)}
  3032.         .hero-default-job:nth-child(7n+4) .hero-default-job-logo{background:var(--wr-acc-blue);color:var(--wr-acc-blue-fg)}
  3033.         .hero-default-job:nth-child(7n+5) .hero-default-job-logo{background:var(--wr-acc-orange);color:var(--wr-acc-orange-fg)}
  3034.         .hero-default-job:nth-child(7n+6) .hero-default-job-logo{background:var(--wr-acc-violet);color:var(--wr-acc-violet-fg)}
  3035.         .hero-default-job:nth-child(7n+7) .hero-default-job-logo{background:var(--wr-acc-cyan);color:var(--wr-acc-cyan-fg)}
  3036.         .hero-default-job-info{flex:1;min-width:0}
  3037.         .hero-default-job-title{
  3038.             font-weight:600;font-size:14.5px;color:var(--wr-ink);
  3039.             margin:0 0 2px;line-height:1.3;
  3040.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  3041.         }
  3042.         .hero-default-job-meta{
  3043.             font-size:12.5px;color:var(--wr-muted);margin:0;
  3044.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  3045.             display:flex;align-items:center;gap:8px;
  3046.         }
  3047.         .hero-default-job-meta-sep{display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--wr-muted-2);flex-shrink:0}
  3048.         .hero-default-job-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  3049.         .hero-default-job-arrow svg{width:15px;height:15px}
  3050.         .hero-default-job:hover .hero-default-job-arrow{color:var(--wr-violet);transform:translateX(3px)}
  3052.         @media(max-width:768px){
  3053.             .hero-default-jobs{margin:0 -18px;border-radius:14px}
  3054.             .hero-default-job{padding:12px 16px;gap:12px}
  3055.             .hero-default-job-logo{width:36px;height:36px;font-size:13px}
  3056.             .hero-default-job-title{font-size:13.5px}
  3057.             .hero-default-job-meta{font-size:11.5px;gap:6px;flex-wrap:wrap;white-space:normal}
  3058.         }
  3060.         /* ═══════════════════════════════════════════════════════════════════
  3061.            SECTION : 3 PARCOURS
  3062.            ═══════════════════════════════════════════════════════════════════ */
  3063.         .paths-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  3064.         @media(max-width:991px){.paths-grid{grid-template-columns:1fr;gap:14px}}
  3066.         .path-card{
  3067.             position:relative;
  3068.             background:var(--wr-card);
  3069.             border:1px solid var(--wr-line);
  3070.             border-radius:20px;padding:28px;
  3071.             display:flex;flex-direction:column;
  3072.             transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  3073.             box-shadow:var(--wr-shadow);
  3074.         }
  3075.         .path-card:hover{transform:translateY(-4px);box-shadow:var(--wr-shadow-hover);border-color:var(--wr-violet-2)}
  3076.         .path-card-illu{
  3077.             width:64px;height:64px;border-radius:16px;
  3078.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3079.             display:flex;align-items:center;justify-content:center;
  3080.             margin-bottom:22px;
  3081.         }
  3082.         .path-card-illu svg{width:30px;height:30px}
  3083.         .path-card-label{
  3084.             display:inline-block;
  3085.             font-size:11px;font-weight:600;
  3086.             color:var(--wr-violet-dark);text-transform:uppercase;letter-spacing:.1em;
  3087.             margin-bottom:10px;align-self:flex-start;
  3088.         }
  3089.         .path-card-title{
  3090.             font-weight:500;font-size:22px;line-height:1.25;letter-spacing:-0.015em;
  3091.             color:var(--wr-ink);margin:0 0 10px;
  3092.         }
  3093.         .path-card-desc{
  3094.             font-size:14px;line-height:1.6;color:var(--wr-muted);
  3095.             margin:0 0 22px;flex:1;
  3096.         }
  3097.         .path-card-cta{
  3098.             display:inline-flex;align-items:center;justify-content:center;gap:6px;
  3099.             background:var(--wr-violet);color:#fff;
  3100.             padding:12px 18px;border-radius:11px;
  3101.             font-size:13px;font-weight:600;
  3102.             align-self:stretch;
  3103.             transition:background .15s,transform .15s,box-shadow .15s;
  3104.             box-shadow:0 2px 8px rgba(138,99,192,.2);
  3105.         }
  3106.         .path-card-cta:hover{background:var(--wr-violet-dark);color:#fff;text-decoration:none;transform:translateY(-1px);box-shadow:0 4px 12px rgba(138,99,192,.3)}
  3107.         .path-card-cta svg{width:13px;height:13px;transition:transform .15s}
  3108.         .path-card-cta:hover svg{transform:translateX(3px)}
  3110.         /* ═══════════════════════════════════════════════════════════════════
  3111.            COMMENT ÇA MARCHE — Card crème englobante avec 3 sous-cards
  3112.            ═══════════════════════════════════════════════════════════════════ */
  3113.         .how-card{
  3114.             background:#F4ECE1;
  3115.             border-radius:24px;
  3116.             padding:32px 24px;
  3117.             display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  3118.             position:relative;
  3119.         }
  3120.         @media(max-width:991px){.how-card{grid-template-columns:1fr;gap:8px;padding:24px 16px}}
  3121.         @media(min-width:992px){
  3122.             /* Séparateurs verticaux entre les 3 cellules */
  3123.             .how-card .how-step + .how-step{border-left:1px solid rgba(28,25,22,.08)}
  3124.         }
  3126.         .how-step{
  3127.             display:flex;flex-direction:column;align-items:center;text-align:center;
  3128.             padding:16px 20px;
  3129.             gap:16px;
  3130.         }
  3131.         .how-step-illu{
  3132.             width:100%;max-width:280px;aspect-ratio:1/1;
  3133.             border-radius:16px;
  3134.             background:rgba(255,255,255,.5);
  3135.             display:flex;align-items:center;justify-content:center;
  3136.             margin-bottom:4px;
  3137.             overflow:hidden;
  3138.         }
  3139.         .how-step-illu img{width:100%;height:100%;object-fit:contain;display:block}
  3140.         .how-step-illu svg{width:55%;height:55%;opacity:.85}
  3141.         .how-step-title{
  3142.             font-weight:700;font-size:18px;line-height:1.3;letter-spacing:-0.01em;
  3143.             color:var(--wr-ink);margin:0;
  3144.         }
  3145.         @media(min-width:992px){.how-step-title{font-size:20px}}
  3146.         .how-step-desc{
  3147.             font-size:14px;line-height:1.55;color:var(--wr-ink-2);
  3148.             margin:0;max-width:320px;
  3149.         }
  3151.         /* ═══════════════════════════════════════════════════════════════════
  3152.            FEATURES 01-04 — Splits alternés image/texte avec témoignages
  3153.            ═══════════════════════════════════════════════════════════════════ */
  3154.         .feat-block{
  3155.             display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
  3156.             margin-bottom:64px;
  3157.         }
  3158.         .feat-block:last-child{margin-bottom:0}
  3159.         @media(max-width:991px){
  3160.             .feat-block{grid-template-columns:1fr;gap:24px;margin-bottom:48px}
  3161.         }
  3163.         /* Alterner : 01 illu droite, 02 illu gauche, 03 illu droite, 04 illu gauche */
  3164.         .feat-block:nth-child(odd) .feat-illu{order:2}
  3165.         .feat-block:nth-child(odd) .feat-content{order:1}
  3166.         .feat-block:nth-child(even) .feat-illu{order:1}
  3167.         .feat-block:nth-child(even) .feat-content{order:2}
  3168.         @media(max-width:991px){
  3169.             .feat-block .feat-illu{order:1}
  3170.             .feat-block .feat-content{order:2}
  3171.         }
  3173.         .feat-illu{
  3174.             background:#F5EDE3;
  3175.             border-radius:20px;
  3176.             aspect-ratio:1/1;
  3177.             display:flex;align-items:center;justify-content:center;
  3178.             color:var(--wr-violet);
  3179.             overflow:hidden;
  3180.             position:relative;
  3181.         }
  3182.         .feat-illu img{width:100%;height:100%;object-fit:contain;display:block}
  3183.         .feat-illu svg{width:50%;height:50%;opacity:.85}
  3185.         .feat-content{display:flex;flex-direction:column;gap:18px}
  3186.         .feat-label{
  3187.             font-size:30px;font-weight:800;
  3188.             color:var(--wr-ink);
  3189.             letter-spacing:-0.02em;
  3190.             margin:0;line-height:1;
  3191.         }
  3192.         .feat-title{
  3193.             font-weight:700;font-size:24px;line-height:1.2;letter-spacing:-0.02em;
  3194.             color:var(--wr-ink);margin:0;
  3195.         }
  3196.         @media(min-width:768px){.feat-title{font-size:28px}}
  3197.         @media(min-width:1100px){.feat-title{font-size:30px}}
  3198.         .feat-desc{
  3199.             display:flex;flex-direction:column;gap:14px;
  3200.         }
  3201.         .feat-desc p{
  3202.             font-size:15px;line-height:1.6;color:var(--wr-ink-2);
  3203.             margin:0;opacity:.85;
  3204.         }
  3205.         @media(min-width:1100px){.feat-desc p{font-size:16px}}
  3206.         .feat-desc strong{color:var(--wr-ink);font-weight:700;opacity:1}
  3208.         .feat-quote{
  3209.             background:var(--wr-card);
  3210.             border:1px solid var(--wr-line);
  3211.             border-radius:14px;
  3212.             padding:18px 20px;
  3213.             display:flex;flex-direction:column;gap:10px;
  3214.             margin-top:8px;
  3215.         }
  3216.         .feat-quote-text{
  3217.             font-size:14px;line-height:1.55;color:var(--wr-ink-2);
  3218.             margin:0;font-style:italic;
  3219.         }
  3220.         .feat-quote-author{
  3221.             display:flex;flex-direction:column;
  3222.         }
  3223.         .feat-quote-name{font-size:13px;font-weight:700;color:var(--wr-ink);margin:0}
  3224.         .feat-quote-role{font-size:12px;color:var(--wr-muted);margin:0}
  3226.         /* ═══════════════════════════════════════════════════════════════════
  3227.            MATCH
  3228.            ═══════════════════════════════════════════════════════════════════ */
  3229.         .match-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
  3230.         @media(max-width:991px){.match-grid{grid-template-columns:1fr;gap:40px}}
  3231.         .match-text .wr-title{margin-left:0;text-align:left}
  3232.         .match-text .wr-lede{margin-left:0;text-align:left}
  3233.         .match-text .wr-eyebrow{margin-bottom:20px}
  3235.         .match-features{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:32px}
  3236.         @media(max-width:540px){.match-features{grid-template-columns:1fr}}
  3237.         .match-feature{
  3238.             background:var(--wr-card);border:1px solid var(--wr-line);
  3239.             border-radius:14px;padding:18px;
  3240.             transition:transform .15s,border-color .15s,box-shadow .15s;
  3241.         }
  3242.         .match-feature:hover{transform:translateY(-2px);border-color:var(--wr-violet-soft);box-shadow:var(--wr-shadow)}
  3243.         .match-feature-icon{
  3244.             width:34px;height:34px;border-radius:10px;
  3245.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3246.             display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px;
  3247.         }
  3248.         .match-feature-icon svg{width:16px;height:16px}
  3249.         .match-feature-title{font-weight:600;font-size:14px;line-height:1.3;color:var(--wr-ink);margin:0 0 5px}
  3250.         .match-feature-desc{font-size:12.5px;line-height:1.5;color:var(--wr-muted);margin:0}
  3252.         .match-visual{position:relative;display:flex;justify-content:center;align-items:center;padding:40px 0}
  3253.         .match-stack{position:relative;width:100%;max-width:340px;height:340px}
  3254.         .match-stack-card{
  3255.             position:absolute;
  3256.             background:var(--wr-card);border:1px solid var(--wr-line);
  3257.             border-radius:16px;padding:14px;
  3258.             display:flex;align-items:center;gap:12px;
  3259.             box-shadow:var(--wr-shadow);width:100%;
  3260.             transition:transform .3s ease,box-shadow .3s ease;
  3261.             cursor:pointer;
  3262.         }
  3263.         .match-stack-card:hover{
  3264.             transform:translateY(-4px) rotate(0deg)!important;
  3265.             box-shadow:0 20px 50px rgba(138,99,192,.22)!important;
  3266.             z-index:10!important;
  3267.         }
  3268.         .match-stack-card:nth-child(1){top:0;transform:rotate(-6deg) translateX(-10px);z-index:1;animation:wrFloat1 6s ease-in-out infinite}
  3269.         .match-stack-card:nth-child(2){top:78px;left:14px;transform:rotate(2deg);z-index:3;box-shadow:0 16px 40px rgba(138,99,192,.18);animation:wrFloat2 6s ease-in-out -2s infinite}
  3270.         .match-stack-card:nth-child(3){top:156px;transform:rotate(-3deg) translateX(8px);z-index:2;animation:wrFloat3 6s ease-in-out -4s infinite}
  3271.         .match-stack-card:nth-child(4){top:234px;left:20px;transform:rotate(4deg);z-index:1;animation:wrFloat4 6s ease-in-out -1s infinite}
  3272.         @keyframes wrFloat1{0%,100%{transform:rotate(-6deg) translate(-10px,0)}50%{transform:rotate(-6deg) translate(-10px,-8px)}}
  3273.         @keyframes wrFloat2{0%,100%{transform:rotate(2deg) translate(0,0)}50%{transform:rotate(2deg) translate(0,-6px)}}
  3274.         @keyframes wrFloat3{0%,100%{transform:rotate(-3deg) translate(8px,0)}50%{transform:rotate(-3deg) translate(8px,-7px)}}
  3275.         @keyframes wrFloat4{0%,100%{transform:rotate(4deg) translate(0,0)}50%{transform:rotate(4deg) translate(0,-5px)}}
  3276.         .match-stack-logo{
  3277.             width:38px;height:38px;border-radius:10px;
  3278.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3279.             display:flex;align-items:center;justify-content:center;
  3280.             font-weight:700;font-size:14px;flex-shrink:0;
  3281.         }
  3282.         .match-stack-info{flex:1;min-width:0}
  3283.         .match-stack-title{font-weight:600;font-size:13px;color:var(--wr-ink);margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
  3284.         .match-stack-meta{font-size:11px;color:var(--wr-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  3285.         .match-stack-heart{
  3286.             width:28px;height:28px;border-radius:50%;
  3287.             background:#FEE2E2;color:#EF4444;
  3288.             display:flex;align-items:center;justify-content:center;flex-shrink:0;
  3289.             animation:wrHeartbeat 1.6s ease-in-out infinite;
  3290.         }
  3291.         .match-stack-card:nth-child(1) .match-stack-heart{animation-delay:0s}
  3292.         .match-stack-card:nth-child(2) .match-stack-heart{animation-delay:.4s}
  3293.         .match-stack-card:nth-child(3) .match-stack-heart{animation-delay:.8s}
  3294.         .match-stack-card:nth-child(4) .match-stack-heart{animation-delay:1.2s}
  3295.         .match-stack-heart svg{width:13px;height:13px;fill:currentColor}
  3296.         @keyframes wrHeartbeat{
  3297.             0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(239,68,68,.4)}
  3298.             10%{transform:scale(1.18);box-shadow:0 0 0 0 rgba(239,68,68,.4)}
  3299.             20%{transform:scale(1)}
  3300.             30%{transform:scale(1.12)}
  3301.             40%{transform:scale(1);box-shadow:0 0 0 10px rgba(239,68,68,0)}
  3302.             100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}
  3303.         }
  3305.         /* ═══════════════════════════════════════════════════════════════════
  3306.            SIGNUP FORM (entre feat 02 et 03)
  3307.            ═══════════════════════════════════════════════════════════════════ */
  3308.         .signup-card{
  3309.             position:relative;
  3310.             max-width:980px;margin:64px auto;
  3311.             background:linear-gradient(135deg, #FFFFFF 0%, #FAF7FF 100%);
  3312.             border:1px solid var(--wr-line);
  3313.             border-radius:32px;
  3314.             padding:48px 40px;
  3315.             box-shadow:0 4px 12px rgba(30,27,46,.04), 0 24px 64px rgba(138,99,192,.1);
  3316.             overflow:hidden;
  3317.         }
  3318.         @media(max-width:768px){.signup-card{padding:32px 22px;border-radius:24px;margin:48px auto}}
  3320.         /* Décor : 2 blobs violet pâle dans les coins */
  3321.         .signup-card::before{
  3322.             content:\"\";position:absolute;
  3323.             top:-120px;right:-120px;width:340px;height:340px;
  3324.             background:radial-gradient(circle,rgba(138,99,192,.12) 0%,transparent 65%);
  3325.             pointer-events:none;filter:blur(40px);
  3326.         }
  3327.         .signup-card::after{
  3328.             content:\"\";position:absolute;
  3329.             bottom:-100px;left:-80px;width:280px;height:280px;
  3330.             background:radial-gradient(circle,rgba(138,99,192,.08) 0%,transparent 65%);
  3331.             pointer-events:none;filter:blur(40px);
  3332.         }
  3334.         .signup-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center}
  3335.         @media(max-width:880px){.signup-inner{grid-template-columns:1fr;gap:28px}}
  3337.         .signup-text{display:flex;flex-direction:column;gap:14px}
  3338.         .signup-eyebrow{
  3339.             display:inline-flex;align-items:center;gap:8px;
  3340.             padding:7px 14px;border-radius:100px;
  3341.             background:var(--wr-violet-soft);color:var(--wr-violet-dark);
  3342.             font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  3343.             align-self:flex-start;
  3344.         }
  3345.         .signup-title{
  3346.             font-weight:700;font-size:28px;line-height:1.15;letter-spacing:-0.02em;
  3347.             color:var(--wr-ink);margin:0;
  3348.         }
  3349.         @media(min-width:768px){.signup-title{font-size:34px}}
  3350.         .signup-lede{font-size:15px;line-height:1.55;color:var(--wr-ink-2);margin:0;opacity:.85}
  3352.         .signup-perks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
  3353.         .signup-perk{
  3354.             display:inline-flex;align-items:center;gap:6px;
  3355.             padding:6px 12px;border-radius:100px;
  3356.             background:var(--wr-card);border:1px solid var(--wr-line-2);
  3357.             font-size:12px;font-weight:600;color:var(--wr-ink-2);
  3358.         }
  3359.         .signup-perk svg{width:13px;height:13px;color:#10B981;stroke-width:3;flex-shrink:0}
  3361.         .signup-form{
  3362.             background:var(--wr-card);
  3363.             border:1px solid var(--wr-line);
  3364.             border-radius:20px;
  3365.             padding:24px;
  3366.             display:flex;flex-direction:column;gap:12px;
  3367.             box-shadow:0 1px 2px rgba(30,27,46,.03);
  3368.         }
  3369.         .signup-form-error{
  3370.             background:#FEF2F2;border:1px solid #FECACA;
  3371.             color:#991B1B;
  3372.             border-radius:12px;
  3373.             padding:10px 14px;
  3374.             font-size:13px;line-height:1.45;
  3375.             margin:0;
  3376.         }
  3377.         .signup-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  3378.         @media(max-width:540px){.signup-row{grid-template-columns:1fr}}
  3379.         .signup-field{display:flex;flex-direction:column;gap:0}
  3380.         .signup-card .signup-form input[type=\"email\"],
  3381.         .signup-card .signup-form input[type=\"password\"],
  3382.         .signup-card .signup-form input[type=\"text\"]{
  3383.             width:100%;
  3384.             padding:13px 14px;
  3385.             border:1px solid var(--wr-line-2);border-radius:11px;
  3386.             background:#FAFBFD;
  3387.             font-size:14px;font-family:inherit;color:var(--wr-ink);
  3388.             outline:none;
  3389.             transition:border-color .15s,background .15s,box-shadow .15s;
  3390.             box-sizing:border-box;
  3391.         }
  3392.         .signup-card .signup-form input[type=\"email\"]:focus,
  3393.         .signup-card .signup-form input[type=\"password\"]:focus,
  3394.         .signup-card .signup-form input[type=\"text\"]:focus{
  3395.             border-color:var(--wr-violet);background:#fff;
  3396.             box-shadow:0 0 0 3px rgba(138,99,192,.12);
  3397.         }
  3398.         .signup-card .signup-form input::placeholder{color:var(--wr-muted-2)}
  3400.         .signup-terms{
  3401.             display:flex;align-items:flex-start;gap:10px;
  3402.             font-size:12.5px;line-height:1.45;color:var(--wr-muted);
  3403.             margin:4px 0 0;
  3404.         }
  3405.         .signup-card .signup-form input[type=\"checkbox\"]{
  3406.             width:16px;height:16px;flex-shrink:0;margin-top:2px;accent-color:var(--wr-violet);cursor:pointer;
  3407.         }
  3408.         .signup-terms a{color:var(--wr-violet);font-weight:600;text-decoration:underline}
  3409.         .signup-terms a:hover{color:var(--wr-violet-dark)}
  3411.         .signup-recaptcha{margin:4px 0 0}
  3412.         .signup-recaptcha > div{max-width:100%}
  3414.         .signup-submit{
  3415.             width:100%;
  3416.             padding:14px 22px;border-radius:12px;
  3417.             background:var(--wr-violet);color:#fff;border:0;
  3418.             font-size:14.5px;font-weight:700;font-family:inherit;
  3419.             cursor:pointer;
  3420.             display:inline-flex;align-items:center;justify-content:center;gap:8px;
  3421.             box-shadow:0 4px 14px rgba(138,99,192,.32);
  3422.             transition:background .15s,transform .15s,box-shadow .15s;
  3423.             margin-top:6px;
  3424.         }
  3425.         .signup-submit:hover{background:var(--wr-violet-dark);transform:translateY(-1px);box-shadow:0 6px 20px rgba(138,99,192,.4)}
  3426.         .signup-submit svg{width:14px;height:14px;transition:transform .15s}
  3427.         .signup-submit:hover svg{transform:translateX(3px)}
  3429.         .signup-login{
  3430.             text-align:center;font-size:13px;color:var(--wr-muted);margin:6px 0 0;
  3431.         }
  3432.         .signup-login a{color:var(--wr-violet);font-weight:600;text-decoration:none}
  3433.         .signup-login a:hover{color:var(--wr-violet-dark);text-decoration:underline}
  3435.         /* ═══════════════════════════════════════════════════════════════════
  3436.            APPS
  3437.            ═══════════════════════════════════════════════════════════════════ */
  3438.         .apps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  3439.         @media(max-width:768px){.apps-grid{grid-template-columns:1fr}}
  3440.         .app-card{
  3441.             background:var(--wr-card);border:1px solid var(--wr-line);
  3442.             border-radius:18px;padding:24px;
  3443.             display:flex;flex-direction:column;align-items:flex-start;
  3444.             transition:transform .2s,border-color .2s,box-shadow .2s;
  3445.         }
  3446.         .app-card:hover{transform:translateY(-3px);border-color:var(--wr-violet-2);box-shadow:var(--wr-shadow-hover);color:inherit;text-decoration:none}
  3447.         .app-card-icon{
  3448.             width:48px;height:48px;border-radius:14px;
  3449.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3450.             display:inline-flex;align-items:center;justify-content:center;
  3451.             margin-bottom:18px;
  3452.         }
  3453.         .app-card-icon svg{width:22px;height:22px}
  3454.         .app-card-name{font-weight:500;font-size:18px;letter-spacing:-0.01em;color:var(--wr-ink);margin:0 0 6px}
  3455.         .app-card-desc{font-size:13px;line-height:1.5;color:var(--wr-muted);margin:0 0 16px;flex:1}
  3456.         .app-card-cta{font-size:12px;font-weight:600;color:var(--wr-violet);text-transform:uppercase;letter-spacing:.1em;display:inline-flex;align-items:center;gap:6px}
  3457.         .app-card-cta svg{width:11px;height:11px;transition:transform .15s}
  3458.         .app-card:hover .app-card-cta svg{transform:translateX(3px)}
  3460.         /* ═══════════════════════════════════════════════════════════════════
  3461.            KEYWORDS
  3462.            ═══════════════════════════════════════════════════════════════════ */
  3463.         .keywords-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:1200px;margin:0 auto}
  3464.         .keyword-pill{
  3465.             display:inline-flex;align-items:center;gap:8px;
  3466.             padding:9px 16px;border-radius:100px;
  3467.             background:var(--wr-card);border:1px solid var(--wr-line-2);
  3468.             color:var(--wr-ink-2);
  3469.             font-size:13.5px;font-weight:500;
  3470.             transition:transform .15s,border-color .15s,background .15s,color .15s,box-shadow .15s;
  3471.         }
  3472.         .keyword-pill:hover{transform:translateY(-2px);border-color:var(--wr-violet);background:var(--wr-violet-soft);color:var(--wr-violet-dark);text-decoration:none;box-shadow:0 4px 10px rgba(138,99,192,.12)}
  3473.         .keyword-pill-icon{font-size:14px;line-height:1}
  3475.         /* ═══════════════════════════════════════════════════════════════════
  3476.            OFFRES POPULAIRES
  3477.            ═══════════════════════════════════════════════════════════════════ */
  3478.         .listings-block{margin-bottom:32px}
  3479.         .listings-block:last-child{margin-bottom:0}
  3480.         .listings-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
  3481.         .listings-block-title{
  3482.             display:inline-flex;align-items:center;gap:10px;
  3483.             font-weight:500;font-size:18px;letter-spacing:-0.005em;
  3484.             color:var(--wr-ink);margin:0;
  3485.         }
  3486.         .listings-block-icon{font-size:20px;line-height:1}
  3487.         .listings-block-link{
  3488.             display:inline-flex;align-items:center;gap:4px;
  3489.             padding:6px 12px;border-radius:100px;
  3490.             font-size:12px;font-weight:600;
  3491.             color:var(--wr-violet);
  3492.             text-transform:uppercase;letter-spacing:.06em;
  3493.             border:1px solid var(--wr-violet-soft);
  3494.             background:var(--wr-card);
  3495.             transition:background .15s,border-color .15s,transform .15s;
  3496.         }
  3497.         .listings-block-link:hover{background:var(--wr-violet-soft);border-color:var(--wr-violet);text-decoration:none;color:var(--wr-violet-dark);transform:translateX(2px)}
  3498.         .listings-block-link svg{width:11px;height:11px}
  3500.         .listings-jobs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  3501.         @media(max-width:768px){.listings-jobs{grid-template-columns:1fr}}
  3502.         .listing-job{
  3503.             display:flex;align-items:center;gap:14px;
  3504.             background:var(--wr-card);border:1px solid var(--wr-line);
  3505.             border-radius:14px;padding:12px;
  3506.             transition:transform .15s,border-color .15s,box-shadow .15s;
  3507.         }
  3508.         .listing-job:hover{transform:translateY(-2px);border-color:var(--wr-violet-soft);box-shadow:var(--wr-shadow);color:inherit;text-decoration:none}
  3509.         .listing-job-logo{
  3510.             width:42px;height:42px;border-radius:11px;flex-shrink:0;
  3511.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3512.             display:flex;align-items:center;justify-content:center;
  3513.             font-weight:700;font-size:14px;overflow:hidden;
  3514.         }
  3515.         .listing-job-logo img{width:100%;height:100%;object-fit:cover}
  3516.         .listing-job-info{flex:1;min-width:0}
  3517.         .listing-job-title{font-weight:600;font-size:13.5px;color:var(--wr-ink);margin:0 0 2px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  3518.         .listing-job-meta{font-size:11.5px;color:var(--wr-muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  3519.         .listing-job-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  3520.         .listing-job-arrow svg{width:14px;height:14px}
  3521.         .listing-job:hover .listing-job-arrow{color:var(--wr-violet);transform:translateX(2px)}
  3523.         /* ═══════════════════════════════════════════════════════════════════
  3524.            ARTICLES — Liste sans miniatures (style identique aux jobs-card)
  3525.            ═══════════════════════════════════════════════════════════════════ */
  3526.         .articles-list{display:flex;flex-direction:column;gap:10px;max-width:1200px;margin:0 auto}
  3527.         .wr-article{
  3528.             background:var(--wr-card);border-radius:14px;padding:14px;
  3529.             box-shadow:0 0 16px 0 rgba(0,0,0,0.04);
  3530.             display:flex;align-items:center;gap:14px;
  3531.             text-decoration:none;color:inherit;
  3532.             transition:transform .15s,box-shadow .2s;
  3533.         }
  3534.         .wr-article:hover{
  3535.             transform:translateY(-1px);
  3536.             box-shadow:0 4px 20px rgba(138,99,192,.1);
  3537.             color:inherit;text-decoration:none;
  3538.         }
  3539.         .wr-article-logo{
  3540.             width:50px;height:50px;border-radius:12px;flex-shrink:0;
  3541.             background:linear-gradient(135deg,#EDE9FE,#DDD6FE);
  3542.             display:flex;align-items:center;justify-content:center;
  3543.             color:var(--wr-violet);overflow:hidden;
  3544.         }
  3545.         .wr-article-logo svg{width:24px;height:24px;opacity:.9}
  3546.         .wr-article-info{flex:1;min-width:0}
  3547.         .wr-article-title{
  3548.             font-size:14px;font-weight:700;color:var(--wr-ink);
  3549.             line-height:1.3;margin:0 0 4px;
  3550.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  3551.         }
  3552.         .wr-article-meta{
  3553.             font-size:12px;color:var(--wr-muted);
  3554.             white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  3555.             display:flex;align-items:center;gap:8px;margin:0;
  3556.         }
  3557.         .wr-article-meta-sep{display:inline-block;width:3px;height:3px;border-radius:50%;background:#D1D5DB;flex-shrink:0}
  3558.         .wr-article-badge{
  3559.             font-size:11px;font-weight:600;
  3560.             color:var(--wr-violet);background:var(--wr-violet-soft);
  3561.             padding:3px 9px;border-radius:100px;
  3562.             white-space:nowrap;flex-shrink:0;
  3563.             text-transform:uppercase;letter-spacing:.04em;
  3564.         }
  3565.         .wr-article-arrow{flex-shrink:0;color:var(--wr-muted-2);transition:color .15s,transform .15s}
  3566.         .wr-article:hover .wr-article-arrow{color:var(--wr-violet);transform:translateX(2px)}
  3567.         .wr-article-arrow svg{width:18px;height:18px}
  3568.         @media(max-width:540px){
  3569.             .wr-article{padding:12px;gap:10px}
  3570.             .wr-article-logo{width:42px;height:42px}
  3571.             .wr-article-logo svg{width:20px;height:20px}
  3572.             .wr-article-title{font-size:13px}
  3573.             .wr-article-meta{font-size:11px;gap:6px;flex-wrap:wrap;white-space:normal}
  3574.             .wr-article-badge{display:none}
  3575.         }
  3577.         .articles-cta{text-align:center;margin-top:36px}
  3578.         .articles-cta a{
  3579.             display:inline-flex;align-items:center;gap:8px;
  3580.             padding:12px 22px;border-radius:11px;
  3581.             background:var(--wr-violet);color:#fff;
  3582.             font-size:13px;font-weight:600;
  3583.             text-decoration:none;
  3584.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  3585.             transition:background .15s,transform .15s,box-shadow .15s;
  3586.         }
  3587.         .articles-cta a:hover{background:var(--wr-violet-dark);transform:translateY(-2px);box-shadow:0 6px 18px rgba(138,99,192,.4);text-decoration:none;color:#fff}
  3588.         .articles-cta svg{width:12px;height:12px;transition:transform .15s}
  3589.         .articles-cta a:hover svg{transform:translateX(3px)}
  3591.         /* ═══════════════════════════════════════════════════════════════════
  3592.            CTA FINAL — Card violet plein avec eyebrow + 2 sous-cards
  3593.            ═══════════════════════════════════════════════════════════════════ */
  3594.         .final-card{
  3595.             position:relative;
  3596.             background:linear-gradient(135deg,#8A63C0 0%,#9D7BCC 100%);
  3597.             border-radius:28px;
  3598.             padding:48px 40px;
  3599.             color:#fff;overflow:hidden;
  3600.             box-shadow:0 20px 60px -12px rgba(138,99,192,.4);
  3601.         }
  3602.         @media(max-width:768px){.final-card{padding:32px 22px;border-radius:22px}}
  3604.         .final-eyebrow{
  3605.             display:inline-flex;align-items:center;gap:8px;
  3606.             padding:8px 18px;border-radius:100px;
  3607.             background:rgba(255,255,255,.2);
  3608.             color:#fff;
  3609.             font-size:12px;font-weight:700;
  3610.             text-transform:uppercase;letter-spacing:.12em;
  3611.             margin-bottom:20px;
  3612.             backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  3613.         }
  3614.         .final-eyebrow svg{width:13px;height:13px;fill:currentColor}
  3616.         .final-title{
  3617.             font-weight:800;font-size:28px;line-height:1.15;letter-spacing:-0.02em;
  3618.             color:#fff;margin:0 0 36px;
  3619.             max-width:780px;
  3620.         }
  3621.         @media(min-width:768px){.final-title{font-size:38px}}
  3623.         /* Grille 2 sous-cards */
  3624.         .final-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  3625.         @media(max-width:768px){.final-grid{grid-template-columns:1fr;gap:14px}}
  3627.         .final-sub{
  3628.             background:#fff;
  3629.             border-radius:18px;
  3630.             padding:28px;
  3631.             display:flex;flex-direction:column;
  3632.         }
  3633.         @media(max-width:768px){.final-sub{padding:22px}}
  3635.         .final-sub-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
  3636.         .final-sub-icon{
  3637.             width:44px;height:44px;border-radius:11px;
  3638.             background:var(--wr-violet-soft);color:var(--wr-violet);
  3639.             display:flex;align-items:center;justify-content:center;flex-shrink:0;
  3640.         }
  3641.         .final-sub-icon svg{width:22px;height:22px}
  3642.         .final-sub-label{
  3643.             font-size:12.5px;font-weight:700;
  3644.             color:var(--wr-violet);
  3645.             text-transform:uppercase;letter-spacing:.1em;
  3646.         }
  3647.         .final-sub-title{
  3648.             font-weight:800;font-size:18px;line-height:1.3;letter-spacing:-0.01em;
  3649.             color:var(--wr-ink);margin:0 0 10px;
  3650.         }
  3651.         .final-sub-desc{
  3652.             font-size:14px;line-height:1.55;color:var(--wr-muted);
  3653.             margin:0 0 24px;flex:1;
  3654.         }
  3655.         .final-sub-btn{
  3656.             display:flex;align-items:center;justify-content:center;gap:8px;
  3657.             background:var(--wr-violet);color:#fff;
  3658.             padding:14px 18px;border-radius:11px;
  3659.             font-size:14px;font-weight:700;
  3660.             text-decoration:none;
  3661.             transition:background .15s,transform .15s,box-shadow .15s;
  3662.             box-shadow:0 4px 12px rgba(138,99,192,.3);
  3663.         }
  3664.         .final-sub-btn:hover{
  3665.             background:var(--wr-violet-dark);color:#fff;
  3666.             transform:translateY(-2px);
  3667.             box-shadow:0 6px 18px rgba(138,99,192,.4);
  3668.             text-decoration:none;
  3669.         }
  3670.         .final-sub-btn svg{width:14px;height:14px;transition:transform .15s}
  3671.         .final-sub-btn:hover svg{transform:translateX(3px)}
  3672.     </style>
  3673. {% endblock css %}
  3675. {% block body %}
  3676.     <div class=\"wr\">
  3678.         {# ═══════════════ HERO ═══════════════ #}
  3679.         <section class=\"hero\">
  3680.             <div class=\"hero-inner\">
  3681.             <span class=\"hero-badge\">
  3682.                 <span class=\"hero-badge-dot\"></span>
  3683.                 {{ t.hero_eyebrow }}
  3684.             </span>
  3686.                 <h1 class=\"hero-title\">
  3687.                     <span class=\"hero-title-accent\">{{ t.hero_title_accent }}</span> {{ t.hero_title_post }}<br>
  3688.                     <span class=\"hero-title-accent\">{{ t.hero_title_accent2 }}</span> {{ t.hero_title_2 }}
  3689.                 </h1>
  3691.                 <p class=\"hero-lede\">
  3692.                     {{ t.hero_lede_pre }}
  3693.                     <span class=\"hero-lede-accent\">{{ t.hero_lede_brand }}</span>
  3694.                     {{ t.hero_lede_mid }}
  3695.                     <span class=\"hero-lede-accent\">{{ t.hero_lede_word }}</span>
  3696.                     {{ t.hero_lede_post }}
  3697.                 </p>
  3699.                 {# Pills \"Populaire\" — AU-DESSUS de la recherche, cliquer remplit l'input #}
  3700.                 {% if popularKeywords is defined and popularKeywords|length > 0 %}
  3701.                     <div class=\"hero-popular\">
  3702.                         <span class=\"hero-popular-label\">{{ t.hero_popular_label }}</span>
  3703.                         {% for kw in popularKeywords|slice(0, 5) %}
  3704.                             <button type=\"button\"
  3705.                                     class=\"hero-popular-pill\"
  3706.                                     data-keyword=\"{{ kw.keyword }}\"
  3707.                                     data-label=\"{{ kw.label }}\">
  3708.                                 {% if kw.icon %}<span class=\"hero-popular-pill-icon\">{{ kw.icon|raw }}</span>{% endif %}
  3709.                                 <span>{{ kw.label }}</span>
  3710.                             </button>
  3711.                         {% endfor %}
  3712.                     </div>
  3713.                 {% endif %}
  3715.                 {# Recherche inline AJAX — style dashboard jobs #}
  3716.                 <div class=\"hero-search-wrap\">
  3717.                     <div class=\"hero-search\" id=\"wrHeroSearch\"
  3718.                          data-search-url=\"{% if isFR %}{{ path('locale_api_jobs_search',{'_locale':'fr'}) }}{% else %}{{ path('api_jobs_search') }}{% endif %}\"
  3719.                          data-jobs-list-url=\"{% if isFR %}{{ path('locale_whileresume_jobs_list',{'_locale':'fr'}) }}{% else %}{{ path('whileresume_jobs_list') }}{% endif %}\">
  3720.                         <div class=\"hero-search-inner\">
  3721.                         <span class=\"hero-search-icon\">
  3722.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  3723.                                 <circle cx=\"11\" cy=\"11\" r=\"8\"/><path d=\"M21 21l-4.35-4.35\"/>
  3724.                             </svg>
  3725.                         </span>
  3726.                             <input type=\"text\" name=\"q\" id=\"wrHeroSearchInput\" class=\"hero-search-input\"
  3727.                                    placeholder=\"{{ t.hero_search_placeholder }}\"
  3728.                                    autocomplete=\"off\" />
  3729.                             <span class=\"hero-search-kbd\">↵ {{ isFR ? 'Entrée' : 'Enter' }}</span>
  3730.                             <button type=\"button\" class=\"hero-search-clear\" id=\"wrHeroSearchClear\" aria-label=\"{{ t.search_clear }}\">
  3731.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  3732.                                     <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"/><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"/>
  3733.                                 </svg>
  3734.                             </button>
  3735.                         </div>
  3736.                     </div>
  3737.                 </div>
  3739.                 {# Liste de jobs — par défaut jobs aléatoires, remplacée par les résultats AJAX #}
  3740.                 {# Le compteur affiche le nombre total d'offres en ligne (toutes langues confondues) #}
  3741.                 {% set _heroCount = 0 %}
  3743.                 <div class=\"hero-default-jobs\" id=\"wrHeroJobsList\">
  3744.                     <div class=\"hero-jobs-header\" id=\"wrHeroJobsHeader\">
  3745.                     <span class=\"hero-jobs-count\" id=\"wrHeroJobsCount\">
  3746.                         <strong>{{ totalJobs ?? 0 }}</strong>{{ t.search_results_count }}
  3747.                     </span>
  3748.                         <a href=\"{% if isFR %}{{ path('locale_whileresume_jobs_list',{'_locale':'fr'}) }}{% else %}{{ path('whileresume_jobs_list') }}{% endif %}\" class=\"hero-jobs-link\" id=\"wrHeroJobsLink\">
  3749.                             {{ t.search_view_all }}
  3750.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  3751.                                 <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/>
  3752.                             </svg>
  3753.                         </a>
  3754.                     </div>
  3756.                     <div id=\"wrHeroJobsBody\">
  3757.                         {% if randomJobs is defined and randomJobs|length > 0 %}
  3758.                             {% for j in randomJobs %}
  3759.                                 {% if _heroCount < 6 %}
  3760.                                     <a href=\"{% if j.locale == 'fr' %}{{ path('locale_cvs_application_job_show',{'_locale':app.request.locale,'slug':j.slug}) }}{% else %}{{ path('cvs_application_job_show',{'slug':j.slug}) }}{% endif %}\" class=\"hero-default-job\">
  3761.                                         <div class=\"hero-default-job-logo\">
  3762.                                             {% if j.image and j.image.name %}
  3763.                                                 <img src=\"{{ vich_uploader_asset(j, 'imageFile') }}\" alt=\"\">
  3764.                                             {% else %}
  3765.                                                 {{ j.companyName|default('?')|slice(0,1)|upper }}
  3766.                                             {% endif %}
  3767.                                         </div>
  3768.                                         <div class=\"hero-default-job-info\">
  3769.                                             <h3 class=\"hero-default-job-title\">{{ j.jobTitle }}</h3>
  3770.                                             <p class=\"hero-default-job-meta\">
  3771.                                                 {% if j.companyName %}<span>{{ j.companyName }}</span>{% endif %}
  3772.                                                 {% if j.city %}
  3773.                                                     <span class=\"hero-default-job-meta-sep\"></span>
  3774.                                                     <span>{{ j.city }}{% if j.country %}, {{ j.country }}{% endif %}</span>
  3775.                                                 {% endif %}
  3776.                                                 {% if j.employmentType %}
  3777.                                                     <span class=\"hero-default-job-meta-sep\"></span>
  3778.                                                     <span>{{ j.employmentType }}</span>
  3779.                                                 {% endif %}
  3780.                                             </p>
  3781.                                         </div>
  3782.                                         <span class=\"hero-default-job-arrow\">
  3783.                                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"9 18 15 12 9 6\"/></svg>
  3784.                                         </span>
  3785.                                     </a>
  3786.                                     {% set _heroCount = _heroCount + 1 %}
  3787.                                 {% endif %}
  3788.                             {% endfor %}
  3789.                         {% endif %}
  3790.                     </div>
  3791.                 </div>
  3793.                 {# CTA pour utilisateurs non connectés : Inscription + Connexion #}
  3794.                 {% if app.user is null %}
  3795.                     <div class=\"hero-cta\">
  3796.                         <a href=\"#register\" class=\"hero-cta-btn\">
  3797.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  3798.                                 <path d=\"M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/><circle cx=\"8.5\" cy=\"7\" r=\"4\"/><line x1=\"20\" y1=\"8\" x2=\"20\" y2=\"14\"/><line x1=\"23\" y1=\"11\" x2=\"17\" y2=\"11\"/>
  3799.                             </svg>
  3800.                             {{ t.hero_cta_signup }}
  3801.                         </a>
  3802.                         <a href=\"{% if isFR %}{{ path('locale_app_login',{'_locale':'fr'}) }}{% else %}{{ path('app_login') }}{% endif %}\" class=\"hero-cta-btn\">
  3803.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  3804.                                 <path d=\"M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4\"/><polyline points=\"10 17 15 12 10 7\"/><line x1=\"15\" y1=\"12\" x2=\"3\" y2=\"12\"/>
  3805.                             </svg>
  3806.                             {{ t.hero_cta_login }}
  3807.                         </a>
  3808.                     </div>
  3809.                 {% endif %}
  3810.             </div>
  3811.         </section>
  3813.         {# ═══════════════ COMMENT ÇA MARCHE ═══════════════ #}
  3814.         <section class=\"wr-section\">
  3815.             <div class=\"wr-container\">
  3816.                 <div class=\"wr-section-head\">
  3817.                     <h2 class=\"wr-title\">{{ t.how_title }}</h2>
  3818.                 </div>
  3820.                 <div class=\"how-card\">
  3821.                     <div class=\"how-step reveal\" data-reveal-delay=\"1\">
  3822.                         <div class=\"how-step-illu\">
  3823.                             <img src=\"/uploads/rh/mascotte_register.png\" alt=\"{{ t.how1_title }}\" loading=\"lazy\">
  3824.                         </div>
  3825.                         <h3 class=\"how-step-title\">{{ t.how1_title }}</h3>
  3826.                         <p class=\"how-step-desc\">{{ t.how1_desc }}</p>
  3827.                     </div>
  3829.                     <div class=\"how-step reveal\" data-reveal-delay=\"2\">
  3830.                         <div class=\"how-step-illu\">
  3831.                             <img src=\"/uploads/rh/mascotte_upload2.png\" alt=\"{{ t.how2_title }}\" loading=\"lazy\">
  3832.                         </div>
  3833.                         <h3 class=\"how-step-title\">{{ t.how2_title }}</h3>
  3834.                         <p class=\"how-step-desc\">{{ t.how2_desc }}</p>
  3835.                     </div>
  3837.                     <div class=\"how-step reveal\" data-reveal-delay=\"3\">
  3838.                         <div class=\"how-step-illu\">
  3839.                             <img src=\"/uploads/rh/mascotte_reunion.png\" alt=\"{{ t.how3_title }}\" loading=\"lazy\">
  3840.                         </div>
  3841.                         <h3 class=\"how-step-title\">{{ t.how3_title }}</h3>
  3842.                         <p class=\"how-step-desc\">{{ t.how3_desc }}</p>
  3843.                     </div>
  3844.                 </div>
  3845.             </div>
  3846.         </section>
  3848.         {# ═══════════════ FEATURES 01-04 ═══════════════ #}
  3849.         <section class=\"wr-section\">
  3850.             <div class=\"wr-container\">
  3852.                 {# Feature 01 — Filtrage par critères #}
  3853.                 <div class=\"feat-block reveal\">
  3854.                     <div class=\"feat-illu\">
  3855.                         <img src=\"/uploads/rh/mascotte_filtrage3.png\" alt=\"{{ t.feat1_title }}\" loading=\"lazy\">
  3856.                     </div>
  3857.                     <div class=\"feat-content\">
  3858.                         <span class=\"feat-label\">{{ t.feat1_label }}</span>
  3859.                         <h3 class=\"feat-title\">{{ t.feat1_title }}</h3>
  3860.                         <div class=\"feat-desc\">
  3861.                             <p>{{ t.feat1_p1|raw }}</p>
  3862.                             <p>{{ t.feat1_p2|raw }}</p>
  3863.                         </div>
  3864.                         <div class=\"feat-quote\">
  3865.                             <p class=\"feat-quote-text\">{{ t.feat1_quote }}</p>
  3866.                             <div class=\"feat-quote-author\">
  3867.                                 <p class=\"feat-quote-name\">{{ t.feat1_author }}</p>
  3868.                                 <p class=\"feat-quote-role\">{{ t.feat1_role }}</p>
  3869.                             </div>
  3870.                         </div>
  3871.                     </div>
  3872.                 </div>
  3874.                 {# Feature 02 — Optimisation intelligente #}
  3875.                 <div class=\"feat-block reveal\">
  3876.                     <div class=\"feat-illu\">
  3877.                         <img src=\"/uploads/rh/mascotte_upload.png\" alt=\"{{ t.feat2_title }}\" loading=\"lazy\">
  3878.                     </div>
  3879.                     <div class=\"feat-content\">
  3880.                         <span class=\"feat-label\">{{ t.feat2_label }}</span>
  3881.                         <h3 class=\"feat-title\">{{ t.feat2_title }}</h3>
  3882.                         <div class=\"feat-desc\">
  3883.                             <p>{{ t.feat2_p1|raw }}</p>
  3884.                             <p>{{ t.feat2_p2|raw }}</p>
  3885.                         </div>
  3886.                         <div class=\"feat-quote\">
  3887.                             <p class=\"feat-quote-text\">{{ t.feat2_quote }}</p>
  3888.                             <div class=\"feat-quote-author\">
  3889.                                 <p class=\"feat-quote-name\">{{ t.feat2_author }}</p>
  3890.                                 <p class=\"feat-quote-role\">{{ t.feat2_role }}</p>
  3891.                             </div>
  3892.                         </div>
  3893.                     </div>
  3894.                 </div>
  3896.                 {% if app.user is null %}
  3897.                     {# ═════ INSCRIPTION (entre feat 02 et 03) ═════ #}
  3898.                     <div class=\"signup-card reveal reveal--scale\" id=\"register\">
  3899.                         <div class=\"signup-inner\">
  3900.                             <div class=\"signup-text\">
  3901.                             <span class=\"signup-eyebrow\">
  3902.                                 <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"/><circle cx=\"8.5\" cy=\"7\" r=\"4\"/><line x1=\"20\" y1=\"8\" x2=\"20\" y2=\"14\"/><line x1=\"23\" y1=\"11\" x2=\"17\" y2=\"11\"/></svg>
  3903.                                 {{ t.signup_eyebrow }}
  3904.                             </span>
  3905.                                 <h3 class=\"signup-title\">{{ t.signup_title }}</h3>
  3906.                                 <p class=\"signup-lede\">{{ t.signup_lede }}</p>
  3907.                                 <div class=\"signup-perks\">
  3908.                                 <span class=\"signup-perk\">
  3909.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  3910.                                     {{ t.signup_perk1 }}
  3911.                                 </span>
  3912.                                     <span class=\"signup-perk\">
  3913.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  3914.                                     {{ t.signup_perk2 }}
  3915.                                 </span>
  3916.                                     <span class=\"signup-perk\">
  3917.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"/></svg>
  3918.                                     {{ t.signup_perk3 }}
  3919.                                 </span>
  3920.                                 </div>
  3921.                             </div>
  3923.                             {% if form is defined %}
  3924.                                 {# Cas 1 : le controller passe le formulaire Symfony — rendu via form_widget #}
  3925.                                 {{ form_start(form, {'attr': {'class': 'signup-form', 'novalidate': 'novalidate'}}) }}
  3926.                                 {{ form_errors(form) }}
  3927.                                 {% for message in app.flashes('danger') %}
  3928.                                     <p class=\"signup-form-error\">{{ message }}</p>
  3929.                                 {% endfor %}
  3931.                                 <div class=\"signup-field\">
  3932.                                     {{ form_widget(form.email, {'attr': {'placeholder': t.signup_email_ph}}) }}
  3933.                                 </div>
  3935.                                 <div class=\"signup-row\">
  3936.                                     <div class=\"signup-field\">
  3937.                                         {{ form_widget(form.password.first, {'attr': {'placeholder': t.signup_pass_ph}}) }}
  3938.                                     </div>
  3939.                                     <div class=\"signup-field\">
  3940.                                         {{ form_widget(form.password.second, {'attr': {'placeholder': t.signup_pass2_ph}}) }}
  3941.                                     </div>
  3942.                                 </div>
  3944.                                 <label class=\"signup-terms\">
  3945.                                     {{ form_widget(form.acceptTerm) }}
  3946.                                     <span>
  3947.                                         {{ t.signup_terms_pre }}
  3948.                                         <a href=\"{% if isFR %}/fr/protections-donnees-candidats{% else %}/data-protection-candidates{% endif %}\" target=\"_blank\" rel=\"noopener\">{{ t.signup_terms_link }}</a>.
  3949.                                     </span>
  3950.                                 </label>
  3952.                                 {% if form.recaptcha is defined %}
  3953.                                     <div class=\"signup-recaptcha\">{{ form_widget(form.recaptcha) }}</div>
  3954.                                 {% endif %}
  3956.                                 <button type=\"submit\" class=\"signup-submit\">
  3957.                                     {{ t.signup_btn }}
  3958.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  3959.                                 </button>
  3961.                                 {{ form_rest(form) }}
  3962.                                 {{ form_end(form) }}
  3963.                             {% endif %}
  3964.                         </div>
  3965.                     </div>
  3966.                 {% endif %}
  3968.                 {# Feature 03 — Recherche qualifiée #}
  3969.                 <div class=\"feat-block reveal\">
  3970.                     <div class=\"feat-illu\">
  3971.                         <img src=\"/uploads/rh/mascotte_register.png\" alt=\"{{ t.feat3_title }}\" loading=\"lazy\">
  3972.                     </div>
  3973.                     <div class=\"feat-content\">
  3974.                         <span class=\"feat-label\">{{ t.feat3_label }}</span>
  3975.                         <h3 class=\"feat-title\">{{ t.feat3_title }}</h3>
  3976.                         <div class=\"feat-desc\">
  3977.                             <p>{{ t.feat3_p1|raw }}</p>
  3978.                             <p>{{ t.feat3_p2|raw }}</p>
  3979.                         </div>
  3980.                         <div class=\"feat-quote\">
  3981.                             <p class=\"feat-quote-text\">{{ t.feat3_quote }}</p>
  3982.                             <div class=\"feat-quote-author\">
  3983.                                 <p class=\"feat-quote-name\">{{ t.feat3_author }}</p>
  3984.                                 <p class=\"feat-quote-role\">{{ t.feat3_role }}</p>
  3985.                             </div>
  3986.                         </div>
  3987.                     </div>
  3988.                 </div>
  3990.                 {# Feature 04 — Contact direct qualifié #}
  3991.                 <div class=\"feat-block reveal\">
  3992.                     <div class=\"feat-illu\">
  3993.                         <img src=\"/uploads/rh/mascotte_reunion.png\" alt=\"{{ t.feat4_title }}\" loading=\"lazy\">
  3994.                     </div>
  3995.                     <div class=\"feat-content\">
  3996.                         <span class=\"feat-label\">{{ t.feat4_label }}</span>
  3997.                         <h3 class=\"feat-title\">{{ t.feat4_title }}</h3>
  3998.                         <div class=\"feat-desc\">
  3999.                             <p>{{ t.feat4_p1|raw }}</p>
  4000.                             <p>{{ t.feat4_p2|raw }}</p>
  4001.                         </div>
  4002.                         <div class=\"feat-quote\">
  4003.                             <p class=\"feat-quote-text\">{{ t.feat4_quote }}</p>
  4004.                             <div class=\"feat-quote-author\">
  4005.                                 <p class=\"feat-quote-name\">{{ t.feat4_author }}</p>
  4006.                                 <p class=\"feat-quote-role\">{{ t.feat4_role }}</p>
  4007.                             </div>
  4008.                         </div>
  4009.                     </div>
  4010.                 </div>
  4012.             </div>
  4013.         </section>
  4016.         {# ═══════════════ APPS ═══════════════ #}
  4017.         <section class=\"wr-section\">
  4018.             <div class=\"wr-container\">
  4019.                 <div class=\"apps-grid\">
  4020.                     <a href=\"{{ isFR ? (ios_fr|default('#')) : (ios_us|default('#')) }}\" class=\"app-card\">
  4021.                     <span class=\"app-card-icon\">
  4022.                         <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z\"/></svg>
  4023.                     </span>
  4024.                         <h3 class=\"app-card-name\">{{ t.apps_ios }}</h3>
  4025.                         <p class=\"app-card-desc\">{{ t.apps_ios_desc }}</p>
  4026.                         <span class=\"app-card-cta\">App Store
  4027.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4028.                     </span>
  4029.                     </a>
  4030.                     <a href=\"{{ isFR ? (android_fr|default('#')) : (android_us|default('#')) }}\" class=\"app-card\">
  4031.                     <span class=\"app-card-icon\">
  4032.                         <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.523 15.34c-.583 0-1.06-.477-1.06-1.06 0-.582.477-1.06 1.06-1.06.583 0 1.06.478 1.06 1.06 0 .583-.477 1.06-1.06 1.06m-11.046 0c-.583 0-1.06-.477-1.06-1.06 0-.582.477-1.06 1.06-1.06.583 0 1.06.478 1.06 1.06 0 .583-.477 1.06-1.06 1.06m11.427-6.176l2.114-3.66a.439.439 0 0 0-.16-.6.439.439 0 0 0-.6.16l-2.142 3.71a13.07 13.07 0 0 0-5.116-1.034c-1.823 0-3.55.376-5.116 1.034l-2.14-3.71a.439.439 0 1 0-.76.44l2.113 3.66C2.486 10.78.659 13.658.5 17h23c-.16-3.342-1.987-6.22-5.595-7.836\"/></svg>
  4033.                     </span>
  4034.                         <h3 class=\"app-card-name\">{{ t.apps_android }}</h3>
  4035.                         <p class=\"app-card-desc\">{{ t.apps_android_desc }}</p>
  4036.                         <span class=\"app-card-cta\">Google Play
  4037.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4038.                     </span>
  4039.                     </a>
  4040.                     <a href=\"{% if app.request.locale == 'en' %}{{ path('whileresume_homepage') }}{% else %}{{ path('locale_whileresume_homepage',{'_locale':app.request.locale}) }}{% endif %}#register\" class=\"app-card\">
  4041.                         <span class=\"app-card-icon\">
  4042.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><line x1=\"2\" y1=\"12\" x2=\"22\" y2=\"12\"/><path d=\"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"/></svg>
  4043.                         </span>
  4044.                         <h3 class=\"app-card-name\">{{ t.apps_web }}</h3>
  4045.                         <p class=\"app-card-desc\">{{ t.apps_web_desc }}</p>
  4046.                         <span class=\"app-card-cta\">whileresume.com
  4047.                         <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4048.                     </span>
  4049.                     </a>
  4050.                 </div>
  4051.             </div>
  4052.         </section>
  4055.         {# ═══════════════ ARTICLES ═══════════════ #}
  4056.         {% if articles is defined and articles|length > 0 %}
  4057.             <section class=\"wr-section\">
  4058.                 <div class=\"wr-container\">
  4059.                     <div class=\"wr-section-head\">
  4060.                         <h2 class=\"wr-title wr-title--sm\">{{ t.articles_title }}</h2>
  4061.                     </div>
  4063.                     <div class=\"articles-list\">
  4064.                         {% for a in articles|slice(0,6) %}
  4065.                             {% set prefix = \"\" %}
  4066.                             {% set urlA = path('cvs_website_article',{'slug': a.slug}) %}
  4067.                             {% if app.request.locale != default_locale %}
  4068.                                 {% set urlA = path('locale_cvs_website_article',{'_locale':app.request.locale,'slug': a.slug}) %}
  4069.                                 {% set prefix = \"/\" ~ app.request.locale %}
  4070.                             {% endif %}
  4071.                             {% if a.pageslug3 is not empty %}
  4072.                                 {% set urlA = prefix ~ '/' ~ a.pageslug ~ '/' ~ a.pageslug2 ~ '/' ~ a.pageslug3 %}
  4073.                             {% elseif a.pageslug2 is not empty %}
  4074.                                 {% set urlA = prefix ~ '/' ~ a.pageslug ~ '/' ~ a.pageslug2 %}
  4075.                             {% elseif a.pageslug is not empty %}
  4076.                                 {% set urlA = prefix ~ '/' ~ a.pageslug %}
  4077.                             {% endif %}
  4079.                             <a href=\"{{ urlA }}\" class=\"wr-article\">
  4080.                                 <div class=\"wr-article-logo\">
  4081.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  4082.                                         <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\"/>
  4083.                                         <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\"/>
  4084.                                     </svg>
  4085.                                 </div>
  4086.                                 <div class=\"wr-article-info\">
  4087.                                     <h3 class=\"wr-article-title\">{{ a.title }}</h3>
  4088.                                     <div class=\"wr-article-meta\">
  4089.                                         {% if a.subtitle is not empty %}
  4090.                                             <span>{{ a.subtitle|length > 60 ? a.subtitle|slice(0,60) ~ '…' : a.subtitle }}</span>
  4091.                                         {% endif %}
  4092.                                     </div>
  4093.                                 </div>
  4094.                                 <span class=\"wr-article-badge\">{{ t.read_article }}</span>
  4095.                                 <span class=\"wr-article-arrow\">
  4096.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  4097.                                     <polyline points=\"9 18 15 12 9 6\"/>
  4098.                                 </svg>
  4099.                             </span>
  4100.                             </a>
  4101.                         {% endfor %}
  4102.                     </div>
  4104.                     <div class=\"articles-cta\">
  4105.                         <a href=\"{% if isFR %}{{ path('locale_cvs_website_articles',{'_locale':'fr'}) }}{% else %}{{ path('cvs_website_articles') }}{% endif %}\">
  4106.                             {{ t.articles_view_all }}
  4107.                             <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4108.                         </a>
  4109.                     </div>
  4110.                 </div>
  4111.             </section>
  4112.         {% endif %}
  4114.         {# ═══════════════ CTA FINAL ═══════════════ #}
  4115.         {% if app.user is null %}
  4116.             <section class=\"wr-section\">
  4117.                 <div class=\"wr-container\">
  4118.                     <div class=\"final-card\">
  4120.                         <h2 class=\"final-title\">{{ t.final_title }}</h2>
  4122.                         <div class=\"final-grid\">
  4123.                             {# Recruteur #}
  4124.                             <div class=\"final-sub\">
  4125.                                 <div class=\"final-sub-head\">
  4126.                             <span class=\"final-sub-icon\">
  4127.                                 <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  4128.                                     <rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"/>
  4129.                                     <path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"/>
  4130.                                 </svg>
  4131.                             </span>
  4132.                                     <span class=\"final-sub-label\">{{ t.final_recruiter_label }}</span>
  4133.                                 </div>
  4134.                                 <h3 class=\"final-sub-title\">{{ t.final_recruiter_title }}</h3>
  4135.                                 <p class=\"final-sub-desc\">{{ t.final_recruiter_desc }}</p>
  4136.                                 <a href=\"{{ path('whileresume_business_' ~ app.request.locale) }}\" class=\"final-sub-btn\">
  4137.                                     {{ t.final_recruiter }}
  4138.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4139.                                 </a>
  4140.                             </div>
  4142.                             {# Candidat #}
  4143.                             <div class=\"final-sub\">
  4144.                                 <div class=\"final-sub-head\">
  4145.                                 <span class=\"final-sub-icon\">
  4146.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">
  4147.                                         <path d=\"M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2\"/>
  4148.                                         <circle cx=\"12\" cy=\"7\" r=\"4\"/>
  4149.                                     </svg>
  4150.                                 </span>
  4151.                                     <span class=\"final-sub-label\">{{ t.final_candidate_label }}</span>
  4152.                                 </div>
  4153.                                 <h3 class=\"final-sub-title\">{{ t.final_candidate_title }}</h3>
  4154.                                 <p class=\"final-sub-desc\">{{ t.final_candidate_desc }}</p>
  4155.                                 <a href=\"{% if app.request.locale == 'en' %}{{ path('whileresume_homepage') }}{% else %}{{ path('locale_whileresume_homepage',{'_locale':app.request.locale}) }}{% endif %}#register\" class=\"final-sub-btn\">
  4156.                                     {{ t.final_candidate }}
  4157.                                     <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"/><polyline points=\"12 5 19 12 12 19\"/></svg>
  4158.                                 </a>
  4159.                             </div>
  4160.                         </div>
  4161.                     </div>
  4162.                 </div>
  4163.             </section>
  4164.         {% endif %}
  4165.     </div>
  4166. {% endblock body %}
  4168. {% block footer_js %}
  4169.     {{ parent() }}
  4170.     <script>
  4171.         (function(){
  4172.             var search   = document.getElementById('wrHeroSearch');
  4173.             var input    = document.getElementById('wrHeroSearchInput');
  4174.             var clearBtn = document.getElementById('wrHeroSearchClear');
  4175.             var jobsBody = document.getElementById('wrHeroJobsBody');
  4176.             var countEl  = document.getElementById('wrHeroJobsCount');
  4177.             var linkEl   = document.getElementById('wrHeroJobsLink');
  4178.             if (!search || !input || !jobsBody) return;
  4180.             var searchUrl   = search.dataset.searchUrl;
  4181.             var jobsListUrl = search.dataset.jobsListUrl;
  4183.             // On garde l'état initial pour pouvoir le restaurer
  4184.             var defaultBodyHtml  = jobsBody.innerHTML;
  4185.             var defaultCountHtml = countEl ? countEl.innerHTML : '';
  4186.             var defaultLinkHref  = linkEl ? linkEl.getAttribute('href') : jobsListUrl;
  4188.             var debounceTimer = null;
  4189.             var currentRequest = null;
  4190.             var lastQuery = '';
  4192.             var T = {
  4193.                 loading:      '{{ t.search_loading|escape('js') }}',
  4194.                 empty:        '{{ t.search_no_results|escape('js') }}',
  4195.                 emptyHint:    '{{ t.search_no_results_hint|escape('js') }}',
  4196.                 count:        '{{ t.search_results_count|escape('js') }}',
  4197.                 viewAll:      '{{ t.search_view_all|escape('js') }}',
  4198.                 view:         '{{ t.search_view_offer|escape('js') }}'
  4199.             };
  4201.             function escHtml(s){
  4202.                 if (s == null) return '';
  4203.                 return String(s).replace(/[&<>\"']/g, function(c){
  4204.                     return {'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[c];
  4205.                 });
  4206.             }
  4208.             function setHeaderCount(total){
  4209.                 if (!countEl) return;
  4210.                 countEl.innerHTML = '<strong>' + total + '</strong>' + escHtml(T.count);
  4211.             }
  4213.             function setHeaderLink(href){
  4214.                 if (!linkEl) return;
  4215.                 linkEl.setAttribute('href', href);
  4216.             }
  4218.             function setLoading(){
  4219.                 jobsBody.innerHTML =
  4220.                     '<div class=\"hero-jobs-loading\">' +
  4221.                     '<span class=\"hero-jobs-spinner\"></span>' +
  4222.                     '<span>' + escHtml(T.loading) + '</span>' +
  4223.                     '</div>';
  4224.             }
  4226.             function setEmpty(){
  4227.                 jobsBody.innerHTML =
  4228.                     '<div class=\"hero-jobs-empty\">' +
  4229.                     '<div class=\"hero-jobs-empty-icon\">' +
  4230.                     '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">' +
  4231.                     '<circle cx=\"11\" cy=\"11\" r=\"8\"/><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"/>' +
  4232.                     '</svg>' +
  4233.                     '</div>' +
  4234.                     '<p class=\"hero-jobs-empty-title\">' + escHtml(T.empty) + '</p>' +
  4235.                     '<p class=\"hero-jobs-empty-hint\">' + escHtml(T.emptyHint) + '</p>' +
  4236.                     '</div>';
  4237.             }
  4239.             function restoreDefault(){
  4240.                 jobsBody.innerHTML = defaultBodyHtml;
  4241.                 if (countEl) countEl.innerHTML = defaultCountHtml;
  4242.                 if (linkEl) linkEl.setAttribute('href', defaultLinkHref);
  4243.             }
  4245.             function renderResults(payload, query){
  4246.                 var jobs  = (payload && payload.jobs)  || [];
  4247.                 var total = (payload && typeof payload.total === 'number') ? payload.total : jobs.length;
  4249.                 setHeaderCount(total);
  4250.                 setHeaderLink(jobsListUrl + '?q=' + encodeURIComponent(query));
  4252.                 if (!jobs.length){
  4253.                     setEmpty();
  4254.                     return;
  4255.                 }
  4257.                 var html = '';
  4258.                 jobs.slice(0, 6).forEach(function(j){
  4259.                     var title   = j.jobTitle || j.title || '';
  4260.                     var company = j.companyName || j.company || '';
  4261.                     var city    = j.city || '';
  4262.                     var country = j.country || '';
  4263.                     var et      = j.employmentType || '';
  4264.                     var img     = j.image || j.imageUrl || '';
  4265.                     var url     = j.url || (jobsListUrl + '?q=' + encodeURIComponent(query));
  4266.                     var initial = (company || title || '?').charAt(0).toUpperCase();
  4268.                     var location = city + (country ? ', ' + country : '');
  4269.                     var metaParts = [];
  4270.                     if (company)  metaParts.push('<span>' + escHtml(company) + '</span>');
  4271.                     if (location) metaParts.push('<span class=\"hero-default-job-meta-sep\"></span><span>' + escHtml(location) + '</span>');
  4272.                     if (et)       metaParts.push('<span class=\"hero-default-job-meta-sep\"></span><span>' + escHtml(et) + '</span>');
  4274.                     html +=
  4275.                         '<a href=\"' + escHtml(url) + '\" class=\"hero-default-job\">' +
  4276.                         '<div class=\"hero-default-job-logo\">' +
  4277.                         (img
  4278.                             ? '<img src=\"' + escHtml(img) + '\" alt=\"\">'
  4279.                             : escHtml(initial)) +
  4280.                         '</div>' +
  4281.                         '<div class=\"hero-default-job-info\">' +
  4282.                         '<h3 class=\"hero-default-job-title\">' + escHtml(title) + '</h3>' +
  4283.                         '<p class=\"hero-default-job-meta\">' + metaParts.join('') + '</p>' +
  4284.                         '</div>' +
  4285.                         '<span class=\"hero-default-job-arrow\">' +
  4286.                         '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"9 18 15 12 9 6\"/></svg>' +
  4287.                         '</span>' +
  4288.                         '</a>';
  4289.                 });
  4291.                 jobsBody.innerHTML = html;
  4292.             }
  4294.             function doSearch(query){
  4295.                 if (currentRequest && currentRequest.abort) {
  4296.                     try { currentRequest.abort(); } catch(e){}
  4297.                 }
  4298.                 setLoading();
  4299.                 var url = searchUrl + (searchUrl.indexOf('?') > -1 ? '&' : '?') + 'q=' + encodeURIComponent(query);
  4301.                 var ctrl = (typeof AbortController !== 'undefined') ? new AbortController() : null;
  4302.                 currentRequest = ctrl;
  4304.                 fetch(url, { headers: { 'Accept': 'application/json' }, signal: ctrl ? ctrl.signal : undefined })
  4305.                     .then(function(r){ return r.ok ? r.json() : Promise.reject(r.status); })
  4306.                     .then(function(data){ renderResults(data, query); })
  4307.                     .catch(function(err){
  4308.                         if (err && err.name === 'AbortError') return;
  4309.                         setEmpty();
  4310.                     });
  4311.             }
  4313.             // Input live (debounce 280ms)
  4314.             input.addEventListener('input', function(){
  4315.                 var q = input.value.trim();
  4316.                 clearBtn.classList.toggle('is-visible', q.length > 0);
  4318.                 if (debounceTimer) clearTimeout(debounceTimer);
  4320.                 if (q.length < 2){
  4321.                     restoreDefault();
  4322.                     lastQuery = '';
  4323.                     return;
  4324.                 }
  4325.                 if (q === lastQuery) return;
  4327.                 debounceTimer = setTimeout(function(){
  4328.                     lastQuery = q;
  4329.                     doSearch(q);
  4330.                 }, 280);
  4331.             });
  4333.             // Enter → page de résultats complète
  4334.             input.addEventListener('keydown', function(e){
  4335.                 if (e.key === 'Enter'){
  4336.                     e.preventDefault();
  4337.                     var q = input.value.trim();
  4338.                     if (!q) return;
  4339.                     window.location.href = jobsListUrl + '?q=' + encodeURIComponent(q);
  4340.                 }
  4341.                 if (e.key === 'Escape'){
  4342.                     input.value = '';
  4343.                     clearBtn.classList.remove('is-visible');
  4344.                     restoreDefault();
  4345.                     lastQuery = '';
  4346.                     input.blur();
  4347.                 }
  4348.             });
  4350.             // Clear
  4351.             clearBtn.addEventListener('click', function(){
  4352.                 input.value = '';
  4353.                 clearBtn.classList.remove('is-visible');
  4354.                 restoreDefault();
  4355.                 lastQuery = '';
  4356.                 input.focus();
  4357.             });
  4359.             // Pills \"Populaire\" — au clic, on remplit l'input et on lance la recherche
  4360.             document.querySelectorAll('.hero-popular-pill').forEach(function(pill){
  4361.                 pill.addEventListener('click', function(){
  4362.                     var keyword = pill.dataset.keyword || pill.dataset.label || '';
  4363.                     if (!keyword) return;
  4365.                     // Visuel actif
  4366.                     document.querySelectorAll('.hero-popular-pill').forEach(function(p){ p.classList.remove('is-active'); });
  4367.                     pill.classList.add('is-active');
  4369.                     input.value = keyword;
  4370.                     clearBtn.classList.add('is-visible');
  4371.                     lastQuery = keyword;
  4372.                     doSearch(keyword);
  4373.                     input.focus();
  4374.                 });
  4375.             });
  4376.         })();
  4378.         /* ═══ Reveal au scroll (Intersection Observer) ═══ */
  4379.         (function(){
  4380.             var els = document.querySelectorAll('.reveal');
  4381.             if (!els.length) return;
  4383.             if (!('IntersectionObserver' in window)){
  4384.                 // Fallback : tout révéler
  4385.                 els.forEach(function(el){ el.classList.add('is-revealed'); });
  4386.                 return;
  4387.             }
  4389.             var io = new IntersectionObserver(function(entries){
  4390.                 entries.forEach(function(entry){
  4391.                     if (entry.isIntersecting){
  4392.                         entry.target.classList.add('is-revealed');
  4393.                         io.unobserve(entry.target);
  4394.                     }
  4395.                 });
  4396.             }, { threshold: 0.12, rootMargin: '0px 0px -60px 0px' });
  4398.             els.forEach(function(el){ io.observe(el); });
  4399.         })();
  4400.     </script>
  4401. {% endblock footer_js %}
  4402. ", "application/whileresume/website/candidates/homepage.html.twig", "/var/www/vhosts/mirtillostudio.fr/b1.mirtillostudio.fr/version-1/templates/application/whileresume/website/candidates/homepage.html.twig");
  4403.     }
  4404. }