/* ============================================================
   en-landings.css — reglas propias de las tres landings
   internacionales en ingles /en/moving-to-uruguay-working-remotely/,
   /en/sas-vs-sole-proprietorship-uruguay/ y
   /en/set-up-company-uruguay-foreigner/ (23/08/2026).

   Se enlaza SOLO desde esas tres paginas, despues de
   ez-design-system-v2.purged.css. Todo scoped bajo .ez-enl.

   ORIGEN. Misma operacion que hizo pt-br-landings.css en su momento:
   copia literal de la hoja hermana con el scope cambiado
   (.ez-ptbr -> .ez-enl). El diseno del cluster ingles es el mismo que
   ya se aprobo para /en/accountant-uruguay-expats/ y se reutilizo en
   PT-BR: mismo hero compacto, misma franja de confianza, mismo
   vocabulario editorial .ez-ed-*.

   POR QUE UNA COPIA Y NO REUSAR pt-br-landings.css. Reusarla obligaria
   a poner class="ez-ptbr" en una pagina inglesa (un nombre que miente
   sobre el idioma) y ataria el cluster ingles a cualquier retoque
   futuro del portugues, que esta EN PRODUCCION e indexado. Una hoja
   propia deja las dos familias independientes. El costo es la
   duplicacion; el beneficio es que tocar EN no puede romper PT.

   UNA HOJA PARA LAS TRES, no una por pagina. Misma excepcion
   deliberada que PT-BR y por la misma razon: son hermanas del mismo
   cluster y comparten el 100% de la composicion.

   No se usa .ez-reveal: pone opacity 0 y solo la devuelve el JS.
   Toda la pagina tiene que leerse aunque falle el JavaScript.
   ============================================================ */

.ez-enl {
  --ez-cool: #f7fafc;
  --ez-pale: #eaf1f6;
  /* Marfil apenas perceptible: separa la nota de Wise/Rise del blanco
     de su seccion sin convertirla en tarjeta ni sumar un color nuevo
     a la paleta (es el dorado de marca al 4%). */
  --ez-ivory: #fdfbf7;
  --ez-rule: #cdd5e0;
  /* Dorado para TEXTO sobre fondo claro. El --gold del sistema
     (#c8a968) da 2,17:1 contra blanco: sirve para un filete, no
     para una palabra (docs/diseno: "El dorado de marca falla
     contraste"). Este valor es el mismo que el sistema usa como
     --bronce. */
  --ez-gold-ink: #7d6229;
}

/* ------------------------------------------------------------
   FOCO VISIBLE — mismo arreglo ya aprobado en las hermanas.
   ------------------------------------------------------------ */
.ez-enl :focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(200, 169, 104, 0.45);
}

.ez-enl .ez-page-hero :focus-visible {
  outline-color: var(--gold);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.35);
}

/* ------------------------------------------------------------
   HERO — escala compacta
   ------------------------------------------------------------
   min-height: 0 anula a proposito los 550px que el sistema fija a
   .ez-page-hero. Patron ya aprobado en /honorarios/, /contador-
   punta-del-este/ y /contador-software-exportacion-uruguay/
   (todas 372-399px): pagina interna y transaccional, no portada. */
.ez-enl .ez-page-hero {
  min-height: 0;
  padding: var(--sp-16) 0;
}

.ez-enl .ez-page-hero__inner {
  max-width: none;
  text-align: left;
}

.ez-enl .ez-page-hero .ez-eyebrow {
  text-align: left;
  margin-bottom: var(--sp-5);
}

.ez-enl .ez-page-hero .ez-eyebrow::after {
  margin: var(--sp-3) 0 0;
}

.ez-enl .ez-page-hero h1 {
  margin-inline: 0;
  margin-bottom: 0;
  max-width: 22ch;
  font-size: clamp(1.9rem, 3.6vw, 2.6rem);
  line-height: 1.14;
}

.ez-enl .ez-hero-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--sp-6) var(--sp-10);
  margin-top: var(--sp-6);
  padding-top: var(--sp-6);
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.ez-enl .ez-page-hero__sub {
  margin: 0;
  max-width: 54ch;
  text-align: left;
}

.ez-enl .ez-page-hero__actions {
  margin: 0;
  justify-content: flex-start;
}

.ez-enl .ez-page-hero .ez-btn--primary {
  background: var(--gold);
  border-color: var(--gold);
  color: #061d36;
  box-shadow: none;
}

.ez-enl .ez-page-hero .ez-btn--primary:hover {
  background: #d6ba78;
  border-color: #d6ba78;
  color: #061d36;
}

@media (max-width: 900px) {
  .ez-enl .ez-hero-row {
    grid-template-columns: 1fr;
    align-items: start;
    gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   FRANJA DE CONFIANZA — tres datos
   ------------------------------------------------------------ */
.ez-enl .ez-pricing-trust {
  background: var(--white);
  padding: var(--sp-8) 0;
}

.ez-enl .ez-pricing-trust__list {
  grid-template-columns: repeat(3, 1fr);
  align-items: start;
}

.ez-enl .ez-pricing-trust__list strong {
  font: 600 0.82rem/1.3 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: var(--sp-3);
}

.ez-enl .ez-pricing-trust__list strong::after {
  margin-top: var(--sp-3);
}

.ez-enl .ez-pricing-trust__list span {
  color: var(--gray-600);
  font-size: 0.95rem;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .ez-enl .ez-pricing-trust {
    padding: var(--sp-5) 0;
  }
  .ez-enl .ez-pricing-trust__list {
    grid-template-columns: 1fr;
    gap: 0;
    text-align: left;
  }
  .ez-enl .ez-pricing-trust__list > li {
    min-height: 0;
    padding: var(--sp-3) 0;
    border-left: 0;
    border-top: 1px solid var(--gray-100);
  }
  .ez-enl .ez-pricing-trust__list > li:first-child {
    padding-top: 0;
    border-top: 0;
  }
  .ez-enl .ez-pricing-trust__list > li:last-child {
    padding-bottom: 0;
  }
  .ez-enl .ez-pricing-trust__list strong {
    margin-bottom: var(--sp-1);
    font-size: 0.75rem;
  }
  .ez-enl .ez-pricing-trust__list strong::after {
    display: none;
  }
  .ez-enl .ez-pricing-trust__list span {
    font-size: 0.9rem;
  }
}

/* ------------------------------------------------------------
   SECCION EDITORIAL — carcasa comun
   ------------------------------------------------------------ */
.ez-enl .ez-ed {
  padding: var(--sp-12) 0;
}

.ez-enl .ez-ed--white { background: var(--white); }
.ez-enl .ez-ed--cool  { background: var(--ez-cool); }
.ez-enl .ez-ed--pale  { background: var(--ez-pale); }

.ez-enl .ez-ed__inner {
  width: min(var(--max-w), calc(100% - var(--side) * 2));
  margin-inline: auto;
}

.ez-enl .ez-ed__head {
  max-width: 74ch;
  margin-bottom: var(--sp-7);
}

.ez-enl .ez-ed__head--tight {
  margin-bottom: var(--sp-6);
}

.ez-enl .ez-ed__head h2 {
  color: var(--navy);
  font-size: clamp(1.6rem, 2.8vw, 2.1rem);
  line-height: 1.18;
  margin: 0;
}

.ez-enl .ez-ed__head h2::after {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  background: var(--gold);
  border-radius: var(--r-pill);
  margin: var(--sp-4) 0 0;
}

.ez-enl .ez-ed__head p {
  margin: var(--sp-5) 0 0;
  max-width: 72ch;
  color: var(--gray-600);
  font-size: 1.02rem;
  line-height: 1.7;
}

.ez-enl .ez-ed__aside {
  margin: var(--sp-7) 0 0;
  color: var(--gray-600);
  font-size: 0.94rem;
  line-height: 1.6;
}

/* ------------------------------------------------------------
   WHAT WE CAN HELP WITH — cuatro columnas editoriales (ez-ed-quad)
   ------------------------------------------------------------ */
.ez-enl .ez-ed-quad {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-8);
  align-items: start;
}

.ez-enl .ez-ed-quad > * {
  padding-top: var(--sp-5);
  border-top: 2px solid var(--gold);
}

.ez-enl .ez-ed-quad h3 {
  margin: 0 0 var(--sp-3);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.3;
}

.ez-enl .ez-ed-quad p {
  margin: 0;
  color: var(--gray-600);
  font-size: 0.96rem;
  line-height: 1.68;
}

/* Separacion entre parrafos consecutivos dentro de una tarjeta.
   En el cluster PT-BR, de donde viene esta hoja, cada tarjeta de la rejilla
   tenia UN solo parrafo, asi que `margin: 0` nunca se noto. Las tres tarjetas
   de perfil de la landing 01 tienen tres parrafos cada una, y sin esto se
   leian como un muro de texto: detectado en la captura movil de #profiles,
   no en el codigo.
   Va con `p + p` para que solo actue cuando hay mas de uno: las tarjetas de
   un parrafo, que son la mayoria del cluster y todas las de PT, conservan
   exactamente el ritmo aprobado. */
.ez-enl .ez-ed-quad p + p {
  margin-top: var(--sp-3);
}

@media (max-width: 1024px) {
  .ez-enl .ez-ed-quad {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-7) var(--sp-8);
  }
}

@media (max-width: 600px) {
  .ez-enl .ez-ed-quad {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   THE URUGUAYAN SIDE OF YOUR CASE — dos columnas (ez-ed-duo)
   ------------------------------------------------------------
   Patron de "Dos formas de trabajar" en /honorarios/: dos bloques
   hermanos con filete dorado arriba, no tarjetas ni tabla. */
.ez-enl .ez-ed-duo {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-12);
  align-items: start;
}

.ez-enl .ez-ed-duo__item {
  padding-top: var(--sp-5);
  border-top: 2px solid var(--gold);
}

.ez-enl .ez-ed-duo__item h3 {
  margin: 0 0 var(--sp-4);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.3;
}

.ez-enl .ez-ed-list {
  display: grid;
  gap: var(--sp-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ez-enl .ez-ed-list li {
  position: relative;
  padding-left: var(--sp-6);
  max-width: 62ch;
  color: var(--gray-600);
  font-size: 0.96rem;
  line-height: 1.65;
}

.ez-enl .ez-ed-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.68em;
  width: 12px;
  height: 1px;
  background: var(--gold);
}

@media (max-width: 860px) {
  .ez-enl .ez-ed-duo {
    grid-template-columns: 1fr;
    gap: var(--sp-8);
  }
}

/* ------------------------------------------------------------
   INTERNATIONAL INCOME — bonus Wise/Rise subordinado
   ------------------------------------------------------------
   El encargo pone un techo explicito: 8-12% de la pagina, y esta
   seccion es secundaria dentro de la landing. Sin logos ni colores
   de marca de terceros.

   Pase visual final (12/08/2026). Antes: cuatro barras con fondo y
   filete, unidas por flechas, mas una nota con fondo azul que
   parecia una tarjeta aparte; el eyebrow, ademas, era la capsula
   del sistema estirada a `display:block`, o sea una barra dorada de
   ancho completo. Ahora la seccion es una composicion editorial de
   tres bandas:

     1. encabezado horizontal (rotulo + H2 | introduccion);
     2. recorrido documental a todo el ancho: una linea de 1px con
        cuatro nodos dorados y la etiqueta debajo de cada nodo;
     3. nota editorial con filete dorado, sin caja.

   Cero flechas y cero chevrones, en HTML y en CSS.

   GEOMETRIA DEL RECORRIDO. Los nodos no se apoyan en el ancho de
   cada etiqueta —que es distinto— sino en la reja `1fr 2fr 2fr 1fr`:
   los centros de las columnas 2 y 3 caen exactamente en los tercios
   del contenedor, asi que la etiqueta interior queda centrada bajo
   su nodo sin transformaciones. El primero y el ultimo se pegan al
   limite (`left: 0` / `right: 0`) para que ningun nodo asome fuera
   del eje de texto, y los dos interiores se corrigen en `nodo/6`
   para que los tres intervalos midan exactamente (W - nodo) / 3.
   Nada depende de un viewport fijo ni de una altura fija.

   Este bloque va al reves que el resto del archivo —primero movil,
   despues `min-width: 769px`— a proposito: la version vertical y la
   horizontal usan selectores `:nth-child`, y escribirlo al reves
   obligaba a pelear especificidad para desarmarlos. */
.ez-enl .ez-ed--intl {
  padding: var(--sp-10) 0;
}

/* --- Banda 1: encabezado ------------------------------------- */
.ez-enl .ez-intl-head {
  display: grid;
  gap: var(--sp-5);
}

.ez-enl .ez-intl-head .ez-ed__head {
  margin-bottom: 0;
  max-width: none;
}

/* El eyebrow del sistema es una capsula con padding, borde y fondo
   dorado. Aca vuelve a ser rotulo editorial plano, el mismo
   tratamiento ya aprobado en el CTA final de esta pagina. */
.ez-enl .ez-ed--intl .ez-eyebrow {
  display: inline-block;
  margin: 0 0 var(--sp-3);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ez-gold-ink);
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ez-enl .ez-ed--intl .ez-eyebrow::after {
  display: none;
}

.ez-enl .ez-intl-head__intro {
  margin: 0;
  max-width: 62ch;
  color: var(--gray-600);
  font-size: 1.02rem;
  line-height: 1.7;
}

/* --- Banda 2: recorrido documental --------------------------- */
/* Movil: linea vertical a la izquierda, nodos sobre ella y
   etiquetas a la derecha. Cada tramo va del centro de un nodo al
   centro del siguiente (`100%` de la fila + el hueco), asi que no
   hace falta saber cuanto mide una fila. */
.ez-enl .ez-intl-trail {
  --ez-nodo: 8px;
  --ez-trail-hueco: var(--sp-10);
  position: relative;
  display: grid;
  row-gap: var(--ez-trail-hueco);
  margin: var(--sp-8) 0 0;
  padding: 0;
  list-style: none;
}

.ez-enl .ez-intl-trail > li {
  position: relative;
  display: flex;
  align-items: center;
  padding-left: var(--sp-6);
}

/* `z-index: 1` para que el nodo quede por encima del tramo de linea:
   el `::after` se pinta despues que el `::before` y, sin esto, la
   linea cruza el punto por el medio y lo parte en dos. */
.ez-enl .ez-intl-trail > li::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0;
  width: var(--ez-nodo);
  height: var(--ez-nodo);
  border-radius: 50%;
  background: var(--ez-gold-ink);
  transform: translateY(-50%);
}

.ez-enl .ez-intl-trail > li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(var(--ez-nodo) / 2);
  width: 1px;
  height: calc(100% + var(--ez-trail-hueco));
  background: var(--ez-rule);
}

.ez-enl .ez-intl-trail > li span {
  display: block;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
}

/* --- Banda 3: nota editorial (Wise/Rise) --------------------- */
.ez-enl .ez-intl-nota {
  display: grid;
  gap: var(--sp-3);
  margin-top: var(--sp-8);
  padding: var(--sp-5) var(--sp-6);
  background: var(--ez-ivory);
  border-left: 2px solid var(--gold);
}

.ez-enl .ez-intl-nota__titulo {
  margin: 0;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.3;
}

.ez-enl .ez-intl-nota__cuerpo p {
  margin: 0;
  max-width: 68ch;
  color: var(--gray-600);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Se nombra el <p> ademas de la clase para ganarle en especificidad a
   la regla de arriba sin recurrir a `!important`. */
.ez-enl .ez-intl-nota__cuerpo p + p {
  margin-top: var(--sp-2);
}

.ez-enl .ez-intl-nota__cuerpo p.ez-intl-nota__fina {
  color: var(--gray-400);
  font-size: 0.82rem;
  line-height: 1.55;
}

@media (min-width: 769px) {
  .ez-enl .ez-intl-head,
  .ez-enl .ez-intl-nota {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: var(--sp-4) var(--sp-10);
  }

  /* El rotulo y la introduccion cierran sobre el mismo eje. */
  .ez-enl .ez-intl-head {
    align-items: end;
  }

  .ez-enl .ez-intl-trail {
    grid-template-columns: 1fr 2fr 2fr 1fr;
    margin-top: var(--sp-10);
  }

  /* La linea va del centro del primer nodo al del ultimo. */
  .ez-enl .ez-intl-trail::before {
    content: "";
    position: absolute;
    top: calc(var(--ez-nodo) / 2);
    left: calc(var(--ez-nodo) / 2);
    right: calc(var(--ez-nodo) / 2);
    height: 1px;
    background: var(--ez-rule);
  }

  .ez-enl .ez-intl-trail > li {
    display: block;
    padding: calc(var(--ez-nodo) + var(--sp-4)) 0 0;
  }

  .ez-enl .ez-intl-trail > li::before {
    top: 0;
    transform: none;
  }

  .ez-enl .ez-intl-trail > li:not(:last-child)::after {
    display: none;
  }

  .ez-enl .ez-intl-trail > li:nth-child(2)::before {
    left: calc(50% + var(--ez-nodo) / 6);
    transform: translateX(-50%);
  }

  .ez-enl .ez-intl-trail > li:nth-child(3)::before {
    left: calc(50% - var(--ez-nodo) / 6);
    transform: translateX(-50%);
  }

  .ez-enl .ez-intl-trail > li:nth-child(4)::before {
    left: auto;
    right: 0;
  }

  /* Cada etiqueta bajo su nodo: la primera abre por la izquierda, la
     ultima cierra por la derecha, las dos interiores centradas. */
  .ez-enl .ez-intl-trail > li:nth-child(2),
  .ez-enl .ez-intl-trail > li:nth-child(3) {
    text-align: center;
  }

  .ez-enl .ez-intl-trail > li:nth-child(4) {
    text-align: right;
  }
}

/* ------------------------------------------------------------
   HOW THE ENGAGEMENT WORKS — recorrido horizontal (ez-ed-ruta)
   ------------------------------------------------------------
   Tres momentos en una sola linea, sin capsulas 01/02/03 ni
   circulos numerados: el rotulo es el momento. */
.ez-enl .ez-ed-ruta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: var(--sp-6);
  border-top: 2px solid var(--gold);
  margin: 0;
  list-style: none;
}

.ez-enl .ez-ed-ruta > li {
  padding-right: var(--sp-8);
}

.ez-enl .ez-ed-ruta > li + li {
  padding-left: var(--sp-8);
  border-left: 1px solid var(--ez-rule);
}

.ez-enl .ez-ed-ruta__label {
  display: block;
  margin-bottom: var(--sp-3);
  color: var(--ez-gold-ink);
  font: 600 0.74rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ez-enl .ez-ed-ruta h3 {
  margin: 0 0 var(--sp-3);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.3;
}

.ez-enl .ez-ed-ruta p {
  margin: 0;
  max-width: 46ch;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

@media (max-width: 900px) {
  .ez-enl .ez-ed-ruta {
    grid-template-columns: 1fr;
    row-gap: var(--sp-6);
  }
  .ez-enl .ez-ed-ruta > li {
    padding-right: 0;
  }
  .ez-enl .ez-ed-ruta > li + li {
    padding-left: 0;
    padding-top: var(--sp-6);
    border-left: 0;
    border-top: 1px solid var(--ez-rule);
  }
}

/* ------------------------------------------------------------
   WHO REVIEWS YOUR CASE + WHERE WE WORK (ez-ed-lugar)
   ------------------------------------------------------------ */
.ez-enl .ez-ed-lugar {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: var(--sp-10);
  padding-top: var(--sp-6);
  border-top: 2px solid var(--gold);
}

.ez-enl .ez-ed-lugar h2 {
  margin: 0 0 var(--sp-4);
  color: var(--navy);
  font-size: clamp(1.5rem, 2.6vw, 1.9rem);
  line-height: 1.2;
}

.ez-enl .ez-ed-lugar p {
  margin: 0;
  max-width: 60ch;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

.ez-enl .ez-ed-lugar p + p {
  margin-top: var(--sp-4);
}

.ez-enl .ez-ed-lugar__ficha {
  padding: var(--sp-5) var(--sp-6);
  background: var(--ez-cool);
  border: 1px solid var(--gray-100);
  border-radius: 2px;
}

.ez-enl .ez-ed-lugar__datos {
  margin: 0;
}

.ez-enl .ez-ed-lugar__ficha dt {
  margin-bottom: var(--sp-2);
  color: var(--gray-400);
  font: 600 0.72rem/1 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ez-enl .ez-ed-lugar__ficha dd {
  margin: 0 0 var(--sp-4);
  color: var(--gray-600);
  font-size: 0.9rem;
  line-height: 1.6;
}

.ez-enl .ez-ed-lugar__datos dd:last-of-type {
  margin-bottom: var(--sp-5);
}

.ez-enl .ez-ed-lugar__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
}

.ez-enl .ez-ed-lugar__acciones .ez-btn {
  flex: 1 1 175px;
  box-shadow: none;
  justify-content: center;
  text-align: center;
}

@media (max-width: 900px) {
  .ez-enl .ez-ed-lugar {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   FAQ — cuatro preguntas, visibles, sin acordeon (ez-ed-faq)
   ------------------------------------------------------------
   Estaticas en el DOM desde el primer pixel: sin <details> ni
   JavaScript de por medio. */
.ez-enl .ez-ed-faq {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--sp-12);
  row-gap: var(--sp-7);
}

.ez-enl .ez-ed-faq__item {
  padding-top: var(--sp-5);
  border-top: 1px solid var(--ez-rule);
}

.ez-enl .ez-ed-faq__item h3 {
  margin: 0 0 var(--sp-3);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.35;
}

.ez-enl .ez-ed-faq__item p {
  margin: 0;
  max-width: 60ch;
  color: var(--gray-600);
  font-size: 0.96rem;
  line-height: 1.68;
}

@media (max-width: 860px) {
  .ez-enl .ez-ed-faq {
    grid-template-columns: 1fr;
    row-gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   ENLACES DE TEXTO — blanco tactil de 24px
   ------------------------------------------------------------ */
.ez-enl .ez-ed a:not(.ez-btn) {
  display: inline;
  padding-block: 3px;
  color: var(--navy);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-underline-offset: 3px;
}

.ez-enl .ez-ed a:not(.ez-btn):hover,
.ez-enl .ez-ed a:not(.ez-btn):focus-visible {
  text-decoration-color: var(--navy);
}

/* ------------------------------------------------------------
   SOURCES AND SCOPE — nota al pie compartida
   ------------------------------------------------------------
   .ez-scope-note / .ez-article-disclaimer son globales: sin regla
   propia aca, se hereda el tratamiento ya aprobado en otras
   landings. */

/* ------------------------------------------------------------
   CTA FINAL
   ------------------------------------------------------------ */
.ez-enl .ez-cta-light {
  background: var(--ez-cool);
  border-top: 1px solid rgba(205, 213, 224, 0.75);
  padding: var(--sp-10) 0;
}

.ez-enl .ez-cta-light .ez-mid-cta__inner {
  width: min(var(--max-w), calc(100% - var(--side) * 2));
  max-width: none;
  margin-inline: auto;
  text-align: center;
}

.ez-enl .ez-cta-light .ez-eyebrow {
  display: inline-block;
  margin: 0 auto var(--sp-4);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--navy);
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ez-enl .ez-cta-light .ez-eyebrow::after {
  display: none;
}

.ez-enl .ez-cta-light h2 {
  margin-inline: auto;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 2.8vw, 2rem);
  font-weight: 600;
  line-height: 1.14;
  text-align: center;
}

.ez-enl .ez-cta-light p {
  margin-inline: auto;
  margin-bottom: var(--sp-6);
  max-width: 62ch;
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.6;
  text-align: center;
}

.ez-enl .ez-cta-light .ez-mid-cta__actions {
  justify-content: center;
}

.ez-enl .ez-cta-light .ez-btn {
  box-shadow: none;
  font-family: var(--font-body);
  font-weight: 600;
}

/* ------------------------------------------------------------
   MOVIL
   ------------------------------------------------------------
   Cuerpo a 0,94rem con interlinea 1,6 o mas. Ningun control baja
   de 44px ni ningun enlace de 24px. */
@media (max-width: 640px) {
  .ez-enl .ez-ed {
    padding: var(--sp-8) 0;
  }
  .ez-enl .ez-ed__head {
    margin-bottom: var(--sp-6);
  }
  .ez-enl .ez-ed__head p,
  .ez-enl .ez-ed-quad p,
  .ez-enl .ez-ed-list li,
  .ez-enl .ez-ed-ruta p,
  .ez-enl .ez-ed-lugar p,
  .ez-enl .ez-ed-faq__item p,
  .ez-enl .ez-intl-head__intro,
  .ez-enl .ez-intl-nota__cuerpo p {
    font-size: 0.94rem;
    line-height: 1.62;
  }

  .ez-enl .ez-page-hero {
    padding: var(--sp-10) 0;
  }
  .ez-enl .ez-page-hero .ez-eyebrow {
    margin-bottom: var(--sp-4);
  }
  .ez-enl .ez-hero-row {
    gap: var(--sp-5);
    margin-top: var(--sp-5);
    padding-top: var(--sp-5);
  }
  .ez-enl .ez-page-hero h1 {
    font-size: clamp(1.6rem, 6.2vw, 2.1rem);
    max-width: none;
  }
  .ez-enl .ez-page-hero__sub {
    font-size: 0.98rem;
  }
  .ez-enl .ez-page-hero__actions {
    gap: var(--sp-2);
  }
  .ez-enl .ez-page-hero__actions .ez-btn,
  .ez-enl .ez-ed-lugar__acciones .ez-btn {
    width: 100%;
    max-width: 340px;
  }
  .ez-enl .ez-cta-light {
    padding: var(--sp-10) 0;
  }
}

/* ============================================================
   AGREGADOS DEL CLUSTER PT-BR
   ============================================================
   Todo lo de arriba es la hoja inglesa con otro scope. Lo que sigue
   son las piezas que las landings portuguesas necesitan y aquella no
   tenia: rejillas de 3 y 6 columnas, cita editorial, prosa corrida
   dentro de una seccion, tabla comparativa y la ficha de honorario.
   ============================================================ */

/* ------------------------------------------------------------
   REJILLAS DE 3 Y 6 — misma anatomia que .ez-ed-quad
   ------------------------------------------------------------
   .ez-ed-quad--tri: tres perfiles o tres pasos que no son un
   recorrido (para un recorrido esta .ez-ed-ruta).
   .ez-ed-quad--sextet: los seis puntos que tienen que conversar
   entre si. Tres arriba, tres abajo: en dos columnas quedaban
   pares que sugerian una relacion que no existe. */
.ez-enl .ez-ed-quad--tri,
.ez-enl .ez-ed-quad--sextet {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-8);
}

.ez-enl .ez-ed-quad--sextet {
  row-gap: var(--sp-10);
}

@media (max-width: 1024px) {
  .ez-enl .ez-ed-quad--tri,
  .ez-enl .ez-ed-quad--sextet {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-7) var(--sp-8);
  }
}

@media (max-width: 600px) {
  .ez-enl .ez-ed-quad--tri,
  .ez-enl .ez-ed-quad--sextet {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
}

/* Numero de orden de los seis puntos. Va en el ::before del <h3> y
   no en el texto, para que el lector de pantalla lea el titulo y no
   una cifra suelta. Es decorativo: el orden real lo da el DOM. */
.ez-enl .ez-ed-quad--sextet > * {
  counter-increment: ez-punto;
}

.ez-enl .ez-ed-quad--sextet {
  counter-reset: ez-punto;
}

.ez-enl .ez-ed-quad--sextet h3::before {
  content: counter(ez-punto) ".";
  margin-right: var(--sp-2);
  color: var(--ez-gold-ink);
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 700;
}

/* ------------------------------------------------------------
   CITA EDITORIAL — la pregunta que reencuadra
   ------------------------------------------------------------
   Las cuatro landings apoyan su argumento en una frase corta que
   cambia el marco ("cliente no exterior es un dato del caso, no la
   conclusion"). No es una tarjeta ni un aviso: es tipografia. */
.ez-enl .ez-ed-cita {
  margin: var(--sp-8) 0 0;
  padding: 0 0 0 var(--sp-6);
  border-left: 2px solid var(--gold);
}

/* La cita cierra casi siempre la seccion, y por eso su margen inferior es 0.
   En #order de la landing 03 va EN EL MEDIO, seguida del recorrido: sin esto,
   su ultima linea quedaba a 27px de la linea dorada del recorrido (solo el
   padding-top de la ol) y las dos piezas se leian chocadas. Selector de
   hermano adyacente: no mueve ninguna otra cita del cluster. */
.ez-enl .ez-ed-cita + .ez-ed-ruta {
  margin-top: var(--sp-7);
}

.ez-enl .ez-ed-cita p {
  margin: 0;
  max-width: 56ch;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: clamp(1.05rem, 1.9vw, 1.28rem);
  font-weight: 600;
  line-height: 1.45;
}

.ez-enl .ez-ed-cita p + p {
  margin-top: var(--sp-3);
}

/* Variante de cierre de seccion: mismo filete, texto normal. Se usa
   cuando la frase remata un bloque de prosa en vez de abrirlo. */
.ez-enl .ez-ed-cita--suave p {
  color: var(--gray-600);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
}

/* ------------------------------------------------------------
   PROSA CORRIDA DENTRO DE UNA SECCION
   ------------------------------------------------------------
   Bloques donde el argumento es un texto, no una rejilla. Ancho de
   lectura acotado: 68ch, el mismo del resto del sitio. */
.ez-enl .ez-ed__texto {
  max-width: 68ch;
}

.ez-enl .ez-ed__texto p {
  margin: 0 0 var(--sp-4);
  color: var(--gray-600);
  font-size: 1rem;
  line-height: 1.72;
}

.ez-enl .ez-ed__texto p:last-child {
  margin-bottom: 0;
}

.ez-enl .ez-ed__texto strong {
  color: var(--navy);
}

/* RETIRADO 23/08/2026: existia un modificador --duo que ponia la prosa en
   dos columnas sin titulo ni filete. Se veia sin forma, y sobre todo la
   columna derecha no tenia motivo visible para ser una columna: el lector no
   sabia si continuaba la izquierda o la contradecia. Los cuatro bloques que
   lo usaban pasaron a .ez-ed-duo, que nombra cada mitad con un H3 y un filete
   dorado. Si vuelve a hacer falta prosa a dos frentes, esta .ez-ed-frente. */

/* ------------------------------------------------------------
   TABLA COMPARATIVA
   ------------------------------------------------------------
   .ez-table / .ez-table-wrap son del sistema compartido y ya traen
   el modo tarjeta en movil (thead oculto y `content: attr(data-label)`
   por celda: por eso cada <td> lleva data-label). Aca solo se ajusta
   el aire y el color del encabezado dentro de la seccion editorial. */
.ez-enl .ez-table-wrap {
  margin: var(--sp-7) 0 0;
}

.ez-enl .ez-table th {
  white-space: normal;
}

.ez-enl .ez-table td strong {
  color: var(--navy);
}

.ez-enl .ez-tabla-nota {
  margin: var(--sp-5) 0 0;
  max-width: 68ch;
  color: var(--gray-600);
  font-size: 0.94rem;
  line-height: 1.65;
}

/* ------------------------------------------------------------
   NOTA DE ALCANCE — dentro de .ez-ed-lugar__ficha
   ------------------------------------------------------------
   El bloque del Diagnostico Fiscal reusa la composicion de
   .ez-ed-lugar (cuerpo + ficha lateral). La ficha cierra con la nota
   de alcance: que se confirma por escrito antes de empezar.

   NO HAY CIFRA, y es decision de Matias (22/08/2026). El encargo
   original publicaba "USD 200" en las cuatro landings; se retiro
   porque el objetivo de la pagina es que el lector escriba, no que
   compare precios, y porque el sitio en espanol tampoco publica
   honorarios (/diagnostico-fiscal/ y /honorarios/ los confirman por
   escrito). Si algun dia vuelve una cifra, vuelve en los dos idiomas
   a la vez. */
.ez-enl .ez-ficha-alcance {
  color: var(--gray-600);
  font-size: 0.9rem;
  line-height: 1.6;
}

/* ------------------------------------------------------------
   NAVEGACION DEL CLUSTER — las otras tres landings
   ------------------------------------------------------------
   Cierra cada pagina antes del CTA final. Sin tarjetas: rotulo,
   titulo enlazado y una linea de para que sirve. */
.ez-enl .ez-ed-cluster {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-8);
  padding-top: var(--sp-6);
  border-top: 2px solid var(--gold);
  margin: 0;
  list-style: none;
}

.ez-enl .ez-ed-cluster h3 {
  margin: 0 0 var(--sp-2);
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;
}

/* Area tactil del enlace del cluster.
   Medido con scripts/auditar-pagina.mjs: el <a> dentro del h3 daba 22px de
   alto en los 14 anchos (1.05rem x 1.35 de interlineado), 2px por debajo del
   minimo de 24px que fija el guardrail para cualquier enlace visible. Eran los
   3 unicos controles por debajo del umbral en toda la pagina, y explicaban la
   diferencia con /en/accountant-uruguay-expats/, que no tiene bloque de
   cluster y mide 0.
   El padding agranda el blanco y el margen negativo lo compensa, asi que el
   ritmo vertical de la rejilla no se mueve ni un pixel: cambia el area
   utilizable, no la composicion.
   POR QUE EL SELECTOR LLEVA `.ez-ed` EN EL MEDIO, que parece redundante: mas
   arriba en esta misma hoja vive `.ez-enl .ez-ed a:not(.ez-btn)`, que fija
   `display: inline`. Su especificidad es (0,3,1), porque `:not()` suma el peso
   de lo que lleva dentro. El selector natural aca, `.ez-enl .ez-ed-cluster h3
   a`, es (0,2,2) y PIERDE: el padding se aplicaba y el `display` quedaba
   descartado, asi que el enlace seguia midiendo 22px y el arreglo parecia no
   funcionar. Agregar `.ez-ed` sube a (0,3,2) y gana por una clase. No se usa
   !important: la cascada alcanza.
   NOTA: la hoja hermana pt-br-landings.css tiene el mismo detalle sin
   corregir. NO se toca desde aqui: esas cuatro paginas estan en produccion e
   indexadas y no son parte de este encargo. Queda anotado en el informe. */
.ez-enl .ez-ed .ez-ed-cluster h3 a {
  display: inline-block;
  padding-block: 3px;
  margin-block: -3px;
}

.ez-enl .ez-ed-cluster p {
  margin: 0;
  color: var(--gray-600);
  font-size: 0.94rem;
  line-height: 1.65;
}

@media (max-width: 860px) {
  .ez-enl .ez-ed-cluster {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   RECORRIDO DE CUATRO PASOS
   ------------------------------------------------------------
   .ez-ed-ruta es de tres columnas porque las paginas hermanas tienen
   tres momentos. La comparacion de estructuras (landing 02) y la
   implementacion (landing 03) tienen cuatro y cinco: misma anatomia,
   otra reja. En movil las tres variantes caen a una columna con el
   filete arriba, que ya lo resuelve la regla base. */
.ez-enl .ez-ed-ruta--quatro {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ez-enl .ez-ed-ruta--cinco {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ez-enl .ez-ed-ruta--quatro > li,
.ez-enl .ez-ed-ruta--cinco > li {
  padding-right: var(--sp-6);
}

.ez-enl .ez-ed-ruta--quatro > li + li,
.ez-enl .ez-ed-ruta--cinco > li + li {
  padding-left: var(--sp-6);
}

/* Seis momentos: la reja base de tres columnas, en dos filas. Correccion del
   barrido visual 23/08 sobre /en/set-up-company-uruguay-foreigner/#order, que
   usaba la base a secas con 6 items y heredaba dos defectos medidos:
   - las filas quedaban PEGADAS (row-gap normal = 0: la fila 2 arrancaba en el
     mismo pixel donde terminaba la 1, y el texto largo de "Diagnosis" tocaba
     el label FOURTH);
   - el item 4 recibia el separador de `li + li` (borde izquierdo + sangria de
     32px) como si fuera columna interior, cuando abre la fila 2 y debe ir
     alineado al eje como el item 1.
   nth-child(3n+1) = items 1 y 4: el primero de cada fila de tres. La
   especificidad (0,3,1) le gana a la base `li + li` (0,2,2) sin !important.
   En movil no cambia nada: alli la base cae a una columna y usa divisores
   horizontales, que el item 4 conserva. */
.ez-enl .ez-ed-ruta--seis > li:nth-child(3n + 1) {
  padding-left: 0;
  border-left: 0;
}

@media (min-width: 901px) {
  .ez-enl .ez-ed-ruta--seis {
    row-gap: var(--sp-8);
  }
}

/* Dos filas de dos (y de tres) antes de caer a la columna unica: con
   cuatro o cinco items, el salto directo de 4 a 1 deja un tramo de
   tablet con lineas de 20 caracteres. */
@media (max-width: 1100px) {
  .ez-enl .ez-ed-ruta--quatro,
  .ez-enl .ez-ed-ruta--cinco {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: var(--sp-7);
  }
  .ez-enl .ez-ed-ruta--quatro > li:nth-child(odd),
  .ez-enl .ez-ed-ruta--cinco > li:nth-child(odd) {
    padding-left: 0;
    border-left: 0;
  }
}

@media (max-width: 900px) {
  .ez-enl .ez-ed-ruta--quatro,
  .ez-enl .ez-ed-ruta--cinco {
    grid-template-columns: 1fr;
  }
  .ez-enl .ez-ed-ruta--quatro > li,
  .ez-enl .ez-ed-ruta--cinco > li {
    padding-right: 0;
  }
  .ez-enl .ez-ed-ruta--quatro > li + li,
  .ez-enl .ez-ed-ruta--cinco > li + li {
    padding-left: 0;
    padding-top: var(--sp-6);
    border-left: 0;
    border-top: 1px solid var(--ez-rule);
  }
}

/* ------------------------------------------------------------
   TITULOS INTERMEDIOS DENTRO DE .ez-ed-lugar
   ------------------------------------------------------------
   La hoja inglesa no los tenia: alli el bloque de sede era H2 +
   parrafos + <dl>, sin ningun H3. Las landings PT-BR si los usan
   ("O que analisamos", "O que voce recebe", "Para quem serve"), y
   sin regla propia el H3 heredaba el margen del sistema y quedaba
   pegado al parrafo anterior. */
.ez-enl .ez-ed-lugar__cuerpo h3,
.ez-enl .ez-ed-lugar__ficha h3 {
  margin: var(--sp-7) 0 var(--sp-4);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.32;
}

.ez-enl .ez-ed-lugar__ficha > h3:first-child {
  margin-top: 0;
}

/* La nota de alcance. Se nombra el elemento ademas de la clase para
   ganarle en especificidad a `.ez-enl .ez-ed-lugar p`, que pone
   `margin: 0` a todo parrafo del bloque: sin esto, el boton quedaba
   pegado a la letra chica. */
.ez-enl .ez-ed-lugar p.ez-ficha-alcance {
  margin: var(--sp-5) 0 var(--sp-6);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--ez-rule);
}

/* ------------------------------------------------------------
   SECCION A DOS FRENTES — encabezado a la izquierda, remate a la derecha
   ------------------------------------------------------------
   Para secciones cortas cuyo cuerpo es una sola cita. Apiladas a lo
   ancho completo dejaban media pagina en blanco: el barrido de huecos
   (scripts/check-huecos-visuales.mjs) marcaba 493px de desbalance en
   "A pergunta que realmente fazemos". Misma reja que .ez-intl-head. */
.ez-enl .ez-ed-frente {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: var(--sp-10);
  align-items: start;
}

.ez-enl .ez-ed-frente .ez-ed__head {
  margin-bottom: 0;
}

.ez-enl .ez-ed-frente .ez-ed-cita {
  margin-top: 0;
}

@media (max-width: 900px) {
  .ez-enl .ez-ed-frente {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
}

/* ------------------------------------------------------------
   FICHA DE ATESTACION PROFESIONAL
   ------------------------------------------------------------
   Va debajo de la nota de alcance, dentro del mismo .ez-scope-note.
   Declara autor, revisor, matriculas CCEAU y fecha de revision.

   POR QUE UNA CLASE PROPIA Y NO .ez-ed-legal, que es la que usa la
   landing portuguesa de software para lo mismo: .ez-ed-legal NO EXISTE
   en ninguna hoja del sitio. Se comprobo el 23/08/2026 sobre los cuatro
   archivos CSS: 0 apariciones. Esa ficha portuguesa se esta renderizando
   sin estilo propio. Copiar el marcado habria copiado el defecto.

   El filete dorado a la izquierda no es decoracion: separa visualmente
   una afirmacion hecha BAJO MATRICULA del texto informativo que tiene
   encima. Es el mismo recurso que usa .ez-practice-note en el sistema
   compartido.
   ------------------------------------------------------------ */
.ez-enl .ez-enl-ficha {
  /* Correccion del barrido visual 23/08: la ficha vivia directamente dentro
     de .ez-scope-note, que es full-width, y sin ancho propio se estiraba de
     borde a borde (medido: 1440px con x=0 mientras toda la pagina vive en el
     eje de 1200). Mismo dimensionado que el sistema le da al disclaimer de
     la scope-note: el eje de la pagina, centrado. */
  width: min(var(--max-w), calc(100% - var(--side) * 2));
  margin: var(--sp-6) auto 0;
  padding: var(--sp-5);
  border: 1px solid var(--gray-100);
  border-left: 4px solid var(--gold);
  border-radius: var(--r-md);
  background: var(--white);
}

.ez-enl .ez-enl-ficha h2 {
  margin: 0 0 var(--sp-4);
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--navy);
}

.ez-enl .ez-enl-ficha dl {
  display: grid;
  grid-template-columns: minmax(9rem, auto) 1fr;
  gap: var(--sp-2) var(--sp-5);
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.65;
}

.ez-enl .ez-enl-ficha dt {
  font-weight: 600;
  color: var(--navy);
}

.ez-enl .ez-enl-ficha dd {
  margin: 0;
  color: var(--gray-600);
}

/* Misma correccion de area tactil que en el bloque de cluster: el enlace
   inline dentro del dd se queda por debajo de los 24px, y pierde por
   especificidad contra `.ez-ed a:not(.ez-btn)` si el selector no lleva
   suficiente peso. Aca no hace falta encadenar `.ez-ed` porque la ficha
   vive fuera de las secciones .ez-ed, pero el padding si. */
.ez-enl .ez-enl-ficha dd a {
  display: inline-block;
  padding-block: 3px;
  margin-block: -3px;
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ez-enl .ez-enl-ficha__nota {
  color: var(--gray-600);
  font-size: 0.88rem;
}

@media (max-width: 640px) {
  .ez-enl .ez-enl-ficha dl {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .ez-enl .ez-enl-ficha dd {
    margin: 0 0 var(--sp-3);
  }
  .ez-enl .ez-enl-ficha dd:last-child {
    margin-bottom: 0;
  }
}