/* O Escritório - estilos só desta página (medidas do Figma em rem: px / 10) */

/* Topo */
.esc-hero { min-height: 51.9rem; padding-top: 21.9rem; }
.esc-hero__title { font: 400 5.5rem/5.5rem var(--serif); color: var(--navy); text-transform: uppercase; max-width: 92rem; }
.esc-hero__text { font-size: 1.6rem; line-height: 2rem; max-width: 63.6rem; margin-top: 5.5rem; padding-bottom: 5.5rem; }

/* Estrutura (faixa azul com foto) */
.esc-estrutura { background: var(--navy); color: var(--white); padding-bottom: 8.7rem; }
.esc-estrutura__photo { height: 42.4rem; }
.esc-estrutura__photo img { width: 100%; height: 100%; object-fit: cover; }
.esc-estrutura__title { font: italic 400 3rem/3.5rem var(--serif); text-transform: uppercase; margin-top: 9.7rem; }
.esc-estrutura__grid { display: grid; grid-template-columns: 70.3rem 1fr; margin-top: 5.8rem; }
.esc-estrutura__cols { display: grid; grid-template-columns: 21.1rem 22.5rem 1fr; align-items: start; }
.esc-col { border-top: 1px solid var(--white); padding-top: 2rem; }
.esc-col:nth-child(1) { width: 17.1rem; }
.esc-col:nth-child(2) { width: 18.8rem; }
.esc-col:nth-child(3) { width: 12.8rem; }
.esc-col h3 { font: 700 1.6rem/2rem var(--sans); text-transform: uppercase; }
.esc-col:nth-child(1) h3 { max-width: 16.7rem; }
.esc-col:nth-child(2) h3 { width: 20.5rem; max-width: none; }
.esc-col:nth-child(3) h3 { max-width: 6.8rem; }
.esc-col ul { margin: 1.4rem 0 0; padding: 0 0 0 1.3rem; font: 300 1.4rem/2rem var(--sans); white-space: nowrap; color: rgba(255, 255, 255, .75); }
.esc-estrutura__side p { font-size: 1.6rem; line-height: 2rem; max-width: 63.7rem; }
.esc-btn-light { background: var(--white); color: var(--navy-card); margin-top: 7.6rem; margin-left: -1px; }
.esc-btn-light:hover { background: #eef1f7; }

/* O Escritório */
.esc-about { padding-top: 8.3rem; }
.esc-about__grid { display: grid; grid-template-columns: 1fr 31.4rem 31.4rem; gap: 1rem; }
.esc-about__text { display: flex; flex-direction: column; align-items: flex-start; }
.esc-about__body { margin-top: 2.2rem; font-size: 1.6rem; line-height: 2rem; max-width: 55.1rem; }
.esc-about__body p + p { margin-top: 2rem; }
.esc-about__text .btn { margin-top: auto; margin-bottom: 0.1rem; }
.esc-about__photo { height: 56.4rem; border-radius: 1.2rem; overflow: hidden; background: #111; }
.esc-about__photo img { width: 100%; height: 100%; object-fit: cover; }
.esc-about__quote { height: 56.4rem; border-radius: 1.2rem; background: var(--navy-card); color: var(--white); padding: 3.4rem 3rem 3.9rem; display: flex; flex-direction: column; }
.esc-about__quote img { width: 5.8rem; height: 5.8rem; }
.esc-about__quote p { margin-top: auto; font-size: 2rem; line-height: 2.5rem; max-width: 22.3rem; }

/* Clareza · Estrutura · Permanência */
.esc-clareza { padding-top: 12.8rem; }
.esc-clareza__grid { display: grid; grid-template-columns: 62.2rem 1fr; column-gap: 10.2rem; }
.esc-clareza__photo { height: 44rem; border-radius: 3rem; overflow: hidden; }
.esc-clareza__photo img { width: 100%; height: 100%; object-fit: cover; }
.esc-clareza__text { padding-top: 8.4rem; }
.esc-clareza__title { font: 400 3rem/3.5rem var(--serif); color: #182c59; text-transform: uppercase; max-width: 34.9rem; }
.esc-clareza__text p { font-size: 1.6rem; line-height: 2rem; max-width: 29.9rem; margin-top: 1.1rem; }
.esc-clareza__cta { width: 24.5rem; display: flex; justify-content: center; margin-top: 5rem; }

/* Chamada final */
.esc-cta { position: relative; margin-top: 14.4rem; padding-bottom: 5.1rem; isolation: isolate; }
.esc-cta::after { content: ""; position: absolute; left: 0; right: 0; top: 23.2rem; bottom: 0; background: var(--navy); z-index: -1; }
.esc-cta__grid { display: grid; grid-template-columns: 45rem 38.7rem; grid-template-rows: auto 1fr; column-gap: 4.3rem; justify-content: center; margin-left: 0.1rem; }
.esc-cta__title { font: 400 4.5rem/5rem var(--serif); color: var(--navy); text-transform: uppercase; }
.esc-cta__photo { grid-column: 2; grid-row: 1 / span 2; height: 45.8rem; margin-top: 0.3rem; border-radius: 1.5rem; overflow: hidden; }
.esc-cta__photo img { width: 100%; height: 100%; object-fit: cover; }
.esc-cta__copy { grid-column: 1; grid-row: 2; color: var(--white); padding-top: 5.5rem; margin-left: -0.1rem; }
.esc-cta__copy p { font-size: 1.6rem; line-height: 2rem; max-width: 28rem; }
.esc-cta__copy .btn { margin-top: 5rem; margin-left: -0.2rem; }

/* ---------- Responsivo ---------- */
@media (max-width: 1199px) {
  .esc-hero { min-height: 0; padding-top: 16rem; }
  .esc-hero__title { font-size: 4.6rem; line-height: 5rem; }
  .esc-hero__text { margin-top: 3.6rem; }
  .esc-estrutura__photo { height: 36rem; }
  .esc-estrutura__title { margin-top: 7rem; }
  .esc-estrutura__grid { grid-template-columns: 1fr; row-gap: 5rem; margin-top: 4rem; }
  .esc-btn-light { margin-top: 3.6rem; }
  .esc-about { padding-top: 8rem; }
  .esc-about__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
  .esc-about__text { grid-column: 1 / -1; margin-bottom: 4rem; }
  .esc-about__body { max-width: 64rem; }
  .esc-about__text .btn { margin-top: 4rem; margin-bottom: 0; }
  .esc-clareza { padding-top: 10rem; }
  .esc-clareza__grid { grid-template-columns: 1fr 1fr; column-gap: 4rem; }
  .esc-clareza__photo { height: auto; aspect-ratio: 622 / 440; align-self: start; }
  .esc-clareza__text { padding-top: 0; }
  .esc-clareza__text br { display: none; }
  .esc-clareza__cta { width: auto; justify-content: flex-start; margin-top: 4rem; }
  .esc-cta { margin-top: 10rem; }
  .esc-cta__grid { grid-template-columns: 1fr 1fr; column-gap: 3rem; padding: 0 var(--gutter); margin: 0; }
  .esc-cta__title { font-size: 3.8rem; line-height: 4.4rem; }
  .esc-cta::after { top: 19rem; }
  .esc-cta__copy { padding-top: 8rem; }
}

@media (max-width: 720px) {
  .esc-hero { padding-top: 13rem; }
  .esc-hero__title { font-size: 3.4rem; line-height: 3.8rem; }
  .esc-hero__text { margin-top: 2.4rem; padding-bottom: 4rem; }
  .esc-estrutura { padding-bottom: 6rem; }
  .esc-estrutura__photo { height: 24rem; }
  .esc-estrutura__title { margin-top: 5rem; font-size: 2.6rem; }
  .esc-estrutura__cols { grid-template-columns: 1fr; row-gap: 3.6rem; }
  .esc-col:nth-child(n) { width: 100%; }
  .esc-col:nth-child(n) h3 { max-width: none; }
  .esc-about { padding-top: 7rem; }
  .esc-about__photo, .esc-about__quote { height: 38rem; }
  .esc-about__quote { padding: 2.2rem 1.8rem; }
  .esc-about__quote p { font-size: 1.6rem; line-height: 2.1rem; }
  .esc-clareza { padding-top: 7rem; }
  .esc-clareza__grid { grid-template-columns: 1fr; row-gap: 3.6rem; }
  .esc-clareza__photo { border-radius: 2rem; }
  .esc-clareza__title { font-size: 2.4rem; line-height: 3rem; }
  .esc-clareza__text p { max-width: none; }
  .esc-cta { margin-top: 8rem; overflow: hidden; }
  .esc-cta::after { display: none; }
  .esc-cta__grid { display: flex; flex-direction: column; }
  .esc-cta__title { font-size: 3rem; line-height: 3.6rem; }
  .esc-cta__photo { position: relative; overflow: visible; height: 42rem; margin-top: 2.4rem; }
  .esc-cta__photo img { border-radius: 1.5rem; position: relative; }
  .esc-cta__photo::before { content: ""; position: absolute; left: -100vmax; right: -100vmax; top: 55%; bottom: 0; background: var(--navy); }
  .esc-cta__copy { padding-top: 3rem; background: var(--navy); box-shadow: 0 0 0 100vmax var(--navy); clip-path: inset(0 -100vmax); }
  .esc-cta { padding-bottom: 0; }
  .esc-cta__copy { padding-bottom: 5rem; }
  .esc-cta__copy p { max-width: none; }
  .esc-cta__copy .btn { margin-top: 3rem; margin-left: 0; }
}