/*
Theme Name: SSVP
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: HARVEST
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Template: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
 
html, body {
        height: 100%; /* Important */
        margin: 0;
		overflow-x: hidden !important;
	    width: 100% !important;
		overscroll-behavior: none;
		  display: flex;
  flex-direction: column;
}
:root :where(.is-layout-constrained) > *{
	margin-block-start: 0!important;
}


  /* Le conteneur racine des blocs */
  .wp-site-blocks {
    min-height: 100svh;           /* viewport visible mobile */
    display: flex !important;
    flex-direction: column !important;
  }
 
 
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}


.gf_progressbar_wrapper{
	display: none;
}
.gsection_title{
	display: inline-flex;
	color: white;
    background-color: var(--wp--preset--color--contrast);
    padding: 3px 8px;
    font-size: 2rem !important;
}
.gform-theme--framework:where(:not(.gform_editor)) .gfield--type-section{
	border-block-end: none;
	padding-block-end: none;
}
.gfield_label{
	color: var(--wp--preset--color--contrast) !important;
	font-family: var(--wp--preset--font-family--bangers) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	line-height: normal !important;
}

.gform-theme--foundation .gform_fields{
	display: inherit !important;
}


/* input masqué accessible */
.gfield--type-radio .gfield-choice-input { /* mêmes règles que ci-dessus */ }

/* carte cliquable + états hover/checked/focus */
/* … mêmes règles que ci-dessus … */


/* ====== Gravity Forms — radios globaux en "cartes" 2 colonnes + lettrage ====== */

/* 1) Grille : 2 par ligne + compteur par groupe */
.gform_body .gfield--type-radio .gfield_radio {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  counter-reset: gf-radio-choice; /* démarre le compteur A,B,C… à chaque groupe */
  list-style: none; /* neutralise <ul> éventuel */
  margin: 0;
  padding: 0;
  flex-direction: row !important;
  width: 100% !important;

}

/* Chaque choix = 1/2 largeur */
.gfield--type-radio .gfield_radio .gchoice {
  flex: 0 0 calc(50% - 6px);
  counter-increment: gf-radio-choice; /* +1 par choix */
  position: relative;
  min-width: 0; 
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;/* 2 colonnes strictement égales */
  display: inherit !important;
}

/* 2) Masquer l’input radio sans casser l’accessibilité */
.gfield--type-radio .gfield_radio .gfield-choice-input[type="radio"] {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: 0; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* 3) Carte cliquable (le label) */
.gfield--type-radio .gfield_radio .gform-field-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;  
  gap: 10px;
  background: white;                    /* fond blanc demandé */
  border: 0px solid var(--wp--preset--color--contrast);
  border-radius: 10px;
  padding: 14px 16px;
  min-height: 56px;
  cursor: pointer;
  transition: box-shadow .2s ease, border-color .2s ease, transform .06s ease;
  line-height: 1.35;
  width: 100%;
  font-size: 0.4em !important;
}

/* Lettrage A, B, C… automatique (lié à l'ordre d'affichage) */
.gfield--type-radio .gfield_radio .gform-field-label::before {
  content: counter(gf-radio-choice, upper-alpha);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 2px solid var(--wp--preset--color--contrast);
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1;
  margin-inline: auto;     /* centre horizontalement */
  color: var(--wp--preset--color--contrast) !important;
  font-family: var(--wp--preset--font-family--bangers) !important;
}

/* Hover */
.gfield--type-radio .gfield_radio .gform-field-label:hover {
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
}

/* Focus clavier (accessibilité) */
.gfield--type-radio .gfield_radio .gfield-choice-input:focus-visible + .gform-field-label {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

/* État sélectionné */
.gfield--type-radio .gfield_radio .gfield-choice-input:checked + .gform-field-label {
  border-color: #111827;
  background:  var(--wp--preset--color--contrast);
  color: white;
  box-shadow: inset 0 0 0 2px rgba(17,24,39,.12);
}
.gfield--type-radio .gfield_radio .gfield-choice-input:checked + .gform-field-label::before {
  background:  var(--wp--preset--color--contrast);
  color: white !important;
  border-color:  white;
}

.gform_button, .gform_next_button, .gform_previous_button{
	border-radius: 50px !important;
	font-family: var(--wp--preset--font-family--bangers) !important;
	font-size: 1.5rem !important;
	padding: 10px 20px;
	border: none !important;
}
.gform_next_button {
  display: inline-block;
  margin-left: auto;       /* pousse le bouton à droite dans un conteneur flex */
}
.gform_next_button{
	background-image: url(img/arrow.svg) !important;
	background-position: 95px center;
	background-repeat: no-repeat;
	position: relative;
	padding-right: 33px !important;
	width: 125px !important;
}

.gform_previous_button{
	background-image: url(img/arrow_prev.svg) !important;
	background-position: 8px center;
	background-repeat: no-repeat;
	position: relative;
	padding-left: 33px !important;
	width: 135px !important;
}

/* S'assurer que le conteneur du bouton est en flex */
body .gform_page_footer,   /* GF multi-step */
body .gform_footer         /* GF classique */
{
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;         /* utile si plusieurs boutons (précédent/suivant) */
  gap: 8px;
  
}

.form .footer {
  margin-top: auto !important;       /* pousse le footer en bas */
}

.wrap, .cover{
	position: relative;
	min-height: 100%;
	height: 100vh;
}
.cover{
	background: no-repeat center / contain url(img/petits_trucs.svg);
}
.content{
	position: relative;
	margin-left: 0 !important;
}
.form{
	transition: 0.5s all ease-in-out;
	position: absolute;
	overflow-y: scroll; /* scrollbar verticale */
	overflow-x: hidden; /* pas de scrollbar horizontale */
	width: 35%;
	top: 0;
	right: 0;
	min-height: 100%;
	height: 100vh;
	z-index: 100;
}
.form div{
	transition: 0.5s all ease-in-out;
}

.footer{
	position: fixed;
	bottom: 0;
	width: 100%;
}

.go{
	z-index: 50;
}
.title h2{
	transform: rotate(-5.83deg);
	position: relative;
	  display: inline-grid;
	justify-items: center;
	text-align: center;
	width: 100%;
	margin: 0 auto;
	z-index: 50;
}
.title:after{
 	content: "";
   position:absolute;
  left:50%;                    
  transform:translateX(-50%);
  background: no-repeat center / contain url(img/star.svg);
  width: 25rem;
  height: 25rem;
  opacity: 0.4;
  z-index: 1 !important;
}


/* Lance l’animation quand on ajoute .reveal (via JS ci-dessous) */
.title.reveal::after{
  animation: deco-bounce-in 500ms ease-out both;
}

.logo_noir{
	position: relative;
	  z-index: 105;
}

.legal{
	font-size: 10px;
	max-width: 480px;
    margin: 0 auto;
    z-index: 105;
    position: relative;
}

.gfield_validation_message{
	max-width: 480px;
	margin: 0 auto;
	font-weight: bold !important;
	font-size: 17px;
}

.gform_submission_error, .gform_validation_errors, .gform_heading, .gfield_required{
	display: none !important;
}

#gform_wrapper_1 .name{
	position: relative;
	margin: 0 auto;
	font-family: var(--wp--preset--font-family--arima) !important;
	z-index: 105;
}
#gform_wrapper_1 .name input{
	min-height: 50px !important;
	font-size: 30px !important;
	width: 480px !important;
	padding: 6px 5px;
	border-radius: 8px;
	border: 0px solid black !important;
	box-shadow: inset 0px 1px 4px 1px rgba(0, 0, 0, 0.19) !important;
	color: #1a3f69 !important;
}

#gform_wrapper_1 .name input::placeholder{ color:rgba(26, 62, 105, 0.15) !important; opacity:1; font-family: var(--wp--preset--font-family--bangers) !important }


body .gform_page_footer, body .gform_footer{
	justify-content: right;
}

.gfield.recevez{
	margin-top: 50px !important;
	font-size: 1.2rem;
	text-align: center;
	max-width: 480px;
	font-weight: 500;
	margin: 0 20px;
	z-index: 105;
	position: relative;
}
.confirm{
	text-align: center;
	max-width: 480px;
	position: relative;
}

/* dépliage des enfants de .confirm */
.confirm .button,
.confirm .plus{
	z-index: 55;
	max-width: 480px;	
	margin: 0 auto;
	padding-top: 20px;
}

/* Keyframes “bounce” (sur/sous-tension + amorti) */
@keyframes deco-bounce-in{
  0%   { transform: translateX(-50%) translateY(18px) scale(.70); opacity:0; }
  55%  { transform: translateX(-50%) translateY(-6px) scale(1.08); opacity:1; }
  75%  { transform: translateX(-50%) translateY(3px)  scale(.96);  }
  100% { transform: translateX(-50%) translateY(0)    scale(1);    }
}

/* Respecte l’accessibilité */
@media (prefers-reduced-motion: reduce){
  .title::after { transform: translateX(-50%) translateY(0) scale(1); opacity:1; }
  .title::after { animation: none; }
}

.textes{
	z-index: 99;
}

.imgs{
	width: 20vw;
	position: absolute;
	z-index: 40;
	transition: 0.5s all ease-in-out;
}
.img1{
	right: 40%;	
}
.img2{
	bottom: 15vw;
    left: -2%;	
}
.img3{
	bottom: 8vw;
    right: 40%;
}
.confirm{
	margin-top: 25%;
}

/* dépliage des enfants de .partage */
.partage{
	margin: 78px auto 0px auto;
	position: relative;
	background-color: white;
	border-radius: 20px;
	z-index: 55;
	max-width: 480px;
	padding: 20px;
}
.partage h3{ 
	text-align: center;
	margin: 0px 0px 19px 0px;
}

.partage .wp-block-social-links.has-small-icon-size{
	font-size: 35px !important;
}
.buttonPlus, .plus{
	position: relative;	
	text-align: center;
	max-width: 480px;
	z-index: 55;
	margin: 20px auto auto auto !important;
}
.plus{
	font-size: 20px !important;
	font-weight: bold;
}
.buttonPlus{
	margin-top: 50px;
	display: table;
	text-decoration: none;
	background-color: white;
	font-family: var(--wp--preset--font-family--bangers) !important;
	border-radius: 50px !important;
	font-size: 30px !important;
	box-shadow: 0px 0px 18px 11px rgba(0, 0, 0, 0.16);
	padding: 5px 20px;
}

.gform_confirmation_wrapper .title{
	margin-bottom: 100px;
}
.img2end{ display: none;}

/* -------- dépliage du bloc imbriqué .on-step-6, .on-confirmation -------- */

.on-step-6 .form,
.on-confirmation .form { 
	width: 75%;
	flex-direction: column;
    display: flex !important;
    flex-grow: 1;
    justify-content: space-between;
	background: no-repeat center / contain url(img/petits_trucs.svg);
}
.on-step-6 .gfield,
.on-confirmation .gfield{
	 margin: 19px auto !important;
}
.on-step-6 .gfield input,
.on-step-6 .gfield p,
.on-confirmation .gfield input,
.on-confirmation .gfield p{
 	margin: 0 auto;
}
.on-step-6 .form .title:after,
.on-confirmation .form .title:after,
.on-step-6 .gform_confirmation_wrapper .title:after,
.on-confirmation .gform_confirmation_wrapper .title:after{
	  width: 55rem;
	  height: 55rem;
	  top: -50vh;
	  opacity: 1 !important;
}
.on-step-6 .imgs,
.on-confirmation .imgs{
	z-index: 101;
}
.on-step-6 .img1,
.on-confirmation .img1{
	top: 10%;
	right: auto;
	left: 10%;
}
.on-step-6 .img3,
.on-confirmation .img3{
	right: -2%;
}
.on-step-6 .form .footer,
.on-confirmation .form .footer{
	display: block;
	position: absolute;
	left: 0;
	width: 100% !important;
	padding-left: 0%;
}
.on-step-6 .textes,
.on-confirmation .textes,
.on-step-6 .footer.bleu,
.on-confirmation .footer.bleu{
	display: none;
}
.on-step-6 .gform_previous_button,
.on-confirmation .gform_previous_button{
		display: none !important; 
}
.on-step-6 .gform_page_footer,
.on-step-6 .gform_footer,
.on-confirmation .gform_page_footer,
.on-confirmation .gform_footer{
	justify-content:center!important;
}

.wp-social-link-whatsapp svg{
	width: 50px;
	height: 50px;
}


  @supports (min-height: 100dvh) {
    .wp-site-blocks { min-height: 100dvh; } /* iOS/Android modernes */
  }

  /* Coller le footer template part en bas, selon plusieurs variantes possibles */
  .wp-site-blocks > .wp-block-template-part[area="footer"],
  .wp-site-blocks > .wp-block-template-part[id*="footer"],
  .wp-site-blocks > footer,
  .wp-site-blocks > .site-footer,
  .wp-site-blocks > [data-wp-area="footer"] {
    margin-top: auto !important;
  }

  /* Si WPFSE insère un groupe enveloppe, on colle ce groupe s’il est le footer */
  .wp-site-blocks > .wp-block-group.footer {
    margin-top: auto !important;
  }

  /* Confort iOS avec notch */
  .wp-site-blocks > .wp-block-template-part[area="footer"] .wp-block-group.footer,
  .wp-site-blocks > .wp-block-template-part[id*="footer"] .wp-block-group.footer,
  .wp-site-blocks > footer .wp-block-group.footer,
  .wp-site-blocks > .site-footer .wp-block-group.footer,
  .wp-site-blocks > .wp-block-group.footer {
    padding-bottom: calc(var(--wp--preset--spacing--20, 1rem) + env(safe-area-inset-bottom, 0px));
    background: var(--wp--preset--color--base, #fff);
  }

  /* (Sécurité) empêche qu’un ancêtre casse le flex */
  .wp-site-blocks, .wp-site-blocks > * { overflow: visible !important; }


/* ------------------------------------------------------------------------- */

@media (min-width: 1200px) {
	.content{
		margin-top: 5vw;
	}
	.has-xx-large-font-size{
		font-size: 9vh !important;
	}
	.on-step-6 .has-xx-large-font-size,
	.on-confirmation .has-xx-large-font-size {font-size: 4vw !important;}
}

@media (max-width: 1200px) and (min-width: 821px){
	.form > .wp-block-group{
		padding: 0 !important;
	}
}	

@media (min-width: 821px) {
	.content, .formulaire{
/* 		margin-top: 5vw; */
	}	
	.form{
		--bevel: 28px;                 /* profondeur du biseau */
	  padding:16px 30px 16px calc(30px + var(--bevel)/2) !important;
	  display:inline-block;
	  /* Bord gauche incliné : 0px en haut, --bevel en bas */
	  clip-path: polygon(0 0, 100% 0, 100% 100%, var(--bevel) 100%);
	  box-shadow: 0 8px 18px rgba(0,0,0,.25);

	}
	.btn_go, .logo_noir{
		display: none !important;
	}
	.content{
		max-width: 60%;
	}
	.footer .content{
		max-width: 100%;	
	}
	.footer.bleu{
		max-width: 80%;
		width: 80%;
	}
	.form .footer{
		display: none !important;
	}

	/* dépliage des enfants de .on-step-6/.on-confirmation dans cette MQ */
	.on-step-6 .form,
	.on-confirmation .form{
		--bevel: 48px;                 /* profondeur du biseau */
		padding:16px 30px 16px calc(30px + var(--bevel)/2) !important;
		display:inline-block;
		/* Bord gauche incliné : 0px en haut, --bevel en bas */
		clip-path: polygon(var(--bevel) 0, 100% 0, 100% 100%, 0 100%);
		box-shadow: 0 8px 18px rgba(0,0,0,.25);
	}
	.on-step-6 .form .footer,
	.on-confirmation .form .footer{
		padding-left: 30px;
		display: block !important;
	}

	/* Réglage hauteur */

	/* Le “panneau” du quiz occupe toute la hauteur de l’écran */
	.wp-block-group.form {
	  min-height: 100svh;              /* 100% de la hauteur viewport (safe iOS) */
	  display: grid;
	  grid-template-rows: 1fr;         /* un seul panneau plein écran */
	}
	
	/* On centre verticalement tout ce qu’il y a DANS le panneau */
	.wp-block-group.form > .wp-block-group.has-global-padding {
	  display: grid;                   /* grid interne */
	  align-content: center;           /* centre VERTICAL de toute la pile (logo + form) */
	  justify-items: center;           /* centre HORIZONTAL les enfants (optionnel) */
	  row-gap: var(--wp--preset--spacing--40, 2rem); /* espace régulier entre logo/form */
	}
	
	/* Empêche les marges externes de “pousser” le contenu et de casser le centrage */
	.wp-block-group.form > .wp-block-group.has-global-padding > *:first-child { margin-top: 0 !important; }
	.wp-block-group.form > .wp-block-group.has-global-padding > *:last-child  { margin-bottom: 0 !important; }
	
	/* Optionnel : largeur max du formulaire + centrage horizontal propre */
	.wp-block-group.form .gform_wrapper form {
	  width: min(100%, 760px);
	  margin-inline: auto;
	}
	
	.footer{
		position: absolute;
	}
}

@media (max-width: 820px) {
	.content, .form{ 
		width: 100%;
		
	} 
	.content{
		margin-top: 7vh;
	}
	.form{
		display:block;                 /* tu l'as précisé */
		  opacity:0;
		  visibility:hidden;             /* évite les focus avant ouverture */
		  transform: translateY(10px);
		  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
		  will-change: opacity, transform;
		  width: 100% !important;
	}
	
	.form.is-visible{
	opacity:1;
	  visibility:visible;
	  transform:none;
	  transition: opacity .25s ease, transform .25s ease;
	}
	.title h2{
		font-size: 4rem !important;
	}

	.title:after{
		width: 18rem !important;
		height: 18rem !important;
		top: -90px !important;
	}
	
	.footer .content{
		text-align: center;	
		flex-basis: 100%;
	}
	.footer .content p{
		flex-basis: 100%;
	}
	.wp-block-social-links{
		margin: 0 auto !important;
	}
	.imgs{
		width: 50vw;
		position: absolute;
		z-index: 40;
		transition: 0.5s all ease-in-out;
	}
	.img1{
		right: -6%;
        top: 5%;
	}
	.img2{
		bottom: 20%;
	    left: -2%;	
	}
	.img3{
		display: none;
	}
	.btn_go a{
		font-size: 2rem !important;
	}
	
	/* dépliage des enfants de .on-step-6/.on-confirmation dans cette MQ */
	.on-step-6 .img1,
	.on-confirmation .img1{
		display: none;
	}
	.on-step-6 .img2,
	.on-confirmation .img2{
	    display: none;
	}
	.on-step-6 .title h2,
	.on-confirmation .title h2{
		font-size: 35px !important;
	}
	.on-step-6,
	.on-confirmation{
		padding-left: 0px;
	}
	
	/* dépliage des enfants spécifiques à .on-step-6 */
	.on-step-6 .gform-page-footer{
		top: -40vh;
        position: relative;
	}
	.on-step-6 .img2end{
		margin-top: 200px !important;
	}
	.on-step-6 .img2end figure{
		margin-top: -50px;
	}
	
	.gform_confirmation_wrapper .title{
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.img2end{ display: block; max-width: 50%;}
	
	.form .footer{
/* 			position: relative !important; */
/*
			display: block !important;
			left: 0 !important;
			margin-left: 0 !important;	
			width: 100% !important;
*/
/* 			margin-top: 30px; */
	}
	
  /* 1) Conteneur racine en colonne flex, pleine hauteur */
  .wp-site-blocks {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100svh;
  }
  @supports (min-height: 100dvh) {
    .wp-site-blocks { min-height: 100dvh; }
  }

  /* 2) REMISE À ZÉRO : le footer n’est ni sticky ni fixed */
  .footer.jaune {
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    z-index: auto !important;
  }

  /* 3) Le VRAI enfant direct “footer” de .wp-site-blocks est poussé en bas */
  .wp-site-blocks > .wp-block-template-part:has(.footer.jaune),
  .wp-site-blocks > .footer.jaune {
    margin-top: auto !important;
  }

  /* 4) Confort iOS (notch) si besoin */
  .footer.jaune {
    padding-bottom: calc(var(--wp--preset--spacing--20, 1rem) + env(safe-area-inset-bottom, 0px));
    background: var(--wp--preset--color--base, #fff);
  }
}

@media (max-width: 450px) {
	.title h2{
			font-size: 35px !important;
	}
	.gfield_label{
		font-size:  25px !important;	
	}

	.logo_noir{
		margin-bottom: 0 !important;
	}
	.footer{
		z-index: 40;
	}
	.first{
		margin-top: 8vh !important;
	}
	.on-step-6 .img2end{
		margin-top: 100px !important;
	}

		.gfield--type-radio .gfield_radio .gform-field-label{ font-size: 0.9rem !important;}

}

@media (max-width: 380px) {
	.btn_go a{ font-size: 1.5rem !important;}
	.gfield--type-radio .gfield_radio .gform-field-label{ font-size: 0.9rem !important;}
	.on-step-6 .gform-page-footer{
		top: -28vh !important;
	}
	.on-step-6 .img2end{
		margin-top: 50px !important;
	}
	.footer{
		position: relative !important;
		top: 90px !important;
	}
	.first{
		margin-top: 4vh !important;
	}
		.imgs{
		width: 30vw !important;
	}
}

@media (min-height: 380px) and (max-width: 450px) {
	
	.on-step-6 .gform-page-footer{
		top: -25vh !important;
	}

}

@media (min-width: 1024px) and (max-width: 1024px) {
	.on-step-6 .form .footer, .on-confirmation .form .footer{
		left: 45px;
	}
}

/* ---------- (Optionnel) Responsive : si tu veux 1 par ligne sous 420px
@media (max-width: 420px) {
  .gfield--type-radio .gfield_radio .gchoice { flex-basis: 100%; }
}
*/