/* ============================================================
   regularizar-deuda-dgi.css — reglas propias de
   /regularizar-deuda-dgi/ (25/08/2026, P6).

   NO ES UN DISENO NUEVO. Es liquidacion-sueldos-empresas.css con el
   scope renombrado a .ez-dgi-page, sin los bloques que esta pagina no
   usa (perfiles, google-reviews: no hay resena verificable sobre
   deuda/regularizacion DGI, ver comentario en main.html) y con las
   reglas de .ez-ed-list tomadas de accountant-uruguay-expats.css, que
   esta pagina si necesita para el checklist de la seccion 6.

   POR QUE SE DUPLICA EN VEZ DE COMPARTIR: es el patron del repo. La
   familia .ez-ed no existe en ez-design-system-v2.purged.css y se
   redeclara en cada CSS por pagina bajo su propia clase raiz.

   Se enlaza SOLO desde esta pagina, despues de
   ez-design-system-v2.purged.css.
   ============================================================ */

/* Tokens locales de la familia .ez-ed, mismos valores que las paginas
   madre (contador-punta-del-este, contabilidad-maldonado, honorarios).
   La copia original los dejo afuera y todo var(--ez-*) se descartaba
   entero: la pagina renderizaba sin fondos de seccion ni filetes.
   Detectado el 25/08/2026 midiendo backgroundColor en el navegador. */
.ez-dgi-page {
  --ez-cool: #f7fafc;
  --ez-pale: #eaf1f6;
  --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. Este valor da 5,0:1 sobre el azul niebla. */
  --ez-gold-ink: #7d6229;
}

/* ------------------------------------------------------------
   FOCO VISIBLE — mismo arreglo ya aprobado en /honorarios/ y
   /liquidacion-sueldos-empresas/: navy con halo dorado, invertido
   sobre el hero navy.
   ------------------------------------------------------------ */
.ez-dgi-page :focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(200, 169, 104, 0.45);
}

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

/* ------------------------------------------------------------
   HERO — escala compacta, mismo patron que /liquidacion-sueldos-empresas/
   ------------------------------------------------------------ */
.ez-dgi-page .ez-page-hero {
  min-height: 0;
  padding: var(--sp-16) 0;
}

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

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

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

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

.ez-dgi-page .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-dgi-page .ez-page-hero__sub {
  margin: 0;
  max-width: 56ch;
  text-align: left;
}

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

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

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

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


/* ------------------------------------------------------------
   FRANJA DE CONFIANZA — tres datos, mismo patron que /honorarios/
   y /liquidacion-sueldos-empresas/
   ------------------------------------------------------------ */
.ez-dgi-page .ez-pricing-trust {
  background: var(--white);
  padding: var(--sp-8) 0;
}

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

.ez-dgi-page .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-dgi-page .ez-pricing-trust__list strong::after {
  margin-top: var(--sp-3);
}

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

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

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

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

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

.ez-dgi-page .ez-ed__head {
  max-width: 74ch;
  margin-bottom: var(--sp-6);
}

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

.ez-dgi-page .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-dgi-page .ez-ed__head p {
  margin: var(--sp-5) 0 0;
  max-width: 74ch;
  color: var(--gray-600);
  font-size: 1.02rem;
  line-height: 1.7;
}

/* ------------------------------------------------------------
   QUE PUEDE ESTAR PENDIENTE — cuatro columnas editoriales
   ------------------------------------------------------------ */
.ez-dgi-page .ez-ed-quad {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-8);
  align-items: start;
}

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

.ez-dgi-page .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-dgi-page .ez-ed-quad p {
  margin: 0;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

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

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


/* ------------------------------------------------------------
   CUANDO PUEDE EVALUARSE UN CONVENIO — matriz de dos por dos
   ------------------------------------------------------------ */
.ez-dgi-page .ez-ed-spec {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--sp-12);
  row-gap: var(--sp-7);
  margin: 0;
}

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

.ez-dgi-page .ez-ed-spec dt {
  margin-bottom: var(--sp-3);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.3;
}

.ez-dgi-page .ez-ed-spec dd {
  margin: 0;
  max-width: 62ch;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

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


/* ------------------------------------------------------------
   COMO TRABAJAMOS — banda, tres momentos
   ------------------------------------------------------------ */
.ez-dgi-page .ez-ed-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: var(--ez-pale);
  border-left: 3px solid var(--gold);
  padding: var(--sp-8) 0;
}

.ez-dgi-page .ez-ed-step {
  padding: 0 var(--sp-8);
}

.ez-dgi-page .ez-ed-step + .ez-ed-step {
  border-left: 1px solid var(--ez-rule);
}

.ez-dgi-page .ez-ed-step__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-dgi-page .ez-ed-step 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-dgi-page .ez-ed-step p {
  margin: 0;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

@media (max-width: 900px) {
  .ez-dgi-page .ez-ed-steps {
    grid-template-columns: 1fr;
    padding: 0;
  }
  .ez-dgi-page .ez-ed-step {
    padding: var(--sp-6);
  }
  .ez-dgi-page .ez-ed-step + .ez-ed-step {
    border-left: 0;
    border-top: 1px solid var(--ez-rule);
  }
}

/* ------------------------------------------------------------
   QUE NECESITAMOS — checklist, misma regla que
   accountant-uruguay-expats.css
   ------------------------------------------------------------ */
.ez-dgi-page .ez-ed-list {
  display: grid;
  gap: var(--sp-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Sin max-width: la lista va sola a ancho completo de .ez-ed__inner
   (1200px), no dentro de una columna como en /honorarios/. Con el tope
   de 62ch los renglones cortaban a mitad del contenedor y la seccion
   quedaba con la mitad derecha vacia; el corte debe darse en el margen
   real. Mismo principio ya documentado en software-exportacion.css
   ("el renglon se llena antes de cortar"). */
.ez-dgi-page .ez-ed-list li {
  position: relative;
  padding-left: var(--sp-6);
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

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

/* ------------------------------------------------------------
   PREGUNTAS — visibles, sin acordeon
   ------------------------------------------------------------ */
.ez-dgi-page .ez-ed-faq {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--sp-12);
  row-gap: var(--sp-7);
}

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

.ez-dgi-page .ez-ed-faq__item 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.35;
}

.ez-dgi-page .ez-ed-faq__item p {
  margin: 0;
  max-width: 62ch;
  color: var(--gray-600);
  font-size: 0.98rem;
  line-height: 1.7;
}

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


/* ------------------------------------------------------------
   ENLACES DE TEXTO — blanco tactil de 24px
   ------------------------------------------------------------ */
.ez-dgi-page .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-dgi-page .ez-ed a:not(.ez-btn):hover,
.ez-dgi-page .ez-ed a:not(.ez-btn):focus-visible {
  text-decoration-color: var(--navy);
}

/* ------------------------------------------------------------
   CTA FINAL
   ------------------------------------------------------------ */
.ez-dgi-page .ez-cta-light {
  background: var(--white);
}

.ez-dgi-page .ez-mid-cta__inner p {
  max-width: 62ch;
}


/* Nota al pie de seccion. En software-exportacion .ez-ed-src es una
   LISTA de fuentes (li > span) y su display:grid apila las filas; aca
   la clase vive en PARRAFOS con enlaces en linea, y ese mismo grid
   convertia cada <a> en fila propia, partiendo la frase en pedazos.
   Bloque normal, con aire contra el bloque anterior (antes quedaba
   pegado al borde de la seccion de arriba). Las reglas de li se
   fueron: aca no hay listas con esta clase. */
.ez-dgi-page .ez-ed-src {
  display: block;
  margin: var(--sp-7) 0 0;
  padding-top: var(--sp-4);
  border-top: 1px solid var(--ez-rule);
}
