:root {
    --fonte: 'Google Sans Flex', system-ui, sans-serif;

    --primary-50: #FEF5EC;
    --primary-100: #FBD7B2;
    --primary-500: #F37D07;
    --primary-600: #DD7206;
    --primary-700: #AD5905;

    --secondary-50: #EAF2F8;
    --secondary-500: #2879BD;
    --secondary-800: #164368;

    --success-50: #E9F4F2;
    --success-500: #249478;

    --danger-50: #FEF3F2;
    --danger-100: #FECDCA;
    --danger-500: #D92D20;
    --danger-700: #B42318;

    --neutral-00: #FFFFFF;
    --neutral-50: #F7F7F7;
    --neutral-100: #F0F0F0;
    --neutral-200: #E4E3E2;
    --neutral-700: #6E6B68;
    --neutral-800: #504D49;
    --neutral-900: #353331;
    --neutral-1000: #1B1A18;

    --raio-md: 8px;
    --raio-lg: 12px;
    --raio-xl: 16px;
    --raio-full: 9999px;

    --sombra: 0 12px 32px rgba(27, 26, 24, 0.08);
    --header-altura: 72px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-altura);
}

body {
    margin: 0;
    font-family: var(--fonte);
    font-size: 16px;
    line-height: 1.6;
    color: var(--neutral-1000);
    background: var(--neutral-00);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
    margin: 0;
    line-height: 1.2;
    font-weight: 700;
}

p {
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
}

.site-container {
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 24px;
}

.site-container--estreito {
    max-width: 820px;
}

.site-destaque {
    color: var(--primary-500);
}

/* Botões */

.site-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 18px;
    border: 1px solid transparent;
    border-radius: var(--raio-md);
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s, border-color .2s, color .2s;
}

.site-btn i {
    font-size: 18px;
}

.site-btn--grande {
    height: 48px;
    padding: 0 24px;
    font-size: 16px;
}

.site-btn--primario {
    background: var(--primary-500);
    color: var(--neutral-00);
}

.site-btn--primario:hover {
    background: var(--primary-600);
}

.site-btn--contorno {
    background: transparent;
    border-color: var(--neutral-200);
    color: var(--neutral-1000);
}

.site-btn--contorno:hover {
    border-color: var(--primary-500);
    color: var(--primary-600);
}

.site-btn--claro {
    background: var(--neutral-00);
    color: var(--primary-700);
}

.site-btn--claro:hover {
    background: var(--primary-50);
}

/* Header */

.site-header {
    position: sticky;
    top: 0;
    z-index: 10;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--neutral-100);
}

.site-header__conteudo {
    display: flex;
    align-items: center;
    gap: 32px;
    height: var(--header-altura);
}

.site-header__logo {
    height: 24px;
    width: auto;
}

.site-header__nav {
    display: flex;
    gap: 28px;
    margin-left: auto;
    font-size: 15px;
    font-weight: 500;
    color: var(--neutral-800);
}

.site-header__nav a:hover {
    color: var(--primary-600);
}

/* Hero */

.site-hero {
    padding: 88px 0 96px;
    background:
        radial-gradient(circle at 85% 20%, var(--primary-50) 0, transparent 45%),
        radial-gradient(circle at 10% 90%, var(--secondary-50) 0, transparent 40%);
}

.site-hero__conteudo {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    align-items: center;
    gap: 64px;
}

.site-selo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    margin-bottom: 20px;
    border-radius: var(--raio-full);
    background: var(--primary-50);
    color: var(--primary-700);
    font-size: 14px;
    font-weight: 600;
}

.site-hero h1 {
    font-size: 48px;
    letter-spacing: -0.02em;
}

.site-hero__texto > p {
    margin-top: 20px;
    max-width: 560px;
    font-size: 18px;
    color: var(--neutral-700);
}

.site-hero__acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.site-hero__cartao {
    padding: 28px;
    border: 1px solid var(--neutral-100);
    border-radius: var(--raio-xl);
    background: var(--neutral-00);
    box-shadow: var(--sombra);
}

.site-cartao-status {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--neutral-100);
}

.site-cartao-status__icone {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: var(--raio-lg);
    background: var(--success-50);
    color: var(--success-500);
    font-size: 28px;
}

.site-cartao-status strong {
    display: block;
    font-size: 17px;
}

.site-cartao-status span {
    font-size: 14px;
    color: var(--neutral-700);
}

.site-cartao-lista {
    display: grid;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 15px;
    color: var(--neutral-800);
}

.site-cartao-lista li {
    display: flex;
    align-items: center;
    gap: 10px;
}

.site-cartao-lista i {
    font-size: 20px;
    color: var(--primary-500);
}

/* Seções */

.site-secao {
    padding: 96px 0;
}

.site-secao--suave {
    background: var(--neutral-50);
}

.site-secao__cabecalho {
    max-width: 640px;
    margin: 0 auto 48px;
    text-align: center;
}

.site-secao__cabecalho h2 {
    font-size: 34px;
    letter-spacing: -0.01em;
}

.site-secao__cabecalho p {
    margin-top: 12px;
    font-size: 17px;
    color: var(--neutral-700);
}

.site-grade {
    display: grid;
    gap: 24px;
}

.site-grade--3 {
    grid-template-columns: repeat(3, 1fr);
}

.site-card {
    padding: 32px;
    border: 1px solid var(--neutral-100);
    border-radius: var(--raio-xl);
    background: var(--neutral-00);
    transition: box-shadow .2s, transform .2s;
}

.site-card:hover {
    box-shadow: var(--sombra);
    transform: translateY(-2px);
}

.site-card__icone {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin-bottom: 20px;
    border-radius: var(--raio-lg);
    font-size: 28px;
}

.site-card__icone--primario {
    background: var(--primary-50);
    color: var(--primary-500);
}

.site-card__icone--secundario {
    background: var(--secondary-50);
    color: var(--secondary-500);
}

.site-card__icone--sucesso {
    background: var(--success-50);
    color: var(--success-500);
}

.site-card h3 {
    font-size: 21px;
}

.site-card p {
    margin-top: 10px;
    color: var(--neutral-700);
}

.site-recurso {
    display: flex;
    gap: 16px;
    padding: 24px;
    border-radius: var(--raio-lg);
    background: var(--neutral-00);
}

.site-recurso > i {
    flex-shrink: 0;
    font-size: 28px;
    color: var(--primary-500);
}

.site-recurso h3 {
    font-size: 17px;
}

.site-recurso p {
    margin-top: 6px;
    font-size: 15px;
    color: var(--neutral-700);
}

/* Faixa "Adeus, cartórios" */

.site-faixa {
    padding: 56px 0;
    background: linear-gradient(120deg, var(--primary-500), var(--primary-700));
    color: var(--neutral-00);
}

.site-faixa__conteudo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.site-faixa h2 {
    font-size: 32px;
}

.site-faixa p {
    margin-top: 8px;
    font-size: 17px;
    opacity: .92;
}

/* FAQ */

.site-faq {
    display: grid;
    gap: 12px;
}

.site-faq details {
    border: 1px solid var(--neutral-200);
    border-radius: var(--raio-lg);
    background: var(--neutral-00);
}

.site-faq details[open] {
    border-color: var(--primary-100);
}

.site-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    font-size: 17px;
    font-weight: 600;
    list-style: none;
    cursor: pointer;
}

.site-faq summary::-webkit-details-marker {
    display: none;
}

.site-faq summary::after {
    content: '+';
    flex-shrink: 0;
    font-size: 24px;
    font-weight: 400;
    line-height: 1;
    color: var(--primary-500);
    transition: transform .2s;
}

.site-faq details[open] summary::after {
    transform: rotate(45deg);
}

.site-faq details p {
    padding: 0 24px 20px;
    color: var(--neutral-700);
}

/* CTA final */

.site-cta {
    padding: 96px 0;
    background: var(--neutral-1000);
    color: var(--neutral-00);
    text-align: center;
}

.site-cta__conteudo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.site-cta h2 {
    max-width: 680px;
    font-size: 36px;
}

.site-cta p {
    margin-bottom: 16px;
    font-size: 17px;
    color: var(--neutral-200);
}

/* Rodapé */

.site-rodape {
    padding: 32px 0 28px;
    background: var(--neutral-1000);
    border-top: 1px solid var(--neutral-900);
    color: var(--neutral-200);
    font-size: 14px;
}

.site-rodape__conteudo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    column-gap: 24px;
    row-gap: 20px;
}

.site-rodape__conteudo > span {
    order: 2;
}

.site-rodape__logo {
    height: 20px;
    width: auto;
}

.site-rodape__links {
    order: 3;
    flex: 1 0 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 20px;
    margin-top: 4px;
    padding-top: 20px;
    border-top: 1px solid var(--neutral-900);
}

.site-rodape__links a,
.site-rodape__links button {
    padding: 0;
    border: none;
    background: none;
    color: var(--neutral-200);
    font: inherit;
    cursor: pointer;
}

.site-rodape__links a:hover,
.site-rodape__links button:hover {
    color: var(--neutral-00);
}

.site-rodape__separador {
    color: var(--neutral-700);
}

/* Modal (denúncia do rodapé) */

body.site-modal-aberto {
    overflow: hidden;
}

.site-modal {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.site-modal[hidden] {
    display: none;
}

.site-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(27, 26, 24, 0.4);
}

.site-modal__dialog {
    position: relative;
    width: 100%;
    max-width: 560px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 32px;
    border-radius: var(--raio-xl);
    background: var(--neutral-00);
    box-shadow: 0 16px 40px -12px rgba(27, 26, 24, 0.24);
}

.site-modal__cabecalho {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.site-modal__cabecalho h2 {
    font-size: 22px;
}

.site-modal__cabecalho p {
    margin-top: 4px;
    font-size: 14px;
    color: var(--neutral-700);
}

.site-modal__fechar {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    padding: 0;
    border: none;
    background: none;
    color: var(--neutral-700);
    font-size: 22px;
    cursor: pointer;
}

.site-campo {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 16px;
}

.site-campo label {
    font-size: 14px;
    font-weight: 500;
    color: var(--neutral-800);
}

.site-campo textarea {
    width: 100%;
    min-height: 160px;
    padding: 12px 16px;
    border: 1px solid var(--neutral-200);
    border-radius: var(--raio-md);
    font-family: inherit;
    font-size: 15px;
    color: var(--neutral-1000);
    resize: none;
    transition: border-color .15s, box-shadow .15s;
}

.site-campo textarea:focus {
    outline: none;
    border-color: var(--primary-100);
    box-shadow: 0 0 0 4px var(--primary-50);
}

.site-campo.is-erro textarea {
    border-color: var(--danger-500);
    box-shadow: 0 0 0 4px var(--danger-50);
}

.site-campo__erro {
    font-size: 13px;
    color: var(--danger-500);
}

.site-modal__recaptcha {
    margin-bottom: 16px;
}

.site-modal__alerta {
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid var(--danger-100);
    border-radius: var(--raio-md);
    background: var(--danger-50);
    color: var(--danger-700);
    font-size: 14px;
}

.site-modal__enviar {
    width: 100%;
}

.site-modal__enviar:disabled {
    opacity: .6;
    cursor: not-allowed;
}

.site-modal__sucesso {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    text-align: center;
}

.site-modal__sucesso[hidden],
.site-modal__formulario[hidden],
.site-modal__alerta[hidden],
.site-campo__erro[hidden] {
    display: none;
}

.site-modal__sucesso i {
    font-size: 48px;
    color: var(--success-500);
}

.site-modal__sucesso strong {
    font-size: 18px;
}

.site-modal__sucesso p {
    margin-bottom: 8px;
    color: var(--neutral-700);
}

/* Páginas legais (termos-de-uso, privacidade, codigo-de-etica, seguranca-da-informacao) */

.site-legal__topo {
    padding: 64px 0 48px;
    background:
        radial-gradient(circle at 85% 20%, var(--primary-50) 0, transparent 45%),
        radial-gradient(circle at 10% 90%, var(--secondary-50) 0, transparent 40%);
    border-bottom: 1px solid var(--neutral-100);
}

.site-legal__topo h1 {
    font-size: 40px;
    letter-spacing: -0.02em;
}

.site-legal__topo p {
    margin-top: 12px;
    font-size: 17px;
    color: var(--neutral-700);
}

.site-legal__atualizacao {
    display: inline-block;
    margin-top: 20px;
    font-size: 14px;
    color: var(--neutral-700);
}

.site-legal__corpo {
    padding: 56px 0 96px;
}

.site-legal__indice {
    padding: 24px 28px;
    margin-bottom: 48px;
    border: 1px solid var(--neutral-100);
    border-radius: var(--raio-lg);
    background: var(--neutral-50);
}

.site-legal__indice strong {
    display: block;
    margin-bottom: 8px;
    font-size: 15px;
}

.site-legal__indice ol {
    margin: 0;
    padding-left: 20px;
    columns: 2;
    column-gap: 32px;
    font-size: 15px;
    color: var(--neutral-800);
}

.site-legal__indice a:hover {
    color: var(--primary-600);
}

.site-legal__corpo section + section {
    margin-top: 40px;
}

.site-legal__corpo h2 {
    margin-bottom: 14px;
    font-size: 24px;
}

.site-legal__corpo h3 {
    margin: 20px 0 8px;
    font-size: 18px;
}

.site-legal__corpo p,
.site-legal__corpo li {
    color: var(--neutral-800);
}

.site-legal__corpo p + p,
.site-legal__corpo p + ul,
.site-legal__corpo ul + p {
    margin-top: 12px;
}

.site-legal__corpo ul {
    margin: 0;
    padding-left: 22px;
}

.site-legal__corpo li + li {
    margin-top: 6px;
}

.site-legal__corpo a {
    color: var(--secondary-500);
    text-decoration: underline;
}

.site-legal__destaque {
    margin-top: 16px;
    padding: 16px 20px;
    border-left: 4px solid var(--primary-500);
    border-radius: var(--raio-md);
    background: var(--primary-50);
    color: var(--neutral-900);
}

/* Responsivo */

@media (max-width: 960px) {
    .site-hero__conteudo {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .site-grade--3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 720px) {
    .site-header__nav {
        display: none;
    }

    .site-header__conteudo {
        justify-content: space-between;
    }

    .site-hero {
        padding: 56px 0 64px;
    }

    .site-hero h1 {
        font-size: 34px;
    }

    .site-hero__texto > p {
        font-size: 16px;
    }

    .site-secao,
    .site-cta {
        padding: 64px 0;
    }

    .site-secao__cabecalho h2,
    .site-cta h2 {
        font-size: 28px;
    }

    .site-grade--3 {
        grid-template-columns: 1fr;
    }

    .site-faixa__conteudo,
    .site-rodape__conteudo {
        flex-direction: column;
        text-align: center;
    }

    .site-rodape__links {
        justify-content: center;
    }

    .site-legal__topo h1 {
        font-size: 30px;
    }

    .site-legal__indice ol {
        columns: 1;
    }
}