/* Runa — styles propres à : la page Questions. Chargé après commun.css ; mêmes couches. */
@layer pages{
  html.rn-anim body,html.rn-anim body *:not(.rn-th *){transition:background-color .2s ease,border-color .2s ease,color .2s ease}
  body{margin:0;background:var(--bg)}
  a,button{-webkit-tap-highlight-color:transparent}
  .rn-back .rn-lab{animation:rnfade .4s ease}
  @keyframes rnfade{from{opacity:0}}
  @media (prefers-reduced-motion:reduce){
    .rn-back .rn-lab{animation:none}
  }
  @media (max-width:899px) and (orientation:portrait){
    .rn-glass{display:block;position:fixed;left:0;right:0;bottom:0;top:var(--gt,100vh);z-index:1;pointer-events:none;opacity:var(--go,0);background:rgba(20,22,18,.42);-webkit-backdrop-filter:blur(20px) saturate(1.15);backdrop-filter:blur(20px) saturate(1.15)}
  }
  .p-faq > body{background:#20160D}
  .faq-feat{position:fixed;inset:0;z-index:0;pointer-events:none}
  .faq-feat > div{position:absolute;inset:0}
  .faq-feat::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,10,8,.22) 0%,rgba(12,10,8,.1) 40%,rgba(12,10,8,0) 52%)}
  .faqp{position:relative;z-index:2;min-height:0!important;background:transparent!important;--bg:transparent;--ink:#F2F0E6;--muted:#E2DDCA;--line:rgba(242,240,230,.3);--ring:rgba(242,240,230,.6);--accent:#F3C1BF;color:#F2F0E6!important;text-shadow:0 1px 3px rgba(0,0,0,.5),0 0 24px rgba(0,0,0,.35)}
  .faqp > header{position:fixed;top:0;left:0;right:0;z-index:40}
  .faqp > header,.faqp > header a{color:#F2F0E6!important}
  .faqp > header nav{transition:opacity .3s,visibility .3s}
  .faqp > header.sc nav{opacity:0;visibility:hidden}
  .faqp .rn-th,.p-faq > body .runa-bar{display:none}
  .faqp main h1{color:#E2DDCA!important}
  .p-faq > body .rn-foot{position:relative;z-index:2;background:transparent;color:rgba(242,240,230,.75);text-shadow:0 1px 3px rgba(0,0,0,.5)}
  .rn-glass{display:none}
  @media (min-width:701px) and (min-aspect-ratio:5/4){
    .faqp main,.p-faq > body .rn-foot{margin-right:max(52vw,calc(76vh + 24px))}
    .faqp main{padding:calc(100vh * 197 / 900 - 120px) 2vw 80px 7vw!important;flex-direction:column;flex-wrap:nowrap!important}
    .faqp main > *{flex:0 0 auto!important}
  }
  @media (max-width:700px),(max-aspect-ratio:1249/1000){
    .faq-feat::after{display:none}
    .faqp main{padding-top:28px!important}
    .rn-glass{display:block;position:fixed;left:0;right:0;bottom:0;top:var(--gt,100vh);z-index:1;pointer-events:none;background:rgba(20,22,18,.42);-webkit-backdrop-filter:blur(20px) saturate(1.15);backdrop-filter:blur(20px) saturate(1.15)}
  }
  .p-faq > body .rn-glass{opacity:var(--go,0)}
  @media (min-width:701px) and (min-aspect-ratio:5/4){
    .p-faq > body .rn-foot .rn-foot-in{padding-left:7vw}
  }
  .p-faq > body .rn-foot-in{color:rgba(242,240,230,.78);border-top-color:rgba(242,240,230,.3)}
  @media (min-width:701px) and (max-aspect-ratio:1249/1000){
    .p-faq > body{background:transparent}
    .faq-feat > div{inset:0 auto auto 50%;width:min(100vw,46vh);height:calc(min(100vw,46vh) * 2.2133);transform:translateX(-50%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent)}
    .faqp main{padding-left:44px!important;padding-right:44px!important}
  }
  .faqp{padding-top:174px}
  @media (max-width:700px),(max-aspect-ratio:1249/1000){
    .faqp main{margin-top:calc(max(100vw, 100vh * 900 / 1992) * 1230 / 900 - 162px)}
  }
  @media (min-width:701px) and (max-aspect-ratio:1249/1000){
    .faqp main{margin-top:calc(min(100vw, 46vh) * 1230 / 900 - 162px)}
    html.p-faq body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:#3a2a1c url(../img/bois-n5.webp) 50% 50%/cover no-repeat}
  }
  @media (max-resolution:1dppx) and (max-width:1920px) and (max-height:950px) and (min-width:701px){
    html.p-faq body::before{background-image:url(../img/bois-n5-1920.webp)}
  }
}
@layer retouches{
  .faq-feat img{width:100%;height:100%;object-fit:cover;object-position:100% 50%;display:block}
  .faqp main a{color:#F2F0E6}
  .p-faq > body .rn-foot a{color:rgba(242,240,230,.75)}
  @media (max-width:700px),(max-aspect-ratio:1249/1000){
    .faq-feat img{object-position:50% 0%}
  }
  .rn-book:hover{background:var(--runa-rouge-survol)}
}
