/* ro- · rodapé: a sala à noite, a cidade acesa na linha do chão */
.ro { padding-top: clamp(3.5rem, 3rem + 3vw, 5.5rem); padding-bottom: 0; overflow: hidden; }
.ro-miolo { position: relative; z-index: 1; }
.ro-marca { display: flex; align-items: center; gap: .8rem; margin-bottom: clamp(2rem, 1.5rem + 2vw, 3rem); flex-wrap: wrap; }
.ro-marca__fecho { margin-left: auto; font-family: var(--fonte-titulo); font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); color: var(--tinta-clara-suave); }
.ro-marca__fecho em { color: var(--tinta); }
.ro-marca__espiral { width: 2.6rem; height: 2.6rem; }
.ro-marca__texto { font-family: var(--fonte-titulo); font-weight: 500; font-size: 1.45rem; line-height: 1; display: flex; flex-direction: column; }
.ro-marca__texto small { font-family: var(--fonte-texto); font-weight: 600; font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; opacity: .82; margin-bottom: .22rem; }
.ro-grade { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem 2.5rem; padding-bottom: clamp(2.5rem, 2rem + 2vw, 4rem); border-bottom: 1px solid color-mix(in oklab, var(--caramelo) 32%, transparent); }
.ro-bloco { display: grid; gap: .45rem; align-content: start; font-size: .92rem; line-height: 1.5; }
.ro-nome { font-family: var(--fonte-titulo); font-size: 1.45rem; font-weight: 500; line-height: 1.15; }
.ro-registro { font-size: .8rem; letter-spacing: .04em; opacity: .8; }
.ro-linha { color: var(--tinta-clara-suave); }
.ro-rotulo { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; opacity: .72; font-weight: 600; margin-bottom: .2rem; }
.ro-lista { display: grid; gap: .45rem; }
.ro-lista a { color: var(--tinta); }
.ro-pe { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem 2.5rem; align-items: center; padding: 1.6rem 0 clamp(3.5rem, 3rem + 3vw, 6rem); font-size: .8rem; }
.ro-relogio { display: inline-flex; align-items: center; gap: .5rem; letter-spacing: .06em; text-transform: uppercase; font-size: .7rem; opacity: .7; white-space: nowrap; }
.ro-relogio b { font-weight: 600; }
.ro-aviso { color: var(--tinta-clara-suave); max-width: 60ch; }
.ro-selo { white-space: nowrap; opacity: .85; }
.ro-selo a { color: var(--tinta); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; text-decoration-color: color-mix(in oklab, var(--ambar) 70%, transparent); }
.ro-selo a:hover { text-decoration-color: var(--ambar); }
/* a cidade na linha do chão: acesa à noite, apagada de dia */
.ro-cidade { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: clamp(3.5rem, 2rem + 5vw, 7rem); z-index: 0; opacity: .7; }
.ro-cidade rect { fill: #1a1310; }
.ro-cidade circle { fill: #ffe9c9; opacity: .1; transition: opacity 2.4s linear; }
html[data-luz="noite"] .ro-cidade circle { opacity: .9; animation: ro-pisca var(--d, 9s) ease-in-out var(--a, 0s) infinite alternate; }
html[data-luz="tarde"] .ro-cidade circle { opacity: .3; }
@keyframes ro-pisca { from { opacity: .35; } to { opacity: 1; } }
@media (max-width: 900px) { .ro-grade { grid-template-columns: 1fr 1fr; } .ro-pe { grid-template-columns: 1fr; gap: .8rem; } .ro-marca__fecho { margin-left: 0; width: 100%; } }
@media (max-width: 860px) { .ro-pe { padding-bottom: calc(clamp(3.5rem, 3rem + 3vw, 6rem) + 3.5rem); } }
@media (max-width: 520px) { .ro-grade { grid-template-columns: 1fr; gap: 1.6rem; } }