*,*::before,*::after{box-sizing:border-box}
:root{color-scheme:light;--rouge:#E0150B;--noir:#101014;--gut:clamp(14px,3vw,28px)}
/* Site EN BOÎTE : un bloc centré de 1240 px sur fond neutre. */
html{margin:0;padding:0;background:#E4E4E9}
body{margin:0 auto;padding:0;max-width:1240px;background:#fff;min-height:100vh;
  box-shadow:0 0 0 1px rgba(16,16,20,.06),0 10px 40px rgba(16,16,20,.12)}
@media (min-width:1300px){body{margin-top:24px;margin-bottom:24px;min-height:0}}
h1,h2,h3,p{overflow-wrap:break-word}
/* ═══════════ SOCLE MAGAZINE — page d'accueil entière ═══════════ */
.cn{padding:0;font-size:14px;line-height:1.45}
.cn .topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;padding:10px clamp(14px,3vw,28px);border-bottom:1px solid}
.cn .masthead{padding:26px clamp(14px,3vw,28px) 18px;text-align:center}
.cn .brand{font-size:clamp(34px,8vw,54px);line-height:1}
.cn .tagline{font-size:11px;letter-spacing:2px;text-transform:uppercase;opacity:.6;margin-top:8px}
.cn .nav{display:flex;flex-wrap:wrap;gap:4px 18px;justify-content:center;font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;padding:12px clamp(14px,3vw,28px);border-top:1px solid;border-bottom:1px solid}
.cn .hero{display:grid;grid-template-columns:1.7fr 1fr;gap:clamp(18px,3vw,34px);padding:clamp(20px,4vw,36px) clamp(14px,3vw,28px)}
.cn .k{font-size:10.5px;letter-spacing:1.8px;text-transform:uppercase}
.cn .hmain h1{font-size:clamp(27px,5.4vw,44px);line-height:1.06;margin:10px 0 12px}
.cn .sf{font-size:15.5px;line-height:1.55;opacity:.85;margin:0 0 12px}
.cn .meta{font-size:11px;opacity:.55}
.cn .hitem{padding:14px 0;border-top:1px solid}
.cn .hitem:first-child{border-top:0;padding-top:0}
.cn .t3{font-size:16px;line-height:1.28;margin:5px 0 6px;font-weight:600}
.cn .band{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:0 clamp(14px,3vw,28px) clamp(20px,4vw,32px)}
.cn .bitem{padding:14px 14px 16px}
.cn .bitem .t3{font-size:14.5px}
.cn .sec{padding:clamp(18px,3.5vw,30px) clamp(14px,3vw,28px)}
.cn .sechead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:16px}
.cn .sechead h2{font-size:19px;margin:0}
.cn .all{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;opacity:.6}
.cn .secgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.5vw,24px)}
.cn .entry h3{font-size:16.5px;line-height:1.25;margin:6px 0 7px}
.cn .x{font-size:13px;line-height:1.5;opacity:.75;margin:0}
.cn .duo{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(18px,3vw,32px);padding:clamp(18px,3.5vw,30px) clamp(14px,3vw,28px)}
.cn .lab{font-size:10.5px;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px}
.cn .edito h3{font-size:21px;line-height:1.2;margin:0 0 8px}
.cn .pop ol{margin:0;padding:0;list-style:none;counter-reset:p}
.cn .pop li{counter-increment:p;display:flex;gap:12px;padding:9px 0;border-top:1px solid;font-size:14px;line-height:1.3;font-weight:600}
.cn .pop li::before{content:counter(p,decimal-leading-zero);font-weight:400;opacity:.45}
.cn .citation{padding:clamp(26px,5vw,44px) clamp(18px,6vw,60px);text-align:center}
.cn .citation blockquote{margin:0;font-size:clamp(20px,4vw,30px);line-height:1.25}
.cn .citation .cite{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;opacity:.55;margin-top:12px}
.cn .nl{padding:clamp(18px,3.5vw,28px) clamp(14px,3vw,28px)}
.cn .nlin{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px}
.cn .nlin h3{margin:0 0 4px;font-size:18px}
.cn .nlin p{margin:0;font-size:13px;opacity:.75}
.cn .form{display:flex;gap:8px}
.cn .field{font-size:12.5px;padding:9px 14px;opacity:.65;min-width:150px}
.cn .btn{font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:9px 16px;font-weight:700}
.cn .footgrand{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:20px;padding:clamp(22px,4vw,34px) clamp(14px,3vw,28px);font-size:12.5px}
.cn .footgrand .brand{font-size:22px}
.cn .footgrand p{font-size:12px;opacity:.7;line-height:1.5;margin:8px 0 0}
.cn .footgrand b{display:block;font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:8px;opacity:.6}
.cn .footgrand span{display:block;padding:3px 0;opacity:.85}
.cn .legal{font-size:10.5px;letter-spacing:.6px;opacity:.55;padding:14px clamp(14px,3vw,28px) 20px;border-top:1px solid}
@media(max-width:640px){
.cn .hero,.cn .duo{grid-template-columns:1fr}
.cn .band,.cn .footgrand{grid-template-columns:1fr 1fr}
.cn .secgrid{grid-template-columns:1fr}
}

/* ═══ 44 · Contre-chant — site ═══ */
.cn{background:#fff;color:var(--noir);font-family:Inter,sans-serif}
.cn a{color:inherit;text-decoration:none}
.cn a:hover h1,.cn a:hover h3,.cn a:hover .t3{color:var(--rouge)}
.cn .topbar,.cn .masthead,.cn .nav,.cn .hero,.cn .band,.cn .sec,.cn .nl,.cn .footgrand,.cn .legal,.cn .abar{padding-left:var(--gut);padding-right:var(--gut)}
.cn .topbar{background:var(--noir);color:#fff;border-color:var(--noir)}
.cn .masthead{position:relative;isolation:isolate;background:var(--noir);color:#fff;text-align:left;padding-bottom:22px}
/* Panorama 5:1 : la ville couvre environ les deux tiers du header. */
.cn .masthead::before{content:"";position:absolute;z-index:-1;pointer-events:none;
  /* toute la hauteur de l'en-tête : du haut du bandeau de date jusqu'au menu */
  top:-36px;bottom:0;right:0;width:74%;
  background:url("/assets/vatican-engraving-v3.webp") right 14px bottom 0/auto 100% no-repeat;opacity:.65;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 98%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 14%,#000 98%,transparent)}
@media(max-width:640px){.cn .masthead::before{top:0;width:70%;background-size:auto 92%;opacity:.3;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 60%);
  mask-image:linear-gradient(to right,transparent,#000 60%)}}
.cn .masthead .brand{display:inline-block}
.cn .brand{font-family:"Barlow Condensed",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:clamp(40px,9vw,64px);line-height:1}
.cn .brand i{font-style:normal;color:var(--rouge)}
.cn .tagline{text-align:left;color:#9b9ba6;opacity:1}
.cn .nav{background:var(--noir);color:#fff;border-color:#2a2a33;justify-content:flex-start;font-weight:600}
.cn .nav>*{white-space:nowrap}
.cn .nav a.on,.cn .nav a:hover{color:var(--rouge)}
.cn .hero{background:var(--noir);color:#fff;padding-top:40px}
.cn .k{color:var(--rouge);font-weight:700}
.cn .hmain h1{font-family:"Barlow Condensed",sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(34px,6vw,58px);letter-spacing:.5px}
.cn .sf{color:#c9c9d4;opacity:1}
.cn .meta{color:#8b8b96;opacity:1}
.cn .hitem{border-color:#2a2a33}
.cn .t3{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:19px;font-weight:600;letter-spacing:.3px}
.cn .band{padding-top:24px}
.cn .bitem{border-top:4px solid var(--rouge);padding:10px 0 0}
.cn .bitem .x{margin-top:6px}
.cn .sechead h2{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-weight:700;font-size:24px}
.cn .all{color:var(--rouge);opacity:1;font-weight:700}
.cn .entry h3{font-weight:700;letter-spacing:-.2px}
.cn .sec{border-top:1px solid #e8e8ee}
.cn .nlin{background:#F2F2F6}
.cn .field{background:#fff;border:1px solid #d8d8e0}
.cn .btn{background:var(--noir);color:#fff}
.cn .footgrand{background:var(--noir);color:#d8d8e0}
.cn .footgrand .brand{font-size:30px}
.cn .footgrand a{display:block;padding:3px 0;opacity:.85}
.cn .footgrand a.brand{opacity:1}
.cn .footgrand{grid-template-columns:1fr auto}
.cn .footgrand .fsec .liens{display:grid;grid-template-columns:repeat(2,auto);grid-template-rows:repeat(5,auto);grid-auto-flow:column;column-gap:48px}
.cn .footgrand .flegal{display:flex;align-items:baseline;gap:10px;margin-top:14px}
.cn .footgrand .flegal span{display:inline;padding:0}
.cn .footgrand .flegal .pt{opacity:.5}
@media(max-width:640px){.cn .footgrand{grid-template-columns:1fr}.cn .footgrand>div{grid-column:1/-1}}
.cn .footgrand a:hover{color:var(--rouge);opacity:1}
.cn .legal{background:var(--noir);color:#8b8b96;border-color:#2a2a33;margin:0}
.cn .abar{background:var(--noir);color:#fff;display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;padding-bottom:12px}
.cn .abar .brand{font-size:34px}
.cn .abar span{color:var(--rouge);font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase}
.cn .art{padding:28px clamp(14px,4vw,48px) 44px;margin:0 auto;max-width:760px}
.cn .art .kick{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--rouge);font-weight:700}
.cn .art h1{font-family:"Barlow Condensed",sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(32px,6vw,52px);letter-spacing:.3px;line-height:1.02;margin:6px 0 12px}
.cn .art .sf{color:#45454f;font-size:19px;line-height:1.45;margin:0 0 10px}
.cn .art .ameta{font-size:11px;letter-spacing:.8px;color:#8b8b96;margin:0 0 22px;text-transform:uppercase}
.cn .art .body p{font-size:17.5px;line-height:1.7;margin:0 0 16px}
.cn .art .body h2{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:24px;font-weight:700;margin:24px 0 8px}
.cn .nextart{display:block;margin-top:30px;border-top:4px solid var(--rouge);padding-top:12px}
.cn .nextart span{display:block;font-size:10px;letter-spacing:1.8px;color:#8b8b96;margin-bottom:4px}
.cn .nextart b{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:24px;line-height:1.1}
.cn .rubpage{padding-top:30px;padding-bottom:40px;border-top:0}
.cn .rubpage .liste .entry{padding:16px 0;border-top:1px solid #e8e8ee;max-width:760px}
.cn .rubpage .liste .entry:first-child{border-top:0}
.cn .rubpage .entry h3{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:26px;margin:0 0 6px}
.cn .rubpage .sechead h2{font-size:38px}
.cn .vide{color:#8b8b96;font-size:15px}
.cn .art .body .video{position:relative;padding-top:56.25%;margin:22px 0}
.cn .art .body .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cn .err{padding:60px var(--gut) 80px}
.cn .err h1{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:48px;margin:0 0 10px}
.cn .footgrand .flegal a{display:inline;padding:0}
.cn .legalpage .lead{font-size:18px;line-height:1.6;color:#45454f}
.cn .legalpage .body h2{font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;font-size:24px;font-weight:700;margin:30px 0 8px}