html{overflow-x:clip}
.pleine{width:100vw;margin-left:calc(50% - 50vw);
  --gut:max(clamp(20px,4.5vw,64px),calc((100vw - var(--page-large,1560px))/2))}


.hero{position:relative;height:clamp(500px,74svh,760px);overflow:hidden;background:#101014;
  margin-top:calc(-1 * var(--g20,20px))}
@media(max-width:560px){.hero{margin-top:calc(-1 * var(--e16,16px))}}
.hero .cols{position:absolute;inset:0;display:flex}
.hero .cols>div{position:relative;overflow:hidden;background-color:var(--c);
  background-image:var(--im);background-size:cover;background-position:center;
  background-blend-mode:luminosity}
.hero .cols>div::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.06) 26%,rgba(0,0,0,.12) 46%,rgba(0,0,0,.72) 100%)}

.hero .photo{position:absolute;inset:0;background:var(--im) center/cover no-repeat}
.hero .photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(20,14,6,.62) 0%,rgba(20,14,6,.42) 26%,
    rgba(20,14,6,.14) 48%,transparent 64%),
    linear-gradient(180deg,transparent 42%,rgba(20,14,6,.44) 100%)}

@media(min-width:1100px){.hero .photo{background-image:var(--im-lg,var(--im))}}

@media(min-width:821px){.hero .photo{background-position:right center}}
@media(max-width:820px){
  
  .hero .photo{background-position:72% center}
  
  .hero .photo.a-mobile{background-image:var(--im-mob);background-position:center top}
  .hero .photo::after{background:linear-gradient(180deg,rgba(20,14,6,.30) 0%,
    rgba(20,14,6,.12) 34%,rgba(20,14,6,.74) 100%)}
}
.hero .chead{position:absolute;left:0;right:0;top:clamp(22px,4vh,52px);z-index:3;
  display:flex;justify-content:center;padding:0 8px}
.hero .vname{font-size:var(--t-xxs,11px);font-weight:800;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(255,255,255,.9);white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.hero .content{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;
  justify-content:flex-end;padding:0 var(--gut) clamp(34px,6vh,64px)}
.hero h1{color:#fff;font-family:var(--f-titres),ui-serif,Georgia,serif;font-weight:var(--w-titres-demi,600);
  font-size:clamp(54px,11vw,176px);letter-spacing:-.055em;line-height:.84;margin:0;
  text-shadow:0 6px 40px rgba(0,0,0,.35)}

.hero h1 em{font-style:italic;font-weight:400;margin-right:.12em}
.hero .under{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;
  margin-top:clamp(18px,3vh,34px);flex-wrap:wrap}

.hero .sub{color:rgba(255,255,255,.95);font-size:clamp(16px,1.75vw,24px);line-height:1.35;
  margin:0;max-width:80ch;text-shadow:0 2px 18px rgba(0,0,0,.45);text-wrap:balance}
@media(max-width:640px){.hero .chead .vname{display:none}}


.ctaband{display:flex;gap:14px;flex-wrap:wrap;margin-top:clamp(20px,3.2vh,34px)}

.ctaband a{border-radius:var(--btn-r,30px);display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:var(--gold,#FFC233);color:#101014;padding:19px 38px;font-size:var(--t-sm,13px);
  font-weight:800;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  box-shadow:0 16px 44px -20px rgba(0,0,0,.95);transition:transform .18s}
.ctaband a:hover{transform:translate(2px,-2px)}

.ctaband a.sec{background:transparent;color:#fff;box-shadow:none;
  border:1.5px solid rgba(255,255,255,.85);padding:17.5px 32px}
.ctaband a.sec:hover{background:rgba(255,255,255,.12)}
@media (prefers-reduced-motion:reduce){.ctaband a:hover{transform:none}}
@media(max-width:560px){.ctaband{gap:10px}.ctaband a{flex:1 1 100%;padding:16px 20px;font-size:var(--t-xs,12px)}
  
  .hero .content{padding-bottom:20px}}

.hero .mention{margin:14px 0 0;font-size:var(--t-sm,13px);line-height:1.45;
  color:#fff;opacity:.92;text-shadow:0 2px 12px rgba(0,0,0,.55);max-width:46ch}


.hero.h-haute{height:clamp(560px,86svh,880px)}
.hero.h-basse{height:clamp(360px,52svh,520px)}

.page-corps > .hero:first-child{margin-top:calc(-1 * var(--g20,20px) - var(--blk-pad)*1.5)}


body.bar-on.bar-transparente .hero.sous-barre .photo::after{
  background:linear-gradient(180deg,rgba(20,14,6,.56) 0%,rgba(20,14,6,.52) 13%,
      rgba(20,14,6,.22) 19%,transparent 27%),
    linear-gradient(90deg,rgba(20,14,6,.62) 0%,rgba(20,14,6,.42) 26%,
      rgba(20,14,6,.14) 48%,transparent 64%),
    linear-gradient(180deg,transparent 42%,rgba(20,14,6,.44) 100%)}

body.bar-on.bar-transparente .hero.sous-barre,
body.bar-on.bar-transparente .page-corps > .hero.sous-barre{
  margin-top:calc(-1 * var(--g20,20px))}
@media(max-width:860px){
  
  body.bar-on.bar-transparente .hero.sous-barre .photo::after{background:linear-gradient(180deg,
    rgba(20,14,6,.60) 0%,rgba(20,14,6,.26) 18%,rgba(20,14,6,.12) 38%,rgba(20,14,6,.74) 100%)}
}

@media(max-width:560px){
  body.bar-on.bar-transparente .hero.sous-barre,
  body.bar-on.bar-transparente .page-corps > .hero.sous-barre{
    margin-top:calc(-1 * var(--e16,16px))}
}