/*
Theme Name: Jessy Blanchard Formation
Description: Thème sur mesure transposé des maquettes Claude Design validées par Jessy Blanchard (accueil, home staging, marketing digital). Les pages sont dans parts/*.html.
Author: filioform
Version: 1.0.0
Text Domain: jessy-blanchard-formation
*/

/* Polices hébergées sur le site (aucun appel à Google Fonts) */
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Poppins;src:url("assets/fonts/poppins-latin-500-italic.woff2") format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Questrial;src:url("assets/fonts/questrial-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"ITC Avant Garde Gothic Std";src:url("assets/fonts/AvantGarde-Demi.otf") format("opentype");font-weight:600;font-display:swap}
@font-face{font-family:"ITC Avant Garde Gothic Std";src:url("assets/fonts/AvantGarde-Bold.otf") format("opentype");font-weight:700;font-display:swap}

/* Base de la maquette */
body{margin:0;background:#fffbf8}
html{scroll-behavior:smooth}
a{color:#132634}a:hover{color:#132634}
summary{list-style:none;cursor:pointer}
summary::-webkit-details-marker{display:none}
:focus-visible{outline:3px solid #977bf3;outline-offset:3px}

/* Menu repliable sur téléphone (ajout : absent de la maquette) */
.jbf-entete{position:relative}
.jbf-burger{display:none}
@media (max-width: 1280px){
  .jbf-entete-in{flex-wrap:nowrap!important}
  .jbf-burger{display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border:0;border-radius:999px;background:transparent;color:#faeadd;cursor:pointer}
  .jbf-burger .jbf-ico-fermer{display:none}
  .jbf-burger[aria-expanded="true"] .jbf-ico-ouvrir{display:none}
  .jbf-burger[aria-expanded="true"] .jbf-ico-fermer{display:block}
  .jbf-nav{display:none!important;position:absolute;left:0;right:0;top:100%;z-index:50;background:#132634;flex-direction:column;align-items:flex-start!important;gap:0!important;padding:4px clamp(20px,4vw,32px) 24px;box-sizing:border-box;box-shadow:0 12px 24px rgba(19,38,52,.25)}
  .jbf-nav.ouvert{display:flex!important}
  .jbf-nav a{display:block;width:100%;padding:13px 0;border-top:1px solid rgba(250,234,221,.15)}
  .jbf-nav a:last-child{width:auto;margin-top:14px;padding:12px 24px!important;border-top:0}
}

/* Formulaire de contact */
.jbf-pot{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.jbf-form{position:relative}
.jbf-retour{grid-column:1/-1;padding:12px 16px;border-radius:8px;font-size:14px;font-weight:500}
.jbf-retour--ok{background:#d8f80033;border:1px solid #132634}
.jbf-retour--erreur{background:#ff3e1a1a;border:1px solid #ff3e1a}

/* Pages simples (mentions légales, confidentialité, CGV) */
.jbf-page{max-width:860px;margin:0 auto;padding:clamp(48px,8vw,88px) clamp(20px,4vw,32px);box-sizing:border-box}
.jbf-page h1{font-family:"ITC Avant Garde Gothic Std","Century Gothic",sans-serif;font-weight:700;font-size:clamp(32px,5vw,48px);line-height:1.1;margin:0 0 32px}
.jbf-page h2{font-family:"ITC Avant Garde Gothic Std","Century Gothic",sans-serif;font-weight:600;font-size:24px;margin:40px 0 12px}

/* En-tête sur toute la largeur : logo à gauche, menu et bouton à droite (demande de Thierry, 10/11) */
.jbf-entete-in{max-width:none!important;padding:20px clamp(20px,3vw,48px)!important}
.jbf-entete-in > a:first-child{margin-right:auto}
.jbf-nav{justify-content:flex-end}
/* Logo sans slogan : un peu d'air autour (le fichier n'a aucune marge) */
.jbf-entete-in > a:first-child{padding:6px 0}
@media (max-width: 600px){.jbf-logo{height:36px!important}}

/* Animation d'arrivée sur l'accueil (à chaque chargement) */
@keyframes jbf-gauche{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
@keyframes jbf-haut{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes jbf-pop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}
@keyframes jbf-pastille{0%{opacity:0;transform:translateY(-36px) rotate(-32deg) scale(.7)}60%{opacity:1;transform:translateY(4px) rotate(-3deg) scale(1.05)}100%{opacity:1;transform:rotate(-7deg)}}
@keyframes jbf-monte{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
@keyframes jbf-net{from{opacity:0;filter:blur(10px)}to{opacity:1;filter:none}}
@media (prefers-reduced-motion: no-preference){
  .jbf-anim .jbf-entete-in > a:first-child{animation:jbf-gauche .8s cubic-bezier(.2,.7,.2,1) .1s both}
  .jbf-anim .jbf-nav > a{animation:jbf-haut .6s cubic-bezier(.2,.7,.2,1) both}
  .jbf-anim .jbf-nav > a:nth-child(1){animation-delay:.25s}
  .jbf-anim .jbf-nav > a:nth-child(2){animation-delay:.33s}
  .jbf-anim .jbf-nav > a:nth-child(3){animation-delay:.41s}
  .jbf-anim .jbf-nav > a:nth-child(4){animation-delay:.49s}
  .jbf-anim .jbf-nav > a:nth-child(5){animation-delay:.57s}
  .jbf-anim .jbf-nav > a:last-child{animation:jbf-pop .7s cubic-bezier(.2,.7,.2,1) .75s both}
  .jbf-anim .jbf-burger{animation:jbf-pop .7s cubic-bezier(.2,.7,.2,1) .4s both}
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(1){animation:jbf-pastille .9s cubic-bezier(.2,.7,.2,1) .5s both}
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(2){animation:jbf-monte .9s cubic-bezier(.2,.7,.2,1) .7s both}
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(2) em{animation:jbf-net 1s ease-out 1.25s both}
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(3){animation:jbf-monte .8s cubic-bezier(.2,.7,.2,1) .95s both}
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(4){animation:jbf-monte .8s cubic-bezier(.2,.7,.2,1) 1.15s both}
}
/* Portrait de Jessy à droite du héros (ESSAI du 10/11, portrait non définitif : remplacer assets/photos/portrait-hero-test.webp) */
.jbf-hero-portrait{position:absolute;bottom:0;right:calc(max((100% - 1240px) / 2, 0px) + clamp(20px, 4vw, 32px));height:calc(100% - 32px);max-height:640px;width:auto;display:block;pointer-events:none}
@media (max-width: 1199px){.jbf-hero-portrait{display:none}}
@media (min-width: 1200px){.jbf-entete + section > span:first-of-type{right:auto!important;left:24px}}
@keyframes jbf-droite{from{opacity:0;transform:translateX(48px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: no-preference){.jbf-anim .jbf-hero-portrait{animation:jbf-droite 1.1s cubic-bezier(.2,.7,.2,1) .55s both}}
/* Portrait du haut en « photo dans une forme arrondie » (réglage jbf_portrait_heros_forme = forme) :
   forme organique asymétrique qui ondule lentement après l'animation d'arrivée */
.jbf-hero-portrait--forme{top:48px;bottom:auto;height:calc(100% - 96px);max-height:560px;width:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 30%;border-radius:62% 38% 54% 46% / 46% 55% 45% 54%;animation:jbf-onde 14s ease-in-out infinite alternate}
@keyframes jbf-onde{0%{border-radius:62% 38% 54% 46% / 46% 55% 45% 54%}50%{border-radius:44% 56% 40% 60% / 58% 42% 58% 42%}100%{border-radius:56% 44% 62% 38% / 40% 60% 48% 52%}}
@media (prefers-reduced-motion: reduce){.jbf-hero-portrait--forme{animation:none}}
/* Photo plein écran du haut de l'accueil, sous le voile marine (réglage jbf_hero_fond) */
.jbf-hero-fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.jbf-hero-fond ~ span:first-of-type{display:none}/* Voile marine plus dense quand une photo est en fond (Thierry, 10/11) : 0,55 -> 0,78, la photo transparaît deux fois moins */
.jbf-hero-fond + div{opacity:.78!important}


/* Sous-menu Formations (13/11/2026) */
.jbf-sous{position:relative}
.jbf-sous-btn{display:flex;align-items:center;gap:6px;padding:0;border:0;background:none;color:#faeadd;font:inherit;cursor:pointer}
.jbf-sous-btn svg{transition:transform .2s}
.jbf-sous.ouvert .jbf-sous-btn svg{transform:rotate(180deg)}
.jbf-sous-menu{display:none;position:absolute;top:100%;left:-18px;z-index:60;padding-top:14px}
.jbf-sous-menu a{display:block;white-space:nowrap;color:#132634;text-decoration:none;padding:11px 18px;border-radius:10px}
.jbf-sous-menu a:hover,.jbf-sous-menu a:focus-visible{background:#d8f800}
@media (min-width: 1281px){
  .jbf-sous-menu{min-width:220px}
  .jbf-sous-menu::before{content:'';position:absolute;inset:14px 0 0;background:#faeadd;border-radius:16px;box-shadow:0 14px 30px rgba(19,38,52,.25);z-index:-1}
  .jbf-sous-menu{padding:22px 8px 8px}
  .jbf-sous.ouvert .jbf-sous-menu,.jbf-sous:focus-within .jbf-sous-menu{display:block}
}
@media (min-width: 1281px) and (hover: hover){.jbf-sous:hover .jbf-sous-menu{display:block}.jbf-sous:hover .jbf-sous-btn svg{transform:rotate(180deg)}}
@media (max-width: 1280px){
  .jbf-sous{width:100%}
  .jbf-sous-btn{width:100%;justify-content:space-between;padding:13px 0;font-weight:600}
  .jbf-sous-menu{position:static;padding:0 0 6px 16px}
  .jbf-sous.ouvert .jbf-sous-menu{display:block}
  .jbf-nav .jbf-sous-menu a,.jbf-nav .jbf-sous-menu a:last-child{color:#faeadd;width:100%;margin-top:0;padding:11px 0!important;border-top:0;border-radius:0}
  .jbf-sous-menu a:hover{background:none;color:#d8f800}
}
@media (prefers-reduced-motion: no-preference){.jbf-anim .jbf-nav > .jbf-sous{animation:jbf-haut .6s cubic-bezier(.2,.7,.2,1) .25s both}}

/* Textes légaux (13/11/2026) */
.jbf-legal{font-size:16px;line-height:1.65}
.jbf-legal p{margin:0 0 14px}
.jbf-legal ul{margin:0 0 14px;padding-left:22px}
.jbf-legal li{margin:0 0 6px}
.jbf-legal a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.jbf-legal .jbf-legal-maj{font-size:14px;opacity:.7;margin-bottom:28px}
.jbf-page .jbf-legal h2{font-size:21px;margin:36px 0 10px}

/* Bandeau d'onglets collé au bas du haut de page (13/11/2026) : chevauche d'1 px pour qu'aucun filet n'apparaisse, quel que soit le navigateur ou le zoom */
.jbf-onglets{position:relative;z-index:1;margin-top:-1px!important}

/* Pages formation (13/11/2026) : le bouton du haut de page arrive après les textes ; les 5 onglets, en même temps que les textes, se déroulent l'un après l'autre, de gauche à droite, depuis le bas du haut de page (comme un store) */
@keyframes jbf-onglet-store{0%{clip-path:inset(0 0 100% 0)}100%{clip-path:inset(0 0 0 0)}}
@keyframes jbf-onglet-texte{0%{color:transparent;letter-spacing:.18em}100%{letter-spacing:.03em}}
@media (prefers-reduced-motion: no-preference){
  .jbf-anim .jbf-entete + section > div:last-of-type > :nth-child(5){animation:jbf-pop .7s cubic-bezier(.2,.7,.2,1) 1.35s both}
  .jbf-anim-onglets .jbf-onglets > *{animation:jbf-onglet-store .75s cubic-bezier(.65,0,.25,1) both,jbf-onglet-texte .9s cubic-bezier(.2,.7,.2,1) both}
  .jbf-anim-onglets .jbf-onglets > :nth-child(1){animation-delay:.35s,.5s}
  .jbf-anim-onglets .jbf-onglets > :nth-child(2){animation-delay:.45s,.6s}
  .jbf-anim-onglets .jbf-onglets > :nth-child(3){animation-delay:.55s,.7s}
  .jbf-anim-onglets .jbf-onglets > :nth-child(4){animation-delay:.65s,.8s}
  .jbf-anim-onglets .jbf-onglets > :nth-child(5){animation-delay:.75s,.9s}
}

@media (max-width: 899px){.jbl-decor{display:none}}

/* FAQ de l'accueil : croix qui pivote, légère ombre à l'ouverture (13/11/2026) */
#faq details{box-sizing:border-box;transition:box-shadow .45s cubic-bezier(.22,.8,.24,1)}
#faq details.jbf-ouvert{box-shadow:0 14px 34px -22px rgba(19,38,52,.45)}
#faq summary img{transition:transform .5s cubic-bezier(.22,.8,.24,1)}
#faq details.jbf-ouvert summary img{transform:rotate(135deg)}
@media (prefers-reduced-motion: reduce){#faq details,#faq summary img{transition:none}}

/* Pied de page (13/11/2026) : au survol, chaque lien change de couleur et se souligne de fins pointillés */
footer a{transition:color .25s ease}
footer a:hover,footer a:focus-visible{text-decoration-line:underline!important;text-decoration-style:dotted!important;text-decoration-thickness:1.5px!important;text-underline-offset:5px!important}
.jbf-pied-formations a:hover,.jbf-pied-formations a:focus-visible{color:#d8f800!important}
.jbf-pied-contact a:hover,.jbf-pied-contact a:focus-visible{color:#8ccdeb!important}
.jbf-pied-suivre a:hover,.jbf-pied-suivre a:focus-visible{color:#ff3e1a!important}
.jbf-pied-bas a:hover,.jbf-pied-bas a:focus-visible{color:#faeadd!important}

/* Pied de page v3 (13/11/2026) : onglets qui s'élèvent au survol, liens qui glissent avec une flèche et s'enfoncent au clic */
footer nav[aria-label="Rubriques"] a{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s cubic-bezier(.2,.7,.2,1)}
footer nav[aria-label="Rubriques"] a:hover,footer nav[aria-label="Rubriques"] a:focus-visible{transform:translateY(-8px)}
footer nav[aria-label="Rubriques"] a:active{transform:translateY(-3px);transition-duration:.12s}
/* ombre de même couleur dès le repos : seul son décalage s'anime, sans reflet clair */
footer nav[aria-label="Rubriques"] a:nth-child(1){box-shadow:0 0 0 #8ccdeb}
footer nav[aria-label="Rubriques"] a:nth-child(2){box-shadow:0 0 0 #977bf3}
footer nav[aria-label="Rubriques"] a:nth-child(3){box-shadow:0 0 0 #ff3e1a}
footer nav[aria-label="Rubriques"] a:nth-child(4){box-shadow:0 0 0 #d8f800}
footer nav[aria-label="Rubriques"] a:nth-child(5){box-shadow:0 0 0 #f5ede3}
footer nav[aria-label="Rubriques"] a:nth-child(1):hover,footer nav[aria-label="Rubriques"] a:nth-child(1):focus-visible{box-shadow:0 8px 0 #8ccdeb}
footer nav[aria-label="Rubriques"] a:nth-child(2):hover,footer nav[aria-label="Rubriques"] a:nth-child(2):focus-visible{box-shadow:0 8px 0 #977bf3}
footer nav[aria-label="Rubriques"] a:nth-child(3):hover,footer nav[aria-label="Rubriques"] a:nth-child(3):focus-visible{box-shadow:0 8px 0 #ff3e1a}
footer nav[aria-label="Rubriques"] a:nth-child(4):hover,footer nav[aria-label="Rubriques"] a:nth-child(4):focus-visible{box-shadow:0 8px 0 #d8f800}
footer nav[aria-label="Rubriques"] a:nth-child(5):hover,footer nav[aria-label="Rubriques"] a:nth-child(5):focus-visible{box-shadow:0 8px 0 #f5ede3}
.jbf-pied-formations a,.jbf-pied-contact a,.jbf-pied-suivre a{align-self:flex-start;transition:color .25s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
.jbf-pied-formations a::after,.jbf-pied-contact a::after,.jbf-pied-suivre a::after{content:"\2192";display:inline-block;margin-left:8px;opacity:0;transform:translateX(-6px);transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
.jbf-pied-formations a:hover,.jbf-pied-contact a:hover,.jbf-pied-suivre a:hover,.jbf-pied-formations a:focus-visible,.jbf-pied-contact a:focus-visible,.jbf-pied-suivre a:focus-visible{transform:translateX(6px)}
.jbf-pied-formations a:hover::after,.jbf-pied-contact a:hover::after,.jbf-pied-suivre a:hover::after,.jbf-pied-formations a:focus-visible::after,.jbf-pied-contact a:focus-visible::after,.jbf-pied-suivre a:focus-visible::after{opacity:1;transform:none}
.jbf-pied-formations a:active,.jbf-pied-contact a:active,.jbf-pied-suivre a:active{transform:translateX(6px) scale(.95);transition-duration:.1s}
.jbf-pied-bas a{transition:color .25s ease,text-decoration-color .25s ease}
.jbf-pied-bas a:hover,.jbf-pied-bas a:focus-visible{text-decoration-color:#faeadd!important}
@media (prefers-reduced-motion: reduce){footer nav[aria-label="Rubriques"] a,.jbf-pied-formations a,.jbf-pied-contact a,.jbf-pied-suivre a,.jbf-pied-formations a::after,.jbf-pied-contact a::after,.jbf-pied-suivre a::after{transition:none}footer nav[aria-label="Rubriques"] a:hover,.jbf-pied-formations a:hover,.jbf-pied-contact a:hover,.jbf-pied-suivre a:hover{transform:none}}

/* Méthode C.L.A.P. (13/11/2026) : à l'arrivée dans l'écran, les 4 lettres puis leur titre et leur phrase apparaissent de gauche à droite (~1,4 s) */
@keyframes jbf-clap-rond{0%{opacity:0;transform:scale(.3) rotate(-25deg)}70%{opacity:1;transform:scale(1.08) rotate(4deg)}100%{opacity:1;transform:none}}
@keyframes jbf-clap-monte{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.jbf-clap-pret > li > *{opacity:0}
.jbf-clap-vu > li > :nth-child(1){animation:jbf-clap-rond .6s cubic-bezier(.2,.8,.25,1.15) both}
.jbf-clap-vu > li > :nth-child(2),.jbf-clap-vu > li > :nth-child(3){animation:jbf-clap-monte .5s cubic-bezier(.2,.7,.2,1) both}
.jbf-clap-vu > li:nth-child(1) > :nth-child(1){animation-delay:0s}
.jbf-clap-vu > li:nth-child(1) > :nth-child(2){animation-delay:0.12s}
.jbf-clap-vu > li:nth-child(1) > :nth-child(3){animation-delay:0.24s}
.jbf-clap-vu > li:nth-child(2) > :nth-child(1){animation-delay:0.2s}
.jbf-clap-vu > li:nth-child(2) > :nth-child(2){animation-delay:0.32s}
.jbf-clap-vu > li:nth-child(2) > :nth-child(3){animation-delay:0.44s}
.jbf-clap-vu > li:nth-child(3) > :nth-child(1){animation-delay:0.4s}
.jbf-clap-vu > li:nth-child(3) > :nth-child(2){animation-delay:0.52s}
.jbf-clap-vu > li:nth-child(3) > :nth-child(3){animation-delay:0.64s}
.jbf-clap-vu > li:nth-child(4) > :nth-child(1){animation-delay:0.6s}
.jbf-clap-vu > li:nth-child(4) > :nth-child(2){animation-delay:0.72s}
.jbf-clap-vu > li:nth-child(4) > :nth-child(3){animation-delay:0.84s}

/* Bouton Télécharger du récépissé (pied de page) */
.jbf-pied-bas a.jbf-telecharger{transition:transform .25s cubic-bezier(.2,.7,.2,1),background-color .25s ease}
.jbf-pied-bas a.jbf-telecharger:hover,.jbf-pied-bas a.jbf-telecharger:focus-visible{background:#d8f800!important;color:#132634!important;text-decoration:none!important;transform:translateY(-2px)}
.jbf-pied-bas a.jbf-telecharger:active{transform:scale(.94)}

/* Boutons du site (13/11/2026) : ils s'élèvent légèrement au survol et s'enfoncent au clic */
html{scroll-behavior:smooth}
main a[style*="border-radius: 999px"],.jbf-nav > a:last-child,button[type="submit"]{transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s cubic-bezier(.2,.7,.2,1),filter .28s ease}
main a[style*="border-radius: 999px"]:hover,.jbf-nav > a:last-child:hover,button[type="submit"]:hover,main a[style*="border-radius: 999px"]:focus-visible,.jbf-nav > a:last-child:focus-visible,button[type="submit"]:focus-visible{transform:translateY(-3px);box-shadow:0 12px 22px -14px rgba(19,38,52,.55);filter:brightness(1.05)}
main a[style*="border-radius: 999px"]:active,.jbf-nav > a:last-child:active,button[type="submit"]:active{transform:translateY(0) scale(.95);box-shadow:0 4px 10px -8px rgba(19,38,52,.5);transition-duration:.1s}

/* Haut des pages légales (13/11/2026) : titre, date et symbole arrivent à l'ouverture */
@keyframes jbf-decor-arrive{0%{opacity:0;transform:translateY(-50%) rotate(-120deg) scale(.4)}70%{opacity:1;transform:translateY(-50%) rotate(8deg) scale(1.06)}100%{opacity:1;transform:translateY(-50%)}}
@keyframes jbf-date-arrive{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: no-preference){
  .jbf-legal-ouverture h1{animation:jbf-monte .9s cubic-bezier(.2,.7,.2,1) .15s both}
  .jbf-legal-ouverture h1 em{animation:jbf-net 1s ease-out .6s both}
  .jbf-legal-ouverture h1 + p{animation:jbf-date-arrive .7s cubic-bezier(.2,.7,.2,1) .55s both}
  .jbf-legal-ouverture .jbl-decor{animation:jbf-decor-arrive 1.1s cubic-bezier(.2,.8,.25,1.1) .3s both}
  main a[style*="border-radius: 999px"],.jbf-nav > a:last-child,button[type="submit"]{}
}
@media (prefers-reduced-motion: reduce){main a[style*="border-radius: 999px"],.jbf-nav > a:last-child,button[type="submit"]{transition:none}}