/* SGM24 — paginastijlen voor de homepage en de SCEWC-pagina (alle talen).
   Stond eerder inline in index.html; nu gedeeld door alle HTML-ingangen.
   Zie openspec/changes/homepage-meertalig-en-expo/. */
html, body { margin: 0; }
body { background: #fff; font-family: 'Hanken Grotesk', sans-serif; }
.input input { border: 0; outline: 0; font-family: var(--font-body); font-size: 16px; color: var(--ink); width: 100%; background: transparent; }
.input input::placeholder { color: var(--ink-3); }
.input:focus-within { border-color: var(--azure); box-shadow: 0 0 0 3px rgba(46,179,245,0.18); }
button.btn { border: none; cursor: pointer; font-family: var(--font-body); }
/* Video responsive wrapper */
.video-wrap { position: relative; width: 100%; padding-top: 56.25%; border-radius: 16px; overflow: hidden; background: var(--navy); }
.video-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
/* FAQ accordion */
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-btn { width: 100%; background: none; border: none; padding: 20px 0; display: flex; align-items: center; justify-content: space-between; cursor: pointer; text-align: left; font-family: var(--font-body); font-size: 16px; font-weight: 600; color: var(--navy); gap: 16px; }
.faq-btn:hover { color: var(--azure); }
.faq-answer { font-size: 15px; line-height: 1.65; color: var(--ink-2); padding-bottom: 20px; display: none; }
.faq-item.open .faq-answer { display: block; }
.faq-chevron { flex: 0 0 auto; width: 20px; height: 20px; transition: transform .2s; }
.faq-item.open .faq-chevron { transform: rotate(180deg); }
/* Rekentool */
.rekentool-range { width: 100%; accent-color: var(--azure); height: 4px; cursor: pointer; }
.rekentool-result { background: var(--navy); border-radius: 16px; padding: 28px 32px; color: #fff; }
/* Quote cards */
/* Taalwisselaar in de hero-nav */
.lang-select {
  appearance: none; -webkit-appearance: none;
  background: rgba(255,255,255,0.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='white' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right 10px center;
  color: #fff; border: 1px solid rgba(255,255,255,0.35); border-radius: 999px;
  padding: 8px 28px 8px 13px; font: 600 13px var(--font-body); letter-spacing: 0.04em; cursor: pointer;
}
.lang-select:focus-visible { outline: 2px solid var(--azure-bright); outline-offset: 2px; }
.lang-select option { color: var(--navy); }
/* Leadformulier: naam + locatie naast elkaar, onder elkaar op een telefoon */
.form-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* Gasverbruik per kerk (publiek: alleen maandtotalen) */
.gas-figures { margin: 0 22px 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.gas-live { display: flex; align-items: center; gap: 7px; color: var(--ink-3); margin-bottom: 10px; }
.gas-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--good); box-shadow: 0 0 0 3px var(--good-tint); flex: 0 0 auto; }
.gas-row { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.live-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 20px; }
/* SCEWC-pagina */
.expo-event { display: inline-block; padding: 7px 14px; border-radius: 999px; background: rgba(46,179,245,0.22); border: 1px solid rgba(46,179,245,0.5); color: #fff; font: 600 13px var(--font-body); letter-spacing: 0.02em; }
@media (max-width: 520px) {
  .hero-nav-phone { display: none !important; }
  .form-2col { grid-template-columns: 1fr; }
}
/* Telefoon: geen horizontaal scrollen. Bestond al vóór de meertalige
   versie (236px op 360px breed), maar expo-bezoekers komen mobiel binnen. */
.r-2col > *, .r-3col > *, .r-gallery > * { min-width: 0; }
.pricing-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 22px; align-items: stretch; }
@media (max-width: 768px) { .pricing-grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .r-gallery { grid-template-columns: 1fr; } }