@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,600&family=IBM+Plex+Mono:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

/* =============================================================
   EXPÉRIENCE PARANORMALE — REBORN 2026
   DA globale : archives nocturnes / enquête de terrain / signal spectral
   ============================================================= */
:root{
  --ep-r-bg:#050707;
  --ep-r-bg2:#09100f;
  --ep-r-panel:rgba(10,15,14,.78);
  --ep-r-panel-strong:rgba(9,13,12,.94);
  --ep-r-paper:#eee9df;
  --ep-r-muted:#a8aaa5;
  --ep-r-green:#78d2b4;
  --ep-r-green-hi:#b7f0da;
  --ep-r-amber:#d0a46d;
  --ep-r-violet:#8c74aa;
  --ep-r-red:#b64851;
  --ep-r-line:rgba(219,230,223,.12);
  --ep-r-line-strong:rgba(120,210,180,.26);
  --ep-r-shadow:0 26px 80px rgba(0,0,0,.38);
  --ep-r-radius:18px;
}

html.ep-reborn{background:#050707;color-scheme:dark}
html.ep-reborn body{
  min-height:100vh;
  color:var(--ep-r-paper)!important;
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif!important;
  background-color:var(--ep-r-bg)!important;
}

/* Fond animé — volontairement 100% CSS pour rester léger. */
html.ep-reborn:not([class*="ep-theme-"]) body{
  background-image:
    radial-gradient(58rem 42rem at 9% 4%,rgba(82,161,137,.18),transparent 68%),
    radial-gradient(52rem 38rem at 91% 8%,rgba(140,116,170,.14),transparent 66%),
    radial-gradient(45rem 34rem at 68% 88%,rgba(208,164,109,.09),transparent 70%),
    linear-gradient(rgba(115,189,166,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(115,189,166,.022) 1px,transparent 1px),
    linear-gradient(180deg,#050706 0%,#07100e 48%,#050607 100%)!important;
  background-size:125% 125%,130% 130%,125% 125%,58px 58px,58px 58px,100% 100%!important;
  background-attachment:fixed!important;
  animation:ep-r-haunt 22s ease-in-out infinite alternate!important;
}
@keyframes ep-r-haunt{
  0%{background-position:-10% -6%,110% -2%,70% 112%,0 0,0 0,0 0}
  45%{background-position:4% 8%,95% 12%,58% 94%,18px 8px,18px 8px,0 0}
  100%{background-position:16% -2%,80% 2%,78% 88%,42px 18px,42px 18px,0 0}
}
/* Pellicule/scan très subtile au-dessus du décor. */
html.ep-reborn:not([class*="ep-theme-"]) body::before{
  content:""!important;position:fixed!important;inset:0!important;z-index:2147483000!important;pointer-events:none!important;
  opacity:.055!important;background:
    repeating-linear-gradient(180deg,rgba(255,255,255,.07) 0,rgba(255,255,255,.07) 1px,transparent 1px,transparent 4px),
    radial-gradient(circle at 50% 45%,transparent 35%,rgba(0,0,0,.38) 100%)!important;
  mix-blend-mode:soft-light;animation:ep-r-scan 8s linear infinite!important;
}
@keyframes ep-r-scan{0%{transform:translateY(0)}100%{transform:translateY(4px)}}

html.ep-reborn ::selection{background:rgba(120,210,180,.9);color:#04110d}
html.ep-reborn :where(h1,h2,h3,.section-title,.v3-hero h1,.ep-page-intro h1){font-family:'Cormorant Garamond',Georgia,serif!important;letter-spacing:-.025em}
html.ep-reborn :where(.kicker,.eyebrow,.v3-kicker,.ep-page-kicker,.section-label,.tag,.sec-num){font-family:'IBM Plex Mono',monospace!important;letter-spacing:.14em;text-transform:uppercase}

/* -------- NAVIGATION : barre d'archive compacte et très reconnaissable -------- */
html.ep-reborn #epGlobalHeader{
  background:rgba(5,8,8,.88)!important;border-bottom:1px solid rgba(120,210,180,.18)!important;
  box-shadow:0 18px 60px rgba(0,0,0,.34)!important;backdrop-filter:blur(22px) saturate(128%)!important;
}
html.ep-reborn #epGlobalHeader::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(120,210,180,.55),rgba(208,164,109,.35),transparent);opacity:.55}
html.ep-reborn #epGlobalHeader .ep-brand img{filter:drop-shadow(0 0 13px rgba(120,210,180,.16))}
html.ep-reborn #epGlobalHeader .ep-brand-text strong{font-family:'Cormorant Garamond',serif!important;font-size:1.32rem!important;color:#f0ece3!important}
html.ep-reborn #epGlobalHeader .ep-brand-text small{color:#7f9d93!important;font:600 .56rem 'IBM Plex Mono',monospace!important;letter-spacing:.13em!important;text-transform:uppercase}
html.ep-reborn #epGlobalHeader .ep-shell-nav a{border:1px solid transparent!important;border-radius:8px!important;background:transparent!important;color:#aaaead!important;transition:.2s ease!important}
html.ep-reborn #epGlobalHeader .ep-shell-nav a:hover,
html.ep-reborn #epGlobalHeader .ep-shell-nav a.is-active{color:#e8f5ef!important;background:rgba(120,210,180,.065)!important;border-color:rgba(120,210,180,.19)!important;box-shadow:inset 0 0 20px rgba(120,210,180,.025)}
html.ep-reborn #epGlobalHeader .ep-register{background:linear-gradient(135deg,#cba06a,#9f6f43)!important;color:#130e08!important;border:0!important;box-shadow:0 10px 28px rgba(172,116,62,.2)!important}
html.ep-reborn #epGlobalHeader .ep-search-link,
html.ep-reborn #epGlobalHeader .ep-notif-button{background:rgba(255,255,255,.025)!important;border-color:rgba(219,230,223,.1)!important}

/* -------- HERO / PRÉSENTATION DES PAGES -------- */
html.ep-reborn .ep-page-intro,
html.ep-reborn .v3-hero{
  position:relative!important;isolation:isolate;overflow:hidden!important;
  border:1px solid rgba(120,210,180,.17)!important;border-radius:20px!important;
  background:
    linear-gradient(105deg,rgba(10,18,16,.96) 0%,rgba(9,12,12,.88) 56%,rgba(19,15,21,.88) 100%)!important;
  box-shadow:0 30px 88px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025)!important;
}
html.ep-reborn .ep-page-intro{padding:clamp(32px,6vw,72px) clamp(22px,5vw,58px)!important}
html.ep-reborn .ep-page-intro::before,
html.ep-reborn .v3-hero::before{
  content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none;
  background:
   linear-gradient(90deg,rgba(120,210,180,.08) 1px,transparent 1px),
   linear-gradient(rgba(120,210,180,.06) 1px,transparent 1px),
   radial-gradient(34rem 18rem at 82% 8%,rgba(140,116,170,.22),transparent 70%)!important;
  background-size:40px 40px,40px 40px,auto!important;
  mask-image:linear-gradient(90deg,transparent 35%,#000 100%);
}
html.ep-reborn .ep-page-intro::after,
html.ep-reborn .v3-hero::after{
  content:"EP // ARCHIVES DE L'INEXPLIQUÉ"!important;position:absolute!important;right:22px!important;bottom:18px!important;
  width:auto!important;height:auto!important;background:none!important;border:0!important;
  color:rgba(120,210,180,.38)!important;font:600 .56rem 'IBM Plex Mono',monospace!important;letter-spacing:.18em!important;text-transform:uppercase;
}
html.ep-reborn .ep-page-kicker,
html.ep-reborn .v3-kicker{color:var(--ep-r-green)!important;font-size:.66rem!important}
html.ep-reborn .ep-page-kicker::before{width:42px!important;background:linear-gradient(90deg,var(--ep-r-green),transparent)!important}
html.ep-reborn .ep-page-intro h1,
html.ep-reborn .v3-hero h1{color:#f3eee6!important;font-size:clamp(2.7rem,7vw,5.9rem)!important;line-height:.92!important;font-weight:600!important;text-wrap:balance}
html.ep-reborn .ep-page-intro .ep-page-subline,
html.ep-reborn .v3-hero p{color:#a7b0ab!important;max-width:76ch!important;line-height:1.72!important}
html.ep-reborn .ep-page-signal{color:#83ab9c!important}
html.ep-reborn .ep-page-signal::before{color:#79d5b6!important;animation:ep-r-pulse 1.8s ease-in-out infinite}
@keyframes ep-r-pulse{50%{opacity:.35;text-shadow:0 0 18px rgba(120,210,180,.8)}}

/* -------- SECTIONS, CARTES, BLOCS : véritable langage visuel commun -------- */
html.ep-reborn main :where(.block,.wrap,.panel,.card,.box,.section-card,.content-card,.community-card,.service-card,.grade-plan,.staff-card,.member-card,.review-card,.update-card,.story-card,.game-card,.bep-card,.home-activity-card,.field){
  border-color:rgba(219,230,223,.11)!important;
  background:linear-gradient(155deg,rgba(12,18,17,.86),rgba(8,10,10,.78))!important;
  box-shadow:0 18px 50px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.022)!important;
}
html.ep-reborn main :where(.card,.community-card,.service-card,.grade-plan,.staff-card,.member-card,.review-card,.update-card,.story-card,.game-card,.bep-card){
  position:relative;overflow:hidden;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}
html.ep-reborn main :where(.card,.community-card,.service-card,.grade-plan,.staff-card,.member-card,.review-card,.update-card,.story-card,.game-card,.bep-card)::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent,var(--ep-r-green),transparent);opacity:.34;pointer-events:none
}
@media(hover:hover){
 html.ep-reborn main :where(.card,.community-card,.service-card,.grade-plan,.staff-card,.member-card,.review-card,.update-card,.story-card,.game-card,.bep-card):hover{
   transform:translateY(-3px);border-color:rgba(120,210,180,.25)!important;box-shadow:0 25px 65px rgba(0,0,0,.3),0 0 0 1px rgba(120,210,180,.035)!important
 }
}
html.ep-reborn main :where(h2,.section-title){color:#eeeae2!important}
html.ep-reborn main :where(.sub,.lede,.lead,.meta,.dim,.muted){color:#9fa7a3!important}
html.ep-reborn main :where(.kicker,.eyebrow,.tag,.section-label,.sec-num){color:var(--ep-r-green)!important}
html.ep-reborn main hr{border-color:rgba(219,230,223,.09)!important}

/* Titres de section avec ligne de signal */
html.ep-reborn main .sec-head,
html.ep-reborn main .v3-section-head{position:relative;padding-bottom:14px;border-bottom:1px solid rgba(219,230,223,.10)}
html.ep-reborn main .sec-head::after,
html.ep-reborn main .v3-section-head::after{content:"";position:absolute;left:0;bottom:-1px;width:min(180px,34%);height:1px;background:linear-gradient(90deg,var(--ep-r-green),transparent)}

/* -------- BOUTONS / FORMULAIRES -------- */
html.ep-reborn main :where(.btn,.v3-btn,button[type="submit"]){border-radius:8px!important;font-weight:800!important;letter-spacing:.015em!important}
html.ep-reborn main :where(.btn:not(.ghost),.v3-btn.primary,button[type="submit"]){background:linear-gradient(135deg,#75ceb0,#4d9f87)!important;color:#04110d!important;border-color:rgba(155,239,211,.3)!important;box-shadow:0 10px 28px rgba(60,145,118,.14)!important}
html.ep-reborn main :where(.btn.ghost,.v3-btn:not(.primary)){background:rgba(255,255,255,.035)!important;color:#dfe8e3!important;border-color:rgba(219,230,223,.12)!important}
html.ep-reborn main :where(input,select,textarea){background:rgba(4,7,7,.72)!important;border-color:rgba(219,230,223,.13)!important;color:#eeeae2!important;border-radius:9px!important}
html.ep-reborn main :where(input,select,textarea):focus{outline:0!important;border-color:rgba(120,210,180,.58)!important;box-shadow:0 0 0 3px rgba(120,210,180,.09),0 0 28px rgba(120,210,180,.05)!important}

/* -------- ACCUEIL : changement visible sans modifier les contenus -------- */
html.ep-reborn body.home-editorial .hero{position:relative}
html.ep-reborn body.home-editorial .hero h1{font-family:'Cormorant Garamond',serif!important;font-size:clamp(4rem,10vw,9rem)!important;line-height:.82!important;text-shadow:0 12px 48px rgba(0,0,0,.38)}
html.ep-reborn body.home-editorial .hero h1 em{color:var(--ep-r-green-hi)!important;font-style:italic!important;text-shadow:0 0 34px rgba(120,210,180,.13)}
html.ep-reborn body.home-editorial .hero .lede{color:#abb4af!important;max-width:67ch!important}
html.ep-reborn body.home-editorial .atmos{background:transparent!important}
html.ep-reborn body.home-editorial .field{border-radius:14px!important}
html.ep-reborn body.home-editorial .section-title em{color:var(--ep-r-green-hi)!important}

/* -------- PAGES V3 -------- */
html.ep-reborn body.v3-page{background:transparent!important}
html.ep-reborn .v3-shell{padding-top:34px!important}
html.ep-reborn .v3-card{border-color:var(--ep-r-line)!important;background:linear-gradient(145deg,rgba(12,18,17,.88),rgba(8,10,10,.8))!important}
html.ep-reborn .v3-notice{background:rgba(120,210,180,.055)!important;border-color:rgba(120,210,180,.19)!important;color:#b9c9c2!important}

/* -------- TABLEAU DES GRADES : correction structurelle + mobile -------- */
html.ep-reborn .grade-matrix{overflow:auto!important;border:1px solid rgba(120,210,180,.16)!important;border-radius:18px!important;background:rgba(5,8,8,.78)!important;box-shadow:0 20px 56px rgba(0,0,0,.22)!important;scrollbar-color:rgba(120,210,180,.45) rgba(255,255,255,.025)}
html.ep-reborn .grade-matrix-inner{min-width:1010px!important}
html.ep-reborn .grade-matrix-head,
html.ep-reborn .grade-head-row,
html.ep-reborn .grade-row{display:grid!important;grid-template-columns:minmax(245px,1.55fr) repeat(6,minmax(115px,1fr))!important}
html.ep-reborn .grade-matrix-head{position:sticky!important;top:0!important;z-index:8!important;background:#0b1110!important;border-bottom:1px solid rgba(120,210,180,.22)!important;box-shadow:0 10px 25px rgba(0,0,0,.2)}
html.ep-reborn .grade-matrix-head>div,
html.ep-reborn .grade-head-row>div,
html.ep-reborn .grade-row>div{min-width:0!important;padding:13px 10px!important;text-align:center!important;display:grid!important;place-items:center!important;border-right:1px solid rgba(219,230,223,.055)!important}
html.ep-reborn .grade-matrix-head>div:first-child,
html.ep-reborn .grade-head-row>div:first-child,
html.ep-reborn .grade-row>div:first-child{text-align:left!important;place-items:center start!important}
html.ep-reborn .grade-matrix-head>div{font:700 .7rem 'IBM Plex Mono',monospace!important;letter-spacing:.055em!important;text-transform:uppercase!important;color:#b9c2bd!important}
html.ep-reborn .grade-matrix-head .minivip{color:#d7aaff!important}
html.ep-reborn .grade-matrix-head .vip{color:#ffe183!important}
html.ep-reborn .grade-matrix-head .vipplus{color:#76c8ff!important}
html.ep-reborn .grade-matrix-head .mvp{color:#ffab63!important}
html.ep-reborn .grade-matrix-head .mvpplus{color:#75e39d!important}
html.ep-reborn .grade-row{border-bottom:1px solid rgba(219,230,223,.075)!important;background:rgba(255,255,255,.006)}
html.ep-reborn .grade-row:nth-of-type(even){background:rgba(255,255,255,.013)}
html.ep-reborn .grade-category{position:relative!important;padding:12px 16px!important;background:linear-gradient(90deg,rgba(120,210,180,.10),rgba(120,210,180,.015))!important;color:#a9e2cf!important;border-bottom:1px solid rgba(120,210,180,.15)!important;font:700 .72rem 'IBM Plex Mono',monospace!important;letter-spacing:.055em!important;text-transform:uppercase}
html.ep-reborn .grade-feature-title{color:#eee9e1!important}
html.ep-reborn .grade-feature-title small{color:#8f9a95!important}
html.ep-reborn .grade-scroll-tip{display:flex!important;align-items:center;gap:8px;color:#92a29b!important;font-size:.8rem!important;margin:16px 0 10px!important}
html.ep-reborn .grade-scroll-tip::before{content:"↔";color:var(--ep-r-green);font:700 1rem 'IBM Plex Mono',monospace}

/* Cartes grades — plus contrastées et premium */
html.ep-reborn .grade-plan{border-radius:16px!important;min-height:0!important}
html.ep-reborn .grade-plan::before{width:100%!important;height:2px!important;left:0!important;top:0!important;bottom:auto!important;opacity:1!important;background:linear-gradient(90deg,transparent,var(--grade,#8aa),transparent)!important}
html.ep-reborn .grade-plan-name{font-size:1.75rem!important}
html.ep-reborn .grade-plan-price{font-family:'IBM Plex Mono',monospace!important;font-size:1.55rem!important}
html.ep-reborn .grade-quick-pick{border-color:rgba(120,210,180,.13)!important;background:linear-gradient(145deg,rgba(10,16,15,.88),rgba(8,10,10,.8))!important;border-radius:18px!important}
html.ep-reborn .grade-quick-grid a{border-radius:12px!important;background:rgba(255,255,255,.022)!important;border-color:rgba(219,230,223,.09)!important}
html.ep-reborn .grade-quick-grid a:hover{border-color:rgba(120,210,180,.28)!important;background:rgba(120,210,180,.045)!important}

/* -------- FOOTER -------- */
html.ep-reborn #epGlobalFooter{background:rgba(4,6,6,.94)!important;border-top:1px solid rgba(120,210,180,.16)!important;box-shadow:0 -20px 60px rgba(0,0,0,.24)!important}
html.ep-reborn #epGlobalFooter .ep-footer-brand::before{content:"DOSSIERS · ENQUÊTES · TÉMOIGNAGES"!important;color:#6fae99!important}
html.ep-reborn #epGlobalFooter .ep-footer-brand strong{font-family:'Cormorant Garamond',serif!important;color:#eee9df!important}

/* -------- MOBILE -------- */
@media(max-width:760px){
  html.ep-reborn:not([class*="ep-theme-"]) body{background-size:180% 150%,180% 150%,160% 150%,48px 48px,48px 48px,100% 100%!important;animation-duration:28s!important}
  /* Accueil mobile : le hero ne remplit plus artificiellement tout l'écran. */
  html.ep-reborn body.home-editorial .hero.v3-home-intro{
    min-height:0!important;
    height:auto!important;
    align-items:flex-start!important;
    padding-top:34px!important;
    padding-bottom:34px!important;
    margin-top:0!important;
    margin-bottom:0!important;
  }
  html.ep-reborn body.home-editorial .hero.v3-home-intro .hero-grid{gap:22px!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro .eyebrow{margin-bottom:14px!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro .lede{margin-top:18px!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro .hero-actions{margin-top:24px!important;gap:10px!important}
  html.ep-reborn body.home-editorial #v3IdentitySequence>.block:first-of-type{padding-top:34px!important}
  html.ep-reborn .ep-page-intro{width:min(100% - 18px,1240px)!important;margin-top:16px!important;padding:28px 18px 34px!important;border-radius:15px!important}
  html.ep-reborn .ep-page-intro h1,html.ep-reborn .v3-hero h1{font-size:clamp(2.55rem,14vw,4.5rem)!important}
  html.ep-reborn .ep-page-intro::after,html.ep-reborn .v3-hero::after{right:16px!important;bottom:12px!important;font-size:.48rem!important}
  html.ep-reborn .v3-shell{width:min(100% - 16px,1240px)!important}
  html.ep-reborn .grade-matrix{width:100%!important;max-width:100%!important;-webkit-overflow-scrolling:touch!important}
  html.ep-reborn .grade-matrix-inner{min-width:930px!important}
  html.ep-reborn .grade-matrix-head,html.ep-reborn .grade-head-row,html.ep-reborn .grade-row{grid-template-columns:220px repeat(6,118px)!important;font-size:.79rem!important}
  html.ep-reborn .grade-matrix-head>div:first-child,html.ep-reborn .grade-row>div:first-child{position:sticky!important;left:0!important;z-index:5!important;background:#0a0f0e!important;box-shadow:10px 0 20px rgba(0,0,0,.24)!important}
  html.ep-reborn .grade-matrix-head>div:first-child{z-index:12!important;background:#0b1110!important}
  html.ep-reborn .grade-category{position:sticky!important;left:0!important;z-index:4!important;width:930px!important}
  html.ep-reborn body.home-editorial .hero h1{font-size:clamp(3.55rem,17vw,6.2rem)!important}
}
@media(max-width:430px){
  html.ep-reborn .grade-matrix-inner{min-width:870px!important}
  html.ep-reborn .grade-matrix-head,html.ep-reborn .grade-head-row,html.ep-reborn .grade-row{grid-template-columns:205px repeat(6,110px)!important}
  html.ep-reborn .grade-category{width:870px!important}
  html.ep-reborn .grade-matrix-head>div,html.ep-reborn .grade-row>div{padding:12px 8px!important}
}

@media(prefers-reduced-motion:reduce){
  html.ep-reborn body,html.ep-reborn body::before,html.ep-reborn .ep-page-signal::before{animation:none!important}
  html.ep-reborn *{scroll-behavior:auto!important;transition-duration:.01ms!important}
}


/* V3.9.17 — accueil mobile : suppression définitive du hero plein écran. */
@media(max-width:900px){
  html.ep-reborn body.home-editorial main.page{padding-top:72px!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro{min-height:auto!important;height:auto!important;display:block!important;padding-top:24px!important;padding-bottom:28px!important;margin-block:0!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro .hero-grid,
  html.ep-reborn body.home-editorial .hero.v3-home-intro .hero-grid>div{min-height:0!important;height:auto!important;margin:0!important;padding:0!important}
  html.ep-reborn body.home-editorial #qui-suis-je{padding-top:32px!important;margin-top:0!important}
}
@media(max-width:480px){
  html.ep-reborn body.home-editorial main.page{padding-top:64px!important}
  html.ep-reborn body.home-editorial .hero.v3-home-intro{padding-top:18px!important;padding-bottom:24px!important}
  html.ep-reborn body.home-editorial #qui-suis-je{padding-top:28px!important}
}
