/*
 * Section d'appel à l'action.
 *
 * Les valeurs ne sont pas choisies librement : elles reprennent celles que le
 * site sert déjà. Jaune #e5c80c, couleur primaire des trois jeux de couleurs du
 * thème. Sombre #191e24, couleur de fond de tous les boutons de contenu du site.
 * Or #c3a60a, bordure que le thème associe au jaune. Titres en merriweather,
 * textes en open sans, boutons en 13 px avec un rayon de 3 pixels et un
 * remplissage de 15 px sur 30 px : ce sont les réglages d'un bouton large du
 * thème, repris tels quels pour que la section ne détonne pas.
 *
 * Toutes les règles sont portées par une classe propre au socle : aucune ne peut
 * déborder sur les styles du thème. L'écriture part du plus étroit, le libellé
 * compact est l'état de base et le libellé long n'apparaît qu'à partir de la
 * tablette.
 */

.montastruc-cta {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 44px 20px;
	background-color: #e5c80c;
	border-top: 2px solid #c3a60a;
	border-bottom: 2px solid #c3a60a;
	color: #191e24;
	text-align: center;
}

.montastruc-cta__contenu {
	box-sizing: border-box;
	max-width: 720px;
	margin: 0 auto;
}

.montastruc-cta__surtitre {
	margin: 0 0 14px;
	padding: 0;
	font-family: 'open sans', Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #4a4213;
}

.montastruc-cta__filet {
	display: block;
	width: 44px;
	height: 2px;
	margin: 0 auto 20px;
	background-color: #191e24;
}

.montastruc-cta__titre {
	margin: 0 0 16px;
	padding: 0;
	font-family: 'merriweather', Helvetica, Arial, sans-serif;
	font-size: 23px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	color: #191e24;
}

.montastruc-cta__texte {
	box-sizing: border-box;
	max-width: 560px;
	margin: 0 auto 28px;
	padding: 0;
	font-family: 'open sans', Helvetica, Arial, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: #2c2a16;
}

.montastruc-cta__actions {
	display: block;
}

/*
 * Le bouton porte une chaîne de trois classes, et non une seule. Le thème peint
 * tous les liens de contenu dans sa couleur primaire par une règle à deux
 * classes : une règle à une classe perdrait, et le libellé s'afficherait en
 * jaune au lieu du blanc. La chaîne suffit à passer devant, ce qui évite de
 * recourir à une déclaration impérative.
 */
.montastruc-cta .montastruc-cta__actions .montastruc-cta__bouton {
	box-sizing: border-box;
	display: inline-block;
	max-width: 100%;
	min-width: 139px;
	padding: 15px 30px 13px;
	border: 1px solid #191e24;
	border-radius: 3px;
	background-color: #191e24;
	color: #ffffff;
	font-family: 'open sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	transition: all 0.4s ease-in-out;
}

.montastruc-cta .montastruc-cta__actions .montastruc-cta__bouton:hover,
.montastruc-cta .montastruc-cta__actions .montastruc-cta__bouton:focus {
	background-color: #ffffff;
	border-color: #191e24;
	color: #191e24;
	text-decoration: none;
}

.montastruc-cta__libelle--large {
	display: none;
}

.montastruc-cta__libelle--compact {
	display: inline;
}

/* À partir de la tablette : libellé long, actions sur une seule ligne. */
@media screen and (min-width: 768px) {

	.montastruc-cta {
		padding: 64px 32px;
	}

	.montastruc-cta__surtitre {
		margin-bottom: 16px;
		font-size: 13px;
	}

	.montastruc-cta__filet {
		margin-bottom: 24px;
	}

	.montastruc-cta__titre {
		margin-bottom: 18px;
		font-size: 30px;
	}

	.montastruc-cta__texte {
		margin-bottom: 34px;
		font-size: 16px;
	}

	.montastruc-cta__libelle--large {
		display: inline;
	}

	.montastruc-cta__libelle--compact {
		display: none;
	}
}

/* ------------------------------------------------------------------- */
/* Pleine largeur de la section du constructeur qui porte le composant. */
/* ------------------------------------------------------------------- */

/*
 * Le constructeur enferme le contenu d'une section dans un conteneur borné en
 * largeur et garni de chaque côté : c'est lui, et non le composant, qui laissait
 * une bande de fond à gauche et à droite. Les trois règles ci-dessous ne valent
 * qu'à l'intérieur de la section d'appel à l'action, reconnue à la classe que
 * son contenu lui donne, et ne touchent aucune autre section de la page.
 *
 * La chaîne part des deux identifiants du gabarit parce que la règle de largeur
 * du thème en fait autant, « .responsive #top #wrap_all .container » : à égalité
 * d'identifiants, c'est elle qui gagnerait et la bande resterait.
 */
.responsive #top #wrap_all .montastruc-section-cta .container,
#top #wrap_all .montastruc-section-cta .container {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	float: none;
}

.responsive #top #wrap_all .montastruc-section-cta .content,
#top #wrap_all .montastruc-section-cta .content {
	width: 100%;
	margin: 0;
	padding: 0;
}

#top #wrap_all .montastruc-section-cta .entry-content-wrapper,
#top #wrap_all .montastruc-section-cta .post-entry,
#top #wrap_all .montastruc-section-cta .avia_codeblock_section,
#top #wrap_all .montastruc-section-cta .avia_codeblock {
	margin: 0;
	padding: 0;
}