/* =====================================================
   ARBORIA MUNDI — site public
   Éditorial et calme : papier, forêt, typographie à empattements. Clair par défaut, sombre en option.
   ===================================================== */
:root {
    --fond: #f7f5ef;
    --fond-2: #efebe1;
    --carte: #ffffff;
    --bord: #e3ddcf;
    --texte: #1d2721;
    --doux: #66706a;
    --accent: #2f6b4f;
    --accent-2: #24563f;
    --foret: #1d3528;
    --ombre: 0 1px 2px rgba(29, 39, 33, .05), 0 8px 28px rgba(29, 39, 33, .07);
    --serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif;
    --sans: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --age-c1000: #7d1d3f; --age-c500: #b83227; --age-c300: #d26a1b; --age-c100: #a98510; --age-jeune: #5f8f49; --age-inconnu: #7d8a84;
    --large: 1180px;
    color-scheme: light;
}
:root[data-theme="dark"] {
    --fond: #0f1411; --fond-2: #151c17; --carte: #19221d; --bord: #2a372f; --texte: #e4ebe5; --doux: #97a59b;
    --accent: #7cc49a; --accent-2: #66b085; --foret: #0b100d; --ombre: 0 1px 2px rgba(0, 0, 0, .4);
    --age-c1000: #e47fa2; --age-c500: #f0897c; --age-c300: #f0a868; --age-c100: #e3c25a; --age-jeune: #9ccf84;
    color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --fond: #0f1411; --fond-2: #151c17; --carte: #19221d; --bord: #2a372f; --texte: #e4ebe5; --doux: #97a59b;
        --accent: #7cc49a; --accent-2: #66b085; --foret: #0b100d; --ombre: 0 1px 2px rgba(0, 0, 0, .4);
        --age-c1000: #e47fa2; --age-c500: #f0897c; --age-c300: #f0a868; --age-c100: #e3c25a; --age-jeune: #9ccf84;
        color-scheme: dark;
    }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 17px/1.65 var(--sans); }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.12; letter-spacing: -.01em; margin: 0 0 .5em; }
p { margin: 0 0 1em; }
a { color: var(--accent); text-underline-offset: 3px; }
img { max-width: 100%; display: block; }
.lien-evitement { position: absolute; left: -999px; }
.lien-evitement:focus { left: 16px; top: 16px; z-index: 100; background: var(--carte); padding: 8px 12px; }
.int { max-width: var(--large); margin: 0 auto; padding: 0 24px; }

/* ----- en-tête ----- */
.entete { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--fond) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--bord); }
.entete__int { max-width: var(--large); margin: 0 auto; padding: 0 24px; height: 64px; display: flex; align-items: center; gap: 24px; }
.marque { display: flex; align-items: center; gap: 10px; color: var(--texte); text-decoration: none; font-family: var(--serif); font-size: 1.3rem; font-weight: 600; }
.marque svg { width: 28px; height: 28px; color: var(--accent); }
.nav { display: flex; gap: 4px; margin-left: auto; }
.nav a { color: var(--texte); text-decoration: none; padding: 8px 14px; border-radius: 999px; font-size: .95rem; }
.nav a:hover { background: var(--fond-2); }
.nav a[aria-current] { background: var(--foret); color: #fff; }
.theme { border: 1px solid var(--bord); background: var(--carte); color: var(--texte); width: 38px; height: 38px; border-radius: 50%; cursor: pointer; font-size: 1rem; }

/* ----- boutons ----- */
.bouton { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 22px; border-radius: 999px; background: var(--accent); color: #fff; text-decoration: none; font-weight: 600; border: 1px solid var(--accent); cursor: pointer; font: inherit; font-weight: 600; }
.bouton:hover { background: var(--accent-2); }
.bouton--clair { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); color: #fff; backdrop-filter: blur(4px); }
.bouton--clair:hover { background: rgba(255, 255, 255, .24); }
.bouton--contour { background: transparent; color: var(--texte); border-color: var(--bord); }
.bouton--contour:hover { border-color: var(--accent); color: var(--accent); background: transparent; }

/* ----- accueil ----- */
.une { position: relative; min-height: min(78vh, 720px); display: flex; align-items: flex-end; color: #fff; background: var(--foret) center/cover no-repeat; }
.une::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 20, 14, .15) 0%, rgba(10, 20, 14, .35) 45%, rgba(10, 20, 14, .82) 100%); }
.une__int { position: relative; z-index: 1; max-width: var(--large); margin: 0 auto; padding: 0 24px 72px; width: 100%; }
.une__sur { text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; opacity: .85; margin-bottom: 14px; }
.une h1 { font-size: clamp(2.4rem, 6vw, 4.6rem); max-width: 14ch; margin-bottom: 18px; color: #fff; }
.une__texte { font-size: 1.2rem; max-width: 52ch; opacity: .92; margin-bottom: 28px; }
.une__boutons { display: flex; flex-wrap: wrap; gap: 12px; }
.une__credit { position: absolute; right: 16px; bottom: 12px; z-index: 1; font-size: .75rem; opacity: .7; color: #fff; }
.chiffres { max-width: var(--large); margin: -1px auto 0; padding: 36px 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 24px; }
.chiffre b { display: block; font-family: var(--serif); font-size: 2.6rem; line-height: 1; color: var(--accent); }
.chiffre span { color: var(--doux); }
.section { padding: 72px 0; }
.section--alt { background: var(--fond-2); }
.section__entete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 28px; }
.section__entete h2 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); margin: 0; }
.section__entete p { color: var(--doux); margin: 6px 0 0; max-width: 60ch; }

/* cartes d'arbres */
.grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 22px; }
.arbre-carte { display: flex; flex-direction: column; background: var(--carte); border: 1px solid var(--bord); border-radius: 18px; overflow: hidden; color: var(--texte); text-decoration: none; box-shadow: var(--ombre); transition: transform .2s, box-shadow .2s; }
.arbre-carte:hover { transform: translateY(-3px); box-shadow: 0 12px 34px rgba(29, 39, 33, .14); }
.arbre-carte__image { aspect-ratio: 4 / 3; background: var(--fond-2) center/cover no-repeat; position: relative; display: grid; place-items: center; }
.arbre-carte__image svg { width: 56px; height: 56px; color: var(--bord); }
.arbre-carte__age { position: absolute; left: 12px; bottom: 12px; background: rgba(255, 255, 255, .94); color: #1d2721; border-radius: 999px; padding: 4px 12px; font-family: var(--serif); font-weight: 600; font-size: .95rem; }
.arbre-carte__corps { padding: 16px 18px 20px; }
.arbre-carte h3 { font-size: 1.3rem; margin-bottom: 4px; }
.arbre-carte__lieu { color: var(--doux); font-size: .92rem; }
.arbre-carte__resume { font-size: .95rem; margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.principes { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; }
.principe h3 { font-size: 1.3rem; }
.principe p { color: var(--doux); }
.principe__icone { font-size: 1.8rem; margin-bottom: 10px; }
.carte-accueil { height: 460px; border-radius: 20px; overflow: hidden; border: 1px solid var(--bord); box-shadow: var(--ombre); }

/* ----- liste ----- */
.page-entete { padding: 56px 0 24px; }
.page-entete h1 { font-size: clamp(2.2rem, 5vw, 3.4rem); }
.page-entete p { color: var(--doux); font-size: 1.12rem; max-width: 62ch; }
.filtres { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 28px; }
.filtres input, .filtres select { height: 46px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--bord); background: var(--carte); color: var(--texte); font: inherit; font-size: .95rem; }
.filtres input { flex: 1 1 260px; }
.puces { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.puce { padding: 7px 16px; border-radius: 999px; border: 1px solid var(--bord); color: var(--texte); text-decoration: none; font-size: .92rem; background: var(--carte); }
.puce:hover { border-color: var(--accent); color: var(--accent); }
.puce[aria-current] { background: var(--foret); border-color: var(--foret); color: #fff; }
.pagination { display: flex; justify-content: center; gap: 6px; margin: 40px 0 0; flex-wrap: wrap; }
.pagination a, .pagination span { min-width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--bord); color: var(--texte); text-decoration: none; background: var(--carte); }
.pagination span { background: var(--foret); color: #fff; border-color: var(--foret); }
.vide { text-align: center; padding: 72px 20px; color: var(--doux); }
.vide b { display: block; font-family: var(--serif); font-size: 1.6rem; color: var(--texte); margin-bottom: 8px; }

/* ----- fiche d'un arbre ----- */
.fiche-une { position: relative; min-height: 62vh; display: flex; align-items: flex-end; color: #fff; background: var(--foret) center/cover no-repeat; }
.fiche-une::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 20, 14, 0) 35%, rgba(10, 20, 14, .8) 100%); }
.fiche-une--sans { min-height: 40vh; background: radial-gradient(circle at 75% 30%, #2f6b4f, var(--foret) 70%); }
.fiche-une__int { position: relative; z-index: 1; max-width: var(--large); margin: 0 auto; padding: 0 24px 48px; width: 100%; }
.fiche-une__age { font-family: var(--serif); font-size: 1.25rem; opacity: .9; }
.fiche-une h1 { font-size: clamp(2.3rem, 5.5vw, 4.2rem); color: #fff; margin: 6px 0 10px; max-width: 18ch; }
.fiche-une__sous { font-size: 1.2rem; opacity: .92; max-width: 50ch; }
.fiche-une__lieu { opacity: .85; margin-top: 10px; }
.fiche-corps { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); gap: 56px; padding: 56px 0 72px; }
.texte { font-size: 1.12rem; line-height: 1.8; max-width: 68ch; }
.texte h2 { font-size: 1.6rem; margin-top: 2em; }
.chapeau { font-family: var(--serif); font-size: 1.45rem; line-height: 1.55; }
.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin-top: 32px; }
.galerie figure { margin: 0; }
.galerie img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; }
.galerie figcaption { font-size: .8rem; color: var(--doux); margin-top: 4px; }
.encart { background: var(--carte); border: 1px solid var(--bord); border-radius: 18px; padding: 22px; box-shadow: var(--ombre); position: sticky; top: 88px; }
.encart dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 16px; margin: 0 0 18px; }
.encart dt { color: var(--doux); font-size: .9rem; }
.encart dd { margin: 0; font-weight: 500; }
.encart h3 { font-size: 1.1rem; margin: 20px 0 8px; }
.encart ul { margin: 0; padding-left: 18px; font-size: .9rem; color: var(--doux); }
.encart__carte { height: 230px; border-radius: 12px; overflow: hidden; margin: 6px 0 12px; border: 1px solid var(--bord); }
.encart .bouton { width: 100%; justify-content: center; height: 44px; }
.note-prive { background: var(--fond-2); border-radius: 12px; padding: 12px 14px; font-size: .9rem; color: var(--doux); margin-bottom: 12px; }
.partage { display: flex; gap: 8px; margin-top: 12px; }
.partage button, .partage a { flex: 1; height: 40px; border-radius: 999px; border: 1px solid var(--bord); background: transparent; color: var(--texte); font: inherit; font-size: .88rem; cursor: pointer; display: grid; place-items: center; text-decoration: none; }
.signaler { font-size: .85rem; color: var(--doux); margin-top: 14px; }

/* ----- carte plein écran ----- */
.page-carte main { display: flex; flex-direction: column; }
.carte-plein { height: calc(100vh - 64px); position: relative; }
.carte-plein__panneau { position: absolute; z-index: 500; left: 16px; top: 16px; background: var(--carte); border: 1px solid var(--bord); border-radius: 16px; padding: 14px 18px; box-shadow: var(--ombre); max-width: 300px; }
.carte-plein__panneau h1 { font-size: 1.4rem; margin-bottom: 4px; }
.carte-plein__panneau p { color: var(--doux); font-size: .9rem; margin: 0 0 8px; }
.legende { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .8rem; color: var(--doux); }
.legende i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; }
.popup { font: 14px/1.45 var(--sans); }
.popup strong { display: block; font-family: var(--serif); font-size: 1.05rem; }
.leaflet-container { font: inherit; background: var(--fond-2); }

/* ----- pages de texte ----- */
.prose { max-width: 72ch; font-size: 1.1rem; line-height: 1.8; padding-bottom: 72px; }
.prose h2 { font-size: 1.7rem; margin-top: 1.8em; }
.prose li { margin-bottom: .5em; }
.sources-liste { list-style: none; padding: 0; }
.sources-liste li { padding: 12px 0; border-bottom: 1px solid var(--bord); }
.sources-liste small { display: block; color: var(--doux); }

/* ----- pied ----- */
.pied { background: var(--foret); color: #cfdcd3; padding: 56px 0 24px; margin-top: auto; }
.pied__int { max-width: var(--large); margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; }
.pied__marque { font-family: var(--serif); font-size: 1.4rem; color: #fff; margin-bottom: 8px; }
.pied nav { display: flex; flex-direction: column; gap: 8px; }
.pied a { color: #cfdcd3; text-decoration: none; }
.pied a:hover { color: #fff; }
.pied__note { max-width: var(--large); margin: 36px auto 0; padding: 18px 24px 0; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .8rem; opacity: .7; }
.page-carte .pied { display: none; }

@media (max-width: 860px) {
    body { font-size: 16px; }
    /* backdrop-filter rendrait l'en-tête « bloc conteneur » de la barre fixe : elle resterait en haut */
    .entete { backdrop-filter: none; background: var(--fond); }
    .entete__int { gap: 12px; padding: 0 16px; }
    .nav { position: fixed; bottom: 0; left: 0; right: 0; justify-content: space-around; background: var(--carte); border-top: 1px solid var(--bord); padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); margin: 0; z-index: 60; }
    .nav a { font-size: .85rem; padding: 8px 10px; }
    .theme { margin-left: auto; }
    body { padding-bottom: 60px; }
    .int, .une__int, .fiche-une__int { padding-left: 16px; padding-right: 16px; }
    .fiche-corps { grid-template-columns: 1fr; gap: 32px; }
    .encart { position: static; }
    .pied__int { grid-template-columns: 1fr; }
    .carte-plein { height: calc(100vh - 64px - 60px); }
    .carte-plein__panneau { right: 16px; max-width: none; }
    .section { padding: 48px 0; }
}

/* ----- arbre du mois ----- */
.du-mois-section { padding-bottom: 0; }
.du-mois { display: grid; grid-template-columns: 1.1fr 1fr; border-radius: 22px; overflow: hidden; background: var(--carte); border: 1px solid var(--bord); box-shadow: var(--ombre); text-decoration: none; color: var(--texte); }
.du-mois__photo { min-height: 340px; background: var(--foret) center / cover no-repeat; }
.du-mois__texte { padding: 36px 40px; display: flex; flex-direction: column; justify-content: center; }
.du-mois__sur { text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; color: var(--accent); font-weight: 700; margin: 0 0 8px; }
.du-mois h2 { font-size: 2.1rem; margin: 0 0 6px; }
.du-mois__lieu { color: var(--doux); margin: 0 0 14px; }
.du-mois__lien { color: var(--accent); font-weight: 600; margin-top: 6px; }
.du-mois:hover .du-mois__lien { text-decoration: underline; }

/* ----- régions, espèces ----- */
.page-entete__liens { font-size: .95rem; }
.fil { font-size: .9rem; color: var(--doux); padding-top: 28px; }
.fil a { color: var(--doux); }
.h1-sci { font-size: .6em; font-weight: 400; color: var(--doux); }
.puce small { color: var(--doux); margin-left: 4px; }
.puce[aria-current] small { color: inherit; opacity: .8; }
.carte-groupe { height: 380px; border-radius: 18px; overflow: hidden; border: 1px solid var(--bord); margin: 8px 0 32px; position: relative; }
.index-groupes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.index-groupe { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border-radius: 14px; background: var(--carte); border: 1px solid var(--bord); text-decoration: none; color: var(--texte); transition: border-color .15s, transform .15s; }
.index-groupe:hover { border-color: var(--accent); transform: translateY(-1px); }
.index-groupe__nom { font-family: var(--serif); font-size: 1.2rem; }
.index-groupe__nom em { font-family: inherit; color: var(--doux); font-size: .85em; margin-left: 4px; }
.index-groupe__n { color: var(--doux); font-size: .9rem; }

/* ----- autour de moi ----- */
.bouton--petit { height: 38px; padding: 0 16px; font-size: .92rem; }
.carte-plein__panneau .bouton--petit { margin-top: 6px; }
.autour { margin-top: 12px; max-height: 46vh; overflow: auto; border-top: 1px solid var(--bord); }
.autour a { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--bord); text-decoration: none; color: var(--texte); font-size: .92rem; }
.autour a b { font-weight: 600; }
.autour a small { color: var(--doux); white-space: nowrap; }
.autour p { font-size: .88rem; color: var(--doux); margin: 10px 0 0; }

/* ----- formulaire de signalement ----- */
.formulaire { max-width: 760px; display: flex; flex-direction: column; gap: 22px; }
.formulaire fieldset { border: 1px solid var(--bord); border-radius: 18px; padding: 20px 22px; margin: 0; background: var(--carte); display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.formulaire legend { font-family: var(--serif); font-size: 1.25rem; padding: 0 8px; }
.formulaire label { display: flex; flex-direction: column; gap: 6px; font-size: .95rem; font-weight: 600; }
.formulaire input[type=text], .formulaire input[type=email], .formulaire textarea { font: inherit; font-weight: 400; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--bord); background: var(--fond); color: var(--texte); }
.formulaire textarea { resize: vertical; min-height: 140px; }
.formulaire input:focus, .formulaire textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.formulaire .case { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 400; }
.formulaire .case input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--accent); flex: none; }
.formulaire .bouton { align-self: flex-start; }
.champs-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.choix { display: flex; flex-wrap: wrap; gap: 8px; }
.formulaire .choix__item { flex-direction: row; font-weight: 500; position: relative; }
.choix__item input { position: absolute; opacity: 0; pointer-events: none; }
.choix__item span { padding: 9px 16px; border-radius: 999px; border: 1px solid var(--bord); background: var(--fond); cursor: pointer; }
.choix__item input:checked + span { background: var(--foret); border-color: var(--foret); color: #fff; }
.choix__item input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.aide { color: var(--doux); font-size: .88rem; margin: 0; font-weight: 400; }
.formulaire__carte { height: 300px; border-radius: 14px; overflow: hidden; border: 1px solid var(--bord); position: relative; cursor: crosshair; }
.formulaire__position { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.fichiers input { font-weight: 400; }
.apercus { display: flex; gap: 10px; flex-wrap: wrap; }
.apercus img { width: 96px; height: 96px; object-fit: cover; border-radius: 10px; border: 1px solid var(--bord); }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.alerte { background: #fbeae7; color: #7a2418; border: 1px solid #efc2b9; border-radius: 14px; padding: 14px 18px; margin-bottom: 22px; max-width: 760px; }
.alerte ul { margin: 6px 0 0; padding-left: 20px; }
:root[data-theme="dark"] .alerte { background: #3a1d18; color: #f3c7bd; border-color: #5c2c24; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .alerte { background: #3a1d18; color: #f3c7bd; border-color: #5c2c24; } }

@media (max-width: 860px) {
    .du-mois { grid-template-columns: 1fr; }
    .du-mois__photo { min-height: 240px; }
    .du-mois__texte { padding: 24px 22px; }
    .du-mois h2 { font-size: 1.7rem; }
    .champs-2 { grid-template-columns: 1fr; }
    .formulaire fieldset { padding: 16px; }
    .carte-groupe { height: 300px; }
}
.du-mois--sans { grid-template-columns: 1fr; } .du-mois--sans .du-mois__photo { display: none; }

/* ----- vidéos d'une fiche ----- */
.videos { display: grid; gap: 18px; margin: 12px 0 8px; }
.video { margin: 0; }
.video video, .video iframe, .video__lancer { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 14px; display: block; background: #000; }
.video__lancer { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: var(--foret); color: #fff; cursor: pointer; font: inherit; font-weight: 600; }
.video__lancer small { font-weight: 400; opacity: .75; }
.video__icone { width: 64px; height: 64px; border-radius: 50%; background: rgba(255, 255, 255, .16); display: grid; place-items: center; font-size: 1.6rem; padding-left: 4px; }
.video__lancer:hover .video__icone { background: rgba(255, 255, 255, .28); }
.video figcaption { color: var(--doux); font-size: .92rem; margin-top: 6px; }

/* =====================================================
   FINITIONS 2.0 — aspect premium, fluidité, gestes naturels
   (couche chargée en dernier : affine tout ce qui précède)
   ===================================================== */
:root {
    --ease: cubic-bezier(.2, .7, .2, 1);
    --rayon: 20px;
    --ombre: 0 1px 1px rgba(29, 39, 33, .04), 0 2px 6px rgba(29, 39, 33, .04), 0 12px 32px -8px rgba(29, 39, 33, .12);
    --ombre-haute: 0 2px 4px rgba(29, 39, 33, .05), 0 24px 56px -12px rgba(29, 39, 33, .28);
    --anneau: 0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent);
    --verre: color-mix(in srgb, var(--fond) 78%, transparent);
}
:root[data-theme="dark"] { --ombre: 0 1px 2px rgba(0, 0, 0, .5), 0 12px 32px -10px rgba(0, 0, 0, .6); --ombre-haute: 0 24px 60px -12px rgba(0, 0, 0, .75); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ombre: 0 1px 2px rgba(0, 0, 0, .5), 0 12px 32px -10px rgba(0, 0, 0, .6); --ombre-haute: 0 24px 60px -12px rgba(0, 0, 0, .75); } }

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .28s; animation-timing-function: var(--ease); }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-feature-settings: 'kern', 'liga'; }
h1, h2, h3 { text-wrap: balance; letter-spacing: -.018em; }
p, li { text-wrap: pretty; }
::selection { background: color-mix(in srgb, var(--accent) 28%, transparent); }
:focus-visible { outline: none; box-shadow: var(--anneau); border-radius: 10px; }
a { transition: color .2s var(--ease); }

/* boutons */
.bouton { transition: background-color .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease), transform .15s var(--ease), box-shadow .25s var(--ease); box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 6px 16px -6px color-mix(in srgb, var(--accent) 55%, transparent); letter-spacing: .005em; }
.bouton:hover { transform: translateY(-1px); }
.bouton:active { transform: translateY(0) scale(.98); }
.bouton--contour, .bouton--clair { box-shadow: none; }

/* en-tête */
.entete { transition: background-color .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease); background: var(--verre); backdrop-filter: saturate(1.6) blur(16px); -webkit-backdrop-filter: saturate(1.6) blur(16px); border-bottom-color: transparent; }
.entete--defile { border-bottom-color: var(--bord); box-shadow: 0 6px 24px -18px rgba(0, 0, 0, .35); }
.entete__int { height: 68px; }
.marque { transition: opacity .2s; letter-spacing: -.01em; }
.marque:hover { opacity: .8; }
.marque svg { transition: transform .5s var(--ease); }
.marque:hover svg { transform: rotate(-8deg) scale(1.06); }
.nav a { display: inline-flex; align-items: center; gap: 8px; position: relative; color: var(--texte); transition: background-color .2s var(--ease), color .2s var(--ease); }
.nav a svg { display: none; width: 22px; height: 22px; }
.nav a[aria-current] { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.entete__outils { display: flex; gap: 6px; margin-left: 8px; }
.outil { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--bord); background: var(--carte); color: var(--texte); display: grid; place-items: center; cursor: pointer; transition: border-color .2s, background-color .2s, transform .15s; }
.outil:hover { border-color: var(--accent); color: var(--accent); }
.outil:active { transform: scale(.94); }
.outil svg { width: 18px; height: 18px; }
.outil__raccourci { display: none; }
.theme { display: none; }

/* en-tête transparent au-dessus de la photo d'accueil */
.page-accueil .entete:not(.entete--defile) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.page-accueil .entete { position: fixed; left: 0; right: 0; }
.page-accueil .entete:not(.entete--defile) .marque, .page-accueil .entete:not(.entete--defile) .nav a { color: #fff; }
.page-accueil .entete:not(.entete--defile) .nav a:hover { background: rgba(255, 255, 255, .14); }
.page-accueil .entete:not(.entete--defile) .nav a[aria-current] { background: rgba(255, 255, 255, .18); }
.page-accueil .entete:not(.entete--defile) .outil { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); color: #fff; }
.page-accueil .entete:not(.entete--defile) .marque svg { color: #fff; }

/* accueil */
.une { min-height: min(92vh, 860px); padding-top: 68px; }
.une::after { background: linear-gradient(180deg, rgba(8, 16, 11, .45) 0%, rgba(8, 16, 11, .15) 30%, rgba(8, 16, 11, .55) 65%, rgba(8, 16, 11, .9) 100%); }
.une:not([style]) { background: radial-gradient(120% 90% at 80% 10%, #3c7a5b 0%, #1d3528 55%, #101d16 100%); }
.une__int { padding-bottom: 120px; }
.une__sur, .une h1, .une__texte, .une__recherche, .une__boutons { animation: monte .9s var(--ease) both; }
.une h1 { animation-delay: .08s; font-size: clamp(2.6rem, 6.4vw, 5.2rem); line-height: 1.02; }
.une__texte { animation-delay: .16s; }
.une__recherche { animation-delay: .24s; }
.une__boutons { animation-delay: .32s; }
@keyframes monte { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.une__recherche { display: flex; align-items: center; gap: 12px; width: min(560px, 100%); height: 60px; padding: 0 22px; margin-bottom: 18px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .14); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); color: rgba(255, 255, 255, .85); font: inherit; font-size: 1.05rem; cursor: text; text-align: left; transition: background-color .25s var(--ease), border-color .25s var(--ease), transform .2s var(--ease); }
.une__recherche:hover { background: rgba(255, 255, 255, .22); border-color: rgba(255, 255, 255, .6); transform: translateY(-1px); }
.une__recherche svg { width: 22px; height: 22px; flex: none; }
.chiffres { position: relative; z-index: 2; margin-top: -64px; background: var(--carte); border: 1px solid var(--bord); border-radius: var(--rayon); box-shadow: var(--ombre-haute); padding: 28px 32px; max-width: calc(var(--large) - 48px); gap: 0; }
.chiffre { padding: 4px 20px; border-left: 1px solid var(--bord); }
.chiffre:first-child { border-left: 0; }
.chiffre b { font-size: clamp(2rem, 4vw, 2.9rem); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.chiffre span { font-size: .92rem; }
.section { padding: 88px 0; }
.section__entete { margin-bottom: 36px; }
.principe { padding: 26px; background: var(--carte); border: 1px solid var(--bord); border-radius: var(--rayon); }
.principe__icone { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; background: color-mix(in srgb, var(--accent) 10%, transparent); font-size: 1.5rem; }
.carte-accueil, .carte-groupe { border-radius: var(--rayon); box-shadow: var(--ombre); }
.du-mois { border-radius: 26px; box-shadow: var(--ombre-haute); border-color: transparent; transition: transform .45s var(--ease); }
.du-mois:hover { transform: translateY(-3px); }
.du-mois__photo { transition: transform 1.2s var(--ease); }
.du-mois { isolation: isolate; }
.du-mois:hover .du-mois__photo { transform: scale(1.03); }
.du-mois__texte { position: relative; background: var(--carte); }
.index-groupe { border-radius: 16px; transition: border-color .2s, transform .3s var(--ease), box-shadow .3s var(--ease); }
.index-groupe:hover { box-shadow: var(--ombre); }

/* cartes d'arbres */
.grille { gap: 26px; }
.arbre-carte { border-radius: var(--rayon); border-color: color-mix(in srgb, var(--bord) 70%, transparent); transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s; }
.arbre-carte:hover { transform: translateY(-4px); box-shadow: var(--ombre-haute); border-color: transparent; }
.arbre-carte__image { overflow: hidden; background: linear-gradient(135deg, var(--fond-2), color-mix(in srgb, var(--accent) 10%, var(--fond-2))); }
.arbre-carte__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease), opacity .5s var(--ease); }
html.js .arbre-carte__image img:not(.charge) { opacity: 0; }
.arbre-carte:hover .arbre-carte__image img { transform: scale(1.05); }
.arbre-carte__image svg { color: color-mix(in srgb, var(--accent) 30%, var(--bord)); }
.arbre-carte__age { z-index: 1; background: rgba(255, 255, 255, .9); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 4px 14px rgba(0, 0, 0, .15); font-size: .9rem; }
.arbre-carte__corps { padding: 18px 20px 22px; }
.arbre-carte h3 { font-size: 1.32rem; transition: color .2s; }
.arbre-carte:hover h3 { color: var(--accent); }

/* listes, filtres */
.page-entete { padding: 64px 0 28px; }
.filtres input, .filtres select, .puce, .pagination a { transition: border-color .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease); }
.filtres input:focus, .filtres select:focus { outline: none; border-color: var(--accent); box-shadow: var(--anneau); }
.pagination a:hover { border-color: var(--accent); color: var(--accent); }

/* fiche */
.fiche-une { min-height: min(74vh, 720px); }
.fiche-une::after { background: linear-gradient(180deg, rgba(8, 16, 11, .35) 0%, rgba(8, 16, 11, 0) 28%, rgba(8, 16, 11, .25) 55%, rgba(8, 16, 11, .88) 100%); }
.fiche-une__int > * { animation: monte .8s var(--ease) both; }
.fiche-une__int > :nth-child(2) { animation-delay: .05s; }
.fiche-une__int > :nth-child(3) { animation-delay: .1s; }
.fiche-une__int > :nth-child(4) { animation-delay: .15s; }
.fiche-une__fil { font-size: .88rem; opacity: .8; margin-bottom: 14px; }
.fiche-une__fil a { color: #fff; text-decoration: none; }
.fiche-une__fil a:hover { text-decoration: underline; }
.fiche-une__age { display: inline-block; padding: 4px 14px; border-radius: 999px; background: rgba(255, 255, 255, .16); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-size: 1.05rem; }
.fiche-une__voir { position: absolute; z-index: 2; right: 24px; bottom: 24px; padding: 10px 18px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: #1d2721; text-decoration: none; font-weight: 600; font-size: .92rem; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); transition: transform .2s var(--ease); }
.fiche-une__voir:hover { transform: translateY(-2px); }
.chapeau { font-size: 1.55rem; letter-spacing: -.005em; }
.texte h2 { position: relative; padding-top: 18px; }
.texte h2::before { content: ''; position: absolute; top: 0; left: 0; width: 36px; height: 2px; background: var(--accent); border-radius: 2px; }
.galerie img { transition: transform .5s var(--ease), box-shadow .3s; cursor: zoom-in; }
.galerie a:hover img { transform: scale(1.02); box-shadow: var(--ombre); }
.encart { border-radius: 24px; padding: 26px; box-shadow: var(--ombre-haute); border-color: transparent; }
.encart dl { grid-template-columns: 1fr; gap: 0; }
.encart dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 600; padding-top: 12px; }
.encart dd { padding: 2px 0 12px; border-bottom: 1px solid var(--bord); font-size: 1.02rem; }
.encart dd:last-of-type { border-bottom: 0; }
.encart dd a { color: inherit; text-decoration-color: color-mix(in srgb, var(--accent) 50%, transparent); }
.encart__carte { border-radius: 16px; }
.partage button, .partage a { transition: border-color .2s, color .2s; }
.partage button:hover, .partage a:hover { border-color: var(--accent); color: var(--accent); }

/* carte plein écran */
.carte-plein__panneau { border-radius: var(--rayon); box-shadow: var(--ombre-haute); border-color: transparent; background: color-mix(in srgb, var(--carte) 92%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding: 18px 20px; }
.carte-plein { height: calc(100vh - 68px); }
.leaflet-popup-content-wrapper { border-radius: 14px; box-shadow: var(--ombre-haute); }

/* formulaire */
.formulaire fieldset { border-radius: var(--rayon); border-color: color-mix(in srgb, var(--bord) 70%, transparent); box-shadow: var(--ombre); }
.formulaire input[type=text], .formulaire input[type=email], .formulaire textarea { transition: border-color .2s, box-shadow .2s; }
.formulaire input:focus, .formulaire textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--anneau); }
.choix__item span { transition: background-color .2s var(--ease), border-color .2s, color .2s; }

/* pied */
.pied { padding-top: 72px; }
.pied a { transition: color .2s, padding .25s var(--ease); }
.pied nav a:hover { padding-left: 4px; }

/* apparition au défilement */
html.js .revele { opacity: 0; transform: translateY(16px); transition: opacity .8s var(--ease), transform .8s var(--ease), box-shadow .45s var(--ease); transition-delay: var(--delai, 0s); }
html.js .revele--vu { opacity: 1; transform: none; }
html.js .arbre-carte.revele--vu:hover { transform: translateY(-4px); transition-delay: 0s; }

/* ----- recherche instantanée ----- */
.recherche { width: min(660px, calc(100% - 24px)); max-height: min(72vh, 640px); margin: 11vh auto auto; padding: 0; border: 1px solid var(--bord); border-radius: 22px; background: var(--carte); color: var(--texte); box-shadow: var(--ombre-haute); overflow: hidden; }
.recherche[open] { display: flex; flex-direction: column; animation: apparait .22s var(--ease); }
.recherche::backdrop { background: rgba(10, 16, 12, .45); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
@keyframes apparait { from { opacity: 0; transform: translateY(-8px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes fondu { from { opacity: 0; } }
.recherche__barre { display: flex; align-items: center; gap: 12px; padding: 6px 14px 6px 20px; border-bottom: 1px solid var(--bord); }
.recherche__barre svg { width: 22px; height: 22px; color: var(--doux); flex: none; }
.recherche__barre input { flex: 1; min-width: 0; height: 58px; border: 0; background: transparent; color: var(--texte); font: inherit; font-size: 1.15rem; outline: none; box-shadow: none; }
.recherche__barre input::-webkit-search-cancel-button { display: none; }
.recherche__fermer { border: 1px solid var(--bord); background: var(--fond); color: var(--doux); border-radius: 8px; font: inherit; font-size: .75rem; padding: 4px 8px; cursor: pointer; }
.recherche__resultats { overflow: auto; padding: 8px; }
.recherche__aide { color: var(--doux); padding: 14px 12px; margin: 0; font-size: .95rem; }
.recherche__groupe { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--doux); font-weight: 600; padding: 12px 12px 6px; margin: 0; }
.recherche__item { display: flex; align-items: center; gap: 14px; padding: 9px 12px; border-radius: 14px; color: var(--texte); text-decoration: none; transition: background-color .12s; }
.recherche__item[aria-selected="true"] { background: color-mix(in srgb, var(--accent) 11%, transparent); }
.recherche__vignette { width: 48px; height: 48px; border-radius: 12px; flex: none; background: color-mix(in srgb, var(--accent) 12%, var(--fond-2)) center / cover no-repeat; display: grid; place-items: center; color: var(--accent); }
.recherche__vignette svg { width: 22px; height: 22px; }
.recherche__texte { min-width: 0; }
.recherche__texte b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recherche__texte small { color: var(--doux); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recherche__tout { display: block; text-align: center; padding: 12px; color: var(--accent); font-weight: 600; text-decoration: none; border-top: 1px solid var(--bord); margin-top: 6px; }

/* ----- visionneuse de photos ----- */
.vis { position: fixed; inset: 0; z-index: 1000; background: rgba(6, 10, 8, .94); display: none; align-items: center; justify-content: center; }
.vis--ouverte { display: flex; animation: fondu .25s ease; }
.vis figure { margin: 0; max-width: 92vw; max-height: 88vh; display: flex; flex-direction: column; align-items: center; }
.vis img { max-width: 92vw; max-height: 80vh; object-fit: contain; border-radius: 6px; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); animation: apparait .3s var(--ease); }
.vis figcaption { color: rgba(255, 255, 255, .75); margin-top: 14px; font-size: .92rem; text-align: center; }
.vis button { position: absolute; border: 0; background: rgba(255, 255, 255, .1); color: #fff; width: 52px; height: 52px; border-radius: 50%; font-size: 1.6rem; cursor: pointer; transition: background-color .2s; display: grid; place-items: center; }
.vis button:hover { background: rgba(255, 255, 255, .22); }
.vis__fermer { top: 18px; right: 18px; font-size: 1.2rem !important; }
.vis__prec { left: 18px; top: 50%; transform: translateY(-50%); }
.vis__suiv { right: 18px; top: 50%; transform: translateY(-50%); }

/* éléments actifs et boutons : lisibles dans les deux thèmes (texte couleur « carte » sur l'accent) */
.bouton { color: var(--carte); }
.bouton--clair { color: #fff; }
.bouton--contour { color: var(--texte); }
.puce[aria-current], .pagination span, .choix__item input:checked + span { background: var(--accent); border-color: var(--accent); color: var(--carte); }

@media (max-width: 860px) {
    /* pas de flou sur l'en-tête : il ferait de la barre du bas un enfant « contenu » et la remonterait en haut */
    .entete, .entete--defile { backdrop-filter: none; -webkit-backdrop-filter: none; background: color-mix(in srgb, var(--fond) 96%, transparent); }
    .entete__int { height: 60px; }
    .page-accueil .entete:not(.entete--defile) { background: transparent; }
    .nav { background: color-mix(in srgb, var(--carte) 86%, transparent); backdrop-filter: saturate(1.6) blur(18px); -webkit-backdrop-filter: saturate(1.6) blur(18px); padding: 6px 8px calc(8px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 30px -18px rgba(0, 0, 0, .3); }
    .nav a, .page-accueil .entete:not(.entete--defile) .nav a { flex: 1; flex-direction: column; gap: 2px; padding: 6px 4px; font-size: .7rem; font-weight: 500; border-radius: 14px; color: var(--doux); background: none; }
    .nav a svg { display: block; }
    .nav a[aria-current], .page-accueil .entete:not(.entete--defile) .nav a[aria-current] { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
    .entete__outils { margin-left: auto; }
    .une { min-height: 88svh; padding-top: 60px; }
    .une__int { padding-bottom: 96px; }
    .une__recherche { height: 54px; font-size: 1rem; }
    .chiffres { grid-template-columns: 1fr 1fr; margin: -56px 16px 0; padding: 18px; gap: 14px 0; }
    .chiffre:nth-child(3) { border-left: 0; }
    .chiffre { padding: 4px 14px; }
    .section { padding: 60px 0; }
    .fiche-une__voir { right: 16px; bottom: 16px; }
    .recherche { margin-top: 12px; max-height: calc(100svh - 24px); border-radius: 18px; }
    .carte-plein { height: calc(100svh - 60px - 64px); }
    .vis__prec, .vis__suiv { top: auto !important; bottom: 18px; transform: none !important; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    html.js .revele { opacity: 1; transform: none; }
}

/* ----- carnet de route : récits de visite ----- */
.recits { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); gap: 26px; }
.recit-carte { display: grid; grid-template-rows: auto 1fr; background: var(--carte); border: 1px solid color-mix(in srgb, var(--bord) 70%, transparent); border-radius: var(--rayon); overflow: hidden; color: var(--texte); text-decoration: none; box-shadow: var(--ombre); transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.recit-carte:hover { transform: translateY(-4px); box-shadow: var(--ombre-haute); }
.recit-carte__photo { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: radial-gradient(circle at 70% 30%, #3c7a5b, var(--foret) 75%); }
.recit-carte__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.recit-carte:hover .recit-carte__photo img { transform: scale(1.04); }
.recit-carte__corps { padding: 20px 24px 24px; display: flex; flex-direction: column; gap: 8px; }
.recit-carte__date { font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; color: var(--accent); font-weight: 700; }
.recit-carte__titre { font-family: var(--serif); font-size: 1.55rem; line-height: 1.15; letter-spacing: -.015em; }
.recit-carte__chapeau { color: var(--doux); }
.recit-carte__lire { color: var(--accent); font-weight: 600; font-size: .92rem; margin-top: auto; padding-top: 6px; }
.recit-corps { padding: 56px 0 72px; display: flex; flex-direction: column; align-items: center; gap: 56px; }
.recit-corps .texte { max-width: 68ch; width: 100%; }
.recit-corps .texte .chapeau + p::first-letter, .recit-corps .texte > p:first-child:not(.chapeau)::first-letter { font-family: var(--serif); font-size: 3.2em; float: left; line-height: .9; padding: 6px 10px 0 0; color: var(--accent); }
.recit-signature { color: var(--doux); font-size: .92rem; border-top: 1px solid var(--bord); padding-top: 16px; margin-top: 32px; }
.recit-arbres { width: 100%; }
.recit-arbres h2 { font-size: 1.8rem; }
.recits-arbre { padding-left: 18px; }
.recits-arbre small { color: var(--doux); }
.num-carte { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--accent); color: var(--carte); font-weight: 700; font-size: .85rem; border: 2px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,.3); }

/* =====================================================
   DIRECTION ARTISTIQUE V1 — « Le temps vivant » (3 novembre 2026)
   Les valeurs viennent de tokens.css (commun au site et à la console) ; cette couche relie
   les anciennes variables du site à ces tokens et applique formes, filets et mouvements de la DA.
   ===================================================== */
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('/assets/fonts/newsreader.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 300 700; font-display: swap; src: url('/assets/fonts/newsreader-italique.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('/assets/fonts/manrope.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* anciennes variables -> tokens (les deux thèmes suivent automatiquement) */
:root, :root[data-theme="dark"] {
    --fond: var(--am-bg);
    --fond-2: var(--am-surface-alt);
    --carte: var(--am-surface);
    --bord: var(--am-border);
    --texte: var(--am-text);
    --doux: var(--am-text-muted);
    --accent: var(--am-action);
    --accent-2: var(--am-action-hover);
    --foret: var(--am-brand-nuit);
    --serif: var(--am-font-editorial);
    --sans: var(--am-font-ui);
    --ease: var(--am-ease);
    --rayon: var(--am-radius-control);
    --ombre: none;
    --ombre-haute: var(--am-shadow-popover);
    --anneau: 0 0 0 var(--am-focus-width) var(--am-focus);
    --verre: color-mix(in srgb, var(--am-bg) 90%, transparent);
    --large: var(--am-page-max);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) { --foret: var(--am-brand-nuit); }
}

/* typographie : Newsreader pour la voix éditoriale, Manrope pour l'usage */
body { font-family: var(--am-font-ui); font-size: var(--am-type-body); line-height: var(--am-line-body); font-feature-settings: 'kern', 'liga'; }
h1, h2, h3, .chapeau, .marque, .du-mois h2, .recit-carte__titre, .index-groupe__nom, .arbre-carte h3, .vide b, .chiffre b { font-family: var(--am-font-editorial); font-weight: var(--am-weight-regular); letter-spacing: -.01em; }
h1 { font-size: var(--am-type-h1); line-height: var(--am-line-title); }
.une h1 { font-size: var(--am-type-display); font-weight: var(--am-weight-regular); }
.fiche-une h1 { font-size: var(--am-type-h1); }
h2, .section__entete h2 { font-size: var(--am-type-h2); line-height: 1.15; }
h3 { font-size: var(--am-type-h3); }
.texte, .prose { max-width: var(--am-measure); }
.chapeau { font-weight: var(--am-weight-regular); }
.arbre-carte h3 { font-size: 1.375rem; }

/* formes : angles nets, filets plutôt qu'ombres */
.int, .entete__int, .pied__int, .pied__note, .une__int, .fiche-une__int, .chiffres { max-width: var(--am-page-max); padding-left: var(--am-gutter); padding-right: var(--am-gutter); }
.arbre-carte, .recit-carte, .du-mois, .principe, .index-groupe, .encart, .formulaire fieldset, .chiffres, .carte-accueil, .carte-groupe, .carte-plein__panneau, .recherche, .alerte, .note-prive {
    border-radius: var(--am-radius-control); box-shadow: none; border: var(--am-rule) solid var(--am-border);
}
.arbre-carte__image, .recit-carte__photo, .galerie img, .encart__carte, .du-mois__photo, .recherche__vignette, .apercus img, .video video, .video iframe, .video__lancer { border-radius: var(--am-radius-image); }
.arbre-carte:hover, .recit-carte:hover, .du-mois:hover, .index-groupe:hover { transform: none; box-shadow: none; border-color: var(--am-control-border); }
.arbre-carte:hover .arbre-carte__image img, .recit-carte:hover .recit-carte__photo img, .du-mois:hover .du-mois__photo { transform: none; }
.arbre-carte__age { border-radius: var(--am-radius-control); box-shadow: none; background: var(--am-surface); color: var(--am-text); font-family: var(--am-font-ui); font-weight: var(--am-weight-semibold); font-size: var(--am-type-small); }
.encart { box-shadow: none; }
.chiffres { box-shadow: none; }
.recherche, .carte-plein__panneau { box-shadow: var(--am-shadow-popover); }

/* commandes : 44 px minimum, rayon de contrôle, texte « sur action » */
.bouton { height: auto; min-height: var(--am-control-min); padding: .6rem 1.25rem; border-radius: var(--am-radius-control); background: var(--am-action); border-color: var(--am-action); color: var(--am-on-action); box-shadow: none; font-family: var(--am-font-ui); font-weight: var(--am-weight-semibold); transition: background-color var(--am-duration-fast) var(--am-ease), border-color var(--am-duration-fast) var(--am-ease), color var(--am-duration-fast) var(--am-ease); }
.bouton:hover { background: var(--am-action-hover); border-color: var(--am-action-hover); transform: none; }
.bouton:active { transform: none; }
.bouton--contour { background: transparent; color: var(--am-text); border-color: var(--am-control-border); }
.bouton--contour:hover { background: var(--am-selected); color: var(--am-text); border-color: var(--am-control-border); }
.bouton--clair { background: rgb(252 251 247 / 12%); border-color: rgb(252 251 247 / 55%); color: #FCFBF7; }
.bouton--clair:hover { background: rgb(252 251 247 / 22%); border-color: #FCFBF7; }
.puce, .pagination a, .pagination span, .filtres input, .filtres select, .choix__item span, .recherche__fermer, .outil, .partage button, .partage a { border-radius: var(--am-radius-control); }
.puce, .pagination a, .filtres input, .filtres select, .outil { min-height: var(--am-control-min); border-color: var(--am-control-border); }
.puce { display: inline-flex; align-items: center; }
.puce[aria-current], .pagination span, .choix__item input:checked + span { background: var(--am-selected); color: var(--am-selected-text); border-color: var(--am-selected-control-border); }
.puce[aria-current] { font-weight: var(--am-weight-semibold); }
.nav a { border-radius: var(--am-radius-control); }
.nav a[aria-current] { background: var(--am-selected); color: var(--am-selected-text); }
.une__recherche { border-radius: var(--am-radius-control); min-height: 3.5rem; height: auto; }

/* focus clavier : ocre, 3 px, décalé */
:focus-visible { outline: var(--am-focus-width) solid var(--am-focus); outline-offset: var(--am-focus-offset); box-shadow: none; border-radius: var(--am-radius-control); }
.filtres input:focus, .filtres select:focus, .formulaire input:focus, .formulaire textarea:focus { box-shadow: none; outline: var(--am-focus-width) solid var(--am-focus); outline-offset: 1px; }

/* accent ocre : seulement les petits repères éditoriaux */
.une__sur, .du-mois__sur, .recit-carte__date { color: var(--am-accent); }
.une__sur { color: var(--am-brand-lumiere); }
.texte h2::before { background: var(--am-accent); }
.chiffre b { color: var(--am-text); }

/* mouvements mesurés : le contenu est lisible tout de suite */
html.js .revele { opacity: 1; transform: none; transition: none; }
.une__sur, .une h1, .une__texte, .une__recherche, .une__boutons, .fiche-une__int > * { animation: none; }
.recherche[open] { animation-duration: var(--am-duration-normal); }
.vis--ouverte, .vis img { animation-duration: var(--am-duration-image); }
.arbre-carte__image img { transition: opacity var(--am-duration-image) var(--am-ease); }
a, .puce, .nav a, .outil { transition: color var(--am-duration-fast) var(--am-ease), background-color var(--am-duration-fast) var(--am-ease), border-color var(--am-duration-fast) var(--am-ease); }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--am-duration-normal); }

/* photographies : leur colorimétrie ne change jamais avec le thème */
.arbre-carte__image img, .recit-carte__photo img, .galerie img, .vis img { filter: none; }

/* en-tête et pied */
.entete { border-bottom: var(--am-rule) solid var(--am-border); }
.entete--defile { box-shadow: none; }
.pied { background: var(--am-brand-nuit); color: #BAC8B7; }
.pied a { color: var(--am-brand-ivoire); }

/* accueil : bloc éditorial quand le catalogue se constitue (pas de compteurs à zéro) */
.lancement { max-width: var(--am-page-max); margin: 0 auto; padding: var(--am-space-12) var(--am-gutter) 0; }
.lancement__int { border-top: var(--am-rule) solid var(--am-border); padding-top: var(--am-space-8); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: var(--am-space-8); }
.lancement h2 { margin: 0; font-size: var(--am-type-h3); }
.lancement p { color: var(--am-text-muted); max-width: var(--am-measure); margin: 0 0 var(--am-space-4); }
@media (max-width: 860px) { .lancement__int { grid-template-columns: 1fr; gap: var(--am-space-4); } }

/* commandes de carte (zoom, fonds) : même habillage que le panneau de légende, dans les deux thèmes */
.leaflet-bar, .leaflet-control-layers { border: var(--am-rule) solid var(--am-border) !important; border-radius: var(--am-radius-control) !important; box-shadow: var(--am-shadow-popover) !important; overflow: hidden; background: color-mix(in srgb, var(--am-surface) 92%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.leaflet-bar a, .leaflet-bar a:first-child, .leaflet-bar a:last-child { background: transparent; color: var(--am-text); border-color: var(--am-border); border-radius: 0; width: var(--am-control-min); height: var(--am-control-min); line-height: var(--am-control-min); font: 400 1.25rem/var(--am-control-min) var(--am-font-ui); }
.leaflet-bar a:hover, .leaflet-bar a:focus-visible { background: var(--am-selected); color: var(--am-text); }
.leaflet-bar a.leaflet-disabled { background: transparent; color: var(--am-text-muted); opacity: .5; }
.leaflet-control-layers-toggle { width: var(--am-control-min); height: var(--am-control-min); background-size: 22px; }
.leaflet-control-layers-expanded { color: var(--am-text); padding: 8px 12px; font: var(--am-type-small)/1.5 var(--am-font-ui); }
.leaflet-control-layers-separator { border-top-color: var(--am-border); }
:root[data-theme="dark"] .leaflet-control-layers-toggle { filter: invert(1) brightness(1.6); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .leaflet-control-layers-toggle { filter: invert(1) brightness(1.6); } }

/* =====================================================
   CHARTE OPÉRATIONNELLE 1.0 — « Chaque arbre, un monde. » (3 novembre 2026)
   Logo « arbre sous arche », palette forêt / ivoire / nuit, rayons 8-12-16, boutons 48 px,
   lecture 18 px, ombres feutrées. Les valeurs viennent de tokens.css.
   ===================================================== */
:root, :root[data-theme="dark"] { --ombre: var(--am-shadow-card); --rayon: var(--am-radius-card); }
.visuellement-cache { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
::selection { background: var(--am-selected); color: var(--am-on-selected); }

/* logo : fichier maître en masque, la couleur suit le thème (forêt sur clair, ivoire sur sombre) */
.marque { gap: 0; padding: 4px 0; flex-shrink: 0; }
.marque__logo, .marque__symbole { display: block; background: currentColor; -webkit-mask: var(--masque) no-repeat center / contain; mask: var(--masque) no-repeat center / contain; }
.marque__logo { --masque: url('/assets/img/am-logo.svg'); width: 232px; aspect-ratio: 620 / 140; }
.marque__symbole { --masque: url('/assets/img/am-symbole.svg'); display: none; width: 52px; aspect-ratio: 128 / 104; }
.marque:hover { opacity: .78; }
.entete__int { height: 76px; }
@media (max-width: 860px) { .entete__int { height: 64px; } .marque__logo { width: 220px; } }
@media (max-width: 359px) { .marque__logo { display: none; } .marque__symbole { display: block; } }

/* lecture 18 px ; interface 16 px ; aide 14 px */
body { font-size: var(--am-type-ui); line-height: var(--am-line-ui); }
.texte, .prose, .chapeau, .recit-corps, .une__texte, .page-entete p { font-size: var(--am-type-body); line-height: var(--am-line-body); }
a { color: var(--am-link); text-underline-offset: .18em; text-decoration-thickness: 1px; }
.nav a, .arbre-carte, .recit-carte, .du-mois, .index-groupe, .bouton, .puce, .pied a, .marque, .fil a { text-decoration: none; }

/* cartes : 12 px, filet + ombre feutrée, survol discret */
.arbre-carte, .recit-carte, .du-mois, .index-groupe, .encart, .principe, .formulaire fieldset, .carte-accueil, .carte-groupe, .note-prive { border-radius: var(--am-radius-card); border: var(--am-rule) solid var(--am-border); box-shadow: var(--am-shadow-card); }
.arbre-carte, .recit-carte, .du-mois { overflow: hidden; transition: transform var(--am-duration-panel) var(--am-ease), box-shadow var(--am-duration-panel) var(--am-ease), border-color var(--am-duration-fast) var(--am-ease); }
.arbre-carte:hover, .recit-carte:hover, .du-mois:hover, .index-groupe:hover { transform: translateY(-2px); box-shadow: var(--am-shadow-popover); border-color: var(--am-border); }
.arbre-carte__image, .recit-carte__photo { border-radius: 0; }
.arbre-carte__image img, .recit-carte__photo img { transition: transform 900ms var(--am-ease), opacity var(--am-duration-panel) var(--am-ease); }
.arbre-carte:hover .arbre-carte__image img, .recit-carte:hover .recit-carte__photo img { transform: scale(1.03); }
.arbre-carte:hover h3 { color: var(--am-text); }
.arbre-carte__corps { padding: var(--am-space-4) var(--am-space-6) var(--am-space-6); }
.arbre-carte__lieu, .arbre-carte__resume { font-size: var(--am-type-small); }
.arbre-carte__age { border-radius: var(--am-radius-pill); padding: 4px 12px; background: color-mix(in srgb, var(--am-surface-raised) 94%, transparent); color: var(--am-text); box-shadow: 0 2px 10px rgb(13 22 19 / 14%); }
.galerie img, .encart__carte, .apercus img, .video video, .video iframe, .video__lancer { border-radius: var(--am-radius-control); }
.recherche, .carte-plein__panneau, .leaflet-popup-content-wrapper { border-radius: var(--am-radius-dialog); }
.carte-plein__panneau { border-radius: var(--am-radius-card); }

/* image absente : l'arbre sous arche, jamais une fausse photographie */
.sans-photo { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: var(--am-space-2); background: var(--am-surface-soft); color: var(--am-text-muted); }
.sans-photo__arbre { width: 52%; aspect-ratio: 1200 / 720; background: currentColor; opacity: .38; -webkit-mask: url('/assets/img/am-arbre.svg') no-repeat center / contain; mask: url('/assets/img/am-arbre.svg') no-repeat center / contain; }
.sans-photo__texte { font-size: var(--am-type-small); letter-spacing: .02em; }

/* commandes : boutons 48 px, rayon 8 ; pilules réservées aux badges et filtres courts */
.bouton { min-height: var(--am-button-min); padding: .75rem 1.5rem; border-radius: var(--am-radius-control); background: var(--am-action); border-color: var(--am-action); color: var(--am-on-action); }
.bouton:hover { background: var(--am-action-hover); border-color: var(--am-action-hover); color: var(--am-on-action); }
.bouton--contour { background: transparent; color: var(--am-text); border-color: var(--am-border-control); }
.bouton--contour:hover { background: var(--am-selected); color: var(--am-on-selected); }
.bouton--clair { background: rgb(246 243 235 / 10%); border-color: rgb(246 243 235 / 60%); color: var(--am-brand-ivoire); }
.bouton--clair:hover { background: rgb(246 243 235 / 20%); border-color: var(--am-brand-ivoire); color: var(--am-brand-ivoire); }
.une .bouton:not(.bouton--clair) { background: var(--am-brand-ivoire); border-color: var(--am-brand-ivoire); color: var(--am-brand-foret); }
.une .bouton:not(.bouton--clair):hover { background: #fff; border-color: #fff; color: var(--am-brand-foret); }
.puce { border-radius: var(--am-radius-pill); padding-left: 16px; padding-right: 16px; }
.puce[aria-current], .pagination span, .choix__item input:checked + span { background: var(--am-selected); color: var(--am-on-selected); border-color: var(--am-border-control); }
.nav a[aria-current] { background: var(--am-selected); color: var(--am-on-selected); }

/* états : couleurs sémantiques, toujours accompagnées de texte */
.alerte { background: var(--am-danger-bg); color: var(--am-danger); border-color: color-mix(in srgb, var(--am-danger) 30%, transparent); border-radius: var(--am-radius-card); }

/* une : la nuit de marque sous la photographie */
.une, .fiche-une { background-color: var(--am-brand-nuit); }
.une__sur { color: var(--am-brand-lumiere); opacity: 1; letter-spacing: .16em; }
.page-accueil .entete:not(.entete--defile) .marque { color: var(--am-brand-ivoire); }

/* pied : logo ivoire sur nuit, signature en Newsreader italique */
.pied { background: var(--am-brand-nuit); color: #BAC8B7; }
.pied__marque { margin: 0 0 var(--am-space-2); color: var(--am-brand-ivoire); }
.pied__marque .marque__logo { width: 240px; }
.pied__signature { font-family: var(--am-font-display); font-style: italic; font-size: 1.25rem; color: var(--am-brand-lichen-clair); margin: 0 0 var(--am-space-4); }
.pied a { color: var(--am-brand-ivoire); opacity: .86; }
.pied a:hover { opacity: 1; color: var(--am-brand-ivoire); }
.pied__note { border-top-color: rgb(246 243 235 / 12%); }

@media (prefers-reduced-motion: reduce) {
    .arbre-carte:hover, .recit-carte:hover, .du-mois:hover, .index-groupe:hover { transform: none; }
    .arbre-carte:hover .arbre-carte__image img, .recit-carte:hover .recit-carte__photo img { transform: none; }
}
.une { padding-top: 100px; }
@media (max-width: 860px) { .une { padding-top: 80px; } }
/* en sombre, le pied se détache de la page nuit */
:root[data-theme="dark"] .pied { background: var(--am-surface-soft); border-top: var(--am-rule) solid var(--am-border); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pied { background: var(--am-surface-soft); border-top: var(--am-rule) solid var(--am-border); } }
/* pied toujours en bas, même sur une page presque vide */
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body > main { flex: 1 0 auto; }
.pied { margin-top: auto; flex-shrink: 0; }