/*
Theme Name: ST Ayurvedic
Theme URI: https://striviothemes.com/product/st-ayurvedic/
Author: KristynaBennett
Author URI: https://striviothemes.com/
Description: STAyurvedic is a clean, modern, and fully responsive WP theme designed for Ayurvedic clinics, wellness centers, yoga studios, herbal product stores, naturopathy services, health consultants, and holistic healing businesses. Built with performance and simplicity in mind, the theme offers an elegant design that helps showcase services, treatments, products, testimonials, and wellness programs professionally. The theme comes with customizable homepage sections, mobile-friendly layouts, SEO-optimized structure, and seamless compatibility with popular plugins like WooCommerce, MetForm, and Elementor. Whether you are creating a website for an Ayurvedic doctor, spa, meditation center, or organic lifestyle brand, STayurvedic provides everything needed to build a beautiful and trustworthy online presence. Create a calming and professional wellness website effortlessly with STAyurvedic.
Version: 1.1
Requires at least: 4.7
Requires PHP: 5.2
Tested up to: 7.0
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: st-ayurvedic
Tags: blog, one-column, custom-background, custom-colors, full-width-template, custom-menu, custom-logo, featured-images, sticky-post, theme-options, threaded-comments, translation-ready
*/

/* Based on Normalize.css v8.0.0, HTML5 Boilerplate v6.1.0, & Bootstrap Reboot v4.1.0 | Under MIT License */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}
body{
	font-family:'Inter', sans-serif;!important
}
.contact-info {
            flex: 1;
            min-width: 320px;
            background: linear-gradient(135deg, #0f2027, #203a43, #2c5364);
            color: #ffffff;
            padding: 50px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .contact-info h2 {
            font-size: 2rem;
            margin-bottom: 15px;
            font-weight: 600;
        }

        .contact-info p {
            color: #b9ced5;
            margin-bottom: 40px;
        }

        .info-item {
            display: flex;
            align-items: center;
            margin-bottom: 25px;
        }

        .info-item .icon {
            font-size: 1.5rem;
            margin-right: 20px;
            background: rgba(255, 255, 255, 0.1);
            width: 50px;
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: #00adb5;
        }

        .info-item div span {
            display: block;
            font-size: 0.85rem;
            color: #a0b2b8;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .info-item div a, .info-item div p {
            font-size: 1.15rem;
            color: #ffffff;
            text-decoration: none;
            font-weight: 500;
            margin: 0;
        }

        .info-item div a:hover {
            color: #00adb5;
        }

        /* Right Side: Contact Form */
        .contact-form-container {
            flex: 1.2;
            min-width: 320px;
            padding: 50px;
        }

        .contact-form-container h3 {
            font-size: 1.8rem;
            margin-bottom: 25px;
            color: #2c5364;
        }

        .form-group {
            margin-bottom: 20px;
        }

        .form-group label {
            display: block;
            margin-bottom: 8px;
            font-weight: 500;
            font-size: 0.9rem;
            color: #555;
        }

        .form-group input, .form-group textarea {
            width: 100%;
            padding: 12px 15px;
            border: 1px solid #ccc;
            border-radius: 6px;
            font-size: 1rem;
            transition: all 0.3s ease;
            outline: none;
        }

        .form-group input:focus, .form-group textarea:focus {
            border-color: #00adb5;
            box-shadow: 0 0 8px rgba(0, 173, 181, 0.2);
        }

        .submit-btn {
            background-color: #00adb5;
            color: white;
            border: none;
            padding: 14px 28px;
            font-size: 1rem;
            font-weight: 600;
            border-radius: 6px;
            cursor: pointer;
            transition: background 0.3s ease;
            width: 100%;
        }

        .submit-btn:hover {
            background-color: #00848a;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .container {
                flex-direction: column;
            }
            .contact-info, .contact-form-container {
                padding: 30px;
            }
        }
.section-header h4:after {
    content: '';
    width: 80px;
    display: block;
    height: 2px;
    background: #0d89d3;
    text-align: center;
    margin: 0px auto;
    margin-top: 10px;
}
.airline-body-content a{
	    color: #0d89d3;
}
.schema-faq-section {
    margin-bottom: 10px;
}
.schema-faq-section .schema-faq-question {
    background: #00275e;
    width: 100%;
    display: block;
    color: #fff;
    padding: 15px;
}
.schema-faq-section .schema-faq-question:before {
    content: 'Q :-';
    margin-right: 10px;
}
.schema-faq-section .schema-faq-answer:before {
    content: 'Ans :-';
    margin-right: 10px;
}
.schema-faq-section .schema-faq-answer{
	padding: 15px;
    background: #0d89d3;
    color: #fff;
}
/* Section Wrapper */
.process-section-wrapper {
    background: linear-gradient(rgb(0 0 0 / 97%), rgb(0 0 0 / 54%)), url(/wp-content/uploads/2026/06/paralix.png);
    padding: 60px 20px;
    text-align: center;
    background-attachment: fixed;
}

.process-main-title {
    font-size: 36px;
    color: #fff;
    margin-bottom: 10px;
    font-weight: 700;
}

.process-subtitle {
    font-size: 16px;
    color: #fff;
    margin-bottom: 50px;
}
.section-header h4{
	font-weight:bold
}
/* Core Section Layout Config */
.custom-cta-section {
    width: 100%;
    background-color: #00275e; /* Normal Background State */
    padding:0px 20px;
    position: relative;
    overflow: hidden;
    transition: background-color 0.4s ease;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Section Main Container Box */
.cta-container {
    max-width: 1200px;
    width: 100%;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr; /* Content and image balancing */
    align-items: center;
    position: relative;
    z-index: 5;
}

/* Left Text Container Alignments */
.cta-text-content {
    text-align: left;
    color: #ffffff;
    padding-right: 30px;
}

/* Upper Floating Sub-badge tag */
.cta-sub-tag {
    background-color: rgba(255, 255, 255, 0.15);
    color: #ffffff;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 8px;
    display: inline-block;
    margin-bottom: 20px;
    text-transform: capitalize;
    letter-spacing: 0.5px;
}

/* Bold Main Title Styling */
.cta-main-title {
    font-size: 42px;
    font-weight: 700;
    line-height: 1.25;
    color: #ffffff;
    margin: 0 0 30px 0 !important;
}

/* Call To Action White Solid Button */
.cta-btn-call {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: #ffffff;
    color: #00275e; /* Matching parent background */
    padding: 14px 35px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none !important;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

/* Right Section Graphics Handler */
.cta-image-holder {
    position: relative;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

/* Faint World Map Design Overlays */
.cta-map-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 130%;
    height: 130%;
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/8/80/World_map_blank_black_white.svg'); /* Clean world map default placeholder */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.08; /* Blended world map effect */
    z-index: 1;
    pointer-events: none;
}

/* Pop Out Traveler Image Properties */
.cta-traveler-img {
    max-height: 380px;
    width: auto;
    object-fit: contain;
    position: relative;
    z-index: 2;
    bottom: -60px; /* Gives the classic travelzylo absolute cut overflow look */
}

/* --- DYNAMIC SECTION HOVER STATES --- */
.custom-cta-section:hover .cta-btn-call {
    color: #0d89d3; /* Button text switches match with sky blue theme */
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
}

/* --- 100% SMART RESPONSIVE VIEWPORT CONTROLS --- */
@media (max-width: 991px) {
    .cta-main-title {
        font-size: 34px;
    }
    .cta-traveler-img {
        max-height: 300px;
        bottom: -60px;
    }
}

@media (max-width: 768px) {
    .custom-cta-section {
        padding: 50px 20px 0 20px; /* Bottom padding zero for cleaner mobile layouts */
    }
    .cta-container {
        grid-template-columns: 1fr; /* Stack elements linear vertical on mobile */
        text-align: center;
        gap: 40px;
    }
    .cta-text-content {
        text-align: center;
        padding-right: 0;
    }
    .cta-image-holder {
        justify-content: center;
    }
    .cta-traveler-img {
        max-height: 280px;
        bottom: 0; /* Align perfectly back with base boundaries on smaller viewports */
    }
}
/* Grid Layout (4 Columns for Desktop) */
.process-grid-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 30px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Base Card Setup */
.process-card {
    position: relative;
    height: 280px;
}

/* Background Color Shape (Asymmetric Backbox) */
.process-card .bg-shape {
    position: absolute;
    top: 0;
    left: 0;
    width: 85%;
    height: 90%;
    background-color: #00275e; /* Normal Blue */
    border-radius: 20px;
    transition: background-color 0.3s ease;
}

/* Foreground White Content Box */
.process-card .content-box {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 95%;
    height: 95%;
    background: #ffffff;
    border-radius: 20px;
    padding: 25px;
    box-sizing: border-box;
    text-align: left;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Step Number Badge */
.process-card .step-number {
    position: absolute;
    top:-14px;
    right: 20px;
    background-color: #00275e; /* Normal Blue */
    color: #fff;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

/* Text Stylings Inside Cards */
.process-card .content-box h3 {
    font-size: 16px;
    color: #1a1a1a;
    margin: 0 0 10px 0;
    font-weight: 600;
    line-height: 20px;
}
.process-card .content-box p {
    font-size: 14px;
    color: #000;
    margin: 0;
    line-height: 1.5;
}

/* --- HOVER EFFECTS --- */
.process-card:hover .bg-shape {
    background-color: #0d89d3; /* Hover Blue */
}

.process-card:hover .step-number {
    background-color: #0d89d3; /* Hover Blue */
}

/* --- RESPONSIVE DESIGN --- */

/* Tablets View */
@media (max-width: 1024px) {
    .process-grid-container {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on tablets */
        gap: 30px;
    }
}

/* Mobile View */
@media (max-width: 600px) {
    .process-grid-container {
        grid-template-columns: 1fr; /* 1 column on mobile devices */
        gap: 25px;
    }
    .process-card {
        height: 250px; /* Slight compact height for small screens */
    }
}
.footdis{
	padding: 10px 0px;
    color: #fff;
}
.footercall {
    position: fixed;
    width: 100%;
    line-height: 50px;
    height: 50px !important;
    bottom: 0;
    text-align: center;
    z-index: 999;
}
.footercall button {
    width: 100%;
    background: #0d89d3;
    border: 0px;
}
.footercall button:hover {
    width: 100%;
    background: #0d89d3;
    border: 0px;
}
.footercall button .content {
    color: #fff;
    font-size: 24px;
    text-transform: capitalize;
}
.footercall button .content svg {
    width: 30px;
    height: 25px;
    float: none;
    margin-top: 0;
    margin-right: 0;
}
.footercall button .content svg path {
    fill: #fff;
}
.footercall button .content svg path:nth-child(2) {
    -webkit-animation: header-phone 1s infinite cubic-bezier(.1,.57,.5,1);
    animation: header-phone 1s infinite cubic-bezier(.1,.57,.5,1)
}

.footercall button .content svg path:nth-child(3) {
    -webkit-animation: header-phone2 1s infinite cubic-bezier(.1,.57,.5,1);
    animation: header-phone2 1s infinite cubic-bezier(.1,.57,.5,1)
}

@-webkit-keyframes header-phone {
    0%,30% {
        opacity: 0;
        -webkit-transform: translate3d(-20px,20px,0);
        transform: translate3d(-20px,20px,0)
    }

    80% {
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        opacity: 0
    }
}

@keyframes header-phone {
    0%,30% {
        opacity: 0;
        -webkit-transform: translate3d(-20px,20px,0);
        transform: translate3d(-20px,20px,0)
    }

    80% {
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes header-phone2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20px,20px,0);
        transform: translate3d(-20px,20px,0)
    }

    70%,90% {
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        opacity: 0
    }
}

@keyframes header-phone2 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20px,20px,0);
        transform: translate3d(-20px,20px,0)
    }

    70%,90% {
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        opacity: 0
    }
}
.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.card-content h3 a:hover{
	color:#0d89d3
}
.front_pges {
    background: linear-gradient(rgb(0 0 0 / 11%), rgb(0 0 0 / 70%)), url(/wp-content/uploads/2026/06/banner.webp);
    width: 100%;
    color: #fff;
    background-position: 100% 30% !important;
    background-size: cover !important;
    padding: 10% 0% 10% 0%;
}
/* Card aur Text ko sahi se dikhane ke liye CSS */
.wp-custom-pages-grid {
    clear: both !important;
    display: block !important;
    margin-bottom: 40px !important;
}

.dynamic-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
}

.dynamic-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.dynamic-card .card-body a {
    color: #00275e !important;
    text-decoration: none !important;
    font-weight: 600 !important;
	transition:0.9s;
}
/* ---- AIRPLANE FLYING & FLOATING ANIMATION ---- */

.flying-airplane-vector {
    transform: rotate(45deg); /* Initital Takeoff Angle */
    animation: smoothTakeoff 4s ease-in-out infinite; /* Continuous Flight Loop */
    will-change: transform;
}

/* Keyframes jo Plane ko hawa me upar-niche aur thoda aage-piche chalayengi (Turbulence Effect) */
@keyframes smoothTakeoff {
    0% {
        transform: rotate(45deg) translate(0, 0);
    }
    50% {
        transform: rotate(43deg) translate(8px, -12px); /* Fly up and slightly forward */
    }
    100% {
        transform: rotate(45deg) translate(0, 0); /* Safely come back to loop */
    }
}

/* Card Hover lagne par Airplane thoda aur speed se takeoff karega */
.brand-master-card:hover .flying-airplane-vector {
    animation: cardHoverFly 1.5s cubic-bezier(0.25, 1, 0.5, 1) infinite alternate;
}

@keyframes cardHoverFly {
    0% {
        transform: rotate(45deg) scale(1) translate(0, 0);
    }
    100% {
        transform: rotate(48deg) scale(1.15) translate(15px, -20px); /* Zooms & flies higher on card hover */
    }
}


/* --- PURANA VALA REQUIRED CORE CSS (Same to Same) --- */
.brand-master-card {
    width: 100% !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    border-bottom: 4px solid #00275e !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
	margin-bottom:20px!important;
}
.brand-img-box-wrap {
    position: relative !important;
    padding-top:45% !important;
    width: 100% !important;
    background-color: #f4f6f9 !important;
    overflow: hidden !important;
}
.brand-card-img-src {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.5s ease !important;
}
.brand-fallback-vector {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
}
.brand-card-text-container {
    padding: 24px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-align: center !important;
    background: #ffffff !important;
    min-height: 120px !important;
    position: relative !important;
    z-index: 5 !important;
}
.brand-title-heading {
    font-size: 1rem !important;
    font-weight: 700 !important;
    margin: 0 0 15px 0 !important;
    line-height: 1.4 !important;
    display: block !important;
}
.brand-anchor-link-spec {
    color: #00275e !important;
    text-decoration: none !important;
    transition: color 0.25s ease !important;
    display: inline-block !important;
}
.brand-action-btn-layout {
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    color: #00275e !important;
    border: 1px solid #00275e !important;
    padding: 6px 16px !important;
    border-radius: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.25s ease !important;
    background: transparent !important;
}
.brand-action-btn-layout svg { transition: transform 0.25s ease !important; }
.brand-master-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 25px rgba(0, 39, 94, 0.15) !important;
    border-color: #0d89d3 !important;
}
.brand-master-card:hover .brand-card-img-src { transform: scale(1.06) !important; }
.brand-master-card:hover .brand-anchor-link-spec { color:#00275e !important; }
.brand-master-card:hover .brand-action-btn-layout {
    background-color: #0d89d3 !important;
    border-color: #0d89d3 !important;
    color: #ffffff !important;
}
.brand-master-card:hover .brand-action-btn-layout svg { transform: translateX(4px) !important; }
@media (max-width: 767px) {
    .brand-master-card { border-bottom-width: 3px !important; }
    .brand-card-text-container { padding: 15px !important; }
    .brand-action-btn-layout { width: 100% !important; }
}
.dynamic-card .card-body a:hover{
	transition:0.9s;
	color:#0d89d3!important
}
/* Footer layout se overlap fix karne ke liye */
#footer, footer, .site-footer {
    clear: both !important;
    position: relative !important;
    z-index: 10 !important;
}
.front_pges .page-header-inner #ajaxsearchlite1 .probox  {
    border: 0px !important;
    width: 60%;
    margin: 0px auto;
    padding: 10px;
}
.front_pges .page-header-inner #ajaxsearchlite1 .probox .promagnifier{
	background:#0d89d3;
    width: 60px;
    height: 50px;
    margin-top: -12px;
    margin-right: -12px;
}

.front_pges .page-header-inner #ajaxsearchlite1 .probox  .promagnifier .innericon svg{
	fill: #ffffff;
}
.front_pges .page-header-inner{
	margin:0px auto;
	text-align:center
}
.airlines-section {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    padding: 40px 0px;
}
/* Header Styling */
.section-header h2 {
    /* font-size: 2.2rem; */
    color: #000;
    margin-bottom: 30px;
    font-weight: 700;
}
.section-header p {
    font-size: 1.1rem;
    color: #777777;
    margin-bottom: 40px;
}

/* Grid Layout (Responsive by Default) */
.airlines-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

/* Card Styling */
.airline-card {
    position: relative;
    height: 400px; /* Card ki height fixed rakhi hai taaki design clean dikhe */
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition:0.9s
}
/* ==========================================================================
   Airline Custom Page Main Styling
   ========================================================================== */

.airline-hero-banner {
    background-color: #fcfbfa; /* Soft off-white canvas background */
    padding: 50px 0;
    border-bottom: 1px solid #f0eded;
}

.banner-info-pane__title {
    font-size: 2.4rem;
    color: #00275e; /* Elegant Red/Maroon theme tone */
    font-weight: 700;
    margin-bottom: 15px;
}

.airline-breadcrumbs {
    font-size: 0.9rem;
    color:#00275e;
    margin-bottom: 25px;
}
/* ---- DESKTOP DEFAULTS ---- */
.responsive-sidebar {
    top: 20px;
}
.responsive-grid-scroller {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.airline-sidebar-card__thumb-wrapper {
    width: 75px;
    height: 60px;
}
.custom-sidebar-card {
    border: 1px solid #f1f3f5;
    position: relative;
    transition: all 0.3s ease;
}
.style-cover {
    object-fit: cover !important;
    transition: transform 0.4s ease;
}
.custom-card-heading {
    font-size: 0.9rem;
    line-height: 1.3;
}

/* Hover Animations for Large Screens */
@media (min-width: 768px) {
    .custom-sidebar-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;
        border-color: #dee2e6 !important;
    }
    .custom-sidebar-card:hover .style-cover {
        transform: scale(1.1);
    }
    .custom-sidebar-card:hover .custom-title-link {
        color: #0d6efd !important;
    }
}

/* ---- MOBILE & TABLET RESPONSIVE MAGIC (Below 768px) ---- */
@media (max-width: 767px) {
    .responsive-sidebar {
        position: relative !important;
        top: 0 !important;
        margin-bottom: 30px;
    }
    
    /* Converts vertical list into a beautiful horizontal swipe row */
    .responsive-grid-scroller {
        flex-direction: row !important;
        overflow-x: auto !important;
        white-space: nowrap;
        padding-bottom: 12px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 12px;
    }

    /* Hide ugly desktop scrollbar on mobile while keeping it swipeable */
    .responsive-grid-scroller::-webkit-scrollbar {
        height: 4px;
    }
    .responsive-grid-scroller::-webkit-scrollbar-thumb {
        background: #dee2e6;
        border-radius: 4px;
    }

    /* Fixed size for items inside the mobile slider */
    .custom-sidebar-card {
        min-width: 240px !important;
        max-width: 240px !important;
        scroll-snap-align: start;
        flex: 0 0 auto;
    }

    .airline-sidebar-card__thumb-wrapper {
        width: 60px;
        height: 50px;
    }

    .custom-card-heading {
        font-size: 0.85rem;
        white-space: normal; /* Title wrap karega agar lamba hoga to */
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}
.airline-breadcrumbs a {
    color: #0d89d3;
    text-decoration: none;
}
.airline-breadcrumbs a:hover {
    text-decoration: underline;
}

/* Meta Data Fields */
.airline-meta-list {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
}
.banner-action-row .airline-btn-primary{
	border-radius: 30px;
    border: 1px solid #00275e;
    color: #00275e;
	transition:0.9s
}
.banner-action-row .airline-btn-primary:hover{
	border-radius: 30px;
    border: 1px solid #0d89d3;
    color: #fff;
	transition:0.9s;
	background:#0d89d3
}
.airline-meta-list__item {
    display: flex;
    align-items: flex-start;
    font-size: 1rem;
    color: #00275e;
    line-height: 1.5;
    border-bottom: 1px dotted #0d89d3;
    padding: 10px 0px;
}
.airline-meta-list__item i {
    color: #0d89d3;
    font-size: 16px;
    margin-top: 3px;
    float: left;
    font-style: normal;
    font-weight: 500;
}
.airline-meta-list__item span{
	float: right;
    margin-left: 10px;
}
.airline-meta-list__item a {
    color: #444;
    text-decoration: none;
    transition: color 0.2s;
}
.airline-meta-list__item a:hover {
    color: #a4331f;
}

/* Call Button (CTA) Styling */
.banner-action-row {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.airline-btn-primary {
    background-color: #ffffff;
    border: 2px solid #a4331f;
    color: #a4331f;
    padding: 12px 28px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.airline-btn-primary__inner {
    display: inline-flex;
    align-items: center;
}

.airline-btn-primary__inner svg {
    margin-right: 8px;
}

.airline-btn-primary:hover {
    background-color: #a4331f;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(164, 51, 31, 0.15);
}

/* Social Icon Blocks */
.airline-social-channels__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 10px;
}

.airline-social-channels__list li a {
    width: 38px;
    height: 38px;
    background: #ffffff;
    border: 1px solid #ddd;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    text-decoration: none;
    transition: all 0.2s ease;
}

.airline-social-channels__list li a:hover {
    background: #0d89d3;
    color: #fff;
    border-color: #0d89d3;
}

/* Map Frame and Feedback Action Box */
.airline-map-box {
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

.airline-map-box img {
    width: 100%;
    height: 230px;
    object-fit: cover;
}

.airline-btn-feedback {
    background-color:#00275e;
    color: #ffffff !important;
    padding: 12px;
    border-radius: 8px;
    text-align: center;
    display: block;
    text-decoration: none;
    transition: background 0.2s ease;
    border: none;
	transition:0.9s;
}

.airline-btn-feedback:hover {
    background-color:#0d89d3;
	transition:0.9s
}

/* Right Sidebar Panel Elements */
.airline-sidebar {
    background: #ffffff;
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.01);
}

.airline-sidebar__title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #222;
    border-bottom: 2px solid #a4331f;
    padding-bottom: 8px;
    margin-bottom: 20px;
}

.airline-sidebar-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.airline-sidebar-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f9f9f9;
}

.airline-sidebar-card:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.airline-sidebar-card__thumb {
    width: 65px;
    height: 50px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 6px;
}

.airline-sidebar-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.airline-sidebar-card__title {
    font-size: 0.95rem;
    color: #333;
    text-decoration: none;
    font-weight: 500;
    line-height: 1.3;
}

.airline-sidebar-card__title:hover {
    color: #a4331f;
}
.airline-related-block__title {
    font-size: 1.3rem;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 20px;
    background: #00275e;
    padding: 10px;
    text-align: center;
    border-radius: 10px;
}
.airline-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    padding: 0;
    list-style: none;
}
.airline-related-grid__item a {
    color: #000000;
    text-decoration: none;
    font-size: 16px;
    display: block;
    padding: 5px 0;
    transition: color 0.2s;
    border: 1px solid #0d89d3;
    padding: 6px;
    border-radius: 10px;
}
.airline-related-grid__item a:hover {
    color:#0d89d3;
}
.airline-related-grid__item a i{
	margin-left:2px;
}
/* Sticky Alignment Offset */
.sticky-top {
    top: 30px;
    z-index: 10;
}

/* ==========================================================================
   Responsive Adaptations
   ========================================================================== */

@media (max-width: 991px) {
    .banner-info-pane__title {
        font-size: 2rem;
    }
    .airline-sidebar {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .airline-hero-banner {
        padding: 35px 0;
    }
    .banner-info-pane {
        margin-bottom: 30px;
        text-align: center;
    }
    .airline-meta-list__item {
        justify-content: center;
    }
    .banner-action-row {
        justify-content: center;
    }
}
.airline-card:hover {
    transform: translateY(-10px); /* Hover par thoda upar uthega aur accha premium look dega */
	transition:0.9s
}

/* Images Styling */
.airline-card img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Image bina stretch hue fit ho jayegi */
}

/* Unique Background Colors (Image overlay colors based on your screenshot) */
.card-ba { background-color: #11284d; }
.card-ka { background-color: #0093b8; }
.card-ew { background-color: #d1e2e6; }
.card-anz { background-color: #8c9294; }

/* Text Overlay Styling */
.card-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 30px 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.7)); /* Gradience taaki text hamesha readble rahe */
    text-align: center;
}

.card-overlay h3 {
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 600;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.5);
}

/* Browse All Button Styling */
.btn-container {
    margin-top: 20px;
}
.site-info{
	color:#fff;
}
.footer_bottom {
  text-align: center;
  float:right
}
.footer_bottom ul li {
  list-style-type: none;
  float: left;
  padding: 0 9px;
  line-height: 65px;
}
.footer_bottom ul {
  margin: 0;
  padding: 0;
  margin-right: 15px;
}
.browse-btn {
    display: inline-block;
    padding: 10px 30px;
    border: 1px solid #00275e;
    color: #0d89d3;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    transition:0.9s;
}

.browse-btn:hover {
    background-color: #0d89d3;
    color: #fff;
	transition:0.9s;
	border: 1px solid #0d89d3;
}

/* Responsive Tweaks for Smaller Screens */
@media (max-width: 600px) {
    .section-header h2 {
        font-size: 1.8rem;
    }
    .airline-card {
        height: 350px; /* Mobile par height thodi kam kar di */
    }
}
/* Section Main Styling */
.latest-pages-section {
    max-width: 1200px;
    margin: 60px auto;
    padding: 0 20px;
}

.latest-pages-section .section-header {
    text-align: center;
    margin-bottom: 40px;
}

.latest-pages-section .section-header h2 {
    font-size: 2rem;
    color: #222;
    font-weight: 700;
    margin-bottom: 8px;
}

.latest-pages-section .section-header p {
    color: #666;
    font-size: 1rem;
}

/* Grid Layout (4 Columns for Desktop) */
.pages-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

/* Modern Card Design */
.page-card {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); */
    border: 1px solid #0d89d3;
    display: flex;
    flex-direction: column;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.page-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

/* Thumbnail Styling */
.card-thumb {
    width: 100%;
    height: 180px;
    overflow: hidden;
    background-color: #f5f5f5;
}

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

.page-card:hover .card-thumb img {
    transform: scale(1.06);
}

/* Content Area inside Card */
.card-content {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Taaki buttons hamesha align rahein chahe text chota-bada ho */
}

.card-content h3 {
    font-size:16px;
    color: #1a1a1a;
    margin-bottom: 10px;
    line-height: 1.4;
}

.card-content p {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Read More Link with Arrow Animation */
.read-more-link {
    margin-top: auto; /* Aligns link to the bottom */
    align-items: center;
    gap: 6px;
    color: #0066cc; /* Aap apne brand color se change kar sakte hain */
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 0.2s ease;
}

.read-more-link svg {
    transition: transform 0.2s ease;
}

.read-more-link:hover {
    color: #004499;
}

.read-more-link:hover svg {
    transform: translateX(4px); /* Arrow aage move karega hover par */
}

.no-posts {
    grid-column: 1 / -1;
    text-align: center;
    color: #888;
    padding: 20px;
}

/* --- Responsive Media Queries --- */

/* Tablets (Max-width: 1024px) - 2 cards in a row */
@media (max-width: 1024px) {
    .pages-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

/* Mobile Phones (Max-width: 600px) - 1 card in a row */
@media (max-width: 600px) {
    .pages-grid {
        grid-template-columns: 1fr;
    }
    .latest-pages-section .section-header h2 {
        font-size: 1.6rem;
    }
}
*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-weight: 400;
	line-height: 1.6;
	color: #333333;
	background-color: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: .5rem;
	margin-bottom: 1rem;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
}

h1 {
	font-size: 2.5rem;
}

h2 {
	font-size: 2rem;
}

h3 {
	font-size: 1.75rem;
}

h4 {
	font-size: 1.5rem;
}

h5 {
	font-size: 1.25rem;
}

h6 {
	font-size: 1rem;
}

p {
	margin-top: 0;
	margin-bottom: .9rem;
}

hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

pre {
	font-family: monospace, monospace;
	font-size: 1em;
	white-space: pre-wrap;
}

.footer-copyright a {
	text-decoration: underline;
}

.st-ayurvedic-single-wrap a {
	text-decoration: underline;
}
a {
	background-color: transparent;
	color:#00275e;
	text-decoration: none;
}

a:hover,
a:active {
	color: #0d89d3;
}

a:not([href]):not([tabindex]) {
	color: inherit;
	text-decoration: none;
}

a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
	color: inherit;
	text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
	outline: 0;
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline dotted;

}

b,
strong {
	font-weight: bolder;
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;

}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

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

details {
	display: block;
}

summary {
	display: list-item;
}

figcaption {
	font-size: 16px;
	color: #333333;
	line-height: 1.4;
	font-style: italic;
	font-weight: 400;
}

template {
	display: none;
}

[hidden] {
	display: none;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.st-ayurvedic-single-wrap a,.page-single a,.comment-content a,.woocommerce-product-details__short-description a, #tab-description a,.extra-home-content a {
	text-decoration: underline;
	color:#0d89d3;
}

.st-ayurvedic-single-wrap .form-submit input:hover{
	text-decoration: underline;
}

.st-ayurvedic-single-wrap .form-submit input:focus{
	text-decoration: underline;
}

@media print {

	*,
	*:before,
	*:after {
		background: transparent !important;
		color: #000 !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	a[href^="#"]:after,
	a[href^="javascript:"]:after {
		content: "";
	}

	pre {
		white-space: pre-wrap !important;
	}

	pre,
	blockquote {
		page-break-inside: avoid;
		border: 1px solid #cccccc;
	}

	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}

label {
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.5;
	margin: 0;

}

input[type="text"],
input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
	width: 100%;
	border: solid 1px #666666;
	border-radius: 3px;
	padding: 0.5rem 1rem;
	transition: all .3s;
}

input[type="text"]:focus,
input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
	border-color: #333333;
	outline: 1 solid;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	width: auto;
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

button,
[type="submit"],
[type="button"] {
	display: inline-block;
	font-weight: 400;
	color: #161921;
	text-align: center;
	white-space: nowrap;
	user-select: none;
	background-color: transparent;
	border: 1px solid #161921;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	border-radius: 3px;
	transition: all .3s;
}

button:focus,
[type="submit"]:focus,
[type="button"]:focus {
	outline: 5px auto -webkit-focus-ring-color;
}

button:hover,
button:focus,
[type="submit"]:hover,
[type="submit"]:focus,
[type="button"]:hover,
[type="button"]:focus {
	color: #ffffff;
	background-color: #161921;
	text-decoration: none;
}

button:not(:disabled),
[type="submit"]:not(:disabled),
[type="button"]:not(:disabled) {
	cursor: pointer;
}

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

progress {
	vertical-align: baseline;
}

textarea {
	overflow: auto;
	resize: vertical;
}

[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;

}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;

}

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;

}

select {
	display: block;
}

table {
	background-color: transparent;
	width: 100%;
	margin-bottom: 15px;
	font-size: 0.9em;
	border-spacing: 0;
	border-collapse: collapse;
}

table th,
table td {
	padding: 15px;
	line-height: 1.5;
	vertical-align: top;
	border: 1px solid #cccccc;
}

table th {
	font-weight: bold;
}

table thead th,
table tfoot th {
	font-size: 1em;
}

table caption+thead tr:first-child th,
table caption+thead tr:first-child td,
table caption+thead tr:first-child th,
table caption+thead tr:first-child td,
table colgroup+thead tr:first-child th,
table colgroup+thead tr:first-child td,
table colgroup+thead tr:first-child th,
table colgroup+thead tr:first-child td,
table thead:first-child tr:first-child th,
table thead:first-child tr:first-child td,
table thead:first-child tr:first-child th,
table thead:first-child tr:first-child td {
	border-top: 1px solid #cccccc;
}

table tbody>tr:nth-child(odd)>td,
table tbody>tr:nth-child(odd)>th {
	background-color: #f7f7f7;
}

table tbody tr:hover>td,
table tbody tr:hover>th {
	background-color: #e9e9e9;
}

table tbody+tbody {
	border-top: 2px solid #cccccc;
}

@media (max-width: 767px) {
	table table {
		font-size: 0.8em;
	}

	table table th,
	table table td {
		padding: 7px;
		line-height: 1.3;
	}

	table table th {
		font-weight: 400;
	}
}

dl,
dt,
dd,
ol,
ul,
li {
	margin-top: 0;
	margin-bottom: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/* WordPress Default Class */
.alignright {
	float: right;
	margin-left: 1rem;
}

.alignleft {
	float: left;
	margin-right: 1rem;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignwide {
	margin-left: -80px;
	margin-right: -80px;
}

.alignfull {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
	width: 100vw;
}

.alignfull img {
	width: 100vw;
}

.wp-caption {
	margin-bottom: 1.25rem;
	max-width: 100%;
}

.wp-caption.alignleft {
	margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
	margin: 5px 0 20px 20px;
}

.wp-caption img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption-text {
	margin: 0;
}

.gallery-caption {
	display: block;
	font-size: 0.8125rem;
	line-height: 1.5;
	margin: 0;
	padding: 0.75rem;
}

.pagination {
	margin: 20px auto;
}

.sticky {
	position: relative;
	display: block;
}

.bypostauthor {
	font-size: inherit;
}

.hide {
	display: none !important;
}

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: polygon(0 0, 0 0, 0 0, 0 0);
	position: absolute !important;
	white-space: nowrap;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	clip: auto !important;
	display: block;
	height: auto;
	left: 5px;
	top: 5px;
	width: auto;
	z-index: 100000;
}

#skip-link-target[tabindex="-1"]:focus {
	outline: 0;
}

/* Theme Styles Start */
#page .st-home-page {
	overflow: hidden;
}
#page-wrap .main-container {
	max-width: 1044px;
	margin: 0 auto;
	margin-top: 30px !important;
	overflow: hidden;
}

.single-post #page .main-container {
	max-width: 1044px;
	margin: 0 auto;
	margin-top: 0px;
	margin-top: 80px;
	margin-bottom: 80px;
}

.site-logo h1,
.site-description {
	margin: 0;
}

.st-ayurvedic-post {
	margin-bottom: 50px;
}

.st-ayurvedic-post img {
	max-width: 100%;
}

.st-ayurvedic-post .post-title {
	margin: 0;
}

.st-ayurvedic-post .post-categories {
	margin-bottom: 20px;
}

.st-ayurvedic-post .post-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 0;
	border-bottom: 1px solid #e8e8e8;
}

.st-ayurvedic-post .read-more {
	display: inline-block;
	padding: 5px 15px;
	border: 1px solid #161921;
	text-transform: capitalize;
}

.st-ayurvedic-post .post-tags a {
	display: inline-block;
	margin-right: 10px;
}

.commentslist {
	list-style-type: none;
	padding: 0;
}

.commentslist .children {
	list-style-type: none;
}

.commentslist li {
	padding: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid #e8e8e8;
}

.comment-author img {
	margin-right: 10px;
}

.commentslist .reply {
	display: inline-block;
	padding: 5px 15px;
	border: 1px solid #161921;
}

.comment-form-comment input,
.comment-form-comment textarea {
	border-color: #e8e8e8;
}

nav.navigation {
	text-align: center;
}

nav.navigation a,
nav.navigation span {
	padding: 5px 10px;
	border: 1px solid #e8e8e8;
}

.site-logo a,
.st-ayurvedic-post .read-more a,
.st-ayurvedic-post .post-title a {
	text-decoration: none;
}


/* Menu Styles Start */

.wp-block-button__link{
	color: #fff !important;
  background-color:#161921 ;
  margin-bottom: 5px;
}
.wp-block-button.is-style-outline .wp-block-button__link{
  border: 1px solid #161921;
  color: #121212 !important;
}
.wp-block-button.is-style-squared .wp-block-button__link{
  border-radius: 0px !important;
}

.post-title a, h1.post-title {
	word-wrap: break-word;
}

/* Loader Styles */
#st-ayurvedic-loader-container {
    position: fixed;
    z-index: 999999;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: #14287B;
}

#st-ayurvedic-loader-img {
    max-width: 180px;
    max-height: 180px;
    width: auto;
    height: auto;
    object-fit: contain;
    animation: st-loader-pulse 1.6s ease-in-out infinite;
}

@keyframes st-loader-pulse {
    0%   { transform: scale(1);    opacity: 1;    }
    50%  { transform: scale(1.15); opacity: 0.6;  }
    100% { transform: scale(1);    opacity: 1;    }
}

#st-ayurvedic-custom-loader {
	width: 60px;
	aspect-ratio: 4;
	--_g: no-repeat radial-gradient(circle closest-side,#ffffff 90%,#0000);
	background: 
	  var(--_g) 0%   50%,
	  var(--_g) 50%  50%,
	  var(--_g) 100% 50%;
	background-size: calc(100%/3) 100%;
	animation: l7 1s infinite linear;
  }
  @keyframes l7 {
	  33%{background-size:calc(100%/3) 0%  ,calc(100%/3) 100%,calc(100%/3) 100%}
	  50%{background-size:calc(100%/3) 100%,calc(100%/3) 0%  ,calc(100%/3) 100%}
	  66%{background-size:calc(100%/3) 100%,calc(100%/3) 100%,calc(100%/3) 0%  }
  }

/* post card css start */
/* Define the animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Apply the animation to the card */

.st-ayurvedic-post-card {
    opacity: 0; /* Initially hidden */
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.st-ayurvedic-post-card.visible {
    opacity: 1;
    transform: translateY(0);
}

.card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-footer .btn {
    margin-left: auto;
}

.st-read-more-btn{
	background: #0d89d3;
	border: none;
	-webkit-text-fill-color: #fff !important;
	-webkit-background-clip: inherit !important;
}

.st-read-more-btn:hover{
	background: #0d89d3;
	transform: scale(1.05);
}

.st-tags-btn{
	border-color: #161921;
	color: #161921;
}
.st-ayurvedic-cat-badge{
	color: #fff;
	background: #0d89d3;
}
/* post card css end */
/* loader end */

/* hero form start*/
.hero-form input::placeholder {
    color: #757575;
}

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

.hero-form .wpcf7-select{
    background: #fff;
    border: solid 1px #CCCCCC;
    border-radius: 2px;
}

.hero-form input{
    border: solid 1px #CCCCCC;
    border-radius: 2px;
}

.hero-form label{
    margin-top: 15px;
}

.hero-form label {
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 700;
    line-height: 20.8px;
    text-align: left;
}

.hero-form textarea {
    height: 120px
}

.hero-form [type="submit"]{
    top: 16px;
    left: 1262px;
    padding: 9px 35.27px 9px 35.59px;
    gap: 0px;
    border-radius: 4px 0px 0px 0px;
    opacity: 0px;
    background: #0d89d3;
    color: #fff;
    
    border-radius: 10px;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 700;
    line-height: 21.94px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;

}
/* hero form end*/

/* footer icon css */
.stfooter-details .elementor-icon-box-icon {
    align-self: center;
}

@media screen and (min-width : 320px) and (max-width : 767px) {

	.hero-form [type="submit"] {
        font-size: 15px;
        font-weight: 600;
    }
    
	.hero-form-f2f {
        flex-wrap: wrap;
        gap: 10px;
    }
    
	.hero-form-f2f span {
        width: 100%;
    }
    
	.hero-form label {
        font-size: 12px;
        font-weight: 600;
    }
    
	.hero-form input[type="text"] {
        padding: 10px;
        font-size: 12px;
    }
    
	.hero-form input[type="email"] {
        padding: 10px;
        font-size: 12px;
    }
    
	.hero-form input[type="tel"] {
        padding: 10px;
        font-size: 12px;
    }
    
	.hero-form select {
        padding: 10px;
        font-size: 12px;
    }
}

@media screen and (min-width : 768px) and (max-width : 1024px) {
	
	.hero-form label {
        font-size: 14px;
        font-weight: 600;
    }
    
	.hero-form input[type="text"] {
        padding: 7px;
        font-size: 12px;
    }
    
	.hero-form input[type="email"] {
        padding: 7px;
        font-size: 12px;
    }
    
	.hero-form input[type="tel"] {
        padding: 7px;
        font-size: 12px;
    }
    
	.hero-form select {
        padding: 7px;
        font-size: 12px;
    }
    
	.hero-form label {
        margin-top: 8px;
    }
}
 /* Navigation Start */

ul li a {
	text-decoration: none;
}
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

/* Menus Start */
#masthead {
    position: relative;
    width: 100%;
    z-index: 3000;
    background-color: #fff;
    padding: 15px 0;
    border-bottom: 2px solid rgb(34 34 34 / 10%);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.main-navigation {
    display: block;
    position: static;
}
.main-navigation ul ul {
    background-color: #fff;
    text-align: left;
    padding: 0;
}
.main-navigation ul ul li a {
    padding: 8px 15px;
    color: #111;
}
.main-navigation ul ul a:after {
    float: right;
}
.main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation li {
    position: relative;
}

.main-navigation ul.nav-menu > li > a {
    padding: 15px 18px;
}
.main-navigation ul.nav-menu > li:hover > a,
.main-navigation ul.nav-menu > li > a:hover,
.main-navigation ul.nav-menu > li > a:focus {
    color: #161921;
	text-decoration: underline;
}
.main-navigation form.search-form input {
    background-color: #111;
    border-color: #111;
    color: #111;
    font-weight: 400;
}
.main-navigation a {
    display: block;
    text-decoration: none;
    font-weight: bold;
    color: #111;
    font-size: 14px;
    font-weight: 400;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
.main-navigation ul ul {
   float: left;
    position: absolute;
    top: 100%;
    left: -999em;
    z-index: 99999;
}
.main-navigation ul ul ul {
    left: -999em;
    top: 0;
}
.main-navigation ul ul a {
    width: 225px;
}
.main-navigation ul.nav-menu .current-menu-item > a {
    color: #161921;
}
.main-navigation form.search-form {
    min-width: 320px;
}
.menu-toggle {
    border-radius: 0;
    font-size: 14px;
    margin: auto;
    outline: none;
    display: block;
    height: 60px;
    position: absolute;
    background-color: transparent;
    min-width: 64px;
    border: none;
    display: block;
    float: right;
    top: 20px;
    right: 0;
}
.menu-toggle:hover, 
.menu-toggle:focus {
    outline: thin dotted #fff;
    /* background-color: #ffaf29; */
	background: #161921;
    color: #fff;
}
.menu-toggle:hover i, 
.menu-toggle:focus i {
    color: #fff;
}
.menu-toggle i {
    color: #666;
}
.menu-toggle span {
    width: 35px;
    height: 2px;
    display: block;
    background-color: #ffb5ad;
    margin: 9px 0;
}
.menu-label {
    float: right;
    color: #111;
    padding: 7px 0 0 10px;
    display: none;
}
button.dropdown-toggle {
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    background-color: transparent;
    border: none;
    width: 45px;
    height: 55px;
    line-height: 56px;
    outline: none;
    border-radius: 0;
}
button.dropdown-toggle:focus {
	outline: thin dotted #000;
}
button.dropdown-toggle .fa {
    color: #000;
    font-size: 18px;
    padding-left: 5px;
}
button.dropdown-toggle.active .fa:before {
    content: "\f106";
}

.post-wrapper .featured-image {
    margin-bottom: 0;
}
.post-wrapper .entry-footer {
    padding-bottom: 5px;
    display: inline-block;
}
.post-wrapper .entry-content {
    margin: 0;
    color: #565859;
}
.cat-links a {
    font-weight: 500;
    letter-spacing: 0.5px;
    display: inline-block;
    float: left;
    font-size: 14px;
    position: relative;
    text-transform: uppercase;
    line-height: normal;
    color: #313131;
    margin-right: 10px;
    -webkit-transition: color .3s ease,background-color .3s ease,border-color .3s ease;
    -ms-transition: color .3s ease,background-color .3s ease,border-color .3s ease;
    -o-transition: color .3s ease,background-color .3s ease,border-color .3s ease;
    transition: color .3s ease,background-color .3s ease,border-color .3s ease;
}
.cat-links a:hover,
.cat-links a:focus,
.entry-meta a:hover,
.entry-meta a:focus {
    color: #161921;
}
span.cat-links a:not(:last-child):after {
    content: "/";
    margin: 0 5px;
}
.wp-block-latest-posts.wp-block-latest-posts__list {
    list-style: disc;
    padding-left: 1.5em;
}
#secondary .widget:not(:last-child) {
    margin-bottom: 25px;
}
#secondary ul {
    padding: 30px 50px;
    margin: 0;
    background-color: #e9ecef;
}
#secondary .widget_block.widget_search {
    margin-bottom: 40px;
}
#secondary .widget_block input[type="search"] {
    background-color: #e9ecef;
    border-radius: 5px;
}
.widget input {
    height: 53px;
    padding: 0 15px;
    border: none;
}
#secondary .widget_block button[type="submit"] {
    color: #666;
    background-color: #e9ecef;
    border-color: #e9ecef;
}
#secondary .widget_block button[type="submit"]:hover,
#secondary .widget_block button[type="submit"]:focus {
    color: #fff;
    background-color: #161921;
    border-color: #161921;
}
#wp-custom-header {
    text-align: center;
}
.dropdown-toggle::after{
	display: none;
}
/* Sidebar Css Start */
.widget-recent-posts li {
	gap: 20px;
}
.widget-recent-posts, .widget-tags, .widget-categories {
	box-shadow: 0px 0px 12px -1px rgb(0 0 0 / 12%);
	border-radius: 10px;
	padding: 15px;
}
@media screen and (min-width: 1025px) {
	.main-navigation {
	    display: block;
	    position: relative;
	    float: right;
	    width: 58%;
	}
    .main-navigation .menu-item-has-children > a:after {
        content: "\f107";
        font-family: "FontAwesome";
        padding-left: 8px;
    }
    .main-navigation ul ul .menu-item-has-children > a:after {
        content: "\f105";
    }
    .main-navigation ul.nav-menu {
        display: block !important;
        height: auto !important;
        text-align: right;
    }
    .main-navigation ul.nav-menu > li > a {
	    color: #121418;
	}
    .main-navigation ul li:hover > ul,
    .main-navigation ul li.focus > ul {
        left: 0;
        right: auto;
    }
    .main-navigation ul ul li:hover > ul,
    .main-navigation ul ul li.focus > ul {
        left: 100%;
        right: auto;
    }
    .main-navigation ul ul li:hover > a,
    .main-navigation ul ul li.focus > a {
        background-color: #161921;
        color: #fff !important;
		text-decoration: underline;
    }
    .main-navigation ul.sub-menu > li:last-child > a {
        border-bottom: none;
    }
    .main-navigation ul ul li {
        border-bottom: 1px solid #eee;
    }
    .main-navigation ul ul > li:last-child {
        border-bottom: none;
    }
    .main-navigation ul ul ul {
        top: 0;
    }
    .menu-toggle {
        height: 80px;
        position: absolute;
        top: 50%;
        right: 35px;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        display: none;
    }
    .main-navigation .search-active .icon-search {
        display: none;
    }
    .main-navigation .search-active .icon-close {
        display: inline-block;
    }
    button.dropdown-toggle {
        display: none;
    }
    .menu-toggle {
        display: none;
    }
    .main-navigation ul {
        display: block;
    }
    .main-navigation li {
        display: inline-block;
    }
    .main-navigation form.search-form {
        border: 20px solid #111;
    }
    .site-branding {
	    float: left;
	}
	.main-navigation {
	    position: relative;
	}
    #primary {
	    width: 75%;
	    float: left;
	    padding-right: 30px;
	    margin-bottom: 0;
	}

	#secondary {
	    width: 25%;
	    float: left;
	    position: sticky;
	    top: 30px;
	}

	.right-sidebar #primary {
		float: left;
	    padding-right: 40px;
	}

	.right-sidebar #secondary {
		float: right;
	}

	.left-sidebar #primary {
		float: right;
	    padding-right: 0;
	    padding-left: 40px;
	}

	.left-sidebar #secondary {
		float: left;
	}
}

@media screen and (max-width: 1024px) {
	.main-navigation ul.nav-menu {
	    margin-right: 0;
	    border-top: 1px solid #666;
	    background-color: #f1f1f1;
	    margin-top: 0;
	    position: absolute;
	    top: 100%;
	    left: auto;
	    right: 0;
	    width: 100%;
	}
	.main-navigation ul.nav-menu li {
	    border-bottom: 1px solid #666;
	    display: block;
	    width: 100%;
	    padding: 0;
	}
	.main-navigation a {
	    color: #161921;
	}
	.main-navigation ul ul, 
	.main-navigation ul ul ul {
	    box-shadow: none;
	    float: none;
	    position: relative;
	    top: 0;
	    left: 0;
	    margin-bottom: 0;
	    display: none;
	    background-color: #f1f1f1;
	}
	.main-navigation ul ul {
	    border-top: 1px solid #666;
	}
	.main-navigation ul.nav-menu li {
	    border-bottom: 1px solid #666;
	    display: block;
	    width: 100%;
	}
	.main-navigation ul.sub-menu li a {
	    border-left: none;
	}
	.main-navigation ul ul li a {
	    padding-left: 35px;
	    color: #161921;
	}
	.main-navigation ul ul a {
	    width: 100%;
	}
}

/* =============================================================================
   ST Ayurvedic – Footer Styles
   ============================================================================= */

/* ---- Footer outer wrapper ---- */
.footer-side {
	background-color:#00275e;
	color: #cccccc;
	/* font-size: 0.9rem; */
	line-height: 1.7;
	margin-bottom:50px;
}

/* Bottom spacing on theme templates so footer has gap.
   Applied per-template (not on footer itself) so Elementor pages
   using full-width layouts don't get extra gap above footer. */
.main-container.page-single,
.st-ayurvedic-single-wrap,
.st-ayurvedic-index-wrap,
.page-404 {
	margin-bottom: 70px;
}

/* ---- Footer widget section ---- */
.footer-widget {
    padding: 60px 0 40px;
    border-bottom: 1px solid rgb(13 137 211);
}
/* ---- Individual footer column ---- */
.footer-area {
	margin-bottom: 30px;
}

/* ---- Widget title ---- */
.footer-area .widget-title,
.footer-area .title {
	color: #ffffff;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 20px;
	padding-bottom: 15px;
	position: relative;
}

.footer-area .widget-title::after,
.footer-area .title::after {
	content: '';
	display: block;
	width: 40px;
	height: 2px;
	background-color: #0d89d3;
	position: absolute;
	bottom: 0;
	left: 0;
}

/* ---- Widget links ---- */
.footer-area a {
	color: #cccccc;
	text-decoration: none;
	transition: color 0.25s ease;
}

.footer-area a:hover,
.footer-area a:focus {
	color: #0d89d3;
	text-decoration: underline;
}

/* ---- Widget list items ---- */
.footer-area ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-area ul li {
	padding: 4px 0;
	border-bottom: 1px solid rgba( 255, 255, 255, 0.06 );
}

.footer-area ul li:last-child {
	border-bottom: none;
}

.footer-area ul li a::before {
	content: '\203A';
	margin-right: 6px;
	color: #0d89d3;
}

/* ---- Search widget inside footer ---- */
.footer-side .footer-widget form div {
	display: flex;
	gap: 6px;
}

.footer-area #searchform input[type="text"] {
	flex: 1;
	padding: 8px 12px;
	border: 1px solid rgba( 255, 255, 255, 0.15 );
	background-color: rgba( 255, 255, 255, 0.07 );
	color: #ffffff;
	border-radius: 4px;
	font-size: 0.875rem;
}

.footer-area #searchform .search-field::placeholder {
	color: #aaaaaa;
}

.footer-area #searchform input[type="submit"] {
	padding: 8px 16px;
	background-color: #0d89d3;
	color: #ffffff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.875rem;
	transition: background-color 0.25s ease;
}

.footer-area #searchform input[type="submit"]:hover,
.footer-area #searchform input[type="submit"]:focus {
	background-color: #ffffff;
	color: #0d89d3;
}

/* ---- Text / paragraph widgets ---- */
.footer-area p {
	color: #bbbbbb;
	margin-bottom: 12px;
}

/* ---- Footer copyright bar ---- */
.footer-copyright {
    background-color:#00275e;
    padding: 14px 0;
    border-top: 1px solid #0d89d3;
}
.footer-copyright p {
	color: #ffffff;
	margin: 0;
}

.footer-copyright a {
	color: #ffffff;
	text-decoration: none;
	transition: color 0.25s ease;
}

.footer-copyright a:hover,
.footer-copyright a:focus {
	color: #ffffff;
	text-decoration: underline;
}

/* ---- Sticky copyright ---- */
.footer-copyright.sticky-copyright {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 999;
}

.footer-copyright.close-sticky {
	position: relative;
}

/* ---- Footer social icons ---- */
.footer-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}

.footer-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: rgba( 255, 255, 255, 0.08 );
	color: #cccccc;
	font-size: 0.95rem;
	text-decoration: none;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.footer-links a:hover,
.footer-links a:focus {
	background-color: #0d89d3;
	color: #ffffff;
}

/* ---- Progress bar ---- */
.theme-progress-bar {
	position: fixed;
	left: 0;
	width: 0%;
	height: 3px;
	background-color: #0d89d3;
	z-index: 9999;
	transition: width 0.1s linear;
}

.theme-progress-bar.top {
	top: 0;
}

.theme-progress-bar.bottom {
	bottom: 0;
}

/* ---- Custom cursor ---- */
.cursor-point-outline {
	width: 36px;
	height: 36px;
	border: 2px solid #0d89d3;
	border-radius: 50%;
	position: fixed;
	pointer-events: none;
	z-index: 99999;
	transform: translate( -50%, -50% );
	transition: transform 0.15s ease, opacity 0.15s ease;
}

.cursor-point {
	width: 8px;
	height: 8px;
	background-color: #0d89d3;
	border-radius: 50%;
	position: fixed;
	pointer-events: none;
	z-index: 99999;
	transform: translate( -50%, -50% );
}

/* ---- Responsive: footer columns stack on small screens ---- */
@media ( max-width: 767px ) {
	.footer-widget {
		padding: 40px 0 20px;
	}

	.footer-area {
		margin-bottom: 24px;
	}

	.footer-copyright .col-lg-6 {
		text-align: center !important;
	}

	.footer-copyright .text-md-end {
		text-align: center !important;
		margin-top: 6px;
	}
}

/* =============================================================================
   ST Ayurvedic – Containers Styles
   ============================================================================= */
@media (min-width: 1200px) {
	#page-wrap .st-header-container,
	.st-footer-container,
	.container.st-ayurvedic-index-wrap,
	.container.st-ayurvedic-single-wrap,
	.container.page-single {
		width: 1220px;
		max-width: 1220px;
	}
}

/* =============================================================================
   ST Ayurvedic – Enhanced Dark Header
   ============================================================================= */

/* Header base */
#masthead {
    background-color: #ffffff;
    border-bottom: 3px solid #0d89d3;
    padding: 16px 0;
}

/* Site title */
.site-logo .site-title,
.site-logo h1.site-title {
    font-size: 1.45rem;
    margin: 0;
}

.site-logo .site-title a,
.site-logo h1.site-title a {
    color: #121111;
    font-weight: 700;
    letter-spacing: -0.2px;
    transition: color 0.2s ease;
}

.site-logo .site-title a:hover {
    color: #0d89d3;
    text-decoration: none;
}

/* Custom logo brightness on dark background */
/* Desktop nav links on dark background */
#masthead #site-navigation a {
    color: #121111;
}
#masthead #site-navigation ul.nav-menu > li > a {
    color: #121111;
    font-weight: bold;
    padding: 12px 16px;
    font-size: 16px;
}
#masthead #site-navigation ul.nav-menu > li:hover > a,
#masthead #site-navigation ul.nav-menu > li > a:hover,
#masthead #site-navigation ul.nav-menu > li > a:focus {
    color: #0d89d3;
    text-decoration: none;
}

#masthead #site-navigation ul.nav-menu .current-menu-item > a {
    color: #0d89d3;
}

/* Desktop dropdown sub-menus */
#masthead #site-navigation ul ul {
    background-color: #0a2260;
    border-top: 2px solid #0d89d3;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

#masthead #site-navigation ul ul li a {
    color: rgba(255, 255, 255, 0.85);
    padding: 10px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

#masthead #site-navigation ul ul li:hover > a,
#masthead #site-navigation ul ul li.focus > a {
    background-color: #0d89d3;
    color: #ffffff;
    text-decoration: none;
}

/* Mobile menu toggle button */
#masthead .menu-toggle {
    background: #0d89d3;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 6px;
    color: #fff;
    width: auto;
    min-width: 44px;
    height: 40px;
    padding: 0 12px;
    position: static;
    transform: none;
    top: auto;
    right: auto;
    float: none;
    display: none;
    line-height: 1;
}

#masthead .menu-toggle i {
    color: #fff;
    transition: transform 0.25s ease;
    pointer-events: none;
}

#masthead .menu-toggle:hover,
#masthead .menu-toggle:focus {
    background: #0d89d3;
    border-color: #0d89d3;
    color: #fff;
    outline: 2px solid rgba(244, 103, 68, 0.4);
    outline-offset: 2px;
}

/* =============================================================================
   Mobile Menu Dropdown – Full-width, flexbox layout
   ============================================================================= */
@media screen and (max-width: 1024px) {

    /* Show the toggle button */
    #masthead .menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Nav is static so ul positions against #masthead (position: relative) */
    #masthead #site-navigation {
        position: static;
        float: none;
        width: auto;
    }

    /* Full-width dropdown flush with bottom edge of header */
    #masthead #site-navigation ul.nav-menu {
        position: absolute;
        top: calc(100% + 12px);
        left: 0;
        right: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        background-color: #14287B;
        border-top: 3px solid #0d89d3;
        border-bottom: 3px solid #0d89d3;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
        z-index: 99998;
    }

    /*
     * Menu items use flexbox so the link and the toggle button
     * sit on the same row, and the sub-menu wraps below them.
     * This removes the need for any hardcoded button height.
     */
    #masthead #site-navigation ul.nav-menu > li,
    #masthead #site-navigation ul.sub-menu > li,
    #masthead #site-navigation ul ul > li {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    }

    #masthead #site-navigation ul.nav-menu > li:last-child,
    #masthead #site-navigation ul.sub-menu > li:last-child,
    #masthead #site-navigation ul ul > li:last-child {
        border-bottom: none;
    }

    /* Links fill remaining row width — no extra right-padding needed */
    #masthead #site-navigation ul.nav-menu > li > a {
        flex: 1;
        min-width: 0;
        display: block;
        padding: 14px 20px;
        color: rgba(255, 255, 255, 0.88);
        font-size: 0.95rem;
        font-weight: 500;
        border-left: 3px solid transparent;
        text-decoration: none;
        transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    #masthead #site-navigation ul.nav-menu > li > a:hover,
    #masthead #site-navigation ul.nav-menu > li:hover > a,
    #masthead #site-navigation ul.nav-menu > li > a:focus {
        background: rgba(255, 255, 255, 0.06);
        border-left-color: #0d89d3;
        color: #ffffff;
        text-decoration: none;
    }

    /* Current / active item */
    #masthead #site-navigation ul.nav-menu > li.current-menu-item > a,
    #masthead #site-navigation ul.nav-menu > li.current-menu-ancestor > a {
        border-left-color: #0d89d3;
        color: #0d89d3;
    }

    /*
     * Sub-menu toggle button: a flex item in the same row as the link.
     * Height always equals the link row height via align-items: stretch
     * on the parent li — no hardcoded px value needed.
     */
    #masthead #site-navigation button.dropdown-toggle {
        position: static;
        height: auto;
        line-height: normal;
        flex-shrink: 0;
        width: 50px;
        background: rgba(255, 255, 255, 0.04);
        border: none;
        border-left: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 0;
        color: rgba(255, 255, 255, 0.6);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        cursor: pointer;
        transition: background 0.2s ease, color 0.2s ease;
    }

    #masthead #site-navigation button.dropdown-toggle:hover,
    #masthead #site-navigation button.dropdown-toggle:focus {
        background: #0d89d3;
        color: #fff;
        outline: none;
    }

    #masthead #site-navigation button.dropdown-toggle .fa {
        color: inherit;
        font-size: 14px;
        transition: transform 0.25s ease;
        pointer-events: none;
    }

    #masthead #site-navigation button.dropdown-toggle.active .fa {
        transform: rotate(180deg);
    }

    /*
     * Sub-menus: flex-basis 100% wraps them onto their own row below
     * the link + button. display: none is explicit so jQuery's slideToggle
     * always starts from a known hidden state on first page load.
     */
    #masthead #site-navigation ul.sub-menu,
    #masthead #site-navigation ul ul {
        display: none;
        flex-basis: 100%;
        position: static;
        float: none;
        box-shadow: none;
        width: 100%;
        background: rgba(0, 0, 0, 0.25);
        border-top: 1px solid rgba(255, 255, 255, 0.06);
        border-left: none;
        border-radius: 0;
    }

    /* Sub-level link style */
    #masthead #site-navigation ul.sub-menu > li > a,
    #masthead #site-navigation ul ul > li > a {
        flex: 1;
        min-width: 0;
        display: block;
        padding: 12px 20px 12px 36px;
        color: rgba(255, 255, 255, 0.72);
        font-size: 0.875rem;
        border-left: 3px solid transparent;
        transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    #masthead #site-navigation ul.sub-menu > li > a:hover,
    #masthead #site-navigation ul ul > li > a:hover,
    #masthead #site-navigation ul.sub-menu > li > a:focus,
    #masthead #site-navigation ul ul > li > a:focus {
        background: rgba(255, 255, 255, 0.05);
        border-left-color: #0d89d3;
        color: #fff;
        text-decoration: none;
    }
}
@media (max-width: 767px) {
	 /* Full-width dropdown flush with bottom edge of header */
    #masthead #site-navigation ul.nav-menu {
		top: calc(100% + 0px);
		width: 100vw;
		left: 0;
}
/* Nav column flex layout */
.st-nav-col {
    position: static;
    gap: 0;
}
} /* end @media (max-width: 767px) */

/* --- Header Search --- */
.st-header-search-wrap {
    position: relative;
    margin-left: 14px;
    flex-shrink: 0;
}

#masthead .st-header-search-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #0d89d3;
    border: none;
    color: #ffffff;
    border-radius: 8px;
    padding: 8px 16px;
    font-size: 0.83rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
    white-space: nowrap;
    line-height: 1;
}

#masthead .st-header-search-toggle:hover,
#masthead .st-header-search-toggle:focus {
    background: #0d89d3;
    color: #ffffff;
    transform: scale(1.03);
    outline: 2px solid rgba(244, 103, 68, 0.4);
    outline-offset: 2px;
}

.st-search-label {
    display: none;
}

@media screen and (min-width: 1025px) {
    .st-search-label {
        display: inline;
    }
}

/* Search dropdown box */
.st-header-search-box {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    background: #ffffff;
    padding: 16px;
    border-radius: 10px;
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.2);
    min-width: 290px;
    z-index: 99999;
    border-top: 3px solid #0d89d3;
}

.st-header-search-box::before {
    content: '';
    position: absolute;
    top: -9px;
    right: 18px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 6px solid #0d89d3;
}

.st-header-search-box #searchform div {
    display: flex;
    gap: 8px;
    align-items: center;
}

.st-header-search-box input[type="text"] {
    flex: 1;
    width: auto;
    border: 1px solid #dde1ea;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 0.875rem;
    color: #333;
    background: #f8f9fc;
}

.st-header-search-box input[type="text"]:focus {
    border-color: #0d89d3;
    background: #fff;
    outline: none;
}

.st-header-search-box input[type="submit"] {
    background: #0d89d3;
    border: none;
    color: #ffffff;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.2s ease;
}

.st-header-search-box input[type="submit"]:hover {
    background: #0d89d3;
    color: #fff;
}

/* Mobile search box positioning */
@media screen and (max-width: 767px) {
    .st-header-search-box {
        right: -10px;
        min-width: 260px;
    }

    #masthead .st-header-search-toggle {
        padding: 7px 10px;
    }
}

/* =============================================================================
   ST Ayurvedic – Enhanced Blog Index & Visual Polish
   ============================================================================= */

/* --- Page background (color set via custom-background default in functions.php) --- */
#skip-link-target {
    min-height: 60vh;
}

.container.st-ayurvedic-index-wrap {
    padding-top: 10px;
    padding-bottom: 60px;
}

/* --- Blog section header --- */
.st-blog-section-header {
    margin-bottom: 35px;
}

.st-blog-section-header h2 {
    font-size: 1.15rem;
    font-weight: 700;
    color: #161921;
    margin: 0 0 10px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.st-section-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.st-section-divider::before {
    content: '';
    display: block;
    width: 44px;
    height: 3px;
    background-color: #0d89d3;
    border-radius: 2px;
    flex-shrink: 0;
}

.st-section-divider::after {
    content: '';
    display: block;
    flex: 1;
    height: 1px;
    background-color: #e2e6ed;
}

/* --- Post Cards: shadow, radius, hover lift --- */
/* Scoped to .col-md-6 parent to beat Bootstrap's .card border without !important */
.col-md-6 .st-ayurvedic-post-card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.07);
    overflow: hidden;
    transition: opacity 0.8s ease-out, transform 0.8s ease-out, box-shadow 0.3s ease;
    background: #fff;
}

.col-md-6 .st-ayurvedic-post-card.visible:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.13);
}

/* Featured image – consistent height */
.st-ayurvedic-post-card .card-img-top {
    height: 188px;
    object-fit: cover;
    width: 100%;
}

/* Image placeholder when no thumbnail */
.st-post-img-placeholder {
    height: 188px;
    background: linear-gradient(135deg, #eef2ff 0%, #dce8fd 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0d89d3;
    font-size: 2.8rem;
    opacity: 0.35;
}

/* Category label above the title */
.st-card-category-label {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #0d89d3;
    margin-bottom: 5px;
}

/* Card body */
.st-ayurvedic-post-card .card-body {
    padding: 1.1rem 1.15rem 0.65rem;
}

/* Card title */
.st-ayurvedic-post-card .card-title {
    font-size: 0.975rem;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 0.45rem;
}

.st-ayurvedic-post-card .card-title a {
    color: #161921;
    transition: color 0.2s ease;
}

.st-ayurvedic-post-card .card-title a:hover {
    color: #0d89d3;
    text-decoration: none;
}

/* Card excerpt */
.st-ayurvedic-post-card .card-text {
    font-size: 0.845rem;
    color: #666;
    line-height: 1.65;
    margin-bottom: 0;
}

/* Card footer — two-class chain beats Bootstrap's single .card-footer */
.st-ayurvedic-post-card .card-footer {
    background-color: #fafbfc;
    border-top: 1px solid #f0f0f0;
    padding: 0.7rem 1.15rem;
}

.st-ayurvedic-post-card .card-footer .text-muted {
    font-size: 0.775rem;
    color: #999;
}

/* Read More – pill shape; a + two classes beats Bootstrap's btn specificity */
a.btn.st-read-more-btn {
    border-radius: 20px;
    font-size: 0.78rem;
    padding: 4px 15px;
    letter-spacing: 0.2px;
}

/* --- Sidebar widgets ---
   .sidebar-area prefix adds class specificity to override theme defaults cleanly */
.sidebar-area .widget-categories,
.sidebar-area .widget-recent-posts,
.sidebar-area .widget-tags {
    border-radius: 12px;
    overflow: hidden;
}

.sidebar-area .widget-categories .widget-title,
.sidebar-area .widget-recent-posts .widget-title,
.sidebar-area .widget-tags .widget-title {
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #161921;
    padding-bottom: 10px;
    margin-bottom: 14px;
    border-bottom: 2px solid #0d89d3;
    position: relative;
}

/* Category list items
   Three-class chain beats Bootstrap .list-group-item (one class) */
.sidebar-area .widget-categories ul.list-group .list-group-item {
    border: none;
    border-radius: 8px;
    margin-bottom: 5px;
    padding: 8px 12px;
    background-color: #f8f9fc;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.sidebar-area .widget-categories ul.list-group .list-group-item:hover {
    background-color: #eef2ff;
    transform: translateX(4px);
}

.sidebar-area .widget-categories ul.list-group .list-group-item a {
    font-size: 0.875rem;
    color: #333;
    font-weight: 500;
    text-decoration: none;
}

.sidebar-area .widget-categories ul.list-group .list-group-item a:hover {
    color: #0d89d3;
}

/* Recent posts */
.sidebar-area .widget-recent-posts li.media {
    padding: 9px 0;
    border-bottom: 1px solid #f0f0f0;
    align-items: flex-start;
    gap: 10px;
}

.sidebar-area .widget-recent-posts li.media:last-child {
    border-bottom: none;
}

/* img: element + two-class chain beats any single-class rule */
.sidebar-area .widget-recent-posts .media img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0;
}

.sidebar-area .widget-recent-posts .media-body h5 {
    font-size: 0.825rem;
    line-height: 1.4;
    margin: 0;
}

.sidebar-area .widget-recent-posts .media-body h5 a {
    color: #333;
    transition: color 0.2s ease;
    text-decoration: none;
}

.sidebar-area .widget-recent-posts .media-body h5 a:hover {
    color: #0d89d3;
}

/* Tags — a + two classes beats Bootstrap .btn (one class) */
.sidebar-area .widget-tags a.btn.st-tags-btn {
    border-radius: 20px;
    font-size: 0.75rem;
    padding: 3px 12px;
}

/* Sidebar spacing */
.sidebar-area {
    padding-left: 20px;
}