/* 99SEEDS homepage v3. Sizes and spacing are measured from the reference at 1920 × 1080 and 390 × 844;
   everything sits in its 1520 px container (--h-pad is the outer margin, see seeds-v3.css). */

.home .site-content > .ast-container, .home #content > .ast-container { display: block !important; max-width: none !important; padding: 0 !important; }
.h-home { overflow-x: clip; }
.h-section-title { font-size: clamp(30px, 4.4vw, 60px); line-height: 1.3; text-align: center; }
.h-home .h-section-title { margin: 0; } /* Astra gives every h2 a bottom margin */
.h-home .h-section-lead { max-width: 800px; margin: 24px auto 0; font-size: 18px; line-height: 1.32; text-align: center; }
.h-home p { margin-top: 0; }

/* ---------- Hero slideshow ---------- */
/* 728 px = the reference's 765 px hero minus the announcement bar that overlaps it there. */
.h-hero { position: relative; display: grid; min-height: 728px; overflow: hidden; }
.h-slide {
	grid-area: 1 / 1; position: relative; display: flex; background: var(--slide-bg); opacity: 0; visibility: hidden;
	transition: opacity .6s ease, visibility 0s .6s;
}
.h-slide.is-active { opacity: 1; visibility: visible; transition: opacity .6s ease, visibility 0s; z-index: 1; }
.h-slide__inner { position: relative; display: flex; align-items: center; width: 100%; padding: var(--h-head-h) var(--h-pad) 64px; }
.h-slide__copy { position: relative; z-index: 2; width: 680px; max-width: 48%; }
.h-slide__title { font-size: clamp(55px, 8vw, 110px); line-height: 1; }
.h-slide__lead { margin: 24px 0 0 !important; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.333; }
.h-slide__ctas { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 37px; }
.h-slide__art { position: absolute; z-index: 1; top: var(--h-head-h); bottom: 40px; left: max(calc(var(--h-pad) + 640px), 50%); right: var(--h-pad); }
.h-scene { display: block; width: 100%; height: 100%; }
.h-hero__badge { position: absolute; z-index: 2; width: clamp(78px, 6.6vw, 116px); height: auto; }
.h-hero__badge--1 { left: 6%; top: 14%; transform: rotate(-8deg); }
.h-hero__badge--2 { right: 3%; bottom: 14%; transform: rotate(8deg); }
.h-hero__controls { position: absolute; z-index: 3; left: var(--h-pad); bottom: 32px; display: flex; align-items: center; gap: 12px; }
.h-hero__controls .h-round { width: 24px; height: 24px; }
.h-hero__controls .h-arrow { width: 16px; height: 16px; }
.h-dots { display: flex; gap: 8px; padding: 0 4px; }
.h-dot { width: 20px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: rgba(0, 0, 0, .15); cursor: pointer; transition: background .3s; }
.h-dot.is-active { background: rgba(0, 0, 0, .55); }
@media (min-width: 1000px) and (max-width: 1299px) {
	.h-slide__copy { max-width: 46%; }
	.h-slide__art { left: 50%; }
}

@media (max-width: 999px) {
	/* Phone: copy on top, artwork below it, controls on a beige strip under the slide. */
	.h-hero { min-height: 800px; }
	.h-slide__inner { flex-direction: column; justify-content: flex-start; padding: calc(var(--h-head-h) + 22px) var(--h-pad) 86px; text-align: center; }
	.h-slide__copy { display: grid; justify-items: center; width: 100%; max-width: 350px; }
	.h-slide__title { font-size: 55px; }
	.h-slide__lead { margin: 16px 0 0 !important; font-size: 18px; line-height: 1.22; }
	.h-slide__ctas { justify-content: center; gap: 12px; margin-top: 24px; }
	.h-slide__ctas .h-btn { min-height: 50px; padding: 16px 32px; font-size: 14px; }
	.h-slide__art { left: 0; right: 0; top: auto; bottom: 92px; height: min(290px, 74vw); }
	.h-hero__badge { width: 74px; }
	.h-hero__badge--1 { left: 4%; top: 4%; }
	.h-hero__badge--2 { right: 4%; bottom: 6%; }
	.h-hero__controls { left: 0; right: 0; bottom: 0; justify-content: center; height: 86px; padding: 32px 20px 30px; background: var(--h-beige); }
}

/* ---------- Rating bar ---------- */
.h-ratingbar { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 43px; padding: 7px var(--h-pad); background: #000; color: #fff; font-size: 14px; }
.h-ratingbar__label { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.h-ratingbar__mark { width: 20px; height: 20px; }
.h-ratingbar .h-stars { --size: 20px; color: #fff; }
@media (max-width: 999px) {
	.h-ratingbar { min-height: 40px; gap: 8px; font-size: 12.5px; white-space: nowrap; }
	.h-ratingbar__label { display: none; }
	.h-ratingbar .h-stars { --size: 15px; }
}

/* ---------- Featured tabs + product carousel ---------- */
.h-featured { padding: 64px 0; background: var(--h-beige); }
.h-tabs { display: flex; gap: 54px; width: fit-content; max-width: min(1000px, calc(100% - 2 * var(--h-pad))); margin: 0 auto 48px; overflow-x: auto; scrollbar-width: none; }
.h-tabs::-webkit-scrollbar { display: none; }
.h-tab {
	position: relative; flex: none; padding: 0 0 13px; border: 0; background: none; cursor: pointer; font: 700 26px/1.3 var(--h-font); color: #000; text-transform: none; letter-spacing: 0;
	transition: opacity .25s ease-in-out;
}
/* One continuous lilac rule under the whole row; the active tab draws black over it. */
.h-tab::after { content: ""; position: absolute; left: -27px; right: -27px; bottom: 0; height: 3px; background: #B7AAF0; }
.h-tab:first-child::after { left: 0; }
.h-tab:last-child::after { right: 0; }
.h-tab::before { content: ""; position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 3px; background: #000; transform: scaleX(0); transform-origin: left; transition: transform .35s var(--h-ease); }
.h-tab.is-active::before { transform: scaleX(1); }
.h-tab:not(.is-active):hover { opacity: .7; }
.h-panel[hidden] { display: none; }
.h-panel:not([hidden]) .h-card { animation: h-panel-in .5s var(--h-ease) both; }
@keyframes h-panel-in { from { opacity: 0; transform: translateY(16px); } }
.h-carousel { position: relative; }
/* Four cards fill the container minus a 28 px inset each side; the scroller clips right there, so the fifth card stays out of view. */
.h-carousel__track {
	display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 20px) / 4); gap: 20px;
	margin: 0 calc(var(--h-pad) + 28px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain;
}
.h-carousel__track::-webkit-scrollbar { display: none; }
.h-carousel__track > * { scroll-snap-align: start; }
.h-carousel__prev, .h-carousel__next { position: absolute; z-index: 3; top: calc(50% - 22px); }
.h-carousel__prev { left: calc(var(--h-pad) + 6px); }
.h-carousel__next { right: calc(var(--h-pad) + 6px); }
.h-carousel__prev[disabled], .h-carousel__next[disabled] { opacity: 0; pointer-events: none; }

.h-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 16px; background: #fff; }
.h-card__media { position: relative; display: block; aspect-ratio: 5 / 6; background: #000; overflow: hidden; }
/* Product pictures: the first product photo fills the frame. Cards use 5:6, the format most
   product photos (and the breeders' own files) already have, so they show uncropped; square
   photos lose a little on the sides. */
.h-card__photo, .h-tile__photo { position: absolute; inset: 0; display: block; background: #000; }
.h-card__photo img, .h-tile__photo img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; }
.h-card__media::after { content: ""; position: absolute; inset: auto 0 0; z-index: 2; height: 64px; background: linear-gradient(transparent, rgba(0, 0, 0, .55)); pointer-events: none; }
.h-card__badge { position: absolute; z-index: 3; top: 16px; right: 16px; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: #000; color: #fff; font: 700 11px/1.05 var(--h-font); text-align: center; }
.h-card__rating { position: absolute; z-index: 3; left: 0; right: 0; bottom: 16px; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 11px; font-weight: 500; color: #fff; }
.h-card__rating .h-stars { --size: 12px; }
.h-card__body { display: flex; flex-direction: column; flex: 1; min-height: 323px; padding: 16px; }
.h-card__type { margin: 0 !important; font-size: 11px; font-weight: 600; line-height: 14px; letter-spacing: .5px; }
.h-card__title { margin: 8px 0 0 !important; font: 700 32px/34px var(--h-font) !important; font-stretch: 75% !important; -webkit-text-stroke: .03em #000; letter-spacing: -.01em; }
.h-card__title a { color: #000 !important; text-decoration: none !important; }
.h-card__title a::after { content: ""; position: absolute; inset: 0; }
.h-card__tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 12px; }
.h-tag { padding: 4px 8px; border-radius: 2px; font-size: 11px; font-weight: 500; line-height: 14px; letter-spacing: .5px; }
.h-tag--green { background: #E4FAD9; color: #135400; }
.h-tag--blue { background: #DAECFA; color: #003B65; }
.h-card__desc { margin: 12px 0 16px !important; font-size: 16px; line-height: 24px; }
.h-tag--pink { background: #FFE0EC; color: #8A0F3C; }
/* Strain facts: label/value rows, the data the old cards only showed on the product page. */
.h-card__facts { display: grid; gap: 5px; margin: 14px 0 18px; font-size: 14px; line-height: 1.35; }
.h-card__facts div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px; }
.h-card__facts dt { color: #6b6b6b; font-weight: 400; }
.h-card__facts dd { margin: 0; font-weight: 600; }
.h-card__perseed { margin-top: 2px; color: #555; font-size: 12px !important; line-height: 16px !important; }
.h-card__perseed .amount { text-decoration: none !important; }
.h-card__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: auto; }
.h-card__price { display: grid; margin: 0 !important; font-size: 16px; line-height: 20px; }
.h-card__price small { font-size: 14px; line-height: 18px; }
.h-card__price small .amount { text-decoration: line-through; }
.h-card__price strong { font-weight: 700; }
.h-card__add {
	position: relative; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 36px; border-radius: 99px;
	background: var(--h-yellow); color: #000 !important; text-decoration: none !important; transition: box-shadow .2s, opacity .25s;
}
.h-card__add svg { width: 18px; height: 18px; }
.h-card__add span { display: none; }
.h-card__add:hover { box-shadow: inset 0 0 0 99px rgba(255, 255, 255, .25); }
@media (pointer: fine) {
	.h-card__add { opacity: 0; }
	.h-card:hover .h-card__add, .h-card__add:focus-visible { opacity: 1; }
}
.h-card--promo { background: var(--h-cyan); }
.h-promo { position: relative; display: flex; flex-direction: column; height: 100%; padding: 16px; }
.h-promo .h-display { font-size: 60px; line-height: 1; }
.h-promo ul { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 6px; font-size: 16px; }
.h-promo li b { display: inline-grid; place-items: center; min-width: 28px; height: 28px; margin-right: 8px; border-radius: 50%; background: #fff; }
.h-promo__art { width: 50%; height: auto; margin: auto 0 12px auto; }
.h-promo .h-btn { align-self: flex-start; min-height: 36px; padding: 7px 19px; background: #fff; color: #000 !important; }

@media (max-width: 999px) {
	.h-featured { padding: 36px 0; }
	.h-tabs { gap: 32px; max-width: none; width: auto; margin: 0 0 32px; padding: 0 var(--h-pad); }
	.h-tab { font-size: 16.25px; padding-bottom: 13px; }
	.h-tab::after { left: -16px; right: -16px; }
	.h-carousel__track { grid-auto-columns: 218px; gap: 12px; margin: 0; padding: 0 var(--h-pad); scroll-padding: 0 var(--h-pad); }
	.h-carousel__prev, .h-carousel__next { display: none; }
	.h-card { border-radius: 12px; }
	.h-card__body { min-height: 297px; padding: 12px; }
	.h-card__title { font-size: 24px !important; line-height: 26px !important; }
	.h-card__desc { font-size: 14px; line-height: 20px; }
	/* Phones: values only, two lines, like the reference's short card text. */
	.h-card__facts { gap: 2px; margin: 10px 0 12px; font-size: 13px; }
	.h-card__facts div { display: block; }
	.h-card__facts dt { display: none; }
	.h-card__facts dd { font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.h-card__facts div:nth-child(n+3) { display: none; }
	.h-card__badge { width: 42px; height: 42px; font-size: 9.5px; top: 10px; right: 10px; }
	.h-card__rating { bottom: 10px; }
	.h-card__add { width: 44px; height: 30px; background: #fff; border: 1.5px solid #000; }
	.h-promo .h-display { font-size: 36px; }
}

/* ---------- Revolution ---------- */
.h-revolution { padding: 40px var(--h-pad) 60px; background: var(--h-cream); }
.h-revolution__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 256px)); justify-content: center; gap: 48px 60px; margin-top: 47px; }
.h-revolution__item { display: grid; justify-items: center; align-content: start; text-align: center; }
.h-revolution__item .h-doodle { width: 168px; height: 168px; margin: -20px 0; } /* drawings carry their own air (sparkles, shadow) */
.h-revolution__item p { margin: 33px 0 0; font: 700 26px/1.3 var(--h-font); }
@media (max-width: 999px) {
	.h-revolution { padding: 30px var(--h-pad); }
	.h-home .h-section-lead { margin-top: 18px; }
	.h-revolution__grid { grid-template-columns: repeat(2, minmax(0, 165px)); gap: 15px 0; margin-top: 32px; }
	.h-revolution__item .h-doodle { width: 112px; height: 112px; margin: -14px 0; }
	.h-revolution__item p { margin-top: 14px; font-size: 16px; }
}

/* ---------- Reviews ---------- */
.h-reviews { padding: 30px var(--h-pad); background: var(--h-pink); }
.h-reviews .h-section-title { display: flex; align-items: center; justify-content: center; gap: 15px; }
.h-reviews__icon { width: 53px; height: 46px; flex: none; }
.h-reviews__sum { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 32px; margin: 0 0 20px !important; font-size: 14px; font-weight: 500; }
.h-reviews__sum .h-stars { --size: 21px; }
.h-reviews__wrap { display: grid; grid-template-columns: 43px minmax(0, 1fr) 43px; align-items: center; margin: 0 -10px; }
.h-reviews__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 20px) / 4); gap: 20px; padding: 20px 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.h-reviews__track::-webkit-scrollbar { display: none; }
.h-review { scroll-snap-align: start; display: flex; flex-direction: column; min-height: 189px; margin: 0; padding: 8px; background: #000; color: #fff; }
.h-review figcaption { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 600; line-height: 1.4; }
.h-review figcaption b { font-weight: 600; }
.h-review figcaption .h-stars { --size: 15px; color: #fff; }
.h-review__verified { margin: 4px 0 0 !important; font-size: 11px; line-height: 1.4; color: #fff; }
.h-review blockquote { margin: 6px 0 12px; padding: 0; border: 0; font-size: 14px; line-height: 1.4; color: #fff; font-style: normal; }
.h-review__meta { margin: auto 0 0 !important; font-size: 11px; line-height: 1.4; color: #fff; text-align: right; }
.h-chevbtn { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; color: #000; justify-self: center; }
.h-chevbtn .h-arrow { width: 24px; height: 24px; }
.h-reviews__foot { display: flex; align-items: center; justify-content: flex-end; gap: 20px; min-height: 45px; padding-right: 43px; font-size: 13px; font-weight: 700; }
.h-pause { border: 0; background: none; cursor: pointer; font: 600 11px var(--h-font); color: #555; }
@media (max-width: 999px) {
	.h-reviews { padding: 25px var(--h-pad) 16px; }
	.h-reviews .h-section-title { gap: 8px; }
	.h-reviews__icon { width: 30px; height: 26px; }
	.h-reviews__sum { flex-wrap: wrap; row-gap: 2px; max-width: 260px; margin: 6px auto 4px !important; }
	.h-reviews__sum .h-stars { --size: 18px; flex-basis: 100%; max-width: calc(18px * 5 + 4px); margin: 0 calc(50% - 47px); }
	.h-reviews__wrap { grid-template-columns: 30px minmax(0, 1fr) 30px; margin: 0; }
	.h-reviews__track { grid-auto-columns: 100%; }
	.h-chevbtn { width: 30px; height: 30px; }
	.h-reviews__foot { justify-content: center; padding-right: 0; }
}

/* ---------- Support ---------- */
.h-support { display: flex; align-items: center; justify-content: center; gap: 48px; padding: 25px var(--h-pad) 50px; background: var(--h-cream); }
.h-support__avatar { position: relative; width: 180px; height: 152px; flex: none; }
.h-support__blob { position: absolute; inset: 6px 20px 0 30px; background: var(--h-blue); border-radius: 46% 54% 42% 58% / 55% 45% 55% 45%; }
.h-support__avatar svg { position: absolute; left: 34px; top: 4px; width: 128px; height: auto; }
.h-support__bubble { position: absolute; left: 0; top: 50px; padding: 4px 12px; border-radius: 99px; background: #fff; font-size: 20px; box-shadow: 0 4px 12px rgba(0, 0, 0, .1); }
.h-support__title { margin: 0 !important; font-size: 18px; font-weight: 700; line-height: 1; }
.h-support p { max-width: 380px; margin: 6px 0 20px; font-size: 16px; line-height: 20px; }
@media (max-width: 999px) {
	.h-support { flex-direction: column; gap: 18px; padding: 10px var(--h-pad) 20px; text-align: center; }
	.h-support__avatar { width: 122px; height: 103px; }
	.h-support__blob { inset: 4px 14px 0 20px; }
	.h-support__avatar svg { left: 22px; width: 86px; }
	.h-support__bubble { top: 30px; font-size: 15px; padding: 3px 9px; }
	.h-support__title { font-size: 16px; }
	.h-support p { margin: 6px auto 20px; font-size: 14px; line-height: 18px; }
	.h-support .h-btn { min-height: 50px; font-size: 14px; }
}

/* ---------- Story ---------- */
.h-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 10%; align-items: center; padding: 64px var(--h-pad); background: var(--h-pink); }
.h-story .h-section-title { text-align: left; }
.h-story__text p { margin: 24px 0 0 !important; font-size: 16px; line-height: 1.32; }
.h-story__text .h-story__sign { font: italic 600 30px/1.2 var(--h-font) !important; margin-top: 34px !important; transform: rotate(-3deg); transform-origin: left; }
.h-story__text .h-btn { margin-top: 34px; }
.h-story__media { position: relative; aspect-ratio: 1; }
.h-story__art { position: absolute; inset: 0; overflow: hidden; background: var(--h-yellow); }
.h-motion .h-story__art { clip-path: inset(0 0 0 100%); visibility: hidden; }
.h-motion .h-story.is-in .h-story__art { clip-path: inset(0); visibility: visible; transition: clip-path .6s cubic-bezier(1, 0, 0, 1), visibility 0s; }
.h-motion .h-story__text { opacity: 0; }
.h-motion .h-story.is-in .h-story__text { opacity: 1; transition: opacity .3s linear .3s; }
.h-story__mascot { position: absolute; left: 14%; top: 12%; width: 72%; height: auto; }
.h-story__badge { position: absolute; left: 7%; top: 7%; width: 19%; height: auto; transform: rotate(-8deg); }
@media (max-width: 999px) {
	.h-story { grid-template-columns: 1fr; row-gap: 32px; padding: 36px var(--h-pad); text-align: center; }
	.h-story__media { order: -1; }
	.h-story .h-section-title { text-align: center; }
	.h-story__text p { margin: 16px auto 0 !important; font-size: 14.5px; }
	.h-story__text .h-story__sign { font-size: 26px !important; margin-top: 24px !important; transform-origin: center; }
	.h-story__text .h-btn { margin-top: 26px; }
}

/* ---------- Collection tiles ---------- */
/* Full-bleed scroller that starts on the container edge; tiles are a 3.25-up crop of the container. */
.h-collections { padding: 64px 0; background: var(--h-beige); }
.h-carousel--tiles { --tile-w: calc((100vw - 2 * var(--h-pad) - 81px) / 3.25); }
.h-carousel--tiles .h-carousel__track { grid-auto-columns: var(--tile-w); gap: 27px; margin: 0; padding: 0 calc(var(--h-pad) + 28px) 0 var(--h-pad); scroll-padding: 0 var(--h-pad); }
.h-carousel--tiles .h-round--white { width: 56px; height: 56px; }
.h-carousel--tiles .h-carousel__prev, .h-carousel--tiles .h-carousel__next { top: calc(var(--tile-w) * .6 - 28px); }
.h-carousel--tiles .h-carousel__prev { left: calc(var(--h-pad) + 60px); }
.h-carousel--tiles .h-carousel__next { right: var(--h-pad); }
.h-tile { display: flex; flex-direction: column; overflow: hidden; background: var(--h-grey); color: #000 !important; text-decoration: none !important; }
.h-tile__media { position: relative; display: block; aspect-ratio: 5 / 6; background: #000; overflow: hidden; }
.h-tile__doodle { position: absolute; z-index: 3; right: 5%; bottom: 5%; width: 24%; }
.h-tile__doodle .h-doodle { width: 100%; height: auto; }
.h-tile__label { display: grid; place-items: center; min-height: 58px; padding: 16px 13px; background: #fff; font: 700 20px/26px var(--h-font); transition: background .25s ease; }
.h-tile:hover .h-tile__label { background: var(--h-lime); }
@media (max-width: 999px) {
	.h-collections { padding: 36px 0; }
	.h-carousel--tiles .h-carousel__track { grid-auto-columns: 312px; gap: 17px; padding: 0 var(--h-pad); }
	.h-tile__label { min-height: 75px; padding: 14px 7px; font-size: 18.5px; }
}

/* ---------- USPs ---------- */
.h-usps { padding: 40px var(--h-pad); background: var(--h-cream); }
.h-usps__track { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px; }
.h-usp { display: grid; justify-items: center; align-content: start; text-align: center; }
.h-usp .h-lineicon { width: 95px; height: 95px; }
.h-usp__title { margin: 16px 0 0 !important; font-size: 18px; font-weight: 700; line-height: 1.32; }
.h-usp p:last-child { margin: 4px 0 0; max-width: 300px; font-size: 16px; line-height: 1.32; }
.h-usps__dots { display: none; }
@media (max-width: 999px) {
	.h-usps { padding: 40px var(--h-pad); }
	.h-usps__track { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 100%; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.h-usps__track::-webkit-scrollbar { display: none; }
	.h-usp { scroll-snap-align: start; padding: 0 28px; }
	.h-usp__title { font-size: 16.4px; }
	.h-usp p:last-child { font-size: 14.5px; }
	.h-usps__dots { display: flex; justify-content: center; gap: 6px; margin-top: 18px; }
	.h-usps__dots span { width: 8px; height: 8px; border: 1px solid #000; border-radius: 50%; }
	.h-usps__dots span.is-active { background: #000; }
}

/* The reference shows no arrows on the product row; ours appear on hover so mouse users can still page. */
@media (pointer: fine) {
	.h-featured .h-carousel__prev, .h-featured .h-carousel__next { transition: opacity .2s; }
	.h-featured .h-carousel:not(:hover) .h-carousel__prev, .h-featured .h-carousel:not(:hover) .h-carousel__next { opacity: 0; }
}

/* Card v4: chips (packs, THC/CBD), three traits with icons, price row with divider, round add button, animated sale seal. */
.h-tag--lilac { background: #EEE4FB; color: #4B2A7A; }
.h-card__traits { display: grid; gap: 7px; margin: 14px 0 16px; padding: 0; list-style: none; font-size: 15px; line-height: 1.3; }
.h-card__traits li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: center; }
.h-trait { width: 22px; height: 22px; }
.h-card__foot { align-items: center; padding-top: 14px; border-top: 1px solid #ECE6DA; }
.h-card__price strong { font-size: 22px; line-height: 1.1; }
.h-card__add { width: 52px; height: 52px; border-radius: 50%; }
.h-card__add svg { width: 22px; height: 22px; }
@media (pointer: fine) { .h-card__add { opacity: 1; } .h-card:hover .h-card__add { transform: translateY(-2px); } }
/* Sale: a quiet label like the reference's "Limitiert" pill – flat, no motion. */
.h-card__sale { position: absolute; z-index: 3; top: 14px; left: 14px; padding: 5px 10px; border-radius: 99px; background: #FB4328; color: #fff; font: 700 12px/1.2 var(--h-font); letter-spacing: .2px; }
@media (max-width: 999px) {
	.h-card__traits { gap: 5px; margin: 10px 0 12px; font-size: 13px; }
	.h-card__traits li { grid-template-columns: 18px minmax(0, 1fr); gap: 7px; }
	.h-trait { width: 18px; height: 18px; }
	.h-card__traits li:nth-child(3) { display: none; }
	.h-card__price strong { font-size: 18px; }
	.h-card__add { width: 42px; height: 42px; }
	.h-card__sale { top: 10px; left: 10px; padding: 4px 8px; font-size: 11px; }
}
.h-card__now { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; }
.h-card__now del { color: #6b6b6b; font-size: 15px; }
@media (max-width: 999px) { .h-card__now del { font-size: 12px; } }