/* ==========================================================================
   Perspectives Mosaïca — feuille de style dédiée
   Réutilise les variables et classes globales (styles.css, mckinsey.css) :
   .wrap, .wrap-narrow, .pad, .tag-cat, .btn-gold, .btn-outline, .nl-band.
   Aucune mosaïque décorative ici : la mosaïque n'apparaît que dans le hero
   (assets/service-hero-premium.css, variante .shp--perspectives).
   ========================================================================== */

.psp-page{background:#fff}

/* ---- Navigation éditoriale sticky ---- */
.psp-subnav{
  position:sticky;top:var(--nav-h,68px);z-index:80;
  background:#fff;border-bottom:1px solid #e8ecf0;
  box-shadow:0 2px 10px rgba(1,46,74,.05);
}
.psp-subnav-inner{
  max-width:1180px;margin:0 auto;padding:0 1.5rem;
  display:flex;gap:1.9rem;overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;-ms-overflow-style:none;
}
.psp-subnav-inner::-webkit-scrollbar{display:none}
.psp-subnav a{
  flex:0 0 auto;padding:.95rem 0;white-space:nowrap;text-decoration:none;
  font:600 .8rem/1 'Space Grotesk',sans-serif;letter-spacing:.02em;
  color:var(--gray6);border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease;
}
.psp-subnav a:hover{color:var(--navy)}
.psp-subnav a.is-active{color:var(--navy);border-bottom-color:var(--gold)}

/* ---- Ouverture éditoriale ---- */
.psp-intro{background:var(--sable,#F3F6F8)}
.psp-intro-inner{max-width:760px;margin:0 auto;text-align:left}
.psp-intro h2{
  font-family:'Ibarra Real Nova',serif;font-size:clamp(1.6rem,3.2vw,2.35rem);
  color:var(--navy-deep,#0a3850);line-height:1.28;margin:0 0 1.4rem;font-weight:700;
}
.psp-intro p{color:var(--gray8);font-size:1.02rem;line-height:1.85;margin:0 0 1.5rem}
.psp-intro-sig{font-size:.82rem;color:var(--gray6);font-style:italic}

/* ---- À la une : composition asymétrique ---- */
.psp-featured-grid{display:grid;grid-template-columns:1.9fr 1fr;gap:clamp(1.75rem,4vw,3rem);align-items:start}
.psp-featured-main{display:block;text-decoration:none;color:inherit}
.psp-featured-media{position:relative;overflow:hidden;background:var(--gray2);aspect-ratio:16/10}
.psp-featured-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.psp-featured-main:hover .psp-featured-media img{transform:scale(1.03)}
.psp-featured-status{
  position:absolute;left:0;bottom:0;background:var(--navy-deep);color:#fff;
  font:700 .68rem/1 'Space Grotesk',sans-serif;letter-spacing:.08em;text-transform:uppercase;
  padding:.55rem .9rem;
}
.psp-featured-body{padding-top:1.4rem}
.psp-meta-row{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;margin-bottom:.85rem}
.psp-featured-body h3{
  font-family:'Ibarra Real Nova',serif;font-size:clamp(1.5rem,3vw,2.3rem);
  line-height:1.15;color:var(--navy-deep);margin:0 0 .9rem;font-weight:700;
}
.psp-featured-body p{color:var(--gray6);font-size:.98rem;line-height:1.7;margin:0 0 1rem;max-width:640px}
.psp-featured-meta{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.76rem;color:var(--gray6)}
.psp-featured-meta span{position:relative}
.psp-featured-meta span+span::before{content:'·';position:absolute;left:-.65rem}

.psp-side{display:flex;flex-direction:column;gap:1.6rem}
.psp-side-card{display:flex;gap:1rem;text-decoration:none;color:inherit;align-items:flex-start;padding-bottom:1.6rem;border-bottom:1px solid #eceff2}
.psp-side:last-child .psp-side-card:last-child{border-bottom:0;padding-bottom:0}
.psp-side-media{flex:0 0 104px;width:104px;height:78px;overflow:hidden;background:var(--gray2)}
.psp-side-media img{width:100%;height:100%;object-fit:cover;display:block}
.psp-side-body h4{font-family:'Ibarra Real Nova',serif;font-size:1rem;line-height:1.32;color:var(--navy);margin:.15rem 0 .35rem;font-weight:700}
.psp-side-body span{font-size:.72rem;color:var(--gray6)}

/* ---- Analyses Mosaïca ---- */
.psp-section-head{max-width:700px;margin:0 0 2.5rem}
.psp-section-head h2{font-family:'Ibarra Real Nova',serif;font-size:clamp(1.7rem,3.4vw,2.5rem);color:var(--navy-deep);margin:.6rem 0 .9rem;line-height:1.16}
.psp-section-head p{color:var(--gray6);font-size:1rem;line-height:1.75;margin:0}
.psp-analysis-card{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;text-decoration:none;color:inherit}
.psp-analysis-media{overflow:hidden;background:var(--gray2);aspect-ratio:16/10}
.psp-analysis-media img{width:100%;height:100%;object-fit:cover;display:block}
.psp-analysis-body h3{font-family:'Ibarra Real Nova',serif;font-size:clamp(1.3rem,2.6vw,1.85rem);color:var(--navy-deep);line-height:1.22;margin:.8rem 0 .9rem}
.psp-analysis-body p{color:var(--gray6);font-size:.97rem;line-height:1.75;margin:0 0 1.1rem}
.psp-status-pill{
  display:inline-block;font:700 .68rem/1 'Space Grotesk',sans-serif;letter-spacing:.08em;text-transform:uppercase;
  padding:.4rem .7rem;border:1px solid var(--gold);color:var(--gold-dark,#A9803F);
}

/* ---- Chroniques : bandeau d'ouverture + mosaïque (chroniques.css) ---- */
.psp-chr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.25rem}
.psp-chr-head .psp-section-head{margin-bottom:0}
.psp-chr-all{flex:0 0 auto;font:600 .82rem/1 'Space Grotesk',sans-serif;color:var(--navy);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:.2rem;white-space:nowrap}

/* ---- Études de cas : composition éditoriale, pas une grille uniforme ---- */
.psp-etudes-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.5rem}
.psp-etude{grid-column:span 3;display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff}
.psp-etude--lg{grid-column:span 6}
.psp-etude--lg .psp-etude-inner{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;align-items:center}
.psp-etude-media{overflow:hidden;background:var(--gray2);aspect-ratio:16/10}
.psp-etude--lg .psp-etude-media{aspect-ratio:auto;height:100%;min-height:260px}
.psp-etude-media img{width:100%;height:100%;object-fit:cover;display:block}
.psp-etude h3{font-family:'Ibarra Real Nova',serif;font-size:1.15rem;line-height:1.3;color:var(--navy);margin:1rem 0 .6rem}
.psp-etude--lg h3{font-size:clamp(1.4rem,2.6vw,1.9rem)}
.psp-etude p{color:var(--gray6);font-size:.92rem;line-height:1.65;margin:0 0 .7rem}
.psp-etude-link{font-size:.78rem;font-weight:700;color:var(--navy);border-bottom:1px solid var(--gold);align-self:flex-start;padding-bottom:.15rem}

/* ---- Le Cahier Mosaïca ---- */
.psp-cahier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;border-top:1px solid #eceff2;border-left:1px solid #eceff2}
.psp-cahier-card{padding:2rem 1.75rem;border-right:1px solid #eceff2;border-bottom:1px solid #eceff2;min-height:230px;display:flex;flex-direction:column}
.psp-cahier-card .psp-status-pill{align-self:flex-start;margin-bottom:1.1rem}
.psp-cahier-card h3{font-family:'Ibarra Real Nova',serif;font-size:1.15rem;line-height:1.3;color:var(--navy);margin:0 0 .7rem}
.psp-cahier-card p{color:var(--gray6);font-size:.9rem;line-height:1.65;margin:0}

/* ---- Questions suivies : typographique, sans icônes ---- */
.psp-questions{background:var(--navy-deep,#0a3850);color:#fff}
.psp-questions .psp-section-head h2{color:#fff}
.psp-questions .psp-section-head p{color:rgba(255,255,255,.72)}
.psp-questions-list{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid rgba(255,255,255,.16)}
.psp-questions-list span{
  padding:1.4rem 1.5rem 1.4rem 0;border-bottom:1px solid rgba(255,255,255,.16);
  font-family:'Ibarra Real Nova',serif;font-size:clamp(1.1rem,1.8vw,1.4rem);line-height:1.3;
}
.psp-questions-list span:nth-child(odd){border-right:1px solid rgba(255,255,255,.16);padding-right:1.5rem}
.psp-questions-list span:nth-child(even){padding-left:1.5rem}

/* ---- Les voix de Mosaïca ---- */
.psp-voix-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2.5rem}
.psp-voix-card{display:flex;gap:1.4rem;align-items:flex-start}
.psp-voix-photo{flex:0 0 84px;width:84px;height:84px;border-radius:50%;overflow:hidden;background:var(--gray2)}
.psp-voix-photo img{width:100%;height:100%;object-fit:cover;display:block}
.psp-voix-body h3{font-family:'Ibarra Real Nova',serif;font-size:1.2rem;color:var(--navy);margin:0 0 .2rem}
.psp-voix-role{display:block;font-size:.8rem;color:var(--gold-dark,#A9803F);font-weight:700;margin-bottom:.6rem}
.psp-voix-body p{color:var(--gray6);font-size:.9rem;line-height:1.65;margin:0 0 .7rem}
.psp-voix-count{font-size:.78rem;color:var(--gray6)}
.psp-voix-link{display:inline-block;margin-top:.5rem;font-size:.8rem;font-weight:700;color:var(--navy);border-bottom:1px solid var(--gold);text-decoration:none}

/* ---- Infolettre Perspectives (fond bleu profond) ---- */
.psp-nl{background:var(--navy-deep,#0a3850);color:#fff}
.psp-nl .psp-nl-inner{max-width:640px;margin:0 auto;text-align:center}
.psp-nl h2{font-family:'Ibarra Real Nova',serif;font-size:clamp(1.5rem,3vw,2.1rem);color:#fff;margin:.6rem 0 .8rem}
.psp-nl p{color:rgba(255,255,255,.78);font-size:.98rem;line-height:1.7;margin:0}
.psp-nl .nl-form input{border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff}
.psp-nl .nl-form input::placeholder{color:rgba(255,255,255,.55)}
.psp-nl-fine{margin-top:1.1rem;font-size:.74rem;color:rgba(255,255,255,.5)}
.psp-nl-fine a{color:rgba(255,255,255,.75)}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:980px){
  .psp-featured-grid{grid-template-columns:1fr}
  .psp-side{flex-direction:row;overflow-x:auto;gap:1.25rem}
  .psp-side-card{flex:0 0 260px;border-bottom:0}
  .psp-analysis-card{grid-template-columns:1fr}
  .psp-etude--lg .psp-etude-inner{grid-template-columns:1fr}
  .psp-cahier-grid{grid-template-columns:repeat(2,1fr)}
  .psp-voix-grid{grid-template-columns:1fr;gap:1.75rem}
}
@media (max-width:640px){
  .psp-etudes-grid{grid-template-columns:1fr}
  .psp-etude{grid-column:span 1!important}
  .psp-cahier-grid{grid-template-columns:1fr}
  .psp-questions-list{grid-template-columns:1fr}
  .psp-questions-list span:nth-child(odd){border-right:0}
  .psp-questions-list span{padding-left:0!important;padding-right:0!important}
  .psp-chr-head{flex-direction:column;align-items:flex-start}
}
