/* Responsive presentation only: keep the existing palette and application behavior. */
@media (max-width: 991.98px) {
    .ec-topbar .ec-row { gap: 12px; }
    .ec-topbar .brand-link { flex-shrink: 0; }
    .ec-topbar .ec-mob-stack { flex: 1 1 0; gap: 6px; }
    .ec-topbar .ec-line2 { flex-direction: column; align-items: flex-end; gap: 6px; max-width: 100%; line-height: 1.4; }
    .ec-topbar .ec-line2 a { max-width: 100%; min-width: 0; }
    .ec-topbar .ec-trunc.email { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
    .ec-topbar .ec-line1 .btn { width: 32px; height: 32px; }
    .sticky-top .ec-toggler { min-height: 44px; }
    #navbarCollapse { max-height: calc(100dvh - 76px); }

    .hero-section { height: auto; min-height: 60vh; min-height: 60svh; padding: 48px 24px 64px; }
    .hero-section .hero-inner { width: 100%; min-width: 0; padding: 16px 0; }
    .hero-inner h1 { font-size: clamp(1.75rem, 1.1rem + 3.2vw, 3rem); line-height: 1.2; overflow-wrap: anywhere; }
    .hero-inner .default-btn { font-size: 1rem; padding: 12px 24px; }
    .page-header .display-2 { font-size: clamp(2rem, 1.1rem + 4vw, 3.5rem); }
    main h1, main .h1, main .display-5, .explained-title { font-size: clamp(1.5rem, 1.1rem + 2vw, 2.5rem); line-height: 1.3; }
    main h2:not(.h1):not(.display-2), main .h2 { font-size: clamp(1.375rem, 1.05rem + 1.6vw, 2rem); }
    main h3, main .h3 { font-size: clamp(1.25rem, 1rem + 1.2vw, 1.75rem); }
    main .fs-5 { font-size: clamp(1rem, .9rem + .5vw, 1.2rem) !important; }
    main :is(h1, h2, h3, h4, h5, h6), .breadcrumb-item { overflow-wrap: anywhere; }
    main .form-control, main .form-select { font-size: 1rem; }
    .counter-number + p { white-space: normal; }
    .feature-item .d-flex > div:last-child, .contact-panel .ms-3 { min-width: 0; overflow-wrap: anywhere; }
    .help-heading { white-space: normal; overflow: visible; font-size: clamp(1.5rem, 1.1rem + 2vw, 1.75rem); }
    .tech-fill-row > a { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
}

/* Rich text may contain long URLs or editor-inserted images and tables. */
:is(.prose-justify, .description-block, .privacy-container, .cms-public-block) { min-width: 0; overflow-wrap: anywhere; }
:is(.prose-justify, .description-block, .privacy-container, .cms-public-block) img { max-width: 100%; height: auto; }
:is(.prose-justify, .description-block, .privacy-container, .cms-public-block) :is(iframe, video) { max-width: 100%; }
:is(.prose-justify, .description-block, .privacy-container, .cms-public-block) table { display: block; max-width: 100%; overflow-x: auto; }
.footer-contact p { overflow-wrap: anywhere; }
.footer-contact p i { flex-shrink: 0; }
#newsletterForm { display: flex; flex-wrap: wrap; gap: 8px; }
#newsletterForm button { position: static !important; margin: 0 !important; min-height: 44px; max-width: 100%; white-space: normal; }
#newsletterForm input { padding-right: 1.5rem !important; }

@media (max-width: 575.98px) {
    .page-header.py-5, .page-header > .container.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
    .page-header.mb-5 { margin-bottom: 2rem !important; }
    main > .container-xxl.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
    .why-company-image, .company-welcome-row .why-company-image, .quote-image { height: 240px; }
    .quote-panel .btn[type="submit"] { width: 100%; padding-left: 16px !important; padding-right: 16px !important; white-space: normal; }
    .footer > .container.py-5 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
    #newsletterForm button { width: 100%; }
    .back-to-top { right: 16px; bottom: 16px; }
}

/* Home products: keep controls clear of the heading and show complete cards. */
@media (max-width: 991.98px) {
    .home-products-carousel .owl-stage { display: flex; align-items: stretch; }
    .home-products-carousel .owl-item { display: flex; flex: 0 0 auto; }
    .home-products-carousel .testimonial-item { width: 100%; margin-bottom: 16px !important; }
    .home-products-carousel .testimonial-item > a { height: 100%; }
    .home-products-carousel .testimonial-item h5 { font-size: clamp(1rem, .9rem + .4vw, 1.125rem); line-height: 1.45; overflow-wrap: anywhere; margin-bottom: 0; }
    .home-products-carousel .testimonial-item img { object-fit: contain; }
    .home-products-carousel .owl-nav {
        position: static;
        transform: none;
        justify-content: center;
        gap: 12px;
        margin: 8px 0 24px;
    }
    .home-products-carousel .owl-nav .owl-prev,
    .home-products-carousel .owl-nav .owl-next { margin: 0; width: 44px; height: 44px; font-size: 20px; }
}

/* Left-align footer content on phones only. */
@media (max-width: 767.98px) {
    .footer, .footer .btn.btn-link { text-align: left; }
    .footer h4::after { left: 0; transform: none; }
    .footer-contact p, .footer .d-flex { justify-content: flex-start; }
    .footer #newsletterForm :is(input, button) { text-align: left; }
    .copyright .text-center { text-align: left !important; }
}

/* Homepage service boxes under Technology Solutions for Business Growth. */
@media (max-width: 767.98px) {
    .services-section + .row .service-text > .d-flex > .justify-content-center {
        justify-content: flex-start !important;
        text-align: left;
    }
}

/* Technology cards share the tallest content height, including wrapped rows. */
.technology-main .row.mb-3.mt-5 {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 1fr;
}
.technology-main .row.mb-3.mt-5 > [class*="col-"] {
    display: flex;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.technology-main .tech-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
}
.technology-main .tech-card > .text-center.mt-3 {
    margin-top: auto !important;
    padding-top: 1rem;
}
@media (min-width: 768px) {
    .technology-main .row.mb-3.mt-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .technology-main .row.mb-3.mt-5 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Phone carousel controls: one centered row with a consistent gap below the cards. */
@media (max-width: 767.98px) {
    .home-products-carousel .testimonial-item { margin-bottom: 0 !important; }
    .home-products-carousel .owl-nav {
        position: static;
        inset: auto;
        transform: none;
        display: grid;
        grid-template-columns: repeat(2, 44px);
        align-items: center;
        gap: 16px;
        width: max-content;
        margin: 20px auto 24px;
    }
    .home-products-carousel .owl-nav .owl-prev,
    .home-products-carousel .owl-nav .owl-next {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        line-height: 1;
    }
    .home-products-carousel .owl-nav i { display: flex; line-height: 1; }
}

/* Compact technology cards with room for labels at every breakpoint. */
.technology-main .tech-card { padding: 20px; }
.technology-main .tech-card .tech-title {
    font-size: clamp(1.25rem, 1.1rem + .4vw, 1.375rem);
    line-height: 1.3;
    margin-bottom: 16px;
}
.technology-main .tech-card .tech-item {
    min-width: 0;
    margin: 4px 0;
    padding: 4px 0;
}
.technology-main .tech-item > span { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 575.98px) {
    .technology-main .tech-card { padding: 18px; }
}

/* Use one height across every row of a card section, without mixing sections. */
.row:has(> [class*="col-"] > :is(.service-item, .feature-item, .card, .testimonial-item)) {
    --card-columns: 1;
    display: grid;
    grid-template-columns: repeat(var(--card-columns), minmax(0, 1fr));
    grid-auto-rows: 1fr;
}
.row:has(> [class*="col-"] > :is(.service-item, .feature-item, .card, .testimonial-item)) > [class*="col-"] {
    display: flex;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}
.row > [class*="col-"] > :is(.service-item, .feature-item, .card, .testimonial-item) {
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
}
.industries-grid .card > .industry-image-frame { flex-shrink: 0; }
.home-products-carousel .owl-stage { display: flex; align-items: stretch; }
.home-products-carousel .owl-item { display: flex; flex: 0 0 auto; }
.home-products-carousel .testimonial-item { width: 100%; }
@media (min-width: 576px) {
    .row:has(> [class*="col-"] > .testimonial-item) { --card-columns: 2; }
}
@media (min-width: 768px) {
    .row:has(> [class*="col-"] > :is(.service-item, .feature-item, .card, .testimonial-item)) { --card-columns: 2; }
}
@media (min-width: 992px) {
    .row:has(> [class*="col-"] > :is(.card, .testimonial-item)) { --card-columns: 4; }
    .row:has(> [class*="col-"] > .service-item) { --card-columns: 3; }
}
@media (min-width: 1200px) {
    .row:has(> [class*="col-"] > .feature-item) { --card-columns: 4; }
}

/* Phone typography: override Bootstrap size utilities and older component sizes.
   Inputs retain 16px to avoid focus zoom on mobile browsers. */
@media (max-width: 767.98px) {
    body {
        --phone-copy: clamp(.875rem, .8rem + .35vw, .9375rem);
        --phone-heading: clamp(1.25rem, 1.1rem + .6vw, 1.375rem);
        font-size: var(--phone-copy);
    }
    main, .footer, .copyright { font-size: var(--phone-copy); line-height: 1.6; }
    main :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) {
        line-height: 1.35;
        overflow-wrap: anywhere;
    }
    main :is(h1, h2, .h1, .h2, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6, .fs-1, .fs-2) {
        font-size: var(--phone-heading) !important;
    }
    main :is(h3, .h3, .fs-3, .section-title, .help-heading) { font-size: 1.125rem !important; }
    main :is(h4, h5, .h4, .h5, .fs-4, .fs-5) { font-size: 1rem !important; }
    main :is(h6, .h6, .fs-6) { font-size: .9375rem !important; }
    main :is(p, li, .lead, .service-description, .service-content, .service-description-limit),
    main p:is(.fs-1, .fs-2, .fs-3, .fs-4, .fs-5, .fs-6) { font-size: var(--phone-copy) !important; }
    main :is(.prose-justify, .description-block, .privacy-container, .cms-public-block) { font-size: var(--phone-copy); }
    main :is(.prose-justify, .description-block, .privacy-container, .cms-public-block) :is(div, span, font)[style*="font-size"] {
        font-size: inherit !important;
    }
    main :is(h1, h2, h3, h4, h5, h6) :is(span, font, strong, b, a) { font-size: inherit !important; }
    main .hero-inner h1 { font-size: clamp(1.5rem, 1.35rem + .6vw, 1.625rem) !important; }
    main .page-header :is(h1, h2) { font-size: 1.5rem !important; }
    main :is(.service-item, .tech-card, .testimonial-item, .industries-grid .card) :is(h2, h3, h4, h5, h6, .tech-title) {
        font-size: 1rem !important;
        line-height: 1.4;
    }
    main .counter-number { font-size: 1.25rem !important; }
    main .tech-item { font-size: var(--phone-copy); }
    main .page-header .breadcrumb-item,
    main .page-header .breadcrumb-item a { font-size: .8125rem; }
    main :is(.btn, .default-btn, .read-more-link, .animated-read-more),
    .footer :is(.btn, .btn-link), .ec-nav-cta .btn { font-size: .875rem; }
    .footer h4 { font-size: 1rem; }
    .copyright { font-size: .8125rem; }
    .sticky-top #navbarCollapse .nav-link { font-size: .8125rem; }
    .ec-toggler-label { font-size: .75rem; }
    main .form-control, main .form-select, .footer .form-control { font-size: 1rem !important; }
    main .form-floating > label { font-size: .875rem; }
}

/* Technology choice tiles also keep equal widths and heights within each category. */
.tech-fill-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr));
    grid-auto-rows: 1fr;
}
.tech-fill-row > a { width: 100%; min-height: 44px; }

/* Compact, left-aligned homepage services heading on phones. */
@media (max-width: 767.98px) {
    .services-section.pt-5 { padding-top: 1rem !important; }
    .services-section .section-heading-white {
        max-width: none !important;
        text-align: left !important;
    }
}

/* Industry image previews are temporarily non-interactive. */
div.industry-row-frame, div.industry-image-frame { cursor: default; }
