/**
 * Fiche produit e-book.
 * Porte de la maquette le-chauffeur-prive-moderne.html (lignes 55-127, 160-169).
 * .hero renomme en .ebook-hero pour ne pas entrer en conflit avec la page d'accueil.
 */

/* ---------- HERO ---------- */

.single-product .ebook-hero {
	padding-block: clamp(30px, 4.5vw, 50px) clamp(64px, 9vw, 104px);
}

.single-product .ebook-hero .hgrid {
	display: grid;
	grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
	gap: clamp(28px, 5vw, 64px);
	align-items: center;
}

.single-product .cover-wrap {
	position: relative;
	min-width: 0;
}

.single-product .cover {
	width: 100%;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 30px 60px -24px rgba(21, 22, 26, .32), 0 8px 20px -10px rgba(21, 22, 26, .18);
	transform: rotate(-1.4deg);
}

.single-product .cover img {
	width: 100%;
	height: auto;
	display: block;
}

.single-product .cover-wrap .badge {
	position: absolute;
	top: -14px;
	right: -10px;
	background: var(--nuit-vif, #2B54A0);
	color: #FFF;
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: .04em;
	padding: 9px 16px;
	border-radius: 999px;
	box-shadow: 0 10px 22px -8px rgba(43, 84, 160, .55);
	transform: rotate(4deg);
}

.single-product .ebook-hero .eyebrow {
	font-size: 11.5px;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--nuit-vif, #2B54A0);
	font-weight: 600;
}

.single-product .ebook-hero h1 {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 700;
	font-size: clamp(30px, 4.6vw, 48px);
	line-height: 1.06;
	letter-spacing: -.032em;
	margin-top: 14px;
}

.single-product .ebook-hero .sub {
	margin-top: 16px;
	font-size: clamp(15.5px, 1.9vw, 17.5px);
	color: var(--gris, #71737C);
	max-width: 46ch;
}

.single-product .ebook-hero .price-row {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 26px;
}

.single-product .ebook-hero .price {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 700;
	font-size: clamp(24px, 3vw, 30px);
	letter-spacing: -.02em;
	color: var(--encre, #15161A);
}

/* WooCommerce enveloppe le prix dans .woocommerce-Price-amount. */
.single-product .ebook-hero .price .woocommerce-Price-amount {
	font: inherit;
	color: inherit;
}

.single-product .ebook-hero .price-note {
	font-size: 13px;
	color: var(--gris, #71737C);
}

.single-product .ebook-hero .avec-pro {
	font-size: 13px;
	color: var(--gris, #71737C);
	margin-top: 14px;
}

.single-product .ebook-hero .avec-pro a {
	color: var(--nuit-vif, #2B54A0);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.single-product .ebook-hero .avec-pro a:hover {
	color: var(--nuit, #1E3A6E);
}

/* ---------- FORMULAIRE D'ACHAT ---------- */

.single-product .ebook-achat {
	margin-top: 24px;
}

.single-product .mail-achat {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 420px;
}

.single-product .mail-achat input {
	flex: 1;
	min-width: 180px;
	font: inherit;
	font-size: 14px;
	padding: 12px 16px;
	border-radius: 999px;
	border: 1.4px solid var(--trait, #E7E9EE);
	background: #FFF;
	color: var(--encre, #15161A);
	transition: border-color .2s;
}

.single-product .mail-achat input::placeholder {
	color: #A9ACB5;
}

.single-product .mail-achat input:focus {
	outline: none;
	border-color: var(--nuit-vif, #2B54A0);
}

.single-product .mail-hint {
	font-size: 12px;
	color: var(--gris, #71737C);
	margin-top: 8px;
	max-width: 46ch;
}

.single-product .mail-hint--inclus {
	margin-top: 24px;
	padding: 14px 18px;
	border-radius: 12px;
	background: var(--nuit-voile, #EEF2F9);
	color: var(--nuit, #1E3A6E);
	font-size: 13.5px;
}

.single-product .renonce {
	margin-top: 16px;
	max-width: 46ch;
}

.single-product .renonce label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--gris, #71737C);
	cursor: pointer;
}

.single-product .renonce input {
	flex: 0 0 auto;
	margin-top: 2px;
	width: 16px;
	height: 16px;
	accent-color: var(--nuit-vif, #2B54A0);
}

.single-product .ebook-achat .buy {
	margin-top: 22px;
}

/* ---------- CONTENU ---------- */

.single-product .contenu {
	background: linear-gradient(180deg, var(--voile, #F7F8FA) 0%, var(--voile, #F7F8FA) 74%, #FFF 100%);
	padding-block: clamp(60px, 8vw, 96px);
}

.single-product .contenu h2 {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 600;
	font-size: clamp(22px, 3.2vw, 32px);
	letter-spacing: -.026em;
	text-align: center;
}

.single-product .contenu .lede {
	text-align: center;
	color: var(--gris, #71737C);
	margin-top: 14px;
	font-size: 15.5px;
	max-width: 52ch;
	margin-inline: auto;
}

.single-product .chapitres {
	list-style: none;
	max-width: 640px;
	margin: clamp(32px, 4.4vw, 48px) auto 0;
	padding: 0;
	display: grid;
	gap: 12px;
}

.single-product .chapitre {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	background: #FFF;
	border: 1px solid var(--trait, #E7E9EE);
	border-radius: 14px;
	padding: 18px 20px;
	margin: 0;
}

.single-product .chapitre::before {
	content: none;
}

.single-product .chnum {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	border-radius: 9px;
	background: var(--nuit-voile, #EEF2F9);
	color: var(--nuit-vif, #2B54A0);
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 700;
	font-size: 13px;
	display: grid;
	place-items: center;
}

.single-product .chapitre h3 {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 600;
	font-size: 15.5px;
	letter-spacing: -.012em;
	margin: 0;
}

.single-product .chapitre p {
	font-size: 13.5px;
	color: var(--gris, #71737C);
	margin-top: 3px;
}

/* ---------- POUR QUI ---------- */

.single-product .pourqui {
	padding-block: clamp(60px, 8vw, 96px);
	background: #FFF;
}

.single-product .pourqui h2 {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 600;
	font-size: clamp(22px, 3.2vw, 32px);
	letter-spacing: -.026em;
	text-align: center;
}

.single-product .pq-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(20px, 3vw, 32px);
	max-width: 820px;
	margin: 32px auto 0;
}

.single-product .pq-card {
	border: 1px solid var(--trait, #E7E9EE);
	border-radius: 14px;
	padding: 24px;
	min-width: 0;
}

.single-product .pq-card h3 {
	font-family: var(--display, 'Archivo', system-ui, sans-serif);
	font-weight: 600;
	font-size: 16px;
	letter-spacing: -.014em;
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.single-product .pq-card .ico {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: var(--nuit-voile, #EEF2F9);
	display: grid;
	place-items: center;
	flex: 0 0 auto;
}

.single-product .pq-card .ico svg {
	width: 15px;
	height: 15px;
	stroke: var(--nuit-vif, #2B54A0);
	stroke-width: 1.8;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.single-product .pq-card p {
	font-size: 13.5px;
	color: var(--gris, #71737C);
	margin-top: 10px;
}

/* ---------- RESPONSIVE ---------- */

@media (max-width: 760px) {

	.single-product .ebook-hero .hgrid {
		grid-template-columns: 1fr;
	}

	.single-product .cover-wrap {
		max-width: 280px;
		margin-inline: auto;
	}

	.single-product .pq-grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- VERROU ANTI MODE SOMBRE ---------- */

@media (prefers-color-scheme: dark) {

	.single-product .ebook-hero,
	.single-product .pourqui {
		background: #FFF !important;
	}

	.single-product .contenu {
		background: linear-gradient(180deg, #F7F8FA 0%, #F7F8FA 74%, #FFF 100%) !important;
	}

	.single-product .chapitre,
	.single-product .pq-card,
	.single-product .mail-achat input {
		background: #FFF !important;
		border-color: #E7E9EE !important;
	}

	.single-product .ebook-hero h1,
	.single-product .contenu h2,
	.single-product .pourqui h2,
	.single-product .chapitre h3,
	.single-product .pq-card h3,
	.single-product .ebook-hero .price {
		color: #15161A !important;
	}

	.single-product .chnum {
		background: #EEF2F9 !important;
		color: #2B54A0 !important;
	}
}
