/**
 * PhotoEZ Theme — Elementor layout & contrast fixes
 * Ensures section backgrounds, hero images, and text colors render correctly.
 */

/* =============================================
   SECTION BACKGROUNDS (fallback if Elementor meta incomplete)
   ============================================= */

.pez-welcome-bar.elementor-section {
  background-color: #920000 !important;
}

.pez-welcome-bar .elementor-heading-title {
  color: #ffffff !important;
  margin: 0 !important;
  font-family: var(--pez-font-heading) !important;
  letter-spacing: 0.02em;
}

.pez-welcome-bar > .elementor-container {
  max-width: 100%;
  justify-content: center;
}

.pez-section-dark.elementor-section {
  background-color: #111118 !important;
}

.pez-section-light.elementor-section {
  background-color: #FFFFFF !important;
}

.pez-section-muted.elementor-section {
  background-color: #F8F7FF !important;
}

/* =============================================
   HERO — full-bleed cover, no animation drift
   ============================================= */

.pez-hero-section.elementor-section:not(.pez-hero-slider) {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  min-height: calc(100vh - var(--pez-header-height)) !important;
  position: relative;
}

.pez-hero-section > .elementor-background-overlay {
  background-color: #111118 !important;
  opacity: 0.55 !important;
}

.pez-hero-section > .elementor-container {
  position: relative;
  z-index: 2;
}

/* Image-backed sections (CTA, etc.) */
.pez-bg-image-section.elementor-section {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.pez-bg-image-section > .elementor-background-overlay {
  background-color: #111118 !important;
  opacity: 0.6 !important;
}

/* =============================================
   TEXT ON DARK SECTIONS
   ============================================= */

.pez-dark-section .elementor-heading-title,
.pez-section-dark .elementor-heading-title,
.pez-hero-section .elementor-heading-title,
.pez-bg-image-section .elementor-heading-title {
  color: #ffffff !important;
}

.pez-dark-section .elementor-widget-text-editor > .elementor-widget-container,
.pez-section-dark .elementor-widget-text-editor > .elementor-widget-container,
.pez-hero-section .elementor-widget-text-editor > .elementor-widget-container,
.pez-bg-image-section .elementor-widget-text-editor > .elementor-widget-container {
  background-color: transparent !important;
  box-shadow: none !important;
}

.pez-dark-section .elementor-widget-text-editor > .elementor-widget-container > p,
.pez-section-dark .elementor-widget-text-editor > .elementor-widget-container > p:not(.pez-quote),
.pez-hero-section .elementor-widget-text-editor > .elementor-widget-container > p,
.pez-bg-image-section .elementor-widget-text-editor > .elementor-widget-container > p {
  color: rgba(255, 255, 255, 0.82) !important;
}

.pez-dark-section .elementor-icon-list-text,
.pez-dark-section .elementor-icon-list-text a,
.pez-section-dark .elementor-icon-list-text {
  color: rgba(255, 255, 255, 0.88) !important;
}

.pez-dark-section .elementor-icon-list-text strong {
  color: #ffffff !important;
}

/* =============================================
   TEXT ON LIGHT SECTIONS
   ============================================= */

.pez-section-light .elementor-heading-title,
.pez-section-muted .elementor-heading-title {
  color: #1A1A2E !important;
}

.pez-section-light .elementor-widget-text-editor,
.pez-section-light .elementor-widget-text-editor p,
.pez-section-muted .elementor-widget-text-editor,
.pez-section-muted .elementor-widget-text-editor p {
  color: #6B7280 !important;
}

/* Process steps on muted background */
.pez-section-muted .pez-step-grid h4 {
  color: #1A1A2E !important;
}

.pez-section-muted .pez-step-grid p {
  color: #6B7280 !important;
}

/* =============================================
   WELCOME BAR (under hero)
   ============================================= */

@media (max-width: 767px) {
  .pez-welcome-bar .elementor-heading-title {
    font-size: 1.5rem !important;
  }
}

/* =============================================
   BUTTONS — solid brand primary (no purple gradient)
   ============================================= */

.elementor-button,
.elementor-button-wrapper .elementor-button {
  background-color: #E8315B !important;
  background-image: none !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(232, 49, 91, 0.3) !important;
}

.elementor-button:hover,
.elementor-button-wrapper .elementor-button:hover {
  background-color: #C0204A !important;
  background-image: none !important;
  color: #ffffff !important;
}

/* Ghost / outline buttons on dark backgrounds */
.pez-hero-section .elementor-button-group .elementor-button.elementor-button-outline,
.pez-bg-image-section .elementor-button-group .elementor-button.elementor-button-outline {
  background: transparent !important;
  color: #ffffff !important;
  border: 2px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: none !important;
}

/* =============================================
   STEP NUMBERS — solid coral, no gradient
   ============================================= */

.pez-step-num {
  width: 56px;
  height: 56px;
  background: #E8315B;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--pez-font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  margin: 0 auto 1rem;
}

.pez-step-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  text-align: center;
}

@media (max-width: 900px) {
  .pez-step-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .pez-step-grid {
    grid-template-columns: 1fr;
  }
}

/* =============================================
   TESTIMONIAL GRID
   ============================================= */

.pez-testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

@media (max-width: 900px) {
  .pez-testimonial-grid {
    grid-template-columns: 1fr;
  }
}

.pez-testimonial-card {
  background: #1C1C27 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px;
  padding: 2rem;
  color: rgba(255, 255, 255, 0.88);
}

.pez-testimonial-card .pez-stars {
  color: #F59E0B !important;
  margin-bottom: 1rem;
  font-size: 1rem;
  letter-spacing: 2px;
}

.pez-testimonial-card .pez-quote {
  color: rgba(255, 255, 255, 0.88) !important;
  font-family: var(--pez-font-heading);
  font-style: italic;
  font-size: 1.1rem;
  line-height: 1.7;
  margin: 0 0 1.5rem;
}

.pez-testimonial-card .pez-author {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.pez-testimonial-card .pez-author img {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #E8315B;
}

.pez-testimonial-card .pez-author-name {
  color: #ffffff !important;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1.3;
}

.pez-testimonial-card .pez-author-role {
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 0.8rem;
  line-height: 1.3;
}

/* =============================================
   EYEBROW LABELS
   ============================================= */

.pez-eyebrow-label {
  font-family: var(--pez-font-label);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #E8315B;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
}

.pez-eyebrow-label::before {
  content: '';
  display: inline-block;
  width: 2rem;
  height: 2px;
  background: #E8315B;
  flex-shrink: 0;
}

.pez-section-dark .pez-eyebrow-label,
.pez-bg-image-section .pez-eyebrow-label {
  color: #FF6B8A;
}

.pez-section-dark .pez-eyebrow-label::before,
.pez-bg-image-section .pez-eyebrow-label::before {
  background: #FF6B8A;
}

/* =============================================
   RECENT WORK — Elementor basic image gallery
   ============================================= */

.pez-recent-work-gallery .elementor-image-gallery .gallery,
.pez-gallery-refined .elementor-image-gallery .gallery,
.pez-section-light .pez-gallery-refined .elementor-image-gallery .gallery,
.pez-section-light .pez-recent-work-gallery .elementor-image-gallery .gallery {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: 0;
}

.pez-recent-work-gallery .elementor-widget-container,
.pez-gallery-restored .elementor-widget-container,
.elementor-widget-shortcode.pez-recent-work-gallery {
  width: 100%;
}

.pez-recent-work-gallery .gallery-item,
.pez-gallery-refined .gallery-item,
.pez-gallery-restored .gallery-item,
.pez-section-light .pez-gallery-refined .gallery-item,
.pez-section-light .pez-recent-work-gallery .gallery-item {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: hidden;
  border-radius: var(--pez-radius-lg);
  background: var(--pez-dark-2);
  opacity: 1 !important;
  visibility: visible !important;
}

.pez-recent-work-gallery .gallery-icon,
.pez-gallery-refined .gallery-icon,
.pez-section-light .pez-gallery-refined .gallery-icon,
.pez-section-light .pez-recent-work-gallery .gallery-icon {
  line-height: 0;
}

.pez-recent-work-gallery .gallery-item img,
.pez-gallery-refined .gallery-item img,
.pez-section-light .pez-gallery-refined .gallery-item img,
.pez-section-light .pez-recent-work-gallery .gallery-item img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 900px) {
  .pez-recent-work-gallery .elementor-image-gallery .gallery,
  .pez-gallery-refined .elementor-image-gallery .gallery,
  .pez-section-light .pez-gallery-refined .elementor-image-gallery .gallery,
  .pez-section-light .pez-recent-work-gallery .elementor-image-gallery .gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .pez-recent-work-gallery .elementor-image-gallery .gallery,
  .pez-gallery-refined .elementor-image-gallery .gallery,
  .pez-section-light .pez-gallery-refined .elementor-image-gallery .gallery,
  .pez-section-light .pez-recent-work-gallery .elementor-image-gallery .gallery {
    grid-template-columns: 1fr;
  }
}
