/* ==========================================================================
   Contact : /contact, /contact/demarrer, et la fenêtre « Démarrer un projet » (toutes les pages).
   Le formulaire lui-même : blocks/parcours/style.css.
   ========================================================================== */

/* ---------- Héros Contact ---------- */
.vw-ct-hero { padding: 72px var(--vw-gutter) 56px; }
.vw-ct-hero-in { display: flex; flex-direction: column; gap: 18px; }
.vw-ct-hero .vw-ct-h1 { max-width: 760px; font-size: 48px; line-height: 1.08; letter-spacing: -0.01em; }
.vw-ct-hero .vw-ct-lead { max-width: 620px; color: rgba(255, 255, 255, .85); }

/* ---------- Parcours et voies directes ---------- */
.vw-ct-parcours { padding: 40px var(--vw-gutter) 80px; scroll-margin-top: var(--vw-nav-h, 151px); }
.vw-ct-cols { display: flex; gap: 48px; align-items: flex-start; }
.vw-ct-form { flex: 1 1 0; min-width: 0; }
.vw-ct-side { flex: none; width: 380px; display: flex; flex-direction: column; gap: 16px; }
.vw-ct-card { border-radius: 16px; padding: 22px 24px 24px; display: flex; flex-direction: column; }
.vw-ct-direct, .vw-ct-next { background: #F1ECE2; }
.vw-ct-direct { gap: 8px; }
.vw-ct-book { gap: 10px; }
.vw-ct-next { gap: 12px; }
.vw-ct-card h4 { font-size: 20px; font-weight: 800; line-height: 1.3; letter-spacing: -0.01em; }
.vw-ct-card .vw-ct-eyebrow { color: var(--vw-blue-700); line-height: 1.2; }
.vw-ct-direct .vw-ct-link { color: var(--vw-blue-700); }
.vw-ct-direct .vw-ct-link a { color: inherit; transition: color .2s ease; }
.vw-ct-direct .vw-ct-link a:hover { color: var(--vw-navy); }
.vw-ct-note { font-size: 15px; line-height: 1.5; color: #6F665A; }
.vw-ct-card p + p { margin-top: 0; }
.vw-ct-note-clair { font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, .82); }
.vw-ct-book .wp-block-buttons { gap: 0; }
.vw-ct-book-btn .wp-block-button__link { padding: 12px 20px; border: 0; border-radius: 999px; font-size: 16px; line-height: 1; letter-spacing: 0.01em; }
.vw-ct-step { display: flex; gap: 12px; align-items: flex-start; }
.vw-ct-num { flex: none; width: 26px; height: 26px; border-radius: 999px; background: var(--vw-yellow); display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: 0.01em; }
.vw-ct-step-txt { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.vw-ct-step-p { font-size: 15px; line-height: 1.5; }
.vw-ct-step-p + * { margin: 0; }

/* ---------- Pourquoi ces questions ---------- */
.vw-ct-why { background: #F1ECE2; padding: 80px var(--vw-gutter); }
.vw-ct-why-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 552px)); justify-content: center; gap: 56px; }
.vw-ct-why-txt { display: flex; flex-direction: column; gap: 16px; justify-content: center; align-self: start; }
.vw-ct-why .vw-ct-eyebrow { color: var(--vw-blue-700); }
.vw-ct-titre { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.vw-ct-titre .vw-ct-h2 { flex: 1 0 100%; font-size: var(--vw-h2); line-height: 1.15; letter-spacing: -0.005em; }
.vw-ct-pill { margin: 0; padding: 3px 9px; border-radius: 999px; background: var(--vw-yellow); font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: 0.01em; }
.vw-ct-titre p + p, .vw-ct-why-txt p + p { margin-top: 0; }
.vw-ct-body { font-size: 17px; line-height: 1.6; }
.vw-ct-visuel { position: relative; height: 400px; }
.vw-ct-plaque { position: absolute; top: 18px; left: 18px; width: 100%; height: 100%; background: #fff; border-radius: 16px; z-index: 0; }
.vw-ct-visuel .vw-ct-photo { position: relative; z-index: 1; height: 100%; margin: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 18px 40px -18px rgba(14, 42, 85, .28); }
.vw-ct-visuel .vw-ct-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: inherit; }

/* Tablette et téléphone : une colonne (comme Framer sous 1200px) */
@media (max-width: 1199.98px) {
	.vw-ct-hero { padding: 44px 20px 40px; }
	.vw-ct-hero .vw-ct-h1 { font-size: var(--vw-h1); }
	.vw-ct-parcours { padding: 24px 20px 56px; scroll-margin-top: 64px; }
	.vw-ct-cols { flex-direction: column; gap: 28px; align-items: stretch; }
	.vw-ct-form, .vw-ct-side { width: 100%; flex: none; }
	.vw-ct-why { padding: 48px 20px; }
	.vw-ct-why-grid { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 1fr; gap: 28px; }
	.vw-ct-visuel { height: 240px; }
}

/* ---------- /contact/demarrer (gabarit page-nu) ---------- */
.vw-ct-entete { display: flex; justify-content: space-between; align-items: center; padding: 18px 32px; background: #fff; }
.vw-ct-entete-logo { display: flex; align-items: center; width: 200px; height: 51px; }
.vw-ct-entete-logo svg { width: 100%; height: 100%; display: block; }
.vw-ct-entete-retour { font-size: 16px; font-weight: 700; line-height: 1; color: var(--vw-blue-700); transition: color .2s ease; }
.vw-ct-entete-retour:hover { color: var(--vw-navy); }
@media (max-width: 809.98px) {
	.vw-ct-entete { padding: 14px 20px; }
	.vw-ct-entete-logo { width: 160px; height: 41px; }
}
html.vw-embed .fn-entete-parcours { display: none !important; }
html.vw-embed body { background: #fff; }

/* ---------- Fenêtre « Démarrer un projet » (port de vw-parcours-style) ---------- */
.vw-pscrim { position: fixed; inset: 0; background: rgba(14, 42, 85, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); z-index: 9000; display: none; align-items: center; justify-content: center; padding: 24px; }
.vw-pscrim.on { display: flex; }
.vw-pscrim .box { position: relative; width: min(900px, 100%); height: min(780px, calc(100vh - 48px)); background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 24px 60px -28px rgba(14, 42, 85, .5); }
.vw-pscrim iframe { display: block; width: 100%; height: 100%; border: 0; background: #fff; }
.vw-pscrim .ld { position: absolute; inset: 0; display: grid; place-content: center; font: 700 13px/1 var(--vw-font); color: #6F665A; letter-spacing: .08em; text-transform: uppercase; background: #fff; transition: opacity .3s; }
.vw-pscrim.ready .ld { opacity: 0; pointer-events: none; }
@media (max-width: 640px) { .vw-pscrim { padding: 0; } .vw-pscrim .box { width: 100%; height: 100%; border-radius: 0; } }
@media (prefers-reduced-motion: reduce) { .vw-pscrim .ld { transition: none; } }
