/* Page Expertise : un bloc plein écran par expertise, photo en fond, qui glisse sur le précédent (même effet que l'accueil).
   Texte dans une carte Noyer (charte) posée sur la photo : rien n'est écrit sur une œuvre. Titres Bodoni Moda, texte Nunito Sans. */
.xp-panel{position:relative;isolation:isolate;overflow:hidden;color:#F6F4EF;background:#4A3B30;padding:clamp(24px,5vh,56px) var(--gutter)}
.xp-panel .xp-bg{position:absolute;inset:0;margin:0;z-index:-1}
.xp-panel .xp-bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.js .panel.xp-panel:not(.flow){align-items:flex-start;justify-content:center}
.js .panel.xp-panel.xp-r:not(.flow){align-items:flex-end}

.xp-copy{width:min(100%,31em);background:#4A3B30;padding:clamp(26px,2.8vw,44px) clamp(26px,3vw,48px);display:grid;gap:0}
.xp-copy>*{margin:0;text-align:left}
.xp-copy .xp-num{opacity:.7;color:#F6F4EF}
.xp-copy .xp-title{margin:14px 0 0;color:#F6F4EF;font-size:clamp(28px,3.1vw,42px);letter-spacing:.05em;line-height:1.1}
.xp-copy .xp-sub{margin:16px 0 0;font:400 clamp(18px,1.5vw,21px)/1.35 var(--f-titre);letter-spacing:.01em}
.xp-copy .xp-lead{margin:14px 0 0;font:300 clamp(15.5px,1.1vw,17px)/1.7 var(--f-texte);hyphens:none}
.xp-copy .xp-points{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid rgba(246,244,239,.3)}
.xp-copy .xp-points li{padding:10px 0;border-bottom:1px solid rgba(246,244,239,.3);font:300 15px/1.5 var(--f-texte);letter-spacing:.02em;text-align:left;hyphens:none}
.xp-copy .xp-cta{margin:26px 0 0}
.xp-copy .xp-cta a{color:#F6F4EF}
.xp-credit{position:absolute;right:var(--gutter);bottom:clamp(14px,2.4vh,24px);margin:0;max-width:46%;text-align:right;font:300 12px/1.5 var(--f-texte);letter-spacing:.04em;color:#F6F4EF;opacity:.85}
.xp-r .xp-credit{right:auto;left:var(--gutter);text-align:left}

@media (max-width:820px){
	.xp-panel{padding:0}
	.js .panel.xp-panel:not(.flow),.js .panel.xp-panel.xp-r:not(.flow){align-items:stretch;justify-content:flex-end}
	.xp-copy{width:100%;margin-top:auto;padding:26px var(--gutter) 40px}
	.xp-credit,.xp-r .xp-credit{left:var(--gutter);right:auto;text-align:left;top:calc(var(--hdr) * 0 + 10px);bottom:auto;max-width:calc(100% - 2 * var(--gutter));color:#F6F4EF}
}
@media (max-width:820px){
	.xp-copy .xp-points{display:none}
	.xp-copy{padding:22px var(--gutter) 30px}
	.xp-copy .xp-title{font-size:clamp(26px,8vw,32px)}
	.xp-copy .xp-lead{font-size:15px;line-height:1.6}
	.xp-copy .xp-cta{margin-top:20px}
}

/* ---- Nouvelle page Expertise : cinq grands carrés (3 + 2) ; un clic ouvre le détail plein écran ---- */
.xp-grid-sec{padding:clamp(24px,4vh,48px) 0 clamp(64px,10vh,120px)}
.xp-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(10px,1.2vw,18px);width:var(--w);max-width:100%;margin:0 auto}
.xp-tile{position:relative;grid-column:span 2;height:clamp(300px,31vw,460px);overflow:hidden;background:#4A3B30;isolation:isolate}
.xp-tile:nth-child(n+4){grid-column:span 3}
.xp-tile figure{position:absolute;inset:0;margin:0;z-index:-1}
.xp-tile figure img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease)}
.xp-tile::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(74,59,48,.82),rgba(74,59,48,.15) 55%,rgba(74,59,48,.1));z-index:0;transition:opacity .6s}
.xp-tile:hover figure img{transform:scale(1.04)}
.xp-tile{display:flex;align-items:flex-end;padding:clamp(18px,2vw,30px)}
.xp-tile .xp-ttl{position:static;margin:0;z-index:1;font:400 clamp(19px,1.9vw,28px)/1.2 var(--f-titre);letter-spacing:.07em;text-transform:uppercase;color:#F6F4EF}
.xp-tile .xp-ttl a{color:inherit;text-decoration:none}
.xp-tile .xp-ttl a::after{content:"";position:absolute;inset:0;z-index:2}
@media (max-width:900px){
	.xp-grid{grid-template-columns:1fr 1fr}
	.xp-tile,.xp-tile:nth-child(n+4){grid-column:span 1;height:clamp(230px,44vw,340px)}
	.xp-tile:nth-child(5){grid-column:span 2}
}
@media (max-width:560px){
	.xp-grid{grid-template-columns:1fr}
	.xp-tile,.xp-tile:nth-child(n+4),.xp-tile:nth-child(5){grid-column:span 1;height:clamp(220px,62vw,300px)}
}

.xp-detail{display:none;position:fixed;inset:0;z-index:1000;overflow:auto;overscroll-behavior:contain;align-items:center;justify-content:flex-start;padding:clamp(24px,5vh,56px) var(--gutter)}
.xp-detail.xp-r{justify-content:flex-end}
.xp-detail:target,.xp-detail.is-open{display:flex;animation:xp-enter .7s var(--ease) both}
@keyframes xp-enter{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
.xp-detail .xp-copy{margin:0}
.xp-closep{position:absolute;top:clamp(14px,2.4vh,26px);right:var(--gutter);margin:0;z-index:2}
.xp-close{display:inline-block;padding:11px 20px;background:#F6F4EF;color:#1A1A1A;font:400 11px/1 var(--f-texte);letter-spacing:.3em;text-transform:uppercase;text-decoration:none}
.xp-close:hover{background:#E6E2DA}
@media (max-width:820px){
	.xp-detail,.xp-detail.xp-r{align-items:stretch;justify-content:flex-end;flex-direction:column;padding:0}
	.xp-detail .xp-copy{margin-top:auto}
	.xp-detail .xp-credit,.xp-detail.xp-r .xp-credit{top:12px;bottom:auto;left:var(--gutter);right:auto;max-width:calc(100% - 140px)}
}
@media (prefers-reduced-motion:reduce){.xp-detail:target,.xp-detail.is-open{animation:none}.xp-tile figure img{transition:none}}

/* ---- Détail d'une expertise, version claire : image d'un côté, texte sur fond papier de l'autre (plus de carte marron sur la photo). ---- */
.xp-detail{background:#F6F4EF;color:#1A1A1A;padding:0}
.xp-detail:target,.xp-detail.is-open{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;align-items:stretch}
.xp-detail .xp-bg{position:static;grid-column:1;grid-row:1;margin:clamp(14px,2vw,28px) 0 0 clamp(14px,2vw,28px);min-height:0;z-index:0}
.xp-detail .xp-bg img{width:100%;height:100%;object-fit:cover}
.xp-detail .xp-credit,.xp-detail.xp-r .xp-credit{position:static;grid-column:1;grid-row:2;max-width:none;margin:0;padding:12px 0 18px clamp(14px,2vw,28px);text-align:left;font:300 12px/1.5 var(--f-texte);letter-spacing:.04em;color:#6B665E;opacity:1}
.xp-detail .xp-copy{grid-column:2;grid-row:1 / 3;align-self:center;width:auto;max-width:34em;margin:0;padding:clamp(28px,5vw,80px);background:transparent;color:#1A1A1A}
.xp-detail .xp-copy,.xp-detail .xp-copy *{color:#1A1A1A}
.xp-detail .xp-copy .xp-num{opacity:.55}
.xp-detail .xp-copy .xp-sub{font-style:normal}
.xp-detail .xp-copy .xp-points{border-top-color:rgba(26,26,26,.2)}
.xp-detail .xp-copy .xp-points li{border-bottom-color:rgba(26,26,26,.2)}
.xp-detail .xp-copy .xp-cta a{border-bottom:1px solid #1A1A1A}
.xp-detail.xp-r:target,.xp-detail.xp-r.is-open{}
.xp-detail.xp-r .xp-bg{grid-column:2;margin:clamp(14px,2vw,28px) clamp(14px,2vw,28px) 0 0}
.xp-detail.xp-r .xp-credit{grid-column:2;padding:12px clamp(14px,2vw,28px) 18px 0}
.xp-detail.xp-r .xp-copy{grid-column:1;justify-self:end}
.xp-detail .xp-close{background:#1A1A1A;color:#F6F4EF!important}
.xp-detail .xp-close:hover{background:#4A3B30}
@media (max-width:820px){
	.xp-detail:target,.xp-detail.is-open,.xp-detail.xp-r:target,.xp-detail.xp-r.is-open{display:flex;flex-direction:column;overflow:auto}
	.xp-detail .xp-bg{order:1;flex:0 0 auto}.xp-detail .xp-credit{order:2}.xp-detail .xp-copy{order:3}
	.xp-detail .xp-bg,.xp-detail.xp-r .xp-bg{display:block;height:44vh;margin:0}
	.xp-detail .xp-credit,.xp-detail.xp-r .xp-credit{padding:10px var(--gutter) 0}
	.xp-detail .xp-copy,.xp-detail.xp-r .xp-copy{max-width:none;padding:22px var(--gutter) 40px}
	.xp-detail .xp-copy .xp-points{display:block}
	.xp-detail .xp-closep{position:fixed;top:12px;right:12px}
}

/* Lien « Discuss this expertise » : lisible sur le fond clair (il était écrit en blanc sur blanc, seul le trait se voyait). */
.xp-detail .xp-copy .xp-cta a{color:#1A1A1A;border-bottom:1px solid #1A1A1A;padding-bottom:5px;text-decoration:none}
.xp-detail .xp-copy .xp-cta a:hover{opacity:.6}
