/* Pages Mindmap Card — v1.5.0
   - Desktop + Tablette: grille 3x3 (centre + 8 autour). Tablette = layout PC réduit via variables.
   - Mobile: centre en haut, enfants en dessous en 1 colonne sous forme de labels pleine largeur.
   - Hover: scale + bord + ombre sombre
   - Overlay menu: animation in/out
   - Menu tags hover: bord + ombre
*/

.pmc-wrap{ width:100%; display:flex; justify-content:center; }
.pmc-stage{ width:100%; margin:0 auto; display:grid; place-items:center; }

.pmc-wrap{
  --pmc-child-w: 360px;
  --pmc-child-h: 150px;
  --pmc-center-w: 396px;
  --pmc-center-h: 165px;
  --pmc-gap: 18px;
  --pmc-child-pad-y: 22px;
  --pmc-child-pad-x: 28px;
  --pmc-center-pad-y: 24px;
  --pmc-center-pad-x: 30px;
}

.pmc-grid{
  width:100%;
  display:grid;
  grid-template-columns:1.05fr 1.9fr 1.05fr;
  grid-template-rows:1.05fr 1.9fr 1.05fr;
  gap: var(--pmc-gap);
  align-items:center;
  justify-items:center;
}

.pmc-children{ display: contents; }
.pmc-slot{ width:100%; display:grid; place-items:center; }

.pmc-pos-1-1{ grid-row:1; grid-column:1; }
.pmc-pos-1-2{ grid-row:1; grid-column:2; }
.pmc-pos-1-3{ grid-row:1; grid-column:3; }
.pmc-pos-2-1{ grid-row:2; grid-column:1; }
.pmc-pos-2-2{ grid-row:2; grid-column:2; }
.pmc-pos-2-3{ grid-row:2; grid-column:3; }
.pmc-pos-3-1{ grid-row:3; grid-column:1; }
.pmc-pos-3-2{ grid-row:3; grid-column:2; }
.pmc-pos-3-3{ grid-row:3; grid-column:3; }

.pmc-center{ position:relative; width:100%; display:grid; place-items:center; }

.pmc-node{
  width:min(var(--pmc-child-w), 95%);
  min-height: var(--pmc-child-h);
  border-radius:9999px;
  padding: var(--pmc-child-pad-y) var(--pmc-child-pad-x);
  border:2px solid rgba(0,0,0,.14);
  background:rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 12px 28px rgba(0,0,0,.12);
  cursor:pointer;
  display:grid;
  place-items:center;
  text-align:center;
  user-select:none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, border-width .16s ease, filter .16s ease;
}

.pmc-node:hover,
.pmc-node:focus-visible{
  transform: scale(1.05);
  border-color: rgba(0,0,0,.32);
  border-width: 3px;
  box-shadow: 0 20px 44px rgba(0,0,0,.24);
}

.pmc-node-center{
  width:min(var(--pmc-center-w), 95%);
  min-height: var(--pmc-center-h);
  padding: var(--pmc-center-pad-y) var(--pmc-center-pad-x);
  position:relative;
  background: rgba(255,255,255,.36);
}

.pmc-node-link{
  display:inline-block;
  font-size:clamp(18px,2.0vw,28px);
  font-weight:900;
  line-height:1.1;
  text-decoration:none;
  color:inherit;
  white-space:normal;
  word-break:break-word;
  padding:8px 10px;
  border-radius:18px;
  background:rgba(255,255,255,.22);
}
.pmc-node-link:hover{
  filter:brightness(.98);
  text-decoration:underline;
  text-underline-offset:5px;
}

.pmc-nav{
  position:absolute;
  top:10px;
  width:34px;
  height:34px;
  border-radius:9999px;
  border:1px solid rgba(0,0,0,.16);
  background:rgba(255,255,255,.40);
  box-shadow:0 8px 18px rgba(0,0,0,.10);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-weight:900;
  line-height:1;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.pmc-nav:hover{ transform: scale(1.08); box-shadow:0 14px 26px rgba(0,0,0,.20); border-color: rgba(0,0,0,.28); }
.pmc-nav:disabled{ opacity:.45; cursor:default; transform:none; }
.pmc-nav-up{ left:10px; }
.pmc-nav-root{ right:10px; }

.pmc-color-1{ background:rgba(255,241,242,.55); }
.pmc-color-2{ background:rgba(240,249,255,.55); }
.pmc-color-3{ background:rgba(240,253,244,.55); }
.pmc-color-4{ background:rgba(254,252,232,.55); }
.pmc-color-5{ background:rgba(250,245,255,.55); }
.pmc-color-6{ background:rgba(255,247,237,.55); }
.pmc-color-7{ background:rgba(245,245,245,.55); }
.pmc-color-8{ background:rgba(236,254,255,.55); }

.pmc-overlay{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%) scale(.98);
  width:min(var(--pmc-center-w), 95%);
  z-index:40;
  opacity:0;
  pointer-events:none;
  transition: opacity .18s ease, transform .18s ease;
}
.pmc-overlay.is-open{
  opacity:1;
  transform: translate(-50%,-50%) scale(1);
  pointer-events:auto;
}
.pmc-overlay-stack{
  width:100%;
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:24px;
  background:rgba(255,255,255,.20);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(0,0,0,.12);
  box-shadow:0 22px 48px rgba(0,0,0,.16);
}
.pmc-overlay-title{
  font-weight: 900;
  letter-spacing: .5px;
  opacity: .85;
  text-align: center;
  padding: 4px 10px 2px;
}
.pmc-divider{
  height: 1px;
  width: 100%;
  background: rgba(0,0,0,.12);
  border-radius: 99px;
}

.pmc-tag{
  width:100%;
  display:block;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.10);
  text-decoration:none;
  font-weight:900;
  line-height:1.12;
  white-space:normal;
  word-break:break-word;
  text-align:center;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, filter .14s ease;
}
.pmc-tag:hover{
  transform: translateY(-1px);
  border-color: rgba(0,0,0,.26);
  box-shadow: 0 14px 26px rgba(0,0,0,.18);
  filter: brightness(.99);
}
.pmc-tag-empty{ opacity:.7; font-weight:700; }

@media (max-width: 1024px) and (min-width: 641px){
  .pmc-wrap{
    --pmc-child-w: 300px;
    --pmc-child-h: 122px;
    --pmc-center-w: 330px;
    --pmc-center-h: 135px;
    --pmc-gap: 12px;
    --pmc-child-pad-y: 18px;
    --pmc-child-pad-x: 22px;
    --pmc-center-pad-y: 20px;
    --pmc-center-pad-x: 24px;
  }
  .pmc-node-link{ font-size: clamp(16px, 2.0vw, 22px); }
}

@media (max-width: 640px){
  .pmc-grid{
    display:flex;
    flex-direction:column;
    gap: 12px;
    align-items:stretch;
  }
  .pmc-center{ width:100%; }
  .pmc-node,
  .pmc-node-center{
    width:100%;
    min-height: auto;
  }
  .pmc-children{
    display:grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
  }
  .pmc-slot{ width:100%; }
  .pmc-node.pmc-node-child{
    border-radius: 18px;
    padding: 14px 16px;
  }
  .pmc-overlay{ display:none; }
}