/* =========================================================
   LASTO HOME — MOBILE / TABLET REFERENCE IMPLEMENTATION
   Scope: index.php only (loaded by Home page only).
   Desktop remains locked: every rule is inside <= 768px.
   Header, menu, bottom navigation and footer are intentionally untouched.
   ========================================================= */

@media (max-width: 768px) {
    /* Home content shell */
    main {
        width: 100%;
        min-width: 0;
        overflow-x: clip;

        /* Shared Home mobile rhythm — used only inside <= 768px. */
        --home-gutter: clamp(12px, 2.5vw, 20px);
        --home-section-gap: clamp(18px, 3vw, 24px);
        --home-section-title: clamp(18px, 2.8vw, 22px);
        --home-section-link: clamp(10px, 1.45vw, 12px);
    }

    main > .hero,
    main > .benefits,
    main > .promotions,
    main > .featured-products,
    main > .ui-trusted-brands,
    main > .google-reviews {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    /* -----------------------------------------------------
       01 HOME HERO
       Reference: compact wide banner, copy on the left,
       artwork on the right, both hero CTAs retained.
       ----------------------------------------------------- */
    main > .hero {
        height: clamp(214px, 30vw, 250px) !important;
        min-height: clamp(214px, 30vw, 250px) !important;
        margin: 0 !important;
        padding: 10px var(--home-gutter) 0 !important;
    }

    main > .hero .hero-slider {
        height: 100% !important;
        min-height: 0 !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 12px !important;
        background: var(--theme-bg-surface) !important;
        box-shadow: var(--theme-shadow-soft) !important;
        overflow: hidden !important;
    }

    main > .hero .hero-slide,
    main > .hero .hero-art {
        border-radius: inherit !important;
    }

    main > .hero .hero-art {
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: 63% center !important;
    }

    main > .hero .hero-slide-dark::after {
        background: linear-gradient(90deg, rgba(4, 8, 17, .94) 0%, rgba(4, 8, 17, .78) 35%, rgba(4, 8, 17, .24) 67%, rgba(4, 8, 17, .03) 100%) !important;
    }

    main > .hero .hero-slide-light::after {
        background: linear-gradient(90deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .82) 35%, rgba(255, 255, 255, .24) 68%, rgba(255, 255, 255, .02) 100%) !important;
    }

    main > .hero .hero-content {
        left: clamp(18px, 4.4vw, 34px) !important;
        top: 50% !important;
        width: 47% !important;
        min-width: 0 !important;
        max-width: 340px !important;
        padding: 0 !important;
        transform: translateY(-50%) !important;
    }

    main > .hero .eyebrow {
        margin: 0 !important;
        font-size: clamp(7px, 1.25vw, 10px) !important;
        line-height: 1.2 !important;
        letter-spacing: .04em !important;
    }

    main > .hero h1,
    main > .hero h2 {
        margin: 5px 0 7px !important;
        font-size: clamp(22px, 4.2vw, 34px) !important;
        line-height: .98 !important;
        letter-spacing: -.7px !important;
    }

    main > .hero .hero-description {
        max-width: 245px !important;
        margin: 0 !important;
        font-size: clamp(7px, 1.35vw, 10px) !important;
        line-height: 1.45 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .hero .hero-actions {
        margin-top: 9px !important;
        display: flex !important;
        gap: 6px !important;
        flex-wrap: nowrap !important;
    }

    main > .hero .hero-actions .button,
    main > .hero .hero-actions .button:nth-child(n+2) {
        min-width: 0 !important;
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 11px !important;
        border-radius: 7px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        font-size: clamp(9px, 1.45vw, 11px) !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    main > .hero .hero-actions .button .icon {
        width: 14px !important;
        height: 14px !important;
        flex: 0 0 14px !important;
    }

    main > .hero .hero-dots {
        left: clamp(22px, 5vw, 38px) !important;
        right: auto !important;
        bottom: 8px !important;
        transform: none !important;
        gap: 5px !important;
    }

    main > .hero .hero-dot {
        width: 7px !important;
        height: 7px !important;
        min-width: 7px !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, .55) !important;
    }

    main > .hero .hero-dot.is-active {
        width: 7px !important;
        background: var(--theme-primary) !important;
    }

    /* -----------------------------------------------------
       HOME TRUST STRIP
       Reference: five equal compact items in one row.
       ----------------------------------------------------- */
    main > .benefits {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        min-height: 72px !important;
        margin: 10px var(--home-gutter) 0 !important;
        padding: 0 !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 10px !important;
        background: var(--theme-bg-surface) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        overflow: hidden !important;
        box-shadow: var(--theme-shadow-soft) !important;
    }

    main > .benefits .benefit {
        min-width: 0 !important;
        min-height: 72px !important;
        padding: 8px 5px !important;
        border: 0 !important;
        border-right: 1px solid var(--theme-border) !important;
        display: grid !important;
        grid-template-columns: 22px minmax(0, 1fr) !important;
        align-items: center !important;
        align-content: center !important;
        gap: 5px !important;
        text-align: left !important;
        color: var(--theme-text-primary) !important;
    }

    main > .benefits .benefit:last-child {
        border-right: 0 !important;
    }

    main > .benefits .benefit > .icon {
        width: 22px !important;
        height: 22px !important;
        padding: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--theme-primary) !important;
    }

    main > .benefits .benefit div {
        min-width: 0 !important;
    }

    main > .benefits .benefit h3 {
        margin: 0 0 3px !important;
        font-size: clamp(5.8px, 1vw, 8px) !important;
        line-height: 1.2 !important;
        font-weight: 800 !important;
        text-transform: uppercase !important;
        white-space: normal !important;
    }

    main > .benefits .benefit p {
        margin: 0 !important;
        display: block !important;
        color: var(--theme-text-secondary) !important;
        font-size: clamp(5px, .82vw, 6.5px) !important;
        line-height: 1.35 !important;
    }

    /* -----------------------------------------------------
       HOT OFFERS
       Reference: heading row above three equal deal cards.
       ----------------------------------------------------- */
    main > .promotions.site-container {
        width: 100% !important;
        min-height: 0 !important;
        margin: var(--home-section-gap) 0 0 !important;
        padding: 0 var(--home-gutter) !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 7px !important;
        overflow: visible !important;
        background: transparent !important;
    }

    main > .promotions .promotion-intro {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 2px 1px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    main > .promotions .promotion-intro .section-eyebrow {
        margin: 0 0 3px !important;
        color: var(--theme-primary) !important;
        font-size: clamp(6px, 1vw, 8px) !important;
        line-height: 1.2 !important;
        font-weight: 800 !important;
        text-transform: uppercase !important;
    }

    main > .promotions .promotion-intro h2 {
        margin: 0 !important;
        color: var(--theme-text-primary) !important;
        font-size: var(--home-section-title) !important;
        line-height: 1.02 !important;
        letter-spacing: -.35px !important;
    }

    main > .promotions .promotion-intro > p:not(.section-eyebrow) {
        display: none !important;
    }

    main > .promotions .promotion-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: clamp(112px, 18vw, 150px) !important;
        min-height: clamp(112px, 18vw, 150px) !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 9px !important;
        overflow: hidden !important;
        background-position: center !important;
        background-size: cover !important;
        box-shadow: var(--theme-shadow-soft) !important;
    }

    main > .promotions .promotion-copy {
        inset: 10px auto auto 10px !important;
        width: 58% !important;
        max-width: 58% !important;
    }

    main > .promotions .promotion-copy strong {
        font-size: clamp(8px, 1.6vw, 12px) !important;
        line-height: 1.05 !important;
    }

    main > .promotions .promotion-copy small {
        margin-top: 4px !important;
        font-size: clamp(5px, .9vw, 7px) !important;
        line-height: 1.35 !important;
    }

    main > .promotions .round-arrow {
        left: 10px !important;
        right: auto !important;
        bottom: 9px !important;
        width: 34px !important;
        height: 34px !important;
    }

    main > .promotions .round-arrow .icon {
        width: 14px !important;
        height: 14px !important;
    }

    /* -----------------------------------------------------
       FEATURED PRODUCTS — REFINED MOBILE
       Phones use a readable 2-column grid instead of shrinking four
       desktop cards into unreadable widths. Tablet returns to four columns.
       ----------------------------------------------------- */
    main > .featured-products {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        margin: var(--home-section-gap) var(--home-gutter) 0 !important;
        padding: 10px 0 0 !important;
        border-top: 1px solid var(--theme-border) !important;
        background: transparent !important;
        overflow: visible !important;
    }

    main > .featured-products .section-heading-row {
        margin: 0 0 10px !important;
        padding: 0 1px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    main > .featured-products .section-heading-row h2 {
        margin: 0 !important;
        font-size: var(--home-section-title) !important;
        line-height: 1.15 !important;
        letter-spacing: -.25px !important;
    }

    main > .featured-products .section-heading-row a {
        min-height: 32px !important;
        padding: 0 2px !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
        font-size: var(--home-section-link) !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    main > .featured-products .section-heading-row a .icon {
        width: 13px !important;
        height: 13px !important;
    }

    main > .featured-products .featured-products-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        align-items: stretch !important;
    }

    main > .featured-products .catalog-product-card {
        min-width: 0 !important;
        min-height: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 10px !important;
        background: var(--theme-bg-surface) !important;
        box-shadow: var(--theme-shadow-soft) !important;
        overflow: hidden !important;
    }

    main > .featured-products .catalog-product-card:nth-child(n+5) {
        display: none !important;
    }

    main > .featured-products .catalog-product-image {
        width: 100% !important;
        height: clamp(108px, 28vw, 128px) !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        padding: 7px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--theme-border) !important;
        background: var(--theme-bg-soft) !important;
    }

    main > .featured-products .catalog-product-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    main > .featured-products .product-badge {
        top: 7px !important;
        left: 7px !important;
        min-height: 19px !important;
        padding: 0 7px !important;
        border-radius: 999px !important;
        display: inline-flex !important;
        align-items: center !important;
        font-size: clamp(7px, 1.65vw, 9px) !important;
        line-height: 1 !important;
    }

    main > .featured-products .catalog-product-content {
        min-height: 0 !important;
        flex: 1 1 auto !important;
        padding: 9px !important;
        display: flex !important;
        flex-direction: column !important;
        background: var(--theme-bg-surface) !important;
    }

    main > .featured-products .catalog-product-main {
        min-height: 0 !important;
        flex: 0 0 auto !important;
    }

    main > .featured-products .product-brand {
        margin: 0 0 4px !important;
        color: var(--theme-text-muted) !important;
        font-size: clamp(7.5px, 1.8vw, 9px) !important;
        line-height: 1.2 !important;
    }

    main > .featured-products .catalog-product-content h2,
    main > .featured-products .catalog-product-content h2 a {
        margin: 0 !important;
        min-height: 2.45em !important;
        color: var(--theme-text-primary) !important;
        font-size: clamp(11px, 2.7vw, 13px) !important;
        line-height: 1.22 !important;
        font-weight: 750 !important;
        white-space: normal !important;
        overflow: hidden !important;
        text-overflow: clip !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }

    main > .featured-products .catalog-product-spec,
    main > .featured-products .catalog-product-extra,
    main > .featured-products .catalog-product-availability {
        margin: 5px 0 0 !important;
        color: var(--theme-text-secondary) !important;
        font-size: clamp(9px, 2.15vw, 10.5px) !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    main > .featured-products .catalog-product-extra {
        display: none !important;
    }

    main > .featured-products .catalog-product-availability {
        margin-top: 4px !important;
        font-size: clamp(8px, 1.9vw, 9.5px) !important;
    }

    main > .featured-products .product-original-price {
        display: none !important;
    }

    main > .featured-products .catalog-product-bottom {
        margin-top: auto !important;
        padding-top: 7px !important;
    }

    main > .featured-products .catalog-product-bottom > strong {
        display: block !important;
        margin: 0 !important;
        color: var(--theme-text-primary) !important;
        font-size: clamp(16px, 4vw, 20px) !important;
        line-height: 1.05 !important;
        letter-spacing: -.3px !important;
    }

    main > .featured-products .catalog-product-actions {
        margin-top: 8px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 40px !important;
        gap: 6px !important;
    }

    main > .featured-products .product-details-button {
        min-width: 0 !important;
        min-height: 40px !important;
        height: 40px !important;
        padding: 0 8px !important;
        border-radius: 8px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: clamp(10px, 2.35vw, 11.5px) !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 8px !important;
    }

    main > .featured-products .product-card-whatsapp .icon {
        width: 18px !important;
        height: 18px !important;
    }

    /* -----------------------------------------------------
       TRUSTED BRANDS
       Reference: compact hero banner + nine visible logo chips.
       ----------------------------------------------------- */
    main > .ui-trusted-brands.trusted-brands-section {
        width: 100% !important;
        margin: var(--home-section-gap) 0 0 !important;
        padding: 0 var(--home-gutter) !important;
        background: transparent !important;
    }

    main > .ui-trusted-brands .trusted-brands-container {
        width: 100% !important;
        max-width: none !important;
        padding: 0 !important;
    }

    main > .ui-trusted-brands .trusted-brands-title {
        margin: 0 0 8px !important;
        color: var(--theme-text-primary) !important;
        font-size: var(--home-section-title) !important;
        line-height: 1.2 !important;
        text-align: left !important;
    }

    main > .ui-trusted-brands .trusted-brand-banner,
    main > .ui-trusted-brands .trusted-brand-slide {
        height: clamp(135px, 22vw, 176px) !important;
        min-height: clamp(135px, 22vw, 176px) !important;
        max-height: clamp(135px, 22vw, 176px) !important;
        border-radius: 10px !important;
        border-color: var(--theme-border) !important;
    }

    main > .ui-trusted-brands .trusted-brand-background {
        object-position: 69% center !important;
    }

    main > .ui-trusted-brands .trusted-brand-content {
        left: clamp(29px, 6vw, 46px) !important;
        top: 50% !important;
        width: 43% !important;
        max-width: 43% !important;
        transform: translateY(-50%) !important;
    }

    main > .ui-trusted-brands .trusted-brand-logo,
    main > .ui-trusted-brands .trusted-brand-content .showcase-brand-logo-frame {
        margin-bottom: 5px !important;
    }

    main > .ui-trusted-brands .trusted-brand-logo img,
    main > .ui-trusted-brands .trusted-brand-content img,
    main > .ui-trusted-brands .trusted-brand-main-logo {
        max-width: clamp(62px, 12vw, 92px) !important;
        max-height: clamp(22px, 4vw, 31px) !important;
    }

    main > .ui-trusted-brands .trusted-brand-main-logo.showcase-brand-logo--hp {
        max-width: clamp(22px, 4vw, 30px) !important;
        max-height: clamp(22px, 4vw, 30px) !important;
    }

    main > .ui-trusted-brands .trusted-brand-description,
    main > .ui-trusted-brands .trusted-brand-content > .trusted-brand-description {
        min-height: 0 !important;
        max-width: 180px !important;
        font-size: clamp(5.2px, .88vw, 7px) !important;
        line-height: 1.4 !important;
    }

    main > .ui-trusted-brands .trusted-brand-button,
    main > .ui-trusted-brands .trusted-brand-content > .trusted-brand-button {
        height: 36px !important;
        min-height: 36px !important;
        margin-top: 7px !important;
        padding: 0 11px !important;
        gap: 4px !important;
        font-size: clamp(9px, 1.55vw, 11px) !important;
    }

    main > .ui-trusted-brands .trusted-brand-button .icon {
        width: 12px !important;
        height: 12px !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow {
        width: 34px !important;
        height: 34px !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow.prev {
        left: 5px !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow.next {
        right: 5px !important;
    }

    main > .ui-trusted-brands .trusted-brand-list {
        width: 100% !important;
        margin-top: 7px !important;
        padding: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
        gap: 4px !important;
        overflow: visible !important;
    }

    main > .ui-trusted-brands .trusted-brand-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 4px !important;
        border-radius: 6px !important;
        background: var(--theme-logo-box) !important;
    }

    main > .ui-trusted-brands .trusted-brand-card img,
    main > .ui-trusted-brands .trusted-brand-card img[alt="HP logo"] {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 22px !important;
        object-fit: contain !important;
    }

    /* -----------------------------------------------------
       GOOGLE REVIEW BLOCK
       Reference: compact summary on left + one highlighted review on right.
       ----------------------------------------------------- */
    main > .google-reviews {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        margin: var(--home-section-gap) var(--home-gutter) 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    main > .google-reviews .google-reviews-shell {
        width: 100% !important;
        padding: 10px !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 10px !important;
        background: var(--theme-bg-surface) !important;
        box-shadow: var(--theme-shadow-soft) !important;
        display: grid !important;
        grid-template-columns: minmax(0, 36%) minmax(0, 64%) !important;
        gap: 8px !important;
        align-items: stretch !important;
    }

    main > .google-reviews .google-reviews-summary {
        min-width: 0 !important;
        padding: 2px !important;
    }

    main > .google-reviews .google-reviews-brand {
        gap: 4px !important;
    }

    main > .google-reviews .google-wordmark {
        font-size: clamp(10px, 1.8vw, 14px) !important;
    }

    main > .google-reviews .google-reviews-label {
        padding: 2px 5px !important;
        font-size: clamp(4px, .7vw, 5.5px) !important;
    }

    main > .google-reviews .google-review-title {
        margin: 7px 0 5px !important;
        font-size: var(--home-section-title) !important;
        line-height: 1.05 !important;
    }

    main > .google-reviews .google-reviews-summary > p,
    main > .google-reviews .google-review-filter-notice {
        margin: 0 !important;
        color: var(--theme-text-secondary) !important;
        font-size: clamp(4.5px, .75vw, 6px) !important;
        line-height: 1.4 !important;
    }

    main > .google-reviews .google-review-stars {
        margin-top: 7px !important;
        gap: 4px !important;
        flex-wrap: wrap !important;
    }

    main > .google-reviews .google-review-stars > span {
        font-size: clamp(8px, 1.35vw, 10px) !important;
        letter-spacing: 0 !important;
    }

    main > .google-reviews .google-review-stars small {
        font-size: clamp(4px, .65vw, 5px) !important;
    }

    main > .google-reviews .google-review-filter-notice {
        margin-top: 4px !important;
    }

    main > .google-reviews .google-review-branch-links {
        margin-top: 7px !important;
        display: flex !important;
        gap: 4px !important;
        overflow: visible !important;
    }

    main > .google-reviews .google-review-branch-links a {
        min-width: 0 !important;
        min-height: 34px !important;
        height: 34px !important;
        padding: 0 8px !important;
        border-radius: 7px !important;
        font-size: clamp(8px, 1.3vw, 10px) !important;
        white-space: nowrap !important;
    }

    main > .google-reviews .google-review-branch-links a .icon {
        width: 8px !important;
        height: 8px !important;
    }

    main > .google-reviews .google-review-highlights {
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        overflow: visible !important;
    }

    main > .google-reviews .google-review-card {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 145px !important;
        height: 100% !important;
        padding: 9px !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 8px !important;
        background: var(--theme-bg-surface-2) !important;
        box-shadow: none !important;
    }

    main > .google-reviews .google-review-card:not(:first-child) {
        display: none !important;
    }

    main > .google-reviews .google-review-avatar {
        width: 25px !important;
        height: 25px !important;
        min-width: 25px !important;
        font-size: 8px !important;
    }

    main > .google-reviews .google-review-profile-copy strong {
        font-size: clamp(5.5px, .9vw, 7px) !important;
    }

    main > .google-reviews .google-review-profile-copy small,
    main > .google-reviews .google-review-rating-row small {
        font-size: clamp(4px, .65vw, 5px) !important;
    }

    main > .google-reviews .google-review-card-stars {
        font-size: clamp(7px, 1.1vw, 9px) !important;
        letter-spacing: 0 !important;
    }

    main > .google-reviews .google-review-card-text {
        margin: 7px 0 0 !important;
        color: var(--theme-text-secondary) !important;
        font-size: clamp(4.6px, .76vw, 6px) !important;
        line-height: 1.45 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 5 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .google-reviews .google-review-photo-strip {
        height: 42px !important;
        min-height: 42px !important;
        margin-top: 7px !important;
        gap: 4px !important;
    }

    main > .google-reviews .google-review-photo-strip img,
    main > .google-reviews .google-review-photo-strip video {
        min-width: 0 !important;
        height: 42px !important;
        border-radius: 5px !important;
        object-fit: cover !important;
    }
}

@media (min-width: 600px) and (max-width: 768px) {
    main > .featured-products .featured-products-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    main > .featured-products .catalog-product-image {
        height: 116px !important;
    }

    main > .featured-products .catalog-product-content {
        padding: 8px !important;
    }

    main > .featured-products .catalog-product-content h2,
    main > .featured-products .catalog-product-content h2 a {
        font-size: 11px !important;
    }

    main > .featured-products .catalog-product-spec {
        font-size: 9px !important;
    }

    main > .featured-products .catalog-product-bottom > strong {
        font-size: 17px !important;
    }

    main > .featured-products .catalog-product-actions {
        grid-template-columns: minmax(0, 1fr) 36px !important;
        gap: 5px !important;
    }

    main > .featured-products .product-details-button,
    main > .featured-products .product-card-whatsapp {
        min-height: 36px !important;
        height: 36px !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 36px !important;
        min-width: 36px !important;
    }

    main > .featured-products .product-details-button {
        font-size: 9.5px !important;
    }

    main > .featured-products .product-card-whatsapp .icon {
        width: 16px !important;
        height: 16px !important;
    }
}

/* =========================================================
   2026-08-16 — HOME PHONE FINAL CONSOLIDATED
   Clean source of truth for <=599px.
   Replaces the stacked V3–V8 phone overrides.
   Visual aim: current LASTO 70% + Samsung spacing 20% +
   Apple typography cleanliness 10%.
   Desktop remains locked.
   ========================================================= */
@media (max-width: 599px) {
    main {
        --home-gutter: 14px;
        --home-section-gap: 24px;
        --home-section-title: 21px;
        --home-section-link: 10px;
        overflow-x: clip;
    }

    /* ---------- HERO ---------- */
    main > .hero {
        width: 100% !important;
        height: 210px !important;
        min-height: 210px !important;
        margin: 0 !important;
        padding: 12px var(--home-gutter) 0 !important;
    }

    main > .hero .hero-slider {
        height: 100% !important;
        min-height: 0 !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        touch-action: pan-y !important;
        overscroll-behavior-x: contain !important;
    }

    main > .hero .hero-art {
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: 66% center !important;
    }

    main > .hero .hero-slide-dark::after {
        background: linear-gradient(90deg,rgba(4,8,17,.96) 0%,rgba(4,8,17,.82) 34%,rgba(4,8,17,.28) 67%,rgba(4,8,17,.04) 100%) !important;
    }

    main > .hero .hero-slide-light::after {
        background: linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.84) 34%,rgba(255,255,255,.25) 68%,rgba(255,255,255,.03) 100%) !important;
    }

    /* Top anchoring prevents long slides such as WORK SMARTER / MOVE FASTER
       from being clipped at the top or bottom. */
    main > .hero .hero-content {
        left: 20px !important;
        top: 16px !important;
        bottom: auto !important;
        width: 48% !important;
        min-width: 0 !important;
        max-width: 190px !important;
        padding: 0 !important;
        transform: none !important;
    }

    main > .hero .eyebrow {
        margin: 0 !important;
        font-size: 7.8px !important;
        line-height: 1.2 !important;
        letter-spacing: .055em !important;
        font-weight: 750 !important;
    }

    main > .hero h1,
    main > .hero h2 {
        margin: 5px 0 7px !important;
        font-size: 22px !important;
        line-height: .96 !important;
        letter-spacing: -.45px !important;
        font-weight: 850 !important;
    }

    main > .hero .hero-description {
        max-width: 180px !important;
        margin: 0 !important;
        font-size: 8.2px !important;
        line-height: 1.42 !important;
        letter-spacing: -.01em !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .hero .hero-actions {
        margin-top: 10px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 7px !important;
    }

    main > .hero .hero-actions .button,
    main > .hero .hero-actions .button:nth-child(n+2) {
        height: 37px !important;
        min-height: 37px !important;
        min-width: 0 !important;
        padding: 0 10px !important;
        border-radius: 9px !important;
        gap: 5px !important;
        font-size: 9.3px !important;
        line-height: 1 !important;
        font-weight: 750 !important;
        white-space: nowrap !important;
    }

    main > .hero .hero-actions .button .icon {
        width: 14px !important;
        height: 14px !important;
        flex: 0 0 14px !important;
    }

    main > .hero .hero-actions .button-primary.lasto-whatsapp-cta {
        border: 0 !important;
        background: var(--theme-primary) !important;
        color: #fff !important;
        box-shadow: 0 6px 16px rgba(91,57,238,.22) !important;
        font-weight: 800 !important;
    }

    main > .hero .hero-actions .button-primary.lasto-whatsapp-cta .icon {
        color: #16c96f !important;
    }

    /* Phone hero uses swipe + auto-rotation; no pagination collision. */
    main > .hero .hero-dots {
        display: none !important;
    }

    /* ---------- TRUST BENEFITS ---------- */
    main > .benefits {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        min-height: 92px !important;
        height: auto !important;
        margin: 13px var(--home-gutter) 0 !important;
        padding: 12px 5px 11px !important;
        display: grid !important;
        grid-template-columns: repeat(5,minmax(0,1fr)) !important;
        gap: 2px !important;
        overflow: hidden !important;
        border: 1px solid var(--theme-border) !important;
        border-radius: 14px !important;
        background: var(--theme-bg-surface) !important;
        box-shadow: none !important;
    }

    main > .benefits .benefit,
    main > .benefits .benefit:last-child {
        width: auto !important;
        min-width: 0 !important;
        min-height: 68px !important;
        height: auto !important;
        padding: 0 2px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 7px !important;
        text-align: center !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    main > .benefits .benefit > .icon {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 9px !important;
        border-radius: 10px !important;
        background: #f5f3ff !important;
        color: var(--theme-primary) !important;
        box-sizing: border-box !important;
    }

    main > .benefits .benefit div {
        width: 100% !important;
        min-width: 0 !important;
    }

    main > .benefits .benefit h3 {
        margin: 0 !important;
        color: var(--theme-text-primary) !important;
        font-size: 8.3px !important;
        line-height: 1.08 !important;
        font-weight: 800 !important;
        letter-spacing: -.08px !important;
        text-transform: none !important;
        white-space: normal !important;
        text-align: center !important;
    }

    main > .benefits .benefit p {
        display: none !important;
    }

    /* ---------- SPECIAL DEALS ---------- */
    main > .promotions.site-container {
        width: 100% !important;
        min-height: 0 !important;
        margin: var(--home-section-gap) 0 0 !important;
        padding: 0 var(--home-gutter) !important;
        display: block !important;
        overflow: visible !important;
    }

    main > .promotions .promotion-intro {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 0 11px !important;
        padding: 0 1px !important;
    }

    main > .promotions .promotion-intro .section-eyebrow {
        margin: 0 0 4px !important;
        font-size: 8px !important;
        line-height: 1.2 !important;
        letter-spacing: .05em !important;
        font-weight: 750 !important;
    }

    main > .promotions .promotion-intro h2 {
        margin: 0 !important;
        font-size: 22px !important;
        line-height: 1.04 !important;
        letter-spacing: -.35px !important;
        font-weight: 800 !important;
    }

    main > .promotions .promotion-intro > p:not(.section-eyebrow) {
        display: none !important;
    }

    main > .promotions .promotion-cards {
        display: flex !important;
        width: calc(100% + var(--home-gutter)) !important;
        margin-right: calc(var(--home-gutter) * -1) !important;
        padding: 0 var(--home-gutter) 3px 0 !important;
        gap: 11px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important;
        overscroll-behavior-inline: contain !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    main > .promotions .promotion-cards::-webkit-scrollbar {
        display: none !important;
    }

    main > .promotions .promotion-card {
        flex: 0 0 88% !important;
        width: 88% !important;
        min-width: 88% !important;
        max-width: 88% !important;
        height: 160px !important;
        min-height: 160px !important;
        border-radius: 13px !important;
        scroll-snap-align: start !important;
        box-shadow: var(--theme-shadow-soft) !important;
    }

    main > .promotions .promotion-copy {
        inset: 16px auto auto 16px !important;
        width: 52% !important;
        max-width: 52% !important;
    }

    main > .promotions .promotion-copy strong {
        font-size: 15.5px !important;
        line-height: 1.08 !important;
        letter-spacing: -.15px !important;
    }

    main > .promotions .promotion-copy small {
        margin-top: 6px !important;
        font-size: 9.4px !important;
        line-height: 1.34 !important;
    }

    main > .promotions .round-arrow {
        left: 16px !important;
        bottom: 13px !important;
        width: 38px !important;
        height: 38px !important;
    }

    /* ---------- FEATURED PRODUCTS ---------- */
    main > .featured-products {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        margin: var(--home-section-gap) var(--home-gutter) 0 !important;
        padding: 15px !important;
        border-radius: 15px !important;
        overflow: hidden !important;
    }

    main > .featured-products .section-heading-row {
        margin-bottom: 14px !important;
        align-items: baseline !important;
    }

    main > .featured-products .section-heading-row h2 {
        font-size: 21px !important;
        line-height: 1.08 !important;
        letter-spacing: -.35px !important;
        font-weight: 800 !important;
    }

    main > .featured-products .section-heading-row a {
        font-size: 9.5px !important;
        font-weight: 700 !important;
    }

    main > .featured-products .featured-products-grid {
        display: grid !important;
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
        gap: 14px 11px !important;
        overflow: visible !important;
    }

    main > .featured-products .catalog-product-card {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        border-radius: 13px !important;
        overflow: hidden !important;
    }

    main > .featured-products .catalog-product-image {
        height: 126px !important;
        min-height: 126px !important;
        padding: 10px !important;
    }

    main > .featured-products .catalog-product-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    main > .featured-products .catalog-product-content {
        padding: 12px 11px 11px !important;
    }

    main > .featured-products .product-brand,
    main > .featured-products .catalog-product-spec,
    main > .featured-products .catalog-product-extra,
    main > .featured-products .catalog-product-availability {
        display: none !important;
    }

    main > .featured-products .catalog-product-content h2,
    main > .featured-products .catalog-product-content h2 a {
        min-height: 2.7em !important;
        margin: 0 !important;
        font-size: 11.3px !important;
        line-height: 1.34 !important;
        font-weight: 700 !important;
        letter-spacing: -.08px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .featured-products .catalog-product-bottom {
        margin-top: 10px !important;
        padding-top: 0 !important;
        display: block !important;
    }

    main > .featured-products .catalog-product-bottom > strong {
        display: block !important;
        font-size: 17px !important;
        line-height: 1.1 !important;
        letter-spacing: -.2px !important;
    }

    main > .featured-products .catalog-product-actions {
        margin-top: 11px !important;
        display: grid !important;
        grid-template-columns: minmax(0,1fr) 40px !important;
        gap: 7px !important;
    }

    main > .featured-products .product-details-button,
    main > .featured-products .product-card-whatsapp {
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 9px !important;
    }

    main > .featured-products .product-details-button {
        min-width: 0 !important;
        padding-inline: 7px !important;
        font-size: 9.2px !important;
        font-weight: 700 !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 40px !important;
        min-width: 40px !important;
    }

    /* ---------- TRUSTED BRANDS ---------- */
    main > .ui-trusted-brands.trusted-brands-section {
        width: 100% !important;
        margin: var(--home-section-gap) 0 0 !important;
        padding: 0 var(--home-gutter) !important;
        background: transparent !important;
    }

    main > .ui-trusted-brands .trusted-brands-container {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    main > .ui-trusted-brands .trusted-brands-title {
        margin: 0 0 13px !important;
        font-size: 21px !important;
        line-height: 1.08 !important;
        letter-spacing: -.35px !important;
        font-weight: 800 !important;
        text-align: left !important;
    }

    main > .ui-trusted-brands .trusted-brand-banner,
    main > .ui-trusted-brands .trusted-brand-slide {
        height: 152px !important;
        min-height: 152px !important;
        max-height: 152px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }

    main > .ui-trusted-brands .trusted-brand-background {
        object-position: 69% center !important;
    }

    main > .ui-trusted-brands .trusted-brand-content {
        left: 42px !important;
        top: 50% !important;
        width: 48% !important;
        max-width: 48% !important;
        transform: translateY(-50%) !important;
        align-items: flex-start !important;
        text-align: left !important;
        padding: 0 !important;
    }

    main > .ui-trusted-brands .trusted-brand-logo,
    main > .ui-trusted-brands .trusted-brand-content .showcase-brand-logo-frame {
        margin-bottom: 5px !important;
    }

    main > .ui-trusted-brands .trusted-brand-content img,
    main > .ui-trusted-brands .trusted-brand-main-logo {
        max-width: 88px !important;
        max-height: 30px !important;
    }

    main > .ui-trusted-brands .trusted-brand-main-logo.showcase-brand-logo--hp {
        max-width: 30px !important;
        max-height: 30px !important;
    }

    main > .ui-trusted-brands .trusted-brand-description,
    main > .ui-trusted-brands .trusted-brand-content > .trusted-brand-description {
        max-width: 180px !important;
        margin: 0 !important;
        font-size: 7.2px !important;
        line-height: 1.42 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .ui-trusted-brands .trusted-brand-button,
    main > .ui-trusted-brands .trusted-brand-content > .trusted-brand-button {
        min-height: 38px !important;
        height: 38px !important;
        max-width: 100% !important;
        margin-top: 8px !important;
        padding: 0 12px !important;
        border-radius: 10px !important;
        font-size: 9.3px !important;
        font-weight: 700 !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow {
        top: 50% !important;
        width: 30px !important;
        height: 30px !important;
        transform: translateY(-50%) !important;
        z-index: 7 !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow.prev {
        left: 7px !important;
    }

    main > .ui-trusted-brands .trusted-brand-arrow.next {
        right: 7px !important;
    }

    main > .ui-trusted-brands .trusted-brand-list {
        width: 100% !important;
        margin-top: 12px !important;
        padding: 0 0 3px !important;
        display: flex !important;
        gap: 9px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: none !important;
        scroll-snap-type: x proximity !important;
    }

    main > .ui-trusted-brands .trusted-brand-list::-webkit-scrollbar {
        display: none !important;
    }

    main > .ui-trusted-brands .trusted-brand-card {
        flex: 0 0 82px !important;
        width: 82px !important;
        min-width: 82px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 7px !important;
        border-radius: 10px !important;
        scroll-snap-align: start !important;
    }

    main > .ui-trusted-brands .trusted-brand-card img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 28px !important;
        object-fit: contain !important;
    }

    /* ---------- GOOGLE REVIEWS ---------- */
    main > .google-reviews {
        width: calc(100% - (var(--home-gutter) * 2)) !important;
        margin: var(--home-section-gap) var(--home-gutter) 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    main > .google-reviews .google-reviews-shell {
        width: 100% !important;
        min-height: 0 !important;
        padding: 16px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 13px !important;
        border-radius: 15px !important;
        overflow: hidden !important;
    }

    main > .google-reviews .google-reviews-summary {
        min-width: 0 !important;
        padding: 0 !important;
    }

    main > .google-reviews .google-reviews-summary > p,
    main > .google-reviews .google-review-filter-notice {
        display: none !important;
    }

    main > .google-reviews .google-review-title {
        margin: 9px 0 8px !important;
        font-size: 21px !important;
        line-height: 1.1 !important;
        letter-spacing: -.35px !important;
        font-weight: 800 !important;
    }

    main > .google-reviews .google-review-stars {
        margin-top: 2px !important;
    }

    main > .google-reviews .google-review-highlights,
    main > .google-reviews .google-review-highlights--count-1 {
        width: 100% !important;
        min-width: 0 !important;
        display: block !important;
    }

    main > .google-reviews .google-review-card {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 15px !important;
        border-radius: 13px !important;
    }

    main > .google-reviews .google-review-card:not(:first-child) {
        display: none !important;
    }

    main > .google-reviews .google-review-avatar {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        font-size: 11px !important;
    }

    main > .google-reviews .google-review-profile-copy strong {
        font-size: 10.5px !important;
    }

    main > .google-reviews .google-review-profile-copy small,
    main > .google-reviews .google-review-rating-row small {
        font-size: 8.5px !important;
    }

    main > .google-reviews .google-review-card-stars {
        font-size: 10px !important;
    }

    main > .google-reviews .google-review-card-text {
        margin-top: 9px !important;
        font-size: 10.7px !important;
        line-height: 1.52 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 5 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    main > .google-reviews .google-review-photo-strip {
        height: 68px !important;
        min-height: 68px !important;
        margin-top: 10px !important;
        gap: 6px !important;
    }

    main > .google-reviews .google-review-photo-strip img,
    main > .google-reviews .google-review-photo-strip video {
        height: 68px !important;
        border-radius: 7px !important;
        object-fit: cover !important;
    }

    main > .google-reviews .google-review-branch-links {
        margin-top: 11px !important;
        display: flex !important;
        gap: 8px !important;
    }

    main > .google-reviews .google-review-branch-links a {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        min-height: 40px !important;
        height: 40px !important;
        padding: 0 8px !important;
        border-radius: 9px !important;
        font-size: 9px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
    }

    .footer {
        margin-top: 14px !important;
    }
}

@media (max-width: 375px) {
    main {
        --home-gutter: 12px;
        --home-section-gap: 22px;
    }

    main > .hero {
        height: 216px !important;
        min-height: 216px !important;
    }

    main > .hero .hero-content {
        left: 18px !important;
        width: 49% !important;
        max-width: 174px !important;
    }

    main > .hero h1,
    main > .hero h2 {
        font-size: 21px !important;
    }

    main > .hero .hero-actions .button,
    main > .hero .hero-actions .button:nth-child(n+2) {
        height: 35px !important;
        min-height: 35px !important;
        padding-inline: 8px !important;
        font-size: 8.7px !important;
    }

    main > .benefits {
        padding-inline: 3px !important;
        gap: 0 !important;
    }

    main > .benefits .benefit > .icon {
        width: 35px !important;
        height: 35px !important;
        min-width: 35px !important;
        min-height: 35px !important;
        padding: 8px !important;
    }

    main > .benefits .benefit h3 {
        font-size: 7.8px !important;
    }

    main > .promotions .promotion-card {
        flex-basis: 89% !important;
        width: 89% !important;
        min-width: 89% !important;
        max-width: 89% !important;
        height: 156px !important;
        min-height: 156px !important;
    }

    main > .featured-products {
        padding: 13px !important;
    }

    main > .featured-products .featured-products-grid {
        gap: 12px 9px !important;
    }

    main > .featured-products .catalog-product-image {
        height: 116px !important;
        min-height: 116px !important;
    }
}

/* =========================================================
   2026-08-16 — HOME PHONE HERO CTA MICRO FIX
   Keep both CTAs comfortably inside the hero on 375–430px.
   ========================================================= */
@media (max-width: 599px) {
    main > .hero .hero-content {
        overflow: visible !important;
    }

    main > .hero .hero-actions {
        width: 237px !important;
        max-width: calc(100vw - 70px) !important;
        margin-top: 10px !important;
        gap: 7px !important;
        align-items: center !important;
        justify-content: flex-start !important;
        overflow: visible !important;
    }

    main > .hero .hero-actions .button,
    main > .hero .hero-actions .button:nth-child(n+2) {
        box-sizing: border-box !important;
        min-width: 0 !important;
        height: 37px !important;
        min-height: 37px !important;
        padding: 0 8px !important;
        gap: 5px !important;
        overflow: hidden !important;
        text-overflow: clip !important;
    }

    main > .hero .hero-actions .button:first-child {
        flex: 0 0 109px !important;
        width: 109px !important;
        font-size: 9px !important;
    }

    main > .hero .hero-actions .button:nth-child(2) {
        flex: 0 0 121px !important;
        width: 121px !important;
        font-size: 8.9px !important;
    }

    main > .hero .hero-actions .button .icon,
    main > .hero .hero-actions .button-primary.lasto-whatsapp-cta .icon {
        width: 13px !important;
        height: 13px !important;
        flex: 0 0 13px !important;
        margin: 0 !important;
    }
}

@media (max-width: 375px) {
    main > .hero .hero-actions {
        width: 226px !important;
        gap: 6px !important;
    }

    main > .hero .hero-actions .button:first-child {
        flex-basis: 104px !important;
        width: 104px !important;
        font-size: 8.6px !important;
    }

    main > .hero .hero-actions .button:nth-child(2) {
        flex-basis: 116px !important;
        width: 116px !important;
        font-size: 8.5px !important;
    }
}

/* =========================================================
   2026-08-16 — HOME PHONE FEATURED PRODUCTS MICRO POLISH
   Equalise card rhythm so title, price and CTAs align cleanly
   across the two-column phone grid without changing desktop.
   ========================================================= */
@media (max-width: 599px) {
    main > .featured-products .featured-products-grid {
        align-items: stretch !important;
    }

    main > .featured-products .catalog-product-card {
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    main > .featured-products .catalog-product-content {
        flex: 1 1 auto !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 12px 12px 12px !important;
    }

    main > .featured-products .catalog-product-main {
        flex: 0 0 auto !important;
    }

    main > .featured-products .catalog-product-content h2,
    main > .featured-products .catalog-product-content h2 a {
        min-height: 2.68em !important;
        max-height: 2.68em !important;
        line-height: 1.34 !important;
    }

    main > .featured-products .catalog-product-bottom {
        margin-top: auto !important;
        padding-top: 11px !important;
    }

    main > .featured-products .catalog-product-bottom > strong {
        min-height: 21px !important;
        display: flex !important;
        align-items: center !important;
    }

    main > .featured-products .catalog-product-actions {
        margin-top: 10px !important;
        grid-template-columns: minmax(0, 1fr) 42px !important;
        gap: 8px !important;
    }

    main > .featured-products .product-details-button,
    main > .featured-products .product-card-whatsapp {
        height: 38px !important;
        min-height: 38px !important;
        border-radius: 9px !important;
    }

    main > .featured-products .product-details-button {
        padding-inline: 8px !important;
        font-size: 9.4px !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 38px !important;
        min-width: 38px !important;
    }
}

@media (max-width: 375px) {
    main > .featured-products .catalog-product-content {
        padding: 11px 10px !important;
    }

    main > .featured-products .catalog-product-actions {
        grid-template-columns: minmax(0, 1fr) 40px !important;
        gap: 7px !important;
    }

    main > .featured-products .product-details-button,
    main > .featured-products .product-card-whatsapp {
        height: 36px !important;
        min-height: 36px !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 36px !important;
        min-width: 36px !important;
    }
}

/* =========================================================
   2026-08-24 — FEATURED PRODUCTS / PRODUCTS CARD PARITY
   Keep exactly two compact product cards in view on phones and
   expose the remaining featured products through native swipe.
   Desktop and tablet layouts are intentionally unchanged.
   ========================================================= */
@media (max-width: 599px) {
    main > .featured-products {
        overflow: hidden !important;
    }

    main > .featured-products .featured-products-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: none !important;
        grid-auto-flow: column !important;
        grid-auto-columns: calc((100% - 10px) / 2) !important;
        gap: 10px !important;
        align-items: stretch !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 0 4px !important;
        scroll-snap-type: x mandatory !important;
        scroll-padding-inline: 0 !important;
        overscroll-behavior-inline: contain !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    main > .featured-products .featured-products-grid::-webkit-scrollbar {
        display: none !important;
    }

    main > .featured-products .catalog-product-card,
    main > .featured-products .catalog-product-card:nth-child(n+5) {
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        border-radius: 11px !important;
        scroll-snap-align: start !important;
        scroll-snap-stop: always !important;
    }

    main > .featured-products .catalog-product-image {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 1 / .86 !important;
        padding: 9px !important;
    }

    main > .featured-products .product-badge {
        top: 7px !important;
        left: 7px !important;
        min-height: 20px !important;
        padding: 0 7px !important;
        font-size: 7.5px !important;
    }

    main > .featured-products .catalog-product-content {
        flex: 1 1 auto !important;
        padding: 9px 9px 10px !important;
        display: flex !important;
        flex-direction: column !important;
    }

    main > .featured-products .catalog-product-main {
        min-height: 91px !important;
        flex: 0 0 auto !important;
    }

    main > .featured-products .product-brand {
        display: block !important;
        margin: 0 0 5px !important;
        font-size: 8px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    main > .featured-products .catalog-product-content h2,
    main > .featured-products .catalog-product-content h2 a {
        min-height: 30px !important;
        max-height: 30px !important;
        margin: 0 0 5px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    main > .featured-products .catalog-product-spec,
    main > .featured-products .catalog-product-extra {
        display: block !important;
        margin: 3px 0 0 !important;
        font-size: 9px !important;
        line-height: 1.35 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    main > .featured-products .catalog-product-availability {
        display: block !important;
        margin: 3px 0 0 !important;
        font-size: 8px !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    main > .featured-products .product-original-price {
        display: block !important;
        font-size: 8.5px !important;
    }

    main > .featured-products .catalog-product-bottom {
        margin-top: auto !important;
        padding-top: 8px !important;
    }

    main > .featured-products .catalog-product-bottom > strong {
        min-height: 0 !important;
        margin: 0 0 8px !important;
        display: block !important;
        font-size: 15.5px !important;
        line-height: 1.05 !important;
        letter-spacing: -.02em !important;
    }

    main > .featured-products .catalog-product-actions {
        margin-top: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 34px !important;
        gap: 6px !important;
    }

    main > .featured-products .product-details-button {
        min-width: 0 !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 7px !important;
        border-radius: 7px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }

    main > .featured-products .product-card-whatsapp {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        border-radius: 7px !important;
    }

    main > .featured-products .product-card-whatsapp .icon {
        width: 15px !important;
        height: 15px !important;
    }
}

@media (max-width: 375px) {
    main > .featured-products .featured-products-grid {
        grid-auto-columns: calc((100% - 8px) / 2) !important;
        gap: 8px !important;
    }
}

/* =========================================================
   2026-08-24 — GOOGLE REVIEWS MOBILE MICRO POLISH
   Keep the approved layout while making the review source,
   time metadata and final safe spacing easier to use.
   ========================================================= */
@media (min-width: 600px) {
    main > .google-reviews .google-review-read-link--mobile-extra {
        display: none !important;
    }
}

@media (max-width: 599px) {
    main > .google-reviews {
        margin-bottom: 16px !important;
    }

    main > .google-reviews .google-review-profile-copy small,
    main > .google-reviews .google-review-rating-row small {
        color: var(--theme-text-secondary) !important;
        font-weight: 600 !important;
        opacity: .92 !important;
    }

    main > .google-reviews .google-review-menu {
        color: var(--theme-text-secondary) !important;
        background: var(--theme-bg-soft) !important;
        opacity: .96 !important;
    }

    main > .google-reviews .google-review-read-link {
        margin-top: 9px !important;
        padding-top: 0 !important;
        align-self: flex-end !important;
        gap: 5px !important;
        font-size: 9px !important;
        line-height: 1.2 !important;
    }

    main > .google-reviews .google-review-read-link .icon {
        width: 11px !important;
        height: 11px !important;
    }
}

/* =========================================================
   2026-08-24 — HOME MOBILE SPACING STANDARD
   One predictable rhythm for every major Home section.
   Phone only: desktop and tablet layouts remain unchanged.
   ========================================================= */
@media (max-width: 599px) {
    main {
        --home-section-gap: 20px;
        --home-heading-content-gap: 14px;
    }

    main > .benefits {
        margin-top: var(--home-section-gap) !important;
    }

    main > .promotions.site-container,
    main > .featured-products,
    main > .ui-trusted-brands.trusted-brands-section,
    main > .google-reviews {
        margin-top: var(--home-section-gap) !important;
    }

    main > .promotions .promotion-intro,
    main > .featured-products .section-heading-row,
    main > .ui-trusted-brands .trusted-brands-title {
        margin-bottom: var(--home-heading-content-gap) !important;
    }

    main > .google-reviews .google-review-title {
        margin-bottom: var(--home-heading-content-gap) !important;
    }

    main > .google-reviews .google-reviews-shell {
        gap: var(--home-heading-content-gap) !important;
    }

    main > .google-reviews {
        margin-bottom: var(--home-section-gap) !important;
    }
}

/* =========================================================
   2026-09-03 — GOOGLE REVIEWS MOBILE READABILITY CLEANUP
   Scope: Home mobile Google Reviews only. Desktop unchanged.
   ========================================================= */
@media (max-width: 599px) {
    main > .google-reviews .google-reviews-shell {
        padding: 16px !important;
        gap: 14px !important;
    }

    main > .google-reviews .google-reviews-brand {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-wrap: wrap !important;
    }

    main > .google-reviews .google-wordmark {
        font-size: 18px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
    }

    main > .google-reviews .google-reviews-label {
        padding: 4px 8px !important;
        border-radius: 999px !important;
        font-size: 10px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
    }

    main > .google-reviews .google-review-title {
        margin: 10px 0 8px !important;
        font-size: 21px !important;
        line-height: 1.12 !important;
    }

    main > .google-reviews .google-review-stars {
        margin-top: 4px !important;
        gap: 7px !important;
        align-items: center !important;
    }

    main > .google-reviews .google-review-stars > span {
        font-size: 15px !important;
        line-height: 1 !important;
    }

    main > .google-reviews .google-review-stars small {
        font-size: 10px !important;
        line-height: 1.3 !important;
        font-weight: 600 !important;
    }

    main > .google-reviews .google-review-card {
        padding: 15px !important;
        border-radius: 13px !important;
        overflow: hidden !important;
    }

    main > .google-reviews .google-review-card-header {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
    }

    main > .google-reviews .google-review-profile {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    main > .google-reviews .google-review-avatar {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        font-size: 12px !important;
    }

    main > .google-reviews .google-review-profile-copy strong {
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    main > .google-reviews .google-review-profile-copy small,
    main > .google-reviews .google-review-rating-row small {
        font-size: 9.5px !important;
        line-height: 1.3 !important;
    }

    main > .google-reviews .google-review-rating-row {
        margin-top: 7px !important;
        gap: 8px !important;
        align-items: center !important;
    }

    main > .google-reviews .google-review-card-stars {
        font-size: 12px !important;
        line-height: 1 !important;
    }

    main > .google-reviews .google-review-card-text {
        margin: 10px 0 0 !important;
        font-size: 11px !important;
        line-height: 1.5 !important;
        -webkit-line-clamp: 5 !important;
    }

    main > .google-reviews .google-review-photo-strip {
        height: 76px !important;
        min-height: 76px !important;
        margin-top: 11px !important;
        gap: 6px !important;
        overflow: hidden !important;
    }

    main > .google-reviews .google-review-photo-strip img,
    main > .google-reviews .google-review-photo-strip video {
        height: 76px !important;
        min-width: 0 !important;
        border-radius: 8px !important;
        object-fit: cover !important;
    }

    main > .google-reviews .google-review-read-link,
    main > .google-reviews .google-review-read-link--mobile-extra {
        display: inline-flex !important;
        position: static !important;
        float: none !important;
        clear: both !important;
        width: fit-content !important;
        max-width: 100% !important;
        margin: 12px 0 0 auto !important;
        padding: 0 !important;
        align-items: center !important;
        justify-content: flex-end !important;
        align-self: flex-end !important;
        gap: 5px !important;
        font-size: 10px !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
        z-index: 1 !important;
    }

    main > .google-reviews .google-review-read-link .icon {
        width: 12px !important;
        height: 12px !important;
        flex: 0 0 12px !important;
    }
}

/* =========================================================
   2026-09-03 — GOOGLE REVIEWS MOBILE CORRECTION
   Restore the approved review section sizing/positioning.
   Only: add more gap after Trusted Brands, remove the outer
   section box appearance, and keep the shorter branch buttons.
   ========================================================= */
@media (max-width: 599px) {
    main > .google-reviews {
        margin-top: 32px !important;
    }

    /* Keep original shell geometry so review card size/position stays unchanged. */
    main > .google-reviews .google-reviews-shell {
        width: 100% !important;
        min-height: 0 !important;
        padding: 16px !important;
        gap: 14px !important;
        border-radius: 15px !important;
        overflow: hidden !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    main > .google-reviews .google-review-branch-links {
        margin-top: 10px !important;
        gap: 8px !important;
    }

    main > .google-reviews .google-review-branch-links a {
        min-height: 32px !important;
        height: 32px !important;
        padding: 0 9px !important;
        border-radius: 8px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }
}

/* =========================================================
   2026-09-03 — GOOGLE REVIEWS MOBILE POSITION ONLY
   Move the whole Google Reviews section lower to the marked
   reference position. Keep all internal sizes/spacing unchanged.
   ========================================================= */
@media (max-width: 599px) {
    main > .google-reviews {
        margin-top: 64px !important;
    }
}