/* Establece que el tamaño del elemento incluye padding y border */
* {
  box-sizing: border-box;
}

/**
 * 1. Corrige la altura de línea en todos los navegadores.
 * 2. Evita ajustes de tamaño de fuente después de cambios de orientación en iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  scroll-behavior: smooth; /* Habilita un desplazamiento suave */
}

/* Remueve el margen en todos los navegadores */
body {
  margin: 0;
  position: relative;
}

/* Elimina referencia a IE */
main {
  display: block;
}

/* Corrige el tamaño de fuente y el margen en los elementos `h1` dentro de `section` y `article` en Chrome, Firefox y Safari */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Asegura que el texto en títulos y párrafos se envuelva correctamente */
h1,
h2,
h3,
h4 {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

/* Agrupación de contenido
   ========================================================================== */

/**
 * 1. Añade el box sizing correcto en Firefox.
 * 2. Remueve soporte específico para IE/Edge.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* Establece la altura del hr a 0 */
}

/**
 * 1. Corrige la herencia y el escalado del tamaño de fuente en todos los navegadores.
 * 2. Corrige el tamaño de fuente inusual en todos los navegadores.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Semántica a nivel de texto
   ========================================================================== */

/* Remueve soporte para IE 10 */
a {
  background-color: transparent;
}

/**
 * 1. Remueve el borde inferior en Chrome 57-.
 * 2. Añade la decoración de texto correcta en Chrome, Edge, Opera y Safari.
 * 3. Remueve soporte para IE.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/* Añade el peso de fuente correcto en Chrome, Edge y Safari */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Corrige la herencia y el escalado del tamaño de fuente en todos los navegadores.
 * 2. Corrige el tamaño de fuente inusual en todos los navegadores.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Añade el tamaño de fuente correcto en todos los navegadores */
small {
  font-size: 80%;
}

/* Evita que los elementos `sub` y `sup` afecten la altura de línea en todos los navegadores */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em; /* Ajusta la posición vertical del subíndice */
}

sup {
  top: -0.5em; /* Ajusta la posición vertical del superíndice */
}

/* Establece el color de fondo amarillo y el texto negro cuando se selecciona */
label::-moz-selection, em::-moz-selection, img::-moz-selection, a::-moz-selection, p::-moz-selection, h1::-moz-selection, h2::-moz-selection, h3::-moz-selection, h4::-moz-selection, h5::-moz-selection, h6::-moz-selection, span::-moz-selection, strong::-moz-selection, br::-moz-selection, th::-moz-selection, td::-moz-selection, tr::-moz-selection, li::-moz-selection, cite::-moz-selection, time::-moz-selection, blockquote::-moz-selection {
  background-color: #ffff00;
  color: #000000;
}
label::selection,
em::selection,
img::selection,
a::selection,
p::selection,
h1::selection,
h2::selection,
h3::selection,
h4::selection,
h5::selection,
h6::selection,
span::selection,
strong::selection,
br::selection,
th::selection,
td::selection,
tr::selection,
li::selection,
cite::selection,
time::selection,
blockquote::selection {
  background-color: #ffff00;
  color: #000000;
}

/* Contenido embebido
   ========================================================================== */

/* Hace que las imágenes sean responsivas y previene que se desborden */
img {
  max-width: 100%;
}

/* Formularios
   ========================================================================== */

/**
 * 1. Cambia los estilos de fuente en todos los navegadores.
 * 2. Remueve el margen en Firefox y Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/* Remueve soporte específico para IE/Edge */
button,
input {
  overflow: visible;
}

/* Remueve la herencia de la transformación de texto en Firefox */
button,
select {
  text-transform: none;
}

/* Corrige la incapacidad de estilizar tipos clicables en iOS y Safari */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/* Remueve el borde interno y el padding en Firefox */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/* Restaura los estilos de enfoque deshabilitados por la regla anterior */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/* Corrige el padding en Firefox */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/* Elimina referencias a IE */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/* Añade la alineación vertical correcta en Chrome, Firefox y Opera */
progress {
  vertical-align: baseline;
}

/* Remueve soporte específico para IE 10+ */
textarea {
  overflow: auto;
}

/* Remueve soporte específico para IE 10 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/* Corrige el estilo del cursor de los botones de incremento y decremento en Chrome */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/* Remueve soporte para Chrome/Safari en macOS */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Corrige la incapacidad de estilizar tipos clicables en iOS y Safari.
 * 2. Cambia las propiedades de fuente a `inherit` en Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactivos
   ========================================================================== */

/* Añade la visualización correcta en Edge y Firefox */
details {
  display: block;
}

/* Añade la visualización correcta en todos los navegadores */
summary {
  display: list-item;
}

/* Miscelánea
   ========================================================================== */

/* Elimina soporte específico para IE */
template {
  display: none;
}

/* Elimina soporte específico para IE */
[hidden] {
  display: none;
}