/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.12.7.1778280394
Updated: 2026-05-08 22:46:34

*/

/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/
Description: Astra child theme customized for Waqas Waziri — Real Estate Consultant.
Tags: custom-menu,custom-logo,blog,one-column,two-columns,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,rtl-language-support,theme-options,threaded-comments,translation-ready
Version: 4.12.7
Updated:  2026-05-13
*/

/* =========================================================
   WAQAS WAZIRI — BLOG & SINGLE POST STYLES
   Drop-in stylesheet for Astra Child. Scoped via .aww- prefix
   to avoid clashing with Elementor pages on the rest of the site.
   ========================================================= */

/* Force Astra's content wrapper to full width ONLY on blog + single
   posts + archives so the custom templates render edge-to-edge.
   Elementor pages on the rest of the site are not affected. */
.blog .site-content .ast-container,
.single-post .site-content .ast-container,
.archive .site-content .ast-container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.blog #primary,
.single-post #primary,
.archive #primary {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    float: none !important;
}

.blog #main,
.single-post #main,
.archive #main {
    padding: 0 !important;
    margin: 0 !important;
}

.blog .entry-header,
.single-post .entry-header,
.archive .entry-header,
.blog .post-thumb-img-content,
.single-post .post-thumb-img-content {
    display: none !important;
}


/* Google Fonts — Fraunces for editorial display, Manrope for body */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,400&family=Manrope:wght@400;500;600;700&display=swap');

:root {
    --aww-primary: #142a3a;
    --aww-primary-dark: #0b1a26;
    --aww-accent: #c89b3c;
    --aww-accent-hover: #b1862a;
    --aww-bg: #ffffff;
    --aww-bg-soft: #f7f4ee;
    --aww-bg-alt: #faf8f3;
    --aww-text: #1a1a1a;
    --aww-text-muted: #6b6b6b;
    --aww-text-light: #8a8a8a;
    --aww-border: #e6e2d8;
    --aww-border-light: #f0ede5;
    --aww-shadow-sm: 0 2px 8px rgba(20, 42, 58, 0.04);
    --aww-shadow-md: 0 8px 24px rgba(20, 42, 58, 0.08);
    --aww-shadow-lg: 0 16px 48px rgba(20, 42, 58, 0.12);
    --aww-radius: 4px;
    --aww-radius-lg: 8px;
    --aww-display: 'Fraunces', Georgia, 'Times New Roman', serif;
    --aww-body: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --aww-container: 1180px;
    --aww-article: 740px;
}

/* ----- Base ----- */
.aww-blog-wrapper,
.aww-single-wrapper {
    font-family: var(--aww-body);
    color: var(--aww-text);
    background: var(--aww-bg);
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.aww-blog-wrapper *,
.aww-single-wrapper * {
    box-sizing: border-box;
}

.aww-container {
    max-width: var(--aww-container);
    margin: 0 auto;
    padding: 0 24px;
}

.aww-container-narrow {
    max-width: var(--aww-article);
    margin: 0 auto;
    padding: 0 24px;
}

/* ----- Buttons ----- */
.aww-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    font-family: var(--aww-body);
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.01em;
    text-decoration: none;
    border-radius: var(--aww-radius);
    transition: all 0.25s ease;
    cursor: pointer;
    border: none;
    line-height: 1;
}

.aww-btn-primary {
    background: var(--aww-accent);
    color: #fff;
}

.aww-btn-primary:hover {
    background: var(--aww-accent-hover);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--aww-shadow-md);
}

.aww-btn-dark {
    background: var(--aww-primary);
    color: #fff;
}

.aww-btn-dark:hover {
    background: var(--aww-primary-dark);
    color: #fff;
}

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

.aww-btn-outline:hover {
    border-color: var(--aww-primary);
    background: var(--aww-primary);
    color: #fff;
}

.aww-btn-arrow {
    font-family: var(--aww-body);
    font-weight: 600;
    font-size: 14px;
    color: var(--aww-primary);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: gap 0.2s ease;
}

.aww-btn-arrow::after {
    content: "→";
    transition: transform 0.2s ease;
}

.aww-btn-arrow:hover {
    color: var(--aww-accent);
    gap: 12px;
}

/* =========================================================
   BLOG ARCHIVE / INDEX PAGE
   ========================================================= */

.aww-blog-header {
    background: var(--aww-bg-soft);
    padding: 100px 0 80px;
    text-align: center;
    border-bottom: 1px solid var(--aww-border-light);
    position: relative;
    overflow: hidden;
}

.aww-blog-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 20% 30%, rgba(200, 155, 60, 0.08) 0, transparent 50%),
                      radial-gradient(circle at 80% 70%, rgba(20, 42, 58, 0.04) 0, transparent 50%);
    pointer-events: none;
}

.aww-blog-header-inner {
    position: relative;
    max-width: 760px;
    margin: 0 auto;
    padding: 0 24px;
}

.aww-eyebrow {
    display: inline-block;
    font-family: var(--aww-body);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--aww-accent);
    margin-bottom: 20px;
    padding: 6px 14px;
    background: rgba(200, 155, 60, 0.1);
    border-radius: 100px;
}

.aww-blog-header h1 {
    font-family: var(--aww-display);
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    font-weight: 500;
    line-height: 1.1;
    color: var(--aww-primary);
    margin: 0 0 20px;
    letter-spacing: -0.02em;
}

.aww-blog-header h1 em {
    font-style: italic;
    color: var(--aww-accent);
    font-weight: 400;
}

.aww-blog-header p {
    font-size: 1.125rem;
    color: var(--aww-text-muted);
    line-height: 1.6;
    margin: 0;
}

/* Category filter bar */
.aww-cat-filter {
    background: #fff;
    border-bottom: 1px solid var(--aww-border-light);
    padding: 20px 0;
    position: sticky;
    top: 0;
    z-index: 10;
}

.aww-cat-filter-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.aww-cat-filter a {
    font-family: var(--aww-body);
    font-size: 13px;
    font-weight: 500;
    color: var(--aww-text-muted);
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 100px;
    border: 1px solid var(--aww-border);
    transition: all 0.2s ease;
    letter-spacing: 0.02em;
}

.aww-cat-filter a:hover,
.aww-cat-filter a.active {
    background: var(--aww-primary);
    color: #fff;
    border-color: var(--aww-primary);
}

/* Post grid */
.aww-blog-main {
    padding: 80px 0;
    background: var(--aww-bg);
}

/* Featured (first) post */
.aww-featured-post {
    margin-bottom: 80px;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 60px;
    align-items: center;
}

.aww-featured-post .aww-post-image {
    aspect-ratio: 4/3;
    overflow: hidden;
    border-radius: var(--aww-radius-lg);
    box-shadow: var(--aww-shadow-md);
}

.aww-featured-post .aww-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.aww-featured-post:hover .aww-post-image img {
    transform: scale(1.04);
}

.aww-featured-post .aww-post-cat {
    color: var(--aww-accent);
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 16px;
    display: inline-block;
}

.aww-featured-post h2 {
    font-family: var(--aww-display);
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 500;
    line-height: 1.15;
    color: var(--aww-primary);
    margin: 0 0 20px;
    letter-spacing: -0.015em;
}

.aww-featured-post h2 a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.aww-featured-post h2 a:hover {
    color: var(--aww-accent);
}

.aww-featured-post .aww-post-excerpt {
    font-size: 1.05rem;
    color: var(--aww-text-muted);
    line-height: 1.7;
    margin-bottom: 24px;
}

.aww-featured-post .aww-post-meta {
    display: flex;
    gap: 20px;
    font-size: 13px;
    color: var(--aww-text-light);
    margin-bottom: 28px;
    align-items: center;
}

.aww-featured-post .aww-post-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Post grid */
.aww-post-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px 32px;
}

.aww-post-card {
    background: #fff;
    border-radius: var(--aww-radius-lg);
    overflow: hidden;
    transition: transform 0.3s ease;
}

.aww-post-card:hover {
    transform: translateY(-4px);
}

.aww-post-card .aww-post-image {
    aspect-ratio: 16/10;
    overflow: hidden;
    border-radius: var(--aww-radius-lg);
    margin-bottom: 22px;
    background: var(--aww-bg-alt);
}

.aww-post-card .aww-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.aww-post-card:hover .aww-post-image img {
    transform: scale(1.05);
}

.aww-post-card .aww-post-cat {
    color: var(--aww-accent);
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 12px;
    display: inline-block;
}

.aww-post-card h3 {
    font-family: var(--aww-display);
    font-size: 1.45rem;
    font-weight: 500;
    line-height: 1.2;
    margin: 0 0 14px;
    letter-spacing: -0.01em;
}

.aww-post-card h3 a {
    color: var(--aww-primary);
    text-decoration: none;
    transition: color 0.2s ease;
}

.aww-post-card h3 a:hover {
    color: var(--aww-accent);
}

.aww-post-card .aww-post-excerpt {
    font-size: 0.95rem;
    color: var(--aww-text-muted);
    line-height: 1.6;
    margin: 0 0 18px;
}

.aww-post-card .aww-post-meta {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: var(--aww-text-light);
    letter-spacing: 0.02em;
}

/* Empty state */
.aww-no-posts {
    text-align: center;
    padding: 80px 20px;
    background: var(--aww-bg-soft);
    border-radius: var(--aww-radius-lg);
}

.aww-no-posts h3 {
    font-family: var(--aww-display);
    font-size: 1.8rem;
    color: var(--aww-primary);
    margin: 0 0 12px;
}

.aww-no-posts p {
    color: var(--aww-text-muted);
    margin: 0;
}

/* Pagination */
.aww-pagination {
    margin-top: 80px;
    display: flex;
    justify-content: center;
    gap: 8px;
}

.aww-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 14px;
    font-family: var(--aww-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--aww-text-muted);
    text-decoration: none;
    border: 1px solid var(--aww-border);
    border-radius: var(--aww-radius);
    transition: all 0.2s ease;
}

.aww-pagination .page-numbers:hover,
.aww-pagination .page-numbers.current {
    background: var(--aww-primary);
    color: #fff;
    border-color: var(--aww-primary);
}

/* =========================================================
   SINGLE POST PAGE
   ========================================================= */

.aww-single-hero {
    background: var(--aww-bg-soft);
    padding: 80px 0 60px;
    text-align: center;
    border-bottom: 1px solid var(--aww-border-light);
    position: relative;
    overflow: hidden;
}

.aww-single-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 20% 30%, rgba(200, 155, 60, 0.06) 0, transparent 50%),
                      radial-gradient(circle at 80% 70%, rgba(20, 42, 58, 0.04) 0, transparent 50%);
    pointer-events: none;
}

.aww-single-hero-inner {
    position: relative;
    max-width: 820px;
    margin: 0 auto;
    padding: 0 24px;
}

.aww-breadcrumbs {
    font-size: 13px;
    color: var(--aww-text-light);
    margin-bottom: 24px;
    letter-spacing: 0.04em;
}

.aww-breadcrumbs a {
    color: var(--aww-text-muted);
    text-decoration: none;
    transition: color 0.2s ease;
}

.aww-breadcrumbs a:hover {
    color: var(--aww-accent);
}

.aww-breadcrumbs .sep {
    margin: 0 8px;
    color: var(--aww-text-light);
}

.aww-single-cat {
    display: inline-block;
    font-family: var(--aww-body);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--aww-accent);
    margin-bottom: 20px;
    padding: 6px 14px;
    background: rgba(200, 155, 60, 0.1);
    border-radius: 100px;
    text-decoration: none;
}

.aww-single-title {
    font-family: var(--aww-display);
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    font-weight: 500;
    line-height: 1.12;
    color: var(--aww-primary);
    margin: 0 0 28px;
    letter-spacing: -0.02em;
}

.aww-single-meta {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    font-size: 14px;
    color: var(--aww-text-muted);
}

.aww-single-meta .author-mini {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.aww-single-meta .author-mini img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.aww-single-meta .dot {
    width: 4px;
    height: 4px;
    background: var(--aww-text-light);
    border-radius: 50%;
    display: inline-block;
}

/* Featured image */
.aww-single-featured {
    max-width: 1100px;
    margin: -40px auto 0;
    padding: 0 24px;
    position: relative;
    z-index: 2;
}

.aww-single-featured img {
    width: 100%;
    height: auto;
    border-radius: var(--aww-radius-lg);
    box-shadow: var(--aww-shadow-lg);
    display: block;
}

/* Article body */
.aww-article {
    padding: 80px 0 60px;
}

.aww-article-body {
    max-width: var(--aww-article);
    margin: 0 auto;
    padding: 0 24px;
    font-size: 1.125rem;
    line-height: 1.8;
    color: var(--aww-text);
}

.aww-article-body p {
    margin: 0 0 1.6em;
}

.aww-article-body p:first-of-type::first-letter {
    font-family: var(--aww-display);
    font-size: 4.5rem;
    font-weight: 500;
    float: left;
    line-height: 0.9;
    margin: 8px 14px 0 0;
    color: var(--aww-primary);
}

.aww-article-body h2 {
    font-family: var(--aww-display);
    font-size: 2rem;
    font-weight: 500;
    color: var(--aww-primary);
    margin: 2.2em 0 0.8em;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.aww-article-body h3 {
    font-family: var(--aww-display);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--aww-primary);
    margin: 1.8em 0 0.6em;
    line-height: 1.25;
}

.aww-article-body h4 {
    font-family: var(--aww-body);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--aww-primary);
    margin: 1.6em 0 0.5em;
    letter-spacing: 0.01em;
}

.aww-article-body a {
    color: var(--aww-primary);
    text-decoration: underline;
    text-decoration-color: var(--aww-accent);
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
    transition: color 0.2s ease;
}

.aww-article-body a:hover {
    color: var(--aww-accent);
}

.aww-article-body strong {
    color: var(--aww-primary);
    font-weight: 700;
}

.aww-article-body em {
    font-style: italic;
}

.aww-article-body blockquote {
    margin: 2em 0;
    padding: 24px 32px;
    border-left: 4px solid var(--aww-accent);
    background: var(--aww-bg-soft);
    font-family: var(--aww-display);
    font-style: italic;
    font-size: 1.25rem;
    line-height: 1.5;
    color: var(--aww-primary);
    border-radius: 0 var(--aww-radius) var(--aww-radius) 0;
}

.aww-article-body blockquote p {
    margin: 0;
}

.aww-article-body ul,
.aww-article-body ol {
    margin: 0 0 1.6em;
    padding-left: 1.5em;
}

.aww-article-body li {
    margin-bottom: 0.5em;
}

.aww-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--aww-radius);
    margin: 2em 0;
    display: block;
}

.aww-article-body figure {
    margin: 2.4em 0;
}

.aww-article-body figcaption {
    font-size: 0.875rem;
    color: var(--aww-text-light);
    text-align: center;
    margin-top: 12px;
    font-style: italic;
}

.aww-article-body hr {
    border: none;
    height: 1px;
    background: var(--aww-border);
    margin: 3em 0;
}

.aww-article-body code {
    background: var(--aww-bg-soft);
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 0.9em;
    color: var(--aww-primary);
}

.aww-article-body table {
    width: 100%;
    border-collapse: collapse;
    margin: 2em 0;
    font-size: 0.95rem;
}

.aww-article-body table th,
.aww-article-body table td {
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid var(--aww-border);
}

.aww-article-body table th {
    background: var(--aww-bg-soft);
    font-weight: 600;
    color: var(--aww-primary);
}

/* Tags */
.aww-post-tags {
    max-width: var(--aww-article);
    margin: 0 auto;
    padding: 40px 24px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.aww-post-tags-label {
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--aww-text-light);
    font-weight: 600;
    margin-right: 8px;
}

.aww-post-tags a {
    font-size: 13px;
    color: var(--aww-text-muted);
    text-decoration: none;
    padding: 6px 14px;
    border: 1px solid var(--aww-border);
    border-radius: 100px;
    transition: all 0.2s ease;
}

.aww-post-tags a:hover {
    background: var(--aww-primary);
    color: #fff;
    border-color: var(--aww-primary);
}

/* Author bio */
.aww-author-bio {
    max-width: var(--aww-article);
    margin: 60px auto 0;
    padding: 40px;
    background: var(--aww-bg-soft);
    border-radius: var(--aww-radius-lg);
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 28px;
    align-items: start;
}

.aww-author-bio img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: var(--aww-shadow-sm);
}

.aww-author-bio .label {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--aww-accent);
    font-weight: 600;
    margin-bottom: 8px;
}

.aww-author-bio h4 {
    font-family: var(--aww-display);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--aww-primary);
    margin: 0 0 10px;
}

.aww-author-bio p {
    font-size: 0.95rem;
    color: var(--aww-text-muted);
    line-height: 1.7;
    margin: 0 0 16px;
}

/* Related posts */
.aww-related {
    padding: 80px 0;
    background: var(--aww-bg-alt);
    border-top: 1px solid var(--aww-border-light);
}

.aww-related-header {
    text-align: center;
    margin-bottom: 50px;
}

.aww-related-header .label {
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--aww-accent);
    font-weight: 600;
    margin-bottom: 12px;
    display: block;
}

.aww-related-header h2 {
    font-family: var(--aww-display);
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--aww-primary);
    margin: 0;
    letter-spacing: -0.015em;
}

.aww-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

/* CTA section */
.aww-cta-section {
    padding: 80px 0;
    background: var(--aww-primary);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.aww-cta-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 30% 20%, rgba(200, 155, 60, 0.15) 0, transparent 50%),
                      radial-gradient(circle at 70% 80%, rgba(200, 155, 60, 0.08) 0, transparent 50%);
    pointer-events: none;
}

.aww-cta-inner {
    position: relative;
    max-width: 680px;
    margin: 0 auto;
    padding: 0 24px;
}

.aww-cta-section .label {
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--aww-accent);
    font-weight: 600;
    margin-bottom: 16px;
    display: block;
}

.aww-cta-section h2 {
    font-family: var(--aww-display);
    font-size: clamp(1.8rem, 3.5vw, 2.6rem);
    font-weight: 500;
    line-height: 1.2;
    margin: 0 0 18px;
    letter-spacing: -0.015em;
    color: #fff;
}

.aww-cta-section h2 em {
    font-style: italic;
    color: var(--aww-accent);
    font-weight: 400;
}

.aww-cta-section p {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.7;
    margin: 0 0 32px;
}

/* Reading progress bar */
.aww-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: var(--aww-accent);
    width: 0;
    z-index: 9999;
    transition: width 0.1s linear;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1024px) {
    .aww-post-grid,
    .aww-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .aww-featured-post {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .aww-blog-header,
    .aww-single-hero {
        padding: 70px 0 50px;
    }

    .aww-blog-main {
        padding: 60px 0;
    }

    .aww-post-grid,
    .aww-related-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .aww-article {
        padding: 60px 0 40px;
    }

    .aww-article-body {
        font-size: 1.05rem;
    }

    .aww-article-body p:first-of-type::first-letter {
        font-size: 3.5rem;
    }

    .aww-author-bio {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 30px 24px;
    }

    .aww-author-bio img {
        margin: 0 auto;
    }

    .aww-single-featured {
        margin-top: -30px;
    }

    .aww-cat-filter {
        position: static;
    }

    .aww-cat-filter-inner {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
    }

    .aww-cat-filter a {
        flex-shrink: 0;
    }
}

@media (max-width: 480px) {
    .aww-blog-header h1,
    .aww-single-title {
        font-size: 2rem;
    }

    .aww-related-header h2 {
        font-size: 1.8rem;
    }

    .aww-article-body h2 {
        font-size: 1.65rem;
    }

    .aww-article-body h3 {
        font-size: 1.3rem;
    }
}