@extends('theme')
@section("title", "PPP - Marina São Bento")
@section('content')

    @include('elements/nav')

    <main class="main top90">

        <div class="page-title dark-background" data-aos="fade"
            style="background-image: url({{ asset('assets/img/page-title-bg.webp') }});">
            <div class="container position-relative">
                <h1>Marina São Bento</h1>
                <nav class="breadcrumbs">
                    <ol>
                        <li><a href="{{ route("index") }}">Início</a></li>
                        <li class="current">Marina São Bento</li>
                    </ol>
                </nav>
            </div>
        </div>

        <section id="features" class="features section">

            <div class="container">
                <ul class="nav nav-tabs row d-flex justify-content-center" data-aos="fade-up" data-aos-delay="100"
                    style="margin-top: -70px;">
                    <li class="nav-item col-xl-3 col-md-4 col-sm-3 col-xs-3 col-3">
                        <a class="nav-link active show" data-bs-toggle="tab" data-bs-target="#features-tab-1">
                            <i class="fa-regular fa-clipboard"></i>
                            <h4 class="d-none d-lg-block">Características Gerais</h4>
                        </a>
                    </li>
                </ul>

                <div class="tab-content" data-aos="fade-up" data-aos-delay="200" style="margin-top: 50px;">
                    <div class="tab-pane fade active show" id="features-tab-1">

                        <div class="row mt-3 mt-lg-0">

                            <div class="mb-5 col-lg-6 col-md-12 order-lg-2 order-sm-1">
                                <img src="images/portfolio/marina-sao-bento.jpg" alt="" class="img-fluid">
                            </div>

                            <div class="col-lg-6 col-md-12 order-lg-1 order-sm-2">

                                <div class="row card-tag-container gx-4 gy-4">
                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Modalidade De Projeto</span>
                                        <p>Concessão</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Setor</span>
                                        <p>Portuário e Turístico</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Órgão Responsável</span>
                                        <p>Secretaria Articulação Governamental e Secretaria de Planejamento e Gestão</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Vigência Estimada Do Contrato</span>
                                        <p>99 anos</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Investimentos Estimados</span>
                                        <p>R$ 76.488.880,00</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Outorga Fixa</span>
                                        <p>R$ 2.200.000,00</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Prazo Estimado Para Conclusão Dos Estudos</span>
                                        <p>Concluídos</p>
                                    </div>

                                    <div class="col-xl-6 col-lg-12 col-md-6 col-sm-12 card-tag">
                                        <span class="tag">Outros Dados</span>
                                        <p>Contrato assinado em 07/01/1988</p>
                                    </div>

                                </div>

                            </div>

                        </div>

                        <div class="row mt-4">
                            <div class="card-tag">
                                <span class="tag">Resumo do projeto</span>
                            </div>
                            <p>Com infraestrutura moderna e sustentável, a Marina oferecerá serviços de alta qualidade,
                                desde vagas para barcos até áreas de lazer e entretenimento para moradores e visitantes.
                                Sendo um grande complexo turístico, envolvendo atividades de lazer, comerciais, de serviços,
                                de hotelaria e residenciais.</p>
                        </div>

                        <div class="row d-flex justify-content-center">

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-autorizacao.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Autorização do CGP</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-estudo.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Estudo</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-consulta.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Consulta Pública</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-edital.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Edital</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-tce.svg') }}"
                                        alt="Envio ao TCE">
                                    <p>Envio ao TCE</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-sessao.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Sessão Pública</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                            <div class="col-xl col-lg-3 col-md-3 col-sm-6 col-xs-6 col-6">
                                <div class="etapa-projeto">
                                    <img src="{{ asset('assets/img/ico-contrato.svg') }}" alt="Autorização do Conselho Gestor">
                                    <p>Contrato</p>
                                    <img src="{{ asset('assets/img/ico-etapa-check.svg') }}" class="etapa-check" alt="Concluído">
                                </div>
                            </div>

                        </div>

                    </div>

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

    </main>

    @include('footer')
@endsection
