{"id":328010,"date":"2026-01-29T14:18:09","date_gmt":"2026-01-29T13:18:09","guid":{"rendered":"https:\/\/mondial.tv\/?page_id=328010"},"modified":"2026-02-13T11:47:04","modified_gmt":"2026-02-13T10:47:04","slug":"notre-application-mondial-tv","status":"publish","type":"page","link":"https:\/\/mondial.tv\/en\/notre-application-mondial-tv\/","title":{"rendered":"Mondial TV 2.0 App"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"328010\" class=\"elementor elementor-328010\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-50c443a e-con-full e-flex e-con e-parent\" data-id=\"50c443a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a40a7d6 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"a40a7d6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- \u2705 Mondial TV Landing \u2014 Elementor-safe (FIX superpositions + d\u00e9grad\u00e9s menu + section abonnement)\r\n     - CSS 100% scop\u00e9 dans .mtv-landing\r\n     - Anti-overflow \/ anti-overlap (min-width:0, overflow contr\u00f4l\u00e9, chips responsive)\r\n     - D\u00e9grad\u00e9s corr\u00e9l\u00e9s au menu (bleu -> cyan)\r\n     - Ajout section \"S'abonner\" + lien nos-offres\r\n-->\r\n<div class=\"mtv-landing\" id=\"mtv-landing\">\r\n  <style>\r\n    \/* =========================\r\n      SCOPE ANTI-ELEMENTOR\r\n    ========================= *\/\r\n    .mtv-landing{\r\n      \/* \ud83c\udfa8 D\u00e9grad\u00e9 proche du menu (bleu -> cyan) *\/\r\n      --menu-left:#5D84FF;\r\n      --menu-right:#8FE9FF;\r\n\r\n      --primary: var(--menu-left);\r\n      --primary-light:#7EA3FF;\r\n      --accent:#00D4AA;\r\n\r\n      --bgTop:#F3F9FF;\r\n      --bg:#F7FAFF;\r\n      --surface:#FFFFFF;\r\n\r\n      --text:#0F1733;\r\n      --text2:#0B1434;\r\n      --text-light:#4A5568;\r\n      --text-muted:#718096;\r\n\r\n      --border:#E2E8F0;\r\n      --border-light:#EEF3FA;\r\n\r\n      --grad-primary:linear-gradient(135deg,var(--menu-left) 0%, var(--menu-right) 100%);\r\n      --grad-hero:linear-gradient(135deg, rgba(93,132,255,.12) 0%, rgba(143,233,255,.10) 55%, rgba(0,212,170,.05) 100%);\r\n      --grad-page:linear-gradient(180deg, var(--bgTop) 0%, #FFFFFF 55%, var(--bg) 100%);\r\n\r\n      --shadow-sm:0 1px 3px rgba(93,132,255,.08);\r\n      --shadow-md:0 10px 30px rgba(15,23,51,.10);\r\n      --shadow-lg:0 22px 55px rgba(15,23,51,.14);\r\n\r\n      --r-sm:12px;\r\n      --r-md:16px;\r\n      --r-lg:20px;\r\n      --r-xl:28px;\r\n      --max:1200px;\r\n\r\n      font-family:'Outfit',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;\r\n      color:var(--text);\r\n      background:var(--grad-page);\r\n\r\n      position:relative;\r\n      isolation:isolate; \/* emp\u00eache les z-index externes *\/\r\n      overflow:hidden;\r\n      width:100%;\r\n      max-width:100%;\r\n    }\r\n\r\n    \/* reset minimal (scop\u00e9) *\/\r\n    .mtv-landing *{ box-sizing:border-box; }\r\n    .mtv-landing img{ max-width:100%; height:auto; display:block; }\r\n    .mtv-landing a{ color:inherit; text-decoration:none; }\r\n    .mtv-landing p{ margin:0; }\r\n    .mtv-landing h1,.mtv-landing h2,.mtv-landing h3{\r\n      margin:0; line-height:1.08; letter-spacing:-.03em;\r\n      word-break:normal; overflow-wrap:anywhere; hyphens:auto;\r\n    }\r\n    .mtv-landing h1{ font-weight:900; }\r\n    .mtv-landing h2{ font-weight:900; }\r\n    .mtv-landing h3{ font-weight:800; }\r\n\r\n    .mtv-landing .container{\r\n      width:min(var(--max), calc(100% - 48px));\r\n      margin:0 auto;\r\n      position:relative;\r\n      z-index:1;\r\n    }\r\n    @media (max-width:640px){\r\n      .mtv-landing .container{ width:calc(100% - 32px); }\r\n    }\r\n\r\n    \/* background d\u00e9cor *\/\r\n    .mtv-landing::before{\r\n      content:\"\";\r\n      position:absolute; inset:-220px -240px auto auto;\r\n      width:780px; height:780px;\r\n      background:radial-gradient(circle, rgba(93,132,255,.14) 0%, transparent 68%);\r\n      pointer-events:none; z-index:0;\r\n    }\r\n    .mtv-landing::after{\r\n      content:\"\";\r\n      position:absolute; inset:auto auto -260px -280px;\r\n      width:740px; height:740px;\r\n      background:radial-gradient(circle, rgba(143,233,255,.12) 0%, transparent 70%);\r\n      pointer-events:none; z-index:0;\r\n    }\r\n\r\n    \/* =========================\r\n      SECTIONS\r\n    ========================= *\/\r\n    .mtv-landing .mtv-sec{\r\n      display:block;\r\n      position:relative;\r\n      z-index:1;\r\n      padding:78px 0;\r\n      overflow:visible;\r\n      clear:both;\r\n      width:100%;\r\n    }\r\n    @media (max-width:768px){\r\n      .mtv-landing .mtv-sec{ padding:56px 0; }\r\n    }\r\n\r\n    \/* =========================\r\n      HERO\r\n    ========================= *\/\r\n    .mtv-landing .hero{\r\n      padding:72px 0 52px;\r\n      background:var(--grad-hero);\r\n      position:relative;\r\n      overflow:visible;\r\n    }\r\n\r\n    .mtv-landing .heroGrid{\r\n      display:grid;\r\n      grid-template-columns: 1.12fr .88fr;\r\n      gap:54px;\r\n      align-items:center;\r\n    }\r\n    .mtv-landing .heroGrid > *{ min-width:0; } \/* \u2705 anti overflow qui casse la grille *\/\r\n    @media (max-width: 980px){\r\n      .mtv-landing .heroGrid{ grid-template-columns:1fr; gap:34px; }\r\n    }\r\n\r\n    .mtv-landing .kicker{\r\n      display:inline-flex; align-items:center; gap:10px;\r\n      padding:10px 16px;\r\n      border-radius:999px;\r\n      background:rgba(255,255,255,.88);\r\n      border:1px solid var(--border-light);\r\n      box-shadow:var(--shadow-sm);\r\n      font-weight:700;\r\n      color:rgba(15,23,51,.80);\r\n      font-size:14px;\r\n      width:fit-content;\r\n      max-width:100%;\r\n    }\r\n    .mtv-landing .dot{\r\n      width:8px;height:8px;border-radius:999px;background:var(--accent);\r\n      box-shadow:0 0 0 0 rgba(0,212,170,.55);\r\n      animation: mtvPulse 2.6s ease-in-out infinite;\r\n      flex:0 0 auto;\r\n    }\r\n    @keyframes mtvPulse{\r\n      0%,100%{ transform:scale(1); box-shadow:0 0 0 0 rgba(0,212,170,.55); }\r\n      50%{ transform:scale(1.08); box-shadow:0 0 0 10px rgba(0,212,170,0); }\r\n    }\r\n\r\n    .mtv-landing .h1{\r\n      margin-top:16px;\r\n      font-size: clamp(40px, 5.6vw, 78px);\r\n      color:var(--text2);\r\n    }\r\n    .mtv-landing .h1 em{\r\n      font-style:italic;\r\n      font-weight:900;\r\n      background:var(--grad-primary);\r\n      -webkit-background-clip:text;\r\n      background-clip:text;\r\n      -webkit-text-fill-color:transparent;\r\n      display:inline-block;\r\n    }\r\n\r\n    .mtv-landing .lead{\r\n      margin-top:16px;\r\n      font-size:18px;\r\n      line-height:1.75;\r\n      color:var(--text-light);\r\n      max-width:62ch;\r\n    }\r\n\r\n    .mtv-landing .heroCtas{\r\n      display:flex; gap:12px; flex-wrap:wrap;\r\n      margin-top:22px;\r\n    }\r\n\r\n    .mtv-landing .btn{\r\n      display:inline-flex; align-items:center; justify-content:center; gap:10px;\r\n      padding:14px 22px;\r\n      border-radius:14px;\r\n      font-weight:800;\r\n      font-size:15px;\r\n      border:1px solid var(--border);\r\n      background:#fff;\r\n      cursor:pointer;\r\n      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;\r\n      box-shadow: var(--shadow-sm);\r\n      white-space:nowrap;\r\n      max-width:100%;\r\n    }\r\n    .mtv-landing .btn:hover{\r\n      transform: translateY(-2px);\r\n      box-shadow: var(--shadow-md);\r\n      border-color: rgba(93,132,255,.35);\r\n    }\r\n    .mtv-landing .btnPrimary{\r\n      border:none;\r\n      background:var(--grad-primary);\r\n      color:#0A1030;\r\n      box-shadow: 0 16px 34px rgba(93,132,255,.26);\r\n    }\r\n    .mtv-landing .btnPrimary:hover{ box-shadow: 0 22px 44px rgba(93,132,255,.34); }\r\n    .mtv-landing .btnGhost{\r\n      background:rgba(93,132,255,.07);\r\n      border:1px solid rgba(93,132,255,.20);\r\n      color:var(--text2);\r\n      box-shadow:none;\r\n    }\r\n\r\n    .mtv-landing .deviceRow{\r\n      display:flex; gap:18px; flex-wrap:wrap;\r\n      margin-top:16px;\r\n      color:rgba(15,23,51,.70);\r\n      font-weight:700;\r\n      align-items:center;\r\n      font-size:14px;\r\n    }\r\n    .mtv-landing .devicePill{\r\n      display:inline-flex; align-items:center; gap:10px;\r\n      padding:8px 0;\r\n    }\r\n    .mtv-landing .devicePill svg{ width:16px;height:16px; opacity:.85; flex:0 0 auto; }\r\n\r\n    \/* HERO media card *\/\r\n    .mtv-landing .heroMedia{\r\n      background: linear-gradient(135deg, rgba(143,233,255,.18), rgba(93,132,255,.16));\r\n      border:1px solid rgba(226,232,240,.95);\r\n      border-radius: var(--r-xl);\r\n      padding:18px;\r\n      box-shadow: var(--shadow-lg);\r\n      position:relative;\r\n      overflow:hidden;\r\n    }\r\n    .mtv-landing .heroMedia::before{\r\n      content:\"\";\r\n      position:absolute; inset:0;\r\n      background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.62), transparent 55%);\r\n      pointer-events:none;\r\n    }\r\n    .mtv-landing .heroShot{\r\n      border-radius: calc(var(--r-xl) - 6px);\r\n      background:#0B1434;\r\n      border:1px solid rgba(255,255,255,.22);\r\n      overflow:hidden;\r\n      position:relative;\r\n      \/* \u2705 ratio stable => \u00e9vite les sauts\/chevauchements *\/\r\n      aspect-ratio: 16\/9;\r\n      display:grid;\r\n      place-items:center;\r\n      width:100%;\r\n    }\r\n    .mtv-landing .heroShot img{\r\n      width:100%; height:100%; object-fit:cover;\r\n      display:block;\r\n    }\r\n    .mtv-landing .fallback{\r\n      padding:20px;\r\n      text-align:center;\r\n      color:rgba(255,255,255,.85);\r\n      font-weight:700;\r\n    }\r\n\r\n    \/* Floating feature chips (desktop only => anti-overlap Elementor responsive) *\/\r\n    .mtv-landing .chip{\r\n      position:absolute;\r\n      display:flex; align-items:center; gap:10px;\r\n      padding:12px 14px;\r\n      border-radius: 16px;\r\n      background: rgba(255,255,255,.92);\r\n      border:1px solid rgba(226,232,240,.9);\r\n      box-shadow: 0 16px 34px rgba(15,23,51,.14);\r\n      z-index:2;\r\n      transform: translateZ(0);\r\n      animation: mtvFloat 5.5s ease-in-out infinite;\r\n      max-width: 220px;\r\n    }\r\n    .mtv-landing .chip .ic{\r\n      width:42px; height:42px; border-radius: 14px;\r\n      display:grid; place-items:center;\r\n      background: rgba(0,212,170,.14);\r\n      border:1px solid rgba(0,212,170,.22);\r\n      flex:0 0 auto;\r\n    }\r\n    .mtv-landing .chip b{ display:block; font-size:14px; line-height:1.1; }\r\n    .mtv-landing .chip span{ display:block; font-size:13px; color:rgba(15,23,51,.64); margin-top:3px; font-weight:700; }\r\n    .mtv-landing .chip1{ top:26px; right:26px; animation-delay:.2s; }\r\n    .mtv-landing .chip2{ left:22px; bottom:26px; animation-delay: .9s; }\r\n\r\n    @keyframes mtvFloat{\r\n      0%,100%{ transform: translateY(0); }\r\n      50%{ transform: translateY(-10px); }\r\n    }\r\n\r\n    \/* \u2705 IMPORTANT: sur tablette\/mobile, les chips cr\u00e9ent souvent des superpositions => on les coupe *\/\r\n    @media (max-width: 980px){\r\n      .mtv-landing .chip{ display:none !important; }\r\n    }\r\n\r\n    \/* =========================\r\n      TITRES \/ SECTIONS\r\n    ========================= *\/\r\n    .mtv-landing .sectionTitle{\r\n      text-align:center;\r\n      max-width: 860px;\r\n      margin: 0 auto 44px;\r\n      position:relative;\r\n      z-index:2;\r\n      overflow:visible;\r\n    }\r\n    .mtv-landing .sectionTitle h2{\r\n      font-size: clamp(28px, 4.2vw, 54px);\r\n      color:var(--text2);\r\n    }\r\n    .mtv-landing .sectionTitle p{\r\n      margin-top:14px;\r\n      font-size:18px;\r\n      color:var(--text-light);\r\n      line-height:1.7;\r\n    }\r\n\r\n    \/* Grid cards *\/\r\n    .mtv-landing .grid{\r\n      display:grid;\r\n      grid-template-columns: repeat(12, 1fr);\r\n      gap:22px;\r\n      align-items:stretch;\r\n      width:100%;\r\n      overflow:visible;\r\n      height: auto !important;\r\n    }\r\n    .mtv-landing .card{\r\n      grid-column: span 4;\r\n      background:#fff;\r\n      border:1px solid var(--border);\r\n      border-radius: var(--r-xl);\r\n      padding:30px;\r\n      box-shadow: var(--shadow-sm);\r\n      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;\r\n      position:relative;\r\n      overflow:hidden;\r\n      min-height: 190px;\r\n      z-index:1;\r\n    }\r\n    .mtv-landing .card:hover{\r\n      transform: translateY(-6px);\r\n      box-shadow: var(--shadow-lg);\r\n      border-color: rgba(93,132,255,.28);\r\n    }\r\n    .mtv-landing .card .topbar{\r\n      height:4px; width:100%;\r\n      background: var(--grad-primary);\r\n      position:absolute; left:0; top:0;\r\n      transform: scaleX(0);\r\n      transform-origin:left;\r\n      transition: transform .25s ease;\r\n    }\r\n    .mtv-landing .card:hover .topbar{ transform: scaleX(1); }\r\n\r\n    .mtv-landing .icon{\r\n      width:58px;height:58px;border-radius:16px;\r\n      display:grid; place-items:center;\r\n      background: linear-gradient(135deg, rgba(93,132,255,.12), rgba(143,233,255,.10));\r\n      border:1px solid rgba(93,132,255,.20);\r\n      margin-bottom:18px;\r\n    }\r\n    .mtv-landing .icon svg{\r\n      width:26px;height:26px; fill:none;\r\n      stroke: var(--primary); stroke-width:2.5;\r\n      stroke-linecap:round; stroke-linejoin:round;\r\n    }\r\n    .mtv-landing .card h3{ font-size:20px; margin-bottom:10px; }\r\n    .mtv-landing .card p{ font-size:15.5px; color:var(--text-light); line-height:1.7; }\r\n\r\n    @media (max-width: 1024px){\r\n      .mtv-landing .card{ grid-column: span 6; }\r\n    }\r\n    @media (max-width: 768px){\r\n      .mtv-landing .card{ grid-column: span 12; }\r\n    }\r\n\r\n    \/* Highlight row *\/\r\n    .mtv-landing .highRow{\r\n      display:grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap:18px;\r\n      margin-top:28px;\r\n      width:100%;\r\n      position:relative;\r\n      z-index:1;\r\n      overflow:visible;\r\n    }\r\n    @media (max-width: 980px){\r\n      .mtv-landing .highRow{ grid-template-columns: 1fr; }\r\n    }\r\n    .mtv-landing .high{\r\n      background: rgba(255,255,255,.92);\r\n      border:1px solid var(--border);\r\n      border-radius: var(--r-lg);\r\n      padding:18px;\r\n      box-shadow: var(--shadow-sm);\r\n      display:flex;\r\n      gap:14px;\r\n      align-items:flex-start;\r\n      overflow:hidden;\r\n      position:relative;\r\n      z-index:1;\r\n    }\r\n    .mtv-landing .high .badge{\r\n      width:46px;height:46px;border-radius:14px;\r\n      display:grid;place-items:center;\r\n      background: rgba(0,212,170,.12);\r\n      border:1px solid rgba(0,212,170,.22);\r\n      flex:0 0 auto;\r\n    }\r\n    .mtv-landing .high b{ display:block; font-size:16px; margin-top:2px; }\r\n    .mtv-landing .high span{ display:block; margin-top:6px; color:var(--text-light); font-size:14.5px; line-height:1.65; }\r\n\r\n    \/* =========================\r\n      APER\u00c7US (tabs + gallery)\r\n    ========================= *\/\r\n    .mtv-landing .tabs{\r\n      display:flex;\r\n      justify-content:center;\r\n      margin-bottom:26px;\r\n      position:relative;\r\n      z-index:2;\r\n      overflow:visible;\r\n    }\r\n    .mtv-landing .seg{\r\n      display:inline-flex;\r\n      background:#fff;\r\n      border:1px solid var(--border);\r\n      border-radius: 999px;\r\n      padding:6px;\r\n      box-shadow: var(--shadow-md);\r\n      gap:6px;\r\n      max-width:100%;\r\n    }\r\n    .mtv-landing .seg button{\r\n      border:0;\r\n      background:transparent;\r\n      padding:12px 22px;\r\n      border-radius:999px;\r\n      font-weight:900;\r\n      font-size:14px;\r\n      color:rgba(15,23,51,.68);\r\n      cursor:pointer;\r\n      transition: background .2s ease, color .2s ease, transform .2s ease;\r\n    }\r\n    .mtv-landing .seg button.active{\r\n      background: var(--grad-primary);\r\n      color:#fff;\r\n      box-shadow: 0 10px 22px rgba(93,132,255,.28);\r\n    }\r\n\r\n    .mtv-landing .gallery{\r\n      display:grid;\r\n      grid-template-columns: repeat(12, 1fr);\r\n      gap:18px;\r\n      align-items:start;\r\n      position:relative;\r\n      z-index:1;\r\n      width:100%;\r\n      overflow:visible;\r\n    }\r\n\r\n    .mtv-landing .shot{\r\n      grid-column: span 3;\r\n      background:#fff;\r\n      border:1px solid var(--border);\r\n      border-radius: var(--r-xl);\r\n      box-shadow: var(--shadow-md);\r\n      overflow:hidden;\r\n      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;\r\n      cursor:pointer;\r\n      position:relative;\r\n      z-index:1;\r\n    }\r\n    .mtv-landing .shot:hover{\r\n      transform: translateY(-6px);\r\n      box-shadow: var(--shadow-lg);\r\n      border-color: rgba(93,132,255,.28);\r\n    }\r\n\r\n    .mtv-landing .shot .media{\r\n      background: #0B1434;\r\n      position:relative;\r\n      overflow:hidden;\r\n    }\r\n    .mtv-landing .shot.mobile .media{ aspect-ratio: 9\/16; }\r\n    .mtv-landing .shot.web .media{ aspect-ratio: 16\/9; }\r\n\r\n    .mtv-landing .shot .media::before{\r\n      content:\"\";\r\n      position:absolute; inset:0;\r\n      background: radial-gradient(circle at 35% 25%, rgba(93,132,255,.18), transparent 65%);\r\n      pointer-events:none;\r\n      z-index:1;\r\n    }\r\n    .mtv-landing .shot img{\r\n      width:100%; height:100%;\r\n      object-fit:cover;\r\n      transition: transform .55s ease;\r\n      will-change: transform;\r\n    }\r\n    .mtv-landing .shot:hover img{ transform: scale(1.06); }\r\n\r\n    .mtv-landing .shot .cap{\r\n      padding:16px 16px 18px;\r\n      background:#fff;\r\n    }\r\n    .mtv-landing .shot .cap b{\r\n      display:block;\r\n      font-size:16px;\r\n      margin-bottom:4px;\r\n    }\r\n    .mtv-landing .shot .cap span{\r\n      display:block;\r\n      font-size:14px;\r\n      color:var(--text-light);\r\n      line-height:1.55;\r\n    }\r\n\r\n    @media (max-width: 1200px){\r\n      .mtv-landing .shot{ grid-column: span 4; }\r\n    }\r\n    @media (max-width: 900px){\r\n      .mtv-landing .shot{ grid-column: span 6; }\r\n    }\r\n    @media (max-width: 640px){\r\n      .mtv-landing .shot{ grid-column: span 12; }\r\n    }\r\n\r\n    .mtv-landing .imgFallback{\r\n      color: rgba(255,255,255,.86);\r\n      font-weight:800;\r\n      font-size:14px;\r\n      padding:22px;\r\n      text-align:center;\r\n      position:relative;\r\n      z-index:2;\r\n    }\r\n\r\n    \/* =========================\r\n      WEBTV BLOC DARK\r\n    ========================= *\/\r\n    .mtv-landing .webtvBlock{\r\n      background: linear-gradient(135deg, #0B2E3B 0%, #1A2155 45%, #2A2F6D 100%);\r\n      border-radius: 34px;\r\n      box-shadow: 0 30px 70px rgba(15,23,51,.20);\r\n      overflow:hidden;\r\n      position:relative;\r\n      border:1px solid rgba(255,255,255,.10);\r\n      width:100%;\r\n    }\r\n    .mtv-landing .webtvInner{\r\n      display:grid;\r\n      grid-template-columns: 1fr 1.1fr;\r\n      gap:22px;\r\n      padding:42px;\r\n      align-items:center;\r\n      position:relative;\r\n      z-index:1;\r\n      overflow:visible;\r\n    }\r\n    .mtv-landing .webtvBlock::before{\r\n      content:\"\";\r\n      position:absolute; inset:0;\r\n      background:\r\n        radial-gradient(circle at 18% 30%, rgba(0,212,170,.20), transparent 55%),\r\n        radial-gradient(circle at 70% 25%, rgba(93,132,255,.28), transparent 55%);\r\n      pointer-events:none;\r\n      opacity:.9;\r\n    }\r\n    .mtv-landing .webtvBadge{\r\n      display:inline-flex;\r\n      padding:10px 14px;\r\n      border-radius:999px;\r\n      background: rgba(255,255,255,.12);\r\n      border:1px solid rgba(255,255,255,.18);\r\n      color: rgba(255,255,255,.92);\r\n      font-weight:900;\r\n      font-size:12px;\r\n      letter-spacing:.08em;\r\n      text-transform:uppercase;\r\n      width:fit-content;\r\n      max-width:100%;\r\n    }\r\n    .mtv-landing .webtvTitle{\r\n      margin-top:14px;\r\n      font-size: clamp(30px, 4vw, 56px);\r\n      color:#fff;\r\n      line-height:1.02;\r\n    }\r\n    .mtv-landing .webtvTitle em{\r\n      font-style:italic;\r\n      color: var(--menu-right);\r\n    }\r\n    .mtv-landing .webtvText{\r\n      margin-top:14px;\r\n      color: rgba(255,255,255,.82);\r\n      font-size:16.5px;\r\n      line-height:1.7;\r\n      max-width: 58ch;\r\n    }\r\n    .mtv-landing .urlCard{\r\n      margin-top:18px;\r\n      padding:16px 18px;\r\n      border-radius: 18px;\r\n      background: rgba(255,255,255,.08);\r\n      border: 1px solid rgba(255,255,255,.14);\r\n      display:flex;\r\n      gap:12px;\r\n      align-items:center;\r\n      max-width: 520px;\r\n    }\r\n    .mtv-landing .urlCard .uic{\r\n      width:42px;height:42px;border-radius:14px;\r\n      background: rgba(255,255,255,.10);\r\n      border:1px solid rgba(255,255,255,.16);\r\n      display:grid;place-items:center;\r\n      flex:0 0 auto;\r\n    }\r\n    .mtv-landing .urlCard small{\r\n      display:block;\r\n      color: rgba(255,255,255,.68);\r\n      font-weight:900;\r\n      font-size:11px;\r\n      letter-spacing:.08em;\r\n      text-transform:uppercase;\r\n      margin-bottom:4px;\r\n    }\r\n    .mtv-landing .urlCard b{\r\n      display:block;\r\n      color:#fff;\r\n      font-weight:900;\r\n      font-size:14px;\r\n      word-break: break-word;\r\n    }\r\n\r\n    .mtv-landing .webtvBtns{\r\n      margin-top:18px;\r\n      display:flex;\r\n      gap:12px;\r\n      flex-wrap:wrap;\r\n      align-items:center;\r\n    }\r\n    .mtv-landing .btnDarkPrimary{\r\n      background: var(--grad-primary);\r\n      color:#0B1434;\r\n      border:none;\r\n      box-shadow: 0 18px 40px rgba(93,132,255,.28);\r\n    }\r\n    .mtv-landing .btnDarkGhost{\r\n      background: transparent;\r\n      color: rgba(255,255,255,.90);\r\n      border: 1px solid rgba(255,255,255,.22);\r\n      box-shadow:none;\r\n    }\r\n    .mtv-landing .btnDarkGhost:hover{\r\n      border-color: rgba(255,255,255,.32);\r\n      box-shadow: 0 14px 34px rgba(15,23,51,.22);\r\n    }\r\n\r\n    .mtv-landing .webtvMedia{\r\n      position:relative;\r\n      z-index:1;\r\n      display:flex;\r\n      justify-content:flex-end;\r\n      align-items:center;\r\n      min-width:0;\r\n    }\r\n    .mtv-landing .webtvMedia .frame{\r\n      width: min(560px, 100%);\r\n      border-radius: 22px;\r\n      overflow:hidden;\r\n      border: 1px solid rgba(255,255,255,.18);\r\n      box-shadow: 0 26px 60px rgba(0,0,0,.35);\r\n      background:#0B1434;\r\n    }\r\n    .mtv-landing .webtvMedia img{ width:100%; height:auto; display:block; }\r\n\r\n    @media (max-width: 980px){\r\n      .mtv-landing .webtvInner{\r\n        grid-template-columns:1fr;\r\n        padding:28px;\r\n      }\r\n      .mtv-landing .webtvMedia{ justify-content:center; }\r\n    }\r\n\r\n    \/* =========================\r\n      SECTION ABONNEMENT \u2014 AM\u00c9LIOR\u00c9E\r\n    ========================= *\/\r\n    .mtv-landing .subWrap{\r\n      display:flex;\r\n      justify-content:center;\r\n    }\r\n    .mtv-landing .subCard{\r\n      width:min(980px, 100%);\r\n      background: linear-gradient(135deg, rgba(93,132,255,.06) 0%, rgba(143,233,255,.08) 50%, rgba(0,212,170,.04) 100%);\r\n      border:2px solid rgba(93,132,255,.22);\r\n      border-radius: 26px;\r\n      padding:38px 36px;\r\n      box-shadow: 0 16px 48px rgba(93,132,255,.12), 0 4px 14px rgba(15,23,51,.06);\r\n      position:relative;\r\n      overflow:hidden;\r\n      transition: transform .25s ease, box-shadow .25s ease;\r\n    }\r\n    .mtv-landing .subCard:hover{\r\n      transform: translateY(-4px);\r\n      box-shadow: 0 22px 58px rgba(93,132,255,.18), 0 6px 18px rgba(15,23,51,.08);\r\n    }\r\n    .mtv-landing .subCard::before{\r\n      content:\"\";\r\n      position:absolute; inset:-120px -120px auto auto;\r\n      width:380px; height:380px;\r\n      background: radial-gradient(circle, rgba(143,233,255,.22) 0%, transparent 62%);\r\n      pointer-events:none;\r\n    }\r\n    .mtv-landing .subCard::after{\r\n      content:\"\";\r\n      position:absolute; left:-80px; bottom:-80px;\r\n      width:260px; height:260px;\r\n      background: radial-gradient(circle, rgba(93,132,255,.14) 0%, transparent 65%);\r\n      pointer-events:none;\r\n    }\r\n    .mtv-landing .subBadge{\r\n      display:inline-flex;\r\n      align-items:center;\r\n      gap:8px;\r\n      padding:8px 16px;\r\n      border-radius:999px;\r\n      background: var(--grad-primary);\r\n      color:#fff;\r\n      font-weight:800;\r\n      font-size:12px;\r\n      letter-spacing:.06em;\r\n      text-transform:uppercase;\r\n      margin-bottom:16px;\r\n    }\r\n    .mtv-landing .subGrid{\r\n      display:grid;\r\n      grid-template-columns: 1.2fr .8fr;\r\n      gap:24px;\r\n      align-items:center;\r\n    }\r\n    .mtv-landing .subGrid > *{ min-width:0; }\r\n    .mtv-landing .subTitle{\r\n      font-size: clamp(24px, 3.2vw, 38px);\r\n      color:var(--text2);\r\n      line-height:1.1;\r\n    }\r\n    .mtv-landing .subTitle em{\r\n      font-style:italic;\r\n      background: var(--grad-primary);\r\n      -webkit-background-clip:text;\r\n      background-clip:text;\r\n      -webkit-text-fill-color:transparent;\r\n    }\r\n    .mtv-landing .subText{\r\n      margin-top:12px;\r\n      color:var(--text-light);\r\n      font-size:16px;\r\n      line-height:1.7;\r\n      max-width: 70ch;\r\n    }\r\n    .mtv-landing .subCtas{\r\n      display:flex;\r\n      justify-content:flex-end;\r\n      gap:12px;\r\n      flex-wrap:wrap;\r\n    }\r\n    .mtv-landing .subCtas .btnPrimary{\r\n      padding:16px 28px;\r\n      font-size:16px;\r\n      border-radius:16px;\r\n    }\r\n    .mtv-landing .subCtas .btnGhost{\r\n      padding:16px 28px;\r\n      font-size:16px;\r\n      border-radius:16px;\r\n    }\r\n    @media (max-width: 900px){\r\n      .mtv-landing .subGrid{ grid-template-columns: 1fr; }\r\n      .mtv-landing .subCtas{ justify-content:flex-start; margin-top:12px; }\r\n    }\r\n\r\n    \/* =========================\r\n      DOWNLOAD\r\n    ========================= *\/\r\n    .mtv-landing .downloadGrid{\r\n      display:grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap:40px;\r\n      align-items:center;\r\n      overflow:visible;\r\n    }\r\n    .mtv-landing .downloadGrid > *{ min-width:0; }\r\n    @media (max-width: 980px){\r\n      .mtv-landing .downloadGrid{ grid-template-columns:1fr; gap:26px; }\r\n    }\r\n\r\n    .mtv-landing .dlTitle{\r\n      font-size: clamp(30px, 4.6vw, 62px);\r\n      color:var(--text2);\r\n      line-height:1.02;\r\n    }\r\n    .mtv-landing .dlTitle em{\r\n      font-style:italic;\r\n      background: var(--grad-primary);\r\n      -webkit-background-clip:text;\r\n      background-clip:text;\r\n      -webkit-text-fill-color:transparent;\r\n    }\r\n    .mtv-landing .dlText{\r\n      margin-top:14px;\r\n      color:var(--text-light);\r\n      font-size:16.5px;\r\n      line-height:1.75;\r\n      max-width: 60ch;\r\n    }\r\n\r\n    .mtv-landing .storeRow{\r\n      margin-top:22px;\r\n      display:flex;\r\n      gap:14px;\r\n      flex-wrap:wrap;\r\n    }\r\n    .mtv-landing .storeCard{\r\n      display:flex;\r\n      align-items:center;\r\n      gap:14px;\r\n      padding:16px 20px;\r\n      border-radius: 18px;\r\n      background:#fff;\r\n      border:1px solid var(--border);\r\n      box-shadow: var(--shadow-sm);\r\n      min-width: 230px;\r\n      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;\r\n    }\r\n    .mtv-landing .storeCard:hover{\r\n      transform: translateY(-2px);\r\n      box-shadow: var(--shadow-md);\r\n      border-color: rgba(93,132,255,.25);\r\n    }\r\n    .mtv-landing .storeCard .sic{\r\n      width:48px;height:48px;border-radius:14px;\r\n      display:grid;place-items:center;\r\n      flex:0 0 auto;\r\n    }\r\n    .mtv-landing .storeCard .sic-play{\r\n      background: rgba(93,132,255,.10);\r\n      border:1px solid rgba(93,132,255,.18);\r\n    }\r\n    .mtv-landing .storeCard .sic-apple{\r\n      background: rgba(15,23,51,.06);\r\n      border:1px solid rgba(15,23,51,.12);\r\n    }\r\n    .mtv-landing .storeCard small{\r\n      display:block;\r\n      color:rgba(15,23,51,.55);\r\n      font-weight:900;\r\n      font-size:11px;\r\n      letter-spacing:.08em;\r\n      text-transform:uppercase;\r\n      margin-bottom:2px;\r\n    }\r\n    .mtv-landing .storeCard b{\r\n      display:block;\r\n      font-weight:900;\r\n      font-size:16px;\r\n      color:var(--text2);\r\n    }\r\n\r\n    .mtv-landing .phoneWrap{\r\n      position:relative;\r\n      display:flex;\r\n      justify-content:flex-end;\r\n      align-items:center;\r\n      overflow:visible;\r\n      min-width:0;\r\n    }\r\n    .mtv-landing .phoneGlow{\r\n      position:absolute;\r\n      right:10%;\r\n      width:520px;\r\n      height:520px;\r\n      border-radius: 999px;\r\n      background: radial-gradient(circle, rgba(93,132,255,.16) 0%, rgba(143,233,255,.12) 35%, transparent 70%);\r\n      z-index:0;\r\n      pointer-events:none;\r\n    }\r\n    .mtv-landing .phoneFrame{\r\n      position:relative;\r\n      z-index:1;\r\n      width: min(420px, 100%);\r\n      border-radius: 38px;\r\n      overflow:hidden;\r\n      box-shadow: 0 28px 70px rgba(15,23,51,.18);\r\n      border: 1px solid rgba(15,23,51,.10);\r\n      background:#0B1434;\r\n    }\r\n    .mtv-landing .phoneFrame img{ width:100%; height:auto; display:block; }\r\n\r\n    @media (max-width: 980px){\r\n      .mtv-landing .phoneWrap{ justify-content:center; }\r\n      .mtv-landing .phoneGlow{\r\n        right:auto; left:50%; transform:translateX(-50%);\r\n        width:420px; height:420px;\r\n      }\r\n    }\r\n\r\n    \/* reduce motion *\/\r\n    @media (prefers-reduced-motion: reduce){\r\n      .mtv-landing .dot{ animation:none !important; }\r\n      .mtv-landing *{ transition:none !important; }\r\n    }\r\n  <\/style>\r\n\r\n  <!-- HERO -->\r\n  <div class=\"mtv-sec hero\" id=\"top\">\r\n    <div class=\"container heroGrid\">\r\n      <div>\r\n        <div class=\"kicker\"><span class=\"dot\"><\/span> TV en direct, replay & films \u2014 partout<\/div>\r\n\r\n        <h1 class=\"h1\">Votre TV partout, <em>simple et rapide<\/em><\/h1>\r\n\r\n        <p class=\"lead\">\r\n          Profitez de <b>la t\u00e9l\u00e9vision en direct<\/b>, rattrapez tous vos <b>programmes en replay<\/b> et d\u00e9couvrez une <b>biblioth\u00e8que de films<\/b>\r\n          depuis tous vos \u00e9crans : <b>mobile<\/b>, <b>tablette<\/b>, <b>Web TV<\/b>, <b>Android TV<\/b> et <b>Apple TV<\/b>.\r\n        <\/p>\r\n\r\n        <div class=\"heroCtas\">\r\n          <a class=\"btn btnPrimary\" href=\"#download\">T\u00e9l\u00e9charger gratuitement<\/a>\r\n          <a class=\"btn btnGhost\" href=\"#webtv\">Acc\u00e9der \u00e0 la Web TV<\/a>\r\n        <\/div>\r\n\r\n        <div class=\"deviceRow\" aria-label=\"Appareils compatibles\">\r\n          <span class=\"devicePill\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"><rect x=\"7\" y=\"2.5\" width=\"10\" height=\"19\" rx=\"2\"\/><\/svg>\r\n            Smartphone\r\n          <\/span>\r\n          <span class=\"devicePill\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"><rect x=\"4\" y=\"4\" width=\"16\" height=\"12\" rx=\"2\"\/><path d=\"M8 20h8\"\/><\/svg>\r\n            Tablette\r\n          <\/span>\r\n          <span class=\"devicePill\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"12\" rx=\"2\"\/><path d=\"M8 21h8\"\/><\/svg>\r\n            Android TV\r\n          <\/span>\r\n          <span class=\"devicePill\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"><rect x=\"4\" y=\"6\" width=\"16\" height=\"11\" rx=\"2\"\/><path d=\"M10 20h4\"\/><\/svg>\r\n            Apple TV\r\n          <\/span>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"heroMedia\" aria-label=\"Aper\u00e7u\">\r\n        <div class=\"chip chip1\" aria-hidden=\"true\">\r\n          <div class=\"ic\">\r\n            <svg viewBox=\"0 0 24 24\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"#0B1434\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n              <rect x=\"4\" y=\"5\" width=\"16\" height=\"14\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 9h8M8 13h5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div>\r\n            <b>Guide TV<\/b>\r\n            <span>Grille compl\u00e8te<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"chip chip2\" aria-hidden=\"true\">\r\n          <div class=\"ic\" style=\"background:rgba(93,132,255,.12);border-color:rgba(93,132,255,.22);\">\r\n            <svg viewBox=\"0 0 24 24\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"#0B1434\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n              <rect x=\"3\" y=\"6\" width=\"18\" height=\"12\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 21h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div>\r\n            <b>Web TV<\/b>\r\n            <span>Regardez partout<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"heroShot\">\r\n          <img loading=\"lazy\" decoding=\"async\" decoding=\"async\" id=\"heroImg\" src=\"\" alt=\"Aper\u00e7u Web TV Mondial TV\"\r\n               onerror=\"this.style.display='none'; this.nextElementSibling.style.display='block';\">\r\n          <div class=\"fallback\" style=\"display:none\">\r\n            Image d'aper\u00e7u \u00e0 ajouter<br>\r\n            (renseignez <b>CONFIG.heroWebTv<\/b>)\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- WHY -->\r\n  <div class=\"mtv-sec\" id=\"why\">\r\n    <div class=\"container\">\r\n      <div class=\"sectionTitle\">\r\n        <h2>Pourquoi choisir Mondial TV ?<\/h2>\r\n        <p>\r\n          La solution compl\u00e8te pour profiter de la t\u00e9l\u00e9vision sur tous vos appareils :\r\n          mobile, tablette, Web TV, Android TV et Apple TV.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"grid\">\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <rect x=\"2.5\" y=\"7\" width=\"19\" height=\"14\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 3h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Tout au m\u00eame endroit<\/h3>\r\n          <p>Acc\u00e9dez \u00e0 la TV en direct, au replay et aux films depuis une seule application, sur tous vos \u00e9crans.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <circle cx=\"11\" cy=\"11\" r=\"7.5\"><\/circle>\r\n              <path d=\"M21 21l-4.3-4.3\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Trouvez instantan\u00e9ment<\/h3>\r\n          <p>Recherche rapide, cat\u00e9gories, favoris et Ma Liste : retrouvez vos contenus en quelques secondes.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <path d=\"M4 12h16\"><\/path>\r\n              <path d=\"M12 4v16\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Qualit\u00e9 premium<\/h3>\r\n          <p>Player HD, audio multilingue, sous-titres et contr\u00f4les intuitifs, sur tous vos \u00e9crans.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"highRow\" aria-label=\"Points forts\">\r\n        <div class=\"high\">\r\n          <div class=\"badge\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"none\" stroke=\"#00B894\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n              <rect x=\"4\" y=\"5\" width=\"16\" height=\"14\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 9h8M8 13h5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div>\r\n            <b>Guide TV (EPG) complet<\/b>\r\n            <span>Grille des programmes en temps r\u00e9el + acc\u00e8s replay selon disponibilit\u00e9.<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"high\">\r\n          <div class=\"badge\" aria-hidden=\"true\" style=\"background:rgba(93,132,255,.10);border-color:rgba(93,132,255,.18);\">\r\n            <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"none\" stroke=\"#5D84FF\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n              <path d=\"M13 3L4 14h7l-1 7 9-11h-7l1-7Z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div>\r\n            <b>Reprise instantan\u00e9e<\/b>\r\n            <span>Commencez sur mobile ou tablette, continuez sur TV : synchronisation automatique.<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- FEATURES -->\r\n  <div class=\"mtv-sec\" id=\"features\">\r\n    <div class=\"container\">\r\n      <div class=\"sectionTitle\">\r\n        <h2>Fonctionnalit\u00e9s compl\u00e8tes<\/h2>\r\n        <p>Tout ce dont vous avez besoin pour une exp\u00e9rience TV moderne et personnalis\u00e9e.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"grid\">\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 10h8M8 14h5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Guide TV (EPG) & Replay<\/h3>\r\n          <p>Grille compl\u00e8te des programmes avec acc\u00e8s direct au replay quand disponible.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"12\" r=\"9.5\"><\/circle>\r\n              <path d=\"M12 7v5l3 2\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Pause en direct & reprise<\/h3>\r\n          <p>Mettez en pause la TV en direct et reprenez o\u00f9 vous vous \u00eates arr\u00eat\u00e9 (selon contenus compatibles).<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <path d=\"M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7 11 4.6a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21.3l7.8-7.9 1-1a5.5 5.5 0 0 0 0-7.8Z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Favoris & Ma Liste<\/h3>\r\n          <p>Cr\u00e9ez votre s\u00e9lection personnalis\u00e9e de cha\u00eenes et contenus. Acc\u00e8s rapide \u00e0 tout ce que vous aimez.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <path d=\"M4 10v4\"><\/path>\r\n              <path d=\"M8 8v8\"><\/path>\r\n              <path d=\"M12 6v12\"><\/path>\r\n              <path d=\"M16 8v8\"><\/path>\r\n              <path d=\"M20 10v4\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Audio & sous-titres<\/h3>\r\n          <p>Choix de langues audio, sous-titres disponibles et param\u00e8tres d'affichage.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <path d=\"M3 3h7v7H3zM14 3h7v7h-7zM14 14h7v7h-7zM3 14h7v7H3z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Cat\u00e9gories & genres<\/h3>\r\n          <p>Navigation par th\u00e8mes, genres et cat\u00e9gories pour d\u00e9couvrir facilement de nouveaux contenus.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <path d=\"M12 2v20\"><\/path>\r\n              <path d=\"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Compte & abonnement<\/h3>\r\n          <p>Gestion simplifi\u00e9e de votre compte et de votre abonnement.<\/p>\r\n        <\/div>\r\n\r\n        <!-- \u2705 NOUVEAU : Passage de g\u00e9n\u00e9rique -->\r\n        <div class=\"card\">\r\n          <div class=\"topbar\" aria-hidden=\"true\"><\/div>\r\n          <div class=\"icon\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\">\r\n              <polygon points=\"5 4 15 12 5 20\"><\/polygon>\r\n              <line x1=\"19\" y1=\"5\" x2=\"19\" y2=\"19\"><\/line>\r\n            <\/svg>\r\n          <\/div>\r\n          <h3>Passage de g\u00e9n\u00e9rique<\/h3>\r\n          <p>Passez automatiquement les g\u00e9n\u00e9riques de d\u00e9but et de fin pour encha\u00eener vos contenus sans interruption.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- APER\u00c7US -->\r\n  <div class=\"mtv-sec\" id=\"screens\">\r\n    <div class=\"container\">\r\n      <div class=\"sectionTitle\">\r\n        <h2>D\u00e9couvrez l'application<\/h2>\r\n        <p>Une interface soign\u00e9e et intuitive, optimis\u00e9e pour chaque appareil.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"tabs\">\r\n        <div class=\"seg\" role=\"tablist\" aria-label=\"Plateforme\">\r\n          <button id=\"tabMobile\" class=\"active\" type=\"button\" role=\"tab\" aria-selected=\"true\">\ud83d\udcf1 Mobile<\/button>\r\n          <button id=\"tabWeb\" type=\"button\" role=\"tab\" aria-selected=\"false\">\ud83d\udcbb Web TV<\/button>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div id=\"gallery\" class=\"gallery\" aria-live=\"polite\"><\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- WEB TV -->\r\n  <div class=\"mtv-sec\" id=\"webtv\">\r\n    <div class=\"container\">\r\n      <div class=\"webtvBlock\">\r\n        <div class=\"webtvInner\">\r\n          <div>\r\n            <div class=\"webtvBadge\">Exp\u00e9rience navigateur<\/div>\r\n            <h2 class=\"webtvTitle\">Web TV \u2014 Regardez depuis <em>votre ordinateur<\/em><\/h2>\r\n            <p class=\"webtvText\">\r\n              Pas besoin de t\u00e9l\u00e9chargement. Acc\u00e9dez \u00e0 l'int\u00e9gralit\u00e9 de Mondial TV directement depuis votre navigateur habituel.\r\n            <\/p>\r\n\r\n            <div class=\"urlCard\" aria-label=\"URL Web TV\">\r\n              <div class=\"uic\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 24 24\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n                  <rect x=\"3\" y=\"6\" width=\"18\" height=\"12\" rx=\"2\"><\/rect>\r\n                  <path d=\"M8 21h8\"><\/path>\r\n                <\/svg>\r\n              <\/div>\r\n              <div>\r\n                <small>URL directe<\/small>\r\n                <b id=\"webtvUrlBadge\">En attente de configuration<\/b>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"webtvBtns\" id=\"webtvCtaWrap\">\r\n              <a class=\"btn btnDarkPrimary\" href=\"#download\">\ud83d\ude80 Acc\u00e9der \u00e0 la Web TV<\/a>\r\n              <a class=\"btn btnDarkGhost\" href=\"#screens\">Voir les aper\u00e7us<\/a>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"webtvMedia\" aria-label=\"Aper\u00e7u Web TV\">\r\n            <div class=\"frame\">\r\n              <img loading=\"lazy\" decoding=\"async\" decoding=\"async\" id=\"webtvImg\" src=\"\" alt=\"Aper\u00e7u Web TV Mondial TV\"\r\n                   onerror=\"this.style.display='none'; this.parentElement.innerHTML='<div class=&quot;imgFallback&quot;>Image Web TV non disponible<\/div>';\">\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- \u2705 ABONNEMENT (am\u00e9lior\u00e9) -->\r\n  <div class=\"mtv-sec\" id=\"subscribe\">\r\n    <div class=\"container subWrap\">\r\n      <div class=\"subCard\" aria-label=\"Abonnement\">\r\n        <div class=\"subBadge\">\ud83c\udf81 Offres sp\u00e9ciales<\/div>\r\n        <div class=\"subGrid\">\r\n          <div>\r\n            <h2 class=\"subTitle\">Passez \u00e0 l'abonnement et profitez de Mondial TV \u00e0 <em>100%<\/em><\/h2>\r\n            <p class=\"subText\">\r\n              D\u00e9couvrez toutes nos offres et choisissez celle qui correspond \u00e0 vos besoins. Essai gratuit de 7 jours inclus.\r\n            <\/p>\r\n          <\/div>\r\n          <div class=\"subCtas\">\r\n            <a class=\"btn btnPrimary\" href=\"https:\/\/mondial.tv\/nos-offres\/\" target=\"_blank\" rel=\"noopener\">\ud83d\ude80 Voir les offres<\/a>\r\n            <a class=\"btn btnGhost\" href=\"#download\">T\u00e9l\u00e9charger l'app<\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- DOWNLOAD -->\r\n  <div class=\"mtv-sec\" id=\"download\">\r\n    <div class=\"container downloadGrid\">\r\n      <div>\r\n        <h2 class=\"dlTitle\">Commencez \u00e0 regarder <em>maintenant<\/em><\/h2>\r\n        <p class=\"dlText\">\r\n          T\u00e9l\u00e9chargez gratuitement Mondial TV sur vos appareils mobiles et profitez d'une exp\u00e9rience optimis\u00e9e, m\u00eame en d\u00e9placement.\r\n          Disponible aussi sur tablette, Android TV, Apple TV et Web TV.\r\n        <\/p>\r\n\r\n        <div class=\"storeRow\">\r\n          <a class=\"storeCard\"\r\n             href=\"https:\/\/play.google.com\/store\/apps\/details?id=fr.mondialtv.apps&gl=FR&_ga=2.173571619.1237964187.1748875728-1447883874.1748875728\"\r\n             target=\"_blank\" rel=\"noopener\">\r\n            <div class=\"sic sic-play\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"none\" stroke=\"#5D84FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                <polygon points=\"3 3 21 12 3 21 3 3\"><\/polygon>\r\n              <\/svg>\r\n            <\/div>\r\n            <div>\r\n              <small>Disponible sur<\/small>\r\n              <b>Google Play<\/b>\r\n            <\/div>\r\n          <\/a>\r\n\r\n          <a class=\"storeCard\"\r\n             href=\"https:\/\/apps.apple.com\/fr\/app\/mondial-tv-films-t%C3%A9l%C3%A9\/id1543677189\"\r\n             target=\"_blank\" rel=\"noopener\">\r\n            <div class=\"sic sic-apple\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"#0B1434\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <path d=\"M17.05 20.28c-.98.95-2.05.88-3.08.4-1.09-.5-2.08-.53-3.23 0-1.44.66-2.2.47-3.06-.4C3.79 16.17 4.36 9.53 8.74 9.28c1.32.07 2.23.77 3 .82.97-.2 1.9-.93 2.94-.84 1.24.1 2.17.6 2.78 1.53-2.56 1.54-1.95 4.92.54 5.87-.5 1.3-1.14 2.58-1.95 3.62zM12.03 9.2c-.13-2.31 1.79-4.28 3.97-4.47.3 2.65-2.4 4.64-3.97 4.47z\"\/>\r\n              <\/svg>\r\n            <\/div>\r\n            <div>\r\n              <small>Disponible sur<\/small>\r\n              <b>App Store<\/b>\r\n            <\/div>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"phoneWrap\" aria-label=\"Aper\u00e7u mobile\">\r\n        <div class=\"phoneGlow\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"phoneFrame\">\r\n          <img loading=\"lazy\" decoding=\"async\" decoding=\"async\" id=\"phoneImg\" src=\"\" alt=\"Aper\u00e7u application mobile Mondial TV\"\r\n               onerror=\"this.style.display='none'; this.parentElement.innerHTML='<div class=&quot;imgFallback&quot;>Image mobile non disponible<\/div>';\">\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <script>\r\n    \/**********************************************************************\r\n     * \ud83c\udfac CONFIGURATION MONDIAL TV (URLs inchang\u00e9es)\r\n     **********************************************************************\/\r\n    const CONFIG = {\r\n      \/* \ud83d\uddbc\ufe0f IMAGE HERO (Web TV 16\/9) *\/\r\n      heroWebTv: \"\",\r\n\r\n      \/* \ud83c\udf10 URL WEB TV *\/\r\n      webTvInternalUrl: \"https:\/\/mondial.tv\/acces-web-tv-mondial-tv\/\",\r\n\r\n      \/* \ud83d\udcf1 CAPTURES MOBILE (9\/16) *\/\r\n      mobileShots: [\r\n        { title: \"Fiche film\", desc: \"D\u00e9tails et lecture sur mobile.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Fiche-Film-Mobile.jpg\" },\r\n        { title: \"Catalogue\", desc: \"Films par cat\u00e9gories.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Catalogue-Film-Mobile.jpg\" },\r\n        { title: \"Guide TV (EPG)\", desc: \"Programmes & navigation.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Guide-TV-Mobile.jpg\" },\r\n        { title: \"Ma Liste\", desc: \"Retrouvez vos contenus.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Ma-Liste-mobile.jpg\" },\r\n        { title: \"Menu rapide\", desc: \"Actions rapides.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Menu-Rapide-Mobile.jpg\" }\r\n      ],\r\n\r\n      \/* \ud83d\udcbb CAPTURES WEB TV (16\/9) *\/\r\n      webShots: [\r\n        { title: \"Cha\u00eenes\", desc: \"Grille cha\u00eenes + cat\u00e9gories.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Chaines-WebTv.png\" },\r\n        { title: \"Lecture \/ Player\", desc: \"Lecture grand \u00e9cran.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Lecture-WebTV-1.png\" },\r\n        { title: \"Ma Liste\", desc: \"Continuer \u00e0 regarder.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Ma-Liste-WebTV.png\" },\r\n        { title: \"Menu rapide\", desc: \"Actions rapides.\", url: \"https:\/\/mondial.tv\/wp-content\/uploads\/2026\/01\/Menu-Rapide-WebTV.png\" }\r\n      ]\r\n    };\r\n\r\n    \/**********************************************************************\r\n     * \ud83d\udd27 RENDER \u2014 Elementor-safe (tout dans #mtv-landing)\r\n     **********************************************************************\/\r\n    (function initMondialLanding(){\r\n      const root = document.getElementById(\"mtv-landing\");\r\n      if(!root) return;\r\n\r\n      const gallery = root.querySelector(\"#gallery\");\r\n      const tabMobile = root.querySelector(\"#tabMobile\");\r\n      const tabWeb = root.querySelector(\"#tabWeb\");\r\n\r\n      function pickHeroFallback(){\r\n        const fromConfig = (CONFIG.heroWebTv && String(CONFIG.heroWebTv).trim()) ? String(CONFIG.heroWebTv).trim() : \"\";\r\n        if (fromConfig) return fromConfig;\r\n        const w0 = (CONFIG.webShots && CONFIG.webShots[0] && CONFIG.webShots[0].url) ? String(CONFIG.webShots[0].url).trim() : \"\";\r\n        return w0 || \"\";\r\n      }\r\n\r\n      function setHero(){\r\n        const img = root.querySelector(\"#heroImg\");\r\n        if (!img) return;\r\n\r\n        const src = pickHeroFallback();\r\n        if (src) {\r\n          img.src = src;\r\n          img.style.display = \"block\";\r\n          if (img.nextElementSibling) img.nextElementSibling.style.display = \"none\";\r\n        } else {\r\n          img.style.display = \"none\";\r\n          if (img.nextElementSibling) img.nextElementSibling.style.display = \"block\";\r\n        }\r\n      }\r\n\r\n      function imgWithFallback(url, alt){\r\n        const img = document.createElement(\"img\");\r\n        img.src = (url || \"\").trim();\r\n        img.alt = alt || \"\";\r\n        img.loading = \"lazy\";\r\n        img.decoding = \"async\";\r\n\r\n        img.onerror = () => {\r\n          img.style.display = \"none\";\r\n          const fallback = document.createElement(\"div\");\r\n          fallback.className = \"imgFallback\";\r\n          fallback.textContent = \"Image non disponible\";\r\n          img.parentElement && img.parentElement.appendChild(fallback);\r\n        };\r\n\r\n        if (!url) setTimeout(() => img.onerror(), 0);\r\n        return img;\r\n      }\r\n\r\n      function render(platform){\r\n        if(!gallery) return;\r\n        gallery.innerHTML = \"\";\r\n\r\n        const isWeb = platform === \"web\";\r\n        const data = isWeb ? CONFIG.webShots : CONFIG.mobileShots;\r\n\r\n        (data || []).forEach(item => {\r\n          const card = document.createElement(\"article\");\r\n          card.className = \"shot \" + (isWeb ? \"web\" : \"mobile\");\r\n\r\n          const media = document.createElement(\"div\");\r\n          media.className = \"media\";\r\n          media.appendChild(imgWithFallback(item.url, item.title));\r\n\r\n          const cap = document.createElement(\"div\");\r\n          cap.className = \"cap\";\r\n\r\n          const safeTitle = (item.title || \"\").replace(\/<\/g,\"&lt;\").replace(\/>\/g,\"&gt;\");\r\n          const safeDesc  = (item.desc  || \"\").replace(\/<\/g,\"&lt;\").replace(\/>\/g,\"&gt;\");\r\n\r\n          cap.innerHTML = `<b>${safeTitle}<\/b><span>${safeDesc}<\/span>`;\r\n\r\n          card.appendChild(media);\r\n          card.appendChild(cap);\r\n          gallery.appendChild(card);\r\n        });\r\n      }\r\n\r\n      function setActive(platform){\r\n        const isMobile = platform === \"mobile\";\r\n        tabMobile.classList.toggle(\"active\", isMobile);\r\n        tabWeb.classList.toggle(\"active\", !isMobile);\r\n        tabMobile.setAttribute(\"aria-selected\", String(isMobile));\r\n        tabWeb.setAttribute(\"aria-selected\", String(!isMobile));\r\n        render(isMobile ? \"mobile\" : \"web\");\r\n      }\r\n\r\n      function setupWebTvUrl(){\r\n        const badge = root.querySelector(\"#webtvUrlBadge\");\r\n        const ctaWrap = root.querySelector(\"#webtvCtaWrap\");\r\n        const webtvImg = root.querySelector(\"#webtvImg\");\r\n        const phoneImg = root.querySelector(\"#phoneImg\");\r\n\r\n        if (badge) {\r\n          badge.textContent = CONFIG.webTvInternalUrl ? CONFIG.webTvInternalUrl : \"En attente de configuration\";\r\n        }\r\n\r\n        if (ctaWrap) {\r\n          if (CONFIG.webTvInternalUrl) {\r\n            ctaWrap.innerHTML = `\r\n              <a class=\"btn btnDarkPrimary\" href=\"${CONFIG.webTvInternalUrl}\" target=\"_blank\" rel=\"noopener\">\ud83d\ude80 Acc\u00e9der \u00e0 la Web TV \u2192<\/a>\r\n              <a class=\"btn btnDarkGhost\" href=\"#screens\">Voir les aper\u00e7us<\/a>\r\n            `;\r\n          } else {\r\n            ctaWrap.innerHTML = `\r\n              <a class=\"btn btnDarkPrimary\" href=\"#download\">T\u00e9l\u00e9charger gratuitement<\/a>\r\n              <a class=\"btn btnDarkGhost\" href=\"#screens\">Voir les aper\u00e7us<\/a>\r\n            `;\r\n          }\r\n        }\r\n\r\n        if (webtvImg) {\r\n          const candidate = pickHeroFallback();\r\n          if (candidate) webtvImg.src = candidate;\r\n        }\r\n\r\n        if (phoneImg) {\r\n          const m = (CONFIG.mobileShots && CONFIG.mobileShots[0] && CONFIG.mobileShots[0].url) ? String(CONFIG.mobileShots[0].url).trim() : \"\";\r\n          if (m) phoneImg.src = m;\r\n        }\r\n      }\r\n\r\n      tabMobile.addEventListener(\"click\", () => setActive(\"mobile\"));\r\n      tabWeb.addEventListener(\"click\", () => setActive(\"web\"));\r\n\r\n      root.querySelectorAll('a[href^=\"#\"]').forEach(a => {\r\n        a.addEventListener(\"click\", (e) => {\r\n          const href = a.getAttribute(\"href\");\r\n          if (!href || href === \"#\") return;\r\n\r\n          const target = root.querySelector(href) || document.querySelector(href);\r\n          if (!target) return;\r\n\r\n          e.preventDefault();\r\n          target.scrollIntoView({ behavior:\"smooth\", block:\"start\" });\r\n        });\r\n      });\r\n\r\n      setHero();\r\n      setupWebTvUrl();\r\n      setActive(\"mobile\");\r\n    })();\r\n  <\/script>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>TV en direct, replay &#038; films \u2014 partout Votre TV partout, simple et rapide Profitez de la t\u00e9l\u00e9vision en direct, rattrapez tous vos programmes en replay et d\u00e9couvrez une biblioth\u00e8que de films depuis tous vos \u00e9crans : mobile, tablette, Web TV, Android TV et Apple TV. T\u00e9l\u00e9charger gratuitement Acc\u00e9der \u00e0 la Web TV Smartphone Tablette [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-328010","page","type-page","status-publish","hentry"],"aioseo_notices":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/pages\/328010","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/comments?post=328010"}],"version-history":[{"count":80,"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/pages\/328010\/revisions"}],"predecessor-version":[{"id":328413,"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/pages\/328010\/revisions\/328413"}],"wp:attachment":[{"href":"https:\/\/mondial.tv\/en\/wp-json\/wp\/v2\/media?parent=328010"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}