/* === ПОЛНЫЙ CSS ДЛЯ КОНЦЕПЦИИ "НЕОНОВЫЙ ДАШБОРД" v2 === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root {
    --font-family: 'Inter', sans-serif;
    --color-bg: #0A192F;
    --color-surface: rgba(27, 38, 59, 0.6);
    --color-surface-hover: rgba(42, 58, 94, 0.7);
    --color-border: rgba(136, 146, 176, 0.2);
    --color-text-primary: #E6F1FF;
    --color-text-secondary: #8892B0;
    --color-accent-teal: #64FFDA;
    --color-accent-blue: #57CBFF;
    --color-accent-orange: #FFCA80;
    --color-accent-pink: #FF80BF;
    --shadow-glow: 0 0 30px -5px rgba(100, 255, 218, 0.2);
    --border-radius: 12px;
    --transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-family);background-color:var(--color-bg);color:var(--color-text-primary);line-height:1.6;-webkit-font-smoothing:antialiased}
.infographic-page{max-width:1400px;margin:0 auto;padding:4rem 2rem}
.infographic-header{text-align:center;margin-bottom:5rem}
.infographic-header h1{font-size:3.25rem;font-weight:800;letter-spacing:-0.05em;color:var(--color-text-primary);margin-bottom:.5rem}
.infographic-header p{font-size:1.25rem;color:var(--color-text-secondary);max-width:800px;margin:auto}
.widget-section{margin-bottom:5rem}
.widget-section-title{font-size:2rem;font-weight:700;color:var(--color-text-primary);padding-bottom:1rem;margin-bottom:2.5rem;border-bottom:1px solid var(--color-border)}
.section-description { max-width: 800px; font-size: 1.1rem; color: var(--color-text-secondary); margin: -1.5rem 0 2.5rem 0; }

/* Виджеты "Преимущества", "Характеристика", "SWOT" из прошлого шага (без изменений, уже идеальны) */
.advantages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1.5rem}
.advantage-card{background:var(--color-surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--border-radius);border:1px solid var(--color-border);padding:1.5rem;display:flex;gap:1.25rem;align-items:flex-start;transition:var(--transition)}
.advantage-card:hover{transform:translateY(-5px);border-color:rgba(100,255,218,.3);box-shadow:var(--shadow-glow)}
.advantage-card .icon{flex-shrink:0;color:var(--color-accent-teal);background-color:rgba(100,255,218,.1);width:48px;height:48px;border-radius:8px;display:flex;align-items:center;justify-content:center}
.advantage-card .icon svg{width:28px;height:28px;stroke-width:2}
.advantage-card h3{font-size:1.1rem;font-weight:600;color:var(--color-text-primary);margin-bottom:.25rem}
.advantage-card p{font-size:.95rem;color:var(--color-text-secondary);line-height:1.5}
.advantage-card p strong{font-weight:600;color:var(--color-accent-teal)}
.characteristics-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:stretch}
.metrics-grid{display:flex;flex-direction:column;gap:1.5rem}
.metric-card{background:var(--color-surface);backdrop-filter:blur(10px);border-radius:var(--border-radius);border:1px solid var(--color-border);padding:2rem;text-align:center;transition:var(--transition);display:flex;flex-direction:column;justify-content:center}
.metric-card:hover{transform:scale(1.02);border-color:rgba(87,203,255,.4);box-shadow:0 0 20px rgba(87,203,255,.15)}
.metric-card .value{font-size:3rem;font-weight:800;color:var(--color-accent-blue);line-height:1}
.metric-card .label{font-size:1.1rem;color:var(--color-text-secondary);margin-top:.5rem}
.location-widget{background:var(--color-surface);backdrop-filter:blur(10px);border-radius:var(--border-radius);border:1px solid var(--color-border);padding:1rem}
.location-widget img{width:100%;border-radius:8px;margin-bottom:1rem;aspect-ratio:16/10;object-fit:cover;
filter:saturate(0.5) brightness(1.1) contrast(1.1) opacity(.8)
}
.location-widget p{padding:0 .5rem .5rem;font-size:1.05rem;color:var(--color-text-secondary)}
.swot-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);gap:1.5rem}
.swot-card{background:var(--color-surface);backdrop-filter:blur(10px);border-radius:var(--border-radius);padding:2rem;border:1px solid var(--color-border);position:relative;overflow:hidden; border-top: 3px solid;}
.swot-card .title{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}
.swot-card ul{list-style:none;padding-left:0}
.swot-card li{font-size:1rem;color:var(--color-text-secondary);padding-left:1.75rem;position:relative;margin-bottom:.75rem}
.swot-card li::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:50%}
.swot-card.strengths, .swot-card.opportunities { border-color: var(--color-accent-teal); }
.swot-card.strengths .title, .swot-card.opportunities .title { color: var(--color-accent-teal); }
.swot-card.strengths li::before, .swot-card.opportunities li::before { background-color: var(--color-accent-teal); box-shadow: 0 0 5px var(--color-accent-teal); }
.swot-card.weaknesses, .swot-card.threats { border-color: var(--color-accent-pink); }
.swot-card.weaknesses .title, .swot-card.threats .title { color: var(--color-accent-pink); }
.swot-card.weaknesses li::before, .swot-card.threats li::before { background-color: var(--color-accent-pink); box-shadow: 0 0 5px var(--color-accent-pink); }

/* --- НОВЫЕ СТИЛИ: Соц-эконом показатели --- */
.socio-economic-layout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
    align-items: flex-start;
}
.chart-widget {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2rem;
	height: 100%;
}
.employment-widget-grid {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.employment-card {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    text-align: center;
}
.employment-card .icon { color: var(--color-accent-blue); margin-bottom: 1rem; }
.employment-card .icon svg { width: 36px; height: 36px; stroke-width: 1.5; margin: auto; }
.employment-card .value { font-size: 2.25rem; font-weight: 800; color: var(--color-text-primary); line-height: 1.1; }
.employment-card .label { font-size: 1rem; font-weight: 500; color: var(--color-text-secondary); margin-bottom: 0.75rem; }
.employment-card .dynamic { font-size: 0.85rem; font-weight: 600; color: var(--color-accent-green); background-color: rgba(100, 255, 218, 0.1); padding: 0.25rem 0.5rem; border-radius: 6px; }

/* --- НОВЫЕ СТИЛИ: Ресурсная база --- */
.resource-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.resource-card {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2rem;
    text-align: center;
}
.resource-card-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--color-border);
}
.resource-card .icon { color: var(--color-primary); }
.resource-card .icon svg { width: 40px; height: 40px; }
.resource-card .category { font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--color-text-secondary); font-size: 0.8rem; }
.resource-card .title { font-size: 1.25rem; font-weight: 600; color: var(--color-text-primary); }
.resource-card-features {
    list-style: none; padding: 0;
    text-align: left;
}
.resource-card-features li {
    font-size: 1rem;
    color: var(--color-text-secondary);
    margin-bottom: 0.75rem;
    position: relative;
    padding-left: 1.5rem;
}
.resource-card-features li::before {
    content: '✓';
    color: var(--color-accent-teal);
    font-weight: 800;
    position: absolute;
    left: 0;
}
.resource-card-features li strong {
    color: var(--color-text-primary);
    font-weight: 600;
}








/* === НОВЫЕ СТИЛИ: Реализуемые проекты === */
.projects-table {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: var(--border-radius);
    border: 1px solid var(--color-border);
    padding: 1rem 0;
}

.projects-table-header,
.project-row {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr 1fr;
    gap: 1.5rem;
    align-items: center;
    padding: 0 2rem;
}

.projects-table-header {
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.project-row {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--color-border);
    transition: var(--transition);
}
.project-row:last-child {
    border-bottom: none;
}
.project-row:hover {
    background-color: var(--color-surface-hover, rgba(42, 58, 94, 0.7));
    transform: scale(1.01);
}

.project-company {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-weight: 600;
    color: var(--color-text-primary);
}
.project-company .icon {
    flex-shrink: 0;
    color: var(--color-accent-blue);
    background-color: rgba(87, 203, 255, 0.1);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.project-company .icon svg {
    width: 22px;
    height: 22px;
}

.project-field {
    font-size: 0.95rem;
    color: var(--color-text-secondary);
}

.project-investment {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-text-primary);
    text-align: right;
}

.project-status {
    text-align: right;
}

.status-badge {
    display: inline-block;
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
    background-color: rgba(100, 255, 218, 0.1);
    color: var(--color-accent-teal);
    border: 1px solid rgba(100, 255, 218, 0.2);
}
.status-badge.in-process {
    background-color: rgba(255, 202, 128, 0.1);
    color: var(--color-accent-orange);
    border-color: rgba(255, 202, 128, 0.2);
}

/* === НОВЫЕ СТИЛИ: Инвестиционные ниши === */
.niches-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.niche-card {
    background: linear-gradient(160deg, var(--color-surface) 0%, #152238 100%);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2.5rem;
    text-align: center;
    transition: var(--transition);
}
.niche-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
    border-color: var(--color-accent-teal);
}

.niche-card .icon {
    margin: 0 auto 1.5rem auto;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent-teal), var(--color-accent-blue));
    color: var(--color-bg);
}
.niche-card .icon svg {
    width: 32px;
    height: 32px;
}

.niche-card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 1.5rem;
}
.niche-card ul {
    list-style: none;
    padding: 0;
    text-align: left;
}
.niche-card li {
    font-size: 1rem;
    color: var(--color-text-secondary);
    margin-bottom: 1rem;
    padding-left: 1.75rem;
    position: relative;
}
.niche-card li::before {
    content: '→';
    position: absolute;
    left: 0;
    color: var(--color-accent-teal);
    font-weight: 800;
    transition: var(--transition);
}
.niche-card:hover li::before {
    transform: translateX(4px);
}




/* === НОВЫЕ СТИЛИ: Меры господдержки === */
.support-layout {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
    align-items: flex-start;
}
.funds-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}
.fund-card {
    display: block;
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2rem;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition);
}
.fund-card:hover {
    transform: scale(1.05);
    border-color: rgba(100, 255, 218, 0.4);
    box-shadow: var(--shadow-glow);
}
.fund-card img {
    max-width: 80%;
    max-height: 80px;
    filter: brightness(0) invert(1) opacity(0.8); /* Делаем логотипы белыми и полупрозрачными */
    transition: var(--transition);
}
.fund-card:hover img {
    filter: none; /* Возвращаем оригинальный цвет при наведении */
}

.ministries-list {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2rem;
    height: 100%;
}
.ministries-list h4 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 1.5rem;
}
.ministries-list ul {
    list-style: none;
    padding: 0;
}
.ministries-list li {
    font-size: 1rem;
    color: var(--color-text-secondary);
    padding-left: 1.75rem;
    position: relative;
    margin-bottom: 1.25rem;
    font-weight: 500;
}
.ministries-list li::before {
    content: '';
    width: 8px;
    height: 8px;
    background-color: var(--color-accent-blue);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    box-shadow: 0 0 8px var(--color-accent-blue);
}

/* === НОВЫЕ СТИЛИ: Ключевые контакты === */
.contacts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.5rem;
}
.contact-card {
    background: var(--color-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
    padding: 2rem;
    text-align: center;
}
.contact-card img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto 1.5rem auto;
    border: 3px solid var(--color-border);
    filter: grayscale(1);
    transition: var(--transition);
}
.contact-card:hover img {
    filter: grayscale(0);
    border-color: var(--color-accent-teal);
    box-shadow: var(--shadow-glow);
}
.contact-card .name {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-text-primary);
}
.contact-card .role {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-accent-teal);
    margin-bottom: 0.5rem;
}
.contact-card .title {
    font-size: 0.9rem;
    color: var(--color-text-secondary);
}
.contact-card .contacts {
    margin-top: 1.5rem;
    border-top: 1px solid var(--color-border);
    padding-top: 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
}
.contact-card .contacts a {
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: var(--transition);
}
.contact-card .contacts a:hover {
    color: var(--color-accent-teal);
}

/* === НОВЫЕ СТИЛИ: Блок скачивания === */
.download-section {
    margin-top: 6rem;
    padding: 3rem;
    text-align: center;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius);
}
.download-section h3 {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin-bottom: 0.75rem;
}
.download-section p {
    font-size: 1.1rem;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
}
.download-section .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1rem;
}
.download-section .btn svg {
    width: 22px;
    height: 22px;
}

/* Адаптивность для новых блоков */
@media(max-width: 1024px){
    .support-layout { grid-template-columns: 1fr; }
    .funds-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .funds-grid { grid-template-columns: 1fr; }
}













/* Адаптивность для новых блоков */
@media(max-width: 1200px){
    .projects-table-header {
        display: none; /* Скрываем заголовки на узких экранах, оставляем данные */
    }
    .project-row {
        grid-template-columns: 1fr 1fr; /* Перестраиваем таблицу в 2 колонки */
        grid-template-areas: 
            "company status"
            "field investment";
        padding-top: 1rem; padding-bottom: 1rem;
    }
    .project-company { grid-area: company; }
    .project-field { grid-area: field; margin-top: 0.5rem; }
    .project-investment { grid-area: investment; text-align: right; align-self: end; }
    .project-status { grid-area: status; align-self: start; }
}

@media(max-width: 1024px){
    .niches-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .project-row { grid-template-columns: 1fr; grid-template-areas: "company" "status" "investment" "field"; }
    .project-investment, .project-status { text-align: left; margin-top: 0.5rem; }
}











/* --- Адаптивность --- */
@media(max-width: 1200px){
    .socio-economic-layout { grid-template-columns: 1fr; }
}
@media(max-width: 1024px){
    .characteristics-layout, .swot-grid, .resource-grid { grid-template-columns: 1fr; }
}
@media(max-width: 768px){
    .infographic-page{padding:2rem 1rem}
    .infographic-header h1{font-size:2.25rem}
    .infographic-header p{font-size:1.1rem}
    .widget-section-title{font-size:1.5rem}
    .advantages-grid{grid-template-columns:1fr}
    .swot-grid, .resource-grid {gap:1rem}
}