/* IBAO homepage merchandising, using the existing type and colour system. */
.announcement{height:auto;min-height:42px;background:#f4f6fa;color:#4f5b73;font-size:12px;letter-spacing:0}
.announcement-inner{min-height:42px;gap:18px}
.utility-links,.utility-account{display:flex;align-items:center;gap:27px}
.utility-links{margin-left:auto}
.utility-links a,.utility-account a{white-space:nowrap}
.utility-links a:hover,.utility-account a:hover{color:var(--blue)}
.utility-account{margin-left:25px;gap:24px}
.utility-account a{display:flex;align-items:center;gap:7px;font-weight:600}
.utility-account .ibao-icon{width:17px;height:17px;stroke:currentColor}
.utility-locale{font-size:11px;white-space:nowrap}
.header-main{height:88px;gap:32px}
.header-search{margin-left:auto;max-width:670px}
.header-actions{gap:0}
.header-actions .account-button,.header-separator{display:none}
.cart-button{display:flex;align-items:center;justify-content:center;gap:13px;min-width:126px;width:auto;height:48px;padding:0 16px;background:#edf2ff;border:1px solid #dce5fb;border-radius:8px;color:#1b2b50}
.cart-button:hover{border-color:#a9bffa;color:var(--blue)}
.cart-button>.ibao-icon{width:23px;height:23px}
.cart-label{display:grid;gap:2px;text-align:left;line-height:1.1}
.cart-label strong{font-size:12px;font-weight:600}
.cart-label small{font-size:9px;color:#6d7891;white-space:nowrap}
.cart-button .cart-count{position:static;width:auto;min-width:19px;height:19px;line-height:19px;padding:0 3px;border:0;font-size:9px}
.header-nav{background:#fff}
.carousel-controls[hidden]{display:none}
.hero-slide-photo{display:flex;align-items:center;isolation:isolate;min-height:440px;background:#eef3fc}
.hero-slide-photo .hero-photo{position:absolute;inset:0;z-index:-2;background-position:center;background-repeat:no-repeat;background-size:cover}
.hero-slide-photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(246,249,255,.94),rgba(246,249,255,.78) 42%,rgba(246,249,255,.13) 77%)}
.hero-slide-photo .hero-content{max-width:min(60%,560px);padding:50px 35px 72px 48px}
.hero-slide-photo .hero-title{font-size:clamp(29px,2.8vw,46px);line-height:1.18;white-space:normal;max-width:11em}
.hero-slide-photo .hero-description{max-width:31em}
.hero-slide-default:nth-child(2){background:linear-gradient(110deg,#f3f0e8,#f7f4ee 55%,#edf1fa)}
.hero-slide-default:nth-child(3){background:linear-gradient(110deg,#edf1f8,#f1f4fa 55%,#e7edf8)}
.hero-slide-default .hero-title{white-space:normal;max-width:12em}
.collections{grid-template-columns:repeat(3,minmax(0,1fr))}
.collection-background{background-color:#edf3fc;background-repeat:no-repeat;background-position:center;background-size:cover;isolation:isolate}
.collection-background::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(250,252,255,.98),rgba(250,252,255,.84) 45%,rgba(250,252,255,.04) 90%)}
.collection-default{background-position:right center;background-size:auto 92%}
.collection-default:nth-child(2){background-color:#f5f3ee}
.collection-default:nth-child(3){background-color:#f1f3f6}
.collection-uploaded{background-position:center;background-size:cover}
.collection-copy{max-width:65%}
.collection-background h2{overflow-wrap:anywhere}
.collection-background:hover{background-size:cover}
.collection-default:hover{background-size:auto 92%}
.home-products-section{margin-top:54px;margin-bottom:54px}
.home-products-section+.home-products-section{margin-top:0}
.home-products-section .section-heading h2{font-size:30px}
.home-category-nav{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:22px}
.home-category-nav>span{font-size:10px;color:var(--muted);white-space:nowrap}
.home-category-nav .catalog-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.home-category-nav .catalog-tabs a{display:inline-flex;align-items:center;min-height:32px;padding:6px 11px;border-radius:6px;color:#5f6980;font-size:10px}
.home-category-nav .catalog-tabs a:hover{color:var(--blue);background:#edf2ff}
.home-product-grid{grid-template-columns:repeat(var(--ibao-columns,4),minmax(0,1fr))}
.home-product-grid .product-card{background:#fff}
.home-product-grid.is-list{display:flex;flex-direction:column;gap:12px}
.home-product-grid.is-list .product-card{display:grid;grid-template-columns:170px minmax(0,1fr);align-items:stretch}
.home-product-grid.is-list .product-image-wrap{min-width:0}
.home-product-grid.is-list .product-image{height:100%;min-height:170px;aspect-ratio:auto}
.home-product-grid.is-list .product-info{padding:18px 21px}
.home-product-grid.is-list .product-info h3{min-height:0;margin-bottom:8px}
.home-product-grid.is-list .product-login{width:fit-content;margin:12px 0 0;padding:0;background:none}
.home-products-empty{padding:35px 24px;background:#f7f9fd;border:1px solid var(--line);border-radius:12px;color:var(--muted);font-size:12px}
@media(max-width:1250px){
  .utility-links,.utility-account{gap:16px}.utility-account{margin-left:8px}
  .header-main{gap:21px}.hero-slide-photo .hero-content{padding-left:36px}
  .home-product-grid{grid-template-columns:repeat(min(4,var(--ibao-columns,4)),minmax(0,1fr))}
}
@media(max-width:1000px){
  .announcement{font-size:10px}.utility-links{margin-left:0}.utility-account{margin-left:auto}
  .utility-links a:nth-child(n+3){display:none}
  .header-main{height:83px}.header-actions .account-button{display:flex;margin-right:12px}.cart-button{min-width:0;width:40px;height:40px;padding:0}
  .cart-label{display:none}.cart-button .cart-count{position:absolute;top:-6px;right:-5px}
  .hero-slide-photo .hero-content{max-width:67%}
  .home-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .announcement{min-height:30px}.announcement-inner{min-height:30px;justify-content:center}
  .utility-account{display:none}.utility-links{gap:18px}
  .header-main{height:116px}.header-actions .account-button{margin-right:0}
  .cart-button{width:28px;height:28px;border:0;background:transparent;padding:0}
  .cart-button .cart-count{top:-5px;right:-7px}
  .hero-slide-photo{min-height:355px;align-items:flex-start}
  .hero-slide-photo::before{background:linear-gradient(180deg,rgba(247,249,255,.94),rgba(247,249,255,.8) 62%,rgba(247,249,255,.2))}
  .hero-slide-photo .hero-content{max-width:100%;min-height:355px;padding:27px 23px 74px}
  .hero-slide-photo .hero-title{font-size:32px;max-width:11em}
  .hero-slide-photo .hero-description{font-size:11px;max-width:31em}
  .collections{grid-template-columns:1fr;gap:12px}
  .collection-background{min-height:170px}
  .collection-copy{max-width:65%}
  .home-products-section{margin-top:35px;margin-bottom:35px}
  .home-products-section .section-heading h2{font-size:23px}
  .home-category-nav{display:block;overflow:hidden}
  .home-category-nav>span{display:block;margin-bottom:8px}
  .home-category-nav .catalog-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .home-category-nav .catalog-tabs a{flex:none}
  .home-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .home-product-grid.is-list .product-card{grid-template-columns:102px minmax(0,1fr)}
  .home-product-grid.is-list .product-image{min-height:118px}
  .home-product-grid.is-list .product-info{padding:10px 12px}
  .home-product-grid.is-list .product-info h3{font-size:11px;line-height:1.4}
  .home-product-grid.is-list .product-category{font-size:8px;margin-bottom:5px}
  .home-product-grid.is-list .ibao-product-price{font-size:11px}
  .home-product-grid.is-list .product-login{font-size:8px}
}

/* The light utility strip and open white brand bar follow the reference site's rhythm. */
.announcement{background:#f1f2f4;color:#535b69}
.announcement-inner{min-height:44px}
.utility-links{gap:30px}
.utility-account{gap:24px}
.site-header{box-shadow:0 1px 0 rgba(21,28,44,.04)}
.header-main{height:132px;gap:24px}
.header-brand{display:block;flex:none;line-height:0}
.header-brand-crop{display:block;width:285px;background:#fff}
.header-brand-crop img{display:block;width:100%;height:auto;max-width:none}
.header-actions{margin-left:auto;gap:12px;flex:none}
.header-menu-button{display:grid;flex:none;width:42px;height:42px;border:1px solid #e4e8ef;border-radius:7px;color:#4c5a70}
.header-menu-button:hover,.header-search-disclosure>summary:hover{background:#f5f7fb;color:var(--blue)}
.header-menu-button .ibao-icon{width:20px;height:20px}
.header-search-disclosure{position:relative;z-index:70;flex:none}
.header-search-disclosure>summary{display:grid;place-items:center;width:42px;height:42px;cursor:pointer;list-style:none;border:1px solid #e4e8ef;border-radius:7px;color:#4c5a70}
.header-search-disclosure>summary::-webkit-details-marker{display:none}
.header-search-disclosure>summary .ibao-icon{width:20px;height:20px}
.header-search-disclosure[open]>summary{background:#eef3ff;color:var(--blue);border-color:#cbd8fb}
.header-search{position:absolute;right:0;top:calc(100% + 12px);width:min(440px,calc(100vw - 32px));max-width:none;height:54px;margin:0;background:#fff;border-color:#dfe5f0;box-shadow:0 18px 40px rgba(21,36,65,.15)}
.header-account-mobile{display:none}
.header-separator{display:block;height:32px;margin:0 5px}
.cart-button{min-width:0;width:auto;height:auto;padding:0;gap:11px;border:0;background:transparent;color:#34415a}
.cart-button:hover{border:0;background:transparent;color:var(--blue)}
.cart-button .cart-label{order:1;min-width:65px;gap:3px}
.cart-button .cart-label strong{font-size:13px;font-weight:500}
.cart-button .cart-label small{font-size:12px;font-weight:600;color:#273249}
.cart-button .cart-count{order:2;position:static;min-width:27px;height:27px;line-height:27px;padding:0 5px;background:#f0f1f3;color:#626b7a;border:0;border-radius:50%;font-size:11px}
.cart-button>.ibao-icon{order:3;width:27px;height:27px;box-sizing:content-box;padding:16px;border-radius:6px;background:#f28c00;color:#fff;stroke-width:1.85}
.cart-button:hover>.ibao-icon{background:#d97700;color:#fff}
@media(max-width:1250px){
  .header-main{height:126px}
  .header-brand-crop{width:265px}
}
@media(max-width:1000px){
  .header-main{height:116px}
  .header-brand-crop{width:245px}
  .header-actions{gap:8px}
  .cart-button .cart-label{display:none}
  .cart-button .cart-count{position:absolute;top:-5px;right:-5px;order:4;min-width:20px;height:20px;line-height:20px;font-size:9px}
  .cart-button>.ibao-icon{padding:10px;width:22px;height:22px}
}
@media(max-width:760px){
  .announcement-inner{min-height:34px;justify-content:space-between}
  .utility-links{min-width:0;overflow:hidden;gap:16px}
  .utility-account{display:flex;margin-left:auto}
  .utility-account>a{display:none}
  .header-main{position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 40px;align-items:center;row-gap:7px;height:auto;padding:10px 0 12px}
  .header-brand{grid-row:1;justify-self:center;width:min(310px,100%)}
  .header-brand-crop{width:100%}
  .header-actions{grid-row:2;justify-self:stretch;justify-content:flex-end;margin:0;gap:8px}
  .header-menu-button{margin-right:auto}
  .header-menu-button,.header-search-disclosure>summary,.header-account-mobile{width:38px;height:38px}
  .header-search-disclosure{position:static}
  .header-search{right:0;left:0;top:calc(100% - 1px);width:100%;height:50px}
  .header-account-mobile{display:grid;place-items:center;color:#4c5a70}
  .header-account-mobile .ibao-icon{width:21px;height:21px}
  .header-separator{display:none}
  .cart-button{width:38px;height:38px;border:0;background:transparent}
  .cart-button>.ibao-icon{width:21px;height:21px;padding:9px;border-radius:5px}
  .cart-button .cart-count{top:-6px;right:-7px;background:#f0f1f3;color:#4c586a;border:1px solid #fff}
}