/* ============================================================
   GLOSSAIRE PAGE — glossaire-v1.css
   Page-specific styles for /glossaire and /glossaire/{slug}.
   Global tokens, header, footer, nav, float-menu → nav-v5.css.
   ============================================================ */

html { scroll-behavior: smooth; }

:root {
  --pds-blue:        #0084BC;
  --pds-blue-bright: #27AAE1;
  --pds-blue-deep:   #00638c;
  --pds-orange:      #FF5500;
  --pds-ink:         #1c2b33;
  --pds-body:        #46555d;
  --pds-line:        #e4ebef;
  --pds-tint:        #f0f8fc;
  --pds-tint-2:      #f7fafc;
  --pds-white:       #ffffff;
  --pds-dark:        #14222b;
  --pds-gradient:    linear-gradient(270deg, #27AAE1 0%, #0084BC 100%);
  --ff-body:         'Jost', system-ui, sans-serif;
  --ff-serif:        'Libre Baskerville', Georgia, serif;
  --radius-card:     10px 10px 70px 10px;
  --radius-soft:     14px;
  --shadow-soft:     0 8px 30px rgba(0,72,104,.07);
  --container:       1200px;
  --header-h:        78px;
  --anchor-h:        52px;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  padding: calc(var(--header-h) + 56px) 0 64px;
  background: var(--pds-blue-deep);
  color: #fff; overflow: hidden;
}
.hero-bg {
  position:absolute; top:0; left:0; right:0; bottom:0; z-index:0;
  background: url("../images/paris/top/hero-image.jpg") center 35% / cover no-repeat;
}
.hero::before {
  content:""; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1;
  background: linear-gradient(270deg, rgba(0,99,140,.82) 0%, rgba(0,132,188,.94) 100%);
  pointer-events:none;
}
.hero .container { position:relative; z-index:2; }
.hero-badges { display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1.1rem; }
.hero-badge {
  display:inline-flex; align-items:center; gap:.5em;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.35);
  color:#fff; font-weight:500; font-size:.82rem; letter-spacing:.03em; text-transform:uppercase;
  padding:.42em 1em; border-radius:50px;
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.hero-badge i { color:#fff; font-size:.85em; }
.hero h1 { color:#fff; font-size:clamp(2rem,4.4vw,3.1rem); margin-bottom:.25em; text-shadow:0 2px 18px rgba(0,40,60,.35); }
.hero-rncp { font-family:var(--ff-body); font-size:1rem; color:rgba(255,255,255,.9); margin:0; text-shadow:0 1px 10px rgba(0,40,60,.3); }
.gloss-sigles { font-family:var(--ff-serif); font-style:italic; color:rgba(255,255,255,.85); margin-top:.5rem; font-size:1.05rem; }

/* ============================================================
   CONTAINER ALIAS
   ============================================================ */
.container { max-width:var(--container); margin:0 auto; padding:0 24px; }

/* ============================================================
   SECTIONS GÉNÉRIQUES
   ============================================================ */
.section { padding:80px 0; scroll-margin-top:calc(var(--header-h) + var(--anchor-h)); }
.section.tint { background:var(--pds-tint); }

/* ============================================================
   BARRE GLOSSAIRE STICKY (index)
   ============================================================ */
.gloss-bar {
  position:sticky; top:var(--header-h); z-index:900;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--pds-line);
  box-shadow:0 4px 18px rgba(0,72,104,.05);
}
.gloss-bar .container { padding-top:.9rem; padding-bottom:.9rem; }

.cat-nav { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.8rem; }
.cat-nav a {
  display:inline-flex; align-items:center; padding:.5rem .9rem;
  border-radius:8px; font-size:.85rem; font-weight:600;
  color:var(--pds-blue-deep); background:var(--pds-tint);
  border:1px solid #e2f0f8; white-space:nowrap;
  transition:background .2s,color .2s,border-color .2s;
}
.cat-nav a:hover { background:var(--pds-blue); color:#fff; border-color:var(--pds-blue); }

.gloss-search { position:relative; margin-bottom:.8rem; }
.gloss-search i { position:absolute; left:1.1rem; top:50%; transform:translateY(-50%); color:var(--pds-blue); font-size:.95rem; }
.gloss-search input {
  width:100%; padding:.8rem 1rem .8rem 2.7rem;
  border:2px solid var(--pds-line); border-radius:30px;
  font-size:.95rem; font-family:inherit; color:var(--pds-ink);
  transition:border-color .2s, box-shadow .2s;
}
.gloss-search input:focus { outline:none; border-color:var(--pds-blue); box-shadow:0 0 0 4px var(--pds-tint); }

.alpha-nav { display:flex; flex-wrap:wrap; gap:.35rem; }
.alpha-nav a {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:30px; padding:0 .35rem; border-radius:7px;
  font-size:.85rem; font-weight:700; color:var(--pds-blue-deep);
  background:var(--pds-tint); transition:background .2s,color .2s;
}
.alpha-nav a:hover { background:var(--pds-blue); color:#fff; }

/* ============================================================
   SECTION THÉMATIQUE (index)
   ============================================================ */
.gloss-section-title { font-family:var(--ff-serif); font-weight:700; font-size:1.45rem; color:var(--pds-ink); margin:0 0 1.5rem; }

.cat-section { margin-bottom:2.4rem; scroll-margin-top:calc(var(--header-h) + 205px); }
.cat-header {
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.75rem 1.15rem; border-radius:10px;
  font-family:var(--ff-serif); font-weight:700; font-size:1.05rem; margin-bottom:1.2rem;
}
.cat-header .count {
  font-family:'Jost',sans-serif; font-size:.76rem; font-weight:600;
  background:rgba(255,255,255,.6); padding:.22rem .65rem; border-radius:20px; white-space:nowrap;
}

.terms-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
@media (max-width:680px) { .terms-grid { grid-template-columns:1fr; } }

.term-card {
  display:block; position:relative; background:#fff;
  border:1px solid var(--pds-line); border-radius:12px; padding:1.1rem 1.2rem;
  transition:box-shadow .3s,transform .3s,border-color .3s;
}
.term-card:hover { box-shadow:var(--shadow-soft); border-color:#cfe3ee; transform:translateY(-3px); }
.term-title { font-family:var(--ff-serif); font-weight:700; font-size:1.1rem; color:var(--pds-ink); }
.term-full { font-size:.82rem; color:var(--pds-blue); font-weight:600; margin:.15rem 0 .45rem; }
.term-tagline { font-size:.9rem; color:var(--pds-body); line-height:1.5; }
.term-go {
  display:inline-flex; align-items:center; gap:.45rem; margin-top:.9rem;
  padding:.42rem .9rem; border-radius:9px;
  background:var(--pds-tint); border:1px solid #d4e9f4;
  color:var(--pds-blue-deep); font-weight:600; font-size:.82rem;
  transition:background .25s,color .25s,border-color .25s,box-shadow .25s,transform .25s;
}
.term-go i { font-size:.78em; transition:transform .2s; }
.term-card:hover .term-go { background:var(--pds-gradient); border-color:transparent; color:#fff; box-shadow:0 6px 16px rgba(0,132,188,.25); transform:translateY(-1px); }
.term-card:hover .term-go i { transform:translateX(3px); }

/* ============================================================
   SECTION ALPHABÉTIQUE (index)
   ============================================================ */
.alpha-group { margin-bottom:1.8rem; scroll-margin-top:calc(var(--header-h) + 205px); }
.alpha-letter {
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px;
  background:var(--pds-gradient); color:#fff;
  font-family:var(--ff-serif); font-weight:700; font-size:1.1rem; margin-bottom:.8rem;
}
.alpha-term {
  display:block; padding:.55rem 0;
  border-bottom:1px solid var(--pds-line);
  color:var(--pds-ink); font-weight:600;
}
.alpha-term span { color:var(--pds-body); font-weight:400; font-size:.88rem; }
.alpha-term:hover { color:var(--pds-blue); }

/* ============================================================
   FICHE GLOSSAIRE — breadcrumb sticky
   ============================================================ */
.crumbs {
  position:sticky; top:var(--header-h); z-index:900;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--pds-line);
  box-shadow:0 4px 18px rgba(0,72,104,.05);
}
.crumbs .container { padding-top:.85rem; padding-bottom:.85rem; font-size:.85rem; color:var(--pds-body); }
.crumbs a { color:var(--pds-blue); font-weight:600; }
.crumbs a:hover { color:var(--pds-blue-deep); }
.crumbs .sep { margin:0 .5rem; color:#b9c6ce; }
.crumbs .cur { color:var(--pds-ink); font-weight:600; }

/* ============================================================
   FICHE GLOSSAIRE — article
   ============================================================ */
.gloss-article { max-width:840px; }
.definition-block {
  font-size:1.12rem; line-height:1.7; color:var(--pds-ink);
  background:var(--pds-tint); border-left:4px solid var(--pds-blue);
  border-radius:0 12px 12px 0; padding:1.3rem 1.5rem; margin-bottom:1.6rem;
}
.gloss-byline { display:flex; align-items:center; gap:.8rem; margin-bottom:2rem; padding-bottom:1.6rem; border-bottom:1px solid var(--pds-line); }
.gloss-byline .av {
  flex:none; width:46px; height:46px; border-radius:50%;
  background:var(--pds-gradient); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-family:var(--ff-serif);
}
.gloss-byline .name { font-weight:700; color:var(--pds-ink); line-height:1.2; }
.gloss-byline .role { font-size:.85rem; color:var(--pds-body); }
.gloss-article h2 { font-family:var(--ff-serif); font-size:1.4rem; color:var(--pds-ink); margin:2rem 0 .8rem; }
.gloss-article p { color:var(--pds-body); line-height:1.75; margin-bottom:1rem; font-size:1rem; }
.gloss-article ul { margin:0 0 1rem 1.2rem; color:var(--pds-body); line-height:1.7; }
.metier-box { margin:2.2rem 0; padding:1.2rem 1.5rem; background:var(--pds-gradient); color:#fff; border-radius:14px; }
.metier-box .lbl { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; opacity:.9; font-weight:700; margin-bottom:.3rem; }
.metier-box .val { font-family:var(--ff-serif); font-size:1.15rem; font-weight:700; }
.related-section { margin-top:2.2rem; padding-top:1.6rem; border-top:1px solid var(--pds-line); }
.related-section h3 { font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--pds-blue); font-weight:700; margin-bottom:1rem; }
.related-link {
  display:inline-block; background:var(--pds-tint); border:1px solid #e2f0f8;
  border-radius:20px; padding:.42rem 1rem; font-size:.85rem;
  color:var(--pds-blue-deep); font-weight:600; margin:0 .5rem .5rem 0;
}
.related-link:hover { background:var(--pds-blue); color:#fff; border-color:var(--pds-blue); }
.gloss-back { display:inline-block; margin-top:2rem; font-weight:600; color:var(--pds-blue); }
.gloss-back:hover { color:var(--pds-blue-deep); }

/* ============================================================
   CTA FINAL PLEINE LARGEUR
   ============================================================ */
.foot-cta { background:var(--pds-gradient); color:#fff; text-align:center; padding:70px 0; }
.foot-cta h2 { font-family:var(--ff-serif); color:#fff; font-size:clamp(1.6rem,3.5vw,2.4rem); margin-bottom:.6rem; }
.foot-cta p { color:rgba(255,255,255,.92); max-width:560px; margin:0 auto 1.8rem; font-size:1.08rem; }
.foot-cta .btns { display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap; }
.foot-cta .fbtn {
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--ff-body); font-weight:600; font-size:1rem;
  padding:.85em 1.6em; border-radius:8px; border:2px solid #fff;
  transition:background .2s,color .2s,transform .15s;
}
.foot-cta .fbtn-solid { background:#fff; color:var(--pds-blue-deep); }
.foot-cta .fbtn-solid:hover { background:var(--pds-blue-deep); color:#fff; }
.foot-cta .fbtn-ghost { background:transparent; color:#fff; }
.foot-cta .fbtn-ghost:hover { background:#fff; color:var(--pds-blue-deep); }

/* ============================================================
   CERTIFICATIONS
   ============================================================ */
.certifs { background:var(--pds-tint); padding:54px 0; }
.certifs .inner { display:grid; grid-template-columns:auto 1fr; gap:42px; align-items:center; }
@media (max-width:768px){ .certifs .inner{ grid-template-columns:1fr; gap:26px; } }
.certif-logos { display:flex; gap:18px; flex-wrap:wrap; }
.certif-logos .cl {
  background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.06); padding:18px 24px;
  display:flex; align-items:center; justify-content:center; height:116px;
}
.certif-logos .cl img { max-height:78px; width:auto; display:block; }
@media (max-width:768px){ .certif-logos .cl{ height:100px; } .certif-logos .cl img{ max-height:64px; } }
.certif-text { color:var(--pds-body); line-height:1.65; font-size:.92rem; }
.certif-text strong { color:var(--pds-ink); font-weight:600; }
.certif-text .af { display:block; margin-top:12px; color:var(--pds-orange); font-weight:700; font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; }

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; animation:revealAuto .8s ease forwards; }
.reveal.in { opacity:1; transform:none; animation:none; }
@keyframes revealAuto { to { opacity:1; transform:none; } }