.blog-card,
.tutor-starter-post-card,
.wp-block-latest-posts.is-grid li {
background-color: var(--white) !important;
border-radius: var(--radius-blog) !important;
border: 1px solid rgba(0,0,0,0.05) !important;
box-shadow: 0 10px 20px rgba(0,0,0,0.03) !important;
transition: transform .3s ease, box-shadow .3s ease !important;
display: flex;
flex-direction: column;
margin-bottom: 30px !important;
}
.blog-card:hover,
.wp-block-latest-posts.is-grid li:hover {
transform: translateY(-5px);
box-shadow: 0 15px 30px rgba(78,107,255,.10) !important;
}
.blog-thumb, .post-thumbnail, .wp-block-latest-posts__featured-image {
height: 220px !important;
background-color: #E2E8F0;
position: relative;
overflow: hidden;
margin: 0 !important;
}
.blog-thumb img, .post-thumbnail img, .wp-block-latest-posts__featured-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
border-radius: 0 !important;
}
.blog-card .blog-content,
.tutor-starter-post-card .blog-content {
padding: 25px !important;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.blog-title, .entry-title, .wp-block-latest-posts__list-item a {
font-size: 1.25rem !important;
margin-bottom: 15px !important;
line-height: 1.4 !important;
font-weight: 700 !important;
color: var(--text-main) !important;
text-decoration: none !important;
display: block;
}
.blog-title a:hover, .entry-title a:hover, .wp-block-latest-posts__list-item a:hover {
color: var(--human-coral) !important;
}
.read-more-link, .more-link {
color: var(--ai-blue) !important;
font-weight: 700 !important;
text-decoration: none !important;
font-size: .9rem !important;
margin-top: auto;
display: inline-block;
} .blog-layout {
display: grid;
grid-template-columns: 360px minmax(0, 1fr);
gap: clamp(22px, 3vw, 44px);
align-items: start;
}
.blog-sidebar-inner { border-radius: 16px; }
.blog-title { margin: 0 0 14px; line-height: 1.05; font-size: clamp(2rem, 2.4vw, 2.6rem); }
.blog-meta { margin: 0 0 18px; opacity: 0.9; }
.blog-meta-line { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; margin: 0 0 6px; }
.blog-author { font-weight: 700; text-decoration: none; color: inherit; }
.blog-meta-dot { opacity: 0.5; }
.blog-single .elementor-post-info { margin: 0 0 8px !important; font-size: 14px; line-height: 1.45; }
.blog-single .elementor-post-info__item--type-date a { pointer-events: none; cursor: default; text-decoration: none; color: inherit; }
#js-reading-time { display: inline-block; margin: 6px 0 12px; color: rgba(0,0,0,0.72); font-size: 14px; } .blog-share { margin: 18px 0; }
.blog-share-title { margin: 0 0 10px; font-weight: 700; opacity: 0.9; }
.blog-share-icons { display: flex; gap: 10px; flex-wrap: wrap; }
.share-icon {
width: 34px;
height: 34px;
border-radius: 10px;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none !important;
border: none !important;
font-weight: 800;
font-size: 13px;
line-height: 1;
color: #ffffff !important;
transition: transform .12s ease, opacity .12s ease;
opacity: 0.85;
}
.share-icon:hover {
opacity: 1;
transform: translateY(-1px);
}
.share-icon[aria-label*="Facebook"],
.share-icon[href*="facebook"] { background: #1877F2 !important; }
.share-icon[aria-label*="Twitter"],
.share-icon[href*="twitter"],
.share-icon[href*="x.com"] { background: #000000 !important; } .share-icon[aria-label="Deel op X"],
.share-icon[aria-label="X"] { background: #000000 !important; }
.share-icon[aria-label*="LinkedIn"],
.share-icon[href*="linkedin"] { background: #0A66C2 !important; }
.share-icon[aria-label*="WhatsApp"],
.share-icon[aria-label*="Whatsapp"],
.share-icon[href*="whatsapp"],
.share-icon[href*="wa.me"] { background: #25D366 !important; }
.share-icon[aria-label*="mail"],
.share-icon[aria-label*="Mail"],
.share-icon[href^="mailto"] { background: #2D3436 !important; } .share-icon:not([href*="facebook"]):not([href*="twitter"]):not([href*="x.com"]):not([href*="linkedin"]):not([href*="whatsapp"]):not([href*="wa.me"]):not([href^="mailto"]) {
background: rgba(0,0,0,0.10) !important;
color: #2D3436 !important;
} .blog-toc {
border: 1px solid rgba(0,0,0,0.10);
border-radius: 14px;
overflow: hidden;
background: #fff;
}
.toc-toggle {
width: 100%;
padding: 14px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
background: #FF8066;
color: #ffffff;
border: 0;
font-weight: 800;
}
.toc-chevron { opacity: 0.85; }
.toc-list { padding: 10px 14px 14px; display: grid; gap: 8px; }
.toc-list a {
text-decoration: none !important;
color: #2D3436 !important;
opacity: 0.9;
line-height: 1.3;
}
.toc-list a:hover {
color: #FF8066 !important;
opacity: 1;
text-decoration: underline !important;
}
.toc-item { display: flex; gap: 10px; align-items: baseline; }
.toc-bullet { opacity: 0.55; } .blog-intro,
.blog-single .elementor-widget-theme-post-excerpt,
.blog-single .elementor-widget-theme-post-excerpt * { color: rgba(0,0,0,0.72); }
.blog-single .elementor-widget-theme-post-excerpt { margin: 0 0 18px !important; max-width: 78ch; }
.blog-article__content h2 { margin: 26px 0 10px; line-height: 1.2; }
.blog-article__content h3 { margin: 18px 0 10px; line-height: 1.25; }
.blog-article__content p,
.elementor-widget-theme-post-content p,
.elementor-widget-text-editor p {
margin: 0 0 1.4em !important;
max-width: 80ch;
color: rgba(0,0,0,0.86);
line-height: 1.65;
} .blog-article__content ul,
.blog-article__content ol,
.elementor-widget-theme-post-content ul,
.elementor-widget-theme-post-content ol,
.elementor-widget-text-editor ul,
.elementor-widget-text-editor ol {
margin: 0.4em 0 1.6em 1.4em !important;
padding: 0 !important;
line-height: 1.65;
color: rgba(0,0,0,0.86);
}
.blog-article__content li,
.elementor-widget-theme-post-content li,
.elementor-widget-text-editor li {
margin-bottom: 0.35em !important;
max-width: 80ch;
} .blog-article__content p:has(+ ul),
.blog-article__content p:has(+ ol),
.elementor-widget-theme-post-content p:has(+ ul),
.elementor-widget-theme-post-content p:has(+ ol),
.elementor-widget-text-editor p:has(+ ul),
.elementor-widget-text-editor p:has(+ ol) {
margin-bottom: 0.4em !important;
} .blog-article__content table,
.elementor-widget-theme-post-content table,
.elementor-widget-text-editor table {
width: 100%;
border-collapse: collapse;
margin: 1.5em 0;
font-size: .95rem;
border-radius: 12px;
overflow: hidden;
}
.blog-article__content table th,
.elementor-widget-theme-post-content table th,
.elementor-widget-text-editor table th {
background: rgba(0,0,0,0.04);
font-weight: 800;
text-align: left;
padding: 10px 14px;
border: 1px solid rgba(0,0,0,0.10);
}
.blog-article__content table td,
.elementor-widget-theme-post-content table td,
.elementor-widget-text-editor table td {
padding: 9px 14px;
border: 1px solid rgba(0,0,0,0.08);
vertical-align: top;
line-height: 1.5;
}
.blog-article__content table tr:nth-child(even) td,
.elementor-widget-theme-post-content table tr:nth-child(even) td,
.elementor-widget-text-editor table tr:nth-child(even) td {
background: rgba(0,0,0,0.02);
} :is(.elementor .elementor-widget-container, .entry-content, .single-post article, .single-post .post-content, .single-post .post-entry, .single-post .content) > h1:first-child { margin-top: 0; } .elementor-widget-text-editor p a:hover,
.elementor-widget-text-editor li a:hover,
.elementor-widget-text-editor blockquote a:hover,
.elementor-widget-theme-post-content p a:hover,
.elementor-widget-theme-post-content li a:hover,
.elementor-widget-theme-post-content blockquote a:hover,
.entry-content p a:hover,
.entry-content li a:hover,
.entry-content blockquote a:hover { text-decoration-thickness: 0.12em; }
.elementor-widget-text-editor p a:visited,
.elementor-widget-text-editor li a:visited,
.elementor-widget-theme-post-content p a:visited,
.elementor-widget-theme-post-content li a:visited,
.entry-content p a:visited,
.entry-content li a:visited { opacity: 0.9; } @media (max-width: 1200px) {
.blog-single .elementor-widget-theme-post-featured-image img,
.blog-single .elementor-widget-post-featured-image img { height: 360px !important; }
}
@media (max-width: 980px) {
.blog-layout { grid-template-columns: 1fr; }
.blog-sidebar-inner { position: static; }
}
@media (max-width: 767px) {
.blog-single .elementor-widget-theme-post-featured-image img,
.blog-single .elementor-widget-post-featured-image img { height: 240px !important; }
.blog-title, .blog-single h1.elementor-heading-title { max-width: none; }
}