273 lines
14 KiB
Plaintext
273 lines
14 KiB
Plaintext
@using System.Text.Json
|
|
@model List<CarneiroTech.Models.CaseModel>
|
|
@{
|
|
ViewData["Title"] = "CarneiroTech SBC - Assistência Técnica Premium e Upgrades";
|
|
ViewData["Description"] = "Não descarte seu notebook. Upgrades de performance e resgate de carcaça em São Bernardo do Campo. Atendimento exclusivo no Golden Square Shopping.";
|
|
}
|
|
|
|
<!-- Masthead-->
|
|
<header class="masthead">
|
|
<div class="container">
|
|
<div class="masthead-subheading">Assistência Técnica Premium em SBC</div>
|
|
<br/>
|
|
<div class="masthead-heading text-uppercase">Não descarte seu notebook.</div>
|
|
<div class="masthead-heading text-uppercase">Faça um Upgrade de Elite!</div>
|
|
<a class="btn btn-primary btn-xl text-uppercase shadow" href="#contact">Agendar no Golden Square</a>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Services-->
|
|
<section class="page-section" id="services">
|
|
<div class="container">
|
|
<div class="text-center">
|
|
<h2 class="section-heading text-uppercase">Nossas Especialidades</h2>
|
|
<h3 class="section-subheading text-muted">Tratamos seu equipamento como uma peça de engenharia, não apenas um eletrodoméstico.</h3>
|
|
</div>
|
|
<div class="row text-center">
|
|
<div class="col-md-4">
|
|
<span class="fa-stack fa-4x">
|
|
<i class="fas fa-circle fa-stack-2x text-primary"></i>
|
|
<i class="fas fa-bolt fa-stack-1x fa-inverse"></i>
|
|
</span>
|
|
<h4 class="my-3">Upgrade de Performance</h4>
|
|
<p class="text-muted">Transformamos máquinas lentas em foguetes com SSDs NVMe e memórias de alta velocidade. Performance superior a um PC novo por uma fração do preço.</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<span class="fa-stack fa-4x">
|
|
<i class="fas fa-circle fa-stack-2x text-primary"></i>
|
|
<i class="fas fa-shield-alt fa-stack-1x fa-inverse"></i>
|
|
</span>
|
|
<h4 class="my-3">Limpeza Técnica & Térmica</h4>
|
|
<p class="text-muted">Troca de pasta térmica industrial e remoção de poeira. Evitamos que seu processador queime por superaquecimento e garantimos silêncio total.</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<span class="fa-stack fa-4x">
|
|
<i class="fas fa-circle fa-stack-2x text-primary"></i>
|
|
<i class="fas fa-tools fa-stack-1x fa-inverse"></i>
|
|
</span>
|
|
<h4 class="my-3">Resgate de Carcaça</h4>
|
|
<p class="text-muted">Reparo profissional de dobradiças e plásticos quebrados com resina industrial. Recuperamos o que outras assistências mandam para o lixo.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Portfolio Grid (Cases)-->
|
|
<section class="page-section bg-light" id="portfolio">
|
|
<div class="container">
|
|
<div class="text-center">
|
|
<h2 class="section-heading text-uppercase">Provas de Ressurreição</h2>
|
|
<h3 class="section-subheading text-muted">Veja como economizamos milhares de reais para nossos clientes de São Bernardo do Campo.</h3>
|
|
</div>
|
|
|
|
@if (Model != null && Model.Any(m => m.Metadata.Slug.Contains("vostro")))
|
|
{
|
|
var featuredCase = Model.First(m => m.Metadata.Slug.Contains("vostro"));
|
|
<div class="row mb-5">
|
|
<div class="col-12">
|
|
<div class="card border-0 shadow-lg overflow-hidden" style="border-radius: 15px;">
|
|
<div class="row g-0">
|
|
<div class="col-md-6">
|
|
<img src="/img/Depois.png"
|
|
class="img-fluid h-100" alt="Resultado do Resgate" style="object-fit: cover; min-height: 350px;">
|
|
</div>
|
|
<div class="col-md-6 d-flex align-items-center">
|
|
<div class="card-body p-4 p-lg-5">
|
|
<div class="badge bg-danger mb-2">DESTAQUE: RESGATE EM SBC</div>
|
|
<h2 class="card-title fw-bold">@featuredCase.Metadata.Title</h2>
|
|
<p class="card-text lead text-muted">@featuredCase.Metadata.Summary</p>
|
|
<div class="bg-success bg-opacity-10 p-3 rounded border-start border-4 border-success mb-4">
|
|
<span class="text-success fw-bold h4 mb-0">Economia Real: R$ @featuredCase.Metadata.EstimatedSavings.ToString("N2")</span>
|
|
</div>
|
|
<a href="/cases/@featuredCase.Metadata.Slug" class="btn btn-primary btn-xl text-uppercase">Ver como foi feito</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<div class="row">
|
|
@if (Model != null && Model.Any())
|
|
{
|
|
foreach (var caseItem in Model.Where(m => !m.Metadata.Slug.Contains("vostro")).Take(3))
|
|
{
|
|
<div class="col-lg-4 col-sm-6 mb-4">
|
|
<div class="portfolio-item h-100 shadow-sm">
|
|
<a class="portfolio-link" href="/cases/@caseItem.Metadata.Slug">
|
|
<div class="portfolio-hover">
|
|
<div class="portfolio-hover-content"><i class="fas fa-plus fa-3x"></i></div>
|
|
</div>
|
|
@{
|
|
var imgPath = !string.IsNullOrEmpty(caseItem.Metadata.Thumbnail) ? caseItem.Metadata.Thumbnail : caseItem.Metadata.Image;
|
|
}
|
|
<img class="img-fluid w-100" src="@imgPath" alt="..." style="height: 200px; object-fit: cover;" />
|
|
</a>
|
|
<div class="portfolio-caption text-start p-3">
|
|
<div class="portfolio-caption-heading h6 fw-bold">@caseItem.Metadata.Title</div>
|
|
<div class="portfolio-caption-subheading text-muted small">@caseItem.Metadata.Category</div>
|
|
<div class="mt-2 text-success fw-bold small">Economia: R$ @caseItem.Metadata.EstimatedSavings.ToString("N2")</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Como Funciona -->
|
|
<section class="page-section" id="about">
|
|
<div class="container">
|
|
<div class="text-center">
|
|
<h2 class="section-heading text-uppercase">Como Funciona nosso Atendimento</h2>
|
|
<h3 class="section-subheading text-muted">Transparência total e engenharia de precisão para seu equipamento.</h3>
|
|
|
|
<div class="alert alert-primary d-inline-block mb-5 shadow-sm" style="border-radius: 50px; padding: 10px 30px;">
|
|
<i class="fas fa-bolt me-2 text-warning"></i> <strong>Agilidade:</strong> Diagnóstico e orçamento possíveis em até <strong>24 horas</strong> (dependendo da complexidade do caso).
|
|
</div>
|
|
</div>
|
|
<ul class="timeline">
|
|
<li>
|
|
<div class="timeline-image"><i class="fas fa-calendar-check fa-3x text-white"></i></div>
|
|
<div class="timeline-panel">
|
|
<div class="timeline-heading">
|
|
<h4>Passo 1</h4>
|
|
<h4 class="subheading">Agendamento no Golden Square</h4>
|
|
</div>
|
|
<div class="timeline-body"><p class="text-muted">Você escolhe o melhor horário para deixar seu equipamento em nosso ponto de atendimento exclusivo no Golden Square Shopping, São Bernardo do Campo.</p></div>
|
|
</div>
|
|
</li>
|
|
<li class="timeline-inverted">
|
|
<div class="timeline-image"><i class="fas fa-camera fa-3x text-white"></i></div>
|
|
<div class="timeline-panel">
|
|
<div class="timeline-heading">
|
|
<h4>Passo 2</h4>
|
|
<h4 class="subheading">Checklist e Laudo Digital</h4>
|
|
</div>
|
|
<div class="timeline-body"><p class="text-muted">Sua segurança em primeiro lugar. Tiramos fotos e emitimos um laudo de recebimento detalhando o estado atual do seu equipamento na hora, enviado direto pro seu WhatsApp.</p></div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="timeline-image"><i class="fas fa-microchip fa-3x text-white"></i></div>
|
|
<div class="timeline-panel">
|
|
<div class="timeline-heading">
|
|
<h4>Passo 3</h4>
|
|
<h4 class="subheading">Diagnóstico de Engenharia</h4>
|
|
</div>
|
|
<div class="timeline-body"><p class="text-muted">Nada de "tentativa e erro". Analisamos a eletrônica e o software do seu PC com ferramentas avançadas para identificar o problema real e a melhor solução com a maior agilidade possível.</p></div>
|
|
</div>
|
|
</li>
|
|
<li class="timeline-inverted">
|
|
<div class="timeline-image"><i class="fas fa-file-invoice-dollar fa-3x text-white"></i></div>
|
|
<div class="timeline-panel">
|
|
<div class="timeline-heading">
|
|
<h4>Passo 4</h4>
|
|
<h4 class="subheading">Orçamento Transparente</h4>
|
|
</div>
|
|
<div class="timeline-body"><p class="text-muted">Enviamos o diagnóstico e o orçamento detalhado via WhatsApp. Você só aprova se o valor fizer sentido para a vida útil do seu computador.</p></div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="timeline-image"><i class="fas fa-shipping-fast fa-3x text-white"></i></div>
|
|
<div class="timeline-panel">
|
|
<div class="timeline-heading">
|
|
<h4>Passo 5</h4>
|
|
<h4 class="subheading">Entrega e Performance</h4>
|
|
</div>
|
|
<div class="timeline-body"><p class="text-muted">Você retira sua máquina ressurgida, limpa e com orientações técnicas de uso para garantir que ela dure por mais muitos anos com performance máxima.</p></div>
|
|
</div>
|
|
</li>
|
|
<li class="timeline-inverted">
|
|
<div class="timeline-image">
|
|
<h4>
|
|
PC Novo
|
|
<br />
|
|
De
|
|
<br />
|
|
Novo!
|
|
</h4>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Contact-->
|
|
<section class="page-section" id="contact">
|
|
<div class="container">
|
|
<div class="text-center">
|
|
<h2 class="section-heading text-uppercase">Agendar Avaliação</h2>
|
|
<h3 class="section-subheading text-white">Atendimento exclusivo com hora marcada no Golden Square Shopping.</h3>
|
|
</div>
|
|
|
|
<form id="contactForm">
|
|
<div class="row align-items-stretch mb-5">
|
|
<div class="col-md-6">
|
|
<div class="form-group mb-3">
|
|
<input class="form-control" id="contactName" name="name" type="text" placeholder="Seu Nome *" required />
|
|
</div>
|
|
<div class="form-group mb-3">
|
|
<input class="form-control" id="contactEmail" name="email" type="email" placeholder="Seu Email *" required />
|
|
</div>
|
|
<div class="form-group mb-md-0">
|
|
<input class="form-control" id="contactPhone" name="phone" type="tel" placeholder="Seu WhatsApp (com DDD) *" required />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-group form-group-textarea mb-md-0">
|
|
<textarea class="form-control" id="contactMessage" name="message" placeholder="Qual o modelo do seu equipamento e qual o problema principal? *" style="height: 100%;" required></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="text-center">
|
|
<button class="btn btn-primary btn-xl text-uppercase" id="submitButton" type="submit">
|
|
<span id="buttonText">Solicitar Horário</span>
|
|
<span id="buttonSpinner" class="spinner-border spinner-border-sm ms-2" style="display: none;" role="status" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div class="text-center mt-5">
|
|
<div class="mb-3">
|
|
<span class="text-white-50" style="font-size: 1.1rem;">OU</span>
|
|
</div>
|
|
<a href="https://wa.me/5511976822169?text=Olá! Gostaria de um orçamento para o meu aparelho."
|
|
class="btn btn-success btn-xl text-uppercase shadow-lg"
|
|
target="_blank"
|
|
style="background-color: #25D366; border-color: #25D366;">
|
|
<i class="fab fa-whatsapp me-2"></i> (11) 97682-2169
|
|
</a>
|
|
<div class="mt-2">
|
|
<small class="text-white-50">Atendimento imediato via WhatsApp</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
@section Scripts {
|
|
<script>
|
|
document.getElementById('contactForm').addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
const form = this;
|
|
const submitButton = document.getElementById('submitButton');
|
|
const buttonText = document.getElementById('buttonText');
|
|
const buttonSpinner = document.getElementById('buttonSpinner');
|
|
|
|
submitButton.disabled = true;
|
|
buttonText.textContent = 'Enviando...';
|
|
buttonSpinner.style.display = 'inline-block';
|
|
|
|
// Simulação de envio (Google Script seria aqui)
|
|
setTimeout(() => {
|
|
alert('Solicitação enviada! Entraremos em contato via WhatsApp em instantes.');
|
|
form.reset();
|
|
submitButton.disabled = false;
|
|
buttonText.textContent = 'Solicitar Horário';
|
|
buttonSpinner.style.display = 'none';
|
|
}, 2000);
|
|
});
|
|
</script>
|
|
}
|