.hps-section {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: var(--hps-spacing-48, 48px);
    padding: var(--hps-spacing-48, 48px) var(--hps-layout-gutter, 32px);
    color: var(--hps-color-text-primary);
    background: var(--hps-color-bg-canvas);
    font-family: var(--hps-font-family), sans-serif;
}
.hps-section--subtle { background: var(--hps-color-bg-subtle); }
.hps-section--inverse { background: var(--hps-color-bg-inverse); color: var(--hps-color-text-inverse); }
.hps-section--compact { padding-block: var(--hps-spacing-24, 24px); }
.hps-section--roomy { padding-block: var(--hps-spacing-96, 96px); }
.hps-section--right .hps-section__media { order: 2; }
.hps-section--stacked, .hps-section--products { grid-template-columns: minmax(0, 1fr); }
.hps-section:not(:has(> .hps-section__media)) { grid-template-columns: minmax(0, 1fr); }
.hps-section__copy { width: 100%; max-width: var(--hps-layout-reading-max, 720px); }
.hps-section .hps-section__copy h1, .hps-section .hps-section__copy h2, .hps-section .hps-section__copy h3 { color: inherit; margin: 0 0 var(--hps-spacing-24, 24px); font-weight: var(--hps-font-weight-bold, 700); text-transform: uppercase; overflow-wrap: anywhere; }
.hps-section.hps-section--hero .hps-section__copy :is(h1,h2) { font-size: var(--hps-type-display-size); line-height: var(--hps-type-display-line); letter-spacing: -.035em; }
.hps-section .hps-section__copy h2 { font-size: var(--hps-type-heading-size); line-height: var(--hps-type-heading-line); }
.hps-section__text { font-size: var(--hps-type-body-size); line-height: var(--hps-type-body-line); }
.hps-section__text p:first-child { margin-top: 0; }
.hps-section__text p:last-child { margin-bottom: 0; }
.hps-section__copy .hps-button { display: inline-flex; margin-top: var(--hps-spacing-24, 24px); padding: 12px 24px; border: 1px solid currentColor; background: transparent; color: inherit; text-decoration: none; }
.hps-section__copy a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.hps-section__media { min-width: 0; }
.hps-section__media img { display: block; width: 100%; height: auto; }
.hps-section--square .hps-section__media img { aspect-ratio: 1; object-fit: cover; }
.hps-section--portrait .hps-section__media img { aspect-ratio: 3 / 4; object-fit: cover; }
.hps-section--wide .hps-section__media img { aspect-ratio: 16 / 9; object-fit: cover; }
.hps-section--products > .woocommerce, .hps-section--products > ul.products { width: 100%; }
.hps-section--products .woocommerce-ordering, .hps-section--products .woocommerce-result-count { margin: 0; }
.hps-section-editor__label, .hps-section-editor__hint { padding: 8px 16px; font: var(--hps-type-label-size)/var(--hps-type-label-line) var(--hps-font-family), sans-serif; color: var(--hps-color-text-secondary); background: var(--hps-color-bg-subtle); }
.hps-section-editor .hps-section { pointer-events: none; }
@media (max-width: 767px) {
    .hps-section { grid-template-columns: minmax(0, 1fr); gap: var(--hps-spacing-24, 24px); padding-inline: var(--hps-layout-gutter-mobile, 16px); }
    .hps-section--right .hps-section__media { order: 0; }
    .hps-section--roomy { padding-block: var(--hps-spacing-48, 48px); }
}
/* Editorial sections share one column; containers lay out their child blocks. */
.hps-section--gallery,.hps-section--group,.hps-section--accordion,.hps-section--text,.hps-section--archive-rings,.hps-section--collections,.hps-section--featured { grid-template-columns: minmax(0,1fr); }
.hps-section__children:empty,.hps-section__copy:empty { display:none; }
.hps-section__children > * { margin-block: 0 24px; }
.hps-section--group > .hps-section__children { display:grid; grid-template-columns:repeat(var(--hps-section-columns,1),minmax(0,1fr)); gap:var(--hps-layout-grid-gap,24px); }
.hps-section--group > .hps-section__children > * { margin:0; min-width:0; }
.hps-section--text > .hps-section__children { max-width:var(--hps-layout-reading-max,720px); font-size:var(--hps-type-body-size); line-height:var(--hps-type-body-line); }
.hps-section__gallery { display:grid; grid-template-columns:repeat(var(--hps-section-columns,3),minmax(0,1fr)); gap:var(--hps-layout-grid-gap,24px); }
.hps-section__gallery figure { margin:0; min-width:0; }
.hps-section__gallery img { width:100%; height:auto; display:block; }
.hps-section__gallery figcaption { margin-top:12px; font-size:var(--hps-type-caption-size); line-height:1.5; }
.hps-section__media video { width:100%; height:auto; display:block; }
.hps-section--square .hps-section__media video { aspect-ratio:1; object-fit:cover; }
.hps-section--portrait .hps-section__media video { aspect-ratio:3/4; object-fit:cover; }
.hps-section--wide .hps-section__media video { aspect-ratio:16/9; object-fit:cover; }
.hps-section--accordion details { border-top:1px solid currentColor; padding-block:20px; }
.hps-section--accordion summary { cursor:pointer; font-size:var(--hps-type-body-size); font-weight: var(--hps-font-weight-bold); padding-block:8px; }
.hps-section--accordion details > :not(summary) { margin-top:16px; max-width:var(--hps-layout-reading-max,720px); line-height:1.6; }
.hps-section .hps-section__products ul.products { display:grid; grid-template-columns:repeat(var(--hps-section-columns,3),minmax(0,1fr)); }
.hps-section--collections .hps-home-collections { width:100%; padding:0; }
.hps-section--featured .hps-featured { padding-inline:0; }
.hps-section-editor__children { border:1px dashed var(--hps-color-border-control); padding:24px; }
.hps-editor-richtext { border:1px solid var(--hps-color-border-control); padding:12px; min-height:100px; margin-bottom:20px; }
.hps-editor-selection { padding-left:20px; }
.hps-editor-selection li { margin-block:12px; }
.hps-editor-selection li span { display:block; }
@media(max-width:767px) {
 .hps-section__gallery,.hps-section--group > .hps-section__children { grid-template-columns:minmax(0,1fr); }
 .hps-section .hps-section__products ul.products { grid-template-columns:minmax(0,1fr); }
 .hps-section--archive-rings { padding-inline:0; }
 .hps-section--archive-rings > .hps-section__copy { padding-inline:16px; }
}
/* Keep preview images and disclosures useful while editing; animations run on the storefront. */
.editor-styles-wrapper .hps-section--featured .hps-feature-grid { height:560px; }
:is(.page-template-page-sections,.page-template-page-members) .site-main { width:100%; max-width:none; padding:0; }
/* Builder layouts on collection archives own their spacing; main's padding would stack on the first section's. */
.site-main:has(> .hps-builder-page, > .hps-collection-canvas > .hps-builder-page) { padding-block:0; }
.hps-section--inverse { --hps-color-text-primary:var(--hps-color-text-inverse); --hps-color-text-secondary:color-mix(in srgb,var(--hps-color-text-inverse) 80%,transparent); --ink:var(--hps-color-text-inverse); --paper:var(--hps-color-bg-inverse); }
.hps-section--inverse .hps-featured,.hps-section--inverse .hps-feature { color:inherit; background:transparent; }


@media(min-width:768px) and (max-width:1023px) { .hps-section .hps-section__products ul.products { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hps-section--cols1 > .hps-section__products ul.products { grid-template-columns:minmax(0,1fr); }

/* Banner hero: copy shares the media's grid cell. Full screen fills the viewport below the header. */
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) { --hps-hero-ink: var(--hps-color-media-ink); --hps-hero-h: calc(100svh - var(--hps-hero-offset, 0px)); position: relative; grid-template-columns: minmax(0,1fr); grid-template-rows: minmax(0,1fr); gap: 0; padding: 0; overflow: hidden; isolation: isolate; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) > .hps-section__media { grid-area: 1 / 1; order: 0; width: 100%; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) > .hps-section__media :is(img,video) { display: block; width: 100%; height: auto; }
/* Fit inside the banner and zoom around its centre, preserving the media proportions. */
.hps-section--hero > .hps-section__media { overflow: hidden; }
.hps-section--hero > .hps-section__media :is(img,video) { transform: scale(var(--hps-media-zoom, 1)); transform-origin: center; object-position: center; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay).hps-section--fit-contain > .hps-section__media :is(img,video) { object-fit: contain; }
.hps-section--hero.hps-section--fullscreen > .hps-section__media { height: var(--hps-hero-h); display: grid; place-items: center; }
.hps-section--hero.hps-section--fullscreen.hps-section--fit-contain > .hps-section__media :is(img,video) { height: 100%; min-height: 0; }
.hps-section--hero.hps-section--fullscreen.hps-section--fit-cover > .hps-section__media { height: var(--hps-hero-h); }
.hps-section--hero.hps-section--fullscreen.hps-section--fit-cover > .hps-section__media :is(img,video) { height: 100%; object-fit: cover; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) > .hps-section__copy { grid-area: 1 / 1; z-index: 1; align-self: end; justify-self: start; box-sizing: border-box; max-width: min(100%, 880px); padding: clamp(24px, 4vw, 64px); color: var(--hps-hero-ink); pointer-events: none; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) > .hps-section__copy a { pointer-events: auto; }
.hps-section--hero:is(.hps-section--fullscreen,.hps-section--overlay) .hps-section__copy > :is(h1,h2,h3):last-child { margin-bottom: 0; }
.hps-section--at-bottom-center > .hps-section__copy { justify-self: center !important; text-align: center; }
.hps-section--at-bottom-right > .hps-section__copy { justify-self: end !important; text-align: right; }
.hps-section--at-center-left > .hps-section__copy { align-self: center !important; }
.hps-section--at-center > .hps-section__copy { align-self: center !important; justify-self: center !important; text-align: center; }
.hps-section--at-top-left > .hps-section__copy { align-self: start !important; }
.hps-section--at-bottom-center .hps-section__actions, .hps-section--at-center .hps-section__actions { justify-content: center; }
.hps-section--at-bottom-right .hps-section__actions { justify-content: flex-end; }
/* Optional shade; off by default so text sits cleanly on the footage. */
.hps-section--hero.hps-section--scrim::after { content: ''; grid-area: 1 / 1; z-index: 0; pointer-events: none; background: linear-gradient(to top, var(--hps-color-overlay-medium), transparent 55%); }
.hps-section--hero.hps-section--scrim.hps-section--at-top-left::after { background: linear-gradient(to bottom, var(--hps-color-overlay-medium), transparent 55%); }
.hps-section--hero.hps-section--scrim:is(.hps-section--at-center,.hps-section--at-center-left)::after { background: var(--hps-color-overlay-medium); }
/* Banner sections span the page; ordinary homepage sections retain the original shell. */
.home .site-main { width: 100%; max-width: none; padding: 0; }
.home .site-main > article > :not(.hps-section),
.home .site-main > :not(article):not(.hps-featured) { box-sizing: border-box; width: min(var(--hps-shell-max), calc(100% - 2 * var(--hps-shell-gutter))); margin-inline: auto; }
/* Keep an opaque full-width surface over pinned video, while constraining the content to the header's shell. */
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-section:not(.hps-section--hero,.hps-section--showcase,.hps-section--featured) { width: 100%; padding-inline: var(--hps-shell-inset); }
/* Banner-like showcase and featured sections run edge to edge; only their headings keep the shell. */
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > :is(.hps-section--showcase,.hps-section--featured) { width: 100%; padding-inline: 0; }
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > :is(.hps-section--showcase,.hps-section--featured) > .hps-section__copy { padding-inline: var(--hps-shell-inset); }
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-section--showcase .hps-showcase__track { padding-inline: 0; }
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-section--featured .hps-featured { padding-inline: var(--hps-layout-gutter, 32px); }
/* Loose core blocks get the same full-width canvas as sections, with their content kept in the shell. */
:is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-flow { box-sizing: border-box; display: flow-root; width: 100%; margin: 0; padding: var(--hps-spacing-48, 48px) var(--hps-shell-inset); color: var(--hps-color-text-primary); background: var(--hps-color-bg-canvas); }
.hps-flow > :first-child { margin-top: 0; }
.hps-flow > :last-child { margin-bottom: 0; }
@media (max-width: 767px) {
 :is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-flow { padding-inline: var(--hps-layout-gutter-mobile, 16px); }
 :is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > .hps-section:not(.hps-section--hero,.hps-section--showcase,.hps-section--featured) { padding-inline: var(--hps-layout-gutter-mobile, 16px); }
 :is(.home,.page-template-page-sections,.page-template-page-members) .site-main > article > :is(.hps-section--showcase,.hps-section--featured) > .hps-section__copy { padding-inline: var(--hps-layout-gutter-mobile, 16px); }
}
body:not(.home):is(.page-template-page-sections,.page-template-page-members) .site-main { width: 100%; }
.hps-section__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: var(--hps-spacing-24, 24px); }
.hps-section__actions .hps-button { margin-top: 0 !important; }
.hps-section__copy .hps-button { transition: background-color .2s ease; }
.hps-section__copy .hps-button:hover { background: color-mix(in srgb, currentColor 14%, transparent); }
@media (max-width: 767px) {
    /* A whole landscape frame is short on phones; the copy follows it instead of covering it. */
    .hps-section--hero.hps-section--fullscreen.hps-section--fit-contain { grid-template-rows: auto auto; }
    .hps-section--hero.hps-section--fullscreen.hps-section--fit-contain > .hps-section__copy { grid-area: 2 / 1; color: inherit; max-width: none; padding: 24px 16px; }
    .hps-section--hero.hps-section--fit-contain.hps-section--scrim::after { display: none; }
}

/* Pinned: the banner holds its place while the following blocks slide over it. */
.hps-section--hero.hps-section--pinned { position: sticky; top: calc(var(--hps-header-top, 0px) + var(--hps-header-h, 0px)); z-index: 0; }
.hps-section--hero.hps-section--pinned ~ * { position: relative; z-index: 1; }
.hps-section--hero.hps-section--pinned ~ :not(.hps-section) { background: var(--hps-color-bg-canvas); }
.hps-section--hero.hps-section--pinned > .hps-section__media { filter: brightness(calc(1 - var(--hps-cover, 0) * .5)); }
.hps-section--hero.hps-section--pinned > .hps-section__copy { opacity: calc(1 - var(--hps-cover, 0) * 1.5); }
@media (max-width: 767px) {
    /* The copy stacks below a whole-frame video on phones, so pin only the covering layouts there. */
    .hps-section--hero.hps-section--pinned.hps-section--fit-contain.hps-section--fullscreen { position: relative; top: auto; }
}

/* Cinematic: copy rises in line by line, then the media drifts and the copy lifts away while scrolling. */
.hps-section.hps-cine > .hps-section__media { transform: translate3d(0, calc(var(--hps-leave, 0) * 16%), 0) scale(calc(1 + (1 - var(--hps-enter, 1)) * .08 + var(--hps-leave, 0) * .06)); transform-origin: 50% 40%; will-change: transform; }
.hps-section.hps-cine.hps-section--pinned > .hps-section__media { transform: scale(calc(1 + var(--hps-leave, 0) * .06)); } /* Held in place: zoom without sliding off the top. */
.hps-section.hps-cine > .hps-section__copy { transform: translate3d(0, calc(var(--hps-leave, 0) * -72px), 0); opacity: calc(1 - var(--hps-leave, 0) * 1.3); will-change: transform, opacity; }
.hps-section.hps-cine > .hps-section__copy > *, .hps-section.hps-cine .hps-section__actions > * { opacity: 0; transform: translateY(32px); transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1), background-color .2s ease; }
.hps-section.hps-cine.hps-cine-in > .hps-section__copy > *, .hps-section.hps-cine.hps-cine-in .hps-section__actions > * { opacity: 1; transform: none; }
.hps-section.hps-cine > .hps-section__copy > :nth-child(2) { transition-delay: .12s; }
.hps-section.hps-cine .hps-section__actions > :first-child { transition-delay: .24s; }
.hps-section.hps-cine .hps-section__actions > :nth-child(2) { transition-delay: .32s; }
.hps-section.hps-cine .hps-section__actions { opacity: 1; transform: none; }

.hps-section__media video[data-hps-gif] { pointer-events: none; }

/* Product Showcase: a smooth loop where the piece passing the centre grows. Without JS it is a plain swipeable row. */
.hps-section--showcase { grid-template-columns: minmax(0,1fr); padding-inline: 0; }
.hps-section--showcase > .hps-section__copy { padding-inline: var(--hps-layout-gutter, 32px); }
.hps-section--overlap { position: relative; z-index: 1; margin-top: -30svh; }
.hps-showcase { scroll-behavior: auto; overflow-anchor: none; position: relative; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
.hps-showcase::-webkit-scrollbar { display: none; }
.hps-showcase:focus-visible { outline: 2px solid currentColor; outline-offset: -4px; }
.hps-showcase__track { display: flex; align-items: center; gap: clamp(8px, 1.5vw, 24px); width: max-content; margin: 0; padding: 96px var(--hps-layout-gutter, 32px); list-style: none; will-change: transform; }
.hps-showcase__item { flex: 0 0 auto; width: clamp(210px, 23vw, 340px); transform: scale(var(--hps-grow, 1)); opacity: var(--hps-fade, 1); transform-origin: 50% 55%; will-change: transform, opacity; }
.hps-showcase__item a { display: grid; gap: 6px; color: inherit; text-align: center; text-decoration: none; }
.hps-showcase__item a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
/* Preserve the cutouts’ alpha, colors and complete silhouette as the cards grow. */
.hps-showcase__frame { display: block; overflow: hidden; aspect-ratio: 3 / 4; }
.hps-showcase__image { display: block; width: 100%; height: 100%; object-fit: contain; }
.hps-showcase__name { margin-top: 4px; font-size: var(--hps-type-heading-size); font-weight: var(--hps-font-weight-bold); line-height: var(--hps-type-heading-line); text-transform: uppercase; }
.hps-showcase__price { font-size: var(--hps-type-price-size); opacity: .75; }
@media (max-width: 767px) {
    /* Smaller pieces and just enough room for the centre one to grow. */
    .hps-section--showcase { gap: 16px; }
    .hps-showcase__item { width: 44vw; }
    .hps-showcase__track { padding-block: 44px 36px; }
    .hps-section--overlap { margin-top: -18svh; }
}

/* The standalone showcase fits beneath the sticky header, including scaled card edges. */
.hps-section--showcase { padding-block: 24px; scroll-margin-top: 0; }
.hps-section--showcase .hps-showcase__track { padding-block: var(--hps-showcase-pad, 48px); }
.hps-section--showcase .hps-showcase__frame { max-height: var(--hps-showcase-frame-max, none); }
.hps-editor-track-actions, .hps-editor-media { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 16px; }
