{% extends 'layout.html' %}
{% load i18n %}
{% load static %}

{% block headers %}
    <meta name="description" content="{% trans 'CCrypto VPN is an affordable, fast, anonymous and secure VPN service' %}" />
{% endblock %}

{% block content %}
<div class="homepage">
    <h2>{% trans 'Secure your browsing with a VPN' %}</h2>

    <div class="features left">
        <div class="title">
            <h3>{% trans 'Hide your IP Address' %}</h3>
        </div>
        <div class="inner">
            <p>‣ 
                {% blocktrans trimmed %}
                From sites and corporations tracking you for advertising, marketing, geo-blocking, ...
                and sometimes leaking the data or ignoring regulations.
                {% endblocktrans %}
            </p>
            <p>‣ 
                {% blocktrans trimmed %}
                From attackers collecting leaked data or harvesting IP addresses on P2P networks to stalk or extort you.
                {% endblocktrans %}
            </p>
        </div>
    </div>
    <div class="features right">
        <div class="title">
            <h3>{% trans 'through a Secure Tunnel to the Internet' %}</h3>
        </div>
        <div class="inner">
            <p>‣
                {% blocktrans trimmed %}
                Defend against eavesdropping & tampering, from compromised WiFi access points to intrusive corporate monitoring and Deep Packet Inspection.
                {% endblocktrans %}
            </p>
            <p>‣
                {% blocktrans trimmed %}
                Avoid network limitations (IPv6 unavailable, bad peering, misconfigured firewalls, ...)
                and circumvent interception attempts (lying DNS, DNS blocking, ...)
                {% endblocktrans %}
            </p>
        </div>
    </div>
    <div class="features center">
        <div class="title">
            <h3>{% trans 'CCrypto VPN is a simple solution for only 3€/month' %}</h3>
        </div>
        <div class="inner">
            <ul>
                <li>{% trans 'Access to fast & secure servers around the world with no data cap.' %}</li>
                <li>{% trans 'Powered by OpenVPN or WireGuard, freely available on Windows, Linux, macOS, Android, iOS, and many more.' %}</li>
                <li>{% trans 'With the best encryption available, IPv4 & IPv6, private DNS resolvers, and DDoS protection.' %}</li>
                <li>{% trans 'Subscribe with PayPal, credit card, or any of 40+ cryptocurrencies' %}</li>
            </ul>
        </div>
    </div>

    <p class="home-signup">
        <a href="/account/signup" class="home-signup-button button inverted">
            {% trans 'Sign up & try for a week for free' %}
        </a>
    </p>

    <div class="locations">
        <object id="map" data="{% static 'img/world.svg' %}" type="image/svg+xml"></object>
        {{gateway_locations|json_script:"locations-data"}}
        <script type="text/javascript" src="{% static 'js/map.js' %}"></script>
        <p class="more">
            <a href="/status">{% trans 'more on our infrastructure' %}</a>
        </p>
    </div>

</div>

{% endblock %}
