:root{
  --crema:      #F8F4E4;
  --crema-alta: #FDFBF2;
  --tinta:      #0B1E3D;
  --marino:     #1B3B6F;
  --verde:      #145A38;
  --verde-vivo: #1B7A4B;
  --linea:      rgba(27,59,111,.22);
  --linea-suave:rgba(27,59,111,.11);

  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, sans-serif;
  --serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background: var(--crema);
  color: var(--tinta);
  font-family: var(--sans);
  line-height:1.6;
}

a{ color:inherit; }
:focus-visible{ outline:2px solid var(--verde-vivo); outline-offset:3px; border-radius:4px; }

.contenedor{ width:min(1340px, 94vw); margin:0 auto; }

.marca-barra{ padding:24px 0 18px; }
.marca{
  display:inline-block;
  background: var(--marino);
  color: var(--crema-alta);
  padding:11px 22px;
  border-radius:999px;
  font-weight:700;
  font-size:17px;
  letter-spacing:.06em;
  text-decoration:none;
}
.lema{
  margin:12px 0 0;
  font-size:14px;
  color: var(--marino);
  letter-spacing:.01em;
}

.nav-barra{
  background: var(--verde);
  border-top:1px solid var(--marino);
  border-bottom:1px solid var(--marino);
  padding:13px 0;
}
.nav{ display:flex; gap:10px; flex-wrap:wrap; }
.nav a{
  display:inline-flex;
  align-items:center;
  padding:9px 18px;
  border-radius:999px;
  border:1px solid rgba(248,244,228,.55);
  background: transparent;
  color: var(--crema-alta);
  font-size:14.5px;
  font-weight:600;
  text-decoration:none;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.nav a:hover{
  background: var(--crema-alta);
  border-color: var(--crema-alta);
  color: var(--marino);
}
.nav a[aria-current="page"]{
  background: var(--crema-alta);
  border-color: var(--crema-alta);
  color: var(--marino);
  cursor:default;
}

.rejilla{
  display:grid;
  grid-template-columns: minmax(0,1fr) 286px;
  align-items:start;
}
.columna-principal{ padding:38px 66px 64px 0; }
.columna-registro{
  padding:38px 0 64px 30px;
  border-left:1px solid var(--marino);
  position:sticky;
  top:0;
}

.folio{
  font-family: var(--mono);
  font-size:12px;
  letter-spacing:.14em;
  color: var(--verde-vivo);
  font-weight:600;
  margin:0 0 10px;
}
.titulo{
  font-size: clamp(28px, 3.6vw, 44px);
  line-height:1.13;
  letter-spacing:-.02em;
  font-weight:750;
  margin:0 0 12px;
  max-width:26ch;
}
.sello{
  font-family: var(--mono);
  font-size:12.5px;
  color: var(--marino);
  letter-spacing:.04em;
  padding-bottom:20px;
  border-bottom:1px solid var(--linea);
  margin:0 0 28px;
}

.cuerpo{ font-family: var(--serif); font-size:17.5px; line-height:1.72; }
.cuerpo p{ margin:0 0 18px; max-width:74ch; }
.cuerpo > p:first-child{ font-size:19.5px; }
.cuerpo strong{ font-weight:700; }
.cuerpo h2{
  font-family: var(--sans);
  font-size:20px;
  letter-spacing:-.01em;
  margin:34px 0 12px;
  max-width:60ch;
}
.cuerpo h3{
  font-family: var(--sans);
  font-size:16px;
  margin:26px 0 10px;
}
.cuerpo ul, .cuerpo ol{ max-width:70ch; margin:0 0 18px; padding-left:22px; }
.cuerpo li{ margin:6px 0; }
.cuerpo blockquote{
  margin:22px 0;
  padding:2px 0 2px 20px;
  border-left:3px solid var(--verde-vivo);
  color: var(--marino);
  max-width:68ch;
}
.cuerpo a{ color: var(--verde); text-underline-offset:2px; }
.cuerpo code{
  font-family: var(--mono);
  font-size:.88em;
  font-weight:600;
  background: rgba(27,122,75,.10);
  color: var(--verde);
  padding:1px 6px;
  border-radius:4px;
  white-space:nowrap;
}

.cuerpo table{
  width:100%;
  max-width:74ch;
  border-collapse:collapse;
  margin:26px 0;
  font-family: var(--mono);
  font-size:13.5px;
}
.cuerpo table th{
  text-align:left;
  font-weight:600;
  border-bottom:1px solid var(--marino);
  padding:8px 12px 8px 0;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.cuerpo table td{
  padding:9px 12px 9px 0;
  border-bottom:1px solid var(--linea-suave);
}
.cuerpo table td:last-child,
.cuerpo table th:last-child{ text-align:right; padding-right:0; }
.cuerpo table tr:last-child td{ border-bottom:1px solid var(--marino); font-weight:700; }

.pie-articulo{
  margin-top:36px;
  padding-top:18px;
  border-top:1px solid var(--linea);
  display:flex;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  font-size:13px;
  color: var(--marino);
  max-width:74ch;
}
.pie-articulo h2{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 8px;
  color: var(--tinta);
}
.pie-articulo ul{ margin:0; padding-left:16px; }
.pie-articulo li{ margin:3px 0; }
.firma{ font-family: var(--mono); font-size:12.5px; text-align:right; }

.sin-entradas{
  border:1px solid var(--linea);
  border-radius:10px;
  background: var(--crema-alta);
  padding:34px 30px;
  max-width:74ch;
}
.sin-entradas h1{
  font-size:21px;
  font-weight:700;
  letter-spacing:-.01em;
  margin:0 0 8px;
}
.sin-entradas p{
  margin:0;
  font-size:15px;
  color: var(--marino);
  max-width:56ch;
}

.registro-titulo{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:700;
  margin:0 0 4px;
}
.registro-nota{
  font-size:12px;
  color: var(--marino);
  margin:0 0 18px;
}
.registro{ list-style:none; margin:0; padding:0; }
.registro li{ border-bottom:1px solid var(--linea-suave); }
.registro a{
  display:grid;
  grid-template-columns: 82px 1fr;
  gap:10px;
  padding:11px 0;
  text-decoration:none;
  align-items:baseline;
}
.registro a:hover .r-titulo{ color: var(--verde-vivo); }
.r-fecha{
  font-family: var(--mono);
  font-size:11.5px;
  color: var(--marino);
  letter-spacing:.02em;
}
.r-titulo{ font-size:13.5px; line-height:1.42; font-weight:600; transition:color .15s ease; }
.registro .actual .r-fecha{ color: var(--verde-vivo); font-weight:700; }
.registro .actual .r-titulo::after{
  content:"";
  display:inline-block;
  width:6px; height:6px;
  border-radius:50%;
  background: var(--verde-vivo);
  margin-left:7px;
  vertical-align:middle;
}

.registro-hueco{
  font-family: var(--mono);
  font-size:12px;
  color: var(--marino);
  padding:11px 0;
  border-bottom:1px solid var(--linea-suave);
  opacity:.5;
}

.pie{
  border-top:1px solid var(--marino);
  padding:22px 0 40px;
  font-size:12.5px;
  color: var(--marino);
}
.pie-fila{
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.pie a{ text-decoration:none; }
.pie a:hover{ color: var(--verde-vivo); }
.pie-enlaces{ display:flex; gap:18px; flex-wrap:wrap; }

@media (max-width: 960px){
  .rejilla{ grid-template-columns:1fr; }
  .columna-principal{ padding:30px 0 36px; }
  .columna-registro{
    border-left:0;
    border-top:1px solid var(--marino);
    padding:28px 0 60px;
    position:static;
  }
}

@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; }
}

.pagina{ padding:44px 0 70px; }
.bloque{ max-width:78ch; }

.encabezado-pagina{
  padding-bottom:34px;
  border-bottom:1px solid var(--marino);
  margin-bottom:38px;
}
.titulo-pagina{
  font-size: clamp(30px, 4vw, 48px);
  line-height:1.1;
  letter-spacing:-.025em;
  font-weight:750;
  margin:0 0 16px;
  max-width:20ch;
}
.titulo-pagina em{ font-style:normal; color: var(--verde); }
.entradilla{
  font-family: var(--serif);
  font-size:19px;
  line-height:1.65;
  margin:0 0 24px;
  max-width:68ch;
}

.acciones{ display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
.boton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:13px 24px;
  border-radius:999px;
  border:1px solid var(--verde);
  background: var(--verde);
  color: var(--crema-alta);
  font-size:15px;
  font-weight:650;
  text-decoration:none;
  transition: background .15s ease, color .15s ease;
}
.boton:hover{ background: var(--verde-vivo); border-color: var(--verde-vivo); }
.boton--linea{
  background: transparent;
  color: var(--marino);
  border-color: var(--marino);
}
.boton--linea:hover{ background: var(--marino); color: var(--crema-alta); }

.seccion{ padding:44px 0; border-top:1px solid var(--linea); }
.seccion:first-of-type{ border-top:0; padding-top:0; }
.seccion > h2{
  font-size:13px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:700;
  color: var(--verde);
  margin:0 0 18px;
}
.seccion h3{
  font-size:26px;
  letter-spacing:-.015em;
  font-weight:700;
  margin:0 0 14px;
  max-width:28ch;
}
.seccion p{
  font-family: var(--serif);
  font-size:17px;
  line-height:1.7;
  margin:0 0 16px;
  max-width:72ch;
}

.tarjetas{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:26px;
}
.tarjeta{
  border:1px solid var(--linea);
  border-radius:12px;
  background: var(--crema-alta);
  padding:24px 22px;
}
.tarjeta--marcada{ border-color: var(--verde); border-width:2px; }
.bloque-referencia{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(300px, 400px);
  gap:32px;
  align-items:start;
  margin-bottom:28px;
}
.tarjeta h4{
  font-size:15px;
  font-weight:700;
  margin:0 0 4px;
  letter-spacing:-.01em;
}
.tarjeta .escala{
  font-family: var(--mono);
  font-size:11.5px;
  color: var(--marino);
  letter-spacing:.04em;
  margin:0 0 16px;
}
.tarjeta .precio{
  font-family: var(--mono);
  font-size:27px;
  font-weight:700;
  letter-spacing:-.02em;
  margin:0;
  line-height:1.1;
}
.tarjeta .precio-nota{
  font-size:12px;
  color: var(--marino);
  margin:5px 0 18px;
  font-family: var(--sans);
}
.tarjeta ul{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--linea-suave);
  padding-top:14px;
}
.tarjeta li{
  font-family: var(--mono);
  font-size:12px;
  padding:5px 0;
  color: var(--marino);
  display:flex;
  justify-content:space-between;
  gap:10px;
}
.tarjeta li b{ color: var(--tinta); font-weight:600; }

.pasos{ counter-reset:paso; margin-top:24px; }
.paso{
  counter-increment:paso;
  display:grid;
  grid-template-columns:44px 1fr;
  gap:18px;
  padding:20px 0;
  border-bottom:1px solid var(--linea-suave);
  align-items:start;
}
.paso::before{
  content:counter(paso);
  font-family: var(--mono);
  font-size:13px;
  font-weight:700;
  color: var(--crema-alta);
  background: var(--marino);
  width:30px; height:30px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.paso h4{ font-size:16px; font-weight:700; margin:4px 0 6px; }
.paso p{ margin:0; font-size:16px; max-width:64ch; }

.dos-columnas{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:24px;
}
.panel{
  border:1px solid var(--linea);
  border-radius:12px;
  padding:22px;
  background: var(--crema-alta);
}
.panel h4{
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 12px;
  font-weight:700;
}
.panel ul{ margin:0; padding-left:18px; font-size:15px; }
.panel li{ margin:8px 0; line-height:1.55; }

.aviso{
  border-left:3px solid var(--verde);
  background: rgba(27,122,75,.06);
  padding:18px 22px;
  border-radius:0 8px 8px 0;
  margin:26px 0;
  max-width:72ch;
}
.aviso p{ margin:0; font-size:16px; }
.aviso strong{ font-weight:700; }

.pregunta{
  border-bottom:1px solid var(--linea-suave);
  padding:2px 0;
}
.pregunta summary{
  cursor:pointer;
  font-weight:650;
  font-size:16px;
  padding:16px 0;
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
}
.pregunta summary::-webkit-details-marker{ display:none; }
.pregunta summary::after{
  content:"+";
  font-family: var(--mono);
  font-size:19px;
  color: var(--verde);
  flex-shrink:0;
}
.pregunta[open] summary::after{ content:"–"; }
.pregunta p{ margin:0 0 18px; font-size:16px; }

.contacto-caja{
  border:1px solid var(--marino);
  border-radius:12px;
  padding:30px;
  margin-top:26px;
  max-width:72ch;
}

@media (max-width: 860px){
  .tarjetas{ grid-template-columns:1fr; }
  .bloque-referencia{ grid-template-columns:1fr; }
  .dos-columnas{ grid-template-columns:1fr; }
}

.acciones--pegadas{ margin-top:0; }
.nota-fiscal{
  margin-top:22px;
  font-family: var(--sans);
  font-size:14px;
  color: var(--marino);
  max-width:70ch;
}
