/* ===== Scoped Basics ===== */
#hh-inline-faq{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:#0f172a; position:relative;
}
#hh-inline-faq .faq-wrapper{ max-width:950px; margin:0 auto; text-align:center; }

/* Heading */
#hh-inline-faq #faq-title{
  font-size:clamp(26px,4vw,36px); font-weight:800; letter-spacing:-.02em; line-height:1.2;
  margin:0 0 14px;
}

/* Action buttons */
#hh-inline-faq .faq-actions{ display:flex; gap:10px; margin:0 0 12px; justify-content:center; }
#hh-inline-faq .faq-actions button{
  appearance:none; border:1px solid #e2e8f0; background:#fff; color:#0f172a;
  padding:8px 12px; border-radius:10px; font-weight:700; cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease, border-color .2s ease;
}
#hh-inline-faq .faq-actions button:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(2,6,23,.08); }
#hh-inline-faq .faq-actions button:focus-visible{ outline:3px solid rgba(37,99,235,.28); outline-offset:2px; }

/* List & items */
#hh-inline-faq .faq-list{ display:grid; gap:10px; justify-items:center; }
#hh-inline-faq .faq-item{
  width:min(760px, 100%);
  background:#fff; border:1px solid #e2e8f0; border-radius:16px; overflow:hidden;
  box-shadow:0 8px 20px rgba(0,0,0,.05);
  text-align:left;
}

/* Toggle button */
#hh-inline-faq .faq-toggle{
  width:100%; background:none; border:0; text-align:left; cursor:pointer;
  display:grid; grid-template-columns:32px 1fr 20px; align-items:center; gap:12px;
  padding:16px 18px; font-size:16px; font-weight:800; color:#0f172a;
}
#hh-inline-faq .faq-left{ color:#2563eb; }
#hh-inline-faq .faq-right{ color:#0f172a; }
#hh-inline-faq .faq-toggle .caret{ width:18px; height:18px; transition:transform .25s ease; justify-self:end; }
#hh-inline-faq .faq-toggle[aria-expanded="true"] .caret{ transform:rotate(180deg); }
#hh-inline-faq .faq-toggle:focus-visible{ outline:3px solid rgba(37,99,235,.28); outline-offset:2px; border-radius:10px; }

/* Panel */
#hh-inline-faq .faq-content{
  max-height:0; opacity:0; overflow:hidden; padding:0 18px; color:#475569;
  transition:max-height .3s ease, opacity .25s ease, padding .25s ease;
  border-top:1px solid #e2e8f0;
}
#hh-inline-faq .faq-content.show{ max-height:800px; opacity:1; padding:12px 18px 18px; }
#hh-inline-faq .faq-content p{ margin:0; line-height:1.6; }

/* TL;DR */
#hh-inline-faq .faq-content .tldr{ margin:0 0 6px; color:#0f172a; }
#hh-inline-faq .faq-content .tldr strong{ font-weight:800 }

/* Footnote */
#hh-inline-faq .faq-footnote{ margin:12px 2px 0; color:#475569; text-align:center; }

/* Mini-CTA */
#hh-inline-faq .faq-cta{ margin:16px 0 0; display:flex; justify-content:center; }
#hh-inline-faq .faq-cta-btn{
  display:inline-block; padding:12px 16px; border-radius:12px; font-weight:800;
  text-decoration:none; line-height:1; font-size:14px; color:#fff;
  background:linear-gradient(90deg,#2563eb,#38bdf8);
  box-shadow:0 8px 20px rgba(56,189,248,.28);
  transition:transform .2s ease, box-shadow .2s ease;
}
#hh-inline-faq .faq-cta-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(56,189,248,.35) }

/* ===== Emoji Hover Boost ===== */
#hh-inline-faq .faq-emoji{
  display:inline-block; line-height:1;
  transition: transform 300ms ease, filter 300ms ease;
}
@media (hover:hover) and (pointer:fine){
  /* Emojis in Fragezeile & im Panel wachsen, wenn Item hovered/focused */
  #hh-inline-faq .faq-item:hover .faq-emoji,
  #hh-inline-faq .faq-item:focus-within .faq-emoji{
    transform:scale(1.2);
    filter:drop-shadow(0 2px 4px rgba(14,165,233,.30));
  }
}
/* Mobil: Boost bei geöffnetem Eintrag */
@media (hover:none) and (pointer:coarse){
  #hh-inline-faq .faq-toggle[aria-expanded="true"] .faq-emoji,
  #hh-inline-faq .faq-content.show .faq-emoji{
    transform:scale(1.2);
    filter:drop-shadow(0 2px 4px rgba(14,165,233,.30));
  }
}

/* Currency highlight (optional) */
#hh-inline-faq .faq-content .hh-amount{ font-weight:700; color:#0f172a; }

/* Responsive */
@media (max-width:640px){
  #hh-inline-faq .faq-actions{ flex-wrap:wrap; }
  #hh-inline-faq .faq-toggle{ grid-template-columns:28px 1fr 18px; padding:14px 14px; font-size:15px; }
  #hh-inline-faq .faq-content{ font-size:14px; }
  #hh-inline-faq .faq-item{ width:100%; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  #hh-inline-faq *{ transition:none !important; }
}