/* =========================================================
   NRJ VAR — Feuille de style de marque
   Couleurs, typographies, composants et RESPONSIVE.
   La maquette Figma étant en desktop (1280px) uniquement,
   le comportement mobile/tablette est défini ici.
   ========================================================= */

:root{
  --nrj-red:#E2001A;        /* Rouge 3 - NRJ (principal) */
  --nrj-red-bright:#FF0000; /* Rouge 1 - NRJ */
  --nrj-red-dark:#B00016;
  --nrj-black:#111111;
  --nrj-ink:#000000;
  --nrj-grey:#E8E8E8;       /* gris clair */
  --nrj-grey-2:#6B6B6B;
  --nrj-white:#FFFFFF;
  --nrj-radius:14px;
  --nrj-maxw:1280px;
  --nrj-font-title:"Montserrat", Arial, sans-serif;
  --nrj-font-body:"Lato", Arial, sans-serif;
}

/* ---------- Base typographie ---------- */
body{ font-family:var(--nrj-font-body); color:var(--nrj-black); }
h1,h2,h3,h4,h5,h6,
.nrj-title{ font-family:var(--nrj-font-title); font-weight:800; letter-spacing:.2px; }

/* Largeur de contenu alignée maquette */
.elementor-section.elementor-section-boxed > .elementor-container{ max-width:var(--nrj-maxw); }

/* ---------- Utilitaires de marque ---------- */
.nrj-uppercase{ text-transform:uppercase; }
.nrj-eyebrow{ color:var(--nrj-red); font-family:var(--nrj-font-title); font-weight:700;
  text-transform:uppercase; letter-spacing:1.5px; font-size:14px; }

/* Titre de section avec barre rouge (ex: "NOS TITRES DIFFUSÉS") */
.nrj-section-title{ position:relative; display:inline-block; font-family:var(--nrj-font-title);
  font-weight:800; text-transform:uppercase; }
.nrj-section-title:after{ content:""; display:block; width:64px; height:5px;
  background:var(--nrj-red); margin-top:10px; border-radius:3px; }

/* Bouton "pilule" rouge (EN DIRECT / EN SAVOIR PLUS) */
.nrj-pill > .elementor-button,
.nrj-pill .elementor-button{ border-radius:40px !important; font-family:var(--nrj-font-title);
  font-weight:700; text-transform:uppercase; letter-spacing:.5px; }

/* Carte (event, podcast, post réseau) */
.nrj-card{ background:var(--nrj-white); border-radius:var(--nrj-radius); overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.08); }

/* Barre du player "EN DIRECT" */
.nrj-player{ background:var(--nrj-red); color:#fff; border-radius:10px; }
.nrj-player .elementor-heading-title,
.nrj-player p{ color:#fff !important; }

/* Bandeau CTA rouge */
.nrj-cta{ background:linear-gradient(135deg,var(--nrj-red) 0%,var(--nrj-red-dark) 100%); color:#fff; }
.nrj-cta h1,.nrj-cta h2,.nrj-cta h3,.nrj-cta p{ color:#fff !important; }

/* Pied de page noir */
.nrj-footer{ background:var(--nrj-ink); color:#fff; }
.nrj-footer a{ color:rgba(255,255,255,.8); text-decoration:none; }
.nrj-footer a:hover{ color:#fff; }

/* Stats régie */
.nrj-stat-number{ font-family:var(--nrj-font-title); font-weight:800; font-size:42px; color:#fff; }

/* En-tête fixe / nav */
.nrj-header{ background:var(--nrj-white); }
.nrj-header .elementor-nav-menu .elementor-item{ font-family:var(--nrj-font-title);
  font-weight:700; text-transform:uppercase; letter-spacing:.5px; }

/* =========================================================
   RESPONSIVE — non maquetté : règles définies par le thème
   Breakpoints : mobile <=767, tablette 768-1024, desktop >=1025
   ========================================================= */

/* --- Tablette --- */
@media (max-width:1024px){
  .nrj-stat-number{ font-size:34px; }
  .nrj-section-title{ font-size:26px; }
}

/* --- Mobile --- */
@media (max-width:767px){
  /* Empiler toutes les colonnes par défaut (sécurité si réglage Elementor absent) */
  .elementor-column{ width:100% !important; }

  /* Titres fluides */
  h1,.elementor-widget-heading h1.elementor-heading-title{ font-size:30px !important; line-height:1.15; }
  h2,.elementor-widget-heading h2.elementor-heading-title{ font-size:24px !important; line-height:1.2; }
  .nrj-section-title{ font-size:22px; }
  .nrj-stat-number{ font-size:30px; }

  /* Navigation : laisser le menu hamburger d'Elementor gérer */
  .nrj-header .elementor-nav-menu--main{ width:100%; }

  /* Réduire les paddings de section pour le mobile */
  .elementor-section.elementor-section-boxed > .elementor-container{ padding-left:16px; padding-right:16px; }

  /* CTA : centrer et réduire */
  .nrj-cta{ text-align:center; }

  /* Cartes pleine largeur avec marge basse */
  .nrj-card{ margin-bottom:20px; }

  /* Player empilé */
  .nrj-player{ text-align:center; }
}

/* Images toujours fluides */
img{ max-width:100%; height:auto; }

/* Accessibilité focus */
a:focus,.elementor-button:focus{ outline:2px solid var(--nrj-red-bright); outline-offset:2px; }