/* Seção: Localização + FAQ */
.local { background: var(--fundo, var(--petroleo)); color: #fff; padding: 130px 0 120px }
.local h2 { color: #fff }
.local.fundo-claro, .local.fundo-claro h2 { color: var(--petroleo) }
.local-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px }
.about { margin-top: 20px; font-size: 16.5px; opacity: .88; max-width: 520px }
.map { margin-top: 30px; border-radius: 32px 32px 32px 90px; background: #2E5361; height: 280px; position: relative; overflow: hidden }
.map svg { position: absolute; inset: 0; width: 100%; height: 100% }
.js .route { animation: flow 1.2s linear infinite }
.js .pulse { animation: pulso-mapa 2.2s ease-out infinite; transform-origin: 470px 134px }
@keyframes pulso-mapa { from { transform: scale(1); opacity: .6 } to { transform: scale(2.6); opacity: 0 } }
.local address { font-style: normal; margin-top: 26px; display: grid; gap: 12px; font-size: 16.5px }
.local address div { display: flex; gap: 14px; align-items: flex-start }
.local address .ico { color: var(--sol); margin-top: 3px; flex: none }
.local address a:hover { text-decoration: underline }
.local .btn-primary { margin-top: 26px }
.faq { display: grid; gap: 12px; margin-top: 30px }
.faq details { background: rgba(255, 255, 255, .07); border-radius: 22px; padding: 0 24px; transition: background .3s }
.faq details[open] { background: rgba(255, 255, 255, .12) }
.local.fundo-claro .faq details { background: rgba(38, 70, 81, .06) }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; font-family: var(--display); font-weight: 500; font-size: 18px; padding: 20px 0 }
.faq summary::-webkit-details-marker { display: none }
.faq summary svg { width: 22px; height: 22px; flex: none; color: var(--sol); transition: transform .4s var(--ease) }
.faq details[open] summary svg { transform: rotate(45deg) }
.faq details p { padding: 0 0 20px; font-size: 16px; opacity: .88; line-height: 1.6 }

/* Mobile */
@container page (max-width: 760px) {
  .local { padding: 80px 0 64px }
  .local-grid { grid-template-columns: 1fr; gap: 56px }
  .map { height: auto; aspect-ratio: 600 / 280 }
}
