/* ══ RESET TOTAL anti-Bootstrap ══ */
html { box-sizing:border-box!important; height:100%!important; margin:0!important; padding:0!important; overflow:hidden!important; }
body { box-sizing:border-box!important; margin:0!important; padding:0!important; height:100%!important; overflow:hidden!important; background:#0D0E11!important; font-family:'DM Sans',sans-serif!important; }
*,*::before,*::after { box-sizing:border-box!important; }
a { text-decoration:none!important; color:inherit!important; }

/* ══ NAV ══ */
#miq-nav {
  position:fixed!important; top:0!important; left:0!important; right:0!important; z-index:9999!important;
  height:62px!important;
  display:flex!important; align-items:center!important; justify-content:space-between!important;
  padding:0 2rem!important;
  background:#eeecea!important;
  border-bottom:1px solid #E0DDD8!important;
  box-shadow:0 2px 12px rgba(0,0,0,.06)!important;
  margin:0!important; width:100%!important;
}
#miq-nav .nav-logo-text {
  font-family:'Syne',sans-serif!important;
  font-weight:800!important;
  font-size:1.35rem!important;
  color:#111110!important;
  letter-spacing:-.04em!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
}
#miq-nav .nav-logo-text span { color:#1A4FD6!important; }
#miq-nav .nav-location {
  display:flex!important;
  align-items:center!important;
  gap:.4rem!important;
  font-family:'DM Sans',sans-serif!important;
  font-size:.78rem!important;
  font-weight:500!important;
  color:#7A7870!important;
  letter-spacing:.01em!important;
}

/* ══ LOGO CENTRAL ══ */
#miq-center-logo {
  position:fixed!important;
  top:calc(62px + (100vh - 62px) / 2)!important;
  left:50%!important;
  transform:translate(-50%,-50%)!important;
  z-index:9998!important;
  display:flex!important; align-items:center!important; justify-content:center!important;
  pointer-events:none!important;
}
#miq-center-logo img { height:120px!important; width:auto!important; }

/* ══ GRILLE ══ */
#miq-portail {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  grid-template-rows:calc(50vh - 31px) calc(50vh - 31px)!important;
  height:calc(100vh - 62px)!important;
  width:100vw!important;
  margin:62px 0 0 0!important;
  padding:0!important;
  gap:0!important;
  float:none!important;
}

/* ══ TUILES ══ */
#miq-portail .tuile {
  position:relative!important; overflow:hidden!important;
  display:flex!important; flex-direction:column!important; justify-content:flex-end!important;
  padding:3rem!important;
  margin:0!important; width:auto!important; height:auto!important; float:none!important;
  cursor:pointer!important;
  opacity:0; transform:scale(.98);
  transition:opacity .6s, transform .6s;
  text-decoration:none!important; color:#fff!important;
}
#miq-portail .tuile.visible { opacity:1!important; transform:scale(1)!important; }

#miq-portail .tuile:nth-child(1) { border-right:1px solid rgba(255,255,255,.07)!important; border-bottom:1px solid rgba(255,255,255,.07)!important; background:#0D0E11!important; }
#miq-portail .tuile:nth-child(2) { border-bottom:1px solid rgba(255,255,255,.07)!important; background:#0C0F0E!important; }
#miq-portail .tuile:nth-child(3) { border-right:1px solid rgba(255,255,255,.07)!important; background:#0C0D14!important; }
#miq-portail .tuile:nth-child(4) { background:#100D0A!important; }

/* Glow */
#miq-portail .tuile::before { content:''; position:absolute!important; inset:0!important; z-index:0!important; transition:opacity .5s; pointer-events:none!important; }
#miq-portail .tuile-pro::before    { background:radial-gradient(ellipse 80% 80% at 10% 90%, rgba(26,79,214,.3) 0%,transparent 65%); opacity:.5; }
#miq-portail .tuile-part::before   { background:radial-gradient(ellipse 80% 80% at 90% 90%, rgba(5,150,105,.25) 0%,transparent 65%); opacity:.5; }
#miq-portail .tuile-client::before { background:radial-gradient(ellipse 80% 80% at 10% 90%, rgba(99,102,241,.28) 0%,transparent 65%); opacity:.5; }
#miq-portail .tuile-shop::before   { background:radial-gradient(ellipse 80% 80% at 90% 90%, rgba(217,119,6,.22) 0%,transparent 65%); opacity:.5; }
#miq-portail .tuile:hover::before  { opacity:1!important; }

/* Grille hover */
#miq-portail .tuile::after { content:''; position:absolute!important; inset:0!important; z-index:0!important; pointer-events:none!important; background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px); background-size:44px 44px; opacity:0; transition:opacity .4s; }
#miq-portail .tuile:hover::after { opacity:1!important; }

#miq-portail .tuile > * { position:relative!important; z-index:1!important; }

/* Numéro déco */
#miq-portail .tuile-num { position:absolute!important; top:1.75rem!important; right:2.5rem!important; font-family:'Syne',sans-serif!important; font-size:4rem!important; font-weight:800!important; letter-spacing:-.06em!important; line-height:1!important; color:rgba(255,255,255,.04)!important; z-index:0!important; pointer-events:none!important; transition:color .4s; margin:0!important; padding:0!important; }
#miq-portail .tuile:hover .tuile-num { color:rgba(255,255,255,.07)!important; }

/* Icône */
#miq-portail .tuile-icon { font-size:2.75rem!important; margin-bottom:1.1rem!important; display:block!important; transform:translateY(6px); transition:transform .4s cubic-bezier(.22,.61,.36,1); filter:drop-shadow(0 4px 16px rgba(0,0,0,.4)); }
#miq-portail .tuile:hover .tuile-icon { transform:translateY(0) scale(1.06)!important; }

/* Badge */
#miq-portail .tuile-badge { display:inline-flex!important; align-items:center!important; font-size:.68rem!important; font-weight:700!important; letter-spacing:.09em!important; text-transform:uppercase!important; padding:.28rem .8rem!important; border-radius:100px!important; margin-bottom:.85rem!important; width:fit-content!important; transition:transform .3s; }
#miq-portail .tuile:hover .tuile-badge { transform:translateX(3px)!important; }
#miq-portail .badge-blue   { background:rgba(26,79,214,.2)!important;  color:#6CAEFF!important;  border:1px solid rgba(108,174,255,.2)!important; }
#miq-portail .badge-green  { background:rgba(5,150,105,.18)!important; color:#34D399!important;  border:1px solid rgba(52,211,153,.2)!important;  }
#miq-portail .badge-indigo { background:rgba(99,102,241,.2)!important; color:#A5B4FC!important;  border:1px solid rgba(165,180,252,.2)!important; }
#miq-portail .badge-amber  { background:rgba(217,119,6,.18)!important; color:#FCD34D!important;  border:1px solid rgba(252,211,77,.2)!important;  }

/* Titre */
#miq-portail .tuile-title { font-family:'Syne',sans-serif!important; font-size:clamp(1.7rem,2.3vw,2.6rem)!important; font-weight:800!important; letter-spacing:-.035em!important; line-height:1.06!important; color:#fff!important; margin-bottom:.6rem!important; padding:0!important; transition:transform .3s; }
#miq-portail .tuile:hover .tuile-title { transform:translateX(4px)!important; }

/* Description */
#miq-portail .tuile-desc { font-size:.875rem!important; color:rgba(255,255,255,.45)!important; line-height:1.65!important; max-width:34ch!important; margin:0!important; padding:0!important; transition:color .3s, transform .3s; }
#miq-portail .tuile:hover .tuile-desc { color:rgba(255,255,255,.8)!important; transform:translateX(4px)!important; }

/* CTA */
#miq-portail .tuile-cta { display:inline-flex!important; align-items:center!important; gap:.55rem!important; margin-top:1.75rem!important; font-size:.82rem!important; font-weight:700!important; color:rgba(255,255,255,.3)!important; transition:color .3s, gap .3s; }
#miq-portail .tuile:hover .tuile-cta { color:rgba(255,255,255,.9)!important; gap:.8rem!important; }
#miq-portail .tuile-cta-arrow { width:30px!important; height:30px!important; border-radius:50%!important; border:1.5px solid rgba(255,255,255,.12)!important; display:flex!important; align-items:center!important; justify-content:center!important; font-size:.85rem!important; background:transparent!important; transition:background .3s, border-color .3s, transform .3s; }
#miq-portail .tuile:hover .tuile-cta-arrow { background:rgba(255,255,255,.08)!important; border-color:rgba(255,255,255,.35)!important; transform:translateX(4px)!important; }

/* Ligne couleur bas */
#miq-portail .tuile-line { position:absolute!important; bottom:0!important; left:0!important; right:0!important; height:3px!important; transform:scaleX(0); transform-origin:left; transition:transform .45s cubic-bezier(.22,.61,.36,1); }
#miq-portail .tuile-pro    .tuile-line { background:linear-gradient(90deg,#1A4FD6,#6CAEFF)!important; }
#miq-portail .tuile-part   .tuile-line { background:linear-gradient(90deg,#059669,#34D399)!important; }
#miq-portail .tuile-client .tuile-line { background:linear-gradient(90deg,#4F46E5,#A5B4FC)!important; }
#miq-portail .tuile-shop   .tuile-line { background:linear-gradient(90deg,#D97706,#FCD34D)!important; }
#miq-portail .tuile:hover  .tuile-line { transform:scaleX(1)!important; }

/* ══ RESPONSIVE ══ */
@media(max-width:768px) {
  html,body { overflow:auto!important; }
  #miq-portail { grid-template-columns:1fr!important; grid-template-rows:repeat(4,56vh)!important; height:auto!important; }
  #miq-portail .tuile:nth-child(1),
  #miq-portail .tuile:nth-child(2),
  #miq-portail .tuile:nth-child(3) { border-right:none!important; border-bottom:1px solid rgba(255,255,255,.07)!important; }
  #miq-portail .tuile { padding:2rem 1.75rem!important; }
  #miq-portail .tuile-num { font-size:3rem!important; }
}