/**
Theme Name: WalkwelTech-Blog
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: walkweltech-blog
Template: astra
*/
/* Main Theme Styles */
/* Redirect Styles */
/* No specific styles needed for redirect function */

/* @import url('https://blog.walkwel.info/wp-content/uploads/2025/04/tiempos-font-family-1741149792-0.zip') */

/* Posts Archive by Month Shortcode Styles */
*{
	object-fit:cover !important;
}
:root {
  --blue-gradient: linear-gradient( 90deg, #2F3F93 3%, #3B54A1 26%, #5684C1 59%, #85DAF9 100%);
}
.blue-text-gradient {
  background: var(--blue-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.heading{
font-size:72px !important;
}
.posts-archive-list {
    list-style: none; 
    padding: 0;
}
#banner{
    background: url('images/case-bg-new.png') no-repeat center center;
    background-size: cover;
}
/* Featured Posts Shortcode Styles */
.blog-section {
/*             padding: 40px 0; */
				font-family: 'Urbanist' !important;
	padding: 0 80px 40px 80px !important;
		
/* 			height:100vh !important; */
        }
			 .blog-section  h3{
			font-size: 32px !important;
			line-height: 42px;
			overflow: hidden;
		}
		.blog-section p{
			   	font-family: 'Urbanist' !important;
				font-style: normal  !important;
				font-weight: 400  !important;
				font-size: 18px !important;
				line-height: 26px  !important;
				color: #6D6D6D  !important;
		}

        .blog-heading {
           	font-family: 'Urbanist' !important;
				font-style: normal;
				font-weight: 600 !important;
				font-size: 72px !important;
				line-height: 55px;
				color: #000000;
				line-height: 200% !important;
			
        }

        .blog-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 60px !important;
        }

        .blog-post {
            background: #fff;
          padding-bottom: 20px;
/*             box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); */
			border:1px solid #ccccdd !important;
            border-radius: 8px;
        }

        .blog-post img {
            width: 100%;
            height: 50vh;
/*             border-radius: 8px; */
			object-fit: cover;
			border:none !important;
			
        }

        .blog-post h3 {
			padding: 0 20px !important; 
/*             font-size: 20px; */
            font-weight: 400 !important;
            margin-top: 10px;
        }

        .blog-post p {
			padding: 0 20px !important; 
            font-size: 16px;
            color: #555;
        }

        .blog-post span {
			   	font-family: 'Urbanist' !important;
				padding: 0 20px !important;                       
			    font-weight: 700;
				font-size: 16px !important;
				line-height: 26px;
				color: #656565;
        }
		.blog-post a{
			text-decoration:none !important;
		}
		.blog-post .author{
			color:blue !important;
			padding-left:5px !important;
			 text-transform: capitalize !important;
			text-decoration:underline;
			
		}
		

        /* Grid layout */
        .blog-post:nth-child(1),
        .blog-post:nth-child(3) {
            grid-column: span 1; /* Takes 1 column */
        }

        .blog-post:nth-child(2),
        .blog-post:nth-child(4) {
            grid-column: span 2; /* Takes 2 columns */
        }

        /* Responsive adjustments */
   @media (max-width: 1024px) {
    .blog-section {
        padding: 0 40px 40px 40px !important;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .blog-grid {
        grid-template-columns: repeat(2, 1fr); /* Switch to 2-column layout */
    }

    .blog-heading {
        font-size: 40px !important;
        line-height: 48px;
    }

    .blog-section h3 {
        font-size: 28px !important;
        line-height: 38px;
    }
}

@media (max-width: 1030px) {
    .blog-section {
        padding: 0 20px 40px 20px !important;
    }

    .blog-grid {
        grid-template-columns: 1fr; /* Force single-column layout */
    }

    .blog-heading {
        font-size: 36px !important;
        line-height: 44px;
    }

    .blog-section h3 {
        font-size: 24px !important;
        line-height: 32px;
    }

    .blog-section p {
        font-size: 16px !important;
        line-height: 24px !important;
    }

    .blog-post:nth-child(1),
    .blog-post:nth-child(2),
    .blog-post:nth-child(3),
    .blog-post:nth-child(4) {
        grid-column: span 1; /* Ensures each post takes full width */
    }
}
@media (min-width: 1120px) and (max-width: 1401px) {
 .blog-title{
        font-size: 25px !important;
 }
 .blog-image img {
    height: 200px;
}
.blog-title a {
    font-size: 20px !important;
}
.section-heading{
    font-size: 52px !important;
}
.blog-heading{
    font-size: 62px !important;
}
.ai-featured-section h2 {
    font-size: 30px !important;
}
}
@media (min-width: 769px) and (max-width: 1025px) {
    .form-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: start !important;
    margin-bottom: 30px !important;
    gap: 35px;
}
.star-img {
    /* Width: 80px; */
    position: relative;
    top: -20px;
    left: 0;
}
.ai-featured-section h2 {
    font-size: 24px;
}
.subheading {
    font-size: 18px !important;
}
.section-heading{
    font-size: 36px !important;
}
.blog-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 40px !important;
}
.blog-title {
       font-size: 26px !important;
}
.blog-title a {
    font-size: 20px !important;
}
br{
    display: none !important;
}
.form-group label {
    font-size: 15px !important;
}
.form-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
}
.create-together-form .wpcf7 input:not([type=submit]), .wpcf7 select, .wpcf7 textarea {
    width: 100% !important;
}
}
@media (min-width: 481px) and (max-width: 769px) {
.star-img {
    /* Width: 80px; */
    position: relative;
    top: -20px;
    left: 0;
}
.ai-featured-section h2 {
    font-size: 24px;
}
.subheading {
    font-size: 18px !important;
}
.section-heading{
    font-size: 36px !important;
}
.blog-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 40px !important;
}
.blog-title {
       font-size: 26px !important;
}
.blog-title a {
    font-size: 20px !important;
}
br{
    display: none !important;
}
.form-group label {
    font-size: 15px !important;
}
.form-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
}
.create-together-form .wpcf7 input:not([type=submit]), .wpcf7 select, .wpcf7 textarea {
    width: 100% !important;
}
}
@media (max-width: 480px) {
    .blog-section {
        padding: 0 10px 40px 10px !important;
    }

    .blog-grid {
        grid-template-columns: 1fr; /* Single-column layout */
    }

    .blog-post img {
        height: auto; /* Allow dynamic height */
        max-width: 100%;
		object-fit:cover !important;
    }

    .blog-heading {
        font-size: 28px !important;
        line-height: auto;
    }
.subheading{
    font-size: 18px !important;
}
    .blog-section h3 {
        font-size: 20px !important;
        line-height: 28px;
    }

    .blog-section p {
        font-size: 14px !important;
        line-height: 22px !important;
    }

    .blog-post {
        padding: 10px !important;
    }
    .ai-featured-section h2, .section-heading {
        font-size: 24px !important;
        line-height: auto;
    }
    .blog-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: unset;
    margin-bottom: 40px;
}
.blog-title a{
    font-size: 18px !important;
    line-height: 22px !important;
}
.blog-title {
font-size: 25px !important;
margin-bottom: 20px !important;
}
.blog-grid {
    gap: 20px !important;
}
.form-row{
    gap: 20px !important;
}
}
/* Custom Blog Shortcode Styles */
.custom-blog-section {
/*     padding: 0 80px 40px 80px !important; */
  	font-family: 'Urbanist' !important;
    max-height: 1200px;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.custom-blog-section h3 {
    font-size: 32px !important;
    line-height: 42px;
    overflow: hidden;
}

.custom-blog-section p {
    font-family: 'Urbanist' !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    line-height: 26px !important;
    color: #6D6D6D !important;
}

.custom-blog-heading {
    	font-family: 'Urbanist' !important;
    font-style: normal;
    font-weight: 300 !important;
    font-size: 46px !important;
    line-height: 55px;
    color: #000000;
}
  .custom-blog-grid-three {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;
		
        }

        .custom-blog-grid-two {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 20px;
        }

.custom-blog-post {
    background: #fff;
    padding: 0 0 20px 0;
    border: 1px solid #cccccc !important;
    border-radius: 8px;
    margin-bottom: 20px !important;
    padding-bottom: 20px !important;
}

.custom-blog-post img {
    width: 100%;
    height: 50vh;
    border-radius: 8px;
    object-fit: cover;
}

.custom-blog-post h3 {
    font-size: 20px;
    font-weight: 400 !important;
    margin-top: 10px;
    padding: 0 20px;
}
.custom-blog-post p{
	padding: 0 20px !important;
}
.custom-blog-post span {
   	font-family: 'Urbanist' !important;
    font-weight: 700;
    font-size: 16px !important;
    line-height: 26px;
    color: #656565;
	padding: 0 20px !important;
   
}

.custom-blog-post a {
    text-decoration: none !important;
	color:black !important;
}

.custom-blog-post .author,
.custom-blog-post .authors {
    color: blue !important;
    padding-left: 5px !important;
    text-transform: capitalize !important;
    text-decoration: underline;
}
@media (max-width: 1024px) {
    .custom-blog-section {
        padding: 0 40px 40px 40px !important;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .custom-blog-grid-three,
    .custom-blog-grid-two {
        grid-template-columns: repeat(2, 1fr); /* Switch to 2-column layout */
    }

    .custom-blog-heading {
        font-size: 40px !important;
        line-height: 48px;
    }

    .custom-blog-section h3 {
        font-size: 28px !important;
        line-height: 38px;
    }
}

@media (max-width: 1030px) {
    .custom-blog-section {
        padding: 0 20px 40px 20px !important;
    }

    .custom-blog-grid-three,
    .custom-blog-grid-two {
        grid-template-columns: 1fr; /* Force single-column layout */
    }

    .custom-blog-heading {
        font-size: 36px !important;
        line-height: 44px;
    }
	.container h2{
		margin-left: 81px !important;
	}
    .custom-blog-section h3 {
        font-size: 24px !important;
        line-height: 32px;
		
    }

    .custom-blog-section p {
        font-size: 16px !important;
        line-height: 24px !important;
    }
}

@media (max-width: 480px) {
    .custom-blog-section {
        padding: 0 10px 40px 10px !important;
    }

    .custom-blog-grid-three,
    .custom-blog-grid-two {
        grid-template-columns: 1fr; /* Single-column layout */
    }

    .custom-blog-post img {
        height: auto; /* Allow dynamic height */
        max-width: 100%;
		object-fit:cover !important; 
    }

    .custom-blog-heading {
        font-size: 32px !important;
        line-height: 40px;
    }

    .custom-blog-section h3 {
        font-size: 20px !important;
        line-height: 28px;
    }

    .custom-blog-section p {
        font-size: 14px !important;
        line-height: 22px !important;
    }

    .custom-blog-post {
        padding: 10px !important;
    }
}

/* Featured Post Shortcode Styles */
.featured-post {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    align-content: center !important;
    text-align: center !important;
    padding: 20px !important;
    color: white !important;
    	font-family: 'Urbanist' !important;
    margin: auto !important;
    border-radius: 10px !important;
}

.featured-post h2 a {
    color: white;
    text-decoration: none !important;
    font-size: 54px !important;
    font-weight: 300;
 	font-family: 'Urbanist' !important;
}

.featured-post {
    color: #fff !important;
   	font-family: 'Urbanist' !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    margin: 0;
    gap: 2px;
}

.featured-meta {
    display: block;
    color: #fff;
   	font-family: 'Urbanist' !important;
    font-size: 18px;
}

.featured-image img {
    border-radius: 10px;
	height: 659px !important;
    width: 1058px !important;
	object-fit:cover !important;
	
}

.heading {
    width: 900px !important;
   
}
.heading h2{
    color: white;
    text-decoration: none !important;
    font-size: 54px !important;
    font-weight: 300;
 	font-family: 'Urbanist' !important;
    line-height: 48.9px;
}
.featured-label {
    padding: 10px 19px;
    background-color: #2e3c91;
    border-radius: 26px;
    color: #fff;
    	font-family: 'Urbanist' !important;
    font-size: 18px;
    font-weight: 400;
}

.time-t {
    display: flex;
    align-items: center;
    gap: 20px;
}

.blog-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 35px;
    max-width: 864px;
    text-align: center;
}
@media (max-width: 1024px) {
   
 

    .featured-post h2 a {
        font-size: 42px !important;
    }

    .featured-post {
        font-size: 18px !important;
    }
}

@media (max-width: 768px) {
    
   
    .featured-post h2 a {
        font-size: 36px !important;
    }

    .featured-post {
        font-size: 16px !important;
    }

    .featured-label {
        font-size: 16px;
        padding: 8px 16px;
    }
}

@media (max-width: 480px) {
    .featured-post {
        padding: 15px !important;
    }

    .featured-post h2 a {
        font-size: 28px !important;
    }

    .featured-meta {
        font-size: 16px;
    }

    .featured-label {
        font-size: 14px;
        padding: 6px 12px;
    }

    .time-t {
        flex-direction: column;
        gap: 10px;
    }
}
@media (max-width: 1024px) {
    .heading {
        width: 80% !important; /* Reduce width for tablets */
        max-width: 800px !important;
    }
}

@media (max-width: 768px) {
    .heading {
        width: 90% !important; /* Adjust width for smaller tablets */
        max-width: 600px !important;
    }
}

@media (max-width: 480px) {
    .heading {
        width: 100% !important; /* Full width on mobile */
        max-width: 100% !important;
    }
}

@media (max-width: 1095px) {
    .featured-image img {
               height: 498px !important;
        min-width: 744px !important;
    }
}

@media (max-width: 768px) {
    .featured-image img {
        min-width: 100% !important; /* Ensure full width */
        min-height: auto !important;
        max-height: 400px !important; /* Reduce height for better fit */
    }
}

@media (max-width: 480px) {
    .featured-image img {
        min-width: 100% !important;
        min-height: auto !important;
        max-height: 300px !important; /* Reduce height for smaller screens */
    }
}

/* Full Blog Preview Styles */
.article-content {
    background: white;
    color: black;
   	font-family: 'Urbanist' !important;
    font-size: 18px;
    line-height: 1.8;
    text-align: justify;
    padding: 40px;
    max-width: 900px;
    margin: auto;
    border-radius: 10px;
}

.article-sidebar {
    margin-top: 40px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}

.article-sidebar h3 {
    font-size: 22px;
    margin-bottom: 10px;
}

.article-sidebar ul {
    list-style: none;
    padding: 0;
}

.article-sidebar ul li {
    margin: 5px 0;
}

.article-sidebar ul li a {
    color: #2e3c91;
    text-decoration: none;
}
@media (max-width: 1024px) {
    .article-content {
        padding: 30px; /* Reduce padding */
        font-size: 16px; /* Slightly smaller text */
    }

    .article-sidebar {
        padding: 15px;
    }

    .article-sidebar h3 {
        font-size: 20px;
    }
}

@media (max-width: 768px) {
    .article-content {
        padding: 20px; /* Further reduce padding */
        font-size: 16px;
    }

    .article-sidebar {
        padding: 15px;
        margin-top: 20px; /* Reduce spacing */
    }

    .article-sidebar h3 {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .article-content {
        padding: 15px; /* Even smaller padding for mobile */
        font-size: 14px; /* Adjust text size */
    }

    .article-sidebar {
        padding: 10px;
    }

    .article-sidebar h3 {
        font-size: 16px;
    }

    .article-sidebar ul li {
        margin: 3px 0; /* Reduce spacing between items */
    }
}

.author-section {
    gap: 382px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
   	font-family: 'Urbanist' !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    color: white;
    padding: 10px 20px;
    position: relative;
}

.author-section::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    border-bottom: 2px dashed white;
}

.author-info {
    font-size: 14px;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
}

.author-name {
    font-weight: bold;
}

.share-icons {
    display: flex;
    gap: 8px;
}

.share-icons a {
    display: inline-block;
    width: 24px;
    height: 24px;
    
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
	color: black;
    background: #ffffffa3;
}
.site-content{
    background-color: black;
}
.share-icons a img {
    width: 16px;
    height: 16px;
	object-fit:cover !important;
}
@media (max-width: 1024px) {
    .author-section {
        gap: 100px; /* Reduce space between elements */
        padding: 10px 15px; /* Adjust padding */
    }

    .author-info {
        font-size: 14px;
        width: auto; /* Allow it to adjust naturally */
    }
}

@media (max-width: 768px) {
    .author-section {
        flex-direction: column;
        align-items: center;
        gap: 15px; /* Reduce gap further */
        text-align: center;
        padding: 10px;
    }

    .author-info {
        align-items: center; /* Center align content */
        width: 100%; /* Allow full width */
    }

    .share-icons {
        justify-content: center; /* Center align icons */
    }
}

@media (max-width: 480px) {
    .author-section {
        padding: 10px 5px;
        gap: 10px;
    }

    .share-icons a {
        width: 20px; /* Make icons slightly smaller */
        height: 20px;
    }

    .share-icons a img {
        width: 14px;
        height: 14px;
		object-fit:cover !important;
    }

    .author-info {
        font-size: 12px; /* Reduce font size for small screens */
    }
}

/* Featured Posts Preview Shortcode Styles */
.wp-custom-section {
	font-family: 'Urbanist' !important;
    margin:42px !important; 
   
	padding: 0px 20px 40px 20px !important;
}

.wp-custom-section h2 {
    
    margin-bottom: 40px !important;
}

.wp-custom-section p {
  	font-family: 'Urbanist' !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    line-height: 26px !important;
    color: #6D6D6D !important;
}

.wp-custom-heading {
	font-family: 'Urbanist' !important;
    font-style: normal;
    font-weight: 300 !important;
    font-size: 46px !important;
    line-height: 55px;
    color: #000000;
    line-height: 40px;
}

.wp-custom-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.wp-custom-post {
    background: #fff;
    padding-bottom: 20px;
    border: 1px solid #ccccdd !important;
    border-radius: 8px;
}

.wp-custom-post img {
    width: 100%;
    height: 20vw;
/*     object-fit: contain !important; */
    border: none !important;
}

.wp-custom-post h3 {
    padding: 0 20px !important;
    font-weight: 400 !important;
    font-size: 30px !important;
    margin-top: 10px;
}

.wp-custom-post p {
    padding: 0 20px !important;
    font-size: 20px !important;
    color: #555;
}

.wp-custom-post span {
  	font-family: 'Urbanist' !important;
    padding: 0 20px !important;
    font-weight: 700;
    font-size: 18px !important;
    line-height: 26px;
    color: #656565;
}

.wp-custom-post a {
    text-decoration: none !important;
}

.wp-custom-post .wp-custom-author {
    color: blue !important;
    padding-left: 5px !important;
    text-transform: capitalize !important;
    text-decoration: underline;
}
@media (max-width: 1024px) {
    .wp-custom-grid {
        grid-template-columns: repeat(2, 1fr); /* Two columns for tablets */
    }

    .wp-custom-post h3 {
        font-size: 26px !important;
    }

    .wp-custom-post p {
        font-size: 18px !important;
    }
}

@media (max-width: 768px) {
    .wp-custom-grid {
        grid-template-columns: 1fr; /* One column for smaller screens */
    }

    .wp-custom-section {
        padding: 0 20px 40px 20px !important; /* Adjust padding */
    }

    .wp-custom-heading {
        font-size: 36px !important;
        line-height: 44px;
    }

    .wp-custom-section h3 {
        font-size: 24px !important;
        line-height: 32px;
    }

    .wp-custom-section p {
        font-size: 16px !important;
        line-height: 24px !important;
    }

    .wp-custom-post img {
        height: auto; /* Let images adjust dynamically */
		object-fit:cover !important;
    }
}

@media (max-width: 480px) {
    .wp-custom-section {
        padding: 0 10px 40px 10px !important;
    }

    .wp-custom-grid {
        grid-template-columns: 1fr; /* Single column layout */
    }

    .wp-custom-heading {
        font-size: 32px !important;
        line-height: 40px;
    }

    .wp-custom-section h3 {
        font-size: 20px !important;
        line-height: 28px;
    }

    .wp-custom-section p {
        font-size: 14px !important;
        line-height: 22px !important;
    }

    .wp-custom-post h3 {
        font-size: 22px !important;
    }

    .wp-custom-post p {
        font-size: 16px !important;
    }
}

/* Post Headings Shortcode Styles */
.article {
    padding: 15px;
    margin-bottom: 20px;
    background-color: #f9f9f9 !important;

    border-radius: 8px;
    width:20px !important;
}

.article-heading {
    font-size: 20px;
    margin-bottom: 10px;
    color: #2E3C91 !important;
}

.post-headings {
    list-style: none !important;
    padding: 0 !important;
   	font-family: 'Urbanist' !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 20px !important;
}
 ul{
    margin: 0 0 0 0 !important;
 	font-family: 'Urbanist' !important;
}
.post-headings li {
    margin-bottom: 8px !important;
   	font-family: 'Urbanist' !important;
}

.post-headings li a {
    text-decoration: none !important;
    color: black !important;
    font-style: normal !important;
    font-weight: 400 !important;
}

.post-headings li a:hover {
    text-decoration: underline;
}

/* Click to copy - footer */


.copy-text button {
            background-color: transparent;
            position: relative;
            cursor: pointer;
			padding:10px !important;
        }
        .copy-text button::before {
            content: "Copied";
            position: absolute;
            top: -45px;
            right: 0px;
            background: #2E3C91;
            padding: 8px 10px;
            border-radius: 20px;
            font-size: 15px;
            display: none;
         	font-family: 'Urbanist' !important;
            font-weight: 500;
            font-size: 14px;
            line-height: 19px;
            color: #FFFFFF;
        }
        .copy-text button::after {
            content: "";
            position: absolute;
            top: -20px;
            right: 25px;
            width: 10px;
            height: 10px;
            background: #2E3C91;
            transform: rotate(45deg);
            display: none;
        }
        .copy-text.active button::before,
        .copy-text.active button::after {
            display: block;
        }
        .copy-text input {
			padding:0px !important;
            background-color: transparent !important;
            	font-family: 'Urbanist' !important;
            font-weight: 500;
            font-size: 24px;
            line-height: 29px;
            border: 0 !important;
            color: #FFFFFF;
            box-shadow: none;
            width: 100%;
        }
        .copy-text input:focus {
            outline: unset !important;
        }
		
		
		.email-copy{
			
			margin:0px !important;
				font-family: 'Urbanist' !important;
			font-style: normal !important;
			font-weight: 600 !important;
			font-size: 24px !important;
			line-height: 20px !important;

			color: #FFFFFF !important;

					}

                    .ast-narrow-container .site-content > .ast-container {
                        max-width: unset !important;
                            margin-left: 0 !important; 
                            margin-right: 0 !important;
                            padding-left: 0 !important; 
                            padding-right: 0 !important ;
                    }  
                    
                    .site-content .ast-container {
                    display: block !important;
                    background-color: white !important;
                ;
                    }

                    aside{
                        padding: 15px !important;
                        margin-bottom: 20px !important;
                        /* background-color: #f9f9f9 !important; */
                        border-radius: 8px !important;
                        /* flex: 0 0 340 !important; */
                        margin-left:20px !important;
                        margin:20px !important;
                       width:340px !important;
                        padding: 20px !important;
                        border-radius: 12px !important;
                        
                        height: fit-content;
                        position: sticky;
                        top: 10px;
                        align-self: flex-start;
                    }
                    .article-custom{
                        background-color:#f9f9f9 !important;
                        box-shadow: 9px 3px 15px rgb(0 0 0 / 5%) !important;
                        padding: 40px !important;
                        ;
						margin-bottom:40px !important;
                        border-radius: 12px !important;
                    }
                    .article-custom h2{
                        font-size: 1.875rem !important;
                        font-weight: 600 !important;
                        line-height: 1.3em !important;
						margin-bottom:40px !important;

                    }
                    *, :after, :before {
                        box-sizing: border-box !important;
                    }
                    .archive{
                        background-color: #F5F4D66E !important;
                        box-shadow: 9px 3px 15px rgb(0 0 0 / 5%) !important;
                        padding: 40px !important;
                        border-radius: 12px !important;
                    }
                    /* Desktop styles */
.article-layout {
    display: flex;
    margin: 40px 40px;
  }

  .article-layout aside {
    flex: 0 0 250px;
    margin-right: 40px;
    position: sticky;
    top: 100px;
  }
  
  .article-content {
    flex: 1;
    background: white;
    color: black;
  	font-family: 'Urbanist' !important;
    font-size: 18px;
    line-height: 1.8;
    text-align: justify;
    padding: 20px;
    border-radius: 10px;
  }
  .sidebar{
    display: flex;  margin: 40px 40px;
  }
  /* Mobile responsiveness */
  @media (max-width: 768px) {
    .sidebar{
      flex-direction: column;
      margin: 20px;
    }
  
    .sidebar aside {
      position: static; /* removes sticky */
      margin-right: 0;
      width:400px !important;
      margin-bottom: 20px;
      padding:0 !important;

    }
  }
  .archive h2{
    color: #111111;
              	font-family: 'Urbanist' !important;
                font-style: normal !important;
                font-weight: 600 !important;
                font-size: 20px !important;
                line-height: 30px !important;
                margin-bottom: 12px !important;
  }