/* ==========================================================
   NEWSLETTER — COMPOSANT PUBLIC RÉUTILISABLE
   Article / Promotions / autres pages publiques
   ========================================================== */
.newsletter-block{
  --newsletter-green:#159a83;
  --newsletter-mint:#62beaf;
  --newsletter-text:#041f2d;
  position:relative;
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:26px;
  width:100%;
  margin:34px 0 14px;
  padding:38px 40px;
  overflow:hidden;
  border:1px solid rgba(21,154,131,.26);
  border-radius:24px;
  background:
    radial-gradient(circle at 100% 0,rgba(98,190,175,.18),transparent 36%),
    linear-gradient(135deg,#e9f8f4 0%,#f5fbf9 56%,#eef9f6 100%);
  box-shadow:0 18px 44px rgba(15,47,51,.08);
  color:var(--newsletter-text);
  font-family:"Roboto",Arial,sans-serif;
}

.newsletter-block *,
.newsletter-block *::before,
.newsletter-block *::after{
  box-sizing:border-box;
}

.newsletter-block::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg,var(--newsletter-green),var(--newsletter-mint));
}

.newsletter-block__icon{
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--newsletter-green),var(--newsletter-mint));
  color:#fff;
  font-size:1.6rem;
  box-shadow:0 12px 28px rgba(21,154,131,.20);
}

.newsletter-block__eyebrow{
  display:block;
  margin:2px 0 8px;
  color:var(--newsletter-green);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.15em;
}

.newsletter-block h2{
  margin:0;
  color:var(--newsletter-text);
  font-size:1.82rem;
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.03em;
}

.newsletter-block__content > p{
  margin:12px 0 20px;
  color:#536b71;
  font-size:.97rem;
  line-height:1.65;
}

.newsletter-block__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
}

.newsletter-block__row input[type=email]{
  min-width:0;
  padding:15px 16px;
  border:1px solid rgba(4,31,45,.16);
  border-radius:13px;
  background:#fff;
  color:var(--newsletter-text);
  font:inherit;
  outline:0;
  box-shadow:0 5px 14px rgba(15,47,51,.03);
}

.newsletter-block__row input[type=email]:focus{
  border-color:rgba(21,154,131,.62);
  box-shadow:0 0 0 4px rgba(21,154,131,.09);
}

.newsletter-block__row button{
  padding:13px 20px;
  border:0;
  border-radius:13px;
  background:linear-gradient(135deg,#159a83,#62beaf);
  color:#fff;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(21,154,131,.17);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}

.newsletter-block__row button:hover,
.newsletter-block__row button:focus-visible{
  transform:translateY(-2px);
  filter:saturate(1.08);
  box-shadow:0 14px 30px rgba(21,154,131,.23);
}

.newsletter-block__row button:disabled{
  opacity:.55;
  cursor:wait;
  transform:none;
  box-shadow:none;
}

.newsletter-block__consent{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:12px;
  color:#657c81;
  font-size:.74rem;
  line-height:1.5;
}

.newsletter-block__consent input{
  margin-top:2px;
  accent-color:var(--newsletter-green);
}

.newsletter-block__consent a{
  color:var(--newsletter-green);
  font-weight:800;
}

.newsletter-block__message{
  min-height:18px;
  margin:9px 0 0;
  color:#71858a;
  font-size:.76rem;
  font-weight:700;
}

.newsletter-block__message.is-success,
.newsletter-block__message.is-error{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
  padding:12px 14px;
  border-radius:12px;
  font-size:.82rem;
  font-weight:800;
  line-height:1.45;
}

.newsletter-block__message.is-success{
  border:1px solid rgba(21,154,131,.24);
  background:#e8f8f4;
  color:#087c69;
  box-shadow:0 6px 18px rgba(21,154,131,.08);
}

.newsletter-block__message.is-success::before{
  content:"✓";
  display:grid;
  place-items:center;
  flex:0 0 24px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--newsletter-green),var(--newsletter-mint));
  color:#fff;
  font-size:.78rem;
  font-weight:900;
}

.newsletter-block__message.is-error{
  border:1px solid rgba(191,98,86,.24);
  background:#fff2f0;
  color:#a84f43;
}

.newsletter-block__message.is-error::before{
  content:"!";
  display:grid;
  place-items:center;
  flex:0 0 24px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#bf6256;
  color:#fff;
  font-size:.82rem;
  font-weight:900;
}

.newsletter-block__honeypot{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
}

.newsletter-block__sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

/* Promotions : bloc centré et volontairement plus étroit que la grille produits. */
.newsletter-block--promotions{
  width:min(1180px,100%);
  margin:56px auto 24px;
}

@media(max-width:700px){
  .newsletter-block{
    display:block;
    margin-top:28px;
    padding:30px 24px;
    border-radius:20px;
  }

  .newsletter-block--promotions{
    margin-top:38px;
    margin-bottom:18px;
  }

  .newsletter-block__icon{
    width:58px;
    height:58px;
    margin-bottom:20px;
    font-size:1.4rem;
  }

  .newsletter-block h2{font-size:1.5rem;}
  .newsletter-block__content > p{font-size:.92rem;}
  .newsletter-block__row{grid-template-columns:1fr;}
  .newsletter-block__row button{width:100%;}
}

/* ==========================================================
   VARIANTE PROMOTIONS V4 — FORMULAIRE + EMPLACEMENT PNG
   Le rendu standard des articles reste inchangé.
   ========================================================== */
.newsletter-block__signup{
  display:contents;
}

.newsletter-block--split{
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:0;
  width:min(1180px,100%);
  padding:0;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0,rgba(98,190,175,.16),transparent 34%),
    linear-gradient(135deg,#eefaf7 0%,#f8fcfb 54%,#eef9f6 100%);
}

.newsletter-block--split .newsletter-block__signup{
  display:grid;
  grid-template-columns:68px minmax(0,1fr);
  align-content:center;
  gap:24px;
  min-width:0;
  padding:42px 36px 38px 40px;
}

.newsletter-block--split .newsletter-block__content > p{
  max-width:540px;
}

.newsletter-block--split .newsletter-block__row{
  grid-template-columns:minmax(0,1fr) auto;
}

.newsletter-block__preview{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:30px 30px 30px 26px;
  border-left:1px solid rgba(21,154,131,.12);
}

.newsletter-block__preview::before{
  content:"";
  position:absolute;
  inset:18px 18px 18px 0;
  border-radius:26px;
  background:radial-gradient(circle at 75% 18%,rgba(255,255,255,.9),transparent 36%);
  pointer-events:none;
}

.newsletter-block__preview-heading{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  gap:8px;
  margin:0 0 14px 8px;
  padding:8px 13px;
  border:1px solid rgba(21,154,131,.13);
  border-radius:999px;
  background:rgba(255,255,255,.62);
  color:#168b76;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.12em;
  box-shadow:0 7px 18px rgba(15,47,51,.05);
}

.newsletter-block__preview-heading i{
  font-size:.82rem;
}

.newsletter-block__preview-stage{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:100%;
  min-height:310px;
}

.newsletter-block__preview-image{
  display:block;
  width:100%;
  max-width:470px;
  max-height:350px;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 18px 28px rgba(15,47,51,.10));
}

.newsletter-block__preview-placeholder{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:min(430px,100%);
  min-height:270px;
  padding:28px;
  border:1.5px dashed rgba(21,154,131,.28);
  border-radius:22px;
  background:rgba(255,255,255,.48);
  color:#61777c;
  text-align:center;
}

.newsletter-block__preview-placeholder > i{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin-bottom:14px;
  border-radius:50%;
  background:#e7f6f2;
  color:var(--newsletter-green);
  font-size:1.35rem;
}

.newsletter-block__preview-placeholder strong{
  color:#12363b;
  font-size:.94rem;
  font-weight:900;
}

.newsletter-block__preview-placeholder span{
  margin-top:7px;
  font-size:.74rem;
  line-height:1.5;
}

.newsletter-block__preview-placeholder code{
  color:#168b76;
  font-size:.72rem;
  font-weight:800;
}

@media(max-width:980px){
  .newsletter-block--split{
    grid-template-columns:1fr;
  }

  .newsletter-block--split .newsletter-block__signup{
    padding:36px 34px 28px;
  }

  .newsletter-block__preview{
    padding:22px 34px 34px;
    border-top:1px solid rgba(21,154,131,.11);
    border-left:0;
  }

  .newsletter-block__preview::before{
    inset:0 18px 18px;
  }

  .newsletter-block__preview-heading{
    align-self:center;
    margin-left:0;
  }

  .newsletter-block__preview-stage{
    min-height:260px;
  }

  .newsletter-block__preview-image{
    max-width:520px;
    max-height:330px;
  }
}

@media(max-width:700px){
  .newsletter-block--split{
    display:grid;
    padding:0;
  }

  .newsletter-block--split .newsletter-block__signup{
    display:block;
    padding:30px 24px 24px;
  }

  .newsletter-block--split .newsletter-block__icon{
    margin-bottom:20px;
  }

  .newsletter-block--split .newsletter-block__row{
    grid-template-columns:1fr;
  }

  .newsletter-block__preview{
    padding:20px 20px 28px;
  }

  .newsletter-block__preview-heading{
    margin-bottom:10px;
    font-size:.62rem;
  }

  .newsletter-block__preview-stage{
    min-height:220px;
  }

  .newsletter-block__preview-image{
    width:100%;
    max-height:285px;
  }

  .newsletter-block__preview-placeholder{
    min-height:210px;
  }
}

/* ==========================================================
   V5 — PROMOTIONS : CONTRASTE UN PEU PLUS AFFIRMÉ
   N'affecte pas le bloc newsletter des articles.
   ========================================================== */
.newsletter-block--promotions.newsletter-block--split{
  border-color:rgba(21,154,131,.32);
  background:
    radial-gradient(circle at 100% 0,rgba(98,190,175,.22),transparent 34%),
    linear-gradient(135deg,#e5f7f2 0%,#f6fcfa 52%,#e7f7f3 100%);
  box-shadow:0 20px 48px rgba(15,47,51,.11);
}

.newsletter-block--promotions.newsletter-block--split .newsletter-block__preview{
  border-left-color:rgba(21,154,131,.17);
}

@media(max-width:980px){
  .newsletter-block--promotions.newsletter-block--split .newsletter-block__preview{
    border-top-color:rgba(21,154,131,.17);
  }
}

/* ==========================================================
   ARTICLE — LARGEUR IDENTIQUE AU BLOC NEWSLETTER PROMOTIONS
   Le composant sort uniquement de la colonne éditoriale sur
   grand écran ; la mise en page mobile/tablette reste intacte.
   ========================================================== */
@media (min-width:981px){
  .health-article-content > .newsletter-block--split{
    width:min(1180px, calc(100vw - 48px));
    max-width:none;
    margin-left:50%;
    margin-right:0;
    transform:translateX(-50%);
  }
}
