/* KWSS-3.4 — homepage router.
   Container model: the page main is full-bleed; every band spans the viewport
   and its content sits in .kwss-container, which reproduces Storefront's
   header .col-full (same max-width + side padding) so text, tiles and the
   logo share one left edge at every width. */
.kwss-home .site-header { margin-bottom: 0; }
.kwss-home #content > .col-full { max-width: none; padding: 0; margin: 0; }
.kwss-home .kwss-home__primary, .kwss-home #main { float: none; width: 100%; max-width: none; margin: 0; padding: 0; box-sizing: border-box; }

.kwss-container { max-width: 66.4989378333em; margin: 0 auto; padding: 0 2.617em; box-sizing: content-box; }

/* Bands */
.kwss-hero { position: relative; min-height: 62vh; background: #1c2b3a center 22% / cover no-repeat; display: flex; align-items: center; color: #fff; } /* focal point ~22% from the top keeps faces in the wide desktop crop */
.kwss-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,42,68,.50) 0%, rgba(15,42,68,.28) 38%, rgba(15,42,68,0) 62%); } /* light scrim on the text side only; the photo carries the mood */
.kwss-hero__inner { position: relative; width: 100%; padding-top: 3.5em; padding-bottom: 3.5em; }
.kwss-hero__title { color: #fff; font-size: var(--kwss-fs-hero); line-height: 1.1; margin: 0 0 .4em; max-width: 12em; text-shadow: 0 2px 6px rgba(10,25,40,.55), 0 0 24px rgba(10,25,40,.35); }
.kwss-hero__sub { font-size: var(--kwss-fs-lead); max-width: 30em; margin: 0 0 1.2em; color: #fff; text-shadow: 0 1px 4px rgba(10,25,40,.75), 0 0 16px rgba(10,25,40,.45); }
.kwss-hero__cta { display: flex; flex-wrap: wrap; gap: .75em; margin: 0; }
.kwss-hero__btn.button { padding: .9em 1.5em; font-size: var(--kwss-fs-base); }
.kwss-hero__btn--alt.button { background: #fff; color: var(--kwss-navy, #0f2a44); border-color: #fff; }

.kwss-home__strip { background: var(--kwss-sand, #e8dcc4); }
.kwss-home__strip .kwss-trust-strip--hub { max-width: none; margin: 0 auto; padding: 1rem 0; border-top: 0; justify-content: center; }
/* Homepage strip: two points per line (2 x 2), each column sized to its longest item; single column on small phones. */
.kwss-home__strip .kwss-trust-strip--hub { display: grid; grid-template-columns: repeat(2, max-content); column-gap: 3rem; row-gap: .625rem; justify-content: center; }
.kwss-home__strip .kwss-trust-strip--hub li { text-align: left; }
@media (max-width: 480px) { .kwss-home__strip .kwss-trust-strip--hub { grid-template-columns: max-content; } }

.kwss-home__section { padding-top: 3rem; padding-bottom: 0; }
.kwss-home__section > h2 { font-size: var(--kwss-fs-h2); margin: 0 0 1.25rem; }
.kwss-home ul.products { margin-bottom: 0; }
.kwss-home__section .kwss-hub-section { margin-bottom: 0; }
.kwss-home__section .kwss-hub-section__head { margin-bottom: 1.5rem; }

.kwss-home__story-band { background: var(--kwss-sand, #e8dcc4); margin-top: 3rem; padding: 3rem 0; }
.kwss-home__story-text { max-width: 44em; }
.kwss-home__story-text h2 { font-size: var(--kwss-fs-h2); margin-top: 0; }
.kwss-home__story-text p:last-child { margin-bottom: 0; }

.kwss-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25em; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.kwss-tiles--activity { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kwss-tiles--gender { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 40em; }
.kwss-tiles li { margin: 0; }
.kwss-tiles a { display: block; text-decoration: none; color: inherit; }
.kwss-tiles img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 8px; margin-bottom: .5em; }
.kwss-tile__label { display: block; font-weight: 600; line-height: 1.2; font-size: var(--kwss-fs-base); }
.kwss-tile__sub { display: block; font-size: var(--kwss-fs-sm); color: var(--kwss-muted, #4a5561); }

.kwss-why { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5em; }
.kwss-why li { margin: 0; }
.kwss-why strong { display: block; margin-bottom: .3em; }
.kwss-why span { font-size: var(--kwss-fs-base); color: var(--kwss-text, #1f2a33); }

.kwss-home__reviews-line { font-size: var(--kwss-fs-lead); margin: 0; }
.kwss-home__ourstory p { margin: 0; }
.kwss-home__copy { padding-bottom: 4rem; }
.kwss-home__copy > * { max-width: 44em; }
.kwss-home__copy h2 { font-size: var(--kwss-fs-h3); }

@media (max-width: 767px) {
	.kwss-container { padding: 0 20px; }
	.kwss-hero { min-height: 70vh; }
	.kwss-hero::before { background: linear-gradient(180deg, rgba(15,42,68,.04) 0%, rgba(15,42,68,.22) 55%, rgba(15,42,68,.30) 100%); } /* phones: text sits over the shirts, so a light even scrim instead of the side gradient */
	.kwss-hero__inner { padding-top: 2.25em; padding-bottom: 2.25em; }
	.kwss-hero__title { font-size: var(--kwss-fs-hero-sm); }
	.kwss-home__section { padding-top: 2em; }
	.kwss-home__story-band { margin-top: 2em; padding: 2em 0; }
	.kwss-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75em; }
	.kwss-tiles--activity { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kwss-tiles--gender { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kwss-why { grid-template-columns: 1fr 1fr; }
	.kwss-home__copy { padding-bottom: 2.5em; }
}