/* CHBE — direction institutionnelle : bleu, rouge, blanc */
:root {
    --ink: #102a43;
    --ink-soft: #4b5f70;
    --navy: #0a2a43;
    --navy-deep: #071e30;
    --blue: #0057a8;
    --blue-dark: #00437f;
    --blue-light: #e9f1f8;
    --sky: #f7f9fb;
    --teal: #0057a8;
    --teal-light: #e9f1f8;
    --warm: #f3f6f9;
    --sand: #dce4eb;
    --border: #d8e2ea;
    --red: #c8102e;
    --red-dark: #a50d25;
    --red-light: #fbeaec;
    --danger: #c8102e;
    --danger-light: #fbeaec;
    --warning: #9a620e;
    --warning-light: #fdf4e5;
    --success: #146c4d;
    --success-light: #e9f6f0;
    --radius-sm: 5px;
    --radius: 8px;
    --radius-lg: 10px;
    --shadow-sm: 0 2px 12px rgba(10, 42, 67, .06);
    --shadow-md: 0 14px 36px rgba(10, 42, 67, .10);
    --shadow-lg: 0 24px 60px rgba(10, 42, 67, .14);
}

body { color: var(--ink); }
h1, h2, h3, h4, h5 { font-weight: 750; letter-spacing: -.03em; }
.hero h1 { letter-spacing: -.04em; }

/* ---------- Couleurs & aplats ---------- */
.hero { background: #f4f7fa; padding-top: 58px; }
.hero__glow { display: none; }
.hero__lead { color: #4a5f71; }
.hero__trust { border-top-color: #d8e2ea; }
.trust-item__icon { background: #fff; border-color: #d8e2ea; color: var(--blue); box-shadow: none; }
.trust-item small { color: #6f8394; }

.eyebrow { color: var(--blue); }
.eyebrow__dot { background: var(--red); box-shadow: 0 0 0 4px rgba(200, 16, 46, .10); }

.btn { border-radius: 4px; font-weight: 700; }
.btn--primary { background: var(--blue); box-shadow: none; }
.btn--primary:hover { background: var(--blue-dark); box-shadow: none; transform: none; }
.btn--outline { border-color: #c9d6e1; }
.btn--outline:hover { background: var(--blue-light); border-color: var(--blue); }
.btn--danger { background: var(--red); }
.btn--danger:hover { background: var(--red-dark); }
.btn--white { color: var(--navy); }
.btn--white:hover { background: #f1f5f9; color: var(--blue); transform: none; }

.main-nav__link.is-active::after { background: var(--red); }
.main-nav__link:hover { background: #eef4f9; color: var(--blue); }
.topbar { background: var(--navy-deep); }
.topbar__emergency .dot { background: #ff5268; box-shadow: 0 0 0 4px rgba(255, 82, 104, .15); }
.topbar__item svg { color: #8dc8f2; }

.quick-card { border-radius: 6px; box-shadow: 0 4px 18px rgba(10, 42, 67, .06); }
.quick-card:hover { transform: none; border-color: #b9cddd; box-shadow: var(--shadow-md); }
.quick-card--urgent { background: var(--red); border-color: transparent; }
.quick-card--urgent .quick-card__icon { background: rgba(255,255,255,.14); color: #fff; }
.quick-card--urgent small, .quick-card--urgent em { color: rgba(255,255,255,.74); }
.quick-card--urgent .quick-card__arrow { color: #fff; }
.quick-card__icon { background: var(--blue-light); color: var(--blue); border-radius: 6px; }
.floating-note { border-radius: 4px; box-shadow: none; }

.section--warm { background: var(--warm); }
.section--sky { background: var(--sky); }
.stats-band { background: var(--navy); }
.stats-band::before { display: none; }
.stat strong span { color: #ff6b7e; }
.stat { border-color: rgba(255,255,255,.14); }
.section--dark { background: var(--navy); }
.plateau { background: var(--navy); }

.cta-band { background: var(--blue); }
.cta-band::after, .cta-band__pattern { display: none; }
.cta-band h2 { color: #fff; }
.cta-band--blood, .donation-band { background: var(--red); }

.page-hero { background: var(--navy); }
.page-hero__pattern { display: none; }
.page-hero h1 { color: #fff; }
.breadcrumbs { color: rgba(255,255,255,.64); }

.service-card { border-radius: 6px; }
.service-card::before { background: var(--blue); }
.service-card:hover { transform: none; box-shadow: var(--shadow-md); }
.service-card__icon { background: var(--blue-light); border-radius: 6px; }
.service-card:hover .service-card__icon { background: var(--blue); }
.service-card__index { color: #9fb0be; }
.catalog-card, .news-card, .team-card, .team-profile, .value-card, .journey-step, .related-card, .contact-card, .aside-card, .appointment-form-wrap, .contact-form-wrap, .service-help, .location-map, .location-address, .success-card { border-radius: 8px; }
.catalog-card:hover, .news-card:hover, .team-card:hover { transform: none; }
.news-card__cat { color: var(--blue); background: #fff; border-radius: 3px; }
.news-card__body h3 a:hover, .catalog-card__body h3 a:hover { color: var(--blue); }
.news-card__image, .news-list__image { border-radius: 0; }
.catalog-card__visual { border-radius: 0; }
.catalog-card__icon { border-radius: 6px; }
.team-card__badge { border-radius: 3px; }
.team-card__photo { background: #e9f1f8; }

.about-preview__main, .about-story__media { border-radius: 8px; }
.about-preview__main { aspect-ratio: 1.45; }
.about-preview__inset { border-radius: 6px; border-color: var(--warm); }
.about-preview__stamp { background: var(--navy); box-shadow: 0 10px 24px rgba(10, 42, 67, .22); }
.about-preview__stamp span { color: #9dc8e8; }
.check-list svg { color: var(--blue); }
.value-card__icon { background: var(--blue-light); color: var(--blue); border-radius: 6px; }
.care-values__quote { background: rgba(10, 42, 67, .94); border-radius: 8px; }

.plateau-card { border-radius: 6px; }
.plateau-card__content small { color: #9ed0f4; }
.plateau-card__shade { background: linear-gradient(180deg, rgba(7,30,48,.02) 30%, rgba(7,30,48,.9) 100%); }
.journey-step { box-shadow: none; }
.journey-step__icon { background: var(--blue-light); color: var(--blue); border-color: #fff; }
.journey-grid::before { border-color: #c8d7e2; }

.team-card__body small, .team-profile__body small { color: var(--blue); }
.news-list__item { border-top-color: #d8e2ea; }
.featured-post { background: var(--navy); border-radius: 8px; }
.article__header { background: var(--navy); }
.article__hero img { border-radius: 8px; }
.article__body > p:first-of-type::first-letter { color: var(--blue); }
.article__share a { border-radius: 4px; }
.article__share a:hover { background: var(--blue); }

.contact-card { border-radius: 6px; }
.contact-card__icon { border-radius: 6px; background: var(--blue-light); color: var(--blue); }
.contact-card--urgent { background: var(--navy); }
.contact-hours { background: var(--navy); border-radius: 8px; }
.contact-map { border-radius: 8px; }
.contact-map iframe { filter: saturate(.9); }
.contact-form-wrap { box-shadow: none; }

.appointment-aside__card { border-radius: 8px; }
.appointment-aside__icon { background: var(--blue-light); color: var(--blue); border-radius: 6px; }
.appointment-aside__urgent { background: var(--danger-light); border-color: #f2c7cd; }
.step-pill { border-radius: 999px; background: var(--blue-light); color: var(--blue); }
.step-pill span { background: var(--blue); }
.step-pill--muted { background: #eef2f5; color: #7e8f9d; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 87, 168, .10); }
.slot span { border-radius: 4px; }
.slot input:checked + span, .slot.is-selected span { background: var(--blue); border-color: var(--blue); }

.aside-card__icon { background: rgba(255,255,255,.10); color: #a9d9fa; border-radius: 6px; }
.aside-phone { color: #a9d9fa; }
.related-card__icon { background: var(--blue-light); color: var(--blue); border-radius: 6px; }
.service-hero__icon { background: #fff; color: var(--blue); border-radius: 8px; }
.service-hero__visual, .service-hero__visual img { border-radius: 8px; }
.service-hero__chip { border-radius: 3px; }
.service-detail__note { border-radius: 6px; }
.info-list svg { color: var(--blue); }

.site-footer { background: var(--navy-deep); }
.site-footer__col a, .site-footer__brand p, .footer-contact li { color: rgba(255,255,255,.62); }
.socials a { border-radius: 4px; }
.site-footer__bar { border-top-color: rgba(255,255,255,.12); }
.emergency-fab { background: var(--red); box-shadow: 0 8px 24px rgba(200, 16, 46, .28); border-radius: 4px; }
.emergency-fab:hover { background: var(--red-dark); }
.flash { border-radius: 5px; }
.status-badge, .badge { border-radius: 3px; }
.pagination__link { color: var(--blue); }

/* ---------- Vidéo de présentation ---------- */
.hero__visual { position: relative; }
.hero-video {
    position: relative; display: block; width: 100%; padding: 0; border: 0;
    border-radius: 8px; overflow: hidden; background: #0a2a43; cursor: pointer;
    aspect-ratio: 1.18 / 1; box-shadow: var(--shadow-lg); text-align: left;
}
.hero-video img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.hero-video:hover img { transform: scale(1.025); }
.hero-video__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,24,39,.08) 25%, rgba(6,24,39,.82) 100%); }
.hero-video__top { position: absolute; top: 14px; left: 14px; right: 14px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.hero-video__top span { background: rgba(255,255,255,.94); color: var(--navy); border-radius: 3px; padding: 5px 8px; font-size: 8.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero-video__top span:last-child { background: var(--red); color: #fff; }
.hero-video__play {
    position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%);
    width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center;
    background: rgba(0, 87, 168, .9); color: #fff; border: 2px solid rgba(255,255,255,.9);
    box-shadow: 0 10px 30px rgba(0,0,0,.22); transition: .2s;
}
.hero-video:hover .hero-video__play { background: var(--red); transform: translate(-50%, -50%) scale(1.05); }
.hero-video__meta { position: absolute; left: 20px; right: 20px; bottom: 18px; color: #fff; }
.hero-video__meta small { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .12em; color: #a9d9fa; font-weight: 700; margin-bottom: 4px; }
.hero-video__meta strong { display: block; font-family: var(--font-head, 'Manrope', sans-serif); font-size: 1.02rem; line-height: 1.25; }
.hero-video__meta em { display: block; font-style: normal; font-size: 9.5px; color: rgba(255,255,255,.68); margin-top: 4px; }
.hero__floating { right: -16px; top: 24px; }
.hero__floating .floating-note { color: var(--ink-soft); }

.video-modal { position: fixed; inset: 0; z-index: 250; display: flex; align-items: center; justify-content: center; padding: 24px; visibility: hidden; opacity: 0; transition: .2s; }
.video-modal.is-open { visibility: visible; opacity: 1; }
.video-modal__backdrop { position: absolute; inset: 0; background: rgba(4, 17, 28, .9); backdrop-filter: blur(4px); }
.video-modal__dialog { position: relative; width: min(1080px, 94vw); background: #06131e; border: 1px solid rgba(255,255,255,.16); border-radius: 8px; overflow: hidden; box-shadow: 0 30px 90px rgba(0,0,0,.5); transform: translateY(12px); transition: .2s; }
.video-modal.is-open .video-modal__dialog { transform: none; }
.video-modal__close { position: absolute; right: 12px; top: 12px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(0,0,0,.5); color: #fff; display: grid; place-items: center; }
.video-modal__close:hover { background: var(--red); border-color: var(--red); }
.video-modal__player { background: #000; }
.video-modal__player video { display: block; width: 100%; max-height: 72vh; aspect-ratio: 16 / 9; background: #000; }
.video-modal__bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 18px; color: #fff; background: #0a2a43; flex-wrap: wrap; }
.video-modal__bar strong { display: block; font-size: 12px; }
.video-modal__bar span { display: block; font-size: 9.5px; color: rgba(255,255,255,.55); margin-top: 2px; }
.video-modal__bar button { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.25); background: transparent; color: #fff; border-radius: 3px; padding: 7px 10px; font-size: 10px; }
.video-modal__bar button:hover { background: rgba(255,255,255,.1); }

/* ---------- Don de sang ---------- */
.donation-band { color: #fff; padding: 42px 0; }
.donation-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.donation-band__main { display: flex; gap: 20px; align-items: flex-start; max-width: 720px; }
.donation-band__icon { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%; background: rgba(255,255,255,.14); color: #fff; display: grid; place-items: center; }
.donation-band .eyebrow { color: #ffd7dd; margin-bottom: 8px; }
.donation-band .eyebrow__dot { background: #fff; box-shadow: none; }
.donation-band h2 { color: #fff; font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 8px; }
.donation-band p { color: rgba(255,255,255,.76); font-size: .9rem; margin: 0; max-width: 570px; }
.donation-band__side { display: flex; align-items: center; gap: 28px; flex: 0 0 auto; }
.donation-band__side ul { display: flex; gap: 26px; }
.donation-band__side li { display: flex; flex-direction: column; }
.donation-band__side strong { font-family: var(--font-head, 'Manrope', sans-serif); font-size: 1.35rem; color: #fff; }
.donation-band__side span { font-size: 8.5px; color: rgba(255,255,255,.65); text-transform: uppercase; letter-spacing: .05em; }

.donation-intro__grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 74px; align-items: center; }
.donation-intro h2 { margin-bottom: 20px; }
.donation-intro .lead { color: var(--ink-soft); }
.donation-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 25px; }
.donation-card { background: var(--red); color: #fff; border-radius: 8px; padding: 34px; box-shadow: var(--shadow-md); }
.donation-card__icon { width: 72px; height: 72px; border-radius: 50%; background: rgba(255,255,255,.14); color: #fff; display: grid; place-items: center; margin-bottom: 18px; }
.donation-card h3 { color: #fff; font-size: 1.3rem; margin-bottom: 17px; }
.donation-card ul { display: grid; gap: 0; }
.donation-card li { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.2); }
.donation-card li strong { font-family: var(--font-head, 'Manrope', sans-serif); font-size: 1.25rem; flex: 0 0 85px; }
.donation-card li span { font-size: .82rem; color: rgba(255,255,255,.78); }
.donation-card__note { display: flex; align-items: center; gap: 7px; margin-top: 18px; font-size: .78rem; color: rgba(255,255,255,.8); }

.eligibility-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.eligibility-card { display: flex; gap: 13px; background: #fff; border: 1px solid var(--border); border-radius: 6px; padding: 19px; }
.eligibility-card__check { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; background: var(--blue-light); color: var(--blue); display: grid; place-items: center; }
.eligibility-card h3 { font-size: .96rem; margin-bottom: 4px; }
.eligibility-card p { font-size: .82rem; color: var(--ink-soft); margin: 0; }
.donation-warning { display: flex; gap: 11px; align-items: flex-start; background: var(--danger-light); border: 1px solid #f0c7ce; border-radius: 6px; padding: 16px 18px; margin-top: 20px; }
.donation-warning svg { color: var(--red); flex: 0 0 auto; margin-top: 1px; }
.donation-warning p { font-size: .82rem; color: #70424a; margin: 0; }
.donation-warning strong { color: #5d2b34; }

.donation-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.donation-step { border: 1px solid var(--border); border-radius: 6px; padding: 24px; position: relative; background: #fff; }
.donation-step > span { display: block; font-family: var(--font-head, 'Manrope', sans-serif); font-size: .78rem; font-weight: 800; color: var(--red); letter-spacing: .06em; margin-bottom: 18px; }
.donation-step h3 { font-size: .98rem; margin-bottom: 6px; }
.donation-step p { font-size: .82rem; color: var(--ink-soft); margin: 0; }
.donation-prep__grid { display: grid; grid-template-columns: .92fr 1.08fr; gap: 64px; align-items: center; }
.donation-prep__media { border-radius: 8px; overflow: hidden; box-shadow: var(--shadow-sm); }
.donation-prep__media img { width: 100%; aspect-ratio: 1.3; object-fit: cover; }
.prep-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin: 22px 0; }
.prep-grid h3 { font-size: .96rem; margin-bottom: 10px; }
.check-list--single { grid-template-columns: 1fr; gap: 8px; margin: 0; }
.check-list--single li { font-size: .82rem; }
.donation-contact-note { display: flex; gap: 10px; align-items: flex-start; background: var(--blue-light); border-radius: 6px; padding: 14px 16px; }
.donation-contact-note svg { color: var(--blue); flex: 0 0 auto; margin-top: 1px; }
.donation-contact-note p { font-size: .8rem; color: #315a76; margin: 0; }
.cta-band--blood { background: var(--red); }
.cta-band--blood .eyebrow { color: #ffd7dd; }
.cta-band--blood .eyebrow__dot { background: #fff; box-shadow: none; }

/* ---------- Ajustements de densité ---------- */
.section { padding: 88px 0; }
.site-header__inner { min-height: 76px; }
.main-nav { gap: 1px; }
.main-nav__link { padding: 10px 9px; font-size: 13px; }
.header-cta { padding: 10px 16px; font-size: .82rem; }
.hero__grid { padding-bottom: 62px; }
.hero__trust { gap: 18px; }

@media (max-width: 1150px) {
    .main-nav__link { padding-inline: 7px; font-size: 12.2px; }
    .header-cta { padding-inline: 12px; }
    .donation-band__inner { gap: 25px; }
    .donation-band__side ul { display: none; }
}
@media (max-width: 980px) {
    .donation-intro__grid, .donation-prep__grid { grid-template-columns: 1fr; gap: 36px; }
    .donation-steps { grid-template-columns: 1fr 1fr; }
    .eligibility-grid { grid-template-columns: 1fr; }
    .donation-band__inner { flex-direction: column; align-items: flex-start; gap: 20px; }
    .donation-band__side { width: 100%; }
    .donation-band__side .btn { width: 100%; }
    .hero-video { max-width: 640px; }
    .video-modal { padding: 12px; }
}
@media (max-width: 760px) {
    .hero-video { aspect-ratio: 1.1 / 1; }
    .hero-video__play { width: 60px; height: 60px; }
    .hero-video__meta strong { font-size: .92rem; }
    .donation-card { padding: 26px; }
    .donation-steps, .prep-grid { grid-template-columns: 1fr; }
    .donation-band__main { gap: 14px; }
    .donation-band__icon { width: 50px; height: 50px; flex-basis: 50px; }
    .video-modal__bar { padding: 11px 13px; }
    .video-modal__bar button { font-size: 9px; }
}

/* ---------- Carrousel photos d’accueil ---------- */
.hero-slider { position: relative; width: 100%; aspect-ratio: 1.18 / 1; border-radius: 8px; overflow: hidden; background: #0a2a43; box-shadow: var(--shadow-lg); }
.hero-slider__slides { position: absolute; inset: 0; }
.hero-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity .9s ease; }
.hero-slide.is-active { opacity: 1; z-index: 1; }
.hero-slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.03); transition: transform 7s linear; }
.hero-slide.is-active img { transform: scale(1.09); }
.hero-slider__shade { position: absolute; inset: 0; z-index: 2; background: linear-gradient(180deg, rgba(6,24,39,.04) 30%, rgba(6,24,39,.78) 100%); pointer-events: none; }
.hero-slider__top { position: absolute; z-index: 4; top: 14px; left: 14px; right: 14px; display: flex; justify-content: space-between; gap: 10px; }
.hero-slider__top span { background: rgba(255,255,255,.94); color: var(--navy); border-radius: 3px; padding: 5px 8px; font-size: 8.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero-slider__top span:last-child { background: var(--red); color: #fff; }
.hero-slider__bottom { position: absolute; z-index: 4; left: 20px; right: 20px; bottom: 18px; display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.hero-slider__caption small { display: block; font-size: 8.5px; text-transform: uppercase; letter-spacing: .12em; color: #a9d9fa; font-weight: 700; margin-bottom: 3px; }
.hero-slider__caption strong { display: block; color: #fff; font-family: var(--font-head, 'Manrope', sans-serif); font-size: 1.02rem; line-height: 1.2; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.hero-slider__video { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.5); background: rgba(200,16,46,.92); color: #fff; border-radius: 4px; padding: 8px 10px; font-size: 9.5px; font-weight: 700; cursor: pointer; }
.hero-slider__video span { color: rgba(255,255,255,.7); font-weight: 500; }
.hero-slider__video:hover { background: var(--red-dark); }
.hero-slider__arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.4); background: rgba(6,24,39,.4); color: #fff; border-radius: 50%; display: grid; place-items: center; cursor: pointer; opacity: .8; transition: .2s; }
.hero-slider__arrow:hover { background: var(--red); border-color: var(--red); opacity: 1; }
.hero-slider__arrow--prev { left: 12px; }
.hero-slider__arrow--next { right: 12px; }
.hero-slider__dots { position: absolute; z-index: 5; left: 20px; bottom: 74px; display: flex; gap: 5px; }
.hero-slider__dot { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.45); cursor: pointer; transition: .2s; }
.hero-slider__dot.is-active { background: #fff; width: 20px; border-radius: 4px; }
.hero-slider__dot:hover { background: #fff; }

@media (max-width: 760px) {
    .hero-slider { aspect-ratio: 1.08 / 1; }
    .hero-slider__arrow { width: 30px; height: 30px; }
    .hero-slider__arrow--prev { left: 7px; }
    .hero-slider__arrow--next { right: 7px; }
    .hero-slider__bottom { left: 14px; right: 14px; bottom: 12px; }
    .hero-slider__caption strong { font-size: .9rem; }
    .hero-slider__video { padding: 6px 7px; font-size: 8px; }
    .hero-slider__dots { left: 14px; bottom: 58px; }
}

.eyebrow { display: none !important; }


/* Hero resserré : le carrousel s’aligne avec le titre */
.hero { padding-top: 30px; }
.hero__grid { align-items: start; }
.hero__content { padding-top: 4px; }
.hero__visual { margin-top: 0; }
@media (max-width: 760px) { .hero { padding-top: 24px; } }

/* Espace sous les trois accès rapides */
.quick-access { margin-bottom: 38px; }
@media (max-width: 760px) { .quick-access { margin-bottom: 26px; } }