/* Expound Premium — Site-wide responsive foundation */

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

.expound-premium,
.expound-premium-home {
    overflow-x: clip;
}

.expound-premium img,
.expound-premium video,
.expound-premium iframe,
.expound-premium svg,
.expound-premium-home img,
.expound-premium-home video,
.expound-premium-home iframe {
    max-width: 100%;
}

.expound-premium table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Touch-friendly controls */
.expound-premium a.ec-btn,
.expound-premium button.ec-btn,
.expound-premium .ec-header__toggle,
.expound-premium .ec-header__drawer-close,
.expound-premium .ec-portfolio-filters__btn {
    min-height: 44px;
}

/* Hub pages full width */
.expound-quote-hub .page-main,
.expound-contact-hub .page-main,
.expound-quote-hub .column.main,
.expound-contact-hub .column.main {
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.ec-quote-hub,
.ec-contact-hub {
    padding-bottom: 0;
}

/* Hero text — prevent clipping on phones */
.ec-services-hero--hub .ec-services-hero__title,
.ec-hero__title {
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

.ec-services-hero--hub .ec-services-hero__title {
    font-size: clamp(24px, 6.2vw, 44px);
    line-height: 1.12;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.ec-services-hero--hub .ec-services-hero__desc,
.ec-hero__lead {
    font-size: clamp(15px, 3.6vw, 18px);
    max-width: 100%;
    padding: 0 2px;
}

.ec-services-hero--hub {
    padding-top: clamp(48px, 10vw, 100px);
    padding-bottom: clamp(40px, 7vw, 72px);
}

/* Floating orbs — keep inside viewport */
@media (max-width: 768px) {
    .ec-float-1 {
        width: 160px !important;
        height: 160px !important;
        top: 8% !important;
        right: -18% !important;
        opacity: 0.55;
    }

    .ec-float-2 {
        width: 110px !important;
        height: 110px !important;
        bottom: 10% !important;
        left: -12% !important;
        opacity: 0.45;
    }
}

/* Urgency bar */
@media (max-width: 768px) {
    .ec-urgency-bar {
        font-size: 12px;
        padding: 8px 12px;
        line-height: 1.45;
    }
}

@media (max-width: 480px) {
    .ec-urgency-bar strong {
        display: inline;
    }
}

/* Sticky bottom CTA */
@media (max-width: 768px) {
    .ec-sticky-cta__inner {
        padding: 0 12px;
        gap: 8px;
        justify-content: center;
    }

    .ec-sticky-cta .ec-btn--sm {
        padding: 10px 12px;
        font-size: 12px;
        min-height: 44px;
        flex: 1 1 auto;
        min-width: 0;
        white-space: normal;
    }

    body.expound-premium.ec-sticky-visible {
        padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 400px) {
    .ec-sticky-cta .ec-btn--outline.ec-btn--sm {
        display: none;
    }
}

/* Sections */
@media (max-width: 768px) {
    .ec-section {
        padding: clamp(48px, 9vw, 72px) 0;
    }

    .ec-section__header {
        margin-bottom: 32px;
    }

    .ec-section__header--row {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .ec-section__subtitle {
        font-size: 16px;
    }

    .ec-section__cta-row {
        flex-direction: column;
        align-items: stretch;
    }

    .ec-section__cta-row .ec-btn {
        width: 100%;
    }
}

/* Buttons */
@media (max-width: 640px) {
    .ec-btn {
        white-space: normal;
        text-align: center;
    }

    .ec-services-hero__actions {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
    }

    .ec-services-hero__actions .ec-btn {
        width: 100%;
    }
}

/* Stats */
@media (max-width: 640px) {
    .ec-services-stats {
        margin-top: -16px;
        padding-bottom: 32px;
    }

    .ec-services-stats__grid {
        gap: 10px;
    }

    .ec-services-stats__item {
        padding: 16px 12px;
    }

    .ec-services-stats__item strong {
        font-size: 22px;
    }

    .ec-services-stats__item span {
        font-size: 10px;
    }
}

@media (max-width: 380px) {
    .ec-services-stats__grid {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* Trust marquee */
@media (max-width: 640px) {
    .ec-trust-marquee {
        padding: 14px 0;
    }

    .ec-trust-marquee .ec-trust-badge {
        font-size: 12px;
        padding: 8px 14px;
    }
}

/* Marketplace category hub */
@media (max-width: 768px) {
    .ec-marketplace-hero--hub {
        padding: clamp(40px, 10vw, 56px) 0 clamp(32px, 6vw, 48px);
    }

    .ec-marketplace-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .ec-marketplace-hero__actions .ec-btn {
        width: 100%;
        justify-content: center;
    }

    .ec-cat-stats {
        margin-top: -16px;
        padding-bottom: 20px;
    }

    .ec-cat-nav__link {
        padding: 8px 14px;
        font-size: 12px;
    }

    .expound-marketplace-expound-cat-hub .columns {
        padding-top: 20px;
    }

    .expound-marketplace-expound-cat-hub .sidebar-main {
        padding-right: 0;
        margin-bottom: 16px;
    }
}

/* Product / category grids (Magento catalog) */
@media (max-width: 991px) {
    .expound-premium .products-grid .product-item,
    .expound-premium .products.list .product-item {
        width: 50% !important;
    }
}

@media (max-width: 520px) {
    .expound-premium .products-grid .product-item,
    .expound-premium .products.list .product-item {
        width: 100% !important;
    }

    .expound-premium .page-main:not(.ec-premium *) {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* Modals */
@media (max-width: 480px) {
    .ec-modal {
        padding: 16px;
        align-items: flex-end;
    }

    .ec-modal__content {
        padding: 28px 20px;
        border-radius: 20px 20px 0 0;
        max-height: 90vh;
        overflow-y: auto;
    }
}

/* Premium product page */
@media (max-width: 768px) {
    .ec-product-tabs__menu li {
        padding: 8px 14px;
        font-size: 13px;
    }

    .ec-product-topbar__inner {
        flex-direction: column;
        align-items: flex-start;
    }
}

@supports (padding: env(safe-area-inset-bottom)) {
    .ec-sticky-cta {
        padding-bottom: calc(12px + env(safe-area-inset-bottom));
    }

    .ec-floating-whatsapp {
        bottom: calc(90px + env(safe-area-inset-bottom));
    }

    .ec-floating-phone {
        bottom: calc(160px + env(safe-area-inset-bottom));
    }

    body.expound-premium.ec-sticky-visible .ec-floating-whatsapp {
        bottom: calc(150px + env(safe-area-inset-bottom));
    }

    body.expound-premium.ec-sticky-visible .ec-floating-phone {
        bottom: calc(220px + env(safe-area-inset-bottom));
    }
}

/* =========================================================
   FULL-SITE RESPONSIVE HARDENING (phone / tablet / desktop)
   ========================================================= */

/* Kill page-level sideways scroll; keep carousels scrollable inside */
html,
body.expound-premium,
body.expound-premium-home,
body.expound-product-premium {
    overflow-x: hidden;
    max-width: 100vw;
}

.expound-premium .page-wrapper,
.expound-premium .page-main,
.expound-premium .columns,
.expound-premium .column.main,
.expound-product-premium .page-wrapper,
.expound-product-premium .column.main {
    max-width: 100%;
    box-sizing: border-box;
}

.expound-premium .ec-container,
.expound-premium .ec-section,
.expound-premium .ec-section__header {
    max-width: 100%;
    box-sizing: border-box;
}

/* Carousels / tracks must not widen the page */
.expound-premium .ec-products-carousel,
.expound-premium .ec-products-carousel__viewport,
.expound-premium .ec-testimonials-grid,
.expound-premium .ec-portfolio-marquee,
.expound-premium .ec-trust-marquee,
.expound-premium .ec-tech-card,
.expound-premium .ec-tech-card__icon-wrap {
    max-width: 100%;
    overflow-x: hidden;
}

.expound-premium .ec-tech-card {
    overflow: hidden;
}

.expound-premium .ec-products-carousel__track {
    max-width: none;
}

/* Tablet */
@media (max-width: 991px) {
    .expound-premium .page-main {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .expound-product-premium.catalog-product-view .page-main {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .ec-product-buybox {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        margin-bottom: 24px;
    }

    .ec-product-buybox .product-info-main {
        order: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .ec-product-buybox .product.media {
        order: 2 !important;
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        top: auto !important;
    }

    .ec-product-buybox .product.media,
    .ec-product-buybox .product-info-main {
        padding: 18px !important;
        border-radius: 16px;
    }

    .ec-product-tabs__inner {
        padding: 10px 0;
        gap: 8px;
    }

    .ec-product-tabs__menu {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 2px;
    }

    .ec-build-grid,
    .ec-case-grid,
    .ec-tech-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .ec-footer__grid {
        gap: 28px;
    }
}

/* Phones */
@media (max-width: 767px) {
    .expound-premium .page-main {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    /* Hero CTAs stack for usable tap targets */
    .ec-services-hero__actions,
    .ec-hero__actions,
    .ec-hero__cta,
    .ec-hero__cta--dual,
    .ec-final-cta__actions,
    .ec-sticky-cta__inner,
    .ec-sticky-cta__actions {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100%;
        max-width: 100%;
    }

    .ec-services-hero__actions .ec-btn,
    .ec-hero__actions .ec-btn,
    .ec-hero__cta .ec-btn,
    .ec-hero__cta--dual .ec-btn,
    .ec-final-cta__actions .ec-btn {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center;
        min-height: 48px;
    }

    /* Split hero → single column on phones */
    .ec-hero__split {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        text-align: center;
    }

    .ec-hero__cta--left {
        justify-content: center !important;
    }

    .ec-hero__lead--split,
    .ec-hero__trust--inline {
        margin-left: auto;
        margin-right: auto;
    }

    /* Header touch spacing */
    .ec-header__actions a,
    .ec-header__actions button,
    .ec-header__toggle {
        min-width: 44px;
        min-height: 44px;
    }

    body.expound-premium .ec-header .logo img,
    body.expound-premium .ec-logo__img {
        max-width: 110px !important;
        max-height: 48px !important;
    }

    /* Grids → single / dual column */
    .ec-testimonials-grid--v2,
    .ec-build-grid,
    .ec-case-grid,
    .ec-tech-grid,
    .ec-kpi-stats__grid,
    .ec-services-stats__grid {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .ec-kpi-stats__grid,
    .ec-services-stats__grid,
    .ec-hero-quickstats {
        grid-template-columns: 1fr 1fr !important;
    }

    .ec-products-carousel__slide {
        flex-basis: min(280px, calc(100vw - 96px)) !important;
        width: min(280px, calc(100vw - 96px)) !important;
    }

    /* Forms */
    .expound-premium input[type="text"],
    .expound-premium input[type="email"],
    .expound-premium input[type="tel"],
    .expound-premium input[type="password"],
    .expound-premium input[type="number"],
    .expound-premium select,
    .expound-premium textarea,
    .expound-product-premium input[type="text"],
    .expound-product-premium input[type="email"],
    .expound-product-premium select,
    .expound-product-premium textarea {
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        font-size: 16px !important; /* prevents iOS zoom on focus */
    }

    .ec-quote-form,
    .ec-contact-form,
    .product-options-wrapper,
    .product-options-bottom,
    .box-tocart {
        width: 100%;
        max-width: 100%;
    }

    .expound-product-premium .box-tocart .action.tocart,
    .expound-product-premium .ec-btn-shopify-install {
        min-height: 52px !important;
        font-size: 15px !important;
    }

    .expound-product-premium .page-title-wrapper .page-title {
        font-size: clamp(20px, 6vw, 26px);
    }

    .expound-product-premium .product-info-price .price-box .price {
        font-size: clamp(24px, 7vw, 32px) !important;
    }

    .ec-product-buybox .product.media .fotorama__stage {
        max-height: 280px !important;
    }

    .ec-product-trust {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        padding: 12px !important;
    }

    .ec-product-trust__item {
        font-size: 11px !important;
    }

    .ec-footer__grid {
        grid-template-columns: 1fr !important;
    }

    .ec-section__title {
        font-size: clamp(22px, 6.5vw, 30px);
        overflow-wrap: anywhere;
    }

    /* Floating widgets — keep clear of edges */
    .ec-floating-whatsapp,
    .ec-floating-phone {
        right: 12px;
    }
}

/* Small phones */
@media (max-width: 480px) {
    .ec-kpi-stats__grid,
    .ec-services-stats__grid,
    .ec-hero-quickstats,
    .ec-product-trust {
        grid-template-columns: 1fr !important;
    }

    .ec-product-tabs__menu li {
        padding: 8px 12px;
        font-size: 12px;
    }

    .ec-product-buybox .product.media,
    .ec-product-buybox .product-info-main {
        padding: 14px !important;
        border-radius: 14px;
    }

    .ec-products-carousel {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    .expound-premium .ec-products-carousel__arrow {
        position: absolute;
        top: 42%;
        z-index: 3;
    }

    .expound-premium .ec-products-carousel__arrow--prev { left: 4px; }
    .expound-premium .ec-products-carousel__arrow--next { right: 4px; }

    .ec-products-carousel__viewport {
        margin: 0;
    }
}

/* Large phones / small tablets landscape */
@media (min-width: 481px) and (max-width: 767px) {
    .ec-testimonials-grid--v2 {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* Desktop buybox safety */
@media (min-width: 992px) {
    .ec-product-buybox {
        display: grid !important;
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
        gap: 32px !important;
        align-items: start;
        width: 100%;
    }

    .ec-product-buybox .product.media,
    .ec-product-buybox .product-info-main {
        width: auto !important;
        max-width: 100% !important;
        float: none !important;
    }
}

/* =========================================================
   PASS 2 — remaining phone/tablet polish
   ========================================================= */

/* Never let Magento/Porto columns force a skinny half-width column */
@media (max-width: 991px) {
    body.expound-premium .columns,
    body.expound-product-premium .columns,
    body.expound-premium .column.main,
    body.expound-product-premium .column.main {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        flex: none !important;
    }

    body.expound-premium .sidebar,
    body.expound-product-premium .sidebar {
        display: none !important;
    }

    /* Porto next/prev product peeks — hide on small screens */
    .product-nav,
    .product-nav.product-next,
    .product-nav.product-prev {
        display: none !important;
    }
}

@media (max-width: 767px) {
    /* Compare section was overflowing (~417px into 326px) */
    .ec-compare {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .ec-compare__col {
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 18px !important;
        box-sizing: border-box;
    }

    .ec-compare__col li {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    /* TechTime / compact product cards — full width */
    .ec-techtime-grid,
    .ec-compact-products {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    /* Hero dashboard metrics — readable on phones */
    .ec-dashboard__metrics {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .ec-dashboard__metric {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 10px 12px !important;
    }

    .ec-dashboard__metric span {
        font-size: 11px !important;
    }

    .ec-dashboard__metric strong {
        font-size: 18px !important;
        margin: 0 !important;
    }

    .ec-dashboard__body {
        padding: 14px !important;
    }

    .ec-hero__visual,
    .ec-dashboard {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Avoid double side padding squeezing content */
    .expound-premium-home .page-main {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .expound-premium-home .ec-container,
    .expound-premium .ec-container {
        padding-left: 16px;
        padding-right: 16px;
        box-sizing: border-box;
        max-width: 100%;
    }

    /* Proof strip chips wrap cleanly */
    .ec-proof-strip__inner {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center;
        gap: 8px !important;
    }

    .ec-proof-strip__item {
        max-width: 100%;
    }

    /* Sticky CTA + WhatsApp — no overlap */
    .ec-floating-whatsapp,
    .ec-floating-phone {
        bottom: 88px !important;
        right: 14px !important;
        z-index: 950;
    }

    .ec-sticky-cta {
        z-index: 900;
    }

    .ec-sticky-cta__inner,
    .ec-sticky-cta__actions {
        padding-left: 12px;
        padding-right: 12px;
        box-sizing: border-box;
    }

    .ec-sticky-cta__actions .ec-btn {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: center;
    }

    /* Header: hide long logo tagline on phones (nowrap was crowding icons) */
    body.expound-premium .ec-logo-tagline,
    body.expound-premium .ec-header .ec-logo-tagline {
        display: none !important;
    }

    /* Keep header actions from wrapping awkwardly */
    .ec-header__row {
        flex-wrap: nowrap !important;
    }

    .ec-header__actions {
        flex-shrink: 0;
        gap: 4px !important;
    }

    /* Section rhythm on phones */
    .ec-section {
        padding-top: clamp(40px, 8vw, 64px) !important;
        padding-bottom: clamp(40px, 8vw, 64px) !important;
    }

    .ec-section__header {
        margin-bottom: 20px !important;
    }

    /* Quote / contact forms */
    .ec-quote-hub .ec-container,
    .ec-contact-hub .ec-container,
    .ec-quote-form,
    .ec-contact-form {
        max-width: 100% !important;
    }

    .ec-quote-form__grid,
    .ec-contact-form__grid,
    .ec-quote-fields,
    .ec-form-grid {
        grid-template-columns: 1fr !important;
    }

    /* Blog / news cards if present */
    .ec-blog-grid,
    .ec-latest-posts,
    .ec-post-grid {
        grid-template-columns: 1fr !important;
    }

    /* Category / product listing */
    .expound-premium.catalog-category-view .products-grid .product-items,
    .expound-premium .products.wrapper.grid .product-items {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
    }

    .expound-premium .product-item {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Magento messages / breadcrumbs */
    .expound-premium .breadcrumbs,
    .expound-product-premium .breadcrumbs,
    .expound-premium .page.messages,
    .expound-product-premium .page.messages {
        max-width: 100%;
        overflow-x: auto;
        padding-left: 12px;
        padding-right: 12px;
        box-sizing: border-box;
    }
}

@media (max-width: 480px) {
    .expound-premium.catalog-category-view .products-grid .product-items,
    .expound-premium .products.wrapper.grid .product-items {
        grid-template-columns: 1fr !important;
    }

    .ec-dashboard__metric {
        flex-wrap: wrap;
    }

    .ec-hero__title,
    .ec-hero__title--split {
        font-size: clamp(28px, 8.5vw, 36px) !important;
        line-height: 1.15 !important;
    }

    .ec-hero__trust {
        font-size: 12px !important;
        justify-content: center;
        text-align: center;
    }

    body.expound-premium .ec-header .logo img,
    body.expound-premium .ec-logo__img {
        max-width: 96px !important;
        max-height: 44px !important;
    }

    .ec-header__actions a,
    .ec-header__actions button {
        min-width: 40px !important;
        min-height: 40px !important;
    }
}

/* Tablet: compare stays 2-col but constrained */
@media (min-width: 768px) and (max-width: 991px) {
    .ec-compare {
        grid-template-columns: 1fr 1fr !important;
        gap: 16px !important;
        max-width: 100% !important;
    }

    .ec-compare__col {
        min-width: 0 !important;
        padding: 22px !important;
    }

    .ec-techtime-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    .ec-dashboard__metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}