/* Συχνές Ερωτήσεις */
.faq{margin:clamp(10px, 2vh, 24px) 0 clamp(40px, 6vh, 80px);}
.faq [hidden]{display:none !important;}

.faq-tools{display:none; margin:0 0 26px;}
.faq.is-js .faq-tools{display:block;}
.faq-search{position:relative; display:block; max-width:520px;}
.faq-search svg{
  position:absolute; left:18px; top:50%; width:18px; height:18px; transform:translateY(-50%);
  fill:none; stroke:var(--accent); stroke-width:2.2; stroke-linecap:round; pointer-events:none;
}
.faq-search input{
  width:100%; padding:15px 18px 15px 50px;
  border:1px solid rgba(124,230,219,.32); border-radius:999px;
  background:rgba(10,16,19,.5); color:#fff;
  font-family:var(--font-body); font-size:15px; font-weight:500;
  outline:none; transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.faq-search input::placeholder{color:#8fa5ab;}
.faq-search input:focus{border-color:var(--cyan); box-shadow:0 0 0 4px rgba(95,208,198,.14);}

.faq-grid{display:grid; grid-template-columns:230px minmax(0,1fr); gap:clamp(24px, 4vw, 56px); align-items:start;}
.faq-body{min-width:0;}

.faq-nav{position:sticky; top:32px; display:flex; flex-direction:column; gap:2px; border-left:1px solid rgba(140,190,190,.22);}
.faq-cat{
  position:relative; display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 12px 10px 18px; color:var(--muted);
  font-family:var(--font-display); font-size:14.5px; font-weight:600; line-height:1.3;
  transition:color .25s var(--ease);
}
.faq-cat::before{
  content:''; position:absolute; left:-4px; top:50%; width:7px; height:7px; margin-top:-3.5px;
  border-radius:50%; background:var(--line);
  transition:background .25s var(--ease), box-shadow .25s var(--ease);
}
.faq-cat:hover{color:#fff;}
.faq-cat[aria-current="true"]{color:var(--cyan);}
.faq-cat[aria-current="true"]::before{background:var(--cyan); box-shadow:0 0 9px var(--cyan);}
.faq-cat .n{font-size:12px; color:#8fa5ab; font-variant-numeric:tabular-nums;}
.faq-cat:focus-visible, .qa-q:focus-visible, .qa-link:focus-visible{outline:2px solid var(--cyan); outline-offset:2px;}

.faq-group{padding:0; scroll-margin-top:110px;}
.faq-group + .faq-group{margin-top:34px;}
.faq-group h2{margin:0 0 12px; font-size:13px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent);}
.qa-list{display:flex; flex-direction:column; gap:10px;}

.qa{
  scroll-margin-top:110px; border:1px solid rgba(95,208,198,.22); border-radius:12px;
  background:linear-gradient(180deg, rgba(24,66,82,.55), rgba(14,44,58,.55));
  transition:border-color .3s var(--ease);
}
.qa:hover, .qa.is-open{border-color:rgba(124,230,219,.62);}
.qa-h{margin:0; font-size:inherit; letter-spacing:0;}
.qa-q{
  display:flex; align-items:center; gap:14px; width:100%; margin:0; padding:17px 18px;
  background:none; border:0; border-radius:12px; text-align:left; cursor:pointer;
  color:#fff; font-family:var(--font-display); font-size:16.5px; font-weight:700; line-height:1.35;
}
.qa-via{
  flex:none; width:11px; height:11px; border:2px solid var(--line); border-radius:50%;
  transition:background .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.qa.is-open .qa-via{border-color:var(--cyan); background:var(--cyan); box-shadow:0 0 12px var(--cyan);}
.qa-txt{flex:1 1 auto; min-width:0;}
.qa-pm{position:relative; flex:none; width:16px; height:16px;}
.qa-pm::before, .qa-pm::after{
  content:''; position:absolute; left:0; top:7px; width:16px; height:2px; border-radius:2px;
  background:var(--accent); transition:transform .35s var(--ease);
}
.qa-pm::after{transform:rotate(90deg);}
.qa.is-open .qa-pm::after, .faq:not(.is-js) .qa-pm::after{transform:rotate(0);}

/* Χωρίς JavaScript οι απαντήσεις μένουν ανοιχτές. */
.qa-a{display:grid; grid-template-rows:1fr;}
.faq.is-js .qa-a{grid-template-rows:0fr; transition:grid-template-rows .42s var(--ease);}
.faq.is-js .qa.is-open .qa-a{grid-template-rows:1fr;}
.qa-clip{overflow:hidden; min-height:0;}
.qa-in{padding:0 20px 18px 43px;}
.qa-in p{margin:0 0 10px; max-width:70ch; font-size:15.5px; line-height:1.75; color:var(--muted);}
.qa-link{
  display:inline-flex; align-items:center; gap:8px; margin-top:4px;
  font-family:var(--font-display); font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--accent); transition:color .25s var(--ease);
}
.qa-link span{transition:transform .3s var(--ease);}
.qa-link:hover{color:var(--cyan);}
.qa-link:hover span{transform:translateX(4px);}

.faq-empty{padding:26px; border:1px dashed rgba(140,190,190,.35); border-radius:14px;}
.faq-empty p{margin:0 0 16px; color:var(--muted);}

@media (max-width:880px), (max-height:520px){
  .faq-grid{grid-template-columns:minmax(0,1fr); gap:18px;}
  .faq-nav{
    position:static; flex-direction:row; gap:8px; overflow-x:auto; padding-bottom:6px;
    border-left:0; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity;
  }
  .faq-nav::-webkit-scrollbar{display:none;}
  .faq-cat{
    flex:none; padding:9px 14px; white-space:nowrap; scroll-snap-align:start;
    border:1px solid rgba(124,230,219,.26); border-radius:999px; background:rgba(150,235,226,.07);
  }
  .faq-cat::before{display:none;}
  .faq-cat[aria-current="true"]{background:var(--accent); border-color:var(--accent); color:#08191e;}
  .faq-cat[aria-current="true"] .n{color:#08191e;}
  .faq-search{max-width:none;}
  .qa-q{gap:12px; padding:15px 14px; font-size:15.5px;}
  .qa-in{padding:0 16px 16px 37px;}
  .faq-group, .qa{scroll-margin-top:120px;}
}
@media (max-height:520px){
  .faq-tools{margin-bottom:16px;}
  .faq-search input{padding-top:11px; padding-bottom:11px;}
  .qa-q{padding-top:12px; padding-bottom:12px; font-size:15px;}
  .faq-group + .faq-group{margin-top:22px;}
}
@media (prefers-reduced-motion: reduce){
  .faq.is-js .qa-a, .qa, .qa-via, .qa-pm::before, .qa-pm::after,
  .faq-cat, .faq-cat::before, .qa-link, .qa-link span, .faq-search input{transition:none;}
  .qa-link:hover span{transform:none;}
}
