:root{--bg:#101214;--bg2:#15181a;--bg3:#1b1e20;--panel:#202326;--silver:#c8cdd1;--silver2:#8e959a;--white:#f7f7f7;--muted:#c4c7c9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--white);background:var(--bg);line-height:1.7}img{max-width:100%;display:block}a{text-decoration:none;color:inherit}.header{height:90px;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#0d0f10f5;backdrop-filter:blur(10px);border-bottom:1px solid #ffffff14;box-shadow:0 8px 28px #0005}.brand{height:78px;width:230px;display:flex;align-items:center}.brand img{width:220px;height:68px;object-fit:contain;object-position:left center;filter:drop-shadow(0 5px 10px #0008)}.nav{display:flex;align-items:center;gap:22px;color:#eceeef;font-size:14px}.nav>a:not(.btn){position:relative}.nav>a:not(.btn):after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:1px;background:var(--silver);transition:.25s}.nav>a:not(.btn):hover:after{width:100%}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:28px}.hero{min-height:100vh;padding:145px 7vw 80px;background:#15181a;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:4vw;position:relative;overflow:hidden;border-bottom:1px solid #ffffff12}.hero h1,.section h2,.cta h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;line-height:1.08}.hero h1{font-size:clamp(55px,8vw,112px);margin:10px 0 22px}.lead{font-size:clamp(18px,2vw,24px);max-width:700px;color:#d8dbdd}.eyebrow{font-size:12px;letter-spacing:.24em;color:var(--silver)}.hero-areas{display:flex;gap:12px;margin:30px 0}.hero-areas span{border:1px solid #ffffff30;background:#ffffff05;padding:9px 14px;font-size:13px;border-radius:7px}.hero-mark{display:flex;align-items:center;justify-content:center}.hero-mark img{width:min(100%,720px);max-height:700px;object-fit:contain;filter:drop-shadow(0 22px 36px #0009)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;background:linear-gradient(180deg,#f4f5f6 0%,#c6cbd0 52%,#aeb4b9 100%);color:#151719;border:1px solid #e1e4e6;border-radius:9px;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700;transition:.25s;box-shadow:inset 0 1px 0 #fff,0 8px 20px #0005}.btn:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:inset 0 1px 0 #fff,0 12px 26px #0007}.btn.small{padding:11px 16px}.btn.outline{background:#171a1c;color:#fff;border-color:#9fa5aa;box-shadow:inset 0 0 0 1px #ffffff08}.section{padding:110px 7vw;background:#181b1d;border-top:1px solid #ffffff0c}.section:nth-of-type(even){background:#121416}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}.section h2,.cta h2{font-size:clamp(38px,5vw,66px);margin:8px 0 28px}.section p{color:#d0d3d5}.image-frame{border:1px solid #777e83;padding:9px;background:#202326;box-shadow:0 22px 55px #0007}.image-frame img{width:100%;height:560px;object-fit:cover}.dark-section{background:#0f1112}.section-head{max-width:760px;margin-bottom:50px}.cards{display:grid;gap:28px}.areas{grid-template-columns:1fr 1fr}.area-card{background:#1c1f21;border:1px solid #ffffff18;overflow:hidden;transition:.35s;box-shadow:0 18px 45px #0006;border-radius:5px}.area-card:hover,.person:hover{transform:translateY(-8px);border-color:#aeb4ba66;box-shadow:0 26px 60px #0009}.photo{height:320px;overflow:hidden}.photo img{width:100%;height:100%;object-fit:cover;transition:.45s;filter:saturate(.78) contrast(1.04)}.area-card:hover .photo img{transform:scale(1.035);filter:saturate(1)}.card-body{padding:30px}.card-body h3,.person h3{font-family:Georgia,serif;font-size:27px;font-weight:400;margin:8px 0;color:#fff}.legal-icon{font-family:Georgia,serif;font-size:38px;color:#d7dadd;text-shadow:0 2px 10px #fff2}.team{grid-template-columns:repeat(3,1fr)}.person{background:#1c1f21;border:1px solid #ffffff1c;transition:.35s;display:grid;grid-template-columns:44% 56%;min-height:300px;overflow:hidden;box-shadow:0 14px 38px #0005;border-radius:5px}.person img{width:100%;height:100%;min-height:300px;object-fit:cover;object-position:top}.person>div{padding:28px 22px;display:flex;flex-direction:column;justify-content:center}.person h3{font-size:24px}.role{color:#aeb4b9!important;margin:0}.cta{padding:75px 7vw;background:#202326;display:flex;align-items:center;justify-content:space-between;gap:40px;border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14}.cta h2{margin-bottom:8px}.testimonials{text-align:center;background:#101214}.testimonials .section-head{margin-left:auto;margin-right:auto}.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.testimonial{position:relative;text-align:left;padding:35px;background:#1b1e20;border:1px solid #ffffff1c;box-shadow:0 14px 40px #0005;border-radius:8px}.testimonial .quote{font:60px Georgia,serif;color:#c9cdd1;line-height:.8}.testimonial span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#c5c9cc}.testimonial small{display:block;margin-top:5px;color:#858b90;font-size:9px;letter-spacing:.1em}.location{display:grid;grid-template-columns:.75fr 1.25fr;gap:6vw;align-items:center;background:#171a1c}.map{padding:8px;border:1px solid #777e83;background:#202326;box-shadow:0 20px 50px #0007}.map iframe{width:100%;height:450px;border:0;display:block;filter:none}.footer{padding:58px 7vw;background:#0b0d0e;color:#aeb3b7;text-align:center;border-top:1px solid #ffffff14}.footer-logo{width:330px;margin:0 auto 28px;filter:drop-shadow(0 8px 18px #0007)}.footer-icons{display:flex;justify-content:center;gap:18px;margin:22px 0}.footer-icons a{width:46px;height:46px;border:1px solid #ffffff30;border-radius:50%;display:grid;place-items:center;transition:.25s;background:#ffffff06}.footer-icons a:hover{transform:translateY(-3px);background:#ffffff12;border-color:#d4d8db}.footer-icons svg{width:22px;height:22px;fill:none;stroke:#f4f5f6;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.footer-icons svg .fill{fill:#f4f5f6;stroke:none}.whatsapp{position:fixed;right:22px;bottom:22px;z-index:60;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:transparent;box-shadow:0 10px 30px #0008;animation:pulse 2.8s infinite}.whatsapp img{width:62px;height:62px;object-fit:contain;display:block}@keyframes pulse{50%{transform:scale(1.05);box-shadow:0 10px 32px #25d36655}}.reveal{opacity:0;transform:translateY(22px);transition:.7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1100px){.team{grid-template-columns:1fr}.person{max-width:760px;width:100%;margin:auto}.hero-mark img{width:min(100%,580px)}}
@media(max-width:950px){.menu-btn{display:block}.nav{display:none;position:absolute;top:90px;left:0;right:0;background:#111315;padding:24px 7vw;flex-direction:column;align-items:stretch}.nav.open{display:flex}.hero,.two-col,.location{grid-template-columns:1fr}.hero{padding-top:125px}.hero-mark{order:-1}.hero-mark img{max-height:390px;width:min(100%,440px)}.areas,.testimonial-grid{grid-template-columns:1fr}.cta{display:block}.image-frame img{height:auto}}
@media(max-width:620px){.header{height:76px;padding:0 18px}.brand{height:68px;width:180px}.brand img{width:170px;height:56px}.nav{top:76px}.hero,.section,.cta{padding-left:22px;padding-right:22px}.hero{padding-top:105px}.hero h1{font-size:52px}.hero-areas{flex-direction:column}.actions{flex-direction:column}.btn{width:100%}.section{padding-top:78px;padding-bottom:78px}.person{grid-template-columns:1fr}.person img{height:390px;min-height:0}.photo{height:250px}.map iframe{height:330px}.footer{padding-left:22px;padding-right:22px}.whatsapp{width:52px;height:52px;right:14px;bottom:14px}}

/* Detalhes visuais modernos */
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 0 49.9%,#ffffff08 50%,transparent 50.1%);opacity:.45}.hero:after{content:"";position:absolute;width:420px;height:1px;right:7vw;bottom:12%;background:linear-gradient(90deg,transparent,#aeb4ba88,transparent);pointer-events:none}.hero-content,.hero-mark{position:relative;z-index:1}.section{position:relative;overflow:hidden}.section:before{content:"";position:absolute;left:7vw;top:0;width:82px;height:1px;background:#c8cdd180}.section-head:after{content:"";display:block;width:54px;height:1px;background:#b9bec3;margin-top:20px}.area-card,.person,.testimonial,.image-frame,.map{position:relative}.area-card:after,.person:after,.testimonial:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid transparent;transition:.3s}.area-card:hover:after,.person:hover:after,.testimonial:hover:after{inset:7px;border-color:#ffffff12}.btn{position:relative;overflow:hidden}.btn:after{content:"";position:absolute;top:-120%;left:-35%;width:22%;height:340%;background:#ffffff35;transform:rotate(25deg);transition:.55s}.btn:hover:after{left:125%}.nav>a:not(.btn){letter-spacing:.02em}.footer-icons a{box-shadow:inset 0 0 18px #ffffff05}.map,.image-frame{outline:1px solid #ffffff08;outline-offset:5px}

/* ===== Ajustes solicitados - Rodada 5 ===== */
/* Remove as linhas decorativas/flutuantes espalhadas pelas secoes */
.hero:before,.hero:after,.section:before,.section-head:after{content:none!important;display:none!important}

/* Logo maior no cabecalho */
.header{
    height:100px;
}

.brand{
    width:220px;
    height:100%;
    display:flex;
    align-items:center;
}

.brand img{
    width:200px;
    height:auto;
    max-height:none;
    object-fit:contain;
    object-position:left center;
}

/* Foto principal da equipe: hover elegante */
.image-frame{overflow:hidden;transition:transform .4s ease,border-color .4s ease,box-shadow .4s ease}
.image-frame img{transition:transform .65s ease,filter .45s ease}
.image-frame:hover{transform:translateY(-7px);border-color:#aeb4ba;box-shadow:0 30px 70px #000a}
.image-frame:hover img{transform:scale(1.025);filter:brightness(1.05)}

/* Cards da equipe em formato vertical: foto grande em cima, texto embaixo */
.team{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
.person{display:flex;flex-direction:column;min-height:0;height:100%;overflow:hidden}
.person>img{width:100%;height:430px;min-height:430px;object-fit:cover;object-position:top center;transition:transform .5s ease,filter .4s ease}
.person>div{padding:26px 26px 30px;display:block;min-height:190px}
.person:hover>img{transform:scale(1.025);filter:brightness(1.04)}
.person h3{margin-top:0;margin-bottom:8px}
.person p:last-child{margin-bottom:0}

/* Icones do rodape menores, especialmente o telefone do WhatsApp */
.footer-icons a{width:42px;height:42px}
.footer-icons svg{width:19px;height:19px}
.footer-icons a[aria-label="WhatsApp"] svg{width:17px;height:17px}

/* Botao flutuante do WhatsApp mais discreto */
.whatsapp{width:52px;height:52px;right:20px;bottom:20px}
.whatsapp img{width:52px;height:52px}

@media(max-width:1100px){
  .team{grid-template-columns:repeat(2,minmax(0,1fr))}
  .person{max-width:none}
}
@media(max-width:950px){
  .nav{top:100px}
  .team{grid-template-columns:1fr}
  .person{max-width:620px;margin:auto}
}
@media(max-width:620px){
  .header{height:82px}
  .brand{width:220px;height:74px}
  .brand img{width:210px;height:66px}
  .nav{top:82px}
  .person>img{height:390px;min-height:390px}
  .whatsapp{width:46px;height:46px;right:14px;bottom:14px}
  .whatsapp img{width:46px;height:46px}
}

/* Rodada 6: refinamentos solicitados */
.header .brand{width:285px;height:86px}
.header .brand img{width:275px;height:78px;object-fit:contain;object-position:left center}

/* Equipe: cards mais estreitos e alongados */
.team{grid-template-columns:repeat(3,minmax(0,360px));justify-content:space-between;gap:36px}
.person{width:100%;min-height:570px;display:flex;flex-direction:column}
.person img{width:100%;height:420px;min-height:420px;object-fit:cover;object-position:top center}
.person>div{padding:24px 24px 28px;min-height:150px;justify-content:flex-start}
.person h3{margin:0 0 7px}
.person .role{margin-bottom:4px}
.person>div p:last-child{margin:6px 0 0}

/* Botão da seção Quem nós somos */
.about-action{margin-top:30px}
.whatsapp-btn{gap:10px}
.whatsapp-btn svg{width:21px;height:21px;flex:0 0 auto}
.whatsapp-btn .wa-bubble{fill:currentColor;stroke:none}
.whatsapp-btn .wa-phone{fill:#eef1f3;stroke:none}

/* WhatsApp do rodapé: desenho equilibrado dentro do círculo */
.footer-icons a[aria-label="WhatsApp"] svg{width:22px;height:22px}
.footer-icons a[aria-label="WhatsApp"] svg .fill{transform:scale(.72);transform-origin:center}

/* WhatsApp flutuante menor */
.whatsapp{width:44px;height:44px;right:18px;bottom:18px}
.whatsapp img{width:44px;height:44px}

@media(max-width:1100px){
  .team{grid-template-columns:repeat(2,minmax(0,350px));justify-content:center}
  .header .brand{width:240px}.header .brand img{width:230px}
}
@media(max-width:760px){
  .team{grid-template-columns:minmax(0,360px);justify-content:center}
}
@media(max-width:620px){
  .header .brand{width:205px;height:68px}.header .brand img{width:195px;height:60px}
  .person{min-height:520px}.person img{height:375px;min-height:375px}
  .whatsapp{width:40px;height:40px;right:12px;bottom:12px}.whatsapp img{width:40px;height:40px}
}

/* Rodada 7: cards da equipe lado a lado, com espaçamento reduzido */
.team{
  grid-template-columns:repeat(3,minmax(0,360px));
  justify-content:center;
  column-gap:24px;
  row-gap:24px;
}
@media(max-width:1100px){
  .team{grid-template-columns:repeat(2,minmax(0,350px));justify-content:center;gap:24px}
}
@media(max-width:760px){
  .team{grid-template-columns:minmax(0,360px);justify-content:center;gap:20px}
}

/* ===== HERO FOTOGRAFICO — 3 ADVOGADOS + TRANSICAO GRAFITE ===== */
@media (min-width:951px){
  .hero{
    min-height:100vh;
    display:block;
    padding:145px 7vw 80px;
    background:#15181a;
    position:relative;
    overflow:hidden;
  }
  /* A foto existe inteira por tras da transicao. O tamanho foi reduzido
     o suficiente para manter os tres profissionais dentro do enquadramento. */
  .hero::before{
    content:""!important;
    display:block!important;
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background-image:url("images/equipe.png");
    background-repeat:no-repeat;
    background-position:right bottom;
    background-size:auto 92%;
  }
  /* Grafite solido -> semitransparente -> fotografia limpa.
     A transicao termina antes do advogado mais a esquerda. */
  .hero::after{
    content:""!important;
    display:block!important;
    position:absolute;
    inset:0;
    z-index:1;
    width:auto;
    height:auto;
    pointer-events:none;
    background:linear-gradient(90deg,
      #15181a 0%,
      #15181a 24%,
      rgba(21,24,26,.98) 25%,
      rgba(21,24,26,.82) 27%,
      rgba(21,24,26,.52) 29%,
      rgba(21,24,26,.20) 31%,
      rgba(21,24,26,0) 33%,
      rgba(21,24,26,0) 100%);
  }
  .hero-content{
    position:relative;
    z-index:2;
    width:36%;
    max-width:610px;
    min-width:470px;
    padding-top:13vh;
  }
  .hero h1{font-size:clamp(58px,6vw,98px)}
  .hero .lead{max-width:540px}
  .hero-mark{display:none!important}
}

/* Em telas menores, preserva a leitura e mostra a equipe inteira sem sobrepor o texto. */
@media (max-width:950px){
  .hero-mark{display:none!important}
  .hero{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    min-height:900px;
    background:
      linear-gradient(
          180deg,
          rgba(21,24,26,0) 12%,
          rgba(21,24,26,.25) 18%,
          rgba(21,24,26,.55) 24%,
          rgba(21,24,26,.78) 30%,
          rgba(21,24,26,.92) 36%,
          rgba(21,24,26,.98) 42%,
          #15181a 49%
      ),
      url("images/equipe.png") center 60px/100% auto no-repeat,
      #15181a;
  }
  .hero-content{position:relative;z-index:2;width:100%;max-width:680px}
}

/* ===== AJUSTE FINAL HERO — SOBREPOSICAO REAL SEM EMENDA ===== */
@media (min-width:951px){
  /* A fotografia comeca ATRAS do grafite, antes da faixa de transicao. */
  .hero::before{
    background-position:right bottom!important;
    background-size:auto 112%!important;
  }

  /* O grafite continua solido sob o texto e perde opacidade somente
     na area em que a fotografia ja existe por baixo. A camada termina
     antes do primeiro advogado, evitando qualquer cinza sobre a equipe. */
  .hero::after{
    background:linear-gradient(90deg,
      #15181a 0%,
      #15181a 24%,
      rgba(21,24,26,.98) 27%,
      rgba(21,24,26,.90) 29%,
      rgba(21,24,26,.72) 31%,
      rgba(21,24,26,.48) 33%,
      rgba(21,24,26,.25) 35%,
      rgba(21,24,26,.10) 36.5%,
      rgba(21,24,26,0) 38%,
      rgba(21,24,26,0) 100%)!important;
  }
}

/* ===== AJUSTE HERO VFINAL — ROSTOS VISIVEIS + CAMADA MAIS LEVE ===== */
@media (min-width:951px){
  /* Move o enquadramento visual para baixo na tela: a imagem sobe dentro do hero,
     fazendo os rostos dos tres profissionais entrarem abaixo do header. */
  .hero::before{
    background-position:right 1%!important;
    background-size:auto 112%!important;
  }

  /* Mantem o grafite solido atras do texto, mas suaviza a faixa cinza de transicao. */
  .hero::after {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        z-index: 1 !important;
        pointer-events: none !important;

        background: linear-gradient(
            90deg,
            #15181a 0%,
            #15181a 25%,
            rgba(21,24,26,.98) 28%,
            rgba(21,24,26,.90) 31%,
            rgba(21,24,26,.72) 34%,
            rgba(21,24,26,.50) 37%,
            rgba(21,24,26,.30) 40%,
            rgba(21,24,26,.15) 43%,
            rgba(21,24,26,.06) 46%,
            rgba(21,24,26,0) 50%
        ) !important;
    }

}
@media (min-width:951px){

    .hero::before{
        background-position:right -20%!important;
        background-size:auto 112%!important;
    }

    .hero-content{
        width:40%;
        max-width:680px;
        min-width:560px;
    }

    .hero h1{
        white-space:nowrap;
        font-size:clamp(58px,5.5vw,90px);
    }
}

@media (max-width: 950px) {

    .hero {
        justify-content: flex-start !important;
        padding-top: 0 !important;
    }

    .hero-content {
        margin-top: 390px !important;
        padding-top: 30px !important;
        width: 100% !important;
    }

}
