/* ==========================================================
   ARBEX STUDIO — SITE V2
   Base: Hero visual aprovado. Sem bibliotecas externas.
   Contato: prévia WhatsApp local e envio opcional por Web3Forms.
   ========================================================== */

:root {
    --fundo: #141311;
    --texto-claro: #F6F3ED;
    --texto-suave: #CBC6BF;
    --champagne: #D1B28F;
    --escuro: #24211E;
    --papel: #F5F2ED;
    --papel-escuro: #ECE7DF;
    --tinta: #24211D;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body {
    min-width: 320px;
    margin: 0;
    background: var(--fundo);
    color: var(--texto-claro);
    font-family: "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid #C6A16E; outline-offset: 4px; }
[hidden] { display: none !important; }

.pular-conteudo {
    position: fixed; z-index: 30; top: 12px; left: 12px;
    padding: 12px 16px; background: #fff; color: #111;
    transform: translateY(-160%);
}
.pular-conteudo:focus { transform: none; }
.container { width: min(100% - 64px, 1280px); margin-inline: auto; }

/* ===== 1. Hero: iluminação + relevos preservados ===== */
.abertura {
    position: relative;
    isolation: isolate; /* Impede camadas decorativas de invadirem outras seções. */
    min-height: 100vh;
    min-height: 100svh;
    overflow: clip;
}
.ambiente {
    position: absolute; inset: 0; z-index: -1;
    overflow: hidden; pointer-events: none;
    background:
        radial-gradient(ellipse 51% 64% at 12% 56%, rgba(160,117,78,.16), transparent 77%),
        radial-gradient(ellipse 30% 40% at 81% 55%, rgba(114,81,52,.038), transparent 79%),
        linear-gradient(110deg, #26231F 0%, #1A1917 50%, #0F0F0E 100%);
}
.ambiente-grafismos { display: block; width: 100%; height: 100%; }
.costura-painel { fill: none; stroke: #B18D69; stroke-opacity: .29; stroke-width: 1; }
.costura-painel.fraca { stroke-opacity: .12; }
.trilha-sombra { fill: none; stroke: #030303; stroke-opacity: .78; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.trilha-fio { fill: none; stroke: url(#fio); stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.trilha-anel { fill: #171615; stroke: #957554; stroke-opacity: .50; stroke-width: 1.7; }
.trilha-nucleo { fill: #927253; opacity: .60; }

.cabecalho {
    width: min(100% - 64px, 1280px);
    min-height: 91px;
    margin-inline: auto;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px;
}
.marca-cabecalho {
    display: inline-flex; align-items: center; gap: 15px;
    text-decoration: none; color: #D5B48E;
    font-size: 11px; font-weight: 600; letter-spacing: .18em;
}
.cabecalho-marcador { width: 24px; height: 2px; flex: none; background: #D2B18A; }
.cabecalho-nav { display: flex; align-items: center; gap: clamp(22px, 3vw, 48px); }
.cabecalho-nav a {
    color: #E0DBD3; text-decoration: none; font-size: 12px;
    letter-spacing: .11em; text-transform: uppercase;
    transition: color .18s ease;
}
.cabecalho-nav a:hover, .cabecalho-nav a:focus-visible { color: var(--champagne); }
.menu-toggle { display: none; }

.hero {
    width: min(100% - 64px, 1280px);
    min-height: calc(100svh - 91px);
    margin-inline: auto;
    padding: clamp(62px, 7vh, 95px) 0 clamp(74px, 10vh, 128px);
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
    align-items: center; gap: clamp(32px, 5vw, 88px);
}
.hero-conteudo { max-width: 660px; }
.hero-categoria {
    margin: 0 0 29px; color: #D1AD85;
    font-size: 12px; font-weight: 600; letter-spacing: .14em;
}
.hero-titulo {
    margin: 0; font-size: clamp(39px, 3.6vw, 63px);
    font-weight: 700; letter-spacing: -.038em; line-height: 1.10;
    text-wrap: balance;
}
.hero-titulo span { color: var(--champagne); }
.hero-descricao {
    max-width: 540px; margin: 29px 0 0;
    color: var(--texto-suave); font-size: clamp(16px, 1.15vw, 18px);
    line-height: 1.7;
}
.hero-identidade { min-width: 0; display: flex; align-items: center; justify-content: center; }
.hero-logo {
    display: block; width: min(100%, 510px); height: auto; object-fit: contain;
    /* Nunca aplicar efeitos à arte original. */
}
.hero-acoes { display: flex; align-items: center; gap: 27px; flex-wrap: wrap; margin-top: 35px; }
.botao {
    border: 1px solid transparent; border-radius: 4px;
    display: inline-flex; align-items: center; justify-content: space-between;
    gap: 28px; min-height: 52px; padding: 13px 20px;
    text-decoration: none; font-size: 14px; font-weight: 600;
    transition: background .18s ease, transform .18s ease;
}
.botao:hover { transform: translateY(-2px); }
.botao-primario { color: #211B15; background: #DEC09B; }
.botao-primario:hover { background: #F0D2AE; }
.link-secundario {
    text-decoration: none; color: #ECE6DE; font-size: 14px;
    border-bottom: 1px solid #A68A68; padding: 9px 0;
}
.link-secundario span { margin-left: 8px; }
.link-secundario:hover { color: var(--champagne); }

/* ===== 2. Seções claras: leitura e ritmo editorial ===== */
.secao { padding: clamp(84px, 10vw, 152px) 0; }
.secao-servicos { background: var(--papel); color: var(--tinta); }
.secao-portfolio { background: var(--papel-escuro); color: var(--tinta); }
.sobretitulo {
    margin: 0 0 24px; color: #9C7A53;
    font-size: 12px; font-weight: 700; letter-spacing: .17em;
}
.secao h2 {
    margin: 0; font-size: clamp(36px, 4.3vw, 64px);
    line-height: 1.13; font-weight: 650; letter-spacing: -.04em;
}
.secao h2 em { font-style: normal; color: #A17E58; }
.servicos-grade { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(55px, 9vw, 135px); }
.secao-intro > p:last-child { max-width: 430px; margin-top: 28px; font-size: 17px; line-height: 1.72; color: #625C54; }
.servicos-lista { border-top: 1px solid #C8BFB2; }
.servico-item { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 20px; border-bottom: 1px solid #C8BFB2; padding: 30px 0 32px; }
.servico-numero { color: #9C7A53; font-size: 13px; font-weight: 700; }
.servico-item h3 { margin: 0 0 12px; font-size: 23px; font-weight: 600; letter-spacing: -.025em; }
.servico-item p { margin: 0; line-height: 1.65; font-size: 15px; color: #645E57; }

.portfolio-cabecalho { display: flex; justify-content: space-between; align-items: end; gap: 60px; margin-bottom: 44px; }
.portfolio-cabecalho > div { max-width: 720px; }
.portfolio-cabecalho > p { max-width: 330px; color: #625C54; line-height: 1.7; font-size: 15px; margin: 0; }
.portfolio-apresentacao {
    min-height: 460px; display: grid; grid-template-columns: 1fr 1fr;
    overflow: hidden; background: #25221F; color: #F7F2EA;
}
.portfolio-esquerda { padding: clamp(38px, 5vw, 74px); align-self: center; }
.portfolio-etiqueta { color: #BDA080; font-size: 11px; font-weight: 700; letter-spacing: .14em; }
.portfolio-esquerda h3 { margin: 28px 0 18px; max-width: 420px; font-size: clamp(29px, 3vw, 43px); letter-spacing: -.035em; line-height: 1.15; }
.portfolio-esquerda p { max-width: 445px; line-height: 1.7; color: #CCC3B6; font-size: 15px; }
.portfolio-link { display: inline-flex; gap: 15px; margin-top: 24px; padding-bottom: 8px; border-bottom: 1px solid #BCA07D; color: #EBD6BD; text-decoration: none; font-weight: 600; font-size: 14px; }
.portfolio-vitrine {
    min-height: 460px; display: flex; align-items: flex-end; justify-content: center;
    padding: 85px 22px 0; overflow: hidden;
    background: radial-gradient(ellipse at 80% 10%, rgba(200,156,103,.19), transparent 60%), linear-gradient(125deg, #39342F, #161514);
}
.vitrine-moldura {
    position: relative; width: min(100%, 490px); height: 360px;
    border: 1px solid #977F64; border-bottom: 0; border-radius: 12px 12px 0 0;
    background: #E8DFD2; box-shadow: -20px 10px 70px rgba(0,0,0,.28);
    padding: 18px 30px;
}
.vitrine-topo { display: flex; gap: 5px; align-items: center; border-bottom: 1px solid #C7BCAE; padding-bottom: 14px; }
.vitrine-topo i { width: 7px; height: 7px; border-radius: 50%; background: #A59685; }
.vitrine-topo span { margin-left: auto; color: #766758; font-size: 9px; letter-spacing: .07em; }
.vitrine-linha { width: 34%; height: 6px; background: #B7A38B; margin-top: 42px; }
.vitrine-bloco-grande { width: 74%; height: 18px; background: #332F2A; margin-top: 18px; }
.vitrine-bloco-medio { width: 64%; height: 18px; background: #332F2A; margin-top: 6px; }
.vitrine-bloco-pequeno { width: 53%; height: 8px; background: #B6AFA5; margin-top: 20px; }
.vitrine-retangulo { width: 100px; height: 30px; background: #AF8861; margin-top: 30px; }

/* ===== 3. Contato: prepara mensagem sem fingir que envia ===== */
.secao-contato {
    position: relative; overflow: hidden;
    background:
        radial-gradient(ellipse 60% 100% at 0% 70%, rgba(146,109,74,.15), transparent 72%),
        #171614;
}
.contato-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(50px, 8vw, 130px); align-items: start; }
.contato-chamada h2 { max-width: 610px; }
.contato-chamada > p:not(.sobretitulo) { max-width: 490px; color: #CEC8BE; font-size: 17px; line-height: 1.7; }
.contato-chamada .contato-aviso { font-size: 13px !important; color: #B2A69A !important; margin-top: 26px; border-left: 2px solid #9E8163; padding-left: 17px; }
.briefing { background: #24221F; border: 1px solid #54483C; padding: clamp(24px, 3vw, 40px); }
.briefing h3 { margin: 0 0 24px; font-size: 22px; font-weight: 600; }
.campo { display: flex; flex-direction: column; gap: 9px; margin-bottom: 20px; }
.campo label, .briefing-resultado label { font-size: 13px; font-weight: 600; color: #E9E1D7; }
.campo label span { font-weight: 400; color: #AEA49A; }
.campo input, .campo select, .campo textarea, #texto-gerado {
    width: 100%; border: 1px solid #65594D; border-radius: 3px; padding: 12px 13px;
    color: #F9F6F1; background: #1A1917; font-size: 15px; outline-offset: 3px;
}
.campo select { color-scheme: dark; }
.campo textarea, #texto-gerado { resize: vertical; }
.campo input::placeholder, .campo textarea::placeholder { color: #A89C8E; }
.botao-form { margin-top: 6px; width: 100%; text-align: left; }
.briefing-resultado { margin-top: 27px; border-top: 1px solid #594B3D; padding-top: 23px; }
.briefing-resultado label { display: block; margin-bottom: 11px; }
#texto-gerado { line-height: 1.6; }
.botao-copiar { margin-top: 12px; width: 100%; background: transparent; color: #E6CEAE; border-color: #90765A; }
.botao-copiar:hover { background: #39312A; }
.briefing-status { min-height: 20px; font-size: 13px; color: #D9C2A1; }
.rodape { background: #0F0E0D; border-top: 1px solid #383029; }
.rodape-inner { min-height: 96px; display: flex; justify-content: space-between; align-items: center; gap: 20px; color: #B9AEA1; font-size: 12px; letter-spacing: .06em; }
.rodape a { text-decoration: none; }
.rodape a:hover { color: #E0BE97; }

/* ===== 4. Adaptação: tablet, notebooks baixos e celulares ===== */
@media (max-width: 980px) {
    .hero { gap: 22px; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); }
    .hero-titulo { font-size: clamp(35px, 4.2vw, 46px); }
    .servicos-grade, .contato-grade { gap: 52px; }
}
@media (max-width: 740px) {
    .container, .cabecalho, .hero { width: min(100% - 40px, 600px); }
    .cabecalho { min-height: 74px; position: relative; z-index: 5; }
    .marca-cabecalho { font-size: 10px; gap: 10px; letter-spacing: .11em; }
    .cabecalho-marcador { width: 17px; }
    .menu-toggle {
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        gap: 5px; flex: none; width: 44px; height: 44px;
        border: 1px solid #66523C; background: #211F1C; color: #fff; border-radius: 3px;
    }
    .menu-toggle span { width: 19px; height: 2px; background: #E7D0B0; }
    .cabecalho-nav {
        display: none; position: absolute; right: 0; top: calc(100% - 4px);
        width: min(100%, 320px); padding: 14px 20px; align-items: stretch; gap: 0;
        background: #25221E; border: 1px solid #705B46; box-shadow: 0 20px 40px rgba(0,0,0,.28);
    }
    .cabecalho-nav[data-open="true"] { display: flex; flex-direction: column; }
    .cabecalho-nav a { padding: 16px 4px; border-bottom: 1px solid #4E4337; }
    .cabecalho-nav a:last-child { border-bottom: 0; }
    .hero {
        grid-template-columns: 1fr; min-height: auto;
        padding: 70px 0 78px; gap: 36px;
    }
    .hero-categoria { font-size: 11px; margin-bottom: 22px; }
    .hero-titulo { font-size: clamp(37px, 9vw, 54px); line-height: 1.12; }
    .hero-descricao { margin-top: 24px; font-size: 16px; }
    .hero-logo { width: min(100%, 380px); }
    .ambiente { background: radial-gradient(ellipse 100% 51% at 15% 31%, rgba(148,106,70,.14), transparent 85%), linear-gradient(160deg, #24211D 0%, #141311 58%, #0F0F0E 100%); }
    .ambiente-grafismos { opacity: .30; }
    .trilhas:not(.trilhas-superiores) { display: none; }
    .secao { padding: 86px 0; }
    .servicos-grade, .contato-grade { grid-template-columns: 1fr; gap: 42px; }
    .portfolio-cabecalho { display: block; }
    .portfolio-cabecalho > p { margin-top: 20px; }
    .portfolio-apresentacao { grid-template-columns: 1fr; }
    .portfolio-vitrine { min-height: 300px; padding-top: 40px; }
    .vitrine-moldura { height: 270px; }
    .portfolio-esquerda { padding: 45px 28px; }
    .rodape-inner { min-height: 100px; }
}
@media (max-width: 380px) {
    .hero-acoes { align-items: stretch; gap: 15px; }
    .hero-acoes .botao { width: 100%; }
    .hero-titulo { font-size: 36px; }
    .marca-cabecalho { font-size: 9px; }
}
@media (max-height: 760px) and (min-width: 741px) {
    .hero { min-height: auto; padding-top: 38px; padding-bottom: 65px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .botao, .cabecalho-nav a { transition: none; }
}

/* ===== ARBEX STUDIO | CORREÇÃO DAS TRILHAS V2.2 ===== */
/* Cole este bloco no FINAL de css/style.css. */

.trilhas-decorativas {
    position: absolute;
    /* Posiciona cada SVG independentemente do desenho arquitetônico. */
    display: block;
    height: auto;
    max-width: none;
    overflow: visible;
    pointer-events: none;
    /* O grafismo não bloqueia cliques. */
}

.trilhas-superiores {
    top: clamp(104px, 12svh, 140px);
    right: clamp(20px, 6vw, 130px);
    width: min(45vw, 720px);
    opacity: 0.73;
    /* Mantém distância do cabeçalho e das bordas do navegador. */
}

.trilhas-inferiores {
    bottom: max(clamp(52px, 8svh, 100px), calc(100% - 100svh + 58px));
    left: 0;
    width: min(69vw, 950px);
    opacity: 0.82;
    /* Protege as trilhas inferiores em alturas de navegador menores. */
}

.trilhas-superiores .trilha-fio {
    stroke: url(#fio-superior);
}

.trilhas-inferiores .trilha-fio {
    stroke: url(#fio-inferior);
}

/* Adaptação para celulares. */
@media (max-width: 740px) {
    .trilhas-inferiores { display: none; }
    .trilhas-superiores {
        top: 84px;
        right: -38px;
        width: min(82vw, 400px);
        opacity: 0.25;
    }
}

/* Adaptação para notebooks mais baixos. */
@media (max-height: 820px) and (min-width: 741px) {
    .trilhas-superiores { top: 98px; opacity: 0.62; }
    .trilhas-inferiores { width: min(58vw, 820px); }
}

@media (max-height: 760px) and (min-width: 741px) {
    .hero {
        min-height: calc(100svh - 91px);
        padding-top: 20px;
        padding-bottom: 26px;
    }
    .hero-logo {
        width: auto;
        max-width: 100%;
        max-height: min(61svh, 430px);
    }
    .hero-titulo { font-size: clamp(32px, 3.3vw, 53px); }
    .hero-descricao { margin-top: 20px; }
    .hero-acoes { margin-top: 25px; }
    .trilhas-inferiores { display: none; }
}


/* ==========================================================
   ARBEX STUDIO — REFINAMENTO DAS SEÇÕES CLARAS | V2.3
   Adição exclusivamente visual. Mantém o Hero, HTML e JS.
   Os desenhos SVG estão incorporados ao CSS para que apenas
   este arquivo precise ser substituído.
   ========================================================== */

/* Superfície fosca com uma variação sutil de luz, não textura. */
.secao-servicos,
.secao-portfolio {
    position: relative;
    isolation: isolate; /* Separa a decoração do conteúdo. */
    overflow: hidden; /* Recorta somente as pontas decorativas. */
}
.secao-servicos {
    background:
        radial-gradient(ellipse 51% 59% at 92% 0%, rgba(255,255,255,.88), transparent 82%),
        radial-gradient(ellipse 47% 55% at 2% 100%, rgba(204,181,148,.10), transparent 78%),
        var(--papel);
}
.secao-portfolio {
    background:
        radial-gradient(ellipse 63% 48% at 0% 100%, rgba(255,255,255,.70), transparent 75%),
        radial-gradient(ellipse 45% 50% at 100% 0%, rgba(191,161,123,.07), transparent 80%),
        var(--papel-escuro);
}

/* O conteúdo fica acima do acabamento, sem linhas por cima dos textos. */
.secao-servicos > .container,
.secao-portfolio > .container {
    position: relative;
    z-index: 1;
}

/* Traços entalhados nas duas superfícies: brilho e sombra de relevo. */
.secao-servicos::before,
.secao-portfolio::before {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

/* SERVIÇOS: trilhas descem da lateral direita, sem repetir as do Hero. */
.secao-servicos::before {
    width: min(56vw, 780px);
    aspect-ratio: 780 / 215;
    top: 14px;
    right: -10px;
    opacity: .8;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20780%20215%22%20fill%3D%22none%22%3E%0A%3Cdefs%3E%3ClinearGradient%20id%3D%22s%22%20x1%3D%22180%22%20y1%3D%2220%22%20x2%3D%22780%22%20y2%3D%22150%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23a78b6d%22%20stop-opacity%3D%22.03%22%2F%3E%3Cstop%20offset%3D%22.34%22%20stop-color%3D%22%23b99b77%22%20stop-opacity%3D%22.66%22%2F%3E%3Cstop%20offset%3D%22.63%22%20stop-color%3D%22%23fffefa%22%20stop-opacity%3D%22.98%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%239c7b56%22%20stop-opacity%3D%22.30%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%3Cg%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%3E%0A%3Cg%20stroke%3D%22%23746b60%22%20stroke-opacity%3D%22.36%22%20stroke-width%3D%224%22%3E%0A%3Cpath%20d%3D%22M779%2030H570l-54%2043H335%22%2F%3E%3Cpath%20d%3D%22M780%2078H625l-74%2064H400%22%2F%3E%3Cpath%20d%3D%22M780%20138H713l-49%2043H568%22%2F%3E%3C%2Fg%3E%0A%3Cg%20stroke%3D%22%23fffdf8%22%20stroke-opacity%3D%22.93%22%20stroke-width%3D%222%22%20transform%3D%22translate%280%20-1.8%29%22%3E%0A%3Cpath%20d%3D%22M779%2030H570l-54%2043H335%22%2F%3E%3Cpath%20d%3D%22M780%2078H625l-74%2064H400%22%2F%3E%3Cpath%20d%3D%22M780%20138H713l-49%2043H568%22%2F%3E%3C%2Fg%3E%0A%3Cg%20stroke%3D%22url%28%23s%29%22%20stroke-width%3D%221.1%22%3E%0A%3Cpath%20d%3D%22M779%2030H570l-54%2043H335%22%2F%3E%3Cpath%20d%3D%22M780%2078H625l-74%2064H400%22%2F%3E%3Cpath%20d%3D%22M780%20138H713l-49%2043H568%22%2F%3E%3C%2Fg%3E%0A%3Cg%20fill%3D%22%23e9dfd1%22%20stroke%3D%22%23a58b69%22%20stroke-width%3D%221.5%22%3E%3Ccircle%20cx%3D%22335%22%20cy%3D%2273%22%20r%3D%227%22%2F%3E%3Ccircle%20cx%3D%22400%22%20cy%3D%22142%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%22568%22%20cy%3D%22181%22%20r%3D%226%22%2F%3E%3C%2Fg%3E%0A%3Cg%20fill%3D%22%23fffdfa%22%3E%3Ccircle%20cx%3D%22335%22%20cy%3D%2273%22%20r%3D%222.4%22%2F%3E%3Ccircle%20cx%3D%22400%22%20cy%3D%22142%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%22568%22%20cy%3D%22181%22%20r%3D%222%22%2F%3E%3C%2Fg%3E%0A%3C%2Fg%3E%3C%2Fsvg%3E");
}

/* PORTFÓLIO: trilhas sobem da lateral esquerda, no rodapé claro. */
.secao-portfolio::before {
    width: min(51vw, 720px);
    aspect-ratio: 720 / 210;
    left: -12px;
    bottom: 8px;
    opacity: .72;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20720%20210%22%20fill%3D%22none%22%3E%0A%3Cdefs%3E%3ClinearGradient%20id%3D%22p%22%20x1%3D%220%22%20y1%3D%22180%22%20x2%3D%22700%22%20y2%3D%2242%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23997c5d%22%20stop-opacity%3D%22.46%22%2F%3E%3Cstop%20offset%3D%22.36%22%20stop-color%3D%22%23fffefd%22%20stop-opacity%3D%22.98%22%2F%3E%3Cstop%20offset%3D%22.68%22%20stop-color%3D%22%23c8ac88%22%20stop-opacity%3D%22.60%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23978069%22%20stop-opacity%3D%22.02%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%3Cg%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%3Cg%20stroke%3D%22%2386735f%22%20stroke-opacity%3D%22.36%22%20stroke-width%3D%224.1%22%3E%3Cpath%20d%3D%22M0%20178H160l50-54H433l34-35H668%22%2F%3E%3Cpath%20d%3D%22M0%20122H92l52-57H310l30-24H555%22%2F%3E%3C%2Fg%3E%0A%3Cg%20stroke%3D%22%23fffefa%22%20stroke-opacity%3D%22.88%22%20stroke-width%3D%222%22%20transform%3D%22translate%280%20-1.7%29%22%3E%3Cpath%20d%3D%22M0%20178H160l50-54H433l34-35H668%22%2F%3E%3Cpath%20d%3D%22M0%20122H92l52-57H310l30-24H555%22%2F%3E%3C%2Fg%3E%0A%3Cg%20stroke%3D%22url%28%23p%29%22%20stroke-width%3D%221.25%22%3E%3Cpath%20d%3D%22M0%20178H160l50-54H433l34-35H668%22%2F%3E%3Cpath%20d%3D%22M0%20122H92l52-57H310l30-24H555%22%2F%3E%3C%2Fg%3E%0A%3Cg%20fill%3D%22%23ebe3d9%22%20stroke%3D%22%23a88b68%22%20stroke-width%3D%221.6%22%3E%3Ccircle%20cx%3D%22668%22%20cy%3D%2289%22%20r%3D%227%22%2F%3E%3Ccircle%20cx%3D%22555%22%20cy%3D%2241%22%20r%3D%226.5%22%2F%3E%3C%2Fg%3E%0A%3Cg%20fill%3D%22%23fffdfa%22%3E%3Ccircle%20cx%3D%22668%22%20cy%3D%2289%22%20r%3D%222.4%22%2F%3E%3Ccircle%20cx%3D%22555%22%20cy%3D%2241%22%20r%3D%222.2%22%2F%3E%3C%2Fg%3E%0A%3C%2Fg%3E%3C%2Fsvg%3E");
}

/* Em celulares, menos elementos e máximo espaço para leitura. */
@media (max-width: 740px) {
    .secao-servicos::before {
        width: 420px;
        max-width: 98%;
        top: 10px;
        right: -95px;
        opacity: .32;
    }
    .secao-portfolio::before {
        width: 390px;
        max-width: 98%;
        bottom: 10px;
        left: -105px;
        opacity: .3;
    }
}
/* ============================================================
   ARBEX STUDIO — EXPANSÃO EDITORIAL V3
   A camada do HERO permanece intocada em relação à V2.3.
   Classes "ap-" isolam as novas seções para facilitar manutenção.
   Não há bibliotecas ou fontes pagas.
   ============================================================ */

/* Comportamento global adicional */
.ap-line{display:inline-block;width:34px;height:1px;background:currentColor;vertical-align:middle;margin:0 12px 4px;opacity:.54}
.ap-textlink{display:inline-flex;gap:26px;align-items:center;padding-bottom:9px;border-bottom:1px solid currentColor;text-decoration:none;font-size:14px;font-weight:600;letter-spacing:.01em}
.ap-textlink:hover{color:#916944}
.ap-sectionhead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.65fr);gap:clamp(42px,7vw,130px);align-items:end}
.ap-section-aside{max-width:380px;justify-self:end}
.ap-section-aside p{margin:0;color:#625b53;font-size:clamp(16px,1.1vw,18px);line-height:1.74}
.ap-section-aside p strong{font-weight:650;color:#4d463f}
.ap-section-aside .ap-textlink{margin-top:30px;color:#3a332b}

/* SERVIÇOS — três linhas editoriais, números contidos e ausência de cartões. */
.ap-sectionhead--services{margin-bottom:clamp(70px,8vw,116px)}
.ap-service-list{border-top:1px solid #beb5a9;position:relative}
.ap-service-row{display:grid;grid-template-columns:minmax(155px,.36fr) minmax(0,1fr) 44px;align-items:center;gap:26px;padding:clamp(29px,3vw,44px) 0;border-bottom:1px solid #cac0b4}
.ap-service-index{font-size:12px;font-weight:700;color:#997d60;letter-spacing:.12em;white-space:nowrap}
.ap-service-row h3{font-size:clamp(24px,2.05vw,32px);letter-spacing:-.045em;line-height:1.18;margin:0 0 11px;font-weight:650}
.ap-service-row p{font-size:15px;color:#6b645d;max-width:620px;line-height:1.65;margin:0}
.ap-service-symbol{justify-self:end;color:#b6a28c;font-family:Georgia,serif;font-size:31px}

/* MANIFESTO — deixa a tipografia ser protagonista; luz apenas como apoio. */
.ap-manifesto{overflow:hidden;position:relative;isolation:isolate;background:#171614;color:#f6f1e9;padding:clamp(90px,11vw,178px) 0 clamp(82px,9vw,132px)}
.ap-manifesto:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 36% 100% at 100% 46%,rgba(183,143,99,.13),transparent 81%),linear-gradient(108deg,#151413,#24211e 71%,#171615)}
.ap-manifesto:after{content:"";position:absolute;width:min(60vw,740px);height:min(60vw,740px);right:-15%;top:-45%;border:1px solid rgba(210,170,127,.13);transform:rotate(-25deg) skewX(-20deg);pointer-events:none}
.ap-manifesto-inner{position:relative}
.ap-manifesto-meta{display:flex;justify-content:space-between;gap:24px;color:#cfaf88;font-size:11px;letter-spacing:.20em;font-weight:650}
.ap-manifesto h2{font-size:clamp(52px,7.5vw,124px);font-weight:600;line-height:1.02;letter-spacing:-.066em;margin:clamp(56px,7.8vw,118px) 0 clamp(45px,6vw,90px);max-width:1200px}
.ap-manifesto h2 em{font-style:normal;font-weight:550;color:#ceb08c}
.ap-manifesto-foot{display:flex;align-items:end;justify-content:space-between;border-top:1px solid rgba(226,201,171,.26);padding-top:28px;gap:24px}
.ap-manifesto-foot p{max-width:560px;font-size:17px;line-height:1.7;color:#ccc6bf;margin:0}
.ap-manifesto-spark{font-size:75px;line-height:1;color:#b9a080;font-weight:300}

/* PORTFÓLIO — três linguagens distintas; previews feitos por CSS, não imagens stock. */
.ap-portfolio{padding-bottom:clamp(110px,12vw,170px)}
.ap-sectionhead--portfolio{margin-bottom:58px}
.ap-case{min-width:0}
.ap-case-visual{position:relative;overflow:hidden;isolation:isolate}
.ap-case-visual--arch{height:clamp(460px,43vw,660px);background:#c8c1b3}
.ap-arch-nav{position:absolute;z-index:5;left:5%;right:5%;top:7%;display:flex;justify-content:space-between;align-items:center;font-family:Arial,sans-serif;font-size:11px;letter-spacing:.14em;font-weight:700;color:#393630}
.ap-arch-nav span{font-size:9px;font-weight:500}
.ap-arch-structure{position:absolute;inset:0;overflow:hidden;background:linear-gradient(120deg,#d5d0c6 0%,#b7b1a6 60%,#a99e91 100%)}
.ap-arch-structure:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,20,18,.38),transparent 56%),linear-gradient(0deg,rgba(32,26,23,.2),transparent 70%)}
.ap-building-b1{position:absolute;left:40%;top:14%;width:43%;height:100%;background:linear-gradient(100deg,#a59d90,#d3cfc3 27%,#b2aa9d 38%,#857d73 100%);transform:skewY(-12deg);box-shadow:-32px 5px 70px rgba(40,33,23,.2)}
.ap-building-b1:before{content:"";position:absolute;inset:8% 12% 0 22%;background:repeating-linear-gradient(90deg,rgba(35,31,30,.18) 0 2px,transparent 2px 19%),linear-gradient(180deg,rgba(40,38,34,.34),rgba(39,34,30,.03) 75%)}
.ap-building-b2{position:absolute;left:63%;top:30%;width:42%;height:82%;transform:skewY(8deg);background:linear-gradient(117deg,#8f897f,#beb6a8 33%,#726f68 95%);border-left:2px solid rgba(241,236,224,.8)}
.ap-building-b2:before{content:"";position:absolute;left:10%;top:12%;width:54%;height:60%;border:15px solid rgba(45,44,42,.24);box-shadow:inset 0 30px 55px rgba(27,26,25,.5)}
.ap-building-b3{position:absolute;left:27%;bottom:-35%;height:75%;width:63%;transform:rotate(-6deg);background:linear-gradient(115deg,#e0dacf,#807a72);clip-path:polygon(0 34%,100% 0,100% 100%,0 100%)}
.ap-building-window{position:absolute;z-index:1;left:77%;top:0;width:2px;height:100%;background:rgba(244,237,226,.35);transform:skewX(11deg)}
.ap-arch-light{position:absolute;inset:0;background:radial-gradient(ellipse 35% 60% at 76% 4%,rgba(255,251,234,.5),transparent 100%)}
.ap-arch-caption{position:absolute;z-index:4;left:6%;bottom:9%;color:#f8f4ed;text-shadow:0 2px 20px rgba(0,0,0,.22)}
.ap-arch-caption>span{display:block;font:600 11px Arial,sans-serif;letter-spacing:.2em;margin-bottom:24px}
.ap-arch-caption strong{display:block;font:400 clamp(40px,6vw,90px)/.99 Georgia,serif;letter-spacing:-.06em}
.ap-arch-caption small{display:block;font:600 10px Arial,sans-serif;letter-spacing:.18em;margin-top:28px}
.ap-case-info{display:flex;align-items:end;justify-content:space-between;gap:25px;padding:27px 0 0}
.ap-case-kicker{display:block;color:#826b54;letter-spacing:.13em;font-size:11px;font-weight:700}
.ap-dot{display:inline-block;vertical-align:middle;width:3px;height:3px;margin:0 10px;border-radius:50%;background:currentColor}
.ap-case-info h3{font-size:clamp(30px,3vw,44px);line-height:1.1;letter-spacing:-.04em;margin:10px 0 9px;font-weight:650}
.ap-case-info p{margin:0;max-width:460px;color:#605a53;font-size:15px;line-height:1.7}
.ap-case-open{display:inline-flex;align-items:center;gap:23px;padding:13px 0;white-space:nowrap;border-bottom:1px solid #92816b;text-decoration:none;color:#29251f;font-size:13px;font-weight:700}
.ap-case-open:hover{color:#93683e}
.ap-case-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4vw,60px);margin-top:clamp(80px,8vw,130px)}
.ap-case-pair .ap-case-info{display:block}
.ap-case-pair .ap-case-open{margin-top:15px}
.ap-case-pair .ap-case-visual{height:clamp(360px,34vw,525px)}
.ap-case-visual--product{background:radial-gradient(ellipse 63% 80% at 84% 30%,#2c5c68,#0d2934 80%);color:#f4fbfa;padding:clamp(28px,3vw,48px);display:flex;flex-direction:column}
.ap-product-top,.ap-well-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px;letter-spacing:.18em}
.ap-product-logo{font-size:30px;font-weight:700;letter-spacing:-.07em}
.ap-product-logo span{color:#71e3ce}
.ap-product-copy{font-size:clamp(29px,3.1vw,48px);font-weight:500;letter-spacing:-.056em;line-height:1.08;margin-top:clamp(43px,5vw,74px);z-index:2}
.ap-product-copy strong{font-weight:550;color:#85ecd8}
.ap-product-ui{position:absolute;bottom:-21%;right:-2%;width:78%;height:56%;background:#f8fcfb;box-shadow:-28px -18px 55px rgba(0,0,0,.18);border-radius:11px 0 0 0;display:grid;grid-template-columns:18% 1fr;padding:8px;color:#20404d;transform:rotate(-6deg)}
.ap-ui-sidebar{padding:15px 10px;background:#e5f0ef;display:flex;flex-direction:column;gap:16px}.ap-ui-sidebar span{height:5px;width:90%;background:#bfd6d5;border-radius:4px}.ap-ui-sidebar span:first-child{width:40%;height:17px;background:#6cb8b3}
.ap-ui-main{padding:14px 23px}.ap-ui-top{font-size:9px;letter-spacing:.12em;display:flex;justify-content:space-between;align-items:center}.ap-ui-top small{font-size:7px;color:#288b81}.ap-ui-chart{height:52%;display:flex;align-items:end;gap:5%;border-bottom:1px solid #cadbdb;margin-top:20px}.ap-ui-chart i{width:9%;background:#6bbdb6;border-radius:3px 3px 0 0}.ap-ui-chart i:nth-child(1){height:31%}.ap-ui-chart i:nth-child(2){height:52%}.ap-ui-chart i:nth-child(3){height:42%}.ap-ui-chart i:nth-child(4){height:67%}.ap-ui-chart i:nth-child(5){height:49%}.ap-ui-chart i:nth-child(6){height:87%}.ap-ui-chart i:nth-child(7){height:74%}.ap-ui-chips{display:flex;gap:8px;margin-top:16px}.ap-ui-chips b{display:block;width:22%;height:17px;background:#e4f0f0;border-radius:4px}
.ap-case-visual--wellness{background:#d8d0c3;color:#4a4036;padding:clamp(28px,3vw,48px);display:flex;flex-direction:column;justify-content:space-between}
.ap-well-top{font-family:Georgia,serif}.ap-well-top span:first-child{font-size:40px;letter-spacing:-.085em}.ap-well-top span:last-child{font-family:Arial,sans-serif;letter-spacing:.16em}
.ap-well-orb{position:absolute;width:75%;aspect-ratio:1;left:18%;top:0;border-radius:50%;background:radial-gradient(circle at 35% 33%,#f6efe0 1%,#d6c7ae 55%,#b6aa97 100%);box-shadow:inset 15px -30px 80px rgba(76,64,46,.09),0 27px 60px rgba(75,59,40,.09)}
.ap-well-leaf{position:absolute;background:linear-gradient(120deg,#74816e 0%,#a2a789 50%,#596956 100%);border-radius:100% 3% 100% 3%;box-shadow:8px 9px 25px rgba(50,62,41,.12);transform-origin:bottom right}.leaf-1{width:27%;height:49%;left:45%;top:18%;transform:rotate(-42deg)}.leaf-2{width:22%;height:43%;left:28%;top:28%;transform:rotate(-82deg)}.leaf-3{width:21%;height:34%;left:50%;top:34%;transform:rotate(15deg)}.ap-well-stem{position:absolute;width:2px;height:70%;left:43%;top:28%;background:#60705c;transform:rotate(23deg)}
.ap-well-bottom{position:relative;z-index:2}.ap-well-bottom small{display:block;font:600 10px Arial,sans-serif;letter-spacing:.18em;margin-bottom:15px}.ap-well-bottom strong{font:400 clamp(40px,4vw,64px)/.95 Georgia,serif;letter-spacing:-.05em}
.ap-portfolio-note{margin:53px 0 0;font-size:12px;color:#7b7266;line-height:1.7}

/* PROCESSO — cronologia simples com divisões, sem caixas repetidas. */
.ap-processo{position:relative;overflow:hidden;background:#191817;color:#f6f1eb;padding:clamp(100px,11vw,165px) 0}
.ap-processo:before{content:"";position:absolute;right:-6%;bottom:-55%;width:57vw;height:65vw;max-height:800px;border:1px solid rgba(196,162,122,.16);transform:rotate(-22deg);pointer-events:none}
.ap-process-heading{display:flex;align-items:end;justify-content:space-between;gap:45px;margin-bottom:clamp(62px,7vw,112px)}
.ap-process-heading h2,.ap-principios h2,.ap-faq h2{font-size:clamp(40px,5.2vw,76px);line-height:1.08;letter-spacing:-.055em;margin:0;font-weight:620}
.ap-process-heading h2 em{font-style:normal;color:#d0af88}
.ap-process-heading>p{max-width:365px;color:#bcb4a9;line-height:1.75;font-size:16px;margin:0 0 7px}
.ap-process-list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:0;border-top:1px solid #6c5d4e;gap:0}
.ap-process-list li{padding:34px 24px 0 0;margin:0;border-right:1px solid rgba(174,149,119,.18);min-height:245px}
.ap-process-list li:not(:first-child){padding-left:24px}
.ap-process-list li:last-child{border-right:0}
.ap-step-number{color:#cfaf8b;font-size:12px;letter-spacing:.12em;font-weight:700}
.ap-process-list h3{font-size:clamp(24px,2.35vw,34px);letter-spacing:-.04em;margin:47px 0 12px;font-weight:600}
.ap-process-list p{font-size:14px;color:#bdb5ac;line-height:1.75;max-width:260px;margin:0}

/* PRINCÍPIOS — área clara editorial, boa pausa visual. */
.ap-principios{color:#26211c;background:#f8f6f1;padding:clamp(100px,10vw,155px) 0}
.ap-principios-inner{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(290px,.7fr);gap:clamp(50px,10vw,145px)}
.ap-principios h2 em,.ap-faq h2 em{font-style:normal;color:#a3825d}
.ap-principios-list{border-top:1px solid #bcb1a5;margin-top:70px}
.ap-principios-list div{padding:24px 0 26px;border-bottom:1px solid #cbc2b6}
.ap-principios-list span{font-size:11px;font-weight:700;letter-spacing:.16em;color:#997955}
.ap-principios-list p{margin:13px 0 0;color:#514c45;font-size:16px;line-height:1.6}

/* FAQ — interação nativa de details/summary, acessível sem JS. */
.ap-faq{padding:clamp(90px,11vw,155px) 0;color:#28231e;background:#e9e3da}
.ap-faq-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(48px,9vw,125px)}
.ap-faq-intro{max-width:330px;color:#6e645a;line-height:1.7;font-size:16px;margin:28px 0 0}
.ap-faq-items{border-top:1px solid #b2a699}
.ap-faq-items details{border-bottom:1px solid #b2a699}
.ap-faq-items summary{font-weight:620;font-size:clamp(17px,1.35vw,20px);letter-spacing:-.018em;line-height:1.4;padding:28px 4px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:22px;list-style:none}
.ap-faq-items summary::-webkit-details-marker{display:none}
.ap-faq-items summary .v37-faq-toggle{color:#987954;font-weight:300;line-height:1;transition:transform .2s ease}
.ap-faq-items details[open] summary .v37-faq-toggle{transform:rotate(45deg)}
.ap-faq-items details p{max-width:570px;margin:-3px 0 28px 4px;color:#625a51;font-size:15px;line-height:1.75}

/* CONTATO — dois canais; a prévia WhatsApp não realiza envio automático. */
.ap-contact{background:radial-gradient(ellipse 55% 80% at -8% 70%,rgba(188,140,92,.16),transparent 80%),linear-gradient(110deg,#24211e,#141312 72%)}
.ap-contact .contato-grade{gap:clamp(60px,9vw,150px)}
.ap-contact .contato-chamada h2{font-size:clamp(42px,4.6vw,69px)}
.ap-contact .contato-chamada>p:not(.sobretitulo){margin-top:26px}
.ap-contact-mark{display:flex;gap:14px;color:rgba(213,181,142,.28);font-size:clamp(33px,5vw,60px);letter-spacing:-.055em;font-weight:600;margin:58px 0}
.ap-contact-mark span:last-child{font-weight:300;letter-spacing:.18em;font-size:.36em;align-self:center}
.ap-form-heading{border-bottom:1px solid rgba(203,173,141,.22);padding-bottom:25px;margin-bottom:29px}
.ap-form-heading>span{color:#c9a886;font-size:10px;letter-spacing:.16em;font-weight:700}
.ap-form-heading h3{font-size:clamp(26px,2.3vw,34px);margin:14px 0 0;letter-spacing:-.045em;font-weight:600}
.ap-contact .briefing{padding:clamp(28px,3.5vw,52px);border-color:#605243;background:linear-gradient(145deg,#2b2824,#22201e)}
.ap-contact .campo{gap:10px;margin-bottom:23px}
.ap-contact .campo textarea{min-height:115px}
.ap-contact .botao-form{margin-top:11px}

/* FOOTER — navegação útil, marca sempre com o arquivo PNG oficial. */
.ap-footer{background:#100f0e;border-top:1px solid #4a3c2f}
.ap-footer-inner{display:block;padding-top:70px;padding-bottom:30px}
.ap-footer-brand{display:flex;gap:12px;align-items:center}
.ap-footer-brand img{width:72px;height:84px;object-fit:contain}
.ap-footer-brand strong{font-size:19px;letter-spacing:.04em;color:#e2ccac}
.ap-footer-brand p{margin:7px 0 0;color:#a99c8d;font-size:13px}
.ap-footer-links{display:flex;flex-wrap:wrap;gap:15px 35px;padding:38px 0 53px;border-bottom:1px solid #40362e}
.ap-footer-links a{color:#dfd5c6;text-decoration:none;font-size:14px}
.ap-footer-links a:hover,.ap-footer-bottom a:hover{color:#e5c29a}
.ap-footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:23px;font-size:12px;color:#a99b8b}
.ap-footer-bottom a{text-decoration:none}

/* TELAS MÉDIAS — respiro vertical é mais importante que manter colunas. */
@media(max-width:1080px){
 .ap-process-list li{padding-right:14px}.ap-process-list li:not(:first-child){padding-left:14px}
 .ap-process-list h3{margin-top:34px}
 .ap-case-pair{gap:28px}
 .ap-case-info{flex-wrap:wrap}
}
@media(max-width:740px){
 .ap-sectionhead,.ap-principios-inner,.ap-faq-grid{grid-template-columns:1fr;gap:35px}
 .ap-sectionhead--services{margin-bottom:65px}
 .ap-section-aside{justify-self:start;max-width:550px}

 .ap-service-row{grid-template-columns:1fr 26px;gap:10px 12px;padding:30px 0}
 .ap-service-index{grid-column:1/-1}
 .ap-service-symbol{align-self:start}
 .ap-manifesto-meta span:last-child{display:none}
 .ap-manifesto h2{font-size:clamp(47px,10.3vw,78px)}
 .ap-manifesto-spark{font-size:48px}
 .ap-case-visual--arch{height:460px}
 .ap-arch-nav span:nth-child(2){display:none}
 .ap-arch-caption strong{font-size:clamp(48px,9vw,72px)}
 .ap-case-pair{grid-template-columns:1fr;gap:74px;margin-top:74px}
 .ap-case-pair .ap-case-visual{height:460px}
 .ap-case-info{align-items:start}
 .ap-case-open{white-space:normal}
 .ap-process-heading{display:block}
 .ap-process-heading>p{margin-top:27px}
 .ap-process-list{grid-template-columns:1fr 1fr}
 .ap-process-list li{min-height:240px;border-bottom:1px solid rgba(174,149,119,.18)}
 .ap-process-list li:nth-child(even){border-right:0}
 .ap-process-list li:nth-child(3){padding-left:0}
 .ap-principios-list{margin-top:18px}
 .ap-faq-grid{gap:45px}
 .ap-contact-mark{display:none}
 .ap-footer-inner{padding-top:48px}
}
@media(max-width:420px){
 .ap-arch-caption strong{font-size:47px}
 .ap-arch-nav{font-size:10px}
 .ap-process-list{grid-template-columns:1fr}
 .ap-process-list li,.ap-process-list li:not(:first-child){padding:25px 0;border-right:0;min-height:auto}
 .ap-process-list h3{margin-top:19px}
 .ap-process-list p{max-width:95%}
 .ap-case-pair .ap-case-visual{height:400px}
 .ap-footer-bottom{flex-direction:column}
 .ap-product-copy{margin-top:65px}
 .ap-product-ui{height:50%}
}
@media(prefers-reduced-motion:reduce){
 .ap-faq-items summary span{transition:none}
}

/* AJUSTE 1650 × 818 e equivalentes: o Hero cabe na altura útil do Chrome.
   Mantemos textos e logotipo originais; só modulamos o espaço vertical. */
@media (min-width: 741px) and (min-height: 761px) and (max-height: 900px) {
    .hero {
        min-height: calc(100svh - 91px);
        padding-top: clamp(18px, 4svh, 46px);
        padding-bottom: clamp(32px, 5svh, 54px);
    }
    .hero-logo {
        width: auto;
        max-width: 100%;
        max-height: min(67svh, 558px);
    }
}


/* ================================================================
   ARBEX STUDIO — V3.1 | SISTEMA DE MICROINTERAÇÕES
   A ideia é sinalizar uma ação, nunca disputar atenção com a marca.
   Os elementos estáticos não simulam ser clicáveis.
   Os movimentos mais visíveis só aparecem em mouse/trackpad.
   ================================================================ */

/* A imagem dos projetos agora é um link real, também acessível pelo teclado. */
.ap-case-visual {
    text-decoration: none;
    cursor: pointer;
}
.ap-case-visual--arch { display: block; }
.ap-case-visual:focus-visible {
    outline: 3px solid #caa47a;
    outline-offset: -5px;
}

/* Delimita o comportamento dos elementos de ação em qualquer dispositivo. */
.botao,
.link-secundario,
.ap-textlink,
.ap-case-open,
.ap-portfolio-note a,
.ap-footer-links a,
.ap-footer-bottom a,
.cabecalho-nav a,
.marca-cabecalho {
    transition: color .26s ease, background-color .26s ease, transform .34s cubic-bezier(.22,1,.36,1);
}

/* Feedback imediato, sem reposicionar permanentemente o layout. */
.botao:active { transform: translateY(0) scale(.99); }
.botao span[aria-hidden="true"],
.link-secundario span[aria-hidden="true"],
.ap-case-open span[aria-hidden="true"],
.ap-textlink span[aria-hidden="true"] {
    display: inline-block;
    transition: transform .36s cubic-bezier(.22,1,.36,1);
}

/* Formulário: foco nítido é mais importante que efeitos decorativos. */
.ap-contact .campo :is(input, select, textarea):focus-visible {
    outline-color: #dfbd95;
    border-color: #c5a17b;
}

/* FAQ: realça somente o título em que a pessoa interage. */
.ap-faq-items summary {
    transition: color .24s ease, background-color .24s ease;
}
.ap-faq-items summary:focus-visible {
    outline: 3px solid #ae845d;
    outline-offset: -3px;
}

/* Menu móvel: as três linhas formam um X quando aberto. */
.menu-toggle span {
    transition: transform .28s cubic-bezier(.22,1,.36,1), opacity .2s ease;
}
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-7px) rotate(-45deg); }

/* O efeito hover só é ativado em dispositivos com cursor preciso. */
@media (hover: hover) and (pointer: fine) {
    /* Links do menu: traço champagne avança sob o texto. */
    .cabecalho-nav a,
    .ap-footer-links a { position: relative; }
    .cabecalho-nav a::after,
    .ap-footer-links a::after {
        content: "";
        position: absolute;
        height: 1px;
        background: #d0ab7f;
        bottom: -7px;
        left: 0;
        right: 0;
        transform-origin: left;
        transform: scaleX(0);
        transition: transform .35s cubic-bezier(.22,1,.36,1);
    }
    .cabecalho-nav a:hover::after,
    .cabecalho-nav a:focus-visible::after,
    .ap-footer-links a:hover::after,
    .ap-footer-links a:focus-visible::after { transform: scaleX(1); }

    /* Botões: pequena elevação e seta acompanhando a ação. */
    .botao:hover { transform: translateY(-2px); }
    .botao:hover span[aria-hidden="true"] { transform: translate(3px,-2px); }
    .link-secundario:hover span[aria-hidden="true"],
    .ap-textlink:hover span[aria-hidden="true"],
    .ap-case-open:hover span[aria-hidden="true"] { transform: translate(4px,-2px); }
    .ap-case:hover .ap-case-open span[aria-hidden="true"] { transform: translate(4px,-2px); }

    /* Painéis do portfólio: três movimentos distintos, com o mesmo ritmo. */
    .ap-arch-structure {
        transform-origin: center center;
        transition: transform .82s cubic-bezier(.22,1,.36,1);
    }
    .ap-case-visual--arch:hover .ap-arch-structure,
    .ap-case-visual--arch:focus-visible .ap-arch-structure {
        transform: scale(1.035);
    }
    .ap-product-ui {
        transition: transform .72s cubic-bezier(.22,1,.36,1);
    }
    .ap-case-visual--product:hover .ap-product-ui,
    .ap-case-visual--product:focus-visible .ap-product-ui {
        transform: rotate(-6deg) translateY(-10px) scale(1.025);
    }
    .ap-well-orb {
        transition: transform .86s cubic-bezier(.22,1,.36,1);
    }
    .ap-case-visual--wellness:hover .ap-well-orb,
    .ap-case-visual--wellness:focus-visible .ap-well-orb {
        transform: translateY(-8px) scale(1.03);
    }

    /* Convite discreto somente quando o visual é um link sob o cursor. */
    .ap-case-visual::after {
        content: "ABRIR CONCEITO ↗";
        position: absolute;
        z-index: 10;
        right: 22px;
        bottom: 22px;
        padding: 11px 13px;
        background: rgba(23,22,20,.88);
        color: #f5e2c7;
        border: 1px solid rgba(224,195,158,.45);
        font: 600 10px/1.2 "Segoe UI", Arial, sans-serif;
        letter-spacing: .10em;
        pointer-events: none;
        opacity: 0;
        transform: translateY(9px);
        transition: opacity .35s ease, transform .42s cubic-bezier(.22,1,.36,1);
    }
    .ap-case-visual:hover::after,
    .ap-case-visual:focus-visible::after {
        opacity: 1;
        transform: translateY(0);
    }
    .ap-faq-items summary:hover { color: #8b613d; }
    .ap-faq-items summary:hover .v37-faq-toggle { transform: rotate(0deg); }
    .ap-faq-items details[open] summary:hover .v37-faq-toggle { transform: rotate(45deg); }
}

/* Teclado: o link mantém indicação inequívoca mesmo sem mouse. */
.ap-case-visual:focus-visible,
.ap-case-open:focus-visible,
.ap-textlink:focus-visible { border-radius: 2px; }

/* Celulares não têm hover persistente: evitamos zooms involuntários. */
@media (hover: none), (pointer: coarse) {
    .ap-case-visual::after { display: none; }
}

/* A preferência do visitante tem prioridade sobre a direção artística. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    .ap-case-visual--arch:hover .ap-arch-structure { transform: none; }
    .ap-case-visual--product:hover .ap-product-ui { transform: rotate(-6deg); }
    .ap-case-visual--wellness:hover .ap-well-orb { transform: none; }
    .botao:hover { transform: none; }
}


/* ============================================================
   ARBEX STUDIO V3.7 — ACABAMENTO EDITORIAL
   Somente Diferenciais e FAQ. Hero, logos e portfólio intactos.
   Acessibilidade: elementos clicáveis usam HTML nativo; o efeito
   de hover não é necessário para entender as informações.
   ============================================================ */

/* DIFERENCIAIS: superfície mineral à esquerda e quadro técnico contínuo.
   Não criamos três cartões iguais: a leitura acontece em um só painel. */
.v37-principios {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(95px, 9vw, 145px) 0;
    background:
        radial-gradient(ellipse 58% 66% at 2% 88%, rgba(172,136,95,.105), transparent 80%),
        linear-gradient(120deg, #f7f5f0 0%, #f5f1eb 58%, #efeae2 100%);
}
.v37-principios::before {
    content: "";
    position: absolute;
    width: min(33vw, 480px); height: min(33vw, 480px);
    left: -17vw; bottom: -22%; transform: rotate(-18deg);
    border: 1px solid rgba(156,117,76,.12);
    box-shadow: 18px 18px 0 rgba(156,117,76,.027);
    pointer-events: none;
    z-index: -1;
}
.v37-principios-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
    gap: clamp(60px, 8vw, 135px);
    align-items: center;
}
.v37-principios-editorial { min-width: 0; }
.v37-principios .sobretitulo { margin-bottom: clamp(30px, 4vw, 56px); }
.v37-principios h2 {
    max-width: 680px;
    font-size: clamp(43px, 4.85vw, 70px);
    line-height: 1.075;
    letter-spacing: -.055em;
}
.v37-principios h2 em { color: #aa8762; }
.v37-principios-lead {
    color: #5b534b;
    max-width: 445px;
    margin: 30px 0 0;
    font-size: clamp(16px, 1.17vw, 18px);
    line-height: 1.77;
}
.v37-editorial-signature {
    display: inline-flex; align-items: center; gap: 16px;
    margin-top: clamp(50px, 5vw, 80px);
    font-size: 10px; font-weight: 700; letter-spacing: .18em;
    color: #866d54;
}
.v37-editorial-signature i { width: 28px; height: 1px; background: #b59c82; }
.v37-quality-panel {
    position: relative;
    overflow: hidden;
    padding: clamp(27px, 3vw, 43px);
    border: 1px solid rgba(222,190,151,.34);
    color: #eee5d8;
    background:
       radial-gradient(ellipse 90% 80% at 100% 0%, rgba(186,142,95,.17), transparent 74%),
       linear-gradient(145deg, #292724, #191817 75%);
    box-shadow: 0 25px 52px -38px rgba(29,25,21,.42), inset 0 1px rgba(255,255,255,.035);
}
.v37-quality-panel::before {
    content: ""; position: absolute; width: 200px; height: 200px;
    right: -114px; top: 60px; border: 1px solid rgba(209,174,132,.12);
    transform: rotate(35deg); pointer-events: none;
}
.v37-quality-header, .v37-quality-foot {
    display: flex; justify-content: space-between; align-items: center; gap: 15px;
    font-size: 10px; font-weight: 650; letter-spacing: .16em;
    color: #cdb08c;
}
.v37-quality-header { padding-bottom: 26px; border-bottom: 1px solid rgba(219,185,144,.25); }
.v37-quality-item {
    display: grid; grid-template-columns: 38px minmax(0,1fr) 22px;
    gap: clamp(13px, 1.7vw, 23px);
    align-items: start; padding: clamp(24px, 2.5vw, 36px) 0;
    border-bottom: 1px solid rgba(219,185,144,.18);
    transition: background .35s ease, padding .35s ease;
}
.v37-quality-index { color: #bda07b; font-size: 11px; letter-spacing: .12em; padding-top: 6px; }
.v37-quality-item h3 { margin: 0 0 9px; font-size: clamp(21px, 1.65vw, 25px); font-weight: 550; letter-spacing: -.03em; }
.v37-quality-item p { max-width: 350px; margin: 0; color: #bcb5ad; font-size: 14px; line-height: 1.68; }
.v37-quality-mark { font-size: 20px; color: #bda07b; font-weight: 300; opacity: .65; }
.v37-quality-foot { padding-top: 27px; color: #a99780; font-size: 9px; }
.v37-quality-signal { display: inline-flex; align-items: center; gap: 5px; }
.v37-quality-signal i { width: 24px; height: 2px; background: rgba(204,171,131,.43); }
.v37-quality-signal i:first-child { background: #d2b38d; }

/* FAQ: uma única folha editorial; seleção discreta no detalhe aberto. */
.v37-faq {
    padding: clamp(98px, 9vw, 155px) 0;
    background:
       radial-gradient(ellipse 46% 60% at 100% 100%, rgba(164,128,84,.08), transparent 85%),
       #eae4da;
}
.v37-faq-grid {
    display: grid;
    grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr);
    gap: clamp(60px, 9vw, 145px);
    align-items: start;
}
.v37-faq-intro { padding-top: clamp(6px, 2vw, 30px); }
.v37-faq h2 { font-size: clamp(42px, 4.8vw, 68px); line-height: 1.08; }
.v37-faq .ap-faq-intro { max-width: 405px; margin-top: 29px; color: #62584d; }
.v37-faq-aside { margin-top: clamp(48px, 6vw, 85px); padding-left: 22px; border-left: 2px solid #ac8e6b; }
.v37-faq-aside > span { display: block; margin-bottom: 12px; color: #917355; font-size: 10px; letter-spacing: .16em; font-weight: 700; }
.v37-faq-aside a { display: inline-flex; align-items: center; gap: 24px; padding-bottom: 7px; border-bottom: 1px solid #947455; color: #312a23; font-size: 15px; font-weight: 600; text-decoration: none; }
.v37-faq-aside a span { transition: transform .28s ease; }
.v37-faq-panel {
    min-width: 0; padding: clamp(20px, 2.7vw, 42px);
    background: #f8f5ef;
    border: 1px solid rgba(151,125,95,.24);
    box-shadow: 0 20px 55px -48px rgba(61,45,30,.29);
}
.v37-faq-panel-head {
    display:flex; justify-content: space-between; gap: 16px;
    padding: 0 0 25px; border-bottom: 1px solid #bcb0a3;
    font-size: 10px; font-weight: 700; letter-spacing: .17em; color: #907357;
}
.v37-faq-items { border-top: 0; }
.v37-faq-items details { border-bottom: 1px solid #d9cec2; transition: background .22s ease; }
.v37-faq-items details[open] { background: #eee7dc; }
.v37-faq-items summary {
    display:grid; grid-template-columns: 26px minmax(0,1fr) 33px;
    align-items: center; gap: 15px;
    padding: clamp(21px, 2.1vw, 30px) 8px;
    font-size: clamp(16px, 1.15vw, 18px);
    line-height: 1.4; font-weight: 600;
}
.v37-faq-num { color:#a68a69; font-size:11px; letter-spacing:.07em; font-weight:700; }
.v37-faq-question { color:#28241f; }
.v37-faq-toggle {
    display: grid; place-items:center; width:33px; height:33px;
    font-size: 25px !important; font-weight: 300;
    border: 1px solid #cdbdaa; border-radius: 50%;
    color: #886d50 !important;
    transform-origin: center center;
}
.v37-faq-items details[open] .v37-faq-toggle { transform: rotate(45deg); border-color: #a38868; }
.v37-faq-items details p { max-width: 500px; margin: -5px 42px 26px 49px; color: #5e554c; font-size: 15px; }
.v37-faq-panel-foot { margin-top: 23px; font-size: 11px; letter-spacing: .07em; color: #8a7c6a; }
@media (hover:hover) and (pointer:fine) {
    .v37-quality-item:hover { background: rgba(214,181,141,.045); }
    .v37-faq-items details:not([open]):hover { background: #f1ece4; }
    .v37-faq-aside a:hover span { transform: translate(3px,-2px); }
}
@media (max-width: 1050px) {
    .v37-principios-grid { gap: clamp(32px,5vw,65px); }
    .v37-principios h2 { font-size: clamp(42px,4.7vw,60px); }
    .v37-faq-grid { gap: clamp(30px,5vw,65px); }
}
@media (max-width: 780px) {
    .v37-principios-grid, .v37-faq-grid { grid-template-columns: 1fr; gap: 45px; }
    .v37-principios h2 { font-size: clamp(40px,7.7vw,65px); }
    .v37-quality-panel { max-width: 650px; }
    .v37-editorial-signature, .v37-faq-aside { margin-top: 35px; }
    .v37-faq-panel { max-width: 700px; }
}
@media (max-width: 420px) {
    .v37-principios .sobretitulo { line-height: 1.8; }
    .v37-principios h2 { font-size: 40px; }
    .v37-editorial-signature { gap: 9px; font-size: 8px; }
    .v37-editorial-signature i { width: 15px; }
    .v37-quality-item { grid-template-columns: 23px minmax(0,1fr) 15px; gap: 11px; }
    .v37-quality-item h3 { font-size: 22px; }
    .v37-faq-panel { padding: 18px 14px; }
    .v37-faq-panel-head { font-size: 9px; }
    .v37-faq-items summary { grid-template-columns: 21px minmax(0,1fr) 30px; gap: 9px; padding: 22px 2px; }
    .v37-faq-toggle { width: 29px; height: 29px; }
    .v37-faq-items details p { margin: -3px 8px 20px 30px; }
}

/* A versão anterior tinha uma regra genérica para todos os spans do FAQ.
   Aqui o número, a pergunta e o ícone recebem hierarquias separadas. */
.v37-faq .v37-faq-items summary .v37-faq-num {
    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: .06em;
    color: #a68a69;
    transform: none;
}
.v37-faq .v37-faq-items summary .v37-faq-question {
    font-size: clamp(16px, 1.15vw, 18px);
    line-height: 1.45;
    font-weight: 620;
    letter-spacing: -.015em;
    color: #28241f;
    transform: none;
}
.v37-faq .v37-faq-items summary:hover .v37-faq-num,
.v37-faq .v37-faq-items summary:hover .v37-faq-question,
.v37-faq .v37-faq-items details[open] summary:hover .v37-faq-num,
.v37-faq .v37-faq-items details[open] summary:hover .v37-faq-question {
    transform: none;
}


/* ===== V3.8 | CORREÇÕES AUDITADAS =====
   Mantém o Hero original. Não introduz bibliotecas ou animações contínuas. */

/* O rodapé informativo do portfólio nunca pode cruzar trilhas ornamentais.
   Removemos o grafismo dessa área em vez de colocar elementos sobre texto. */
.secao-portfolio::before { display: none !important; }
.cur-portfolio-footer { position:relative; isolation:isolate; z-index:2; }

/* Números: somente os quatro passos do processo continuam numerados. */
.ap-service-row { grid-template-columns:minmax(120px,.25fr) minmax(0,1fr); }
.v37-quality-item { grid-template-columns:minmax(0,1fr); padding:27px 0; }
.cur-case-copy, .cur-pair .cur-case-copy { grid-template-columns:minmax(0,1fr) auto; }
.cur-pair .cur-explore, .cur-case-copy>.cur-explore { grid-column:auto; }
.cur-pair .cur-case-copy { grid-template-columns:minmax(0,1fr); }
.cur-pair .cur-explore { grid-column:1; justify-self:start; }
.v37-quality-header { justify-content:flex-start; }

/* FAQ: remove a herança de animações aplicada indevidamente a spans textuais. */
.v37-faq .ap-faq-items summary {
  display:grid; grid-template-columns:minmax(0,1fr) 30px;
  column-gap:18px; align-items:center;
  text-align:left; padding:25px 8px;
  font-size:17px; font-weight:580;
}
.v37-faq .ap-faq-items summary .v37-faq-question {
  display:block; font-size:clamp(16px,1.2vw,18px);
  font-weight:580; line-height:1.5; letter-spacing:-.015em;
  color:#29241f; transform:none !important;
  transition:color .2s ease;
}
.v37-faq .ap-faq-items summary .v37-faq-toggle {
  display:grid; place-items:center; border:1px solid #c6b8a7;
  color:#806649 !important; width:30px; height:30px;
  font-size:19px !important; font-weight:300; line-height:1;
  transform:rotate(0deg); transition:transform .22s ease,border-color .22s ease;
}
.v37-faq .ap-faq-items details[open] summary .v37-faq-toggle { transform:rotate(45deg); }
.v37-faq .ap-faq-items details summary:hover .v37-faq-question { color:#745d45; transform:none; }
.v37-faq .ap-faq-items details summary:hover .v37-faq-toggle { transform:none; }
.v37-faq .ap-faq-items details[open] summary:hover .v37-faq-toggle { transform:rotate(45deg); }
.v37-faq .ap-faq-items details p { margin:0 44px 25px 8px; max-width:570px; line-height:1.75; font-size:15px; }
.v37-faq-panel-head { justify-content:flex-start; padding-bottom:16px; }
.v37-faq-grid { align-items:start; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(42px,5vw,85px); }
.v37-faq-panel { padding:clamp(25px,3vw,42px); background:#f6f1e9; }
.v37-faq-aside { margin-top:45px; }

/* Mais presença em áreas claras sem símbolos decorativos repetidos. */
.v37-principios {
  padding:clamp(84px,8.5vw,125px) 0;
  background:radial-gradient(ellipse 50% 75% at 4% 65%, rgba(182,143,98,.12), transparent 75%),
             linear-gradient(118deg,#f8f5ee 0%,#f5f1ea 50%,#eee7dd 100%);
}
.v37-principios::before { display:none; }
.v37-faq {
  padding:clamp(82px,8vw,120px) 0;
  background:radial-gradient(ellipse 50% 90% at 95% 100%,rgba(163,126,82,.13),transparent 78%),
             linear-gradient(125deg,#eee8df,#e8e1d7 62%,#e2d9ce);
}
/* Corrige impressão de bloco vazio em telas muito largas com uma borda sutil. */
.v37-principios-grid, .v37-faq-grid { position:relative; }
.v37-principios-grid::after { content:''; position:absolute; left:0; top:-35px; width:64px; height:1px; background:#bea78c; }

@media(max-width:1050px){
  .v37-faq-grid{ grid-template-columns:1fr; gap:38px; }
  .v37-faq-intro{ max-width:700px; }
  .v37-faq-aside{ margin-top:25px; }
  .v37-faq-panel{ max-width:none; }
}
@media(max-width:740px){
  .ap-service-row{grid-template-columns:minmax(0,1fr);gap:9px;}
  .cur-case-copy,.cur-pair .cur-case-copy{grid-template-columns:minmax(0,1fr);}
  .cur-case-copy>.cur-explore,.cur-pair .cur-explore{grid-column:1; justify-self:start;}
}
@media(max-width:420px){
  .v37-faq .ap-faq-items summary{grid-template-columns:minmax(0,1fr) 29px;gap:12px;padding:20px 0;}
  .v37-faq .ap-faq-items details p{margin:0 8px 20px 0;}
}
@media(prefers-reduced-motion:reduce){
  .v37-faq .ap-faq-items summary .v37-faq-toggle{transition:none;}
}

/* ===== V3.9 | REFINO DE ÂNCORA VISUAL E HIERARQUIA ===== */
/* Hero: o logotipo continua intocado, mas ganha base visual e profundidade. */
.hero-identidade {
    position: relative;
    isolation: isolate;
    min-height: min(58vw, 660px);
    padding: clamp(18px, 2vw, 34px);
}
.hero-identidade::before {
    content: "";
    position: absolute;
    inset: 15% 18% 17%;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(circle at 50% 38%, rgba(240, 214, 177, .28), rgba(240, 214, 177, .09) 25%, rgba(240, 214, 177, 0) 64%);
    filter: blur(24px);
    opacity: .82;
}
.hero-logo-stage {
    position: absolute;
    inset: 7% 7% 9%;
    z-index: -2;
    border-radius: 36px;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255,255,255,.014), rgba(255,255,255,0) 26%),
        radial-gradient(circle at 50% 35%, rgba(240, 214, 177, .12), rgba(240, 214, 177, .035) 26%, rgba(240, 214, 177, 0) 60%),
        linear-gradient(145deg, rgba(22, 20, 19, .44), rgba(12, 11, 10, .18) 36%, rgba(7, 7, 7, .4) 100%);
    border: 1px solid rgba(208, 172, 130, .08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 32px 75px -58px rgba(0, 0, 0, .72);
}
.hero-logo-shadow {
    position: absolute;
    left: 50%;
    bottom: 11%;
    width: min(82%, 430px);
    height: clamp(24px, 3.5vw, 42px);
    transform: translateX(-50%);
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, .56) 0%, rgba(0, 0, 0, .22) 36%, rgba(0, 0, 0, 0) 74%);
    filter: blur(12px);
    opacity: .9;
}
.hero-logo {
    position: relative;
    z-index: 1;
    width: min(100%, 500px);
}

/* Manifesto: os subtítulos deixam de "flutuar" e passam a introduzir a seção. */
.ap-manifesto-inner { max-width: 1180px; }
.ap-manifesto-meta {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 14px 18px;
    color: #cfaf88;
    font-size: 11px;
    letter-spacing: .18em;
    font-weight: 650;
}
.ap-manifesto-eyebrow, .ap-manifesto-tag { white-space: nowrap; }
.ap-manifesto-divider {
    width: clamp(28px, 3vw, 54px);
    height: 1px;
    background: rgba(207, 175, 136, .55);
}
.ap-manifesto h2 {
    margin: clamp(30px, 4.5vw, 56px) 0 clamp(38px, 5.5vw, 76px);
    max-width: 1080px;
}
.ap-manifesto-foot {
    align-items: flex-start;
    gap: 28px;
}
.ap-manifesto-note {
    flex: 0 0 auto;
    align-self: center;
    color: #cfaf88;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    white-space: nowrap;
}
.ap-manifesto-spark { display: none; }

@media (max-width: 1024px) {
    .hero-identidade { min-height: min(72vw, 620px); }
    .hero-logo-stage { inset: 10% 8% 11%; }
}
@media (max-width: 780px) {
    .hero-identidade {
        min-height: auto;
        padding: 12px 0 26px;
    }
    .hero-logo-stage { inset: 8% 8% 8%; border-radius: 28px; }
    .hero-logo-shadow { bottom: 8%; width: min(78%, 320px); }
    .ap-manifesto-meta {
        gap: 11px 14px;
    }
    .ap-manifesto-note {
        white-space: normal;
        line-height: 1.6;
    }
}
@media (max-width: 560px) {
    .ap-manifesto-foot {
        flex-direction: column;
        align-items: flex-start;
    }
    .ap-manifesto-divider { width: 24px; }
    .ap-manifesto-tag { letter-spacing: .14em; }
}


/* ============================================================
   V3.13 — REFLEXO DE LUZ DO HERO (REFERÊNCIA APROVADA)
   Ajuste SOMENTE de iluminação. PNG original 100% preservado.
   ============================================================ */

/* Atmosfera sem disco: camada larga, irregular e de transição gradual. */
.hero-logo-stage {
    inset: 5% 2% 6%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background:
        radial-gradient(ellipse 76% 61% at 48% 49%,
            rgba(42, 33, 27, .30) 0%,
            rgba(40, 31, 25, .14) 35%,
            rgba(30, 25, 22, .035) 65%,
            transparent 91%),
        radial-gradient(ellipse 48% 34% at 55% 38%,
            rgba(228, 194, 151, .043),
            transparent 85%);
    filter: blur(32px);
    opacity: .86;
}
.hero-identidade::before {
    inset: 5% 0% 9%;
    background:
        radial-gradient(ellipse 88% 55% at 50% 50%,
            rgba(223, 179, 127, .075) 0%,
            rgba(223, 179, 127, .033) 37%,
            transparent 84%),
        linear-gradient(90deg, transparent 8%, rgba(70,51,34,.037) 42%, transparent 93%);
    filter: blur(38px);
    opacity: .86;
}

/* Reflexo encaixado logo abaixo de STUDIO (não no rodapé do quadro).
   A posição usa a área visível da arte original dentro do PNG. */
.hero-logo-shadow {
    position: absolute;
    left: 50%;
    top: 78.6%;
    bottom: auto;
    width: min(78%, 430px);
    height: clamp(28px, 3.7vw, 54px);
    transform: translate(-50%, -20%);
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(ellipse 62% 36% at 50% 34%,
        rgba(252, 222, 173, .62) 0%,
        rgba(239, 190, 123, .35) 30%,
        rgba(196, 133, 78, .12) 59%,
        transparent 94%);
    filter: blur(4px);
    opacity: .96;
}

/* Faixa central luminosa difusa: o detalhe que faltava na V3.12. */
.hero-logo-shadow::before {
    content: "";
    position: absolute;
    left: 25%;
    right: 25%;
    top: 26%;
    height: 3px;
    background: linear-gradient(90deg,
        transparent,
        rgba(236, 191, 129, .18) 25%,
        rgba(245, 203, 145, .54) 43%,
        rgba(255, 237, 204, .98) 50%,
        rgba(245, 203, 145, .54) 57%,
        rgba(236, 191, 129, .18) 75%,
        transparent);
    filter: blur(1px);
    box-shadow: 0 0 13px 2px rgba(231, 179, 117, .22);
}

/* V3.14 — reflexo no chão mais amplo, com dissipação gradual.
   Amplia a projeção sem aumentar o brilho sobre a marca ou desenhar um círculo. */
.hero-logo-shadow::after {
    content: "";
    position: absolute;
    left: -24%;
    top: 32%;
    width: 148%;
    height: clamp(94px, 8.3vw, 142px);
    background:
        radial-gradient(ellipse 80% 46% at 50% 5%,
            rgba(239, 193, 129, .36) 0%,
            rgba(222, 171, 109, .20) 30%,
            rgba(190, 137, 81, .07) 57%,
            transparent 87%),
        radial-gradient(ellipse 70% 65% at 50% 28%,
            rgba(239, 202, 149, .10) 0%,
            transparent 82%);
    clip-path: none;
    filter: blur(18px);
    opacity: .84;
    transform: scaleY(.92);
    transform-origin: center top;
    pointer-events: none;
}

/* 2. SEÇÕES CLARAS: duas trilhas vetoriais independentes.
   Mantidas somente nas bordas, atrás do conteúdo, sem impedir cliques. */
.v37-principios, .v37-faq {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.v37-principios > .container, .v37-faq > .container {
    position: relative;
    z-index: 1;
}
.v37-principios::before {
    content: "";
    display: block; /* A V3.7 havia desativado o pseudoelemento. */
    position: absolute;
    z-index: 0;
    top: 12px;
    right: -35px;
    left: auto; /* Sobrescreve a posição geométrica da V3.7. */
    bottom: auto;
    height: auto;
    transform: none;
    border: 0;
    box-shadow: none;
    width: min(39vw, 550px);
    aspect-ratio: 650 / 164;
    background: url("../assets/img/trilha-clara-superior-v310.svg") center / contain no-repeat;
    opacity: .56;
    pointer-events: none;
}
.v37-faq::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: -20px;
    bottom: 5px;
    width: min(38vw, 520px);
    aspect-ratio: 630 / 155;
    background: url("../assets/img/trilha-clara-inferior-v310.svg") center / contain no-repeat;
    opacity: .47;
    pointer-events: none;
}

/* 3. MANIFESTO: respeita os dois subtítulos também em mobile.
   A regra original na V3.0 ocultava arbitrariamente o último span. */
.ap-manifesto-meta span.ap-manifesto-tag { display: inline; }

@media (max-width: 780px) {
    .hero-logo-stage { inset: 10% 9% 11%; }
    .hero-logo-shadow { top: 78.6%; bottom: auto; }
    .v37-principios::before {
        width: 310px;
        right: -95px;
        top: 9px;
        opacity: .25;
    }
    .v37-faq::after {
        width: 280px;
        left: -105px;
        bottom: 7px;
        opacity: .23;
    }
}


/* V3.23 — Somente novos elementos da área de contato. Hero e seções aprovadas intocados. */
.v323-contact-links { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 30px; }
.v323-contact-links .v323-whatsapp-direct { min-width: min(100%, 300px); }
.v323-contact-alternative { color: #CFC5B8; font-size: 13px; margin-top: 8px; }
.v323-contact-email { color: #E5C9A8; font-size: 15px; line-height: 1.5; text-decoration-thickness: 1px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.v323-contact-email:hover { color: #FADEC0; }
.v323-form-note { color: #CEC5BA; line-height: 1.6; font-size: 14px; margin: -4px 0 26px; }
.v323-briefing-actions { display: flex; flex-direction: column; gap: 12px; margin-top: 15px; }
.v323-briefing-actions .v323-send, .v323-briefing-actions .botao-copiar { width: 100%; margin: 0; }
@media (max-width: 480px) {
    .v323-contact-links .v323-whatsapp-direct { width: 100%; min-width: 0; }
    .v323-form-note { font-size: 14px; }
}


/* V3.24 — Somente campos e ações adicionais da seção Contato. */
.v324-form-actions { display: flex; flex-direction: column; gap: 12px; }
.v324-form-actions .botao { margin: 0; width: 100%; min-height: 52px; text-align: left; }
.v324-email-button { background: transparent; color: #EAD1B2; border: 1px solid #9B8062; }
.v324-email-button:hover { background: #352E27; border-color: #D4B38D; }
.v324-email-button:disabled { opacity: .7; cursor: default; }
.v324-email-note { color: #BEB1A3; font-size: 12px; line-height: 1.6; margin: 15px 0 0; }
.v324-email-campo { margin-top: 2px; }

/* V3.25 — Link discreto para o aviso de privacidade; sem mudanças no layout aprovado. */
.v324-email-note a { color: #E5C9A8; text-decoration: underline; text-underline-offset: 3px; }
.v324-email-note a:hover { color: #FADEC0; }