/* Sorocaba Web — marca oficial (opção 3). Desenho em marca.js. */
.swl { --swl-tinta: #171D2B; --swl-web: #1747DB; display: inline-flex; align-items: baseline; font-family: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif; font-weight: 800; letter-spacing: -.025em; line-height: 1; white-space: nowrap; color: var(--swl-tinta); vertical-align: middle; }
.swl-txt { display: inline-flex; align-items: baseline; }
.swl-s { color: var(--swl-tinta); }
.swl-w { color: var(--swl-web); margin-left: .13em; }
/* símbolo: 1,3× a fonte, sobe acima das letras e desce um pouco abaixo da linha de base, quase encostado no "b" */
.swl-sim { height: 1.3em; width: auto; flex: none; margin-left: .05em; transform: translateY(.14em); overflow: visible; }
.swl-small { font-size: 23px; }   /* cabeçalhos: ~33 px de altura com o símbolo */
.swl-medium { font-size: 34px; }
.swl-large { font-size: clamp(34px, 11.5vw, 84px); }   /* a marca inteira tem ~7,5× a fonte de largura: cabe em 320 px */
/* fundo escuro: "Sorocaba" em branco, "Web" e símbolo continuam azuis */
.swl-dark { --swl-tinta: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .swl-auto { --swl-tinta: #fff; } }
:root[data-theme="dark"] .swl-auto { --swl-tinta: #fff; }
/* só o símbolo */
.swl-icon, .swl-icon-white, .swl-icon-dark { display: inline-block; line-height: 0; }
.swl-icon .swl-sim, .swl-icon-white .swl-sim, .swl-icon-dark .swl-sim { height: 1em; margin: 0; transform: none; }
@media (max-width: 400px) { .swl-small { font-size: 21px; } }