{% set restyled="v2" %}
{% extends 'base.html' %}

{% set headerDropdownTheme = "dark" %}

{% set metaDescription = "Kotlin is a concise and multiplatform programming language by JetBrains. Enjoy coding and build server-side, mobile, web, and desktop applications efficiently." %}

{% block head_preload %}
    <link rel="preload" href="/assets/fonts/Inter/Inter-Regular.woff2" as="font">
    <link rel="preload" href="/assets/fonts/Inter/Inter-Bold.woff2" as="font">

    <link rel="preload" href="/assets/fonts/JetBrainsMono/JetBrainsMono-Regular.woff2" as="font">
    <link rel="preload" href="/assets/fonts/JetBrainsMono/JetBrainsMono-Bold.woff2" as="font">
    <link rel="preload" href="/assets/fonts/JetBrainsMono/JetBrainsMono-Italic.woff2" as="font">
{% endblock %}

{% block body_class %}page__index-new{% endblock %}

{% block page_outer_content %}
    {% include 'inc/pages/index/intro.html' %}

    <section class="kotlin-banner-section kto-overview-section kto-overview-section_mode_dark kotlin-banner-section_first" data-test="index-page-banner">
      <div class="g-layout">
        {% include 'inc/pages/index/latest-news.html' %}
      </div>
    </section>

    {% include 'inc/pages/index/code-examples.html' %}
    {% include 'inc/pages/index/kotlin-values.html' %}

    {% include 'inc/pages/index/why-section.html' %}

    <section id="get-started" class="kto-overview-section kotlin-get-started-section">
        <div class="g-layout">
            <p class="kto-text kto-text_size_s">Want to give it a try?</p>
            <h2 class="kto-heading kto-heading_size_hero kotlin-get-started-section__title">
                <a class="kto-anchor-link" href="#get-started">
                    Start using Kotlin today!<br>
                    Build your first app in your favorite IDE
                </a>
            </h2>
            <a
                    class="kto-button kto-button_size_m kto-button_mode_contrast smooth-anchor"
                    href="/docs/getting-started.html"
            >Get started</a>
        </div>
    </section>
{% endblock %}

{% block styles %}
    <link rel="stylesheet" href="{{ url_for('static', filename='index.css')|autoversion }}">
{% endblock %}

{% block scripts %}
    <script src="{{ url_for('static', filename='index.js')|autoversion }}"></script>
{% endblock %}