/* Tokens */
:root {
    --sh-lg: 0 12px 48px rgba(15,63,147,.20);
}

@keyframes fadeUp   { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn   { from { opacity:0; } to { opacity:1; } }
@keyframes slideIn  { from { opacity:0; transform:translateX(-20px); } to { opacity:1; transform:translateX(0); } }
@keyframes pulse    { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }

/* Hero */
.home-hero {
    position: relative;
    min-height: 580px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    background: var(--b1);
}
.home-hero-img {
    position: absolute; inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.home-hero-bg {
    position: absolute; inset: 0;
    background: linear-gradient(105deg,
        rgba(12,21,41,.88) 0%,
        rgba(15,63,147,.72) 40%,
        rgba(38,105,178,.40) 70%,
        rgba(32,178,158,.25) 100%
    );
    background-size: cover;
    background-position: center;
    z-index: 1;
}
.home-hero-bg.has-pattern::after { display: none; }
.home-hero-bg::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.04'/%3E%3C/svg%3E");
    opacity: .4;
    pointer-events: none;
}
.home-hero-bg-overlay {
    position: absolute;
    top: 0; right: 0;
    width: 45%; height: 100%;
    background: linear-gradient(135deg, transparent 0%, rgba(38,105,178,.15) 50%, transparent 100%);
    clip-path: polygon(15% 0%, 100% 0%, 100% 100%, 0% 100%);
    pointer-events: none;
    z-index: 2;
}
.home-hero-content {
    position: relative; z-index: 2;
    padding: 72px 48px 104px;
    max-width: 680px;
    animation: fadeUp .7s ease both;
}
.home-hero-kicker {
    display: inline-flex; align-items: center; gap: 10px;
    font-size: 11px; font-weight: 700;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--teal);
    margin-bottom: 20px;
    animation: slideIn .6s ease both .1s;
}
.home-hero-kicker::before {
    content: '';
    display: block;
    width: 28px; height: 2px;
    background: var(--teal);
    border-radius: 2px;
}
.home-hero-title {
    font-family: var(--global-heading-font-family);
    font-size: clamp(32px, 5vw, 56px);
    font-weight: 700;
    color: white; line-height: 1.08;
    letter-spacing: -.5px;
    margin-bottom: 20px;
    animation: fadeUp .7s ease both .2s;
}
.home-hero-title em { font-style: normal; color: var(--yellow); }
.home-hero-sub {
    font-size: 17px;
    color: rgba(255,255,255,.75);
    line-height: 1.65; max-width: 520px;
    margin-bottom: 36px;
    animation: fadeUp .7s ease both .3s;
}
.home-hero-actions {
    display: flex; gap: 12px; flex-wrap: wrap;
    animation: fadeUp .7s ease both .4s;
}
.home-hero-btn-primary {
    background: var(--surface); color: var(--b2);
    font-weight: 700; font-size: 14px;
    padding: 14px 28px; border-radius: var(--r);
    border: 1px solid transparent; /* même boîte qu’en mode sombre (évite le décalage j/n) */
    box-sizing: border-box;
    display: flex; align-items: center; gap: 8px;
    transition: all .2s;
}
.home-hero-btn-primary:hover {
    background: var(--off); transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0,0,0,.25);
}
.home-hero-btn-secondary {
    color: white; font-weight: 600; font-size: 14px;
    padding: 14px 28px; border-radius: var(--r);
    border: 2px solid rgba(255,255,255,.35);
    transition: all .2s;
}
.home-hero-btn-secondary:hover {
    border-color: white;
    background: rgba(255,255,255,.1);
}

/* Carousel hero */
.home-hero-slides {
    position: relative; z-index: 2;
    max-width: 680px;
    display: grid;
    grid-template-areas: "slide" "nav";
    align-self: flex-start;
    padding: 72px 48px 104px;
    min-width: 0;
}
.home-hero-slide {
    grid-area: slide;
    opacity: 0;
    pointer-events: none;
    transition: opacity .65s ease, transform .65s ease;
    transform: translateY(14px);
    /* reset animations du single-slide */
    animation: none !important;
}
.home-hero-slide > * { animation: none !important; }
.home-hero-slide.is-active {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
/* override padding du wrapper quand content est dans slides */
.home-hero-slides .home-hero-content {
    padding: 0;
}
.home-hero-carousel-nav {
    grid-area: nav;
    position: relative;
    z-index: 4;
    display: flex; align-items: center; gap: 10px;
    margin-top: 22px;
}
.home-hero-carousel-btn {
    background: rgba(255,255,255,.14);
    border: 1.5px solid rgba(255,255,255,.28);
    color: white; width: 30px; height: 30px;
    border-radius: 50%; font-size: 20px; line-height: 1;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    transition: all .2s; padding: 0; font-family: inherit;
}
.home-hero-carousel-btn:hover {
    background: rgba(255,255,255,.28);
    border-color: rgba(255,255,255,.6);
}
.home-hero-carousel-dots { display: flex; gap: 6px; align-items: center; }
.hero-dot {
    width: 6px; height: 6px;
    border-radius: 3px;
    background: rgba(255,255,255,.32);
    border: none; cursor: pointer;
    transition: all .3s ease; padding: 0;
}
.hero-dot.is-active {
    background: var(--surface);
    width: 20px;
}

/* KPIs */
.home-hero-kpis {
    position: absolute;
    bottom: 0; left: 0; right: 0; z-index: 3;
    display: grid; grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 72px;
    border-top: 1px solid rgba(255,255,255,.1);
    animation: fadeIn .8s ease both .5s;
}
.kpi-item {
    padding: 0 28px;
    border-right: 1px solid rgba(255,255,255,.1);
    background: rgba(12,21,41,.55);
    backdrop-filter: blur(8px);
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    line-height: 1;
    height: 72px;
}
.kpi-item:last-child { border-right: none; }
.kpi-val {
    font-family: var(--global-heading-font-family);
    font-size: 26px; font-weight: 700;
    color: white; line-height: 1; margin-bottom: 3px;
}
.kpi-val span { color: var(--yellow); }
.kpi-label { font-size: 11px; color: rgba(255,255,255,.55); font-weight: 500; }

/* ══ BANDE URGENTE ══ */
.home-urgents {
    background: var(--b3);
    position: relative; overflow: hidden;
    color: white !important;
    height: 48px;
    display: flex !important;
}
.home-urgents::before {
    content: '';
    position: absolute; inset: 0;
    background: repeating-linear-gradient(
        -45deg, transparent, transparent 24px,
        rgba(255,255,255,.025) 24px, rgba(255,255,255,.025) 25px
    );
}
.home-urgents-inner {
    position: relative; z-index: 1;
    display: flex !important; align-items: center;
    width: 100%; height: 48px;
}
.home-urgents-label {
    background: var(--yellow); color: var(--b1);
    padding: 0 24px;
    display: flex !important; align-items: center !important; gap: 8px;
    font-size: 11px; font-weight: 800;
    letter-spacing: 2px; text-transform: uppercase;
    white-space: nowrap; flex-shrink: 0;
    align-self: stretch; line-height: 1;
    max-width: 280px;
    overflow: hidden;
    transition: max-width .28s ease, padding .28s ease, opacity .2s ease;
}
.home-urgents.is-scrolled .home-urgents-label {
    max-width: 0;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    opacity: 0;
    pointer-events: none;
    flex-shrink: 1;
}
.home-urgents-label svg { display: none !important; }
/* Pictos accueil via CSS unicode (spans vides + ::before) */
.home-ico,
.home-ui-icon,
.home-section-title-icon,
.home-join-deco-icon {
    display: inline-block;
    flex-shrink: 0;
    width: auto;
    height: auto;
    line-height: 1;
    font-style: normal;
    font-weight: 400;
    vertical-align: -0.12em;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0;
    color: inherit;
    font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", "Twemoji Mozilla", sans-serif;
}
.home-ico::before,
.home-ui-icon::before,
.home-section-title-icon::before,
.home-join-deco-icon::before {
    display: none; /* contenu HTML entity dans le span ; ::before en secours si span vide */
}
.home-ico:empty::before,
.home-ui-icon:empty::before,
.home-section-title-icon:empty::before,
.home-join-deco-icon:empty::before {
    display: block;
    line-height: 1;
}
.home-ico--urgents:empty::before { content: "\1F4CC"; }
.home-ico--actus:empty::before { content: "\1F4F0"; }
.home-ico--agenda:empty::before { content: "\1F4C5"; }
.home-ico--ressources:empty::before { content: "\1F4DA"; }
.home-ico--faq:empty::before { content: "\1F4AC"; }
.home-ico--search:empty::before { content: "\1F50D"; }
.home-ico--join:empty::before { content: "\1F332"; }
.home-ui-icon--urgents { font-size: 15px; }
.home-ui-icon--inline { font-size: 16px; }
.home-ui-arrow {
    display: inline-block;
    font-size: 1.05em;
    font-weight: 800;
    line-height: 1;
    opacity: .92;
}
.home-urgents-links {
    display: flex; align-items: center;
    overflow-x: auto; scrollbar-width: none; flex: 1;
    color: white !important;
}
.home-urgents-links::-webkit-scrollbar { display: none; }
.home-urgents .home-urgents-links a.urgent-link {
    display: flex !important; align-items: center; gap: 8px;
    padding: 0 20px; height: 48px; font-size: 13px; font-weight: 600;
    color: white !important; white-space: nowrap; line-height: 1;
    border-right: 1px solid rgba(255,255,255,.12);
    transition: background .2s;
    text-decoration: none !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.home-urgents .home-urgents-links a.urgent-link:hover {
    background: rgba(255,255,255,.1);
    color: white !important;
}
.urgent-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--yellow); flex-shrink: 0;
    animation: pulse 2s ease infinite;
}
.urgent-dot.teal { background: var(--teal); }
.urgent-dot.pink { background: #EA4F70; }

/* ══════════════════════════════════════════
   MÉTÉO ONF — climat collectif + remontée
══════════════════════════════════════════ */
.home-meteo {
    --wx: var(--b5, #2669B2);
    background: var(--off, #F2F6FB);
    border-bottom: 1px solid var(--border, #C8DAF0);
    color: var(--text, #1A2340);
    position: relative;
    transition: background .2s ease, border-color .2s ease;
}
.home-meteo[data-wx="na"] {
    --wx: var(--b5, #2669B2);
    background: var(--off, #F2F6FB);
}
.home-meteo[data-wx="orage"] {
    --wx: #EA4F70;
    background: #F0D5DF;
    background: color-mix(in srgb, #EA4F70 18%, var(--off, #F2F6FB));
    border-bottom-color: color-mix(in srgb, #EA4F70 32%, var(--border, #C8DAF0));
}
.home-meteo[data-wx="pluie"] {
    --wx: var(--yellow, #FBBB1D);
    background: #F4E9CA;
    background: color-mix(in srgb, var(--yellow, #FBBB1D) 24%, var(--off, #F2F6FB));
    border-bottom-color: color-mix(in srgb, var(--yellow, #FBBB1D) 40%, var(--border, #C8DAF0));
}
.home-meteo[data-wx="couvert"] {
    --wx: var(--b5, #2669B2);
    background: #D5E3F2;
    background: color-mix(in srgb, var(--b5, #2669B2) 16%, var(--off, #F2F6FB));
}
.home-meteo[data-wx="eclaircies"] {
    --wx: var(--teal, #20B29E);
    background: #D3EDE8;
    background: color-mix(in srgb, var(--teal, #20B29E) 20%, var(--off, #F2F6FB));
    border-bottom-color: color-mix(in srgb, var(--teal, #20B29E) 32%, var(--border, #C8DAF0));
}
.home-meteo[data-wx="beau"] {
    --wx: var(--green, #2D6A4F);
    background: #D8F3DC;
    border-bottom-color: color-mix(in srgb, var(--green, #2D6A4F) 28%, var(--border, #C8DAF0));
}
.home-meteo-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px 28px;
    flex-wrap: wrap;
    padding: 12px 48px;
}
.home-meteo-wx {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.home-meteo.is-fresh .home-meteo-wx {
    animation: fadeIn .45s ease;
}
.home-meteo-emoji {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 6px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .14);
    font-size: 26px;
    line-height: 1;
    font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
    box-sizing: border-box;
}
.home-meteo-kicker {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: var(--wx, var(--teal, #20B29E));
    margin: 0 0 2px;
}
.home-meteo-label {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.15;
    color: var(--b1, #212E81);
}
.home-meteo-line,
.home-meteo-meta {
    margin: 2px 0 0;
    font-size: 12px;
    line-height: 1.35;
    color: var(--mid, #4A5568);
}
.home-meteo-meta { margin-top: 1px; }
.home-meteo[data-wx="na"] .home-meteo-label { color: var(--b1, #212E81); }
.home-meteo[data-wx="orage"] .home-meteo-label { color: #EA4F70; }
.home-meteo[data-wx="pluie"] .home-meteo-kicker,
.home-meteo[data-wx="pluie"] .home-meteo-label { color: var(--b1, #212E81); }
.home-meteo[data-wx="couvert"] .home-meteo-label { color: var(--b3, #0F3F93); }
.home-meteo[data-wx="eclaircies"] .home-meteo-label { color: #157A6C; }
.home-meteo[data-wx="beau"] .home-meteo-label { color: var(--green, #2D6A4F); }
.home-meteo.is-wx-off .home-meteo-ask-col { margin-left: 0; }
.home-meteo-ask-col {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    align-self: center;
    gap: 10px;
    min-width: 0;
    flex: 1 1 280px;
}
.home-meteo-pulse {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px 14px;
    flex-wrap: wrap;
    width: 100%;
}
.home-meteo-ask {
    font-size: 13px;
    font-weight: 700;
    color: var(--text, #1A2340);
    white-space: nowrap;
}
.home-meteo-moods {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-start;
}
.home-meteo-pulse .home-meteo-moods {
    justify-content: flex-end;
}
.home-meteo button.home-meteo-mood {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    border: 1.5px solid var(--border, #C8DAF0);
    background: #fff;
    border-radius: 8px;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    color: var(--text, #1A2340);
    line-height: 1.2;
    box-shadow: none;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.home-meteo button.home-meteo-mood:hover,
.home-meteo button.home-meteo-mood:focus,
.home-meteo button.home-meteo-mood:focus-visible,
.home-meteo button.home-meteo-mood:active {
    background: #D4E4F4;
    border-color: #2669B2;
    color: var(--text, #1A2340);
    box-shadow: none;
    outline: none;
}
.home-meteo button.home-meteo-mood.is-on,
.home-meteo button.home-meteo-mood.is-on:hover,
.home-meteo button.home-meteo-mood.is-on:focus,
.home-meteo button.home-meteo-mood.is-on:focus-visible,
.home-meteo button.home-meteo-mood.is-on:active {
    background: var(--b3, #0F3F93);
    border-color: var(--b3, #0F3F93);
    color: #fff;
    box-shadow: none;
}
.home-meteo-done {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    color: var(--mid, #4A5568);
}
.home-meteo-ok {
    margin: 0;
    width: 100%;
    flex: 1 1 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(32, 178, 158, .16);
    border: 1px solid rgba(32, 178, 158, .34);
    color: var(--text, #1A2340);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
    text-align: left;
}
.home-meteo-panel {
    padding: 4px 0 0;
    display: grid;
    gap: 10px;
    width: 100%;
    flex: 1 1 100%;
    box-sizing: border-box;
}
.home-meteo-panel[hidden],
.home-meteo-ok[hidden],
.home-meteo-err[hidden],
.home-meteo-share[hidden],
.home-meteo-more[hidden],
.home-meteo-auto[hidden],
.home-meteo-send[hidden],
.home-meteo-line[hidden],
.home-meteo-meta[hidden] { display: none !important; }
.home-meteo-more {
    display: grid;
    gap: 14px;
    width: 100%;
    flex: 1 1 100%;
    padding: 8px 0 0;
}
.home-meteo-q {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}
.home-meteo-q + .home-meteo-q {
    padding-top: 12px;
    border-top: 1px solid rgba(26, 35, 64, .08);
}
.home-meteo-q-lbl {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--text, #1A2340);
    margin: 0;
    line-height: 1.4;
    text-align: left;
}
.home-meteo-q .home-meteo-moods {
    justify-content: flex-start;
}
.home-meteo-q .home-meteo-mood {
    padding: 6px 10px;
    font-size: 12px;
}
.home-meteo-auto {
    margin: 0;
    font-size: 12px;
    font-weight: 650;
    color: var(--mid, #4A5568);
}
.home-meteo-share {
    display: grid;
    gap: 10px;
}
.home-meteo-dt {
    display: grid;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: var(--text, #1A2340);
}
.home-meteo-dt select {
    width: 100%;
    max-width: 420px;
    height: 38px;
    padding: 0 10px;
    border: 1.5px solid var(--border, #C8DAF0);
    border-radius: 10px;
    background: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--text, #1A2340);
    box-sizing: border-box;
}
.home-meteo-dt select:focus {
    outline: none;
    border-color: var(--b3, #0F3F93);
    box-shadow: 0 0 0 3px rgba(15, 63, 147, .08);
}
.home-meteo-panel textarea {
    width: 100%;
    min-height: 84px;
    padding: 10px 12px;
    border: 1.5px solid var(--border, #C8DAF0);
    border-radius: 8px;
    font: inherit;
    font-size: 14px;
    line-height: 1.45;
    color: var(--text, #1A2340);
    box-sizing: border-box;
    resize: vertical;
    background: #fff;
}
.home-meteo-panel textarea:focus {
    outline: none;
    border-color: var(--b3, #0F3F93);
    box-shadow: 0 0 0 3px rgba(15,63,147,.08);
}
.home-meteo-themes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-start;
}
.home-meteo button.home-meteo-theme {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    padding: 5px 10px;
    border: 1px solid var(--border, #C8DAF0);
    background: #fff;
    border-radius: 99px;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    color: var(--mid, #4A5568);
    box-shadow: none;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.home-meteo button.home-meteo-theme:hover,
.home-meteo button.home-meteo-theme:focus,
.home-meteo button.home-meteo-theme:focus-visible,
.home-meteo button.home-meteo-theme:active {
    background: #D4E4F4;
    border-color: #2669B2;
    color: var(--text, #1A2340);
    box-shadow: none;
    outline: none;
}
.home-meteo button.home-meteo-theme.is-on,
.home-meteo button.home-meteo-theme.is-on:hover,
.home-meteo button.home-meteo-theme.is-on:focus,
.home-meteo button.home-meteo-theme.is-on:focus-visible,
.home-meteo button.home-meteo-theme.is-on:active {
    background: var(--b3, #0F3F93);
    border-color: var(--b3, #0F3F93);
    color: #fff;
    box-shadow: none;
}
.home-meteo button.home-meteo-urgent {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    justify-self: start;
    padding: 5px 10px;
    border: 1px solid #EA4F70;
    background: #fff;
    border-radius: 99px;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    color: #EA4F70;
    box-shadow: none;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.home-meteo button.home-meteo-urgent:hover,
.home-meteo button.home-meteo-urgent:focus,
.home-meteo button.home-meteo-urgent:focus-visible,
.home-meteo button.home-meteo-urgent:active {
    background: #FCE8ED;
    border-color: #EA4F70;
    color: #EA4F70;
    box-shadow: none;
    outline: none;
}
.home-meteo button.home-meteo-urgent.is-on,
.home-meteo button.home-meteo-urgent.is-on:hover,
.home-meteo button.home-meteo-urgent.is-on:focus,
.home-meteo button.home-meteo-urgent.is-on:focus-visible,
.home-meteo button.home-meteo-urgent.is-on:active {
    background: #EA4F70;
    border-color: #EA4F70;
    color: #fff;
    box-shadow: none;
}
.home-meteo-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px 18px;
    flex-wrap: wrap;
}
.home-meteo button.home-meteo-share-toggle {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    color: var(--b3, #0F3F93);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
    box-shadow: none;
}
.home-meteo button.home-meteo-share-toggle:hover,
.home-meteo button.home-meteo-share-toggle:focus,
.home-meteo button.home-meteo-share-toggle:focus-visible,
.home-meteo button.home-meteo-share-toggle:active {
    background: transparent;
    color: var(--b1, #212E81);
    box-shadow: none;
    outline: none;
}
.home-meteo button.home-meteo-send {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background: var(--b3, #0F3F93);
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 16px;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: none;
    text-decoration: none;
    transition: background .15s ease;
}
.home-meteo button.home-meteo-send:hover,
.home-meteo button.home-meteo-send:focus,
.home-meteo button.home-meteo-send:focus-visible,
.home-meteo button.home-meteo-send:active {
    background: #2669B2;
    color: #fff;
    box-shadow: none;
    outline: none;
}
.home-meteo button.home-meteo-send:disabled { opacity: .55; cursor: not-allowed; }
.home-meteo-hint {
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--mid, #4A5568);
    max-width: 42em;
}
.home-meteo-hint a { color: var(--b3, #0F3F93); font-weight: 650; }
.home-meteo-err {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    color: #9C4A2E;
}
.home-meteo-hp {
    position: absolute;
    left: -9999px;
    opacity: 0;
    height: 0;
    width: 0;
    overflow: hidden;
}
body.dark .home-meteo {
    background: #1B2225;
    border-bottom-color: #2a3336;
    color: #F4F3EE;
}
body.dark .home-meteo[data-wx="na"] { background: #1B2225; }
body.dark .home-meteo[data-wx="orage"] { background: color-mix(in srgb, #EA4F70 22%, #1B2225); }
body.dark .home-meteo[data-wx="pluie"] { background: color-mix(in srgb, #FBBB1D 16%, #1B2225); }
body.dark .home-meteo[data-wx="couvert"] { background: color-mix(in srgb, #2669B2 22%, #1B2225); }
body.dark .home-meteo[data-wx="eclaircies"] { background: color-mix(in srgb, #20B29E 20%, #1B2225); }
body.dark .home-meteo[data-wx="beau"] { background: color-mix(in srgb, #2D6A4F 24%, #1B2225); }
body.dark .home-meteo-label { color: #F4F3EE; }
body.dark .home-meteo[data-wx="orage"] .home-meteo-label { color: #F08AA0; }
body.dark .home-meteo[data-wx="pluie"] .home-meteo-kicker,
body.dark .home-meteo[data-wx="pluie"] .home-meteo-label { color: #FBBB1D; }
body.dark .home-meteo[data-wx="eclaircies"] .home-meteo-label,
body.dark .home-meteo[data-wx="beau"] .home-meteo-label { color: #7DCFB6; }
body.dark .home-meteo-line,
body.dark .home-meteo-meta,
body.dark .home-meteo-hint,
body.dark .home-meteo-done,
body.dark .home-meteo-auto { color: #9FA6A0; }
body.dark .home-meteo-q-lbl { color: #F4F3EE; }
body.dark .home-meteo-emoji {
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}
body.dark .home-meteo-ok {
    background: rgba(32, 178, 158, .18);
    border-color: rgba(32, 178, 158, .4);
    color: #F4F3EE;
}
body.dark .home-meteo button.home-meteo-mood,
body.dark .home-meteo button.home-meteo-theme,
body.dark .home-meteo-panel textarea {
    background: #12181A;
    border-color: #2a3336;
    color: #F4F3EE;
}
body.dark .home-meteo button.home-meteo-mood:hover,
body.dark .home-meteo button.home-meteo-mood:focus,
body.dark .home-meteo button.home-meteo-mood:focus-visible,
body.dark .home-meteo button.home-meteo-mood:active,
body.dark .home-meteo button.home-meteo-theme:hover,
body.dark .home-meteo button.home-meteo-theme:focus,
body.dark .home-meteo button.home-meteo-theme:focus-visible,
body.dark .home-meteo button.home-meteo-theme:active {
    background: #2A3C48;
    border-color: #4A7AA0;
    color: #F4F3EE;
}
body.dark .home-meteo button.home-meteo-mood.is-on,
body.dark .home-meteo button.home-meteo-mood.is-on:hover,
body.dark .home-meteo button.home-meteo-theme.is-on,
body.dark .home-meteo button.home-meteo-theme.is-on:hover {
    background: #2669B2;
    border-color: #2669B2;
    color: #fff;
}
body.dark .home-meteo button.home-meteo-urgent {
    background: #12181A;
    border-color: #EA4F70;
    color: #F08AA0;
}
body.dark .home-meteo button.home-meteo-urgent.is-on,
body.dark .home-meteo button.home-meteo-urgent.is-on:hover {
    background: #EA4F70;
    color: #fff;
}
body.dark .home-meteo-dt select {
    background: #1B2225;
    border-color: #2A3338;
    color: #F4F3EE;
}
body.dark .home-meteo button.home-meteo-share-toggle {
    background: transparent;
    color: #7AB0D9;
}

/* ══ SECTION HELPERS ══ */
.home-section-header {
    display: flex; justify-content: space-between; align-items: flex-end;
    margin-bottom: 36px;
}
.home-section-eyebrow {
    font-size: 11px; font-weight: 700;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--b5); margin-bottom: 6px;
}
.home-section-title {
    font-family: var(--global-heading-font-family);
    font-size: 28px; font-weight: 700;
    color: var(--b1); letter-spacing: -.3px;
}
.home-section-title--with-icon {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.home-section-title-icon {
    font-size: 26px;
}
.home-section-title-icon svg,
.home-section-title-icon--emoji svg {
    display: none !important;
}
.home-see-all {
    font-size: 13px; font-weight: 600;
    color: var(--b4);
    display: inline-flex; align-items: center; gap: 5px;
    padding: 8px 16px;
    border: 1.5px solid var(--border); border-radius: 30px;
    transition: all .2s; white-space: nowrap;
    line-height: 1;
}
.home-see-all:hover {
    background: var(--b3); color: white; border-color: var(--b3);
}
/* ── Filtre catégories actualités ── */
.home-cat-pills{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;max-width:100%}
.home-cat-pill{padding:3px 10px;border-radius:20px;border:1px solid var(--border,#C8DAF0);background:transparent;font-size:10px;font-weight:600;color:var(--mid,#4A5568);cursor:pointer;transition:all .18s;font-family:var(--global-body-font-family);line-height:1.5;white-space:nowrap}
.home-cat-pill:hover{background:var(--b1,#212E81);color:#fff;border-color:var(--b1,#212E81)}
.home-cat-pill.active{background:var(--b3,#0F3F93);color:#fff;border-color:var(--b3,#0F3F93)}
/* ══════════════════════════════════════════
   SECTION ÉDITORIALE — dernières actualités
   Featured (gauche) + grille 2×2 image-cards (droite)
══════════════════════════════════════════ */
.home-editorial {
    padding: 64px 48px;
    background: var(--surface);
}
.home-editorial-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 20px;
    align-items: stretch;
}

/* ── Featured gauche ── */
.home-featured {
    position: relative;
    border-radius: var(--r-lg);
    overflow: hidden;
    min-height: 500px;
    display: flex; flex-direction: column; justify-content: flex-end;
    background: var(--b1);
    cursor: pointer;
    text-decoration: none;
    /* Effet "zoom + reveal" sur l'image au hover */
}
.home-featured-img {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    z-index: 0;
    transition: transform .55s cubic-bezier(.25,.46,.45,.94);
}
.home-featured:hover .home-featured-img { transform: scale(1.04); }

/* Barre colorée gauche — comme les ressources */
.home-featured::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 4px; z-index: 3;
    background: var(--teal);
    transform: scaleY(0); transform-origin: bottom;
    transition: transform .4s cubic-bezier(.25,.46,.45,.94);
}
.home-featured:hover::before { transform: scaleY(1); }

.home-featured-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(12,21,41,.05) 0%,
        rgba(12,21,41,.3) 35%,
        rgba(12,21,41,.88) 100%
    );
    z-index: 1;
    transition: opacity .3s;
}
.home-featured:hover .home-featured-overlay { opacity: .9; }
.home-featured-body {
    position: relative; z-index: 2;
    padding: 28px;
}
.home-featured-cat {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 10px; font-weight: 700;
    letter-spacing: 2px; text-transform: uppercase;
    color: var(--teal);
    background: rgba(32,178,158,.18);
    border: 1px solid rgba(32,178,158,.35);
    padding: 4px 10px; border-radius: 20px;
    margin-bottom: 12px;
    line-height: 1;
    height: 26px;
    box-sizing: border-box;
    transition: background .25s, color .25s;
}
.home-featured-pills {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
    margin-bottom: 12px;
}
.home-featured-pills .home-featured-cat {
    margin-bottom: 0;
}
.home-featured-pills .cftc-actu-scope {
    margin: 0 !important;
    height: 26px !important;
    min-height: 26px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    line-height: 1 !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 20px !important;
    box-sizing: border-box !important;
    gap: 5px !important;
}
.home-featured-pills .cftc-actu-scope-ico {
    font-size: 11px !important;
    line-height: 1 !important;
}
.home-featured:hover .home-featured-cat {
    background: var(--teal); color: var(--b1);
}
.home-featured-title {
    font-family: var(--global-heading-font-family);
    font-size: 22px; font-weight: 700;
    color: white; line-height: 1.2; margin-bottom: 10px;
    transition: transform .3s;
}
.home-featured:hover .home-featured-title { transform: translateY(-2px); }
.home-featured-excerpt {
    font-size: 13px; color: rgba(255,255,255,.6);
    line-height: 1.55; margin-bottom: 18px;
}
.home-featured-footer {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.12);
}
.home-featured-date { font-size: 11px; color: rgba(255,255,255,.4); }
.home-featured-cta {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 12px; font-weight: 700; color: white;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    padding: 8px 16px; border-radius: 30px;
    transition: background .2s, color .2s, transform .2s;
}
.home-featured:hover .home-featured-cta {
    background: var(--surface); color: var(--b2); transform: translateX(3px);
}

/* ── Grille 2×2 droite — image-cards avec hover style ressources ── */
.home-news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 14px;
}
.home-news-card {
    position: relative;
    border-radius: var(--r-lg);
    overflow: hidden;
    min-height: 220px;
    box-shadow: 0 6px 24px rgba(12,21,41,.22);
    display: flex; flex-direction: column; justify-content: flex-end;
    text-decoration: none;
    cursor: pointer;
    /* Même mécanique barre + zoom que les ressources */
}
/* Image de fond — zoom au hover */
.home-news-card-img {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    z-index: 0;
    transition: transform .5s cubic-bezier(.25,.46,.45,.94);
}
.home-news-card:hover .home-news-card-img { transform: scale(1.07); }

/* Overlay dégradé */
.home-news-card-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom,
        rgba(12,21,41,.1) 0%,
        rgba(12,21,41,.75) 100%
    );
    z-index: 1;
    transition: opacity .3s;
}
.home-news-card:hover .home-news-card-overlay { opacity: .95; }

/* Barre colorée en bas — scale depuis la gauche, comme ressources */
.home-news-card::before {
    content: '';
    position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px; z-index: 3;
    background: var(--card-accent, var(--teal));
    transform: scaleX(0); transform-origin: left;
    transition: transform .35s cubic-bezier(.25,.46,.45,.94);
}
.home-news-card:hover::before { transform: scaleX(1); }

.home-news-card-body {
    position: relative; z-index: 2;
    padding: 16px;
}
.home-news-card-cat {
    display: inline-flex; align-items: center;
    font-size: 9px; font-weight: 700;
    letter-spacing: 1.5px; text-transform: uppercase;
    color: white;
    background: var(--card-accent, var(--teal));
    padding: 0 8px; border-radius: 20px;
    margin-bottom: 7px;
    line-height: 1;
    height: 22px;
    box-sizing: border-box;
    border: 1px solid transparent;
    transform: translateY(0); transition: transform .25s;
}
.home-news-card-pills {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    margin-bottom: 7px;
}
.home-news-card-pills .home-news-card-cat {
    margin-bottom: 0;
}
.home-news-card-pills .cftc-actu-scope {
    margin: 0 !important;
    height: 22px !important;
    min-height: 22px !important;
    padding: 0 8px !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    line-height: 1 !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 20px !important;
    box-sizing: border-box !important;
    gap: 4px !important;
}
.home-news-card-pills .cftc-actu-scope-ico {
    font-size: 10px !important;
    line-height: 1 !important;
}
.home-news-card:hover .home-news-card-cat { transform: translateY(-2px); }
.home-news-card-title {
    font-family: var(--global-heading-font-family);
    font-size: 13px; font-weight: 700;
    color: white; line-height: 1.3;
    margin-bottom: 6px;
    transition: transform .3s;
}
.home-news-card:hover .home-news-card-title { transform: translateY(-2px); }
.home-news-card-date {
    font-size: 10px; color: rgba(255,255,255,.45);
    transition: color .2s;
}
.home-news-card:hover .home-news-card-date { color: rgba(255,255,255,.7); }

/* ══ SECTION AGENDA — chips colorées ══ */
.home-agenda {
    background: linear-gradient(180deg, rgba(15, 63, 147, 0.045) 0%, rgba(32, 178, 158, 0.06) 55%, rgba(247, 248, 250, 0.65) 100%);
    padding: 22px 48px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    max-width: 100%;
    box-sizing: border-box;
    overflow: visible;
}
.home-agenda-inner {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: nowrap;
    overflow: visible;
    padding: 0;
    min-height: 42px;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.home-agenda-eyebrow {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--b4);
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    line-height: 1;
    height: 42px;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.home-agenda-eyebrow::after {
    content: '';
    display: block;
    width: 1px;
    height: 18px;
    background: var(--border);
    flex-shrink: 0;
}
.home-agenda-chips {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: nowrap;
    height: 42px;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    touch-action: pan-x;
}
.home-agenda-chips::-webkit-scrollbar { display: none; }
.home-agenda-chips.is-dragging {
    cursor: grabbing;
    user-select: none;
}
/* Chip individuelle — hover inspiré ressources */
.home-agenda-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 8px 0 14px;
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    border-radius: var(--r-lg);
    background: var(--surface);
    border: 1.5px solid var(--border);
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    line-height: 1;
    box-sizing: border-box;
    flex: 0 0 auto;
    max-width: min(340px, 70vw);
    transition: border-color .25s, box-shadow .25s, transform .25s;
}
/* Trait coloré gauche — scale depuis le bas comme les ressources */
.home-agenda-chip::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--chip-color, var(--b5));
    transform: scaleY(0); transform-origin: bottom;
    transition: transform .3s cubic-bezier(.25,.46,.45,.94);
}
.home-agenda-chip:hover {
    border-color: var(--chip-color, var(--b5));
    box-shadow: 0 6px 18px rgba(0,0,0,.1);
}
.home-agenda-chip:hover::before { transform: scaleY(1); }
.home-agenda-chip-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--chip-color, var(--b5));
    flex-shrink: 0;
    display: block;
    margin: 0;
    align-self: center;
    transition: transform .25s;
}
.home-agenda-chip:hover .home-agenda-chip-dot {
    transform: scale(1.2);
}
.home-agenda-chip-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--b1);
    line-height: 1.2;
    display: block;
    align-self: center;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .2s;
}
.home-agenda-chip:hover .home-agenda-chip-label {
    color: var(--chip-color, var(--b5));
}
.home-agenda-chip-date {
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: var(--chip-color, var(--b5));
    padding: 0 11px;
    height: 26px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    flex: 0 0 auto;
    position: relative;
    z-index: 1;
    margin: 0 0 0 2px;
    align-self: center;
    white-space: nowrap;
    transition: transform .2s;
}
.home-agenda-chip:hover .home-agenda-chip-date { transform: translateX(2px); }
.home-agenda-all {
    flex-shrink: 0;
    margin-left: 0;
    font-size: 12px;
    font-weight: 800;
    color: var(--b1, #212E81);
    background: var(--yellow, #FBBB1D);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 42px;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 30px;
    border: 1.5px solid color-mix(in srgb, var(--yellow, #FBBB1D) 70%, #c99a2a);
    white-space: nowrap;
    line-height: 1;
    box-sizing: border-box;
    transition: all .2s;
    text-decoration: none;
    align-self: center;
    box-shadow: 0 2px 10px rgba(251, 187, 29, .28);
}
.home-agenda-all:hover {
    background: color-mix(in srgb, var(--yellow, #FBBB1D) 82%, #fff);
    color: var(--b1, #212E81);
    border-color: var(--yellow, #FBBB1D);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(251, 187, 29, .35);
}

/* ══ RESSOURCES ══ */
.home-ressources {
    background: var(--off);
    padding: 56px 48px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
.home-ressources-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px; margin-top: 8px;
}
.home-ressource-card {
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: var(--r-lg);
    padding: 24px 22px;
    display: flex; flex-direction: column;
    cursor: pointer; transition: all .25s;
    position: relative; overflow: hidden;
    text-decoration: none;
}
.home-ressource-card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: var(--card-color, var(--b3));
    transform: scaleX(0); transform-origin: left; transition: transform .3s;
}
.home-ressource-card:hover {
    border-color: var(--card-color, var(--b3));
    box-shadow: var(--sh); transform: translateY(-3px);
}
.home-ressource-card:hover::before { transform: scaleX(1); }
.home-ressource-card:hover .home-ressource-icon {
    background: var(--card-color, var(--b3));
}
.home-ressource-icon {
    width: 48px; height: 48px; border-radius: var(--r);
    background: rgba(15,63,147,.08);
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; margin-bottom: 14px; flex-shrink: 0;
    transition: background .25s, transform .28s cubic-bezier(.25,.46,.45,.94);
}
.home-ressource-title {
    font-family: var(--global-heading-font-family);
    font-size: 15px; font-weight: 700;
    color: var(--b1); line-height: 1.25; margin-bottom: 6px;
}
.home-ressource-desc { font-size: 12px; color: var(--mid); line-height: 1.5; flex: 1; }
.home-ressource-link {
    display: flex; align-items: center; gap: 5px;
    font-size: 12px; font-weight: 700;
    color: var(--card-color, var(--b3)); margin-top: 14px;
}
/* Cartes « réservé adhérents » : fond gris, cadenas à la place de l’icône, titre lisible, CTA bouton */
.home-ressource-card--locked {
    background: #eef0f3;
    border-color: #dde1e7;
    box-shadow: none;
}
.home-ressource-card--locked:hover {
    border-color: #cfd5df;
    box-shadow: 0 6px 20px rgba(15, 63, 147, .08);
    transform: translateY(-2px);
}
.home-ressource-card--locked::before { transform: scaleX(0); opacity: 0; }
.home-ressource-card--locked .home-ressource-icon {
    background: rgba(0, 0, 0, .07);
    color: var(--b1, #212E81);
    opacity: 1;
    font-size: 0;
}
.home-ressource-card--locked .home-ressource-icon::before {
    content: "🔒";
    font-size: 18px;
    line-height: 1;
}
.home-ressource-card--locked:hover .home-ressource-icon {
    background: rgba(0, 0, 0, .1);
}
.home-ressource-card--locked .home-ressource-title {
    color: var(--b1, #212E81);
    opacity: 1;
}
.home-ressource-desc--locked {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--light, #718096);
    flex: 1;
    margin-top: 2px;
}
.home-ressource-link--cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 16px;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--b3, #0F3F93);
    color: #fff !important;
    font-size: 12px;
    font-weight: 800;
    border: none;
    text-decoration: none;
    transition: background .2s, transform .15s;
}
.home-ressource-link--cta:hover {
    background: var(--b1, #212E81);
    color: #fff !important;
}

/* ══════════════════════════════════════
   ZONE UTILE : FAQ + RECHERCHE RESSOURCES
══════════════════════════════════════ */
.home-utility {
    background: var(--off, #F7F8FA);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

/* ── FAQ ── */
.home-faq {
    padding: 56px 48px;
    border-right: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(15, 63, 147, 0.04) 0%, rgba(32, 178, 158, 0.06) 100%);
}
.home-faq-header { margin-bottom: 28px; }
.home-faq-list   { display: flex; flex-direction: column; gap: 6px; }

.home-faq-item {
    border-radius: 12px;
    border: 1px solid transparent;
    transition: border-color .2s, background .2s, box-shadow .2s;
}
.home-faq-item:has(.home-faq-q:hover),
.home-faq-item:has(.home-faq-q[aria-expanded="true"]) {
    background: rgba(255,255,255,.72);
    border-color: var(--border);
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
.home-faq-item:has(.home-faq-q[aria-expanded="true"]) .home-faq-q {
    border-radius: 12px 12px 0 0;
}
.home-faq-q {
    width: 100%;
    display: flex; justify-content: space-between; align-items: center;
    gap: 16px;
    padding: 14px 16px;
    margin: 0;
    background: transparent; border: none; border-radius: 12px; cursor: pointer;
    font-size: 14px; font-weight: 600;
    color: var(--b1); text-align: left;
    line-height: 1.4;
    transition: color .2s, background .2s;
    -webkit-tap-highlight-color: transparent;
}
.home-faq-q:hover {
    color: var(--b3);
    background: rgba(15,63,147,.06);
}
/* Clic souris : le bouton reste :focus sans :focus-visible — éviter fond / halo bleu qui reste */
.home-faq-q:focus:not(:focus-visible) {
    outline: none;
    box-shadow: none;
}
.home-faq-q[aria-expanded="false"]:focus:not(:focus-visible) {
    background: transparent;
    color: var(--b1);
}
.home-faq-q[aria-expanded="false"]:focus:not(:focus-visible) .home-faq-chevron {
    color: var(--mid);
    opacity: .75;
}
.home-faq-q:focus-visible {
    outline: 2px solid var(--b3);
    outline-offset: 2px;
}
.home-faq-q[aria-expanded="true"] {
    color: var(--b3);
    background: rgba(15,63,147,.08);
}
.home-faq-chevron {
    flex-shrink: 0;
    transition: transform .3s cubic-bezier(.25,.46,.45,.94), color .2s, opacity .2s;
    color: var(--mid);
    opacity: .75;
}
.home-faq-q:hover .home-faq-chevron { opacity: 1; color: var(--b3); }
.home-faq-q[aria-expanded="true"] .home-faq-chevron {
    transform: rotate(180deg);
    color: var(--b3);
    opacity: 1;
}
.home-faq-a {
    overflow: hidden;
}
.home-faq-a:not([hidden]) { display: block; }
.home-faq-a-inner {
    margin: 0 8px 12px;
    padding: 20px 20px 22px;
    font-size: 14px;
    line-height: 1.75;
    color: var(--mid);
    border-top: 1px solid rgba(15, 63, 147, 0.1);
    background: rgba(255, 255, 255, 0.72);
    border-radius: 0 0 11px 11px;
    animation: fadeUp .25s ease both;
}
.home-faq-a-inner > *:first-child { margin-top: 0; }
.home-faq-a-inner p { margin: 0 0 14px; }
.home-faq-more-wrap {
	margin: 4px 0 0 !important;
	padding: 0;
}
.home-faq-a-inner a:not(.home-faq-more) {
    color: var(--b3); font-weight: 600; text-decoration: underline;
    text-underline-offset: 2px;
}
.home-faq-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 0;
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--b3) !important;
    background: none;
    border: none;
    border-radius: 0;
    text-decoration: none !important;
    box-shadow: none;
    transition: color .15s, gap .15s;
}
.home-faq-more::after {
    content: '→';
    font-weight: 700;
    transition: transform .15s;
}
.home-faq-more:hover {
    color: var(--b1, #212E81) !important;
    background: none;
    transform: none;
    box-shadow: none;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}
.home-faq-more:hover::after {
    transform: translateX(2px);
}

/* ── Recherche ressources ── */
.home-ressearch {
    padding: 56px 48px;
    display: flex; flex-direction: column; justify-content: center;
}
.home-ressearch-eyebrow {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 10px; font-weight: 800;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--b5); margin-bottom: 10px;
}
.home-ressearch-label {
    font-family: var(--global-heading-font-family);
    font-size: 22px; font-weight: 700;
    color: var(--b1); margin-bottom: 24px;
    line-height: 1.25;
}
.home-ressearch-input-wrap {
    display: flex; align-items: stretch;
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: var(--r-lg, 12px);
    overflow: hidden;
    max-width: 100%;
    box-sizing: border-box;
    transition: border-color .2s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.home-ressearch-form { width: 100%; max-width: 100%; box-sizing: border-box; }
.home-ressearch-input-wrap:focus-within {
    border-color: var(--b3);
    box-shadow: 0 0 0 3px rgba(15,63,147,.08), 0 2px 8px rgba(0,0,0,.06);
}
.home-ressearch-input-wrap input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    border: none; outline: none;
    padding: 14px 12px 14px 16px;
    font-size: 14px; color: var(--b1);
    background: transparent;
    box-sizing: border-box;
}
.home-ressearch-input-wrap input::placeholder { color: var(--mid); }
.home-ressearch-input-wrap button[type="submit"] {
    background: var(--b3);
    color: white;
    border: none; cursor: pointer;
    padding: 14px 22px;
    font-size: 13px; font-weight: 700;
    transition: background .2s;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    align-self: stretch;
    border-radius: 0;
    margin: 0;
    min-height: 100%;
    flex: 0 0 auto;
    box-shadow: none;
}
.home-ressearch-input-wrap button[type="submit"]:hover {
    background: var(--b2);
}
.home-ressearch-tags {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin-top: 16px;
}
.home-ressearch-tag {
    display: inline-flex;
    padding: 6px 14px;
    border: 1.5px solid var(--border);
    border-radius: 30px;
    font-size: 12px; font-weight: 600;
    color: var(--b3);
    background: var(--surface);
    transition: all .2s; text-decoration: none;
}
.home-ressearch-tag:hover {
    background: var(--b3); color: white; border-color: var(--b3);
    transform: translateY(-1px);
}

@media (max-width: 900px) {
    .home-utility { grid-template-columns: 1fr; }
    .home-faq     { padding: 40px 24px; border-right: none; border-bottom: 1px solid var(--border); }
    .home-ressearch { padding: 40px 24px; max-width: 100%; box-sizing: border-box; overflow-x: hidden; }
    .home-ressearch-input-wrap { flex-wrap: wrap; }
    .home-ressearch-input-wrap input[type="search"] {
        flex: 1 1 100%;
        min-width: 0;
        padding: 12px 14px;
    }
    .home-ressearch-input-wrap button[type="submit"] {
        flex: 1 1 100%;
        width: 100%;
        padding: 12px 16px;
        border-radius: 0;
    }
}

/* ══════════════════════════════════════
   BANNIÈRE « REJOIGNEZ-NOUS » — bandeau léger
══════════════════════════════════════ */
.home-join {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #fff 0%, var(--off, #F7F8FA) 100%);
    border-top: 1px solid var(--border);
    padding: 52px 48px 56px;
    text-align: center;
}
.home-join::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 85% 70% at 100% -10%, rgba(15, 63, 147, .09), transparent 55%),
        radial-gradient(ellipse 70% 60% at 0% 110%, rgba(32, 178, 158, .1), transparent 50%);
    pointer-events: none;
    z-index: 0;
}
.home-join-deco {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(240px, 55vw);
    max-width: 100%;
    color: var(--b3);
    opacity: .1;
    pointer-events: none;
    z-index: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.home-join-deco svg { display: none !important; }
.home-join-deco-icon {
    display: block;
    font-size: clamp(64px, 12vw, 96px);
    width: 1em;
    height: 1em;
    margin: 0 auto;
    opacity: .55;
    line-height: 1;
}
.home-join-deco-icon svg { display: none !important; }
.home-join::after {
    content: '';
    position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
    width: min(520px, 80%); height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, transparent, var(--b3), var(--teal, #20B29E), var(--b3), transparent);
    opacity: .35;
    z-index: 1;
}
.home-join-inner {
    position: relative;
    z-index: 2;
    max-width: 560px;
    margin: 0 auto;
}
.home-join-eyebrow {
    display: inline-block;
    font-size: 10px; font-weight: 800;
    letter-spacing: 3px; text-transform: uppercase;
    color: var(--b4);
    margin-bottom: 12px;
}
.home-join-title {
    font-family: var(--global-heading-font-family);
    font-size: clamp(24px, 3.2vw, 34px);
    font-weight: 800;
    color: var(--b1);
    line-height: 1.2;
    letter-spacing: -.02em;
    margin: 0 0 12px;
}
.home-join-sub {
    font-size: 15px;
    color: var(--mid);
    line-height: 1.6;
    margin: 0 0 28px;
}
.home-join-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    align-items: center;
}
.home-join-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--b3);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    padding: 14px 26px;
    border-radius: 999px;
    text-decoration: none;
    border: 1.5px solid var(--b3);
    transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
    box-shadow: 0 4px 14px rgba(15,63,147,.18);
}
.home-join-cta:hover {
    background: var(--b2, #0c2d5c);
    border-color: var(--b2, #0c2d5c);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15,63,147,.22);
}
.home-join-cta svg,
.home-join-secondary svg { display: none; }
.home-join-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--b3);
    text-decoration: none;
    padding: 12px 18px;
    border-radius: 999px;
    border: 1.5px solid rgba(15,63,147,.2);
    background: var(--surface);
    transition: border-color .2s, background .2s, color .2s;
}
.home-join-secondary:hover {
    border-color: var(--b3);
    background: rgba(15,63,147,.04);
    color: var(--b2, #0c2d5c);
}
@media (max-width: 600px) {
    .home-join { padding: 40px 24px 44px; }
    .home-join-actions { flex-direction: column; width: 100%; }
    .home-join-cta, .home-join-secondary { width: 100%; justify-content: center; }
}

/* == BLOC ELECTIONS HERO == */
.home-hero-elections {
    position: relative; z-index: 2;
    width: 290px; flex-shrink: 0;
    margin-right: 340px;
    margin-bottom: 72px;
    overflow: visible;
}
.elec-card {
    background: rgba(12,21,41,var(--elec-opacity, .72));
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px; overflow: hidden;
}
.elec-card-header {
    padding: 11px 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    display: flex; align-items: center; justify-content: space-between;
}
.elec-card-label {
    font-size: 9px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
    color: var(--yellow); display: flex; align-items: center; gap: 6px; line-height: 1;
}
.elec-pulse {
    width: 6px; height: 6px; border-radius: 50%; background: var(--yellow);
    animation: pulse 2s ease infinite; flex-shrink: 0;
}
.elec-nav { display: flex; gap: 4px; }
.elec-nav-btn {
    width: 20px; height: 20px; border-radius: 4px;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.5); font-size: 14px; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all .15s; user-select: none;
}
.elec-nav-btn:hover { background: rgba(255,255,255,.18); color: white; }
.elec-card-body { padding: 14px 16px 12px; }
.elec-scrutin-name {
    font-family: var(--global-heading-font-family);
    font-size: 15px; font-weight: 700;
    color: white; margin-bottom: 3px; line-height: 1.2; text-align: center;
}
.elec-scrutin-date {
    font-size: 10px; color: rgba(255,255,255,.4);
    margin-bottom: 14px; text-align: center;
}
.elec-timer-grid {
    display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; margin-bottom: 12px;
}
.elec-timer-cell {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 6px; padding: 8px 4px 7px;
    text-align: center; display: flex; flex-direction: column;
    align-items: center; justify-content: center;
}
.elec-timer-val {
    font-family: var(--global-heading-font-family);
    font-size: 20px; font-weight: 700;
    color: white; line-height: 1; display: block;
}
.elec-timer-val.is-accent { color: var(--teal); }
.elec-timer-unit {
    font-size: 8px; color: rgba(255,255,255,.35);
    text-transform: uppercase; letter-spacing: 1px;
    margin-top: 3px; display: block;
}
.elec-cta-btn {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    background: rgba(32,178,158,.15); border: 1px solid rgba(32,178,158,.28);
    color: var(--teal); font-size: 11px; font-weight: 700;
    padding: 8px 16px; border-radius: 7px;
    transition: all .2s; text-decoration: none;
    width: 100%; box-sizing: border-box;
}
.elec-cta-btn:hover { background: rgba(32,178,158,.28); color: var(--teal); }
.elec-dots-nav {
    display: flex; justify-content: center; gap: 5px;
    padding: 8px 16px 12px;
}
.elec-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: rgba(255,255,255,.18); transition: all .3s; cursor: pointer;
}
.elec-dot.is-active { background: var(--teal); width: 16px; border-radius: 3px; }

.home-hero-aside-viewport {
    position: relative;
    display: block;
}
.home-hero-aside-slide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .45s ease, visibility .45s ease;
}
.home-hero-aside-slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.home-hero-aside-slide[data-aside="elections"] {
    position: relative;
}
.home-hero-video-layer {
    position: absolute;
    top: 0;
    bottom: 72px;
    right: 340px;
    width: 290px;
    z-index: 4;
    pointer-events: none;
}
.home-hero-video-layer .home-hero-aside-slide[data-aside^="video"] {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    width: 560px;
    max-width: min(560px, calc(100vw - 96px));
    transform: translate(-50%, -50%) scale(.97);
    pointer-events: none;
    transition: opacity .45s ease, visibility .45s ease, transform .45s ease;
}
.home-hero-video-layer .home-hero-aside-slide[data-aside^="video"].is-active {
    transform: translate(-50%, -50%) scale(1);
    pointer-events: auto;
}
.home-hero-aside-tabs {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 8px;
    flex-wrap: wrap;
    position: relative;
    z-index: 4;
    transition: opacity .35s ease, margin-top .45s ease;
}
.home-hero-video-layer .home-hero-aside-tabs {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: calc((560px * 9 / 16 + 52px) / 2 + 14px);
    transform: translateX(-50%);
    width: max-content;
    max-width: 560px;
    pointer-events: auto;
}
.home-hero-aside-tab {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: rgba(255,255,255,.55);
    background: rgba(12,21,41,.55);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: 5px 10px;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
}
.home-hero-aside-tab:hover {
    color: #fff;
    border-color: rgba(255,255,255,.35);
}
.home-hero-aside-tab.is-active {
    color: var(--b2, #0c2d5c);
    background: var(--yellow);
    border-color: var(--yellow);
}
.hero-video-body { padding: 0 0 10px; }
.hero-video-card {
    width: 100%;
    box-sizing: border-box;
}
.hero-video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    overflow: hidden;
}
.hero-video-frame video,
.hero-video-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: contain;
    background: #000;
}
.hero-video-poster {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    cursor: pointer;
    background: #000;
}
.hero-video-poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .88;
    display: block;
}
.hero-video-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 64px;
    height: 64px;
    margin: -32px 0 0 -32px;
    border-radius: 50%;
    background: rgba(15,63,147,.94);
    border: 2px solid rgba(255,255,255,.9);
    box-shadow: 0 4px 16px rgba(0,0,0,.4);
    pointer-events: none;
}
.hero-video-play::after {
    content: '';
    position: absolute;
    left: 24px;
    top: 18px;
    border-style: solid;
    border-width: 13px 0 13px 20px;
    border-color: transparent transparent transparent #fff;
}
.hero-video-poster:hover .hero-video-play {
    background: var(--teal, #20b29e);
    transform: none;
}

/* ══ RESPONSIVE ══ */
@media (max-width: 1429px) {
    .home-hero-elections,
    .home-hero-video-layer,
    #home-hero-aside,
    #home-hero-video-layer {
        display: none !important;
    }
    .home-hero {
        justify-content: flex-start;
    }
}
@media (max-width: 900px) {
    .home-hero             { justify-content: flex-start; }
    .home-hero-content     { padding: 40px 24px 28px; }
    .home-hero-slides      { padding: 40px 24px 28px; max-width: none; }
    .home-hero-carousel-nav { margin-top: 16px; }
    .home-hero-kpis{
        position:relative;
        bottom:auto;left:auto;right:auto;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows:auto;
        margin-top:8px;
    }
    .kpi-item{height:auto;min-height:64px;padding:10px 14px}
    .home-editorial        { padding: 40px 24px; }
    .home-meteo-inner      { padding: 12px 24px; }
    .home-meteo-ask-col    { max-width: 100%; flex-basis: 100%; }
    .home-meteo-pulse      { justify-content: flex-start; }
    .home-meteo-pulse .home-meteo-moods { justify-content: flex-start; }
    .home-meteo-ask        { white-space: normal; }
    .home-editorial-grid   { grid-template-columns: 1fr; }
    .home-featured         { min-height: 320px; }
    .home-news-grid        { grid-template-columns: 1fr 1fr; }
    .home-agenda           { padding: 20px 24px; }
    .home-ressources       { padding: 40px 24px; }
    .home-section-header   { flex-direction: column; align-items: flex-start; gap: 12px; }
    .home-section-header > div { min-width: 0; max-width: 100%; width: 100%; }
    .home-cat-pills {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        overscroll-behavior-x: contain;
        padding-bottom: 6px;
        margin-right: -8px;
    }
    .home-cat-pills::-webkit-scrollbar { display: none; }
    .home-cat-pill { flex-shrink: 0; }
    .home-featured-pills,
    .home-news-card-pills {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        max-width: 100%;
    }
    .home-featured-pills::-webkit-scrollbar,
    .home-news-card-pills::-webkit-scrollbar { display: none; }
    .home-featured-pills > *,
    .home-news-card-pills > * { flex-shrink: 0; }
}
@media (max-width: 600px) {
    .home-news-grid { grid-template-columns: 1fr; }
    .home-news-card { min-height: 180px; }
    .home-hero-sub{font-size:15px;line-height:1.55;margin-bottom:18px}
    .home-hero-actions{width:100%;gap:8px}
    .home-hero-btn-primary,.home-hero-btn-secondary{width:100%;justify-content:center;padding:12px 16px}
    .home-hero-carousel-nav{margin-top:12px}
    .home-hero-kpis{grid-template-columns:1fr}
    .home-agenda{
        padding: 16px;
        overflow-x: hidden;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }
    .home-agenda-inner{
        overflow: visible;
        flex-wrap: wrap;
        gap:10px;
        min-height:0;
        align-items:center;
        max-width:100%;
        width:100%;
        min-width:0;
        box-sizing:border-box;
    }
    .home-agenda-eyebrow{
        width:100%;
        max-width:100%;
        height:auto;
        min-height:0;
        box-sizing:border-box;
    }
    .home-agenda-eyebrow::after{display:none}
    .home-agenda-chips{
        width:100%;
        max-width:100%;
        min-width:0;
        flex:1 1 100%;
        flex-direction:column;
        align-items:stretch;
        gap:8px;
        height:auto;
        overflow:visible;
        cursor:default;
        box-sizing:border-box;
    }
    .home-agenda-chip{
        width:100%;
        max-width:100%;
        min-width:0;
        box-sizing:border-box;
        white-space:normal;
        justify-content:flex-start;
        align-items:center;
        gap:8px;
        height:auto;
        min-height:44px;
        max-height:none;
        padding:10px 10px 10px 12px;
        overflow:hidden;
        display:grid;
        grid-template-columns:8px minmax(0,1fr) auto;
    }
    .home-agenda-chip-dot{grid-column:1}
    .home-agenda-chip-label{
        grid-column:2;
        flex:unset;
        min-width:0;
        max-width:100%;
        line-height:1.25;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .home-agenda-chip-date{
        grid-column:3;
        margin-left:0;
        flex-shrink:0;
        align-self:center;
    }
    .home-agenda-all{
        margin-left:0;
        width:100%;
        max-width:100%;
        justify-content:center;
        box-sizing:border-box;
    }
}

/* Mode sombre page d’accueil : voir assets/css/cftc-dark-mode.css (bloc « Front page ») */