/* CSS Variables */
:root {
    --primary-color: #5e548e;
    --primary-light: #eeecf4;
    --primary-dark: #433b64;
    --secondary-color: #9c89b8;
    --secondary-light: #e8dff5;
    --tertiary-color: #f0a6ca;
    --tertiary-light: #fce4ec;
    --accent-color: #b8336a;
    --accent-light: #f8e6ed;
    --neutral-color: #6c757d;
    --neutral-light: #f8f9fa;
    --info-color: #17a2b8;
    --warning-color: #dc3545;
    --success-color: #28a745;
}

/* Base Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'PT Sans', sans-serif;
    background-color: #2a2a3e;
    color: #eeecf4;
    line-height: 1.6;
    overflow-x: hidden
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto', serif;
    font-weight: 600;
    margin-bottom: 1rem;
}

.MainHeading {
    font-size: 3.5rem;
    font-weight: 700;
    color: #eeecf4;
    margin-bottom: 1.5rem;
    line-height: 1.2;
}

.HeroDescription {
    font-size: 1.25rem;
    color: #c2c2d6;
    margin-bottom: 2rem;
    max-width: 600px;
    line-height: 1.7
}

/* Header & Navigation */
.TopNavigation {
    position: fixed;
    top: 0;
    width: 100%;
    background: rgba(42, 42, 62, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 2px solid var(--primary-color);
    z-index: 1000;
    padding: 1rem 0;
}

.MainNav {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2rem;
}

.BrandTitle {
    font-size: 1.8rem;
    color: var(--primary-light);
    font-weight: 700;
}

.MenuItems {
    display: flex;
    list-style: none;
    gap: 2.5rem;
}

.MenuItems a {
    color: var(--primary-light);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
    position: relative;
}

.MenuItems a:hover {
    color: var(--accent-color);
}

.MenuItems a::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--accent-color);
    transition: width 0.3s ease;
}

.MenuItems a:hover::after {
    width: 100%
}

/* Main Hero Section */
.MainHeroBlock {
    min-height: 100vh;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #2a2a3e 0%, #1a1a2e 100%);
    position: relative;
    padding-top: 100px;
}

.MainHeroBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 25% 25%, rgba(94, 84, 142, 0.1) 0%, transparent 50%),
                      radial-gradient(circle at 75% 75%, rgba(156, 137, 184, 0.08) 0%, transparent 50%);
    pointer-events: none;
}

.ContentWrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    position: relative;
    z-index: 1;
}

.HeroText {
    animation: slideInLeft 0.8s ease-out;
}

.HeroImage {
    animation: slideInRight 0.8s ease-out;
}

.HeroImage img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    border: 3px solid var(--primary-color);
}

/* Buttons */
.ActionButtons {
    display: flex;
    gap: 1.5rem;
    margin-top: 2.5rem;
}

.PrimaryButton,
.SecondaryButton {
    padding: 1rem 2rem;
    border-radius: 50px;
    font-size: 1.1rem;
    font-weight: 600;
    border: 3px solid;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.PrimaryButton {
    background-color: var(--accent-color);
    color: white;
    border-color: var(--accent-color);
}

.PrimaryButton:hover {
    background-color: transparent;
    color: var(--accent-color);
    transform: translateY(-2px);
}

.SecondaryButton {
    background-color: transparent;
    color: var(--primary-light);
    border-color: var(--primary-color);
}

.SecondaryButton:hover {
    background-color: var(--primary-color);
    color: white;
    transform: translateY(-2px)
}

/* Animations */
@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .ContentWrapper {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }
    
    .MainHeading {
        font-size: 2.5rem;
    }
    
    .HeroDescription {
        font-size: 1.1rem;
    }
    
    .ActionButtons {
        flex-direction: column;
        align-items: center;
    }
    
    .MenuItems {
        gap: 1.5rem;
    }
    
    .MainNav {
        padding: 0 1rem;
    }
}

@media (max-width: 480px) {
    .MainHeading {
        font-size: 2rem;
    }
    
    .BrandTitle {
        font-size: 1.5rem;
    }
    
    .MenuItems {
        gap: 1rem;
    }
}


















/* Financial Tracking Section */
.FinancialTrackingBlock {
    padding: 6rem 0;
    background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 100%);
    position: relative;
}

.FinancialTrackingBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 20% 80%, rgba(94, 84, 142, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(184, 51, 106, 0.03) 0%, transparent 50%);
    pointer-events: none
}

.SectionContainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;
}

.SectionHeader {
    text-align: center;
    margin-bottom: 4rem;
}

.SectionTitle {
    font-size: 3rem;
    color: var(--primary-light);
    margin-bottom: 1rem;
    font-weight: 700;
}

.SectionSubtitle {
    font-size: 1.3rem;
    color: #a8a8c2;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Feature Cards Grid */
.TrackingGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2.5rem;
    margin-bottom: 5rem;
}

.FeatureCard {
    background: rgba(94, 84, 142, 0.08);
    border: 3px solid var(--primary-color);
    border-radius: 25px;
    padding: 2.5rem;
    text-align: center;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.FeatureCard::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(238, 236, 244, 0.1), transparent);
    transition: left 0.6s ease;
}

.FeatureCard:hover::before {
    left: 100%;
}

.FeatureCard:hover {
    transform: translateY(-8px);
    border-color: var(--accent-color);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
}

.CardIcon {
    margin-bottom: 1.5rem;
}

.IconWrapper {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    border: 3px solid var(--primary-light);
}

.Icon {
    font-size: 2rem;
}

.CardTitle {
    font-size: 1.5rem;
    color: var(--primary-light);
    margin-bottom: 1rem;
    font-weight: 600
}

.CardDescription {
    color: #c2c2d6;
    margin-bottom: 1.5rem;
    line-height: 1.7;
    font-size: 1rem;
}

.FeatureList {
    list-style: none;
    text-align: left;
}

.FeatureList li {
    color: #a8a8c2;
    margin-bottom: 0.8rem;
    padding-left: 1.5rem;
    position: relative;
}

.FeatureList li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--success-color);
    font-weight: bold;
}

/* Tools Showcase */
.ToolsShowcase {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    background: rgba(67, 59, 100, 0.1);
    border: 2px solid var(--neutral-color);
    border-radius: 30px;
    padding: 3rem;
    margin-top: 3rem;
}

.ShowcaseTitle {
    font-size: 2.2rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.ShowcaseText {
    color: #c2c2d6;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 2rem;
}

.ToolsList {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.ToolItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: rgba(94, 84, 142, 0.1);
    border-radius: 15px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.ToolItem:hover {
    border-color: var(--accent-color);
    transform: translateX(5px)
}

.ToolName {
    font-weight: 600;
    color: var(--primary-light);
    font-size: 1.1rem;
}

.ToolDescription {
    color: #a8a8c2;
    font-size: 0.9rem;
}

.ShowcaseImage img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    border: 3px solid var(--primary-color);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Responsive Design */
@media (max-width: 968px) {
    .TrackingGrid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .ToolsShowcase {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .SectionTitle {
        font-size: 2.5rem;
    }
}

@media (max-width: 768px) {
    .FinancialTrackingBlock {
        padding: 4rem 0;
    }
    
    .SectionContainer {
        padding: 0 1rem;
    }
    
    .FeatureCard {
        padding: 2rem;
    }
    
    .ToolsShowcase {
        padding: 2rem;
    }
    
    .SectionTitle {
        font-size: 2rem;
    }
    
    .SectionSubtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .TrackingGrid {
        grid-template-columns: 1fr;
    }
    
    .FeatureCard {
        padding: 1.5rem;
    }
    
    .IconWrapper {
        width: 60px;
        height: 60px;
    }
    
    .Icon {
        font-size: 1.5rem;
    }
    
    .CardTitle {
        font-size: 1.3rem;
    }
}


















/* Financial Goals Section */
.GoalsStrategyBlock {
    padding: 6rem 0;
    background: linear-gradient(180deg, #2a2a3e 0%, #1a1a2e 50%, #2a2a3e 100%);
    position: relative;
}

.GoalsStrategyBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 15% 25%, rgba(156, 137, 184, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 85% 75%, rgba(240, 166, 202, 0.04) 0%, transparent 50%);
    pointer-events: none;
}

.GoalsContainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;
}

.GoalsHeader {
    text-align: center;
    margin-bottom: 4rem;
}

.GoalsMainTitle {
    font-size: 3rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.GoalsIntro {
    font-size: 1.3rem;
    color: #a8a8c2;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.7;
}

/* SMART Methodology */
.SmartMethodology {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    margin-bottom: 5rem;
    background: rgba(67, 59, 100, 0.08);
    border: 2px solid var(--primary-color);
    border-radius: 30px;
    padding: 3rem;
}

.MethodTitle {
    font-size: 2.2rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.MethodDescription {
    color: #c2c2d6;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 2.5rem;
}

.SmartElements {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.SmartItem {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    background: rgba(94, 84, 142, 0.1);
    padding: 1rem 1.5rem;
    border-radius: 25px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.SmartItem:hover {
    border-color: var(--accent-color);
    transform: translateY(-3px)
}

.SmartLetter {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.2rem;
}

.SmartWord {
    color: var(--primary-light);
    font-weight: 600;
    font-size: 1.1rem;
}

.MethodImage img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    border: 3px solid var(--primary-color);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Timeframe Categories */
.TimeframeCategories {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2.5rem;
    margin-bottom: 5rem;
}

.CategoryCard {
    border: 3px solid;
    border-radius: 25px;
    padding: 2.5rem;
    background: rgba(42, 42, 62, 0.4);
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.CategoryCard::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.CategoryCard:hover::before {
    opacity: 0.1;
}

.CategoryCard:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
}

.ShortTerm {
    border-color: var(--success-color);
}

.ShortTerm::before {
    background: radial-gradient(circle, var(--success-color) 0%, transparent 70%);
}

.MediumTerm {
    border-color: var(--info-color);
}

.MediumTerm::before {
    background: radial-gradient(circle, var(--info-color) 0%, transparent 70%);
}

.LongTerm {
    border-color: var(--accent-color);
}

.LongTerm::before {
    background: radial-gradient(circle, var(--accent-color) 0%, transparent 70%);
}

.CategoryHeader {
    text-align: center;
    margin-bottom: 2rem;
}

.CategoryTitle {
    font-size: 1.8rem;
    color: var(--primary-light);
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.TimeRange {
    color: #a8a8c2;
    font-size: 1rem;
    font-style: italic;
}

.GoalExamples {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.ExampleGoal {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: rgba(94, 84, 142, 0.08);
    padding: 1.5rem;
    border-radius: 20px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.ExampleGoal:hover {
    border-color: rgba(238, 236, 244, 0.3);
    transform: translateX(5px);
}

.GoalIcon {
    font-size: 2.5rem;
    min-width: 60px;
}

.GoalName {
    color: var(--primary-light);
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.GoalAmount {
    color: var(--accent-color);
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
}

.GoalStrategy {
    color: #a8a8c2;
    font-size: 0.95rem;
}

/* Action Plan */
.ActionPlan {
    background: rgba(67, 59, 100, 0.1);
    border: 2px solid var(--neutral-color);
    border-radius: 30px;
    padding: 3rem;
}

.PlanTitle {
    font-size: 2.2rem;
    color: var(--primary-light);
    text-align: center;
    margin-bottom: 3rem;
    font-weight: 600;
}

.PlanSteps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

.StepItem {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    background: rgba(94, 84, 142, 0.08);
    padding: 2rem;
    border-radius: 20px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.StepItem:hover {
    border-color: var(--accent-color);
    transform: translateY(-5px)
}

.StepNumber {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.StepTitle {
    color: var(--primary-light);
    font-size: 1.2rem;
    margin-bottom: 0.8rem;
    font-weight: 600;
}

.StepDescription {
    color: #c2c2d6;
    line-height: 1.6;
}

/* Responsive Design */
@media (max-width: 968px) {
    .SmartMethodology {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .TimeframeCategories {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .PlanSteps {
        grid-template-columns: 1fr;
    }
    
    .GoalsMainTitle {
        font-size: 2.5rem;
    }
}

@media (max-width: 768px) {
    .GoalsStrategyBlock {
        padding: 4rem 0;
    }
    
    .GoalsContainer {
        padding: 0 1rem;
    }
    
    .SmartMethodology {
        padding: 2rem;
    }
    
    .CategoryCard {
        padding: 2rem;
    }
    
    .ActionPlan {
        padding: 2rem;
    }
    
    .SmartElements {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .GoalsMainTitle {
        font-size: 2rem;
    }
    
    .GoalsIntro {
        font-size: 1.1rem;
    }
    
    .ExampleGoal {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .SmartItem {
        padding: 0.8rem 1.2rem;
    }
}













/* Educational Fund Section */
.EducationFundBlock {
    padding: 6rem 0;
    background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 50%, #1a1a2e 100%);
    position: relative;
}

.EducationFundBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(184, 51, 106, 0.04) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(94, 84, 142, 0.06) 0%, transparent 50%);
    pointer-events: none;
}

.EducationContainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;
}

.EducationHeader {
    text-align: center;
    margin-bottom: 4rem;
}

.EducationTitle {
    font-size: 3rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.EducationSubtitle {
    font-size: 1.3rem;
    color: #a8a8c2;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Funding Overview */
.FundingOverview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    margin-bottom: 5rem;
    background: rgba(67, 59, 100, 0.08);
    border: 2px solid var(--primary-color);
    border-radius: 30px;
    padding: 3rem;
}

.OverviewTitle {
    font-size: 2.2rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.OverviewText {
    color: #c2c2d6;
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 2rem;
}

.CostBreakdown {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.CostItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(94, 84, 142, 0.1);
    padding: 1rem 1.5rem;
    border-radius: 15px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.CostItem:hover {
    border-color: var(--accent-color);
    transform: translateX(5px);
}

.CostType {
    color: var(--primary-light);
    font-weight: 600;
}

.CostAmount {
    color: var(--accent-color);
    font-weight: 700;
    font-size: 1.1rem
}

.OverviewImage img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    border: 3px solid var(--primary-color);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Investment Instruments */
.InvestmentInstruments {
    margin-bottom: 5rem;
}

.InstrumentsTitle {
    font-size: 2.5rem;
    color: var(--primary-light);
    text-align: center;
    margin-bottom: 3rem;
    font-weight: 600;
}

.InstrumentsGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2.5rem;
}

.InstrumentCard {
    background: rgba(42, 42, 62, 0.4);
    border: 3px solid var(--primary-color);
    border-radius: 25px;
    padding: 2.5rem;
    text-align: center;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.InstrumentCard::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(238, 236, 244, 0.08), transparent);
    transition: left 0.6s ease;
}

.InstrumentCard:hover::before {
    left: 100%;
}

.InstrumentCard:hover {
    transform: translateY(-8px);
    border-color: var(--accent-color);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
}

.InstrumentIcon {
    margin-bottom: 1.5rem;
}

.InstrumentIcon .Icon {
    font-size: 3rem;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    border: 3px solid var(--primary-light);
}

.InstrumentName {
    font-size: 1.5rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.InstrumentDescription {
    color: #c2c2d6;
    margin-bottom: 2rem;
    line-height: 1.6;
}

.InstrumentFeatures {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.FeatureItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(94, 84, 142, 0.1);
    padding: 0.8rem 1rem;
    border-radius: 10px;
}

.FeatureLabel {
    color: #a8a8c2;
    font-size: 0.9rem;
}

.FeatureValue {
    color: var(--primary-light);
    font-weight: 600;
}

.RiskLow {
    color: var(--success-color);
}

.RiskMedium {
    color: var(--info-color);
}

/* Government Support */
.GovernmentSupport {
    margin-bottom: 5rem;
}

.SupportTitle {
    font-size: 2.5rem;
    color: var(--primary-light);
    text-align: center;
    margin-bottom: 3rem;
    font-weight: 600;
}

.SupportGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2.5rem;
}

.SupportCard {
    background: rgba(67, 59, 100, 0.1);
    border: 2px solid var(--neutral-color);
    border-radius: 25px;
    padding: 2.5rem;
    transition: all 0.4s ease;
}

.SupportCard:hover {
    transform: translateY(-8px);
    border-color: var(--accent-color);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.SupportHeader {
    margin-bottom: 1.5rem;
}

.SupportName {
    font-size: 1.4rem;
    color: var(--primary-light);
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.SupportType {
    background: var(--accent-color);
    color: white;
    padding: 0.3rem 1rem;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
}

.SupportDescription {
    color: #c2c2d6;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.SupportBenefits {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.BenefitItem {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: rgba(94, 84, 142, 0.08);
    padding: 1rem;
    border-radius: 15px;
}

.BenefitIcon {
    font-size: 1.5rem;
}

.BenefitText {
    color: var(--primary-light);
    font-weight: 500;
}

/* Strategy Recommendation */
.StrategyRecommendation {
    background: rgba(67, 59, 100, 0.1);
    border: 2px solid var(--neutral-color);
    border-radius: 30px;
    padding: 3rem;
}

.RecommendationTitle {
    font-size: 2.2rem;
    color: var(--primary-light);
    text-align: center;
    margin-bottom: 3rem;
    font-weight: 600;
}

.AgeStrategies {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2.5rem;
}

.AgeStrategy {
    background: rgba(94, 84, 142, 0.08);
    border: 2px solid var(--primary-color);
    border-radius: 20px;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s ease;
}

.AgeStrategy:hover {
    transform: translateY(-5px);
    border-color: var(--accent-color)
}

.AgeRange {
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    color: white;
    padding: 0.5rem 1.5rem;
    border-radius: 20px;
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
    display: inline-block;
}

.StrategyName {
    font-size: 1.3rem;
    color: var(--primary-light);
    margin-bottom: 1rem;
    font-weight: 600;
}

.StrategyDescription {
    color: #c2c2d6;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.StrategyMix {
    display: flex;
    justify-content: space-around;
    gap: 1rem;
}

.MixItem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.MixPercentage {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-light);
}

.MixType {
    font-size: 0.8rem;
    padding: 0.3rem 0.8rem;
    border-radius: 10px;
    font-weight: 600;
}

.Growth .MixType {
    background: var(--success-color);
    color: white;
}

.Balanced .MixType {
    background: var(--info-color);
    color: white;
}

.Conservative .MixType {
    background: var(--neutral-color);
    color: white;
}

/* Responsive Design */
@media (max-width: 968px) {
    .FundingOverview {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .InstrumentsGrid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .SupportGrid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .AgeStrategies {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .EducationTitle {
        font-size: 2.5rem;
    }
}

@media (max-width: 768px) {
    .EducationFundBlock {
        padding: 4rem 0;
    }
    
    .EducationContainer {
        padding: 0 1rem;
    }
    
    .FundingOverview {
        padding: 2rem;
    }
    
    .InstrumentCard {
        padding: 2rem;
    }
    
    .SupportCard {
        padding: 2rem;
    }
    
    .StrategyRecommendation {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .EducationTitle {
        font-size: 2rem;
    }
    
    .EducationSubtitle {
        font-size: 1.1rem;
    }
    
    .StrategyMix {
        flex-direction: column;
        gap: 1rem;
    }
    
    .CostItem {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }
}













/* Footer Section */
.BottomBlock {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    color: var(--primary-light);
    padding: 3rem 0 1rem;
    border-top: 3px solid var(--primary-color);
    position: relative;
}

.BottomBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 30% 20%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 70% 80%, rgba(184, 51, 106, 0.05) 0%, transparent 50%);
    pointer-events: none;
}

.FooterContainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;
}

.FooterContent {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 4rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 2px solid rgba(94, 84, 142, 0.3);
}

.FooterBrand {
    max-width: 500px;
}

.FooterTitle {
    font-size: 1.8rem;
    color: var(--primary-light);
    margin-bottom: 1rem;
    font-weight: 600;
    line-height: 1.3;
}

.FooterDescription {
    color: #a8a8c2;
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 2rem;
}

.ContactInfo {
    margin-top: 1.5rem;
}

.EmailLink {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--primary-light);
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: 500;
    background: rgba(94, 84, 142, 0.1);
    padding: 1rem 1.5rem;
    border-radius: 25px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.EmailLink:hover {
    color: var(--accent-color);
    border-color: var(--accent-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

.ContactIcon {
    font-size: 1.2rem;
}

.FooterLinks {
    display: flex;
    justify-content: flex-end;
}

.LinksColumn {
    min-width: 200px;
}

.LinksTitle {
    font-size: 1.2rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.LinksList {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.FooterLink {
    color: #a8a8c2;
    text-decoration: none;
    font-size: 1rem;
    transition: all 0.3s ease;
    position: relative;
    padding-left: 1rem;
}

.FooterLink::before {
    content: '→';
    position: absolute;
    left: 0;
    color: var(--accent-color);
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.3s ease;
}

.FooterLink:hover {
    color: var(--primary-light);
    padding-left: 1.5rem;
}

.FooterLink:hover::before {
    opacity: 1;
    transform: translateX(0);
}

.FooterBottom {
    text-align: center;
    padding-top: 1.5rem;
}

.CopyrightText {
    color: #8a8aa0;
    font-size: 0.9rem;
}

.CopyrightText p {
    margin: 0;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 768px) {
    .FooterContent {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }
    
    .FooterLinks {
        justify-content: center;
    }
    
    .FooterTitle {
        font-size: 1.5rem;
    }
    
    .FooterDescription {
        font-size: 1rem;
    }
    
    .EmailLink {
        font-size: 1rem;
        padding: 0.8rem 1.2rem;
    }
    
    .BottomBlock {
        padding: 2rem 0 1rem;
    }
}

@media (max-width: 480px) {
    .FooterContainer {
        padding: 0 1rem;
    }
    
    .FooterTitle {
        font-size: 1.3rem;
        line-height: 1.4;
    }
    
    .FooterDescription {
        font-size: 0.95rem;
    }
    
    .EmailLink {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }
    
    .CopyrightText {
        font-size: 0.8rem;
    }
}

/* Animation for footer reveal */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.BottomBlock {
    animation: fadeInUp 0.8s ease-out;
}












        /* CSS Variables */
        :root {
            --primary-color: #5e548e;
            --primary-light: #eeecf4;
            --primary-dark: #433b64;
            --secondary-color: #9c89b8;
            --secondary-light: #e8dff5;
            --tertiary-color: #f0a6ca;
            --tertiary-light: #fce4ec;
            --accent-color: #b8336a;
            --accent-light: #f8e6ed;
            --neutral-color: #6c757d;
            --neutral-light: #f8f9fa;
            --info-color: #17a2b8;
            --warning-color: #dc3545;
            --success-color: #28a745;
        }

        /* Base Reset */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'PT Sans', sans-serif;
            background-color: #2a2a3e;
            color: #eeecf4;
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Typography */
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Roboto', serif;
            font-weight: 600;
            margin-bottom: 1rem;
        }

        /* Header & Navigation */
        .TopNavigation {
            position: fixed;
            top: 0;
            width: 100%;
            background: rgba(42, 42, 62, 0.95);
            backdrop-filter: blur(10px);
            border-bottom: 2px solid var(--primary-color);
            z-index: 1000;
            padding: 1rem 0;
        }

        .MainNav {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 2rem;
        }

        .BrandTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            font-weight: 700;
        }

        .MenuItems {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }

        .MenuItems a {
            color: var(--primary-light);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s ease;
            position: relative;
        }

        .MenuItems a:hover {
            color: var(--accent-color);
        }

        .MenuItems a::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background-color: var(--accent-color);
            transition: width 0.3s ease;
        }

        .MenuItems a:hover::after {
            width: 100%;
        }

        /* Main Content */
        .MainContent {
            padding-top: 120px;
            min-height: 100vh;
        }

        /* Hero Section */
        .AboutHeroBlock {
            padding: 4rem 0;
            background: linear-gradient(135deg, #2a2a3e 0%, #1a1a2e 100%);
            position: relative;
        }

        .AboutHeroBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: radial-gradient(circle at 25% 25%, rgba(94, 84, 142, 0.1) 0%, transparent 50%),
                              radial-gradient(circle at 75% 75%, rgba(156, 137, 184, 0.08) 0%, transparent 50%);
            pointer-events: none;
        }

        .HeroContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .HeroTitle {
            font-size: 3.5rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 700;
            line-height: 1.2;
        }

        .HeroSubtitle {
            font-size: 1.3rem;
            color: #a8a8c2;
            max-width: 700px;
            margin: 0 auto 2rem;
            line-height: 1.7;
        }

        /* Crisis Management Section */
        .CrisisManagementBlock {
            padding: 6rem 0;
            background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 100%);
            position: relative;
        }

        .CrisisManagementBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 20% 80%, rgba(220, 53, 69, 0.05) 0%, transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(184, 51, 106, 0.03) 0%, transparent 50%);
            pointer-events: none;
        }

        .SectionContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            position: relative;
            z-index: 1;
        }

        .SectionHeader {
            text-align: center;
            margin-bottom: 4rem;
        }

        .SectionTitle {
            font-size: 3rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 700;
        }

        .SectionSubtitle {
            font-size: 1.3rem;
            color: #a8a8c2;
            max-width: 600px;
            margin: 0 auto;
            line-height: 1.6;
        }

        /* Crisis Scenarios Grid */
        .CrisisGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
            gap: 2.5rem;
            margin-bottom: 5rem;
        }

        .CrisisCard {
            background: rgba(42, 42, 62, 0.4);
            border: 3px solid var(--warning-color);
            border-radius: 25px;
            padding: 2.5rem;
            text-align: center;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .CrisisCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(220, 53, 69, 0.1), transparent);
            transition: left 0.6s ease;
        }

        .CrisisCard:hover::before {
            left: 100%;
        }

        .CrisisCard:hover {
            transform: translateY(-8px);
            border-color: var(--accent-color);
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
        }

        .CrisisIcon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, var(--warning-color), var(--accent-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            border: 3px solid var(--primary-light);
            font-size: 2rem;
        }

        .CrisisTitle {
            font-size: 1.5rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
        }

        .CrisisDescription {
            color: #c2c2d6;
            margin-bottom: 1.5rem;
            line-height: 1.7;
        }

        .ActionList {
            list-style: none;
            text-align: left;
        }

        .ActionList li {
            color: #a8a8c2;
            margin-bottom: 0.8rem;
            padding-left: 1.5rem;
            position: relative;
        }

        .ActionList li::before {
            content: '⚡';
            position: absolute;
            left: 0;
            color: var(--warning-color);
            font-weight: bold;
        }

        /* Reserve Fund Section */
        .ReserveFundBlock {
            padding: 6rem 0;
            background: linear-gradient(180deg, #2a2a3e 0%, #1a1a2e 50%, #2a2a3e 100%);
            position: relative;
        }

        .ReserveFundBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 15% 25%, rgba(40, 167, 69, 0.06) 0%, transparent 50%),
                radial-gradient(circle at 85% 75%, rgba(23, 162, 184, 0.04) 0%, transparent 50%);
            pointer-events: none;
        }

        .ReserveFundOverview {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
            margin-bottom: 5rem;
            background: rgba(67, 59, 100, 0.08);
            border: 2px solid var(--success-color);
            border-radius: 30px;
            padding: 3rem;
        }

        .ReserveFundContent h3 {
            font-size: 2.2rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .ReserveFundContent p {
            color: #c2c2d6;
            font-size: 1.1rem;
            line-height: 1.7;
            margin-bottom: 2rem;
        }

        .FundGuidelines {
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .GuidelineItem {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: rgba(40, 167, 69, 0.1);
            padding: 1rem 1.5rem;
            border-radius: 15px;
            border: 2px solid transparent;
            transition: all 0.3s ease;
        }

        .GuidelineItem:hover {
            border-color: var(--success-color);
            transform: translateX(5px);
        }

        .GuidelineLabel {
            color: var(--primary-light);
            font-weight: 600;
        }

        .GuidelineValue {
            color: var(--success-color);
            font-weight: 700;
            font-size: 1.1rem;
        }

        .ReserveFundImage img {
            width: 100%;
            height: auto;
            border-radius: 20px;
            border: 3px solid var(--success-color);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        /* Emergency Measures Section */
        .EmergencyMeasuresBlock {
            padding: 6rem 0;
            background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 50%, #1a1a2e 100%);
            position: relative;
        }

        .EmergencyMeasuresBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 25% 25%, rgba(23, 162, 184, 0.04) 0%, transparent 50%),
                radial-gradient(circle at 75% 75%, rgba(94, 84, 142, 0.06) 0%, transparent 50%);
            pointer-events: none;
        }

        .MeasuresGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2.5rem;
            margin-bottom: 3rem;
        }

        .MeasureCard {
            background: rgba(67, 59, 100, 0.1);
            border: 2px solid var(--info-color);
            border-radius: 25px;
            padding: 2.5rem;
            transition: all 0.4s ease;
            position: relative;
        }

        .MeasureCard:hover {
            transform: translateY(-8px);
            border-color: var(--accent-color);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
        }

        .MeasureHeader {
            display: flex;
            align-items: center;
            gap: 1rem;
            margin-bottom: 1.5rem;
        }

        .MeasureNumber {
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, var(--info-color), var(--primary-color));
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            flex-shrink: 0;
        }

        .MeasureTitle {
            font-size: 1.4rem;
            color: var(--primary-light);
            font-weight: 600;
        }

        .MeasureDescription {
            color: #c2c2d6;
            line-height: 1.6;
            margin-bottom: 1.5rem;
        }

        .MeasureSteps {
            list-style: none;
        }

        .MeasureSteps li {
            color: #a8a8c2;
            margin-bottom: 0.8rem;
            padding-left: 1.5rem;
            position: relative;
        }

        .MeasureSteps li::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--info-color);
            font-weight: bold;
        }

        /* Action Plan */
        .ActionPlanBlock {
            background: rgba(67, 59, 100, 0.1);
            border: 2px solid var(--neutral-color);
            border-radius: 30px;
            padding: 3rem;
            margin-top: 3rem;
        }

        .ActionPlanTitle {
            font-size: 2.2rem;
            color: var(--primary-light);
            text-align: center;
            margin-bottom: 3rem;
            font-weight: 600;
        }

        .TimelineSteps {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
        }

        .TimelineStep {
            background: rgba(94, 84, 142, 0.08);
            border: 2px solid var(--primary-color);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            transition: all 0.3s ease;
            position: relative;
        }

        .TimelineStep:hover {
            border-color: var(--accent-color);
            transform: translateY(-5px);
        }

        .StepTime {
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
            color: white;
            padding: 0.5rem 1.5rem;
            border-radius: 20px;
            font-weight: 700;
            margin-bottom: 1.5rem;
            display: inline-block;
        }

        .StepTitle {
            font-size: 1.2rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
        }

        .StepDescription {
            color: #c2c2d6;
            line-height: 1.6;
        }

        /* Footer */
        .BottomBlock {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
            color: var(--primary-light);
            padding: 3rem 0 1rem;
            border-top: 3px solid var(--primary-color);
            position: relative;
        }

        .BottomBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 30% 20%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(184, 51, 106, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        .FooterContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            position: relative;
            z-index: 1;
        }

        .FooterContent {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 4rem;
            margin-bottom: 2rem;
            padding-bottom: 2rem;
            border-bottom: 2px solid rgba(94, 84, 142, 0.3);
        }

        .FooterBrand {
            max-width: 500px;
        }

        .FooterTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
            line-height: 1.3;
        }

        .FooterDescription {
            color: #a8a8c2;
            font-size: 1.1rem;
            line-height: 1.6;
            margin-bottom: 2rem;
        }

        .ContactInfo {
            margin-top: 1.5rem;
        }

        .EmailLink {
            display: inline-flex;
            align-items: center;
            gap: 0.8rem;
            color: var(--primary-light);
            text-decoration: none;
            font-size: 1.1rem;
            font-weight: 500;
            background: rgba(94, 84, 142, 0.1);
            padding: 1rem 1.5rem;
            border-radius: 25px;
            border: 2px solid transparent;
            transition: all 0.3s ease;
        }

        .EmailLink:hover {
            color: var(--accent-color);
            border-color: var(--accent-color);
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
        }

        .FooterLinks {
            display: flex;
            justify-content: flex-end;
        }

        .LinksColumn {
            min-width: 200px;
        }

        .LinksTitle {
            font-size: 1.2rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .LinksList {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .FooterLink {
            color: #a8a8c2;
            text-decoration: none;
            font-size: 1rem;
            transition: all 0.3s ease;
            position: relative;
            padding-left: 1rem;
        }

        .FooterLink::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--accent-color);
            opacity: 0;
            transform: translateX(-10px);
            transition: all 0.3s ease;
        }

        .FooterLink:hover {
            color: var(--primary-light);
            padding-left: 1.5rem;
        }

        .FooterLink:hover::before {
            opacity: 1;
            transform: translateX(0);
        }

        .FooterBottom {
            text-align: center;
            padding-top: 1.5rem;
        }

        .CopyrightText {
            color: #8a8aa0;
            font-size: 0.9rem;
        }

        /* Animations */
        @keyframes slideInLeft {
            from {
                opacity: 0;
                transform: translateX(-50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes slideInRight {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Responsive Design */
        @media (max-width: 968px) {
            .CrisisGrid {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            
            .ReserveFundOverview {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            
            .MeasuresGrid {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            
            .TimelineSteps {
                grid-template-columns: 1fr;
            }
            
            .HeroTitle {
                font-size: 2.5rem;
            }
            
            .SectionTitle {
                font-size: 2.5rem;
            }
        }

        @media (max-width: 768px) {
            .MainContent {
                padding-top: 100px;
            }
            
            .CrisisManagementBlock,
            .ReserveFundBlock,
            .EmergencyMeasuresBlock {
                padding: 4rem 0;
            }
            
            .SectionContainer {
                padding: 0 1rem;
            }
            
            .CrisisCard,
            .MeasureCard {
                padding: 2rem;
            }
            
            .ReserveFundOverview,
            .ActionPlanBlock {
                padding: 2rem;
            }
            
            .FooterContent {
                grid-template-columns: 1fr;
                gap: 2rem;
                text-align: center;
            }
            
            .FooterLinks {
                justify-content: center;
            }
            
            .MenuItems {
                gap: 1.5rem;
            }
            
            .MainNav {
                padding: 0 1rem;
            }
        }

        @media (max-width: 480px) {
            .HeroTitle {
                font-size: 2rem;
            }
            
            .SectionTitle {
                font-size: 2rem;
            }
            
            .HeroSubtitle,
            .SectionSubtitle {
                font-size: 1.1rem;
            }
            
            .BrandTitle {
                font-size: 1.5rem;
            }
            
            .MenuItems {
                gap: 1rem;
            }
            
            .CrisisCard {
                padding: 1.5rem;
            }
            
            .CrisisIcon {
                width: 60px;
                height: 60px;
                font-size: 1.5rem;
            }
        }
  










        
        /* CSS Variables */
        :root {
            --primary-color: #5e548e;
            --primary-light: #eeecf4;
            --primary-dark: #433b64;
            --secondary-color: #9c89b8;
            --secondary-light: #e8dff5;
            --tertiary-color: #f0a6ca;
            --tertiary-light: #fce4ec;
            --accent-color: #b8336a;
            --accent-light: #f8e6ed;
            --neutral-color: #6c757d;
            --neutral-light: #f8f9fa;
            --info-color: #17a2b8;
            --warning-color: #dc3545;
            --success-color: #28a745;
        }

        /* Base Reset */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'PT Sans', sans-serif;
            background-color: #2a2a3e;
            color: #eeecf4;
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Typography */
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Roboto', serif;
            font-weight: 600;
            margin-bottom: 1rem;
        }

        /* Header & Navigation */
        .TopNavigation {
            position: fixed;
            top: 0;
            width: 100%;
            background: rgba(42, 42, 62, 0.95);
            backdrop-filter: blur(10px);
            border-bottom: 2px solid var(--primary-color);
            z-index: 1000;
            padding: 1rem 0;
        }

        .MainNav {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 2rem;
        }

        .BrandTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            font-weight: 700;
        }

        .MenuItems {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }

        .MenuItems a {
            color: var(--primary-light);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s ease;
            position: relative;
        }

        .MenuItems a:hover {
            color: var(--accent-color);
        }

        .MenuItems a::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background-color: var(--accent-color);
            transition: width 0.3s ease;
        }

        .MenuItems a:hover::after {
            width: 100%;
        }

        /* Main Content */
        .MainContent {
            padding-top: 120px;
            min-height: 100vh;
            background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 50%, #1a1a2e 100%);
            position: relative;
        }

        .MainContent::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 20% 30%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 80% 70%, rgba(240, 166, 202, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        /* Cookie Hero Section */
        .CookieHeroBlock {
            padding: 4rem 0;
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .HeroContainer {
            max-width: 800px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .CookieIcon {
            width: 120px;
            height: 120px;
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 2rem;
            border: 4px solid var(--primary-light);
            font-size: 3rem;
            animation: cookieBounce 2s ease-in-out infinite;
        }

        @keyframes cookieBounce {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
        }

        .HeroTitle {
            font-size: 3rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 700;
            line-height: 1.2;
        }

        .HeroSubtitle {
            font-size: 1.2rem;
            color: #a8a8c2;
            line-height: 1.7;
            margin-bottom: 3rem;
        }

        /* Cookie Content Section */
        .CookieContentBlock {
            padding: 3rem 0 6rem;
            position: relative;
            z-index: 1;
        }

        .ContentContainer {
            max-width: 900px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .CookieTypes {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 2rem;
            margin-bottom: 4rem;
        }

        .CookieCard {
            background: rgba(67, 59, 100, 0.15);
            border: 3px solid var(--primary-color);
            border-radius: 25px;
            padding: 2.5rem;
            text-align: center;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .CookieCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(238, 236, 244, 0.1), transparent);
            transition: left 0.6s ease;
        }

        .CookieCard:hover::before {
            left: 100%;
        }

        .CookieCard:hover {
            transform: translateY(-8px);
            border-color: var(--accent-color);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .CookieCardIcon {
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, var(--info-color), var(--primary-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            font-size: 1.5rem;
            border: 2px solid var(--primary-light);
        }

        .CookieCardTitle {
            font-size: 1.3rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
        }

        .CookieCardDescription {
            color: #c2c2d6;
            line-height: 1.6;
            font-size: 0.95rem;
        }

        /* Essential Cookies - Green */
        .EssentialCard {
            border-color: var(--success-color);
        }

        .EssentialCard .CookieCardIcon {
            background: linear-gradient(135deg, var(--success-color), #1e7e34);
        }

        /* Analytics Cookies - Blue */
        .AnalyticsCard {
            border-color: var(--info-color);
        }

        .AnalyticsCard .CookieCardIcon {
            background: linear-gradient(135deg, var(--info-color), #117a8b);
        }

        /* Marketing Cookies - Purple */
        .MarketingCard {
            border-color: var(--accent-color);
        }

        .MarketingCard .CookieCardIcon {
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
        }

        /* Info Section */
        .InfoSection {
            background: rgba(94, 84, 142, 0.1);
            border: 2px solid var(--neutral-color);
            border-radius: 25px;
            padding: 3rem;
            margin-bottom: 3rem;
        }

        .InfoTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
            text-align: center;
        }

        .InfoContent {
            color: #c2c2d6;
            line-height: 1.7;
            font-size: 1.05rem;
        }

        .InfoContent p {
            margin-bottom: 1.5rem;
        }

        .InfoContent p:last-child {
            margin-bottom: 0;
        }

        /* Control Section */
        .ControlSection {
            background: rgba(67, 59, 100, 0.08);
            border: 2px solid var(--primary-color);
            border-radius: 25px;
            padding: 3rem;
            text-align: center;
        }

        .ControlTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .ControlDescription {
            color: #c2c2d6;
            line-height: 1.7;
            font-size: 1.05rem;
            margin-bottom: 2rem;
        }

        .ControlSteps {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 1.5rem;
            margin-top: 2rem;
        }

        .ControlStep {
            background: rgba(94, 84, 142, 0.1);
            padding: 1.5rem;
            border-radius: 15px;
            border: 2px solid transparent;
            transition: all 0.3s ease;
        }

        .ControlStep:hover {
            border-color: var(--accent-color);
            transform: translateY(-3px);
        }

        .StepNumber {
            width: 30px;
            height: 30px;
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            margin: 0 auto 1rem;
            font-size: 0.9rem;
        }

        .StepText {
            color: var(--primary-light);
            font-size: 0.9rem;
            font-weight: 500;
        }

        /* Footer */
        .BottomBlock {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
            color: var(--primary-light);
            padding: 3rem 0 1rem;
            border-top: 3px solid var(--primary-color);
            position: relative;
        }

        .BottomBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 30% 20%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(184, 51, 106, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        .FooterContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            position: relative;
            z-index: 1;
        }

        .FooterContent {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 4rem;
            margin-bottom: 2rem;
            padding-bottom: 2rem;
            border-bottom: 2px solid rgba(94, 84, 142, 0.3);
        }

        .FooterBrand {
            max-width: 500px;
        }

        .FooterTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
            line-height: 1.3;
        }

        .FooterDescription {
            color: #a8a8c2;
            font-size: 1.1rem;
            line-height: 1.6;
        }

        .FooterLinks {
            display: flex;
            justify-content: flex-end;
        }

        .LinksColumn {
            min-width: 200px;
        }

        .LinksTitle {
            font-size: 1.2rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .LinksList {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .FooterLink {
            color: #a8a8c2;
            text-decoration: none;
            font-size: 1rem;
            transition: all 0.3s ease;
            position: relative;
            padding-left: 1rem;
        }

        .FooterLink::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--accent-color);
            opacity: 0;
            transform: translateX(-10px);
            transition: all 0.3s ease;
        }

        .FooterLink:hover {
            color: var(--primary-light);
            padding-left: 1.5rem;
        }

        .FooterLink:hover::before {
            opacity: 1;
            transform: translateX(0);
        }

        .FooterBottom {
            text-align: center;
            padding-top: 1.5rem;
        }

        .CopyrightText {
            color: #8a8aa0;
            font-size: 0.9rem;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .MainContent {
                padding-top: 100px;
            }
            
            .CookieHeroBlock,
            .CookieContentBlock {
                padding: 3rem 0;
            }
            
            .HeroContainer,
            .ContentContainer {
                padding: 0 1rem;
            }
            
            .CookieTypes {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }
            
            .InfoSection,
            .ControlSection {
                padding: 2rem;
            }
            
            .FooterContent {
                grid-template-columns: 1fr;
                gap: 2rem;
                text-align: center;
            }
            
            .FooterLinks {
                justify-content: center;
            }
            
            .MenuItems {
                gap: 1.5rem;
            }
            
            .MainNav {
                padding: 0 1rem;
            }
            
            .HeroTitle {
                font-size: 2.5rem;
            }
            
            .CookieIcon {
                width: 100px;
                height: 100px;
                font-size: 2.5rem;
            }
        }

        @media (max-width: 480px) {
            .HeroTitle {
                font-size: 2rem;
            }
            
            .HeroSubtitle {
                font-size: 1.1rem;
            }
            
            .BrandTitle {
                font-size: 1.5rem;
            }
            
            .MenuItems {
                gap: 1rem;
            }
            
            .CookieCard {
                padding: 2rem;
            }
            
            .ControlSteps {
                grid-template-columns: 1fr;
            }
        }
    










         
        /* CSS Variables */
        :root {
            --primary-color: #5e548e;
            --primary-light: #eeecf4;
            --primary-dark: #433b64;
            --secondary-color: #9c89b8;
            --secondary-light: #e8dff5;
            --tertiary-color: #f0a6ca;
            --tertiary-light: #fce4ec;
            --accent-color: #b8336a;
            --accent-light: #f8e6ed;
            --neutral-color: #6c757d;
            --neutral-light: #f8f9fa;
            --info-color: #17a2b8;
            --warning-color: #dc3545;
            --success-color: #28a745;
        }

        /* Base Reset */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'PT Sans', sans-serif;
            background-color: #2a2a3e;
            color: #eeecf4;
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Typography */
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Roboto', serif;
            font-weight: 600;
            margin-bottom: 1rem;
        }

        /* Header & Navigation */
        .TopNavigation {
            position: fixed;
            top: 0;
            width: 100%;
            background: rgba(42, 42, 62, 0.95);
            backdrop-filter: blur(10px);
            border-bottom: 2px solid var(--primary-color);
            z-index: 1000;
            padding: 1rem 0;
        }

        .MainNav {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 2rem;
        }

        .BrandTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            font-weight: 700;
        }

        .MenuItems {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }

        .MenuItems a {
            color: var(--primary-light);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s ease;
            position: relative;
        }

        .MenuItems a:hover {
            color: var(--accent-color);
        }

        .MenuItems a::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background-color: var(--accent-color);
            transition: width 0.3s ease;
        }

        .MenuItems a:hover::after {
            width: 100%;
        }

        /* Main Content */
        .MainContent {
            padding-top: 120px;
            min-height: 100vh;
            background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 50%, #1a1a2e 100%);
            position: relative;
        }

        .MainContent::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 25% 25%, rgba(23, 162, 184, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 75% 75%, rgba(94, 84, 142, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        /* Privacy Hero Section */
        .PrivacyHeroBlock {
            padding: 4rem 0;
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .HeroContainer {
            max-width: 800px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .PrivacyIconContainer {
            position: relative;
            margin: 0 auto 2rem;
            width: 120px;
            height: 120px;
        }

        .PrivacyIcon {
            width: 120px;
            height: 120px;
            background: linear-gradient(135deg, var(--info-color), var(--primary-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 4px solid var(--primary-light);
            font-size: 3rem;
            animation: shieldPulse 3s ease-in-out infinite;
            position: relative;
            z-index: 2;
        }

        .PrivacyIcon::before {
            content: '';
            position: absolute;
            top: -8px;
            left: -8px;
            right: -8px;
            bottom: -8px;
            border-radius: 50%;
            background: linear-gradient(135deg, rgba(23, 162, 184, 0.3), rgba(94, 84, 142, 0.3));
            animation: shieldGlow 3s ease-in-out infinite;
            z-index: -1;
        }

        @keyframes shieldPulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }

        @keyframes shieldGlow {
            0%, 100% { opacity: 0.5; transform: scale(1); }
            50% { opacity: 1; transform: scale(1.1); }
        }

        .HeroTitle {
            font-size: 3rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 700;
            line-height: 1.2;
        }

        .HeroSubtitle {
            font-size: 1.2rem;
            color: #a8a8c2;
            line-height: 1.7;
            margin-bottom: 3rem;
        }

        /* Privacy Principles Section */
        .PrivacyContentBlock {
            padding: 3rem 0 6rem;
            position: relative;
            z-index: 1;
        }

        .ContentContainer {
            max-width: 900px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .PrivacyPrinciples {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            margin-bottom: 4rem;
        }

        .PrincipleCard {
            background: rgba(67, 59, 100, 0.15);
            border: 3px solid var(--info-color);
            border-radius: 25px;
            padding: 2.5rem;
            text-align: center;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .PrincipleCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(23, 162, 184, 0.1), transparent);
            transition: left 0.6s ease;
        }

        .PrincipleCard:hover::before {
            left: 100%;
        }

        .PrincipleCard:hover {
            transform: translateY(-8px);
            border-color: var(--accent-color);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .PrincipleIcon {
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, var(--success-color), var(--info-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            font-size: 1.5rem;
            border: 2px solid var(--primary-light);
        }

        .PrincipleTitle {
            font-size: 1.3rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
        }

        .PrincipleDescription {
            color: #c2c2d6;
            line-height: 1.6;
            font-size: 0.95rem;
        }

        /* Data Flow Section */
        .DataFlowSection {
            background: rgba(94, 84, 142, 0.1);
            border: 2px solid var(--primary-color);
            border-radius: 25px;
            padding: 3rem;
            margin-bottom: 3rem;
            position: relative;
            overflow: hidden;
        }

        .DataFlowSection::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(45deg, transparent 30%, rgba(238, 236, 244, 0.02) 50%, transparent 70%);
            animation: dataFlow 8s linear infinite;
            pointer-events: none;
        }

        @keyframes dataFlow {
            0% { transform: translateX(-100%) translateY(-100%); }
            100% { transform: translateX(100%) translateY(100%); }
        }

        .DataFlowTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 2rem;
            font-weight: 600;
            text-align: center;
        }

        .DataFlow {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 2rem;
            position: relative;
            z-index: 1;
        }

        .FlowStep {
            background: rgba(67, 59, 100, 0.15);
            padding: 2rem;
            border-radius: 20px;
            text-align: center;
            border: 2px solid transparent;
            transition: all 0.3s ease;
            position: relative;
        }

        .FlowStep:hover {
            border-color: var(--accent-color);
            transform: translateY(-5px);
        }

        .FlowNumber {
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            margin: 0 auto 1rem;
            position: relative;
        }

        .FlowNumber::after {
            content: '';
            position: absolute;
            top: 50%;
            left: 100%;
            width: 50px;
            height: 2px;
            background: linear-gradient(90deg, var(--accent-color), transparent);
            transform: translateY(-50%);
            display: none;
        }

        .FlowStep:not(:last-child) .FlowNumber::after {
            display: block;
        }

        .FlowTitle {
            color: var(--primary-light);
            font-size: 1.1rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        .FlowDescription {
            color: #c2c2d6;
            font-size: 0.9rem;
            line-height: 1.5;
        }

        /* Rights Section */
        .RightsSection {
            background: rgba(67, 59, 100, 0.08);
            border: 2px solid var(--success-color);
            border-radius: 25px;
            padding: 3rem;
            text-align: center;
        }

        .RightsTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .RightsDescription {
            color: #c2c2d6;
            line-height: 1.7;
            font-size: 1.05rem;
            margin-bottom: 2rem;
        }

        .RightsGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 1.5rem;
            margin-top: 2rem;
        }

        .RightItem {
            background: rgba(40, 167, 69, 0.1);
            padding: 1.5rem;
            border-radius: 15px;
            border: 2px solid transparent;
            transition: all 0.3s ease;
            position: relative;
        }

        .RightItem:hover {
            border-color: var(--success-color);
            transform: translateY(-3px);
        }

        .RightIcon {
            font-size: 1.5rem;
            margin-bottom: 1rem;
            display: block;
        }

        .RightTitle {
            color: var(--primary-light);
            font-size: 1rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        .RightText {
            color: #a8a8c2;
            font-size: 0.85rem;
            line-height: 1.4;
        }

        /* Footer */
        .BottomBlock {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
            color: var(--primary-light);
            padding: 3rem 0 1rem;
            border-top: 3px solid var(--primary-color);
            position: relative;
        }

        .BottomBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 30% 20%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(184, 51, 106, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        .FooterContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            position: relative;
            z-index: 1;
        }

        .FooterContent {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 4rem;
            margin-bottom: 2rem;
            padding-bottom: 2rem;
            border-bottom: 2px solid rgba(94, 84, 142, 0.3);
        }

        .FooterBrand {
            max-width: 500px;
        }

        .FooterTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
            line-height: 1.3;
        }

        .FooterDescription {
            color: #a8a8c2;
            font-size: 1.1rem;
            line-height: 1.6;
        }

        .FooterLinks {
            display: flex;
            justify-content: flex-end;
        }

        .LinksColumn {
            min-width: 200px;
        }

        .LinksTitle {
            font-size: 1.2rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .LinksList {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .FooterLink {
            color: #a8a8c2;
            text-decoration: none;
            font-size: 1rem;
            transition: all 0.3s ease;
            position: relative;
            padding-left: 1rem;
        }

        .FooterLink::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--accent-color);
            opacity: 0;
            transform: translateX(-10px);
            transition: all 0.3s ease;
        }

        .FooterLink:hover {
            color: var(--primary-light);
            padding-left: 1.5rem;
        }

        .FooterLink:hover::before {
            opacity: 1;
            transform: translateX(0);
        }

        .FooterBottom {
            text-align: center;
            padding-top: 1.5rem;
        }

        .CopyrightText {
            color: #8a8aa0;
            font-size: 0.9rem;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .MainContent {
                padding-top: 100px;
            }
            
            .PrivacyHeroBlock,
            .PrivacyContentBlock {
                padding: 3rem 0;
            }
            
            .HeroContainer,
            .ContentContainer {
                padding: 0 1rem;
            }
            
            .PrivacyPrinciples {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }
            
            .DataFlow {
                grid-template-columns: 1fr;
            }
            
            .RightsGrid {
                grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            }
            
            .DataFlowSection,
            .RightsSection {
                padding: 2rem;
            }
            
            .FooterContent {
                grid-template-columns: 1fr;
                gap: 2rem;
                text-align: center;
            }
            
            .FooterLinks {
                justify-content: center;
            }
            
            .MenuItems {
                gap: 1.5rem;
            }
            
            .MainNav {
                padding: 0 1rem;
            }
            
            .HeroTitle {
                font-size: 2.5rem;
            }
            
            .PrivacyIcon {
                width: 100px;
                height: 100px;
                font-size: 2.5rem;
            }
            
            .PrivacyIconContainer {
                width: 100px;
                height: 100px;
            }

            .FlowNumber::after {
                display: none;
            }
        }

        @media (max-width: 480px) {
            .HeroTitle {
                font-size: 2rem;
            }
            
            .HeroSubtitle {
                font-size: 1.1rem;
            }
            
            .BrandTitle {
                font-size: 1.5rem;
            }
            
            .MenuItems {
                gap: 1rem;
            }
            
            .PrincipleCard {
                padding: 2rem;
            }
            
            .RightsGrid {
                grid-template-columns: 1fr;
            }
        }
    










  
        /* CSS Variables */
        :root {
            --primary-color: #5e548e;
            --primary-light: #eeecf4;
            --primary-dark: #433b64;
            --secondary-color: #9c89b8;
            --secondary-light: #e8dff5;
            --tertiary-color: #f0a6ca;
            --tertiary-light: #fce4ec;
            --accent-color: #b8336a;
            --accent-light: #f8e6ed;
            --neutral-color: #6c757d;
            --neutral-light: #f8f9fa;
            --info-color: #17a2b8;
            --warning-color: #dc3545;
            --success-color: #28a745;
        }

        /* Base Reset */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'PT Sans', sans-serif;
            background-color: #2a2a3e;
            color: #eeecf4;
            line-height: 1.6;
            overflow-x: hidden;
        }

        /* Typography */
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Roboto', serif;
            font-weight: 600;
            margin-bottom: 1rem;
        }

        /* Header & Navigation */
        .TopNavigation {
            position: fixed;
            top: 0;
            width: 100%;
            background: rgba(42, 42, 62, 0.95);
            backdrop-filter: blur(10px);
            border-bottom: 2px solid var(--primary-color);
            z-index: 1000;
            padding: 1rem 0;
        }

        .MainNav {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 2rem;
        }

        .BrandTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            font-weight: 700;
        }

        .MenuItems {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }

        .MenuItems a {
            color: var(--primary-light);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.3s ease;
            position: relative;
        }

        .MenuItems a:hover {
            color: var(--accent-color);
        }

        .MenuItems a::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background-color: var(--accent-color);
            transition: width 0.3s ease;
        }

        .MenuItems a:hover::after {
            width: 100%;
        }

        /* Main Content */
        .MainContent {
            padding-top: 120px;
            min-height: 100vh;
            background: linear-gradient(180deg, #1a1a2e 0%, #2a2a3e 50%, #1a1a2e 100%);
            position: relative;
        }

        .MainContent::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 25% 25%, rgba(23, 162, 184, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 75% 75%, rgba(94, 84, 142, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        /* Privacy Hero Section */
        .PrivacyHeroBlock {
            padding: 4rem 0;
            text-align: center;
            position: relative;
            z-index: 1;
        }

        .HeroContainer {
            max-width: 800px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .PrivacyIconContainer {
            position: relative;
            margin: 0 auto 2rem;
            width: 120px;
            height: 120px;
        }

        .PrivacyIcon {
            width: 120px;
            height: 120px;
            background: linear-gradient(135deg, var(--info-color), var(--primary-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 4px solid var(--primary-light);
            font-size: 3rem;
            animation: shieldPulse 3s ease-in-out infinite;
            position: relative;
            z-index: 2;
        }

        .PrivacyIcon::before {
            content: '';
            position: absolute;
            top: -8px;
            left: -8px;
            right: -8px;
            bottom: -8px;
            border-radius: 50%;
            background: linear-gradient(135deg, rgba(23, 162, 184, 0.3), rgba(94, 84, 142, 0.3));
            animation: shieldGlow 3s ease-in-out infinite;
            z-index: -1;
        }

        @keyframes shieldPulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }

        @keyframes shieldGlow {
            0%, 100% { opacity: 0.5; transform: scale(1); }
            50% { opacity: 1; transform: scale(1.1); }
        }

        .HeroTitle {
            font-size: 3rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 700;
            line-height: 1.2;
        }

        .HeroSubtitle {
            font-size: 1.2rem;
            color: #a8a8c2;
            line-height: 1.7;
            margin-bottom: 3rem;
        }

        /* Privacy Principles Section */
        .PrivacyContentBlock {
            padding: 3rem 0 6rem;
            position: relative;
            z-index: 1;
        }

        .ContentContainer {
            max-width: 900px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .PrivacyPrinciples {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            margin-bottom: 4rem;
        }

        .PrincipleCard {
            background: rgba(67, 59, 100, 0.15);
            border: 3px solid var(--info-color);
            border-radius: 25px;
            padding: 2.5rem;
            text-align: center;
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }

        .PrincipleCard::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(23, 162, 184, 0.1), transparent);
            transition: left 0.6s ease;
        }

        .PrincipleCard:hover::before {
            left: 100%;
        }

        .PrincipleCard:hover {
            transform: translateY(-8px);
            border-color: var(--accent-color);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .PrincipleIcon {
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, var(--success-color), var(--info-color));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            font-size: 1.5rem;
            border: 2px solid var(--primary-light);
        }

        .PrincipleTitle {
            font-size: 1.3rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
        }

        .PrincipleDescription {
            color: #c2c2d6;
            line-height: 1.6;
            font-size: 0.95rem;
        }

        /* Data Flow Section */
        .DataFlowSection {
            background: rgba(94, 84, 142, 0.1);
            border: 2px solid var(--primary-color);
            border-radius: 25px;
            padding: 3rem;
            margin-bottom: 3rem;
            position: relative;
            overflow: hidden;
        }

        .DataFlowSection::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(45deg, transparent 30%, rgba(238, 236, 244, 0.02) 50%, transparent 70%);
            animation: dataFlow 8s linear infinite;
            pointer-events: none;
        }

        @keyframes dataFlow {
            0% { transform: translateX(-100%) translateY(-100%); }
            100% { transform: translateX(100%) translateY(100%); }
        }

        .DataFlowTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 2rem;
            font-weight: 600;
            text-align: center;
        }

        .DataFlow {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 2rem;
            position: relative;
            z-index: 1;
        }

        .FlowStep {
            background: rgba(67, 59, 100, 0.15);
            padding: 2rem;
            border-radius: 20px;
            text-align: center;
            border: 2px solid transparent;
            transition: all 0.3s ease;
            position: relative;
        }

        .FlowStep:hover {
            border-color: var(--accent-color);
            transform: translateY(-5px);
        }

        .FlowNumber {
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: bold;
            margin: 0 auto 1rem;
            position: relative;
        }

        .FlowNumber::after {
            content: '';
            position: absolute;
            top: 50%;
            left: 100%;
            width: 50px;
            height: 2px;
            background: linear-gradient(90deg, var(--accent-color), transparent);
            transform: translateY(-50%);
            display: none;
        }

        .FlowStep:not(:last-child) .FlowNumber::after {
            display: block;
        }

        .FlowTitle {
            color: var(--primary-light);
            font-size: 1.1rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        .FlowDescription {
            color: #c2c2d6;
            font-size: 0.9rem;
            line-height: 1.5;
        }

        /* Rights Section */
        .RightsSection {
            background: rgba(67, 59, 100, 0.08);
            border: 2px solid var(--success-color);
            border-radius: 25px;
            padding: 3rem;
            text-align: center;
        }

        .RightsTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .RightsDescription {
            color: #c2c2d6;
            line-height: 1.7;
            font-size: 1.05rem;
            margin-bottom: 2rem;
        }

        .RightsGrid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 1.5rem;
            margin-top: 2rem;
        }

        .RightItem {
            background: rgba(40, 167, 69, 0.1);
            padding: 1.5rem;
            border-radius: 15px;
            border: 2px solid transparent;
            transition: all 0.3s ease;
            position: relative;
        }

        .RightItem:hover {
            border-color: var(--success-color);
            transform: translateY(-3px);
        }

        .RightIcon {
            font-size: 1.5rem;
            margin-bottom: 1rem;
            display: block;
        }

        .RightTitle {
            color: var(--primary-light);
            font-size: 1rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        .RightText {
            color: #a8a8c2;
            font-size: 0.85rem;
            line-height: 1.4;
        }

        /* Footer */
        .BottomBlock {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
            color: var(--primary-light);
            padding: 3rem 0 1rem;
            border-top: 3px solid var(--primary-color);
            position: relative;
        }

        .BottomBlock::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-image: 
                radial-gradient(circle at 30% 20%, rgba(94, 84, 142, 0.08) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(184, 51, 106, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }

        .FooterContainer {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            position: relative;
            z-index: 1;
        }

        .FooterContent {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 4rem;
            margin-bottom: 2rem;
            padding-bottom: 2rem;
            border-bottom: 2px solid rgba(94, 84, 142, 0.3);
        }

        .FooterBrand {
            max-width: 500px;
        }

        .FooterTitle {
            font-size: 1.8rem;
            color: var(--primary-light);
            margin-bottom: 1rem;
            font-weight: 600;
            line-height: 1.3;
        }

        .FooterDescription {
            color: #a8a8c2;
            font-size: 1.1rem;
            line-height: 1.6;
        }

        .FooterLinks {
            display: flex;
            justify-content: flex-end;
        }

        .LinksColumn {
            min-width: 200px;
        }

        .LinksTitle {
            font-size: 1.2rem;
            color: var(--primary-light);
            margin-bottom: 1.5rem;
            font-weight: 600;
        }

        .LinksList {
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .FooterLink {
            color: #a8a8c2;
            text-decoration: none;
            font-size: 1rem;
            transition: all 0.3s ease;
            position: relative;
            padding-left: 1rem;
        }

        .FooterLink::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--accent-color);
            opacity: 0;
            transform: translateX(-10px);
            transition: all 0.3s ease;
        }

        .FooterLink:hover {
            color: var(--primary-light);
            padding-left: 1.5rem;
        }

        .FooterLink:hover::before {
            opacity: 1;
            transform: translateX(0);
        }

        .FooterBottom {
            text-align: center;
            padding-top: 1.5rem;
        }

        .CopyrightText {
            color: #8a8aa0;
            font-size: 0.9rem;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .MainContent {
                padding-top: 100px;
            }
            
            .PrivacyHeroBlock,
            .PrivacyContentBlock {
                padding: 3rem 0;
            }
            
            .HeroContainer,
            .ContentContainer {
                padding: 0 1rem;
            }
            
            .PrivacyPrinciples {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }
            
            .DataFlow {
                grid-template-columns: 1fr;
            }
            
            .RightsGrid {
                grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            }
            
            .DataFlowSection,
            .RightsSection {
                padding: 2rem;
            }
            
            .FooterContent {
                grid-template-columns: 1fr;
                gap: 2rem;
                text-align: center;
            }
            
            .FooterLinks {
                justify-content: center;
            }
            
            .MenuItems {
                gap: 1.5rem;
            }
            
            .MainNav {
                padding: 0 1rem;
            }
            
            .HeroTitle {
                font-size: 2.5rem;
            }
            
            .PrivacyIcon {
                width: 100px;
                height: 100px;
                font-size: 2.5rem;
            }
            
            .PrivacyIconContainer {
                width: 100px;
                height: 100px;
            }

            .FlowNumber::after {
                display: none;
            }
        }

        @media (max-width: 480px) {
            .HeroTitle {
                font-size: 2rem;
            }
            
            .HeroSubtitle {
                font-size: 1.1rem;
            }
            
            .BrandTitle {
                font-size: 1.5rem;
            }
            
            .MenuItems {
                gap: 1rem;
            }
            
            .PrincipleCard {
                padding: 2rem;
            }
            
            .RightsGrid {
                grid-template-columns: 1fr;
            }
        }
    












        /* Contacts Section */
.ContactsBlock {
    padding: 6rem 0;
    background: linear-gradient(180deg, #2a2a3e 0%, #1a1a2e 100%);
    position: relative;
}

.ContactsBlock::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 20% 30%, rgba(94, 84, 142, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(184, 51, 106, 0.04) 0%, transparent 50%);
    pointer-events: none;
}

.ContactsContainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 1;
}

.ContactsHeader {
    text-align: center;
    margin-bottom: 4rem;
}

.ContactsTitle {
    font-size: 3rem;
    color: var(--primary-light);
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.ContactsSubtitle {
    font-size: 1.3rem;
    color: #a8a8c2;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.7;
}

.ContactsContent {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

/* Contact Info */
.ContactInfo {
    background: rgba(67, 59, 100, 0.1);
    border: 2px solid var(--primary-color);
    border-radius: 25px;
    padding: 3rem;
}

.InfoTitle {
    font-size: 2rem;
    color: var(--primary-light);
    margin-bottom: 2rem;
    font-weight: 600;
}

.InfoItems {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.InfoItem {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    background: rgba(94, 84, 142, 0.08);
    padding: 1.5rem;
    border-radius: 20px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.InfoItem:hover {
    border-color: var(--accent-color);
    transform: translateX(5px);
}

.InfoIcon {
    font-size: 2rem;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.InfoLabel {
    color: var(--primary-light);
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.InfoText {
    color: #c2c2d6;
    line-height: 1.6;
    margin: 0;
}

/* Contact Form */
.ContactForm {
    background: rgba(42, 42, 62, 0.4);
    border: 3px solid var(--primary-color);
    border-radius: 25px;
    padding: 3rem;
}

.FormTitle {
    font-size: 2rem;
    color: var(--primary-light);
    margin-bottom: 2rem;
    font-weight: 600;
    text-align: center;
}

.ContactFormFields {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.FormGroup {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.FormLabel {
    color: var(--primary-light);
    font-size: 1.1rem;
    font-weight: 600;
}

.FormInput,
.FormTextarea {
    background: rgba(67, 59, 100, 0.2);
    border: 2px solid var(--neutral-color);
    border-radius: 15px;
    padding: 1rem 1.5rem;
    color: var(--primary-light);
    font-size: 1rem;
    font-family: 'PT Sans', sans-serif;
    transition: all 0.3s ease;
    resize: vertical;
}

.FormInput:focus,
.FormTextarea:focus {
    outline: none;
    border-color: var(--accent-color);
    box-shadow: 0 0 0 3px rgba(184, 51, 106, 0.1);
    background: rgba(67, 59, 100, 0.3)
}

.FormInput::placeholder,
.FormTextarea::placeholder {
    color: #8a8aa0;
}

.FormTextarea {
    min-height: 120px;
    font-family: inherit;
}

.SubmitButton {
    background: linear-gradient(135deg, var(--accent-color), var(--primary-color));
    color: white;
    border: none;
    border-radius: 25px;
    padding: 1.2rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1rem;
    position: relative;
    overflow: hidden;
}

.SubmitButton::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.6s ease;
}

.SubmitButton:hover::before {
    left: 100%;
}

.SubmitButton:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(184, 51, 106, 0.3);
}

.SubmitButton:active {
    transform: translateY(-1px);
}

.ButtonText {
    position: relative;
    z-index: 1;
}

.ButtonIcon {
    position: relative;
    z-index: 1;
    font-size: 1.2rem;
    transition: transform 0.3s ease;
}

.SubmitButton:hover .ButtonIcon {
    transform: translateX(5px);
}

/* Responsive Design */
@media (max-width: 968px) {
    .ContactsContent {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    
    .ContactsTitle {
        font-size: 2.5rem;
    }
}

@media (max-width: 768px) {
    .ContactsBlock {
        padding: 4rem 0;
    }
    
    .ContactsContainer {
        padding: 0 1rem;
    }
    
    .ContactInfo {
        padding: 2rem;
    }
    
    .ContactForm {
        padding: 2rem;
    }
    
    .InfoItem {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .ContactsSubtitle {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .ContactsTitle {
        font-size: 2rem;
    }
    
    .InfoTitle {
        font-size: 1.5rem;
    }
    
    .FormTitle {
        font-size: 1.5rem;
    }
    
    .ContactInfo {
        padding: 1.5rem;
    }
    
    .ContactForm {
        padding: 1.5rem;
    }
    
    .SubmitButton {
        padding: 1rem 1.5rem;
    }
}