/* Mobile-only presentation layer. Existing desktop styles remain the source of truth. */
.mobile-menu-head,
.mobile-menu-links,
.mobile-menu-social,
.mobile-menu-community,
.mobile-nav-backdrop,
.mobile-bottom-nav,
.mobile-filter-toggle,
.mobile-filter-head,
.mobile-filter-backdrop,
.catalog-route-tabs {
    display: none;
}

/* Compact, media-first product detail for retail and wholesale modes. */
@media (max-width: 768px) {
    .product-page {
        padding-top: 10px !important;
    }

    .product-page .breadcrumbs {
        gap: 6px !important;
        margin-bottom: 4px;
        padding-bottom: 4px;
        font-size: 10px !important;
    }

    .product-page .product-layout {
        gap: 8px !important;
        margin-top: 6px !important;
    }

    .product-page .product-gallery,
    .product-page .product-panel {
        display: contents !important;
    }

    .product-page .product-image-wrap {
        order: 0;
        width: 100%;
        overflow: hidden;
        border: 1px solid rgba(30, 58, 43, 0.12);
        border-radius: 8px;
        background: #ffffff;
    }

    .product-page .product-main-image-stage {
        border-radius: 7px;
    }

    .product-page .product-gallery .product-main-image {
        width: 100% !important;
        height: clamp(220px, 62vw, 246px) !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: contain !important;
    }

    .product-page .product-gallery-thumbnails {
        order: 0;
        grid-auto-columns: 50px !important;
        gap: 5px !important;
        width: 100%;
        margin: -2px 0 0 !important;
        padding: 6px 2px 2px;
    }

    .product-page .product-gallery-thumbnail {
        width: 50px !important;
        border-radius: 5px;
    }

    .product-page .product-gallery-thumbnail img {
        aspect-ratio: 1 / 1 !important;
    }

    .product-page .product-gallery-favorite {
        top: 9px !important;
        right: 9px !important;
        width: 38px !important;
        height: 38px !important;
        font-size: 20px !important;
    }

    .product-page .product-detail-gallery-nav {
        width: 34px !important;
        height: 48px !important;
    }

    .product-page .product-detail-gallery-count {
        right: 8px;
        bottom: 8px;
        padding: 4px 6px;
        font-size: 10px;
    }

    .product-page .product-purchase {
        order: 1;
        padding: 12px !important;
        box-shadow: none !important;
    }

    .product-page .product-gallery-description {
        order: 2;
        margin: 0 !important;
        padding: 13px !important;
        border: 1px solid rgba(30, 58, 43, 0.1) !important;
        border-radius: 8px;
        background: #ffffff;
    }

    .product-page .product-panel > :not(.product-purchase) {
        order: 3;
    }

    .product-page .product-badge-group {
        gap: 5px;
        margin-bottom: 6px !important;
    }

    .product-page .product-badge {
        padding: 4px 6px !important;
        font-size: 9px !important;
    }

    .product-page .product-stock-line {
        gap: 8px;
        margin: 2px 0 5px;
        font-size: 13px;
    }

    .product-page .stock-meter {
        grid-template-columns: repeat(3, 17px);
        gap: 3px;
    }

    .product-page .stock-meter i {
        height: 9px;
    }

    .product-page .product-panel h1 {
        margin: 5px 0 6px !important;
        font-size: 20px !important;
        line-height: 1.12 !important;
    }

    .product-page .product-lead {
        margin: 0 0 8px !important;
        font-size: 12px !important;
        line-height: 1.38 !important;
        -webkit-line-clamp: 2;
    }

    .product-page .product-variant-switcher {
        gap: 6px;
        margin: 7px 0 5px;
    }

    .product-page .product-variant-switcher > span {
        font-size: 10px;
    }

    .product-page .product-variant-options {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px;
    }

    .product-page .product-variant-options button {
        min-height: 48px;
        padding: 7px 10px;
    }

    .product-page .product-variant-options strong {
        font-size: 14px;
    }

    .product-page .product-variant-options small {
        font-size: 10px;
    }

    .product-page .product-price-row {
        gap: 8px;
        margin: 9px 0 !important;
    }

    .product-page .product-price-row .price-main,
    .product-page .product-price-row .price-main [data-product-price] {
        font-size: 25px !important;
    }

    .product-page .product-price-row .price-main [data-product-unit] {
        font-size: 10px !important;
    }

    .product-page .product-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px !important;
        margin-bottom: 0 !important;
    }

    .product-page .product-primary-btn,
    .product-page .product-favorite-detail-btn,
    .product-page .product-secondary-btn {
        min-height: 40px !important;
        padding: 7px 8px !important;
        font-size: 11px;
        line-height: 1.2;
        text-align: center;
    }

    .product-page .brew-method-icon {
        flex: 0 0 48px !important;
        width: 48px !important;
        height: 34px !important;
    }

    .product-page .brew-method-icon svg {
        width: 48px !important;
        height: 34px !important;
        fill: currentColor !important;
        stroke: none !important;
    }

    .product-page .wholesale-detail-stock {
        font-size: 12px;
    }

    .product-page .wholesale-detail-pricing {
        gap: 8px;
        margin: 10px 0 !important;
        padding: 10px !important;
    }

    .product-page .wholesale-detail-pricing-title {
        font-size: 9px;
    }

    .product-page .wholesale-detail-price-tiers {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 6px;
    }

    .product-page .wholesale-detail-price-tiers small {
        width: 100%;
        min-height: 24px;
        padding: 4px 5px;
        justify-content: center;
        font-size: 9px;
    }

    .product-page .wholesale-detail-price-tiers strong,
    .product-page .wholesale-detail-single-price strong {
        font-size: 16px;
    }

    .product-page .wholesale-detail-price-tiers em,
    .product-page .wholesale-detail-single-price em,
    .product-page .wholesale-detail-order-rule span,
    .product-page .wholesale-detail-order-rule small {
        font-size: 9px;
    }

    .product-page .wholesale-detail-order-rule {
        gap: 3px;
        margin-bottom: 10px;
        padding-top: 9px;
    }

    .product-page .wholesale-detail-order-rule strong {
        font-size: 17px;
    }

    .product-page .product-gallery-description h2 {
        margin-bottom: 6px;
        font-size: 18px;
    }

    .product-page .product-gallery-description p,
    .product-page .product-gallery-description-body {
        font-size: 12px;
        line-height: 1.45;
    }

    .product-page .product-description-more-btn {
        min-height: 38px;
        margin-top: 9px;
        padding: 0 14px;
        font-size: 11px;
    }

    .product-page .product-section-card,
    .product-page .product-brew-section,
    .product-page .product-taste-section,
    .product-page .product-teapot-section {
        margin-top: 0 !important;
        padding: 13px !important;
    }

    .product-page .product-brew-section h3,
    .product-page .product-taste-section h3,
    .product-page .product-teapot-section h3 {
        margin-bottom: 10px;
        font-size: 18px !important;
    }

    .product-page .brew-method-card {
        gap: 9px;
        padding: 11px;
    }

    .product-page .brew-method-visual {
        min-height: 58px;
        gap: 10px;
        padding-bottom: 8px;
    }

    .product-page .brew-method-icon {
        flex-basis: 48px;
        width: 48px;
        height: 34px;
    }

    .product-page .brew-method-volume strong,
    .product-page .brew-method-card h4 {
        font-size: 18px;
    }

    .product-page .brew-method-metrics {
        gap: 6px;
    }

    .product-page .brew-metric {
        grid-template-columns: 24px 1fr;
        gap: 8px;
        min-height: 40px;
        padding-top: 6px;
    }

    .product-page .brew-metric-icon {
        width: 23px;
        height: 23px;
    }

    .product-page .brew-metric strong {
        font-size: 17px;
    }

    .product-page .brew-metric span:not(.brew-metric-icon) {
        margin-top: 2px;
        font-size: 10px;
    }

    .product-page .taste-list {
        gap: 8px;
    }

    .product-page .taste-row-label {
        font-size: 13px;
    }

    .product-page .taste-row-dots {
        gap: 4px;
    }

    .product-page .taste-row-dots span {
        width: 12px;
        height: 12px;
    }
}

@media (max-width: 768px) {
    :root {
        --mobile-ink: #183f2c;
        --mobile-moss: #386149;
        --mobile-leaf: #a8c8a0;
        --mobile-paper: #ffffff;
        --mobile-cream: var(--brand-accent);
        --mobile-line: rgba(24, 63, 44, 0.14);
        --mobile-shadow: 0 14px 34px rgba(20, 48, 34, 0.13);
        --mobile-dock-height: 60px;
        --mobile-header-height: 96px;
    }

    html {
        scroll-padding-top: 104px;
    }

    body {
        padding-top: var(--mobile-header-height);
        padding-bottom: calc(var(--mobile-dock-height) + 14px + env(safe-area-inset-bottom));
        background: var(--mobile-paper);
    }

    body.mobile-layer-open {
        overflow: hidden;
    }

    .container {
        padding-right: 16px;
        padding-left: 16px;
    }

    #top-bar-module,
    .top-bar {
        display: none !important;
    }

    #header-module {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1100;
        width: 100%;
    }

    .main-header {
        padding: 4px 0 5px !important;
        border-bottom: 1px solid var(--mobile-line);
        background: #ffffff;
        box-shadow: 0 8px 24px rgba(20, 48, 34, 0.08);
    }

    .header-flex {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
        grid-template-rows: 40px 42px;
        gap: 4px 8px !important;
        padding-right: 12px;
        padding-left: 12px;
    }

    .logo {
        grid-column: 1;
        grid-row: 1;
        align-self: center;
    }

    .logo a {
        display: grid;
        width: 40px;
        height: 40px;
        place-items: center;
    }

    .logo img {
        width: 38px !important;
        height: 38px !important;
        object-fit: contain;
    }

    .mobile-nav-toggle {
        display: none !important;
    }

    .header-actions {
        display: flex !important;
        grid-column: 3;
        grid-row: 1;
        width: auto !important;
        margin: 0 !important;
        align-items: center;
        justify-content: flex-end !important;
        gap: 6px !important;
    }

    .header-actions .phone,
    .header-contact-label,
    .icon-circle-label,
    .header-cart-text {
        display: none !important;
    }

    .icon-group {
        display: flex;
        gap: 6px !important;
    }

    .header-contact-link,
    .icon-circle-account,
    .header-cart-link {
        display: inline-grid !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        place-items: center;
        border: 1px solid var(--mobile-line) !important;
        border-radius: 8px !important;
        background: var(--mobile-paper) !important;
        color: var(--mobile-ink) !important;
        box-shadow: none !important;
    }

    .header-cart-link {
        border-color: var(--mobile-ink) !important;
        background: var(--mobile-ink) !important;
        color: #ffffff !important;
    }

    .header-contact-link svg,
    .icon-circle-account svg,
    .header-cart-link svg {
        width: 19px !important;
        height: 19px !important;
    }

    .header-cart-icon {
        display: inline-grid;
        width: 24px;
        height: 24px;
        place-items: center;
        background: transparent !important;
    }

    .header-cart-badge {
        top: -7px !important;
        right: -8px !important;
        border: 2px solid var(--mobile-ink);
        background: var(--mobile-cream);
        color: var(--mobile-ink);
    }

    .search-wrapper {
        grid-column: 1 / -1;
        grid-row: 2;
        order: initial !important;
        width: 100% !important;
        min-height: 42px !important;
        max-width: none !important;
        padding: 1px 8px 1px 6px !important;
        border: 1px solid rgba(24, 63, 44, 0.24) !important;
        border-radius: 8px !important;
        background: #fbfcfa;
        box-shadow: none !important;
    }

    .search-wrapper:focus-within {
        border-color: var(--mobile-ink) !important;
        background: #ffffff;
        box-shadow: 0 0 0 3px rgba(168, 200, 160, 0.32) !important;
    }

    .search-wrapper input {
        min-width: 0;
        padding: 8px 6px !important;
        color: var(--mobile-ink);
        font-size: 14px !important;
        font-weight: 650;
        text-overflow: ellipsis;
    }

    .search-btn {
        width: 40px !important;
        height: 40px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .search-btn:hover,
    .search-btn:active {
        background: transparent !important;
    }

    .search-btn svg {
        width: 19px !important;
        height: 19px !important;
    }

    .mobile-nav-backdrop,
    .mobile-filter-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1180;
        width: 100%;
        height: 100%;
        border: 0;
        background: rgba(10, 25, 18, 0.46);
        opacity: 0;
        transition: opacity 180ms ease;
    }

    .mobile-nav-backdrop.is-open,
    .mobile-filter-backdrop.is-open {
        display: block;
        opacity: 1;
    }

    .nav-bar {
        position: fixed !important;
        inset: max(54px, 7svh) 0 0;
        z-index: 1200;
        display: block !important;
        max-height: none;
        padding: 0 !important;
        overflow: hidden;
        border: 0 !important;
        border-radius: 16px 16px 0 0;
        background: #ffffff;
        box-shadow: 0 24px 60px rgba(10, 25, 18, 0.28);
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
        transform: translateY(100%);
        transform-origin: bottom center;
        transition: opacity 220ms ease, transform 260ms ease, visibility 0s linear 260ms;
    }

    .nav-bar.is-open {
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        transform: translateY(0);
        transition-delay: 0s;
    }

    .nav-bar > .container {
        height: 100%;
        padding: 0 0 calc(var(--mobile-dock-height) + 30px + env(safe-area-inset-bottom)) !important;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .mobile-menu-head {
        position: sticky;
        top: 0;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        min-height: 66px;
        padding: 18px 16px 10px;
        border-bottom: 1px solid var(--mobile-line);
        background: rgba(255, 255, 255, 0.98);
    }

    .mobile-menu-head::before {
        content: "";
        position: absolute;
        top: 8px;
        left: 50%;
        width: 40px;
        height: 4px;
        border-radius: 999px;
        background: #e8eae8;
        transform: translateX(-50%);
    }

    .mobile-menu-head strong {
        color: var(--mobile-ink);
        font-size: 20px;
        font-weight: 750;
        letter-spacing: 0;
    }

    .mobile-menu-close {
        display: inline-grid;
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        place-items: center;
        border: 0;
        border-radius: 50%;
        background: #f5f6f5;
        color: #7c8781;
    }

    .mobile-menu-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 10px;
        margin: 0;
        padding: 14px 16px 0;
        list-style: none;
    }

    .mobile-menu-links li {
        grid-column: 1 / -1;
        margin: 0;
        border-bottom: 1px solid var(--mobile-line);
    }

    .mobile-menu-links li:not(.mobile-menu-primary) {
        margin-inline: -16px;
    }

    .mobile-menu-links .mobile-menu-primary {
        grid-column: auto;
        border-bottom: 0;
    }

    .mobile-menu-links a {
        position: relative;
        display: flex;
        min-height: 51px;
        padding: 14px 48px 14px 16px;
        align-items: center;
        color: #202622;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.25;
        text-decoration: none;
    }

    .mobile-menu-links a::after {
        content: "";
        position: absolute;
        right: 20px;
        width: 7px;
        height: 7px;
        border-top: 1.5px solid #a1aaa5;
        border-right: 1.5px solid #a1aaa5;
        transform: rotate(45deg);
    }

    .mobile-menu-links a:active {
        background: #f7f8f7;
    }

    .mobile-menu-links .mobile-menu-primary a {
        height: 100%;
        min-height: 58px;
        padding: 12px 10px;
        justify-content: center;
        border: 1px solid #c9d9cf;
        border-radius: 10px;
        background: #f1f6f2;
        color: var(--mobile-ink);
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.035em;
        line-height: 1.2;
        text-align: center;
    }

    .mobile-menu-links .mobile-menu-primary a::after {
        display: none;
    }

    .mobile-menu-links .mobile-menu-primary a.is-active {
        border-color: var(--mobile-ink);
        background: var(--mobile-ink);
        color: #ffffff;
        box-shadow: 0 8px 20px rgba(16, 66, 44, 0.16);
    }

    .mobile-menu-links .mobile-menu-primary + :not(.mobile-menu-primary) {
        margin-top: 14px;
        border-top: 1px solid var(--mobile-line);
    }

    .nav-bar .nav-links {
        display: none !important;
    }

    .mobile-menu-social {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 30px 16px 16px;
    }

    .mobile-menu-social a {
        display: flex;
        min-width: 0;
        min-height: 42px;
        padding: 9px 12px;
        align-items: center;
        gap: 9px;
        border: 1px solid var(--mobile-line);
        border-radius: 7px;
        background: #ffffff;
        color: #202622;
        font-size: 12px;
        font-weight: 750;
        line-height: 1.15;
        text-decoration: none;
    }

    .mobile-menu-social img,
    .mobile-menu-social svg {
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        object-fit: contain;
    }

    .mobile-menu-social svg,
    .mobile-menu-community svg {
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .mobile-menu-community {
        display: block;
        padding: 12px 16px 20px;
    }

    .mobile-menu-community > span {
        display: block;
        margin-bottom: 12px;
        color: #202622;
        font-size: 12px;
        font-weight: 650;
    }

    .mobile-menu-community > div {
        display: flex;
        align-items: center;
        gap: 14px;
    }

    .mobile-menu-community a {
        display: grid;
        width: 24px;
        height: 24px;
        place-items: center;
        color: #7c8781;
    }

    .mobile-menu-community img,
    .mobile-menu-community svg {
        width: 17px;
        height: 17px;
        object-fit: contain;
        filter: grayscale(1);
        opacity: 0.72;
    }

    .mobile-bottom-nav {
        position: fixed;
        right: 8px;
        bottom: calc(6px + env(safe-area-inset-bottom));
        left: 8px;
        z-index: 1250;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        height: var(--mobile-dock-height);
        padding: 4px;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 8px;
        background: rgba(23, 63, 44, 0.98);
        box-shadow: 0 16px 42px rgba(10, 25, 18, 0.19);
        backdrop-filter: blur(16px);
    }

    .mobile-bottom-item {
        position: relative;
        display: flex;
        min-width: 0;
        height: 50px;
        padding: 4px 2px 3px;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 3px;
        border: 0;
        border-radius: 7px;
        background: transparent;
        color: rgba(255, 255, 255, 0.76);
        font: inherit;
        text-decoration: none;
    }

    .mobile-bottom-item svg {
        width: 19px;
        height: 19px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .mobile-bottom-item > span:last-child {
        max-width: 100%;
        overflow: hidden;
        font-size: 10px;
        font-weight: 750;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-bottom-item.is-active,
    .mobile-bottom-item[aria-expanded="true"] {
        background: #ffffff;
        color: var(--mobile-ink);
        box-shadow: 0 7px 18px rgba(5, 29, 19, 0.22);
    }

    .mobile-catalog-menu {
        position: absolute;
        right: 0;
        bottom: calc(100% + 8px);
        left: 0;
        padding: 12px;
        border: 1px solid var(--mobile-line);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 18px 44px rgba(10, 25, 18, 0.24);
        backdrop-filter: blur(16px);
    }

    .mobile-catalog-menu[hidden] {
        display: none;
    }

    .mobile-catalog-menu > strong {
        display: block;
        margin-bottom: 9px;
        color: var(--mobile-ink);
        font-size: 13px;
        line-height: 1.2;
    }

    .mobile-catalog-menu-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .mobile-catalog-menu-grid a {
        display: flex;
        min-height: 44px;
        padding: 9px 10px;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--mobile-line);
        border-radius: 8px;
        background: #f7f8f6;
        color: var(--mobile-ink);
        font-size: 13px;
        font-weight: 800;
        line-height: 1.15;
        text-align: center;
        text-decoration: none;
    }

    .mobile-catalog-menu-grid a.is-active {
        border-color: var(--mobile-ink);
        background: var(--mobile-ink);
        color: #ffffff;
    }

    .mobile-bottom-icon {
        position: relative;
        display: inline-grid;
        place-items: center;
    }

    .mobile-bottom-badge {
        position: absolute;
        top: -7px;
        right: -9px;
        display: grid;
        min-width: 17px;
        height: 17px;
        padding: 0 4px;
        place-items: center;
        border: 2px solid #ffffff;
        border-radius: 9px;
        background: var(--mobile-ink);
        color: #ffffff;
        font-size: 9px;
        font-weight: 800;
        line-height: 1;
    }

    .mobile-bottom-badge.is-empty {
        opacity: 0;
    }

    .catalog-route-tabs {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        width: 100%;
        gap: 4px;
        margin: 0 0 14px;
        padding: 4px;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 8px;
        background: rgba(23, 63, 44, 0.98);
        box-shadow: 0 10px 26px rgba(10, 25, 18, 0.14);
    }

    .catalog-route-tabs a {
        display: flex;
        min-width: 0;
        min-height: 42px;
        padding: 5px 3px;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        color: rgba(255, 255, 255, 0.78);
        font-size: 10px;
        font-weight: 850;
        line-height: 1.08;
        text-align: center;
        text-decoration: none;
        transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
    }

    .catalog-route-tabs a.is-active,
    .catalog-route-tabs a[aria-current="page"] {
        background: #ffffff;
        color: var(--mobile-ink);
        box-shadow: 0 6px 14px rgba(5, 29, 19, 0.2);
    }

    .mobile-wholesale-context .mobile-bottom-nav {
        border-color: rgba(255, 255, 255, 0.18);
        background: rgba(23, 63, 44, 0.98);
        box-shadow: 0 16px 42px rgba(10, 25, 18, 0.19);
    }

    .mobile-wholesale-context .mobile-bottom-item {
        color: rgba(255, 255, 255, 0.76);
    }

    .mobile-wholesale-context .mobile-bottom-item.is-active,
    .mobile-wholesale-context .mobile-bottom-item[aria-expanded="true"] {
        background: #ffffff;
        color: #173F2C;
        box-shadow: 0 7px 18px rgba(5, 29, 19, 0.22);
    }

    .mobile-wholesale-context .mobile-bottom-badge {
        border-color: #173F2C;
        background: var(--brand-accent);
        color: #173F2C;
    }

    .site-toast-stack {
        right: 12px;
        bottom: calc(var(--mobile-dock-height) + 28px + env(safe-area-inset-bottom));
        left: 12px;
    }

    .site-toast {
        width: 100%;
        min-width: 0;
        max-width: none;
        border-radius: 8px;
    }

    .floating-cart-link {
        display: none !important;
    }

    main,
    .page-main {
        min-width: 0;
    }

    main h1,
    .page-main h1 {
        font-size: 28px;
        line-height: 1.08;
        letter-spacing: 0 !important;
    }

    main h2,
    .page-main h2 {
        font-size: 24px;
        line-height: 1.12;
        letter-spacing: 0 !important;
    }

    main h3,
    .page-main h3 {
        letter-spacing: 0 !important;
    }

    #footer-module {
        padding-top: 36px;
    }

    .site-footer {
        padding: 36px 0 22px !important;
    }

    .footer-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 28px 18px !important;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }

    .footer-logo {
        font-size: 25px !important;
    }

    .footer-column h3 {
        font-size: 14px !important;
    }

    .footer-column a,
    .footer-brand p,
    .footer-bottom {
        font-size: 13px !important;
    }

    .footer-bottom {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 8px !important;
    }

    /* Homepage: strong imagery, compact rhythm, swipe cues. */
    .hero-swiper {
        height: min(430px, calc(100svh - 95px)) !important;
        min-height: 360px;
        max-height: 430px;
    }

    .hero-banner,
    .hero-text-banner {
        min-height: 100%;
    }

    .hero-archive-bg,
    .full-slide-img {
        object-position: center center !important;
    }

    .hero-text-banner-green .hero-archive-bg {
        object-position: 92% center !important;
    }

    .hero-text-banner-green,
    .hero-text-banner-warm {
        --hero-image-scrim:
            linear-gradient(180deg, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.08) 46%, rgba(0, 0, 0, 0.72) 100%);
    }

    .hero-text-banner-dark .hero-archive-bg {
        bottom: auto;
        height: 100%;
        object-position: 62% center !important;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .hero-text-banner-dark {
        --hero-image-scrim:
            linear-gradient(180deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.14) 42%, rgba(0, 0, 0, 0.72) 100%);
    }

    .hero-text-banner-warm .hero-archive-bg {
        object-position: 76% center !important;
    }

    .hero-slide-content,
    .hero-archive-content {
        top: auto !important;
        right: 16px !important;
        bottom: 40px !important;
        left: 16px !important;
        width: auto !important;
        max-width: 340px !important;
    }

    .hero-slide-title {
        max-width: 310px !important;
        color: #ffffff;
        font-size: 26px !important;
        line-height: 1.04 !important;
        letter-spacing: 0 !important;
        text-shadow: 0 3px 18px rgba(0, 0, 0, 0.44);
    }

    .hero-slide-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100% !important;
        margin-top: 18px !important;
        gap: 8px !important;
    }

    .hero-slide-actions--single {
        grid-template-columns: 1fr;
    }

    .hero-slide-button {
        width: 100% !important;
        min-height: 46px !important;
        padding: 9px 10px !important;
        border-radius: 8px !important;
        font-size: 13px !important;
        line-height: 1.15;
        text-align: center;
    }

    .hero-swiper .swiper-pagination {
        bottom: 12px !important;
    }

    .category-banners,
    .featured-products,
    .home-reviews,
    .pottery-section,
    .tea-history,
    .tea-ceremonies,
    .own-production,
    .tea-origin,
    .pickup-map,
    .social-networks,
    .home-benefits {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }

    .category-banners-head,
    .featured-products-head,
    .reviews-head,
    .section-head,
    .social-head {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .category-banners-head h2,
    .featured-products-head h2,
    .reviews-head h2,
    .pottery-section h2,
    .tea-history h2,
    .tea-ceremonies h2,
    .own-production h2,
    .tea-origin h2,
    .pickup-map h2,
    .social-networks h2 {
        font-size: 24px !important;
        line-height: 1.08 !important;
        letter-spacing: 0 !important;
    }

    .category-slider-controls,
    .featured-slider-controls,
    .reviews-slider-controls,
    .pottery-slider-controls,
    .social-slider-controls,
    .opt-slider-controls {
        display: none !important;
    }

    .category-banners-swiper,
    .featured-products-swiper,
    .reviews-swiper,
    .pottery-products-swiper,
    .social-slider,
    .opt-section-swiper {
        position: relative;
    }

    .category-banners-swiper::after,
    .featured-products-swiper::after,
    .reviews-swiper::after,
    .pottery-products-swiper::after,
    .social-slider::after,
    .opt-section-swiper::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 28px;
        z-index: 4;
        width: 28px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(var(--brand-accent-rgb), 0.72));
        pointer-events: none;
    }

    .category-banners-swiper .swiper-pagination-bullet,
    .featured-products-swiper .swiper-pagination-bullet,
    .reviews-swiper .swiper-pagination-bullet,
    .pottery-products-swiper .swiper-pagination-bullet,
    .social-slider .swiper-pagination-bullet,
    .opt-section-swiper .swiper-pagination-bullet {
        width: 7px !important;
        height: 7px !important;
        margin: 0 4px !important;
    }

    .banner-card {
        height: 200px !important;
        border-radius: 8px !important;
    }

    .banner-overlay {
        min-height: 60px;
        padding: 13px 15px !important;
    }

    .banner-title {
        font-size: 17px !important;
    }

    .featured-head-actions {
        width: 100%;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-direction: row !important;
    }

    .featured-link,
    .view-all-link,
    .featured-head-actions a {
        min-height: 44px;
        padding: 10px 14px;
        border: 1px solid var(--mobile-line);
        border-radius: 8px;
        background: #ffffff;
        font-size: 13px !important;
        font-weight: 800;
    }

    .review-card {
        height: 280px !important;
        min-height: 280px !important;
        padding: 16px !important;
        overflow: hidden;
        border-radius: 8px !important;
    }

    .review-product {
        font-size: 14px !important;
    }

    .review-text {
        display: -webkit-box !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .pottery-hero {
        gap: 22px !important;
    }

    .pottery-categories {
        display: flex !important;
        margin-right: -16px;
        padding-right: 16px;
        overflow-x: auto;
        gap: 10px !important;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .pottery-categories .cat-card {
        flex: 0 0 68%;
        height: 150px !important;
        min-height: 150px;
        border-radius: 8px !important;
        scroll-snap-align: start;
    }

    .cat-name {
        font-size: 16px !important;
    }

    .home-benefits .benefits-grid {
        display: flex !important;
        margin-right: -16px;
        padding-right: 16px;
        overflow-x: auto;
        gap: 10px !important;
        scroll-padding-left: 16px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .home-benefits .benefit-card {
        flex: 0 0 82%;
        min-height: 214px;
        padding: 22px !important;
        scroll-snap-align: start;
    }

    .home-benefits .benefit-card h2,
    .home-benefits .benefit-card h3 {
        margin: 12px 0 10px;
        font-size: 20px !important;
    }

    .home-benefits .benefit-card p {
        font-size: 14px;
        line-height: 1.5;
    }

    .tea-history .history-preview {
        gap: 24px !important;
    }

    .tea-history .history-gallery {
        display: flex !important;
        height: 220px !important;
        margin-right: -16px;
        padding-right: 16px;
        overflow-x: auto;
        gap: 10px !important;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .tea-history .history-photo {
        flex: 0 0 86%;
        border-radius: 8px !important;
        scroll-snap-align: start;
    }

    .tea-history .history-photo img {
        height: 220px !important;
    }

    .tea-history .history-text p {
        font-size: 14px;
        line-height: 1.55;
    }

    .tea-history .history-actions {
        margin-top: 20px;
    }

    .tea-history .btn-more-about {
        width: 100%;
        min-height: 48px;
        justify-content: center;
        border-radius: 8px !important;
    }

    .social-networks .social-section-head {
        margin-bottom: 16px;
    }

    .social-networks .social-swiper {
        padding-bottom: 24px;
    }

    .social-networks .social-card-img {
        min-height: 88px;
        padding: 14px;
    }

    .social-networks .social-card-img img {
        width: 44px;
        height: 44px;
    }

    .social-networks .social-card[href*="rutube.ru"] .social-card-img img,
    .social-networks .social-card[href*="wildberries.ru"] .social-card-img img,
    .social-networks .social-card[href*="ozon.ru"] .social-card-img img,
    .social-networks .social-card[href*="dzen.ru"] .social-card-img img {
        width: min(100%, 152px);
        height: 52px;
    }

    .social-networks .social-card-info {
        padding: 12px;
        gap: 6px;
    }

    .social-networks .social-card-info h3 {
        font-size: 16px;
    }

    .social-networks .marketplaces-block {
        margin-top: 20px;
    }

    .benefit-card,
    .audience-card,
    .origin-card,
    .history-card {
        border-radius: 8px !important;
    }

    /* Catalogs: filters become a bottom sheet and products stay scannable. */
    .catalog-layout {
        display: block !important;
        margin-top: 20px !important;
    }

    .mobile-filter-toggle {
        display: inline-flex;
        width: 100%;
        min-height: 48px;
        margin-bottom: 18px;
        padding: 11px 14px;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        border: 1px solid var(--mobile-line);
        border-radius: 8px;
        background: var(--mobile-cream);
        color: var(--mobile-ink);
        font-size: 14px;
        font-weight: 800;
    }

    .mobile-filter-toggle svg,
    .mobile-filter-head svg {
        width: 20px;
        height: 20px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .filters-sidebar,
    .opt-catalog-sidebar {
        position: fixed !important;
        right: 8px;
        bottom: calc(var(--mobile-dock-height) + 16px + env(safe-area-inset-bottom));
        left: 8px;
        z-index: 1220;
        display: block !important;
        max-height: calc(100svh - var(--mobile-dock-height) - 40px);
        padding: 14px 16px 20px !important;
        overflow-y: auto;
        border: 1px solid var(--mobile-line);
        border-radius: 8px !important;
        background: #ffffff !important;
        box-shadow: 0 24px 60px rgba(10, 25, 18, 0.28);
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
        transform: translateY(30px);
        transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
    }

    .filters-sidebar.is-open,
    .opt-catalog-sidebar.is-open {
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        transform: translateY(0);
        transition-delay: 0s;
    }

    .mobile-filter-head {
        position: sticky;
        top: -14px;
        z-index: 2;
        display: flex;
        margin: -14px -16px 16px;
        padding: 13px 16px;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--mobile-line);
        background: #ffffff;
    }

    .mobile-filter-head strong {
        color: var(--mobile-ink);
        font-size: 18px;
        letter-spacing: 0;
    }

    .mobile-filter-head button {
        display: inline-grid;
        width: 44px;
        height: 44px;
        place-items: center;
        border: 1px solid var(--mobile-line);
        border-radius: 8px;
        color: var(--mobile-ink);
    }

    .mobile-filter-actions {
        position: sticky;
        bottom: -20px;
        z-index: 2;
        margin: 20px -16px -20px;
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
        border-top: 1px solid var(--mobile-line);
        background: #ffffff;
    }

    .mobile-filter-actions button {
        width: 100%;
        min-height: 46px;
        border-radius: 7px;
        background: var(--mobile-ink);
        color: #ffffff;
        font-size: 14px;
        font-weight: 900;
    }

    .category-title {
        margin-bottom: 14px !important;
        font-size: 26px !important;
        letter-spacing: 0 !important;
    }

    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .opt-catalog-content .opt-catalog-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .product-card {
        min-width: 0;
        border-radius: 8px !important;
        box-shadow: 0 10px 24px rgba(20, 48, 34, 0.08) !important;
    }

    .product-thumb {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 1 / 1.13;
        padding: 34px 8px 8px !important;
    }

    .product-thumb img {
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        aspect-ratio: auto !important;
        object-fit: cover !important;
        border-radius: 5px !important;
    }

    .product-favorite-btn {
        top: 5px !important;
        right: 5px !important;
        width: 44px !important;
        height: 44px !important;
        font-size: 19px !important;
    }

    .product-badge-group {
        top: 8px !important;
        left: 8px !important;
        gap: 4px !important;
    }

    .product-badge {
        padding: 4px 6px !important;
        font-size: 9px !important;
    }

    :is(.catalog-content, .product-related) .product-badge:nth-child(n + 2) {
        display: none;
    }

    .product-info {
        gap: 8px !important;
        padding: 11px 10px 12px !important;
    }

    .product-meta {
        display: block !important;
        font-size: 10px !important;
    }

    .product-stock {
        display: none;
    }

    .product-title {
        min-height: 38px;
        font-size: 14px !important;
        line-height: 1.3 !important;
    }

    .product-desc,
    .product-tags {
        display: none !important;
    }

    .product-footer {
        align-items: stretch !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    .price-wrapper {
        flex: 0 0 auto !important;
        gap: 1px !important;
    }

    .price-main {
        font-size: 18px !important;
    }

    .price-main span,
    .price-unit,
    .price-old {
        font-size: 11px !important;
    }

    .add-to-cart-btn,
    .product-favorite-inline {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        padding: 9px 7px !important;
        border-radius: 7px !important;
        font-size: 12px !important;
    }

    .add-to-cart-btn {
        height: 44px !important;
        flex: 0 0 44px !important;
    }

    .product-favorite-inline {
        display: none !important;
    }

    .add-to-cart-icon {
        width: 16px !important;
        height: 16px !important;
    }

    .featured-products-swiper .product-card,
    .pottery-products-swiper .product-card {
        height: auto !important;
        min-height: 0 !important;
    }

    .featured-products-swiper .product-thumb,
    .pottery-products-swiper .product-thumb {
        max-height: 210px;
        aspect-ratio: 4 / 3;
    }

    .featured-products-swiper .product-thumb {
        padding: 0 !important;
    }

    .featured-products-swiper .product-thumb img {
        border-radius: 0 !important;
    }

    .featured-products-swiper .product-info,
    .pottery-products-swiper .product-info {
        min-height: 0 !important;
    }

    .review-more {
        min-height: 44px;
        padding-top: 9px;
        padding-bottom: 9px;
    }

    /* Catalog and recommendation cards use a compact horizontal layout. */
    :is(.catalog-content, .product-related) .products-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    :is(.catalog-content, .product-related) .product-card {
        display: grid !important;
        grid-template-columns: 112px minmax(0, 1fr);
        min-height: 160px;
        overflow: hidden;
    }

    :is(.catalog-content, .product-related) .product-card-media {
        min-width: 0;
        height: 100%;
    }

    :is(.catalog-content, .product-related) .product-thumb-link {
        display: block;
        min-width: 0;
        height: 100%;
    }

    :is(.catalog-content, .product-related) .product-thumb {
        height: 100% !important;
        min-height: 160px !important;
        padding: 0 !important;
        aspect-ratio: auto;
    }

    :is(.catalog-content, .product-related) .product-thumb img {
        border-radius: 0 !important;
    }

    .product-card-gallery-nav {
        display: none !important;
    }

    .product-card-media[data-product-card-gallery] {
        touch-action: pan-y;
    }

    .product-card-gallery-count {
        right: 6px;
        bottom: 6px;
        padding: 4px 6px;
        font-size: 10px;
    }

    :is(.catalog-content, .product-related) .product-info {
        min-width: 0;
        min-height: 160px;
        padding: 12px 10px 10px !important;
    }

    :is(.catalog-content, .product-related) .product-meta {
        display: none !important;
    }

    :is(.catalog-content, .product-related) .product-title {
        display: -webkit-box;
        min-height: 0;
        overflow: hidden;
        font-size: 14px !important;
        line-height: 1.25 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    :is(.catalog-content, .product-related) .product-footer {
        margin-top: auto;
    }

    :is(.catalog-content, .product-related) .price-main {
        font-size: 18px !important;
    }

    :is(.catalog-content, .product-related) .add-to-cart-btn {
        width: 100% !important;
    }

    :is(.catalog-content, .product-related) .product-favorite-btn {
        top: 8px !important;
        right: auto !important;
        left: 72px !important;
    }

    /* Catalog and commerce pages. */
    .opt-catalog-page,
    .search-page,
    .product-page,
    .checkout-page {
        padding-top: 18px !important;
    }

    .opt-catalog-hero,
    .opt-catalog-shell,
    .search-hero,
    .search-results {
        border-radius: 8px !important;
    }

    .opt-catalog-hero h1,
    .search-hero h1,
    .checkout-head h1 {
        font-size: 27px !important;
    }

    .search-hero-form {
        grid-template-columns: 1fr !important;
    }

    .search-hero-form button {
        width: 100% !important;
        min-height: 48px;
        border-radius: 8px !important;
    }

    .opt-catalog-hero,
    .opt-catalog-shell {
        grid-template-columns: 1fr !important;
        padding: 17px !important;
    }

    .opt-catalog-hero-card {
        border-radius: 8px !important;
    }

    .opt-catalog-toolbar {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .opt-warehouse-switch {
        width: 100%;
    }

    .opt-warehouse-switch button {
        flex: 1;
        min-width: 0;
    }

    /* Product and checkout keep all controls, but remove desktop density. */
    .breadcrumbs {
        display: flex;
        padding-bottom: 8px;
        overflow-x: auto;
        font-size: 12px !important;
        white-space: nowrap;
        scrollbar-width: none;
    }

    .product-detail {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .product-layout {
        display: flex !important;
        flex-direction: column;
        gap: 14px !important;
    }

    .product-panel {
        display: contents !important;
    }

    .product-purchase {
        order: 0;
        padding: 16px;
        border: 1px solid rgba(30, 58, 43, 0.1);
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 12px 30px rgba(30, 58, 43, 0.06);
    }

    .product-gallery {
        order: 1;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .product-panel > :not(.product-purchase) {
        order: 2;
    }

    .product-gallery,
    .product-panel,
    .product-brew-section,
    .product-taste-section,
    .checkout-cart,
    .checkout-summary,
    .checkout-form {
        border-radius: 8px !important;
    }

    .product-gallery {
        --product-gallery-gutter: 16px;
        padding: 0 !important;
        overflow: hidden;
    }

    .product-panel {
        padding: 16px !important;
    }

    .product-gallery .product-main-image {
        max-height: 330px;
        aspect-ratio: 1 / 1.05 !important;
        object-fit: contain;
        background: #FFFFFF;
    }

    .product-gallery-thumbnail img {
        max-height: none;
        aspect-ratio: 3 / 4 !important;
        object-fit: contain;
    }

    .product-gallery-thumbnails {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .product-panel h1 {
        font-size: 25px !important;
    }

    .product-price-row {
        margin: 18px 0 !important;
    }

    .product-price-row .price-main {
        font-size: 30px !important;
    }

    .product-price-row .price-main [data-product-price] {
        font-size: 30px !important;
        line-height: 1 !important;
    }

    .product-price-row .price-main [data-product-unit] {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }

    .product-price-row .price-old {
        font-size: 15px !important;
    }

    .product-actions {
        margin-bottom: 0 !important;
    }

    .product-actions,
    .section-head {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .product-primary-btn,
    .product-favorite-detail-btn,
    .product-secondary-btn {
        width: 100% !important;
        min-height: 48px;
        border-radius: 8px !important;
    }

    .checkout-layout {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .checkout-layout.is-empty .checkout-sidebar {
        display: none !important;
    }

    .checkout-layout.is-empty .checkout-cart {
        padding: 14px !important;
    }

    .checkout-layout.is-empty .checkout-empty {
        gap: 14px;
    }

    .checkout-layout.is-empty .checkout-empty-copy {
        padding: 20px !important;
    }

    .checkout-layout.is-empty .checkout-empty-copy h2 {
        font-size: 25px !important;
    }

    .checkout-layout.is-empty .checkout-empty-grid {
        display: flex !important;
        margin-right: -14px;
        padding-right: 14px;
        overflow-x: auto;
        gap: 10px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .checkout-layout.is-empty .checkout-empty-card {
        flex: 0 0 76%;
        min-height: 154px;
        scroll-snap-align: start;
    }

    .checkout-head {
        margin-bottom: 22px !important;
    }

    .checkout-form input,
    .checkout-form select,
    .checkout-form textarea,
    .checkout-form button,
    .cart-item button {
        border-radius: 8px !important;
    }

    /* Editorial and service pages. */
    .articles-hero,
    .tea-service-hero,
    .tea-service-video,
    .tea-service-request,
    .opt-hero,
    .opt-cta,
    .opt-contacts {
        border-radius: 0 !important;
    }

    .articles-hero,
    .tea-service-hero,
    .opt-hero {
        min-height: 360px !important;
    }

    .articles-hero h1,
    .tea-service-hero h1,
    .opt-hero h1 {
        font-size: 30px !important;
        line-height: 1.05 !important;
        letter-spacing: 0 !important;
    }

    .articles-list,
    .tea-service-intro,
    .tea-service-video,
    .tea-service-packages,
    .tea-service-request,
    .opt-page {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }

    .articles-grid,
    .tea-service-intro-grid,
    .tea-service-package-grid,
    .tea-service-request-grid,
    .opt-info-grid,
    .opt-direction-grid,
    .opt-order-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .article-card,
    .tea-service-card,
    .tea-service-package,
    .opt-info-card,
    .opt-order-card,
    .opt-direction-card,
    .contact-card,
    .info-card {
        border-radius: 8px !important;
    }

    .search-quick-links {
        display: flex;
        margin-right: -20px;
        padding-right: 20px;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        scrollbar-width: none;
    }

    .search-quick-links a {
        flex: 0 0 auto;
    }
}

@media (max-width: 420px) {
    .hero-slide-title {
        font-size: 28px !important;
    }

    .nav-links {
        grid-template-columns: 1fr;
    }

    .nav-bar {
        max-height: none;
    }

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

    .footer-brand {
        grid-column: auto;
    }
}

@media (max-width: 350px) {
    .header-flex {
        grid-template-columns: 38px minmax(0, 1fr) auto !important;
        padding-right: 10px;
        padding-left: 10px;
    }

    .header-contact-link {
        display: none !important;
    }

    .mobile-bottom-nav {
        right: 6px;
        left: 6px;
    }

    .mobile-bottom-item > span:last-child {
        font-size: 9px;
    }

    .products-grid {
        gap: 7px !important;
    }

    .product-info {
        padding-right: 8px !important;
        padding-left: 8px !important;
    }
}

/* Mobile density pass: keeps desktop layouts untouched while shortening long pages. */
@media (max-width: 768px) {
    /* Home page rhythm. */
    #slide-module,
    .hero-swiper {
        height: min(400px, calc(100svh - 94px)) !important;
        min-height: 350px !important;
        max-height: 400px !important;
    }

    .hero-slide-content,
    .hero-archive-content {
        bottom: 58px !important;
    }

    .hero-slide-title {
        max-width: 300px !important;
        font-size: 25px !important;
    }

    .hero-slide-actions {
        margin-top: 14px !important;
    }

    .category-banners,
    .featured-products,
    .home-reviews,
    .pottery-section,
    .tea-history,
    .tea-ceremonies,
    .own-production,
    .tea-origin,
    .pickup-map,
    .social-networks {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .category-banners-head,
    .featured-products-head,
    .reviews-head,
    .social-section-head {
        margin-bottom: 14px !important;
    }

    .category-banners-head h2,
    .featured-products-head h2,
    .reviews-head h2,
    .pottery-section h2,
    .tea-history h2,
    .tea-ceremonies h2,
    .own-production h2,
    .tea-origin h2,
    .pickup-map h2,
    .social-networks h2 {
        font-size: 22px !important;
        line-height: 1.12 !important;
    }

    .banner-card {
        height: 126px !important;
    }

    .category-banners {
        padding-top: 16px !important;
        padding-bottom: 14px !important;
    }

    .category-banners-head {
        margin-bottom: 10px !important;
    }

    .category-banners-swiper {
        padding-bottom: 22px !important;
    }

    .banner-overlay {
        min-height: 46px !important;
        padding: 9px 11px !important;
    }

    .banner-title {
        font-size: 14px !important;
    }

    .banner-arrow {
        width: 10px !important;
        height: 10px !important;
        flex-basis: 10px !important;
    }

    .category-slider-pagination {
        margin-top: 10px !important;
    }

    .pottery-categories .cat-card {
        flex-basis: 62% !important;
        height: 132px !important;
        min-height: 132px !important;
    }

    .review-card {
        height: 250px !important;
        min-height: 250px !important;
    }

    .tea-history .history-preview {
        gap: 16px !important;
    }

    .tea-history .history-gallery {
        height: 180px !important;
    }

    .tea-history .history-photo img {
        height: 180px !important;
    }

    .tea-history .history-kicker,
    .production-kicker,
    .origin-kicker,
    .pickup-map-kicker {
        margin-bottom: 10px !important;
    }

    .tea-history .history-text h2,
    .production-text h2,
    .tea-origin h2,
    .pickup-map h2 {
        margin-top: 0 !important;
        margin-bottom: 12px !important;
    }

    .tea-history .history-text p,
    .production-text p,
    .tea-origin-copy p {
        display: -webkit-box;
        margin-top: 0 !important;
        margin-bottom: 14px !important;
        overflow: hidden;
        font-size: 14px !important;
        line-height: 1.5 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .tea-history .history-actions {
        margin-top: 14px !important;
    }

    .tea-history .btn-more-about {
        min-height: 44px !important;
    }

    .production-article-preview,
    .tea-origin-preview {
        gap: 16px !important;
    }

    .production-media,
    .tea-origin-media {
        min-height: 0 !important;
        border-radius: 8px !important;
    }

    .production-media img,
    .tea-origin-media img {
        height: 200px !important;
        min-height: 200px !important;
        object-position: center 55%;
    }

    .tea-origin-preview {
        padding: 16px !important;
    }

    .origin-read-more,
    .arrow-link {
        margin-top: 0 !important;
        font-size: 13px !important;
    }

    .pickup-map-grid {
        gap: 10px !important;
    }

    .pickup-map-copy {
        padding: 18px !important;
    }

    .pickup-map p {
        margin-top: 10px !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }

    .pickup-map-actions {
        margin-top: 16px !important;
    }

    .pickup-map-actions a {
        min-height: 42px !important;
        padding: 9px 13px !important;
    }

    .pickup-map-frame,
    .pickup-map-frame iframe {
        min-height: 230px !important;
        height: 230px !important;
    }

    .social-networks .social-card-img {
        min-height: 76px !important;
    }

    .social-networks .social-card-info {
        padding: 10px !important;
    }

    /* Product detail: show the important buying controls within the first screen. */
    .product-layout {
        gap: 10px !important;
    }

    .product-purchase {
        padding: 13px !important;
    }

    .product-panel h1 {
        margin-top: 8px !important;
        font-size: 22px !important;
        line-height: 1.12 !important;
    }

    .product-lead {
        display: -webkit-box;
        margin-top: 8px !important;
        overflow: hidden;
        font-size: 13px !important;
        line-height: 1.45 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }

    .product-price-row {
        margin: 12px 0 !important;
    }

    .product-price-row .price-main,
    .product-price-row .price-main [data-product-price] {
        font-size: 27px !important;
    }

    .product-actions {
        gap: 8px !important;
    }

    .product-primary-btn,
    .product-favorite-detail-btn,
    .product-secondary-btn {
        min-height: 44px !important;
    }

    .product-gallery .product-main-image {
        max-height: 292px !important;
        aspect-ratio: 1 / 0.96 !important;
    }

    .product-gallery-description,
    .product-brew-section,
    .product-taste-section,
    .product-description-block {
        padding: 16px !important;
    }

    /* Articles become compact, readable rows instead of tall poster cards. */
    .articles-hero {
        min-height: 0 !important;
        padding: 24px 0 !important;
    }

    .articles-hero-inner {
        gap: 16px !important;
    }

    .articles-hero h1 {
        margin-top: 12px !important;
        font-size: 27px !important;
        line-height: 1.08 !important;
    }

    .articles-hero p {
        display: -webkit-box;
        margin-top: 12px !important;
        overflow: hidden;
        font-size: 14px !important;
        line-height: 1.5 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .articles-hero-link {
        min-height: 44px !important;
        margin-top: 16px !important;
        padding: 10px 14px !important;
        font-size: 13px !important;
    }

    .articles-hero-note {
        display: flex;
        max-width: none !important;
        padding: 14px 16px !important;
        align-items: center;
        gap: 12px;
    }

    .articles-hero-note strong {
        font-size: 36px !important;
    }

    .articles-hero-note span {
        margin-top: 0 !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .articles-list {
        padding-top: 28px !important;
        padding-bottom: 28px !important;
    }

    .articles-list-head {
        margin-bottom: 16px !important;
    }

    .articles-list h2 {
        font-size: 25px !important;
    }

    .articles-grid {
        gap: 10px !important;
    }

    .article-card,
    .article-card--featured {
        grid-template-columns: 112px minmax(0, 1fr) !important;
        height: 188px !important;
        min-height: 188px !important;
    }

    .article-card img,
    .article-card--featured img {
        width: 112px !important;
        height: 100% !important;
        min-height: 188px !important;
    }

    .article-card-copy {
        min-width: 0;
        padding: 12px !important;
    }

    .article-card-copy > span {
        min-height: 24px !important;
        padding: 4px 7px !important;
        font-size: 9px !important;
    }

    .article-card h3 {
        display: -webkit-box;
        margin-top: 9px !important;
        overflow: hidden;
        font-size: 17px !important;
        line-height: 1.15 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .article-card p {
        display: -webkit-box;
        margin-top: 8px !important;
        overflow: hidden;
        font-size: 12px !important;
        line-height: 1.4 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .article-card strong {
        padding-top: 8px !important;
        font-size: 12px !important;
    }

    /* Tea ceremonies: shorter introduction and expandable package contents. */
    .tea-service-hero,
    .tea-service-hero-inner {
        min-height: 480px !important;
    }

    .tea-service-hero-inner {
        gap: 16px !important;
        padding-top: 28px !important;
        padding-bottom: 24px !important;
    }

    .tea-service-hero h1 {
        margin-top: 10px !important;
        font-size: 28px !important;
        line-height: 1.08 !important;
    }

    .tea-service-hero p {
        display: -webkit-box;
        margin-top: 12px !important;
        overflow: hidden;
        font-size: 14px !important;
        line-height: 1.5 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .tea-service-hero-actions {
        margin-top: 16px !important;
        gap: 8px !important;
    }

    .tea-service-primary,
    .tea-service-secondary {
        min-height: 44px !important;
        padding: 10px 14px !important;
        font-size: 13px !important;
    }

    .tea-service-hero-note {
        padding: 14px !important;
    }

    .tea-service-hero-note strong {
        font-size: 17px !important;
        line-height: 1.3 !important;
    }

    .tea-service-intro {
        display: flex !important;
        margin-top: 20px !important;
        margin-right: -16px;
        padding-right: 16px;
        overflow-x: auto;
        gap: 10px !important;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .tea-service-intro article {
        flex: 0 0 78%;
        min-height: 174px;
        padding: 16px !important;
        scroll-snap-align: start;
    }

    .tea-service-intro h2 {
        margin-top: 8px !important;
        font-size: 19px !important;
    }

    .tea-service-intro p {
        margin-top: 8px !important;
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .tea-service-video {
        gap: 16px !important;
        margin-top: 24px !important;
        padding: 16px !important;
    }

    .tea-service-video-copy h2,
    .tea-service-section-head h2,
    .tea-service-band h2,
    .tea-request-copy h2 {
        margin-top: 10px !important;
        font-size: 24px !important;
        line-height: 1.12 !important;
    }

    .tea-service-video-copy p,
    .tea-service-section-head p,
    .tea-request-copy p {
        margin-top: 8px !important;
        font-size: 14px !important;
        line-height: 1.48 !important;
    }

    .tea-service-video-copy a {
        min-height: 44px !important;
        margin-top: 14px !important;
        padding: 10px 14px !important;
        font-size: 13px !important;
    }

    .tea-service-packages,
    .tea-service-request {
        margin-top: 34px !important;
    }

    .tea-service-section-head {
        gap: 8px !important;
        margin-bottom: 16px !important;
    }

    .tea-package-grid {
        gap: 10px !important;
    }

    .tea-package-card {
        gap: 10px !important;
        padding: 16px !important;
    }

    .tea-package-card h3 {
        font-size: 21px !important;
    }

    .tea-package-card strong {
        font-size: 24px !important;
    }

    .tea-package-card p,
    .tea-package-card li {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .tea-package-details-toggle {
        display: flex !important;
        min-height: 42px;
        margin-top: 0 !important;
        padding: 9px 12px;
        align-items: center;
        justify-content: space-between;
        border: 1px solid rgba(30, 58, 43, 0.2) !important;
        border-radius: 8px;
        background: transparent;
        color: #1E3A2B;
        font: inherit;
        font-size: 13px;
        font-weight: 900;
    }

    .tea-package-details-toggle::after {
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        content: "";
        transform: rotate(45deg) translateY(-2px);
        transition: transform 0.2s ease;
    }

    .tea-package-card.is-details-open .tea-package-details-toggle::after {
        transform: rotate(225deg) translate(-2px, -2px);
    }

    .tea-package-card:not(.is-details-open) ul {
        display: none !important;
    }

    .tea-package-card ul {
        gap: 7px !important;
        padding-top: 4px;
    }

    .tea-package-card [data-package-select] {
        min-height: 44px !important;
        margin-top: 2px !important;
        font-size: 13px !important;
    }

    .tea-service-band {
        margin-top: 34px !important;
        padding: 30px 0 !important;
    }

    .tea-service-band-inner {
        gap: 18px !important;
    }

    .tea-service-band p,
    .tea-service-band li {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .tea-service-band ul {
        gap: 8px !important;
    }

    .tea-service-request {
        gap: 18px !important;
        padding-bottom: 32px !important;
    }

    .tea-request-contacts {
        margin-top: 14px !important;
    }

    .tea-request-form {
        gap: 10px !important;
        padding: 16px !important;
    }

    .tea-request-form input,
    .tea-request-form select,
    .tea-request-form textarea {
        min-height: 44px !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
    }

    .tea-request-form textarea {
        min-height: 96px !important;
    }
}

@media (max-width: 380px) {
    .article-card,
    .article-card--featured {
        grid-template-columns: 100px minmax(0, 1fr) !important;
    }

    .article-card img,
    .article-card--featured img {
        width: 100px !important;
    }

    .tea-service-intro article {
        flex-basis: 84%;
    }
}

/* Primary catalog CTA on the home page. */
@media (max-width: 768px) {
    .home-page .featured-products-head .featured-head-actions {
        width: 100% !important;
    }

    .home-page .featured-products-head .featured-link {
        display: flex !important;
        width: 100% !important;
        min-height: 52px !important;
        margin-inline: 0 !important;
        padding: 13px 20px !important;
        align-items: center !important;
        justify-content: center !important;
        border-color: #1E3A2B !important;
        background: #1E3A2B !important;
        color: #FFFFFF !important;
        font-size: 15px !important;
        text-align: center !important;
    }
}

/* Compact homepage carousels. These rules intentionally stay mobile-only. */
@media (max-width: 768px) {
    .hero-slide-actions--single:has(.hero-slide-button-business-mobile) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-slide-actions--single:has(.hero-slide-button-business-mobile) .hero-slide-button {
        gap: 6px;
        padding-inline: 8px !important;
        font-size: 12px !important;
        white-space: nowrap;
    }

    .hero-slide-actions--single:has(.hero-slide-button-business-mobile) .hero-slide-button::after {
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
    }

    .hero-slide-button-business-mobile {
        display: inline-flex !important;
        border: 1px solid rgba(255, 255, 255, 0.34);
        background: #A8C8A0;
        color: #1E3A2B;
    }

    .featured-products {
        padding-top: 20px !important;
        padding-bottom: 24px !important;
    }

    .featured-products-head {
        gap: 10px !important;
        margin-bottom: 12px !important;
        align-items: flex-end !important;
    }

    .featured-products-head h2,
    .reviews-head h2,
    .pottery-title {
        font-size: 21px !important;
        line-height: 1.15 !important;
    }

    .featured-products-head .section-kicker,
    .reviews-kicker {
        font-size: 11px !important;
    }

    .featured-products-head .section-action,
    .pottery-action {
        min-height: 40px !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }

    .featured-products-swiper,
    .pottery-products-swiper {
        padding-bottom: 24px !important;
    }

    .featured-products-swiper .product-card,
    .pottery-products-swiper .product-card {
        display: grid !important;
        grid-template-columns: 140px minmax(0, 1fr) !important;
        height: 190px !important;
        min-height: 190px !important;
        max-height: 190px !important;
        overflow: hidden !important;
    }

    .featured-products-swiper .product-card-media,
    .pottery-products-swiper .product-card-media {
        width: 140px !important;
        min-width: 0 !important;
        height: 190px !important;
        overflow: hidden !important;
    }

    .featured-products-swiper .product-thumb-link,
    .pottery-products-swiper .product-thumb-link,
    .featured-products-swiper .product-thumb,
    .pottery-products-swiper .product-thumb {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        overflow: hidden !important;
    }

    .featured-products-swiper .product-thumb,
    .pottery-products-swiper .product-thumb {
        padding: 0 !important;
    }

    .featured-products-swiper .product-thumb img,
    .pottery-products-swiper .product-thumb img {
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        aspect-ratio: auto !important;
        object-fit: cover !important;
        object-position: center !important;
        border-radius: 0 !important;
    }

    .featured-products-swiper .product-info,
    .pottery-products-swiper .product-info {
        min-width: 0 !important;
        min-height: 0 !important;
        height: 190px !important;
        gap: 5px !important;
        align-items: flex-start !important;
        padding: 12px 10px 10px 12px !important;
        text-align: left !important;
    }

    .featured-products-swiper .product-meta,
    .pottery-products-swiper .product-meta {
        width: calc(100% - 30px) !important;
        justify-content: flex-start !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
    }

    .featured-products-swiper .product-title,
    .pottery-products-swiper .product-title {
        display: -webkit-box !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: 14px !important;
        line-height: 1.25 !important;
        text-align: left !important;
    }

    .featured-products-swiper .product-footer,
    .pottery-products-swiper .product-footer {
        width: 100% !important;
        margin-top: auto !important;
        gap: 6px !important;
        align-items: stretch !important;
    }

    .featured-products-swiper .price-wrapper,
    .pottery-products-swiper .price-wrapper {
        align-items: flex-start !important;
        gap: 2px !important;
    }

    .featured-products-swiper .price-main,
    .pottery-products-swiper .price-main {
        font-size: 17px !important;
        line-height: 1 !important;
        text-align: left !important;
    }

    .featured-products-swiper .price-main span,
    .pottery-products-swiper .price-main span {
        display: inline !important;
        margin: 0 0 0 3px !important;
        font-size: 10px !important;
    }

    .featured-products-swiper .price-wrapper::after,
    .pottery-products-swiper .price-wrapper::after {
        display: none !important;
        content: none !important;
    }

    .featured-products-swiper .add-to-cart-btn,
    .pottery-products-swiper .add-to-cart-btn {
        height: 38px !important;
        min-height: 38px !important;
        flex-basis: 38px !important;
        padding: 7px 8px !important;
        font-size: 11px !important;
    }

    .featured-products-swiper .product-favorite-btn,
    .pottery-products-swiper .product-favorite-btn {
        top: 7px !important;
        right: 7px !important;
        width: 30px !important;
        height: 30px !important;
        font-size: 15px !important;
    }

    .featured-products-swiper .product-badge-group,
    .pottery-products-swiper .product-badge-group {
        top: 7px !important;
        left: 7px !important;
    }

    .featured-products-swiper .product-badge,
    .pottery-products-swiper .product-badge {
        padding: 3px 5px !important;
        font-size: 8px !important;
    }

    .featured-products-pagination,
    .pottery-products-pagination {
        margin-top: 8px !important;
    }

    .home-reviews {
        padding-top: 18px !important;
        padding-bottom: 24px !important;
    }

    .reviews-head {
        margin-bottom: 12px !important;
    }

    .reviews-swiper {
        padding-bottom: 22px !important;
    }

    .review-card {
        height: 196px !important;
        min-height: 196px !important;
        max-height: 196px !important;
        padding: 13px !important;
        overflow: hidden;
    }

    .review-author {
        margin-bottom: 7px !important;
        font-size: 14px !important;
    }

    .review-rating {
        margin-bottom: 7px !important;
    }

    .review-rating span {
        font-size: 15px !important;
    }

    .review-rating strong {
        font-size: 12px !important;
    }

    .review-product {
        max-width: 100%;
        margin-bottom: 7px !important;
        padding: 5px 8px !important;
        overflow: hidden;
        font-size: 11px !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .review-text {
        min-height: 0 !important;
        margin-bottom: 4px !important;
        -webkit-line-clamp: 2 !important;
        font-size: 12px !important;
        line-height: 1.38 !important;
    }

    .review-more {
        min-height: 28px !important;
        margin: auto 0 0 !important;
        padding: 3px 0 0 !important;
        font-size: 11px !important;
    }

    .reviews-pagination {
        margin-top: 8px !important;
    }

    .pottery-section {
        padding-top: 20px !important;
        padding-bottom: 24px !important;
    }

    .pottery-hero {
        gap: 14px !important;
        margin-bottom: 20px !important;
    }

    .pottery-categories {
        gap: 8px !important;
        margin-right: -16px !important;
        padding-right: 16px !important;
    }

    .pottery-categories .cat-card {
        flex-basis: 54% !important;
        height: 104px !important;
        min-height: 104px !important;
    }

    .pottery-categories .cat-title {
        padding: 10px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 380px) {
    .featured-products-swiper .product-card,
    .pottery-products-swiper .product-card {
        grid-template-columns: 124px minmax(0, 1fr) !important;
    }

    .featured-products-swiper .product-card-media,
    .pottery-products-swiper .product-card-media {
        width: 124px !important;
    }
}

/* Homepage tea and category cards use an image-over-content layout on phones. */
@media (max-width: 768px) {
    .pottery-section {
        padding-bottom: 36px !important;
    }

    .tea-ceremonies {
        padding-top: 22px !important;
        padding-bottom: 22px !important;
    }

    .own-production {
        padding-top: 36px !important;
    }

    .tea-history .history-gallery {
        display: block !important;
        width: 100% !important;
        height: 180px !important;
        margin-right: 0 !important;
        padding-right: 0 !important;
        overflow: hidden !important;
    }

    .tea-history .history-photo {
        display: none !important;
    }

    .tea-history .history-photo-mobile-featured {
        display: block !important;
        width: 100% !important;
        height: 180px !important;
        border-radius: 8px !important;
    }

    .tea-history .history-photo-mobile-featured img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 52% !important;
    }

    .category-banners-swiper .banner-card {
        position: relative;
        display: block !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 3 / 4;
        overflow: hidden;
        border: 1px solid rgba(30, 58, 43, 0.12);
        border-radius: 8px !important;
        background: #1E3A2B;
        box-shadow: 0 8px 18px rgba(30, 58, 43, 0.08);
    }

    .category-banners-swiper .banner-img {
        display: block;
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
        object-fit: cover !important;
        object-position: center !important;
        border-radius: 0 !important;
    }

    .category-banners-swiper .banner-overlay {
        position: absolute !important;
        inset: auto 0 0 !important;
        display: flex;
        min-height: 72px !important;
        padding: 28px 12px 12px !important;
        align-items: flex-end;
        background: linear-gradient(to top, rgba(5, 18, 12, 0.82) 0%, rgba(5, 18, 12, 0.36) 58%, transparent 100%) !important;
    }

    .category-banners-swiper .banner-overlay::before {
        display: none !important;
    }

    .category-banners-swiper .banner-title {
        color: #FFFFFF !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.44);
    }

    .category-banners-swiper .banner-arrow {
        width: 9px !important;
        height: 9px !important;
        flex-basis: 9px !important;
        border-color: #FFFFFF !important;
        margin-bottom: 2px;
        filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.4));
    }

    .featured-products-swiper .product-card {
        display: flex !important;
        grid-template-columns: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        flex-direction: column !important;
    }

    .featured-products-swiper .product-card-media {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 0 0 auto;
        aspect-ratio: 3 / 4 !important;
        overflow: hidden !important;
        background: #ffffff !important;
    }

    .featured-products-swiper .product-thumb,
    .featured-products-swiper .product-thumb-link {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: 3 / 4 !important;
    }

    .featured-products-swiper .product-thumb img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    .featured-products-swiper .product-info {
        width: 100% !important;
        height: 138px !important;
        min-height: 138px !important;
        flex: 0 0 138px;
        gap: 4px !important;
        align-items: center !important;
        padding: 8px 10px 10px !important;
        text-align: center !important;
    }

    .featured-products-swiper .product-meta {
        width: 100% !important;
        justify-content: center !important;
        font-size: 10px !important;
        text-align: center !important;
    }

    .featured-products-swiper .product-title {
        min-height: 32px !important;
        font-size: 13px !important;
        line-height: 1.16 !important;
        text-align: center !important;
    }

    .featured-products-swiper .product-title a {
        display: block;
        width: 100%;
    }

    .featured-products-swiper .product-footer {
        align-items: center !important;
        gap: 5px !important;
    }

    .featured-products-swiper .price-wrapper {
        align-items: center !important;
    }

    .featured-products-swiper .price-main {
        font-size: 18px !important;
        text-align: center !important;
    }

    .featured-products-swiper .price-main span {
        margin-top: 2px !important;
        font-size: 10px !important;
    }

    .featured-products-swiper .price-wrapper::after {
        display: none !important;
        content: none !important;
    }

    .featured-products-swiper .add-to-cart-btn {
        min-height: 34px !important;
        font-size: 12px !important;
        border-radius: 8px !important;
    }

    .pottery-categories {
        align-items: stretch !important;
    }

    .pottery-categories .cat-card {
        display: flex !important;
        height: 210px !important;
        min-height: 210px !important;
        flex: 0 0 47% !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        padding: 0 !important;
        border: 0 !important;
        background: #000000 !important;
        box-shadow: none !important;
    }

    .pottery-categories .cat-card::after {
        display: none !important;
    }

    .pottery-categories .cat-card img {
        position: static !important;
        display: block !important;
        width: 100% !important;
        height: 162px !important;
        min-height: 162px !important;
        flex: 0 0 162px !important;
        object-fit: cover !important;
        object-position: center !important;
        border-radius: 0 !important;
        transform: none !important;
    }

    .pottery-categories .cat-name {
        display: flex !important;
        min-height: 48px !important;
        padding: 10px 34px 10px 12px !important;
        align-items: center !important;
        background: #000000 !important;
        color: #ffffff !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        text-shadow: none !important;
    }

    .pottery-categories .cat-arrow {
        right: 13px !important;
        bottom: 17px !important;
        width: 16px !important;
        height: 16px !important;
        color: #ffffff !important;
    }

    .pottery-products-swiper .product-card {
        display: flex !important;
        grid-template-columns: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        flex-direction: column !important;
        border: 0 !important;
        border-radius: 6px !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22) !important;
        overflow: hidden !important;
    }

    .pottery-products-swiper .product-card-media {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 4 / 3 !important;
        flex: 0 0 auto !important;
        overflow: hidden !important;
        background: transparent !important;
    }

    .pottery-products-swiper .product-thumb,
    .pottery-products-swiper .product-thumb-link {
        width: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }

    .pottery-products-swiper .product-thumb img {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        transform: none !important;
    }

    .pottery-products-swiper .product-info {
        width: 100% !important;
        height: 158px !important;
        min-height: 158px !important;
        flex: 0 0 158px !important;
        gap: 5px !important;
        align-items: center !important;
        padding: 10px 12px 11px !important;
        text-align: center !important;
    }

    .pottery-products-swiper .product-meta {
        width: 100% !important;
        justify-content: center !important;
        font-size: 10px !important;
        text-align: center !important;
    }

    .pottery-products-swiper .product-title {
        min-height: 35px !important;
        text-align: center !important;
    }

    .pottery-products-swiper .product-title a {
        display: block !important;
        width: 100% !important;
    }

    .pottery-products-swiper .product-footer,
    .pottery-products-swiper .price-wrapper {
        align-items: center !important;
    }

    .pottery-products-swiper .price-main {
        text-align: center !important;
    }

    .pottery-products-swiper .add-to-cart-btn {
        min-height: 38px !important;
        border-radius: 8px !important;
    }

    .review-card {
        height: 214px !important;
        min-height: 214px !important;
        max-height: 214px !important;
        padding: 11px !important;
    }

    .review-author {
        margin-bottom: 6px !important;
        font-size: 13px !important;
    }

    .review-rating {
        gap: 6px !important;
        margin-bottom: 6px !important;
    }

    .review-rating span {
        font-size: 13px !important;
        letter-spacing: 0 !important;
    }

    .review-rating strong {
        font-size: 11px !important;
    }

    .review-product {
        margin-bottom: 6px !important;
        padding: 4px 7px !important;
        font-size: 10px !important;
    }

    .review-text {
        -webkit-line-clamp: 3 !important;
        font-size: 11px !important;
        line-height: 1.36 !important;
    }

    .review-more {
        min-height: 25px !important;
        font-size: 10px !important;
        text-underline-offset: 3px !important;
    }
}

/* Two-column vertical cards in the mobile tea catalog. */
@media (max-width: 768px) {
    .tea-catalog-page .catalog-content .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .tea-catalog-page .catalog-content .product-card {
        display: flex !important;
        min-width: 0;
        min-height: 0;
        flex-direction: column !important;
        overflow: hidden;
    }

    .tea-catalog-page .catalog-content .product-card-media {
        width: 100%;
        height: auto;
        min-height: 0;
        flex: 0 0 auto;
    }

    .tea-catalog-page .catalog-content .product-thumb-link {
        display: block;
        width: 100%;
        height: auto;
    }

    .tea-catalog-page .catalog-content .product-thumb {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 7 / 8 !important;
        padding: 0 !important;
    }

    .tea-catalog-page .catalog-content .product-thumb img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    .tea-catalog-page .catalog-content .product-info {
        width: 100%;
        min-width: 0;
        min-height: 116px;
        flex: 1 1 auto;
        gap: 4px !important;
        padding: 6px 8px 8px !important;
    }

    .tea-catalog-page .catalog-content .product-title {
        display: -webkit-box;
        min-height: 30px;
        overflow: hidden;
        font-size: 12px !important;
        line-height: 1.25 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .tea-catalog-page .catalog-content .product-footer {
        gap: 4px !important;
        margin-top: auto;
    }

    .tea-catalog-page .catalog-content .price-main {
        font-size: 16px !important;
        line-height: 1.15;
    }

    .tea-catalog-page .catalog-content .price-main span,
    .tea-catalog-page .catalog-content .price-unit,
    .tea-catalog-page .catalog-content .price-old {
        font-size: 9px !important;
    }

    .tea-catalog-page .catalog-content .add-to-cart-btn {
        height: 36px !important;
        min-height: 36px !important;
        flex-basis: 36px !important;
        gap: 6px !important;
        padding: 7px 5px !important;
        font-size: 11px !important;
    }

    .tea-catalog-page .catalog-content .add-to-cart-icon {
        width: 14px !important;
        height: 14px !important;
    }

    .tea-catalog-page .catalog-content .product-favorite-btn {
        top: 6px !important;
        right: 6px !important;
        left: auto !important;
        width: 34px !important;
        height: 34px !important;
        font-size: 16px !important;
    }

    .tea-catalog-page .catalog-content .product-badge-group {
        top: 6px !important;
        left: 6px !important;
        max-width: calc(100% - 48px);
    }

    .tea-catalog-page .catalog-content .product-badge {
        padding: 4px 5px !important;
        font-size: 8px !important;
    }
}

/* product-detail-mobile-compact-v1 */
@media (max-width: 768px) {
    .product-page {
        padding-top: 6px !important;
        padding-bottom: calc(var(--mobile-dock-height, 60px) + 18px) !important;
    }

    .product-page .breadcrumbs {
        gap: 4px !important;
        margin-bottom: 2px !important;
        padding-bottom: 2px !important;
        font-size: 9px !important;
        line-height: 1.3 !important;
    }

    .product-page .product-layout {
        gap: 7px !important;
        margin-top: 5px !important;
        align-items: stretch !important;
    }

    .product-page .product-image-wrap {
        min-height: 0 !important;
    }

    .product-page .product-main-image-stage,
    .product-page .product-gallery .product-main-image,
    .product-page .product-gallery .product-main-video {
        height: clamp(176px, 50vw, 196px) !important;
        min-height: 0 !important;
        max-height: 196px !important;
        aspect-ratio: auto !important;
    }

    .product-page .product-gallery .product-main-image,
    .product-page .product-gallery .product-main-video {
        object-fit: contain !important;
        object-position: center !important;
    }

    .product-page .product-image-wrap {
        width: min(76vw, 310px) !important;
        margin-right: auto !important;
        margin-left: auto !important;
        justify-self: center;
    }

    .product-page .product-main-image-stage,
    .product-page .product-gallery .product-main-image,
    .product-page .product-gallery .product-main-video {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: 3 / 4 !important;
    }

    .product-page .product-gallery .product-main-image,
    .product-page .product-gallery .product-main-video {
        object-fit: cover !important;
        object-position: center !important;
    }

    .product-page .product-gallery-favorite {
        top: 7px !important;
        right: 7px !important;
        width: 34px !important;
        height: 34px !important;
        font-size: 18px !important;
    }

    .product-page .product-detail-gallery-nav {
        width: 30px !important;
        height: 42px !important;
    }

    .product-page .product-detail-gallery-nav span {
        width: 10px !important;
        height: 10px !important;
    }

    .product-page .product-detail-gallery-count {
        right: 6px !important;
        bottom: 6px !important;
        padding: 3px 5px !important;
        font-size: 9px !important;
    }

    .product-page .product-gallery-thumbnails {
        grid-auto-columns: 44px !important;
        gap: 4px !important;
        padding: 5px 2px 1px !important;
    }

    .product-page .product-gallery-thumbnail {
        width: 44px !important;
    }

    .product-page .product-purchase {
        padding: 10px !important;
    }

    .product-page .product-badge-group {
        margin-bottom: 4px !important;
    }

    .product-page .product-badge {
        padding: 3px 6px !important;
        font-size: 8px !important;
    }

    .product-page .product-stock-line {
        gap: 7px !important;
        margin: 1px 0 4px !important;
        font-size: 12px !important;
    }

    .product-page .stock-meter {
        grid-template-columns: repeat(3, 15px) !important;
    }

    .product-page .stock-meter i {
        height: 8px !important;
    }

    .product-page .product-panel h1 {
        margin: 4px 0 5px !important;
        font-size: 18px !important;
        line-height: 1.14 !important;
    }

    .product-page .product-lead {
        margin: 0 0 6px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
        -webkit-line-clamp: 2 !important;
    }

    .product-page .product-variant-switcher {
        gap: 4px !important;
        margin: 5px 0 3px !important;
    }

    .product-page .product-variant-switcher > span {
        font-size: 9px !important;
    }

    .product-page .product-variant-options {
        gap: 5px !important;
    }

    .product-page .product-variant-options button {
        min-height: 42px !important;
        padding: 5px 8px !important;
    }

    .product-page .product-variant-options strong {
        font-size: 13px !important;
    }

    .product-page .product-variant-options small {
        font-size: 9px !important;
    }

    .product-page .product-price-row {
        gap: 6px !important;
        margin: 7px 0 !important;
    }

    .product-page .product-price-row .price-main,
    .product-page .product-price-row .price-main [data-product-price] {
        font-size: 23px !important;
    }

    .product-page .product-price-row .price-main [data-product-unit] {
        font-size: 9px !important;
    }

    .product-page .product-actions {
        gap: 5px !important;
    }

    .product-page .product-primary-btn,
    .product-page .product-favorite-detail-btn,
    .product-page .product-secondary-btn {
        min-height: 36px !important;
        padding: 6px 7px !important;
        font-size: 10px !important;
    }

    .product-page .product-gallery-description {
        padding: 10px !important;
    }

    .product-page .product-gallery-description h2 {
        margin-bottom: 4px !important;
        font-size: 16px !important;
    }

    .product-page .product-gallery-description p,
    .product-page .product-gallery-description-body {
        color: #000000 !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
    }

    .product-page .product-description-more-btn {
        min-height: 34px !important;
        margin-top: 7px !important;
        padding: 0 11px !important;
        font-size: 10px !important;
    }

    .product-page .wholesale-detail-pricing {
        gap: 6px !important;
        margin: 7px 0 !important;
        padding: 8px !important;
    }

    .product-page .wholesale-detail-price-tiers {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 5px !important;
    }

    .product-page .wholesale-detail-price-tiers small {
        min-height: 22px !important;
        padding: 3px 4px !important;
        font-size: 8px !important;
    }

    .product-page .wholesale-detail-price-tiers strong,
    .product-page .wholesale-detail-single-price strong {
        font-size: 15px !important;
    }

    .product-page .wholesale-detail-order-rule {
        margin-bottom: 8px !important;
        padding-top: 7px !important;
    }

    .product-page .wholesale-detail-order-rule strong {
        font-size: 15px !important;
    }

    .product-page .product-section-card,
    .product-page .product-brew-section,
    .product-page .product-taste-section,
    .product-page .product-teapot-section {
        padding: 10px !important;
    }

    .product-page .product-brew-section h3,
    .product-page .product-taste-section h3,
    .product-page .product-teapot-section h3 {
        margin-bottom: 7px !important;
        font-size: 16px !important;
    }

    .product-page .brew-method-grid {
        gap: 8px !important;
    }

    .product-page .brew-method-card {
        gap: 7px !important;
        padding: 9px !important;
    }

    .product-page .brew-method-visual {
        min-height: 48px !important;
        gap: 8px !important;
        padding-bottom: 6px !important;
    }

    .product-page .brew-method-icon,
    .product-page .brew-method-icon svg {
        flex-basis: 42px !important;
        width: 42px !important;
        height: 30px !important;
    }

    .product-page .brew-method-volume strong,
    .product-page .brew-method-card h4 {
        font-size: 16px !important;
    }

    .product-page .brew-metric {
        min-height: 36px !important;
        padding-top: 5px !important;
    }

    .product-page .brew-metric strong {
        font-size: 15px !important;
    }

    .product-page .product-taste-section {
        padding: 14px !important;
    }

    .product-page .product-taste-section h3 {
        margin-bottom: 12px !important;
        font-size: 19px !important;
    }

    .product-page .taste-list {
        gap: 10px !important;
    }

    .product-page .taste-row {
        gap: 14px !important;
        color: #000000 !important;
    }

    .product-page .taste-row-label {
        font-size: 14px !important;
        line-height: 1.25 !important;
    }

    .product-page .taste-row-dots {
        gap: 5px !important;
    }

    .product-page .taste-row-dots span {
        width: 13px !important;
        height: 13px !important;
    }
}

/* Keep tall pottery photos fully visible in the mobile home slider. */
@media (max-width: 768px) {
    .home-page .pottery-products-swiper .product-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .home-page .pottery-products-swiper .product-card-media {
        height: auto !important;
        min-height: 0 !important;
        flex: 0 0 auto !important;
        aspect-ratio: 3 / 4 !important;
        background: #ffffff !important;
    }

    .home-page .pottery-products-swiper .product-thumb,
    .home-page .pottery-products-swiper .product-thumb-link {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: 3 / 4 !important;
        background: #ffffff !important;
    }

    .home-page .pottery-products-swiper .product-thumb img {
        object-fit: contain !important;
        object-position: center !important;
    }

    .home-page .pottery-products-swiper .product-info {
        height: 138px !important;
        min-height: 138px !important;
        flex: 0 0 138px !important;
        gap: 4px !important;
        padding: 8px 10px 10px !important;
    }

    .home-page .pottery-products-swiper .product-title {
        min-height: 32px !important;
        font-size: 13px !important;
        line-height: 1.16 !important;
    }

    .home-page .pottery-products-swiper .price-main {
        font-size: 18px !important;
    }

    .home-page .pottery-products-swiper .add-to-cart-btn {
        height: 34px !important;
        min-height: 34px !important;
        flex-basis: 34px !important;
        padding: 6px 8px !important;
        font-size: 12px !important;
    }

    .home-page .pottery-products-swiper::after {
        display: none !important;
        content: none !important;
    }
}

/* Mobile readability pass: keep supporting copy legible without widening cards. */
@media (max-width: 768px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    .mobile-bottom-nav .mobile-bottom-item span,
    .catalog-route-tabs a {
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    .product-card .product-badge,
    .product-page .product-badge {
        font-size: 10px !important;
        line-height: 1.15 !important;
    }

    .product-card .product-type,
    .product-card .price-unit,
    .product-related .product-type,
    .product-related .price-unit {
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    .product-card .product-title,
    .product-related .product-title,
    .featured-products-swiper .product-title,
    .pottery-products-swiper .product-title {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }

    .product-card-gallery-count {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .product-card .add-to-cart-btn,
    .product-card .add-to-cart-btn span,
    .product-related .add-to-cart-btn,
    .product-related .add-to-cart-btn span {
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    .home-wholesale-promo-kicker,
    .ceremonies-kicker,
    .reviews-kicker,
    .featured-products-head .section-kicker {
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    .home-wholesale-promo-copy p,
    .home-wholesale-promo p {
        font-size: 13px !important;
        line-height: 1.4 !important;
    }

    .review-product,
    .review-more {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .review-text {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .product-page .breadcrumbs,
    .product-page .breadcrumbs a,
    .product-page .breadcrumbs span {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }

    .product-page .product-lead {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    .product-page .product-variant-switcher > span,
    .product-page .product-variant-options small,
    .product-page .product-price-row .price-main [data-product-unit],
    .product-page .wholesale-detail-price-tiers small {
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    .product-page .product-primary-btn,
    .product-page .product-favorite-detail-btn,
    .product-page .product-secondary-btn {
        min-height: 42px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    .product-page .product-description-more-btn {
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    .opt-page small,
    .opt-catalog-page small,
    .opt-cart-page small {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }

    .opt-page .opt-condition-label,
    .opt-page .opt-route-kicker {
        font-size: 10px !important;
        line-height: 1.25 !important;
    }

    .opt-page .opt-conditions-note,
    .opt-page .opt-eyebrow,
    .opt-page .opt-reference-kicker,
    .opt-page .opt-catalog-more,
    .opt-page .opt-contact-card p,
    .opt-page .opt-contact-card a {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }

    .opt-page .opt-warehouse-switch button,
    .opt-catalog-page .opt-warehouse-switch button {
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    .opt-catalog-page .opt-switch-label,
    .opt-catalog-page .opt-catalog-back,
    .opt-catalog-page .opt-catalog-count,
    .opt-catalog-page .opt-mobile-cart-count {
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    .opt-catalog-page .opt-product-price-tiers strong,
    .opt-catalog-page .opt-product-single-price strong {
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    .opt-catalog-page .opt-product-price-tiers em,
    .opt-catalog-page .opt-product-single-price em {
        font-size: 10px !important;
        line-height: 1.2 !important;
    }

    .opt-catalog-page .opt-catalog-product-button {
        min-height: 40px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    .opt-cart-page .opt-cart-back,
    .opt-cart-page .opt-cart-eyebrow,
    .opt-cart-page .opt-cart-tab strong,
    .opt-cart-page .opt-cart-clear,
    .opt-cart-page .opt-cart-item-copy > small,
    .opt-cart-page .opt-cart-item-price small,
    .opt-cart-page .opt-cart-form-label span {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .articles-page .article-card span,
    .articles-page .article-tag,
    .info-page .contacts-card p,
    .info-page .contact-card p {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
}

/* Audited mobile typography: 15–16px reading text, 13px supporting labels.
   Keep this after compact legacy rules; desktop typography is unchanged. */
@media (max-width: 768px) {
    body { font-size: 16px; }

    body .mobile-bottom-nav .mobile-bottom-item span,
    body .catalog-route-tabs a {
        font-size: 13px !important;
        line-height: 1.25 !important;
        white-space: normal;
    }

    body .catalog-route-tabs a { min-width: 0; padding-inline: 4px !important; }

    body main :is(input, select, textarea) {
        font-size: 16px !important;
        line-height: 1.4 !important;
    }

    body :is(.opt-cart-form, .opt-inquiry-form, .checkout-form, .account-form, .tea-request-form) label > span {
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    body :is(.hero-slide-button, .opt-route-catalog-cta,
        .opt-tier-switch button, .opt-floating-route-control button,
        .opt-catalog-product-button, .opt-cart-form button, .opt-cart-continue,
        .opt-form-actions button, .checkout-tab, .review-more) {
        min-height: 44px !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body :is(.home-wholesale-promo-kicker, .reviews-kicker, .ceremonies-kicker,
        .history-kicker, .production-kicker, .origin-kicker, .pickup-map-kicker,
        .tea-service-kicker, .tea-package-badge, .featured-minimum-order > span,
        .opt-page .opt-condition-label, .opt-page .opt-route-kicker,
        .opt-page .opt-reference-kicker, .opt-page .opt-eyebrow,
        .opt-catalog-page .opt-eyebrow, .opt-catalog-page .opt-switch-label,
        .opt-catalog-page .opt-catalog-count, .opt-cart-page .opt-cart-eyebrow,
        .contacts-hero > span, .search-site-link > span) {
        font-size: 13px !important;
        line-height: 1.4 !important;
        letter-spacing: 0.02em !important;
    }

    body :is(.home-wholesale-promo-copy p, .review-text,
        .product-page .product-lead, .product-page .product-gallery-description p,
        .product-page .product-gallery-description-body,
        .opt-page .opt-route-hero-content p, .opt-page .opt-promo-content p,
        .opt-page .opt-conditions-note, .opt-catalog-page .opt-catalog-hero-copy p,
        .opt-catalog-page .opt-catalog-hero-card p, .opt-cart-page .opt-cart-hero p,
        .opt-cart-page .opt-cart-empty p, .opt-cart-page .opt-cart-order-empty span,
        .contacts-hero p, .contacts-group-head p, .contact-method-body p,
        .articles-page .article-card-copy p) {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    body :is(.opt-page .opt-route-option-copy strong, .opt-page .opt-promo-link,
        .opt-page .opt-catalog-more, .opt-page .opt-contact-card a,
        .opt-page .opt-contact-card strong, .contact-method-links a,
        .opt-cart-page .opt-cart-switch strong, .opt-cart-page .opt-cart-back,
        .opt-catalog-page .opt-catalog-back, .opt-mobile-tool-copy strong,
        .articles-page .article-card-copy > strong) {
        font-size: 14px !important;
        line-height: 1.4 !important;
        overflow-wrap: anywhere;
    }

    body :is(.opt-page small, .opt-catalog-page small, .opt-cart-page small,
        .opt-reference-price.opt-order-rule > span, .opt-product-order-rule > span,
        .opt-catalog-page .opt-product-pricing-title, .opt-catalog-page .opt-product-price-tiers em,
        .opt-catalog-page .opt-product-single-price em,
        .opt-cart-page .opt-cart-summary-row span, .opt-cart-page .opt-cart-summary-row strong,
        .opt-cart-page .opt-cart-summary-total span, .opt-cart-page .opt-cart-result,
        .review-product, .review-rating strong, .search-wholesale-price-label,
        .articles-page .article-card-copy > span, .articles-page .article-card-copy strong span,
        .checkout-tab span, .product-page .breadcrumbs, .product-page .breadcrumbs a,
        .product-page .breadcrumbs span, .product-page .product-image-zoom-button span,
        .product-page .product-stock-line span, .product-page .brew-method-volume span,
        .product-page .brew-metric span, .product-page .product-variant-options small,
        .product-page .product-variant-switcher > span,
        .product-page .product-price-row .price-main [data-product-unit],
        .product-page .wholesale-detail-price-tiers small) {
        font-size: 13px !important;
        line-height: 1.4 !important;
    }

    body :is(.opt-cart-page .opt-cart-item-copy > small,
        .opt-cart-page .opt-cart-item-price small, .opt-cart-page .opt-cart-form > small,
        .opt-cart-page [data-wholesale-contact-hint]) { color: #53685b !important; }

    body .opt-cart-page .opt-cart-card-head button {
        min-height: 44px;
        font-size: 14px !important;
    }

    body .opt-cart-page .opt-cart-item-copy > a {
        display: block;
        font-size: 16px !important;
        line-height: 1.35 !important;
    }

    body .opt-cart-page .opt-cart-item-price strong { font-size: 18px !important; }
    body .opt-cart-page .opt-cart-summary-total { flex-wrap: wrap; gap: 4px 12px; }
    body .opt-cart-page .opt-cart-item-controls input { padding-right: 32px; }
    body .opt-cart-page .opt-cart-item-controls { margin-right: -40px; }

    body .opt-page .opt-route-hero-content { min-width: 0; }
    body .opt-page .opt-route-option-copy small { white-space: normal; }

    /* Let cards grow for readable copy instead of clipping it to fixed heights. */
    body .product-card,
    .home-page .pottery-products-swiper .product-card {
        height: auto !important;
        max-height: none !important;
    }

    body .product-card .product-info,
    .tea-catalog-page .catalog-content .product-info,
    .home-page .featured-products-swiper .product-info,
    .home-page .pottery-products-swiper .product-info {
        height: auto !important;
        min-height: 180px !important;
        flex: 1 0 auto !important;
        gap: 7px !important;
    }

    body .product-card :is(.product-title, .product-title a),
    .tea-catalog-page .catalog-content :is(.product-title, .product-title a),
    .home-page .featured-products-swiper :is(.product-title, .product-title a),
    .home-page .pottery-products-swiper :is(.product-title, .product-title a) {
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body .product-card .product-title { min-height: 39px !important; }

    body .product-card :is(.product-badge, .product-type, .price-unit),
    .tea-catalog-page .catalog-content :is(.product-badge, .product-type, .price-unit),
    .home-page .featured-products-swiper :is(.product-badge, .product-type, .price-unit),
    .home-page .pottery-products-swiper :is(.product-badge, .product-type, .price-unit),
    body .product-page .product-badge,
    body .product-card .product-card-gallery-count {
        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    body .product-card .product-badge { padding: 4px 6px !important; }
    body .product-card .product-badge-group { flex-wrap: wrap; max-width: calc(100% - 42px); }
    body .product-card .price-main { flex-wrap: wrap; gap: 4px 6px !important; }

    body .product-card .add-to-cart-btn,
    body .product-card .add-to-cart-btn span,
    .home-page .pottery-products-swiper .add-to-cart-btn {
        height: auto !important;
        min-height: 44px !important;
        flex-basis: auto !important;
        font-size: 14px !important;
        line-height: 1.3 !important;
    }

    body .product-page :is(.product-primary-btn, .product-favorite-detail-btn,
        .product-secondary-btn, .product-description-more-btn) {
        min-height: 44px !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body .hero-slide-actions--single:has(.hero-slide-button-business-mobile) .hero-slide-button,
    body .opt-catalog-page .opt-catalog-product-button {
        min-height: 44px !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body .hero-slide-actions--single:has(.hero-slide-button-business-mobile) .hero-slide-button {
        white-space: normal !important;
        text-align: left;
    }

    body .opt-page .opt-route-catalog-cta [data-opt-route-catalog-label] {
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    body .opt-catalog-page .opt-catalog-product-button {
        height: auto !important;
        white-space: normal;
    }

    .tea-catalog-page .catalog-content .price-main .price-unit,
    .tea-catalog-page .catalog-content .price-old,
    body .opt-catalog-page .opt-mobile-cart-count {
        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    body .opt-reference-page .opt-contact-list :is(a, strong) {
        font-size: 14px !important;
        line-height: 1.4 !important;
        overflow-wrap: anywhere;
    }

    body .header-cart-badge { font-size: 12px !important; }

    body .mobile-menu-primary a { font-size: 14px !important; line-height: 1.35 !important; }
    body .mobile-menu-social a span { font-size: 13px !important; line-height: 1.4 !important; }

    body .product-page :is(.product-detail-gallery-count, .wholesale-detail-stock,
        .wholesale-detail-pricing-title, .wholesale-detail-price-tiers em,
        .wholesale-detail-single-price em, .wholesale-detail-order-rule span,
        .wholesale-detail-order-rule small) {
        font-size: 13px !important;
        line-height: 1.4 !important;
    }

    body .opt-catalog-page .opt-product-price-tiers {
        grid-template-columns: 1fr !important;
    }

    body .opt-catalog-page .opt-product-price-tiers > span {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        justify-content: space-between;
        gap: 3px 7px;
        padding: 6px;
    }

    body .opt-catalog-page .opt-product-price-tiers strong,
    body .opt-catalog-page .opt-product-single-price strong {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }
}

@media (max-width: 360px) {
    /* A price table and full-size labels need more room on narrow phones. */
    body .opt-catalog-page .opt-catalog-content .opt-catalog-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* Mobile content hierarchy: hide only reviewed promotional/repeated copy.
   Never target all small/p elements: prices, units, stock, minimums, form hints,
   validation, consent, product descriptions and full articles remain available. */
@media (max-width: 768px) {
    /* Home previews keep their heading, image and action. Full articles are unchanged. */
    body.home-page :is(
        .home-wholesale-promo-kicker, .home-wholesale-promo-copy > p,
        .reviews-kicker, .history-kicker, .history-text > p,
        .production-kicker, .production-text > p, .origin-kicker, .tea-origin-copy > p,
        .ceremonies-kicker, .ceremony-article-copy > p, .ceremony-article-actions > span,
        .featured-minimum-order:not(.featured-business-order) > span,
        .featured-minimum-order > p
    ) {
        display: none !important;
    }

    /* Wholesale: retain the condition label and value, plus essential qualifications. */
    body .opt-page :is(
        .opt-route-kicker, .opt-route-hero-content > p, .opt-route-option-copy > small,
        .opt-reference-kicker, .opt-eyebrow, .opt-conditions-note,
        .opt-condition-card > small:not([data-mobile-essential]),
        .opt-promo-content > p, .opt-contacts-copy > p, .opt-form-head > p
    ),
    body .opt-cart-page :is(.opt-cart-eyebrow, .opt-cart-hero p),
    body .catalog-minimum-order > span,
    body .site-footer .footer-brand > p {
        display: none !important;
    }

    /* Service/list pages lose teasers, not package terms or the content being read. */
    body .articles-page :is(.articles-kicker, .articles-hero p, .articles-hero-note,
        .article-card-copy > span, .article-card-copy > p),
    body .tea-service-page :is(.tea-service-kicker, .tea-service-hero-copy > p,
        .tea-service-intro > article > span, .tea-service-video-copy > p,
        .tea-service-section-head p, .tea-service-band-inner > div > p, .tea-request-copy > p),
    body .search-page .search-kicker,
    body .info-page :is(.contacts-hero > span, .contacts-hero > p,
        .contacts-group-head > p, .contact-method-body > p,
        .article-kicker, .account-dashboard-hero p) {
        display: none !important;
    }

    /* Collapse space previously reserved for the hidden copy. */
    body.home-page :is(.home-wholesale-promo-copy, .history-text, .production-text,
        .tea-origin-copy, .ceremony-article-copy) h2,
    body .opt-page :is(.opt-reference-section-head h2, .opt-promo-content h2,
        .opt-contacts-copy h2, .opt-form-head h3),
    body .articles-page :is(.articles-hero h1, .articles-list h2, .article-card h3),
    body .tea-service-page :is(.tea-service-hero h1, .tea-service-video h2,
        .tea-service-section-head h2, .tea-service-band h2, .tea-request-copy h2),
    body .info-page :is(.contacts-hero h1, .article-hero h1) {
        margin-top: 0 !important;
    }

    body.home-page :is(.history-actions, .ceremony-article-actions, .origin-read-more) {
        margin-top: 14px !important;
    }

    body.home-page .production-text h2 { margin-bottom: 14px !important; }
    body.home-page .featured-minimum-order { gap: 6px !important; padding-block: 14px !important; }
    body .catalog-minimum-order { gap: 0 !important; }

    body .opt-page :is(.opt-route-hero, .opt-route-hero-content) { min-height: 320px !important; }
    body .opt-page .opt-route-switch button { min-height: 52px !important; }
    /* The persistent header switch has a 40px shell; its labels must fit inside. */
    body .opt-page .opt-floating-route-control button {
        min-height: 26px !important;
        padding: 0 2px;
        font-size: 13px !important;
        line-height: 1.25 !important;
    }
    body .opt-page .opt-condition-card { min-height: 80px; justify-content: center; }
    body .opt-page .opt-reference-section-head { gap: 12px !important; margin-bottom: 14px !important; }
    body .opt-page .opt-promo-link { margin-top: 14px !important; }

    body .articles-page :is(.article-card, .article-card--featured) {
        height: auto !important;
        min-height: 132px !important;
    }

    body .articles-page .article-card img { min-height: 132px !important; }
    body .articles-page .article-card h3 {
        display: block;
        overflow: visible;
        -webkit-line-clamp: unset;
    }

    body .tea-service-page :is(.tea-service-hero, .tea-service-hero-inner) {
        min-height: 0 !important;
    }
}