/* Nos Réussites - Travailler au Canada/Québec : fondations et formulaire public

   Même charte et même matière que la Salle de classe FLE : sarcelle et gris,
   un fond gris sarcelle très pâle, des cartes blanches très arrondies posées
   dessus, des pilules pour tout ce qui se presse, et un seul aplat sombre par
   écran (la carte à la une). La hiérarchie vient de la valeur, pas de la
   teinte.

   Les couleurs se règlent dans le bloc de variables juste en dessous. Les
   noms de classes d'origine sont tous gardés ; les nouveaux portent les
   préfixes nrtc-nav (barre), nrtc-tdb (tableau de bord) ou sont des éléments
   neufs de blocs existants. */

.nrtc-wrap {
	/* Palette : deux couleurs de marque, et rien d'autre dans le décor. */
	--nrtc-ink: #22302F;
	--nrtc-primary: #0F5F60;          /* sarcelle profonde : structure, texte */
	--nrtc-primary-dark: #0A2928;
	--nrtc-accent: #1B8A8A;           /* la sarcelle de marque : l'action */
	--nrtc-accent-dark: #0F5F60;
	--nrtc-gris: #8C8C8B;             /* le gris de marque : filets, décor */
	--nrtc-paper: #F4F7F6;
	--nrtc-line: #D7E0DF;
	--nrtc-muted: #5C6A69;            /* texte secondaire, 5,6:1 sur blanc */

	/* #1B8A8A porte 4,16:1 sur blanc : assez pour un aplat, pas pour un
	   libellé blanc de 14 px. Les remplissages qui portent du texte blanc
	   sont assombris d'un cran (4,8:1). */
	--nrtc-accent-plein: color-mix(in srgb, var(--nrtc-accent) 90%, #06201F);
	--nrtc-accent-sombre: color-mix(in srgb, var(--nrtc-accent) 74%, #06201F);
	--nrtc-lavis: color-mix(in srgb, var(--nrtc-accent) 7%, #fff);
	--nrtc-lavis-fort: color-mix(in srgb, var(--nrtc-accent) 13%, #fff);

	/* Alias hérités des versions 1 et 2. */
	--nrtc-bg: var(--nrtc-paper);
	--nrtc-card: #FFFFFF;
	--nrtc-border: var(--nrtc-line);
	--nrtc-text: var(--nrtc-ink);

	/* États : des signaux, jamais du décor, jamais seuls (un glyphe ou un
	   libellé les double toujours). */
	--nrtc-succes: #14705A;
	--nrtc-alerte: #8A5300;
	--nrtc-danger: #A32C22;
	--nrtc-success-bg: #E6F3EE;
	--nrtc-success-text: #14705A;
	--nrtc-error-bg: #FAEAE8;
	--nrtc-error-text: #A32C22;

	/* Matière : ombres larges, basses, teintées sarcelle. */
	--nrtc-ombre-1: 0 1px 2px rgba(15,60,58,.05), 0 4px 12px -6px rgba(15,60,58,.14);
	--nrtc-ombre-2: 0 2px 4px rgba(15,60,58,.05), 0 12px 28px -12px rgba(15,60,58,.22);
	--nrtc-fond: color-mix(in srgb, var(--nrtc-paper) 72%, var(--nrtc-line));
	--nrtc-panneau: color-mix(in srgb, #fff 45%, var(--nrtc-fond));
	--nrtc-r-l: 26px;
	--nrtc-r-m: 18px;
	--nrtc-r-s: 12px;
	--nrtc-pilule: 999px;

	--nrtc-ui: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	box-sizing: border-box;
	max-width: 1180px;
	margin: 0 auto;
	padding: clamp(6px, 1vw, 12px);
	background: var(--nrtc-fond);
	border-radius: var(--nrtc-r-l);
	font-family: var(--nrtc-ui);
	font-size: clamp(15px, 0.28vw + 14.1px, 16.5px);
	line-height: 1.55;
	color: var(--nrtc-ink);
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}
.nrtc-wrap *, .nrtc-wrap *::before, .nrtc-wrap *::after { box-sizing: border-box; }
.nrtc-wrap--formulaire { max-width: 900px; }
.nrtc-wrap a { color: var(--nrtc-primary); text-underline-offset: 2px; }
.nrtc-wrap :focus-visible {
	outline: 3px solid var(--nrtc-accent-sombre);
	outline-offset: 2px;
	border-radius: 8px;
}
.nrtc-wrap ::selection { background: color-mix(in srgb, var(--nrtc-accent) 26%, #fff); color: var(--nrtc-ink); }

/* --- Alertes ------------------------------------------------------------ */
.nrtc-alert {
	padding: 16px 20px;
	border-radius: var(--nrtc-r-m);
	margin: 0 0 16px;
	font-size: 15px;
	line-height: 1.5;
	background: #fff;
	box-shadow: var(--nrtc-ombre-1), inset 4px 0 0 var(--nrtc-accent);
}
.nrtc-alert-success { background: var(--nrtc-success-bg); color: var(--nrtc-success-text); box-shadow: var(--nrtc-ombre-1), inset 4px 0 0 var(--nrtc-succes); }
.nrtc-alert-error { background: var(--nrtc-error-bg); color: var(--nrtc-error-text); box-shadow: var(--nrtc-ombre-1), inset 4px 0 0 var(--nrtc-danger); }
.nrtc-alert-info { background: var(--nrtc-lavis); color: var(--nrtc-primary); }

/* --- La carte à la une : le seul aplat sombre de l'écran ----------------- */
.nrtc-header {
	position: relative;
	overflow: hidden;
	background: linear-gradient(150deg, #155F5F 0%, #0C3534 60%, #0A2928 100%);
	color: #fff;
	padding: clamp(22px, 3vw, 34px);
	border-radius: var(--nrtc-r-l);
	margin: 0 0 18px;
}
.nrtc-header::after {
	content: "";
	position: absolute;
	right: -60px;
	top: -60px;
	width: 240px;
	height: 240px;
	border-radius: 50%;
	pointer-events: none;
	background: radial-gradient(circle, rgba(27,138,138,.55), transparent 70%);
}
.nrtc-header h2 {
	position: relative;
	z-index: 1;
	margin: 0 0 10px;
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 560;
	letter-spacing: -.015em;
	line-height: 1.15;
	color: #fff;
}
.nrtc-header p {
	position: relative;
	z-index: 1;
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #CFE6E5;
	max-width: 640px;
}

.nrtc-honeypot { position: absolute; left: -9999px; top: -9999px; }

/* --- Les rubriques du formulaire : une carte blanche chacune ------------- */
.nrtc-section {
	background: var(--nrtc-card);
	border: 0;
	border-radius: var(--nrtc-r-m);
	box-shadow: var(--nrtc-ombre-1);
	padding: clamp(18px, 2.4vw, 28px);
	margin: 0 0 16px;
	min-width: 0;
}
.nrtc-section legend {
	float: left;
	width: 100%;
	margin: 0 0 10px;
	padding: 0;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -.01em;
	color: var(--nrtc-ink);
}
.nrtc-section legend + * { clear: both; }

.nrtc-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px 22px;
	margin-top: 16px;
}
.nrtc-field { display: flex; flex-direction: column; }
.nrtc-field-wide { grid-column: 1 / -1; }

.nrtc-field label {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--nrtc-ink);
	margin-bottom: 6px;
}
.nrtc-required { color: var(--nrtc-danger); }

/* Champs : creusés plutôt que cernés. */
.nrtc-field input[type=text],
.nrtc-field input[type=email],
.nrtc-field input[type=tel],
.nrtc-field input[type=date],
.nrtc-field input[type=url],
.nrtc-field input[type=password],
.nrtc-field input[type=search],
.nrtc-field select,
.nrtc-field textarea,
.nrtc-wrap .nrtc-champ {
	border: 1px solid color-mix(in srgb, var(--nrtc-line) 55%, #fff);
	border-radius: 11px;
	padding: 11px 13px;
	font-size: 15px;
	font-family: inherit;
	color: var(--nrtc-ink);
	background: #fff;
	box-shadow: inset 0 2px 5px -3px rgba(15,60,58,.22);
	transition: border-color .15s ease, box-shadow .15s ease;
	max-width: 100%;
}
.nrtc-field textarea { resize: vertical; min-height: 64px; }
.nrtc-field input[type=file] { font-size: 14px; padding: 9px 10px; }

.nrtc-field input:focus,
.nrtc-field select:focus,
.nrtc-field textarea:focus,
.nrtc-wrap .nrtc-champ:focus {
	outline: none;
	border-color: var(--nrtc-accent);
	box-shadow: inset 0 2px 5px -3px rgba(15,60,58,.18), 0 0 0 3px color-mix(in srgb, var(--nrtc-accent) 22%, transparent);
}

.nrtc-radio-group,
.nrtc-checkbox-group {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	margin-top: 4px;
}
.nrtc-radio-option,
.nrtc-checkbox-option {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14.5px;
	font-weight: 400;
	color: var(--nrtc-ink);
}
.nrtc-checkbox-group { flex-direction: column; }
.nrtc-wrap input[type=radio],
.nrtc-wrap input[type=checkbox] { accent-color: var(--nrtc-accent-plein); width: 17px; height: 17px; }

.nrtc-checkbox-single {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--nrtc-ink);
	margin-top: 4px;
}
.nrtc-checkbox-single input { margin-top: 3px; flex: 0 0 auto; }

/* --- Boutons : des pilules ---------------------------------------------- */
.nrtc-submit-row { text-align: center; margin: 24px 0 10px; }
.nrtc-submit-btn {
	display: inline-block;
	background: var(--nrtc-accent-plein);
	color: #fff;
	border: 0;
	padding: 14px 40px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 620;
	border-radius: var(--nrtc-pilule);
	cursor: pointer;
	box-shadow: var(--nrtc-ombre-1), inset 0 1px 0 rgba(255,255,255,.18);
	transition: transform .12s ease, box-shadow .12s ease, background .15s ease;
}
.nrtc-submit-btn:hover { background: var(--nrtc-accent-sombre); box-shadow: var(--nrtc-ombre-2), inset 0 1px 0 rgba(255,255,255,.18); }
.nrtc-submit-btn:active { box-shadow: inset 0 3px 7px rgba(6,32,31,.22); }

[data-conditional] { display: none; }
[data-conditional].nrtc-visible { display: flex; }

@media (max-width: 680px) {
	.nrtc-grid { grid-template-columns: 1fr; }
	.nrtc-submit-btn { width: 100%; padding: 14px 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.nrtc-wrap * { transition: none !important; animation: none !important; }
}

/* Contraste renforcé : la matière cède au trait. */
@media (prefers-contrast: more) {
	.nrtc-section, .nrtc-alert { box-shadow: none; border: 2px solid var(--nrtc-line); }
	.nrtc-header { border: 2px solid var(--nrtc-accent); }
	.nrtc-header::after { display: none; }
	.nrtc-field input, .nrtc-field select, .nrtc-field textarea { border: 2px solid var(--nrtc-gris); box-shadow: none; }
}
@media (forced-colors: active) {
	.nrtc-header, .nrtc-section, .nrtc-submit-btn { border: 2px solid; }
	.nrtc-header::after { display: none; }
}

@media print {
	.nrtc-wrap { background: none; padding: 0; }
	.nrtc-header { background: none; color: inherit; border: 1px solid #999; }
	.nrtc-header h2, .nrtc-header p { color: inherit; }
	.nrtc-header::after { display: none; }
	.nrtc-section { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
	.nrtc-submit-row { display: none; }
}