/* =========================================================== projet-def.css — page projet « Des Étoiles et des Femmes » Fil d'ariane fixe au-dessus de la nav (la nav se décale via une classe posée sur le temps que cette page est montée — Nav.jsx et home-b.css restent intacts) · hero épuré + logo à cheval centré · chiffres 50/50 avec compteur · vidéo · le projet (accordéon 3 items) · témoignages en bandeau défilant infini · soutenir (3 voies) · presse · galerie plein-largeur en fin de page. Hiérarchie typographique unifiée : eyebrow 11px, H2 24px/600, corps 15px/1.6. Charte stricte, KoHo. Rayons & ombres : tokens du repo. =========================================================== */ .pageProjetDef{ --coral:#E4572E; --pd-hero:clamp(52px,10vw,132px); --pd-mono:clamp(60px,11vw,150px); --pdef-crumb-h:28px; background:var(--teal-deep); color:#fff; } .pageProjetDef .wrap{max-width:1280px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)} .pageProjetDef section{position:relative} .pageProjetDef h1,.pageProjetDef h2,.pageProjetDef h3, .pageProjetDef h4,.pageProjetDef h5,.pageProjetDef h6, .pageProjetDef p{color:inherit} .pageProjetDef .reveal{opacity:0;transform:translateY(30px)} .pageProjetDef .reveal.is-in{opacity:1;transform:none; transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)} .pageProjetDef a:focus-visible, .pageProjetDef button:focus-visible{outline:2px solid var(--gold-light);outline-offset:3px;border-radius:3px} /* ---- Hiérarchie typographique unifiée ---- */ .pdef-sec{display:block;font-family:'KoHo',sans-serif;font-weight:700; font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);margin-bottom:12px} .pdef-h2{font-family:'KoHo',sans-serif;font-weight:700;text-transform:none; line-height:1.2;letter-spacing:-.015em;font-size:clamp(28px,3.4vw,38px);margin:0 0 16px} .pdef-h2 em{font-style:italic;color:var(--gold-light)} .pageProjetDef p{font-size:15px;line-height:1.6} .pageProjetDef .btnb{font-family:'KoHo',sans-serif;font-weight:700;text-transform:uppercase; letter-spacing:.02em;font-size:13px;border-radius:var(--r-pill);padding:14px 22px; display:inline-flex;align-items:center;gap:10px;line-height:1;cursor:pointer; transition:transform var(--t-base) var(--ease-out),background var(--t-base),border-color var(--t-base)} .pageProjetDef .btnb--gold{background:var(--gold);color:var(--teal-deep);border:0} .pageProjetDef .btnb--gold:hover{transform:translateY(-2px)} .pageProjetDef .btnb--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.5)} .pageProjetDef .btnb--ghost:hover{border-color:#fff;transform:translateY(-2px)} .pageProjetDef .btnb--outline-ink{background:transparent;color:var(--teal-deep);border:1px solid var(--teal-deep)} .pageProjetDef .btnb--outline-ink:hover{background:var(--teal-deep);color:#fff;transform:translateY(-2px)} .pageProjetDef .btnb .arrow{transition:transform var(--t-base) var(--ease-out)} .pageProjetDef .btnb:hover .arrow{transform:translateX(4px)} /* =========================================================== FIL D'ARIANE — fixe, AU-DESSUS de la nav =========================================================== */ .pdef-crumb2{position:fixed;top:0;left:0;right:0;z-index:200;height:var(--pdef-crumb-h); background:rgba(255,255,255,.96);border-bottom:1px solid var(--teal-line); backdrop-filter:saturate(1.2) blur(4px)} .pdef-crumb2__inner{display:flex;align-items:center;justify-content:center;height:100%;gap:0; font-family:'KoHo',sans-serif;font-size:11px;letter-spacing:.05em;text-transform:uppercase; color:var(--ink-mid);white-space:nowrap;overflow:hidden} .pdef-crumb2__inner a{color:var(--teal);font-weight:700} .pdef-crumb2__inner a:hover,.pdef-crumb2__inner a:focus-visible{color:var(--teal-deep)} .pdef-crumb2__inner span[aria-current]{color:var(--ink);font-weight:700} .pdef-crumb2__ellipsis{display:none;color:var(--ink-mid)} /* mobile : réduit à « Accueil / … » */ @media(max-width:640px){ .pdef-crumb2__rest{display:none} .pdef-crumb2__ellipsis{display:inline} } /* la nav (fixe, non modifiée) se décale vers le bas tant que cette page est montée. Valeur en dur (28px) : --pdef-crumb-h est scopée à .pageProjetDef, hors de portée ici puisque .mnav est un frère du composant de page, pas un descendant. */ body.pdef-has-crumb .mnav{top:28px} /* =========================================================== HERO — photo, titre, sous-titre. Logo à cheval centré ensuite. =========================================================== */ .pdef-heroband{position:relative} .pdef-hero{position:relative;min-height:78svh;display:flex;align-items:flex-end;overflow:hidden; background:var(--teal-deep);color:#fff;padding:var(--pdef-crumb-h) 0 clamp(48px,8vh,96px)} .pdef-hero__media{position:absolute;inset:0} .pdef-hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 30%} .pdef-hero__scrim{position:absolute;inset:0;background:linear-gradient(180deg, rgba(6,33,31,.55)0%,rgba(6,33,31,.30)26%,rgba(6,33,31,.66)56%,rgba(6,33,31,.9)82%,rgba(6,33,31,.97)100%)} .pdef-hero__inner{position:relative;z-index:2;width:100%; display:flex;flex-direction:column;align-items:center;text-align:center} .pdef-hero__eb{font-family:'KoHo',sans-serif;font-weight:700;font-size:11px;letter-spacing:.1em; text-transform:uppercase;color:var(--gold-light)} .pdef-hero__t{font-family:'KoHo',sans-serif;font-weight:700;text-transform:uppercase;line-height:.92; letter-spacing:-.035em;font-size:var(--pd-hero);margin:16px auto 0;max-width:18ch;color:#fff} .pdef-hero__t em{font-style:italic;color:var(--gold-light)} .pdef-hero__sub{font-size:15px;line-height:1.6;color:rgba(255,255,255,.85);max-width:52ch; margin:clamp(18px,2.6vw,30px) auto 0} .pdef-hero__cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:clamp(22px,3vh,34px)} /* logo rond à cheval : centré horizontalement, mord sur la limite hero / chiffres, aucun fond coloré derrière — cercle blanc posé en absolu, pas d'élément de flux */ .pdef-hero__logo{position:absolute;left:50%;top:100%;transform:translate(-50%,-50%);z-index:6; width:clamp(80px,9vw,110px);height:clamp(80px,9vw,110px);border-radius:50%; background:#fff;box-shadow:var(--sh-lg);padding:12px;display:grid;place-items:center} .pdef-hero__logo img{width:100%;height:100%;object-fit:contain;border-radius:50%} /* =========================================================== CHIFFRES — rythme 50/50 : présentation + 4 blocs colorés, chiffres qui comptent au scroll (IntersectionObserver + rAF) =========================================================== */ .pdef-stats{background:var(--cream);color:var(--ink);padding:clamp(56px,8vw,100px) 0 clamp(60px,9vw,120px)} .pdef-stats .pdef-h2{color:var(--ink)} .pdef-stats2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center} .pdef-stats2__intro{max-width:46ch} .pdef-stats2__intro p{color:var(--ink-mid);margin:0 0 24px;max-width:42ch} .pdef-stats2__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.6vw,20px)} .pdef-stat2{position:relative;border-radius:var(--r-6);padding:clamp(22px,2.4vw,30px); min-height:clamp(150px,15vw,184px);display:flex;flex-direction:column;justify-content:flex-end; overflow:hidden} .pdef-stat2::before{content:'';position:absolute;top:0;left:0;right:0;height:3px} .pdef-stats2__grid > .pdef-stat2:nth-child(odd)::before{background:var(--gold)} .pdef-stats2__grid > .pdef-stat2:nth-child(even)::before{background:var(--teal)} .pdef-stat2__n{font-family:'KoHo',sans-serif;font-weight:700;line-height:.85;letter-spacing:-.03em; font-size:clamp(38px,4.4vw,60px)} .pdef-stat2__l{margin-top:10px;font-size:13px;line-height:1.35;max-width:20ch} .pdef-stat2--teal{background:var(--teal);color:#fff} .pdef-stat2--gold{background:var(--gold);color:var(--teal-deep)} .pdef-stat2--violet{background:#9A5BA8;color:#fff} .pdef-stat2--deep{background:var(--teal-dark);color:#fff} .pdef-stat2--gold .pdef-stat2__l{color:var(--teal-deep);opacity:.82} .pdef-stat2--teal .pdef-stat2__l,.pdef-stat2--violet .pdef-stat2__l,.pdef-stat2--deep .pdef-stat2__l{color:#fff} @media(max-width:900px){.pdef-stats2{grid-template-columns:1fr}} @media(max-width:560px){.pdef-stats2__grid{grid-template-columns:1fr}} /* =========================================================== LE PROJET — colonne 50/50 : texte + accordéon (texte seul, sans photo) à gauche, vidéo à droite. Accordéon : bordure basse, chevron pivote, un seul ouvert à la fois, 300ms. =========================================================== */ .pdef-projet{background:var(--teal-dark);color:#fff;padding:clamp(64px,10vw,130px) 0} .pdef-projet .pdef-sec{color:var(--gold-light)} .pdef-projet .pdef-h2{color:#fff} .pdef-projet__split{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,5vw,64px);align-items:start} .pdef-projet__lede{color:rgba(255,255,255,.9);max-width:52ch;margin:0 0 clamp(28px,4vw,44px)} /* vidéo — colonne de droite, reste visible pendant que l'accordéon se déplie */ .pdef-projet__media{position:sticky;top:56px} .pdef-projet__frame{position:relative;border-radius:var(--r-7);overflow:hidden;aspect-ratio:16/9; box-shadow:var(--sh-lg);background:var(--teal-deep)} .pdef-projet__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0} .pdef-projet__play{position:absolute;inset:0;width:100%;height:100%;border:0;background:none; cursor:pointer;display:flex;align-items:flex-end;padding:clamp(20px,3vw,40px)} .pdef-projet__play img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .pdef-projet__scrim{position:absolute;inset:0;background:rgba(6,33,31,.34)} .pdef-projet__playlabel{position:relative;z-index:2;display:inline-flex;align-items:center;gap:10px; background:var(--gold);color:var(--teal-deep);font-family:'KoHo',sans-serif;font-weight:700; text-transform:uppercase;letter-spacing:.03em;font-size:13px;border-radius:var(--r-pill); padding:13px 22px;transition:transform var(--t-base) var(--ease-out)} .pdef-projet__play:hover .pdef-projet__playlabel, .pdef-projet__play:focus-visible .pdef-projet__playlabel{transform:translateY(-2px)} .pdef-projet__credit{margin:14px 0 0;font-size:12px;letter-spacing:.04em;text-align:center; color:rgba(255,255,255,.62)} /* teaser des 2 formations DEF — sous la vidéo, équilibre la colonne de droite */ .pdef-projet__formations{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:clamp(20px,3vw,28px)} .pdef-projet__fcard{display:flex;flex-direction:column;gap:4px;background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.2);border-radius:var(--r-5);padding:16px 18px;color:#fff; transition:background var(--t-base),border-color var(--t-base)} .pdef-projet__fcard:hover,.pdef-projet__fcard:focus-visible{ background:rgba(255,255,255,.12);border-color:var(--gold-light)} .pdef-projet__fname{font-family:'KoHo',sans-serif;font-weight:700;font-size:14px; text-transform:uppercase;letter-spacing:-.01em} .pdef-projet__fmeta{font-size:12px;color:rgba(255,255,255,.7)} .pdef-projet__farrow{align-self:flex-end;margin-top:6px;color:var(--gold-light);font-weight:700; transition:transform var(--t-base)} .pdef-projet__fcard:hover .pdef-projet__farrow, .pdef-projet__fcard:focus-visible .pdef-projet__farrow{transform:translateX(4px)} @media(max-width:480px){.pdef-projet__formations{grid-template-columns:1fr}} @media(max-width:900px){ .pdef-projet__split{grid-template-columns:1fr} .pdef-projet__media{position:static} } .pdef-acc{border-top:1px solid rgba(255,255,255,.18)} .pdef-acc__item{border-bottom:1px solid rgba(255,255,255,.18)} .pdef-acc__h{margin:0} .pdef-acc__btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px; background:none;border:0;cursor:pointer;color:#fff;text-align:left; padding:clamp(18px,2.6vw,26px) 0;font-family:'KoHo',sans-serif; transition:color 300ms var(--ease-out)} .pdef-acc__label{font-weight:700;font-size:19px;letter-spacing:-.01em;line-height:1.2} .pdef-acc__chev{flex:none;width:12px;height:12px;border-right:2px solid currentColor; border-bottom:2px solid currentColor;transform:rotate(45deg);margin-right:4px; transition:transform 300ms var(--ease-out)} .pdef-acc__btn:hover,.pdef-acc__btn:focus-visible{color:var(--gold-light)} .pdef-acc__btn:focus-visible{outline:2px solid var(--gold-light);outline-offset:4px;border-radius:3px} .pdef-acc__item.is-open .pdef-acc__label{color:var(--gold-light)} .pdef-acc__item.is-open .pdef-acc__chev{transform:rotate(-135deg)} .pdef-acc__panel{max-height:0;overflow:hidden;transition:max-height 300ms var(--ease-out)} .pdef-acc__item.is-open .pdef-acc__panel{max-height:1200px} .pdef-acc__body{padding:0 0 clamp(28px,4vw,44px)} .pdef-acc__k{display:block;font-family:'KoHo',sans-serif;font-weight:700;text-transform:uppercase; letter-spacing:-.02em;font-size:18px;line-height:1.15;color:var(--gold-light);margin:0 0 10px} .pdef-acc__body p{color:rgba(255,255,255,.9);max-width:46ch;margin:0} .pdef-acc__stat{margin-top:clamp(16px,2.2vw,24px)} .pdef-acc__stat strong{display:block;font-family:'KoHo',sans-serif;font-weight:700; font-size:clamp(24px,3vw,38px);color:#fff;letter-spacing:-.02em;line-height:1} .pdef-acc__stat span{font-size:12.5px;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.04em} @media(prefers-reduced-motion:reduce){ .pdef-acc__panel,.pdef-acc__chev,.pdef-acc__btn{transition:none} } /* =========================================================== TÉMOIGNAGES — bandeau défilant en boucle infinie (marquee CSS pur) =========================================================== */ .pdef-testi{background:var(--cream);color:var(--ink);padding:clamp(64px,10vw,130px) 0} .pdef-testi .pdef-h2{color:var(--ink)} .pdef-tmarquee{overflow:hidden;margin-top:clamp(28px,4vw,44px); mask-image:linear-gradient(to right,transparent 0%,black 6%,black 94%,transparent 100%); -webkit-mask-image:linear-gradient(to right,transparent 0%,black 6%,black 94%,transparent 100%)} .pdef-tmarquee__track{display:flex;gap:16px;width:max-content; animation:pdefTestiScroll 30s linear infinite} .pdef-tmarquee:hover .pdef-tmarquee__track, .pdef-tmarquee:focus-within .pdef-tmarquee__track{animation-play-state:paused} .pdef-tmarquee__item{flex:0 0 auto} @keyframes pdefTestiScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}} /* carte témoignage — format compact du bandeau */ .pdef-tcard{width:280px;height:100%;border-radius:var(--r-6);padding:20px; display:flex;flex-direction:column;gap:10px;box-shadow:var(--sh-md);min-height:260px} .pdef-tcard--teal{background:var(--teal);color:#fff} .pdef-tcard--violet{background:#9A5BA8;color:#fff} .pdef-tcard--cream{background:var(--off-white);color:var(--ink);border:1px solid var(--teal-line)} .pdef-tcard--deep{background:var(--teal-dark);color:#fff} .pdef-tcard__head{display:flex;flex-direction:column;gap:8px} .pdef-tcard__photo{width:64px;aspect-ratio:1;flex:none;border-radius:50%; object-fit:cover;background:var(--teal-deep)} .pdef-tcard__photo--ph{border:2px dashed rgba(255,255,255,.5);background:transparent} .pdef-tcard--cream .pdef-tcard__photo--ph{border-color:var(--teal-line)} .pdef-tcard.is-bw .pdef-tcard__photo{filter:grayscale(1)} .pdef-tcard__badge{align-self:flex-start;background:var(--teal-deep);color:#fff;font-family:'KoHo',sans-serif; font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.3; border-radius:var(--r-pill);padding:5px 10px} .pdef-tcard__name{font-family:'KoHo',sans-serif;font-weight:700;text-transform:uppercase; font-size:18px;line-height:1;letter-spacing:-.02em;margin:0} .pdef-tcard .pdef-tcard__accroche{margin:0;font-style:italic;font-weight:600;font-size:12.5px;line-height:1.25;opacity:.92} .pdef-tcard .pdef-tcard__quote{margin:0;font-size:13px;line-height:1.5;flex:1} @media(prefers-reduced-motion:reduce){ .pdef-tmarquee__track{animation:none;overflow-x:auto;max-width:100%} } /* =========================================================== SOUTENIR — texte + CTA à gauche, logos partenaires à droite (corail) =========================================================== */ .pdef-support{background:var(--coral);color:#fff;padding:clamp(60px,9vw,120px) 0} .pdef-support .pdef-sec{color:var(--teal-deep);background:rgba(255,255,255,.92); display:inline-block;padding:6px 12px;border-radius:var(--r-pill);letter-spacing:.1em} .pdef-support .pdef-h2{color:#fff} .pdef-support__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:center} /* corail #E4572E : blanc n'y dépasse jamais ~3,7:1 → l'AA "grand format" (3:1) exige soit ≥24px, soit ≥18,66px en gras. On prend la 2e option : ça reste bien plus proche des 15px du reste de la page qu'un corps à 24-30px, tout en restant conforme. */ .pdef-support__inner p{font-size:19px;font-weight:700;line-height:1.5;color:#fff; max-width:40ch;margin:clamp(14px,2vw,22px) 0 0} /* option A : 1 CTA fort pleine largeur + 2 secondaires côte à côte, plus discrets */ .pdef-support__cta{display:flex;flex-direction:column;gap:10px;margin-top:clamp(24px,3vw,32px);max-width:420px} .pdef-support__cta .btnb{justify-content:center} .pdef-support__cta-main{width:100%} .pdef-support__cta-row{display:grid;grid-template-columns:1fr 1fr;gap:10px} .pdef-support__cta-sub{font-size:11px;padding:11px 12px;text-align:center;white-space:normal;line-height:1.25} @media(max-width:400px){.pdef-support__cta-row{grid-template-columns:1fr}} /* cluster de logos partenaires — carte accentuée au centre = le programme */ .pdef-support__logos{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px} .pdef-support__logos::before{content:'';position:absolute;inset:-10%;z-index:0; background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%)} .pdef-logogrid{position:relative;z-index:1;display:flex;justify-content:center;gap:16px} /* ombre affinée : grand flou, décalage quasi nul, teinte chaude proche du corail plutôt que le token --sh-* (teinte froide qui « boîtait » sur le fond corail) */ .pdef-logocard{position:relative;display:flex;width:clamp(96px,7.5vw,116px);height:clamp(96px,7.5vw,116px); flex:none;background:var(--off-white);border-radius:var(--r-6);border:1px solid rgba(255,255,255,.55); box-shadow:0 10px 26px -4px rgba(40,14,4,.28)} .pdef-logocard img{margin:auto;max-width:64%;max-height:64%;object-fit:contain} .pdef-logocard--hub{background:#fff;border:1px solid var(--teal-deep); box-shadow:0 12px 32px -4px rgba(40,14,4,.34)} .pdef-logocard--hub img{max-width:72%;max-height:72%} @media(max-width:820px){ .pdef-support__inner{grid-template-columns:1fr;align-items:start} .pdef-support__logos{margin-top:clamp(32px,6vw,48px)} } @media(max-width:480px){.pdef-logocard{width:84px;height:84px}} /* =========================================================== PRESSE — 3 derniers articles en cartes + mentions =========================================================== */ .pdef-presse{background:var(--cream);color:var(--ink);padding:clamp(60px,9vw,120px) 0} .pdef-presse .pdef-h2{color:var(--ink)} .pdef-news{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,22px); margin-top:clamp(28px,4vw,48px)} .pdef-news__card{display:flex;flex-direction:column;gap:12px;background:var(--off-white); border:1px solid var(--teal-line);border-radius:var(--r-6);padding:clamp(18px,2.2vw,26px); min-height:clamp(150px,13vw,180px);transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base)} .pdef-news__card:hover,.pdef-news__card:focus-visible{transform:translateY(-4px);box-shadow:var(--sh-md)} .pdef-news__card:focus-visible{outline:2px solid var(--teal-deep);outline-offset:3px} .pdef-news__top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:26px} .pdef-news__logo{height:24px;width:auto;max-width:118px;object-fit:contain;object-position:left center} .pdef-news__src{font-family:'KoHo',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em; font-size:13px;color:var(--teal)} .pdef-news__tag{flex:none;font-family:'KoHo',sans-serif;font-size:10px;font-weight:700;letter-spacing:.06em; text-transform:uppercase;color:#fff;background:var(--teal-deep);border-radius:var(--r-pill);padding:4px 10px} .pdef-news__title{font-family:'KoHo',sans-serif;font-weight:700;font-size:16px; line-height:1.3;letter-spacing:-.01em;color:var(--ink)} .pdef-news__date{margin-top:auto;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-mid)} .pdef-presse .pdef-news__also{margin:clamp(22px,3vw,34px) 0 0;font-size:13px;line-height:1.7;color:var(--ink-mid)} .pdef-news__also b{font-weight:700;color:var(--ink);text-transform:uppercase;letter-spacing:.04em;font-size:11.5px} @media(max-width:900px){.pdef-news{grid-template-columns:1fr}} /* =========================================================== GALERIE — bandeau plein-largeur, défilement auto lent en boucle. Même crème que la presse au-dessus et le rideau du footer en dessous : aucune coupure de section visible, pas de fondu aux bords. =========================================================== */ .pdef-gallery{overflow:hidden;height:400px;background:var(--cream)} .pdef-gallery__track{display:flex;height:100%;width:max-content; animation:pdefGalleryScroll 48s linear infinite} .pdef-gallery:hover .pdef-gallery__track, .pdef-gallery:focus-within .pdef-gallery__track{animation-play-state:paused} .pdef-gallery__item{flex:0 0 auto;width:clamp(240px,26vw,340px);height:100%} .pdef-gallery__item img{width:100%;height:100%;object-fit:cover;display:block} @keyframes pdefGalleryScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}} /* ---- prefers-reduced-motion ---- */ @media(prefers-reduced-motion:reduce){ .pageProjetDef .reveal{opacity:1;transform:none;transition:none} .pageProjetDef .btnb,.pdef-projet__playlabel,.pdef-news__card{transition:none} .pdef-gallery__track{animation:none} }