/* ============================================================================
   PREMIUM OVERRIDES — BTP CONSULTING  (évolution maîtrisée, ADN navy/orange)
   Calque additif chargé en dernier. N'altère pas la structure : couleurs,
   profondeur, micro-interactions, typographie, respiration.
   ============================================================================ */

:root {
  --btp-navy:   #1B3A6D;
  --btp-navy-2: #0F2747;
  --btp-blue:   #2563EB;
  --btp-orange: #F37021;
  --btp-orange-l:#FF8A4C;
  --ease: cubic-bezier(.16,1,.3,1);
  --ring: 0 1px 2px rgba(16,24,40,.04), 0 8px 24px -8px rgba(16,24,40,.12);
  --ring-hover: 0 1px 2px rgba(16,24,40,.04), 0 24px 48px -16px rgba(27,58,109,.30);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--btp-orange); color: #fff; }

/* ---- Typographie : resserrement premium des titres ---- */
h1, h2, h3, .hero-title-new, .section-title { letter-spacing: -.02em; }
h2 { line-height: 1.15; }

/* ---- Eyebrow / labels de section ("NOS MÉTIERS"…) ---- */
.section-label, .section-tag, .eyebrow, [class*="section-label"] {
  letter-spacing: .18em !important;
  font-weight: 700 !important;
}

/* ============================ HERO ============================ */
.hero-title-new { text-shadow: 0 2px 28px rgba(0,0,0,.30); }

/* Stats du hero en cartes "verre dépoli" */
.hero-stats-new > * {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 16px;
  padding: 16px 22px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: transform .45s var(--ease), background .45s var(--ease), border-color .45s var(--ease);
}
.hero-stats-new > *:hover {
  transform: translateY(-5px);
  background: rgba(255,255,255,.13);
  border-color: rgba(243,112,32,.55);
}

/* ============================ BOUTONS ============================ */
.btn-primary, .btn.btn-primary, .hero-cta, a.cta-primary, .btn-cta {
  background: linear-gradient(135deg, var(--btp-orange), var(--btp-orange-l)) !important;
  border: none !important;
  box-shadow: 0 8px 22px -8px rgba(243,112,32,.55);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), filter .3s var(--ease);
}
.btn-primary:hover, .btn.btn-primary:hover, .hero-cta:hover, a.cta-primary:hover, .btn-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -8px rgba(243,112,32,.65);
  filter: saturate(1.05);
}
.btn-outline {
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.btn-outline:hover {
  transform: translateY(-2px);
  background: var(--btp-orange);
  border-color: var(--btp-orange) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -10px rgba(243,112,32,.5);
}

/* ============================ MÉTIERS ============================ */
.metier-card {
  border: 1px solid rgba(27,58,109,.06);
  box-shadow: var(--ring);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
  position: relative;
  overflow: hidden;
}
/* liseré d'accent au survol */
.metier-card::before {
  content: "";
  position: absolute; left: 0; top: 0; height: 3px; width: 100%;
  background: linear-gradient(90deg, var(--btp-orange), var(--btp-orange-l));
  transform: scaleX(0); transform-origin: left;
  transition: transform .45s var(--ease);
}
.metier-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--ring-hover);
  border-color: rgba(243,112,32,.35);
}
.metier-card:hover::before { transform: scaleX(1); }

/* ============================ AGRÉMENTS ============================ */
.agrement-card {
  padding: 16px 18px !important;
  border: 1px solid rgba(27,58,109,.07);
  box-shadow: var(--ring);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.agrement-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--ring-hover);
  border-color: rgba(243,112,32,.30);
}

/* ============================ VALEURS ============================ */
.value-card {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  transition: transform .45s var(--ease), background .45s var(--ease), border-color .45s var(--ease);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.value-card:hover {
  transform: translateY(-6px);
  background: rgba(255,255,255,.06);
  border-color: rgba(243,112,32,.45);
}

/* ============================ NAV ============================ */
.nav-link, header nav a { transition: color .25s var(--ease); }

/* ---- Respiration : transitions douces sur les images au survol ---- */
.metier-card img, .agrement-card img { transition: transform .5s var(--ease); }
.metier-card:hover img { transform: scale(1.06); }

/* ---- Accessibilité : focus visibles premium ---- */
a:focus-visible, button:focus-visible, .btn:focus-visible {
  outline: 2px solid var(--btp-orange);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ============================ IFRAMES (anti-flash) ============================ */
/* Fond doux + état de chargement au lieu du blanc cru sous les iframes lazy */
.map-embed-container, .carrieres-embed-container {
  position: relative;
  background: linear-gradient(135deg, #e9eef5 0%, #f6f9fc 100%);
}
.map-embed-container::after, .carrieres-embed-container::after {
  content: "Chargement…";
  position: absolute; inset: 0; z-index: 0;
  display: flex; align-items: center; justify-content: center;
  color: #8aa0bd; font-size: .9rem; letter-spacing: .08em;
  text-transform: uppercase; font-weight: 600;
}
.map-embed-container iframe, .carrieres-embed-container iframe {
  position: relative; z-index: 1; background: transparent;
}

/* ---- Respect des préférences de mouvement ---- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}