/**
 * Unified Responsive Consistency Architecture (Desktop, Laptop, Tablet, Mobile)
 * Ensures pixel-perfect alignment, proportion, and spacing across all devices:
 * - Desktop (> 1366px): Max 1366px centered, full-width background
 * - Laptop (1025px - 1366px): Standard laptop scale
 * - Tablet (768px - 1024px): Proportional tablet layout, safe 20px padding
 * - Mobile (< 768px): Fluid 360px-430px modern smartphone layout, safe 15px padding
 */

/* ========================================================
   1. DESKTOP & LARGE MONITORS (> 1366px)
   ======================================================== */
@media (min-width: 1367px) {
    /* Header Bar (Post 563): Full Background, Centered Content */
    .elementor-element-4cc1c70 {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    /* Logo Container (Child 1) */
    .elementor-element-4cc1c70 > .elementor-element:nth-child(1) {
        max-width: 210px !important;
        flex-shrink: 0 !important;
    }

    /* Nav Menu Container (Child 2) */
    .elementor-element-4cc1c70 > .elementor-element:nth-child(2) {
        max-width: 1025px !important;
        flex-grow: 1 !important;
    }

    /* Search Button Container (Child 3) */
    .elementor-element-4cc1c70 > .elementor-element:nth-child(3) {
        max-width: 131px !important;
        flex-shrink: 0 !important;
    }

    /* Running Text / Marquee Bar */
    .elementor-element-2c0bb59 {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
    }

    .elementor-element-2c0bb59 > .elementor-element {
        max-width: 1366px !important;
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Global Boxed Sections & Containers */
    .elementor-section.elementor-section-boxed > .elementor-container,
    .e-con.e-con-boxed > .e-con-inner,
    .e-con:not(.e-con-full) > .e-con-inner {
        max-width: 1366px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Hero Banner & Slider Protection */
    .elementor-widget-prime-slider .prime-slider-wrapper {
        margin-left: auto;
        margin-right: auto;
    }
}

/* ========================================================
   2. TABLET MONITORS (768px - 1024px)
   ======================================================== */
@media (max-width: 1024px) and (min-width: 768px) {
    /* Safe container padding on tablets */
    .elementor-section.elementor-section-boxed > .elementor-container,
    .e-con > .e-con-inner,
    .e-con {
        box-sizing: border-box !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    /* Heading text auto-wrap */
    .elementor-heading-title {
        word-break: normal;
        overflow-wrap: break-word;
    }
}

/* ========================================================
   3. MOBILE SMARTPHONES (< 768px)
   ======================================================== */
@media (max-width: 767px) {
    /* Prevent unwanted horizontal overflow */
    body, html {
        overflow-x: hidden;
    }

    /* Safe side padding for all content containers */
    .elementor-section.elementor-section-boxed > .elementor-container,
    .e-con > .e-con-inner,
    .e-con.e-con-boxed {
        box-sizing: border-box !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* Fluid typography protection for long titles */
    h1, .elementor-heading-title {
        max-width: 100% !important;
        overflow-wrap: break-word !important;
        word-wrap: break-word !important;
        hyphens: auto;
    }

    /* Responsive images */
    .elementor-widget-image img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Clean running text / marquee on small screens */
    .krikil-marquee,
    .ue-marquee {
        font-size: 12px;
        line-height: 1.4;
    }
}
