/* ==========================================================================
   ClickApp components (icons, urgency banner, ticker, mega-menu)
   Charged after main-live.css. Reuses --ca-* tokens with safe fallbacks.
   ========================================================================== */

/* ---------- Icons (Lucide sprite) ---------- */
.ca-icon         { display: inline-block; vertical-align: middle; flex-shrink: 0; }
.ca-icon--red    { color: var(--ca-red,    #B83010); }
.ca-icon--green  { color: var(--ca-green,  #1B6CF2); }
.ca-icon--blue   { color: var(--ca-blue,   #1455A4); }
.ca-icon--purple { color: var(--ca-purple, #4A3AAF); }
.ca-icon--amber  { color: var(--ca-amber,  #9A5E0A); }
.ca-icon--ink    { color: var(--ca-ink,    #0A0A09); }
.ca-icon--white  { color: #fff; }
.ca-icon--muted  { color: var(--ca-ink-3,  #7A7A76); }

/* ---------- Mega-menu Services (modifsite.md §15) ---------- */
.menu-item.has-ca-mega-menu { position: static; }
.has-ca-mega-menu > .sub-menu { display: none !important; }   /* hide WP native sub-menu when mega-menu active */

.ca-mega-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	width: min(960px, calc(100vw - 32px));
	background: #fff;
	border-radius: 24px;
	box-shadow: 0 24px 60px rgba(0,0,0,.12);
	padding: 36px 28px 28px;   /* top extra = hover bridge integrated */
	z-index: 200;
	display: none;
	opacity: 0;
	transition: opacity .18s ease;
}
/* Invisible safety bridge above the panel so the cursor never leaves hover */
.ca-mega-menu::before {
	content: "";
	position: absolute;
	top: -12px; left: 0; right: 0; height: 12px;
	background: transparent;
}
.menu-item.has-ca-mega-menu:hover > .ca-mega-menu,
.menu-item.has-ca-mega-menu:focus-within > .ca-mega-menu,
.menu-item.has-ca-mega-menu.is-open > .ca-mega-menu {
	display: block;
	opacity: 1;
}
.ca-mega-menu__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
}
.ca-mega-menu__col { min-width: 0; }
.ca-mega-menu__head {
	display: flex; align-items: center; gap: 8px;
	font-size: 11px; font-weight: 700;
	letter-spacing: .12em; text-transform: uppercase;
	color: var(--ca-ink, #0A0A09);
	margin-bottom: 12px;
}
.ca-mega-menu__dot {
	width: 8px; height: 8px; border-radius: 50%;
	flex-shrink: 0;
}
.ca-mega-menu__badge {
	font-size: 10px; padding: 2px 8px; border-radius: 999px;
	background: #f0f0ec; color: #555;
	letter-spacing: .04em;
}
.ca-mega-menu__badge--nouveau { background: #E6F0FE; color: #1B6CF2; }
.ca-mega-menu__badge--urgent  { background: #FEF0EB; color: #B83010; }
.ca-mega-menu__list {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 4px;
}
.ca-mega-menu__list a {
	display: block; padding: 6px 0;
	color: var(--ca-ink-2, #3A3A38);
	text-decoration: none; font-size: 14px;
	transition: color .15s ease, transform .15s ease;
}
.ca-mega-menu__list a:hover {
	color: var(--ca-green, #1B6CF2);
	transform: translateX(2px);
}
.ca-mega-menu__footer {
	display: flex; justify-content: space-between; align-items: center;
	border-top: 1px solid #E4E4E0;
	margin-top: 18px; padding-top: 14px;
	font-size: 14px; gap: 16px; flex-wrap: wrap;
}
.ca-mega-menu__alert {
	color: #B83010; text-decoration: none;
	display: inline-flex; align-items: center; gap: 6px;
}
.ca-mega-menu__alert:hover { text-decoration: underline; }
.ca-mega-menu__all {
	color: var(--ca-ink-2, #3A3A38); text-decoration: none;
	display: inline-flex; align-items: center; gap: 4px;
	font-weight: 600;
}
.ca-mega-menu__all:hover { color: var(--ca-green, #1B6CF2); }

/* Below 1100px: hide the desktop overlay panel everywhere EXCEPT inside the drawer */
@media (max-width: 1099px) {
	.ca-mega-menu:not(.ca-drawer .ca-mega-menu) { display: none !important; }
	/* Native sub-menu shown only outside drawer (drawer hides it explicitly above) */
	.has-ca-mega-menu:not(.ca-drawer__menu .has-ca-mega-menu) > .sub-menu { display: block !important; }
}

/* ===== Mobile accordion mode — mega-menu inside drawer ===== */
.ca-drawer .ca-mega-menu {
	position: static;
	transform: none;
	width: auto;
	background: transparent;
	box-shadow: none;
	border-radius: 0;
	padding: 6px 0 4px 8px;
	margin: 4px 0 8px;
	display: none;       /* hidden until parent .has-ca-mega-menu gets .is-open */
	opacity: 1;
	transition: none;
	z-index: auto;
}
.ca-drawer .ca-mega-menu::before { display: none; }
.ca-drawer .menu-item.has-ca-mega-menu.is-open > .ca-mega-menu { display: block; }

/* Chevron on the Services top-level link inside drawer */
.ca-drawer__menu .has-ca-mega-menu > a {
	position: relative;
	padding-right: 48px;
}
.ca-drawer__menu .has-ca-mega-menu > a::after {
	content: "";
	position: absolute;
	top: 50%; right: 22px;
	width: 10px; height: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-75%) rotate(45deg);
	transition: transform .25s var(--easing-premium, ease);
	opacity: .7;
}
.ca-drawer__menu .has-ca-mega-menu.is-open > a::after {
	transform: translateY(-25%) rotate(-135deg);
	opacity: 1;
}

/* Grid → vertical stack of cards inside drawer */
.ca-drawer .ca-mega-menu__grid {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.ca-drawer .ca-mega-menu__col {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 12px;
	overflow: hidden;
	transition: border-color .2s, background .2s;
}
.ca-drawer .ca-mega-menu__col.is-open {
	background: rgba(255, 255, 255, 0.05);
	border-color: rgba(0, 229, 255, 0.18);
}

/* Column header becomes the accordion toggle (44px+ touch target) */
.ca-drawer .ca-mega-menu__head {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 12px 16px;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.92);
	letter-spacing: .14em;
	cursor: pointer;
	user-select: none;
	position: relative;
}
.ca-drawer .ca-mega-menu__head::after {
	content: "";
	margin-left: auto;
	width: 9px; height: 9px;
	border-right: 2px solid rgba(255, 255, 255, 0.7);
	border-bottom: 2px solid rgba(255, 255, 255, 0.7);
	transform: rotate(45deg);
	transition: transform .25s var(--easing-premium, ease);
}
.ca-drawer .ca-mega-menu__col.is-open .ca-mega-menu__head::after {
	transform: rotate(-135deg);
	border-color: var(--color-accent, #00E5FF);
}
.ca-drawer .ca-mega-menu__dot {
	width: 10px; height: 10px;
	box-shadow: 0 0 0 3px rgba(255,255,255,0.06);
}
.ca-drawer .ca-mega-menu__badge {
	background: rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.85);
}
.ca-drawer .ca-mega-menu__badge--nouveau { background: rgba(0, 229, 255, 0.15); color: #7bdcff; }
.ca-drawer .ca-mega-menu__badge--urgent  { background: rgba(255, 90, 60, 0.15); color: #ff9b85; }

/* Items list — collapsed by default, expand on .is-open */
.ca-drawer .ca-mega-menu__list {
	max-height: 0;
	overflow: hidden;
	margin: 0;
	padding: 0 16px;
	transition: max-height .3s var(--easing-premium, ease), padding .3s var(--easing-premium, ease);
	gap: 0;
}
.ca-drawer .ca-mega-menu__col.is-open .ca-mega-menu__list {
	max-height: 600px;
	padding: 4px 16px 14px;
}
.ca-drawer .ca-mega-menu__list a {
	display: block;
	padding: 11px 8px 11px 22px;
	color: rgba(255, 255, 255, 0.75);
	font-size: 15px;
	border-radius: 8px;
	position: relative;
	min-height: 44px;
}
.ca-drawer .ca-mega-menu__list a::before {
	content: "";
	position: absolute;
	top: 50%; left: 6px;
	width: 8px; height: 1px;
	background: rgba(255, 255, 255, 0.25);
	transition: width .2s, background .2s;
}
.ca-drawer .ca-mega-menu__list a:hover,
.ca-drawer .ca-mega-menu__list a:focus-visible {
	color: var(--color-accent, #00E5FF);
	background: rgba(255, 255, 255, 0.04);
	transform: none;
	outline: none;
}
.ca-drawer .ca-mega-menu__list a:hover::before {
	width: 12px;
	background: var(--color-accent, #00E5FF);
}

/* Footer inside drawer */
.ca-drawer .ca-mega-menu__footer {
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	margin: 12px 0 4px;
	padding: 14px 14px 4px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	font-size: 13px;
}
.ca-drawer .ca-mega-menu__alert {
	color: #ff9b85;
	background: rgba(255, 90, 60, 0.08);
	padding: 10px 12px;
	border-radius: 8px;
	font-size: 13px;
	gap: 8px;
	flex-wrap: wrap;
}
.ca-drawer .ca-mega-menu__all {
	color: var(--color-accent, #00E5FF);
	justify-content: flex-end;
}
.ca-drawer .ca-mega-menu__all:hover { color: #fff; }

/* Desktop-only grid scaling (preserve original behavior at narrow desktop widths) */
@media (max-width: 1023px) {
	.ca-mega-menu:not(.ca-drawer .ca-mega-menu) .ca-mega-menu__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 600px) {
	.ca-mega-menu:not(.ca-drawer .ca-mega-menu) .ca-mega-menu__grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Urgency banner (modifsite.md §2.1) ---------- */
.ca-urgency {
	background: var(--ca-red, #B83010);
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	position: relative;
	z-index: 250;
}
.ca-urgency__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 9px 16px;
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.ca-urgency__main { font-weight: 700; }
.ca-urgency__sep  { opacity: .55; }
.ca-urgency__sub  { opacity: .9; }
.ca-urgency__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	color: var(--ca-red, #B83010);
	padding: 6px 14px;
	border-radius: 999px;
	font-weight: 700;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease;
}
.ca-urgency__cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0,0,0,.18);
	color: var(--ca-red, #B83010);
}
@media (max-width: 599px) {
	/* Spec §2.1 : disparaît en mode lecture mobile à partir de 600px */
	.ca-urgency { display: none; }
}

/* ---------- Ticker animé (modifsite.md §2.4) ---------- */
.ca-ticker {
	overflow: hidden;
	padding: 16px 0;
	border-block: 1px solid var(--ca-border, #E4E4E0);
	background: var(--ca-bg, #F8F8F6);
}
.ca-ticker__track {
	display: flex;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	width: max-content;
	animation: ca-ticker-scroll 40s linear infinite;
}
.ca-ticker__track li {
	font-size: 16px;
	font-weight: 600;
	color: var(--ca-ink, #0A0A09);
	padding: 0 32px;
	position: relative;
}
.ca-ticker__track li::after {
	content: '·';
	position: absolute;
	right: -4px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--ca-ink-3, #7A7A76);
	opacity: .6;
}
@keyframes ca-ticker-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
.ca-ticker:hover .ca-ticker__track {
	animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce) {
	.ca-ticker__track { animation: none; }
}

/* ==========================================================================
   Widgets refonte 2026 — modifsite.md
   ========================================================================== */

/* Section helpers (containers narrow) */
.ca-container--narrow { max-width: 880px; margin-inline: auto; padding-inline: 16px; }

/* Eyebrow stylisé commun */
.ca-cmp__eyebrow, .ca-recog__eyebrow, .ca-feat__eyebrow,
.ca-svcp__eyebrow, .ca-atk__eyebrow, .ca-faq__eyebrow {
	display: inline-block;
	font-size: 11px; font-weight: 700;
	letter-spacing: .14em; text-transform: uppercase;
	color: var(--ca-ink-3, #7A7A76);
	margin-bottom: 10px;
}
.ca-em { font-family: 'Lora', Georgia, serif; font-style: italic; color: var(--ca-green, #1B6CF2); font-weight: 500; }

/* ---------- Comparison Table (Eux/Nous) ---------- */
.ca-cmp__head { max-width: 720px; margin: 0 auto 48px; }
.ca-cmp__title { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.06; letter-spacing: -0.04em; margin-bottom: 12px; }
.ca-cmp__lead { color: var(--ca-ink-2, #3A3A38); font-size: 17px; }
.ca-cmp__grid {
	display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
.ca-cmp__col {
	background: #fff;
	border: 1px solid var(--ca-border, #E4E4E0);
	border-radius: 24px;
	padding: 28px 24px;
}
.ca-cmp__col--right {
	background: linear-gradient(135deg, #fff 0%, #F7FBF8 100%);
	border-color: var(--ca-green-b, #B8D4FC);
	box-shadow: 0 8px 24px rgba(27,108,242,.10);
}
.ca-cmp__col-label {
	font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--ca-ink-3, #7A7A76); margin-bottom: 12px;
}
.ca-cmp__col--left .ca-cmp__col-label { color: var(--ca-red, #B83010); }
.ca-cmp__col--right .ca-cmp__col-label { color: var(--ca-green, #1B6CF2); }
.ca-cmp__col-title {
	font-size: clamp(1.1rem, 2.4vw, 1.5rem);
	line-height: 1.3; letter-spacing: -0.02em; margin: 0 0 20px;
}
.ca-cmp__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.ca-cmp__list li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; line-height: 1.5; color: var(--ca-ink-2, #3A3A38); }
.ca-cmp__list li span { flex: 1; }
@media (max-width: 767px) {
	.ca-cmp__grid { grid-template-columns: 1fr; }
}

/* ---------- Recognition (Vous vous reconnaissez ?) ---------- */
.ca-recog__head { max-width: 720px; margin: 0 auto 48px; }
.ca-recog__title { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.06; letter-spacing: -0.04em; margin-bottom: 12px; }
.ca-recog__grid {
	display: grid; gap: 20px;
	grid-template-columns: repeat(var(--cols, 2), 1fr);
}
.ca-recog__card {
	background: #fff;
	border: 1px solid var(--ca-border, #E4E4E0);
	border-radius: 20px;
	padding: 24px;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ca-recog__card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.06); }
.ca-recog__card.is-urgent { border-color: var(--ca-red-b, #F5C4A8); background: linear-gradient(180deg, #fff 0%, #FEF7F4 100%); }
.ca-recog__card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.ca-recog__icon { color: var(--ca-ink, #0A0A09); }
.ca-recog__card.is-urgent .ca-recog__icon { color: var(--ca-red, #B83010); }
.ca-recog__badge {
	font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
	background: var(--ca-red-l, #FEF0EB); color: var(--ca-red, #B83010);
	padding: 4px 10px; border-radius: 999px;
}
.ca-recog__problem {
	font-size: 17px; line-height: 1.45; color: var(--ca-ink, #0A0A09);
	margin: 0 0 12px; font-style: italic; font-family: 'Lora', Georgia, serif;
}
.ca-recog__answer { font-size: 15px; color: var(--ca-ink-2, #3A3A38); margin: 0; line-height: 1.5; }
.ca-recog__answer strong { color: var(--ca-green, #1B6CF2); margin-right: 4px; }
@media (max-width: 767px) {
	.ca-recog__grid { grid-template-columns: 1fr; }
}

/* ---------- Features Grid (6 bénéfices) ---------- */
.ca-feat__head { max-width: 720px; margin: 0 auto 48px; }
.ca-feat__title { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.06; letter-spacing: -0.04em; margin-bottom: 12px; }
.ca-feat__grid {
	display: grid; gap: 32px;
	grid-template-columns: repeat(var(--cols, 3), 1fr);
}
.ca-feat__item { padding: 8px 0; }
.ca-feat__icon {
	width: 56px; height: 56px; border-radius: 14px;
	background: var(--ca-green-l, #E6F0FE);
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 16px; color: var(--ca-green, #1B6CF2);
}
.ca-feat__item-title {
	font-size: 19px; font-weight: 700; line-height: 1.25;
	margin: 0 0 8px; letter-spacing: -0.01em;
	color: var(--ca-ink, #0A0A09);
}
.ca-feat__item-desc { font-size: 15px; line-height: 1.55; color: var(--ca-ink-2, #3A3A38); margin: 0; }
@media (max-width: 1023px) { .ca-feat__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .ca-feat__grid { grid-template-columns: 1fr; } }

/* ---------- Services Pricing Blocks ---------- */
.ca-svcp__head { max-width: 720px; margin: 0 auto 48px; }
.ca-svcp__title { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.06; letter-spacing: -0.04em; margin-bottom: 12px; }
.ca-svcp__grid {
	display: grid; gap: 24px;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.ca-svcp__card {
	background: #fff;
	border: 1px solid var(--ca-border, #E4E4E0);
	border-radius: 20px;
	padding: 28px 24px;
	display: flex; flex-direction: column;
	transition: transform .2s, box-shadow .2s;
}
.ca-svcp__card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.08); }
.ca-svcp__card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ca-svcp__icon { display: inline-flex; }
.ca-svcp__card-title { font-size: 18px; font-weight: 700; margin: 0; line-height: 1.3; }
.ca-svcp__card-desc { font-size: 14px; line-height: 1.5; color: var(--ca-ink-2, #3A3A38); margin: 0 0 16px; }
.ca-svcp__features { list-style: none; padding: 0; margin: 0 0 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ca-svcp__features li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--ca-ink-2, #3A3A38); }
.ca-svcp__footer {
	display: flex; align-items: center; justify-content: space-between;
	padding-top: 16px; border-top: 1px solid var(--ca-border, #E4E4E0); margin-top: auto;
}
.ca-svcp__price { font-size: 16px; font-weight: 700; color: var(--ca-ink, #0A0A09); }
.ca-svcp__cta {
	font-size: 13px; font-weight: 600; text-decoration: none;
	color: var(--ca-ink, #0A0A09);
	display: inline-flex; align-items: center; gap: 4px;
}
.ca-svcp__cta:hover { color: var(--ca-green, #1B6CF2); }
.ca-svcp--red .ca-svcp__cta:hover { color: var(--ca-red, #B83010); }
.ca-svcp--purple .ca-svcp__cta:hover { color: var(--ca-purple, #4A3AAF); }

/* ---------- Attack Timeline ---------- */
.ca-atk { background: var(--ca-ink, #0A0A09); color: #fff; }
.ca-atk .ca-atk__title, .ca-atk .ca-atk__lead { color: #fff; }
.ca-atk__head { max-width: 720px; margin: 0 auto 48px; text-align: center; }
.ca-atk__eyebrow { color: var(--ca-red-b, #F5C4A8); }
.ca-atk__title { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.06; letter-spacing: -0.04em; }
.ca-atk__lead { color: rgba(255,255,255,.7); }
.ca-atk__list { list-style: none; padding: 0; margin: 0; max-width: 760px; margin-inline: auto; counter-reset: atk; }
.ca-atk__step {
	display: grid;
	grid-template-columns: 100px 56px 1fr;
	gap: 16px; align-items: start;
	padding: 24px 0;
	border-bottom: 1px solid rgba(255,255,255,.1);
	position: relative;
}
.ca-atk__step:last-child { border-bottom: 0; }
.ca-atk__step-period {
	font-family: ui-monospace, 'SF Mono', monospace;
	font-size: 13px; color: var(--ca-red-b, #F5C4A8); font-weight: 700;
	letter-spacing: .04em;
}
.ca-atk__step-icon {
	width: 44px; height: 44px; border-radius: 12px;
	background: rgba(184,48,16,.15);
	display: inline-flex; align-items: center; justify-content: center;
}
.ca-atk__step-stage { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: #fff; }
.ca-atk__step-desc { font-size: 14px; color: rgba(255,255,255,.7); margin: 0; line-height: 1.5; }
@media (max-width: 600px) {
	.ca-atk__step { grid-template-columns: 1fr; gap: 8px; }
	.ca-atk__step-icon { display: none; }
}

/* ---------- FAQ Accordion ---------- */
.ca-faq__head { margin-bottom: 40px; }
.ca-faq__title { font-size: clamp(1.6rem, 3.5vw, 2.4rem); line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 12px; }
.ca-faq__list { display: flex; flex-direction: column; gap: 8px; }
.ca-faq__item {
	background: #fff;
	border: 1px solid var(--ca-border, #E4E4E0);
	border-radius: 14px;
	padding: 0;
	transition: border-color .15s ease;
}
.ca-faq__item[open] { border-color: var(--ca-green-b, #B8D4FC); }
.ca-faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 18px 22px;
	font-size: 16px; font-weight: 600; color: var(--ca-ink, #0A0A09);
	cursor: pointer; list-style: none; user-select: none;
}
.ca-faq__q::-webkit-details-marker { display: none; }
.ca-faq__chevron {
	color: var(--ca-ink-3, #7A7A76);
	transition: transform .2s ease;
	transform: rotate(90deg);
}
.ca-faq__item[open] .ca-faq__chevron { transform: rotate(-90deg); color: var(--ca-green, #1B6CF2); }
.ca-faq__a {
	padding: 0 22px 22px;
	font-size: 15px; line-height: 1.65; color: var(--ca-ink-2, #3A3A38);
}
.ca-faq__a p { margin: 0 0 12px; }
.ca-faq__a p:last-child { margin-bottom: 0; }

/* Footer tagline Lora italic (modifsite.md §16) */
.ca-footer__tagline--lora em {
	font-family: 'Lora', Georgia, serif;
	font-style: italic;
	font-size: 17px;
	line-height: 1.45;
	color: var(--ca-ink-2, #3A3A38);
}

/* ==========================================================================
   FIX SERVICES 5 CARDS — uniform grid responsive 12 viewports CLAUDE.md §4
   Override .ca-grid-3 default (auto-fit + orphan stretch) scoped to services.
   ========================================================================== */
.ca-services .ca-grid-3 {
	display: grid;
	gap: 20px;
	align-items: stretch;
}

/* Card height equalization across the row (premium v2 base in main-live.css) */
.ca-services .ca-service-card { height: 100%; }

/* — Smartphone S 320–374 — 1 col compact gap */
@media (max-width: 374px) {
	.ca-services .ca-grid-3 { grid-template-columns: 1fr; gap: 14px; }
}
/* — Smartphone M/L 375–479 — 1 col */
@media (min-width: 375px) and (max-width: 479px) {
	.ca-services .ca-grid-3 { grid-template-columns: 1fr; gap: 16px; }
}
/* — Smartphone L 480–639 — 1 col larger */
@media (min-width: 480px) and (max-width: 639px) {
	.ca-services .ca-grid-3 { grid-template-columns: 1fr; gap: 18px; }
}
/* — Tablet portrait 640–767 — 2 cols, 5e seul centré */
@media (min-width: 640px) and (max-width: 767px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(4, 1fr); gap: 18px; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(1) { grid-column: 1 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(2) { grid-column: 3 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(3) { grid-column: 1 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(4) { grid-column: 3 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(5) { grid-column: 2 / span 2; }
}
/* — Tablet 768–1023 — 3 cols, last 2 cards centered (no orphan stretch) */
@media (min-width: 768px) and (max-width: 1023px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(6, 1fr); gap: 20px; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(1) { grid-column: 1 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(2) { grid-column: 3 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(3) { grid-column: 5 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(4) { grid-column: 2 / span 2; }
	.ca-services .ca-grid-3 > .ca-service-card:nth-child(5) { grid-column: 4 / span 2; }
}
/* — Laptop 10" / netbook 1024–1279 — 5 cols compact */
@media (min-width: 1024px) and (max-width: 1279px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
}
/* — Laptop 13" 1280–1365 — 5 cols medium */
@media (min-width: 1280px) and (max-width: 1365px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 14px; }
}
/* — Laptop 14" 1366–1439 — 5 cols comfortable */
@media (min-width: 1366px) and (max-width: 1439px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 18px; }
}
/* — Laptop 14"/15.6" 1440–1535 — 5 cols spacious */
@media (min-width: 1440px) and (max-width: 1535px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 20px; }
}
/* — Laptop 15.6" Full HD 1536–1679 — 5 cols full */
@media (min-width: 1536px) and (max-width: 1679px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 24px; }
}
/* — Desktop standard 1680–1919 — 5 cols generous */
@media (min-width: 1680px) and (max-width: 1919px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 28px; }
}
/* — Desktop large/4K ≥1920 — 5 cols max */
@media (min-width: 1920px) {
	.ca-services .ca-grid-3 { grid-template-columns: repeat(5, 1fr); gap: 32px; }
}

/* ==========================================================================
   INTERNAL PAGES FOUNDATIONS (V0 — 2026-05-12)
   Composants utilitaires partagés pour les pages internes (hors home).
   Tous scopés par .ca-internal-page pour ne pas polluer la home.
   ========================================================================== */

/* ---------- Section wrappers ---------- */
.ca-internal-page .ca-section--deep {
	background: var(--ca-bg-deep);
	color: #fff;
	padding: clamp(80px, 10vw, 160px) 0;
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-block: 1px solid rgba(0,229,255,0.10);
}
.ca-internal-page .ca-section--deep::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(rgba(0,229,255,0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0,229,255,0.045) 1px, transparent 1px);
	background-size: 64px 64px;
	mask-image: radial-gradient(ellipse 80% 65% at 50% 50%, #000 30%, transparent 90%);
	-webkit-mask-image: radial-gradient(ellipse 80% 65% at 50% 50%, #000 30%, transparent 90%);
	pointer-events: none;
	z-index: 1;
}
.ca-internal-page .ca-section--deep > * {
	position: relative;
	z-index: 2;
}

.ca-internal-page .ca-section--light {
	background: var(--ca-bg-light);
	color: var(--ca-ink, #0A0A09);
	padding: clamp(80px, 10vw, 140px) 0;
	position: relative;
}
.ca-internal-page .ca-section--light--soft {
	background: var(--ca-bg-light-soft);
}

/* ---------- Hero générique pages internes ---------- */
.ca-internal-page .ca-hero-internal {
	background: var(--ca-bg-deep);
	color: #fff;
	padding: clamp(96px, 12vw, 180px) 0 clamp(80px, 10vw, 140px);
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.ca-internal-page .ca-hero-internal__container {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	max-width: 1240px;
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 48px);
	position: relative;
	z-index: 2;
}
@media (min-width: 980px) {
	.ca-internal-page .ca-hero-internal__container {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		align-items: center;
		gap: 64px;
	}
}

.ca-internal-page .ca-hero-internal__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: var(--ca-fs-eyebrow);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #00E5FF;
	margin-bottom: 20px;
}
.ca-internal-page .ca-hero-internal__eyebrow::before {
	content: '';
	width: 24px;
	height: 1px;
	background: #00E5FF;
}

.ca-internal-page .ca-hero-internal__title {
	font-size: var(--ca-fs-h1);
	line-height: 1.04;
	letter-spacing: -0.04em;
	font-weight: 700;
	margin: 0 0 24px;
}
.ca-internal-page .ca-hero-internal__title em,
.ca-internal-page .ca-hero-internal__title .grad {
	background: var(--ca-grad-text);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-style: normal;
}

.ca-internal-page .ca-hero-internal__subtitle {
	font-size: clamp(1.05rem, 1.5vw, 1.25rem);
	line-height: 1.55;
	color: rgba(255,255,255,0.78);
	max-width: 60ch;
	margin: 0 0 36px;
}

.ca-internal-page .ca-hero-internal__kpis {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 12px;
	max-width: 580px;
}
.ca-internal-page .ca-hero-internal__kpi {
	background: var(--ca-card-glass-bg);
	border: 1px solid var(--ca-card-glass-border);
	backdrop-filter: var(--ca-card-glass-blur);
	-webkit-backdrop-filter: var(--ca-card-glass-blur);
	border-radius: 14px;
	padding: 18px 20px;
}
.ca-internal-page .ca-hero-internal__kpi-value {
	font-size: clamp(1.5rem, 2.2vw, 2rem);
	font-weight: 700;
	background: var(--ca-grad-text);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	line-height: 1;
	margin: 0 0 6px;
}
.ca-internal-page .ca-hero-internal__kpi-label {
	font-size: 13px;
	color: rgba(255,255,255,0.68);
	margin: 0;
}

.ca-internal-page .ca-hero-internal__visual {
	display: none;
}
@media (min-width: 980px) {
	.ca-internal-page .ca-hero-internal__visual {
		display: block;
		position: relative;
	}
	.ca-internal-page .ca-hero-internal__visual img,
	.ca-internal-page .ca-hero-internal__visual svg {
		max-width: 100%;
		height: auto;
		filter: drop-shadow(0 30px 80px rgba(27,108,242,0.30));
	}
}

/* ---------- Breadcrumb premium ---------- */
.ca-internal-page .ca-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	letter-spacing: 0.04em;
	color: rgba(255,255,255,0.6);
	margin-bottom: 24px;
	position: relative;
	z-index: 3;
}
.ca-internal-page .ca-section--light .ca-breadcrumb {
	color: var(--ca-ink-3, #7A7A76);
}
.ca-internal-page .ca-breadcrumb a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}
.ca-internal-page .ca-breadcrumb a:hover,
.ca-internal-page .ca-breadcrumb a:focus-visible {
	color: #00E5FF;
}
.ca-internal-page .ca-section--light .ca-breadcrumb a:hover {
	color: #1B6CF2;
}
.ca-internal-page .ca-breadcrumb__sep {
	opacity: 0.45;
	user-select: none;
}
.ca-internal-page .ca-breadcrumb__current {
	color: rgba(255,255,255,0.92);
	font-weight: 600;
}
.ca-internal-page .ca-section--light .ca-breadcrumb__current {
	color: var(--ca-ink, #0A0A09);
}
.ca-legal-page .ca-breadcrumb { display: none; }

/* ---------- Card : glassmorphism (fond deep) ---------- */
.ca-internal-page .ca-card--glass {
	background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(0,229,255,0.10);
	border-radius: 20px;
	padding: 28px 26px;
	color: #fff;
	position: relative;
	overflow: hidden;
	transition: transform 0.4s cubic-bezier(0.4,0,0.2,1), border-color 0.4s, box-shadow 0.4s;
	box-shadow:
		0 1px 0 rgba(255,255,255,0.05) inset,
		0 24px 60px -28px rgba(0,0,0,0.6);
}
.ca-internal-page .ca-card--glass:hover {
	transform: translateY(-6px);
	border-color: rgba(0,229,255,0.35);
	box-shadow:
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 34px 70px -28px rgba(0,0,0,0.7),
		var(--ca-shadow-card-hover-cyan);
}
.ca-internal-page .ca-card--glass--blue:hover {
	border-color: rgba(27,108,242,0.40);
	box-shadow:
		0 1px 0 rgba(255,255,255,0.08) inset,
		0 34px 70px -28px rgba(0,0,0,0.7),
		var(--ca-shadow-card-hover-blue);
}
.ca-internal-page .ca-card--glass__title {
	font-size: clamp(1.1rem, 1.5vw, 1.25rem);
	font-weight: 700;
	margin: 0 0 12px;
	color: #fff;
}
.ca-internal-page .ca-card--glass__body {
	font-size: 0.95rem;
	line-height: 1.55;
	color: rgba(255,255,255,0.78);
	margin: 0;
}

/* ---------- Card : light (fond light) ---------- */
.ca-internal-page .ca-card--light {
	background: #fff;
	border: 1px solid rgba(10,15,30,0.06);
	border-radius: 20px;
	padding: 28px 26px;
	color: var(--ca-ink, #0A0A09);
	position: relative;
	overflow: hidden;
	transition: transform 0.4s cubic-bezier(0.4,0,0.2,1), border-color 0.4s, box-shadow 0.4s;
	box-shadow: var(--ca-shadow-card-light);
}
.ca-internal-page .ca-card--light:hover {
	transform: translateY(-6px);
	border-color: rgba(27,108,242,0.20);
	box-shadow: var(--ca-shadow-card-hover-blue);
}
.ca-internal-page .ca-card--light--cyan:hover {
	border-color: rgba(0,229,255,0.35);
	box-shadow: var(--ca-shadow-card-hover-cyan);
}
.ca-internal-page .ca-card--light__title {
	font-size: clamp(1.1rem, 1.5vw, 1.25rem);
	font-weight: 700;
	margin: 0 0 12px;
	color: var(--ca-ink, #0A0A09);
}
.ca-internal-page .ca-card--light__body {
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--ca-ink-2, #3A3A38);
	margin: 0;
}

/* ---------- TOC sticky (pages légales) ---------- */
.ca-internal-page .ca-toc-sticky {
	display: none;
}
@media (min-width: 1024px) {
	.ca-internal-page .ca-toc-sticky {
		display: block;
		position: sticky;
		top: 120px;
		max-height: calc(100vh - 160px);
		overflow-y: auto;
		padding: 24px 20px;
		background: #fff;
		border: 1px solid var(--ca-border, #E4E4E0);
		border-radius: 16px;
		font-size: 14px;
		line-height: 1.5;
		box-shadow: var(--ca-shadow-card-light);
	}
}
.ca-internal-page .ca-toc-sticky__title {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ca-ink-3, #7A7A76);
	margin: 0 0 16px;
}
.ca-internal-page .ca-toc-sticky__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ca-internal-page .ca-toc-sticky a {
	color: var(--ca-ink-2, #3A3A38);
	text-decoration: none;
	transition: color 0.2s ease, transform 0.2s ease;
	display: block;
	padding: 4px 0;
}
.ca-internal-page .ca-toc-sticky a:hover,
.ca-internal-page .ca-toc-sticky a:focus-visible,
.ca-internal-page .ca-toc-sticky a[aria-current="true"] {
	color: #1B6CF2;
	transform: translateX(3px);
}

/* ---------- Form premium (contact / devis) ---------- */
.ca-internal-page .ca-form-premium {
	display: grid;
	gap: 20px;
}
.ca-internal-page .ca-form-premium__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ca-internal-page .ca-form-premium__label {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--ca-ink-2, #3A3A38);
}
.ca-internal-page .ca-form-premium__label--required::after {
	content: ' *';
	color: #1B6CF2;
}
.ca-internal-page .ca-form-premium__input,
.ca-internal-page .ca-form-premium__textarea,
.ca-internal-page .ca-form-premium__select {
	width: 100%;
	padding: 14px 16px;
	font-size: 16px;
	font-family: inherit;
	color: var(--ca-ink, #0A0A09);
	background: #fff;
	border: 1px solid var(--ca-border, #E4E4E0);
	border-radius: 12px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	min-height: 48px;
}
.ca-internal-page .ca-form-premium__input:focus,
.ca-internal-page .ca-form-premium__textarea:focus,
.ca-internal-page .ca-form-premium__select:focus {
	outline: none;
	border-color: #00E5FF;
	box-shadow: 0 0 0 3px rgba(0,229,255,0.18);
}
.ca-internal-page .ca-form-premium__input--error {
	border-color: #B83010;
}
.ca-internal-page .ca-form-premium__input--error:focus {
	box-shadow: 0 0 0 3px rgba(184,48,16,0.18);
}
.ca-internal-page .ca-form-premium__error-msg {
	font-size: 13px;
	color: #B83010;
	margin: 0;
}
.ca-internal-page .ca-form-premium__textarea {
	min-height: 140px;
	resize: vertical;
}
.ca-internal-page .ca-form-premium__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px 28px;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #fff;
	background: linear-gradient(135deg, #1B6CF2 0%, #00E5FF 100%);
	border: none;
	border-radius: 12px;
	cursor: pointer;
	min-height: 52px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 8px 24px rgba(27,108,242,0.30);
}
.ca-internal-page .ca-form-premium__submit:hover,
.ca-internal-page .ca-form-premium__submit:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 32px rgba(27,108,242,0.40);
}
.ca-internal-page .ca-form-premium__submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
	transform: none;
}

/* ---------- Focus-visible global (accessibilité WCAG AA) ---------- */
.ca-internal-page *:focus-visible {
	outline: 2px solid #00E5FF;
	outline-offset: 2px;
	border-radius: 4px;
}
.ca-internal-page .ca-section--light *:focus-visible {
	outline-color: #1B6CF2;
}
