/* ============================================================
   Medussa Home Bedding — faithful clone of old TemplateMonster theme
   Brand:   navy #01072A  |  nav-gold #E5A435  |  logo-gold #cda379
   Body:    Ubuntu sans  |  Headings: Ubuntu  |  Decor: Open Sans
   ============================================================ */

/* === Typography baseline === */
body, .page-wrapper, .columns, .column.main, p, td, li, span, label, input, select, textarea, button {
    font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}
body {
    color: #01072A !important;
    font-size: 14px !important;
    background: #ffffff !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Ubuntu', sans-serif !important;
    color: #01072A !important;
    font-weight: 300 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
a { color: #01072A; transition: color .25s; }
a:hover, a:focus { color: #E5A435; text-decoration: none; }
img { max-width: 100%; height: auto; }

/* === Top utility bar — Magento panel.wrapper hidden everywhere; mobile gets
   a CSS-only welcome strip via ::before to dodge Luma's nested-nav cloning
   that broke previous panel.wrapper styling attempts. === */
.page-header .panel.wrapper { display: none !important; }
@media (max-width: 767px) {
    .page-header::before {
        content: "Welcome to Medussa online store!";
        display: block;
        background: #01072A;
        color: #E5A435;
        font-style: italic;
        font-size: 12px;
        padding: 8px 60px 8px 16px;
        text-align: center;
        line-height: 1.4;
        border-bottom: 1px solid rgba(255,255,255,0.08);
    }
}
/* ZH variant — overwrite content on the Chinese store */
@media (max-width: 767px) {
    html[lang="zh"] .page-header::before,
    html[lang^="zh"] .page-header::before {
        content: "欢迎光临美杜莎家纺！";
    }
}

/* === Unified single-row header: logo + nav inline + right-side icon strip === */
/* Magento's blank parent renders 3 stacked rows (.panel.wrapper [hidden], .header.content with
   logo+search+minicart, .nav-sections with navigation). Visual-collapse them into one row by
   pinning .nav-sections into the same horizontal band as .header.content via negative margin. */

/* Default header: solid dark-blue on inner pages */
.page-header {
    background: #01072A !important;
    border-bottom: none !important;
    margin-bottom: 0 !important;
    position: relative !important;
    padding-right: 60px !important;            /* leave room for the right icon strip */
}
/* Mobile: the fixed 60-px right icon strip overlaps page content (cart summary,
   product info) because viewport is narrow. Push body padding 60-px right so
   nothing renders under the strip. Desktop already has whitespace on the
   right of the centered .page-main, so this is mobile-only. */
@media (max-width: 767px) {
    body {
        padding-right: 60px !important;
    }
}
.page-header .header.content {
    background: transparent !important;
    padding: 24px 90px 24px 60px !important;
    max-width: none !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 36px !important;
    position: relative !important;
}
/* HOME PAGE: header is translucent and overlays the hero slider. Old site uses
   background:#01072A; opacity:0.6 on cms-home. We use rgba so children stay
   opaque, AND we make the header absolute over the hero slider. */
body.cms-index-index .page-header,
body.cms-home .page-header {
    background: rgba(1, 7, 42, 0.6) !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    z-index: 50 !important;       /* above hero, above nav-sections */
}
body.cms-index-index .page-header .header.content,
body.cms-home .page-header .header.content { background: transparent !important; }
/* Make nav-sections inherit the same top:0 band — and bring it above the header bg so menu links sit on top */
body.cms-index-index .nav-sections,
body.cms-home .nav-sections { z-index: 60 !important; }
/* Pull main content (hero) up so it starts at viewport top, beneath the translucent header */
body.cms-index-index .page-main,
body.cms-home .page-main { margin-top: 0 !important; padding-top: 0 !important; }
body.cms-index-index .page-wrapper,
body.cms-home .page-wrapper { position: relative !important; }
.page-header .logo {
    margin: 0 !important;
    flex-shrink: 0 !important;
    float: none !important;
    max-width: 280px !important;
    order: 1 !important;
}
.page-header .logo img {
    max-height: 75px !important;
    width: auto !important;
    display: block !important;
}

/* minicart + top.search are MOVED via layout XML into .medussa-header-icons */

/* Pull .nav-sections up into the same horizontal band as the logo */
.nav-sections {
    background: transparent !important;
    margin: 0 !important;
    position: absolute !important;
    left: 0 !important; right: 60px !important; top: 0 !important;
    height: 123px !important;                  /* matches .header.content height incl. padding */
    z-index: 5 !important;
}
.nav-sections .section-items,
.nav-sections .section-item-content,
.nav-sections .section-item-title { background: transparent !important; height: 100% !important; }

.navigation {
    background: transparent !important;
    max-width: none !important;
    margin: 0 !important;
    /* Logo offsetRight measured at 367px in production; +13px breathing gap.
       Previous calc(60+250+20)=330 left nav text starting under the logo. */
    padding: 0 30px 0 380px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    font-size: 0;
}
.navigation > ul {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    list-style: none !important;
    width: 100%;
}
/* Keep submenus hidden by default — Magento JS controls open state via aria-expanded */
.navigation .submenu,
.navigation ul.submenu,
.navigation .level0 .submenu {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 270px !important;
    min-width: 270px !important;
    background: #01072A !important;
    box-shadow: 0 0 20px rgba(52,52,52,0.5) !important;
    padding: 8px 0 !important;
    margin: 5px 0 0 0 !important;
    border: none !important;
    z-index: 100 !important;
}
.navigation .level0:hover > .submenu,
.navigation .level0 > .submenu[aria-expanded="true"],
.navigation .level0[aria-expanded="true"] > .submenu {
    display: block !important;
}
.navigation .submenu li { display: block !important; margin: 0 !important; }
.navigation .submenu li a {
    display: block !important;
    padding: 6px 16px !important;
    color: #cda379 !important;
    background: transparent !important;
    font-size: 14px !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 300 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    white-space: nowrap;
    border: none !important;
}
.navigation .submenu li a:hover {
    color: #ffffff !important;
    background: transparent !important;
}
.navigation .level0 { position: relative !important; }
/* Welcome italic muted gold (was light-blue) */
.navigation > ul::after {
    color: #cda379 !important;
    font-size: 14px !important;
}
.navigation .level0 { margin: 0 !important; }
.navigation .level0 > a.level-top,
.navigation a.level-top {
    color: #E5A435 !important;
    background: transparent !important;
    border: none !important;
    text-transform: uppercase !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    letter-spacing: normal !important;
    padding: 0 3px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
}
.navigation .level0 { margin: 0 8px !important; }
.navigation .level0 > a.level-top span { white-space: nowrap !important; }
.navigation .level0 > a.level-top:hover,
.navigation .level0.active > a.level-top,
.navigation .level0.has-active > a.level-top {
    color: #ffffff !important; background: transparent !important;
}
/* Nested submenu: 2nd-level (and deeper) flies out to the right of its parent item.
   Old site offset: top:-8px left:270px relative to the parent <li>. */
.navigation .submenu li { position: relative !important; }
.navigation .submenu .submenu {
    top: -8px !important;
    left: 270px !important;
    margin: 0 !important;
}
/* Recursive hover/aria reveal — works for level1, level2, level3, ... */
.navigation .submenu li:hover > .submenu,
.navigation .submenu li > .submenu[aria-expanded="true"],
.navigation .submenu li[aria-expanded="true"] > .submenu {
    display: block !important;
}
/* Caret on parent items inside a submenu — points right, since the child flies right */
.navigation .submenu li.parent > a::after {
    content: '\f105'; /* font-awesome chevron-right */
    font-family: 'FontAwesome';
    font-weight: normal;
    font-size: 12px;
    float: right;
    opacity: 0.85;
}
.navigation .submenu li.parent > a .ui-menu-icon { display: none !important; }

/* Dropdown caret on parent level-0 items */
.navigation .level0.parent > a.level-top::after {
    content: '\f107'; /* font-awesome chevron-down */
    font-family: 'FontAwesome';
    font-weight: normal;
    font-size: 12px;
    margin-left: 8px;
    opacity: 0.85;
}
.navigation .level0.parent > a.level-top .ui-menu-icon { display: none !important; }

/* Welcome italic — use the actual Magento .greet.welcome element (it auto-uses the right
   per-store text from core_config_data design/header/welcome). The old hardcoded pseudo
   here forced EN text into the CN store. */
.navigation > ul::after { content: none !important; }
.page-header .greet.welcome {
    position: absolute !important;
    right: 76px;                 /* clear the 60px icon strip + a gap */
    top: 22px;
    color: #c5c8d6 !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-style: italic !important;
    font-size: 12px !important;
    text-align: right;
    white-space: nowrap;
    z-index: 5;
}
/* Hide the rest of ul.header.links (My Account, Sign In, etc.) on the top right —
   they are visually represented in the .medussa-header-icons strip instead.
   But keep the parent ul + the welcome li VISIBLE (not display:none). */
.page-header ul.header.links { display: block !important; }
.page-header ul.header.links > li.greet.welcome { display: block !important; }
.page-header ul.header.links > li:not(.greet) { display: none !important; }
/* Position the welcome (which sits inside ul.header.links) as the floating italic
   on the upper-right of the header bar */
.page-header ul.header.links {
    position: absolute !important;
    right: 76px;
    top: 22px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
    z-index: 5;
}
.page-header ul.header.links li.greet.welcome {
    color: #c5c8d6 !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-style: italic !important;
    font-size: 12px !important;
    white-space: nowrap;
    line-height: 1.2;
}

/* Right-strip icon ORDER (use flex order so source order doesn't matter):
   cart (1) → search (2) → account (3) → login key (4) */
.page-header .medussa-header-icons { display: flex !important; }
.page-header .medussa-header-icons .minicart-wrapper { order: 1; }
.page-header .medussa-header-icons .block-search    { order: 2; }
.page-header .medussa-header-icons .account-icon    { order: 3; }
.page-header .medussa-header-icons .login-icon      { order: 4; }
/* Account icon — same styling as login icon but with person glyph */
.page-header .medussa-header-icons .account-icon {
    display: flex !important;
    width: 60px !important;
    height: 60px !important;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    text-decoration: none !important;
}
.page-header .medussa-header-icons .account-icon::before {
    content: '';
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' fill='%23ffffff'><path d='M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3 0 498.7 13.3 512 29.7 512l388.6 0c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304l-91.4 0z'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Logo + nav-sections stacking: nav-sections is z=3 by Magento blank default
   and spans full width, so its area covers the logo even though the logo has
   z-index:5. The logo's parent .header.content was z-index:auto (defaults to 0)
   so the logo's 5 was effectively below nav's 3. Lift .header.content above
   nav-sections so the logo can receive clicks. */
/* Logo + header-icons sit ABOVE the absolute-positioned nav-sections strip.
   nav-sections is z:5, so lift just these two elements to z:11. Do NOT touch
   header.content z-index — that would visually cover nav. */
.page-header .logo {
    position: relative !important;
    z-index: 11 !important;
}
/* === Right-side vertical icon strip — fixed to viewport, full-height brown bar
   matching old site's .side-navbar. === */
.page-header .medussa-header-icons,
.medussa-header-icons {
    position: fixed !important;
    right: 0 !important; top: 0 !important;
    width: 60px !important;
    height: 100vh !important;
    background: #1b110d !important;       /* dark brown to match old site */
    border-left: none !important;
    z-index: 999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding-top: 0 !important;
}
.medussa-header-icons .minicart-wrapper,
.medussa-header-icons .block-search,
.medussa-header-icons .account-icon,
.medussa-header-icons .login-icon {
    position: relative !important;
    width: 60px !important;
    height: 60px !important;             /* match old 60×60 per box */
    min-height: 60px !important;
    flex: 0 0 60px !important;            /* don't let flex shrink them */
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.medussa-header-icons .minicart-wrapper .action.showcart {
    color: #ffffff !important;
    padding: 0 !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.medussa-header-icons .minicart-wrapper .action.showcart::before {
    color: #ffffff !important;
    font-size: 22px !important;
    margin: 0 !important;
}
.medussa-header-icons .minicart-wrapper .action.showcart .text,
.medussa-header-icons .minicart-wrapper .action.showcart .counter-label,
.medussa-header-icons .minicart-wrapper .action.showcart .counter-number { display: none !important; }
.medussa-header-icons .minicart-wrapper .action.showcart .counter.qty {
    position: absolute;
    top: 4px; right: 4px;
    min-width: 18px; height: 18px;
    background: #E5A435 !important;
    color: #ffffff !important;
    border-radius: 9px;
    font-size: 11px !important;
    line-height: 18px !important;
    padding: 0 4px !important;
}
/* search-block as collapsed icon with hover-out form */
.medussa-header-icons .block-search {
    width: 60px !important;
    position: relative !important;
}
.medussa-header-icons .block-search .block-title { display: none !important; }
.medussa-header-icons .block-search .block-content,
.medussa-header-icons .block-search form,
.medussa-header-icons .block-search .field.search {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}
.medussa-header-icons .block-search .label {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 60px !important;
    height: 50px !important;
    margin: 0 !important;
    cursor: pointer;
    z-index: 2;
    text-indent: -9999px;
    overflow: hidden;
}
.medussa-header-icons .block-search .label > span { display: none !important; }
.medussa-header-icons .block-search .label::before {
    content: '\f002' !important;
    font-family: 'FontAwesome' !important;
    color: #ffffff !important;
    font-size: 18px !important;
    text-indent: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    inset: 0 !important;
}
.medussa-header-icons .block-search .control {
    position: absolute !important;
    right: 60px !important;
    top: 0 !important;
    width: 280px !important;
    height: 50px !important;
    background: #01072A !important;
    padding: 5px 8px !important;
    visibility: hidden;
    opacity: 0;
    transition: opacity .2s, visibility .2s;
    z-index: 1;
}
.medussa-header-icons .block-search:hover .control,
.medussa-header-icons .block-search:focus-within .control {
    visibility: visible;
    opacity: 1;
}
.medussa-header-icons .block-search input {
    position: static !important;
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    border-radius: 0 !important;
    padding: 0 12px !important;
    color: #ffffff !important;
    height: 40px !important;
    width: 100% !important;
    left: auto !important;
    margin: 0 !important;
}
.medussa-header-icons .block-search input::placeholder { color: rgba(255,255,255,0.55) !important; }
.medussa-header-icons .block-search .action.search {
    background: transparent !important;
    border: none !important;
    color: #ffffff !important;
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    padding: 0 !important;
}
.medussa-header-icons .block-search .action.search::before { color: #ffffff !important; }

/* Hide minicart contents popup arrow position default */
.medussa-header-icons .minicart-wrapper .block-minicart { right: 60px !important; }

/* (Legacy ::after pseudo-icons removed — real account-icon and login-icon
   elements are now injected via layout XML and render their own SVGs.) */

/* === Home page: break out of Magento blank's .page-main 1280px max-width === */
body.cms-home .page-main,
body.cms-index-index .page-main {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.cms-home .columns,
body.cms-index-index .columns,
body.cms-home .column.main,
body.cms-index-index .column.main {
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

/* === Inner pages: page-main full-bleed minus right icon strip; columns contained 1200 === */
body.page-products .page-main,
body.catalog-product-view .page-main,
body.checkout-cart-index .page-main,
body.cms-page-view .page-main,
body.catalog-category-view .page-main {
    max-width: none !important;
    width: auto !important;
    margin: 0 60px 0 0 !important;
    padding: 24px 0 60px 0 !important;
}
body.page-products .columns,
body.catalog-product-view .columns,
body.checkout-cart-index .columns,
body.cms-page-view .columns,
body.catalog-category-view .columns {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* Category page 2-col layout: 370 sidebar + 770 main */
body.catalog-category-view.page-layout-2columns-left .sidebar.sidebar-main {
    width: 370px !important;
    padding-right: 30px !important;
}
body.catalog-category-view.page-layout-2columns-left .column.main {
    width: calc(100% - 370px) !important;
}
body.catalog-category-view .products-grid .product-items {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px 0 !important;             /* row-gap 20px, no horizontal gap — matches old edge-to-edge 2-col */
}
body.catalog-category-view .products-grid .product-item {
    width: auto !important;
    margin: 0 !important;
    padding: 0 8px !important;          /* small inner padding so card images don't kiss the column edge */
}
/* Same image-fill treatment for related/upsell products on PDP — shares .product-item /
   .product-image-container structure but scoped to body.catalog-product-view */
body.catalog-product-view .products-grid .product-item-info,
body.catalog-product-view .products-grid .product-item-photo,
body.catalog-product-view .products-grid .product-image-container,
body.catalog-product-view .products-grid .product-image-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}
body.catalog-product-view .products-grid [class*="product-image-container-"] {
    aspect-ratio: 3 / 2 !important;
    width: 100% !important;
    height: auto !important;
}
body.catalog-product-view .products-grid .product-image-photo {
    position: static !important;
    width: 100% !important;
    aspect-ratio: 3 / 2 !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}
body.catalog-product-view .products-grid .product-image-wrapper {
    padding: 0 !important;
    height: auto !important;
    position: static !important;
}
body.catalog-product-view .products-grid .product-item-photo {
    height: auto !important;
    line-height: 0 !important;
}
/* G1 — old category page never shows inline cart button + qty input on tiles. Hide. */
body.catalog-category-view .products-grid .product-item .product-item-actions .tocart-container,
body.catalog-category-view .products-grid .product-item .product-item-actions .actions-primary,
body.catalog-category-view .products-grid .product-item .product-item-actions .actions-secondary,
body.catalog-category-view .products-grid .product-item .action.tocart,
body.catalog-category-view .products-grid .product-item .field.qty,
body.catalog-category-view .products-grid .product-item .box-tocart {
    display: none !important;
}
/* G7 — let product image fill card width (Magento blank caps it at 240px) */
body.catalog-category-view .products-grid .product-item-info,
body.catalog-category-view .products-grid .product-item-photo,
body.catalog-category-view .products-grid .product-image-container,
body.catalog-category-view .products-grid .product-image-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
}
body.catalog-category-view .products-grid .product-image-wrapper {
    /* override the padding-top:125% hack so we can use natural ratio at full width */
    padding: 0 !important;
    height: auto !important;
    position: static !important;
}
/* Magento generates an inline rule .product-image-container-<id> with
   aspect-ratio:270/360 (the natural portrait ratio). Override every variant
   so the container collapses to the IMG's 3:2 height instead of leaving a
   tall empty box below the image. */
body.catalog-category-view .products-grid [class*="product-image-container-"] {
    aspect-ratio: 3 / 2 !important;
    width: 100% !important;
    height: auto !important;
}
body.catalog-category-view .products-grid .product-item-photo {
    height: auto !important;
    line-height: 0 !important;
}
body.catalog-category-view .products-grid .product-image-photo {
    position: static !important;
    width: 100% !important;
    aspect-ratio: 3 / 2 !important;            /* old site renders landscape crop of the portrait source */
    height: auto !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* G5 — rating stars: muted gold filled, light gold empty — matches old site */
body.catalog-category-view .rating-result > span:before,
body.catalog-category-view .product-reviews-summary .rating-result > span:before {
    color: #cda379 !important;
}
body.catalog-category-view .rating-result:before {
    color: #ecebeb !important;
}
body.catalog-category-view .products-grid .product-item-name a {
    color: #01072A !important;
    font-size: 18px !important;
    font-weight: 300 !important;
    text-transform: none !important;
    font-family: 'Ubuntu', sans-serif !important;
}
body.catalog-category-view .products-grid .product-item-name a:hover { color: #E5A435 !important; }
body.catalog-category-view .products-grid .price-box .price {
    color: #01072A !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    font-family: 'Ubuntu', sans-serif !important;
}
body.catalog-category-view .breadcrumbs {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 14px 15px !important;
    font-size: 14px !important;
}
body.catalog-category-view .breadcrumbs a,
body.catalog-product-view .breadcrumbs a,
body.cms-page-view .breadcrumbs a,
body.checkout-cart-index .breadcrumbs a,
body.catalog-category-view .breadcrumbs strong,
body.catalog-product-view .breadcrumbs strong,
body.cms-page-view .breadcrumbs strong,
body.checkout-cart-index .breadcrumbs strong {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #E5A435 !important;                 /* old site renders breadcrumb link text in gold */
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}
body.catalog-category-view .breadcrumbs a:hover,
body.catalog-product-view .breadcrumbs a:hover { color: #cda379 !important; }
body.catalog-category-view .breadcrumbs strong,
body.catalog-product-view .breadcrumbs strong { color: #cda379 !important; font-weight: 500 !important; }
body.catalog-category-view .breadcrumbs .item:not(:last-child)::after,
body.catalog-product-view .breadcrumbs .item:not(:last-child)::after,
body.cms-page-view .breadcrumbs .item:not(:last-child)::after {
    color: #E5A435 !important;
    content: '\f105' !important;               /* font-awesome chevron-right — matches old */
    font-family: 'FontAwesome' !important;
    font-weight: normal !important;
}
body.catalog-category-view .breadcrumbs .home a:before,
body.catalog-product-view .breadcrumbs .home a:before,
body.cms-page-view .breadcrumbs .home a:before {
    content: '\f015' !important;               /* font-awesome home icon */
    font-family: 'FontAwesome' !important;
    margin-right: 4px;
}

/* === Product detail page (PDP) — Phase H ===
   Rules below mirror old-site theme `modules.css` (TemplateMonster theme762)
   lines 13755+ and 14325+. Source-grepped, not eyeballed. */

/* PDP DESKTOP LAYOUT (≥992px): old site uses 63/33 split with media left, info right */
@media (min-width: 992px) {
    body.catalog-product-view .columns .column.main {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
    }
    body.catalog-product-view .columns .column.main .product.media {
        flex: 0 0 63% !important;
        max-width: 63% !important;
        order: 1 !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }
    body.catalog-product-view .columns .column.main .product-info-main {
        flex: 0 0 33% !important;
        max-width: 33% !important;
        order: 2 !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }
    body.catalog-product-view .columns .column.main .product.info.detailed {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        order: 3 !important;
        margin: 2rem 0 !important;
    }
    /* Push any other siblings (related/upsell/crosssell + Magento's hidden form
       elements) to the end so they don't jump above the gallery+info pair */
    body.catalog-product-view .columns .column.main > .block.related,
    body.catalog-product-view .columns .column.main > .block.upsell,
    body.catalog-product-view .columns .column.main > .block.crosssell,
    body.catalog-product-view .columns .column.main > .products-related,
    body.catalog-product-view .columns .column.main > .products-upsell {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        order: 4 !important;
    }
}

/* H1 title: 30px, weight 400 (normal), dark grey #343434, no uppercase
   (computed style on old site: rgb(52,52,52), fw=400, fs=30px) */
body.catalog-product-view .page-title-wrapper .container h1.page-title,
body.catalog-product-view .page-title-wrapper .container h1.page-title span,
body.catalog-product-view .page-title-wrapper .container h1.page-title .base {
    font-size: 30px !important;
    font-weight: 400 !important;
    color: #343434 !important;
    text-transform: none !important;
    line-height: 1.567em !important;
    text-align: left !important;
    margin: 0 0 1rem 0 !important;
}
/* Reorder to match old site visual order:
   stock/sku → H1 title → reviews → price → swatches → qty/btn.
   New Magento 2.4.8 has page-title-wrapper as direct sibling of product-info-price
   (not nested inside). Use `display:contents` on product-info-price so its
   children (stock-sku, reviews, price-box) flatten into .product-info-main, then
   give each piece an explicit order. */
body.catalog-product-view .product-info-main {
    display: flex !important;
    flex-direction: column !important;
}
body.catalog-product-view .product-info-main > .product-info-price {
    display: contents !important;
}
body.catalog-product-view .product-info-main .product-info-stock-sku { order: 1 !important; }
body.catalog-product-view .product-info-main > .page-title-wrapper   { order: 2 !important; }
body.catalog-product-view .product-info-main .product-reviews-summary{ order: 3 !important; }
body.catalog-product-view .product-info-main .price-box              { order: 4 !important; }
body.catalog-product-view .product-info-main > .product-add-form     { order: 5 !important; }
body.catalog-product-view .product-info-main > .product-social-links { order: 6 !important; }

/* Stock + SKU — old site lays out:
   row 1 (right): "Availability: In stock" (In stock in green)
   row 2 (left):  "Product Code:  <SKU value>"
   Achieved with stock absolutely positioned top-right and SKU as a plain block. */
body.catalog-product-view .product-info-main .product-info-stock-sku {
    position: relative !important;
    min-height: 50px !important;
    padding-top: 30px !important;          /* leave room for stock badge in top-right corner */
}
body.catalog-product-view .product-info-stock-sku .stock.available {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    float: none !important;
    text-transform: none !important;
    font-weight: 300 !important;
    color: #01072A !important;
    margin: 0 !important;
    display: block !important;
    line-height: 1.5 !important;
}
body.catalog-product-view .product-info-stock-sku .stock.available > span {
    color: #54b70b !important;
    text-transform: none !important;
    font-weight: 300 !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}
body.catalog-product-view .product-info-stock-sku .stock.available::before {
    content: 'Availability: ' !important;
    color: #01072A !important;
    font-weight: 300 !important;
}
body.catalog-product-view .product.attribute.sku {
    display: block !important;
    margin: 0 !important;
}
body.catalog-product-view .product.attribute.sku .type {
    font-weight: 300 !important;
    color: #01072A !important;
    display: inline !important;
}
body.catalog-product-view .product.attribute.sku .value {
    display: inline-block !important;
    padding: 0 !important;
    background: transparent !important;            /* old site renders plain text on white */
    color: #01072A !important;
    margin: 0 0 0 5px !important;
    font-weight: 400 !important;
}
/* Stock label "Availability:" + gold "In stock" — old site renders gold #cda379 */
body.catalog-product-view .product-info-stock-sku .stock.available {
    float: right !important;
    color: #01072A !important;
}
body.catalog-product-view .product-info-stock-sku .stock.available span {
    color: #cda379 !important;       /* override earlier #54b70b green — old site is gold */
    font-weight: 400 !important;
}

/* Qty input: 5rem × 48px, 20px gold text */
body.catalog-product-view .box-tocart .qty.input-text {
    width: 5rem !important;
    height: 48px !important;
    font-size: 20px !important;
    color: #cda379 !important;
    text-align: center !important;
    padding: 0 !important;
}

/* Add-to-cart button: 16px uppercase 500 + leading "+" */
body.catalog-product-view button.action.tocart {
    font-size: 16px !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    padding: 10px 20px !important;
}
body.catalog-product-view button.action.tocart span::before {
    content: '+';
    padding-right: 5px;
}

/* Swatch labels uppercase 16px 500 */
body.catalog-product-view .product-options-wrapper .swatch-attribute-label,
body.catalog-product-view .product-options-wrapper label.label {
    font-size: 16px !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    margin-bottom: 0 !important;
}
body.catalog-product-view .product-options-wrapper .swatch-attribute-options {
    margin-top: 10px !important;
}


/* Pdp-2: show strikethrough old/regular price */
body.catalog-product-view .product-info-price .old-price,
body.catalog-product-view .product-info-price .old.price,
body.catalog-product-view .product.info.detailed .old-price {
    display: inline-block !important;
    text-decoration: line-through !important;
    color: #888 !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    margin-left: 8px !important;
}
body.catalog-product-view .product-info-price .old-price .price-label,
body.catalog-product-view .product-info-price .normal-price .price-label {
    display: none !important;                  /* hide "Regular Price" / "Special Price" labels — old site doesn't show them */
}
/* PDP price: stack vertically — special big on top, regular strikethrough below (matches old) */
body.catalog-product-view .product-info-price .price-box.price-final_price {
    display: block !important;
}
body.catalog-product-view .product-info-price .special-price,
body.catalog-product-view .product-info-price .normal-price {
    display: block !important;
    margin: 0 !important;
}
body.catalog-product-view .product-info-price .old-price {
    display: block !important;
    margin: 4px 0 0 0 !important;
    font-size: 22px !important;
}
body.catalog-product-view .product-info-price .price-wrapper .price,
body.catalog-product-view .product-info-price .price {
    font-size: 30px !important;
    font-weight: 700 !important;
    color: #999999 !important;     /* old site grey */
    line-height: normal !important;
}

/* 4th login/key icon in the right-side strip — Magento blank renders this in
   header.links (.link.authorization-link). Move it into the icon strip via CSS
   absolute positioning. */
.page-header .medussa-header-icons .login-icon {
    display: flex !important;
    width: 60px !important;
    height: 60px !important;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    text-decoration: none !important;
}
.page-header .medussa-header-icons .login-icon::before {
    content: '';
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23ffffff'><path d='M336 352c97.2 0 176-78.8 176-176S433.2 0 336 0S160 78.8 160 176c0 18.7 2.9 36.8 8.3 53.7L7 391c-4.5 4.5-7 10.6-7 17l0 80c0 13.3 10.7 24 24 24l80 0c13.3 0 24-10.7 24-24l0-40 40 0c13.3 0 24-10.7 24-24l0-40 40 0c6.4 0 12.5-2.5 17-7l33.3-33.3c16.9 5.4 35 8.3 53.7 8.3zM376 96a40 40 0 1 1 0 80 40 40 0 1 1 0-80z'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Sidebar typography */
body.catalog-category-view .sidebar .filter-title strong,
body.catalog-category-view .sidebar-main .filter-title strong {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #343434 !important;
    text-transform: uppercase !important;          /* "SHOP BY" — old site uppercase */
    font-family: 'Ubuntu', sans-serif !important;
}
/* Compare Products + My Wish List block titles — mixed case on old site */
body.catalog-category-view .sidebar .block-compare .block-title strong,
body.catalog-category-view .sidebar .block-wishlist .block-title strong,
body.catalog-category-view .sidebar .block.block-compare .block-title,
body.catalog-category-view .sidebar .block.block-wishlist .block-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #343434 !important;
    text-transform: none !important;               /* "Compare Products" not uppercase */
    font-family: 'Ubuntu', sans-serif !important;
}
body.catalog-category-view .filter-options-title {
    color: #E5A435 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 16px 0 !important;
    border-bottom: 1px solid #ecebeb;
}
body.catalog-category-view .filter-options-item .filter-options-content {
    padding: 12px 0 !important;
}
body.catalog-category-view .filter-options-content a {
    color: #555 !important;
    font-size: 14px !important;
}
body.catalog-category-view .filter-options-content a:hover { color: #E5A435 !important; }

/* G8 — show limiter in TOP toolbar (Magento blank hides it; old TM theme shows it) */
body.catalog-category-view .toolbar.toolbar-products .limiter {
    display: inline-block !important;
    float: right !important;
    margin-left: 16px !important;
}
body.catalog-category-view .toolbar.toolbar-products .limiter .label {
    color: #555 !important;
    font-size: 13px !important;
    margin-right: 6px !important;
}
body.catalog-category-view .toolbar.toolbar-products .toolbar-amount {
    display: inline-block !important;
    color: #555 !important;
    font-size: 13px !important;
    line-height: 32px !important;
    margin: 0 !important;
}
body.catalog-category-view .toolbar.toolbar-products .toolbar-sorter.sorter {
    float: right !important;
}

/* G4 — sidebar: only hide the "Shopping Options" subheader. Compare Products + My Wish List
   blocks are part of stock Magento (not TM module) and present on old site, so keep them. */
body.catalog-category-view .sidebar .block-subtitle.filter-subtitle {
    display: none !important;
}
body.catalog-category-view .sidebar .block.block-reorder,
body.catalog-category-view .sidebar .block.widget.block-products-list {
    display: none !important;
}

/* === Hero (full-bleed minus 60px right icon strip — matches old site exactly) === */
.medussa-hero {
    position: relative;
    width: auto !important;
    max-width: none !important;
    margin: 0 60px 0 0 !important;
    height: 636px;
    overflow: hidden;
    background: #615149;
}
.medussa-hero .slides { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.medussa-hero .slides .slide {
    position: absolute; inset: 0;
    display: block; text-decoration: none !important; color: #ffffff;
    opacity: 0;
    animation: medussaHeroFade 30s infinite;
}
.medussa-hero .slides .slide .bg {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    z-index: 0;
}
.medussa-hero .slides .slide .caption {
    position: absolute; inset: 0;
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    text-align: center; color: #01072A;
    z-index: 1;
    padding: 0 30px;
}
.medussa-hero .slides .slide .caption .t1 {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 18px !important;
    font-weight: 300 !important;
    color: #ffffff !important;
    margin-bottom: 6px;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-shadow: 0 2px 12px rgba(0,0,0,0.35);
}
.medussa-hero .slides .slide .caption .t1:empty { display: none; }
.medussa-hero .slides .slide .caption .t2 {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-bottom: 6px;
    line-height: 1.1;
    text-transform: uppercase !important;
    letter-spacing: 0.02em;
    text-shadow: 0 2px 14px rgba(0,0,0,0.4);
}
.medussa-hero .slides .slide .caption .t3 {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: #E5A435 !important;
    margin-bottom: 24px;
    text-transform: uppercase !important;
    letter-spacing: 0.04em;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.medussa-hero .slides .slide .caption .t3:empty { display: none; }
.medussa-hero .slides .slide .caption .cta {
    display: inline-block;
    background: #E5A435 !important;
    color: #ffffff !important;
    padding: 12px 36px;
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    transition: background .3s ease;
}
.medussa-hero .slides .slide:hover .caption .cta { background: #01072A !important; }
.medussa-hero .slides .slide:nth-child(1) { animation-delay: 0s; }
.medussa-hero .slides .slide:nth-child(2) { animation-delay: 5s; }
.medussa-hero .slides .slide:nth-child(3) { animation-delay: 10s; }
.medussa-hero .slides .slide:nth-child(4) { animation-delay: 15s; }
.medussa-hero .slides .slide:nth-child(5) { animation-delay: 20s; }
.medussa-hero .slides .slide:nth-child(6) { animation-delay: 25s; }
@keyframes medussaHeroFade {
    0%   { opacity: 0; }
    3%   { opacity: 1; }
    17%  { opacity: 1; }
    20%  { opacity: 0; }
    100% { opacity: 0; }
}
.medussa-hero .dots {
    position: absolute; left: 0; right: 0; bottom: 28px; z-index: 3;
    display: flex; justify-content: center; gap: 6px;
}
.medussa-hero .dots .dot {
    width: 16px; height: 16px; border-radius: 8px;
    background: #01072A;
    border: none;
    animation: medussaDot 30s infinite;
}
.medussa-hero .dots .dot:nth-child(1) { animation-delay: 0s; }
.medussa-hero .dots .dot:nth-child(2) { animation-delay: 5s; }
.medussa-hero .dots .dot:nth-child(3) { animation-delay: 10s; }
.medussa-hero .dots .dot:nth-child(4) { animation-delay: 15s; }
.medussa-hero .dots .dot:nth-child(5) { animation-delay: 20s; }
.medussa-hero .dots .dot:nth-child(6) { animation-delay: 25s; }
@keyframes medussaDot {
    0%   { background: #01072A; }
    3%   { background: #E5A435; }
    17%  { background: #E5A435; }
    20%  { background: #01072A; }
    100% { background: #01072A; }
}
/* (legacy .medussa-hero-text rules dropped — slides now have .caption inside each .slide) */

/* === Showcases (2-col full-bleed minus right strip) === */
.medussa-section.medussa-showcases {
    max-width: none !important;
    margin: 0 60px 0 0 !important;
    padding: 0 !important;
}
.medussa-section.medussa-showcases .medussa-section-title,
.medussa-section.medussa-showcases .medussa-section-subtitle { display: none !important; }
.medussa-section.medussa-showcases .showcases ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
    max-width: none !important;
}
.medussa-section.medussa-showcases .showcases li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
}
.medussa-section.medussa-showcases .showcases a {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 636 / 346;
    background: #f5f5f5;
}
.medussa-section.medussa-showcases .showcases img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .6s ease !important;
}
.medussa-section.medussa-showcases .showcases a:hover img { transform: scale(1.04); }
.medussa-section.medussa-showcases .showcases--text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #01072A;
    background: transparent;
    padding: 40px;
    pointer-events: none;
    transition: background .35s ease;
}
.medussa-section.medussa-showcases .showcases a:hover .showcases--text {
    background: rgba(255,255,255,0.18);
}
.medussa-section.medussa-showcases .showcases--text span {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #01072A !important;
    line-height: 1.1 !important;
    text-shadow: 0 1px 16px rgba(255,255,255,0.6), 0 1px 3px rgba(255,255,255,0.5);
}
@media (max-width: 991px) {
    .medussa-section.medussa-showcases .showcases--text span { font-size: 28px !important; }
}
@media (max-width: 575px) {
    .medussa-section.medussa-showcases .showcases--text span { font-size: 22px !important; }
}

/* === Hand-curated Special Products section (contained 1200 like old site) === */
.medussa-section.medussa-special {
    max-width: 1200px !important;
    margin: 60px auto 60px auto !important;
    padding: 0 15px !important;
}
.medussa-special-title {
    text-align: center !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 300 !important;
    font-size: 20px !important;
    letter-spacing: normal !important;
    text-transform: uppercase !important;
    color: #343434 !important;
    margin: 0 0 40px 0 !important;
}
.medussa-special-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
}
.medussa-card {
    display: block !important;
    text-decoration: none !important;
    color: #343434 !important;
    background: #ffffff;
    padding: 0 15px;
    transition: none;
}
.medussa-card .medussa-card-img {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f7f7f7;
    margin-bottom: 18px;
}
.medussa-card .medussa-card-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .5s ease;
}
.medussa-card:hover .medussa-card-img img { transform: scale(1.04); }
.medussa-card-name {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 18px !important;
    color: #343434 !important;
    font-weight: 300 !important;
    text-align: left;
    line-height: 1.3;
    margin: 0 0 12px 0;
    min-height: 46px;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
.medussa-card:hover .medussa-card-name { color: #E5A435 !important; }
.medussa-card-price {
    margin: 0;
    font-family: 'Ubuntu', sans-serif !important;
    text-align: left;
}
.medussa-card-price .now {
    color: #01072A !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    display: block;
}
.medussa-card-price .old {
    color: #999999 !important;
    text-decoration: line-through;
    font-size: 16px !important;
    font-weight: 300 !important;
    margin-right: 6px;
    display: block;
}
@media (max-width: 991px) { .medussa-special-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575px) { .medussa-special-grid { grid-template-columns: repeat(2, 1fr); } }

/* === Showroom title (inside add-info section) === */
.medussa-section.medussa-add-info .medussa-section-title {
    display: block !important;
    text-align: center !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #01072A !important;
    margin: 0 0 30px 0 !important;
    line-height: 1.5 !important;
}

/* === Special products (Magento product grid in widget block) === */
.block.widget.block-products-list,
.medussa-section.medussa-special-products {
    max-width: 1280px !important;
    margin: 60px auto !important;
    padding: 0 30px !important;
}
.block.widget.block-products-list .block-title,
.medussa-section.medussa-special-products .block-title {
    text-align: center !important;
    margin-bottom: 30px !important;
    border: none !important;
    padding: 0 !important;
}
.block.widget.block-products-list .block-title strong,
.medussa-section.medussa-special-products .block-title strong {
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 300 !important;
    font-size: 30px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #01072A !important;
}
.block.widget.block-products-list .block-content,
.block.widget.block-products-list .product-items {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.block.widget.block-products-list .product-item { width: auto !important; padding: 0 !important; }

/* === Product cards (catalog grid + widget) === */
.products-grid .product-items {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
}
.products-grid .product-item {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
.products-grid .product-item-info {
    background: #ffffff;
    border: none !important;
    padding: 0 !important;
    transition: box-shadow .25s;
}
.products-grid .product-item-info:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.08); }
.products-grid .product-item-photo { display: block; overflow: hidden; }
.products-grid .product-image-photo { transition: transform .5s ease; }
.products-grid .product-item-photo:hover .product-image-photo { transform: scale(1.04); }
.products-grid .product-item-details {
    padding: 16px 4px !important;
    text-align: center;
}
.products-grid .product-item-name { margin: 0 0 8px 0 !important; }
.products-grid .product-item-name a {
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 400 !important;
    font-size: 18px !important;
    color: #343434 !important;
    text-decoration: none !important;
    line-height: 1.3 !important;
}
.products-grid .product-item-name a:hover { color: #E5A435 !important; }
.products-grid .price-box { margin: 8px 0 12px 0 !important; }
.products-grid .price-box .price {
    font-family: 'Ubuntu', sans-serif !important;
    color: #01072A !important;
    font-weight: 700 !important;
    font-size: 20px !important;
}
.products-grid .price-box .old-price .price {
    color: #999999 !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    text-decoration: line-through;
}

/* === Buttons (navy bg, white text, no radius) === */
.action.primary, button.action.primary, .action.tocart, button.action.tocart, .action.subscribe {
    background: #01072A !important;
    border: 1px solid #01072A !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 400 !important;
    font-size: 13px !important;
    padding: 12px 26px !important;
    transition: all .25s !important;
    box-shadow: none !important;
}
.action.primary:hover, button.action.primary:hover, .action.tocart:hover, button.action.tocart:hover, .action.subscribe:hover {
    background: #E5A435 !important;
    border-color: #E5A435 !important;
    color: #ffffff !important;
}
.action.primary:focus, .action.tocart:focus { outline: none !important; }

/* === Add-info (4 squares full-bleed minus right strip) === */
.medussa-section.medussa-add-info {
    max-width: none !important;
    margin: 60px 60px 60px 0 !important;
    padding: 0 !important;
}
.medussa-section.medussa-add-info .medussa-section-title,
.medussa-section.medussa-add-info .medussa-section-subtitle { display: none !important; }
.medussa-section.medussa-add-info .add-info ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0 !important;
}
.medussa-section.medussa-add-info .add-info li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.medussa-section.medussa-add-info .add-info img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .5s ease !important;
}
.medussa-section.medussa-add-info .add-info a { display: block; height: 100%; }
.medussa-section.medussa-add-info .add-info a:hover img { transform: scale(1.05); }
.medussa-section.medussa-add-info h1 {
    text-align: center !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 300 !important;
    font-size: 18px !important;
    color: #01072A !important;
    margin: 30px 0 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* === Page title (catalog/CMS h1) === */
.page-title-wrapper .page-title,
.page-main > .page-title-wrapper .page-title {
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 300 !important;
    font-size: 32px !important;
    color: #01072A !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    margin: 0 0 24px 0 !important;
    text-align: center !important;
}
/* CMS-page title doesn't need re-upper because content is already uppercase */
.cms-page-view .page-title-wrapper .page-title { text-transform: uppercase !important; }
.checkout-cart-index .page-title-wrapper .page-title,
.catalog-category-view .page-title-wrapper .page-title { text-transform: uppercase !important; }
/* Empty cart link gold */
.cart-empty a { color: #E5A435 !important; }
.cart-empty a:hover { color: #01072A !important; }
.page-title-wrapper { text-align: center; padding: 40px 0 24px 0; }

/* === Breadcrumbs === */
.breadcrumbs {
    max-width: 1280px;
    margin: 0 auto !important;
    padding: 14px 30px !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 12px !important;
    color: #999999 !important;
}
.breadcrumbs a { color: #999999 !important; }
.breadcrumbs a:hover { color: #01072A !important; }
.breadcrumbs .item:not(:last-child)::after { color: #cccccc !important; }

/* === Product detail (catalog-product-view) === */
body.catalog-product-view .product-info-main {
    width: 33% !important;
    padding-left: 24px;
}
body.catalog-product-view .product.media {
    width: 63% !important;
}
body.catalog-product-view .product-info-main .page-title-wrapper {
    padding: 0 !important;
    margin: 14px 0 16px 0 !important;
    text-align: left !important;
}
body.catalog-product-view .product-info-main .page-title-wrapper .page-title {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 32px !important;
    font-weight: 300 !important;
    color: #01072A !important;
    text-align: left !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}
body.catalog-product-view .product-info-main .product-info-stock-sku,
body.catalog-product-view .product.attribute.sku,
body.catalog-product-view .stock {
    font-size: 14px !important;
    color: #01072A !important;
}
body.catalog-product-view .product-info-main .product-info-price {
    border: none !important;
    padding: 18px 0 8px 0 !important;
}
body.catalog-product-view .product-info-main .product-info-price .price-final_price .price,
body.catalog-product-view .product-info-main .price-box .price {
    color: #999999 !important;                 /* match old site grey */
    font-size: 30px !important;
    font-weight: 700 !important;
    font-family: 'Ubuntu', sans-serif !important;
}
body.catalog-product-view .product-info-main .price-box .old-price .price {
    color: #01072A !important;
    font-size: 30px !important;
    font-weight: 300 !important;
    text-decoration: line-through;
}
body.catalog-product-view .product-info-main .swatch-attribute-label,
body.catalog-product-view .product-options-wrapper > .fieldset > .field > .label {
    color: #01072A !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    font-family: 'Ubuntu', sans-serif !important;
    margin-bottom: 10px !important;
}
body.catalog-product-view .swatch-attribute-options .swatch-option.text,
body.catalog-product-view .swatch-option.text {
    background: #f7f7f7 !important;
    color: #1b110d !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-family: 'Ubuntu', sans-serif !important;
    height: auto !important;
    min-width: 50px;
    margin: 0 8px 8px 0 !important;
}
body.catalog-product-view .swatch-option.text.selected,
body.catalog-product-view .swatch-option.text:hover {
    background: #01072A !important;
    color: #ffffff !important;
    outline: none !important;
}
body.catalog-product-view .box-tocart .input-text.qty,
body.catalog-product-view #qty {
    border: 1px solid #000000 !important;
    width: 80px !important;
    height: 48px !important;
    padding: 0 !important;
    text-align: center !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #cda379 !important;        /* gold to match old site */
    font-size: 20px !important;
}
body.catalog-product-view .box-tocart .field.qty .label {
    color: #01072A !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    margin-bottom: 6px !important;
}
body.catalog-product-view #product-addtocart-button,
body.catalog-product-view .product-info-main .action.tocart {
    background: #01072A !important;
    color: #ffffff !important;
    border: none !important;
    padding: 0 32px !important;
    height: 48px !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
    font-family: 'Ubuntu', sans-serif !important;
}
body.catalog-product-view #product-addtocart-button:hover { background: #E5A435 !important; }
/* Wishlist + compare to icon-only */
body.catalog-product-view .product-social-links {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #ecebeb;
}
body.catalog-product-view .product-social-links .action.towishlist,
body.catalog-product-view .product-social-links .action.tocompare {
    background: transparent !important;
    color: #999 !important;
    padding: 0 16px 0 0 !important;
    font-size: 13px !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
body.catalog-product-view .product-social-links .action.towishlist:hover,
body.catalog-product-view .product-social-links .action.tocompare:hover { color: #E5A435 !important; }

/* Gallery thumbnails on left of main image */
body.catalog-product-view .product.media .fotorama__nav-wrap--horizontal,
body.catalog-product-view .product.media .fotorama__nav__shaft { background: transparent !important; }

/* === Star ratings — old site uses muted-gold #cda379, Magento default is orange.
   Bump specificity to beat Magento blank's default `.rating-summary .rating-result > span:before`. */
body.catalog-product-view .product-reviews-summary .rating-summary .rating-result > span:before,
body.catalog-product-view .product-info-main .rating-result > span:before,
.rating-result > span:before {
    color: #cda379 !important;
}
body.catalog-product-view .product-reviews-summary .rating-summary .rating-result:before,
body.catalog-product-view .product-info-main .rating-result:before {
    color: #c7c7c7 !important;
}

/* === Unavailable size swatch — keep text fully readable: faded opacity + horizontal
   line-through. Magento's default uses a ::after pseudo-element with diagonal gradient
   that mangles short words like "King". Hide that ::after. */
body.catalog-product-view .swatch-attribute.size .swatch-option.text.disabled,
body.catalog-product-view .swatch-attribute .swatch-option.text.disabled,
body.catalog-product-view .swatch-option.text[aria-disabled="true"],
body.catalog-product-view .swatch-option.text.disabled {
    opacity: 0.6 !important;
    text-decoration: line-through !important;
    color: #999999 !important;
    background-image: none !important;
    cursor: not-allowed !important;
    /* Magento default sets pointer-events:none on disabled swatches, which
       blocks browser hover so the `title` tooltip never fires. Re-enable
       pointer-events; the swatches.js click handler still ignores .disabled
       items so we don't accidentally let users add an OOS variant to cart. */
    pointer-events: auto !important;
}
body.catalog-product-view .swatch-option.text.disabled::after,
body.catalog-product-view .swatch-option.text[aria-disabled="true"]::after,
body.catalog-product-view .swatch-option.disabled::after {
    display: none !important;
    background: none !important;
    content: none !important;
}
/* Custom CSS tooltip on disabled (out-of-stock) swatches. Native browser
   `title` tooltips are unreliable cross-browser/OS — Chrome on macOS often
   suppresses them. Render explicitly via ::before/::after on hover. */
body.catalog-product-view .swatch-option.disabled {
    position: relative !important;
    /* Magento default overflow:hidden clips the ::before tooltip when it
       pops above the swatch. Allow it to escape upward. */
    overflow: visible !important;
}
body.catalog-product-view .swatch-option.disabled:hover::before {
    content: attr(title);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: #01072A;
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 3px;
    white-space: nowrap;
    font-size: 12px;
    font-family: 'Ubuntu', sans-serif;
    line-height: 1.4;
    z-index: 9999;
    pointer-events: none;
    text-decoration: none;
    opacity: 1;
    display: block;
    box-shadow: 0 2px 8px rgba(0,0,0,0.18);
}

/* === Add to Wish List / Add to Compare alignment === */
body.catalog-product-view .product-addto-links .action {
    vertical-align: middle !important;
    line-height: 1.5 !important;
    margin: 0 18px 0 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}
body.catalog-product-view .product-addto-links .action::before {
    line-height: 1 !important;
    vertical-align: middle !important;
}

/* === Gallery — match old site: stage has light-grey #f7f7f7 bg, thumbs are 120x120 #ebebeb,
   thumbnail rail width 145px (120 + 25 padding), stage occupies remaining width.
   Force the shaft/frame to fill the stage width so the image isn't shrunken with grey
   side-bars (fotorama JS otherwise caps shaft maxWidth based on its own aspect logic). */
body.catalog-product-view .fotorama__stage,
body.catalog-product-view .fotorama__stage__frame {
    background: #ffffff !important;
}
/* Force shaft + active frame to fit inside the stage so the active image
   doesn't spill beyond the stage's overflow:hidden boundary. Non-active
   frames are still positioned offscreen via transform, just based on the
   new (smaller) shaft width. */
body.catalog-product-view .fotorama__stage__shaft {
    max-width: 100% !important;
    width: 100% !important;
}
body.catalog-product-view .fotorama__stage__frame {
    max-width: 100% !important;
}
body.catalog-product-view .fotorama__stage__frame.fotorama__active {
    width: 100% !important;
}
body.catalog-product-view .fotorama__img {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}
body.catalog-product-view .fotorama__thumb {
    background: #ebebeb !important;
}
/* Let fotorama JS compute thumb frame dimensions from view.xml (120×120 with
   25px margin). Just style the visual: light grey bg. Don't force outer width. */
body.catalog-product-view .fotorama__nav__frame--thumb .fotorama__thumb {
    background: #ebebeb !important;
}
/* Desktop-only PDP layout (mobile keeps fotorama's native horizontal nav).
   On <768px screens, fotorama auto-switches `.fotorama__nav-wrap--horizontal`
   and our forced flex-row + vertical-nav width:145 would crush stage to 0. */
@media (min-width: 768px) {
body.catalog-product-view .product.media,
body.catalog-product-view .columns .column.main .product.media {
    flex: 0 0 65% !important;
    max-width: 65% !important;
}
body.catalog-product-view .columns .column.main .product-info-main {
    flex: 0 0 31% !important;
    max-width: 31% !important;
}
/* Magento's default fotorama prev/next arrows have rgba(255,255,255,0.3)
   backgrounds (80px wide × stage-tall) that paint as translucent bands
   over the product image's left + right edges. Reset to fully transparent
   so the only visible piece is the arrow glyph (sprite icon) — same as
   old medussahome theme. */
body.catalog-product-view .fotorama__arr,
body.catalog-product-view .fotorama__thumb__arr,
body.catalog-product-view .fotorama__arr--prev,
body.catalog-product-view .fotorama__arr--next {
    background: transparent !important;
    background-color: transparent !important;
}
body.catalog-product-view .fotorama__arr:hover,
body.catalog-product-view .fotorama__thumb__arr:hover {
    background-color: transparent !important;
}
/* Magento cache image has transparent edges (1171×932 source → 720×570 cache
   adds 2-px alpha=0 strip on left + right). The old #f7f7f7 stage background
   showed through those gaps as visible greyish "bands". Switch to white so
   the bleed is invisible against the page background. */
body.catalog-product-view .fotorama__stage,
body.catalog-product-view .fotorama__stage__frame,
body.catalog-product-view .fotorama__wrap,
body.catalog-product-view .fotorama__nav-wrap {
    background: #ffffff !important;
}
body.catalog-product-view .fotorama__wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    position: relative !important;
    overflow: hidden !important;
}
body.catalog-product-view .fotorama__nav-wrap--vertical {
    position: static !important;
    flex: 0 0 145px !important;
    width: 145px !important;
    order: 1 !important;
    align-self: stretch !important;
    overflow: hidden !important;
}
body.catalog-product-view .fotorama__nav-wrap--vertical .fotorama__nav__shaft {
    max-height: 100% !important;
}
body.catalog-product-view .fotorama__stage {
    flex: 1 1 auto !important;
    margin-left: 0 !important;
    width: auto !important;
    /* CRITICAL: fotorama JS inline-styles `left: 145px` assuming nav-wrap is
       absolutely positioned at the left of wrap so stage needs to clear it.
       In our flex layout nav-wrap is static (order:1) and stage flex follows
       (order:2) already — the extra `left:145px` creates a 145-px white gap
       between thumbs and image. Force left:0 to kill it. Same for `position`
       so transform-positioned children compute against the flex box. */
    position: relative !important;
    left: 0 !important;
    order: 2 !important;
    min-width: 0 !important;
    /* Aspect ratio match (720:570 ≈ 1.263) so the active image fills stage with
       no top/bottom grey bars. Browser support: all modern (Chrome 88+). */
    aspect-ratio: 720 / 570 !important;
    height: auto !important;
}
} /* end @media (min-width: 768px) PDP layout */

/* === Forms === */
input[type="text"], input[type="email"], input[type="password"], input[type="search"],
input[type="number"], input[type="tel"], select, textarea {
    border: 1px solid #e2e2e2 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 14px !important;
    padding: 10px 14px !important;
    height: 42px;
    box-shadow: none !important;
}
input:focus, select:focus, textarea:focus { border-color: #01072A !important; outline: none !important; box-shadow: none !important; }

/* === Footer (minimal, light) === */
.page-footer { background: #ffffff !important; border-top: 1px solid #ececec; margin-top: 0 !important; padding: 0 !important; color: #555555 !important; }
.page-footer * { color: inherit; }
.page-footer .footer.content { padding: 0 !important; max-width: none; margin: 0; border-top: none !important; background: #ffffff !important; }
.page-footer .footer.content a { color: #01072A !important; }
.page-footer .footer.content a:hover { color: #E5A435 !important; }
.page-footer .footer.content > ul.footer.links { display: none !important; }
/* Hide Magento dev-mode bug report footer link */
.page-footer .bugs, body > .bugs { display: none !important; }

.page-footer .copyright {
    background: #ffffff !important;
    color: #999999 !important;
    text-align: center;
    padding: 18px 0;
    font-size: 12px;
    border-top: 1px solid #ececec;
}
.page-footer .block.newsletter .field.newsletter input {
    border: 1px solid #d0d0d0 !important;
    color: #555555 !important;
    background: #ffffff !important;
}

/* Custom 4-col footer block — bg transparent (white via body) like old site */
.page-footer .medussa-footer-cols {
    background: transparent !important;
    color: #01072A !important;
    padding: 50px 0 30px 0 !important;
    border-top: 1px solid #ececec;
}
.page-footer .medussa-footer-cols-inner {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 30px !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 30px !important;
}
.page-footer .medussa-footer-cols .footer-col h4 {
    font-family: 'Ubuntu', sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #343434 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    margin: 0 0 40px 0 !important;
    padding-bottom: 0 !important;
    border: none !important;
    position: static;
    display: block;
}
.page-footer .medussa-footer-cols .footer-col h4::after,
.page-footer .medussa-footer-cols .footer-col h4::before { content: none !important; display: none !important; }
.page-footer .medussa-footer-cols .footer-col .footer-subscribe {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
/* footer-subscribe CSS dropped — newsletter signup removed per project decision */
.page-footer .footer-hours { margin-top: 10px; color: #999999 !important; font-size: 14px !important; font-weight: 300 !important; }
.page-footer .footer-subscribe { display: none !important; }
/* Hide Magento default newsletter block at very bottom (we embedded our own in contacts column) */
.page-footer > .footer.content > .block.newsletter,
.page-footer .footer.content .block.newsletter { display: none !important; }
.page-footer .medussa-footer-cols .footer-col {
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
}
.page-footer .medussa-footer-cols .footer-col p,
.page-footer .medussa-footer-cols .footer-col address,
.page-footer .medussa-footer-cols .footer-col span,
.page-footer .medussa-footer-cols .footer-col li {
    color: #999999 !important;
    font-family: 'Ubuntu', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
}
.page-footer .medussa-footer-cols .footer-col a {
    color: #01072A !important;
    font-weight: 300 !important;
    text-transform: none !important;
}
.page-footer .medussa-footer-cols .footer-col a:hover { color: #E5A435 !important; }
.page-footer .medussa-footer-cols .footer-col ul { list-style: none; padding: 0; margin: 0; }
.page-footer .medussa-footer-cols .footer-col ul li { padding: 4px 0; }
.page-footer .medussa-footer-cols .footer-col ul li::before { content: ''; display: none; }
.page-footer .medussa-footer-cols .footer-col a { color: #555555 !important; }
.page-footer .medussa-footer-cols .footer-col a:hover { color: #E5A435 !important; }
.page-footer .medussa-footer-cols address {
    font-style: normal;
    line-height: 1.7;
}

/* === Mini cart === */
.minicart-wrapper .block-minicart { background: #ffffff !important; color: #01072A !important; }
.minicart-wrapper .block-minicart .price { color: #01072A !important; }

/* === Mobile responsive === */
@media (max-width: 991px) {
    /* Header: pull right icon strip back into normal flow, show hamburger toggle */
    .page-header { padding-right: 0 !important; }
    .page-header::after { display: none !important; }
    .page-header .header.content {
        padding: 12px 12px !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        justify-content: space-between !important;
        position: relative !important;
    }
    .page-header .logo { max-width: 200px !important; margin: 0 auto !important; order: 2 !important; }
    .page-header .logo img { max-height: 50px !important; }
    /* Show Magento's native nav-toggle hamburger button */
    .nav-toggle {
        position: absolute !important;
        left: 12px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        display: block !important;
        width: 40px !important;
        height: 40px !important;
        background: transparent !important;
        border: none !important;
        color: #ffffff !important;
        z-index: 10;
    }
    .nav-toggle::before {
        content: '\f0c9' !important;
        font-family: 'FontAwesome' !important;
        font-size: 22px !important;
        color: #ffffff !important;
    }
    /* Nav hidden by default on mobile, revealed when body.nav-open via JS */
    .nav-sections {
        position: fixed !important;
        left: -80% !important;
        right: auto !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 80% !important;
        height: 100vh !important;
        background: #01072A !important;
        z-index: 1000 !important;
        transition: left .3s ease !important;
        overflow-y: auto !important;
    }
    body.nav-open .nav-sections { left: 0 !important; }
    body.nav-open::after {
        content: '';
        position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 999;
    }
    .nav-sections .navigation {
        padding: 60px 0 0 0 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        height: auto !important;
    }
    .navigation > ul {
        flex-direction: column !important;
        width: 100% !important;
    }
    .navigation > ul::after { display: none !important; }
    .navigation .level0 > a.level-top {
        padding: 14px 20px !important;
        font-size: 15px !important;
        width: 100% !important;
        border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    }
    .navigation .level0.parent > a.level-top::after { margin-left: auto !important; }
    /* Right strip: inline top-right icons */
    .medussa-header-icons {
        position: absolute !important;
        right: 8px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: auto !important;
        height: auto !important;
        background: transparent !important;
        flex-direction: row !important;
        padding: 0 !important;
        border: none !important;
        order: 3 !important;
        gap: 4px !important;
    }
    .medussa-header-icons::after { display: none !important; }
    .medussa-header-icons .minicart-wrapper,
    .medussa-header-icons .block-search {
        width: 38px !important;
        height: 38px !important;
        border: none !important;
    }
    .medussa-header-icons .minicart-wrapper .action.showcart::before,
    .medussa-header-icons .block-search .label::before { font-size: 16px !important; }
    .medussa-header-icons .block-search .control {
        position: fixed !important;
        right: 0 !important;
        left: 0 !important;
        top: 60px !important;
        width: 100% !important;
        z-index: 100;
    }
    /* Content layout */
    body.cms-home .medussa-hero,
    .medussa-hero { height: 380px; margin: 0 !important; }
    .medussa-hero .slides .slide .caption .t2 { font-size: 28px !important; }
    .medussa-hero .slides .slide .caption .t1 { font-size: 14px !important; }
    .medussa-hero .slides .slide .caption .t3 { font-size: 13px !important; }
    .medussa-section.medussa-showcases { margin: 0 !important; }
    .medussa-section.medussa-showcases .showcases ul { grid-template-columns: 1fr !important; }
    .medussa-section.medussa-showcases .showcases--text span { font-size: 28px !important; }
    .medussa-section.medussa-add-info { margin: 30px 0 !important; }
    .medussa-section.medussa-add-info .add-info ul { grid-template-columns: repeat(2, 1fr) !important; }
    .medussa-special-grid { grid-template-columns: repeat(3, 1fr) !important; }
    .products-grid .product-items { grid-template-columns: repeat(2, 1fr) !important; }
    .page-footer .medussa-footer-cols-inner { grid-template-columns: 1fr 1fr !important; }
    /* Inner pages: remove right gap */
    body.page-products .page-main,
    body.catalog-product-view .page-main,
    body.checkout-cart-index .page-main,
    body.cms-page-view .page-main,
    body.catalog-category-view .page-main { margin: 0 !important; padding: 16px 0 40px 0 !important; }
    body.catalog-category-view.page-layout-2columns-left .sidebar.sidebar-main { width: 100% !important; padding: 0 16px !important; }
    body.catalog-category-view.page-layout-2columns-left .column.main { width: 100% !important; }
    body.catalog-category-view .products-grid .product-items { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; }
    body.catalog-product-view .product-info-main { width: 100% !important; padding: 0 16px !important; }
    body.catalog-product-view .product.media { width: 100% !important; padding: 0 16px !important; }
}
@media (max-width: 575px) {
    .medussa-hero { height: 280px; }
    .medussa-hero .slides .slide .caption .t2 { font-size: 22px !important; }
    .medussa-section.medussa-showcases .showcases--text span { font-size: 22px !important; }
    .medussa-section.medussa-add-info .add-info ul { grid-template-columns: 1fr !important; }
    .medussa-special-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .page-footer .medussa-footer-cols-inner { grid-template-columns: 1fr !important; }
    body.catalog-category-view .products-grid .product-items { grid-template-columns: 1fr !important; }
}

/* ZH override: replace 'Availability: ' prefix with Chinese '库存: ' */
html[lang^="zh"] body.catalog-product-view .product-info-stock-sku .stock.available::before {
    content: '库存: ' !important;
}
/* Also Product Code label localized via similar CSS prefix pattern if any */