/* Page de présentation — thème clair, vocabulaire JeunACTIO (cyan #99d1e4, marine #0f2a38) */
.ja-pres{ --p-ink:#0f2a38; --p-mute:#58737f; --p-line:#dbe7ec; --p-soft:#f7fbfd; --p-cy:#99d1e4; background:#fff; color:var(--p-ink); font-family:var(--ja-font, Inter, system-ui, sans-serif); overflow-x:clip; }
.ja-pres *{ box-sizing:border-box; }
.pres-wrap{ width:var(--ja-container, min(1180px,92vw)); margin:0 auto; }
.ja-pres h1,.ja-pres h2,.ja-pres h3{ margin:0; text-wrap:balance; letter-spacing:-.015em; }
.ja-pres img{ display:block; max-width:100%; }

/* Révélation à l'entrée */
.ja-pres [data-r]{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .8s cubic-bezier(.22,.85,.32,1); transition-delay:var(--d,0s); }
.ja-pres [data-r].is-in{ opacity:1; transform:none; }

/* Bannière d'en-tête : photo de la page + titre */
.pres-banner{ background:#fff; }
.pres-banner-img{ margin:0; line-height:0; background:#071820; }
.pres-banner-img img{ width:100%; height:auto; max-height:600px; object-fit:cover; object-position:center; }
.pres-banner-head{ width:var(--ja-container, min(1180px,92vw)); margin:0 auto; padding:clamp(28px,4vw,56px) 0 clamp(8px,2vw,24px); display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(16px,4vw,56px); align-items:end; }
.pres-banner-head h1{ font-family:var(--font-serif, Georgia, 'Times New Roman', serif); font-size:clamp(34px,5vw,64px); line-height:1; font-weight:800; color:#0f2a38; }
.pres-banner-head p{ margin:0; color:var(--p-mute); font-size:var(--fs-md,16px); line-height:1.65; }
@media (max-width:760px){ .pres-banner-head{ grid-template-columns:1fr; } }

/* Hero */
.pres-hero{ position:relative; min-height:min(88vh,820px); display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); align-items:center; gap:clamp(24px,4vw,64px); padding:clamp(40px,6vw,80px) max(4vw, calc((100vw - var(--ja-container, 1180px)) / 2)); background:radial-gradient(1200px 520px at 8% 0%, #e6f3f8 0%, transparent 60%), linear-gradient(180deg,#f7fbfd,#eef6f9); overflow:hidden; }
.pres-kicker{ display:inline-block; font-size:var(--fs-xs,12px); font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#2a6c85; padding:6px 12px; border:1px solid var(--p-cy); border-radius:999px; background:#fff; }
.pres-hero h1,.pres-hero-title{ margin:18px 0 16px; font-size:clamp(34px,5vw,64px); line-height:1.04; font-weight:900; color:var(--p-ink); }
.pres-hero p{ margin:0 0 26px; max-width:52ch; font-size:var(--fs-lg,18px); line-height:1.6; color:var(--p-mute); }
.pres-cta{ display:flex; flex-wrap:wrap; gap:12px; }
.pres-btn{ display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 22px; border-radius:999px; border:1px solid var(--p-cy); background:#fff; color:var(--p-ink); font-weight:800; font-size:var(--fs-sm,14px); text-decoration:none; transition:transform .25s ease, box-shadow .25s ease, background .25s ease; }
.pres-btn:hover{ transform:translateY(-2px); box-shadow:var(--e2, 0 8px 22px rgba(6,16,23,.16)); background:#eaf6fa; }
.pres-btn.is-primary{ background:#0f2a38; color:#fff; border-color:#0f2a38; }
.pres-btn.is-primary:hover{ background:#0d3140; }
.pres-hero-media{ position:relative; height:min(78vh,640px); display:grid; grid-template-columns:repeat(3,1fr); gap:14px; perspective:1400px; -webkit-mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent); mask-image:linear-gradient(180deg,transparent,#000 14%,#000 86%,transparent); }
.pres-col{ overflow:hidden; transform:rotateY(-14deg) rotateX(4deg); transform-style:preserve-3d; }
.pres-track{ display:flex; flex-direction:column; gap:14px; animation:presUp 38s linear infinite; will-change:transform; }
.pres-col-b .pres-track{ animation-name:presDown; animation-duration:46s; }
.pres-col-c .pres-track{ animation-duration:54s; }
.pres-track img{ width:100%; height:auto; object-fit:cover; border-radius:14px; box-shadow:var(--e1, 0 1px 3px rgba(6,16,23,.12)); background:#e6f3f8; }
@keyframes presUp{ to{ transform:translateY(-50%); } }
@keyframes presDown{ from{ transform:translateY(-50%); } to{ transform:translateY(0); } }
.pres-scroll{ position:absolute; left:50%; bottom:18px; width:26px; height:42px; border:2px solid var(--p-cy); border-radius:14px; transform:translateX(-50%); }
.pres-scroll span{ position:absolute; left:50%; top:8px; width:4px; height:8px; margin-left:-2px; border-radius:2px; background:#2a6c85; animation:presDot 1.8s ease-in-out infinite; }
@keyframes presDot{ 0%{ opacity:0; transform:translateY(0);} 30%{ opacity:1;} 100%{ opacity:0; transform:translateY(14px);} }

/* Mission */
.pres-mission{ padding:var(--ja-section-y, 64px) 0; background:#fff; }
.pres-mission h2{ max-width:26ch; font-size:clamp(24px,3.2vw,40px); line-height:1.15; font-weight:800; }
.pres-stats{ list-style:none; margin:40px 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--p-line); border-radius:14px; overflow:hidden; }
.pres-stats li{ padding:26px 22px; display:flex; flex-direction:column; gap:6px; background:var(--p-soft); border-right:1px solid var(--p-line); }
.pres-stats li:last-child{ border-right:0; }
.pres-stats strong{ font-size:clamp(28px,3.4vw,44px); font-weight:900; color:#0f2a38; font-variant-numeric:tabular-nums; }
.pres-stats span{ color:var(--p-mute); font-size:var(--fs-sm,14px); }

/* Scènes */
.pres-scene{ padding:var(--ja-section-y, 64px) 0; border-top:1px solid var(--p-line); background:linear-gradient(180deg,#fff,var(--p-soft)); }
.pres-scene:nth-of-type(even){ background:linear-gradient(180deg,var(--p-soft),#fff); }
.pres-scene-head{ width:var(--ja-container, min(1180px,92vw)); margin:0 auto 28px; display:grid; grid-template-columns:auto 1fr; column-gap:18px; align-items:end; }
.pres-num{ grid-row:1 / span 2; font-size:clamp(44px,6vw,84px); font-weight:900; line-height:.9; color:transparent; -webkit-text-stroke:2px var(--p-cy); }
.pres-scene-head h2{ font-size:clamp(26px,3.4vw,44px); font-weight:900; }
.pres-scene-head p{ margin:6px 0 0; color:var(--p-mute); max-width:60ch; }
.pres-rail{ display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; padding:8px max(4vw, calc((100vw - var(--ja-container, 1180px)) / 2)) 26px; scroll-padding-inline:max(4vw, calc((100vw - var(--ja-container, 1180px)) / 2)); scrollbar-width:thin; scrollbar-color:var(--p-cy) transparent; -webkit-overflow-scrolling:touch; }
.pres-card{ flex:0 0 clamp(250px,26vw,340px); min-width:0; max-width:340px; scroll-snap-align:start; transform-style:preserve-3d; }
.pres-card a{ display:flex; flex-direction:column; height:100%; color:inherit; text-decoration:none; background:#fff; border:1px solid var(--p-line); border-radius:14px; box-shadow:var(--e1, 0 1px 3px rgba(6,16,23,.12)); overflow:hidden; transition:transform .35s cubic-bezier(.22,.85,.32,1), box-shadow .35s ease, border-color .25s ease; }
.pres-card img{ width:100%; aspect-ratio:10/7; object-fit:cover; background:#e6f3f8; transition:transform .8s ease; }
.pres-card:hover img{ transform:scale(1.04); }
.pres-card a:hover{ border-color:var(--p-cy); box-shadow:var(--e2, 0 8px 22px rgba(6,16,23,.16)); }
.pres-card h3{ padding:16px 18px 6px; font-size:var(--fs-lg,18px); line-height:1.25; }
.pres-card p{ margin:0; padding:0 18px; color:var(--p-mute); font-size:var(--fs-sm,14px); line-height:1.55; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pres-more{ margin-top:auto; padding:14px 18px 18px; font-weight:800; font-size:var(--fs-sm,14px); color:#2a6c85; }
.pres-more::after{ content:" →"; transition:margin .25s ease; }
.pres-card a:hover .pres-more::after{ margin-left:6px; }

/* Équipe */
.pres-team{ padding:var(--ja-section-y, 64px) 0; border-top:1px solid var(--p-line); }
.pres-team h2,.pres-ig h2,.pres-news h2,.pres-final h2{ font-size:clamp(26px,3.4vw,44px); font-weight:900; margin-bottom:26px; }
.pres-team-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.pres-person{ display:flex; flex-direction:column; gap:6px; }
.pres-person img,.pres-ph{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; background:#eaf3f7; margin-bottom:8px; }
.pres-person strong{ font-size:var(--fs-lg,18px); }
.pres-role{ color:var(--p-mute); font-size:var(--fs-sm,14px); }
.pres-role a{ display:block; margin-top:4px; color:#0f2a38; text-decoration:none; border-bottom:1px solid var(--p-cy); width:max-content; max-width:100%; overflow-wrap:anywhere; }

/* Instagram */
.pres-ig{ padding:var(--ja-section-y, 64px) 0; background:var(--p-soft); border-top:1px solid var(--p-line); }
.pres-lead{ margin:-12px 0 24px; color:var(--p-mute); }
.pres-lead a{ color:#0f2a38; font-weight:700; }
.pres-ig-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:26px; }
.pres-ig-grid a{ display:block; border-radius:14px; overflow:hidden; border:1px solid var(--p-line); background:#fff; transition:transform .35s ease, box-shadow .35s ease; }
.pres-ig-grid a:hover{ transform:translateY(-3px); box-shadow:var(--e2, 0 8px 22px rgba(6,16,23,.16)); }
.pres-ig-grid img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
.pres-ig:not(.has-feed) .pres-ig-grid{ display:none; }

/* Actualités */
.pres-news{ padding:var(--ja-section-y, 64px) 0; border-top:1px solid var(--p-line); }
.pres-news-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.pres-news-grid a{ display:flex; flex-direction:column; gap:8px; height:100%; color:inherit; text-decoration:none; padding-bottom:14px; border-bottom:2px solid var(--p-line); transition:border-color .25s ease; }
.pres-news-grid a:hover{ border-color:var(--p-cy); }
.pres-news-grid img{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:14px; background:#e6f3f8; }
.pres-news-grid time{ font-size:var(--fs-xs,12px); font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--p-mute); }
.pres-news-grid h3{ font-size:var(--fs-lg,18px); line-height:1.3; }

/* Appel final */
.pres-final{ padding:clamp(56px,8vw,110px) 0; text-align:center; background:linear-gradient(135deg,#061017 0%,#0d3140 55%,#0b1b24 100%); color:#fff; }
.pres-final h2{ margin-bottom:26px; }
.pres-final .pres-cta{ justify-content:center; }
.pres-final .pres-btn{ background:transparent; color:#fff; border-color:rgba(153,209,228,.6); }
.pres-final .pres-btn.is-primary{ background:#99d1e4; color:#061017; border-color:#99d1e4; }

.ja-pres :is(a,button):focus-visible{ outline:2px solid #2a6c85; outline-offset:3px; }

@media (max-width:1000px){
  .pres-hero{ grid-template-columns:1fr; min-height:0; padding-bottom:clamp(40px,8vw,72px); }
  .pres-hero-media{ height:340px; }
  .pres-scroll{ display:none; }
  .pres-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pres-stats li:nth-child(2){ border-right:0; }
  .pres-stats li:nth-child(-n+2){ border-bottom:1px solid var(--p-line); }
  .pres-team-grid,.pres-news-grid,.pres-ig-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px){
  .pres-team-grid,.pres-news-grid,.pres-ig-grid{ grid-template-columns:1fr; }
  .pres-scene-head{ grid-template-columns:1fr; }
  .pres-num{ grid-row:auto; }
  .pres-btn{ min-height:48px; }
}
@media (prefers-reduced-motion:reduce){
  .ja-pres [data-r]{ opacity:1; transform:none; transition:none; }
  .pres-track,.pres-scroll span{ animation:none; }
}

/* ——— Mode « Après » : entrée une par une (mouvement propre à chaque scène), puis mise en avant d'une carte à la fois ——— */
.pres-scene .pres-card{ opacity:0; transition:opacity .7s ease, transform .85s cubic-bezier(.22,.85,.32,1), filter .6s ease; will-change:transform,opacity; }
.pres-scene[data-v="rise"] .pres-card{ transform:translateY(46px); }
.pres-scene[data-v="left"] .pres-card{ transform:translateX(-64px); }
.pres-scene[data-v="right"] .pres-card{ transform:translateX(64px); }
.pres-scene[data-v="flip"] .pres-card{ transform:perspective(900px) rotateX(-24deg) translateY(30px); transform-origin:50% 0; }
.pres-scene[data-v="zoom"] .pres-card{ transform:scale(.86); }
.pres-scene .pres-card.is-in{ opacity:1; transform:none; }
/* Mise en avant : la carte active avance vers le visiteur, les autres s'effacent */
.pres-rail.is-spot .pres-card.is-in{ opacity:.42; filter:saturate(.75); transform:scale(.97); }
.pres-rail.is-spot .pres-card.is-in.is-front{ opacity:1; filter:none; transform:scale(1.05) translateY(-4px); z-index:2; }
.pres-rail.is-spot .pres-card.is-front a{ border-color:var(--p-cy); box-shadow:0 24px 50px -18px rgba(6,16,23,.35); }
.pres-rail{ overflow-y:visible; padding-top:22px; padding-bottom:34px; }
@media (prefers-reduced-motion:reduce){
  .pres-scene .pres-card{ opacity:1; transform:none; transition:none; }
  .pres-rail.is-spot .pres-card.is-in{ opacity:1; filter:none; transform:none; }
}

/* ——— En-tête compact (350 px) : le hero remplace la bannière de titre ——— */
.pres-hero{ min-height:0; height:350px; padding-block:24px; gap:clamp(20px,3vw,48px); }
.pres-hero h1,.pres-hero-title{ margin:12px 0 10px; font-size:clamp(26px,3.2vw,44px); line-height:1.05; }
.pres-hero p{ margin:0 0 16px; font-size:var(--fs-md,16px); line-height:1.5; max-width:56ch; }
.pres-hero .pres-btn{ min-height:42px; }
.pres-hero-media{ height:100%; gap:12px; }
.pres-track{ gap:12px; }
.pres-scroll{ display:none; }
@media (max-width:1000px){
  .pres-hero{ height:auto; padding-block:28px 24px; }
  .pres-hero-media{ height:240px; }
}