<?php
include ("partes/imagenes.php"); 
?>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Prestify - Inicio</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.17.11/dist/css/uikit.min.css" />
    <link rel="stylesheet" href="css/Style.css">
    <script src="https://cdn.jsdelivr.net/npm/uikit@3.17.11/dist/js/uikit.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/uikit@3.17.11/dist/js/uikit-icons.min.js"></script>
</head>
<body>

<!-- Navbar -->
<nav class="uk-navbar-container" style="background-color: #0A1A2F;">
    <div class="uk-container uk-container-expand">
        <div class="uk-margin-xlarge-left uk-margin-xlarge-right">
            <div uk-navbar>
                <div class="uk-navbar-left">
                    <img src="<?php echo $posicion . $arreglo[0]['img']; ?>" width="90px" height="90px" alt="">
                </div>
                <div class="uk-navbar-right uk-visible@s">
                    <ul class="uk-navbar-nav">
                        <li><a href="login.php" style="color: #14c5dc;" >Iniciar sesion</a></li>
                        <li><a href="register.php" style="color: #004d77;" >Registrarse</a></li>

                    </ul>
                </div>
                <div class="uk-navbar-right uk-hidden@s">
                    <a class="uk-navbar-toggle" href="#offcanvas-nav" uk-toggle>
                        <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">Menu</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</nav>


<!-- Offcanvas Menu -->
<div id="offcanvas-nav" uk-offcanvas="overlay: true">
    <div class="uk-offcanvas-bar">
        <button class="uk-offcanvas-close" type="button" uk-close></button>
        <ul class="uk-nav uk-nav-default">
            <li class="uk-active"><a href="#">Inicio</a></li>
            <li><a href="login.php">Iniciar Sesion</a></li>
            <li><a href="register.php">Registrarse</a></li>

        </ul>
    </div>
</div>

<!-- Slideshow -->
<div class="uk-position-relative uk-visible-toggle uk-text-center" uk-slideshow="ratio: 7:3.1; animation: push">

    <ul class="uk-slideshow-items">
        <li>

            <img src="<?php echo $posicion . $arreglo[1]['img']; ?>" alt="" uk-cover style="height: 100%; width: 100%; margin: 0;">
            <div class="uk-position-cover" style="background-color: rgba(0, 0, 0, 0.5); z-index: 1;"></div>
            <div class="uk-position-center uk-panel" style="z-index: 2;">
                <h1 class="uk-heading-medium uk-text-primary uk-text-center" style="color: #ffffff !important;">Always take control of your finances</h1>
            </div>
        </li>

        <li>
            <img src="<?php echo $posicion . $arreglo[1]['img']; ?>" alt="" uk-cover style="height: 100%; width: 100%; margin: 0;">
            <div class="uk-position-cover" style="background-color: rgba(0, 0, 0, 0.5); z-index: 1;"></div>
            <div class="uk-position-center uk-panel" style="z-index: 2;">
                <h1 class="uk-heading-medium uk-text-primary uk-text-center" style="color: #ffffff !important;">Always take control of your finances</h1>
            </div>
        </li>
    </ul>

</div>







</div>
<section class="info-section uk-section uk-light">
  <div class="uk-container">
    <div class="uk-child-width-1-3@m uk-grid-match" uk-grid>

      <!-- Misión -->
      <div>
        <div class="uk-card uk-card-default uk-card-body card-dark">
          <h3 class="uk-card-title">
            <span class="icon mission-icon" aria-hidden="true"></span>
            Misión
          </h3>
          <p>Brindar a nuestros usuarios una herramienta intuitiva, confiable y educativa para calcular préstamos con interés simple y compuesto, facilitando la toma de decisiones financieras informadas.</p>
        </div>
      </div>

      <!-- Visión -->
      <div>
        <div class="uk-card uk-card-default uk-card-body card-dark">
          <h3 class="uk-card-title">
            <span class="icon vision-icon" aria-hidden="true"></span>
            Visión
          </h3>
          <p>Ser la plataforma líder en simulación de préstamos en línea, promoviendo la educación financiera y el acceso a soluciones prácticas para todos.</p>
        </div>
      </div>

      <!-- Valores -->
      <div>
        <div class="uk-card uk-card-default uk-card-body card-dark">
          <h3 class="uk-card-title">
            <span class="icon values-icon" aria-hidden="true"></span>
            Valores
          </h3>
          <ul class="uk-list uk-list-bullet">
            <li>Transparencia</li>
            <li>Responsabilidad financiera</li>
            <li>Accesibilidad</li>
            <li>Innovación</li>
            <li>Educación continua</li>
          </ul>
        </div>
      </div>

    </div>
  </div>
</section>


</body>

<script src="js/scripts.js"></script>
</html>
