/* Styles communs a toutes les pages du site Ady Fototra. */

/* Carte événement : autonome, sans dépendance au CDN de mise en page. */
.event-popup, .event-launcher, .event-feature { box-sizing: border-box; font-family: 'Inter', sans-serif; }
.event-popup *, .event-feature * { box-sizing: border-box; }
.event-popup[hidden], .event-launcher[hidden] { display: none; }
.event-popup { position: fixed; z-index: 80; right: 24px; bottom: 24px; width: min(390px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; color: #111111; background: #ffffff; border: 1px solid #111111; border-radius: 20px; box-shadow: 0 24px 70px #11111133; animation: event-enter .3s ease-out both; }
.event-popup-top { display: flex; align-items: center; justify-content: space-between; padding: 8px 14px 8px 24px; background: #ffffff; border-bottom: 1px solid #111111; }
.event-eyebrow { font-size: 11px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.event-close { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: #111111; font-size: 28px; cursor: pointer; }
.event-close:hover { background: #11111111; }
.event-popup-body { padding: 24px; }
.event-edition { color: #c8102e; font-size: 10px; letter-spacing: .13em; font-weight: 800; margin: 0 0 10px; }
.event-popup h2 { display: flex; justify-content: space-between; align-items: center; font-family: 'Playfair Display', Georgia, serif; font-size: 42px; line-height: 1.15; font-weight: 800; margin: 0; }
.event-popup h2 span { color: #c8102e; font-family: sans-serif; font-size: 32px; }
.event-date { font-weight: 800; font-size: 16px; line-height: 1.6; margin: 16px 0 12px; }
.event-date span { display: block; color: #64646d; font-weight: 500; font-size: 12px; }
.event-intro { font-size: 13px; line-height: 1.7; color: #64646d; margin: 0 0 20px; }
.event-countdown-label { font-size: 11px; font-weight: 700; margin: 18px 0 8px; color: #64646d; }
.event-countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.event-countdown > div { text-align: center; border-radius: 8px; background: #111111; color: #ffffff; padding: 12px 4px 10px; }
.event-countdown strong { display: block; font-size: 28px; line-height: 1.2; font-weight: 800; font-variant-numeric: tabular-nums; color: #ffffff; }
.event-countdown span { display: block; margin-top: 6px; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.event-button { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; margin-top: 20px; padding: 14px 18px; border-radius: 8px; background: #c8102e; color: white; font-size: 12px; font-weight: 800; text-decoration: none; }
.event-button:hover { background: #a40d25; }
.event-calendar { display: block; text-align: center; padding: 14px 0 0; color: #55555d; font-size: 12px; font-weight: 700; text-underline-offset: 3px; }
.event-launcher { position: fixed; right: 24px; bottom: 24px; z-index: 79; min-height: 48px; padding: 14px 20px; background: #ffffff; color: #111111; border: 1px solid #111111; border-radius: 999px; box-shadow: 0 8px 30px #11111118; font-size: 12px; font-weight: 800; cursor: pointer; }
.event-launcher:hover { background: #f0f0f1; }
.event-feature { padding: 56px 24px; background: #111111; color: #ffffff; }
.event-feature-inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; max-width: 1216px; margin: auto; }
.event-feature h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 800; font-size: clamp(40px, 6vw, 66px); line-height: 1.2; margin: 12px 0; }
.event-feature .event-button { width: fit-content; }
.event-feature .event-countdown { margin-top: 14px; gap: 10px; }
.event-feature .event-countdown > div { padding: 24px 6px; }
.event-feature .event-countdown strong { font-size: clamp(28px, 4vw, 48px); }
.event-feature .event-countdown span { font-size: 10px; }
.event-popup :focus-visible, .event-launcher:focus-visible, .event-feature :focus-visible { outline: 3px solid #c8102e; outline-offset: 4px; }
[id^="praosim-"] { scroll-margin-top: 110px; }
@keyframes event-enter { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) {
  .event-popup { right: 16px; bottom: 16px; }
  .event-launcher { right: 16px; bottom: 16px; }
  .event-popup-body { padding: 20px; }
  .event-feature { padding: 40px 20px; }
  .event-feature-inner { grid-template-columns: 1fr; gap: 32px; }
}
@media (prefers-reduced-motion: reduce) { .event-popup { animation: none; } }

/* Think Tank — direction artistique Ady Fototra : noir, blanc et rouge. */
.event-popup { inset: auto 24px 24px auto; margin: 0; padding: 0; width: min(440px, calc(100vw - 48px)); max-height: calc(100dvh - 48px); color: #ffffff; background: #111111; border: 1px solid #ffffff38; border-radius: 16px; box-shadow: 0 30px 100px #24211c4d; }
.event-popup:not([open]) { display: none; }
.event-popup::backdrop { background: #1111114d; backdrop-filter: blur(3px); }
.event-art { position: relative; min-height: 140px; background: #111111; isolation: isolate; }
.event-art::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(0deg, #111111 0%, #11111100 85%), linear-gradient(90deg, #000b, #0002), url('../think-tank-affiche.jpg') right top / 180% auto no-repeat; filter: grayscale(1); }
.event-popup-top { align-items: flex-start; gap: 12px; padding: 18px 18px 0 26px; background: none; border: 0; }
.event-popup-top .event-eyebrow { line-height: 1.9; color: #ffffff; font-size: 9px; letter-spacing: .13em; text-shadow: 0 2px 5px #000; }
.event-close { flex: 0 0 44px; color: #ffffff; background: #111111b8; border: 1px solid #ffffff50; font-size: 27px; }
.event-close:hover { background: #c8102e; }
.event-first { position: absolute; bottom: 10px; left: 26px; color: #ffffff; font-size: 10px; letter-spacing: .2em; font-weight: 800; }
.event-popup-body { padding: 12px 26px 22px; }
.event-edition { color: #cbbdb3; font-size: 9px; line-height: 1.6; letter-spacing: .11em; margin-bottom: 12px; }
.event-popup h2 { display: block; font-family: 'Inter', sans-serif; font-size: 45px; font-weight: 900; letter-spacing: -.06em; line-height: 1; white-space: nowrap; }
.event-popup h2 span { font: inherit; color: #d5aa8c; }
.event-tagline { margin: 10px 0 20px; font-size: 13px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #eaded3; }
.event-popup .event-date { margin: 18px 0; padding-top: 16px; border-top: 1px solid #ffffff26; font-size: 17px; }
.event-popup .event-date span { color: #cbbdb3; font-size: 11px; }
.event-topics { display: grid; gap: 8px; list-style: none; padding: 0; margin: 0 0 20px; color: #f3e9de; font-size: 12px; }
.event-topics li { display: flex; align-items: center; gap: 9px; }
.event-topics li::before { content: ''; flex: 0 0 6px; height: 6px; background: #d5aa8c; transform: rotate(45deg); }
.event-popup .event-countdown-label { color: #cbbdb3; font-size: 10px; font-weight: 500; }
.event-popup .event-countdown > div { background: #ffffff0a; border: 1px solid #ffffff26; border-radius: 5px; padding: 12px 4px; }
.event-popup .event-countdown strong { color: #ffffff; font-size: 28px; }
.event-popup .event-countdown span { color: #cbbdb3; font-size: 8px; }
.event-actions { display: grid; grid-template-columns: 1.3fr 1fr; gap: 10px; margin-top: 20px; }
.event-popup .event-button { margin: 0; background: #c8102e; color: #ffffff; border: 1px solid #c8102e; border-radius: 5px; font-size: 13px; }
.event-popup .event-button:hover { background: #a40d25; }
.event-later { border: 1px solid #ffffff55; border-radius: 5px; background: transparent; color: #ffffff; font-size: 13px; font-weight: 700; min-height: 48px; cursor: pointer; }
.event-later:hover { background: #ffffff15; }
.event-popup .event-calendar { color: #cbbdb3; font-size: 10px; }
.event-launcher { background: #111111; color: #ffffff; border-color: #c8102e; }
.event-launcher:hover { background: #24211c; }
.event-popup :focus-visible { outline-color: #ffffff; }
@media (max-width: 640px) {
  html.event-modal-open { overflow: hidden; }
  .event-popup { inset: 0; width: 100%; max-width: none; height: 100vh; height: 100dvh; max-height: none; margin: 0; border: 0; border-radius: 0; overscroll-behavior: contain; }
  .event-popup[open] { display: flex; flex-direction: column; }
  .event-art { flex: 0 0 clamp(110px, 20dvh, 200px); }
  .event-popup-top { padding-top: max(18px, env(safe-area-inset-top)); }
  .event-popup-body { flex: 1; display: flex; flex-direction: column; padding: 14px 26px max(22px, env(safe-area-inset-bottom)); }
  .event-popup h2 { font-size: clamp(34px, 10.5vw, 64px); }
  .event-tagline { font-size: 11px; letter-spacing: .1em; }
  .event-actions { margin-top: auto; padding-top: 22px; }
  .event-popup .event-countdown { margin-bottom: 6px; }
  .event-popup .event-calendar { padding-top: 18px; padding-bottom: 4px; }
}

/* Le rappel permanent reprend les mêmes couleurs que le popup. */
.event-feature .event-eyebrow { color: #ffffff; }
.event-feature .event-date span { color: #cbbdb3; }
.event-feature .event-countdown > div { border: 1px solid #ffffff38; }
.event-feature .event-countdown strong { color: #ffffff; }


.event-popup {font-family:Inter,system-ui,sans-serif;overscroll-behavior:contain;}
.event-popup .event-date span,.event-popup .event-later,.event-popup .event-calendar{color:#e3d3c4;}
.event-popup .event-countdown-label{color:#d7c4b3;}
.event-launcher{bottom:max(16px,env(safe-area-inset-bottom));right:16px;border-color:#b08463;}

/* Miniature événement : affiche animée sur les écrans de bureau. */
.event-brand { display:flex; align-items:center; gap:12px; }
.event-brand img { display:block; width:56px; height:56px; padding:3px; object-fit:contain; background:#fff; border-radius:4px; }
.event-popup-top .event-brand .event-eyebrow { font-size:8px; }
.event-launcher { display:flex; align-items:center; gap:10px; padding:12px 18px; }
.event-mini-art,.event-mini-kicker,.event-mini-detail,.event-mini-remaining { display:none; }
.event-mini-copy { display:flex; gap:6px; align-items:center; }
.event-mini-copy strong { font:900 12px/1.2 Inter,sans-serif; }
.event-mini-copy em { font-style:normal; color:#d5aa8c; }
.event-mini-time { font-size:10px; }
.event-mini-arrow { font-size:19px; }
@media(min-width:1100px) and (hover:hover) and (pointer:fine) {
 .event-launcher { width:330px; padding:0; gap:0; text-align:left; border-radius:8px; overflow:hidden; border:1px solid #b0846380; box-shadow:0 16px 50px #24211c35; transition:transform .3s,box-shadow .3s; }
 .event-launcher:hover { transform:translateY(-5px); box-shadow:0 22px 60px #24211c50; }
 .event-mini-art { display:grid; place-items:center; flex:0 0 83px; align-self:stretch; background:linear-gradient(0deg,#111a,#1113),url('../think-tank-affiche.jpg') 100% 0/500% auto; filter:grayscale(1); border-right:1px solid #ffffff20; }
 .event-mini-art>span { display:block; text-align:center; font:800 38px/1 Inter,sans-serif; }
 .event-mini-art small { display:block; margin-top:6px; font-size:10px; letter-spacing:.18em; }
 .event-mini-copy { flex:1; min-width:0; display:flex; flex-direction:column; align-items:start; gap:7px; padding:18px 14px; }
 .event-mini-kicker { display:block; font-size:7px; letter-spacing:.14em; color:#d5aa8c; }
 .event-mini-copy strong { font-size:25px; letter-spacing:-.045em; }
 .event-mini-detail { display:block; font-size:9px; color:#e3d3c4; }
 .event-mini-time { font-size:9px; color:#fff; }
 .event-mini-remaining { display:block; font-size:10px; color:#d5aa8c; font-variant-numeric:tabular-nums; }
 .event-mini-arrow { position:absolute; bottom:16px; right:16px; color:#d5aa8c; }
}
@media(min-width:1100px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .event-launcher { animation:event-attention 5s ease-in-out infinite; }
 .event-launcher::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(110deg,transparent 30%,#ffffff12 48%,transparent 65%); transform:translateX(-130%); animation:event-sheen 7s ease-in-out infinite; }
 .event-mini-arrow { animation:event-arrow 2.8s ease-in-out infinite; }
 .event-launcher:hover { animation-play-state:paused; }
}
@keyframes event-attention { 0%,80%,100% { box-shadow:0 16px 50px #24211c35; } 40% { box-shadow:0 16px 50px #24211c35,0 0 0 5px #b0846326; } }
@keyframes event-sheen { 0%,65% { transform:translateX(-130%); } 90%,100% { transform:translateX(130%); } }
@keyframes event-arrow { 0%,70%,100% { transform:none; } 40% { transform:translate(3px,-3px); } }
@media(max-width:360px) { .event-launcher { padding:12px; gap:6px; } .event-mini-time { display:none; } }