/* ============================================================
   HABILLAGE V2 DES PAGES DE SERVICE (inclus par includes/page-v2.php)
   1. Hero, stats et intro (.pv2-*)
   2. Adoucissement des composants existants de la page (cartes, boutons,
      bandeaux) : coins arrondis, ombres douces, boutons en dégradé.
   ============================================================ */

/* ---------- 1. HERO ---------- */
.pv2-hero {
    position: relative; overflow: hidden; color: #fff;
    background:
        radial-gradient(ellipse 35% 55% at 72% 40%, rgba(30,110,255,.35), transparent 70%),
        radial-gradient(ellipse 70% 40% at 50% 100%, rgba(20,90,220,.5), transparent 70%),
        linear-gradient(180deg, #020a22 0%, #031540 60%, #06205a 100%);
    padding: 120px 24px 0;
}
.pv2-hero::after {
    /* z-index 3 : la vague passe devant le portrait, qui s'arrête net sur l'arrondi */
    content: ''; position: absolute; z-index: 3; left: -6%; right: -6%; bottom: -1px; height: 120px;
    border-radius: 50% 50% 0 0 / 120px 120px 0 0;
    background: #f4f8ff;
    box-shadow: 0 -8px 30px rgba(40,140,255,.55), 0 -2px 0 rgba(140,200,255,.9);
}
.pv2-hero-inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: end; gap: 30px; max-width: 1280px; margin: 0 auto; }
.pv2-hero-text { padding-bottom: 150px; align-self: center; }
.pv2-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 9px 20px; border-radius: 999px;
    border: 1px solid rgba(90,160,255,.7); background: rgba(10,40,110,.35);
    font-family: var(--font-head); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
    margin-bottom: 22px;
}
.pv2-eyebrow i { color: #9cc8ff; }
.pv2-h1 { font-family: var(--font-head); font-size: clamp(32px, 3.6vw, 54px); font-weight: 800; line-height: 1.06; letter-spacing: -.025em; margin-bottom: 22px; color: #fff; }
.pv2-grad { background: linear-gradient(90deg, #1f6bff, #2fb6ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pv2-hero-sub { max-width: 600px; font-size: 17px; line-height: 1.6; color: rgba(230,238,255,.9); margin-bottom: 24px; }
.pv2-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 26px; }
.pv2-chips li { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: 999px; border: 1px solid rgba(110,170,255,.5); background: rgba(10,30,80,.45); font-size: 14px; font-weight: 500; }
.pv2-chips li:nth-child(1) i { color: #facc15; }
.pv2-chips li:nth-child(2) i { color: #60a5fa; }
.pv2-chips li:nth-child(3) i { color: #4ade80; }
.pv2-btns { display: flex; flex-wrap: wrap; gap: 16px; }
.pv2-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 12px;
    min-height: 56px; padding: 0 24px; border-radius: 999px;
    font-family: var(--font-head); font-size: 15px; font-weight: 600;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.pv2-btn--primary { color: #fff; background: linear-gradient(90deg, #1565f0, #1e8fff); box-shadow: 0 10px 28px rgba(20,110,255,.45); }
.pv2-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(20,110,255,.6); color: #fff; }
.pv2-btn--ghost { color: #fff; border: 1.5px solid rgba(230,240,255,.85); background: rgba(2,10,34,.35); }
.pv2-btn--ghost:hover { background: rgba(255,255,255,.1); transform: translateY(-2px); color: #fff; }
.pv2-hero-visual { position: relative; display: flex; justify-content: center; align-items: flex-end; margin-bottom: 100px; }
.pv2-ring {
    position: absolute; left: 50%; top: -6%; transform: translateX(-50%);
    width: 92%; max-width: 480px; aspect-ratio: 1; border-radius: 50%;
    border: 2px solid rgba(90,170,255,.85);
    box-shadow: 0 0 22px rgba(40,140,255,.85), 0 0 70px rgba(30,120,255,.5), inset 0 0 50px rgba(40,140,255,.4);
    background: radial-gradient(circle, rgba(30,100,230,.35), rgba(5,30,90,.1) 65%, transparent 72%);
}
.pv2-hero-visual picture { display: contents; }
.pv2-hero-visual img { position: relative; z-index: 1; width: 100%; max-width: 500px; filter: drop-shadow(0 0 30px rgba(20,90,220,.35)); }
.pv2-hand { position: absolute; z-index: 2; font-family: 'Caveat', cursive; font-size: clamp(19px, 1.6vw, 26px); line-height: 1.1; color: rgba(235,242,255,.92); transform: rotate(-10deg); }
.pv2-hand--l { left: -3%; top: 12%; }
.pv2-hand--r { right: -10%; top: 4%; }
.pv2-glass {
    position: absolute; z-index: 2; right: -8%; bottom: 22%;
    display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 14px;
    background: rgba(20,50,120,.5); border: 1px solid rgba(110,170,255,.55); backdrop-filter: blur(8px);
    font-size: 13px; line-height: 1.45;
}
.pv2-glass i { font-size: 26px; color: #3aa0ff; }

/* ---------- STATS ---------- */
.pv2-stats { position: relative; z-index: 4; background: none; padding: 0 24px; } /* fond transparent : la carte chevauche la vague sans la masquer */
.pv2-stats-card {
    display: grid; grid-template-columns: repeat(4, 1fr);
    max-width: 1300px; margin: -155px auto 0; padding: 28px 24px; /* même largeur que la carte d'intro */
    border-radius: 24px; background: #fff; border: 1px solid #e3ebf6;
    box-shadow: 0 20px 50px rgba(30,80,170,.12);
}
.pv2-stat { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 6px 12px; }
.pv2-stat + .pv2-stat { border-left: 1px solid #e1e8f4; }
.pv2-stat-ico { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 62px; height: 62px; border-radius: 50%; background: #e9f1ff; color: #1a3f9e; font-size: 24px; }
.pv2-stat strong { display: block; font-family: var(--font-head); font-size: 34px; font-weight: 800; line-height: 1; color: #0b1a4a; }
.pv2-stat span span, .pv2-stat > span:last-child { font-size: 15px; color: #4a5671; }

/* ---------- INTRO ---------- */
.pv2-intro { background: #f4f8ff; padding: 40px 24px 60px; }
.pv2-intro-card {
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 50px;
    max-width: 1300px; margin: 0 auto; padding: 50px 50px;
    border-radius: 28px; background: #fff; border: 1px solid #e6edf8;
    box-shadow: 0 20px 50px rgba(30,80,170,.06);
}
.pv2-kicker { display: flex; align-items: center; gap: 16px; font-family: var(--font-head); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #1a6fe8; margin-bottom: 14px; }
.pv2-kicker::after { content: ''; width: 50px; height: 2px; background: #1a6fe8; }
.pv2-h2 { font-family: var(--font-head); font-size: clamp(28px, 2.6vw, 40px); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; color: #0b1633; margin-bottom: 20px; }
.pv2-h2 span { color: #1a3f9e; }
.pv2-intro-text > p:not(.pv2-kicker) { font-size: 16px; line-height: 1.7; color: #4a5671; margin-bottom: 14px; }
.pv2-quote { margin: 22px 0 26px; padding: 20px 24px 16px 66px; position: relative; border-radius: 16px; background: #eef4ff; }
.pv2-quote::before { content: '\201C'; position: absolute; left: 20px; top: 6px; font-family: Georgia, serif; font-size: 60px; line-height: 1; color: #1a6fe8; }
.pv2-quote blockquote { margin: 0; font-style: italic; font-size: 17px; line-height: 1.5; color: #1a3f9e; }
.pv2-quote figcaption { margin-top: 6px; text-align: right; font-size: 14px; font-style: italic; color: #1a6fe8; }
.pv2-quote figcaption::before { content: '\2014\00a0'; }
.pv2-intro-img { position: relative; }
.pv2-intro-img img { width: 100%; aspect-ratio: 1.15; object-fit: cover; border-radius: 22px; box-shadow: 0 24px 50px rgba(20,60,140,.16); }
.pv2-img-tag { position: absolute; left: 24px; bottom: 24px; display: flex; align-items: center; gap: 14px; padding: 14px 20px; border-radius: 14px; background: rgba(10,20,45,.7); backdrop-filter: blur(8px); color: #fff; font-size: 14px; font-weight: 500; line-height: 1.4; }
.pv2-img-tag i { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #1a6fe8; font-size: 14px; }

/* ---------- 2. ADOUCISSEMENT DU RESTE DE LA PAGE ---------- */
body .section-light { background: #f4f8ff; }
body .btn { border-radius: 999px; padding: 13px 26px; }
body .btn-blue { background: linear-gradient(90deg, #1565f0, #1e8fff); border: 0; box-shadow: 0 8px 22px rgba(20,110,255,.3); }
body .btn-blue:hover { background: linear-gradient(90deg, #1159d8, #1a7ff0); box-shadow: 0 12px 28px rgba(20,110,255,.45); }
body .btn-outline { border-radius: 999px; }
body .btn-white, body .btn-white-outline { border-radius: 999px; }
body .cs-pilier-card, body .cs-mission-card, body .cs-service-card, body .cs-neutral, body .cta-inline-box,
body .visib-card, body .cs-cert-card, body .cs-tool-card, body .cs-guide-card, body .cs-faq-item {
    border-radius: 20px;
    border-color: #e3ebf6;
    box-shadow: 0 14px 36px rgba(30,80,170,.07);
}
body .cs-pilier-card, body .cs-mission-card, body .cs-service-card { transition: transform .25s ease, box-shadow .25s ease; }
body .cs-pilier-card:hover, body .cs-mission-card:hover, body .cs-service-card:hover { transform: translateY(-4px); box-shadow: 0 20px 44px rgba(30,80,170,.13); }
body .cs-split-img img, body .cs-split-img picture img { border-radius: 22px; box-shadow: 0 24px 50px rgba(20,60,140,.14); }
body .cs-table-wrap { border-radius: 18px; overflow: hidden; box-shadow: 0 14px 36px rgba(30,80,170,.07); }
body .cta-strip { padding: 26px 24px; background: none !important; }
body .cta-strip .container { max-width: 1300px; padding: 30px 40px; border-radius: 24px; background: linear-gradient(120deg, #041a4a 0%, #0a3aa8 60%, #1e8fff 100%); box-shadow: 0 20px 44px rgba(20,80,200,.25); }
body .cta-strip-inner { gap: 24px; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1100px) {
    .pv2-hand--r { right: -2%; }
    .pv2-glass { right: 0; }
}
@media (max-width: 900px) {
    .pv2-hero { padding: 100px 20px 0; }
    .pv2-hero-inner { grid-template-columns: 1fr; text-align: center; }
    .pv2-hero-text { padding-bottom: 20px; }
    .pv2-hero-sub { margin-left: auto; margin-right: auto; }
    .pv2-chips, .pv2-btns { justify-content: center; }
    .pv2-hero-visual { max-width: 380px; margin: 0 auto 90px; }
    .pv2-hand, .pv2-glass { display: none; }
    .pv2-stats-card { grid-template-columns: 1fr 1fr; row-gap: 18px; margin-top: -80px; }
    .pv2-stat:nth-child(3) { border-left: 0; }
    .pv2-stat { justify-content: flex-start; }
    .pv2-intro-card { grid-template-columns: 1fr; padding: 32px 22px; gap: 30px; }
    body .cta-strip .container { padding: 24px 20px; }
}
@media (max-width: 520px) {
    .pv2-h1 { font-size: 30px; }
    .pv2-btn { width: 100%; }
    .pv2-stats-card { grid-template-columns: 1fr; }
    .pv2-stat + .pv2-stat { border-left: 0; border-top: 1px solid #e1e8f4; padding-top: 14px; }
    .pv2-stat-ico { width: 50px; height: 50px; font-size: 20px; }
    .pv2-stat strong { font-size: 28px; }
}

/* ============================================================
   3. HERO .cs-hero DES ~130 PAGES DE SERVICE ET VILLES (même rendu que .pv2-hero)
   ============================================================ */
.pv2-hand[data-t]::before, .pv2-glass span[data-t]::before { content: attr(data-t); white-space: pre-line; }
.cs-hero {
    position: relative; overflow: hidden; color: #fff;
    background:
        radial-gradient(ellipse 35% 55% at 72% 40%, rgba(30,110,255,.35), transparent 70%),
        radial-gradient(ellipse 70% 40% at 50% 100%, rgba(20,90,220,.5), transparent 70%),
        linear-gradient(180deg, #020a22 0%, #031540 60%, #06205a 100%) !important;
    padding: 120px 24px 0 !important;
}
.cs-hero::before { display: none !important; }
.cs-hero::after {
    content: ''; position: absolute; z-index: 3; left: -6%; right: -6%; bottom: -1px; height: 120px;
    border-radius: 50% 50% 0 0 / 120px 120px 0 0;
    background: #fff; /* même couleur que la section suivante, sinon on voit la démarcation */
    box-shadow: 0 -8px 30px rgba(40,140,255,.55), 0 -2px 0 rgba(140,200,255,.9);
}
.cs-hero:has(+ .section-light)::after,
.cs-hero:has(+ .stats-bar + .section-light)::after,
.cs-hero:has(+ .geo-carousel-bar + .section-light)::after { background: #f4f8ff; }
.cs-hero:has(+ .trf)::after { background: #f4f6fb; }
/* Fil d'Ariane juste sous le hero : blanc, sans filet, pour prolonger la vague sans démarcation */
.cs-hero + .breadcrumb-bar, .cs-hero + .stats-bar + .breadcrumb-bar, .cs-hero + .geo-carousel-bar + .breadcrumb-bar { background: #fff; border-bottom: 0; padding-top: 14px; }
.cs-hero > .container { position: relative; z-index: 2; max-width: 1280px; padding: 0; }
.cs-hero .cs-hero-inner { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: end; gap: 30px; }
.cs-hero .cs-hero-text { padding-bottom: 150px; align-self: center; }
.cs-hero .cs-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 9px 20px; border-radius: 999px;
    border: 1px solid rgba(90,160,255,.7); background: rgba(10,40,110,.35);
    font-family: var(--font-head); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
    margin-bottom: 22px;
}
.cs-hero .cs-eyebrow i { color: #9cc8ff; }
.cs-hero .cs-hero-text h1 { font-size: clamp(30px, 3.4vw, 52px); font-weight: 800; line-height: 1.08; letter-spacing: -.025em; margin-bottom: 22px; }
.cs-hero .cs-hero-sub { max-width: 640px; font-size: 16.5px; line-height: 1.6; color: rgba(230,238,255,.9); }
.cs-hero .cs-hero-badges { gap: 12px; margin-bottom: 26px; }
.cs-hero .cs-hero-badges span { padding: 10px 18px; border-color: rgba(110,170,255,.5); background: rgba(10,30,80,.45); font-size: 14px; }
.cs-hero .cs-hero-badges span:nth-child(1) i { color: #facc15; }
.cs-hero .cs-hero-badges span:nth-child(2) i { color: #60a5fa; }
.cs-hero .cs-hero-badges span:nth-child(3) i { color: #4ade80; }
.cs-hero .cs-hero-btns { gap: 16px; }
.cs-hero .cs-hero-btns .btn { min-height: 56px; padding: 0 26px; border-radius: 999px; font-size: 15px; }
.cs-hero .cs-hero-btns .btn-outline { border: 1.5px solid rgba(230,240,255,.85); background: rgba(2,10,34,.35); }
.cs-hero .cs-hero-btns .btn-outline:hover { background: rgba(255,255,255,.1); color: #fff; }
.cs-hero .cs-hero-img { position: relative; display: flex; justify-content: center; align-items: flex-end; margin-bottom: 100px; flex: none; max-width: none; }
.cs-hero .cs-hero-img::before {
    content: ''; position: absolute; left: 50%; top: -6%; transform: translateX(-50%);
    width: 92%; max-width: 480px; aspect-ratio: 1; border-radius: 50%;
    border: 2px solid rgba(90,170,255,.85);
    box-shadow: 0 0 22px rgba(40,140,255,.85), 0 0 70px rgba(30,120,255,.5), inset 0 0 50px rgba(40,140,255,.4);
    background: radial-gradient(circle, rgba(30,100,230,.35), rgba(5,30,90,.1) 65%, transparent 72%);
}
.cs-hero .cs-hero-img img { position: relative; z-index: 1; width: 100%; max-width: 500px; height: auto; filter: drop-shadow(0 0 30px rgba(20,90,220,.35)); border-radius: 0; box-shadow: none; }

/* Bandeau de chiffres ou de logos juste après le hero : carte à cheval sur la vague */
.cs-hero + .stats-bar, .cs-hero + .geo-carousel-bar { position: relative; z-index: 4; background: none; height: auto; padding: 0 24px; margin-top: -155px; overflow: visible; display: block; }
.cs-hero + .stats-bar .stats-inner {
    display: grid; grid-template-columns: repeat(4, 1fr);
    max-width: 1300px; margin: 0 auto; padding: 28px 24px;
    border-radius: 24px; background: #fff; border: 1px solid #e3ebf6;
    box-shadow: 0 20px 50px rgba(30,80,170,.12);
}
.cs-hero + .stats-bar .stat-item { display: flex; flex-direction: column; justify-content: center; padding: 6px 12px 6px 84px; position: relative; text-align: left; color: #4a5671; border: 0; min-height: 62px; }
.cs-hero + .stats-bar .stat-item + .stat-item { border-left: 1px solid #e1e8f4; }
.cs-hero + .stats-bar .stat-item::before {
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
    width: 58px; height: 58px; border-radius: 50%; background: #e9f1ff; color: #1a3f9e;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 22px;
}
.cs-hero + .stats-bar .stat-item:nth-child(1)::before { content: '\f19d'; }
.cs-hero + .stats-bar .stat-item:nth-child(2)::before { content: '\f0c0'; }
.cs-hero + .stats-bar .stat-item:nth-child(3)::before { content: '\f2b5'; }
.cs-hero + .stats-bar .stat-item:nth-child(4)::before { content: '\f005'; }
/* Icône propre à la page : data-ico="" sur .stat-item (code Font Awesome solid) */
.cs-hero + .stats-bar .stat-item[data-ico]::before { content: attr(data-ico); }
.cs-hero + .stats-bar .stat-number { font-family: var(--font-head); font-size: 32px; font-weight: 800; line-height: 1; color: #0b1a4a; }
.cs-hero + .stats-bar .stat-label { font-size: 14.5px; color: #4a5671; opacity: 1; margin-top: 4px; }
.cs-hero + .geo-carousel-bar .geo-carousel-container {
    max-width: 1300px; margin: 0 auto; padding: 22px 30px;
    border-radius: 24px;
    background: linear-gradient(120deg, #06205a 0%, #0b3fae 55%, #1a6fe8 100%);
    border: 1px solid rgba(120,180,255,.5);
    box-shadow: 0 20px 50px rgba(20,80,200,.3);
}
.cs-hero + .geo-carousel-bar .geo-carousel-item img { height: clamp(34px, 3.4vw, 46px); }

@media (max-width: 1100px) {
    .cs-hero + .stats-bar .stats-inner { grid-template-columns: 1fr 1fr; row-gap: 18px; }
    .cs-hero + .stats-bar .stat-item:nth-child(3) { border-left: 0; }
}
@media (max-width: 900px) {
    .cs-hero { padding: 100px 20px 0 !important; }
    .cs-hero .cs-hero-inner { grid-template-columns: 1fr; text-align: center; }
    .cs-hero .cs-hero-text { padding-bottom: 20px; }
    .cs-hero .cs-hero-sub { margin-left: auto; margin-right: auto; }
    .cs-hero .cs-hero-badges, .cs-hero .cs-hero-btns { justify-content: center; }
    .cs-hero .cs-hero-img { max-width: 360px; margin: 0 auto 90px; }
    .cs-hero .pv2-hand, .cs-hero .pv2-glass { display: none; }
    .cs-hero + .stats-bar, .cs-hero + .geo-carousel-bar { margin-top: -80px; }
}
@media (max-width: 560px) {
    .cs-hero .cs-hero-btns .btn { width: 100%; justify-content: center; }
    .cs-hero + .stats-bar .stats-inner { grid-template-columns: 1fr; }
    .cs-hero + .stats-bar .stat-item + .stat-item { border-left: 0; border-top: 1px solid #e1e8f4; }
    .cs-hero + .geo-carousel-bar .geo-carousel-container { padding: 16px 14px; }
}

/* ============================================================
   4. HERO « CARTE » DES PAGES INTÉRIEURES (.ih-*) : carte arrondie posée
      sur un fond nuit, photo du hero, mentions manuscrites, visuel propre à la page.
      Activé dans includes/geo-article-template.php par $geo['hero'] = 'carte'.
   ============================================================ */
.ih-hero {
    position: relative; overflow: hidden; padding: 72px 24px 0;
    background:
        radial-gradient(ellipse 50% 60% at 85% 30%, rgba(30,110,255,.35), transparent 70%),
        linear-gradient(180deg, #020a22 0%, #05215f 45%, #1550c8 72%, #fff 72.1%);
}
/* Bosses blanches aux deux coins bas, comme sur la maquette */
.ih-hero::before, .ih-hero::after {
    content: ''; position: absolute; bottom: 0; width: 260px; height: 230px; background: #fff; z-index: 0;
}
.ih-hero::before { left: -120px; border-radius: 0 140px 0 0; }
.ih-hero::after { right: -120px; border-radius: 140px 0 0 0; }
.ih-card {
    position: relative; z-index: 1; overflow: hidden;
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 20px;
    max-width: 1340px; min-height: 450px; margin: 0 auto; padding: 30px 40px 0 100px;
    border-radius: 44px; color: #fff;
    background:
        radial-gradient(circle at 1px 1px, rgba(140,190,255,.16) 1px, transparent 1.5px) 0 0 / 22px 22px,
        radial-gradient(ellipse 45% 70% at 62% 45%, rgba(40,130,255,.55), transparent 70%),
        linear-gradient(120deg, #031540 0%, #0a2f86 50%, #1a5fd8 100%);
    border: 1px solid rgba(130,185,255,.45);
    box-shadow: 0 30px 70px rgba(10,40,120,.35), inset 0 1px 0 rgba(255,255,255,.12);
}
.ih-text { padding: 0 0 34px; align-self: center; }
.ih-eyebrow {
    display: inline-flex; align-items: center; gap: 10px; padding: 7px 18px 7px 8px; margin-bottom: 18px;
    border-radius: 999px; background: rgba(10,40,110,.55); border: 1px solid rgba(110,170,255,.55);
    font-family: var(--font-head); font-size: 12.5px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase;
}
.ih-eyebrow i { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #1e7bff; font-size: 12px; }
.ih-hero h1 { font-family: var(--font-head); font-size: clamp(30px, 3vw, 44px); font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: #fff; margin: 0 0 16px; }
.ih-sub { font-size: 16px; line-height: 1.6; color: rgba(230,238,255,.9); margin: 0 0 22px; max-width: 580px; }
.ih-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 30px; margin-bottom: 26px; font-size: 13px; color: rgba(230,238,255,.9); }
.ih-meta > span { display: inline-flex; align-items: center; gap: 10px; }
.ih-meta > span > i { font-size: 18px; color: #fff; opacity: .9; }
.ih-meta-author > span { display: flex; flex-direction: column; line-height: 1.35; }
.ih-meta-author strong { font-weight: 600; color: #fff; }
.ih-btns { display: flex; flex-wrap: wrap; gap: 14px; }
.ih-btn {
    display: inline-flex; align-items: center; gap: 12px; min-height: 50px; padding: 0 26px; border-radius: 999px;
    font-family: var(--font-head); font-size: 15px; font-weight: 600; transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.ih-btn .fa-arrow-right { font-size: 13px; }
.ih-btn--white { background: #fff; color: #0b3fae; box-shadow: 0 10px 26px rgba(0,20,80,.3); }
.ih-btn--white > i:first-child { color: #1e6bff; }
.ih-btn--white:hover { transform: translateY(-2px); color: #0b3fae; }
.ih-btn--ghost { color: #fff; border: 1.5px solid rgba(230,240,255,.85); }
.ih-btn--ghost:hover { background: rgba(255,255,255,.1); color: #fff; transform: translateY(-2px); }

.ih-visual { position: relative; min-height: 490px; }
.ih-photo { position: absolute; z-index: 1; left: 8%; bottom: -24px; width: 70%; max-width: 470px; height: auto; filter: drop-shadow(0 0 30px rgba(10,60,180,.45)); }
.ih-hand { position: absolute; z-index: 3; font-family: 'Caveat', cursive; font-size: clamp(17px, 1.5vw, 23px); line-height: 1.15; color: rgba(235,242,255,.95); }
.ih-hand[data-t]::before { content: attr(data-t); white-space: pre-line; }
.ih-hand--top { left: 3%; top: 2%; transform: rotate(-10deg); text-shadow: 0 2px 10px rgba(2,10,40,.7); }
/* Flèche manuscrite qui part de la mention vers le personnage */
.ih-hand--top::after { content: ''; display: block; width: 56px; height: 38px; margin: 4px 0 0 56%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40' fill='none' stroke='%23e8f0ff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6c6 18 24 28 48 26'/%3E%3Cpath d='M44 25l9 7-10 5'/%3E%3C/svg%3E") no-repeat center / contain; }
.ih-hand--bottom { right: 0; bottom: 8%; transform: rotate(-10deg); text-align: right; }
.ih-badge {
    position: absolute; z-index: 3; left: -2%; bottom: 30px; display: flex; flex-direction: column; gap: 2px;
    padding: 14px 20px 14px 36px; border-radius: 16px; font-size: 12.5px; line-height: 1.4; color: rgba(230,238,255,.9);
    background: rgba(8,25,70,.72); border: 1px solid rgba(110,170,255,.5); backdrop-filter: blur(8px);
}
.ih-badge::before { content: ''; position: absolute; left: 16px; top: 20px; width: 9px; height: 9px; border-radius: 50%; background: #2f8cff; box-shadow: 0 0 10px #2f8cff; }
.ih-badge strong { font-size: 14px; color: #fff; }

/* Visuel propre à la page (ex. ChatGPT Maps) : panneau en verre incliné */
.ih-panel {
    position: absolute; z-index: 2; right: 0; top: 4%; width: 44%; padding: 16px 16px 18px;
    border-radius: 22px; background: rgba(40,90,190,.35); border: 1px solid rgba(150,200,255,.55);
    backdrop-filter: blur(10px); box-shadow: 0 24px 50px rgba(0,20,80,.35), inset 0 1px 0 rgba(255,255,255,.25);
    transform: perspective(900px) rotateY(-14deg) rotateZ(-3deg);
}
.ih-panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; font-family: var(--font-head); font-size: 17px; font-weight: 600; }
.ih-panel-head img { width: auto; height: 26px; }
.ih-panel-map { position: relative; border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,.35); }
.ih-panel-map img { display: block; width: 100%; height: auto; aspect-ratio: 1.6; object-fit: cover; object-position: 20% 50%; }
.ih-panel-chip {
    position: absolute; right: 8px; top: 38%; display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 12px; border-radius: 10px; background: #fff; color: #0b1a4a; font-size: 12px; font-weight: 600;
    box-shadow: 0 8px 20px rgba(0,20,80,.3);
}
.ih-panel-chip i { color: #c2410c; }
.ih-panel-list { list-style: none; margin: 14px 0 0; padding: 0 6px; display: grid; gap: 9px; font-size: 13px; }
.ih-panel-list li { display: flex; align-items: center; gap: 10px; color: rgba(235,242,255,.95); }
.ih-panel-list i { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.14); font-size: 11px; }

/* Fil d'Ariane sous la carte : blanc, sans filet */
.ih-hero + .breadcrumb-bar { background: #fff; border-bottom: 0; }

/* Contenu de l'article et colonne latérale assortis */
.ih-wrap .geo-answer-box { border: 1px solid #dbe7fb; border-radius: 18px; background: #f5f9ff; box-shadow: 0 10px 30px rgba(30,80,170,.06); }
.ih-wrap .geo-video-frame { border-radius: 20px; overflow: hidden; }
.ih-wrap .geo-side-card { border-radius: 20px; border-color: #e3ebf6; box-shadow: 0 14px 36px rgba(30,80,170,.07); }
.ih-wrap .geo-side-card--cta {
    position: relative; overflow: hidden; padding: 24px 22px 22px;
    background: radial-gradient(ellipse 60% 60% at 90% 20%, rgba(60,150,255,.5), transparent 70%), linear-gradient(135deg, #031540 0%, #0b3fae 60%, #1a6fe8 100%);
}
.ih-wrap .geo-side-card--cta.has-img .ih-side-ico { margin-bottom: 26px; }
.ih-side-ico { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; border: 2px solid rgba(160,200,255,.7); color: #9cc8ff; font-size: 18px; margin-bottom: 12px; }
.ih-side-img { position: absolute; right: -10px; top: 14px; width: 54%; height: auto; border-radius: 12px; border: 1px solid rgba(255,255,255,.3); transform: perspective(500px) rotateY(-16deg) rotateZ(-4deg); box-shadow: 0 12px 26px rgba(0,20,80,.35); }
.ih-wrap .geo-side-card--cta .btn-white { border-radius: 999px; color: #0b3fae; gap: 10px; }
.ih-wrap .geo-side-card--cta .btn-white .fa-arrow-right { font-size: 12px; }
.ih-wrap .geo-side-author-link { display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border: 1.5px solid #cfe0fb; border-radius: 999px; }
.ih-side-quick { display: flex; gap: 16px; align-items: flex-start; }
.ih-side-quick-ico { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #eef4ff; color: #1a6fe8; font-size: 20px; }
.ih-side-quick strong { display: block; font-family: var(--font-head); font-size: 15px; color: #0b1633; margin-bottom: 6px; }
.ih-side-quick p { font-size: 13.5px; line-height: 1.55; color: #4a5671; margin: 0 0 10px; }
.ih-side-quick a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #1a5fd8; }
.ih-side-quick a i { font-size: 12px; }

@media (max-width: 1200px) {
    .ih-card { padding-left: 50px; }
    .ih-hand--top { left: -6%; }
}
@media (max-width: 980px) {
    .ih-hero { padding: 70px 14px 0; background: linear-gradient(180deg, #020a22 0%, #05215f 50%, #1550c8 80%, #fff 80.1%); }
    .ih-hero::before, .ih-hero::after { display: none; }
    .ih-card { grid-template-columns: 1fr; padding: 30px 22px 0; border-radius: 30px; text-align: center; }
    .ih-text { padding-bottom: 10px; }
    .ih-sub { margin-left: auto; margin-right: auto; }
    .ih-meta, .ih-btns { justify-content: center; }
    .ih-meta-author > span { text-align: left; }
    .ih-visual { min-height: 0; height: 340px; }
    .ih-photo { left: 50%; transform: translateX(-50%); width: 280px; bottom: -40px; }
    .ih-hand, .ih-panel { display: none; }
    .ih-badge { left: 50%; transform: translateX(-50%); bottom: 18px; text-align: left; white-space: nowrap; }
}
@media (max-width: 560px) {
    .ih-btn { width: 100%; justify-content: center; }
    .ih-meta { gap: 10px 18px; }
}
/* Panneau par défaut des pages GEO : logos des IA */
.ih-panel--logos { top: 10%; }
.ih-panel-head i { color: #7fb6ff; font-size: 15px; }
.ih-logos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ih-logos li { display: flex; align-items: center; justify-content: center; height: 54px; border-radius: 12px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); }
.ih-logos img { width: 82%; height: 100%; object-fit: contain; }
.ih-panel-foot { margin: 14px 0 0; display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: rgba(235,242,255,.9); }
.ih-panel-foot i { color: #4ade80; }
/* Visuel image (ex. illustration d'une page Passeport) */
.ih-panel-map img:not([width]) { aspect-ratio: auto; }
/* Panneau livre (cocon Passeport) */
.ih-panel--book { width: 36%; top: 8%; text-align: center; }
.ih-book { display: block; width: 100%; height: auto; margin: -4px auto 0; filter: drop-shadow(0 14px 24px rgba(0,10,50,.45)); }
.ih-panel--book .ih-panel-foot { justify-content: center; margin-top: 6px; }
.ih-hero + .article-breadcrumb-bar { background: #fff; border-bottom: 0; }
.ih-panel--cover .ih-panel-map img { aspect-ratio: 1.5; object-position: center; }
.ih-hero + .czd-breadcrumb-bar { background: #fff; border-bottom: 0; }
.ih-panel--slide { width: 34%; }
.ih-panel--slide .ih-panel-map img { aspect-ratio: 4 / 5; }