/*
 Theme Name: Divi Child
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Divi Child Theme
 Author: Elegant Themes
 Author URI: https://www.elegantthemes.com
 Template: Divi
 Version: 1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */


/* ===========================
   FAQ SECTION (no JS needed)
   =========================== */

/* Layout wrapper */
.post-faq-wrap {
  margin: 60px auto 24px;
  max-width: 1200px;

}

/* Heading + Subtitle */
.post-faq-wrap h2 {
  text-align: center;
  margin-bottom: 8px;
  font-size: 32px;
}
.post-faq-wrap .faq-subtitle {
  text-align: center;
  margin: 0 0 32px;
}

/* Masonry-style layout */
.faq-grid {
  column-count: 1;
  column-gap: 24px;

}
@media (min-width: 768px) {
  .faq-grid {
    column-count: 1; /* One independent columns on desktop */
      width: 80%;
        margin: auto;
            
  }
}

/* Each FAQ Card */
.faq-item {
  display: block;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  -moz-column-break-inside: avoid;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  margin: 0 0 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

/* Question (summary) */
.faq-question {
  font-family: Figtree, Helvetica, Arial, Lucida, sans-serif;
  list-style: none;
  cursor: pointer;
  font-weight: 700;
  padding: 22px 52px 22px 18px;
  margin: 0;
  position: relative;
  transition: background 0.2s ease;
}
.faq-item summary::-webkit-details-marker {
  display: none;
}
.faq-item summary:hover {
  background: rgba(0, 0, 0, 0.03);
}

/* Chevron icon */
.faq-item summary::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 43%;
  width: 10px;
  height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  transition: transform 0.2s ease;
  opacity: 0.8;
}
.faq-item[open] summary::after {
  transform: translateY(-50%) rotate(-135deg);
}

/* Answer area */
.faq-answer {
     padding: 18px 30px 18px 18px;
  line-height: 1.6;
}

/* Optional hover shadow */
.faq-item:hover {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

/* Accessibility / reduced motion */
@media (prefers-reduced-motion: reduce) {
  .faq-item summary::after {
    transition: none;
  }
}



/* ===========================
   QUOTE SECTION - BLOG POSTS
   =========================== */
  .blog-body blockquote {
     --q-text: #193966;
    --q-accent1: #f19738;
    --q-accent2: #343651;

    position: relative;
    margin: 1.5rem 0;
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    border-radius: 16px;
    background: var(--q-bg);
    color: var(--q-text);
    box-shadow: 0 8px 24px rgba(2, 12, 27, .08);
    border: 1px solid rgba(2, 12, 27, .06);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;  
    }



 .blog-body blockquote:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0;
    bottom: 0;
    width: 6px;
    border-radius: 16px 0 0 16px;
    background: linear-gradient(135deg, var(--q-accent1), var(--q-accent2));
}



.blog-body blockquote:after {
    content: "“";
    position: absolute;
    right: 14px;
    top: 0;
    font-size: 100px;
    line-height: 1;
    color: rgb(240 147 54);
    pointer-events: none;
}


.blog-body blockquote span {
    font-style: italic;
}