/* Market (Razor Theme_5 family): only what differs from hike-base; colours and fonts are design tokens.
   The button on every product card is the design token layout.card_button. */

.btn { font-weight: 800; letter-spacing: .02em; }
.btn--primary:hover { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-on-accent); }

/* Information bar in the brand colour */
.announcement { --color-announcement-background: var(--color-primary); --color-announcement-text: var(--color-on-primary); font-weight: 600; }

/* Titles left with an accent underline under the first part; "View all" as a pill */
.section-heading { align-items: center; }
.section-heading h2 { font-weight: 800; font-size: clamp(1.35rem, 1.1rem + 1vw, 2rem); padding-bottom: 8px; background: linear-gradient(var(--color-accent), var(--color-accent)) left bottom / 56px 4px no-repeat; }
.section-heading--center h2 { background-position: center bottom; }
.section-heading__link { border: 1.5px solid var(--color-box-border, var(--color-outline)); border-radius: 999px; padding: 6px 14px; font-size: .85rem; }
.section-heading__link:hover { border-color: var(--color-primary); }
.eyebrow { font-family: var(--font-accent-family, inherit); color: var(--color-accent-text); }

/* Header: search box always visible on desktop, green icons */
.site-header .icon-button { color: var(--color-primary); }
.site-search__form input { border-radius: var(--shape-input-radius, 6px); }

/* Slider: lively kicker in the accent colour */
.hero__content { display: flex; flex-direction: column; }
.hero__content p { order: -1; display: inline-block; align-self: flex-start; background: var(--color-accent); color: var(--color-on-accent); font-weight: 800; font-size: .85rem; padding: 4px 12px; border-radius: 999px; margin-bottom: 14px; }
.hero--center .hero__content p { align-self: center; }
.hero__actions { order: 2; }
.hero h1, .hero .h1 { font-weight: 800; }

/* Cards: framed, lift on hover, a visible button */
.product-card { --card-border: 1px solid var(--color-box-border, var(--color-outline)); }
.product-card:hover { transform: translateY(-3px); border-color: var(--color-primary); }
.product-card__body { display: flex; flex-direction: column; flex: 1; }
.product-card__button { margin-top: auto; }
.product-card .price { margin-bottom: 4px; }
.product-card .price__current { color: var(--color-primary); font-weight: 800; font-size: 1.05rem; }

.category-card { border-radius: var(--shape-card-radius, 8px); }
.category-card__name { font-weight: 800; }
.multicolumn--plain .multicolumn__icon { color: var(--color-primary); }