:root{
  --paper:#ffffff;
  --paper-soft:#ffffff;
  --ink:#282321;
  --muted:#766d67;
  --line:#d9ccc2;
  --accent:#001F5C;
  --heading:#001F5C;
  --heading-deep:#001F5C;
  --accent-soft:#001F5C;
  --deep:#342d2f;
  --white:#ffffff;
  --max:1480px;
  --pad:clamp(24px,5vw,76px);
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.page-shell{width:min(100%,var(--max));margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.ruled{border-top:1px solid var(--line)}

.site-header{
  position:sticky;top:0;z-index:100;
  min-height:154px;padding:11px var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:40px;
  background:rgba(247,241,233,.94);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(40,35,33,.11)
}
.brand img{width:132px;height:132px;object-fit:cover;display:block}
.main-nav{display:flex;align-items:center;gap:clamp(18px,2.1vw,34px)}
.nav-link{position:relative;padding:8px 0;font-size:11px;text-transform:uppercase;letter-spacing:.11em}
.nav-link:after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:var(--accent);transition:right .22s ease}
.nav-link:hover,.nav-link.active{color:var(--accent)}
.nav-link:hover:after,.nav-link.active:after{right:0}
.menu-toggle{display:none;border:0;background:transparent;padding:12px 0 12px 16px;z-index:120}
.menu-toggle span{display:block;width:28px;height:1px;background:var(--ink);margin:7px 0}

.kicker,.label{color:var(--accent);font-size:10px;text-transform:uppercase;letter-spacing:.18em}
.label.light{color:#001F5C}

.hero{
  min-height:auto;
  padding-top:clamp(48px,5vw,72px);
  padding-bottom:clamp(62px,7vw,96px);
  display:block;
  position:relative;
  overflow:hidden
}
.hero h1{
  position:relative;
  z-index:2;
  margin:0;
  max-width:none;
  color:var(--heading);
  font:400 clamp(35px,3.7vw,52px)/1.08 var(--serif);
  letter-spacing:-.027em;
  white-space:nowrap
}
.hero-content{
  position:relative;
  z-index:2;
  margin-top:clamp(28px,3vw,42px);
  display:grid;
  grid-template-columns:minmax(320px,1.15fr) minmax(300px,.85fr);
  gap:clamp(42px,6vw,88px);
  align-items:center
}
.hero-copy p{
  margin:0;
  max-width:600px;
  font:400 clamp(17px,1.3vw,20px)/1.55 var(--serif);
  color:#423b37
}
.hero-copy .arrow-link{margin-top:28px}
.hero-photo{
  width:min(100%,490px);
  height:clamp(210px,20vw,285px);
  margin:0 0 0 auto;
  position:relative;
  background:var(--paper-soft)
}
.hero-photo:after{
  content:"";
  position:absolute;
  width:34%;
  height:9px;
  right:16px;
  bottom:-9px;
  background:var(--accent)
}
.hero-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 55%;
  display:block;
  filter:grayscale(100%) contrast(.96) brightness(1.02)
}
.arrow-link{
  display:inline-flex;align-items:center;gap:17px;width:max-content;
  color:var(--accent);font-size:11px;text-transform:uppercase;letter-spacing:.11em;
  padding-bottom:5px;border-bottom:1px solid var(--accent)
}
.watermark{
  position:absolute;right:-22px;bottom:-50px;
  font:400 clamp(125px,21vw,330px)/1 var(--serif);
  letter-spacing:-.09em;color:rgba(125,61,72,.045);user-select:none
}

.home-intro,.home-practices,.home-team{
  padding-top:clamp(88px,9vw,138px);
  padding-bottom:clamp(88px,9vw,138px)
}
.home-intro{display:grid;grid-template-columns:1fr 3.1fr;gap:clamp(40px,7vw,112px)}
.content-column h2,.section-head h2{
  margin:0;font:400 clamp(31px,3.6vw,51px)/1.1 var(--serif);letter-spacing:-.028em;max-width:900px
}
.copy-columns{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(35px,5vw,75px);
  max-width:900px;margin:52px 0 40px
}
.copy-columns p,.prose p,.area-detail p,.value-grid p,.bio-copy p{
  margin:0;font:400 18px/1.65 var(--serif);color:#433c38
}
.section-head{display:grid;grid-template-columns:1fr 3.1fr;gap:clamp(40px,7vw,112px);align-items:start}
.practice-list{margin-top:64px}
.practice-list a{
  min-height:80px;display:grid;grid-template-columns:1fr 40px;align-items:center;
  border-top:1px solid var(--line);transition:background .22s ease,padding .22s ease,color .22s ease
}
.practice-list a:last-child{border-bottom:1px solid var(--line)}
.practice-list a:hover{background:rgba(255,255,255,.26);padding:0 15px;color:var(--accent)}
.practice-list span{font:400 clamp(21px,1.95vw,29px)/1.18 var(--serif)}
.practice-list b{justify-self:end;color:var(--accent);font-size:18px;font-weight:400}

.quote-band{
  background:var(--heading);
  color:var(--white);
  padding:clamp(42px,4.5vw,62px) 0
}
.quote-band p{
  max-width:850px;
  margin:0 auto;
  text-align:center;
  font:400 clamp(21px,2.35vw,31px)/1.3 var(--serif);
  letter-spacing:-.01em;
  opacity:.94
}

.partner-list{margin-top:56px;border-top:1px solid var(--line)}
.partner-row{
  display:grid;grid-template-columns:2.2fr .6fr 30px;gap:25px;align-items:center;min-height:100px;
  border-bottom:1px solid var(--line);transition:color .2s ease,padding .2s ease
}
.partner-row:hover{color:var(--accent);padding-left:12px}
.partner-row span{font:400 clamp(24px,2.25vw,34px)/1.17 var(--serif)}
.partner-row em{font-style:normal;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.partner-row b{font-weight:400;color:var(--accent)}

.contact-strip{background:var(--deep);color:var(--white)}
.contact-strip-inner{
  min-height:300px;padding-top:72px;padding-bottom:72px;
  display:flex;align-items:center;justify-content:space-between;gap:55px
}
.contact-strip h2{
  margin:0;font:400 clamp(38px,4.1vw,58px)/1.08 var(--serif);
  letter-spacing:-.025em;color:#d9e8f0
}
.contact-strip p{
  margin:20px 0 0;max-width:560px;
  font:400 18px/1.55 var(--serif);color:rgba(255,255,255,.72)
}
.contact-button{
  flex:0 0 auto;border:1px solid rgba(255,255,255,.45);border-radius:999px;
  padding:16px 22px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;
  transition:.2s ease
}
.contact-button span{margin-left:18px}
.contact-button:hover{background:#001F5C;border-color:#001F5C;color:var(--deep)}

.page-title{padding-top:clamp(70px,8vw,108px);padding-bottom:clamp(70px,8vw,106px)}
.page-title .kicker{margin:0 0 27px}
.page-title h1{
  margin:0;font:400 clamp(39px,4.7vw,62px)/1.07 var(--serif);
  letter-spacing:-.03em
}
.page-title .lead{
  margin:29px 0 0;max-width:760px;
  font:400 clamp(18px,1.55vw,22px)/1.57 var(--serif);color:var(--muted)
}
.article-layout{
  padding-top:clamp(74px,8vw,118px);padding-bottom:clamp(80px,9vw,135px);
  display:grid;grid-template-columns:1fr 3.1fr;gap:clamp(40px,7vw,112px)
}
.prose{max-width:900px}
.prose h2{
  margin:0 0 42px;font:400 clamp(29px,3vw,43px)/1.15 var(--serif);
  letter-spacing:-.022em
}
.prose p+p{margin-top:25px}

.values{padding-top:84px;padding-bottom:112px}
.value-grid{margin-top:43px;display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}
.value-grid article{padding:34px 40px 40px 0;border-bottom:1px solid var(--line)}
.value-grid article:nth-child(odd){border-right:1px solid var(--line);padding-right:50px}
.value-grid article:nth-child(even){padding-left:50px}
.value-grid h3{margin:0 0 17px;font:400 26px/1.2 var(--serif)}

.simple-cta{
  padding-top:63px;padding-bottom:72px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;gap:35px
}
.simple-cta p{margin:0;font:400 23px/1.3 var(--serif)}

.areas-page{padding-top:0;padding-bottom:105px}
.area-detail{
  scroll-margin-top:175px;
  display:grid;grid-template-columns:1.2fr 2.1fr auto;gap:48px;
  padding:46px 0;border-bottom:1px solid var(--line);align-items:start
}
.area-detail h2{margin:0;font:400 clamp(25px,2.25vw,34px)/1.18 var(--serif)}
.area-detail p{max-width:690px}
.mini-link{
  white-space:nowrap;color:var(--accent);font-size:10px;text-transform:uppercase;
  letter-spacing:.11em;border-bottom:1px solid var(--accent);padding-bottom:4px
}

.team-page{padding-top:0;padding-bottom:112px}
.bio-card{
  scroll-margin-top:175px;
  display:grid;grid-template-columns:1.15fr 2.15fr;gap:clamp(45px,8vw,118px);
  padding:55px 0;border-bottom:1px solid var(--line)
}
.bio-title h2{margin:0;font:400 clamp(27px,2.55vw,37px)/1.15 var(--serif)}
.bio-title p{margin:14px 0 0;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.11em}
.bio-copy{max-width:760px}
.linkedin-icon{
  margin-top:24px;display:inline-flex;width:31px;height:31px;align-items:center;justify-content:center;
  color:var(--accent);transition:transform .2s ease,opacity .2s ease
}
.linkedin-icon:hover{transform:translateY(-2px);opacity:.72}
.linkedin-icon svg{width:25px;height:25px;fill:currentColor}

.sector-band{background:var(--accent);color:var(--white);padding:72px 0 82px}
.sector-grid{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.3)}
.sector-grid span{padding:24px 0;border-bottom:1px solid rgba(255,255,255,.3);font:400 22px/1.2 var(--serif)}

.error-page{min-height:520px}
.error-link{margin-top:36px}

.site-footer{background:var(--heading);color:rgba(255,255,255,.62);border-top:1px solid rgba(255,255,255,.12)}
.footer-inner{
  width:min(100%,var(--max));margin:0 auto;padding:31px var(--pad);
  display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:32px
}
.footer-inner img{width:60px;height:60px;object-fit:cover;filter:grayscale(1)}
.footer-location{font-size:10px;text-transform:uppercase;letter-spacing:.1em}
.footer-nav{display:flex;gap:20px;font-size:9px;text-transform:uppercase;letter-spacing:.09em}
.footer-nav a:hover,.back-top:hover{color:#fff}
.back-top{font-size:9px;text-transform:uppercase;letter-spacing:.09em}

@media(max-width:980px){
  .site-header{min-height:126px}
  .brand img{width:104px;height:104px}
  .menu-toggle{display:block}
  .main-nav{
    position:fixed;inset:0;background:var(--paper);padding:145px var(--pad) 50px;
    flex-direction:column;align-items:flex-start;gap:25px;
    transform:translateY(-105%);transition:transform .32s ease;z-index:110
  }
  body.menu-open{overflow:hidden}
  body.menu-open .main-nav{transform:translateY(0)}
  .nav-link{font:400 31px/1.2 var(--serif);text-transform:none;letter-spacing:-.02em}
  .hero{padding-top:48px}
  .hero-content,.home-intro,.section-head,.article-layout{grid-template-columns:1fr}
    .content-column h2,.section-head h2{margin-top:16px}
  .area-detail{grid-template-columns:1fr;gap:20px}
  .area-detail .mini-link{width:max-content}
  .bio-card{grid-template-columns:1fr;gap:28px}
  .footer-inner{grid-template-columns:auto 1fr auto}
  .footer-nav{display:none}
}
@media(max-width:700px){
  .site-header{min-height:112px;padding-top:10px;padding-bottom:10px}
  .brand img{width:90px;height:90px}
  .hero{padding-top:42px}
  .hero h1{
    font-size:clamp(33px,9.6vw,46px);
    white-space:normal
  }
  .hero-content{margin-top:24px;gap:36px}
  .hero-photo{width:100%;height:clamp(200px,56vw,280px);margin:0}
  .watermark{display:none}
  .copy-columns{grid-template-columns:1fr;gap:25px}
  .practice-list a{min-height:72px}
  .practice-list span{font-size:21px}
  .quote-band p{font-size:clamp(25px,8vw,34px)}
  .partner-row{grid-template-columns:1fr auto;gap:10px 20px;padding:23px 0}
  .partner-row em{grid-row:2;grid-column:1}
  .partner-row b{grid-row:1 / span 2;grid-column:2}
  .contact-strip-inner{align-items:flex-start;flex-direction:column;min-height:auto}
  .value-grid{grid-template-columns:1fr}
  .value-grid article:nth-child(odd),.value-grid article:nth-child(even){
    border-right:0;padding-left:0;padding-right:0
  }
  .sector-grid{grid-template-columns:1fr 1fr}
  .simple-cta{align-items:flex-start;flex-direction:column}
  .footer-inner{grid-template-columns:1fr;gap:18px}
  .footer-inner img{width:52px;height:52px}
  .back-top{justify-self:start}
}


/* =========================================================
   FOTOGRAFIA INSTITUCIONAL — v10
   Fotos sin retratos de socios; integración editorial y sobria.
   ========================================================= */
.visual-band{
  padding-top:clamp(8px,1.2vw,18px);
  padding-bottom:clamp(76px,8vw,118px);
  position:relative;
}
.editorial-photo{
  position:relative;
  width:min(72%,920px);
  height:clamp(250px,30vw,390px);
  margin:0;
  background:var(--paper-soft);
}
.visual-right .editorial-photo{margin-left:auto}
.visual-left .editorial-photo{margin-right:auto}
.editorial-photo:after{
  content:"";
  position:absolute;
  z-index:-1;
  width:42%;
  height:18px;
  bottom:-18px;
  background:var(--accent);
  opacity:.92;
}
.visual-right .editorial-photo:after{right:24px}
.visual-left .editorial-photo:after{left:24px}
.editorial-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:grayscale(100%) contrast(.96) brightness(1.02);
}

/* Recortes individuales para conservar el foco de cada fotografía. */
.visual-band img[src$="foto-libros.jpg"]{object-position:center 55%}
.visual-band img[src$="foto-columnas.jpg"]{object-position:center 52%}
.visual-band img[src$="foto-tribunales.jpg"]{object-position:center 43%}

@media(max-width:980px){
  .editorial-photo{width:82%;height:clamp(240px,42vw,360px)}
}
@media(max-width:700px){
  .visual-band{padding-bottom:72px}
  .editorial-photo{width:100%;height:clamp(220px,62vw,320px)}
  .editorial-photo:after{height:12px;bottom:-12px;width:38%}
  .visual-right .editorial-photo:after{right:14px}
  .visual-left .editorial-photo:after{left:14px}
}

/* Títulos principales en azul pizarra: aporta contraste sin perder sobriedad. */
.content-column h2,
.section-head h2,
.page-title h1,
.prose h2,
.prose h3,
.value-grid h3,
.area-detail h2,
.bio-title h2,
.simple-cta p{
  color:var(--heading);
}
.practice-list span,
.partner-row span{
  color:var(--ink);
}


/* =========================================================
   PRIVACIDAD — v11
   ========================================================= */
.privacy-title{padding-bottom:clamp(56px,6vw,82px)}
.privacy-layout{padding-top:clamp(68px,7vw,96px)}
.privacy-prose h3{
  margin:42px 0 14px;
  font:400 23px/1.25 var(--serif);
}
.privacy-contact{margin-top:34px}

@media(max-width:1120px){
  .hero h1{white-space:normal}
  .hero-content{grid-template-columns:1.05fr .95fr}
}
@media(max-width:980px){
  .hero-photo{margin-left:0;width:min(100%,600px)}
}


/* =========================================================
   AJUSTES CROMÁTICOS v13
   ========================================================= */

/* Azul institucional más profundo y brillante */
:root {
  --heading:#001F5C;
  --heading-deep:#001F5C;
}

/* Las áreas de práctica y los nombres de socios quedan en negro */
.practice-list span,
.partner-row span {
  color: var(--ink);
}

/* Footer del mismo azul que la banda de la frase central */
.site-footer {
  background: var(--heading);
}

/* La frase central queda en un solo renglón en escritorio */
.quote-band p {
  max-width: none;
  white-space: nowrap;
  font-size: clamp(20px, 2.15vw, 30px);
}

/* En pantallas chicas se permite el salto de línea */
@media(max-width: 980px) {
  .quote-band p {
    white-space: normal;
    max-width: 850px;
  }
}


/* =========================================================
   AJUSTES v14
   ========================================================= */

/* Frases introductorias en una sola línea en escritorio */
.team-title .lead,
.clients-title .lead {
  max-width: none;
  white-space: nowrap;
}

/* Contacto integrado con el formulario actual */
.contact-page-title {
  padding-bottom: clamp(50px, 5.5vw, 76px);
}

.contact-page-title h1 {
  color: var(--heading);
}

.embedded-contact {
  padding-top: clamp(55px, 6vw, 82px);
  padding-bottom: clamp(80px, 8vw, 118px);
}

.contact-frame-wrap {
  max-width: 980px;
}

.contact-frame {
  width: 100%;
  height: 820px;
  border: 0;
  display: block;
  background: var(--paper);
}

.contact-frame-note {
  margin: 22px 0 0;
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
}

@media(max-width: 1100px) {
  .team-title .lead,
  .clients-title .lead {
    white-space: normal;
  }
}

@media(max-width: 700px) {
  .contact-frame {
    height: 980px;
  }
}


/* =========================================================
   AJUSTES v15
   ========================================================= */

/* Banda "Contáctenos" en azul institucional */
.contact-strip {
  background: var(--heading);
}

/* Pie de página gris oscuro en todas las páginas */
.site-footer {
  background: var(--deep);
}


/* =========================================================
   AJUSTE v17
   ========================================================= */

/* Todos los pies de página quedan en gris grafito neutro */
:root {
  --footer-gray: #3f3f3f;
}

.site-footer {
  background: var(--footer-gray) !important;
}


/* =========================================================
   AJUSTE v18
   ========================================================= */

/* Bloque "Sectores" de Clientes en azul institucional */
.sector-band {
  background: var(--heading) !important;
}


/* =========================================================
   AJUSTES v19
   ========================================================= */

/* Todos los pies de página, en todas las páginas, en azul institucional */
.site-footer {
  background: var(--heading) !important;
}

/* ---------------------------------------------------------
   CONTACTO: integración visual del formulario actual
   --------------------------------------------------------- */
.contact-stage {
  padding-top: clamp(64px, 7vw, 96px);
  padding-bottom: clamp(86px, 9vw, 132px);
}

.contact-stage-grid {
  display: grid;
  grid-template-columns: minmax(250px, .65fr) minmax(560px, 1.35fr);
  gap: clamp(52px, 7vw, 105px);
  align-items: start;
}

.contact-stage-copy {
  padding-top: 18px;
  position: sticky;
  top: 185px;
}

.contact-stage-copy .kicker {
  margin: 0 0 22px;
}

.contact-stage-copy h1 {
  margin: 0;
  color: var(--heading);
  font: 400 clamp(39px, 4.7vw, 62px)/1.07 var(--serif);
  letter-spacing: -.03em;
}

.contact-stage-copy > p {
  max-width: 360px;
  margin: 28px 0 0;
  color: var(--muted);
  font: 400 18px/1.58 var(--serif);
}

.contact-privacy-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 36px;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--line);
  color: var(--heading);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.privacy-lock {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--heading);
  border-radius: 50%;
  font-size: 11px;
}

.contact-form-surface {
  position: relative;
  background: rgba(255,255,255,.32);
  border: 1px solid var(--line);
  padding: clamp(28px, 4vw, 54px);
}

.contact-form-surface:before {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  height: 5px;
  background: var(--heading);
}

.contact-frame-crop {
  position: relative;
  width: 100%;
  min-height: 720px;
  overflow: hidden;
  background: var(--paper);
}

.contact-frame {
  display: block;
  width: 100%;
  height: 1030px;
  border: 0;
  background: var(--paper);
  /*
   * Cuando se previsualiza desde el disco, el navegador no permite modificar
   * el contenido del iframe por política de origen. Este desplazamiento
   * recorta visualmente la cabecera antigua y acerca directamente el formulario.
   */
  margin-top: -205px;
}

/* Online, en el mismo dominio, JS aísla y rediseña el formulario.
   En ese momento se elimina el recorte usado para la vista previa. */
.contact-frame.is-adapted {
  margin-top: 0;
  height: 820px;
}

@media(max-width: 1040px) {
  .contact-stage-grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .contact-stage-copy {
    position: static;
    padding-top: 0;
  }

  .contact-stage-copy > p {
    max-width: 620px;
  }

  .contact-form-surface {
    max-width: 900px;
  }
}

@media(max-width: 700px) {
  .contact-stage {
    padding-top: 52px;
  }

  .contact-form-surface {
    padding: 22px 16px 28px;
  }

  .contact-frame-crop {
    min-height: 780px;
  }

  .contact-frame {
    height: 1120px;
    margin-top: -180px;
  }

  .contact-frame.is-adapted {
    margin-top: 0;
    height: 980px;
  }
}


/* =========================================================
   AJUSTE v20
   ========================================================= */

/* Home: banda de contacto más liviana, sobre fondo blanco */
.contact-strip {
  background: #ffffff !important;
  color: var(--ink) !important;
  border-top: 1px solid var(--line);
}

.contact-strip h2 {
  color: var(--ink) !important;
}

.contact-strip p {
  color: var(--muted) !important;
}

.contact-button {
  color: var(--heading) !important;
  border-color: var(--heading) !important;
  background: transparent !important;
}

.contact-button:hover {
  color: #ffffff !important;
  background: var(--heading) !important;
  border-color: var(--heading) !important;
}


/* =========================================================
   AJUSTE v21 — Título del formulario
   ========================================================= */

.contact-form-heading {
  margin: 0 0 24px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--line);
}

.contact-form-heading h2 {
  margin: 0;
  color: var(--heading);
  font: 400 clamp(25px, 2.35vw, 34px)/1.15 var(--serif);
  letter-spacing: -.018em;
  white-space: nowrap;
}

/*
 * El encabezado "Formulario de Contacto" del sitio anterior ya no se necesita:
 * el nuevo diseño tiene su propio título. Ajustamos el recorte para comenzar
 * directamente sobre los campos del formulario.
 */
.contact-frame {
  margin-top: -230px;
}

/* Cuando el formulario puede adaptarse por estar alojado en el mismo dominio,
   el encabezado antiguo se elimina con el resto del diseño viejo y no se recorta. */
.contact-frame.is-adapted {
  margin-top: 0;
}

@media(max-width: 700px) {
  .contact-form-heading h2 {
    white-space: normal;
    font-size: clamp(24px, 7.5vw, 31px);
  }

  .contact-frame {
    margin-top: -205px;
  }

  .contact-frame.is-adapted {
    margin-top: 0;
  }
}


/* =========================================================
   AJUSTES v22
   ========================================================= */

/* Las bandas de contacto de las Home ES/EN usan el mismo fondo del sitio */
.contact-strip {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-top: 1px solid var(--line);
}

.contact-strip h2 {
  color: var(--ink) !important;
}

.contact-strip p {
  color: var(--muted) !important;
}

.contact-button {
  color: var(--heading) !important;
  border-color: var(--heading) !important;
  background: transparent !important;
}

.contact-button:hover {
  color: #ffffff !important;
  background: var(--heading) !important;
  border-color: var(--heading) !important;
}


/* =========================================================
   AJUSTES v23 — Áreas con imagen descriptiva
   ========================================================= */

.area-detail.with-image {
  grid-template-columns: minmax(220px, 1.05fr) minmax(320px, 2fr) 270px;
  gap: 34px;
  align-items: start;
}

.area-detail.with-image .area-visual {
  margin: 0;
  width: 100%;
  height: 180px;
  overflow: hidden;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  justify-self: end;
  align-self: start;
}

.area-detail.with-image .area-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: grayscale(100%) contrast(.98) brightness(1.02);
}

@media(max-width: 980px) {
  .area-detail.with-image {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .area-detail.with-image .area-visual {
    max-width: 420px;
    height: 210px;
    justify-self: start;
  }
}


/* =========================================================
   AJUSTES v24 — Áreas sin imágenes ni CTA individual
   ========================================================= */

.area-detail,
.area-detail.with-image {
  display: grid;
  grid-template-columns: minmax(230px, .95fr) minmax(0, 2.65fr) !important;
  gap: clamp(42px, 6vw, 92px) !important;
  align-items: start;
  padding: 48px 0;
}

.area-detail p {
  max-width: none !important;
  width: 100%;
}

.area-detail .area-visual,
.area-detail .mini-link {
  display: none !important;
}

@media(max-width: 980px) {
  .area-detail,
  .area-detail.with-image {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
}


/* =========================================================
   AJUSTE v25 — Azul institucional unificado
   ========================================================= */

:root {
  --heading: #001F5C;
  --heading-deep: #001F5C;
}

/* Títulos y textos institucionales azules */
.hero h1,
.content-column h2,
.section-head h2,
.page-title h1,
.prose h2,
.prose h3,
.value-grid h3,
.area-detail h2,
.bio-title h2,
.simple-cta p,
.contact-stage-copy h1,
.contact-page-title h1 {
  color: #001F5C !important;
}

/* Bandas y fondos institucionales */
.quote-band,
.site-footer {
  background: #001F5C !important;
}

/* Banda de contacto de Home mantiene el fondo marfil,
   pero sus elementos azules usan el nuevo tono */
.contact-button,
.arrow-link,
.mini-link,
.linkedin-icon,
.contact-privacy-link {
  color: #001F5C !important;
  border-color: #001F5C !important;
}

.contact-button:hover {
  background: #001F5C !important;
  border-color: #001F5C !important;
  color: #ffffff !important;
}


/* =========================================================
   AJUSTE v26 — eliminación del borgoña restante
   ========================================================= */

:root {
  --accent: #001F5C;
  --accent-soft: #001F5C;
}

/* Rectángulo debajo de las fotos y otros acentos visuales */
.hero-photo:after,
.contact-form-surface:before {
  background: #001F5C !important;
}

/* Estados interactivos que antes viraban a borgoña */
.nav-link:hover,
.nav-link.active,
.practice-list a:hover,
.partner-row:hover,
.footer-nav a:hover,
.back-top:hover,
a:hover {
  color: inherit;
}

.nav-link:hover,
.nav-link.active {
  color: #001F5C !important;
}

.nav-link:after {
  background: #001F5C !important;
}

.practice-list a:hover,
.partner-row:hover {
  color: #001F5C !important;
}

.practice-list b,
.partner-row b,
.arrow-link,
.mini-link,
.linkedin-icon,
.contact-privacy-link,
.contact-button,
.back-top,
.footer-nav a:hover {
  color: #001F5C !important;
  border-color: #001F5C !important;
}

/* Pequeños textos/accent labels */
.kicker,
.label,
.label.light,
.contact-strip .eyebrow,
.contact-cta .eyebrow {
  color: #001F5C !important;
}


/* =========================================================
   AJUSTES v27 — Fotografías interiores más integradas
   ========================================================= */

/*
 * Las fotografías de Estudio y Clientes dejan de funcionar como bloques
 * independientes. Se integran al cuerpo de texto como apoyos visuales.
 */
.inset-photo {
  position: relative;
  float: right;
  width: min(35%, 320px);
  height: 245px;
  margin: 4px 0 28px 42px;
  overflow: visible;
  background: var(--paper-soft);
}

.inset-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(100%) contrast(.96) brightness(1.02);
}

.inset-photo:after {
  content: "";
  position: absolute;
  right: 14px;
  bottom: -8px;
  width: 34%;
  height: 8px;
  background: #001F5C;
}

/* Columnas: recorte algo más vertical y contenido. */
.inset-photo-estudio {
  width: min(34%, 300px);
  height: 270px;
}

.inset-photo-estudio img {
  object-position: center 52%;
}

/* Clientes: foto todavía más discreta y horizontal. */
.inset-photo-clientes {
  width: min(36%, 330px);
  height: 205px;
}

.inset-photo-clientes img {
  object-position: center 43%;
}

/* Garantiza que el siguiente bloque comience debajo de la imagen flotante. */
.prose:after {
  content: "";
  display: table;
  clear: both;
}

@media(max-width: 900px) {
  .inset-photo,
  .inset-photo-estudio,
  .inset-photo-clientes {
    float: none;
    width: min(100%, 440px);
    height: 235px;
    margin: 28px 0 34px;
  }
}

@media(max-width: 560px) {
  .inset-photo,
  .inset-photo-estudio,
  .inset-photo-clientes {
    width: 100%;
    height: 210px;
  }
}

/* =========================================================
   AJUSTES v28
   ========================================================= */

/* INDEX: elevar ligeramente la fotografía para alinearla mejor con el título */
.hero-photo {
  transform: translateY(-24px);
}

/* INDEX: rectángulo inferior de la fotografía en gris */
.hero-photo:after {
  background: #8A8A8A !important;
}

/* ESTUDIO y CLIENTES: fotografías eliminadas */
.inset-photo,
.inset-photo-estudio,
.inset-photo-clientes {
  display: none !important;
}

@media(max-width: 900px) {
  .hero-photo {
    transform: none;
  }
}


/* =========================================================
   AJUSTES v30 — Nuevo sistema de logos
   ========================================================= */

/* Header: se utiliza el logo horizontal completo sobre fondos claros */
.brand img {
  display: block;
  width: clamp(250px, 31vw, 470px);
  height: auto;
}

/* Footer: sobre el fondo azul se usa un isotipo simplificado */
.footer-inner > img {
  display: block;
  width: 108px;
  height: auto;
  margin: 0 auto 18px;
}

@media(max-width: 980px) {
  .brand img {
    width: clamp(220px, 44vw, 360px);
  }
}

@media(max-width: 700px) {
  .brand img {
    width: 225px;
  }

  .footer-inner > img {
    width: 92px;
  }
}

/* =========================================================
   AJUSTE v31 — Logo original TSKS en footer
   ========================================================= */

.footer-inner > img {
  width: 104px;
  height: auto;
  object-fit: contain;
}

@media(max-width: 700px) {
  .footer-inner > img {
    width: 88px;
  }
}

/* =========================================================
   AJUSTE v34 — Fondos blancos
   ========================================================= */

:root {
  --paper: #ffffff;
  --paper-soft: #ffffff;
  --white: #ffffff;
}

html,
body {
  background: #ffffff !important;
}

/* Las secciones que antes heredaban el fondo marfil pasan a blanco */
.contact-strip,
.contact-frame,
.contact-frame-crop,
.main-nav {
  background: #ffffff !important;
}

/* =========================================================
   AJUSTE v35 — Header blanco
   ========================================================= */

.site-header {
  background: #ffffff !important;
}

.site-header::before,
.site-header::after {
  background: #ffffff !important;
}

.brand,
.main-nav,
.menu-toggle {
  background: #ffffff !important;
}


/* =========================================================
   v38 SERVIDOR — correcciones de publicación
   ========================================================= */

/* HEADER: blanco absoluto, sin transparencias ni fondos heredados */
html,
body,
.site-header,
.site-header .brand,
.site-header .main-nav,
.site-header .menu-toggle {
  background-color: #ffffff !important;
}

.site-header {
  background-image: none !important;
  opacity: 1 !important;
}

/* CLIENTES: preservar la versión editorial actual */
.article-layout,
.article-layout .prose {
  background: #ffffff !important;
}

.article-layout .prose {
  width: 100%;
  max-width: 960px;
}

/* ---------------------------------------------------------
   CONTACTO
   El iframe conserva intacta la página contacto.html actual.
   No se aplican estilos dentro del iframe: esto evita tocar
   reCAPTCHA, campos ocultos, action y scripts originales.
   --------------------------------------------------------- */
.contact-frame-crop {
  position: relative;
  width: 100%;
  height: 780px;
  min-height: 780px;
  overflow: hidden !important;
  background: #ffffff !important;
}

.contact-frame {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  height: 1080px !important;
  min-height: 1080px !important;
  margin: 0 !important;
  border: 0 !important;
  background: #ffffff !important;

  /*
   * Sólo se desplaza visualmente la página antigua para ocultar
   * su encabezado. No se modifica su DOM interno.
   */
  transform: translateY(-185px);
}

@media(max-width: 700px) {
  .contact-frame-crop {
    height: 900px;
    min-height: 900px;
  }

  .contact-frame {
    height: 1220px !important;
    min-height: 1220px !important;
    transform: translateY(-165px);
  }
}


/* =========================================================
   v39 SERVIDOR — corrección del recorte del formulario
   ========================================================= */

/*
 * En v38 el iframe se desplazaba demasiado hacia arriba y ocultaba
 * Nombre y Apellido. Se reduce sustancialmente ese desplazamiento.
 * No se modifica el contenido interno del formulario ni reCAPTCHA.
 */
.contact-frame-crop {
  height: 900px !important;
  min-height: 900px !important;
}

.contact-frame {
  height: 1120px !important;
  min-height: 1120px !important;
  transform: translateY(-70px) !important;
}

@media(max-width: 700px) {
  .contact-frame-crop {
    height: 1020px !important;
    min-height: 1020px !important;
  }

  .contact-frame {
    height: 1280px !important;
    min-height: 1280px !important;
    transform: translateY(-55px) !important;
  }
}


/* =========================================================
   v40 SERVIDOR — menú móvil iPhone + formulario nativo
   ========================================================= */

/* El viejo iframe deja de utilizarse */
.contact-frame-crop,
.contact-frame {
  display: none !important;
}

/* ---------------------------------------------------------
   MENÚ MÓVIL
   Safari/iPhone: sin fixed ni transformaciones dentro del
   header sticky. Cerrado = display:none; abierto = dropdown.
   --------------------------------------------------------- */
@media(max-width: 980px) {
  .site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 5000 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 10px max(18px, env(safe-area-inset-right)) 10px max(18px, env(safe-area-inset-left)) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .brand {
    min-width: 0 !important;
    background: #ffffff !important;
  }

  .brand img {
    display: block !important;
    width: min(72vw, 310px) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 78px !important;
    object-fit: contain !important;
  }

  .menu-toggle {
    display: block !important;
    position: relative !important;
    width: 44px !important;
    height: 44px !important;
    padding: 8px !important;
    margin: 0 !important;
    border: 0 !important;
    background: #ffffff !important;
    z-index: 2 !important;
  }

  .menu-toggle span {
    width: 26px !important;
    margin: 6px auto !important;
    background: #282321 !important;
  }

  .main-nav {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: calc(100vh - 96px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 18px max(24px, env(safe-area-inset-right)) 24px max(24px, env(safe-area-inset-left)) !important;
    margin: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: #ffffff !important;
    border-top: 1px solid #e7e1dd !important;
    border-bottom: 1px solid #d9ccc2 !important;
    box-shadow: 0 14px 26px rgba(0,0,0,.08) !important;
    z-index: 5001 !important;
  }

  body.menu-open .main-nav {
    display: flex !important;
  }

  body.menu-open {
    overflow: auto !important;
  }

  .main-nav .nav-link {
    display: block !important;
    width: 100% !important;
    padding: 13px 0 !important;
    border-bottom: 1px solid #ece7e3 !important;
    font: 400 20px/1.25 Georgia, "Times New Roman", serif !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #282321 !important;
  }

  .main-nav .nav-link:last-child {
    border-bottom: 0 !important;
  }

  .main-nav .nav-link:after {
    display: none !important;
  }

  .main-nav .nav-link.active {
    color: #001F5C !important;
  }
}

@media(max-width: 700px) {
  .site-header {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .brand img {
    width: min(74vw, 275px) !important;
    max-height: 68px !important;
  }
}

/* ---------------------------------------------------------
   CONTACTO NATIVO
   --------------------------------------------------------- */
.contact-stage-grid {
  grid-template-columns: minmax(240px,.62fr) minmax(0,1.38fr) !important;
}

.contact-form-surface {
  background: #ffffff !important;
}

.native-contact-form {
  width: 100%;
}

.form-status-box {
  display: none;
  margin: 0 0 28px;
  padding: 16px 18px;
  border: 1px solid #d9ccc2;
  font: 400 16px/1.5 Georgia, "Times New Roman", serif;
}

.form-status-box.is-success {
  display: block;
  border-color: #001F5C;
  color: #001F5C;
}

.form-status-box.is-error {
  display: block;
  border-color: #8a3a3a;
  color: #7a2424;
}

.native-form-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 24px 28px;
}

.native-field {
  min-width: 0;
}

.native-field.full {
  grid-column: 1 / -1;
}

.native-field label {
  display: block;
  margin: 0 0 9px;
  color: #282321;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .11em;
}

.native-field label span,
.required-note span {
  color: #001F5C;
}

.native-field input,
.native-field textarea {
  display: block;
  width: 100%;
  border: 1px solid #cfc7c2;
  border-radius: 0;
  background: #ffffff;
  color: #282321;
  padding: 13px 14px;
  font: 400 16px/1.4 Arial,Helvetica,sans-serif;
  -webkit-appearance: none;
  appearance: none;
}

.native-field textarea {
  min-height: 180px;
  resize: vertical;
}

.native-field input:focus,
.native-field textarea:focus {
  outline: 2px solid rgba(0,31,92,.13);
  outline-offset: 0;
  border-color: #001F5C;
}

.native-form-bottom {
  grid-column: 1 / -1;
  margin-top: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.required-note {
  margin: 0;
  color: #766d67;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
}

.native-submit {
  border: 1px solid #001F5C;
  background: #001F5C;
  color: #ffffff;
  padding: 15px 20px;
  cursor: pointer;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .11em;
}

.native-submit:hover {
  background: #ffffff;
  color: #001F5C;
}

.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.verify-help {
  margin: 8px 0 0;
  color: #766d67;
  font: 400 13px/1.45 Georgia,"Times New Roman",serif;
}

@media(max-width: 1040px) {
  .contact-stage-grid {
    grid-template-columns: 1fr !important;
  }
}

@media(max-width: 700px) {
  .contact-stage {
    padding-top: 40px !important;
  }

  .contact-form-surface {
    padding: 24px 18px 30px !important;
  }

  .native-form-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .native-field.full,
  .native-form-bottom {
    grid-column: 1;
  }

  .native-form-bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .native-submit {
    width: 100%;
  }
}


/* =========================================================
   v42 SERVIDOR — envío original TSKS + diseño actual
   ========================================================= */

.recaptcha-field {
  overflow: visible;
}

.recaptcha-field .g-recaptcha {
  transform-origin: left top;
}

@media(max-width: 420px) {
  .recaptcha-field .g-recaptcha {
    transform: scale(.88);
    width: 274px;
  }
}


/* Estado del formulario v45 */
.form-status-box {
  margin: 0 0 24px;
  padding: 14px 16px;
  border: 1px solid #d6d6d6;
  line-height: 1.5;
}
.form-status-box.is-success {
  border-color: #001F5C;
}
.form-status-box.is-error {
  border-color: #9a9a9a;
}