/* ============================================================
   BUILDER-HOME COMPAT — styles the Avada-Builder-native homepage
   sections so they render pixel-identical to the design-E theme.
   Scoped under .ipbb (set on each homepage builder container).
   ============================================================ */

/* Flatten Avada inner wrappers so theme CSS sees original structure */
.ipbb .fusion-column-wrapper,
.ipbb .fusion-text { display: contents; }

/* Neutral defaults inside builder sections */
.ipbb .fusion-builder-row { max-width: 1320px; }
.ipbb .fusion-layout-column { min-height: 0; }
.ipbb-grid .fusion-layout-column { margin: 0 !important; width: auto !important; max-width: none !important; }

/* Full-bleed embeds (marquee, brands, quote form shortcode) */
.ipbb-full .fusion-builder-row { max-width: 100% !important; margin: 0; padding: 0; }

/* ============ 1. HERO ============ */
#ipb-hero.ipbb { display: block; height: auto; }
.ipbb-hero .fusion-builder-row {
  display: grid !important; grid-template-columns: 55% 45%;
  max-width: 100% !important; width: 100%; margin: 0; height: 590px;
}
.ipbb-hero .hero-left {
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 32px 40px; height: 100%;
}
.ipbb-hero .hero-left .hero-eyebrow,
.ipbb-hero .hero-left .hero-h1,
.ipbb-hero .hero-left .hero-sub,
.ipbb-hero .hero-left .hero-btns { position: relative; z-index: 2; }
.ipbb-hero .ipbb-hero-right { display: grid; grid-template-rows: 1fr 1fr; gap: 3px; height: 100%; }
@media (max-width: 992px) {
  .ipbb-hero .fusion-builder-row { grid-template-columns: 1fr; height: auto; }
  .ipbb-hero .hero-left { min-height: 420px; }
  .ipbb-hero .ipbb-hero-right { display: none; }
}

/* ============ 4. TRUST BAR ============ */
.ipbb-trust .fusion-builder-row {
  display: grid !important; grid-template-columns: repeat(4, 1fr);
  gap: 20px; max-width: 1220px !important; margin: 0 auto; padding: 26px 32px;
}
@media (max-width: 960px) { .ipbb-trust .fusion-builder-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .ipbb-trust .fusion-builder-row { grid-template-columns: 1fr; } }

/* ============ 5-6. SERVICES (bento) ============ */
#ipb-services.ipbb { padding-bottom: 24px !important; }
.ipbb-services-cards { background: var(--bg2); padding: 0 32px 68px; }
.ipbb-services-cards .fusion-builder-row {
  display: grid !important; grid-template-columns: repeat(6, 1fr);
  gap: 3px; max-width: 1320px !important; margin: 0 auto;
}
.ipbb-services-cards .fusion-layout-column { display: flex; }
.ipbb-services-cards .fusion-layout-column > .bento-card { width: 100%; }
.ipbb-services-cards .fusion-layout-column.span-2 { grid-column: span 2; }
.ipbb-services-cards .fusion-layout-column.span-3 { grid-column: span 3; }
.ipbb-services-cards .fusion-layout-column.span-4 { grid-column: span 4; }
@media (max-width: 1200px) {
  .ipbb-services-cards .fusion-builder-row { grid-template-columns: repeat(4, 1fr); }
  .ipbb-services-cards .fusion-layout-column.span-3,
  .ipbb-services-cards .fusion-layout-column.span-4 { grid-column: span 4; }
  .ipbb-services-cards .fusion-layout-column.span-2 { grid-column: span 2; }
}
@media (max-width: 992px) { .ipbb-services-cards { padding: 0 24px 48px; } }
@media (max-width: 768px) {
  .ipbb-services-cards .fusion-builder-row { grid-template-columns: repeat(2, 1fr); }
  .ipbb-services-cards .fusion-layout-column.span-2,
  .ipbb-services-cards .fusion-layout-column.span-3,
  .ipbb-services-cards .fusion-layout-column.span-4 { grid-column: span 2; }
}
@media (max-width: 576px) {
  .ipbb-services-cards { padding: 0 16px 40px; }
  .ipbb-services-cards .fusion-builder-row { grid-template-columns: 1fr; }
  .ipbb-services-cards .fusion-layout-column.span-2,
  .ipbb-services-cards .fusion-layout-column.span-3,
  .ipbb-services-cards .fusion-layout-column.span-4 { grid-column: span 1; }
}

/* ============ 7. AI FEATURE ============ */
.ipbb-ai .fusion-builder-row {
  display: grid !important; grid-template-columns: 1fr 1fr;
  max-width: 100% !important; width: 100%; margin: 0;
}
.ipbb-ai .ai-left, .ipbb-ai .ai-right { height: 100%; }
@media (max-width: 992px) { .ipbb-ai .fusion-builder-row { grid-template-columns: 1fr; } }

/* ============ 8-9. STEPS ============ */
#ipb-steps.ipbb { padding-bottom: 0 !important; border-bottom: 0 !important; }
.ipbb-steps-cards { background: var(--bg2); border-bottom: 1px solid var(--bg3); padding: 24px 32px 88px; }
.ipbb-steps-cards .fusion-builder-row {
  display: grid !important; grid-template-columns: repeat(3, 1fr);
  gap: 22px; max-width: 1220px !important; margin: 0 auto;
}
.ipbb-steps-cards .fusion-layout-column:nth-child(1) .step-card { transform: rotate(-1.2deg); }
.ipbb-steps-cards .fusion-layout-column:nth-child(2) .step-card { transform: rotate(0.8deg) translateY(10px); }
.ipbb-steps-cards .fusion-layout-column:nth-child(3) .step-card { transform: rotate(-0.6deg); }
.ipbb-steps-cards .fusion-layout-column .step-card:hover {
  transform: rotate(0) translateY(-4px);
  box-shadow: 0 20px 46px rgba(14,14,14,0.1); border-color: var(--gold);
}
.ipbb-steps-cards .step-card { height: 100%; }
@media (max-width: 960px) {
  .ipbb-steps-cards .fusion-builder-row { grid-template-columns: 1fr; }
  .ipbb-steps-cards .fusion-layout-column .step-card { transform: none; }
}

/* ============ 10-11. GALLERY (masonry) ============ */
#ipb-gallery.ipbb { padding-bottom: 20px !important; }
.ipbb-gal-cards { background: var(--bg); padding: 0 32px 68px; }
.ipbb-gal-cards .fusion-builder-row {
  display: grid !important; grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 155px 155px 155px; gap: 3px;
  max-width: 1320px !important; margin: 0 auto;
}
@media (max-width: 992px) { .ipbb-gal-cards { padding: 0 24px 48px; } }
@media (max-width: 768px) {
  .ipbb-gal-cards .fusion-builder-row { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
  .ipbb-gal-cards .fusion-layout-column { grid-column: span 1 !important; grid-row: span 1 !important; height: 160px; }
}
@media (max-width: 576px) {
  .ipbb-gal-cards { padding: 0 16px 40px; }
  .ipbb-gal-cards .fusion-builder-row { grid-template-columns: 1fr; }
  .ipbb-gal-cards .fusion-layout-column { height: 180px; }
}

/* ============ 12-13. TESTIMONIALS ============ */
#ipb-testimonials.ipbb { padding-bottom: 20px !important; }
.ipbb-testi-cards { background: var(--bg); padding: 0 32px 68px; }
.ipbb-testi-cards .fusion-builder-row {
  display: grid !important; grid-template-columns: 1.4fr 1fr 1fr;
  gap: 3px; max-width: 1320px !important; margin: 0 auto;
}
.ipbb-testi-cards .testi-card { height: 100%; }
.ipbb-testi-cards .fusion-layout-column:nth-child(1) .testi-card { transform: rotate(-1.4deg); }
.ipbb-testi-cards .fusion-layout-column:nth-child(2) .testi-card { transform: rotate(1deg) translateY(8px); }
.ipbb-testi-cards .fusion-layout-column:nth-child(2) .testi-card::before { background: rgba(212,168,67,0.4); transform: rotate(2deg); }
.ipbb-testi-cards .fusion-layout-column:nth-child(3) .testi-card { transform: rotate(-0.8deg); }
.ipbb-testi-cards .fusion-layout-column:nth-child(3) .testi-card::before { background: rgba(42,107,66,0.28); transform: rotate(-2deg); }
.ipbb-testi-cards .fusion-layout-column .testi-card:hover { transform: rotate(0) translateY(-5px); box-shadow: 0 22px 50px rgba(14,14,14,0.12); }
@media (max-width: 992px) {
  .ipbb-testi-cards { padding: 0 24px 48px; }
  .ipbb-testi-cards .fusion-builder-row { grid-template-columns: 1fr; }
  .ipbb-testi-cards .fusion-layout-column .testi-card { transform: none; }
}

/* ============ 15-16. FAQ ============ */
#ipb-faq.ipbb { padding-bottom: 0 !important; }
.ipbb-faq-list { padding: 12px 32px 88px; }
.ipbb-faq-list .fusion-builder-row { max-width: 760px !important; margin: 0 auto; display: block; }
@media (max-width: 576px) { .ipbb-faq-list { padding: 12px 16px 60px; } }

/* ============ 17. CTA ============ */
.ipbb-cta .fusion-layout-column { position: relative; z-index: 1; }