/* ═══════════════════════════════════════════════════════
   GALAX-IT — COUCHE DE THÈME APPLE (override, sans toucher au HTML)
   Réécrit uniquement l'apparence : couleurs, typo, surfaces, rayons.
   ═══════════════════════════════════════════════════════ */

/* 1 — Palette : on bascule toutes les variables en clair Apple */
:root,
#galaxit-page {
  --blue:        #0071e3;
  --blue-mid:    #0077ed;
  --blue-light:  #0066cc;
  --blue-glow:   rgba(0,113,227,0.18);
  --dark:        #ffffff;
  --dark-2:      #f5f5f7;
  --dark-3:      #f5f5f7;
  --dark-card:   #ffffff;
  --white:       #1d1d1f;
  --white-high:  #1d1d1f;
  --white-mid:   #6e6e73;
  --white-low:   #86868b;
  --white-faint: rgba(0,0,0,0.04);
  --text-muted:  #86868b;
  --radius:      18px;
  --radius-sm:   12px;
}

/* 2 — Typographie Apple partout (remplace Syne / DM Sans) */
body,
#gx-nav, #gx-nav *,
#gx-footer, #gx-footer *,
#galaxit-page, #galaxit-page *,
#galaxit-page .nav-logo,
#galaxit-page .gx-h2, #galaxit-page .hero h1,
#galaxit-page .sc-title, #galaxit-page .step-title,
#galaxit-page .value-card h3, #galaxit-page .stat-num,
#galaxit-page .step-num, #galaxit-page .sol-stat-num,
#galaxit-page footer h4, .footer-col h4, .chat-head-name {
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Helvetica Neue",Helvetica,Arial,sans-serif !important;
  letter-spacing:-0.01em;
}
#galaxit-page .hero h1,
#galaxit-page .gx-h2 { letter-spacing:-0.015em; }

body, #galaxit-page { background:#ffffff; color:#1d1d1f; -webkit-font-smoothing:antialiased; }
/* le hero passe sous la navbar fixe (supprime le liseré blanc) */
main { padding-top:0 !important; }

/* 3 — NAV (verre dépoli clair — logo bleu) */
#gx-nav { background:rgba(251,251,253,0.82); -webkit-backdrop-filter:saturate(180%) blur(20px); backdrop-filter:saturate(180%) blur(20px); border-bottom:1px solid rgba(0,0,0,0.06); }
#gx-nav.scrolled { background:rgba(251,251,253,0.92); box-shadow:none; border-bottom:1px solid rgba(0,0,0,0.08); }
#gx-nav .nav-logo { color:#1d1d1f; }
#gx-nav .nav-logo img { height:52px; width:auto; }
#gx-nav .nav-links > li > a { color:#1d1d1f; opacity:.82; }
#gx-nav .nav-links > li > a:hover,
#gx-nav .nav-links > li > a.active { color:#1d1d1f; opacity:1; background:rgba(0,0,0,0.05); }
#gx-nav .dropdown { background:rgba(251,251,253,0.97); border:1px solid rgba(0,0,0,0.08); box-shadow:0 12px 40px rgba(0,0,0,0.12); }
#gx-nav .dropdown li a { color:#6e6e73; }
#gx-nav .dropdown li a:hover,
#gx-nav .dropdown li a.active { color:#1d1d1f; background:rgba(0,0,0,0.04); }
#gx-nav .nav-burger span { background:#1d1d1f; }
@media (max-width:900px){
  #gx-nav .nav-links { background:rgba(251,251,253,0.96); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); }
  #gx-nav .dropdown li a { color:#0066cc; }
  /* backdrop-filter sur #gx-nav crée un containing block pour son enfant
     position:fixed (.nav-links) : le menu mobile ne couvrait alors que la
     hauteur de la barre de nav au lieu de tout l'écran. On le retire quand
     le menu est ouvert pour que .nav-links redevienne fixe par rapport au viewport. */
  #gx-nav:has(.nav-links.open) {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom: none;
    box-shadow: none;
  }
  /* .nav-links (position:fixed) est peint au-dessus du burger une fois ouvert,
     ce qui empêchait de refermer le menu en recliquant. On force le burger
     au-dessus de l'overlay. */
  #gx-nav .nav-burger { position: relative; z-index: 2; }
  #gx-nav .nav-links { z-index: 1; }
}

/* 4 — HERO clair + animation de fond (aurora douce) */
#galaxit-page .hero { background:#f5f5f7; position:relative; overflow:hidden; }
#galaxit-page .hero-grid { background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px); animation:gx-gridpan 24s linear infinite; }
@keyframes gx-gridpan { from{ background-position:0 0; } to{ background-position:56px 56px; } }
#galaxit-page .hero-orb-1 { background:radial-gradient(circle, rgba(0,113,227,0.16) 0%, transparent 66%); }
#galaxit-page .hero-orb-2 { background:radial-gradient(circle, rgba(120,80,220,0.13) 0%, transparent 66%); }
/* deux halos animés supplémentaires via pseudo-éléments (aucun HTML ajouté) */
#galaxit-page .hero::before,
#galaxit-page .hero::after {
  content:""; position:absolute; border-radius:50%;
  pointer-events:none; z-index:0; filter:blur(50px);
}
#galaxit-page .hero::before {
  width:520px; height:520px; top:-140px; left:-110px;
  background:radial-gradient(circle, rgba(0,113,227,0.22) 0%, transparent 65%);
  animation:gx-float1 16s ease-in-out infinite;
}
#galaxit-page .hero::after {
  width:440px; height:440px; bottom:-160px; right:-90px;
  background:radial-gradient(circle, rgba(110,90,230,0.20) 0%, transparent 65%);
  animation:gx-float2 20s ease-in-out infinite;
}
@keyframes gx-float1 { 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(70px,46px) scale(1.12); } }
@keyframes gx-float2 { 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-60px,-34px) scale(1.1); } }
#galaxit-page .hero-content { position:relative; z-index:1; }
#galaxit-page .hero h1 { color:#1d1d1f; }
#galaxit-page .hero p { color:#6e6e73; }
/* base layout (manquant sur les pages "service-hero" type Blog/Carrières) + look clair */
#galaxit-page .hero-badge,
#galaxit-page .service-hero .hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.6rem 1.2rem; border-radius:var(--radius-sm);
  font-size:.85rem; font-weight:500; margin-bottom:1.5rem;
  background:#fff; border:1px solid #e8e8ed; color:#6e6e73; box-shadow:0 1px 3px rgba(0,0,0,.06);
}
@media (prefers-reduced-motion:reduce){
  #galaxit-page .hero-grid,
  #galaxit-page .hero::before,
  #galaxit-page .hero::after,
  #galaxit-page .hero-orb { animation:none !important; }
}

/* 5 — Sections */
#galaxit-page .gx-section-alt,
#galaxit-page .stats,
#galaxit-page .testimonials-section,
#galaxit-page .contact-form-section { background:#f5f5f7; border-color:#e8e8ed; }
#galaxit-page .cta-final { background:#f5f5f7; border-top:1px solid #e8e8ed; }
#galaxit-page .gx-h2 { color:#1d1d1f; }
#galaxit-page .gx-sub,
#galaxit-page .cta-final > p { color:#6e6e73; }
#galaxit-page .section-tag { background:rgba(0,102,204,0.08); border:1px solid rgba(0,102,204,0.12); color:#0066cc; }

/* 6 — Cartes (valeurs, services, étapes, faq, témoignages, formulaire) */
#galaxit-page .value-card,
#galaxit-page .service-card,
#galaxit-page .step,
#galaxit-page .faq-item,
#galaxit-page .testimonial-card,
#galaxit-page .contact-form { background:#fff; border:1px solid #e8e8ed; box-shadow:0 1px 2px rgba(0,0,0,.04); }
#galaxit-page .value-card:hover,
#galaxit-page .service-card:hover,
#galaxit-page .step:hover,
#galaxit-page .faq-item:hover,
#galaxit-page .testimonial-card:hover { border-color:#d2d2d7; background:#fff; box-shadow:0 12px 30px -16px rgba(0,0,0,.18); }
#galaxit-page .testimonial-card { border-left:3px solid #0071e3; }
#galaxit-page .value-card h3,
#galaxit-page .sc-title,
#galaxit-page .step-title,
#galaxit-page .faq-question,
#galaxit-page .testimonial-author { color:#1d1d1f; }
#galaxit-page .value-card p,
#galaxit-page .sc-desc,
#galaxit-page .step-desc,
#galaxit-page .faq-answer,
#galaxit-page .testimonial-quote { color:#6e6e73; }
#galaxit-page .testimonial-role { color:#86868b; }

/* Tuiles d'icônes */
#galaxit-page .value-icon-box,
#galaxit-page .sc-icon-box { background:rgba(0,102,204,0.08); }
#galaxit-page .value-card:hover .value-icon-box,
#galaxit-page .service-card:hover .sc-icon-box { background:rgba(0,102,204,0.14); }
#galaxit-page .value-icon-box svg,
#galaxit-page .sc-icon-box svg { color:#0071e3; }
#galaxit-page .faq-icon { background:rgba(0,102,204,0.12); color:#0066cc; }

/* Accents chiffrés */
#galaxit-page .stat-num,
#galaxit-page .step-num,
#galaxit-page .sol-stat-num { color:#0066cc; }
#galaxit-page .stat-label,
#galaxit-page .sol-stat-label { color:#6e6e73; }
#galaxit-page .stat-divider { background:#d2d2d7; }
#galaxit-page .sc-link { color:#0066cc; }

/* 7 — Formulaire */
#galaxit-page .form-group label { color:#1d1d1f; }
/* label de consentement RGPD : couleur en dur (ancien thème) corrigée */
#galaxit-page .contact-form label[for="rgpd"] { color:#6e6e73 !important; }
#galaxit-page .contact-form label[for="rgpd"] a { color:#0066cc !important; }
#galaxit-page .form-group input,
#galaxit-page .form-group textarea,
#galaxit-page .form-group select { background:#fff; border:1px solid #d2d2d7; color:#1d1d1f; border-radius:12px; }
#galaxit-page .form-group input:focus,
#galaxit-page .form-group textarea:focus,
#galaxit-page .form-group select:focus { border-color:#0071e3; background:#fff; box-shadow:0 0 0 4px rgba(0,113,227,.15); }
#galaxit-page .form-note { color:#86868b; }

/* 8 — Boutons pilule Apple */
#galaxit-page .btn { border-radius:980px; font-weight:400; }
#galaxit-page .btn-primary,
#galaxit-page .form-submit,
#gx-nav .nav-cta { background:#0071e3 !important; color:#fff !important; border-radius:980px !important; box-shadow:none !important; }
#galaxit-page .btn-primary:hover,
#galaxit-page .form-submit:hover,
#gx-nav .nav-cta:hover { background:#0077ed !important; box-shadow:none !important; }
#galaxit-page .btn-secondary { background:transparent; border:1px solid #0071e3; color:#0066cc; border-radius:980px; }
#galaxit-page .btn-secondary:hover { background:#0071e3; border-color:#0071e3; color:#fff; }

/* 9 — Footer clair (global + scoped) */
#gx-footer, #galaxit-page footer { background:#f5f5f7; border-top:1px solid #e8e8ed; color:#86868b; }
#gx-footer .footer-brand p,
#gx-footer .footer-col a,
#gx-footer .footer-contact-item span,
#gx-footer .footer-contact-item a,
#galaxit-page footer a,
#galaxit-page footer p { color:#86868b; }
#gx-footer .footer-col h4,
#galaxit-page footer h4,
.footer-col h4 { color:#1d1d1f; }
#gx-footer .footer-col a:hover,
#gx-footer .footer-contact-item a:hover,
#galaxit-page footer a:hover { color:#1d1d1f; }
#gx-footer .footer-contact-item svg { color:#0071e3; }
#gx-footer .footer-divider,
#gx-footer .footer-bottom-bar,
#galaxit-page .footer-bottom { border-color:#d6d6db; }
#gx-footer .footer-bottom-bar p,
#gx-footer .footer-bottom-bar a { color:#86868b; }
#gx-footer .footer-social-link { border:1px solid #d2d2d7; color:#86868b; }
#gx-footer .footer-social-link:hover { border-color:#0071e3; color:#0071e3; background:rgba(0,113,227,.05); }

/* 10 — Divers : curseur custom désactivé (look natif Apple) */
#galaxit-page .gx-cursor,
#galaxit-page .gx-cursor-ring { display:none !important; }

/* 11 — Correctif global : textes en couleur "en dur" héritée du thème sombre
   (variables déjà gérées ; ici on rattrape les valeurs littérales devenues
   illisibles sur fond clair, sans toucher au HTML) */
#galaxit-page [style*="rgba(200,215,255"],
#galaxit-page [style*="rgba(200, 215, 255"] { color:#6e6e73 !important; }
#galaxit-page [style*="rgba(228,235,255"],
#galaxit-page [style*="rgba(228, 235, 255"] { color:#6e6e73 !important; }
#galaxit-page [style*="#f4f7ff"],
#galaxit-page [style*="#e8eeff"] { color:#1d1d1f !important; }

/* 12 — Vignettes d'articles (illustrations sombres d'origine) éclaircies
   pour s'harmoniser avec le thème clair, sans changer les images source */
#galaxit-page img[src*="blog-"] {
  filter:invert(.93) hue-rotate(190deg) saturate(1) brightness(1.02) contrast(.92);
}

/* 13 — Grilles en style inline (repeat(3/4,1fr)) : pas de repli responsive
   d'origine, ce qui provoque un chevauchement sur tablette/mobile */
@media (max-width:900px) {
  #galaxit-page [style*="grid-template-columns: repeat(4, 1fr)"],
  #galaxit-page [style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns:repeat(2,1fr) !important;
  }
}
@media (max-width:640px) {
  #galaxit-page [style*="grid-template-columns: repeat(4, 1fr)"],
  #galaxit-page [style*="grid-template-columns: repeat(3, 1fr)"],
  #galaxit-page [style*="grid-template-columns: repeat(2, 1fr)"] {
    grid-template-columns:1fr !important;
  }
}

/* 14 — "Nos secteurs" (repeat(6,1fr)), "Cas client" (1fr 1fr) et la colonne
   "Postulez" (1fr 1.8fr) : grilles inline sans repli responsive, qui
   débordent/écrasent le contenu sur tablette et mobile */
@media (max-width:900px) {
  #galaxit-page [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns:repeat(3,1fr) !important;
  }
  #galaxit-page [style*="grid-template-columns: 1fr 1.8fr"],
  #galaxit-page [style*="grid-template-columns: 1fr 1fr; gap: 0"] {
    grid-template-columns:1fr !important;
  }
  #galaxit-page [style*="position: sticky; top: 100px"] {
    position:static !important;
  }
}
@media (max-width:640px) {
  #galaxit-page [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns:repeat(2,1fr) !important;
  }
}
