/* Stiler for maler/faq.html. Flyttet ut av <style> i siden (fase 1c, nov. 2026). Lastes på samme sted
   som før: etter tokens.css (og sider.css), før layout.css. */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--et-font-body); background: #fff; color: var(--et-text); }

.et-page-hero { margin-bottom: 32px; }
.et-page-hero h1 {
  font-family: var(--et-font-title); font-weight: 800;
  font-size: 48px; line-height: 56px; letter-spacing: -.96px; margin: 0 0 12px;
  color: var(--et-heading);
}
.et-page-hero p { font-size: 20px; line-height: 30px; color: var(--et-text); }

.faq-gruppe { margin-bottom: 40px; }
.faq-gruppe h2 {
  font-family: var(--et-font-title); font-weight: 800; font-size: 24px; line-height: 30px;
  color: var(--et-heading); margin-bottom: 12px;
}
.faq-punkt {
  border: 1px solid var(--et-border-light); border-radius: var(--et-radius-lg);
  background: #fff; margin-bottom: 10px; overflow: hidden;
}
.faq-punkt summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px;
  padding: 16px 20px; min-height: var(--et-touch);
  font-family: var(--et-font-title); font-weight: 700; font-size: 17px; line-height: 24px;
  color: var(--et-heading);
}
.faq-punkt summary::-webkit-details-marker { display: none; }
/* Chevron som snus når punktet er åpent */
.faq-punkt summary::after {
  content: ''; margin-left: auto; flex: 0 0 auto;
  width: 10px; height: 10px; border-right: 2px solid var(--et-text-muted);
  border-bottom: 2px solid var(--et-text-muted); transform: rotate(45deg);
  transition: transform .2s;
}
.faq-punkt[open] summary::after { transform: rotate(-135deg); }
.faq-punkt summary:hover { background: var(--et-lys-stein); }
.faq-punkt summary:focus-visible { outline: 3px solid var(--et-fjellbla); outline-offset: -3px; }
.faq-svar {
  padding: 0 20px 18px; font-size: 16px; line-height: 26px; color: var(--et-text);
}
.faq-svar a { color: var(--et-link); }

@media (max-width: 780px) {
  .et-page-hero h1 { font-size: 32px; line-height: 40px; }
  .et-page-hero p { font-size: 17px; line-height: 26px; }
}