/* Carrelly storefront: full-width campaign and an editorial catalogue. */
:root{--store-ink:#2c211c;--store-sand:#f3efec;--store-rule:#dfd5ce}
body{--dark:var(--store-ink);--muted:#80716a;--line:#e8e0da}
body>header{position:relative;display:grid;grid-template-columns:minmax(80px,1fr) minmax(180px,570px) minmax(110px,1fr);gap:32px;max-width:1440px;min-height:112px;padding-left:40px;padding-right:40px}
body>header .brand{grid-column:1;grid-row:1;justify-self:start}
body>header .search{grid-column:2;grid-row:1;width:100%;margin:0;justify-self:center;border-color:var(--store-rule)}
body>header .cart-button{grid-column:3;grid-row:1;justify-self:end;border:1px solid var(--store-rule);padding:11px 18px;border-radius:30px;background:transparent}
body>#categories{background:var(--store-ink);border:0;gap:32px;padding:0 24px}
body>#categories button{color:#f4eee9;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;border-bottom-width:2px;transition:background .2s,color .2s}
body>#categories button:hover,body>#categories button.active{color:#fff;border-bottom-color:#c6a895}
body>.notice{letter-spacing:1.5px;font-size:10px;text-transform:uppercase}
body>main{padding-top:40px}
.storefront-home>main{padding-top:0}
.storefront-hero{position:relative;isolation:isolate;width:100vw;margin-left:calc(50% - 50vw);margin-bottom:48px;background:#b79a83;overflow:hidden}
.storefront-hero>img{display:block;width:100%;height:var(--section-image-height,clamp(300px,34vw,560px));object-fit:cover;object-position:center}
.hero-shop-link{position:absolute;right:6%;bottom:28px;background:#fff;color:var(--store-ink);padding:13px 22px;font-size:12px;letter-spacing:1px;text-transform:uppercase;display:flex;gap:32px;align-items:center;box-shadow:0 4px 24px #0002}
.hero-shop-link:hover{background:var(--store-sand)}
.storefront-home .catalog-top{padding-bottom:24px;border-bottom:1px solid var(--store-rule);margin-bottom:0}
.catalog-top h1{font-size:clamp(28px,3vw,44px);letter-spacing:-1.3px;font-weight:550;max-width:850px}
.catalog-top .eyebrow,.section-head .eyebrow{color:#9d7763;letter-spacing:3px;font-size:10px}
.catalog-top p{font-size:14px}
.storefront-section-heading{display:flex;align-items:center;gap:25px;padding:8px 0 0}
.storefront-section-heading h2,.section-head h2{font-size:30px;font-weight:550;letter-spacing:-1px;margin:14px 0}
.storefront-section-rule{height:1px;background:var(--store-rule);flex:1}
.results-count{font-size:12px;letter-spacing:.3px;margin:0 0 24px}
.card .visual{border-radius:var(--card-radius,0);background:var(--store-sand)}
.card:has(.course-info) .visual img{object-fit:contain}
.card>.kind{font-size:10px;letter-spacing:1.4px;margin:18px 0 6px;color:#8a7669}
.card h3{font-weight:500;line-height:1.45;margin:3px 0 8px}
.card .product-rating{margin:0 0 12px;min-height:26px}
.card .price{font-weight:650}
.card .availability{font-size:12px}
.card .badge,.card .promotion-badge{border-radius:0}
.card [data-cart-control]>.btn,.card>.btn{border-color:var(--store-rule)}
.card [data-cart-control]>.btn:hover,.card>.btn:hover{border-color:var(--pink);background:var(--soft)}
.catalog-section[data-section-type=courses]{padding-top:35px!important}
.section-head{border-bottom:1px solid var(--store-rule);margin-bottom:25px;padding-bottom:12px}
.section-head>a{font-size:11px;letter-spacing:1.3px;text-transform:uppercase}
.strip{background:var(--store-sand);border:1px solid var(--store-rule);padding:28px 22px;gap:25px;margin-top:40px}
.strip>div{padding-left:20px;border-left:1px solid #d6c8bd}
.strip strong{font-size:13px;letter-spacing:.3px}
.strip span{font-size:12px}
body>footer{border-top:1px solid var(--store-rule)}
body>footer .footer-inner{max-width:1280px;margin:auto}
@media(max-width:720px){body>header{grid-template-columns:1fr 1fr;padding:12px 20px;gap:12px;min-height:0}body>header .brand{grid-column:1;grid-row:1;justify-self:start}body>header .search{grid-column:1/-1;grid-row:2;max-width:none;height:44px}body>header .cart-button{grid-column:2;grid-row:1;padding:9px 14px}body>#categories{gap:0 20px;padding:0 16px}body>#categories button{font-size:10px;letter-spacing:.6px;padding:12px 0}.storefront-hero{margin-bottom:26px}.storefront-hero>img{height:300px;object-position:58% center}.hero-shop-link{right:20px;bottom:20px;font-size:10px;padding:11px 15px;gap:20px}.catalog-top{align-items:start;flex-wrap:wrap;gap:14px}.catalog-top h1{font-size:29px}.catalog-top p{font-size:13px}.sort{font-size:12px;padding:8px}.storefront-section-heading h2,.section-head h2{font-size:25px}.card .kind{font-size:9px}.strip{margin-top:20px;gap:20px}.strip>div{padding-left:14px}.section-head{align-items:end}.section-head>a{font-size:10px;white-space:nowrap}.card h3{line-height:1.4}.card .product-rating{gap:4px}.card .rating-caption{font-size:10px}}
@media(max-width:480px){.strip{grid-template-columns:1fr}.strip>div{width:100%}}

.storefront-home>header{z-index:10;background:linear-gradient(180deg,#21181170,#21181130);color:#fff;border-bottom:1px solid #ffffff30}
.storefront-home>#categories{position:relative;z-index:10;background:#2118114d;border-bottom:1px solid #ffffff30}
.storefront-home>header .search{background:#ffffff20;border-color:#ffffff60;backdrop-filter:blur(8px)}
.storefront-home>header .search input,.storefront-home>header .search span{color:#fff}
.storefront-home>header .search input::placeholder{color:#ffffffe0}
.storefront-home>header .cart-button{color:#fff;border-color:#ffffff70;background:#ffffff10;backdrop-filter:blur(8px)}
.storefront-home .catalog-section[data-section-type=intro]{display:flow-root}
.storefront-home .storefront-hero{margin-top:calc(-1 * var(--store-header-stack,0px))}
.storefront-home .storefront-hero>img{height:var(--section-image-height,clamp(420px,40vw,640px))}
@media(max-width:720px){.storefront-home .storefront-hero>img{height:var(--section-image-height,420px)}}
/* Header and category navigation stay together while scrolling. */
body>header{position:sticky;top:0;z-index:100;transition:background .2s,box-shadow .2s}
body>#categories,.storefront-home>#categories{position:sticky;top:var(--store-header-height,112px);z-index:90;transition:background .2s}
.storefront-home>header{z-index:100}
.storefront-home.header-scrolled>header,.storefront-home.header-scrolled>#categories{background:#2c211cf5;backdrop-filter:blur(12px)}
.header-scrolled>header{box-shadow:0 3px 18px #21181118}
html{scroll-padding-top:calc(var(--store-header-stack,163px) + 16px)}
@media(prefers-reduced-motion:reduce){body>header,body>#categories{transition:none}}
/* Paint the sticky header edge to edge while keeping its contents centered. */
body>header{width:100%;max-width:none;margin-inline:0;padding-inline:max(40px,calc((100% - 1360px)/2))}
@media(max-width:720px){body>header{padding-inline:20px}}
