/* Ritual homepage composition, using the existing MLife colours and typefaces.
 * Kept separate so product, journal and other interior layouts are unchanged. */
.is-front { --pad-x: clamp(1.25rem, 3.4vw, 4rem); --gap: 1.5rem; }
.is-front .section { padding-block: clamp(3rem, 5vw, 5rem); }
.is-front .section--tight { padding-block: clamp(2rem, 3.4vw, 3.5rem); }
.is-front .wrap { max-width: 1600px; }
.is-front .site-header { background: var(--c-sand); }
.is-front .header__bar { min-height: 64px; }
.is-front .brand__mark { width: 145px; }
.is-front .topbar { padding-block: .6rem; }
.is-front .sec-head { max-width: none; margin-bottom: 2rem; }
.is-front .sec-head__title { font-size: clamp(1.8rem, 2.8vw, 2.8rem); }
.is-front .sec-head__text { font-size: 1rem; max-width: 65ch; margin-top: .75rem; }
.is-front .row-head { margin-bottom: 1.75rem; padding-bottom: 0; border: 0; }
.is-front .row-head__title { max-width: none; }
.is-front .row-head .link-u { flex-shrink: 0; }
.is-front .u-eyebrow { margin-bottom: .8rem; }
.is-front .js-reveal { opacity: 1; transform: none; transition: none; }

/* The reference opens with a 70/30 image / copy split, below a solid header. */
.home-hero { display: grid; grid-template-columns: 7fr 3fr; background: var(--c-forest); color: var(--c-paper); }
.home-hero__media { position: relative; min-width: 0; min-height: 470px; aspect-ratio: 1.65; overflow: hidden; }
.home-hero__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-hero__body { padding: clamp(1.5rem, 3vw, 3rem); display: flex; flex-direction: column; align-items: flex-start; }
.home-hero__body .u-eyebrow { color: var(--c-bronze-soft); font-size: .6rem; }
.home-hero h1 { font-size: clamp(2.4rem, 3.8vw, 4rem); line-height: 1.06; letter-spacing: -.02em; margin: 0 0 1.25rem; text-wrap: balance; }
.home-hero__text { font-size: clamp(.875rem, 1.1vw, 1.05rem); line-height: 1.65; max-width: 36ch; }
.home-hero__actions { margin-top: auto; padding-top: 2.5rem; display: flex; align-items: flex-start; flex-direction: column; gap: 1rem; }
.home-hero__actions .btn { padding-inline: 1.5rem; min-height: 46px; }
.home-hero__actions .link-u { font-size: .7rem; }

/* Secondary campaign: inset band, copy left and image right. */
.home-feature { padding-block: 2.5rem 0; }
.home-feature__inner { display: grid; grid-template-columns: 1fr 1fr; background: var(--c-sand-deep); min-height: 280px; }
.home-feature__body { padding: clamp(1.5rem, 4.5vw, 4.5rem); align-self: center; }
.home-feature h2 { font-size: clamp(1.75rem, 2.8vw, 2.75rem); margin: 0 0 .8rem; }
.home-feature p { font-size: .95rem; max-width: 45ch; margin-bottom: 1.5rem; }
.home-feature__media { position: relative; min-height: 280px; overflow: hidden; }
.home-feature__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }

/* Four generous cards and a glimpse of the next, with native touch scrolling. */
.is-front .home-rail { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: calc((100% - 4.5rem) / 4.15); gap: 1.5rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad-x); margin-inline: calc(-1 * var(--pad-x)); padding: 0 var(--pad-x) 1rem; scrollbar-width: thin; scrollbar-color: var(--c-bronze) transparent; }
.home-rail > * { min-width: 0; scroll-snap-align: start; }
.is-front .home-rail .js-reveal { opacity: 1; transform: none; }
.is-front .p-card { position: relative; }
.is-front .p-card__visual { position: relative; }
.is-front .p-card__body { padding-top: .9rem; }
.is-front .p-card__title { font-size: 1.1rem; }
.is-front .p-card__cat { margin-bottom: .4rem; letter-spacing: .04em; }
.is-front .p-card__price { font-size: 1.1rem; flex-wrap: wrap; gap: .3rem .6rem; }
.is-front .p-card__unit { margin-bottom: 0; font-size: .6rem; }
.is-front .p-card__add { position: absolute; bottom: .8rem; right: .8rem; border: 0; border-radius: 50%; padding: 0; width: 46px; height: 46px; display: grid; place-items: center; background: var(--c-paper); color: var(--c-ink); font-size: .6rem; letter-spacing: .04em; }
.is-front .p-card__add:hover { background: var(--c-forest); color: var(--c-paper); }
.rail-controls { display: flex; align-items: center; justify-content: flex-end; gap: .65rem; padding-top: .8rem; }
.rail-controls[hidden] { display: none; }
.rail-arrow { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid var(--c-line); border-radius: 50%; background: transparent; color: inherit; cursor: pointer; transition: background .2s, opacity .2s; }
.rail-arrow:hover:not(:disabled) { background: var(--c-sand-deep); }
.rail-arrow:disabled { opacity: .3; cursor: default; }
.rail-arrow--previous .icon { transform: rotate(180deg); }
.rail-arrow .icon { width: 17px; height: 17px; }

/* Compact credibility row, then alternating square-image stories. */
.is-front .trust { border: 0; padding-block: 2.75rem; }
.is-front .trust__item { border: 0; gap: .7rem; }
.is-front .trust__stat { font-family: var(--f-body); font-size: .85rem; }
.is-front .trust__label { font-size: .65rem; letter-spacing: .03em; text-transform: none; }
.is-front .home-story .split { grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); }
.is-front .home-story .thumb--story { aspect-ratio: 1; }
.is-front .home-story .split__body { max-width: none; padding-inline: clamp(0rem, 1vw, 1rem); }
.is-front .home-story .split__title { font-size: clamp(2rem, 3vw, 3.1rem); line-height: 1.12; }
.is-front .home-story .split__text { font-size: 1rem; line-height: 1.65; }
.is-front .home-story .btn-row { margin-top: 1.6rem; }
.is-front .home-story .btn { padding: 0 0 .4rem; min-height: 0; border: 0; border-bottom: 1px solid currentColor; background: none; color: inherit; }
.is-front .home-story .btn:hover { color: var(--c-bronze); }
.is-front .c-card__media { display: block; }
.is-front .c-card .thumb { display: block; aspect-ratio: 1; }
.is-front .c-card__label { text-align: left; font-size: .8rem; letter-spacing: .01em; text-transform: none; }

/* One large review at the centre instead of a grid of bordered quotes. */
.is-front .home-reviews { padding-block: 3rem; }
.home-reviews .sec-head { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.is-front .home-reviews .quotes { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; grid-template-columns: none; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.home-reviews .quotes::-webkit-scrollbar { display: none; }
.is-front .home-reviews .quote { background: none; border: 0; padding: 1rem max(1rem, calc((100% - 680px) / 2)); margin: 0; text-align: center; align-items: center; justify-content: center; scroll-snap-align: center; opacity: 1; transform: none; }
.home-reviews .quote__text { font-size: clamp(1.6rem, 2.5vw, 2.3rem); line-height: 1.35; margin: 0 0 1.25rem; }
.home-reviews .quote__stars { margin-bottom: 1rem; }
.home-reviews .quote__by { margin-top: 0; }
.home-reviews .rail-controls { justify-content: center; padding-top: 1.5rem; }
.rail-dots { display: flex; align-items: center; gap: .25rem; }
.rail-dot { display: grid; place-items: center; width: 26px; height: 30px; padding: 0; border: 0; background: none; cursor: pointer; }
.rail-dot::before { content: ''; width: 18px; height: 4px; background: var(--c-sand-deep); border-radius: 2px; }
.rail-dot[aria-current="true"]::before { background: var(--c-bronze); }
.is-front .person__name { font-size: 1.1rem; }
.is-front .person__role { text-transform: none; letter-spacing: .02em; }

/* Community invitation above an edge-to-edge lifestyle strip. */
.is-front .home-community { padding-top: 0; }
.home-community__heading { text-align: center; padding: 3.5rem 1rem; max-width: 650px; margin: auto; }
.home-community__heading h2 { font-size: clamp(2rem, 3vw, 3rem); margin: 0 0 1rem; }
.home-community__heading p { margin: 0 0 1.5rem; }
.is-front .home-community > .wrap { max-width: none; }
.is-front .gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-inline: calc(-1 * var(--pad-x)); }
.home-community .thumb { aspect-ratio: 3 / 4; }
.home-shoplinks__title { font-family: var(--f-body); font-size: 1rem; letter-spacing: 0; text-align: center; margin: 0 0 2.5rem; }
.is-front .shoplinks { max-width: 850px; margin-inline: auto; }
.is-front .shoplinks__item a { border: 0; padding: 1rem .25rem; }
.is-front .shoplinks__icon .icon { width: 46px; height: 46px; }
.is-front .shoplinks__label { font-size: .7rem; text-transform: none; letter-spacing: .02em; }
.is-front .newsletter__inner { grid-template-columns: 1fr 1fr; }
.is-front .newsletter__form { gap: 0; border-bottom: 1px solid var(--c-line); }
.is-front .newsletter__form input[type="email"] { border: 0; padding: .75rem 0; }
.is-front .newsletter__form .btn { padding-inline: 1rem; border: 0; background: none; color: var(--c-ink); font-size: .65rem; }
.is-front .newsletter__form:focus-within { outline: 2px solid var(--c-bronze); outline-offset: 5px; }
.is-front .footer__brandbar { padding-top: 2.5rem; }

@media (max-width: 1000px) {
	.home-hero { grid-template-columns: 3fr 2fr; }
	.home-hero__media { aspect-ratio: auto; }
	.is-front .home-rail { grid-auto-columns: calc((100% - 3rem) / 2.8); }
	.is-front .home-story .split { gap: 2rem; }
}
@media (max-width: 700px) {
	.is-front .section { padding-block: 2.5rem; }
	.home-hero { grid-template-columns: 1fr; }
	.home-hero__media { min-height: 0; aspect-ratio: 1.35; }
	.home-hero__body { padding: 1.75rem 1.25rem 2rem; }
	.home-hero h1 { font-size: 2.75rem; max-width: 17ch; }
	.home-hero__text { max-width: 50ch; }
	.home-hero__actions { padding-top: .75rem; width: 100%; }
	.home-hero__actions .link-u { align-self: center; }
	.home-feature { padding-block: 1.25rem 0; }
	.home-feature__inner { grid-template-columns: 1fr; }
	.home-feature__body { padding: 1.5rem; }
	.home-feature__media { min-height: 210px; }
	.is-front .row-head { align-items: flex-end; gap: 1rem; }
	.is-front .row-head__title { font-size: 1.75rem; }
	.is-front .row-head .link-u { font-size: .65rem; }
	.is-front .home-rail { grid-auto-columns: 72%; gap: 1rem; }
	.is-front .trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
	.is-front .trust__item:last-child { grid-column: 1 / -1; }
	.is-front .home-story .split { grid-template-columns: 1fr; gap: 1.75rem; }
	.is-front .home-story .split--reverse .split__media { order: 0; }
	.is-front .home-story .split__body { padding: 0; }
	.is-front .home-story .btn { width: auto; }
	.is-front .gallery { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 66%; overflow-x: auto; scroll-snap-type: x mandatory; padding-inline: var(--pad-x); }
	.gallery__item { scroll-snap-align: center; }
	.is-front .home-community { padding-top: 0; }
	.home-community__heading { padding-block: 2.5rem; }
	.is-front .shoplinks { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }
	.shoplinks__item { flex: 0 0 calc(33.333% - 1rem); }
	.is-front .newsletter__inner { grid-template-columns: 1fr; gap: 1.5rem; }
	.is-front .newsletter__form { flex-direction: row; }
	.is-front .newsletter__form .btn { width: auto; max-width: 45%; }
	.is-front .footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.5rem; }
}

/* Homepage motion: content stays visible without JavaScript. */
.home-word-mask {
 display: inline-block;
 overflow: clip;
 vertical-align: top;
 padding-bottom: .14em;
 margin-bottom: -.14em;
}
.home-word-mask > span { display: block; transform-origin: 0 100%; }
.home-scroll-progress { display: none; }

@media (prefers-reduced-motion: no-preference) {
 .home-motion .home-scroll-progress {
  display: block;
  position: fixed;
  inset: 0 0 auto;
  height: 3px;
  z-index: 65;
  background: var(--c-bronze);
  transform: scaleX(0);
  transform-origin: left;
  pointer-events: none;
 }
 .home-motion .home-hero__media { overflow: hidden; }
 .home-motion .p-card__media .thumb__img,
 .home-motion .c-card .thumb__img {
  transition: transform 1s cubic-bezier(.16, 1, .3, 1);
 }
 .home-motion .p-card__add {
  transition: transform .45s cubic-bezier(.16, 1, .3, 1), background .3s, color .3s;
 }
 .home-motion .rail-arrow {
  transition: transform .35s cubic-bezier(.16, 1, .3, 1), background .25s, opacity .25s;
 }
 .home-motion .home-hero__actions .btn,
 .home-motion .home-community__heading .btn {
  transition: transform .45s cubic-bezier(.16, 1, .3, 1), color .3s, background .3s;
 }
 .home-motion .p-card__add:active,
 .home-motion .rail-arrow:active:not(:disabled) { transform: scale(.94); }
}

@media (min-width: 901px) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
 .home-motion .home-feature__media > img,
 .home-motion .home-story .thumb > img,
 .home-motion .home-community .thumb > img {
  transform: translate3d(0, var(--home-shift, 0px), 0) scale(1.07);
  transition: none;
 }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
 .home-motion .p-card:hover .p-card__media .thumb__img,
 .home-motion .p-card:focus-within .p-card__media .thumb__img { transform: scale(1.065); }
 .home-motion .c-card:hover .thumb__img,
 .home-motion .c-card:focus-visible .thumb__img { transform: scale(1.08); }
 .home-motion .p-card:hover .p-card__add,
 .home-motion .p-card:focus-within .p-card__add { transform: translateY(-4px) scale(1.08); }
 .home-motion .rail-arrow:hover:not(:disabled) { transform: scale(1.12); }
 .home-motion .home-hero__actions .btn:hover,
 .home-motion .home-community__heading .btn:hover { transform: translateY(-3px); }
}

@media (prefers-reduced-motion: reduce) {
 .home-scroll-progress { display: none !important; }
 .home-word-mask > span,
 .home-hero__media img,
 .home-feature__media img,
 .home-story .thumb > img,
 .home-community .thumb > img {
  transform: none !important;
  opacity: 1 !important;
 }
}