*, *::before, *::after { box-sizing: border-box; } * { margin: 0; } html:focus-within { scroll-behavior: smooth; } html, body { height: 100%; } body { line-height: 1.5; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } img, picture, video, canvas, svg { display: block; max-width: 100%; } input, button, textarea, select { font: inherit; } button { background: none; border: none; cursor: pointer; } textarea { resize: vertical; } p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; } h1, h2, h3, h4, h5, h6 { font-weight: inherit; } ul, ol { list-style: none; padding: 0; } a { text-decoration: none; color: inherit; } table { border-collapse: collapse; border-spacing: 0; } @media (prefers-reduced-motion: reduce) { html:focus-within { scroll-behavior: auto; } *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } }

html, body {
  height: 100%;
  margin: 0; /* Remove default margin for full coverage */

  font-family: "Cairo", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-variation-settings:
    "slnt" 0;
}


.grid-container {
  display: grid;
  height: 100vh; /* Fallback for older browsers */
  height: 100dvh; /* Use dynamic viewport height for better mobile experience */
  width: 100%;
  grid-template-columns: 1fr; /* Example: three equal columns */
  
  background-color: white;
  place-items: center;
  gap: 16px;

  justify-content: center; /* Los junta al inicio horizontalmente */
  align-content: center;   /* Los junta al inicio verticalmente */
  
}

img{
    max-width: 200px;
    height: auto;
}

h1{
    font-size: 24px;
}