/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */


.imstp-container {
  display: flex;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  align-items: flex-start;
}

.imstp-main-content { flex: 1 1 68%; min-width: 0; }
.imstp-sidebar { flex: 1 1 28%; max-width: 320px; }

.imstp-hero-image { margin-bottom: 24px; }
.imstp-hero-img { width: 100%; height: auto; border-radius: 8px; display: block; }

.imstp-post-title { font-size: 32px; font-weight: 800; margin-bottom: 12px; line-height: 1.3; }

.imstp-post-meta { display: flex; gap: 16px; font-size: 14px; color: #666; margin-bottom: 24px; }
.imstp-post-meta span { display: inline-flex; align-items: center; }

.imstp-post-content { font-size: 17px; line-height: 1.75; color: #333; }
.imstp-post-content h2 { font-size: 24px; font-weight: 700; margin: 32px 0 12px; }
.imstp-post-content h3 { font-size: 20px; font-weight: 700; margin: 24px 0 10px; }
.imstp-post-content a { color: #22C55E; text-decoration: underline; }
.imstp-post-content img { max-width: 100%; height: auto; border-radius: 6px; margin: 16px 0; }

.imstp-post-tags { margin-top: 24px; }
.tag-pill {
  display: inline-block; background: #f1f5f9; color: #0B2545;
  padding: 6px 14px; border-radius: 999px; font-size: 13px;
  margin: 4px 6px 4px 0; text-decoration: none;
}

.imstp-author-box {
  display: flex; gap: 16px; align-items: center;
  background: #f8fafc; border-radius: 8px; padding: 20px; margin-top: 32px;
}
.imstp-author-box img { border-radius: 50%; }
.imstp-author-box h4 { margin: 0 0 6px; }
.imstp-author-box p { margin: 0; font-size: 14px; color: #555; }

/* Sidebar widgets */
.widget {
  background: #0B2545; border-radius: 10px;
  padding: 24px; margin-bottom: 24px; color: #fff;
}
.widget-title {
  font-size: 15px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; margin: 0 0 16px; color: #4ADE80;
}

.social-share-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.share-btn {
  flex: 1 1 40%; text-align: center; padding: 10px 0; border-radius: 6px;
  background: rgba(255,255,255,0.08); color: #fff; font-size: 13px; text-decoration: none;
}
.share-btn:hover { background: #22C55E; }

.recent-posts-list { list-style: none; margin: 0; padding: 0; }
.recent-posts-list li { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
.recent-posts-list li:last-child { border-bottom: none; }
.recent-posts-list a { color: #fff; text-decoration: none; display: block; }
.recent-title { display: block; font-size: 14px; font-weight: 600; line-height: 1.4; }
.recent-date { display: block; font-size: 12px; color: #94A3B8; margin-top: 4px; }

.categories-list { list-style: none; margin: 0; padding: 0; }
.categories-list li { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
.categories-list a { color: #fff; text-decoration: none; font-size: 14px; }
.categories-list a:hover { color: #4ADE80; }

/* Responsive */
@media (max-width: 900px) {
  .imstp-container { flex-direction: column; }
  .imstp-sidebar { max-width: 100%; }
}