/**
 * AGHUB SUARL - custom.css
 * Styles additionnels et ajustements Elementor
 */

/* ===== ELEMENTOR COMPATIBILITY ===== */

/* Assure que les pages Elementor couvrent tout l'écran */
.elementor-page .site-content {
  padding: 0;
}

/* Widgets Elementor héritent la typographie du thème */
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  font-family: var(--font-corps);
  color: var(--texte-moyen);
}

.elementor-widget-heading .elementor-heading-title {
  font-family: var(--font-titre);
}

/* Boutons Elementor avec couleurs du thème */
.elementor-button {
  border-radius: 50px !important;
  font-family: var(--font-corps) !important;
  font-weight: 600 !important;
}

/* ===== CLASSES UTILITAIRES ELEMENTOR ===== */
/* Ces classes peuvent être utilisées dans Elementor gratuit > Advanced > CSS Classes */

.ag-card {
  background: var(--blanc);
  border-radius: var(--radius);
  padding: 32px;
  box-shadow: var(--ombre);
  transition: var(--transition);
}

.ag-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--ombre-forte);
}

.ag-card-vert {
  background: var(--vert-fonce);
  color: var(--blanc);
}

.ag-card-orange {
  background: var(--orange);
  color: var(--blanc);
}

.ag-card-creme {
  background: var(--creme);
}

.ag-section-vert {
  background: var(--vert-fonce) !important;
}

.ag-section-creme {
  background: var(--creme) !important;
}

.ag-rounded {
  border-radius: var(--radius-lg) !important;
  overflow: hidden;
}

.ag-shadow {
  box-shadow: var(--ombre) !important;
}

.ag-shadow-forte {
  box-shadow: var(--ombre-forte) !important;
}

.ag-titre {
  font-family: var(--font-titre) !important;
  color: var(--vert-fonce) !important;
}

.ag-titre-blanc {
  font-family: var(--font-titre) !important;
  color: var(--blanc) !important;
}

.ag-accent {
  color: var(--orange) !important;
  font-family: var(--font-accent) !important;
  font-size: 1.2em !important;
}

.ag-divider {
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, var(--vert-moyen), var(--orange));
  border-radius: 2px;
  margin: 16px 0;
}

/* ===== BADGE MARQUES ===== */
.ag-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 0.85rem;
  font-weight: 600;
}

.ag-badge-vert {
  background: rgba(45,122,79,0.12);
  color: var(--vert-fonce);
  border: 1px solid rgba(45,122,79,0.25);
}

.ag-badge-orange {
  background: rgba(232,101,26,0.12);
  color: var(--orange);
  border: 1px solid rgba(232,101,26,0.25);
}

/* ===== ANIMATIONS SUPPLÉMENTAIRES ===== */
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.ag-shimmer {
  background: linear-gradient(90deg, var(--creme) 25%, var(--creme-fonce) 50%, var(--creme) 75%);
  background-size: 200% auto;
  animation: shimmer 1.5s linear infinite;
}

/* Hover image scale */
.ag-img-zoom {
  overflow: hidden;
  border-radius: var(--radius);
}

.ag-img-zoom img {
  transition: transform 0.5s ease;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ag-img-zoom:hover img {
  transform: scale(1.06);
}

/* ===== TYPOGRAPHIE HELPER ===== */
.ag-caption {
  font-size: 0.82rem;
  color: var(--texte-moyen);
  letter-spacing: 0.3px;
}

.ag-overline {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--orange);
}

/* ===== PAGE SINGLE / BLOG ===== */
.single-content,
.page-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 60px 24px;
}

.single-content h2 { margin: 32px 0 16px; }
.single-content h3 { margin: 24px 0 12px; }
.single-content p { margin-bottom: 20px; line-height: 1.8; }
.single-content ul, .single-content ol { padding-left: 24px; margin-bottom: 20px; }
.single-content li { margin-bottom: 8px; }

/* ===== PRINT ===== */
@media print {
  .site-header,
  .hero-scroll,
  .contact-form-wrap,
  .values-section { display: none; }

  body { font-size: 12pt; color: #000; }
  a { color: #000; text-decoration: underline; }
}
