/* ==========================================================================
   INTEGRATION DESIGN SYSTEM (Inspiré de global-css.txt & palettes spécifiques)
   ========================================================================== */ :root {
  --wp--preset--color--white: #ffffff;
  --roofing-primary: #6786a1;
  --roofing-secondary: #8ca7be;
  --roofing-dark: #333333;
  --roofing-gray: #aaaaaa;
  --roofing-light-gray: #e1e1e1;
  --roofing-navy: #000333;
  --font-jakarta: 'Plus Jakarta Sans', sans-serif;
  --wp--preset--shadow--natural: 0 10px 30px rgba(0, 0, 0, 0.04);
}
body {
  font-family: var(--font-jakarta);
  color: var(--roofing-dark);
  background-color: var(--wp--preset--color--white);
  overflow-x: hidden;
}
/* Section Architecture Global */
.section-padding {
  padding: 100px 0;
}
.bg-light-site {
  background-color: #f8fafc;
}
.bg-navy {
  background-color: var(--roofing-navy);
}
.bg-black-custom {
  background-color: #080a14;
}
/* Topbar Typography */
.roofing-topbar {
  background-color: var(--roofing-navy);
  font-size: 13px;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.text-primary-light {
  color: var(--roofing-secondary);
}
/* Navbar Dynamic jQuery Styles */
.main-navigation-bar {
  background-color: var(--wp--preset--color--white);
  padding: 22px 0;
  transition: all 0.35s ease-in-out;
}
.main-navigation-bar.navbar-scrolled {
  padding: 12px 0;
  background-color: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
}
.brand-icon {
  font-size: 28px;
  color: var(--roofing-primary);
}
.brand-title {
  font-weight: 800;
  font-size: 20px;
  letter-spacing: 1px;
  display: block;
  color: var(--roofing-navy);
}
.brand-subtitle {
  font-size: 15px;
  font-weight: 600;
  color: var(--roofing-gray);
  display: block;
  letter-spacing: 2px;
}
.nav-link-sky {
  color: var(--roofing-dark);
  font-weight: 600;
  font-size: 15px;
  padding: 8px 16px;
  transition: color 0.25s ease;
  text-decoration: none;
}
.nav-link-sky:hover {
  color: var(--roofing-primary);
}
.btn-nav-phone {
  background-color: var(--roofing-primary);
  color: var(--wp--preset--color--white);
  font-weight: 700;
  padding: 10px 22px;
  border-radius: 6px;
  font-size: 14px;
  text-decoration: none;
  transition: background-color 0.25s ease;
}
.btn-nav-phone:hover {
  background-color: var(--roofing-navy);
  color: var(--wp--preset--color--white);
}
/* Hero Elements */
.hero-block {
  padding: 160px 0;
}
.hero-badge {
  background-color: rgba(140, 167, 190, 0.25);
  border: 1px solid var(--roofing-secondary);
  color: var(--roofing-secondary);
  font-weight: 700;
  letter-spacing: 1.5px;
}
.hero-heading {
  font-weight: 800;
  letter-spacing: -1px;
}
.text-gradient {
  color: var(--roofing-secondary);
}
.hero-text-lead {
  max-width: 780px;
  color: #cbd5e1;
}
.btn-sky-primary {
  background-color: var(--roofing-secondary);
  color: white;
  border: none;
  border-radius: 4px;
  transition: transform 0.2s;
}
.btn-sky-primary:hover {
  background-color: var(--roofing-primary);
  transform: translateY(-2px);
}
.btn-sky-outline {
  border: 2px solid white;
  color: white;
  border-radius: 4px;
  transition: all 0.2s;
}
.btn-sky-outline:hover {
  background-color: white;
  color: var(--roofing-navy);
}
/* Title Design Elementor System */
.section-subtitle-badge {
  color: var(--roofing-primary);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2px;
  display: block;
  margin-bottom: 8px;
}
.section-main-title {
  color: var(--roofing-navy);
  font-weight: 800;
  font-size: 36px;
}
.title-bar-separator {
  width: 55px;
  height: 3px;
  background-color: var(--roofing-secondary);
  border-radius: 2px;
}
/* Card Element Structure */
.sky-card-element {
  background: var(--wp--preset--color--white);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: var(--wp--preset--shadow--natural);
  height: 100%;
  transition: transform 0.3s ease;
}
.sky-card-element:hover {
  transform: translateY(-6px);
}
.card-img-holder {
  height: 230px;
  overflow: hidden;
}
.card-img-holder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-element-title {
  color: var(--roofing-navy);
  font-weight: 700;
}
/* Form Interactivité Visual */
.sky-interactive-form {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
}
.btn-form-submit {
  background-color: var(--roofing-navy);
  color: white;
  font-weight: 700;
  border: none;
  border-radius: 6px;
  transition: background-color 0.25s;
}
.btn-form-submit:hover {
  background-color: var(--roofing-primary);
}
/* Animation Utilities via Class */
.animate-bounce {
  animation: bounceEffect 2s infinite;
}
@keyframes bounceEffect {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-4px);
  }
}
iframe {
  display: block
}
.no-link {
  color: inherit !important;
  text-decoration: none !important;
  pointer-events: none;
}