.faq-hero{
  padding:84px 0 76px;
  color:#fff;
  text-align:center;
  background:linear-gradient(120deg,rgba(17,17,17,.92),rgba(49,22,22,.78)),url('../assets/hero-section-photo.jpeg') center/cover;
}
.faq-hero .section-label{color:#f6b5b5}
.faq-hero h1{max-width:700px;margin:12px auto 14px;font-size:42px;line-height:1.18}
.faq-hero p{max-width:560px;margin:0 auto;color:rgba(255,255,255,.84);line-height:1.7}
.faq-section{padding:80px 0;background:#f8f8f8}
.faq-layout{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr);gap:5rem;align-items:start}
.faq-intro{position:sticky;top:90px}
.faq-intro h2{margin:0 0 1rem;font-size:30px;line-height:1.25}
.faq-intro p{margin:0 0 1.75rem;color:var(--color-muted);font-size:15px;line-height:1.7}
.faq-list{border-top:1px solid #e5e5e5}
.faq-item{background:#fff;border-bottom:1px solid #e5e5e5}
.faq-item summary{position:relative;padding:23px 60px 23px 24px;color:var(--color-black);font-size:16px;font-weight:600;line-height:1.45;cursor:pointer;list-style:none;transition:color .2s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'›';position:absolute;right:24px;top:50%;color:var(--color-primary);font-size:30px;font-weight:400;line-height:1;transform:translateY(-50%) rotate(0);transition:transform .25s}
.faq-item[open] summary{color:var(--color-primary)}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(90deg)}
.faq-answer{padding:0 60px 24px 24px;animation:faq-open .25s ease-out}
.faq-answer p{margin:0;color:var(--color-muted);font-size:15px;line-height:1.75}
.footer-contact-button{display:inline-block;margin-top:1rem}
@keyframes faq-open{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:768px){
  .faq-hero{padding:64px 0 58px}
  .faq-hero h1{font-size:33px}
  .faq-section{padding:50px 0}
  .faq-layout{grid-template-columns:1fr;gap:2.5rem}
  .faq-intro{position:static}
}
@media(max-width:480px){
  .faq-hero h1{font-size:29px}
  .faq-item summary{padding:20px 50px 20px 18px;font-size:15px}
  .faq-item summary::after{right:18px}
  .faq-answer{padding:0 24px 20px 18px}
}

/* Keep FAQ contact action compact on smaller screens */
@media(max-width:768px){
  .faq-intro .btn{display:inline-block;width:fit-content;max-width:max-content;white-space:nowrap}
}
