/* Page /g4-planning/ — landing G4 Planning (réutilise g4-studio.css) */

html:has(body.g4-page-g4-planning) {
  scroll-behavior: smooth;
}

.g4-gp .g4-st-kicker {
  color: #7dd3fc;
}

.g4-gp .g4-st-hero h1 em {
  color: #7dd3fc;
}

.g4-gp-frame {
  overflow: hidden;
  background: #0a1220;
}

.g4-gp-frame img {
  display: block;
  width: 100%;
  height: auto;
}

.g4-gp-win figcaption {
  margin: 0.75rem 0 0;
  color: #9fb0c3;
  font-size: 0.9rem;
}

.g4-gp-plans {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.g4-gp-plan-site {
  border-color: rgba(125, 211, 252, 0.35);
  background:
    radial-gradient(ellipse at 100% 0%, rgba(125, 211, 252, 0.12), transparent 52%),
    #101a27;
}

.g4-gp-plan-site > p {
  color: #7dd3fc;
}

.g4-gp-tarif-note {
  margin: 1.2rem 0 0;
  color: #9fb0c3;
  font-size: 0.92rem;
  line-height: 1.5;
  max-width: 70ch;
}

.g4-gp .g4-st-win__status i {
  background: #7dd3fc;
  box-shadow: 0 0 10px #7dd3fc;
}

/* Carte accueil */
.g4-srv--planning {
  --g4-plc: #7dd3fc;
}

.g4-srv--planning .g4-srv__bg img {
  object-position: 50% 20%;
  transform: scale(1.08);
  transform-origin: 50% 15%;
}

.g4-srv--planning .g4-srv__veil {
  background:
    linear-gradient(180deg, rgba(6, 14, 28, 0.25) 0%, rgba(6, 14, 28, 0.88) 55%, #07111f 100%),
    linear-gradient(90deg, rgba(7, 17, 31, 0.55), transparent 42%);
}

.g4-srv--planning .g4-kicker {
  color: #7dd3fc;
  text-shadow: 0 0 18px rgba(125, 211, 252, 0.35);
}

.g4-srv--planning .g4-plc__soon {
  background: rgba(125, 211, 252, 0.12);
  border-color: rgba(125, 211, 252, 0.45);
  color: #ccebff;
}

.g4-srv--planning .g4-plc__soon i {
  background: #7dd3fc;
  box-shadow: 0 0 10px #7dd3fc;
}

.g4-srv--planning .g4-plc__soon i::after {
  display: none;
}

.g4-srv--planning .g4-plc__key {
  align-items: center;
  gap: 0.6rem;
}

.g4-srv--planning .g4-plc__key b {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 0.7rem;
  background: rgba(125, 211, 252, 0.16);
  border: 1px solid rgba(125, 211, 252, 0.4);
  color: #ccebff;
  font-size: 1.1rem;
}

.g4-srv--planning .g4-plc__key small {
  margin: 0;
  line-height: 1.25;
  color: #dce6f1;
}

.g4-srv--planning .g4-srv__actions {
  margin-top: auto;
}

.g4-srv--planning .g4-srv__foot {
  padding-top: 0.7rem;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.g4-home-hub > .g4-srv--planning {
  min-height: 100%;
}

.g4-home-hub.is-soft3 {
  grid-template-columns: 1fr 1fr 1fr;
}

@media (max-width: 1100px) {
  .g4-home-hub.is-soft3 {
    grid-template-columns: 1fr 1fr;
  }
  .g4-home-hub.is-soft3 > .g4-srv--planning {
    grid-column: 1 / -1;
  }
}

@media (max-width: 860px) {
  .g4-home-hub.is-soft3 {
    grid-template-columns: 1fr;
  }
  .g4-home-hub.is-soft3 > .g4-srv--planning {
    grid-column: auto;
  }
  .g4-gp-plans {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 861px) and (max-width: 1100px) {
  .g4-gp-plans {
    grid-template-columns: 1fr 1fr;
  }
}

/* Section logiciels Wardogs */
.g4-wd-soft-duo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 860px) {
  .g4-wd-soft-duo {
    grid-template-columns: 1fr;
  }
}


/* H1 : pas de mot coupé à 1280 / 1440 / 390 */
.g4-gp .g4-st-hero h1 {
  font-size: clamp(2.05rem, 3.6vw + 0.6rem, 3.55rem);
  line-height: 1.02;
  letter-spacing: 0.02em;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: none;
  max-width: 14ch;
}

.g4-gp .g4-st-hero h1 em {
  max-width: none;
}

@media (max-width: 860px) {
  .g4-gp .g4-st-hero h1 {
    max-width: none;
    font-size: clamp(1.85rem, 8.2vw, 2.55rem);
  }
}

/* Galerie : captures lisibles (légende sous l’image, pas de voile opaque) */
.g4-gp .g4-st-bento {
  grid-auto-rows: minmax(240px, 24vw);
  align-items: stretch;
}

.g4-gp .g4-st-shot {
  display: flex;
  flex-direction: column;
  background: #0b1524;
  min-height: 240px;
  isolation: isolate;
}

.g4-gp .g4-st-shot img {
  position: relative !important;
  inset: auto !important;
  flex: 1 1 auto;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 180px;
  max-height: none !important;
  object-fit: cover !important;
  object-position: top center !important;
  background: #0b1524;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 0;
  transform: none !important;
  filter: brightness(1.22) contrast(1.08) saturate(1.05);
}

.g4-gp .g4-st-shot:hover img {
  transform: none !important;
}

.g4-gp .g4-st-shot span {
  position: static !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2;
  margin-top: auto;
  padding: 0.65rem 0.75rem 0.7rem !important;
  background: #07111d !important;
  border-top: 1px solid rgba(255,255,255,0.06);
  pointer-events: none;
}

.g4-gp .g4-st-shot--lead img {
  min-height: 360px;
  object-position: top center !important;
}

/* Cadres produit */
.g4-gp-frame {
  background: #0b1524;
}
.g4-gp-frame img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: top center;
  background: #0b1524;
}

/* Sélecteur de langue de la page produit */
.g4-gp-langs { display: flex; justify-content: flex-end; gap: .35rem; padding-top: .9rem; }
.g4-gp-langs a { font: 700 .78rem/1 inherit; letter-spacing: .06em; padding: .4rem .55rem; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; color: inherit; opacity: .75; text-decoration: none; }
.g4-gp-langs a:hover, .g4-gp-langs a.is-on { opacity: 1; border-color: currentColor; }

/* FAQ */
.g4-gp-faq__list { display: grid; gap: .7rem; max-width: 860px; margin-top: 1.4rem; }
.g4-gp-faq details { border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 1rem 1.2rem; background: rgba(255,255,255,.03); }
.g4-gp-faq summary { cursor: pointer; font-weight: 700; }
.g4-gp-faq details p { margin: .7rem 0 0; opacity: .85; }
.g4-gp-shots-fr{font-size:.85rem;opacity:.7;font-style:italic}