/* IT Tech Académie — V38 : page d'accueil « landing page » (publicité Meta), pensée mobile d'abord.
   Chargé en dernier. Les règles de la page sont préfixées par body.landing-v38 ; les cartes de confiance (.v38-trust) servent aussi sur paiement.html. */

:root{--v38-blue:#0b5bd3;--v38-blue-dark:#0a3f93;--v38-navy:#071f47;--v38-green:#16a34a;--v38-wa:#22c55e;--v38-gold:#ffd166;--v38-ink:#0f2f57;--v38-muted:#475569;--v38-bleed:clamp(12px,2.2vw,36px)}

/* ---------- structure des sections ---------- */
body.landing-v38 .page-wrap>.v38-sec,body.landing-v38 .page-wrap>.section.v38-sec{margin-top:30px;padding:0}
body.landing-v38 .v38-head{margin:0 0 14px}
body.landing-v38 .v38-eyebrow{display:inline-block;margin:0 0 6px;padding:4px 12px;border-radius:999px;background:#e6f0ff;color:var(--v38-blue-dark);font-weight:800;font-size:12.5px;letter-spacing:.3px}
html body.landing-v38 .page-wrap .v38-sec h2,html body.landing-v38 .page-wrap .v38-sec .v38-head h2{margin:2px 0 8px!important;font-size:clamp(1.5rem,6.4vw,2.4rem)!important;line-height:1.16!important;color:var(--v38-ink)!important;letter-spacing:-.01em;text-transform:none!important;text-align:left!important;font-weight:850}
html body.landing-v38 .page-wrap .v38-sec .section-headline,html body.landing-v38 .page-wrap .v38-sec .v38-head{text-align:left!important;max-width:none!important;margin:0 0 14px!important}
html body.landing-v38 .page-wrap .v38-sec .v38-sub{text-align:left}
html body.landing-v38 .page-wrap .v38-band h2{color:#fff!important;text-align:center!important}
html body.landing-v38 .page-wrap .home-final-cta h2{color:#fff!important;text-align:center!important}
body.landing-v38 .v38-sub{margin:0;color:var(--v38-muted);font-size:clamp(.98rem,3.6vw,1.12rem);line-height:1.5;max-width:62ch}
body.landing-v38 .v38-note{margin:10px 0 0;color:#64748b;font-size:12.5px}

/* ---------- boutons ---------- */
.v38-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 22px;border-radius:14px;border:0;font-weight:900;font-size:1.05rem;text-decoration:none;cursor:pointer;line-height:1.15;text-align:center;-webkit-tap-highlight-color:transparent}
.v38-btn-blue{background:var(--v38-blue);color:#fff!important;box-shadow:0 10px 24px rgba(11,91,211,.35)}
.v38-btn-blue:hover{background:var(--v38-blue-dark)}
.v38-btn-green{background:var(--v38-wa);color:#053b1a!important;box-shadow:0 10px 24px rgba(34,197,94,.32)}
.v38-btn-ghost{background:rgba(255,255,255,.12);color:#fff!important;border:1.5px solid rgba(255,255,255,.55)}
.v38-btn-ghost.dark{background:#fff;color:var(--v38-blue-dark)!important;border-color:#c9daf5}
.v38-cta-row{display:grid;gap:10px;margin-top:14px}
@media(min-width:640px){.v38-cta-row{grid-template-columns:repeat(auto-fit,minmax(210px,max-content))}}

/* ---------- hero ---------- */
body.landing-v38 .v38-hero{position:relative;overflow:hidden;border-radius:22px;padding:26px 18px 18px;margin:0 0 4px;color:#fff;background:radial-gradient(120% 95% at 88% -10%,#2d7df0 0%,#0b4aa8 48%,var(--v38-navy) 100%)}
body.landing-v38 .v38-hero::after{content:"";position:absolute;right:-60px;bottom:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.07);pointer-events:none}
body.landing-v38 .v38-hero-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);font-weight:800;font-size:12.5px}
body.landing-v38 .v38-hero h1{margin:12px 0 10px;font-size:clamp(1.85rem,8vw,3.3rem);line-height:1.1;letter-spacing:-.015em;color:#fff;text-transform:none}
body.landing-v38 .v38-hero h1 em{font-style:normal;color:var(--v38-gold)}
body.landing-v38 .v38-lead{margin:0 0 12px;font-size:clamp(1rem,4vw,1.2rem);line-height:1.5;opacity:.96;max-width:56ch}
body.landing-v38 .v38-price{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.3);margin:2px 0 4px}
body.landing-v38 .v38-price strong{font-size:1.55rem;color:var(--v38-gold);line-height:1}
body.landing-v38 .v38-price .v39-barre{font-size:1rem;font-weight:700;color:rgba(255,255,255,.75);text-decoration:line-through;text-decoration-thickness:2px}
body.landing-v38 .v38-price .v39-barre[hidden]{display:none}
body.landing-v38 .v38-price span{font-size:.95rem;font-weight:700}
body.landing-v38 .v38-hero .home-trust-chips{margin-top:16px}
body.landing-v38 .v38-hero .trust-marquee-group .trust-chip{background:rgba(255,255,255,.95)}
@media(min-width:900px){body.landing-v38 .v38-hero{padding:46px 44px 30px}}

/* ---------- bandes qu'on fait glisser à la main (galerie, équipe, certificats, témoignages, LinkedIn) ---------- */
.v38-bandwrap{position:relative;margin-left:calc(-1*var(--v38-bleed));margin-right:calc(-1*var(--v38-bleed))}
.v38-swipe{overflow-x:auto!important;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;cursor:grab;touch-action:pan-x pan-y;outline-offset:-2px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.v38-swipe::-webkit-scrollbar{display:none}
.v38-swipe.is-drag{cursor:grabbing;user-select:none;-webkit-user-select:none}
.v38-swipe.is-drag *{pointer-events:none}
.v38-swipe img{-webkit-user-drag:none;user-select:none}
.v38-track{display:flex;width:max-content;padding:6px var(--v38-bleed) 12px}
body.landing-v38 .team-orbit.v38-swipe{padding:8px 0 18px}
body.landing-v38 .team-orbit.v38-swipe::before,body.landing-v38 .team-orbit.v38-swipe::after{display:none}
body.landing-v38 .team-orbit.v38-swipe .team-orbit-track{animation:none!important;padding:0 var(--v38-bleed)}
.v38-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.96);color:var(--v38-blue-dark);font-size:30px;line-height:1;font-weight:700;cursor:pointer;box-shadow:0 6px 18px rgba(2,6,23,.28);display:none;align-items:center;justify-content:center;padding:0 0 4px}
.v38-arrow:hover{background:#fff;color:var(--v38-blue)}
.v38-arrow-prev{left:10px}.v38-arrow-next{right:10px}
@media(hover:hover) and (pointer:fine){.v38-arrow{display:flex}}
.v38-shot{flex:none;margin:0 12px 0 0;padding:0;border:0;background:#0b1220;border-radius:14px;overflow:hidden;cursor:zoom-in;box-shadow:0 10px 24px rgba(15,45,80,.2);height:var(--v38-h,168px);-webkit-tap-highlight-color:transparent}
.v38-shot img{display:block;height:100%;width:auto}
.v38-cert{flex:none;margin:0 14px 0 0;padding:0;border:0;background:#fff;border-radius:12px;overflow:hidden;cursor:zoom-in;width:min(82vw,430px);box-shadow:0 12px 28px rgba(15,45,80,.22);-webkit-tap-highlight-color:transparent}
.v38-cert img{display:block;width:100%;height:auto}
@media(min-width:700px){.v38-shot{--v38-h:236px}}

/* témoignages */
.v38-testi{flex:none;width:min(80vw,320px);margin:0 14px 0 0;padding:18px 16px;border-radius:18px;background:#fff;border:1px solid #dfe9f7;box-shadow:0 10px 24px rgba(15,45,80,.09);text-align:center;white-space:normal}
.v38-testi img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid #dbeafe;display:block;margin:0 auto 10px;background:#f1f5f9}
.v38-testi .stars{color:#f59e0b;letter-spacing:2px;font-size:14px;margin-bottom:6px}
.v38-testi q{display:block;quotes:none;color:var(--v38-ink);line-height:1.5;font-size:15px;font-weight:600}
.v38-testi .who{margin:10px 0 0;color:var(--v38-muted);font-size:13.5px}.v38-testi .who b{color:var(--v38-ink)}

/* publications LinkedIn */
.v38-li-card{flex:none;width:min(82vw,330px);margin:0 14px 0 0;padding:14px;border-radius:18px;background:#fff;border:1px solid #dfe9f7;box-shadow:0 10px 24px rgba(15,45,80,.09);display:flex;flex-direction:column;gap:10px;white-space:normal}
.v38-li-card header{display:flex;align-items:center;gap:8px;font-weight:800;font-size:13.5px;color:var(--v38-ink)}
.v38-li-card header .in{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:6px;background:#0a66c2;color:#fff;font-weight:900;font-size:14px}
.v38-li-card header time{margin-left:auto;font-weight:600;color:#64748b;font-size:12.5px}
.v38-li-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:#f1f5f9}
.v38-li-card .t{margin:0;color:#1e293b;line-height:1.45;font-size:14.5px;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.v38-li-card .actions{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.v38-li-card .actions button{min-height:40px;padding:0 14px;border-radius:10px;border:0;background:#0a66c2;color:#fff;font-weight:800;cursor:pointer}
.v38-li-card .actions a{font-weight:800;color:#0a66c2;font-size:13.5px}
.v38-vm.li .box{width:min(96vw,520px)}.v38-vm.li iframe{aspect-ratio:auto;height:min(78vh,620px);background:#fff}
.v38-vm .ext{margin:8px 0 0}.v38-vm .ext a{color:#93c5fd;font-weight:700}

/* prochaine séance */
body.landing-v38 .v38-next{margin:22px 0 0}
.v38-next-card{padding:20px 18px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#0a3f93 0%,#0b5bd3 70%,#2d7df0 100%);box-shadow:0 14px 30px rgba(11,91,211,.28)}
.v38-next-card .v38-eyebrow.live{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.35)}
.v38-next-card .v38-eyebrow.live::before{content:"";display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#f87171;animation:v38-dot 1.4s ease-in-out infinite}
html body.landing-v38 .page-wrap .v38-next-card h2{color:#fff!important;font-size:clamp(1.25rem,5.2vw,1.9rem)!important;margin:6px 0 4px!important}
.v38-next-card .meta{margin:0;opacity:.92;font-weight:700}
.v38-next-card .quand{margin:6px 0 0;font-weight:800;font-size:1.05rem}
.v38-count{display:inline-block;margin:10px 0 6px;padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);font-size:1.15rem;font-weight:700}
.v38-count b{font-size:1.5rem;color:var(--v38-gold);font-weight:900}
html body.landing-v38 .page-wrap .v38-next-card .v38-sub{color:rgba(255,255,255,.93);text-align:left}
html body.landing-v38 .page-wrap .v38-next-card p{color:#fff}
.v38-next-card .v38-btn-blue{background:#fff;color:var(--v38-blue-dark)!important}
.v38-next-list{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px solid rgba(255,255,255,.25);display:grid;gap:6px;font-size:13.5px;opacity:.95}
.v38-next-list li{line-height:1.4}
.v38-live-tag{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:5px 12px;border-radius:999px;background:#fee2e2;color:#991b1b;font-weight:800;font-size:12.5px}
.v38-live-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:#ef4444;animation:v38-dot 1.4s ease-in-out infinite}
@keyframes v38-dot{0%,100%{opacity:1}50%{opacity:.25}}

/* ---------- vidéos YouTube : une carte à la fois, défilement toutes les 3 s ---------- */
body.landing-v38 .youtube-auto-block{margin-top:0}
body.landing-v38 .youtube-carousel{margin-left:calc(-1*var(--v38-bleed));margin-right:calc(-1*var(--v38-bleed));padding-left:var(--v38-bleed);padding-right:var(--v38-bleed);scroll-snap-type:x mandatory;scrollbar-width:none}
body.landing-v38 .youtube-carousel::-webkit-scrollbar{display:none}
body.landing-v38 .youtube-video-card{scroll-snap-align:start;position:relative}
body.landing-v38 .youtube-video-card .yt-thumb{position:relative;display:block}
body.landing-v38 .youtube-video-card .yt-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:rgba(220,38,38,.92);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;padding-left:4px;box-shadow:0 8px 20px rgba(0,0,0,.35);pointer-events:none}
@media(max-width:620px){body.landing-v38 .youtube-video-card{flex-basis:80%}}
.v38-dots{display:flex;justify-content:center;gap:7px;margin-top:6px}
.v38-dots i{width:7px;height:7px;border-radius:50%;background:#c3d4ea;transition:width .25s,background .25s}
.v38-dots i.on{width:20px;border-radius:6px;background:var(--v38-blue)}

/* ---------- parcours : visuels fournis ---------- */
body.landing-v38 .home-parcours-videos .path-card-media.has-visuel,.path-card-media.has-visuel{aspect-ratio:1/1;background:#fff}
.path-card-media.has-visuel img{object-fit:contain}
body.landing-v38 .home-parcours-grid{gap:16px}

/* ---------- étapes ---------- */
.v38-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:v38}
.v38-steps li{position:relative;display:grid;grid-template-columns:46px 1fr;column-gap:14px;padding:16px;border-radius:18px;background:#fff;border:1px solid #dfe9f7;box-shadow:0 8px 20px rgba(15,45,80,.06)}
.v38-steps .n{grid-row:1/3;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#0b5bd3,#2d7df0);color:#fff;font-weight:900;font-size:1.2rem}
.v38-steps h3{margin:0;font-size:1.08rem;color:var(--v38-ink)}
.v38-steps p{margin:3px 0 0;color:var(--v38-muted);line-height:1.5;font-size:14.5px}
@media(min-width:900px){.v38-steps{grid-template-columns:repeat(4,minmax(0,1fr))}.v38-steps li{display:block}.v38-steps .n{margin-bottom:10px}}

/* ---------- appel à l'action intermédiaire ---------- */
.v38-band{margin:26px 0 0;padding:22px 18px;border-radius:20px;text-align:center;color:#fff;background:linear-gradient(135deg,#0a3f93,#0b5bd3)}
.v38-band h2,body.landing-v38 .v38-band h2{color:#fff;margin:0 0 6px}
.v38-band p{margin:0 auto 12px;max-width:52ch;opacity:.95;line-height:1.5}
.v38-band .v38-cta-row{justify-content:center}

/* ---------- confiance et transparence (page de paiement) ---------- */
.v38-trust{margin-top:30px}
.v38-trust h2{margin:6px 0 12px;color:var(--v38-ink)}
.v38-trust .home-trust-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:6px 0 16px}
.v38-trust .home-trust-cards article{padding:20px;border-radius:18px;background:#f8fbff;border:1px solid #d9e6f7}
.v38-trust .home-trust-cards h3{margin:0 0 6px;font-size:1.05rem;color:#123c74}
.v38-trust .home-trust-cards p{margin:0 0 10px;color:#475569;line-height:1.5;font-size:14.5px}
.v38-trust .home-trust-cards a{font-weight:800;color:#0b3f88}
@media(max-width:900px){.v38-trust .home-trust-cards{grid-template-columns:1fr}}

/* ---------- fenêtres : agrandissement d'image et vidéo ---------- */
.v38-lb,.v38-vm{position:fixed;inset:0;z-index:10050;display:none;align-items:center;justify-content:center;background:rgba(2,6,23,.92);padding:14px}
.v38-lb.open,.v38-vm.open{display:flex}
.v38-lb img{max-width:96vw;max-height:88vh;border-radius:10px;background:#fff}
.v38-vm .box{width:min(96vw,920px)}
.v38-vm iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:12px;background:#000}
.v38-vm .ttl{color:#e2e8f0;font-weight:700;margin:0 0 8px;font-size:14px;line-height:1.35;padding-right:44px}
.v38-x{position:absolute;top:10px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:28px;line-height:1;cursor:pointer}

/* ---------- barre du bas (mobile) : S'abonner 6 mois (bleu) + WhatsApp (vert clignotant) ---------- */
body.landing-v38 .mobile-action-bar.v38-bar{display:grid!important;grid-template-columns:1.25fr 1fr;gap:10px;height:auto;padding:9px 12px calc(9px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.97);border-top:1px solid #dbe5ef;box-shadow:0 -10px 26px rgba(2,6,23,.14);z-index:9999}
body.landing-v38 .mobile-action-bar.v38-bar a{display:flex!important;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 10px;border-radius:14px;border:0;font-weight:900;font-size:15.5px;line-height:1.15;text-align:center;text-decoration:none}
body.landing-v38 .mobile-action-bar.v38-bar a.v38-bar-sub{background:var(--v38-blue);color:#fff;animation:none;box-shadow:0 6px 16px rgba(11,91,211,.35)}
body.landing-v38 .mobile-action-bar.v38-bar a.v38-bar-wa{background:var(--v38-wa);color:#053b1a;animation:v38-blink 1.25s ease-in-out infinite}
body.landing-v38 .mobile-action-bar.v38-bar a.v38-bar-wa img{width:24px;height:24px}
@keyframes v38-blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(34,197,94,.65)}50%{opacity:.62;box-shadow:0 0 0 12px rgba(34,197,94,0)}}
@media(prefers-reduced-motion:reduce){body.landing-v38 .mobile-action-bar.v38-bar a.v38-bar-wa{animation:none}}
@media(min-width:901px){body.landing-v38 .mobile-action-bar.v38-bar{left:50%;right:auto;transform:translateX(-50%);width:min(560px,92vw);bottom:12px;border-radius:18px;border:1px solid #dbe5ef}}
body.landing-v38{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
body.landing-v38 .whatsapp-float{display:none!important}

/* ---------- consentement (pixel de suivi, seulement si configuré) ---------- */
.v38-consent{position:fixed;left:10px;right:10px;bottom:84px;z-index:10040;background:#0f172a;color:#e2e8f0;border-radius:14px;padding:12px 14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13.5px;line-height:1.4;box-shadow:0 12px 30px rgba(2,6,23,.4)}
.v38-consent p{margin:0;flex:1 1 220px}
.v38-consent a{color:#93c5fd}
.v38-consent button{min-height:40px;padding:0 16px;border-radius:10px;border:0;font-weight:800;cursor:pointer}
.v38-consent .ok{background:#2563eb;color:#fff}.v38-consent .no{background:#334155;color:#e2e8f0}

/* Boutons bleus sur fond bleu (bandeau et appel final) : version blanche, plus visible */
.v38-band .v38-btn-blue,.home-final-cta .v38-btn-blue{background:#fff;color:var(--v38-blue-dark)!important;box-shadow:0 10px 24px rgba(2,6,23,.25)}
.home-final-cta .v38-btn-ghost{background:rgba(255,255,255,.14)}

/* mention : accès Classroom après paiement */
body.landing-v38 .v38-access{margin:10px 0 0;padding:9px 12px;border-radius:12px;background:rgba(255,209,102,.16);border:1px solid rgba(255,209,102,.5);font-size:.95rem;line-height:1.4;max-width:60ch}
.v38-access-card{margin:0 0 16px;padding:14px 16px;border-radius:14px;background:#eff6ff;border:1px solid #bfdbfe;color:#0f2f57;line-height:1.5}


/* paiement avant inscription (hors Maroc) */
.v39-prepay-notice{margin:12px 0;padding:12px 14px;border-radius:12px;background:#eff6ff;border:1px solid #bfdbfe;color:#0f2f57;line-height:1.5;font-size:14.5px}
.v39-prepay-box{margin:18px 0;padding:20px 16px;border-radius:18px;background:#fff;border:1px solid #dfe9f7;box-shadow:0 10px 24px rgba(15,45,80,.09)}
.v39-prepay-box h2{margin:8px 0;color:#0f2f57}
.v39-prepay-buttons{max-width:460px;margin:14px auto 6px;min-height:60px}
.v39-link{background:none;border:0;padding:0;color:#0b5bd3;font-weight:700;cursor:pointer;text-decoration:underline}
.v39-dossier{margin:0 0 16px}
