@extends('layouts.default')

@section('title', __('seo.home.title'))
@section('meta_description', __('seo.home.description'))
@section('canonical', route('home'))

@section('styles')
    <style>
        .local-home {
            padding: 90px 70px;
        }

        .local-home__card {
            max-width: 1400px;
            margin: 0 auto;
            padding: clamp(32px, 6vw, 70px);
            border-radius: 30px;
            background: var(--section-secondary-color);
        }

        .local-home__tag {
            display: inline-block;
            margin-bottom: 18px;
            padding: 8px 16px;
            border-radius: 30px;
            color: var(--text-primary);
            background: var(--tag-bg);
            font-family: Raleway, sans-serif;
            font-size: 14px;
            font-weight: 500;
        }

        .local-home h2 {
            max-width: 780px;
            margin: 0 0 18px;
            color: var(--text-primary);
            font-family: Raleway, sans-serif;
            font-size: clamp(28px, 4vw, 46px);
            line-height: 1.2;
        }

        .local-home p {
            max-width: 850px;
            margin: 0 0 28px;
            color: var(--text-secondary);
            font-family: Raleway, sans-serif;
            font-size: 17px;
            line-height: 1.7;
        }

        @media (max-width: 767px) {
            .local-home {
                padding: 60px 20px;
            }
        }
    </style>
@endsection

@section('content')
    <section class="header">
        <div data-poster-url="{{ asset('videos/john_doe_hero_video-poster-00001.jpg') }}"
             data-video-urls="{{ asset('videos/john_doe_hero_video-transcode.webm') }},{{ asset('videos/john_doe_hero_video-transcode.mp4') }}"
             data-autoplay="true" data-loop="true" data-wf-ignore="true"
             class="header-bg-video w-background-video w-background-video-atom">
            <video id="9d3fa6af-728e-3909-4ea1-7bb03a7d7a13-video" autoplay loop muted playsinline
                   poster="{{ asset('videos/john_doe_hero_video-poster-00001.jpg') }}"
                   preload="metadata" data-wf-ignore="true" data-object-fit="cover">
                <source src="{{ asset('videos/john_doe_hero_video-transcode.webm') }}" type="video/webm" data-wf-ignore="true">
                <source src="{{ asset('videos/john_doe_hero_video-transcode.mp4') }}" type="video/mp4" data-wf-ignore="true">
            </video>
        </div>
        <div class="header-shadow"></div>
        <h1 class="header-title">{!! __('home.header') !!}</h1>
    </section>


    <section class="about-me">
        <div class="w-layout-blockcontainer container about-me-container w-container">

            <img src="{{ asset('images/about-me.jpg') }}" width="1144" height="auto" loading="lazy"
                 alt="Florian Vieira, développeur web freelance" class="about-me-picture">
            <div class="about-me-div">
                <div class="about-me-title">{{ __('home.about-title') }}</div>
                <div class="about-me-text">{!! __('home.about-text') !!}</div>

                <a href="{{ route('projects') }}" class="btn w-inline-block">
                    <div class="btn-label">{{ __('home.about-btn-1') }}</div>
                </a>

                <a href="{{ route('contact') }}" class="btn-outline btn-mt-10 w-inline-block">
                    <div class="btn-outline-label">{{ __('home.about-btn-2') }}</div>
                </a>
            </div>
        </div>
    </section>

    <section class="skills">
        <div class="w-layout-blockcontainer container skill-container w-container">

            <div class="skill-animation" data-w-id="ef0aff8b-420f-1d2f-750e-edc4e9d4a588" data-animation-type="lottie"
                 data-src="documents/hard_skills_light_mode.json" data-loop="1" data-direction="1" data-autoplay="1"
                 data-is-ix2-target="0" data-renderer="svg" data-default-duration="1.4666666666666666"
                 data-duration="0"></div>

            <h2 class="title-1">{{ __('home.skill-title') }}</h2>
            <div class="w-layout-grid grid-skills">

                <div id="w-node-_15ba0c6e-c684-121b-34ce-b5eb554c1d51-e664ed4f" class="skill-card">
                    <svg width="35" height="35" viewBox="0 0 30 30" class="svg-skill skill-picto"
                         xmlns="http://www.w3.org/2000/svg">
                        <g clip-path="url(#clip0_1025_4527)">
                            <path id="Vector"
                                  d="M26.6247 17.35L26.0622 17.025C26.1872 16.35 26.2497 15.6625 26.2497 14.9875C26.2497 14.3125 26.1872 13.6375 26.0622 12.95L26.6247 12.625C28.4122 11.6 29.0372 9.30005 28.0122 7.50005C27.5122 6.63755 26.6997 6.01255 25.7372 5.75005C24.7747 5.48755 23.7622 5.62505 22.8872 6.12505L22.3247 6.45005C21.2747 5.55005 20.0622 4.85005 18.7497 4.38755V3.73755C18.7497 1.67505 17.0622 -0.0124512 14.9997 -0.0124512C12.9372 -0.0124512 11.2497 1.67505 11.2497 3.73755V4.38755C9.93722 4.85005 8.72472 5.55005 7.67472 6.45005L7.11222 6.12505C6.24972 5.62505 5.23722 5.50005 4.26222 5.75005C3.29972 6.01255 2.48722 6.63755 1.98722 7.50005C0.96222 9.28755 1.57472 11.5875 3.36222 12.625L3.92472 12.95C3.79972 13.625 3.73722 14.3125 3.73722 14.9875C3.73722 15.6625 3.79972 16.3375 3.92472 17.025L3.36222 17.35C1.57472 18.375 0.94972 20.675 1.97472 22.475C2.47472 23.3375 3.28722 23.9625 4.24972 24.225C5.21222 24.4875 6.22472 24.35 7.09972 23.85L7.66222 23.525C8.71222 24.425 9.92472 25.125 11.2372 25.5875V26.2375C11.2372 28.3 12.9247 29.9875 14.9872 29.9875C17.0497 29.9875 18.7372 28.3 18.7372 26.2375V25.5875C20.0497 25.125 21.2622 24.425 22.3122 23.525L22.8747 23.85C23.7372 24.35 24.7497 24.4875 25.7247 24.225C26.6872 23.9625 27.4997 23.3375 27.9997 22.475C29.0247 20.6875 28.4122 18.3875 26.6247 17.35ZM23.4247 12.675C23.6372 13.45 23.7497 14.2375 23.7497 15C23.7497 15.7625 23.6372 16.5375 23.4247 17.325C23.2747 17.875 23.5122 18.45 24.0122 18.7375L25.3747 19.525C25.9747 19.875 26.1747 20.6375 25.8372 21.2375C25.6747 21.525 25.3997 21.7375 25.0747 21.825C24.7497 21.9125 24.4122 21.875 24.1247 21.7001L22.7622 20.9125C22.2622 20.625 21.6497 20.7125 21.2497 21.125C20.1372 22.2625 18.7372 23.0751 17.1872 23.475C16.6372 23.6126 16.2497 24.1125 16.2497 24.6875V26.2626C16.2497 26.9501 15.6872 27.5126 14.9997 27.5126C14.3122 27.5126 13.7497 26.9501 13.7497 26.2626V24.6875C13.7497 24.1125 13.3622 23.625 12.8122 23.475C11.2622 23.0751 9.86222 22.2625 8.74972 21.125C8.51222 20.875 8.18722 20.75 7.84972 20.75C7.63722 20.75 7.42472 20.8 7.22472 20.9125L5.86222 21.7001C5.57472 21.8626 5.23722 21.9125 4.91222 21.825C4.58722 21.7375 4.32472 21.525 4.14972 21.2375C3.81222 20.6375 4.01222 19.875 4.61222 19.525L5.97472 18.7375C6.47472 18.45 6.71222 17.875 6.56222 17.325C6.34972 16.55 6.23722 15.7625 6.23722 15C6.23722 14.2375 6.34972 13.4625 6.56222 12.675C6.71222 12.125 6.47472 11.55 5.97472 11.2625L4.61222 10.475C4.01222 10.125 3.81222 9.36255 4.14972 8.76255C4.31222 8.47505 4.58722 8.26255 4.91222 8.17505C5.23722 8.08755 5.57472 8.13755 5.86222 8.30005L7.22472 9.08755C7.72472 9.37505 8.33722 9.28755 8.73722 8.87505C9.84972 7.73755 11.2497 6.92505 12.7997 6.52505C13.3497 6.38755 13.7372 5.88755 13.7372 5.31255V3.73755C13.7372 3.05005 14.2997 2.48755 14.9872 2.48755C15.6747 2.48755 16.2372 3.05005 16.2372 3.73755V5.31255C16.2372 5.88755 16.6247 6.37505 17.1747 6.52505C18.7247 6.92505 20.1247 7.73755 21.2372 8.87505C21.6372 9.28755 22.2622 9.37505 22.7497 9.08755L24.1122 8.30005C24.3997 8.13755 24.7372 8.08755 25.0622 8.17505C25.3872 8.26255 25.6497 8.47505 25.8247 8.76255C26.1622 9.36255 25.9622 10.125 25.3622 10.475L23.9997 11.2625C23.4997 11.55 23.2622 12.125 23.4122 12.675H23.4247ZM17.2247 10.25L15.2247 20.25C15.1122 20.85 14.5872 21.25 13.9997 21.25C13.9247 21.25 13.8372 21.25 13.7497 21.225C13.0747 21.0875 12.6372 20.4375 12.7747 19.75L14.7747 9.75005C14.9122 9.07505 15.5622 8.63755 16.2497 8.77505C16.9247 8.91255 17.3622 9.56255 17.2247 10.25ZM11.5122 13.5625L9.99972 15.075L11.5122 16.5625C11.9997 17.05 11.9997 17.8375 11.5122 18.325C11.2622 18.575 10.9497 18.6875 10.6247 18.6875C10.2997 18.6875 9.98722 18.5625 9.73722 18.325L8.22472 16.8125C7.24972 15.8375 7.24972 14.2625 8.22472 13.3L9.73722 11.7875C10.2247 11.3 11.0122 11.3 11.4997 11.7875C11.9872 12.275 11.9872 13.0625 11.4997 13.55L11.5122 13.5625ZM21.7747 13.3125C22.7497 14.2875 22.7497 15.8625 21.7747 16.825L20.2622 18.3375C20.0122 18.5875 19.6997 18.7 19.3747 18.7C19.0497 18.7 18.7372 18.575 18.4872 18.3375C17.9997 17.85 17.9997 17.0625 18.4872 16.5751L19.9997 15.0625L18.4872 13.5625C17.9997 13.075 17.9997 12.2875 18.4872 11.8C18.9747 11.3125 19.7622 11.3125 20.2497 11.8L21.7622 13.3125H21.7747Z"/>
                        </g>
                    </svg>

                    <h3 class="skill-name">{!! __('home.skill-1.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-1.text') }}</p>
                </div>

                <div id="w-node-_341d7c7e-0994-a76b-2321-9da672051616-e664ed4f" class="skill-card">
                    <svg width="35" height="35" viewBox="0 0 30 30" class="svg-skill skill-picto"
                         xmlns="http://www.w3.org/2000/svg">
                        <g clip-path="url(#clip0_1132_7332)">
                            <path
                                d="M22.4997 11.33C22.4999 10.8272 22.4006 10.3293 22.2075 9.86509C22.0144 9.40084 21.7314 8.97938 21.3747 8.625C20.6449 7.92856 19.6748 7.54 18.666 7.54C17.6572 7.54 16.6871 7.92856 15.9572 8.625L1.12474 23.4612C0.44776 24.1872 0.0790383 25.1475 0.0962818 26.14C0.113525 27.1324 0.515387 28.0794 1.21717 28.7813C1.91896 29.4833 2.86585 29.8854 3.85828 29.9028C4.85072 29.9203 5.81118 29.5518 6.53724 28.875L21.3747 14.0387C21.732 13.684 22.0153 13.262 22.2084 12.797C22.4015 12.3321 22.5005 11.8335 22.4997 11.33ZM4.76974 27.11C4.51704 27.3509 4.18134 27.4852 3.83224 27.4852C3.48314 27.4852 3.14743 27.3509 2.89474 27.11C2.64651 26.8611 2.5071 26.524 2.5071 26.1725C2.5071 25.821 2.64651 25.4839 2.89474 25.235L12.606 15.5225L14.4872 17.4038L4.76974 27.11ZM19.6097 12.27L16.2497 15.6313L14.3747 13.75L17.736 10.39C17.8558 10.2531 18.0025 10.1423 18.1669 10.0644C18.3313 9.98652 18.5099 9.94321 18.6917 9.93717C18.8735 9.93114 19.0546 9.9625 19.2238 10.0293C19.393 10.0961 19.5467 10.197 19.6754 10.3256C19.804 10.4543 19.9048 10.6079 19.9717 10.7771C20.0385 10.9463 20.0698 11.1275 20.0638 11.3093C20.0578 11.4911 20.0145 11.6697 19.9366 11.8341C19.8587 11.9985 19.7479 12.1452 19.611 12.265L19.6097 12.27ZM6.07849 3.56875L8.01599 3.01625L8.56849 1.07875C8.65749 0.767856 8.84531 0.494396 9.10353 0.299725C9.36176 0.105053 9.67635 -0.000244141 9.99974 -0.000244141C10.3231 -0.000244141 10.6377 0.105053 10.8959 0.299725C11.1542 0.494396 11.342 0.767856 11.431 1.07875L11.9835 3.01625L13.921 3.56875C14.2319 3.65776 14.5053 3.84557 14.7 4.1038C14.8947 4.36202 15 4.67662 15 5C15 5.32338 14.8947 5.63798 14.7 5.8962C14.5053 6.15443 14.2319 6.34224 13.921 6.43125L11.9835 6.98375L11.431 8.92125C11.342 9.23214 11.1542 9.5056 10.8959 9.70027C10.6377 9.89495 10.3231 10.0002 9.99974 10.0002C9.67635 10.0002 9.36176 9.89495 9.10353 9.70027C8.84531 9.5056 8.65749 9.23214 8.56849 8.92125L8.01599 6.98375L6.07849 6.43125C5.76759 6.34224 5.49413 6.15443 5.29946 5.8962C5.10479 5.63798 4.99949 5.32338 4.99949 5C4.99949 4.67662 5.10479 4.36202 5.29946 4.1038C5.49413 3.84557 5.76759 3.65776 6.07849 3.56875ZM28.921 21.4312L26.9835 21.9837L26.431 23.9212C26.342 24.2321 26.1542 24.5056 25.8959 24.7003C25.6377 24.8949 25.3231 25.0002 24.9997 25.0002C24.6764 25.0002 24.3618 24.8949 24.1035 24.7003C23.8453 24.5056 23.6575 24.2321 23.5685 23.9212L23.016 21.9837L21.0785 21.4312C20.7676 21.3422 20.4941 21.1544 20.2995 20.8962C20.1048 20.638 19.9995 20.3234 19.9995 20C19.9995 19.6766 20.1048 19.362 20.2995 19.1038C20.4941 18.8456 20.7676 18.6578 21.0785 18.5688L23.016 18.0163L23.5685 16.0788C23.6575 15.7679 23.8453 15.4944 24.1035 15.2997C24.3618 15.1051 24.6764 14.9998 24.9997 14.9998C25.3231 14.9998 25.6377 15.1051 25.8959 15.2997C26.1542 15.4944 26.342 15.7679 26.431 16.0788L26.9835 18.0163L28.921 18.5688C29.2319 18.6578 29.5053 18.8456 29.7 19.1038C29.8947 19.362 30 19.6766 30 20C30 20.3234 29.8947 20.638 29.7 20.8962C29.5053 21.1544 29.2319 21.3422 28.921 21.4312ZM22.1935 3.125L23.8885 2.64125L24.3747 0.94375C24.4539 0.673521 24.6185 0.436215 24.8438 0.267391C25.0692 0.0985672 25.3432 0.00731848 25.6247 0.00731848C25.9063 0.00731848 26.1803 0.0985672 26.4057 0.267391C26.631 0.436215 26.7956 0.673521 26.8747 0.94375L27.3585 2.63875L29.0535 3.1225C29.3237 3.20164 29.561 3.36622 29.7298 3.59157C29.8987 3.81693 29.9899 4.09092 29.9899 4.3725C29.9899 4.65408 29.8987 4.92807 29.7298 5.15343C29.561 5.37878 29.3237 5.54336 29.0535 5.6225L27.3585 6.10625L26.8747 7.805C26.7956 8.07523 26.631 8.31254 26.4057 8.48136C26.1803 8.65018 25.9063 8.74143 25.6247 8.74143C25.3432 8.74143 25.0692 8.65018 24.8438 8.48136C24.6185 8.31254 24.4539 8.07523 24.3747 7.805L23.891 6.11125L22.1935 5.625C21.9233 5.54586 21.686 5.38128 21.5171 5.15593C21.3483 4.93057 21.2571 4.65658 21.2571 4.375C21.2571 4.09342 21.3483 3.81943 21.5171 3.59407C21.686 3.36872 21.9233 3.20414 22.1935 3.125Z"/>
                        </g>
                    </svg>


                    <h3 class="skill-name">{!! __('home.skill-2.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-2.text') }}</p>
                </div>

                <div id="w-node-e081ba59-7d56-b176-334a-eaa82ab7e392-e664ed4f" class="skill-card">
                    <svg width="20" height="30" viewBox="0 0 20 30" class="svg-skill skill-picto"
                         xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M10 4.99997C10 2.23747 7.7625 -2.91746e-05 5 -2.91746e-05C2.2375 -2.91746e-05 0 2.23747 0 4.99997V8.74997C0 11.5125 2.2375 13.75 5 13.75C7.7625 13.75 10 11.5125 10 8.74997V4.99997ZM7.5 8.74997C7.5 10.125 6.375 11.25 5 11.25C3.625 11.25 2.5 10.125 2.5 8.74997V4.99997C2.5 3.62497 3.625 2.49997 5 2.49997C6.375 2.49997 7.5 3.62497 7.5 4.99997V8.74997ZM15 16.25C12.2375 16.25 10 18.4875 10 21.25V25C10 27.7625 12.2375 30 15 30C17.7625 30 20 27.7625 20 25V21.25C20 18.4875 17.7625 16.25 15 16.25ZM17.5 25C17.5 26.375 16.375 27.5 15 27.5C13.625 27.5 12.5 26.375 12.5 25V21.25C12.5 19.875 13.625 18.75 15 18.75C16.375 18.75 17.5 19.875 17.5 21.25V25ZM13.5625 5.18747C13.075 4.69997 13.075 3.91247 13.5625 3.42497L16.6125 0.362471C16.975 -2.91909e-05 17.5125 -0.100029 17.975 0.0874708C18.4375 0.274971 18.75 0.737471 18.75 1.23747V12.5C18.75 13.1875 18.1875 13.75 17.5 13.75C16.8125 13.75 16.25 13.1875 16.25 12.5V4.26247L15.325 5.18747C14.8375 5.67497 14.05 5.67497 13.5625 5.18747ZM6.25 17.5V28.75C6.25 29.4375 5.6875 30 5 30C4.3125 30 3.75 29.4375 3.75 28.75V20.5125L2.825 21.4375C2.3375 21.925 1.55 21.925 1.0625 21.4375C0.575 20.95 0.575 20.1625 1.0625 19.675L4.1125 16.625C4.475 16.2625 5.0125 16.1625 5.475 16.35C5.9375 16.5375 6.25 17 6.25 17.5Z"
                        />
                    </svg>


                    <h3 class="skill-name">{!! __('home.skill-3.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-3.text') }}</p>
                </div>
                <div id="w-node-_349d372f-2646-6fa0-1a5d-8ab53adb5c97-e664ed4f" class="skill-card">
                    <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 -960 960 960"
                         class="svg-skill skill-picto"
                    >
                        <path
                            d="m480-400-80-80 80-80 80 80-80 80Zm-85-235L295-735l185-185 185 185-100 100-85-85-85 85ZM225-295 40-480l185-185 100 100-85 85 85 85-100 100Zm510 0L635-395l85-85-85-85 100-100 185 185-185 185ZM480-40 295-225l100-100 85 85 85-85 100 100L480-40Z"/>
                    </svg>

                    <h3 class="skill-name">{!! __('home.skill-4.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-4.text') }}</p>
                </div>

                <div id="w-node-_349d372f-2646-6fa0-1a5d-8ab53adb5c97-e664ed4f" class="skill-card">
                    <svg xmlns="http://www.w3.org/2000/svg" class="svg-skill skill-picto" width="30" height="30"
                         viewBox="0 0 30 30" fill="none">
                        <path
                            d="M10.4721 18.1388V11.8888C10.4721 11.4954 10.6053 11.1656 10.8717 10.8992C11.1378 10.6331 11.4676 10.5 11.8613 10.5H18.1112C18.5046 10.5 18.8344 10.6331 19.1008 10.8992C19.3669 11.1656 19.5 11.4954 19.5 11.8888V18.1388C19.5 18.5324 19.3669 18.8622 19.1008 19.1283C18.8344 19.3947 18.5046 19.5279 18.1112 19.5279H11.8613C11.4676 19.5279 11.1378 19.3947 10.8717 19.1283C10.6053 18.8622 10.4721 18.5324 10.4721 18.1388ZM13.25 16.75H16.7221V13.2779H13.25V16.75ZM10 28.6112V26.6667H6.11125C5.36125 26.6667 4.71069 26.3912 4.15958 25.8404C3.60875 25.2893 3.33333 24.6387 3.33333 23.8887V20H1.38875C0.995417 20 0.665556 19.8664 0.399167 19.5992C0.133056 19.3322 0 19.0013 0 18.6063C0 18.2113 0.133056 17.8818 0.399167 17.6179C0.665556 17.354 0.995417 17.2221 1.38875 17.2221H3.33333V12.6667H1.38875C0.995417 12.6667 0.665556 12.5331 0.399167 12.2658C0.133056 11.9989 0 11.6679 0 11.2729C0 10.8779 0.133056 10.5485 0.399167 10.2846C0.665556 10.0207 0.995417 9.88875 1.38875 9.88875H3.33333V6C3.33333 5.25 3.60875 4.59958 4.15958 4.04875C4.71069 3.49764 5.36125 3.22208 6.11125 3.22208H10V1.38875C10 0.995417 10.1336 0.665556 10.4008 0.399167C10.6678 0.133056 10.9988 0 11.3938 0C11.7888 0 12.1182 0.133056 12.3821 0.399167C12.646 0.665556 12.7779 0.995417 12.7779 1.38875V3.22208H17.3333V1.38875C17.3333 0.995417 17.4669 0.665556 17.7342 0.399167C18.0011 0.133056 18.3321 0 18.7271 0C19.1221 0 19.4515 0.133056 19.7154 0.399167C19.9793 0.665556 20.1112 0.995417 20.1112 1.38875V3.22208H24C24.75 3.22208 25.4004 3.49764 25.9513 4.04875C26.5024 4.59958 26.7779 5.25 26.7779 6V9.88875H28.6112C29.0046 9.88875 29.3344 10.0224 29.6008 10.2896C29.8669 10.5568 30 10.8878 30 11.2825C30 11.6775 29.8669 12.0069 29.6008 12.2708C29.3344 12.5347 29.0046 12.6667 28.6112 12.6667H26.7779V17.2221H28.6112C29.0046 17.2221 29.3344 17.3557 29.6008 17.6229C29.8669 17.8901 30 18.2211 30 18.6158C30 19.0108 29.8669 19.3403 29.6008 19.6042C29.3344 19.8681 29.0046 20 28.6112 20H26.7779V23.8887C26.7779 24.6387 26.5024 25.2893 25.9513 25.8404C25.4004 26.3912 24.75 26.6667 24 26.6667H20.1112V28.6112C20.1112 29.0046 19.9776 29.3344 19.7104 29.6008C19.4432 29.8669 19.1122 30 18.7175 30C18.3225 30 17.9931 29.8669 17.7292 29.6008C17.4653 29.3344 17.3333 29.0046 17.3333 28.6112V26.6667H12.7779V28.6112C12.7779 29.0046 12.6443 29.3344 12.3771 29.6008C12.1099 29.8669 11.7789 30 11.3842 30C10.9892 30 10.6597 29.8669 10.3958 29.6008C10.1319 29.3344 10 29.0046 10 28.6112ZM24 23.8887V6H6.11125V23.8887H24Z"
                        />
                    </svg>


                    <h3 class="skill-name">{!! __('home.skill-7.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-7.text') }}</p>
                </div>

                <div id="w-node-_349d372f-2646-6fa0-1a5d-8ab53adb5c97-e664ed4f" class="skill-card">
                    <svg xmlns="http://www.w3.org/2000/svg" class="svg-skill skill-picto" style="width: 40px!important;" width="40" height="30"
                         viewBox="0 0 37 30" fill="none">
                        <path
                            d="M3.11092 26.3333C2.34704 26.3333 1.69301 26.0614 1.14884 25.5175C0.604952 24.9733 0.333008 24.3193 0.333008 23.5554V5.77792C0.333008 5.01403 0.604952 4.36 1.14884 3.81583C1.69301 3.27195 2.34704 3 3.11092 3H20.8884C21.6523 3 22.3063 3.27195 22.8505 3.81583C23.3944 4.36 23.6663 5.01403 23.6663 5.77792V23.5554C23.6663 24.3193 23.3944 24.9733 22.8505 25.5175C22.3063 26.0614 21.6523 26.3333 20.8884 26.3333H3.11092ZM28.6663 13C28.1941 13 27.7983 12.8403 27.4788 12.5208C27.1594 12.2014 26.9997 11.8056 26.9997 11.3333V4.66667C26.9997 4.19444 27.1594 3.79861 27.4788 3.47917C27.7983 3.15972 28.1941 3 28.6663 3H35.333C35.8052 3 36.2011 3.15972 36.5205 3.47917C36.84 3.79861 36.9997 4.19444 36.9997 4.66667V11.3333C36.9997 11.8056 36.84 12.2014 36.5205 12.5208C36.2011 12.8403 35.8052 13 35.333 13H28.6663ZM29.7776 10.2221H34.2218V5.77792H29.7776V10.2221ZM3.11092 23.5554H20.8884V5.77792H3.11092V23.5554ZM6.72176 19.6667H17.2776C17.5459 19.6667 17.7473 19.5417 17.8818 19.2917C18.0159 19.0417 17.9997 18.7962 17.833 18.5554L14.8468 14.5696C14.6987 14.3843 14.5136 14.2917 14.2913 14.2917C14.0691 14.2917 13.884 14.3843 13.7359 14.5696L11.1663 18L9.43009 15.6946C9.28204 15.5093 9.0969 15.4167 8.87467 15.4167C8.65245 15.4167 8.46731 15.5093 8.31926 15.6946L6.16634 18.5554C5.99967 18.7962 5.98342 19.0417 6.11759 19.2917C6.25204 19.5417 6.45342 19.6667 6.72176 19.6667ZM28.6663 26.3333C28.1941 26.3333 27.7983 26.1736 27.4788 25.8542C27.1594 25.5347 26.9997 25.1389 26.9997 24.6667V18C26.9997 17.5278 27.1594 17.1319 27.4788 16.8125C27.7983 16.4931 28.1941 16.3333 28.6663 16.3333H35.333C35.8052 16.3333 36.2011 16.4931 36.5205 16.8125C36.84 17.1319 36.9997 17.5278 36.9997 18V24.6667C36.9997 25.1389 36.84 25.5347 36.5205 25.8542C36.2011 26.1736 35.8052 26.3333 35.333 26.3333H28.6663ZM29.7776 23.5554H34.2218V19.1113H29.7776V23.5554Z"
                        />
                    </svg>

                    <h3 class="skill-name">{!! __('home.skill-8.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-8.text') }}</p>
                </div>

                <div id="w-node-_349d372f-2646-6fa0-1a5d-8ab53adb5c97-e664ed4f" class="skill-card">
                    <svg width="30" height="30" viewBox="0 0 30 30" class="svg-skill skill-picto"
                         xmlns="http://www.w3.org/2000/svg">
                        <g clip-path="url(#clip0_1132_7354)">
                            <path
                                d="M18.8062 -3.90624e-05C18.7725 -0.00128906 11.2275 -0.00128906 11.1937 -3.90624e-05C7.77375 0.0299609 5 2.82246 5 6.24871V23.7487C5 27.195 7.80375 29.9987 11.25 29.9987H18.75C22.1963 29.9987 25 27.195 25 23.7487V6.24996C25 2.82246 22.2262 0.0312109 18.8062 -3.90624e-05ZM22.5 23.7487C22.5 25.8162 20.8175 27.4987 18.75 27.4987H11.25C9.1825 27.4987 7.5 25.8162 7.5 23.7487V6.24996C7.5 4.43371 8.7975 2.91621 10.5138 2.57246L11.3812 4.30871C11.5925 4.73246 12.0262 4.99996 12.5 4.99996H17.5C17.9738 4.99996 18.4063 4.73246 18.6188 4.30871L19.4862 2.57246C21.2025 2.91496 22.5 4.43371 22.5 6.24996V23.7487ZM16.25 24.9987H13.75C13.06 24.9987 12.5 24.4387 12.5 23.7487C12.5 23.0587 13.06 22.4987 13.75 22.4987H16.25C16.94 22.4987 17.5 23.0587 17.5 23.7487C17.5 24.4387 16.94 24.9987 16.25 24.9987Z"/>
                        </g>
                    </svg>

                    <h3 class="skill-name">{!! __('home.skill-5.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-5.text') }}</p>
                </div>

                <div id="w-node-_349d372f-2646-6fa0-1a5d-8ab53adb5c97-e664ed4f" class="skill-card">
                    <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"
                         class="svg-skill skill-picto">
                        <path
                            d="M8.75 0H5C2.2425 0 0 2.2425 0 5V8.75C0 11.5075 2.2425 13.75 5 13.75H8.75C11.5075 13.75 13.75 11.5075 13.75 8.75V5C13.75 2.2425 11.5075 0 8.75 0ZM11.25 8.75C11.25 10.1287 10.1287 11.25 8.75 11.25H5C3.62125 11.25 2.5 10.1287 2.5 8.75V5C2.5 3.62125 3.62125 2.5 5 2.5H8.75C10.1287 2.5 11.25 3.62125 11.25 5V8.75ZM8.75 6.25V7.5C8.75 8.19 8.19 8.75 7.5 8.75H6.25C5.56 8.75 5 8.19 5 7.5V6.25C5 5.56 5.56 5 6.25 5H7.5C8.19 5 8.75 5.56 8.75 6.25ZM21.25 13.75H25C27.7575 13.75 30 11.5075 30 8.75V5C30 2.2425 27.7575 0 25 0H21.25C18.4925 0 16.25 2.2425 16.25 5V8.75C16.25 11.5075 18.4925 13.75 21.25 13.75ZM18.75 5C18.75 3.62125 19.8713 2.5 21.25 2.5H25C26.3787 2.5 27.5 3.62125 27.5 5V8.75C27.5 10.1287 26.3787 11.25 25 11.25H21.25C19.8713 11.25 18.75 10.1287 18.75 8.75V5ZM21.25 7.5V6.25C21.25 5.56 21.81 5 22.5 5H23.75C24.44 5 25 5.56 25 6.25V7.5C25 8.19 24.44 8.75 23.75 8.75H22.5C21.81 8.75 21.25 8.19 21.25 7.5ZM8.75 16.25H5C2.2425 16.25 0 18.4925 0 21.25V25C0 27.7575 2.2425 30 5 30H8.75C11.5075 30 13.75 27.7575 13.75 25V21.25C13.75 18.4925 11.5075 16.25 8.75 16.25ZM11.25 25C11.25 26.3787 10.1287 27.5 8.75 27.5H5C3.62125 27.5 2.5 26.3787 2.5 25V21.25C2.5 19.8713 3.62125 18.75 5 18.75H8.75C10.1287 18.75 11.25 19.8713 11.25 21.25V25ZM8.75 22.5V23.75C8.75 24.44 8.19 25 7.5 25H6.25C5.56 25 5 24.44 5 23.75V22.5C5 21.81 5.56 21.25 6.25 21.25H7.5C8.19 21.25 8.75 21.81 8.75 22.5ZM21.25 18.125V19.375C21.25 20.41 20.41 21.25 19.375 21.25H18.125C17.09 21.25 16.25 20.41 16.25 19.375V18.125C16.25 17.09 17.09 16.25 18.125 16.25H19.375C20.41 16.25 21.25 17.09 21.25 18.125ZM25 23.125C25 24.16 24.16 25 23.125 25C22.09 25 21.25 24.16 21.25 23.125C21.25 22.09 22.09 21.25 23.125 21.25C24.16 21.25 25 22.09 25 23.125ZM21.25 26.875V28.125C21.25 29.16 20.41 30 19.375 30H18.125C17.09 30 16.25 29.16 16.25 28.125V26.875C16.25 25.84 17.09 25 18.125 25H19.375C20.41 25 21.25 25.84 21.25 26.875ZM30 18.125V19.375C30 20.41 29.16 21.25 28.125 21.25H26.875C25.84 21.25 25 20.41 25 19.375V18.125C25 17.09 25.84 16.25 26.875 16.25H28.125C29.16 16.25 30 17.09 30 18.125Z"/>
                    </svg>

                    <h3 class="skill-name">{!! __('home.skill-6.name') !!}</h3>
                    <p class="skill-text">{{ __('home.skill-6.text') }}</p>
                </div>

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

@endsection