/* [cc 20.10] resurse/intrebari — „Întrebări frecvente” pe structura paginii vechi (faq.php), cu culorile site-ului nou.
   Se încarcă DUPĂ final.css, final-hero.css, menu-*.css și site27.css: tokenii --bg --ink --mute --line --rule --card --edge --menu --ws --gut --ins-band vin de acolo.
   Materialul cutiilor = cel al scurtăturilor din Ghidul de utilizare (ghid.css): pe închis sticlă de 4 % alb, pe deschis hârtia --card cu aceeași umbră moale.
   Structura veche: citat + titlu centrate, casetă de căutare rotunjită, 6 cutii-acordeon una sub alta (lățime ~1000 px), întrebări numerotate în ele,
   apoi „Ghid detaliat de utilizare”. Spațiile din scara 8 / 13 / 21 / 34 / 55 / 89. Copia de dinainte: intrebari.before-2010b.css. */

.iq{--iq-card:var(--card);--iq-sh:0 1px 1px rgba(20,42,62,.05),0 14px 34px -18px rgba(20,42,62,.3);
  --iq-hov:color-mix(in srgb,var(--ink) 4.5%,transparent);--iq-pop:0 8px 16px -4px rgba(20,42,62,.14),0 2px 4px rgba(20,42,62,.08);--iq-px:clamp(16px,2.4vw,24px)}
:root:not([data-theme=light]) .iq{--iq-card:rgba(255,255,255,.04);--iq-sh:0 1px 1px rgba(0,0,0,.3),0 18px 44px -22px rgba(0,0,0,.85);
  --iq-pop:0 14px 34px -10px rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.4)}

/* ---------- comune ---------- */
.iq .vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.iq-w{width:min(1000px,calc(100% - 2*var(--gut)));margin-inline:auto}
.iq-lk{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-decoration-thickness:1px;text-underline-offset:4px;transition:text-decoration-color .2s}
.iq-lk:hover{text-decoration-color:currentColor}
.iq :where(main a):focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:6px}
.iq main summary{list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.iq main summary::-webkit-details-marker{display:none}
.iq main summary:focus-visible{outline:2px solid var(--ink);outline-offset:-2px;border-radius:12px}

/* ---------- 1. citatul, titlul, căutarea ---------- */
.iq-top{padding:clamp(34px,4.4vw,55px) 0 0;text-align:center}
.iq-quote{max-width:40em;margin-inline:auto;font:400 clamp(15px,1.3vw,17px)/1.5 var(--ws);color:var(--mute);text-wrap:balance}
.iq-h1{max-width:none;margin-top:21px;font:300 clamp(34px,4.1vw,56px)/1.08 var(--ws);letter-spacing:-.03em;color:var(--ink);text-wrap:balance}
.iq-h1 strong{font-weight:inherit}

/* caseta: rotunjită ca pe pagina veche, din același material ca cutiile. Fără JavaScript nu se arată (n-ar căuta nimic) */
.iq-find{display:none;position:relative;max-width:760px;margin:34px auto 0;text-align:left}
.iq-js .iq-find{display:block}
.iq-in{display:block;width:100%;height:52px;padding:0 24px;border:1px solid var(--line);border-radius:999px;background:var(--iq-card);
  font:400 16px/1 var(--ws);color:var(--ink);outline:none;-webkit-appearance:none;appearance:none;transition:border-color .2s,box-shadow .2s}
.iq-in::placeholder{color:var(--mute);opacity:1}
.iq-in:hover{border-color:var(--edge)}
.iq-in:focus,.iq-in:focus-visible{border-color:var(--edge);box-shadow:0 0 0 4px color-mix(in srgb,var(--ink) 8%,transparent);outline:none}
.iq-in::-webkit-search-cancel-button,.iq-in::-webkit-search-decoration{-webkit-appearance:none;appearance:none}

/* rezultatele: o listă sub casetă (titlul întrebării + bucata din răspuns; cuvintele găsite îngroșate) */
.iq-r{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;max-height:320px;overflow-y:auto;overscroll-behavior:contain;margin:0;padding:6px 0;list-style:none;
  background:var(--menu);border:1px solid var(--line);border-radius:14px;box-shadow:var(--iq-pop)}
.iq-r[hidden]{display:none}
.iq-r a{display:block;padding:10px 20px;font:500 15px/22px var(--ws);color:var(--ink);text-decoration:none;transition:background-color .15s}
.iq-r a:hover{background:var(--iq-hov)}
.iq-r a:focus-visible{background:var(--iq-hov);outline:2px solid var(--ink);outline-offset:-2px;border-radius:8px}
.iq-r mark{background:none;color:var(--ink);font-weight:600}
.iq-sn{display:block;margin-top:3px;font:400 13.5px/20px var(--ws);color:var(--mute)}
.iq-none{padding:12px 20px;font:400 14.5px/22px var(--ws);color:var(--mute)}

/* ---------- 2. cutiile (una deschisă o dată) ---------- */
.iq-acc{padding-top:clamp(55px,5vw,72px)}
.iq-list{display:flex;flex-direction:column;gap:13px}
.iq-sec{border:1px solid var(--line);border-radius:14px;background:var(--iq-card);box-shadow:var(--iq-sh);overflow:hidden;
  transition:border-color .2s;scroll-margin-top:calc(var(--ins-band,64px) + 21px)}
.iq-sec[open]{border-color:var(--edge)}
.iq-sec>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:clamp(16px,2vw,21px) var(--iq-px);border-radius:13px}
.iq-st{font:400 clamp(19px,1.7vw,22px)/1.3 var(--ws);letter-spacing:-.015em;color:var(--ink)}

/* semnul +: un cerc; deschis, se rotește în × (ca pe pagina veche) */
.iq-ic{position:relative;flex:none;width:28px;height:28px;border:1px solid var(--line);border-radius:50%;transition:transform .25s ease,border-color .2s,background-color .2s}
.iq-ic::before,.iq-ic::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1.5px;margin:-.75px 0 0 -5px;border-radius:1px;background:var(--ink)}
.iq-ic::after{transform:rotate(90deg)}
.iq-sec>summary:hover>.iq-ic{border-color:var(--edge)}
.iq-sec[open]>summary>.iq-ic{transform:rotate(45deg);border-color:var(--edge);background:var(--iq-hov)}

.iq-sb{padding:8px 0 13px;border-top:1px solid var(--rule)}
.iq-sec[open]>.iq-sb{animation:iq-in .22s ease}
@keyframes iq-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* întrebările din cutie (una deschisă o dată) */
.iq-qa{border-bottom:1px solid var(--rule);scroll-margin-top:calc(var(--ins-band,64px) + 21px)}
.iq-qa:last-child{border-bottom:0}
.iq-qa>summary{display:flex;align-items:flex-start;justify-content:space-between;gap:13px;padding:13px var(--iq-px);border-radius:0;transition:background-color .15s}
.iq-qa>summary:hover{background:var(--iq-hov)}
.iq-qt{font:500 16px/24px var(--ws);color:var(--ink);overflow-wrap:break-word;min-width:0}
.iq-nr{margin-right:2px;color:var(--mute);font-variant-numeric:tabular-nums}
.iq-qa .iq-ic{width:22px;height:22px;margin-top:1px}
.iq-qa .iq-ic::before,.iq-qa .iq-ic::after{width:8px;margin-left:-4px;background:var(--mute);transition:background-color .2s}
.iq-qa>summary:hover>.iq-ic{border-color:var(--edge)}
.iq-qa>summary:hover>.iq-ic::before,.iq-qa>summary:hover>.iq-ic::after,.iq-qa[open]>summary>.iq-ic::before,.iq-qa[open]>summary>.iq-ic::after{background:var(--ink)}
.iq-qa[open]>summary>.iq-ic{transform:rotate(45deg);border-color:var(--edge)}
.iq-a{padding:0 var(--iq-px) 16px;font:400 16px/26px var(--ws);color:var(--mute)}
.iq-a p{max-width:72ch}
.iq-a p+p{margin-top:13px}
.iq-a .iq-lk{color:var(--ink)}
.iq-a .iq-to{margin-top:8px}
.iq-a .iq-to+.iq-to{margin-top:2px}
.iq-more{display:inline;font:500 15px/24px var(--ws);color:var(--ink);text-decoration:none}
.iq-more:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.iq-ar{display:inline-block;margin-left:6px;vertical-align:0;transition:transform .2s ease}
.iq-more:hover .iq-ar,.iq-go:hover .iq-ar{transform:translateX(2px)}
.iq-nw{white-space:nowrap}

/* ---------- 3. Ghid detaliat de utilizare ---------- */
.iq-div{padding:clamp(55px,7vw,89px) 0;text-align:center}
.iq-div-t{font:300 clamp(28px,3.4vw,44px)/1.12 var(--ws);letter-spacing:-.025em;color:var(--ink);text-wrap:balance}
.iq-div-t strong{font-weight:inherit}
.iq-div-s{margin-top:13px;font:400 16px/26px var(--ws);color:var(--mute);text-wrap:balance}
.iq-div-a{margin-top:21px}
.iq-go{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border:1px solid var(--edge);border-radius:999px;
  font:500 15px/1.2 var(--ws);color:var(--ink);text-decoration:none;transition:border-color .2s,background-color .2s}
.iq-go:hover{border-color:var(--ink);background:var(--iq-hov)}

/* ---------- bara de căutare lipită sub antet (apare când caseta de sus iese din ecran) ---------- */
.iq-stk{position:fixed;left:0;right:0;top:calc(var(--ins-band,64px) + 8px);z-index:29;padding:0 var(--gut);pointer-events:none}
.iq-stk[hidden]{display:none}
.iq-stk-w{max-width:700px;margin:0 auto;pointer-events:auto}
.iq-stk .iq-find{max-width:none;margin:0}
.iq-stk .iq-in{height:44px;background:var(--menu);box-shadow:var(--iq-pop)}

/* ---------- telefon ---------- */
@media (max-width:760px){
  .iq-top{padding-top:28px}
  .iq-h1{margin-top:13px}
  .iq-find{margin-top:28px}
  .iq-acc{padding-top:34px}
  .iq-list{gap:8px}
  .iq-st{font-size:18px}
  .iq-sec>summary{gap:13px}
  .iq-qa>summary{padding-block:12px}
  .iq-more{font-size:16px}
  .iq :where(h1,h2,summary){overflow-wrap:break-word}
}

@media (prefers-reduced-motion:reduce){
  .iq *,.iq *::before,.iq *::after{transition:none!important;animation:none!important}
}