<!DOCTYPE html>
<html lang="es">
  <head>
    <title>LogosKLogos</title>

    <meta name="referrer" content="origin">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="LogosKLogos es una herramienta facil para estudiar y simple para leer, comparar,y analizar la biblia a profundidad en su lengua original con diccionario Strong y con clave parsing.">
    <meta name="keywords" content="LogosKLogos biblia interlineal hebreo griego espanol antiguo testamento nuevo testamento diccionario strong Biblia Hebraica Stuttgartensia ETCBC4b Tischendorf Reina Valera 1960 parsing key morfologia">
    <meta charset="utf-8">
    <meta name="turbo-cache-control" content="no-preview">

    <!-- Canonical SEO -->
    <link rel="canonical" href="https://logosklogos.com">

      <link rel="preconnect" href="https://www.google.com">
<link rel="preconnect" href="https://www.google-analytics.com">
<link rel="preconnect" href="https://www.facebook.com">
<link rel="preconnect" href="https://cdn.jsdelivr.net">

      <link rel="dns-prefetch" href="//google.com">
<link rel="dns-prefetch" href="//gstatic.com">
<link rel="dns-prefetch" href="//fonts.googleapis.com">
<link rel="dns-prefetch" href="//fonts.gstatic.com">
<link rel="dns-prefetch" href="//googletagmanager.com">
<link rel="dns-prefetch" href="//google-analytics.com">
<link rel="dns-prefetch" href="//doubleclick.net">
<link rel="dns-prefetch" href="//facebook.com">
<link rel="dns-prefetch" href="//connect.facebook.net">
<link rel="dns-prefetch" href="//cdn.jsdelivr.net">


    <!-- Preload CookieConsent assets (defer JS load to avoid render-blocking) -->
  <link
    rel="style"
    href="https://cdn.jsdelivr.net/gh/orestbida/cookieconsent@3.1.0/dist/cookieconsent.css"
  >
  <script async src="https://www.google-analytics.com/analytics.js"></script>
  <!-- Local assets managed by Propshaft -->
  <link rel="preload" href="/assets/android-icon-48x48-6ea10391.png" as="image" type="image/png">

    <link rel="icon" type="image/x-icon" href="/assets/favicon-fd3f2c9a.ico" />

<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32-4501c960.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16-91100446.png">

<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon-e8dc057d.png">

<meta name="msapplication-TileColor" content="#237afc">
<meta name="theme-color" content="#237afc">

<link rel="image_src" href="/assets/logosk-icon-orig-bd070c1e.jpg">

            <!-- Open Graph -->
        <meta property="og:app_id" content="1350748034943701">
        <meta property="og:url" content="https://logosklogos.com/">
        <meta property="og:type" content="website">
        <meta property="og:title" content="LogosKLogos">
        <meta property="og:description" content="LogosKLogos es una herramienta fácil para estudiar y simple para leer, comparar y analizar la Biblia a profundidad en su lengua original (hebreo y griego) con diccionario Strong y con clave parsing.">
        <meta property="og:image" content="https://logosklogos.com/assets/logosk-icon-orig-bd070c1e.jpg">
        <meta property="og:image:type" content="image/jpeg">
        <meta property="og:image:width" content="1200">
        <meta property="og:image:height" content="628">
        <meta property="og:site_name" content="LogosKLogos">

        <meta property="og:locale" content="es_ES">
        <!-- Twitter Cards -->
        <meta name="twitter:card" content="summary_large_image">
        <meta name="twitter:title" content="LogosKLogos">
        <meta name="twitter:description" content="LogosKLogos es una herramienta fácil para estudiar y simple para leer, comparar y analizar la Biblia a profundidad en su lengua original (hebreo y griego) con diccionario Strong y con clave parsing.">
        <meta name="twitter:image" content="https://logosklogos.com/assets/logosk-icon-orig-bd070c1e.jpg">
        <meta name="twitter:site" content="@LogosKLogos">


    <link rel="stylesheet" href="/assets/tailwind-2d83f1d2.css" data-turbo-track="reload" />
    <script type="importmap" data-turbo-track="reload">{
  "imports": {
    "application": "/assets/application-e99ef880.js",
    "@hotwired/turbo-rails": "/assets/turbo.min-9fd88cd5.js",
    "@hotwired/stimulus": "/assets/stimulus.min-4b1e420e.js",
    "@hotwired/stimulus-loading": "/assets/stimulus-loading-1fc53fe7.js",
    "pagy": "/assets/pagy.min-2724247b.js",
    "cookieconsent-config": "/assets/cookieconsent-config-2bea984b.js",
    "controllers/application": "/assets/controllers/application-b935cc97.js",
    "controllers/bible_navigation_controller": "/assets/controllers/bible_navigation_controller-4725c7bb.js",
    "controllers/cookie_consent_controller": "/assets/controllers/cookie_consent_controller-ee64b11e.js",
    "controllers/get_bible_controller": "/assets/controllers/get_bible_controller-d2dc2f79.js",
    "controllers/hovercard_controller": "/assets/controllers/hovercard_controller-70193c42.js",
    "controllers": "/assets/controllers/index-ee64e1f1.js",
    "controllers/keyboard_shortcut_controller": "/assets/controllers/keyboard_shortcut_controller-ded24a00.js",
    "controllers/offline_controller": "/assets/controllers/offline_controller-8889d1b8.js",
    "controllers/promo_modal_controller": "/assets/controllers/promo_modal_controller-58112c57.js"
  }
}</script>
<link rel="modulepreload" href="/assets/application-e99ef880.js">
<link rel="modulepreload" href="/assets/turbo.min-9fd88cd5.js">
<link rel="modulepreload" href="/assets/stimulus.min-4b1e420e.js">
<link rel="modulepreload" href="/assets/stimulus-loading-1fc53fe7.js">
<link rel="modulepreload" href="/assets/pagy.min-2724247b.js">
<link rel="modulepreload" href="/assets/cookieconsent-config-2bea984b.js">
<link rel="modulepreload" href="/assets/controllers/application-b935cc97.js">
<link rel="modulepreload" href="/assets/controllers/bible_navigation_controller-4725c7bb.js">
<link rel="modulepreload" href="/assets/controllers/cookie_consent_controller-ee64b11e.js">
<link rel="modulepreload" href="/assets/controllers/get_bible_controller-d2dc2f79.js">
<link rel="modulepreload" href="/assets/controllers/hovercard_controller-70193c42.js">
<link rel="modulepreload" href="/assets/controllers/index-ee64e1f1.js">
<link rel="modulepreload" href="/assets/controllers/keyboard_shortcut_controller-ded24a00.js">
<link rel="modulepreload" href="/assets/controllers/offline_controller-8889d1b8.js">
<link rel="modulepreload" href="/assets/controllers/promo_modal_controller-58112c57.js">
<script type="module">import "application"</script>

      <script async src="https://www.googletagmanager.com/gtag/js?id=G-HVSZ4PLQBC"></script>
      <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', 'G-HVSZ4PLQBC');
      </script>

    <!-- PWA -->
    <link rel="manifest" href="/manifest.json">

    <meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="NciVbe7rLP21BIUYIkKENlhSLZUj5CHhDAu5JTGcFQ41-dCeT6HtSZBjUmGsH5YwAI7Uaoj7X8QCjMZ5pgGZvA" />
  </head>

  <body class="bg-base-100 text-base-content min-h-screen flex flex-col">
    <header class="bg-zinc-500 hidden" data-controller="offline">
      <p class="text-white text-center py-2">-Estás desconectado - Contenido offline(puede estar desactualizado)</p>
    </header>
    <div id="cookieConsent"
     class="modal w-screen modal-bottom sm:modal-middle"
     data-controller="cookie-consent">
  <div class="modal-box">
    <h3 class="font-bold text-lg">Cookies</h3>
    <p class="py-4">Este sitio web utiliza cookies para mejorar su experiencia.</p>
    <div class="modal-action">
      <button class="btn btn-primary" data-action="cookie-consent#accept">
        Entendido
      </button>
    </div>
  </div>
</div>


      <nav
  class="
    navbar bg-base-200/80 backdrop-blur-md shadow sticky top-0 z-50 transition-all
    duration-300
  "
>
  <div class="navbar-start">
    <a class="btn btn-ghost normal-case text-xl flex items-center gap-2" href="/">
      <img src="/assets/android-icon-48x48-6ea10391.png" />
      <span class="font-bold">LogosKLogos</span>
</a>  </div>

  <div class="navbar-center hidden lg:flex">
    <ul class="menu menu-horizontal px-1 gap-2">
      <li class="lg:dropdown lg:dropdown-hover">
  <details>
    <summary class="flex items-center gap-2 btn btn-ghost">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        fill="none"
        viewBox="0 0 24 24"
        stroke-width="1.5"
        stroke="currentColor"
        class="size-5"
      >
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18c-2.305 0-4.408.867-6 2.292m0-14.25v14.25"
        />
      </svg>
      Biblia
    </summary>

    <ul
      class="
        p-2 bg-base-100 rounded-box z-[100] w-72 lg:dropdown-content lg:shadow-xl
        lg:border lg:border-base-300 lg:absolute
      "
    >
      <li class="w-full text-shadow-none">
  <details>
    <summary class="text-base-content font-bold cursor-pointer">
      Antiguo Testamento
    </summary>
    <ul
      class="
        max-h-60 text-base-content overflow-y-auto border-l-2 border-secondary/20 ml-2
        mt-1
      "
    >
      <li><a href="/interlinears/AT/Gn">Génesis</a></li>
      <li><a href="/interlinears/AT/Ex">Éxodo</a></li>
      <li><a href="/interlinears/AT/Lv">Levítico</a></li>
      <li><a href="/interlinears/AT/Nm">Números</a></li>
      <li><a href="/interlinears/AT/Dt">Deuteronomio</a></li>
      <li><a href="/interlinears/AT/Jos">Josué</a></li>
      <li><a href="/interlinears/AT/Jue">Jueces</a></li>
      <li><a href="/interlinears/AT/Rt">Rut</a></li>
      <li><a href="/interlinears/AT/1S">1 Samuel</a></li>
      <li><a href="/interlinears/AT/2S">2 Samuel</a></li>
      <li><a href="/interlinears/AT/1R">1 Reyes</a></li>
      <li><a href="/interlinears/AT/2R">2 Reyes</a></li>
      <li><a href="/interlinears/AT/1Cr">1 Crónicas</a></li>
      <li><a href="/interlinears/AT/2Cr">2 Crónicas</a></li>
      <li><a href="/interlinears/AT/Esd">Esdras</a></li>
      <li><a href="/interlinears/AT/Neh">Nehemías</a></li>
      <li><a href="/interlinears/AT/Est">Ester</a></li>
      <li><a href="/interlinears/AT/Job">Job</a></li>
      <li><a href="/interlinears/AT/Sal">Salmos</a></li>
      <li><a href="/interlinears/AT/Pr">Proverbios</a></li>
      <li><a href="/interlinears/AT/Ec">Eclesiastés</a></li>
      <li><a href="/interlinears/AT/Cnt">Cantares</a></li>
      <li><a href="/interlinears/AT/Is">Isaías</a></li>
      <li><a href="/interlinears/AT/Jer">Jeremías</a></li>
      <li><a href="/interlinears/AT/Lm">Lamentaciones</a></li>
      <li><a href="/interlinears/AT/Ez">Ezequiel</a></li>
      <li><a href="/interlinears/AT/Dn">Daniel</a></li>
      <li><a href="/interlinears/AT/Os">Oseas</a></li>
      <li><a href="/interlinears/AT/Jl">Joel</a></li>
      <li><a href="/interlinears/AT/Am">Amós</a></li>
      <li><a href="/interlinears/AT/Abd">Abdías</a></li>
      <li><a href="/interlinears/AT/Jon">Jonás</a></li>
      <li><a href="/interlinears/AT/Mi">Miqueas</a></li>
      <li><a href="/interlinears/AT/Nah">Nahúm</a></li>
      <li><a href="/interlinears/AT/Hab">Habacuc</a></li>
      <li><a href="/interlinears/AT/Sof">Sofonías</a></li>
      <li><a href="/interlinears/AT/Ha">Hageo</a></li>
      <li><a href="/interlinears/AT/Zac">Zacarías</a></li>
      <li><a href="/interlinears/AT/Mal">Malaquías</a></li>
    </ul>
  </details>
</li>

<div class="divider my-1"></div>

<li class="w-full text-shadow-none">
  <details>
    <summary class="text-base-content font-bold cursor-pointer">
      Nuevo Testamento
    </summary>
    <ul
      class="
        max-h-60 overflow-y-auto text-base-content border-l-2 border-accent/20 ml-2 mt-1
      "
    >
      <li><a href="/interlinears/NT/Mt">Mateo</a></li>
      <li><a href="/interlinears/NT/Mr">Marcos</a></li>
      <li><a href="/interlinears/NT/Lc">Lucas</a></li>
      <li><a href="/interlinears/NT/Jn">Juan</a></li>
      <li><a href="/interlinears/NT/Hch">Hechos</a></li>
      <li><a href="/interlinears/NT/Ro">Romanos</a></li>
      <li><a href="/interlinears/NT/1Co">1ª Corintios</a></li>
      <li><a href="/interlinears/NT/2Co">2ª Corintios</a></li>
      <li><a href="/interlinears/NT/Ga">Gálatas</a></li>
      <li><a href="/interlinears/NT/Ef">Efesios</a></li>
      <li><a href="/interlinears/NT/Fil">Filipenses</a></li>
      <li><a href="/interlinears/NT/Col">Colosenses</a></li>
      <li><a href="/interlinears/NT/1Ts">1ª Tesalonicenses</a></li>
      <li><a href="/interlinears/NT/2Ts">2ª Tesalonicenses</a></li>
      <li><a href="/interlinears/NT/1Ti">1ª Timoteo</a></li>
      <li><a href="/interlinears/NT/2Ti">2ª Timoteo</a></li>
      <li><a href="/interlinears/NT/Tit">Tito</a></li>
      <li><a href="/interlinears/NT/Flm">Filemón</a></li>
      <li><a href="/interlinears/NT/He">Hebreos</a></li>
      <li><a href="/interlinears/NT/Stg">Santiago</a></li>
      <li><a href="/interlinears/NT/1P">1ª Pedro</a></li>
      <li><a href="/interlinears/NT/2P">2ª Pedro</a></li>
      <li><a href="/interlinears/NT/1Jn">1ª Juan</a></li>
      <li><a href="/interlinears/NT/2Jn">2ª Juan</a></li>
      <li><a href="/interlinears/NT/3Jn">3ª Juan</a></li>
      <li><a href="/interlinears/NT/Jud">Judas</a></li>
      <li><a href="/interlinears/NT/Ap">Apocalipsis</a></li>
    </ul>
  </details>
</li>

    </ul>
  </details>
</li>

<li class="lg:dropdown lg:dropdown-hover">
  <details>
    <summary class="flex items-center gap-2 btn btn-ghost">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        fill="none"
        viewBox="0 0 24 24"
        stroke-width="1.5"
        stroke="currentColor"
        class="size-5"
      >
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          d="M15.042 21.672 13.684 16.6m0 0-2.51 2.225.569-9.47 5.227 7.917-3.286-.672ZM12 2.25V4.5m5.834.166-1.591 1.591M20.25 10.5H18M16.243 16.243l-1.591-1.591M6 10.5H3.75m4.009-4.243L6.168 4.666M4.235 17.935l1.591-1.591M5.25 12.93a3.75 3.75 0 1 1 7.5 0 3.75 3.75 0 0 1-7.5 0Z"
        />
      </svg>
      Diccionario
    </summary>
    <ul
      class="
        p-2 bg-base-100 rounded-box lg:shadow-xl lg:dropdown-content z-[100] w-52
        lg:absolute lg:border lg:border-base-300
      "
    >
      <li><a href="/strong_hebrew">Strong Hebreo</a></li>
      <li><a href="/strongcodes">Strong Griego</a></li>
    </ul>
  </details>
</li>

<li class="lg:dropdown lg:dropdown-hover">
  <details>
    <summary class="flex items-center gap-2 btn btn-ghost">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        fill="none"
        viewBox="0 0 24 24"
        stroke-width="1.5"
        stroke="currentColor"
        class="size-5"
      >
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          d="M15.042 21.672 13.684 16.6m0 0-2.51 2.225.569-9.47 5.227 7.917-3.286-.672ZM12 2.25V4.5m5.834.166-1.591 1.591M20.25 10.5H18M16.243 16.243l-1.591-1.591M6 10.5H3.75m4.009-4.243L6.168 4.666M4.235 17.935l1.591-1.591M5.25 12.93a3.75 3.75 0 1 1 7.5 0 3.75 3.75 0 0 1-7.5 0Z"
        />
      </svg>
      Acerca
    </summary>
    <ul
      class="
        p-2 bg-base-100 rounded-box lg:shadow-xl lg:dropdown-content z-[100] w-64
        lg:absolute lg:border lg:border-base-300
      "
    >
      <li><a href="/pages/about">Acerca de logosklogos.com</a></li>
      <li><a href="/pages/calendario">Consultar fechas disponibles</a></li>
      <li><a href="/pages/declaracion">Declaración de Fe</a></li>
      <li><a href="/pages/atajo">Atajos de teclado</a></li>
    </ul>
  </details>
</li>

<li><a class="btn btn-ghost" href="/pages/links">Links útiles</a></li>
<li><a target="_blank" class="btn btn-ghost" href="https://facebook.com/logosklogos">Facebook</a></li>
<li><a target="_blank" class="btn btn-ghost" href="https://www.youtube.com/channel/UCkVYAwHlNoB9sW_wEt-egFw">YouTube</a></li>

    </ul>
  </div>

  <div class="navbar-end">
    <div class="flex items-center">
      <label class="grid cursor-pointer place-items-center px-2 py-1">
        <input
          type="checkbox"
          id="theme-toggle"
          value="dark"
          class="
            toggle theme-controller col-span-2 col-start-1 row-start-1 md:toggle-md
            toggle-sm border-gray-300
          "
        />
        <svg
          class="
            col-start-1 row-start-1 w-4 h-4 md:w-3 md:h-3 fill-orange-500 stroke-orange-500
          "
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 24 24"
          fill="none"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        ><circle cx="12" cy="12" r="5"/><path
            d="M12 1v2M12 21v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M1 12h2M21 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4"
          /></svg>

        <svg
          class="
            col-start-2 row-start-1 w-4 h-4 md:w-3 md:h-3 fill-cyan-400 stroke-cyan-400
          "
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 24 24"
          fill="none"
          stroke-width="2"
          stroke-linecap="round"
          stroke-linejoin="round"
        ><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>
      </label>
    </div>
  </div>
</nav>
<script>
  {
      const themeToggle = document.getElementById('theme-toggle');
      const htmlElement = document.documentElement;

      const applyTheme = (theme) => {
          htmlElement.setAttribute('data-theme', theme);
          localStorage.setItem('user-theme', theme);

          if (theme === 'dark') {
              themeToggle.checked = true;
          } else {
              themeToggle.checked = false;
          }
      };

      const savedTheme = localStorage.getItem('user-theme');
      const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;

      if (savedTheme) {
          applyTheme(savedTheme);
      } else {
          applyTheme(systemPrefersDark ? 'dark' : 'light');
      }

      themeToggle.addEventListener('change', (e) => {
          const newTheme = e.target.checked ? 'dark' : 'light';
          applyTheme(newTheme);
      });
  }
</script>



    <main class="flex-1 w-full max-w-6xl mx-auto px-4 py-6">
        <div class="lg:hidden fab group z-50 font-bold text-lg">
  <div tabindex="0" role="button" class="btn btn-sm btn-circle btn-primary">
    <div
      class="
        btn btn-primary btn-sm btn-circle shadow-xl transition-transform duration-200
        group-focus-within:rotate-45
      "
    >
      <svg
        xmlns="http://www.w3.org/2000/svg"
        class="w-6 h-6"
        fill="none"
        viewBox="0 0 24 24"
        stroke="currentColor"
      >
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          stroke-width="2"
          d="M12 4v16m8-8H4"
        />
      </svg>
    </div>
  </div>
  <ul tabindex="0" class="dropdown-content z-10">
    <li class="dropdown dropdown-left dropdown-top dropdown-align-end">
      <div
        class="
          flex flex-row justify-end mix-blended-difference bg-base-100 text-base-content
        "
      >
        Biblia
        <div
          tabindex="0"
          role="button"
          class="btn btn-circle btn-sm btn-secondary shadow-lg"
        >
          📖
        </div>
      </div>
      <div
        tabindex="0"
        class="
          dropdown-content z-30 card card-compact bg-base-100 w-72 shadow-2xl border
          border-base-300 mr-2
        "
      >
        <div class="card-body z-50">
          <div class="flex justify-between items-center border-b pb-2 mb-2">
            <span class="font-bold text-xs uppercase">Libros</span>
            <span class="badge badge-xs">Interlineal</span>
          </div>
          <div class="max-h-80 overflow-y-auto overflow-x-hidden pr-1">
            <p class="text-[9px] font-bold opacity-50 mb-1">ANTIGUO TESTAMENTO</p>
            <div class="grid grid-cols-4 gap-1 mb-4">
              <a href="/AT/Gn" class="btn btn-xs btn-ghost border border-base-300 p-0">Gn</a>
              <a href="/AT/Ex" class="btn btn-xs btn-ghost border border-base-300 p-0">Ex</a>
              <a href="/AT/Lv" class="btn btn-xs btn-ghost border border-base-300 p-0">Lv</a>
              <a href="/AT/Nm" class="btn btn-xs btn-ghost border border-base-300 p-0">Nm</a>
              <a href="/AT/Dt" class="btn btn-xs btn-ghost border border-base-300 p-0">Dt</a>
              <a href="/AT/Jos" class="btn btn-xs btn-ghost border border-base-300 p-0">Jos</a>
              <a href="/AT/Jue" class="btn btn-xs btn-ghost border border-base-300 p-0">Jueces</a>
              <a href="/AT/Rt" class="btn btn-xs btn-ghost border border-base-300 p-0">Rut</a>
              <a href="/AT/1S" class="btn btn-xs btn-ghost border border-base-300 p-0">1S</a>
              <a href="/AT/2S" class="btn btn-xs btn-ghost border border-base-300 p-0">2S</a>
              <a href="/AT/1R" class="btn btn-xs btn-ghost border border-base-300 p-0">1R</a>
              <a href="/AT/2R" class="btn btn-xs btn-ghost border border-base-300 p-0">2R</a>
              <a href="/AT/1Cr" class="btn btn-xs btn-ghost border border-base-300 p-0">1Cr</a>
              <a href="/AT/2Cr" class="btn btn-xs btn-ghost border border-base-300 p-0">2C</a>
              <a href="/AT/Esd" class="btn btn-xs btn-ghost border border-base-300 p-0">Esd</a>
              <a href="/AT/Neh" class="btn btn-xs btn-ghost border border-base-300 p-0">Neh</a>
              <a href="/AT/Est" class="btn btn-xs btn-ghost border border-base-300 p-0">Est</a>
              <a href="/AT/Job" class="btn btn-xs btn-ghost border border-base-300 p-0">Job</a>
              <a href="/AT/Sal" class="btn btn-xs btn-ghost border border-base-300 p-0">Sal</a>
              <a href="/AT/Pr" class="btn btn-xs btn-ghost border border-base-300 p-0">Pr</a>
              <a href="/AT/Ec" class="btn btn-xs btn-ghost border border-base-300 p-0">Ec</a>
              <a href="/AT/Cnt" class="btn btn-xs btn-ghost border border-base-300 p-0">Cnt</a>
              <a href="/AT/Is" class="btn btn-xs btn-ghost border border-base-300 p-0">Is</a>
              <a href="/AT/Jer" class="btn btn-xs btn-ghost border border-base-300 p-0">Jer</a>
              <a href="/AT/Lm" class="btn btn-xs btn-ghost border border-base-300 p-0">Lm</a>
              <a href="/AT/Ez" class="btn btn-xs btn-ghost border border-base-300 p-0">Ez</a>
              <a href="/AT/Dn" class="btn btn-xs btn-ghost border border-base-300 p-0">Dn</a>
              <a href="/AT/Os" class="btn btn-xs btn-ghost border border-base-300 p-0">Os</a>
              <a href="/AT/Jl" class="btn btn-xs btn-ghost border border-base-300 p-0">Jl</a>
              <a href="/AT/Am" class="btn btn-xs btn-ghost border border-base-300 p-0">Am</a>
              <a href="/AT/Abd" class="btn btn-xs btn-ghost border border-base-300 p-0">Abd</a>
              <a href="/AT/Jon" class="btn btn-xs btn-ghost border border-base-300 p-0">Jon</a>
              <a href="/AT/Mi" class="btn btn-xs btn-ghost border border-base-300 p-0">Mi</a>
              <a href="/AT/Nah" class="btn btn-xs btn-ghost border border-base-300 p-0">Nah</a>
              <a href="/AT/Hab" class="btn btn-xs btn-ghost border border-base-300 p-0">Hab</a>
              <a href="/AT/Sof" class="btn btn-xs btn-ghost border border-base-300 p-0">Sof</a>
              <a href="/AT/Ha" class="btn btn-xs btn-ghost border border-base-300 p-0">Ha</a>
              <a href="/AT/Zac" class="btn btn-xs btn-ghost border border-base-300 p-0">Zac</a>
              <a href="/AT/Mal" class="btn btn-xs btn-ghost border border-base-300 p-0">Mal</a>
            </div>

            <p class="text-[9px] font-bold opacity-50 mb-1">NUEVO TESTAMENTO</p>
            <div class="grid grid-cols-4 gap-1">
              <a href="/NT/Mt" class="btn btn-xs btn-ghost border border-base-300 p-0">Mt</a>
              <a href="/NT/Mr" class="btn btn-xs btn-ghost border border-base-300 p-0">Mr</a>
              <a href="/NT/Lc" class="btn btn-xs btn-ghost border border-base-300 p-0">Lc</a>
              <a href="/NT/Jn" class="btn btn-xs btn-ghost border border-base-300 p-0">Jn</a>
              <a href="/NT/Hch" class="btn btn-xs btn-ghost border border-base-300 p-0">Hch</a>
              <a href="/NT/Ro" class="btn btn-xs btn-ghost border border-base-300 p-0">Rom</a>
              <a href="/NT/1Co" class="btn btn-xs btn-ghost border border-base-300 p-0">1ªCo</a>
              <a href="/NT/2Co" class="btn btn-xs btn-ghost border border-base-300 p-0">2ªCo</a>
              <a href="/NT/Ga" class="btn btn-xs btn-ghost border border-base-300 p-0">Ga</a>
              <a href="/NT/Ef" class="btn btn-xs btn-ghost border border-base-300 p-0">Ef</a>
              <a href="/NT/Fil" class="btn btn-xs btn-ghost border border-base-300 p-0">Fil</a>
              <a href="/NT/Col" class="btn btn-xs btn-ghost border border-base-300 p-0">Col</a>
              <a href="/NT/1Ts" class="btn btn-xs btn-ghost border border-base-300 p-0">1ªTs</a>
              <a href="/NT/2Ts" class="btn btn-xs btn-ghost border border-base-300 p-0">2ªTs</a>
              <a href="/NT/1Ti" class="btn btn-xs btn-ghost border border-base-300 p-0">1ªTi</a>
              <a href="/NT/2Ti" class="btn btn-xs btn-ghost border border-base-300 p-0">2ªTi</a>
              <a href="/NT/Tit" class="btn btn-xs btn-ghost border border-base-300 p-0">Tit</a>
              <a href="/NT/Flm" class="btn btn-xs btn-ghost border border-base-300 p-0">Flm</a>
              <a href="/NT/He" class="btn btn-xs btn-ghost border border-base-300 p-0">He</a>
              <a href="/NT/Stg" class="btn btn-xs btn-ghost border border-base-300 p-0">Stg</a>
              <a href="/NT/1P" class="btn btn-xs btn-ghost border border-base-300 p-0">1ªP</a>
              <a href="/NT/2P" class="btn btn-xs btn-ghost border border-base-300 p-0">2ªP</a>
              <a href="/NT/1Jn" class="btn btn-xs btn-ghost border border-base-300 p-0">1ªJn</a>
              <a href="/NT/2Jn" class="btn btn-xs btn-ghost border border-base-300 p-0">2ªJn</a>
              <a href="/NT/3Jn" class="btn btn-xs btn-ghost border border-base-300 p-0">3ªJn</a>
              <a href="/NT/Jud" class="btn btn-xs btn-ghost border border-base-300 p-0">Jud</a>
              <a href="/NT/Ap" class="btn btn-xs btn-ghost border border-base-300 p-0">Ap</a>
            </div>
          </div>
        </div>
      </div>
    </li>
  </ul>
  <ul tabindex="0" class="dropdown-content z-10">
    <li class="dropdown dropdown-left dropdown-top drodown-align-end">
      <div
        class="
          flew flex-row justify-end mix-blended-difference bg-base-100 text-base-content
        "
      >
        Diccionario
        <div
          tabindex="0"
          role="button"
          class="btn btn-circle btn-accent btn-sm shadow-lg"
        >
          📘
        </div>
      </div>
      <div
        tabindex="0"
        class="
          dropdown-content z-30 card card-compact bg-base-100 shadow-2xl border
          border-base-300 mr-2
        "
      >
        <div class="card-body z-50">
          <a href="/strong_hebrew">Strong Hebreo</a>
          <a href="/strongcodes">Strong Griego</a>
        </div>
      </div>
    </li>
  </ul>
  <ul tabindex="0" class="dropdown-content z-10">
    <li class="dropdown dropdown-left dropdown-top dropdown-align-end">
      <div
        class="
          flex flex-row justify-end mix-blend-difference bg-base-100 text-base-content
        "
      >
        Acerca
        <div
          tabindex="0"
          role="button"
          class="btn btn-circle btn-info btn-sm shadow-lg"
        >
          ℹ️
        </div>
      </div>
      <div
        tabindex="0"
        class="
          dropdown-content z-30 card card-compact bg-base-100 shadow-2xl broder
          border-base-300 mr-2
        "
      >
        <div class="card-body z-50">
          <a href="/pages/about">Acerca de logosklogos.com</a>
          <a href="/pages/calendario">Consultar fechas disponibles</a>
          <a href="/pages/declaracion">Declaración de Fe</a>
          <a href="/pages/atajo">Atajos de teclado</a>
        </div>
      </div>
    </li>
  </ul>
  <div class="mix-blend-difference bg-base-100 text-base-content">
    Links útiles
    <a class="btn btn-sm btn-circle btn-warning shadow-lg icon-container" href="/pages/links">
      <svg
        viewBox="0 0 24 24"
        class="w-6 h-6"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      ><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier">
          <path
            d="M7.76001 21C6.81812 21.0025 5.89676 20.7249 5.11302 20.2025C4.32927 19.6801 3.71852 18.9365 3.35839 18.0662C2.99826 17.1959 2.905 16.2381 3.09047 15.3147C3.27594 14.3912 3.73176 13.5438 4.40001 12.88L5.81001 11.47C5.95063 11.3295 6.14126 11.2507 6.34001 11.2507C6.53876 11.2507 6.72938 11.3295 6.87001 11.47C6.94077 11.5389 6.997 11.6214 7.0354 11.7124C7.0738 11.8034 7.09358 11.9012 7.09358 12C7.09358 12.0988 7.0738 12.1966 7.0354 12.2876C6.997 12.3786 6.94077 12.4611 6.87001 12.53L5.46001 13.94C4.8518 14.5509 4.51033 15.3779 4.51033 16.24C4.51033 17.1021 4.8518 17.9291 5.46001 18.54C6.07954 19.1317 6.9033 19.4619 7.76001 19.4619C8.61672 19.4619 9.44048 19.1317 10.06 18.54L12.88 15.71C13.1821 15.409 13.4217 15.0513 13.5853 14.6575C13.7488 14.2637 13.833 13.8414 13.833 13.415C13.833 12.9886 13.7488 12.5663 13.5853 12.1725C13.4217 11.7787 13.1821 11.421 12.88 11.12C12.7396 10.9794 12.6607 10.7887 12.6607 10.59C12.6607 10.3912 12.7396 10.2006 12.88 10.06C12.949 9.98924 13.0314 9.933 13.1224 9.89461C13.2134 9.85621 13.3112 9.83643 13.41 9.83643C13.5088 9.83643 13.6066 9.85621 13.6976 9.89461C13.7886 9.933 13.8711 9.98924 13.94 10.06C14.3823 10.4996 14.7334 11.0223 14.9729 11.5981C15.2125 12.1739 15.3358 12.7914 15.3358 13.415C15.3358 14.0386 15.2125 14.6561 14.9729 15.2319C14.7334 15.8077 14.3823 16.3304 13.94 16.77L11.12 19.6C10.6808 20.0446 10.1576 20.3973 9.58072 20.6377C9.00386 20.8781 8.38494 21.0012 7.76001 21Z"
            fill="#000000"
          ></path>
          <path
            d="M10.59 14.16C10.4912 14.1622 10.3931 14.1438 10.3018 14.1059C10.2105 14.068 10.1282 14.0115 10.06 13.94C9.61646 13.5011 9.26435 12.9786 9.02404 12.4027C8.78374 11.8268 8.66 11.209 8.66 10.585C8.66 9.96099 8.78374 9.34318 9.02404 8.7673C9.26435 8.19143 9.61646 7.66892 10.06 7.23L12.88 4.4C13.7711 3.50887 14.9798 3.00824 16.24 3.00824C17.5003 3.00824 18.7089 3.50887 19.6 4.4C20.4911 5.29112 20.9918 6.49975 20.9918 7.76C20.9918 9.02024 20.4911 10.2289 19.6 11.12L18.19 12.53C18.0494 12.6704 17.8588 12.7493 17.66 12.7493C17.4613 12.7493 17.2706 12.6704 17.13 12.53C17.0592 12.4611 17.003 12.3786 16.9646 12.2876C16.9262 12.1966 16.9064 12.0988 16.9064 12C16.9064 11.9012 16.9262 11.8034 16.9646 11.7124C17.003 11.6214 17.0592 11.5389 17.13 11.47L18.54 10.06C19.1482 9.44905 19.4897 8.62207 19.4897 7.76C19.4897 6.89792 19.1482 6.07094 18.54 5.46C17.9205 4.86827 17.0967 4.53809 16.24 4.53809C15.3833 4.53809 14.5595 4.86827 13.94 5.46L11.12 8.29C10.8155 8.58964 10.5737 8.94687 10.4087 9.34088C10.2436 9.7349 10.1586 10.1578 10.1586 10.585C10.1586 11.0122 10.2436 11.4351 10.4087 11.8291C10.5737 12.2231 10.8155 12.5804 11.12 12.88C11.2605 13.0206 11.3393 13.2112 11.3393 13.41C11.3393 13.6087 11.2605 13.7994 11.12 13.94C11.0508 14.0101 10.9682 14.0657 10.8772 14.1035C10.7862 14.1412 10.6885 14.1605 10.59 14.16Z"
            fill="#000000"
          ></path>
        </g></svg>
</a>  </div>
  <div class="mix-blend-difference bg-base-100 text-base-content">
    Facebook
    <a class="btn btn-circle btn-sm btn-primary shadow-lg icon-container" target="_blank" href="https://facebook.com/logosklogos">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        class="w-6 h-6"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="1.5"
        aria-hidden="true"
      >
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          d="M14 9h3V6h-3c-1.657 0-3 1.343-3 3v3H8v3h3v6h3v-6h3l1-3h-4V9z"
        ></path>
      </svg>
</a>  </div>
  <div class="mix-blend-difference bg-base-100 text-base-content">
    Youtube
    <a class="btn btn-sm btn-circle btn-default shadow-lg icon-container" target="_blank" href="https://www.youtube.com/channel/UCkVYAwHlNoB9sW_wEt-egFw">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        class="w-6 h-6"
        viewBox="0 0 24 24"
        fill="red"
      >
        <path
          d="M23.498 6.186a2.998 2.998 0 0 0-2.112-2.12C19.505 3.5 12 3.5 12 3.5s-7.505 0-9.386.566a2.998 2.998 0 0 0-2.112 2.12A31.21 31.21 0 0 0 0 12a31.21 31.21 0 0 0 .502 5.814 2.998 2.998 0 0 0 2.112 2.12C4.495 20.5 12 20.5 12 20.5s7.505 0 9.386-.566a2.998 2.998 0 0 0 2.112-2.12A31.21 31.21 0 0 0 24 12a31.21 31.21 0 0 0-.502-5.814zM9.75 15.5v-7l6 3.5-6 3.5z"
        ></path>
      </svg>
</a>  </div>
</div>

      <!-- Flash Messages -->
      <div class="mb-4">
        <div id="flash-container" class="fixed top-20 right-4 z-50 space-y-3">
</div>

<script>
  function closeFlash(btn) {
    const alert = btn.closest('.alert')
    alert.classList.remove('animate-slideIn')
    alert.classList.add('animate-slideOut')
    setTimeout(() => alert.remove(), 300)
  }

  // Auto dismiss
  document.querySelectorAll('[data-flash-autohide="true"]').forEach(alert => {
    setTimeout(() => {
      alert.classList.add('animate-slideOut')
      setTimeout(() => alert.remove(), 300)
    }, 4000)
  })
</script>

      </div>

      <nav class="text-sm mb-6 px-4 breadcrumbs">
  <ul>
    
  </ul>
</nav>

        <div class="hero bg-base-200 p-2 md:p-4 rounded-3xl shadow-sm mb-10">
  <div class="hero-content text-neutral-content text-center">
    <div class="max-w-3xl">
      <h1
        class="
          text-4xl md:text-6xl font-black mb-6 flex flex-wrap justify-center
          items-baseline gap-2
        "
      >
        <span class="font-white font-2xl text-shadow-lg">Bienvenido a</span>
        <span class="geek-bold inline-flex gap-1 text-[#4582ec] text-shadow-lg">
          <div class="tooltip tooltip-primary" data-tip="lógos">
            <a class="greek-bold hover:text-primary-focus transition-colors underline decoration-dotted decoration-primary/30" href="/strongcodes/3056">&lambda;&#972;&gamma;&omicron;&#962;</a>
          </div>

          <div class="tooltip tooltip-secondary" data-tip="k (úrios)">
            <a class="greek-bold text-[#4582ec] transition-colors text-shadow-lg" href="/strongcodes/2962">&kappa;</a>
          </div>

          <div class="tooltip tooltip-primary" data-tip="lógos">
            <a class="greek-bold text-[#4582ec] transition-colors underline decoration-dotted decoration-primary/30" href="/strongcodes/3056">&lambda;&#972;&gamma;&omicron;&#962;</a>
          </div>
        </span>
      </h1>
      <p
        class="
          text-lg font-serif text-shadow-lg md:text-2xl text-base-content/80
          leading-relaxed mb-8 text-white
        "
      >
        Brindamos una herramienta fácil y simple para leer, comparar y analizar
        la Biblia en profundidad en su lengua original con:
      </p>

      <div class="flex justify-center mb-2 md:mb-4">
        <div
          class="
            badge badge-outline badge-lg p-4 flex items-center gap-3 border-primary/20
            bg-primary/5 text-primary text-white
          "
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="2"
            stroke="currentColor"
            class="w-5 h-5"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M17.25 6.75 22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3-4.5 16.5"
            />
          </svg>
          <span class="font-bold tracking-wide uppercase text-sm lg:text-lg">Código Parsing</span>
        </div>
      </div>

      <div class="glass mb-2 md:mb-4">
        <p>
          <div
            class="
              text-primary font-bold lg:font-black text-center text-lg lg:text-2xl
            "
          >Si este recurso es de bendición para tu vida y ministerio,<br>puedes apoyarnos aquí:
            <a target="_blank" class="link text-violet-700 link-hover" href="https://www.paypal.me/logosklogos">Paypal link</a>
          </div>
        </p>
      </div>
      <div class="flex justify-center">
        <div
  class="
    flex flex-col sm:flex-row sm:join shadow-md rounded-xl overflow-visible border
    border-base-300
  "
>
  <div class="dropdown group join-item">
    <details>
      <summary
        class="
          btn btn-primary rounded-sm md:rounded-none w-full sm:w-auto gap-2 text-lg
        "
      >
        <svg
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          stroke-width="1.5"
          stroke="currentColor"
          class="size-5"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            d="M12 6.042A8.967 8.967 0 0 0 6 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 0 1 6 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 0 1 6-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0 0 18 18c-2.305 0-4.408.867-6 2.292m0-14.25v14.25"
          />
        </svg>
        Biblia interlineal
      </summary>
      <ul
        class="
          p-2 bg-base-100 rounded-box z-[100] w-72 lg:dropdown-content lg:shadow-xl
          lg:border lg:border-base-300 lg:absolute
        "
      >
        <li class="w-full text-shadow-none">
  <details>
    <summary class="text-base-content font-bold cursor-pointer">
      Antiguo Testamento
    </summary>
    <ul
      class="
        max-h-60 text-base-content overflow-y-auto border-l-2 border-secondary/20 ml-2
        mt-1
      "
    >
      <li><a href="/interlinears/AT/Gn">Génesis</a></li>
      <li><a href="/interlinears/AT/Ex">Éxodo</a></li>
      <li><a href="/interlinears/AT/Lv">Levítico</a></li>
      <li><a href="/interlinears/AT/Nm">Números</a></li>
      <li><a href="/interlinears/AT/Dt">Deuteronomio</a></li>
      <li><a href="/interlinears/AT/Jos">Josué</a></li>
      <li><a href="/interlinears/AT/Jue">Jueces</a></li>
      <li><a href="/interlinears/AT/Rt">Rut</a></li>
      <li><a href="/interlinears/AT/1S">1 Samuel</a></li>
      <li><a href="/interlinears/AT/2S">2 Samuel</a></li>
      <li><a href="/interlinears/AT/1R">1 Reyes</a></li>
      <li><a href="/interlinears/AT/2R">2 Reyes</a></li>
      <li><a href="/interlinears/AT/1Cr">1 Crónicas</a></li>
      <li><a href="/interlinears/AT/2Cr">2 Crónicas</a></li>
      <li><a href="/interlinears/AT/Esd">Esdras</a></li>
      <li><a href="/interlinears/AT/Neh">Nehemías</a></li>
      <li><a href="/interlinears/AT/Est">Ester</a></li>
      <li><a href="/interlinears/AT/Job">Job</a></li>
      <li><a href="/interlinears/AT/Sal">Salmos</a></li>
      <li><a href="/interlinears/AT/Pr">Proverbios</a></li>
      <li><a href="/interlinears/AT/Ec">Eclesiastés</a></li>
      <li><a href="/interlinears/AT/Cnt">Cantares</a></li>
      <li><a href="/interlinears/AT/Is">Isaías</a></li>
      <li><a href="/interlinears/AT/Jer">Jeremías</a></li>
      <li><a href="/interlinears/AT/Lm">Lamentaciones</a></li>
      <li><a href="/interlinears/AT/Ez">Ezequiel</a></li>
      <li><a href="/interlinears/AT/Dn">Daniel</a></li>
      <li><a href="/interlinears/AT/Os">Oseas</a></li>
      <li><a href="/interlinears/AT/Jl">Joel</a></li>
      <li><a href="/interlinears/AT/Am">Amós</a></li>
      <li><a href="/interlinears/AT/Abd">Abdías</a></li>
      <li><a href="/interlinears/AT/Jon">Jonás</a></li>
      <li><a href="/interlinears/AT/Mi">Miqueas</a></li>
      <li><a href="/interlinears/AT/Nah">Nahúm</a></li>
      <li><a href="/interlinears/AT/Hab">Habacuc</a></li>
      <li><a href="/interlinears/AT/Sof">Sofonías</a></li>
      <li><a href="/interlinears/AT/Ha">Hageo</a></li>
      <li><a href="/interlinears/AT/Zac">Zacarías</a></li>
      <li><a href="/interlinears/AT/Mal">Malaquías</a></li>
    </ul>
  </details>
</li>

<div class="divider my-1"></div>

<li class="w-full text-shadow-none">
  <details>
    <summary class="text-base-content font-bold cursor-pointer">
      Nuevo Testamento
    </summary>
    <ul
      class="
        max-h-60 overflow-y-auto text-base-content border-l-2 border-accent/20 ml-2 mt-1
      "
    >
      <li><a href="/interlinears/NT/Mt">Mateo</a></li>
      <li><a href="/interlinears/NT/Mr">Marcos</a></li>
      <li><a href="/interlinears/NT/Lc">Lucas</a></li>
      <li><a href="/interlinears/NT/Jn">Juan</a></li>
      <li><a href="/interlinears/NT/Hch">Hechos</a></li>
      <li><a href="/interlinears/NT/Ro">Romanos</a></li>
      <li><a href="/interlinears/NT/1Co">1ª Corintios</a></li>
      <li><a href="/interlinears/NT/2Co">2ª Corintios</a></li>
      <li><a href="/interlinears/NT/Ga">Gálatas</a></li>
      <li><a href="/interlinears/NT/Ef">Efesios</a></li>
      <li><a href="/interlinears/NT/Fil">Filipenses</a></li>
      <li><a href="/interlinears/NT/Col">Colosenses</a></li>
      <li><a href="/interlinears/NT/1Ts">1ª Tesalonicenses</a></li>
      <li><a href="/interlinears/NT/2Ts">2ª Tesalonicenses</a></li>
      <li><a href="/interlinears/NT/1Ti">1ª Timoteo</a></li>
      <li><a href="/interlinears/NT/2Ti">2ª Timoteo</a></li>
      <li><a href="/interlinears/NT/Tit">Tito</a></li>
      <li><a href="/interlinears/NT/Flm">Filemón</a></li>
      <li><a href="/interlinears/NT/He">Hebreos</a></li>
      <li><a href="/interlinears/NT/Stg">Santiago</a></li>
      <li><a href="/interlinears/NT/1P">1ª Pedro</a></li>
      <li><a href="/interlinears/NT/2P">2ª Pedro</a></li>
      <li><a href="/interlinears/NT/1Jn">1ª Juan</a></li>
      <li><a href="/interlinears/NT/2Jn">2ª Juan</a></li>
      <li><a href="/interlinears/NT/3Jn">3ª Juan</a></li>
      <li><a href="/interlinears/NT/Jud">Judas</a></li>
      <li><a href="/interlinears/NT/Ap">Apocalipsis</a></li>
    </ul>
  </details>
</li>

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

  <a class="btn btn-success join-item rounded-sm md:rounded-none border-y sm:border-y-0 sm:border-x border-base-100/20 gap-2 text-lg" href="/strongcodes">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      fill="none"
      viewBox="0 0 24 24"
      stroke-width="1.5"
      stroke="currentColor"
      class="size-5"
    >
      <path
        stroke-linecap="round"
        stroke-linejoin="round"
        d="M4.5 12h15m0 0l-6.75-6.75M19.5 12l-6.75 6.75"
      />
    </svg>
    <span class="hidden md:inline">Diccionario</span>
    Strong griego
</a>
  <a class="btn btn-info join-item rounded-sm md:rounded-none gap-2 text-lg" href="/strong_hebrew">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      fill="none"
      viewBox="0 0 24 24"
      stroke-width="1.5"
      stroke="currentColor"
      class="size-5"
    >
      <path
        stroke-linecap="round"
        stroke-linejoin="round"
        d="M4.5 12h15m0 0l-6.75-6.75M19.5 12l-6.75 6.75"
      />
    </svg>
    <span class="hidden md:inline">Diccionario</span>
    Strong hebreo
</a>
</div>

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

  <div class="container mx-auto px-4 py-12">
  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10">

    <div class="flex flex-col space-y-4">
      <h3 class="text-3xl font-bold text-primary border-b border-base-300 pb-2">¿Cómo usar este sitio?</h3>
      <p class="text-sm font-serif leading-relaxed text-base-content/80">
        Experimente y disfrute leer la Biblia en su idioma original: Griego
        para el NT y Hebreo para el AT. Con códigos
        <strong>Strong</strong>
        y
        <strong>Parsing</strong>
        podrá profundizar en el mensaje original.
      </p>
      <button
        onclick="playVideo('vn9Yym1IU-g')"
        class="btn btn-primary btn-outline btn-sm w-full group"
      >
        <svg
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          stroke-width="2"
          stroke="currentColor"
          class="w-5 h-5 group-hover:scale-110 transition-transform"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            d="M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
          />
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            d="M15.91 11.672a.375.375 0 0 1 0 .656l-5.603 3.113a.375.375 0 0 1-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112Z"
          />
        </svg>
        Tutorial de uso
      </button>
      <dialog
        id="video_modal"
        class="modal max-w-screen modal-bottom md:modal-middle"
      >
        <div class="modal-box w-10/12 max-w-4xl p-0 relative h-fit">
          <div class="aspect-video">
            <iframe
              id="mainFrame"
              class="w-full h-full"
              src=""
              allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
            >
            </iframe>
          </div>
          <div class="modal-action p-2">
            <form method="dialog">
              <button class="btn" onclick="closeVideo()">Cerrar</button>
            </form>
          </div>
        </div>
        <form method="dialog" class="modal-backdrop">
          <button onclick="closeVideo()">Cerrar</button>
        </form>
      </dialog>

      <h3 class="text-3xl font-bold text-primary border-b border-base-300 pb-2 mt-4">Libros en Amazon</h3>
      <p class="text-sm">
        <a class="link link-hover text-secondary font-semibold inline-flex items-center gap-1" href="/pages/libros">
          Ver catálogo completo
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="2.5"
            stroke="currentColor"
            class="w-3 h-3"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3"
            />
          </svg>
</a>      </p>

      <div class="flex flex-wrap gap-2 pt-2">
          <div class="w-12 hover:scale-110 transition-transform shadow-sm">
            <img alt="Libro" class="rounded-sm" src="/assets/Griego-128-e016083c.png" />
          </div>
          <div class="w-12 hover:scale-110 transition-transform shadow-sm">
            <img alt="Libro" class="rounded-sm" src="/assets/Evangelio-128-3d050585.png" />
          </div>
          <div class="w-12 hover:scale-110 transition-transform shadow-sm">
            <img alt="Libro" class="rounded-sm" src="/assets/Genesis-128-fa7c74c5.png" />
          </div>
          <div class="w-12 hover:scale-110 transition-transform shadow-sm">
            <img alt="Libro" class="rounded-sm" src="/assets/lucas128-45604ddd.png" />
          </div>
          <div class="w-12 hover:scale-110 transition-transform shadow-sm">
            <img alt="Libro" class="rounded-sm" src="/assets/exodo128-db2d86d3.png" />
          </div>
      </div>
    </div>

    <div class="flex flex-col space-y-4">
      <h3 class="text-3xl font-bold text-primary border-b border-base-300 pb-2">Cursos Intensivos</h3>
      <p class="text-sm font-serif leading-relaxed">
        Próximos cursos de griego bíblico (morfología y sintaxis) se anuncian
        en nuestras redes.
      </p>
      <button
        onclick="playVideo('9ZCJYQLbEYM')"
        class="btn btn-ghost btn-sm justify-start p-2 h-auto gap-3 bg-base-200"
      >
        <svg
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 24 24"
          fill="currentColor"
          class="w-5 h-5 text-error"
        >
          <path
            fill-rule="evenodd"
            d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm14.024-.983a1.125 1.125 0 0 1 0 1.966l-5.603 3.113A1.125 1.125 0 0 1 9 15.113V8.887c0-.857.921-1.4 1.671-.983l5.603 3.113Z"
            clip-rule="evenodd"
          />
        </svg>
        <span class="text-left text-xs leading-tight">Aprender el griego bíblico</span>
      </button>
      <button
        onclick="playVideo('CPHbkZ9oiNI')"
        class="btn btn-ghost btn-sm justify-start p-2 h-auto gap-3 bg-base-200"
      >
        <svg
          xmlns="http://www.w3.org/2000/svg"
          viewBox="0 0 24 24"
          fill="currentColor"
          class="w-5 h-5 text-error"
        >
          <path
            fill-rule="evenodd"
            d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm14.024-.983a1.125 1.125 0 0 1 0 1.966l-5.603 3.113A1.125 1.125 0 0 1 9 15.113V8.887c0-.857.921-1.4 1.671-.983l5.603 3.113Z"
            clip-rule="evenodd"
          />
        </svg>
        <span class="text-left text-xs leading-tight">Invitación al<br>curso de griego bíblico</span>
      </button>
      <div class="card bg-base-200 p-4 rounded-xl space-y-3">
        <div class="flex items-center gap-3 text-sm">
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="2"
            stroke="currentColor"
            class="w-4 h-4 text-info"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"
            />
          </svg>
          <a href="mailto:logosklogos@gmail.com" class="link link-hover font-mono">logosklogos@gmail.com</a>
        </div>
        <a class="btn btn-info btn-sm w-full gap-2" href="/pages/calendario">
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="2"
            stroke="currentColor"
            class="w-4 h-4"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5"
            />
          </svg>
          Consultar fechas
</a>      </div>
      <a
        target="_blank"
        href="https://facebook.com/logosklogos"
        class="
          link link-primary text-sm font-bold italic inline-flex items-center gap-1
        "
      >
        Anuncios en Facebook
        <svg
          xmlns="http://www.w3.org/2000/svg"
          fill="none"
          viewBox="0 0 24 24"
          stroke-width="2"
          stroke="currentColor"
          class="w-3 h-3"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25"
          />
        </svg>
      </a>
    </div>

    <div class="flex flex-col space-y-4">
      <h3 class="text-3xl font-bold text-primary border-b border-base-300 pb-2">Seguinos en Facebook</h3>
      <p class="text-sm font-serif leading-relaxed">
        Interpretaciones, análisis morfológico, novedades del ministerio y
        avisos sobre cursos por ZOOM.
      </p>
      <div class="pt-4 flex justify-center">
        <a
          target="_blank"
          href="https://facebook.com/logosklogos"
          class="hover:opacity-80 transition-opacity"
        >
          <img alt="facebook" class="w-32" src="/assets/follow-us-on-facebook-d1f0f315.svg" />
        </a>
      </div>
    </div>

    <div class="flex flex-col space-y-4">
      <h3 class="text-3xl font-bold text-primary border-b border-base-300 pb-2">Videos y YouTube</h3>
      <p class="text-sm font-serif leading-relaxed">Suscríbase para ver interpretaciones del texto griego en video.</p>
      <div class="flex flex-col gap-2">
        <button
          onclick="playVideo('2WLIbqRBIp4')"
          class="
            btn btn-ghost btn-sm justify-start p-2 h-auto gap-3 bg-base-200
          "
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 24 24"
            fill="currentColor"
            class="w-5 h-5 text-error"
          >
            <path
              fill-rule="evenodd"
              d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm14.024-.983a1.125 1.125 0 0 1 0 1.966l-5.603 3.113A1.125 1.125 0 0 1 9 15.113V8.887c0-.857.921-1.4 1.671-.983l5.603 3.113Z"
              clip-rule="evenodd"
            />
          </svg>
          <span class="text-left text-xs leading-tight">Escuchemos<br>la palabra de Dios</span>
        </button>
        <button
          onclick="playVideo('UYJVrbfWfto')"
          class="btn btn-ghost btn-sm justify-start gap-3 bg-base-200"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 24 24"
            fill="currentColor"
            class="w-5 h-5 text-error"
          >
            <path
              fill-rule="evenodd"
              d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm14.024-.983a1.125 1.125 0 0 1 0 1.966l-5.603 3.113A1.125 1.125 0 0 1 9 15.113V8.887c0-.857.921-1.4 1.671-.983l5.603 3.113Z"
              clip-rule="evenodd"
            />
          </svg>
          Testimonial
        </button>
        <button
          onclick="playVideo('WA08LWm_9hs')"
          class="
            btn btn-ghost btn-sm h-auto py-2 justify-start gap-3 bg-base-200
          "
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 24 24"
            fill="currentColor"
            class="w-5 h-5 text-error shrink-0"
          >
            <path
              fill-rule="evenodd"
              d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm14.024-.983a1.125 1.125 0 0 1 0 1.966l-5.603 3.113A1.125 1.125 0 0 1 9 15.113V8.887c0-.857.921-1.4 1.671-.983l5.603 3.113Z"
              clip-rule="evenodd"
            />
          </svg>
          <span class="text-left text-xs leading-tight">Juan 1:1 - El Verbo<br><span class="opacity-60 italic">Interpretación Griego</span></span>
        </button>
      </div>

      <div class="pt-2 flex justify-center">
        <a class="hover:scale-105 transition-transform" href="https://www.youtube.com/channel/UCkVYAwHlNoB9sW_wEt-egFw?sub_confirmation=1">
          <img alt="YouTube" class="w-32" src="/assets/subscribe-youtube-logo-svgrepo-com-db80eb48.svg" />
</a>      </div>
    </div>
  </div>
</div>
<script>
  const modal = document.getElementById('video_modal');
  const iframe = document.getElementById('mainFrame');

  function playVideo(videoId) {
    // Construimos la URL dinámicamente
    iframe.src = `https://www.youtube.com/embed/${videoId}?rel=0`;
    modal.showModal();
  }

  function closeVideo() {
    iframe.src = ""; // Detiene cualquier video
  }
</script>

<div data-controller="promo-modal">
  <dialog
    data-promo-modal-target="dialog"
    class="modal w-screen modal-bottom sm:modal-middle"
  >
    <div class="modal-box w-11/12 max-w-2xl text-center">
      <h3 class="font-bold text-xl mb-4">Ya están los libros en venta online</h3>
      <div class="flex flex-wrap justify-center gap-3 my-6">
        <img class="w-20 h-auto rounded shadow-sm" alt="Libro Griego" src="/assets/Griego-128-e016083c.png" />
        <img class="w-20 h-auto rounded shadow-sm" alt="Libro Evangelio" src="/assets/Evangelio-128-3d050585.png" />
        <img class="w-20 h-auto rounded shadow-sm" alt="Libro Genesis" src="/assets/Genesis-128-fa7c74c5.png" />
        <img class="w-20 h-auto rounded shadow-sm" alt="Libro Lucas" src="/assets/lucas128-45604ddd.png" />
        <img class="w-20 h-auto rounded shadow-sm" alt="Libro Exodo" src="/assets/exodo128-db2d86d3.png" />
      </div>

      <p class="mb-4">
        Para más información haga click
        <a
          href="https://www.amazon.com/stores/author/B0DPR2JNY9/allbooks/"
          class="link link-primary font-bold"
          target="_blank"
        >Acá</a>
      </p>

      <div class="modal-action">
        <form method="dialog">
          <button class="btn btn-neutral">Cerrar</button>
        </form>
      </div>
    </div>

    <form method="dialog" class="modal-backdrop">
      <button>close</button>
    </form>
  </dialog>
</div>

        <div
  class="
    fixed bottom-[calc(env(safe-area-inset-bottom)+1.5rem)] left-8 z-40 flex
    flex-col gap-2 opacity-70
  "
>
  <!-- Scroll to top -->
  <button
    id="scroll-top"
    aria-label="Scroll to top"
    class="
      btn btn-circle btn-sm bg-base-200/70 backdrop-blur-md hover:bg-base-200 shadow
    "
  >
    <svg
      xmlns="http://www.w3.org/2000/svg"
      class="w-4 h-4"
      fill="none"
      viewBox="0 0 24 24"
      stroke="currentColor"
    >
      <path
        stroke-linecap="round"
        stroke-linejoin="round"
        stroke-width="2"
        d="M5 15l7-7 7 7"
      />
    </svg>
  </button>
  <!-- Scroll to bottom -->
  <button
    id="scroll-bottom"
    aria-label="Scroll to bottom"
    class="
      btn btn-circle btn-sm bg-base-200/70 backdrop-blur-md hover:bg-base-200 shadow
    "
  >
    <svg
      xmlns="http://www.w3.org/2000/svg"
      class="w-4 h-4"
      fill="none"
      viewBox="0 0 24 24"
      stroke="currentColor"
    >
      <path
        stroke-linecap="round"
        stroke-linejoin="round"
        stroke-width="2"
        d="M19 9l-7 7-7-7"
      />
    </svg>
  </button>
</div>
<script>
  (() => {
    const prefersReducedMotion =
      window.matchMedia('(prefers-reduced-motion: reduce)').matches;

    const scrollOptions = prefersReducedMotion
      ? {}
      : { behavior: 'smooth' };

    document.getElementById('scroll-top')?.addEventListener('click', () => {
      window.scrollTo({ top: 0, ...scrollOptions });
    });

    document.getElementById('scroll-bottom')?.addEventListener('click', () => {
      window.scrollTo({
        top: document.documentElement.scrollHeight,
        ...scrollOptions
      });
    });
  })();

  if (document.documentElement.scrollHeight <= window.innerHeight + 50) {
    document.querySelector('[id^="scroll-"]')?.classList.add('hidden');
  }
</script>

    </main>

    <!-- FOOTER -->
      <footer class="footer p-10 bg-neutral text-neutral-content">
  <div
    class="
      grid grid-cols-1 md:auto-cols-max grid-flow-row md:grid-flow-col gap-2 md:gap-8
    "
  >
    <div>
      <a class="text-2xl font-bold" href="/">LogosKLogos</a>
      <p>Estudio Bíblico Interlineal<br>©
        2026
        Todos los derechos reservados</p>
      <div class="text-accent">
        Esta web app fue hecho por
        <span class="text-info" >Nissy web</span>
      </div>
    </div>

    <div>
      <h6 class="footer-title">Sitio</h6>
      <a class="link link-hover" href="/">Inicio</a>
      <a class="link link-hover" href="/interlinears/NT/Jn">Nuevo Testamento</a>
      <a class="link link-hover" href="/interlinears/AT/Gn">Antiguo Testamento</a>
    </div>

    <div>
      <h6 class="footer-title">Herramientas</h6>
      <a class="link link-hover" href="/strongcodes">Diccionario Griego</a>
      <a class="link link-hover" href="/strong_hebrew">Diccionario Hebreo</a>
    </div>

    <div>
      <h6 class="footer-title">Social</h6>
      <div class="grid grid-flow-col gap-4">
        <a
          href="https://facebook.com/logosklogos/"
          aria-label="Facebook"
          target="_blank"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="1.5"
            stroke="currentColor"
            class="size-6"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M7.5 8.25h9m-9 3h6m1.5 6.75L12 18l-4.5 2.25V5.25A2.25 2.25 0 0 1 9.75 3h4.5A2.25 2.25 0 0 1 16.5 5.25v14.25Z"
            />
          </svg>
        </a>

        <a
          href="https://www.instagram.com/logosklogos/"
          aria-label="Instagram"
          target="_blank"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="1.5"
            stroke="currentColor"
            class="size-6"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M6 12l14-9-4 18-3-7.5L6 12Z"
            />
          </svg>
        </a>

        <a
          href="https://www.youtube.com/channel/UCkVYAwHlNoB9sW_wEt-egFw"
          aria-label="YouTube"
          target="_blank"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            stroke-width="1.5"
            stroke="currentColor"
            class="size-6"
          >
            <path
              stroke-linecap="round"
              stroke-linejoin="round"
              d="M14.25 12l-4.5-2.25v4.5L14.25 12ZM12 21a9 9 0 1 1 0-18 9 9 0 0 1 0 18Z"
            />
          </svg>
        </a>
      </div>
    </div>
  </div>
</footer>
 <!-- Should be styled with DaisyUI Footer class internally -->
    <div id="notifications" class="toast toast-end toast-bottom z-[100]">
    </div>
    <turbo-frame id="modal_admin"></turbo-frame>
    <div data-controller="keyboard-shortcut"
       data-keyboard-shortcut-config-value="[{&quot;key&quot;:&quot;l&quot;,&quot;url&quot;:&quot;/&quot;},{&quot;key&quot;:&quot;h&quot;,&quot;url&quot;:&quot;/strong_hebrew&quot;},{&quot;key&quot;:&quot;g&quot;,&quot;url&quot;:&quot;/strongcodes&quot;},{&quot;key&quot;:&quot;c&quot;,&quot;url&quot;:&quot;/pages/calendario&quot;},{&quot;key&quot;:&quot;a&quot;,&quot;url&quot;:&quot;/interlinears/AT/Gn&quot;},{&quot;key&quot;:&quot;n&quot;,&quot;url&quot;:&quot;/interlinears/NT/Mt&quot;}]">
    </div>
  </body>
</html>
