/* ===========================================================================
   eldecoeoe.com — FAQ accordion and hero lede, 19 October 2026.

   FAQ. Two pages carry a <details class="faq-item"> accordion that no rule
   reached. On eldeco-7-peaks-residences-greater-noida the same page already
   renders a second FAQ correctly through .faq-block details / .faq-block
   summary / .faq-block .faq-a, so the values below are that page's own,
   lifted verbatim, and the two FAQs now match. The native disclosure marker
   is kept, exactly as .faq-block summary keeps it.

   Hero lede. Two pages open with <p class="lede"> inside the dark .hero.
   The host's own paragraph in that same slot is .hero .tldr; these values are
   its values, with the text colour derived from currentColor so the block is
   correct whatever the hero's ink.

   Linked only into pages that define none of these classes.
   =========================================================================== */

/* --- FAQ accordion ----------------------------------------------------- */
.faq-item{
  background:var(--white,#fff);
  border:1.5px solid var(--border,#e0e0d8);
  border-radius:10px;
  padding:14px 20px;
  margin-bottom:10px;
}
.faq-item[open]{
  border-color:var(--vd-accent,var(--gold,#c9a84c));
  box-shadow:var(--shadow-sm,0 1px 3px rgba(26,58,42,.08));
}
.faq-q,
.faq-item>summary{
  font-weight:600;
  font-size:15.5px;
  color:var(--eden-deep,#1a3a2a);
  cursor:pointer;
  padding:6px 0;
}
.faq-item[open]>.faq-q,
.faq-item[open]>summary{
  color:var(--gold-dark,#a88a3a);
}
.faq-answer,
.faq-item>p:not([class]){
  font-size:14.5px;
  line-height:1.75;
  color:var(--text-secondary,#4a4a4a);
  padding:10px 0 4px;
}

/* --- opening paragraph inside the dark hero ----------------------------- */
.hero .lede{
  max-width:720px;
  margin:0 auto 20px;
  font-size:15px;
  line-height:1.7;
  color:color-mix(in srgb, currentColor 85%, transparent);
}