/* =========================================================================
   AdsKnowledge — Page d'accueil
   Palette : navy #0C447C · cyan #85B7EB · fond léger #E6F1FB · accent #185FA5
   Toutes les classes sont préfixées .ak- pour ne rien percuter du thème.
   ========================================================================= */

:root {
	--ak-navy:  #0C447C;
	--ak-blue:  #185FA5;
	--ak-cyan:  #85B7EB;
	--ak-wash:  #E6F1FB;
	--ak-ink:   #1a1a1a;
	--ak-muted: #5b6470;
	--ak-line:  #e4e8ee;
	--ak-card:  #ffffff;
}

.ak-home {
	max-width: 1080px;
	margin: 0 auto;
	color: var(--ak-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.ak-home .ti { line-height: 1; }

/* ---- Sections génériques ------------------------------------------------ */
.ak-section { padding: 40px 24px; border-bottom: 1px solid var(--ak-line); }
.ak-section:nth-of-type(even) { background: #fafbfc; }

.ak-section__head {
	display: flex; align-items: baseline; justify-content: space-between;
	gap: 16px; margin-bottom: 6px;
}
.ak-section__head h2 { font-size: 22px; font-weight: 500; margin: 0; color: var(--ak-ink); }
.ak-section__intro { font-size: 14px; color: var(--ak-muted); margin: 0 0 22px; }
.ak-section__more { font-size: 13px; color: var(--ak-blue); text-decoration: none; white-space: nowrap; }
.ak-section__more .ti { font-size: 13px; vertical-align: -1px; }

/* ---- Héros -------------------------------------------------------------- */
.ak-hero { padding: 64px 24px 52px; text-align: center; border-bottom: 1px solid var(--ak-line); }
.ak-hero__kicker {
	font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase;
	color: var(--ak-blue); margin: 0 0 16px;
}
.ak-hero__titre {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 38px; line-height: 1.22; font-weight: 400;
	max-width: 620px; margin: 0 auto 18px; color: var(--ak-ink);
}
.ak-hero__sous { font-size: 16px; color: var(--ak-muted); max-width: 480px; margin: 0 auto 28px; line-height: 1.6; }

.ak-hero__search {
	display: flex; align-items: center; gap: 10px;
	max-width: 520px; margin: 0 auto 18px;
	border: 1px solid #cdd6e2; border-radius: 28px;
	padding: 8px 8px 8px 18px; background: #fff;
}
.ak-hero__search .ti { font-size: 18px; color: var(--ak-muted); }
.ak-hero__search input {
	flex: 1; border: 0; outline: 0; background: transparent;
	font-size: 15px; color: var(--ak-ink); min-width: 0;
}
.ak-hero__search button {
	border: 0; cursor: pointer; background: var(--ak-navy); color: #fff;
	font-size: 14px; padding: 9px 20px; border-radius: 22px;
}
.ak-hero__search button:hover { background: #0a3a68; }

.ak-hero__chips { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.ak-chip {
	font-size: 13px; color: var(--ak-blue); text-decoration: none;
	background: var(--ak-wash); padding: 5px 14px; border-radius: 16px;
}
.ak-chip:hover { background: #d6e6f8; }

/* ---- Bande couches ------------------------------------------------------ */
.ak-couches__band { display: flex; align-items: stretch; gap: 8px; }
.ak-couche {
	flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px;
	text-decoration: none; text-align: center;
	background: var(--ak-wash); border: 1px solid var(--ak-cyan);
	border-radius: 10px; padding: 16px 6px; color: var(--ak-navy);
	transition: transform .12s ease, background .12s ease;
}
.ak-couche:hover { background: #d6e6f8; transform: translateY(-2px); }
.ak-couche .ti { font-size: 22px; }
.ak-couche__label { font-size: 12px; font-weight: 500; }
.ak-couches__sep { align-self: center; color: #a7b4c4; font-size: 16px; }

/* ---- Grilles de cartes -------------------------------------------------- */
.ak-grid { display: grid; gap: 14px; }
.ak-grid--2 { grid-template-columns: repeat(2, 1fr); }
.ak-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ak-grid--feature { grid-template-columns: 1.5fr 1fr 1fr; align-items: start; }

.ak-card {
	display: block; text-decoration: none; color: inherit;
	background: var(--ak-card); border: 1px solid var(--ak-line);
	border-radius: 14px; padding: 18px 20px;
	transition: border-color .12s ease, transform .12s ease;
}
.ak-card:hover { border-color: var(--ak-cyan); transform: translateY(-2px); }
.ak-card__eyebrow {
	font-size: 11px; letter-spacing: .5px; text-transform: uppercase; color: var(--ak-blue);
}
.ak-card__titre { font-size: 17px; font-weight: 500; margin: 6px 0 8px; color: var(--ak-ink); }
.ak-card__desc { font-size: 13px; color: var(--ak-muted); margin: 0; line-height: 1.55; }
.ak-card__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.ak-card__row .ak-card__titre { margin: 0; }

.ak-card--outil .ak-card__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 10px; background: var(--ak-wash);
	color: var(--ak-navy); margin-bottom: 12px;
}
.ak-card--outil .ak-card__icon .ti { font-size: 20px; }

.ak-badge {
	font-size: 11px; color: var(--ak-navy); background: var(--ak-wash);
	padding: 3px 10px; border-radius: 12px; white-space: nowrap;
}
.ak-card__notes { display: flex; gap: 16px; font-size: 11px; color: var(--ak-muted); margin-top: 14px; }
.ak-dots { color: var(--ak-navy); letter-spacing: 1px; font-weight: 400; }

/* ---- Analyses ----------------------------------------------------------- */
.ak-art {
	display: block; text-decoration: none; color: inherit;
	background: var(--ak-card); border: 1px solid var(--ak-line);
	border-radius: 14px; overflow: hidden;
	transition: border-color .12s ease, transform .12s ease;
}
.ak-art:hover { border-color: var(--ak-cyan); transform: translateY(-2px); }
.ak-art__media { height: 120px; background: var(--ak-navy); position: relative; }
.ak-art__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ak-art__glyph {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	color: var(--ak-cyan);
}
.ak-art__glyph .ti { font-size: 34px; }
.ak-art:nth-child(2) .ak-art__media { background: var(--ak-blue); }
.ak-art:nth-child(2) .ak-art__glyph { color: var(--ak-wash); }
.ak-art:nth-child(3) .ak-art__media { background: #378ADD; }
.ak-art:nth-child(3) .ak-art__glyph { color: var(--ak-wash); }
.ak-art--big .ak-art__media { height: 150px; }
.ak-art__body { padding: 14px 16px; }
.ak-art__titre { font-size: 16px; font-weight: 500; margin: 6px 0 6px; line-height: 1.35; color: var(--ak-ink); }

/* ---- Ancre pub (vide par défaut) --------------------------------------- */
.ak-ad { max-width: 1080px; margin: 0 auto; padding: 8px 24px; text-align: center; }
.ak-ad:empty { display: none; }

/* ---- Responsive --------------------------------------------------------- */
@media (max-width: 760px) {
	.ak-hero__titre { font-size: 28px; }
	.ak-couches__band { flex-wrap: wrap; }
	.ak-couche { flex: 1 1 40%; }
	.ak-couches__sep { display: none; }
	.ak-grid--2, .ak-grid--3, .ak-grid--feature { grid-template-columns: 1fr; }
}
