/* .auto-container{max-width: 90% !important;} */
.scroll-top.open {
    bottom: 10px;
    right: 15px;
}
header{z-index: 1;}
.chat-wrapper{z-index: 100;}







/*  NEWS BAND (Actualités) */
.news-band{
  background: #1b519d;
  color: #fff;
  padding: 10px 0;
}

.news-band__inner{
  display: flex;
  align-items: center;
  gap: 14px;
}

.news-band__label{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  letter-spacing: .2px;
  white-space: nowrap;
  padding-right: 10px;
  border-right: 1px solid rgba(255,255,255,.25);
}

.news-band__dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #ffcc00;
  box-shadow: 0 0 0 3px rgba(255,204,0,.2);
}

.news-band__marquee{
  position: relative;
  overflow: hidden;
  flex: 1;
  min-width: 0;
}

.news-band__track{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
  white-space: nowrap;
  will-change: transform;
  animation: newsMarquee 38s linear infinite;
}

.news-band__marquee:hover .news-band__track{
  animation-play-state: paused;
}

.news-band__link{
  color: rgba(255,255,255,.95);
  text-decoration: none;
  font-weight: 500;
}

.news-band__link:hover{
  text-decoration: underline;
  color: rgba(255,255,255,.45);
}

.news-band__sep{
  color: rgba(255,255,255,.45);
}

.news-band__more{
  white-space: nowrap;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08);
}

.news-band__more:hover{
  background: rgba(255,255,255,.14);
}

@keyframes newsMarquee{
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

html[dir="rtl"] .news-band__track{
  animation-direction: reverse;
}

@media (prefers-reduced-motion: reduce){
  .news-band__track{ animation: none; }
  .news-band__marquee{ overflow-x: auto; }
}

/*  NEWS BAND (Actualités) End */


/*  E-Service */
.e-service-section{
  padding: 72px 0 84px;
  background: #fff;
}

.e-service-title{
  font-weight: 800;
  font-size: clamp(26px, 2.2vw, 38px);
  line-height: 1.15;
  margin: 0 0 34px;
  color: #23285c;
  letter-spacing: .2px;
}

.e-service-card{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;

  min-height: 190px;
  padding: 34px 18px;

  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border: 1px solid rgba(15, 23, 42, .08);

  box-shadow:
    0 18px 40px rgba(2, 6, 23, .10),
    0 2px 10px rgba(2, 6, 23, .04);

  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  overflow: hidden;
}

.e-service-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(500px 220px at 50% -20%, rgba(27,99,255,.18), transparent 60%);
  opacity: 0;
  transition: opacity .25s ease;
}

.e-service-card:hover{
  transform: translateY(-6px);
  border-color: rgba(27,99,255,.22);
  box-shadow:
    0 26px 60px rgba(2, 6, 23, .14),
    0 6px 18px rgba(2, 6, 23, .06);
}

.e-service-card:hover::before{
  opacity: 1;
}

.es-title{
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
  color: #23285c;
  text-align: center;
}

.es-icon{
  width: 78px;
  height: 78px;
  border-radius: 999px;
  display: grid;
  place-items: center;

  background: #f3f7ff;
  border: 1px solid rgba(27,99,255,.18);

  box-shadow: 0 10px 26px rgba(27,99,255,.10);
  color: #1b63ff;

  position: relative;
  z-index: 1;
}

.es-icon svg{
  width: 32px;
  height: 32px;
}

.e-service-card:focus{
  outline: none;
}
.e-service-card:focus-visible{
  outline: 3px solid rgba(27,99,255,.35);
  outline-offset: 3px;
}

@media (max-width: 991px){
  .e-service-card{ min-height: 175px; }
}


/* ===== E-Service End ===== */




/* ===== ABHSM Barrages Section  ===== */
  .abhsm-barrages-section{
    padding: 56px 0;
    background: #fff;
  }

  .abhsm-row{ row-gap: 22px; }

  .abhsm-panel{
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 18px;
    box-shadow: 0 18px 50px rgba(2, 6, 23, .08);
    overflow: hidden;
  }

  /* ---------- Ticker ---------- */
  .abhsm-ticker{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(15, 23, 42, .06);
    background: linear-gradient(180deg, #fff 0%, #fbfdff 100%);
  }

  .abhsm-ticker__badge{
    display: inline-flex;
    align-items: center;
    padding: 7px 10px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 12px;
    color: #fff;
    background: #1b519d; /* change brand color here */
  }

  .abhsm-ticker__marquee{
    overflow: hidden;
    flex: 1;
    min-width: 0;
  }

  .abhsm-ticker__track{
    display: inline-flex;
    align-items: center;
    gap: 14px;
    white-space: nowrap;
    will-change: transform;
    animation: abhsmTicker 26s linear infinite;
    color: rgba(2, 6, 23, .72);
    font-size: 13px;
  }

  .abhsm-ticker__track .sep{ opacity: .35; }
  .abhsm-ticker__track .up{ color: #16a34a; font-weight: 900; }
  .abhsm-ticker__track .down{ color: #dc2626; font-weight: 900; }

  .abhsm-ticker__marquee:hover .abhsm-ticker__track{
    animation-play-state: paused;
  }

  @keyframes abhsmTicker{
    from{ transform: translateX(0); }
    to{ transform: translateX(-50%); }
  }

  /* ---------- Chart head ---------- */
  .abhsm-chart-head{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 18px 18px 10px;
    gap: 12px;
  }

  .abhsm-chart-title h3{
    margin: 0;
    font-size: 20px;
    font-weight: 900;
    color: #23285c;
  }
  .abhsm-chart-title h3 span{ color: #1b519d; }

  .abhsm-subline{
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .abhsm-pill{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 999px;
    background: #f6f8fc;
    border: 1px solid rgba(15, 23, 42, .07);
    color: rgba(2,6,23,.70);
    font-size: 12px;
    font-weight: 700;
  }

  .abhsm-icon-btn{
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, .10);
    background: #fff;
    display: grid;
    place-items: center;
    color: rgba(2,6,23,.65);
    transition: transform .2s ease, box-shadow .2s ease;
    flex: 0 0 auto;
  }
  .abhsm-icon-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(2,6,23,.10);
  }
  .abhsm-icon-btn svg{ width: 18px; height: 18px; }

  /* ---------- Legend ---------- */
  .abhsm-legend{
    display: flex;
    gap: 18px;
    padding: 0 18px 14px;
    color: rgba(2,6,23,.65);
    font-size: 13px;
    flex-wrap: wrap;
  }

  .abhsm-legend__item{
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }

  .dot{
    width: 10px;
    height: 10px;
    border-radius: 3px;
    display: inline-block;
  }
  .dot-a{ background: #1b519d; }
  .dot-b{ background: rgba(10, 91, 211, .24); }

  /* ---------- Chart area ---------- */
  .abhsm-chart-wrap{
    padding: 6px 14px 18px;
    height: 380px;
  }

  /* ---------- Details / Table ---------- */
  .abhsm-details{
    padding: 0 18px 18px;
  }
  .abhsm-details summary{
    cursor: pointer;
    font-weight: 900;
    color: rgba(2,6,23,.80);
    padding: 12px 0 6px;
  }
  .abhsm-table-wrap{
    overflow: auto;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, .08);
    background: #fff;
  }
  .abhsm-table{
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
  }
  .abhsm-table th,
  .abhsm-table td{
    padding: 10px 12px;
    border-bottom: 1px solid rgba(15, 23, 42, .07);
    font-size: 13px;
    white-space: nowrap;
  }
  .abhsm-table thead th{
    background: #f6f8fc;
    font-weight: 900;
  }
  .abhsm-table tfoot td{
    background: #f6f8fc;
  }

  /* S'informer  */
  .abhsm-panel--info{
    padding: 18px;
    border-radius: 18px;
    background: #fff;
  }

  .abhsm-info-title{
    margin: 6px 6px 14px;
    font-size: 18px;
    font-weight: 900;
    color: #23285c;
  }

  /* Grid */
  .abhsm-info-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* Tile button */
  .abhsm-tile{
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px 14px;
    border-radius: 14px;

    background: #f7faff;
    border: 1px solid rgba(15, 23, 42, .08);

    text-decoration: none;
    color: #23285c;
    font-weight: 800;
    line-height: 1.15;

    min-height: 66px;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  }

  .abhsm-tile:hover{
    transform: translateY(-2px);
    background: #ffffff;
    border-color: rgba(10, 91, 211, .18);
    box-shadow: 0 16px 34px rgba(2, 6, 23, .10);
  }

  /* Icon box (like screenshot) */
  .abhsm-tile__ico{
    width: 30px;
    height: 30px;
    border-radius: 12px;

    display: grid;
    place-items: center;

    background: #ffffff;
    border: 1px solid rgba(10, 91, 211, .18);

    color: #1b519d;
    flex: 0 0 auto;
  }

  .abhsm-tile__ico svg{
    width: 22px;
    height: 22px;
  }

  .abhsm-tile__text{
    font-size: 11px;
    letter-spacing: .1px;
  }

  /* Last item full width */
  .abhsm-tile--wide{
    grid-column: 1 / -1;
  }

  /* Mobile */
  @media (max-width: 575px){
    .abhsm-info-grid{ grid-template-columns: 1fr; }
    .abhsm-tile--wide{ grid-column: auto; }
  }

  /* Responsive */
  @media (max-width: 991px){
    .abhsm-chart-wrap{ height: 320px; }
  }


  .abhsm-tile{
    overflow: hidden;
  }

  .abhsm-tile__text{
    flex: 1 1 auto;
    min-width: 0;
    white-space: normal !important; 
    word-break: break-word;
    line-height: 1.2;
  }

  .abhsm-panel--info a{
    white-space: normal !important;
  }




  /* ===== Bento under S'informer ===== */
  .abhsm-bento{
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(15, 23, 42, .08);

    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
  }

  .bento-card{
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, .08);

    text-decoration: none;
    color: #23285c;

    box-shadow: 0 10px 26px rgba(2,6,23,.06);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    overflow: hidden;
  }

  .bento-card:hover{
    transform: translateY(-2px);
    border-color: rgba(10, 91, 211, .18);
    box-shadow: 0 18px 40px rgba(2,6,23,.10);
  }

  .bento-card--wide{
    grid-column: 1 / -1;
    background: linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
    position: relative;
  }

  .bento-ico{
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;

    background: #f7faff;
    border: 1px solid rgba(10, 91, 211, .18);
    color: #1b519d;
    flex: 0 0 auto;
  }

  .bento-ico svg{ width: 22px; height: 22px; }

  .bento-content{
    min-width: 0; /* prevents overflow */
    flex: 1 1 auto;
  }

  .bento-title{
    font-weight: 900;
    font-size: 13px;
    line-height: 1.2;
    margin: 0 0 4px;
  }

  .bento-sub{
    font-size: 12px;
    color: rgba(2,6,23,.60);
    line-height: 1.2;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .bento-kpi{
    font-weight: 900;
    margin: 2px 0 2px;
    font-size: 18px;
  }
  .bento-kpi small{ font-size: 12px; font-weight: 800; color: rgba(2,6,23,.55); }

  .bento-kpi--ok{ color: #16a34a; font-size: 16px; }

  .bento-chip{
    margin-left: auto;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    background: rgba(10, 91, 211, .10);
    color: #1b519d;
    border: 1px solid rgba(10, 91, 211, .16);
    flex: 0 0 auto;
  }

  @media (max-width: 575px){
    .abhsm-bento{ grid-template-columns: 1fr; }
    .bento-card--wide{ grid-column: auto; }
  }

/* Évolution hydrologique (ADD) */
.abhsm-evo{
  margin: 0 18px 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(15, 23, 42, .08);
}

.abhsm-evo__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.abhsm-evo__title{
  font-weight: 900;
  color:#23285c;
  font-size: 14px;
}

.abhsm-evo__tabs{
  display:flex;
  gap: 6px;
  padding: 4px;
  border-radius: 12px;
  background:#f6f8fc;
  border:1px solid rgba(15,23,42,.07);
}

.abhsm-evo__tab{
  border:0;
  background:transparent;
  padding: 8px 12px;
  border-radius: 10px;
  font-weight: 900;
  font-size: 12px;
  color: rgba(2,6,23,.70);
  cursor:pointer;
}

.abhsm-evo__tab.is-active{
  background:#1b519d;
  color:#fff;
}

.abhsm-evo__chart{
  display:none;
  height: 210px;           /* ajuste si tu veux */
}

.abhsm-evo__chart.is-active{ display:block; }

.abhsm-evo__chart canvas{
  width:100% !important;
  height:100% !important;
  display:block;
}
/* ===== ABHSM Barrages Section End ===== */


/* ===== ABHSM Zone d'action ===== */
.abhsm-zone{
  padding: 70px 0;
  background: #ffffff;
}

.abhsm-zone__grid{
  display: grid;
  grid-template-columns: 1.05fr 1fr .85fr;
  gap: 28px;
  align-items: center;
}

/* LEFT */
.abhsm-zone__kicker{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  color: rgba(2, 6, 23, .55);
  position: relative;
  padding-top: 14px;
  margin-bottom: 8px;
}

.abhsm-zone__kicker:before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width: 44px;
  height: 3px;
  border-radius: 3px;
  background: #0a5bd3;
}

.abhsm-zone__title{
  margin: 0 0 14px;
  font-size: clamp(26px, 2.2vw, 38px);
  font-weight: 900;
  color: #23285c;
  line-height: 1.15;
}

.abhsm-zone__lead{
  margin: 0 0 18px;
  color: rgba(2, 6, 23, .70);
  line-height: 1.7;
  font-size: 15px;
}

.abhsm-zone__list{
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  display: grid;
  gap: 14px;
}

.abhsm-zone__list li{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  color: rgba(2, 6, 23, .78);
  line-height: 1.6;
  font-weight: 600;
}

.abhsm-zone__check{
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(10, 91, 211, .10);
  color: #0a5bd3;
  font-weight: 900;
  flex: 0 0 auto;
  margin-top: 2px;
}

/* button */
.abhsm-zone__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border-radius: 12px;
  background: #1b519d;
  color: #fff;
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 16px 32px rgba(217, 164, 65, .22);
  transition: transform .2s ease, box-shadow .2s ease;
}
.abhsm-zone__btn:hover{
  background: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 20px 40px rgba(217, 164, 65, .28);
}



/* CENTER MAP */
.abhsm-zone__map{
  display: grid;
  place-items: center;
  padding: 10px;
}

.abhsm-zone__map img{
  max-width: 100%;
  height: auto;
  /* border-radius: 14px; */
  box-shadow: 0 18px 45px rgba(2, 6, 23, .10);
  background: #fff;
}

/* RIGHT STATS */
.abhsm-zone__stats{
  background: #1b519d;
  color: #fff;
  border-radius: 18px;
  padding: 70px 20px;
  box-shadow: 0 28px 60px rgba(24, 167, 184, .22);
  position: relative;
  overflow: hidden;
}

.abhsm-zone__stats:before{
  content:"";
  position:absolute;
  right: -60px;
  top: -60px;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.abhsm-zone__stat{
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 14px;
  padding: 14px 10px;
  border-radius: 14px;
}

.abhsm-zone__stat + .abhsm-zone__stat{
  border-top: 1px solid rgba(255,255,255,.18);
}

.abhsm-zone__icon{
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: rgba(255,255,255,.14);
  display: grid;
  place-items: center;
}

.abhsm-zone__icon svg{
  width: 28px;
  height: 28px;
}

.abhsm-zone__big{
  font-size: 28px;
  font-weight: 900;
  line-height: 1.1;
}

.abhsm-zone__small{
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.35;
  opacity: .92;
}

/* responsive */
@media (max-width: 991px){
  .abhsm-zone__grid{
    grid-template-columns: 1fr;
  }
  .abhsm-zone__map{
    order: 2;
  }
  .abhsm-zone__stats{
    order: 3;
  }
}




.abhsm-map-thumb{
  cursor: zoom-in;
}

.abhsm-lightbox{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.88);
  display: none;
  z-index: 9999;
}

.abhsm-lightbox.is-open{
  display: block;
}

.abhsm-lightbox__content{
  position: absolute;
  inset: 10px 70px 40px;
  display: grid;
  place-items: center;
}

.abhsm-lightbox__content img{
  max-width: 80%;
  max-height: 80%;
  transform: scale(1);
  transform-origin: center center;
  cursor: grab;
  user-select: none;
}

.abhsm-lightbox__close{
  position: absolute;
  top: 18px;
  left: 18px;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #fff;
  border: 0;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.abhsm-lightbox__zoom{
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: grid;
  gap: 8px;
}

.abhsm-lightbox__zoom button{
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #111;
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  font-size: 18px;
  cursor: pointer;
}

@media(max-width: 575px){
  .abhsm-lightbox__content{ inset: 60px 14px 14px; }
}
/* ===== ABHSM Zone d'action END ===== */


/* ===== Accueil thématique (Tabs) ===== */
.abhsm-tabs{
  padding: 80px 0;
  background: #fff;
}

/* Head */
.abhsm-tabs__head{
  max-width: 860px;
  margin: 0 auto 22px;
}
.abhsm-tabs__kicker{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .14em;
  color: rgba(2,6,23,.55);
  position: relative;
  display: inline-block;
  padding-top: 14px;
}
.abhsm-tabs__kicker:before{
  content:"";
  position:absolute;
  top:0; left:50%;
  transform:translateX(-50%);
  width: 46px;
  height: 3px;
  border-radius: 999px;
  background: #1b519d; /* primary */
}
.abhsm-tabs__title{
  margin: 10px 0 6px;
  font-size: clamp(30px, 3vw, 48px);
  font-weight: 950;
  color: #23285c;
  line-height: 1.05;
}
.abhsm-tabs__subtitle{
  margin: 0;
  color: rgba(2,6,23,.65);
  line-height: 1.6;
}

/* Shell */
.abhsm-tabs__shell{
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  background: #fbfdff;
  box-shadow: 0 22px 60px rgba(2,6,23,.07);
  overflow: hidden;
}

/* Tab bar (scrollable, no wrap) */
.abhsm-tabs__bar{
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;

  padding: 12px 12px 0;
  border-bottom: 1px solid rgba(15,23,42,.08);
  background: #fff;
}
.abhsm-tabs__bar::-webkit-scrollbar{ height: 8px; }
.abhsm-tabs__bar::-webkit-scrollbar-thumb{ background: rgba(2,6,23,.10); border-radius: 999px; }

/* Tab button */
.abhsm-tab{
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  padding: 12px 14px;
  border-radius: 14px 14px 0 0;
  font-weight: 900;
  font-size: 13px;
  color: rgba(2,6,23,.72);
  cursor: pointer;

  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.abhsm-tab__dot{
  width: 8px;
  height: 8px;
  border-radius: 12px;
  border: 1.8px solid rgba(27,81,157,.55);
  background: rgba(27,81,157,.06);
}

.abhsm-tab:hover{
  background: #f7faff;
  color: #23285c;
  border-color: rgba(15,23,42,.08);
}

.abhsm-tab.is-active{
  background: #f2f6ff;
  color: #1b519d;
  border-color: rgba(27,81,157,.16);
}
.abhsm-tab.is-active:after{
  content:"";
  position:absolute;
  left:14px; right:14px; bottom:-1px;
  height:2px;
  border-radius:999px;
  background:#1b519d;
}

.abhsm-tab:focus{ outline: none; }
.abhsm-tab:focus-visible{
  outline: 3px solid rgba(27,81,157,.25);
  outline-offset: 2px;
}

/* Panels (IMPORTANT: scoped to tabs only) */
.abhsm-tabs .abhsm-panels{ padding: 18px; }
.abhsm-tabs .abhsm-panel{ display: none; }
.abhsm-tabs .abhsm-panel.is-active{ display: block; }

/* Cards */
.abhsm-tabs .abhsm-cards{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}

/* Set accents per card type */
.abhsm-tabs .card-blue   { --accent:#1b519d; --soft1:#d9eaff; --soft2:#eaf2ff; }
.abhsm-tabs .card-mint   { --accent:#0f8f7a; --soft1:#c9fff2; --soft2:#eafffb; }
.abhsm-tabs .card-yellow { --accent:#b07a00; --soft1:#fff1b8; --soft2:#fff8d8; }

.abhsm-tabs .abhsm-card{
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 14px 34px rgba(2,6,23,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  min-width: 0;
}
.abhsm-tabs .abhsm-card:hover{
  transform: translateY(-3px);
  border-color: rgba(27,81,157,.16);
  box-shadow: 0 22px 52px rgba(2,6,23,.10);
}

.abhsm-tabs .abhsm-card__top{
  height: 180px;
  position: relative;
  overflow: hidden;
  background: #f7faff;
}

.abhsm-tabs .abhsm-card__cover{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transform: scale(1);
  transition: transform .25s ease;
}

.abhsm-tabs .abhsm-card:hover .abhsm-card__cover{
  transform: scale(1.06);
}

.abhsm-tabs .abhsm-card__top:after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.10) 100%);
  pointer-events:none;
}



.abhsm-tabs .abhsm-card__body{ padding: 14px 14px 16px; }
.abhsm-tabs .abhsm-card__meta{
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  color: rgba(2,6,23,.55);
  text-transform: uppercase;
}
.abhsm-tabs .abhsm-card__title{
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 950;
  line-height: 1.3;
  color: #23285c;
}
.abhsm-tabs .abhsm-card__text{
  margin: 8px 0 0;
  font-size: 13px;
  color: rgba(2,6,23,.70);
  line-height: 1.6;
}
.abhsm-tabs .abhsm-card__link{
  display: inline-flex;
  margin-top: 10px;
  font-weight: 900;
  font-size: 12px;
  text-decoration: none;
  color: #1b519d;
}
.abhsm-tabs .abhsm-card__link:hover{ text-decoration: underline; }

/* Responsive */
@media (max-width: 991px){
  .abhsm-tabs .abhsm-cards{ grid-template-columns: 1fr; }
}
@media (max-width: 575px){
  .abhsm-tabs__bar{ padding: 10px 10px 0; }
}
 /* ===== Accueil thématique (Tabs) End ===== */



 /* ===== Portails Nationaux Band ===== */
.portails-band{
  background: #2562ac;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
  padding: 12px 0;
}

.portails-band__inner{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.portails-band__label{
  color: rgba(255,255,255,.75);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.portails-band__links{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.portail-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  min-height: 52px;
  padding: 8px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.88);
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
  position: relative;
  overflow: hidden;
}

.portail-link:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.portail-link__logo{
  max-height: 50px;
  max-width: 140px;
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.portail-link:hover .portail-link__logo{
  filter: none;
  transform: scale(1.04);
}

.portail-link__text{
  display: none;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
  white-space: nowrap;
  color: rgba(255,255,255,.92);
}

.portail-link.is-text .portail-link__text,
.portail-link.text-only .portail-link__text{
  display: inline-block;
}

.portail-link.has-logo .portail-link__text{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 767px){
  .portails-band{
    padding: 14px 0;
  }

  .portails-band__inner{
    gap: 10px;
  }

  .portails-band__label{
    width: 100%;
    text-align: center;
  }

  .portail-link{
    min-width: 105px;
    min-height: 46px;
    padding: 8px 12px;
  }

  .portail-link__logo{
    max-height: 24px;
    max-width: 95px;
  }
}
 /* ===== Portails Nationaux Band End ===== */






/* ===== ABHSM Appels d’offres ===== */
.ao-content{
  --abhsm-1:#23285c;
  --abhsm-2:#1b519d;
  --abhsm-3:#2562ac;
  --abhsm-4:#11a0db;
}

.ao-tools{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 25px;
}

.ao-search{flex: 1 1 380px;}
.ao-search .form-group{position:relative;margin:0;}
.ao-search input[type="search"]{
  width:100%;
  height:55px;
  border:1px solid #d8e5f1;
  background:#fff;
  border-radius:30px;
  padding:10px 55px 10px 30px;
  font-size:16px;
  color:#666;
}
.ao-search button{
  position:absolute;
  top: 14px;
  right: 25px;
  background: transparent;
  border:0;
  font-size:16px;
  color:#666;
  cursor:pointer;
}

.ao-filters{
  display:flex;
  align-items:center;
  gap: 10px;
  flex: 0 0 auto;
}
.ao-filters select{
  height:55px;
  border:1px solid #d8e5f1;
  border-radius:30px;
  padding: 10px 18px;
  background:#fff;
  font-size:16px;
  color:#666;
  min-width: 180px;
}

.ao-table-box{
  border:1px solid #cdddef;
  border-radius: 10px;
  overflow:auto;
  background:#fff;
}

.ao-table{
  width:100%;
  border-collapse:collapse;
  /* min-width: 860px; */
}

.ao-table thead th{
  background: var(--abhsm-3);
  color:#fff;
  font-weight:700;
  font-size:16px;
  padding: 14px 18px;
  white-space: nowrap;
}

.ao-table tbody td{
  padding: 14px 12px;
  border-bottom: 1px solid #e6eef7;
  font-size: 12px;
  color:#222;
  /* vertical-align: top; */
}

.ao-table tbody tr:hover{
  background: rgba(17,160,219,.06);
}

.ao-num{
  display:inline-block;
  padding: 6px 12px;
  border-radius: 30px;
  font-weight:700;
  border: 1px solid rgba(17,160,219,.35);
  color: var(--abhsm-2);
  background: rgba(17,160,219,.10);
}

.ao-obj{line-height: 28px; }
.ao-date{color:#666; white-space:nowrap;}

.ao-badge{
  display:inline-block;
  padding: 6px 12px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.ao-badge--open{
  color: #0f7a58;
  background: rgba(16,185,129,.12);
  border: 1px solid rgba(16,185,129,.28);
}
.ao-badge--closed{
  color: #b42318;
  background: rgba(244,63,94,.10);
  border: 1px solid rgba(244,63,94,.22);
}

.ao-btn{
  display:inline-block;
  padding: 10px 12px;
  border-radius: 30px;
  border: 2px solid var(--abhsm-4);
  color: #222;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 12px;
  text-decoration:none;
}
.ao-btn i{margin-right:8px;}
.ao-btn:hover{
  background: var(--abhsm-2);
  border-color: var(--abhsm-2);
  color:#fff;
}

.ao-foot{margin-top: 12px;}
.ao-count{
  font-size: 16px;
  color:#666;
  font-weight: 700;
}

/* responsive tweaks */
@media (max-width: 991px){
  .ao-filters select{min-width: 160px;}
}
@media (max-width: 575px){
  .ao-filters{width:100%;}
  .ao-filters select{width:100%;}
}

 /* ===== ABHSM Appels d’offres End ===== */



 /* ===== ABHSM Recrutements  ===== */
.rec-content{
  --abhsm-1:#23285c;
  --abhsm-2:#1b519d;
  --abhsm-3:#2562ac;
  --abhsm-4:#11a0db;
}

.rec-table .rec-na{
  color:#999;
  font-weight:700;
}

/* Small pill links inside table */
.rec-table .rec-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 12px;
  border-radius: 30px;
  border: 1px solid rgba(17,160,219,.35);
  background: rgba(17,160,219,.10);
  color: var(--abhsm-2);
  font-weight: 800;
  font-size: 13px;
  text-decoration: none;
  white-space: nowrap;
}
.rec-table .rec-pill:hover{
  background: var(--abhsm-2);
  border-color: var(--abhsm-2);
  color:#fff;
}

.rec-table .rec-pill--soft{
  border-color: rgba(37,98,172,.30);
  background: rgba(37,98,172,.10);
  color: var(--abhsm-3);
}
.rec-table .rec-pill--ok{
  border-color: rgba(16,185,129,.28);
  background: rgba(16,185,129,.12);
  color:#0f7a58;
}
 /* ===== ABHSM Recrutements End ===== */




 /* ===== ABHSM FORMULAIRES ADMINISTRATIFS ===== */
.forms-content{
  --abhsm-1:#23285c;
  --abhsm-2:#1b519d;
  --abhsm-3:#2562ac;
  --abhsm-4:#11a0db;
}

.forms-intro{
  margin: 0 0 18px;
  color:#666;
  font-size:16px;
  line-height:28px;
}

/* Grid */
.forms-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

/* Card */
.forms-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid #cdddef;
  border-radius: 10px;
  background:#fff;
  transition: all 200ms ease;
}

.forms-card:hover{
  border-color: rgba(17,160,219,.45);
  background: rgba(17,160,219,.05);
}

.forms-card-left{min-width:0}
.forms-title{
  font-size: 16px;
  font-weight: 800;
  color:#222;
  line-height: 26px;
}
.forms-meta{
  margin-top: 4px;
  font-size: 14px;
  color:#777;
  line-height: 22px;
}

/* File tag */
.forms-file{
  display:inline-block;
  padding: 6px 12px;
  border-radius: 30px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: 8px;
  color: var(--abhsm-2);
  border: 1px solid rgba(17,160,219,.35);
  background: rgba(17,160,219,.10);
}

/* Download button (same spirit as your ao-btn) */
.forms-btn{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 30px;
  border: 2px solid var(--abhsm-4);
  color:#222;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 14px;
  text-decoration:none;
  white-space: nowrap;
}

.forms-btn:hover{
  background: var(--abhsm-2);
  border-color: var(--abhsm-2);
  color:#fff;
}

/* Responsive */
@media (max-width: 575px){
  .forms-card{
    flex-direction: column;
    align-items: flex-start;
  }
  .forms-btn{width:100%; justify-content:center;}
}
 /* ===== ABHSM FORMULAIRES ADMINISTRATIFS  End ===== */


 .linkhead{
  color: #f5a93f;
 }



















/* ============================================================
   SINFORMER PAGES — Custom Content Styles
   ============================================================ */

:root {
  --si-blue:     #0a4b78;
  --si-blue-mid: #1267a5;
  --si-accent:   #e8a020;
  --si-light:    #f4f8fc;
  --si-border:   #dce8f3;
  --si-text:     #2c3e50;
  --si-muted:    #6b7f95;
  --si-white:    #ffffff;
  --si-radius:   8px;
  --si-shadow:   0 2px 12px rgba(10,75,120,.08);
  --si-trans:    0.22s ease;
}

/* Search bar */
.si-search-wrap { position: relative; margin-bottom: 20px; }
.si-search-wrap svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; stroke: var(--si-muted); pointer-events: none; }
.si-search-input { width: 100%; padding: 11px 16px 11px 42px; border: 1.5px solid var(--si-border); border-radius: var(--si-radius); font-size: 14px; color: var(--si-text); background: var(--si-white); outline: none; transition: border-color var(--si-trans), box-shadow var(--si-trans); }
.si-search-input:focus { border-color: var(--si-blue-mid); box-shadow: 0 0 0 3px rgba(18,103,165,.10); }

/* Filter bar */
.si-filter-bar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 22px; }
.si-filter-btn { padding: 6px 16px; border-radius: 30px; font-size: 13px; font-weight: 600; border: 1.5px solid var(--si-border); background: var(--si-white); color: var(--si-muted); cursor: pointer; transition: all var(--si-trans); line-height: 1.4; }
.si-filter-btn:hover, .si-filter-btn.active { background: var(--si-blue); border-color: var(--si-blue); color: var(--si-white); }

/* Document list */
.si-doc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.si-doc-item { background: var(--si-white); border-radius: var(--si-radius); border: 1px solid var(--si-border); display: flex; align-items: center; gap: 14px; padding: 12px 16px; text-decoration: none; color: inherit; transition: border-color var(--si-trans), background var(--si-trans); }
.si-doc-item:hover { border-color: var(--si-blue-mid); background: #f0f6fd; text-decoration: none; color: inherit; }
.si-doc-ico { flex-shrink: 0; width: 38px; height: 38px; border-radius: 7px; display: flex; align-items: center; justify-content: center; }
.si-doc-ico--pdf  { background: #fdecea; color: #c62828; }
.si-doc-ico--xlsx { background: #e8f5e9; color: #2e7d32; }
.si-doc-ico--doc  { background: #e3f2fd; color: #1565c0; }
.si-doc-ico--img  { background: #f3e5f5; color: #6a1b9a; }
.si-doc-ico svg { width: 18px; height: 18px; stroke: currentColor; }
.si-doc-info { flex: 1; min-width: 0; }
.si-doc-title { display: block; font-size: 14px; font-weight: 600; color: var(--si-blue); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.si-doc-sub { display: block; font-size: 12px; color: var(--si-muted); margin-top: 2px; }
.si-doc-dl { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 6px; background: var(--si-light); color: var(--si-blue-mid); transition: background var(--si-trans), color var(--si-trans); }
.si-doc-item:hover .si-doc-dl { background: var(--si-blue-mid); color: var(--si-white); }
.si-doc-dl svg { width: 14px; height: 14px; stroke: currentColor; }

/* Stats grid */
.si-stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)); gap: 16px; margin-bottom: 28px; }
.si-stat-card { background: var(--si-white); border: 1px solid var(--si-border); border-radius: var(--si-radius); padding: 22px 18px; text-align: center; position: relative; overflow: hidden; }
.si-stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--si-blue) 0%, var(--si-accent) 100%); }
.si-stat-ico { width: 44px; height: 44px; margin: 0 auto 10px; border-radius: 10px; background: var(--si-light); display: flex; align-items: center; justify-content: center; }
.si-stat-ico svg { width: 22px; height: 22px; stroke: var(--si-blue-mid); }
.si-stat-value { font-size: 26px; font-weight: 800; color: var(--si-blue); line-height: 1; margin: 0 0 4px; }
.si-stat-value small { font-size: 13px; font-weight: 600; color: var(--si-muted); }
.si-stat-label { font-size: 12px; color: var(--si-muted); line-height: 1.4; }

/* Card grid */
.si-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; margin-bottom: 28px; }
.si-card { background: var(--si-white); border: 1px solid var(--si-border); border-radius: var(--si-radius); overflow: hidden; display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: border-color var(--si-trans), box-shadow var(--si-trans); }
.si-card:hover { border-color: var(--si-blue-mid); box-shadow: var(--si-shadow); text-decoration: none; color: inherit; }
.si-card__thumb { height: 150px; position: relative; overflow: hidden; }
.si-card__thumb-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--si-blue) 0%, var(--si-blue-mid) 100%); }
.si-card__thumb-placeholder svg { width: 48px; height: 48px; color: rgba(255,255,255,.3); stroke: currentColor; }
.si-card__badge { position: absolute; top: 10px; right: 10px; background: var(--si-accent); color: var(--si-white); font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 20px; letter-spacing: .5px; text-transform: uppercase; }
.si-card__body { padding: 16px 18px 14px; flex: 1; display: flex; flex-direction: column; }
.si-card__category { font-size: 10px; font-weight: 700; color: var(--si-accent); letter-spacing: 1px; text-transform: uppercase; margin: 0 0 5px; }
.si-card__title { font-size: 14px; font-weight: 700; color: var(--si-blue); margin: 0 0 6px; line-height: 1.4; flex: 1; }
.si-card__desc { font-size: 13px; color: var(--si-muted); line-height: 1.6; margin: 0 0 10px; }
.si-card__cta { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 600; color: var(--si-blue-mid); text-decoration: none; transition: gap var(--si-trans); }
.si-card__cta svg { width: 13px; height: 13px; stroke: currentColor; transition: transform var(--si-trans); }
.si-card:hover .si-card__cta { gap: 8px; }
.si-card:hover .si-card__cta svg { transform: translateX(2px); }

/* FAQ Accordion */
.si-faq-list { display: flex; flex-direction: column; gap: 8px; }
.si-faq-item { border: 1px solid var(--si-border); border-radius: var(--si-radius); overflow: hidden; background: var(--si-white); transition: border-color var(--si-trans); }
.si-faq-item.open { border-color: var(--si-blue-mid); }
.si-faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 18px; background: none; border: none; cursor: pointer; text-align: left; font-size: 14px; font-weight: 600; color: var(--si-blue); transition: color var(--si-trans); }
.si-faq-item.open .si-faq-q { color: var(--si-blue-mid); }
.si-faq-chevron { flex-shrink: 0; width: 18px; height: 18px; stroke: currentColor; transition: transform var(--si-trans); }
.si-faq-item.open .si-faq-chevron { transform: rotate(180deg); }
.si-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.32s ease, padding 0.32s ease; padding: 0 18px; font-size: 13.5px; line-height: 1.7; color: var(--si-text); }
.si-faq-item.open .si-faq-a { max-height: 400px; padding: 0 18px 16px; }

/* Alerts */
.si-alert { display: flex; gap: 12px; padding: 14px 18px; border-radius: var(--si-radius); margin-bottom: 20px; font-size: 13.5px; line-height: 1.6; }
.si-alert--info { background: #e3f2fd; border-left: 3px solid var(--si-blue-mid); color: #0d47a1; }
.si-alert--warn { background: #fff8e1; border-left: 3px solid var(--si-accent); color: #e65100; }
.si-alert--ok   { background: #e8f5e9; border-left: 3px solid #43a047; color: #1b5e20; }
.si-alert svg { flex-shrink: 0; width: 18px; height: 18px; stroke: currentColor; margin-top: 2px; }

/* Chart box */
.si-chart-box { border: 1px solid var(--si-border); border-radius: var(--si-radius); padding: 20px; background: var(--si-white); }

/* Pagination */
.si-pagination { display: flex; align-items: center; gap: 4px; margin-top: 24px; }
.si-pagination a, .si-pagination span { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 6px; font-size: 13px; font-weight: 600; text-decoration: none; border: 1.5px solid var(--si-border); background: var(--si-white); color: var(--si-muted); transition: all var(--si-trans); }
.si-pagination a:hover { border-color: var(--si-blue-mid); color: var(--si-blue-mid); }
.si-pagination span.active { background: var(--si-blue); border-color: var(--si-blue); color: var(--si-white); }

/* Responsive */
@media (max-width: 767px) {
  .si-grid { grid-template-columns: 1fr; }
  .si-stat-grid { grid-template-columns: 1fr 1fr; }
  .si-doc-title { white-space: normal; }
}
@media (max-width: 480px) {
  .si-filter-btn { padding: 5px 12px; font-size: 12px; }
}

 


/* ---- Floating trigger ---- */
#survey-trigger {
    position: fixed;
    bottom: 150px;
    right: 27px;
    z-index: 9998;

    width: 60px;
    height: 60px;
    border-radius: 50%;

    display: none; /* hidden at start */
    align-items: center;
    justify-content: center;

    background: linear-gradient(135deg, #005f8e, #00a0c6);
    color: #fff;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 18px rgba(0,95,142,.45);

    font-family: 'PT Sans', sans-serif;
    animation: surveyPulse 3s ease-in-out infinite;
    transition: transform .2s, box-shadow .2s;
}

#survey-trigger:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 26px rgba(0,95,142,.55);
    animation: none;
}

.survey-trigger-icon {
    font-size: 24px;
    line-height: 1;
}

@keyframes surveyPulse {
    0%, 100% { box-shadow: 0 4px 18px rgba(0,95,142,.45); }
    50%      { box-shadow: 0 4px 28px rgba(0,160,198,.7); }
}
/* ---- Overlay ---- */
#survey-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,30,60,.5);
  backdrop-filter: blur(3px);
  z-index: 9999;
}

/* ---- Modal ---- */
#survey-modal {
  display: none;
  position: fixed;
  bottom: 90px;
  right: 24px;
  width: 360px;
  max-width: calc(100vw - 32px);
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(0,30,60,.3);
  z-index: 10000;
  overflow: hidden;
  font-family: 'PT Sans', sans-serif;
}
#survey-modal.open { display: block; animation: popIn .35s cubic-bezier(.34,1.56,.64,1); }
@keyframes popIn {
  from { opacity: 0; transform: scale(.88) translateY(20px); }
  to   { opacity: 1; transform: scale(1)  translateY(0); }
}

/* ---- Close btn ---- */
#survey-close {
  position: absolute; top: 12px; right: 14px;
  background: rgba(0,0,0,.07); border: none; border-radius: 50%;
  width: 28px; height: 28px; font-size: 18px; line-height: 1;
  cursor: pointer; color: #555; z-index: 1;
  transition: background .2s;
}
#survey-close:hover { background: rgba(0,0,0,.15); }

/* ---- Steps ---- */
.survey-step { display: none; padding: 28px 24px 24px; }
.survey-step.active { display: block; }

/* ---- Header ---- */
.survey-header { margin-bottom: 20px; text-align: center; }
.survey-badge {
  display: inline-block;
  background: #f5a93f;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  backdrop-filter: blur(6px);
  letter-spacing: 1px; text-transform: uppercase;
  padding: 3px 10px; border-radius: 20px;
  margin-bottom: 10px;
  border-color: #f5a93f;
}
.survey-header h2 { font-size: 18px; color: #003a5c; margin: 0 0 6px; font-weight: 700; }
.survey-header p  { font-size: 13px; color: #666; margin: 0; }

/* ---- Stars ---- */
.star-row {
  display: flex; justify-content: center; gap: 10px;
  margin: 4px 0 10px;
}
.star {
  font-size: 36px;
  background: none; border: none;
  color: #ddd; cursor: pointer;
  transition: color .15s, transform .15s;
  padding: 0; line-height: 1;
}
.star.active, .star.hover { color: #f5a800; transform: scale(1.2); }
.star-label { text-align: center; font-size: 13px; color: #888; margin: 0 0 18px; min-height: 18px; }

/* ---- Quick questions ---- */
.quick-questions { margin-bottom: 18px; }
.qq-item { margin-bottom: 14px; }
.qq-item label { display: block; font-size: 13px; color: #444; margin-bottom: 7px; font-weight: 600; }
.toggle-group { display: flex; gap: 8px; }
.tgl {
  flex: 1; padding: 7px; border: 2px solid #d5e9f0;
  border-radius: 8px; background: #f5fbff;
  font-size: 13px; font-weight: 600; color: #005f8e;
  cursor: pointer; transition: all .2s;
}
.tgl.selected { background: #005f8e; border-color: #005f8e; color: #fff; }
.tgl:hover:not(.selected) { border-color: #00a0c6; background: #e0f4fb; }

/* ---- Textarea ---- */
#survey-comment {
  width: 100%; padding: 12px;
  border: 2px solid #d5e9f0; border-radius: 10px;
  font-family: 'PT Sans', sans-serif; font-size: 14px;
  color: #333; resize: vertical;
  transition: border-color .2s; box-sizing: border-box;
}
#survey-comment:focus { outline: none; border-color: #00a0c6; }
.char-count { text-align: right; font-size: 11px; color: #aaa; margin: 4px 0 16px; }

/* ---- CTA button ---- */
.survey-btn {
  position: relative;
  display: inline-block;
  width: 100%;
  overflow: hidden;
  font-size: 15px;
  line-height: 22px;
  font-weight: 700;
  font-family: 'PT Sans', sans-serif;
  color: #fff !important;
  background: #346bae;
  border: none;
  border-radius: 30px;
  padding: 12px 20px;
  text-align: center;
  cursor: pointer;
  z-index: 1;
  transition: all 500ms ease;
}

/* left yellow layer */
.survey-btn::before {
  position: absolute;
  content: '';
  top: 0;
  bottom: 0;
  left: 0;
  right: -70px;
  z-index: -1;
  background: #f2c94c;
  border-right: 60px solid transparent;
  transition: all 600ms ease;
  transform: translateX(-100%);
}

/* right yellow layer */
.survey-btn::after {
  position: absolute;
  content: '';
  top: 0;
  right: 0;
  bottom: 0;
  left: -70px;
  z-index: -1;
  background: #f2c94c;
  border-left: 60px solid transparent;
  transition: all 600ms ease;
  transform: translateX(100%);
}

.survey-btn:hover:not(:disabled)::before {
  transform: translateX(-40%);
}

.survey-btn:hover:not(:disabled)::after {
  transform: translateX(40%);
}

.survey-btn:hover:not(:disabled) {
  color: #fff !important;
  transform: translateY(-1px);
}

.survey-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
  transform: none;
}

.survey-btn:disabled::before,
.survey-btn:disabled::after {
  display: none;
}

/* ---- Thank you ---- */
.thank-you { text-align: center; padding: 10px 0 4px; }
.ty-icon {
  width: 64px; height: 64px; line-height: 64px;
  background: linear-gradient(135deg, #005f8e, #00a0c6);
  color: #fff; font-size: 32px;
  border-radius: 50%; margin: 0 auto 16px;
}
.thank-you h2 { color: #003a5c; font-size: 19px; margin-bottom: 8px; }
.thank-you p  { font-size: 13px; color: #666; margin-bottom: 20px; }

/* ---- Mobile ---- */
@media (max-width: 480px) {
  #survey-modal { bottom: 0; right: 0; width: 100%; border-radius: 18px 18px 0 0; }
  #survey-trigger { bottom: 16px; right: 16px; }
}










/* ── Contact Channels Section ───────────────────────────── */
.contact-channels-section {
    padding: 70px 0 80px;
    background: #f7f9fc;
}

.contact-channels-section .section-intro {
    max-width: 660px;
    margin: 0 auto 48px;
    text-align: center;
}

.contact-channels-section .section-intro h2 {
    font-family: 'Playfair Display', serif;
    font-size: 32px;
    font-weight: 700;
    color: #1a2e46;
    margin-bottom: 14px;
}

.contact-channels-section .section-intro p {
    font-size: 15.5px;
    color: #5a6a7a;
    line-height: 1.75;
}

/* Cards grid */
.contact-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 28px;
}

.contact-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 36px 30px 32px;
    box-shadow: 0 2px 16px rgba(0,0,0,0.07);
    border-top: 4px solid transparent;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition: transform 0.22s ease, box-shadow 0.22s ease;
    text-decoration: none;
    color: inherit;
}

.contact-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
    text-decoration: none;
    color: inherit;
}

.contact-card--bureau  { border-top-color: #1a6fc4; }
.contact-card--email   { border-top-color: #23285c; }
.contact-card--phone   { border-top-color: #1b519d; }
.contact-card--address { border-top-color: #11a0db; }

.contact-card__icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 20px;
    flex-shrink: 0;
}

.contact-card--bureau  .contact-card__icon { background: #e8f0fb; color: #1a6fc4; }
.contact-card--email   .contact-card__icon {     
  background: #b8bdf1db;
  color: #23285c;
} 
.contact-card--phone   .contact-card__icon { background: #9dc1f4; color: #1b519d; }
.contact-card--address .contact-card__icon { background: #caf0ff; color: #11a0db; }

.contact-card__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: #9aacbc;
    margin-bottom: 6px;
}

.contact-card__title {
    font-family: 'Playfair Display', serif;
    font-size: 19px;
    font-weight: 700;
    color: #1a2e46;
    margin-bottom: 10px;
    line-height: 1.3;
}

.contact-card__desc {
    font-size: 14px;
    color: #6b7e8f;
    line-height: 1.65;
    margin-bottom: 22px;
    flex: 1;
}

.contact-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    font-weight: 700;
    padding: 9px 20px;
    border-radius: 6px;
    transition: background 0.18s, color 0.18s;
    text-decoration: none;
}

.contact-card--bureau  .contact-card__cta { background: #1a6fc4; color: #fff; }
.contact-card--email   .contact-card__cta { background: #23285c; color: #fff; }
.contact-card--phone   .contact-card__cta { background: #1b519d; color: #fff; }
.contact-card--address .contact-card__cta { background: #11a0db; color: #fff; }

.contact-card--bureau  .contact-card__cta:hover { background: #155da0; color: #fff; text-decoration: none; }
.contact-card--email   .contact-card__cta:hover { background: #d48a20; color: #fff; text-decoration: none; }
.contact-card--phone   .contact-card__cta:hover { background: #238a57; color: #fff; text-decoration: none; }
.contact-card--address .contact-card__cta:hover { background: #7d3f9e; color: #fff; text-decoration: none; }

/* Info strip */
.contact-info-strip {
    margin-top: 44px;
    background: #23285c;
    border-radius: 12px;
    padding: 28px 36px;
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.contact-info-strip i {
    font-size: 28px;
    color: #ffffff;
    flex-shrink: 0;
}

.contact-info-strip__text {
    color: #c5d5e4;
    font-size: 14px;
    line-height: 1.6;
}

.contact-info-strip__text strong {
    color: #ffffff;
    display: block;
    font-size: 15px;
    margin-bottom: 3px;
}

@media (max-width: 576px) {
    .contact-info-strip { flex-direction: column; text-align: center; }
    .contact-card { padding: 28px 22px 26px; }
}



/* ── End Contact Channels Section ───────────────────────────── */




   /* ================================================================
       ACCÈS RAPIDE — RUBRIQUES
       Carousel-card style with tab navigation
       Prefix: qr-
    ================================================================ */
 
    .qr-section {
      position: relative;
      padding: 80px 0 90px;
      overflow: hidden;
      /* Rich layered background */
      background-color: #082740;
      background-image:
        radial-gradient(ellipse 90% 70% at 15% 60%, rgba(27,81,157,.38) 0%, transparent 65%),
        radial-gradient(ellipse 55% 90% at 85% 15%, rgba(6,40,68,.70) 0%, transparent 60%),
        repeating-linear-gradient(
          -48deg,
          transparent,
          transparent 44px,
          rgba(255,255,255,.022) 44px,
          rgba(255,255,255,.022) 45px
        );
    }
 
    /* decorative ring bottom-right */
    .qr-section::before {
      content: '';
      position: absolute;
      bottom: -180px;
      right: -120px;
      width: 600px;
      height: 600px;
      border: 70px solid rgba(255,255,255,.03);
      border-radius: 50%;
      pointer-events: none;
    }
 
    /* decorative ring top-left */
    .qr-section::after {
      content: '';
      position: absolute;
      top: -100px;
      left: -160px;
      width: 440px;
      height: 440px;
      border: 50px solid rgba(27,81,157,.08);
      border-radius: 50%;
      pointer-events: none;
    }
 
    .qr-inner {
      max-width: 1240px;
      margin: 0 auto;
      padding: 0 28px;
      position: relative;
      z-index: 2;
    }
 
    /* ── Header row ─────────────────────────────────────────── */
    .qr-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      margin-bottom: 36px;
      flex-wrap: wrap;
    }
 
    .qr-header__left {}
 
    .qr-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: #f5a93f;
      margin-bottom: 10px;
    }
 
    .qr-eyebrow::before {
      content: '';
      width: 30px;
      height: 2px;
      background: #f5a93f;
      border-radius: 2px;
      display: block;
    }
 
    .qr-title {
      font-size: clamp(26px, 3.2vw, 42px);
      font-weight: 800;
      color: #ffffff;
      line-height: 1.08;
      letter-spacing: -.01em;
    }
 
    .qr-title em {
      font-style: italic;
      font-family: 'PT Sans', sans-serif;
      color: #f5a93f;
    }
 
    /* ── Tab pills ──────────────────────────────────────────── */
    .qr-tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
    }
 
    .qr-tab {
      appearance: none;
      border: 1.5px solid rgba(255,255,255,.18);
      background: rgba(255,255,255,.06);
      padding: 9px 22px;
      border-radius: 40px;
      font-family: 'PT Sans', sans-serif;
      font-size: 13px;
      font-weight: 600;
      color: rgba(255,255,255,.70);
      cursor: pointer;
      transition: all .22s ease;
      white-space: nowrap;
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }
 
    .qr-tab:hover {
      border-color: rgba(255,255,255,.45);
      color: #fff;
      background: rgba(255,255,255,.10);
    }
 
    .qr-tab.qr-tab--on {
      background: #f5a93f;
      border-color: #f5a93f;
      color: #fff;
      box-shadow: 0 4px 18px rgba(224,123,48,.40);
    }
 
    /* ── Nav arrows ─────────────────────────────────────────── */
    .qr-nav {
      display: flex;
      gap: 10px;
      align-items: center;
    }
 
    .qr-arrow {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      border: 2px solid rgba(255,255,255,.20);
      background: rgba(255,255,255,.07);
      color: #fff;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background .2s, border-color .2s, transform .15s;
      backdrop-filter: blur(4px);
      flex-shrink: 0;
    }
 
    .qr-arrow:hover {
      background: #f5a93f;
      border-color: #f5a93f;
      transform: scale(1.09);
    }
 
    .qr-arrow:active { transform: scale(.93); }
 
    .qr-arrow svg {
      width: 17px;
      height: 17px;
      stroke: currentColor;
      stroke-width: 2.5;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
 
    /* ── Sub-row: tabs left, arrows right ───────────────────── */
    .qr-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 32px;
      flex-wrap: wrap;
    }
 
    /* ── Carousel track ─────────────────────────────────────── */
    .qr-track-outer { overflow: hidden; }
 
    .qr-track {
      display: flex;
      gap: 22px;
      transition: transform .46s cubic-bezier(.4,0,.2,1);
      will-change: transform;
    }
 
    /* ── Card ───────────────────────────────────────────────── */
    .qr-card {
      flex: 0 0 calc((100% - 44px) / 3);
      min-width: 0;
      border-radius: 16px;
      overflow: hidden;
      background: #ffffff;
      box-shadow: 0 14px 52px rgba(0,0,0,.32);
      display: flex;
      flex-direction: column;
      position: relative;
      transition: transform .24s ease, box-shadow .24s ease;
    }
 
    .qr-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 28px 70px rgba(0,0,0,.40);
    }
 
    /* Date badge — top-left corner */
    .qr-card__badge {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 5;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      min-width: 62px;
      padding: 10px 10px 9px;
      border-bottom-right-radius: 12px;
      font-family: 'PT Sans', sans-serif;
      font-weight: 800;
      color: #fff;
      /* default orange, overridden per panel */
      background: #f5a93f;
      line-height: 1;
    }
 
    .qr-card__day  { font-size: 34px; letter-spacing: -.02em; }
    .qr-card__info { font-size: 12px; font-weight: 700; letter-spacing: .06em; margin-top: 3px; opacity: .9; }
 
    /* Image zone */
    .qr-card__fig {
      position: relative;
      height: 220px;
      overflow: hidden;
      background: #b0c4d8;
      flex-shrink: 0;
    }
 
    .qr-card__img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      display: block;
      transition: transform .32s ease;
    }
 
    .qr-card:hover .qr-card__img { transform: scale(1.07); }
 
    /* gradient overlay for headline legibility */
    .qr-card__fig::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(0deg, rgba(6,20,40,.80) 0%, rgba(6,20,40,.0) 52%);
      pointer-events: none;
    }
 
    /* Headline overlaid on image bottom */
    .qr-card__hl {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 14px 16px 16px;
      font-size: 13px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .03em;
      color: #fff;
      line-height: 1.28;
      z-index: 3;
    }
 
    /* Card footer */
    .qr-card__foot {
      padding: 14px 16px;
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }
 
    .qr-card__cat {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .10em;
      text-transform: uppercase;
      padding: 4px 11px;
      border-radius: 20px;
    }
 
    /* CTA button */
    .qr-card__cta {
    position: relative;
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    color: #222;
    text-transform: uppercase;
    border-radius: 30px;
    text-align: center;
    padding: 10px 32px;
    }
 
    .qr-card__cta:hover { background: #f5a93f; transform: scale(1.04); }
 
    /* ── Per-panel accent colours ───────────────────────────── */
    /* Actualités — orange (default) */
    .qr-panel--actus  .qr-card__badge { background: #f5a93f; }
    .qr-panel--actus  .qr-card__cat   { background: #fff4ec; color: #c05a10; }
    .qr-panel--actus  .qr-card__cta   {    
      /* background: #ffffff; */
      border: 2px solid #f5a93f;  
    }
    .qr-panel--actus  .qr-card__cta:hover {
      /* background: #ffffff; */
        color: white;
        border: 2px solid #f5a93f; 
      }
 
    /* Ressources — teal */
    .qr-panel--eau .qr-card__badge { background: #11a0db; }
    .qr-panel--eau .qr-card__cat   { background: #e6fff9; color: #11a0db; }
    .qr-panel--eau .qr-card__cta   { 
       border: 2px solid #11a0db; 
    }
    .qr-panel--eau .qr-card__cta:hover { 
      background: #11a0db; 
      color: white; 
    }
 
    /* Projets — indigo-blue */
    .qr-panel--projets .qr-card__badge { background: #1b519d; }
    .qr-panel--projets .qr-card__cat   { background: #eef3ff; color: #143d7a; }
    .qr-panel--projets .qr-card__cta   { border: 2px solid #1b519d;  }
    .qr-panel--projets .qr-card__cta:hover { 
      background: #1b519d;
      color: white; 
    }
 
    /* Publications — violet */
    .qr-panel--pubs .qr-card__badge { background: #23285c; }
    .qr-panel--pubs .qr-card__cat   { background: #f3eeff; color: #12153a; }
    .qr-panel--pubs .qr-card__cta   { border: 2px solid #12153a; }
    .qr-panel--pubs .qr-card__cta:hover { 
      background: #12153a; 
      color: white;  
    }
 
    /* ── Panels hide/show ───────────────────────────────────── */
    .qr-panel { display: none; }
    .qr-panel.qr-panel--on { display: block; }
 
    /* ── Dots ───────────────────────────────────────────────── */
    .qr-dots {
      display: flex;
      justify-content: center;
      gap: 8px;
      margin-top: 36px;
    }
 
    .qr-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: rgba(255,255,255,.22);
      border: none;
      cursor: pointer;
      padding: 0;
      transition: background .2s, width .25s, border-radius .25s;
    }
 
    .qr-dot.qr-dot--on {
      background: #f5a93f;
      width: 24px;
      border-radius: 4px;
    }
 
    /* ── View-all link ──────────────────────────────────────── */
    .qr-viewall {
      text-align: center;
      margin-top: 30px;
    }
 
    .qr-viewall__link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1.5px solid rgba(255,255,255,.25);
      background: transparent;
      color: rgba(255,255,255,.80);
      font-family: 'PT Sans', sans-serif;
      font-size: 13px;
      font-weight: 600;
      padding: 10px 26px;
      border-radius: 40px;
      cursor: pointer;
      text-decoration: none;
      transition: background .2s, color .2s, border-color .2s;
    }
 
    .qr-viewall__link:hover {
      background: rgba(255,255,255,.10);
      border-color: rgba(255,255,255,.50);
      color: #fff;
    }
 
    /* ── Responsive ─────────────────────────────────────────── */
    @media (max-width: 900px) {
      .qr-card { flex: 0 0 calc((100% - 22px) / 2); }
    }
    @media (max-width: 580px) {
      .qr-card { flex: 0 0 100%; }
      .qr-inner { padding: 0 16px; }
      .qr-controls { flex-direction: column; align-items: flex-start; }
      .qr-header { flex-direction: column; align-items: flex-start; }
      .qr-section { padding: 56px 0 64px; }
    }



/* prefix dv3- — zero conflict */
.dv3-section *, .dv3-section *::before, .dv3-section *::after {
  box-sizing: border-box; margin: 0; padding: 0;
}
 
.dv3-section {
  background: #f7f8fc;
  padding: 72px 0 88px;
  font-family: 'PT Sans', sans-serif;
  position: relative;
}
 
.dv3-wrap {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px;
}
 
/* ── HEADER ─────────────────────────────────────── */
.dv3-hdr {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 32px;
  padding-bottom: 28px;
  border-bottom: 1px solid #e4e7ef;
  flex-wrap: wrap;
}
 
.dv3-hdr__eyebrow {
  font-size: 11px; font-weight: 700;
  letter-spacing: .20em; text-transform: uppercase;
  color: #f5a93f;
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px;
}
.dv3-hdr__eyebrow::before {
  content: ''; width: 24px; height: 2px;
  background: #f5a93f; border-radius: 2px;
}
 
.dv3-hdr__title {
  font-family: 'PT Sans', sans-serif;
  font-size: clamp(26px, 3vw, 46px);
  font-weight: 800; line-height: 1.0;
  letter-spacing: -.03em; color: #0d1117;
}
.dv3-hdr__title b { color: #1b519d; }
 
.dv3-hdr__right {
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 8px;
}
 
.dv3-live {
  display: flex; align-items: center; gap: 7px;
  font-size: 11px; font-weight: 600; color: #64748b;
}
.dv3-live__dot {
  width: 7px; height: 7px;
  background: #22c55e; border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(34,197,94,.4);
  animation: dv3-pulse 2s ease-in-out infinite;
}
@keyframes dv3-pulse {
  0%  { box-shadow: 0 0 0 0   rgba(34,197,94,.4); }
  70% { box-shadow: 0 0 0 7px rgba(34,197,94,0); }
}
 
.dv3-datechip {
  font-family: 'PT Sans', sans-serif;
  font-size: 12px; color: #94a3b8;
  background: #fff; border: 1px solid #e4e7ef;
  padding: 6px 14px; border-radius: 8px;
}
 
/* ── TICKER ──────────────────────────────────────── */
.dv3-ticker {
  display: flex; align-items: stretch;
  border-radius: 12px; overflow: hidden;
  background: #fff; border: 1px solid #e4e7ef;
  height: 42px; margin-bottom: 28px;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
 
.dv3-ticker__badge {
  background: #1b519d; color: #fff;
  font-size: 10px; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase;
  padding: 0 16px;
  display: flex; align-items: center; gap: 7px;
  flex-shrink: 0;
}
.dv3-ticker__badge-dot {
  width: 6px; height: 6px;
  background: #60a5fa; border-radius: 50%;
  animation: dv3-pulse 1.5s ease-in-out infinite;
}
 
.dv3-ticker__mask {
  flex: 1; overflow: hidden; position: relative;
  display: flex; align-items: center;
}
.dv3-ticker__mask::before,
.dv3-ticker__mask::after {
  content: ''; position: absolute; top: 0; bottom: 0;
  width: 36px; z-index: 2; pointer-events: none;
}
.dv3-ticker__mask::before { left:  0; background: linear-gradient(90deg, #fff, transparent); }
.dv3-ticker__mask::after  { right: 0; background: linear-gradient(270deg, #fff, transparent); }
 
.dv3-ticker__inner {
  display: flex; white-space: nowrap; align-items: center;
  animation: dv3-scroll 34s linear infinite;
  font-family: 'PT Sans', sans-serif;
  font-size: 12px; color: #475569;
}
.dv3-ticker__inner:hover { animation-play-state: paused; }
@keyframes dv3-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.dv3-ticker__item { padding: 0 18px; display: flex; align-items: center; gap: 7px; }
.dv3-ticker__item-name { color: #94a3b8; font-size: 11px; }
.dv3-t-up   { color: #16a34a; font-weight: 600; }
.dv3-t-down { color: #dc2626; font-weight: 600; }
.dv3-ticker__sep { color: #e4e7ef; font-size: 16px; }
 
/* ── KPI STRIP ───────────────────────────────────── */
.dv3-kpis {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px; margin-bottom: 24px;
}
 
.dv3-kpi {
  background: #fff; border: 1px solid #e4e7ef;
  border-radius: 16px; padding: 22px 22px 20px;
  position: relative; overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
.dv3-kpi:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.07); }
.dv3-kpi::before {
  content: ''; position: absolute;
  left: 0; top: 18px; bottom: 18px;
  width: 3px; border-radius: 0 3px 3px 0;
}
.dv3-kpi--a::before { background: #1b519d; }
.dv3-kpi--b::before { background: #f5a93f; }
.dv3-kpi--c::before { background: #0891b2; }
.dv3-kpi--d::before { background: #7c3aed; }
 
.dv3-kpi__ico {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.dv3-kpi--a .dv3-kpi__ico { background: #eef4ff; }
.dv3-kpi--b .dv3-kpi__ico { background: #fff4ec; }
.dv3-kpi--c .dv3-kpi__ico { background: #e0f7fb; }
.dv3-kpi--d .dv3-kpi__ico { background: #f3eeff; }
.dv3-kpi__ico svg {
  width: 18px; height: 18px; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.dv3-kpi--a .dv3-kpi__ico svg { stroke: #1b519d; }
.dv3-kpi--b .dv3-kpi__ico svg { stroke: #f5a93f; }
.dv3-kpi--c .dv3-kpi__ico svg { stroke: #0891b2; }
.dv3-kpi--d .dv3-kpi__ico svg { stroke: #7c3aed; }
 
.dv3-kpi__lbl {
  font-size: 11px; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
  color: #94a3b8; margin-bottom: 8px;
}
.dv3-kpi__val {
  font-family: 'PT Sans', sans-serif;
  font-size: 36px; font-weight: 800;
  color: #0d1117; line-height: 1;
  letter-spacing: -.03em;
  display: flex; align-items: baseline; gap: 4px;
}
.dv3-kpi__val sup {
  font-family: 'PT Sans', sans-serif;
  font-size: 14px; font-weight: 600;
  color: #94a3b8; letter-spacing: 0;
}
.dv3-kpi__sub {
  margin-top: 12px; font-size: 12px;
  font-weight: 500; color: #64748b;
  display: flex; align-items: center; gap: 6px;
}
.dv3-pill {
  font-size: 11px; font-weight: 700;
  padding: 2px 7px; border-radius: 20px;
  display: inline-flex; align-items: center;
}
.dv3-pill--up   { background: #dcfce7; color: #15803d; }
.dv3-pill--ok   { background: #dbeafe; color: #1d4ed8; }
.dv3-pill--warn { background: #fef9c3; color: #854d0e; }
 
/* ── LAYOUT ──────────────────────────────────────── */
.dv3-body {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 20px; align-items: start;
}
 
/* ── CARD BASE ───────────────────────────────────── */
.dv3-card {
  background: #fff; border: 1px solid #e4e7ef;
  border-radius: 20px; overflow: hidden;
  transition: box-shadow .2s;
}
.dv3-card:hover { box-shadow: 0 6px 28px rgba(0,0,0,.06); }
.dv3-card-p { padding: 26px 28px; }
 
.dv3-card-hdr {
  display: flex; align-items: center;
  justify-content: space-between; gap: 12px;
  margin-bottom: 22px; flex-wrap: wrap;
}
.dv3-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 17px; font-weight: 800;
  color: #0d1117; letter-spacing: -.02em;
}
.dv3-card-title span { color: #1b519d; }
.dv3-card-sub { font-size: 12px; color: #94a3b8; font-weight: 500; margin-top: 2px; }
 
/* ── GLOBAL BADGE ────────────────────────────────── */
.dv3-badge {
  background: #1b519d; 
  border-radius: 14px;
  padding: 14px 20px; text-align: center;
  display: flex; flex-direction: column;
  align-items: center; gap: 4px; flex-shrink: 0;
}
.dv3-badge__num {
  font-family: 'PT Sans', sans-serif;
  font-size: 30px; font-weight: 800;
  color: #fff; letter-spacing: -.04em; line-height: 1;
}
.dv3-badge__num small {
  font-size: 15px; color: rgba(255,255,255,.4);
  font-family: 'PT Sans', sans-serif; font-weight: 500;
}
.dv3-badge__lbl {
  font-size: 10px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.35);
}
 
/* ── DAM ROWS ────────────────────────────────────── */
.dv3-dam-list { display: flex; flex-direction: column; }
 
.dv3-dam-row {
  display: grid;
  grid-template-columns: 200px 1fr 64px;
  align-items: center; gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid #f1f5f9;
  transition: background .15s;
  border-radius: 8px;
}
.dv3-dam-row:last-child { border-bottom: none; }
.dv3-dam-row:hover {
  background: #f8faff;
  padding-left: 10px; padding-right: 10px;
  margin: 0 -10px;
}
 
.dv3-dam-row__name {
  font-size: 13px; font-weight: 700; color: #1e293b;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.3;
}
.dv3-dam-row__vol {
  font-family: 'PT Sans', sans-serif;
  font-size: 10px; color: #94a3b8; margin-top: 2px;
}
 
.dv3-dam-row__track {
  height: 8px; background: #f1f5f9;
  border-radius: 99px; overflow: hidden; position: relative;
}
.dv3-dam-row__fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  border-radius: 99px; width: 0;
  transition: width 1.0s cubic-bezier(.4,0,.2,1);
}
.dv3-dam-row[data-lv="high"]   .dv3-dam-row__fill { background: linear-gradient(90deg,#1b519d,#60a5fa); }
.dv3-dam-row[data-lv="medium"] .dv3-dam-row__fill { background: linear-gradient(90deg,#d97706,#fbbf24); }
.dv3-dam-row[data-lv="low"]    .dv3-dam-row__fill { background: linear-gradient(90deg,#dc2626,#f87171); }
 
.dv3-dam-row__pct {
  font-family: 'PT Sans', sans-serif;
  font-size: 15px; font-weight: 800;
  text-align: right; letter-spacing: -.02em;
}
.dv3-dam-row[data-lv="high"]   .dv3-dam-row__pct { color: #1b519d; }
.dv3-dam-row[data-lv="medium"] .dv3-dam-row__pct { color: #d97706; }
.dv3-dam-row[data-lv="low"]    .dv3-dam-row__pct { color: #dc2626; }
 
/* ── LEGEND ──────────────────────────────────────── */
.dv3-legend {
  display: flex; gap: 16px; flex-wrap: wrap;
  margin-top: 18px; padding-top: 14px;
  border-top: 1px solid #f1f5f9;
}
.dv3-legend-item {
  display: flex; align-items: center;
  gap: 7px; font-size: 11px;
  color: #64748b; font-weight: 600;
}
.dv3-legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
 
/* ── DETAILS TABLE ───────────────────────────────── */
.dv3-details {
  margin-top: 16px; border: 1px solid #e4e7ef;
  border-radius: 12px; overflow: hidden;
}
.dv3-details summary {
  padding: 12px 18px; font-size: 12px; font-weight: 700;
  color: #64748b; cursor: pointer; list-style: none;
  display: flex; align-items: center; gap: 8px;
  user-select: none; transition: background .15s, color .15s;
}
.dv3-details summary::-webkit-details-marker { display: none; }
.dv3-details summary:hover { background: #f8fafc; color: #0d1117; }
.dv3-details summary::before { content: '›'; font-size: 14px; transition: transform .2s; }
.dv3-details[open] summary::before { transform: rotate(90deg); }
 
.dv3-tbl-scroll { overflow-x: auto; }
.dv3-tbl {
  width: 100%; border-collapse: collapse;
  font-family: 'PT Sans', sans-serif;
  font-size: 12px; color: #334155;
}
.dv3-tbl th {
  background: #f8fafc; padding: 10px 14px;
  font-size: 10px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: #94a3b8; text-align: left; white-space: nowrap;
}
.dv3-tbl td { padding: 10px 14px; border-bottom: 1px solid #f1f5f9; white-space: nowrap; }
.dv3-tbl tfoot td { font-weight: 700; color: #0d1117; border-top: 2px solid #e4e7ef; border-bottom: none; }
 
/* ── EVO CHART ───────────────────────────────────── */
.dv3-seg {
  display: flex; background: #f1f5f9;
  border-radius: 10px; padding: 4px; gap: 4px;
}
.dv3-seg-btn {
  appearance: none; border: none; background: transparent;
  font-family: 'PT Sans', sans-serif;
  font-size: 12px; font-weight: 700; color: #64748b;
  padding: 6px 14px; border-radius: 7px; cursor: pointer;
  transition: background .18s, color .18s; white-space: nowrap;
}
.dv3-seg-btn.on {
  background: #fff; color: #0d1117;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
 
.dv3-evo-pane { display: none; position: relative; height: 195px; }
.dv3-evo-pane.on { display: block; }
.dv3-evo-pane canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; }
 
/* ── RIGHT ───────────────────────────────────────── */
.dv3-right { display: flex; flex-direction: column; gap: 16px; }
 
/* S'informer */
.dv3-sinf-hdr {
  padding: 20px 22px 16px; border-bottom: 1px solid #f1f5f9;
}
.dv3-sinf-hdr__title {
  font-family: 'Playfair Display', serif;
  font-size: 15px; font-weight: 800;
  color: #0d1117; letter-spacing: -.02em;
}
 
.dv3-tiles {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 8px; padding: 14px;
}
.dv3-tile {
  display: flex; flex-direction: column;
  align-items: center; gap: 9px;
  padding: 16px 10px; border-radius: 14px;
  border: 1.5px solid #e4e7ef; background: #fafbff;
  text-decoration: none; text-align: center;
  transition: border-color .2s, background .2s, transform .2s, box-shadow .2s;
}
.dv3-tile:hover {
  border-color: #93c5fd; background: #eff6ff;
  transform: translateY(-3px); box-shadow: 0 8px 20px rgba(27,81,157,.09);
}
.dv3-tile--w { grid-column: span 2; flex-direction: row; text-align: left; padding: 13px 16px; gap: 12px; }
.dv3-tile__ico {
  width: 38px; height: 38px; border-radius: 10px;
  background: #e8f0fb; display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; transition: background .2s;
}
.dv3-tile:hover .dv3-tile__ico { background: #dbeafe; }
.dv3-tile__ico svg {
  width: 18px; height: 18px; stroke: #1b519d; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.dv3-tile__lbl { font-size: 12px; font-weight: 700; color: #334155; line-height: 1.3; }
 
.dv3-qlinks { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 14px 14px; }
.dv3-qlink {
  display: flex; align-items: center; gap: 9px;
  padding: 11px 13px; border-radius: 11px;
  background: #fafbff; border: 1.5px solid #e4e7ef;
  text-decoration: none;
  transition: background .2s, border-color .2s, transform .2s;
}
.dv3-qlink:hover { background: #eff6ff; border-color: #93c5fd; transform: translateY(-2px); }
.dv3-qlink__ico {
  width: 28px; height: 28px; border-radius: 7px;
  background: #e8f0fb; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.dv3-qlink__ico svg {
  width: 13px; height: 13px; stroke: #1b519d; fill: none;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;
}
.dv3-qlink__txt { font-size: 11px; font-weight: 700; color: #334155; line-height: 1.3; }
 
/* Bento */
.dv3-bento-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }
.dv3-bento {
  border-radius: 14px; padding: 16px; text-decoration: none;
  display: flex; flex-direction: column; gap: 8px;
  transition: transform .2s, box-shadow .2s;
}
.dv3-bento:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0,0,0,.09); }
.dv3-bento--w { grid-column: span 2; flex-direction: row; align-items: center; gap: 14px; }
.dv3-bento--navy  { background: #1b519d; }
.dv3-bento--blue  { background: #1b519d; }
.dv3-bento--mint  { background: #f0fdf4; border: 1.5px solid #bbf7d0; }
.dv3-bento--amber { background: #fffbeb; border: 1.5px solid #fde68a; }
.dv3-bento--ice   { background: #f0f9ff; border: 1.5px solid #bae6fd; }
 
.dv3-bento-ico {
  width: 34px; height: 34px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.dv3-bento--navy .dv3-bento-ico,
.dv3-bento--blue .dv3-bento-ico  { background: rgba(255,255,255,.10); }
.dv3-bento--mint  .dv3-bento-ico { background: rgba(22,163,74,.10); }
.dv3-bento--amber .dv3-bento-ico { background: rgba(217,119,6,.10); }
.dv3-bento--ice   .dv3-bento-ico { background: rgba(14,165,233,.10); }
.dv3-bento-ico svg {
  width: 16px; height: 16px; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.dv3-bento--navy .dv3-bento-ico svg,
.dv3-bento--blue .dv3-bento-ico svg { stroke: rgba(255,255,255,.70); }
.dv3-bento--mint  .dv3-bento-ico svg { stroke: #16a34a; }
.dv3-bento--amber .dv3-bento-ico svg { stroke: #d97706; }
.dv3-bento--ice   .dv3-bento-ico svg { stroke: #0ea5e9; }
 
.dv3-bento-tag {
  font-size: 10px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
}
.dv3-bento--navy .dv3-bento-tag,
.dv3-bento--blue .dv3-bento-tag  { color: rgba(255,255,255,.40); }
.dv3-bento--mint  .dv3-bento-tag { color: #15803d; }
.dv3-bento--amber .dv3-bento-tag { color: #b45309; }
.dv3-bento--ice   .dv3-bento-tag { color: #0284c7; }
 
.dv3-bento-val {
  font-family: 'PT Sans', sans-serif;
  font-size: 22px; font-weight: 800; letter-spacing: -.03em; line-height: 1;
}
.dv3-bento--navy .dv3-bento-val,
.dv3-bento--blue .dv3-bento-val  { color: #fff; }
.dv3-bento--mint  .dv3-bento-val { color: #14532d; }
.dv3-bento--amber .dv3-bento-val { color: #78350f; }
.dv3-bento--ice   .dv3-bento-val { color: #0c4a6e; }
 
.dv3-bento-sub { font-size: 11px; font-weight: 500; }
.dv3-bento--navy .dv3-bento-sub,
.dv3-bento--blue .dv3-bento-sub  { color: rgba(255,255,255,.35); }
.dv3-bento--mint  .dv3-bento-sub { color: #166534; }
.dv3-bento--amber .dv3-bento-sub { color: #92400e; }
.dv3-bento--ice   .dv3-bento-sub { color: #075985; }
.dv3-bento-body { flex: 1; }
 
.dv3-chip-new {
  font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  background: #22c55e; color: #fff;
  padding: 3px 8px; border-radius: 20px; flex-shrink: 0;
}
 
/* stagger */
@keyframes dv3-up {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:translateY(0); }
}
.dv3-kpi { animation: dv3-up .45s ease both; }
.dv3-kpi:nth-child(1) { animation-delay:.04s; }
.dv3-kpi:nth-child(2) { animation-delay:.10s; }
.dv3-kpi:nth-child(3) { animation-delay:.16s; }
.dv3-kpi:nth-child(4) { animation-delay:.22s; }
 
/* ── RESPONSIVE ──────────────────────────────────── */
@media (max-width:1100px) {
  .dv3-body { grid-template-columns: 1fr; }
  .dv3-right { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
}
@media (max-width:860px)  { .dv3-kpis { grid-template-columns: 1fr 1fr; } }
@media (max-width:640px)  {
  .dv3-kpis { grid-template-columns: 1fr; }
  .dv3-right { grid-template-columns: 1fr; }
  .dv3-dam-row { grid-template-columns: 130px 1fr 54px; gap: 10px; }
  .dv3-wrap { padding: 0 16px; }
  .dv3-section { padding: 52px 0 64px; }
  .dv3-bento-grid { grid-template-columns: 1fr; }
  .dv3-bento--w { grid-column: auto; flex-direction: column; }
  .dv3-hdr { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   FAB — permanently hide all original floating buttons
   The FAB popover triggers their functions directly,
   their own floating buttons are never shown.
   ============================================================ */

/* Accessibility widget button — always hidden */
.a11y-widget {
  display: none !important;
}

/* Survey floating trigger — always hidden */
#survey-trigger {
  display: none !important;
}

/* Tawk.to bubble — hidden via JS (Tawk_API.hideWidget) */


/* ============================================================
   FAB LAUNCHER styles
   ============================================================ */
.fab-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10400;
}
.fab-backdrop.visible { display: block; }

.fab-launcher {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 10500;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.fab-popover {
  position: absolute;
  bottom: calc(100% + 14px);
  right: 0;
  width: 220px;
  background: #fff;
  border-radius: 20px;
  box-shadow:
    0 24px 64px rgba(0,20,60,0.18),
    0 4px 16px rgba(0,20,60,0.10),
    0 0 0 1px rgba(0,0,0,0.055);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  opacity: 0;
  transform: translateY(12px) scale(0.95);
  transform-origin: bottom right;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.30s cubic-bezier(0.34,1.56,0.64,1);
}
.fab-launcher.open .fab-popover {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.fab-popover::after {
  content: '';
  position: absolute;
  bottom: -7px;
  right: 20px;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 3px;
  transform: rotate(45deg);
  box-shadow: 3px 3px 8px rgba(0,20,60,0.08);
}

.fab-divider {
  height: 1px;
  background: rgba(0,0,0,0.07);
  margin: 2px 6px;
}

.fab-action {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: none;
  background: none;
  border-radius: 13px;
  cursor: pointer;
  width: 100%;
  text-align: left;
  transition: background 0.15s ease, transform 0.15s ease;
  position: relative;
  overflow: hidden;
}
.fab-action:hover { background: #f4f7ff; transform: translateX(-2px); }
.fab-action:active { transform: scale(0.97); }

.fab-action-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.fab-action:hover .fab-action-icon { transform: scale(1.08); }
.fab-action-icon svg {
  width: 20px; height: 20px;
  stroke: #fff; fill: none;
  stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;
}
.fab-action-icon.ic-chat   { background: linear-gradient(135deg,#16a34a,#4ade80); }
.fab-action-icon.ic-a11y   { background: linear-gradient(135deg,#1a56a0,#3b82f6); }
.fab-action-icon.ic-survey { background: linear-gradient(135deg,#6d28d9,#a855f7); }

.fab-action-text { display: flex; flex-direction: column; gap: 1px; }
.fab-action-title { font-size: 13.5px; font-weight: 700; color: #0f172a; font-family:'Cairo',system-ui,sans-serif; line-height:1.2; }
.fab-action-desc  { font-size: 11px; color: #94a3b8; font-family:'Cairo',system-ui,sans-serif; }

.fab-online-dot {
  width: 8px; height: 8px;
  background: #22c55e; border-radius: 50%;
  position: absolute; top: 9px; right: 12px;
  box-shadow: 0 0 0 2px #fff;
  animation: fabOnlinePulse 2s ease infinite;
}
@keyframes fabOnlinePulse {
  0%,100% { box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(34,197,94,0.3); }
  50%     { box-shadow: 0 0 0 2px #fff, 0 0 0 5px rgba(34,197,94,0.0); }
}

.fab-main {
  position: relative;
  width: 60px; height: 60px;
  border-radius: 50%; border: none; cursor: pointer;
  background: linear-gradient(145deg,#1a62ba,#0ea5d6);
  box-shadow: 0 8px 24px rgba(14,165,214,0.40), 0 2px 8px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.20);
  display: grid; place-items: center;
  transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.3s ease, background 0.3s ease;
  outline: none;
}
.fab-main:hover {
  transform: scale(1.07);
  box-shadow: 0 12px 32px rgba(14,165,214,0.52), 0 4px 12px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.25);
}
.fab-main.open {
  background: linear-gradient(145deg,#0f172a,#1e293b);
  box-shadow: 0 8px 24px rgba(0,0,0,0.32), 0 2px 8px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
  transform: rotate(45deg);
}
.fab-main.open:hover { transform: rotate(45deg) scale(1.07); }
.fab-main::after {
  content: ''; position: absolute; inset: -1px; border-radius: 50%;
  border: 2px solid rgba(14,165,214,0.4);
  animation: fabPulse 2.6s ease-out infinite;
}
.fab-main.open::after { display: none; }
@keyframes fabPulse {
  0%   { transform: scale(1);   opacity: 0.85; }
  70%  { transform: scale(1.6); opacity: 0; }
  100% { transform: scale(1.6); opacity: 0; }
}
.fab-main svg {
  width: 24px; height: 24px;
  stroke: #fff; fill: none; stroke-width: 2.5; stroke-linecap: round;
}

@media (max-width:480px) {
  .fab-launcher { bottom:18px; right:18px; }
  .fab-main     { width:56px; height:56px; }
  .fab-popover  { width:200px; }
}


/* ── Tawk.to bubble — CSS fallback hide (belt + suspenders) ── */
/* Tawk injects an iframe with id="tawkchat-minified-box"       */
/* We hide it by default; shown only when user clicks Chat FAB  */
#tawkchat-minified-box,
#tawkchat-container,
.tawk-min-container,
[id^="tawkchat"] {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}
/* Re-shown only when .tawk-show is on body */
body.tawk-show #tawkchat-minified-box,
body.tawk-show #tawkchat-container,
body.tawk-show .tawk-min-container,
body.tawk-show [id^="tawkchat"] {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}