/* tMP Core: vendor storefronts. Sits on top of chrome.css / frame.css / store.css. */
.tmp-nav--store .tmp-nav__logo { gap: 12px; text-decoration: none !important; }
.tmp-nav--store .tmp-nav__logo img { height: 44px !important; max-width: 120px !important; object-fit: contain; transform: none; }
.tmp-nav__store { font-family: var(--sans); font-size: 16px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; white-space: nowrap; }
.tmp-nav--store .tmp-nav__cta { background: transparent !important; color: var(--ink) !important; border-color: rgba(15, 32, 41, 0.3) !important; }
.tmp-nav__back { display: none; }
.tmp-nav--store .tmp-nav__cta:hover { background: rgba(15, 32, 41, 0.05) !important; }
.tmp-foot__storerow { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px 48px; }
.tmp-foot__storerow p { max-width: 420px !important; }
.tmp-foot__storerow p strong { color: var(--ink); font-weight: 600; }
.tmp-foot--store nav { flex-direction: row !important; flex-wrap: wrap; gap: 8px 24px !important; align-items: flex-start; }

.tmp-sf { margin: 0; padding: 0; }
.tmp-sf__body { max-width: 1200px; margin: 0 auto; padding: 0 40px 40px; }

/* hero: the course's own colour, contour lines, soft light */
.tmp-sfh { position: relative; overflow: hidden; color: #fff; background:
	radial-gradient(900px 420px at 88% -10%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 70%),
	radial-gradient(700px 380px at -5% 110%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%),
	var(--ink); }
.tmp-sfh__lines { position: absolute; inset: 0; width: 100%; height: 100%; color: rgba(255, 255, 255, .09); pointer-events: none; }
.tmp-sfh__lines path, .tmp-sfh__lines ellipse { stroke-dasharray: 1600; stroke-dashoffset: 1600; animation: tmp-sfh-draw 2.4s cubic-bezier(.2, .7, .2, 1) forwards; }
.tmp-sfh__lines path:nth-child(2) { animation-delay: .12s; } .tmp-sfh__lines path:nth-child(3) { animation-delay: .24s; } .tmp-sfh__lines path:nth-child(4) { animation-delay: .36s; } .tmp-sfh__lines path:nth-child(5) { animation-delay: .48s; } .tmp-sfh__lines ellipse { animation-delay: .7s; }
@keyframes tmp-sfh-draw { to { stroke-dashoffset: 0; } }
.tmp-sfh__in { position: relative; max-width: 1200px; margin: 0 auto; padding: 72px 40px 112px; display: flex; align-items: center; gap: 36px; }
.tmp-sfh__logo { width: 132px; height: 132px; object-fit: contain; background: #fff; border-radius: 28px; padding: 14px; flex-shrink: 0; box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .12); animation: tmp-sfh-rise .7s cubic-bezier(.2, .7, .2, 1) both; }
.tmp-sfh__copy { animation: tmp-sfh-rise .7s .08s cubic-bezier(.2, .7, .2, 1) both; min-width: 0; }
@keyframes tmp-sfh-rise { from { opacity: 0; transform: translateY(14px); } }
.tmp-sfh__eyebrow { display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 12px !important; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .72) !important; margin: 0 0 12px !important; }
.tmp-sfh__eyebrow span { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 30%, transparent); }
html body.tmp-storefront .tmp-sfh h1 { font-size: clamp(40px, 6vw, 76px) !important; line-height: 1 !important; letter-spacing: -.025em; margin: 0 !important; color: #fff !important; text-wrap: balance; }
.tmp-sfh__lead { font-size: 18px !important; line-height: 1.55 !important; color: rgba(255, 255, 255, .78) !important; max-width: 620px; margin: 16px 0 0 !important; }
.tmp-sfh__meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0 !important; }
.tmp-sfh__meta span { font-size: 13px; font-weight: 500; color: rgba(255, 255, 255, .85); padding: 6px 12px; border-radius: 99px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .14); backdrop-filter: blur(6px); }

/* featured tiles overlap the hero */
.tmp-bento { display: grid; gap: 20px; margin: -64px 0 8px; position: relative; z-index: 2; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); }
.tmp-bento--2 { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.tmp-sf__body > .tmp-sf__group:first-child { margin-top: 48px; }

/* product cards */
.tmp-pcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
.tmp-pc { position: relative; display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; text-decoration: none !important; color: var(--ink) !important; transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s, border-color .35s; }
.tmp-pc:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--ink) 28%, transparent); box-shadow: 0 22px 44px -22px color-mix(in srgb, var(--ink) 45%, transparent); }
.tmp-pc:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.tmp-pc__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--tint); position: relative; }
.tmp-pc__img img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; margin: 0 !important; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.tmp-pc:hover .tmp-pc__img img { transform: scale(1.05); }
.tmp-pc--fit .tmp-pc__img::before { content: ""; position: absolute; inset: -30px; background: var(--tmp-pc-bg) center / cover no-repeat; filter: blur(28px) saturate(1.1); opacity: .55; }
.tmp-pc--fit .tmp-pc__img img { position: relative; object-fit: contain; padding: 14px; box-sizing: border-box; }
.tmp-pc--fit:hover .tmp-pc__img img { transform: scale(1.04); }
.tmp-pc--noimg .tmp-pc__img { background: linear-gradient(135deg, color-mix(in srgb, var(--ink) 92%, #fff), color-mix(in srgb, var(--ink) 70%, var(--accent))); }
.tmp-pc__mono { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--serif); font-size: 72px; color: rgba(255, 255, 255, .85); }
.tmp-pc__body { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px 18px; flex-grow: 1; }
.tmp-pc__tag { align-self: flex-start; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); background: color-mix(in srgb, var(--accent) 30%, #fff); padding: 4px 9px; border-radius: 99px; margin-bottom: 4px; }
.tmp-pc__name { font-family: var(--sans); font-size: 17px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; color: var(--ink); }
.tmp-pc__blurb { font-size: 14.5px; line-height: 1.5; color: var(--ink2); }
.tmp-pc__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 12px; }
.tmp-pc__price { font-size: 15px; font-weight: 500; color: var(--ink2); }
.tmp-pc__price del { opacity: .55; font-weight: 400; margin-right: 4px; } .tmp-pc__price ins { text-decoration: none; }
.tmp-pc__price .subscription-details, .tmp-pc__price small { font-size: 13px; font-weight: 400; color: var(--muted); }
.tmp-pc__go { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; font-size: 13.5px; font-weight: 600; color: var(--ink); padding: 8px 14px; border-radius: 99px; background: var(--tint); transition: background .25s, color .25s; }
.tmp-pc__go svg { transition: transform .25s; }
.tmp-pc:hover .tmp-pc__go { background: var(--ink); color: #fff; } .tmp-pc:hover .tmp-pc__go svg { transform: translateX(3px); }
.tmp-pc.is-out { opacity: .6; }
.tmp-pcs--few { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tmp-pcs--few .tmp-pc { flex-direction: row; min-height: 168px; }
.tmp-pcs--few .tmp-pc__img { aspect-ratio: auto; width: 38%; flex-shrink: 0; }
.tmp-pcs--few .tmp-pc__body { padding: 22px 24px; justify-content: center; }
.tmp-pcs--few .tmp-pc__name { font-size: 19px; }
.tmp-pcs--few .tmp-pc__row { margin-top: 8px; }
.tmp-pc--big { border: 0; box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--ink) 55%, transparent), 0 0 0 1px var(--line); }
.tmp-pc--big .tmp-pc__img { aspect-ratio: auto; height: 240px; }
.tmp-pc--big.tmp-pc--fit .tmp-pc__img img { padding: 18px; }
.tmp-pc--big .tmp-pc__name { font-family: var(--serif); font-weight: 400; font-size: 28px; line-height: 1.1; letter-spacing: -.015em; }
.tmp-pc--big .tmp-pc__body { padding: 22px 24px 22px; }
body.tmp-fonts-clean .tmp-pc--big .tmp-pc__name { font-family: var(--sans); font-weight: 700; font-size: 23px; }

.tmp-sf__group { margin-top: 64px; scroll-margin-top: 150px; }
.tmp-sf__ghead { display: flex; align-items: baseline; gap: 12px; margin: 0 0 22px; }
.tmp-sf__ghead h2 { font-size: clamp(28px, 3vw, 38px) !important; line-height: 1.05 !important; margin: 0 !important; letter-spacing: -.015em; }
.tmp-sf__ghead span { font-family: var(--mono); font-size: 12px; font-weight: 500; color: var(--muted); letter-spacing: .06em; }
.tmp-sf__ghead i { flex-grow: 1; height: 1px; background: var(--line); align-self: center; }
.tmp-sf__ghead a { font-size: 14px; font-weight: 500; color: var(--ink2) !important; text-decoration: none !important; white-space: nowrap; }
.tmp-sf__ghead a:hover { color: var(--ink) !important; text-decoration: underline !important; }
.tmp-sf__empty { padding: 64px 0; color: var(--muted); }
html.tmp-reveal [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .6s cubic-bezier(.2, .7, .2, 1), transform .6s cubic-bezier(.2, .7, .2, 1), box-shadow .35s, border-color .35s; }
html.tmp-reveal [data-reveal].is-in { opacity: 1; transform: none; }
html.tmp-reveal .tmp-pc.is-in:hover { transform: translateY(-4px); transition-delay: 0s !important; }
@media (prefers-reduced-motion: reduce) { .tmp-sfh__lines path, .tmp-sfh__lines ellipse, .tmp-sfh__logo, .tmp-sfh__copy { animation: none; stroke-dashoffset: 0; } .tmp-pc, .tmp-pc__img img { transition: none; } }
body.tmp-storefront-home ul.products { margin-bottom: 0 !important; }
/* second header row: categories. Scrolls sideways, so any number of links fits. */
.tmp-nav__grow { flex-grow: 1; }
.tmp-nav--store .tmp-nav__in { height: 68px; }
.tmp-nav--store .tmp-nav__login { font-size: 14.5px !important; font-weight: 500 !important; color: var(--ink2) !important; text-decoration: none !important; white-space: nowrap; }
.tmp-nav--store .tmp-nav__login:hover { color: var(--ink) !important; }
.tmp-nav--store .tmp-nav__acct { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; background: transparent !important; color: var(--ink) !important; border-color: rgba(15, 32, 41, 0.3) !important; font-weight: 500 !important; }
.tmp-nav--store .tmp-nav__acct:hover { background: rgba(15, 32, 41, 0.05) !important; }
@media (max-width: 940px) { .tmp-nav--store .tmp-nav__acct { display: none !important; } }
.tmp-storebar { border-top: 1px solid var(--line); }
.tmp-storebar__in { max-width: 1200px; margin: 0 auto; padding: 0 40px; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tmp-storebar__in::-webkit-scrollbar { display: none; }
.tmp-storebar a { position: relative; flex-shrink: 0; padding: 13px 14px; font-family: var(--sans); font-size: 14.5px; font-weight: 500; line-height: 1.4; color: var(--ink2) !important; text-decoration: none !important; white-space: nowrap; border-radius: 8px; transition: color .15s; }
.tmp-storebar a:first-child { margin-left: -14px; }
.tmp-storebar a::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px; background: var(--ink); transform: scaleX(0); transition: transform .18s ease; }
.tmp-storebar a:hover { color: var(--ink) !important; }
.tmp-storebar a:hover::after { transform: scaleX(.4); }
.tmp-storebar a.is-on { color: var(--ink) !important; font-weight: 600; }
.tmp-storebar a.is-on::after { transform: scaleX(1); }
body.tmp-storefront-home .tmp-sf__chips { display: none; }
body.tmp-storefront .tmp-sf__group { scroll-margin-top: 140px; }
body.tmp-storefront.woocommerce-checkout form.checkout > #order_review { top: 136px; }
@media (max-width: 940px) {
	.tmp-nav--store .tmp-nav__in { height: 60px; }
	.tmp-storebar__in { padding: 0 20px; }
	.tmp-storebar a { padding: 11px 12px; font-size: 14px; }
	.tmp-storebar a:first-child { margin-left: -12px; }
	.tmp-sf__body { padding: 0 20px 24px; }
	.tmp-sfh__in { padding: 44px 20px 84px; gap: 18px; align-items: flex-start; flex-direction: column; }
	.tmp-sfh__logo { width: 84px; height: 84px; border-radius: 20px; padding: 9px; }
	.tmp-sfh__lead { font-size: 16px !important; }
	.tmp-bento, .tmp-bento--2 { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: -52px -20px 0; padding: 0 20px 28px; scrollbar-width: none; }
	.tmp-bento::-webkit-scrollbar { display: none; }
	.tmp-bento > .tmp-pc { flex: 0 0 82%; scroll-snap-align: center; }
	.tmp-pcs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.tmp-pcs--few { grid-template-columns: minmax(0, 1fr); } .tmp-pcs--few .tmp-pc { min-height: 120px; } .tmp-pcs--few .tmp-pc__body { padding: 14px 16px; } .tmp-pcs--few .tmp-pc__name { font-size: 16px; } .tmp-pcs--few .tmp-pc__row { flex-direction: row; align-items: center; }
	.tmp-pc { border-radius: 14px; } .tmp-pc__body { padding: 12px 14px 14px; } .tmp-pc__name { font-size: 15px; }
	.tmp-pc__row { flex-direction: column; align-items: flex-start; gap: 8px; } .tmp-pc__go { padding: 6px 12px; }
	.tmp-pc--big .tmp-pc__row { flex-direction: row; align-items: center; } .tmp-pc--big .tmp-pc__name { font-size: 24px; }
	.tmp-sf__group { margin-top: 44px; }
	/* phone header: logo, name (shortened with … if long), cart, a short Back pill, menu. Nothing may push the menu off screen. */
	.tmp-nav--store .tmp-nav__in { gap: 10px; }
	.tmp-nav--store .tmp-nav__logo { flex: 1 1 auto; min-width: 0; gap: 10px; }
	.tmp-nav--store .tmp-nav__logo img { height: 38px !important; flex-shrink: 0; }
	.tmp-nav__store { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 15px; }
	.tmp-nav__grow { display: none; }
	.tmp-nav--store .tmp-nav__cart, .tmp-nav--store .tmp-menu { flex-shrink: 0; }
	.tmp-nav--store .tmp-nav__cta { display: inline-flex !important; flex-shrink: 0; padding: 9px 12px !important; font-size: 14px !important; gap: 4px; }
	.tmp-nav__host { display: none; } .tmp-nav__back { display: inline; }
}
