{"id":912,"date":"2025-10-23T10:26:45","date_gmt":"2025-10-23T10:26:45","guid":{"rendered":"https:\/\/pescamar.ma\/?page_id=912"},"modified":"2025-10-29T09:44:04","modified_gmt":"2025-10-29T09:44:04","slug":"thon-a-lhuile-de-tournesol-522","status":"publish","type":"page","link":"https:\/\/pescamar.ma\/ar\/thon-a-lhuile-de-tournesol-522\/","title":{"rendered":"thon-a-lhuile-de-tournesol 522"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"912\" class=\"elementor elementor-912\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3094500 e-con-full e-flex e-con e-parent\" data-id=\"3094500\" data-element_type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-530ef99 e-flex e-con-boxed e-con e-child\" data-id=\"530ef99\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f26081b elementor-widget elementor-widget-html\" data-id=\"f26081b\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!doctype html>\n<html lang=\"fr\" dir=\"ltr\">\n<head>\n  <meta charset=\"utf-8\" \/>\n  <meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" \/>\n\n  <!-- Font Awesome (icons) -->\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.2\/css\/all.min.css\"\/>\n\n  <style>\n    :root{\n      --brand: #e60000;\n      --maxw: 1200px;\n\n      \/* valeurs par d\u00e9faut (tablette) *\/\n      --header-h: 72px;\n      --logo-h: 42px;\n      --menu-ico: 24px;\n      --side-w: 340px;\n      --pad-x: 16px;\n    }\n\n    html, body{ margin:0; }\n    body{\n      font-family: Arial, sans-serif;\n      padding-top: calc(var(--header-h) + env(safe-area-inset-top));\n      background:#fafafa;\n    }\n\n    \/* Header fixe (fond blanc) *\/\n    .site-header{\n      position: fixed; top:0; left:0; right:0;\n      height: calc(var(--header-h) + env(safe-area-inset-top));\n      padding-top: env(safe-area-inset-top);\n      background:#fff;\n      border-bottom:1px solid #eee;\n      box-shadow:0 6px 18px -12px rgba(0,0,0,.25);\n      z-index:1000;\n    }\n    .header-inner{\n      height:100%;\n      max-width:var(--maxw);\n      margin:0 auto;\n      padding:0 var(--pad-x);\n      display:grid;\n      grid-template-columns: 48px 1fr 48px; \/* mobile\/tablette *\/\n      align-items:center;\n      gap:8px;\n    }\n\n    \/* Hamburger (mobile\/tablette) *\/\n    .menu-toggle{\n      display:grid; place-items:center;\n      width:48px; height:48px;\n      border:0; background:transparent; cursor:pointer;\n      color:var(--brand); font-size:var(--menu-ico);\n      border-radius:10px;\n      transition: background .2s ease, color .2s ease;\n      padding:0;\n    }\n    .menu-toggle:hover, .menu-toggle:focus-visible{\n      background:var(--brand); color:#fff; outline:none;\n    }\n\n    \/* Nav desktop (cach\u00e9e par d\u00e9faut) *\/\n    .main-nav{ display:none; align-items:center; gap:48px; }\n    .nav-link{\n      position:relative; text-decoration:none;\n      color:#111; font-weight:800; letter-spacing:.2px;\n      padding:10px 0; transition: color .2s ease;\n    }\n    .nav-link::after{\n      content:\"\"; position:absolute; left:0; bottom:-6px;\n      height:3px; width:0; background:var(--brand);\n      transition: width .2s ease;\n    }\n    .nav-link:hover{ color: var(--brand); }\n    .nav-link:hover::after{ width:100%; }\n    .nav-link.is-active::after{ width:100%; }\n\n    \/* Logo *\/\n    .logo{ display:inline-flex; justify-content:center; }\n    .logo img{\n      height:var(--logo-h);\n      max-height:calc(var(--header-h) - 24px);\n      display:block;\n    }\n    .right-slot{ width:48px; height:48px; }\n\n    \/* Side nav (mobile\/tablette) *\/\n    .side-nav{\n      position:fixed; top:0; left:0; bottom:0;\n      width:var(--side-w); background:#fff;\n      border-right:1px solid #eee;\n      transform:translateX(-100%);\n      transition:transform .25s ease;\n      z-index:1200;\n      display:flex; flex-direction:column;\n      padding-top: env(safe-area-inset-top);\n    }\n    .side-nav-header{\n      height:var(--header-h);\n      display:flex; align-items:center; justify-content:space-between;\n      padding:0 16px; border-bottom:1px solid #eee;\n    }\n    .close-nav{\n      border:0; background:transparent; cursor:pointer;\n      font-size:22px; color:#888; width:40px; height:40px;\n      border-radius:10px; transition: background .2s ease, color .2s ease;\n    }\n    .close-nav:hover, .close-nav:focus-visible{ background:var(--brand); color:#fff; outline:none; }\n\n    .side-nav a{\n      display:flex; align-items:center; gap:10px;\n      padding:14px 18px;\n      color:#333; text-decoration:none; font-weight:600;\n      border-bottom:1px solid #f3f3f3;\n      transition: background .2s ease, color .2s ease;\n    }\n    .side-nav a i{ color:var(--brand); width:20px; text-align:center; transition: color .2s ease; }\n    .side-nav a:hover, .side-nav a:focus-visible{ background:var(--brand); color:#fff; outline:none; }\n    .side-nav a:hover i, .side-nav a:focus-visible i{ color:#fff; }\n\n    .nav-backdrop{\n      position:fixed; inset:0; background:rgba(0,0,0,.35);\n      opacity:0; visibility:hidden; transition: opacity .2s ease, visibility .2s ease;\n      z-index:1100;\n    }\n    body.nav-open .side-nav{ transform:translateX(0); }\n    body.nav-open .nav-backdrop{ opacity:1; visibility:visible; }\n    body.nav-open{ overflow:hidden; }\n\n    \/* \u2014\u2014\u2014 Breakpoints \u2014\u2014\u2014 *\/\n\n    \/* Mobile \u2264 599px \u2014 header\/ logo grands comme demand\u00e9 *\/\n    @media (max-width:599px){\n      :root{\n        --header-h: 100px;\n        --logo-h: 100px;\n        --menu-ico: 22px;\n        --side-w: 70vw;\n        --pad-x: 12px;\n      }\n      .header-inner{ grid-template-columns:44px 1fr 44px; }\n      .menu-toggle{ width:44px; height:44px; }\n      .logo img{ height:100px !important; max-height:none !important; }\n    }\n\n    \/* Tablet 600\u20131023px *\/\n    @media (min-width:600px) and (max-width:1023px){\n      :root{\n        --header-h:72px; --logo-h:42px; --menu-ico:24px; --side-w:340px; --pad-x:20px;\n      }\n    }\n\n    \/* Desktop \u2265 1024px \u2014 menu visible \u00e0 gauche, logo totalement \u00e0 droite *\/\n    @media (min-width:1024px){\n      :root{\n        --header-h:140px; --logo-h:140px; --menu-ico:22px; --side-w:380px; --pad-x:24px;\n      }\n      .header-inner{\n        max-width:1280px;\n        grid-template-columns: auto 1fr auto; \/* nav | spacer | logo *\/\n      }\n      .menu-toggle{ display:none; }           \/* cacher hamburger *\/\n      .main-nav{ display:flex; justify-self:start; }\n      .right-slot{ display:none; }\n\n      .logo{ justify-self: end; }             \/* logo extr\u00eame droite *\/\n      .site-header{\n        background:#fff; border-bottom:1px solid #eee;\n        box-shadow:0 6px 18px -12px rgba(0,0,0,.25);\n      }\n      .nav-link{ color:#111; }\n    }\n\n    @media (prefers-reduced-motion: reduce){\n      .menu-toggle, .side-nav, .nav-backdrop{ transition:none; }\n    }\n  <\/style>\n<\/head>\n<body>\n\n  <header class=\"site-header\" role=\"banner\">\n    <div class=\"header-inner\">\n      <!-- Hamburger (mobile\/tablette) -->\n      <button class=\"menu-toggle\" aria-label=\"Ouvrir le menu\" aria-expanded=\"false\" aria-controls=\"sideNav\">\n        <i class=\"fa-solid fa-bars\"><\/i>\n      <\/button>\n\n      <!-- Menu desktop (visible \u22651024px) -->\n      <nav class=\"main-nav\" aria-label=\"Navigation principale\">\n        <a href=\"\/ar\/\" class=\"nav-link is-active\">\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/a>\n        <!-- NEW: \u00c0 propos de Pescamar -->\n        <a href=\"\/ar\/apropos\/\" class=\"nav-link\">\u0639\u0646 Pescamar<\/a>\n        <a href=\"\/ar\/#produits\" class=\"nav-link\">\u0627\u0644\u0645\u0646\u062a\u062c\u0627\u062a<\/a>\n        <a href=\"\/ar\/#contact\" class=\"nav-link\">\u0627\u062a\u0635\u0644 \u0628\u0646\u0627<\/a>\n      <\/nav>\n\n      <!-- Logo \u2014 en desktop il est align\u00e9 totalement \u00e0 droite -->\n      <a href=\"\/ar\/\" class=\"logo\" aria-label=\"\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629\">\n        <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/logo-1.png\" alt=\"Logo Pescamar\">\n      <\/a>\n\n      <div class=\"right-slot\"><\/div>\n    <\/div>\n  <\/header>\n\n  <!-- Side menu (mobile\/tablette) -->\n  <nav id=\"sideNav\" class=\"side-nav\" aria-label=\"Navigation lat\u00e9rale\">\n    <div class=\"side-nav-header\">\n      <strong>Menu<\/strong>\n      <button class=\"close-nav\" aria-label=\"Fermer le menu\"><i class=\"fa-solid fa-xmark\"><\/i><\/button>\n    <\/div>\n    <a href=\"\/ar\/\"><i class=\"fa-solid fa-house\"><\/i> \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/a>\n    <a href=\"\/ar\/apropos\/\"><i class=\"fa-solid fa-circle-info\"><\/i> \u0639\u0646 Pescamar<\/a>\n    <a href=\"\/ar\/#produits\"><i class=\"fa-solid fa-boxes-stacked\"><\/i> \u0627\u0644\u0645\u0646\u062a\u062c\u0627\u062a<\/a>\n    <a href=\"\/ar\/#contact\"><i class=\"fa-solid fa-envelope\"><\/i> \u0627\u062a\u0635\u0644 \u0628\u0646\u0627<\/a>\n  <\/nav>\n  <div class=\"nav-backdrop\" aria-hidden=\"true\"><\/div>\n\n  <script>\n    (function(){\n      const body = document.body;\n      const btnOpen = document.querySelector('.menu-toggle');\n      const btnClose = document.querySelector('.close-nav');\n      const backdrop = document.querySelector('.nav-backdrop');\n      const links = document.querySelectorAll('#sideNav a');\n\n      const openNav = () => {\n        body.classList.add('nav-open');\n        btnOpen?.setAttribute('aria-expanded','true');\n        links[0]?.focus();\n      };\n      const closeNav = () => {\n        body.classList.remove('nav-open');\n        btnOpen?.setAttribute('aria-expanded','false');\n        btnOpen?.focus();\n      };\n\n      btnOpen?.addEventListener('click', () => {\n        body.classList.contains('nav-open') ? closeNav() : openNav();\n      });\n      btnClose.addEventListener('click', closeNav);\n      backdrop.addEventListener('click', closeNav);\n      document.addEventListener('keydown', (e) => { if(e.key === 'Escape') closeNav(); });\n\n      \/\/ Active link helper (marks desktop nav link based on hash OR path)\n      const desktopNavLinks = document.querySelectorAll('.main-nav .nav-link');\n      const markActive = () => {\n        const hash = location.hash.replace('#','');\n        const path = location.pathname.replace(\/\\\/+$\/,'');\n        desktopNavLinks.forEach(a => {\n          a.classList.remove('is-active');\n          const href = a.getAttribute('href');\n          const h = (href.split('#')[1] || '').trim();\n          if (h && hash && h === hash) a.classList.add('is-active');\n          else if (!h && (href === path || href === '\/')) a.classList.add('is-active');\n        });\n      };\n      window.addEventListener('hashchange', markActive);\n      markActive();\n\n      \/\/ Close sideNav when a link is clicked\n      links.forEach(a => a.addEventListener('click', closeNav));\n    })();\n  <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9d30efe elementor-widget elementor-widget-heading\" data-id=\"9d30efe\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u062a\u0648\u0646\u0629 \u0628\u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633\n<\/h2>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9e4cdc8 e-flex e-con-boxed e-con e-child\" data-id=\"9e4cdc8\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ca0219d elementor-widget elementor-widget-image\" data-id=\"ca0219d\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"1024\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-1024x1024.png\" class=\"attachment-large size-large wp-image-1078\" alt=\"\" srcset=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-1024x1024.png 1024w, https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-300x300.png 300w, https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-150x150.png 150w, https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-768x768.png 768w, https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53-12x12.png 12w, https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53.png 1080w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5e37d11 e-flex e-con-boxed e-con e-parent\" data-id=\"5e37d11\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-141f6aa elementor-widget elementor-widget-html\" data-id=\"141f6aa\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!doctype html>\n<html lang=\"fr\" dir=\"ltr\">\n<head>\n  <meta charset=\"utf-8\" \/>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/>\n  <title>Tabs Produits (FR)<\/title>\n\n  <!-- Font Awesome -->\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.2\/css\/all.min.css\" \/>\n\n  <style>\n    \/* hide radios *\/\n    .tabs-container-hack input[type=\"radio\"] { display: none; }\n\n    \/* Tabs bar: now 5 items (sans Palette) *\/\n    .tabs-container-hack{\n      display: grid;\n      grid-template-columns: repeat(5, 1fr);\n      width: 100%;\n      box-sizing: border-box;\n    }\n    .tab-label{\n      display:flex; align-items:center; justify-content:center;\n      gap:8px; cursor:pointer; color:#999;\n      border-bottom:3px solid transparent;\n      transition: color .3s, border-color .3s, background .3s;\n      padding:10px 0; text-align:center; user-select:none;\n    }\n    .tab-label i{ font-size:28px; color:inherit; line-height:1; }\n\n    .tabs-container-hack input[type=\"radio\"]:checked + .tab-label{\n      color:#e60000; border-bottom-color:#e60000;\n    }\n\n    \/* content area *\/\n    .tabs-content-wrapper{\n      grid-column: 1 \/ -1;\n      margin-top:12px; width:100%; box-sizing:border-box;\n    }\n\n    .panel{\n      border:1px solid #e9e9e9; border-radius:4px;\n      padding:16px; background:#fff;\n    }\n\n    .spec-title{\n      margin:0 0 12px;\n      font-family: Arial, sans-serif; font-weight:700; letter-spacing:.3px;\n      color:#333; text-transform:uppercase;\n    }\n\n    .product-specs-table{ width:100%; font-family:Arial, sans-serif; color:#333; border-radius:4px; overflow:hidden; }\n    .spec-row{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid #eee; }\n    .spec-row:last-child{ border-bottom:none; }\n    .label{ flex:1; padding-left:15px; font-weight:600; color:#333; }\n    .value{ min-width:120px; text-align:right; padding-right:15px; font-variant-numeric: tabular-nums; color:#555; }\n\n    .spec-paragraph{ margin:0; font-family:Arial, sans-serif; color:#444; line-height:1.6; font-size:15.5px; }\n\n    .tab-content{ display:none; }\n    #tab-radio-1:checked ~ .tabs-content-wrapper #tab-content-1{ display:block; }\n    #tab-radio-2:checked ~ .tabs-content-wrapper #tab-content-2{ display:block; }\n    #tab-radio-4:checked ~ .tabs-content-wrapper #tab-content-4{ display:block; }\n    #tab-radio-5:checked ~ .tabs-content-wrapper #tab-content-5{ display:block; }\n    #tab-radio-6:checked ~ .tabs-content-wrapper #tab-content-6{ display:block; }\n\n    .tab-label:focus-visible{ outline:2px solid #e60000; outline-offset:-2px; }\n  <\/style>\n<\/head>\n<body>\n\n  <div class=\"tabs-container-hack\">\n    <!-- 1: Bo\u00eete (Conserve) -->\n    <input type=\"radio\" name=\"tab-group\" id=\"tab-radio-1\" checked \/>\n    <label for=\"tab-radio-1\" class=\"tab-label\" title=\"Bo\u00eete (Conserve)\" aria-label=\"Bo\u00eete (Conserve)\">\n      <i class=\"fas fa-box\"><\/i>\n    <\/label>\n\n    <!-- 2: Bo\u00eete (Carton) -->\n    <input type=\"radio\" name=\"tab-group\" id=\"tab-radio-2\" \/>\n    <label for=\"tab-radio-2\" class=\"tab-label\" title=\"Bo\u00eete (Carton)\" aria-label=\"Bo\u00eete (Carton)\">\n      <i class=\"fas fa-box-open\"><\/i>\n    <\/label>\n\n    <!-- 3: Nutrition (we keep id=4 to match CSS selectors) -->\n    <input type=\"radio\" name=\"tab-group\" id=\"tab-radio-4\" \/>\n    <label for=\"tab-radio-4\" class=\"tab-label\" title=\"Nutrition\" aria-label=\"Nutrition\">\n      <i class=\"fas fa-weight-scale\"><\/i>\n    <\/label>\n\n    <!-- 4: Ingr\u00e9dients -->\n    <input type=\"radio\" name=\"tab-group\" id=\"tab-radio-5\" \/>\n    <label for=\"tab-radio-5\" class=\"tab-label\" title=\"\u0627\u0644\u0645\u0643\u0648\u0651\u0646\u0627\u062a\" aria-label=\"\u0627\u0644\u0645\u0643\u0648\u0651\u0646\u0627\u062a\">\n      <i class=\"fas fa-seedling\"><\/i>\n    <\/label>\n\n    <!-- 5: Allerg\u00e8nes -->\n    <input type=\"radio\" name=\"tab-group\" id=\"tab-radio-6\" \/>\n    <label for=\"tab-radio-6\" class=\"tab-label\" title=\"\u0627\u0644\u0645\u0648\u0627\u062f \u0627\u0644\u0645\u0633\u0628\u0628\u0629 \u0644\u0644\u062d\u0633\u0627\u0633\u064a\u0629\" aria-label=\"\u0627\u0644\u0645\u0648\u0627\u062f \u0627\u0644\u0645\u0633\u0628\u0628\u0629 \u0644\u0644\u062d\u0633\u0627\u0633\u064a\u0629\">\n      <i class=\"fas fa-ban\"><\/i>\n    <\/label>\n\n    <div class=\"tabs-content-wrapper\">\n      <!-- Tab 1: Bo\u00eete (Conserve) -->\n      <div id=\"tab-content-1\" class=\"tab-content\">\n        <div class=\"panel\">\n          <div class=\"product-specs-table\">\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0635\u0627\u0641\u064a<\/div><div class=\"value\">522<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u0635\u0641\u0651\u0649<\/div><div class=\"value\">340<\/div><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Tab 2: Bo\u00eete (Carton) -->\n      <div id=\"tab-content-2\" class=\"tab-content\">\n        <div class=\"panel\">\n          <div class=\"product-specs-table\">\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0648\u062d\u062f\u0627\u062a \/ \u0639\u0644\u0628\u0629<\/div><div class=\"value\">24<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0637\u0648\u0644 (\u0645\u0645)<\/div><div class=\"value\">470<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0627\u0631\u062a\u0641\u0627\u0639 (\u0645\u0645)<\/div><div class=\"value\">150<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0639\u0631\u0636 (\u0645\u0645)<\/div><div class=\"value\">320<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0648\u0632\u0646 (\u0643\u063a)<\/div><div class=\"value\">15,8<\/div><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Tab 3: Nutrition -->\n      <div id=\"tab-content-4\" class=\"tab-content\">\n        <div class=\"panel\">\n          <div class=\"product-specs-table\">\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0642\u064a\u0645\u0629 \u0627\u0644\u0637\u0627\u0642\u064a\u0629<\/div><div class=\"value\">1675kJ\/405 Kcal<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u062f\u0647\u0648\u0646<\/div><div class=\"value\">38g<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u062f\u0647\u0648\u0646 \u0627\u0644\u0645\u0634\u0628\u0651\u0639\u0629<\/div><div class=\"value\">3,9g<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0643\u0631\u0628\u0648\u0647\u064a\u062f\u0631\u0627\u062a<\/div><div class=\"value\">0,5g<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0633\u0643\u0631\u064a\u0627\u062a<\/div><div class=\"value\">0g<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0628\u0631\u0648\u062a\u064a\u0646\u0627\u062a<\/div><div class=\"value\">15g<\/div><\/div>\n            <div class=\"spec-row\"><div class=\"label\">\u0627\u0644\u0645\u0644\u062d<\/div><div class=\"value\">1g<\/div><\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Tab 4: Ingr\u00e9dients -->\n      <div id=\"tab-content-5\" class=\"tab-content\">\n        <div class=\"panel\">\n          <h3 class=\"spec-title\">\u0627\u0644\u0645\u0643\u0648\u0651\u0646\u0627\u062a<\/h3>\n          <p class=\"spec-paragraph\">\n            \u062a\u0648\u0646\u0629 (\u0643\u0627\u062a\u0633\u0648\u0627\u0646\u0648\u0633 \u0628\u064a\u0644\u0627\u0645\u064a\u0633)\u060c \u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633\u060c \u0645\u0644\u062d\n          <\/p>\n        <\/div>\n      <\/div>\n\n      <!-- Tab 5: Allerg\u00e8nes -->\n      <div id=\"tab-content-6\" class=\"tab-content\">\n        <div class=\"panel\">\n          <h3 class=\"spec-title\">\u0627\u0644\u0645\u0648\u0627\u062f \u0627\u0644\u0645\u0633\u0628\u0628\u0629 \u0644\u0644\u062d\u0633\u0627\u0633\u064a\u0629<\/h3>\n          <p class=\"spec-paragraph\">\n            \u0627\u0644\u0623\u0633\u0645\u0627\u0643 \u0648\u0645\u0634\u062a\u0642\u0627\u062a\u0647\u0627. \u064a\u0648\u062c\u062f \u0641\u064a \u0627\u0644\u0645\u0646\u0634\u0623\u0629: \u062b\u0627\u0646\u064a \u0623\u0643\u0633\u064a\u062f \u0627\u0644\u0643\u0628\u0631\u064a\u062a \u0648\u0627\u0644\u0643\u0628\u0631\u064a\u062a\u0627\u062a\u060c \u0648\u0627\u0644\u0631\u062e\u0648\u064a\u0627\u062a \u0648\u0645\u0634\u062a\u0642\u0627\u062a\u0647\u0627.\n          <\/p>\n        <\/div>\n      <\/div>\n    <\/div><!-- \/tabs-content-wrapper -->\n  <\/div>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-70aaf18 e-flex e-con-boxed e-con e-parent\" data-id=\"70aaf18\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-08d782d elementor-widget elementor-widget-heading\" data-id=\"08d782d\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u0639\u0631\u0648\u0636 \u062a\u0642\u062f\u064a\u0645\u064a\u0629 \u0623\u062e\u0631\u0649\n<\/h2>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-22fb460 e-flex e-con-boxed e-con e-parent\" data-id=\"22fb460\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-59676b4 elementor-widget elementor-widget-html\" data-id=\"59676b4\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!doctype html>\n<html lang=\"fr\" dir=\"ltr\">\n<head>\n  <meta charset=\"utf-8\" \/>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/>\n  <title>Produits Pescamar \u2014 arri\u00e8re\u2011plan transparent<\/title>\n\n  <!-- Fonts -->\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Merriweather:wght@700;900&display=swap\" rel=\"stylesheet\">\n\n  <style>\n    :root{\n      --brand-blue: #1ea6e1;\n      --maxw      : 1200px;\n      --title-font: 'Merriweather', Georgia, 'Times New Roman', serif;\n      --text-font : Arial, Helvetica, system-ui, sans-serif;\n      --ink       : #111;\n    }\n\n    html, body{ margin:0; }\n    body{ font-family: var(--text-font); background:#fff; color:var(--ink); }\n\n    \/* Section (transparent) *\/\n    .products-section{\n      padding: clamp(28px, 5vw, 64px) 0;\n      background: transparent; \/* \u2190 transparent *\/\n    }\n    .products-section .container{\n      max-width: var(--maxw);\n      margin: 0 auto;\n      padding: 0 16px;\n    }\n\n    \/* Title *\/\n    .section-title{\n      margin: 0 0 22px;\n      font-family: var(--title-font);\n      font-weight: 900;\n      font-size: clamp(28px, 6vw, 48px);\n      line-height: 1.1;\n      text-align: center;\n      color: var(--brand-blue);\n      letter-spacing: .2px;\n    }\n\n    \/* Grid *\/\n    .products-grid{\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n      gap: clamp(28px, 5vw, 48px);\n    }\n\n    \/* Card: blue only left + bottom, transparent background *\/\n    .product-card{\n      display: grid;\n      grid-template-rows: auto 1fr auto;\n      gap: 12px;\n      background: transparent;            \/* \u2190 transparent *\/\n      border-radius: 14px 12px 24px 12px; \/* bas-gauche plus arrondi *\/\n      border-top: 0;\n      border-right: 0;\n      border-left: 4px solid var(--brand-blue);\n      border-bottom: 4px solid var(--brand-blue);\n      padding: 14px 16px 18px;\n      transition: transform .12s ease, box-shadow .12s ease;\n    }\n    .product-card:hover{ transform: translateY(-2px); }\n\n    \/* Head *\/\n    .product-head{ text-align:center; margin-bottom: 2px; }\n    .product-title{\n      margin: 0;\n      font-family: var(--title-font);\n      font-weight: 900;\n      font-size: clamp(18px, 2.6vw, 22px);\n      color: var(--brand-blue);\n      letter-spacing: .2px;\n    }\n    .product-weight{\n      display:block;\n      margin-top: 2px;\n      font-weight: 700;\n      font-size: clamp(14px, 2vw, 16px);\n      color: var(--brand-blue);\n    }\n\n    \/* Image *\/\n    .product-media{\n      display:grid; place-items:center;\n      padding: 6px 0 10px;\n      background: transparent; \/* ensure no fill behind image *\/\n    }\n    .product-media img{\n      width: min(80%, 280px);\n      height: auto;\n      object-fit: contain;\n      filter: drop-shadow(0 8px 18px rgba(0,0,0,.15));\n      display:block;\n      background: transparent;\n    }\n\n    \/* Button *\/\n    .product-actions{ display:grid; place-items:center; }\n    .btn-white{\n      background: #fff;\n      color: var(--brand-blue);\n      text-decoration: none;\n      font-weight: 800;\n      font-size: clamp(14px, 2.2vw, 18px);\n      padding: 10px 18px;\n      border-radius: 8px;\n      border: 0;\n      box-shadow: 0 8px 14px rgba(0,0,0,.18);\n      transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;\n      display: inline-block;\n    }\n    .btn-white:hover{\n      transform: translateY(-1px);\n      filter: brightness(.98);\n      box-shadow: 0 10px 18px rgba(0,0,0,.22);\n    }\n\n    \/* Mobile: one column *\/\n    @media (max-width: 768px){\n      .products-grid{ grid-template-columns: 1fr; }\n    }\n  <\/style>\n<\/head>\n\n<body>\n\n  <section class=\"products-section\" lang=\"fr\" dir=\"ltr\">\n    <div class=\"container\">\n      <h2 class=\"section-title\">\u0627\u0644\u0645\u0646\u062a\u062c\u0627\u062a<\/h2>\n\n      <div class=\"products-grid\">\n        <!-- Card 1 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633<\/h3>\n            <span class=\"product-weight\">80 g<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-48.png\" alt=\"Thon \u00e0 l\u2019huile 80 g\">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"\/ar\/a-lhuile\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n\n        <!-- Card 2 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0627\u0644\u0637\u0645\u0627\u0637\u0645<\/h3>\n            <span class=\"product-weight\">80 g<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-47.png\" alt=\"Thon \u00e0 la tomate 80 g\">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"https:\/\/pescamar.ma\/ar\/a-la-tomate\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n\n        <!-- Card 3 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0627\u0644\u0637\u0645\u0627\u0637\u0645<\/h3>\n            <span class=\"product-weight\">80 g<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-49.png\" alt=\"Thon \u00e0 la tomate 80 g\">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"\/ar\/a-la-tomate-x3\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-20f0aca e-flex e-con-boxed e-con e-parent\" data-id=\"20f0aca\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ffcd7c9 elementor-widget elementor-widget-html\" data-id=\"ffcd7c9\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!doctype html>\n<html lang=\"fr\" dir=\"ltr\">\n<head>\n  <meta charset=\"utf-8\" \/>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/>\n  <title>Produits Pescamar \u2013 bordures gauche + bas, bouton sans ic\u00f4ne<\/title>\n\n  <!-- Fonts -->\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Merriweather:wght@700;900&display=swap\" rel=\"stylesheet\">\n\n  <style>\n    :root{\n      --brand-blue: #1ea6e1;\n      --maxw      : 1200px;\n      --title-font: 'Merriweather', Georgia, 'Times New Roman', serif;\n      --text-font : Arial, Helvetica, system-ui, sans-serif;\n      --ink       : #111;\n    }\n\n    html, body{ margin:0; }\n    body{ font-family: var(--text-font); background:#fff; color:var(--ink); }\n\n    \/* Section *\/\n    .products-section{\n      padding: clamp(28px, 5vw, 64px) 0;\n      background: #fff;\n    }\n    .products-section .container{\n      max-width: var(--maxw);\n      margin: 0 auto;\n      padding: 0 16px;\n    }\n\n    \/* Title *\/\n    .section-title{\n      margin: 0 0 22px;\n      font-family: var(--title-font);\n      font-weight: 900;\n      font-size: clamp(28px, 6vw, 48px);\n      line-height: 1.1;\n      text-align: center;\n      color: var(--brand-blue);\n      letter-spacing: .2px;\n    }\n\n    \/* Grid *\/\n    .products-grid{\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n      gap: clamp(28px, 5vw, 48px);\n    }\n\n    \/* Card: blue border left + bottom only *\/\n    .product-card{\n      display: grid;\n      grid-template-rows: auto 1fr auto;\n      gap: 12px;\n      background: #fff;\n      border-radius: 14px 12px 24px 12px;    \/* bottom-left more rounded *\/\n      border-top: 0;\n      border-right: 0;\n      border-left: 4px solid var(--brand-blue);\n      border-bottom: 4px solid var(--brand-blue);\n      padding: 14px 16px 18px;\n      transition: transform .12s ease, box-shadow .12s ease;\n    }\n    .product-card:hover{ transform: translateY(-2px); }\n\n    \/* Head *\/\n    .product-head{ text-align:center; margin-bottom: 2px; }\n    .product-title{\n      margin: 0;\n      font-family: var(--title-font);\n      font-weight: 900;\n      font-size: clamp(18px, 2.6vw, 22px);\n      color: var(--brand-blue);\n      letter-spacing: .2px;\n    }\n    .product-weight{\n      display:block;\n      margin-top: 2px;\n      font-weight: 700;\n      font-size: clamp(14px, 2vw, 16px);\n      color: var(--brand-blue);\n    }\n\n    \/* Image *\/\n    .product-media{\n      display:grid; place-items:center;\n      padding: 6px 0 10px;\n    }\n    .product-media img{\n      width: min(80%, 280px);\n      height: auto;\n      object-fit: contain;\n      filter: drop-shadow(0 8px 18px rgba(0,0,0,.15));\n      display:block;\n    }\n\n    \/* Button (text only) *\/\n    .product-actions{ display:grid; place-items:center; }\n    .btn-white{\n      background: #fff;\n      color: var(--brand-blue);\n      text-decoration: none;\n      font-weight: 800;\n      font-size: clamp(14px, 2.2vw, 18px);\n      padding: 10px 18px;\n      border-radius: 8px;\n      border: 0;\n      box-shadow: 0 8px 14px rgba(0,0,0,.18);\n      transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;\n      display: inline-block;\n    }\n    .btn-white:hover{\n      transform: translateY(-1px);\n      filter: brightness(.98);\n      box-shadow: 0 10px 18px rgba(0,0,0,.22);\n    }\n\n    \/* Mobile: one column *\/\n    @media (max-width: 768px){\n      .products-grid{ grid-template-columns: 1fr; }\n    }\n  <\/style>\n<\/head>\n<body>\n\n  <!-- SECTION PRODUITS -->\n  <section class=\"products-section\" lang=\"fr\" dir=\"ltr\">\n    <div class=\"container\">\n      <div class=\"products-grid\">\n        <!-- Card 1 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633<\/h3>\n            <span class=\"product-weight\">80 g X 3<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-50.png\" alt=\"Thon \u00e0 l\u2019huile 80 g\">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"https:\/\/pescamar.ma\/ar\/a-lhuile-de-tournesol\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n\n        <!-- Card 2 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633<\/h3>\n            <span class=\"product-weight\">522 g<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-53.png\" alt=\"\u00e0 l\u2019huile de tournesol\">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"https:\/\/pescamar.ma\/ar\/thon-a-lhuile-de-tournesol-522\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n\n        <!-- Card 3 -->\n        <article class=\"product-card\">\n          <header class=\"product-head\">\n            <h3 class=\"product-title\">\u062a\u0648\u0646\u0629 \u0628\u0632\u064a\u062a \u062f\u0648\u0651\u0627\u0631 \u0627\u0644\u0634\u0645\u0633<\/h3>\n            <span class=\"product-weight\">900 g<\/span>\n          <\/header>\n          <figure class=\"product-media\">\n            <img decoding=\"async\" src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/Untitled-design-54.png\" alt=\"\u00e0 l\u2019huile de tournesol \">\n          <\/figure>\n          <footer class=\"product-actions\">\n            <a class=\"btn-white\" href=\"\/ar\/thon-a-lhuile-de-tournesol-900\/\">\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0632\u064a\u062f<\/a>\n          <\/footer>\n        <\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-51e0e21 e-con-full e-flex e-con e-parent\" data-id=\"51e0e21\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7144226 elementor-widget elementor-widget-html\" data-id=\"7144226\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!doctype html>\n<html lang=\"fr\" dir=\"ltr\">\n<head>\n  <meta charset=\"utf-8\">\n  <meta name=\"viewport\" content=\"width=device-width,initial-scale=1\">\n\n  <!-- Fonts + Icons -->\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Merriweather:wght@700;900&display=swap\" rel=\"stylesheet\">\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.2\/css\/all.min.css\"\/>\n\n  <title>Landing IberiaTrading<\/title>\n\n  <style>\n    \/* Scoped variables *\/\n    #ib-landing{\n      --brand-red: #e60000;\n      --brand-white: #ffffff;\n      --title-font: 'Merriweather', Georgia, 'Times New Roman', serif;\n      --text-font: Arial, Helvetica, system-ui, sans-serif;\n      --maxw: 1200px;\n\n      \/* Ribbon defaults (mobile) *\/\n      --ribbon-top: 18%;\n      --ribbon-height: 54px;\n      --ribbon-angle: -16deg;\n      --ribbon-label: \"IberiaTrading\";\n\n      \/* Espace mini entre bas du logo et ruban (utilis\u00e9 par le JS) *\/\n      --ribbon-gap-from-logo: 16px;\n    }\n\n    html, body{ margin:0; }\n    body{ font-family: Arial, Helvetica, system-ui, sans-serif; background:#fff; }\n\n    \/* Section wrapper *\/\n    #ib-landing{\n      background: var(--brand-red);\n      color: var(--brand-white);\n      min-height: 100vh;\n      display: grid;\n      place-items: center;\n      overflow: hidden; \/* keep ribbon edges tidy *\/\n    }\n\n    \/* Inner container with isolated stacking context so ribbon stays behind *\/\n    #ib-landing .ib-wrap{\n      position: relative;\n      isolation: isolate;\n      min-height: 100vh;\n      max-width: var(--maxw);\n      width: 100%;\n      margin: 0 auto;\n      padding: clamp(20px, 5vw, 40px) 16px;\n      display: grid;\n      align-content: center;\n      justify-items: center;\n      gap: clamp(16px, 3vw, 28px);\n      text-align: center;\n      font-family: var(--text-font);\n    }\n\n    \/* Ribbon BEHIND everything inside .ib-wrap *\/\n    #ib-landing .ib-wrap::before{\n      content: \"\";\n      position: absolute;\n      left: -12vw; right: -12vw;\n      \/* utilise la valeur calcul\u00e9e en px si dispo, sinon la valeur % par d\u00e9faut *\/\n      top: var(--ribbon-top-px, var(--ribbon-top));\n      height: var(--ribbon-height);\n      background: var(--brand-white);\n      transform: rotate(var(--ribbon-angle));\n      box-shadow: 0 10px 24px -14px rgba(0,0,0,.35);\n      z-index: 0;\n      pointer-events: none;\n    }\n    #ib-landing .ib-wrap::after{\n      content: var(--ribbon-label);\n      position: absolute;\n      left: 50%;\n      \/* idem: fallback sur la valeur % *\/\n      top: calc(var(--ribbon-top-px, var(--ribbon-top)) + var(--ribbon-height)\/2);\n      transform: translate(-50%, -50%) rotate(var(--ribbon-angle));\n      font-family: var(--title-font);\n      font-weight: 900;\n      font-size: clamp(18px, 5vw, 40px);\n      color: var(--brand-red);\n      letter-spacing: .4px;\n      z-index: 0;\n      pointer-events: none;\n      user-select: none;\n      white-space: nowrap;\n    }\n\n    \/* Foreground (ABOVE ribbon) *\/\n    #ib-landing .ib-logo,\n    #ib-landing .ib-menu,\n    #ib-landing .ib-socials,\n    #ib-landing .ib-copy{\n      position: relative;\n      z-index: 10; \/* above the ribbon *\/\n    }\n\n    \/* Mobile\/tablet: raised logo as base *\/\n    #ib-landing .ib-logo{\n      width: clamp(160px, 32vw, 320px);\n      height: auto;\n      transform: translateY(-60px);\n    }\n\n    #ib-landing .ib-menu{\n      display: flex;\n      flex-direction: column;\n      gap: clamp(12px, 2.6vw, 18px);\n    }\n    #ib-landing .ib-link{\n      color: var(--brand-white);\n      text-decoration: none;\n      font-weight: 800;\n      font-size: clamp(18px, 3.2vw, 22px);\n      letter-spacing: .2px;\n      position: relative;\n      padding: 4px 6px;\n    }\n    #ib-landing .ib-link::after{\n      content:\"\"; position:absolute; left:0; right:0; bottom:-6px; margin: 0 auto;\n      height: 3px; width: 0; background: var(--brand-white);\n      transition: width .18s ease;\n    }\n    #ib-landing .ib-link:hover::after{ width: 100%; }\n\n    #ib-landing .ib-socials{ margin-top: clamp(10px, 4vw, 24px); }\n    #ib-landing .ib-socials .title{ font-weight: 800; margin-bottom: 8px; opacity: .95; }\n    #ib-landing .icons{\n      display: flex; gap: clamp(14px, 3vw, 24px); justify-content: center; align-items: center;\n    }\n    #ib-landing .icons a{\n      color: var(--brand-white);\n      background: rgba(255,255,255,.12);\n      width: clamp(40px, 6.5vw, 54px);\n      height: clamp(40px, 6.5vw, 54px);\n      display: grid; place-items: center;\n      border-radius: 12px;\n      box-shadow: 0 10px 24px -14px rgba(0,0,0,.35);\n      transition: transform .15s ease, filter .15s ease, background .15s ease;\n      text-decoration: none;\n    }\n    #ib-landing .icons a:hover{ transform: translateY(-2px); background: rgba(255,255,255,.2); }\n    #ib-landing .icons i{ font-size: clamp(18px, 3.2vw, 22px); }\n\n    #ib-landing .ib-copy{\n      margin-top: clamp(10px, 5vh, 28px);\n      color: #f7f7f7;\n      font-size: clamp(12px, 2.5vw, 14px);\n      opacity: .95;\n    }\n\n    \/* Tablet *\/\n    @media (min-width: 600px) and (max-width: 1023px){\n      #ib-landing{\n        --ribbon-top: 16%;\n        --ribbon-height: 68px;\n      }\n      #ib-landing .ib-logo{ transform: translateY(-80px); }\n    }\n\n    \/* Desktop: raise logo a lot (like mobile) + add top padding so it\u2019s not hidden by your site header *\/\n    @media (min-width: 1024px){\n      \/* Move ribbon a bit lower so it never crosses the logo zone (fallback) *\/\n      #ib-landing{ --ribbon-top: 36%; --ribbon-height: 78px; }\n\n      \/* Give space above (compensates for translateY) *\/\n      #ib-landing .ib-wrap{ padding-top: 260px; } \/* adjust to your header height if needed *\/\n\n      \/* Strong raise and stacking *\/\n      #ib-landing .ib-logo{\n        transform: translateY(-220px) !important; \/* -200..-260 according to taste *\/\n        z-index: 999 !important;\n      }\n\n      \/* Horizontal menu on desktop *\/\n      #ib-landing .ib-menu{ flex-direction: row; gap: clamp(28px, 6vw, 64px); }\n    }\n\n    \/* Extra large (optional) *\/\n    @media (min-width: 1440px){\n      #ib-landing .ib-logo{ transform: translateY(-240px) !important; }\n    }\n\n    @media (prefers-reduced-motion: reduce){\n      #ib-landing .ib-link::after, #ib-landing .icons a, #ib-landing .ib-logo{ transition: none; }\n    }\n  <\/style>\n<\/head>\n<body>\n\n  <!-- Brand Landing -->\n  <section id=\"ib-landing\">\n    <div class=\"ib-wrap\" style=\"--ribbon-label:'IberiaTrading'\">\n      <!-- Logo (must stay above the white diagonal ribbon) -->\n      <img decoding=\"async\" class=\"ib-logo\"\n           src=\"https:\/\/pescamar.ma\/wp-content\/uploads\/2025\/10\/logo-2.png\"\n           alt=\"Pescamar\">\n\n      <!-- Menu -->\n      <nav class=\"ib-menu\" aria-label=\"Menu principal\">\n        <a class=\"ib-link\" href=\"\/ar\/#produits\">\u0627\u0644\u0645\u0646\u062a\u062c\u0627\u062a<\/a>\n        <a class=\"ib-link\" href=\"\/ar\/apropos\/\">\u0639\u0646 Pescamar<\/a>\n        <a class=\"ib-link\" href=\"\/ar\/#recettes\">\u0648\u0635\u0641\u0627\u062a \u0628\u0627\u0644\u062a\u0648\u0646\u0629<\/a>\n        <a class=\"ib-link\" href=\"\/ar\/#contact\">\u0627\u062a\u0635\u0644 \u0628\u0646\u0627<\/a>\n      <\/nav>\n\n      <!-- Socials -->\n      <div class=\"ib-socials\">\n        <div class=\"title\">Suivez\u2011nous<\/div>\n        <div class=\"icons\">\n          <a href=\"https:\/\/www.instagram.com\/thon.pescamar\/\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"Instagram\">\n            <i class=\"fa-brands fa-instagram\"><\/i>\n          <\/a>\n          <a href=\"https:\/\/www.tiktok.com\/@thon.pescamar\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"TikTok\">\n            <i class=\"fa-brands fa-tiktok\"><\/i>\n          <\/a>\n          <a href=\"#\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"Facebook\">\n            <i class=\"fa-brands fa-facebook-f\"><\/i>\n          <\/a>\n          <a href=\"#\" target=\"_blank\" rel=\"noopener noreferrer\" aria-label=\"YouTube\">\n            <i class=\"fa-brands fa-youtube\"><\/i>\n          <\/a>\n        <\/div>\n      <\/div>\n\n      <!-- Copyright -->\n      <p class=\"ib-copy\">Droits d\u2019auteur \u00a9 IberiaTrading 2025. Tous droits r\u00e9serv\u00e9s.<\/p>\n    <\/div>\n  <\/section>\n\n  <!-- Positionne le ruban juste sous le logo -->\n  <script>\n    (function(){\n      const wrap = document.querySelector('#ib-landing .ib-wrap');\n      const logo = document.querySelector('#ib-landing .ib-logo');\n\n      function updateRibbonTop(){\n        if(!wrap || !logo) return;\n        const wrapRect = wrap.getBoundingClientRect();\n        const logoRect = logo.getBoundingClientRect();\n        const styles = getComputedStyle(wrap);\n        const gap = parseFloat(styles.getPropertyValue('--ribbon-gap-from-logo')) || 16;\n\n        \/\/ bas du logo par rapport au haut du conteneur + marge\n        const topPx = (logoRect.bottom - wrapRect.top) + gap;\n        wrap.style.setProperty('--ribbon-top-px', topPx + 'px');\n      }\n\n      \/\/ Mettre \u00e0 jour \u00e0 diff\u00e9rents moments pour \u00e9viter le flash de chevauchement\n      window.addEventListener('load', updateRibbonTop);\n      window.addEventListener('resize', updateRibbonTop);\n      document.addEventListener('DOMContentLoaded', updateRibbonTop);\n\n      if (logo) {\n        if (logo.complete) updateRibbonTop();\n        else logo.addEventListener('load', updateRibbonTop);\n      }\n\n      \/\/ Recalcule apr\u00e8s un petit d\u00e9lai (polices\/ICONS)\n      setTimeout(updateRibbonTop, 200);\n    })();\n  <\/script>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Accueil \u00c0 propos de Pescamar Produits Contact Menu Accueil \u00c0 propos de Pescamar Produits Contact Thon \u00e0 l\u2019huile de tournesol [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-912","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/pages\/912","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/comments?post=912"}],"version-history":[{"count":31,"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/pages\/912\/revisions"}],"predecessor-version":[{"id":1197,"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/pages\/912\/revisions\/1197"}],"wp:attachment":[{"href":"https:\/\/pescamar.ma\/ar\/wp-json\/wp\/v2\/media?parent=912"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}