/* FAQ-Seite – Ergänzungen zum gemeinsamen NormHow-Design */
.faq-hero{
  min-height:750px;
  background:
    radial-gradient(circle at 77% 44%,rgba(95,168,160,.12),transparent 28%),
    radial-gradient(circle at 36% 10%,rgba(198,154,66,.08),transparent 31%),
    var(--dark);
}
.faq-hero .hero-grid{grid-template-columns:1.02fr .98fr;min-height:680px}
.faq-hero h1{font-size:clamp(2.7rem,6vw,4.9rem)}
.hero-note{display:grid;grid-template-columns:8px auto;gap:0 10px;align-items:center;margin-top:38px;color:#888c87;font-size:11px}
.hero-note i{grid-row:1/3;width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 6px rgba(95,168,160,.1)}
.hero-note strong{color:#c7c9c5;font-size:11px}
.hero-note span{grid-column:2}

.answer-principle{padding:34px;border:1px solid var(--line);border-top:5px solid var(--gold);border-radius:30px 30px 18px 18px;background:rgba(28,30,33,.96);box-shadow:0 28px 70px rgba(0,0,0,.22)}
.answer-principle header{display:flex;justify-content:space-between;color:#737772;font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.answer-principle header b{color:var(--gold);font-weight:600}
.answer-principle blockquote{max-width:490px;margin:62px 0 46px;color:var(--warm);font:600 clamp(1.65rem,2.5vw,2.1rem)/1.3 Sora;border:0}
.answer-principle ol{margin:0;padding:0;list-style:none}
.answer-principle li{display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:center;padding:16px 0;border-top:1px solid var(--line)}
.answer-principle li:last-child{border-bottom:1px solid var(--line)}
.answer-principle li>b{color:var(--gold);font:600 1rem Sora}
.answer-principle li strong,.answer-principle li small{display:block}
.answer-principle li strong{font-size:12px}
.answer-principle li small{margin-top:3px;color:#7f837e;font-size:11px}

.overview-section{background:var(--warm)}
.finder-bar{display:grid;grid-template-columns:1.25fr 1.65fr auto;gap:18px;align-items:end;padding:26px;border:1px solid #d3d0c8;border-radius:18px;background:rgba(255,255,255,.46)}
.search-field>label,.filter-area>span{display:block;margin-bottom:8px;color:#8a7b62;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.search-field>div{display:grid;grid-template-columns:24px 1fr 30px;align-items:center;min-height:50px;padding:0 12px;border:1px solid #cfccc4;border-radius:11px;background:#fff}
.search-field>div:focus-within{border-color:#a87b2e;box-shadow:0 0 0 3px rgba(198,154,66,.1)}
.search-field>div>span{color:#a87b2e;font-size:22px}
.search-field input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:13px Inter}
.search-field input::placeholder{color:#929590}
.search-field button{width:28px;height:28px;border:0;border-radius:50%;background:#ece8df;color:#525553;cursor:pointer}
.filter-buttons{display:flex;flex-wrap:wrap;gap:7px}
.filter-buttons button{padding:9px 12px;border:1px solid #d2cfc7;border-radius:30px;background:transparent;color:#5e6260;font-size:11px;cursor:pointer;transition:.2s}
.filter-buttons button:hover,.filter-buttons button.is-active{border-color:#a87b2e;background:rgba(198,154,66,.1);color:#7e5820}
.finder-status{display:grid;place-items:center;min-width:125px;min-height:76px;padding:12px;border-radius:13px;background:var(--dark);text-align:center}
.finder-status strong{color:var(--gold);font:600 1.6rem Sora}
.finder-status span{color:#8d918c;font-size:11px}
.no-results{margin-top:16px;padding:24px;border:1px solid #d3d0c8;border-radius:13px;background:rgba(255,255,255,.45);color:#686b68}
.no-results strong,.no-results span{display:block}
.no-results strong{color:var(--ink);font:600 1rem Sora}
.no-results a{display:inline-block;margin-top:10px;color:#8c6424;font-weight:700}

.faq-group{scroll-margin-top:125px}
.faq-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:90px;align-items:start}
.faq-group-head{position:sticky;top:170px}
.faq-group-head h2{font-size:clamp(2rem,4vw,3.3rem)}
.faq-group-head>p:last-child{max-width:430px;margin-top:27px;color:#969994}
.warm .faq-group-head>p:last-child,.light .faq-group-head>p:last-child{color:#656967}

.faq-list{display:grid;gap:10px}
.faq-item{border:1px solid var(--line);border-radius:15px;background:#1c1e21;overflow:hidden;transition:opacity .6s ease var(--delay,0ms),transform .6s ease var(--delay,0ms),border-color .25s ease}
.faq-item:hover,.faq-item.is-open{border-color:rgba(198,154,66,.35)}
.faq-item[hidden],.faq-group.is-filtered-out{display:none}
.faq-question{display:grid;grid-template-columns:minmax(0,76%) minmax(64px,24%);gap:0;align-items:center;width:100%;min-height:102px;padding:20px 22px;border:0;background:transparent;color:var(--warm);text-align:left;cursor:pointer}
.faq-index{color:var(--gold);font:600 1.05rem Sora}
.faq-title{font:600 1rem/1.45 Sora}
.faq-toggle{position:relative;display:grid;place-items:center;justify-self:end;width:34px;height:34px;border:1px solid var(--line);border-radius:50%}
.faq-toggle:before,.faq-toggle:after{content:"";position:absolute;width:12px;height:1px;background:var(--gold);transition:transform .25s ease}
.faq-toggle:after{transform:rotate(90deg)}
.faq-item.is-open .faq-toggle:after{transform:rotate(0)}
.faq-answer{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .38s ease,visibility 0s .38s}
.faq-answer>div{overflow:hidden}
.faq-answer p{margin:0;padding:0 24% 27px 22px;color:#a1a49f}
.faq-item.is-open .faq-answer{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .38s ease}

.light-list .faq-item{border-color:#d4d1c9;background:rgba(255,255,255,.55)}
.light-list .faq-item:hover,.light-list .faq-item.is-open{border-color:#b58b43;background:rgba(255,255,255,.76)}
.light-list .faq-question{color:var(--ink)}
.light-list .faq-toggle{border-color:#d1cec6}
.light-list .faq-answer p{color:#666a68}
.cost-section{background:radial-gradient(circle at 80% 58%,rgba(95,168,160,.07),transparent 32%),var(--dark)}
.practice-section{background:var(--warm)}

.page-nav-links a{position:relative;overflow:hidden}
.page-nav-links a:after{content:"";position:absolute;left:11px;right:11px;bottom:3px;height:2px;border-radius:2px;background:#a87b2e;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.page-nav-links a.is-current:after{transform:scaleX(1)}

@media(max-width:1050px){
  .faq-hero .hero-grid,.faq-layout{grid-template-columns:1fr}
  .answer-principle{max-width:780px;width:100%;margin:auto}
  .finder-bar{grid-template-columns:1fr}
  .finder-status{grid-template-columns:auto auto;gap:8px;min-height:55px}
  .faq-group-head{position:static}
}

@media(max-width:700px){
  .answer-principle{padding:27px}
  .answer-principle blockquote{margin:45px 0 35px}
  .finder-bar{padding:18px}
  .faq-question{grid-template-columns:minmax(0,1fr) 64px;gap:0;min-height:94px;padding:17px}
  .faq-answer p{padding:0 64px 24px 17px}
  .faq-title{font-size:.92rem}
}

@media(prefers-reduced-motion:reduce){
  .faq-answer,.faq-toggle:after,.filter-buttons button,.faq-item{transition:none}
}