/* 
   Custom Styles - Premium Light Glass Theme
*/

:root {
    /* Map to Elementor Global Colors with defaults */
    --primary-color: var(--e-global-color-primary, #fccc11);
    --secondary-color: var(--e-global-color-secondary, #333333);
    --heading-color: var(--e-global-color-accent, #2b2b2b);
    --text-color: var(--e-global-color-text, #555555);

    --glass-bg: rgba(255, 255, 255, 0.75);
    --glass-border: rgba(255, 255, 255, 0.5);
    --shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.08);
    --capsule-radius: 50px;
    --container-width: 1200px;
    --transition: all 0.3s ease;
}

* {
    box-sizing: border-box;
}

body {
    overflow-x: hidden;
}

.elementor-widget-container {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

img {
    max-width: 100%;
    height: auto;
}

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

/* Layout Helpers */
.row {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.site-main-column {
    flex: 2;
    min-width: 300px;
}

.sidebar-column {
    flex: 1;
    min-width: 250px;
}

.entry-header-single {
    margin-bottom: 30px;
}

.entry-meta-single {
    color: var(--text-color);
    font-size: 0.9em;
    margin-top: 10px;
}

.post-thumbnail-single {
    margin-bottom: 30px;
}

.entry-footer-single {
    margin-top: 40px;
    border-top: 1px solid var(--border-color, #eee);
    padding-top: 20px;
}

.hero-btns i {
    margin-left: 8px;
}

.rounded-img {
    border-radius: var(--card-radius, 20px);
}

/* Widget Helpers */
.partners-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.partner-logo {
    transition: all 0.3s ease;
}

.brand-strip-title {
    text-align: center;
    margin-bottom: 40px;
}

.brand-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.brand-item {
    transition: all 0.3s ease;
}

.brand-item img {
    display: block;
    height: auto;
}

body {
    background-color: #fafafa;
    cursor: none;
    /* Hide default cursor */
    overflow-x: hidden;
}

/* --- 3D CANVAS & CURSOR --- */
#bg-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
}

.cursor-dot {
    width: 8px;
    height: 8px;
    background-color: var(--primary-color);
    position: fixed;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 9999;
    pointer-events: none;
}

.cursor-outline {
    width: 40px;
    height: 40px;
    border: 2px solid var(--primary-color);
    position: fixed;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 9999;
    pointer-events: none;
    transition: width 0.2s, height 0.2s, background-color 0.2s;
}

/* --- LIGHT GLASSMORPHISM UTILITIES --- */
.glass-panel {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border);
    box-shadow: var(--shadow-soft);
}

/* --- HEADER --- */
.site-header {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 1200px;
    z-index: 1000;
    padding: 10px 30px;
    border-radius: var(--capsule-radius);

    /* Permanent Glass Effect */
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.main-navigation ul {
    display: flex;
    gap: 40px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-navigation a {
    color: var(--heading-color);
    font-weight: 600;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: 0.3s;
}

.main-navigation a:hover {
    color: var(--primary-color);
}

.mobile-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 1.5rem;
    color: var(--heading-color);
    cursor: pointer;
    transition: var(--transition);
}


/* --- COMPONENTS OVERHAUL --- */

/* Buttons */
.btn {
    padding: 12px 30px;
    border-radius: 30px;
    font-weight: 600;
    transition: var(--transition);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 2px solid transparent;
}

.btn-primary {
    background: var(--primary-color);
    color: #2b2b2b;
    box-shadow: 0 5px 15px rgba(252, 204, 17, 0.4);
    border-color: var(--primary-color);
}

.btn-primary:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 10px 30px rgba(252, 204, 17, 0.5);
    background: #eebb00;
}

.btn-outline {
    background: transparent;
    color: var(--heading-color);
    border-color: var(--heading-color);
}

.btn-outline:hover {
    background: var(--heading-color);
    color: #fff;
    transform: translateY(-3px);
}


/* --- SECTION TITLES & SPACERS --- */
.section {
    padding: 100px 0;
    position: relative;
    z-index: 10;
}

.section-title {
    font-size: 2.5rem;
    margin-bottom: 60px;
    text-align: center;
    position: relative;
    display: inline-block;
    width: 100%;
}

.section-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--primary-color);
    margin: 20px auto 0;
    border-radius: 2px;
}

/* --- SERVICES GRID (Premium) --- */
.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.service-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    padding: 40px 30px;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.service-card:hover {
    transform: translateY(-10px);
    background: #fff;
    box-shadow: 0 20px 50px rgba(252, 204, 17, 0.15);
    border-color: var(--primary-color);
}

.service-icon {
    font-size: 3rem;
    color: var(--primary-color);
    margin-bottom: 25px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.service-card:hover .service-icon {
    transform: scale(1.1) rotate(-5deg);
}

.service-card h3 {
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: var(--heading-color);
}

.service-card p {
    color: var(--text-color);
    font-size: 0.95rem;
    margin-bottom: 25px;
    line-height: 1.6;
}

.service-link {
    font-weight: 600;
    color: var(--heading-color);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: gap 0.3s ease;
}

.service-link i {
    color: var(--primary-color);
}

.service-link:hover {
    color: var(--primary-color);
    gap: 12px;
}

/* --- PARTNERS GRID --- */
.partners-grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin-top: 40px;
}

.partner-logo {
    font-size: 3rem;
    color: #ccc;
    transition: all 0.3s ease;
    cursor: pointer;
    filter: grayscale(100%);
    opacity: 0.7;
}

.partner-logo:hover {
    color: var(--primary-color);
    /* Fallback */
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}

/* --- TESTIMONIALS (Masonry-ish) --- */
.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    align-items: start;
    /* Important for unequal heights */
}

.testimonial-card {
    background: #fff;
    border-radius: 20px;
    padding: 35px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
    position: relative;
    transition: transform 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.testimonial-card.featured {
    background: #2b2b2b;
    color: #fff;
    transform: scale(1.05);
    z-index: 2;
}

.testimonial-card.featured:hover {
    transform: scale(1.05) translateY(-5px);
}

.testimonial-card.featured h4,
.testimonial-card.featured p,
.testimonial-card.featured span {
    color: #fff;
}

.client-info {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.client-info img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--primary-color);
}

.client-info h4 {
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.2;
}

.client-info span {
    font-size: 0.85rem;
    color: #888;
}

.testimonial-card p {
    font-style: italic;
    font-size: 1rem;
    color: var(--text-color);
}

/* --- TEAM GRID --- */
.team-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.team-card {
    background: transparent;
    text-align: center;
    transition: all 0.3s ease;
}

.team-img-wrapper {
    width: 100%;
    height: 350px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.team-img {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.5s ease;
}

.team-card:hover .team-img {
    transform: scale(1.1);
}

.team-overlay {
    position: absolute;
    bottom: -100px;
    left: 0;
    width: 100%;
    padding: 20px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    display: flex;
    justify-content: center;
    gap: 15px;
    transition: bottom 0.3s ease;
}

.team-card:hover .team-overlay {
    bottom: 0;
}

.team-overlay a {
    color: #fff;
    font-size: 1.2rem;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(5px);
}

.team-overlay a:hover {
    background: var(--primary-color);
    color: #2b2b2b;
}

.team-card h4 {
    margin: 0;
    font-size: 1.2rem;
}

.team-card span {
    color: var(--primary-color);
    font-weight: 600;
    font-size: 0.9rem;
}


/* --- RESPONSIVE GRID ADJUSTMENTS --- */
@media (max-width: 992px) {

    .services-grid,
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .team-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {

    .services-grid,
    .testimonials-grid,
    .team-grid {
        grid-template-columns: 1fr;
    }

    .testimonial-card.featured {
        transform: scale(1);
    }

    .section-title {
        font-size: 2rem;
    }
}

/* --- FOOTER (Keep existing but ensure z-index) --- */
.site-footer {
    position: relative;
    padding: 80px 0 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.98) 100%);
    backdrop-filter: blur(20px);
    border-top: 1px solid rgba(255, 255, 255, 0.5);
    margin-top: 100px;
    z-index: 20;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.5fr;
    gap: 40px;
    margin-bottom: 60px;
}

.footer-col h3 {
    font-size: 1.8rem;
    margin-bottom: 20px;
    color: var(--heading-color);
}

.footer-col h3 span {
    color: var(--primary-color);
}

.footer-col h4 {
    font-size: 1.2rem;
    margin-bottom: 25px;
    color: var(--heading-color);
    position: relative;
    padding-bottom: 10px;
}

.footer-col h4::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 2px;
    background: var(--primary-color);
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin-bottom: 12px;
}

.footer-col ul li a {
    color: var(--text-color);
    text-decoration: none;
    transition: var(--transition);
    font-size: 0.95rem;
}

.footer-col ul li a:hover {
    color: var(--primary-color);
    padding-left: 5px;
}

.social-links {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.social-links a {
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--heading-color);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    transition: var(--transition);
}

.social-links a:hover {
    background: var(--primary-color);
    transform: translateY(-3px);
}

.newsletter-form {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.newsletter-form input {
    flex: 1;
    padding: 12px 15px;
    border: 1px solid #eee;
    border-radius: 30px;
    outline: none;
    background: rgba(255, 255, 255, 0.8);
}

.footer-bottom {
    text-align: center;
    padding-top: 30px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    font-size: 0.9rem;
    color: #888;
}

/* --- RESPONSIVE FOOTER --- */
@media (max-width: 992px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 50px;
    }

    .footer-col h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .social-links {
        justify-content: center;
    }

    .newsletter-form {
        flex-direction: column;
    }
}

/* --- PIONEERING SECTION (Premium Fix) --- */
.pioneering-section {
    position: relative;
    overflow: hidden;
    padding: 120px 0;
}

.pioneering-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.pioneering-text h2 {
    font-size: 3.5rem;
    line-height: 1.1;
    margin-bottom: 30px;
    background: linear-gradient(135deg, var(--heading-color) 0%, #666 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.pion-desc {
    font-size: 1.1rem;
    color: var(--text-color);
    line-height: 1.8;
    margin-bottom: 40px;
}

.pioneering-media {
    position: relative;
}

.video-card {
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: transform 0.4s ease;
}

.video-card:hover {
    transform: scale(1.02);
    box-shadow: 0 30px 80px rgba(252, 204, 17, 0.2);
}

.video-card img {
    width: 100%;
    display: block;
    transition: transform 0.8s ease;
}

.video-card:hover img {
    transform: scale(1.1);
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.6);
    transition: all 0.3s ease;
    z-index: 5;
}

.play-button:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 0 10px 30px rgba(252, 204, 17, 0.4);
}

@media (max-width: 992px) {
    .pioneering-container {
        grid-template-columns: 1fr;
        gap: 50px;
        text-align: center;
    }

    .pioneering-text h2 {
        font-size: 2.5rem;
    }
}

/* --- PARTNERS SECTION FIX --- */
.partners-section {
    padding: 60px 0;
    margin-bottom: 60px;
}

.partners-box {
    border-radius: 30px;
    padding: 60px;
    text-align: center;
}

.partners-box .section-title {
    margin-bottom: 50px;
    font-size: 1.8rem;
    opacity: 0.8;
}

.partners-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 60px;
    align-items: center;
}

.partners-grid .partner-logo i {
    font-size: 3.5rem;
}

/* --- SERVICES TABS WIDGET --- */
.pd-services-tabs {
    display: flex;
    border-radius: 20px;
    overflow: hidden;
    min-height: 500px;
}

/* Navigation Left */
.pd-tabs-nav {
    width: 30%;
    padding: 30px 20px;
    border-right: 1px solid #eee;
}

.pd-tabs-heading {
    font-size: 1.8rem;
    margin-bottom: 25px;
    padding-left: 15px;
    font-weight: 300;
}

.pd-tabs-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pd-tab-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    background: transparent;
    color: var(--text-color);
}

.pd-tab-item:hover {
    background: #f0f0f0;
}

.pd-tab-item.active {
    background: var(--primary-color);
    color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.pd-tab-icon {
    font-size: 1.2rem;
    color: var(--primary-color);
    transition: 0.3s;
}

.pd-tab-item:hover .pd-tab-icon {
    color: var(--primary-color);
}

.pd-tab-item.active .pd-tab-icon {
    color: #fff;
}

.pd-tab-text {
    font-weight: 500;
    font-size: 0.95rem;
}

/* Content Right */
.pd-tabs-content-wrapper {
    width: 70%;
    position: relative;
}

.pd-tab-content {
    display: none;
    padding: 40px;
    animation: fadeIn 0.4s ease;
    height: 100%;
}

.pd-tab-content.active {
    display: block;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.pd-content-image {
    width: 100%;
    height: 250px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    margin-bottom: 30px;
}

.pd-content-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pd-content-icon-overlay {
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 50px;
    height: 50px;
    background: var(--primary-color);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.pd-content-title {
    font-size: 2rem;
    font-weight: 300;
    margin-bottom: 15px;
    color: #333;
}

.pd-content-desc {
    color: #666;
    margin-bottom: 30px;
    font-size: 1rem;
    line-height: 1.6;
}

/* Features List */
.pd-features-list h5 {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 15px;
    color: #333;
}

.pd-features-list ul {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}

.pd-feature-item {
    padding: 8px 0;
    padding-left: 20px;
    position: relative;
    color: #555;
    font-size: 0.95rem;
    border-bottom: 1px solid #f9f9f9;
}

.pd-feature-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 15px;
    width: 6px;
    height: 6px;
    background: var(--primary-color);
    border-radius: 50%;
}

/* CTA */
.pd-content-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--primary-color);
    color: #fff;
    padding: 12px 25px;
    border-radius: 8px;
    font-weight: 500;
    text-decoration: none;
    transition: 0.3s;
}

.pd-content-cta:hover {
    filter: brightness(110%);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    color: #fff;
}

@media (max-width: 900px) {
    .pd-services-tabs {
        flex-direction: column;
    }

    .pd-tabs-nav,
    .pd-tabs-content-wrapper {
        width: 100%;
    }

    .pd-tabs-nav {
        border-right: none;
        border-bottom: 1px solid #eee;
    }
}

/* =========================================
   PREMIUM HERO SECTION (Next Level)
   ========================================= */
.hero-section {
    position: relative;
    min-height: 850px;
    /* Taller premium feel */
    display: flex;
    align-items: center;
    overflow: hidden;
    padding-top: 80px;
    /* Offset fixed header */
}

/* Background Animated Glow */
.hero-bg-glow {
    position: absolute;
    top: -20%;
    right: -10%;
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(252, 204, 17, 0.15) 0%, rgba(255, 255, 255, 0) 70%);
    border-radius: 50%;
    z-index: 0;
    animation: pulseGlow 8s infinite alternate;
}

@keyframes pulseGlow {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }

    100% {
        transform: scale(1.2);
        opacity: 0.8;
    }
}

.hero-container {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* Glass Card Container */
.hero-glass-card {
    border-radius: 40px;
    padding: 60px;
    position: relative;
    overflow: hidden;
    transition: transform 0.4s ease;
}

.hero-glass-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
}

.hero-glass-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.08);
}

/* Typography & Elements */
.hero-tag-wrapper {
    margin-bottom: 25px;
    display: inline-block;
}

.hero-tag {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.hero-title {
    font-size: 4rem;
    /* Big & Bold */
    line-height: 1.1;
    font-weight: 800;
    margin-bottom: 30px;
    letter-spacing: -1px;
}

.hero-desc {
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 40px;
    max-width: 90%;
}

.hero-btns {
    display: flex;
    gap: 20px;
}

/* Image Wrapper & Floating Badges */
.hero-img-wrapper {
    position: relative;
    /* width: 100%; left default to adjust */
}

.hero-img-wrapper img {
    width: 100%;
    height: auto;
    border-radius: 40px 0 40px 0;
    /* Modern shape */
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.15);
    animation: floatImage 6s ease-in-out infinite;
}

@keyframes floatImage {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }
}

.hero-floating-badge {
    position: absolute;
    background: #fff;
    padding: 15px 25px;
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 700;
    color: #333;
    z-index: 3;
    animation: floatBadge 5s ease-in-out infinite alternate;
}

.hero-floating-badge i {
    color: var(--primary-color);
    font-size: 1.2rem;
}

.badge-1 {
    top: 10%;
    left: -30px;
    animation-delay: 0s;
}

.badge-2 {
    bottom: 15%;
    right: -20px;
    animation-delay: 2s;
}

@keyframes floatBadge {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(15px);
    }
}

/* Tablet/Mobile Hero */
@media (max-width: 992px) {
    .hero-container {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .hero-glass-card {
        padding: 40px;
    }

    .hero-title {
        font-size: 3rem;
    }

    .hero-btns {
        justify-content: center;
    }

    .hero-img-wrapper {
        margin-top: 40px;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
}


/* =========================================
   INDUSTRIES ACCORDION (Premium)
   ========================================= */
.pd-industries-accordion {
    width: 100%;
    display: flex;
    overflow: hidden;
    position: relative;
    /* Height is set inline by PHP widget logic, usually ~600px */
    border-radius: 30px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
}

/* DEFAULT: Horizontal Mode (standard styles) */
/* Actually, let's make the default be side-by-side expanding panels (Horizontal Accordion) */
/* The 'Vertical Strip' mentioned in task likely refers to TALL VERTICAL BARS side-by-side */

.pd-industry-item {
    flex: 1;
    /* All items start equal width */
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    transition: flex 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    /* Smooth expanding */
    overflow: hidden;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.pd-industry-item:last-child {
    border-right: none;
}

.pd-industry-item.active {
    flex: 3;
    /* Active items expand */
}

.pd-industry-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
    transition: 0.4s;
}

.pd-industry-item.active .pd-industry-overlay {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
}

/* Content Positioning */
.pd-industry-content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 30px;
    z-index: 2;
    transform: translateY(20px);
    transition: transform 0.4s, opacity 0.4s;
}

.pd-industry-item.active .pd-industry-content {
    transform: translateY(0);
}

.pd-industry-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.pd-industry-title {
    color: #fff;
    font-size: 1.5rem;
    margin: 0 0 10px 0;
    font-weight: 700;
    width: 100%;
    white-space: nowrap;
    opacity: 0.8;
    transform-origin: 0 0;
    transition: 0.4s;
}

.pd-industry-item.active .pd-industry-title {
    font-size: 2.2rem;
    opacity: 1;
    margin-bottom: 20px;
}

/* Description (Hidden until active) */
.pd-industry-desc {
    opacity: 0;
    transform: translateY(10px);
    transition: 0.4s delay 0.1s;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--primary-color);
    font-weight: 600;
}

.pd-industry-item.active .pd-industry-desc {
    opacity: 1;
    transform: translateY(0);
}

/* Index / Decor for collapsed state */
.pd-industry-index {
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.2);
    font-weight: 800;
    z-index: 1;
}

/* --- VERTICAL STRIP MODIFIER (.pd-industries-vertical) --- */
/* If PHP adds this class, we assume the user wants the "Rotated Text" vertical strip style */
/* Actually, the style above IS vertical strips (tall items side by side). */
/* If 'horizontal' meant stacked rows (Vertical Accordion), then we need separate styles. */
/* Let's verify: PHP Default 'horizontal'. If user wants 'vertical' (Premium Strip). */
/* So: 'horizontal' = Rows stacked vertically. 'vertical' = Columns side-by-side. */

/* Let's override for the class .pd-industries-vertical which forces side-by-side (what we wrote above). */
/* AND standard class (no modifier) should be STACKED ROWS. */

/* Resetting above for 'horizontal' (Default Stacked) */
.pd-industries-accordion:not(.pd-industries-vertical) {
    flex-direction: column;
}

.pd-industries-accordion:not(.pd-industries-vertical) .pd-industry-item {
    width: 100%;
    flex: 1;
    /* Height expands */
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    border-right: none;
}

.pd-industries-accordion:not(.pd-industries-vertical) .pd-industry-item.active {
    flex: 3;
    /* Height expands */
}

/* Premium Vertical Strip (Column side-by-side) */
.pd-industries-vertical {
    flex-direction: row;
    /* Side by side */
}

.pd-industries-vertical .pd-industry-item {
    border-right: 1px solid rgba(255, 255, 255, 0.2);
}

/* Rotated Text for Inactive Vertical Strips */
.pd-industries-vertical .pd-industry-item:not(.active) .pd-industry-title {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    position: absolute;
    bottom: 30px;
    left: 50%;
    margin: 0;
    width: auto;
    transform-origin: center;
    font-size: 1.2rem;
}

.pd-industries-vertical .pd-industry-item:not(.active) .pd-industry-content {
    width: auto;
    padding: 0;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    /* Align to bottom */
    padding-bottom: 40px;
}

.pd-industries-vertical .pd-industry-item.active .pd-industry-title {
    writing-mode: horizontal-tb;
    transform: none;
}

/* Mobile Fallback for Vertical Strips -> Becomes Stacked */
@media (max-width: 768px) {
    .pd-industries-vertical {
        flex-direction: column;
        height: auto !important;
        /* Let content dictate or fixed height */
        min-height: 600px;
        /* Force some height */
    }

    .pd-industries-vertical .pd-industry-item:not(.active) .pd-industry-title {
        writing-mode: horizontal-tb;
        transform: none;
        position: relative;
        left: 0;
        bottom: 0;
    }

    .pd-industries-vertical .pd-industry-item:not(.active) .pd-industry-content {
        width: 100%;
        transform: translateY(0);
        left: 0;
        padding: 30px;
        display: block;
    }
}

/* Bento Grid Logic */
.pd-portfolio-wrapper.pd-layout-bento {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 30px;
}

.pd-portfolio-wrapper.pd-layout-bento .pd-portfolio-card {
    grid-column: span 4;
    /* Chhota card */
}

.pd-portfolio-wrapper.pd-layout-bento .pd-portfolio-card:nth-child(3n+1) {
    grid-column: span 8;
    /* Har teesra card bada hoga bento style mein */
}

/* Elite Card Design */
.pd-portfolio-card {
    overflow: hidden;
    position: relative;
    transition: 0.4s ease;
}

/* Auto-Scroll logic for long screenshots */
.pd-has-scroll .pd-portfolio-img-container {
    height: 400px;
    overflow: hidden;
}

.pd-has-scroll .pd-portfolio-img-container img {
    width: 100%;
    height: auto;
    transition: transform 6s linear;
    /* Smooth scroll to bottom */
}

.pd-has-scroll:hover .pd-portfolio-img-container img {
    transform: translateY(calc(-100% + 400px));
}

.pd-portfolio-content {
    padding: 25px;
}

.pd-project-title {
    font-weight: 900;
    margin: 0;
}

/* =========================================
   RESPONSIVE UPGRADE (Elite Agency)
   ========================================= */

:root {
    --fluid-h1: clamp(2.5rem, 8vw, 4.5rem);
    --fluid-h2: clamp(2rem, 6vw, 3rem);
    --fluid-h3: clamp(1.5rem, 4vw, 2.2rem);
    --fluid-spacing: clamp(40px, 8vh, 100px);
}

/* --- Fluid Typography Global --- */
h1,
.hero-title {
    font-size: var(--fluid-h1);
}

h2,
.section-title,
.pd-cs-title {
    font-size: var(--fluid-h2);
}

h3,
.pd-content-title,
.pd-project-title {
    font-size: var(--fluid-h3);
}

/* --- Container Fix --- */
.container {
    width: 100%;
    max-width: 1200px;
    padding-left: clamp(20px, 5vw, 40px);
    padding-right: clamp(20px, 5vw, 40px);
}

/* --- Header Mobile Transformation --- */
@media (max-width: 991px) {
    .site-header {
        top: 10px;
        width: calc(100% - 20px);
        padding: 5px 20px;
    }

    .main-navigation {
        display: none !important;
        /* Favor Off-Canvas Menu on Mobile */
    }

    .mobile-toggle {
        display: flex;
        width: 45px;
        height: 45px;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem;
        background: var(--primary-color);
        color: #000;
        border-radius: 50%;
        box-shadow: 0 5px 15px rgba(252, 204, 17, 0.3);
    }

    .desktop-only {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .site-logo h2 {
        font-size: 1.2rem;
    }

    .site-header {
        padding: 5px 15px;
    }
}

/* --- Widget Grids Adaptation --- */
@media (max-width: 768px) {

    /* Bento Grid Stack */
    .pd-portfolio-wrapper.pd-layout-bento {
        grid-template-columns: 1fr;
    }

    .pd-portfolio-wrapper.pd-layout-bento .pd-portfolio-card,
    .pd-portfolio-wrapper.pd-layout-bento .pd-portfolio-card:nth-child(3n+1) {
        grid-column: span 1;
    }

    /* Culture/Values Bento */
    .pd-bento-grid {
        grid-template-columns: 1fr;
    }

    .pd-value-card {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }

    /* Sidebar / Main Layout */
    .row {
        gap: 30px;
    }
}

/* --- Touch Optimizations --- */
@media (hover: none) {

    /* Disable Auto-Scroll on Touch */
    .pd-has-scroll:hover .pd-portfolio-img-container img {
        transform: none !important;
    }

    .pd-portfolio-img-container {
        height: auto;
        max-height: 350px;
    }

    .pd-portfolio-img-container img {
        height: auto !important;
        object-fit: contain;
    }
}

/* --- Service Tabs Scrollable Mobile --- */
@media (max-width: 900px) {
    .pd-tabs-nav {
        padding: 15px 10px;
    }

    .pd-tabs-list {
        flex-direction: row;
        overflow-x: auto;
        padding-bottom: 10px;
        scrollbar-width: none;
        /* Firefox */
    }

    .pd-tabs-list::-webkit-scrollbar {
        display: none;
    }

    /* Chrome/Safari */

    .pd-tab-item {
        white-space: nowrap;
        flex: 0 0 auto;
    }

    .pd-tab-content {
        padding: 30px 20px;
    }
}

/* --- Image Audit Fix --- */
img {
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

/* --- Cleanup Specificity --- */
.site-header.scrolled {
    background: rgba(255, 255, 255, 0.95);
    padding: 5px 30px;
}

/* Section Spacing Fluidity */
section,
.section {
    padding-top: var(--fluid-spacing);
    padding-bottom: var(--fluid-spacing);
}

/* Off-Canvas Menu System */
.off-canvas-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 320px;
    height: 100vh;
    background: #fff;
    z-index: 9999;
    box-shadow: -5px 0 25px rgba(0, 0, 0, 0.1);
    transition: right 0.4s cubic-bezier(0.77, 0, 0.175, 1);
    display: flex;
    flex-direction: column;
    padding: 30px;
}

.off-canvas-menu.active {
    right: 0;
}

.off-canvas-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9998;
    backdrop-filter: blur(5px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.off-canvas-overlay.active {
    opacity: 1;
    visibility: visible;
}

.off-canvas-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}

.close-off-canvas {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #333;
}

.mobile-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-navigation ul li {
    margin-bottom: 15px;
}

.mobile-navigation ul li a {
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    text-decoration: none;
    transition: color 0.3s;
}

.mobile-navigation ul li a:hover {
    color: var(--primary-color);
}

.off-canvas-footer {
    margin-top: auto;
    padding-top: 30px;
}


/* QA Fixes for Reactive & Responsive Integrity */
/* Final/* Global Responsiveness Safeguards */
* {
    box-sizing: border-box;
}

html,
body {
    overflow-x: hidden !important;
    position: relative;
    width: 100%;
}

/* Force Elementor Containers to behave */
.elementor-section,
.elementor-column,
.elementor-widget-container {
    max-width: 100vw !important;
}

/* Fix for horizontal scroll issues on mobile */
.container,
.container-fluid {
    overflow: hidden;
}

/* Force specific grids to single column on mobile */
@media (max-width: 767px) {

    .pd-services-grid,
    .partners-grid,
    .pd-blog-grid,
    .pd-careers-grid,
    .pd-portfolio-grid,
    .pd-team-grid,
    .pd-stats-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 30px !important;
    }

    .pd-value-card,
    .pd-stats-counter {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Utility for responsive spacing */
@media (max-width: 991px) {
    .section-padding {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }
}

@media (max-width: 767px) {
    .section-padding {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
}

/* Ensure footer inputs don't overflow */
.newsletter-form input {
    max-width: 100%;
}

@media (max-width: 767px) {
    .footer-grid {
        padding: 0 20px;
    }

    .footer-col {
        margin-bottom: 30px;
    }
}

/* ==========================================================================
   ELITE SINGLE POST TEMPLATE
   ========================================================================== */

/* ==========================================================================
   ELITE SINGLE POST TEMPLATE (REFACTORED)
   ========================================================================== */

/* Reading Progress Bar - Thinner & Elegant */
#pd-reading-progress-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: transparent;
    z-index: 99999;
    pointer-events: none;
}

#pd-reading-progress-bar {
    height: 100%;
    background: var(--primary-color);
    width: 0%;
    transition: width 0.1s linear;
    box-shadow: 0 0 10px rgba(252, 204, 17, 0.6);
}

/* 1. ELITE HERO SECTION - Expansive & Breathing */
.pd-single-hero {
    position: relative;
    width: 100%;
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 0px;
    /* Flush with content usually, but content has large top margin due to wrapper */
    padding-top: 120px;
    padding-bottom: 80px;
}

/* Blurred BG */
.pd-hero-bg-blur {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
    background-size: cover;
    background-position: center;
    filter: blur(40px) brightness(0.7);
    z-index: 0;
    opacity: 0.4;
}

.pd-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.85), rgba(250, 250, 250, 1));
    z-index: 1;
}

.pd-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 1200px;
    /* Widened as requested */
    margin: 0 auto;
    padding: 0 20px;
}

.pd-hero-cat {
    display: inline-block;
    background: var(--primary-color);
    color: #000;
    padding: 8px 18px;
    border-radius: 30px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.85rem;
    margin-bottom: 25px;
    letter-spacing: 1px;
    box-shadow: 0 5px 15px rgba(252, 204, 17, 0.3);
}

.pd-hero-meta {
    margin-bottom: 30px;
    color: var(--text-color);
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

.pd-hero-title {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 40px;
    color: var(--heading-color);
    letter-spacing: -1.5px;
}

.pd-hero-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.pd-hero-author img {
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.pd-author-name {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--heading-color);
}

/* 2. LAYOUT - Expansive Container */
.pd-container-expansive {
    max-width: 1400px;
    /* Allows for 950px content + sidebar + gaps */
    width: 95%;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.pd-single-grid {
    display: grid;
    /* Grid: [Share 80px] [Gap 40px] [Content 1fr (max 950)] [Gap 80px] [Sidebar 320px] */
    grid-template-columns: 80px 1fr 340px;
    gap: 0;
    /* Handled by margins/padding for precise control */
    align-items: start;
}

/* Left: Share Sticky */
.pd-col-share {
    position: sticky;
    top: 150px;
    width: 80px;
    margin-right: 40px;
}

.pd-sticky-share {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.share-label {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 10px;
}

.pd-share-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--heading-color);
    border: 1px solid rgba(0, 0, 0, 0.08);
    transition: 0.3s;
    background: #fff;
}

.pd-share-icon:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-3px) scale(1.1);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

/* Center: Content (The Main Focus) */
.pd-col-content {
    min-width: 0;
    max-width: 950px;
    /* Requested Width */
    width: 100%;
    margin-right: 80px;
    /* The Gutter */
}

/* Floating Featured Image - Wide & Premium */
.pd-featured-image-wrapper {
    margin-bottom: 80px;
    position: relative;
    width: 100%;
}

/* Make it wider than text? Using negative margins would be tricky with grid. 
   Since Content div is max 950, and we want Full Width image relative to that, 950 IS wide.
   To make it "Wide-Width" (wider than text), we can set text container small (e.g. 750px) 
   and image to 950px. 
   BUT proper magazine style uses padding inside typography div. */

.pd-featured-image-floating {
    width: 100%;
    height: auto;
    max-height: 650px;
    object-fit: cover;
    /* Required */
    border-radius: 24px;
    /* Requested */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
    /* Requested deep shadow */
}

/* Typography Overhaul - Airy & Elite */
.pd-pro-typography {
    font-size: 1.2rem;
    line-height: 1.8;
    /* Requested */
    color: #444;
}

.pd-pro-typography p {
    margin-bottom: 35px;
    /* Increased Spacing */
}

.pd-pro-typography h2 {
    font-size: 2.2rem;
    margin-top: 60px;
    margin-bottom: 30px;
    font-weight: 800;
    color: var(--heading-color);
    letter-spacing: -0.5px;
}

.pd-pro-typography h3 {
    font-size: 1.8rem;
    margin-top: 50px;
    margin-bottom: 25px;
    font-weight: 700;
    color: var(--heading-color);
}

/* Drop Cap */
.pd-pro-typography>p:first-of-type::first-letter {
    font-size: 4em;
    font-weight: 800;
    color: var(--primary-color);
    float: left;
    margin-right: 20px;
    line-height: 0.85;
    margin-top: 5px;
}

/* Quotes */
.pd-pro-typography blockquote {
    border: none;
    border-left: 4px solid var(--primary-color);
    background: transparent;
    padding: 10px 40px;
    margin: 50px 0;
    font-style: italic;
    font-size: 1.4rem;
    color: #000;
    font-weight: 500;
}

/* Right: Sidebar Sticky & Clean */
.pd-col-sidebar {
    width: 340px;
}

.pd-sidebar-sticky-inner {
    position: sticky;
    top: 100px;
}

.pd-sidebar-widget {
    background: transparent;
    /* Removed BG/Border borders for minimalist look */
    /* If user wants clean minimalist, removing boxy borders is key */
    border-bottom: 1px solid #eee;
    padding: 0 0 30px 0;
    margin-bottom: 40px;
    box-shadow: none;
    border-radius: 0;
}

.pd-sidebar-widget:last-child {
    border: none;
}

.pd-sidebar-widget h3 {
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 25px;
    font-weight: 800;
    display: block;
}

/* Newsletter - Keep this one boxed as it's a feature */
.pd-widget-newsletter {
    background: linear-gradient(135deg, #fff 0%, #fffbf0 100%);
    border: 1px solid var(--primary-color);
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(252, 204, 17, 0.1);
}

.pd-newsletter-form input {
    background: #fff;
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 10px;
    font-size: 0.95rem;
}

.pd-btn-glow {
    margin-top: 10px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Clean Recent Posts */
.pd-recent-item {
    margin-bottom: 25px;
}

.pd-recent-link {
    gap: 20px;
}

.pd-recent-thumb img {
    width: 70px;
    height: 70px;
    border-radius: 12px;
}

.pd-recent-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

/* Calendar & Archive Fix (Clean Cards) */
.widget_calendar table {
    width: 100%;
}

.widget_calendar caption {
    font-weight: bold;
    margin-bottom: 10px;
    text-align: left;
}

.widget_calendar th,
.widget_calendar td {
    text-align: center;
    padding: 8px;
}

.widget_calendar td#today {
    background: var(--primary-color);
    border-radius: 50%;
    color: #fff;
}

.widget_archive ul,
.widget_categories ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* Two Column Grid */
    gap: 10px;
}

.widget_archive li,
.widget_categories li {
    background: #f9f9f9;
    padding: 10px 15px;
    border-radius: 8px;
    text-align: center;
    font-size: 0.9rem;
    font-weight: 600;
    transition: 0.3s;
}

.widget_archive li:hover,
.widget_categories li:hover {
    background: var(--primary-color);
    color: #000;
}

.widget_archive li a,
.widget_categories li a {
    text-decoration: none;
    color: inherit;
}

/* ENTRANCE ANIMATIONS */
.pd-fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

.pd-delay-1 {
    animation-delay: 0.2s;
}

.pd-delay-2 {
    animation-delay: 0.4s;
}

.pd-delay-3 {
    animation-delay: 0.6s;
}

.pd-delay-4 {
    animation-delay: 0.8s;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* RESPONSIVE */
@media (max-width: 1300px) {
    .pd-single-grid {
        grid-template-columns: 60px 1fr 300px;
        /* Compress */
        margin-right: 0;
        /* Reset gutter margin */
    }

    .pd-col-content {
        margin-right: 40px;
    }
}

@media (max-width: 1024px) {
    .pd-single-grid {
        display: block;
        /* Stack everything */
    }

    .pd-col-share {
        display: none;
    }

    .pd-col-sidebar {
        width: 100%;
        margin-top: 60px;
    }

    .pd-col-content {
        margin-right: 0;
        max-width: 100%;
    }

    .pd-hero-title {
        font-size: 3rem;
    }

    .pd-container-expansive {
        width: 90%;
    }
}

/* ==========================================================================
   FINAL PRODUCTION POLISH & OPTIMIZATION
   ========================================================================== */

/* 1. Global Overflow Protection */
body {
    overflow-x: hidden !important;
    width: 100%;
    position: relative;
    -webkit-font-smoothing: antialiased;
}

/* 2. Hardware Acceleration for Animations */
.pd-fade-in-up,
.hero-glass-card,
.hero-floating-badge,
.hero-img-wrapper img,
.service-card,
.testimonial-card,
.pd-industry-item,
.pd-featured-image-floating,
.pd-portfolio-card {
    will-change: transform;
    /* Optimizes rendering layer */
}

/* 3. Elite Single Post Featured Image */
.pd-featured-image-floating {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    /* Strict ratio */
    object-fit: cover;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
    transition: transform 0.3s ease-out;
}

/* 4. Minified Utility Cleanup (Simulated) */
/* Optimized Spacing */
.pd-single-hero {
    padding-top: 120px;
    padding-bottom: 80px;
    margin-bottom: 0;
}

.pd-single-grid {
    margin-top: 0;
}

.pd-col-content {
    margin-right: 60px;
}

/* RECENT POSTS WIDGET CLEANUP */
.pd-recent-item {
    margin-bottom: 25px;
}

.pd-recent-link {
    gap: 20px;
    display: flex;
    align-items: center;
    text-decoration: none;
}

.pd-recent-thumb img {
    width: 70px;
    height: 70px;
    border-radius: 12px;
    object-fit: cover;
}

.pd-recent-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--heading-color);
}

.pd-recent-date {
    font-size: 0.8rem;
    color: #999;
    display: block;
    margin-top: 5px;
}

/* RESPONSIVE SAFETY */
@media (max-width: 1300px) {
    .pd-single-grid {
        grid-template-columns: 60px 1fr 300px;
    }

    .pd-col-content {
        margin-right: 40px;
    }
}

@media (max-width: 1024px) {
    .pd-single-grid {
        display: flex;
        flex-direction: column;
    }

    .pd-col-share {
        display: none;
    }

    .pd-col-sidebar {
        width: 100%;
        margin-top: 60px;
    }

    .pd-col-content {
        margin-right: 0;
        max-width: 100%;
    }

    .pd-hero-title {
        font-size: 3rem;
    }

    .pd-container-expansive {
        width: 90%;
    }
}

/* --- SINGLE POST ELITE STYLES --- */

/* 1. Newsletter Box (Join Inner Circle) */
.pd-widget-newsletter {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
}

.pd-widget-newsletter h3 {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 1.5rem;
}

.pd-newsletter-form input {
    width: 100%;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 12px;
    margin-bottom: 15px;
    background: rgba(255, 255, 255, 0.9);
    transition: all 0.3s ease;
}

.pd-newsletter-form input:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(252, 204, 17, 0.2);
    outline: none;
}

/* Solid Yellow Button */
.pd-btn-solid-yellow {
    background-color: var(--primary-color);
    color: #000;
    font-weight: 700;
    border-radius: 12px;
    padding: 15px 30px;
    border: none;
    width: 100%;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}

.pd-btn-solid-yellow:hover {
    transform: scale(1.05);
    background-color: var(--primary-color);
    /* Keep yellow */
    box-shadow: 0 10px 25px rgba(252, 204, 17, 0.4);
}

/* 2. Elite Comment Section */
.pd-comments-wrapper {
    margin-top: 60px;
}

.pd-comment-respond-wrapper {
    padding: 40px;
    border-radius: 20px;
    margin-top: 40px;
}

.pd-comment-respond-wrapper textarea,
.pd-comment-respond-wrapper input[type="text"],
.pd-comment-respond-wrapper input[type="email"],
.pd-comment-respond-wrapper input[type="url"] {
    width: 100%;
    padding: 15px;
    border: 1px solid #eee;
    border-radius: 12px;
    background: #fff;
    margin-bottom: 20px;
    font-family: inherit;
    transition: all 0.3s ease;
}

.pd-comment-respond-wrapper textarea:focus,
.pd-comment-respond-wrapper input:focus {
    border-color: var(--primary-color);
    outline: none;
    box-shadow: 0 0 0 3px rgba(252, 204, 17, 0.1);
}

/* Comment List Styling */
.pd-comment-list {
    list-style: none;
    padding: 0;
}

.pd-comment-list li.comment {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    margin-bottom: 30px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.02);
}

.pd-comment-list .avatar {
    border-radius: 50%;
    border: 2px solid var(--primary-color);
}

.pd-comment-list .comment-body {
    position: relative;
    padding-left: 80px;
}

.pd-comment-list .avatar {
    position: absolute;
    top: 0;
    left: 0;
}

@media (max-width: 768px) {
    .pd-comment-list .comment-body {
        padding-left: 0;
        text-align: center;
    }

    .pd-comment-list .avatar {
        position: relative;
        margin-bottom: 15px;
    }
}


/* 3. Author Box */
.pd-author-box {
    display: flex;
    align-items: center;
    gap: 30px;
    background: linear-gradient(to right, #ffffff, #fafafa);
    padding: 40px;
    border-radius: 20px;
    margin: 60px 0;
    border: 1px solid rgba(0, 0, 0, 0.03);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
}

.pd-author-avatar img {
    border-radius: 50%;
    width: 100px;
    height: 100px;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.pd-author-label {
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    color: #999;
    margin-bottom: 5px;
}

.pd-author-name {
    margin: 0 0 10px;
    font-size: 1.5rem;
}

.pd-author-bio {
    color: var(--text-color);
    margin-bottom: 15px;
    line-height: 1.6;
}

.pd-author-link {
    font-weight: 700;
    color: #2b2b2b;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: gap 0.3s;
}

.pd-author-link:hover {
    gap: 12px;
    color: var(--primary-color);
}

/* 4. Sticky Share Sidebar Improvements */
.pd-sticky-share {
    position: sticky;
    top: 150px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
}

.pd-share-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #333;
    font-size: 1.1rem;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid transparent;
}

.pd-share-icon:hover {
    background-color: var(--primary-color);
    color: #000;
    transform: translateX(5px) scale(1.1);
    box-shadow: 0 10px 20px rgba(252, 204, 17, 0.3);
}


/* 5. Mobile Share Bar */
.pd-mobile-share-bar {
    display: none;
    /* Hidden by default */
    align-items: center;
    justify-content: space-between;
    background: #fff;
    padding: 20px;
    border-radius: 50px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    /* Floating bar effect */
    margin-top: 40px;
    margin-bottom: 40px;
    flex-wrap: wrap;
    gap: 15px;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

.pd-mobile-share-icons {
    display: flex;
    gap: 10px;
}

.show-mobile-only {
    display: none;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .pd-col-share.hide-mobile {
        display: none;
    }

    .pd-mobile-share-bar.show-mobile-only {
        display: flex;
    }

    .pd-author-box {
        flex-direction: column;
        text-align: center;
        padding: 30px;
    }
}

/* --- ELITE ARCHIVE PAGE STYLES --- */

/* Hero */
.pd-archive-hero {
    position: relative;
    padding: 80px 0 60px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 100%);
}

.pd-hero-nodes-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(var(--primary-color) 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.15;
    z-index: -1;
    mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
}

.pd-eyebrow-text {
    display: block;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 2px;
    color: var(--primary-color);
    font-weight: 700;
    margin-bottom: 10px;
}

.pd-archive-title {
    font-size: 3.5rem;
    margin-bottom: 20px;
    background: linear-gradient(135deg, var(--heading-color) 0%, #555 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.pd-archive-desc {
    font-size: 1.1rem;
    color: var(--text-color);
    max-width: 700px;
    margin: 0 auto;
}

/* Featured Post Row (Full Width) */
.pd-archive-featured-row {
    margin-bottom: 60px;
}

.pd-archive-featured-card {
    background: #fff;
    border-radius: 30px;
    border: 1px solid rgba(0, 0, 0, 0.03);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.pd-archive-featured-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.08);
}

.pd-featured-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
}

.pd-feat-media {
    position: relative;
    height: 100%;
    min-height: 400px;
    overflow: hidden;
}

.pd-feat-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.show-hover-zoom:hover img {
    transform: scale(1.08);
}

.pd-card-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: var(--primary-color);
    color: #000;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 4px;
    z-index: 2;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.pd-feat-content {
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.pd-feat-title {
    font-size: 2.2rem;
    margin-bottom: 15px;
    line-height: 1.2;
}

.pd-feat-title a {
    color: var(--heading-color);
    transition: 0.3s;
    text-decoration: none;
}

.pd-feat-title a:hover {
    color: var(--primary-color);
}

.pd-feat-excerpt {
    color: var(--text-color);
    margin-bottom: 25px;
    line-height: 1.6;
    font-size: 1.05rem;
}

/* Grid Cards */
.pd-common-grid-row {
    margin-left: -20px;
    margin-right: -20px;
    display: flex;
    flex-wrap: wrap;
}

.pd-archive-col {
    padding: 0 20px;
    width: 33.333%;
    margin-bottom: 50px;
}

.pd-archive-card {
    background: #fff;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.03);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    height: 100%;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.pd-archive-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.07);
}

.pd-media-ratio {
    padding-top: 56.25%;
    /* 16:9 Aspect Ratio */
    position: relative;
    overflow: hidden;
}

.pd-media-ratio img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.pd-card-body {
    padding: 30px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.pd-card-meta {
    font-size: 0.8rem;
    color: #999;
    text-transform: uppercase;
    margin-bottom: 15px;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pd-card-title {
    font-size: 1.3rem;
    margin-bottom: 12px;
    line-height: 1.4;
}

.pd-card-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: 0.3s;
}

.pd-card-title a:hover {
    color: var(--primary-color);
}

.pd-card-excerpt {
    margin-bottom: auto;
    color: var(--text-color);
    line-height: 1.6;
}

.pd-read-more-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--heading-color);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 20px;
    transition: all 0.3s;
    text-decoration: none;
}

.pd-read-more-link i {
    transition: transform 0.3s;
    color: var(--primary-color);
}

.pd-read-more-link:hover {
    gap: 10px;
    color: var(--primary-color);
}

.pd-read-more-link:hover i {
    transform: translateX(3px);
}

/* Pagination */
.pd-elite-pagination {
    margin-top: 40px;
    margin-bottom: 60px;
}

.pd-elite-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid #eee;
    margin: 0 6px;
    color: var(--heading-color);
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s;
}

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

.pd-elite-pagination .page-numbers.dots {
    border: none;
}

/* Responsive Grid */
@media (max-width: 991px) {
    .pd-archive-grid-3col {
        grid-template-columns: repeat(2, 1fr);
    }

    .pd-featured-grid {
        grid-template-columns: 1fr;
    }

    .pd-feat-media {
        min-height: 300px;
    }

    .pd-feat-content {
        padding: 40px;
    }
}

@media (max-width: 767px) {
    .pd-archive-grid-3col {
        grid-template-columns: 1fr;
    }

    .pd-archive-title {
        font-size: 2.5rem;
    }
}

/* ========================================
   ELITE PRO: ARCHIVE PAGE STYLES
======================================== */

/* Archive Hero */
.pd-archive-hero {
    position: relative;
    padding: 140px 0 80px;
    background: linear-gradient(135deg, #fafafa 0%, #ffffff 100%);
    overflow: hidden;
}

.pd-hero-nodes-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.03;
    background-image: radial-gradient(circle, var(--primary-color) 1px, transparent 1px);
    background-size: 40px 40px;
}

.pd-archive-header-content {
    position: relative;
    z-index: 2;
}

.pd-eyebrow-text {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.pd-archive-title {
    font-size: 3.5rem;
    font-weight: 800;
    color: var(--heading-color);
    margin-bottom: 20px;
    line-height: 1.2;
}

.pd-archive-desc {
    font-size: 1.15rem;
    color: var(--text-color);
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Archive Layout */
.pd-container-expansive {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

.pd-archive-layout-wrapper {
    width: 100%;
}

/* Featured Post Row */
.pd-archive-featured-row {
    margin-bottom: 60px;
}

/* 3-Column Grid */
.pd-archive-grid-3col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

/* Archive Card */
.pd-archive-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.pd-archive-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

/* Fixed Height Featured Image */
.pd-card-media {
    position: relative;
    overflow: hidden;
}

.pd-media-ratio {
    position: relative;
    width: 100%;
    height: 260px;
    /* Fixed height */
    overflow: hidden;
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
}

.pd-media-ratio img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.show-hover-zoom:hover .pd-media-ratio img {
    transform: scale(1.1);
}

.pd-placeholder-img {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f0f0f0 0%, #e5e5e5 100%);
}

/* Yellow Category Badge */
.pd-card-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    padding: 8px 18px;
    border-radius: 30px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    z-index: 2;
}

.pd-badge-yellow {
    background: var(--primary-color);
    color: #000;
    box-shadow: 0 4px 15px rgba(252, 204, 17, 0.4);
}

/* Card Body */
.pd-card-body {
    padding: 30px;
}

.pd-card-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 15px;
}

.pd-separator {
    color: #ddd;
}

.pd-card-title {
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 15px;
}

.pd-card-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color 0.3s;
}

.pd-card-title a:hover {
    color: var(--primary-color);
}

.pd-card-excerpt {
    font-size: 0.95rem;
    color: var(--text-color);
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Featured Post Styles */
.pd-archive-featured-card {
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.pd-featured-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: center;
}

.pd-feat-media {
    position: relative;
    min-height: 450px;
    overflow: hidden;
}

.pd-feat-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.show-hover-zoom:hover img {
    transform: scale(1.08);
}

.pd-feat-content {
    padding: 60px;
}

.pd-feat-title {
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 20px;
}

.pd-feat-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color 0.3s;
}

.pd-feat-title a:hover {
    color: var(--primary-color);
}

.pd-feat-excerpt {
    font-size: 1.05rem;
    color: var(--text-color);
    line-height: 1.7;
    margin-bottom: 30px;
}

.pd-btn-outline {
    display: inline-flex;
    align-items: center;
    padding: 12px 28px;
    border: 2px solid var(--heading-color);
    border-radius: 30px;
    color: var(--heading-color);
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
}

.pd-btn-outline:hover {
    background: var(--heading-color);
    color: #fff;
    transform: translateY(-2px);
}

.pd-btn-sm {
    padding: 10px 24px;
    font-size: 0.9rem;
}

/* ========================================
   ELITE PRO: SINGLE POST STYLES
======================================== */

/* Reading Progress Bar */
#pd-reading-progress-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: rgba(0, 0, 0, 0.05);
    z-index: 9999;
}

#pd-reading-progress-bar {
    height: 100%;
    background: var(--primary-color);
    width: 0%;
    transition: width 0.2s ease;
}

/* Single Hero */
.pd-single-hero {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-top: 80px;
}

.pd-hero-bg-blur {
    position: absolute;
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;
    background-size: cover;
    background-position: center;
    filter: blur(40px);
    transform: scale(1.1);
}

.pd-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.5) 100%);
}

.pd-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 900px;
    padding: 60px 20px;
}

.pd-hero-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 25px;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
}

.pd-hero-cat a {
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 600;
}

.pd-hero-title {
    font-size: 3.5rem;
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 30px;
}

.pd-hero-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.pd-hero-author img {
    border-radius: 50%;
    border: 3px solid var(--primary-color);
}

.pd-author-name {
    color: rgba(255, 255, 255, 0.95);
    font-size: 1rem;
}

/* Fade In Animations */
.pd-fade-in-up {
    opacity: 0;
    animation: fadeInUp 0.8s ease forwards;
}

.pd-delay-1 {
    animation-delay: 0.2s;
}

.pd-delay-2 {
    animation-delay: 0.4s;
}

.pd-delay-3 {
    animation-delay: 0.6s;
}

.pd-delay-4 {
    animation-delay: 0.8s;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Single Post Grid */
.pd-single-grid {
    display: grid;
    grid-template-columns: 80px 1fr 320px;
    gap: 60px;
    align-items: start;
}

/* Left Share Column */
.pd-col-share {
    position: relative;
}

.pd-sticky-share {
    position: sticky;
    top: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.share-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #888;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.pd-share-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    color: #666;
    text-decoration: none;
    transition: all 0.3s;
    font-size: 1rem;
}

.pd-share-icon:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.pd-share-icon.fb:hover {
    background: #1877f2;
    color: #fff;
}

.pd-share-icon.tw:hover {
    background: #1da1f2;
    color: #fff;
}

.pd-share-icon.ln:hover {
    background: #0077b5;
    color: #fff;
}

.pd-share-icon.wa:hover {
    background: #25d366;
    color: #fff;
}

/* Center Content Column - MAX WIDTH 900PX */
.pd-col-content {
    width: 100%;
}

.pd-single-content-wrapper {
    max-width: 900px;
    margin: 0 auto;
}

/* Featured Image */
.pd-featured-image-wrapper {
    margin: -100px 0 60px;
    position: relative;
}

.pd-featured-image-floating {
    width: 100%;
    border-radius: 24px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.2);
    border: 8px solid #fff;
}

.pd-wide-image {
    display: block;
}

/* Typography */
.pd-pro-typography {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--text-color);
}

.pd-pro-typography p {
    margin-bottom: 30px;
}

.pd-pro-typography h2,
.pd-pro-typography h3,
.pd-pro-typography h4 {
    color: var(--heading-color);
    font-weight: 700;
    margin-top: 50px;
    margin-bottom: 25px;
    line-height: 1.3;
}

.pd-pro-typography h2 {
    font-size: 2.2rem;
}

.pd-pro-typography h3 {
    font-size: 1.8rem;
}

.pd-pro-typography h4 {
    font-size: 1.4rem;
}

.pd-pro-typography blockquote {
    border-left: 4px solid var(--primary-color);
    padding-left: 30px;
    margin: 40px 0;
    font-style: italic;
    font-size: 1.25rem;
    color: #555;
}

.pd-pro-typography ul,
.pd-pro-typography ol {
    margin-bottom: 30px;
    padding-left: 30px;
}

.pd-pro-typography li {
    margin-bottom: 12px;
}

/* Entry Footer */
.pd-entry-footer {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 2px solid #f0f0f0;
}

.pd-tags-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.tag-label {
    font-weight: 700;
    color: var(--heading-color);
    margin-right: 8px;
}

.pd-tags-list a {
    display: inline-block;
    padding: 6px 16px;
    background: #f5f5f5;
    border-radius: 20px;
    color: var(--text-color);
    text-decoration: none;
    font-size: 0.85rem;
    transition: all 0.3s;
}

.pd-tags-list a:hover {
    background: var(--primary-color);
    color: #000;
}

/* Mobile Share Bar */
.pd-mobile-share-bar {
    display: none;
    margin: 40px 0;
    padding: 25px;
    background: #f9f9f9;
    border-radius: 16px;
    text-align: center;
}

.pd-mobile-share-icons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 15px;
}

/* PREMIUM AUTHOR BOX */
.pd-author-box {
    display: flex;
    gap: 30px;
    align-items: flex-start;
    padding: 40px;
    background: linear-gradient(135deg, #fafafa 0%, #ffffff 100%);
    border-radius: 20px;
    margin: 60px 0;
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.pd-author-avatar img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 4px solid var(--primary-color);
    box-shadow: 0 8px 20px rgba(252, 204, 17, 0.3);
}

.pd-author-info {
    flex: 1;
}

.pd-author-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.pd-author-name {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--heading-color);
    margin-bottom: 15px;
}

.pd-author-bio {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--text-color);
    margin-bottom: 20px;
}

.pd-author-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--heading-color);
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
}

.pd-author-link:hover {
    color: var(--primary-color);
    gap: 12px;
}

.pd-author-link i {
    transition: transform 0.3s;
}

.pd-author-link:hover i {
    transform: translateX(3px);
}

/* Right Sidebar */
.pd-col-sidebar {
    position: relative;
}

.pd-sidebar-sticky-inner {
    position: sticky;
    top: 120px;
}

.pd-sidebar-widget {
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    margin-bottom: 30px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.pd-sidebar-widget h3 {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--heading-color);
    margin-bottom: 20px;
}

/* Newsletter Widget - FIXED SUBSCRIBE BUTTON */
.pd-widget-newsletter p {
    font-size: 0.95rem;
    color: var(--text-color);
    line-height: 1.6;
    margin-bottom: 20px;
}

.pd-newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pd-newsletter-form input[type="email"] {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid #eee;
    border-radius: 12px;
    font-size: 0.95rem;
    outline: none;
    transition: border-color 0.3s;
}

.pd-newsletter-form input[type="email"]:focus {
    border-color: var(--primary-color);
}

/* SOLID YELLOW SUBSCRIBE BUTTON */
.pd-btn-solid-yellow {
    width: 100%;
    padding: 14px 20px;
    background: var(--primary-color) !important;
    color: #000 !important;
    border: none !important;
    border-radius: 12px;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(252, 204, 17, 0.3);
}

.pd-btn-solid-yellow:hover {
    background: #eebb00 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(252, 204, 17, 0.4);
}

/* Recent Posts Widget */
.pd-recent-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.pd-recent-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
}

.pd-recent-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.pd-recent-link {
    display: flex;
    gap: 15px;
    text-decoration: none;
    transition: opacity 0.3s;
}

.pd-recent-link:hover {
    opacity: 0.8;
}

.pd-recent-thumb {
    width: 70px;
    height: 70px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
}

.pd-recent-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pd-recent-info {
    flex: 1;
}

.pd-recent-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--heading-color);
    line-height: 1.4;
    margin-bottom: 6px;
}

.pd-recent-date {
    font-size: 0.8rem;
    color: #888;
}

/* ========================================
   COMMENTS & REPLY FORM STYLING
======================================== */

.pd-comments-wrapper {
    margin-top: 60px;
}

.pd-comments-area {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.pd-comments-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--heading-color);
    margin-bottom: 30px;
}

.pd-comment-list {
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
}

.pd-comment-list li {
    margin-bottom: 25px;
    padding: 25px;
    background: #f9f9f9;
    border-radius: 16px;
}

/* LEAVE A REPLY FORM - CLEAN & PADDED */
.pd-comment-respond-wrapper {
    padding: 40px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(250, 250, 250, 0.9) 100%);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.comment-reply-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--heading-color);
    margin-bottom: 25px;
}

.comment-form p {
    margin-bottom: 20px;
}

.comment-form label {
    display: block;
    font-weight: 600;
    color: var(--heading-color);
    margin-bottom: 8px;
    font-size: 0.95rem;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid #eee;
    border-radius: 12px;
    font-size: 0.95rem;
    font-family: inherit;
    outline: none;
    transition: all 0.3s;
    background: #fff;
}

.comment-form input:focus,
.comment-form textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(252, 204, 17, 0.1);
}

.comment-form textarea {
    min-height: 150px;
    resize: vertical;
}

/* YELLOW SUBMIT BUTTON FOR COMMENT FORM */
.comment-form .submit,
.comment-form input[type="submit"] {
    padding: 14px 32px;
    background: var(--primary-color) !important;
    color: #000 !important;
    border: none !important;
    border-radius: 12px;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(252, 204, 17, 0.3);
}

.comment-form .submit:hover,
.comment-form input[type="submit"]:hover {
    background: #eebb00 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(252, 204, 17, 0.4);
}

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

.hide-mobile {
    display: block;
}

.show-mobile-only {
    display: none;
}

@media (max-width: 1200px) {
    .pd-single-grid {
        grid-template-columns: 1fr 300px;
        gap: 40px;
    }

    .pd-col-share {
        display: none;
    }

    .show-mobile-only {
        display: block;
    }
}

@media (max-width: 991px) {
    .pd-single-grid {
        grid-template-columns: 1fr;
    }

    .pd-col-sidebar {
        display: none;
    }

    .pd-hero-title {
        font-size: 2.5rem;
    }

    .pd-archive-title {
        font-size: 2.8rem;
    }

    .pd-container-expansive {
        padding: 0 20px;
    }
}

@media (max-width: 767px) {
    .pd-hero-title {
        font-size: 2rem;
    }

    .pd-archive-title {
        font-size: 2.2rem;
    }

    .pd-author-box {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }

    .pd-featured-image-wrapper {
        margin-top: -50px;
    }

    .pd-comment-respond-wrapper {
        padding: 25px;
    }
}

/* ========================================
   ULTIMATE ELITE BLOG OVERRIDES
   Forcing SaaS Agency High-End Design
======================================== */

/* 1. Header & Navigation Re-alignment */
header.site-header {
    width: 95% !important;
    max-width: 1400px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    align-items: center !important;
    height: 85px !important;
}

.header-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 20px !important;
}

.main-navigation {
    flex: 1 !important;
    display: flex !important;
    justify-content: center !important;
}

.primary-menu {
    display: flex !important;
    gap: 40px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

.header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
}

/* 2. Magazine Grid & Featured (Strict 16/9) */
.pd-magazine-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 40px !important;
    margin-bottom: 60px;
}

.pd-featured-post-wrapper {
    margin-bottom: 80px;
}

.pd-featured-magazine-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    /* 50% split */
    background: #ffffff !important;
    border-radius: 20px !important;
    /* Strict 20px */
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
    /* Strict shadow */
    align-items: center;
}

.pd-magazine-img-wrap,
.pd-featured-img-wrap {
    position: relative !important;
    aspect-ratio: 16 / 9 !important;
    /* FORCED */
    overflow: hidden !important;
    background: #f0f0f0 !important;
}

.pd-magazine-img-wrap img,
.pd-featured-img-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.6s ease !important;
}

.pd-magazine-card:hover img,
.pd-featured-magazine-card:hover img {
    transform: scale(1.08) !important;
}

.pd-magazine-card {
    background: #fff;
    border-radius: 20px !important;
    /* Strict 20px */
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
    /* Strict shadow */
}

.pd-magazine-card:hover {
    transform: translateY(-10px) !important;
    /* Strict -10px */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
}

.pd-category-badge {
    position: absolute !important;
    top: 20px !important;
    left: 20px !important;
    background: #fccc11 !important;
    color: #000 !important;
    font-weight: 800 !important;
    padding: 6px 14px !important;
    border-radius: 4px !important;
    font-size: 0.75rem !important;
    z-index: 10 !important;
    text-transform: uppercase;
}

.pd-magazine-excerpt {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* 3. Single Post - Luxury UX */
.pd-single-luxury-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 60px 20px !important;
}

.pd-single-main-content {
    max-width: 850px !important;
    /* STRICT */
    margin: 0 auto !important;
}

.pd-luxury-typography {
    font-size: 1.15rem;
    line-height: 1.8 !important;
    /* STRICT */
    color: #333;
}

.pd-luxury-typography p {
    margin-bottom: 30px;
}

.pd-luxury-typography h1,
.pd-luxury-typography h2,
.pd-luxury-typography h3 {
    font-weight: 800 !important;
    /* STRICT BOLD */
    color: #000;
    margin: 50px 0 25px;
}

.pd-luxury-typography h1 {
    font-size: 2.5rem;
}

.pd-luxury-typography h2 {
    font-size: 2rem;
}

.pd-luxury-typography h3 {
    font-size: 1.6rem;
}

/* Sticky Social Icons Hover */
.pd-social-share-btn {
    width: 45px;
    height: 45px;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f8f8f8 !important;
    /* Light background by default */
    color: #000000 !important;
    /* STRICT BLACK ICON */
    border: none !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    text-decoration: none !important;
    margin-bottom: 12px;
}

.pd-social-share-btn:hover {
    background-color: #fccc11 !important;
    /* YELLOW BACKGROUND ON HOVER */
    transform: scale(1.1) !important;
    box-shadow: 0 5px 15px rgba(252, 204, 17, 0.3) !important;
}

.pd-social-share-btn i {
    font-size: 1rem !important;
    color: #000000 !important;
    /* ICON STAYS BLACK */
}

/* 4. SOLID YELLOW ELEMENTS */
/* GLOBAL ELITE BRANDING */
.pd-btn-read-featured,
.pd-btn-subscribe-yellow,
.pd-btn-solid-yellow,
.pd-btn-elite-hero,
.pd-btn-glow-elite,
.pd-luxury-comments-section .comment-form .submit,
.pd-comment-respond-wrapper .submit,
.pd-newsletter-inline-form button {
    background-color: #fccc11 !important;
    color: #000000 !important;
    font-weight: 700 !important;
    /* STRICT 700 */
    border-radius: 12px !important;
    /* STRICT 12px */
    padding: 16px 32px !important;
    text-transform: uppercase !important;
    display: inline-block !important;
    text-align: center;
    border: none !important;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    letter-spacing: 0.5px;
    width: auto !important;
}

.pd-btn-read-featured:hover,
.pd-btn-subscribe-yellow:hover,
.pd-btn-solid-yellow:hover,
.pd-btn-elite-hero:hover,
.pd-btn-glow-elite:hover,
.pd-comment-respond-wrapper .submit:hover,
.pd-newsletter-inline-form button:hover {
    background-color: #eebb00 !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(252, 204, 17, 0.3) !important;
}

/* Comment Form Redesign */
.pd-luxury-comments-section .comment-form input[type="text"],
.pd-luxury-comments-section .comment-form input[type="email"],
.pd-luxury-comments-section .comment-form input[type="url"],
.pd-luxury-comments-section .comment-form textarea,
.pd-comment-respond-wrapper input[type="text"],
.pd-comment-respond-wrapper input[type="email"],
.pd-comment-respond-wrapper textarea {
    width: 100% !important;
    padding: 15px !important;
    /* STRICT 15px */
    border: 1.5px solid #eee !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    outline: none !important;
    transition: all 0.2s ease !important;
    background: #fff !important;
}

.pd-luxury-comments-section .comment-form input:focus,
.pd-luxury-comments-section .comment-form textarea:focus,
.pd-comment-respond-wrapper input:focus,
.pd-comment-respond-wrapper textarea:focus {
    border-color: #fccc11 !important;
    /* STRICT YELLOW BORDER */
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(252, 204, 17, 0.1) !important;
}

/* ========================================
   ELITE PRO BLOG REFINEMENTS
   ======================================== */

/* 1. Blog Archive Hero (2-Column Flex) */
.pd-archive-hero-elite {
    padding: 160px 0 100px;
    background: #fff;
    border-bottom: 1px solid #f0f0f0;
}

.pd-hero-flex-layout {
    display: flex;
    align-items: center;
    gap: 80px;
}

.pd-hero-image-col {
    flex: 1;
    max-width: 50%;
}

.pd-hero-text-col {
    flex: 1;
    max-width: 50%;
}

.pd-hero-featured-img-wrap {
    position: relative;
    border-radius: 30px;
    overflow: hidden;
    aspect-ratio: 16/10;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.1);
}

.pd-hero-img-elite {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pd-category-badge-elite {
    position: absolute;
    top: 30px;
    left: 30px;
    background: #fccc11;
    color: #000;
    font-weight: 800;
    padding: 8px 18px;
    border-radius: 8px;
    font-size: 0.75rem;
    text-transform: uppercase;
}

.pd-archive-title {
    font-size: 3.5rem !important;
    font-weight: 900 !important;
    line-height: 1.1;
    margin-bottom: 20px;
    letter-spacing: -2px;
}

.pd-archive-desc {
    font-size: 1.2rem;
    color: #666;
    margin-bottom: 40px;
    max-width: 500px;
    line-height: 1.6;
}

.pd-hero-featured-title {
    font-size: 1.8rem;
    font-weight: 800;
    margin-bottom: 25px;
    color: #000;
}

/* 2. Single Post Elite Meta & Hero */
.pd-single-hero-elite {
    padding: 180px 0 60px;
    text-align: center;
}

.pd-category-badge-pill {
    display: inline-block;
    background: #fccc11;
    color: #000;
    font-weight: 800;
    padding: 6px 20px;
    border-radius: 50px;
    /* PILL */
    font-size: 0.8rem;
    text-transform: uppercase;
    margin-bottom: 25px;
    box-shadow: 0 10px 20px rgba(252, 204, 17, 0.2);
}

.pd-single-hero-title-elite {
    font-size: 4rem !important;
    font-weight: 900 !important;
    line-height: 1.1;
    max-width: 900px;
    margin: 0 auto 30px !important;
    letter-spacing: -2px;
}

.pd-single-meta-elite {
    display: flex;
    justify-content: center;
    gap: 30px;
    color: #888;
    /* MUTED GREY */
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.pd-single-meta-elite i {
    color: #fccc11;
    margin-right: 8px;
    font-size: 14px;
}

/* 3. Featured Image Container (Premium Wrap) */
.pd-single-featured-img-premium {
    margin-top: 60px;
    margin-bottom: 80px;
    /* STRICT 80px */
    padding: 15px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 40px;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.08);
    /* SOFT SHADOW */
}

.pd-featured-img-glass-wrap {
    border-radius: 30px;
    overflow: hidden;
    position: relative;
    aspect-ratio: 16/9;
}

.pd-single-featured-img-zoom {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.pd-single-featured-img-premium:hover .pd-single-featured-img-zoom {
    transform: scale(1.1);
}

/* 4. Newsletter Bar Redesign (Minimalist Horizontal) */
.pd-newsletter-bar-elite {
    background: #111;
    /* DEEP BLACK */
    padding: 60px;
    border-radius: 30px;
    margin: 60px 0;
    color: #fff;
}

.pd-newsletter-bar-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.pd-newsletter-text h3,
.pd-insider-count {
    font-size: 1.8rem;
    font-weight: 900;
    color: #fff;
    display: block;
    margin-bottom: 5px;
}

.pd-newsletter-text p {
    margin: 0;
    opacity: 0.6;
}

.pd-newsletter-inline-form {
    display: flex;
    gap: 15px;
    flex: 1;
    max-width: 500px;
}

.pd-newsletter-inline-form input {
    flex: 1;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 16px 20px;
    color: #fff;
    outline: none;
    transition: all 0.3s;
}

.pd-newsletter-inline-form input:focus {
    border-color: #fccc11;
    background: rgba(255, 255, 255, 0.1);
}

/* 5. Author Box Elite */
.pd-author-box-elite {
    display: flex;
    align-items: center;
    gap: 40px;
    background: #fdfdfd;
    padding: 50px;
    border-radius: 30px;
    border: 1px solid #f0f0f0;
    margin: 60px 0;
}

/* RESPONSIVE FIXES */
@media (max-width: 1024px) {
    .pd-hero-flex-layout {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }

    .pd-hero-image-col,
    .pd-hero-text-col {
        max-width: 100%;
    }

    .pd-newsletter-bar-content {
        flex-direction: column;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .pd-archive-title {
        font-size: 2.5rem !important;
    }

    .pd-single-hero-title-elite {
        font-size: 2.2rem !important;
    }

    .pd-single-meta-elite {
        flex-direction: column;
        gap: 10px;
    }
}

/* ==========================================================================
   REGRESSION FIXES & MOBILE OPTIMIZATION - ELITE PRO
   ========================================================================== */

/* 1. Admin Bar Conflict Fix */
body.admin-bar .site-header {
    top: 32px !important;
}

@media (max-width: 782px) {
    body.admin-bar .site-header {
        top: 46px !important;
        /* WP Mobile Admin Bar is taller */
    }
}

/* 2. Service Tabs - Elite Polish */
.pd-tab-item {
    position: relative;
    overflow: hidden;
}

.pd-tab-item.active {
    box-shadow: inset 0 -3px 0 #fccc11 !important;
    /* Subtle Underline Glow */
    background: rgba(252, 204, 17, 0.05) !important;
}

.pd-tab-item.active .pd-tab-text {
    font-weight: 800 !important;
}

.pd-tab-content {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.pd-tab-content.active {
    display: flex;
    opacity: 1;
}

/* 3. Global Mobile Container Safety */
@media (max-width: 1024px) {

    .header-container,
    .container,
    .pd-single-luxury-container,
    .pd-archive-hero-elite .pd-hero-flex-layout {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* 4. Elite Mobile Header Refinements */
@media (max-width: 768px) {
    header.site-header {
        height: 70px !important;
        top: 10px !important;
        width: 95% !important;
    }

    .header-container {
        padding: 0 20px !important;
        /* Equal side padding for Logo & Hamburger */
    }

    .site-logo h2 {
        font-size: 20px !important;
    }

    .mobile-toggle {
        font-size: 22px !important;
    }

    /* Off-Canvas Logo Polish */
    .off-canvas-header img {
        max-height: 50px !important;
        width: auto !important;
    }
}

/* 5. Archive Hero - Vertical Stack Mobile */
@media (max-width: 991px) {
    .pd-hero-flex-layout {
        flex-direction: column !important;
        text-align: center !important;
        gap: 40px !important;
    }

    .pd-hero-image-col,
    .pd-hero-text-col {
        max-width: 100% !important;
        width: 100% !important;
    }

    .pd-hero-text-col {
        padding: 0 10px;
    }

    .pd-hero-featured-img-wrap {
        aspect-ratio: 16/9;
    }
}

/* 6. Single Post - Mobile Polish */
@media (max-width: 768px) {
    .pd-single-hero-title-elite {
        font-size: 2rem !important;
        line-height: 1.2 !important;
        padding: 0 10px !important;
    }

    .pd-single-featured-img-premium {
        margin-bottom: 40px !important;
        padding: 8px !important;
    }

    /* Newsletter Bar - Vertical Stack */
    .pd-newsletter-bar-elite {
        padding: 40px 20px !important;
    }

    .pd-newsletter-bar-content {
        flex-direction: column !important;
        gap: 30px !important;
    }

    .pd-newsletter-inline-form {
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .pd-newsletter-inline-form input,
    .pd-newsletter-inline-form button {
        width: 100% !important;
    }
}