/* ============================================================
   LES ICONIQUES — Charte graphique
   Esthétique chaleureuse / vintage · titres display arrondis
   Palette officielle :
     Bleu foncé #4E68AD · Bleu clair #C9DFE5 · Sable #FFF7EB
     Brique #B34B27 · Rose 1 #F5B399 · Rose 2 #FBD7B8

   POLICES — TODO: remplacer par les polices de la charte Les Iconiques
   (fichiers non fournis). En attendant, chargées via Google Fonts et
   centralisées en variables pour un swap facile :
     · --ico-display : titres display arrondis (« BARAQUES », « nos maisons »)
                       → Fredoka
     · --ico-serif   : accroches italiques élégantes (« Sésame, ouvre-toi ! »)
                       → Playfair Display italic
     · --ico-font    : corps de texte → Poppins
   ============================================================ */
:root {
	--ico-bleu-fonce: #4E68AD;
	--ico-bleu-clair: #C9DFE5;
	--ico-sable: #FFF7EB;
	--ico-brique: #B34B27;
	--ico-rose-1: #F5B399;
	--ico-rose-2: #FBD7B8;

	--ico-ink: #2C2A28;
	--ico-ink-soft: rgba(44, 42, 40, 0.72);
	--ico-paper: #FFFFFF;

	/* Couleur d'accent (surchargée par maison / par bloc via style inline). */
	--ico-accent: #4E68AD;
	--ico-accent-soft: #C9DFE5;

	/* TODO: remplacer par les polices de la charte Les Iconiques. */
	/* Polices de la charte Les Iconiques (Adobe Fonts) : Pie Pie (display) +
	   Garamond Premier Pro (serif). Chargées via le kit Adobe Fonts renseigné
	   dans Réglages → Les Iconiques. Repli Google (Fredoka / Playfair) si absent. */
	--ico-display: "Piepie", "pie-pie", "Fredoka", "Poppins", Arial, sans-serif;   /* titres (Piepie) */
	--ico-serif: "Garamond Premier Pro", "garamond-premier", "Playfair Display", Georgia, serif; /* accroches serif */
	--ico-font: "Karla", "Poppins", "Helvetica Neue", Arial, sans-serif; /* corps (Karla) */

	--ico-container: 1180px;
	--ico-radius: 18px;
	--ico-radius-sm: 12px;
	--ico-pill: 999px;
}

.ico-wrap { max-width: var(--ico-container); margin: 0 auto; padding: 0 28px; }

/* Base typographique des éléments du plugin.
   NB : on enveloppe les sélecteurs dans :where() (spécificité 0) pour que les
   couleurs d'accent des composants (classes .ico-*__title, etc.) l'emportent
   toujours. La couleur de titre par défaut = l'accent (bleu foncé au repos ;
   surchargé par maison / par bloc via --ico-accent en style inline). */
:where([class^="ico-"], [class*=" ico-"]) h1,
:where([class^="ico-"], [class*=" ico-"]) h2,
:where([class^="ico-"], [class*=" ico-"]) h3 {
	font-family: var(--ico-display);
	color: var(--ico-accent);
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: -0.01em;
	margin: 0;
}
:where([class^="ico-"], [class*=" ico-"]) p { margin: 0; }
:where([class^="ico-"], [class*=" ico-"]) img { max-width: 100%; display: block; }
:where([class^="ico-"], [class*=" ico-"]) a { color: inherit; text-decoration: none; }
:where([class^="ico-"], [class*=" ico-"]) ul { margin: 0; padding: 0; list-style: none; }

/* Bouton générique — pilule dans la couleur d'accent */
.ico-btn,
.ico-hero__cta, .ico-mcard__btn, .ico-bloc__cta {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-family: var(--ico-font); font-weight: 600; font-size: 15px;
	padding: 13px 30px; border-radius: var(--ico-pill);
	background: var(--ico-accent); color: #fff;
	transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
	cursor: pointer; border: none;
}
.ico-hero__cta:hover, .ico-mcard__btn:hover, .ico-bloc__cta:hover {
	transform: translateY(-2px);
	filter: brightness(.92);
	box-shadow: 0 12px 26px -12px rgba(44, 42, 40, .5);
}
/* Le header/footer gardent la brique par défaut (gérés par le thème). */
.ico-header__cta { background: var(--ico-brique); }

/* ============================ HEADER ============================ */
.ico-header { background: var(--ico-sable); border-bottom: 1px solid var(--ico-rose-2); position: sticky; top: 0; z-index: 100; }
.ico-header__in { display: flex; align-items: center; gap: 24px; padding: 14px 28px; }
.ico-header__logo img { height: 40px; width: auto; }
.ico-header__wordmark { font-family: var(--ico-display); font-size: 26px; color: var(--ico-bleu-fonce); font-weight: 700; }
.ico-header__nav { display: flex; gap: 12px; margin-left: auto; flex-wrap: wrap; align-items: center; }
.ico-header__nav a {
	font-family: var(--ico-serif); font-style: italic; font-weight: 500; font-size: 16px;
	color: var(--ico-ink); padding: 8px 18px; border: 1px solid var(--ico-ink); border-radius: var(--ico-pill);
	transition: color .2s, background .2s, border-color .2s;
}
.ico-header__nav a:hover { color: #fff; background: var(--ico-brique); border-color: var(--ico-brique); }
.ico-header__cta {
	display: inline-flex; align-items: center; font-family: var(--ico-display); font-weight: 600;
	letter-spacing: .02em; text-transform: uppercase; font-size: 14px; color: #fff;
	padding: 10px 22px; border-radius: var(--ico-pill);
}
.ico-header__nav ~ .ico-header__cta { margin-left: 0; }
@media (max-width: 900px) {
	.ico-header__in { flex-wrap: wrap; }
	.ico-header__nav { width: 100%; margin-left: 0; order: 3; justify-content: center; }
}

/* ============================ HERO ============================ */
.ico-hero {
	position: relative; display: flex; align-items: flex-end;
	min-height: 72vh; padding: 60px 0;
	background-size: cover; background-position: center;
	color: #fff; overflow: hidden;
}
.ico-hero--maison { min-height: 62vh; }
.ico-hero--plain { background: linear-gradient(135deg, var(--ico-bleu-clair), var(--ico-rose-2)); color: var(--ico-ink); }
.ico-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(44,42,40,.42), rgba(44,42,40,.06) 55%); z-index: 0; }
.ico-hero--plain::after { background: transparent; }
.ico-hero__inner { position: relative; z-index: 1; width: 100%; }
.ico-hero__title {
	font-family: var(--ico-display); font-weight: 700;
	font-size: clamp(52px, 10vw, 132px); color: var(--ico-sable);
	line-height: .92; margin-bottom: 14px;
	text-shadow: 0 4px 30px rgba(0,0,0,.25);
}
.ico-hero--plain .ico-hero__title { color: var(--ico-bleu-fonce); text-shadow: none; }
.ico-hero__sub {
	font-family: var(--ico-serif); font-style: italic; font-weight: 500;
	font-size: clamp(20px, 3vw, 34px); line-height: 1.3; margin-bottom: 24px;
	color: var(--ico-sable); max-width: 760px;
}
.ico-hero--plain .ico-hero__sub { color: var(--ico-ink); }
.ico-hero__cta { background: var(--ico-accent); text-transform: uppercase; font-family: var(--ico-display); letter-spacing: .03em; }
/* Concept : hero centré */
.ico-hero--concept { align-items: center; text-align: center; }
.ico-hero--concept .ico-hero__inner { max-width: 1000px; margin: 0 auto; }
/* Pastilles maisons (variante Home) */
.ico-hero__pills { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 6px; }
.ico-hero__pill {
	font-family: var(--ico-display); font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
	font-size: 15px; color: #fff; background: var(--ico-accent);
	padding: 11px 26px; border-radius: var(--ico-pill); transition: transform .2s, filter .2s;
}
.ico-hero__pill:hover { transform: translateY(-2px); filter: brightness(.92); }

/* ============================ MAISONS (liste éditoriale alternée) ============================ */
.ico-maisons { background: var(--ico-sable); padding: 90px 0; }
.ico-maisons__title {
	text-align: center; font-family: var(--ico-display); text-transform: lowercase;
	font-size: clamp(46px, 8vw, 104px); color: var(--ico-bleu-fonce); margin-bottom: 60px;
}
.ico-maisons__list { display: flex; flex-direction: column; gap: 90px; }
.ico-mcard { display: grid; grid-template-columns: 1fr; gap: 28px; align-items: center; }
@media (min-width: 880px) {
	.ico-mcard { grid-template-columns: 1.05fr 1fr; gap: 60px; }
	.ico-mcard--flip .ico-mcard__media { order: 2; }
}
.ico-mcard__media { position: relative; }
.ico-mcard__ph { display: block; border-radius: var(--ico-radius); overflow: hidden; }
.ico-mcard__ph--main { aspect-ratio: 4 / 5; background: linear-gradient(135deg, var(--ico-bleu-clair), var(--ico-rose-2)); box-shadow: 0 30px 60px -34px rgba(44,42,40,.5); }
.ico-mcard__ph--main img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.ico-mcard:hover .ico-mcard__ph--main img { transform: scale(1.04); }
.ico-mcard__ph--sub {
	position: absolute; right: -18px; bottom: -26px; width: 42%; aspect-ratio: 3 / 4;
	border: 6px solid var(--ico-sable); box-shadow: 0 20px 44px -26px rgba(44,42,40,.55);
	background: var(--ico-rose-2);
}
.ico-mcard--flip .ico-mcard__ph--sub { right: auto; left: -18px; }
.ico-mcard__ph--sub img { width: 100%; height: 100%; object-fit: cover; }
.ico-mcard__body { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.ico-mcard__title { font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(34px, 4.4vw, 58px); color: var(--ico-accent); }
.ico-mcard__accroche { font-family: var(--ico-serif); font-style: italic; font-weight: 600; color: var(--ico-accent); font-size: clamp(20px, 2.4vw, 28px); }
.ico-mcard__desc { font-family: var(--ico-font); color: var(--ico-ink); font-size: 17px; line-height: 1.7; }
.ico-mcard__desc p { margin-bottom: 12px; }
.ico-mcard__btn { margin-top: 12px; background: var(--ico-accent); font-family: var(--ico-serif); font-style: italic; text-transform: none; }
.ico-maisons__empty, .ico-espaces__empty, .ico-blocs__empty { text-align: center; color: var(--ico-ink-soft); font-family: var(--ico-font); }

/* ============================ INTRO MAISON (bandeau coloré) ============================ */
.ico-mintro { background: var(--ico-accent-soft); padding: 70px 0; }
.ico-mintro__text {
	max-width: 900px; margin: 0 auto; text-align: center;
	font-family: var(--ico-serif); font-style: italic; font-weight: 500;
	font-size: clamp(20px, 2.5vw, 30px); line-height: 1.5; color: var(--ico-accent);
}

/* ============================ LA MAISON (infos) ============================ */
.ico-infos { background: var(--ico-sable); padding: 84px 0; }
.ico-infos__title { text-align: center; font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(38px, 5.5vw, 68px); color: var(--ico-accent); }
.ico-infos__sub { text-align: center; font-family: var(--ico-serif); font-style: italic; font-size: clamp(22px, 3vw, 34px); color: var(--ico-accent); margin-top: 4px; }
.ico-infos__cap { text-align: center; font-family: var(--ico-serif); font-weight: 700; font-size: 20px; color: var(--ico-ink); margin: 22px 0 14px; }
.ico-infos__intro { text-align: center; max-width: 720px; margin: 0 auto 42px; font-family: var(--ico-font); color: var(--ico-ink); font-size: 17px; line-height: 1.7; }
.ico-infos__grid { display: grid; grid-template-columns: 1fr; gap: 18px 40px; max-width: 900px; margin: 0 auto; }
@media (min-width: 620px) { .ico-infos__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .ico-infos__grid { grid-template-columns: repeat(3, 1fr); } }
.ico-infos__chip { display: flex; align-items: center; gap: 14px; font-family: var(--ico-serif); font-style: italic; font-size: 20px; color: var(--ico-ink); }
.ico-infos__chip-e { font-size: 26px; font-style: normal; line-height: 1; width: 34px; text-align: center; flex: none; }

/* ============================ ESPACES ============================ */
.ico-espaces { background: var(--ico-sable); padding: 40px 0 84px; }
.ico-espaces__title { text-align: center; font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(32px, 4vw, 52px); color: var(--ico-accent); margin-bottom: 40px; }
.ico-espace { margin-bottom: 58px; }
.ico-espace__head { margin-bottom: 18px; }
.ico-espace__title { font-family: var(--ico-display); text-transform: capitalize; font-size: clamp(26px, 3vw, 40px); color: var(--ico-accent); }
.ico-espace__sub { font-family: var(--ico-font); font-weight: 600; color: var(--ico-ink); font-size: 18px; margin-top: 6px; }
.ico-espace__gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (min-width: 760px) { .ico-espace__gallery { grid-template-columns: repeat(3, 1fr); } }
.ico-espace__ph { margin: 0; border-radius: var(--ico-radius-sm); overflow: hidden; aspect-ratio: 4 / 5; background: var(--ico-bleu-clair); }
.ico-espace__ph:first-child { grid-column: span 2; aspect-ratio: 16 / 10; }
@media (min-width: 760px) { .ico-espace__ph:first-child { grid-column: span 1; aspect-ratio: 4 / 5; } }
.ico-espace__ph img { width: 100%; height: 100%; object-fit: cover; }

/* ============================ PETITS PLAISIRS ============================ */
.ico-plaisirs { background: var(--ico-sable); padding: 20px 0 84px; }
.ico-plaisirs__title { font-family: var(--ico-display); text-transform: capitalize; font-size: clamp(30px, 3.6vw, 46px); color: var(--ico-accent); margin-bottom: 26px; text-align: center; }
.ico-plaisirs__list { display: grid; grid-template-columns: 1fr; gap: 14px; max-width: 820px; margin: 0 auto; }
@media (min-width: 640px) { .ico-plaisirs__list { grid-template-columns: repeat(2, 1fr); } }
.ico-plaisir { display: flex; align-items: center; gap: 14px; background: var(--ico-paper); border-radius: var(--ico-radius-sm); padding: 16px 22px; font-family: var(--ico-font); box-shadow: 0 12px 30px -26px rgba(44,42,40,.5); }
.ico-plaisir__e { font-size: 26px; line-height: 1; flex: none; }
.ico-plaisir__t { font-size: 16px; color: var(--ico-ink); line-height: 1.5; }

/* ============================ COLLECTION DU MOMENT (bandeau accent) ============================ */
.ico-collection { background: var(--ico-accent); color: var(--ico-sable); padding: 84px 0; }
.ico-collection__title { text-align: center; font-family: var(--ico-display); text-transform: capitalize; font-size: clamp(32px, 4.4vw, 56px); color: var(--ico-sable); margin-bottom: 48px; }
.ico-collection__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
@media (min-width: 900px) { .ico-collection__grid { grid-template-columns: repeat(4, 1fr); } }
.ico-coll { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.ico-coll__media { width: 100%; aspect-ratio: 1 / 1; border-radius: var(--ico-radius); overflow: hidden; background: rgba(255,255,255,.16); margin-bottom: 6px; }
.ico-coll__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ico-coll:hover .ico-coll__media img { transform: scale(1.05); }
.ico-coll__type { font-family: var(--ico-font); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--ico-rose-2); font-weight: 600; }
.ico-coll__title { font-family: var(--ico-serif); font-style: italic; font-weight: 700; font-size: 22px; color: var(--ico-sable); }
.ico-coll__sub { font-family: var(--ico-font); font-size: 14px; color: rgba(255, 247, 235, .82); line-height: 1.4; }

/* ============================ ALENTOURS (blocs image/texte alternés) ============================ */
.ico-alentours { background: var(--ico-sable); padding: 84px 0; }
.ico-alentours__title { text-align: center; font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(34px, 5vw, 64px); color: var(--ico-accent); margin-bottom: 54px; }
.ico-alentours__list { display: flex; flex-direction: column; gap: 60px; }
.ico-alent { display: grid; grid-template-columns: 1fr; gap: 26px; align-items: center; }
@media (min-width: 860px) {
	.ico-alent { grid-template-columns: 1fr 1fr; gap: 56px; }
	.ico-alent--flip .ico-alent__media { order: 2; }
}
.ico-alent__media { border-radius: var(--ico-radius); overflow: hidden; aspect-ratio: 4 / 3; background: var(--ico-bleu-clair); box-shadow: 0 24px 50px -32px rgba(44,42,40,.5); }
.ico-alent__media img { width: 100%; height: 100%; object-fit: cover; }
.ico-alent__title { font-family: var(--ico-display); text-transform: capitalize; font-size: clamp(26px, 3.2vw, 42px); color: var(--ico-accent); margin-bottom: 14px; }
.ico-alent__text { font-family: var(--ico-font); color: var(--ico-ink); font-size: 16px; line-height: 1.7; }
.ico-alent__text p { margin-bottom: 12px; }

/* ============================ BLOCS ÉDITORIAUX (Concept / Séminaire / Home) ============================ */
.ico-blocs { background: var(--ico-sable); padding: 84px 0; }
.ico-seminaire { background: var(--ico-rose-2); }
.ico-seminaire__title { text-align: center; font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(34px, 5vw, 64px); color: var(--ico-brique); margin-bottom: 40px; }
.ico-bloc { display: grid; grid-template-columns: 1fr; gap: 30px; align-items: center; margin-bottom: 80px; }
.ico-bloc:last-child { margin-bottom: 0; }
@media (min-width: 880px) { .ico-bloc { grid-template-columns: 1fr 1fr; gap: 64px; } .ico-bloc--flip .ico-bloc__media { order: 2; } }
.ico-bloc__media { border-radius: var(--ico-radius); overflow: hidden; aspect-ratio: 4 / 5; background: var(--ico-bleu-clair); box-shadow: 0 30px 60px -34px rgba(44,42,40,.5); }
.ico-bloc__media img { width: 100%; height: 100%; object-fit: cover; }
.ico-bloc__eyebrow { display: inline-block; font-family: var(--ico-serif); font-style: italic; font-size: clamp(20px, 2.4vw, 30px); color: var(--ico-accent); margin-bottom: 6px; }
.ico-bloc__title { font-family: var(--ico-display); text-transform: uppercase; font-size: clamp(30px, 4vw, 58px); color: var(--ico-accent); margin-bottom: 20px; }
.ico-bloc__text { font-family: var(--ico-font); color: var(--ico-ink); font-size: 17px; line-height: 1.75; }
.ico-bloc__text p { margin-bottom: 14px; }
.ico-bloc__cta { margin-top: 22px; background: var(--ico-accent); font-family: var(--ico-serif); font-style: italic; text-transform: none; }
/* Bloc texte seul : bandeau centré (constats, accroches) */
.ico-bloc--textonly { display: block; text-align: center; max-width: 900px; margin-left: auto; margin-right: auto; }
.ico-bloc--textonly .ico-bloc__title { color: var(--ico-accent); }
.ico-bloc--textonly .ico-bloc__text { font-family: var(--ico-serif); font-style: italic; font-size: clamp(19px, 2.2vw, 26px); color: var(--ico-accent); line-height: 1.5; }
/* Fonds forts optionnels (champ « fond » d'une section) */
.ico-bloc--fond { border-radius: var(--ico-radius); padding: 54px; }
.ico-bloc--fond-rose { background: var(--ico-rose-2); }
.ico-bloc--fond-sable { background: var(--ico-sable); }
.ico-bloc--fond-bleu { background: var(--ico-bleu-clair); }
.ico-bloc--fond-brique { background: var(--ico-brique); }
.ico-bloc--fond-brique .ico-bloc__title, .ico-bloc--fond-brique .ico-bloc__eyebrow, .ico-bloc--fond-brique .ico-bloc__text { color: var(--ico-sable); }

/* ============================ FOOTER ============================ */
.ico-footer { background: var(--ico-brique); color: var(--ico-sable); padding: 64px 0 30px; }
.ico-footer a { color: rgba(255, 247, 235, .9); transition: color .2s; }
.ico-footer a:hover { color: #fff; }
.ico-footer__top { display: grid; grid-template-columns: 1fr; gap: 34px; padding-bottom: 34px; }
@media (min-width: 760px) { .ico-footer__top { grid-template-columns: 2fr 1fr; } }
.ico-footer__word { font-family: var(--ico-display); text-transform: uppercase; font-size: 40px; font-weight: 700; color: var(--ico-sable); margin-bottom: 12px; letter-spacing: .01em; }
.ico-footer__about { font-family: var(--ico-font); color: rgba(255, 247, 235, .85); font-size: 15px; line-height: 1.7; max-width: 460px; }
.ico-footer__social { display: flex; gap: 16px; margin-top: 18px; font-family: var(--ico-font); font-size: 14px; }
.ico-footer__links { display: flex; flex-direction: column; gap: 12px; font-family: var(--ico-font); font-size: 15px; }
.ico-footer__bot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 24px; border-top: 1px solid rgba(255, 247, 235, .22); font-family: var(--ico-font); font-size: 13px; color: rgba(255, 247, 235, .78); }
.ico-footer__legal { display: flex; gap: 18px; font-style: italic; }