/* =========================================================
   Meridian Author House — canonical responsive layer
   Loaded after custom.css so older breakpoints cannot undo it.
   ========================================================= */

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

*,
*::before,
*::after {
    box-sizing: border-box;
}

img,
video,
iframe,
svg {
    max-width: 100%;
}

textarea,
input,
select,
button {
    max-width: 100%;
}

@media (max-width: 991.98px) {
    .container,
    .container-fluid,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .row {
        margin-left: -10px;
        margin-right: -10px;
    }

    .row > [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }

    .padding__70 {
        padding-top: 52px !important;
        padding-bottom: 52px !important;
    }

    h1 { font-size: clamp(31px, 6vw, 48px); line-height: 1.12; }
    h2 { font-size: clamp(27px, 5vw, 38px); line-height: 1.16; }
    h3 { font-size: clamp(23px, 4vw, 31px); line-height: 1.2; }

    .center__heading__sec,
    .center__heading__sec p {
        width: 100% !important;
        max-width: 100% !important;
    }

    .about__img__sec,
    .about__imageMan,
    .process__img__tb,
    .book__cta1,
    .book__cta2,
    .faq__sec_tab::before,
    .cta::before {
        max-width: 100%;
    }

    .five__cta__sec {
        padding: 80px 20px !important;
        background-attachment: scroll !important;
    }

    .forth__cta__tab {
        background-attachment: scroll !important;
    }

    .banner__form__tab {
        margin-left: 20px !important;
    }

    .clp-popup {
        width: min(920px, calc(100vw - 28px)) !important;
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: 15px;
        line-height: 1.65;
    }

    .container,
    .container-fluid,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .row {
        margin-left: -7px !important;
        margin-right: -7px !important;
    }

    .row > [class*="col-"] {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }

    .padding__70 {
        padding-top: 42px !important;
        padding-bottom: 42px !important;
    }

    /* Mobile header */
    header.home {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        padding: 10px 9px 0 !important;
        background: transparent !important;
        z-index: 9990 !important;
    }

    header.home .container {
        padding: 0 !important;
    }

    header.home .row {
        min-height: 72px !important;
        margin: 0 !important;
        padding: 7px 58px 7px 13px !important;
        border: 1px solid rgba(139, 30, 45, .2) !important;
        border-radius: 15px !important;
        background: rgba(255, 255, 255, .97) !important;
        box-shadow: 0 14px 35px rgba(33, 26, 28, .22) !important;
    }

    header.home .col-sm-3 {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 0 !important;
    }

    header.home .col-sm-9,
    header.home .main_menu_sec,
    header.home .navbar {
        display: none !important;
    }

    header.home .logo_Sec_main,
    header.home .logo_Sec_main a {
        display: flex !important;
        align-items: center !important;
        width: auto !important;
    }

    header.home .logo_Sec_main img {
        display: block;
        width: min(205px, 65vw) !important;
        height: auto !important;
        max-height: 56px !important;
    }

    .app-container {
        display: block !important;
        position: fixed !important;
        inset: 0 0 auto auto !important;
        z-index: 10001 !important;
    }

    .mobile-nav-btn,
    .mobile-nav-btn.active {
        display: block !important;
        position: fixed !important;
        top: 25px !important;
        right: 23px !important;
        left: auto !important;
        width: 42px !important;
        height: 42px !important;
        border-radius: 11px !important;
        background: linear-gradient(135deg, #8b1e2d, #5a101c) !important;
        box-shadow: 0 9px 22px rgba(90, 16, 28, .32) !important;
        z-index: 10000001 !important;
    }

    .mobile-nav-btn span {
        display: block !important;
        position: static !important;
    }

    .mobile-nav-btn .lines::before {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        color: #fff !important;
        background: transparent !important;
        font-size: 20px !important;
    }

    .mobile-nav {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        width: min(88vw, 370px) !important;
        max-width: 370px !important;
        height: 100dvh !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        background: linear-gradient(160deg, #5a101c, #8b1e2d 68%, #211a1c) !important;
        box-shadow: -20px 0 55px rgba(0, 0, 0, .33) !important;
        transform: translateX(105%) !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform .32s ease, visibility .32s ease !important;
        z-index: 10000000 !important;
    }

    .mobile-nav.active {
        right: 0 !important;
        transform: translateX(0) !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .mobile-nav ul {
        padding-top: 82px !important;
        padding-bottom: 34px !important;
    }

    .mobile-nav nav > ul > li > a {
        padding: 11px 21px !important;
        border-bottom: 1px solid rgba(255, 255, 255, .1);
        color: #fff !important;
        font-size: 14px !important;
        line-height: 1.35;
    }

    .mobile-nav nav li ul {
        margin: 0 10px !important;
        padding: 0 !important;
        overflow: hidden;
        border-radius: 9px;
        background: #fff8f0 !important;
    }

    .mobile-nav nav li ul li a {
        padding: 9px 14px !important;
        color: #35292d !important;
        font-size: 12px !important;
        line-height: 1.35;
        white-space: normal;
    }

    .clp-mobile-close {
        display: flex !important;
        position: absolute !important;
        top: 18px !important;
        right: 18px !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        border: 2px solid rgba(255, 255, 255, .7) !important;
        border-radius: 50% !important;
        color: #761522 !important;
        background: #fff !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .25) !important;
        font-size: 34px !important;
        line-height: 1 !important;
        cursor: pointer;
        z-index: 2 !important;
    }

    .clp-mobile-close span { transform: translateY(-2px); }

    .clp-mobile-backdrop {
        display: block !important;
        position: fixed !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        border: 0 !important;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        background: rgba(20, 11, 14, .62) !important;
        backdrop-filter: blur(2px);
        transition: opacity .3s ease, visibility .3s ease;
        z-index: 9999999 !important;
    }

    .clp-mobile-backdrop.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    body.clp-mobile-menu-open { overflow: hidden !important; }

    /* Homepage hero */
    section.banner___sec__main.homepage {
        min-height: 0 !important;
        height: auto !important;
        padding: 102px 0 45px !important;
        background-attachment: scroll !important;
        background-position: 46% center !important;
    }

    .banner___sec__main .btn_web,
    .banner___sec__main .btn_web ul {
        width: 100% !important;
        max-width: 100% !important;
    }

    .banner___sec__main .btn_web ul {
        display: flex !important;
        flex-flow: row nowrap !important;
        gap: 4px !important;
        padding: 3px !important;
    }

    .banner___sec__main .btn_web ul li {
        display: flex !important;
        flex: 1 1 33.333% !important;
        width: 33.333% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .banner___sec__main .btn_web ul li a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 7px 2px !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        font-size: clamp(8px, 2.55vw, 11px) !important;
        line-height: 1.15 !important;
        text-align: center !important;
    }

    section.banner___sec__main.homepage .carousel,
    section.banner___sec__main.homepage .carousel-inner,
    section.banner___sec__main.homepage .carousel-item {
        height: auto !important;
        min-height: 0 !important;
    }

    section.banner___sec__main.homepage .carousel-caption {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        transform: none !important;
    }

    section.banner___sec__main.homepage .carousel-caption .row {
        display: block !important;
    }

    .homepage .banner__content__sec {
        width: 100%;
        padding: 15px 5px 15px 16px !important;
    }

    .homepage .banner__content__sec::before {
        top: 15px !important;
        height: 54px !important;
    }

    .homepage .banner__content__sec h1 {
        margin-bottom: 14px !important;
        font-size: clamp(31px, 9vw, 43px) !important;
        line-height: 1.07 !important;
    }

    .homepage .banner__content__sec p {
        margin-bottom: 5px;
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

    .homepage .banner__form__tab,
    .inner__about__sec .banner__form__tab,
    .banner__form__tab {
        width: 100% !important;
        max-width: 100% !important;
        margin: 22px 0 0 !important;
        padding: 22px 16px !important;
        border-radius: 23px 3px !important;
    }

    .banner__form__tab h3 {
        font-size: 22px !important;
        line-height: 1.2 !important;
    }

    .banner__form__tab input,
    .banner__form__tab textarea {
        width: 100% !important;
        font-size: 16px !important;
    }

    /* Inner banners */
    section.banner___sec__main.inner__banner,
    section.banner___sec__main.inner__banner .carousel,
    section.banner___sec__main.inner__banner .carousel-inner,
    section.banner___sec__main.inner__banner .carousel-item {
        width: 100% !important;
        min-height: 270px !important;
        height: 270px !important;
        max-height: 270px !important;
    }

    section.banner___sec__main.inner__banner .carousel-item > img {
        display: block !important;
        width: 100% !important;
        height: 270px !important;
        min-height: 270px !important;
        object-fit: cover !important;
        object-position: 69% center !important;
    }

    section.banner___sec__main.inner__banner .carousel-caption {
        display: flex !important;
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        padding: 93px 12px 16px !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 20 !important;
    }

    section.banner___sec__main.inner__banner .banner__content__sec {
        width: 94% !important;
        max-width: 520px !important;
        margin: 0 auto !important;
        padding: 13px 11px !important;
        border-radius: 12px !important;
        text-align: center !important;
        background: rgba(24, 12, 15, .82) !important;
    }

    section.banner___sec__main.inner__banner h1,
    section.banner___sec__main.inner__banner h1 span {
        display: inline !important;
        margin: 0 !important;
        color: #fff !important;
        -webkit-text-fill-color: #fff !important;
        font-size: clamp(21px, 6.5vw, 29px) !important;
        line-height: 1.12 !important;
        text-align: center !important;
        overflow-wrap: anywhere;
    }

    section.banner___sec__main.inner__banner h1 br {
        display: none;
    }

    /* Content columns and decorative layouts */
    .inner__about__sec .col-sm-6.pl-5,
    footer .col-sm-8.pl-5,
    [class*="col-"][class*="pl-"] {
        padding-left: 7px !important;
    }

    .about__content__sec,
    .process__box__content,
    .story__content__Sec,
    .third__CTA_content,
    .CTA__content__box_overlay {
        width: 100% !important;
        max-width: 100% !important;
    }

    .about__img__sec,
    .about__imageMan {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        margin: 18px auto 0 !important;
        transform: none !important;
    }

    .about__img__sec img,
    .about__imageMan img,
    .story__img__Sec img,
    .process__img__tb img {
        display: block;
        width: 100% !important;
        height: auto !important;
        margin: 0 auto;
        object-fit: cover;
    }

    .services__boxes__slider,
    .logo-platform,
    .testimonial_sec_main,
    .portfolio__slider {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .process__box__content,
    .book__portfolio__sec,
    .review__tab {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .review__tab p,
    .third__CTA_content p,
    .CTA__content__box_overlay p {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 15px !important;
        line-height: 1.65 !important;
    }

    .timeline___sec__main .col-sm-3,
    .timeline___sec__main .col-sm-9 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    /* CTA cards. Three buttons remain in one row per request. */
    .cta {
        padding: 42px 10px !important;
        margin: 20px 0 !important;
    }

    .cta .center__heading__sec,
    .third__CTA_content,
    .CTA__content__box_overlay {
        display: block !important;
        width: 100% !important;
        padding: 22px 13px !important;
        border-radius: 16px !important;
    }

    .cta_content {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 17px !important;
        text-align: center !important;
    }

    .cta .center__heading__sec h2,
    .third__CTA_content h3,
    .CTA__content__box_overlay h2 {
        font-size: clamp(24px, 7vw, 31px) !important;
        line-height: 1.12 !important;
        text-align: center !important;
    }

    .cta .center__heading__sec p,
    .third__CTA_content p,
    .CTA__content__box_overlay p {
        text-align: center !important;
    }

    .cta .btn_web,
    .second__CTA_main .btn_web,
    .five__cta__sec .btn_web,
    .third__CTA_content .btn_web,
    .CTA__content__box_overlay .btn_web {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 3px !important;
    }

    .cta .btn_web ul,
    .second__CTA_main .btn_web ul,
    .five__cta__sec .btn_web ul,
    .third__CTA_content .btn_web ul,
    .CTA__content__box_overlay .btn_web ul {
        display: flex !important;
        flex-flow: row nowrap !important;
        width: 100% !important;
        gap: 4px !important;
        padding: 3px !important;
    }

    .cta .btn_web ul li,
    .second__CTA_main .btn_web ul li,
    .five__cta__sec .btn_web ul li,
    .third__CTA_content .btn_web ul li,
    .CTA__content__box_overlay .btn_web ul li {
        display: flex !important;
        flex: 1 1 33.333% !important;
        width: 33.333% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .cta .btn_web ul li a,
    .second__CTA_main .btn_web ul li a,
    .five__cta__sec .btn_web ul li a,
    .third__CTA_content .btn_web ul li a,
    .CTA__content__box_overlay .btn_web ul li a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 7px 2px !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        font-size: clamp(8px, 2.55vw, 11px) !important;
        line-height: 1.15 !important;
        text-align: center !important;
    }

    .second__CTA_main,
    .cta__sec__main,
    .five__cta__sec,
    .forth__cta__tab {
        width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        overflow: hidden;
    }

    /* Popup */
    .clp-popup-overlay {
        padding: 8px !important;
        align-items: center !important;
        overflow-y: auto !important;
    }

    .clp-popup {
        display: block !important;
        width: 100% !important;
        max-width: 520px !important;
        max-height: calc(100dvh - 16px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-radius: 18px !important;
    }

    .clp-popup::before { display: none !important; }

    .clp-popup-offer {
        min-height: 0 !important;
        padding: 30px 17px 23px !important;
        border-radius: 18px 18px 0 0 !important;
    }

    .clp-popup-offer::before {
        top: 11px !important;
        padding: 5px 11px !important;
        font-size: 8px !important;
    }

    .clp-popup-offer h2 {
        margin: 27px 0 8px !important;
        font-size: clamp(26px, 8vw, 34px) !important;
        line-height: 1.05 !important;
    }

    .clp-popup-offer p,
    .clp-popup-highlights {
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    .clp-countdown-label { margin-top: 14px !important; font-size: 12px; }

    .clp-countdown {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 4px !important;
        width: 100% !important;
    }

    .clp-time-box {
        min-width: 0 !important;
        padding: 8px 1px !important;
    }

    .clp-time-box strong { font-size: 20px !important; }
    .clp-time-box span { font-size: 7px !important; letter-spacing: 0 !important; }

    .clp-popup-form-wrap {
        min-height: 0 !important;
        padding: 24px 16px 17px !important;
        border-radius: 0 0 18px 18px !important;
    }

    .clp-popup-form-wrap h3 { padding-right: 32px; font-size: 23px !important; }
    .clp-popup-form-wrap > p { margin-bottom: 12px; font-size: 12px; }

    .clp-popup-form input,
    .clp-popup-form textarea {
        margin-bottom: 8px !important;
        padding: 10px 11px !important;
        font-size: 16px !important;
    }

    .clp-popup-form textarea { min-height: 72px !important; }

    .clp-popup-close {
        position: fixed !important;
        top: 12px !important;
        right: 12px !important;
        width: 39px !important;
        height: 39px !important;
        z-index: 10000002 !important;
    }

    /* Footer */
    footer {
        padding: 35px 0 25px !important;
    }

    footer .row > [class*="col-"] {
        margin-bottom: 24px;
        text-align: center;
    }

    .logo_footer_sec img {
        width: min(270px, 82vw) !important;
        max-width: 100% !important;
    }

    .footer_menu_sec ul,
    .term_links ul,
    .row.copy_text2 {
        justify-content: center !important;
        text-align: center !important;
    }

    .copy__right {
        padding: 24px 0 !important;
    }

    .copy__right .col-sm-4 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 18px;
        text-align: center;
    }

    .social_media_footer img,
    .social_media_footer.reviews ul li a {
        max-width: min(100%, 150px) !important;
    }

    /* Tables, embeds and long content cannot force horizontal scrolling. */
    table {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    pre,
    code,
    .scroll-block,
    .servcies__content__scroll {
        max-width: 100% !important;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 390px) {
    header.home .logo_Sec_main img { width: 172px !important; }
    .mobile-nav-btn,
    .mobile-nav-btn.active { right: 19px !important; }
    .homepage .banner__content__sec h1 { font-size: 30px !important; }
    section.banner___sec__main.inner__banner h1,
    section.banner___sec__main.inner__banner h1 span { font-size: 21px !important; }
    .cta .btn_web ul li a,
    .second__CTA_main .btn_web ul li a,
    .five__cta__sec .btn_web ul li a,
    .third__CTA_content .btn_web ul li a,
    .CTA__content__box_overlay .btn_web ul li a { font-size: 8.5px !important; }
}
