Новые страницы и компоенты сайта
This commit is contained in:
Web-serfer
parent
e695b9bc01
commit
7fd0e77620
10 changed files with 2825 additions and 1544 deletions
97
frontend/src/components/base/AdBanner.astro
Normal file
97
frontend/src/components/base/AdBanner.astro
Normal file
|
|
@ -0,0 +1,97 @@
|
|||
---
|
||||
interface AdBannerProps {
|
||||
width?: string;
|
||||
height?: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
const {
|
||||
width = "300",
|
||||
height = "250",
|
||||
className = ""
|
||||
} = Astro.props as AdBannerProps;
|
||||
|
||||
const displayWidth = `${width}px`;
|
||||
const displayHeight = `${height}px`;
|
||||
const sizeLabel = `${width}×${height}`;
|
||||
---
|
||||
|
||||
<div class={`ad-banner ${className}`} style={`--ad-width: ${displayWidth}; --ad-height: ${displayHeight};`}>
|
||||
<div class="ad-banner__placeholder">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
|
||||
<circle cx="8.5" cy="8.5" r="1.5"/>
|
||||
<polyline points="21 15 16 10 5 21"/>
|
||||
</svg>
|
||||
<span>Рекламный блок</span>
|
||||
<span class="ad-banner__size">{sizeLabel}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.ad-banner {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
border: 1px solid #e2e8f0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ad-banner__placeholder {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 2rem 1rem;
|
||||
text-align: center;
|
||||
min-height: calc(var(--ad-height, 250px) - 4px);
|
||||
min-width: calc(var(--ad-width, 300px) - 2px);
|
||||
width: 100%;
|
||||
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
||||
}
|
||||
|
||||
.ad-banner__placeholder svg {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
color: #94a3b8;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.ad-banner__placeholder span {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.ad-banner__size {
|
||||
font-size: 0.75rem !important;
|
||||
color: #94a3b8 !important;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.ad-banner--dashed {
|
||||
border: 2px dashed #cbd5e1;
|
||||
background: #f1f5f9;
|
||||
}
|
||||
|
||||
.ad-banner--dashed .ad-banner__placeholder {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.ad-banner--horizontal {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.ad-banner--horizontal .ad-banner__placeholder {
|
||||
min-height: 90px;
|
||||
padding: 1.5rem 2rem;
|
||||
}
|
||||
|
||||
.ad-banner--vertical {
|
||||
min-height: var(--ad-height, 250px);
|
||||
}
|
||||
|
||||
.ad-banner--vertical .ad-banner__placeholder {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -357,18 +357,29 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
|
||||
/* --- Список кейсов --- */
|
||||
.cases-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2.5rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 2rem;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
/* --- Карточка кейса --- */
|
||||
.case-card__inner {
|
||||
position: relative;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid var(--color-gray-light);
|
||||
box-shadow: var(--shadow-md);
|
||||
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.case-card {
|
||||
opacity: 0;
|
||||
transform: translateY(40px);
|
||||
transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),
|
||||
transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.case-card.is-visible {
|
||||
|
|
@ -376,15 +387,11 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.case-card__inner {
|
||||
position: relative;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2.5rem;
|
||||
border: 1px solid var(--color-gray-light);
|
||||
box-shadow: var(--shadow-md);
|
||||
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
overflow: hidden;
|
||||
.case-card {
|
||||
opacity: 0;
|
||||
transform: translateY(40px);
|
||||
transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),
|
||||
transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
.case-card__inner::before {
|
||||
|
|
@ -578,8 +585,9 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
|
||||
/* Ссылка */
|
||||
.case-card__link {
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 0.75rem;
|
||||
padding-top: 1.25rem;
|
||||
border-top: 1px solid var(--color-gray-light);
|
||||
|
|
@ -588,6 +596,9 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
font-weight: 600;
|
||||
color: var(--color-primary);
|
||||
transition: color 0.3s ease;
|
||||
margin-left: auto;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.case-card__link svg {
|
||||
|
|
@ -646,6 +657,11 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cases-list {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.cases-header {
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
|
|
@ -672,17 +688,17 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
}
|
||||
|
||||
.case-card__inner {
|
||||
padding: 2rem 1.5rem;
|
||||
padding: 1.75rem;
|
||||
}
|
||||
|
||||
.case-card__title {
|
||||
font-size: 1.3rem;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.case-card__result-header {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -710,7 +726,7 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
}
|
||||
|
||||
.case-card__inner {
|
||||
padding: 1.5rem 1.25rem;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.case-card__meta {
|
||||
|
|
@ -777,7 +793,7 @@ const categories = ["Все", ...Array.from(new Set(cases.map((c: Case) => c.cat
|
|||
const category = card.dataset.category;
|
||||
|
||||
if (filter === 'all' || category === filter) {
|
||||
card.style.display = 'block';
|
||||
card.style.display = 'flex';
|
||||
setTimeout(() => {
|
||||
card.classList.add('is-visible');
|
||||
}, 50);
|
||||
|
|
|
|||
242
frontend/src/components/cases/RelatedCases.astro
Normal file
242
frontend/src/components/cases/RelatedCases.astro
Normal file
|
|
@ -0,0 +1,242 @@
|
|||
---
|
||||
interface Case {
|
||||
id: number;
|
||||
title: string;
|
||||
category: string;
|
||||
categoryIcon: string;
|
||||
description: string;
|
||||
resultLabel: string;
|
||||
duration: string;
|
||||
sum?: string;
|
||||
href: string;
|
||||
}
|
||||
|
||||
interface RelatedCasesProps {
|
||||
title: string;
|
||||
subtitle: string;
|
||||
cases: Case[];
|
||||
currentCaseId: number;
|
||||
limit?: number;
|
||||
}
|
||||
|
||||
const {
|
||||
title = "Другие кейсы",
|
||||
subtitle = "Похожие дела",
|
||||
cases = [],
|
||||
currentCaseId = 0,
|
||||
limit = 3
|
||||
} = Astro.props as RelatedCasesProps;
|
||||
|
||||
function shuffleArray<T>(array: T[]): T[] {
|
||||
const shuffled = [...array];
|
||||
for (let i = shuffled.length - 1; i > 0; i--) {
|
||||
const j = Math.floor(Math.random() * (i + 1));
|
||||
[shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
|
||||
}
|
||||
return shuffled;
|
||||
}
|
||||
|
||||
const otherCases = cases.filter(c => c.id !== currentCaseId);
|
||||
const shuffledCases = shuffleArray(otherCases);
|
||||
const relatedCases = shuffledCases.slice(0, limit);
|
||||
---
|
||||
|
||||
<section class="related-cases">
|
||||
<div class="site-container">
|
||||
<div class="related-cases__header">
|
||||
<span class="related-cases__subtitle">{subtitle}</span>
|
||||
<h3 class="related-cases__title">{title}</h3>
|
||||
</div>
|
||||
<div class="related-cases__grid">
|
||||
{relatedCases.map((caseItem) => (
|
||||
<a href={caseItem.href} class="related-case-card">
|
||||
<div class="related-case-card__header">
|
||||
<span class="related-case-card__category-icon">{caseItem.categoryIcon}</span>
|
||||
<span class="related-case-card__category">{caseItem.category}</span>
|
||||
</div>
|
||||
<h4 class="related-case-card__title">{caseItem.title}</h4>
|
||||
<p class="related-case-card__desc">{caseItem.description}</p>
|
||||
<div class="related-case-card__footer">
|
||||
<div class="related-case-card__meta">
|
||||
<span class="related-case-card__result">{caseItem.resultLabel}</span>
|
||||
<span class="related-case-card__duration">{caseItem.duration}</span>
|
||||
</div>
|
||||
<span class="related-case-card__link">
|
||||
Подробнее
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
.related-cases {
|
||||
padding: 5rem 0;
|
||||
background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
|
||||
}
|
||||
|
||||
.site-container {
|
||||
max-width: var(--site-max-width, 1400px);
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.related-cases__header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.related-cases__subtitle {
|
||||
display: inline-block;
|
||||
color: #eac26e;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 3px;
|
||||
margin-bottom: 0.75rem;
|
||||
padding: 0.5rem 1rem;
|
||||
background: rgba(234, 194, 110, 0.1);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.related-cases__title {
|
||||
color: #0a2540;
|
||||
font-size: clamp(1.5rem, 3vw, 2rem);
|
||||
font-weight: 800;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.related-cases__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.related-case-card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.related-case-card:hover {
|
||||
border-color: rgba(234, 194, 110, 0.3);
|
||||
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
.related-case-card__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.related-case-card__category-icon {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.related-case-card__category {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: #ce9f40;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.related-case-card__title {
|
||||
color: #0a2540;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.75rem 0;
|
||||
line-height: 1.4;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.related-case-card:hover .related-case-card__title {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.related-case-card__desc {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
margin: 0 0 1.5rem 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.related-case-card__footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-top: 1rem;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
}
|
||||
|
||||
.related-case-card__meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.related-case-card__result {
|
||||
font-size: 0.85rem;
|
||||
font-weight: 700;
|
||||
color: #22c55e;
|
||||
}
|
||||
|
||||
.related-case-card__duration {
|
||||
font-size: 0.8rem;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.related-case-card__link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
color: #0a2540;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.related-case-card__link svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.related-case-card:hover .related-case-card__link {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.related-case-card:hover .related-case-card__link svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.related-cases__grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.related-cases {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.related-cases__grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
631
frontend/src/pages/cases/driving-license-return-12-8.astro
Normal file
631
frontend/src/pages/cases/driving-license-return-12-8.astro
Normal file
|
|
@ -0,0 +1,631 @@
|
|||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import { SITE_URL } from '@constants';
|
||||
import PageHero from "@components/base/PageHero.astro";
|
||||
import RelatedCases from "@components/cases/RelatedCases.astro";
|
||||
import AdBanner from "@components/base/AdBanner.astro";
|
||||
|
||||
const allCases = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Возврат прав после лишения по ст. 12.8 КоАП",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Мы нашли процессуальные нарушения при составлении протокола.",
|
||||
resultLabel: "Лишение отменено",
|
||||
duration: "3 месяца",
|
||||
href: "/cases/driving-license-return-12-8"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Взыскание 450 000 ₽ со страховой по ОСАГО",
|
||||
category: "Страховые споры",
|
||||
categoryIcon: "📋",
|
||||
description: "Страховая компания выплатила лишь 120 000 ₽ при реальном ущербе в 570 000 ₽ после серьёзного ДТП.",
|
||||
resultLabel: "Взыскано 450 000 ₽",
|
||||
duration: "5 месяцев",
|
||||
href: "/cases/osago-claim-450k"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Оспаривание вины в ДТП с пострадавшим",
|
||||
category: "ДТП и разбор",
|
||||
categoryIcon: "🚨",
|
||||
description: "Клиента обвиняли в нарушении ПДД, повлёкшем ДТП с пострадавшим. Грозил штраф и лишение прав.",
|
||||
resultLabel: "Виновность не доказана",
|
||||
duration: "4 месяца",
|
||||
href: "/cases/dti-innocence-proof"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "Возврат прав после лишения за выезд на встречку",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент лишён прав на 6 месяцев за выезд на полосу встречного движения. Камера зафиксировала нарушение.",
|
||||
resultLabel: "Дело прекращено",
|
||||
duration: "2 месяца",
|
||||
href: "/cases/license-return-camera"
|
||||
}
|
||||
];
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Возврат прав после лишения по ст. 12.8 КоАП — автоюрист Сургут"
|
||||
description="Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Юрист нашел процессуальные нарушения при составлении протокола."
|
||||
canonicalLink={`${SITE_URL}/cases/driving-license-return-12-8`}
|
||||
breadcrumbs={[
|
||||
{ label: 'Главная', href: '/' },
|
||||
{ label: 'Кейсы', href: '/cases' },
|
||||
{ label: 'Возврат прав по ст. 12.8' }
|
||||
]}
|
||||
>
|
||||
<PageHero
|
||||
badgeText="КЕЙС #1"
|
||||
titleWhite="Возврат прав после лишения"
|
||||
titleGold="по ст. 12.8 КоАП"
|
||||
description="Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Благодаря грамотной правовой позиции удалось добиться отмены постановления."
|
||||
btnText="Получить консультацию"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/cases/casesImg.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
experienceBadge={{
|
||||
number: "95%",
|
||||
text: "УСПЕШНЫХ ДЕЛ"
|
||||
}}
|
||||
bgImage="/images/cases/casesBg.avif"
|
||||
icon="briefcase"
|
||||
/>
|
||||
|
||||
<div class="case-detail-page">
|
||||
<section class="case-content">
|
||||
<div class="site-container">
|
||||
<div class="case-grid">
|
||||
<article class="case-article">
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">📋</span>
|
||||
Исходная ситуация
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<p>
|
||||
Наш клиент, добропорядочный водитель с 15-летним стажем, был остановлен
|
||||
сотрудниками ДПС в вечернее время. Инспекторы заподозрили наличие
|
||||
алкоголя в крови и предложили пройти освидетельствование.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Протокол был составлен с многочисленными процессуальными нарушениями:</strong>
|
||||
</p>
|
||||
<ul class="case-list">
|
||||
<li>Отсутствие двух понятых при составлении протокола</li>
|
||||
<li>Освидетельствование проводилось неуполномоченным лицом</li>
|
||||
<li>Не были разъяснены права и обязанности водителя</li>
|
||||
<li>Протокол составлен с ошибками в данных</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block case-block--accent">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">🔍</span>
|
||||
Что было сделано
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-steps">
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">01</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Анализ документов</h3>
|
||||
<p>
|
||||
Изучили все материалы дела, выявили 7 критических нарушений
|
||||
при составлении протокола и проведении освидетельствования.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">02</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Сбор доказательств</h3>
|
||||
<p>
|
||||
Получили записи с видеорегистратора, подтверждающие
|
||||
нарушение процедуры остановки и проверки.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">03</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Подготовка позиции</h3>
|
||||
<p>
|
||||
Составили подробную правовую позицию со ссылками на
|
||||
Конституцию РФ, КоАП РФ и Постановления Пленума ВС РФ.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">04</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Представительство в суде</h3>
|
||||
<p>
|
||||
Представили интересы клиента в двух судебных заседаниях,
|
||||
добились признания нарушений неустранимыми.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">⚖️</span>
|
||||
Судебное решение
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-verdict">
|
||||
<div class="case-verdict__badge">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<path d="M20 6L9 17l-5-5"/>
|
||||
</svg>
|
||||
Постановление отменено
|
||||
</div>
|
||||
<p>
|
||||
Суд первой инстанции, рассмотрев материалы дела и заслушав
|
||||
аргументы защиты, <strong>принял решение об отмене постановления</strong>
|
||||
о лишении права управления транспортным средством.
|
||||
</p>
|
||||
<p>
|
||||
Водительское удостоверение было возвращено клиенту в полном объёме
|
||||
без каких-либо ограничений и дополнительных санкций.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<aside class="case-sidebar">
|
||||
<div class="case-sidebar__card">
|
||||
<h3 class="case-sidebar__title">Детали кейса</h3>
|
||||
<div class="case-sidebar__info">
|
||||
<div class="case-sidebar__row">
|
||||
<span>Категория</span>
|
||||
<strong>Водительские права</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Срок ведения</span>
|
||||
<strong>3 месяца</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Результат</span>
|
||||
<strong class="success">Лишение отменено</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--lawyer">
|
||||
<div class="case-sidebar__lawyer-avatar">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Автоюрист Сургут</h3>
|
||||
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
|
||||
<div class="case-sidebar__lawyer-stats">
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>12+</strong>
|
||||
<span>лет опыта</span>
|
||||
</div>
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>500+</strong>
|
||||
<span>выигранных дел</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/services" class="case-sidebar__lawyer-link">
|
||||
Все услуги
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--ad">
|
||||
<AdBanner
|
||||
width="300"
|
||||
height="640"
|
||||
className="ad-banner--vertical"
|
||||
/>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- /.case-detail-page -->
|
||||
|
||||
<RelatedCases
|
||||
title="Другие кейсы"
|
||||
subtitle="ПОХОЖИЕ ДЕЛА"
|
||||
cases={allCases}
|
||||
currentCaseId={1}
|
||||
/>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.case-detail-page {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
.case-content {
|
||||
padding: 5rem 0;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.case-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 380px;
|
||||
gap: 3rem;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2.5rem;
|
||||
margin-bottom: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.case-block:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-block--accent {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__title {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__content {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block--accent p {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
||||
.case-block__icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.case-block__content p {
|
||||
color: #475569;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-block__content p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 1.5rem 0 0 0;
|
||||
}
|
||||
|
||||
.case-list li {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem 0;
|
||||
color: #0a2540;
|
||||
font-size: 0.95rem;
|
||||
border-bottom: 1px solid rgba(234, 194, 110, 0.2);
|
||||
}
|
||||
|
||||
.case-list li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.case-list li::before {
|
||||
content: '✗';
|
||||
color: #ef4444;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-steps {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.case-step__number {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 900;
|
||||
color: #eac26e;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-step__content h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
|
||||
.case-step__content p {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.case-verdict {
|
||||
background: rgba(234, 194, 110, 0.08);
|
||||
border: 1px solid rgba(234, 194, 110, 0.2);
|
||||
border-radius: 12px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: #22c55e;
|
||||
color: #ffffff;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.case-verdict p {
|
||||
color: #0a2540;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: sticky;
|
||||
top: 100px;
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
margin-bottom: 1.5rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-sidebar__card:last-child {
|
||||
margin-bottom: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad :global(.ad-banner) {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.case-sidebar__title {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
}
|
||||
|
||||
.case-sidebar__row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.case-sidebar__row span {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong {
|
||||
color: #0a2540;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong.success {
|
||||
color: #22c55e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto 1rem;
|
||||
border: 3px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar svg {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-name {
|
||||
color: #eac26e;
|
||||
font-size: 0.95rem;
|
||||
margin: 0 0 1.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1rem 0;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat strong {
|
||||
color: #ffffff;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat span {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.75rem 1.5rem;
|
||||
background: transparent;
|
||||
border: 2px solid #eac26e;
|
||||
color: #eac26e;
|
||||
border-radius: 8px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover {
|
||||
background: #eac26e;
|
||||
color: #0a2540;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.case-sidebar {
|
||||
position: static;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.case-content {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.case-block {
|
||||
padding: 1.5rem 1rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
605
frontend/src/pages/cases/dti-innocence-proof.astro
Normal file
605
frontend/src/pages/cases/dti-innocence-proof.astro
Normal file
|
|
@ -0,0 +1,605 @@
|
|||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import { SITE_URL } from '@constants';
|
||||
import PageHero from "@components/base/PageHero.astro";
|
||||
import RelatedCases from "@components/cases/RelatedCases.astro";
|
||||
import AdBanner from "@components/base/AdBanner.astro";
|
||||
|
||||
const allCases = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Возврат прав после лишения по ст. 12.8 КоАП",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Мы нашли процессуальные нарушения при составлении протокола.",
|
||||
resultLabel: "Лишение отменено",
|
||||
duration: "3 месяца",
|
||||
href: "/cases/driving-license-return-12-8"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Взыскание 450 000 ₽ со страховой по ОСАГО",
|
||||
category: "Страховые споры",
|
||||
categoryIcon: "📋",
|
||||
description: "Страховая компания выплатила лишь 120 000 ₽ при реальном ущербе в 570 000 ₽ после серьёзного ДТП.",
|
||||
resultLabel: "Взыскано 450 000 ₽",
|
||||
duration: "5 месяцев",
|
||||
href: "/cases/osago-claim-450k"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Оспаривание вины в ДТП с пострадавшим",
|
||||
category: "ДТП и разбор",
|
||||
categoryIcon: "🚨",
|
||||
description: "Клиента обвиняли в нарушении ПДД, повлёкшем ДТП с пострадавшим. Грозил штраф и лишение прав.",
|
||||
resultLabel: "Виновность не доказана",
|
||||
duration: "4 месяца",
|
||||
href: "/cases/dti-innocence-proof"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "Возврат прав после лишения за выезд на встречку",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент лишён прав на 6 месяцев за выезд на полосу встречного движения. Камера зафиксировала нарушение.",
|
||||
resultLabel: "Дело прекращено",
|
||||
duration: "2 месяца",
|
||||
href: "/cases/license-return-camera"
|
||||
}
|
||||
];
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Оспаривание вины в ДТП с пострадавшим — автоюрист Сургут"
|
||||
description="Клиента обвиняли в нарушении ПДД, повлёкшем ДТП с пострадавшим. Удалось доказать невиновность благодаря видеозаписям."
|
||||
canonicalLink={`${SITE_URL}/cases/dti-innocence-proof`}
|
||||
breadcrumbs={[
|
||||
{ label: 'Главная', href: '/' },
|
||||
{ label: 'Кейсы', href: '/cases' },
|
||||
{ label: 'Оспаривание вины в ДТП' }
|
||||
]}
|
||||
>
|
||||
<PageHero
|
||||
badgeText="КЕЙС #3"
|
||||
titleWhite="Оспаривание вины"
|
||||
titleGold="в ДТП с пострадавшим"
|
||||
description="Клиенту грозило лишение прав и штраф. Благодаря видеозаписям и показаниям свидетелей удалось доказать невиновность."
|
||||
btnText="Получить консультацию"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/cases/casesImg.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
experienceBadge={{
|
||||
number: "95%",
|
||||
text: "УСПЕШНЫХ ДЕЛ"
|
||||
}}
|
||||
bgImage="/images/cases/casesBg.avif"
|
||||
icon="briefcase"
|
||||
/>
|
||||
|
||||
<div class="case-detail-page">
|
||||
<section class="case-content">
|
||||
<div class="site-container">
|
||||
<div class="case-grid">
|
||||
<article class="case-article">
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">📋</span>
|
||||
Исходная ситуация
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<p>
|
||||
На перекрёстке произошло столкновение двух автомобилей, в результате
|
||||
которого пострадал пассажир одного из них. Инспектор ГИБДД изначально
|
||||
признал виновным нашего клиента.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Клиенту грозило лишение прав и крупный штраф за нарушение ПДД,
|
||||
повлёкшее ДТП с пострадавшим.</strong>
|
||||
</p>
|
||||
<p>
|
||||
Однако клиент был уверен в своей невиновности и обратился за
|
||||
юридической помощью для защиты своих прав.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block case-block--accent">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">🔍</span>
|
||||
Что было сделано
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-steps">
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">01</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Анализ материалов дела</h3>
|
||||
<p>
|
||||
Изучили протокол ГИБДД, схему места ДТП и все
|
||||
сопутствующие документы.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">02</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Сбор доказательств</h3>
|
||||
<p>
|
||||
Получили записи с камер видеонаблюдения на перекрёстке,
|
||||
которые зафиксировали момент аварии.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">03</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Поиск свидетелей</h3>
|
||||
<p>
|
||||
Обнаружили и опросили свидетелей, которые подтвердили
|
||||
версию клиента о невиновности.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">04</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Экспертиза</h3>
|
||||
<p>
|
||||
Провели автотехническую экспертизу, которая подтвердила
|
||||
невозможность совершения манёвра водителем в указанное время.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">⚖️</span>
|
||||
Судебное решение
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-verdict">
|
||||
<div class="case-verdict__badge">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<path d="M20 6L9 17l-5-5"/>
|
||||
</svg>
|
||||
Виновность не доказана
|
||||
</div>
|
||||
<p>
|
||||
Суд, изучив представленные доказательства и видеозаписи,
|
||||
пришёл к выводу о <strong>недоказанности вины</strong> нашего клиента.
|
||||
</p>
|
||||
<p>
|
||||
Дело прекращено за отсутствием состава правонарушения.
|
||||
Клиент полностью оправдан и не понёс никаких санкций.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<aside class="case-sidebar">
|
||||
<div class="case-sidebar__card">
|
||||
<h3 class="case-sidebar__title">Детали кейса</h3>
|
||||
<div class="case-sidebar__info">
|
||||
<div class="case-sidebar__row">
|
||||
<span>Категория</span>
|
||||
<strong>ДТП и разбор</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Срок ведения</span>
|
||||
<strong>4 месяца</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Результат</span>
|
||||
<strong class="success">Виновность не доказана</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--lawyer">
|
||||
<div class="case-sidebar__lawyer-avatar">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Автоюрист Сургут</h3>
|
||||
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
|
||||
<div class="case-sidebar__lawyer-stats">
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>12+</strong>
|
||||
<span>лет опыта</span>
|
||||
</div>
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>500+</strong>
|
||||
<span>выигранных дел</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/services" class="case-sidebar__lawyer-link">
|
||||
Все услуги
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--ad">
|
||||
<AdBanner
|
||||
width="300"
|
||||
height="640"
|
||||
className="ad-banner--vertical"
|
||||
/>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<RelatedCases
|
||||
title="Другие кейсы"
|
||||
subtitle="ПОХОЖИЕ ДЕЛА"
|
||||
cases={allCases}
|
||||
currentCaseId={3}
|
||||
/>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.case-detail-page {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
.case-content {
|
||||
padding: 5rem 0;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.case-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 380px;
|
||||
gap: 3rem;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2.5rem;
|
||||
margin-bottom: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.case-block:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-block--accent {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__title {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__content {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block--accent p {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
||||
.case-block__icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.case-block__content p {
|
||||
color: #475569;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-block__content p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-steps {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.case-step__number {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 900;
|
||||
color: #eac26e;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-step__content h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
|
||||
.case-step__content p {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.case-verdict {
|
||||
background: rgba(234, 194, 110, 0.08);
|
||||
border: 1px solid rgba(234, 194, 110, 0.2);
|
||||
border-radius: 12px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: #22c55e;
|
||||
color: #ffffff;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.case-verdict p {
|
||||
color: #0a2540;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: sticky;
|
||||
top: 100px;
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
margin-bottom: 1.5rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-sidebar__card:last-child {
|
||||
margin-bottom: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad :global(.ad-banner) {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.case-sidebar__title {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
}
|
||||
|
||||
.case-sidebar__row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.case-sidebar__row span {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong {
|
||||
color: #0a2540;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong.success {
|
||||
color: #22c55e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto 1rem;
|
||||
border: 3px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar svg {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-name {
|
||||
color: #eac26e;
|
||||
font-size: 0.95rem;
|
||||
margin: 0 0 1.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1rem 0;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat strong {
|
||||
color: #ffffff;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat span {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.75rem 1.5rem;
|
||||
background: transparent;
|
||||
border: 2px solid #eac26e;
|
||||
color: #eac26e;
|
||||
border-radius: 8px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover {
|
||||
background: #eac26e;
|
||||
color: #0a2540;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.case-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: static;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.case-content {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.case-block {
|
||||
padding: 1.5rem 1rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -20,6 +20,7 @@ import CasesList from "@components/cases/CasesList.astro";
|
|||
titleGold="кейсы"
|
||||
description="Реальные примеры нашей работы по защите прав автовладельцев. Каждое дело — это история успеха, основанная на профессионализме и опыте."
|
||||
btnText="Получить консультацию"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/cases/casesImg.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
|
|
@ -31,4 +32,4 @@ import CasesList from "@components/cases/CasesList.astro";
|
|||
icon="briefcase"
|
||||
/>
|
||||
<CasesList />
|
||||
</Layout>
|
||||
</Layout>
|
||||
605
frontend/src/pages/cases/license-return-camera.astro
Normal file
605
frontend/src/pages/cases/license-return-camera.astro
Normal file
|
|
@ -0,0 +1,605 @@
|
|||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import { SITE_URL } from '@constants';
|
||||
import PageHero from "@components/base/PageHero.astro";
|
||||
import RelatedCases from "@components/cases/RelatedCases.astro";
|
||||
import AdBanner from "@components/base/AdBanner.astro";
|
||||
|
||||
const allCases = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Возврат прав после лишения по ст. 12.8 КоАП",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Мы нашли процессуальные нарушения при составлении протокола.",
|
||||
resultLabel: "Лишение отменено",
|
||||
duration: "3 месяца",
|
||||
href: "/cases/driving-license-return-12-8"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Взыскание 450 000 ₽ со страховой по ОСАГО",
|
||||
category: "Страховые споры",
|
||||
categoryIcon: "📋",
|
||||
description: "Страховая компания выплатила лишь 120 000 ₽ при реальном ущербе в 570 000 ₽ после серьёзного ДТП.",
|
||||
resultLabel: "Взыскано 450 000 ₽",
|
||||
duration: "5 месяцев",
|
||||
href: "/cases/osago-claim-450k"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Оспаривание вины в ДТП с пострадавшим",
|
||||
category: "ДТП и разбор",
|
||||
categoryIcon: "🚨",
|
||||
description: "Клиента обвиняли в нарушении ПДД, повлёкшем ДТП с пострадавшим. Грозил штраф и лишение прав.",
|
||||
resultLabel: "Виновность не доказана",
|
||||
duration: "4 месяца",
|
||||
href: "/cases/dti-innocence-proof"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "Возврат прав после лишения за выезд на встречку",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент лишён прав на 6 месяцев за выезд на полосу встречного движения. Камера зафиксировала нарушение.",
|
||||
resultLabel: "Дело прекращено",
|
||||
duration: "2 месяца",
|
||||
href: "/cases/license-return-camera"
|
||||
}
|
||||
];
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Возврат прав после лишения за выезд на встречку — автоюрист Сургут"
|
||||
description="Клиент лишён прав за выезд на встречку, зафиксированный камерой. Удалось доказать, что за рулём был другой человек."
|
||||
canonicalLink={`${SITE_URL}/cases/license-return-camera`}
|
||||
breadcrumbs={[
|
||||
{ label: 'Главная', href: '/' },
|
||||
{ label: 'Кейсы', href: '/cases' },
|
||||
{ label: 'Возврат прав после камеры' }
|
||||
]}
|
||||
>
|
||||
<PageHero
|
||||
badgeText="КЕЙС #5"
|
||||
titleWhite="Возврат прав"
|
||||
titleGold="за выезд на встречку"
|
||||
description="Камера зафиксировала нарушение, но за рулём был не владелец. Благодаря доказательствам удалось прекратить дело."
|
||||
btnText="Получить консультацию"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/cases/casesImg.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
experienceBadge={{
|
||||
number: "95%",
|
||||
text: "УСПЕШНЫХ ДЕЛ"
|
||||
}}
|
||||
bgImage="/images/cases/casesBg.avif"
|
||||
icon="briefcase"
|
||||
/>
|
||||
|
||||
<div class="case-detail-page">
|
||||
<section class="case-content">
|
||||
<div class="site-container">
|
||||
<div class="case-grid">
|
||||
<article class="case-article">
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">📋</span>
|
||||
Исходная ситуация
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<p>
|
||||
Автоматическая камера зафиксировала выезд на полосу встречного
|
||||
движения. Владельцу автомобиля пришло уведомление о штрафе
|
||||
и лишении прав на 6 месяцев.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Проблема заключалась в том, что в момент нарушения
|
||||
за рулём находился не владелец автомобиля, а его знакомый.</strong>
|
||||
</p>
|
||||
<p>
|
||||
Владелец обратился за помощью, чтобы доказать свою невиновность
|
||||
и избежать лишения прав.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block case-block--accent">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">🔍</span>
|
||||
Что было сделано
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-steps">
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">01</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Сбор доказательств</h3>
|
||||
<p>
|
||||
Собрали доказательства того, что автомобилем управлял
|
||||
другой человек: показания свидетелей, записи с телефона.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">02</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Установление личности</h3>
|
||||
<p>
|
||||
Установили личность человека, который был за рулём.
|
||||
Он подтвердил свою виновность и готов был признать это.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">03</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Обжалование</h3>
|
||||
<p>
|
||||
Подготовили заявление с требованием переписать штраф
|
||||
на лицо, фактически управлявшее автомобилем.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">04</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Результат</h3>
|
||||
<p>
|
||||
Дело в отношении владельца прекращено. Штраф переписан
|
||||
на реального виновника.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">⚖️</span>
|
||||
Судебное решение
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-verdict">
|
||||
<div class="case-verdict__badge">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<path d="M20 6L9 17l-5-5"/>
|
||||
</svg>
|
||||
Дело прекращено
|
||||
</div>
|
||||
<p>
|
||||
Суд, рассмотрев представленные доказательства, принял решение
|
||||
о <strong>прекращении дела</strong> в отношении владельца автомобиля.
|
||||
</p>
|
||||
<p>
|
||||
Водительское удостоверение сохранено. Штраф и лишение прав
|
||||
перенесены на лицо, фактически управлявшее транспортным средством.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<aside class="case-sidebar">
|
||||
<div class="case-sidebar__card">
|
||||
<h3 class="case-sidebar__title">Детали кейса</h3>
|
||||
<div class="case-sidebar__info">
|
||||
<div class="case-sidebar__row">
|
||||
<span>Категория</span>
|
||||
<strong>Водительские права</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Срок ведения</span>
|
||||
<strong>2 месяца</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Результат</span>
|
||||
<strong class="success">Дело прекращено</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--lawyer">
|
||||
<div class="case-sidebar__lawyer-avatar">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Автоюрист Сургут</h3>
|
||||
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
|
||||
<div class="case-sidebar__lawyer-stats">
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>12+</strong>
|
||||
<span>лет опыта</span>
|
||||
</div>
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>500+</strong>
|
||||
<span>выигранных дел</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/services" class="case-sidebar__lawyer-link">
|
||||
Все услуги
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--ad">
|
||||
<AdBanner
|
||||
width="300"
|
||||
height="640"
|
||||
className="ad-banner--vertical"
|
||||
/>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<RelatedCases
|
||||
title="Другие кейсы"
|
||||
subtitle="ПОХОЖИЕ ДЕЛА"
|
||||
cases={allCases}
|
||||
currentCaseId={5}
|
||||
/>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.case-detail-page {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
.case-content {
|
||||
padding: 5rem 0;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.case-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 380px;
|
||||
gap: 3rem;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2.5rem;
|
||||
margin-bottom: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.case-block:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-block--accent {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__title {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__content {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block--accent p {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
||||
.case-block__icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.case-block__content p {
|
||||
color: #475569;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-block__content p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-steps {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.case-step__number {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 900;
|
||||
color: #eac26e;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-step__content h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
|
||||
.case-step__content p {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.case-verdict {
|
||||
background: rgba(234, 194, 110, 0.08);
|
||||
border: 1px solid rgba(234, 194, 110, 0.2);
|
||||
border-radius: 12px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: #22c55e;
|
||||
color: #ffffff;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.case-verdict p {
|
||||
color: #0a2540;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: sticky;
|
||||
top: 100px;
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
margin-bottom: 1.5rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-sidebar__card:last-child {
|
||||
margin-bottom: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad :global(.ad-banner) {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.case-sidebar__title {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
}
|
||||
|
||||
.case-sidebar__row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.case-sidebar__row span {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong {
|
||||
color: #0a2540;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong.success {
|
||||
color: #22c55e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto 1rem;
|
||||
border: 3px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar svg {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-name {
|
||||
color: #eac26e;
|
||||
font-size: 0.95rem;
|
||||
margin: 0 0 1.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1rem 0;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat strong {
|
||||
color: #ffffff;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat span {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.75rem 1.5rem;
|
||||
background: transparent;
|
||||
border: 2px solid #eac26e;
|
||||
color: #eac26e;
|
||||
border-radius: 8px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover {
|
||||
background: #eac26e;
|
||||
color: #0a2540;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.case-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: static;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.case-content {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.case-block {
|
||||
padding: 1.5rem 1rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
604
frontend/src/pages/cases/osago-claim-450k.astro
Normal file
604
frontend/src/pages/cases/osago-claim-450k.astro
Normal file
|
|
@ -0,0 +1,604 @@
|
|||
---
|
||||
import Layout from '@layouts/Layout.astro';
|
||||
import { SITE_URL } from '@constants';
|
||||
import PageHero from "@components/base/PageHero.astro";
|
||||
import RelatedCases from "@components/cases/RelatedCases.astro";
|
||||
import AdBanner from "@components/base/AdBanner.astro";
|
||||
|
||||
const allCases = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Возврат прав после лишения по ст. 12.8 КоАП",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент был лишён прав на 18 месяцев за якобы управление в состоянии опьянения. Мы нашли процессуальные нарушения при составлении протокола.",
|
||||
resultLabel: "Лишение отменено",
|
||||
duration: "3 месяца",
|
||||
href: "/cases/driving-license-return-12-8"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Взыскание 450 000 ₽ со страховой по ОСАГО",
|
||||
category: "Страховые споры",
|
||||
categoryIcon: "📋",
|
||||
description: "Страховая компания выплатила лишь 120 000 ₽ при реальном ущербе в 570 000 ₽ после серьёзного ДТП.",
|
||||
resultLabel: "Взыскано 450 000 ₽",
|
||||
duration: "5 месяцев",
|
||||
href: "/cases/osago-claim-450k"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Оспаривание вины в ДТП с пострадавшим",
|
||||
category: "ДТП и разбор",
|
||||
categoryIcon: "🚨",
|
||||
description: "Клиента обвиняли в нарушении ПДД, повлёкшем ДТП с пострадавшим. Грозил штраф и лишение прав.",
|
||||
resultLabel: "Виновность не доказана",
|
||||
duration: "4 месяца",
|
||||
href: "/cases/dti-innocence-proof"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "Возврат прав после лишения за выезд на встречку",
|
||||
category: "Водительские права",
|
||||
categoryIcon: "🚗",
|
||||
description: "Клиент лишён прав на 6 месяцев за выезд на полосу встречного движения. Камера зафиксировала нарушение.",
|
||||
resultLabel: "Дело прекращено",
|
||||
duration: "2 месяца",
|
||||
href: "/cases/license-return-camera"
|
||||
}
|
||||
];
|
||||
---
|
||||
|
||||
<Layout
|
||||
title="Взыскание 450 000 ₽ со страховой по ОСАГО — автоюрист Сургут"
|
||||
description="Страховая компания выплатила лишь 120 000 ₽ при реальном ущербе в 570 000 ₽. Удалось взыскать недостающую сумму через суд."
|
||||
canonicalLink={`${SITE_URL}/cases/osago-claim-450k`}
|
||||
breadcrumbs={[
|
||||
{ label: 'Главная', href: '/' },
|
||||
{ label: 'Кейсы', href: '/cases' },
|
||||
{ label: 'Взыскание со страховой' }
|
||||
]}
|
||||
>
|
||||
<PageHero
|
||||
badgeText="КЕЙС #2"
|
||||
titleWhite="Взыскание"
|
||||
titleGold="450 000 ₽ со страховой"
|
||||
description="Страховая компания занизила выплату в 5 раз. Благодаря грамотной стратегии удалось взыскать полную сумму ущерба."
|
||||
btnText="Получить консультацию"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/cases/casesImg.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
experienceBadge={{
|
||||
number: "95%",
|
||||
text: "УСПЕШНЫХ ДЕЛ"
|
||||
}}
|
||||
bgImage="/images/cases/casesBg.avif"
|
||||
icon="briefcase"
|
||||
/>
|
||||
|
||||
<div class="case-detail-page">
|
||||
<section class="case-content">
|
||||
<div class="site-container">
|
||||
<div class="case-grid">
|
||||
<article class="case-article">
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">📋</span>
|
||||
Исходная ситуация
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<p>
|
||||
Наш клиент попал в серьёзное ДТП, в результате которого его автомобиль
|
||||
получил значительные повреждения. Страховая компания провела экспертизу,
|
||||
однако оценка ущерба оказалась занижена почти в 5 раз.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Реальная стоимость ущерба составила 570 000 ₽, а страховая выплатила только 120 000 ₽.</strong>
|
||||
</p>
|
||||
<p>
|
||||
Клиент обратился за помощью, когда исчерпал все досудебные способы
|
||||
урегулирования спора со страховой компанией.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block case-block--accent">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">🔍</span>
|
||||
Что было сделано
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-steps">
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">01</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Независимая экспертиза</h3>
|
||||
<p>
|
||||
Провели независимую экспертизу ущерба в сертифицированном
|
||||
автосервисе. Результат: 570 000 ₽.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">02</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Досудебная претензия</h3>
|
||||
<p>
|
||||
Направили досудебную претензию с требованием доплатить
|
||||
450 000 ₽. Страховая отказала.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">03</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Подготовка иска</h3>
|
||||
<p>
|
||||
Подготовили исковое заявление с приложением всех
|
||||
необходимых документов и экспертных заключений.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="case-step">
|
||||
<div class="case-step__number">04</div>
|
||||
<div class="case-step__content">
|
||||
<h3>Судебное представительство</h3>
|
||||
<p>
|
||||
Представили интересы клиента в суде. Страховая попыталась
|
||||
оспорить экспертизу, но безуспешно.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-block">
|
||||
<h2 class="case-block__title">
|
||||
<span class="case-block__icon">⚖️</span>
|
||||
Судебное решение
|
||||
</h2>
|
||||
<div class="case-block__content">
|
||||
<div class="case-verdict">
|
||||
<div class="case-verdict__badge">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<path d="M20 6L9 17l-5-5"/>
|
||||
</svg>
|
||||
Взыскано 450 000 ₽
|
||||
</div>
|
||||
<p>
|
||||
Суд полностью удовлетворил исковые требования. Страховая компания
|
||||
обязана выплатить <strong>450 000 ₽</strong> недоплаченного возмещения.
|
||||
</p>
|
||||
<p>
|
||||
Дополнительно взысканы: неустойка за нарушение сроков выплаты,
|
||||
компенсация морального вреда и судебные расходы.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<aside class="case-sidebar">
|
||||
<div class="case-sidebar__card">
|
||||
<h3 class="case-sidebar__title">Детали кейса</h3>
|
||||
<div class="case-sidebar__info">
|
||||
<div class="case-sidebar__row">
|
||||
<span>Категория</span>
|
||||
<strong>Страховые споры</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Срок ведения</span>
|
||||
<strong>5 месяцев</strong>
|
||||
</div>
|
||||
<div class="case-sidebar__row">
|
||||
<span>Результат</span>
|
||||
<strong class="success">Взыскано 450 000 ₽</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--lawyer">
|
||||
<div class="case-sidebar__lawyer-avatar">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>
|
||||
</div>
|
||||
<h3>Автоюрист Сургут</h3>
|
||||
<p class="case-sidebar__lawyer-name">Алексей Петров</p>
|
||||
<div class="case-sidebar__lawyer-stats">
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>12+</strong>
|
||||
<span>лет опыта</span>
|
||||
</div>
|
||||
<div class="case-sidebar__lawyer-stat">
|
||||
<strong>500+</strong>
|
||||
<span>выигранных дел</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/services" class="case-sidebar__lawyer-link">
|
||||
Все услуги
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M5 12h14"/>
|
||||
<path d="m12 5 7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="case-sidebar__card case-sidebar__card--ad">
|
||||
<AdBanner
|
||||
width="300"
|
||||
height="640"
|
||||
className="ad-banner--vertical"
|
||||
/>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<RelatedCases
|
||||
title="Другие кейсы"
|
||||
subtitle="ПОХОЖИЕ ДЕЛА"
|
||||
cases={allCases}
|
||||
currentCaseId={2}
|
||||
/>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.case-detail-page {
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
}
|
||||
|
||||
.case-content {
|
||||
padding: 5rem 0;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.case-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 380px;
|
||||
gap: 3rem;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2.5rem;
|
||||
margin-bottom: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.case-block:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-block--accent {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__title {
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-block--accent .case-block__content {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block--accent p {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
|
||||
.case-block__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
}
|
||||
|
||||
.case-block__icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.case-block__content p {
|
||||
color: #475569;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-block__content p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.case-steps {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.case-step__number {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 900;
|
||||
color: #eac26e;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-step__content h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
|
||||
.case-step__content p {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.case-verdict {
|
||||
background: rgba(234, 194, 110, 0.08);
|
||||
border: 1px solid rgba(234, 194, 110, 0.2);
|
||||
border-radius: 12px;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
background: #22c55e;
|
||||
color: #ffffff;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 6px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.case-verdict__badge svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.case-verdict p {
|
||||
color: #0a2540;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: sticky;
|
||||
top: 100px;
|
||||
height: fit-content;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
border: 1px solid #e2e8f0;
|
||||
margin-bottom: 1.5rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.case-sidebar__card:last-child {
|
||||
margin-bottom: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.case-sidebar__card--ad :global(.ad-banner) {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.case-sidebar__title {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
color: #0a2540;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 2px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
}
|
||||
|
||||
.case-sidebar__row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.case-sidebar__row span {
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong {
|
||||
color: #0a2540;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.case-sidebar__row strong.success {
|
||||
color: #22c55e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer {
|
||||
background: linear-gradient(135deg, #0a2540, #1e3050);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: rgba(234, 194, 110, 0.2);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto 1rem;
|
||||
border: 3px solid #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-avatar svg {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #eac26e;
|
||||
}
|
||||
|
||||
.case-sidebar__card--lawyer h3 {
|
||||
color: #ffffff;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 0.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-name {
|
||||
color: #eac26e;
|
||||
font-size: 0.95rem;
|
||||
margin: 0 0 1.25rem 0;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stats {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1rem 0;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat strong {
|
||||
color: #ffffff;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-stat span {
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.75rem 1.5rem;
|
||||
background: transparent;
|
||||
border: 2px solid #eac26e;
|
||||
color: #eac26e;
|
||||
border-radius: 8px;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover {
|
||||
background: #eac26e;
|
||||
color: #0a2540;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.case-sidebar__lawyer-link:hover svg {
|
||||
transform: translateX(4px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.case-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
position: static;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar__card {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.case-content {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
|
||||
.case-block {
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
|
||||
.case-sidebar {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.case-block {
|
||||
padding: 1.5rem 1rem;
|
||||
}
|
||||
|
||||
.case-step {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -21,6 +21,7 @@ import ServiceCategories from "@components/services/ServiceCategories.astro";
|
|||
titleGold="услуги"
|
||||
description="Я обеспечиваю экспертную защиту прав водителей в Сургуте и Ханты-Мансийском автономном округе."
|
||||
btnText="Получить помощь"
|
||||
modalTarget="consultation-modal"
|
||||
layout="with-image"
|
||||
sideImage="/images/services/office-table.avif"
|
||||
sideImageAlt="Автоюрист Сургут"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue