@charset "UTF-8";
/* ==========================================================================
   KMG Ticker — composant téléphone défilant (pages internes uniquement)
   Classe  : .kmg-phone-hero .kmg-ticker
   Portée  : tous les PHP inclus par header.php — jamais sur index.html
   ========================================================================== */

/* ---- Animation de défilement ---- */
@keyframes kmg-ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ---- Position hero, independante de nav.navbar ---- */
.kmg-phone-hero {
  position: absolute !important;
  top: 110px;
  left: 50%;
  transform: translateX(-50%);
  right: auto;
  bottom: auto;
  margin: 0;
  z-index: 11999;
}

/* ---- Conteneur principal ---- */
.kmg-ticker {
  color: #E8CC80;
  font-weight: 800;
  font-size: 1.5rem;
  background: transparent;
  border: none;
  box-shadow: none;
  cursor: pointer;
  pointer-events: auto;
}

/* ---- Lien cliquable ---- */
.kmg-ticker__link {
  display: block;
  overflow: hidden;
  width: clamp(240px, 28vw, 400px);
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

/* ---- Reel défilant ---- */
.kmg-ticker__reel {
  display: inline-flex;
  white-space: nowrap;
  will-change: transform;
  animation: kmg-ticker-scroll 12s linear infinite;
}

.kmg-ticker:hover .kmg-ticker__reel {
  animation-play-state: paused;
}

/* ---- Unité de texte ---- */
.kmg-ticker__unit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-right: 2rem;
  font-weight: 800;
  letter-spacing: 0.3px;
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
  user-select: none;
  cursor: pointer;
}

/* ---- Icône SVG ---- */
.kmg-ticker__svg {
  width: 26px;
  height: 26px;
  color: #E8CC80;
  flex: 0 0 auto;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.35));
  vertical-align: middle;
}

/* ==========================================================================
   Responsive — Tablette (769–1023px) : même hauteur que burger, décalé à droite
   Le burger est à gauche (left:14px), le ticker est centré+28px pour coexister
   ========================================================================== */

/* Tablette / petit écran desktop : ticker stable */
@media screen and (min-width: 769px) and (max-width: 1023px) {
  .kmg-phone-hero {
    position: absolute !important;
    top: 70px !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translateX(-50%) !important;
    z-index: 11999 !important;
  }
}

/* Mobile uniquement : ticker non flottant */
@media screen and (max-width: 768px) {
  .kmg-phone-hero {
    position: absolute !important;
    top: 62px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 11999 !important;
  }
}
/* ==========================================================================
   Mobile portrait ≤ 768px : ticker positionné SOUS le burger
   Burger = top:14px + height:44px → bottom:58px. Ticker démarre à 62px.
   Left:50% centré horizontalement, pas de risque de collision.
   ========================================================================== */

@media screen and (max-width: 768px) and (orientation: portrait) {
  .kmg-phone-hero {
    position: absolute !important;
    top: calc(env(safe-area-inset-top, 0px) + 62px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
  .kmg-ticker {
    font-size: clamp(0.88rem, 3.5vw, 1.08rem);
  }
  .kmg-ticker__link {
    width: clamp(180px, calc(100vw - 40px), 360px);
  }
  .kmg-ticker__svg {
    width: 19px;
    height: 19px;
  }
}

/* Petits mobiles portrait (≤389px) */
@media screen and (max-width: 389px) and (orientation: portrait) {
  .kmg-ticker {
    font-size: clamp(0.82rem, 4vw, 0.96rem);
  }
  .kmg-ticker__link {
    width: clamp(148px, calc(100vw - 40px), 280px);
  }
  .kmg-ticker__svg {
    width: 17px;
    height: 17px;
  }
}

/* Fold 4 plié portrait (≤340px) */
@media screen and (max-width: 340px) and (orientation: portrait) {
  .kmg-ticker {
    font-size: clamp(1rem, 8.2vw, 1rem);
  }
  .kmg-ticker__link {
    width: clamp(128px, calc(100vw - 40px), 216px);
  }
  .kmg-ticker__svg {
    width: 15px;
    height: 15px;
  }
}

/* Paysage compact (≤1024px landscape, hauteur ≤560px) */
@media (max-width: 1023px) and (orientation: landscape) and (max-height: 560px) {
  .kmg-phone-hero {
    top: calc(env(safe-area-inset-top, 0px) + 6px);
    left: calc(50% + 18px);
  }
  .kmg-ticker {
    font-size: clamp(0.78rem, 2.6vw, 0.96rem);
  }
  .kmg-ticker__link {
    width: clamp(150px, calc(100vw - 62px), 280px);
  }
}

/* Accessibilité */
@media (prefers-reduced-motion: reduce) {
  .kmg-ticker__reel { animation: none; }
}

/* Impression */
@media print {
  .kmg-phone-hero { display: none !important; }
}
/* =====================================================
   PATCH FOLD / MOBILE - Méthode en 4 étapes
   Image en haut, titre sous image, texte sous titre
   ===================================================== */

@media screen and (min-width: 360px) and (max-width: 620px) {

  body.service-page .kmg-method .kmg-cards-visual {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 96% !important;
    margin: 0 auto !important;
  }

  body.service-page .kmg-method .kmg-vcard {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 0 14px !important;
    overflow: hidden !important;
    min-height: auto !important;
  }

  body.service-page .kmg-method .kmg-vcard__img {
    order: 1 !important;
    width: 100% !important;
    height: clamp(150px, 42vw, 210px) !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    border-radius: 10px 10px 0 0 !important;
  }

  body.service-page .kmg-method .kmg-vcard__img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
  }

  body.service-page .kmg-method .kmg-vcard__title {
    order: 2 !important;
    font-size: clamp(1rem, 4vw, 1.25rem) !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
    padding: 0 10px !important;
    text-align: center !important;
  }

  body.service-page .kmg-method .kmg-vcard__p {
    order: 3 !important;
    font-size: clamp(0.86rem, 3.2vw, 1rem) !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    padding: 0 10px !important;
    text-align: center !important;
  }
}

#telephone-defilant
{position:fixed !important;
  left:50%;
  transform:translateX(-50%);
  top:80px;background:transparent;
  color:var(--gold);padding:10px 12px;border-radius:10px;font-weight:700;white-space:nowrap;z-index:900}