/* ==========================================================================
   A4 — tema único e responsivo
   Mobile first: estilos base = celular; @media (min-width: 768px) = tablet;
   @media (min-width: 1024px) = desktop (barra lateral).
   ========================================================================== */

:root {
    --roxo: #51286c;
    --roxo-menu: #5c236e;
    --roxo-escuro: #341243;
    --roxo-borda: #54296b;
    --roxo-titulo: #522a6b;
    --vermelho: #c20e1a;
    --vermelho-vivo: #e80d1c;
    --vermelho-escuro: #a21a17;
    --vermelho-faixa: #a5170a;
    --vermelho-hover: #b42a17;
    --verde: #cad41a;
    --cinza: #e4e4e4;
    --cinza-texto: #d0d0d0;
    --branco: #fff;

    --fonte: 'Barlow Condensed', 'Arial Narrow', sans-serif;
    --fonte-menu: 'Montserrat', Arial, sans-serif;
    --ease: cubic-bezier(.27, .11, .21, 1);

    --barra: 64px;          /* altura da barra no mobile */
    --lateral: 0px;         /* largura da barra lateral (so desktop) */
    --tela: 100vh;
    --tela: 100svh;         /* altura visivel real no mobile (sem a barra do navegador) */
}

@media (min-width: 1024px) {
    :root {
        --barra: 0px;
        --lateral: 85px;
    }
}

/* ----- Base ----- */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: var(--barra);
}

body {
    font-family: var(--fonte);
    font-weight: 400;
    font-size: 18px;
    line-height: 1.4;
    color: #222;
    background: var(--branco);
    overflow-x: hidden;
    -webkit-tap-highlight-color: transparent;
}

body.sem-rolagem {
    overflow: hidden;
}

img,
svg,
video,
iframe {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

a {
    color: inherit;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    cursor: pointer;
}

ul {
    list-style: none;
}

:focus-visible {
    outline: 3px solid var(--verde);
    outline-offset: 3px;
}

[hidden] {
    display: none !important;
}

.sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.pular-conteudo {
    position: fixed;
    top: -100px;
    left: 16px;
    z-index: 1000;
    padding: 10px 16px;
    background: var(--verde);
    color: #000;
    font-weight: 600;
}
.pular-conteudo:focus {
    top: 16px;
}

.botao {
    display: inline-block;
    padding: 14px 32px;
    background: var(--verde);
    color: var(--branco);
    font-family: var(--fonte);
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: .03em;
    transition: background-color .3s, color .3s;
}
.botao:hover {
    background: var(--roxo);
}

.botao-fechar {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
}
.botao-fechar svg {
    width: 26px;
    height: 26px;
    fill: var(--vermelho);
    transition: fill .3s;
}
.botao-fechar:hover svg {
    fill: #000;
}

/* ----- Animacao de entrada (so quando o JS esta ativo) ----- */
.js .revela {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity .7s var(--ease), transform .7s var(--ease);
    transition-delay: calc(var(--i, 0) * 70ms);
}
.js .revela.is-visivel {
    opacity: 1;
    transform: none;
}

/* ==========================================================================
   BARRA (topo no mobile, lateral no desktop)
   ========================================================================== */
.barra {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 90;
    height: var(--barra);
    padding-top: env(safe-area-inset-top);
    background: var(--roxo);
    color: var(--branco);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding-inline: 16px 12px;
    transition: transform .4s var(--ease);
}

.barra__titulo {
    display: block;
    font-family: var(--fonte);
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .02em;
    white-space: nowrap;
    transition: opacity .3s, transform .3s var(--ease);
}
.barra__titulo.is-trocando {
    opacity: 0;
    transform: translateY(10px);
}

/* Na home a barra do mobile fica transparente sobre os triangulos */
body.na-home .barra {
    background: transparent;
}
body.na-home .menu-botao {
    background: rgba(81, 40, 108, .85);
}
body.com-menu .barra {
    background: transparent;
}
body.com-menu .menu-botao {
    border-color: var(--branco);
}
body.com-menu .menu-botao__linhas::before,
body.com-menu .menu-botao__linhas::after {
    background: var(--branco);
}

/* Botao hamburguer */
.menu-botao {
    position: relative;
    z-index: 2;
    width: 46px;
    height: 46px;
    border: 4px solid var(--branco);
    display: grid;
    place-items: center;
    transition: background-color .3s, border-color .3s;
}
.menu-botao:hover {
    background: rgba(255, 255, 255, .25);
}
.menu-botao__linhas,
.menu-botao__linhas::before,
.menu-botao__linhas::after {
    display: block;
    width: 24px;
    height: 3px;
    background: var(--branco);
    transition: transform .3s var(--ease), background-color .3s, opacity .2s;
}
.menu-botao__linhas {
    position: relative;
}
.menu-botao__linhas::before,
.menu-botao__linhas::after {
    content: '';
    position: absolute;
    left: 0;
}
.menu-botao__linhas::before { top: -8px; }
.menu-botao__linhas::after  { top: 8px; }

.menu-botao[aria-expanded="true"] .menu-botao__linhas {
    background: transparent;
}
.menu-botao[aria-expanded="true"] .menu-botao__linhas::before {
    transform: translateY(8px) rotate(45deg);
}
.menu-botao[aria-expanded="true"] .menu-botao__linhas::after {
    transform: translateY(-8px) rotate(-45deg);
}

@media (min-width: 1024px) {
    .barra {
        right: auto;
        bottom: 0;
        width: var(--lateral);
        height: auto;
        flex-direction: column;
        justify-content: flex-start;
        padding: 17px 0 0;
    }
    body.na-home .barra {
        background: var(--roxo);
        transform: translateX(-100%);
    }
    body.na-home .menu-botao {
        /* na home o botao continua visivel mesmo com a barra recolhida */
        transform: translateX(var(--lateral));
        background: rgba(81, 40, 108, .85);
    }
    body.na-home .menu-botao[aria-expanded="true"] .menu-botao__linhas {
        background: transparent;
    }
    .menu-botao {
        width: 51px;
        height: 51px;
        border-width: 5px;
        transition: background-color .3s, border-color .3s, transform .4s var(--ease);
    }
    .barra__secao {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
    .barra__titulo {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        font-family: var(--fonte-menu);
        font-weight: 900;
        font-size: 20px;
    }
    .barra__titulo.is-trocando {
        transform: rotate(180deg) translateY(-20px);
    }
}

/* ==========================================================================
   MENU ABERTO
   ========================================================================== */
.menu-aberto {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: calc(var(--barra) + 16px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));
    background: var(--roxo-menu);
    color: var(--branco);
    font-family: var(--fonte-menu);
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translateX(100%);
    transition: transform .5s var(--ease), visibility 0s linear .5s;
    visibility: hidden;
}
.menu-aberto.is-aberto {
    transform: none;
    visibility: visible;
    transition: transform .5s var(--ease), visibility 0s;
}
.menu-aberto__conteudo {
    text-align: center;
}
.menu-aberto__lista li {
    margin: 6px 0;
}
.menu-aberto__item {
    position: relative;
    display: inline-block;
    padding: 6px 16px;
    font-size: clamp(26px, 7.5vw, 50px);
    font-weight: 900;
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1.15;
}
.menu-aberto__item span {
    position: relative;
    z-index: 1;
    transition: color .4s;
}
.menu-aberto__item::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--branco);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .4s var(--ease);
}
.menu-aberto__item:hover::before,
.menu-aberto__item:focus-visible::before {
    transform: scaleX(1);
    transform-origin: left;
}
.menu-aberto__item:hover span,
.menu-aberto__item:focus-visible span {
    color: #a81f2b;
}
.menu-aberto__politica {
    display: inline-block;
    margin-top: 20px;
    font-size: 15px;
    transition: color .3s;
}
.menu-aberto__politica:hover {
    color: var(--verde);
}

.redes-sociais {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}
.redes-sociais a {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
}
.redes-sociais svg {
    width: 25px;
    height: 25px;
}
.redes-sociais svg [class] {
    fill: var(--branco);
    transition: fill .3s;
}
.redes-sociais a:hover svg [class] {
    fill: #a81f2b;
}

@media (min-width: 1024px) {
    .menu-aberto {
        justify-content: flex-start;
        padding-left: calc(var(--lateral) + 85px);
        transform: translateX(-100%);
    }
    .menu-aberto__conteudo,
    .menu-aberto .redes-sociais {
        text-align: left;
        justify-content: flex-start;
    }
    .menu-aberto__politica {
        padding-left: 20px;
    }
    .menu-aberto .redes-sociais {
        padding-left: 10px;
    }
}

/* ==========================================================================
   SECOES
   ========================================================================== */
main {
    padding-left: var(--lateral);
}

.secao {
    position: relative;
    overflow: hidden;
}

/* ----- HOME ----- */
.secao--home {
    height: var(--tela);
    min-height: 480px;
    display: flex;
    align-items: center;
    background: var(--branco);
    font-family: var(--fonte);
}
.home__triangulos,
.home__svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.home__triangulos {
    z-index: 1;
}
.home__svg--desktop { display: none; }
@media (min-aspect-ratio: 1/1) {
    .home__svg--desktop { display: block; }
    .home__svg--mobile  { display: none; }
}
.home__svg polygon {
    opacity: 0;
    transition: opacity .8s var(--ease);
}
.home__svg polygon.is-aceso {
    opacity: 1;
}

.home__frase {
    position: absolute;
    left: 0;
    right: 0;
    padding: 0 24px;
    font-size: clamp(34px, min(12vw, 14svh), 120px);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    pointer-events: none;
}
.home__frase--1 {
    z-index: 0;
    color: var(--cinza-texto);
}
.home__frase--2 {
    z-index: 2;
    color: var(--branco);
    opacity: 0;
    transition: opacity .8s var(--ease) .6s;
}
.home--revelada .home__frase--2 {
    opacity: 1;
}
.home__frase--1 {
    transition: opacity .6s var(--ease) .4s;
}
.home--revelada .home__frase--1 {
    opacity: 0;
}

.home__rolar {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: calc(24px + env(safe-area-inset-bottom));
    width: 44px;
    height: 70px;
    margin-left: -22px;
}
.home__rolar span {
    position: absolute;
    left: 7px;
    bottom: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--verde);
    animation: rolar 1.5s infinite;
}
@keyframes rolar {
    0%   { opacity: 0; transform: translateY(0); }
    50%  { opacity: 1; }
    100% { opacity: 0; transform: translateY(-40px); }
}

@media (min-width: 1024px) {
    .secao--home {
        margin-left: calc(var(--lateral) * -1);   /* home ocupa a tela inteira */
    }
    .home__frase {
        padding-left: 5vw;
        font-size: 5vw;
        line-height: 10vh;
        text-align: left;
    }
}

/* ----- AGENCIA ----- */
.secao--agencia {
    min-height: var(--tela);
    display: flex;
    flex-direction: column;
    color: var(--branco);
    background: var(--roxo);
}
.agencia__foto,
.contato__foto {
    display: block;
}
.agencia__foto img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.agencia__frases {
    position: relative;
    z-index: 2;
    display: grid;
    min-height: 42svh;
    padding: calc(var(--barra) + 20px) 16px 20px;
    overflow: hidden;
    align-items: center;
}
.agencia__frase {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    color: var(--vermelho-vivo);
    font-size: clamp(48px, 14vw, 180px);
    line-height: .95;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
}
.agencia__frase span {
    transform: translateX(-120vw);
}
.agencia__frase.is-ativa span {
    transform: none;
    transition: transform .7s var(--ease);
}
.agencia__frase.is-ativa span + span {
    transition-delay: .12s;
}
.agencia__frase.is-saindo span {
    transform: translateX(120vw);
    transition: transform .7s var(--ease);
}
.agencia__frase.is-saindo span + span {
    transition-delay: .1s;
}

.agencia__texto {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
    padding: 32px 24px calc(40px + env(safe-area-inset-bottom));
    font-size: 21px;
    line-height: 1.35;
    text-align: center;
}
.agencia__texto::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--roxo);
    mix-blend-mode: multiply;
}

@media (min-width: 768px) {
    .secao--agencia {
        height: var(--tela);
        min-height: 560px;
        flex-direction: row;
    }
    .agencia__frases,
    .agencia__texto {
        width: 50%;
        min-height: 0;
    }
    .agencia__frases {
        padding: 20px;
    }
    .agencia__frase {
        font-size: 9.5vw;
        text-align: left;
    }
    .agencia__texto {
        padding: 40px 5vw 40px 6vw;
        font-size: clamp(20px, 1.8vw, 26px);
        text-align: left;
    }
}
@media (min-width: 1024px) {
    .agencia__frase {
        font-size: 8.5vw;
    }
}

/* ----- O QUE FAZEMOS ----- */
.secao--oqfazemos {
    background: var(--cinza);
    padding: 16px;
}
.servicos__item + .servicos__item {
    border-top: 1px solid #cfcfcf;
}
.servicos__botao {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 76px;
    padding: 12px 0;
    text-align: left;
    gap: 16px;
}
.servicos__nome {
    flex: 1;
    color: #7c7c7c;
    font-size: clamp(24px, 6.6vw, 40px);
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    transition: color .4s var(--ease);
}
.servicos__botao::after {
    /* seta indicando que abre detalhes */
    content: '';
    width: 12px;
    height: 12px;
    border-top: 3px solid var(--vermelho);
    border-right: 3px solid var(--vermelho);
    transform: rotate(45deg);
    flex-shrink: 0;
    margin-right: 6px;
}
.servicos__fundo {
    width: 64px;
    height: 52px;
    flex-shrink: 0;
    background-size: cover;
    background-position: center;
}
.servicos__botao:hover .servicos__nome,
.servicos__botao:focus-visible .servicos__nome {
    color: #b1302e;
}
.servicos__item:nth-child(even) .servicos__botao:hover .servicos__nome,
.servicos__item:nth-child(even) .servicos__botao:focus-visible .servicos__nome {
    color: #52296a;
}

@media (min-width: 1024px) {
    .secao--oqfazemos {
        height: var(--tela);
        min-height: 640px;
        padding: 20px;
    }
    .servicos {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    .servicos__item {
        flex: 1;
        min-height: 0;
    }
    .servicos__item + .servicos__item {
        border-top: 0;
    }
    .servicos__botao {
        height: 100%;
        min-height: 0;
        padding: 0 0 0 20px;
        gap: 20px;
        overflow: hidden;
    }
    .servicos__nome {
        flex: 0 1 auto;
        font-size: min(9vh, 4.4vw);
    }
    .servicos__botao::after {
        display: none;
    }
    .servicos__fundo {
        flex: 1;
        height: 100%;
        transform: translateY(-110%);
        transition: transform .5s var(--ease);
    }
    .servicos__botao:hover .servicos__fundo,
    .servicos__botao:focus-visible .servicos__fundo {
        transform: none;
    }
}
/* Em telas sem mouse a foto fica sempre visivel */
@media (min-width: 1024px) and (hover: none) {
    .servicos__fundo {
        transform: none;
    }
}

/* Detalhe do servico (slides) */
.servico-detalhe {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: #111;
    color: var(--branco);
    overflow: hidden;
    animation: sobe .5s var(--ease);
}
@keyframes sobe {
    from { transform: translateY(100%); }
    to   { transform: none; }
}
.servico-detalhe__trilho {
    display: flex;
    height: 100%;
    transition: transform .5s var(--ease);
    touch-action: pan-y;
}
.servico-detalhe__slide {
    position: relative;
    flex: 0 0 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}
.servico-detalhe__foto img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.servico-detalhe__slide::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .15) 0%, rgba(0, 0, 0, .35) 45%, rgba(0, 0, 0, .8) 100%);
}
.servico-detalhe__texto {
    position: relative;
    z-index: 1;
    padding: 24px 24px calc(104px + env(safe-area-inset-bottom));
    max-width: 900px;
}
.servico-detalhe__texto h3 {
    margin-bottom: 12px;
    font-size: clamp(38px, 10vw, 85px);
    font-weight: 500;
    line-height: .95;
    text-transform: uppercase;
}
.servico-detalhe__texto p {
    font-size: clamp(19px, 2vw, 26px);
    line-height: 1.35;
}
.servico-detalhe__controles {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
}
.servico-detalhe__seta {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
}
.servico-detalhe__seta svg {
    width: 34px;
    height: 34px;
    fill: var(--branco);
    transition: fill .3s, opacity .3s;
}
.servico-detalhe__seta:hover svg {
    fill: var(--verde);
}
.servico-detalhe__seta:disabled {
    cursor: default;
}
.servico-detalhe__seta:disabled svg {
    opacity: .2;
    fill: var(--branco);
}
.servico-detalhe__contador {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .1em;
}
.servico-detalhe__fechar {
    position: absolute;
    z-index: 2;
    top: calc(12px + env(safe-area-inset-top));
    right: 12px;
    background: rgba(255, 255, 255, .9);
    border-radius: 50%;
}

@media (min-width: 1024px) {
    .servico-detalhe {
        left: var(--lateral);
    }
    .servico-detalhe__texto {
        padding: 60px 60px 130px;
    }
    .servico-detalhe__controles {
        padding: 24px 40px;
    }
    .servico-detalhe__fechar {
        top: 20px;
        right: 20px;
    }
}

/* ----- TRABALHOS ----- */
.secao--trabalhos {
    background: var(--roxo-escuro);
    padding-top: 0;
}
.trabalhos {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.trabalhos__link {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--roxo);
    color: var(--branco);
    text-decoration: none;
}
.trabalhos__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ease);
}
.trabalhos__link::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 45%, rgba(20, 5, 30, .85) 100%);
}
.trabalhos__titulo {
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 10px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.15;
    text-transform: uppercase;
}
.trabalhos__mais {
    padding: 32px 16px 40px;
    text-align: center;
}

@media (min-width: 768px) {
    .trabalhos__titulo {
        padding: 14px 18px;
        font-size: 18px;
    }
}
@media (min-width: 1024px) {
    .trabalhos {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (hover: hover) and (min-width: 1024px) {
    .trabalhos__link::after {
        background: rgba(81, 40, 108, .8);
        mix-blend-mode: multiply;
        opacity: 0;
        transition: opacity .5s var(--ease);
    }
    .trabalhos__titulo {
        top: 50%;
        bottom: auto;
        right: auto;
        max-width: 90%;
        padding: 20px 30px;
        background: var(--vermelho-faixa);
        font-size: 18px;
        transform: translate(-101%, -50%);
        transition: transform .5s var(--ease);
    }
    .trabalhos__link:hover::after,
    .trabalhos__link:focus-visible::after {
        opacity: 1;
    }
    .trabalhos__link:hover .trabalhos__titulo,
    .trabalhos__link:focus-visible .trabalhos__titulo {
        transform: translate(0, -50%);
    }
    .trabalhos__link:hover .trabalhos__img {
        transform: scale(1.06);
    }
}

/* Trabalho aberto (modal) */
.trabalho-aberto {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: var(--branco);
    color: #000;
    animation: entra-esquerda .5s var(--ease);
}
@keyframes entra-esquerda {
    from { transform: translateX(-100%); }
    to   { transform: none; }
}
.trabalho-aberto__rolagem {
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: calc(72px + env(safe-area-inset-top)) 16px calc(60px + env(safe-area-inset-bottom));
}
.trabalho-aberto__fechar {
    position: absolute;
    z-index: 2;
    top: calc(10px + env(safe-area-inset-top));
    right: 14px;
    background: var(--branco);
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
}
.trabalho-aberto.is-carregando .trabalho-aberto__corpo {
    min-height: 50vh;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Ccircle cx='25' cy='25' r='20' fill='none' stroke='%2351286c' stroke-width='4' stroke-dasharray='90 150' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 25 25' to='360 25 25' dur='.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E") center 30% / 44px no-repeat;
}

@media (min-width: 1024px) {
    .trabalho-aberto {
        left: var(--lateral);
    }
    .trabalho-aberto__rolagem {
        padding: 70px 40px 60px;
    }
    .trabalho-aberto__fechar {
        top: 16px;
        right: 30px;
    }
}

/* Conteudo dos trabalhos (blocos do editor) */
.trabalho-aberto__conteudo {
    max-width: 1000px;
    margin: 0 auto;
}
.entry-content {
    font-size: 19px;
    line-height: 1.5;
    overflow-wrap: break-word;
}
.entry-content > * + * {
    margin-top: 1em;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
    color: var(--roxo-titulo);
    font-weight: 700;
    line-height: 1.1;
    margin-top: 1.4em;
}
.entry-content > :first-child {
    margin-top: 0;
}
.entry-content h1 { font-size: clamp(34px, 7vw, 60px); }
.entry-content h2 { font-size: clamp(26px, 5vw, 38px); }
.entry-content h3 { font-size: clamp(22px, 4vw, 30px); }
.entry-content a {
    color: var(--vermelho);
}
.entry-content img {
    height: auto;
}
.entry-content figure {
    margin-left: 0;
    margin-right: 0;
}
.entry-content hr {
    border: 0;
    border-top: 1px solid #ddd;
    margin: 2em 0;
}
.entry-content ul,
.entry-content ol {
    padding-left: 1.3em;
}
.entry-content ul {
    list-style: disc;
}
.entry-content iframe,
.entry-content video {
    width: 100%;
}
.entry-content .wp-block-embed__wrapper iframe {
    max-width: 100%;
}
/* Garante o layout base dos blocos caso o CSS global do WP nao traga */
.entry-content .is-layout-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
}
.entry-content .is-layout-grid {
    display: grid;
    gap: 1em;
}
@media (max-width: 781px) {
    .entry-content .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .entry-content .wp-block-column {
        flex-basis: 100% !important;
    }
}

.pagina-trabalho {
    padding: calc(var(--barra) + 32px) 16px 60px;
}
.pagina-trabalho .trabalho-aberto__conteudo {
    padding-top: 0;
}
.pagina-trabalho__voltar {
    margin-top: 48px;
    text-align: center;
}
@media (min-width: 1024px) {
    .pagina-trabalho {
        padding: 70px 40px;
    }
}

/* ----- CLIENTES ----- */
.secao--clientes {
    background: var(--roxo-escuro);
}
.clientes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.clientes__item {
    display: grid;
    place-items: center;
    aspect-ratio: 3 / 2;
    padding: 8px;
    border-right: 2px solid var(--roxo-borda);
    border-bottom: 2px solid var(--roxo-borda);
    transition: background-color .5s var(--ease), opacity .7s var(--ease), transform .7s var(--ease);
}
.clientes__item:hover {
    background: var(--vermelho-hover);
}
.clientes__item img {
    width: 100%;
    max-height: 100%;
    object-fit: contain;
}
@media (min-width: 768px) {
    .clientes {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media (min-width: 1024px) {
    .secao--clientes {
        min-height: var(--tela);
        display: flex;
        align-items: center;
    }
    .clientes {
        width: 100%;
        grid-template-columns: repeat(6, 1fr);
    }
}

/* ----- CONTATO ----- */
.secao--contato {
    display: flex;
    flex-direction: column;
    background: var(--vermelho);
    color: var(--branco);
}
.contato__coordenadas {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    color: var(--vermelho);
    font-size: 10.5vw;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    mix-blend-mode: color-burn;
    pointer-events: none;
}
.contato__foto {
    position: relative;
    height: 36svh;
    min-height: 200px;
}
.contato__foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.contato__infs {
    padding: 28px 20px calc(40px + env(safe-area-inset-bottom));
}
.contato__titulo {
    font-size: clamp(30px, 8vw, 72px);
    line-height: 1;
    font-weight: 700;
}
.contato__lista {
    margin-top: 24px;
    padding: 20px 0 4px;
    border-top: 2px solid var(--branco);
    border-bottom: 2px solid var(--branco);
    font-size: 20px;
}
.contato__lista li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
}
.contato__lista svg {
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    margin-top: 1px;
}
.contato__lista svg [class] {
    fill: var(--branco);
}
.contato__lista a {
    text-decoration: none;
}
.contato__lista a:hover {
    text-decoration: underline;
}
.contato__infs .redes-sociais {
    justify-content: flex-start;
    margin-left: -10px;
}
.contato__infs .redes-sociais a:hover svg [class] {
    fill: var(--verde);
}
.contato__politica {
    display: inline-block;
    margin-top: 8px;
    font-size: 15px;
}

@media (min-width: 768px) {
    .secao--contato {
        flex-direction: row;
        min-height: var(--tela);
    }
    .contato__foto {
        width: 50%;
        height: auto;
    }
    .contato__foto img {
        position: absolute;
        inset: 0;
    }
    .contato__infs {
        width: 50%;
        align-self: center;
        padding: 12vw 40px 60px;
    }
    .contato__titulo {
        font-size: 5vw;
    }
    .contato__lista {
        border-top-width: 0;
        border-bottom-width: 0;
        font-size: 20px;
        position: relative;
    }
    .contato__lista::before,
    .contato__lista::after {
        content: '';
        position: absolute;
        left: 0;
        width: 70px;
        height: 2px;
        background: var(--branco);
    }
    .contato__lista::before { top: 0; }
    .contato__lista::after  { bottom: 0; }
    .contato__coordenadas {
        font-size: 8.6vw;
    }
}

/* ==========================================================================
   LGPD
   ========================================================================== */
.lgpd {
    position: fixed;
    z-index: 95;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px calc(14px + env(safe-area-inset-bottom));
    background: var(--vermelho-escuro);
    color: var(--branco);
    font-size: 14px;
    line-height: 1.3;
    text-align: left;
}
.lgpd a {
    color: var(--verde);
}
.lgpd__botao {
    flex-shrink: 0;
    min-width: 76px;
    min-height: 44px;
    padding: 10px 20px;
    background: var(--verde);
    color: var(--branco);
    font-weight: 600;
    transition: background-color .3s, color .3s;
}
.lgpd__botao:hover {
    background: var(--branco);
    color: var(--verde);
}
@media (min-width: 768px) {
    .lgpd {
        justify-content: space-between;
        gap: 30px;
        padding-inline: 20px;
        font-size: 16px;
    }
    .lgpd__botao {
        padding-inline: 30px;
    }
}
@media (min-width: 1024px) {
    .lgpd {
        left: var(--lateral);
    }
    body.na-home .lgpd {
        left: 0;
    }
}

/* ==========================================================================
   Movimento reduzido
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        transition-delay: 0s !important;
    }
    .js .revela {
        opacity: 1;
        transform: none;
    }
}
