﻿/* MOGO pure-black Aurum-framework takeover preview
   Goal: preserve the current MOGO product/content system while locking the
   visual shell to the all-black merchandising rhythm seen in the user's
   Aurum Brothers reference recording. */
:root{
  --ab-black:#000;
  --ab-panel:#070707;
  --ab-panel-2:#0b0b0b;
  --ab-text:#f3f3f3;
  --ab-muted:#8d8d8d;
  --ab-muted-2:#b7b7b7;
  --ab-line:#1d1d1d;
  --ab-warm:#c8a46a;
  --ab-max:1600px;
}
html{background:#000;color-scheme:dark}
body,body:not([data-page="index"]){background:#000!important;color:var(--ab-text)!important}
a{color:inherit}
.container{width:min(var(--ab-max),calc(100% - 64px))}
.announcement{display:none!important}
.site-header{height:58px!important;background:#050505!important;border-bottom:1px solid #242424!important;color:#fff;position:sticky;top:0;z-index:90}
.header-row{grid-template-columns:220px 1fr 220px!important;gap:18px!important}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:#fff;min-width:170px}
.brand img{display:none!important}
.brand:before{content:'MOGO';font:17px/1 Georgia,'Times New Roman',serif;letter-spacing:.14em;color:#fff}
.brand:after{content:'EASTERN HANDWORK';font:7px/1.1 Arial,Helvetica,sans-serif;letter-spacing:.18em;color:#767676;white-space:nowrap}
.desktop-nav{gap:30px!important}
.nav-link{color:#d7d7d7!important;font:10px/1.1 Arial,Helvetica,sans-serif!important;letter-spacing:.13em!important;text-transform:uppercase!important;padding:23px 0!important}
.nav-link:hover{color:#B89552!important}
.mega{top:57px!important;background:#070707!important;border:1px solid #242424!important;box-shadow:0 28px 70px rgba(0,0,0,.72)!important;color:#fff!important}
.mega h4{color:#F5E8D0!important}.mega a{color:rgba(245,232,208,.65)!important}.mega a:hover{color:#B89552!important}.mega .feature{background:#0d0d0d!important}.mega .feature img{filter:none}
.header-actions{justify-content:flex-end}.icon-btn{color:#d9d9d9!important}.icon-btn:hover{color:#fff!important}.count-badge{background:#b2915e!important;color:#000!important}

/* HOME */
body[data-page="index"] main{background:#000}
.ab-hero{min-height:640px!important;background:#000!important;color:#fff!important;grid-template-columns:64% 36%!important;border-bottom:1px solid #141414}
.ab-hero-media{min-height:640px!important;background:#000!important;padding:18px 0 18px 3vw!important;align-items:center!important;justify-content:center!important}
.ab-hero-media img{width:min(900px,94%)!important;height:94%!important;object-fit:contain!important}
.ab-hero-copy{background:#000!important;padding:70px 7vw 70px 3vw!important}
.ab-kicker{color:#a78b5e!important;font-size:9px!important;letter-spacing:.18em!important;margin-bottom:18px!important}
.ab-hero-copy h1{font-size:52px!important;color:#fff!important;line-height:1.02!important;margin:0 0 22px!important;max-width:510px}
.ab-hero-copy p{color:#9e9e9e!important;font-size:13px!important;line-height:1.7!important;max-width:440px!important}
.ab-hero-points{font-size:10px!important;color:#b8b8b8!important;gap:8px!important}.ab-hero-points span:before{color:#806a49!important}
.ab-hero .btn,.ab-hero .btn.secondary{border:1px solid #4c4c4c!important;color:#fff!important;background:transparent!important}.ab-hero .btn.primary{background:#fff!important;color:#000!important;border-color:#fff!important}
.ab-section,.ab-white,.ab-black,.ab-video{background:#000!important;color:#fff!important}
.ab-section{padding:64px 0!important}
.ab-section:first-of-type{padding-top:48px!important}
.ab-title-row{margin-bottom:26px!important;justify-content:center!important;position:relative}
.ab-title-row h2,.ab-center-title{font:400 20px/1.15 Arial,Helvetica,sans-serif!important;color:#f0f0f0!important;letter-spacing:.08em!important;text-transform:uppercase!important;text-align:center!important}
.ab-title-row>a{position:absolute;right:0;bottom:2px;color:#777!important;border-color:#555!important;font-size:8px!important;letter-spacing:.14em!important}
.ab-collection-row{grid-template-columns:repeat(6,118px)!important;gap:12px!important;justify-content:center!important;max-width:840px;margin:0 auto}
.ab-collection-row a{color:#d9d9d9!important;font-size:9px!important;letter-spacing:.04em!important}
.ab-collection-row img{height:122px!important;aspect-ratio:1/1!important;background:#080808!important;object-fit:cover!important;margin-bottom:8px!important;border:0!important}
.ab-collection-row span{color:#aaa!important}

.ab-products{grid-template-columns:repeat(4,1fr)!important;gap:1px!important;background:#0b0b0b!important;border-top:1px solid #101010!important;border-left:1px solid #101010!important}
.ab-products .product-card{background:#000!important;border-right:1px solid #101010!important;border-bottom:1px solid #101010!important;padding:0 0 34px!important;min-width:0}
.ab-products .product-image{aspect-ratio:1/1.02!important;background:#000!important;position:relative!important;overflow:hidden!important}
.ab-products .product-image img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important;transition:opacity .28s ease,transform .35s ease!important;background:#000}
.ab-products .product-image img.hover-image{opacity:0!important}
.ab-products .product-card:hover .product-image img.primary-image{opacity:0!important;transform:none!important}
.ab-products .product-card:hover .product-image img.hover-image{opacity:1!important;transform:none!important}
.ab-products .product-info{padding:12px 18px 0!important;text-align:center!important}
.ab-products .product-title{font:400 10px/1.45 Arial,Helvetica,sans-serif!important;color:#ddd!important;letter-spacing:.02em!important}
.ab-products .price{font-size:9px!important;color:#747474!important;margin-top:3px}
.ab-products .badge{top:13px!important;left:14px!important;background:rgba(0,0,0,.62)!important;border:1px solid #876e48!important;color:#c9aa77!important;font-size:7px!important;padding:5px 7px!important}
.ab-products .quick-add,.ab-products .quick-wish{display:none!important}

.ab-editorial{display:grid!important;grid-template-columns:50% 50%!important;min-height:560px!important;background:#000!important;color:#fff!important;border-top:1px solid #151515;border-bottom:1px solid #151515}
.ab-editorial-photo{min-height:560px!important;background:#080808!important}.ab-editorial-photo img{object-fit:cover!important;filter:none!important}
.ab-editorial-copy{background:#000!important;padding:88px 9vw!important}.ab-editorial-copy h2{font-size:44px!important;color:#fff!important}.ab-editorial-copy p{color:#929292!important;font-size:13px!important;line-height:1.7!important}.ab-link-light{color:#ddd!important;border-color:#555!important}
.ab-stone-row{background:#000!important;border:0!important;gap:1px!important}.ab-stone-row a{background:#050505!important;border:1px solid #161616!important;color:#bdbdbd!important;padding:24px 10px!important}.ab-stone-row a:hover{background:#0b0b0b!important;color:#B89552!important}.ab-stone-row b{font-size:9px!important;letter-spacing:.07em!important;text-transform:uppercase!important}.swatch{width:58px!important;height:58px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)!important}
.ab-center-kicker{color:#686868!important;font-size:8px!important}.ab-center-title{margin:8px 0 28px!important}.ab-video-grid{gap:1px!important;background:#0e0e0e!important}.ab-video-grid a{background:#000!important;color:#aaa!important;padding-bottom:20px!important}.ab-video-grid img{filter:none!important;aspect-ratio:4/5!important}.ab-video-grid b{padding:0 14px!important;font:400 9px/1.4 Arial,Helvetica,sans-serif!important;letter-spacing:.05em!important;color:#9a9a9a!important}.ab-video-grid .play{width:42px!important;height:42px!important;background:rgba(0,0,0,.65)!important;color:#fff!important;border:1px solid rgba(255,255,255,.65)!important}
.ab-story{background:#000!important;color:#fff!important;border-top:1px solid #141414}.ab-story-grid{grid-template-columns:43% 57%!important;min-height:620px!important}.ab-story-copy{padding:86px 7vw 86px 0!important}.ab-story-copy h2{font-size:46px!important;color:#fff!important}.ab-story-copy p{color:#8e8e8e!important;font-size:13px!important;line-height:1.8!important}.ab-dark-link{color:#ddd!important;border-color:#555!important}.ab-story-image{background:#070707!important}.ab-story-image img{filter:none!important;object-fit:cover!important}.ab-community{background:#000!important;border-top:1px solid #141414}.ab-community-grid{gap:1px!important;background:#101010!important}.ab-community-grid img{background:#000!important}

/* SECONDARY PAGE SHELL: all black, not white */
body:not([data-page="index"]){background:#000!important;color:#e8e8e8!important}
.page-hero,.story-hero,.custom-hero,.collection-titlebar{background:#000!important;color:#fff!important;border-color:#191919!important}
.page-hero p,.story-hero p,.custom-hero p,.collection-titlebar p{color:#8d8d8d!important}
.utility-page,.product-page,.section,.section.soft,.collection-shell,.checkout-layout,.account-panel,.form-card,.summary-card,.faq-shell,.story-block,.custom-panel{background:#000!important;color:#e8e8e8!important}
.product-image,.gallery-main,.gallery-thumbs,.thumb,.all-collection,.all-collection .media,.editorial-category,.similar-style,.cart-item,.mini-cart-item,.summary-card,.checkout-card,.account-panel,.utility-card,.faq-item,.acc,.notice,.modal,.drawer,.search-drawer,.cart-drawer,.country-drawer{background:#050505!important;color:#e5e5e5!important;border-color:#1c1c1c!important}
.product-image img,.gallery-main img{background:#000!important;object-fit:contain!important}
.product-info,.product-title,.price,.spec-row,.cart-item,.mini-cart-item,.faq-item,.acc{color:#d8d8d8!important}
.muted,.breadcrumbs,.product-count,.page-hero p,.collection-titlebar p,.product-copy p,.spec-row span,.footer p{color:#777!important}
.all-collection,.all-collection .copy,.all-collection h3,.all-collection p{color:#d7d7d7!important}.all-collection{border-color:#171717!important}.all-collection:hover{border-color:#333!important}
.collection-toolbar{border-color:#171717!important}.collection-layout{background:#000!important}.facet-panel{background:#000!important;border-color:#1b1b1b!important}.facet-group,.facet-row{border-color:#171717!important}
.select,.input,input,textarea,select{background:#080808!important;color:#ddd!important;border-color:#262626!important}input::placeholder,textarea::placeholder{color:#5f5f5f!important}
.btn,.btn.secondary{background:transparent!important;color:#ddd!important;border-color:#3b3b3b!important}.btn.primary{background:#fff!important;color:#000!important;border-color:#fff!important}.btn.light{border-color:#aaa!important;color:#fff!important}
.badge{background:transparent!important;border:1px solid #876e48!important;color:#c9aa77!important}
.quick-add,.quick-wish{background:#090909!important;color:#ddd!important;border-color:#262626!important}
.drawer,.search-drawer,.cart-drawer,.country-drawer{box-shadow:-30px 0 80px rgba(0,0,0,.7)!important}.overlay{background:rgba(0,0,0,.78)!important}
.footer{background:#000!important;border-top:1px solid #181818!important}.footer-grid{color:#ddd!important}.footer h4{color:#F5E8D0!important}.footer a{color:rgba(245,232,208,.65)!important}.footer a:hover{color:#B89552!important}.footer-bottom{border-color:#171717!important;color:#555!important}
.footer-brand:before{color:#fff!important}.country-btn{background:#070707!important;color:#999!important;border-color:#222!important}
hr,.line{border-color:#171717!important;background:#171717!important}

@media(max-width:1100px){
 .header-row{grid-template-columns:180px 1fr 180px!important}.desktop-nav{gap:18px!important}.ab-hero{grid-template-columns:60% 40%!important}.ab-collection-row{grid-template-columns:repeat(6,105px)!important}.ab-products{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:760px){
 .container{width:calc(100% - 24px)!important}.site-header{height:56px!important}.header-row{grid-template-columns:1fr auto!important}.desktop-nav{display:none!important}.brand:after{display:none}.mobile-toggle{display:inline-grid!important;place-items:center!important}.ab-hero{grid-template-columns:1fr!important;min-height:0!important}.ab-hero-media{grid-column:1!important;grid-row:1!important;min-height:430px!important;padding:8px 8px 0!important}.ab-hero-copy{grid-column:1!important;grid-row:2!important;padding:36px 22px 50px!important}.ab-hero-copy h1{font-size:38px!important}.ab-section{padding:44px 0!important}.ab-title-row{justify-content:center!important}.ab-title-row>a{display:none!important}.ab-collection-row{display:flex!important;justify-content:flex-start!important;overflow:auto!important;gap:8px!important;padding-bottom:4px!important}.ab-collection-row a{min-width:112px!important}.ab-collection-row img{height:112px!important}.ab-products{grid-template-columns:repeat(2,1fr)!important}.ab-products .product-info{padding:10px 8px 0!important}.ab-editorial{grid-template-columns:1fr!important}.ab-editorial-photo{min-height:420px!important}.ab-editorial-copy{padding:48px 22px!important}.ab-editorial-copy h2{font-size:38px!important}.ab-stone-row{grid-template-columns:repeat(3,1fr)!important}.ab-video-grid{display:flex!important;overflow:auto!important;gap:1px!important}.ab-video-grid a{min-width:78vw!important}.ab-story-grid{grid-template-columns:1fr!important;min-height:0!important}.ab-story-copy{padding:48px 6px!important}.ab-story-image{height:430px!important}.footer-grid{grid-template-columns:1fr 1fr!important}
}


/* MOGO-SAFE-HEADER-SEARCH-V1-START */

/* =========================================================
   HEADER
   Keep existing DOM:
   brand / desktop-nav / header-actions
   ========================================================= */

.brand{
    background-image:url("../images/mogo-seal-header.png")!important;
    background-repeat:no-repeat!important;
    background-position:left center!important;
    background-size:20px 20px!important;

    padding-left:28px!important;

    gap:9px!important;
}

/* Preserve the small refined typography already approved */
.brand:before{
    font-size:15px!important;
    letter-spacing:.18em!important;
}

.brand:after{
    font-size:6px!important;
    letter-spacing:.18em!important;
    color:#5f5f5f!important;
}

/* Do not change the navigation structure */
.desktop-nav{
    gap:27px!important;
}

.nav-link{
    font-size:8px!important;
    letter-spacing:.17em!important;
}

/* Keep right-side group restrained */
.header-actions{
    gap:12px!important;
}

.icon-btn{
    font-size:14px!important;
    opacity:.82!important;
}


/* =========================================================
   HORIZONTAL SEARCH
   ========================================================= */

#ui-layer .mogo-search-strip{
    position:fixed!important;

    left:0!important;
    right:0!important;

    width:100%!important;

    z-index:140!important;

    background:#111!important;

    border-top:1px solid #242424!important;
    border-bottom:1px solid #242424!important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.38)!important;
}


#ui-layer .mogo-search-inner{
    height:58px!important;

    display:grid!important;

    grid-template-columns:
        18px
        minmax(0,1fr)
        30px!important;

    align-items:center!important;

    gap:14px!important;

    padding:0 32px!important;
}


#ui-layer .mogo-search-leading{
    width:18px!important;
    height:18px!important;

    display:grid!important;
    place-items:center!important;

    color:#d7d7d7!important;

    font-size:16px!important;
}


#ui-layer .mogo-search-input{
    width:100%!important;
    height:58px!important;

    margin:0!important;
    padding:0!important;

    border:0!important;
    outline:0!important;

    background:transparent!important;
    color:#f1f1f1!important;

    box-shadow:none!important;

    font:
        400 14px/58px
        Arial,
        Helvetica,
        sans-serif!important;
}


#ui-layer .mogo-search-input::placeholder{
    color:#777!important;
    opacity:1!important;
}


#ui-layer .mogo-search-input::-webkit-search-cancel-button{
    display:none!important;
}


#ui-layer .mogo-search-close{
    width:30px!important;
    height:40px!important;

    margin:0!important;
    padding:0!important;

    border:0!important;

    background:transparent!important;
    color:#d7d7d7!important;

    font:
        300 25px/1
        Arial,
        sans-serif!important;

    cursor:pointer!important;
}


#ui-layer .mogo-search-results{
    max-height:420px!important;

    overflow:auto!important;

    padding:
        0 32px 18px!important;

    background:#080808!important;

    border-bottom:
        1px solid #1c1c1c!important;
}


#ui-layer .mogo-search-results:empty{
    display:none!important;
}


@media(max-width:760px){

    .brand{
        background-size:18px 18px!important;

        padding-left:24px!important;

        gap:7px!important;
    }

    .brand:after{
        display:none!important;
    }

    #ui-layer .mogo-search-inner{
        height:54px!important;

        padding:
            0 16px!important;
    }

    #ui-layer .mogo-search-input{
        height:54px!important;

        line-height:54px!important;
    }

    #ui-layer .mogo-search-results{
        padding-left:16px!important;
        padding-right:16px!important;
    }
}

/* MOGO-SAFE-HEADER-SEARCH-V1-END */


/* MOGO-HEADER-ICONS-GLOBAL-PRO-START */

/*
   全局 Header 图标区修正
   只改视觉排列，不改结构 / HTML / JS
*/

/* 右侧整组：统一一条水平线 */
#site-chrome .header-actions,
.site-header .header-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:18px!important;
    white-space:nowrap!important;
}

/* 每个直接子项不拉伸 */
#site-chrome .header-actions > *,
.site-header .header-actions > *{
    flex:0 0 auto!important;
}

/* 菜单按钮 + 普通图标按钮：统一占位盒 */
#site-chrome .header-actions .menu-toggle,
#site-chrome .header-actions .icon-btn,
.site-header .header-actions .menu-toggle,
.site-header .header-actions .icon-btn{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    height:30px!important;

    padding:0!important;
    margin:0!important;

    border:0!important;
    background:transparent!important;
    color:#f2f2f2!important;

    line-height:1!important;
    text-decoration:none!important;
    vertical-align:middle!important;
    box-sizing:border-box!important;
}

/* 菜单图标与后面一组稍微留一点呼吸感 */
#site-chrome .header-actions .menu-toggle,
.site-header .header-actions .menu-toggle{
    margin-right:4px!important;
}

/* 图标本体统一大小 */
#site-chrome .header-actions .menu-toggle svg,
#site-chrome .header-actions .icon-btn svg,
#site-chrome .header-actions .menu-toggle i,
#site-chrome .header-actions .icon-btn i,
#site-chrome .header-actions .menu-toggle .icon,
#site-chrome .header-actions .icon-btn .icon,
.site-header .header-actions .menu-toggle svg,
.site-header .header-actions .icon-btn svg,
.site-header .header-actions .menu-toggle i,
.site-header .header-actions .icon-btn i,
.site-header .header-actions .menu-toggle .icon,
.site-header .header-actions .icon-btn .icon{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    min-height:20px!important;

    display:block!important;
    margin:0!important;
    padding:0!important;

    line-height:1!important;
    vertical-align:middle!important;
    box-sizing:border-box!important;
}

/* 如果是线性 SVG，统一笔画感 */
#site-chrome .header-actions svg,
.site-header .header-actions svg{
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
}

/* 某些 unicode / 字体图标补一点视觉微调 */
#site-chrome #search-action,
.site-header #search-action{
    transform:translateY(0)!important;
}

#site-chrome .account-action,
.site-header .account-action{
    transform:translateY(0)!important;
}

#site-chrome .wishlist-action,
.site-header .wishlist-action{
    transform:translateY(0)!important;
}

#site-chrome .country-action,
.site-header .country-action{
    transform:translateY(0)!important;
}

#site-chrome #cart-action,
.site-header #cart-action{
    transform:translateY(0)!important;
}

/* 收藏 / 购物袋数字角标统一 */
#site-chrome .header-actions .count-badge,
.site-header .header-actions .count-badge{
    position:absolute!important;
    top:-6px!important;
    right:-7px!important;

    min-width:18px!important;
    height:18px!important;

    padding:0 5px!important;
    margin:0!important;

    display:grid!important;
    place-items:center!important;

    border-radius:999px!important;
    background:#b89662!important;
    color:#0b0b0b!important;

    font-family:Arial,sans-serif!important;
    font-size:11px!important;
    font-weight:600!important;
    line-height:18px!important;

    z-index:5!important;
}

/* 小屏幕下略微紧一点，避免挤 */
@media(max-width:1200px){
    #site-chrome .header-actions,
    .site-header .header-actions{
        gap:15px!important;
    }
}

@media(max-width:980px){
    #site-chrome .header-actions,
    .site-header .header-actions{
        gap:12px!important;
    }

    #site-chrome .header-actions .menu-toggle,
    #site-chrome .header-actions .icon-btn,
    .site-header .header-actions .menu-toggle,
    .site-header .header-actions .icon-btn{
        width:28px!important;
        min-width:28px!important;
        max-width:28px!important;
        height:28px!important;
    }

    #site-chrome .header-actions .menu-toggle svg,
    #site-chrome .header-actions .icon-btn svg,
    #site-chrome .header-actions .menu-toggle i,
    #site-chrome .header-actions .icon-btn i,
    #site-chrome .header-actions .menu-toggle .icon,
    #site-chrome .header-actions .icon-btn .icon,
    .site-header .header-actions .menu-toggle svg,
    .site-header .header-actions .icon-btn svg,
    .site-header .header-actions .menu-toggle i,
    .site-header .header-actions .icon-btn i,
    .site-header .header-actions .menu-toggle .icon,
    .site-header .header-actions .icon-btn .icon{
        width:18px!important;
        height:18px!important;
        min-width:18px!important;
        min-height:18px!important;
    }
}

/* MOGO-HEADER-ICONS-GLOBAL-PRO-END */
