/* Глобальные стили */
:root {
--primary: #2563eb;
--primary-dark: #1d4ed8;
--primary-light: #3b82f6;
--secondary: #10b981;
--secondary-dark: #059669;
--accent: #8b5cf6;
--text: #1f2937;
--text-light: #6b7280;
--bg-light: #f9fafb;
--bg-white: #ffffff;
--border: #e5e7eb;
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
--radius: 12px;
--transition: all 0.3s ease;
}
* {margin: 0;padding: 0;-webkit-box-sizing:border-box; box-sizing:border-box}
*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{width:0;display:none}
html{min-height:100%;width:100%;margin:0;-webkit-font-smoothing:subpixel-antialiased;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body {font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
line-height: 1.6;
color: var(--text);
background-color: var(--bg-light);}

a {
text-decoration: none;
color: inherit;
}
a[href^="http:"],a[href^="https:"]{color:#4169e1}
.container {
/*max-width: 1200px;*/
margin: 0 auto;
padding: 0 10px;
}

.sticky{
position: sticky;
top:70px;
}

.btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 24px;
border-radius: var(--radius);
font-weight: 600;
transition: var(--transition);
cursor: pointer;
border: none;
font-size: 16px;
}

.btn-primary {
background: var(--primary);
color: white;
}

.btn-primary:hover {
background: var(--primary-dark);
transform: translateY(-2px);
box-shadow: var(--shadow-lg);
}

.btn-secondary {
background: var(--secondary);
color: white;
}

.btn-secondary:hover {
background: var(--secondary-dark);
transform: translateY(-2px);
}

.btn-outline {
background: transparent;
color: var(--primary);
border: 2px solid var(--primary);
}

.btn-outline:hover {
background: var(--primary);
color: white;
}

.section {
padding: 80px 0;
}

.section-title {
font-size: 2.5rem;
font-weight: 700;
text-align: center;
margin-bottom: 16px;
color: var(--text);
}

.section-subtitle {
font-size: 1.125rem;
text-align: center;
color: var(--text-light);
max-width: 700px;
margin: 0 auto 60px;
}

.card {
background: var(--bg-white);
border-radius: var(--radius);
box-shadow: var(--shadow);
overflow: hidden;
transition: var(--transition);
}

.card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-lg);
}

/* Шапка */
header {
background: var(--bg-white);
box-shadow: var(--shadow);
position: sticky;
top: 0;
z-index: 1000;
}

.header-container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
}

.logo {
display: flex;
align-items: center;
gap: 12px;
font-size: 1.5rem;
font-weight: 700;
color: var(--primary);
}

.logo i {
font-size: 1.75rem;
}

nav ul {
display: flex;
list-style: none;
gap: 32px;
}

nav a {
font-weight: 500;
padding: 8px 0;
position: relative;
transition: var(--transition);
}

nav a:hover {
color: var(--primary);
}

nav a::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background: var(--primary);
transition: var(--transition);
}

nav a:hover::after {
width: 100%;
}

nav a.active {
color: var(--primary);
}
nav a.active::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: var(--primary);
transition: var(--transition);
}
.nav-actions {
display: flex;
align-items: center;
gap: 16px;
}
.nav-actions i:hover{
color:#4169e1;
}

.search-box {
position: relative;
}

.search-box input {
padding: 10px 16px 10px 40px;
border: 1px solid var(--border);
border-radius: var(--radius);
width: 240px;
font-size: 14px;
transition: var(--transition);
}

.search-box input:focus {
outline: none;
border-color: var(--primary);
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.search-box i.fa-search {
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
color: var(--text-light);
}

.searchResult{display:none;position:absolute;left:0;bottom:-360px;width:100%;height:350px;overflow-y: scroll;border-radius:var(--radius);background: var(--bg-white);box-shadow: var(--shadow);padding: 10px;overflow-x:hidden;}

.mobile-toggle {
display: block;
background: none;
border: none;
font-size: 1.5rem;
color: var(--text);
cursor: pointer;
}

.MainSlideRightMenu{box-shadow: var(--shadow);display:none;position:fixed;width:calc(400px + 4vw);max-height:100%;min-height:100vh;z-index:1000;right:0;top:0;background:rgba(255,255,255,0.95);overflow-y:scroll}.logoTopSiteMenu{width:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;padding-top:1em}.logoTopSiteMenu img{width:50px;height:auto}.insMainSlideRightMenu{min-width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:start;justify-content:start;overflow-y:scroll;padding:50px 20px}.RightCloseBtn{display:block;background:#6877e0;cursor:pointer;top:0;right:0;position:fixed;height:35px;width:35px;transition:all 0.3s;border-radius:0 0 0 1em;z-index:10}.RightCloseBtn:after{transition:all 0.3s;height:2px;width:20px;content:"";display:block;position:absolute;top:50%;left:19px;background:#fff;margin:-1px -10px;transform:rotate(-45deg)}.RightCloseBtn:before{transition:all 0.3s;height:2px;width:20px;content:"";display:block;position:absolute;top:50%;left:19px;background:#fff;margin:-1px -10px;transform:rotate(45deg)}.RightCloseBtn:hover{-webkit-filter:brightness(125%);filter:brightness(125%)}
@media (max-width:740px){.MainSlideRightMenu{width:100%}}

.compact-calculators-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px} .compact-calculator-card{padding:24px;display:flex;align-items:center;gap:16px;border-left:3px solid var(--primary);cursor:pointer;} .compact-calculator-card.health{border-left-color:var(--secondary)} .compact-calculator-card.pregnancy{border-left-color:var(--pink)} .compact-calculator-card.nutrition{border-left-color:var(--orange)} .compact-calculator-icon{width:50px;height:50px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.25em;flex-shrink:0} .compact-health .compact-calculator-icon{background:rgba(16,185,129,0.1);color:var(--secondary)} .compact-pregnancy .compact-calculator-icon{background:rgba(236,72,153,0.1);color:var(--pink)} .compact-nutrition .compact-calculator-icon{background:rgba(245,158,11,0.1);color:var(--orange)} .compact-calculator-content h3{font-size:1.125em;font-weight:600;margin-bottom:4px;color:var(--text)} .compact-calculator-content p{font-size:0.875em;color:var(--text-light)}

.compact-calculators-grid.sideMenu{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.compact-calculators-grid.sideMenu .compact-calculator-card{display:none;padding:15px 24px;}

.warning-box{background:rgba(239,68,68,0.05);border-left:4px solid #ef4444;padding:24px;border-radius:8px;margin:30px 0}.warning-box h4{color:#ef4444;margin-bottom:8px}.success-box{background:rgba(16,185,129,0.05);border-left:4px solid var(--secondary);padding:24px;border-radius:8px;margin:30px 0}.success-box h4{color:var(--secondary);margin-bottom:8px}

.success-message{background:#2ecc71;color:white;padding:15px;border-radius:10px;text-align:center;margin:20px auto}

/* Герой секция */
.hero {
background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
color: white;
padding: 100px 0;
position: relative;
overflow: hidden;
margin-bottom:20px;
border-radius: 0 0 35px 35px;
}

.hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none"><path d="M0,0 V100 Q500,80 1000,100 V0 Z" fill="rgba(255,255,255,0.1)"/></svg>');
background-size: cover;
}

.hero-content {
max-width: 800px;
margin: 0 auto;
text-align: center;
position: relative;
z-index: 1;
}

.hero-title {
font-size: 3.5rem;
font-weight: 800;
margin-bottom: 24px;
line-height: 1.2;
}

.hero-subtitle {
font-size: 1.25rem;
margin-bottom: 40px;
opacity: 0.9;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}

.hero-actions {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}


.min-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:18px;margin:20px auto;} .min-card{background:white;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.08);transition:transform 0.3s ease,box-shadow 0.3s ease;height:fit-content} .min-card:hover{transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,0.12)} .min-card-img{height:130px;overflow:hidden} .min-card-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease} .min-card:hover .min-card-img img{transform:scale(1.05)} .min-card-content{padding:15px} .min-category{display:inline-block;padding:3px 8px;background:var(--min-light);color:var(--min-primary);border-radius:3px;font-size:0.75em;font-weight:600;margin-bottom:8px} 
.min-card h3{color:var(--min-dark);margin-bottom:8px;font-size:1em;line-height:1.3;overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2;} .min-card p{color:var(--min-text);font-size:0.8em;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .min-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:0.75em;color:#9aa0a6;border-top:1px solid var(--min-border);padding-top:10px} .min-read-more{color:var(--min-primary);text-decoration:none;font-weight:600;font-size:1em;display:inline-flex;align-items:center} .min-read-more:after{content:"→";margin-left:4px;transition:transform 0.3s ease} .min-read-more:hover:after{transform:translateX(3px)} .min-featured{grid-column:span 2} .min-special{border-top:3px solid var(--min-accent)} .min-emergency{border-top:3px solid #ea4335} .min-prevention{border-top:3px solid var(--min-secondary)} @media (max-width:768px){.min-featured{grid-column:span 1} .min-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:15px} .min-card-img{height:110px} } @media (max-width:480px){.min-grid{grid-template-columns:1fr} .min-container{padding:10px} }


/*
:root{--alz-primary:#4361ee;--alz-primary-light:#4895ef;--alz-secondary:#3f37c9;--alz-success:#4cc9f0;--alz-warning:#f72585;--alz-danger:#e63946;--alz-dark:#1d3557;--alz-light:#f8f9fa;--alz-gray:#6c757d;--alz-border-radius:12px;--alz-shadow:0 10px 20px rgba(0,0,0,0.05);--alz-transition:all 0.3s ease}.alz-blood-tests-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:25px;margin:10px auto 30px}.alz-test-card{background:white;border-radius:var(--alz-border-radius);padding:25px;box-shadow:var(--alz-shadow);transition:var(--alz-transition);position:relative;overflow:hidden}.alz-test-card::before{content:'';position:absolute;top:0;left:0;width:5px;height:100%;transition:var(--alz-transition)}.alz-test-card.normal::before{background:var(--alz-success)}.alz-test-card.warning::before{background:var(--alz-warning)}.alz-test-card.critical::before{background:var(--alz-danger)}.alz-test-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px rgba(0,0,0,0.1)}.alz-test-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px}.alz-test-name{font-size:1.2em;font-weight:600;color:var(--alz-dark)}.alz-test-status{padding:5px 12px;border-radius:20px;font-size:0.8em;font-weight:600;text-transform:uppercase;color:#2eb95e}.alz-status-normal{background:rgba(76,201,240,0.15);color:var(--alz-success)}.alz-status-warning{background:rgba(247,37,133,0.15);color:var(--alz-warning)}.alz-status-critical{background:rgba(230,57,70,0.15);color:var(--alz-danger)}.alz-test-value-container{display:flex;align-items:flex-end;gap:10px;margin-bottom:15px}
.alz-test-value{font-size:1.2em;font-weight:700;cursor: pointer;}
.alz-test-value.normal:hover{color:#4169E1}
.alz-test-value.normal{color:var(--alz-success)}.alz-test-value.warning{color:var(--alz-warning)}.alz-test-value.critical{color:var(--alz-danger)}.alz-test-unit{font-size:1em;color:var(--alz-gray);margin-bottom:8px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}.alz-test-reference{font-size:0.9em;color:var(--alz-gray);margin-bottom:20px}.alz-progress-container{margin-bottom:15px}.alz-progress-label{display:flex;justify-content:space-between;margin-bottom:5px;font-size:0.85em}.alz-progress-bar{height:8px;background:#e9ecef;border-radius:4px;overflow:hidden}.alz-progress-fill{height:100%;border-radius:4px;transition:width 1s ease-in-out}.alz-progress-normal{background:var(--alz-success)}.alz-progress-warning{background:var(--alz-warning)}.alz-progress-critical{background:var(--alz-danger)}.alz-test-date{display:flex;align-items:center;gap:8px;font-size:0.85em;color:var(--alz-gray)}.alz-test-date i{font-size:0.9em}.alz-chart-container{background:white;border-radius:var(--alz-border-radius);padding:25px;margin-top:25px;box-shadow:var(--alz-shadow);display:none}.alz-chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.alz-chart-title{font-size:1.3em;font-weight:600}.alz-chart-close{background:none;border:none;font-size:1.2em;cursor:pointer;color:var(--alz-gray)}@media (max-width:1200px){.alz-stats-cards{grid-template-columns:repeat(2,1fr)}}@media (max-width:992px){.alz-sidebar{display:none}.alz-blood-tests-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:768px){.alz-stats-cards{grid-template-columns:1fr}}
*/

.calorie-tips {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    text-align: center;
    padding: 32px 24px;
	border-radius: var(--radius);
}

.calorie-tips h3 {
    color: white;
    border-bottom: none;
    margin-bottom: 16px;
}

.calorie-tips p {
    margin-bottom: 20px;
    opacity: 0.9;
}

        .quick-links {
            list-style: none;
        }

        .quick-links li {
            padding-bottom: 12px;
			margin-bottom:12px;
            border-bottom: 1px solid var(--border);
			position: relative;
        }

        .quick-links li:last-child {
            margin-bottom: 0;
            padding-bottom: 0;
            border-bottom: none;
        }

        .quick-links a {
            display: flex;
            align-items: center;
            gap: 10px;
            transition: var(--transition);
            font-size: 0.875em;
			line-height:1;
        }

        .quick-links a:hover {
            color: var(--primary);
        }

        .quick-links i {
            color: var(--primary);
            font-size: 0.75em;
        }
		.searchBadge{ color:#fff; background:#3f37c9; margin-left:5px;padding:1px 3px;border-radius:10px;font-size:.8em; }

/* Категории анализов */
.categories-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(370px, 1fr));
gap: 24px;
}

.category-card {
padding: 32px;
text-align: center;
border-top: 4px solid var(--primary);
}

.category-icon {
width: 70px;
height: 70px;
background: rgba(37, 99, 235, 0.1);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
color: var(--primary);
font-size: 1.75rem;
}

.category-card h3 {
font-size: 1.25rem;
margin-bottom: 12px;
}

.category-card p {
color: var(--text-light);
margin-bottom: 20px;
}

/* Популярные анализы */
.analyses-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
gap: 24px;
}

.analysis-card {
padding: 24px;
display: flex;
flex-direction: column;
height: 100%;
}

.analysis-header {
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 16px;
}

.analysis-icon {
width: 50px;
height: 50px;
background: rgba(16, 185, 129, 0.1);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
color: var(--secondary);
font-size: 1.25rem;
}

.analysis-badge {
background: var(--secondary);
color: white;
padding: 4px 12px;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
}

.analysis-card h3 {
font-size: 1.125rem;
margin-bottom: 12px;
}

.analysis-card p {
color: var(--text-light);
margin-bottom: 20px;
flex-grow: 1;
overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 4;
}

.analysis-footer {
display: flex;
justify-content: space-between;
align-items: center;
}

.analysis-link {
color: var(--primary);
font-weight: 600;
display: flex;
align-items: center;
gap: 6px;
transition: var(--transition);
}

.analysis-link:hover {
gap: 10px;
}

/* Хлебные крошки */
.breadcrumb {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 32px;
font-size: 0.875rem;
}

.breadcrumb a {
color: var(--text-light);
transition: var(--transition);
line-height:1;
}

.breadcrumb a:hover {
color: var(--primary);
}

.breadcrumb span {
color: var(--text);
font-weight: 500;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
}

.breadcrumb i {
font-size: 0.75rem;
color: var(--text-light);
}

/* Контент страницы */
.page-content {
display: grid;
grid-template-columns: 1fr 300px;
gap:30px;
}

.main-content {
background: var(--bg-white);
border-radius: var(--radius);
padding: 40px;
box-shadow: var(--shadow);
}

.main-content h1 {
font-size: 2.25rem;
margin-bottom: 16px;
color: var(--text);
}

.main-content img{max-width:330px;float:left;border-radius:1em;margin:0 1em .5em 0;}

.main-content h2 {
font-size: 1.5rem;
margin: 32px 0 16px;
padding-bottom: 8px;
border-bottom: 1px solid var(--border);
color: var(--text);
}

.main-content h3 {
font-size: 1.25rem;
margin: 24px 0 12px;
color: var(--text);
}

.main-content p {
margin-bottom: 16px;
color: var(--text);
}

.main-content ul, .main-content ol {
margin-bottom: 16px;
padding-left: 24px;
}

.main-content li {
margin-bottom: 8px;
}

.table-container {
width: 100%;
overflow-x: scroll;
margin: 24px 0;
border-radius: var(--radius);
box-shadow: var(--shadow);
}

table {
border-collapse: collapse;
}

th, td {
padding: 16px;
text-align: left;
border-bottom: 1px solid var(--border);
}

th {
background: var(--bg-light);
font-weight: 600;
color: var(--text);
}

tr:last-child td {
border-bottom: none;
}

.disclaimer {
background: rgba(254, 226, 226, 0.3);
border-left: 4px solid #f87171;
padding: 20px;
border-radius: 4px;
margin: 32px 0;
}

.disclaimer p {
margin: 0;
color: #7f1d1d;
}

/* Сайдбар */
.sidebar {
display: flex;
flex-direction: column;
gap: 24px;
}

.sidebar-widget {
background: var(--bg-white);
border-radius: var(--radius);
padding: 24px;
box-shadow: var(--shadow);
}

.sidebar-widget h3 {
font-size: 1.125rem;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid var(--border);
color: var(--text);
}

.sidebar-list {
list-style: none;
}

.sidebar-list li {
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid var(--border);
}

.sidebar-list li:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}

.sidebar-list a {
display: flex;
align-items: center;
gap: 10px;
transition: var(--transition);
}

.sidebar-list a:hover {
color: var(--primary);
}

.sidebar-list i {
color: var(--primary);
font-size: 0.875rem;
}

.calculator-widget {
background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
color: white;
text-align: center;
padding: 32px 24px;
}

.calculator-widget h3 {
color: white;
border-bottom: none;
margin-bottom: 16px;
}

.calculator-widget p {
margin-bottom: 20px;
opacity: 0.9;
}

/* Футер */
footer {
background: var(--text);
color: white;
padding: 60px 0 20px;
border-radius:35px 35px 0 0;
padding:20px;
}

.footer-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 40px;
margin-bottom: 40px;
}

.footer-column h3 {
font-size: 1.125rem;
margin-bottom: 24px;
position: relative;
padding-bottom: 12px;
}

.footer-column h3::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 40px;
height: 2px;
background: var(--secondary);
}

.footer-links {
list-style: none;
}

.footer-links li {
margin-bottom: 12px;
}

.footer-links a {
color: #d1d5db;
transition: var(--transition);
display: flex;
align-items: center;
gap: 8px;
}

.footer-links a:hover {
color: white;
padding-left: 4px;
}

.footer-links i {
font-size: 0.75rem;
color: var(--secondary);
}

.copyright {
text-align: center;
padding-top: 20px;
border-top: 1px solid #374151;
color: #9ca3af;
font-size: 0.875rem;
}

/* Адаптивность */
@media (max-width: 1024px) {
nav ul {
display: none;
}

.page-content {
grid-template-columns: 1fr;
}

.sidebar {
order: -1;
}
}

@media (max-width: 768px) {
.section {
padding: 60px 0;
}

.section-title {
font-size: 2rem;
}

.hero-title {
font-size: 2.5rem;
}

.search-box input {
width: 180px;
}

.hero-actions {
flex-direction: column;
align-items: center;
}

.categories-grid, .analyses-grid {
grid-template-columns: 1fr;
}
}

@media (max-width: 480px) {
.header-container {
flex-wrap: wrap;
}

.logo {
display: none;
}

.nav-actions {
order: 3;
width: 100%;
justify-content: space-between;
}

.search-box {
flex-grow: 1;
}

.search-box input {
width: 100%;
}
.main-content {
padding: 10px;
}
.page-content {
grid-template-columns: 100%;
}
}



 .blog-hero{background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);color:white;padding:100px 0;position:relative;overflow:hidden} .blog-hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none"><path d="M0,0 V100 Q500,80 1000,100 V0 Z" fill="rgba(255,255,255,0.1)"/></svg>');background-size:cover} .blog-hero-content{max-width:800px;margin:0 auto;text-align:center;position:relative;z-index:1} .blog-hero-title{font-size:3.5rem;font-weight:800;margin-bottom:24px;line-height:1.2} .blog-hero-subtitle{font-size:1.25rem;margin-bottom:40px;opacity:0.9;max-width:600px;margin-left:auto;margin-right:auto}
 .blog-main{display:grid}
 .blog-container{display:grid;grid-template-columns:2fr 350px;gap:25px;margin:10px auto 60px} .blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:30px} .blog-card{display:flex;flex-direction:column;height:100%;cursor:pointer} .blog-card-image{height:300px;width:100%;object-fit:cover} .blog-card-content{padding:24px;flex-grow:1;display:flex;flex-direction:column} .blog-card-category{display:inline-block;background:rgba(37,99,235,0.1);color:var(--primary);padding:4px 12px;border-radius:20px;font-size:0.75rem;font-weight:600;margin-bottom:12px;width:max-content} .blog-card-title{font-size:1.25rem;font-weight:700;margin-bottom:12px;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2} .blog-card-excerpt{color:var(--text-light);margin-bottom:20px;flex-grow:1;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4} .blog-card-meta{display:flex;justify-content:space-between;align-items:center;margin-top:auto;font-size:0.875rem;color:var(--text-light)} .blog-card-author{display:flex;align-items:center;gap:8px} .blog-card-author img{width:24px;height:24px;border-radius:50%;object-fit:cover} .featured-post{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:20px;cursor:pointer} .featured-post .blog-card-content{padding:40px;justify-content:center} .featured-post .blog-card-title{font-size:1.75rem} .blog-sidebar{display:flex;flex-direction:column;gap:30px} .sidebar-widget{border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)} .sidebar-widget h3{font-size:1.125rem;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);} .categories-list{list-style:none} .categories-list li{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border)} .categories-list li:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none} .categories-list a{display:flex;justify-content:space-between;align-items:center;transition:var(--transition)} .categories-list a:hover{color:var(--primary)} .categories-list span{background:var(--bg-light);padding:2px 8px;border-radius:12px;font-size:0.75rem} .popular-posts{list-style:none;cursor:pointer} .popular-post{display:flex;gap:12px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border)} .popular-post:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none} .popular-post-image{width:60px;height:60px;border-radius:8px;object-fit:cover;flex-shrink:0} .popular-post-content h4{font-size:0.875rem;margin-bottom:4px;line-height:1.4} .popular-post-content .date{font-size:0.75rem;color:var(--text-light)} .tags-widget{display:flex;flex-wrap:wrap;gap:8px} .tag{display:inline-block;background:var(--bg-light);color:var(--text);padding:6px 12px;border-radius:20px;font-size:0.75rem;transition:var(--transition)} .tag:hover{background:var(--primary);color:white} .newsletter-widget{background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);color:white;text-align:center;padding:32px 24px} .newsletter-widget h3{color:white;border-bottom:none;margin-bottom:16px} .newsletter-widget p{margin-bottom:20px;opacity:0.9} .newsletter-form{display:flex;flex-direction:column;gap:12px} .newsletter-form input{padding:12px 16px;border:none;border-radius:var(--radius);font-size:14px} .pagination{display:flex;justify-content:center;gap:5px;margin-top:60px} .pagination a,.pagination span{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius);font-weight:600;transition:var(--transition)} .pagination a{background:var(--bg-white);color:var(--text);box-shadow:var(--shadow)} .pagination a:hover{background:var(--primary);color:white} .pagination .current{background:var(--primary);color:white} .pagination .prev-next{width:auto;padding:0 16px} @media (max-width:1024px){.blog-container{grid-template-columns:1fr} .featured-post{grid-template-columns:1fr} .featured-post .blog-card-image{height:300px} } @media (max-width:768px){.section{padding:60px 0} .section-title{font-size:2rem} .blog-hero-title{font-size:2.5rem} .blog-grid{grid-template-columns:1fr} } @media (max-width:480px){.blog-card-meta{flex-direction:column;align-items:flex-start;gap:8px} }
 
 
  .article-container{display:grid;grid-template-columns:1fr 400px;gap:30px;margin:40px 0} .article-main{background:var(--bg-white);border-radius:var(--radius);padding:40px;box-shadow:var(--shadow)} .article-header{margin-bottom:32px} .article-category{display:inline-block;background:rgba(37,99,235,0.1);color:var(--primary);padding:6px 16px;border-radius:20px;font-size:0.875em;font-weight:600;margin-bottom:16px} .article-title{font-size:2.5em;font-weight:800;line-height:1.2;margin-bottom:16px;color:var(--text)} .article-meta{display:flex;align-items:center;gap:20px;color:var(--text-light);font-size:0.875em} .article-author{display:flex;align-items:center;gap:10px} .article-author img{width:40px;height:40px;border-radius:50%;object-fit:cover} .article-stats{display:flex;align-items:center;gap:15px} .article-stat{display:flex;align-items:center;gap:5px} .article-hero-image{width:100%;height:400px;object-fit:cover;border-radius:var(--radius);margin-bottom:32px} .article-content{font-size:1.125em;line-height:1.7} .article-content h2{font-size:1.75em;margin:40px 0 20px;color:var(--text)} .article-content h3{font-size:1.375em;margin:32px 0 16px;color:var(--text)} .article-content p{margin-bottom:20px} .article-content ul,.article-content ol{margin-bottom:20px;padding-left:24px} .article-content li{margin-bottom:8px} .article-content blockquote{border-left:4px solid var(--primary);padding-left:20px;margin:30px 0;font-style:italic;color:var(--text-light)} .info-box{background:rgba(37,99,235,0.05);border-left:4px solid var(--primary);padding:24px;border-radius:8px;margin:30px 0} .info-box h4{font-size:1.125em;margin-bottom:8px;color:var(--primary)} .warning-box{background:rgba(239,68,68,0.05);border-left:4px solid #ef4444;padding:24px;border-radius:8px;margin:30px 0} .warning-box h4{font-size:1.125em;margin-bottom:8px;color:#ef4444} .article-tags{display:flex;flex-wrap:wrap;gap:10px;margin:40px 0;padding-top:30px;border-top:1px solid var(--border)} .tag{display:inline-block;background:var(--bg-light);color:var(--text);padding:6px 16px;border-radius:20px;font-size:0.875em;transition:var(--transition)} .tag:hover{background:var(--primary);color:white} .article-actions{display:flex;justify-content:space-between;align-items:center;margin:40px 0;padding:30px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)} .social-share{display:flex;align-items:center;gap:15px} .share-text{font-weight:600;color:var(--text-light)} .share-buttons{display:flex;gap:10px} .share-btn{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg-light);color:var(--text);transition:var(--transition)} .share-btn:hover{transform:translateY(-2px)} .share-btn.facebook:hover{background:#3b5998;color:white} .share-btn.twitter:hover{background:#1da1f2;color:white} .share-btn.linkedin:hover{background:#0077b5;color:white} .share-btn.telegram:hover{background:#0088cc;color:white} .action-buttons{display:flex;gap:15px} .article-sidebar{display:flex;flex-direction:column;gap:30px} .sidebar-widget{border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)} .sidebar-widget h3{font-size:1.125em;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);} .author-widget{text-align:center} .author-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;margin:0 auto} .author-name{font-size:1.125em;font-weight:600;margin-bottom:8px} .author-bio{color:var(--text-light);font-size:0.875em;margin-bottom:16px} .table-of-contents{position:sticky;top:100px} .toc-list{list-style:none} 
 .toc-list li{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border)}
 .toc-list li a.active{color:#4169E1} 
 .toc-list li:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none} .toc-list a{display:flex;align-items:center;gap:10px;transition:var(--transition);font-size:0.875em} .fa a:hover{color:var(--primary)} .toc-list i{color:var(--primary);font-size:0.75em} .related-articles{list-style:none} 
 .related-article{display:flex;gap:12px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border);cursor: pointer;} 
 .related-article:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none} .related-article-image{width:80px;height:80px;border-radius:8px;object-fit:cover;flex-shrink:0} 
 .related-article-content h4{font-size:0.875em;margin-bottom:4px;line-height:1.4}
 .related-article-content h4:hover{color:#4169e1} 
 .related-article-content .date{font-size:0.75em;color:var(--text-light)} .recommended-section{margin:80px 0} .section-title{font-size:2em;font-weight:700;margin-bottom:40px;color:var(--text)} .articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:30px} 
.article-card{display:flex;flex-direction:column;height:100%;cursor: pointer;}
.article-card-image{height:200px;width:100%;object-fit:cover} .article-card-content{padding:24px;flex-grow:1;display:flex;flex-direction:column} .article-card-category{display:inline-block;background:rgba(37,99,235,0.1);color:var(--primary);padding:4px 12px;border-radius:20px;font-size:0.75em;font-weight:600;margin-bottom:12px;width:max-content} 
 .article-card-title{font-size:1.25em;font-weight:700;margin-bottom:12px;line-height:1.4;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
 .article-card-title:hover{color:#4169e1;transition:all ease .3s} 
 .article-card-excerpt{color:var(--text-light);margin-bottom:20px;flex-grow:1;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;} .article-card-meta{display:flex;justify-content:space-between;align-items:center;margin-top:auto;font-size:0.875em;color:var(--text-light)} @media (max-width:1024px){.article-container{grid-template-columns:1fr} .article-sidebar{order:-1} } @media (max-width:768px){.section{padding:60px 0} .article-title{font-size:2em} .article-actions{flex-direction:column;gap:20px;align-items:flex-start} .articles-grid{grid-template-columns:1fr} } @media (max-width:480px){.article-container{grid-template-columns:100%} .article-meta{flex-direction:column;align-items:flex-start;gap:10px} .article-main{padding:24px} }