/* ==========================================================================
   ASSODIP — feuille de style du site (complète Tailwind chargé dans les pages)
   Direction artistique : cartes blanches minimalistes, photos pleine largeur
   ========================================================================== */

/* ---------- Base ---------- */
@layer base{html,body{margin:0;padding:0;}}
html{scroll-behavior:smooth;}
[id]{scroll-margin-top:8.5rem;}
summary::-webkit-details-marker{display:none;}
::selection{background:#22c55e;color:#002345;}
body{background:#f6f8fc;}

/* Le header fixe mesure 7.5rem (barre d'infos + navigation) */
main{padding-top:7.5rem!important;}

/* ---------- Cartes blanches ---------- */
.glass,.glass-strong{
  background:#fff;
  border:1px solid #e9eef5;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(16,24,40,.10);
}
.glass-strong{box-shadow:0 2px 4px rgba(16,24,40,.05),0 24px 48px -20px rgba(16,24,40,.22);}
.glass-hover{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.glass-hover:hover{transform:translateY(-4px);border-color:#bfe8cd;box-shadow:0 2px 4px rgba(16,24,40,.05),0 24px 44px -20px rgba(0,107,44,.28);}
/* encart discret sur fond sombre (pied de page) */
.glass-dark{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);}

/* ---------- Header ---------- */
.glass-bar{
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border-bottom:1px solid #e9eef5;
}
.top-bar{background:#002345;}

/* ---------- Bannières de page : texte posé directement sur la photo ---------- */
.banner{isolation:isolate;min-height:15rem;display:flex;align-items:flex-end;}
@media(min-width:1024px){.banner{min-height:18rem;}}
.banner > div.relative{width:100%;z-index:2;}
.banner > .absolute.inset-0{z-index:1;}
.banner-card{background:none;border:0;box-shadow:none;padding:0;max-width:48rem;}

/* ---------- Sections ---------- */
.section-tint{background:#eef2f9;}
.section-dark{background:#002345;}

/* ---------- Détails ---------- */
.photo-frame{box-shadow:0 20px 44px -24px rgba(16,24,40,.35);}

.text-gradient{color:#22c55e;}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;}
.eyebrow::before{content:"";width:1.5rem;height:2px;border-radius:2px;background:#22c55e;}

/* Apparition au défilement (activée par js/footer.js) */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ---------- Sous-menus du header (état piloté par js/header.js) ---------- */
.nav-panel{visibility:hidden;opacity:0;transform:translateY(6px);transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s;}
.nav-item.is-open > .nav-panel{visibility:visible;opacity:1;transform:none;transition-delay:0s;}
.nav-item.is-open .nav-chevron{transform:rotate(180deg);}
.nav-panel > div{scrollbar-width:thin;}
.acc-chevron{transition:transform .2s ease;}
details[open] > summary .acc-chevron{transform:rotate(180deg);}

/* ==========================================================================
   Mobile (Safari iOS, Chrome Android)
   ========================================================================== */
a,button,summary,label{-webkit-tap-highlight-color:transparent;}
/* iOS zoome sur les champs dont le texte fait moins de 16px */
input,select,textarea{font-size:16px!important;-webkit-appearance:none;appearance:none;}
select{background-image:linear-gradient(45deg,transparent 50%,#64748b 50%),linear-gradient(135deg,#64748b 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.5rem;}
img{max-width:100%;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{overscroll-behavior-y:auto!important;overflow-x:hidden;}
/* hauteur réelle de l'écran quand la barre d'adresse mobile est visible */
.menu-h{max-height:calc(100vh - 7.5rem);max-height:calc(100dvh - 7.5rem);-webkit-overflow-scrolling:touch;}
.panel-h{max-height:calc(100vh - 9rem);max-height:calc(100dvh - 9rem);}
/* zones tactiles confortables dans le menu mobile */
#mobile-menu ul a,#mobile-menu summary{min-height:44px;align-items:center;display:flex;}
/* encoche / barre d'accueil des iPhone */
footer{padding-bottom:max(1.5rem,env(safe-area-inset-bottom))!important;}
/* pas d'effet de survol « collé » sur les écrans tactiles */
@media(hover:none){.glass-hover:hover{transform:none;border-color:#e9eef5;box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(16,24,40,.10);}}

/* ==========================================================================
   Animations et fluidité
   ========================================================================== */
@keyframes rise{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
@keyframes drop{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:none;}}
@keyframes zoomIn{from{opacity:0;transform:scale(.94);}to{opacity:1;transform:none;}}
@keyframes settle{from{transform:scale(1.10);}to{transform:scale(1);}}
@keyframes kenburns{from{transform:scale(1);}to{transform:scale(1.08);}}

/* header : la barre d'infos se replie quand on descend, pour laisser la place au contenu */
header{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease;will-change:transform;}
header.is-compact{transform:translateY(-2.5rem);box-shadow:0 10px 30px -18px rgba(0,35,69,.45);}
#mobile-menu:not(.hidden){animation:drop .25s ease both;}

/* bannières : la photo se pose, le texte monte */
.banner > img{animation:settle 1.6s cubic-bezier(.2,.7,.2,1) both;}
.banner-card > *{animation:rise .7s cubic-bezier(.2,.7,.2,1) both;}
.banner-card > :nth-child(2){animation-delay:.10s;}
.banner-card > :nth-child(3){animation-delay:.20s;}
.banner-card > :nth-child(4){animation-delay:.30s;}
/* diaporama d'accueil : chaque diapositive rejoue son entrée */
.hero-slide.opacity-100 > img{animation:kenburns 8s ease-out both;}
.hero-slide.opacity-0 .banner-card > *{animation:none;opacity:0;}

/* cartes et vignettes : apparition en cascade quand la section entre à l'écran */
.reveal.in .grid > *{animation:rise .6s cubic-bezier(.2,.7,.2,1) both;}
.reveal.in .grid > :nth-child(2){animation-delay:.07s;}
.reveal.in .grid > :nth-child(3){animation-delay:.14s;}
.reveal.in .grid > :nth-child(4){animation-delay:.21s;}
.reveal.in .grid > :nth-child(5){animation-delay:.28s;}
.reveal.in .grid > :nth-child(6){animation-delay:.35s;}
.reveal.in .grid > :nth-child(n+7){animation-delay:.42s;}

/* boutons : réponse immédiate au toucher */
a[class*="rounded-full"],button[class*="rounded-full"]{transition:transform .15s ease,background-color .2s ease,color .2s ease,box-shadow .2s ease;}
a[class*="rounded-full"]:active,button[class*="rounded-full"]:active{transform:scale(.96);}
/* visionneuse */
[role="dialog"]:not(.hidden){animation:fade .2s ease both;}
[role="dialog"]:not(.hidden) > img{animation:zoomIn .3s cubic-bezier(.2,.7,.2,1) both;}
img[loading="lazy"]{transition:transform .5s ease,opacity .4s ease;}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;}
  .hero-slide.opacity-0 .banner-card > *{opacity:1;}
}

/* ==========================================================================
   Barres de défilement (page, sous-menus, menu mobile, visionneuse)
   ========================================================================== */
html{scrollbar-width:thin;scrollbar-color:#22a455 #e8eef6;}             /* Firefox */
*{scrollbar-width:thin;scrollbar-color:#9fb3c8 transparent;}
html::-webkit-scrollbar{width:12px;height:12px;}
html::-webkit-scrollbar-track{background:#e8eef6;}
html::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#22c55e,#006b2c);border-radius:9999px;border:3px solid #e8eef6;}
html::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#16a34a,#005320);}
/* zones défilantes internes : barre fine et discrète */
*:not(html)::-webkit-scrollbar{width:8px;height:8px;}
*:not(html)::-webkit-scrollbar-track{background:transparent;margin:10px 0;}
*:not(html)::-webkit-scrollbar-thumb{background:#c3d0de;border-radius:9999px;border:2px solid transparent;background-clip:padding-box;}
*:not(html)::-webkit-scrollbar-thumb:hover{background:#22a455;background-clip:padding-box;}
.nav-panel > div,.menu-h{scrollbar-gutter:stable;}

/* ==========================================================================
   Boutons — un seul système, cohérent sur tout le site
   · principal  : vert plein (action majeure)
   · secondaire : verre dépoli (clair sur fond clair, translucide sur fond sombre)
   · accent     : vert clair, réservé aux fonds sombres
   ========================================================================== */
a[class*="rounded-full"][class*="px-"],button[class*="rounded-full"][class*="px-"]{
  min-height:2.75rem;font-weight:600;letter-spacing:.01em;border:1px solid transparent;
  transition:transform .18s ease,background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease;
}
/* principal */
.btn-glow{
  background:linear-gradient(135deg,#0b8f42 0%,#006b2c 100%)!important;color:#fff!important;
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 1px 2px rgba(0,35,69,.14),0 8px 18px -10px rgba(0,107,44,.55);
}
/* accent (fonds sombres) */
a[class*="rounded-full"][class*="bg-emerald-light"],button[class*="rounded-full"][class*="bg-emerald-light"]{
  background:linear-gradient(135deg,#34d671 0%,#22c55e 100%)!important;color:#002345!important;
  border-color:rgba(255,255,255,.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 18px -10px rgba(34,197,94,.6);
}
/* secondaire : verre clair */
a[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]),
button[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]),
#menu-toggle{
  background:rgba(255,255,255,.66)!important;color:#002345!important;
  border:1px solid rgba(0,35,69,.10)!important;
  -webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(0,35,69,.06),0 8px 18px -12px rgba(0,35,69,.35);
}
/* secondaire : verre sombre (bannières, diaporama, bandeaux foncés, pied de page) */
:is(.banner,.hero-slide,.section-dark,footer) a[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]),
:is(.banner,.hero-slide,.section-dark,footer) button[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]),
#hero-prev,#hero-next{
  background:rgba(255,255,255,.14)!important;color:#fff!important;
  border:1px solid rgba(255,255,255,.34)!important;
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 20px -12px rgba(0,0,0,.6);
}
#menu-toggle{border-radius:9999px;width:2.75rem;height:2.75rem;}
/* survol (souris uniquement) */
@media(hover:hover){
  .btn-glow:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 4px rgba(0,35,69,.16),0 14px 24px -12px rgba(0,107,44,.65);}
  a[class*="rounded-full"][class*="bg-emerald-light"]:hover,button[class*="rounded-full"][class*="bg-emerald-light"]:hover{transform:translateY(-1px);background:linear-gradient(135deg,#4ade80,#22c55e)!important;}
  a[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]):hover,
  button[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]):hover,
  #menu-toggle:hover{transform:translateY(-1px);background:rgba(255,255,255,.92)!important;color:#006b2c!important;border-color:rgba(0,107,44,.30)!important;}
  :is(.banner,.hero-slide,.section-dark,footer) a[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]):hover,
  :is(.banner,.hero-slide,.section-dark,footer) button[class*="rounded-full"][class*="px-"]:not(.btn-glow):not([class*="bg-emerald-light"]):hover,
  #hero-prev:hover,#hero-next:hover{background:rgba(255,255,255,.26)!important;color:#fff!important;border-color:rgba(255,255,255,.55)!important;}
}
a[class*="rounded-full"]:focus-visible,button[class*="rounded-full"]:focus-visible,#menu-toggle:focus-visible{outline:2px solid #22c55e;outline-offset:2px;}

/* Sous-menus et menu mobile : barre de défilement verte, fine, sur piste claire */
.nav-panel > div,.menu-h{scrollbar-width:thin;scrollbar-color:#22c55e #eef2f7;padding-right:.75rem;}
@supports not (scrollbar-color:auto){
  .nav-panel > div::-webkit-scrollbar,.menu-h::-webkit-scrollbar{width:8px;}
  .nav-panel > div::-webkit-scrollbar-track,.menu-h::-webkit-scrollbar-track{background:#eef2f7;border-radius:9999px;margin:12px 0;}
  .nav-panel > div::-webkit-scrollbar-thumb,.menu-h::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#22c55e,#006b2c);border-radius:9999px;border:0;}
}
/* carte illustrée dans les sous-menus */
.nav-feature{padding-right:1rem;border-right:1px solid #e9eef5;}
/* la carte illustrée respire, et s'efface quand la place manque (écran étroit ou peu haut) */
.nav-feature{padding-right:1.5rem;}
.nav-feature img{display:block;}
@media(max-width:1359px){.nav-panel.is-wide .nav-feature{display:none;}}
@media(max-height:620px){.nav-feature{display:none;}}

/* Très petits téléphones (moins de 360 px de large) : header compact */
@media(max-width:359px){
  header a[aria-label] img{height:1.6rem;}
  header a[aria-label] .font-headline-sm{font-size:1.05rem;}
  header .btn-glow{padding-left:.7rem!important;padding-right:.7rem!important;font-size:.8rem;}
  #menu-toggle{width:2.5rem;height:2.5rem;}
}

/* ---------- WordPress ---------- */
.screen-reader-text{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.screen-reader-text:focus{left:1rem;top:1rem;width:auto;height:auto;z-index:100;background:#fff;color:#002345;padding:.5rem 1rem;border-radius:.5rem;}
/* contenu libre des pages et articles */
.entry-content{color:#3e4a3d;font-size:1.0625rem;line-height:1.75;}
.entry-content > * + *{margin-top:1.1em;}
.entry-content h2{font-size:1.75rem;line-height:2.25rem;font-weight:600;color:#002345;margin-top:1.8em;}
.entry-content h3{font-size:1.25rem;font-weight:600;color:#002345;margin-top:1.5em;}
.entry-content a{color:#006b2c;font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.entry-content ul{list-style:disc;padding-left:1.4em;}
.entry-content ol{list-style:decimal;padding-left:1.4em;}
.entry-content img{border-radius:1rem;height:auto;}
.entry-content blockquote{border-left:3px solid #22c55e;padding-left:1rem;color:#002345;}
