Many blog changes
This commit is contained in:
Peter
@@ -35,17 +35,27 @@ body {
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
font-family: inherit;
|
||||
line-height: 1.4;
|
||||
white-space: nowrap;
|
||||
min-height: 48px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #179e83;
|
||||
color: white;
|
||||
color: white !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
transform: translateY(-2px);
|
||||
background: #11725e;
|
||||
box-shadow: 0 4px 16px rgba(23, 158, 131, 0.3);
|
||||
color: white !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@@ -780,6 +790,41 @@ body {
|
||||
animation-delay: var(--animation-delay, 0s);
|
||||
}
|
||||
|
||||
/* Blog responsive styles */
|
||||
@media (max-width: 768px) {
|
||||
.featured-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.featured-article.main-feature {
|
||||
grid-row: span 1;
|
||||
}
|
||||
|
||||
.articles-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.newsletter-form .form-group {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.article-title {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
|
||||
.article-author {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.blog-categories h2,
|
||||
.blog-featured h2,
|
||||
.blog-recent h2 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
@media (max-width: 768px) {
|
||||
.nav-menu {
|
||||
@@ -930,6 +975,648 @@ img {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* Blog-specific styles */
|
||||
.blog-categories {
|
||||
padding: 80px 0;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
.blog-categories h2 {
|
||||
text-align: center;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 60px;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.blog-featured {
|
||||
padding: 80px 0;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.blog-featured h2 {
|
||||
text-align: center;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 60px;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.featured-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr 1fr;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.featured-article {
|
||||
background: white;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
|
||||
border: 1px solid #f0f0f0;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.featured-article:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.featured-article.main-feature {
|
||||
grid-row: span 2;
|
||||
}
|
||||
|
||||
.featured-article .article-image {
|
||||
height: 200px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.featured-article.main-feature .article-image {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.featured-article .article-image img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.featured-article:hover .article-image img {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.featured-article .article-content {
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.article-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
margin-bottom: 15px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.article-meta .category {
|
||||
background: #179e83;
|
||||
color: white;
|
||||
padding: 5px 12px;
|
||||
border-radius: 15px;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.article-meta time {
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.article-meta .read-time {
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.featured-article h3 {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.featured-article h3 a {
|
||||
color: #1a1a1a;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.featured-article h3 a:hover {
|
||||
color: #179e83;
|
||||
}
|
||||
|
||||
.featured-article p {
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.article-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
padding-top: 15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.article-footer .read-more {
|
||||
color: #179e83;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.article-footer .read-more:hover {
|
||||
color: #144784;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.blog-recent {
|
||||
padding: 80px 0;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
.blog-recent h2 {
|
||||
text-align: center;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 60px;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.articles-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
|
||||
gap: 30px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.article-card {
|
||||
background: white;
|
||||
padding: 30px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
|
||||
border: 1px solid #f0f0f0;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.article-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.article-card h3 {
|
||||
font-size: 1.3rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.article-card h3 a {
|
||||
color: #1a1a1a;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.article-card h3 a:hover {
|
||||
color: #179e83;
|
||||
}
|
||||
|
||||
.article-card p {
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.blog-pagination {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.pagination-info {
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.blog-newsletter {
|
||||
padding: 80px 0;
|
||||
background: linear-gradient(135deg, #144784 0%, #179e83 100%);
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.newsletter-content h2 {
|
||||
font-size: 2.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.newsletter-content p {
|
||||
font-size: 1.2rem;
|
||||
margin-bottom: 40px;
|
||||
opacity: 0.95;
|
||||
max-width: 600px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.newsletter-form .form-group {
|
||||
display: flex;
|
||||
max-width: 500px;
|
||||
margin: 0 auto 20px;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.newsletter-form input {
|
||||
flex: 1;
|
||||
padding: 15px 20px;
|
||||
border: none;
|
||||
border-radius: 50px;
|
||||
font-size: 16px;
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.newsletter-form .btn {
|
||||
padding: 15px 30px;
|
||||
border-radius: 50px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.newsletter-privacy {
|
||||
font-size: 14px;
|
||||
opacity: 0.8;
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.newsletter-privacy a {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Blog article styles */
|
||||
.blog-article {
|
||||
padding: 40px 0 80px;
|
||||
background: white;
|
||||
position: relative;
|
||||
clear: both;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.blog-article .container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.article-header {
|
||||
max-width: 800px;
|
||||
margin: 0 auto 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.article-title {
|
||||
font-size: 3rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 20px;
|
||||
color: #1a1a1a;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.article-subtitle {
|
||||
font-size: 1.3rem;
|
||||
color: #666;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.article-author {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 30px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.author-info strong {
|
||||
color: #1a1a1a;
|
||||
font-weight: 600;
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.author-info p {
|
||||
color: #666;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.article-share a {
|
||||
color: #179e83;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
padding: 8px 16px;
|
||||
border: 1px solid #179e83;
|
||||
border-radius: 6px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.article-share a:hover {
|
||||
background: #179e83;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.article-image {
|
||||
max-width: 1000px;
|
||||
margin: 0 auto 40px;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.article-image img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.article-toc {
|
||||
max-width: 800px;
|
||||
margin: 0 auto 40px;
|
||||
background: #f8f9fa;
|
||||
padding: 30px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #e1e5e9;
|
||||
}
|
||||
|
||||
.article-toc h2 {
|
||||
font-size: 1.3rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.article-toc ol {
|
||||
list-style: none;
|
||||
counter-reset: toc-counter;
|
||||
}
|
||||
|
||||
.article-toc li {
|
||||
counter-increment: toc-counter;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.article-toc li::before {
|
||||
content: counter(toc-counter) ". ";
|
||||
color: #179e83;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.article-toc a {
|
||||
color: #144784;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.article-toc a:hover {
|
||||
color: #179e83;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.article-content {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
line-height: 1.7;
|
||||
background: white;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.article-content pre {
|
||||
background: #f8f9fa;
|
||||
border: 1px solid #e9ecef;
|
||||
border-radius: 8px;
|
||||
padding: 0;
|
||||
margin: 25px 0;
|
||||
overflow-x: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.article-content pre code {
|
||||
display: block;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 20px;
|
||||
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'Courier New', monospace;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
color: #495057;
|
||||
white-space: pre;
|
||||
overflow-x: auto;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.article-content code {
|
||||
background: #f1f3f4;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'Courier New', monospace;
|
||||
font-size: 0.9em;
|
||||
color: #d63384;
|
||||
}
|
||||
|
||||
.article-content pre code {
|
||||
background: transparent;
|
||||
padding: 20px;
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
/* Code block copy button */
|
||||
.article-content pre {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.article-content pre:hover::before {
|
||||
content: '📋 Copy';
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
background: #179e83;
|
||||
color: white;
|
||||
padding: 5px 10px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.article-content pre[data-copied]:hover::before {
|
||||
content: '✅ Copied!';
|
||||
background: #10b981;
|
||||
}
|
||||
|
||||
.article-content pre:hover {
|
||||
border-color: #179e83;
|
||||
box-shadow: 0 2px 8px rgba(23, 158, 131, 0.1);
|
||||
}
|
||||
|
||||
.article-content h2 {
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
margin: 40px 0 20px;
|
||||
color: #1a1a1a;
|
||||
border-bottom: 2px solid #179e83;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.article-content h3 {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin: 30px 0 15px;
|
||||
color: #144784;
|
||||
}
|
||||
|
||||
.article-content p {
|
||||
margin-bottom: 20px;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.article-content ul,
|
||||
.article-content ol {
|
||||
margin-bottom: 20px;
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
.article-content li {
|
||||
margin-bottom: 8px;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.article-content a {
|
||||
color: #179e83;
|
||||
text-decoration: underline;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.article-content a:hover {
|
||||
color: #144784;
|
||||
}
|
||||
|
||||
.callout-box {
|
||||
background: #f8f9fa;
|
||||
border-left: 4px solid #179e83;
|
||||
padding: 20px;
|
||||
margin: 30px 0;
|
||||
border-radius: 0 8px 8px 0;
|
||||
}
|
||||
|
||||
.callout-box.legal-warning {
|
||||
background: #fff3cd;
|
||||
border-left-color: #f59e0b;
|
||||
}
|
||||
|
||||
.callout-box h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 15px;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.comparison-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 20px;
|
||||
margin: 30px 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.comparison-item {
|
||||
background: white;
|
||||
padding: 25px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #e1e5e9;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.comparison-item h4 {
|
||||
margin-bottom: 15px;
|
||||
color: #144784;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.best-practice-box {
|
||||
background: linear-gradient(135deg, #e8f5f3 0%, #f0f9ff 100%);
|
||||
border: 1px solid #179e83;
|
||||
border-radius: 12px;
|
||||
padding: 25px;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.best-practice-box h3 {
|
||||
margin-top: 0;
|
||||
color: #144784;
|
||||
}
|
||||
|
||||
/* Image optimization */
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* Lazy loading support */
|
||||
img[loading="lazy"] {
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
img[loading="lazy"].loaded {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* WebP support with fallbacks */
|
||||
picture img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Focus improvements for keyboard navigation */
|
||||
a:focus-visible,
|
||||
button:focus-visible,
|
||||
input:focus-visible,
|
||||
textarea:focus-visible {
|
||||
outline: 2px solid #179e83;
|
||||
outline-offset: 2px;
|
||||
box-shadow: 0 0 0 4px rgba(23, 158, 131, 0.1);
|
||||
}
|
||||
|
||||
/* Reading progress bar */
|
||||
.reading-progress {
|
||||
position: fixed;
|
||||
top: 70px;
|
||||
left: 0;
|
||||
width: 0%;
|
||||
height: 3px;
|
||||
background: linear-gradient(90deg, #179e83, #144784);
|
||||
z-index: 999;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
/* Category link styles */
|
||||
.category-link {
|
||||
background: #179e83;
|
||||
color: white !important;
|
||||
padding: 5px 12px;
|
||||
border-radius: 15px;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
transition: background 0.3s ease;
|
||||
}
|
||||
|
||||
.category-link:hover {
|
||||
background: #144784;
|
||||
color: white !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.loading::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
@@ -2171,6 +2858,134 @@ a:focus-visible {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Related Articles Section */
|
||||
.related-articles {
|
||||
padding: 60px 0;
|
||||
background: #f8f9fa;
|
||||
border-top: 1px solid #e1e5e9;
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.related-articles h2 {
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 40px;
|
||||
color: #1a1a1a;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.related-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 30px;
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.related-card {
|
||||
background: white;
|
||||
padding: 30px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
|
||||
border: 1px solid #e1e5e9;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.related-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.related-card h3 {
|
||||
font-size: 1.3rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.related-card h3 a {
|
||||
color: #1a1a1a;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.related-card h3 a:hover {
|
||||
color: #179e83;
|
||||
}
|
||||
|
||||
.related-card p {
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.related-card .read-time {
|
||||
color: #179e83;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Button text visibility fix */
|
||||
.btn * {
|
||||
color: inherit;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
.btn:visited,
|
||||
.btn:link,
|
||||
.btn:active {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-primary:visited,
|
||||
.btn-primary:link,
|
||||
.btn-primary:active {
|
||||
color: white !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-primary:focus {
|
||||
color: white !important;
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
/* Expert Consultation CTA */
|
||||
.expert-consultation-cta {
|
||||
background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
|
||||
border: 2px solid #179e83;
|
||||
border-radius: 12px;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
margin: 40px 0;
|
||||
clear: both;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.expert-consultation-cta h3 {
|
||||
color: #144784;
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 15px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.expert-consultation-cta p {
|
||||
color: #666;
|
||||
margin-bottom: 25px;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.expert-consultation-cta .btn {
|
||||
font-size: 1.1rem;
|
||||
padding: 15px 30px;
|
||||
min-width: 200px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Testimonials Grid */
|
||||
.testimonials {
|
||||
padding: 80px 0;
|
||||
@@ -2380,4 +3195,37 @@ a:focus-visible {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.related-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.related-card {
|
||||
padding: 25px 20px;
|
||||
}
|
||||
|
||||
.expert-consultation-cta {
|
||||
padding: 30px 20px;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.article-content pre {
|
||||
margin: 20px -20px;
|
||||
border-radius: 0;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.article-content pre code {
|
||||
padding: 15px 20px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.article-content pre:hover::before {
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
font-size: 11px;
|
||||
padding: 4px 8px;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user