/*
 * Rodapé institucional e páginas institucionais (Sobre, Contato, Privacidade...).
 * Só seletores .site-foot e .inst; cores vêm dos tokens de app.css (claro e escuro).
 */

/* ---------- Rodapé ---------- */

.site-foot {
    margin-top: auto;
    border-top: 1px solid var(--line);
    background: var(--card);
    color: var(--muted);
    position: relative;
}

.site-foot__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: 40px;
    padding-top: 40px;
    padding-bottom: 32px;
}

.site-foot__logo {
    display: inline-flex; align-items: center; gap: 10px;
    font-size: 18px; font-weight: 750; letter-spacing: -.02em; color: var(--ink);
}
.site-foot__logo img { width: 36px; height: 36px; }
.site-foot__logo em { font-style: normal; color: var(--green-strong); }

.site-foot__about {
    margin-top: 14px; max-width: 42ch;
    font-size: 14px; line-height: 1.6;
}

.site-foot__title {
    margin-bottom: 14px;
    font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--ink);
}

.site-foot__links { display: grid; gap: 10px; }
.site-foot__links a,
.site-foot__mail {
    font-size: 14px; line-height: 1.4; color: var(--muted);
    transition: color .15s;
}
.site-foot__links a:hover,
.site-foot__links a[aria-current='page'],
.site-foot__mail:hover { color: var(--ink); }
.site-foot__links a[aria-current='page'] { font-weight: 650; }

.site-foot__mail { font-weight: 600; color: var(--ink-2); overflow-wrap: anywhere; }
.site-foot__note { margin-top: 10px; font-size: 13px; line-height: 1.55; max-width: 32ch; }

.site-foot__bar {
    display: flex; align-items: center; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap;
    padding-top: 18px; padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line-soft);
    font-size: 12.5px; line-height: 1.5; color: var(--faint);
}
.site-foot__tz { white-space: nowrap; }

@media (max-width: 1080px) {
    .site-foot__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
    .site-foot__brand { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    /* Mesmo padding lateral de .hero__inner.wrap no celular (24px; .wrap cai para 12px). */
    .site-foot__inner,
    .site-foot__bar {
        padding-left: 24px;
        padding-right: 24px;
    }
}

@media (max-width: 640px) {
    .site-foot__inner { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-top: 32px; padding-bottom: 24px; }
    .site-foot__bar { flex-direction: column; align-items: flex-start; padding-bottom: 28px; }
}

/* ---------- Páginas institucionais ---------- */

.inst {
    display: grid;
    grid-template-columns: minmax(0, 760px) 260px;
    justify-content: center;
    gap: 32px;
    align-items: start;
    padding-top: 28px;
    padding-bottom: 48px;
    position: relative;
}

.inst__article {
    min-width: 0;
    padding: 40px 48px 44px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: var(--shadow);
}

.inst__head { padding-bottom: 24px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.inst__eyebrow {
    margin-bottom: 10px;
    font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--green-strong);
}
.inst__title { font-size: 34px; font-weight: 800; letter-spacing: -.025em; line-height: 1.15; color: var(--ink); }
.inst__lead { margin-top: 12px; font-size: 18px; line-height: 1.5; color: var(--muted); max-width: 60ch; }

.inst__body { font-size: 16px; line-height: 1.75; color: var(--ink-2); max-width: 70ch; overflow-wrap: break-word; }
.inst__body > :first-child { margin-top: 0; }
.inst__body p { margin: 0 0 16px; }
.inst__body h2 {
    margin: 36px 0 12px;
    font-size: 21px; font-weight: 750; letter-spacing: -.015em; line-height: 1.3; color: var(--ink);
}
.inst__body h3 { margin: 28px 0 10px; font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--ink); }
.inst__body h4 { margin: 24px 0 8px; font-size: 15px; font-weight: 700; color: var(--ink); }
.inst__body ul, .inst__body ol { margin: 0 0 18px; padding-left: 22px; }
.inst__body ul { list-style: disc; }
.inst__body ol { list-style: decimal; }
.inst__body li { margin: 6px 0; padding-left: 4px; }
.inst__body li::marker { color: var(--green-strong); }
.inst__body strong { font-weight: 700; color: var(--ink); }
.inst__body a {
    color: var(--green-ink); font-weight: 600;
    text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.inst__body a:hover { text-decoration-thickness: 2px; }
.inst__body hr { margin: 32px 0; border: 0; border-top: 1px solid var(--line); }
.inst__body blockquote { margin: 0 0 18px; padding: 4px 0 4px 16px; border-left: 3px solid var(--green); color: var(--muted); }
.inst__body code { font-size: .92em; padding: 1px 5px; border-radius: var(--radius-xs); background: var(--line-soft); }

.inst__nav {
    position: sticky; top: 88px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--card);
}
.inst__nav-title {
    margin-bottom: 10px;
    font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
.inst__nav ul { display: grid; gap: 2px; }
.inst__nav li a {
    display: block; padding: 8px 10px; border-radius: var(--radius-sm);
    font-size: 14px; font-weight: 550; color: var(--ink-2);
    transition: background .15s, color .15s;
}
.inst__nav li a:hover { background: var(--hover); color: var(--ink); }
.inst__nav li a[aria-current='page'] { background: var(--green-soft); color: var(--green-ink); font-weight: 650; }

@media (max-width: 1080px) {
    .inst { grid-template-columns: minmax(0, 1fr); max-width: 860px; }
    .inst__nav { position: static; }
}

@media (max-width: 640px) {
    .inst { padding-top: 16px; padding-bottom: 32px; gap: 20px; }
    .inst__article { padding: 24px 20px 28px; }
    .inst__head { padding-bottom: 18px; margin-bottom: 22px; }
    .inst__title { font-size: 27px; }
    .inst__lead { font-size: 16px; }
    .inst__body { font-size: 15.5px; line-height: 1.7; }
    .inst__body h2 { margin-top: 30px; font-size: 19px; }
    .contato h2 { font-size: 20px; }
    .contato__submit { width: 100%; }
}

.contato { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--line); max-width: 40rem; }
.contato h2 { margin: 0 0 8px; font-size: 22px; line-height: 1.25; color: var(--ink); }
.contato__lead { margin: 0 0 18px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.contato__ok { margin: 0 0 16px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--green-soft); color: var(--green-ink); }
.contato__form { display: grid; gap: 14px; }
.contato__field { display: grid; gap: 6px; }
.contato__field label { font-size: 14px; font-weight: 650; color: var(--ink); }
.contato__field input, .contato__field textarea {
    width: 100%; box-sizing: border-box; padding: 12px 14px;
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--card); color: var(--ink); font: inherit; font-size: 16px;
}
.contato__field textarea { min-height: 160px; resize: vertical; }
.contato__field input:focus, .contato__field textarea:focus { outline: 2px solid var(--green-strong); outline-offset: 1px; }
.contato__check { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; line-height: 1.45; }
.contato__check input { margin-top: 3px; width: 18px; height: 18px; flex: none; }
.contato__erro { margin: 0; color: #b42318; font-size: 13px; }
.contato__submit {
    justify-self: start; min-height: 44px; padding: 0 18px; border: 0; border-radius: var(--radius-sm);
    background: var(--green-strong); color: #06210a; font: inherit; font-weight: 700; cursor: pointer;
}
.contato-hp {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
