.elementor-5001 .elementor-element.elementor-element-a90042d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-5001 .elementor-element.elementor-element-01b7490{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );color:var( --e-global-color-primary );}.elementor-5001 .elementor-element.elementor-element-4827773{font-family:"Fino Sans", Sans-serif;font-weight:600;letter-spacing:0px;}.elementor-5001 .elementor-element.elementor-element-85c40d9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:16px 16px;--row-gap:16px;--column-gap:16px;}.elementor-5001 .elementor-element.elementor-element-4123458{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-5001 .elementor-element.elementor-element-1355f43{--e-filter-direction:row;--e-filter-white-space:nowrap;--e-filter-wrap:wrap;--e-filter-overflow-x:initial;}.elementor-5001 .elementor-element.elementor-element-ead94f2{--display:flex;}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-5001 .elementor-element.elementor-element-9932c88{--grid-columns:3;}.elementor-5001 .elementor-element.elementor-element-9932c88 .elementor-pagination{text-align:center;margin-top:65px;}body:not(.rtl) .elementor-5001 .elementor-element.elementor-element-9932c88 .elementor-pagination .page-numbers:not(:first-child){margin-left:calc( 13px/2 );}body:not(.rtl) .elementor-5001 .elementor-element.elementor-element-9932c88 .elementor-pagination .page-numbers:not(:last-child){margin-right:calc( 13px/2 );}body.rtl .elementor-5001 .elementor-element.elementor-element-9932c88 .elementor-pagination .page-numbers:not(:first-child){margin-right:calc( 13px/2 );}body.rtl .elementor-5001 .elementor-element.elementor-element-9932c88 .elementor-pagination .page-numbers:not(:last-child){margin-left:calc( 13px/2 );}@media(min-width:768px){.elementor-5001 .elementor-element.elementor-element-a90042d{--content-width:1280px;}}@media(max-width:1024px){.elementor-widget-text-editor{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-widget-heading .elementor-heading-title{line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-widget-loop-grid .elementor-pagination{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-widget-loop-grid .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-loop-grid .e-load-more-message{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-5001 .elementor-element.elementor-element-9932c88{--grid-columns:2;}}@media(max-width:767px){.elementor-widget-text-editor{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-widget-heading .elementor-heading-title{line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-widget-loop-grid .elementor-pagination{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-widget-loop-grid .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-widget-loop-grid .e-load-more-message{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-5001 .elementor-element.elementor-element-9932c88{--grid-columns:1;}}/* Start custom CSS *//* ============================================================
   UCL SHOP ARCHIVE — Template CSS (v1)
   ------------------------------------------------------------
   Paste into: Theme Builder → UCL Shop Archive template →
   Page Settings (gear icon) → Custom CSS

   Required HTML structure:
     .ucl-shop
       .ucl-shop-hero
         .ucl-shop-eyebrow
         .ucl-shop-title (h1)
         .ucl-shop-intro
       .ucl-shop-filters
         .ucl-shop-filter-row × 2 (category, city)
           .ucl-shop-filter-label
           (Elementor Taxonomy Filter widget)
       .ucl-shop-grid
         (Elementor Loop Grid → UCL Product Card)

   Product card classes (used in Phase 8B):
     .ucl-product-card
     .ucl-product-card-thumb
     .ucl-product-card-meta
     .ucl-product-card-name
     .ucl-product-card-price
   ============================================================ */


/* Force full width — kill Woo/theme wrappers */
.archive.woocommerce .entry-content,
.archive.woocommerce .content-area,
.archive.woocommerce main,
.archive.woocommerce .site-main,
.archive.woocommerce #primary,
.archive.woocommerce .site-content,
.post-type-archive-product .entry-content,
.post-type-archive-product .site-main,
.post-type-archive-product #primary {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}


/* ============================================================
   1. PAGE WRAPPER
   ============================================================ */

.ucl-shop {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 56px 24px 96px !important;
    background: #FFFFFF !important;
    color: #0F1419 !important;
}

@media (max-width: 768px) {
    .ucl-shop {
        padding: 32px 16px 72px !important;
    }
}


/* ============================================================
   2. HERO
   ============================================================ */

.ucl-shop-hero {
    max-width: 720px !important;
    margin: 0 0 48px 0 !important;
    padding: 0 0 32px 0 !important;
    border-bottom: 1px solid #E5E7EB !important;
}

.ucl-shop-eyebrow,
.ucl-shop-eyebrow p {
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: #6B7280 !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
}

.ucl-shop-title,
.ucl-shop-title h1,
.ucl-shop-title .elementor-heading-title {
    font-family: 'Fino Sans', 'Lora', Georgia, serif !important;
    font-size: clamp(36px, 5vw, 64px) !important;
    font-weight: 400 !important;
    color: #0F1419 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    text-transform: none !important;
}

.ucl-shop-intro,
.ucl-shop-intro p {
    font-family: 'Lora', Georgia, serif !important;
    font-size: 17px !important;
    color: #374151 !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: 620px !important;
}


/* ============================================================
   3. FILTERS
   ============================================================ */

.ucl-shop-filters {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    margin: 0 0 48px 0 !important;
    padding: 0 0 28px 0 !important;
    border-bottom: 1px solid #E5E7EB !important;
}

.ucl-shop-filter-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.ucl-shop-filter-label,
.ucl-shop-filter-label p {
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    color: #6B7280 !important;
    margin: 0 12px 0 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    min-width: 72px !important;
    line-height: 1.2 !important;
}

.ucl-shop-filters a,
.ucl-shop-filters button,
.ucl-shop-filters .e-filter-item,
.ucl-shop-filters .elementor-filter-item {
    display: inline-flex !important;
    align-items: center !important;
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #374151 !important;
    background: #FFFFFF !important;
    border: 1px solid #D1D5DB !important;
    border-radius: 999px !important;
    padding: 9px 16px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    line-height: 1 !important;
}

.ucl-shop-filters a:hover {
    background: #F9FAFB !important;
    border-color: #9CA3AF !important;
    color: #0F1419 !important;
}

.ucl-shop-filters a.is-active,
.ucl-shop-filters .e-filter-item-active,
.ucl-shop-filters a.current-cat {
    background: #0F1419 !important;
    border-color: #0F1419 !important;
    color: #FFFFFF !important;
}

@media (max-width: 768px) {
    .ucl-shop-filter-label {
        min-width: 100% !important;
        margin: 0 0 4px 0 !important;
    }
}


/* ============================================================
   4. PRODUCT GRID (Loop Grid layout: 3 col / 2 / 1)
   ============================================================ */

.ucl-shop-grid {
    margin: 0 !important;
    padding: 0 !important;
}

.ucl-shop-grid .elementor-loop-container,
.ucl-shop-grid .e-loop-container {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 48px 32px !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 1024px) {
    .ucl-shop-grid .elementor-loop-container,
    .ucl-shop-grid .e-loop-container {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 40px 24px !important;
    }
}

@media (max-width: 600px) {
    .ucl-shop-grid .elementor-loop-container,
    .ucl-shop-grid .e-loop-container {
        grid-template-columns: 1fr !important;
        gap: 36px !important;
    }
}


/* ============================================================
   5. PRODUCT CARD
   ============================================================ */

.ucl-shop-grid .e-loop-item,
.ucl-shop-grid .elementor-loop-item__wrapper,
.ucl-shop-grid .elementor-loop-item {
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
}

.ucl-product-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    border-radius: 4px !important;
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.ucl-product-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 32px -8px rgba(15, 20, 25, 0.10),
                0 6px 12px -4px rgba(15, 20, 25, 0.06) !important;
}

@media (hover: none) {
    .ucl-product-card:hover {
        transform: none !important;
        box-shadow: none !important;
    }
}

/* Cover image — magazine portrait 3:4 aspect */
.ucl-product-card-thumb,
.ucl-product-card-thumb .elementor-widget-container,
.ucl-product-card-thumb .elementor-image {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    overflow: hidden !important;
    border-radius: 2px !important;
}

.ucl-product-card-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 4 !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.5s ease !important;
}

.ucl-product-card:hover .ucl-product-card-thumb img {
    transform: scale(1.03) !important;
}

/* Meta line — category / city eyebrow */
.ucl-product-card-meta,
.ucl-product-card-meta p {
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    color: #6B7280 !important;
    margin: 4px 0 0 0 !important;
    padding: 0 4px !important;
    line-height: 1.2 !important;
}

/* Product name — serif heading */
.ucl-product-card-name,
.ucl-product-card-name h2,
.ucl-product-card-name h3,
.ucl-product-card-name h4,
.ucl-product-card-name .elementor-heading-title,
.ucl-product-card-name a {
    font-family: 'Fino Sans', 'Lora', Georgia, serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    color: #0F1419 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    text-decoration: none !important;
    margin: 0 !important;
    padding: 0 4px !important;
    background: transparent !important;
    border: 0 none !important;
    box-shadow: none !important;
    outline: none !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    max-width: 100% !important;
}

.ucl-product-card-name a {
    color: inherit !important;
    transition: opacity 0.2s ease !important;
}

.ucl-product-card-name a:hover {
    opacity: 0.55 !important;
}

/* Price */
.ucl-product-card-price,
.ucl-product-card-price p,
.ucl-product-card-price .price,
.ucl-product-card-price .woocommerce-Price-amount {
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #0F1419 !important;
    margin: 4px 0 0 0 !important;
    padding: 0 4px !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}

.ucl-product-card-price del,
.ucl-product-card-price .price del {
    color: #9CA3AF !important;
    margin-right: 6px !important;
}

.ucl-product-card-price ins,
.ucl-product-card-price .price ins {
    text-decoration: none !important;
    background: transparent !important;
    color: #0F1419 !important;
    font-weight: 600 !important;
}

@media (max-width: 768px) {
    .ucl-product-card-name,
    .ucl-product-card-name h3 {
        font-size: 18px !important;
    }
}


/* ============================================================
   CHANGELOG
   ------------------------------------------------------------
   v1 (2026-05-24): Initial Shop Archive template CSS.
                    Same .ucl-shop-* shell pattern as other
                    archives. Product cards use 3:4 portrait
                    aspect (magazine cover proportion) with
                    hover lift + image zoom.
   ============================================================ *//* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Fino Sans';
	font-display: auto;
	src: url('https://www.uppercumberlandlifestyles.com/wp-content/uploads/2026/05/fino-sans-regular.ttf') format('truetype');
}
/* End Custom Fonts CSS */